feat(editor): Notion-grade chrome on official MIT Tiptap parts (0297) - #468
Merged
Conversation
added 9 commits
July 10, 2026 15:15
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Signed-off-by: xNet Test <test@xnet.dev>
…ag stacks Replaces the two parallel homegrown drag-handle implementations (extensions/drag-handle PM-plugin stack and components/DragHandle React-hook stack, ~1.7k LOC) with @tiptap/extension-drag-handle(-react) 3.16.0 (MIT since June 2025), rendered by RichTextEditor itself. Block moves now go through ProseMirror's native drag machinery (NodeRangeSelection), which maps positions through collab transactions instead of the old content-fingerprint heuristic. The drop indicator is the standard dropcursor, styled via .xnet-drop-cursor. Removed exports: DragHandleExtension, DragHandle, DragHandlePluginKey, createDragDropPlugin, DragDropPluginKey, createDropIndicatorPlugin, DropIndicatorPluginKey (extensions.ts); DragHandleComponent, DropIndicator, useDragHandle, useDragDrop, useDropIndicator (react.ts). No consumers outside the package (verified repo-wide). Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Signed-off-by: xNet Test <test@xnet.dev>
Rewrites the shared suggestion-popup renderer (slash commands, @-mentions, [[wikilinks, #hashtags) on @floating-ui/dom — the stack Tiptap v3 itself uses — and drops the tippy.js dependency. The popup is a bare body-level container positioned with fixed strategy + offset/flip/shift middleware and tracked via autoUpdate, replacing the tippy 'slash-menu' theme. Also fixes an infinite React update loop found while verifying: the DragHandle react wrapper keys its plugin registration on the computePositionConfig object identity, so it must be a module-level constant, not an inline literal. Verified live: slash menu opens at the caret, flips above it at the bottom viewport edge, and shifts fully inside the viewport. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Signed-off-by: xNet Test <test@xnet.dev>
…tingToolbar Vendors the Button/ButtonGroup and Toolbar/ToolbarGroup/ToolbarSeparator primitives plus their use-menu-navigation/use-composed-ref hooks from ueberdosis/tiptap-ui-components (MIT (c) 2025 Tiptap) into packages/editor/src/components/ui/ — copied and adapted (SCSS design system replaced with our Tailwind tokens, tooltips rendered with @xnetjs/ui primitives), never CLI-managed. FloatingToolbar's local ToolbarButton/ToolbarDivider become thin domain adapters over the vendored primitives, and both toolbar modes now render through the Toolbar primitive, which adds the roving arrow-key/Home/End keyboard navigation the homegrown containers lacked. editor-ux-state.ts (mode policy) is untouched; verified live that the fixed mobile bar renders 22 buttons through the new primitive. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Signed-off-by: xNet Test <test@xnet.dev>
Bundles @tiptap/extension-emoji (':' shortcode picker via the shared
Floating UI suggestion popup + new EmojiMenu on the listbox contract)
and @tiptap/extension-mathematics (KaTeX inline/block math) — both MIT
since June 2025. Schema nodes are statically bundled per the
extension-tiers rule; document-compat gains emoji/inlineMath/blockMath
in CURRENT_NODE_TYPES and EDITOR_DOCUMENT_SCHEMA_VERSION bumps to 3.
TableOfContents + UniqueID are deferred (no consuming surface; id-attr
churn risk) and ToggleExtension is kept over extension-details (node
names don't round-trip) — decisions recorded in the exploration doc.
Verified live: ':smi' opens the picker and inserts an emoji node;
insertInlineMath renders through KaTeX.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Signed-off-by: xNet Test <test@xnet.dev>
… decisions Adds a two-client Yjs round-trip test spanning emoji/inlineMath/blockMath plus callout/toggle/wikilink/codeBlock, records the chrome-vs-content jank inventory and adoption decisions in the exploration, and files the BlockNote watching brief (#466). Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Signed-off-by: xNet Test <test@xnet.dev>
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Signed-off-by: xNet Test <test@xnet.dev>
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Signed-off-by: xNet Test <test@xnet.dev>
…helf-notion-like-editor # Conflicts: # .claude/launch.json
no-extra-semi errors from the upstream formatting style. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Signed-off-by: xNet Test <test@xnet.dev>
Contributor
🖼️ UI changes in this PRInteractionsAuto-captured by CI · run. Informational — not a blocking check. |
The 0297 editor additions pushed the main bundle past workbox's 6 MB precache cap, failing the PWA build. Manual chunks keep each file under the cap and cache the heavy leaf libraries independently. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Signed-off-by: xNet Test <test@xnet.dev>
Contributor
|
Preview removed for PR #468. |
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
1 participant
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.
Implements exploration 0297 (doc): rather than replacing the editor with an off-the-shelf package (none fits our Yjs/ProseMirror document model), this replaces the janky homegrown chrome with Tiptap's official MIT pieces.
What changed
extensions/drag-handle/PM-plugin andcomponents/DragHandle/React-hook, ~1.7k LOC) are deleted in favor of@tiptap/extension-drag-handle(-react)3.16.0 (MIT since June 2025). Block moves now use ProseMirror-nativeNodeRangeSelectiondrags, which map positions through collab transactions instead of the old content-fingerprint heuristic; the drop indicator is the standard dropcursor (.xnet-drop-cursor).@,[[,#) is rewritten on@floating-ui/dom(fixed strategy + offset/flip/shift + autoUpdate). Verified live: the slash menu flips above the caret at the bottom viewport edge and shifts fully inside the viewport.ueberdosis/tiptap-ui-components(MIT © 2025 Tiptap) live inpackages/editor/src/components/ui/— copied and adapted to our Tailwind tokens, never CLI-managed. FloatingToolbar's local components are now thin adapters over them; both toolbar modes gain roving arrow-key/Home/End navigation.editor-ux-state.ts(mode policy) untouched.:shortcode picker through the shared popup, KaTeX inline/block math. Schema nodes are statically bundled per the extension-tier rule;document-compatgainsemoji/inlineMath/blockMathandEDITOR_DOCUMENT_SCHEMA_VERSIONbumps to 3. TableOfContents/UniqueID deferred (no consuming surface),ToggleExtensionkept overextension-details(nodes don't round-trip) — decisions recorded in the doc.computePositionConfigidentity — an inline literal caused an infinite React update loop; it must be a module-level constant.Numbers
packages/editor/src(907+ / 1,977−).tippy.jsin the tree; no@tiptap/clianywhere; every new dependency is MIT.Removed exports (private pkg, no changeset needed)
DragHandleExtension,DragHandle,DragHandlePluginKey,createDragDropPlugin,DragDropPluginKey,createDropIndicatorPlugin,DropIndicatorPluginKey,DragHandleComponent,DropIndicator,useDragHandle,useDragDrop,useDropIndicator— no consumers outside the package (verified repo-wide).@xnetjs/editorisprivate: trueand changeset-ignored.Watching brief for BlockNote filed as #466.
🤖 Generated with Claude Code