@vizel/core 0.0.1-alpha.1

package/dist/index.d.ts

@@ -0,0 +1,2642 @@
+import { BubbleMenuPlugin } from '@tiptap/extension-bubble-menu';
+import { CodeBlockLowlightOptions } from '@tiptap/extension-code-block-lowlight';
+import { createLowlight } from 'lowlight';
+import { DecorationSet } from '@tiptap/pm/view';
+import { default as default_2 } from '@tiptap/extension-code-block-lowlight';
+import { Editor } from '@tiptap/core';
+import { EditorView } from '@tiptap/pm/view';
+import { Extension } from '@tiptap/core';
+import { Extensions } from '@tiptap/core';
+import { FileHandlePluginOptions } from '@tiptap/extension-file-handler';
+import { ImageOptions } from '@tiptap/extension-image';
+import { JSONContent } from '@tiptap/core';
+import { LinkOptions } from '@tiptap/extension-link';
+import { Mark } from '@tiptap/core';
+import { Markdown } from '@tiptap/markdown';
+import { MarkdownExtensionOptions } from '@tiptap/markdown';
+import { MarkdownExtensionStorage } from '@tiptap/markdown';
+import { MermaidConfig } from 'mermaid';
+import { Node as Node_2 } from '@tiptap/core';
+import { Plugin as Plugin_2 } from '@tiptap/pm/state';
+import { PluginKey } from '@tiptap/pm/state';
+import { SuggestionOptions } from '@tiptap/suggestion';
+import { SuggestionProps } from '@tiptap/suggestion';
+import { TableCellOptions } from '@tiptap/extension-table';
+import { TableHeaderOptions } from '@tiptap/extension-table';
+import { TableOptions } from '@tiptap/extension-table';
+import { default as VizelDragHandle } from '@tiptap/extension-drag-handle';
+import { default as VizelImage } from '@tiptap/extension-image';
+
+/**
+ * Add a color to recent colors
+ */
+export declare function addVizelRecentColor(type: "textColor" | "highlight", color: string): void;
+
+/**
+ * Apply theme to target element
+ */
+export declare function applyVizelTheme(resolvedTheme: VizelResolvedTheme, targetSelector?: string, disableTransition?: boolean): void;
+
+export { BubbleMenuPlugin }
+
+/**
+ * Convert all diagram code blocks in a document to diagram nodes.
+ * This command should be called after importing markdown content.
+ * Supports mermaid, dot, and graphviz code blocks.
+ *
+ * @param editor - The editor instance
+ *
+ * @example
+ * ```typescript
+ * editor.commands.setContent(markdownText, { contentType: 'markdown' });
+ * convertVizelCodeBlocksToDiagrams(editor);
+ * ```
+ */
+export declare function convertVizelCodeBlocksToDiagrams(editor: Editor): void;
+
+/**
+ * Creates auto-save handlers for an editor
+ */
+export declare function createVizelAutoSaveHandlers(getEditor: () => Editor | null | undefined, options: VizelAutoSaveOptions, onStateChange: (state: Partial<VizelAutoSaveState>) => void): {
+    /** Trigger a debounced save */
+    save: () => void;
+    /** Save immediately without debouncing */
+    saveNow: () => Promise<void>;
+    /** Restore content from storage */
+    restore: () => Promise<JSONContent | null>;
+    /** Handler for editor update events */
+    handleUpdate: () => void;
+    /** Cancel any pending debounced save */
+    cancel: () => void;
+};
+
+/**
+ * Creates the character count extension for tracking content statistics.
+ *
+ * @example
+ * ```typescript
+ * import { createVizelCharacterCountExtension } from '@vizel/core'
+ *
+ * const extension = createVizelCharacterCountExtension({
+ *   limit: 1000,
+ *   mode: 'textSize'
+ * })
+ *
+ * // Access counts via editor storage
+ * const chars = editor.storage.characterCount.characters()
+ * const words = editor.storage.characterCount.words()
+ * ```
+ */
+export declare function createVizelCharacterCountExtension(options?: VizelCharacterCountOptions): Extension;
+
+/**
+ * Create the CodeBlockLowlight extension with all languages registered
+ *
+ * @example Basic usage
+ * ```ts
+ * const extensions = [
+ *   ...createVizelCodeBlockExtension(),
+ * ];
+ * ```
+ *
+ * @example With options
+ * ```ts
+ * const extensions = [
+ *   ...createVizelCodeBlockExtension({
+ *     defaultLanguage: 'typescript',
+ *     lineNumbers: true,
+ *   }),
+ * ];
+ * ```
+ */
+export declare function createVizelCodeBlockExtension(options?: VizelCodeBlockOptions): CodeBlockLowlightOptions["lowlight"] extends undefined ? never : ReturnType<typeof default_2.configure>[];
+
+/**
+ * Create default fetchEmbedData function that works client-side
+ *
+ * This function fetches oEmbed data for providers that support CORS.
+ * For providers that don't support CORS or when oEmbed fails, it falls back to link type.
+ *
+ * For full OGP support, you need to provide a custom fetchEmbedData function
+ * that fetches data through a server-side proxy.
+ *
+ * @param providers - Custom providers to use (defaults to vizelDefaultEmbedProviders)
+ * @returns A fetchEmbedData function
+ *
+ * @example
+ * ```typescript
+ * const editor = useVizelEditor({
+ *   features: {
+ *     embed: {
+ *       // Use default client-side fetcher
+ *       fetchEmbedData: createVizelDefaultFetchEmbedData(),
+ *     },
+ *   },
+ * });
+ * ```
+ */
+export declare function createVizelDefaultFetchEmbedData(providers?: VizelEmbedProvider[]): VizelFetchEmbedDataFn;
+
+/**
+ * Creates details extensions for collapsible content blocks.
+ *
+ * @example
+ * ```typescript
+ * import { createVizelDetailsExtensions } from '@vizel/core'
+ *
+ * const extensions = createVizelDetailsExtensions({
+ *   details: { openByDefault: false }
+ * })
+ * ```
+ */
+export declare function createVizelDetailsExtensions(options?: VizelDetailsOptions): Extensions;
+
+/**
+ * Create the Diagram extension
+ *
+ * @example Basic usage
+ * ```ts
+ * const extensions = [
+ *   createVizelDiagramExtension(),
+ * ];
+ * ```
+ *
+ * @example With custom Mermaid config
+ * ```ts
+ * const extensions = [
+ *   createVizelDiagramExtension({
+ *     mermaidConfig: {
+ *       theme: 'dark',
+ *     },
+ *   }),
+ * ];
+ * ```
+ *
+ * @example With custom GraphViz engine
+ * ```ts
+ * const extensions = [
+ *   createVizelDiagramExtension({
+ *     graphvizEngine: 'neato',
+ *   }),
+ * ];
+ * ```
+ */
+export declare function createVizelDiagramExtension(options?: VizelDiagramOptions): ReturnType<typeof VizelDiagram.configure>;
+
+/**
+ * Creates a DragHandle extension with default styling.
+ * The drag handle appears on the left side of blocks when hovering.
+ */
+export declare function createVizelDragHandleExtension(options?: VizelDragHandleOptions): Extension;
+
+/**
+ * Creates the complete drag handle extension set including:
+ * - Visual drag handle on block hover
+ * - Keyboard shortcuts for block movement (Alt+Up/Down)
+ */
+export declare function createVizelDragHandleExtensions(options?: VizelDragHandleOptions): Extension[];
+
+/**
+ * Create a configured Vizel editor instance.
+ *
+ * This is the recommended way for framework packages to create editors.
+ * It handles all common setup including:
+ * - Resolving feature options
+ * - Creating extensions
+ * - Setting up initial content (JSON or Markdown)
+ * - Configuring editor props and callbacks
+ *
+ * @param options - Editor configuration options
+ * @returns The created editor instance and extracted options
+ *
+ * @example
+ * ```typescript
+ * // In a framework hook/composable/rune:
+ * const { editor, imageOptions } = createVizelEditorInstance({
+ *   initialMarkdown: "# Hello World",
+ *   features: { table: true },
+ *   createSlashMenuRenderer: () => createMySlashMenuRenderer(),
+ *   onUpdate: ({ editor }) => console.log(editor.getJSON()),
+ * });
+ * ```
+ */
+export declare function createVizelEditorInstance(options: CreateVizelEditorInstanceOptions): CreateVizelEditorInstanceResult;
+
+/**
+ * Options for creating a Vizel editor instance.
+ * Extends VizelEditorOptions with additional framework-specific parameters.
+ */
+export declare interface CreateVizelEditorInstanceOptions extends VizelEditorOptions {
+    /** Additional extensions to include */
+    extensions?: Extensions;
+    /** Factory function to create the slash menu renderer */
+    createSlashMenuRenderer: () => Partial<SuggestionOptions<VizelSlashCommandItem>>;
+}
+
+/**
+ * Result of creating a Vizel editor instance.
+ */
+export declare interface CreateVizelEditorInstanceResult {
+    /** The created Tiptap editor instance */
+    editor: Editor;
+    /** Image upload options extracted from features (for event handler registration) */
+    imageOptions: VizelImageFeatureOptions;
+}
+
+/**
+ * Create embed extension with options
+ */
+export declare function createVizelEmbedExtension(options?: VizelEmbedOptions): Node_2<VizelEmbedOptions, any>;
+
+/**
+ * Create the default set of extensions for Vizel editor.
+ * All features are enabled by default. Set any feature to `false` to disable it.
+ *
+ * @example Basic usage (all features enabled)
+ * ```ts
+ * const extensions = createVizelExtensions();
+ * ```
+ *
+ * @example Disable specific features
+ * ```ts
+ * const extensions = createVizelExtensions({
+ *   features: {
+ *     table: false,
+ *     slashCommand: false,
+ *     mathematics: false,
+ *   },
+ * });
+ * ```
+ *
+ * @example Using Markdown support (enabled by default)
+ * ```ts
+ * const extensions = createVizelExtensions();
+ *
+ * // Then use:
+ * editor.commands.setContent('# Hello', { contentType: 'markdown' });
+ * const md = editor.getMarkdown();
+ * ```
+ *
+ * @example Custom image upload
+ * ```ts
+ * const extensions = createVizelExtensions({
+ *   features: {
+ *     image: {
+ *       onUpload: async (file) => {
+ *         const formData = new FormData();
+ *         formData.append('file', file);
+ *         const res = await fetch('/api/upload', { method: 'POST', body: formData });
+ *         return (await res.json()).url;
+ *       },
+ *     },
+ *   },
+ * });
+ * ```
+ */
+export declare function createVizelExtensions(options?: VizelExtensionsOptions): Extensions;
+
+/**
+ * Create a file handler extension with unified drop/paste handling.
+ *
+ * This extension uses @tiptap/extension-file-handler to provide
+ * consistent file handling across paste and drop operations.
+ *
+ * @example Basic usage with image upload
+ * ```ts
+ * const extensions = [
+ *   ...createVizelExtensions(),
+ *   createVizelFileHandlerExtension({
+ *     onDrop: (editor, files, pos) => {
+ *       files.forEach(file => {
+ *         // Handle dropped file (e.g., upload image)
+ *         uploadImage(file).then(url => {
+ *           editor.chain().focus().setImage({ src: url }).run();
+ *         });
+ *       });
+ *     },
+ *     onPaste: (editor, files) => {
+ *       files.forEach(file => {
+ *         // Handle pasted file
+ *         uploadImage(file).then(url => {
+ *           editor.chain().focus().setImage({ src: url }).run();
+ *         });
+ *       });
+ *     },
+ *   }),
+ * ];
+ * ```
+ *
+ * @example With custom MIME types
+ * ```ts
+ * createVizelFileHandlerExtension({
+ *   allowedMimeTypes: ['image/*', 'application/pdf'],
+ *   onDrop: (editor, files, pos) => { ... },
+ *   onPaste: (editor, files) => { ... },
+ * });
+ * ```
+ */
+export declare function createVizelFileHandlerExtension(options?: VizelFileHandlerOptions): Extension<Omit<FileHandlePluginOptions, "key" | "editor">, any>;
+
+/**
+ * Create a configured Image extension for Vizel editor.
+ *
+ * @example
+ * ```ts
+ * const extensions = [
+ *   ...createVizelExtensions(),
+ *   createImageExtension({ inline: true }),
+ * ];
+ * ```
+ */
+export declare function createVizelImageExtension(options?: VizelImageOptions): Node_2<ImageOptions, any>;
+
+export declare function createVizelImageFileHandlers(options: VizelImageFileHandlerOptions): VizelImageFileHandlers;
+
+/**
+ * Create an image uploader function
+ */
+export declare function createVizelImageUploader(options: VizelImageUploadPluginOptions): VizelUploadImageFn;
+
+/**
+ * Create Image extension with upload support (drag-and-drop, paste, file picker).
+ *
+ * @example
+ * ```ts
+ * const extensions = [
+ *   ...createVizelExtensions(),
+ *   ...createVizelImageUploadExtensions({
+ *     upload: {
+ *       onUpload: async (file) => {
+ *         const formData = new FormData();
+ *         formData.append("image", file);
+ *         const res = await fetch("/api/upload", { method: "POST", body: formData });
+ *         return (await res.json()).url;
+ *       },
+ *       maxFileSize: 10 * 1024 * 1024, // 10MB
+ *       onValidationError: (error) => console.error(error.message),
+ *       onUploadError: (error) => console.error(`Upload failed: ${error.message}`),
+ *     },
+ *   }),
+ * ];
+ * ```
+ */
+export declare function createVizelImageUploadExtensions(options: VizelImageUploadOptions): (Extension<any, any> | Node_2<ImageOptions, any> | Node_2<VizelResizableImageOptions, any>)[];
+
+/**
+ * Create an image upload plugin with decoration-based placeholders
+ */
+export declare function createVizelImageUploadPlugin(options: VizelImageUploadPluginOptions): Plugin_2;
+
+/**
+ * Create Image extension with upload support using @tiptap/extension-file-handler.
+ *
+ * This is an alternative to createImageUploadExtension that uses the official
+ * Tiptap FileHandler extension for more consistent file handling.
+ *
+ * @example
+ * ```ts
+ * const extensions = [
+ *   ...createVizelExtensions(),
+ *   ...createImageUploadWithFileHandler({
+ *     upload: {
+ *       onUpload: async (file) => {
+ *         const formData = new FormData();
+ *         formData.append("image", file);
+ *         const res = await fetch("/api/upload", { method: "POST", body: formData });
+ *         return (await res.json()).url;
+ *       },
+ *     },
+ *   }),
+ * ];
+ * ```
+ */
+export declare function createVizelImageUploadWithFileHandler(options: VizelImageUploadWithFileHandlerOptions): (Extension<any, any> | Extension<Omit<FileHandlePluginOptions, "key" | "editor">, any> | Node_2<ImageOptions, any> | Node_2<VizelResizableImageOptions, any>)[];
+
+/**
+ * Create a link extension for Vizel editor.
+ *
+ * @example
+ * ```ts
+ * const editor = new Editor({
+ *   extensions: [
+ *     createVizelLinkExtension({
+ *       openOnClick: true,
+ *       autolink: true,
+ *     }),
+ *   ],
+ * });
+ *
+ * // Add a link
+ * editor.chain().focus().setLink({ href: 'https://example.com' }).run();
+ *
+ * // Remove a link
+ * editor.chain().focus().unsetLink().run();
+ * ```
+ */
+export declare function createVizelLinkExtension(options?: VizelLinkOptions): Mark<LinkOptions, any>;
+
+/**
+ * Create a configured Markdown extension.
+ *
+ * The Markdown extension provides bidirectional conversion between
+ * Markdown syntax and the editor's document structure.
+ *
+ * ## Import Markdown
+ * ```typescript
+ * editor.commands.setContent('# Hello\n\nWorld', { contentType: 'markdown' })
+ * ```
+ *
+ * ## Export Markdown
+ * ```typescript
+ * const markdown = editor.getMarkdown()
+ * ```
+ *
+ * ## Parse/Serialize
+ * ```typescript
+ * const json = editor.markdown.parse('# Hello')
+ * const md = editor.markdown.serialize(json)
+ * ```
+ *
+ * @example Basic usage
+ * ```typescript
+ * import { VizelMarkdown } from '@vizel/core'
+ *
+ * const editor = new Editor({
+ *   extensions: [VizelMarkdown],
+ * })
+ * ```
+ *
+ * @example With options
+ * ```typescript
+ * import { createVizelMarkdownExtension } from '@vizel/core'
+ *
+ * const editor = new Editor({
+ *   extensions: [
+ *     createVizelMarkdownExtension({
+ *       gfm: true,
+ *       indentation: { style: 'tab', size: 1 },
+ *     }),
+ *   ],
+ * })
+ * ```
+ */
+export declare function createVizelMarkdownExtension(options?: VizelMarkdownOptions): ReturnType<typeof Markdown.configure>;
+
+/**
+ * Create markdown sync handlers for framework implementations.
+ */
+export declare function createVizelMarkdownSyncHandlers(options?: VizelMarkdownSyncOptions): VizelMarkdownSyncHandlers;
+
+/**
+ * Create the Mathematics extensions
+ *
+ * @example Basic usage
+ * ```ts
+ * const extensions = [
+ *   ...createVizelMathematicsExtensions(),
+ * ];
+ * ```
+ *
+ * @example With custom KaTeX options
+ * ```ts
+ * const extensions = [
+ *   ...createVizelMathematicsExtensions({
+ *     katexOptions: {
+ *       macros: {
+ *         '\\R': '\\mathbb{R}',
+ *       },
+ *     },
+ *   }),
+ * ];
+ * ```
+ */
+export declare function createVizelMathematicsExtensions(options?: VizelMathematicsOptions): [typeof VizelMathInline, typeof VizelMathBlock];
+
+/**
+ * Create a portal element with proper styling.
+ *
+ * Creates a container div for portal content with appropriate
+ * positioning and z-index based on the specified layer.
+ *
+ * @param layer - The z-index layer for the portal element
+ * @returns A configured portal element
+ *
+ * @example
+ * ```typescript
+ * const element = createVizelPortalElement("dropdown");
+ * element.appendChild(menuContent);
+ * getVizelPortalContainer().appendChild(element);
+ * ```
+ */
+export declare function createVizelPortalElement(layer?: VizelPortalLayer): HTMLDivElement;
+
+/**
+ * Create a positioned container for suggestion popups.
+ *
+ * This creates a container element that is:
+ * - Positioned absolutely in the document
+ * - Contains an inner element for mounting framework components
+ * - Provides a method to update position based on cursor location
+ *
+ * @returns A managed suggestion container
+ *
+ * @example
+ * ```typescript
+ * // In a slash menu renderer:
+ * const { container, menuContainer, updatePosition, destroy } =
+ *   createVizelSuggestionContainer();
+ *
+ * // Mount your framework component to menuContainer
+ * ReactDOM.createRoot(menuContainer).render(<SlashMenu />);
+ *
+ * // Update position when Tiptap provides new coordinates
+ * updatePosition(props.clientRect);
+ *
+ * // Clean up when done
+ * destroy();
+ * ```
+ */
+export declare function createVizelSuggestionContainer(): VizelSuggestionContainer;
+
+/**
+ * Create a media query listener for system theme changes
+ */
+export declare function createVizelSystemThemeListener(callback: (theme: VizelResolvedTheme) => void): () => void;
+
+/**
+ * Create table extensions for Vizel editor.
+ * Returns an array of extensions: Table, TableRow, TableHeader, TableCell.
+ *
+ * @example
+ * ```ts
+ * const editor = new Editor({
+ *   extensions: [
+ *     ...createVizelTableExtensions({ resizable: true }),
+ *   ],
+ * });
+ *
+ * // Insert a table
+ * editor.chain().focus().insertTable({ rows: 3, cols: 3, withHeaderRow: true }).run();
+ *
+ * // Column operations
+ * editor.chain().focus().addColumnBefore().run(); // Add column at the beginning/middle
+ * editor.chain().focus().addColumnAfter().run();  // Add column at the end/middle
+ * editor.chain().focus().deleteColumn().run();
+ *
+ * // Row operations
+ * editor.chain().focus().addRowBefore().run();    // Add row at the beginning/middle
+ * editor.chain().focus().addRowAfter().run();     // Add row at the end/middle
+ * editor.chain().focus().deleteRow().run();
+ *
+ * // Delete table
+ * editor.chain().focus().deleteTable().run();
+ *
+ * // Cell alignment
+ * editor.chain().focus().setCellAttribute('textAlign', 'left').run();
+ * editor.chain().focus().setCellAttribute('textAlign', 'center').run();
+ * editor.chain().focus().setCellAttribute('textAlign', 'right').run();
+ *
+ * // Merge and split cells
+ * editor.chain().focus().mergeCells().run();
+ * editor.chain().focus().splitCell().run();
+ * editor.chain().focus().mergeOrSplit().run();
+ *
+ * // Header operations
+ * editor.chain().focus().toggleHeaderRow().run();
+ * editor.chain().focus().toggleHeaderColumn().run();
+ * editor.chain().focus().toggleHeaderCell().run();
+ *
+ * // Navigation
+ * editor.chain().focus().goToNextCell().run();
+ * editor.chain().focus().goToPreviousCell().run();
+ *
+ * // Cell selection
+ * editor.chain().focus().setCellSelection({ anchorCell: 1, headCell: 2 }).run();
+ *
+ * // Fix table structure
+ * editor.chain().focus().fixTables().run();
+ * ```
+ */
+export declare function createVizelTableExtensions(options?: VizelTableOptions): Extensions;
+
+/**
+ * Creates task list extensions for checkbox/todo functionality.
+ *
+ * @example
+ * ```typescript
+ * import { createVizelTaskListExtensions } from '@vizel/core'
+ *
+ * const extensions = createVizelTaskListExtensions({
+ *   taskItem: { nested: true }
+ * })
+ * ```
+ */
+export declare function createVizelTaskListExtensions(options?: VizelTaskListExtensionsOptions): Extensions;
+
+/**
+ * Create text color and highlight extensions
+ */
+export declare function createVizelTextColorExtensions(options?: VizelTextColorOptions): Extensions;
+
+/**
+ * Creates an event handler for the vizel:upload-image custom event.
+ * This handler is used by the slash command to trigger image uploads.
+ */
+export declare function createVizelUploadEventHandler(options: VizelCreateUploadEventHandlerOptions): (event: Event) => void;
+
+/**
+ * Custom icon mappings to override default Iconify icon IDs.
+ * Keys are semantic icon names, values are Iconify icon IDs.
+ *
+ * @example
+ * ```ts
+ * const customIcons: CustomIconMap = {
+ *   heading1: "mdi:format-header-1",
+ *   bold: "mdi:format-bold",
+ *   // Use any Iconify icon set: Material Design, Heroicons, Phosphor, etc.
+ * };
+ * ```
+ */
+export declare type CustomIconMap = Partial<Record<VizelIconName, string>>;
+
+/**
+ * Detect provider from URL
+ */
+export declare function detectVizelEmbedProvider(url: string, providers?: VizelEmbedProvider[]): VizelEmbedProvider | null;
+
+export { Editor }
+
+/**
+ * Filter files by allowed MIME types
+ */
+export declare function filterVizelFilesByMimeType(files: File[], allowedMimeTypes: string[]): File[];
+
+/**
+ * Filter slash commands using fuzzy search
+ * @param items - The items to filter
+ * @param query - The search query
+ * @returns Filtered and sorted items
+ */
+export declare function filterVizelSlashCommands(items: VizelSlashCommandItem[], query: string): VizelSlashCommandItem[];
+
+/**
+ * Find a language by ID
+ */
+export declare function findVizelLanguage(id: string): VizelCodeBlockLanguage | undefined;
+
+/**
+ * Flatten grouped commands back to a single array
+ * @param groups - The groups to flatten
+ * @returns Flat array of items
+ */
+export declare function flattenVizelSlashCommandGroups(groups: VizelSlashCommandGroup[]): VizelSlashCommandItem[];
+
+/**
+ * Format relative time for display
+ */
+export declare function formatVizelRelativeTime(date: Date): string;
+
+/**
+ * Get all language IDs
+ */
+export declare function getAllVizelLanguageIds(): string[];
+
+/**
+ * Get stored theme from storage
+ */
+export declare function getStoredVizelTheme(storageKey: string): VizelTheme | null;
+
+/**
+ * Get the currently active node type
+ */
+export declare function getVizelActiveNodeType(editor: Editor, nodeTypes?: VizelNodeTypeOption[]): VizelNodeTypeOption | undefined;
+
+/**
+ * Extracts the current editor state from an editor instance.
+ * This provides a snapshot of common editor state values including
+ * focus, empty status, undo/redo availability, and character/word counts.
+ *
+ * @param editor - The editor instance to extract state from
+ * @returns The current editor state
+ *
+ * @example
+ * ```typescript
+ * const state = getVizelEditorState(editor);
+ * console.log(`Characters: ${state.characterCount}, Words: ${state.wordCount}`);
+ * console.log(`Can undo: ${state.canUndo}, Can redo: ${state.canRedo}`);
+ * ```
+ */
+export declare function getVizelEditorState(editor: Editor | null | undefined): VizelEditorState;
+
+/**
+ * Get the Iconify icon ID for a given icon name.
+ * @param name - The semantic icon name
+ * @param customIcons - Optional custom icon mappings to override defaults
+ * @returns The Iconify icon ID (e.g., "lucide:heading-1")
+ */
+export declare function getVizelIconId(name: VizelIconName, customIcons?: Partial<Record<VizelIconName, string>>): string;
+
+/**
+ * Get the image upload plugin key (for external access)
+ */
+export declare function getVizelImageUploadPluginKey(): PluginKey<DecorationSet>;
+
+/**
+ * Get markdown content from the editor.
+ * Returns empty string if markdown extension is not enabled.
+ */
+export declare function getVizelMarkdown(editor: Editor | null | undefined): string;
+
+/**
+ * Get or create the portal container element.
+ *
+ * This function ensures a single portal container exists in the document,
+ * creating one if necessary. The container is appended to document.body.
+ *
+ * @returns The portal container element
+ *
+ * @example
+ * ```typescript
+ * const container = getVizelPortalContainer();
+ * container.appendChild(myFloatingElement);
+ * ```
+ */
+export declare function getVizelPortalContainer(): HTMLElement;
+
+/**
+ * Get recent colors from localStorage
+ */
+export declare function getVizelRecentColors(type: "textColor" | "highlight"): string[];
+
+/**
+ * Get the list of all registered languages (sorted alphabetically)
+ */
+export declare function getVizelRegisteredLanguages(): VizelCodeBlockLanguage[];
+
+/**
+ * Gets the storage object based on backend type
+ */
+export declare function getVizelStorageBackend(storage: VizelStorageBackend, key: string): {
+    save: (content: JSONContent) => Promise<void>;
+    load: () => Promise<JSONContent | null>;
+};
+
+/**
+ * Get the system theme preference
+ */
+export declare function getVizelSystemTheme(): VizelResolvedTheme;
+
+/**
+ * Initialize theme on page load (for SSR/hydration)
+ *
+ * Call this in a script tag in the head to prevent flash of incorrect theme.
+ *
+ * @example
+ * ```html
+ * <script>
+ *   (function() {
+ *     const storageKey = 'vizel-theme';
+ *     const stored = localStorage.getItem(storageKey);
+ *     const systemDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+ *     const theme = stored === 'dark' ? 'dark' :
+ *                   stored === 'light' ? 'light' :
+ *                   systemDark ? 'dark' : 'light';
+ *     document.documentElement.setAttribute('data-vizel-theme', theme);
+ *   })();
+ * </script>
+ * ```
+ */
+export declare function getVizelThemeInitScript(storageKey?: string): string;
+
+/**
+ * GraphViz layout engine options
+ */
+export declare type GraphvizEngine = "dot" | "neato" | "fdp" | "sfdp" | "twopi" | "circo";
+
+/**
+ * Group slash commands by their group property
+ * @param items - The items to group
+ * @param groupOrder - Optional order for groups
+ * @returns Grouped commands
+ */
+export declare function groupVizelSlashCommands(items: VizelSlashCommandItem[], groupOrder?: string[]): VizelSlashCommandGroup[];
+
+/**
+ * Handle image drop from drag-and-drop
+ */
+export declare function handleVizelImageDrop(view: EditorView, event: DragEvent, moved: boolean, uploadFn: VizelUploadImageFn): boolean;
+
+/**
+ * Handle image paste from clipboard
+ */
+export declare function handleVizelImagePaste(view: EditorView, event: ClipboardEvent, uploadFn: VizelUploadImageFn): boolean;
+
+/**
+ * Handle the Escape key for suggestion popups.
+ *
+ * Returns true if the event was an Escape key press, indicating
+ * that the suggestion should be dismissed.
+ *
+ * @param event - The keyboard event to check
+ * @returns true if this was an Escape key press
+ *
+ * @example
+ * ```typescript
+ * onKeyDown: ({ event }) => {
+ *   if (handleVizelSuggestionEscape(event)) {
+ *     return true; // Tell Tiptap we handled it
+ *   }
+ *   // Handle other keys...
+ * }
+ * ```
+ */
+export declare function handleVizelSuggestionEscape(event: KeyboardEvent): boolean;
+
+/**
+ * Check if the portal container exists.
+ *
+ * @returns true if the portal container exists in the document
+ */
+export declare function hasVizelPortalContainer(): boolean;
+
+/**
+ * Initialize editor with markdown content.
+ * This should be called in onCreate callback when using initialMarkdown.
+ *
+ * @param editor - The editor instance
+ * @param markdown - The markdown content to set
+ * @param options - Options for initialization
+ */
+export declare function initializeVizelMarkdownContent(editor: Editor, markdown: string, options?: {
+    transformDiagrams?: boolean;
+}): void;
+
+/**
+ * Initialize the Vizel icon renderer with the default Lucide implementation.
+ * Call this once when your framework package is loaded.
+ *
+ * @example
+ * ```typescript
+ * // In @vizel/react entry point
+ * import { initVizelIconRenderer } from "@vizel/core";
+ * initVizelIconRenderer();
+ * ```
+ */
+export declare function initVizelIconRenderer(): void;
+
+/**
+ * Color utilities for Vizel editor.
+ *
+ * These utilities help with validating and normalizing hex color values.
+ */
+/**
+ * Validate if a string is a valid hex color.
+ *
+ * @param color - The color string to validate
+ * @returns True if the color is a valid hex color (3 or 6 digits)
+ *
+ * @example
+ * ```ts
+ * isVizelValidHexColor("#FF0000"); // true
+ * isVizelValidHexColor("#F00");    // true
+ * isVizelValidHexColor("#GGGGGG"); // false
+ * isVizelValidHexColor("red");     // false
+ * ```
+ */
+export declare function isVizelValidHexColor(color: string): boolean;
+
+export { JSONContent }
+
+/**
+ * Mount an element to the portal container.
+ *
+ * @param content - The content element to mount
+ * @param options - Mount options
+ * @returns The wrapper element that was added to the portal
+ *
+ * @example
+ * ```typescript
+ * const wrapper = mountToVizelPortal(menuElement, { layer: "dropdown" });
+ * // Later, to unmount:
+ * unmountFromVizelPortal(wrapper);
+ * ```
+ */
+export declare function mountToVizelPortal(content: HTMLElement, options?: VizelMountPortalOptions): HTMLDivElement;
+
+/**
+ * Normalize a hex color string to standard format (#RRGGBB uppercase).
+ * Handles shorthand (#RGB) conversion and adds # prefix if missing.
+ *
+ * @param color - The color string to normalize
+ * @returns Normalized uppercase hex color string
+ *
+ * @example
+ * ```ts
+ * normalizeVizelHexColor("#f00");    // "#FF0000"
+ * normalizeVizelHexColor("#FF0000"); // "#FF0000"
+ * normalizeVizelHexColor("ff0000");  // "#FF0000"
+ * ```
+ */
+export declare function normalizeVizelHexColor(color: string): string;
+
+/**
+ * Parse markdown to JSON content.
+ * Returns null if markdown extension is not enabled.
+ *
+ * @param editor - The editor instance (needed for markdown extension access)
+ * @param markdown - The markdown content to parse
+ * @param options - Options for parsing
+ * @returns The parsed JSON content, or null if parsing failed
+ */
+export declare function parseVizelMarkdown(editor: Editor | null | undefined, markdown: string, options?: {
+    transformDiagrams?: boolean;
+}): JSONContent | null;
+
+/**
+ * Registers the image upload event handler.
+ * Returns a cleanup function to remove the event listener.
+ */
+export declare function registerVizelUploadEventHandler(options: VizelCreateUploadEventHandlerOptions): () => void;
+
+/**
+ * Remove the portal container from the document.
+ *
+ * This should only be called during cleanup when no more
+ * portal content is expected to be rendered.
+ */
+export declare function removeVizelPortalContainer(): void;
+
+/**
+ * Render an internal icon as an SVG string.
+ * Uses the injected renderer from framework packages.
+ *
+ * @param name - The internal icon name
+ * @param options - Optional rendering options (width, height)
+ * @returns The SVG string, or empty string if no renderer is set
+ */
+export declare function renderVizelIcon(name: VizelInternalIconName, options?: VizelIconRendererOptions): string;
+
+/**
+ * Render an Iconify icon as an SVG string using Lucide icons.
+ * This is the default implementation used by framework packages.
+ *
+ * @param name - The internal icon name
+ * @param options - Optional rendering options (width, height)
+ * @returns The SVG string, or empty string if icon not found
+ */
+export declare function renderVizelIconSvg(name: VizelInternalIconName, options?: VizelIconRendererOptions): string;
+
+/**
+ * Resolves feature options with default slash menu renderer.
+ * If slashCommand is enabled but no suggestion renderer is provided,
+ * automatically adds the provided renderer.
+ */
+export declare function resolveVizelFeatures(options: VizelResolveFeaturesOptions): VizelFeatureOptions | undefined;
+
+/**
+ * Resolve theme to actual applied theme
+ */
+export declare function resolveVizelTheme(theme: VizelTheme, systemTheme: VizelResolvedTheme): VizelResolvedTheme;
+
+/**
+ * Filter slash commands with search result metadata
+ * @param items - The items to filter
+ * @param query - The search query
+ * @returns Search results with score and match info
+ */
+export declare function searchVizelSlashCommands(items: VizelSlashCommandItem[], query: string): VizelSlashCommandSearchResult[];
+
+/**
+ * Set the icon renderer function.
+ * Called by framework packages (react, vue, svelte) to inject their Iconify-based implementation.
+ *
+ * @example
+ * ```typescript
+ * // In @vizel/react
+ * import { setVizelIconRenderer, vizelDefaultIconIds } from "@vizel/core";
+ * import { iconToSVG, getIconData } from "@iconify/utils";
+ * import lucideIcons from "@iconify-json/lucide";
+ *
+ * setVizelIconRenderer((name, options) => {
+ *   const iconId = vizelDefaultIconIds[name];
+ *   const [, iconName] = iconId.split(":");
+ *   const data = getIconData(lucideIcons, iconName);
+ *   if (!data) return "";
+ *   const svg = iconToSVG(data, { width: options?.width, height: options?.height });
+ *   return `<svg ...>${svg.body}</svg>`;
+ * });
+ * ```
+ */
+export declare function setVizelIconRenderer(renderer: VizelIconRendererWithOptions): void;
+
+/**
+ * Set markdown content to the editor.
+ * Optionally transforms diagram code blocks to diagram nodes.
+ *
+ * @param editor - The editor instance
+ * @param markdown - The markdown content to set
+ * @param options - Options for setting content
+ */
+export declare function setVizelMarkdown(editor: Editor | null | undefined, markdown: string, options?: {
+    transformDiagrams?: boolean;
+}): void;
+
+/**
+ * Split text into segments based on match indices from fuzzy search.
+ *
+ * @param text - The original text to split
+ * @param matches - Array of [start, end] index pairs indicating matched regions
+ * @returns Array of text segments with highlight flags
+ *
+ * @example
+ * ```ts
+ * // "Hello World" with "llo Wo" matched (indices [2,7])
+ * const segments = splitVizelTextByMatches("Hello World", [[2, 7]]);
+ * // Returns:
+ * // [
+ * //   { text: "He", highlight: false },
+ * //   { text: "llo Wo", highlight: true },
+ * //   { text: "rld", highlight: false },
+ * // ]
+ * ```
+ */
+export declare function splitVizelTextByMatches(text: string, matches?: [number, number][]): VizelTextSegment[];
+
+/**
+ * Store theme to storage
+ */
+export declare function storeVizelTheme(storageKey: string, theme: VizelTheme): void;
+
+export { SuggestionOptions }
+
+export { SuggestionProps }
+
+/**
+ * Transform content to convert diagram code blocks to diagram nodes.
+ * This is useful when importing markdown content that contains diagrams.
+ * Supports mermaid, dot, and graphviz code blocks.
+ *
+ * @param content - The content to transform (JSONContent format)
+ * @returns The transformed content with diagram code blocks converted to diagram nodes
+ *
+ * @example
+ * ```typescript
+ * // After parsing markdown with editor.markdown.parse()
+ * const parsed = editor.markdown.parse(markdownText);
+ * const transformed = transformVizelDiagramCodeBlocks(parsed);
+ * editor.commands.setContent(transformed);
+ * ```
+ */
+export declare function transformVizelDiagramCodeBlocks(content: VizelContentNode): VizelContentNode;
+
+/**
+ * Unmount an element from the portal container.
+ *
+ * @param wrapper - The wrapper element returned by mountToVizelPortal
+ */
+export declare function unmountFromVizelPortal(wrapper: HTMLElement): void;
+
+/**
+ * Validate an image file
+ */
+export declare function validateVizelImageFile(file: File, options: Pick<VizelImageUploadPluginOptions, "maxFileSize" | "allowedTypes">): VizelImageValidationError | null;
+
+/**
+ * Default auto-save options
+ */
+export declare const VIZEL_DEFAULT_AUTO_SAVE_OPTIONS: {
+    enabled: true;
+    debounceMs: number;
+    storage: "localStorage";
+    key: string;
+};
+
+/**
+ * Default allowed MIME types (images only)
+ */
+export declare const VIZEL_DEFAULT_FILE_MIME_TYPES: string[];
+
+/**
+ * Default debounce delay for markdown export in milliseconds.
+ */
+export declare const VIZEL_DEFAULT_MARKDOWN_DEBOUNCE_MS = 300;
+
+/**
+ * Default theme configuration
+ */
+export declare const VIZEL_DEFAULT_THEME: VizelTheme;
+
+/**
+ * Default storage key for persisting theme preference
+ */
+export declare const VIZEL_DEFAULT_THEME_STORAGE_KEY = "vizel-theme";
+
+/**
+ * Extended highlight color palette (lighter/pastel colors)
+ */
+export declare const VIZEL_HIGHLIGHT_COLORS: VizelColorDefinition[];
+
+/** Portal container ID */
+export declare const VIZEL_PORTAL_ID = "vizel-portal-root";
+
+/** Portal layer z-index values */
+export declare const VIZEL_PORTAL_Z_INDEX: {
+    /** Base layer for dropdowns and menus */
+    readonly dropdown: 50;
+    /** Layer for modals and dialogs */
+    readonly modal: 100;
+    /** Layer for tooltips (highest priority) */
+    readonly tooltip: 150;
+};
+
+/**
+ * Default z-index for suggestion containers.
+ */
+export declare const VIZEL_SUGGESTION_Z_INDEX = "50";
+
+/** Combined menu items (legacy, for reference) */
+export declare const VIZEL_TABLE_MENU_ITEMS: VizelTableMenuItem[];
+
+/**
+ * Extended text color palette with gradient-like arrangement
+ */
+export declare const VIZEL_TEXT_COLORS: VizelColorDefinition[];
+
+/**
+ * Data attribute used for theme application
+ */
+export declare const VIZEL_THEME_DATA_ATTRIBUTE = "data-vizel-theme";
+
+/**
+ * The custom event name for image uploads from slash commands.
+ */
+export declare const VIZEL_UPLOAD_IMAGE_EVENT = "vizel:upload-image";
+
+/**
+ * Auto-save configuration options
+ */
+export declare interface VizelAutoSaveOptions {
+    /** Enable auto-save (default: true) */
+    enabled?: boolean;
+    /** Debounce delay in milliseconds (default: 1000) */
+    debounceMs?: number;
+    /** Storage backend (default: 'localStorage') */
+    storage?: VizelStorageBackend;
+    /** Storage key for localStorage/sessionStorage (default: 'vizel-content') */
+    key?: string;
+    /** Callback when content is saved */
+    onSave?: (content: JSONContent) => void;
+    /** Callback when save fails */
+    onError?: (error: Error) => void;
+    /** Callback when restore is attempted */
+    onRestore?: (content: JSONContent | null) => void;
+}
+
+/**
+ * Auto-save state
+ */
+export declare interface VizelAutoSaveState {
+    /** Current save status */
+    status: VizelSaveStatus;
+    /** Whether there are unsaved changes */
+    hasUnsavedChanges: boolean;
+    /** Timestamp of last successful save */
+    lastSaved: Date | null;
+    /** Last error that occurred */
+    error: Error | null;
+}
+
+/**
+ * Extension for keyboard shortcuts to move blocks up/down.
+ * Alt+ArrowUp moves block up, Alt+ArrowDown moves block down.
+ * Supports moving list items within their parent list.
+ */
+export declare const VizelBlockMoveKeymap: Extension<any, any>;
+
+/**
+ * Icon names used in BubbleMenu toolbar.
+ */
+export declare type VizelBubbleMenuIconName = "bold" | "italic" | "strikethrough" | "underline" | "code" | "link" | "textColor" | "highlighter";
+
+export declare interface VizelCharacterCountOptions {
+    /**
+     * The maximum number of characters allowed. Set to 0 or null for unlimited.
+     * @default null
+     */
+    limit?: number | null;
+    /**
+     * The counting mode.
+     * - 'textSize': Count characters in the text content only
+     * - 'nodeSize': Count all nodes including formatting
+     * @default 'textSize'
+     */
+    mode?: "textSize" | "nodeSize";
+    /**
+     * Custom function to count words.
+     * By default, words are counted by splitting on whitespace.
+     */
+    wordCounter?: (text: string) => number;
+}
+
+/**
+ * Character count storage interface for accessing count values.
+ */
+export declare interface VizelCharacterCountStorage {
+    /**
+     * Get the character count.
+     * @param options - Optional mode override
+     */
+    characters: (options?: {
+        mode?: "textSize" | "nodeSize";
+    }) => number;
+    /**
+     * Get the word count.
+     */
+    words: () => number;
+}
+
+/**
+ * Language definition for the code block language selector
+ */
+export declare interface VizelCodeBlockLanguage {
+    /** Language identifier (e.g., "javascript", "python") */
+    id: string;
+    /** Display name (e.g., "JavaScript", "Python") */
+    name: string;
+}
+
+/**
+ * Options for creating the code block lowlight extension
+ */
+export declare interface VizelCodeBlockOptions {
+    /**
+     * Default language for code blocks
+     * @default "plaintext"
+     */
+    defaultLanguage?: string;
+    /**
+     * Enable line numbers by default
+     * @default false
+     */
+    lineNumbers?: boolean;
+    /**
+     * Custom lowlight instance (if not provided, uses all languages)
+     */
+    lowlight?: ReturnType<typeof createLowlight>;
+}
+
+/**
+ * Color definition for text color and highlight
+ */
+export declare interface VizelColorDefinition {
+    /** Display name for the color */
+    name: string;
+    /** CSS color value */
+    color: string;
+}
+
+/**
+ * JSON content type for Tiptap documents
+ */
+export declare interface VizelContentNode {
+    type: string;
+    attrs?: Record<string, unknown>;
+    content?: VizelContentNode[];
+    text?: string;
+    marks?: Array<{
+        type: string;
+        attrs?: Record<string, unknown>;
+    }>;
+}
+
+/**
+ * Options for creating a Vizel editor instance with framework hooks/composables/runes.
+ * Extends VizelEditorOptions with ability to add custom Tiptap extensions.
+ */
+export declare interface VizelCreateEditorOptions extends VizelEditorOptions {
+    /**
+     * Additional Tiptap extensions to include.
+     * These are added alongside the default Vizel extensions.
+     *
+     * @example
+     * ```typescript
+     * import { useVizelEditor } from '@vizel/react';
+     * import { Underline } from '@tiptap/extension-underline';
+     *
+     * const editor = useVizelEditor({
+     *   extensions: [Underline],
+     * });
+     * ```
+     */
+    extensions?: Extensions;
+}
+
+/**
+ * Options for creating an image upload event handler.
+ */
+export declare interface VizelCreateUploadEventHandlerOptions {
+    /** Function to get the current editor instance */
+    getEditor: () => Editor | null | undefined;
+    /** Function to get the current image options */
+    getImageOptions: () => VizelImageFeatureOptions;
+}
+
+/**
+ * Default base64 image uploader (converts file to data URL).
+ * Use this as the default onUpload handler when no custom uploader is provided.
+ */
+export declare function vizelDefaultBase64Upload(file: File): Promise<string>;
+
+/**
+ * Default editor props for Vizel editors.
+ */
+export declare const vizelDefaultEditorProps: {
+    attributes: {
+        class: string;
+    };
+};
+
+/**
+ * Default oEmbed providers
+ */
+export declare const vizelDefaultEmbedProviders: VizelEmbedProvider[];
+
+/**
+ * Default group order for display
+ */
+export declare const vizelDefaultGroupOrder: string[];
+
+/**
+ * Default Iconify icon IDs for each icon name.
+ * Uses Lucide icons as the default set.
+ * Users can override these by providing their own icon mappings.
+ */
+export declare const vizelDefaultIconIds: Record<VizelIconName, string>;
+
+/**
+ * Default node types available in the node selector
+ */
+export declare const vizelDefaultNodeTypes: ({
+    name: string;
+    label: string;
+    icon: "paragraph";
+    isActive: (editor: Editor) => boolean;
+    command: (editor: Editor) => boolean;
+} | {
+    name: string;
+    label: string;
+    icon: "heading1";
+    isActive: (editor: Editor) => boolean;
+    command: (editor: Editor) => boolean;
+} | {
+    name: string;
+    label: string;
+    icon: "heading2";
+    isActive: (editor: Editor) => boolean;
+    command: (editor: Editor) => boolean;
+} | {
+    name: string;
+    label: string;
+    icon: "heading3";
+    isActive: (editor: Editor) => boolean;
+    command: (editor: Editor) => boolean;
+} | {
+    name: string;
+    label: string;
+    icon: "bulletList";
+    isActive: (editor: Editor) => boolean;
+    command: (editor: Editor) => boolean;
+} | {
+    name: string;
+    label: string;
+    icon: "orderedList";
+    isActive: (editor: Editor) => boolean;
+    command: (editor: Editor) => boolean;
+} | {
+    name: string;
+    label: string;
+    icon: "taskList";
+    isActive: (editor: Editor) => boolean;
+    command: (editor: Editor) => boolean;
+} | {
+    name: string;
+    label: string;
+    icon: "blockquote";
+    isActive: (editor: Editor) => boolean;
+    command: (editor: Editor) => boolean;
+} | {
+    name: string;
+    label: string;
+    icon: "codeBlock";
+    isActive: (editor: Editor) => boolean;
+    command: (editor: Editor) => boolean;
+})[];
+
+/**
+ * Default slash commands with groups and keywords
+ */
+export declare const vizelDefaultSlashCommands: VizelSlashCommandItem[];
+
+/**
+ * Options for the VizelDetailsContent extension
+ */
+export declare interface VizelDetailsContentOptions {
+    /**
+     * HTML attributes to add to the details content element
+     */
+    HTMLAttributes?: Record<string, unknown>;
+}
+
+/**
+ * Options for the Details container extension
+ */
+export declare interface VizelDetailsNodeOptions {
+    /**
+     * HTML attributes to add to the details element
+     */
+    HTMLAttributes?: Record<string, unknown>;
+    /**
+     * Whether the details should be open by default
+     * @default false
+     */
+    openByDefault?: boolean;
+}
+
+/**
+ * Combined options for all VizelDetails extensions
+ */
+export declare interface VizelDetailsOptions {
+    /**
+     * Options for the details container extension
+     */
+    details?: VizelDetailsNodeOptions;
+    /**
+     * Options for the details content extension
+     */
+    detailsContent?: VizelDetailsContentOptions;
+    /**
+     * Options for the details summary extension
+     */
+    detailsSummary?: VizelDetailsSummaryOptions;
+}
+
+/**
+ * Options for the VizelDetailsSummary extension
+ */
+export declare interface VizelDetailsSummaryOptions {
+    /**
+     * HTML attributes to add to the details summary element
+     */
+    HTMLAttributes?: Record<string, unknown>;
+}
+
+/**
+ * Diagram extension for block diagrams
+ */
+export declare const VizelDiagram: Node_2<VizelDiagramOptions, any>;
+
+/**
+ * Options for the Diagram extension
+ */
+export declare interface VizelDiagramOptions {
+    /**
+     * Mermaid configuration options
+     * @see https://mermaid.js.org/config/setup/modules/config.html
+     */
+    mermaidConfig?: MermaidConfig;
+    /**
+     * Default GraphViz layout engine
+     * @default "dot"
+     */
+    graphvizEngine?: GraphvizEngine;
+    /**
+     * Default diagram type when creating new diagrams
+     * @default "mermaid"
+     */
+    defaultType?: VizelDiagramType;
+    /**
+     * Default diagram code for new diagrams (for mermaid)
+     * @default "flowchart TD\n  A[Start] --> B[End]"
+     */
+    defaultCode?: string;
+    /**
+     * Default diagram code for new GraphViz diagrams
+     * @default "digraph G {\n  A -> B\n}"
+     */
+    defaultGraphvizCode?: string;
+}
+
+/**
+ * Supported diagram types
+ */
+export declare type VizelDiagramType = "mermaid" | "graphviz";
+
+/**
+ * Utilities for managing suggestion popup containers (e.g., slash menu).
+ * These helpers provide consistent positioning and lifecycle management
+ * across all framework implementations.
+ */
+/**
+ * A function that returns a DOMRect or null.
+ * Used by Tiptap's suggestion system for positioning.
+ */
+export declare type VizelDOMRectGetter = (() => DOMRect | null) | null | undefined;
+
+export { VizelDragHandle }
+
+export declare interface VizelDragHandleOptions {
+    /**
+     * Whether to show the drag handle
+     * @default true
+     */
+    enabled?: boolean;
+}
+
+/**
+ * Editor configuration options
+ */
+export declare interface VizelEditorOptions {
+    /** Feature configuration */
+    features?: VizelFeatureOptions;
+    /** Initial content in JSON format */
+    initialContent?: JSONContent;
+    /**
+     * Initial content in Markdown format.
+     * If both initialContent and initialMarkdown are provided, initialMarkdown takes precedence.
+     * @example
+     * ```typescript
+     * const editor = useVizelEditor({
+     *   initialMarkdown: "# Hello World\n\nThis is **bold** text.",
+     * });
+     * ```
+     */
+    initialMarkdown?: string;
+    /**
+     * Automatically transform diagram code blocks (mermaid, graphviz) to diagram nodes
+     * when importing markdown content. Only applies when initialMarkdown is provided.
+     * @default true
+     */
+    transformDiagramsOnImport?: boolean;
+    /** Placeholder text when editor is empty */
+    placeholder?: string;
+    /** Whether the editor is editable */
+    editable?: boolean;
+    /** Auto focus on mount */
+    autofocus?: boolean | "start" | "end" | "all" | number;
+    /** Callback when content changes */
+    onUpdate?: (props: {
+        editor: Editor;
+    }) => void;
+    /** Callback when editor is created */
+    onCreate?: (props: {
+        editor: Editor;
+    }) => void;
+    /** Callback when editor is destroyed */
+    onDestroy?: () => void;
+    /** Callback when selection changes */
+    onSelectionUpdate?: (props: {
+        editor: Editor;
+    }) => void;
+    /** Callback when editor gets focus */
+    onFocus?: (props: {
+        editor: Editor;
+    }) => void;
+    /** Callback when editor loses focus */
+    onBlur?: (props: {
+        editor: Editor;
+    }) => void;
+}
+
+/**
+ * Editor state for external consumption
+ */
+export declare interface VizelEditorState {
+    /** Whether the editor is currently focused */
+    isFocused: boolean;
+    /** Whether the editor is empty */
+    isEmpty: boolean;
+    /** Whether content can be undone */
+    canUndo: boolean;
+    /** Whether content can be redone */
+    canRedo: boolean;
+    /** Character count */
+    characterCount: number;
+    /** Word count */
+    wordCount: number;
+}
+
+/**
+ * Embed node extension
+ */
+export declare const VizelEmbed: Node_2<VizelEmbedOptions, any>;
+
+/**
+ * Embed metadata returned from fetch
+ */
+export declare interface VizelEmbedData {
+    /** Original URL */
+    url: string;
+    /** Type of embed based on available data */
+    type: VizelEmbedType;
+    /** Provider name if detected */
+    provider?: string;
+    /** oEmbed HTML content */
+    html?: string;
+    /** oEmbed width */
+    width?: number;
+    /** oEmbed height */
+    height?: number;
+    /** OGP/oEmbed title */
+    title?: string;
+    /** OGP/oEmbed description */
+    description?: string;
+    /** OGP/oEmbed image URL */
+    image?: string;
+    /** OGP site name */
+    siteName?: string;
+    /** Favicon URL */
+    favicon?: string;
+    /** Whether the embed is currently loading */
+    loading?: boolean;
+}
+
+/**
+ * Embed extension options
+ */
+export declare interface VizelEmbedOptions {
+    /**
+     * Function to fetch embed data from URL
+     *
+     * By default, uses createVizelDefaultFetchEmbedData() which fetches oEmbed data
+     * for CORS-enabled providers (YouTube, Vimeo, Spotify, etc.)
+     *
+     * For full OGP/metadata support, provide a custom function that uses
+     * a server-side proxy to fetch page metadata.
+     */
+    fetchEmbedData?: VizelFetchEmbedDataFn;
+    /** Custom providers to add or override */
+    providers?: VizelEmbedProvider[];
+    /** HTML attributes for the embed wrapper */
+    HTMLAttributes?: Record<string, unknown>;
+    /** Enable paste handler for URL detection */
+    pasteHandler?: boolean;
+    /** Inline embeds (rendered inline with text) vs block embeds */
+    inline?: boolean;
+}
+
+/**
+ * Plugin key for embed paste handler
+ */
+export declare const vizelEmbedPastePluginKey: PluginKey<any>;
+
+/**
+ * oEmbed provider definition
+ */
+export declare interface VizelEmbedProvider {
+    /** Provider name (e.g., 'youtube', 'twitter') */
+    name: string;
+    /** URL patterns to match */
+    patterns: RegExp[];
+    /** oEmbed API endpoint (optional - some providers don't support oEmbed) */
+    oEmbedEndpoint?: string;
+    /** Whether the oEmbed endpoint supports CORS (can be fetched from browser) */
+    supportsCors?: boolean;
+    /** Transform function for URL (e.g., extract video ID) */
+    transform?: (url: string) => string;
+}
+
+/**
+ * Embed type based on available metadata
+ */
+export declare type VizelEmbedType = "oembed" | "ogp" | "title" | "link";
+
+export declare interface VizelExtensionsOptions {
+    /** Placeholder text when editor is empty */
+    placeholder?: string;
+    /** Configure heading levels (default: [1, 2, 3]) */
+    headingLevels?: (1 | 2 | 3 | 4 | 5 | 6)[];
+    /**
+     * Feature configuration. All features are enabled by default.
+     * Set to false to disable a feature, or pass options to configure it.
+     */
+    features?: VizelFeatureOptions;
+}
+
+/**
+ * Feature configuration for Vizel editor.
+ * All features are enabled by default.
+ * Set to `true` to enable with defaults, `false` to disable, or pass options to configure.
+ */
+export declare interface VizelFeatureOptions {
+    /** Slash command menu (type "/" to open) */
+    slashCommand?: VizelSlashCommandOptions | boolean;
+    /** Table support with column/row controls */
+    table?: VizelTableOptions | boolean;
+    /** Link extension with autolink and paste support */
+    link?: VizelLinkOptions | boolean;
+    /** Image upload and resize */
+    image?: VizelImageFeatureOptions | boolean;
+    /** Markdown import/export support */
+    markdown?: VizelMarkdownOptions | boolean;
+    /** Task list (checkbox) support */
+    taskList?: VizelTaskListExtensionsOptions | boolean;
+    /** Character and word count tracking */
+    characterCount?: VizelCharacterCountOptions | boolean;
+    /** Text color and highlight support */
+    textColor?: VizelTextColorOptions | boolean;
+    /** Code block with syntax highlighting */
+    codeBlock?: VizelCodeBlockOptions | boolean;
+    /** Mathematics (LaTeX) support with KaTeX rendering */
+    mathematics?: VizelMathematicsOptions | boolean;
+    /** Drag handle for block reordering (includes Alt+Up/Down keyboard shortcuts) */
+    dragHandle?: VizelDragHandleOptions | boolean;
+    /** URL embedding with oEmbed/OGP support */
+    embed?: VizelEmbedOptions | boolean;
+    /** Collapsible content blocks (accordion) */
+    details?: VizelDetailsOptions | boolean;
+    /** Diagram support (Mermaid, GraphViz) */
+    diagram?: VizelDiagramOptions | boolean;
+}
+
+/**
+ * Function to fetch embed data from URL
+ * This should be provided by the user to handle CORS
+ */
+export declare type VizelFetchEmbedDataFn = (url: string) => Promise<VizelEmbedData>;
+
+/**
+ * File handler error
+ */
+export declare interface VizelFileHandlerError {
+    type: VizelFileHandlerErrorType;
+    message: string;
+    files?: File[];
+}
+
+/**
+ * File handler error types
+ */
+export declare type VizelFileHandlerErrorType = "invalid_mime_type" | "no_files";
+
+/**
+ * Options for file handler extension
+ */
+export declare interface VizelFileHandlerOptions {
+    /**
+     * Allowed MIME types for files
+     * @default ["image/jpeg", "image/png", "image/gif", "image/webp", "image/svg+xml"]
+     */
+    allowedMimeTypes?: string[];
+    /**
+     * Handler called when files are pasted
+     * @param editor - The editor instance
+     * @param files - Array of pasted files
+     * @param htmlContent - HTML content from clipboard (useful for external images)
+     */
+    onPaste?: (editor: Editor, files: File[], htmlContent: string | undefined) => void;
+    /**
+     * Handler called when files are dropped
+     * @param editor - The editor instance
+     * @param files - Array of dropped files
+     * @param pos - Drop position in the document
+     */
+    onDrop?: (editor: Editor, files: File[], pos: number) => void;
+    /**
+     * Handler for validation errors (file type not allowed, etc.)
+     */
+    onError?: (error: VizelFileHandlerError) => void;
+}
+
+/**
+ * Context value for icon customization.
+ * Used by framework-specific icon providers.
+ */
+export declare interface VizelIconContextValue {
+    /**
+     * Custom icon mappings that override default Lucide icons.
+     */
+    customIcons?: CustomIconMap | undefined;
+}
+
+/**
+ * All icon names used in Vizel.
+ */
+export declare type VizelIconName = VizelSlashCommandIconName | VizelNodeTypeIconName | VizelTableIconName | VizelUIIconName | VizelBubbleMenuIconName | VizelInternalIconName;
+
+/**
+ * Icon renderer function type.
+ * Framework packages inject their implementation to render icons as SVG strings.
+ */
+export declare type VizelIconRenderer = (name: VizelInternalIconName) => string;
+
+/**
+ * Icon renderer options for customization.
+ */
+export declare interface VizelIconRendererOptions {
+    /** Icon width in pixels */
+    width?: number;
+    /** Icon height in pixels */
+    height?: number;
+}
+
+/**
+ * Extended icon renderer function type with options support.
+ */
+export declare type VizelIconRendererWithOptions = (name: VizelInternalIconName, options?: VizelIconRendererOptions) => string;
+
+export { VizelImage }
+
+/**
+ * Image feature options
+ */
+export declare interface VizelImageFeatureOptions extends Partial<VizelImageUploadPluginOptions> {
+    /** Enable image resizing (default: true) */
+    resize?: boolean;
+}
+
+/**
+ * Create file handler handlers for image upload integration.
+ *
+ * This is a convenience function that creates onPaste and onDrop handlers
+ * that integrate with the image upload system.
+ *
+ * @example
+ * ```ts
+ * const { onPaste, onDrop } = createVizelImageFileHandlers({
+ *   onUpload: async (file) => {
+ *     const formData = new FormData();
+ *     formData.append("file", file);
+ *     const res = await fetch("/api/upload", { method: "POST", body: formData });
+ *     return (await res.json()).url;
+ *   },
+ *   onError: (error) => console.error(error),
+ * });
+ *
+ * const extension = createVizelFileHandlerExtension({ onPaste, onDrop });
+ * ```
+ */
+export declare interface VizelImageFileHandlerOptions {
+    /**
+     * Upload function that receives a file and returns a URL
+     */
+    onUpload: (file: File) => Promise<string>;
+    /**
+     * Called when an upload error occurs
+     */
+    onUploadError?: (error: Error, file: File) => void;
+    /**
+     * Called during upload progress (if supported)
+     */
+    onUploadProgress?: (progress: number, file: File) => void;
+}
+
+export declare interface VizelImageFileHandlers {
+    onPaste: NonNullable<VizelFileHandlerOptions["onPaste"]>;
+    onDrop: NonNullable<VizelFileHandlerOptions["onDrop"]>;
+}
+
+export declare interface VizelImageOptions {
+    /** Allow inline images */
+    inline?: boolean;
+    /** Allow base64 encoded images */
+    allowBase64?: boolean;
+    /** HTML attributes for the image element */
+    HTMLAttributes?: Record<string, unknown>;
+}
+
+/**
+ * Options for image resize functionality
+ */
+export declare interface VizelImageResizeOptions {
+    /** Enable image resizing (default: true when resize options provided) */
+    enabled?: boolean;
+    /** Minimum width in pixels (default: 100) */
+    minWidth?: number;
+    /** Minimum height in pixels (default: 100) */
+    minHeight?: number;
+    /** Maximum width in pixels (default: undefined - uses container width) */
+    maxWidth?: number;
+}
+
+/**
+ * Options for image upload extension
+ */
+export declare interface VizelImageUploadOptions extends VizelImageOptions {
+    /** Image upload configuration */
+    upload: VizelImageUploadPluginOptions;
+    /** Image resize options (set to false to disable) */
+    resize?: VizelImageResizeOptions | false;
+}
+
+/**
+ * Image upload plugin options
+ */
+export declare interface VizelImageUploadPluginOptions {
+    /**
+     * Handler to upload file and return the uploaded image URL
+     * @param file The file to upload
+     * @returns Promise resolving to the uploaded image URL
+     */
+    onUpload: (file: File) => Promise<string>;
+    /**
+     * Maximum file size in bytes
+     * @default 20MB (20 * 1024 * 1024)
+     */
+    maxFileSize?: number;
+    /**
+     * Allowed MIME types
+     * @default ["image/jpeg", "image/png", "image/gif", "image/webp", "image/svg+xml"]
+     */
+    allowedTypes?: string[];
+    /**
+     * CSS class for the placeholder element
+     * @default "vizel-image-placeholder"
+     */
+    placeholderClass?: string;
+    /**
+     * CSS class for the uploading image
+     * @default "vizel-image-uploading"
+     */
+    imageClass?: string;
+    /**
+     * Callback for validation errors
+     */
+    onValidationError?: (error: VizelImageValidationError) => void;
+    /**
+     * Callback for upload errors
+     */
+    onUploadError?: (error: Error, file: File) => void;
+}
+
+/**
+ * Options for image upload with file handler
+ */
+export declare interface VizelImageUploadWithFileHandlerOptions extends VizelImageOptions {
+    /** Image upload configuration */
+    upload: VizelImageUploadPluginOptions;
+    /** Image resize options (set to false to disable) */
+    resize?: VizelImageResizeOptions | false;
+    /** Use @tiptap/extension-file-handler for drop/paste handling (default: true) */
+    useFileHandler?: boolean;
+}
+
+/**
+ * Image validation error
+ */
+export declare interface VizelImageValidationError {
+    type: VizelImageValidationErrorType;
+    message: string;
+    file: File;
+}
+
+/**
+ * Image validation error types
+ */
+export declare type VizelImageValidationErrorType = "invalid_type" | "file_too_large";
+
+/**
+ * Icon names used internally in NodeView rendering (drag handle, table controls).
+ * These icons are rendered via the injected VizelIconRenderer from framework packages.
+ */
+export declare type VizelInternalIconName = "grip" | "gripHorizontal" | "plusSmall" | "arrowUp" | "arrowDown" | "arrowLeft" | "arrowRight" | "alignLeft" | "alignCenter" | "alignRight" | "listOrdered";
+
+export declare interface VizelLinkOptions {
+    /**
+     * If enabled, links will be opened on click.
+     * @default true
+     */
+    openOnClick?: boolean;
+    /**
+     * If enabled, URLs will be automatically linked while typing.
+     * @default true
+     */
+    autolink?: boolean;
+    /**
+     * If enabled, pasted URLs will be linked.
+     * @default true
+     */
+    linkOnPaste?: boolean;
+    /**
+     * Default protocol for links without one.
+     * @default 'https'
+     */
+    defaultProtocol?: string;
+    /**
+     * Additional HTML attributes to add to links.
+     */
+    HTMLAttributes?: Record<string, string>;
+}
+
+/**
+ * Pre-configured Markdown extension with default settings.
+ *
+ * Uses:
+ * - Space indentation (2 spaces)
+ * - GitHub Flavored Markdown enabled
+ * - No automatic line breaks
+ */
+export declare const VizelMarkdown: Extension<MarkdownExtensionOptions, MarkdownExtensionStorage>;
+
+/**
+ * Configuration options for the Markdown extension
+ */
+export declare interface VizelMarkdownOptions {
+    /**
+     * Configure indentation for markdown output
+     * @default { style: 'space', size: 2 }
+     */
+    indentation?: MarkdownExtensionOptions["indentation"];
+    /**
+     * Enable GitHub Flavored Markdown
+     * @default true
+     */
+    gfm?: boolean;
+    /**
+     * Convert newlines to <br> tags
+     * @default false
+     */
+    breaks?: boolean;
+}
+
+/**
+ * Create debounced markdown sync handlers.
+ * This is a framework-agnostic helper that frameworks can use to implement their own hooks.
+ *
+ * @param options - Sync options
+ * @returns Object with handlers and state
+ *
+ * @example
+ * ```typescript
+ * const sync = createVizelMarkdownSyncHandlers({
+ *   debounceMs: 300,
+ *   transformDiagrams: true,
+ * });
+ *
+ * // In onUpdate callback:
+ * sync.handleUpdate(editor);
+ *
+ * // Get current markdown:
+ * console.log(sync.getMarkdown());
+ *
+ * // Set markdown:
+ * sync.setMarkdown(editor, "# New content");
+ *
+ * // Cleanup:
+ * sync.destroy();
+ * ```
+ */
+export declare interface VizelMarkdownSyncHandlers {
+    /** Handle editor update (call in onUpdate callback) */
+    handleUpdate: (editor: Editor) => void;
+    /** Get current markdown content */
+    getMarkdown: () => string;
+    /** Set markdown content to editor */
+    setMarkdown: (editor: Editor, markdown: string) => void;
+    /** Check if export is pending */
+    isPending: () => boolean;
+    /** Force immediate export (flush pending) */
+    flush: (editor: Editor) => void;
+    /** Cleanup (cancel pending timers) */
+    destroy: () => void;
+}
+
+/**
+ * Options for Markdown synchronization
+ */
+export declare interface VizelMarkdownSyncOptions {
+    /**
+     * Debounce delay in milliseconds for markdown export.
+     * Set to 0 for immediate export (not recommended for large documents).
+     * @default 300
+     */
+    debounceMs?: number;
+    /**
+     * Automatically transform diagram code blocks when setting markdown content.
+     * @default true
+     */
+    transformDiagrams?: boolean;
+}
+
+/**
+ * Result of Markdown synchronization
+ */
+export declare interface VizelMarkdownSyncResult {
+    /** Current markdown content (reactive) */
+    markdown: string;
+    /**
+     * Set markdown content to the editor.
+     * Automatically transforms diagram code blocks if transformDiagrams is enabled.
+     */
+    setMarkdown: (markdown: string) => void;
+    /** Whether markdown export is currently pending (debounced) */
+    isPending: boolean;
+}
+
+/**
+ * Mathematics extension for block math expressions
+ */
+export declare const VizelMathBlock: Node_2<VizelMathematicsOptions, any>;
+
+/**
+ * Options for the Mathematics extension
+ */
+export declare interface VizelMathematicsOptions {
+    /**
+     * KaTeX rendering options
+     * @see https://katex.org/docs/options.html
+     */
+    katexOptions?: katex.KatexOptions;
+    /**
+     * Enable inline math input rules ($...$)
+     * @default true
+     */
+    inlineInputRules?: boolean;
+    /**
+     * Enable block math input rules ($$...$$)
+     * @default true
+     */
+    blockInputRules?: boolean;
+}
+
+/**
+ * Mathematics extension for inline math expressions
+ */
+export declare const VizelMathInline: Node_2<VizelMathematicsOptions, any>;
+
+/**
+ * Options for mounting portal content.
+ */
+export declare interface VizelMountPortalOptions {
+    /** The z-index layer for the portal */
+    layer?: VizelPortalLayer;
+    /** Additional CSS class names */
+    className?: string;
+}
+
+/**
+ * Icon names used in node type selector.
+ */
+export declare type VizelNodeTypeIconName = "paragraph" | "heading1" | "heading2" | "heading3" | "bulletList" | "orderedList" | "taskList" | "blockquote" | "codeBlock";
+
+/**
+ * Node type option for the node selector dropdown
+ */
+export declare interface VizelNodeTypeOption {
+    /** Internal node name */
+    name: string;
+    /** Display label */
+    label: string;
+    /** Icon name (semantic name, rendered by framework packages) */
+    icon: VizelNodeTypeIconName;
+    /** Check if this node type is currently active */
+    isActive: (editor: Editor) => boolean;
+    /** Command to transform the current block to this node type */
+    command: (editor: Editor) => void;
+}
+
+/** Portal layer type */
+export declare type VizelPortalLayer = keyof typeof VIZEL_PORTAL_Z_INDEX;
+
+/**
+ * ResizableImage Extension
+ *
+ * Extends the base Image extension with resize handles.
+ * Uses a NodeView to wrap images with draggable resize handles.
+ */
+declare const VizelResizableImage: Node_2<VizelResizableImageOptions, any>;
+export { VizelResizableImage as VizelImageResize }
+export { VizelResizableImage }
+
+/**
+ * Configuration options for the VizelResizableImage extension.
+ * These are passed to VizelResizableImage.configure().
+ */
+export declare interface VizelResizableImageOptions {
+    /** Minimum width in pixels (default: 100) */
+    minWidth?: number;
+    /** Minimum height in pixels (default: 100) */
+    minHeight?: number;
+    /** Maximum width in pixels (default: undefined - no limit, uses container width) */
+    maxWidth?: number;
+    /** Allow inline images */
+    inline?: boolean;
+    /** Allow base64 encoded images */
+    allowBase64?: boolean;
+    /** HTML attributes for the image element */
+    HTMLAttributes?: Record<string, unknown>;
+}
+
+/**
+ * Resolved theme (actual applied theme)
+ */
+export declare type VizelResolvedTheme = "light" | "dark";
+
+/**
+ * Options for resolving features with a custom slash menu renderer.
+ */
+export declare interface VizelResolveFeaturesOptions {
+    /** The features configuration */
+    features?: VizelFeatureOptions;
+    /** Factory function to create the slash menu renderer */
+    createSlashMenuRenderer: () => unknown;
+}
+
+/**
+ * Save status type
+ */
+export declare type VizelSaveStatus = "saved" | "saving" | "unsaved" | "error";
+
+export declare const VizelSlashCommand: Extension<VizelSlashCommandExtensionOptions, any>;
+
+export declare interface VizelSlashCommandExtensionOptions {
+    /** Custom slash command items (defaults to heading, list, quote, code) */
+    items?: VizelSlashCommandItem[];
+    /** Suggestion options for customizing the popup behavior */
+    suggestion?: Partial<SuggestionOptions>;
+}
+
+/**
+ * Command group for categorized display
+ */
+export declare interface VizelSlashCommandGroup {
+    /** Group name */
+    name: string;
+    /** Commands in this group */
+    items: VizelSlashCommandItem[];
+}
+
+/**
+ * Icon system types for Vizel editor.
+ *
+ * This module defines the icon names and types used throughout the editor.
+ * Framework packages (react, vue, svelte) provide the actual icon implementations
+ * using Iconify or other icon libraries.
+ */
+/**
+ * Icon names used in slash commands and menus.
+ * These are semantic names that map to actual icons in framework packages.
+ */
+export declare type VizelSlashCommandIconName = "heading1" | "heading2" | "heading3" | "bulletList" | "orderedList" | "taskList" | "blockquote" | "horizontalRule" | "details" | "codeBlock" | "table" | "image" | "imageUpload" | "embed" | "mathBlock" | "mathInline" | "mermaid" | "graphviz";
+
+/**
+ * Extended slash command item with enhanced features
+ */
+export declare interface VizelSlashCommandItem {
+    /** Display title */
+    title: string;
+    /** Description of the command */
+    description: string;
+    /** Icon name (semantic name, rendered by framework packages) */
+    icon: VizelSlashCommandIconName;
+    /** Command to execute */
+    command: (props: {
+        editor: Editor;
+        range: VizelSlashCommandRange;
+    }) => void;
+    /** Keyboard shortcut hint (e.g., "⌘B") */
+    shortcut?: string;
+    /** Additional keywords for fuzzy search */
+    keywords?: string[];
+    /** Group name for categorization */
+    group?: string;
+}
+
+/**
+ * Slash command feature options
+ */
+export declare interface VizelSlashCommandOptions {
+    /** Custom slash command items */
+    items?: VizelSlashCommandItem[];
+    /** Suggestion options (framework-specific renderer) */
+    suggestion?: Record<string, unknown>;
+}
+
+/**
+ * Range for slash command execution
+ */
+export declare interface VizelSlashCommandRange {
+    from: number;
+    to: number;
+}
+
+/**
+ * Fuzzy search result with match highlighting
+ */
+export declare interface VizelSlashCommandSearchResult {
+    /** The original item */
+    item: VizelSlashCommandItem;
+    /** Match score (0 = perfect match, higher = worse) */
+    score: number;
+    /** Matched indices for title highlighting */
+    titleMatches?: [number, number][] | undefined;
+}
+
+/**
+ * Options for creating a slash menu renderer
+ */
+export declare interface VizelSlashMenuRendererOptions {
+    /** Custom class name for the menu */
+    className?: string;
+}
+
+/**
+ * Storage backend type for auto-save
+ */
+export declare type VizelStorageBackend = "localStorage" | "sessionStorage" | {
+    save: (content: JSONContent) => void | Promise<void>;
+    load?: () => JSONContent | null | Promise<JSONContent | null>;
+};
+
+/**
+ * A managed suggestion container with positioning support.
+ */
+export declare interface VizelSuggestionContainer {
+    /** The outer container element appended to document.body */
+    container: HTMLDivElement;
+    /** The inner container for mounting framework components */
+    menuContainer: HTMLDivElement;
+    /** Update the container position based on the cursor/selection rect */
+    updatePosition: (clientRect: VizelDOMRectGetter) => void;
+    /** Remove the container from the DOM */
+    destroy: () => void;
+}
+
+/**
+ * Extended Table with Markdown parsing/rendering support.
+ */
+export declare const VizelTable: Node_2<TableOptions, any>;
+
+/**
+ * Extended TableCell with textAlign attribute support.
+ */
+export declare const VizelTableCell: Node_2<TableCellOptions, any>;
+
+/**
+ * Text alignment options for table cells.
+ */
+export declare type VizelTableCellAlignment = "left" | "center" | "right";
+
+/**
+ * Combined options for table with controls - extends Table's options with UI controls.
+ */
+export declare type VizelTableControlsOptions = Partial<TableOptions> & VizelTableControlsUIOptions;
+
+/**
+ * Options for table controls UI (column/row insert buttons, row handle menu).
+ */
+export declare interface VizelTableControlsUIOptions {
+    /**
+     * Show column insert buttons on vertical border hover
+     * @default true
+     */
+    showColumnInsert?: boolean;
+    /**
+     * Show row insert buttons on horizontal border hover
+     * @default true
+     */
+    showRowInsert?: boolean;
+    /**
+     * Show row handle with edit menu on cell hover
+     * @default true
+     */
+    showRowHandle?: boolean;
+}
+
+/**
+ * Extended TableHeader with textAlign attribute support.
+ */
+export declare const VizelTableHeader: Node_2<TableHeaderOptions, any>;
+
+/**
+ * Icon names used in table controls.
+ */
+export declare type VizelTableIconName = "arrowUp" | "arrowDown" | "arrowLeft" | "arrowRight" | "alignLeft" | "alignCenter" | "alignRight" | "plus" | "gripVertical" | "gripHorizontal";
+
+export declare interface VizelTableMenuItem {
+    label: string;
+    icon?: VizelTableIconName;
+    command: string | ((editor: Editor) => void);
+    destructive?: boolean;
+    divider?: boolean;
+}
+
+export declare interface VizelTableOptions {
+    /**
+     * If enabled, tables can be resized.
+     * @default false
+     */
+    resizable?: boolean;
+    /**
+     * Minimum width for table cells.
+     * @default 50
+     */
+    cellMinWidth?: number;
+    /**
+     * If enabled, the last column can be resized.
+     * @default true
+     */
+    lastColumnResizable?: boolean;
+    /**
+     * Enable interactive table controls (column/row insert buttons, row handle with menu).
+     * Set to `true` to enable all controls, `false` to disable, or an object to customize.
+     * @default true
+     */
+    controls?: boolean | VizelTableControlsOptions;
+    /**
+     * Additional HTML attributes for table elements.
+     */
+    tableHTMLAttributes?: Record<string, string>;
+    headerHTMLAttributes?: Record<string, string>;
+    cellHTMLAttributes?: Record<string, string>;
+}
+
+/**
+ * VizelTableWithControls - Table extension with interactive controls
+ */
+export declare const VizelTableWithControls: Node_2<VizelTableControlsOptions, any>;
+
+export declare interface VizelTaskItemOptions {
+    /**
+     * HTML attributes to add to the task item element
+     */
+    HTMLAttributes?: Record<string, unknown>;
+    /**
+     * Whether the task item checkbox is nested inside a label
+     * @default true
+     */
+    nested?: boolean;
+    /**
+     * A callback triggered when a task item is clicked (checked/unchecked)
+     */
+    onReadOnlyChecked?: (node: unknown, checked: boolean) => boolean;
+}
+
+export declare interface VizelTaskListExtensionsOptions {
+    /**
+     * Options for the task list extension
+     */
+    taskList?: VizelTaskListOptions;
+    /**
+     * Options for the task item extension
+     */
+    taskItem?: VizelTaskItemOptions;
+}
+
+export declare interface VizelTaskListOptions {
+    /**
+     * HTML attributes to add to the task list element
+     */
+    HTMLAttributes?: Record<string, unknown>;
+    /**
+     * The node name for list items
+     * @default 'taskItem'
+     */
+    itemTypeName?: string;
+}
+
+/**
+ * Options for text color extensions
+ */
+export declare interface VizelTextColorOptions {
+    /** Custom text color palette */
+    textColors?: VizelColorDefinition[];
+    /** Custom highlight color palette */
+    highlightColors?: VizelColorDefinition[];
+    /** Enable multicolor highlights (allows any color) */
+    multicolor?: boolean;
+}
+
+/**
+ * Text highlighting utilities for Vizel editor.
+ *
+ * These utilities help with highlighting matched text segments,
+ * typically used in fuzzy search results (e.g., slash menu).
+ */
+/**
+ * A segment of text that may or may not be highlighted.
+ */
+export declare interface VizelTextSegment {
+    /** The text content of this segment */
+    text: string;
+    /** Whether this segment should be highlighted */
+    highlight: boolean;
+}
+
+/**
+ * Theme utilities for Vizel editor
+ *
+ * Provides dark mode support with system preference detection and manual toggle.
+ */
+/**
+ * Available theme options
+ */
+export declare type VizelTheme = "light" | "dark" | "system";
+
+/**
+ * Theme provider options
+ */
+export declare interface VizelThemeProviderOptions {
+    /** Default theme (default: "system") */
+    defaultTheme?: VizelTheme;
+    /** Storage key for persisting theme (default: "vizel-theme") */
+    storageKey?: string;
+    /** Target element to apply theme attribute (default: document.documentElement) */
+    targetSelector?: string;
+    /** Disable theme transitions during initial load */
+    disableTransitionOnChange?: boolean;
+}
+
+/**
+ * Theme state returned by useTheme hooks
+ */
+export declare interface VizelThemeState {
+    /** Current theme setting */
+    theme: VizelTheme;
+    /** Resolved theme (actual applied theme) */
+    resolvedTheme: VizelResolvedTheme;
+    /** System theme preference */
+    systemTheme: VizelResolvedTheme;
+    /** Set theme */
+    setTheme: (theme: VizelTheme) => void;
+}
+
+/**
+ * Icon names used in UI components (SaveIndicator, etc.).
+ */
+export declare type VizelUIIconName = "check" | "loader" | "circle" | "warning" | "chevronDown" | "x";
+
+/**
+ * Image upload function type
+ */
+export declare type VizelUploadImageFn = (file: File, view: EditorView, pos: number) => void;
+
+export { }
+
+
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        embed: {
+            /**
+             * Set an embed from URL
+             */
+            setEmbed: (options: {
+                url: string;
+            }) => ReturnType;
+            /**
+             * Update embed data
+             */
+            updateEmbed: (data: Partial<VizelEmbedData>) => ReturnType;
+        };
+    }
+}
+
+
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        vizelBlockMove: {
+            /**
+             * Move the current block up
+             */
+            moveBlockUp: () => ReturnType;
+            /**
+             * Move the current block down
+             */
+            moveBlockDown: () => ReturnType;
+        };
+    }
+}
+
+
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        diagram: {
+            /**
+             * Insert a diagram block
+             */
+            insertDiagram: (options: {
+                code: string;
+                type?: VizelDiagramType;
+            }) => ReturnType;
+        };
+    }
+}
+
+
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        mathematics: {
+            /**
+             * Insert an inline math expression
+             */
+            insertMath: (options: {
+                latex: string;
+            }) => ReturnType;
+            /**
+             * Insert a block math expression
+             */
+            insertMathBlock: (options: {
+                latex: string;
+            }) => ReturnType;
+        };
+    }
+}