@ghentcdh/ui 0.1.1 → 0.2.1

package/index.mjs

@@ -1,6 +1,6 @@
-import { defineComponent as g, createElementBlock as u, openBlock as a, unref as h, normalizeClass as $, createElementVNode as c, createBlock as v, createCommentVNode as M, toDisplayString as f, Fragment as k, renderList as L, mergeProps as B, computed as C, resolveComponent as me, withCtx as D, createTextVNode as S, ref as O, watch as te, onMounted as _e, renderSlot as N, resolveDynamicComponent as oe, createVNode as T, getCurrentInstance as we, toHandlerKey as de, camelize as ke, mergeDefaults as Q, mergeModels as q, useModel as se, normalizeProps as ne, guardReactiveProps as ae, withDirectives as J, vModelSelect as Ce, inject as $e, resolveDirective as be, vModelText as Me } from "vue";
-import { RouterLink as Pe } from "vue-router";
-const P = (...e) => `<svg
+import { defineComponent as g, createElementBlock as u, openBlock as l, unref as h, normalizeClass as w, createElementVNode as c, createBlock as f, createCommentVNode as y, toDisplayString as v, Fragment as k, renderList as x, mergeProps as P, computed as $, resolveComponent as oe, withCtx as T, createTextVNode as U, ref as R, watch as ne, onMounted as ke, renderSlot as z, resolveDynamicComponent as se, createVNode as B, normalizeStyle as J, getCurrentInstance as $e, toHandlerKey as me, camelize as Ce, mergeDefaults as X, mergeModels as E, useModel as le, normalizeProps as ae, guardReactiveProps as re, withDirectives as Q, vModelSelect as Le, inject as Me, resolveDirective as fe, vModelText as xe } from "vue";
+import { RouterLink as Be } from "vue-router";
+const M = (...e) => `<svg
     xmlns="http://www.w3.org/2000/svg"
     fill="none"
     viewBox="0 0 24 24"
@@ -8,72 +8,76 @@ const P = (...e) => `<svg
     stroke="currentColor" >
     ${e.map(
   (o) => ` <path
-     stroke-linejoin="round" 
+     stroke-linejoin="round"
       stroke-linecap="round"
       d="${o}"
     />`
 ).join(`
 `)}
   </svg>`;
-var H = /* @__PURE__ */ ((e) => (e.Edit = "Edit", e.Delete = "Delete", e.BarsArrowDown = "BarsArrowDown", e.BarsArrowUp = "BarsArrowUp", e.Funnel = "Funnel", e.Close = "Close", e.Plus = "Plus", e.PaperClip = "PaperClip", e.Hamburger = "Hamburger", e.ChevronDown = "ChevronDown", e.ChevronUp = "ChevronUp", e.Check = "Check", e.View = "View", e.Text = "Text", e))(H || {});
-const Be = {
-  Edit: P(
+var V = /* @__PURE__ */ ((e) => (e.Edit = "Edit", e.Delete = "Delete", e.BarsArrowDown = "BarsArrowDown", e.BarsArrowUp = "BarsArrowUp", e.Funnel = "Funnel", e.Close = "Close", e.Plus = "Plus", e.PaperClip = "PaperClip", e.Hamburger = "Hamburger", e.ChevronRight = "ChevronRight", e.ChevronLeft = "ChevronLeft", e.ChevronDown = "ChevronDown", e.ChevronUp = "ChevronUp", e.DblChevronLeft = "DblChevronLeft", e.DblChevronRight = "DblChevronRight", e.Check = "Check", e.View = "View", e.Text = "Text", e))(V || {});
+const Pe = {
+  Edit: M(
     "m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10"
   ),
-  Delete: P(
+  Delete: M(
     "m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0"
   ),
-  BarsArrowDown: P(
+  BarsArrowDown: M(
     "M3 4.5h14.25M3 9h9.75M3 13.5h9.75m4.5-4.5v12m0 0-3.75-3.75M17.25 21 21 17.25"
   ),
-  BarsArrowUp: P(
+  BarsArrowUp: M(
     "M3 4.5h14.25M3 9h9.75M3 13.5h5.25m5.25-.75L17.25 9m0 0L21 12.75M17.25 9v12"
   ),
-  Funnel: P(
+  Funnel: M(
     "M12 3c2.755 0 5.455.232 8.083.678.533.09.917.556.917 1.096v1.044a2.25 2.25 0 0 1-.659 1.591l-5.432 5.432a2.25 2.25 0 0 0-.659 1.591v2.927a2.25 2.25 0 0 1-1.244 2.013L9.75 21v-6.568a2.25 2.25 0 0 0-.659-1.591L3.659 7.409A2.25 2.25 0 0 1 3 5.818V4.774c0-.54.384-1.006.917-1.096A48.32 48.32 0 0 1 12 3Z"
   ),
-  Close: P("M6 18 18 6M6 6l12 12"),
-  Plus: P("M12 9v6m3-3H9m12 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"),
-  PaperClip: P(
+  Close: M("M6 18 18 6M6 6l12 12"),
+  Plus: M("M12 9v6m3-3H9m12 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"),
+  PaperClip: M(
     "m18.375 12.739-7.693 7.693a4.5 4.5 0 0 1-6.364-6.364l10.94-10.94A3 3 0 1 1 19.5 7.372L8.552 18.32m.009-.01-.01.01m5.699-9.941-7.81 7.81a1.5 1.5 0 0 0 2.112 2.13"
   ),
-  Hamburger: P("M4 6h16M4 12h16M4 18h16"),
-  ChevronDown: P(
+  Hamburger: M("M4 6h16M4 12h16M4 18h16"),
+  ChevronDown: M(
     "M12.53 16.28a.75.75 0 0 1-1.06 0l-7.5-7.5a.75.75 0 0 1 1.06-1.06L12 14.69l6.97-6.97a.75.75 0 1 1 1.06 1.06l-7.5 7.5Z"
   ),
-  ChevronUp: P(
+  ChevronUp: M(
     "M11.47 7.72a.75.75 0 0 1 1.06 0l7.5 7.5a.75.75 0 1 1-1.06 1.06L12 9.31l-6.97 6.97a.75.75 0 0 1-1.06-1.06l7.5-7.5Z"
   ),
-  Check: P("m4.5 12.75 6 6 9-13.5"),
-  View: P(
+  Check: M("m4.5 12.75 6 6 9-13.5"),
+  View: M(
     "M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z",
     "M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
   ),
-  Text: P(
+  Text: M(
     "M19.5 14.25v-2.625a3.375 3.375 0 0 0-3.375-3.375h-1.5A1.125 1.125 0 0 1 13.5 7.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H8.25m0 12.75h7.5m-7.5 3H12M10.5 2.25H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 0 0-9-9Z"
-  )
-}, Le = ["innerHTML"], E = /* @__PURE__ */ g({
+  ),
+  DblChevronLeft: M(
+    "m18.75 4.5-7.5 7.5 7.5 7.5m-6-15L5.25 12l7.5 7.5"
+  ),
+  DblChevronRight: M("m5.25 4.5 7.5 7.5-7.5 7.5m6-15 7.5 7.5-7.5 7.5")
+}, De = ["innerHTML"], K = /* @__PURE__ */ g({
   __name: "icon",
   props: {
     icon: {},
     size: {}
   },
   setup(e) {
-    return (t, o) => (a(), u("div", {
-      class: $([
+    return (t, o) => (l(), u("div", {
+      class: w([
         {
           "w-full h-full": !t.size,
           "w-2 h-2": t.size === "xs",
           "w-4 h-4": t.size === "sm"
         }
       ]),
-      innerHTML: h(Be)[t.icon]
-    }, null, 10, Le));
+      innerHTML: h(Pe)[t.icon]
+    }, null, 10, De));
   }
-}), Ae = { class: "dropdown dropdown-end" }, xe = {
+}), Ae = { class: "dropdown dropdown-end" }, Te = {
   tabindex: "0",
   class: "menu dropdown-content bg-white z-1 mt-4 p-2 shadow-sm"
-}, De = { class: "min-w-max flex-no-wrap text-black" }, le = /* @__PURE__ */ g({
+}, ze = { class: "min-w-max flex-no-wrap text-black" }, ie = /* @__PURE__ */ g({
   __name: "sub-menu",
   props: {
     label: {},
@@ -84,29 +88,29 @@ const Be = {
     disableArrow: { type: Boolean }
   },
   setup(e) {
-    return (t, o) => (a(), u("div", Ae, [
+    return (t, o) => (l(), u("div", Ae, [
       c("div", {
         tabindex: "0",
         role: "button",
-        class: $([t.btnClass, "btn btn-ghost text-right flex-nowrap flex"])
+        class: w([t.btnClass, "btn btn-ghost text-right flex-nowrap flex"])
       }, [
-        c("span", null, f(t.label), 1),
-        t.disableArrow ? M("", !0) : (a(), v(h(E), {
+        c("span", null, v(t.label), 1),
+        t.disableArrow ? y("", !0) : (l(), f(h(K), {
           key: 0,
-          icon: h(H).ChevronDown,
+          icon: h(V).ChevronDown,
           size: "sm"
         }, null, 8, ["icon"]))
       ], 2),
-      c("ul", xe, [
-        c("li", De, [
-          (a(!0), u(k, null, L(t.items, (n) => (a(), v(fe, B({
-            key: n.label
-          }, { ref_for: !0 }, n), null, 16))), 128))
+      c("ul", Te, [
+        c("li", ze, [
+          (l(!0), u(k, null, x(t.items, (s) => (l(), f(ve, P({
+            key: s.label
+          }, { ref_for: !0 }, s), null, 16))), 128))
         ])
       ])
     ]));
   }
-}), G = "btn btn-ghost text-left justify-between min-w-max font-normal", fe = /* @__PURE__ */ g({
+}), G = "btn btn-ghost text-left justify-between min-w-max font-normal", ve = /* @__PURE__ */ g({
   __name: "menu-item",
   props: {
     label: {},
@@ -115,45 +119,45 @@ const Be = {
     disabled: { type: Boolean, default: !1 }
   },
   setup(e) {
-    const t = e, o = C(() => !t.disabled && t.action && "routerLink" in t.action), n = C(() => !t.disabled && t.action), s = C(() => {
-      var l;
-      return (l = t.items) == null ? void 0 : l.length;
-    }), r = C(() => {
-      const l = t.action;
-      return l && "routerLink" in l && "params" in l ? {
-        name: l.routerLink,
-        params: l.params
+    const t = e, o = $(() => !t.disabled && t.action && "routerLink" in t.action), s = $(() => !t.disabled && t.action), n = $(() => {
+      var r;
+      return (r = t.items) == null ? void 0 : r.length;
+    }), a = $(() => {
+      const r = t.action;
+      return r && "routerLink" in r && "params" in r ? {
+        name: r.routerLink,
+        params: r.params
       } : "";
     }), b = () => {
-      var l;
-      (l = t.action) == null || l.call(t);
+      var r;
+      (r = t.action) == null || r.call(t);
     };
-    return (l, m) => {
-      const p = me("RouterLink");
-      return s.value ? (a(), v(le, B({ key: 0 }, t, { "btn-class": G }), null, 16)) : o.value ? (a(), v(p, {
+    return (r, d) => {
+      const p = oe("RouterLink");
+      return n.value ? (l(), f(ie, P({ key: 0 }, t, { "btn-class": G }), null, 16)) : o.value ? (l(), f(p, {
         key: 1,
-        to: r.value,
-        class: $(G),
+        to: a.value,
+        class: w(G),
         onClick: b
       }, {
-        default: D(() => [
-          S(f(l.label), 1)
+        default: T(() => [
+          U(v(r.label), 1)
         ]),
         _: 1
-      }, 8, ["to"])) : n.value ? (a(), u("button", {
+      }, 8, ["to"])) : s.value ? (l(), u("button", {
         key: 2,
-        class: $(G),
+        class: w(G),
         onClick: b
-      }, f(l.label), 1)) : (a(), u("div", {
+      }, v(r.label), 1)) : (l(), u("div", {
         key: 3,
-        class: $([G, { "btn-disabled": l.disabled }])
-      }, f(l.label), 3));
+        class: w([G, { "btn-disabled": r.disabled }])
+      }, v(r.label), 3));
     };
   }
-}), Te = { class: "navbar bg-base-100 shadow-sm" }, Ve = { class: "flex-1" }, ze = {
+}), Se = { class: "navbar bg-base-100 shadow-sm" }, Ve = { class: "flex-1" }, Ne = {
   key: 0,
   class: "breadcrumbs text-sm"
-}, Se = { class: "flex grow justify-end px-2" }, Ne = { class: "flex items-stretch" }, eo = /* @__PURE__ */ g({
+}, Ue = { class: "flex grow justify-end px-2" }, Re = { class: "flex items-stretch" }, pn = /* @__PURE__ */ g({
   __name: "menu",
   props: {
     menu: {},
@@ -161,47 +165,47 @@ const Be = {
   },
   setup(e) {
     return (t, o) => {
-      const n = me("RouterLink");
-      return a(), u("nav", Te, [
+      const s = oe("RouterLink");
+      return l(), u("nav", Se, [
         c("div", Ve, [
-          t.breadcrumbs ? (a(), u("div", ze, [
+          t.breadcrumbs ? (l(), u("div", Ne, [
             c("ul", null, [
-              (a(!0), u(k, null, L(t.breadcrumbs, (s) => (a(), u("li", {
-                key: s.label
+              (l(!0), u(k, null, x(t.breadcrumbs, (n) => (l(), u("li", {
+                key: n.label
               }, [
-                s.routerLink ? (a(), v(n, {
+                n.routerLink ? (l(), f(s, {
                   key: 0,
-                  to: { name: s.routerLink, params: s.params }
+                  to: { name: n.routerLink, params: n.params }
                 }, {
-                  default: D(() => [
-                    S(f(s.label), 1)
+                  default: T(() => [
+                    U(v(n.label), 1)
                   ]),
                   _: 2
-                }, 1032, ["to"])) : (a(), u(k, { key: 1 }, [
-                  S(f(s.label), 1)
+                }, 1032, ["to"])) : (l(), u(k, { key: 1 }, [
+                  U(v(n.label), 1)
                 ], 64))
               ]))), 128))
             ])
-          ])) : M("", !0)
+          ])) : y("", !0)
         ]),
-        c("div", Se, [
-          c("div", Ne, [
-            (a(!0), u(k, null, L(t.menu, (s) => (a(), v(fe, B({
-              key: s.label
-            }, { ref_for: !0 }, s), null, 16))), 128))
+        c("div", Ue, [
+          c("div", Re, [
+            (l(!0), u(k, null, x(t.menu, (n) => (l(), f(ve, P({
+              key: n.label
+            }, { ref_for: !0 }, n), null, 16))), 128))
           ])
         ])
       ]);
     };
   }
-}), to = /* @__PURE__ */ g({
+}), mn = /* @__PURE__ */ g({
   __name: "dropdown",
   props: {
     items: {}
   },
   setup(e) {
-    const t = O(!0);
-    return (o, n) => (a(), v(le, {
+    const t = R(!0);
+    return (o, s) => (l(), f(ie, {
       items: o.items,
       label: "test",
       open: t.value,
@@ -209,34 +213,34 @@ const Be = {
       "disable-arrow": !0
     }, null, 8, ["items", "open"]));
   }
-}), w = [];
+}), L = [];
 for (let e = 0; e < 256; ++e)
-  w.push((e + 256).toString(16).slice(1));
-function Ue(e, t = 0) {
-  return (w[e[t + 0]] + w[e[t + 1]] + w[e[t + 2]] + w[e[t + 3]] + "-" + w[e[t + 4]] + w[e[t + 5]] + "-" + w[e[t + 6]] + w[e[t + 7]] + "-" + w[e[t + 8]] + w[e[t + 9]] + "-" + w[e[t + 10]] + w[e[t + 11]] + w[e[t + 12]] + w[e[t + 13]] + w[e[t + 14]] + w[e[t + 15]]).toLowerCase();
+  L.push((e + 256).toString(16).slice(1));
+function Fe(e, t = 0) {
+  return (L[e[t + 0]] + L[e[t + 1]] + L[e[t + 2]] + L[e[t + 3]] + "-" + L[e[t + 4]] + L[e[t + 5]] + "-" + L[e[t + 6]] + L[e[t + 7]] + "-" + L[e[t + 8]] + L[e[t + 9]] + "-" + L[e[t + 10]] + L[e[t + 11]] + L[e[t + 12]] + L[e[t + 13]] + L[e[t + 14]] + L[e[t + 15]]).toLowerCase();
 }
-let ee;
-const Fe = new Uint8Array(16);
-function He() {
-  if (!ee) {
+let te;
+const He = new Uint8Array(16);
+function Ke() {
+  if (!te) {
     if (typeof crypto > "u" || !crypto.getRandomValues)
       throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
-    ee = crypto.getRandomValues.bind(crypto);
+    te = crypto.getRandomValues.bind(crypto);
   }
-  return ee(Fe);
+  return te(He);
 }
-const Ke = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), pe = { randomUUID: Ke };
-function X(e, t, o) {
-  var s;
-  if (pe.randomUUID && !e)
-    return pe.randomUUID();
+const je = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), be = { randomUUID: je };
+function Y(e, t, o) {
+  var n;
+  if (be.randomUUID && !e)
+    return be.randomUUID();
   e = e || {};
-  const n = e.random ?? ((s = e.rng) == null ? void 0 : s.call(e)) ?? He();
-  if (n.length < 16)
+  const s = e.random ?? ((n = e.rng) == null ? void 0 : n.call(e)) ?? Ke();
+  if (s.length < 16)
     throw new Error("Random bytes length must be >= 16");
-  return n[6] = n[6] & 15 | 64, n[8] = n[8] & 63 | 128, Ue(n);
+  return s[6] = s[6] & 15 | 64, s[8] = s[8] & 63 | 128, Fe(s);
 }
-const Ie = { class: "font-bold" }, Oe = { class: "pt-4" }, je = { class: "modal-action" }, Re = /* @__PURE__ */ g({
+const Oe = { class: "font-bold" }, Ie = { class: "pt-4" }, qe = { class: "modal-action" }, Ee = /* @__PURE__ */ g({
   __name: "modal",
   props: {
     modalTitle: {},
@@ -249,112 +253,112 @@ const Ie = { class: "font-bold" }, Oe = { class: "pt-4" }, je = { class: "modal-
   },
   emits: ["closeModal"],
   setup(e, { expose: t, emit: o }) {
-    const n = {
+    const s = {
       xs: "max-w-xs w-[50VW]",
       sm: "max-w-sm w-[50VW]",
       lg: "max-w-2xl w-[80VW]",
       xl: "max-w-[80VW] w-[80VW]"
-    }, s = e, r = `modal_${X()}`, b = o, l = () => {
-      const p = document.getElementById(r);
+    }, n = e, a = `modal_${Y()}`, b = o, r = () => {
+      const p = document.getElementById(a);
       p == null || p.showModal();
-    }, m = () => {
-      const p = document.getElementById(r);
+    }, d = () => {
+      const p = document.getElementById(a);
       p == null || p.close(), b("closeModal");
     };
-    return t({ closeModal: m, openModal: l }), te(
-      () => s.open,
-      (p, i, A) => {
-        s.open ? l() : m();
+    return t({ closeModal: d, openModal: r }), ne(
+      () => n.open,
+      (p, i, D) => {
+        n.open ? r() : d();
       }
-    ), _e(() => {
-      s.open && l();
-    }), (p, i) => (a(), u("dialog", {
-      id: r,
+    ), ke(() => {
+      n.open && r();
+    }), (p, i) => (l(), u("dialog", {
+      id: a,
       class: "modal"
     }, [
       c("div", {
-        class: $(["modal-box bg-white", n[p.width]])
+        class: w(["modal-box bg-white", s[p.width]])
       }, [
-        p.disableClose ? M("", !0) : (a(), u("button", {
+        p.disableClose ? y("", !0) : (l(), u("button", {
           key: 0,
           type: "button",
           class: "btn btn-sm btn-circle btn-ghost absolute right-2 top-2",
-          onClick: m
+          onClick: d
         }, " ✕ ")),
-        c("h3", Ie, f(p.modalTitle), 1),
-        c("div", Oe, [
-          N(p.$slots, "content")
+        c("h3", Oe, v(p.modalTitle), 1),
+        c("div", Ie, [
+          z(p.$slots, "content")
         ]),
-        c("div", je, [
-          N(p.$slots, "actions")
+        c("div", qe, [
+          z(p.$slots, "actions")
         ])
       ], 2)
     ]));
   }
 });
-var re = /* @__PURE__ */ ((e) => (e.button = "button", e.submit = "submit", e.reset = "reset", e))(re || {}), he = /* @__PURE__ */ ((e) => (e.a = "a", e.button = "button", e))(he || {}), j = /* @__PURE__ */ ((e) => (e.blank = "blank", e.primary = "primary", e.secondary = "secondary", e.error = "error", e))(j || {});
-const qe = {
+var ue = /* @__PURE__ */ ((e) => (e.button = "button", e.submit = "submit", e.reset = "reset", e))(ue || {}), ge = /* @__PURE__ */ ((e) => (e.a = "a", e.button = "button", e))(ge || {}), I = /* @__PURE__ */ ((e) => (e.blank = "blank", e.primary = "primary", e.secondary = "secondary", e.error = "error", e))(I || {});
+const Ze = {
   blank: "btn-ghost",
   primary: "btn-primary",
   secondary: "btn-soft btn-primary",
   error: "btn-error text-white"
-}, Ee = {
+}, We = {
   blank: "badge-ghost",
   primary: "badge-primary",
   secondary: "badge-soft badge-primary",
   error: "badge-error"
-}, We = {
+}, Ge = {
   xs: "btn-xs",
   sm: "btn-sm",
   lg: "btn-sm",
   xl: "btn"
-}, Ze = {
+}, Je = {
   xs: "badge-xs text-xxs",
   sm: "badge-sm text-xs",
   lg: "badge-sm text-xs",
   xl: "badge text-xs"
-}, R = /* @__PURE__ */ g({
+}, q = /* @__PURE__ */ g({
   __name: "btn",
   props: {
     href: {},
     disabled: { type: Boolean, default: !1 },
-    as: { default: he.button },
+    as: { default: ge.button },
     icon: {},
-    type: { default: re.button },
+    type: { default: ue.button },
     outline: { type: Boolean, default: !1 },
-    color: { default: j.primary },
+    color: { default: I.primary },
     size: { default: "sm" },
     square: { type: Boolean, default: !1 }
   },
   emits: ["click"],
   setup(e, { emit: t }) {
-    const o = e, n = t;
-    return (s, r) => (a(), v(oe(s.as), B({
+    const o = e, s = t;
+    return (n, a) => (l(), f(se(n.as), P({
       class: [
         "btn  p-1 flex justify-center flex-nowrap",
-        h(qe)[s.color],
-        h(We)[s.size],
-        { "btn-outline": s.outline, "btn-square": s.square }
+        h(Ze)[n.color],
+        h(Ge)[n.size],
+        { "btn-outline": n.outline, "btn-square": n.square }
       ]
     }, o, {
-      onClick: r[0] || (r[0] = (b) => n("click"))
+      onClick: a[0] || (a[0] = (b) => s("click"))
     }), {
-      default: D(() => [
-        s.icon ? (a(), v(h(E), {
+      default: T(() => [
+        n.icon ? (l(), f(h(K), {
           key: 0,
-          icon: s.icon,
-          size: s.size
-        }, null, 8, ["icon", "size"])) : M("", !0),
-        N(s.$slots, "default")
+          icon: n.icon,
+          size: n.size
+        }, null, 8, ["icon", "size"])) : y("", !0),
+        z(n.$slots, "default")
       ]),
       _: 3
     }, 16, ["class"]));
   }
-}), Ge = ["type", "disabled"], oo = /* @__PURE__ */ g({
+}), Qe = ["type", "disabled"], bn = /* @__PURE__ */ g({
   __name: "btn-badge",
   props: {
     icon: { default: void 0 },
-    type: { default: re.button },
+    type: { default: ue.button },
     color: { default: void 0 },
     disabled: { type: Boolean, default: !1 },
     size: { default: "sm" }
@@ -362,21 +366,21 @@ const qe = {
   emits: ["click"],
   setup(e, { emit: t }) {
     const o = t;
-    return (n, s) => (a(), u("button", {
-      class: $(["badge gap-1", h(Ze)[n.size], h(Ee)[n.color]]),
-      type: n.type,
-      disabled: n.disabled,
-      onClick: s[0] || (s[0] = (r) => o("click"))
+    return (s, n) => (l(), u("button", {
+      class: w(["badge gap-1", h(Je)[s.size], h(We)[s.color]]),
+      type: s.type,
+      disabled: s.disabled,
+      onClick: n[0] || (n[0] = (a) => o("click"))
     }, [
-      N(n.$slots, "default"),
-      n.icon ? (a(), v(h(E), {
+      z(s.$slots, "default"),
+      s.icon ? (l(), f(h(K), {
         key: 0,
-        icon: n.icon,
-        size: n.size
-      }, null, 8, ["icon", "size"])) : M("", !0)
-    ], 10, Ge));
+        icon: s.icon,
+        size: s.size
+      }, null, 8, ["icon", "size"])) : y("", !0)
+    ], 10, Qe));
   }
-}), Je = /* @__PURE__ */ g({
+}), Xe = /* @__PURE__ */ g({
   __name: "confirmModal",
   props: {
     title: {},
@@ -386,33 +390,33 @@ const qe = {
   },
   emits: ["closeModal"],
   setup(e, { emit: t }) {
-    const o = t, n = (s) => {
-      o("closeModal", { confirmed: s });
+    const o = t, s = (n) => {
+      o("closeModal", { confirmed: n });
     };
-    return (s, r) => (a(), v(Re, {
-      "modal-title": s.title,
+    return (n, a) => (l(), f(Ee, {
+      "modal-title": n.title,
       open: !0,
       "disable-close": !0
     }, {
-      content: D(() => [
-        S(f(s.message), 1)
+      content: T(() => [
+        U(v(n.message), 1)
       ]),
-      actions: D(() => [
-        T(h(R), {
-          color: h(j).secondary,
+      actions: T(() => [
+        B(h(q), {
+          color: h(I).secondary,
           outline: !0,
-          onClick: r[0] || (r[0] = (b) => n(!1))
+          onClick: a[0] || (a[0] = (b) => s(!1))
         }, {
-          default: D(() => [
-            S(f(s.cancelLabel), 1)
+          default: T(() => [
+            U(v(n.cancelLabel), 1)
           ]),
           _: 1
         }, 8, ["color"]),
-        T(h(R), {
-          onClick: r[1] || (r[1] = (b) => n(!0))
+        B(h(q), {
+          onClick: a[1] || (a[1] = (b) => s(!0))
         }, {
-          default: D(() => [
-            S(f(s.confirmLabel), 1)
+          default: T(() => [
+            U(v(n.confirmLabel), 1)
           ]),
           _: 1
         })
@@ -421,22 +425,22 @@ const qe = {
     }, 8, ["modal-title"]));
   }
 });
-class ie {
+class ce {
   constructor() {
-    this.showModal = O(!1), this.modals = [];
+    this.showModal = R(!1), this.modals = [];
   }
   openModal(t) {
-    const o = t.props.onClose, n = X(), s = t;
-    t.props.onClose = (r) => {
-      o(r), this.closeModal(n);
-    }, s.id = n, this.modals = [...this.modals, s], this.showModal.value = Date.now();
+    const o = t.props.onClose, s = Y(), n = t;
+    t.props.onClose = (a) => {
+      o(a), this.closeModal(s);
+    }, n.id = s, this.modals = [...this.modals, n], this.showModal.value = Date.now();
   }
   closeModal(t) {
     this.modals = this.modals.filter((o) => o.id !== t), this.showModal.value = Date.now();
   }
   static showConfirm(t) {
     this.getInstance().openModal({
-      component: Je,
+      component: Xe,
       props: t
     });
   }
@@ -444,7 +448,7 @@ class ie {
     this.getInstance().openModal(t);
   }
   static getInstance() {
-    return this.instance || (this.instance = new ie()), this.instance;
+    return this.instance || (this.instance = new ce()), this.instance;
   }
   static closeAll() {
     this.instance.closeAll();
@@ -453,22 +457,22 @@ class ie {
     this.modals = [], this.showModal.value = !1;
   }
 }
-const Qe = /* @__PURE__ */ g({
+const Ye = /* @__PURE__ */ g({
   __name: "modalWrapper",
   setup(e) {
-    const t = ie.getInstance(), o = C(() => t.showModal.value ? t.modals : []);
-    return (n, s) => (a(!0), u(k, null, L(o.value, (r) => {
+    const t = ce.getInstance(), o = $(() => t.showModal.value ? t.modals : []);
+    return (s, n) => (l(!0), u(k, null, x(o.value, (a) => {
       var b;
-      return a(), v(oe(r == null ? void 0 : r.component), B({
-        key: r.id,
+      return l(), f(se(a == null ? void 0 : a.component), P({
+        key: a.id,
         ref_for: !0
-      }, r == null ? void 0 : r.props, {
+      }, a == null ? void 0 : a.props, {
         open: !0,
-        onCloseModal: (b = r == null ? void 0 : r.props) == null ? void 0 : b.onClose
+        onCloseModal: (b = a == null ? void 0 : a.props) == null ? void 0 : b.onClose
       }), null, 16, ["onCloseModal"]);
     }), 128));
   }
-}), Xe = /* @__PURE__ */ g({
+}), et = /* @__PURE__ */ g({
   __name: "notification-message",
   props: {
     message: {},
@@ -481,24 +485,24 @@ const Qe = /* @__PURE__ */ g({
       warning: "alert-warning",
       info: "alert-info"
     };
-    return (o, n) => (a(), u("div", {
+    return (o, s) => (l(), u("div", {
       role: "alert",
-      class: $(`alert ${t[o.type]} `)
+      class: w(`alert ${t[o.type]} `)
     }, [
-      c("span", null, f(o.message), 1)
+      c("span", null, v(o.message), 1)
     ], 2));
   }
-}), Ye = 5e3;
-class ce {
+}), tt = 5e3;
+class de {
   constructor() {
-    this.notifications = O([]), this.addNotification = (t, o = "info") => {
-      const n = {
-        id: X(),
-        duration: Ye,
+    this.notifications = R([]), this.addNotification = (t, o = "info") => {
+      const s = {
+        id: Y(),
+        duration: tt,
         message: t,
         type: o
       };
-      this.notifications.value.push(n), this.removeNotificationAfterDuration(n);
+      this.notifications.value.push(s), this.removeNotificationAfterDuration(s);
     }, this.removeNotificationAfterDuration = (t) => {
       setTimeout(() => {
         this.removeNotification(t.id);
@@ -508,7 +512,7 @@ class ce {
     };
   }
   static getInstance() {
-    return this.instance || (this.instance = new ce()), this.instance;
+    return this.instance || (this.instance = new de()), this.instance;
   }
   static info(t) {
     this.getInstance().addNotification(t, "info");
@@ -526,56 +530,54 @@ class ce {
     this.getInstance().removeNotification(t);
   }
 }
-const et = { class: "toast toast-top toast-center z-[999]" }, tt = /* @__PURE__ */ g({
+const nt = { class: "toast toast-top toast-center z-[999]" }, ot = /* @__PURE__ */ g({
   __name: "notifications",
   setup(e) {
-    const t = ce.getInstance();
-    return (o, n) => (a(), u("div", et, [
-      (a(!0), u(k, null, L(h(t).notifications.value, (s) => (a(), v(Xe, B({
-        key: s.id
-      }, { ref_for: !0 }, s), null, 16))), 128))
+    const t = de.getInstance();
+    return (o, s) => (l(), u("div", nt, [
+      (l(!0), u(k, null, x(h(t).notifications.value, (n) => (l(), f(et, P({
+        key: n.id
+      }, { ref_for: !0 }, n), null, 16))), 128))
     ]));
   }
-}), ot = { class: "drawer" }, st = { class: "drawer-content flex flex-col h-[100VH]" }, nt = { class: "navbar bg-primary text-primary-content w-full z-100" }, at = { class: "navbar-start" }, lt = {
-  for: "my-drawer-3",
-  "aria-label": "open sidebar",
-  class: "btn btn-square btn-ghost p-1"
-}, rt = { class: "navbar-center" }, it = ["href"], ct = { class: "navbar-end" }, ut = { class: "p-2 bg-white mb-1 mr-1 flex-1 shadow-sm" }, dt = { class: "drawer-side no-overflow" }, pt = { class: "menu min-h-full h-full flex-col space-between m-0 !p-0 !pt-16" }, mt = { class: "flex-grow-1 w-52 bg-base-200 p-4" }, bt = { class: "bg-base-200 p-4" }, so = /* @__PURE__ */ g({
+}), st = { class: "h-screen" }, lt = { class: "navbar bg-primary text-primary-content w-full z-100 sticky" }, at = { class: "navbar-start" }, rt = { class: "navbar-center" }, it = ["href"], ut = { class: "navbar-end" }, ct = { class: "menu h-full flex-col space-between m-0 overflow-y-auto" }, dt = { class: "flex-grow-1" }, pt = { class: "bg-base-200 p-4" }, mt = { class: "h-full" }, he = 64, hn = /* @__PURE__ */ g({
   __name: "shell.component",
   props: {
     title: {},
     menu: {},
     user: {},
-    version: {}
+    version: {},
+    widthSidebar: { default: 300 }
   },
   emits: ["logout"],
   setup(e, { emit: t }) {
-    const n = e, s = t, r = C(() => n.user ? {
-      label: n.user.name,
+    const s = e, n = R(!1), a = () => {
+      n.value = !n.value;
+    }, b = t, r = $(() => s.user ? {
+      label: s.user.name,
       items: [
         {
           label: "Logout",
           action: () => {
-            s("logout");
+            b("logout");
           }
         }
       ]
     } : null);
-    return (b, l) => (a(), u(k, null, [
-      T(tt),
-      T(h(Qe)),
-      c("div", ot, [
-        l[1] || (l[1] = c("input", {
-          id: "my-drawer-3",
-          type: "checkbox",
-          class: "drawer-toggle"
-        }, null, -1)),
-        c("div", st, [
-          c("nav", nt, [
+    return (d, p) => (l(), u(k, null, [
+      B(ot),
+      B(h(Ye)),
+      c("div", st, [
+        c("header", null, [
+          c("nav", lt, [
             c("div", at, [
-              c("label", lt, [
-                T(h(E), {
-                  icon: h(H).Hamburger
+              c("button", {
+                "aria-label": "open sidebar",
+                class: "btn btn-square btn-ghost p-1",
+                onClick: a
+              }, [
+                B(h(K), {
+                  icon: h(V).Hamburger
                 }, null, 8, ["icon"])
               ])
             ]),
@@ -583,44 +585,57 @@ const et = { class: "toast toast-top toast-center z-[999]" }, tt = /* @__PURE__
               c("a", {
                 class: "btn btn-ghost text-xl",
                 href: h("/")
-              }, f(b.title), 9, it)
+              }, v(d.title), 9, it)
             ]),
-            c("div", ct, [
-              r.value ? (a(), v(h(le), B({ key: 0 }, r.value, { "btn-class": "" }), null, 16)) : M("", !0)
+            c("div", ut, [
+              r.value ? (l(), f(h(ie), P({ key: 0 }, r.value, { "btn-class": "" }), null, 16)) : y("", !0)
             ])
-          ]),
-          c("div", ut, [
-            N(b.$slots, "default")
           ])
         ]),
-        c("div", dt, [
-          l[0] || (l[0] = c("label", {
-            for: "my-drawer-3",
-            "aria-label": "close sidebar",
-            class: "drawer-overlay"
-          }, null, -1)),
-          c("div", pt, [
-            c("ul", mt, [
-              (a(!0), u(k, null, L(b.menu, (m) => (a(), u("li", {
-                key: m.label
+        n.value ? (l(), u("aside", {
+          key: 0,
+          id: "drawer-left",
+          class: "fixed overflow-y-auto z-[1000] min-h-0 min-w-0 relative flex-shrink-0 bg-white shadow-lg transition-all duration-300 ease-in-out border-l border-gray-200 overflow-visible inset-0",
+          style: J({
+            width: d.widthSidebar + "px",
+            top: `${he}px`
+          })
+        }, [
+          c("div", ct, [
+            c("ul", dt, [
+              (l(!0), u(k, null, x(d.menu, (i) => (l(), u("li", {
+                key: i.label
               }, [
-                T(h(Pe), {
-                  to: { name: m.routerLink, params: m.params }
+                B(h(Be), {
+                  to: { name: i.routerLink, params: i.params }
                 }, {
-                  default: D(() => [
-                    S(f(m.label), 1)
+                  default: T(() => [
+                    U(v(i.label), 1)
                   ]),
                   _: 2
                 }, 1032, ["to"])
               ]))), 128))
             ]),
-            c("div", bt, " version: " + f(b.version), 1)
+            c("div", pt, " version: " + v(d.version), 1)
           ])
-        ])
+        ], 4)) : y("", !0),
+        c("main", {
+          class: w("overflow-hidden fixed border-red  bg-white p-4 mx-auto max-h-full  shadow-sm "),
+          style: J({
+            top: `${he}px`,
+            bottom: "2px",
+            right: "2px",
+            left: n.value ? d.widthSidebar + "px" : 0
+          })
+        }, [
+          c("div", mt, [
+            z(d.$slots, "default")
+          ])
+        ], 4)
       ])
     ], 64));
   }
-}), W = /* @__PURE__ */ g({
+}), Z = /* @__PURE__ */ g({
   __name: "pagination-button.component",
   props: {
     currentPage: {},
@@ -631,25 +646,25 @@ const et = { class: "toast toast-top toast-center z-[999]" }, tt = /* @__PURE__
   },
   emits: ["updatePage", "updatePageSize"],
   setup(e, { emit: t }) {
-    const o = e, n = t, s = C(
+    const o = e, s = t, n = $(
       () => o.neverActive ? !1 : o.page === o.currentPage
-    ), r = C(() => o.neverActive ? j.blank : s.value ? j.primary : j.secondary), b = () => {
-      n("updatePage", o.page);
+    ), a = $(() => o.neverActive ? I.blank : n.value ? I.primary : I.secondary), b = () => {
+      s("updatePage", o.page);
     };
-    return (l, m) => (a(), v(h(R), {
-      disabled: l.disabled,
+    return (r, d) => (l(), f(h(q), {
+      disabled: r.disabled,
       square: !0,
       size: "xs",
-      color: r.value,
-      onClick: m[0] || (m[0] = (p) => b())
+      color: a.value,
+      onClick: d[0] || (d[0] = (p) => b())
     }, {
-      default: D(() => [
-        S(f(l.label), 1)
+      default: T(() => [
+        U(v(r.label), 1)
       ]),
       _: 1
     }, 8, ["disabled", "color"]));
   }
-}), ft = { class: "flex gap-2" }, ht = { class: "flex flex-1 justify-center items-center" }, vt = { class: "flex gap-1" }, gt = { class: "text-sm" }, Z = 6, yt = /* @__PURE__ */ g({
+}), bt = { class: "flex gap-2" }, ht = { class: "flex flex-1 justify-center items-center" }, ft = { class: "flex gap-1" }, vt = { class: "text-sm" }, W = 6, gt = /* @__PURE__ */ g({
   __name: "pagination.component",
   props: {
     totalItems: { type: Number, default: 0 },
@@ -658,48 +673,48 @@ const et = { class: "toast toast-top toast-center z-[999]" }, tt = /* @__PURE__
   },
   emits: ["updatePage", "updatePageSize"],
   setup(e, { emit: t }) {
-    const o = e, n = t, s = C(() => {
+    const o = e, s = t, n = $(() => {
       let i = Math.ceil(o.totalItems / o.itemsPerPage);
       return i < 1 ? 1 : i;
-    }), r = Z / 2, b = C(() => {
-      if (s.value <= Z)
+    }), a = W / 2, b = $(() => {
+      if (n.value <= W)
         return {
           min: 1,
-          max: s.value
+          max: n.value
         };
-      let i = o.currentPage - r;
-      i <= 1 ? i = 1 : i + Z > s.value && (i = s.value - Z);
-      let A = i + Z;
+      let i = o.currentPage - a;
+      i <= 1 ? i = 1 : i + W > n.value && (i = n.value - W);
+      let D = i + W;
       return {
         min: i,
-        max: A
+        max: D
       };
-    }), l = (i) => ({
+    }), r = (i) => ({
       label: "...",
       currentPage: i,
       page: -10,
       disabled: !0,
       neverActive: !0
-    }), m = C(() => {
-      let i = s.value;
+    }), d = $(() => {
+      let i = n.value;
       i < 1 && (i = 1);
-      const A = o.currentPage, V = [], { min: U, max: K } = b.value;
-      return Array.from({ length: i }, (y, z) => {
-        const d = z + 1;
-        d !== 1 && d !== i && (d > K || d < U) || (d === i && i > 1 && K < i && V.push(l(A)), V.push({
-          label: `${d}`,
+      const D = o.currentPage, S = [], { min: F, max: j } = b.value;
+      return Array.from({ length: i }, (_, N) => {
+        const m = N + 1;
+        m !== 1 && m !== i && (m > j || m < F) || (m === i && i > 1 && j < i && S.push(r(D)), S.push({
+          label: `${m}`,
           totalPages: i,
-          currentPage: A,
-          page: d
-        }), d === 1 && i > 1 && U > 1 && V.push(l(A)));
-      }), V;
+          currentPage: D,
+          page: m
+        }), m === 1 && i > 1 && F > 1 && S.push(r(D)));
+      }), S;
     }), p = (i) => {
-      n("updatePage", i);
+      s("updatePage", i);
     };
-    return (i, A) => (a(), u("div", ft, [
+    return (i, D) => (l(), u("div", bt, [
       c("div", ht, [
-        c("div", vt, [
-          T(W, B(o, {
+        c("div", ft, [
+          B(Z, P(o, {
             page: 1,
             label: "<<",
             "current-page": e.currentPage,
@@ -707,7 +722,7 @@ const et = { class: "toast toast-top toast-center z-[999]" }, tt = /* @__PURE__
             disabled: e.currentPage === 1,
             onUpdatePage: p
           }), null, 16, ["current-page", "disabled"]),
-          T(W, B(o, {
+          B(Z, P(o, {
             page: e.currentPage - 1,
             label: "<",
             "current-page": e.currentPage,
@@ -715,37 +730,37 @@ const et = { class: "toast toast-top toast-center z-[999]" }, tt = /* @__PURE__
             disabled: e.currentPage === 1,
             onUpdatePage: p
           }), null, 16, ["page", "current-page", "disabled"]),
-          (a(!0), u(k, null, L(m.value, (V) => (a(), v(W, B({
-            key: V.page,
+          (l(!0), u(k, null, x(d.value, (S) => (l(), f(Z, P({
+            key: S.page,
             ref_for: !0
-          }, V, { onUpdatePage: p }), null, 16))), 128)),
-          T(W, B(o, {
+          }, S, { onUpdatePage: p }), null, 16))), 128)),
+          B(Z, P(o, {
             page: e.currentPage + 1,
             label: ">",
             "current-page": e.currentPage,
             "never-active": !0,
-            disabled: o.currentPage === s.value,
+            disabled: o.currentPage === n.value,
             onUpdatePage: p
           }), null, 16, ["page", "current-page", "disabled"]),
-          T(W, B(o, {
-            page: s.value,
+          B(Z, P(o, {
+            page: n.value,
             label: ">>",
             "current-page": e.currentPage,
             "never-active": !0,
-            disabled: o.currentPage === s.value,
+            disabled: o.currentPage === n.value,
             onUpdatePage: p
           }), null, 16, ["page", "current-page", "disabled"])
         ])
       ]),
-      c("div", gt, " page " + f(e.currentPage) + " of " + f(s.value), 1)
+      c("div", vt, " page " + v(e.currentPage) + " of " + v(n.value), 1)
     ]));
   }
-}), ve = (e, t) => {
+}), ye = (e, t) => {
   const o = e.__vccOpts || e;
-  for (const [n, s] of t)
-    o[n] = s;
+  for (const [s, n] of t)
+    o[s] = n;
   return o;
-}, _t = () => ({
+}, yt = () => ({
   data: {
     type: Object,
     required: !0
@@ -758,10 +773,10 @@ const et = { class: "toast toast-top toast-center z-[999]" }, tt = /* @__PURE__
     type: Object,
     required: !1
   }
-}), wt = g({
+}), _t = g({
   name: "TextCell",
   props: {
-    ..._t()
+    ...yt()
   },
   computed: {
     value() {
@@ -770,11 +785,11 @@ const et = { class: "toast toast-top toast-center z-[999]" }, tt = /* @__PURE__
       return e ? ((t = this.column.options) == null ? void 0 : t.format) === "keyValue" ? e[this.column.options.key] : e : null;
     }
   }
-}), kt = wt;
-function Ct(e, t, o, n, s, r) {
-  return f(e.value);
+}), wt = _t;
+function kt(e, t, o, s, n, a) {
+  return v(e.value);
 }
-const no = /* @__PURE__ */ ve(kt, [["render", Ct]]), $t = { class: "flex-grow pr-2" }, Mt = { class: "h-4 w-4" }, Pt = /* @__PURE__ */ g({
+const fn = /* @__PURE__ */ ye(wt, [["render", kt]]), $t = { class: "flex-grow pr-2" }, Ct = { class: "h-4 w-4" }, Lt = /* @__PURE__ */ g({
   __name: "sort.header",
   props: {
     column: {},
@@ -783,28 +798,28 @@ const no = /* @__PURE__ */ ve(kt, [["render", Ct]]), $t = { class: "flex-grow pr
   },
   emits: ["sort"],
   setup(e, { emit: t }) {
-    const o = e, n = C(
-      () => o.sortDirection === "asc" ? H.BarsArrowUp : H.BarsArrowDown
-    ), s = C(() => {
-      var l;
-      return ((l = o.column.options) == null ? void 0 : l.sortId) ?? o.column.id;
-    }), r = () => {
-      b("sort", s.value);
+    const o = e, s = $(
+      () => o.sortDirection === "asc" ? V.BarsArrowUp : V.BarsArrowDown
+    ), n = $(() => {
+      var r;
+      return ((r = o.column.options) == null ? void 0 : r.sortId) ?? o.column.id;
+    }), a = () => {
+      b("sort", n.value);
     }, b = t;
-    return (l, m) => (a(), u("button", {
+    return (r, d) => (l(), u("button", {
       class: "flex items-center",
-      onClick: r
+      onClick: a
     }, [
-      c("span", $t, f(l.column.label), 1),
-      c("div", Mt, [
-        l.sortColumn === s.value ? (a(), v(h(E), {
+      c("span", $t, v(r.column.label), 1),
+      c("div", Ct, [
+        r.sortColumn === n.value ? (l(), f(h(K), {
           key: 0,
-          icon: n.value
-        }, null, 8, ["icon"])) : M("", !0)
+          icon: s.value
+        }, null, 8, ["icon"])) : y("", !0)
       ])
     ]));
   }
-}), Bt = { class: "table w-full" }, Lt = { key: 0 }, At = ["colspan"], xt = { class: "flex gap-2" }, ao = /* @__PURE__ */ g({
+}), Mt = { class: "table w-full" }, xt = { key: 0 }, Bt = ["colspan"], Pt = { class: "flex gap-2" }, vn = /* @__PURE__ */ g({
   __name: "table.component",
   props: {
     loading: { type: Boolean },
@@ -816,117 +831,117 @@ const no = /* @__PURE__ */ ve(kt, [["render", Ct]]), $t = { class: "flex-grow pr
   },
   emits: ["delete", "edit", "updatePage", "sort"],
   setup(e, { emit: t }) {
-    const o = t, n = (l) => {
-      o("edit", l);
-    }, s = (l) => {
-      o("delete", l);
-    }, r = (l) => {
-      o("updatePage", l);
-    }, b = (l) => {
-      o("sort", l);
+    const o = t, s = (r) => {
+      o("edit", r);
+    }, n = (r) => {
+      o("delete", r);
+    }, a = (r) => {
+      o("updatePage", r);
+    }, b = (r) => {
+      o("sort", r);
     };
-    return (l, m) => (a(), u(k, null, [
-      c("table", Bt, [
+    return (r, d) => (l(), u(k, null, [
+      c("table", Mt, [
         c("thead", null, [
           c("tr", null, [
-            (a(!0), u(k, null, L(l.displayColumns, (p) => (a(), u("th", {
+            (l(!0), u(k, null, x(r.displayColumns, (p) => (l(), u("th", {
               key: p.scope
             }, [
-              T(Pt, B({ column: p }, { ref_for: !0 }, l.sort, { onSort: b }), null, 16, ["column"])
+              B(Lt, P({ column: p }, { ref_for: !0 }, r.sort, { onSort: b }), null, 16, ["column"])
             ]))), 128)),
-            m[0] || (m[0] = c("th", null, null, -1))
+            d[0] || (d[0] = c("th", null, null, -1))
           ])
         ]),
         c("tbody", null, [
-          l.loading ? (a(), u("tr", Lt, [
+          r.loading ? (l(), u("tr", xt, [
             c("td", {
-              colspan: l.displayColumns.length + 1,
+              colspan: r.displayColumns.length + 1,
               class: "text-center"
-            }, m[1] || (m[1] = [
+            }, d[1] || (d[1] = [
               c("span", { class: "loading loading-bars loading-xs" }, null, -1)
-            ]), 8, At)
-          ])) : M("", !0),
-          (a(!0), u(k, null, L(l.data, (p) => (a(), u("tr", {
+            ]), 8, Bt)
+          ])) : y("", !0),
+          (l(!0), u(k, null, x(r.data, (p) => (l(), u("tr", {
             key: p.id
           }, [
-            (a(!0), u(k, null, L(l.displayColumns, (i) => (a(), u("td", {
+            (l(!0), u(k, null, x(r.displayColumns, (i) => (l(), u("td", {
               key: i.scope
             }, [
-              (a(), v(oe(i.component), B({ ref_for: !0 }, i, {
+              (l(), f(se(i.component), P({ ref_for: !0 }, i, {
                 data: p,
                 column: i
               }), null, 16, ["data", "column"]))
             ]))), 128)),
             c("td", null, [
-              c("span", xt, [
-                (a(!0), u(k, null, L(l.actions, (i) => (a(), v(R, {
+              c("span", Pt, [
+                (l(!0), u(k, null, x(r.actions, (i) => (l(), f(q, {
                   key: i.label,
                   icon: i.icon,
                   outline: !0,
-                  onClick: (A) => i.action(p)
+                  onClick: (D) => i.action(p)
                 }, {
-                  default: D(() => [
-                    S(f(i.label), 1)
+                  default: T(() => [
+                    U(v(i.label), 1)
                   ]),
                   _: 2
                 }, 1032, ["icon", "onClick"]))), 128)),
-                T(R, {
-                  icon: h(H).Edit,
+                B(q, {
+                  icon: h(V).Edit,
                   outline: !0,
-                  onClick: (i) => n(p)
+                  onClick: (i) => s(p)
                 }, null, 8, ["icon", "onClick"]),
-                T(R, {
-                  icon: h(H).Delete,
+                B(q, {
+                  icon: h(V).Delete,
                   outline: !0,
-                  onClick: (i) => s(p)
+                  onClick: (i) => n(p)
                 }, null, 8, ["icon", "onClick"])
               ])
             ])
           ]))), 128))
         ])
       ]),
-      l.page ? (a(), v(yt, {
+      r.page ? (l(), f(gt, {
         key: 0,
         class: "border-gray-300 border-t pt-4 border-x-0 border-b-0",
-        "total-items": l.page.count,
-        "items-per-page": l.page.pageSize,
-        "current-page": l.page.page,
-        onUpdatePage: r
-      }, null, 8, ["total-items", "items-per-page", "current-page"])) : M("", !0)
+        "total-items": r.page.count,
+        "items-per-page": r.page.pageSize,
+        "current-page": r.page.page,
+        onUpdatePage: a
+      }, null, 8, ["total-items", "items-per-page", "current-page"])) : y("", !0)
     ], 64));
   }
-}), Dt = {}, Tt = { class: "card bg-base-100 shadow-sm" }, Vt = { class: "card-body" }, zt = {
+}), Dt = {}, At = { class: "card bg-base-100 shadow-sm" }, Tt = { class: "card-body" }, zt = {
   key: 0,
   class: "card-title"
 }, St = {
   key: 1,
   class: "card-actions justify-end"
 };
-function Nt(e, t) {
-  return a(), u("div", Tt, [
-    c("div", Vt, [
-      e.$slots.title ? (a(), u("h2", zt, [
-        N(e.$slots, "title")
-      ])) : M("", !0),
+function Vt(e, t) {
+  return l(), u("div", At, [
+    c("div", Tt, [
+      e.$slots.title ? (l(), u("h2", zt, [
+        z(e.$slots, "title")
+      ])) : y("", !0),
       c("p", null, [
-        N(e.$slots, "default"),
-        N(e.$slots, "content")
+        z(e.$slots, "default"),
+        z(e.$slots, "content")
       ]),
-      e.$slots.actions ? (a(), u("div", St, [
-        N(e.$slots, "actions")
-      ])) : M("", !0)
+      e.$slots.actions ? (l(), u("div", St, [
+        z(e.$slots, "actions")
+      ])) : y("", !0)
     ])
   ]);
 }
-const lo = /* @__PURE__ */ ve(Dt, [["render", Nt]]), ro = (e, t) => {
+const gn = /* @__PURE__ */ ye(Dt, [["render", Vt]]), yn = (e, t) => {
   if (!e) return null;
-  const o = (n) => {
-    e.contains(n.target) || t();
+  const o = (s) => {
+    e.contains(s.target) || t();
   };
   return document.addEventListener("click", o), o;
-}, io = (e) => {
+}, _n = (e) => {
   document.removeEventListener("click", e);
-}, co = {
+}, wn = {
   beforeMount(e, t) {
     e.clickOutsideEvent = function(o) {
       e === o.target || e.contains(o.target) || t.value(o);
@@ -936,15 +951,15 @@ const lo = /* @__PURE__ */ ve(Dt, [["render", Nt]]), ro = (e, t) => {
     document.removeEventListener("click", e.clickOutsideEvent);
   }
 };
-function uo(e) {
-  const t = we();
+function kn(e) {
+  const t = $e();
   if (!t)
     return !1;
   const o = t.vnode.props;
-  return o ? !!(o[de(e)] || // also try camelCase event handler (#2249)
-  o[de(ke(e))]) : !1;
+  return o ? !!(o[me(e)] || // also try camelCase event handler (#2249)
+  o[me(Ce(e))]) : !1;
 }
-const Ut = {
+const Nt = {
   group: {
     root: "group",
     label: "text-primary text-lg font-bold",
@@ -975,23 +990,23 @@ const Ut = {
     root: "flex flex-row gap-x-2",
     item: "w-full"
   }
-}, Y = () => ({
-  id: X(),
+}, ee = () => ({
+  id: Y(),
   visible: !0,
   required: !1,
   enabled: !0,
   isFocused: !1,
   isTouched: !1,
   hideLabel: !1,
-  styles: Ut
-}), Ft = () => ({
-  ...Y(),
+  styles: Nt
+}), Ut = () => ({
+  ...ee(),
   options: [],
   valueKey: "value",
   labelKey: "label"
-}), Ht = (e, t, o) => !!(e && o), Kt = (e, t, o, n) => t === void 0 || t !== void 0 && !e || !n && !o, It = { key: 0 }, ue = /* @__PURE__ */ g({
+}), Rt = (e, t, o) => !!(e && o), Ft = (e, t, o, s) => t === void 0 || t !== void 0 && !e || !s && !o, Ht = { key: 0 }, pe = /* @__PURE__ */ g({
   __name: "ControlWrapper",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ X({
     id: {},
     description: {},
     errors: {},
@@ -1003,37 +1018,37 @@ const Ut = {
     isTouched: { type: Boolean },
     hideLabel: { type: Boolean },
     styles: {}
-  }, Y()),
+  }, ee()),
   setup(e) {
-    const t = e, o = C(() => !Kt(
+    const t = e, o = $(() => !Ft(
       t.visible,
       t.description,
       t.isFocused,
       !0
-    )), n = C(() => t.required), s = C(() => Ht(
+    )), s = $(() => t.required), n = $(() => Rt(
       t.isTouched,
       t.isFocused,
       t.errors
     ));
-    return (r, b) => (a(), u("fieldset", {
-      class: $(r.styles.control.wrapper)
+    return (a, b) => (l(), u("fieldset", {
+      class: w(a.styles.control.wrapper)
     }, [
-      r.hideLabel ? M("", !0) : (a(), u("legend", {
+      a.hideLabel ? y("", !0) : (l(), u("legend", {
         key: 0,
-        class: $(r.styles.control.label)
+        class: w(a.styles.control.label)
       }, [
-        S(f(r.label) + " ", 1),
-        n.value ? (a(), u("span", It, "*")) : M("", !0)
+        U(v(a.label) + " ", 1),
+        s.value ? (l(), u("span", Ht, "*")) : y("", !0)
       ], 2)),
-      N(r.$slots, "default"),
+      z(a.$slots, "default"),
       c("p", {
-        class: $(["fieldset-label h-4", { "text-error": s.value }])
-      }, f(s.value ? r.errors : o.value ? r.description : null), 3)
+        class: w(["fieldset-label h-4", { "text-error": n.value }])
+      }, v(n.value ? a.errors : o.value ? a.description : null), 3)
     ], 2));
   }
-}), Ot = ["disabled"], jt = ["value"], po = /* @__PURE__ */ g({
+}), Kt = ["disabled"], jt = ["value"], $n = /* @__PURE__ */ g({
   __name: "SelectComponent",
-  props: /* @__PURE__ */ q(/* @__PURE__ */ Q({
+  props: /* @__PURE__ */ E(/* @__PURE__ */ X({
     id: {},
     description: {},
     errors: {},
@@ -1049,7 +1064,7 @@ const Ut = {
     valueKey: {},
     labelKey: {}
   }, {
-    ...Y(),
+    ...ee(),
     options: [],
     valueKey: "value",
     labelKey: "label"
@@ -1057,107 +1072,107 @@ const Ut = {
     modelValue: {},
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ q(["change", "focus", "blur"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ E(["change", "focus", "blur"], ["update:modelValue"]),
   setup(e, { emit: t }) {
-    const o = e, n = t, s = se(e, "modelValue"), r = (m) => {
-      n("change", m);
-    }, b = (m) => {
-      n("focus", m);
-    }, l = (m) => {
-      n("blur", m);
+    const o = e, s = t, n = le(e, "modelValue"), a = (d) => {
+      s("change", d);
+    }, b = (d) => {
+      s("focus", d);
+    }, r = (d) => {
+      s("blur", d);
     };
-    return (m, p) => (a(), v(ue, ne(ae(o)), {
-      default: D(() => [
-        J(c("select", {
-          "onUpdate:modelValue": p[0] || (p[0] = (i) => s.value = i),
-          disabled: !m.enabled,
-          class: $(["select select-bordered", m.styles.control.select]),
-          onChange: r,
+    return (d, p) => (l(), f(pe, ae(re(o)), {
+      default: T(() => [
+        Q(c("select", {
+          "onUpdate:modelValue": p[0] || (p[0] = (i) => n.value = i),
+          disabled: !d.enabled,
+          class: w(["select select-bordered", d.styles.control.select]),
+          onChange: a,
           onFocus: b,
-          onBlur: l
+          onBlur: r
         }, [
-          (a(!0), u(k, null, L(m.options, (i) => (a(), u("option", {
-            key: i[m.valueKey],
+          (l(!0), u(k, null, x(d.options, (i) => (l(), u("option", {
+            key: i[d.valueKey],
             value: i
-          }, f(i[m.labelKey]), 9, jt))), 128))
-        ], 42, Ot), [
-          [Ce, s.value]
+          }, v(i[d.labelKey]), 9, jt))), 128))
+        ], 42, Kt), [
+          [Le, n.value]
         ])
       ]),
       _: 1
     }, 16));
   }
-}), Rt = "GHENTCDH_AUTHENTICATION", qt = () => {
-  const e = $e(Rt);
+}), Ot = "GHENTCDH_AUTHENTICATION", It = () => {
+  const e = Me(Ot);
   e || console.warn("No auth provided, authorized calls may not work");
-  const t = async (o, n, s = { contentType: "application/json" }) => {
-    const r = (s == null ? void 0 : s.skipAuth) ?? (e == null ? void 0 : e.options.skipAuthentication), b = {
+  const t = async (o, s, n = { contentType: "application/json" }) => {
+    const a = (n == null ? void 0 : n.skipAuth) ?? (e == null ? void 0 : e.options.skipAuthentication), b = {
       accept: "application/json",
-      ...n.headers ?? {}
+      ...s.headers ?? {}
     };
-    s.contentType && (b["Content-Type"] = s.contentType), r || (await (e == null ? void 0 : e.updateToken()), b.Authorization = `Bearer ${e == null ? void 0 : e.token()}`);
-    const l = new URL(o, window.location.href);
-    if (s != null && s.queryParams)
-      for (const [p, i] of Object.entries(s.queryParams))
-        l.searchParams.set(p, i);
-    const m = await fetch(l.toString(), {
-      ...n,
+    n.contentType && (b["Content-Type"] = n.contentType), a || (await (e == null ? void 0 : e.updateToken()), b.Authorization = `Bearer ${e == null ? void 0 : e.token()}`);
+    const r = new URL(o, window.location.href);
+    if (n != null && n.queryParams)
+      for (const [p, i] of Object.entries(n.queryParams))
+        r.searchParams.set(p, i);
+    const d = await fetch(r.toString(), {
+      ...s,
       headers: b
     });
-    return m.ok ? m.json() : (s != null && s.skipAuth, Promise.reject({
-      content: m.body,
-      status: m.status
+    return d.ok ? d.json() : (n != null && n.skipAuth, Promise.reject({
+      content: d.body,
+      status: d.status
     }));
   };
   return {
-    get: (o, n) => t(o, { method: "GET" }, n),
-    postFile: (o, n, s = {}, r) => {
+    get: (o, s) => t(o, { method: "GET" }, s),
+    postFile: (o, s, n = {}, a) => {
       const b = new FormData();
-      for (const l in s)
-        b.append(l, s[l]);
-      return b.append("file", n), t(
+      for (const r in n)
+        b.append(r, n[r]);
+      return b.append("file", s), t(
         o,
         {
           method: "POST",
           body: b
         },
-        { ...r, contentType: void 0 }
+        { ...a, contentType: void 0 }
       );
     },
-    post: (o, n, s) => t(
+    post: (o, s, n) => t(
       o,
       {
         method: "POST",
-        body: JSON.stringify(n)
+        body: JSON.stringify(s)
       },
-      s
+      n
     ),
-    patch: (o, n, s) => t(
+    patch: (o, s, n) => t(
       o,
       {
         method: "PATCH",
-        body: JSON.stringify(n)
+        body: JSON.stringify(s)
       },
-      s
+      n
     ),
-    delete: (o, n, s) => t(
+    delete: (o, s, n) => t(
       o,
       {
         method: "DELETE",
-        body: JSON.stringify(n)
+        body: JSON.stringify(s)
       },
-      s
+      n
     )
   };
-}, Et = ["disabled"], Wt = {
+}, qt = ["disabled"], Et = {
   key: 0,
-  class: /* @__PURE__ */ $([
+  class: /* @__PURE__ */ w([
     `bg-base-100 w-52 shadow -mt-5
         absolute z-50`
   ])
-}, Zt = ["onClick", "onBlur"], mo = /* @__PURE__ */ g({
+}, Zt = ["onClick", "onBlur"], Cn = /* @__PURE__ */ g({
   __name: "AutoComplete",
-  props: /* @__PURE__ */ q(/* @__PURE__ */ Q({
+  props: /* @__PURE__ */ E(/* @__PURE__ */ X({
     id: {},
     description: {},
     errors: {},
@@ -1173,78 +1188,78 @@ const Ut = {
     options: {},
     valueKey: {},
     labelKey: {}
-  }, Ft()), {
+  }, Ut()), {
     modelValue: {},
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ q(["change", "focus", "blur"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ E(["change", "focus", "blur"], ["update:modelValue"]),
   setup(e, { emit: t }) {
-    const o = e, n = t, s = se(e, "modelValue"), r = O(""), b = (d) => {
-      n("change", d);
-    }, l = (d) => {
-      n("focus", d);
-    }, m = (d) => {
-      n("blur", d);
-    }, p = O(!1), i = O([]), A = (d) => {
-      p.value = !0, V(d);
-    }, V = (d) => {
-      s.value = d, b(d);
-    }, U = (d) => {
-      var _;
-      ((_ = i.value) == null ? void 0 : _.length) === d + 1 && (i.value = []);
-    }, K = qt(), y = (d) => d[o.valueKey], z = (d) => (d == null ? void 0 : d[o.labelKey]) ?? "";
-    return te(
-      () => s.value,
-      (d) => {
-        d && !y(d) || (p.value = !0, i.value = [], r.value = z(d));
+    const o = e, s = t, n = le(e, "modelValue"), a = R(""), b = (m) => {
+      s("change", m);
+    }, r = (m) => {
+      s("focus", m);
+    }, d = (m) => {
+      s("blur", m);
+    }, p = R(!1), i = R([]), D = (m) => {
+      p.value = !0, S(m);
+    }, S = (m) => {
+      n.value = m, b(m);
+    }, F = (m) => {
+      var C;
+      ((C = i.value) == null ? void 0 : C.length) === m + 1 && (i.value = []);
+    }, j = It(), _ = (m) => m[o.valueKey], N = (m) => (m == null ? void 0 : m[o.labelKey]) ?? "";
+    return ne(
+      () => n.value,
+      (m) => {
+        m && !_(m) || (p.value = !0, i.value = [], a.value = N(m));
       },
       { immediate: !0 }
-    ), te(
-      () => r.value,
-      (d) => {
+    ), ne(
+      () => a.value,
+      (m) => {
         if (p.value) {
           p.value = !1;
           return;
         }
-        if (V({ [o.labelKey]: d }), o.config) {
-          const { uri: _, skipAuth: I, dataField: x } = o.config;
-          K.get(`${_}${d}`, { skipAuth: I }).then((F) => {
-            i.value = F[x];
+        if (S({ [o.labelKey]: m }), o.config) {
+          const { uri: C, skipAuth: O, dataField: A } = o.config;
+          j.get(`${C}${m}`, { skipAuth: O }).then((H) => {
+            i.value = H[A];
           });
-        } else o.options && (i.value = o.options.filter((_) => z(_).toLowerCase().includes(d)).slice(0, 10));
+        } else o.options && (i.value = o.options.filter((C) => N(C).toLowerCase().includes(m)).slice(0, 10));
       }
-    ), (d, _) => {
-      const I = be("click-outside");
-      return a(), v(ue, ne(ae(o)), {
-        default: D(() => {
-          var x;
+    ), (m, C) => {
+      const O = fe("click-outside");
+      return l(), f(pe, ae(re(o)), {
+        default: T(() => {
+          var A;
           return [
-            J(c("input", {
-              "onUpdate:modelValue": _[0] || (_[0] = (F) => r.value = F),
+            Q(c("input", {
+              "onUpdate:modelValue": C[0] || (C[0] = (H) => a.value = H),
               autocomplete: "off",
               type: "text",
-              class: $([d.styles.control.select]),
-              disabled: !d.enabled,
-              onFocus: l,
-              onBlur: m
-            }, null, 42, Et), [
-              [Me, r.value]
+              class: w([m.styles.control.select]),
+              disabled: !m.enabled,
+              onFocus: r,
+              onBlur: d
+            }, null, 42, qt), [
+              [xe, a.value]
             ]),
-            J((a(), u("div", null, [
-              (x = i.value) != null && x.length ? (a(), u("ul", Wt, [
-                (a(!0), u(k, null, L(i.value, (F, ge) => (a(), u("li", {
-                  key: F[d.valueKey]
+            Q((l(), u("div", null, [
+              (A = i.value) != null && A.length ? (l(), u("ul", Et, [
+                (l(!0), u(k, null, x(i.value, (H, _e) => (l(), u("li", {
+                  key: H[m.valueKey]
                 }, [
                   c("button", {
                     class: "w-full h-8 border-b-1 border-gray-200 border-x-0 border-t-0 px-4 py-2 text-left hover:bg-primary-content cursor-pointer",
                     type: "button",
-                    onClick: (ye) => A(F),
-                    onBlur: (ye) => U(ge)
-                  }, f(z(F)), 41, Zt)
+                    onClick: (we) => D(H),
+                    onBlur: (we) => F(_e)
+                  }, v(N(H)), 41, Zt)
                 ]))), 128))
-              ])) : M("", !0)
+              ])) : y("", !0)
             ])), [
-              [I, () => i.value = []]
+              [O, () => i.value = []]
             ])
           ];
         }),
@@ -1252,15 +1267,15 @@ const Ut = {
       }, 16);
     };
   }
-}), Gt = {
+}), Wt = {
   key: 0,
-  class: /* @__PURE__ */ $([
+  class: /* @__PURE__ */ w([
     `bg-base-100 w-52 shadow -mt-5
         absolute z-50 p-0`
   ])
-}, Jt = ["onClick"], Qt = { class: "w-4 mr-2" }, bo = /* @__PURE__ */ g({
+}, Gt = ["onClick"], Jt = { class: "w-4 mr-2" }, Ln = /* @__PURE__ */ g({
   __name: "MultiSelect",
-  props: /* @__PURE__ */ q(/* @__PURE__ */ Q({
+  props: /* @__PURE__ */ E(/* @__PURE__ */ X({
     id: {},
     description: {},
     errors: {},
@@ -1276,68 +1291,68 @@ const Ut = {
     valueKey: {},
     labelKey: {}
   }, {
-    ...Y(),
+    ...ee(),
     valueKey: "value",
     labelKey: "label"
   }), {
     modelValue: {},
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ q(["change", "focus", "blur"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ E(["change", "focus", "blur"], ["update:modelValue"]),
   setup(e, { emit: t }) {
-    const o = e, n = t, s = se(e, "modelValue");
-    let r = !1;
-    const b = (y) => {
-      n("change", y);
-    }, l = O(!1), m = () => {
-      l.value = !l.value, r = !0;
+    const o = e, s = t, n = le(e, "modelValue");
+    let a = !1;
+    const b = (_) => {
+      s("change", _);
+    }, r = R(!1), d = () => {
+      r.value = !r.value, a = !0;
     }, p = () => {
-      r || (l.value = !1), r = !1;
-    }, i = C(
+      a || (r.value = !1), a = !1;
+    }, i = $(
       () => {
-        var y;
-        return ((y = s.value) == null ? void 0 : y.map((z) => U(z))) ?? [];
+        var _;
+        return ((_ = n.value) == null ? void 0 : _.map((N) => F(N))) ?? [];
       }
-    ), A = (y) => i.value.includes(y), V = (y, z) => {
-      y.preventDefault();
-      let d = s.value ?? [];
-      const _ = U(z);
-      A(_) ? d = d.filter((x) => U(x) !== _) : d.push(z), s.value = d, b(d);
-    }, U = (y) => y[o.valueKey], K = (y) => (y == null ? void 0 : y[o.labelKey]) ?? "";
-    return (y, z) => {
-      const d = be("click-outside");
-      return a(), v(ue, ne(ae(o)), {
-        default: D(() => {
-          var _, I;
+    ), D = (_) => i.value.includes(_), S = (_, N) => {
+      _.preventDefault();
+      let m = n.value ?? [];
+      const C = F(N);
+      D(C) ? m = m.filter((A) => F(A) !== C) : m.push(N), n.value = m, b(m);
+    }, F = (_) => _[o.valueKey], j = (_) => (_ == null ? void 0 : _[o.labelKey]) ?? "";
+    return (_, N) => {
+      const m = fe("click-outside");
+      return l(), f(pe, ae(re(o)), {
+        default: T(() => {
+          var C, O;
           return [
             c("button", {
               type: "button",
-              class: $([y.styles.control.select, "w-full truncate block"]),
-              onClick: m
-            }, f(((I = (_ = s.value) == null ? void 0 : _.map) == null ? void 0 : I.call(_, (x) => K(x)).join(", ")) ?? "Select value"), 3),
-            J((a(), u("div", null, [
-              l.value ? (a(), u("ul", Gt, [
-                (a(!0), u(k, null, L(y.options, (x) => (a(), u("li", {
-                  key: x[y.valueKey]
+              class: w([_.styles.control.select, "w-full truncate block"]),
+              onClick: d
+            }, v(((O = (C = n.value) == null ? void 0 : C.map) == null ? void 0 : O.call(C, (A) => j(A)).join(", ")) ?? "Select value"), 3),
+            Q((l(), u("div", null, [
+              r.value ? (l(), u("ul", Wt, [
+                (l(!0), u(k, null, x(_.options, (A) => (l(), u("li", {
+                  key: A[_.valueKey]
                 }, [
                   c("button", {
                     class: "w-full flex h-8 border-b-1 border-gray-200 border-x-0 border-t-0 p-2 text-left hover:bg-primary-content cursor-pointer",
                     type: "button",
-                    onClick: (F) => V(F, x)
+                    onClick: (H) => S(H, A)
                   }, [
-                    c("div", Qt, [
-                      A(U(x)) ? (a(), v(h(E), {
+                    c("div", Jt, [
+                      D(F(A)) ? (l(), f(h(K), {
                         key: 0,
-                        icon: h(H).Check,
+                        icon: h(V).Check,
                         size: "sm"
-                      }, null, 8, ["icon"])) : M("", !0)
+                      }, null, 8, ["icon"])) : y("", !0)
                     ]),
-                    S(" " + f(K(x)), 1)
-                  ], 8, Jt)
+                    U(" " + v(j(A)), 1)
+                  ], 8, Gt)
                 ]))), 128))
-              ])) : M("", !0)
+              ])) : y("", !0)
             ])), [
-              [d, () => p()]
+              [m, () => p()]
             ])
           ];
         }),
@@ -1345,43 +1360,249 @@ const Ut = {
       }, 16);
     };
   }
+}), Qt = { class: "grid grid-cols-[auto_1fr_auto] h-full overflow-hidden" }, Xt = {
+  id: "drawer-left",
+  class: "min-h-0 min-w-6 relative flex-shrink-0 bg-white shadow-lg transition-all duration-300 ease-in-out border-l border-gray-200 overflow-visible"
+}, Yt = { class: "flex-1 overflow-y-auto bg-white" }, en = { class: "min-h-0 min-w-6 relative flex-shrink-0 bg-white shadow-lg transition-all duration-300 ease-in-out border-l border-gray-200 overflow-visible" }, Mn = /* @__PURE__ */ g({
+  __name: "drawer",
+  props: {
+    widthLeft: { default: 200 },
+    widthRight: { default: 200 }
+  },
+  setup(e) {
+    const t = R({ left: !0, right: !0 }), o = (s) => {
+      t.value[s] = !t.value[s];
+    };
+    return (s, n) => (l(), u("main", Qt, [
+      c("aside", Xt, [
+        c("div", {
+          class: w(["absolute top-0 z-20", t.value.left ? "-right-0" : "-right-2"])
+        }, [
+          c("button", {
+            class: "btn btn-ghost btn-circle",
+            onClick: n[0] || (n[0] = (a) => o("left"))
+          }, [
+            B(h(K), {
+              size: "sm",
+              icon: t.value.left ? h(V).DblChevronLeft : h(V).DblChevronRight
+            }, null, 8, ["icon"])
+          ])
+        ], 2),
+        t.value.left ? (l(), u("div", {
+          key: 0,
+          style: J({ width: s.widthLeft + "px" }),
+          class: "h-full overflow-y-auto p-4"
+        }, [
+          z(s.$slots, "left-drawer")
+        ], 4)) : y("", !0)
+      ]),
+      c("div", Yt, [
+        z(s.$slots, "default")
+      ]),
+      c("aside", en, [
+        t.value.right ? (l(), u("div", {
+          key: 0,
+          style: J({ width: s.widthRight + "px" }),
+          class: "h-full overflow-y-auto p-4"
+        }, [
+          z(s.$slots, "right-drawer")
+        ], 4)) : y("", !0),
+        c("div", {
+          class: w(["absolute top-0 z-20", t.value.right ? "-left-0" : "-left-2"])
+        }, [
+          c("button", {
+            class: "btn btn-ghost btn-circle",
+            onClick: n[1] || (n[1] = (a) => o("right"))
+          }, [
+            B(h(K), {
+              size: "sm",
+              icon: t.value.right ? h(V).DblChevronRight : h(V).DblChevronLeft
+            }, null, 8, ["icon"])
+          ])
+        ], 2)
+      ])
+    ]));
+  }
+});
+function tn(e, t) {
+  return l(), u("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    "data-slot": "icon"
+  }, [
+    c("path", {
+      "fill-rule": "evenodd",
+      d: "M12.53 16.28a.75.75 0 0 1-1.06 0l-7.5-7.5a.75.75 0 0 1 1.06-1.06L12 14.69l6.97-6.97a.75.75 0 1 1 1.06 1.06l-7.5 7.5Z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+function nn(e, t) {
+  return l(), u("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    "data-slot": "icon"
+  }, [
+    c("path", {
+      "fill-rule": "evenodd",
+      d: "M16.28 11.47a.75.75 0 0 1 0 1.06l-7.5 7.5a.75.75 0 0 1-1.06-1.06L14.69 12 7.72 5.03a.75.75 0 0 1 1.06-1.06l7.5 7.5Z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+const on = { class: "ml-1" }, sn = { class: "truncate flex-1 min-w-0 text-left" }, ln = {
+  key: 0,
+  class: "badge badge-ghost badge-sm flex-shrink-0"
+}, an = /* @__PURE__ */ g({
+  __name: "TreeItem",
+  props: {
+    active: {},
+    node: {},
+    expanded: {},
+    isExpanded: { type: Function }
+  },
+  emits: ["toggle", "select"],
+  setup(e, { emit: t }) {
+    const o = e, s = t, n = $(() => o.active === o.node.id);
+    return (a, b) => {
+      var d;
+      const r = oe("TreeItem", !0);
+      return l(), u("li", on, [
+        c("div", {
+          class: w([
+            `flex items-center gap-1 cursor-pointer rounded-md px-1 py-0.5
+      hover:bg-gray-100`,
+            n.value ? "text-primary" : ""
+          ])
+        }, [
+          ((d = a.node.children) == null ? void 0 : d.length) > 0 ? (l(), u("span", {
+            key: 0,
+            class: "flex items-center justify-center",
+            onClick: b[0] || (b[0] = (p) => s("toggle", a.node))
+          }, [
+            a.node.children && a.isExpanded(a.node.id) ? (l(), f(h(tn), {
+              key: 0,
+              class: "w-3 h-3"
+            })) : (l(), f(h(nn), {
+              key: 1,
+              class: "w-3 h-3"
+            }))
+          ])) : y("", !0),
+          c("div", {
+            class: "flex items-center gap-2 w-full min-w-0",
+            onClick: b[1] || (b[1] = (p) => s("select", a.node))
+          }, [
+            c("div", sn, v(a.node.label), 1),
+            a.node.tag ? (l(), u("div", ln, v(a.node.tag), 1)) : y("", !0)
+          ])
+        ], 2),
+        a.node.children && a.isExpanded(a.node.id) ? (l(), u("ul", {
+          key: 0,
+          class: w([
+            "ml-4 border-l pl-2",
+            { "border-gray-200": !n.value, "border-primary": n.value }
+          ])
+        }, [
+          (l(!0), u(k, null, x(a.node.children, (p) => (l(), f(r, {
+            key: p.id,
+            node: p,
+            expanded: a.expanded,
+            active: a.active,
+            "is-expanded": a.isExpanded,
+            onToggle: b[2] || (b[2] = (i) => s("toggle", i)),
+            onSelect: b[3] || (b[3] = (i) => s("select", i))
+          }, null, 8, ["node", "expanded", "active", "is-expanded"]))), 128))
+        ], 2)) : y("", !0)
+      ]);
+    };
+  }
+}), rn = { class: "select-none text-sm" }, xn = /* @__PURE__ */ g({
+  __name: "TreeView",
+  props: {
+    data: {},
+    active: {}
+  },
+  emits: ["select"],
+  setup(e, { emit: t }) {
+    const o = e, s = t, n = R(/* @__PURE__ */ new Set()), a = (d) => {
+      const p = d.id;
+      if (!d.children || d.children.length === 0) {
+        s("select", d);
+        return;
+      }
+      n.value.has(p) ? n.value.delete(p) : n.value.add(p);
+    }, b = (d) => {
+      s("select", d), n.value.add(d.id);
+    }, r = (d) => n.value.has(d);
+    return (d, p) => (l(), u("ul", rn, [
+      (l(!0), u(k, null, x(o.data, (i) => (l(), f(an, {
+        key: i.id,
+        node: i,
+        expanded: n.value,
+        active: d.active,
+        "is-expanded": r,
+        onToggle: a,
+        onSelect: b
+      }, null, 8, ["node", "expanded", "active"]))), 128))
+    ]));
+  }
+}), un = {
+  key: 0,
+  class: "flex items-center justify-center h-20"
+}, Bn = /* @__PURE__ */ g({
+  __name: "loading",
+  props: {
+    loading: { type: Boolean }
+  },
+  setup(e) {
+    return (t, o) => t.loading ? (l(), u("div", un, o[0] || (o[0] = [
+      c("span", { class: "loading loading-bars loading-md text-primary" }, null, -1)
+    ]))) : y("", !0);
+  }
 });
 export {
-  mo as Autocomplete,
-  Ze as BadgeSize,
-  R as Btn,
-  oo as BtnBadge,
-  We as ButtonSize,
-  lo as Card,
-  co as ClickOutside,
-  j as Color,
-  Je as ConfirmModal,
-  ue as ControlWrapper,
-  Ft as DefaultAutoCompleteProperties,
-  Y as DefaultControlProperties,
-  to as Dropdown,
-  E as Icon,
-  H as IconEnum,
-  Be as IconMap,
-  eo as Menu,
-  Re as Modal,
-  ie as ModalService,
-  Qe as ModalWrapper,
-  bo as MultiSelect,
-  Xe as NotificationMessage,
-  ce as NotificationService,
-  tt as Notifications,
-  yt as PaginationComponent,
-  po as SelectComponent,
-  so as ShellComponent,
-  le as SubMenu,
-  ao as Table,
-  ao as TableComponent,
-  no as TextCell,
-  ro as addClickOutsideEventListener,
-  uo as hasCustomEventListener,
-  Kt as isDescriptionHidden,
-  Ut as myStyles,
-  io as removeClickOutsideEventListener,
-  Ht as showErrors
+  Cn as Autocomplete,
+  Je as BadgeSize,
+  q as Btn,
+  bn as BtnBadge,
+  Ge as ButtonSize,
+  gn as Card,
+  wn as ClickOutside,
+  I as Color,
+  Xe as ConfirmModal,
+  pe as ControlWrapper,
+  Ut as DefaultAutoCompleteProperties,
+  ee as DefaultControlProperties,
+  Mn as Drawer,
+  mn as Dropdown,
+  K as Icon,
+  V as IconEnum,
+  Pe as IconMap,
+  Bn as Loading,
+  pn as Menu,
+  Ee as Modal,
+  ce as ModalService,
+  Ye as ModalWrapper,
+  Ln as MultiSelect,
+  et as NotificationMessage,
+  de as NotificationService,
+  ot as Notifications,
+  gt as PaginationComponent,
+  $n as SelectComponent,
+  hn as ShellComponent,
+  ie as SubMenu,
+  vn as Table,
+  vn as TableComponent,
+  fn as TextCell,
+  xn as TreeView,
+  yn as addClickOutsideEventListener,
+  kn as hasCustomEventListener,
+  Ft as isDescriptionHidden,
+  Nt as myStyles,
+  _n as removeClickOutsideEventListener,
+  Rt as showErrors
 };