Node Components

Ai Node

A text highlighter for AI-generated content.

Blockquote Node

A quote component for block quotes.

Callout Node

Renders a customizable callout element with an emoji picker.

Code Block Node

A code block with syntax highlighting, language selection, and copy functionality.

Code Node

An inline component for code snippets.

Comment Node

A text component for displaying comments with visual indicators.

Suggestion Node

A suggestion component for suggestions.

Block Suggestion

A suggestion component for suggestions.

Suggestion Toolbar Button

A suggestion toolbar component for suggestions.

Column Node

A resizable column component for layout.

Date Node

A date field component with calendar picker.

Emoji Node

An input component for emoji search and insertion.

Equation Node

Displays a LaTeX equation element with an editable popover for inputting and rendering mathematical expressions.

Heading Node

A heading with multiple level support.

Hr Node

A horizontal rule component with focus states.

Media Image Node

Image element with lazy loading, resizing capabilities, and optional caption.

Media Preview Dialog

A modal component for previewing and manipulating images.

Link Node

A component for rendering hyperlinks with hover states.

Media Audio Node

A component for embedded media content with resizing and caption support.

Media Embed Node

A component for embedded media content with resizing and caption support.

Media File Node

A component for embedded media content with resizing and caption support.

Media Placeholder Node

Renders a placeholder for various media types with upload functionality.

Media Video Node

Renders a video element with support for YouTube, custom uploads, and captions.

Mention Node

A mention element with customizable prefix and label.

Paragraph Node

A paragraph block.

Slash Node

A command input component for inserting various elements.

Table Node

A table component with floating toolbar and border customization.

Toc Node

A table of contents component with links to document headings.

Toggle Node

A collapsible component for toggling content visibility.

Components

Ai Menu

A menu for generating and inserting AI-powered content in the editor.

Ai Toolbar Button

A toolbar button that triggers the AI menu from the editor toolbar.

Block Context Menu

A context menu for performing actions on selected blocks.

Block Menu

A menu for transforming block elements.

Block Selection

A visual overlay that highlights selected blocks in the editor.

Caption

A caption component with editable textarea for media elements.

Font Color Toolbar Button

A dropdown menu for applying text and background colors.

Comment Toolbar Button

A toolbar button for adding and managing comments.

Block Discussion

A popover for displaying and managing comments with replies.

Floating Discussion

Floating comments and suggestions with replies.

Cursor Overlay

A visual overlay for collaborative cursors and selections.

Block Draggable

A drag and drop system for reordering blocks with visual indicators.

Editor

Core components for the editor.

Emoji Toolbar Button

A comprehensive emoji picker with search and category navigation.

Floating Toolbar Buttons

A set of formatting buttons for the floating toolbar.

Floating Toolbar

A toolbar that appears above selected text with formatting options.

Ghost Text

Renders a ghost text at the cursor position.

Inline Combobox

An autocomplete combobox for inline suggestions.

Equation Toolbar Button

A toolbar button for inserting and editing inline equations.

Link Toolbar

A floating toolbar for editing link properties.

Link Toolbar Button

A toolbar button for inserting and managing links.

Mark Toolbar Button

A toolbar control for basic text formatting.

Media Toolbar

A toolbar for aligning and managing media elements.

More Toolbar Button

A dropdown menu with additional block transformation options.

Media Upload Toast

A toast notification for media upload progress.

Resize Handle

A component for resizing elements with directional handles.

Toc Sidebar

A sidebar that displays and navigates document headings.

Turn Into Toolbar Button

A dropdown menu for converting between block types.

Primitives