slate-vue3 0.0.22 → 0.0.24

package/README.md

@@ -8,19 +8,21 @@
 # How to use?
 
 ## 1. install slate-vue3
-```
+```sh
 npm install slate-vue3
 ```
 ## 2. now, you can use it in vue-sfc
-```
+```vue
 <script setup lang="ts">
 import { withDOM, Slate, Editable, defaultRenderLeaf, defaultRenderPlaceHolder, createEditor, withHistory } from "slate-vue3"
 import { h } from "vue";
 
-const initialValue = [{
-  type: 'paragraph',
-  children: [{ text: 'Let's start' }]
-}]
+const initialValue = [
+  {
+    type: 'paragraph',
+    children: [{ text: 'Let us start'}]
+  }
+]
 const renderElement = ({ attributes, children }) => h('p', attributes, children)
 const editor = withHistory(withDOM(createEditor(initialValue)))
 </script>
@@ -45,7 +47,7 @@ const editor = withHistory(withDOM(createEditor(initialValue)))
 > Get the current composing state of the editor. It deals with compositionstart, compositionupdate, compositionend events.
 
 const useComposing : ( ) => Ref<boolean>
-```
+```javascript
 import { useComposing } from 'slate-vue3'
 
 const composing = useComposing()
@@ -55,7 +57,7 @@ const composing = useComposing()
 > Get the current focused state of the editor.
 
 const useFocused : ( ) => Ref<boolean>
-```
+```javascript
 import { useFocused } from 'slate-vue3'
 
 const focused = useFocused()
@@ -65,7 +67,7 @@ const focused = useFocused()
 > Get the current readOnly state of the editor.
 
 const useReadOnly : ( ) => Ref<boolean>
-```
+```javascript
 import { useReadOnly } from 'slate-vue3'
 
 const readonly = useReadOnly()
@@ -75,7 +77,7 @@ const readonly = useReadOnly()
 > Get the current selected state of an element.
 
 const useSelected : ( ) => ComputedRef<boolean>
-```
+```javascript
 import { useSelected } from 'slate-vue3'
 
 const selected = useSelected()
@@ -85,7 +87,7 @@ const selected = useSelected()
 > Get the current editor object from the context. Context whenever changes occur in the editor.
 
 const useEditor : ( ) => Editor
-```
+```javascript
 import { useEditor } from 'slate-vue3'
 
 const editor = useEditor()
@@ -95,7 +97,7 @@ const editor = useEditor()
 > Get the current editor selection from the context.
 
 const useSelection : ( ) => ComputedRef<Selection>
-```
+```javascript
 import { useSelection } from 'slate-vue3'
 
 const selection = useSelection()
@@ -106,7 +108,7 @@ const selection = useSelection()
 > Automatically bind ref to the real node when the component is mounted，This is important when rendering element nodes directly
 
 const useInheritRef : ( attribute: HTMLAttributes ) => HTMLAttributes
-```
+```javascript
 const renderElement = (props: RenderElementProps) => {
   const { attributes, children, element } = props
   switch (element.type) {

package/dist/index.d.ts

@@ -321,9 +321,6 @@ export declare type Descendant = Element_2 | Text_2;
 
 export declare const deselect: SelectionTransforms['deselect'];
 
-/**
- * A DOM-specific version of the `Editor` interface.
- */
 export declare interface DOMEditor extends BaseEditor {
     hasEditableTarget: (editor: DOMEditor, target: EventTarget | null) => target is DOMNode_2;
     hasRange: (editor: DOMEditor, range: Range_2) => boolean;
@@ -333,7 +330,7 @@ export declare interface DOMEditor extends BaseEditor {
     insertFragmentData: (data: DataTransfer) => boolean;
     insertTextData: (data: DataTransfer) => boolean;
     isTargetInsideNonReadonlyVoid: (editor: DOMEditor, target: EventTarget | null) => boolean;
-    setFragmentData: (data: DataTransfer, originEvent?: 'drag' | 'copy' | 'cut') => void;
+    setFragmentData: (data: DataTransfer, originEvent?: "drag" | "copy" | "cut") => void;
 }
 
 export declare const DOMEditor: DOMEditorInterface;
@@ -432,7 +429,7 @@ export declare interface DOMEditorInterface {
     /**
      * Sets data from the currently selected fragment on a `DataTransfer`.
      */
-    setFragmentData: (editor: DOMEditor, data: DataTransfer, originEvent?: 'drag' | 'copy' | 'cut') => void;
+    setFragmentData: (editor: DOMEditor, data: DataTransfer, originEvent?: "drag" | "copy" | "cut") => void;
     /**
      * Find the native DOM element from a Slate node.
      */
@@ -464,7 +461,7 @@ export declare interface DOMEditorInterface {
          * The direction to search for Slate leaf nodes if `domPoint` is
          * non-editable and non-void.
          */
-        searchDirection?: 'forward' | 'backward';
+        searchDirection?: "forward" | "backward";
     }) => T extends true ? Point | null : Point;
     /**
      * Find a Slate range from a DOM range or selection.

package/dist/index.js

@@ -857,44 +857,10 @@ function baseToString(value) {
   var result = value + "";
   return result == "0" && 1 / value == -Infinity ? "-0" : result;
 }
-var reWhitespace = /\s/;
-function trimmedEndIndex(string2) {
-  var index = string2.length;
-  while (index-- && reWhitespace.test(string2.charAt(index))) {
-  }
-  return index;
-}
-var reTrimStart = /^\s+/;
-function baseTrim(string2) {
-  return string2 ? string2.slice(0, trimmedEndIndex(string2) + 1).replace(reTrimStart, "") : string2;
-}
 function isObject(value) {
   var type = typeof value;
   return value != null && (type == "object" || type == "function");
 }
-var NAN = 0 / 0;
-var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
-var reIsBinary = /^0b[01]+$/i;
-var reIsOctal = /^0o[0-7]+$/i;
-var freeParseInt = parseInt;
-function toNumber(value) {
-  if (typeof value == "number") {
-    return value;
-  }
-  if (isSymbol(value)) {
-    return NAN;
-  }
-  if (isObject(value)) {
-    var other = typeof value.valueOf == "function" ? value.valueOf() : value;
-    value = isObject(other) ? other + "" : other;
-  }
-  if (typeof value != "string") {
-    return value === 0 ? value : +value;
-  }
-  value = baseTrim(value);
-  var isBinary = reIsBinary.test(value);
-  return isBinary || reIsOctal.test(value) ? freeParseInt(value.slice(2), isBinary ? 2 : 8) : reIsBadHex.test(value) ? NAN : +value;
-}
 function identity(value) {
   return value;
 }
@@ -1086,11 +1052,11 @@ function copyObject(source, props, object, customizer) {
   }
   return object;
 }
-var nativeMax$1 = Math.max;
+var nativeMax = Math.max;
 function overRest(func, start2, transform) {
-  start2 = nativeMax$1(start2 === void 0 ? func.length - 1 : start2, 0);
+  start2 = nativeMax(start2 === void 0 ? func.length - 1 : start2, 0);
   return function() {
-    var args = arguments, index = -1, length = nativeMax$1(args.length - start2, 0), array = Array(length);
+    var args = arguments, index = -1, length = nativeMax(args.length - start2, 0), array = Array(length);
     while (++index < length) {
       array[index] = args[start2 + index];
     }
@@ -1400,10 +1366,10 @@ MapCache.prototype["delete"] = mapCacheDelete;
 MapCache.prototype.get = mapCacheGet;
 MapCache.prototype.has = mapCacheHas;
 MapCache.prototype.set = mapCacheSet;
-var FUNC_ERROR_TEXT$2 = "Expected a function";
+var FUNC_ERROR_TEXT = "Expected a function";
 function memoize(func, resolver) {
   if (typeof func != "function" || resolver != null && typeof resolver != "function") {
-    throw new TypeError(FUNC_ERROR_TEXT$2);
+    throw new TypeError(FUNC_ERROR_TEXT);
   }
   var memoized = function() {
     var args = arguments, key = resolver ? resolver.apply(this, args) : args[0], cache = memoized.cache;
@@ -1822,92 +1788,6 @@ var CLONE_DEEP_FLAG$1 = 1, CLONE_SYMBOLS_FLAG$1 = 4;
 function cloneDeep(value) {
   return baseClone(value, CLONE_DEEP_FLAG$1 | CLONE_SYMBOLS_FLAG$1);
 }
-var now = function() {
-  return root.Date.now();
-};
-var FUNC_ERROR_TEXT$1 = "Expected a function";
-var nativeMax = Math.max, nativeMin = Math.min;
-function debounce(func, wait, options) {
-  var lastArgs, lastThis, maxWait, result, timerId, lastCallTime, lastInvokeTime = 0, leading = false, maxing = false, trailing = true;
-  if (typeof func != "function") {
-    throw new TypeError(FUNC_ERROR_TEXT$1);
-  }
-  wait = toNumber(wait) || 0;
-  if (isObject(options)) {
-    leading = !!options.leading;
-    maxing = "maxWait" in options;
-    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
-    trailing = "trailing" in options ? !!options.trailing : trailing;
-  }
-  function invokeFunc(time) {
-    var args = lastArgs, thisArg = lastThis;
-    lastArgs = lastThis = void 0;
-    lastInvokeTime = time;
-    result = func.apply(thisArg, args);
-    return result;
-  }
-  function leadingEdge(time) {
-    lastInvokeTime = time;
-    timerId = setTimeout(timerExpired, wait);
-    return leading ? invokeFunc(time) : result;
-  }
-  function remainingWait(time) {
-    var timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime, timeWaiting = wait - timeSinceLastCall;
-    return maxing ? nativeMin(timeWaiting, maxWait - timeSinceLastInvoke) : timeWaiting;
-  }
-  function shouldInvoke(time) {
-    var timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime;
-    return lastCallTime === void 0 || timeSinceLastCall >= wait || timeSinceLastCall < 0 || maxing && timeSinceLastInvoke >= maxWait;
-  }
-  function timerExpired() {
-    var time = now();
-    if (shouldInvoke(time)) {
-      return trailingEdge(time);
-    }
-    timerId = setTimeout(timerExpired, remainingWait(time));
-  }
-  function trailingEdge(time) {
-    timerId = void 0;
-    if (trailing && lastArgs) {
-      return invokeFunc(time);
-    }
-    lastArgs = lastThis = void 0;
-    return result;
-  }
-  function cancel() {
-    if (timerId !== void 0) {
-      clearTimeout(timerId);
-    }
-    lastInvokeTime = 0;
-    lastArgs = lastCallTime = lastThis = timerId = void 0;
-  }
-  function flush() {
-    return timerId === void 0 ? result : trailingEdge(now());
-  }
-  function debounced() {
-    var time = now(), isInvoking = shouldInvoke(time);
-    lastArgs = arguments;
-    lastThis = this;
-    lastCallTime = time;
-    if (isInvoking) {
-      if (timerId === void 0) {
-        return leadingEdge(lastCallTime);
-      }
-      if (maxing) {
-        clearTimeout(timerId);
-        timerId = setTimeout(timerExpired, wait);
-        return invokeFunc(lastCallTime);
-      }
-    }
-    if (timerId === void 0) {
-      timerId = setTimeout(timerExpired, wait);
-    }
-    return result;
-  }
-  debounced.cancel = cancel;
-  debounced.flush = flush;
-  return debounced;
-}
 function last$1(array) {
   var length = array == null ? 0 : array.length;
   return length ? array[length - 1] : void 0;
@@ -1945,22 +1825,6 @@ var omit = flatRest(function(object, paths) {
   }
   return result;
 });
-var FUNC_ERROR_TEXT = "Expected a function";
-function throttle(func, wait, options) {
-  var leading = true, trailing = true;
-  if (typeof func != "function") {
-    throw new TypeError(FUNC_ERROR_TEXT);
-  }
-  if (isObject(options)) {
-    leading = "leading" in options ? !!options.leading : leading;
-    trailing = "trailing" in options ? !!options.trailing : trailing;
-  }
-  return debounce(func, wait, {
-    "leading": leading,
-    "maxWait": wait,
-    "trailing": trailing
-  });
-}
 const isElement = (value) => {
   return isPlainObject$1(value) && Node.isNodeList(value.children) && !Editor.isEditor(value);
 };
@@ -5477,6 +5341,19 @@ const PLACEHOLDER_SYMBOL = Symbol("placeholder");
 const MARK_PLACEHOLDER_SYMBOL = Symbol(
   "mark-placeholder"
 );
+function getFirefoxNodeEl(node2, offset) {
+  var _a2;
+  if (node2.nodeType !== 3 || node2.textContent !== "") {
+    return [node2, offset];
+  } else {
+    const isLeft = node2.previousSibling === null;
+    let el = node2[isLeft ? "nextSibling" : "previousSibling"];
+    while (el == null ? void 0 : el.firstChild) {
+      el = isLeft ? el.firstChild : el.lastChild;
+    }
+    return [el || node2, isLeft ? 0 : ((_a2 = el == null ? void 0 : el.textContent) == null ? void 0 : _a2.length) || 0];
+  }
+}
 const DOMEditor = {
   androidPendingDiffs: (editor) => EDITOR_TO_PENDING_DIFFS.get(editor),
   androidScheduleFlush: (editor) => {
@@ -5516,7 +5393,9 @@ const DOMEditor = {
     }
     const { clientX: x, clientY: y, target } = event;
     if (x == null || y == null) {
-      throw new Error(`Cannot resolve a Slate range from a DOM event: ${event}`);
+      throw new Error(
+        `Cannot resolve a Slate range from a DOM event: ${event}`
+      );
     }
     const node2 = DOMEditor.toSlateNode(editor, event.target);
     const path2 = DOMEditor.findPath(editor, node2);
@@ -5545,7 +5424,9 @@ const DOMEditor = {
       }
     }
     if (!domRange) {
-      throw new Error(`Cannot resolve a Slate range from a DOM event: ${event}`);
+      throw new Error(
+        `Cannot resolve a Slate range from a DOM event: ${event}`
+      );
     }
     const range2 = DOMEditor.toSlateRange(editor, domRange, {
       exactMatch: false,
@@ -5881,7 +5762,7 @@ const DOMEditor = {
     return { path: path2, offset };
   },
   toSlateRange: (editor, domRange, options) => {
-    var _a2, _b2, _c;
+    var _a2;
     const { exactMatch, suppressThrow } = options;
     const el = isDOMSelection(domRange) ? domRange.anchorNode : domRange.startContainer;
     let anchorNode;
@@ -5891,59 +5772,13 @@ const DOMEditor = {
     let isCollapsed;
     if (el) {
       if (isDOMSelection(domRange)) {
-        if (IS_FIREFOX && domRange.rangeCount > 1) {
-          focusNode = domRange.focusNode;
-          const firstRange = domRange.getRangeAt(0);
-          const lastRange = domRange.getRangeAt(domRange.rangeCount - 1);
-          if (focusNode instanceof HTMLTableRowElement && firstRange.startContainer instanceof HTMLTableRowElement && lastRange.startContainer instanceof HTMLTableRowElement) {
-            let getLastChildren = function(element) {
-              if (element.childElementCount > 0) {
-                return getLastChildren(element.children[0]);
-              } else {
-                return element;
-              }
-            };
-            const firstNodeRow = firstRange.startContainer;
-            const lastNodeRow = lastRange.startContainer;
-            const firstNode = getLastChildren(
-              firstNodeRow.children[firstRange.startOffset]
-            );
-            const lastNode = getLastChildren(
-              lastNodeRow.children[lastRange.startOffset]
-            );
-            focusOffset = 0;
-            if (lastNode.childNodes.length > 0) {
-              anchorNode = lastNode.childNodes[0];
-            } else {
-              anchorNode = lastNode;
-            }
-            if (firstNode.childNodes.length > 0) {
-              focusNode = firstNode.childNodes[0];
-            } else {
-              focusNode = firstNode;
-            }
-            if (lastNode instanceof HTMLElement) {
-              anchorOffset = lastNode.innerHTML.length;
-            } else {
-              anchorOffset = 0;
-            }
-          } else {
-            if (firstRange.startContainer === focusNode) {
-              anchorNode = lastRange.endContainer;
-              anchorOffset = lastRange.endOffset;
-              focusOffset = firstRange.startOffset;
-            } else {
-              anchorNode = firstRange.startContainer;
-              anchorOffset = firstRange.endOffset;
-              focusOffset = lastRange.startOffset;
-            }
-          }
-        } else {
-          anchorNode = domRange.anchorNode;
-          anchorOffset = domRange.anchorOffset;
-          focusNode = domRange.focusNode;
-          focusOffset = domRange.focusOffset;
-          if (IS_FIREFOX && ((_a2 = domRange.anchorNode) == null ? void 0 : _a2.role) === "textbox" && ((_b2 = domRange.focusNode) == null ? void 0 : _b2.role) === "textbox") {
+        anchorNode = domRange.anchorNode;
+        anchorOffset = domRange.anchorOffset;
+        focusNode = domRange.focusNode;
+        focusOffset = domRange.focusOffset;
+        if (IS_FIREFOX) {
+          const attributes = anchorNode instanceof HTMLElement ? anchorNode.attributes : null;
+          if (attributes && attributes.getNamedItem("data-slate-editor")) {
             while (anchorNode == null ? void 0 : anchorNode.firstElementChild) {
               anchorNode = anchorNode.firstElementChild;
             }
@@ -5951,10 +5786,25 @@ const DOMEditor = {
               focusNode = focusNode.lastElementChild;
             }
             anchorNode = anchorNode.firstChild;
+            anchorOffset = 0;
             focusNode = focusNode.lastChild;
             focusOffset = focusNode.length;
+          } else {
+            if (anchorNode) {
+              const [el2, offset] = getFirefoxNodeEl(anchorNode, anchorOffset);
+              anchorNode = el2;
+              anchorOffset = offset;
+            }
+            if (focusNode) {
+              const [el2, offset] = getFirefoxNodeEl(focusNode, focusOffset);
+              focusNode = el2;
+              focusOffset = offset;
+            }
           }
         }
+        if (!anchorNode || !focusNode) {
+          return null;
+        }
         if (IS_CHROME && hasShadowRoot(anchorNode) || IS_FIREFOX) {
           isCollapsed = domRange.anchorNode === domRange.focusNode && domRange.anchorOffset === domRange.focusOffset;
         } else {
@@ -5966,6 +5816,18 @@ const DOMEditor = {
         focusNode = domRange.endContainer;
         focusOffset = domRange.endOffset;
         isCollapsed = domRange.collapsed;
+        if (IS_FIREFOX) {
+          if (anchorNode) {
+            const [el2, offset] = getFirefoxNodeEl(anchorNode, anchorOffset);
+            anchorNode = el2;
+            anchorOffset = offset;
+          }
+          if (focusNode) {
+            const [el2, offset] = getFirefoxNodeEl(focusNode, focusOffset);
+            focusNode = el2;
+            focusOffset = offset;
+          }
+        }
       }
     }
     if (anchorNode == null || focusNode == null || anchorOffset == null || focusOffset == null) {
@@ -5973,7 +5835,7 @@ const DOMEditor = {
         `Cannot resolve a Slate range from DOM range: ${domRange}`
       );
     }
-    if (IS_FIREFOX && ((_c = focusNode.textContent) == null ? void 0 : _c.endsWith("\n\n")) && focusOffset === focusNode.textContent.length) {
+    if (IS_FIREFOX && ((_a2 = focusNode.textContent) == null ? void 0 : _a2.endsWith("\n\n")) && focusOffset === focusNode.textContent.length) {
       focusOffset--;
     }
     const anchor = DOMEditor.toSlatePoint(editor, [anchorNode, anchorOffset], {
@@ -6963,7 +6825,6 @@ const debug = (..._) => {
 const isDataTransfer = (value) => (value == null ? void 0 : value.constructor.name) === "DataTransfer";
 function createAndroidInputManager({
   editor,
-  scheduleOnDOMSelectionChange,
   onDOMSelectionChange
 }) {
   let flushing = false;
@@ -7001,7 +6862,7 @@ function createAndroidInputManager({
     }
     action.run();
   };
-  const flush = () => {
+  const flush = async () => {
     var _a2, _b2;
     if (flushTimeoutId) {
       clearTimeout(flushTimeoutId);
@@ -7029,7 +6890,7 @@ function createAndroidInputManager({
       EDITOR_TO_PENDING_ACTION.get(editor),
       EDITOR_TO_PENDING_DIFFS.get(editor)
     );
-    let scheduleSelectionChange = hasPendingDiffs();
+    hasPendingDiffs();
     let diff;
     while (diff = (_a2 = EDITOR_TO_PENDING_DIFFS.get(editor)) == null ? void 0 : _a2[0]) {
       const pendingMarks = EDITOR_TO_PENDING_INSERTION_MARKS.get(editor);
@@ -7056,13 +6917,10 @@ function createAndroidInputManager({
         )
       );
       if (!verifyDiffState(editor, diff)) {
-        scheduleSelectionChange = false;
         EDITOR_TO_PENDING_ACTION.delete(editor);
         EDITOR_TO_USER_MARKS.delete(editor);
         flushing = "action";
         EDITOR_TO_PENDING_SELECTION.delete(editor);
-        scheduleOnDOMSelectionChange.cancel();
-        onDOMSelectionChange.cancel();
         selectionRef == null ? void 0 : selectionRef.unref();
       }
     }
@@ -7074,11 +6932,7 @@ function createAndroidInputManager({
       performAction();
       return;
     }
-    if (scheduleSelectionChange) {
-      scheduleOnDOMSelectionChange();
-    }
-    scheduleOnDOMSelectionChange.flush();
-    onDOMSelectionChange.flush();
+    await onDOMSelectionChange();
     applyPendingSelection();
     const userMarks = EDITOR_TO_USER_MARKS.get(editor);
     EDITOR_TO_USER_MARKS.delete(editor);
@@ -7140,18 +6994,16 @@ function createAndroidInputManager({
       diff: merged
     };
   };
-  const scheduleAction = (run, { at } = {}) => {
+  const scheduleAction = async (run, { at } = {}) => {
     insertPositionHint = false;
     EDITOR_TO_PENDING_SELECTION.delete(editor);
-    scheduleOnDOMSelectionChange.cancel();
-    onDOMSelectionChange.cancel();
     if (hasPendingAction()) {
-      flush();
+      await flush();
     }
     EDITOR_TO_PENDING_ACTION.set(editor, { at, run });
     actionTimeoutId = setTimeout(flush);
   };
-  const handleDOMBeforeInput = (event) => {
+  const handleDOMBeforeInput = async (event) => {
     if (flushTimeoutId) {
       clearTimeout(flushTimeoutId);
       flushTimeoutId = null;
@@ -8173,33 +8025,31 @@ const Editable = defineComponent({
     );
     const state = reactive({
       isDraggingInternally: false,
-      isUpdatingSelection: false,
       latestElement: null
     });
     const placeholderHeight = ref();
     const onPlaceholderResize = (h2) => placeholderHeight.value = h2;
     const androidInputManagerRef = ref(null);
-    const processing = ref(false);
-    const onDOMSelectionChange = throttle(() => {
-      if (IS_NODE_MAP_DIRTY.get(editor)) {
-        onDOMSelectionChange();
+    const onDOMSelectionChange = (event) => {
+      const target = event == null ? void 0 : event.target;
+      const targetElement = target instanceof HTMLElement ? target : null;
+      const targetTagName = targetElement == null ? void 0 : targetElement.tagName;
+      if (targetTagName === "INPUT" || targetTagName === "TEXTAREA") {
         return;
       }
       const el = DOMEditor.toDOMNode(editor, editor);
       const root2 = el.getRootNode();
-      if (!processing.value && IS_WEBKIT && root2 instanceof ShadowRoot) {
-        processing.value = true;
+      if (IS_WEBKIT && root2 instanceof ShadowRoot) {
         const active = getActiveElement();
         if (active) {
           document.execCommand("indent");
         } else {
           Transforms.deselect(editor);
         }
-        processing.value = false;
         return;
       }
       const androidInputManager = androidInputManagerRef.value;
-      if ((IS_ANDROID || !DOMEditor.isComposing(editor)) && (!state.isUpdatingSelection || (androidInputManager == null ? void 0 : androidInputManager.isFlushing())) && !state.isDraggingInternally) {
+      if ((IS_ANDROID || !DOMEditor.isComposing(editor)) && !state.isDraggingInternally) {
         const root22 = DOMEditor.findDocumentOrShadowRoot(editor);
         const { activeElement } = root22;
         const el2 = DOMEditor.toDOMNode(editor, editor);
@@ -8233,15 +8083,12 @@ const Editable = defineComponent({
           Transforms.deselect(editor);
         }
       }
-    }, 100);
-    const scheduleOnDOMSelectionChange = debounce(onDOMSelectionChange, 0);
+    };
     const editableRef = ref();
     androidInputManagerRef.value = useAndroidInputManager({
       node: editableRef,
-      onDOMSelectionChange,
-      scheduleOnDOMSelectionChange
+      onDOMSelectionChange
     });
-    const timeoutId = ref();
     const { onUserInput } = useRestoreDOM(editableRef, editor);
     onMounted(() => {
       let window2;
@@ -8253,8 +8100,6 @@ const Editable = defineComponent({
       }
     });
     onUnmounted(() => {
-      onDOMSelectionChange.cancel();
-      scheduleOnDOMSelectionChange.cancel();
       EDITOR_TO_ELEMENT.delete(editor);
       NODE_TO_ELEMENT.delete(editor);
     });
@@ -8269,7 +8114,7 @@ const Editable = defineComponent({
         return false;
       }
     });
-    const setDomSelection = (forceChange) => {
+    const setDomSelection = () => {
       var _a2;
       const root2 = DOMEditor.findDocumentOrShadowRoot(editor);
       const domSelection = getSelection(root2);
@@ -8298,7 +8143,7 @@ const Editable = defineComponent({
       if (editorElement.contains(anchorNode) && editorElement.contains(focusNode)) {
         hasDomSelectionInEditor = true;
       }
-      if (hasDomSelection && hasDomSelectionInEditor && editor.selection && !forceChange) {
+      if (hasDomSelection && hasDomSelectionInEditor && editor.selection) {
         const slateRange = DOMEditor.toSlateRange(editor, domSelection, {
           exactMatch: true,
           // domSelection is not necessarily a valid Slate range
@@ -8323,7 +8168,6 @@ const Editable = defineComponent({
         });
         return;
       }
-      state.isUpdatingSelection = true;
       let newDomRange = null;
       try {
         newDomRange = editor.selection && DOMEditor.toDOMRange(editor, editor.selection);
@@ -8353,16 +8197,7 @@ const Editable = defineComponent({
       }
       return newDomRange;
     };
-    const ensureDomSelection = (forceChange) => {
-      try {
-        const el = DOMEditor.toDOMNode(editor, editor);
-        el.focus();
-        setDomSelection(forceChange);
-      } catch (e2) {
-      }
-    };
-    const animationFrameId = ref();
-    const changeEffect = () => {
+    useChangeEffect(() => {
       var _a2, _b2;
       const root2 = DOMEditor.findDocumentOrShadowRoot(editor);
       const domSelection = getSelection(root2);
@@ -8374,35 +8209,13 @@ const Editable = defineComponent({
       }
       const ensureSelection = ((_b2 = androidInputManagerRef.value) == null ? void 0 : _b2.isFlushing()) === "action";
       if (!IS_ANDROID || !ensureSelection) {
-        setTimeout(() => {
-          state.isUpdatingSelection = false;
-        });
         return;
       }
-      animationFrameId.value = requestAnimationFrame(() => {
-        if (ensureSelection) {
-          ensureDomSelection();
-          timeoutId.value = setTimeout(() => {
-            ensureDomSelection(true);
-            state.isUpdatingSelection = false;
-          });
-        }
-      });
-    };
-    useChangeEffect(changeEffect);
-    onUnmounted(() => {
-      animationFrameId.value && cancelAnimationFrame(animationFrameId.value);
-      if (timeoutId) {
-        clearTimeout(timeoutId.value);
-      }
     });
     const stoppedDragging = () => state.isDraggingInternally = false;
     onMounted(() => {
       const window2 = DOMEditor.getWindow(editor);
-      window2.document.addEventListener(
-        "selectionchange",
-        scheduleOnDOMSelectionChange
-      );
+      window2.document.addEventListener("selectionchange", onDOMSelectionChange);
       window2.document.addEventListener("dragend", stoppedDragging);
       window2.document.addEventListener("drop", stoppedDragging);
     });
@@ -8410,7 +8223,7 @@ const Editable = defineComponent({
       const window2 = DOMEditor.getWindow(editor);
       window2.document.removeEventListener(
         "selectionchange",
-        scheduleOnDOMSelectionChange
+        onDOMSelectionChange
       );
       window2.document.removeEventListener("dragend", stoppedDragging);
       window2.document.removeEventListener("drop", stoppedDragging);
@@ -8424,7 +8237,7 @@ const Editable = defineComponent({
       if (HAS_BEFORE_INPUT_SUPPORT) {
         const el = DOMEditor.toDOMNode(editor, editor);
         const root2 = el.getRootNode();
-        if ((processing == null ? void 0 : processing.value) && IS_WEBKIT && root2 instanceof ShadowRoot) {
+        if (IS_WEBKIT && root2 instanceof ShadowRoot) {
           const ranges = event.getTargetRanges();
           const range2 = ranges[0];
           const newRange = new window.Range();
@@ -8444,8 +8257,6 @@ const Editable = defineComponent({
           if (androidInputManagerRef.value) {
             return androidInputManagerRef.value.handleDOMBeforeInput(event);
           }
-          scheduleOnDOMSelectionChange.flush();
-          onDOMSelectionChange.flush();
           const { selection } = editor;
           const { inputType } = event;
           const data = event.dataTransfer || event.data || void 0;
@@ -8632,7 +8443,7 @@ const Editable = defineComponent({
       }
     };
     const onBlur = (event) => {
-      if (readOnly || state.isUpdatingSelection || !DOMEditor.hasSelectableTarget(editor, event.target) || isEventHandled(event, attributes.onBlur)) {
+      if (readOnly || !DOMEditor.hasSelectableTarget(editor, event.target) || isEventHandled(event, attributes.onBlur)) {
         return;
       }
       const root2 = DOMEditor.findDocumentOrShadowRoot(editor);
@@ -8814,7 +8625,7 @@ const Editable = defineComponent({
       }
     };
     const onFocus = (event) => {
-      if (!readOnly && !state.isUpdatingSelection && DOMEditor.hasEditableTarget(editor, event.target) && !isEventHandled(event, attributes.onFocus)) {
+      if (!readOnly && DOMEditor.hasEditableTarget(editor, event.target) && !isEventHandled(event, attributes.onFocus)) {
         const el = DOMEditor.toDOMNode(editor, editor);
         const root2 = DOMEditor.findDocumentOrShadowRoot(editor);
         state.latestElement = root2.activeElement;

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "slate-vue3",
-  "version": "0.0.22",
+  "version": "0.0.24",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
   "description": "slate-react library implemented with vue3",
+  "license": "MIT",
   "files": [
     "dist/"
   ],
@@ -43,7 +44,7 @@
     "prismjs": "^1.29.0",
     "slate-hyperscript": "^0.100.0",
     "typescript": "~5.7.2",
-    "vite": "^6.1.0",
+    "vite": "^6.2.0",
     "vite-plugin-dts": "^4.5.0",
     "vitest": "^3.0.5",
     "vue-router": "^4.5.0"
@@ -62,6 +63,6 @@
   ],
   "repository": {
     "type": "git",
-    "url": "https://github.com/Guan-Erjia/slate-vue3"
+    "url": "git+https://github.com/Guan-Erjia/slate-vue3.git"
   }
 }