cisse-vue-ui 0.7.2 → 0.7.3

package/dist/TagsInput-BF3zRMcU.cjs

@@ -1,3682 +0,0 @@
-"use strict";
-const vue = require("vue");
-const useId = require("./useId-nxrBaIC9.cjs");
-const vue$1 = require("@iconify/vue");
-const useDropdown = require("./useDropdown-DHFnd259.cjs");
-const _pluginVue_exportHelper = require("./_plugin-vue_export-helper-DM9IkUGy.cjs");
-const index = require("./index-D1x3TH9k.cjs");
-const Button_vue_vue_type_script_setup_true_lang = require("./Button.vue_vue_type_script_setup_true_lang-CXRj7LEP.cjs");
-const _hoisted_1$r = ["data-error", "for"];
-const _sfc_main$r = /* @__PURE__ */ vue.defineComponent({
-  __name: "FormLabel",
-  props: {
-    error: { type: [String, Boolean] },
-    htmlFor: {}
-  },
-  setup(__props) {
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("label", {
-        "data-error": !!__props.error,
-        for: __props.htmlFor ?? "",
-        class: "block text-sm font-medium text-gray-700 data-[error=true]:text-red-500 dark:text-gray-300"
-      }, [
-        vue.renderSlot(_ctx.$slots, "default")
-      ], 8, _hoisted_1$r);
-    };
-  }
-});
-const _hoisted_1$q = ["id", "data-error", "role", "aria-live"];
-const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
-  __name: "FormHelp",
-  props: {
-    id: {},
-    error: { type: Boolean },
-    text: {}
-  },
-  setup(__props) {
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("p", {
-        id: __props.id,
-        "data-error": __props.error,
-        role: __props.error ? "alert" : void 0,
-        "aria-live": __props.error ? "polite" : void 0,
-        class: "mt-2 text-sm text-gray-400 peer-user-invalid:visible data-[error=true]:text-red-500 dark:text-gray-500"
-      }, [
-        vue.renderSlot(_ctx.$slots, "default", {}, () => [
-          vue.createTextVNode(vue.toDisplayString(__props.text ?? ""), 1)
-        ])
-      ], 8, _hoisted_1$q);
-    };
-  }
-});
-const _hoisted_1$p = {
-  key: 0,
-  class: "absolute left-3 top-1/2 -translate-y-1/2 pointer-events-none text-gray-400"
-};
-const _hoisted_2$h = {
-  key: 1,
-  class: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center gap-1"
-};
-const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
-  __name: "InputWrapper",
-  props: {
-    icon: {},
-    iconRight: {},
-    size: { default: "md" },
-    invalid: { type: Boolean },
-    disabled: { type: Boolean },
-    wrapperClass: {}
-  },
-  setup(__props, { expose: __expose }) {
-    const props = __props;
-    const slots = vue.useSlots();
-    const hasLeftIcon = vue.computed(() => props.icon || slots.icon);
-    const hasRightContent = vue.computed(() => props.iconRight || slots.actions);
-    const inputClass = vue.computed(() => [
-      // Base styles
-      "block w-full rounded-xl border text-sm transition-all",
-      "border-gray-200 bg-gray-50 text-gray-900 placeholder-gray-400",
-      "focus:border-primary-500 focus:ring-2 focus:ring-primary-500 focus:bg-white focus:outline-hidden",
-      "disabled:border-gray-200 disabled:bg-gray-100 disabled:text-gray-500 disabled:cursor-not-allowed",
-      // Dark mode
-      "dark:border-slate-600 dark:bg-slate-700 dark:text-white dark:placeholder-gray-500",
-      "dark:focus:border-primary-500 dark:focus:ring-primary-500 dark:focus:bg-slate-600",
-      "dark:disabled:bg-slate-800 dark:disabled:text-gray-500",
-      // Padding based on icons/actions
-      hasLeftIcon.value ? "pl-10" : "pl-4",
-      hasRightContent.value ? "pr-10" : "pr-4",
-      // Size
-      props.size === "sm" && "py-2 text-xs",
-      props.size === "md" && "py-3 text-sm",
-      props.size === "lg" && "py-4 text-base",
-      // Invalid state
-      props.invalid && "border-red-500 focus:border-red-500 focus:ring-red-500 dark:border-red-500"
-    ]);
-    __expose({ inputClass });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", {
-        class: vue.normalizeClass(["relative", __props.wrapperClass])
-      }, [
-        hasLeftIcon.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$p, [
-          vue.renderSlot(_ctx.$slots, "icon", {}, () => [
-            __props.icon ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-              key: 0,
-              icon: __props.icon,
-              class: "size-5"
-            }, null, 8, ["icon"])) : vue.createCommentVNode("", true)
-          ])
-        ])) : vue.createCommentVNode("", true),
-        vue.renderSlot(_ctx.$slots, "default", { inputClass: inputClass.value }),
-        hasRightContent.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$h, [
-          vue.renderSlot(_ctx.$slots, "actions", {}, () => [
-            __props.iconRight ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-              key: 0,
-              icon: __props.iconRight,
-              class: "size-5 text-gray-400 pointer-events-none"
-            }, null, 8, ["icon"])) : vue.createCommentVNode("", true)
-          ])
-        ])) : vue.createCommentVNode("", true)
-      ], 2);
-    };
-  }
-});
-const _hoisted_1$o = ["id", "disabled", "name", "placeholder", "type", "required", "aria-invalid", "aria-required", "aria-describedby"];
-const _sfc_main$o = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "FormInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    type: { default: "text" },
-    value: {},
-    placeholder: {},
-    disabled: { type: Boolean },
-    invalid: { type: Boolean },
-    id: {},
-    name: {},
-    required: { type: Boolean },
-    describedBy: {},
-    icon: {},
-    iconRight: {}
-  }, {
-    "modelValue": {},
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(_sfc_main$p, {
-        icon: props.icon,
-        "icon-right": props.iconRight,
-        disabled: props.disabled,
-        invalid: props.invalid
-      }, {
-        default: vue.withCtx(({ inputClass }) => [
-          vue.withDirectives(vue.createElementVNode("input", vue.mergeProps({
-            id: props.id ?? props.name ?? "",
-            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
-            disabled: props.disabled,
-            name: props.name ?? "",
-            placeholder: props.placeholder,
-            type: props.type,
-            required: props.required,
-            "aria-invalid": props.invalid || void 0,
-            "aria-required": props.required || void 0,
-            "aria-describedby": props.describedBy || void 0,
-            class: inputClass
-          }, _ctx.$attrs), null, 16, _hoisted_1$o), [
-            [vue.vModelDynamic, modelValue.value]
-          ])
-        ]),
-        _: 1
-      }, 8, ["icon", "icon-right", "disabled", "invalid"]);
-    };
-  }
-});
-const _hoisted_1$n = { class: "relative" };
-const _hoisted_2$g = ["id", "disabled", "aria-expanded", "aria-controls", "aria-invalid", "aria-describedby"];
-const _hoisted_3$f = { class: "flex-1 truncate" };
-const _hoisted_4$b = ["id", "aria-label"];
-const _hoisted_5$8 = {
-  key: 0,
-  class: "sticky top-0 border-b border-gray-200 bg-white p-2 dark:border-gray-700 dark:bg-gray-800"
-};
-const _hoisted_6$8 = { class: "flex items-center gap-2 rounded-md border border-gray-300 bg-gray-50 px-2 py-1.5 dark:border-gray-600 dark:bg-gray-900" };
-const _hoisted_7$7 = {
-  key: 1,
-  class: "px-4 py-3 text-sm text-gray-500 dark:text-gray-400",
-  role: "status"
-};
-const _hoisted_8$6 = { class: "py-1" };
-const _hoisted_9$4 = ["aria-selected", "data-index", "onClick", "onMouseenter"];
-const _hoisted_10$4 = {
-  key: 1,
-  class: "size-4 shrink-0",
-  "aria-hidden": "true"
-};
-const _hoisted_11$4 = { class: "flex-1" };
-const _sfc_main$n = /* @__PURE__ */ vue.defineComponent({
-  __name: "FormSelect",
-  props: /* @__PURE__ */ vue.mergeModels({
-    options: {},
-    type: {},
-    value: {},
-    placeholder: {},
-    disabled: { type: Boolean },
-    invalid: { type: Boolean },
-    id: {},
-    name: {},
-    required: { type: Boolean },
-    describedBy: {},
-    icon: {},
-    iconRight: {},
-    teleport: { type: Boolean, default: true },
-    searchable: { type: Boolean, default: false },
-    noResultsText: { default: "No results found" },
-    triggerClass: {}
-  }, {
-    "modelValue": { type: [String, Number, Boolean, null] },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const { id: generatedId, related } = useId.useId({ prefix: "select", id: props.id });
-    const triggerId = vue.computed(() => props.id ?? props.name ?? generatedId.value);
-    const listboxId = vue.computed(() => related("listbox"));
-    const modelValue = vue.useModel(__props, "modelValue");
-    const searchQuery = vue.ref("");
-    const triggerRef = vue.ref();
-    const dropdownRef = vue.ref();
-    const searchInputRef = vue.ref();
-    const {
-      isOpen,
-      highlightedIndex,
-      dropdownStyle,
-      open: openDropdown,
-      close,
-      handleKeydown: baseHandleKeydown,
-      scrollToHighlighted
-    } = useDropdown.useDropdown(triggerRef, dropdownRef, {
-      teleport: props.teleport,
-      gap: 4,
-      onClose: () => {
-        searchQuery.value = "";
-      }
-    });
-    const visibleOptions = vue.computed(() => {
-      return (props.options ?? []).filter((opt) => !opt.hidden);
-    });
-    const filteredOptions = vue.computed(() => {
-      if (!props.searchable || !searchQuery.value) {
-        return visibleOptions.value;
-      }
-      const query = searchQuery.value.toLowerCase();
-      return visibleOptions.value.filter(
-        (opt) => opt.label.toLowerCase().includes(query) || String(opt.value).toLowerCase().includes(query)
-      );
-    });
-    const selectedOption = vue.computed(() => {
-      return visibleOptions.value.find((opt) => opt.value === modelValue.value);
-    });
-    const displayValue = vue.computed(() => {
-      if (selectedOption.value) {
-        return selectedOption.value.label;
-      }
-      return props.placeholder || "Select...";
-    });
-    const open = () => {
-      if (props.disabled) return;
-      searchQuery.value = "";
-      highlightedIndex.value = filteredOptions.value.findIndex(
-        (opt) => opt.value === modelValue.value
-      );
-      openDropdown();
-      vue.nextTick(() => {
-        var _a;
-        if (props.searchable) {
-          (_a = searchInputRef.value) == null ? void 0 : _a.focus();
-        }
-      });
-    };
-    const toggle = () => {
-      if (isOpen.value) {
-        close();
-      } else {
-        open();
-      }
-    };
-    const selectOption = (option) => {
-      modelValue.value = option.value;
-      close();
-    };
-    const handleKeydown = (event) => {
-      baseHandleKeydown(event, {
-        itemCount: filteredOptions.value.length,
-        onSelect: (index2) => {
-          if (filteredOptions.value[index2]) {
-            selectOption(filteredOptions.value[index2]);
-          }
-        },
-        onOpen: open,
-        handleOpenKeys: true
-      });
-      if (isOpen.value) {
-        scrollToHighlighted(dropdownRef.value ?? null);
-      }
-    };
-    vue.watch(searchQuery, () => {
-      highlightedIndex.value = 0;
-    });
-    const triggerClasses = vue.computed(() => {
-      const base = "flex w-full items-center justify-between gap-2 rounded-md border px-3 py-2 text-sm text-left transition";
-      const state = props.disabled ? "cursor-not-allowed border-gray-200 bg-gray-50 text-gray-500 dark:border-gray-800 dark:bg-gray-950 dark:text-gray-500" : isOpen.value ? "border-primary ring-2 ring-primary/20 bg-white dark:bg-gray-900" : "border-gray-300 bg-white hover:border-gray-400 dark:border-gray-700 dark:bg-gray-900 dark:hover:border-gray-600";
-      const text = selectedOption.value ? "text-gray-800 dark:text-gray-200" : "text-gray-400 dark:text-gray-500";
-      return [base, state, text, props.triggerClass];
-    });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$n, [
-        vue.createElementVNode("button", {
-          id: triggerId.value,
-          ref_key: "triggerRef",
-          ref: triggerRef,
-          type: "button",
-          disabled: __props.disabled,
-          class: vue.normalizeClass(triggerClasses.value),
-          "aria-haspopup": "listbox",
-          "aria-expanded": vue.unref(isOpen),
-          "aria-controls": listboxId.value,
-          "aria-invalid": __props.invalid || void 0,
-          "aria-describedby": __props.describedBy || void 0,
-          onClick: toggle,
-          onKeydown: handleKeydown
-        }, [
-          vue.renderSlot(_ctx.$slots, "selected", {
-            option: selectedOption.value,
-            placeholder: __props.placeholder
-          }, () => [
-            vue.createElementVNode("span", _hoisted_3$f, vue.toDisplayString(displayValue.value), 1)
-          ]),
-          vue.createVNode(vue.unref(vue$1.Icon), {
-            icon: "lucide:chevron-down",
-            class: vue.normalizeClass(["size-4 shrink-0 text-gray-400 transition-transform", vue.unref(isOpen) && "rotate-180"]),
-            "aria-hidden": "true"
-          }, null, 8, ["class"])
-        ], 42, _hoisted_2$g),
-        (vue.openBlock(), vue.createBlock(vue.Teleport, {
-          to: "body",
-          disabled: !__props.teleport
-        }, [
-          vue.createVNode(vue.Transition, {
-            "enter-active-class": "transition duration-100 ease-out",
-            "enter-from-class": "opacity-0 scale-95",
-            "enter-to-class": "opacity-100 scale-100",
-            "leave-active-class": "transition duration-75 ease-in",
-            "leave-from-class": "opacity-100 scale-100",
-            "leave-to-class": "opacity-0 scale-95"
-          }, {
-            default: vue.withCtx(() => [
-              vue.unref(isOpen) ? (vue.openBlock(), vue.createElementBlock("div", {
-                key: 0,
-                id: listboxId.value,
-                ref_key: "dropdownRef",
-                ref: dropdownRef,
-                role: "listbox",
-                "aria-label": __props.placeholder || "Select an option",
-                style: vue.normalizeStyle(vue.unref(dropdownStyle)),
-                class: vue.normalizeClass([
-                  "z-9999 max-h-60 overflow-auto rounded-lg border border-gray-200 bg-white shadow-lg dark:border-gray-700 dark:bg-gray-800",
-                  !__props.teleport && "absolute mt-1 w-full"
-                ])
-              }, [
-                __props.searchable ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$8, [
-                  vue.createElementVNode("div", _hoisted_6$8, [
-                    vue.createVNode(vue.unref(vue$1.Icon), {
-                      icon: "lucide:search",
-                      class: "size-4 text-gray-400",
-                      "aria-hidden": "true"
-                    }),
-                    vue.withDirectives(vue.createElementVNode("input", {
-                      ref_key: "searchInputRef",
-                      ref: searchInputRef,
-                      "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => searchQuery.value = $event),
-                      type: "text",
-                      class: "flex-1 bg-transparent text-sm outline-hidden dark:text-white",
-                      placeholder: "Search...",
-                      "aria-label": "Search options",
-                      onKeydown: handleKeydown
-                    }, null, 544), [
-                      [vue.vModelText, searchQuery.value]
-                    ])
-                  ])
-                ])) : vue.createCommentVNode("", true),
-                filteredOptions.value.length === 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$7, vue.toDisplayString(__props.noResultsText), 1)) : vue.createCommentVNode("", true),
-                vue.createElementVNode("div", _hoisted_8$6, [
-                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(filteredOptions.value, (option, index2) => {
-                    return vue.openBlock(), vue.createElementBlock("button", {
-                      key: String(option.value),
-                      type: "button",
-                      role: "option",
-                      "aria-selected": modelValue.value === option.value,
-                      "data-index": index2,
-                      class: vue.normalizeClass([
-                        "flex w-full items-center gap-2 px-3 py-2 text-left text-sm transition-colors",
-                        vue.unref(highlightedIndex) === index2 && "bg-gray-100 dark:bg-gray-700",
-                        modelValue.value === option.value && "bg-primary/10 text-primary",
-                        modelValue.value !== option.value && "text-gray-700 dark:text-gray-200"
-                      ]),
-                      onClick: ($event) => selectOption(option),
-                      onMouseenter: ($event) => highlightedIndex.value = index2
-                    }, [
-                      vue.renderSlot(_ctx.$slots, "option", {
-                        option,
-                        selected: modelValue.value === option.value,
-                        index: index2
-                      }, () => [
-                        modelValue.value === option.value ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-                          key: 0,
-                          icon: "lucide:check",
-                          class: "size-4 shrink-0 text-primary",
-                          "aria-hidden": "true"
-                        })) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_10$4)),
-                        vue.createElementVNode("span", _hoisted_11$4, vue.toDisplayString(option.label), 1)
-                      ])
-                    ], 42, _hoisted_9$4);
-                  }), 128))
-                ])
-              ], 14, _hoisted_4$b)) : vue.createCommentVNode("", true)
-            ]),
-            _: 3
-          })
-        ], 8, ["disabled"]))
-      ]);
-    };
-  }
-});
-const _hoisted_1$m = ["hidden"];
-const _sfc_main$m = /* @__PURE__ */ vue.defineComponent({
-  __name: "FormGroup",
-  props: /* @__PURE__ */ vue.mergeModels({
-    label: {},
-    cols: { default: 6 },
-    hidden: { type: Boolean },
-    error: { type: [String, Boolean] },
-    select: { type: Boolean },
-    type: {},
-    value: {},
-    placeholder: {},
-    disabled: { type: Boolean },
-    invalid: { type: Boolean },
-    id: {},
-    name: {},
-    required: { type: Boolean },
-    describedBy: {},
-    icon: {},
-    iconRight: {},
-    options: {}
-  }, {
-    "modelValue": {},
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const { id: generatedId, related } = useId.useId({ prefix: "field", id: props.id });
-    const inputId = vue.computed(() => props.id ?? props.name ?? generatedId.value);
-    const helpId = vue.computed(() => related("help"));
-    const computedCols = vue.computed(() => `span ${props.cols} / span ${props.cols}`);
-    const isSelect = vue.computed(() => props.select === true);
-    const hasError = vue.computed(() => props.error && typeof props.error === "string");
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", {
-        style: vue.normalizeStyle({ gridColumn: computedCols.value }),
-        hidden: __props.hidden
-      }, [
-        vue.renderSlot(_ctx.$slots, "default", {}, () => [
-          vue.renderSlot(_ctx.$slots, "label", {}, () => [
-            __props.label ? (vue.openBlock(), vue.createBlock(_sfc_main$r, {
-              key: 0,
-              "html-for": inputId.value,
-              error: __props.error
-            }, {
-              default: vue.withCtx(() => [
-                vue.createTextVNode(vue.toDisplayString(__props.label), 1)
-              ]),
-              _: 1
-            }, 8, ["html-for", "error"])) : vue.createCommentVNode("", true)
-          ]),
-          vue.renderSlot(_ctx.$slots, "input", {}, () => [
-            isSelect.value ? (vue.openBlock(), vue.createBlock(_sfc_main$n, vue.mergeProps({
-              key: 0,
-              modelValue: modelValue.value,
-              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event)
-            }, { ..._ctx.$attrs, ..._ctx.$props }, {
-              id: inputId.value,
-              invalid: Boolean(__props.error),
-              "described-by": hasError.value ? helpId.value : void 0
-            }), null, 16, ["modelValue", "id", "invalid", "described-by"])) : (vue.openBlock(), vue.createBlock(_sfc_main$o, vue.mergeProps({
-              key: 1,
-              modelValue: modelValue.value,
-              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => modelValue.value = $event)
-            }, { ..._ctx.$attrs, ..._ctx.$props }, {
-              id: inputId.value,
-              invalid: Boolean(__props.error),
-              "described-by": hasError.value ? helpId.value : void 0
-            }), null, 16, ["modelValue", "id", "invalid", "described-by"]))
-          ]),
-          hasError.value ? (vue.openBlock(), vue.createBlock(_sfc_main$q, {
-            key: 0,
-            id: helpId.value,
-            error: true
-          }, {
-            default: vue.withCtx(() => [
-              vue.createTextVNode(vue.toDisplayString(__props.error), 1)
-            ]),
-            _: 1
-          }, 8, ["id"])) : vue.createCommentVNode("", true)
-        ])
-      ], 12, _hoisted_1$m);
-    };
-  }
-});
-const _hoisted_1$l = ["name", "placeholder", "disabled"];
-const _sfc_main$l = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "SearchInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    placeholder: { default: "Search..." },
-    icon: { default: "lucide:search" },
-    disabled: { type: Boolean },
-    size: { default: "md" },
-    name: {}
-  }, {
-    "modelValue": { default: "" },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(_sfc_main$p, {
-        icon: props.icon,
-        size: props.size,
-        disabled: props.disabled
-      }, {
-        default: vue.withCtx(({ inputClass }) => [
-          vue.withDirectives(vue.createElementVNode("input", vue.mergeProps({
-            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
-            type: "text",
-            name: props.name,
-            placeholder: props.placeholder,
-            disabled: props.disabled,
-            class: inputClass
-          }, _ctx.$attrs), null, 16, _hoisted_1$l), [
-            [vue.vModelText, modelValue.value]
-          ])
-        ]),
-        _: 1
-      }, 8, ["icon", "size", "disabled"]);
-    };
-  }
-});
-const _hoisted_1$k = ["id", "aria-checked", "aria-labelledby", "aria-describedby", "disabled"];
-const _hoisted_2$f = {
-  key: 0,
-  class: "flex flex-col"
-};
-const _hoisted_3$e = ["id"];
-const _hoisted_4$a = ["id"];
-const _sfc_main$k = /* @__PURE__ */ vue.defineComponent({
-  __name: "Switch",
-  props: {
-    modelValue: { type: Boolean, default: false },
-    label: {},
-    description: {},
-    disabled: { type: Boolean },
-    size: { default: "md" },
-    id: {}
-  },
-  emits: ["update:modelValue"],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emit = __emit;
-    const { id: generatedId, related } = useId.useId({ prefix: "switch", id: props.id });
-    const switchId = vue.computed(() => props.id ?? generatedId.value);
-    const labelId = vue.computed(() => related("label"));
-    const descriptionId = vue.computed(() => related("description"));
-    const toggle = () => {
-      if (props.disabled) return;
-      emit("update:modelValue", !props.modelValue);
-    };
-    const switchSizes = {
-      sm: "h-5 w-9",
-      md: "h-6 w-11",
-      lg: "h-7 w-14"
-    };
-    const dotSizes = {
-      sm: "size-3",
-      md: "size-4",
-      lg: "size-5"
-    };
-    const translateSizes = {
-      sm: "translate-x-5",
-      md: "translate-x-6",
-      lg: "translate-x-8"
-    };
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("label", {
-        class: vue.normalizeClass(["inline-flex items-start gap-3", __props.disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer"])
-      }, [
-        vue.createElementVNode("button", {
-          id: switchId.value,
-          type: "button",
-          role: "switch",
-          "aria-checked": __props.modelValue,
-          "aria-labelledby": __props.label ? labelId.value : void 0,
-          "aria-describedby": __props.description ? descriptionId.value : void 0,
-          disabled: __props.disabled,
-          class: vue.normalizeClass([
-            "relative inline-flex shrink-0 items-center rounded-full transition-colors focus:outline-hidden focus:ring-2 focus:ring-primary focus:ring-offset-2",
-            switchSizes[__props.size],
-            __props.modelValue ? "bg-primary" : "bg-gray-300 dark:bg-gray-600"
-          ]),
-          onClick: toggle
-        }, [
-          vue.createElementVNode("span", {
-            class: vue.normalizeClass([
-              "inline-block transform rounded-full bg-white shadow-sm transition-transform",
-              dotSizes[__props.size],
-              __props.modelValue ? translateSizes[__props.size] : "translate-x-1"
-            ]),
-            "aria-hidden": "true"
-          }, null, 2)
-        ], 10, _hoisted_1$k),
-        __props.label || __props.description ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$f, [
-          __props.label ? (vue.openBlock(), vue.createElementBlock("span", {
-            key: 0,
-            id: labelId.value,
-            class: "text-sm font-medium text-gray-900 dark:text-white"
-          }, vue.toDisplayString(__props.label), 9, _hoisted_3$e)) : vue.createCommentVNode("", true),
-          __props.description ? (vue.openBlock(), vue.createElementBlock("span", {
-            key: 1,
-            id: descriptionId.value,
-            class: "text-sm text-gray-500 dark:text-gray-400"
-          }, vue.toDisplayString(__props.description), 9, _hoisted_4$a)) : vue.createCommentVNode("", true)
-        ])) : vue.createCommentVNode("", true)
-      ], 2);
-    };
-  }
-});
-const _hoisted_1$j = { class: "w-full" };
-const _hoisted_2$e = {
-  key: 0,
-  class: "mb-2 flex justify-between text-sm"
-};
-const _hoisted_3$d = { class: "text-gray-600 dark:text-gray-400" };
-const _hoisted_4$9 = { class: "font-medium text-gray-900 dark:text-white" };
-const _hoisted_5$7 = { class: "text-gray-600 dark:text-gray-400" };
-const _hoisted_6$7 = { class: "relative" };
-const _hoisted_7$6 = ["value", "min", "max", "step", "disabled"];
-const _hoisted_8$5 = { class: "pointer-events-none absolute inset-y-0 left-0 flex items-center" };
-const _sfc_main$j = /* @__PURE__ */ vue.defineComponent({
-  __name: "Slider",
-  props: /* @__PURE__ */ vue.mergeModels({
-    min: { default: 0 },
-    max: { default: 100 },
-    step: { default: 1 },
-    disabled: { type: Boolean, default: false },
-    showValue: { type: Boolean, default: false },
-    formatValue: {}
-  }, {
-    "modelValue": { default: 0 },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const percentage = vue.computed(() => {
-      return (modelValue.value - props.min) / (props.max - props.min) * 100;
-    });
-    const displayValue = vue.computed(() => {
-      if (props.formatValue) {
-        return props.formatValue(modelValue.value);
-      }
-      return modelValue.value.toString();
-    });
-    const handleInput = (event) => {
-      const target = event.target;
-      modelValue.value = Number(target.value);
-    };
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$j, [
-        __props.showValue ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$e, [
-          vue.createElementVNode("span", _hoisted_3$d, vue.toDisplayString(__props.min), 1),
-          vue.createElementVNode("span", _hoisted_4$9, vue.toDisplayString(displayValue.value), 1),
-          vue.createElementVNode("span", _hoisted_5$7, vue.toDisplayString(__props.max), 1)
-        ])) : vue.createCommentVNode("", true),
-        vue.createElementVNode("div", _hoisted_6$7, [
-          vue.createElementVNode("input", {
-            type: "range",
-            value: modelValue.value,
-            min: __props.min,
-            max: __props.max,
-            step: __props.step,
-            disabled: __props.disabled,
-            class: "slider-input w-full cursor-pointer appearance-none bg-transparent disabled:cursor-not-allowed disabled:opacity-50",
-            onInput: handleInput
-          }, null, 40, _hoisted_7$6),
-          vue.createElementVNode("div", _hoisted_8$5, [
-            vue.createElementVNode("div", {
-              class: "h-2 rounded-full bg-primary",
-              style: vue.normalizeStyle({ width: `${percentage.value}%` })
-            }, null, 4)
-          ])
-        ])
-      ]);
-    };
-  }
-});
-const Slider = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main$j, [["__scopeId", "data-v-c25e2c2a"]]);
-const _hoisted_1$i = { class: "relative" };
-const _hoisted_2$d = ["id", "disabled", "aria-expanded", "aria-controls"];
-const _hoisted_3$c = { class: "flex-1 truncate" };
-const _hoisted_4$8 = { class: "flex items-center gap-1" };
-const _hoisted_5$6 = ["id", "aria-label"];
-const _hoisted_6$6 = { class: "mb-4 flex items-center justify-between" };
-const _hoisted_7$5 = {
-  class: "font-medium text-gray-900 dark:text-white",
-  "aria-live": "polite",
-  "aria-atomic": "true"
-};
-const _hoisted_8$4 = {
-  class: "mb-2 grid grid-cols-7 gap-1",
-  role: "row"
-};
-const _hoisted_9$3 = ["abbr"];
-const _hoisted_10$3 = ["id", "aria-label"];
-const _hoisted_11$3 = ["aria-label", "aria-selected", "aria-disabled", "disabled", "onClick"];
-const _hoisted_12$2 = { class: "mt-4 border-t border-gray-200 pt-3 dark:border-gray-700" };
-const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
-  __name: "DatePicker",
-  props: /* @__PURE__ */ vue.mergeModels({
-    placeholder: { default: "Select date" },
-    format: { default: "short" },
-    locale: { default: "en-US" },
-    disabled: { type: Boolean, default: false },
-    minDate: {},
-    maxDate: {},
-    teleport: { type: Boolean, default: true },
-    id: {}
-  }, {
-    "modelValue": { default: null },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const { related } = useId.useId({ prefix: "datepicker", id: props.id });
-    const triggerId = vue.computed(() => related("trigger"));
-    const calendarId = vue.computed(() => related("calendar"));
-    const gridId = vue.computed(() => related("grid"));
-    const modelValue = vue.useModel(__props, "modelValue");
-    const triggerRef = vue.ref();
-    const calendarRef = vue.ref();
-    const { isOpen, dropdownStyle, toggle, close } = useDropdown.useDropdown(triggerRef, calendarRef, {
-      teleport: props.teleport,
-      gap: 4
-    });
-    const currentMonth = vue.ref(modelValue.value ? new Date(modelValue.value) : /* @__PURE__ */ new Date());
-    const weekDays = vue.computed(() => {
-      const days = [];
-      const formatter = new Intl.DateTimeFormat(props.locale, { weekday: "short" });
-      for (let i = 0; i < 7; i++) {
-        const date = new Date(2024, 0, i);
-        days.push(formatter.format(date));
-      }
-      return days;
-    });
-    const monthYear = vue.computed(() => {
-      const formatter = new Intl.DateTimeFormat(props.locale, { month: "long", year: "numeric" });
-      return formatter.format(currentMonth.value);
-    });
-    const calendarDays = vue.computed(() => {
-      const year = currentMonth.value.getFullYear();
-      const month = currentMonth.value.getMonth();
-      const firstDay = new Date(year, month, 1);
-      const lastDay = new Date(year, month + 1, 0);
-      const days = [];
-      let startDay = firstDay.getDay();
-      startDay = startDay === 0 ? 6 : startDay - 1;
-      for (let i = startDay - 1; i >= 0; i--) {
-        const date = new Date(year, month, -i);
-        days.push({
-          date,
-          isCurrentMonth: false,
-          isToday: false,
-          isSelected: false,
-          isDisabled: isDateDisabled(date)
-        });
-      }
-      const today = /* @__PURE__ */ new Date();
-      for (let i = 1; i <= lastDay.getDate(); i++) {
-        const date = new Date(year, month, i);
-        days.push({
-          date,
-          isCurrentMonth: true,
-          isToday: isSameDay(date, today),
-          isSelected: modelValue.value ? isSameDay(date, modelValue.value) : false,
-          isDisabled: isDateDisabled(date)
-        });
-      }
-      const remainingDays = 42 - days.length;
-      for (let i = 1; i <= remainingDays; i++) {
-        const date = new Date(year, month + 1, i);
-        days.push({
-          date,
-          isCurrentMonth: false,
-          isToday: false,
-          isSelected: false,
-          isDisabled: isDateDisabled(date)
-        });
-      }
-      return days;
-    });
-    const displayValue = vue.computed(() => {
-      if (!modelValue.value) return "";
-      const formatter = new Intl.DateTimeFormat(props.locale, {
-        dateStyle: props.format
-      });
-      return formatter.format(modelValue.value);
-    });
-    const isSameDay = (a, b) => {
-      return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
-    };
-    const isDateDisabled = (date) => {
-      if (props.minDate && date < props.minDate) return true;
-      if (props.maxDate && date > props.maxDate) return true;
-      return false;
-    };
-    const prevMonth = () => {
-      currentMonth.value = new Date(currentMonth.value.getFullYear(), currentMonth.value.getMonth() - 1, 1);
-    };
-    const nextMonth = () => {
-      currentMonth.value = new Date(currentMonth.value.getFullYear(), currentMonth.value.getMonth() + 1, 1);
-    };
-    const selectDate = (day) => {
-      if (day.isDisabled) return;
-      modelValue.value = day.date;
-      close();
-    };
-    const clear = () => {
-      modelValue.value = null;
-    };
-    const getDateLabel = (date) => {
-      const formatter = new Intl.DateTimeFormat(props.locale, {
-        weekday: "long",
-        year: "numeric",
-        month: "long",
-        day: "numeric"
-      });
-      return formatter.format(date);
-    };
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$i, [
-        vue.createElementVNode("button", {
-          id: triggerId.value,
-          ref_key: "triggerRef",
-          ref: triggerRef,
-          type: "button",
-          disabled: __props.disabled,
-          "aria-expanded": vue.unref(isOpen),
-          "aria-haspopup": "dialog",
-          "aria-controls": calendarId.value,
-          class: vue.normalizeClass([
-            "flex w-full items-center justify-between gap-2 rounded-md border px-3 py-2 text-sm text-left transition",
-            __props.disabled ? "cursor-not-allowed border-gray-200 bg-gray-50 text-gray-500 dark:border-gray-800 dark:bg-gray-950" : vue.unref(isOpen) ? "border-primary ring-2 ring-primary/20 bg-white dark:bg-gray-900" : "border-gray-300 bg-white hover:border-gray-400 dark:border-gray-700 dark:bg-gray-900",
-            modelValue.value ? "text-gray-900 dark:text-white" : "text-gray-400 dark:text-gray-500"
-          ]),
-          onClick: _cache[0] || (_cache[0] = //@ts-ignore
-          (...args) => vue.unref(toggle) && vue.unref(toggle)(...args))
-        }, [
-          vue.createElementVNode("span", _hoisted_3$c, vue.toDisplayString(displayValue.value || __props.placeholder), 1),
-          vue.createElementVNode("div", _hoisted_4$8, [
-            modelValue.value ? (vue.openBlock(), vue.createElementBlock("button", {
-              key: 0,
-              type: "button",
-              class: "rounded p-0.5 hover:bg-gray-100 dark:hover:bg-gray-800",
-              "aria-label": "Clear date",
-              onClick: vue.withModifiers(clear, ["stop"])
-            }, [
-              vue.createVNode(vue.unref(vue$1.Icon), {
-                icon: "lucide:x",
-                class: "size-4 text-gray-400",
-                "aria-hidden": "true"
-              })
-            ])) : vue.createCommentVNode("", true),
-            vue.createVNode(vue.unref(vue$1.Icon), {
-              icon: "lucide:calendar",
-              class: "size-4 text-gray-400",
-              "aria-hidden": "true"
-            })
-          ])
-        ], 10, _hoisted_2$d),
-        (vue.openBlock(), vue.createBlock(vue.Teleport, {
-          to: "body",
-          disabled: !__props.teleport
-        }, [
-          vue.createVNode(vue.Transition, {
-            "enter-active-class": "transition duration-100 ease-out",
-            "enter-from-class": "opacity-0 scale-95",
-            "enter-to-class": "opacity-100 scale-100",
-            "leave-active-class": "transition duration-75 ease-in",
-            "leave-from-class": "opacity-100 scale-100",
-            "leave-to-class": "opacity-0 scale-95"
-          }, {
-            default: vue.withCtx(() => [
-              vue.unref(isOpen) ? (vue.openBlock(), vue.createElementBlock("div", {
-                key: 0,
-                id: calendarId.value,
-                ref_key: "calendarRef",
-                ref: calendarRef,
-                role: "dialog",
-                "aria-modal": "true",
-                "aria-label": `Choose date, ${monthYear.value}`,
-                style: vue.normalizeStyle(vue.unref(dropdownStyle)),
-                class: "z-9999 w-72 rounded-lg border border-gray-200 bg-white p-4 shadow-lg dark:border-gray-700 dark:bg-gray-800"
-              }, [
-                vue.createElementVNode("div", _hoisted_6$6, [
-                  vue.createElementVNode("button", {
-                    type: "button",
-                    class: "rounded p-1 hover:bg-gray-100 dark:hover:bg-gray-700",
-                    "aria-label": "Previous month",
-                    onClick: prevMonth
-                  }, [
-                    vue.createVNode(vue.unref(vue$1.Icon), {
-                      icon: "lucide:chevron-left",
-                      class: "size-5 text-gray-600 dark:text-gray-400",
-                      "aria-hidden": "true"
-                    })
-                  ]),
-                  vue.createElementVNode("span", _hoisted_7$5, vue.toDisplayString(monthYear.value), 1),
-                  vue.createElementVNode("button", {
-                    type: "button",
-                    class: "rounded p-1 hover:bg-gray-100 dark:hover:bg-gray-700",
-                    "aria-label": "Next month",
-                    onClick: nextMonth
-                  }, [
-                    vue.createVNode(vue.unref(vue$1.Icon), {
-                      icon: "lucide:chevron-right",
-                      class: "size-5 text-gray-600 dark:text-gray-400",
-                      "aria-hidden": "true"
-                    })
-                  ])
-                ]),
-                vue.createElementVNode("div", _hoisted_8$4, [
-                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(weekDays.value, (day) => {
-                    return vue.openBlock(), vue.createElementBlock("div", {
-                      key: day,
-                      class: "text-center text-xs font-medium text-gray-500 dark:text-gray-400",
-                      role: "columnheader",
-                      abbr: day
-                    }, vue.toDisplayString(day), 9, _hoisted_9$3);
-                  }), 128))
-                ]),
-                vue.createElementVNode("div", {
-                  id: gridId.value,
-                  class: "grid grid-cols-7 gap-1",
-                  role: "grid",
-                  "aria-label": monthYear.value
-                }, [
-                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(calendarDays.value, (day, index2) => {
-                    return vue.openBlock(), vue.createElementBlock("button", {
-                      key: index2,
-                      type: "button",
-                      role: "gridcell",
-                      "aria-label": getDateLabel(day.date),
-                      "aria-selected": day.isSelected,
-                      "aria-disabled": day.isDisabled || void 0,
-                      disabled: day.isDisabled,
-                      class: vue.normalizeClass([
-                        "size-8 rounded text-sm transition",
-                        day.isDisabled && "cursor-not-allowed opacity-30",
-                        !day.isCurrentMonth && "text-gray-400 dark:text-gray-600",
-                        day.isCurrentMonth && !day.isSelected && !day.isToday && "text-gray-900 hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700",
-                        day.isToday && !day.isSelected && "bg-gray-100 font-semibold text-gray-900 dark:bg-gray-700 dark:text-white",
-                        day.isSelected && "bg-primary text-white font-semibold"
-                      ]),
-                      onClick: ($event) => selectDate(day)
-                    }, vue.toDisplayString(day.date.getDate()), 11, _hoisted_11$3);
-                  }), 128))
-                ], 8, _hoisted_10$3),
-                vue.createElementVNode("div", _hoisted_12$2, [
-                  vue.createElementVNode("button", {
-                    type: "button",
-                    class: "w-full rounded py-1.5 text-sm font-medium text-primary hover:bg-primary/10",
-                    onClick: _cache[1] || (_cache[1] = ($event) => selectDate({ date: /* @__PURE__ */ new Date(), isDisabled: false }))
-                  }, " Today ")
-                ])
-              ], 12, _hoisted_5$6)) : vue.createCommentVNode("", true)
-            ]),
-            _: 1
-          })
-        ], 8, ["disabled"]))
-      ]);
-    };
-  }
-});
-const _hoisted_1$h = { class: "space-y-4" };
-const _hoisted_2$c = ["accept", "multiple", "disabled"];
-const _hoisted_3$b = { class: "space-y-2" };
-const _hoisted_4$7 = { class: "text-sm font-medium text-gray-700 dark:text-gray-300" };
-const _hoisted_5$5 = {
-  key: 0,
-  class: "text-xs text-gray-500 dark:text-gray-400"
-};
-const _hoisted_6$5 = {
-  key: 1,
-  class: "text-xs text-gray-500 dark:text-gray-400"
-};
-const _hoisted_7$4 = {
-  key: 0,
-  class: "space-y-2"
-};
-const _hoisted_8$3 = { class: "flex-1 min-w-0" };
-const _hoisted_9$2 = { class: "text-sm font-medium text-gray-700 dark:text-gray-300 truncate" };
-const _hoisted_10$2 = { class: "text-xs text-gray-500 dark:text-gray-400" };
-const _hoisted_11$2 = ["onClick"];
-const _sfc_main$h = /* @__PURE__ */ vue.defineComponent({
-  __name: "FileUpload",
-  props: {
-    accept: {},
-    multiple: { type: Boolean, default: false },
-    maxSize: {},
-    maxFiles: {},
-    disabled: { type: Boolean, default: false },
-    label: { default: "Drop files here or click to upload" },
-    description: { default: "" }
-  },
-  emits: ["files-selected", "file-removed", "error"],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emit = __emit;
-    const isDragging = vue.ref(false);
-    const files = vue.ref([]);
-    const inputRef = vue.ref();
-    const formatSize = (bytes) => {
-      if (bytes === 0) return "0 B";
-      const k = 1024;
-      const sizes = ["B", "KB", "MB", "GB"];
-      const i = Math.floor(Math.log(bytes) / Math.log(k));
-      return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + " " + sizes[i];
-    };
-    const validateFile = (file) => {
-      var _a;
-      if (props.maxSize && file.size > props.maxSize) {
-        return `File too large. Max size: ${formatSize(props.maxSize)}`;
-      }
-      if (props.accept) {
-        const acceptedTypes = props.accept.split(",").map((t) => t.trim());
-        const fileType = file.type;
-        const fileExt = "." + ((_a = file.name.split(".").pop()) == null ? void 0 : _a.toLowerCase());
-        const isAccepted = acceptedTypes.some((type) => {
-          if (type.startsWith(".")) {
-            return fileExt === type.toLowerCase();
-          }
-          if (type.endsWith("/*")) {
-            return fileType.startsWith(type.replace("/*", "/"));
-          }
-          return fileType === type;
-        });
-        if (!isAccepted) {
-          return `File type not accepted`;
-        }
-      }
-      return null;
-    };
-    const addFiles = (newFiles) => {
-      const fileArray = Array.from(newFiles);
-      const validFiles = [];
-      for (const file of fileArray) {
-        if (props.maxFiles && files.value.length + validFiles.length >= props.maxFiles) {
-          emit("error", `Maximum ${props.maxFiles} files allowed`);
-          break;
-        }
-        const error = validateFile(file);
-        if (error) {
-          emit("error", `${file.name}: ${error}`);
-          continue;
-        }
-        validFiles.push(file);
-        files.value.push({
-          file,
-          id: Math.random().toString(36).substring(2),
-          progress: 0,
-          status: "pending"
-        });
-      }
-      if (validFiles.length > 0) {
-        emit("files-selected", validFiles);
-      }
-    };
-    const removeFile = (id) => {
-      const index2 = files.value.findIndex((f) => f.id === id);
-      if (index2 > -1) {
-        const removed = files.value.splice(index2, 1)[0];
-        emit("file-removed", removed.file);
-      }
-    };
-    const handleDrop = (e) => {
-      var _a;
-      isDragging.value = false;
-      if (props.disabled || !((_a = e.dataTransfer) == null ? void 0 : _a.files)) return;
-      addFiles(e.dataTransfer.files);
-    };
-    const handleDragOver = (e) => {
-      e.preventDefault();
-      if (!props.disabled) {
-        isDragging.value = true;
-      }
-    };
-    const handleDragLeave = () => {
-      isDragging.value = false;
-    };
-    const handleClick = () => {
-      var _a;
-      if (!props.disabled) {
-        (_a = inputRef.value) == null ? void 0 : _a.click();
-      }
-    };
-    const handleInputChange = (e) => {
-      const target = e.target;
-      if (target.files) {
-        addFiles(target.files);
-        target.value = "";
-      }
-    };
-    const dropzoneClasses = vue.computed(() => {
-      const base = "relative border-2 border-dashed rounded-lg p-8 text-center cursor-pointer transition-colors";
-      if (props.disabled) {
-        return `${base} border-gray-200 bg-gray-50 cursor-not-allowed dark:border-gray-700 dark:bg-gray-800`;
-      }
-      if (isDragging.value) {
-        return `${base} border-primary-500 bg-primary-50 dark:bg-primary-900/20`;
-      }
-      return `${base} border-gray-300 hover:border-primary-400 hover:bg-gray-50 dark:border-gray-600 dark:hover:border-primary-500 dark:hover:bg-gray-800`;
-    });
-    const getFileIcon = (file) => {
-      if (file.type.startsWith("image/")) return "heroicons:photo";
-      if (file.type.startsWith("video/")) return "heroicons:video-camera";
-      if (file.type.startsWith("audio/")) return "heroicons:musical-note";
-      if (file.type.includes("pdf")) return "heroicons:document-text";
-      if (file.type.includes("zip") || file.type.includes("rar")) return "heroicons:archive-box";
-      return "heroicons:document";
-    };
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$h, [
-        vue.createElementVNode("div", {
-          class: vue.normalizeClass(dropzoneClasses.value),
-          onDrop: vue.withModifiers(handleDrop, ["prevent"]),
-          onDragover: handleDragOver,
-          onDragleave: handleDragLeave,
-          onClick: handleClick
-        }, [
-          vue.createElementVNode("input", {
-            ref_key: "inputRef",
-            ref: inputRef,
-            type: "file",
-            class: "hidden",
-            accept: __props.accept,
-            multiple: __props.multiple,
-            disabled: __props.disabled,
-            onChange: handleInputChange
-          }, null, 40, _hoisted_2$c),
-          vue.createElementVNode("div", _hoisted_3$b, [
-            vue.createVNode(vue.unref(vue$1.Icon), {
-              icon: "heroicons:cloud-arrow-up",
-              class: vue.normalizeClass(["size-12 mx-auto text-gray-400", { "text-primary-500": isDragging.value }])
-            }, null, 8, ["class"]),
-            vue.createElementVNode("p", _hoisted_4$7, vue.toDisplayString(__props.label), 1),
-            __props.description ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_5$5, vue.toDisplayString(__props.description), 1)) : vue.createCommentVNode("", true),
-            __props.maxSize ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_6$5, " Max size: " + vue.toDisplayString(formatSize(__props.maxSize)), 1)) : vue.createCommentVNode("", true)
-          ])
-        ], 34),
-        files.value.length > 0 ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_7$4, [
-          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(files.value, (uploadedFile) => {
-            return vue.openBlock(), vue.createElementBlock("li", {
-              key: uploadedFile.id,
-              class: "flex items-center gap-3 p-3 bg-gray-50 dark:bg-gray-800 rounded-lg"
-            }, [
-              vue.createVNode(vue.unref(vue$1.Icon), {
-                icon: getFileIcon(uploadedFile.file),
-                class: "size-8 text-gray-400"
-              }, null, 8, ["icon"]),
-              vue.createElementVNode("div", _hoisted_8$3, [
-                vue.createElementVNode("p", _hoisted_9$2, vue.toDisplayString(uploadedFile.file.name), 1),
-                vue.createElementVNode("p", _hoisted_10$2, vue.toDisplayString(formatSize(uploadedFile.file.size)), 1)
-              ]),
-              vue.createElementVNode("button", {
-                type: "button",
-                class: "p-1 text-gray-400 hover:text-red-500 rounded",
-                onClick: vue.withModifiers(($event) => removeFile(uploadedFile.id), ["stop"])
-              }, [
-                vue.createVNode(vue.unref(vue$1.Icon), {
-                  icon: "heroicons:x-mark",
-                  class: "size-5"
-                })
-              ], 8, _hoisted_11$2)
-            ]);
-          }), 128))
-        ])) : vue.createCommentVNode("", true)
-      ]);
-    };
-  }
-});
-const _hoisted_1$g = { class: "flex items-center gap-1" };
-const _hoisted_2$b = ["disabled", "onClick", "onMousemove"];
-const _hoisted_3$a = {
-  key: 0,
-  class: "ml-2 text-sm font-medium text-gray-700 dark:text-gray-300"
-};
-const _sfc_main$g = /* @__PURE__ */ vue.defineComponent({
-  __name: "Rating",
-  props: {
-    modelValue: { default: 0 },
-    max: { default: 5 },
-    allowHalf: { type: Boolean, default: false },
-    readonly: { type: Boolean, default: false },
-    disabled: { type: Boolean, default: false },
-    size: { default: "md" },
-    filledIcon: { default: "heroicons:star-solid" },
-    emptyIcon: { default: "heroicons:star" },
-    halfIcon: { default: "heroicons:star-solid" },
-    color: { default: "text-yellow-400" },
-    showValue: { type: Boolean, default: false }
-  },
-  emits: ["update:modelValue"],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emit = __emit;
-    const hoverValue = vue.ref(null);
-    const displayValue = vue.computed(() => {
-      return hoverValue.value !== null ? hoverValue.value : props.modelValue;
-    });
-    const sizeClasses = vue.computed(() => {
-      switch (props.size) {
-        case "sm":
-          return "size-4";
-        case "lg":
-          return "size-8";
-        default:
-          return "size-6";
-      }
-    });
-    const getStarState = (index2) => {
-      const value = displayValue.value;
-      if (value >= index2) return "full";
-      if (props.allowHalf && value >= index2 - 0.5) return "half";
-      return "empty";
-    };
-    const handleClick = (index2, event) => {
-      if (props.readonly || props.disabled) return;
-      let value = index2;
-      if (props.allowHalf) {
-        const rect = event.target.getBoundingClientRect();
-        const isLeftHalf = event.clientX - rect.left < rect.width / 2;
-        value = isLeftHalf ? index2 - 0.5 : index2;
-      }
-      emit("update:modelValue", value);
-    };
-    const handleMouseMove = (index2, event) => {
-      if (props.readonly || props.disabled) return;
-      let value = index2;
-      if (props.allowHalf) {
-        const rect = event.target.getBoundingClientRect();
-        const isLeftHalf = event.clientX - rect.left < rect.width / 2;
-        value = isLeftHalf ? index2 - 0.5 : index2;
-      }
-      hoverValue.value = value;
-    };
-    const handleMouseLeave = () => {
-      hoverValue.value = null;
-    };
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$g, [
-        vue.createElementVNode("div", {
-          class: "flex items-center",
-          onMouseleave: handleMouseLeave
-        }, [
-          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.max, (index2) => {
-            return vue.openBlock(), vue.createElementBlock("button", {
-              key: index2,
-              type: "button",
-              class: vue.normalizeClass(["relative focus:outline-hidden focus:ring-2 focus:ring-primary-500 focus:ring-offset-1 rounded", [
-                __props.readonly || __props.disabled ? "cursor-default" : "cursor-pointer",
-                __props.disabled && "opacity-50"
-              ]]),
-              disabled: __props.readonly || __props.disabled,
-              onClick: ($event) => handleClick(index2, $event),
-              onMousemove: ($event) => handleMouseMove(index2, $event)
-            }, [
-              vue.createVNode(vue.unref(vue$1.Icon), {
-                icon: __props.emptyIcon,
-                class: vue.normalizeClass([sizeClasses.value, "text-gray-300 dark:text-gray-600"])
-              }, null, 8, ["icon", "class"]),
-              vue.createElementVNode("div", {
-                class: "absolute inset-0 overflow-hidden",
-                style: vue.normalizeStyle({
-                  width: getStarState(index2) === "full" ? "100%" : getStarState(index2) === "half" ? "50%" : "0%"
-                })
-              }, [
-                vue.createVNode(vue.unref(vue$1.Icon), {
-                  icon: __props.filledIcon,
-                  class: vue.normalizeClass([sizeClasses.value, __props.color])
-                }, null, 8, ["icon", "class"])
-              ], 4)
-            ], 42, _hoisted_2$b);
-          }), 128))
-        ], 32),
-        __props.showValue ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$a, vue.toDisplayString(__props.modelValue.toFixed(__props.allowHalf ? 1 : 0)), 1)) : vue.createCommentVNode("", true)
-      ]);
-    };
-  }
-});
-const _hoisted_1$f = { class: "relative inline-block" };
-const _hoisted_2$a = {
-  key: 0,
-  class: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1"
-};
-const _hoisted_3$9 = ["disabled"];
-const _hoisted_4$6 = { class: "text-sm font-mono text-gray-700 dark:text-gray-300" };
-const _hoisted_5$4 = { class: "grid grid-cols-5 gap-2 mb-3" };
-const _hoisted_6$4 = ["title", "onClick"];
-const _hoisted_7$3 = {
-  key: 0,
-  class: "flex items-center gap-2 pt-3 border-t border-gray-200 dark:border-gray-700"
-};
-const _hoisted_8$2 = ["value"];
-const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
-  __name: "ColorPicker",
-  props: {
-    modelValue: { default: "#3b82f6" },
-    swatches: { default: () => [
-      "#ef4444",
-      "#f97316",
-      "#f59e0b",
-      "#eab308",
-      "#84cc16",
-      "#22c55e",
-      "#10b981",
-      "#14b8a6",
-      "#06b6d4",
-      "#0ea5e9",
-      "#3b82f6",
-      "#6366f1",
-      "#8b5cf6",
-      "#a855f7",
-      "#d946ef",
-      "#ec4899",
-      "#f43f5e",
-      "#78716c",
-      "#737373",
-      "#000000"
-    ] },
-    showInput: { type: Boolean, default: true },
-    disabled: { type: Boolean, default: false },
-    label: {},
-    teleport: { type: [String, Boolean], default: false }
-  },
-  emits: ["update:modelValue"],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const teleportDisabled = vue.computed(() => props.teleport === false);
-    const teleportTarget = vue.computed(() => props.teleport === false ? "body" : props.teleport);
-    const emit = __emit;
-    const isOpen = vue.ref(false);
-    const inputValue = vue.ref(props.modelValue);
-    vue.watch(
-      () => props.modelValue,
-      (newValue) => {
-        inputValue.value = newValue;
-      }
-    );
-    const selectColor = (color) => {
-      emit("update:modelValue", color);
-      inputValue.value = color;
-    };
-    const handleInputChange = () => {
-      const color = inputValue.value;
-      if (/^#([0-9A-Fa-f]{3}){1,2}$/.test(color)) {
-        emit("update:modelValue", color);
-      }
-    };
-    const handleNativeInput = (event) => {
-      const color = event.target.value;
-      emit("update:modelValue", color);
-      inputValue.value = color;
-    };
-    const togglePicker = () => {
-      if (!props.disabled) {
-        isOpen.value = !isOpen.value;
-      }
-    };
-    const closePicker = () => {
-      isOpen.value = false;
-    };
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$f, [
-        __props.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_2$a, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true),
-        vue.createElementVNode("button", {
-          type: "button",
-          class: vue.normalizeClass(["flex items-center gap-2 px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors", { "opacity-50 cursor-not-allowed": __props.disabled }]),
-          disabled: __props.disabled,
-          onClick: togglePicker
-        }, [
-          vue.createElementVNode("span", {
-            class: "size-6 rounded border border-gray-200 dark:border-gray-600",
-            style: vue.normalizeStyle({ backgroundColor: __props.modelValue })
-          }, null, 4),
-          vue.createElementVNode("span", _hoisted_4$6, vue.toDisplayString(__props.modelValue), 1),
-          vue.createVNode(vue.unref(vue$1.Icon), {
-            icon: "heroicons:chevron-down",
-            class: vue.normalizeClass(["size-4 text-gray-400", { "rotate-180": isOpen.value }])
-          }, null, 8, ["class"])
-        ], 10, _hoisted_3$9),
-        (vue.openBlock(), vue.createBlock(vue.Teleport, {
-          to: teleportTarget.value,
-          disabled: teleportDisabled.value
-        }, [
-          vue.createVNode(vue.Transition, {
-            "enter-active-class": "transition duration-100 ease-out",
-            "enter-from-class": "opacity-0 scale-95",
-            "enter-to-class": "opacity-100 scale-100",
-            "leave-active-class": "transition duration-75 ease-in",
-            "leave-from-class": "opacity-100 scale-100",
-            "leave-to-class": "opacity-0 scale-95"
-          }, {
-            default: vue.withCtx(() => [
-              isOpen.value ? (vue.openBlock(), vue.createElementBlock("div", {
-                key: 0,
-                class: "absolute z-50 mt-2 p-3 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-lg",
-                onClick: _cache[1] || (_cache[1] = vue.withModifiers(() => {
-                }, ["stop"]))
-              }, [
-                vue.createElementVNode("div", _hoisted_5$4, [
-                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.swatches, (color) => {
-                    return vue.openBlock(), vue.createElementBlock("button", {
-                      key: color,
-                      type: "button",
-                      class: vue.normalizeClass(["size-8 rounded-lg border-2 transition-transform hover:scale-110 focus:outline-hidden focus:ring-2 focus:ring-primary-500 focus:ring-offset-1", [
-                        __props.modelValue === color ? "border-primary-500 ring-2 ring-primary-500 ring-offset-1" : "border-transparent"
-                      ]]),
-                      style: vue.normalizeStyle({ backgroundColor: color }),
-                      title: color,
-                      onClick: ($event) => selectColor(color)
-                    }, [
-                      __props.modelValue === color ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-                        key: 0,
-                        icon: "heroicons:check",
-                        class: vue.normalizeClass(["size-4 mx-auto", [
-                          ["#ffffff", "#f9fafb", "#f3f4f6", "#e5e7eb", "#eab308", "#f59e0b"].includes(color) ? "text-gray-800" : "text-white"
-                        ]])
-                      }, null, 8, ["class"])) : vue.createCommentVNode("", true)
-                    ], 14, _hoisted_6$4);
-                  }), 128))
-                ]),
-                __props.showInput ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$3, [
-                  vue.createElementVNode("input", {
-                    type: "color",
-                    value: __props.modelValue,
-                    class: "size-8 rounded cursor-pointer border-0 p-0",
-                    onInput: handleNativeInput
-                  }, null, 40, _hoisted_8$2),
-                  vue.withDirectives(vue.createElementVNode("input", {
-                    "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inputValue.value = $event),
-                    type: "text",
-                    class: "flex-1 px-2 py-1 text-sm font-mono border border-gray-300 dark:border-gray-600 rounded bg-white dark:bg-gray-700 text-gray-900 dark:text-white",
-                    placeholder: "#000000",
-                    onChange: handleInputChange,
-                    onKeyup: vue.withKeys(handleInputChange, ["enter"])
-                  }, null, 544), [
-                    [vue.vModelText, inputValue.value]
-                  ])
-                ])) : vue.createCommentVNode("", true)
-              ])) : vue.createCommentVNode("", true)
-            ]),
-            _: 1
-          }),
-          isOpen.value ? (vue.openBlock(), vue.createElementBlock("div", {
-            key: 0,
-            class: "fixed inset-0 z-40",
-            onClick: closePicker
-          })) : vue.createCommentVNode("", true)
-        ], 8, ["to", "disabled"]))
-      ]);
-    };
-  }
-});
-const _hoisted_1$e = { class: "space-y-2" };
-const _hoisted_2$9 = {
-  key: 0,
-  class: "flex justify-between text-sm font-medium text-gray-700 dark:text-gray-300"
-};
-const _hoisted_3$8 = {
-  key: 1,
-  class: "flex justify-between text-xs text-gray-500 dark:text-gray-400"
-};
-const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
-  __name: "RangeSlider",
-  props: {
-    modelValue: { default: () => [25, 75] },
-    min: { default: 0 },
-    max: { default: 100 },
-    step: { default: 1 },
-    disabled: { type: Boolean, default: false },
-    showLabels: { type: Boolean, default: true },
-    showMinMax: { type: Boolean, default: true },
-    formatLabel: { type: Function, default: (v) => v.toString() }
-  },
-  emits: ["update:modelValue"],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emit = __emit;
-    const sliderRef = vue.ref();
-    const dragging = vue.ref(null);
-    const minValue = vue.computed(() => props.modelValue[0]);
-    const maxValue = vue.computed(() => props.modelValue[1]);
-    const minPercent = vue.computed(() => {
-      return (minValue.value - props.min) / (props.max - props.min) * 100;
-    });
-    const maxPercent = vue.computed(() => {
-      return (maxValue.value - props.min) / (props.max - props.min) * 100;
-    });
-    const rangeStyle = vue.computed(() => ({
-      left: `${minPercent.value}%`,
-      width: `${maxPercent.value - minPercent.value}%`
-    }));
-    const getValueFromPosition = (clientX) => {
-      if (!sliderRef.value) return props.min;
-      const rect = sliderRef.value.getBoundingClientRect();
-      const percent = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width));
-      const rawValue = props.min + percent * (props.max - props.min);
-      const steppedValue = Math.round(rawValue / props.step) * props.step;
-      return Math.max(props.min, Math.min(props.max, steppedValue));
-    };
-    const updateValue = (handle, newValue) => {
-      const [currentMin, currentMax] = props.modelValue;
-      if (handle === "min") {
-        const clampedValue = Math.min(newValue, currentMax);
-        emit("update:modelValue", [clampedValue, currentMax]);
-      } else {
-        const clampedValue = Math.max(newValue, currentMin);
-        emit("update:modelValue", [currentMin, clampedValue]);
-      }
-    };
-    const handleMouseDown = (handle) => (event) => {
-      if (props.disabled) return;
-      event.preventDefault();
-      dragging.value = handle;
-      const handleMouseMove = (e) => {
-        if (dragging.value) {
-          const value = getValueFromPosition(e.clientX);
-          updateValue(dragging.value, value);
-        }
-      };
-      const handleMouseUp = () => {
-        dragging.value = null;
-        document.removeEventListener("mousemove", handleMouseMove);
-        document.removeEventListener("mouseup", handleMouseUp);
-      };
-      document.addEventListener("mousemove", handleMouseMove);
-      document.addEventListener("mouseup", handleMouseUp);
-    };
-    const handleTrackClick = (event) => {
-      if (props.disabled) return;
-      const value = getValueFromPosition(event.clientX);
-      const distToMin = Math.abs(value - minValue.value);
-      const distToMax = Math.abs(value - maxValue.value);
-      if (distToMin <= distToMax) {
-        updateValue("min", value);
-      } else {
-        updateValue("max", value);
-      }
-    };
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$e, [
-        __props.showLabels ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$9, [
-          vue.createElementVNode("span", null, vue.toDisplayString(__props.formatLabel(minValue.value)), 1),
-          vue.createElementVNode("span", null, vue.toDisplayString(__props.formatLabel(maxValue.value)), 1)
-        ])) : vue.createCommentVNode("", true),
-        vue.createElementVNode("div", {
-          ref_key: "sliderRef",
-          ref: sliderRef,
-          class: vue.normalizeClass(["relative h-2 rounded-full cursor-pointer", [
-            __props.disabled ? "bg-gray-200 dark:bg-gray-700 cursor-not-allowed" : "bg-gray-200 dark:bg-gray-700"
-          ]]),
-          onClick: handleTrackClick
-        }, [
-          vue.createElementVNode("div", {
-            class: vue.normalizeClass(["absolute h-full rounded-full", [__props.disabled ? "bg-gray-400" : "bg-primary-500"]]),
-            style: vue.normalizeStyle(rangeStyle.value)
-          }, null, 6),
-          vue.createElementVNode("div", {
-            class: vue.normalizeClass(["absolute top-1/2 -translate-y-1/2 -translate-x-1/2 size-5 rounded-full border-2 shadow transition-shadow", [
-              __props.disabled ? "bg-gray-300 border-gray-400 cursor-not-allowed" : "bg-white border-primary-500 cursor-grab hover:shadow-md active:cursor-grabbing",
-              dragging.value === "min" && "ring-4 ring-primary-200 dark:ring-primary-800"
-            ]]),
-            style: vue.normalizeStyle({ left: `${minPercent.value}%` }),
-            onMousedown: _cache[0] || (_cache[0] = ($event) => handleMouseDown("min"))
-          }, null, 38),
-          vue.createElementVNode("div", {
-            class: vue.normalizeClass(["absolute top-1/2 -translate-y-1/2 -translate-x-1/2 size-5 rounded-full border-2 shadow transition-shadow", [
-              __props.disabled ? "bg-gray-300 border-gray-400 cursor-not-allowed" : "bg-white border-primary-500 cursor-grab hover:shadow-md active:cursor-grabbing",
-              dragging.value === "max" && "ring-4 ring-primary-200 dark:ring-primary-800"
-            ]]),
-            style: vue.normalizeStyle({ left: `${maxPercent.value}%` }),
-            onMousedown: _cache[1] || (_cache[1] = ($event) => handleMouseDown("max"))
-          }, null, 38)
-        ], 2),
-        __props.showMinMax ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$8, [
-          vue.createElementVNode("span", null, vue.toDisplayString(__props.formatLabel(__props.min)), 1),
-          vue.createElementVNode("span", null, vue.toDisplayString(__props.formatLabel(__props.max)), 1)
-        ])) : vue.createCommentVNode("", true)
-      ]);
-    };
-  }
-});
-const _hoisted_1$d = ["aria-expanded", "aria-controls"];
-const _hoisted_2$8 = ["id", "name", "placeholder", "disabled", "aria-controls"];
-const _hoisted_3$7 = { class: "flex items-center gap-1" };
-const _hoisted_4$5 = ["id", "aria-label", "aria-multiselectable"];
-const _hoisted_5$3 = ["aria-selected", "aria-disabled", "disabled", "onClick"];
-const _hoisted_6$3 = { class: "flex-1" };
-const _hoisted_7$2 = {
-  key: 1,
-  class: "px-3 py-2 text-center text-sm text-gray-500 dark:text-gray-400",
-  role: "status"
-};
-const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
-  __name: "Combobox",
-  props: {
-    modelValue: {},
-    options: {},
-    placeholder: { default: "Select..." },
-    searchPlaceholder: { default: "Search..." },
-    multiple: { type: Boolean, default: false },
-    disabled: { type: Boolean, default: false },
-    clearable: { type: Boolean, default: false },
-    noResultsText: { default: "No results found" },
-    name: {},
-    id: {},
-    teleport: { type: [String, Boolean], default: false }
-  },
-  emits: ["update:modelValue"],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const { id: generatedId, related } = useId.useId({ prefix: "combobox", id: props.id });
-    const inputId = vue.computed(() => props.id ?? generatedId.value);
-    const listboxId = vue.computed(() => related("listbox"));
-    const teleportDisabled = vue.computed(() => props.teleport === false);
-    const teleportTarget = vue.computed(() => props.teleport === false ? "body" : props.teleport);
-    const emit = __emit;
-    const containerRef = vue.ref();
-    const inputRef = vue.ref();
-    const isOpen = vue.ref(false);
-    const search = vue.ref("");
-    index.onClickOutside(containerRef, () => {
-      isOpen.value = false;
-    });
-    const filteredOptions = vue.computed(() => {
-      if (!search.value) return props.options;
-      const query = search.value.toLowerCase();
-      return props.options.filter(
-        (opt) => opt.label.toLowerCase().includes(query)
-      );
-    });
-    const selectedOptions = vue.computed(() => {
-      if (props.modelValue === null || props.modelValue === void 0) return [];
-      const values = Array.isArray(props.modelValue) ? props.modelValue : [props.modelValue];
-      return props.options.filter((opt) => values.includes(opt.value));
-    });
-    const displayValue = vue.computed(() => {
-      var _a;
-      if (selectedOptions.value.length === 0) return "";
-      if (props.multiple) {
-        return selectedOptions.value.map((o) => o.label).join(", ");
-      }
-      return ((_a = selectedOptions.value[0]) == null ? void 0 : _a.label) || "";
-    });
-    const isSelected = (option) => {
-      if (props.modelValue === null || props.modelValue === void 0) return false;
-      if (Array.isArray(props.modelValue)) {
-        return props.modelValue.includes(option.value);
-      }
-      return props.modelValue === option.value;
-    };
-    const toggleOption = (option) => {
-      if (option.disabled) return;
-      if (props.multiple) {
-        const currentValues = Array.isArray(props.modelValue) ? [...props.modelValue] : [];
-        const index2 = currentValues.indexOf(option.value);
-        if (index2 === -1) {
-          currentValues.push(option.value);
-        } else {
-          currentValues.splice(index2, 1);
-        }
-        emit("update:modelValue", currentValues);
-      } else {
-        emit("update:modelValue", option.value);
-        isOpen.value = false;
-        search.value = "";
-      }
-    };
-    const clear = () => {
-      emit("update:modelValue", props.multiple ? [] : null);
-      search.value = "";
-    };
-    const openDropdown = () => {
-      if (props.disabled) return;
-      isOpen.value = true;
-      vue.nextTick(() => {
-        var _a;
-        (_a = inputRef.value) == null ? void 0 : _a.focus();
-      });
-    };
-    vue.watch(isOpen, (open) => {
-      if (!open) {
-        search.value = "";
-      }
-    });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", {
-        ref_key: "containerRef",
-        ref: containerRef,
-        class: "relative"
-      }, [
-        vue.createElementVNode("div", {
-          role: "combobox",
-          "aria-expanded": isOpen.value,
-          "aria-haspopup": "listbox",
-          "aria-controls": listboxId.value,
-          class: vue.normalizeClass([
-            "flex min-h-[42px] w-full cursor-pointer items-center rounded-lg border bg-white px-3 py-2 transition-colors",
-            "dark:bg-gray-900",
-            __props.disabled ? "cursor-not-allowed border-gray-200 bg-gray-50 dark:border-gray-700 dark:bg-gray-800" : isOpen.value ? "border-primary ring-2 ring-primary/20" : "border-gray-300 hover:border-gray-400 dark:border-gray-600 dark:hover:border-gray-500"
-          ]),
-          onClick: openDropdown
-        }, [
-          !isOpen.value ? (vue.openBlock(), vue.createElementBlock("span", {
-            key: 0,
-            class: vue.normalizeClass([
-              "flex-1 truncate text-sm",
-              selectedOptions.value.length ? "text-gray-900 dark:text-gray-100" : "text-gray-400 dark:text-gray-500"
-            ])
-          }, vue.toDisplayString(displayValue.value || __props.placeholder), 3)) : vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
-            key: 1,
-            id: inputId.value,
-            ref_key: "inputRef",
-            ref: inputRef,
-            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => search.value = $event),
-            type: "text",
-            name: __props.name,
-            placeholder: __props.searchPlaceholder,
-            disabled: __props.disabled,
-            "aria-autocomplete": "list",
-            "aria-controls": listboxId.value,
-            class: "flex-1 border-none bg-transparent text-sm text-gray-900 outline-hidden placeholder:text-gray-400 dark:text-gray-100 dark:placeholder:text-gray-500",
-            onClick: _cache[1] || (_cache[1] = vue.withModifiers(() => {
-            }, ["stop"]))
-          }, null, 8, _hoisted_2$8)), [
-            [vue.vModelText, search.value]
-          ]),
-          vue.createElementVNode("div", _hoisted_3$7, [
-            __props.clearable && selectedOptions.value.length > 0 && !__props.disabled ? (vue.openBlock(), vue.createElementBlock("button", {
-              key: 0,
-              type: "button",
-              class: "rounded p-0.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300",
-              "aria-label": "Clear selection",
-              onClick: vue.withModifiers(clear, ["stop"])
-            }, [
-              vue.createVNode(vue.unref(vue$1.Icon), {
-                icon: "lucide:x",
-                class: "size-4",
-                "aria-hidden": "true"
-              })
-            ])) : vue.createCommentVNode("", true),
-            vue.createVNode(vue.unref(vue$1.Icon), {
-              icon: "lucide:chevron-down",
-              class: vue.normalizeClass([
-                "size-4 text-gray-400 transition-transform",
-                isOpen.value && "rotate-180"
-              ]),
-              "aria-hidden": "true"
-            }, null, 8, ["class"])
-          ])
-        ], 10, _hoisted_1$d),
-        (vue.openBlock(), vue.createBlock(vue.Teleport, {
-          to: teleportTarget.value,
-          disabled: teleportDisabled.value
-        }, [
-          vue.createVNode(vue.Transition, {
-            "enter-active-class": "transition duration-100 ease-out",
-            "enter-from-class": "transform scale-95 opacity-0",
-            "enter-to-class": "transform scale-100 opacity-100",
-            "leave-active-class": "transition duration-75 ease-in",
-            "leave-from-class": "transform scale-100 opacity-100",
-            "leave-to-class": "transform scale-95 opacity-0"
-          }, {
-            default: vue.withCtx(() => [
-              isOpen.value ? (vue.openBlock(), vue.createElementBlock("div", {
-                key: 0,
-                id: listboxId.value,
-                role: "listbox",
-                "aria-label": __props.placeholder,
-                "aria-multiselectable": __props.multiple || void 0,
-                class: "absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-lg border border-gray-200 bg-white py-1 shadow-lg dark:border-gray-700 dark:bg-gray-900"
-              }, [
-                filteredOptions.value.length ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(filteredOptions.value, (option) => {
-                  return vue.openBlock(), vue.createElementBlock("button", {
-                    key: option.value,
-                    type: "button",
-                    role: "option",
-                    "aria-selected": isSelected(option),
-                    "aria-disabled": option.disabled || void 0,
-                    disabled: option.disabled,
-                    class: vue.normalizeClass([
-                      "flex w-full items-center gap-2 px-3 py-2 text-left text-sm transition-colors",
-                      option.disabled ? "cursor-not-allowed text-gray-400 dark:text-gray-500" : isSelected(option) ? "bg-primary/10 text-primary dark:bg-primary/20" : "text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-800"
-                    ]),
-                    onClick: ($event) => toggleOption(option)
-                  }, [
-                    __props.multiple ? (vue.openBlock(), vue.createElementBlock("span", {
-                      key: 0,
-                      class: vue.normalizeClass([
-                        "flex size-4 items-center justify-center rounded border",
-                        isSelected(option) ? "border-primary bg-primary text-white" : "border-gray-300 dark:border-gray-600"
-                      ]),
-                      "aria-hidden": "true"
-                    }, [
-                      isSelected(option) ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-                        key: 0,
-                        icon: "lucide:check",
-                        class: "size-3"
-                      })) : vue.createCommentVNode("", true)
-                    ], 2)) : vue.createCommentVNode("", true),
-                    vue.createElementVNode("span", _hoisted_6$3, vue.toDisplayString(option.label), 1),
-                    !__props.multiple && isSelected(option) ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-                      key: 1,
-                      icon: "lucide:check",
-                      class: "size-4 text-primary",
-                      "aria-hidden": "true"
-                    })) : vue.createCommentVNode("", true)
-                  ], 10, _hoisted_5$3);
-                }), 128)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$2, vue.toDisplayString(__props.noResultsText), 1))
-              ], 8, _hoisted_4$5)) : vue.createCommentVNode("", true)
-            ]),
-            _: 1
-          })
-        ], 8, ["to", "disabled"]))
-      ], 512);
-    };
-  }
-});
-const _hoisted_1$c = { class: "relative" };
-const _hoisted_2$7 = {
-  key: 0,
-  class: "text-red-500 ml-0.5"
-};
-const _hoisted_3$6 = ["id", "disabled", "aria-invalid", "aria-describedby"];
-const _hoisted_4$4 = {
-  key: 0,
-  class: "flex items-center gap-2 flex-1"
-};
-const _hoisted_5$2 = { class: "flex size-8 items-center justify-center rounded bg-gray-100 dark:bg-gray-800" };
-const _hoisted_6$2 = { class: "text-gray-700 dark:text-gray-300 font-mono text-xs truncate" };
-const _hoisted_7$1 = {
-  key: 1,
-  class: "flex-1 text-gray-400 dark:text-gray-500"
-};
-const _hoisted_8$1 = { class: "relative mb-4" };
-const _hoisted_9$1 = ["placeholder"];
-const _hoisted_10$1 = {
-  key: 0,
-  class: "absolute right-3 top-1/2 -translate-y-1/2"
-};
-const _hoisted_11$1 = { class: "max-h-64 overflow-y-auto" };
-const _hoisted_12$1 = {
-  key: 0,
-  class: "py-8 text-center text-sm text-gray-500"
-};
-const _hoisted_13 = {
-  key: 1,
-  class: "grid grid-cols-8 gap-1"
-};
-const _hoisted_14 = ["title", "onClick"];
-const _hoisted_15 = { class: "mt-4 flex items-center justify-between border-t border-gray-200 pt-4 dark:border-gray-700" };
-const _hoisted_16 = { class: "text-xs text-gray-500" };
-const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
-  __name: "IconPicker",
-  props: /* @__PURE__ */ vue.mergeModels({
-    label: {},
-    placeholder: { default: "Rechercher une icône..." },
-    help: {},
-    error: {},
-    required: { type: Boolean },
-    disabled: { type: Boolean },
-    id: {},
-    collections: { default: () => ["mdi", "heroicons", "lucide"] },
-    limit: { default: 48 }
-  }, {
-    "modelValue": { default: "" },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const { id: generatedId, related } = useId.useId({ prefix: "iconpicker", id: props.id });
-    const inputId = vue.computed(() => props.id ?? generatedId.value);
-    const helpId = vue.computed(() => related("help"));
-    const searchQuery = vue.ref("");
-    const isOpen = vue.ref(false);
-    const isLoading = vue.ref(false);
-    const searchResults = vue.ref([]);
-    const popularIcons = [
-      "mdi:heart",
-      "mdi:star",
-      "mdi:home",
-      "mdi:account",
-      "mdi:email",
-      "mdi:phone",
-      "mdi:calendar",
-      "mdi:clock",
-      "mdi:check",
-      "mdi:close",
-      "mdi:plus",
-      "mdi:minus",
-      "mdi:stethoscope",
-      "mdi:hospital",
-      "mdi:medical-bag",
-      "mdi:pill",
-      "mdi:heart-pulse",
-      "mdi:tooth",
-      "mdi:eye",
-      "mdi:brain",
-      "mdi:lungs",
-      "mdi:bone",
-      "heroicons:heart",
-      "heroicons:star",
-      "heroicons:home",
-      "heroicons:user",
-      "heroicons:envelope",
-      "heroicons:phone",
-      "heroicons:calendar",
-      "heroicons:clock",
-      "heroicons:check",
-      "heroicons:x-mark",
-      "heroicons:plus",
-      "heroicons:minus",
-      "lucide:heart",
-      "lucide:star",
-      "lucide:home",
-      "lucide:user",
-      "lucide:mail",
-      "lucide:phone",
-      "lucide:calendar",
-      "lucide:clock",
-      "lucide:check",
-      "lucide:x",
-      "lucide:plus",
-      "lucide:minus"
-    ];
-    const displayedIcons = vue.computed(() => {
-      if (searchQuery.value && searchResults.value.length > 0) {
-        return searchResults.value;
-      }
-      return popularIcons;
-    });
-    const hasError = vue.computed(() => props.error && typeof props.error === "string");
-    async function searchIcons(query) {
-      if (!query || query.length < 2) {
-        searchResults.value = [];
-        return;
-      }
-      isLoading.value = true;
-      try {
-        const collectionsParam = props.collections.join(",");
-        const response = await fetch(
-          `https://api.iconify.design/search?query=${encodeURIComponent(query)}&limit=${props.limit}&prefixes=${collectionsParam}`
-        );
-        const data = await response.json();
-        searchResults.value = data.icons || [];
-      } catch (error) {
-        console.error("Failed to search icons:", error);
-        searchResults.value = [];
-      } finally {
-        isLoading.value = false;
-      }
-    }
-    const debouncedSearch = index.useDebounceFn(searchIcons, 300);
-    vue.watch(searchQuery, (query) => {
-      debouncedSearch(query);
-    });
-    function selectIcon(icon) {
-      modelValue.value = icon;
-      isOpen.value = false;
-      searchQuery.value = "";
-    }
-    function clearSelection() {
-      modelValue.value = "";
-    }
-    function openPicker() {
-      if (!props.disabled) {
-        isOpen.value = true;
-      }
-    }
-    function closePicker() {
-      isOpen.value = false;
-      searchQuery.value = "";
-    }
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$c, [
-        __props.label ? (vue.openBlock(), vue.createBlock(_sfc_main$r, {
-          key: 0,
-          "html-for": inputId.value,
-          error: __props.error
-        }, {
-          default: vue.withCtx(() => [
-            vue.createTextVNode(vue.toDisplayString(__props.label) + " ", 1),
-            __props.required ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$7, "*")) : vue.createCommentVNode("", true)
-          ]),
-          _: 1
-        }, 8, ["html-for", "error"])) : vue.createCommentVNode("", true),
-        vue.createElementVNode("button", {
-          id: inputId.value,
-          type: "button",
-          disabled: __props.disabled,
-          "aria-invalid": hasError.value || void 0,
-          "aria-describedby": hasError.value ? helpId.value : void 0,
-          class: vue.normalizeClass(["mt-1 flex w-full items-center gap-3 rounded-md border bg-white px-3 py-2 text-left text-sm shadow-sm transition-colors focus:outline-none focus:ring-2 focus:ring-primary dark:bg-gray-900", [
-            hasError.value ? "border-red-500 focus:border-red-500 focus:ring-red-500" : "border-gray-300 focus:border-primary dark:border-gray-700",
-            __props.disabled ? "cursor-not-allowed bg-gray-50 dark:bg-gray-950" : "cursor-pointer hover:border-gray-400 dark:hover:border-gray-600"
-          ]]),
-          onClick: openPicker
-        }, [
-          modelValue.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$4, [
-            vue.createElementVNode("div", _hoisted_5$2, [
-              vue.createVNode(vue.unref(vue$1.Icon), {
-                icon: modelValue.value,
-                class: "size-5 text-gray-700 dark:text-gray-300"
-              }, null, 8, ["icon"])
-            ]),
-            vue.createElementVNode("span", _hoisted_6$2, vue.toDisplayString(modelValue.value), 1)
-          ])) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_7$1, vue.toDisplayString(__props.placeholder), 1)),
-          modelValue.value && !__props.disabled ? (vue.openBlock(), vue.createElementBlock("button", {
-            key: 2,
-            type: "button",
-            class: "p-1 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300",
-            onClick: vue.withModifiers(clearSelection, ["stop"])
-          }, [
-            vue.createVNode(vue.unref(vue$1.Icon), {
-              icon: "lucide:x",
-              class: "size-4"
-            })
-          ])) : vue.createCommentVNode("", true),
-          vue.createVNode(vue.unref(vue$1.Icon), {
-            icon: "lucide:chevron-down",
-            class: "size-4 text-gray-400"
-          })
-        ], 10, _hoisted_3$6),
-        __props.help && !hasError.value ? (vue.openBlock(), vue.createBlock(_sfc_main$q, {
-          key: 1,
-          id: helpId.value
-        }, {
-          default: vue.withCtx(() => [
-            vue.createTextVNode(vue.toDisplayString(__props.help), 1)
-          ]),
-          _: 1
-        }, 8, ["id"])) : vue.createCommentVNode("", true),
-        hasError.value ? (vue.openBlock(), vue.createBlock(_sfc_main$q, {
-          key: 2,
-          id: helpId.value,
-          error: true
-        }, {
-          default: vue.withCtx(() => [
-            vue.createTextVNode(vue.toDisplayString(__props.error), 1)
-          ]),
-          _: 1
-        }, 8, ["id"])) : vue.createCommentVNode("", true),
-        (vue.openBlock(), vue.createBlock(vue.Teleport, { to: "body" }, [
-          isOpen.value ? (vue.openBlock(), vue.createElementBlock("div", {
-            key: 0,
-            class: "fixed inset-0 z-50",
-            onClick: closePicker
-          }, [
-            vue.createElementVNode("div", {
-              class: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 w-full max-w-md rounded-lg border border-gray-200 bg-white p-4 shadow-xl dark:border-gray-700 dark:bg-gray-900",
-              onClick: _cache[1] || (_cache[1] = vue.withModifiers(() => {
-              }, ["stop"]))
-            }, [
-              vue.createElementVNode("div", _hoisted_8$1, [
-                vue.createVNode(vue.unref(vue$1.Icon), {
-                  icon: "lucide:search",
-                  class: "absolute left-3 top-1/2 size-4 -translate-y-1/2 text-gray-400"
-                }),
-                vue.withDirectives(vue.createElementVNode("input", {
-                  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => searchQuery.value = $event),
-                  type: "text",
-                  placeholder: __props.placeholder,
-                  class: "w-full rounded-md border border-gray-300 bg-white py-2 pl-10 pr-4 text-sm text-gray-800 placeholder-gray-400 focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary dark:border-gray-700 dark:bg-gray-800 dark:text-gray-200 dark:placeholder-gray-500",
-                  autofocus: ""
-                }, null, 8, _hoisted_9$1), [
-                  [vue.vModelText, searchQuery.value]
-                ]),
-                isLoading.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_10$1, [
-                  vue.createVNode(vue.unref(vue$1.Icon), {
-                    icon: "lucide:loader-2",
-                    class: "size-4 animate-spin text-gray-400"
-                  })
-                ])) : vue.createCommentVNode("", true)
-              ]),
-              vue.createElementVNode("div", _hoisted_11$1, [
-                displayedIcons.value.length === 0 && searchQuery.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12$1, ' Aucune icône trouvée pour "' + vue.toDisplayString(searchQuery.value) + '" ', 1)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_13, [
-                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(displayedIcons.value, (icon) => {
-                    return vue.openBlock(), vue.createElementBlock("button", {
-                      key: icon,
-                      type: "button",
-                      class: vue.normalizeClass(["flex size-9 items-center justify-center rounded transition-colors", [
-                        modelValue.value === icon ? "bg-primary text-white" : "hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-300"
-                      ]]),
-                      title: icon,
-                      onClick: ($event) => selectIcon(icon)
-                    }, [
-                      vue.createVNode(vue.unref(vue$1.Icon), {
-                        icon,
-                        class: "size-5"
-                      }, null, 8, ["icon"])
-                    ], 10, _hoisted_14);
-                  }), 128))
-                ]))
-              ]),
-              vue.createElementVNode("div", _hoisted_15, [
-                vue.createElementVNode("p", _hoisted_16, vue.toDisplayString(searchQuery.value ? `${displayedIcons.value.length} résultats` : "Icônes populaires"), 1),
-                vue.createElementVNode("button", {
-                  type: "button",
-                  class: "text-sm text-gray-500 hover:text-gray-700 dark:hover:text-gray-300",
-                  onClick: closePicker
-                }, " Fermer ")
-              ])
-            ])
-          ])) : vue.createCommentVNode("", true)
-        ]))
-      ]);
-    };
-  }
-});
-const _hoisted_1$b = { class: "flex items-center justify-between" };
-const _hoisted_2$6 = { class: "flex items-center gap-3" };
-const _hoisted_3$5 = { class: "text-lg font-semibold text-gray-900 dark:text-white" };
-const _hoisted_4$3 = {
-  key: 0,
-  class: "text-sm text-gray-500 dark:text-gray-400"
-};
-const _hoisted_5$1 = { class: "p-5 sm:p-6" };
-const _hoisted_6$1 = {
-  key: 0,
-  class: "px-5 py-4 bg-gray-50 dark:bg-slate-800/50 border-t border-gray-100 dark:border-slate-700"
-};
-const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
-  __name: "FormSection",
-  props: /* @__PURE__ */ vue.mergeModels({
-    title: {},
-    subtitle: {},
-    icon: {},
-    iconColor: { default: "primary" },
-    bordered: { type: Boolean, default: true },
-    collapsible: { type: Boolean, default: false },
-    collapsed: { type: Boolean, default: false }
-  }, {
-    "collapsed": { type: Boolean, ...{ default: false } },
-    "collapsedModifiers": {}
-  }),
-  emits: ["update:collapsed"],
-  setup(__props) {
-    const isCollapsed = vue.useModel(__props, "collapsed");
-    function toggleCollapse() {
-      isCollapsed.value = !isCollapsed.value;
-    }
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", {
-        class: vue.normalizeClass([
-          "bg-white dark:bg-slate-800 rounded-2xl overflow-hidden",
-          __props.bordered && "border border-gray-100 dark:border-slate-700 shadow-sm"
-        ])
-      }, [
-        vue.createElementVNode("div", {
-          class: vue.normalizeClass([
-            "p-5 border-b border-gray-100 dark:border-slate-700 bg-linear-to-r from-gray-50 to-white dark:from-slate-800 dark:to-slate-800",
-            __props.collapsible && "cursor-pointer hover:bg-gray-50 dark:hover:bg-slate-700/50 transition-colors"
-          ]),
-          onClick: _cache[0] || (_cache[0] = ($event) => __props.collapsible && toggleCollapse())
-        }, [
-          vue.createElementVNode("div", _hoisted_1$b, [
-            vue.createElementVNode("div", _hoisted_2$6, [
-              __props.icon ? (vue.openBlock(), vue.createElementBlock("div", {
-                key: 0,
-                class: vue.normalizeClass([
-                  "size-10 rounded-xl flex items-center justify-center",
-                  __props.iconColor === "primary" && "bg-primary-100 dark:bg-primary-900/30",
-                  __props.iconColor === "gray" && "bg-gray-100 dark:bg-slate-700",
-                  __props.iconColor === "success" && "bg-emerald-100 dark:bg-emerald-900/30",
-                  __props.iconColor === "warning" && "bg-amber-100 dark:bg-amber-900/30",
-                  __props.iconColor === "danger" && "bg-red-100 dark:bg-red-900/30"
-                ])
-              }, [
-                vue.createVNode(vue.unref(vue$1.Icon), {
-                  icon: __props.icon,
-                  class: vue.normalizeClass([
-                    "size-5",
-                    __props.iconColor === "primary" && "text-primary-600 dark:text-primary-400",
-                    __props.iconColor === "gray" && "text-gray-600 dark:text-gray-400",
-                    __props.iconColor === "success" && "text-emerald-600 dark:text-emerald-400",
-                    __props.iconColor === "warning" && "text-amber-600 dark:text-amber-400",
-                    __props.iconColor === "danger" && "text-red-600 dark:text-red-400"
-                  ])
-                }, null, 8, ["icon", "class"])
-              ], 2)) : vue.createCommentVNode("", true),
-              vue.createElementVNode("div", null, [
-                vue.createElementVNode("h2", _hoisted_3$5, [
-                  vue.renderSlot(_ctx.$slots, "title", {}, () => [
-                    vue.createTextVNode(vue.toDisplayString(__props.title), 1)
-                  ])
-                ]),
-                __props.subtitle ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_4$3, [
-                  vue.renderSlot(_ctx.$slots, "subtitle", {}, () => [
-                    vue.createTextVNode(vue.toDisplayString(__props.subtitle), 1)
-                  ])
-                ])) : vue.createCommentVNode("", true)
-              ])
-            ]),
-            __props.collapsible ? (vue.openBlock(), vue.createElementBlock("button", {
-              key: 0,
-              type: "button",
-              class: "p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-slate-700 transition-colors",
-              onClick: vue.withModifiers(toggleCollapse, ["stop"])
-            }, [
-              vue.createVNode(vue.unref(vue$1.Icon), {
-                icon: "heroicons:chevron-down",
-                class: vue.normalizeClass([
-                  "w-5 h-5 text-gray-400 transition-transform duration-200",
-                  isCollapsed.value && "-rotate-90"
-                ])
-              }, null, 8, ["class"])
-            ])) : vue.createCommentVNode("", true),
-            vue.renderSlot(_ctx.$slots, "header-actions")
-          ])
-        ], 2),
-        vue.withDirectives(vue.createElementVNode("div", _hoisted_5$1, [
-          vue.renderSlot(_ctx.$slots, "default")
-        ], 512), [
-          [vue.vShow, !isCollapsed.value]
-        ]),
-        _ctx.$slots.footer ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", _hoisted_6$1, [
-          vue.renderSlot(_ctx.$slots, "footer")
-        ], 512)), [
-          [vue.vShow, !isCollapsed.value]
-        ]) : vue.createCommentVNode("", true)
-      ], 2);
-    };
-  }
-});
-const _hoisted_1$a = { key: 1 };
-const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
-  __name: "FormActions",
-  props: {
-    submitLabel: { default: "Enregistrer" },
-    cancelLabel: { default: "Annuler" },
-    submitIcon: { default: "heroicons:check" },
-    cancelIcon: { default: "heroicons:x-mark" },
-    loading: { type: Boolean },
-    loadingLabel: {},
-    disabled: { type: Boolean },
-    showCancel: { type: Boolean, default: true },
-    align: { default: "right" },
-    stackOnMobile: { type: Boolean, default: false },
-    submitVariant: { default: "primary" }
-  },
-  emits: ["submit", "cancel"],
-  setup(__props, { emit: __emit }) {
-    const emit = __emit;
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", {
-        class: vue.normalizeClass([
-          "flex gap-3 pt-2",
-          __props.align === "left" && "justify-start",
-          __props.align === "center" && "justify-center",
-          __props.align === "right" && "justify-end",
-          __props.align === "stretch" && "[&>*]:flex-1",
-          __props.stackOnMobile && "flex-col sm:flex-row"
-        ])
-      }, [
-        __props.showCancel ? (vue.openBlock(), vue.createBlock(Button_vue_vue_type_script_setup_true_lang._sfc_main, {
-          key: 0,
-          type: "button",
-          variant: "outline",
-          disabled: __props.loading,
-          class: vue.normalizeClass([
-            __props.stackOnMobile && "order-2 sm:order-1"
-          ]),
-          onClick: _cache[0] || (_cache[0] = ($event) => emit("cancel"))
-        }, {
-          default: vue.withCtx(() => [
-            __props.cancelIcon ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-              key: 0,
-              icon: __props.cancelIcon,
-              class: "w-5 h-5"
-            }, null, 8, ["icon"])) : vue.createCommentVNode("", true),
-            vue.createTextVNode(" " + vue.toDisplayString(__props.cancelLabel), 1)
-          ]),
-          _: 1
-        }, 8, ["disabled", "class"])) : vue.createCommentVNode("", true),
-        vue.createVNode(Button_vue_vue_type_script_setup_true_lang._sfc_main, {
-          type: "submit",
-          variant: __props.submitVariant,
-          disabled: __props.disabled || __props.loading,
-          loading: __props.loading,
-          class: vue.normalizeClass([
-            __props.stackOnMobile && "order-1 sm:order-2"
-          ]),
-          onClick: _cache[1] || (_cache[1] = ($event) => emit("submit"))
-        }, {
-          default: vue.withCtx(() => [
-            !__props.loading ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
-              __props.submitIcon ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-                key: 0,
-                icon: __props.submitIcon,
-                class: "w-5 h-5"
-              }, null, 8, ["icon"])) : vue.createCommentVNode("", true),
-              vue.createTextVNode(" " + vue.toDisplayString(__props.submitLabel), 1)
-            ], 64)) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$a, vue.toDisplayString(__props.loadingLabel || __props.submitLabel + "..."), 1))
-          ]),
-          _: 1
-        }, 8, ["variant", "disabled", "loading", "class"]),
-        vue.renderSlot(_ctx.$slots, "extra")
-      ], 2);
-    };
-  }
-});
-const _hoisted_1$9 = ["id", "name", "placeholder", "disabled", "required", "aria-invalid", "aria-required", "aria-describedby"];
-const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "EmailInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    placeholder: { default: "Enter email address..." },
-    size: { default: "md" },
-    disabled: { type: Boolean },
-    showValidation: { type: Boolean, default: true },
-    name: {},
-    id: {},
-    required: { type: Boolean },
-    describedBy: {}
-  }, {
-    "modelValue": { default: "" },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-    const isValid = vue.computed(() => {
-      if (!modelValue.value) return null;
-      return emailRegex.test(modelValue.value);
-    });
-    const isTouched = vue.ref(false);
-    const showStatus = vue.computed(() => {
-      return props.showValidation && isTouched.value && !!modelValue.value;
-    });
-    function handleBlur() {
-      isTouched.value = true;
-    }
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(_sfc_main$p, {
-        icon: "lucide:mail",
-        size: __props.size,
-        disabled: __props.disabled,
-        invalid: showStatus.value && isValid.value === false
-      }, {
-        default: vue.withCtx(({ inputClass }) => [
-          vue.withDirectives(vue.createElementVNode("input", vue.mergeProps({
-            id: __props.id ?? __props.name,
-            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
-            type: "email",
-            name: __props.name,
-            placeholder: __props.placeholder,
-            disabled: __props.disabled,
-            required: __props.required,
-            "aria-invalid": showStatus.value && isValid.value === false || void 0,
-            "aria-required": __props.required || void 0,
-            "aria-describedby": __props.describedBy,
-            class: inputClass
-          }, _ctx.$attrs, { onBlur: handleBlur }), null, 16, _hoisted_1$9), [
-            [vue.vModelText, modelValue.value]
-          ])
-        ]),
-        actions: vue.withCtx(() => [
-          showStatus.value && isValid.value ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-            key: 0,
-            icon: "lucide:check-circle",
-            class: "size-5 text-emerald-500"
-          })) : showStatus.value && isValid.value === false ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-            key: 1,
-            icon: "lucide:alert-circle",
-            class: "size-5 text-red-500"
-          })) : vue.createCommentVNode("", true)
-        ]),
-        _: 1
-      }, 8, ["size", "disabled", "invalid"]);
-    };
-  }
-});
-const _hoisted_1$8 = ["id", "type", "name", "placeholder", "disabled", "required", "aria-required", "aria-describedby"];
-const _hoisted_2$5 = ["disabled"];
-const _hoisted_3$4 = {
-  key: 0,
-  class: "mt-2"
-};
-const _hoisted_4$2 = { class: "h-1.5 w-full rounded-full bg-gray-200 dark:bg-slate-700 overflow-hidden" };
-const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "PasswordInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    placeholder: { default: "Enter password..." },
-    size: { default: "md" },
-    disabled: { type: Boolean },
-    showStrength: { type: Boolean, default: false },
-    name: {},
-    id: {},
-    required: { type: Boolean },
-    describedBy: {},
-    minLength: { default: 8 }
-  }, {
-    "modelValue": { default: "" },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const showPassword = vue.ref(false);
-    const strength = vue.computed(() => {
-      const password = modelValue.value;
-      if (!password) return null;
-      let score = 0;
-      if (password.length >= props.minLength) score++;
-      if (password.length >= 12) score++;
-      if (/[a-z]/.test(password)) score++;
-      if (/[A-Z]/.test(password)) score++;
-      if (/[0-9]/.test(password)) score++;
-      if (/[^a-zA-Z0-9]/.test(password)) score++;
-      if (score <= 2) return "weak";
-      if (score <= 3) return "fair";
-      if (score <= 4) return "good";
-      return "strong";
-    });
-    const strengthConfig = vue.computed(() => {
-      const configs = {
-        weak: { label: "Weak", color: "bg-red-500", width: "w-1/4" },
-        fair: { label: "Fair", color: "bg-orange-500", width: "w-2/4" },
-        good: { label: "Good", color: "bg-yellow-500", width: "w-3/4" },
-        strong: { label: "Strong", color: "bg-emerald-500", width: "w-full" }
-      };
-      return strength.value ? configs[strength.value] : null;
-    });
-    function toggleVisibility() {
-      showPassword.value = !showPassword.value;
-    }
-    return (_ctx, _cache) => {
-      var _a, _b;
-      return vue.openBlock(), vue.createElementBlock("div", null, [
-        vue.createVNode(_sfc_main$p, {
-          icon: "lucide:lock",
-          size: __props.size,
-          disabled: __props.disabled
-        }, {
-          default: vue.withCtx(({ inputClass }) => [
-            vue.withDirectives(vue.createElementVNode("input", vue.mergeProps({
-              id: __props.id ?? __props.name,
-              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
-              type: showPassword.value ? "text" : "password",
-              name: __props.name,
-              placeholder: __props.placeholder,
-              disabled: __props.disabled,
-              required: __props.required,
-              "aria-required": __props.required || void 0,
-              "aria-describedby": __props.describedBy,
-              class: inputClass
-            }, _ctx.$attrs, { autocomplete: "new-password" }), null, 16, _hoisted_1$8), [
-              [vue.vModelDynamic, modelValue.value]
-            ])
-          ]),
-          actions: vue.withCtx(() => [
-            vue.createElementVNode("button", {
-              type: "button",
-              disabled: __props.disabled,
-              class: "p-1 rounded hover:bg-gray-100 dark:hover:bg-slate-600 transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
-              onClick: toggleVisibility
-            }, [
-              vue.createVNode(vue.unref(vue$1.Icon), {
-                icon: showPassword.value ? "lucide:eye-off" : "lucide:eye",
-                class: "size-5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300"
-              }, null, 8, ["icon"])
-            ], 8, _hoisted_2$5)
-          ]),
-          _: 1
-        }, 8, ["size", "disabled"]),
-        __props.showStrength && modelValue.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$4, [
-          vue.createElementVNode("div", _hoisted_4$2, [
-            vue.createElementVNode("div", {
-              class: vue.normalizeClass([
-                "h-full rounded-full transition-all duration-300",
-                (_a = strengthConfig.value) == null ? void 0 : _a.color,
-                (_b = strengthConfig.value) == null ? void 0 : _b.width
-              ])
-            }, null, 2)
-          ]),
-          strengthConfig.value ? (vue.openBlock(), vue.createElementBlock("p", {
-            key: 0,
-            class: vue.normalizeClass([
-              "mt-1 text-xs font-medium",
-              strength.value === "weak" && "text-red-500",
-              strength.value === "fair" && "text-orange-500",
-              strength.value === "good" && "text-yellow-600 dark:text-yellow-500",
-              strength.value === "strong" && "text-emerald-500"
-            ])
-          }, vue.toDisplayString(strengthConfig.value.label), 3)) : vue.createCommentVNode("", true)
-        ])) : vue.createCommentVNode("", true)
-      ]);
-    };
-  }
-});
-const _hoisted_1$7 = ["disabled"];
-const _hoisted_2$4 = { class: "text-lg leading-none" };
-const _hoisted_3$3 = ["id", "value", "name", "placeholder", "disabled", "required", "aria-required", "aria-describedby"];
-const _hoisted_4$1 = { class: "text-xs text-gray-400 font-medium" };
-const _hoisted_5 = {
-  key: 0,
-  class: "absolute z-50 mt-1 w-full bg-white dark:bg-slate-800 border border-gray-200 dark:border-slate-700 rounded-xl shadow-lg overflow-hidden"
-};
-const _hoisted_6 = { class: "p-2 border-b border-gray-100 dark:border-slate-700" };
-const _hoisted_7 = { class: "max-h-48 overflow-y-auto" };
-const _hoisted_8 = ["onClick"];
-const _hoisted_9 = { class: "text-lg" };
-const _hoisted_10 = { class: "flex-1 text-sm text-gray-700 dark:text-gray-300" };
-const _hoisted_11 = { class: "text-sm text-gray-400" };
-const _hoisted_12 = {
-  key: 0,
-  class: "px-3 py-4 text-center text-sm text-gray-500"
-};
-const defaultCountries = [
-  { code: "FR", name: "France", dialCode: "+33", flag: "🇫🇷", format: "# ## ## ## ##" },
-  { code: "US", name: "United States", dialCode: "+1", flag: "🇺🇸", format: "(###) ###-####" },
-  { code: "GB", name: "United Kingdom", dialCode: "+44", flag: "🇬🇧", format: "#### ######" },
-  { code: "DE", name: "Germany", dialCode: "+49", flag: "🇩🇪", format: "### #######" },
-  { code: "ES", name: "Spain", dialCode: "+34", flag: "🇪🇸", format: "### ### ###" },
-  { code: "IT", name: "Italy", dialCode: "+39", flag: "🇮🇹", format: "### ### ####" },
-  { code: "BE", name: "Belgium", dialCode: "+32", flag: "🇧🇪", format: "### ## ## ##" },
-  { code: "CH", name: "Switzerland", dialCode: "+41", flag: "🇨🇭", format: "## ### ## ##" },
-  { code: "CA", name: "Canada", dialCode: "+1", flag: "🇨🇦", format: "(###) ###-####" },
-  { code: "AU", name: "Australia", dialCode: "+61", flag: "🇦🇺", format: "### ### ###" },
-  { code: "ML", name: "Mali", dialCode: "+223", flag: "🇲🇱", format: "## ## ## ##" },
-  { code: "SN", name: "Senegal", dialCode: "+221", flag: "🇸🇳", format: "## ### ## ##" },
-  { code: "CI", name: "Côte d'Ivoire", dialCode: "+225", flag: "🇨🇮", format: "## ## ## ## ##" },
-  { code: "MA", name: "Morocco", dialCode: "+212", flag: "🇲🇦", format: "## ## ## ## ##" },
-  { code: "TN", name: "Tunisia", dialCode: "+216", flag: "🇹🇳", format: "## ### ###" },
-  { code: "DZ", name: "Algeria", dialCode: "+213", flag: "🇩🇿", format: "### ## ## ##" }
-];
-function formatPhoneWithPattern(value, pattern) {
-  if (!pattern) return value;
-  const digits = value.replace(/\D/g, "");
-  let result = "";
-  let digitIndex = 0;
-  for (const char of pattern) {
-    if (digitIndex >= digits.length) break;
-    if (char === "#") {
-      result += digits[digitIndex];
-      digitIndex++;
-    } else {
-      result += char;
-    }
-  }
-  return result;
-}
-function getPhoneDigits(value) {
-  return value.replace(/\D/g, "");
-}
-const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "PhoneInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    placeholder: { default: "Phone number" },
-    size: { default: "md" },
-    disabled: { type: Boolean },
-    showDialCode: { type: Boolean, default: false },
-    name: {},
-    id: {},
-    required: { type: Boolean },
-    describedBy: {},
-    defaultCountry: { default: "FR" },
-    countries: { default: () => defaultCountries }
-  }, {
-    "modelValue": { default: "" },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props, { expose: __expose }) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const selectedCountry = vue.ref(
-      props.countries.find((c) => c.code === props.defaultCountry) || props.countries[0]
-    );
-    const showDropdown = vue.ref(false);
-    const searchQuery = vue.ref("");
-    const dropdownRef = vue.ref(null);
-    const rawDialCodeInput = vue.ref("");
-    const filteredCountries = vue.computed(() => {
-      if (!searchQuery.value) return props.countries;
-      const query = searchQuery.value.toLowerCase();
-      return props.countries.filter(
-        (c) => c.name.toLowerCase().includes(query) || c.dialCode.includes(query) || c.code.toLowerCase().includes(query)
-      );
-    });
-    const fullNumber = vue.computed(() => {
-      if (!modelValue.value) return "";
-      return `${selectedCountry.value.dialCode}${modelValue.value}`;
-    });
-    const displayValue = vue.computed(() => {
-      if (rawDialCodeInput.value) {
-        return rawDialCodeInput.value;
-      }
-      const formatted = formatPhoneWithPattern(modelValue.value, selectedCountry.value.format);
-      if (props.showDialCode && modelValue.value) {
-        return `${selectedCountry.value.dialCode} ${formatted}`;
-      }
-      return formatted;
-    });
-    function selectCountry(country) {
-      selectedCountry.value = country;
-      showDropdown.value = false;
-      searchQuery.value = "";
-    }
-    function parsePhoneWithDialCode(value) {
-      const cleaned = value.replace(/\s/g, "");
-      if (cleaned.startsWith("+") || cleaned.startsWith("00")) {
-        const withPlus = cleaned.startsWith("00") ? "+" + cleaned.slice(2) : cleaned;
-        for (const country of props.countries) {
-          if (withPlus.startsWith(country.dialCode)) {
-            const digits = withPlus.slice(country.dialCode.length).replace(/\D/g, "");
-            return { digits, country };
-          }
-        }
-      }
-      return { digits: getPhoneDigits(value) };
-    }
-    function handleInput(event) {
-      const target = event.target;
-      const inputValue = target.value;
-      if (inputValue.startsWith("+") || inputValue.startsWith("00")) {
-        const { digits, country } = parsePhoneWithDialCode(inputValue);
-        if (country) {
-          selectedCountry.value = country;
-          modelValue.value = digits;
-          rawDialCodeInput.value = "";
-        } else {
-          rawDialCodeInput.value = inputValue;
-          modelValue.value = "";
-        }
-      } else {
-        rawDialCodeInput.value = "";
-        modelValue.value = getPhoneDigits(inputValue);
-      }
-    }
-    function handlePaste(event) {
-      var _a;
-      const pastedData = (_a = event.clipboardData) == null ? void 0 : _a.getData("text");
-      if (!pastedData) return;
-      const { digits, country } = parsePhoneWithDialCode(pastedData);
-      if (country) {
-        event.preventDefault();
-        selectedCountry.value = country;
-        modelValue.value = digits;
-      }
-    }
-    function handleClickOutside(event) {
-      if (dropdownRef.value && !dropdownRef.value.contains(event.target)) {
-        showDropdown.value = false;
-        searchQuery.value = "";
-      }
-    }
-    vue.watch(showDropdown, (isOpen) => {
-      if (isOpen) {
-        document.addEventListener("click", handleClickOutside);
-      } else {
-        document.removeEventListener("click", handleClickOutside);
-      }
-    });
-    __expose({ selectedCountry, fullNumber });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", {
-        class: "relative",
-        ref_key: "dropdownRef",
-        ref: dropdownRef
-      }, [
-        vue.createVNode(_sfc_main$p, {
-          size: __props.size,
-          disabled: __props.disabled
-        }, {
-          icon: vue.withCtx(() => [
-            vue.createElementVNode("button", {
-              type: "button",
-              disabled: __props.disabled,
-              class: "flex items-center gap-1 pr-2 border-r border-gray-200 dark:border-slate-600 hover:bg-gray-50 dark:hover:bg-slate-600 -ml-1 pl-1 py-1 rounded-l transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
-              onClick: _cache[0] || (_cache[0] = vue.withModifiers(($event) => showDropdown.value = !showDropdown.value, ["stop"]))
-            }, [
-              vue.createElementVNode("span", _hoisted_2$4, vue.toDisplayString(selectedCountry.value.flag), 1),
-              vue.createVNode(vue.unref(vue$1.Icon), {
-                icon: "lucide:chevron-down",
-                class: vue.normalizeClass([
-                  "size-3 text-gray-400 transition-transform",
-                  showDropdown.value && "rotate-180"
-                ])
-              }, null, 8, ["class"])
-            ], 8, _hoisted_1$7)
-          ]),
-          default: vue.withCtx(({ inputClass }) => [
-            vue.createElementVNode("input", vue.mergeProps({
-              id: __props.id ?? __props.name,
-              value: displayValue.value,
-              type: "tel",
-              name: __props.name,
-              placeholder: __props.placeholder,
-              disabled: __props.disabled,
-              required: __props.required,
-              "aria-required": __props.required || void 0,
-              "aria-describedby": __props.describedBy,
-              class: [inputClass, "pl-20"]
-            }, _ctx.$attrs, {
-              onInput: handleInput,
-              onPaste: handlePaste
-            }), null, 16, _hoisted_3$3)
-          ]),
-          actions: vue.withCtx(() => [
-            vue.createElementVNode("span", _hoisted_4$1, vue.toDisplayString(selectedCountry.value.dialCode), 1)
-          ]),
-          _: 1
-        }, 8, ["size", "disabled"]),
-        vue.createVNode(vue.Transition, {
-          "enter-active-class": "transition-all duration-200 ease-out",
-          "enter-from-class": "opacity-0 -translate-y-2",
-          "enter-to-class": "opacity-100 translate-y-0",
-          "leave-active-class": "transition-all duration-150 ease-in",
-          "leave-from-class": "opacity-100 translate-y-0",
-          "leave-to-class": "opacity-0 -translate-y-2"
-        }, {
-          default: vue.withCtx(() => [
-            showDropdown.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
-              vue.createElementVNode("div", _hoisted_6, [
-                vue.withDirectives(vue.createElementVNode("input", {
-                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => searchQuery.value = $event),
-                  type: "text",
-                  placeholder: "Search countries...",
-                  class: "w-full px-3 py-2 text-sm border border-gray-200 dark:border-slate-600 rounded-lg bg-gray-50 dark:bg-slate-700 text-gray-900 dark:text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500"
-                }, null, 512), [
-                  [vue.vModelText, searchQuery.value]
-                ])
-              ]),
-              vue.createElementVNode("ul", _hoisted_7, [
-                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(filteredCountries.value, (country) => {
-                  return vue.openBlock(), vue.createElementBlock("li", {
-                    key: country.code,
-                    class: vue.normalizeClass(["flex items-center gap-3 px-3 py-2 cursor-pointer hover:bg-gray-50 dark:hover:bg-slate-700 transition-colors", selectedCountry.value.code === country.code && "bg-primary-50 dark:bg-primary-900/20"]),
-                    onClick: ($event) => selectCountry(country)
-                  }, [
-                    vue.createElementVNode("span", _hoisted_9, vue.toDisplayString(country.flag), 1),
-                    vue.createElementVNode("span", _hoisted_10, vue.toDisplayString(country.name), 1),
-                    vue.createElementVNode("span", _hoisted_11, vue.toDisplayString(country.dialCode), 1)
-                  ], 10, _hoisted_8);
-                }), 128)),
-                filteredCountries.value.length === 0 ? (vue.openBlock(), vue.createElementBlock("li", _hoisted_12, " No countries found ")) : vue.createCommentVNode("", true)
-              ])
-            ])) : vue.createCommentVNode("", true)
-          ]),
-          _: 1
-        })
-      ], 512);
-    };
-  }
-});
-const _hoisted_1$6 = ["disabled"];
-const _hoisted_2$3 = ["id", "value", "name", "placeholder", "disabled", "required", "min", "max", "step", "aria-required", "aria-describedby"];
-const _hoisted_3$2 = ["disabled"];
-const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "NumberInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    placeholder: { default: "0" },
-    size: { default: "md" },
-    disabled: { type: Boolean },
-    min: {},
-    max: {},
-    step: { default: 1 },
-    name: {},
-    id: {},
-    required: { type: Boolean },
-    describedBy: {},
-    showStepper: { type: Boolean, default: true }
-  }, {
-    "modelValue": { default: null },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const canDecrement = vue.computed(() => {
-      if (props.disabled) return false;
-      if (modelValue.value === null) return true;
-      if (props.min !== void 0) return modelValue.value > props.min;
-      return true;
-    });
-    const canIncrement = vue.computed(() => {
-      if (props.disabled) return false;
-      if (modelValue.value === null) return true;
-      if (props.max !== void 0) return modelValue.value < props.max;
-      return true;
-    });
-    function increment() {
-      if (!canIncrement.value) return;
-      const current = modelValue.value ?? 0;
-      const newValue = current + props.step;
-      modelValue.value = props.max !== void 0 ? Math.min(newValue, props.max) : newValue;
-    }
-    function decrement() {
-      if (!canDecrement.value) return;
-      const current = modelValue.value ?? 0;
-      const newValue = current - props.step;
-      modelValue.value = props.min !== void 0 ? Math.max(newValue, props.min) : newValue;
-    }
-    function handleInput(event) {
-      const target = event.target;
-      const value = target.value === "" ? null : parseFloat(target.value);
-      if (value !== null && !isNaN(value)) {
-        let clampedValue = value;
-        if (props.min !== void 0) clampedValue = Math.max(clampedValue, props.min);
-        if (props.max !== void 0) clampedValue = Math.min(clampedValue, props.max);
-        modelValue.value = clampedValue;
-      } else {
-        modelValue.value = null;
-      }
-    }
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(_sfc_main$p, {
-        size: __props.size,
-        disabled: __props.disabled
-      }, vue.createSlots({
-        default: vue.withCtx(({ inputClass }) => [
-          vue.createElementVNode("input", vue.mergeProps({
-            id: __props.id ?? __props.name,
-            value: modelValue.value,
-            type: "number",
-            name: __props.name,
-            placeholder: __props.placeholder,
-            disabled: __props.disabled,
-            required: __props.required,
-            min: __props.min,
-            max: __props.max,
-            step: __props.step,
-            "aria-required": __props.required || void 0,
-            "aria-describedby": __props.describedBy,
-            class: [inputClass, "text-center", __props.showStepper && "pl-12 pr-12"]
-          }, _ctx.$attrs, { onInput: handleInput }), null, 16, _hoisted_2$3)
-        ]),
-        _: 2
-      }, [
-        __props.showStepper ? {
-          name: "icon",
-          fn: vue.withCtx(() => [
-            vue.createElementVNode("button", {
-              type: "button",
-              disabled: !canDecrement.value,
-              class: "p-1 rounded hover:bg-gray-100 dark:hover:bg-slate-600 transition-colors disabled:opacity-30 disabled:cursor-not-allowed",
-              onClick: decrement
-            }, [
-              vue.createVNode(vue.unref(vue$1.Icon), {
-                icon: "lucide:minus",
-                class: "size-4 text-gray-500"
-              })
-            ], 8, _hoisted_1$6)
-          ]),
-          key: "0"
-        } : void 0,
-        __props.showStepper ? {
-          name: "actions",
-          fn: vue.withCtx(() => [
-            vue.createElementVNode("button", {
-              type: "button",
-              disabled: !canIncrement.value,
-              class: "p-1 rounded hover:bg-gray-100 dark:hover:bg-slate-600 transition-colors disabled:opacity-30 disabled:cursor-not-allowed",
-              onClick: increment
-            }, [
-              vue.createVNode(vue.unref(vue$1.Icon), {
-                icon: "lucide:plus",
-                class: "size-4 text-gray-500"
-              })
-            ], 8, _hoisted_3$2)
-          ]),
-          key: "1"
-        } : void 0
-      ]), 1032, ["size", "disabled"]);
-    };
-  }
-});
-const _hoisted_1$5 = { class: "text-sm font-medium text-gray-500 dark:text-gray-400" };
-const _hoisted_2$2 = ["id", "value", "name", "placeholder", "disabled", "required", "aria-required", "aria-describedby"];
-const _hoisted_3$1 = { class: "text-sm font-medium text-gray-500 dark:text-gray-400" };
-const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "MoneyInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    placeholder: { default: "0.00" },
-    size: { default: "md" },
-    disabled: { type: Boolean },
-    currency: { default: "EUR" },
-    min: {},
-    max: {},
-    decimals: { default: 2 },
-    name: {},
-    id: {},
-    required: { type: Boolean },
-    describedBy: {}
-  }, {
-    "modelValue": { default: null },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const currencyConfig = {
-      EUR: { symbol: "€", locale: "fr-FR", position: "suffix" },
-      USD: { symbol: "$", locale: "en-US", position: "prefix" },
-      GBP: { symbol: "£", locale: "en-GB", position: "prefix" },
-      XOF: { symbol: "CFA", locale: "fr-FR", position: "suffix" },
-      MAD: { symbol: "DH", locale: "fr-MA", position: "suffix" },
-      CHF: { symbol: "CHF", locale: "fr-CH", position: "suffix" },
-      CAD: { symbol: "CA$", locale: "en-CA", position: "prefix" }
-    };
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const config = vue.computed(() => currencyConfig[props.currency]);
-    const displayValue = vue.ref("");
-    function formatForDisplay(value) {
-      if (value === null) return "";
-      return value.toLocaleString(config.value.locale, {
-        minimumFractionDigits: props.decimals,
-        maximumFractionDigits: props.decimals
-      });
-    }
-    function parseDisplayValue(value) {
-      if (!value) return null;
-      const cleaned = value.replace(/\s/g, "").replace(/,/g, ".");
-      const parsed = parseFloat(cleaned);
-      return isNaN(parsed) ? null : parsed;
-    }
-    vue.watch(
-      () => modelValue.value,
-      (newValue) => {
-        displayValue.value = formatForDisplay(newValue);
-      },
-      { immediate: true }
-    );
-    function handleInput(event) {
-      const target = event.target;
-      displayValue.value = target.value;
-    }
-    function handleBlur() {
-      const parsed = parseDisplayValue(displayValue.value);
-      if (parsed !== null) {
-        let clampedValue = parsed;
-        if (props.min !== void 0) clampedValue = Math.max(clampedValue, props.min);
-        if (props.max !== void 0) clampedValue = Math.min(clampedValue, props.max);
-        modelValue.value = clampedValue;
-        displayValue.value = formatForDisplay(clampedValue);
-      } else {
-        modelValue.value = null;
-        displayValue.value = "";
-      }
-    }
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(_sfc_main$p, {
-        size: __props.size,
-        disabled: __props.disabled
-      }, vue.createSlots({
-        default: vue.withCtx(({ inputClass }) => [
-          vue.createElementVNode("input", vue.mergeProps({
-            id: __props.id ?? __props.name,
-            value: displayValue.value,
-            type: "text",
-            inputmode: "decimal",
-            name: __props.name,
-            placeholder: __props.placeholder,
-            disabled: __props.disabled,
-            required: __props.required,
-            "aria-required": __props.required || void 0,
-            "aria-describedby": __props.describedBy,
-            class: [inputClass, "text-right"]
-          }, _ctx.$attrs, {
-            onInput: handleInput,
-            onBlur: handleBlur
-          }), null, 16, _hoisted_2$2)
-        ]),
-        _: 2
-      }, [
-        config.value.position === "prefix" ? {
-          name: "icon",
-          fn: vue.withCtx(() => [
-            vue.createElementVNode("span", _hoisted_1$5, vue.toDisplayString(config.value.symbol), 1)
-          ]),
-          key: "0"
-        } : void 0,
-        config.value.position === "suffix" ? {
-          name: "actions",
-          fn: vue.withCtx(() => [
-            vue.createElementVNode("span", _hoisted_3$1, vue.toDisplayString(config.value.symbol), 1)
-          ]),
-          key: "1"
-        } : void 0
-      ]), 1032, ["size", "disabled"]);
-    };
-  }
-});
-const _hoisted_1$4 = ["id", "value", "name", "placeholder", "disabled", "required", "min", "max", "step", "aria-required", "aria-describedby"];
-const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "PercentInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    placeholder: { default: "0" },
-    size: { default: "md" },
-    disabled: { type: Boolean },
-    min: { default: 0 },
-    max: { default: 100 },
-    decimals: { default: 0 },
-    name: {},
-    id: {},
-    required: { type: Boolean },
-    describedBy: {}
-  }, {
-    "modelValue": { default: null },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const displayValue = vue.computed({
-      get: () => modelValue.value !== null ? modelValue.value.toString() : "",
-      set: (val) => {
-        if (val === "") {
-          modelValue.value = null;
-          return;
-        }
-        const parsed = parseFloat(val);
-        if (!isNaN(parsed)) {
-          let clamped = parsed;
-          if (props.min !== void 0) clamped = Math.max(clamped, props.min);
-          if (props.max !== void 0) clamped = Math.min(clamped, props.max);
-          modelValue.value = clamped;
-        }
-      }
-    });
-    function handleInput(event) {
-      const target = event.target;
-      displayValue.value = target.value;
-    }
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(_sfc_main$p, {
-        size: __props.size,
-        disabled: __props.disabled
-      }, {
-        default: vue.withCtx(({ inputClass }) => [
-          vue.createElementVNode("input", vue.mergeProps({
-            id: __props.id ?? __props.name,
-            value: displayValue.value,
-            type: "number",
-            inputmode: "decimal",
-            name: __props.name,
-            placeholder: __props.placeholder,
-            disabled: __props.disabled,
-            required: __props.required,
-            min: __props.min,
-            max: __props.max,
-            step: __props.decimals > 0 ? Math.pow(10, -__props.decimals) : 1,
-            "aria-required": __props.required || void 0,
-            "aria-describedby": __props.describedBy,
-            class: [inputClass, "text-right pr-10"]
-          }, _ctx.$attrs, { onInput: handleInput }), null, 16, _hoisted_1$4)
-        ]),
-        actions: vue.withCtx(() => [..._cache[0] || (_cache[0] = [
-          vue.createElementVNode("span", { class: "text-sm font-medium text-gray-500 dark:text-gray-400" }, "%", -1)
-        ])]),
-        _: 1
-      }, 8, ["size", "disabled"]);
-    };
-  }
-});
-const _hoisted_1$3 = { class: "inline-flex items-center gap-2 bg-gray-50 dark:bg-slate-700 rounded-xl p-1 border border-gray-200 dark:border-slate-600" };
-const _hoisted_2$1 = ["disabled"];
-const _hoisted_3 = ["id", "value", "name", "disabled", "required", "min", "max"];
-const _hoisted_4 = ["disabled"];
-const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "QuantityInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    size: { default: "md" },
-    disabled: { type: Boolean },
-    min: { default: 1 },
-    max: {},
-    step: { default: 1 },
-    name: {},
-    id: {},
-    required: { type: Boolean }
-  }, {
-    "modelValue": { default: 1 },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const canDecrement = vue.computed(() => {
-      if (props.disabled) return false;
-      if (props.min !== void 0) return modelValue.value > props.min;
-      return true;
-    });
-    const canIncrement = vue.computed(() => {
-      if (props.disabled) return false;
-      if (props.max !== void 0) return modelValue.value < props.max;
-      return true;
-    });
-    function increment() {
-      if (!canIncrement.value) return;
-      const newValue = modelValue.value + props.step;
-      modelValue.value = props.max !== void 0 ? Math.min(newValue, props.max) : newValue;
-    }
-    function decrement() {
-      if (!canDecrement.value) return;
-      const newValue = modelValue.value - props.step;
-      modelValue.value = props.min !== void 0 ? Math.max(newValue, props.min) : newValue;
-    }
-    function handleInput(event) {
-      const target = event.target;
-      const value = parseInt(target.value, 10);
-      if (!isNaN(value)) {
-        let clampedValue = value;
-        if (props.min !== void 0) clampedValue = Math.max(clampedValue, props.min);
-        if (props.max !== void 0) clampedValue = Math.min(clampedValue, props.max);
-        modelValue.value = clampedValue;
-      }
-    }
-    const sizeClasses = vue.computed(() => ({
-      button: {
-        sm: "size-7",
-        md: "size-9",
-        lg: "size-11"
-      }[props.size],
-      icon: {
-        sm: "size-3",
-        md: "size-4",
-        lg: "size-5"
-      }[props.size],
-      input: {
-        sm: "text-sm w-10",
-        md: "text-base w-12",
-        lg: "text-lg w-14"
-      }[props.size]
-    }));
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$3, [
-        vue.createElementVNode("button", {
-          type: "button",
-          disabled: !canDecrement.value,
-          class: vue.normalizeClass([
-            "flex items-center justify-center rounded-lg bg-white dark:bg-slate-600 border border-gray-200 dark:border-slate-500 transition-all",
-            "hover:bg-gray-50 dark:hover:bg-slate-500 hover:border-gray-300 dark:hover:border-slate-400",
-            "disabled:opacity-40 disabled:cursor-not-allowed disabled:hover:bg-white dark:disabled:hover:bg-slate-600",
-            "shadow-sm",
-            sizeClasses.value.button
-          ]),
-          onClick: decrement
-        }, [
-          vue.createVNode(vue.unref(vue$1.Icon), {
-            icon: "lucide:minus",
-            class: vue.normalizeClass(["text-gray-600 dark:text-gray-300", sizeClasses.value.icon])
-          }, null, 8, ["class"])
-        ], 10, _hoisted_2$1),
-        vue.createElementVNode("input", vue.mergeProps({
-          id: __props.id ?? __props.name,
-          value: modelValue.value,
-          type: "number",
-          name: __props.name,
-          disabled: __props.disabled,
-          required: __props.required,
-          min: __props.min,
-          max: __props.max,
-          class: [
-            "bg-transparent text-center font-semibold text-gray-900 dark:text-white",
-            "focus:outline-none appearance-none",
-            "[&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
-            "disabled:opacity-50",
-            sizeClasses.value.input
-          ]
-        }, _ctx.$attrs, { onInput: handleInput }), null, 16, _hoisted_3),
-        vue.createElementVNode("button", {
-          type: "button",
-          disabled: !canIncrement.value,
-          class: vue.normalizeClass([
-            "flex items-center justify-center rounded-lg bg-white dark:bg-slate-600 border border-gray-200 dark:border-slate-500 transition-all",
-            "hover:bg-gray-50 dark:hover:bg-slate-500 hover:border-gray-300 dark:hover:border-slate-400",
-            "disabled:opacity-40 disabled:cursor-not-allowed disabled:hover:bg-white dark:disabled:hover:bg-slate-600",
-            "shadow-sm",
-            sizeClasses.value.button
-          ]),
-          onClick: increment
-        }, [
-          vue.createVNode(vue.unref(vue$1.Icon), {
-            icon: "lucide:plus",
-            class: vue.normalizeClass(["text-gray-600 dark:text-gray-300", sizeClasses.value.icon])
-          }, null, 8, ["class"])
-        ], 10, _hoisted_4)
-      ]);
-    };
-  }
-});
-const _hoisted_1$2 = ["id", "name", "placeholder", "disabled", "required", "aria-invalid", "aria-required", "aria-describedby"];
-const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "URLInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    placeholder: { default: "https://example.com" },
-    size: { default: "md" },
-    disabled: { type: Boolean },
-    showValidation: { type: Boolean, default: true },
-    name: {},
-    id: {},
-    required: { type: Boolean },
-    describedBy: {}
-  }, {
-    "modelValue": { default: "" },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const urlRegex = /^(https?:\/\/)?([\da-z.-]+)\.([a-z.]{2,6})([/\w .-]*)*\/?$/;
-    const isValid = vue.computed(() => {
-      if (!modelValue.value) return null;
-      return urlRegex.test(modelValue.value);
-    });
-    const isTouched = vue.ref(false);
-    const showStatus = vue.computed(() => {
-      return props.showValidation && isTouched.value && !!modelValue.value;
-    });
-    function handleBlur() {
-      isTouched.value = true;
-    }
-    function openUrl() {
-      if (isValid.value && modelValue.value) {
-        const url = modelValue.value.startsWith("http") ? modelValue.value : `https://${modelValue.value}`;
-        window.open(url, "_blank");
-      }
-    }
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(_sfc_main$p, {
-        icon: "lucide:link",
-        size: __props.size,
-        disabled: __props.disabled,
-        invalid: showStatus.value && isValid.value === false
-      }, {
-        default: vue.withCtx(({ inputClass }) => [
-          vue.withDirectives(vue.createElementVNode("input", vue.mergeProps({
-            id: __props.id ?? __props.name,
-            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
-            type: "url",
-            name: __props.name,
-            placeholder: __props.placeholder,
-            disabled: __props.disabled,
-            required: __props.required,
-            "aria-invalid": showStatus.value && isValid.value === false || void 0,
-            "aria-required": __props.required || void 0,
-            "aria-describedby": __props.describedBy,
-            class: inputClass
-          }, _ctx.$attrs, { onBlur: handleBlur }), null, 16, _hoisted_1$2), [
-            [vue.vModelText, modelValue.value]
-          ])
-        ]),
-        actions: vue.withCtx(() => [
-          showStatus.value && isValid.value && modelValue.value ? (vue.openBlock(), vue.createElementBlock("button", {
-            key: 0,
-            type: "button",
-            class: "p-1 rounded hover:bg-gray-100 dark:hover:bg-slate-600 transition-colors",
-            title: "Open URL",
-            onClick: openUrl
-          }, [
-            vue.createVNode(vue.unref(vue$1.Icon), {
-              icon: "lucide:external-link",
-              class: "size-4 text-gray-400 hover:text-primary-500"
-            })
-          ])) : showStatus.value && isValid.value === false ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
-            key: 1,
-            icon: "lucide:alert-circle",
-            class: "size-5 text-red-500"
-          })) : vue.createCommentVNode("", true)
-        ]),
-        _: 1
-      }, 8, ["size", "disabled", "invalid"]);
-    };
-  }
-});
-const _hoisted_1$1 = ["value", "type", "name", "disabled", "onInput", "onKeydown"];
-const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "OTPInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    length: { default: 6 },
-    size: { default: "md" },
-    disabled: { type: Boolean },
-    autoFocus: { type: Boolean, default: true },
-    name: {},
-    masked: { type: Boolean, default: false }
-  }, {
-    "modelValue": { default: "" },
-    "modelModifiers": {}
-  }),
-  emits: /* @__PURE__ */ vue.mergeModels(["complete"], ["update:modelValue"]),
-  setup(__props, { expose: __expose, emit: __emit }) {
-    const props = __props;
-    const emit = __emit;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const inputRefs = vue.ref([]);
-    const digits = vue.computed(() => {
-      const arr = modelValue.value.split("");
-      while (arr.length < props.length) {
-        arr.push("");
-      }
-      return arr.slice(0, props.length);
-    });
-    const sizeClasses = vue.computed(() => ({
-      input: {
-        sm: "size-10 text-lg",
-        md: "size-12 text-xl",
-        lg: "size-14 text-2xl"
-      }[props.size],
-      gap: {
-        sm: "gap-2",
-        md: "gap-3",
-        lg: "gap-4"
-      }[props.size]
-    }));
-    function updateValue(index2, value) {
-      const newDigits = [...digits.value];
-      newDigits[index2] = value.slice(-1);
-      modelValue.value = newDigits.join("");
-      if (modelValue.value.length === props.length && !modelValue.value.includes("")) {
-        emit("complete", modelValue.value);
-      }
-    }
-    function handleInput(event, index2) {
-      const target = event.target;
-      const value = target.value.replace(/\D/g, "");
-      if (value) {
-        updateValue(index2, value);
-        if (index2 < props.length - 1) {
-          vue.nextTick(() => {
-            var _a;
-            (_a = inputRefs.value[index2 + 1]) == null ? void 0 : _a.focus();
-          });
-        }
-      }
-    }
-    function handleKeydown(event, index2) {
-      var _a, _b, _c;
-      const target = event.target;
-      if (event.key === "Backspace") {
-        if (!target.value && index2 > 0) {
-          (_a = inputRefs.value[index2 - 1]) == null ? void 0 : _a.focus();
-        }
-        updateValue(index2, "");
-      } else if (event.key === "ArrowLeft" && index2 > 0) {
-        (_b = inputRefs.value[index2 - 1]) == null ? void 0 : _b.focus();
-      } else if (event.key === "ArrowRight" && index2 < props.length - 1) {
-        (_c = inputRefs.value[index2 + 1]) == null ? void 0 : _c.focus();
-      }
-    }
-    function handlePaste(event) {
-      var _a;
-      event.preventDefault();
-      const pastedData = (_a = event.clipboardData) == null ? void 0 : _a.getData("text").replace(/\D/g, "").slice(0, props.length);
-      if (pastedData) {
-        modelValue.value = pastedData;
-        const focusIndex = Math.min(pastedData.length, props.length - 1);
-        vue.nextTick(() => {
-          var _a2;
-          (_a2 = inputRefs.value[focusIndex]) == null ? void 0 : _a2.focus();
-        });
-      }
-    }
-    function handleFocus(event) {
-      const target = event.target;
-      target.select();
-    }
-    vue.watch(
-      () => modelValue.value,
-      (newValue) => {
-        if (newValue.length === props.length) {
-          emit("complete", newValue);
-        }
-      }
-    );
-    vue.onMounted(() => {
-      var _a;
-      if (props.autoFocus) {
-        (_a = inputRefs.value[0]) == null ? void 0 : _a.focus();
-      }
-    });
-    function setInputRef(el, index2) {
-      if (el) {
-        inputRefs.value[index2] = el;
-      }
-    }
-    __expose({ focus: () => {
-      var _a;
-      return (_a = inputRefs.value[0]) == null ? void 0 : _a.focus();
-    } });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", {
-        class: vue.normalizeClass(["inline-flex", sizeClasses.value.gap])
-      }, [
-        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(digits.value, (digit, index2) => {
-          return vue.openBlock(), vue.createElementBlock("input", {
-            key: index2,
-            ref_for: true,
-            ref: (el) => setInputRef(el, index2),
-            value: digit,
-            type: __props.masked ? "password" : "text",
-            inputmode: "numeric",
-            name: __props.name ? `${__props.name}-${index2}` : void 0,
-            disabled: __props.disabled,
-            maxlength: "1",
-            autocomplete: "one-time-code",
-            class: vue.normalizeClass([
-              "text-center font-semibold rounded-xl border-2 transition-all",
-              "bg-gray-50 dark:bg-slate-700 text-gray-900 dark:text-white",
-              "border-gray-200 dark:border-slate-600",
-              "focus:border-primary-500 focus:ring-2 focus:ring-primary-500 focus:ring-offset-2 focus:outline-none",
-              "disabled:opacity-50 disabled:cursor-not-allowed",
-              digit ? "border-primary-300 dark:border-primary-500/50" : "",
-              sizeClasses.value.input
-            ]),
-            onInput: ($event) => handleInput($event, index2),
-            onKeydown: ($event) => handleKeydown($event, index2),
-            onPaste: handlePaste,
-            onFocus: handleFocus
-          }, null, 42, _hoisted_1$1);
-        }), 128))
-      ], 2);
-    };
-  }
-});
-const _hoisted_1 = ["onClick"];
-const _hoisted_2 = ["id", "name", "placeholder", "disabled", "required"];
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-  ...{
-    inheritAttrs: false
-  },
-  __name: "TagsInput",
-  props: /* @__PURE__ */ vue.mergeModels({
-    placeholder: { default: "Add tag..." },
-    size: { default: "md" },
-    disabled: { type: Boolean },
-    max: {},
-    allowDuplicates: { type: Boolean, default: false },
-    name: {},
-    id: {},
-    required: { type: Boolean }
-  }, {
-    "modelValue": { default: () => [] },
-    "modelModifiers": {}
-  }),
-  emits: ["update:modelValue"],
-  setup(__props, { expose: __expose }) {
-    const props = __props;
-    const modelValue = vue.useModel(__props, "modelValue");
-    const inputValue = vue.ref("");
-    const inputRef = vue.ref(null);
-    const canAddMore = vue.computed(() => {
-      if (props.max !== void 0) return modelValue.value.length < props.max;
-      return true;
-    });
-    const sizeClasses = vue.computed(() => ({
-      wrapper: {
-        sm: "min-h-9 py-1.5 px-2 gap-1",
-        md: "min-h-11 py-2 px-3 gap-1.5",
-        lg: "min-h-13 py-2.5 px-4 gap-2"
-      }[props.size],
-      tag: {
-        sm: "text-xs px-2 py-0.5",
-        md: "text-sm px-2.5 py-1",
-        lg: "text-base px-3 py-1.5"
-      }[props.size],
-      input: {
-        sm: "text-xs",
-        md: "text-sm",
-        lg: "text-base"
-      }[props.size],
-      icon: {
-        sm: "size-3",
-        md: "size-3.5",
-        lg: "size-4"
-      }[props.size]
-    }));
-    function addTag(value) {
-      const trimmed = value.trim();
-      if (!trimmed) return;
-      if (!canAddMore.value) return;
-      if (!props.allowDuplicates && modelValue.value.includes(trimmed)) return;
-      modelValue.value = [...modelValue.value, trimmed];
-      inputValue.value = "";
-    }
-    function removeTag(index2) {
-      if (props.disabled) return;
-      modelValue.value = modelValue.value.filter((_, i) => i !== index2);
-    }
-    function handleKeydown(event) {
-      if (event.key === "Enter" || event.key === ",") {
-        event.preventDefault();
-        addTag(inputValue.value);
-      } else if (event.key === "Backspace" && !inputValue.value && modelValue.value.length > 0) {
-        removeTag(modelValue.value.length - 1);
-      }
-    }
-    function handleBlur() {
-      if (inputValue.value) {
-        addTag(inputValue.value);
-      }
-    }
-    function focusInput() {
-      var _a;
-      (_a = inputRef.value) == null ? void 0 : _a.focus();
-    }
-    __expose({ focus: focusInput });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", {
-        class: vue.normalizeClass([
-          "flex flex-wrap items-center rounded-xl border transition-all cursor-text",
-          "bg-gray-50 dark:bg-slate-700",
-          "border-gray-200 dark:border-slate-600",
-          "focus-within:border-primary-500 focus-within:ring-2 focus-within:ring-primary-500 focus-within:bg-white dark:focus-within:bg-slate-600",
-          __props.disabled && "opacity-50 cursor-not-allowed",
-          sizeClasses.value.wrapper
-        ]),
-        onClick: focusInput
-      }, [
-        vue.createVNode(vue.TransitionGroup, {
-          name: "tag",
-          tag: "div",
-          class: "flex flex-wrap gap-1.5"
-        }, {
-          default: vue.withCtx(() => [
-            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(modelValue.value, (tag, index2) => {
-              return vue.openBlock(), vue.createElementBlock("span", {
-                key: tag + index2,
-                class: vue.normalizeClass([
-                  "inline-flex items-center gap-1 rounded-lg font-medium",
-                  "bg-primary-100 dark:bg-primary-900/30 text-primary-700 dark:text-primary-300",
-                  sizeClasses.value.tag
-                ])
-              }, [
-                vue.createTextVNode(vue.toDisplayString(tag) + " ", 1),
-                !__props.disabled ? (vue.openBlock(), vue.createElementBlock("button", {
-                  key: 0,
-                  type: "button",
-                  class: "rounded-full hover:bg-primary-200 dark:hover:bg-primary-800/50 transition-colors p-0.5",
-                  onClick: vue.withModifiers(($event) => removeTag(index2), ["stop"])
-                }, [
-                  vue.createVNode(vue.unref(vue$1.Icon), {
-                    icon: "lucide:x",
-                    class: vue.normalizeClass(["text-primary-500", sizeClasses.value.icon])
-                  }, null, 8, ["class"])
-                ], 8, _hoisted_1)) : vue.createCommentVNode("", true)
-              ], 2);
-            }), 128))
-          ]),
-          _: 1
-        }),
-        canAddMore.value ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", vue.mergeProps({
-          key: 0,
-          id: __props.id ?? __props.name,
-          ref_key: "inputRef",
-          ref: inputRef,
-          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inputValue.value = $event),
-          type: "text",
-          name: __props.name,
-          placeholder: modelValue.value.length === 0 ? __props.placeholder : "",
-          disabled: __props.disabled,
-          required: __props.required && modelValue.value.length === 0,
-          class: [
-            "flex-1 min-w-20 bg-transparent border-none focus:outline-none",
-            "text-gray-900 dark:text-white placeholder-gray-400",
-            sizeClasses.value.input
-          ]
-        }, _ctx.$attrs, {
-          onKeydown: handleKeydown,
-          onBlur: handleBlur
-        }), null, 16, _hoisted_2)), [
-          [vue.vModelText, inputValue.value]
-        ]) : vue.createCommentVNode("", true)
-      ], 2);
-    };
-  }
-});
-const TagsInput = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-fcace07c"]]);
-exports.Slider = Slider;
-exports.TagsInput = TagsInput;
-exports._sfc_main = _sfc_main$r;
-exports._sfc_main$1 = _sfc_main$q;
-exports._sfc_main$10 = _sfc_main$f;
-exports._sfc_main$11 = _sfc_main$e;
-exports._sfc_main$12 = _sfc_main$d;
-exports._sfc_main$13 = _sfc_main$c;
-exports._sfc_main$14 = _sfc_main$b;
-exports._sfc_main$15 = _sfc_main$a;
-exports._sfc_main$16 = _sfc_main$p;
-exports._sfc_main$17 = _sfc_main$9;
-exports._sfc_main$18 = _sfc_main$8;
-exports._sfc_main$19 = _sfc_main$7;
-exports._sfc_main$2 = _sfc_main$o;
-exports._sfc_main$20 = _sfc_main$6;
-exports._sfc_main$21 = _sfc_main$5;
-exports._sfc_main$22 = _sfc_main$4;
-exports._sfc_main$23 = _sfc_main$3;
-exports._sfc_main$24 = _sfc_main$2;
-exports._sfc_main$25 = _sfc_main$1;
-exports._sfc_main$3 = _sfc_main$n;
-exports._sfc_main$4 = _sfc_main$m;
-exports._sfc_main$5 = _sfc_main$l;
-exports._sfc_main$6 = _sfc_main$k;
-exports._sfc_main$7 = _sfc_main$i;
-exports._sfc_main$8 = _sfc_main$h;
-exports._sfc_main$9 = _sfc_main$g;
-//# sourceMappingURL=TagsInput-BF3zRMcU.cjs.map