cisse-vue-ui 0.5.17 → 0.5.22

package/dist/{Timeline.vue_vue_type_script_setup_true_lang-CqeiZOID.cjs → DarkModeToggle.vue_vue_type_script_setup_true_lang-BoB48313.cjs}

@@ -1,11 +1,16 @@
 "use strict";
 const vue = require("vue");
-const Checkbox_vue_vue_type_script_setup_true_lang = require("./Checkbox.vue_vue_type_script_setup_true_lang-DIoHDji4.cjs");
+const index = require("./index-D7HVSFi2.cjs");
+const Button_vue_vue_type_script_setup_true_lang = require("./Button.vue_vue_type_script_setup_true_lang-DrGM65ny.cjs");
 const BadgeType_vue_vue_type_script_setup_true_lang = require("./BadgeType.vue_vue_type_script_setup_true_lang-CJb63H1I.cjs");
 const vue$1 = require("@iconify/vue");
 const useDropdown = require("./useDropdown-DHFnd259.cjs");
-const _hoisted_1$c = { class: "flex flex-col overflow-hidden rounded-lg bg-white shadow-md dark:bg-slate-950" };
-const _hoisted_2$9 = { class: "flex flex-col gap-0.5" };
+const useDarkMode = require("./useDarkMode-DLZcJEUQ.cjs");
+const _hoisted_1$d = {
+  key: 1,
+  class: "flex flex-col overflow-hidden rounded-lg bg-white shadow-md dark:bg-slate-950"
+};
+const _hoisted_2$a = { class: "flex flex-col gap-0.5" };
 const _hoisted_3$7 = {
   key: 1,
   class: "text-sm font-normal text-gray-600 dark:text-gray-400"
@@ -17,7 +22,11 @@ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
     title: {},
     description: {},
     titleClass: {},
-    dividerClass: {}
+    dividerClass: {},
+    loading: { type: Boolean, default: false },
+    loadingLines: { default: 3 },
+    loadingAvatar: { type: Boolean, default: false },
+    loadingActions: { type: Boolean, default: false }
   },
   setup(__props) {
     const props = __props;
@@ -28,7 +37,12 @@ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
       () => props.dividerClass || "border-gray-200 dark:border-gray-700"
     );
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$c, [
+      return __props.loading ? (vue.openBlock(), vue.createBlock(Button_vue_vue_type_script_setup_true_lang._sfc_main$2, {
+        key: 0,
+        lines: __props.loadingLines,
+        "show-avatar": __props.loadingAvatar,
+        "show-actions": __props.loadingActions
+      }, null, 8, ["lines", "show-avatar", "show-actions"])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$d, [
         _ctx.$slots.header ? (vue.openBlock(), vue.createElementBlock("div", {
           key: 0,
           class: vue.normalizeClass(["border-b", dividerClasses.value])
@@ -38,7 +52,7 @@ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
           key: 1,
           class: vue.normalizeClass(["flex items-center justify-between border-b px-5 py-3", dividerClasses.value])
         }, [
-          vue.createElementVNode("div", _hoisted_2$9, [
+          vue.createElementVNode("div", _hoisted_2$a, [
             __props.title || _ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock("span", {
               key: 0,
               class: vue.normalizeClass(["text-md font-semibold", titleClasses.value])
@@ -58,12 +72,15 @@ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
           ])
         ], 2)) : vue.createCommentVNode("", true),
         vue.renderSlot(_ctx.$slots, "default")
-      ]);
+      ]));
     };
   }
 });
-const _hoisted_1$b = { class: "overflow-hidden" };
-const _hoisted_2$8 = { class: "overflow-x-auto" };
+const _hoisted_1$c = { class: "overflow-hidden" };
+const _hoisted_2$9 = {
+  key: 1,
+  class: "overflow-x-auto"
+};
 const _hoisted_3$6 = { class: "w-full divide-y divide-black/10 text-left dark:divide-white/10" };
 const _hoisted_4$5 = { class: "bg-black/5 text-sm font-semibold text-gray-600 uppercase dark:bg-white/5 dark:text-gray-400" };
 const _hoisted_5$3 = {
@@ -103,7 +120,9 @@ const _sfc_main$h = /* @__PURE__ */ vue.defineComponent({
     selectableFilter: {},
     keyField: { default: "id" },
     sortBy: {},
-    sortDirection: {}
+    sortDirection: {},
+    loading: { type: Boolean, default: false },
+    loadingRows: { default: 5 }
   },
   emits: ["select", "selectAll", "sort"],
   setup(__props, { emit: __emit }) {
@@ -192,13 +211,17 @@ const _sfc_main$h = /* @__PURE__ */ vue.defineComponent({
       return props.sortBy === property.name;
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [
-        vue.createElementVNode("div", _hoisted_2$8, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$c, [
+        __props.loading ? (vue.openBlock(), vue.createBlock(Button_vue_vue_type_script_setup_true_lang._sfc_main$1, {
+          key: 0,
+          rows: __props.loadingRows,
+          columns: visibleProperties.value.length
+        }, null, 8, ["rows", "columns"])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$9, [
           vue.createElementVNode("table", _hoisted_3$6, [
             vue.createElementVNode("thead", _hoisted_4$5, [
               vue.createElementVNode("tr", null, [
                 __props.selectable ? (vue.openBlock(), vue.createElementBlock("th", _hoisted_5$3, [
-                  vue.createVNode(Checkbox_vue_vue_type_script_setup_true_lang._sfc_main, {
+                  vue.createVNode(index._sfc_main, {
                     "model-value": allSelected.value,
                     indeterminate: someSelected.value,
                     disabled: selectableItems.value.length === 0,
@@ -257,7 +280,7 @@ const _sfc_main$h = /* @__PURE__ */ vue.defineComponent({
                   class: vue.normalizeClass(["hover:bg-black/5 dark:hover:bg-white/5 transition-colors", { "bg-primary/5 dark:bg-primary/10": isSelected(item) }])
                 }, [
                   __props.selectable ? (vue.openBlock(), vue.createElementBlock("td", _hoisted_11$1, [
-                    isSelectable(item) ? (vue.openBlock(), vue.createBlock(Checkbox_vue_vue_type_script_setup_true_lang._sfc_main, {
+                    isSelectable(item) ? (vue.openBlock(), vue.createBlock(index._sfc_main, {
                       key: 0,
                       "model-value": isSelected(item),
                       "onUpdate:modelValue": ($event) => handleSelect(item)
@@ -290,17 +313,17 @@ const _sfc_main$h = /* @__PURE__ */ vue.defineComponent({
                 ], 2);
               }), 128))
             ])
-          ])
-        ]),
-        !__props.items || __props.items.length === 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_13, [
-          vue.renderSlot(_ctx.$slots, "empty")
-        ])) : vue.createCommentVNode("", true)
+          ]),
+          !__props.items || __props.items.length === 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_13, [
+            vue.renderSlot(_ctx.$slots, "empty")
+          ])) : vue.createCommentVNode("", true)
+        ]))
       ]);
     };
   }
 });
-const _hoisted_1$a = { class: "space-y-3" };
-const _hoisted_2$7 = { class: "flex items-center gap-3 p-3" };
+const _hoisted_1$b = { class: "space-y-3" };
+const _hoisted_2$8 = { class: "flex items-center gap-3 p-3" };
 const _hoisted_3$5 = { class: "text-sm text-gray-600 dark:text-gray-400" };
 const _hoisted_4$4 = {
   key: 0,
@@ -325,7 +348,9 @@ const _sfc_main$g = /* @__PURE__ */ vue.defineComponent({
     keyField: { default: "id" },
     selectable: { type: Boolean, default: false },
     selectedItems: {},
-    selectableFilter: {}
+    selectableFilter: {},
+    loading: { type: Boolean, default: false },
+    loadingItems: { default: 5 }
   },
   emits: ["select", "selectAll"],
   setup(__props, { emit: __emit }) {
@@ -365,257 +390,68 @@ const _sfc_main$g = /* @__PURE__ */ vue.defineComponent({
     };
     const hasEmptySlot = vue.computed(() => !!slots.empty);
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [
-        __props.selectable && selectableItems.value.length > 0 ? (vue.openBlock(), vue.createBlock(_sfc_main$i, { key: 0 }, {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [
+        __props.loading ? (vue.openBlock(), vue.createBlock(_sfc_main$i, { key: 0 }, {
           default: vue.withCtx(() => [
-            vue.createElementVNode("div", _hoisted_2$7, [
-              vue.createVNode(Checkbox_vue_vue_type_script_setup_true_lang._sfc_main, {
-                "model-value": allSelected.value,
-                indeterminate: someSelected.value,
-                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => emit("selectAll"))
-              }, null, 8, ["model-value", "indeterminate"]),
-              vue.createElementVNode("span", _hoisted_3$5, vue.toDisplayString(allSelected.value ? "Tout désélectionner" : "Tout sélectionner"), 1),
-              __props.selectedItems && __props.selectedItems.size > 0 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$4, " (" + vue.toDisplayString(__props.selectedItems.size) + " sélectionné" + vue.toDisplayString(__props.selectedItems.size > 1 ? "s" : "") + ") ", 1)) : vue.createCommentVNode("", true)
-            ])
+            vue.createVNode(Button_vue_vue_type_script_setup_true_lang._sfc_main$3, {
+              items: __props.loadingItems,
+              "show-avatar": "",
+              "show-secondary": "",
+              "show-action": ""
+            }, null, 8, ["items"])
           ]),
           _: 1
-        })) : vue.createCommentVNode("", true),
-        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item) => {
-          return vue.openBlock(), vue.createBlock(_sfc_main$i, {
-            key: getKey(item),
-            class: vue.normalizeClass(["hover:shadow-lg transition-all duration-200", {
-              "ring-2 ring-primary": isSelected(item)
-            }])
-          }, {
+        })) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
+          __props.selectable && selectableItems.value.length > 0 ? (vue.openBlock(), vue.createBlock(_sfc_main$i, { key: 0 }, {
             default: vue.withCtx(() => [
-              vue.createElementVNode("div", _hoisted_5$2, [
-                __props.selectable ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$2, [
-                  isSelectable(item) ? (vue.openBlock(), vue.createBlock(Checkbox_vue_vue_type_script_setup_true_lang._sfc_main, {
-                    key: 0,
-                    "model-value": isSelected(item),
-                    "onUpdate:modelValue": ($event) => handleSelect(item)
-                  }, null, 8, ["model-value", "onUpdate:modelValue"])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$2))
-                ])) : vue.createCommentVNode("", true),
-                vue.renderSlot(_ctx.$slots, "avatar", { item }),
-                vue.createElementVNode("div", _hoisted_8$2, [
-                  vue.renderSlot(_ctx.$slots, "content", { item })
-                ]),
-                vue.createElementVNode("div", _hoisted_9$2, [
-                  vue.renderSlot(_ctx.$slots, "actions", { item })
-                ])
+              vue.createElementVNode("div", _hoisted_2$8, [
+                vue.createVNode(index._sfc_main, {
+                  "model-value": allSelected.value,
+                  indeterminate: someSelected.value,
+                  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => emit("selectAll"))
+                }, null, 8, ["model-value", "indeterminate"]),
+                vue.createElementVNode("span", _hoisted_3$5, vue.toDisplayString(allSelected.value ? "Tout désélectionner" : "Tout sélectionner"), 1),
+                __props.selectedItems && __props.selectedItems.size > 0 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$4, " (" + vue.toDisplayString(__props.selectedItems.size) + " sélectionné" + vue.toDisplayString(__props.selectedItems.size > 1 ? "s" : "") + ") ", 1)) : vue.createCommentVNode("", true)
               ])
             ]),
-            _: 2
-          }, 1032, ["class"]);
-        }), 128)),
-        __props.items.length === 0 && hasEmptySlot.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_10$1, [
-          vue.renderSlot(_ctx.$slots, "empty")
-        ])) : vue.createCommentVNode("", true)
+            _: 1
+          })) : vue.createCommentVNode("", true),
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item) => {
+            return vue.openBlock(), vue.createBlock(_sfc_main$i, {
+              key: getKey(item),
+              class: vue.normalizeClass(["hover:shadow-lg transition-all duration-200", {
+                "ring-2 ring-primary": isSelected(item)
+              }])
+            }, {
+              default: vue.withCtx(() => [
+                vue.createElementVNode("div", _hoisted_5$2, [
+                  __props.selectable ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$2, [
+                    isSelectable(item) ? (vue.openBlock(), vue.createBlock(index._sfc_main, {
+                      key: 0,
+                      "model-value": isSelected(item),
+                      "onUpdate:modelValue": ($event) => handleSelect(item)
+                    }, null, 8, ["model-value", "onUpdate:modelValue"])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$2))
+                  ])) : vue.createCommentVNode("", true),
+                  vue.renderSlot(_ctx.$slots, "avatar", { item }),
+                  vue.createElementVNode("div", _hoisted_8$2, [
+                    vue.renderSlot(_ctx.$slots, "content", { item })
+                  ]),
+                  vue.createElementVNode("div", _hoisted_9$2, [
+                    vue.renderSlot(_ctx.$slots, "actions", { item })
+                  ])
+                ])
+              ]),
+              _: 2
+            }, 1032, ["class"]);
+          }), 128)),
+          __props.items.length === 0 && hasEmptySlot.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_10$1, [
+            vue.renderSlot(_ctx.$slots, "empty")
+          ])) : vue.createCommentVNode("", true)
+        ], 64))
       ]);
     };
   }
 });
-const localProvidedStateMap = /* @__PURE__ */ new WeakMap();
-const injectLocal = /* @__NO_SIDE_EFFECTS__ */ (...args) => {
-  var _getCurrentInstance;
-  const key = args[0];
-  const instance = (_getCurrentInstance = vue.getCurrentInstance()) === null || _getCurrentInstance === void 0 ? void 0 : _getCurrentInstance.proxy;
-  const owner = instance !== null && instance !== void 0 ? instance : vue.getCurrentScope();
-  if (owner == null && !vue.hasInjectionContext()) throw new Error("injectLocal must be called in setup");
-  if (owner && localProvidedStateMap.has(owner) && key in localProvidedStateMap.get(owner)) return localProvidedStateMap.get(owner)[key];
-  return vue.inject(...args);
-};
-const isClient = typeof window !== "undefined" && typeof document !== "undefined";
-typeof WorkerGlobalScope !== "undefined" && globalThis instanceof WorkerGlobalScope;
-const toString = Object.prototype.toString;
-const isObject = (val) => toString.call(val) === "[object Object]";
-function increaseWithUnit(target, delta) {
-  var _target$match;
-  if (typeof target === "number") return target + delta;
-  const value = ((_target$match = target.match(/^-?\d+\.?\d*/)) === null || _target$match === void 0 ? void 0 : _target$match[0]) || "";
-  const unit = target.slice(value.length);
-  const result = Number.parseFloat(value) + delta;
-  if (Number.isNaN(result)) return target;
-  return result + unit;
-}
-function pxValue(px) {
-  return px.endsWith("rem") ? Number.parseFloat(px) * 16 : Number.parseFloat(px);
-}
-function toArray(value) {
-  return Array.isArray(value) ? value : [value];
-}
-function getLifeCycleTarget(target) {
-  return vue.getCurrentInstance();
-}
-function tryOnMounted(fn, sync = true, target) {
-  if (getLifeCycleTarget()) vue.onMounted(fn, target);
-  else if (sync) fn();
-  else vue.nextTick(fn);
-}
-function watchImmediate(source, cb, options) {
-  return vue.watch(source, cb, {
-    ...options,
-    immediate: true
-  });
-}
-const defaultWindow = isClient ? window : void 0;
-function unrefElement(elRef) {
-  var _$el;
-  const plain = vue.toValue(elRef);
-  return (_$el = plain === null || plain === void 0 ? void 0 : plain.$el) !== null && _$el !== void 0 ? _$el : plain;
-}
-function useEventListener(...args) {
-  const register = (el, event, listener, options) => {
-    el.addEventListener(event, listener, options);
-    return () => el.removeEventListener(event, listener, options);
-  };
-  const firstParamTargets = vue.computed(() => {
-    const test = toArray(vue.toValue(args[0])).filter((e) => e != null);
-    return test.every((e) => typeof e !== "string") ? test : void 0;
-  });
-  return watchImmediate(() => {
-    var _firstParamTargets$va, _firstParamTargets$va2;
-    return [
-      (_firstParamTargets$va = (_firstParamTargets$va2 = firstParamTargets.value) === null || _firstParamTargets$va2 === void 0 ? void 0 : _firstParamTargets$va2.map((e) => unrefElement(e))) !== null && _firstParamTargets$va !== void 0 ? _firstParamTargets$va : [defaultWindow].filter((e) => e != null),
-      toArray(vue.toValue(firstParamTargets.value ? args[1] : args[0])),
-      toArray(vue.unref(firstParamTargets.value ? args[2] : args[1])),
-      vue.toValue(firstParamTargets.value ? args[3] : args[2])
-    ];
-  }, ([raw_targets, raw_events, raw_listeners, raw_options], _, onCleanup) => {
-    if (!(raw_targets === null || raw_targets === void 0 ? void 0 : raw_targets.length) || !(raw_events === null || raw_events === void 0 ? void 0 : raw_events.length) || !(raw_listeners === null || raw_listeners === void 0 ? void 0 : raw_listeners.length)) return;
-    const optionsClone = isObject(raw_options) ? { ...raw_options } : raw_options;
-    const cleanups = raw_targets.flatMap((el) => raw_events.flatMap((event) => raw_listeners.map((listener) => register(el, event, listener, optionsClone))));
-    onCleanup(() => {
-      cleanups.forEach((fn) => fn());
-    });
-  }, { flush: "post" });
-}
-// @__NO_SIDE_EFFECTS__
-function useMounted() {
-  const isMounted = vue.shallowRef(false);
-  const instance = vue.getCurrentInstance();
-  if (instance) vue.onMounted(() => {
-    isMounted.value = true;
-  }, instance);
-  return isMounted;
-}
-// @__NO_SIDE_EFFECTS__
-function useSupported(callback) {
-  const isMounted = /* @__PURE__ */ useMounted();
-  return vue.computed(() => {
-    isMounted.value;
-    return Boolean(callback());
-  });
-}
-const ssrWidthSymbol = Symbol("vueuse-ssr-width");
-// @__NO_SIDE_EFFECTS__
-function useSSRWidth() {
-  const ssrWidth = vue.hasInjectionContext() ? /* @__PURE__ */ injectLocal(ssrWidthSymbol, null) : null;
-  return typeof ssrWidth === "number" ? ssrWidth : void 0;
-}
-function useMediaQuery(query, options = {}) {
-  const { window: window$1 = defaultWindow, ssrWidth = /* @__PURE__ */ useSSRWidth() } = options;
-  const isSupported = /* @__PURE__ */ useSupported(() => window$1 && "matchMedia" in window$1 && typeof window$1.matchMedia === "function");
-  const ssrSupport = vue.shallowRef(typeof ssrWidth === "number");
-  const mediaQuery = vue.shallowRef();
-  const matches = vue.shallowRef(false);
-  const handler = (event) => {
-    matches.value = event.matches;
-  };
-  vue.watchEffect(() => {
-    if (ssrSupport.value) {
-      ssrSupport.value = !isSupported.value;
-      matches.value = vue.toValue(query).split(",").some((queryString) => {
-        const not = queryString.includes("not all");
-        const minWidth = queryString.match(/\(\s*min-width:\s*(-?\d+(?:\.\d*)?[a-z]+\s*)\)/);
-        const maxWidth = queryString.match(/\(\s*max-width:\s*(-?\d+(?:\.\d*)?[a-z]+\s*)\)/);
-        let res = Boolean(minWidth || maxWidth);
-        if (minWidth && res) res = ssrWidth >= pxValue(minWidth[1]);
-        if (maxWidth && res) res = ssrWidth <= pxValue(maxWidth[1]);
-        return not ? !res : res;
-      });
-      return;
-    }
-    if (!isSupported.value) return;
-    mediaQuery.value = window$1.matchMedia(vue.toValue(query));
-    matches.value = mediaQuery.value.matches;
-  });
-  useEventListener(mediaQuery, "change", handler, { passive: true });
-  return vue.computed(() => matches.value);
-}
-// @__NO_SIDE_EFFECTS__
-function useBreakpoints(breakpoints, options = {}) {
-  function getValue$1(k, delta) {
-    let v = vue.toValue(breakpoints[vue.toValue(k)]);
-    if (delta != null) v = increaseWithUnit(v, delta);
-    if (typeof v === "number") v = `${v}px`;
-    return v;
-  }
-  const { window: window$1 = defaultWindow, strategy = "min-width", ssrWidth = /* @__PURE__ */ useSSRWidth() } = options;
-  const ssrSupport = typeof ssrWidth === "number";
-  const mounted = ssrSupport ? vue.shallowRef(false) : { value: true };
-  if (ssrSupport) tryOnMounted(() => mounted.value = !!window$1);
-  function match(query, size) {
-    if (!mounted.value && ssrSupport) return query === "min" ? ssrWidth >= pxValue(size) : ssrWidth <= pxValue(size);
-    if (!window$1) return false;
-    return window$1.matchMedia(`(${query}-width: ${size})`).matches;
-  }
-  const greaterOrEqual = (k) => {
-    return useMediaQuery(() => `(min-width: ${getValue$1(k)})`, options);
-  };
-  const smallerOrEqual = (k) => {
-    return useMediaQuery(() => `(max-width: ${getValue$1(k)})`, options);
-  };
-  const shortcutMethods = Object.keys(breakpoints).reduce((shortcuts, k) => {
-    Object.defineProperty(shortcuts, k, {
-      get: () => strategy === "min-width" ? greaterOrEqual(k) : smallerOrEqual(k),
-      enumerable: true,
-      configurable: true
-    });
-    return shortcuts;
-  }, {});
-  function current() {
-    const points = Object.keys(breakpoints).map((k) => [
-      k,
-      shortcutMethods[k],
-      pxValue(getValue$1(k))
-    ]).sort((a, b) => a[2] - b[2]);
-    return vue.computed(() => points.filter(([, v]) => v.value).map(([k]) => k));
-  }
-  return Object.assign(shortcutMethods, {
-    greaterOrEqual,
-    smallerOrEqual,
-    greater(k) {
-      return useMediaQuery(() => `(min-width: ${getValue$1(k, 0.1)})`, options);
-    },
-    smaller(k) {
-      return useMediaQuery(() => `(max-width: ${getValue$1(k, -0.1)})`, options);
-    },
-    between(a, b) {
-      return useMediaQuery(() => `(min-width: ${getValue$1(a)}) and (max-width: ${getValue$1(b, -0.1)})`, options);
-    },
-    isGreater(k) {
-      return match("min", getValue$1(k, 0.1));
-    },
-    isGreaterOrEqual(k) {
-      return match("min", getValue$1(k));
-    },
-    isSmaller(k) {
-      return match("max", getValue$1(k, -0.1));
-    },
-    isSmallerOrEqual(k) {
-      return match("max", getValue$1(k));
-    },
-    isInBetween(a, b) {
-      return match("min", getValue$1(a)) && match("max", getValue$1(b, -0.1));
-    },
-    current,
-    active() {
-      const bps = current();
-      return vue.computed(() => bps.value.length === 0 ? "" : bps.value.at(strategy === "min-width" ? -1 : 0));
-    }
-  });
-}
 const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
   __name: "ResponsiveList",
   props: {
@@ -627,7 +463,9 @@ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
     selectableFilter: {},
     breakpoint: { default: "lg" },
     sortBy: {},
-    sortDirection: {}
+    sortDirection: {},
+    loading: { type: Boolean, default: false },
+    loadingRows: { default: 5 }
   },
   emits: ["select", "selectAll", "sort"],
   setup(__props, { emit: __emit }) {
@@ -663,7 +501,7 @@ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
       return !!slots[`cell-${key}`];
     };
     const hasActionsSlot = vue.computed(() => !!slots.actions);
-    const breakpoints = /* @__PURE__ */ useBreakpoints({
+    const breakpoints = index.useBreakpoints({
       sm: 640,
       md: 768,
       lg: 1024,
@@ -680,6 +518,8 @@ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
           selectable: __props.selectable,
           "selected-items": __props.selectedItems,
           "selectable-filter": __props.selectableFilter,
+          loading: __props.loading,
+          "loading-items": __props.loadingRows,
           onSelect: _cache[0] || (_cache[0] = ($event) => emit("select", $event)),
           onSelectAll: _cache[1] || (_cache[1] = ($event) => emit("selectAll"))
         }, {
@@ -698,7 +538,7 @@ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
             vue.renderSlot(_ctx.$slots, "empty")
           ]),
           _: 3
-        }, 8, ["items", "key-field", "selectable", "selected-items", "selectable-filter"])) : (vue.openBlock(), vue.createBlock(_sfc_main$i, { key: 1 }, {
+        }, 8, ["items", "key-field", "selectable", "selected-items", "selectable-filter", "loading", "loading-items"])) : (vue.openBlock(), vue.createBlock(_sfc_main$i, { key: 1 }, {
           default: vue.withCtx(() => [
             vue.createVNode(_sfc_main$h, {
               items: __props.items,
@@ -709,6 +549,8 @@ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
               "selectable-filter": __props.selectableFilter,
               "sort-by": __props.sortBy,
               "sort-direction": __props.sortDirection,
+              loading: __props.loading,
+              "loading-rows": __props.loadingRows,
               onSelect: _cache[2] || (_cache[2] = ($event) => emit("select", $event)),
               onSelectAll: _cache[3] || (_cache[3] = ($event) => emit("selectAll")),
               onSort: _cache[4] || (_cache[4] = (col, dir) => emit("sort", col, dir))
@@ -739,7 +581,7 @@ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
                 ]),
                 key: "0"
               } : void 0
-            ]), 1032, ["items", "properties", "key-field", "selectable", "selected-items", "selectable-filter", "sort-by", "sort-direction"])
+            ]), 1032, ["items", "properties", "key-field", "selectable", "selected-items", "selectable-filter", "sort-by", "sort-direction", "loading", "loading-rows"])
           ]),
           _: 3
         }))
@@ -747,11 +589,11 @@ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$9 = {
+const _hoisted_1$a = {
   key: 0,
   class: "mb-2 block text-sm font-medium text-gray-700 dark:text-gray-300"
 };
-const _hoisted_2$6 = { class: "relative" };
+const _hoisted_2$7 = { class: "relative" };
 const _hoisted_3$4 = ["disabled", "placeholder"];
 const _hoisted_4$3 = ["disabled"];
 const _hoisted_5$1 = {
@@ -851,9 +693,9 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
     const handleKeydown = (event) => {
       baseHandleKeydown(event, {
         itemCount: filteredOptions.value.length,
-        onSelect: (index) => {
-          if (filteredOptions.value[index]) {
-            selectOption(filteredOptions.value[index]);
+        onSelect: (index2) => {
+          if (filteredOptions.value[index2]) {
+            selectOption(filteredOptions.value[index2]);
           }
         }
       });
@@ -867,8 +709,8 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
         ref: containerRef,
         class: "autocomplete-container"
       }, [
-        __props.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_1$9, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true),
-        vue.createElementVNode("div", _hoisted_2$6, [
+        __props.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_1$a, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true),
+        vue.createElementVNode("div", _hoisted_2$7, [
           vue.createElementVNode("div", {
             ref_key: "inputWrapperRef",
             ref: inputWrapperRef,
@@ -943,14 +785,14 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
                   ])
                 }, [
                   filteredOptions.value.length === 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$1, vue.toDisplayString(__props.noResultsText || "No results found"), 1)) : vue.createCommentVNode("", true),
-                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(filteredOptions.value, (option, index) => {
+                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(filteredOptions.value, (option, index2) => {
                     return vue.openBlock(), vue.createElementBlock("button", {
                       key: option.value,
                       class: vue.normalizeClass([{
-                        "bg-gray-100 dark:bg-gray-700": vue.unref(highlightedIndex) === index,
+                        "bg-gray-100 dark:bg-gray-700": vue.unref(highlightedIndex) === index2,
                         "bg-primary/10": __props.modelValue === option.value
                       }, "flex w-full items-center gap-2 px-4 py-2 text-left text-sm transition hover:bg-gray-100 dark:hover:bg-gray-700"]),
-                      "data-index": index,
+                      "data-index": index2,
                       type: "button",
                       onClick: ($event) => selectOption(option)
                     }, [
@@ -1043,103 +885,10 @@ const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
-  __name: "Button",
-  props: {
-    variant: { default: "primary" },
-    size: { default: "md" },
-    icon: {},
-    iconRight: {},
-    loading: { type: Boolean },
-    disabled: { type: Boolean },
-    block: { type: Boolean },
-    href: {},
-    to: {},
-    type: { default: "button" }
-  },
-  emits: ["click"],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emit = __emit;
-    const variantClasses = {
-      primary: "bg-primary text-primary-foreground hover:bg-primary/90 focus:ring-primary",
-      secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/90 focus:ring-secondary",
-      outline: "border border-gray-300 bg-transparent text-gray-700 hover:bg-gray-50 focus:ring-primary dark:border-gray-600 dark:text-gray-300 dark:hover:bg-gray-800",
-      ghost: "bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-primary dark:text-gray-300 dark:hover:bg-gray-800",
-      danger: "bg-red-500 text-white hover:bg-red-600 focus:ring-red-500",
-      success: "bg-green-500 text-white hover:bg-green-600 focus:ring-green-500"
-    };
-    const sizeClasses = {
-      xs: "px-2 py-1 text-xs gap-1",
-      sm: "px-3 py-1.5 text-sm gap-1.5",
-      md: "px-4 py-2 text-sm gap-2",
-      lg: "px-5 py-2.5 text-base gap-2",
-      xl: "px-6 py-3 text-lg gap-2.5"
-    };
-    const iconSizeClasses = {
-      xs: "size-3",
-      sm: "size-4",
-      md: "size-4",
-      lg: "size-5",
-      xl: "size-6"
-    };
-    const classes = vue.computed(() => [
-      "inline-flex items-center justify-center font-medium rounded-lg transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed",
-      variantClasses[props.variant],
-      sizeClasses[props.size],
-      props.block && "w-full"
-    ]);
-    const component = vue.computed(() => {
-      if (props.to) {
-        try {
-          const RouterLink = vue.resolveComponent("RouterLink");
-          if (typeof RouterLink !== "string") return RouterLink;
-        } catch {
-        }
-      }
-      if (props.href) return "a";
-      return "button";
-    });
-    const componentProps = vue.computed(() => {
-      if (props.to) return { to: props.to };
-      if (props.href) return { href: props.href };
-      return { type: props.type, disabled: props.disabled || props.loading };
-    });
-    const handleClick = (event) => {
-      if (props.disabled || props.loading) return;
-      emit("click", event);
-    };
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(component.value), vue.mergeProps(componentProps.value, {
-        class: classes.value,
-        onClick: handleClick
-      }), {
-        default: vue.withCtx(() => [
-          __props.loading ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-            key: 0,
-            icon: "lucide:loader-2",
-            class: vue.normalizeClass([iconSizeClasses[__props.size], "animate-spin"])
-          }, null, 8, ["class"])) : __props.icon ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-            key: 1,
-            icon: __props.icon,
-            class: vue.normalizeClass(iconSizeClasses[__props.size])
-          }, null, 8, ["icon", "class"])) : vue.createCommentVNode("", true),
-          vue.renderSlot(_ctx.$slots, "default"),
-          __props.iconRight && !__props.loading ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-            key: 2,
-            icon: __props.iconRight,
-            class: vue.normalizeClass(iconSizeClasses[__props.size])
-          }, null, 8, ["icon", "class"])) : vue.createCommentVNode("", true)
-        ]),
-        _: 3
-      }, 16, ["class"]);
-    };
-  }
-});
-const _hoisted_1$8 = { class: "relative inline-block" };
-const _hoisted_2$5 = ["src", "alt"];
+const _hoisted_1$9 = { class: "relative inline-block" };
+const _hoisted_2$6 = ["src", "alt"];
 const _hoisted_3$3 = { key: 1 };
-const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
   __name: "Avatar",
   props: {
     src: {},
@@ -1185,7 +934,7 @@ const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
     });
     const showImage = vue.computed(() => props.src && !imageError.value);
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$8, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [
         vue.createElementVNode("div", {
           class: vue.normalizeClass([
             "flex items-center justify-center overflow-hidden bg-gray-200 font-medium text-gray-600 dark:bg-gray-700 dark:text-gray-300",
@@ -1199,7 +948,7 @@ const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
             alt: __props.alt || __props.name,
             class: "size-full object-cover",
             onError: _cache[0] || (_cache[0] = ($event) => imageError.value = true)
-          }, null, 40, _hoisted_2$5)) : initials.value ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$3, vue.toDisplayString(initials.value), 1)) : (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
+          }, null, 40, _hoisted_2$6)) : initials.value ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$3, vue.toDisplayString(initials.value), 1)) : (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
             key: 2,
             icon: "lucide:user",
             class: "size-1/2"
@@ -1217,9 +966,9 @@ const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$7 = ["aria-selected", "disabled", "onClick"];
-const _hoisted_2$4 = { class: "mt-4" };
-const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$8 = ["aria-selected", "disabled", "onClick"];
+const _hoisted_2$5 = { class: "mt-4" };
+const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
   __name: "Tabs",
   props: {
     tabs: {},
@@ -1284,18 +1033,18 @@ const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
                 activeTab.value === tab.key ? variantClasses[__props.variant].active : variantClasses[__props.variant].inactive
               ]),
               onClick: ($event) => selectTab(tab)
-            }, vue.toDisplayString(tab.label), 11, _hoisted_1$7);
+            }, vue.toDisplayString(tab.label), 11, _hoisted_1$8);
           }), 128))
         ], 2),
-        vue.createElementVNode("div", _hoisted_2$4, [
+        vue.createElementVNode("div", _hoisted_2$5, [
           vue.renderSlot(_ctx.$slots, "default", { activeTab: activeTab.value })
         ])
       ]);
     };
   }
 });
-const _hoisted_1$6 = { role: "tabpanel" };
-const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$7 = { role: "tabpanel" };
+const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
   __name: "TabPanel",
   props: {
     value: {}
@@ -1305,7 +1054,7 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
     const activeTab = vue.inject("activeTab");
     const isActive = vue.computed(() => (activeTab == null ? void 0 : activeTab.value) === props.value);
     return (_ctx, _cache) => {
-      return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [
+      return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, [
         vue.renderSlot(_ctx.$slots, "default")
       ], 512)), [
         [vue.vShow, isActive.value]
@@ -1313,11 +1062,11 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$5 = {
+const _hoisted_1$6 = {
   key: 2,
   class: "text-sm font-semibold"
 };
-const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
   __name: "Stepper",
   props: {
     steps: {},
@@ -1329,12 +1078,12 @@ const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
     const props = __props;
     const getCurrentStepIndex = () => {
       if (props.modelValue === void 0) return 0;
-      const index = props.steps.findIndex((s) => s.key === props.modelValue);
-      return index >= 0 ? index : 0;
+      const index2 = props.steps.findIndex((s) => s.key === props.modelValue);
+      return index2 >= 0 ? index2 : 0;
     };
-    const isStepComplete = (index) => index < getCurrentStepIndex();
-    const isStepActive = (index) => index === getCurrentStepIndex();
-    const isStepPending = (index) => index > getCurrentStepIndex();
+    const isStepComplete = (index2) => index2 < getCurrentStepIndex();
+    const isStepActive = (index2) => index2 === getCurrentStepIndex();
+    const isStepPending = (index2) => index2 > getCurrentStepIndex();
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", {
         class: vue.normalizeClass([
@@ -1360,7 +1109,7 @@ const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
               "aria-hidden": "true"
             }, null, 4)
           ], 64)) : vue.createCommentVNode("", true),
-          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.steps, (step, index) => {
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.steps, (step, index2) => {
             return vue.openBlock(), vue.createElementBlock("div", {
               key: step.key,
               class: vue.normalizeClass([
@@ -1368,17 +1117,17 @@ const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
                 __props.orientation === "horizontal" ? "flex flex-1 flex-col items-center" : "flex items-start gap-4"
               ])
             }, [
-              __props.orientation === "vertical" && index < __props.steps.length - 1 ? (vue.openBlock(), vue.createElementBlock("div", {
+              __props.orientation === "vertical" && index2 < __props.steps.length - 1 ? (vue.openBlock(), vue.createElementBlock("div", {
                 key: 0,
-                class: vue.normalizeClass(["absolute left-6 top-12 h-full w-0.5 -translate-x-1/2", isStepComplete(index) ? "bg-primary" : "bg-gray-200 dark:bg-gray-700"])
+                class: vue.normalizeClass(["absolute left-6 top-12 h-full w-0.5 -translate-x-1/2", isStepComplete(index2) ? "bg-primary" : "bg-gray-200 dark:bg-gray-700"])
               }, null, 2)) : vue.createCommentVNode("", true),
               vue.createElementVNode("div", {
                 class: vue.normalizeClass(["relative z-10 flex size-12 shrink-0 items-center justify-center rounded-full border-2 transition-all duration-300", {
-                  "border-primary bg-primary text-white shadow-lg": isStepActive(index) || isStepComplete(index),
-                  "border-gray-300 bg-white text-gray-400 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-500": isStepPending(index)
+                  "border-primary bg-primary text-white shadow-lg": isStepActive(index2) || isStepComplete(index2),
+                  "border-gray-300 bg-white text-gray-400 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-500": isStepPending(index2)
                 }])
               }, [
-                isStepComplete(index) ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
+                isStepComplete(index2) ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
                   key: 0,
                   icon: "lucide:check",
                   class: "size-6"
@@ -1386,7 +1135,7 @@ const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
                   key: 1,
                   icon: step.icon,
                   class: "size-6"
-                }, null, 8, ["icon"])) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$5, vue.toDisplayString(index + 1), 1))
+                }, null, 8, ["icon"])) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$6, vue.toDisplayString(index2 + 1), 1))
               ], 2),
               vue.createElementVNode("div", {
                 class: vue.normalizeClass([
@@ -1395,15 +1144,15 @@ const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
               }, [
                 vue.createElementVNode("p", {
                   class: vue.normalizeClass(["text-sm font-semibold transition-colors", {
-                    "text-primary dark:text-primary": isStepActive(index) || isStepComplete(index),
-                    "text-gray-500 dark:text-gray-400": isStepPending(index)
+                    "text-primary dark:text-primary": isStepActive(index2) || isStepComplete(index2),
+                    "text-gray-500 dark:text-gray-400": isStepPending(index2)
                   }])
                 }, vue.toDisplayString(step.title), 3),
                 step.description ? (vue.openBlock(), vue.createElementBlock("p", {
                   key: 0,
                   class: vue.normalizeClass(["mt-1 text-xs", {
-                    "text-gray-600 dark:text-gray-300": isStepActive(index),
-                    "text-gray-500 dark:text-gray-400": !isStepActive(index)
+                    "text-gray-600 dark:text-gray-300": isStepActive(index2),
+                    "text-gray-500 dark:text-gray-400": !isStepActive(index2)
                   }])
                 }, vue.toDisplayString(step.description), 3)) : vue.createCommentVNode("", true)
               ], 2)
@@ -1414,7 +1163,7 @@ const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
   __name: "CollapsibleCard",
   props: {
     title: {},
@@ -1510,7 +1259,7 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
   __name: "Tooltip",
   props: {
     content: {},
@@ -1585,7 +1334,7 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
   __name: "Popover",
   props: {
     position: { default: "bottom" },
@@ -1668,17 +1417,17 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$4 = {
+const _hoisted_1$5 = {
   key: 0,
   class: "flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700"
 };
-const _hoisted_2$3 = { class: "text-lg font-semibold text-gray-900 dark:text-white" };
+const _hoisted_2$4 = { class: "text-lg font-semibold text-gray-900 dark:text-white" };
 const _hoisted_3$2 = { class: "flex-1 overflow-y-auto p-4" };
 const _hoisted_4$2 = {
   key: 1,
   class: "px-4 py-3 border-t border-gray-200 dark:border-gray-700"
 };
-const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
   __name: "Drawer",
   props: {
     modelValue: { type: Boolean },
@@ -1797,9 +1546,9 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
               role: "dialog",
               "aria-modal": "true"
             }, [
-              __props.title || __props.showClose || _ctx.$slots.header ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4, [
+              __props.title || __props.showClose || _ctx.$slots.header ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
                 vue.renderSlot(_ctx.$slots, "header", {}, () => [
-                  vue.createElementVNode("h2", _hoisted_2$3, vue.toDisplayString(__props.title), 1)
+                  vue.createElementVNode("h2", _hoisted_2$4, vue.toDisplayString(__props.title), 1)
                 ]),
                 __props.showClose ? (vue.openBlock(), vue.createElementBlock("button", {
                   key: 0,
@@ -1827,9 +1576,9 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$3 = { "aria-label": "Breadcrumb" };
-const _hoisted_2$2 = { class: "flex items-center flex-wrap gap-1 text-sm" };
-const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$4 = { "aria-label": "Breadcrumb" };
+const _hoisted_2$3 = { class: "flex items-center flex-wrap gap-1 text-sm" };
+const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
   __name: "Breadcrumb",
   props: {
     items: {},
@@ -1840,14 +1589,14 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
   emits: ["click"],
   setup(__props) {
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("nav", _hoisted_1$3, [
-        vue.createElementVNode("ol", _hoisted_2$2, [
-          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item, index) => {
+      return vue.openBlock(), vue.createElementBlock("nav", _hoisted_1$4, [
+        vue.createElementVNode("ol", _hoisted_2$3, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item, index2) => {
             return vue.openBlock(), vue.createElementBlock("li", {
-              key: index,
+              key: index2,
               class: "flex items-center"
             }, [
-              index > 0 ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
+              index2 > 0 ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
                 key: 0,
                 icon: __props.separator,
                 class: "w-4 h-4 mx-2 text-gray-400 dark:text-gray-500 flex-shrink-0"
@@ -1857,13 +1606,13 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
                 href: item.href,
                 class: vue.normalizeClass([
                   "flex items-center gap-1.5 transition-colors",
-                  index === __props.items.length - 1 ? "text-gray-900 dark:text-white font-medium cursor-default" : "text-gray-500 dark:text-gray-400 hover:text-primary-600 dark:hover:text-primary-400"
+                  index2 === __props.items.length - 1 ? "text-gray-900 dark:text-white font-medium cursor-default" : "text-gray-500 dark:text-gray-400 hover:text-primary-600 dark:hover:text-primary-400"
                 ]),
-                "aria-current": index === __props.items.length - 1 ? "page" : void 0,
-                onClick: ($event) => _ctx.$emit("click", item, index)
+                "aria-current": index2 === __props.items.length - 1 ? "page" : void 0,
+                onClick: ($event) => _ctx.$emit("click", item, index2)
               }, {
                 default: vue.withCtx(() => [
-                  index === 0 && __props.showHomeIcon ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
+                  index2 === 0 && __props.showHomeIcon ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
                     key: 0,
                     icon: item.icon || __props.homeIcon,
                     class: "w-4 h-4"
@@ -1883,8 +1632,8 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$2 = { class: "divide-y divide-gray-200 dark:divide-gray-700 border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden" };
-const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$3 = { class: "divide-y divide-gray-200 dark:divide-gray-700 border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden" };
+const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
   __name: "Accordion",
   props: {
     mode: { default: "single" },
@@ -1910,17 +1659,17 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
       isOpen
     });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$3, [
         vue.renderSlot(_ctx.$slots, "default")
       ]);
     };
   }
 });
-const _hoisted_1$1 = ["disabled", "aria-expanded"];
-const _hoisted_2$1 = { class: "flex items-center gap-2 font-medium" };
+const _hoisted_1$2 = ["disabled", "aria-expanded"];
+const _hoisted_2$2 = { class: "flex items-center gap-2 font-medium" };
 const _hoisted_3$1 = { class: "overflow-hidden" };
 const _hoisted_4$1 = { class: "px-4 py-3 bg-gray-50 dark:bg-gray-900 text-gray-700 dark:text-gray-300" };
-const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
   __name: "AccordionItem",
   props: {
     itemKey: {},
@@ -1948,7 +1697,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
           "aria-expanded": isOpen.value,
           onClick: toggle
         }, [
-          vue.createElementVNode("span", _hoisted_2$1, [
+          vue.createElementVNode("span", _hoisted_2$2, [
             __props.icon ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
               key: 0,
               icon: __props.icon,
@@ -1960,7 +1709,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
             icon: "heroicons:chevron-down",
             class: vue.normalizeClass(["w-5 h-5 transition-transform duration-200", { "rotate-180": isOpen.value }])
           }, null, 8, ["class"])
-        ], 10, _hoisted_1$1),
+        ], 10, _hoisted_1$2),
         vue.createVNode(vue.Transition, {
           "enter-active-class": "transition-all duration-200 ease-out",
           "enter-from-class": "opacity-0 max-h-0",
@@ -1984,11 +1733,11 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1 = {
+const _hoisted_1$1 = {
   key: 0,
   class: "relative"
 };
-const _hoisted_2 = { class: "flex items-start gap-4" };
+const _hoisted_2$1 = { class: "flex items-start gap-4" };
 const _hoisted_3 = { class: "flex-1 min-w-0 pt-0.5" };
 const _hoisted_4 = { class: "flex items-center justify-between gap-2" };
 const _hoisted_5 = { class: "text-sm font-medium text-gray-900 dark:text-white" };
@@ -2011,7 +1760,7 @@ const _hoisted_12 = {
   key: 0,
   class: "text-xs text-gray-500 dark:text-gray-400"
 };
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
   __name: "Timeline",
   props: {
     items: {},
@@ -2057,17 +1806,17 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       }
     };
     return (_ctx, _cache) => {
-      return __props.orientation === "vertical" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
-        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item, index) => {
+      return __props.orientation === "vertical" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item, index2) => {
           return vue.openBlock(), vue.createElementBlock("div", {
             key: item.key,
             class: "relative pb-8 last:pb-0"
           }, [
-            index < __props.items.length - 1 ? (vue.openBlock(), vue.createElementBlock("div", {
+            index2 < __props.items.length - 1 ? (vue.openBlock(), vue.createElementBlock("div", {
               key: 0,
               class: vue.normalizeClass(["absolute left-4 top-8 w-0.5 h-full -ml-px", getStatusClasses(item.status).line])
             }, null, 2)) : vue.createCommentVNode("", true),
-            vue.createElementVNode("div", _hoisted_2, [
+            vue.createElementVNode("div", _hoisted_2$1, [
               vue.createElementVNode("div", {
                 class: vue.normalizeClass(["relative z-10 flex items-center justify-center w-8 h-8 rounded-full flex-shrink-0", getStatusClasses(item.status).dot])
               }, [
@@ -2089,10 +1838,10 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           ]);
         }), 128))
       ])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_8, [
-        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item, index) => {
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item, index2) => {
           return vue.openBlock(), vue.createElementBlock("div", {
             key: item.key,
-            class: vue.normalizeClass(["flex flex-col items-center flex-shrink-0", { "flex-1": index < __props.items.length - 1 }])
+            class: vue.normalizeClass(["flex flex-col items-center flex-shrink-0", { "flex-1": index2 < __props.items.length - 1 }])
           }, [
             vue.createElementVNode("div", _hoisted_9, [
               vue.createElementVNode("div", {
@@ -2104,7 +1853,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                   class: vue.normalizeClass(["w-4 h-4", getStatusClasses(item.status).icon])
                 }, null, 8, ["icon", "class"])) : vue.createCommentVNode("", true)
               ], 2),
-              index < __props.items.length - 1 ? (vue.openBlock(), vue.createElementBlock("div", {
+              index2 < __props.items.length - 1 ? (vue.openBlock(), vue.createElementBlock("div", {
                 key: 0,
                 class: vue.normalizeClass(["flex-1 h-0.5 mx-2", getStatusClasses(item.status).line])
               }, null, 2)) : vue.createCommentVNode("", true)
@@ -2119,6 +1868,51 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
+const _hoisted_1 = ["aria-label"];
+const _hoisted_2 = {
+  key: 0,
+  class: "text-sm font-medium"
+};
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "DarkModeToggle",
+  props: {
+    size: { default: "md" },
+    lightIcon: { default: "lucide:sun" },
+    darkIcon: { default: "lucide:moon" },
+    showLabel: { type: Boolean, default: false },
+    storageKey: { default: "dark-mode" }
+  },
+  setup(__props) {
+    const props = __props;
+    const { isDark, toggle } = useDarkMode.useDarkMode({ storageKey: props.storageKey });
+    const sizeClasses = {
+      sm: { button: "p-1.5", icon: "h-4 w-4" },
+      md: { button: "p-2", icon: "h-5 w-5" },
+      lg: { button: "p-2.5", icon: "h-6 w-6" }
+    };
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("button", {
+        type: "button",
+        class: vue.normalizeClass([
+          sizeClasses[__props.size].button,
+          "inline-flex items-center gap-2 rounded-lg transition-colors",
+          "text-gray-600 hover:bg-gray-100 hover:text-gray-900",
+          "dark:text-gray-400 dark:hover:bg-gray-800 dark:hover:text-gray-100",
+          "focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
+        ]),
+        "aria-label": vue.unref(isDark) ? "Switch to light mode" : "Switch to dark mode",
+        onClick: _cache[0] || (_cache[0] = //@ts-ignore
+        (...args) => vue.unref(toggle) && vue.unref(toggle)(...args))
+      }, [
+        vue.createVNode(vue.unref(vue$1.Icon), {
+          icon: vue.unref(isDark) ? __props.darkIcon : __props.lightIcon,
+          class: vue.normalizeClass(sizeClasses[__props.size].icon)
+        }, null, 8, ["icon", "class"]),
+        __props.showLabel ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2, vue.toDisplayString(vue.unref(isDark) ? "Dark" : "Light"), 1)) : vue.createCommentVNode("", true)
+      ], 10, _hoisted_1);
+    };
+  }
+});
 exports._sfc_main = _sfc_main$i;
 exports._sfc_main$1 = _sfc_main$h;
 exports._sfc_main$10 = _sfc_main$8;
@@ -2138,4 +1932,4 @@ exports._sfc_main$6 = _sfc_main$c;
 exports._sfc_main$7 = _sfc_main$b;
 exports._sfc_main$8 = _sfc_main$a;
 exports._sfc_main$9 = _sfc_main$9;
-//# sourceMappingURL=Timeline.vue_vue_type_script_setup_true_lang-CqeiZOID.cjs.map
+//# sourceMappingURL=DarkModeToggle.vue_vue_type_script_setup_true_lang-BoB48313.cjs.map