Inline Tools

Editor chrome that appears directly on/around the selected node — Tiptap-driven text editing toolbar, variable picker, link panel. Lives in packages/sdk/src/chrome/inline-tools/.

Key files

• InlineEditToolbar.tsx — floating toolbar above the selected Text node when editing rich text
• PortalToolbarBelowNode.tsx — positioning portal
• TiptapRichTextContextMenu.tsx — right-click context
• TextEditor.tsx — lazy-loaded Text edit mode (Tiptap + toolbar + variables)
• TiptapContext.tsx — provider for the active editor instance
• VariablePopover.tsx — pick / edit / remove a {{variable}} chip in text
• VariableSuggestion.tsx — autocomplete when typing {{
• openLinkPanelEvent.ts — OPEN_LINK_PANEL_EVENT window event for link-panel summoning

InlineEditToolbar

Floating bar that anchors above the selected Text node while Tiptap is active. Hosts:

• Bold / Italic / Underline buttons
• Font picker (FontPanel)
• Link panel (LinkPanel) — opens via OPEN_LINK_PANEL_EVENT from anywhere
• Color pickers (text color + background highlight) using the same TokenPicker as toolbar
• More panel (MorePanel) for less-common ops
• Media inserter

The toolbar uses useClampToViewport to stay on screen. Suppressed in editor breakpoint preview views (isEditorCanvasBreakpointView).

VariablePopover

Anchored popover for managing a single data-variable chip in text. Supports:

• Switching the bound variable (Listbox)
• Editing the displayed fallback value
• Removing the chip
• ESC / outside click dismiss

Backed by AnchoredPopover (see overlays).

Related

• overlays — AnchoredPopover primitive
• Text, Link
• editor-popover-pattern.md — convention
• ToolbarPortalDropdown.tsx — portal dropdown (viewport breadcrumb / breakpoint UI; not text-specific)
• DraggablePortalDialog.tsx — draggable settings shell + useGetRectLater (TooltipDialog, node-tool NodeDialog)
• NodeDialog.tsx — NodeToolWrapper + settings dialog trigger for canvas node tools
• InlineRenderContext.tsx — inline vs portaled node-tool render path (InlineToolsRenderer)