slate-vue3 0.11.0 → 0.11.2

package/dist/index.js

@@ -1,5 +1,5 @@
-import { u as useElementIf, a as useEditor, S as SLATE_USE_SELECTION } from "./use-focused-xpGb53Is.js";
-import { n, p, k, l, o, D, m, E, b, j, h, g, i, c, f, d, e } from "./use-focused-xpGb53Is.js";
+import { u as useElementIf, a as useEditor, S as SLATE_USE_SELECTION } from "./use-focused-c2_pK4Hd.js";
+import { n, p, k, l, o, D, m, E, b, j, h, g, i, c, f, d, e } from "./use-focused-c2_pK4Hd.js";
 import { E as Editor, R as Range } from "./index-CeEqNjuc.js";
 import { computed, inject } from "vue";
 import { D as DOMEditor } from "./hotkeys-FU5gHPpY.js";

package/dist/slate-vue/render/placeholder.d.ts

@@ -13,7 +13,7 @@ export declare const provideMarkPlaceholder: (markPlaceholder: MarkPlaceholder)
 export declare const useMarkPlaceholder: () => MarkPlaceholder;
 export declare const SLATE_INNER_PLACEHOLDER_SHOW: unique symbol;
 export declare const providePlaceholderShow: (show: ComputedRef<boolean>) => void;
-export declare const usePlaceholderShow: () => ComputedRef<boolean>;
+export declare const usePlaceholderShow: () => () => boolean;
 export declare const SLATE_INNER_PLACEHOLDER_RESIZE: unique symbol;
 export declare const providePlaceholderResize: (fn: (height?: number) => void) => void;
 export declare const usePlaceholderResize: () => (height?: number) => void;

package/dist/{use-focused-xpGb53Is.js → use-focused-c2_pK4Hd.js}

@@ -318,7 +318,7 @@ const SLATE_INNER_PLACEHOLDER_SHOW = Symbol(
   "SLATE_INNER_PLACEHOLDER_SHOW"
 );
 const providePlaceholderShow = (show) => {
-  provide(SLATE_INNER_PLACEHOLDER_SHOW, show);
+  provide(SLATE_INNER_PLACEHOLDER_SHOW, () => show.value);
 };
 const usePlaceholderShow = () => {
   const PLACEHOLDER_SHOW_INJECT = inject(
@@ -563,60 +563,52 @@ const StringComp = defineComponent({
     const isLastEmptyBlock = injectIsLastEmptyBlock();
     return () => {
       if (editor.isVoid(element.value)) {
-        return h(ZeroWidthString, {
+        return ZeroWidthString({
           length: Node.string(element.value).length
         });
       }
       if (props.leaf.text === "" && element.value.children.at(-1) === props.text && isLastEmptyBlock.value) {
-        return h(ZeroWidthString, {
+        return ZeroWidthString({
           isLineBreak: true,
           isMarkPlaceholder: props.leaf[MARK_PLACEHOLDER_SYMBOL] === true
         });
       }
       if (props.leaf.text === "") {
-        return h(ZeroWidthString, {
+        return ZeroWidthString({
           isMarkPlaceholder: props.leaf[MARK_PLACEHOLDER_SYMBOL] === true
         });
       }
       if (props.isLast && props.leaf.text.endsWith("\n")) {
-        return h(TextString, {
+        return TextString({
           isTrailing: true,
           text: props.leaf.text
         });
       }
-      return h(TextString, { text: props.leaf.text });
+      return TextString({ text: props.leaf.text });
     };
   }
 });
-const TextString = defineComponent({
-  name: "slate-text-string",
-  props: ["text", "isTrailing"],
-  setup(props) {
-    return () => h(
-      "span",
-      { "data-slate-string": true },
-      `${props.text ?? ""}${props.isTrailing ? "\n" : ""}`
-    );
-  }
-});
-const ZeroWidthString = defineComponent({
-  name: "slate-zero-width-string",
-  props: ["length", "isMarkPlaceholder", "isLineBreak"],
-  setup(props) {
-    return () => h(
-      "span",
-      {
-        "data-slate-zero-width": props.isLineBreak ? "n" : "z",
-        "data-slate-length": props.length,
-        "data-slate-mark-placeholder": props.isMarkPlaceholder ? true : void 0
-      },
-      [
-        !IS_ANDROID || !props.isLineBreak ? "\uFEFF" : null,
-        props.isLineBreak ? h("br") : null
-      ]
-    );
-  }
-});
+const TextString = (props) => {
+  return h(
+    "span",
+    { "data-slate-string": true },
+    `${props.text ?? ""}${props.isTrailing ? "\n" : ""}`
+  );
+};
+const ZeroWidthString = (props) => {
+  return h(
+    "span",
+    {
+      "data-slate-zero-width": props.isLineBreak ? "n" : "z",
+      "data-slate-length": props.length,
+      "data-slate-mark-placeholder": props.isMarkPlaceholder ? true : void 0
+    },
+    [
+      !IS_ANDROID || !props.isLineBreak ? "\uFEFF" : null,
+      props.isLineBreak ? h("br") : null
+    ]
+  );
+};
 const style = {
   position: "absolute",
   top: 0,
@@ -662,54 +654,29 @@ const PlaceholderComp = defineComponent({
   }
 });
 const LeafComp = defineComponent({
-  name: "slate-text",
+  name: "slate-leaf",
   props: ["text", "leaf", "isLast", "leafPosition"],
   setup(props) {
-    const text = props.text;
-    const leaf = props.leaf;
-    const isLast = props.isLast;
-    const leafPosition = props.leafPosition;
-    const editor = useEditor();
-    const textRef = ref();
-    onMounted(() => {
-      const key = DOMEditor.findKey(editor, text);
-      if (textRef.value) {
-        const KEY_TO_ELEMENT = EDITOR_TO_KEY_TO_ELEMENT.get(editor);
-        KEY_TO_ELEMENT?.set(key, textRef.value);
-        ELEMENT_TO_NODE.set(textRef.value, text);
-        NODE_TO_ELEMENT.set(text, textRef.value);
-      }
-    });
-    onUnmounted(() => {
-      NODE_TO_ELEMENT.delete(text);
-      if (textRef.value) {
-        ELEMENT_TO_NODE.delete(textRef.value);
-      }
-    });
+    const { text, leaf, isLast, leafPosition } = props;
     const renderLeaf = useRenderLeaf();
     const showPlaceholder = usePlaceholderShow();
-    const children = computed(() => {
-      return showPlaceholder.value ? [
+    return () => renderLeaf({
+      text,
+      leaf,
+      leafPosition,
+      attributes: { "data-slate-leaf": true },
+      children: showPlaceholder() ? [
         h(StringComp, {
           text,
           leaf,
-          isLast: true,
-          key: DOMEditor.findKey(editor, leaf).id
+          isLast: true
         }),
         h(PlaceholderComp)
       ] : h(StringComp, {
         text,
         leaf,
-        isLast,
-        key: DOMEditor.findKey(editor, leaf).id
-      });
-    });
-    return () => renderLeaf({
-      text,
-      leaf,
-      leafPosition,
-      attributes: { "data-slate-leaf": true },
-      children: children.value
+        isLast
+      })
     });
   }
 });
@@ -740,10 +707,10 @@ const TextComp = defineComponent({
       return Text.decorations(text, filterDs.length ? filterDs : []);
     });
     onMounted(() => {
-      const key = DOMEditor.findKey(editor, text);
+      const key2 = DOMEditor.findKey(editor, text);
       if (textRef.value) {
         const KEY_TO_ELEMENT = EDITOR_TO_KEY_TO_ELEMENT.get(editor);
-        KEY_TO_ELEMENT?.set(key, textRef.value);
+        KEY_TO_ELEMENT?.set(key2, textRef.value);
         ELEMENT_TO_NODE.set(textRef.value, text);
         NODE_TO_ELEMENT.set(text, textRef.value);
       }
@@ -755,6 +722,7 @@ const TextComp = defineComponent({
       }
     });
     const renderText = useRenderText();
+    let key = 0;
     const children = computed(
       () => renderList(
         leaves.value,
@@ -763,7 +731,7 @@ const TextComp = defineComponent({
           leaf: leaf.leaf,
           isLast: props.isLast && i === leaves.value.length - 1,
           leafPosition: leaf.position,
-          key: DOMEditor.findKey(editor, leaf.leaf).id
+          key: key++
         })
       )
     );
@@ -836,7 +804,7 @@ const ElementComp = defineComponent({
       }
       if (Editor.isVoid(editor, element)) {
         attr["data-slate-void"] = true;
-        if (!readOnly && isInline.value) {
+        if (!readOnly.value && isInline.value) {
           attr.contenteditable = false;
         }
       }

package/dist/yjs.js

@@ -2,7 +2,7 @@ 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-TwW6GZ1v.js";
-import { a as useEditor, d as useFocused } from "./use-focused-xpGb53Is.js";
+import { a as useEditor, d as useFocused } from "./use-focused-c2_pK4Hd.js";
 import { D as DOMEditor } from "./hotkeys-FU5gHPpY.js";
 function deepEquals(node, another) {
   for (const key in node) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "slate-vue3",
-  "version": "0.11.0",
+  "version": "0.11.2",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",