vlite3 1.1.8 → 1.1.9

package/components/RichTextEditor/RichTextEditor.vue.js

@@ -0,0 +1,332 @@
+import { defineComponent as te, ref as v, shallowRef as ne, watch as oe, computed as h, onMounted as le, onUnmounted as ae, openBlock as C, createElementBlock as L, normalizeClass as re, toDisplayString as I, createCommentVNode as U, createElementVNode as w, createVNode as q, unref as a, normalizeStyle as ie } from "vue";
+/* empty css                         */
+import de from "./RichTextToolbar.vue.js";
+/* empty css                     */
+import se from "./RichTextLinkPopover.vue.js";
+/* empty css                         */
+import { useRichTextImageUpload as ue } from "./composables/useRichTextImageUpload.js";
+import { useRichTextLinks as ce } from "./composables/useRichTextLinks.js";
+const fe = ["aria-labelledby", "aria-describedby"], me = ["id", "for"], ve = { class: "rte-wrapper" }, ge = { class: "rte-body-wrap" }, ye = ["id", "contenteditable", "aria-label", "aria-readonly", "aria-disabled", "aria-invalid"], be = ["id"], Se = /* @__PURE__ */ te({
+  __name: "RichTextEditor",
+  props: {
+    modelValue: { default: "" },
+    placeholder: { default: "Start typing…" },
+    disabled: { type: Boolean, default: !1 },
+    minHeight: { default: "180px" },
+    maxHeight: { default: "" },
+    label: {},
+    error: {},
+    id: {},
+    readonly: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "focus", "blur", "image-removed"],
+  setup(o, { emit: N }) {
+    const i = o, b = N, r = v(null), A = v(null), x = v(null), R = v(!1), T = v(!0), B = ne({
+      bold: !1,
+      italic: !1,
+      underline: !1,
+      strikeThrough: !1,
+      insertOrderedList: !1,
+      insertUnorderedList: !1,
+      justifyLeft: !1,
+      justifyCenter: !1,
+      justifyRight: !1
+    }), S = v("");
+    let u = null, c = null, p = !1;
+    function g() {
+      if (p) return;
+      const e = window.getSelection();
+      if (e && e.rangeCount > 0)
+        try {
+          u = e.getRangeAt(0).cloneRange();
+        } catch {
+          u = null;
+        }
+    }
+    function y() {
+      if (!(!u || p))
+        try {
+          const e = window.getSelection();
+          e?.removeAllRanges(), e?.addRange(u);
+        } catch {
+          u = null;
+        }
+    }
+    oe(
+      () => i.modelValue,
+      (e) => {
+        const t = r.value;
+        if (!t) return;
+        const n = e ?? "";
+        t.innerHTML !== n && (t.innerHTML = n, E(), P());
+      }
+    );
+    let H = /* @__PURE__ */ new Set();
+    function P() {
+      const e = r.value;
+      if (!e) return;
+      const t = new Set(
+        Array.from(e.querySelectorAll("img")).map((n) => n.getAttribute("src") || "").filter((n) => n && !n.startsWith("blob:"))
+      );
+      for (const n of H)
+        t.has(n) || b("image-removed", n);
+      H = t;
+    }
+    const $ = {
+      saveSelection: g,
+      restoreSelection: y,
+      onInput: f
+    };
+    h(() => r.value);
+    const {
+      imageInputRef: z,
+      isUploadingImage: W,
+      triggerImageUpload: Y,
+      onImageFileChange: D,
+      onPaste: j,
+      onDrop: V
+    } = ue(r, $), l = ce({
+      editorRef: r,
+      rootRef: A,
+      linkPopoverElRef: x,
+      callbacks: $
+    });
+    le(() => {
+      const e = r.value;
+      e && i.modelValue && (e.innerHTML = i.modelValue), E(), P(), document.addEventListener("selectionchange", F), document.addEventListener("mousedown", M, !0), document.addEventListener("keydown", K, !0);
+    }), ae(() => {
+      p = !0, u = null, c !== null && cancelAnimationFrame(c), document.removeEventListener("selectionchange", F), document.removeEventListener("mousedown", M, !0), document.removeEventListener("keydown", K, !0);
+    });
+    function E() {
+      const e = r.value;
+      if (!e) return;
+      const t = (e.textContent ?? "").trim();
+      T.value = t === "" && !e.querySelector("img");
+    }
+    function f() {
+      E(), b("update:modelValue", r.value?.innerHTML ?? ""), P(), s();
+    }
+    function k(e, t) {
+      if (!(i.disabled || i.readonly)) {
+        y(), r.value?.focus();
+        try {
+          document.execCommand(e, !1, t ?? void 0);
+        } catch {
+        }
+        s(), f();
+      }
+    }
+    function G(e) {
+      if (!(i.disabled || i.readonly)) {
+        y(), r.value?.focus();
+        try {
+          document.execCommand("formatBlock", !1, e);
+        } catch {
+        }
+        s(), f();
+      }
+    }
+    function J() {
+      if (!(i.disabled || i.readonly)) {
+        y(), r.value?.focus();
+        try {
+          document.execCommand("removeFormat", !1, void 0), document.execCommand("formatBlock", !1, "div");
+        } catch {
+        }
+        s(), f();
+      }
+    }
+    function Q() {
+      if (i.disabled || i.readonly) return;
+      y(), r.value?.focus();
+      const e = window.getSelection();
+      if (!e || e.rangeCount === 0 || e.isCollapsed) return;
+      const t = e.getRangeAt(0);
+      try {
+        const n = document.createElement("code");
+        t.surroundContents(n), e.removeAllRanges();
+      } catch {
+        const n = t.extractContents(), O = document.createElement("code");
+        O.appendChild(n), t.insertNode(O), e.removeAllRanges();
+      }
+      s(), f();
+    }
+    function s() {
+      c !== null && cancelAnimationFrame(c), c = requestAnimationFrame(() => {
+        c = null, X();
+      });
+    }
+    function d(e) {
+      try {
+        return document.queryCommandState(e);
+      } catch {
+        return !1;
+      }
+    }
+    function X() {
+      if (!p) {
+        B.value = {
+          bold: d("bold"),
+          italic: d("italic"),
+          underline: d("underline"),
+          strikeThrough: d("strikeThrough"),
+          insertOrderedList: d("insertOrderedList"),
+          insertUnorderedList: d("insertUnorderedList"),
+          justifyLeft: d("justifyLeft"),
+          justifyCenter: d("justifyCenter"),
+          justifyRight: d("justifyRight")
+        };
+        try {
+          S.value = document.queryCommandValue("formatBlock").toLowerCase();
+        } catch {
+          S.value = "";
+        }
+        l.checkLinkAtCursor();
+      }
+    }
+    function F() {
+      const e = r.value;
+      if (!e) return;
+      const t = document.activeElement;
+      t !== e && !e.contains(t) || (g(), s());
+    }
+    function Z(e) {
+      if (e.ctrlKey || e.metaKey)
+        switch (e.key.toLowerCase()) {
+          case "b":
+            e.preventDefault(), k("bold");
+            break;
+          case "i":
+            e.preventDefault(), k("italic");
+            break;
+          case "u":
+            e.preventDefault(), k("underline");
+            break;
+          case "k":
+            e.preventDefault(), l.openLinkPopover();
+            break;
+        }
+    }
+    function M(e) {
+      if (!l.linkPopover.value.visible) return;
+      const t = x.value?.$el;
+      t && t.contains(e.target) || r.value?.contains(e.target) || l.closeLinkPopover();
+    }
+    function K(e) {
+      e.key === "Escape" && l.linkPopover.value.visible && l.closeLinkPopover();
+    }
+    const _ = h(() => ({
+      minHeight: i.minHeight,
+      ...i.maxHeight ? { maxHeight: i.maxHeight, overflowY: "auto" } : {}
+    })), ee = h(() => ({
+      transform: `translate(${l.linkPopover.value.x}px, ${l.linkPopover.value.y}px)`
+    })), m = h(() => i.id ?? `rte-${Math.random().toString(36).slice(2, 7)}`);
+    return (e, t) => (C(), L("div", {
+      ref_key: "rootRef",
+      ref: A,
+      class: re(["rte-root", [
+        o.error && "rte-error",
+        o.disabled && "rte-disabled",
+        o.readonly && "rte-readonly",
+        R.value && "rte-focused"
+      ]]),
+      role: "group",
+      "aria-labelledby": o.label ? `${m.value}-label` : void 0,
+      "aria-describedby": o.error ? `${m.value}-error` : void 0
+    }, [
+      o.label ? (C(), L("label", {
+        key: 0,
+        id: `${m.value}-label`,
+        for: m.value,
+        class: "rte-label"
+      }, I(o.label), 9, me)) : U("", !0),
+      w("div", ve, [
+        q(de, {
+          toolbarState: B.value,
+          activeBlock: S.value,
+          disabled: o.disabled,
+          readonly: o.readonly,
+          isUploadingImage: a(W),
+          label: o.label,
+          onCommand: k,
+          onSetBlock: G,
+          onInsertCode: Q,
+          onTriggerImageUpload: t[0] || (t[0] = (n) => a(Y)(!(!o.disabled && !o.readonly))),
+          onOpenLinkPopover: a(l).openLinkPopover,
+          onClearFormat: J
+        }, null, 8, ["toolbarState", "activeBlock", "disabled", "readonly", "isUploadingImage", "label", "onOpenLinkPopover"]),
+        w("div", ge, [
+          w("div", {
+            id: m.value,
+            ref_key: "editorRef",
+            ref: r,
+            class: "rte-editor",
+            style: ie(_.value),
+            contenteditable: !o.disabled && !o.readonly ? "true" : "false",
+            role: "textbox",
+            "aria-multiline": "true",
+            "aria-label": o.label ?? o.placeholder,
+            "aria-readonly": o.readonly || void 0,
+            "aria-disabled": o.disabled || void 0,
+            "aria-invalid": !!o.error || void 0,
+            spellcheck: "true",
+            onInputPassive: f,
+            onFocus: t[1] || (t[1] = (n) => {
+              R.value = !0, g(), s(), b("focus", n);
+            }),
+            onBlur: t[2] || (t[2] = (n) => {
+              R.value = !1, b("blur", n);
+            }),
+            onKeydown: Z,
+            onKeyupPassive: g,
+            onMouseupPassive: g,
+            onPaste: t[3] || (t[3] = //@ts-ignore
+            (...n) => a(j) && a(j)(...n)),
+            onDrop: t[4] || (t[4] = //@ts-ignore
+            (...n) => a(V) && a(V)(...n))
+          }, null, 44, ye),
+          w("input", {
+            ref_key: "imageInputRef",
+            ref: z,
+            type: "file",
+            accept: "image/jpeg,image/png,image/webp,image/gif,image/svg+xml",
+            class: "rte-hidden-input",
+            style: { display: "none" },
+            "aria-hidden": "true",
+            tabindex: "-1",
+            onChange: t[5] || (t[5] = //@ts-ignore
+            (...n) => a(D) && a(D)(...n))
+          }, null, 544),
+          T.value && !o.disabled ? (C(), L("div", {
+            key: 0,
+            class: "rte-placeholder",
+            "aria-hidden": "true",
+            onClick: t[6] || (t[6] = (n) => r.value?.focus())
+          }, I(o.placeholder), 1)) : U("", !0),
+          q(se, {
+            ref_key: "linkPopoverCompRef",
+            ref: x,
+            visible: a(l).linkPopover.value.visible,
+            isEditing: a(l).linkPopover.value.isEditing,
+            url: a(l).linkPopover.value.url,
+            popoverStyle: ee.value,
+            "onUpdate:url": a(l).updateUrl,
+            onApply: a(l).applyLink,
+            onUnlink: a(l).unlinkCurrent,
+            onOpenTab: a(l).openLinkInTab,
+            onClose: a(l).closeLinkPopover
+          }, null, 8, ["visible", "isEditing", "url", "popoverStyle", "onUpdate:url", "onApply", "onUnlink", "onOpenTab", "onClose"])
+        ])
+      ]),
+      o.error ? (C(), L("p", {
+        key: 1,
+        id: `${m.value}-error`,
+        class: "rte-error-msg",
+        "aria-live": "polite"
+      }, I(o.error), 9, be)) : U("", !0)
+    ], 10, fe));
+  }
+});
+export {
+  Se as default
+};

package/components/RichTextEditor/RichTextEditor.vue3.js

@@ -0,0 +1,5 @@
+import o from "./RichTextEditor.vue.js";
+/* empty css                    */
+export {
+  o as default
+};

package/components/RichTextEditor/RichTextLinkPopover.vue.js

@@ -0,0 +1,107 @@
+import { defineComponent as b, ref as x, openBlock as o, createBlock as w, Transition as E, withCtx as g, createElementBlock as d, withModifiers as r, normalizeStyle as T, createElementVNode as a, createVNode as s, createTextVNode as k, createCommentVNode as c, nextTick as B } from "vue";
+import u from "../Icon.vue.js";
+const M = { class: "rte-link-input-row" }, I = ["value"], N = ["disabled"], R = { class: "rte-link-actions-row" }, C = /* @__PURE__ */ b({
+  __name: "RichTextLinkPopover",
+  props: {
+    visible: { type: Boolean },
+    isEditing: { type: Boolean },
+    url: {},
+    popoverStyle: {}
+  },
+  emits: ["update:url", "apply", "unlink", "openTab", "close"],
+  setup(t, { expose: f, emit: y }) {
+    const n = y, p = x(null);
+    function m() {
+      B(() => {
+        p.value?.focus();
+      });
+    }
+    f({
+      focusInput: m,
+      el: p
+      // fallback if needed
+    });
+    function v(i) {
+      i.key === "Enter" && (i.preventDefault(), n("apply")), i.key === "Escape" && (i.preventDefault(), n("close"));
+    }
+    return (i, e) => (o(), w(E, { name: "rte-pop" }, {
+      default: g(() => [
+        t.visible ? (o(), d("div", {
+          key: 0,
+          class: "rte-link-popover",
+          style: T(t.popoverStyle),
+          role: "dialog",
+          "aria-label": "Link editor",
+          "aria-modal": "false",
+          onMousedown: e[4] || (e[4] = r(() => {
+          }, ["stop"]))
+        }, [
+          a("div", M, [
+            s(u, {
+              icon: "lucide:link-2",
+              class: "rte-link-icon-prefix",
+              "aria-hidden": "true"
+            }),
+            a("input", {
+              ref_key: "linkInputRef",
+              ref: p,
+              value: t.url,
+              onInput: e[0] || (e[0] = (l) => n("update:url", l.target.value)),
+              type: "url",
+              placeholder: "https://example.com",
+              class: "rte-link-input",
+              "aria-label": "URL to link to",
+              onKeydown: v
+            }, null, 40, I),
+            a("button", {
+              type: "button",
+              class: "rte-btn rte-link-apply-btn",
+              title: "Apply link",
+              "aria-label": "Apply link",
+              disabled: !t.url.trim(),
+              onMousedown: e[1] || (e[1] = r((l) => n("apply"), ["prevent"]))
+            }, [
+              s(u, {
+                icon: "lucide:check",
+                class: "rte-icon",
+                "aria-hidden": "true"
+              })
+            ], 40, N)
+          ]),
+          a("div", R, [
+            t.isEditing ? (o(), d("button", {
+              key: 0,
+              type: "button",
+              class: "rte-link-action-btn rte-link-action-btn--danger",
+              onMousedown: e[2] || (e[2] = r((l) => n("unlink"), ["prevent"]))
+            }, [
+              s(u, {
+                icon: "lucide:unlink",
+                class: "rte-icon",
+                "aria-hidden": "true"
+              }),
+              e[5] || (e[5] = k(" Unlink ", -1))
+            ], 32)) : c("", !0),
+            t.isEditing && t.url ? (o(), d("button", {
+              key: 1,
+              type: "button",
+              class: "rte-link-action-btn",
+              onMousedown: e[3] || (e[3] = r((l) => n("openTab"), ["prevent"]))
+            }, [
+              s(u, {
+                icon: "lucide:external-link",
+                class: "rte-icon",
+                "aria-hidden": "true"
+              }),
+              e[6] || (e[6] = k(" Open ", -1))
+            ], 32)) : c("", !0)
+          ])
+        ], 36)) : c("", !0)
+      ]),
+      _: 1
+    }));
+  }
+});
+export {
+  C as default
+};

package/components/RichTextEditor/RichTextLinkPopover.vue3.js

@@ -0,0 +1,5 @@
+import o from "./RichTextLinkPopover.vue.js";
+/* empty css                         */
+export {
+  o as default
+};

package/components/RichTextEditor/RichTextReader.vue.js

@@ -0,0 +1,7 @@
+import o from "./RichTextReader.vue2.js";
+/* empty css                    */
+import t from "../../_virtual/_plugin-vue_export-helper.js";
+const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-55b9fd8b"]]);
+export {
+  f as default
+};

package/components/RichTextEditor/RichTextReader.vue2.js

@@ -0,0 +1,19 @@
+import { defineComponent as t, openBlock as n, createElementBlock as o, createElementVNode as r } from "vue";
+/* empty css                         */
+const c = { class: "rte-reader" }, s = ["innerHTML"], _ = /* @__PURE__ */ t({
+  __name: "RichTextReader",
+  props: {
+    content: { default: "" }
+  },
+  setup(e) {
+    return (a, i) => (n(), o("div", c, [
+      r("div", {
+        class: "rte-content",
+        innerHTML: e.content
+      }, null, 8, s)
+    ]));
+  }
+});
+export {
+  _ as default
+};