eco-vue-js 0.11.19 → 0.11.20

package/dist/components/Dropdown/utils/DropdownStyle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownStyle.d.ts","sourceRoot":"","sources":["../../../../../src/components/Dropdown/utils/DropdownStyle.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,eAAe,EAAC,MAAM,yBAAyB,CAAA;AAEvD,KAAK,WAAW,GAAG;IACjB,MAAM,EAAE,CAAC,CAAC,UAAU,EAAE,OAAO,KAAK,OAAO,CAAC,GAAG,SAAS,CAAA;CACvD,CAAA;AAID,oBAAY,OAAO;IACjB,GAAG,kBAAkB;IACrB,MAAM,gBAAgB;IACtB,MAAM,mBAAmB;CAC1B;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,OAAO,CAAA;IACd,MAAM,EAAE,OAAO,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAC9B,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,MAAM,CAAA;CACnC,GAAG,WAAW,CAAA;AA6Df,oBAAY,OAAO;IACjB,IAAI,kBAAkB;IACtB,KAAK,gBAAgB;IACrB,MAAM,mBAAmB;CAC1B;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,mBAAmB,EAAE,CAAC,cAAc,EAAE,cAAc,CAAC,GAAG,CAAC,cAAc,CAAC,CAAA;IACxE,MAAM,EAAE,OAAO,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,CAAA;IAC1C,WAAW,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAC7D,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,MAAM,CAAA;CACnC,GAAG,WAAW,CAAA;AAIf;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,gBAMvB,CAAA;AAEF;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,gBAKvB,CAAA;AAkCF;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,gBAMtB,CAAA;AAEF;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,gBAKtB,CAAA;AAEF;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,gBAGvB,CAAA;AAEF,eAAO,MAAM,wBAAwB,EAAE,MAAM,CAAC,eAAe,EAAE,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,GAAG,CAAC,gBAAgB,CAAC,CASvH,CAAA;AAED,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,gBAAgB,GAAG,cAAc,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,OAAO,GAAG,CAAC,CAItH"}
+{"version":3,"file":"DropdownStyle.d.ts","sourceRoot":"","sources":["../../../../../src/components/Dropdown/utils/DropdownStyle.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,eAAe,EAAC,MAAM,yBAAyB,CAAA;AAGvD,KAAK,WAAW,GAAG;IACjB,MAAM,EAAE,CAAC,CAAC,UAAU,EAAE,OAAO,KAAK,OAAO,CAAC,GAAG,SAAS,CAAA;CACvD,CAAA;AAID,oBAAY,OAAO;IACjB,GAAG,kBAAkB;IACrB,MAAM,gBAAgB;IACtB,MAAM,mBAAmB;CAC1B;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,OAAO,CAAA;IACd,MAAM,EAAE,OAAO,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAC9B,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,MAAM,CAAA;CACnC,GAAG,WAAW,CAAA;AA6Df,oBAAY,OAAO;IACjB,IAAI,kBAAkB;IACtB,KAAK,gBAAgB;IACrB,MAAM,mBAAmB;CAC1B;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,mBAAmB,EAAE,CAAC,cAAc,EAAE,cAAc,CAAC,GAAG,CAAC,cAAc,CAAC,CAAA;IACxE,MAAM,EAAE,OAAO,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,CAAA;IAC1C,WAAW,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAC7D,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,MAAM,CAAA;CACnC,GAAG,WAAW,CAAA;AAIf;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,gBAMvB,CAAA;AAEF;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,gBAKvB,CAAA;AAkCF;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,gBAMtB,CAAA;AAEF;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,gBAKtB,CAAA;AAEF;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,gBAGvB,CAAA;AAEF,eAAO,MAAM,wBAAwB,EAAE,MAAM,CAAC,eAAe,EAAE,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,GAAG,CAAC,gBAAgB,CAAC,CASvH,CAAA;AAED,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,gBAAgB,GAAG,cAAc,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,OAAO,GAAG,CAAC,CAItH"}

package/dist/components/Dropdown/utils/DropdownStyle.js

@@ -1,8 +1,9 @@
 import { markRaw } from 'vue';
 import { HorizontalAlign } from '../../../utils/HorizontalAlign.js';
+import { isClientSide } from '../../../utils/utils.js';
 
 const EDGE_FACTOR = 0.66;
-const BOTTOM_EDGE = window.innerHeight * EDGE_FACTOR;
+const BOTTOM_EDGE = isClientSide ? window.innerHeight * EDGE_FACTOR : 0;
 const BottomInner = markRaw({
   isTop: false,
   origin: "content-start" /* TOP */,
@@ -22,7 +23,7 @@ const VerticalCenter = markRaw({
   y: (parentRect) => Math.round(parentRect.top + parentRect.height / 2),
   isEdge: void 0
 });
-const TOP_EDGE = window.innerHeight * (1 - EDGE_FACTOR);
+const TOP_EDGE = isClientSide ? window.innerHeight * (1 - EDGE_FACTOR) : 0;
 const TopOuter = markRaw({
   isTop: true,
   origin: "content-end" /* BOTTOM */,
@@ -41,7 +42,7 @@ var OriginX = /* @__PURE__ */ ((OriginX2) => {
   OriginX2["CENTER"] = "justify-center";
   return OriginX2;
 })(OriginX || {});
-const RIGHT_EDGE = window.innerWidth * EDGE_FACTOR;
+const RIGHT_EDGE = isClientSide ? window.innerWidth * EDGE_FACTOR : 0;
 const RightOuter = markRaw({
   verticalGetterOrder: [BottomInner, TopInner],
   origin: "justify-start" /* LEFT */,
@@ -73,7 +74,7 @@ const Center = markRaw({
   x: (parentRect) => Math.round(parentRect.left + parentRect.width / 2),
   isEdge: void 0
 });
-const LEFT_EDGE = window.innerWidth * (1 - EDGE_FACTOR);
+const LEFT_EDGE = isClientSide ? window.innerWidth * (1 - EDGE_FACTOR) : 0;
 const LeftInner = markRaw({
   verticalGetterOrder: [BottomOuter, TopOuter],
   origin: "justify-end" /* RIGHT */,

package/dist/components/Input/WInput.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/WInput.vue"],"names":[],"mappings":"AAoPA;AAqiBA,OAAO,KAAK,EAAC,UAAU,EAAE,aAAa,EAAC,MAAM,SAAS,CAAA;AActD,OAAO,EAAC,KAAK,WAAW,EAAC,MAAM,gBAAgB,CAAA;yBAE9B,IAAI,SAAS,SAAS,GAAG,MAAM,EAC/C,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,eAAe,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EACjE;WAmyBO,mBAAmB,CAAC,oCAAkE,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB;qBAzmB7B,IAAI;oBAOL,IAAI;+BAkCS,aAAa;0BA1KlB,MAAM,QAAQ,MAAM,KAAG,IAAI;wBAN/B,WAAW;;;oBAyBf,IAAI;oBAgBJ,IAAI;MAusBgD,GAAG,IAAI;WACpE,GAAG;;uBAhEgB,GAAG;0BACA,GAAG;wBACJ,GAAG;;;YAEH,GAAG;;mCArgBF,aAAa;YAogBb,GAAG;;;YAEJ,GAAG;uBACJ,GAAG;wBACF,GAAG;uBACJ,GAAG;uBACH,GAAG;wBACF,GAAG;;;YAttB1B,oBAAoB,SAAS,4CAAa,SAAS,GAAG,IAAI;YAC1D,gBAAgB,SAAS,aAAa,GAAG,IAAI;YAC7C,aAAa,SAAS,aAAa,GAAG,IAAI;YAC1C,eAAe,SAAS,aAAa,GAAG,IAAI;YAC5C,iBAAiB,SAAS,aAAa,GAAG,IAAI;YAC9C,oBAAoB,SAAS,aAAa,GAAG,IAAI;YACjD,aAAa,GAAG,IAAI;YACpB,OAAO,SAAS,UAAU,GAAG,SAAS,GAAG,IAAI;YAC7C,MAAM,SAAS,UAAU,GAAG,IAAI;YAChC,OAAO,SAAS,UAAU,GAAG,IAAI;YACjC,WAAW,SAAS,UAAU,GAAG,IAAI;YACrC,cAAc,SAAS,UAAU,GAAG,IAAI;YACxC,cAAc,SAAS,KAAK,GAAG,IAAI;YACnC,OAAO,GAAG,IAAI;;EAmwBhB,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAE;AA9yBzE,wBA8yB4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
+{"version":3,"file":"WInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/WInput.vue"],"names":[],"mappings":"AAoPA;AAqiBA,OAAO,KAAK,EAAC,UAAU,EAAE,aAAa,EAAC,MAAM,SAAS,CAAA;AAatD,OAAO,EAAC,KAAK,WAAW,EAAC,MAAM,gBAAgB,CAAA;yBAE9B,IAAI,SAAS,SAAS,GAAG,MAAM,EAC/C,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,eAAe,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EACjE;WAoyBO,mBAAmB,CAAC,oCAAkE,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB;qBAzmB7B,IAAI;oBAOL,IAAI;+BAkCS,aAAa;0BA1KlB,MAAM,QAAQ,MAAM,KAAG,IAAI;wBAN/B,WAAW;;;oBAyBf,IAAI;oBAgBJ,IAAI;MAusBgD,GAAG,IAAI;WACpE,GAAG;;uBAhEgB,GAAG;0BACA,GAAG;wBACJ,GAAG;;;YAEH,GAAG;;mCArgBF,aAAa;YAogBb,GAAG;;;YAEJ,GAAG;uBACJ,GAAG;wBACF,GAAG;uBACJ,GAAG;uBACH,GAAG;wBACF,GAAG;;;YAttB1B,oBAAoB,SAAS,4CAAa,SAAS,GAAG,IAAI;YAC1D,gBAAgB,SAAS,aAAa,GAAG,IAAI;YAC7C,aAAa,SAAS,aAAa,GAAG,IAAI;YAC1C,eAAe,SAAS,aAAa,GAAG,IAAI;YAC5C,iBAAiB,SAAS,aAAa,GAAG,IAAI;YAC9C,oBAAoB,SAAS,aAAa,GAAG,IAAI;YACjD,aAAa,GAAG,IAAI;YACpB,OAAO,SAAS,UAAU,GAAG,SAAS,GAAG,IAAI;YAC7C,MAAM,SAAS,UAAU,GAAG,IAAI;YAChC,OAAO,SAAS,UAAU,GAAG,IAAI;YACjC,WAAW,SAAS,UAAU,GAAG,IAAI;YACrC,cAAc,SAAS,UAAU,GAAG,IAAI;YACxC,cAAc,SAAS,KAAK,GAAG,IAAI;YACnC,OAAO,GAAG,IAAI;;EAmwBhB,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAE;AA/yBzE,wBA+yB4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}

package/dist/components/Input/WInput.vue.js

@@ -5,8 +5,7 @@ import { Notify } from '../../utils/Notify.js';
 import { useComponentStates } from '../../utils/useComponentStates.js';
 import { checkPermissionPaste } from '../../utils/useCopy.js';
 import { debounce } from '../../utils/utils.js';
-import _sfc_main$2 from './components/ContentEditable.vue.js';
-import _sfc_main$3 from './components/InputActions.vue.js';
+import _sfc_main$2 from './components/InputActions.vue.js';
 
 const _hoisted_1 = { class: "relative flex min-h-full flex-1" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -67,6 +66,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   emits: ["update:model-value", "keypress:enter", "keypress:up", "keypress:down", "keypress:delete", "keypress:backspace", "click:clear", "focus", "blur", "click", "mousedown", "click:suffix", "select:input", "paste"],
   setup(__props, { expose: __expose, emit: __emit }) {
+    const ContentEditable = defineAsyncComponent(() => import('./components/ContentEditable.vue.js'));
     const InputToolbar = defineAsyncComponent(() => import('./components/InputToolbar.vue.js'));
     const props = __props;
     const emit = __emit;
@@ -378,7 +378,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   }, [
                     createElementVNode("div", _hoisted_1, [
                       renderSlot(_ctx.$slots, "before", normalizeProps(guardReactiveProps({ modelValue: _ctx.modelValue }))),
-                      (openBlock(), createBlock(resolveDynamicComponent(_ctx.textarea ? _sfc_main$2 : "input"), {
+                      (openBlock(), createBlock(resolveDynamicComponent(_ctx.textarea ? unref(ContentEditable) : "input"), {
                         id,
                         ref: "input",
                         class: normalizeClass(["w-input min-h-full flex-1 basis-auto appearance-none border-none bg-[inherit] outline-0 placeholder:text-gray-400 disabled:cursor-not-allowed dark:placeholder:text-gray-500", {
@@ -432,7 +432,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   ], 2)
                 ], 2)
               ], 2),
-              !_ctx.seamless || focused ? (openBlock(), createBlock(_sfc_main$3, {
+              !_ctx.seamless || focused ? (openBlock(), createBlock(_sfc_main$2, {
                 key: 2,
                 "model-value": _ctx.modelValue,
                 loading: _ctx.loading,

package/dist/components/Input/components/ContentEditable.vue.js

@@ -1,264 +1,5 @@
-import { defineComponent, useTemplateRef, ref, watch, onMounted, createElementBlock, openBlock, nextTick } from 'vue';
-import { WrapSelectionType } from '../../../utils/utils.js';
-import { preserveIndentation } from '../models/toolbarActions.js';
-import { getCaretOffset, setCaretOffset } from '../models/utils.js';
+import _sfc_main from './ContentEditable.vue2.js';
+
 
-const _hoisted_1 = ["contenteditable", "placeholder"];
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "ContentEditable",
-  props: {
-    value: {},
-    placeholder: {},
-    maxLength: {},
-    textParts: {},
-    readonly: { type: Boolean },
-    disabled: { type: Boolean }
-  },
-  emits: ["update:model-value", "focus", "blur", "keydown"],
-  setup(__props, { expose: __expose, emit: __emit }) {
-    const props = __props;
-    const emit = __emit;
-    const elementRef = useTemplateRef("element");
-    const focused = ref(false);
-    const updateTextParts = () => {
-      if (!elementRef.value || !props.textParts) return;
-      const offsets = getCaret();
-      let nodeIndex = 0;
-      for (const item of props.textParts) {
-        const existingNode = elementRef.value.childNodes[nodeIndex] ?? null;
-        if (typeof item === "string") {
-          const displayText = item.replace(/\n$/g, "\n ");
-          if (existingNode instanceof Text) {
-            if (existingNode.textContent !== displayText) existingNode.textContent = displayText;
-          } else {
-            const textNode = document.createTextNode(displayText);
-            elementRef.value.insertBefore(textNode, existingNode);
-          }
-        } else {
-          if (existingNode instanceof HTMLElement && existingNode.tagName.toLowerCase() === item.tag.toLowerCase()) {
-            if (existingNode.textContent !== item.value) existingNode.textContent = item.value;
-            if (existingNode.className !== (item.class || "")) existingNode.className = item.class || "";
-            if (item.edit === false && existingNode.getAttribute("contenteditable") !== "false") {
-              existingNode.setAttribute("contenteditable", "false");
-            }
-          } else {
-            const element = document.createElement(item.tag);
-            element.textContent = item.value;
-            element.setAttribute("contenteditable", item.edit ? "plaintext-only" : "false");
-            if (item.class) element.className = item.class;
-            elementRef.value.insertBefore(element, existingNode);
-          }
-        }
-        nodeIndex++;
-      }
-      while (elementRef.value.childNodes.length > props.textParts.length) {
-        const nodeToRemove = elementRef.value.childNodes[props.textParts.length];
-        elementRef.value.removeChild(nodeToRemove);
-      }
-      if (focused.value && !isSetCaretNext) setCaret(offsets.start, offsets.end !== offsets.start ? void 0 : offsets.end);
-    };
-    watch(() => props.textParts, updateTextParts, { immediate: true });
-    const updateTextValue = (value) => {
-      if (props.textParts || !elementRef.value) return;
-      if (elementRef.value.textContent !== value) {
-        const offsets = getCaret();
-        elementRef.value.textContent = value;
-        if (focused.value) setCaret(offsets.start, offsets.end !== offsets.start ? void 0 : offsets.end);
-      }
-    };
-    watch(() => props.value, updateTextValue, { immediate: true });
-    const textPartsToText = (parts) => {
-      return parts.map((part) => typeof part === "string" ? part : part.value).join("");
-    };
-    const getCurrentText = () => {
-      return props.textParts ? textPartsToText(props.textParts) : props.value;
-    };
-    const lineBreakEvents = ["insertParagraph", "insertLineBreak"];
-    const insertParagraph = (e) => {
-      if (lineBreakEvents.includes(e.inputType)) {
-        e.preventDefault();
-        insertPlain("\n");
-      }
-    };
-    const regexDifferentEnding = /\r\n?/g;
-    const regexSpaces = /\n \n/g;
-    const regexEnding = / +$/gm;
-    const normalizeText = (text) => {
-      return text.replace(regexDifferentEnding, "\n").replace(regexSpaces, "\n\n").replace(regexEnding, "");
-    };
-    const onInput = (e) => {
-      e.stopImmediatePropagation();
-      if (!(e.target instanceof HTMLDivElement)) return;
-      const rawText = e.target.textContent ?? "";
-      const text = normalizeText(rawText);
-      const currentText = getCurrentText();
-      if (text === currentText) return;
-      if (props.maxLength && typeof text === "string" && text.length > props.maxLength) {
-        e.preventDefault();
-        const substring = text.substring(0, props.maxLength);
-        if (!props.textParts) updateTextValue(substring);
-        else updateTextParts();
-        emit("update:model-value", substring);
-      } else {
-        emit("update:model-value", text);
-      }
-    };
-    const onPaste = async (e) => {
-      e.preventDefault();
-      navigator.clipboard.readText();
-      const text = (e.clipboardData?.getData("text/plain") || await navigator.clipboard.readText()).replace(/\r\n?/g, "\n");
-      insertPlain(text);
-    };
-    const insertPlain = (text) => {
-      const root = elementRef.value;
-      if (!root) return;
-      const { start, end, trail } = getCaret();
-      const currentText = getCurrentText();
-      const next = (currentText ?? "").slice(0, start) + " ".repeat(trail) + text + ((currentText ?? "").slice(end) || " ");
-      const caretAfter = start + text.length + trail;
-      emit("update:model-value", props.maxLength && next.length > props.maxLength ? next.substring(0, props.maxLength) : next);
-      nextTick(() => setCaret(props.maxLength ? Math.min(caretAfter, props.maxLength) : caretAfter));
-    };
-    const getCaret = () => getCaretOffset(elementRef.value);
-    let isSetCaretNext = false;
-    const setCaret = (indexStart, indexEnd) => {
-      isSetCaretNext = false;
-      setCaretOffset(elementRef.value, indexStart, indexEnd);
-    };
-    const collapseList = [" ", "\n"];
-    let offsetsOld = null;
-    const wrapSelection = (value) => {
-      if (focused.value || !offsetsOld) offsetsOld = getCaret();
-      const offsets = offsetsOld;
-      const currentText = getCurrentText() ?? "";
-      let newText = "";
-      let newCursorStart = offsets.start;
-      let newCursorEnd = void 0;
-      switch (value.type) {
-        case WrapSelectionType.TOGGLE:
-          let startLen = value.start.length;
-          const endLen = value.end.length;
-          const textWithContext = currentText.slice(
-            Math.max(0, offsets.start - startLen),
-            Math.min(currentText.length, offsets.end + endLen)
-          );
-          if ((!value.start || textWithContext.startsWith(value.start)) && (!value.end || textWithContext.endsWith(value.end))) {
-            let expandedStart = Math.max(0, offsets.start - startLen);
-            let start = currentText.slice(0, expandedStart);
-            const middle = currentText.slice(offsets.start, offsets.end);
-            let end = currentText.slice(Math.min(currentText.length, offsets.end + endLen));
-            for (const item of collapseList) {
-              if (value.start.startsWith(item) && !start.endsWith(item) && !middle.startsWith(item)) {
-                start += item;
-                expandedStart += item.length;
-              }
-              if (value.end.endsWith(item) && !end.startsWith(item) && !middle.endsWith(item)) end = item + end;
-            }
-            newText = start + middle + end;
-            if (value.prepare) newText = value.prepare(newText, 0);
-            newCursorStart = expandedStart;
-            newCursorEnd = expandedStart + offsets.end - offsets.start;
-          } else {
-            if (!value.start || !value.end) {
-              const offset = value.start ? offsets.start : offsets.end;
-              let start = currentText.slice(0, offset);
-              let end = currentText.slice(offset);
-              for (const item of collapseList) {
-                if (value.start.startsWith(item) && start.endsWith(item)) {
-                  start = start.slice(0, offsets.start - item.length);
-                  startLen -= item.length;
-                }
-                if (value.end.endsWith(item) && end.startsWith(item)) end = end.slice(item.length);
-              }
-              newText = (value.prepare?.(start, 0) ?? start) + (value.start || value.end) + (value.prepare?.(end, offset) ?? end);
-            } else {
-              let start = currentText.slice(0, offsets.start);
-              const middle = currentText.slice(offsets.start, offsets.end);
-              let end = currentText.slice(offsets.end);
-              for (const item of collapseList) {
-                if (value.start.startsWith(item) && start.endsWith(item)) {
-                  start = start.slice(0, offsets.start - item.length);
-                  startLen -= item.length;
-                }
-                if (value.end.endsWith(item) && end.startsWith(item)) end = end.slice(item.length);
-              }
-              newText = (value.prepare?.(start, 0) ?? start) + value.start + (value.prepare?.(middle, offsets.start) ?? middle) + value.end + (value.prepare?.(end, offsets.end) ?? end);
-            }
-            newCursorStart = offsets.start + startLen;
-            if (offsets.start !== offsets.end) newCursorEnd = newCursorStart + offsets.end - offsets.start;
-          }
-          break;
-        case WrapSelectionType.LINE_PREFIX:
-          const lineStart = currentText.lastIndexOf("\n", offsets.start - 1) + 1;
-          const lineEnd = currentText.indexOf("\n", offsets.end);
-          const actualLineEnd = lineEnd === -1 ? currentText.length : lineEnd;
-          const linesText = currentText.slice(lineStart, actualLineEnd);
-          const beforeLines = currentText.slice(0, lineStart);
-          const afterLines = currentText.slice(actualLineEnd);
-          const lines = linesText.split("\n");
-          if (lines.length === 0) lines.push("");
-          const allLinesHavePrefix = value.detectPattern ? lines.every((line) => !line.trim() || value.detectPattern.test(line)) : value.linePrefix ? lines.every((line) => !line.trim() || line.startsWith(value.linePrefix)) : false;
-          if (allLinesHavePrefix) {
-            const cleanText = lines.map((line) => preserveIndentation(line, "")).join("\n");
-            newText = beforeLines + cleanText + afterLines;
-            newCursorStart = lineStart;
-            newCursorEnd = lineStart + cleanText.length;
-          } else {
-            const processedText = value.lineTransformAll ? value.lineTransformAll(lines) : value.lineTransform ? lines.map(value.lineTransform).join("\n") : lines.map((line) => line.trim() ? preserveIndentation(line, value.linePrefix) : line).join("\n");
-            newText = beforeLines + processedText + afterLines;
-            newCursorStart = lineStart;
-            newCursorEnd = lineStart + processedText.length;
-          }
-          break;
-      }
-      isSetCaretNext = true;
-      emit("update:model-value", newText);
-      requestAnimationFrame(() => setCaret(newCursorStart, newCursorEnd));
-    };
-    const focus = () => {
-      elementRef.value?.focus();
-    };
-    const blur = () => {
-      elementRef.value?.blur();
-    };
-    onMounted(() => {
-      updateTextValue(props.value);
-      updateTextParts();
-    });
-    __expose({
-      focus,
-      blur,
-      wrapSelection,
-      setCaret,
-      getCaret,
-      get offsetWidth() {
-        return elementRef.value?.offsetWidth ?? 0;
-      }
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        ref: "element",
-        contenteditable: _ctx.readonly || _ctx.disabled ? "false" : "plaintext-only",
-        role: "textbox",
-        "aria-multiline": "true",
-        spellcheck: "false",
-        placeholder: _ctx.placeholder,
-        class: "relative whitespace-pre",
-        onInput,
-        onBeforeinput: _cache[0] || (_cache[0] = ($event) => insertParagraph($event)),
-        onPaste,
-        onKeydown: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("keydown", $event)),
-        onFocus: _cache[2] || (_cache[2] = ($event) => {
-          _ctx.$emit("focus", $event);
-          focused.value = true;
-        }),
-        onBlur: _cache[3] || (_cache[3] = ($event) => {
-          _ctx.$emit("blur", $event);
-          focused.value = false;
-        })
-      }, null, 40, _hoisted_1);
-    };
-  }
-});
 
 export { _sfc_main as default };

package/dist/components/Input/components/ContentEditable.vue2.js

@@ -1,5 +1,264 @@
-import _sfc_main from './ContentEditable.vue.js';
-
+import { defineComponent, useTemplateRef, ref, watch, onMounted, createElementBlock, openBlock, nextTick } from 'vue';
+import { WrapSelectionType } from '../../../utils/utils.js';
+import { preserveIndentation } from '../models/toolbarActions.js';
+import { getCaretOffset, setCaretOffset } from '../models/utils.js';
 
+const _hoisted_1 = ["contenteditable", "placeholder"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ContentEditable",
+  props: {
+    value: {},
+    placeholder: {},
+    maxLength: {},
+    textParts: {},
+    readonly: { type: Boolean },
+    disabled: { type: Boolean }
+  },
+  emits: ["update:model-value", "focus", "blur", "keydown"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const elementRef = useTemplateRef("element");
+    const focused = ref(false);
+    const updateTextParts = () => {
+      if (!elementRef.value || !props.textParts) return;
+      const offsets = getCaret();
+      let nodeIndex = 0;
+      for (const item of props.textParts) {
+        const existingNode = elementRef.value.childNodes[nodeIndex] ?? null;
+        if (typeof item === "string") {
+          const displayText = item.replace(/\n$/g, "\n ");
+          if (existingNode instanceof Text) {
+            if (existingNode.textContent !== displayText) existingNode.textContent = displayText;
+          } else {
+            const textNode = document.createTextNode(displayText);
+            elementRef.value.insertBefore(textNode, existingNode);
+          }
+        } else {
+          if (existingNode instanceof HTMLElement && existingNode.tagName.toLowerCase() === item.tag.toLowerCase()) {
+            if (existingNode.textContent !== item.value) existingNode.textContent = item.value;
+            if (existingNode.className !== (item.class || "")) existingNode.className = item.class || "";
+            if (item.edit === false && existingNode.getAttribute("contenteditable") !== "false") {
+              existingNode.setAttribute("contenteditable", "false");
+            }
+          } else {
+            const element = document.createElement(item.tag);
+            element.textContent = item.value;
+            element.setAttribute("contenteditable", item.edit ? "plaintext-only" : "false");
+            if (item.class) element.className = item.class;
+            elementRef.value.insertBefore(element, existingNode);
+          }
+        }
+        nodeIndex++;
+      }
+      while (elementRef.value.childNodes.length > props.textParts.length) {
+        const nodeToRemove = elementRef.value.childNodes[props.textParts.length];
+        elementRef.value.removeChild(nodeToRemove);
+      }
+      if (focused.value && !isSetCaretNext) setCaret(offsets.start, offsets.end !== offsets.start ? void 0 : offsets.end);
+    };
+    watch(() => props.textParts, updateTextParts, { immediate: true });
+    const updateTextValue = (value) => {
+      if (props.textParts || !elementRef.value) return;
+      if (elementRef.value.textContent !== value) {
+        const offsets = getCaret();
+        elementRef.value.textContent = value;
+        if (focused.value) setCaret(offsets.start, offsets.end !== offsets.start ? void 0 : offsets.end);
+      }
+    };
+    watch(() => props.value, updateTextValue, { immediate: true });
+    const textPartsToText = (parts) => {
+      return parts.map((part) => typeof part === "string" ? part : part.value).join("");
+    };
+    const getCurrentText = () => {
+      return props.textParts ? textPartsToText(props.textParts) : props.value;
+    };
+    const lineBreakEvents = ["insertParagraph", "insertLineBreak"];
+    const insertParagraph = (e) => {
+      if (lineBreakEvents.includes(e.inputType)) {
+        e.preventDefault();
+        insertPlain("\n");
+      }
+    };
+    const regexDifferentEnding = /\r\n?/g;
+    const regexSpaces = /\n \n/g;
+    const regexEnding = / +$/gm;
+    const normalizeText = (text) => {
+      return text.replace(regexDifferentEnding, "\n").replace(regexSpaces, "\n\n").replace(regexEnding, "");
+    };
+    const onInput = (e) => {
+      e.stopImmediatePropagation();
+      if (!(e.target instanceof HTMLDivElement)) return;
+      const rawText = e.target.textContent ?? "";
+      const text = normalizeText(rawText);
+      const currentText = getCurrentText();
+      if (text === currentText) return;
+      if (props.maxLength && typeof text === "string" && text.length > props.maxLength) {
+        e.preventDefault();
+        const substring = text.substring(0, props.maxLength);
+        if (!props.textParts) updateTextValue(substring);
+        else updateTextParts();
+        emit("update:model-value", substring);
+      } else {
+        emit("update:model-value", text);
+      }
+    };
+    const onPaste = async (e) => {
+      e.preventDefault();
+      navigator.clipboard.readText();
+      const text = (e.clipboardData?.getData("text/plain") || await navigator.clipboard.readText()).replace(/\r\n?/g, "\n");
+      insertPlain(text);
+    };
+    const insertPlain = (text) => {
+      const root = elementRef.value;
+      if (!root) return;
+      const { start, end, trail } = getCaret();
+      const currentText = getCurrentText();
+      const next = (currentText ?? "").slice(0, start) + " ".repeat(trail) + text + ((currentText ?? "").slice(end) || " ");
+      const caretAfter = start + text.length + trail;
+      emit("update:model-value", props.maxLength && next.length > props.maxLength ? next.substring(0, props.maxLength) : next);
+      nextTick(() => setCaret(props.maxLength ? Math.min(caretAfter, props.maxLength) : caretAfter));
+    };
+    const getCaret = () => getCaretOffset(elementRef.value);
+    let isSetCaretNext = false;
+    const setCaret = (indexStart, indexEnd) => {
+      isSetCaretNext = false;
+      setCaretOffset(elementRef.value, indexStart, indexEnd);
+    };
+    const collapseList = [" ", "\n"];
+    let offsetsOld = null;
+    const wrapSelection = (value) => {
+      if (focused.value || !offsetsOld) offsetsOld = getCaret();
+      const offsets = offsetsOld;
+      const currentText = getCurrentText() ?? "";
+      let newText = "";
+      let newCursorStart = offsets.start;
+      let newCursorEnd = void 0;
+      switch (value.type) {
+        case WrapSelectionType.TOGGLE:
+          let startLen = value.start.length;
+          const endLen = value.end.length;
+          const textWithContext = currentText.slice(
+            Math.max(0, offsets.start - startLen),
+            Math.min(currentText.length, offsets.end + endLen)
+          );
+          if ((!value.start || textWithContext.startsWith(value.start)) && (!value.end || textWithContext.endsWith(value.end))) {
+            let expandedStart = Math.max(0, offsets.start - startLen);
+            let start = currentText.slice(0, expandedStart);
+            const middle = currentText.slice(offsets.start, offsets.end);
+            let end = currentText.slice(Math.min(currentText.length, offsets.end + endLen));
+            for (const item of collapseList) {
+              if (value.start.startsWith(item) && !start.endsWith(item) && !middle.startsWith(item)) {
+                start += item;
+                expandedStart += item.length;
+              }
+              if (value.end.endsWith(item) && !end.startsWith(item) && !middle.endsWith(item)) end = item + end;
+            }
+            newText = start + middle + end;
+            if (value.prepare) newText = value.prepare(newText, 0);
+            newCursorStart = expandedStart;
+            newCursorEnd = expandedStart + offsets.end - offsets.start;
+          } else {
+            if (!value.start || !value.end) {
+              const offset = value.start ? offsets.start : offsets.end;
+              let start = currentText.slice(0, offset);
+              let end = currentText.slice(offset);
+              for (const item of collapseList) {
+                if (value.start.startsWith(item) && start.endsWith(item)) {
+                  start = start.slice(0, offsets.start - item.length);
+                  startLen -= item.length;
+                }
+                if (value.end.endsWith(item) && end.startsWith(item)) end = end.slice(item.length);
+              }
+              newText = (value.prepare?.(start, 0) ?? start) + (value.start || value.end) + (value.prepare?.(end, offset) ?? end);
+            } else {
+              let start = currentText.slice(0, offsets.start);
+              const middle = currentText.slice(offsets.start, offsets.end);
+              let end = currentText.slice(offsets.end);
+              for (const item of collapseList) {
+                if (value.start.startsWith(item) && start.endsWith(item)) {
+                  start = start.slice(0, offsets.start - item.length);
+                  startLen -= item.length;
+                }
+                if (value.end.endsWith(item) && end.startsWith(item)) end = end.slice(item.length);
+              }
+              newText = (value.prepare?.(start, 0) ?? start) + value.start + (value.prepare?.(middle, offsets.start) ?? middle) + value.end + (value.prepare?.(end, offsets.end) ?? end);
+            }
+            newCursorStart = offsets.start + startLen;
+            if (offsets.start !== offsets.end) newCursorEnd = newCursorStart + offsets.end - offsets.start;
+          }
+          break;
+        case WrapSelectionType.LINE_PREFIX:
+          const lineStart = currentText.lastIndexOf("\n", offsets.start - 1) + 1;
+          const lineEnd = currentText.indexOf("\n", offsets.end);
+          const actualLineEnd = lineEnd === -1 ? currentText.length : lineEnd;
+          const linesText = currentText.slice(lineStart, actualLineEnd);
+          const beforeLines = currentText.slice(0, lineStart);
+          const afterLines = currentText.slice(actualLineEnd);
+          const lines = linesText.split("\n");
+          if (lines.length === 0) lines.push("");
+          const allLinesHavePrefix = value.detectPattern ? lines.every((line) => !line.trim() || value.detectPattern.test(line)) : value.linePrefix ? lines.every((line) => !line.trim() || line.startsWith(value.linePrefix)) : false;
+          if (allLinesHavePrefix) {
+            const cleanText = lines.map((line) => preserveIndentation(line, "")).join("\n");
+            newText = beforeLines + cleanText + afterLines;
+            newCursorStart = lineStart;
+            newCursorEnd = lineStart + cleanText.length;
+          } else {
+            const processedText = value.lineTransformAll ? value.lineTransformAll(lines) : value.lineTransform ? lines.map(value.lineTransform).join("\n") : lines.map((line) => line.trim() ? preserveIndentation(line, value.linePrefix) : line).join("\n");
+            newText = beforeLines + processedText + afterLines;
+            newCursorStart = lineStart;
+            newCursorEnd = lineStart + processedText.length;
+          }
+          break;
+      }
+      isSetCaretNext = true;
+      emit("update:model-value", newText);
+      requestAnimationFrame(() => setCaret(newCursorStart, newCursorEnd));
+    };
+    const focus = () => {
+      elementRef.value?.focus();
+    };
+    const blur = () => {
+      elementRef.value?.blur();
+    };
+    onMounted(() => {
+      updateTextValue(props.value);
+      updateTextParts();
+    });
+    __expose({
+      focus,
+      blur,
+      wrapSelection,
+      setCaret,
+      getCaret,
+      get offsetWidth() {
+        return elementRef.value?.offsetWidth ?? 0;
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref: "element",
+        contenteditable: _ctx.readonly || _ctx.disabled ? "false" : "plaintext-only",
+        role: "textbox",
+        "aria-multiline": "true",
+        spellcheck: "false",
+        placeholder: _ctx.placeholder,
+        class: "relative whitespace-pre",
+        onInput,
+        onBeforeinput: _cache[0] || (_cache[0] = ($event) => insertParagraph($event)),
+        onPaste,
+        onKeydown: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("keydown", $event)),
+        onFocus: _cache[2] || (_cache[2] = ($event) => {
+          _ctx.$emit("focus", $event);
+          focused.value = true;
+        }),
+        onBlur: _cache[3] || (_cache[3] = ($event) => {
+          _ctx.$emit("blur", $event);
+          focused.value = false;
+        })
+      }, null, 40, _hoisted_1);
+    };
+  }
+});
 
 export { _sfc_main as default };

package/package.json

@@ -4,7 +4,7 @@
     "type": "git",
     "url": "https://github.com/rsmple/eco-vue-js.git"
   },
-  "version": "0.11.19",
+  "version": "0.11.20",
   "dependencies": {
     "@stylistic/eslint-plugin": "5.2.3",
     "@tanstack/eslint-plugin-query": "5.83.1",