cisse-vue-ui 0.1.9 → 0.2.0

package/dist/{Checkbox.vue_vue_type_script_setup_true_lang-DQD2I1Wk.cjs → Switch.vue_vue_type_script_setup_true_lang-V-FtNcTd.cjs}

@@ -1,8 +1,8 @@
 "use strict";
 const vue = require("vue");
 const vue$1 = require("@iconify/vue");
-const _hoisted_1$7 = ["data-error", "for"];
-const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$6 = ["data-error", "for"];
+const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
   __name: "FormLabel",
   props: {
     error: { type: [String, Boolean] },
@@ -16,12 +16,12 @@ const _sfc_main$7 = /* @__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$7);
+      ], 8, _hoisted_1$6);
     };
   }
 });
-const _hoisted_1$6 = ["data-error"];
-const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$5 = ["data-error"];
+const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
   __name: "FormHelp",
   props: {
     error: { type: Boolean },
@@ -36,12 +36,12 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
         vue.renderSlot(_ctx.$slots, "default", {}, () => [
           vue.createTextVNode(vue.toDisplayString(__props.text ?? ""), 1)
         ])
-      ], 8, _hoisted_1$6);
+      ], 8, _hoisted_1$5);
     };
   }
 });
-const _hoisted_1$5 = ["id", "disabled", "name", "placeholder", "type"];
-const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$4 = ["id", "disabled", "name", "placeholder", "type"];
+const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
   __name: "FormInput",
   props: /* @__PURE__ */ vue.mergeModels({
     type: { default: "text" },
@@ -67,16 +67,16 @@ const _sfc_main$5 = /* @__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-pink-500 invalid:text-pink-600 focus:border-primary focus:ring-1 focus:ring-primary focus:outline-none focus:invalid:border-pink-500 focus:invalid:ring-pink-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$5)), [
+      }, _ctx.$attrs), null, 16, _hoisted_1$4)), [
         [vue.vModelDynamic, modelValue.value]
       ]);
     };
   }
 });
-const _hoisted_1$4 = { class: "relative" };
-const _hoisted_2$3 = ["id", "disabled"];
-const _hoisted_3$2 = { class: "flex-1 truncate" };
-const _hoisted_4$2 = {
+const _hoisted_1$3 = { class: "relative" };
+const _hoisted_2$2 = ["id", "disabled"];
+const _hoisted_3$1 = { class: "flex-1 truncate" };
+const _hoisted_4$1 = {
   key: 0,
   class: "sticky top-0 border-b border-gray-200 bg-white p-2 dark:border-gray-700 dark:bg-gray-800"
 };
@@ -92,7 +92,7 @@ const _hoisted_9 = {
   class: "size-4 shrink-0"
 };
 const _hoisted_10 = { class: "flex-1" };
-const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
   __name: "FormSelect",
   props: /* @__PURE__ */ vue.mergeModels({
     options: {},
@@ -276,7 +276,7 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
       return [base, state, text, props.triggerClass];
     });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$3, [
         vue.createElementVNode("button", {
           ref_key: "triggerRef",
           ref: triggerRef,
@@ -291,13 +291,13 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
             option: selectedOption.value,
             placeholder: __props.placeholder
           }, () => [
-            vue.createElementVNode("span", _hoisted_3$2, vue.toDisplayString(displayValue.value), 1)
+            vue.createElementVNode("span", _hoisted_3$1, 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", isOpen.value && "rotate-180"])
           }, null, 8, ["class"])
-        ], 42, _hoisted_2$3),
+        ], 42, _hoisted_2$2),
         (vue.openBlock(), vue.createBlock(vue.Teleport, {
           to: "body",
           disabled: !__props.teleport
@@ -321,7 +321,7 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
                   !__props.teleport && "absolute mt-1 w-full"
                 ])
               }, [
-                __props.searchable ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$2, [
+                __props.searchable ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$1, [
                   vue.createElementVNode("div", _hoisted_5, [
                     vue.createVNode(vue.unref(vue$1.Icon), {
                       icon: "lucide:search",
@@ -380,14 +380,15 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$3 = ["hidden"];
-const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$2 = ["hidden"];
+const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
   __name: "FormGroup",
   props: /* @__PURE__ */ vue.mergeModels({
     label: {},
     cols: { default: 6 },
     hidden: { type: Boolean },
     error: { type: [String, Boolean] },
+    select: { type: Boolean },
     type: {},
     value: {},
     placeholder: {},
@@ -405,7 +406,7 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
     const props = __props;
     const modelValue = vue.useModel(__props, "modelValue");
     const computedCols = vue.computed(() => `span ${props.cols} / span ${props.cols}`);
-    const isSelect = vue.computed(() => props.type === "select");
+    const isSelect = vue.computed(() => props.select === true);
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", {
         style: vue.normalizeStyle({ gridColumn: computedCols.value }),
@@ -413,7 +414,7 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
       }, [
         vue.renderSlot(_ctx.$slots, "default", {}, () => [
           vue.renderSlot(_ctx.$slots, "label", {}, () => [
-            __props.label ? (vue.openBlock(), vue.createBlock(_sfc_main$7, {
+            __props.label ? (vue.openBlock(), vue.createBlock(_sfc_main$6, {
               key: 0,
               "html-for": __props.id ?? __props.name,
               error: __props.error
@@ -425,17 +426,17 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
             }, 8, ["html-for", "error"])) : vue.createCommentVNode("", true)
           ]),
           vue.renderSlot(_ctx.$slots, "input", {}, () => [
-            isSelect.value ? (vue.openBlock(), vue.createBlock(_sfc_main$4, vue.mergeProps({
+            isSelect.value ? (vue.openBlock(), vue.createBlock(_sfc_main$3, 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$5, vue.mergeProps({
+            }, { ..._ctx.$attrs, ..._ctx.$props }), null, 16, ["modelValue"])) : (vue.openBlock(), vue.createBlock(_sfc_main$4, 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$6, {
+          __props.error && typeof __props.error === "string" ? (vue.openBlock(), vue.createBlock(_sfc_main$5, {
             key: 0,
             error: true
           }, {
@@ -445,13 +446,13 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
             _: 1
           })) : vue.createCommentVNode("", true)
         ])
-      ], 12, _hoisted_1$3);
+      ], 12, _hoisted_1$2);
     };
   }
 });
-const _hoisted_1$2 = { class: "relative" };
-const _hoisted_2$2 = ["disabled", "placeholder", "value"];
-const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$1 = { class: "relative" };
+const _hoisted_2$1 = ["disabled", "placeholder", "value"];
+const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
   __name: "SearchInput",
   props: {
     modelValue: {},
@@ -467,7 +468,7 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
       emit("update:modelValue", target.value);
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
         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"
@@ -479,25 +480,25 @@ const _sfc_main$2 = /* @__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$2)
+        }, null, 40, _hoisted_2$1)
       ]);
     };
   }
 });
-const _hoisted_1$1 = ["aria-checked", "disabled"];
-const _hoisted_2$1 = {
+const _hoisted_1 = ["aria-checked", "disabled"];
+const _hoisted_2 = {
   key: 0,
   class: "flex flex-col"
 };
-const _hoisted_3$1 = {
+const _hoisted_3 = {
   key: 0,
   class: "text-sm font-medium text-gray-900 dark:text-white"
 };
-const _hoisted_4$1 = {
+const _hoisted_4 = {
   key: 1,
   class: "text-sm text-gray-500 dark:text-gray-400"
 };
-const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "Switch",
   props: {
     modelValue: { type: Boolean, default: false },
@@ -552,56 +553,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
               __props.modelValue ? translateSizes[__props.size] : "translate-x-1"
             ])
           }, null, 2)
-        ], 10, _hoisted_1$1),
-        __props.label || __props.description ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$1, [
-          __props.label ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$1, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true),
-          __props.description ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$1, vue.toDisplayString(__props.description), 1)) : vue.createCommentVNode("", true)
-        ])) : vue.createCommentVNode("", true)
-      ], 2);
-    };
-  }
-});
-const _hoisted_1 = ["checked", "disabled", "indeterminate"];
-const _hoisted_2 = {
-  key: 0,
-  class: "flex flex-col"
-};
-const _hoisted_3 = {
-  key: 0,
-  class: "text-sm font-medium text-gray-900 dark:text-white"
-};
-const _hoisted_4 = {
-  key: 1,
-  class: "text-sm text-gray-500 dark:text-gray-400"
-};
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-  __name: "Checkbox",
-  props: {
-    modelValue: { type: Boolean, default: false },
-    label: {},
-    description: {},
-    disabled: { type: Boolean },
-    indeterminate: { type: Boolean }
-  },
-  emits: ["update:modelValue"],
-  setup(__props, { emit: __emit }) {
-    const emit = __emit;
-    const toggle = (event) => {
-      const target = event.target;
-      emit("update:modelValue", target.checked);
-    };
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("label", {
-        class: vue.normalizeClass(["inline-flex items-start gap-3", __props.disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer"])
-      }, [
-        vue.createElementVNode("input", {
-          type: "checkbox",
-          checked: __props.modelValue,
-          disabled: __props.disabled,
-          indeterminate: __props.indeterminate,
-          class: "mt-0.5 size-4 rounded border-gray-300 text-primary/90 focus:ring-2 focus:ring-primary focus:ring-offset-2 disabled:cursor-not-allowed dark:border-gray-600 dark:bg-gray-800 dark:focus:ring-offset-gray-900",
-          onChange: toggle
-        }, null, 40, _hoisted_1),
+        ], 10, _hoisted_1),
         __props.label || __props.description ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
           __props.label ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true),
           __props.description ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4, vue.toDisplayString(__props.description), 1)) : vue.createCommentVNode("", true)
@@ -610,12 +562,11 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-exports._sfc_main = _sfc_main$7;
-exports._sfc_main$1 = _sfc_main$6;
-exports._sfc_main$2 = _sfc_main$5;
-exports._sfc_main$3 = _sfc_main$4;
-exports._sfc_main$4 = _sfc_main$3;
-exports._sfc_main$5 = _sfc_main$2;
-exports._sfc_main$6 = _sfc_main$1;
-exports._sfc_main$7 = _sfc_main;
-//# sourceMappingURL=Checkbox.vue_vue_type_script_setup_true_lang-DQD2I1Wk.cjs.map
+exports._sfc_main = _sfc_main$6;
+exports._sfc_main$1 = _sfc_main$5;
+exports._sfc_main$2 = _sfc_main$4;
+exports._sfc_main$3 = _sfc_main$3;
+exports._sfc_main$4 = _sfc_main$2;
+exports._sfc_main$5 = _sfc_main$1;
+exports._sfc_main$6 = _sfc_main;
+//# sourceMappingURL=Switch.vue_vue_type_script_setup_true_lang-V-FtNcTd.cjs.map

package/dist/Switch.vue_vue_type_script_setup_true_lang-V-FtNcTd.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.vue_vue_type_script_setup_true_lang-V-FtNcTd.cjs","sources":["../src/components/form/FormLabel.vue","../src/components/form/FormHelp.vue","../src/components/form/FormInput.vue","../src/components/form/FormSelect.vue","../src/components/form/FormGroup.vue","../src/components/form/SearchInput.vue","../src/components/form/Switch.vue"],"sourcesContent":["<script lang=\"ts\" setup>\ndefineProps<{\n  error?: string | boolean\n  htmlFor?: string\n}>()\n</script>\n\n<template>\n  <label\n    :data-error=\"!!error\"\n    :for=\"htmlFor ?? ''\"\n    class=\"block text-sm font-medium text-gray-700 data-[error=true]:text-red-500 dark:text-gray-300\"\n  >\n    <slot />\n  </label>\n</template>\n","<script lang=\"ts\" setup>\ndefineProps<{\n  error?: boolean\n  text?: string\n}>()\n</script>\n\n<template>\n  <p\n    :data-error=\"error\"\n    class=\"mt-2 text-sm text-gray-400 peer-invalid:visible data-[error=true]:text-red-500 dark:text-gray-500\"\n  >\n    <slot>{{ text ?? '' }}</slot>\n  </p>\n</template>\n","<script lang=\"ts\" setup>\nimport type { InputProps } from '@/types'\n\nwithDefaults(defineProps<InputProps>(), {\n  type: 'text',\n})\n\nconst modelValue = defineModel<string>()\n</script>\n\n<template>\n  <input\n    :id=\"id ?? name ?? ''\"\n    v-model=\"modelValue\"\n    :disabled=\"disabled\"\n    :name=\"name ?? ''\"\n    :placeholder=\"placeholder\"\n    :type=\"type\"\n    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-pink-500 invalid:text-pink-600 focus:border-primary focus:ring-1 focus:ring-primary focus:outline-none focus:invalid:border-pink-500 focus:invalid:ring-pink-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\"\n    v-bind=\"$attrs\"\n  />\n</template>\n","<script lang=\"ts\" setup>\nimport { computed, ref, watch, nextTick, onUnmounted } from 'vue'\nimport { Icon } from '@iconify/vue'\nimport type { SelectProps, SelectOption } from '@/types'\n\nconst props = withDefaults(\n  defineProps<\n    SelectProps & {\n      /** Use teleport to body to avoid overflow clipping */\n      teleport?: boolean\n      /** Show search input in dropdown */\n      searchable?: boolean\n      /** Text shown when no results match search */\n      noResultsText?: string\n      /** Custom class for the trigger button */\n      triggerClass?: string\n    }\n  >(),\n  {\n    teleport: true,\n    searchable: false,\n    noResultsText: 'No results found',\n  },\n)\n\nconst modelValue = defineModel<string | number | boolean | null>()\n\nconst isOpen = ref(false)\nconst searchQuery = ref('')\nconst highlightedIndex = ref(-1)\nconst triggerRef = ref<HTMLElement>()\nconst dropdownRef = ref<HTMLElement>()\nconst searchInputRef = ref<HTMLInputElement>()\nconst dropdownPosition = ref({ top: 0, left: 0, width: 0 })\n\nconst visibleOptions = computed(() => {\n  return (props.options ?? []).filter((opt) => !opt.hidden)\n})\n\nconst filteredOptions = computed(() => {\n  if (!props.searchable || !searchQuery.value) {\n    return visibleOptions.value\n  }\n  const query = searchQuery.value.toLowerCase()\n  return visibleOptions.value.filter((opt) =>\n    opt.label.toLowerCase().includes(query) ||\n    String(opt.value).toLowerCase().includes(query)\n  )\n})\n\nconst selectedOption = computed(() => {\n  return visibleOptions.value.find((opt) => opt.value === modelValue.value)\n})\n\nconst displayValue = computed(() => {\n  if (selectedOption.value) {\n    return selectedOption.value.label\n  }\n  return props.placeholder || 'Select...'\n})\n\nconst updatePosition = () => {\n  if (!triggerRef.value || !props.teleport) return\n  const rect = triggerRef.value.getBoundingClientRect()\n  dropdownPosition.value = {\n    top: rect.bottom + window.scrollY + 4,\n    left: rect.left + window.scrollX,\n    width: rect.width,\n  }\n}\n\nconst open = () => {\n  if (props.disabled) return\n  isOpen.value = true\n  searchQuery.value = ''\n  highlightedIndex.value = filteredOptions.value.findIndex(\n    (opt) => opt.value === modelValue.value\n  )\n  nextTick(() => {\n    updatePosition()\n    if (props.searchable) {\n      searchInputRef.value?.focus()\n    }\n  })\n}\n\nconst close = () => {\n  isOpen.value = false\n  searchQuery.value = ''\n  highlightedIndex.value = -1\n}\n\nconst toggle = () => {\n  if (isOpen.value) {\n    close()\n  } else {\n    open()\n  }\n}\n\nconst selectOption = (option: SelectOption) => {\n  modelValue.value = option.value\n  close()\n}\n\nconst handleKeydown = (event: KeyboardEvent) => {\n  if (!isOpen.value) {\n    if (event.key === 'Enter' || event.key === ' ' || event.key === 'ArrowDown') {\n      event.preventDefault()\n      open()\n    }\n    return\n  }\n\n  switch (event.key) {\n    case 'ArrowDown':\n      event.preventDefault()\n      highlightedIndex.value = Math.min(\n        highlightedIndex.value + 1,\n        filteredOptions.value.length - 1\n      )\n      scrollToHighlighted()\n      break\n    case 'ArrowUp':\n      event.preventDefault()\n      highlightedIndex.value = Math.max(highlightedIndex.value - 1, 0)\n      scrollToHighlighted()\n      break\n    case 'Enter':\n      event.preventDefault()\n      if (highlightedIndex.value >= 0 && filteredOptions.value[highlightedIndex.value]) {\n        selectOption(filteredOptions.value[highlightedIndex.value])\n      }\n      break\n    case 'Escape':\n      event.preventDefault()\n      close()\n      break\n    case 'Tab':\n      close()\n      break\n  }\n}\n\nconst scrollToHighlighted = () => {\n  nextTick(() => {\n    if (dropdownRef.value) {\n      const highlighted = dropdownRef.value.querySelector(\n        `[data-index=\"${highlightedIndex.value}\"]`\n      ) as HTMLElement\n      if (highlighted) {\n        highlighted.scrollIntoView({ block: 'nearest' })\n      }\n    }\n  })\n}\n\nconst handleClickOutside = (event: MouseEvent) => {\n  const target = event.target as Node\n  const isInsideTrigger = triggerRef.value?.contains(target)\n  const isInsideDropdown = dropdownRef.value?.contains(target)\n  if (!isInsideTrigger && !isInsideDropdown) {\n    close()\n  }\n}\n\nwatch(isOpen, (newValue) => {\n  if (newValue) {\n    document.addEventListener('click', handleClickOutside)\n    window.addEventListener('scroll', updatePosition, true)\n    window.addEventListener('resize', updatePosition)\n  } else {\n    document.removeEventListener('click', handleClickOutside)\n    window.removeEventListener('scroll', updatePosition, true)\n    window.removeEventListener('resize', updatePosition)\n  }\n})\n\nwatch(searchQuery, () => {\n  highlightedIndex.value = 0\n})\n\nonUnmounted(() => {\n  document.removeEventListener('click', handleClickOutside)\n  window.removeEventListener('scroll', updatePosition, true)\n  window.removeEventListener('resize', updatePosition)\n})\n\nconst dropdownStyle = computed(() => {\n  if (!props.teleport) return {}\n  return {\n    position: 'absolute' as const,\n    top: `${dropdownPosition.value.top}px`,\n    left: `${dropdownPosition.value.left}px`,\n    width: `${dropdownPosition.value.width}px`,\n  }\n})\n\nconst triggerClasses = computed(() => {\n  const base = 'flex w-full items-center justify-between gap-2 rounded-md border px-3 py-2 text-sm text-left transition'\n  const state = props.disabled\n    ? 'cursor-not-allowed border-gray-200 bg-gray-50 text-gray-500 dark:border-gray-800 dark:bg-gray-950 dark:text-gray-500'\n    : isOpen.value\n      ? 'border-primary ring-2 ring-primary/20 bg-white dark:bg-gray-900'\n      : 'border-gray-300 bg-white hover:border-gray-400 dark:border-gray-700 dark:bg-gray-900 dark:hover:border-gray-600'\n  const text = selectedOption.value\n    ? 'text-gray-800 dark:text-gray-200'\n    : 'text-gray-400 dark:text-gray-500'\n  return [base, state, text, props.triggerClass]\n})\n</script>\n\n<template>\n  <div class=\"relative\">\n    <!-- Trigger -->\n    <button\n      ref=\"triggerRef\"\n      type=\"button\"\n      :id=\"id ?? name ?? undefined\"\n      :disabled=\"disabled\"\n      :class=\"triggerClasses\"\n      @click=\"toggle\"\n      @keydown=\"handleKeydown\"\n    >\n      <slot name=\"selected\" :option=\"selectedOption\" :placeholder=\"placeholder\">\n        <span class=\"flex-1 truncate\">{{ displayValue }}</span>\n      </slot>\n      <Icon\n        icon=\"lucide:chevron-down\"\n        :class=\"['size-4 shrink-0 text-gray-400 transition-transform', isOpen && 'rotate-180']\"\n      />\n    </button>\n\n    <!-- Dropdown -->\n    <Teleport to=\"body\" :disabled=\"!teleport\">\n      <Transition\n        enter-active-class=\"transition duration-100 ease-out\"\n        enter-from-class=\"opacity-0 scale-95\"\n        enter-to-class=\"opacity-100 scale-100\"\n        leave-active-class=\"transition duration-75 ease-in\"\n        leave-from-class=\"opacity-100 scale-100\"\n        leave-to-class=\"opacity-0 scale-95\"\n      >\n        <div\n          v-if=\"isOpen\"\n          ref=\"dropdownRef\"\n          :style=\"dropdownStyle\"\n          :class=\"[\n            'z-[9999] max-h-60 overflow-auto rounded-lg border border-gray-200 bg-white shadow-lg dark:border-gray-700 dark:bg-gray-800',\n            !teleport && 'absolute mt-1 w-full',\n          ]\"\n        >\n          <!-- Search input -->\n          <div v-if=\"searchable\" class=\"sticky top-0 border-b border-gray-200 bg-white p-2 dark:border-gray-700 dark:bg-gray-800\">\n            <div 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\">\n              <Icon icon=\"lucide:search\" class=\"size-4 text-gray-400\" />\n              <input\n                ref=\"searchInputRef\"\n                v-model=\"searchQuery\"\n                type=\"text\"\n                class=\"flex-1 bg-transparent text-sm outline-none dark:text-white\"\n                placeholder=\"Search...\"\n                @keydown=\"handleKeydown\"\n              />\n            </div>\n          </div>\n\n          <!-- Empty state -->\n          <div\n            v-if=\"filteredOptions.length === 0\"\n            class=\"px-4 py-3 text-sm text-gray-500 dark:text-gray-400\"\n          >\n            {{ noResultsText }}\n          </div>\n\n          <!-- Options -->\n          <div class=\"py-1\">\n            <button\n              v-for=\"(option, index) in filteredOptions\"\n              :key=\"String(option.value)\"\n              type=\"button\"\n              :data-index=\"index\"\n              :class=\"[\n                'flex w-full items-center gap-2 px-3 py-2 text-left text-sm transition-colors',\n                highlightedIndex === index && 'bg-gray-100 dark:bg-gray-700',\n                modelValue === option.value && 'bg-primary/10 text-primary',\n                modelValue !== option.value && 'text-gray-700 dark:text-gray-200',\n              ]\"\n              @click=\"selectOption(option)\"\n              @mouseenter=\"highlightedIndex = index\"\n            >\n              <slot name=\"option\" :option=\"option\" :selected=\"modelValue === option.value\" :index=\"index\">\n                <Icon\n                  v-if=\"modelValue === option.value\"\n                  icon=\"lucide:check\"\n                  class=\"size-4 shrink-0 text-primary\"\n                />\n                <span v-else class=\"size-4 shrink-0\" />\n                <span class=\"flex-1\">{{ option.label }}</span>\n              </slot>\n            </button>\n          </div>\n        </div>\n      </Transition>\n    </Teleport>\n  </div>\n</template>\n","<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport type { FormGroupProps } from '@/types'\nimport FormLabel from './FormLabel.vue'\nimport FormInput from './FormInput.vue'\nimport FormSelect from './FormSelect.vue'\nimport FormHelp from './FormHelp.vue'\n\nconst props = withDefaults(defineProps<FormGroupProps>(), {\n  cols: 6,\n})\n\nconst modelValue = defineModel()\n\nconst computedCols = computed(() => `span ${props.cols} / span ${props.cols}`)\n\nconst isSelect = computed(() => props.select === true)\n</script>\n\n<template>\n  <div :style=\"{ gridColumn: computedCols }\" :hidden=\"hidden\">\n    <slot>\n      <slot name=\"label\">\n        <FormLabel v-if=\"label\" :html-for=\"id ?? name\" :error=\"error\">\n          {{ label }}\n        </FormLabel>\n      </slot>\n\n      <slot name=\"input\">\n        <FormSelect\n          v-if=\"isSelect\"\n          v-model=\"modelValue\"\n          v-bind=\"{ ...$attrs, ...$props }\"\n        />\n        <FormInput\n          v-else\n          v-model=\"modelValue\"\n          v-bind=\"{ ...$attrs, ...$props }\"\n        />\n      </slot>\n\n      <FormHelp v-if=\"error && typeof error === 'string'\" :error=\"true\">\n        {{ error }}\n      </FormHelp>\n    </slot>\n  </div>\n</template>\n","<script lang=\"ts\" setup>\nimport { Icon } from '@iconify/vue'\n\nconst {\n  placeholder = 'Search...',\n  icon = 'lucide:search',\n  disabled = false,\n} = defineProps<{\n  modelValue?: string\n  placeholder?: string\n  icon?: string\n  disabled?: boolean\n}>()\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n}>()\n\nconst handleInput = (event: Event) => {\n  const target = event.target as HTMLInputElement\n  emit('update:modelValue', target.value)\n}\n</script>\n\n<template>\n  <div class=\"relative\">\n    <Icon :icon=\"icon\" class=\"absolute top-1/2 left-3 h-5 w-5 -translate-y-1/2 text-gray-400\" />\n    <input\n      :disabled=\"disabled\"\n      :placeholder=\"placeholder\"\n      :value=\"modelValue\"\n      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\"\n      type=\"text\"\n      @input=\"handleInput\"\n    />\n  </div>\n</template>\n","<script lang=\"ts\" setup>\n\nconst props = withDefaults(\n  defineProps<{\n    /** v-model value */\n    modelValue?: boolean\n    /** Label text */\n    label?: string\n    /** Description text */\n    description?: string\n    /** Disabled state */\n    disabled?: boolean\n    /** Size variant */\n    size?: 'sm' | 'md' | 'lg'\n  }>(),\n  {\n    modelValue: false,\n    size: 'md',\n  },\n)\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean]\n}>()\n\nconst toggle = () => {\n  if (props.disabled) return\n  emit('update:modelValue', !props.modelValue)\n}\n\nconst switchSizes = {\n  sm: 'h-5 w-9',\n  md: 'h-6 w-11',\n  lg: 'h-7 w-14',\n}\n\nconst dotSizes = {\n  sm: 'size-3',\n  md: 'size-4',\n  lg: 'size-5',\n}\n\nconst translateSizes = {\n  sm: 'translate-x-5',\n  md: 'translate-x-6',\n  lg: 'translate-x-8',\n}\n</script>\n\n<template>\n  <label\n    class=\"inline-flex items-start gap-3\"\n    :class=\"disabled ? 'cursor-not-allowed opacity-50' : 'cursor-pointer'\"\n  >\n    <button\n      type=\"button\"\n      role=\"switch\"\n      :aria-checked=\"modelValue\"\n      :disabled=\"disabled\"\n      :class=\"[\n        'relative inline-flex shrink-0 items-center rounded-full transition-colors focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2',\n        switchSizes[size],\n        modelValue ? 'bg-primary' : 'bg-gray-300 dark:bg-gray-600',\n      ]\"\n      @click=\"toggle\"\n    >\n      <span\n        :class=\"[\n          'inline-block transform rounded-full bg-white shadow-sm transition-transform',\n          dotSizes[size],\n          modelValue ? translateSizes[size] : 'translate-x-1',\n        ]\"\n      />\n    </button>\n    <div v-if=\"label || description\" class=\"flex flex-col\">\n      <span v-if=\"label\" class=\"text-sm font-medium text-gray-900 dark:text-white\">\n        {{ label }}\n      </span>\n      <span v-if=\"description\" class=\"text-sm text-gray-500 dark:text-gray-400\">\n        {{ description }}\n      </span>\n    </div>\n  </label>\n</template>\n"],"names":["_createElementBlock","_renderSlot","_useModel","_withDirectives","_openBlock","_mergeProps","$attrs","_hoisted_1","ref","computed","nextTick","watch","onUnmounted","_createElementVNode","_hoisted_3","_toDisplayString","_createVNode","_unref","Icon","_createBlock","_Teleport","_Transition","_normalizeClass","_hoisted_4","_Fragment","_renderList","FormLabel","FormSelect","$props","FormInput","FormHelp"],"mappings":"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"}

package/dist/components/core/MobileList.vue.d.ts

@@ -0,0 +1,80 @@
+export interface MobileListColumn {
+    key: string;
+    label: string;
+    /** Hide this column on mobile */
+    hideOnMobile?: boolean;
+    /** Mark as primary info (shown prominently) */
+    primary?: boolean;
+    /** Mark as secondary info */
+    secondary?: boolean;
+}
+type ItemType = {
+    id: number | string;
+    [key: string]: unknown;
+};
+type __VLS_Props = {
+    /** Array of items to display */
+    items: ItemType[];
+    /** Key field for unique identification */
+    keyField?: string;
+    /** Enable selection mode */
+    selectable?: boolean;
+    /** Set of selected item keys */
+    selectedItems?: Set<string>;
+    /** Filter function to determine if an item is selectable */
+    selectableFilter?: (item: ItemType) => boolean;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /** Avatar/icon slot for each item */
+        avatar?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Main content area for each item */
+        content?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Actions slot (right side) for each item */
+        actions?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Empty state slot */
+        empty?: () => unknown;
+    }> & {
+        /** Avatar/icon slot for each item */
+        avatar?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Main content area for each item */
+        content?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Actions slot (right side) for each item */
+        actions?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Empty state slot */
+        empty?: () => unknown;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    select: (id: string) => any;
+    selectAll: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: ((id: string) => any) | undefined;
+    onSelectAll?: (() => any) | undefined;
+}>, {
+    selectable: boolean;
+    keyField: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/core/ResponsiveList.vue.d.ts

@@ -0,0 +1,115 @@
+export interface ResponsiveListColumn {
+    /** Column key - corresponds to the data field name (alias for 'name' for backward compatibility) */
+    key?: string;
+    /** Column name - corresponds to the data field name */
+    name?: string;
+    /** Display label for the column header */
+    label?: string;
+    /** Column type for automatic rendering */
+    type?: 'text' | 'number' | 'date' | 'badge' | 'boolean' | string;
+    /** Text alignment in the column */
+    align?: 'left' | 'center' | 'right';
+    /** Header CSS class */
+    headerClass?: string;
+    /** Cell CSS class */
+    className?: string;
+    /** Whether the column is sortable */
+    sortable?: boolean;
+    /** Whether to hide the column */
+    hidden?: boolean;
+    /** Whether the column is the main/primary column */
+    main?: boolean;
+    /** Hide this column on mobile view */
+    hideOnMobile?: boolean;
+}
+type ItemType = {
+    id: number | string;
+    [key: string]: unknown;
+};
+type __VLS_Props = {
+    /** Array of items to display */
+    items: ItemType[];
+    /** Column definitions (extends Property with mobile options) */
+    columns: ResponsiveListColumn[];
+    /** Key field for unique identification */
+    keyField?: string;
+    /** Enable selection mode */
+    selectable?: boolean;
+    /** Set of selected item keys */
+    selectedItems?: Set<string>;
+    /** Filter function to determine if an item is selectable */
+    selectableFilter?: (item: ItemType) => boolean;
+    /** Breakpoint for switching between mobile and desktop views (default: 'lg' = 1024px) */
+    breakpoint?: 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        [key: `cell-${string}`]: (props: {
+            item: ItemType;
+            value: unknown;
+        }) => unknown;
+        /** Avatar/icon slot for mobile view */
+        avatar?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Main content for mobile view */
+        mobileContent?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Actions for mobile view */
+        mobileActions?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Actions column for table view, also used as fallback for mobile */
+        actions?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Empty state slot */
+        empty?: () => unknown;
+    }> & {
+        [key: `cell-${string}`]: (props: {
+            item: ItemType;
+            value: unknown;
+        }) => unknown;
+        /** Avatar/icon slot for mobile view */
+        avatar?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Main content for mobile view */
+        mobileContent?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Actions for mobile view */
+        mobileActions?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Actions column for table view, also used as fallback for mobile */
+        actions?: (props: {
+            item: ItemType;
+        }) => unknown;
+        /** Empty state slot */
+        empty?: () => unknown;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    select: (id: string) => any;
+    selectAll: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: ((id: string) => any) | undefined;
+    onSelectAll?: (() => any) | undefined;
+}>, {
+    selectable: boolean;
+    keyField: string;
+    breakpoint: "sm" | "md" | "lg" | "xl" | "2xl";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/core/TableComponent.vue.d.ts

@@ -1,36 +1,34 @@
 import { Property } from '../../types';
+type ItemType = {
+    id: number | string;
+    [key: string]: unknown;
+};
 type __VLS_Props = {
+    /** Column definitions */
     properties: Property[];
-    items: {
-        id: number | string;
-        [key: string]: unknown;
-    }[];
-};
-declare function __VLS_template(): {
-    attrs: Partial<{}>;
-    slots: Partial<Record<string, (_: {
-        property: Property;
-    }) => any>> & Partial<Record<string, (_: {
-        item: {
-            [key: string]: unknown;
-            id: number | string;
-        };
-        property: Property;
-        value: unknown;
-    }) => any>> & {
-        action?(_: {
-            item: {
-                [key: string]: unknown;
-                id: number | string;
-            };
-        }): any;
-        empty?(_: {}): any;
-    };
-    refs: {};
-    rootEl: any;
+    /** Array of items to display */
+    items: ItemType[];
+    /** Enable selection mode */
+    selectable?: boolean;
+    /** Set of selected item keys */
+    selectedItems?: Set<string>;
+    /** Filter function to determine if an item is selectable */
+    selectableFilter?: (item: ItemType) => boolean;
+    /** Key field for unique identification (default: 'id') */
+    keyField?: string;
 };
+declare function __VLS_template(): any;
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    select: (id: string) => any;
+    selectAll: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: ((id: string) => any) | undefined;
+    onSelectAll?: (() => any) | undefined;
+}>, {
+    selectable: boolean;
+    keyField: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/core/index.cjs

@@ -1,18 +1,20 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const CollapsibleCard_vue_vue_type_script_setup_true_lang = require("../../CollapsibleCard.vue_vue_type_script_setup_true_lang-Bd6TPEpH.cjs");
+const CollapsibleCard_vue_vue_type_script_setup_true_lang = require("../../CollapsibleCard.vue_vue_type_script_setup_true_lang-Cs6KGC-0.cjs");
 const Dropdown_vue_vue_type_script_setup_true_lang = require("../../Dropdown.vue_vue_type_script_setup_true_lang-H6wsySqi.cjs");
 const BadgeType_vue_vue_type_script_setup_true_lang = require("../../BadgeType.vue_vue_type_script_setup_true_lang-CJb63H1I.cjs");
-exports.AutocompleteComponent = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$2;
-exports.Avatar = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$5;
-exports.Button = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$4;
+exports.AutocompleteComponent = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$4;
+exports.Avatar = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$7;
+exports.Button = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$6;
 exports.CardComponent = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main;
-exports.CollapsibleCard = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$9;
-exports.Stepper = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$8;
-exports.TabPanel = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$7;
-exports.TableAction = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$3;
+exports.CollapsibleCard = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$11;
+exports.MobileList = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$2;
+exports.ResponsiveList = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$3;
+exports.Stepper = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$10;
+exports.TabPanel = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$9;
+exports.TableAction = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$5;
 exports.TableComponent = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$1;
-exports.Tabs = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$6;
+exports.Tabs = CollapsibleCard_vue_vue_type_script_setup_true_lang._sfc_main$8;
 exports.Dropdown = Dropdown_vue_vue_type_script_setup_true_lang._sfc_main$1;
 exports.MenuItem = Dropdown_vue_vue_type_script_setup_true_lang._sfc_main;
 exports.StatusBadge = BadgeType_vue_vue_type_script_setup_true_lang._sfc_main;