@surrealdb/ui 1.1.1 → 1.2.0

package/dist/ui.d.ts

@@ -1,18 +1,15 @@
 import { ActionIconProps } from '@mantine/core';
 import { AlertProps } from '@mantine/core';
-import { AnchorProps } from '@mantine/core';
 import { BadgeProps } from '@mantine/core';
-import { BlockquoteElement } from '@yoopta/blockquote';
 import { BoxProps } from '@mantine/core';
 import { ButtonProps } from '@mantine/core';
-import { CalloutElementMap } from '@yoopta/callout/dist/types';
 import { CodeProps } from '@mantine/core';
 import { Command } from '@codemirror/view';
+import { ComponentType } from 'react';
 import { default as default_2 } from 'github-slugger';
-import { DividerElementMap } from '@yoopta/divider/dist/types';
 import { EditorSelection } from '@codemirror/state';
+import { EditorState } from '@codemirror/state';
 import { EditorView } from '@codemirror/view';
-import { ElementProps } from '@mantine/core';
 import { Extension } from '@codemirror/state';
 import { FC } from 'react';
 import { GroupProps } from '@mantine/core';
@@ -21,7 +18,7 @@ import { HighlightStyle } from '@codemirror/language';
 import { HTMLAttributes } from 'react';
 import { ImageProps } from '@mantine/core';
 import { KeyBinding } from '@codemirror/view';
-import { ListElementMap } from '@yoopta/lists/dist/types';
+import { Language as Language_2 } from '@codemirror/language';
 import { MantineColor } from '@mantine/core';
 import { MantineColorScheme } from '@mantine/core';
 import { MantineFontSize } from '@mantine/core';
@@ -29,26 +26,21 @@ import { MantineSize } from '@mantine/core';
 import { MantineThemeOverride } from '@mantine/core';
 import { PaperProps } from '@mantine/core';
 import { PropsWithChildren } from 'react';
-import type * as React_2 from 'react';
 import { ReactElement } from 'react';
 import { ReactNode } from 'react';
 import { RefObject } from 'react';
 import { SelectProps } from '@mantine/core';
-import { SlateElement } from '@yoopta/editor';
-import { StackProps } from '@mantine/core';
+import { StateEffectType } from '@codemirror/state';
 import { StateField } from '@codemirror/state';
+import { SyntaxNode } from '@lezer/common';
 import { TabsListProps } from '@mantine/core';
 import { TabsProps as TabsProps_2 } from '@mantine/core';
 import { TabsTabProps } from '@mantine/core';
 import { TextProps } from '@mantine/core';
 import { TitleOrder } from '@mantine/core';
 import { TitleProps } from '@mantine/core';
+import { Tree } from '@lezer/common';
 import { VideoHTMLAttributes } from 'react';
-import { YooEditor } from '@yoopta/editor';
-import { YooptaContentValue } from '@yoopta/editor';
-import { YooptaMark } from '@yoopta/editor';
-import { YooptaOnChangeOptions } from '@yoopta/editor';
-import { YooptaPlugin } from '@yoopta/editor';
 
 /**
  * A keybind used to accept a completion
@@ -72,10 +64,6 @@ export declare const addCursorVerticallyKeymap: readonly KeyBinding[];
 
 declare type AnyFn = (...rest: any[]) => any;
 
-declare type AnyLanguage = Language | (string & {});
-
-export declare type AnyNode = BlockNode | InlineNode | SummaryNode | ListItemNode | TableRowNode | TableCellNode;
-
 /**
  * Apply automatic folding to objects/arrays at the specified depth level
  * @param view - CodeMirror editor view
@@ -83,56 +71,6 @@ export declare type AnyNode = BlockNode | InlineNode | SummaryNode | ListItemNod
  */
 export declare function applyAutoFolding(view: EditorView, autoCollapseDepth: number): void;
 
-export declare type AttributeValue = string | JsxExpression | true;
-
-export declare const BlockEditor: FC<BlockEditorProps>;
-
-export declare interface BlockEditorProps {
-    editor: YooEditor;
-    placeholder?: string;
-    autoFocus?: boolean;
-    readOnly?: boolean;
-    className?: string;
-    onChange?: (value: YooptaContentValue, options: YooptaOnChangeOptions) => void;
-    children?: ReactNode;
-}
-
-export declare type BlockNode = HeadingNode | ParagraphNode | CodeNode | BlockquoteNode | ListNode | TableNode | ThematicBreakNode | DivNode | DetailsNode | ImageNode | JsxComponentNode;
-
-export declare type BlockOptionsComponent = FC<{
-    blockId: string;
-}>;
-
-export declare const BlockOptionsContext: React.Context<BlockOptionsContextValue>;
-
-export declare interface BlockOptionsContextValue {
-    headingLinks?: boolean;
-    checkable?: boolean;
-}
-
-export declare const BlockOptionsProvider: React.Provider<BlockOptionsContextValue>;
-
-declare type BlockquoteElementMap = {
-    blockquote: BlockquoteElement;
-};
-
-export declare interface BlockquoteNode extends CommonAttrs {
-    type: "blockquote";
-    children: BlockNode[];
-    noteKind?: NoteKind;
-    noteTitle?: string;
-}
-
-export declare const BlockRenderer: FC<BlockRendererProps>;
-
-export declare interface BlockRendererProps {
-    value: YooptaContentValue;
-    marks?: YooptaMark<any>[];
-    plugins?: YooptaPlugin<Record<string, SlateElement>, Record<string, unknown>>[];
-    blockOptions?: BlockOptionsContextValue;
-    className?: string;
-}
-
 export declare interface BooleanHandle {
     open: () => void;
     close: () => void;
@@ -294,50 +232,18 @@ export declare const brandYaacomm: string;
 
 export declare const brandYouTube: string;
 
-export declare const BreadcrumbButton: FC<ButtonProps & ElementProps<"button">>;
+export declare const BreadcrumbButton: FC<ButtonProps>;
 
-export declare interface BreakNode extends CommonAttrs {
-    type: "break";
-}
+/**
+ * GitHub-flavoured markdown alert kinds (`> [!kind]`, see GitHub docs).
+ * Other spellings in source are normalised onto this set.
+ */
+declare type CalloutKind = "note" | "tip" | "important" | "warning" | "caution";
 
 export declare const CDN_ID_PATTERN: RegExp;
 
 export declare const CDN_URL_PATTERN: RegExp;
 
-export declare const CDNImage: YooptaPlugin<CDNImageElementMap>;
-
-export declare type CDNImageElement = SlateElement<"cdn-image", CDNImageProps>;
-
-export declare type CDNImageElementMap = {
-    "cdn-image": CDNImageElement;
-};
-
-export declare interface CDNImageProps {
-    nodeType: "void";
-    code: string;
-    alt: string;
-}
-
-export declare const CDNVideo: YooptaPlugin<CDNVideoElementMap>;
-
-export declare type CDNVideoElement = SlateElement<"cdn-video", CDNVideoProps>;
-
-export declare type CDNVideoElementMap = {
-    "cdn-video": CDNVideoElement;
-};
-
-export declare type CDNVideoFormat = "mp4" | "webm" | "mov";
-
-export declare interface CDNVideoProps {
-    nodeType: "void";
-    code: string;
-    format: CDNVideoFormat;
-    loop: boolean;
-    autoplay: boolean;
-    muted: boolean;
-    controls: boolean;
-}
-
 export declare function Check({ children, ...props }: CheckProps): ReactNode;
 
 export declare interface CheckProps extends GroupProps {
@@ -376,31 +282,28 @@ export declare interface CodeEditorProps extends BoxProps {
     ref?: RefObject<EditorView>;
 }
 
-export declare interface CodeNode extends CommonAttrs {
-    type: "code";
-    value: string;
-    lang?: string;
-    title?: string;
-    runnable?: string;
-}
+/** React component keyed by lower-cased fenced-code info string. */
+export declare type CodeRenderer = ComponentType<CodeRendererProps>;
 
-export declare const COLOR_OPTIONS: OptionItem[];
+/** Props for a custom fenced-code-block renderer (inactive block / viewer). */
+export declare interface CodeRendererProps {
+    /** The code body verbatim (CodeText slice, fences excluded). */
+    code: string;
+    /** The (lower-cased) info string from the opening fence, e.g. `mermaid`. */
+    language: string;
+}
 
 export declare type ColorScheme = keyof ThemeConfig;
 
 declare type ColorScheme_2 = keyof ThemeConfig_2;
 
+declare type CommandAction = (view: EditorView, range: SlashCommandRange) => void;
+
 declare interface CommentNode {
     type: "Comment";
     text: string;
 }
 
-export declare interface CommonAttrs {
-    className?: AttributeValue;
-    id?: AttributeValue;
-    style?: AttributeValue;
-}
-
 /**
  * Common extensions applied to all CodeMirror editors
  */
@@ -444,31 +347,26 @@ export declare function createSerializedState(doc: string): EditorStateSnapshot;
  */
 export declare function createStyleHighlighter(theme: ThemeConfig_2, colorScheme: ColorScheme_2): Highlighter;
 
-export declare const CUSTOM_BLOCKS: Set<string>;
-
 /**
  * A custom variant of the history keymap that uses
  * the Mod key instead of the Ctrl key
  */
 export declare const customHistoryKeymap: readonly KeyBinding[];
 
-export declare const DEFAULT_BLOCK_MARKS: YooptaMark<any>[];
-
-export declare const DEFAULT_BLOCK_PLUGINS: YooptaPlugin<Record<string, SlateElement>, Record<string, unknown>>[];
-
-export declare const DEFAULT_BUTTON_PROPS: MantineButtonProps;
+/** Default fenced-code renderers keyed by lower-cased info string (e.g. `mermaid`). */
+export declare const DEFAULT_CODE_RENDERERS: Record<string, CodeRenderer>;
 
-export declare const DEFAULT_CODEBLOCK_PROPS: SurrealCodeBlockProps;
+/** Default JSX components for `<PascalCase />` tags in markdown (e.g. `<Since />`, `<Tabs>`). */
+export declare const DEFAULT_COMPONENTS: MarkdownComponents;
 
-export declare const DEFAULT_IMAGE_PROPS: CDNImageProps;
+/** Default mode used when no mode is provided. */
+export declare const DEFAULT_MARKDOWN_MODE: MarkdownEditMode;
 
-export declare const DEFAULT_LINK_PROPS: SurrealLinkProps;
-
-export declare const DEFAULT_TABLE_PROPS: MantineTableProps;
-
-export declare const DEFAULT_VIDEO_EMBED_PROPS: VideoEmbedProps;
-
-export declare const DEFAULT_VIDEO_PROPS: CDNVideoProps;
+/**
+ * Built-in slash commands for the Markdown editor. Consumers can override or
+ * extend this set via the `commands` prop on `MarkdownEditor`.
+ */
+export declare const DEFAULT_SLASH_COMMANDS: readonly SlashCommand[];
 
 export declare type DefaultSort = {
     [key: string]: unknown;
@@ -482,11 +380,6 @@ export declare const Details: FC<DetailsProps> & {
     Summary: FC<SummaryProps>;
 };
 
-export declare interface DetailsNode extends CommonAttrs {
-    type: "details";
-    children: Array<SummaryNode | BlockNode>;
-}
-
 export declare interface DetailsProps extends Omit<BoxProps, "component" | "children"> {
     children: ReactNode;
 }
@@ -497,11 +390,6 @@ export declare interface DiagramNode {
     children: RailroadNode[];
 }
 
-export declare interface DivNode extends CommonAttrs {
-    type: "div";
-    children: BlockNode[];
-}
-
 declare type DynamicNode<T> = ReactNode | ((value: T) => ReactNode);
 
 export declare interface EditorController {
@@ -538,11 +426,6 @@ export declare type EditorStateSnapshot = Record<string, unknown>;
  */
 export declare function editorTheme(theme: ThemeConfig_2, colorScheme: MantineColorScheme): Extension;
 
-export declare interface EmphasisNode extends CommonAttrs {
-    type: "emphasis";
-    children: InlineNode[];
-}
-
 export declare function extractCdnId(query: string): string | undefined;
 
 export declare interface ExtractedCode {
@@ -551,12 +434,15 @@ export declare interface ExtractedCode {
 }
 
 /**
- * Extract headers from a Markdown AST
- *
- * @param ast - The Markdown AST
- * @returns An array of headings
+ * Extract headings from a Lezer markdown tree (SSR-safe).
+ * Walks the full tree and collects plain inline text (no markdown delimiters).
  */
-export declare function extractHeaders(ast: Root): Heading[];
+export declare function extractHeadings(tree: Tree, source: MarkdownSource, opts?: ExtractHeadingsOptions): Heading[];
+
+export declare interface ExtractHeadingsOptions {
+    /** Heading depths to include. Default: `[2, 3]`. */
+    depths?: ReadonlyArray<1 | 2 | 3 | 4 | 5 | 6>;
+}
 
 /**
  * Extract test code from block comments at the start.
@@ -564,7 +450,8 @@ export declare function extractHeaders(ast: Root): Heading[];
  */
 export declare function extractTest(input: string): ExtractedCode;
 
-export declare const FontLinks: FC;
+/** Case-insensitive filter over command titles and keywords. */
+export declare function filterSlashCommands(commands: readonly SlashCommand[], query: string): SlashCommand[];
 
 /**
  * Generate a 24-character hex string suitable for use as a
@@ -573,41 +460,44 @@ export declare const FontLinks: FC;
  */
 export declare function generateRandomId(): string;
 
-export declare function getBlockOptionsComponent(blockType: string): BlockOptionsComponent | undefined;
-
 export declare function getCDNImageURL(imageId: string | undefined, width?: number, quality?: number): string | undefined;
 
 export declare function getCDNVideoURL(videoId: string | undefined, format?: "mp4" | "webm" | "mov", controls?: boolean): string | undefined;
 
-export declare function Header({ order, kicker, description, kickerProps, titleProps, descriptionProps, children, ...boxProps }: PropsWithChildren<HeaderProps>): ReactElement;
+/** Read whether the markdown editor has completed its initial paint. */
+export declare function getMarkdownEditorReady(state: EditorState): boolean;
 
-export declare interface HeaderProps extends BoxProps {
-    /** The kicker text to display above the title */
-    kicker?: ReactNode;
-    /** Heading order (1-6), controls `font-size` when `size` is not set on the title. @default `1` */
-    order?: TitleOrder;
-    /** A description text to display below the title */
-    description?: string;
-    /** Props to pass to the kicker component */
-    kickerProps?: TextProps;
-    /** Props to pass to the title component */
-    titleProps?: TitleProps;
-    /** Props to pass to the description component */
-    descriptionProps?: TextProps;
-}
+/**
+ * Read the current markdown mode from an {@link EditorState}.
+ */
+export declare function getMarkdownMode(state: EditorState): MarkdownEditMode;
 
-export declare interface Heading {
+/** A document heading with slug id, plain text, and depth. */
+declare interface Heading {
     id: string;
     text: string;
     depth: 1 | 2 | 3 | 4 | 5 | 6;
 }
 
-export declare interface HeadingNode extends CommonAttrs {
-    type: "heading";
-    depth: 1 | 2 | 3 | 4 | 5 | 6;
-    children: InlineNode[];
+/** Source range of `{#custom-id}` suffix when present. */
+export declare function headingCustomIdSuffixRange(node: SyntaxNode, source: MarkdownSource): {
+    from: number;
+    to: number;
+} | undefined;
+
+/** Heading title source bounds (after `HeaderMark`, trailing newlines and `{#id}` trimmed). */
+export declare interface HeadingTitleBounds {
+    titleFrom: number;
+    /** End of title line, excluding trailing newlines. */
+    titleTo: number;
+    /** End of visible title (excludes `{#id}` suffix when present). */
+    visibleTo: number;
+    /** Custom id from `{#id}` suffix when present. */
+    customId?: string;
 }
 
+export declare function headingTitleBounds(node: SyntaxNode, source: MarkdownSource): HeadingTitleBounds;
+
 export declare const Highlighting: FC<HighlightingProps>;
 
 export declare interface HighlightingProps extends BoxProps {
@@ -1005,50 +895,36 @@ export declare const iconWrench: string;
 
 export declare const iconXml: string;
 
-export declare interface ImageNode extends CommonAttrs {
-    type: "image";
+/** Any object intersected with a stable string `id`. */
+export declare type Identified<T = object, I = string> = T & {
+    id: I;
+};
+
+/** Normalised image descriptor for viewer renderers and `onImage` callbacks. */
+export declare interface ImageDescriptor {
     src: string;
-    darkSrc?: string;
-    alt: string;
+    alt?: string;
     title?: string;
+    darkSrc?: string;
 }
 
-export declare interface InlineCodeNode extends CommonAttrs {
-    type: "inlineCode";
-    value: string;
-}
+/**
+ * Build a `run` that inserts a callout of the given kind.
+ */
+export declare function insertCallout(kind: CalloutKind): CommandAction;
 
-export declare type InlineNode = TextNode | LinkNode | InlineCodeNode | StrongNode | EmphasisNode | SuperscriptNode | SubscriptNode | BreakNode | SpanNode | ImageNode | JsxExpressionNode | JsxComponentNode;
+/**
+ * Build a `run` that inserts the given markdown and positions the caret at the end of the inserted text,
+ * or at the given offset.
+ */
+export declare function insertMarkdown(insert: string, caretOffset?: number): CommandAction;
 
 export declare function isCDNId(query: string): boolean;
 
-export declare interface JsxComponentNode extends CommonAttrs {
-    type: "jsxComponent";
-    name: string;
-    attributes: Record<string, AttributeValue>;
-    children: AnyNode[];
-    position?: NodePosition;
-}
-
-export declare interface JsxExpression {
-    type: "expression";
-    value: string;
-}
+/** True when the registered component declares `block: true`. */
+export declare function isMarkdownComponentBlock(components: MarkdownComponents | undefined, name: string): boolean;
 
-export declare interface JsxExpressionNode extends CommonAttrs {
-    type: "jsxExpression";
-    value: string;
-    position?: NodePosition;
-}
-
-/**
- * Controls how `<Component />` tags and `{expression}` values in markdown are handled.
- *
- * - `"render"` — Evaluate and render JSX normally (default).
- * - `"throw"`  — Throw an error when a JSX node is encountered.
- * - `"graceful"` — Render an inline error box instead of the JSX node.
- * - `"omit"` — Silently skip JSX nodes (render nothing).
- */
+/** How `<Component />` tags are handled. */
 export declare type JsxMode = "render" | "throw" | "graceful" | "omit";
 
 export declare function Label({ label, ...props }: LabelProps): ReactNode;
@@ -1057,139 +933,310 @@ export declare interface LabelProps extends Omit<BadgeProps, "children"> {
     label: string;
 }
 
-declare type Language = "csharp" | "rust" | "javascript" | "typescript" | "surrealql" | "json" | "yaml" | "java" | "go" | "python" | "html" | "cli" | "php" | "syntax";
-
-export declare interface LinkNode extends CommonAttrs {
-    type: "link";
-    url: string;
-    title?: string;
-    children: InlineNode[];
-}
-
-export declare interface ListItemNode extends CommonAttrs {
-    type: "listItem";
-    checked?: boolean;
-    spread?: boolean;
-    children: AnyNode[];
-}
-
-export declare interface ListNode extends CommonAttrs {
-    type: "list";
-    variant?: "ordered" | "unordered" | "checklist";
-    start?: number;
-    spread?: boolean;
-    children: ListItemNode[];
-}
+declare type Language = "csharp" | "rust" | "javascript" | "typescript" | "surrealql" | "json" | "yaml" | "java" | "go" | "python" | "html" | "cli" | "php" | "markdown" | "syntax";
 
 /**
  * The Mantine theme configurtation
  */
 export declare const MANTINE_THEME: MantineThemeOverride;
 
-export declare const MantineBlockquote: YooptaPlugin<BlockquoteElementMap, Record<string, unknown>>;
-
-export declare const MantineButton: YooptaPlugin<MantineButtonElementMap>;
-
-export declare type MantineButtonElement = SlateElement<"mantine-button", MantineButtonProps>;
-
-export declare type MantineButtonElementMap = {
-    "mantine-button": MantineButtonElement;
-};
-
-export declare interface MantineButtonProps {
-    nodeType: "void";
-    label: string;
-    url: string;
-    variant: ButtonProps["variant"];
-    color: MantineColor;
-    size: MantineSize;
-    radius: MantineSize;
-    fullWidth: boolean;
+/**
+ * Configuration for a single `<Component />` registered in {@link MarkdownComponents}.
+ * Set `block: true` to opt into the block-rendering path (own line, hover
+ * outline, edit-source action) instead of the default inline-widget path.
+ */
+export declare interface MarkdownComponentConfig {
+    component: ComponentType<any>;
+    block?: boolean;
 }
 
-export declare const MantineCallout: YooptaPlugin<CalloutElementMap, Record<string, unknown>>;
-
-export declare const MantineChecklist: YooptaPlugin<Pick<ListElementMap, "todo-list">, Record<string, unknown>>;
-
-export declare const MantineDivider: YooptaPlugin<DividerElementMap, Record<string, unknown>>;
+/** A registered component is either a bare React component (inline) or a config object. */
+export declare type MarkdownComponentDef = ComponentType<any> | MarkdownComponentConfig;
 
-export declare const MantineTable: YooptaPlugin<MantineTableElementMap>;
+/** Map of PascalCase JSX tag names to viewer/editor component registrations. */
+export declare type MarkdownComponents = Record<string, MarkdownComponentDef>;
 
-export declare type MantineTableElement = SlateElement<"mantine-table", MantineTableProps>;
+/**
+ * Rendering mode of the markdown editor.
+ *
+ * - `source` renders raw markdown syntax with subtle styling.
+ * - `preview` shows source markup only on the active line/block;
+ *   other content is rendered visually.
+ */
+export declare type MarkdownEditMode = "source" | "preview";
 
-export declare type MantineTableElementMap = {
-    "mantine-table": MantineTableElement;
-};
+/**
+ * High-level Markdown editor primitive that wires together the
+ * `CodeEditor` shell, the live preview extension, the widget store and
+ * the React portal host.
+ *
+ * See {@link MarkdownViewer} for a Markdown viewer equivalent.
+ */
+export declare const MarkdownEditor: FC<MarkdownEditorProps>;
 
-export declare interface MantineTableProps {
-    nodeType: "void";
-    rows: string[][];
-    withHeaderRow: boolean;
-    striped: boolean;
-    highlightOnHover: boolean;
-    caption: string;
+export declare interface MarkdownEditorProps extends Omit<EditorOptions, "language" | "extensions">, Omit<BoxProps, "onChange"> {
+    /** `source` or `preview` (live preview). Defaults to `preview`. */
+    mode?: MarkdownEditMode;
+    /** Additional CodeMirror extensions to layer on top of the live preview. */
+    extensions?: Extension;
+    /** GFM table preview widgets in preview mode. Defaults to `true`. */
+    tables?: boolean;
+    /**
+     * Auto-format GFM table source while editing: align columns and pad cells
+     * with trailing spaces. Defaults to `false`.
+     */
+    withTableFormatter?: boolean;
+    /** React components for `<PascalCase />` tags (preview widgets). */
+    components?: MarkdownComponents;
+    /** How unsupported JSX is handled in preview. Default `render` (uses {@link DEFAULT_COMPONENTS}). */
+    jsxMode?: JsxMode;
+    /** Auto-focus the editor on mount. */
+    autoFocus?: boolean;
+    /**
+     * Custom per-language renderers for fenced code blocks. Keys are the
+     * lower-cased fenced-code info string (e.g. `mermaid`). When the block
+     * is inactive, a matching renderer fully replaces the source. Defaults
+     * to `{ mermaid: MermaidCodeRenderer }`; pass `{}` to disable.
+     */
+    codeRenderers?: Record<string, CodeRenderer>;
+    /** Enable the slash command palette. Defaults to `true`. */
+    slashCommands?: boolean;
+    /** Override the slash command set. Defaults to {@link DEFAULT_SLASH_COMMANDS}. */
+    commands?: readonly SlashCommand[];
 }
 
 /**
- * Main Markdown component that parses markdown and renders it
- * Applies stylesheet and spacing
+ * Marks the editor ready after the first animation frame so mount-time decoration
+ * classes do not trigger CSS transitions. Exposes {@link markdownEditorReadyField}
+ * and `data-markdown-ready` on the editor root.
  */
-export declare function Markdown({ content, renderers, rendererProps, components, scope, }: MarkdownProps): React_2.ReactElement;
+export declare function markdownEditorReady(): Extension;
 
-declare type MarkdownComponents = Record<string, React.ComponentType<any>>;
+/**
+ * Whether the markdown editor has completed its initial paint. CSS transitions
+ * and similar effects should be gated on this so decoration classes do not
+ * animate from their pre-decoration computed values on mount.
+ */
+export declare const markdownEditorReadyField: StateField<boolean>;
 
-export declare interface MarkdownProps {
-    /**
-     * Markdown content to render
-     */
-    content: string;
+/**
+ * Live preview stack: language (optional), mode field, folding, decorations, theme.
+ */
+export declare function markdownLivePreview(opts: MarkdownLivePreviewOptions): Extension;
+
+/** Options for {@link markdownLivePreview}. */
+export declare interface MarkdownLivePreviewOptions {
+    /** GFM table preview widgets in preview mode. Defaults to `true`. */
+    tables?: boolean;
     /**
-     * Override how built-in markdown elements are rendered.
-     * Keys are AST node types (`"heading"`, `"code"`, `"table"`, etc.).
+     * Auto-format GFM table source on edit: align columns, pad cells with
+     * trailing spaces, and normalise the delimiter row. Defaults to `false`.
      */
-    renderers?: MarkdownRenderers;
+    withTableFormatter?: boolean;
     /**
-     * Extra props forwarded to specific built-in renderers (e.g. code block options).
+     * Per-language renderers used when a fenced code block is inactive (preview
+     * unfocused / caret outside the block). Keys are the lower-cased fenced-code
+     * info string (e.g. `mermaid`). Defaults to `{}`.
      */
-    rendererProps?: MarkdownRendererProps;
+    codeRenderers?: Record<string, CodeRenderer>;
+    /** Required widget store, typically returned by `useMarkdownWidgetStore()`. */
+    widgetStore: WidgetStore;
+    /** Whether to install the markdown language alongside the live preview. */
+    includeLanguage?: boolean;
     /**
-     * React components available for use as `<Component />` tags in the markdown content.
-     * Keys should match PascalCase tag names (e.g. `{ StatusCard, Alert }`).
+     * Optional language resolver for embedded fenced code blocks.
      */
+    resolveCodeLanguage?: (info: string) => Language_2 | undefined;
+    /** JSX/HTML preview widgets (viewer parity). Omit to leave raw source in preview. */
     components?: MarkdownComponents;
+    jsxMode?: JsxMode;
     /**
-     * Variable context for evaluating `{expression}` values in JSX attributes
-     * and inline expressions (e.g. `{ userName: "Alice", count: 42 }`).
+     * Slash command palette. Pass a store (from `useSlashStore()`) to enable
+     * the slash (`/`) command menu. Render `<SlashCommandMenu>` with the
+     * same store. Omit to disable.
      */
-    scope?: Record<string, unknown>;
+    slash?: {
+        store: SlashStore;
+    };
+}
+
+/**
+ * State field tracking the current {@link MarkdownEditMode}.
+ */
+export declare const markdownModeField: StateField<MarkdownEditMode>;
+
+/**
+ * Bundles the slash session {@link slashSessionField} with a `ViewPlugin` that
+ * mirrors the active session and caret into the given {@link SlashStore}, which
+ * the React menu reads via `useSyncExternalStore`. Anchor coordinates are
+ * measured by the React component — `coordsAtPos` cannot run during an update.
+ */
+export declare function markdownSlashCommands(options: MarkdownSlashCommandsOptions): Extension;
+
+/** Options for {@link markdownSlashCommands}. */
+export declare interface MarkdownSlashCommandsOptions {
+    /** Store bridging the session to the React `<SlashCommandMenu>`. */
+    store: SlashStore;
 }
 
 /**
- * Extra props forwarded to specific built-in renderers (e.g. code block options).
+ * Document slice compatible with CodeMirror {@link Text} line API.
+ * Used by tree helpers and the viewer renderer.
  */
-export declare interface MarkdownRendererProps {
-    code?: Partial<CodeBlockProps>;
+export declare interface MarkdownSource {
+    readonly length: number;
+    slice(from: number, to: number): string;
+    lineAt(pos: number): {
+        from: number;
+        to: number;
+        number: number;
+    };
+    line(n: number): {
+        from: number;
+        to: number;
+        number: number;
+    };
+    readonly lineCount: number;
+}
+
+/**
+ * Build a {@link MarkdownSource} from raw markdown (SSR-safe).
+ */
+export declare function markdownSourceFromString(source: string): MarkdownSource;
+
+/**
+ * Editor base theme for the markdown live preview. Cursor / scroller rules and
+ * editor-only chrome; shared surface styles live in `markdown.module.scss`.
+ */
+export declare function markdownTheme(): Extension;
+
+/**
+ * High-level Markdown viewer primitive that renders a Markdown structure
+ * as a React tree.
+ *
+ * See {@link MarkdownEditor} for a Markdown editor equivalent.
+ */
+export declare const MarkdownViewer: FC<MarkdownViewerProps>;
+
+export declare interface MarkdownViewerProps extends BoxProps {
+    /** Markdown source string. Ignored when `tree` is provided. */
+    content?: string;
+    /** Pre-parsed tree and markdown source. */
+    tree?: MarkdownViewerTreeInput;
+    /** Collapse consecutive blank lines into a single line break. Defaults to `true`. */
+    collapseBlankLines?: boolean;
+    /** Override built-in element renderers. */
+    renderers?: MarkdownViewerRenderers;
+    /** Rewrite image URLs before render (e.g. CDN resolution). */
+    onImage?: (node: ImageDescriptor) => ImageDescriptor;
+    /** Add slug IDs and hover anchor links on headings. */
+    autoLink?: boolean;
     /**
-     * How `<Component />` tags and `{expression}` values are handled.
-     *
-     * @default "render"
+     * Custom per-language renderers for fenced code blocks. Keys are the
+     * lower-cased fenced-code info string (e.g. `mermaid`). When the block
+     * is inactive, a matching renderer fully replaces the source. Defaults
+     * to `{ mermaid: MermaidCodeRenderer }`; pass `{}` to disable.
      */
-    jsx?: JsxMode;
+    codeRenderers?: Record<string, CodeRenderer>;
+    /** React components for `<PascalCase />` tags. */
+    components?: MarkdownComponents;
+    /** How unsupported JSX is handled. Default `render` (uses {@link DEFAULT_COMPONENTS}). */
+    jsxMode?: JsxMode;
+}
+
+/**
+ * Optional per-node React render overrides for {@link MarkdownViewer}.
+ * `listItem` and `strikethrough` are reserved for a future release and are not
+ * consulted by the current viewer pipeline.
+ */
+export declare type MarkdownViewerRenderers = Partial<{
+    heading: (props: {
+        children: ReactNode;
+        level: number;
+        id?: string;
+    }) => ReactNode;
+    paragraph: (props: {
+        children: ReactNode;
+    }) => ReactNode;
+    link: (props: {
+        href: string;
+        title?: string;
+        children: ReactNode;
+    }) => ReactNode;
+    list: (props: {
+        ordered: boolean;
+        children: ReactNode;
+    }) => ReactNode;
+    listItem: (props: {
+        children: ReactNode;
+        checked?: boolean;
+    }) => ReactNode;
+    blockquote: (props: {
+        children: ReactNode;
+    }) => ReactNode;
+    code: (props: {
+        value: string;
+        lang?: string;
+        title?: string;
+        runnable?: string;
+    }) => ReactNode;
+    inlineCode: (props: {
+        value: string;
+    }) => ReactNode;
+    table: (props: {
+        children: ReactNode;
+    }) => ReactNode;
+    thematicBreak: () => ReactNode;
+    image: (props: ImageDescriptor) => ReactNode;
+    strong: (props: {
+        children: ReactNode;
+    }) => ReactNode;
+    emphasis: (props: {
+        children: ReactNode;
+    }) => ReactNode;
+    strikethrough: (props: {
+        children: ReactNode;
+    }) => ReactNode;
+    jsxComponent: (props: {
+        name: string;
+        children: ReactNode;
+        attributes: Record<string, unknown>;
+    }) => ReactNode;
+}>;
+
+export declare interface MarkdownViewerTreeInput {
+    tree: Tree;
+    source: MarkdownSource;
 }
 
-declare type MarkdownRenderers = Partial<RendererMap>;
+/**
+ * React component that renders a portal for every widget registered in the
+ * given {@link WidgetStore}. Mount this once per editor (the
+ * `MarkdownEditor` primitive does this for you), inside the
+ * `MantineProvider` tree so widgets inherit theme and other context.
+ *
+ * The component renders no DOM of its own — only invisible portal targets
+ * that hand off to the host elements created by `WidgetType.toDOM()`.
+ */
+export declare const MarkdownWidgetPortals: FC<MarkdownWidgetPortalsProps>;
 
-export declare interface MDXProvidedComponents {
-    Check: typeof Check;
-    Label: typeof Label;
-    RailroadDiagram: typeof RailroadDiagram;
-    Since: typeof Since;
-    SurrealistMini: typeof SurrealistMini;
-    TabItem: typeof TabItem_2;
-    Tabs: typeof Tabs_2;
-    Version: typeof Version;
+export declare interface MarkdownWidgetPortalsProps {
+    /** The store to read widget entries from. */
+    store: WidgetStore;
 }
 
+/** Merge default JSX components with caller overrides (caller wins on key clash). */
+export declare function mergeMarkdownComponents(components?: MarkdownComponents): MarkdownComponents;
+
+/**
+ * Standalone {@link CodeRenderer} for fenced code blocks whose info string
+ * is `mermaid`. Lazy-loads the `mermaid` module the first time it mounts so
+ * consumers only pay the bundle cost when actually using diagrams. Renders
+ * inside a Mantine `Center` while loading and replaces it with the SVG once
+ * available.
+ */
+export declare const MermaidCodeRenderer: CodeRenderer;
+
 export declare interface MiniConfig {
     url?: string;
     dataset?: "surreal-deal-store-mini" | `/${string}.surql`;
@@ -1239,17 +1286,6 @@ export declare class MiniController {
     executeQuery(query: string): void;
 }
 
-declare type NodeOfType<T extends AnyNode["type"]> = Extract<AnyNode, {
-    type: T;
-}>;
-
-export declare interface NodePosition {
-    start: number;
-    end: number;
-}
-
-export declare const NON_TEXT_BLOCKS: Set<string>;
-
 declare interface NonTerminalNode {
     type: "NonTerminal";
     text: string;
@@ -1282,29 +1318,21 @@ declare interface OptionalNode {
     child: RailroadNode;
 }
 
-declare type OptionItem = {
-    label: string;
-    value: string;
-};
-
-export declare interface ParagraphNode extends CommonAttrs {
-    type: "paragraph";
-    children: InlineNode[];
+declare interface ParsedHeadingTitle {
+    /** Visible title text (custom id suffix removed). */
+    text: string;
+    /** Custom id from `{#id}` when present. */
+    customId?: string;
 }
 
+/** Split plain heading text into visible title and optional `{#id}` suffix. */
+export declare function parseHeadingTitleText(plain: string): ParsedHeadingTitle;
+
 /**
- * Parse markdown string to AST
+ * Parse markdown into a Lezer syntax tree using the same grammar as CodeMirror.
+ * Safe in SSR: no {@link EditorState} or DOM.
  */
-export declare function parseMarkdown(markdown: string): Root;
-
-export declare interface ParserState {
-    lines: string[];
-    currentIndex: number;
-    stack: string[];
-    root: BlockNode[];
-    currentContainer: BlockNode[];
-    slugger: default_2;
-}
+export declare function parseMarkdownTree(source: string): Tree;
 
 export declare const picto2106: string;
 
@@ -1770,56 +1798,11 @@ export declare interface RailroadDiagramProps extends BoxProps {
 
 export declare type RailroadNode = DiagramNode | SequenceNode | TerminalNode | NonTerminalNode | OptionalNode | ChoiceNode | OneOrMoreNode | ZeroOrMoreNode | CommentNode;
 
-export declare function registerBlockOptions(blockType: string, component: BlockOptionsComponent): void;
+/** Resolve heading `id` from `{#custom}` suffix or slugged plain title. */
+export declare function resolveHeadingId(node: SyntaxNode, source: MarkdownSource, slugger: default_2): string | undefined;
 
-export declare type RendererFunction<T extends AnyNode["type"]> = NodeOfType<T> extends {
-    children: unknown[];
-} ? (props: {
-    node: NodeOfType<T>;
-    children: ReactNode;
-}) => ReactNode : (props: {
-    node: NodeOfType<T>;
-}) => ReactNode;
-
-/**
- * Maps each AST node type to its renderer function.
- */
-export declare type RendererMap = {
-    [T in AnyNode["type"]]: RendererFunction<T>;
-};
-
-/**
- * Render parsed markdown AST to React elements
- * Direct AST-to-React conversion with component mapping
- */
-export declare function RenderMarkdown({ ast, renderers, rendererProps, components, scope, ...props }: RenderMarkdownProps): React_2.ReactElement | null;
-
-export declare interface RenderMarkdownProps extends StackProps {
-    /**
-     * Parsed markdown AST to render
-     */
-    ast: Root;
-    /**
-     * Override how built-in markdown elements are rendered.
-     * Keys are AST node types (`"heading"`, `"code"`, `"table"`, etc.).
-     * Each renderer receives the typed AST node and its children.
-     */
-    renderers?: MarkdownRenderers;
-    /**
-     * Extra props forwarded to specific built-in renderers (e.g. code block options).
-     */
-    rendererProps?: MarkdownRendererProps;
-    /**
-     * React components available for use as `<Component />` tags in the markdown content.
-     * Keys should match PascalCase tag names (e.g. `{ StatusCard, Alert }`).
-     */
-    components?: MarkdownComponents;
-    /**
-     * Variable context for evaluating `{expression}` values in JSX attributes
-     * and inline expressions (e.g. `{ userName: "Alice", count: 42 }`).
-     */
-    scope?: Record<string, unknown>;
-}
+/** Normalise a component registration into its `{ component, block }` form. */
+export declare function resolveMarkdownComponent(def: MarkdownComponentDef | undefined): MarkdownComponentConfig | undefined;
 
 export declare interface ResponsiveTabItem {
     value: string;
@@ -1843,9 +1826,21 @@ export declare interface ResponsiveTabsProps extends Omit<TabsProps_2, "children
     selectProps?: Omit<SelectProps, "data" | "value" | "defaultValue" | "onChange">;
 }
 
-export declare interface Root {
-    type: "root";
-    children: BlockNode[];
+export declare function SectionTitle({ order, kicker, description, kickerProps, titleProps, descriptionProps, children, ...boxProps }: PropsWithChildren<SectionTitle>): ReactElement;
+
+export declare interface SectionTitle extends BoxProps {
+    /** The kicker text to display above the title */
+    kicker?: ReactNode;
+    /** Heading order (1-6), controls `font-size` when `size` is not set on the title. @default `1` */
+    order?: TitleOrder;
+    /** A description text to display below the title */
+    description?: string;
+    /** Props to pass to the kicker component */
+    kickerProps?: TextProps;
+    /** Props to pass to the title component */
+    titleProps?: TitleProps;
+    /** Props to pass to the description component */
+    descriptionProps?: TextProps;
 }
 
 declare interface SequenceNode {
@@ -1854,13 +1849,18 @@ declare interface SequenceNode {
 }
 
 /**
- * Set the contents of the editor
- *
- * @param editor The editor to set the text of
- * @param text The text to set the editor to
+ * Replace the entire document. External/programmatic sync must not pollute the
+ * undo stack (see CodeMirror controlled-editor guidance).
  */
 export declare function setEditorText(editor: EditorView, text: string): void;
 
+export declare const setMarkdownEditorReady: StateEffectType<boolean>;
+
+/**
+ * State effect used to swap the active markdown rendering mode.
+ */
+export declare const setMarkdownMode: StateEffectType<MarkdownEditMode>;
+
 export declare function Since({ v, prefix, ...props }: SinceProps): ReactNode;
 
 export declare interface SinceProps extends Omit<BadgeProps, "children"> {
@@ -1868,7 +1868,89 @@ export declare interface SinceProps extends Omit<BadgeProps, "children"> {
     prefix?: string;
 }
 
-export declare const SIZE_OPTIONS: OptionItem[];
+/**
+ * A single slash command. `run` receives the live editor and the range
+ * covering the `/query` text to replace with boilerplate.
+ */
+export declare interface SlashCommand {
+    /** Stable id used for filtering keys and keyboard navigation. */
+    readonly id: string;
+    /** Primary label shown in the menu. */
+    readonly title: string;
+    /** Extra terms matched against the query (besides the title). */
+    readonly keywords?: readonly string[];
+    /** Optional group heading; commands sharing a category are shown together. */
+    readonly category?: string;
+    /** React node for the leading icon. */
+    readonly icon?: ReactNode;
+    /** Apply the command — typically replaces `range` with markdown. */
+    readonly run: CommandAction;
+}
+
+/**
+ * Renders the slash command palette. Reads the active session
+ * from the {@link SlashStore}, filters {@link SlashCommand}s by the typed
+ * query and shows a Mantine `Menu` anchored to the caret. The editor keeps DOM
+ * focus; navigation/selection keys are intercepted in the capture phase so
+ * arrows move the highlight and `Enter` runs the command instead of editing
+ * the document.
+ *
+ * Mount once per editor inside the `MantineProvider` tree, alongside
+ * `MarkdownWidgetPortals`.
+ */
+export declare const SlashCommandMenu: FC<SlashCommandMenuProps>;
+
+export declare interface SlashCommandMenuProps {
+    /** Store fed by `markdownSlashCommands` (see {@link useSlashStore}). */
+    store: SlashStore;
+    /** Accessor for the live editor view (e.g. `controller.getEditor`). */
+    getEditor: () => EditorView;
+    /** Commands to offer. Defaults to {@link DEFAULT_SLASH_COMMANDS}. */
+    commands?: readonly SlashCommand[];
+}
+
+/** Document range a command replaces: `from` = slash position, `to` = caret. */
+export declare interface SlashCommandRange {
+    readonly from: number;
+    readonly to: number;
+}
+
+/** Viewport coordinates of the slash anchor (from `view.coordsAtPos`). */
+export declare interface SlashCoords {
+    readonly left: number;
+    readonly top: number;
+    readonly right: number;
+    readonly bottom: number;
+}
+
+/** Active slash session: the slash position and the query typed after it. */
+export declare interface SlashSession {
+    /** Document position of the triggering `/`. */
+    readonly from: number;
+    /** Text between the slash and the caret (excludes the slash itself). */
+    readonly query: string;
+}
+
+/**
+ * Snapshot the React menu reads: the active session and caret. Anchor
+ * coordinates are measured in React (not here) because `coordsAtPos` cannot be
+ * called during a CodeMirror update.
+ */
+export declare interface SlashState {
+    readonly session: SlashSession;
+    /** Caret position (end of the `/query` range). */
+    readonly to: number;
+}
+
+/**
+ * CM write-side ↔ React read-side bridge for the slash palette, mirroring the
+ * widget `WidgetStore`. `null` snapshot means no active session.
+ */
+export declare interface SlashStore {
+    setState(state: SlashState | null): void;
+    subscribe(listener: () => void): () => void;
+    getSnapshot(): SlashState | null;
+}
 
 export declare type SortDirection = "asc" | "desc" | undefined;
 
@@ -1885,11 +1967,6 @@ export declare interface SortOptions<T = DefaultSort> {
 
 export declare const Spacer: FC<BoxProps>;
 
-export declare interface SpanNode extends CommonAttrs {
-    type: "span";
-    children: InlineNode[];
-}
-
 export declare function Spinner({ size, color, className, title, ...props }: SpinnerProps): ReactNode;
 
 export declare interface SpinnerProps extends BoxProps {
@@ -1902,53 +1979,17 @@ export declare type StateFields = {
     [prop: string]: StateField<any>;
 };
 
-export declare interface StrongNode extends CommonAttrs {
-    type: "strong";
-    children: InlineNode[];
-}
-
-declare interface SubscriptNode extends CommonAttrs {
-    type: "subscript";
-    children: InlineNode[];
-}
-
 /**
  * Suggest completions at the start of each line
  */
 export declare const suggestCompletions: Command;
 
-export declare interface SummaryNode extends CommonAttrs {
-    type: "summary";
-    children: InlineNode[];
-}
-
 export declare interface SummaryProps extends Omit<BoxProps, "component" | "children"> {
     children: ReactNode;
 }
 
-declare interface SuperscriptNode extends CommonAttrs {
-    type: "superscript";
-    children: InlineNode[];
-}
-
 export declare const SURREAL_CDN_BASE = "https://cdn.surrealdb.com";
 
-export declare const SurrealCodeBlock: YooptaPlugin<SurrealCodeBlockElementMap>;
-
-export declare type SurrealCodeBlockElement = SlateElement<"surreal-codeblock", SurrealCodeBlockProps>;
-
-export declare type SurrealCodeBlockElementMap = {
-    "surreal-codeblock": SurrealCodeBlockElement;
-};
-
-export declare interface SurrealCodeBlockProps {
-    nodeType: "void";
-    code: string;
-    language: AnyLanguage;
-    title: string;
-    withLineNumbers: boolean;
-}
-
 export declare function SurrealistMini({ config, frameRef, ...props }: SurrealistMiniProps): ReactNode;
 
 export declare interface SurrealistMiniProps extends BoxProps {
@@ -1956,22 +1997,6 @@ export declare interface SurrealistMiniProps extends BoxProps {
     frameRef?: RefObject<HTMLIFrameElement | null>;
 }
 
-export declare const SurrealLink: YooptaPlugin<SurrealLinkElementMap>;
-
-export declare type SurrealLinkElement = SlateElement<"surreal-link", SurrealLinkProps>;
-
-export declare type SurrealLinkElementMap = {
-    "surreal-link": SurrealLinkElement;
-};
-
-export declare interface SurrealLinkProps {
-    nodeType: "inline";
-    url: string;
-    variant?: AnchorProps["variant"];
-    target?: string;
-    rel?: string;
-}
-
 export declare const SYNTAX_THEME_CONFIG: ThemeConfig;
 
 export declare interface TabItem {
@@ -1980,42 +2005,8 @@ export declare interface TabItem {
     content: ReactNode;
 }
 
-declare function TabItem_2({ children, className, id, style }: Record<string, unknown>): ReactNode;
-
-export declare interface TabItemNode extends CommonAttrs {
-    type: "tabItem";
-    label: string;
-    icon?: string;
-    children: BlockNode[];
-}
-
-export declare interface TableCellNode extends CommonAttrs {
-    type: "tableCell";
-    children: AnyNode[];
-    isHeader: boolean;
-}
-
-export declare interface TableNode extends CommonAttrs {
-    type: "table";
-    align?: Array<"left" | "right" | "center" | null>;
-    children: TableRowNode[];
-}
-
-export declare interface TableRowNode extends CommonAttrs {
-    type: "tableRow";
-    children: TableCellNode[];
-}
-
 export declare function Tabs({ items, syncKey, ...props }: TabsProps): ReactNode;
 
-declare function Tabs_2({ syncKey, children, className, id, style, }: Record<string, unknown>): ReactNode;
-
-export declare interface TabsNode extends CommonAttrs {
-    type: "tabs";
-    syncKey?: string;
-    children: TabItemNode[];
-}
-
 export declare interface TabsProps extends Omit<TabsProps_2, "children" | "value" | "onChange"> {
     items: TabItem[];
     syncKey?: string;
@@ -2026,15 +2017,6 @@ declare interface TerminalNode {
     text: string;
 }
 
-export declare interface TextNode extends CommonAttrs {
-    type: "text";
-    value: string;
-}
-
-export declare interface ThematicBreakNode extends CommonAttrs {
-    type: "thematicBreak";
-}
-
 export declare type ThemeConfig = {
     light: HighlightStyle;
     dark: HighlightStyle;
@@ -2055,12 +2037,13 @@ export declare interface ThemedImageProps extends ImageProps {
     darkSrc?: string;
 }
 
-/**
- * Type-specific visitor function
- */
-export declare type TypeVisitor<T extends AnyNode> = (node: T, index: number | undefined, parent: AnyNode | Root | null) => undefined | boolean | void;
-
-export declare function useBlockOptions(): BlockOptionsContextValue;
+/** Trim `{#id}` from the end of a heading source range (returns new exclusive `titleTo`). */
+export declare function trimCustomHeadingIdFromRange(source: {
+    slice(from: number, to: number): string;
+}, titleFrom: number, titleTo: number): {
+    titleTo: number;
+    customId?: string;
+};
 
 /**
  * Returns a function which can be used to trigger a confirmation dialog
@@ -2069,6 +2052,19 @@ export declare function useConfirmation<T = void>(options: ConfirmOptions<T>): (
 
 export declare function useEditor(options?: EditorOptions): EditorController;
 
+/**
+ * Keyboard navigation over a flat list of identified items. Returns a
+ * `keydown` handler and the currently active item id.
+ *
+ * The handler responds to `ArrowUp`/`ArrowDown` (and `Tab`/`Shift+Tab`) to
+ * move the active item, and `Enter` to submit it. The active element is
+ * scrolled into view via the `[data-navigation-item-id="…"]` attribute, which
+ * rendered items should carry.
+ *
+ * Ported from `surrealist/src/hooks/keys.ts`.
+ */
+export declare function useKeyNavigation<T extends Identified>(items: T[], onSubmit?: (item: T) => void, initial?: string): readonly [(e: React.KeyboardEvent) => void, string];
+
 /**
  * Trigger a new render and invoke the passed function
  * during this next call. Useful when you require the component
@@ -2079,8 +2075,22 @@ export declare function useEditor(options?: EditorOptions): EditorController;
  */
 export declare function useLater<T extends unknown[]>(doLater: (...args: T) => unknown): (...args: T) => void;
 
+/**
+ * Hook returning a stable {@link WidgetStore} reference for the lifetime of
+ * the calling component. Pair with {@link MarkdownWidgetPortals} and pass
+ * the same store into `markdownLivePreview({ widgetStore })`.
+ */
+export declare function useMarkdownWidgetStore(): WidgetStore;
+
 export declare function useMiniController(): [RefObject<HTMLIFrameElement | null>, MiniController];
 
+/**
+ * Hook returning a stable {@link SlashStore} for the lifetime of the calling
+ * component. Pair with {@link SlashCommandMenu} and pass the same store into
+ * `markdownLivePreview({ slash: { store } })`.
+ */
+export declare function useSlashStore(): SlashStore;
+
 export declare function useSort<T = DefaultSort>(options?: SortOptions<T>): SortHandle<T>;
 
 /**
@@ -2103,8 +2113,6 @@ export declare function useSwitch(initialState?: boolean, callbacks?: {
     onClose?: () => void;
 }): readonly [boolean, BooleanHandle];
 
-export declare const VARIANT_OPTIONS: OptionItem[];
-
 export declare function Version({ version, ...props }: VersionProps): ReactNode;
 
 export declare interface VersionProps extends CodeProps {
@@ -2113,19 +2121,6 @@ export declare interface VersionProps extends CodeProps {
 
 export declare type VideoControlsPosition = "top-left" | "top-right" | "bottom-left" | "bottom-right";
 
-export declare const VideoEmbed: YooptaPlugin<VideoEmbedElementMap>;
-
-export declare type VideoEmbedElement = SlateElement<"video-embed", VideoEmbedProps>;
-
-export declare type VideoEmbedElementMap = {
-    "video-embed": VideoEmbedElement;
-};
-
-export declare interface VideoEmbedProps {
-    nodeType: "void";
-    url: string;
-}
-
 export declare const VideoPlayer: FC<VideoPlayerProps>;
 
 export declare interface VideoPlayerProps extends BoxProps {
@@ -2140,21 +2135,39 @@ export declare interface VideoPlayerProps extends BoxProps {
 }
 
 /**
- * Visit all nodes in the tree
+ * The default UI Kit editor theme
  */
-export declare function visit(tree: Root | AnyNode, visitor: Visitor): void;
-
-export declare function visit<T extends AnyNode["type"]>(tree: Root | AnyNode, nodeType: T, visitor: TypeVisitor<NodeOfType<T>>): void;
+export declare const VIVID_THEME: ThemeConfig_2;
 
 /**
- * Generic visitor function
+ * Registered widget host + render closure for `createPortal`. Map identity uses `portalKey`, not `id`.
  */
-export declare type Visitor = (node: AnyNode, index: number | undefined, parent: AnyNode | Root | null) => undefined | boolean | void;
+declare interface WidgetEntry {
+    /** Opaque key for this mount; survives logical id reuse across rebuilds. */
+    readonly portalKey: number;
+    /** Debug-oriented `kind:from-to`; not a store key. */
+    readonly id: string;
+    readonly host: HTMLElement;
+    readonly render: () => ReactNode;
+}
 
 /**
- * The default UI Kit editor theme
+ * CM write-side ↔ React read-side (`useSyncExternalStore` in `markdown-widget-portals.tsx`).
  */
-export declare const VIVID_THEME: ThemeConfig_2;
+declare interface WidgetStore {
+    register(entry: WidgetEntry): void;
+    /** Unregister only when the host still maps to `expectedPortalKey` (avoids stale destroys after host reuse). */
+    unregisterHost(host: HTMLElement, expectedPortalKey?: number): void;
+    /**
+     * Replace render closure when `updateDOM` runs with same `portalKey` but new captured state.
+     */
+    update(portalKey: number, render: () => ReactNode): void;
+    /** True after {@link register} for this key. */
+    hasPortalKey(portalKey: number): boolean;
+    subscribe(listener: () => void): () => void;
+    /** Returns a stable, frozen snapshot of all currently registered widgets. */
+    getSnapshot(): readonly WidgetEntry[];
+}
 
 declare interface ZeroOrMoreNode {
     type: "ZeroOrMore";
@@ -2284,15 +2297,15 @@ declare module "@mantine/core" {
 }
 
 declare module "@mantine/core" {
-    type ExtendedCustomColors = "obsidian" | "slate" | import("@mantine/core").DefaultMantineColor;
-    interface MantineThemeColorsOverride {
-        colors: Record<ExtendedCustomColors, import("@mantine/core").MantineColorsTuple>;
+    type ExtendedCustomSizes = import("@mantine/core").DefaultMantineSize | "2xl" | "3xl";
+    interface MantineThemeSizesOverride {
+        spacing: Record<ExtendedCustomSizes, string>;
     }
 }
 
 declare module "@mantine/core" {
-    type ExtendedCustomSizes = import("@mantine/core").DefaultMantineSize | "2xl" | "3xl";
-    interface MantineThemeSizesOverride {
-        spacing: Record<ExtendedCustomSizes, string>;
+    type ExtendedCustomColors = "obsidian" | "slate" | import("@mantine/core").DefaultMantineColor;
+    interface MantineThemeColorsOverride {
+        colors: Record<ExtendedCustomColors, import("@mantine/core").MantineColorsTuple>;
     }
 }