vuewrite 0.0.5 → 0.0.6

package/dist/vuewrite.d.ts

@@ -43,9 +43,14 @@ export declare type Style = {
 export declare const TextEditor: __VLS_WithTemplateSlots<DefineComponent<__VLS_TypePropsToRuntimeProps<{
 decorator?: Decorator | undefined;
 single?: boolean | undefined;
-modelValue?: string | string[] | undefined;
-styles?: Style[] | Style[][] | undefined;
+modelValue?: string | {
+text: string;
+styles?: Style[] | undefined;
+type?: string | undefined;
+}[] | undefined;
+styles?: Style[] | undefined;
 autofocus?: boolean | undefined;
+autoselect?: boolean | undefined;
 }>, {
 currentStyles: ComputedRef<Map<string, Style>>;
 currentBlock: ComputedRef<    {
@@ -83,9 +88,14 @@ keydown: (...args: any[]) => void;
 }, string, PublicProps, Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
 decorator?: Decorator | undefined;
 single?: boolean | undefined;
-modelValue?: string | string[] | undefined;
-styles?: Style[] | Style[][] | undefined;
+modelValue?: string | {
+text: string;
+styles?: Style[] | undefined;
+type?: string | undefined;
+}[] | undefined;
+styles?: Style[] | undefined;
 autofocus?: boolean | undefined;
+autoselect?: boolean | undefined;
 }>>> & {
 onKeydown?: ((...args: any[]) => any) | undefined;
 "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;

package/dist/vuewrite.js

@@ -415,7 +415,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       return props.slots[props.block.type] ?? null;
     });
     const blockProps = {
-      "data-block-id": props.block.id
+      "data-vw-block-id": props.block.id
     };
     const renderBlockPart = (text, styles) => {
       if (!props.decorator)
@@ -543,7 +543,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     single: { type: Boolean },
     modelValue: {},
     styles: {},
-    autofocus: { type: Boolean }
+    autofocus: { type: Boolean },
+    autoselect: { type: Boolean }
   },
   emits: ["keydown", "update:modelValue", "update:styles"],
   setup(__props, { expose: __expose, emit: __emit }) {
@@ -565,7 +566,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         }
         store.blocks.length = newValue.length;
         for (let i = 0; i < newValue.length; i++) {
-          store.blocks[i].text = newValue[i];
+          store.blocks[i].text = newValue[i].text;
+          store.blocks[i].type = newValue[i].type;
+          store.blocks[i].text = newValue[i].text;
         }
       }
     }, { immediate: true });
@@ -576,20 +579,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       for (let i = 0; i < store.blocks.length; i++) {
         if (newStyles.length <= i)
           break;
-        const style = props.single ? newStyles : newStyles[i];
-        store.blocks[i].styles = style;
+        store.blocks[i].styles = newStyles;
       }
     }, { immediate: true });
     watch(() => store.blocks, () => {
       if (props.single) {
         modelValue = store.blocks[0].text;
         styles = store.blocks[0].styles;
+        emit("update:styles", styles);
+        emit("update:modelValue", modelValue);
       } else {
-        modelValue = store.blocks.map((item) => item.text);
-        styles = store.blocks.map((item) => item.styles);
+        modelValue = store.blocks.map((item) => ({
+          type: item.type,
+          text: item.text,
+          styles: item.styles.length === 0 ? void 0 : item.styles
+        }));
+        emit("update:modelValue", modelValue);
       }
-      emit("update:modelValue", modelValue);
-      emit("update:styles", styles);
     }, { deep: true });
     const onKeyDown = (e) => {
       emit("keydown", e);
@@ -617,15 +623,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     let cachedSelection = {};
     useEventListener(document, "selectionchange", () => {
       const sel = window.getSelection();
-      const anchor = findParent(sel.anchorNode, (el) => el.hasAttribute("data-block-id"));
+      const anchor = findParent(sel.anchorNode, (el) => el.hasAttribute("data-vw-block-id"));
       if (anchor) {
         const offset = anchor === sel.anchorNode ? 0 : calcOffsetToNode(anchor, sel.anchorNode) + sel.anchorOffset;
-        store.selection.anchor = { blockId: anchor.getAttribute("data-block-id"), offset };
+        store.selection.anchor = { blockId: anchor.getAttribute("data-vw-block-id"), offset };
       }
-      const focus = findParent(sel.focusNode, (el) => el.hasAttribute("data-block-id"));
+      const focus = findParent(sel.focusNode, (el) => el.hasAttribute("data-vw-block-id"));
       if (focus) {
         const offset = anchor === sel.focusNode ? 0 : calcOffsetToNode(focus, sel.focusNode) + sel.focusOffset;
-        store.selection.focus = { blockId: focus.getAttribute("data-block-id"), offset };
+        store.selection.focus = { blockId: focus.getAttribute("data-vw-block-id"), offset };
       }
       if (store.isFocused.value !== !!focus || !!anchor) {
         store.isFocused.value = !!focus || !!anchor;
@@ -655,10 +661,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       let anchor = null;
       let focus = null;
       for (let item of textEditorRef.value.children) {
-        if (item.getAttribute("data-block-id") === store.selection.anchor.blockId) {
+        if (item.getAttribute("data-vw-block-id") === store.selection.anchor.blockId) {
           anchor = item;
         }
-        if (item.getAttribute("data-block-id") === store.selection.focus.blockId) {
+        if (item.getAttribute("data-vw-block-id") === store.selection.focus.blockId) {
           focus = item;
         }
       }
@@ -672,11 +678,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
     watch(() => store.selection, applySelection, { deep: true, flush: "post" });
     onMounted(() => {
-      var _a;
+      var _a, _b;
       if (props.autofocus) {
         (_a = textEditorRef.value) == null ? void 0 : _a.focus();
         applySelection();
       }
+      if (props.autoselect) {
+        (_b = textEditorRef.value) == null ? void 0 : _b.focus();
+        store.selectAll();
+      }
     });
     const onCopy = (e) => {
       e.preventDefault();

package/package.json

@@ -2,7 +2,7 @@
   "name": "vuewrite",
   "description": "Rich Text Editor based on Vue3 reactivity",
   "private": false,
-  "version": "0.0.5",
+  "version": "0.0.6",
   "type": "module",
   "license": "MIT",
   "author": "den59k",