@jsg-developer/vue-pack 0.0.1 → 0.0.2

package/dist/TabelData-fKFaSnkC.js

@@ -1,2142 +0,0 @@
-import { defineComponent as ue, createElementBlock as s, openBlock as n, mergeProps as Ve, renderSlot as qe, createTextVNode as oe, toDisplayString as k, ref as V, computed as X, inject as Ge, createCommentVNode as L, createVNode as I, createElementVNode as a, unref as l, normalizeClass as re, Fragment as W, renderList as q, createBlock as ce, normalizeStyle as je, onMounted as Se, onUnmounted as Qe, Transition as De, withCtx as Me, withModifiers as Je, watch as Ae, nextTick as $e, withKeys as ze, toRaw as Te, provide as Xe, withDirectives as He, isRef as Ke, vModelText as Ye, vModelCheckbox as Fe } from "vue";
-import { aa as me, m as Ue, ab as et, y as ke, a9 as fe, ac as tt, x as at, w as Be, L as nt, F as st } from "./TabelData.vue_vue_type_style_index_0_scoped_76b9b7a6_lang-Dtm1AO8H.js";
-const it = ["src", "alt"], lt = /* @__PURE__ */ ue({
-  __name: "BaseImage",
-  props: {
-    src: {},
-    alt: {}
-  },
-  setup(e) {
-    return (d, r) => (n(), s("img", Ve({
-      src: e.src,
-      alt: e.alt,
-      loading: "lazy",
-      decoding: "async",
-      class: "image-cover"
-    }, d.$attrs), null, 16, it));
-  }
-}), ys = /* @__PURE__ */ me(lt, [["__scopeId", "data-v-42adc665"]]), ot = { class: "base-label" }, rt = /* @__PURE__ */ ue({
-  __name: "BaseLabel",
-  props: {
-    label: {}
-  },
-  setup(e) {
-    return (d, r) => (n(), s("label", ot, [
-      qe(d.$slots, "default", {}, () => [
-        oe(k(e.label), 1)
-      ], !0)
-    ]));
-  }
-}), P = /* @__PURE__ */ me(rt, [["__scopeId", "data-v-1f7d7c4b"]]);
-function Ie(e = "id-ID", d = "Asia/Jakarta") {
-  let r = e, o = d;
-  try {
-    typeof navigator < "u" && (r = navigator.language || e), o = Intl.DateTimeFormat().resolvedOptions().timeZone || d;
-  } catch {
-  }
-  return { locale: r, timeZone: o };
-}
-function Le(e, d = "id-ID") {
-  const r = Intl.DateTimeFormat.supportedLocalesOf([e]);
-  return r.length > 0 ? r[0] : d;
-}
-function Ne(e) {
-  return e instanceof Date && !isNaN(e.getTime());
-}
-const ct = (e) => {
-  try {
-    if (!e) return "-";
-    const d = new Date(e);
-    if (!Ne(d)) return e;
-    const { locale: r, timeZone: o } = Ie();
-    return d.toLocaleDateString(Le(r), {
-      weekday: "long",
-      year: "numeric",
-      month: "long",
-      day: "numeric",
-      timeZone: o
-    });
-  } catch {
-    return e;
-  }
-}, ut = (e) => {
-  try {
-    if (!e) return "-";
-    const d = /* @__PURE__ */ new Date(`1970-01-01T${e}`);
-    if (!Ne(d)) return e;
-    const { locale: r, timeZone: o } = Ie();
-    return d.toLocaleTimeString(Le(r), {
-      hour: "2-digit",
-      minute: "2-digit",
-      timeZone: o
-    });
-  } catch {
-    return e;
-  }
-}, dt = (e) => {
-  try {
-    if (!e) return "-";
-    const d = new Date(e);
-    if (!Ne(d)) return e;
-    const { locale: r, timeZone: o } = Ie();
-    return d.toLocaleString(Le(r), {
-      weekday: "short",
-      year: "numeric",
-      month: "short",
-      day: "numeric",
-      hour: "2-digit",
-      minute: "2-digit",
-      timeZone: o
-    });
-  } catch {
-    return e;
-  }
-}, vt = ["id"], mt = { key: 0 }, ht = { class: "field-value" }, yt = { key: 1 }, ft = ["innerHTML"], bt = {
-  key: 1,
-  class: "field-value"
-}, gt = { key: 2 }, kt = ["innerHTML"], wt = {
-  key: 1,
-  class: "field-value"
-}, pt = { key: 3 }, _t = { class: "password-wrapper" }, Ct = { class: "password-text" }, Dt = { key: 4 }, Mt = { class: "field-value" }, $t = { key: 5 }, At = { class: "field-value" }, Tt = { key: 6 }, xt = { class: "field-value" }, Ot = { key: 7 }, jt = { key: 8 }, Ht = { key: 0 }, Kt = ["href"], Bt = {
-  key: 1,
-  class: "file-info"
-}, Vt = { class: "file-size" }, St = ["href"], It = {
-  key: 1,
-  class: "no-value"
-}, Lt = { key: 9 }, Nt = {
-  key: 0,
-  class: "file-array-container"
-}, Ft = ["href"], Pt = {
-  key: 1,
-  class: "file-info"
-}, Et = { class: "file-size" }, zt = ["href"], Ut = {
-  key: 1,
-  class: "no-value"
-}, Wt = { key: 10 }, Rt = { class: "field-value" }, Zt = { key: 11 }, qt = { class: "field-value" }, Gt = { key: 12 }, Qt = ["href"], Jt = { key: 13 }, Xt = { class: "field-value" }, Yt = { key: 14 }, ea = {
-  key: 0,
-  class: "object-container"
-}, ta = {
-  key: 1,
-  class: "no-value"
-}, aa = { key: 15 }, na = { key: 0 }, sa = ["src"], ia = {
-  key: 1,
-  class: "no-value"
-}, la = { key: 16 }, oa = {
-  key: 0,
-  class: "image-array-container"
-}, ra = ["src", "alt", "onClick"], ca = {
-  key: 1,
-  class: "no-value"
-}, ua = { key: 17 }, da = { class: "color-container" }, va = ["title", "onClick"], ma = {
-  key: 1,
-  class: "no-value"
-}, ha = { key: 18 }, ya = { class: "field-value" }, fa = { key: 19 }, ba = {
-  key: 0,
-  class: "array-object-container"
-}, ga = {
-  key: 1,
-  class: "no-value"
-}, ka = {
-  key: 1,
-  class: "field-wrapper"
-}, wa = { class: "option-group-grid" }, pa = /* @__PURE__ */ ue({
-  __name: "FieldDetailRenderer",
-  props: {
-    field: {},
-    fieldKey: {},
-    formData: {},
-    requiredText: {},
-    valueNullView: { type: Boolean },
-    optionalText: {},
-    lang: {}
-  },
-  emits: ["image-click"],
-  setup(e, { emit: d }) {
-    const r = V(!1), o = e, c = d, t = X(() => o.formData?.[o.fieldKey]), h = X(() => {
-      const b = t.value;
-      return o.valueNullView && o.field.type !== "optionGroupSchema" ? !0 : b != null && b !== "";
-    }), y = Ge("TableComponents", {
-      labels: V(Ue[o.lang ?? "en"])
-    }).labels, i = X(() => {
-      let b = o.field.label || o.fieldKey || "";
-      return o.field.type === "optionGroupSchema" ? o.field.label ?? "" : b;
-    }), C = (b) => b instanceof File, O = (b) => URL.createObjectURL(b), F = (b) => {
-      navigator.clipboard.writeText(b).then(() => console.log("Copied:", b)).catch(console.error);
-    };
-    return (b, S) => h.value ? (n(), s("div", {
-      key: 0,
-      class: "field-wrapper",
-      id: e.fieldKey
-    }, [
-      e.field.type === "text" ? (n(), s("div", mt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("p", ht, k(t.value || "-"), 1)
-      ])) : e.field.type === "richText" ? (n(), s("div", yt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        t.value ? (n(), s("div", {
-          key: 0,
-          class: "prose-content",
-          innerHTML: t.value
-        }, null, 8, ft)) : (n(), s("p", bt, "-"))
-      ])) : e.field.type === "textArea" ? (n(), s("div", gt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        t.value ? (n(), s("div", {
-          key: 0,
-          class: "prose-content",
-          innerHTML: t.value
-        }, null, 8, kt)) : (n(), s("p", wt, "-"))
-      ])) : e.field.type === "password" ? (n(), s("div", pt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("div", _t, [
-          a("p", Ct, k(r.value ? t.value ?? "-" : t.value ? "•".repeat(String(t.value).length) : "-"), 1),
-          t.value ? (n(), s("button", {
-            key: 0,
-            type: "button",
-            class: "toggle-visibility-button",
-            onClick: S[0] || (S[0] = ($) => r.value = !r.value)
-          }, k(r.value ? "Hide" : "Show"), 1)) : L("", !0)
-        ])
-      ])) : e.field.type === "date" ? (n(), s("div", Dt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("p", Mt, k(t.value ? l(ct)(t.value) : "-"), 1)
-      ])) : e.field.type === "time" ? (n(), s("div", $t, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("p", At, k(t.value ? l(ut)(t.value) : "-"), 1)
-      ])) : e.field.type === "dateTime" ? (n(), s("div", Tt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("p", xt, k(t.value ? l(dt)(t.value) : "-"), 1)
-      ])) : e.field.type === "toggle" ? (n(), s("div", Ot, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("p", {
-          class: re(["toggle-badge", t.value ? "active" : "inactive"])
-        }, k(t.value ? l(y).btn.toogle.active : l(y).btn.toogle.inactive) + " ⦿ ", 3)
-      ])) : e.field.type === "file" ? (n(), s("div", jt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        t.value ? (n(), s("div", Ht, [
-          typeof t.value == "string" ? (n(), s("a", {
-            key: 0,
-            href: t.value,
-            target: "_blank",
-            rel: "noopener noreferrer",
-            class: "file-link"
-          }, k(t.value.split("/").pop() || t.value), 9, Kt)) : C(t.value) ? (n(), s("div", Bt, [
-            a("span", null, k(t.value.name), 1),
-            a("span", Vt, "(" + k((t.value.size / 1024).toFixed(1)) + " KB)", 1),
-            a("a", {
-              href: O(t.value),
-              target: "_blank",
-              rel: "noopener noreferrer",
-              class: "file-preview-link"
-            }, " Preview ", 8, St)
-          ])) : L("", !0)
-        ])) : (n(), s("div", It, "-"))
-      ])) : e.field.type === "fileArray" ? (n(), s("div", Lt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        Array.isArray(t.value) && t.value.length ? (n(), s("div", Nt, [
-          (n(!0), s(W, null, q(t.value, ($, H) => (n(), s("div", { key: H }, [
-            typeof $ == "string" ? (n(), s("a", {
-              key: 0,
-              href: $,
-              target: "_blank",
-              rel: "noopener noreferrer",
-              class: "file-link"
-            }, k($.split("/").pop() || $), 9, Ft)) : C($) ? (n(), s("div", Pt, [
-              a("span", null, k($.name), 1),
-              a("span", Et, "(" + k(($.size / 1024).toFixed(1)) + " KB)", 1),
-              a("a", {
-                href: O($),
-                target: "_blank",
-                rel: "noopener noreferrer",
-                class: "file-preview-link"
-              }, " Preview ", 8, zt)
-            ])) : L("", !0)
-          ]))), 128))
-        ])) : (n(), s("div", Ut, "-"))
-      ])) : e.field.type === "number" ? (n(), s("div", Wt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("p", Rt, k(t.value ?? "-"), 1)
-      ])) : e.field.type === "email" ? (n(), s("div", Zt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("p", qt, k(t.value ?? "-"), 1)
-      ])) : e.field.type === "url" ? (n(), s("div", Gt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("a", {
-          href: t.value,
-          target: "_blank",
-          rel: "noopener noreferrer",
-          class: "url-link"
-        }, k(t.value ?? "-"), 9, Qt)
-      ])) : e.field.type === "tag" ? (n(), s("div", Jt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("p", Xt, k(t.value ?? "-"), 1)
-      ])) : e.field.type === "object" ? (n(), s("div", Yt, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        t.value && typeof t.value == "object" && Object.keys(t.value).length ? (n(), s("div", ea, [
-          (n(!0), s(W, null, q(e.field.schema, ($, H) => (n(), ce(l(xe), {
-            key: H,
-            field: $,
-            "field-key": H,
-            "form-data": t.value,
-            "value-null-view": e.valueNullView,
-            "optional-text": e.optionalText,
-            "required-text": e.requiredText,
-            onImageClick: S[1] || (S[1] = (E) => c("image-click", E))
-          }, null, 8, ["field", "field-key", "form-data", "value-null-view", "optional-text", "required-text"]))), 128))
-        ])) : (n(), s("div", ta, "-"))
-      ])) : e.field.type === "image" ? (n(), s("div", aa, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        t.value ? (n(), s("div", na, [
-          a("img", {
-            src: t.value,
-            alt: "Image",
-            class: "image-preview-single",
-            onClick: S[2] || (S[2] = ($) => c("image-click", t.value))
-          }, null, 8, sa)
-        ])) : (n(), s("div", ia, "-"))
-      ])) : e.field.type === "imageArray" ? (n(), s("div", la, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        Array.isArray(t.value) && t.value.length ? (n(), s("div", oa, [
-          (n(!0), s(W, null, q(t.value, ($, H) => (n(), s("div", { key: H }, [
-            a("img", {
-              src: $,
-              alt: `Image ${H + 1}`,
-              class: "image-preview-multi",
-              onClick: (E) => c("image-click", $)
-            }, null, 8, ra)
-          ]))), 128))
-        ])) : (n(), s("div", ca, "-"))
-      ])) : e.field.type === "color" ? (n(), s("div", ua, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("div", da, [
-          Array.isArray(t.value) && t.value.length ? (n(!0), s(W, { key: 0 }, q(t.value, ($, H) => (n(), s("div", {
-            key: H,
-            class: "color-swatch",
-            style: je({ backgroundColor: $ }),
-            title: $,
-            onClick: (E) => F($)
-          }, null, 12, va))), 128)) : (n(), s("div", ma, "-"))
-        ])
-      ])) : e.field.type === "select" ? (n(), s("div", ha, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        a("p", ya, k(t.value || "-"), 1)
-      ])) : e.field.type === "arrayObject" ? (n(), s("div", fa, [
-        I(l(P), { label: i.value }, null, 8, ["label"]),
-        Array.isArray(t.value) && t.value.length ? (n(), s("div", ba, [
-          (n(!0), s(W, null, q(t.value, ($, H) => (n(), s("div", {
-            key: H,
-            class: "array-object-item"
-          }, [
-            (n(!0), s(W, null, q(e.field.schema, (E, B) => (n(), ce(l(xe), {
-              key: B,
-              field: E,
-              "field-key": B,
-              "form-data": $,
-              "value-null-view": e.valueNullView,
-              "optional-text": e.optionalText,
-              "required-text": e.requiredText,
-              onImageClick: S[3] || (S[3] = (p) => c("image-click", p))
-            }, null, 8, ["field", "field-key", "form-data", "value-null-view", "optional-text", "required-text"]))), 128))
-          ]))), 128))
-        ])) : (n(), s("div", ga, "-"))
-      ])) : L("", !0)
-    ], 8, vt)) : e.field.type === "optionGroupSchema" ? (n(), s("div", ka, [
-      e.formData[e.fieldKey] || i.value ? (n(), ce(l(P), {
-        key: 0,
-        label: e.formData[e.fieldKey] ? i.value + ":" + (e.formData[e.fieldKey] ?? "") : i.value,
-        class: "option-group-main-label"
-      }, null, 8, ["label"])) : L("", !0),
-      a("div", wa, [
-        (n(!0), s(W, null, q(e.field.options, ($, H) => (n(), s("div", {
-          key: H,
-          class: "option-group-item"
-        }, [
-          I(l(P), {
-            label: H,
-            class: "option-group-item-label"
-          }, null, 8, ["label"]),
-          S[5] || (S[5] = a("hr", { class: "option-group-divider" }, null, -1)),
-          (n(!0), s(W, null, q($, (E, B) => (n(), ce(l(xe), {
-            key: B,
-            field: E,
-            "field-key": B,
-            "form-data": e.formData,
-            "value-null-view": e.valueNullView,
-            "optional-text": e.optionalText,
-            "required-text": e.requiredText,
-            onImageClick: S[4] || (S[4] = (p) => c("image-click", p))
-          }, null, 8, ["field", "field-key", "form-data", "value-null-view", "optional-text", "required-text"]))), 128))
-        ]))), 128))
-      ])
-    ])) : L("", !0);
-  }
-}), xe = /* @__PURE__ */ me(pa, [["__scopeId", "data-v-77044b61"]]), _a = ["src", "alt"], Ca = /* @__PURE__ */ ue({
-  __name: "ImagePreview",
-  props: {
-    imageUrl: {},
-    watermarkUrl: { default: "https://res.cloudinary.com/doyufai9q/image/upload/v1754227461/Logo_transparent_b6qrek.png" },
-    watermarkSize: { default: 4 },
-    alt: { default: "" }
-  },
-  setup(e) {
-    const d = e, r = V(null), o = V(!0), c = (h) => new Promise((v, y) => {
-      const i = new Image();
-      i.crossOrigin = "anonymous", i.onload = () => v(i), i.onerror = (C) => y(C), i.src = h;
-    }), t = (h, v) => {
-      const y = document.createElement("canvas"), i = y.getContext("2d");
-      if (!i)
-        return console.error("Gagal mendapatkan konteks canvas 2D."), h.src;
-      y.width = h.width, y.height = h.height, i.drawImage(h, 0, 0);
-      const C = h.width / d.watermarkSize, O = v.height / v.width * C, F = h.width - C - 10, b = h.height - O - 10;
-      return i.globalAlpha = 0.8, i.drawImage(v, F, b, C, O), i.globalAlpha = 1, y.toDataURL("image/png");
-    };
-    return Se(async () => {
-      try {
-        const h = await c(d.imageUrl), v = await c(d.watermarkUrl);
-        r.value = t(h, v);
-      } catch (h) {
-        console.error("Gagal menerapkan watermark, menampilkan gambar asli:", h), r.value = d.imageUrl;
-      } finally {
-        o.value = !1;
-      }
-    }), (h, v) => (n(), s(W, null, [
-      o.value ? (n(), s("div", Ve({
-        key: 0,
-        class: "skeleton-loader"
-      }, h.$attrs), null, 16)) : L("", !0),
-      !o.value && r.value ? (n(), s("img", Ve({
-        key: 1,
-        loading: "lazy",
-        src: r.value,
-        alt: d.alt
-      }, h.$attrs), null, 16, _a)) : L("", !0)
-    ], 64));
-  }
-}), fs = /* @__PURE__ */ me(Ca, [["__scopeId", "data-v-bc2fb469"]]), Da = { class: "modal-header" }, Ma = { class: "header-content" }, $a = { class: "title-section" }, Aa = { class: "modal-title" }, Ta = { class: "modal-body" }, xa = { class: "form-fields-container" }, Oa = { class: "modal-footer" }, ja = { class: "footer-buttons" }, Ha = { class: "btn-content" }, Ka = ["src"], Ba = /* @__PURE__ */ ue({
-  __name: "ModalDetailData",
-  props: {
-    schema: {},
-    formData: {},
-    valueNullView: { type: Boolean },
-    title: {},
-    closeText: {},
-    requiredText: {},
-    optionalText: {},
-    lang: {}
-  },
-  emits: ["close"],
-  setup(e, { emit: d }) {
-    const r = d, o = V(!1), c = V(""), t = () => r("close"), h = (i) => {
-      c.value = i, o.value = !0;
-    }, v = V(!1), y = () => {
-      v.value = window.innerWidth < 768;
-    };
-    return Se(() => {
-      y(), window.addEventListener("resize", y);
-    }), Qe(() => {
-      window.removeEventListener("resize", y);
-    }), (i, C) => (n(), s(W, null, [
-      I(De, {
-        name: "modal-overlay",
-        appear: ""
-      }, {
-        default: Me(() => [
-          a("div", {
-            class: "modal-overlay",
-            onClick: Je(t, ["self"])
-          }, [
-            I(De, {
-              name: "modal-container",
-              appear: ""
-            }, {
-              default: Me(() => [
-                a("div", {
-                  class: re(["modal-container", { "mobile-view": v.value }])
-                }, [
-                  a("div", Da, [
-                    a("div", Ma, [
-                      a("div", $a, [
-                        C[1] || (C[1] = a("div", { class: "icon-container" }, [
-                          a("svg", {
-                            width: "24",
-                            height: "24",
-                            viewBox: "0 0 24 24",
-                            fill: "none",
-                            xmlns: "http://www.w3.org/2000/svg"
-                          }, [
-                            a("path", {
-                              d: "M10 3H6C4.89543 3 4 3.89543 4 5V19C4 20.1046 4.89543 21 6 21H18C19.1046 21 20 20.1046 20 19V5C20 3.89543 19.1046 3 18 3H14M10 3V6C10 6.55228 10.4477 7 11 7H13C13.5523 7 14 6.55228 14 6V3M10 3V1M14 3V1M9 11H15M9 15H15",
-                              stroke: "currentColor",
-                              "stroke-width": "2",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round"
-                            })
-                          ])
-                        ], -1)),
-                        a("h2", Aa, k(e.title ?? "Detail Data"), 1)
-                      ]),
-                      a("button", {
-                        class: "close-btn",
-                        onClick: t,
-                        "aria-label": "Close"
-                      }, [...C[2] || (C[2] = [
-                        a("svg", {
-                          width: "20",
-                          height: "20",
-                          viewBox: "0 0 24 24",
-                          fill: "none",
-                          xmlns: "http://www.w3.org/2000/svg"
-                        }, [
-                          a("path", {
-                            d: "M18 6L6 18M6 6L18 18",
-                            stroke: "currentColor",
-                            "stroke-width": "2",
-                            "stroke-linecap": "round",
-                            "stroke-linejoin": "round"
-                          })
-                        ], -1)
-                      ])])
-                    ])
-                  ]),
-                  a("div", Ta, [
-                    a("div", xa, [
-                      (n(!0), s(W, null, q(e.schema, (O, F) => (n(), ce(l(xe), {
-                        key: F,
-                        field: O,
-                        "field-key": F,
-                        "form-data": e.formData,
-                        "required-text": e.requiredText,
-                        "optional-text": e.optionalText,
-                        "value-null-view": e.valueNullView,
-                        onImageClick: h,
-                        lang: e.lang
-                      }, null, 8, ["field", "field-key", "form-data", "required-text", "optional-text", "value-null-view", "lang"]))), 128))
-                    ])
-                  ]),
-                  a("div", Oa, [
-                    a("div", ja, [
-                      a("button", {
-                        type: "button",
-                        onClick: t,
-                        class: "btn btn-primary"
-                      }, [
-                        a("span", Ha, [
-                          C[3] || (C[3] = a("svg", {
-                            width: "16",
-                            height: "16",
-                            viewBox: "0 0 24 24",
-                            fill: "none",
-                            xmlns: "http://www.w3.org/2000/svg"
-                          }, [
-                            a("path", {
-                              d: "M6 18L18 6M6 6L18 18",
-                              stroke: "currentColor",
-                              "stroke-width": "2",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round"
-                            })
-                          ], -1)),
-                          oe(" " + k(e.closeText ?? "Close"), 1)
-                        ])
-                      ])
-                    ])
-                  ])
-                ], 2)
-              ]),
-              _: 1
-            })
-          ])
-        ]),
-        _: 1
-      }),
-      I(De, {
-        name: "modal-overlay",
-        appear: ""
-      }, {
-        default: Me(() => [
-          o.value ? (n(), s("div", {
-            key: 0,
-            class: "modal-overlay image-preview-overlay",
-            onClick: C[0] || (C[0] = (O) => o.value = !1)
-          }, [
-            I(De, {
-              name: "modal-container",
-              appear: ""
-            }, {
-              default: Me(() => [
-                a("img", {
-                  src: c.value,
-                  alt: "Preview",
-                  class: "image-preview-content"
-                }, null, 8, Ka)
-              ]),
-              _: 1
-            })
-          ])) : L("", !0)
-        ]),
-        _: 1
-      })
-    ], 64));
-  }
-}), Va = /* @__PURE__ */ me(Ba, [["__scopeId", "data-v-a78353a9"]]), Sa = ["innerHTML"], bs = /* @__PURE__ */ ue({
-  __name: "SafeHtml",
-  props: {
-    html: {}
-  },
-  setup(e) {
-    const d = e, r = X(() => et.sanitize(d.html));
-    return (o, c) => e.html ? (n(), s("div", {
-      key: 0,
-      innerHTML: r.value
-    }, null, 8, Sa)) : L("", !0);
-  }
-}), Ia = {
-  class: "alert-icon",
-  "aria-hidden": "true",
-  xmlns: "http://www.w3.org/2000/svg",
-  fill: "currentColor",
-  viewBox: "0 0 20 20"
-}, La = {
-  key: 0,
-  d: "M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5ZM9.5 4a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM12 15H8a1 1 0 0 1 0-2h1v-3H8a1 1 0 0 1 0-2h2a1 1 0 0 1 1 1v4h1a1 1 0 0 1 0 2Z"
-}, Na = {
-  key: 1,
-  d: "M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5Zm3.707 8.207-4 4a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L9 10.586l3.293-3.293a1 1 0 0 1 1.414 1.414Z"
-}, Fa = { class: "sr-only" }, Pa = { class: "alert-title" }, Ea = { class: "alert-messages" }, za = /* @__PURE__ */ ue({
-  __name: "AlertApp",
-  setup(e, { expose: d }) {
-    const r = V([]), o = V([]), c = V([]);
-    let t = 0;
-    function h() {
-      let y = 0;
-      c.value = o.value.map((i) => {
-        const C = i?.offsetHeight || 0, O = y;
-        return y += C + 10, O;
-      });
-    }
-    function v(y) {
-      y.id = t++, y.show = !1, r.value.push(y), $e(() => {
-        y.show = !0, h();
-      }), setTimeout(() => {
-        y.show = !1, $e(() => {
-          h(), setTimeout(() => {
-            r.value = r.value.filter((i) => i.id !== y.id), $e(h);
-          }, 200);
-        });
-      }, 5e3);
-    }
-    return Ae(r, () => {
-      $e(h);
-    }), d({
-      addAlert: v
-    }), (y, i) => (n(!0), s(W, null, q(r.value, (C, O) => (n(), s("div", {
-      key: C.id,
-      ref_for: !0,
-      ref_key: "alertRefs",
-      ref: o,
-      class: re(["alert-container", C.type === "error" ? "alert-error" : "alert-success"]),
-      style: je({
-        top: `${c.value[O] ?? 0}px`,
-        transform: `translateX(${C.show ? "0" : "200%"})`
-      }),
-      role: "alert"
-    }, [
-      (n(), s("svg", Ia, [
-        C.type === "error" ? (n(), s("path", La)) : (n(), s("path", Na))
-      ])),
-      a("span", Fa, k(C.type === "error" ? "Error" : "Success"), 1),
-      a("div", null, [
-        a("span", Pa, k(C.title), 1),
-        a("ul", Ea, [
-          (n(!0), s(W, null, q(C.messages, (F, b) => (n(), s("li", { key: b }, k(F), 1))), 128))
-        ])
-      ])
-    ], 6))), 128));
-  }
-}), Ua = /* @__PURE__ */ me(za, [["__scopeId", "data-v-005a57aa"]]), Wa = ["aria-labelledby"], Ra = {
-  id: "dialog-title",
-  class: "dialog-title"
-}, Za = {
-  id: "dialog-desc",
-  class: "dialog-message"
-}, qa = { class: "button-container" }, Ga = /* @__PURE__ */ ue({
-  __name: "WarningForm",
-  props: {
-    title: { default: "Warning Title" },
-    message: { default: "Warning Message" },
-    isGreen: { type: Boolean, default: !1 }
-  },
-  emits: ["confirm", "close"],
-  setup(e, { emit: d }) {
-    const r = e, o = d;
-    return (c, t) => (n(), s("div", {
-      class: "warning-overlay",
-      onKeydown: t[2] || (t[2] = ze((h) => o("close"), ["esc"]))
-    }, [
-      a("div", {
-        class: "warning-dialog",
-        role: "dialog",
-        "aria-modal": "true",
-        "aria-labelledby": r.title
-      }, [
-        a("h2", Ra, k(r.title), 1),
-        a("p", Za, k(r.message), 1),
-        a("div", qa, [
-          a("button", {
-            class: re(["btn btn-confirm", r.isGreen ? "btn-green" : "btn-red"]),
-            onClick: t[0] || (t[0] = (h) => o("confirm"))
-          }, " Ya ", 2),
-          a("button", {
-            class: "btn btn-cancel",
-            onClick: t[1] || (t[1] = (h) => o("close"))
-          }, "Tidak")
-        ])
-      ], 8, Wa)
-    ], 32));
-  }
-}), Pe = /* @__PURE__ */ me(Ga, [["__scopeId", "data-v-a8d3c182"]]);
-async function Oe(e, d, r, o) {
-  const c = {};
-  for (const [t, h] of Object.entries(d)) {
-    const v = h?.type;
-    if (v === "select" && h.DB_NAME && !h.optionsIsNumber) {
-      const i = e[h.baseKey?.base ?? t];
-      if (i !== null) {
-        const C = await ke(h.DB_NAME, i);
-        c[t] = C[h.baseKey.name ?? "name"] ?? "";
-      } else
-        c[t] = "";
-      continue;
-    }
-    if (v === "object") {
-      const i = e[t] || {};
-      c[t] = await Oe(
-        e[t] || {},
-        h.schema || {},
-        i,
-        h.baseKey?.base ?? "id"
-      );
-      continue;
-    }
-    if (v === "optionGroupSchema" && h.options) {
-      if (h.withValue) {
-        const i = e[t];
-        c[t] = await ge(i);
-      }
-      for (const [i, C] of Object.entries(
-        h.options
-      ))
-        for (const [O, F] of Object.entries(C)) {
-          const b = F, S = e[O];
-          if (b.type === "optionGroupSchema" && b.options) {
-            const $ = await Oe(
-              e,
-              { [O]: b },
-              r,
-              o
-            );
-            Object.assign(c, $);
-            continue;
-          }
-          if (b.type === "object") {
-            c[O] = await Oe(
-              e[O] || {},
-              b.schema || {},
-              e[O] || {},
-              b.baseKey?.base ?? "id"
-            );
-            continue;
-          }
-          if (b.type === "select" && b.DB_NAME && !b.optionsIsNumber) {
-            const $ = e[b.baseKey?.base ?? O];
-            if ($ != null) {
-              const H = b.DB_NAME, E = await ke(H, $);
-              c[O] = E[b.baseKey?.name ?? "name"] ?? void 0;
-            } else
-              c[O] = void 0;
-          } else
-            c[O] = ge(S);
-        }
-      continue;
-    }
-    const y = e[t];
-    c[t] = ge(y);
-  }
-  return r && e?.[o ?? "id"] && (c[o ?? "id"] = e?.[o ?? "id"]), c;
-}
-async function we(e, d) {
-  const r = {};
-  console.log(e);
-  for (const [o, c] of Object.entries(d)) {
-    const t = c?.type, h = e[c.baseKey?.base ?? o];
-    if (t === "select" && c.optionsView && c.options && h) {
-      const v = c.options.findIndex((y) => y === h);
-      if (!c.optionsView[v] && c.DB_NAME && c.baseKey.name) {
-        const i = (await ke(c.DB_NAME, h))[c.baseKey.name];
-        r[o] = i;
-      } else
-        r[o] = c.optionsView[v] ?? h;
-      continue;
-    }
-    if (t === "object") {
-      r[o] = await we(h || {}, c.schema || {});
-      continue;
-    }
-    if (t === "optionGroupSchema") {
-      const v = [];
-      for (const [i, C] of Object.entries(
-        c.options
-      ))
-        v.push(C);
-      const y = await We(e, v);
-      Object.assign(r, y);
-      continue;
-    }
-    if (t === "arrayObject") {
-      const v = [];
-      for (const y of h) {
-        const i = await we(y, c.schema || {});
-        v.push(i);
-      }
-      r[o] = v;
-      continue;
-    }
-    r[o] = ge(h);
-  }
-  return r;
-}
-async function We(e, d) {
-  const r = {};
-  for (const o of d)
-    for (const [c, t] of Object.entries(o)) {
-      const h = t?.type, v = e[t.baseKey?.base ?? c];
-      if (h === "select" && t.optionsView && t.options && v) {
-        const y = t.options.findIndex((i) => i === v);
-        if (!t.optionsView[y] && t.DB_NAME && t.baseKey.name) {
-          const C = (await ke(t.DB_NAME, v))[t.baseKey.name];
-          r[c] = C;
-        } else
-          r[c] = t.optionsView[y] ?? v;
-      } else if (h === "optionGroupSchema") {
-        const y = [];
-        for (const [C, O] of Object.entries(
-          t.options
-        ))
-          y.push(O);
-        const i = await We(e, y);
-        Object.assign(r, i);
-      } else if (h === "object")
-        r[c] = await we(v || {}, t.schema || {});
-      else if (h === "arrayObject") {
-        const y = [];
-        for (const i of v) {
-          const C = await we(i, t.schema || {});
-          y.push(C);
-        }
-        r[c] = y;
-        continue;
-      } else
-        r[c] = ge(v);
-    }
-  return r;
-}
-function ge(e, d) {
-  return e ?? null;
-}
-function ve(e) {
-  const d = Te(e), r = Array.isArray(d) ? [] : {};
-  if (Array.isArray(d))
-    return d.map((o) => o !== null && typeof o == "object" && !(o instanceof File || o instanceof Blob || o instanceof Date) && !Array.isArray(o) ? ve(o) : o);
-  for (const o in d) {
-    const c = d[o];
-    c === void 0 ? r[o] = null : c instanceof File || c instanceof Blob || c instanceof Date ? r[o] = c : typeof c == "string" && (c.trim() === "" || c === "<p><br></p>") || typeof c == "number" && c === 0 ? r[o] = null : Array.isArray(c) ? r[o] = c.map((t) => t !== null && typeof t == "object" && !(t instanceof File || t instanceof Blob || t instanceof Date) && !Array.isArray(t) ? ve(t) : t) : typeof c == "object" && c !== null ? r[o] = ve(c) : r[o] = c;
-  }
-  return r;
-}
-function Re(e) {
-  return e ? typeof e == "string" ? /\.(jpg|jpeg|png|webp|avif|gif|svg)$/.test(e.toLowerCase()) || e.startsWith("data:image/") || e.startsWith("blob:") : e instanceof File || typeof e == "object" && e.type?.startsWith("image/") : !1;
-}
-function Ee(e) {
-  return typeof e == "string" ? e : e instanceof File || typeof e == "object" && e.url ? e.url || URL.createObjectURL(e) : "";
-}
-function Qa(e) {
-  return Array.isArray(e) && e.every((d) => Re(d));
-}
-function Ja(e) {
-  return Array.isArray(e) ? e.every((d) => Ze(d)) : !1;
-}
-function Ze(e) {
-  return typeof e != "string" ? !1 : /^#([0-9A-F]{3}){1,2}$/i.test(e) || /^rgb(a?)\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(,\s*[\d\.]+\s*)?\)$/i.test(e) || /^hsl(a?)\(\s*\d+\s*,\s*[\d\.]+%\s*,\s*[\d\.]+%\s*(,\s*[\d\.]+\s*)?\)$/i.test(e) ? !0 : [
-    "red",
-    "blue",
-    "green",
-    "yellow",
-    "orange",
-    "purple",
-    "pink",
-    "brown",
-    "black",
-    "white",
-    "gray",
-    "cyan",
-    "magenta",
-    "lime",
-    "maroon",
-    "navy",
-    "olive",
-    "teal",
-    "silver",
-    "aqua"
-  ].includes(e.toLowerCase());
-}
-function Xa(e) {
-  return /<\/?[a-z][\s\S]*>/i.test(e);
-}
-function Ya(e) {
-  return Object.keys(e).reduce((d, r) => (r !== "id" && (d[r] = e[r]), d), {});
-}
-function en(e, d, r, o, c, t, h, v) {
-  const y = V({});
-  async function i(B) {
-    o.value?.show("loading", t.message.process.loading);
-    try {
-      const p = await h(e.data, B);
-      if (v.isUpdate.value = Number(B), !p) {
-        o.value?.show("error", t.message.notFound);
-        return;
-      }
-      const z = e.base.schema.update ?? e.base.schema.global ?? {};
-      if (y.value = await Oe(
-        p,
-        z,
-        v.isUpdate.value,
-        e.keys?.idKey ?? "id"
-      ), e.base?.justTabel || e.manual?.update || !e.endPoints?.update) {
-        d("edit", y.value, B), o.value?.hide();
-        return;
-      }
-      v.FormModalOpen.value = !0, o.value?.hide();
-    } catch (p) {
-      const z = typeof p == "string" ? p : p instanceof Error ? p.message : JSON.stringify(p, Object.getOwnPropertyNames(p));
-      o.value?.show("error", z || "An unknown error occurred");
-    }
-  }
-  function C() {
-    if (e.base?.justTabel || e.manual?.create || !e.endPoints?.create) {
-      d("create");
-      return;
-    }
-    v.isUpdate.value = null, v.FormModalOpen.value = !0;
-  }
-  async function O(B) {
-    o.value?.show("loading", t.message.process.loading);
-    try {
-      const p = await h(e.data, B);
-      if (v.isUpdate.value = Number(B), !p) {
-        o.value?.show("error", t.message.notFound);
-        return;
-      }
-      if (y.value = await we(
-        p,
-        e.base?.schema.display ?? e.base?.schema.global ?? {}
-      ), e.base.justTabel || e.manual?.display) {
-        d("show", y.value, B), o.value?.hide();
-        return;
-      }
-      v.detailItemModal.value = !0, o.value?.hide();
-    } catch (p) {
-      o.value?.show("error", JSON.stringify(p));
-    }
-  }
-  function F(B) {
-    v.idData.value = B, v.showWarningModel.value = !0;
-  }
-  function b() {
-    v.showWarningModelSelected.value = !0;
-  }
-  function S() {
-    v.showWarningModel.value = !1, v.showWarningModelSelected.value = !1, v.FormModalOpen.value = !1, v.detailItemModal.value = !1, y.value = {}, v.isUpdate.value = null;
-  }
-  const $ = async (B) => {
-    const p = v.isUpdate.value !== null, z = p ? e.endPoints?.update : e.endPoints?.create, R = p ? e.validation?.update || null : e.validation?.create || null, te = p ? "update" : "create", Z = p ? t.message.success.update : t.message.success.create, G = p ? t.message.error.update : t.message.error.create;
-    if (!z) {
-      o.value?.show(
-        "error",
-        p ? t.message.error.update : t.message.error.create
-      );
-      return;
-    }
-    if (Array.isArray(v.dataChildDelete.value) && v.dataChildDelete.value.length > 0 && p) {
-      const U = e.base.schema.update ?? e.base.schema.global ?? {};
-      let N = "", Y, ne = await h(
-        e.data,
-        v.isUpdate.value
-      ), de, he, ye = !0;
-      for (const ee in U) {
-        const Q = U[ee];
-        if (Q.type === "arrayObject") {
-          N = ee, Y = Q.endPoint?.deleteMany ?? e.endPoints?.deleteMany, de = Q.DB_NAME ?? e.base.source.DB_NAME, he = Q.deleteValidation ?? e.validation?.delete ?? void 0, ye = !0;
-          break;
-        }
-      }
-      if (Array.isArray(y.value[N]))
-        for (let ee = 0; ee < v.dataChildDelete.value.length; ee++) {
-          const Q = v.dataChildDelete.value[ee];
-          e.keys?.idKey, y.value[N] = y.value[N].filter((J) => J?.[e.keys?.idKey ?? "id"] !== Q), ne && Array.isArray(ne[N]) && (ne[N] = ne[N].filter((J) => J?.[e.keys?.idKey ?? "id"] !== Q));
-        }
-      const ae = tt(ve(B), ve(Te(y.value))), se = await E(
-        v.dataChildDelete.value,
-        Y,
-        he,
-        de,
-        ye
-      );
-      if (se?.response && ae) {
-        o.value?.show("success", t.message.success.delete), await at(de, ve(Te(ne))), await r(), S();
-        return;
-      } else if (!se?.response) {
-        o.value?.show("error", se.message);
-        return;
-      }
-    }
-    try {
-      o.value?.show(
-        "loading",
-        p ? t.message.process.update : t.message.process.create
-      );
-      const U = p ? e.submitOption?.update?.authType ?? e.submitOption?.global?.authType ?? "cookie" : e.submitOption?.create?.authType ?? e.submitOption?.global?.authType ?? "cookie", N = p ? e.submitOption?.update?.token ?? e.submitOption?.global?.token ?? void 0 : e.submitOption?.create?.token ?? e.submitOption?.global?.token ?? void 0, Y = p ? e.submitOption?.update?.customHeaders ?? e.submitOption?.global?.customHeaders ?? void 0 : e.submitOption?.create?.customHeaders ?? e.submitOption?.global?.customHeaders ?? void 0;
-      await fe({
-        data: ve(B),
-        oldData: p ? ve(Te(y.value)) : void 0,
-        validation: R ?? void 0,
-        endpoint: z,
-        mode: te,
-        token: N,
-        authType: U,
-        customHeaders: Y,
-        db: e.base.source.DB_NAME,
-        ...p ? e.submitOption?.update ?? e.submitOption?.global : e.submitOption?.create ?? e.submitOption?.global
-      }), e.base.dataTabelCustomDisplay ? d("refreshData") : r(), o.value?.show("success", Z), S();
-    } catch (U) {
-      c(
-        "error",
-        G,
-        Object.entries(U).map(([N, Y]) => `${N} : ${Y}`)
-      ), o.value?.show("error", G);
-    }
-  };
-  async function H(B, p, z, R, te = !0) {
-    if (e.base.justTabel || e.manual?.delete || !e.endPoints?.delete) {
-      d("delete", B);
-      return;
-    }
-    if (p = p ?? e.endPoints?.delete, z = z ?? e.validation?.delete, R = R ?? e.base?.source.DB_NAME ?? void 0, !p) {
-      o.value?.show("error", t.message.error.delete);
-      return;
-    }
-    const Z = { [e.keys?.idKey ?? "id"]: B };
-    try {
-      o.value?.show("loading", t.message.process.delete);
-      const G = e.submitOption?.delete?.authType ?? e.submitOption?.global?.authType ?? "cookie", U = e.submitOption?.delete?.token ?? e.submitOption?.global?.token ?? void 0, N = e.submitOption?.delete?.customHeaders ?? e.submitOption?.global?.customHeaders ?? void 0;
-      await fe({
-        data: Z,
-        validation: z ?? void 0,
-        endpoint: p,
-        mode: "delete",
-        token: U,
-        authType: G,
-        customHeaders: N,
-        db: R,
-        deleteDataDB: te,
-        ...e.submitOption?.delete ?? e.submitOption?.global
-      }), e.base?.dataTabelCustomDisplay ? d("refreshData") : r(), o.value?.show("success", t.message.success.delete);
-    } catch (G) {
-      c(
-        "error",
-        t.message.error.delete,
-        Object.entries(G).map(([U, N]) => `${U} : ${N}`)
-      ), o.value?.show("error", t.message.error.delete);
-    } finally {
-      S();
-    }
-  }
-  async function E(B, p, z, R, te = !0) {
-    if (e.base?.justTabel || e.manual?.delete || !e.endPoints?.delete) {
-      d("deleteMany", B);
-      return;
-    }
-    if (p = p ?? e.endPoints?.deleteMany, z = z ?? e.validation?.deleteMany, R = R ?? e.base?.source.DB_NAME ?? void 0, !p) {
-      o.value?.show("error", t.message.error.deleteMany);
-      return;
-    }
-    try {
-      o.value?.show("loading", t.message.process.deleteMany);
-      const Z = e.submitOption?.delete?.authType ?? e.submitOption?.global?.authType ?? "cookie", G = e.submitOption?.delete?.token ?? e.submitOption?.global?.token ?? void 0, U = e.submitOption?.delete?.customHeaders ?? e.submitOption?.global?.customHeaders ?? void 0, N = await fe({
-        data: { [e.keys?.idsKey ?? "ids"]: B },
-        validation: z ?? void 0,
-        endpoint: p,
-        mode: "delete",
-        db: R,
-        authType: Z,
-        token: G,
-        customHeaders: U,
-        deleteDataDB: te
-      });
-      return v.selectedItems.value = [], e.base?.dataTabelCustomDisplay ? (d("refreshData"), o.value?.show("success", t.message.success.deleteMany), S(), N) : (await r(), o.value?.show("success", t.message.success.deleteMany), S(), N);
-    } catch (Z) {
-      c(
-        "error",
-        t.message.error.deleteMany,
-        Object.entries(Z).map(([G, U]) => `${G} : ${U}`)
-      ), o.value?.show("error", t.message.error.deleteMany);
-    }
-  }
-  return {
-    initialData: y,
-    openEditModal: i,
-    openCreateModal: C,
-    openShowModal: O,
-    openWarningDeleteData: F,
-    openWarningDeleteSelectedData: b,
-    closeModal: S,
-    submitFormData: $,
-    DeleteData: H,
-    DeleteSeletedData: E
-  };
-}
-function tn(e, d, r, o) {
-  const c = V(""), t = V(1), h = V([]), v = V(!1), y = V(!1), i = V(!1), C = V(null), O = V(null), F = V("asc"), b = V(!1), S = V(!1), $ = V(null), H = V(null), E = X(() => e.pagination?.itemsPerPage ?? 10), B = X(() => e.pagination?.maxVisiblePages ?? 5);
-  V(null), V("none");
-  const p = X(() => {
-    const m = e.keys?.idKey;
-    return e.data.find((A) => A?.[m ?? "id"] === C.value) || {};
-  }), z = X(() => {
-    const m = e.keys?.idKey ?? "id", A = e.keys?.nameKey ?? "name";
-    return e.data.filter((j) => h.value.includes(j[m])).map((j) => j[A]).join(", ");
-  }), R = X(() => {
-    let m = (e.base.data ?? []).filter(
-      (A) => Object.values(A).some(
-        (j) => String(j).toLowerCase().includes(c.value.toLowerCase())
-      )
-    );
-    return O.value && m.sort((A, j) => {
-      let _ = A[O.value], M = j[O.value];
-      return typeof _ == "string" && (_ = _.toLowerCase()), typeof M == "string" && (M = M.toLowerCase()), _ < M ? F.value === "asc" ? -1 : 1 : _ > M ? F.value === "asc" ? 1 : -1 : 0;
-    }), m;
-  }), te = X(() => {
-    const m = (t.value - 1) * E.value;
-    return R.value.slice(m, m + E.value);
-  }), Z = X(() => Math.ceil(R.value.length / E.value)), G = X(() => {
-    const m = [], A = Z.value, j = t.value, _ = B.value;
-    if (A <= _ + 2) {
-      for (let w = 1; w <= A; w++) m.push(w);
-      return m;
-    }
-    m.push(1);
-    let M = Math.max(2, j - 2), f = Math.min(A - 1, j + 2);
-    M > 2 && m.push("...");
-    for (let w = M; w <= f; w++)
-      m.push(w);
-    return f < A - 1 && m.push("..."), m.push(A), m;
-  });
-  function U() {
-    h.value = v.value ? te.value.map((m) => m?.[e.keys?.idKey ?? "id"]) : [];
-  }
-  function N(m) {
-    O.value === m ? F.value = F.value === "desc" ? "asc" : "desc" : (O.value = m, F.value = "desc");
-  }
-  function Y() {
-    t.value > 1 && t.value--;
-  }
-  function ne() {
-    t.value < Z.value && t.value++;
-  }
-  async function de() {
-    if (e.base.source.DB_NAME) {
-      const m = await Be(e.base.source.DB_NAME);
-      if (e.base.source.connect?.length) {
-        const A = {};
-        return await Promise.all(
-          e.base.source.connect.map(async (j) => {
-            A[j.DB_NAME] = await Be(j.DB_NAME);
-          })
-        ), m.map((j) => {
-          let _ = { ...j };
-          for (const M of e.base.source.connect) {
-            const f = M.key, w = M.connectKey, T = (A[M.DB_NAME] || []).filter(
-              (K) => J(K, w) === J(j, f)
-            );
-            _[M.DB_NAME] = T.length > 0 ? T : null;
-          }
-          return _;
-        });
-      }
-      return m;
-    } else if (e.base.source.fetchApi?.getAll) {
-      const m = e.submitOption?.delete?.authType ?? e.submitOption?.global?.authType ?? "cookie", A = e.submitOption?.delete?.token ?? e.submitOption?.global?.token, j = e.submitOption?.delete?.customHeaders ?? e.submitOption?.global?.customHeaders, _ = await fe({
-        mode: "get",
-        endpoint: e.base.source.fetchApi?.getAll,
-        db: e.base.source.DB_NAME,
-        authType: m,
-        token: A,
-        customHeaders: j
-      });
-      if (e.base.source.fetchApi.connect?.length) {
-        const M = {};
-        return await Promise.all(
-          e.base.source.fetchApi.connect.map(async (f) => {
-            const w = await fe({
-              mode: "get",
-              endpoint: f.url,
-              db: e.base.source.DB_NAME,
-              authType: m,
-              token: A,
-              customHeaders: j
-            }), T = f.valueKey ?? f.url ?? f.key;
-            M[T] = w.data ?? [];
-          })
-        ), !_.data || !Array.isArray(_.data) ? _.data : _.data.map((f) => {
-          let w = { ...f };
-          for (const T of e.base.source.fetchApi.connect) {
-            const K = T.key, x = T.connectKey, u = T.valueKey ?? T.url ?? T.key, g = (M[u] || []).filter(
-              (D) => J(D, x) === J(f, K)
-            );
-            w[u] = g.length > 0 ? g : null;
-          }
-          return w;
-        });
-      }
-      return _.data ?? [];
-    } else
-      return;
-  }
-  async function he(m, A) {
-    if (m.connect?.withDB)
-      return await ke(m.connect.withDB.DB_NAME, A);
-    if (m.connect?.withFetch) {
-      const j = e.submitOption?.delete?.authType ?? e.submitOption?.global?.authType ?? "cookie", _ = e.submitOption?.delete?.token ?? e.submitOption?.global?.token ?? void 0, M = e.submitOption?.delete?.customHeaders ?? e.submitOption?.global?.customHeaders ?? void 0, f = await fe({
-        mode: "get",
-        endpoint: m.connect?.withFetch.url + "/" + A,
-        db: e.base.source.DB_NAME,
-        authType: j,
-        token: _,
-        customHeaders: M
-      });
-      if (f.data)
-        return f.data;
-    } else
-      return;
-  }
-  async function ye(m, A) {
-    return m.find((j) => j[e.keys?.idKey ?? "id"] == A);
-  }
-  let ae = !0, se = null;
-  async function ee() {
-    if (ae && r.value?.show("loading", o.message.process.loading), e.base?.dataTabelCustomDisplay && e.base?.dataTabelCustomDisplay.length !== 0) {
-      e.base.data = e.base.dataTabelCustomDisplay, e.data = await de(), await Q(), ae && (r.value?.hide(), ae = !1);
-      return;
-    }
-    const m = await de();
-    if (e.data = m, await Q(), Array.isArray(m)) {
-      const _ = e.keys?.idKey ?? "id";
-      m.sort((M, f) => M.updatedAt && f.updatedAt ? new Date(f.updatedAt).getTime() - new Date(M.updatedAt).getTime() : (f[_] ?? 0) - (M[_] ?? 0)), e.data = m;
-    } else {
-      ae && (r.value?.hide(), ae = !1);
-      return;
-    }
-    const A = e.keys?.idKey, j = e.base.headersTabelDisplay?.length === 0 || e.base.headersTabelDisplay === void 0;
-    e.base.data = await Promise.all(
-      m.map(async (_) => {
-        const M = {};
-        if (A && _[A] != null && (M[A] = _[A], j && (!e.base.headersTabelDisplay?.includes(A) || e.base.headersTabelDisplay === void 0) && (e.base.headersTabelDisplay = [])), e.base.dataTabelDisplay)
-          for (const [f, w] of Object.entries(e.base.dataTabelDisplay))
-            if (typeof w == "string") {
-              const T = J(_, w);
-              M[f] = Array.isArray(T) ? T.map((K) => ie(K)) : ie(T ?? "-"), j && !e.base.headersTabelDisplay?.includes(f) && e.base.headersTabelDisplay?.push(f);
-            } else {
-              let T = J(_, w.valueKey);
-              if ((w.connect?.withDB || w.connect?.withFetch) && T)
-                if (Array.isArray(T)) {
-                  const K = await Promise.all(
-                    T.map(async (x) => {
-                      const u = await he(w, x);
-                      return u ? u[w.connect?.withDB?.valueKey ?? w.connect?.withFetch?.valueKey] : x;
-                    })
-                  );
-                  M[f] = K.map((x) => ie(x));
-                } else {
-                  const K = await he(w, T);
-                  K && (T = K[w.connect.withDB?.valueKey ?? w.connect.withFetch?.valueKey]), M[f] = ie(T);
-                }
-              else
-                M[f] = ie(T);
-              j && !e.base.headersTabelDisplay?.includes(f) && e.base.headersTabelDisplay?.push(f);
-            }
-        else {
-          let f = 0;
-          for (const [w, T] of Object.entries(_)) {
-            if (w === A) continue;
-            if (f >= 8) break;
-            const K = be(w);
-            M[K] = ie(T), j && !e.base.headersTabelDisplay?.includes(K) && e.base.headersTabelDisplay?.push(K), f++;
-          }
-        }
-        return M;
-      })
-    ), ae && (r.value?.hide(), ae = !1), e.base?.source?.fetchApi?.autoRefresh?.time && (se && clearTimeout(se), se = setTimeout(() => {
-      ee();
-    }, e.base.source.fetchApi.autoRefresh.time));
-  }
-  async function Q() {
-    const m = {
-      global: e.base.schema.global ?? {},
-      create: e.base.schema.create ?? {},
-      update: e.base.schema.update ?? {},
-      display: e.base.schema.display ?? {}
-    }, A = (f) => ({
-      authType: e.submitOption?.[f]?.authType ?? e.submitOption?.global?.authType ?? "cookie",
-      token: e.submitOption?.[f]?.token ?? e.submitOption?.global?.token,
-      customHeaders: e.submitOption?.[f]?.customHeaders ?? e.submitOption?.global?.customHeaders
-    }), j = async (f) => {
-      const w = f.options?.valueKey ?? "id", T = f.options?.viewKey ?? "name";
-      let K;
-      if (f.options?.url && (K = await fe({
-        mode: "get",
-        endpoint: f.options.url,
-        ...A("get")
-      }), Array.isArray(K?.data) && (f.options = K.data.map((x) => x[w]) ?? [], f.options?.viewKey ? f.optionsView = K.map((x) => x[T]) ?? [] : f.optionsView = K.map((x) => x[w]) ?? [])), f.options?.DB_NAME) {
-        const x = f.options?.DB_NAME ?? f.optionsView?.DB_NAME;
-        if (K = await Be(x), Array.isArray(K)) {
-          const u = f.options;
-          u?.DB_NAME && (f.options = K.map((g) => g[w]) ?? []), u?.viewKey ? f.optionsView = K.map((g) => g[T]) ?? [] : f.optionsView = K.map((g) => g[w]) ?? [];
-        }
-      }
-    }, _ = (f, w) => {
-      e.data && f.validate?.duplicate === !0 && (f.validate.duplicate = e.data.map((T) => T[w]) ?? []);
-    };
-    async function M(f) {
-      for (const [w, T] of Object.entries(f)) {
-        const K = T?.type;
-        if (K === "select" && await j(T), K === "text" && _(T, w), K === "optionGroupSchema") {
-          const x = T?.options ?? {};
-          for (const [u, g] of Object.entries(x))
-            await M(g);
-        }
-        K === "arrayObject" && T.schema && await M(T.schema), K === "object" && T.schema && await M(T.schema);
-      }
-    }
-    for (const [f, w] of Object.entries(m))
-      w && await M(w);
-  }
-  function J(m, A) {
-    if (!(!m || typeof A != "string"))
-      try {
-        const j = A.replace(/\[(\d+)\]/g, ".$1").split(".");
-        let _ = m;
-        for (const M of j) {
-          if (_ == null) return;
-          if (Array.isArray(_)) {
-            const f = Number(M);
-            isNaN(f) ? (_ = _.map((w) => w?.[M]).filter((w) => w !== void 0), _.some((w) => Array.isArray(w)) && (_ = _.flat()), _.length === 1 && (_ = _[0])) : _ = _[f];
-          } else
-            _ = _?.[M];
-        }
-        return _;
-      } catch {
-        return "-";
-      }
-  }
-  function be(m) {
-    return m.replace(/([A-Z])/g, " $1").replace(/[_\-]/g, " ").replace(/\s+/g, " ").trim().replace(/\w\S*/g, (A) => A.charAt(0).toUpperCase() + A.slice(1).toLowerCase());
-  }
-  function ie(m) {
-    if (Array.isArray(m)) {
-      if (m.length === 0) return "Empty";
-      if (typeof m[0] == "string") return m.join(", ");
-      if (typeof m[0] == "object") return `${m.length} item`;
-    }
-    return typeof m == "object" && m !== null ? Object.keys(m).length > 0 ? "Objek" : "Empty" : m != null ? String(m) : "—";
-  }
-  return {
-    searchQuery: c,
-    currentPage: t,
-    selectedItems: h,
-    selectAll: v,
-    showWarningModel: y,
-    showWarningModelSelected: i,
-    idData: C,
-    sortField: O,
-    sortDirection: F,
-    FormModalOpen: b,
-    detailItemModal: S,
-    isUpdate: $,
-    dataChildDelete: H,
-    selectedItem: p,
-    selectedItemNames: z,
-    filteredData: R,
-    paginatedData: te,
-    totalPages: Z,
-    visiblePages: G,
-    toggleAll: U,
-    sortBy: N,
-    prevPage: Y,
-    nextPage: ne,
-    summarizeValue: ie,
-    setUpData: ee,
-    getValueByPath: J,
-    toTitleCase: be,
-    GetDataById: ye
-  };
-}
-const an = {
-  idKey: "id",
-  idsKey: "ids"
-}, nn = {
-  btnInfoActive: !0,
-  searchQueryActive: !0,
-  sortable: !0,
-  createActive: !0,
-  updateActive: !0,
-  deleteActive: !0,
-  deleteManyActive: !0,
-  displayActive: !0
-}, gs = {
-  create: !1,
-  update: !1,
-  delete: !1,
-  deleteMany: !1,
-  display: !1
-}, sn = {
-  itemsPerPage: 5,
-  maxVisiblePages: 5
-}, ln = {
-  create: void 0,
-  update: void 0,
-  delete: void 0,
-  deleteMany: void 0
-}, ks = {
-  create: void 0,
-  update: void 0,
-  delete: void 0,
-  deleteMany: void 0
-}, ws = {
-  global: {
-    authType: "cookie"
-  }
-}, on = { class: "table-container" }, rn = { class: "table-wrapper" }, cn = { class: "table-header" }, un = { class: "header-top" }, dn = { class: "header-actions" }, vn = { class: "action-buttons" }, mn = ["disabled"], hn = { class: "header-search" }, yn = {
-  key: 0,
-  class: "search-container"
-}, fn = ["placeholder"], bn = {
-  key: 0,
-  class: "selection-indicator"
-}, gn = { class: "selection-count" }, kn = {
-  key: 0,
-  class: "empty-state"
-}, wn = { class: "empty-title" }, pn = { class: "empty-description" }, _n = {
-  key: 1,
-  class: "table-content"
-}, Cn = { class: "table-scroll-container" }, Dn = { class: "data-table" }, Mn = { class: "table-header-row" }, $n = { class: "checkbox-column" }, An = { class: "header-content" }, Tn = ["onClick"], xn = { class: "actions-column" }, On = { class: "table-body" }, jn = { class: "checkbox-cell" }, Hn = ["value"], Kn = ["innerHTML"], Bn = {
-  key: 1,
-  class: "status-badge"
-}, Vn = {
-  key: 2,
-  class: "text-cell datetime-cell"
-}, Sn = {
-  key: 3,
-  class: "text-cell date-cell"
-}, In = {
-  key: 4,
-  class: "text-cell time-cell"
-}, Ln = {
-  key: 5,
-  class: "image-cell"
-}, Nn = { class: "image-container" }, Fn = ["src", "alt"], Pn = {
-  key: 6,
-  class: "color-array-cell"
-}, En = ["title"], zn = {
-  key: 0,
-  class: "color-count"
-}, Un = {
-  key: 7,
-  class: "color-cell"
-}, Wn = ["title"], Rn = {
-  key: 8,
-  class: "image-array-cell"
-}, Zn = ["src", "alt"], qn = {
-  key: 0,
-  class: "image-count"
-}, Gn = {
-  key: 9,
-  class: "array-cell"
-}, Qn = {
-  key: 10,
-  class: "text-cell"
-}, Jn = { class: "actions-cell" }, Xn = { class: "action-buttons-group" }, Yn = ["onClick"], es = { class: "action-text" }, ts = ["onClick"], as = { class: "action-text" }, ns = ["onClick"], ss = { class: "action-text" }, is = { class: "pagination-container" }, ls = { class: "pagination-info" }, os = { class: "pagination-controls" }, rs = ["disabled"], cs = { class: "pagination-pages" }, us = ["onClick", "disabled"], ds = ["disabled"], vs = /* @__PURE__ */ ue({
-  __name: "TabelData",
-  props: {
-    base: {},
-    keys: { default: () => an },
-    formDesign: {},
-    submitOption: {},
-    feature: { default: () => nn },
-    pagination: { default: () => sn },
-    validation: { default: () => ln },
-    manual: {},
-    endPoints: {}
-  },
-  emits: ["refreshData", "edit", "create", "show", "delete", "deleteMany"],
-  setup(e, { emit: d }) {
-    const r = (x) => typeof x == "string" && /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}/.test(x), o = (x) => typeof x == "string" && /^\d{4}-\d{2}-\d{2}$/.test(x), c = (x) => typeof x == "string" && /^\d{2}:\d{2}$/.test(x);
-    function t(x, u = "en") {
-      try {
-        const g = new Date(x), D = u === "id" ? "id-ID" : u;
-        return new Intl.DateTimeFormat(D, {
-          dateStyle: "medium",
-          // "18 Okt 2025"
-          timeStyle: "short"
-          // "10.54"
-        }).format(g);
-      } catch {
-        return x;
-      }
-    }
-    function h(x, u = "en") {
-      try {
-        const g = /* @__PURE__ */ new Date(`${x}T00:00:00`), D = u === "id" ? "id-ID" : u;
-        return new Intl.DateTimeFormat(D, {
-          dateStyle: "medium"
-          // "18 Okt 2025"
-        }).format(g);
-      } catch {
-        return x;
-      }
-    }
-    function v(x, u = "en") {
-      try {
-        const [g, D] = x.split(":"), le = /* @__PURE__ */ new Date();
-        le.setHours(parseInt(g, 10), parseInt(D, 10), 0, 0);
-        const pe = u === "id" ? "id-ID" : u;
-        return new Intl.DateTimeFormat(pe, {
-          timeStyle: "short"
-          // "10.54"
-        }).format(le);
-      } catch {
-        return x;
-      }
-    }
-    const y = e, i = V({
-      ...y
-    }), C = d, O = V(null), F = V(), b = X(() => Ue[y.base?.lang ?? "en"]), {
-      searchQuery: S,
-      currentPage: $,
-      selectedItems: H,
-      selectAll: E,
-      showWarningModel: B,
-      showWarningModelSelected: p,
-      idData: z,
-      FormModalOpen: R,
-      detailItemModal: te,
-      isUpdate: Z,
-      dataChildDelete: G,
-      selectedItem: U,
-      filteredData: N,
-      paginatedData: Y,
-      totalPages: ne,
-      visiblePages: de,
-      selectedItemNames: he,
-      toggleAll: ye,
-      sortBy: ae,
-      prevPage: se,
-      nextPage: ee,
-      setUpData: Q,
-      GetDataById: J
-    } = tn(i.value, C, O, b.value), {
-      initialData: be,
-      openEditModal: ie,
-      openCreateModal: m,
-      openShowModal: A,
-      openWarningDeleteData: j,
-      openWarningDeleteSelectedData: _,
-      closeModal: M,
-      submitFormData: f,
-      DeleteData: w,
-      DeleteSeletedData: T
-    } = en(
-      i.value,
-      C,
-      Q,
-      O,
-      K,
-      b.value,
-      J,
-      {
-        selectedItems: H,
-        idData: z,
-        isUpdate: Z,
-        FormModalOpen: R,
-        detailItemModal: te,
-        dataChildDelete: G,
-        showWarningModel: B,
-        showWarningModelSelected: p
-      }
-    );
-    Ae(H, (x) => {
-      E.value = x.length === Y.value.length && Y.value.length > 0;
-    }), Ae(S, () => {
-      $.value = 1;
-    }), Ae(
-      () => y.base.dataTabelCustomDisplay || y.base.schema,
-      async () => {
-        Object.assign(i.value, {
-          ...y
-        }), H.value = [], await Q();
-      }
-    ), Se(async () => {
-      Object.assign(i.value, {
-        ...y
-      }), await Q();
-    }), Xe("TableComponents", { ShowAlert: K, loader: O, labels: b });
-    function K(x, u, g) {
-      const D = {
-        type: x,
-        title: u,
-        messages: g
-      };
-      F.value?.addAlert(D);
-    }
-    return (x, u) => (n(), s("div", on, [
-      I(l(nt), {
-        ref_key: "loader",
-        ref: O
-      }, null, 512),
-      l(B) ? (n(), ce(l(Pe), {
-        key: 0,
-        title: b.value.warning.delete,
-        message: `${l(U).name ?? l(U)[i.value?.keys?.nameKey ?? i.value?.keys?.idKey ?? "id"]}`,
-        onConfirm: u[0] || (u[0] = () => {
-          l(z) !== null && l(w)(l(z));
-        }),
-        onClose: l(M)
-      }, null, 8, ["title", "message", "onClose"])) : L("", !0),
-      l(p) ? (n(), ce(l(Pe), {
-        key: 1,
-        title: b.value.warning.deleteMany,
-        message: l(he),
-        onConfirm: u[1] || (u[1] = () => l(T)(l(H))),
-        onClose: l(M)
-      }, null, 8, ["title", "message", "onClose"])) : L("", !0),
-      l(te) ? (n(), ce(l(Va), {
-        key: 2,
-        title: b.value?.title?.display,
-        "close-text": b.value?.btn?.close,
-        schema: i.value?.base?.schema.display ?? i.value?.base?.schema.global ?? {},
-        "form-data": l(be) ?? {},
-        "value-null-view": !0,
-        onClose: l(M)
-      }, null, 8, ["title", "close-text", "schema", "form-data", "onClose"])) : L("", !0),
-      I(l(Ua), {
-        ref_key: "alert",
-        ref: F
-      }, null, 512),
-      l(R) ? (n(), ce(st, {
-        key: 3,
-        id: l(Z) ?? null,
-        "is-update": !!l(Z),
-        schema: l(Z) ? i.value.base.schema.update ?? i.value.base.schema.global : i.value.base.schema.create ?? i.value.base.schema.global,
-        "initial-data": l(Z) ? l(be) : void 0,
-        lang: i.value.base.lang ?? "en",
-        onCancel: u[2] || (u[2] = (g) => R.value = !1),
-        onDataChildRemove: u[3] || (u[3] = (g) => G.value = g),
-        onSubmit: l(f)
-      }, null, 8, ["id", "is-update", "schema", "initial-data", "lang", "onSubmit"])) : L("", !0),
-      a("div", rn, [
-        a("div", cn, [
-          a("div", un, [
-            a("div", dn, [
-              a("div", vn, [
-                i.value?.feature?.createActive ? (n(), s("button", {
-                  key: 0,
-                  onClick: u[4] || (u[4] = (g) => l(m)()),
-                  class: "btn btn-primary"
-                }, [
-                  u[14] || (u[14] = a("span", { class: "btn-icon" }, [
-                    a("svg", {
-                      width: "16",
-                      height: "16",
-                      viewBox: "0 0 24 24",
-                      fill: "none"
-                    }, [
-                      a("path", {
-                        d: "M12 5V19M5 12H19",
-                        stroke: "currentColor",
-                        "stroke-width": "2",
-                        "stroke-linecap": "round",
-                        "stroke-linejoin": "round"
-                      })
-                    ])
-                  ], -1)),
-                  oe(" " + k(b.value?.btn?.add), 1)
-                ])) : L("", !0),
-                l(H).length > 0 && i.value?.feature?.deleteManyActive ? (n(), s("button", {
-                  key: 1,
-                  onClick: u[5] || (u[5] = (g) => l(_)()),
-                  class: re(["btn btn-danger", { disabled: l(H).length === 0 }]),
-                  disabled: l(H).length === 0
-                }, [
-                  u[15] || (u[15] = a("span", { class: "btn-icon" }, [
-                    a("svg", {
-                      width: "16",
-                      height: "16",
-                      viewBox: "0 0 24 24",
-                      fill: "none"
-                    }, [
-                      a("path", {
-                        d: "M19 7L18.1327 19.1425C18.0579 20.1891 17.187 21 16.1378 21H7.86224C6.81296 21 5.94208 20.1891 5.86732 19.1425L5 7M10 11V17M14 11V17M15 7V4C15 3.44772 14.5523 3 14 3H10C9.44772 3 9 3.44772 9 4V7M4 7H20",
-                        stroke: "currentColor",
-                        "stroke-width": "2",
-                        "stroke-linecap": "round",
-                        "stroke-linejoin": "round"
-                      })
-                    ])
-                  ], -1)),
-                  oe(" " + k(b.value?.btn?.deleteMany), 1)
-                ], 10, mn)) : L("", !0)
-              ])
-            ]),
-            a("div", hn, [
-              i.value?.feature?.searchQueryActive ? (n(), s("div", yn, [
-                u[16] || (u[16] = a("div", { class: "search-icon" }, [
-                  a("svg", {
-                    width: "16",
-                    height: "16",
-                    viewBox: "0 0 24 24",
-                    fill: "none"
-                  }, [
-                    a("path", {
-                      d: "M21 21L16.514 16.506M19 10.5C19 15.194 15.194 19 10.5 19C5.806 19 2 15.194 2 10.5C2 5.806 5.806 2 10.5 2C15.194 2 19 5.806 19 10.5Z",
-                      stroke: "currentColor",
-                      "stroke-width": "2",
-                      "stroke-linecap": "round",
-                      "stroke-linejoin": "round"
-                    })
-                  ])
-                ], -1)),
-                He(a("input", {
-                  "onUpdate:modelValue": u[6] || (u[6] = (g) => Ke(S) ? S.value = g : null),
-                  type: "text",
-                  placeholder: b.value?.search || "Search...",
-                  class: "search-input",
-                  onKeyup: u[7] || (u[7] = ze((g) => $.value = 1, ["enter"]))
-                }, null, 40, fn), [
-                  [Ye, l(S)]
-                ])
-              ])) : L("", !0)
-            ])
-          ]),
-          l(H).length > 0 ? (n(), s("div", bn, [
-            a("span", gn, k(l(H).length), 1),
-            oe(" " + k(l(H).length === 1 ? b.value.selection.selectedOne ?? "item is selected" : b.value.selection.selected ?? "items are selected"), 1)
-          ])) : L("", !0)
-        ]),
-        l(N).length === 0 ? (n(), s("div", kn, [
-          u[18] || (u[18] = a("div", { class: "empty-icon" }, [
-            a("svg", {
-              width: "64",
-              height: "64",
-              viewBox: "0 0 24 24",
-              fill: "none"
-            }, [
-              a("path", {
-                d: "M3 7V17C3 18.1046 3.89543 19 5 19H19C20.1046 19 21 18.1046 21 17V9C21 7.89543 20.1046 7 19 7H3ZM3 7V5C3 3.89543 3.89543 3 5 3H9",
-                stroke: "currentColor",
-                "stroke-width": "2",
-                "stroke-linecap": "round"
-              }),
-              a("path", {
-                d: "M15 13C15 14.6569 13.6569 16 12 16C10.3431 16 9 14.6569 9 13C9 11.3431 10.3431 10 12 10C13.6569 10 15 11.3431 15 13Z",
-                stroke: "currentColor",
-                "stroke-width": "2"
-              })
-            ])
-          ], -1)),
-          a("h3", wn, k(b.value?.message?.notFound), 1),
-          a("p", pn, k(b.value?.message?.notFoundDesc || "No data available"), 1),
-          i.value?.feature?.createActive ? (n(), s("button", {
-            key: 0,
-            onClick: u[8] || (u[8] = (g) => l(m)()),
-            class: "btn btn-primary empty-action"
-          }, [
-            u[17] || (u[17] = a("span", { class: "btn-icon" }, [
-              a("svg", {
-                width: "16",
-                height: "16",
-                viewBox: "0 0 24 24",
-                fill: "none"
-              }, [
-                a("path", {
-                  d: "M12 5V19M5 12H19",
-                  stroke: "currentColor",
-                  "stroke-width": "2",
-                  "stroke-linecap": "round",
-                  "stroke-linejoin": "round"
-                })
-              ])
-            ], -1)),
-            oe(" " + k(b.value?.btn?.add), 1)
-          ])) : L("", !0)
-        ])) : (n(), s("div", _n, [
-          a("div", Cn, [
-            a("table", Dn, [
-              a("thead", Mn, [
-                a("tr", null, [
-                  a("th", $n, [
-                    i.value?.feature?.deleteManyActive ? He((n(), s("input", {
-                      key: 0,
-                      type: "checkbox",
-                      onChange: u[9] || (u[9] = //@ts-ignore
-                      (...g) => l(ye) && l(ye)(...g)),
-                      "onUpdate:modelValue": u[10] || (u[10] = (g) => Ke(E) ? E.value = g : null),
-                      class: "checkbox-input"
-                    }, null, 544)), [
-                      [Fe, l(E)]
-                    ]) : L("", !0)
-                  ]),
-                  (n(!0), s(W, null, q(i.value?.base.headersTabelDisplay, (g, D) => (n(), s("th", {
-                    key: g,
-                    class: re(["table-header-cell", { "hidden-mobile": D > 0 }])
-                  }, [
-                    a("div", An, [
-                      oe(k(g) + " ", 1),
-                      i.value?.feature?.sortable ? (n(), s("button", {
-                        key: 0,
-                        onClick: (le) => l(ae)(g),
-                        class: "sort-button"
-                      }, [...u[19] || (u[19] = [
-                        a("svg", {
-                          width: "16",
-                          height: "16",
-                          viewBox: "0 0 24 24",
-                          fill: "none"
-                        }, [
-                          a("path", {
-                            d: "M8 9L12 5L16 9M16 15L12 19L8 15",
-                            stroke: "currentColor",
-                            "stroke-width": "2",
-                            "stroke-linecap": "round",
-                            "stroke-linejoin": "round"
-                          })
-                        ], -1)
-                      ])], 8, Tn)) : L("", !0)
-                    ])
-                  ], 2))), 128)),
-                  a("th", xn, k(b.value?.action || "Actions"), 1)
-                ])
-              ]),
-              a("tbody", On, [
-                (n(!0), s(W, null, q(l(Y), (g) => (n(), s("tr", {
-                  key: g?.[i.value?.keys?.idKey ?? "id"],
-                  class: "table-row"
-                }, [
-                  a("td", jn, [
-                    i.value?.feature?.deleteManyActive ? He((n(), s("input", {
-                      key: 0,
-                      type: "checkbox",
-                      "onUpdate:modelValue": u[11] || (u[11] = (D) => Ke(H) ? H.value = D : null),
-                      value: g?.[i.value?.keys?.idKey ?? "id"],
-                      class: "checkbox-input"
-                    }, null, 8, Hn)), [
-                      [Fe, l(H)]
-                    ]) : L("", !0)
-                  ]),
-                  (n(!0), s(W, null, q(l(Ya)(g), (D, le, pe) => (n(), s("td", {
-                    key: le,
-                    class: re(["table-cell", {
-                      "hidden-mobile": pe > 0,
-                      "primary-cell": pe === 0
-                    }])
-                  }, [
-                    l(Xa)(D) ? (n(), s("div", {
-                      key: 0,
-                      innerHTML: D,
-                      class: "html-content"
-                    }, null, 8, Kn)) : le === "status" || le === "active" ? (n(), s("div", Bn, [
-                      a("span", {
-                        class: re({
-                          "status-active": D,
-                          "status-inactive": !D
-                        })
-                      }, k(D ? b.value?.btn.toogle?.active || "Active" : b.value?.btn.toogle?.inactive || "Inactive"), 3)
-                    ])) : r(D) ? (n(), s("div", Vn, [
-                      u[20] || (u[20] = a("svg", {
-                        width: "14",
-                        height: "14",
-                        viewBox: "0 0 24 24",
-                        fill: "none",
-                        class: "cell-icon"
-                      }, [
-                        a("path", {
-                          d: "M8 7V3M16 7V3M4 11H20M5 21H19C20.1046 21 21 20.1046 21 19V7C21 5.89543 20.1046 5 19 5H5C3.89543 5 3 5.89543 3 7V19C3 20.1046 3.89543 21 5 21Z",
-                          stroke: "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        }),
-                        a("path", {
-                          d: "M12 15H12.01M12 18H12.01M16 15H16.01M16 18H16.01M8 15H8.01M8 18H8.01",
-                          stroke: "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        })
-                      ], -1)),
-                      a("span", null, k(t(D, i.value.base.lang ?? "en")), 1)
-                    ])) : o(D) ? (n(), s("div", Sn, [
-                      u[21] || (u[21] = a("svg", {
-                        width: "14",
-                        height: "14",
-                        viewBox: "0 0 24 24",
-                        fill: "none",
-                        class: "cell-icon"
-                      }, [
-                        a("path", {
-                          d: "M8 7V3M16 7V3M4 11H20M5 21H19C20.1046 21 21 20.1046 21 19V7C21 5.89543 20.1046 5 19 5H5C3.89543 5 3 5.89543 3 7V19C3 20.1046 3.89543 21 5 21Z",
-                          stroke: "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        })
-                      ], -1)),
-                      a("span", null, k(h(D, i.value.base.lang ?? "en")), 1)
-                    ])) : c(D) ? (n(), s("div", In, [
-                      u[22] || (u[22] = a("svg", {
-                        width: "14",
-                        height: "14",
-                        viewBox: "0 0 24 24",
-                        fill: "none",
-                        class: "cell-icon"
-                      }, [
-                        a("path", {
-                          d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z",
-                          stroke: "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        }),
-                        a("path", {
-                          d: "M12 6V12L16 14",
-                          stroke: "currentColor",
-                          "stroke-width": "2",
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round"
-                        })
-                      ], -1)),
-                      a("span", null, k(v(D, i.value.base.lang ?? "en")), 1)
-                    ])) : l(Re)(D) ? (n(), s("div", Ln, [
-                      a("div", Nn, [
-                        a("img", {
-                          src: l(Ee)(D),
-                          class: "image-preview",
-                          alt: `Preview ${le}`
-                        }, null, 8, Fn)
-                      ])
-                    ])) : l(Ja)(D) ? (n(), s("div", Pn, [
-                      (n(!0), s(W, null, q(D.slice(0, 3), (_e, Ce) => (n(), s("div", {
-                        key: Ce,
-                        style: je({ backgroundColor: _e }),
-                        class: "color-chip",
-                        title: _e
-                      }, null, 12, En))), 128)),
-                      D.length > 3 ? (n(), s("span", zn, "+" + k(D.length - 3), 1)) : L("", !0)
-                    ])) : l(Ze)(D) ? (n(), s("div", Un, [
-                      a("div", {
-                        style: je({ backgroundColor: D }),
-                        class: "color-chip single",
-                        title: D
-                      }, null, 12, Wn)
-                    ])) : l(Qa)(D) ? (n(), s("div", Rn, [
-                      (n(!0), s(W, null, q(D.slice(0, 3), (_e, Ce) => (n(), s("div", {
-                        key: Ce,
-                        class: "image-container small"
-                      }, [
-                        a("img", {
-                          src: l(Ee)(_e),
-                          class: "image-preview",
-                          alt: `Preview ${le}-${Ce}`
-                        }, null, 8, Zn)
-                      ]))), 128)),
-                      D.length > 3 ? (n(), s("span", qn, "+" + k(D.length - 3), 1)) : L("", !0)
-                    ])) : Array.isArray(D) ? (n(), s("div", Gn, k(D.join(", ")), 1)) : (n(), s("div", Qn, k(D), 1))
-                  ], 2))), 128)),
-                  a("td", Jn, [
-                    a("div", Xn, [
-                      i.value?.feature?.updateActive ? (n(), s("button", {
-                        key: 0,
-                        onClick: (D) => l(ie)(g?.[i.value?.keys?.idKey ?? "id"]),
-                        class: "action-btn btn-edit"
-                      }, [
-                        u[23] || (u[23] = a("span", { class: "action-icon" }, [
-                          a("svg", {
-                            width: "16",
-                            height: "16",
-                            viewBox: "0 0 24 24",
-                            fill: "none"
-                          }, [
-                            a("path", {
-                              d: "M11 5H6C4.89543 5 4 5.89543 4 7V18C4 19.1046 4.89543 20 6 20H17C18.1046 20 19 19.1046 19 18V13M17.5858 3.58579C18.3668 2.80474 19.6332 2.80474 20.4142 3.58579C21.1953 4.36683 21.1953 5.63316 20.4142 6.41421L11.8284 15H9L9 12.1716L17.5858 3.58579Z",
-                              stroke: "currentColor",
-                              "stroke-width": "2",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round"
-                            })
-                          ])
-                        ], -1)),
-                        a("span", es, k(b.value?.btn?.update), 1)
-                      ], 8, Yn)) : L("", !0),
-                      i.value?.feature?.deleteActive ? (n(), s("button", {
-                        key: 1,
-                        onClick: (D) => l(j)(g?.[i.value?.keys?.idKey ?? "id"]),
-                        class: "action-btn btn-delete"
-                      }, [
-                        u[24] || (u[24] = a("span", { class: "action-icon" }, [
-                          a("svg", {
-                            width: "16",
-                            height: "16",
-                            viewBox: "0 0 24 24",
-                            fill: "none"
-                          }, [
-                            a("path", {
-                              d: "M19 7L18.1327 19.1425C18.0579 20.1891 17.187 21 16.1378 21H7.86224C6.81296 21 5.94208 20.1891 5.86732 19.1425L5 7M10 11V17M14 11V17M15 7V4C15 3.44772 14.5523 3 14 3H10C9.44772 3 9 3.44772 9 4V7M4 7H20",
-                              stroke: "currentColor",
-                              "stroke-width": "2",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round"
-                            })
-                          ])
-                        ], -1)),
-                        a("span", as, k(b.value?.btn?.remove), 1)
-                      ], 8, ts)) : L("", !0),
-                      i.value?.feature?.displayActive ? (n(), s("button", {
-                        key: 2,
-                        onClick: (D) => l(A)(g?.[i.value?.keys?.idKey ?? "id"]),
-                        class: "action-btn btn-view"
-                      }, [
-                        u[25] || (u[25] = a("span", { class: "action-icon" }, [
-                          a("svg", {
-                            width: "16",
-                            height: "16",
-                            viewBox: "0 0 24 24",
-                            fill: "none"
-                          }, [
-                            a("path", {
-                              d: "M1 12C1 12 5 4 12 4C19 4 23 12 23 12C23 12 19 20 12 20C5 20 1 12 1 12Z",
-                              stroke: "currentColor",
-                              "stroke-width": "2"
-                            }),
-                            a("path", {
-                              d: "M12 15C13.6569 15 15 13.6569 15 12C15 10.3431 13.6569 9 12 9C10.3431 9 9 10.3431 9 12C9 13.6569 10.3431 15 12 15Z",
-                              stroke: "currentColor",
-                              "stroke-width": "2"
-                            })
-                          ])
-                        ], -1)),
-                        a("span", ss, k(b.value?.btn?.display), 1)
-                      ], 8, ns)) : L("", !0)
-                    ])
-                  ])
-                ]))), 128))
-              ])
-            ])
-          ]),
-          a("div", is, [
-            a("div", ls, k(i.value?.pagination?.indicator?.displayingText || "Showing") + " " + k((l($) - 1) * (i.value?.pagination?.itemsPerPage ?? 5) + 1) + " - " + k(Math.min(
-              l($) * (i.value?.pagination?.itemsPerPage ?? 5),
-              l(N).length
-            )) + " of " + k(l(N).length) + " " + k(i.value?.pagination?.indicator?.dataText || "") + " data ", 1),
-            a("div", os, [
-              a("button", {
-                onClick: u[12] || (u[12] = //@ts-ignore
-                (...g) => l(se) && l(se)(...g)),
-                disabled: l($) === 1,
-                class: "pagination-btn pagination-prev"
-              }, [
-                u[26] || (u[26] = a("span", { class: "btn-icon" }, [
-                  a("svg", {
-                    width: "16",
-                    height: "16",
-                    viewBox: "0 0 24 24",
-                    fill: "none"
-                  }, [
-                    a("path", {
-                      d: "M15 18L9 12L15 6",
-                      stroke: "currentColor",
-                      "stroke-width": "2",
-                      "stroke-linecap": "round",
-                      "stroke-linejoin": "round"
-                    })
-                  ])
-                ], -1)),
-                oe(" " + k(b.value?.btn?.prev || "Previous"), 1)
-              ], 8, rs),
-              a("div", cs, [
-                (n(!0), s(W, null, q(l(de), (g) => (n(), s("button", {
-                  key: g + "",
-                  onClick: (D) => typeof g == "number" && ($.value = g),
-                  disabled: g === "...",
-                  class: re([{
-                    "page-active": l($) === g,
-                    "page-ellipsis": g === "..."
-                  }, "page-btn"])
-                }, k(g), 11, us))), 128))
-              ]),
-              a("button", {
-                onClick: u[13] || (u[13] = //@ts-ignore
-                (...g) => l(ee) && l(ee)(...g)),
-                disabled: l($) === l(ne) || l(ne) === 0,
-                class: "pagination-btn pagination-next"
-              }, [
-                oe(k(b.value?.btn?.next || "Next") + " ", 1),
-                u[27] || (u[27] = a("span", { class: "btn-icon" }, [
-                  a("svg", {
-                    width: "16",
-                    height: "16",
-                    viewBox: "0 0 24 24",
-                    fill: "none"
-                  }, [
-                    a("path", {
-                      d: "M9 18L15 12L9 6",
-                      stroke: "currentColor",
-                      "stroke-width": "2",
-                      "stroke-linecap": "round",
-                      "stroke-linejoin": "round"
-                    })
-                  ])
-                ], -1))
-              ], 8, ds)
-            ])
-          ])
-        ]))
-      ])
-    ]));
-  }
-}), ps = /* @__PURE__ */ me(vs, [["__scopeId", "data-v-76b9b7a6"]]);
-export {
-  Ua as A,
-  ys as B,
-  xe as F,
-  fs as I,
-  Va as M,
-  ps as T,
-  Pe as W,
-  bs as _,
-  P as a,
-  nn as b,
-  gs as c,
-  an as d,
-  sn as e,
-  ln as f,
-  ks as g,
-  ws as h,
-  Ie as i,
-  ct as j,
-  ut as k,
-  dt as l
-};