@domternal/vue 0.6.0

package/dist/index.d.ts

@@ -0,0 +1,786 @@
+import * as vue from 'vue';
+import { ShallowRef, Ref, ComputedRef, InjectionKey, defineComponent, PropType, Component, AppContext } from 'vue';
+import * as _domternal_core from '@domternal/core';
+import { AnyExtension, Content, FocusPosition, Editor, JSONContent, IconSet, ToolbarLayoutEntry, BubbleMenuOptions, FloatingMenuOptions } from '@domternal/core';
+export { AnyExtension, Content, Editor, FocusPosition, GenerateHTMLOptions, GenerateJSONOptions, GenerateTextOptions, JSONContent, generateHTML, generateJSON, generateText } from '@domternal/core';
+import * as prosemirror_state from 'prosemirror-state';
+import * as prosemirror_view from 'prosemirror-view';
+
+declare const DEFAULT_EXTENSIONS: AnyExtension[];
+interface UseEditorOptions {
+    /** Custom extensions to add to the editor. */
+    extensions?: AnyExtension[];
+    /** Initial editor content (HTML string or JSON). */
+    content?: Content;
+    /** Whether the editor is editable. @default true */
+    editable?: boolean;
+    /** Where to autofocus on mount. @default false */
+    autofocus?: FocusPosition;
+    /** Output format for content comparison. @default 'html' */
+    outputFormat?: 'html' | 'json';
+    /**
+     * Set to true to create the editor synchronously during setup instead of
+     * waiting for onMounted. Only useful when SSR is not a concern.
+     * @default false
+     */
+    immediatelyRender?: boolean;
+    /** Called when the editor instance is created. */
+    onCreate?: (editor: Editor) => void;
+    /** Called when the document content changes. */
+    onUpdate?: (props: {
+        editor: Editor;
+    }) => void;
+    /** Called when the selection changes without content change. */
+    onSelectionChange?: (props: {
+        editor: Editor;
+    }) => void;
+    /** Called when the editor gains focus. */
+    onFocus?: (props: {
+        editor: Editor;
+        event: FocusEvent;
+    }) => void;
+    /** Called when the editor loses focus. */
+    onBlur?: (props: {
+        editor: Editor;
+        event: FocusEvent;
+    }) => void;
+    /** Called before the editor is destroyed. */
+    onDestroy?: () => void;
+}
+/**
+ * Core composable for creating and managing a Domternal editor instance.
+ *
+ * @example
+ * ```ts
+ * const { editor, editorRef } = useEditor({ extensions, content });
+ * ```
+ *
+ * @example SSR-safe (default in Vue - onMounted never runs on server)
+ * ```ts
+ * const { editor, editorRef } = useEditor({ extensions, content });
+ * // editor.value is null until onMounted
+ * ```
+ */
+declare function useEditor(options?: UseEditorOptions): {
+    editor: ShallowRef<Editor | null>;
+    editorRef: Ref<HTMLDivElement | undefined>;
+};
+
+/**
+ * Full editor state returned when no selector is provided.
+ */
+interface EditorState {
+    htmlContent: Ref<string>;
+    jsonContent: Ref<JSONContent | null>;
+    isEmpty: Ref<boolean>;
+    isFocused: Ref<boolean>;
+    isEditable: Ref<boolean>;
+}
+/**
+ * Subscribe to editor state changes.
+ *
+ * **Overload 1 - Full state:**
+ * ```ts
+ * const { htmlContent, isEmpty } = useEditorState(editor);
+ * ```
+ *
+ * **Overload 2 - Selector (granular, avoids unnecessary re-renders):**
+ * ```ts
+ * const isBold = useEditorState(editor, (ed) => ed.isActive('bold'));
+ * ```
+ */
+declare function useEditorState(editor: ShallowRef<Editor | null>): EditorState;
+declare function useEditorState<T>(editor: ShallowRef<Editor | null>, selector: (editor: Editor) => T): ComputedRef<T | undefined>;
+
+/**
+ * Typed injection key for the editor instance.
+ * Components use this via provide/inject to share the editor
+ * without prop drilling.
+ */
+declare const EDITOR_KEY: InjectionKey<ShallowRef<Editor | null>>;
+/**
+ * Provides an editor instance to all descendant components via Vue's
+ * provide/inject system. Also stores the appContext in the WeakMap
+ * for VueNodeViewRenderer to forward the provide/inject chain.
+ *
+ * @example
+ * ```ts
+ * const { editor } = useEditor({ extensions, content });
+ * provideEditor(editor);
+ * ```
+ */
+declare function provideEditor(editor: ShallowRef<Editor | null>): void;
+/**
+ * Access the editor instance from the nearest provider.
+ *
+ * @returns `{ editor }` where editor is a ShallowRef that may be null
+ *   if the provider has no editor yet or if used outside a provider.
+ *
+ * @example
+ * ```ts
+ * const { editor } = useCurrentEditor();
+ * if (editor.value) {
+ *   editor.value.commands.toggleBold();
+ * }
+ * ```
+ */
+declare function useCurrentEditor(): {
+    editor: ShallowRef<Editor | null>;
+};
+
+interface DomternalProps extends UseEditorOptions {
+}
+/**
+ * Composable root component that creates an editor and provides it to all
+ * subcomponents via inject. No need to pass `editor` prop to children.
+ *
+ * Supports namespaced subcomponents in `<script setup>` templates:
+ *
+ * @example
+ * ```vue
+ * <script setup>
+ * import { Domternal } from '@domternal/vue';
+ * </script>
+ * <template>
+ *   <Domternal :extensions="extensions" :content="content">
+ *     <Domternal.Toolbar />
+ *     <Domternal.Content />
+ *     <Domternal.BubbleMenu :contexts="{ text: ['bold', 'italic'] }" />
+ *     <Domternal.EmojiPicker :emojis="emojis" />
+ *   </Domternal>
+ * </template>
+ * ```
+ */
+declare const Domternal: ReturnType<typeof defineComponent> & {
+    Content: ReturnType<typeof defineComponent>;
+    Loading: ReturnType<typeof defineComponent>;
+    Toolbar: ReturnType<typeof defineComponent>;
+    BubbleMenu: ReturnType<typeof defineComponent>;
+    FloatingMenu: ReturnType<typeof defineComponent>;
+    EmojiPicker: ReturnType<typeof defineComponent>;
+};
+
+interface DomternalEditorProps {
+    extensions?: AnyExtension[];
+    content?: Content;
+    editable?: boolean;
+    autofocus?: FocusPosition;
+    immediatelyRender?: boolean;
+    outputFormat?: 'html' | 'json';
+    modelValue?: Content;
+    class?: string;
+    onCreate?: (editor: _domternal_core.Editor) => void;
+    onUpdate?: (props: {
+        editor: _domternal_core.Editor;
+    }) => void;
+    onSelectionChange?: (props: {
+        editor: _domternal_core.Editor;
+    }) => void;
+    onFocus?: (props: {
+        editor: _domternal_core.Editor;
+        event: FocusEvent;
+    }) => void;
+    onBlur?: (props: {
+        editor: _domternal_core.Editor;
+        event: FocusEvent;
+    }) => void;
+    onDestroy?: () => void;
+}
+/**
+ * All-in-one editor component with v-model support and integrated context.
+ *
+ * Wraps children with provideEditor automatically, so toolbar, bubble menu,
+ * and emoji picker components can access the editor via inject.
+ *
+ * @example Basic usage
+ * ```vue
+ * <DomternalEditor
+ *   :extensions="[Bold, Italic, Heading]"
+ *   content="<p>Hello</p>"
+ * />
+ * ```
+ *
+ * @example v-model (two-way binding)
+ * ```vue
+ * <DomternalEditor v-model="content" :extensions="extensions" />
+ * ```
+ *
+ * @example With children (toolbar, bubble menu)
+ * ```vue
+ * <DomternalEditor :extensions="extensions" v-model="content">
+ *   <DomternalToolbar />
+ *   <DomternalBubbleMenu :contexts="{ text: ['bold', 'italic'] }" />
+ * </DomternalEditor>
+ * ```
+ */
+declare const DomternalEditor: vue.DefineComponent<vue.ExtractPropTypes<{
+    extensions: {
+        type: PropType<AnyExtension[]>;
+        default: undefined;
+    };
+    content: {
+        type: PropType<Content>;
+        default: undefined;
+    };
+    editable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autofocus: {
+        type: PropType<FocusPosition>;
+        default: boolean;
+    };
+    immediatelyRender: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    outputFormat: {
+        type: PropType<"html" | "json">;
+        default: string;
+    };
+    modelValue: {
+        type: PropType<Content>;
+        default: undefined;
+    };
+    class: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    onCreate: {
+        type: PropType<(editor: _domternal_core.Editor) => void>;
+        default: undefined;
+    };
+    onUpdate: {
+        type: PropType<(props: {
+            editor: _domternal_core.Editor;
+        }) => void>;
+        default: undefined;
+    };
+    onSelectionChange: {
+        type: PropType<(props: {
+            editor: _domternal_core.Editor;
+        }) => void>;
+        default: undefined;
+    };
+    onFocus: {
+        type: PropType<(props: {
+            editor: _domternal_core.Editor;
+            event: FocusEvent;
+        }) => void>;
+        default: undefined;
+    };
+    onBlur: {
+        type: PropType<(props: {
+            editor: _domternal_core.Editor;
+            event: FocusEvent;
+        }) => void>;
+        default: undefined;
+    };
+    onDestroy: {
+        type: PropType<() => void>;
+        default: undefined;
+    };
+}>, () => (vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}> | vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>[] | undefined)[], {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
+    'update:modelValue': (_value: Content | JSONContent) => true;
+}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    extensions: {
+        type: PropType<AnyExtension[]>;
+        default: undefined;
+    };
+    content: {
+        type: PropType<Content>;
+        default: undefined;
+    };
+    editable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autofocus: {
+        type: PropType<FocusPosition>;
+        default: boolean;
+    };
+    immediatelyRender: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    outputFormat: {
+        type: PropType<"html" | "json">;
+        default: string;
+    };
+    modelValue: {
+        type: PropType<Content>;
+        default: undefined;
+    };
+    class: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    onCreate: {
+        type: PropType<(editor: _domternal_core.Editor) => void>;
+        default: undefined;
+    };
+    onUpdate: {
+        type: PropType<(props: {
+            editor: _domternal_core.Editor;
+        }) => void>;
+        default: undefined;
+    };
+    onSelectionChange: {
+        type: PropType<(props: {
+            editor: _domternal_core.Editor;
+        }) => void>;
+        default: undefined;
+    };
+    onFocus: {
+        type: PropType<(props: {
+            editor: _domternal_core.Editor;
+            event: FocusEvent;
+        }) => void>;
+        default: undefined;
+    };
+    onBlur: {
+        type: PropType<(props: {
+            editor: _domternal_core.Editor;
+            event: FocusEvent;
+        }) => void>;
+        default: undefined;
+    };
+    onDestroy: {
+        type: PropType<() => void>;
+        default: undefined;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: (_value: Content) => any;
+}>, {
+    onBlur: (props: {
+        editor: _domternal_core.Editor;
+        event: FocusEvent;
+    }) => void;
+    onFocus: (props: {
+        editor: _domternal_core.Editor;
+        event: FocusEvent;
+    }) => void;
+    class: string;
+    onCreate: (editor: _domternal_core.Editor) => void;
+    onUpdate: (props: {
+        editor: _domternal_core.Editor;
+    }) => void;
+    onDestroy: () => void;
+    content: Content;
+    onSelectionChange: (props: {
+        editor: _domternal_core.Editor;
+    }) => void;
+    extensions: AnyExtension[];
+    editable: boolean;
+    autofocus: FocusPosition;
+    outputFormat: "html" | "json";
+    immediatelyRender: boolean;
+    modelValue: Content;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+/**
+ * Renders the ProseMirror editor view into a div element.
+ *
+ * Use this with `useEditor` for a flexible, decoupled pattern where the
+ * editor composable and rendering are separated.
+ *
+ * @example
+ * ```vue
+ * <script setup>
+ * import { useEditor, EditorContent } from '@domternal/vue';
+ * const { editor } = useEditor({ extensions, content });
+ * </script>
+ * <template>
+ *   <EditorContent :editor="editor" class="my-editor" />
+ * </template>
+ * ```
+ */
+declare const EditorContent: vue.DefineComponent<vue.ExtractPropTypes<{
+    editor: {
+        type: PropType<Editor | null>;
+        default: null;
+    };
+    class: {
+        type: StringConstructor;
+        default: undefined;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    editor: {
+        type: PropType<Editor | null>;
+        default: null;
+    };
+    class: {
+        type: StringConstructor;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    editor: Editor | null;
+    class: string;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface DomternalToolbarProps {
+    editor?: Editor;
+    icons?: IconSet;
+    layout?: ToolbarLayoutEntry[];
+}
+declare const DomternalToolbar: vue.DefineComponent<vue.ExtractPropTypes<{
+    editor: {
+        type: PropType<Editor>;
+        default: undefined;
+    };
+    icons: {
+        type: PropType<IconSet>;
+        default: undefined;
+    };
+    layout: {
+        type: PropType<ToolbarLayoutEntry[]>;
+        default: undefined;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}> | null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    editor: {
+        type: PropType<Editor>;
+        default: undefined;
+    };
+    icons: {
+        type: PropType<IconSet>;
+        default: undefined;
+    };
+    layout: {
+        type: PropType<ToolbarLayoutEntry[]>;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    editor: Editor;
+    icons: IconSet;
+    layout: ToolbarLayoutEntry[];
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface DomternalBubbleMenuProps {
+    editor?: Editor;
+    shouldShow?: BubbleMenuOptions['shouldShow'];
+    placement?: 'top' | 'bottom';
+    offset?: number;
+    updateDelay?: number;
+    items?: string[];
+    contexts?: Record<string, string[] | true | null>;
+}
+declare const DomternalBubbleMenu: vue.DefineComponent<vue.ExtractPropTypes<{
+    editor: {
+        type: PropType<Editor>;
+        default: undefined;
+    };
+    shouldShow: {
+        type: PropType<BubbleMenuOptions["shouldShow"]>;
+        default: undefined;
+    };
+    placement: {
+        type: PropType<"top" | "bottom">;
+        default: string;
+    };
+    offset: {
+        type: NumberConstructor;
+        default: number;
+    };
+    updateDelay: {
+        type: NumberConstructor;
+        default: number;
+    };
+    items: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    contexts: {
+        type: PropType<Record<string, string[] | true | null>>;
+        default: undefined;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    editor: {
+        type: PropType<Editor>;
+        default: undefined;
+    };
+    shouldShow: {
+        type: PropType<BubbleMenuOptions["shouldShow"]>;
+        default: undefined;
+    };
+    placement: {
+        type: PropType<"top" | "bottom">;
+        default: string;
+    };
+    offset: {
+        type: NumberConstructor;
+        default: number;
+    };
+    updateDelay: {
+        type: NumberConstructor;
+        default: number;
+    };
+    items: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    contexts: {
+        type: PropType<Record<string, string[] | true | null>>;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    editor: Editor;
+    shouldShow: (props: {
+        editor: Editor;
+        view: prosemirror_view.EditorView;
+        state: prosemirror_state.EditorState;
+        from: number;
+        to: number;
+    }) => boolean;
+    placement: "top" | "bottom";
+    offset: number;
+    updateDelay: number;
+    items: string[];
+    contexts: Record<string, true | string[] | null>;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface DomternalFloatingMenuProps {
+    editor?: Editor;
+    shouldShow?: FloatingMenuOptions['shouldShow'];
+    offset?: number;
+}
+declare const DomternalFloatingMenu: vue.DefineComponent<vue.ExtractPropTypes<{
+    editor: {
+        type: PropType<Editor>;
+        default: undefined;
+    };
+    shouldShow: {
+        type: PropType<FloatingMenuOptions["shouldShow"]>;
+        default: undefined;
+    };
+    offset: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    editor: {
+        type: PropType<Editor>;
+        default: undefined;
+    };
+    shouldShow: {
+        type: PropType<FloatingMenuOptions["shouldShow"]>;
+        default: undefined;
+    };
+    offset: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & Readonly<{}>, {
+    editor: Editor;
+    shouldShow: (props: {
+        editor: Editor;
+        view: prosemirror_view.EditorView;
+        state: prosemirror_state.EditorState;
+    }) => boolean;
+    offset: number;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface EmojiPickerItem {
+    emoji: string;
+    name: string;
+    group: string;
+}
+
+interface DomternalEmojiPickerProps {
+    editor?: Editor;
+    emojis: EmojiPickerItem[];
+}
+declare const DomternalEmojiPicker: vue.DefineComponent<vue.ExtractPropTypes<{
+    editor: {
+        type: PropType<Editor>;
+        default: undefined;
+    };
+    emojis: {
+        type: PropType<EmojiPickerItem[]>;
+        required: true;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    editor: {
+        type: PropType<Editor>;
+        default: undefined;
+    };
+    emojis: {
+        type: PropType<EmojiPickerItem[]>;
+        required: true;
+    };
+}>> & Readonly<{}>, {
+    editor: Editor;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+/** ProseMirror node shape passed to node views. */
+interface PMNode {
+    type: {
+        name: string;
+        spec: {
+            group?: string;
+        };
+    };
+    attrs: Record<string, unknown>;
+    textContent: string;
+    nodeSize: number;
+}
+/**
+ * Props passed to custom Vue node view components.
+ */
+interface VueNodeViewProps {
+    editor: Editor;
+    node: PMNode;
+    selected: boolean;
+    getPos: () => number | undefined;
+    updateAttributes: (attrs: Record<string, unknown>) => void;
+    deleteNode: () => void;
+    extension: {
+        name: string;
+        options: Record<string, unknown>;
+    };
+    decorations: readonly unknown[];
+}
+interface VueNodeViewRendererOptions {
+    /** Wrapper element tag. @default 'div' for block, 'span' for inline */
+    as?: string;
+    /** Additional CSS class on the wrapper element. */
+    className?: string;
+    /** Tag for the content DOM element. Set to null for no editable content. @default 'div' */
+    contentDOMElement?: string | null;
+}
+/**
+ * Converts a Vue component into a ProseMirror NodeView constructor.
+ *
+ * Uses Vue's low-level `render(h(), el)` API with appContext forwarding
+ * so that provide/inject from the parent component tree works inside
+ * node view components.
+ *
+ * @example
+ * ```ts
+ * const ImageExtension = Image.extend({
+ *   addNodeView() {
+ *     return VueNodeViewRenderer(ImageComponent);
+ *   }
+ * });
+ * ```
+ */
+declare function VueNodeViewRenderer(component: Component, options?: VueNodeViewRendererOptions): (node: PMNode, _view: unknown, getPos: () => number | undefined, decorations: readonly unknown[]) => VueNodeView | {
+    dom: HTMLElement;
+    update: () => boolean;
+    destroy: () => void;
+};
+interface VueNodeViewInit {
+    editor: Editor;
+    node: PMNode;
+    getPos: () => number | undefined;
+    decorations: readonly unknown[];
+    extension: {
+        name: string;
+        options: Record<string, unknown>;
+    };
+}
+declare class VueNodeView {
+    dom: HTMLElement;
+    contentDOM: HTMLElement | null;
+    private props;
+    private editor;
+    private appContext;
+    constructor(component: Component, init: VueNodeViewInit, options: VueNodeViewRendererOptions, appContext: AppContext);
+    update(node: PMNode, decorations: readonly unknown[]): boolean;
+    selectNode(): void;
+    deselectNode(): void;
+    destroy(): void;
+    ignoreMutation(mutation: MutationRecord | {
+        type: 'selection';
+        target: Node;
+    }): boolean;
+    stopEvent(): boolean;
+}
+
+/**
+ * Container component for custom Vue node view UIs.
+ * Must wrap the root element of every VueNodeViewRenderer component.
+ *
+ * @example
+ * ```vue
+ * <template>
+ *   <NodeViewWrapper as="div">
+ *     <img :src="node.attrs.src" />
+ *   </NodeViewWrapper>
+ * </template>
+ * ```
+ */
+declare const NodeViewWrapper: vue.DefineComponent<vue.ExtractPropTypes<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    as: string;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+/**
+ * Placeholder for editable nested content within a node view.
+ * ProseMirror manages the content DOM - do not render children inside this component.
+ *
+ * @example
+ * ```vue
+ * <template>
+ *   <NodeViewWrapper>
+ *     <h3>Custom heading</h3>
+ *     <NodeViewContent />
+ *   </NodeViewWrapper>
+ * </template>
+ * ```
+ */
+declare const NodeViewContent: vue.DefineComponent<vue.ExtractPropTypes<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    as: string;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+/**
+ * Convenience composable for accessing node view context.
+ * Use inside custom node view components built with VueNodeViewRenderer.
+ *
+ * @example
+ * ```ts
+ * const { onDragStart, nodeViewContentRef } = useVueNodeView();
+ * ```
+ */
+declare function useVueNodeView(): {
+    onDragStart: ((event: DragEvent) => void) | undefined;
+    nodeViewContentRef: ((el: HTMLElement | null) => void) | undefined;
+};
+
+export { DEFAULT_EXTENSIONS, Domternal, DomternalBubbleMenu, type DomternalBubbleMenuProps, DomternalEditor, type DomternalEditorProps, DomternalEmojiPicker, type DomternalEmojiPickerProps, DomternalFloatingMenu, type DomternalFloatingMenuProps, type DomternalProps, DomternalToolbar, type DomternalToolbarProps, EDITOR_KEY, EditorContent, type EditorState, type EmojiPickerItem, NodeViewContent, NodeViewWrapper, type UseEditorOptions, type VueNodeViewProps, VueNodeViewRenderer, type VueNodeViewRendererOptions, provideEditor, useCurrentEditor, useEditor, useEditorState, useVueNodeView };