cisse-vue-ui 0.5.30 → 0.5.32

package/dist/{Combobox.vue_vue_type_script_setup_true_lang-C2z3wwmX.cjs → IconPicker.vue_vue_type_script_setup_true_lang-agY_E72J.cjs}

@@ -4,9 +4,9 @@ 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-CUNU12xk.cjs");
-const _hoisted_1$d = ["data-error", "for"];
-const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
+const index = require("./index-D1x3TH9k.cjs");
+const _hoisted_1$e = ["data-error", "for"];
+const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
   __name: "FormLabel",
   props: {
     error: { type: [String, Boolean] },
@@ -20,12 +20,12 @@ const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
         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$d);
+      ], 8, _hoisted_1$e);
     };
   }
 });
-const _hoisted_1$c = ["id", "data-error", "role", "aria-live"];
-const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$d = ["id", "data-error", "role", "aria-live"];
+const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
   __name: "FormHelp",
   props: {
     id: {},
@@ -44,12 +44,12 @@ const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
         vue.renderSlot(_ctx.$slots, "default", {}, () => [
           vue.createTextVNode(vue.toDisplayString(__props.text ?? ""), 1)
         ])
-      ], 8, _hoisted_1$c);
+      ], 8, _hoisted_1$d);
     };
   }
 });
-const _hoisted_1$b = ["id", "disabled", "name", "placeholder", "type", "required", "aria-invalid", "aria-required", "aria-describedby"];
-const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$c = ["id", "disabled", "name", "placeholder", "type", "required", "aria-invalid", "aria-required", "aria-describedby"];
+const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
   __name: "FormInput",
   props: /* @__PURE__ */ vue.mergeModels({
     type: { default: "text" },
@@ -82,35 +82,35 @@ const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
         "aria-required": props.required || void 0,
         "aria-describedby": props.describedBy || void 0,
         class: "mt-1 block w-full rounded-md border border-gray-300 bg-white px-3 py-2 text-sm text-gray-800 placeholder-gray-400 shadow-sm user-invalid:border-red-500 user-invalid:text-red-600 focus:border-primary focus:ring-1 focus:ring-primary focus:outline-hidden focus:user-invalid:border-red-500 focus:user-invalid:ring-red-500 disabled:border-gray-200 disabled:bg-gray-50 disabled:text-gray-500 disabled:shadow-none dark:border-gray-700 dark:bg-gray-900 dark:text-gray-200 dark:placeholder-gray-500 dark:focus:border-primary dark:focus:ring-primary dark:disabled:border-gray-800 dark:disabled:bg-gray-950 dark:disabled:text-gray-500"
-      }, _ctx.$attrs), null, 16, _hoisted_1$b)), [
+      }, _ctx.$attrs), null, 16, _hoisted_1$c)), [
         [vue.vModelDynamic, modelValue.value]
       ]);
     };
   }
 });
-const _hoisted_1$a = { class: "relative" };
-const _hoisted_2$9 = ["id", "disabled", "aria-expanded", "aria-controls", "aria-invalid", "aria-describedby"];
-const _hoisted_3$8 = { class: "flex-1 truncate" };
-const _hoisted_4$6 = ["id", "aria-label"];
-const _hoisted_5$5 = {
+const _hoisted_1$b = { class: "relative" };
+const _hoisted_2$a = ["id", "disabled", "aria-expanded", "aria-controls", "aria-invalid", "aria-describedby"];
+const _hoisted_3$9 = { class: "flex-1 truncate" };
+const _hoisted_4$7 = ["id", "aria-label"];
+const _hoisted_5$6 = {
   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$5 = { 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$5 = {
+const _hoisted_6$6 = { 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$6 = {
   key: 1,
   class: "px-4 py-3 text-sm text-gray-500 dark:text-gray-400",
   role: "status"
 };
-const _hoisted_8$4 = { class: "py-1" };
-const _hoisted_9$2 = ["aria-selected", "data-index", "onClick", "onMouseenter"];
-const _hoisted_10$2 = {
+const _hoisted_8$5 = { class: "py-1" };
+const _hoisted_9$3 = ["aria-selected", "data-index", "onClick", "onMouseenter"];
+const _hoisted_10$3 = {
   key: 1,
   class: "size-4 shrink-0",
   "aria-hidden": "true"
 };
-const _hoisted_11$2 = { class: "flex-1" };
-const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_11$3 = { class: "flex-1" };
+const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
   __name: "FormSelect",
   props: /* @__PURE__ */ vue.mergeModels({
     options: {},
@@ -228,7 +228,7 @@ const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
       return [base, state, text, props.triggerClass];
     });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [
         vue.createElementVNode("button", {
           id: triggerId.value,
           ref_key: "triggerRef",
@@ -248,14 +248,14 @@ const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
             option: selectedOption.value,
             placeholder: __props.placeholder
           }, () => [
-            vue.createElementVNode("span", _hoisted_3$8, vue.toDisplayString(displayValue.value), 1)
+            vue.createElementVNode("span", _hoisted_3$9, 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$9),
+        ], 42, _hoisted_2$a),
         (vue.openBlock(), vue.createBlock(vue.Teleport, {
           to: "body",
           disabled: !__props.teleport
@@ -282,8 +282,8 @@ const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
                   !__props.teleport && "absolute mt-1 w-full"
                 ])
               }, [
-                __props.searchable ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$5, [
-                  vue.createElementVNode("div", _hoisted_6$5, [
+                __props.searchable ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$6, [
+                  vue.createElementVNode("div", _hoisted_6$6, [
                     vue.createVNode(vue.unref(vue$1.Icon), {
                       icon: "lucide:search",
                       class: "size-4 text-gray-400",
@@ -303,8 +303,8 @@ const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
                     ])
                   ])
                 ])) : vue.createCommentVNode("", true),
-                filteredOptions.value.length === 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$5, vue.toDisplayString(__props.noResultsText), 1)) : vue.createCommentVNode("", true),
-                vue.createElementVNode("div", _hoisted_8$4, [
+                filteredOptions.value.length === 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$6, vue.toDisplayString(__props.noResultsText), 1)) : vue.createCommentVNode("", true),
+                vue.createElementVNode("div", _hoisted_8$5, [
                   (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(filteredOptions.value, (option, index2) => {
                     return vue.openBlock(), vue.createElementBlock("button", {
                       key: String(option.value),
@@ -331,13 +331,13 @@ const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
                           icon: "lucide:check",
                           class: "size-4 shrink-0 text-primary",
                           "aria-hidden": "true"
-                        })) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_10$2)),
-                        vue.createElementVNode("span", _hoisted_11$2, vue.toDisplayString(option.label), 1)
+                        })) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_10$3)),
+                        vue.createElementVNode("span", _hoisted_11$3, vue.toDisplayString(option.label), 1)
                       ])
-                    ], 42, _hoisted_9$2);
+                    ], 42, _hoisted_9$3);
                   }), 128))
                 ])
-              ], 14, _hoisted_4$6)) : vue.createCommentVNode("", true)
+              ], 14, _hoisted_4$7)) : vue.createCommentVNode("", true)
             ]),
             _: 3
           })
@@ -346,8 +346,8 @@ const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$9 = ["hidden"];
-const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$a = ["hidden"];
+const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
   __name: "FormGroup",
   props: /* @__PURE__ */ vue.mergeModels({
     label: {},
@@ -386,7 +386,7 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
       }, [
         vue.renderSlot(_ctx.$slots, "default", {}, () => [
           vue.renderSlot(_ctx.$slots, "label", {}, () => [
-            __props.label ? (vue.openBlock(), vue.createBlock(_sfc_main$d, {
+            __props.label ? (vue.openBlock(), vue.createBlock(_sfc_main$e, {
               key: 0,
               "html-for": inputId.value,
               error: __props.error
@@ -398,7 +398,7 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
             }, 8, ["html-for", "error"])) : vue.createCommentVNode("", true)
           ]),
           vue.renderSlot(_ctx.$slots, "input", {}, () => [
-            isSelect.value ? (vue.openBlock(), vue.createBlock(_sfc_main$a, vue.mergeProps({
+            isSelect.value ? (vue.openBlock(), vue.createBlock(_sfc_main$b, vue.mergeProps({
               key: 0,
               modelValue: modelValue.value,
               "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event)
@@ -406,7 +406,7 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
               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$b, vue.mergeProps({
+            }), null, 16, ["modelValue", "id", "invalid", "described-by"])) : (vue.openBlock(), vue.createBlock(_sfc_main$c, vue.mergeProps({
               key: 1,
               modelValue: modelValue.value,
               "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => modelValue.value = $event)
@@ -416,7 +416,7 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
               "described-by": hasError.value ? helpId.value : void 0
             }), null, 16, ["modelValue", "id", "invalid", "described-by"]))
           ]),
-          hasError.value ? (vue.openBlock(), vue.createBlock(_sfc_main$c, {
+          hasError.value ? (vue.openBlock(), vue.createBlock(_sfc_main$d, {
             key: 0,
             id: helpId.value,
             error: true
@@ -427,13 +427,13 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
             _: 1
           }, 8, ["id"])) : vue.createCommentVNode("", true)
         ])
-      ], 12, _hoisted_1$9);
+      ], 12, _hoisted_1$a);
     };
   }
 });
-const _hoisted_1$8 = { class: "relative" };
-const _hoisted_2$8 = ["disabled", "placeholder", "value"];
-const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$9 = { class: "relative" };
+const _hoisted_2$9 = ["disabled", "placeholder", "value"];
+const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
   __name: "SearchInput",
   props: {
     modelValue: {},
@@ -449,7 +449,7 @@ const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
       emit("update:modelValue", target.value);
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$8, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [
         vue.createVNode(vue.unref(vue$1.Icon), {
           icon: __props.icon,
           class: "absolute top-1/2 left-3 size-5 -translate-y-1/2 text-gray-400"
@@ -461,19 +461,19 @@ const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
           class: "focus:border-primary focus:ring-primary w-full rounded-lg border border-gray-300 bg-white py-2 pr-4 pl-10 text-gray-900 placeholder-gray-400 transition-colors disabled:cursor-not-allowed disabled:opacity-50 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-100 dark:placeholder-gray-500",
           type: "text",
           onInput: handleInput
-        }, null, 40, _hoisted_2$8)
+        }, null, 40, _hoisted_2$9)
       ]);
     };
   }
 });
-const _hoisted_1$7 = ["id", "aria-checked", "aria-labelledby", "aria-describedby", "disabled"];
-const _hoisted_2$7 = {
+const _hoisted_1$8 = ["id", "aria-checked", "aria-labelledby", "aria-describedby", "disabled"];
+const _hoisted_2$8 = {
   key: 0,
   class: "flex flex-col"
 };
-const _hoisted_3$7 = ["id"];
-const _hoisted_4$5 = ["id"];
-const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_3$8 = ["id"];
+const _hoisted_4$6 = ["id"];
+const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
   __name: "Switch",
   props: {
     modelValue: { type: Boolean, default: false },
@@ -537,35 +537,35 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
             ]),
             "aria-hidden": "true"
           }, null, 2)
-        ], 10, _hoisted_1$7),
-        __props.label || __props.description ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$7, [
+        ], 10, _hoisted_1$8),
+        __props.label || __props.description ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$8, [
           __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$7)) : vue.createCommentVNode("", true),
+          }, vue.toDisplayString(__props.label), 9, _hoisted_3$8)) : 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$5)) : vue.createCommentVNode("", true)
+          }, vue.toDisplayString(__props.description), 9, _hoisted_4$6)) : vue.createCommentVNode("", true)
         ])) : vue.createCommentVNode("", true)
       ], 2);
     };
   }
 });
-const _hoisted_1$6 = { class: "w-full" };
-const _hoisted_2$6 = {
+const _hoisted_1$7 = { class: "w-full" };
+const _hoisted_2$7 = {
   key: 0,
   class: "mb-2 flex justify-between text-sm"
 };
-const _hoisted_3$6 = { class: "text-gray-600 dark:text-gray-400" };
-const _hoisted_4$4 = { class: "font-medium text-gray-900 dark:text-white" };
-const _hoisted_5$4 = { class: "text-gray-600 dark:text-gray-400" };
-const _hoisted_6$4 = { class: "relative" };
-const _hoisted_7$4 = ["value", "min", "max", "step", "disabled"];
-const _hoisted_8$3 = { class: "pointer-events-none absolute inset-y-0 left-0 flex items-center" };
-const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_3$7 = { class: "text-gray-600 dark:text-gray-400" };
+const _hoisted_4$5 = { class: "font-medium text-gray-900 dark:text-white" };
+const _hoisted_5$5 = { class: "text-gray-600 dark:text-gray-400" };
+const _hoisted_6$5 = { class: "relative" };
+const _hoisted_7$5 = ["value", "min", "max", "step", "disabled"];
+const _hoisted_8$4 = { class: "pointer-events-none absolute inset-y-0 left-0 flex items-center" };
+const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
   __name: "Slider",
   props: /* @__PURE__ */ vue.mergeModels({
     min: { default: 0 },
@@ -596,13 +596,13 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
       modelValue.value = Number(target.value);
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [
-        __props.showValue ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$6, [
-          vue.createElementVNode("span", _hoisted_3$6, vue.toDisplayString(__props.min), 1),
-          vue.createElementVNode("span", _hoisted_4$4, vue.toDisplayString(displayValue.value), 1),
-          vue.createElementVNode("span", _hoisted_5$4, vue.toDisplayString(__props.max), 1)
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, [
+        __props.showValue ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$7, [
+          vue.createElementVNode("span", _hoisted_3$7, vue.toDisplayString(__props.min), 1),
+          vue.createElementVNode("span", _hoisted_4$5, vue.toDisplayString(displayValue.value), 1),
+          vue.createElementVNode("span", _hoisted_5$5, vue.toDisplayString(__props.max), 1)
         ])) : vue.createCommentVNode("", true),
-        vue.createElementVNode("div", _hoisted_6$4, [
+        vue.createElementVNode("div", _hoisted_6$5, [
           vue.createElementVNode("input", {
             type: "range",
             value: modelValue.value,
@@ -612,8 +612,8 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
             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$4),
-          vue.createElementVNode("div", _hoisted_8$3, [
+          }, null, 40, _hoisted_7$5),
+          vue.createElementVNode("div", _hoisted_8$4, [
             vue.createElementVNode("div", {
               class: "h-2 rounded-full bg-primary",
               style: vue.normalizeStyle({ width: `${percentage.value}%` })
@@ -624,27 +624,27 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Slider = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main$6, [["__scopeId", "data-v-c25e2c2a"]]);
-const _hoisted_1$5 = { class: "relative" };
-const _hoisted_2$5 = ["id", "disabled", "aria-expanded", "aria-controls"];
-const _hoisted_3$5 = { class: "flex-1 truncate" };
-const _hoisted_4$3 = { class: "flex items-center gap-1" };
-const _hoisted_5$3 = ["id", "aria-label"];
-const _hoisted_6$3 = { class: "mb-4 flex items-center justify-between" };
-const _hoisted_7$3 = {
+const Slider = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main$7, [["__scopeId", "data-v-c25e2c2a"]]);
+const _hoisted_1$6 = { class: "relative" };
+const _hoisted_2$6 = ["id", "disabled", "aria-expanded", "aria-controls"];
+const _hoisted_3$6 = { class: "flex-1 truncate" };
+const _hoisted_4$4 = { class: "flex items-center gap-1" };
+const _hoisted_5$4 = ["id", "aria-label"];
+const _hoisted_6$4 = { class: "mb-4 flex items-center justify-between" };
+const _hoisted_7$4 = {
   class: "font-medium text-gray-900 dark:text-white",
   "aria-live": "polite",
   "aria-atomic": "true"
 };
-const _hoisted_8$2 = {
+const _hoisted_8$3 = {
   class: "mb-2 grid grid-cols-7 gap-1",
   role: "row"
 };
-const _hoisted_9$1 = ["abbr"];
-const _hoisted_10$1 = ["id", "aria-label"];
-const _hoisted_11$1 = ["aria-label", "aria-selected", "aria-disabled", "disabled", "onClick"];
-const _hoisted_12 = { class: "mt-4 border-t border-gray-200 pt-3 dark:border-gray-700" };
-const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_9$2 = ["abbr"];
+const _hoisted_10$2 = ["id", "aria-label"];
+const _hoisted_11$2 = ["aria-label", "aria-selected", "aria-disabled", "disabled", "onClick"];
+const _hoisted_12$1 = { class: "mt-4 border-t border-gray-200 pt-3 dark:border-gray-700" };
+const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
   __name: "DatePicker",
   props: /* @__PURE__ */ vue.mergeModels({
     placeholder: { default: "Select date" },
@@ -768,7 +768,7 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
       return formatter.format(date);
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [
         vue.createElementVNode("button", {
           id: triggerId.value,
           ref_key: "triggerRef",
@@ -786,8 +786,8 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
           onClick: _cache[0] || (_cache[0] = //@ts-ignore
           (...args) => vue.unref(toggle) && vue.unref(toggle)(...args))
         }, [
-          vue.createElementVNode("span", _hoisted_3$5, vue.toDisplayString(displayValue.value || __props.placeholder), 1),
-          vue.createElementVNode("div", _hoisted_4$3, [
+          vue.createElementVNode("span", _hoisted_3$6, vue.toDisplayString(displayValue.value || __props.placeholder), 1),
+          vue.createElementVNode("div", _hoisted_4$4, [
             modelValue.value ? (vue.openBlock(), vue.createElementBlock("button", {
               key: 0,
               type: "button",
@@ -807,7 +807,7 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
               "aria-hidden": "true"
             })
           ])
-        ], 10, _hoisted_2$5),
+        ], 10, _hoisted_2$6),
         (vue.openBlock(), vue.createBlock(vue.Teleport, {
           to: "body",
           disabled: !__props.teleport
@@ -832,7 +832,7 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
                 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$3, [
+                vue.createElementVNode("div", _hoisted_6$4, [
                   vue.createElementVNode("button", {
                     type: "button",
                     class: "rounded p-1 hover:bg-gray-100 dark:hover:bg-gray-700",
@@ -845,7 +845,7 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
                       "aria-hidden": "true"
                     })
                   ]),
-                  vue.createElementVNode("span", _hoisted_7$3, vue.toDisplayString(monthYear.value), 1),
+                  vue.createElementVNode("span", _hoisted_7$4, vue.toDisplayString(monthYear.value), 1),
                   vue.createElementVNode("button", {
                     type: "button",
                     class: "rounded p-1 hover:bg-gray-100 dark:hover:bg-gray-700",
@@ -859,14 +859,14 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
                     })
                   ])
                 ]),
-                vue.createElementVNode("div", _hoisted_8$2, [
+                vue.createElementVNode("div", _hoisted_8$3, [
                   (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$1);
+                    }, vue.toDisplayString(day), 9, _hoisted_9$2);
                   }), 128))
                 ]),
                 vue.createElementVNode("div", {
@@ -893,17 +893,17 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
                         day.isSelected && "bg-primary text-white font-semibold"
                       ]),
                       onClick: ($event) => selectDate(day)
-                    }, vue.toDisplayString(day.date.getDate()), 11, _hoisted_11$1);
+                    }, vue.toDisplayString(day.date.getDate()), 11, _hoisted_11$2);
                   }), 128))
-                ], 8, _hoisted_10$1),
-                vue.createElementVNode("div", _hoisted_12, [
+                ], 8, _hoisted_10$2),
+                vue.createElementVNode("div", _hoisted_12$1, [
                   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$3)) : vue.createCommentVNode("", true)
+              ], 12, _hoisted_5$4)) : vue.createCommentVNode("", true)
             ]),
             _: 1
           })
@@ -912,27 +912,27 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$4 = { class: "space-y-4" };
-const _hoisted_2$4 = ["accept", "multiple", "disabled"];
-const _hoisted_3$4 = { class: "space-y-2" };
-const _hoisted_4$2 = { class: "text-sm font-medium text-gray-700 dark:text-gray-300" };
-const _hoisted_5$2 = {
+const _hoisted_1$5 = { class: "space-y-4" };
+const _hoisted_2$5 = ["accept", "multiple", "disabled"];
+const _hoisted_3$5 = { class: "space-y-2" };
+const _hoisted_4$3 = { class: "text-sm font-medium text-gray-700 dark:text-gray-300" };
+const _hoisted_5$3 = {
   key: 0,
   class: "text-xs text-gray-500 dark:text-gray-400"
 };
-const _hoisted_6$2 = {
+const _hoisted_6$3 = {
   key: 1,
   class: "text-xs text-gray-500 dark:text-gray-400"
 };
-const _hoisted_7$2 = {
+const _hoisted_7$3 = {
   key: 0,
   class: "space-y-2"
 };
-const _hoisted_8$1 = { class: "flex-1 min-w-0" };
-const _hoisted_9 = { class: "text-sm font-medium text-gray-700 dark:text-gray-300 truncate" };
-const _hoisted_10 = { class: "text-xs text-gray-500 dark:text-gray-400" };
-const _hoisted_11 = ["onClick"];
-const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_8$2 = { class: "flex-1 min-w-0" };
+const _hoisted_9$1 = { class: "text-sm font-medium text-gray-700 dark:text-gray-300 truncate" };
+const _hoisted_10$1 = { class: "text-xs text-gray-500 dark:text-gray-400" };
+const _hoisted_11$1 = ["onClick"];
+const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
   __name: "FileUpload",
   props: {
     accept: {},
@@ -1060,7 +1060,7 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
       return "heroicons:document";
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
         vue.createElementVNode("div", {
           class: vue.normalizeClass(dropzoneClasses.value),
           onDrop: vue.withModifiers(handleDrop, ["prevent"]),
@@ -1077,18 +1077,18 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
             multiple: __props.multiple,
             disabled: __props.disabled,
             onChange: handleInputChange
-          }, null, 40, _hoisted_2$4),
-          vue.createElementVNode("div", _hoisted_3$4, [
+          }, null, 40, _hoisted_2$5),
+          vue.createElementVNode("div", _hoisted_3$5, [
             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$2, vue.toDisplayString(__props.label), 1),
-            __props.description ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_5$2, vue.toDisplayString(__props.description), 1)) : vue.createCommentVNode("", true),
-            __props.maxSize ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_6$2, " Max size: " + vue.toDisplayString(formatSize(__props.maxSize)), 1)) : vue.createCommentVNode("", true)
+            vue.createElementVNode("p", _hoisted_4$3, vue.toDisplayString(__props.label), 1),
+            __props.description ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_5$3, vue.toDisplayString(__props.description), 1)) : vue.createCommentVNode("", true),
+            __props.maxSize ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_6$3, " Max size: " + vue.toDisplayString(formatSize(__props.maxSize)), 1)) : vue.createCommentVNode("", true)
           ])
         ], 34),
-        files.value.length > 0 ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_7$2, [
+        files.value.length > 0 ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_7$3, [
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(files.value, (uploadedFile) => {
             return vue.openBlock(), vue.createElementBlock("li", {
               key: uploadedFile.id,
@@ -1098,9 +1098,9 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
                 icon: getFileIcon(uploadedFile.file),
                 class: "size-8 text-gray-400"
               }, null, 8, ["icon"]),
-              vue.createElementVNode("div", _hoisted_8$1, [
-                vue.createElementVNode("p", _hoisted_9, vue.toDisplayString(uploadedFile.file.name), 1),
-                vue.createElementVNode("p", _hoisted_10, vue.toDisplayString(formatSize(uploadedFile.file.size)), 1)
+              vue.createElementVNode("div", _hoisted_8$2, [
+                vue.createElementVNode("p", _hoisted_9$1, vue.toDisplayString(uploadedFile.file.name), 1),
+                vue.createElementVNode("p", _hoisted_10$1, vue.toDisplayString(formatSize(uploadedFile.file.size)), 1)
               ]),
               vue.createElementVNode("button", {
                 type: "button",
@@ -1111,7 +1111,7 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
                   icon: "heroicons:x-mark",
                   class: "size-5"
                 })
-              ], 8, _hoisted_11)
+              ], 8, _hoisted_11$1)
             ]);
           }), 128))
         ])) : vue.createCommentVNode("", true)
@@ -1119,13 +1119,13 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$3 = { class: "flex items-center gap-1" };
-const _hoisted_2$3 = ["disabled", "onClick", "onMousemove"];
-const _hoisted_3$3 = {
+const _hoisted_1$4 = { class: "flex items-center gap-1" };
+const _hoisted_2$4 = ["disabled", "onClick", "onMousemove"];
+const _hoisted_3$4 = {
   key: 0,
   class: "ml-2 text-sm font-medium text-gray-700 dark:text-gray-300"
 };
-const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
   __name: "Rating",
   props: {
     modelValue: { default: 0 },
@@ -1188,7 +1188,7 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
       hoverValue.value = null;
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$3, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4, [
         vue.createElementVNode("div", {
           class: "flex items-center",
           onMouseleave: handleMouseLeave
@@ -1220,29 +1220,29 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
                   class: vue.normalizeClass([sizeClasses.value, __props.color])
                 }, null, 8, ["icon", "class"])
               ], 4)
-            ], 42, _hoisted_2$3);
+            ], 42, _hoisted_2$4);
           }), 128))
         ], 32),
-        __props.showValue ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$3, vue.toDisplayString(__props.modelValue.toFixed(__props.allowHalf ? 1 : 0)), 1)) : vue.createCommentVNode("", true)
+        __props.showValue ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$4, vue.toDisplayString(__props.modelValue.toFixed(__props.allowHalf ? 1 : 0)), 1)) : vue.createCommentVNode("", true)
       ]);
     };
   }
 });
-const _hoisted_1$2 = { class: "relative inline-block" };
-const _hoisted_2$2 = {
+const _hoisted_1$3 = { class: "relative inline-block" };
+const _hoisted_2$3 = {
   key: 0,
   class: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1"
 };
-const _hoisted_3$2 = ["disabled"];
-const _hoisted_4$1 = { class: "text-sm font-mono text-gray-700 dark:text-gray-300" };
-const _hoisted_5$1 = { class: "grid grid-cols-5 gap-2 mb-3" };
-const _hoisted_6$1 = ["title", "onClick"];
-const _hoisted_7$1 = {
+const _hoisted_3$3 = ["disabled"];
+const _hoisted_4$2 = { class: "text-sm font-mono text-gray-700 dark:text-gray-300" };
+const _hoisted_5$2 = { class: "grid grid-cols-5 gap-2 mb-3" };
+const _hoisted_6$2 = ["title", "onClick"];
+const _hoisted_7$2 = {
   key: 0,
   class: "flex items-center gap-2 pt-3 border-t border-gray-200 dark:border-gray-700"
 };
-const _hoisted_8 = ["value"];
-const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_8$1 = ["value"];
+const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
   __name: "ColorPicker",
   props: {
     modelValue: { default: "#3b82f6" },
@@ -1311,8 +1311,8 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
       isOpen.value = false;
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
-        __props.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_2$2, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true),
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$3, [
+        __props.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_2$3, 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 }]),
@@ -1323,12 +1323,12 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
             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$1, vue.toDisplayString(__props.modelValue), 1),
+          vue.createElementVNode("span", _hoisted_4$2, 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$2),
+        ], 10, _hoisted_3$3),
         (vue.openBlock(), vue.createBlock(vue.Teleport, {
           to: teleportTarget.value,
           disabled: teleportDisabled.value
@@ -1348,7 +1348,7 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
                 onClick: _cache[1] || (_cache[1] = vue.withModifiers(() => {
                 }, ["stop"]))
               }, [
-                vue.createElementVNode("div", _hoisted_5$1, [
+                vue.createElementVNode("div", _hoisted_5$2, [
                   (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.swatches, (color) => {
                     return vue.openBlock(), vue.createElementBlock("button", {
                       key: color,
@@ -1367,16 +1367,16 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
                           ["#ffffff", "#f9fafb", "#f3f4f6", "#e5e7eb", "#eab308", "#f59e0b"].includes(color) ? "text-gray-800" : "text-white"
                         ]])
                       }, null, 8, ["class"])) : vue.createCommentVNode("", true)
-                    ], 14, _hoisted_6$1);
+                    ], 14, _hoisted_6$2);
                   }), 128))
                 ]),
-                __props.showInput ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$1, [
+                __props.showInput ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$2, [
                   vue.createElementVNode("input", {
                     type: "color",
                     value: __props.modelValue,
                     class: "size-8 rounded cursor-pointer border-0 p-0",
                     onInput: handleNativeInput
-                  }, null, 40, _hoisted_8),
+                  }, null, 40, _hoisted_8$1),
                   vue.withDirectives(vue.createElementVNode("input", {
                     "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inputValue.value = $event),
                     type: "text",
@@ -1402,16 +1402,16 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$1 = { class: "space-y-2" };
-const _hoisted_2$1 = {
+const _hoisted_1$2 = { class: "space-y-2" };
+const _hoisted_2$2 = {
   key: 0,
   class: "flex justify-between text-sm font-medium text-gray-700 dark:text-gray-300"
 };
-const _hoisted_3$1 = {
+const _hoisted_3$2 = {
   key: 1,
   class: "flex justify-between text-xs text-gray-500 dark:text-gray-400"
 };
-const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
   __name: "RangeSlider",
   props: {
     modelValue: { default: () => [25, 75] },
@@ -1489,8 +1489,8 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
       }
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
-        __props.showLabels ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$1, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
+        __props.showLabels ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$2, [
           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),
@@ -1523,7 +1523,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
             onMousedown: _cache[1] || (_cache[1] = ($event) => handleMouseDown("max"))
           }, null, 38)
         ], 2),
-        __props.showMinMax ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$1, [
+        __props.showMinMax ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$2, [
           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)
@@ -1531,18 +1531,18 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1 = ["aria-expanded", "aria-controls"];
-const _hoisted_2 = ["id", "name", "placeholder", "disabled", "aria-controls"];
-const _hoisted_3 = { class: "flex items-center gap-1" };
-const _hoisted_4 = ["id", "aria-label", "aria-multiselectable"];
-const _hoisted_5 = ["aria-selected", "aria-disabled", "disabled", "onClick"];
-const _hoisted_6 = { class: "flex-1" };
-const _hoisted_7 = {
+const _hoisted_1$1 = ["aria-expanded", "aria-controls"];
+const _hoisted_2$1 = ["id", "name", "placeholder", "disabled", "aria-controls"];
+const _hoisted_3$1 = { class: "flex items-center gap-1" };
+const _hoisted_4$1 = ["id", "aria-label", "aria-multiselectable"];
+const _hoisted_5$1 = ["aria-selected", "aria-disabled", "disabled", "onClick"];
+const _hoisted_6$1 = { class: "flex-1" };
+const _hoisted_7$1 = {
   key: 1,
   class: "px-3 py-2 text-center text-sm text-gray-500 dark:text-gray-400",
   role: "status"
 };
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
   __name: "Combobox",
   props: {
     modelValue: {},
@@ -1673,10 +1673,10 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             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)), [
+          }, null, 8, _hoisted_2$1)), [
             [vue.vModelText, search.value]
           ]),
-          vue.createElementVNode("div", _hoisted_3, [
+          vue.createElementVNode("div", _hoisted_3$1, [
             __props.clearable && selectedOptions.value.length > 0 && !__props.disabled ? (vue.openBlock(), vue.createElementBlock("button", {
               key: 0,
               type: "button",
@@ -1699,7 +1699,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
               "aria-hidden": "true"
             }, null, 8, ["class"])
           ])
-        ], 10, _hoisted_1),
+        ], 10, _hoisted_1$1),
         (vue.openBlock(), vue.createBlock(vue.Teleport, {
           to: teleportTarget.value,
           disabled: teleportDisabled.value
@@ -1749,16 +1749,16 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                         class: "size-3"
                       })) : vue.createCommentVNode("", true)
                     ], 2)) : vue.createCommentVNode("", true),
-                    vue.createElementVNode("span", _hoisted_6, vue.toDisplayString(option.label), 1),
+                    vue.createElementVNode("span", _hoisted_6$1, 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);
-                }), 128)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_7, vue.toDisplayString(__props.noResultsText), 1))
-              ], 8, _hoisted_4)) : vue.createCommentVNode("", true)
+                  ], 10, _hoisted_5$1);
+                }), 128)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$1, vue.toDisplayString(__props.noResultsText), 1))
+              ], 8, _hoisted_4$1)) : vue.createCommentVNode("", true)
             ]),
             _: 1
           })
@@ -1767,18 +1767,312 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
+const _hoisted_1 = { class: "relative" };
+const _hoisted_2 = {
+  key: 0,
+  class: "text-red-500 ml-0.5"
+};
+const _hoisted_3 = ["id", "disabled", "aria-invalid", "aria-describedby"];
+const _hoisted_4 = {
+  key: 0,
+  class: "flex items-center gap-2 flex-1"
+};
+const _hoisted_5 = { class: "flex h-8 w-8 items-center justify-center rounded bg-gray-100 dark:bg-gray-800" };
+const _hoisted_6 = { class: "text-gray-700 dark:text-gray-300 font-mono text-xs truncate" };
+const _hoisted_7 = {
+  key: 1,
+  class: "flex-1 text-gray-400 dark:text-gray-500"
+};
+const _hoisted_8 = { class: "relative mb-4" };
+const _hoisted_9 = ["placeholder"];
+const _hoisted_10 = {
+  key: 0,
+  class: "absolute right-3 top-1/2 -translate-y-1/2"
+};
+const _hoisted_11 = { class: "max-h-64 overflow-y-auto" };
+const _hoisted_12 = {
+  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 = /* @__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, [
+        __props.label ? (vue.openBlock(), vue.createBlock(_sfc_main$e, {
+          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, "*")) : 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, [
+            vue.createElementVNode("div", _hoisted_5, [
+              vue.createVNode(vue.unref(vue$1.Icon), {
+                icon: modelValue.value,
+                class: "h-5 w-5 text-gray-700 dark:text-gray-300"
+              }, null, 8, ["icon"])
+            ]),
+            vue.createElementVNode("span", _hoisted_6, vue.toDisplayString(modelValue.value), 1)
+          ])) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_7, 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: "h-4 w-4"
+            })
+          ])) : vue.createCommentVNode("", true),
+          vue.createVNode(vue.unref(vue$1.Icon), {
+            icon: "lucide:chevron-down",
+            class: "h-4 w-4 text-gray-400"
+          })
+        ], 10, _hoisted_3),
+        __props.help && !hasError.value ? (vue.openBlock(), vue.createBlock(_sfc_main$d, {
+          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$d, {
+          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, [
+                vue.createVNode(vue.unref(vue$1.Icon), {
+                  icon: "lucide:search",
+                  class: "absolute left-3 top-1/2 h-4 w-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), [
+                  [vue.vModelText, searchQuery.value]
+                ]),
+                isLoading.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_10, [
+                  vue.createVNode(vue.unref(vue$1.Icon), {
+                    icon: "lucide:loader-2",
+                    class: "h-4 w-4 animate-spin text-gray-400"
+                  })
+                ])) : vue.createCommentVNode("", true)
+              ]),
+              vue.createElementVNode("div", _hoisted_11, [
+                displayedIcons.value.length === 0 && searchQuery.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12, ' 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 h-9 w-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: "h-5 w-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)
+        ]))
+      ]);
+    };
+  }
+});
 exports.Slider = Slider;
-exports._sfc_main = _sfc_main$d;
-exports._sfc_main$1 = _sfc_main$c;
-exports._sfc_main$10 = _sfc_main$2;
-exports._sfc_main$11 = _sfc_main$1;
-exports._sfc_main$12 = _sfc_main;
-exports._sfc_main$2 = _sfc_main$b;
-exports._sfc_main$3 = _sfc_main$a;
-exports._sfc_main$4 = _sfc_main$9;
-exports._sfc_main$5 = _sfc_main$8;
-exports._sfc_main$6 = _sfc_main$7;
-exports._sfc_main$7 = _sfc_main$5;
-exports._sfc_main$8 = _sfc_main$4;
-exports._sfc_main$9 = _sfc_main$3;
-//# sourceMappingURL=Combobox.vue_vue_type_script_setup_true_lang-C2z3wwmX.cjs.map
+exports._sfc_main = _sfc_main$e;
+exports._sfc_main$1 = _sfc_main$d;
+exports._sfc_main$10 = _sfc_main$3;
+exports._sfc_main$11 = _sfc_main$2;
+exports._sfc_main$12 = _sfc_main$1;
+exports._sfc_main$13 = _sfc_main;
+exports._sfc_main$2 = _sfc_main$c;
+exports._sfc_main$3 = _sfc_main$b;
+exports._sfc_main$4 = _sfc_main$a;
+exports._sfc_main$5 = _sfc_main$9;
+exports._sfc_main$6 = _sfc_main$8;
+exports._sfc_main$7 = _sfc_main$6;
+exports._sfc_main$8 = _sfc_main$5;
+exports._sfc_main$9 = _sfc_main$4;
+//# sourceMappingURL=IconPicker.vue_vue_type_script_setup_true_lang-agY_E72J.cjs.map