Композер: emphasis toolbar для inline-форматирования

## Что это Над композером появляется компактная toolbar c кнопками bold/italic/code/strikethrough/link, которые применяют markdown-разметку к выделенному тексту. Поддерживаются hotkeys: Cmd/Ctrl+B (bold), Cmd/Ctrl+I (italic), Cmd/Ctrl+E (inline code), Cmd/Ctrl+K (link). При отсутствии выделения хоткей вставляет парные маркеры и ставит каретку между ними. Toolbar показывает actual state — кнопка bold подсвечена, если каретка стоит внутри `**...**`. При drag-выделении мульти-строк форматирование применяется per-line корректно (без обёртки переводов строк). Все действия undoable через Cmd/Ctrl+Z. Компоненты: `apps/electron/src/components/Composer/EmphasisToolbar`, `@rox-one/ui/Toolbar`. Парсер markdown — лёгкий regex-based для inline-разметки; block-level (heading, list) добавлять не будем, чтобы не конкурировать с rendered-сообщениями. ## Зачем Пользователи пишут промпты на 200-500 слов с подчёркиванием ключевых терминов через `**bold**` и кода через backticks. Без toolbar это либо ручная разметка с ошибками (`*bold*` вместо `**bold**`), либо отказ от форматирования вообще. Toolbar делает форматирование 1-click и снижает порог входа для не-технических пользователей. ## Источники вдохновения - [shadcnblocks/kibo](https://github.com/shadcnblocks/kibo) — composable accessible UI registry для toolbar - [elevenlabs/ui](https://github.com/elevenlabs/ui) — мультимодальный композер с inline-форматированием - [MrSibe/KnowNote](https://github.com/MrSibe/KnowNote) — local-first Electron AI-чат с rich-text композером ## 🔗 Linear - [PZD-450](https://linear.app/kuhjie/issue/PZD-450) — backing ticket

Please authenticate to join the conversation.

Upvoters
Status

In Review

Board
🌊

Frictionless UX

Date

About 19 hours ago

Author

agi

Subscribe to post

Get notified by email when there are changes.