npm - eco-vue-js - Versions diffs - 0.11.18 → 0.11.19 - Mend

eco-vue-js 0.11.18 → 0.11.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"WInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/WInput.vue"],"names":[],"mappings":"~~AAkPA~~;~~AAoiBA~~,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;WAmyBO,mBAAmB,CAAC,oCAAkE,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB;~~qBAvmB7B~~,IAAI;oBAOL,IAAI;+BAkCS,aAAa;0BA1KlB,MAAM,QAAQ,MAAM,KAAG,IAAI;wBAN/B,WAAW;;;oBAyBf,IAAI;oBAgBJ,IAAI;~~MAqsBgD~~,GAAG,IAAI;WACpE,GAAG;;uBAhEgB,GAAG;0BACA,GAAG;wBACJ,GAAG;;;YAEH,GAAG;;~~mCAngBF~~,aAAa;~~YAkgBb~~,GAAG;;;YAEJ,GAAG;uBACJ,GAAG;wBACF,GAAG;uBACJ,GAAG;uBACH,GAAG;wBACF,GAAG;;;~~YAptB1B~~,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;;~~EAiwBhB~~,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"}
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"}

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

@@ -5,7 +5,8 @@ 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/InputActions.vue.js';
+import _sfc_main$2 from './components/ContentEditable.vue.js';
+import _sfc_main$3 from './components/InputActions.vue.js';
 const _hoisted_1 = { class: "relative flex min-h-full flex-1" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -67,7 +68,6 @@ 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 InputToolbar = defineAsyncComponent(() => import('./components/InputToolbar.vue.js'));
-    const ContentEditable = defineAsyncComponent(() => import('./components/ContentEditable.vue.js'));
     const props = __props;
     const emit = __emit;
     const { isReadonly, isDisabled } = useComponentStates(props);
@@ -289,7 +289,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           name: "default",
           fn: withCtx(() => [
             createElementVNode("div", {
-              class: normalizeClass(["flex gap-1", {
+              class: normalizeClass(["flex max-w-full gap-1", {
                 "flex-wrap": !_ctx.seamless,
                 "overflow-hidden": _ctx.seamless
               }])
@@ -297,10 +297,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               renderSlot(_ctx.$slots, "prefix"),
               !_ctx.hideInput ? (openBlock(), createElementBlock("div", {
                 key: 0,
-                class: normalizeClass({
+                class: normalizeClass([{
                   "font-mono": _ctx.mono,
-                  "text-secure": _ctx.textSecure && !isSecureVisible.value && _ctx.modelValue
-                })
+                  "text-secure": _ctx.textSecure && !isSecureVisible.value && _ctx.modelValue,
+                  "whitespace-pre": _ctx.textarea
+                }, "overflow-x-auto overscroll-x-contain"])
               }, toDisplayString(_ctx.modelValue || _ctx.emptyValue), 3)) : createCommentVNode("", true)
             ], 2)
           ]),
@@ -320,7 +321,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               }]),
               onClick: focus
             }, [
-              _ctx.textarea && (_ctx.rich || _ctx.toolbarActions || _ctx.$slots.toolbar) ? (openBlock(), createBlock(unref(InputToolbar), {
+              !unref(isDisabled) && !unref(isReadonly) && _ctx.textarea && (_ctx.rich || _ctx.toolbarActions || _ctx.$slots.toolbar) ? (openBlock(), createBlock(unref(InputToolbar), {
                 key: 0,
                 list: _ctx.toolbarActions,
                 rich: _ctx.rich === true,
@@ -377,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 ? unref(ContentEditable) : "input"), {
+                      (openBlock(), createBlock(resolveDynamicComponent(_ctx.textarea ? _sfc_main$2 : "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", {
@@ -431,7 +432,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   ], 2)
                 ], 2)
               ], 2),
-              !_ctx.seamless || focused ? (openBlock(), createBlock(_sfc_main$2, {
+              !_ctx.seamless || focused ? (openBlock(), createBlock(_sfc_main$3, {
                 key: 2,
                 "model-value": _ctx.modelValue,
                 loading: _ctx.loading,

package/dist/components/Input/components/ContentEditable.vue.d.ts CHANGED Viewed

@@ -4,13 +4,17 @@ type __VLS_Props = {
     placeholder: string;
     maxLength: number;
     textParts: TextPart[] | undefined;
+    readonly: boolean | undefined;
+    disabled: boolean | undefined;
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {
     focus: () => void;
     blur: () => void;
     wrapSelection: (value: WrapSelection) => void;
     setCaret: (indexStart: number, indexEnd?: number) => void;
-    getCaret: () => import('../models/utils').CaretOffset;
+    getCaret: () => import('../models/utils').CaretOffset & {
+        trail: number;
+    };
     offsetWidth: number;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
     blur: (value: FocusEvent) => any;

package/dist/components/Input/components/ContentEditable.vue.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ContentEditable.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/Input/components/ContentEditable.vue"],"names":[],"mappings":"AAiBA;~~AAyUA~~,OAAO,KAAK,EAAC,QAAQ,EAAG,aAAa,EAAC,MAAM,UAAU,CAAA;AAStD,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,EAAE,QAAQ,EAAE,GAAG,SAAS,CAAA;~~CAClC~~,CAAC;;;;~~2BAsK4B~~,aAAa,KAAG,IAAI;2BATpB,MAAM,aAAa,MAAM~~;;;;;;;;;;;;;;;;~~AAsNvD,wBAUG"}
1	+ {"version":3,"file":"ContentEditable.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/Input/components/ContentEditable.vue"],"names":[],"mappings":"AAiBA;AA0UA,OAAO,KAAK,EAAC,QAAQ,EAAG,aAAa,EAAC,MAAM,UAAU,CAAA;AAStD,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,EAAE,QAAQ,EAAE,GAAG,SAAS,CAAA;IACjC,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7B,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAA;CAC9B,CAAC;;;;2BAqK4B,aAAa,KAAG,IAAI;2BATpB,MAAM,aAAa,MAAM;;;;;;;;;;;;;;;;;;AAsNvD,wBAUG"}

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

@@ -1,5 +1,264 @@
-import _sfc_main from './ContentEditable.vue2.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/dist/components/Input/components/ContentEditable.vue2.js CHANGED Viewed

@@ -1,263 +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.vue.js';
-const _hoisted_1 = ["placeholder"];
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "ContentEditable",
-  props: {
-    value: {},
-    placeholder: {},
-    maxLength: {},
-    textParts: {}
-  },
-  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 || "";
-            const contentEditable = item.edit ? "plaintext-only" : "false";
-            if (existingNode.getAttribute("contenteditable") !== contentEditable) {
-              existingNode.setAttribute("contenteditable", contentEditable);
-            }
-          } 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 } = getCaret();
-      const currentText = getCurrentText();
-      const next = (currentText ?? "").slice(0, start) + text + ((currentText ?? "").slice(end) || " ");
-      const caretAfter = start + text.length;
-      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: "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/models/utils.d.ts CHANGED Viewed

@@ -3,5 +3,7 @@ export type CaretOffset = {
     end: number;
 };
 export declare const setCaretOffset: (parent: Element | null | undefined, indexStart: number, indexEnd: number | undefined) => void;
-export declare const getCaretOffset: (parent: Element | null | undefined) => CaretOffset;
+export declare const getCaretOffset: (parent: Element | null | undefined) => CaretOffset & {
+    trail: number;
+};
 //# sourceMappingURL=utils.d.ts.map

package/dist/components/Input/models/utils.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../src/components/Input/models/utils.ts"],"names":[],"mappings":"AAwBA,MAAM,MAAM,WAAW,GAAG;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAC,CAAA;AAEtD,eAAO,MAAM,cAAc,GAAI,QAAQ,OAAO,GAAG,IAAI,GAAG,SAAS,EAAE,YAAY,MAAM,EAAE,UAAU,MAAM,GAAG,SAAS,SAelH,CAAA;~~AAqBD~~,eAAO,MAAM,cAAc,GAAI,QAAQ,OAAO,GAAG,IAAI,GAAG,SAAS,KAAG,~~WAUnE~~,CAAA"}
1	+ {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../src/components/Input/models/utils.ts"],"names":[],"mappings":"AAwBA,MAAM,MAAM,WAAW,GAAG;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAC,CAAA;AAEtD,eAAO,MAAM,cAAc,GAAI,QAAQ,OAAO,GAAG,IAAI,GAAG,SAAS,EAAE,YAAY,MAAM,EAAE,UAAU,MAAM,GAAG,SAAS,SAelH,CAAA;AA6BD,eAAO,MAAM,cAAc,GAAI,QAAQ,OAAO,GAAG,IAAI,GAAG,SAAS,KAAG,WAAW,GAAG;IAAC,KAAK,EAAE,MAAM,CAAA;CAU/F,CAAA"}

package/dist/components/Input/models/utils.js CHANGED Viewed

@@ -29,28 +29,34 @@ const setCaretOffset = (parent, indexStart, indexEnd) => {
   selection?.removeAllRanges();
   selection?.addRange(range);
 };
+const endSpacesRegex = /\s+$/;
 const getOffsetFromNode = (parent, targetNode, targetOffset, isStart) => {
   if (!parent.firstChild) parent.appendChild(document.createTextNode(""));
   const walker = document.createTreeWalker(parent, NodeFilter.SHOW_TEXT, null);
   let node, offset = 0;
   while (node = walker.nextNode()) {
     if (node.parentElement?.contentEditable === "false") {
-      if (isStart && node === targetNode) return offset;
+      if (isStart && node === targetNode) return { offset, trail: 0 };
     } else if (node === targetNode) {
-      return offset + targetOffset;
+      const text = node.textContent;
+      if (text?.[targetOffset] === "\n") {
+        const trail = text.slice(0, targetOffset).match(endSpacesRegex)?.[0]?.length ?? 0;
+        return { offset: offset + targetOffset - trail, trail };
+      }
+      return { offset: offset + targetOffset, trail: 0 };
     }
     offset += node.nodeValue?.length ?? 0;
   }
-  return offset;
+  return { offset, trail: 0 };
 };
 const getCaretOffset = (parent) => {
-  if (!parent) return { start: 0, end: 0 };
+  if (!parent) return { start: 0, end: 0, trail: 0 };
   const selection = window.getSelection();
-  if (!selection || selection.rangeCount === 0) return { start: 0, end: 0 };
+  if (!selection || selection.rangeCount === 0) return { start: 0, end: 0, trail: 0 };
   const range = selection.getRangeAt(0);
   const start = getOffsetFromNode(parent, range.startContainer, range.startOffset, true);
   const end = range.startOffset !== range.endOffset ? getOffsetFromNode(parent, range.endContainer, range.endOffset, false) : start;
-  return { start, end };
+  return { start: start.offset, end: end.offset, trail: end.trail };
 };
 export { getCaretOffset, setCaretOffset };

package/package.json CHANGED Viewed

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