@stll/folio-vue 0.9.0 → 0.10.0

package/dist/components/AutocompleteCaretOverlay.types.d.ts

@@ -0,0 +1,18 @@
+export type AutocompleteCaretRect = {
+    /** Overlay-relative pixel x. */
+    x: number;
+    /** Overlay-relative pixel y (top of the cursor line). */
+    y: number;
+    /** Line height in pixels at the anchor. */
+    lineHeight: number;
+    /** Available width from the caret to the page's right content edge. */
+    maxWidth?: number | undefined;
+};
+export type AutocompleteCaretOverlayProps = {
+    /** Position of the autocomplete anchor, or null while idle. */
+    caret: AutocompleteCaretRect | null;
+    /** The full streamed ghost text so far. */
+    text: string;
+    /** Whether tokens are still arriving. */
+    isStreaming: boolean;
+};

package/dist/components/DocxEditor/pagedEditorRef.d.ts

@@ -27,6 +27,10 @@ export type PagedEditorRef = {
     getState: () => EditorState | null;
     /** Get the ProseMirror EditorView. */
     getView: () => EditorView | null;
+    /** Get the currently active body, header/footer, or note-story view. */
+    getActiveView: () => EditorView | null;
+    /** Close the visible note story, if one is active. */
+    closeNoteStory: () => void;
     /**
      * Look up the persistent hidden HF EditorView by `rId`. Returns null when the
      * slot isn't mounted (no HF for that rId, or the hidden host hasn't mounted).
@@ -70,6 +74,16 @@ export type PagedEditorRef = {
      * Returns whether a matching paragraph exists in the ProseMirror document.
      */
     scrollToParaId: (paraId: string, options?: ScrollToParaIdOptions) => boolean;
+    /**
+     * Set (or clear, with `null`) the persistent passage highlight overlay. The
+     * range is projected onto the painted pages and painted with a translucent
+     * wash; it does not move the PM selection. Replaces any previous highlight.
+     * The overlay is cleared automatically on the next doc-changing transaction.
+     */
+    setPassageHighlight: (range: {
+        from: number;
+        to: number;
+    } | null) => void;
     /**
      * Resolve the page number (1-indexed) that contains the given PM position, or
      * null if no layout is available yet. Works for unrendered pages too via the

package/dist/components/DocxEditor/types.d.ts

@@ -307,6 +307,21 @@ export type DocxEditorApplyDocumentOperationsOptions = {
     batch: FolioDocumentOperationBatch;
     author?: string;
 };
+/**
+ * Outcome of {@link DocxEditorRef.highlightPassage}:
+ * - `"passage"`: the text matched inside the block; scrolled there and painted
+ *   the range highlight.
+ * - `"block"`: the text did not match but the block resolved; behaved like
+ *   {@link DocxEditorRef.scrollToBlock} (scroll + whole-paragraph flash where a
+ *   paraId exists).
+ * - `"none"`: the block did not resolve; no-op.
+ */
+export type HighlightPassageResult = "passage" | "block" | "none";
+export type HighlightPassageOptions = {
+    blockId: string;
+    text: string;
+    snapshot?: FolioAIEditSnapshot;
+};
 /**
  * Imperative handle exposed by the DocxEditor component.
  */
@@ -411,6 +426,18 @@ export type DocxEditorRef = {
      * accept. Without `snapshot`, falls back to a fresh-from-live-doc snapshot.
      */
     scrollToBlock: (blockId: string, snapshot?: FolioAIEditSnapshot) => boolean;
+    /**
+     * Resolve a text passage inside a block, scroll to it, and paint a persistent
+     * translucent highlight over the matched range. Unlike {@link scrollToBlock},
+     * the passage outcome does not move the PM selection, so the highlight is not
+     * confused with a selection. Replaces any previous passage highlight. Returns
+     * which outcome happened; see {@link HighlightPassageResult}. The highlight is
+     * ephemeral view state: cleared on the next doc-changing transaction and by
+     * {@link clearPassageHighlight}.
+     */
+    highlightPassage: (options: HighlightPassageOptions) => HighlightPassageResult;
+    /** Clear the passage highlight painted by {@link highlightPassage}, if any. */
+    clearPassageHighlight: () => void;
     /** Resolve a stable block or text-range target and reveal it in the editor. */
     showInDocument: (target: FolioDocumentNavigationTarget, snapshot?: FolioAIEditSnapshot) => boolean;
     /**

package/dist/composables/index.d.ts

@@ -15,6 +15,7 @@
  * @public
  */
 export * from './useClipboard';
+export * from './useColorMode';
 export * from './useDocxEditor';
 export * from './useDragAutoScroll';
 export * from './useFindReplace';

package/dist/composables/useColorMode.d.ts

@@ -1,8 +1,21 @@
-import { ComputedRef } from 'vue';
+import { App, ComputedRef, MaybeRefOrGetter } from 'vue';
 import { ColorMode } from '../utils/colorMode';
+/** Color mode used when a host does not provide one. */
+export declare const defaultColorMode: ColorMode;
 /**
- * Resolve the effective dark flag from a reactive `colorMode`. `'system'`
+ * Provide a reactive color mode to descendant folio components.
+ *
+ * Call this from a parent component's setup function. For app-wide setup, use
+ * {@link colorModePlugin} instead.
+ */
+export declare const provideColorMode: (colorMode?: MaybeRefOrGetter<ColorMode>) => void;
+/** Vue plugin form: `app.use(colorModePlugin, "system")`. */
+export declare const colorModePlugin: {
+    install(app: App, colorMode?: MaybeRefOrGetter<ColorMode>): void;
+};
+/**
+ * Resolve the effective dark flag from the inherited color mode. `'system'`
  * follows the OS via `subscribeSystemDark` (SSR-safe; re-syncs on entry).
- * Mirrors the React adapter's inline colorMode logic via the shared core helpers.
  */
-export declare function useColorMode(colorMode: () => ColorMode): ComputedRef<boolean>;
+export declare function useColorMode(): ComputedRef<boolean>;
+export type { ColorMode } from '../utils/colorMode';

package/dist/composables/useContextMenus.d.ts

@@ -48,6 +48,9 @@ export type UseContextMenusOptions = {
         from: number;
         to: number;
     }) => void;
+    onCopy?: () => void;
+    onCut?: () => void;
+    onPaste?: () => void;
 };
 export type UseContextMenusReturn = {
     contextMenu: Ref<TextContextMenuState>;

package/dist/composables/useDocxEditor.d.ts

@@ -3,6 +3,7 @@ import { EditorState, Plugin } from 'prosemirror-state';
 import { EditorView } from 'prosemirror-view';
 import { FolioEditor } from '@stll/folio-core/controller/folioEditor';
 import { HeaderFooterPartKind } from '@stll/folio-core/controller/headerFooterEditorManager';
+import { NoteStoryKey } from '@stll/folio-core/controller/noteEditorManager';
 import { HiddenProseMirrorCollaboration, HiddenProseMirrorRemoteSelection } from '@stll/folio-core/controller/hiddenEditorManager';
 import { FolioSelectiveSaveFlags } from '@stll/folio-core/docx/selectiveSaveFlags';
 import { TripwireResult } from '@stll/folio-core/docx/selectiveSaveTripwire';
@@ -18,12 +19,18 @@ export type UseDocxEditorOptions = {
     hiddenContainer: Ref<HTMLElement | null>;
     /** Optional separate host for persistent header/footer ProseMirror views. */
     hiddenHeaderFooterContainer?: Ref<HTMLElement | null>;
+    /** Visible host for the active footnote or endnote ProseMirror story. */
+    noteEditorContainer?: Ref<HTMLElement | null>;
     /** Container element the paginated pages are painted into. */
     pagesContainer: Ref<HTMLElement | null>;
     /** Whether the editor is read-only. Reactive. */
     readOnly?: MaybeRefOrGetter<boolean>;
     /** Gap between pages in pixels. */
     pageGap?: number;
+    /** Whether to paint each page's effective body-content boundary. Reactive. */
+    showMarginGuides?: MaybeRefOrGetter<boolean | undefined>;
+    /** CSS color used for margin guides. Reactive. */
+    marginGuideColor?: MaybeRefOrGetter<string | undefined>;
     /**
      * Stable identity of the loaded document (same across internal edits, distinct
      * per loaded file). Threaded to the hidden-editor manager's external-load
@@ -69,6 +76,12 @@ export type UseDocxEditorOptions = {
     onSelectionUpdate?: (state: EditorState) => void;
     /** Callback when the hidden EditorView is created or torn down. */
     onEditorViewReady?: (view: EditorView | null) => void;
+    /** Fires when the editor receives a copy event. */
+    onCopy?: () => void;
+    /** Fires when an editable editor receives a cut event. */
+    onCut?: () => void;
+    /** Fires when an editable editor receives a paste event. */
+    onPaste?: () => void;
     /** Callback when a read-only user action would mutate the document. */
     onReadOnlyEditAttempt?: () => void;
     /**
@@ -104,6 +117,8 @@ export type UseDocxEditorReturn = {
     remoteSelections: Ref<HiddenProseMirrorRemoteSelection[]>;
     /** Selection in the currently active persistent header/footer view. */
     headerFooterSelection: Ref<HeaderFooterSelectionState | null>;
+    /** The note story currently open in the visible note editor. */
+    activeNoteStory: Ref<NoteStoryKey | null>;
     /** True once the hidden view is mounted and a document is loaded. */
     isReady: Ref<boolean>;
     /**
@@ -139,6 +154,12 @@ export type UseDocxEditorReturn = {
     getHeaderFooterView: (rId: string) => EditorView | null;
     /** Synchronize persistent header/footer views after a document-model change. */
     syncHeaderFooterViews: () => void;
+    /** Open an existing footnote or endnote story. */
+    openNoteStory: (story: NoteStoryKey) => void;
+    /** Close the visible note-story editor. */
+    closeNoteStory: () => void;
+    /** Resolve the active note-story view. */
+    getActiveNoteView: () => EditorView | null;
     /** Access the extension command map for invoking marks / nodes / features. */
     getCommands: () => CommandMap;
     /** Focus the hidden ProseMirror view. */

package/dist/composables/useDocxEditorRefApi.d.ts

@@ -42,6 +42,17 @@ export type UseDocxEditorRefApiOptions = {
      * Vue analogue of React's `PagedEditorRef.scrollToPosition`.
      */
     scrollVisiblePositionIntoView: (pmPos: number) => void;
+    /**
+     * Set (or clear, with `null`) the persistent passage-highlight range that the
+     * `PassageHighlightOverlay` projects and paints. Backs `highlightPassage` /
+     * `clearPassageHighlight`; the Vue analogue of React's
+     * `PagedEditorRef.setPassageHighlight`. The overlay is cleared automatically
+     * on the next doc-changing transaction (owned by DocxEditor.vue).
+     */
+    setPassageHighlight: (range: {
+        from: number;
+        to: number;
+    } | null) => void;
     /** Editor author, used as the default operation author for AI edits. */
     author: () => string;
     /**
@@ -55,6 +66,8 @@ export type UseDocxEditorRefApiOptions = {
     setComments: (comments: Comment[]) => void;
     focus: () => void;
     getDocument: () => Document | null;
+    getActiveView: () => EditorView | null;
+    closeNoteStory: () => void;
     getHeaderFooterView: (rId: string) => EditorView | null;
     setZoom: (zoom: number) => void;
     /** useDocxEditor.save returns a Blob; the ref surface exposes an ArrayBuffer. */

package/dist/composables/useFontLifecycle.d.ts

@@ -0,0 +1,21 @@
+import { Ref } from 'vue';
+import { FontDefinition } from '../components/DocxEditor/types';
+export type UseFontLifecycleOptions = {
+    isReady: Ref<boolean>;
+    getDocument: () => {
+        originalBuffer?: ArrayBuffer | null;
+    } | null;
+    fonts: () => ReadonlyArray<FontDefinition> | undefined;
+    remeasure: () => void;
+};
+export type FontLifecycleDependencies = {
+    loadEmbedded: (buffer: ArrayBuffer) => Promise<FontFace[]>;
+    loadHost: (fonts: ReadonlyArray<FontDefinition> | undefined) => Promise<FontFace[]>;
+    remove: (faces: readonly FontFace[]) => void;
+};
+/**
+ * Register document-embedded and host-provided fonts for the lifetime of their
+ * sources. Async results from a stale document or prop value are immediately
+ * removed, preventing one editor load from leaking faces into the next.
+ */
+export declare function useFontLifecycle(options: UseFontLifecycleOptions, dependencies?: FontLifecycleDependencies): void;

package/dist/composables/useKeyboardShortcuts.d.ts

@@ -1,6 +1,5 @@
 import { Ref } from 'vue';
 export type UseKeyboardShortcutsOptions = {
-    showKeyboardShortcuts: Ref<boolean>;
     showFindReplace: Ref<boolean>;
     showHyperlink: Ref<boolean>;
     /** From useZoom — handles Ctrl+= / Ctrl+- / Ctrl+0. */

package/dist/composables/usePagesPointer.d.ts

@@ -2,6 +2,7 @@ import { Ref, ShallowRef } from 'vue';
 import { Command } from 'prosemirror-state';
 import { EditorView } from 'prosemirror-view';
 import { Document } from '@stll/folio-core/types/document';
+import { NoteStoryKey } from '@stll/folio-core/controller/noteEditorManager';
 import { Layout } from '@stll/folio-core/layout-engine';
 import { ImageSelectionInfo } from '../components/imageSelectionTypes';
 import { HyperlinkPopupData } from '../components/ui/hyperlinkPopupTypes';
@@ -61,6 +62,10 @@ export type UsePagesPointerOptions = {
      * callers fall back to in-place mutation + `syncHfPMs()`.
      */
     setDocument: (doc: Document) => void;
+    /** Open a footnote or endnote story from a painted reference/body. */
+    openNoteStory: (story: NoteStoryKey) => void;
+    closeNoteStory: () => void;
+    getActiveNoteView: () => EditorView | null;
 };
 export type UsePagesPointerReturn = {
     tableInsertButton: Ref<TableInsertButton | null>;

package/dist/composables.cjs

@@ -1,4 +1,4 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./useFindReplace-ZCrdvwEk.cjs"),t=require("./useZoom-BYEcnpS0.cjs");let n=require("vue"),r=require("prosemirror-history"),i=require("@stll/folio-core/utils/clipboard"),a=require("@stll/folio-core/managers/ClipboardManager"),o=require("@stll/folio-core/managers/TableSelectionManager"),s=require("@stll/folio-core/prosemirror/utils/visualLineNavigation"),c=require("@stll/folio-core/prosemirror/utils/extractTrackedChanges");function l(e={}){let{onCopy:t,onCut:r,onPaste:a,cleanWordFormatting:o=!0,editable:s=!0,onError:c}=e,l=(0,n.ref)(!1),u=(0,n.ref)(null),d=c?{onError:c}:{};async function f(e){if(l.value)return!1;l.value=!0;try{let n=await(0,i.copyRuns)(e.runs,d);return n&&t?.(e),n}finally{l.value=!1}}async function p(e){if(l.value||!s)return!1;l.value=!0;try{let t=await(0,i.copyRuns)(e.runs,d);return t&&r?.(e),t}finally{l.value=!1}}async function m(e=!1){if(l.value||!s)return null;l.value=!0;try{if(navigator.clipboard&&navigator.clipboard.read){let t=await navigator.clipboard.read(),n=``,r=``;for(let e of t)e.types.includes(`text/html`)&&(n=await(await e.getType(`text/html`)).text()),e.types.includes(`text/plain`)&&(r=await(await e.getType(`text/plain`)).text());e&&(n=``);let s=(0,i.parseClipboardHtml)(n,r,o);return u.value=s,a?.(s,e),s}return null}catch(e){return c?.(e instanceof Error?e:Error(String(e))),null}finally{l.value=!1}}return{copy:f,cut:p,paste:m,isProcessing:l,lastPastedContent:u}}function u({isOpen:e,onClose:t,align:r=`left`}){let i=(0,n.ref)(null),a=(0,n.ref)(null),o=(0,n.ref)({position:`fixed`,top:`0px`,left:`0px`,zIndex:1e4});function s(e,t){o.value={position:`fixed`,top:e+`px`,left:t+`px`,zIndex:1e4}}function c(e){let n=e.target;n instanceof Node&&i.value&&!i.value.contains(n)&&a.value&&!a.value.contains(n)&&t()}function l(e){e.key===`Escape`&&t()}function u(e){let n=e.target;n instanceof Node&&a.value&&a.value.contains(n)||t()}function d(){document.addEventListener(`mousedown`,c),document.addEventListener(`keydown`,l),window.addEventListener(`scroll`,u,!0)}function f(){document.removeEventListener(`mousedown`,c),document.removeEventListener(`keydown`,l),window.removeEventListener(`scroll`,u,!0)}(0,n.watch)(e,e=>{if(!e){f();return}let t=i.value;if(!t)return;let n=t.getBoundingClientRect();r===`right`?requestAnimationFrame(()=>{let e=a.value;if(e){let t=e.getBoundingClientRect();s(n.bottom+4,n.right-t.width)}else s(n.bottom+4,n.left)}):s(n.bottom+4,n.left),d()}),(0,n.onScopeDispose)(f);function p(e){e.preventDefault(),e.stopPropagation()}return{containerRef:i,dropdownRef:a,dropdownStyle:o,handleMouseDown:p}}function d(e,t){let i=(0,n.computed)(()=>{t.value;let n=e.value;return n?(0,r.undoDepth)(n.state)>0:!1}),a=(0,n.computed)(()=>{t.value;let n=e.value;return n?(0,r.redoDepth)(n.state)>0:!1});function o(){let t=e.value;return t?(0,r.undo)(t.state,t.dispatch):!1}function s(){let t=e.value;return t?(0,r.redo)(t.state,t.dispatch):!1}return{canUndo:i,canRedo:a,undo:o,redo:s}}var f={backgroundColor:`rgba(26, 115, 232, 0.3)`,borderRadius:0,zIndex:0,opacity:1,mixBlendMode:`multiply`};function p(e){let t=window.getSelection();if(!t||t.rangeCount===0||t.isCollapsed)return[];let n=t.getRangeAt(0);if(e&&!e.contains(n.commonAncestorContainer))return[];let r=0,i=0;if(e){let t=e.getBoundingClientRect();r=t.left+e.scrollLeft,i=t.top+e.scrollTop}let a=[];for(let e of n.getClientRects())e.width===0&&e.height===0||a.push({left:e.left-r,top:e.top-i,width:e.width,height:e.height});return a}function m(e,t=2){if(e.length<=1)return e;let n=[...e].sort((e,n)=>Math.abs(e.top-n.top)<t?e.left-n.left:e.top-n.top),r=n[0];if(!r)return e;let i=[],a={...r};for(let e=1;e<n.length;e++){let r=n[e];if(!r)continue;let o=Math.abs(r.top-a.top)<t,s=r.left<=a.left+a.width+t;if(o&&s){let e=Math.max(a.left+a.width,r.left+r.width);a.width=e-a.left,a.height=Math.max(a.height,r.height)}else i.push(a),a={...r}}return i.push(a),i}function h(e){return m(p(e))}function g(){let e=window.getSelection();return e!==null&&!e.isCollapsed&&e.rangeCount>0}function _(e){let t=window.getSelection();return!t||t.rangeCount===0?!1:e.contains(t.getRangeAt(0).commonAncestorContainer)}var v=`docx-selection-styles`,y=null;function b(){y&&=(y.remove(),null),document.getElementById(v)?.remove()}function x(e=f){b();let t=`
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./useFindReplace-ZCrdvwEk.cjs"),t=require("./useZoom-DBbzwfMG.cjs");let n=require("vue"),r=require("prosemirror-history"),i=require("@stll/folio-core/utils/clipboard"),a=require("@stll/folio-core/managers/ClipboardManager"),o=require("@stll/folio-core/managers/TableSelectionManager"),s=require("@stll/folio-core/prosemirror/utils/visualLineNavigation"),c=require("@stll/folio-core/prosemirror/utils/extractTrackedChanges");function l(e={}){let{onCopy:t,onCut:r,onPaste:a,cleanWordFormatting:o=!0,editable:s=!0,onError:c}=e,l=(0,n.ref)(!1),u=(0,n.ref)(null),d=c?{onError:c}:{};async function f(e){if(l.value)return!1;l.value=!0;try{let n=await(0,i.copyRuns)(e.runs,d);return n&&t?.(e),n}finally{l.value=!1}}async function p(e){if(l.value||!s)return!1;l.value=!0;try{let t=await(0,i.copyRuns)(e.runs,d);return t&&r?.(e),t}finally{l.value=!1}}async function m(e=!1){if(l.value||!s)return null;l.value=!0;try{if(navigator.clipboard&&navigator.clipboard.read){let t=await navigator.clipboard.read(),n=``,r=``;for(let e of t)e.types.includes(`text/html`)&&(n=await(await e.getType(`text/html`)).text()),e.types.includes(`text/plain`)&&(r=await(await e.getType(`text/plain`)).text());e&&(n=``);let s=(0,i.parseClipboardHtml)(n,r,o);return u.value=s,a?.(s,e),s}return null}catch(e){return c?.(e instanceof Error?e:Error(String(e))),null}finally{l.value=!1}}return{copy:f,cut:p,paste:m,isProcessing:l,lastPastedContent:u}}function u({isOpen:e,onClose:t,align:r=`left`}){let i=(0,n.ref)(null),a=(0,n.ref)(null),o=(0,n.ref)({position:`fixed`,top:`0px`,left:`0px`,zIndex:1e4});function s(e,t){o.value={position:`fixed`,top:e+`px`,left:t+`px`,zIndex:1e4}}function c(e){let n=e.target;n instanceof Node&&i.value&&!i.value.contains(n)&&a.value&&!a.value.contains(n)&&t()}function l(e){e.key===`Escape`&&t()}function u(e){let n=e.target;n instanceof Node&&a.value&&a.value.contains(n)||t()}function d(){document.addEventListener(`mousedown`,c),document.addEventListener(`keydown`,l),window.addEventListener(`scroll`,u,!0)}function f(){document.removeEventListener(`mousedown`,c),document.removeEventListener(`keydown`,l),window.removeEventListener(`scroll`,u,!0)}(0,n.watch)(e,e=>{if(!e){f();return}let t=i.value;if(!t)return;let n=t.getBoundingClientRect();r===`right`?requestAnimationFrame(()=>{let e=a.value;if(e){let t=e.getBoundingClientRect();s(n.bottom+4,n.right-t.width)}else s(n.bottom+4,n.left)}):s(n.bottom+4,n.left),d()}),(0,n.onScopeDispose)(f);function p(e){e.preventDefault(),e.stopPropagation()}return{containerRef:i,dropdownRef:a,dropdownStyle:o,handleMouseDown:p}}function d(e,t){let i=(0,n.computed)(()=>{t.value;let n=e.value;return n?(0,r.undoDepth)(n.state)>0:!1}),a=(0,n.computed)(()=>{t.value;let n=e.value;return n?(0,r.redoDepth)(n.state)>0:!1});function o(){let t=e.value;return t?(0,r.undo)(t.state,t.dispatch):!1}function s(){let t=e.value;return t?(0,r.redo)(t.state,t.dispatch):!1}return{canUndo:i,canRedo:a,undo:o,redo:s}}var f={backgroundColor:`rgba(26, 115, 232, 0.3)`,borderRadius:0,zIndex:0,opacity:1,mixBlendMode:`multiply`};function p(e){let t=window.getSelection();if(!t||t.rangeCount===0||t.isCollapsed)return[];let n=t.getRangeAt(0);if(e&&!e.contains(n.commonAncestorContainer))return[];let r=0,i=0;if(e){let t=e.getBoundingClientRect();r=t.left+e.scrollLeft,i=t.top+e.scrollTop}let a=[];for(let e of n.getClientRects())e.width===0&&e.height===0||a.push({left:e.left-r,top:e.top-i,width:e.width,height:e.height});return a}function m(e,t=2){if(e.length<=1)return e;let n=[...e].sort((e,n)=>Math.abs(e.top-n.top)<t?e.left-n.left:e.top-n.top),r=n[0];if(!r)return e;let i=[],a={...r};for(let e=1;e<n.length;e++){let r=n[e];if(!r)continue;let o=Math.abs(r.top-a.top)<t,s=r.left<=a.left+a.width+t;if(o&&s){let e=Math.max(a.left+a.width,r.left+r.width);a.width=e-a.left,a.height=Math.max(a.height,r.height)}else i.push(a),a={...r}}return i.push(a),i}function h(e){return m(p(e))}function g(){let e=window.getSelection();return e!==null&&!e.isCollapsed&&e.rangeCount>0}function _(e){let t=window.getSelection();return!t||t.rangeCount===0?!1:e.contains(t.getRangeAt(0).commonAncestorContainer)}var v=`docx-selection-styles`,y=null;function b(){y&&=(y.remove(),null),document.getElementById(v)?.remove()}function x(e=f){b();let t=`
     /* DOCX Editor Selection Highlighting */
 
     .docx-editor [contenteditable="true"]::selection,
@@ -58,4 +58,4 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
       background-color: rgba(156, 39, 176, 0.2);
       border-bottom: 2px dashed rgba(156, 39, 176, 0.6);
     }
-  `;y=document.createElement(`style`),y.id=v,y.textContent=t,document.head.appendChild(y)}function S(){return y!==null||document.getElementById(v)!==null}function C(){return window.getSelection()?.toString()??``}function w(e){let{containerRef:t,enabled:r=!0,config:i=f,useOverlay:a=!1,debounceMs:o=16,onSelectionChange:s}=e,c=(0,n.ref)(!1),l=(0,n.ref)(``),u=(0,n.ref)([]),d=(0,n.ref)(!1),p=null,m=0;function v(){let e=t.value,n=g(),r=C(),i=e?_(e):!1;c.value=n,l.value=r,d.value=i,u.value=a&&i&&e?h(e):[],s?.(n&&i,r)}function y(){v()}function b(){let e=performance.now();if(e-m<o){p&&clearTimeout(p),p=setTimeout(()=>{m=performance.now(),v(),p=null},o);return}m=e,v()}function w(e){let t={position:`absolute`,left:`${e.left}px`,top:`${e.top}px`,width:`${e.width}px`,height:`${e.height}px`,backgroundColor:i.backgroundColor,zIndex:i.zIndex??0,pointerEvents:`none`};return i.borderRadius&&(t.borderRadius=`${i.borderRadius}px`),i.borderColor&&(t.border=`1px solid ${i.borderColor}`),t}return(0,n.onMounted)(()=>{r&&(S()||x(i),document.addEventListener(`selectionchange`,b))}),(0,n.onBeforeUnmount)(()=>{document.removeEventListener(`selectionchange`,b),p&&clearTimeout(p)}),(0,n.watch)(t,()=>v()),{hasSelection:(0,n.computed)(()=>c.value),selectedText:(0,n.computed)(()=>l.value),highlightRects:(0,n.computed)(()=>u.value),isSelectionInContainer:(0,n.computed)(()=>d.value),refresh:y,getOverlayStyle:w}}function T(){let e=new o.TableSelectionManager,t=(0,n.ref)(null),r=()=>{let n=e.getSnapshot();t.value=n.tableIndex!==null&&n.rowIndex!==null&&n.columnIndex!==null?{tableIndex:n.tableIndex,rowIndex:n.rowIndex,columnIndex:n.columnIndex}:null},i=e.subscribe(r);r(),(0,n.onScopeDispose)(i);function a(t,n,r){e.selectCellCoordinates({tableIndex:t,rowIndex:n,columnIndex:r})}function s(t,n){let r=(0,o.findTableFromClick)(t,n);if(!r){e.clearSelection();return}e.selectCellCoordinates(r)}function c(){e.clearSelection()}function l(t,n,r){return e.isCellSelected(t,n,r)}return{selectedCell:t,handleCellClick:a,handleClickTarget:s,clearSelection:c,isCellSelected:l}}function E(e){let t=(0,s.createVisualLineState)();function n(t){let n=e.value;return n?(0,s.getCaretClientX)(n,t):null}function r(t){let n=e.value;return n?(0,s.findLineElementAtPosition)(n,t):null}function i(e,t){return(0,s.findPositionOnLineAtClientX)(e,t)}function a(n,r){return(0,s.handleVisualLineKeyDown)(t,n,r,e.value)}return{state:t,getCaretClientX:n,findLineElementAtPosition:r,findPositionOnLineAtClientX:i,handlePMKeyDown:a}}exports.createSelectionFromDOM=a.createSelectionFromDOM,exports.extractTrackedChanges=c.extractTrackedChanges,exports.getSelectionRuns=a.getSelectionRuns,exports.runsToClipboardContent=i.runsToClipboardContent,exports.useClipboard=l,exports.useDocxEditor=t.a,exports.useDragAutoScroll=t.i,exports.useFindReplace=e.t,exports.useFixedDropdown=u,exports.useHistory=d,exports.useSelectionHighlight=w,exports.useTableResize=t.r,exports.useTableSelection=T,exports.useTrackedChanges=t.n,exports.useVisualLineNavigation=E,exports.useWheelZoom=t.t,exports.useZoom=t.t;
+  `;y=document.createElement(`style`),y.id=v,y.textContent=t,document.head.appendChild(y)}function S(){return y!==null||document.getElementById(v)!==null}function C(){return window.getSelection()?.toString()??``}function w(e){let{containerRef:t,enabled:r=!0,config:i=f,useOverlay:a=!1,debounceMs:o=16,onSelectionChange:s}=e,c=(0,n.ref)(!1),l=(0,n.ref)(``),u=(0,n.ref)([]),d=(0,n.ref)(!1),p=null,m=0;function v(){let e=t.value,n=g(),r=C(),i=e?_(e):!1;c.value=n,l.value=r,d.value=i,u.value=a&&i&&e?h(e):[],s?.(n&&i,r)}function y(){v()}function b(){let e=performance.now();if(e-m<o){p&&clearTimeout(p),p=setTimeout(()=>{m=performance.now(),v(),p=null},o);return}m=e,v()}function w(e){let t={position:`absolute`,left:`${e.left}px`,top:`${e.top}px`,width:`${e.width}px`,height:`${e.height}px`,backgroundColor:i.backgroundColor,zIndex:i.zIndex??0,pointerEvents:`none`};return i.borderRadius&&(t.borderRadius=`${i.borderRadius}px`),i.borderColor&&(t.border=`1px solid ${i.borderColor}`),t}return(0,n.onMounted)(()=>{r&&(S()||x(i),document.addEventListener(`selectionchange`,b))}),(0,n.onBeforeUnmount)(()=>{document.removeEventListener(`selectionchange`,b),p&&clearTimeout(p)}),(0,n.watch)(t,()=>v()),{hasSelection:(0,n.computed)(()=>c.value),selectedText:(0,n.computed)(()=>l.value),highlightRects:(0,n.computed)(()=>u.value),isSelectionInContainer:(0,n.computed)(()=>d.value),refresh:y,getOverlayStyle:w}}function T(){let e=new o.TableSelectionManager,t=(0,n.ref)(null),r=()=>{let n=e.getSnapshot();t.value=n.tableIndex!==null&&n.rowIndex!==null&&n.columnIndex!==null?{tableIndex:n.tableIndex,rowIndex:n.rowIndex,columnIndex:n.columnIndex}:null},i=e.subscribe(r);r(),(0,n.onScopeDispose)(i);function a(t,n,r){e.selectCellCoordinates({tableIndex:t,rowIndex:n,columnIndex:r})}function s(t,n){let r=(0,o.findTableFromClick)(t,n);if(!r){e.clearSelection();return}e.selectCellCoordinates(r)}function c(){e.clearSelection()}function l(t,n,r){return e.isCellSelected(t,n,r)}return{selectedCell:t,handleCellClick:a,handleClickTarget:s,clearSelection:c,isCellSelected:l}}function E(e){let t=(0,s.createVisualLineState)();function n(t){let n=e.value;return n?(0,s.getCaretClientX)(n,t):null}function r(t){let n=e.value;return n?(0,s.findLineElementAtPosition)(n,t):null}function i(e,t){return(0,s.findPositionOnLineAtClientX)(e,t)}function a(n,r){return(0,s.handleVisualLineKeyDown)(t,n,r,e.value)}return{state:t,getCaretClientX:n,findLineElementAtPosition:r,findPositionOnLineAtClientX:i,handlePMKeyDown:a}}exports.colorModePlugin=t.o,exports.createSelectionFromDOM=a.createSelectionFromDOM,exports.defaultColorMode=t.s,exports.extractTrackedChanges=c.extractTrackedChanges,exports.getSelectionRuns=a.getSelectionRuns,exports.provideColorMode=t.c,exports.runsToClipboardContent=i.runsToClipboardContent,exports.useClipboard=l,exports.useColorMode=t.l,exports.useDocxEditor=t.a,exports.useDragAutoScroll=t.i,exports.useFindReplace=e.t,exports.useFixedDropdown=u,exports.useHistory=d,exports.useSelectionHighlight=w,exports.useTableResize=t.r,exports.useTableSelection=T,exports.useTrackedChanges=t.n,exports.useVisualLineNavigation=E,exports.useWheelZoom=t.t,exports.useZoom=t.t;

package/dist/composables.js

@@ -1,35 +1,35 @@
 import { t as e } from "./useFindReplace-CL8Rbc3y.js";
-import { a as t, i as n, n as r, o as i, r as a, t as o } from "./useZoom-C0p0o54p.js";
-import { computed as s, onBeforeUnmount as c, onMounted as l, onScopeDispose as u, ref as d, watch as f } from "vue";
-import { redo as p, redoDepth as m, undo as h, undoDepth as g } from "prosemirror-history";
-import { copyRuns as _, parseClipboardHtml as v, runsToClipboardContent as y } from "@stll/folio-core/utils/clipboard";
-import { createSelectionFromDOM as b, getSelectionRuns as x } from "@stll/folio-core/managers/ClipboardManager";
-import { TableSelectionManager as S, findTableFromClick as C } from "@stll/folio-core/managers/TableSelectionManager";
-import { createVisualLineState as w, findLineElementAtPosition as T, findPositionOnLineAtClientX as E, getCaretClientX as D, handleVisualLineKeyDown as O } from "@stll/folio-core/prosemirror/utils/visualLineNavigation";
+import { a as t, c as n, i as r, l as i, n as a, o, r as s, s as c, t as l, u } from "./useZoom-DwDDS7hq.js";
+import { computed as d, onBeforeUnmount as f, onMounted as p, onScopeDispose as m, ref as h, watch as g } from "vue";
+import { redo as _, redoDepth as v, undo as y, undoDepth as b } from "prosemirror-history";
+import { copyRuns as x, parseClipboardHtml as S, runsToClipboardContent as C } from "@stll/folio-core/utils/clipboard";
+import { createSelectionFromDOM as w, getSelectionRuns as T } from "@stll/folio-core/managers/ClipboardManager";
+import { TableSelectionManager as E, findTableFromClick as D } from "@stll/folio-core/managers/TableSelectionManager";
+import { createVisualLineState as O, findLineElementAtPosition as k, findPositionOnLineAtClientX as A, getCaretClientX as j, handleVisualLineKeyDown as M } from "@stll/folio-core/prosemirror/utils/visualLineNavigation";
 //#region src/composables/useClipboard.ts
-function k(e = {}) {
-	let { onCopy: t, onCut: n, onPaste: r, cleanWordFormatting: i = !0, editable: a = !0, onError: o } = e, s = d(!1), c = d(null), l = o ? { onError: o } : {};
+function N(e = {}) {
+	let { onCopy: t, onCut: n, onPaste: r, cleanWordFormatting: i = !0, editable: a = !0, onError: o } = e, s = h(!1), c = h(null), l = o ? { onError: o } : {};
 	async function u(e) {
 		if (s.value) return !1;
 		s.value = !0;
 		try {
-			let n = await _(e.runs, l);
+			let n = await x(e.runs, l);
 			return n && t?.(e), n;
 		} finally {
 			s.value = !1;
 		}
 	}
-	async function f(e) {
+	async function d(e) {
 		if (s.value || !a) return !1;
 		s.value = !0;
 		try {
-			let t = await _(e.runs, l);
+			let t = await x(e.runs, l);
 			return t && n?.(e), t;
 		} finally {
 			s.value = !1;
 		}
 	}
-	async function p(e = !1) {
+	async function f(e = !1) {
 		if (s.value || !a) return null;
 		s.value = !0;
 		try {
@@ -37,7 +37,7 @@ function k(e = {}) {
 				let t = await navigator.clipboard.read(), n = "", a = "";
 				for (let e of t) e.types.includes("text/html") && (n = await (await e.getType("text/html")).text()), e.types.includes("text/plain") && (a = await (await e.getType("text/plain")).text());
 				e && (n = "");
-				let o = v(n, a, i);
+				let o = S(n, a, i);
 				return c.value = o, r?.(o, e), o;
 			}
 			return null;
@@ -49,16 +49,16 @@ function k(e = {}) {
 	}
 	return {
 		copy: u,
-		cut: f,
-		paste: p,
+		cut: d,
+		paste: f,
 		isProcessing: s,
 		lastPastedContent: c
 	};
 }
 //#endregion
 //#region src/composables/useFixedDropdown.ts
-function A({ isOpen: e, onClose: t, align: n = "left" }) {
-	let r = d(null), i = d(null), a = d({
+function P({ isOpen: e, onClose: t, align: n = "left" }) {
+	let r = h(null), i = h(null), a = h({
 		position: "fixed",
 		top: "0px",
 		left: "0px",
@@ -83,15 +83,15 @@ function A({ isOpen: e, onClose: t, align: n = "left" }) {
 		let n = e.target;
 		n instanceof Node && i.value && i.value.contains(n) || t();
 	}
-	function p() {
+	function u() {
 		document.addEventListener("mousedown", s), document.addEventListener("keydown", c), window.addEventListener("scroll", l, !0);
 	}
-	function m() {
+	function d() {
 		document.removeEventListener("mousedown", s), document.removeEventListener("keydown", c), window.removeEventListener("scroll", l, !0);
 	}
-	f(e, (e) => {
+	g(e, (e) => {
 		if (!e) {
-			m();
+			d();
 			return;
 		}
 		let t = r.value;
@@ -103,37 +103,37 @@ function A({ isOpen: e, onClose: t, align: n = "left" }) {
 				let t = e.getBoundingClientRect();
 				o(a.bottom + 4, a.right - t.width);
 			} else o(a.bottom + 4, a.left);
-		}) : o(a.bottom + 4, a.left), p();
-	}), u(m);
-	function h(e) {
+		}) : o(a.bottom + 4, a.left), u();
+	}), m(d);
+	function f(e) {
 		e.preventDefault(), e.stopPropagation();
 	}
 	return {
 		containerRef: r,
 		dropdownRef: i,
 		dropdownStyle: a,
-		handleMouseDown: h
+		handleMouseDown: f
 	};
 }
 //#endregion
 //#region src/composables/useHistory.ts
-function j(e, t) {
-	let n = s(() => {
+function F(e, t) {
+	let n = d(() => {
 		t.value;
 		let n = e.value;
-		return n ? g(n.state) > 0 : !1;
-	}), r = s(() => {
+		return n ? b(n.state) > 0 : !1;
+	}), r = d(() => {
 		t.value;
 		let n = e.value;
-		return n ? m(n.state) > 0 : !1;
+		return n ? v(n.state) > 0 : !1;
 	});
 	function i() {
 		let t = e.value;
-		return t ? h(t.state, t.dispatch) : !1;
+		return t ? y(t.state, t.dispatch) : !1;
 	}
 	function a() {
 		let t = e.value;
-		return t ? p(t.state, t.dispatch) : !1;
+		return t ? _(t.state, t.dispatch) : !1;
 	}
 	return {
 		canUndo: n,
@@ -144,14 +144,14 @@ function j(e, t) {
 }
 //#endregion
 //#region src/utils/selectionHighlight.ts
-var M = {
+var I = {
 	backgroundColor: "rgba(26, 115, 232, 0.3)",
 	borderRadius: 0,
 	zIndex: 0,
 	opacity: 1,
 	mixBlendMode: "multiply"
 };
-function N(e) {
+function L(e) {
 	let t = window.getSelection();
 	if (!t || t.rangeCount === 0 || t.isCollapsed) return [];
 	let n = t.getRangeAt(0);
@@ -170,7 +170,7 @@ function N(e) {
 	});
 	return a;
 }
-function P(e, t = 2) {
+function R(e, t = 2) {
 	if (e.length <= 1) return e;
 	let n = [...e].sort((e, n) => Math.abs(e.top - n.top) < t ? e.left - n.left : e.top - n.top), r = n[0];
 	if (!r) return e;
@@ -186,23 +186,23 @@ function P(e, t = 2) {
 	}
 	return i.push(a), i;
 }
-function F(e) {
-	return P(N(e));
+function z(e) {
+	return R(L(e));
 }
-function I() {
+function B() {
 	let e = window.getSelection();
 	return e !== null && !e.isCollapsed && e.rangeCount > 0;
 }
-function L(e) {
+function V(e) {
 	let t = window.getSelection();
 	return !t || t.rangeCount === 0 ? !1 : e.contains(t.getRangeAt(0).commonAncestorContainer);
 }
-var R = "docx-selection-styles", z = null;
-function B() {
-	z &&= (z.remove(), null), document.getElementById(R)?.remove();
+var H = "docx-selection-styles", U = null;
+function W() {
+	U &&= (U.remove(), null), document.getElementById(H)?.remove();
 }
-function V(e = M) {
-	B();
+function G(e = I) {
+	W();
 	let t = `
     /* DOCX Editor Selection Highlighting */
 
@@ -264,21 +264,21 @@ function V(e = M) {
       border-bottom: 2px dashed rgba(156, 39, 176, 0.6);
     }
   `;
-	z = document.createElement("style"), z.id = R, z.textContent = t, document.head.appendChild(z);
+	U = document.createElement("style"), U.id = H, U.textContent = t, document.head.appendChild(U);
 }
-function H() {
-	return z !== null || document.getElementById(R) !== null;
+function K() {
+	return U !== null || document.getElementById(H) !== null;
 }
 //#endregion
 //#region src/composables/useSelectionHighlight.ts
-function U() {
+function q() {
 	return window.getSelection()?.toString() ?? "";
 }
-function W(e) {
-	let { containerRef: t, enabled: n = !0, config: r = M, useOverlay: i = !1, debounceMs: a = 16, onSelectionChange: o } = e, u = d(!1), p = d(""), m = d([]), h = d(!1), g = null, _ = 0;
+function J(e) {
+	let { containerRef: t, enabled: n = !0, config: r = I, useOverlay: i = !1, debounceMs: a = 16, onSelectionChange: o } = e, s = h(!1), c = h(""), l = h([]), u = h(!1), m = null, _ = 0;
 	function v() {
-		let e = t.value, n = I(), r = U(), a = e ? L(e) : !1;
-		u.value = n, p.value = r, h.value = a, m.value = i && a && e ? F(e) : [], o?.(n && a, r);
+		let e = t.value, n = B(), r = q(), a = e ? V(e) : !1;
+		s.value = n, c.value = r, u.value = a, l.value = i && a && e ? z(e) : [], o?.(n && a, r);
 	}
 	function y() {
 		v();
@@ -286,8 +286,8 @@ function W(e) {
 	function b() {
 		let e = performance.now();
 		if (e - _ < a) {
-			g && clearTimeout(g), g = setTimeout(() => {
-				_ = performance.now(), v(), g = null;
+			m && clearTimeout(m), m = setTimeout(() => {
+				_ = performance.now(), v(), m = null;
 			}, a);
 			return;
 		}
@@ -306,23 +306,23 @@ function W(e) {
 		};
 		return r.borderRadius && (t.borderRadius = `${r.borderRadius}px`), r.borderColor && (t.border = `1px solid ${r.borderColor}`), t;
 	}
-	return l(() => {
-		n && (H() || V(r), document.addEventListener("selectionchange", b));
-	}), c(() => {
-		document.removeEventListener("selectionchange", b), g && clearTimeout(g);
-	}), f(t, () => v()), {
-		hasSelection: s(() => u.value),
-		selectedText: s(() => p.value),
-		highlightRects: s(() => m.value),
-		isSelectionInContainer: s(() => h.value),
+	return p(() => {
+		n && (K() || G(r), document.addEventListener("selectionchange", b));
+	}), f(() => {
+		document.removeEventListener("selectionchange", b), m && clearTimeout(m);
+	}), g(t, () => v()), {
+		hasSelection: d(() => s.value),
+		selectedText: d(() => c.value),
+		highlightRects: d(() => l.value),
+		isSelectionInContainer: d(() => u.value),
 		refresh: y,
 		getOverlayStyle: x
 	};
 }
 //#endregion
 //#region src/composables/useTableSelection.ts
-function G() {
-	let e = new S(), t = d(null), n = () => {
+function Y() {
+	let e = new E(), t = h(null), n = () => {
 		let n = e.getSnapshot();
 		t.value = n.tableIndex !== null && n.rowIndex !== null && n.columnIndex !== null ? {
 			tableIndex: n.tableIndex,
@@ -330,7 +330,7 @@ function G() {
 			columnIndex: n.columnIndex
 		} : null;
 	}, r = e.subscribe(n);
-	n(), u(r);
+	n(), m(r);
 	function i(t, n, r) {
 		e.selectCellCoordinates({
 			tableIndex: t,
@@ -339,7 +339,7 @@ function G() {
 		});
 	}
 	function a(t, n) {
-		let r = C(t, n);
+		let r = D(t, n);
 		if (!r) {
 			e.clearSelection();
 			return;
@@ -362,21 +362,21 @@ function G() {
 }
 //#endregion
 //#region src/composables/useVisualLineNavigation.ts
-function K(e) {
-	let t = w();
+function X(e) {
+	let t = O();
 	function n(t) {
 		let n = e.value;
-		return n ? D(n, t) : null;
+		return n ? j(n, t) : null;
 	}
 	function r(t) {
 		let n = e.value;
-		return n ? T(n, t) : null;
+		return n ? k(n, t) : null;
 	}
 	function i(e, t) {
-		return E(e, t);
+		return A(e, t);
 	}
 	function a(n, r) {
-		return O(t, n, r, e.value);
+		return M(t, n, r, e.value);
 	}
 	return {
 		state: t,
@@ -387,4 +387,4 @@ function K(e) {
 	};
 }
 //#endregion
-export { b as createSelectionFromDOM, r as extractTrackedChanges, x as getSelectionRuns, y as runsToClipboardContent, k as useClipboard, i as useDocxEditor, t as useDragAutoScroll, e as useFindReplace, A as useFixedDropdown, j as useHistory, W as useSelectionHighlight, n as useTableResize, G as useTableSelection, a as useTrackedChanges, K as useVisualLineNavigation, o as useWheelZoom, o as useZoom };
+export { c as colorModePlugin, w as createSelectionFromDOM, n as defaultColorMode, a as extractTrackedChanges, T as getSelectionRuns, i as provideColorMode, C as runsToClipboardContent, N as useClipboard, u as useColorMode, o as useDocxEditor, t as useDragAutoScroll, e as useFindReplace, P as useFixedDropdown, F as useHistory, J as useSelectionHighlight, r as useTableResize, Y as useTableSelection, s as useTrackedChanges, X as useVisualLineNavigation, l as useWheelZoom, l as useZoom };