@jsg-developer/vue-pack 0.0.8 → 0.0.9-beta-2

package/dist/chunks/{TextAreaQuill-eYXH5fmB.es.js → TextAreaQuill-CJyF1I1R.es.js}

@@ -1,18 +1,18 @@
-import { defineComponent as Q, ref as r, computed as M, watch as V, createBlock as D, openBlock as i, Transition as B, withCtx as C, createElementBlock as c, createCommentVNode as f, withModifiers as O, createVNode as P, createElementVNode as e, toDisplayString as I, normalizeClass as A, withDirectives as _, vModelText as R, withKeys as G, inject as ee, onMounted as te, onUnmounted as se, Teleport as le, createTextVNode as F, unref as de, Fragment as ae, renderList as oe } from "vue";
-import N from "dompurify";
-import { ab as H, U as ne, z as re, a9 as E, a as ie } from "./resize-BCFyG_8Z.es.js";
+import { defineComponent as Q, ref as n, computed as M, watch as I, createBlock as B, openBlock as r, Transition as D, withCtx as E, createElementBlock as j, createCommentVNode as x, withModifiers as G, createVNode as P, createElementVNode as e, toDisplayString as C, normalizeClass as A, withDirectives as V, vModelText as z, withKeys as K, inject as le, onMounted as de, onUnmounted as ae, Teleport as oe, createTextVNode as F, unref as ne, vShow as re, Fragment as ie, renderList as ue } from "vue";
+import H from "dompurify";
+import { ac as N, U as ge, z as je, aa as _, a as ce } from "./resize-2N3sqejU.es.js";
 import "lodash.isequal";
 import "zod";
-const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsgd-shadow-2xl jsgd-overflow-hidden dark:jsgd-bg-slate-800" }, ue = { class: "jsgd-p-5 jsgd-border-b jsgd-border-slate-200 dark:jsgd-border-slate-700" }, je = { class: "jsgd-text-lg jsgd-font-bold jsgd-text-slate-900 dark:jsgd-text-slate-100" }, ce = { class: "jsgd-p-5 jsgd-flex jsgd-flex-col jsgd-gap-5" }, me = {
+const me = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsgd-shadow-2xl jsgd-overflow-hidden dark:jsgd-bg-slate-800" }, be = { class: "jsgd-p-5 jsgd-border-b jsgd-border-slate-200 dark:jsgd-border-slate-700" }, ve = { class: "jsgd-text-lg jsgd-font-bold jsgd-text-slate-900 dark:jsgd-text-slate-100" }, pe = { class: "jsgd-p-5 jsgd-flex jsgd-flex-col jsgd-gap-5" }, fe = {
   key: 0,
   class: "jsgd-flex jsgd-w-full jsgd-p-1 jsgd-bg-slate-100 jsgd-rounded-lg dark:jsgd-bg-slate-700"
-}, be = { key: 1 }, ve = {
+}, xe = { key: 1 }, he = {
   key: 2,
   class: "jsgd-box-border"
-}, pe = ["placeholder"], xe = { key: 3 }, fe = ["accept"], he = {
+}, ke = ["placeholder"], we = { key: 3 }, ye = ["accept"], qe = {
   key: 0,
   class: "jsgd-mt-4"
-}, ke = ["src"], we = { key: 4 }, ye = { class: "jsgd-p-4 jsgd-bg-slate-50 jsgd-flex jsgd-justify-end jsgd-gap-3 dark:jsgd-bg-slate-900/50" }, qe = ["disabled"], Ue = { key: 0 }, Te = { key: 1 }, Le = /* @__PURE__ */ Q({
+}, Ue = ["src"], Te = { key: 4 }, Le = { class: "jsgd-p-4 jsgd-bg-slate-50 jsgd-flex jsgd-justify-end jsgd-gap-3 dark:jsgd-bg-slate-900/50" }, Me = ["disabled"], Ve = { key: 0 }, Se = { key: 1 }, $e = /* @__PURE__ */ Q({
   __name: "QuillEmbedModal",
   props: {
     show: { type: Boolean },
@@ -22,8 +22,8 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
     initialText: {}
   },
   emits: ["close", "submit"],
-  setup(g, { emit: S }) {
-    const s = g, h = S, l = r(""), m = r(""), b = r(null), k = r(""), v = r(null), p = r(!1), u = r("url"), w = M(() => !!s.uploadUrl), z = M(() => {
+  setup(u, { emit: S }) {
+    const s = u, h = S, l = n(""), b = n(""), v = n(null), k = n(""), p = n(null), f = n(!1), g = n("url"), w = M(() => !!s.uploadUrl), R = M(() => {
       switch (s.mode) {
         case "image":
           return "Insert Image";
@@ -34,30 +34,30 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
         default:
           return "Insert Media";
       }
-    }), j = M(() => s.mode === "video" ? "e.g., YouTube, Vimeo URL" : "https://...");
-    V(
+    }), c = M(() => s.mode === "video" ? "e.g., YouTube, Vimeo URL" : "https://...");
+    I(
       () => s.show,
-      (x) => {
-        x && (u.value = w.value ? "upload" : "url", l.value = s.initialValue || "", k.value = s.initialText || "", m.value = "", b.value = null, v.value = null, p.value = !1);
+      (m) => {
+        m && (g.value = w.value ? "upload" : "url", l.value = s.initialValue || "", k.value = s.initialText || "", b.value = "", v.value = null, p.value = null, f.value = !1);
       }
     );
     function U() {
       h("close");
     }
-    function T(x) {
-      const d = x.target;
-      if (d.files && d.files[0] && (b.value = d.files[0], s.mode === "image")) {
-        const n = new FileReader();
-        n.onload = (L) => {
-          v.value = L.target?.result;
-        }, n.readAsDataURL(b.value);
+    function T(m) {
+      const d = m.target;
+      if (d.files && d.files[0] && (v.value = d.files[0], s.mode === "image")) {
+        const i = new FileReader();
+        i.onload = (L) => {
+          p.value = L.target?.result;
+        }, i.readAsDataURL(v.value);
       }
     }
     async function $() {
-      p.value = !0;
+      f.value = !0;
       try {
-        if (u.value === "upload" && w.value) {
-          if (!b.value) {
+        if (g.value === "upload" && w.value) {
+          if (!v.value) {
             alert("Please select a file to upload.");
             return;
           }
@@ -65,114 +65,114 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
             alert("Upload API URL is not configured.");
             return;
           }
-          const x = new FormData();
-          x.append("file", b.value);
-          const d = await fetch(s.uploadUrl, { method: "POST", body: x });
+          const m = new FormData();
+          m.append("file", v.value);
+          const d = await fetch(s.uploadUrl, { method: "POST", body: m });
           if (!d.ok) throw new Error("Upload failed");
-          const n = await d.json(), L = n.url || n.secure_url || n.path || n.data?.url || n.data?.path || n.data?.secure_url;
+          const i = await d.json(), L = i.url || i.secure_url || i.path || i.data?.url || i.data?.path || i.data?.secure_url;
           if (!L) throw new Error("URL not found in upload response");
-          h("submit", { url: L, alt: m.value, text: k.value });
+          h("submit", { url: L, alt: b.value, text: k.value });
         } else {
           if (!l.value) {
             alert("Please enter a URL.");
             return;
           }
-          h("submit", { url: l.value, alt: m.value, text: k.value });
+          h("submit", { url: l.value, alt: b.value, text: k.value });
         }
-      } catch (x) {
-        console.error(x), alert(x.message || "An error occurred.");
+      } catch (m) {
+        console.error(m), alert(m.message || "An error occurred.");
       } finally {
-        p.value = !1;
+        f.value = !1;
       }
     }
-    return (x, d) => (i(), D(B, {
+    return (m, d) => (r(), B(D, {
       name: "jsgd-modal-overlay",
       appear: ""
     }, {
-      default: C(() => [
-        g.show ? (i(), c("div", {
+      default: E(() => [
+        u.show ? (r(), j("div", {
           key: 0,
           class: "jsgd-fixed jsgd-inset-0 jsgd-z-[10000000] jsgd-flex jsgd-items-center jsgd-justify-center jsgd-p-4 jsgd-bg-black/60 jsgd-backdrop-blur-sm",
-          onClick: O(U, ["self"])
+          onClick: G(U, ["self"])
         }, [
-          P(B, {
+          P(D, {
             name: "jsgd-modal-container",
             appear: ""
           }, {
-            default: C(() => [
-              e("div", ge, [
-                e("div", ue, [
-                  e("h3", je, I(z.value), 1)
+            default: E(() => [
+              e("div", me, [
+                e("div", be, [
+                  e("h3", ve, C(R.value), 1)
                 ]),
-                e("div", ce, [
-                  w.value && g.mode !== "link" ? (i(), c("div", me, [
+                e("div", pe, [
+                  w.value && u.mode !== "link" ? (r(), j("div", fe, [
                     e("button", {
-                      onClick: d[0] || (d[0] = (n) => u.value = "upload"),
+                      onClick: d[0] || (d[0] = (i) => g.value = "upload"),
                       class: A([
                         "jsgd-flex-1 jsgd-py-1.5 jsgd-px-3 jsgd-text-sm jsgd-font-semibold jsgd-rounded-md jsgd-transition-colors jsgd-duration-200",
-                        u.value === "upload" ? "jsgd-bg-white jsgd-text-blue-600 jsgd-shadow-sm dark:jsgd-bg-slate-600 dark:jsgd-text-white" : "jsgd-bg-transparent jsgd-text-slate-500 hover:jsgd-text-slate-700 dark:jsgd-text-slate-400 dark:hover:jsgd-text-slate-200"
+                        g.value === "upload" ? "jsgd-bg-white jsgd-text-blue-600 jsgd-shadow-sm dark:jsgd-bg-slate-600 dark:jsgd-text-white" : "jsgd-bg-transparent jsgd-text-slate-500 hover:jsgd-text-slate-700 dark:jsgd-text-slate-400 dark:hover:jsgd-text-slate-200"
                       ])
                     }, " Upload ", 2),
                     e("button", {
-                      onClick: d[1] || (d[1] = (n) => u.value = "url"),
+                      onClick: d[1] || (d[1] = (i) => g.value = "url"),
                       class: A([
                         "jsgd-flex-1 jsgd-py-1.5 jsgd-px-3 jsgd-text-sm jsgd-font-semibold jsgd-rounded-md jsgd-transition-colors jsgd-duration-200",
-                        u.value === "url" ? "jsgd-bg-white jsgd-text-blue-600 jsgd-shadow-sm dark:jsgd-bg-slate-600 dark:jsgd-text-white" : "jsgd-bg-transparent jsgd-text-slate-500 hover:jsgd-text-slate-700 dark:jsgd-text-slate-400 dark:hover:jsgd-text-slate-200"
+                        g.value === "url" ? "jsgd-bg-white jsgd-text-blue-600 jsgd-shadow-sm dark:jsgd-bg-slate-600 dark:jsgd-text-white" : "jsgd-bg-transparent jsgd-text-slate-500 hover:jsgd-text-slate-700 dark:jsgd-text-slate-400 dark:hover:jsgd-text-slate-200"
                       ])
                     }, " From URL ", 2)
-                  ])) : f("", !0),
-                  g.mode === "link" ? (i(), c("div", be, [
+                  ])) : x("", !0),
+                  u.mode === "link" ? (r(), j("div", xe, [
                     d[5] || (d[5] = e("label", { class: "jsgd-block jsgd-text-sm jsgd-font-medium jsgd-mb-1 dark:jsgd-text-slate-300" }, "Text to display", -1)),
-                    _(e("input", {
-                      "onUpdate:modelValue": d[2] || (d[2] = (n) => k.value = n),
+                    V(e("input", {
+                      "onUpdate:modelValue": d[2] || (d[2] = (i) => k.value = i),
                       type: "text",
                       placeholder: "If empty, URL will be shown",
                       class: "jsgd-w-full jsgd-py-2 jsgd-px-3 jsgd-rounded-md jsgd-border jsgd-border-slate-300 dark:jsgd-bg-slate-700 dark:jsgd-border-slate-600 dark:jsgd-text-white"
                     }, null, 512), [
-                      [R, k.value]
+                      [z, k.value]
                     ])
-                  ])) : f("", !0),
-                  u.value === "url" || g.mode === "link" ? (i(), c("div", ve, [
+                  ])) : x("", !0),
+                  g.value === "url" || u.mode === "link" ? (r(), j("div", he, [
                     d[6] || (d[6] = e("label", { class: "jsgd-block jsgd-text-sm jsgd-font-medium jsgd-mb-1 dark:jsgd-text-slate-300" }, "URL", -1)),
-                    _(e("input", {
-                      "onUpdate:modelValue": d[3] || (d[3] = (n) => l.value = n),
+                    V(e("input", {
+                      "onUpdate:modelValue": d[3] || (d[3] = (i) => l.value = i),
                       type: "text",
-                      placeholder: j.value,
+                      placeholder: c.value,
                       class: "jsgd-w-full jsgd-py-2 jsgd-px-3 jsgd-rounded-md jsgd-border jsgd-border-slate-300 dark:jsgd-bg-slate-700 dark:jsgd-border-slate-600 dark:jsgd-text-white",
-                      onKeydown: G($, ["enter"])
-                    }, null, 40, pe), [
-                      [R, l.value]
+                      onKeydown: K($, ["enter"])
+                    }, null, 40, ke), [
+                      [z, l.value]
                     ])
-                  ])) : f("", !0),
-                  u.value === "upload" && w.value ? (i(), c("div", xe, [
+                  ])) : x("", !0),
+                  g.value === "upload" && w.value ? (r(), j("div", we, [
                     d[7] || (d[7] = e("label", { class: "jsgd-block jsgd-text-sm jsgd-font-medium jsgd-mb-1 dark:jsgd-text-slate-300" }, "Upload File", -1)),
                     e("input", {
                       type: "file",
-                      accept: g.mode === "image" ? "image/*" : "video/*",
+                      accept: u.mode === "image" ? "image/*" : "video/*",
                       onChange: T,
                       class: "jsgd-w-full jsgd-text-sm jsgd-text-slate-500 file:jsgd-mr-4 file:jsgd-py-2 file:jsgd-px-4 file:jsgd-rounded-full file:jsgd-border-0 file:jsgd-text-sm file:jsgd-font-semibold file:jsgd-bg-blue-50 file:jsgd-text-blue-700 hover:file:jsgd-bg-blue-100 dark:file:jsgd-bg-blue-900/50 dark:file:jsgd-text-blue-300 dark:hover:file:jsgd-bg-blue-900"
-                    }, null, 40, fe),
-                    v.value ? (i(), c("div", he, [
+                    }, null, 40, ye),
+                    p.value ? (r(), j("div", qe, [
                       e("img", {
-                        src: v.value,
+                        src: p.value,
                         class: "jsgd-max-w-full jsgd-max-h-40 jsgd-rounded-md",
                         alt: "Upload Preview"
-                      }, null, 8, ke)
-                    ])) : f("", !0)
-                  ])) : f("", !0),
-                  g.mode === "image" ? (i(), c("div", we, [
+                      }, null, 8, Ue)
+                    ])) : x("", !0)
+                  ])) : x("", !0),
+                  u.mode === "image" ? (r(), j("div", Te, [
                     d[8] || (d[8] = e("label", { class: "jsgd-block jsgd-text-sm jsgd-font-medium jsgd-mb-1 dark:jsgd-text-slate-300" }, "Alt Text (Optional)", -1)),
-                    _(e("input", {
-                      "onUpdate:modelValue": d[4] || (d[4] = (n) => m.value = n),
+                    V(e("input", {
+                      "onUpdate:modelValue": d[4] || (d[4] = (i) => b.value = i),
                       type: "text",
                       placeholder: "Describe the image for accessibility",
                       class: "jsgd-w-full jsgd-py-2 jsgd-px-3 jsgd-rounded-md jsgd-border jsgd-border-slate-300 dark:jsgd-bg-slate-700 dark:jsgd-border-slate-600 dark:jsgd-text-white"
                     }, null, 512), [
-                      [R, m.value]
+                      [z, b.value]
                     ])
-                  ])) : f("", !0)
+                  ])) : x("", !0)
                 ]),
-                e("div", ye, [
+                e("div", Le, [
                   e("button", {
                     onClick: U,
                     class: "jsgd-px-4 jsgd-py-2 jsgd-rounded-md jsgd-text-sm jsgd-font-medium jsgd-bg-white jsgd-border jsgd-border-slate-300 hover:jsgd-bg-slate-50 dark:jsgd-bg-slate-700 dark:jsgd-text-slate-200 dark:jsgd-border-slate-600 dark:hover:jsgd-bg-slate-600"
@@ -180,82 +180,82 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
                   e("button", {
                     onClick: $,
                     class: "jsgd-px-4 jsgd-py-2 jsgd-rounded-md jsgd-text-sm jsgd-font-medium jsgd-text-white jsgd-bg-blue-600 hover:jsgd-bg-blue-700 dark:jsgd-bg-blue-500 dark:hover:jsgd-bg-blue-600",
-                    disabled: p.value
+                    disabled: f.value
                   }, [
-                    p.value ? (i(), c("span", Ue, "Inserting...")) : (i(), c("span", Te, "Insert"))
-                  ], 8, qe)
+                    f.value ? (r(), j("span", Ve, "Inserting...")) : (r(), j("span", Se, "Insert"))
+                  ], 8, Me)
                 ])
               ])
             ]),
             _: 1
           })
-        ])) : f("", !0)
+        ])) : x("", !0)
       ]),
       _: 1
     }));
   }
-}), Me = /* @__PURE__ */ H(Le, [["__scopeId", "data-v-e9ba68c4"]]), Se = { class: "jsgd-w-full jsgd-max-w-sm jsgd-bg-white jsgd-rounded-xl jsgd-shadow-2xl jsgd-overflow-hidden dark:jsgd-bg-slate-800" }, $e = { class: "jsgd-p-5 jsgd-flex jsgd-flex-col jsgd-gap-4" }, Ie = /* @__PURE__ */ Q({
+}), Ce = /* @__PURE__ */ N($e, [["__scopeId", "data-v-e9ba68c4"]]), Ie = { class: "jsgd-w-full jsgd-max-w-sm jsgd-bg-white jsgd-rounded-xl jsgd-shadow-2xl jsgd-overflow-hidden dark:jsgd-bg-slate-800" }, Ae = { class: "jsgd-p-5 jsgd-flex jsgd-flex-col jsgd-gap-4" }, ze = /* @__PURE__ */ Q({
   __name: "QuillAltModal",
   props: {
     show: { type: Boolean },
     initialValue: {}
   },
   emits: ["close", "submit"],
-  setup(g, { emit: S }) {
-    const s = g, h = S, l = r("");
-    V(
+  setup(u, { emit: S }) {
+    const s = u, h = S, l = n("");
+    I(
       () => s.show,
       (k) => {
         k && (l.value = s.initialValue || "");
       }
     );
-    function m() {
+    function b() {
       h("close");
     }
-    function b() {
+    function v() {
       h("submit", l.value);
     }
-    return (k, v) => (i(), D(B, {
+    return (k, p) => (r(), B(D, {
       name: "jsgd-modal-overlay",
       appear: ""
     }, {
-      default: C(() => [
-        g.show ? (i(), c("div", {
+      default: E(() => [
+        u.show ? (r(), j("div", {
           key: 0,
           class: "jsgd-fixed jsgd-inset-0 jsgd-z-[10001] jsgd-flex jsgd-items-center jsgd-justify-center jsgd-p-4 jsgd-bg-black/60 jsgd-backdrop-blur-sm",
-          onClick: O(m, ["self"])
+          onClick: G(b, ["self"])
         }, [
-          P(B, {
+          P(D, {
             name: "jsgd-modal-container",
             appear: ""
           }, {
-            default: C(() => [
-              e("div", Se, [
-                v[3] || (v[3] = e("div", { class: "jsgd-p-5 jsgd-border-b jsgd-border-slate-200 dark:jsgd-border-slate-700" }, [
+            default: E(() => [
+              e("div", Ie, [
+                p[3] || (p[3] = e("div", { class: "jsgd-p-5 jsgd-border-b jsgd-border-slate-200 dark:jsgd-border-slate-700" }, [
                   e("h3", { class: "jsgd-text-lg jsgd-font-bold jsgd-text-slate-900 dark:jsgd-text-slate-100" }, " Edit Image Alt Text ")
                 ], -1)),
-                e("div", $e, [
+                e("div", Ae, [
                   e("div", null, [
-                    v[1] || (v[1] = e("label", { class: "jsgd-block jsgd-text-sm jsgd-font-medium jsgd-mb-1 dark:jsgd-text-slate-300" }, "Alt Text", -1)),
-                    _(e("input", {
-                      "onUpdate:modelValue": v[0] || (v[0] = (p) => l.value = p),
+                    p[1] || (p[1] = e("label", { class: "jsgd-block jsgd-text-sm jsgd-font-medium jsgd-mb-1 dark:jsgd-text-slate-300" }, "Alt Text", -1)),
+                    V(e("input", {
+                      "onUpdate:modelValue": p[0] || (p[0] = (f) => l.value = f),
                       type: "text",
                       placeholder: "Describe the image for accessibility",
                       class: "jsgd-w-full jsgd-py-2 jsgd-px-3 jsgd-rounded-md jsgd-border jsgd-border-slate-300 dark:jsgd-bg-slate-700 dark:jsgd-border-slate-600 dark:jsgd-text-white",
-                      onKeydown: G(b, ["enter"])
+                      onKeydown: K(v, ["enter"])
                     }, null, 544), [
-                      [R, l.value]
+                      [z, l.value]
                     ]),
-                    v[2] || (v[2] = e("p", { class: "jsgd-text-xs jsgd-text-slate-500 jsgd-mt-2 dark:jsgd-text-slate-400" }, " Good alt text is descriptive and helps screen readers understand the image content. ", -1))
+                    p[2] || (p[2] = e("p", { class: "jsgd-text-xs jsgd-text-slate-500 jsgd-mt-2 dark:jsgd-text-slate-400" }, " Good alt text is descriptive and helps screen readers understand the image content. ", -1))
                   ])
                 ]),
                 e("div", { class: "jsgd-p-4 jsgd-bg-slate-50 jsgd-flex jsgd-justify-end jsgd-gap-3 dark:jsgd-bg-slate-900/50" }, [
                   e("button", {
-                    onClick: m,
+                    onClick: b,
                     class: "jsgd-px-4 jsgd-py-2 jsgd-rounded-md jsgd-text-sm jsgd-font-medium jsgd-bg-white jsgd-border jsgd-border-slate-300 hover:jsgd-bg-slate-50 dark:jsgd-bg-slate-700 dark:jsgd-text-slate-200 dark:jsgd-border-slate-600 dark:hover:jsgd-bg-slate-600"
                   }, " Cancel "),
                   e("button", {
-                    onClick: b,
+                    onClick: v,
                     class: "jsgd-px-4 jsgd-py-2 jsgd-rounded-md jsgd-text-sm jsgd-font-medium jsgd-text-white jsgd-bg-blue-600 hover:jsgd-bg-blue-700 dark:jsgd-bg-blue-500 dark:hover:jsgd-bg-blue-600"
                   }, " Save ")
                 ])
@@ -263,31 +263,31 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
             ]),
             _: 1
           })
-        ])) : f("", !0)
+        ])) : x("", !0)
       ]),
       _: 1
     }));
   }
-}), Ve = /* @__PURE__ */ H(Ie, [["__scopeId", "data-v-4b0d2e4a"]]), Ae = { class: "editor-header" }, Ce = ["for"], ze = ["id"], Ee = { class: "ql-formats" }, _e = {
+}), Ee = /* @__PURE__ */ N(ze, [["__scopeId", "data-v-4b0d2e4a"]]), Re = { class: "editor-header" }, _e = ["for"], Be = ["id"], De = { class: "ql-formats" }, Pe = {
   key: 0,
   viewBox: "0 0 18 18",
   width: "18",
   height: "18"
-}, Re = {
+}, Fe = {
   key: 1,
   viewBox: "0 0 18 18",
   width: "18",
   height: "18"
-}, De = { class: "editor-relative-container" }, Be = {
+}, He = { class: "editor-relative-container" }, Qe = {
   key: 0,
   class: "upload-overlay"
-}, Pe = ["id"], Fe = {
+}, Ne = ["id"], Oe = {
   key: 1,
   class: "error-message"
-}, Qe = /* @__PURE__ */ Q({
+}, Ge = /* @__PURE__ */ Q({
   __name: "TextAreaQuill",
   props: {
-    id: { default: () => ne() },
+    id: { default: () => ge() },
     label: {},
     placeholder: {},
     modelValue: {},
@@ -299,24 +299,28 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
     apiUploadVideo: {}
   },
   emits: ["update:modelValue", "push:error", "remove:error"],
-  setup(g, { emit: S }) {
-    const s = g, h = S;
+  setup(u, { emit: S }) {
+    const s = u, h = S;
     let l = null;
-    const m = r(!1), b = r([]), k = r(!1), v = r(""), p = r(!1), u = r("link"), w = r(""), z = r("");
-    let j = null;
-    const U = r(!1), T = r(null), $ = r(""), x = ee("TableComponents", {
-      labels: r(re[s.lang ?? "en"])
-    }), d = M(
-      () => s.placeholder ?? x.labels.value.placeholder?.quillEditor ?? "Write content here..."
-    ), n = M(() => {
+    const b = n(!1), v = n([]), k = n(!1), p = n(""), f = n(!1), g = n("link"), w = n(""), R = n("");
+    let c = null;
+    const U = n(!1), T = n(null), $ = n(""), m = n(!1), d = n(""), i = le("TableComponents", {
+      labels: n(je[s.lang ?? "en"])
+    }), L = M(
+      () => s.placeholder ?? i.labels.value.placeholder?.quillEditor ?? "Write content here..."
+    ), O = M(() => {
       const a = [];
-      return s.validate?.minLength && a.push(E("textMinLength", { min: String(s.validate.minLength) }, s.lang)), s.validate?.maxLength && a.push(E("textMaxLength", { max: String(s.validate.maxLength) }, s.lang)), a.join(", ");
-    }), L = () => {
-      m.value = !m.value;
+      return s.validate?.minLength && a.push(_("textMinLength", { min: String(s.validate.minLength) }, s.lang)), s.validate?.maxLength && a.push(_("textMaxLength", { max: String(s.validate.maxLength) }, s.lang)), a.join(", ");
+    }), W = () => {
+      b.value = !b.value;
     };
-    V(m, (a) => {
+    I(b, (a) => {
       document.body.style.overflow = a ? "hidden" : "";
-    }), V(
+    });
+    const Y = () => {
+      m.value = !m.value, m.value ? d.value = l?.root.innerHTML ?? s.modelValue ?? "" : l && (l.root.innerHTML = H.sanitize(d.value));
+    };
+    I(
       () => ({
         val: s.modelValue,
         disabled: s.disabled,
@@ -324,48 +328,48 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
       }),
       ({ val: a, disabled: t, validate: o }) => {
         if (t) {
-          b.value = [], h("remove:error", s.id);
+          v.value = [], h("remove:error", s.id);
           return;
         }
         const y = String(a ?? "").replace(/<[^>]*>?/gm, "").trim(), q = [];
         o && (o.minLength && y.length < o.minLength && y.length !== 0 && q.push(
-          E("textMinLength", { min: String(o.minLength) }, s.lang ?? "en")
+          _("textMinLength", { min: String(o.minLength) }, s.lang ?? "en")
         ), o.maxLength && y.length > o.maxLength && q.push(
-          E("textMaxLength", { max: String(o.maxLength) }, s.lang ?? "en")
-        )), b.value = q, q.length ? h("push:error", q, s.id) : h("remove:error", s.id);
+          _("textMaxLength", { max: String(o.maxLength) }, s.lang ?? "en")
+        )), v.value = q, q.length ? h("push:error", q, s.id) : h("remove:error", s.id);
       },
       { deep: !0, immediate: !0 }
     );
-    const K = M(() => {
-      if (u.value === "image") return s.apiUploadImage;
-      if (u.value === "video") return s.apiUploadVideo;
-    }), W = () => {
-      u.value = "image", w.value = "", p.value = !0;
-    }, Y = () => {
-      u.value = "video", w.value = "", p.value = !0;
-    }, J = (a) => {
-      j = l?.getSelection(), j || (j = { index: l?.getSelection(!0)?.index || 0, length: 0 });
-      const t = l?.getText(j.index, j.length) || "";
-      z.value = t, w.value = typeof a == "string" ? a : "", u.value = "link", p.value = !0;
-    }, X = (a) => {
+    const J = M(() => {
+      if (g.value === "image") return s.apiUploadImage;
+      if (g.value === "video") return s.apiUploadVideo;
+    }), X = () => {
+      g.value = "image", w.value = "", f.value = !0;
+    }, Z = () => {
+      g.value = "video", w.value = "", f.value = !0;
+    }, ee = (a) => {
+      c = l?.getSelection(), c || (c = { index: l?.getSelection(!0)?.index || 0, length: 0 });
+      const t = l?.getText(c.index, c.length) || "";
+      R.value = t, w.value = typeof a == "string" ? a : "", g.value = "link", f.value = !0;
+    }, te = (a) => {
       if (l) {
-        if (p.value = !1, u.value === "link") {
-          if (!j) return;
+        if (f.value = !1, g.value === "link") {
+          if (!c) return;
           const t = a.text || a.url;
-          l.setSelection(j.index, j.length, "silent"), j.length > 0 && l.deleteText(j.index, j.length, "user"), l.insertText(j.index, t, "link", a.url, "user"), l.setSelection(j.index + t.length, 0, "user");
-        } else if (u.value === "image") {
+          l.setSelection(c.index, c.length, "silent"), c.length > 0 && l.deleteText(c.index, c.length, "user"), l.insertText(c.index, t, "link", a.url, "user"), l.setSelection(c.index + t.length, 0, "user");
+        } else if (g.value === "image") {
           const t = l.getSelection(!0), o = a.alt?.replace(/"/g, "&quot;") || "", y = `<img src="${a.url}" alt="${o}" />`;
           l.clipboard.dangerouslyPasteHTML(t.index, y, "user"), l.setSelection(t.index + 1, 0);
-        } else if (u.value === "video") {
+        } else if (g.value === "video") {
           const t = l.getSelection(!0);
           l.insertEmbed(t.index, "video", a.url, "user"), l.setSelection(t.index + 1, 0);
         }
-        j = null;
+        c = null;
       }
-    }, Z = (a) => {
+    }, se = (a) => {
       T.value && T.value.setAttribute("alt", a), U.value = !1, T.value = null;
     };
-    return te(async () => {
+    return de(async () => {
       if (typeof window > "u") return;
       const a = document.getElementById(`editor-container-${s.id}`);
       if (!a) return;
@@ -379,11 +383,11 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
       l = new t(a, {
         theme: "snow",
         readOnly: s.disabled ?? !1,
-        placeholder: d.value,
+        placeholder: L.value,
         modules: {
           toolbar: {
             container: `#toolbar-container-${s.id}`,
-            handlers: { image: W, video: Y, link: J }
+            handlers: { image: X, video: Z, link: ee }
           },
           resize: {
             locale: {},
@@ -404,59 +408,59 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
             ]
           }
         }
-      }), l.root.setAttribute("spellcheck", "true"), l.root.setAttribute("lang", s.lang === "id" ? "id" : "en"), s.modelValue && (l.root.innerHTML = N.sanitize(s.modelValue)), l.on("text-change", () => {
+      }), l.root.setAttribute("spellcheck", "true"), l.root.setAttribute("lang", s.lang === "id" ? "id" : "en"), s.modelValue && (l.root.innerHTML = H.sanitize(s.modelValue)), l.on("text-change", () => {
         const o = l.root.innerHTML;
-        h("update:modelValue", N.sanitize(o), s.id);
+        h("update:modelValue", H.sanitize(o), s.id);
       });
-    }), V(
+    }), I(
       () => s.disabled,
       (a) => l?.enable(!a)
-    ), se(() => {
+    ), ae(() => {
       document.body.style.overflow = "";
-    }), (a, t) => (i(), D(le, {
+    }), (a, t) => (r(), B(oe, {
       to: "body",
-      disabled: !m.value
+      disabled: !b.value
     }, [
       e("div", {
-        class: A(["rich-text-editor-wrapper", { "editor-maximized": m.value }])
+        class: A(["rich-text-editor-wrapper", { "editor-maximized": b.value }])
       }, [
-        e("div", Ae, [
+        e("div", Re, [
           e("label", {
-            for: g.id,
-            class: A(["jsgd-inline-flex jsgd-items-center jsgd-gap-2 jsgd-text-sm jsgd-font-medium jsgd-mb-2 jsgd-text-slate-900 jsgd-transition-colors jsgd-duration-200 dark:jsgd-text-slate-100", { "jsgd-text-red-500 dark:jsgd-text-red-400": b.value }])
+            for: u.id,
+            class: A(["jsgd-inline-flex jsgd-items-center jsgd-gap-2 jsgd-text-sm jsgd-font-medium jsgd-mb-2 jsgd-text-slate-900 jsgd-transition-colors jsgd-duration-200 dark:jsgd-text-slate-100", { "jsgd-text-red-500 dark:jsgd-text-red-400": v.value }])
           }, [
-            F(I(g.label) + " ", 1),
-            n.value ? (i(), D(de(ie), {
+            F(C(u.label) + " ", 1),
+            O.value ? (r(), B(ne(ce), {
               key: 0,
-              text: n.value,
+              text: O.value,
               as: "strong"
             }, {
-              default: C(() => [...t[2] || (t[2] = [
+              default: E(() => [...t[3] || (t[3] = [
                 F(" ❓", -1)
               ])]),
               _: 1
-            }, 8, ["text"])) : f("", !0)
-          ], 10, Ce)
+            }, 8, ["text"])) : x("", !0)
+          ], 10, _e)
         ]),
         e("div", {
-          id: `toolbar-container-${g.id}`,
+          id: `toolbar-container-${u.id}`,
           class: "quill-toolbar"
         }, [
-          t[5] || (t[5] = e("span", { class: "ql-formats" }, [
+          t[7] || (t[7] = e("span", { class: "ql-formats" }, [
             e("select", { class: "ql-font" }),
             e("select", { class: "ql-size" })
           ], -1)),
-          t[6] || (t[6] = e("span", { class: "ql-formats" }, [
+          t[8] || (t[8] = e("span", { class: "ql-formats" }, [
             e("button", { class: "ql-bold" }),
             e("button", { class: "ql-italic" }),
             e("button", { class: "ql-underline" }),
             e("button", { class: "ql-strike" })
           ], -1)),
-          t[7] || (t[7] = e("span", { class: "ql-formats" }, [
+          t[9] || (t[9] = e("span", { class: "ql-formats" }, [
             e("select", { class: "ql-color" }),
             e("select", { class: "ql-background" })
           ], -1)),
-          t[8] || (t[8] = e("span", { class: "ql-formats" }, [
+          t[10] || (t[10] = e("span", { class: "ql-formats" }, [
             e("button", {
               class: "ql-header",
               value: "1"
@@ -468,7 +472,7 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
             e("button", { class: "ql-blockquote" }),
             e("button", { class: "ql-code-block" })
           ], -1)),
-          t[9] || (t[9] = e("span", { class: "ql-formats" }, [
+          t[11] || (t[11] = e("span", { class: "ql-formats" }, [
             e("button", {
               class: "ql-list",
               value: "ordered"
@@ -486,26 +490,26 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
               value: "+1"
             })
           ], -1)),
-          t[10] || (t[10] = e("span", { class: "ql-formats" }, [
+          t[12] || (t[12] = e("span", { class: "ql-formats" }, [
             e("button", {
               class: "ql-direction",
               value: "rtl"
             }),
             e("select", { class: "ql-align" })
           ], -1)),
-          t[11] || (t[11] = e("span", { class: "ql-formats" }, [
+          t[13] || (t[13] = e("span", { class: "ql-formats" }, [
             e("button", { class: "ql-link" }),
             e("button", { class: "ql-image" }),
             F(),
             e("button", { class: "ql-video" })
           ], -1)),
-          e("span", Ee, [
+          e("span", De, [
             e("button", {
-              onClick: L,
+              onClick: W,
               class: "maximize-button",
               type: "button"
             }, [
-              m.value ? (i(), c("svg", Re, [...t[4] || (t[4] = [
+              b.value ? (r(), j("svg", Fe, [...t[5] || (t[5] = [
                 e("rect", {
                   class: "ql-stroke",
                   x: "5",
@@ -521,7 +525,7 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
                   class: "ql-stroke",
                   points: "3 15 8 10"
                 }, null, -1)
-              ])])) : (i(), c("svg", _e, [...t[3] || (t[3] = [
+              ])])) : (r(), j("svg", Pe, [...t[4] || (t[4] = [
                 e("rect", {
                   class: "ql-stroke",
                   x: "3",
@@ -558,43 +562,76 @@ const ge = { class: "jsgd-w-full jsgd-max-w-md jsgd-bg-white jsgd-rounded-xl jsg
                   height: "1"
                 }, null, -1)
               ])]))
-            ])
+            ]),
+            e("button", {
+              onClick: Y,
+              class: "code-view-button",
+              type: "button",
+              title: "Source"
+            }, [...t[6] || (t[6] = [
+              e("svg", {
+                viewBox: "0 0 18 18",
+                width: "18",
+                height: "18"
+              }, [
+                e("polyline", {
+                  class: "ql-stroke",
+                  points: "5 3 2 9 5 15"
+                }),
+                e("polyline", {
+                  class: "ql-stroke",
+                  points: "13 3 16 9 13 15"
+                })
+              ], -1)
+            ])])
           ])
-        ], 8, ze),
-        e("div", De, [
-          k.value ? (i(), c("div", Be, [
-            t[12] || (t[12] = e("div", { class: "spinner" }, null, -1)),
-            e("p", null, "Uploading " + I(v.value) + "...", 1)
-          ])) : f("", !0),
-          e("div", {
-            id: `editor-container-${g.id}`,
-            class: A(["quill-editor-container", { "has-error": g.error }])
-          }, null, 10, Pe)
+        ], 8, Be),
+        e("div", He, [
+          k.value ? (r(), j("div", Qe, [
+            t[14] || (t[14] = e("div", { class: "spinner" }, null, -1)),
+            e("p", null, "Uploading " + C(p.value) + "...", 1)
+          ])) : x("", !0),
+          V(e("div", null, [
+            e("div", {
+              id: `editor-container-${u.id}`,
+              class: A(["quill-editor-container", { "has-error": u.error }])
+            }, null, 10, Ne)
+          ], 512), [
+            [re, !m.value]
+          ]),
+          m.value ? V((r(), j("textarea", {
+            key: 1,
+            "onUpdate:modelValue": t[0] || (t[0] = (o) => d.value = o),
+            class: "code-view-editor",
+            spellcheck: "false"
+          }, null, 512)), [
+            [z, d.value]
+          ]) : x("", !0)
         ]),
-        b.value.length !== 0 ? (i(!0), c(ae, { key: 0 }, oe(b.value, (o, y) => (i(), c("p", {
+        v.value.length !== 0 ? (r(!0), j(ie, { key: 0 }, ue(v.value, (o, y) => (r(), j("p", {
           key: y,
           class: "error-message"
-        }, I(o), 1))), 128)) : f("", !0),
-        typeof s.error == "string" && b.value.length === 0 ? (i(), c("p", Fe, I(g.error), 1)) : f("", !0),
-        P(Me, {
-          show: p.value,
-          mode: u.value,
-          "upload-url": K.value,
+        }, C(o), 1))), 128)) : x("", !0),
+        typeof s.error == "string" && v.value.length === 0 ? (r(), j("p", Oe, C(u.error), 1)) : x("", !0),
+        P(Ce, {
+          show: f.value,
+          mode: g.value,
+          "upload-url": J.value,
           "initial-value": w.value,
-          "initial-text": z.value,
-          onClose: t[0] || (t[0] = (o) => p.value = !1),
-          onSubmit: X
+          "initial-text": R.value,
+          onClose: t[1] || (t[1] = (o) => f.value = !1),
+          onSubmit: te
         }, null, 8, ["show", "mode", "upload-url", "initial-value", "initial-text"]),
-        P(Ve, {
+        P(Ee, {
           show: U.value,
           "initial-value": $.value,
-          onClose: t[1] || (t[1] = (o) => U.value = !1),
-          onSubmit: Z
+          onClose: t[2] || (t[2] = (o) => U.value = !1),
+          onSubmit: se
         }, null, 8, ["show", "initial-value"])
       ], 2)
     ], 8, ["disabled"]));
   }
-}), We = /* @__PURE__ */ H(Qe, [["__scopeId", "data-v-e017e37d"]]);
+}), Ze = /* @__PURE__ */ N(Ge, [["__scopeId", "data-v-c98af8b6"]]);
 export {
-  We as default
+  Ze as default
 };