chat: Slack-level composer markup + fix clipped inline toolbar (F-385/F-386)#95
Merged
Conversation
…/F-386) Two user-reported chat issues, fixed at the shared-surface level so comments and the Agent composer inherit everything: - Fix the selection toolbar rendering as a clipped vertical stack in chat: the fancy-menus `.fm-menu` base (column + overflow:hidden) beat `.notes__inline-toolbar` at equal specificity whenever an app's bundle emitted the runtime CSS later. Order-proof compound selector `.fm-menu.notes__inline-toolbar`, the same pattern the toolbar's own dropdowns already used. - CompactEditor grows the message-sized blocks: bulleted / numbered / to-do lists, quote and code block, via a curated Markdown shortcut vocabulary (`- ` `1. ` `[] ` `> ` fenced code, inline marks, links — deliberately no headings), plus typed-URL autolink. Enter still sends; Shift+Enter starts the NEXT list item when the caret is in a list (Slack model). - InlineToolbarPlugin gains opt-in bullet/numbered/to-do toggles (on for every CompactEditor); three new editor.inline.* strings. - Baseline theme + compact-editor.css carry the checklist face; the Lexical-free renderEditorState renders `check` lists with their checked state so a sent message matches the draft. - Real-shell visual spec (chat-rich-composer.spec.ts): asserts the toolbar's computed horizontal geometry, toolbar list toggle, Shift+Enter next-item, and `[ ] ` / `1. ` send round-trips. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Two user-reported chat issues (screenshot: selecting text popped a broken clipped shard of a toolbar; no way to write lists in a message), fixed at the shared
<CompactEditor>level so chat, comments and the Agent composer all inherit it.Fix — clipped/stacked selection toolbar (F-385)
The toolbar borrows the fancy-menus
.fm-menuglass, which shipsflex-direction: column; overflow: hidden.editor-theme.csspinnedrow/visibleat equal specificity (0,1,0), so whichever stylesheet an app's bundle emits last wins — Notes happened to order them safely, chat didn't, and the toolbar painted as a clipped vertical stack. Now the order-proof compound.fm-menu.notes__inline-toolbar(0,2,0) — the exact pattern the toolbar's own colour/overflow dropdowns already carried for the same reason.Feature — Slack composer vocabulary (F-386)
ListNode/ListItemNode/QuoteNode/CodeNode+ListPlugin/CheckListPlugin).-·1.·[]·>· fenced code · inline marks ·[text](url)— deliberately no headings (a message is not a document).InlineToolbarPlugin(listsprop, on for every CompactEditor; Notes/full editors unchanged).www.hosts gethttps://prepended.compact-editor.csscarry the checklist face; the Lexical-freerenderEditorStatenow renderschecklists with checked state, so sent messages match the draft. Inline@-mentions already rendered in-text (PR feat(mentions): Slack-style inline @-mentions in chat + agent composers, avatar circle fix #74).Verification
packages/editor589 tests green (new: composer node round-trip, curated markdown vocabulary incl. no-headings, Enter-submit vs Shift+Enter-next-item);apps/chat39 green;apps/agentgreen; typecheck + lint (incl. css-token check) clean.tests/visual/specs/chat-rich-composer.spec.ts: asserts the toolbar's computed horizontal geometry (regression for the cascade bug), toolbar list toggle, Shift+Enter next item, and[ ]/1.send round-trips.Friction log F-385/F-386 + the implementation-plan Chats-slice rung land in the docs repo alongside this.
🤖 Generated with Claude Code