@stlhorizon/vue-ui 2.5.6 → 2.6.0

package/dist/index.esm.js

@@ -3602,7 +3602,7 @@ const ae = {
     variant: {
       type: String,
       default: "default",
-      validator: (e) => ["default", "secondary", "destructive", "outline"].includes(e)
+      validator: (e) => ["default", "secondary", "destructive", "outline", "success", "warning", "info", "ghost", "link", "subtle", "dark", "light", "primaryOutline", "destructiveOutline", "successOutline", "gradient"].includes(e)
     },
     size: {
       type: String,
@@ -3629,13 +3629,7 @@ const ae = {
   },
   emits: ["dismiss"],
   setup(e, { emit: a }) {
-    const t = {
-      template: `
-    <svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
-      <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
-    </svg>
-  `
-    }, n = e, r = a, l = () => r("dismiss"), s = M(
+    const t = e, n = a, r = () => n("dismiss"), l = M(
       "inline-flex items-center font-medium border transition-all duration-200",
       {
         variants: {
@@ -3643,7 +3637,19 @@ const ae = {
             default: "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
             secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
             destructive: "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
-            outline: "text-foreground border"
+            outline: "text-foreground border",
+            success: "border-transparent bg-green-600 text-white hover:bg-green-700",
+            warning: "border-transparent bg-yellow-500 text-black hover:bg-yellow-600",
+            info: "border-transparent bg-cyan-600 text-white hover:bg-cyan-700",
+            ghost: "bg-transparent text-gray-700 hover:bg-gray-100",
+            link: "text-blue-600 hover:underline",
+            subtle: "bg-gray-100 text-gray-800 hover:bg-gray-200",
+            dark: "bg-gray-900 text-white hover:bg-black",
+            light: "bg-gray-50 text-gray-800 border border-gray-200 hover:bg-gray-100",
+            primaryOutline: "border border-blue-600 text-blue-600 bg-transparent hover:bg-blue-50",
+            destructiveOutline: "border border-red-600 text-red-600 bg-transparent hover:bg-red-50",
+            successOutline: "border border-green-600 text-green-600 bg-transparent hover:bg-green-50",
+            gradient: "bg-gradient-to-r from-blue-500 to-purple-600 text-white hover:from-blue-600 hover:to-purple-700"
           },
           size: {
             sm: "px-2 py-0.5 text-xs",
@@ -3662,26 +3668,29 @@ const ae = {
           shape: "rounded"
         }
       }
-    ), u = v(() => ["mr-1", {
+    ), s = v(() => ["mr-1", {
       sm: "w-3 h-3",
       md: "w-4 h-4",
       lg: "w-5 h-5"
-    }[n.size]]);
-    return (c, y) => (o(), d("span", {
-      class: m(N(S)(N(s)({ variant: e.variant, size: e.size, shape: e.shape }), c.$attrs.class))
+    }[t.size]]);
+    return (u, c) => (o(), d("span", {
+      class: m(N(S)(N(l)({ variant: e.variant, size: e.size, shape: e.shape }), u.$attrs.class))
     }, [
       e.icon ? (o(), R(ve(e.icon), {
         key: 0,
-        class: m(u.value)
+        class: m(s.value)
       }, null, 8, ["class"])) : h("", !0),
-      B(c.$slots, "default"),
+      B(u.$slots, "default"),
       e.dismissible ? (o(), d("button", {
         key: 1,
         class: "ml-1 hover:bg-black/10 rounded-full p-0.5 transition-colors",
         "aria-label": e.dismissLabel,
-        onClick: l
+        onClick: r
       }, [
-        P(t, { class: "w-3 h-3" })
+        P(ae, {
+          icon: "xmark",
+          class: "w-3 h-3"
+        })
       ], 8, _o)) : h("", !0)
     ], 2));
   }
@@ -5397,158 +5406,16 @@ const ae = {
       _: 3
     }, 16, ["class"]));
   }
-}, yt = (e, a) => {
-  const t = e.__vccOpts || e;
-  for (const [n, r] of a)
-    t[n] = r;
-  return t;
-}, Ai = {
-  key: 0,
-  class: "stl-loader__backdrop"
-}, Ii = { class: "stl-loader__container" }, Pi = {
-  key: 0,
-  class: "stl-loader__text stl-loader__text--top"
-}, Ti = {
-  key: 1,
-  class: "stl-loader__spin"
-}, ji = {
-  key: 2,
-  class: "stl-loader__pulse"
-}, Bi = {
-  key: 3,
-  class: "stl-loader__bounce"
-}, Oi = {
-  key: 4,
-  class: "stl-loader__ripple"
-}, Vi = {
-  key: 5,
-  class: "stl-loader__bars"
-}, Di = {
-  key: 6,
-  class: "stl-loader__dots"
-}, Mi = {
-  key: 7,
-  class: "stl-loader__ring"
-}, Fi = {
-  key: 8,
-  class: "stl-loader__spinner-text"
-}, Ni = {
-  key: 9,
-  class: "stl-loader__text stl-loader__text--bottom"
-}, Ei = {
-  __name: "STLLoader",
-  props: {
-    loading: {
-      type: Boolean,
-      default: !0
-    },
-    type: {
-      type: String,
-      default: "spin",
-      validator: (e) => [
-        "spin",
-        "pulse",
-        "bounce",
-        "ripple",
-        "bars",
-        "dots",
-        "ring",
-        "spinner-text"
-      ].includes(e)
-    },
-    size: {
-      type: String,
-      default: "medium",
-      validator: (e) => ["small", "medium", "large", "xl"].includes(e)
-    },
-    color: {
-      type: String,
-      default: "#3b82f6"
-    },
-    backgroundColor: {
-      type: String,
-      default: "rgba(255, 255, 255, 0.9)"
-    },
-    text: {
-      type: String,
-      default: ""
-    },
-    textPosition: {
-      type: String,
-      default: "bottom",
-      validator: (e) => ["top", "bottom"].includes(e)
-    },
-    overlay: {
-      type: Boolean,
-      default: !1
-    },
-    fullscreen: {
-      type: Boolean,
-      default: !1
-    }
-  },
-  setup(e) {
-    return (a, t) => e.loading ? (o(), d("div", {
-      key: 0,
-      class: m([
-        "stl-loader",
-        `stl-loader--${e.type}`,
-        `stl-loader--${e.size}`,
-        e.overlay ? "stl-loader--overlay" : "",
-        e.fullscreen ? "stl-loader--fullscreen" : ""
-      ]),
-      style: de({
-        "--loader-color": e.color,
-        "--loader-bg": e.backgroundColor
-      })
-    }, [
-      e.overlay ? (o(), d("div", Ai)) : h("", !0),
-      i("div", Ii, [
-        e.text && e.textPosition === "top" ? (o(), d("div", Pi, x(e.text), 1)) : h("", !0),
-        e.type === "spin" ? (o(), d("div", Ti)) : e.type === "pulse" ? (o(), d("div", ji)) : e.type === "bounce" ? (o(), d("div", Bi, [
-          (o(), d(K, null, J(3, (n) => i("div", {
-            key: n,
-            class: "stl-loader__bounce-dot",
-            style: de({ animationDelay: `${(n - 1) * 0.1}s` })
-          }, null, 4)), 64))
-        ])) : e.type === "ripple" ? (o(), d("div", Oi, [
-          (o(), d(K, null, J(2, (n) => i("div", {
-            key: n,
-            class: "stl-loader__ripple-ring",
-            style: de({ animationDelay: `${(n - 1) * 0.5}s` })
-          }, null, 4)), 64))
-        ])) : e.type === "bars" ? (o(), d("div", Vi, [
-          (o(), d(K, null, J(5, (n) => i("div", {
-            key: n,
-            class: "stl-loader__bar",
-            style: de({ animationDelay: `${(n - 1) * 0.1}s` })
-          }, null, 4)), 64))
-        ])) : e.type === "dots" ? (o(), d("div", Di, [
-          (o(), d(K, null, J(3, (n) => i("div", {
-            key: n,
-            class: "stl-loader__dot",
-            style: de({ animationDelay: `${(n - 1) * 0.16}s` })
-          }, null, 4)), 64))
-        ])) : e.type === "ring" ? (o(), d("div", Mi, [...t[0] || (t[0] = [
-          i("div", { class: "stl-loader__ring-track" }, null, -1),
-          i("div", { class: "stl-loader__ring-fill" }, null, -1)
-        ])])) : e.type === "spinner-text" ? (o(), d("div", Fi, [...t[1] || (t[1] = [
-          i("div", { class: "stl-loader__spinner" }, null, -1)
-        ])])) : h("", !0),
-        e.text && e.textPosition === "bottom" ? (o(), d("div", Ni, x(e.text), 1)) : h("", !0)
-      ])
-    ], 6)) : h("", !0);
-  }
-}, Ye = /* @__PURE__ */ yt(Ei, [["__scopeId", "data-v-6df9f0a0"]]), Li = { class: "flex items-start gap-3" }, _i = {
+}, Ai = { class: "flex items-start gap-3" }, Ii = {
   key: 0,
   class: "flex-shrink-0 mt-0.5"
-}, Ri = { class: "flex-1 min-w-0" }, qi = {
+}, Pi = { class: "flex-1 min-w-0" }, Ti = {
   key: 0,
   class: "font-medium text-sm mb-1"
-}, Yi = {
+}, ji = {
   key: 1,
   class: "mt-3 flex gap-2"
-}, Ui = ["aria-label"], Wi = /* @__PURE__ */ Object.assign({ inheritAttrs: !1 }, {
+}, Bi = ["aria-label"], Oi = /* @__PURE__ */ Object.assign({ inheritAttrs: !1 }, {
   __name: "Alert",
   props: {
     variant: {
@@ -5663,14 +5530,14 @@ const ae = {
           class: m(N(S)(N($)({ variant: e.variant }), b.$attrs.class)),
           role: "alert"
         }, [
-          i("div", Li, [
-            e.showIcon ? (o(), d("div", _i, [
+          i("div", Ai, [
+            e.showIcon ? (o(), d("div", Ii, [
               (o(), R(ve(D.value), {
                 class: m(z.value)
               }, null, 8, ["class"]))
             ])) : h("", !0),
-            i("div", Ri, [
-              e.title ? (o(), d("h4", qi, x(e.title), 1)) : h("", !0),
+            i("div", Pi, [
+              e.title ? (o(), d("h4", Ti, x(e.title), 1)) : h("", !0),
               i("div", {
                 class: m(["text-sm", { "mt-0": !e.title, "mt-1": e.title }])
               }, [
@@ -5678,7 +5545,7 @@ const ae = {
                   G(x(e.message), 1)
                 ])
               ], 2),
-              b.$slots.actions || e.actions.length > 0 ? (o(), d("div", Yi, [
+              b.$slots.actions || e.actions.length > 0 ? (o(), d("div", ji, [
                 B(b.$slots, "actions", {}, () => [
                   (o(!0), d(K, null, J(e.actions, (p) => (o(), R(Ce, {
                     key: p.label,
@@ -5701,14 +5568,14 @@ const ae = {
               onClick: l
             }, [
               P(C, { class: "w-4 h-4" })
-            ], 10, Ui)) : h("", !0)
+            ], 10, Bi)) : h("", !0)
           ])
         ], 2)) : h("", !0)
       ]),
       _: 3
     }));
   }
-}), Hi = ["aria-label"], Gi = { class: "flex items-center space-x-1" }, Ki = {
+}), Vi = ["aria-label"], Di = { class: "flex items-center space-x-1" }, Mi = {
   __name: "Breadcrumb",
   props: {
     items: {
@@ -5745,7 +5612,7 @@ const ae = {
       "aria-label": e.ariaLabel,
       class: m(["flex", n.value])
     }, [
-      i("ol", Gi, [
+      i("ol", Di, [
         (o(!0), d(K, null, J(e.items, (s, u) => (o(), d("li", {
           key: u,
           class: "flex items-center"
@@ -5770,9 +5637,9 @@ const ae = {
           }, null, 8, ["name"])) : h("", !0)
         ]))), 128))
       ])
-    ], 10, Hi));
+    ], 10, Vi));
   }
-}, Xi = ["aria-label"], Ji = {
+}, Fi = ["aria-label"], Ni = {
   __name: "ButtonGroup",
   props: {
     orientation: {
@@ -5809,12 +5676,12 @@ const ae = {
       "aria-label": e.ariaLabel
     }, [
       B(r.$slots, "default")
-    ], 10, Xi));
+    ], 10, Fi));
   }
-}, Qi = { class: "flex items-start justify-between" }, Zi = { class: "flex-1 min-w-0" }, eu = {
+}, Ei = { class: "flex items-start justify-between" }, Li = { class: "flex-1 min-w-0" }, _i = {
   key: 0,
   class: "flex-shrink-0 ml-4"
-}, tu = ["src", "alt"], au = "w-full h-auto object-cover", nu = "text-lg font-semibold text-slate-900 truncate", ru = "text-sm text-slate-600 mt-1", su = {
+}, Ri = ["src", "alt"], qi = "w-full h-auto object-cover", Yi = "text-lg font-semibold text-slate-900 truncate", Ui = "text-sm text-slate-600 mt-1", Wi = {
   __name: "Card",
   props: {
     variant: {
@@ -5930,18 +5797,18 @@ const ae = {
         class: m(N(S)(N(s)({ padding: e.padding })))
       }, [
         B(w.$slots, "header", {}, () => [
-          i("div", Qi, [
-            i("div", Zi, [
+          i("div", Ei, [
+            i("div", Li, [
               e.title ? (o(), d("h3", {
                 key: 0,
-                class: m(nu)
+                class: m(Yi)
               }, x(e.title), 1)) : h("", !0),
               e.subtitle ? (o(), d("p", {
                 key: 1,
-                class: m(ru)
+                class: m(Ui)
               }, x(e.subtitle), 1)) : h("", !0)
             ]),
-            w.$slots.actions ? (o(), d("div", eu, [
+            w.$slots.actions ? (o(), d("div", _i, [
               B(w.$slots, "actions")
             ])) : h("", !0)
           ])
@@ -5956,8 +5823,8 @@ const ae = {
             key: 0,
             src: e.image,
             alt: e.imageAlt,
-            class: m(au)
-          }, null, 8, tu)) : h("", !0)
+            class: m(qi)
+          }, null, 8, Ri)) : h("", !0)
         ])
       ], 2)) : h("", !0),
       w.$slots.default ? (o(), d("div", {
@@ -5974,7 +5841,7 @@ const ae = {
       ], 2)) : h("", !0)
     ], 2));
   }
-}, lu = /* @__PURE__ */ Object.assign({
+}, Hi = /* @__PURE__ */ Object.assign({
   inheritAttrs: !1
 }, {
   __name: "CardHeader",
@@ -5985,7 +5852,7 @@ const ae = {
       B(a.$slots, "default")
     ], 2));
   }
-}), ou = {
+}), Gi = {
   __name: "CardBody",
   props: {
     variant: {
@@ -6012,7 +5879,7 @@ const ae = {
       B(r.$slots, "default")
     ], 2));
   }
-}, iu = {
+}, Ki = {
   __name: "CardFooter",
   props: {
     variant: {
@@ -6039,7 +5906,7 @@ const ae = {
       B(r.$slots, "default")
     ], 2));
   }
-}, uu = /* @__PURE__ */ Object.assign({
+}, Xi = /* @__PURE__ */ Object.assign({
   inheritAttrs: !1
 }, {
   __name: "CardContent",
@@ -6050,7 +5917,7 @@ const ae = {
       B(a.$slots, "default")
     ], 2));
   }
-}), du = /* @__PURE__ */ Object.assign({
+}), Ji = /* @__PURE__ */ Object.assign({
   inheritAttrs: !1
 }, {
   __name: "CardTitle",
@@ -6061,7 +5928,7 @@ const ae = {
       B(a.$slots, "default")
     ], 2));
   }
-}), cu = { class: "relative w-full" }, fu = { class: "relative" }, mu = ["id", "value", "disabled", "placeholder", "required", "aria-describedby"], gu = { class: "flex items-center justify-between mb-4" }, vu = { class: "text-base font-semibold text-slate-900" }, bu = { class: "grid grid-cols-7 gap-1 mb-2" }, hu = { class: "grid grid-cols-7 gap-1" }, yu = ["disabled", "onClick"], pu = {
+}), Qi = { class: "relative w-full" }, Zi = { class: "relative" }, eu = ["id", "value", "disabled", "placeholder", "required", "aria-describedby"], tu = { class: "flex items-center justify-between mb-4" }, au = { class: "text-base font-semibold text-slate-900" }, nu = { class: "grid grid-cols-7 gap-1 mb-2" }, ru = { class: "grid grid-cols-7 gap-1" }, su = ["disabled", "onClick"], lu = {
   key: 0,
   class: "mt-4 pt-3 border-t border-slate-200"
 }, ca = {
@@ -6187,8 +6054,8 @@ const ae = {
       document.addEventListener("keydown", W);
     }), Ha(() => {
       document.removeEventListener("keydown", W);
-    }), (k, T) => (o(), d("div", cu, [
-      i("div", fu, [
+    }), (k, T) => (o(), d("div", Qi, [
+      i("div", Zi, [
         i("input", {
           id: e.id,
           type: "text",
@@ -6200,7 +6067,7 @@ const ae = {
           "aria-describedby": e.ariaDescribedby,
           class: "w-full px-3 py-2 pr-10 border border-slate-300 rounded-md bg-white text-slate-900 placeholder-slate-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 cursor-pointer disabled:bg-slate-50 disabled:text-slate-500 disabled:cursor-not-allowed",
           onClick: A
-        }, null, 8, mu),
+        }, null, 8, eu),
         T[2] || (T[2] = i("div", { class: "absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none" }, [
           i("svg", {
             class: "w-5 h-5 text-slate-400",
@@ -6253,7 +6120,7 @@ const ae = {
             onClick: T[0] || (T[0] = Ve(() => {
             }, ["stop"]))
           }, [
-            i("div", gu, [
+            i("div", tu, [
               i("button", {
                 type: "button",
                 class: "p-2 rounded-lg hover:bg-slate-100 transition-colors",
@@ -6274,7 +6141,7 @@ const ae = {
                   })
                 ], -1)
               ])]),
-              i("div", vu, x(w.value) + " " + x(u.value), 1),
+              i("div", au, x(w.value) + " " + x(u.value), 1),
               i("button", {
                 type: "button",
                 class: "p-2 rounded-lg hover:bg-slate-100 transition-colors",
@@ -6296,13 +6163,13 @@ const ae = {
                 ], -1)
               ])])
             ]),
-            i("div", bu, [
+            i("div", nu, [
               (o(), d(K, null, J(y, (_) => i("div", {
                 key: _,
                 class: "text-center text-xs font-medium text-slate-600 py-1"
               }, x(_), 1)), 64))
             ]),
-            i("div", hu, [
+            i("div", ru, [
               (o(!0), d(K, null, J($.value, (_, re) => (o(), d("div", {
                 key: "prev-" + re,
                 class: "text-center text-sm text-slate-300 py-2"
@@ -6318,13 +6185,13 @@ const ae = {
                   j(_) ? "text-slate-300 cursor-not-allowed hover:bg-transparent" : "cursor-pointer"
                 ]),
                 onClick: (re) => oe(_)
-              }, x(_), 11, yu))), 128)),
+              }, x(_), 11, su))), 128)),
               (o(!0), d(K, null, J(z.value, (_, re) => (o(), d("div", {
                 key: "next-" + re,
                 class: "text-center text-sm text-slate-300 py-2"
               }, x(_), 1))), 128))
             ]),
-            e.showToday ? (o(), d("div", pu, [
+            e.showToday ? (o(), d("div", lu, [
               i("button", {
                 type: "button",
                 class: "w-full px-3 py-2 text-sm font-medium text-blue-600 hover:bg-blue-50 rounded-lg transition-colors",
@@ -6342,7 +6209,7 @@ const ae = {
       })) : h("", !0)
     ]));
   }
-}, xu = ["aria-expanded"], wu = {
+}, ou = ["aria-expanded"], iu = {
   __name: "Dropdown",
   props: {
     triggerText: {
@@ -6415,7 +6282,7 @@ const ae = {
             class: "ml-2 h-4 w-4"
           })
         ])
-      ], 10, xu),
+      ], 10, ou),
       P(ue, {
         "enter-active-class": "transition ease-out duration-100",
         "enter-from-class": "transform opacity-0 scale-95",
@@ -6438,10 +6305,10 @@ const ae = {
       })
     ], 512));
   }
-}, ku = {
+}, uu = {
   key: 1,
   class: "ml-auto text-xs tracking-widest opacity-60"
-}, Su = {
+}, du = {
   __name: "DropdownItem",
   props: {
     href: String,
@@ -6485,18 +6352,18 @@ const ae = {
           class: "mr-2 h-4 w-4"
         }, null, 8, ["name"])) : h("", !0),
         B(u.$slots, "default"),
-        e.shortcut ? (o(), d("span", ku, x(e.shortcut), 1)) : h("", !0)
+        e.shortcut ? (o(), d("span", uu, x(e.shortcut), 1)) : h("", !0)
       ]),
       _: 3
     }, 8, ["href", "class", "disabled"]));
   }
-}, Cu = { class: "w-full" }, $u = ["multiple", "accept"], zu = { class: "flex flex-col items-center justify-center py-6" }, Au = {
+}, cu = { class: "w-full" }, fu = ["multiple", "accept"], mu = { class: "flex flex-col items-center justify-center py-6" }, gu = {
   key: 0,
   class: "text-xs text-muted-foreground mt-1"
-}, Iu = {
+}, vu = {
   key: 0,
   class: "mt-4 space-y-2"
-}, Pu = { class: "flex items-center space-x-2" }, Tu = { class: "text-sm" }, ju = { class: "text-xs text-muted-foreground" }, Bu = ["onClick"], Ou = {
+}, bu = { class: "flex items-center space-x-2" }, hu = { class: "text-sm" }, yu = { class: "text-xs text-muted-foreground" }, pu = ["onClick"], xu = {
   __name: "FileUpload",
   props: {
     multiple: Boolean,
@@ -6551,7 +6418,7 @@ const ae = {
       const V = 1024, j = ["Bytes", "KB", "MB", "GB"], A = Math.floor(Math.log(p) / Math.log(V));
       return parseFloat((p / Math.pow(V, A)).toFixed(2)) + " " + j[A];
     };
-    return (p, V) => (o(), d("div", Cu, [
+    return (p, V) => (o(), d("div", cu, [
       i("div", {
         class: m(c.value),
         onDrop: y,
@@ -6568,8 +6435,8 @@ const ae = {
           accept: e.accept,
           class: "hidden",
           onChange: z
-        }, null, 40, $u),
-        i("div", zu, [
+        }, null, 40, fu),
+        i("div", mu, [
           P(ae, {
             name: "upload",
             class: "h-8 w-8 text-muted-foreground mb-2"
@@ -6578,21 +6445,21 @@ const ae = {
             i("span", { class: "font-semibold" }, "Click to upload"),
             G(" or drag and drop ")
           ], -1)),
-          e.accept ? (o(), d("p", Au, x(e.accept), 1)) : h("", !0)
+          e.accept ? (o(), d("p", gu, x(e.accept), 1)) : h("", !0)
         ])
       ], 34),
-      r.value.length > 0 ? (o(), d("div", Iu, [
+      r.value.length > 0 ? (o(), d("div", vu, [
         (o(!0), d(K, null, J(r.value, (j, A) => (o(), d("div", {
           key: A,
           class: "flex items-center justify-between p-2 bg-muted rounded-md"
         }, [
-          i("div", Pu, [
+          i("div", bu, [
             P(ae, {
               name: "file",
               class: "h-4 w-4 text-muted-foreground"
             }),
-            i("span", Tu, x(j.name), 1),
-            i("span", ju, "(" + x(f(j.size)) + ")", 1)
+            i("span", hu, x(j.name), 1),
+            i("span", yu, "(" + x(f(j.size)) + ")", 1)
           ]),
           i("button", {
             class: "text-muted-foreground hover:text-foreground",
@@ -6602,16 +6469,16 @@ const ae = {
               name: "x",
               class: "h-4 w-4"
             })
-          ], 8, Bu)
+          ], 8, pu)
         ]))), 128))
       ])) : h("", !0)
     ]));
   }
-}, Vu = ["for"], Du = {
+}, wu = ["for"], ku = {
   key: 0,
   class: "text-red-500 ml-1",
   "aria-label": "required"
-}, Mu = { class: "relative" }, Fu = ["aria-label"], Nu = ["id"], Eu = ["id"], ar = {
+}, Su = { class: "relative" }, Cu = ["aria-label"], $u = ["id"], zu = ["id"], ar = {
   __name: "FormField",
   props: {
     label: String,
@@ -6698,13 +6565,13 @@ const ae = {
           class: m(N(S)(N(C)({ size: e.size })))
         }, [
           G(x(e.label) + " ", 1),
-          e.required ? (o(), d("span", Du, "*")) : h("", !0)
-        ], 10, Vu)) : h("", !0),
+          e.required ? (o(), d("span", ku, "*")) : h("", !0)
+        ], 10, wu)) : h("", !0),
         e.description ? (o(), d("p", {
           key: 1,
           class: m(N(S)(N(D)({ size: e.size })))
         }, x(e.description), 3)) : h("", !0),
-        i("div", Mu, [
+        i("div", Su, [
           e.type === "date" ? (o(), R(ca, {
             key: 0,
             id: l.value,
@@ -6732,7 +6599,7 @@ const ae = {
               icon: u.value ? "eye-slash" : "eye",
               class: "w-4 h-4"
             }, null, 8, ["icon"])
-          ], 8, Fu)) : h("", !0)
+          ], 8, Cu)) : h("", !0)
         ]),
         P(ue, {
           "enter-active-class": "transition-all duration-200",
@@ -6755,7 +6622,7 @@ const ae = {
                 class: "w-4 h-4 flex-shrink-0 mt-0.5"
               }),
               i("span", null, x(e.error), 1)
-            ], 10, Nu)) : h("", !0)
+            ], 10, $u)) : h("", !0)
           ]),
           _: 1
         }),
@@ -6763,7 +6630,7 @@ const ae = {
           key: 2,
           id: `${l.value}-help`,
           class: m(N(S)(N(z)({ size: e.size })))
-        }, x(e.helpText), 11, Eu)) : h("", !0),
+        }, x(e.helpText), 11, zu)) : h("", !0),
         P(ue, {
           "enter-active-class": "transition-all duration-200",
           "enter-from-class": "opacity-0 -translate-y-1",
@@ -6789,13 +6656,13 @@ const ae = {
       ], 2);
     };
   }
-}, Lu = {
+}, Au = {
   key: 0,
   class: "flex items-center px-3 bg-muted border border-r-0 rounded-l-md"
-}, _u = {
+}, Iu = {
   key: 1,
   class: "flex items-center px-3 bg-muted border border-l-0 rounded-r-md"
-}, Ru = {
+}, Pu = {
   __name: "InputGroup",
   props: {
     variant: {
@@ -6818,28 +6685,28 @@ const ae = {
     return (r, l) => (o(), d("div", {
       class: m(n.value)
     }, [
-      r.$slots.prefix ? (o(), d("div", Lu, [
+      r.$slots.prefix ? (o(), d("div", Au, [
         B(r.$slots, "prefix")
       ])) : h("", !0),
       B(r.$slots, "default"),
-      r.$slots.suffix ? (o(), d("div", _u, [
+      r.$slots.suffix ? (o(), d("div", Iu, [
         B(r.$slots, "suffix")
       ])) : h("", !0)
     ], 2));
   }
-}, qu = ["role"], Yu = {
+}, Tu = ["role"], ju = {
   key: 0,
   class: "flex-shrink-0"
-}, Uu = { class: "flex-1 min-w-0" }, Wu = {
+}, Bu = { class: "flex-1 min-w-0" }, Ou = {
   key: 0,
   class: "text-sm font-medium text-foreground"
-}, Hu = {
+}, Vu = {
   key: 1,
   class: "text-sm text-muted-foreground"
-}, Gu = {
+}, Du = {
   key: 1,
   class: "flex-shrink-0"
-}, Ku = {
+}, Mu = {
   __name: "ListItem",
   props: {
     title: String,
@@ -6886,7 +6753,7 @@ const ae = {
         onClick: c
       }, {
         default: E(() => [
-          y.$slots.icon || e.icon ? (o(), d("div", Yu, [
+          y.$slots.icon || e.icon ? (o(), d("div", ju, [
             B(y.$slots, "icon", {}, () => [
               e.icon ? (o(), R(ae, {
                 key: 0,
@@ -6895,23 +6762,23 @@ const ae = {
               }, null, 8, ["name"])) : h("", !0)
             ])
           ])) : h("", !0),
-          i("div", Uu, [
-            e.title ? (o(), d("div", Wu, x(e.title), 1)) : h("", !0),
-            e.description ? (o(), d("div", Hu, x(e.description), 1)) : h("", !0),
+          i("div", Bu, [
+            e.title ? (o(), d("div", Ou, x(e.title), 1)) : h("", !0),
+            e.description ? (o(), d("div", Vu, x(e.description), 1)) : h("", !0),
             B(y.$slots, "default")
           ]),
-          y.$slots.action ? (o(), d("div", Gu, [
+          y.$slots.action ? (o(), d("div", Du, [
             B(y.$slots, "action")
           ])) : h("", !0)
         ]),
         _: 3
       }, 8, ["href", "class"]))
-    ], 10, qu));
+    ], 10, Tu));
   }
-}, Xu = {
+}, Fu = {
   key: 1,
   class: "ml-auto text-xs tracking-widest opacity-60"
-}, Ju = {
+}, Nu = {
   __name: "MenuItem",
   props: {
     href: String,
@@ -6956,7 +6823,7 @@ const ae = {
           class: "mr-2 h-4 w-4"
         }, null, 8, ["name"])) : h("", !0),
         B(u.$slots, "default"),
-        e.shortcut ? (o(), d("span", Xu, x(e.shortcut), 1)) : h("", !0),
+        e.shortcut ? (o(), d("span", Fu, x(e.shortcut), 1)) : h("", !0),
         e.hasSubmenu ? (o(), R(ae, {
           key: 2,
           name: "chevron-right",
@@ -7063,26 +6930,26 @@ const ae = {
       })
     ]));
   }
-}, Qu = { class: "flex flex-col space-y-1.5 text-center sm:text-left" }, Zu = {
+}, Eu = { class: "flex flex-col space-y-1.5 text-center sm:text-left" }, Lu = {
   key: 0,
   class: "text-lg font-semibold leading-none tracking-tight"
-}, ed = {
+}, _u = {
   key: 1,
   class: "text-sm text-muted-foreground"
-}, td = {
+}, Ru = {
   __name: "ModalHeader",
   props: {
     title: String,
     description: String
   },
   setup(e) {
-    return (a, t) => (o(), d("div", Qu, [
-      e.title ? (o(), d("h2", Zu, x(e.title), 1)) : h("", !0),
-      e.description ? (o(), d("p", ed, x(e.description), 1)) : h("", !0),
+    return (a, t) => (o(), d("div", Eu, [
+      e.title ? (o(), d("h2", Lu, x(e.title), 1)) : h("", !0),
+      e.description ? (o(), d("p", _u, x(e.description), 1)) : h("", !0),
       B(a.$slots, "default")
     ]));
   }
-}, ad = {
+}, qu = {
   __name: "ModalBody",
   props: {
     variant: {
@@ -7108,7 +6975,7 @@ const ae = {
       B(r.$slots, "default")
     ], 2));
   }
-}, nd = {
+}, Yu = {
   __name: "ModalFooter",
   props: {
     variant: {
@@ -7134,13 +7001,13 @@ const ae = {
       B(r.$slots, "default")
     ], 2));
   }
-}, rd = ["aria-live"], sd = { class: "flex items-start space-x-3" }, ld = {
+}, Uu = ["aria-live"], Wu = { class: "flex items-start space-x-3" }, Hu = {
   key: 0,
   class: "flex-shrink-0"
-}, od = { class: "flex-1 min-w-0" }, id = {
+}, Gu = { class: "flex-1 min-w-0" }, Ku = {
   key: 0,
   class: "text-sm font-medium"
-}, ud = {
+}, Xu = {
   __name: "Notification",
   props: {
     title: String,
@@ -7216,15 +7083,15 @@ const ae = {
           role: "alert",
           "aria-live": e.variant === "destructive" ? "assertive" : "polite"
         }, [
-          i("div", sd, [
-            e.showIcon ? (o(), d("div", ld, [
+          i("div", Wu, [
+            e.showIcon ? (o(), d("div", Hu, [
               P(ae, {
                 name: y.value,
                 class: m(w.value)
               }, null, 8, ["name", "class"])
             ])) : h("", !0),
-            i("div", od, [
-              e.title ? (o(), d("div", id, x(e.title), 1)) : h("", !0),
+            i("div", Gu, [
+              e.title ? (o(), d("div", Ku, x(e.title), 1)) : h("", !0),
               e.message ? (o(), d("div", {
                 key: 1,
                 class: m(["text-sm", { "mt-1": e.title }])
@@ -7242,23 +7109,23 @@ const ae = {
               })
             ])) : h("", !0)
           ])
-        ], 10, rd)) : h("", !0)
+        ], 10, Uu)) : h("", !0)
       ]),
       _: 3
     }));
   }
 }, Xe = U([]);
-let dd = 0;
-const cd = {
+let Ju = 0;
+const Qu = {
   duration: 3e3,
   position: "top-center",
   dismissible: !0,
   closeButton: !1
-}, fd = () => `toast-${++dd}-${Date.now()}`, Se = (e, a = {}) => {
-  const t = fd(), n = {
+}, Zu = () => `toast-${++Ju}-${Date.now()}`, Se = (e, a = {}) => {
+  const t = Zu(), n = {
     id: t,
     message: e,
-    ...cd,
+    ...Qu,
     ...a,
     createdAt: Date.now()
   };
@@ -7318,20 +7185,20 @@ const cd = {
       component: Ka(e)
     })
   }
-), md = () => ({
+), ed = () => ({
   toasts: Xe,
   dismiss: Ge,
   dismissAll: rr
-}), gd = ["aria-live"], vd = { class: "flex-1 grid gap-1" }, bd = {
+}), td = ["aria-live"], ad = { class: "flex-1 grid gap-1" }, nd = {
   key: 0,
   class: "text-lg font-extrabold"
-}, hd = {
+}, rd = {
   key: 1,
   class: "text-md opacity-90"
-}, yd = {
+}, sd = {
   key: 2,
   class: "text-md opacity-90"
-}, pd = ["onClick"], xd = ["onClick"], wd = {
+}, ld = ["onClick"], od = ["onClick"], id = {
   __name: "Toast",
   props: {
     position: {
@@ -7368,7 +7235,7 @@ const cd = {
     }
   },
   setup(e) {
-    const a = e, { toasts: t, dismiss: n } = md(), r = {
+    const a = e, { toasts: t, dismiss: n } = ed(), r = {
       "top-left": "top-0 left-0 flex-col",
       "top-center": "top-0 left-1/2 -translate-x-1/2 flex-col",
       "top-right": "top-0 right-0 flex-col",
@@ -7440,10 +7307,10 @@ const cd = {
                 icon: w(b),
                 class: m([C(b), "h-4 w-4 shrink-0"])
               }, null, 8, ["icon", "class"])) : h("", !0),
-              i("div", vd, [
-                b.title ? (o(), d("div", bd, x(b.title), 1)) : h("", !0),
-                b.message ? (o(), d("div", hd, x(b.message), 1)) : h("", !0),
-                b.description ? (o(), d("div", yd, x(b.description), 1)) : h("", !0),
+              i("div", ad, [
+                b.title ? (o(), d("div", nd, x(b.title), 1)) : h("", !0),
+                b.message ? (o(), d("div", rd, x(b.message), 1)) : h("", !0),
+                b.description ? (o(), d("div", sd, x(b.description), 1)) : h("", !0),
                 b.component ? (o(), R(ve(b.component), Le({
                   key: 3,
                   ref_for: !0
@@ -7453,7 +7320,7 @@ const cd = {
                 key: 1,
                 class: "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-xs font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
                 onClick: b.action.onClick
-              }, x(b.action.label), 9, pd)) : h("", !0),
+              }, x(b.action.label), 9, ld)) : h("", !0),
               $(b) ? (o(), d("button", {
                 key: 2,
                 class: "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100",
@@ -7463,36 +7330,36 @@ const cd = {
                   icon: "x",
                   class: "h-4 w-4"
                 })
-              ], 8, xd)) : h("", !0)
-            ], 10, gd))), 128))
+              ], 8, od)) : h("", !0)
+            ], 10, td))), 128))
           ]),
           _: 1
         })
       ], 2)
     ]));
   }
-}, kd = { class: "relative" }, Sd = { class: "absolute left-3 top-1/2 transform -translate-y-1/2 pointer-events-none" }, Cd = ["value", "placeholder", "disabled"], $d = {
+}, ud = { class: "relative" }, dd = { class: "absolute left-3 top-1/2 transform -translate-y-1/2 pointer-events-none" }, cd = ["value", "placeholder", "disabled"], fd = {
   key: 0,
   class: "absolute right-3 top-1/2 transform -translate-y-1/2"
-}, zd = ["aria-label"], Ad = {
+}, md = ["aria-label"], gd = {
   key: 1,
   class: "animate-spin"
-}, Id = {
+}, vd = {
   key: 0,
   class: "max-h-64 overflow-y-auto"
-}, Pd = ["onClick", "onMouseenter"], Td = { class: "flex-1 text-left" }, jd = { class: "font-medium text-slate-900" }, Bd = {
+}, bd = ["onClick", "onMouseenter"], hd = { class: "flex-1 text-left" }, yd = { class: "font-medium text-slate-900" }, pd = {
   key: 0,
   class: "text-sm text-slate-500 truncate"
-}, Od = {
+}, xd = {
   key: 1,
   class: "text-xs text-slate-400 ml-3"
-}, Vd = {
+}, wd = {
   key: 1,
   class: "px-4 py-3 text-sm text-slate-500 text-center"
-}, Dd = {
+}, kd = {
   key: 2,
   class: "border-t border-slate-200 p-2"
-}, Md = {
+}, Sd = {
   __name: "Search",
   props: {
     modelValue: { type: String, default: "" },
@@ -7606,8 +7473,8 @@ const cd = {
       ref: u,
       class: "relative"
     }, [
-      i("div", kd, [
-        i("div", Sd, [
+      i("div", ud, [
+        i("div", dd, [
           P(t, {
             class: m(ne.value)
           }, null, 8, ["class"])
@@ -7623,8 +7490,8 @@ const cd = {
           onFocus: $,
           onBlur: z,
           onKeydown: f
-        }, null, 42, Cd),
-        e.modelValue || e.loading ? (o(), d("div", $d, [
+        }, null, 42, cd),
+        e.modelValue || e.loading ? (o(), d("div", fd, [
           !e.loading && e.clearable ? (o(), d("button", {
             key: 0,
             class: "text-slate-400 hover:text-slate-600 transition-colors p-1 rounded-full hover:bg-slate-100",
@@ -7632,7 +7499,7 @@ const cd = {
             onClick: g
           }, [
             P(n, { class: "w-4 h-4" })
-          ], 8, zd)) : e.loading ? (o(), d("div", Ad, [
+          ], 8, md)) : e.loading ? (o(), d("div", gd, [
             P(r, { class: "w-4 h-4 text-slate-400" })
           ])) : h("", !0)
         ])) : h("", !0)
@@ -7650,7 +7517,7 @@ const cd = {
             key: 0,
             class: m(q.value)
           }, [
-            e.results.length > 0 ? (o(), d("div", Id, [
+            e.results.length > 0 ? (o(), d("div", vd, [
               (o(!0), d(K, null, J(e.results, (W, k) => (o(), d("button", {
                 key: W.id || k,
                 class: m(se(k)),
@@ -7661,14 +7528,14 @@ const cd = {
                   key: 0,
                   class: "w-4 h-4 mr-3 flex-shrink-0"
                 })) : h("", !0),
-                i("div", Td, [
-                  i("div", jd, x(p(W.title)), 1),
-                  W.description ? (o(), d("div", Bd, x(p(W.description)), 1)) : h("", !0)
+                i("div", hd, [
+                  i("div", yd, x(p(W.title)), 1),
+                  W.description ? (o(), d("div", pd, x(p(W.description)), 1)) : h("", !0)
                 ]),
-                W.category ? (o(), d("div", Od, x(W.category), 1)) : h("", !0)
-              ], 42, Pd))), 128))
-            ])) : e.showNoResults ? (o(), d("div", Vd, x(e.noResultsText), 1)) : h("", !0),
-            L.$slots.footer ? (o(), d("div", Dd, [
+                W.category ? (o(), d("div", xd, x(W.category), 1)) : h("", !0)
+              ], 42, bd))), 128))
+            ])) : e.showNoResults ? (o(), d("div", wd, x(e.noResultsText), 1)) : h("", !0),
+            L.$slots.footer ? (o(), d("div", kd, [
               B(L.$slots, "footer")
             ])) : h("", !0)
           ], 2)) : h("", !0)
@@ -7677,7 +7544,7 @@ const cd = {
       })
     ], 512));
   }
-}, Fd = { class: "w-full" }, Nd = ["min", "max", "step", "value"], Ed = { class: "flex justify-between text-xs text-slate-500 mt-1" }, sr = {
+}, Cd = { class: "w-full" }, $d = ["min", "max", "step", "value"], zd = { class: "flex justify-between text-xs text-slate-500 mt-1" }, sr = {
   __name: "Slider",
   props: {
     modelValue: { type: [Number, String], default: 0 },
@@ -7690,7 +7557,7 @@ const cd = {
     const t = a, n = (r) => {
       t("update:modelValue", Number(r.target.value));
     };
-    return (r, l) => (o(), d("div", Fd, [
+    return (r, l) => (o(), d("div", Cd, [
       i("input", {
         type: "range",
         min: e.min,
@@ -7699,25 +7566,25 @@ const cd = {
         value: e.modelValue,
         class: "w-full accent-blue-500 cursor-pointer",
         onInput: n
-      }, null, 40, Nd),
-      i("div", Ed, [
+      }, null, 40, $d),
+      i("div", zd, [
         i("span", null, x(e.min), 1),
         i("span", null, x(e.modelValue), 1),
         i("span", null, x(e.max), 1)
       ])
     ]));
   }
-}, Ld = { class: "flex items-center space-x-4" }, _d = {
+}, Ad = { class: "flex items-center space-x-4" }, Id = {
   __name: "Stepper",
   setup(e) {
-    return (a, t) => (o(), d("div", Ld, [
+    return (a, t) => (o(), d("div", Ad, [
       B(a.$slots, "default")
     ]));
   }
-}, Rd = { class: "flex items-center" }, qd = { class: "ml-2" }, Yd = { class: "font-medium" }, Ud = {
+}, Pd = { class: "flex items-center" }, Td = { class: "ml-2" }, jd = { class: "font-medium" }, Bd = {
   key: 0,
   class: "text-sm text-slate-400"
-}, Wd = {
+}, Od = {
   __name: "StepperItem",
   props: {
     step: { type: Number, required: !0 },
@@ -7727,7 +7594,7 @@ const cd = {
     completed: { type: Boolean, default: !1 }
   },
   setup(e) {
-    return (a, t) => (o(), d("div", Rd, [
+    return (a, t) => (o(), d("div", Pd, [
       i("div", {
         class: m([
           "flex items-center justify-center w-8 h-8 rounded-full border-2",
@@ -7736,16 +7603,16 @@ const cd = {
       }, [
         i("span", null, x(e.step), 1)
       ], 2),
-      i("div", qd, [
-        i("div", Yd, x(e.title), 1),
-        e.description ? (o(), d("div", Ud, x(e.description), 1)) : h("", !0)
+      i("div", Td, [
+        i("div", jd, x(e.title), 1),
+        e.description ? (o(), d("div", Bd, x(e.description), 1)) : h("", !0)
       ])
     ]));
   }
-}, Hd = { class: "w-full" }, Gd = {
+}, Vd = { class: "w-full" }, Dd = {
   class: "flex space-x-1 border-b border-slate-200",
   role: "tablist"
-}, Kd = ["id", "disabled", "aria-selected", "aria-controls", "onClick"], Xd = { class: "mt-4" }, Jd = {
+}, Md = ["id", "disabled", "aria-selected", "aria-controls", "onClick"], Fd = { class: "mt-4" }, Nd = {
   __name: "Tab",
   props: {
     defaultIndex: { type: Number, default: 0 },
@@ -7783,8 +7650,8 @@ const cd = {
       unregisterTab: (c) => {
         l.value.splice(c, 1);
       }
-    }), (c, y) => (o(), d("div", Hd, [
-      i("div", Gd, [
+    }), (c, y) => (o(), d("div", Vd, [
+      i("div", Dd, [
         (o(!0), d(K, null, J(l.value, (w, C) => (o(), d("button", {
           id: `tab-${C}`,
           key: C,
@@ -7798,17 +7665,17 @@ const cd = {
           "aria-controls": `panel-${C}`,
           role: "tab",
           onClick: (D) => !t.loading && s(C)
-        }, x(w.label), 11, Kd))), 128))
+        }, x(w.label), 11, Md))), 128))
       ]),
-      i("div", Xd, [
+      i("div", Fd, [
         B(c.$slots, "default")
       ])
     ]));
   }
-}, Qd = ["id", "aria-labelledby"], Zd = {
+}, Ed = ["id", "aria-labelledby"], Ld = {
   key: 0,
   class: "flex items-center justify-center p-8"
-}, ec = {
+}, _d = {
   __name: "TabPanel",
   props: {
     label: { type: String, required: !0 },
@@ -7830,17 +7697,17 @@ const cd = {
       role: "tabpanel",
       "aria-labelledby": `tab-${n.value}`
     }, [
-      e.loading ? (o(), d("div", Zd, [
+      e.loading ? (o(), d("div", Ld, [
         P(ua, {
           size: "lg",
           label: `Loading ${a.label}`
         }, null, 8, ["label"])
       ])) : B(l.$slots, "default", { key: 1 })
-    ], 8, Qd)), [
+    ], 8, Ed)), [
       [Ja, r.value]
     ]);
   }
-}, tc = ["id", "aria-expanded", "aria-controls", "onClick"], ac = { class: "flex items-center flex-1 min-w-0" }, nc = { key: 0 }, rc = ["id", "aria-labelledby"], sc = { key: 0 }, lc = {
+}, Rd = ["id", "aria-expanded", "aria-controls", "onClick"], qd = { class: "flex items-center flex-1 min-w-0" }, Yd = { key: 0 }, Ud = ["id", "aria-labelledby"], Wd = { key: 0 }, Hd = {
   __name: "Accordion",
   props: {
     items: {
@@ -7967,13 +7834,13 @@ const cd = {
           "aria-controls": `panel-${j.id || A}`,
           onClick: (ne) => s(A)
         }, [
-          i("div", ac, [
+          i("div", qd, [
             B(p.$slots, `header-${A}`, {
               item: j,
               index: A,
               isExpanded: u(A)
             }, () => [
-              j.title ? (o(), d("div", nc, x(j.title), 1)) : h("", !0)
+              j.title ? (o(), d("div", Yd, x(j.title), 1)) : h("", !0)
             ])
           ]),
           i("div", {
@@ -7981,7 +7848,7 @@ const cd = {
           }, [
             P(t, { class: "w-5 h-5 transition-transform duration-200" })
           ], 2)
-        ], 10, tc),
+        ], 10, Rd),
         P(ue, {
           "enter-active-class": "transition-all duration-300 ease-out",
           "enter-from-class": "opacity-0 max-h-0",
@@ -8006,17 +7873,17 @@ const cd = {
                   item: j,
                   index: A
                 }, () => [
-                  j.content ? (o(), d("div", sc, x(j.content), 1)) : h("", !0)
+                  j.content ? (o(), d("div", Wd, x(j.content), 1)) : h("", !0)
                 ])
               ])
-            ], 10, rc)) : h("", !0)
+            ], 10, Ud)) : h("", !0)
           ]),
           _: 2
         }, 1024)
       ], 2))), 128))
     ], 2));
   }
-}, oc = {
+}, Gd = {
   __name: "AccordionItem",
   props: {
     variant: {
@@ -8108,10 +7975,10 @@ const cd = {
       })
     ], 2));
   }
-}, ic = { class: "relative w-full" }, uc = { class: "relative" }, dc = ["id", "value", "disabled", "placeholder", "required", "aria-describedby"], cc = { class: "flex items-center justify-between mb-3" }, fc = { class: "text-sm font-medium" }, mc = { class: "grid grid-cols-7 gap-1 mb-2" }, gc = { class: "grid grid-cols-7 gap-1" }, vc = ["disabled", "onClick"], bc = {
+}, Kd = { class: "relative w-full" }, Xd = { class: "relative" }, Jd = ["id", "value", "disabled", "placeholder", "required", "aria-describedby"], Qd = { class: "flex items-center justify-between mb-3" }, Zd = { class: "text-sm font-medium" }, ec = { class: "grid grid-cols-7 gap-1 mb-2" }, tc = { class: "grid grid-cols-7 gap-1" }, ac = ["disabled", "onClick"], nc = {
   key: 0,
   class: "mt-4 pt-3 border-t border-slate-200"
-}, hc = {
+}, rc = {
   __name: "Calendar",
   props: {
     id: String,
@@ -8220,8 +8087,8 @@ const cd = {
       document.addEventListener("keydown", Z);
     }), Ha(() => {
       document.removeEventListener("keydown", Z);
-    }), (W, k) => (o(), d("div", ic, [
-      i("div", uc, [
+    }), (W, k) => (o(), d("div", Kd, [
+      i("div", Xd, [
         i("input", {
           id: e.id,
           type: "text",
@@ -8233,7 +8100,7 @@ const cd = {
           "aria-describedby": e.ariaDescribedby,
           class: "w-full px-3 py-2 pr-10 border border-slate-300 rounded-md bg-white text-slate-900 placeholder-slate-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 cursor-pointer disabled:bg-slate-50 disabled:text-slate-500 disabled:cursor-not-allowed",
           onClick: j
-        }, null, 8, dc),
+        }, null, 8, Jd),
         k[2] || (k[2] = i("div", { class: "absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none" }, [
           i("svg", {
             class: "w-5 h-5 text-slate-400",
@@ -8286,7 +8153,7 @@ const cd = {
             onClick: k[0] || (k[0] = Ve(() => {
             }, ["stop"]))
           }, [
-            i("div", cc, [
+            i("div", Qd, [
               i("button", {
                 type: "button",
                 class: "p-1 hover:bg-gray-100 rounded",
@@ -8307,7 +8174,7 @@ const cd = {
                   })
                 ], -1)
               ])]),
-              i("div", fc, x(w.value) + " " + x(u.value), 1),
+              i("div", Zd, x(w.value) + " " + x(u.value), 1),
               i("button", {
                 type: "button",
                 class: "p-1 hover:bg-gray-100 rounded",
@@ -8329,13 +8196,13 @@ const cd = {
                 ], -1)
               ])])
             ]),
-            i("div", mc, [
+            i("div", ec, [
               (o(), d(K, null, J(y, (T) => i("div", {
                 key: T,
                 class: "text-center text-xs font-medium text-slate-600 py-1"
               }, x(T), 1)), 64))
             ]),
-            i("div", gc, [
+            i("div", tc, [
               (o(!0), d(K, null, J($.value, (T, _) => (o(), d("div", {
                 key: "prev-" + _,
                 class: "text-center text-sm text-slate-300 py-2"
@@ -8350,13 +8217,13 @@ const cd = {
                   V(T) ? "text-gray-300 cursor-not-allowed" : ""
                 ]),
                 onClick: (_) => se(T)
-              }, x(T), 11, vc))), 128)),
+              }, x(T), 11, ac))), 128)),
               (o(!0), d(K, null, J(z.value, (T, _) => (o(), d("div", {
                 key: "next-" + _,
                 class: "text-center text-sm text-slate-300 py-2"
               }, x(T), 1))), 128))
             ]),
-            e.showToday ? (o(), d("div", bc, [
+            e.showToday ? (o(), d("div", nc, [
               i("button", {
                 type: "button",
                 class: "w-full px-3 py-2 text-sm font-medium text-blue-600 hover:bg-blue-50 rounded-lg transition-colors",
@@ -8374,7 +8241,7 @@ const cd = {
       })) : h("", !0)
     ]));
   }
-}, yc = { class: "flex items-start justify-between" }, pc = {
+}, sc = { class: "flex items-start justify-between" }, lc = {
   key: 0,
   class: "flex items-center gap-2"
 }, lr = {
@@ -8454,7 +8321,7 @@ const cd = {
       class: m(l.value)
     }, [
       B(c.$slots, "header", {}, () => [
-        i("div", yc, [
+        i("div", sc, [
           i("div", null, [
             e.title ? (o(), R(Yt, {
               key: 0,
@@ -8475,7 +8342,7 @@ const cd = {
               _: 1
             }, 8, ["class"])) : h("", !0)
           ]),
-          c.$slots.filters ? (o(), d("div", pc, [
+          c.$slots.filters ? (o(), d("div", lc, [
             B(c.$slots, "filters")
           ])) : h("", !0)
         ])
@@ -8661,19 +8528,19 @@ const cd = {
       ], 2)) : h("", !0)
     ], 2));
   }
-}, xc = { class: "flex items-center justify-between" }, wc = {
+}, oc = { class: "flex items-center justify-between" }, ic = {
   key: 0,
   class: "text-sm text-slate-600"
-}, kc = {
+}, uc = {
   key: 1,
   class: "text-sm text-slate-600"
-}, Sc = {
+}, dc = {
   key: 2,
   class: "flex items-center gap-4"
-}, Cc = {
+}, cc = {
   key: 3,
   class: "flex items-center gap-4"
-}, $c = { class: "flex items-center gap-2" }, zc = { class: "flex items-center gap-1" }, Ac = ["disabled"], Ic = ["disabled"], Pc = { class: "flex items-center gap-1" }, Tc = ["onClick"], jc = ["disabled"], Bc = ["disabled"], Oc = { class: "text-sm text-slate-600 ml-4" }, ir = {
+}, fc = { class: "flex items-center gap-2" }, mc = { class: "flex items-center gap-1" }, gc = ["disabled"], vc = ["disabled"], bc = { class: "flex items-center gap-1" }, hc = ["onClick"], yc = ["disabled"], pc = ["disabled"], xc = { class: "text-sm text-slate-600 ml-4" }, ir = {
   __name: "DataTablePagination",
   props: {
     currentPage: {
@@ -8814,13 +8681,13 @@ const cd = {
       key: 0,
       class: m(y.value)
     }, [
-      i("div", xc, [
-        e.selectable && e.selectedCount > 0 ? (o(), d("div", wc, x(e.selectedCount) + " of " + x(e.total) + " selected ", 1)) : (o(), d("div", kc, " Showing " + x(s.value) + " to " + x(u.value) + " of " + x(e.total) + " entries ", 1)),
-        $.$slots.footer ? (o(), d("div", Sc, [
+      i("div", oc, [
+        e.selectable && e.selectedCount > 0 ? (o(), d("div", ic, x(e.selectedCount) + " of " + x(e.total) + " selected ", 1)) : (o(), d("div", uc, " Showing " + x(s.value) + " to " + x(u.value) + " of " + x(e.total) + " entries ", 1)),
+        $.$slots.footer ? (o(), d("div", dc, [
           B($.$slots, "footer")
         ])) : h("", !0),
-        e.showPagination ? (o(), d("div", Cc, [
-          i("div", $c, [
+        e.showPagination ? (o(), d("div", cc, [
+          i("div", fc, [
             P(da, {
               for: "pageSize",
               class: m(w.value),
@@ -8847,7 +8714,7 @@ const cd = {
               _: 1
             }, 8, ["model-value", "class"])
           ]),
-          i("div", zc, [
+          i("div", mc, [
             i("button", {
               disabled: e.currentPage === 1,
               class: m(D(!1, e.currentPage === 1)),
@@ -8867,7 +8734,7 @@ const cd = {
                   d: "m18.75 4.5-7.5 7.5 7.5 7.5m-6-15L5.25 12l7.5 7.5"
                 })
               ], -1)
-            ])], 10, Ac),
+            ])], 10, gc),
             i("button", {
               disabled: e.currentPage === 1,
               class: m(D(!1, e.currentPage === 1)),
@@ -8887,13 +8754,13 @@ const cd = {
                   d: "M15.75 19.5L8.25 12l7.5-7.5"
                 })
               ], -1)
-            ])], 10, Ic),
-            i("div", Pc, [
+            ])], 10, vc),
+            i("div", bc, [
               (o(!0), d(K, null, J(c.value, (g) => (o(), d("button", {
                 key: g,
                 class: m(D(g === e.currentPage, !1)),
                 onClick: (b) => $.$emit("update:currentPage", g)
-              }, x(g), 11, Tc))), 128))
+              }, x(g), 11, hc))), 128))
             ]),
             i("button", {
               disabled: e.currentPage === e.totalPages,
@@ -8914,7 +8781,7 @@ const cd = {
                   d: "m8.25 4.5 7.5 7.5-7.5 7.5"
                 })
               ], -1)
-            ])], 10, jc),
+            ])], 10, yc),
             i("button", {
               disabled: e.currentPage === e.totalPages,
               class: m(D(!1, e.currentPage === e.totalPages)),
@@ -8934,17 +8801,22 @@ const cd = {
                   d: "m5.25 4.5 7.5 7.5-7.5 7.5m6-15 7.5 7.5-7.5 7.5"
                 })
               ], -1)
-            ])], 10, Bc)
+            ])], 10, pc)
           ]),
-          i("div", Oc, " Page " + x(e.currentPage) + " of " + x(e.totalPages), 1)
+          i("div", xc, " Page " + x(e.currentPage) + " of " + x(e.totalPages), 1)
         ])) : h("", !0)
       ])
     ], 2)) : h("", !0);
   }
-}, Vc = { class: "relative" }, Dc = { class: "flex items-center justify-center" }, Mc = ["onClick"], Fc = { class: "flex items-center gap-2" }, Nc = {
+}, yt = (e, a) => {
+  const t = e.__vccOpts || e;
+  for (const [n, r] of a)
+    t[n] = r;
+  return t;
+}, wc = { class: "relative" }, kc = { class: "flex items-center justify-center" }, Sc = ["onClick"], Cc = { class: "flex items-center gap-2" }, $c = {
   key: 1,
   class: "flex flex-col"
-}, Ec = { key: 0 }, Lc = ["colspan"], _c = { class: "flex justify-center items-center" }, Rc = { key: 2 }, qc = ["colspan"], Yc = { class: "text-center" }, Uc = { class: "text-slate-400 mb-4" }, Wc = { class: "text-slate-600 text-lg font-medium mb-2" }, Hc = {
+}, zc = { key: 0 }, Ac = ["colspan"], Ic = { class: "flex justify-center items-center" }, Pc = { key: 2 }, Tc = ["colspan"], jc = { class: "text-center" }, Bc = { class: "text-slate-400 mb-4" }, Oc = { class: "text-slate-600 text-lg font-medium mb-2" }, Vc = {
   __name: "DataTable",
   props: {
     data: {
@@ -9274,8 +9146,8 @@ const cd = {
         ]),
         _: 3
       }, 8, ["title", "description", "variant", "padding"])) : h("", !0),
-      i("div", Vc, [
-        e.loading ? (o(), R(Ye, {
+      i("div", wc, [
+        e.loading ? (o(), R(N(Ye), {
           key: 0,
           loading: !0,
           type: e.loadingType,
@@ -9301,8 +9173,8 @@ const cd = {
                   key: 0,
                   class: m(he.value)
                 }, [
-                  i("div", Dc, [
-                    e.bulkLoading ? (o(), R(Ye, {
+                  i("div", kc, [
+                    e.bulkLoading ? (o(), R(N(Ye), {
                       key: 0,
                       loading: !0,
                       type: "spin",
@@ -9322,15 +9194,15 @@ const cd = {
                   class: m(re(Q)),
                   onClick: (ge) => se(Q)
                 }, [
-                  i("div", Fc, [
+                  i("div", Cc, [
                     i("span", null, x(Q.label), 1),
-                    e.sortLoading && u.value === Q.key ? (o(), R(Ye, {
+                    e.sortLoading && u.value === Q.key ? (o(), R(N(Ye), {
                       key: 0,
                       loading: !0,
                       type: "spin",
                       size: "small",
                       color: e.loadingColor
-                    }, null, 8, ["color"])) : Q.sortable ? (o(), d("div", Nc, [
+                    }, null, 8, ["color"])) : Q.sortable ? (o(), d("div", $c, [
                       (o(), d("svg", {
                         class: m([Y(Q, "asc"), "w-3 h-3 transition-colors"]),
                         fill: "none",
@@ -9359,7 +9231,7 @@ const cd = {
                       ])], 2))
                     ])) : h("", !0)
                   ])
-                ], 10, Mc))), 128)),
+                ], 10, Sc))), 128)),
                 I.$slots.actions ? (o(), d("th", {
                   key: 1,
                   class: m(et.value)
@@ -9369,20 +9241,20 @@ const cd = {
             i("tbody", {
               class: m(_.value)
             }, [
-              e.dataLoading && !e.loading ? (o(), d("tr", Ec, [
+              e.dataLoading && !e.loading ? (o(), d("tr", zc, [
                 i("td", {
                   colspan: b.value,
                   class: m(X.value)
                 }, [
-                  i("div", _c, [
-                    P(Ye, {
+                  i("div", Ic, [
+                    P(N(Ye), {
                       loading: !0,
                       type: "dots",
                       size: "medium",
                       color: e.loadingColor
                     }, null, 8, ["color"])
                   ])
-                ], 10, Lc)
+                ], 10, Ac)
               ])) : g.value.length > 0 && !e.loading ? (o(!0), d(K, { key: 1 }, J(g.value, (Q, ge) => (o(), R(or, {
                 key: j(Q, ge),
                 item: Q,
@@ -9410,24 +9282,24 @@ const cd = {
                     B(I.$slots, `cell-${Be.key}`, Le({ ref_for: !0 }, tt), void 0, !0)
                   ])
                 }))
-              ]), 1032, ["item", "columns", "index", "selectable", "is-selected", "striped", "hoverable", "clickable-rows", "density", "row-loading", "loading-color"]))), 128)) : !e.loading && !e.dataLoading && e.hasLoaded ? (o(), d("tr", Rc, [
+              ]), 1032, ["item", "columns", "index", "selectable", "is-selected", "striped", "hoverable", "clickable-rows", "density", "row-loading", "loading-color"]))), 128)) : !e.loading && !e.dataLoading && e.hasLoaded ? (o(), d("tr", Pc, [
                 i("td", {
                   colspan: b.value,
                   class: m(X.value)
                 }, [
                   B(I.$slots, "empty", {}, () => [
-                    i("div", Yc, [
-                      i("div", Uc, [
+                    i("div", jc, [
+                      i("div", Bc, [
                         P(ae, {
                           name: "search",
                           class: "w-12 h-12"
                         })
                       ]),
-                      i("p", Wc, x(e.emptyText), 1),
+                      i("p", Oc, x(e.emptyText), 1),
                       F[2] || (F[2] = i("p", { class: "text-slate-500 text-sm" }, " Try adjusting your search or filter criteria ", -1))
                     ])
                   ], !0)
-                ], 10, qc)
+                ], 10, Tc)
               ])) : h("", !0),
               e.showSkeleton && (e.loading || e.dataLoading) ? (o(!0), d(K, { key: 3 }, J(e.skeletonRows, (Q) => (o(), d("tr", {
                 key: `skeleton-${Q}`,
@@ -9482,7 +9354,7 @@ const cd = {
       }, 8, ["current-page", "total-pages", "total", "page-size", "show-pagination", "selectable", "selected-count", "variant", "padding", "loading", "disabled"])) : h("", !0)
     ], 2));
   }
-}, Gc = /* @__PURE__ */ yt(Hc, [["__scopeId", "data-v-788cdc84"]]), Kc = {
+}, Dc = /* @__PURE__ */ yt(Vc, [["__scopeId", "data-v-1d159ea7"]]), Mc = {
   __name: "DataTableCell",
   props: {
     item: {
@@ -9570,16 +9442,16 @@ const cd = {
       ])
     ], 2));
   }
-}, Xc = { class: "bg-white border-b border-gray-200" }, Jc = { class: "flex-1 min-w-80 max-w-md" }, Qc = { class: "relative group" }, Zc = ["model-value", "placeholder"], ef = {
+}, Fc = { class: "bg-white border-b border-gray-200" }, Nc = { class: "flex-1 min-w-80 max-w-md" }, Ec = { class: "relative group" }, Lc = ["model-value", "placeholder"], _c = {
   key: 0,
   class: "min-w-36"
-}, tf = { class: "relative" }, af = ["value"], nf = {
+}, Rc = { class: "relative" }, qc = ["value"], Yc = {
   key: 1,
   class: "flex items-center gap-2"
-}, rf = { class: "flex items-center gap-3 ml-auto" }, sf = { class: "grid grid-cols-1 lg:grid-cols-3 gap-6" }, lf = { class: "flex items-center justify-between" }, of = { class: "flex items-center gap-3" }, uf = { class: "relative flex-1" }, df = ["model-value", "placeholder", "onInput"], cf = { class: "relative flex-1" }, ff = ["model-value", "placeholder", "onInput"], mf = ["onClick"], gf = { class: "flex items-center gap-3 flex-wrap" }, vf = ["onClick"], bf = {
+}, Uc = { class: "flex items-center gap-3 ml-auto" }, Wc = { class: "grid grid-cols-1 lg:grid-cols-3 gap-6" }, Hc = { class: "flex items-center justify-between" }, Gc = { class: "flex items-center gap-3" }, Kc = { class: "relative flex-1" }, Xc = ["model-value", "placeholder", "onInput"], Jc = { class: "relative flex-1" }, Qc = ["model-value", "placeholder", "onInput"], Zc = ["onClick"], ef = { class: "flex items-center gap-3 flex-wrap" }, tf = ["onClick"], af = {
   key: 2,
   class: "px-6 py-3 bg-gray-50 border-t border-gray-200"
-}, hf = { class: "flex items-center justify-between" }, yf = { class: "flex items-center gap-4" }, pf = { class: "text-sm text-gray-600" }, xf = { class: "font-medium" }, wf = {
+}, nf = { class: "flex items-center justify-between" }, rf = { class: "flex items-center gap-4" }, sf = { class: "text-sm text-gray-600" }, lf = { class: "font-medium" }, of = {
   __name: "DataTableFilters",
   props: {
     searchQuery: {
@@ -9847,12 +9719,12 @@ const cd = {
     };
     return (X, Y) => {
       const I = ie("font-awesome-icon");
-      return o(), d("div", Xc, [
+      return o(), d("div", Fc, [
         i("div", {
           class: m(b.value)
         }, [
-          i("div", Jc, [
-            i("div", Qc, [
+          i("div", Nc, [
+            i("div", Ec, [
               P(I, {
                 icon: "magnifying-glass",
                 class: m(f.value)
@@ -9862,7 +9734,7 @@ const cd = {
                 placeholder: e.searchPlaceholder,
                 class: m(p.value),
                 onInput: Y[0] || (Y[0] = (F) => X.$emit("update:searchQuery", F.target.value))
-              }, null, 42, Zc),
+              }, null, 42, Lc),
               e.searchQuery ? (o(), d("button", {
                 key: 0,
                 class: m(V.value),
@@ -9875,8 +9747,8 @@ const cd = {
               ], 2)) : h("", !0)
             ])
           ]),
-          e.statusOptions.length > 0 ? (o(), d("div", ef, [
-            i("div", tf, [
+          e.statusOptions.length > 0 ? (o(), d("div", _c, [
+            i("div", Rc, [
               P(ht, {
                 "model-value": e.selectedStatus,
                 class: m(j.value),
@@ -9887,7 +9759,7 @@ const cd = {
                   (o(!0), d(K, null, J(e.statusOptions, (F) => (o(), d("option", {
                     key: F.value,
                     value: F.value
-                  }, x(F.label), 9, af))), 128))
+                  }, x(F.label), 9, qc))), 128))
                 ]),
                 _: 1
               }, 8, ["model-value", "class"]),
@@ -9915,10 +9787,10 @@ const cd = {
               class: "w-4 h-4 ml-1"
             }, null, 8, ["icon"])
           ], 2),
-          X.$slots.filters ? (o(), d("div", nf, [
+          X.$slots.filters ? (o(), d("div", Yc, [
             B(X.$slots, "filters")
           ])) : h("", !0),
-          i("div", rf, [
+          i("div", Uc, [
             $.value ? (o(), R(Ce, {
               key: 0,
               class: m(W.value),
@@ -9970,12 +9842,12 @@ const cd = {
           key: 0,
           class: m(q.value)
         }, [
-          i("div", sf, [
+          i("div", Wc, [
             (o(!0), d(K, null, J(e.dateFilters, (F) => (o(), d("div", {
               key: F.key,
               class: "space-y-3"
             }, [
-              i("div", lf, [
+              i("div", Hc, [
                 i("label", {
                   class: m(oe.value)
                 }, x(F.label), 3),
@@ -9983,8 +9855,8 @@ const cd = {
                   class: m(w(F))
                 }, x(c(F) ? "Active" : "Inactive"), 3)
               ]),
-              i("div", of, [
-                i("div", uf, [
+              i("div", Gc, [
+                i("div", Kc, [
                   P(I, {
                     icon: "calendar",
                     class: "absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-gray-400"
@@ -9995,12 +9867,12 @@ const cd = {
                     class: m(se.value),
                     placeholder: `From ${F.label}`,
                     onInput: (Q) => D(F.key, "from", Q.target.value)
-                  }, null, 42, df)
+                  }, null, 42, Xc)
                 ]),
                 i("span", {
                   class: m(L.value)
                 }, "to", 2),
-                i("div", cf, [
+                i("div", Jc, [
                   P(I, {
                     icon: "calendar",
                     class: "absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-gray-400"
@@ -10011,7 +9883,7 @@ const cd = {
                     class: m(se.value),
                     placeholder: `To ${F.label}`,
                     onInput: (Q) => D(F.key, "to", Q.target.value)
-                  }, null, 42, ff)
+                  }, null, 42, Qc)
                 ]),
                 c(F) ? (o(), d("button", {
                   key: 0,
@@ -10023,7 +9895,7 @@ const cd = {
                     icon: "xmark",
                     class: "w-4 h-4"
                   })
-                ], 10, mf)) : h("", !0)
+                ], 10, Zc)) : h("", !0)
               ])
             ]))), 128))
           ])
@@ -10032,7 +9904,7 @@ const cd = {
           key: 1,
           class: m(T.value)
         }, [
-          i("div", gf, [
+          i("div", ef, [
             i("span", {
               class: m(_.value)
             }, "Active filters:", 2),
@@ -10053,15 +9925,15 @@ const cd = {
                   icon: "xmark",
                   class: "w-3 h-3"
                 })
-              ], 10, vf)
+              ], 10, tf)
             ], 2))), 128))
           ])
         ], 2)) : h("", !0),
-        e.showTableInfo ? (o(), d("div", bf, [
-          i("div", hf, [
-            i("div", yf, [
-              i("span", pf, [
-                i("span", xf, x(e.totalItems || 0), 1),
+        e.showTableInfo ? (o(), d("div", af, [
+          i("div", nf, [
+            i("div", rf, [
+              i("span", sf, [
+                i("span", lf, x(e.totalItems || 0), 1),
                 G(" " + x(e.itemLabel || "items") + " found ", 1)
               ])
             ])
@@ -10070,16 +9942,16 @@ const cd = {
       ]);
     };
   }
-}, kf = { class: "flex items-center gap-3" }, Sf = {
+}, uf = { class: "flex items-center gap-3" }, df = {
   key: 0,
   class: "flex items-center gap-3"
-}, Cf = { class: "text-sm text-slate-600" }, $f = { class: "flex items-center gap-2" }, zf = { class: "flex items-center gap-3" }, Af = ["title", "onClick"], If = {
+}, cf = { class: "text-sm text-slate-600" }, ff = { class: "flex items-center gap-2" }, mf = { class: "flex items-center gap-3" }, gf = ["title", "onClick"], vf = {
   key: 1,
   class: "relative"
-}, Pf = { class: "p-3" }, Tf = { class: "space-y-1" }, jf = { class: "flex items-center gap-2 cursor-pointer w-full" }, Bf = ["checked", "onChange"], Of = ["disabled"], Vf = {
+}, bf = { class: "p-3" }, hf = { class: "space-y-1" }, yf = { class: "flex items-center gap-2 cursor-pointer w-full" }, pf = ["checked", "onChange"], xf = ["disabled"], wf = {
   key: 3,
   class: "flex items-center gap-2"
-}, Df = [
+}, kf = [
   {
     key: "delete",
     label: "Delete",
@@ -10096,13 +9968,13 @@ const cd = {
     },
     variant: "primary"
   }
-], Mf = {
+], Sf = {
   name: "DataTableToolBar"
-}, Ff = /* @__PURE__ */ Object.assign(Mf, {
+}, Cf = /* @__PURE__ */ Object.assign(Sf, {
   props: {
     selectedItems: { type: Array, default: () => [] },
     totalItems: { type: Number, default: 0 },
-    bulkActions: { type: Array, default: () => Df },
+    bulkActions: { type: Array, default: () => kf },
     showDensityToggle: { type: Boolean, default: !0 },
     showColumnToggle: { type: Boolean, default: !0 },
     showRefresh: { type: Boolean, default: !0 },
@@ -10228,10 +10100,10 @@ const cd = {
       return o(), d("div", {
         class: m($.value)
       }, [
-        i("div", kf, [
-          u.value > 0 ? (o(), d("div", Sf, [
-            i("span", Cf, x(u.value) + " selected ", 1),
-            i("div", $f, [
+        i("div", uf, [
+          u.value > 0 ? (o(), d("div", df, [
+            i("span", cf, x(u.value) + " selected ", 1),
+            i("div", ff, [
               (o(!0), d(K, null, J(e.bulkActions, (ee) => (o(), R(Ce, {
                 key: ee.key,
                 class: m(se(ee)),
@@ -10253,7 +10125,7 @@ const cd = {
             class: m(z.value)
           }, x(e.totalItems) + " " + x(e.totalItems === 1 ? "item" : "items"), 3)) : h("", !0)
         ]),
-        i("div", zf, [
+        i("div", mf, [
           e.showDensityToggle ? (o(), d("div", {
             key: 0,
             class: m(g.value)
@@ -10269,9 +10141,9 @@ const cd = {
                 icon: ee.icon,
                 class: "w-4 h-4"
               }, null, 8, ["icon"])
-            ], 10, Af)), 64))
+            ], 10, gf)), 64))
           ], 2)) : h("", !0),
-          e.showColumnToggle ? (o(), d("div", If, [
+          e.showColumnToggle ? (o(), d("div", vf, [
             i("button", {
               ref_key: "columnToggleButton",
               ref: l,
@@ -10292,22 +10164,22 @@ const cd = {
               onClick: _[0] || (_[0] = Ve(() => {
               }, ["stop"]))
             }, [
-              i("div", Pf, [
+              i("div", bf, [
                 i("div", {
                   class: m(p.value)
                 }, " Show Columns ", 2),
-                i("div", Tf, [
+                i("div", hf, [
                   (o(!0), d(K, null, J(e.toggleableColumns, (ee) => (o(), d("div", {
                     key: ee.key,
                     class: m(V.value)
                   }, [
-                    i("label", jf, [
+                    i("label", yf, [
                       i("input", {
                         type: "checkbox",
                         checked: W(ee.key),
                         class: m(j.value),
                         onChange: (he) => k(ee.key, he.target.checked)
-                      }, null, 42, Bf),
+                      }, null, 42, pf),
                       i("span", {
                         class: m(A.value)
                       }, x(ee.label), 3)
@@ -10331,15 +10203,15 @@ const cd = {
               class: m(Z())
             }, null, 8, ["class"]),
             _[3] || (_[3] = i("span", null, "Refresh", -1))
-          ], 10, Of)) : h("", !0),
-          T.$slots.actions ? (o(), d("div", Vf, [
+          ], 10, xf)) : h("", !0),
+          T.$slots.actions ? (o(), d("div", wf, [
             B(T.$slots, "actions")
           ])) : h("", !0)
         ])
       ], 2);
     };
   }
-}), Nf = { class: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12" }, Ef = { class: "grid grid-cols-1 md:grid-cols-4 gap-8" }, Lf = { class: "col-span-1 md:col-span-2" }, _f = { class: "space-y-2" }, Rf = { class: "flex space-x-4" }, qf = { class: "flex flex-col md:flex-row justify-between items-center" }, Yf = { class: "flex space-x-6 mt-4 md:mt-0" }, Uf = {
+}), $f = { class: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12" }, zf = { class: "grid grid-cols-1 md:grid-cols-4 gap-8" }, Af = { class: "col-span-1 md:col-span-2" }, If = { class: "space-y-2" }, Pf = { class: "flex space-x-4" }, Tf = { class: "flex flex-col md:flex-row justify-between items-center" }, jf = { class: "flex space-x-6 mt-4 md:mt-0" }, Bf = {
   __name: "Footer",
   props: {
     className: {
@@ -10353,9 +10225,9 @@ const cd = {
       return o(), d("footer", {
         class: m(N(S)("bg-gray-50 border-t border-gray-200", e.className))
       }, [
-        i("div", Nf, [
-          i("div", Ef, [
-            i("div", Lf, [
+        i("div", $f, [
+          i("div", zf, [
+            i("div", Af, [
               B(a.$slots, "brand", {}, () => [
                 P(n, { class: "mb-4" }),
                 P(r, { class: "text-gray-600 max-w-md" }, {
@@ -10377,7 +10249,7 @@ const cd = {
                   ])]),
                   _: 1
                 }),
-                i("div", _f, [
+                i("div", If, [
                   P(s, {
                     href: "#",
                     class: "block text-gray-600 hover:text-gray-900"
@@ -10419,7 +10291,7 @@ const cd = {
                   ])]),
                   _: 1
                 }),
-                i("div", Rf, [
+                i("div", Pf, [
                   P(s, {
                     href: "#",
                     class: "text-gray-600 hover:text-gray-900"
@@ -10449,7 +10321,7 @@ const cd = {
             ])
           ]),
           P(c, { class: "my-8" }),
-          i("div", qf, [
+          i("div", Tf, [
             B(a.$slots, "copyright", {}, () => [
               P(r, { class: "text-gray-600" }, {
                 default: E(() => [
@@ -10459,7 +10331,7 @@ const cd = {
               })
             ]),
             B(a.$slots, "legal", {}, () => [
-              i("div", Yf, [
+              i("div", jf, [
                 P(s, {
                   href: "#",
                   class: "text-gray-600 hover:text-gray-900"
@@ -10485,28 +10357,28 @@ const cd = {
       ], 2);
     };
   }
-}, Wf = { class: "flex items-center justify-between h-16 px-4 md:px-6" }, Hf = { class: "flex items-center" }, Gf = {
+}, Of = { class: "flex items-center justify-between h-16 px-4 md:px-6" }, Vf = { class: "flex items-center" }, Df = {
   key: 0,
   class: "mr-4 flex-shrink-0 bg-gradient-to-r from-blue-50 to-indigo-50 px-3 py-2 rounded-lg border border-blue-100"
-}, Kf = { class: "text-lg font-bold text-blue-900 truncate max-w-[200px]" }, Xf = {
+}, Mf = { class: "text-lg font-bold text-blue-900 truncate max-w-[200px]" }, Ff = {
   key: 0,
   class: "text-xs text-blue-600 truncate font-medium"
-}, Jf = { class: "hidden md:flex items-center space-x-2 text-sm truncate" }, Qf = { class: "text-gray-500 truncate" }, Zf = { class: "text-gray-900 font-medium truncate" }, em = { class: "flex items-center space-x-3 md:space-x-4" }, tm = {
+}, Nf = { class: "hidden md:flex items-center space-x-2 text-sm truncate" }, Ef = { class: "text-gray-500 truncate" }, Lf = { class: "text-gray-900 font-medium truncate" }, _f = { class: "flex items-center space-x-3 md:space-x-4" }, Rf = {
   key: 1,
   class: "relative"
-}, am = {
+}, qf = {
   key: 0,
   class: "absolute -top-1 -right-1 w-4 h-4 bg-red-500 text-white text-xs rounded-full flex items-center justify-center"
-}, nm = {
+}, Yf = {
   key: 0,
   class: "absolute right-4 md:right-6 top-16 mt-2 w-72 md:w-80 bg-white rounded-lg shadow-lg border border-gray-200 z-50"
-}, rm = { class: "max-h-96 overflow-y-auto" }, sm = { class: "flex items-start space-x-3" }, lm = { class: "flex-1" }, om = { class: "text-sm text-gray-900" }, im = { class: "text-xs text-gray-500 mt-1" }, um = { class: "relative" }, dm = { class: "w-8 h-8 bg-gradient-to-br from-blue-100 to-indigo-100 rounded-full flex items-center justify-center transition-colors shadow-sm" }, cm = { class: "text-blue-700 text-sm font-medium" }, fm = { class: "hidden md:block text-left max-w-[160px] truncate" }, mm = { class: "text-sm font-medium text-gray-900 truncate" }, gm = { class: "text-xs text-gray-500 truncate leading-tight" }, vm = {
+}, Uf = { class: "max-h-96 overflow-y-auto" }, Wf = { class: "flex items-start space-x-3" }, Hf = { class: "flex-1" }, Gf = { class: "text-sm text-gray-900" }, Kf = { class: "text-xs text-gray-500 mt-1" }, Xf = { class: "relative" }, Jf = { class: "w-8 h-8 bg-gradient-to-br from-blue-100 to-indigo-100 rounded-full flex items-center justify-center transition-colors shadow-sm" }, Qf = { class: "text-blue-700 text-sm font-medium" }, Zf = { class: "hidden md:block text-left max-w-[160px] truncate" }, em = { class: "text-sm font-medium text-gray-900 truncate" }, tm = { class: "text-xs text-gray-500 truncate leading-tight" }, am = {
   key: 0,
   class: "absolute right-0 mt-2 w-58 bg-white rounded-lg shadow-lg border border-gray-200 z-50"
-}, bm = { class: "p-4 border-b border-gray-200" }, hm = { class: "text-sm font-medium text-gray-900" }, ym = { class: "text-xs text-gray-500" }, pm = { class: "py-2" }, xm = {
+}, nm = { class: "p-4 border-b border-gray-200" }, rm = { class: "text-sm font-medium text-gray-900" }, sm = { class: "text-xs text-gray-500" }, lm = { class: "py-2" }, om = {
   key: 0,
   class: "absolute left-0 top-1/2 transform -translate-y-1/2 w-1 h-8 bg-gradient-to-b from-blue-500 to-blue-600 rounded-r-full"
-}, wm = ["onClick"], km = { class: "flex items-center justify-center w-8 h-8 rounded-lg mr-3 flex-shrink-0 transition-colors ml-2 bg-gray-100 text-gray-600 group-hover:bg-gray-200" }, Sm = { class: "flex-1 truncate font-semibold text-gray-700" }, Cm = {
+}, im = ["onClick"], um = { class: "flex items-center justify-center w-8 h-8 rounded-lg mr-3 flex-shrink-0 transition-colors ml-2 bg-gray-100 text-gray-600 group-hover:bg-gray-200" }, dm = { class: "flex-1 truncate font-semibold text-gray-700" }, cm = {
   __name: "Header",
   props: {
     sidebarWidth: { type: Number, default: 256 },
@@ -10549,14 +10421,14 @@ const cd = {
         )),
         style: { left: "0" }
       }, [
-        i("div", Wf, [
-          i("div", Hf, [
-            e.organisationName ? (o(), d("div", Gf, [
-              i("p", Kf, x(e.organisationName), 1),
-              e.user.organisation?.role ? (o(), d("p", Xf, x(e.user.organisation.role), 1)) : h("", !0)
+        i("div", Of, [
+          i("div", Vf, [
+            e.organisationName ? (o(), d("div", Df, [
+              i("p", Mf, x(e.organisationName), 1),
+              e.user.organisation?.role ? (o(), d("p", Ff, x(e.user.organisation.role), 1)) : h("", !0)
             ])) : h("", !0),
-            i("nav", Jf, [
-              i("span", Qf, x(e.currentSection), 1),
+            i("nav", Nf, [
+              i("span", Ef, x(e.currentSection), 1),
               A[4] || (A[4] = i("svg", {
                 class: "w-4 h-4 text-gray-400 flex-shrink-0",
                 fill: "none",
@@ -10570,10 +10442,10 @@ const cd = {
                   d: "M9 5l7 7-7 7"
                 })
               ], -1)),
-              i("span", Zf, x(e.currentPage), 1)
+              i("span", Lf, x(e.currentPage), 1)
             ])
           ]),
-          i("div", em, [
+          i("div", _f, [
             y.value ? (o(), d("button", {
               key: 0,
               class: "p-2 text-gray-400 hover:text-gray-600 rounded-lg hover:bg-gray-50 transition-colors",
@@ -10593,7 +10465,7 @@ const cd = {
                 })
               ], -1)
             ])])) : h("", !0),
-            !y.value || c.value ? (o(), d("div", tm, [
+            !y.value || c.value ? (o(), d("div", Rf, [
               A[6] || (A[6] = i("div", { class: "absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none" }, [
                 i("svg", {
                   class: "w-4 h-4 text-gray-400",
@@ -10664,7 +10536,7 @@ const cd = {
                   d: "M13 3h2.586a1 1 0 01.707.293l6.414 6.414a1 1 0 01.293.707V19a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h4L13 3z"
                 })
               ], -1)),
-              u.value > 0 ? (o(), d("span", am, x(u.value), 1)) : h("", !0)
+              u.value > 0 ? (o(), d("span", qf, x(u.value), 1)) : h("", !0)
             ]),
             P(ue, {
               "enter-active-class": "transition-all duration-300 ease-out",
@@ -10675,20 +10547,20 @@ const cd = {
               "leave-to-class": "opacity-0 translate-y-2 scale-95"
             }, {
               default: E(() => [
-                l.value ? (o(), d("div", nm, [
+                l.value ? (o(), d("div", Yf, [
                   A[10] || (A[10] = i("div", { class: "p-4 border-b border-gray-200" }, [
                     i("h3", { class: "text-lg font-semibold text-gray-900" }, " Notifications ")
                   ], -1)),
-                  i("div", rm, [
+                  i("div", Uf, [
                     (o(!0), d(K, null, J(e.notifications, (q) => (o(), d("div", {
                       key: q.id,
                       class: "p-4 border-b border-gray-100 hover:bg-gray-50 cursor-pointer"
                     }, [
-                      i("div", sm, [
+                      i("div", Wf, [
                         A[9] || (A[9] = i("div", { class: "flex-shrink-0 w-2 h-2 mt-2 bg-blue-500 rounded-full" }, null, -1)),
-                        i("div", lm, [
-                          i("p", om, x(q.title), 1),
-                          i("p", im, x(q.time), 1)
+                        i("div", Hf, [
+                          i("p", Gf, x(q.title), 1),
+                          i("p", Kf, x(q.time), 1)
                         ])
                       ])
                     ]))), 128))
@@ -10700,17 +10572,17 @@ const cd = {
               ]),
               _: 1
             }),
-            i("div", um, [
+            i("div", Xf, [
               i("button", {
                 class: "flex items-center space-x-2 md:space-x-3 p-2 rounded-lg hover:bg-gray-50 transition-colors",
                 onClick: $
               }, [
-                i("div", dm, [
-                  i("span", cm, x(w.value), 1)
+                i("div", Jf, [
+                  i("span", Qf, x(w.value), 1)
                 ]),
-                i("div", fm, [
-                  i("p", mm, x(e.user.name), 1),
-                  i("p", gm, x(C.value), 1)
+                i("div", Zf, [
+                  i("p", em, x(e.user.name), 1),
+                  i("p", tm, x(C.value), 1)
                 ]),
                 A[12] || (A[12] = i("svg", {
                   class: "w-4 h-4 text-gray-400",
@@ -10735,12 +10607,12 @@ const cd = {
                 "leave-to-class": "opacity-0 translate-y-2 scale-95"
               }, {
                 default: E(() => [
-                  s.value ? (o(), d("div", vm, [
-                    i("div", bm, [
-                      i("p", hm, x(e.user.name), 1),
-                      i("p", ym, x(e.user.email), 1)
+                  s.value ? (o(), d("div", am, [
+                    i("div", nm, [
+                      i("p", rm, x(e.user.name), 1),
+                      i("p", sm, x(e.user.email), 1)
                     ]),
-                    i("div", pm, [
+                    i("div", lm, [
                       (o(!0), d(K, null, J(e.profileMenuItems, (q) => (o(), d(K, {
                         key: q.name
                       }, [
@@ -10754,7 +10626,7 @@ const cd = {
                           onClick: (se) => z(q)
                         }, {
                           default: E(() => [
-                            g(q) ? (o(), d("div", xm)) : h("", !0),
+                            g(q) ? (o(), d("div", om)) : h("", !0),
                             i("div", {
                               class: m(N(S)(
                                 "flex items-center justify-center w-8 h-8 rounded-lg mr-3 flex-shrink-0 transition-colors ml-2",
@@ -10780,15 +10652,15 @@ const cd = {
                           class: "flex items-center w-full px-3 py-2.5 rounded-lg text-sm font-medium transition-all duration-200 group relative text-gray-700 hover:bg-gray-50 hover:text-gray-900 border border-transparent",
                           onClick: (se) => b(q)
                         }, [
-                          i("div", km, [
+                          i("div", um, [
                             q.icon ? (o(), R(ae, {
                               key: 0,
                               icon: q.icon,
                               class: "w-4 h-4"
                             }, null, 8, ["icon"])) : h("", !0)
                           ]),
-                          i("span", Sm, x(q.label), 1)
-                        ], 8, wm))
+                          i("span", dm, x(q.label), 1)
+                        ], 8, im))
                       ], 64))), 128))
                     ]),
                     i("div", { class: "border-t border-gray-200 py-2" }, [
@@ -10824,13 +10696,13 @@ const cd = {
       ], 2);
     };
   }
-}, $m = { class: "mb-4" }, zm = { class: "text-lg font-semibold text-gray-900" }, Am = { class: "text-sm text-gray-600" }, Im = {
+}, fm = { class: "mb-4" }, mm = { class: "text-lg font-semibold text-gray-900" }, gm = { class: "text-sm text-gray-600" }, vm = {
   value: "",
   disabled: ""
-}, Pm = ["value"], Tm = {
+}, bm = ["value"], hm = {
   key: 3,
   class: "flex items-center"
-}, jm = { class: "flex justify-end gap-3 pt-4" }, Bm = {
+}, ym = { class: "flex justify-end gap-3 pt-4" }, pm = {
   __name: "ReusableFormModal",
   props: {
     modelValue: {
@@ -10971,9 +10843,9 @@ const cd = {
       onClose: z
     }, {
       default: E(() => [
-        i("div", $m, [
-          i("h2", zm, x(e.modalType === "create" ? `Add New ${e.entityName}` : `Edit ${e.entityName}`), 1),
-          i("p", Am, x(e.modalType === "create" ? `Fill in the details to create a new ${e.entityName.toLowerCase()}.` : `Update the ${e.entityName.toLowerCase()} information below.`), 1)
+        i("div", fm, [
+          i("h2", mm, x(e.modalType === "create" ? `Add New ${e.entityName}` : `Edit ${e.entityName}`), 1),
+          i("p", gm, x(e.modalType === "create" ? `Fill in the details to create a new ${e.entityName.toLowerCase()}.` : `Update the ${e.entityName.toLowerCase()} information below.`), 1)
         ]),
         i("form", {
           class: "space-y-4",
@@ -11027,14 +10899,14 @@ const cd = {
                   "onUpdate:modelValue": (A) => C(f, A)
                 }, {
                   default: E(() => [
-                    i("option", Im, x(f.placeholder || "Select an option"), 1),
+                    i("option", vm, x(f.placeholder || "Select an option"), 1),
                     (o(!0), d(K, null, J(f.options, (A) => (o(), d("option", {
                       key: A.value,
                       value: A.value
-                    }, x(A.label), 9, Pm))), 128))
+                    }, x(A.label), 9, bm))), 128))
                   ]),
                   _: 2
-                }, 1032, ["id", "model-value", "disabled", "class", "aria-describedby", "onUpdate:modelValue"])) : f.type === "checkbox" ? (o(), d("div", Tm, [
+                }, 1032, ["id", "model-value", "disabled", "class", "aria-describedby", "onUpdate:modelValue"])) : f.type === "checkbox" ? (o(), d("div", hm, [
                   P(qt, {
                     id: p,
                     modelValue: s.value[f.name],
@@ -11081,7 +10953,7 @@ const cd = {
               _: 2
             }, 1032, ["id", "label", "required", "error", "error-message"])
           ]))), 128)),
-          i("div", jm, [
+          i("div", ym, [
             P(Ce, {
               type: "button",
               variant: "outline",
@@ -11110,37 +10982,37 @@ const cd = {
       _: 1
     }, 8, ["modelValue", "size", "resizable"]));
   }
-}, Om = {
+}, xm = {
   key: 0,
   class: "flex items-center justify-between p-4 border-b border-gray-200 flex-shrink-0 lg:hidden"
-}, Vm = { class: "text-lg font-bold text-gray-900" }, Dm = { class: "flex-1 overflow-y-auto overflow-x-hidden p-4" }, Mm = { class: "space-y-2" }, Fm = { key: 0 }, Nm = {
+}, wm = { class: "text-lg font-bold text-gray-900" }, km = { class: "flex-1 overflow-y-auto overflow-x-hidden p-4" }, Sm = { class: "space-y-2" }, Cm = { key: 0 }, $m = {
   key: 0,
   class: "absolute top-2 right-2 inline-flex items-center justify-center w-5 h-5 text-xs font-bold rounded-full bg-red-500 text-white"
-}, Em = ["onClick"], Lm = {
+}, zm = ["onClick"], Am = {
   key: 0,
   class: "absolute top-2 right-2 inline-flex items-center justify-center w-5 h-5 text-xs font-bold rounded-full bg-red-500 text-white"
-}, _m = {
+}, Im = {
   key: 1,
   class: "absolute top-1.5 right-1.5 w-2 h-2 bg-blue-500 rounded-full"
-}, Rm = {
+}, Pm = {
   key: 1,
   class: "border-t border-gray-200 p-4 flex-shrink-0"
-}, qm = {
+}, Tm = {
   key: 0,
   class: "absolute top-1.5 right-1.5 w-2 h-2 bg-blue-500 rounded-full"
-}, Ym = { class: "sticky top-0 bg-white border-b border-gray-200 z-10" }, Um = { class: "flex items-center justify-between p-4" }, Wm = { class: "flex-1 text-sm font-bold text-gray-900 ml-2" }, Hm = { class: "p-3" }, Gm = { class: "space-y-1" }, Km = {
+}, jm = { class: "sticky top-0 bg-white border-b border-gray-200 z-10" }, Bm = { class: "flex items-center justify-between p-4" }, Om = { class: "flex-1 text-sm font-bold text-gray-900 ml-2" }, Vm = { class: "p-3" }, Dm = { class: "space-y-1" }, Mm = {
   key: 0,
   class: "absolute left-0 top-1/2 transform -translate-y-1/2 w-1 h-8 bg-gradient-to-b from-blue-500 to-blue-600 rounded-r-full"
-}, Xm = {
+}, Fm = {
   key: 1,
   class: "ml-2 inline-flex items-center justify-center px-2 py-0.5 text-xs font-bold rounded-full bg-red-500 text-white"
-}, Jm = { class: "p-3" }, Qm = { class: "space-y-1" }, Zm = {
+}, Nm = { class: "p-3" }, Em = { class: "space-y-1" }, Lm = {
   key: 0,
   class: "px-3 py-2 text-xs font-semibold text-gray-500 uppercase tracking-wider"
-}, eg = {
+}, _m = {
   key: 0,
   class: "absolute left-0 top-1/2 transform -translate-y-1/2 w-1 h-8 bg-gradient-to-b from-blue-500 to-blue-600 rounded-r-full"
-}, tg = {
+}, Rm = {
   __name: "Sidebar",
   props: {
     sidebarWidth: {
@@ -11263,8 +11135,8 @@ const cd = {
           )),
           style: de({ width: e.sidebarWidth + "px", top: l.value ? "0px" : "4rem" })
         }, [
-          l.value ? (o(), d("div", Om, [
-            i("h2", Vm, x(e.header?.title), 1),
+          l.value ? (o(), d("div", xm, [
+            i("h2", wm, x(e.header?.title), 1),
             i("button", {
               class: "p-2 rounded-lg text-gray-500 hover:text-gray-900 hover:bg-gray-100 transition-colors",
               "aria-label": "Close sidebar",
@@ -11285,12 +11157,12 @@ const cd = {
               ], -1)
             ])])
           ])) : h("", !0),
-          i("nav", Dm, [
-            i("div", Mm, [
+          i("nav", km, [
+            i("div", Sm, [
               (o(!0), d(K, null, J(e.navigationItems, (k) => (o(), d(K, {
                 key: k.name || k.label
               }, [
-                k.type === "link" ? (o(), d("div", Fm, [
+                k.type === "link" ? (o(), d("div", Cm, [
                   g(k) ? (o(), d("div", {
                     key: 1,
                     class: m(N(S)(
@@ -11317,9 +11189,9 @@ const cd = {
                         q(k) ? "text-blue-700 font-semibold" : "text-gray-500 group-hover:text-gray-900"
                       ))
                     }, x(k.label), 3),
-                    k.badge ? (o(), d("span", Lm, x(k.badge), 1)) : h("", !0),
-                    q(k) && g(k) ? (o(), d("div", _m)) : h("", !0)
-                  ], 10, Em)) : (o(), R(W, {
+                    k.badge ? (o(), d("span", Am, x(k.badge), 1)) : h("", !0),
+                    q(k) && g(k) ? (o(), d("div", Im)) : h("", !0)
+                  ], 10, zm)) : (o(), R(W, {
                     key: 0,
                     to: k.route,
                     class: m(N(S)(
@@ -11347,7 +11219,7 @@ const cd = {
                           q(k) ? "text-blue-700 font-semibold" : "text-gray-500 group-hover:text-gray-900"
                         ))
                       }, x(k.label), 3),
-                      k.badge ? (o(), d("span", Nm, x(k.badge), 1)) : h("", !0)
+                      k.badge ? (o(), d("span", $m, x(k.badge), 1)) : h("", !0)
                     ]),
                     _: 2
                   }, 1032, ["to", "class", "onClick"]))
@@ -11355,7 +11227,7 @@ const cd = {
               ], 64))), 128))
             ])
           ]),
-          e.showManagementSettings ? (o(), d("div", Rm, [
+          e.showManagementSettings ? (o(), d("div", Pm, [
             i("div", {
               class: m(N(S)(
                 "flex flex-col items-center justify-center rounded-xl transition-all duration-200 cursor-pointer group relative py-4 px-3",
@@ -11381,7 +11253,7 @@ const cd = {
                   e.isManagementSettingsActive ? "text-blue-700 font-semibold" : "text-gray-500 group-hover:text-gray-900"
                 ))
               }, " Settings ", 2),
-              e.isManagementSettingsActive ? (o(), d("div", qm)) : h("", !0)
+              e.isManagementSettingsActive ? (o(), d("div", Tm)) : h("", !0)
             ], 2)
           ])) : h("", !0)
         ], 6),
@@ -11404,8 +11276,8 @@ const cd = {
               ),
               style: de(w.value)
             }, [
-              i("div", Ym, [
-                i("div", Um, [
+              i("div", jm, [
+                i("div", Bm, [
                   i("button", {
                     class: "p-2 -ml-2 rounded-lg text-gray-500 hover:text-gray-700 hover:bg-gray-100 transition-colors",
                     "aria-label": "Close submenu",
@@ -11425,11 +11297,11 @@ const cd = {
                       })
                     ], -1)
                   ])]),
-                  i("h3", Wm, x(u.value?.label), 1)
+                  i("h3", Om, x(u.value?.label), 1)
                 ])
               ]),
-              i("nav", Hm, [
-                i("div", Gm, [
+              i("nav", Vm, [
+                i("div", Dm, [
                   (o(!0), d(K, null, J(u.value?.subItems, (k) => (o(), R(W, {
                     key: k.name,
                     to: k.route,
@@ -11442,7 +11314,7 @@ const cd = {
                     onClick: (T) => A(k)
                   }, {
                     default: E(() => [
-                      q(k) ? (o(), d("div", Km)) : h("", !0),
+                      q(k) ? (o(), d("div", Mm)) : h("", !0),
                       i("div", {
                         class: m(
                           N(S)(
@@ -11463,7 +11335,7 @@ const cd = {
                           q(k) ? "text-blue-700" : "text-gray-700"
                         ))
                       }, x(k.label), 3),
-                      k.badge ? (o(), d("span", Xm, x(k.badge), 1)) : h("", !0)
+                      k.badge ? (o(), d("span", Fm, x(k.badge), 1)) : h("", !0)
                     ]),
                     _: 2
                   }, 1032, ["to", "class", "onClick"]))), 128))
@@ -11516,12 +11388,12 @@ const cd = {
                   Z[3] || (Z[3] = i("h3", { class: "flex-1 text-sm font-bold text-gray-900 ml-2" }, " Management Settings ", -1))
                 ])
               ]),
-              i("nav", Jm, [
-                i("div", Qm, [
+              i("nav", Nm, [
+                i("div", Em, [
                   (o(!0), d(K, null, J(e.managementSettings, (k) => (o(), d(K, {
                     key: k.name
                   }, [
-                    k.type === "section" ? (o(), d("div", Zm, x(k.label), 1)) : k.route ? (o(), R(W, {
+                    k.type === "section" ? (o(), d("div", Lm, x(k.label), 1)) : k.route ? (o(), R(W, {
                       key: 1,
                       to: k.route,
                       class: m(
@@ -11533,7 +11405,7 @@ const cd = {
                       onClick: (T) => ne(k)
                     }, {
                       default: E(() => [
-                        q(k) ? (o(), d("div", eg)) : h("", !0),
+                        q(k) ? (o(), d("div", _m)) : h("", !0),
                         i("div", {
                           class: m(
                             N(S)(
@@ -11584,7 +11456,7 @@ const cd = {
       ]);
     };
   }
-}, ag = {
+}, qm = {
   __name: "Timeline",
   props: {
     orientation: {
@@ -11603,13 +11475,13 @@ const cd = {
       B(a.$slots, "default")
     ], 2));
   }
-}, ng = {
+}, Ym = {
   key: 0,
   class: "absolute left-3 top-0 w-0.5 h-full bg-slate-200"
-}, rg = { class: "z-10 flex items-center justify-center w-6 h-6 rounded-full border-2 border-blue-500 bg-white text-blue-500" }, sg = { class: "text-slate-900 font-medium" }, lg = {
+}, Um = { class: "z-10 flex items-center justify-center w-6 h-6 rounded-full border-2 border-blue-500 bg-white text-blue-500" }, Wm = { class: "text-slate-900 font-medium" }, Hm = {
   key: 0,
   class: "text-slate-500 text-sm"
-}, og = { class: "mt-2 text-slate-600 text-sm" }, ig = {
+}, Gm = { class: "mt-2 text-slate-600 text-sm" }, Km = {
   __name: "TimelineItem",
   props: {
     title: {
@@ -11633,8 +11505,8 @@ const cd = {
         e.orientation === "vertical" ? "items-start mb-8 last:mb-0" : "flex-col items-center mx-8 last:mx-0"
       ])
     }, [
-      e.orientation === "vertical" ? (o(), d("div", ng)) : h("", !0),
-      i("div", rg, [
+      e.orientation === "vertical" ? (o(), d("div", Ym)) : h("", !0),
+      i("div", Um, [
         B(a.$slots, "icon", {}, () => [
           t[0] || (t[0] = i("div", { class: "w-2 h-2 rounded-full bg-blue-500" }, null, -1))
         ])
@@ -11645,23 +11517,23 @@ const cd = {
           e.orientation === "horizontal" ? "mt-2 text-center" : ""
         ])
       }, [
-        i("h3", sg, [
+        i("h3", Wm, [
           B(a.$slots, "title", {}, () => [
             G(x(e.title), 1)
           ])
         ]),
-        e.subtitle ? (o(), d("p", lg, [
+        e.subtitle ? (o(), d("p", Hm, [
           B(a.$slots, "subtitle", {}, () => [
             G(x(e.subtitle), 1)
           ])
         ])) : h("", !0),
-        i("div", og, [
+        i("div", Gm, [
           B(a.$slots, "default")
         ])
       ], 2)
     ], 2));
   }
-}, ug = {
+}, Xm = {
   name: "AuthLayout",
   props: {
     title: {
@@ -11750,20 +11622,20 @@ const cd = {
       currentYear: v(() => (/* @__PURE__ */ new Date()).getFullYear())
     };
   }
-}, dg = { class: "container mx-auto px-4 relative z-10" }, cg = { class: "grid lg:grid-cols-10 gap-8 items-center min-h-screen" }, fg = { class: "lg:col-span-6 text-white text-center lg:text-left space-y-6" }, mg = { class: "mb-6" }, gg = { class: "text-4xl lg:text-6xl font-bold mb-2" }, vg = { class: "text-white" }, bg = { class: "flex items-center justify-center lg:justify-start mb-6" }, hg = { class: "text-3xl lg:text-4xl font-bold text-white" }, yg = { class: "lg:col-span-4" }, pg = { class: "bg-white rounded-lg shadow-xl p-6 lg:p-8 max-w-md mx-auto" }, xg = {
+}, Jm = { class: "container mx-auto px-4 relative z-10" }, Qm = { class: "grid lg:grid-cols-10 gap-8 items-center min-h-screen" }, Zm = { class: "lg:col-span-6 text-white text-center lg:text-left space-y-6" }, eg = { class: "mb-6" }, tg = { class: "text-4xl lg:text-6xl font-bold mb-2" }, ag = { class: "text-white" }, ng = { class: "flex items-center justify-center lg:justify-start mb-6" }, rg = { class: "text-3xl lg:text-4xl font-bold text-white" }, sg = { class: "lg:col-span-4" }, lg = { class: "bg-white rounded-lg shadow-xl p-6 lg:p-8 max-w-md mx-auto" }, og = {
   key: 0,
   class: "mb-6"
-}, wg = { class: "text-center" }, kg = { class: "text-2xl font-bold text-gray-900" }, Sg = {
+}, ig = { class: "text-center" }, ug = { class: "text-2xl font-bold text-gray-900" }, dg = {
   key: 0,
   class: "text-gray-600 mt-2"
-}, Cg = { class: "space-y-6" }, $g = {
+}, cg = { class: "space-y-6" }, fg = {
   key: 1,
   class: "mt-6"
-}, zg = {
+}, mg = {
   key: 0,
   class: "mt-6 text-center"
-}, Ag = { class: "absolute bottom-4 right-4 text-right" }, Ig = { class: "flex items-end justify-end mb-2" }, Pg = { class: "text-right mr-3" }, Tg = { class: "text-red-500 font-bold text-xs" }, jg = { class: "text-white text-xs" }, Bg = { class: "text-white/70 text-xs" }, Og = { class: "w-8 h-8 bg-red-500 rounded flex items-center justify-center text-white font-bold text-xs" }, Vg = { class: "text-white/70 text-xs" }, Dg = { class: "absolute bottom-4 left-4 flex gap-2" }, Mg = ["href"];
-function Fg(e, a, t, n, r, l) {
+}, gg = { class: "absolute bottom-4 right-4 text-right" }, vg = { class: "flex items-end justify-end mb-2" }, bg = { class: "text-right mr-3" }, hg = { class: "text-red-500 font-bold text-xs" }, yg = { class: "text-white text-xs" }, pg = { class: "text-white/70 text-xs" }, xg = { class: "w-8 h-8 bg-red-500 rounded flex items-center justify-center text-white font-bold text-xs" }, wg = { class: "text-white/70 text-xs" }, kg = { class: "absolute bottom-4 left-4 flex gap-2" }, Sg = ["href"];
+function Cg(e, a, t, n, r, l) {
   const s = ie("router-view"), u = ie("font-awesome-icon");
   return o(), d("div", {
     class: "min-h-screen relative flex items-center justify-center",
@@ -11776,70 +11648,70 @@ function Fg(e, a, t, n, r, l) {
         opacity: t.backgroundOpacity
       })
     }, null, 4),
-    i("div", dg, [
-      i("div", cg, [
-        i("div", fg, [
-          i("div", mg, [
-            i("div", gg, [
+    i("div", Jm, [
+      i("div", Qm, [
+        i("div", Zm, [
+          i("div", eg, [
+            i("div", tg, [
               i("span", {
                 style: de({ color: t.primaryColor })
               }, x(t.primaryLogoPrefix), 5),
-              i("span", vg, x(t.primaryLogoText), 1)
+              i("span", ag, x(t.primaryLogoText), 1)
             ]),
             i("div", {
               class: "h-0.5 w-30 mx-auto lg:mx-0",
               style: de({ backgroundColor: t.primaryColor })
             }, null, 4)
           ]),
-          i("div", bg, [
+          i("div", ng, [
             i("div", {
               class: "flex items-center justify-center w-15 h-15 rounded-lg mr-4 text-white font-bold text-xl",
               style: de({ backgroundColor: t.primaryColor })
             }, x(t.secondaryLogoPrefix), 5),
-            i("span", hg, x(t.secondaryLogoText), 1)
+            i("span", rg, x(t.secondaryLogoText), 1)
           ]),
           a[0] || (a[0] = i("div", { class: "max-w-md mx-auto lg:mx-0" }, [
             i("p", { class: "text-sm lg:text-base font-light text-white/70 italic leading-relaxed" })
           ], -1))
         ]),
-        i("div", yg, [
-          i("div", pg, [
-            e.$slots["card-header"] || t.title ? (o(), d("div", xg, [
+        i("div", sg, [
+          i("div", lg, [
+            e.$slots["card-header"] || t.title ? (o(), d("div", og, [
               B(e.$slots, "card-header", {}, () => [
-                i("div", wg, [
-                  i("h1", kg, x(t.title), 1),
-                  t.subtitle ? (o(), d("p", Sg, x(t.subtitle), 1)) : h("", !0)
+                i("div", ig, [
+                  i("h1", ug, x(t.title), 1),
+                  t.subtitle ? (o(), d("p", dg, x(t.subtitle), 1)) : h("", !0)
                 ])
               ])
             ])) : h("", !0),
-            i("div", Cg, [
+            i("div", cg, [
               P(s)
             ]),
-            e.$slots["card-footer"] ? (o(), d("div", $g, [
+            e.$slots["card-footer"] ? (o(), d("div", fg, [
               B(e.$slots, "card-footer")
             ])) : h("", !0)
           ]),
-          e.$slots.links ? (o(), d("div", zg, [
+          e.$slots.links ? (o(), d("div", mg, [
             B(e.$slots, "links")
           ])) : h("", !0)
         ])
       ])
     ]),
-    i("div", Ag, [
-      i("div", Ig, [
-        i("div", Pg, [
-          i("div", Tg, x(t.companyName), 1),
-          i("div", jg, x(t.companyType), 1),
-          i("div", Bg, x(t.companyTagline), 1)
+    i("div", gg, [
+      i("div", vg, [
+        i("div", bg, [
+          i("div", hg, x(t.companyName), 1),
+          i("div", yg, x(t.companyType), 1),
+          i("div", pg, x(t.companyTagline), 1)
         ]),
-        i("div", Og, x(t.companyInitials), 1)
+        i("div", xg, x(t.companyInitials), 1)
       ]),
-      i("div", Vg, [
+      i("div", wg, [
         i("div", null, x(t.appName) + " (" + x(t.appVersion) + ")", 1),
         i("div", null, x(t.copyright), 1)
       ])
     ]),
-    i("div", Dg, [
+    i("div", kg, [
       (o(!0), d(K, null, J(t.socialLinks, (c) => (o(), d("a", {
         key: c.name,
         href: c.url,
@@ -11851,14 +11723,14 @@ function Fg(e, a, t, n, r, l) {
         P(u, {
           icon: ["fab", c.icon]
         }, null, 8, ["icon"])
-      ], 10, Mg))), 128))
+      ], 10, Sg))), 128))
     ])
   ], 4);
 }
-const Ng = /* @__PURE__ */ yt(ug, [["render", Fg]]), Eg = { class: "min-h-screen bg-gray-50" }, Lg = { class: "flex-1" }, _g = {
+const $g = /* @__PURE__ */ yt(Xm, [["render", Cg]]), zg = { class: "min-h-screen bg-gray-50" }, Ag = { class: "flex-1" }, Ig = {
   key: 0,
   class: "bg-white border-b border-gray-200"
-}, Rg = { class: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4" }, qg = { class: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8" }, Yg = {
+}, Pg = { class: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4" }, Tg = { class: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8" }, jg = {
   __name: "DefaultLayout",
   props: {
     navigationItems: {
@@ -11882,7 +11754,7 @@ const Ng = /* @__PURE__ */ yt(ug, [["render", Fg]]), Eg = { class: "min-h-screen
   setup(e) {
     return (a, t) => {
       const n = ie("Logo"), r = ie("MainNavigation"), l = ie("Button"), s = ie("Header"), u = ie("Breadcrumb"), c = ie("Text"), y = ie("Footer");
-      return o(), d("div", Eg, [
+      return o(), d("div", zg, [
         P(s, null, {
           logo: E(() => [
             B(a.$slots, "logo", {}, () => [
@@ -11915,15 +11787,15 @@ const Ng = /* @__PURE__ */ yt(ug, [["render", Fg]]), Eg = { class: "min-h-screen
           ]),
           _: 3
         }),
-        i("main", Lg, [
-          e.showBreadcrumb ? (o(), d("div", _g, [
-            i("div", Rg, [
+        i("main", Ag, [
+          e.showBreadcrumb ? (o(), d("div", Ig, [
+            i("div", Pg, [
               B(a.$slots, "breadcrumb", {}, () => [
                 P(u, { items: e.breadcrumbItems }, null, 8, ["items"])
               ])
             ])
           ])) : h("", !0),
-          i("div", qg, [
+          i("div", Tg, [
             B(a.$slots, "default")
           ])
         ]),
@@ -11944,7 +11816,7 @@ const Ng = /* @__PURE__ */ yt(ug, [["render", Fg]]), Eg = { class: "min-h-screen
       ]);
     };
   }
-}, Ug = {
+}, Bg = {
   name: "ErrorLayout",
   props: {
     errorType: {
@@ -12210,20 +12082,20 @@ const Ng = /* @__PURE__ */ yt(ug, [["render", Fg]]), Eg = { class: "min-h-screen
       helpClasses: re
     };
   }
-}, Wg = { class: "flex justify-center" }, Hg = { class: "flex items-center gap-3" }, Gg = { class: "text-2xl font-bold text-slate-900" }, Kg = {
+}, Og = { class: "flex justify-center" }, Vg = { class: "flex items-center gap-3" }, Dg = { class: "text-2xl font-bold text-slate-900" }, Mg = {
   key: 1,
   class: "bg-red-100 border border-red-200 rounded-lg p-4 mx-auto max-w-md mb-6"
-}, Xg = { class: "flex flex-col sm:flex-row gap-4 justify-center" }, Jg = ["disabled"], Qg = {
+}, Fg = { class: "flex flex-col sm:flex-row gap-4 justify-center" }, Ng = ["disabled"], Eg = {
   key: 0,
   class: "animate-spin"
-}, Zg = { key: 1 }, ev = ["disabled"], tv = { key: 0 }, av = { key: 1 }, nv = {
+}, Lg = { key: 1 }, _g = ["disabled"], Rg = { key: 0 }, qg = { key: 1 }, Yg = {
   key: 0,
   class: "mt-8 max-w-md mx-auto"
-}, rv = { class: "bg-white rounded-lg border border-slate-200 shadow-sm p-6" }, sv = { class: "text-lg font-semibold text-slate-900 mb-4" }, lv = { class: "space-y-3" }, ov = { class: "text-sm text-slate-600" }, iv = ["href"], uv = {
+}, Ug = { class: "bg-white rounded-lg border border-slate-200 shadow-sm p-6" }, Wg = { class: "text-lg font-semibold text-slate-900 mb-4" }, Hg = { class: "space-y-3" }, Gg = { class: "text-sm text-slate-600" }, Kg = ["href"], Xg = {
   key: 5,
   class: "text-xs text-slate-400 font-mono mt-4"
 };
-function dv(e, a, t, n, r, l) {
+function Jg(e, a, t, n, r, l) {
   return o(), d("div", {
     class: m(n.layoutClasses)
   }, [
@@ -12243,13 +12115,13 @@ function dv(e, a, t, n, r, l) {
         class: m(n.headerClasses)
       }, [
         B(e.$slots, "header", {}, () => [
-          i("div", Wg, [
+          i("div", Og, [
             B(e.$slots, "logo", {}, () => [
-              i("div", Hg, [
+              i("div", Vg, [
                 a[5] || (a[5] = i("div", { class: "w-10 h-10 bg-blue-600 rounded-xl flex items-center justify-center" }, [
                   i("span", { class: "text-white font-bold text-lg" }, "STL")
                 ], -1)),
-                i("span", Gg, x(t.brandName), 1)
+                i("span", Dg, x(t.brandName), 1)
               ])
             ])
           ])
@@ -12295,7 +12167,7 @@ function dv(e, a, t, n, r, l) {
             ])
           ], 2)
         ], 2),
-        n.isOnline ? h("", !0) : (o(), d("div", Kg, [...a[6] || (a[6] = [
+        n.isOnline ? h("", !0) : (o(), d("div", Mg, [...a[6] || (a[6] = [
           i("div", { class: "flex items-center justify-center gap-2 text-red-700" }, [
             i("span", { class: "w-3 h-3 bg-red-500 rounded-full animate-pulse" }),
             i("span", { class: "font-medium" }, "No Internet Connection")
@@ -12306,7 +12178,7 @@ function dv(e, a, t, n, r, l) {
           class: m(n.actionsClasses)
         }, [
           B(e.$slots, "actions", {}, () => [
-            i("div", Xg, [
+            i("div", Fg, [
               t.showHomeButton ? (o(), d("button", {
                 key: 0,
                 class: "bg-blue-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-blue-700 transition-colors flex items-center justify-center gap-2",
@@ -12329,18 +12201,18 @@ function dv(e, a, t, n, r, l) {
                 class: "border border-slate-300 text-slate-700 px-6 py-3 rounded-lg font-medium hover:bg-slate-50 transition-colors flex items-center justify-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed",
                 onClick: a[2] || (a[2] = (...s) => n.retry && n.retry(...s))
               }, [
-                n.isRetrying ? (o(), d("span", Qg, "↻")) : (o(), d("span", Zg, "🔄")),
+                n.isRetrying ? (o(), d("span", Eg, "↻")) : (o(), d("span", Lg, "🔄")),
                 G(" " + x(n.isRetrying ? "Retrying..." : t.retryButtonText), 1)
-              ], 8, Jg)) : h("", !0),
+              ], 8, Ng)) : h("", !0),
               t.showSupportButton ? (o(), d("button", {
                 key: 3,
                 disabled: n.reportSent,
                 class: "bg-slate-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-slate-700 transition-colors flex items-center justify-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed",
                 onClick: a[3] || (a[3] = (s) => e.$emit("contact-support"))
               }, [
-                n.reportSent ? (o(), d("span", tv, "✓")) : (o(), d("span", av, "📝")),
+                n.reportSent ? (o(), d("span", Rg, "✓")) : (o(), d("span", qg, "📝")),
                 G(" " + x(n.reportSent ? "Report Sent" : "Contact Support"), 1)
-              ], 8, ev)) : h("", !0)
+              ], 8, _g)) : h("", !0)
             ])
           ])
         ], 2)) : h("", !0),
@@ -12349,10 +12221,10 @@ function dv(e, a, t, n, r, l) {
           class: m(n.additionalInfoClasses)
         }, [
           B(e.$slots, "additional-info", {}, () => [
-            n.additionalInfoConfig ? (o(), d("div", nv, [
-              i("div", rv, [
-                i("h3", sv, x(n.additionalInfoConfig.title), 1),
-                i("ul", lv, [
+            n.additionalInfoConfig ? (o(), d("div", Yg, [
+              i("div", Ug, [
+                i("h3", Wg, x(n.additionalInfoConfig.title), 1),
+                i("ul", Hg, [
                   (o(!0), d(K, null, J(n.additionalInfoConfig.items, (s, u) => (o(), d("li", {
                     key: u,
                     class: "flex items-start gap-3 text-sm text-slate-600"
@@ -12372,7 +12244,7 @@ function dv(e, a, t, n, r, l) {
           class: m(n.helpClasses)
         }, [
           B(e.$slots, "help", {}, () => [
-            i("p", ov, [
+            i("p", Gg, [
               G(x(t.helpText) + " ", 1),
               t.supportUrl ? (o(), d("a", {
                 key: 0,
@@ -12381,16 +12253,153 @@ function dv(e, a, t, n, r, l) {
               }, [...a[8] || (a[8] = [
                 i("span", { class: "inline-block w-4 h-4 mr-1" }, "❓", -1),
                 G(" Get Help ", -1)
-              ])], 8, iv)) : h("", !0)
+              ])], 8, Kg)) : h("", !0)
             ])
           ])
         ], 2)) : h("", !0),
-        n.isDev ? (o(), d("div", uv, " Error ID: " + x(n.errorId), 1)) : h("", !0)
+        n.isDev ? (o(), d("div", Xg, " Error ID: " + x(n.errorId), 1)) : h("", !0)
       ], 2)
     ], 2)
   ], 2);
 }
-const cv = /* @__PURE__ */ yt(Ug, [["render", dv]]), Ua = {
+const Qg = /* @__PURE__ */ yt(Bg, [["render", Jg]]), Zg = {
+  key: 0,
+  class: "stl-loader__backdrop"
+}, ev = { class: "stl-loader__container" }, tv = {
+  key: 0,
+  class: "stl-loader__text stl-loader__text--top"
+}, av = {
+  key: 1,
+  class: "stl-loader__spin"
+}, nv = {
+  key: 2,
+  class: "stl-loader__pulse"
+}, rv = {
+  key: 3,
+  class: "stl-loader__bounce"
+}, sv = {
+  key: 4,
+  class: "stl-loader__ripple"
+}, lv = {
+  key: 5,
+  class: "stl-loader__bars"
+}, ov = {
+  key: 6,
+  class: "stl-loader__dots"
+}, iv = {
+  key: 7,
+  class: "stl-loader__ring"
+}, uv = {
+  key: 8,
+  class: "stl-loader__spinner-text"
+}, dv = {
+  key: 9,
+  class: "stl-loader__text stl-loader__text--bottom"
+}, cv = {
+  __name: "StlLoader",
+  props: {
+    loading: {
+      type: Boolean,
+      default: !0
+    },
+    type: {
+      type: String,
+      default: "spin",
+      validator: (e) => [
+        "spin",
+        "pulse",
+        "bounce",
+        "ripple",
+        "bars",
+        "dots",
+        "ring",
+        "spinner-text"
+      ].includes(e)
+    },
+    size: {
+      type: String,
+      default: "medium",
+      validator: (e) => ["small", "medium", "large", "xl"].includes(e)
+    },
+    color: {
+      type: String,
+      default: "#3b82f6"
+    },
+    backgroundColor: {
+      type: String,
+      default: "rgba(255, 255, 255, 0.9)"
+    },
+    text: {
+      type: String,
+      default: ""
+    },
+    textPosition: {
+      type: String,
+      default: "bottom",
+      validator: (e) => ["top", "bottom"].includes(e)
+    },
+    overlay: {
+      type: Boolean,
+      default: !1
+    },
+    fullscreen: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(e) {
+    return (a, t) => e.loading ? (o(), d("div", {
+      key: 0,
+      class: m([
+        "stl-loader",
+        `stl-loader--${e.type}`,
+        `stl-loader--${e.size}`,
+        e.overlay ? "stl-loader--overlay" : "",
+        e.fullscreen ? "stl-loader--fullscreen" : ""
+      ]),
+      style: de({
+        "--loader-color": e.color,
+        "--loader-bg": e.backgroundColor
+      })
+    }, [
+      e.overlay ? (o(), d("div", Zg)) : h("", !0),
+      i("div", ev, [
+        e.text && e.textPosition === "top" ? (o(), d("div", tv, x(e.text), 1)) : h("", !0),
+        e.type === "spin" ? (o(), d("div", av)) : e.type === "pulse" ? (o(), d("div", nv)) : e.type === "bounce" ? (o(), d("div", rv, [
+          (o(), d(K, null, J(3, (n) => i("div", {
+            key: n,
+            class: "stl-loader__bounce-dot",
+            style: de({ animationDelay: `${(n - 1) * 0.1}s` })
+          }, null, 4)), 64))
+        ])) : e.type === "ripple" ? (o(), d("div", sv, [
+          (o(), d(K, null, J(2, (n) => i("div", {
+            key: n,
+            class: "stl-loader__ripple-ring",
+            style: de({ animationDelay: `${(n - 1) * 0.5}s` })
+          }, null, 4)), 64))
+        ])) : e.type === "bars" ? (o(), d("div", lv, [
+          (o(), d(K, null, J(5, (n) => i("div", {
+            key: n,
+            class: "stl-loader__bar",
+            style: de({ animationDelay: `${(n - 1) * 0.1}s` })
+          }, null, 4)), 64))
+        ])) : e.type === "dots" ? (o(), d("div", ov, [
+          (o(), d(K, null, J(3, (n) => i("div", {
+            key: n,
+            class: "stl-loader__dot",
+            style: de({ animationDelay: `${(n - 1) * 0.16}s` })
+          }, null, 4)), 64))
+        ])) : e.type === "ring" ? (o(), d("div", iv, [...t[0] || (t[0] = [
+          i("div", { class: "stl-loader__ring-track" }, null, -1),
+          i("div", { class: "stl-loader__ring-fill" }, null, -1)
+        ])])) : e.type === "spinner-text" ? (o(), d("div", uv, [...t[1] || (t[1] = [
+          i("div", { class: "stl-loader__spinner" }, null, -1)
+        ])])) : h("", !0),
+        e.text && e.textPosition === "bottom" ? (o(), d("div", dv, x(e.text), 1)) : h("", !0)
+      ])
+    ], 6)) : h("", !0);
+  }
+}, Ye = /* @__PURE__ */ yt(cv, [["__scopeId", "data-v-671e75e9"]]), Ua = {
   Avatar: Lo,
   Badge: Ro,
   Button: Ce,
@@ -12414,54 +12423,54 @@ const cv = /* @__PURE__ */ yt(Ug, [["render", dv]]), Ua = {
   Tooltip: $i,
   Typography: Yt,
   STLLoader: Ye,
-  Alert: Wi,
-  Breadcrumb: Ki,
-  ButtonGroup: Ji,
-  Card: su,
-  CardHeader: lu,
-  CardBody: ou,
-  CardFooter: iu,
-  CardContent: uu,
-  CardTitle: du,
+  Alert: Oi,
+  Breadcrumb: Mi,
+  ButtonGroup: Ni,
+  Card: Wi,
+  CardHeader: Hi,
+  CardBody: Gi,
+  CardFooter: Ki,
+  CardContent: Xi,
+  CardTitle: Ji,
   DatePicker: ca,
-  Dropdown: wu,
-  DropdownItem: Su,
-  FileUpload: Ou,
+  Dropdown: iu,
+  DropdownItem: du,
+  FileUpload: xu,
   FormField: ar,
-  InputGroup: Ru,
-  ListItem: Ku,
-  MenuItem: Ju,
+  InputGroup: Pu,
+  ListItem: Mu,
+  MenuItem: Nu,
   Modal: nr,
-  ModalHeader: td,
-  ModalBody: ad,
-  ModalFooter: nd,
-  Notification: ud,
-  Toast: wd,
-  Search: Md,
+  ModalHeader: Ru,
+  ModalBody: qu,
+  ModalFooter: Yu,
+  Notification: Xu,
+  Toast: id,
+  Search: Sd,
   Slider: sr,
-  Stepper: _d,
-  StepperItem: Wd,
-  Tab: Jd,
-  TabPanel: ec,
-  Accordion: lc,
-  AccordionItem: oc,
-  Calendar: hc,
-  DataTable: Gc,
+  Stepper: Id,
+  StepperItem: Od,
+  Tab: Nd,
+  TabPanel: _d,
+  Accordion: Hd,
+  AccordionItem: Gd,
+  Calendar: rc,
+  DataTable: Dc,
   DataTableHeader: lr,
   DataTableRow: or,
-  DataTableCell: Kc,
+  DataTableCell: Mc,
   DataTablePagination: ir,
-  DataTableFilters: wf,
-  DataTableToolBar: Ff,
-  Footer: Uf,
-  Header: Cm,
-  ReusableFormModal: Bm,
-  Sidebar: tg,
-  Timeline: ag,
-  TimelineItem: ig,
-  AuthLayout: Ng,
-  DefaultLayout: Yg,
-  ErrorLayout: cv
+  DataTableFilters: of,
+  DataTableToolBar: Cf,
+  Footer: Bf,
+  Header: cm,
+  ReusableFormModal: pm,
+  Sidebar: Rm,
+  Timeline: qm,
+  TimelineItem: Km,
+  AuthLayout: $g,
+  DefaultLayout: jg,
+  ErrorLayout: Qg
 }, vv = {
   install(e, a = {}) {
     const { prefix: t = "" } = a;
@@ -12472,79 +12481,79 @@ const cv = /* @__PURE__ */ yt(Ug, [["render", dv]]), Ua = {
   }
 };
 export {
-  lc as Accordion,
-  oc as AccordionItem,
-  Wi as Alert,
-  Ng as AuthLayout,
+  Hd as Accordion,
+  Gd as AccordionItem,
+  Oi as Alert,
+  $g as AuthLayout,
   Lo as Avatar,
   Ro as Badge,
-  Ki as Breadcrumb,
+  Mi as Breadcrumb,
   Ce as Button,
-  Ji as ButtonGroup,
-  hc as Calendar,
-  su as Card,
-  ou as CardBody,
-  uu as CardContent,
-  iu as CardFooter,
-  lu as CardHeader,
-  du as CardTitle,
+  Ni as ButtonGroup,
+  rc as Calendar,
+  Wi as Card,
+  Gi as CardBody,
+  Xi as CardContent,
+  Ki as CardFooter,
+  Hi as CardHeader,
+  Ji as CardTitle,
   ia as Checkbox,
-  Gc as DataTable,
-  Kc as DataTableCell,
-  wf as DataTableFilters,
+  Dc as DataTable,
+  Mc as DataTableCell,
+  of as DataTableFilters,
   lr as DataTableHeader,
   ir as DataTablePagination,
   or as DataTableRow,
-  Ff as DataTableToolBar,
+  Cf as DataTableToolBar,
   ca as DatePicker,
-  Yg as DefaultLayout,
+  jg as DefaultLayout,
   Qo as Divider,
-  wu as Dropdown,
-  Su as DropdownItem,
-  cv as ErrorLayout,
-  Ou as FileUpload,
-  Uf as Footer,
+  iu as Dropdown,
+  du as DropdownItem,
+  Qg as ErrorLayout,
+  xu as FileUpload,
+  Bf as Footer,
   ar as FormField,
-  Cm as Header,
+  cm as Header,
   ae as Icon,
   ai as Image,
   qt as Input,
-  Ru as InputGroup,
+  Pu as InputGroup,
   da as Label,
   ui as Link,
-  Ku as ListItem,
+  Mu as ListItem,
   ci as Logo,
-  Ju as MenuItem,
+  Nu as MenuItem,
   nr as Modal,
-  ad as ModalBody,
-  nd as ModalFooter,
-  td as ModalHeader,
-  ud as Notification,
+  qu as ModalBody,
+  Yu as ModalFooter,
+  Ru as ModalHeader,
+  Xu as Notification,
   er as Option,
   gi as Progress,
   bi as ProgressBar,
   pi as Radio,
-  Bm as ReusableFormModal,
+  pm as ReusableFormModal,
   Ye as STLLoader,
-  Md as Search,
+  Sd as Search,
   ht as Select,
-  tg as Sidebar,
+  Rm as Sidebar,
   sr as Slider,
   ua as Spinner,
-  _d as Stepper,
-  Wd as StepperItem,
+  Id as Stepper,
+  Od as StepperItem,
   ki as Switch,
-  Jd as Tab,
-  ec as TabPanel,
+  Nd as Tab,
+  _d as TabPanel,
   Si as Text,
   tr as Textarea,
-  ag as Timeline,
-  ig as TimelineItem,
-  wd as Toast,
+  qm as Timeline,
+  Km as TimelineItem,
+  id as Toast,
   $i as Tooltip,
   Yt as Typography,
   S as cn,
   vv as default,
   Ut as toast,
-  md as useToaster
+  ed as useToaster
 };