cisse-vue-ui 0.3.2 → 0.5.1

package/dist/{DatePicker.vue_vue_type_script_setup_true_lang-CxddOiV4.cjs → RangeSlider.vue_vue_type_script_setup_true_lang-BRNkkx89.cjs}

@@ -3,8 +3,8 @@ const vue = require("vue");
 const vue$1 = require("@iconify/vue");
 const useDropdown = require("./useDropdown-DHFnd259.cjs");
 const _pluginVue_exportHelper = require("./_plugin-vue_export-helper-DM9IkUGy.cjs");
-const _hoisted_1$8 = ["data-error", "for"];
-const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$c = ["data-error", "for"];
+const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
   __name: "FormLabel",
   props: {
     error: { type: [String, Boolean] },
@@ -18,12 +18,12 @@ const _sfc_main$8 = /* @__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$8);
+      ], 8, _hoisted_1$c);
     };
   }
 });
-const _hoisted_1$7 = ["data-error"];
-const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$b = ["data-error"];
+const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
   __name: "FormHelp",
   props: {
     error: { type: Boolean },
@@ -38,12 +38,12 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
         vue.renderSlot(_ctx.$slots, "default", {}, () => [
           vue.createTextVNode(vue.toDisplayString(__props.text ?? ""), 1)
         ])
-      ], 8, _hoisted_1$7);
+      ], 8, _hoisted_1$b);
     };
   }
 });
-const _hoisted_1$6 = ["id", "disabled", "name", "placeholder", "type"];
-const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$a = ["id", "disabled", "name", "placeholder", "type"];
+const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
   __name: "FormInput",
   props: /* @__PURE__ */ vue.mergeModels({
     type: { default: "text" },
@@ -69,32 +69,32 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
         placeholder: __props.placeholder,
         type: __props.type,
         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 invalid:border-red-500 invalid:text-red-600 focus:border-primary focus:ring-1 focus:ring-primary focus:outline-none focus:invalid:border-red-500 focus: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$6)), [
+      }, _ctx.$attrs), null, 16, _hoisted_1$a)), [
         [vue.vModelDynamic, modelValue.value]
       ]);
     };
   }
 });
-const _hoisted_1$5 = { class: "relative" };
-const _hoisted_2$4 = ["id", "disabled"];
-const _hoisted_3$3 = { class: "flex-1 truncate" };
-const _hoisted_4$3 = {
+const _hoisted_1$9 = { class: "relative" };
+const _hoisted_2$8 = ["id", "disabled"];
+const _hoisted_3$7 = { class: "flex-1 truncate" };
+const _hoisted_4$5 = {
   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_5$2 = { 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_6$2 = {
+const _hoisted_5$4 = { 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_6$4 = {
   key: 1,
   class: "px-4 py-3 text-sm text-gray-500 dark:text-gray-400"
 };
-const _hoisted_7$2 = { class: "py-1" };
-const _hoisted_8$2 = ["data-index", "onClick", "onMouseenter"];
-const _hoisted_9$1 = {
+const _hoisted_7$4 = { class: "py-1" };
+const _hoisted_8$4 = ["data-index", "onClick", "onMouseenter"];
+const _hoisted_9$2 = {
   key: 1,
   class: "size-4 shrink-0"
 };
-const _hoisted_10$1 = { class: "flex-1" };
-const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_10$2 = { class: "flex-1" };
+const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
   __name: "FormSelect",
   props: /* @__PURE__ */ vue.mergeModels({
     options: {},
@@ -207,12 +207,12 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
       return [base, state, text, props.triggerClass];
     });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [
         vue.createElementVNode("button", {
+          id: __props.id ?? __props.name ?? void 0,
           ref_key: "triggerRef",
           ref: triggerRef,
           type: "button",
-          id: __props.id ?? __props.name ?? void 0,
           disabled: __props.disabled,
           class: vue.normalizeClass(triggerClasses.value),
           onClick: toggle,
@@ -222,13 +222,13 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
             option: selectedOption.value,
             placeholder: __props.placeholder
           }, () => [
-            vue.createElementVNode("span", _hoisted_3$3, vue.toDisplayString(displayValue.value), 1)
+            vue.createElementVNode("span", _hoisted_3$7, 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"])
           }, null, 8, ["class"])
-        ], 42, _hoisted_2$4),
+        ], 42, _hoisted_2$8),
         (vue.openBlock(), vue.createBlock(vue.Teleport, {
           to: "body",
           disabled: !__props.teleport
@@ -252,8 +252,8 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
                   !__props.teleport && "absolute mt-1 w-full"
                 ])
               }, [
-                __props.searchable ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$3, [
-                  vue.createElementVNode("div", _hoisted_5$2, [
+                __props.searchable ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$5, [
+                  vue.createElementVNode("div", _hoisted_5$4, [
                     vue.createVNode(vue.unref(vue$1.Icon), {
                       icon: "lucide:search",
                       class: "size-4 text-gray-400"
@@ -271,8 +271,8 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
                     ])
                   ])
                 ])) : vue.createCommentVNode("", true),
-                filteredOptions.value.length === 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$2, vue.toDisplayString(__props.noResultsText), 1)) : vue.createCommentVNode("", true),
-                vue.createElementVNode("div", _hoisted_7$2, [
+                filteredOptions.value.length === 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$4, vue.toDisplayString(__props.noResultsText), 1)) : vue.createCommentVNode("", true),
+                vue.createElementVNode("div", _hoisted_7$4, [
                   (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(filteredOptions.value, (option, index) => {
                     return vue.openBlock(), vue.createElementBlock("button", {
                       key: String(option.value),
@@ -296,10 +296,10 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
                           key: 0,
                           icon: "lucide:check",
                           class: "size-4 shrink-0 text-primary"
-                        })) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_9$1)),
-                        vue.createElementVNode("span", _hoisted_10$1, vue.toDisplayString(option.label), 1)
+                        })) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_9$2)),
+                        vue.createElementVNode("span", _hoisted_10$2, vue.toDisplayString(option.label), 1)
                       ])
-                    ], 42, _hoisted_8$2);
+                    ], 42, _hoisted_8$4);
                   }), 128))
                 ])
               ], 6)) : vue.createCommentVNode("", true)
@@ -311,8 +311,8 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$4 = ["hidden"];
-const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$8 = ["hidden"];
+const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
   __name: "FormGroup",
   props: /* @__PURE__ */ vue.mergeModels({
     label: {},
@@ -345,7 +345,7 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
       }, [
         vue.renderSlot(_ctx.$slots, "default", {}, () => [
           vue.renderSlot(_ctx.$slots, "label", {}, () => [
-            __props.label ? (vue.openBlock(), vue.createBlock(_sfc_main$8, {
+            __props.label ? (vue.openBlock(), vue.createBlock(_sfc_main$c, {
               key: 0,
               "html-for": __props.id ?? __props.name,
               error: __props.error
@@ -357,17 +357,17 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
             }, 8, ["html-for", "error"])) : vue.createCommentVNode("", true)
           ]),
           vue.renderSlot(_ctx.$slots, "input", {}, () => [
-            isSelect.value ? (vue.openBlock(), vue.createBlock(_sfc_main$5, vue.mergeProps({
+            isSelect.value ? (vue.openBlock(), vue.createBlock(_sfc_main$9, vue.mergeProps({
               key: 0,
               modelValue: modelValue.value,
               "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event)
-            }, { ..._ctx.$attrs, ..._ctx.$props }), null, 16, ["modelValue"])) : (vue.openBlock(), vue.createBlock(_sfc_main$6, vue.mergeProps({
+            }, { ..._ctx.$attrs, ..._ctx.$props }), null, 16, ["modelValue"])) : (vue.openBlock(), vue.createBlock(_sfc_main$a, vue.mergeProps({
               key: 1,
               modelValue: modelValue.value,
               "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => modelValue.value = $event)
             }, { ..._ctx.$attrs, ..._ctx.$props }), null, 16, ["modelValue"]))
           ]),
-          __props.error && typeof __props.error === "string" ? (vue.openBlock(), vue.createBlock(_sfc_main$7, {
+          __props.error && typeof __props.error === "string" ? (vue.openBlock(), vue.createBlock(_sfc_main$b, {
             key: 0,
             error: true
           }, {
@@ -377,13 +377,13 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
             _: 1
           })) : vue.createCommentVNode("", true)
         ])
-      ], 12, _hoisted_1$4);
+      ], 12, _hoisted_1$8);
     };
   }
 });
-const _hoisted_1$3 = { class: "relative" };
-const _hoisted_2$3 = ["disabled", "placeholder", "value"];
-const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$7 = { class: "relative" };
+const _hoisted_2$7 = ["disabled", "placeholder", "value"];
+const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
   __name: "SearchInput",
   props: {
     modelValue: {},
@@ -399,7 +399,7 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
       emit("update:modelValue", target.value);
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$3, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, [
         vue.createVNode(vue.unref(vue$1.Icon), {
           icon: __props.icon,
           class: "absolute top-1/2 left-3 h-5 w-5 -translate-y-1/2 text-gray-400"
@@ -411,25 +411,25 @@ const _sfc_main$3 = /* @__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$3)
+        }, null, 40, _hoisted_2$7)
       ]);
     };
   }
 });
-const _hoisted_1$2 = ["aria-checked", "disabled"];
-const _hoisted_2$2 = {
+const _hoisted_1$6 = ["aria-checked", "disabled"];
+const _hoisted_2$6 = {
   key: 0,
   class: "flex flex-col"
 };
-const _hoisted_3$2 = {
+const _hoisted_3$6 = {
   key: 0,
   class: "text-sm font-medium text-gray-900 dark:text-white"
 };
-const _hoisted_4$2 = {
+const _hoisted_4$4 = {
   key: 1,
   class: "text-sm text-gray-500 dark:text-gray-400"
 };
-const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
   __name: "Switch",
   props: {
     modelValue: { type: Boolean, default: false },
@@ -484,27 +484,27 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
               __props.modelValue ? translateSizes[__props.size] : "translate-x-1"
             ])
           }, null, 2)
-        ], 10, _hoisted_1$2),
-        __props.label || __props.description ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$2, [
-          __props.label ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$2, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true),
-          __props.description ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$2, vue.toDisplayString(__props.description), 1)) : vue.createCommentVNode("", true)
+        ], 10, _hoisted_1$6),
+        __props.label || __props.description ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$6, [
+          __props.label ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$6, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true),
+          __props.description ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$4, vue.toDisplayString(__props.description), 1)) : vue.createCommentVNode("", true)
         ])) : vue.createCommentVNode("", true)
       ], 2);
     };
   }
 });
-const _hoisted_1$1 = { class: "w-full" };
-const _hoisted_2$1 = {
+const _hoisted_1$5 = { class: "w-full" };
+const _hoisted_2$5 = {
   key: 0,
   class: "mb-2 flex justify-between text-sm"
 };
-const _hoisted_3$1 = { class: "text-gray-600 dark:text-gray-400" };
-const _hoisted_4$1 = { class: "font-medium text-gray-900 dark:text-white" };
-const _hoisted_5$1 = { class: "text-gray-600 dark:text-gray-400" };
-const _hoisted_6$1 = { class: "relative" };
-const _hoisted_7$1 = ["value", "min", "max", "step", "disabled"];
-const _hoisted_8$1 = { class: "pointer-events-none absolute inset-y-0 left-0 flex items-center" };
-const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_3$5 = { class: "text-gray-600 dark:text-gray-400" };
+const _hoisted_4$3 = { class: "font-medium text-gray-900 dark:text-white" };
+const _hoisted_5$3 = { class: "text-gray-600 dark:text-gray-400" };
+const _hoisted_6$3 = { class: "relative" };
+const _hoisted_7$3 = ["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$5 = /* @__PURE__ */ vue.defineComponent({
   __name: "Slider",
   props: /* @__PURE__ */ vue.mergeModels({
     min: { default: 0 },
@@ -535,13 +535,13 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
       modelValue.value = Number(target.value);
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
-        __props.showValue ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$1, [
-          vue.createElementVNode("span", _hoisted_3$1, vue.toDisplayString(__props.min), 1),
-          vue.createElementVNode("span", _hoisted_4$1, vue.toDisplayString(displayValue.value), 1),
-          vue.createElementVNode("span", _hoisted_5$1, vue.toDisplayString(__props.max), 1)
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
+        __props.showValue ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$5, [
+          vue.createElementVNode("span", _hoisted_3$5, vue.toDisplayString(__props.min), 1),
+          vue.createElementVNode("span", _hoisted_4$3, vue.toDisplayString(displayValue.value), 1),
+          vue.createElementVNode("span", _hoisted_5$3, vue.toDisplayString(__props.max), 1)
         ])) : vue.createCommentVNode("", true),
-        vue.createElementVNode("div", _hoisted_6$1, [
+        vue.createElementVNode("div", _hoisted_6$3, [
           vue.createElementVNode("input", {
             type: "range",
             value: modelValue.value,
@@ -551,8 +551,8 @@ const _sfc_main$1 = /* @__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$1),
-          vue.createElementVNode("div", _hoisted_8$1, [
+          }, null, 40, _hoisted_7$3),
+          vue.createElementVNode("div", _hoisted_8$3, [
             vue.createElementVNode("div", {
               class: "h-2 rounded-full bg-primary",
               style: vue.normalizeStyle({ width: `${percentage.value}%` })
@@ -563,18 +563,18 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Slider = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main$1, [["__scopeId", "data-v-89741e22"]]);
-const _hoisted_1 = { class: "relative" };
-const _hoisted_2 = ["disabled"];
-const _hoisted_3 = { class: "flex-1 truncate" };
-const _hoisted_4 = { class: "flex items-center gap-1" };
-const _hoisted_5 = { class: "mb-4 flex items-center justify-between" };
-const _hoisted_6 = { class: "font-medium text-gray-900 dark:text-white" };
-const _hoisted_7 = { class: "mb-2 grid grid-cols-7 gap-1" };
-const _hoisted_8 = { class: "grid grid-cols-7 gap-1" };
-const _hoisted_9 = ["disabled", "onClick"];
-const _hoisted_10 = { class: "mt-4 border-t border-gray-200 pt-3 dark:border-gray-700" };
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+const Slider = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main$5, [["__scopeId", "data-v-c25e2c2a"]]);
+const _hoisted_1$4 = { class: "relative" };
+const _hoisted_2$4 = ["disabled"];
+const _hoisted_3$4 = { class: "flex-1 truncate" };
+const _hoisted_4$2 = { class: "flex items-center gap-1" };
+const _hoisted_5$2 = { class: "mb-4 flex items-center justify-between" };
+const _hoisted_6$2 = { class: "font-medium text-gray-900 dark:text-white" };
+const _hoisted_7$2 = { class: "mb-2 grid grid-cols-7 gap-1" };
+const _hoisted_8$2 = { class: "grid grid-cols-7 gap-1" };
+const _hoisted_9$1 = ["disabled", "onClick"];
+const _hoisted_10$1 = { class: "mt-4 border-t border-gray-200 pt-3 dark:border-gray-700" };
+const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
   __name: "DatePicker",
   props: /* @__PURE__ */ vue.mergeModels({
     placeholder: { default: "Select date" },
@@ -684,7 +684,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       modelValue.value = null;
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4, [
         vue.createElementVNode("button", {
           ref_key: "triggerRef",
           ref: triggerRef,
@@ -698,8 +698,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           onClick: _cache[0] || (_cache[0] = //@ts-ignore
           (...args) => vue.unref(toggle) && vue.unref(toggle)(...args))
         }, [
-          vue.createElementVNode("span", _hoisted_3, vue.toDisplayString(displayValue.value || __props.placeholder), 1),
-          vue.createElementVNode("div", _hoisted_4, [
+          vue.createElementVNode("span", _hoisted_3$4, vue.toDisplayString(displayValue.value || __props.placeholder), 1),
+          vue.createElementVNode("div", _hoisted_4$2, [
             modelValue.value ? (vue.openBlock(), vue.createElementBlock("button", {
               key: 0,
               type: "button",
@@ -716,7 +716,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
               class: "size-4 text-gray-400"
             })
           ])
-        ], 10, _hoisted_2),
+        ], 10, _hoisted_2$4),
         (vue.openBlock(), vue.createBlock(vue.Teleport, {
           to: "body",
           disabled: !__props.teleport
@@ -737,7 +737,7 @@ const _sfc_main = /* @__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_5, [
+                vue.createElementVNode("div", _hoisted_5$2, [
                   vue.createElementVNode("button", {
                     type: "button",
                     class: "rounded p-1 hover:bg-gray-100 dark:hover:bg-gray-700",
@@ -748,7 +748,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                       class: "size-5 text-gray-600 dark:text-gray-400"
                     })
                   ]),
-                  vue.createElementVNode("span", _hoisted_6, vue.toDisplayString(monthYear.value), 1),
+                  vue.createElementVNode("span", _hoisted_6$2, vue.toDisplayString(monthYear.value), 1),
                   vue.createElementVNode("button", {
                     type: "button",
                     class: "rounded p-1 hover:bg-gray-100 dark:hover:bg-gray-700",
@@ -760,7 +760,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                     })
                   ])
                 ]),
-                vue.createElementVNode("div", _hoisted_7, [
+                vue.createElementVNode("div", _hoisted_7$2, [
                   (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(weekDays.value, (day) => {
                     return vue.openBlock(), vue.createElementBlock("div", {
                       key: day,
@@ -768,7 +768,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                     }, vue.toDisplayString(day), 1);
                   }), 128))
                 ]),
-                vue.createElementVNode("div", _hoisted_8, [
+                vue.createElementVNode("div", _hoisted_8$2, [
                   (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(calendarDays.value, (day, index) => {
                     return vue.openBlock(), vue.createElementBlock("button", {
                       key: index,
@@ -783,10 +783,10 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                         day.isSelected && "bg-primary text-white font-semibold"
                       ]),
                       onClick: ($event) => selectDate(day)
-                    }, vue.toDisplayString(day.date.getDate()), 11, _hoisted_9);
+                    }, vue.toDisplayString(day.date.getDate()), 11, _hoisted_9$1);
                   }), 128))
                 ]),
-                vue.createElementVNode("div", _hoisted_10, [
+                vue.createElementVNode("div", _hoisted_10$1, [
                   vue.createElementVNode("button", {
                     type: "button",
                     class: "w-full rounded py-1.5 text-sm font-medium text-primary hover:bg-primary/10",
@@ -802,13 +802,628 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
+const _hoisted_1$3 = { class: "space-y-4" };
+const _hoisted_2$3 = ["accept", "multiple", "disabled"];
+const _hoisted_3$3 = { class: "space-y-2" };
+const _hoisted_4$1 = { class: "text-sm font-medium text-gray-700 dark:text-gray-300" };
+const _hoisted_5$1 = {
+  key: 0,
+  class: "text-xs text-gray-500 dark:text-gray-400"
+};
+const _hoisted_6$1 = {
+  key: 1,
+  class: "text-xs text-gray-500 dark:text-gray-400"
+};
+const _hoisted_7$1 = {
+  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$3 = /* @__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 index = files.value.findIndex((f) => f.id === id);
+      if (index > -1) {
+        const removed = files.value.splice(index, 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$3, [
+        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$3),
+          vue.createElementVNode("div", _hoisted_3$3, [
+            vue.createVNode(vue.unref(vue$1.Icon), {
+              icon: "heroicons:cloud-arrow-up",
+              class: vue.normalizeClass(["w-12 h-12 mx-auto text-gray-400", { "text-primary-500": isDragging.value }])
+            }, null, 8, ["class"]),
+            vue.createElementVNode("p", _hoisted_4$1, vue.toDisplayString(__props.label), 1),
+            __props.description ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_5$1, vue.toDisplayString(__props.description), 1)) : vue.createCommentVNode("", true),
+            __props.maxSize ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_6$1, " Max size: " + vue.toDisplayString(formatSize(__props.maxSize)), 1)) : vue.createCommentVNode("", true)
+          ])
+        ], 34),
+        files.value.length > 0 ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_7$1, [
+          (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: "w-8 h-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("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: "w-5 h-5"
+                })
+              ], 8, _hoisted_11)
+            ]);
+          }), 128))
+        ])) : vue.createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+const _hoisted_1$2 = { class: "flex items-center gap-1" };
+const _hoisted_2$2 = ["disabled", "onClick", "onMousemove"];
+const _hoisted_3$2 = {
+  key: 0,
+  class: "ml-2 text-sm font-medium text-gray-700 dark:text-gray-300"
+};
+const _sfc_main$2 = /* @__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 "w-4 h-4";
+        case "lg":
+          return "w-8 h-8";
+        default:
+          return "w-6 h-6";
+      }
+    });
+    const getStarState = (index) => {
+      const value = displayValue.value;
+      if (value >= index) return "full";
+      if (props.allowHalf && value >= index - 0.5) return "half";
+      return "empty";
+    };
+    const handleClick = (index, event) => {
+      if (props.readonly || props.disabled) return;
+      let value = index;
+      if (props.allowHalf) {
+        const rect = event.target.getBoundingClientRect();
+        const isLeftHalf = event.clientX - rect.left < rect.width / 2;
+        value = isLeftHalf ? index - 0.5 : index;
+      }
+      emit("update:modelValue", value);
+    };
+    const handleMouseMove = (index, event) => {
+      if (props.readonly || props.disabled) return;
+      let value = index;
+      if (props.allowHalf) {
+        const rect = event.target.getBoundingClientRect();
+        const isLeftHalf = event.clientX - rect.left < rect.width / 2;
+        value = isLeftHalf ? index - 0.5 : index;
+      }
+      hoverValue.value = value;
+    };
+    const handleMouseLeave = () => {
+      hoverValue.value = null;
+    };
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
+        vue.createElementVNode("div", {
+          class: "flex items-center",
+          onMouseleave: handleMouseLeave
+        }, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.max, (index) => {
+            return vue.openBlock(), vue.createElementBlock("button", {
+              key: index,
+              type: "button",
+              class: vue.normalizeClass(["relative focus:outline-none 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(index, $event),
+              onMousemove: ($event) => handleMouseMove(index, $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(index) === "full" ? "100%" : getStarState(index) === "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$2);
+          }), 128))
+        ], 32),
+        __props.showValue ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$2, vue.toDisplayString(__props.modelValue.toFixed(__props.allowHalf ? 1 : 0)), 1)) : vue.createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+const _hoisted_1$1 = { class: "relative inline-block" };
+const _hoisted_2$1 = {
+  key: 0,
+  class: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1"
+};
+const _hoisted_3$1 = ["disabled"];
+const _hoisted_4 = { class: "text-sm font-mono text-gray-700 dark:text-gray-300" };
+const _hoisted_5 = { class: "grid grid-cols-5 gap-2 mb-3" };
+const _hoisted_6 = ["title", "onClick"];
+const _hoisted_7 = {
+  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$1 = /* @__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: {}
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    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$1, [
+        __props.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_2$1, 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: "w-6 h-6 rounded border border-gray-200 dark:border-gray-600",
+            style: vue.normalizeStyle({ backgroundColor: __props.modelValue })
+          }, null, 4),
+          vue.createElementVNode("span", _hoisted_4, vue.toDisplayString(__props.modelValue), 1),
+          vue.createVNode(vue.unref(vue$1.Icon), {
+            icon: "heroicons:chevron-down",
+            class: vue.normalizeClass(["w-4 h-4 text-gray-400", { "rotate-180": isOpen.value }])
+          }, null, 8, ["class"])
+        ], 10, _hoisted_3$1),
+        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, [
+                (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(["w-8 h-8 rounded-lg border-2 transition-transform hover:scale-110 focus:outline-none 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(["w-4 h-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);
+                }), 128))
+              ]),
+              __props.showInput ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7, [
+                vue.createElementVNode("input", {
+                  type: "color",
+                  value: __props.modelValue,
+                  class: "w-8 h-8 rounded cursor-pointer border-0 p-0",
+                  onInput: handleNativeInput
+                }, null, 40, _hoisted_8),
+                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: 1,
+          class: "fixed inset-0 z-40",
+          onClick: closePicker
+        })) : vue.createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+const _hoisted_1 = { class: "space-y-2" };
+const _hoisted_2 = {
+  key: 0,
+  class: "flex justify-between text-sm font-medium text-gray-700 dark:text-gray-300"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "flex justify-between text-xs text-gray-500 dark:text-gray-400"
+};
+const _sfc_main = /* @__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, [
+        __props.showLabels ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_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),
+        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 w-5 h-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 w-5 h-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, [
+          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)
+      ]);
+    };
+  }
+});
 exports.Slider = Slider;
-exports._sfc_main = _sfc_main$8;
-exports._sfc_main$1 = _sfc_main$7;
-exports._sfc_main$2 = _sfc_main$6;
-exports._sfc_main$3 = _sfc_main$5;
-exports._sfc_main$4 = _sfc_main$4;
-exports._sfc_main$5 = _sfc_main$3;
-exports._sfc_main$6 = _sfc_main$2;
-exports._sfc_main$7 = _sfc_main;
-//# sourceMappingURL=DatePicker.vue_vue_type_script_setup_true_lang-CxddOiV4.cjs.map
+exports._sfc_main = _sfc_main$c;
+exports._sfc_main$1 = _sfc_main$b;
+exports._sfc_main$10 = _sfc_main$1;
+exports._sfc_main$11 = _sfc_main;
+exports._sfc_main$2 = _sfc_main$a;
+exports._sfc_main$3 = _sfc_main$9;
+exports._sfc_main$4 = _sfc_main$8;
+exports._sfc_main$5 = _sfc_main$7;
+exports._sfc_main$6 = _sfc_main$6;
+exports._sfc_main$7 = _sfc_main$4;
+exports._sfc_main$8 = _sfc_main$3;
+exports._sfc_main$9 = _sfc_main$2;
+//# sourceMappingURL=RangeSlider.vue_vue_type_script_setup_true_lang-BRNkkx89.cjs.map