react/src

Interfaces

Interface	Description
UseVizelAutoSaveResult	Auto-save hook result
UseVizelCollaborationResult	Collaboration hook result
UseVizelCommentResult	Comment hook result
UseVizelEditorStateOptions	Options accepted by useVizelEditorState.
UseVizelMarkdownOptions	Options for Markdown synchronization
UseVizelMarkdownResult	-
UseVizelVersionHistoryResult	Version history hook result
VizelBlockMenuProps	-
VizelBubbleMenuButtonProps	-
VizelBubbleMenuColorPickerProps	-
VizelBubbleMenuDefaultProps	-
VizelBubbleMenuDividerProps	-
VizelBubbleMenuProps	-
VizelColorPickerProps	-
VizelEditorProps	-
VizelEditorSnapshot	Snapshot delivered to a useVizelEditorState selector on every re-evaluation.
VizelEmbedViewProps	-
VizelFindReplaceProps	-
VizelIconProps	-
VizelIconProviderProps	-
VizelLinkEditorProps	-
VizelMentionMenuProps	-
VizelMentionMenuRef	-
VizelNodeSelectorProps	-
VizelOutlineProps	-
VizelPortalProps	Props for the VizelPortal component.
VizelProps	-
VizelProviderProps	-
VizelSaveIndicatorProps	-
VizelSlashMenuEmptyProps	-
VizelSlashMenuItemProps	-
VizelSlashMenuProps	-
VizelSlashMenuRef	-
VizelThemeProviderProps	Theme provider options
VizelToolbarButtonProps	-
VizelToolbarDefaultProps	-
VizelToolbarDividerProps	-
VizelToolbarDropdownProps	-
VizelToolbarOverflowProps	-
VizelToolbarProps	-

Type Aliases

Type Alias	Description
UseVizelEditorOptions	Options for useVizelEditor hook.

Functions

Function	Description
createVizelMentionMenuRenderer	Creates a suggestion render configuration for the Mention extension. This handles the popup positioning and React component lifecycle.
createVizelSlashMenuRenderer	Creates a suggestion render configuration for the SlashCommand extension. This handles the popup positioning and React component lifecycle.
useVizelAutoSave	Hook for auto-saving editor content with debouncing.
useVizelCollaboration	Hook for tracking real-time collaboration state with a Yjs provider.
useVizelComment	Hook for managing document comments and annotations.
useVizelContext	Hook to access the editor instance from context.
useVizelContextSafe	Hook to access the editor instance from context.
useVizelEditor	React hook to create and manage a Vizel editor instance.
useVizelEditorState	Subscribe to a slice of the editor's state.
useVizelIconContext	Hook to access custom icon mappings from VizelIconProvider. Returns an empty value if no VizelIconProvider is present (falls back to defaults).
useVizelMarkdown	React hook for bidirectional Markdown synchronization with the editor.
useVizelState	Hook that forces a re-render whenever the editor's state changes.
useVizelTheme	Hook to access the editor theme and a setter.
useVizelThemeSafe	Hook to access the theme safely. Returns `null` outside a `VizelThemeProvider`.
useVizelVersionHistory	Hook for managing document version history.
Vizel	Vizel - All-in-one editor component
VizelBlockMenu	Block context menu that appears when clicking the drag handle.
VizelBubbleMenu	A floating menu that appears when text is selected. Provides formatting options like bold, italic, strike, code, and link.
VizelBubbleMenuButton	A button component for use in the VizelBubbleMenu.
VizelBubbleMenuColorPicker	A color picker component for the VizelBubbleMenu.
VizelBubbleMenuDefault	The default menu content for VizelBubbleMenu.
VizelBubbleMenuDivider	A divider component for separating groups of buttons in the VizelBubbleMenu.
VizelColorPicker	A reusable color picker component with keyboard navigation and accessibility support.
VizelEditor	Renders the editable content area of the Vizel editor.
VizelEmbedView	Renders an embed based on its type.
VizelFindReplace	Find and replace panel component for React.
VizelIcon	Icon component that renders Iconify icons based on semantic icon names. Uses Lucide icons by default, but can be customized via: 1. customIcons prop (highest priority) 2. VizelIconProvider context 3. Default Lucide icons (fallback)
VizelIconProvider	Provider component for customizing icons throughout the application. Wrap your application or editor with this provider to use custom icon sets.
VizelLinkEditor	A link editor component for editing hyperlinks in the VizelBubbleMenu.
VizelMentionMenu	Mention autocomplete menu component.
VizelNodeSelector	A dropdown selector for changing block node types.
VizelOutline	Sidebar-style outline view of every heading in the editor's document.
VizelPortal	Portal component for rendering content outside the DOM hierarchy.
VizelProvider	Provider component for the Vizel editor. Provides editor context to all child components.
VizelSaveIndicator	Visual indicator for the current save state of the editor.
VizelSlashMenu	Slash command menu component for displaying command suggestions.
VizelSlashMenuEmpty	An empty state component for the VizelSlashMenu when no results are found.
VizelSlashMenuItem	A menu item component for the VizelSlashMenu. Displays the command icon, label, description, and optional keyboard shortcut.
VizelThemeProvider	Theme provider component for managing dark mode
VizelToolbar	Fixed toolbar component for the Vizel editor. Displays formatting buttons above the editor content area.
VizelToolbarButton	A button component for use in the VizelToolbar.
VizelToolbarDefault	The default toolbar content for VizelToolbar. Provides formatting buttons grouped by category with dividers between groups. Supports both simple button actions and dropdown menu actions.
VizelToolbarDivider	A divider component for separating groups of buttons in the VizelToolbar.
VizelToolbarDropdown	A dropdown toolbar button that shows a popover with nested actions.
VizelToolbarOverflow	An overflow menu that displays hidden toolbar actions in a popover.