@stlhorizon/vue-ui 3.4.2 → 3.4.3

package/dist/index.esm.js

@@ -4830,6 +4830,10 @@ const Q = {
       type: Boolean,
       default: !1
     },
+    dynamicColor: {
+      type: Boolean,
+      default: !0
+    },
     strokeLinecap: {
       type: String,
       default: "round",
@@ -4853,6 +4857,10 @@ const Q = {
       lg: 6,
       xl: 7
     })[a.size] || 5), c = b(() => o.value / 2), f = b(() => c.value - l.value / 2), y = b(() => 2 * Math.PI * f.value), w = b(() => y.value - r.value / 100 * y.value), k = b(() => {
+      if (a.dynamicColor) {
+        const x = r.value;
+        return x >= 80 ? "#ef4444" : x >= 60 ? "#f59e0b" : x >= 40 ? "#eab308" : x >= 20 ? "#22c55e" : "#6b7280";
+      }
       const S = {
         default: "#3b82f6",
         success: "#10b981",
@@ -4861,6 +4869,10 @@ const Q = {
       };
       return S[a.variant] || S.default;
     }), I = b(() => "#e5e7eb"), $ = b(() => {
+      if (a.dynamicColor) {
+        const x = r.value;
+        return x >= 80 ? "text-red-600" : x >= 60 ? "text-orange-600" : x >= 40 ? "text-yellow-600" : x >= 20 ? "text-green-600" : "text-gray-600";
+      }
       const S = {
         default: "text-blue-600",
         success: "text-green-600",
@@ -12031,13 +12043,13 @@ const Bd = {
 }, Wg = {
   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"
-}, Yg = { class: "max-h-96 overflow-y-auto" }, Hg = { class: "flex items-start space-x-3" }, Gg = { class: "flex-1" }, Kg = { class: "text-sm text-gray-900" }, Xg = { class: "text-xs text-gray-500 mt-1" }, Jg = { class: "relative" }, Qg = { 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" }, Zg = { class: "text-blue-700 text-sm font-medium" }, ev = { class: "hidden md:block text-left max-w-[160px] truncate" }, tv = { class: "text-sm font-medium text-gray-900 truncate" }, av = { class: "text-xs text-gray-500 truncate leading-tight" }, nv = {
+}, Yg = { class: "max-h-96 overflow-y-auto" }, Hg = { class: "flex items-start space-x-3" }, Gg = { class: "flex-1" }, Kg = { class: "text-sm text-gray-900" }, Xg = { class: "text-xs text-gray-500 mt-1" }, Jg = { class: "relative" }, Qg = { 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" }, Zg = { class: "text-blue-700 text-sm font-medium" }, e0 = { class: "hidden md:block text-left max-w-[160px] truncate" }, t0 = { class: "text-sm font-medium text-gray-900 truncate" }, a0 = { class: "text-xs text-gray-500 truncate leading-tight" }, n0 = {
   key: 0,
   class: "absolute right-0 mt-2 w-58 bg-white rounded-lg shadow-lg border border-gray-200 z-50"
-}, rv = { class: "p-4 border-b border-gray-200" }, sv = { class: "text-sm font-medium text-gray-900" }, lv = { class: "text-xs text-gray-500" }, ov = { class: "py-2" }, iv = {
+}, r0 = { class: "p-4 border-b border-gray-200" }, s0 = { class: "text-sm font-medium text-gray-900" }, l0 = { class: "text-xs text-gray-500" }, o0 = { class: "py-2" }, i0 = {
   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"
-}, uv = ["onClick"], dv = { 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" }, cv = { class: "flex-1 truncate font-semibold text-gray-700" }, fv = {
+}, u0 = ["onClick"], d0 = { 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" }, c0 = { class: "flex-1 truncate font-semibold text-gray-700" }, f0 = {
   __name: "Header",
   props: {
     sidebarWidth: { type: Number, default: 256 },
@@ -12239,9 +12251,9 @@ const Bd = {
                 i("div", Qg, [
                   i("span", Zg, p(w.value), 1)
                 ]),
-                i("div", ev, [
-                  i("p", tv, p(e.user.name), 1),
-                  i("p", av, p(k.value), 1)
+                i("div", e0, [
+                  i("p", t0, p(e.user.name), 1),
+                  i("p", a0, p(k.value), 1)
                 ]),
                 V[12] || (V[12] = i("svg", {
                   class: "w-4 h-4 text-gray-400",
@@ -12266,12 +12278,12 @@ const Bd = {
                 "leave-to-class": "opacity-0 translate-y-2 scale-95"
               }, {
                 default: R(() => [
-                  l.value ? (s(), u("div", nv, [
-                    i("div", rv, [
-                      i("p", sv, p(e.user.name), 1),
-                      i("p", lv, p(e.user.email), 1)
+                  l.value ? (s(), u("div", n0, [
+                    i("div", r0, [
+                      i("p", s0, p(e.user.name), 1),
+                      i("p", l0, p(e.user.email), 1)
                     ]),
-                    i("div", ov, [
+                    i("div", o0, [
                       (s(!0), u(K, null, X(e.profileMenuItems, (G) => (s(), u(K, {
                         key: G.name
                       }, [
@@ -12285,7 +12297,7 @@ const Bd = {
                           onClick: (le) => S(G)
                         }, {
                           default: R(() => [
-                            x(G) ? (s(), u("div", iv)) : h("", !0),
+                            x(G) ? (s(), u("div", i0)) : h("", !0),
                             i("div", {
                               class: v(N(C)(
                                 "flex items-center justify-center w-8 h-8 rounded-lg mr-3 flex-shrink-0 transition-colors ml-2",
@@ -12311,15 +12323,15 @@ const Bd = {
                           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: (le) => m(G)
                         }, [
-                          i("div", dv, [
+                          i("div", d0, [
                             G.icon ? (s(), _(Q, {
                               key: 0,
                               icon: G.icon,
                               class: "w-4 h-4"
                             }, null, 8, ["icon"])) : h("", !0)
                           ]),
-                          i("span", cv, p(G.label), 1)
-                        ], 8, uv))
+                          i("span", c0, p(G.label), 1)
+                        ], 8, u0))
                       ], 64))), 128))
                     ]),
                     i("div", { class: "border-t border-gray-200 py-2" }, [
@@ -12355,28 +12367,28 @@ const Bd = {
       ], 2);
     };
   }
-}, mv = { class: "mb-4" }, gv = { class: "text-lg font-semibold text-gray-900" }, vv = { class: "text-sm text-gray-600" }, bv = ["onUpdate:modelValue"], hv = {
+}, m0 = { class: "mb-4" }, g0 = { class: "text-lg font-semibold text-gray-900" }, v0 = { class: "text-sm text-gray-600" }, b0 = ["onUpdate:modelValue"], h0 = {
   value: "",
   disabled: ""
-}, yv = ["value"], pv = {
+}, y0 = ["value"], p0 = {
   key: 3,
   class: "flex items-center"
-}, xv = {
+}, x0 = {
   key: 4,
   class: "flex items-center"
-}, wv = ["id", "aria-checked", "disabled", "onClick"], kv = {
+}, w0 = ["id", "aria-checked", "disabled", "onClick"], k0 = {
   key: 5,
   class: "space-y-2"
-}, $v = {
+}, $0 = {
   key: 6,
   class: "space-y-2"
-}, Sv = {
+}, S0 = {
   key: 0,
   class: "text-xs text-gray-500"
-}, Cv = {
+}, C0 = {
   key: 8,
   class: "space-y-2"
-}, zv = { class: "flex items-center gap-4" }, Av = { class: "text-sm font-medium text-gray-700 min-w-[3rem] text-right" }, Bv = { class: "flex justify-end gap-3 pt-4" }, Pv = {
+}, z0 = { class: "flex items-center gap-4" }, A0 = { class: "text-sm font-medium text-gray-700 min-w-[3rem] text-right" }, B0 = { class: "flex justify-end gap-3 pt-4" }, P0 = {
   __name: "ReusableFormModal",
   props: {
     modelValue: {
@@ -12575,9 +12587,9 @@ const Bd = {
       onClose: x
     }, {
       default: R(() => [
-        i("div", mv, [
-          i("h2", gv, p(e.modalType === "create" ? `Add New ${e.entityName}` : `Edit ${e.entityName}`), 1),
-          i("p", vv, p(e.modalType === "create" ? `Fill in the details to create a new ${e.entityName.toLowerCase()}.` : `Update the ${e.entityName.toLowerCase()} information below.`), 1)
+        i("div", m0, [
+          i("h2", g0, p(e.modalType === "create" ? `Add New ${e.entityName}` : `Edit ${e.entityName}`), 1),
+          i("p", v0, p(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",
@@ -12590,7 +12602,7 @@ const Bd = {
               key: 0,
               "onUpdate:modelValue": (z) => l.value[d.name] = z,
               type: "hidden"
-            }, null, 8, bv)), [
+            }, null, 8, b0)), [
               [wt, l.value[d.name]]
             ]) : (s(), _(xr, {
               key: 1,
@@ -12638,14 +12650,14 @@ const Bd = {
                   "onUpdate:modelValue": (Y) => k(d, Y)
                 }, {
                   default: R(() => [
-                    i("option", hv, p(d.placeholder || "Select an option"), 1),
+                    i("option", h0, p(d.placeholder || "Select an option"), 1),
                     (s(!0), u(K, null, X(d.options, (Y) => (s(), u("option", {
                       key: Y.value,
                       value: Y.value
-                    }, p(Y.label), 9, yv))), 128))
+                    }, p(Y.label), 9, y0))), 128))
                   ]),
                   _: 2
-                }, 1032, ["id", "model-value", "disabled", "class", "aria-describedby", "onUpdate:modelValue"])) : d.type === "checkbox" ? (s(), u("div", pv, [
+                }, 1032, ["id", "model-value", "disabled", "class", "aria-describedby", "onUpdate:modelValue"])) : d.type === "checkbox" ? (s(), u("div", p0, [
                   B(Be, {
                     id: z,
                     modelValue: l.value[d.name],
@@ -12664,7 +12676,7 @@ const Bd = {
                     ]),
                     _: 2
                   }, 1032, ["for"])
-                ])) : d.type === "switch" ? (s(), u("div", xv, [
+                ])) : d.type === "switch" ? (s(), u("div", x0, [
                   i("button", {
                     id: z,
                     type: "button",
@@ -12684,7 +12696,7 @@ const Bd = {
                         l.value[d.name] ? "translate-x-6" : "translate-x-1"
                       ])
                     }, null, 2)
-                  ], 10, wv),
+                  ], 10, w0),
                   B(ot, {
                     for: z,
                     class: "ml-3 text-sm text-gray-700"
@@ -12694,7 +12706,7 @@ const Bd = {
                     ]),
                     _: 2
                   }, 1032, ["for"])
-                ])) : d.type === "radio" ? (s(), u("div", kv, [
+                ])) : d.type === "radio" ? (s(), u("div", k0, [
                   (s(!0), u(K, null, X(d.options, (Y) => (s(), u("div", {
                     key: Y.value,
                     class: "flex items-center"
@@ -12719,7 +12731,7 @@ const Bd = {
                       _: 2
                     }, 1032, ["for"])
                   ]))), 128))
-                ])) : d.type === "file" ? (s(), u("div", $v, [
+                ])) : d.type === "file" ? (s(), u("div", $0, [
                   B(Be, {
                     id: z,
                     type: "file",
@@ -12732,7 +12744,7 @@ const Bd = {
                     "aria-describedby": V,
                     onChange: (Y) => $(d, Y)
                   }, null, 8, ["id", "accept", "disabled", "class", "aria-describedby", "onChange"]),
-                  d.helpText ? (s(), u("p", Sv, p(d.helpText), 1)) : h("", !0)
+                  d.helpText ? (s(), u("p", S0, p(d.helpText), 1)) : h("", !0)
                 ])) : d.type === "slider" ? (s(), _($r, {
                   key: 7,
                   "model-value": l.value[d.name],
@@ -12741,8 +12753,8 @@ const Bd = {
                   step: d.step,
                   disabled: o.value || d.disabled,
                   "onUpdate:modelValue": (Y) => I(d, Y)
-                }, null, 8, ["model-value", "min", "max", "step", "disabled", "onUpdate:modelValue"])) : d.type === "range" ? (s(), u("div", Cv, [
-                  i("div", zv, [
+                }, null, 8, ["model-value", "min", "max", "step", "disabled", "onUpdate:modelValue"])) : d.type === "range" ? (s(), u("div", C0, [
+                  i("div", z0, [
                     B(Be, {
                       id: z,
                       modelValue: l.value[d.name],
@@ -12755,7 +12767,7 @@ const Bd = {
                       class: "flex-1",
                       "aria-describedby": V
                     }, null, 8, ["id", "modelValue", "onUpdate:modelValue", "min", "max", "step", "disabled", "aria-describedby"]),
-                    i("span", Av, p(l.value[d.name]), 1)
+                    i("span", A0, p(l.value[d.name]), 1)
                   ])
                 ])) : d.type === "date" ? (s(), _(Aa, {
                   key: 9,
@@ -12813,7 +12825,7 @@ const Bd = {
               _: 2
             }, 1032, ["id", "label", "required", "error", "error-message"]))
           ]))), 128)),
-          i("div", Bv, [
+          i("div", B0, [
             B(xe, {
               type: "button",
               variant: "outline",
@@ -12842,37 +12854,37 @@ const Bd = {
       _: 1
     }, 8, ["modelValue", "size", "resizable"]));
   }
-}, Tv = {
+}, T0 = {
   key: 0,
   class: "flex items-center justify-between p-4 border-b border-gray-200 flex-shrink-0 lg:hidden"
-}, Iv = { class: "text-lg font-bold text-gray-900" }, jv = { class: "flex-1 overflow-y-auto overflow-x-hidden p-4" }, Vv = { class: "space-y-2" }, Ov = { key: 0 }, Fv = {
+}, I0 = { class: "text-lg font-bold text-gray-900" }, j0 = { class: "flex-1 overflow-y-auto overflow-x-hidden p-4" }, V0 = { class: "space-y-2" }, O0 = { key: 0 }, F0 = {
   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"
-}, Mv = ["onClick"], Dv = {
+}, M0 = ["onClick"], D0 = {
   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"
-}, Ev = {
+}, E0 = {
   key: 1,
   class: "absolute top-1.5 right-1.5 w-2 h-2 bg-blue-500 rounded-full"
-}, Lv = {
+}, L0 = {
   key: 1,
   class: "border-t border-gray-200 p-4 flex-shrink-0"
-}, Nv = {
+}, N0 = {
   key: 0,
   class: "absolute top-1.5 right-1.5 w-2 h-2 bg-blue-500 rounded-full"
-}, Rv = { class: "sticky top-0 bg-white border-b border-gray-200 z-10" }, _v = { class: "flex items-center justify-between p-4" }, qv = { class: "flex-1 text-sm font-bold text-gray-900 ml-2" }, Uv = { class: "p-3" }, Wv = { class: "space-y-1" }, Yv = {
+}, R0 = { class: "sticky top-0 bg-white border-b border-gray-200 z-10" }, _0 = { class: "flex items-center justify-between p-4" }, q0 = { class: "flex-1 text-sm font-bold text-gray-900 ml-2" }, U0 = { class: "p-3" }, W0 = { class: "space-y-1" }, Y0 = {
   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"
-}, Hv = {
+}, H0 = {
   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"
-}, Gv = { class: "p-3" }, Kv = { class: "space-y-1" }, Xv = {
+}, G0 = { class: "p-3" }, K0 = { class: "space-y-1" }, X0 = {
   key: 0,
   class: "px-3 py-2 text-xs font-semibold text-gray-500 uppercase tracking-wider"
-}, Jv = {
+}, J0 = {
   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"
-}, Qv = {
+}, Q0 = {
   __name: "Sidebar",
   props: {
     sidebarWidth: {
@@ -12995,8 +13007,8 @@ const Bd = {
           )),
           style: me({ width: e.sidebarWidth + "px", top: o.value ? "0px" : "4rem" })
         }, [
-          o.value ? (s(), u("div", Tv, [
-            i("h2", Iv, p(e.header?.title), 1),
+          o.value ? (s(), u("div", T0, [
+            i("h2", I0, p(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",
@@ -13017,12 +13029,12 @@ const Bd = {
               ], -1)
             ])])
           ])) : h("", !0),
-          i("nav", jv, [
-            i("div", Vv, [
+          i("nav", j0, [
+            i("div", V0, [
               (s(!0), u(K, null, X(e.navigationItems, (A) => (s(), u(K, {
                 key: A.name || A.label
               }, [
-                A.type === "link" ? (s(), u("div", Ov, [
+                A.type === "link" ? (s(), u("div", O0, [
                   x(A) ? (s(), u("div", {
                     key: 1,
                     class: v(N(C)(
@@ -13049,9 +13061,9 @@ const Bd = {
                         G(A) ? "text-blue-700 font-semibold" : "text-gray-500 group-hover:text-gray-900"
                       ))
                     }, p(A.label), 3),
-                    A.badge ? (s(), u("span", Dv, p(A.badge), 1)) : h("", !0),
-                    G(A) && x(A) ? (s(), u("div", Ev)) : h("", !0)
-                  ], 10, Mv)) : (s(), _(J, {
+                    A.badge ? (s(), u("span", D0, p(A.badge), 1)) : h("", !0),
+                    G(A) && x(A) ? (s(), u("div", E0)) : h("", !0)
+                  ], 10, M0)) : (s(), _(J, {
                     key: 0,
                     to: A.route,
                     class: v(N(C)(
@@ -13079,7 +13091,7 @@ const Bd = {
                           G(A) ? "text-blue-700 font-semibold" : "text-gray-500 group-hover:text-gray-900"
                         ))
                       }, p(A.label), 3),
-                      A.badge ? (s(), u("span", Fv, p(A.badge), 1)) : h("", !0)
+                      A.badge ? (s(), u("span", F0, p(A.badge), 1)) : h("", !0)
                     ]),
                     _: 2
                   }, 1032, ["to", "class", "onClick"]))
@@ -13087,7 +13099,7 @@ const Bd = {
               ], 64))), 128))
             ])
           ]),
-          e.showManagementSettings ? (s(), u("div", Lv, [
+          e.showManagementSettings ? (s(), u("div", L0, [
             i("div", {
               class: v(N(C)(
                 "flex flex-col items-center justify-center rounded-xl transition-all duration-200 cursor-pointer group relative py-4 px-3",
@@ -13113,7 +13125,7 @@ const Bd = {
                   e.isManagementSettingsActive ? "text-blue-700 font-semibold" : "text-gray-500 group-hover:text-gray-900"
                 ))
               }, " Settings ", 2),
-              e.isManagementSettingsActive ? (s(), u("div", Nv)) : h("", !0)
+              e.isManagementSettingsActive ? (s(), u("div", N0)) : h("", !0)
             ], 2)
           ])) : h("", !0)
         ], 6),
@@ -13136,8 +13148,8 @@ const Bd = {
               ),
               style: me(w.value)
             }, [
-              i("div", Rv, [
-                i("div", _v, [
+              i("div", R0, [
+                i("div", _0, [
                   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",
@@ -13157,11 +13169,11 @@ const Bd = {
                       })
                     ], -1)
                   ])]),
-                  i("h3", qv, p(c.value?.label), 1)
+                  i("h3", q0, p(c.value?.label), 1)
                 ])
               ]),
-              i("nav", Uv, [
-                i("div", Wv, [
+              i("nav", U0, [
+                i("div", W0, [
                   (s(!0), u(K, null, X(c.value?.subItems, (A) => (s(), _(J, {
                     key: A.name,
                     to: A.route,
@@ -13174,7 +13186,7 @@ const Bd = {
                     onClick: (M) => V(A)
                   }, {
                     default: R(() => [
-                      G(A) ? (s(), u("div", Yv)) : h("", !0),
+                      G(A) ? (s(), u("div", Y0)) : h("", !0),
                       i("div", {
                         class: v(
                           N(C)(
@@ -13195,7 +13207,7 @@ const Bd = {
                           G(A) ? "text-blue-700" : "text-gray-700"
                         ))
                       }, p(A.label), 3),
-                      A.badge ? (s(), u("span", Hv, p(A.badge), 1)) : h("", !0)
+                      A.badge ? (s(), u("span", H0, p(A.badge), 1)) : h("", !0)
                     ]),
                     _: 2
                   }, 1032, ["to", "class", "onClick"]))), 128))
@@ -13248,12 +13260,12 @@ const Bd = {
                   Z[3] || (Z[3] = i("h3", { class: "flex-1 text-sm font-bold text-gray-900 ml-2" }, " Management Settings ", -1))
                 ])
               ]),
-              i("nav", Gv, [
-                i("div", Kv, [
+              i("nav", G0, [
+                i("div", K0, [
                   (s(!0), u(K, null, X(e.managementSettings, (A) => (s(), u(K, {
                     key: A.name
                   }, [
-                    A.type === "section" ? (s(), u("div", Xv, p(A.label), 1)) : A.route ? (s(), _(J, {
+                    A.type === "section" ? (s(), u("div", X0, p(A.label), 1)) : A.route ? (s(), _(J, {
                       key: 1,
                       to: A.route,
                       class: v(
@@ -13265,7 +13277,7 @@ const Bd = {
                       onClick: (M) => Y(A)
                     }, {
                       default: R(() => [
-                        G(A) ? (s(), u("div", Jv)) : h("", !0),
+                        G(A) ? (s(), u("div", J0)) : h("", !0),
                         i("div", {
                           class: v(
                             N(C)(
@@ -13316,7 +13328,7 @@ const Bd = {
       ]);
     };
   }
-}, Zv = {
+}, Z0 = {
   __name: "Timeline",
   props: {
     orientation: {
@@ -13335,13 +13347,13 @@ const Bd = {
       O(a.$slots, "default")
     ], 2));
   }
-}, e0 = {
+}, ev = {
   key: 0,
   class: "absolute left-3 top-0 w-0.5 h-full bg-slate-200"
-}, t0 = { class: "z-10 flex items-center justify-center w-6 h-6 rounded-full border-2 border-blue-500 bg-white text-blue-500" }, a0 = { class: "text-slate-900 font-medium" }, n0 = {
+}, tv = { class: "z-10 flex items-center justify-center w-6 h-6 rounded-full border-2 border-blue-500 bg-white text-blue-500" }, av = { class: "text-slate-900 font-medium" }, nv = {
   key: 0,
   class: "text-slate-500 text-sm"
-}, r0 = { class: "mt-2 text-slate-600 text-sm" }, s0 = {
+}, rv = { class: "mt-2 text-slate-600 text-sm" }, sv = {
   __name: "TimelineItem",
   props: {
     title: {
@@ -13365,8 +13377,8 @@ const Bd = {
         e.orientation === "vertical" ? "items-start mb-8 last:mb-0" : "flex-col items-center mx-8 last:mx-0"
       ])
     }, [
-      e.orientation === "vertical" ? (s(), u("div", e0)) : h("", !0),
-      i("div", t0, [
+      e.orientation === "vertical" ? (s(), u("div", ev)) : h("", !0),
+      i("div", tv, [
         O(a.$slots, "icon", {}, () => [
           t[0] || (t[0] = i("div", { class: "w-2 h-2 rounded-full bg-blue-500" }, null, -1))
         ])
@@ -13377,23 +13389,23 @@ const Bd = {
           e.orientation === "horizontal" ? "mt-2 text-center" : ""
         ])
       }, [
-        i("h3", a0, [
+        i("h3", av, [
           O(a.$slots, "title", {}, () => [
             te(p(e.title), 1)
           ])
         ]),
-        e.subtitle ? (s(), u("p", n0, [
+        e.subtitle ? (s(), u("p", nv, [
           O(a.$slots, "subtitle", {}, () => [
             te(p(e.subtitle), 1)
           ])
         ])) : h("", !0),
-        i("div", r0, [
+        i("div", rv, [
           O(a.$slots, "default")
         ])
       ], 2)
     ], 2));
   }
-}, l0 = {
+}, lv = {
   name: "AuthLayout",
   props: {
     title: {
@@ -13482,20 +13494,20 @@ const Bd = {
       currentYear: b(() => (/* @__PURE__ */ new Date()).getFullYear())
     };
   }
-}, o0 = { class: "container mx-auto px-4 relative z-10" }, i0 = { class: "grid lg:grid-cols-10 gap-8 items-center min-h-screen" }, u0 = { class: "lg:col-span-6 text-white text-center lg:text-left space-y-6" }, d0 = { class: "mb-6" }, c0 = { class: "text-4xl lg:text-6xl font-bold mb-2" }, f0 = { class: "text-white" }, m0 = { class: "flex items-center justify-center lg:justify-start mb-6" }, g0 = { class: "text-3xl lg:text-4xl font-bold text-white" }, v0 = { class: "lg:col-span-4" }, b0 = { class: "bg-white rounded-lg shadow-xl p-6 lg:p-8 max-w-md mx-auto" }, h0 = {
+}, ov = { class: "container mx-auto px-4 relative z-10" }, iv = { class: "grid lg:grid-cols-10 gap-8 items-center min-h-screen" }, uv = { class: "lg:col-span-6 text-white text-center lg:text-left space-y-6" }, dv = { class: "mb-6" }, cv = { class: "text-4xl lg:text-6xl font-bold mb-2" }, fv = { class: "text-white" }, mv = { class: "flex items-center justify-center lg:justify-start mb-6" }, gv = { class: "text-3xl lg:text-4xl font-bold text-white" }, vv = { class: "lg:col-span-4" }, bv = { class: "bg-white rounded-lg shadow-xl p-6 lg:p-8 max-w-md mx-auto" }, hv = {
   key: 0,
   class: "mb-6"
-}, y0 = { class: "text-center" }, p0 = { class: "text-2xl font-bold text-gray-900" }, x0 = {
+}, yv = { class: "text-center" }, pv = { class: "text-2xl font-bold text-gray-900" }, xv = {
   key: 0,
   class: "text-gray-600 mt-2"
-}, w0 = { class: "space-y-6" }, k0 = {
+}, wv = { class: "space-y-6" }, kv = {
   key: 1,
   class: "mt-6"
-}, $0 = {
+}, $v = {
   key: 0,
   class: "mt-6 text-center"
-}, S0 = { class: "absolute bottom-4 right-4 text-right" }, C0 = { class: "flex items-end justify-end mb-2" }, z0 = { class: "text-right mr-3" }, A0 = { class: "text-red-500 font-bold text-xs" }, B0 = { class: "text-white text-xs" }, P0 = { class: "text-white/70 text-xs" }, T0 = { class: "w-8 h-8 bg-red-500 rounded flex items-center justify-center text-white font-bold text-xs" }, I0 = { class: "text-white/70 text-xs" }, j0 = { class: "absolute bottom-4 left-4 flex gap-2" }, V0 = ["href"];
-function O0(e, a, t, n, r, o) {
+}, Sv = { class: "absolute bottom-4 right-4 text-right" }, Cv = { class: "flex items-end justify-end mb-2" }, zv = { class: "text-right mr-3" }, Av = { class: "text-red-500 font-bold text-xs" }, Bv = { class: "text-white text-xs" }, Pv = { class: "text-white/70 text-xs" }, Tv = { class: "w-8 h-8 bg-red-500 rounded flex items-center justify-center text-white font-bold text-xs" }, Iv = { class: "text-white/70 text-xs" }, jv = { class: "absolute bottom-4 left-4 flex gap-2" }, Vv = ["href"];
+function Ov(e, a, t, n, r, o) {
   const l = fe("router-view"), c = fe("font-awesome-icon");
   return s(), u("div", {
     class: "min-h-screen relative flex items-center justify-center",
@@ -13508,70 +13520,70 @@ function O0(e, a, t, n, r, o) {
         opacity: t.backgroundOpacity
       })
     }, null, 4),
-    i("div", o0, [
-      i("div", i0, [
-        i("div", u0, [
-          i("div", d0, [
-            i("div", c0, [
+    i("div", ov, [
+      i("div", iv, [
+        i("div", uv, [
+          i("div", dv, [
+            i("div", cv, [
               i("span", {
                 style: me({ color: t.primaryColor })
               }, p(t.primaryLogoPrefix), 5),
-              i("span", f0, p(t.primaryLogoText), 1)
+              i("span", fv, p(t.primaryLogoText), 1)
             ]),
             i("div", {
               class: "h-0.5 w-30 mx-auto lg:mx-0",
               style: me({ backgroundColor: t.primaryColor })
             }, null, 4)
           ]),
-          i("div", m0, [
+          i("div", mv, [
             i("div", {
               class: "flex items-center justify-center w-15 h-15 rounded-lg mr-4 text-white font-bold text-xl",
               style: me({ backgroundColor: t.primaryColor })
             }, p(t.secondaryLogoPrefix), 5),
-            i("span", g0, p(t.secondaryLogoText), 1)
+            i("span", gv, p(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", v0, [
-          i("div", b0, [
-            e.$slots["card-header"] || t.title ? (s(), u("div", h0, [
+        i("div", vv, [
+          i("div", bv, [
+            e.$slots["card-header"] || t.title ? (s(), u("div", hv, [
               O(e.$slots, "card-header", {}, () => [
-                i("div", y0, [
-                  i("h1", p0, p(t.title), 1),
-                  t.subtitle ? (s(), u("p", x0, p(t.subtitle), 1)) : h("", !0)
+                i("div", yv, [
+                  i("h1", pv, p(t.title), 1),
+                  t.subtitle ? (s(), u("p", xv, p(t.subtitle), 1)) : h("", !0)
                 ])
               ])
             ])) : h("", !0),
-            i("div", w0, [
+            i("div", wv, [
               B(l)
             ]),
-            e.$slots["card-footer"] ? (s(), u("div", k0, [
+            e.$slots["card-footer"] ? (s(), u("div", kv, [
               O(e.$slots, "card-footer")
             ])) : h("", !0)
           ]),
-          e.$slots.links ? (s(), u("div", $0, [
+          e.$slots.links ? (s(), u("div", $v, [
             O(e.$slots, "links")
           ])) : h("", !0)
         ])
       ])
     ]),
-    i("div", S0, [
-      i("div", C0, [
-        i("div", z0, [
-          i("div", A0, p(t.companyName), 1),
-          i("div", B0, p(t.companyType), 1),
-          i("div", P0, p(t.companyTagline), 1)
+    i("div", Sv, [
+      i("div", Cv, [
+        i("div", zv, [
+          i("div", Av, p(t.companyName), 1),
+          i("div", Bv, p(t.companyType), 1),
+          i("div", Pv, p(t.companyTagline), 1)
         ]),
-        i("div", T0, p(t.companyInitials), 1)
+        i("div", Tv, p(t.companyInitials), 1)
       ]),
-      i("div", I0, [
+      i("div", Iv, [
         i("div", null, p(t.appName) + " (" + p(t.appVersion) + ")", 1),
         i("div", null, p(t.copyright), 1)
       ])
     ]),
-    i("div", j0, [
+    i("div", jv, [
       (s(!0), u(K, null, X(t.socialLinks, (f) => (s(), u("a", {
         key: f.name,
         href: f.url,
@@ -13583,14 +13595,14 @@ function O0(e, a, t, n, r, o) {
         B(c, {
           icon: ["fab", f.icon]
         }, null, 8, ["icon"])
-      ], 10, V0))), 128))
+      ], 10, Vv))), 128))
     ])
   ], 4);
 }
-const F0 = /* @__PURE__ */ jt(l0, [["render", O0]]), M0 = { class: "min-h-screen bg-gray-50" }, D0 = { class: "flex-1" }, E0 = {
+const Fv = /* @__PURE__ */ jt(lv, [["render", Ov]]), Mv = { class: "min-h-screen bg-gray-50" }, Dv = { class: "flex-1" }, Ev = {
   key: 0,
   class: "bg-white border-b border-gray-200"
-}, L0 = { class: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4" }, N0 = { class: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8" }, R0 = {
+}, Lv = { class: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4" }, Nv = { class: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8" }, Rv = {
   __name: "DefaultLayout",
   props: {
     navigationItems: {
@@ -13614,7 +13626,7 @@ const F0 = /* @__PURE__ */ jt(l0, [["render", O0]]), M0 = { class: "min-h-screen
   setup(e) {
     return (a, t) => {
       const n = fe("Logo"), r = fe("MainNavigation"), o = fe("Button"), l = fe("Header"), c = fe("Breadcrumb"), f = fe("Text"), y = fe("Footer");
-      return s(), u("div", M0, [
+      return s(), u("div", Mv, [
         B(l, null, {
           logo: R(() => [
             O(a.$slots, "logo", {}, () => [
@@ -13647,15 +13659,15 @@ const F0 = /* @__PURE__ */ jt(l0, [["render", O0]]), M0 = { class: "min-h-screen
           ]),
           _: 3
         }),
-        i("main", D0, [
-          e.showBreadcrumb ? (s(), u("div", E0, [
-            i("div", L0, [
+        i("main", Dv, [
+          e.showBreadcrumb ? (s(), u("div", Ev, [
+            i("div", Lv, [
               O(a.$slots, "breadcrumb", {}, () => [
                 B(c, { items: e.breadcrumbItems }, null, 8, ["items"])
               ])
             ])
           ])) : h("", !0),
-          i("div", N0, [
+          i("div", Nv, [
             O(a.$slots, "default")
           ])
         ]),
@@ -13676,7 +13688,7 @@ const F0 = /* @__PURE__ */ jt(l0, [["render", O0]]), M0 = { class: "min-h-screen
       ]);
     };
   }
-}, _0 = {
+}, _v = {
   name: "ErrorLayout",
   props: {
     errorType: {
@@ -13942,13 +13954,13 @@ const F0 = /* @__PURE__ */ jt(l0, [["render", O0]]), M0 = { class: "min-h-screen
       helpClasses: oe
     };
   }
-}, q0 = { class: "flex justify-center" }, U0 = { class: "flex items-center gap-3" }, W0 = { class: "text-2xl font-bold text-slate-900" }, Y0 = {
+}, qv = { class: "flex justify-center" }, Uv = { class: "flex items-center gap-3" }, Wv = { class: "text-2xl font-bold text-slate-900" }, Yv = {
   key: 1,
   class: "bg-red-100 border border-red-200 rounded-lg p-4 mx-auto max-w-md mb-6"
-}, H0 = { class: "flex flex-col sm:flex-row gap-4 justify-center" }, G0 = ["disabled"], K0 = {
+}, Hv = { class: "flex flex-col sm:flex-row gap-4 justify-center" }, Gv = ["disabled"], Kv = {
   key: 0,
   class: "animate-spin"
-}, X0 = { key: 1 }, J0 = ["disabled"], Q0 = { key: 0 }, Z0 = { key: 1 }, eb = {
+}, Xv = { key: 1 }, Jv = ["disabled"], Qv = { key: 0 }, Zv = { key: 1 }, eb = {
   key: 0,
   class: "mt-8 max-w-md mx-auto"
 }, tb = { class: "bg-white rounded-lg border border-slate-200 shadow-sm p-6" }, ab = { class: "text-lg font-semibold text-slate-900 mb-4" }, nb = { class: "space-y-3" }, rb = { class: "text-sm text-slate-600" }, sb = ["href"], lb = {
@@ -13975,13 +13987,13 @@ function ob(e, a, t, n, r, o) {
         class: v(n.headerClasses)
       }, [
         O(e.$slots, "header", {}, () => [
-          i("div", q0, [
+          i("div", qv, [
             O(e.$slots, "logo", {}, () => [
-              i("div", U0, [
+              i("div", Uv, [
                 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", W0, p(t.brandName), 1)
+                i("span", Wv, p(t.brandName), 1)
               ])
             ])
           ])
@@ -14027,7 +14039,7 @@ function ob(e, a, t, n, r, o) {
             ])
           ], 2)
         ], 2),
-        n.isOnline ? h("", !0) : (s(), u("div", Y0, [...a[6] || (a[6] = [
+        n.isOnline ? h("", !0) : (s(), u("div", Yv, [...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")
@@ -14038,7 +14050,7 @@ function ob(e, a, t, n, r, o) {
           class: v(n.actionsClasses)
         }, [
           O(e.$slots, "actions", {}, () => [
-            i("div", H0, [
+            i("div", Hv, [
               t.showHomeButton ? (s(), u("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",
@@ -14061,18 +14073,18 @@ function ob(e, a, t, n, r, o) {
                 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] = (...l) => n.retry && n.retry(...l))
               }, [
-                n.isRetrying ? (s(), u("span", K0, "↻")) : (s(), u("span", X0, "🔄")),
+                n.isRetrying ? (s(), u("span", Kv, "↻")) : (s(), u("span", Xv, "🔄")),
                 te(" " + p(n.isRetrying ? "Retrying..." : t.retryButtonText), 1)
-              ], 8, G0)) : h("", !0),
+              ], 8, Gv)) : h("", !0),
               t.showSupportButton ? (s(), u("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] = (l) => e.$emit("contact-support"))
               }, [
-                n.reportSent ? (s(), u("span", Q0, "✓")) : (s(), u("span", Z0, "📝")),
+                n.reportSent ? (s(), u("span", Qv, "✓")) : (s(), u("span", Zv, "📝")),
                 te(" " + p(n.reportSent ? "Report Sent" : "Contact Support"), 1)
-              ], 8, J0)) : h("", !0)
+              ], 8, Jv)) : h("", !0)
             ])
           ])
         ], 2)) : h("", !0),
@@ -14122,7 +14134,7 @@ function ob(e, a, t, n, r, o) {
     ], 2)
   ], 2);
 }
-const ib = /* @__PURE__ */ jt(_0, [["render", ob]]), un = {
+const ib = /* @__PURE__ */ jt(_v, [["render", ob]]), un = {
   mounted(e, a) {
     if (!a.value) return;
     const t = Object.keys(a.modifiers)[0] || "top", n = document.createElement("div");
@@ -14302,13 +14314,13 @@ const ib = /* @__PURE__ */ jt(_0, [["render", ob]]), un = {
   DataTableFilters: ug,
   DataTableToolBar: Cg,
   Footer: Vg,
-  Header: fv,
-  ReusableFormModal: Pv,
-  Sidebar: Qv,
-  Timeline: Zv,
-  TimelineItem: s0,
-  AuthLayout: F0,
-  DefaultLayout: R0,
+  Header: f0,
+  ReusableFormModal: P0,
+  Sidebar: Q0,
+  Timeline: Z0,
+  TimelineItem: sv,
+  AuthLayout: Fv,
+  DefaultLayout: Rv,
   ErrorLayout: ib
 }, fb = {
   install(e, a = {}) {
@@ -14323,7 +14335,7 @@ export {
   $c as Accordion,
   Sc as AccordionItem,
   au as Alert,
-  F0 as AuthLayout,
+  Fv as AuthLayout,
   si as Avatar,
   oi as Badge,
   Zc as BarChart,
@@ -14347,7 +14359,7 @@ export {
   Cr as DataTableRow,
   Cg as DataTableToolBar,
   Aa as DatePicker,
-  R0 as DefaultLayout,
+  Rv as DefaultLayout,
   hi as Divider,
   Eu as Dropdown,
   Nu as DropdownItem,
@@ -14357,7 +14369,7 @@ export {
   xr as FormField,
   Nc as Graph,
   Tf as GraphFilters,
-  fv as Header,
+  f0 as Header,
   Q as Icon,
   wi as Image,
   Be as Input,
@@ -14378,10 +14390,10 @@ export {
   Vi as Progress,
   Fi as ProgressBar,
   qi as Radio,
-  Pv as ReusableFormModal,
+  P0 as ReusableFormModal,
   Zd as Search,
   Me as Select,
-  Qv as Sidebar,
+  Q0 as Sidebar,
   $r as Slider,
   za as Spinner,
   rc as Stepper,
@@ -14391,8 +14403,8 @@ export {
   hc as TabPanel,
   Hi as Text,
   yr as Textarea,
-  Zv as Timeline,
-  s0 as TimelineItem,
+  Z0 as Timeline,
+  sv as TimelineItem,
   Ed as Toast,
   pr as Tooltip,
   ia as Typography,