React. Вставить тег не в конец элемента, а там где находится курсор

Есть блок у которого стоит атрибут contenteditable
Как при нажатии клавиши Enter добавлять тег br в место, где стоит курсор (каретка ввода)
Сейчас br вставляется в конце элемента, без учёта позиции каретки

    // текущий обработчик (вставка в конец узла)
    const onKeyDownHandler = (e: KeyboardEvent<HTMLDivElement>) => {
      if (e.key === 'Enter') {
        e.preventDefault();
        const activeElement = document.activeElement;
        activeElement &&
          activeElement.insertAdjacentElement(
            'beforeend',
            document.createElement('br'),
          );
        return;
      }
    };