@brandup/ui-richeditor 1.0.36 → 1.0.38

package/README.md

@@ -8,7 +8,7 @@
 
 ## Установка
 
-```
+```bash
 npm i @brandup/ui-richeditor
 ```
 
@@ -40,13 +40,15 @@ editor.onChange(({ value }) => console.log(value));
 ## Опции (`RichEditorOptions`)
 
 | Опция | Тип | Описание |
-|---|---|---|
+| --- | --- | --- |
 | `format` | `boolean` | Включает форматирование и панель инструментов |
 | `tools` | `FormatTool[]` | Состав инструментов (по умолчанию все) |
+| `actions` | `EditorAction[]` | Кнопки действий в панели: `emoji`, `erase`, `undo`, `redo` (по умолчанию нет) |
 | `storage` | `"html" \| "markdown"` | Формат сериализации значения (по умолчанию `html`) |
 | `markers` | `Partial<FormatMarkers>` | Переопределение markdown-маркеров по инструментам |
 | `placeholder` | `string \| null` | Текст-заглушка |
 | `multiline` | `boolean` | Многострочный режим |
+| `paragraph` | `"block" \| "break"` | Что делает Enter: новый абзац (по умолчанию) или мягкий перенос |
 | `readonly` | `boolean` | Только для чтения — запрещает ввод и изменение текста (выделение и копирование остаются) |
 | `toolbarContainer` | `HTMLElement \| null` | Контейнер для панели; по умолчанию `document.body` (`position: fixed`). Если задан — панель монтируется в него и позиционируется над ним (`position: absolute`). Контейнер должен быть `position: relative` |
 | `value` | `string` | Начальное значение |
@@ -60,13 +62,22 @@ editor.onChange(({ value }) => console.log(value));
 ## API
 
 | Член | Описание |
-|---|---|
+| --- | --- |
 | `editable` | Редактируемый элемент |
-| `format`, `formatTools`, `formatStorage`, `formatMarkers`, `multiline` | Параметры экземпляра |
+| `format`, `formatTools`, `editorActions`, `formatStorage`, `formatMarkers`, `multiline` | Параметры экземпляра |
 | `getValue(): string` | Сериализованное значение (по `storage`) |
 | `setValue(value: string): void` | Установить значение (нормализует, генерирует `change`) |
 | `getLength(): number` | Длина текста (без учёта переводов строк) |
 | `focus(): void` | Установить фокус |
+| `applyFormat(tool): void` | Переключить формат на выделении (слово целиком) |
+| `isToolActive(tool): boolean` | Активен ли формат на текущем выделении |
+| `clearFormat(): void` | Снять всё форматирование с выделения (без выделения — со слова под кареткой) |
+| `clearAllFormat(): void` | Снять всё форматирование со всего содержимого |
+| `undo(): void`, `redo(): void` | Отмена и повтор |
+| `canUndo`, `canRedo` | Доступность отмены/повтора |
+| `applyAction(action): void` | Выполнить действие панели (`erase`/`undo`/`redo`) |
+| `isActionEnabled(action): boolean` | Доступно ли действие сейчас |
+| `insertText(text): void` | Вставить текст в каретку (или вместо выделения) с учётом режима набора |
 | `onChange(handler)` | Подписка на событие `richeditor-change` |
 | `destroy(): void` | Разворачивает элемент обратно и освобождает ресурсы |
 
@@ -79,6 +90,33 @@ editor.onChange(({ value }) => console.log(value));
 - **Отмена/повтор**: `Ctrl/Cmd+Z` — отмена, `Ctrl+Y` или `Ctrl/Cmd+Shift+Z` — повтор. История форматирования, абзацев, переносов и печати ведётся редактором (нативный undo не видит ручных DOM-правок), поэтому **доступна только при включённом форматировании** (`format: true`). Печать коалесится в один шаг отмены по паузе ~300 мс; глубина истории — 100 шагов.
 - При потере фокуса и после `setValue` пробелы нормализуются (схлопывание повторов + обрезка краёв строк).
 
+## Очистка форматирования и действия панели
+
+`clearFormat()` снимает **все** форматы сразу — с выделения, а без выделения со слова под кареткой (та же логика, что и у применения формата). Режим набора при этом сбрасывается. Распознаются и теги-синонимы (`STRONG`/`EM`/`DEL`/`INS`), которые могли прийти из вставки или `setValue`. `clearAllFormat()` чистит всё содержимое и выделения не требует.
+
+Обе операции попадают в историю (откатываются одним `Ctrl+Z`) и не создают пустой шаг отмены, если очищать нечего.
+
+Кроме кнопок форматирования панель может показывать кнопки действий — они подключаются **явно** через `actions`:
+
+```typescript
+new RichEditor(elem, { format: true, actions: ["emoji", "erase", "undo", "redo"] });
+```
+
+| Действие | Кнопка | Что делает | Когда недоступна |
+| --- | --- | --- | --- |
+| `emoji` | Вставить смайлик | открывает панель вставки | в режиме `readonly` |
+| `erase` | Очистить форматирование | `clearFormat()` | нет форматирования на выделении |
+| `undo` | Отменить | `undo()` | история пуста |
+| `redo` | Повторить | `redo()` | нечего повторять |
+
+Кнопки действий (`.action-button`) отделены от кнопок форматирования (`.format-button`) разделителем `.split` и получают атрибут `disabled`, когда действие недоступно. Панель показывается и в том случае, если инструментов форматирования нет, а действия заданы.
+
+### Панель смайликов
+
+Кнопка `emoji` открывает под панелью попап `.ui-richeditor-emoji` со списком символов (`EMOJIS` — экспортируется пакетом). Выбранный символ вставляется через `insertText()`, то есть в текущую каретку и с учётом ожидающих форматов режима набора; попап после выбора закрывается.
+
+Открытием и закрытием управляет `PopupManager` из [`@brandup/ui-kit`](../brandup-ui-kit) — оттуда же приходят базовые стили `.ui-popup`. Ни кнопка, ни попап не забирают фокус у редактора (`mousedown` гасится), поэтому каретка и выделение сохраняются. Список кнопок собирается лениво, при первом открытии.
+
 ## Многострочный режим: абзацы и переносы
 
 При `multiline: true` контент структурируется по абзацам:
@@ -87,6 +125,10 @@ editor.onChange(({ value }) => console.log(value));
 - **Shift+Enter** или **Ctrl/Cmd+Enter** → мягкий перенос (`<br>`) внутри абзаца;
 - блуждающий текст и `<div>` нормализуются в `<p>` при вводе.
 
+Опция `paragraph: "break"` меняет это местами — Enter даёт мягкий перенос, а абзац набирается модификатором либо просто двумя переносами. Так устроены мессенджеры, и это важно при `storage: "markdown"`: в режиме по умолчанию каждый Enter уходит в значение пустой строкой (`\n\n`), а в `break` — одним переносом (`\n`).
+
+В этом режиме абзацных блоков в содержимом нет вовсе: значение загружается плоским текстом, где каждый `\n` становится `<br>` внутри единственного `<p>`. Иначе два переноса рисовались бы двумя абзацами, а у хоста без отступов между ними это неотличимо от одного переноса — значение расходилось бы с видимым текстом.
+
 Хвостовой перенос абзаца отбрасывается (это `<br>`-заполнитель); пустая строка делается отдельным абзацем.
 
 При нормализации (потеря фокуса, `setValue`, инициализация) пустые абзацы удаляются.
@@ -105,14 +147,18 @@ editor.onChange(({ value }) => console.log(value));
 ## Формат хранения
 
 | `storage` | Хранение | Абзац / мягкий перенос | Маркеры форматирования |
-|---|---|---|---|
+| --- | --- | --- | --- |
 | `html` | Санитизированный HTML | `<p>…</p>` / `<br>` | `<b>`, `<i>`, `<s>`, `<u>` |
-| `markdown` | Лёгкая разметка | `\n\n` / `\n` | `**жирный**`, `*курсив*`, `~~зачёркнутый~~`, `++подчёркнутый++` |
+| `markdown` | Лёгкая разметка | `\n\n` / `\n` | `**жирный**`, `_курсив_`, `~зачёркнутый~`, `__подчёркнутый__` |
 
 Без форматирования (plain) значение хранится как markdown без инструментов: абзацы `\n\n`, мягкий перенос `\n`.
 
 Маркеры markdown настраиваются через `markers`. При разборе применяются по убыванию длины, поэтому длинный маркер срабатывает раньше короткого-префикса. Глубоко вложенные комбинации гарантированно сохраняются только в режиме `html`.
 
+Разметка распознаётся по правилам мессенджеров: маркер стоит на **границе слова**, содержимое не начинается и не заканчивается пробелом и не пересекает перенос строки. Поэтому `5**4 = 20`, `2 ** 2 ** 2` и `файл_имя_файла.txt` остаются обычным текстом — иначе редактор показывал бы форматирование там, где получатель увидит исходные символы. Форматирование применяется к словам целиком, так что собственный вывод редактора всегда разбирается обратно.
+
+Краевые пробелы при сериализации выносятся за маркеры (`<b> слово </b>дальше` → `**слово** дальше`), иначе разметка не сработала бы ни у нас, ни у мессенджера. А вот формат, приклеенный к соседнему слову — такое приходит только со вставкой внешнего HTML (`супер<b>бонус</b>`), — маркерами невыразим: значение сохранится как `супер**бонус**` и разметкой уже не станет. Это осознанное решение: текст остаётся ровно тем, что набрал пользователь, а не молча теряет форматирование.
+
 ## CSS
 
 Подключается `richeditor.less`. Цветовые переменные `--input-*` берутся из `@brandup/ui-kit` (с fallback-значениями для standalone). Классы: `focused` на обёртке (поле в фокусе), `visible` на общей панели (показана), `active` на кнопке инструмента (формат активен на выделении).

package/package.json

@@ -27,11 +27,12 @@
     "email": "it@brandup.online"
   },
   "license": "Apache-2.0",
-  "version": "1.0.36",
+  "version": "1.0.38",
   "main": "source/index.ts",
   "types": "source/index.ts",
   "dependencies": {
-    "@brandup/ui": "^2.0.5"
+    "@brandup/ui": "^2.0.7",
+    "@brandup/ui-kit": "^1.0.38"
   },
   "files": [
     "source",

package/source/editing.ts

@@ -179,10 +179,12 @@ export function trimParagraphEdges(p: HTMLElement) {
 	last.textContent = (last.textContent ?? "").replace(/ $/, "");
 }
 
-/** Расширяет выделение до целых слов на границах (для применения формата к слову целиком). */
-export function expandSelectionToWords(editable: HTMLElement, selection: Selection) {
-	const range = selection.getRangeAt(0);
-
+/**
+ * Диапазон, расширенный до целых слов на границах (для применения формата к слову целиком).
+ * Возвращает новый Range и не трогает выделение — вызывающий сам решает, править ли по нему
+ * и когда двигать каретку.
+ */
+export function expandRangeToWords(editable: HTMLElement, range: Range): Range {
 	const { startContainer, endContainer } = range;
 	let startOffset = range.startOffset;
 	let endOffset = range.endOffset;
@@ -197,13 +199,10 @@ export function expandSelectionToWords(editable: HTMLElement, selection: Selecti
 		while (endOffset < text.length && !/\s/.test(text[endOffset])) endOffset++;
 	}
 
-	if (startOffset === range.startOffset && endOffset === range.endOffset) return;
-
 	const expanded = document.createRange();
 	expanded.setStart(startContainer, startOffset);
 	expanded.setEnd(endContainer, endOffset);
-	selection.removeAllRanges();
-	selection.addRange(expanded);
+	return expanded;
 }
 
 /** Убирает пробелы по краям выделения (например, после двойного клика по слову). */

package/source/emoji.ts

@@ -0,0 +1,53 @@
+// Набор смайликов для кнопки вставки в тулбаре. Все символы — одиночные кодпойнты (без
+// ZWJ-последовательностей и модификаторов), поэтому переносятся в текст как единое целое.
+// Внимание: в UTF-16 каждый занимает две единицы, и getLength() (а значит и maxlength у
+// хоста) считает такой символ за два.
+
+/** Смайлики, доступные в панели вставки (порядок сохраняется в UI). */
+export const EMOJIS: string[] = [
+	"😀", "😁", "😂", "😃", "😄", "😅", "😆", "😉", "😊", "😋", "😌", "😍", "😏", "😒", "😓", "😔",
+	"😖", "😘", "😚", "😜", "😝", "😞", "😠", "😡", "😢", "😣", "😤", "😥", "😨", "😩", "😪", "😫",
+	"😭", "😰", "😱", "😲", "😳", "😵", "😷", "😸", "😹", "😺", "😻", "😼", "😽", "😾", "😿", "🙀",
+	"🙅", "🙆", "🙇", "🙈", "🙉", "🙊", "🙋", "🙌", "🙍", "🙎", "🙏", "🚀", "🚃", "🚄", "🚅", "🚇",
+	"🚉", "🚌", "🚏", "🚑", "🚒", "🚓", "🚕", "🚗", "🚙", "🚚", "🚢", "🚤", "🚥", "🚧", "🚨", "🚩",
+	"🚪", "🚫", "🚬", "🚭", "🚲", "🚶", "🚹", "🚺", "🚻", "🚼", "🚽", "🚾", "🛀", "🅰", "🅱", "🅾",
+	"🅿", "🆎", "🆑", "🆒", "🆓", "🆔", "🆕", "🆖", "🆗", "🆘", "🆙", "🆚", "🈁", "🈂", "🈚", "🈯",
+	"🈲", "🈳", "🈴", "🈵", "🈶", "🈷", "🈸", "🈹", "🈺", "🉐", "🉑", "🀄", "🃏", "🌀", "🌁", "🌂",
+	"🌃", "🌄", "🌅", "🌆", "🌇", "🌈", "🌉", "🌊", "🌋", "🌌", "🌏", "🌑", "🌓", "🌔", "🌕", "🌙",
+	"🌛", "🌟", "🌠", "🌰", "🌱", "🌴", "🌵", "🌷", "🌸", "🌹", "🌺", "🌻", "🌼", "🌽", "🌾", "🌿",
+	"🍀", "🍁", "🍂", "🍃", "🍄", "🍅", "🍆", "🍇", "🍈", "🍉", "🍊", "🍌", "🍍", "🍎", "🍏", "🍑",
+	"🍒", "🍓", "🍔", "🍕", "🍖", "🍗", "🍘", "🍙", "🍚", "🍛", "🍜", "🍝", "🍞", "🍟", "🍠", "🍡",
+	"🍢", "🍣", "🍤", "🍥", "🍦", "🍧", "🍨", "🍩", "🍪", "🍫", "🍬", "🍭", "🍮", "🍯", "🍰", "🍱",
+	"🍲", "🍳", "🍴", "🍵", "🍶", "🍷", "🍸", "🍹", "🍺", "🍻", "🎀", "🎁", "🎂", "🎃", "🎄", "🎅",
+	"🎆", "🎇", "🎈", "🎉", "🎊", "🎋", "🎌", "🎍", "🎎", "🎏", "🎐", "🎑", "🎒", "🎓", "🎠", "🎡",
+	"🎢", "🎣", "🎤", "🎥", "🎦", "🎧", "🎨", "🎩", "🎪", "🎫", "🎬", "🎭", "🎮", "🎯", "🎰", "🎱",
+	"🎲", "🎳", "🎴", "🎵", "🎶", "🎷", "🎸", "🎹", "🎺", "🎻", "🎼", "🎽", "🎾", "🎿", "🏀", "🏁",
+	"🏂", "🏃", "🏄", "🏆", "🏈", "🏊", "🏠", "🏡", "🏢", "🏣", "🏥", "🏦", "🏧", "🏨", "🏩", "🏪",
+	"🏫", "🏬", "🏭", "🏮", "🏯", "🏰", "🐌", "🐍", "🐎", "🐑", "🐒", "🐔", "🐗", "🐘", "🐙", "🐚",
+	"🐛", "🐜", "🐝", "🐞", "🐟", "🐠", "🐡", "🐢", "🐣", "🐤", "🐥", "🐦", "🐧", "🐨", "🐩", "🐫",
+	"🐬", "🐭", "🐮", "🐯", "🐰", "🐱", "🐲", "🐳", "🐴", "🐵", "🐶", "🐷", "🐸", "🐹", "🐺", "🐻",
+	"🐼", "🐽", "🐾", "👀", "👂", "👃", "👄", "👅", "👆", "👇", "👈", "👉", "👊", "👋", "👌", "👍",
+	"👎", "👏", "👐", "👑", "👒", "👓", "👔", "👕", "👖", "👗", "👘", "👙", "👚", "👛", "👜", "👝",
+	"👞", "👟", "👠", "👡", "👢", "👣", "👤", "👦", "👧", "👨", "👩", "👪", "👫", "👮", "👯", "👰",
+	"👱", "👲", "👳", "👴", "👵", "👶", "👷", "👸", "👹", "👺", "👻", "👼", "👽", "👾", "👿", "💀",
+	"💁", "💂", "💃", "💄", "💅", "💆", "💇", "💈", "💉", "💊", "💋", "💌", "💍", "💎", "💏", "💐",
+	"💑", "💒", "💓", "💔", "💕", "💖", "💗", "💘", "💙", "💚", "💛", "💜", "💝", "💞", "💟", "💠",
+	"💡", "💢", "💣", "💤", "💥", "💦", "💧", "💨", "💩", "💪", "💫", "💬", "💮", "💯", "💰", "💱",
+	"💲", "💳", "💴", "💵", "💸", "💹", "💺", "💻", "💼", "💽", "💾", "💿", "📀", "📁", "📂", "📃",
+	"📄", "📅", "📆", "📇", "📈", "📉", "📊", "📋", "📌", "📍", "📎", "📏", "📐", "📑", "📒", "📓",
+	"📔", "📕", "📖", "📗", "📘", "📙", "📚", "📛", "📜", "📝", "📞", "📟", "📠", "📡", "📢", "📣",
+	"📤", "📥", "📦", "📧", "📨", "📩", "📪", "📫", "📮", "📰", "📱", "📲", "📳", "📴", "📶", "📷",
+	"📹", "📺", "📻", "📼", "🔃", "🔊", "🔋", "🔌", "🔍", "🔎", "🔏", "🔐", "🔑", "🔒", "🔓", "🔔",
+	"🔖", "🔗", "🔘", "🔙", "🔚", "🔛", "🔜", "🔝", "🔞", "🔟", "🔠", "🔡", "🔢", "🔣", "🔤", "🔥",
+	"🔦", "🔧", "🔨", "🔩", "🔪", "🔫", "🔮", "🔯", "🔰", "🔱", "🔲", "🔳", "🔴", "🔵", "🔶", "🔷",
+	"🔸", "🔹", "🔺", "🔻", "🔼", "🔽", "🕐", "🕑", "🕒", "🕓", "🕔", "🕕", "🕖", "🕗", "🕘", "🕙",
+	"🕚", "🕛", "🗻", "🗼", "🗽", "🗾", "🗿", "😇", "😈", "😎", "😐", "😑", "😕", "😗", "😙", "😛",
+	"😟", "😦", "😧", "😬", "😮", "😯", "😴", "😶", "🚁", "🚂", "🚆", "🚈", "🚊", "🚍", "🚎", "🚐",
+	"🚔", "🚖", "🚘", "🚛", "🚜", "🚝", "🚞", "🚟", "🚠", "🚡", "🚣", "🚦", "🚮", "🚯", "🚰", "🚱",
+	"🚳", "🚴", "🚵", "🚷", "🚸", "🚿", "🛁", "🛂", "🛃", "🛄", "🛅", "🌍", "🌎", "🌐", "🌒", "🌖",
+	"🌗", "🌘", "🌚", "🌜", "🌝", "🌞", "🌲", "🌳", "🍋", "🍐", "🍼", "🏇", "🏉", "🏤", "🐀", "🐁",
+	"🐂", "🐃", "🐄", "🐅", "🐆", "🐇", "🐈", "🐉", "🐊", "🐋", "🐏", "🐐", "🐓", "🐕", "🐖", "🐪",
+	"👥", "👬", "👭", "💭", "💶", "💷", "📬", "📭", "📯", "📵", "🔀", "🔁", "🔂", "🔄", "🔅", "🔆",
+	"🔇", "🔉", "🔕", "🔬", "🔭", "🕜", "🕝", "🕞", "🕟", "🕠", "🕡", "🕢", "🕣", "🕤", "🕥", "🕦",
+	"🕧",
+];

package/source/format-config.ts

@@ -3,11 +3,23 @@
 export type FormatTool = "bold" | "italic" | "strike" | "underline";
 export type FormatStorage = "html" | "markdown";
 
+/**
+ * Что делает Enter в многострочном режиме.
+ *
+ * `block` — новый абзац (`<p>`, в markdown `\n\n`); модификатор даёт мягкий перенос.
+ * `break` — мягкий перенос (`<br>`, в markdown `\n`), как в мессенджерах: абзац там набирается
+ * двумя переносами. Без этого каждый Enter уезжал бы в хранилище пустой строкой.
+ */
+export type ParagraphMode = "block" | "break";
+
+/** Действие редактора (не формат): вставка смайлика, очистка форматирования, отмена и повтор. */
+export type EditorAction = "emoji" | "erase" | "undo" | "redo";
+
 export const ALL_FORMAT_TOOLS: FormatTool[] = ["bold", "italic", "strike", "underline"];
 
+export const ALL_EDITOR_ACTIONS: EditorAction[] = ["emoji", "erase", "undo", "redo"];
+
 interface FormatToolDef {
-	/** Имя команды (атрибут command у кнопки и registerCommand). */
-	command: string;
 	/** Канонический тег при оборачивании и сериализации. */
 	tag: string;
 	/** Теги, распознаваемые при разборе входного HTML. */
@@ -22,7 +34,6 @@ interface FormatToolDef {
 
 export const FORMAT_TOOLS: Record<FormatTool, FormatToolDef> = {
 	bold: {
-		command: "format-bold",
 		tag: "b",
 		matchTags: ["B", "STRONG"],
 		md: "**",
@@ -30,31 +41,40 @@ export const FORMAT_TOOLS: Record<FormatTool, FormatToolDef> = {
 		title: "Жирный",
 	},
 	italic: {
-		command: "format-italic",
 		tag: "i",
 		matchTags: ["I", "EM"],
-		md: "*",
+		md: "_",
 		hotkey: "i",
 		title: "Курсив",
 	},
 	strike: {
-		command: "format-strike",
 		tag: "s",
 		matchTags: ["S", "STRIKE", "DEL"],
-		md: "~~",
+		md: "~",
 		hotkey: "",
 		title: "Зачёркнутый",
 	},
 	underline: {
-		command: "format-underline",
 		tag: "u",
 		matchTags: ["U", "INS"],
-		md: "++",
+		md: "__",
 		hotkey: "u",
 		title: "Подчёркнутый",
 	},
 };
 
+interface EditorActionDef {
+	/** Подсказка на кнопке. */
+	title: string;
+}
+
+export const EDITOR_ACTIONS: Record<EditorAction, EditorActionDef> = {
+	emoji: { title: "Вставить смайлик" },
+	erase: { title: "Очистить форматирование" },
+	undo: { title: "Отменить (Ctrl+Z)" },
+	redo: { title: "Повторить (Ctrl+Y)" },
+};
+
 /** Markdown-маркер для каждого инструмента форматирования. */
 export type FormatMarkers = Record<FormatTool, string>;
 
@@ -75,15 +95,22 @@ export const HOTKEY_TOOLS: Record<string, FormatTool> = (() => {
 	return map;
 })();
 
-/** Разбирает значение атрибута data-format-tools, оставляя только известные инструменты. */
-export function parseFormatTools(value: string | null): FormatTool[] {
-	if (value === null) return ALL_FORMAT_TOOLS.slice();
+// Разбор атрибута-списка через пробел: оставляет только известные значения,
+// убирает дубли и восстанавливает порядок объявления.
+function parseList<T extends string>(value: string, known: T[]): T[] {
+	const parsed = value.split(/\s+/).filter(Boolean);
+	return known.filter((item) => parsed.includes(item));
+}
 
-	const tools = value
-		.split(/\s+/)
-		.filter(Boolean)
-		.filter((t): t is FormatTool => (ALL_FORMAT_TOOLS as string[]).includes(t));
+/** Разбирает значение атрибута data-format-tools; отсутствие атрибута — все инструменты. */
+export function parseFormatTools(value: string | null): FormatTool[] {
+	return value === null ? ALL_FORMAT_TOOLS.slice() : parseList(value, ALL_FORMAT_TOOLS);
+}
 
-	// убираем дубли, сохраняя порядок объявления
-	return ALL_FORMAT_TOOLS.filter((t) => tools.includes(t));
+/**
+ * Разбирает значение атрибута data-editor-actions. В отличие от инструментов,
+ * действия подключаются явно: отсутствие атрибута — пустой набор.
+ */
+export function parseEditorActions(value: string | null): EditorAction[] {
+	return value === null ? [] : parseList(value, ALL_EDITOR_ACTIONS);
 }

package/source/format.ts

@@ -5,15 +5,31 @@
 //   paragraphs    — нормализация пробелов и приведение к абзацам <p>
 
 export {
+	ALL_EDITOR_ACTIONS,
 	ALL_FORMAT_TOOLS,
+	EDITOR_ACTIONS,
 	FORMAT_TOOLS,
 	HOTKEY_TOOLS,
 	defaultFormatMarkers,
+	parseEditorActions,
 	parseFormatTools,
+	type EditorAction,
 	type FormatMarkers,
 	type FormatStorage,
+	type ParagraphMode,
 	type FormatTool,
 } from "./format-config";
 export { serialize, deserialize } from "./serialize";
-export { selectionCharBounds, restoreSelection, toggleFormat, insertFormattedText, isFormatActive } from "./selection";
+export {
+	selectionCharBounds,
+	restoreSelection,
+	mapCharOffset,
+	toggleFormat,
+	clearFormat,
+	clearAllFormat,
+	hasFormatting,
+	hasAnyFormatting,
+	insertFormattedText,
+	isFormatActive,
+} from "./selection";
 export { normalizeWhitespace, normalizeParagraphs, ensureParagraphs } from "./paragraphs";

package/source/history.ts

@@ -30,6 +30,16 @@ export class EditorHistory {
 		this.__root = root;
 	}
 
+	/** Есть ли что отменять (для disabled-состояния кнопки). */
+	get canUndo(): boolean {
+		return this.__undo.length > 0;
+	}
+
+	/** Есть ли что повторять. */
+	get canRedo(): boolean {
+		return this.__redo.length > 0;
+	}
+
 	private __snapshot(): Snapshot {
 		const sel = window.getSelection();
 		let start = 0;

package/source/index.ts

@@ -1,12 +1,18 @@
 export { default } from "./richeditor";
 export * from "./richeditor";
+export { EMOJIS } from "./emoji";
 export {
+	ALL_EDITOR_ACTIONS,
 	ALL_FORMAT_TOOLS,
+	EDITOR_ACTIONS,
 	FORMAT_TOOLS,
+	parseEditorActions,
 	parseFormatTools,
 	defaultFormatMarkers,
 	normalizeWhitespace,
+	type EditorAction,
 	type FormatTool,
 	type FormatStorage,
+	type ParagraphMode,
 	type FormatMarkers,
 } from "./format";

package/source/paragraphs.ts

@@ -12,6 +12,13 @@ export function normalizeWhitespace(root: HTMLElement) {
 	type Item = { kind: "text"; node: Text } | { kind: "break" };
 	const items: Item[] = [];
 
+	// Присваивание Text.data — это «replace data» по всему узлу, а оно схлопывает границы
+	// живых Range внутри узла в его начало: каретка уезжает в начало строки. Нормализация
+	// чаще всего ничего не меняет (вызывается на blur), поэтому пишем только при отличии.
+	const setData = (node: Text, text: string) => {
+		if (node.data !== text) node.data = text;
+	};
+
 	const flatten = (node: Node) => {
 		for (const child of Array.from(node.childNodes)) {
 			if (child.nodeType === Node.TEXT_NODE) {
@@ -38,7 +45,7 @@ export function normalizeWhitespace(root: HTMLElement) {
 	for (const item of items) {
 		if (item.kind === "break") {
 			if (pendingSpaceNode) {
-				pendingSpaceNode.data = pendingSpaceNode.data.replace(/ $/, "");
+				setData(pendingSpaceNode, pendingSpaceNode.data.replace(/ $/, ""));
 				pendingSpaceNode = null;
 			}
 			atLineStart = true;
@@ -49,14 +56,14 @@ export function normalizeWhitespace(root: HTMLElement) {
 		if (atLineStart) text = text.replace(/^ /, ""); // пробел в начале строки
 		if (pendingSpaceNode && text.startsWith(" ")) text = text.slice(1); // двойной пробел на границе узлов
 
-		item.node.data = text;
+		setData(item.node, text);
 		if (text.length === 0) continue;
 
 		atLineStart = false;
 		pendingSpaceNode = text.endsWith(" ") ? item.node : null;
 	}
 
-	if (pendingSpaceNode) pendingSpaceNode.data = pendingSpaceNode.data.replace(/ $/, ""); // хвост последней строки
+	if (pendingSpaceNode) setData(pendingSpaceNode, pendingSpaceNode.data.replace(/ $/, "")); // хвост последней строки
 
 	cleanupFormatting(root); // убрать опустевшие теги, склеить узлы
 }

package/source/richeditor.less

@@ -98,7 +98,16 @@
 		margin-bottom: 6px;
 	}
 
-	& .format-button {
+	// разделитель между инструментами форматирования и действиями
+	& .split {
+		width: 1px;
+		align-self: stretch;
+		margin: 2px 3px;
+		background-color: var(--input-border-color, #aaa);
+	}
+
+	& .format-button,
+	& .action-button {
 		width: calc(var(--input-height, 46px) - 12px);
 		height: calc(var(--input-height, 46px) - 12px);
 		border-radius: calc(var(--input-border-radius, 0) - 2px);
@@ -123,5 +132,47 @@
 		&.active {
 			background-color: var(--hover--input-toolbar-button-fill, rgba(0, 0, 0, 0.12));
 		}
+
+		&[disabled] {
+			cursor: default;
+			opacity: 0.4;
+			// хит-тест проваливается на сам тулбар: браузер не диспатчит события на disabled-кнопку,
+			// и без этого mousedown не гасится — редактор теряет фокус, а панель прячется по blur
+			pointer-events: none;
+
+			&:hover {
+				background: var(--input-toolbar-button-fill, transparent);
+			}
+		}
+	}
+}
+
+// панель вставки смайликов — попап под кнопкой тулбара (открытием/закрытием управляет
+// PopupManager из @brandup/ui-kit; базовые .ui-popup-стили приходят оттуда же).
+.ui-richeditor-emoji {
+	top: 100%;
+	left: 0;
+	margin-top: 4px;
+	width: 296px;
+	max-height: 220px;
+	overflow-y: auto;
+	padding: 4px;
+	display: flex;
+	flex-flow: row wrap;
+
+	& .emoji {
+		width: 32px;
+		height: 32px;
+		padding: 0;
+		border: 0;
+		background: transparent;
+		cursor: pointer;
+		font-size: 20px;
+		line-height: 1;
+		border-radius: calc(var(--input-border-radius, 0) - 2px);
+
+		&:hover {
+			background-color: var(--hover--input-toolbar-button-fill, rgba(0, 0, 0, 0.06));
+		}
 	}
 }