slate-vue3 0.9.3 → 0.10.0

package/dist/core.js

@@ -1,4 +1,4 @@
-import { a6, a7, a8, d, e, f, a, h, aj, c, i, j, k, ap, ak, l, m, o, p, q, g, b, r, t, u, v, w, x, aq, y, a9, z, A, B, C, D, E, F, G, H, I, J, aa, K, ab, al, ac, L, M, N, O, n, P, S, Q, R, V, T, U, W, X, _, Y, Z, $, ad, am, ae, a0, an, ao, a5, s, af, a1, a2, a3, ag, ah, a4, ai } from "./create-editor-Dbw6QgKv.js";
+import { a6, a7, a8, d, e, f, a, h, aj, c, i, j, k, ap, ak, l, m, o, p, q, g, b, r, t, u, v, w, x, aq, y, a9, z, A, B, C, D, E, F, G, H, I, J, aa, K, ab, al, ac, L, M, N, O, n, P, S, Q, R, V, T, U, W, X, _, Y, Z, $, ad, am, ae, a0, an, ao, a5, s, af, a1, a2, a3, ag, ah, a4, ai } from "./create-editor-Dd3Wr7C9.js";
 import { E as E2, a as a10, I as I2, N as N2, O as O2, P as P2, b as b2, R as R2, S as S2, T as T2, c as c2, i as i2, d as d2 } from "./index-Bj4hXlPm.js";
 import { L as L2, S as S3 } from "./location-Ca0TF-GI.js";
 export {

package/dist/{create-editor-Dbw6QgKv.js → create-editor-Dd3Wr7C9.js}

@@ -40,13 +40,6 @@ const RangeRef = {
     }
   }
 };
-const DIRTY_PATHS = /* @__PURE__ */ new WeakMap();
-const DIRTY_PATH_KEYS = /* @__PURE__ */ new WeakMap();
-const FLUSHING = /* @__PURE__ */ new WeakMap();
-const NORMALIZING = /* @__PURE__ */ new WeakMap();
-const PATH_REFS = /* @__PURE__ */ new WeakMap();
-const POINT_REFS = /* @__PURE__ */ new WeakMap();
-const RANGE_REFS = /* @__PURE__ */ new WeakMap();
 const matchPath = (editor, path2) => {
   const [node2] = Editor.node(editor, path2);
   return (n) => n === node2;
@@ -299,6 +292,12 @@ const endsWithOddNumberOfRIs = (str) => {
     return numRIs % 2 === 1;
   }
 };
+const DIRTY_PATHS = /* @__PURE__ */ new WeakMap();
+const DIRTY_PATH_KEYS = /* @__PURE__ */ new WeakMap();
+const NORMALIZING = /* @__PURE__ */ new WeakMap();
+const PATH_REFS = /* @__PURE__ */ new WeakMap();
+const POINT_REFS = /* @__PURE__ */ new WeakMap();
+const RANGE_REFS = /* @__PURE__ */ new WeakMap();
 const BATCHING_DIRTY_PATHS = /* @__PURE__ */ new WeakMap();
 const isBatchingDirtyPaths = (editor) => {
   return BATCHING_DIRTY_PATHS.get(editor) || false;
@@ -366,14 +365,11 @@ const apply = (editor, op) => {
   if (op.type === "set_selection") {
     editor.marks = null;
   }
-  if (!FLUSHING.get(editor)) {
-    FLUSHING.set(editor, true);
-    Promise.resolve().then(() => {
-      FLUSHING.set(editor, false);
-      editor.onChange({ operation: op });
-      editor.operations = [];
-    });
-  }
+  editor.onImmediateChange({ operation: op });
+  Promise.resolve().then(() => {
+    editor.onChange({ operation: op });
+    editor.operations = [];
+  });
 };
 const getDirtyPaths = (editor, op) => {
   switch (op.type) {
@@ -587,9 +583,7 @@ const addMark = (editor, key, value) => {
         [key]: value
       };
       editor.marks = marks2;
-      if (!FLUSHING.get(editor)) {
-        editor.onChange();
-      }
+      editor.onChange();
     }
   }
 };
@@ -1288,7 +1282,7 @@ const removeMark = (editor, key) => {
       if (!Text.isText(node2)) {
         return false;
       }
-      const [parentNode, parentPath] = Editor.parent(editor, path2);
+      const [parentNode] = Editor.parent(editor, path2);
       return !editor.isVoid(parentNode) || editor.markableVoid(parentNode);
     };
     const expandedSelection = Range.isExpanded(selection);
@@ -1310,9 +1304,7 @@ const removeMark = (editor, key) => {
       const marks2 = { ...Editor.marks(editor) || {} };
       delete marks2[key];
       editor.marks = marks2;
-      if (!FLUSHING.get(editor)) {
-        editor.onChange();
-      }
+      editor.onChange();
     }
   }
 };
@@ -2481,6 +2473,8 @@ const createEditor = () => {
     markableVoid: () => false,
     onChange: () => {
     },
+    onImmediateChange: () => {
+    },
     // Core
     apply: (...args) => apply(editor, ...args),
     // Editor

package/dist/dom.js

@@ -1,5 +1,5 @@
-import { D as DOMEditor, E as EDITOR_TO_KEY_TO_ELEMENT, a as EDITOR_TO_USER_MARKS, g as getChunkTreeForNode, b as EDITOR_TO_USER_SELECTION, N as NODE_TO_KEY, i as isDOMText, c as getPlainText, d as getSlateFragmentAttribute, e as EDITOR_TO_ON_CHANGE } from "./hotkeys-D3-bttRz.js";
-import { C, O, P, Q, H, J, I, x, R, y, z, S, A, T, F, B, G, M, K, U, V, W, X, f, h, j, k, l, m, o, p, q, r, s, t, u, v, w, n, L } from "./hotkeys-D3-bttRz.js";
+import { D as DOMEditor, E as EDITOR_TO_KEY_TO_ELEMENT, a as EDITOR_TO_USER_MARKS, g as getChunkTreeForNode, b as EDITOR_TO_USER_SELECTION, N as NODE_TO_KEY, i as isDOMText, c as getPlainText, d as getSlateFragmentAttribute, e as EDITOR_TO_ON_CHANGE, f as EDITOR_TO_ON_IMMEDIATE_CHANGE } from "./hotkeys-BOpYjXBU.js";
+import { C, P, Q, R, H, K, I, y, S, z, A, T, B, U, G, F, J, O, L, V, W, X, Y, h, j, k, l, m, o, p, q, r, s, t, u, v, w, x, n, M } from "./hotkeys-BOpYjXBU.js";
 import { E as Editor, R as Range, a as Element, c as Transforms, N as Node, P as Path } from "./index-Bj4hXlPm.js";
 import "vue";
 const doRectsIntersect = (rect, compareRect) => {
@@ -47,7 +47,14 @@ const findCurrentLineRange = (editor, parentRange) => {
 };
 const withDOM = (editor, clipboardFormatKey = "x-slate-fragment") => {
   const e = editor;
-  const { apply, onChange, deleteBackward, addMark, removeMark } = e;
+  const {
+    apply,
+    onChange,
+    onImmediateChange,
+    deleteBackward,
+    addMark,
+    removeMark
+  } = e;
   EDITOR_TO_KEY_TO_ELEMENT.set(e, /* @__PURE__ */ new WeakMap());
   e.addMark = (key, value) => {
     EDITOR_TO_USER_MARKS.delete(e);
@@ -245,6 +252,13 @@ const withDOM = (editor, clipboardFormatKey = "x-slate-fragment") => {
     }
     onChange(options);
   };
+  e.onImmediateChange = (options) => {
+    const onContextImmediateChange = EDITOR_TO_ON_IMMEDIATE_CHANGE.get(e);
+    if (onContextImmediateChange) {
+      onContextImmediateChange(options);
+    }
+    onImmediateChange(options);
+  };
   return e;
 };
 const getMatches = (e, path) => {
@@ -340,53 +354,54 @@ const splitDecorationsByChild = (editor, node, decorations) => {
 export {
   C as CAN_USE_DOM,
   DOMEditor,
-  O as EDITOR_TO_ELEMENT,
+  P as EDITOR_TO_ELEMENT,
   EDITOR_TO_KEY_TO_ELEMENT,
   EDITOR_TO_ON_CHANGE,
+  EDITOR_TO_ON_IMMEDIATE_CHANGE,
   EDITOR_TO_USER_MARKS,
   EDITOR_TO_USER_SELECTION,
-  P as EDITOR_TO_WINDOW,
-  Q as ELEMENT_TO_NODE,
+  Q as EDITOR_TO_WINDOW,
+  R as ELEMENT_TO_NODE,
   H as HAS_BEFORE_INPUT_SUPPORT,
-  J as Hotkeys,
+  K as Hotkeys,
   I as IS_ANDROID,
-  x as IS_CHROME,
-  R as IS_COMPOSING,
-  y as IS_FIREFOX,
-  z as IS_FIREFOX_LEGACY,
-  S as IS_FOCUSED,
-  A as IS_IOS,
-  T as IS_READ_ONLY,
-  F as IS_UC_MOBILE,
-  B as IS_WEBKIT,
-  G as IS_WECHATBROWSER,
-  M as KEY_TO_CHUNK_TREE,
-  K as Key,
-  U as MARK_PLACEHOLDER_SYMBOL,
-  V as NODE_TO_ELEMENT,
-  W as NODE_TO_INDEX,
+  y as IS_CHROME,
+  S as IS_COMPOSING,
+  z as IS_FIREFOX,
+  A as IS_FIREFOX_LEGACY,
+  T as IS_FOCUSED,
+  B as IS_IOS,
+  U as IS_READ_ONLY,
+  G as IS_UC_MOBILE,
+  F as IS_WEBKIT,
+  J as IS_WECHATBROWSER,
+  O as KEY_TO_CHUNK_TREE,
+  L as Key,
+  V as MARK_PLACEHOLDER_SYMBOL,
+  W as NODE_TO_ELEMENT,
+  X as NODE_TO_INDEX,
   NODE_TO_KEY,
-  X as NODE_TO_PARENT,
-  f as applyStringDiff,
-  h as closestShadowAware,
-  j as containsShadowAware,
-  k as getActiveElement,
+  Y as NODE_TO_PARENT,
+  h as applyStringDiff,
+  j as closestShadowAware,
+  k as containsShadowAware,
+  l as getActiveElement,
   getChunkTreeForNode,
-  l as getDefaultView,
-  m as getSelection,
-  o as hasShadowRoot,
-  p as isAfter,
-  q as isBefore,
-  r as isDOMElement,
-  s as isDOMNode,
-  t as isDOMSelection,
+  m as getDefaultView,
+  o as getSelection,
+  p as hasShadowRoot,
+  q as isAfter,
+  r as isBefore,
+  s as isDOMElement,
+  t as isDOMNode,
+  u as isDOMSelection,
   isElementDecorationsEqual,
-  u as isPlainTextOnlyPaste,
+  v as isPlainTextOnlyPaste,
   isTextDecorationsEqual,
-  v as isTrackedMutation,
-  w as normalizeDOMPoint,
+  w as isTrackedMutation,
+  x as normalizeDOMPoint,
   n as normalizeStringDiff,
-  L as reconcileChildren,
+  M as reconcileChildren,
   splitDecorationsByChild,
   withDOM
 };

package/dist/{hotkeys-D3-bttRz.js → hotkeys-BOpYjXBU.js}

@@ -248,6 +248,7 @@ const IS_FOCUSED = /* @__PURE__ */ new WeakMap();
 const IS_COMPOSING = /* @__PURE__ */ new WeakMap();
 const EDITOR_TO_USER_SELECTION = /* @__PURE__ */ new WeakMap();
 const EDITOR_TO_ON_CHANGE = /* @__PURE__ */ new WeakMap();
+const EDITOR_TO_ON_IMMEDIATE_CHANGE = /* @__PURE__ */ new WeakMap();
 const EDITOR_TO_USER_MARKS = /* @__PURE__ */ new WeakMap();
 const MARK_PLACEHOLDER_SYMBOL = Symbol(
   "mark-placeholder"
@@ -1202,10 +1203,10 @@ class ChildrenHelper {
    * The index of the next node to be read in the children array
    */
   pointerIndex;
-  constructor(editor) {
+  constructor(editor, children) {
     this.editor = editor;
-    this.children = editor.children;
-    this.cachedKeys = new Array(editor.children.length);
+    this.children = children;
+    this.cachedKeys = new Array(children.length);
     this.pointerIndex = 0;
   }
   /**
@@ -1285,7 +1286,7 @@ class ChildrenHelper {
     return key;
   }
 }
-const reconcileChildren = (editor, {
+const reconcileChildren = (editor, children, {
   chunkTree,
   chunkSize,
   onInsert,
@@ -1294,7 +1295,7 @@ const reconcileChildren = (editor, {
   debug
 }) => {
   const chunkTreeHelper = new ChunkTreeHelper(chunkTree, { chunkSize, debug });
-  const childrenHelper = new ChildrenHelper(editor);
+  const childrenHelper = new ChildrenHelper(editor, children);
   let treeLeaf;
   while (treeLeaf = chunkTreeHelper.readLeaf()) {
     const lookAhead = childrenHelper.lookAhead(treeLeaf.node, treeLeaf.key);
@@ -1664,54 +1665,55 @@ const Hotkeys = {
   isUndo: create("undo")
 };
 export {
-  IS_IOS as A,
-  IS_WEBKIT as B,
+  IS_FIREFOX_LEGACY as A,
+  IS_IOS as B,
   CAN_USE_DOM as C,
   DOMEditor as D,
   EDITOR_TO_KEY_TO_ELEMENT as E,
-  IS_UC_MOBILE as F,
-  IS_WECHATBROWSER as G,
+  IS_WEBKIT as F,
+  IS_UC_MOBILE as G,
   HAS_BEFORE_INPUT_SUPPORT as H,
   IS_ANDROID as I,
-  Hotkeys as J,
-  Key as K,
-  reconcileChildren as L,
-  KEY_TO_CHUNK_TREE as M,
+  IS_WECHATBROWSER as J,
+  Hotkeys as K,
+  Key as L,
+  reconcileChildren as M,
   NODE_TO_KEY as N,
-  EDITOR_TO_ELEMENT as O,
-  EDITOR_TO_WINDOW as P,
-  ELEMENT_TO_NODE as Q,
-  IS_COMPOSING as R,
-  IS_FOCUSED as S,
-  IS_READ_ONLY as T,
-  MARK_PLACEHOLDER_SYMBOL as U,
-  NODE_TO_ELEMENT as V,
-  NODE_TO_INDEX as W,
-  NODE_TO_PARENT as X,
+  KEY_TO_CHUNK_TREE as O,
+  EDITOR_TO_ELEMENT as P,
+  EDITOR_TO_WINDOW as Q,
+  ELEMENT_TO_NODE as R,
+  IS_COMPOSING as S,
+  IS_FOCUSED as T,
+  IS_READ_ONLY as U,
+  MARK_PLACEHOLDER_SYMBOL as V,
+  NODE_TO_ELEMENT as W,
+  NODE_TO_INDEX as X,
+  NODE_TO_PARENT as Y,
   EDITOR_TO_USER_MARKS as a,
   EDITOR_TO_USER_SELECTION as b,
   getPlainText as c,
   getSlateFragmentAttribute as d,
   EDITOR_TO_ON_CHANGE as e,
-  applyStringDiff as f,
+  EDITOR_TO_ON_IMMEDIATE_CHANGE as f,
   getChunkTreeForNode as g,
-  closestShadowAware as h,
+  applyStringDiff as h,
   isDOMText as i,
-  containsShadowAware as j,
-  getActiveElement as k,
-  getDefaultView as l,
-  getSelection as m,
+  closestShadowAware as j,
+  containsShadowAware as k,
+  getActiveElement as l,
+  getDefaultView as m,
   normalizeStringDiff as n,
-  hasShadowRoot as o,
-  isAfter as p,
-  isBefore as q,
-  isDOMElement as r,
-  isDOMNode as s,
-  isDOMSelection as t,
-  isPlainTextOnlyPaste as u,
-  isTrackedMutation as v,
-  normalizeDOMPoint as w,
-  IS_CHROME as x,
-  IS_FIREFOX as y,
-  IS_FIREFOX_LEGACY as z
+  getSelection as o,
+  hasShadowRoot as p,
+  isAfter as q,
+  isBefore as r,
+  isDOMElement as s,
+  isDOMNode as t,
+  isDOMSelection as u,
+  isPlainTextOnlyPaste as v,
+  isTrackedMutation as w,
+  normalizeDOMPoint as x,
+  IS_CHROME as y,
+  IS_FIREFOX as z
 };

package/dist/hyperscript.js

@@ -1,5 +1,5 @@
 import { R as Range, N as Node, T as Text, a as Element, d as isObject } from "./index-Bj4hXlPm.js";
-import { c as createEditor$1 } from "./create-editor-Dbw6QgKv.js";
+import { c as createEditor$1 } from "./create-editor-Dd3Wr7C9.js";
 import "vue";
 import { t as toRawWeakMap } from "./index-Ban80MbP.js";
 const ANCHOR = new toRawWeakMap();

package/dist/index.js

@@ -1,8 +1,8 @@
-import { S as SLATE_USE_ELEMENT, u as useEditor, a as SLATE_USE_SELECTION } from "./use-focused-C1iTOdlV.js";
-import { e, h, D, c, f, g, d, E, b, i, j, k } from "./use-focused-C1iTOdlV.js";
+import { S as SLATE_USE_ELEMENT, u as useEditor, a as SLATE_USE_SELECTION } from "./use-focused-P2l4TlLn.js";
+import { e, h, D, c, f, g, d, E, b, i, j, k } from "./use-focused-P2l4TlLn.js";
 import { E as Editor, R as Range } from "./index-Bj4hXlPm.js";
 import { inject, computed } from "vue";
-import { D as DOMEditor } from "./hotkeys-D3-bttRz.js";
+import { D as DOMEditor } from "./hotkeys-BOpYjXBU.js";
 import { t } from "./index-Ban80MbP.js";
 const useElement = () => {
   const element = inject(SLATE_USE_ELEMENT);

package/dist/slate/interfaces/editor.d.ts

@@ -22,6 +22,9 @@ export interface BaseEditor {
         operation?: Operation;
         fallbackElement?: () => Element;
     }) => void;
+    onImmediateChange: (options?: {
+        operation?: Operation;
+    }) => void;
     onChange: (options?: {
         operation?: Operation;
     }) => void;

package/dist/slate/utils/weak-maps.d.ts

@@ -1,7 +1,6 @@
 import { Editor, Path, PathRef, PointRef, RangeRef } from '..';
 export declare const DIRTY_PATHS: WeakMap<Editor, Path[]>;
 export declare const DIRTY_PATH_KEYS: WeakMap<Editor, Set<string>>;
-export declare const FLUSHING: WeakMap<Editor, boolean>;
 export declare const NORMALIZING: WeakMap<Editor, boolean>;
 export declare const PATH_REFS: WeakMap<Editor, Set<PathRef>>;
 export declare const POINT_REFS: WeakMap<Editor, Set<PointRef>>;

package/dist/slate-dom/chunking/children-helper.d.ts

@@ -19,7 +19,7 @@ export declare class ChildrenHelper {
      * The index of the next node to be read in the children array
      */
     pointerIndex: number;
-    constructor(editor: DOMEditor);
+    constructor(editor: DOMEditor, children: Descendant[]);
     /**
      * Read a given number of nodes, advancing the pointer by that amount
      */

package/dist/slate-dom/chunking/reconcile-children.d.ts

@@ -14,4 +14,4 @@ export interface ReconcileOptions extends ChunkTreeHelperOptions {
  * Update the chunk tree to match the children array, inserting, removing and
  * updating differing nodes
  */
-export declare const reconcileChildren: (editor: DOMEditor, { chunkTree, chunkSize, onInsert, onUpdate, onIndexChange, debug, }: ReconcileOptions) => void;
+export declare const reconcileChildren: (editor: DOMEditor, children: Descendant[], { chunkTree, chunkSize, onInsert, onUpdate, onIndexChange, debug, }: ReconcileOptions) => void;

package/dist/slate-dom/index.d.ts

@@ -8,4 +8,4 @@ export { Hotkeys } from './utils/hotkeys';
 export { Key } from './utils/key';
 export { isElementDecorationsEqual, isTextDecorationsEqual, splitDecorationsByChild, } from './utils/range-list';
 export { getChunkTreeForNode, reconcileChildren, KEY_TO_CHUNK_TREE, type ChunkAncestor, type ChunkTree, type ChunkLeaf, type ChunkNode, type ChunkDescendant, type Chunk, type ReconcileOptions, } from './chunking';
-export { EDITOR_TO_ELEMENT, EDITOR_TO_KEY_TO_ELEMENT, EDITOR_TO_ON_CHANGE, EDITOR_TO_USER_MARKS, EDITOR_TO_USER_SELECTION, EDITOR_TO_WINDOW, ELEMENT_TO_NODE, IS_COMPOSING, IS_FOCUSED, IS_READ_ONLY, MARK_PLACEHOLDER_SYMBOL, NODE_TO_ELEMENT, NODE_TO_INDEX, NODE_TO_KEY, NODE_TO_PARENT, } from './utils/weak-maps';
+export { EDITOR_TO_ELEMENT, EDITOR_TO_KEY_TO_ELEMENT, EDITOR_TO_ON_CHANGE, EDITOR_TO_ON_IMMEDIATE_CHANGE, EDITOR_TO_USER_MARKS, EDITOR_TO_USER_SELECTION, EDITOR_TO_WINDOW, ELEMENT_TO_NODE, IS_COMPOSING, IS_FOCUSED, IS_READ_ONLY, MARK_PLACEHOLDER_SYMBOL, NODE_TO_ELEMENT, NODE_TO_INDEX, NODE_TO_KEY, NODE_TO_PARENT, } from './utils/weak-maps';

package/dist/slate-dom/utils/weak-maps.d.ts

@@ -33,5 +33,11 @@ export declare const EDITOR_TO_USER_SELECTION: WeakMap<Editor, RangeRef | null>;
 export declare const EDITOR_TO_ON_CHANGE: WeakMap<import('../../slate/index.ts').BaseEditor, (options?: {
     operation?: Operation;
 }) => void>;
+/**
+ * Weak map for trigger chunk tree reconciliation on immediate changes.
+ */
+export declare const EDITOR_TO_ON_IMMEDIATE_CHANGE: WeakMap<import('../../slate/index.ts').BaseEditor, (options?: {
+    operation?: Operation;
+}) => void>;
 export declare const EDITOR_TO_USER_MARKS: WeakMap<Editor, Partial<Text> | null>;
 export declare const MARK_PLACEHOLDER_SYMBOL: string;

package/dist/slate-vue/components/children.d.ts

@@ -5,8 +5,8 @@ import { VNode } from 'vue';
  */
 export declare const ChildrenComp: import('vue').DefineComponent<{
     element: Ancestor;
-}, () => VNode<import('vue').RendererNode, import('vue').RendererElement, {
+}, (() => import('vue').VNodeChild[]) | (() => VNode<import('vue').RendererNode, import('vue').RendererElement, {
     [key: string]: any;
-}> | import('vue').VNodeChild[], {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
+}>), {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
     element: Ancestor;
 }> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/slate-vue/hooks/use-render.d.ts

@@ -1,14 +1,19 @@
 import { ComputedRef, Ref, VNode } from 'vue';
 import { RenderElementProps, RenderPlaceholderProps, RenderLeafProps, RenderTextProps, RenderChunkProps } from '../utils/interface';
-import { BasePoint } from '../../slate/index.ts';
+import { BasePoint, DecoratedRange, NodeEntry } from '../../slate/index.ts';
 import { ChunkTree } from '../../slate-dom/index.ts';
 export declare const useRenderElement: () => (props: RenderElementProps) => VNode;
 export declare const useRenderLeaf: () => (props: RenderLeafProps) => VNode;
 export declare const useRenderPlaceholder: () => (props: RenderPlaceholderProps) => VNode;
 export declare const useRenderText: () => (props: RenderTextProps) => VNode;
 export declare const useRenderChunk: () => (props: RenderChunkProps) => VNode;
+/**
+ * Get the current `decorate` prop of the editable.
+ */
+export declare const useDecorate: () => ((entry: NodeEntry) => DecoratedRange[]);
 export declare const useChunkRoot: () => ChunkTree;
-export declare const useChangeEffect: (fn: () => void) => Ref<number, number>;
+export declare const useEditorVersion: () => Ref<number, number>;
+export declare const useEditorNodeVersion: () => Ref<number, number>;
 export declare const useMarkPlaceholder: () => ComputedRef<{
     anchor: BasePoint;
     focus: BasePoint;

package/dist/slate-vue/utils/constants.d.ts

@@ -11,7 +11,8 @@ export declare const SLATE_INNER_RENDER_TEXT: unique symbol;
 export declare const SLATE_INNER_RENDER_CHUNK: unique symbol;
 export declare const SLATE_INNER_STATIC_CHUNK_ROOT: unique symbol;
 export declare const SLATE_INNER_RENDER_DECORATE: unique symbol;
-export declare const SLATE_INNER_CHANGE_EFFECT_INJECT: unique symbol;
+export declare const SLATE_INNER_EDITOR_VERSION: unique symbol;
+export declare const SLATE_INNER_EDITOR_NODE_VERSION: unique symbol;
 export declare const SLATE_INNER_MARK_PLACEHOLDER: unique symbol;
 export declare const SLATE_INNER_PLACEHOLDER: unique symbol;
 export declare const SLATE_INNER_PLACEHOLDER_SHOW: unique symbol;

package/dist/{use-focused-C1iTOdlV.js → use-focused-P2l4TlLn.js}

@@ -1,6 +1,6 @@
-import { h, defineComponent, provide, ref, computed, onMounted, onUnmounted, renderSlot, inject, watch, renderList, onUpdated, useAttrs, reactive, toRaw } from "vue";
+import { h, defineComponent, provide, ref, computed, onMounted, onUnmounted, renderSlot, inject, renderList, watch, onUpdated, useAttrs, reactive, toRaw } from "vue";
 import { R as Range, N as Node, S as Scrubber, T as Text, P as Path, E as Editor, a as Element, c as Transforms } from "./index-Bj4hXlPm.js";
-import { I as IS_ANDROID, s as isDOMNode, D as DOMEditor, U as MARK_PLACEHOLDER_SYMBOL, e as EDITOR_TO_ON_CHANGE, y as IS_FIREFOX, B as IS_WEBKIT, E as EDITOR_TO_KEY_TO_ELEMENT, Q as ELEMENT_TO_NODE, V as NODE_TO_ELEMENT, W as NODE_TO_INDEX, X as NODE_TO_PARENT, g as getChunkTreeForNode, L as reconcileChildren, f as applyStringDiff, t as isDOMSelection, n as normalizeStringDiff, T as IS_READ_ONLY, l as getDefaultView, P as EDITOR_TO_WINDOW, O as EDITOR_TO_ELEMENT, H as HAS_BEFORE_INPUT_SUPPORT, C as CAN_USE_DOM, k as getActiveElement, m as getSelection, S as IS_FOCUSED, u as isPlainTextOnlyPaste, R as IS_COMPOSING, J as Hotkeys, x as IS_CHROME, z as IS_FIREFOX_LEGACY, A as IS_IOS, G as IS_WECHATBROWSER, F as IS_UC_MOBILE, a as EDITOR_TO_USER_MARKS, r as isDOMElement, b as EDITOR_TO_USER_SELECTION, j as containsShadowAware } from "./hotkeys-D3-bttRz.js";
+import { I as IS_ANDROID, t as isDOMNode, D as DOMEditor, V as MARK_PLACEHOLDER_SYMBOL, e as EDITOR_TO_ON_CHANGE, f as EDITOR_TO_ON_IMMEDIATE_CHANGE, z as IS_FIREFOX, F as IS_WEBKIT, E as EDITOR_TO_KEY_TO_ELEMENT, R as ELEMENT_TO_NODE, W as NODE_TO_ELEMENT, X as NODE_TO_INDEX, Y as NODE_TO_PARENT, g as getChunkTreeForNode, M as reconcileChildren, h as applyStringDiff, u as isDOMSelection, n as normalizeStringDiff, U as IS_READ_ONLY, m as getDefaultView, Q as EDITOR_TO_WINDOW, P as EDITOR_TO_ELEMENT, o as getSelection, H as HAS_BEFORE_INPUT_SUPPORT, C as CAN_USE_DOM, k as containsShadowAware, l as getActiveElement, T as IS_FOCUSED, v as isPlainTextOnlyPaste, S as IS_COMPOSING, K as Hotkeys, y as IS_CHROME, A as IS_FIREFOX_LEGACY, B as IS_IOS, J as IS_WECHATBROWSER, G as IS_UC_MOBILE, a as EDITOR_TO_USER_MARKS, s as isDOMElement, b as EDITOR_TO_USER_SELECTION } from "./hotkeys-BOpYjXBU.js";
 const SLATE_USE_EDITOR = Symbol("SLATE_USE_EDITOR");
 const SLATE_USE_ELEMENT = Symbol("SLATE_USE_ELEMENT");
 const SLATE_USE_FOCUSED = Symbol("SLATE_USE_FOCUSED");
@@ -20,8 +20,9 @@ const SLATE_INNER_STATIC_CHUNK_ROOT = Symbol(
 const SLATE_INNER_RENDER_DECORATE = Symbol(
   "SLATE_INNER_RENDER_DECORATE"
 );
-const SLATE_INNER_CHANGE_EFFECT_INJECT = Symbol(
-  "SLATE_INNER_CHANGE_EFFECT_INJECT"
+const SLATE_INNER_EDITOR_VERSION = Symbol("SLATE_INNER_EDITOR_VERSION");
+const SLATE_INNER_EDITOR_NODE_VERSION = Symbol(
+  "SLATE_INNER_EDITOR_NODE_VERSION"
 );
 const SLATE_INNER_MARK_PLACEHOLDER = Symbol(
   "SLATE_INNER_MARK_PLACEHOLDER"
@@ -255,8 +256,10 @@ const Slate = defineComponent({
     provide(SLATE_USE_READ_ONLY, ref(false));
     provide(SLATE_USE_SELECTION, selection);
     const focusCb = () => isFocus.value = DOMEditor.isFocused(editor);
-    const changeEffect = ref(0);
-    provide(SLATE_INNER_CHANGE_EFFECT_INJECT, changeEffect);
+    const editorVersion = ref(0);
+    const editorNodeVersion = ref(0);
+    provide(SLATE_INNER_EDITOR_VERSION, editorVersion);
+    provide(SLATE_INNER_EDITOR_NODE_VERSION, editorNodeVersion);
     const markPlaceholder = computed(() => {
       if (editor.selection && Range.isCollapsed(editor.selection) && editor.marks) {
         const anchor = editor.selection.anchor;
@@ -283,7 +286,7 @@ const Slate = defineComponent({
       document.addEventListener("focusout", focusCb);
       EDITOR_TO_ON_CHANGE.set(editor, (options) => {
         emit("change", options);
-        changeEffect.value++;
+        editorVersion.value++;
         switch (options?.operation?.type) {
           case "set_selection":
             emit("selectionchange", options);
@@ -292,6 +295,16 @@ const Slate = defineComponent({
             emit("valuechange", options);
         }
       });
+      EDITOR_TO_ON_IMMEDIATE_CHANGE.set(
+        editor,
+        (options) => {
+          const type = options?.operation?.type;
+          if (!type || ["set_selection", "insert_text", "remove_text"].includes(type)) {
+            return;
+          }
+          editorNodeVersion.value++;
+        }
+      );
     });
     onUnmounted(() => {
       document.removeEventListener("focusin", focusCb);
@@ -309,59 +322,6 @@ function direction(value) {
   const source = String(value || "");
   return rtl.test(source) ? "rtl" : ltr.test(source) ? "ltr" : "neutral";
 }
-const useDecorate = () => {
-  const decorate = inject(
-    SLATE_INNER_RENDER_DECORATE
-  );
-  if (decorate === void 0) {
-    throw new Error(
-      `The \`useDecorate\` hook must be used inside the <Slate> component's context.`
-    );
-  }
-  return decorate;
-};
-const useEditor = () => {
-  const editor = inject(SLATE_USE_EDITOR);
-  if (editor === void 0) {
-    throw new Error(
-      `The \`useEditor\` hook must be used inside the <Slate> component's context.`
-    );
-  }
-  return editor;
-};
-const StringComp = defineComponent({
-  name: "slate-string",
-  props: ["leaf", "text", "element", "isLast"],
-  setup(props) {
-    const { leaf, text, element, isLast } = props;
-    const editor = useEditor();
-    const getTextContent = computed(() => {
-      const text2 = leaf.text;
-      return (text2 ?? "") + (isLast && text2.at(-1) === "\n" ? "\n" : "");
-    });
-    const isLineBreak = computed(() => {
-      const pathParent = Path.parent(DOMEditor.findPath(editor, text));
-      return leaf.text === "" && element.children.at(-1) === text && !editor.isInline(element) && Editor.string(editor, pathParent) === "";
-    });
-    const zeroStringAttrs = computed(() => {
-      const length = Node.string(element).length || 0;
-      const isMarkPlaceholder = Boolean(leaf[MARK_PLACEHOLDER_SYMBOL]) || false;
-      const isVoidParent = editor.isVoid(element);
-      if (isVoidParent || isLineBreak.value || leaf.text === "") {
-        return {
-          "data-slate-zero-width": isLineBreak.value ? "n" : "z",
-          "data-slate-length": length,
-          "data-slate-mark-placeholder": isMarkPlaceholder ? true : void 0
-        };
-      }
-      return null;
-    });
-    return () => zeroStringAttrs.value ? h("span", zeroStringAttrs.value, [
-      !IS_ANDROID || !isLineBreak.value ? "\uFEFF" : null,
-      !IS_FIREFOX && isLineBreak.value ? h("br") : null
-    ]) : h("span", { "data-slate-string": true }, getTextContent.value);
-  }
-});
 const useRenderElement = () => {
   const ELEMENT_RENDER = inject(
     SLATE_INNER_RENDER_ELEMENT
@@ -417,6 +377,17 @@ const useRenderChunk = () => {
   }
   return CHUNK_RENDER;
 };
+const useDecorate = () => {
+  const decorate = inject(
+    SLATE_INNER_RENDER_DECORATE
+  );
+  if (decorate === void 0) {
+    throw new Error(
+      `The \`useDecorate\` hook must be used inside the <Slate> component's context.`
+    );
+  }
+  return decorate;
+};
 const useChunkRoot = () => {
   const CHUNK_STATIC_ROOT = inject(SLATE_INNER_STATIC_CHUNK_ROOT);
   if (CHUNK_STATIC_ROOT === void 0) {
@@ -426,17 +397,25 @@ const useChunkRoot = () => {
   }
   return CHUNK_STATIC_ROOT;
 };
-const useChangeEffect = (fn) => {
-  const CHANGE_EFFECT_INJECT = inject(
-    SLATE_INNER_CHANGE_EFFECT_INJECT
+const useEditorVersion = () => {
+  const EDITOR_VERSION = inject(SLATE_INNER_EDITOR_VERSION);
+  if (EDITOR_VERSION === void 0) {
+    throw new Error(
+      `The \`useEditorVersion\` hook must be used inside the <Slate> component's context.`
+    );
+  }
+  return EDITOR_VERSION;
+};
+const useEditorNodeVersion = () => {
+  const EDITOR_NODE_VERSION = inject(
+    SLATE_INNER_EDITOR_NODE_VERSION
   );
-  if (CHANGE_EFFECT_INJECT === void 0) {
+  if (EDITOR_NODE_VERSION === void 0) {
     throw new Error(
-      `The \`useChangeEffect\` hook must be used inside the <Slate> component's context.`
+      `The \`useEditorNodeVersion\` hook must be used inside the <Slate> component's context.`
     );
   }
-  watch(() => CHANGE_EFFECT_INJECT.value, fn);
-  return CHANGE_EFFECT_INJECT;
+  return EDITOR_NODE_VERSION;
 };
 const useMarkPlaceholder = () => {
   const MARK_PLACEHOLDER_INJECT = inject(SLATE_INNER_MARK_PLACEHOLDER);
@@ -480,6 +459,48 @@ const usePlaceholderResize = () => {
   }
   return PLACEHOLDER_RESIZE_INJECT;
 };
+const useEditor = () => {
+  const editor = inject(SLATE_USE_EDITOR);
+  if (editor === void 0) {
+    throw new Error(
+      `The \`useEditor\` hook must be used inside the <Slate> component's context.`
+    );
+  }
+  return editor;
+};
+const StringComp = defineComponent({
+  name: "slate-string",
+  props: ["leaf", "text", "element", "isLast"],
+  setup(props) {
+    const { leaf, text, element, isLast } = props;
+    const editor = useEditor();
+    const getTextContent = computed(() => {
+      const text2 = leaf.text;
+      return (text2 ?? "") + (isLast && text2.at(-1) === "\n" ? "\n" : "");
+    });
+    const isLineBreak = computed(() => {
+      const pathParent = Path.parent(DOMEditor.findPath(editor, text));
+      return leaf.text === "" && element.children.at(-1) === text && !editor.isInline(element) && Editor.string(editor, pathParent) === "";
+    });
+    const zeroStringAttrs = computed(() => {
+      const length = Node.string(element).length || 0;
+      const isMarkPlaceholder = Boolean(leaf[MARK_PLACEHOLDER_SYMBOL]) || false;
+      const isVoidParent = editor.isVoid(element);
+      if (isVoidParent || isLineBreak.value || leaf.text === "") {
+        return {
+          "data-slate-zero-width": isLineBreak.value ? "n" : "z",
+          "data-slate-length": length,
+          "data-slate-mark-placeholder": isMarkPlaceholder ? true : void 0
+        };
+      }
+      return null;
+    });
+    return () => zeroStringAttrs.value ? h("span", zeroStringAttrs.value, [
+      !IS_ANDROID || !isLineBreak.value ? "\uFEFF" : null,
+      !IS_FIREFOX && isLineBreak.value ? h("br") : null
+    ]) : h("span", { "data-slate-string": true }, getTextContent.value);
+  }
+});
 const style = {
   position: "absolute",
   top: 0,
@@ -747,56 +768,52 @@ const ChildrenComp = defineComponent({
   setup(props) {
     const editor = useEditor();
     const element = props.element;
-    const isBlock = computed(
-      () => !Editor.isEditor(element) && Element.isElement(element) && !editor.isInline(element)
-    );
-    const chunkSize = computed(
-      () => Editor.hasInlines(editor, element) ? null : editor.getChunkSize(element)
-    );
-    const cacheTree = getChunkTreeForNode(editor, props.element);
-    const chunkTree = computed(() => {
-      if (!chunkSize.value) {
-        return null;
-      }
-      reconcileChildren(editor, {
-        chunkTree: cacheTree,
-        chunkSize: chunkSize.value,
-        onInsert: (n2, i) => {
-          NODE_TO_INDEX.set(n2, i);
-          NODE_TO_PARENT.set(n2, element);
-        },
-        onUpdate: (n2, i) => {
-          NODE_TO_INDEX.set(n2, i);
-          NODE_TO_PARENT.set(n2, element);
-        },
-        onIndexChange: (n2, i) => {
-          NODE_TO_INDEX.set(n2, i);
-        }
-      });
-      return cacheTree;
-    });
-    provide(SLATE_INNER_STATIC_CHUNK_ROOT, cacheTree);
-    return () => {
-      if (chunkSize.value === null || isBlock.value) {
-        return renderList(element.children, (n2, i) => {
-          NODE_TO_INDEX.set(n2, i);
-          NODE_TO_PARENT.set(n2, element);
-          const key = DOMEditor.findKey(editor, n2);
-          return Text.isText(n2) ? h(TextComp, {
-            text: n2,
-            element,
-            key: key.id
-          }) : h(ElementComp, {
-            element: n2,
-            key: key.id
-          });
+    const isBlock = !Editor.isEditor(element) && Element.isElement(element) && !editor.isInline(element);
+    const chunkSize = Editor.hasInlines(editor, element) ? null : editor.getChunkSize(element);
+    if (isBlock || chunkSize === null) {
+      return () => renderList(element.children, (n2, i) => {
+        NODE_TO_INDEX.set(n2, i);
+        NODE_TO_PARENT.set(n2, element);
+        const key = DOMEditor.findKey(editor, n2);
+        return Text.isText(n2) ? h(TextComp, {
+          text: n2,
+          element,
+          key: key.id
+        }) : h(ElementComp, {
+          element: n2,
+          key: key.id
         });
-      } else {
-        return h(ChunkComp, {
-          ancestor: chunkTree.value
+      });
+    }
+    const cacheTree = getChunkTreeForNode(editor, props.element);
+    const editorNodeVersion = useEditorNodeVersion();
+    watch(
+      editorNodeVersion,
+      () => {
+        reconcileChildren(editor, element.children, {
+          chunkTree: cacheTree,
+          chunkSize,
+          onInsert: (n2, i) => {
+            NODE_TO_INDEX.set(n2, i);
+            NODE_TO_PARENT.set(n2, element);
+          },
+          onUpdate: (n2, i) => {
+            NODE_TO_INDEX.set(n2, i);
+            NODE_TO_PARENT.set(n2, element);
+          },
+          onIndexChange: (n2, i) => {
+            NODE_TO_INDEX.set(n2, i);
+          }
         });
+      },
+      {
+        immediate: true
       }
-    };
+    );
+    provide(SLATE_INNER_STATIC_CHUNK_ROOT, cacheTree);
+    return () => h(ChunkComp, {
+      ancestor: cacheTree
+    });
   }
 });
 const useComposing = () => {
@@ -1293,16 +1310,20 @@ const Editable = defineComponent({
       }
       return newDomRange;
     };
-    useChangeEffect(() => {
-      const root = DOMEditor.findDocumentOrShadowRoot(editor);
-      const domSelection = getSelection(root);
-      if (!domSelection || !DOMEditor.isFocused(editor)) {
-        return;
-      }
-      if (domSelection.rangeCount <= 1) {
-        setDomSelection();
+    const editorVersion = useEditorVersion();
+    watch(
+      () => editorVersion.value,
+      () => {
+        const root = DOMEditor.findDocumentOrShadowRoot(editor);
+        const domSelection = getSelection(root);
+        if (!domSelection || !DOMEditor.isFocused(editor)) {
+          return;
+        }
+        if (domSelection.rangeCount <= 1) {
+          setDomSelection();
+        }
       }
-    });
+    );
     const stoppedDragging = () => state.isDraggingInternally = false;
     onMounted(() => {
       const window2 = DOMEditor.getWindow(editor);

package/dist/yjs.js

@@ -2,8 +2,8 @@ import { d as isObject, T as Text, N as Node, P as Path, E as Editor, c as Trans
 import { ref, onMounted, onUnmounted, watch, onUpdated, computed } from "vue";
 import { XmlText, YTextEvent, createRelativePositionFromTypeIndex, createAbsolutePositionFromRelativePosition, createRelativePositionFromJSON, decodeRelativePosition, encodeRelativePosition, UndoManager, compareRelativePositions } from "yjs";
 import { L as Location } from "./location-Ca0TF-GI.js";
-import { u as useEditor, j as useFocused } from "./use-focused-C1iTOdlV.js";
-import { D as DOMEditor } from "./hotkeys-D3-bttRz.js";
+import { u as useEditor, j as useFocused } from "./use-focused-P2l4TlLn.js";
+import { D as DOMEditor } from "./hotkeys-BOpYjXBU.js";
 function deepEquals(node, another) {
   for (const key in node) {
     const a = node[key];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "slate-vue3",
-  "version": "0.9.3",
+  "version": "0.10.0",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -79,14 +79,14 @@
     "@actions/core": "^1.11.1",
     "@eslint/js": "^9.39.1",
     "@faker-js/faker": "^10.1.0",
-    "@liveblocks/client": "^3.10.0",
-    "@liveblocks/yjs": "^3.10.0",
+    "@liveblocks/client": "^3.10.1",
+    "@liveblocks/yjs": "^3.10.1",
     "@playwright/test": "^1.56.1",
     "@testing-library/vue": "^8.1.0",
     "@types/is-hotkey": "^0.1.10",
     "@types/is-url": "^1.2.32",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "^24.10.0",
+    "@types/node": "^24.10.1",
     "@types/prismjs": "^1.26.5",
     "@vitejs/plugin-vue": "^6.0.1",
     "@vue/eslint-config-prettier": "^10.2.0",
@@ -98,20 +98,20 @@
     "image-extensions": "^1.1.0",
     "is-url": "^1.2.4",
     "jiti": "^2.6.1",
-    "jsdom": "^27.1.0",
+    "jsdom": "^27.2.0",
     "lint-staged": "^16.2.6",
     "prismjs": "^1.30.0",
     "remark-gfm": "^4.0.1",
     "remark-parse": "^11.0.0",
     "remark-slate-transformer": "^0.9.0",
     "typescript": "~5.9.3",
-    "typescript-eslint": "^8.46.3",
+    "typescript-eslint": "^8.46.4",
     "unified": "^11.0.5",
     "vite": "^7.2.2",
     "vite-plugin-babel": "^1.3.2",
     "vite-plugin-dts": "^4.5.4",
     "vite-plugin-eslint": "^1.8.1",
-    "vitest": "^4.0.8",
+    "vitest": "^4.0.9",
     "vue-router": "^4.6.3",
     "yjs": "^13.6.27"
   },

package/dist/slate-vue/hooks/use-decorate.d.ts

@@ -1,5 +0,0 @@
-import { DecoratedRange, NodeEntry } from '../../slate/index.ts';
-/**
- * Get the current `decorate` prop of the editable.
- */
-export declare const useDecorate: () => ((entry: NodeEntry) => DecoratedRange[]);