glass-ui-solid 0.3.2 → 0.3.5

package/dist/components/Accordion/Accordion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAA2B,MAAM,UAAU,CAAC;AAGnE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,eAAO,MAAM,SAAS,EAAE,SAAS,CAAC,cAAc,CA6D/C,CAAC"}
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAA2B,MAAM,UAAU,CAAC;AAGnE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,eAAO,MAAM,SAAS,EAAE,SAAS,CAAC,cAAc,CA+D/C,CAAC"}

package/dist/components/Accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import { type Component, For, Show, createSignal } from 'solid-js';\nimport { ACCORDION_CONTENT_ENTER } from '../../constants';\nimport { ChevronDownIcon, ChevronRightIcon } from '../shared/icons';\nimport type { AccordionProps } from './types';\n\nexport const Accordion: Component<AccordionProps> = (props) => {\n  const getDefaultOpen = () => {\n    const defaults: string[] = [];\n    for (const item of props.items) {\n      if (item.defaultOpen) {\n        defaults.push(item.id);\n      }\n    }\n    return defaults;\n  };\n\n  const [openItems, setOpenItems] = createSignal<string[]>(getDefaultOpen());\n\n  const isOpen = (id: string) => openItems().includes(id);\n\n  const toggle = (id: string) => {\n    if (props.multiple) {\n      setOpenItems((prev) => (prev.includes(id) ? prev.filter((i) => i !== id) : [...prev, id]));\n    } else {\n      setOpenItems((prev) => (prev.includes(id) ? [] : [id]));\n    }\n  };\n\n  return (\n    <div class={`space-y-1.5 ${props.class ?? ''}`}>\n      <For each={props.items}>\n        {(item) => (\n          <div class=\"glass-card rounded-lg overflow-hidden\">\n            <button\n              type=\"button\"\n              onClick={() => toggle(item.id)}\n              class=\"w-full flex items-center justify-between px-3 py-2.5 hover:bg-black/2 dark:hover:bg-white/2 transition-colors\"\n              aria-expanded={isOpen(item.id)}\n              aria-controls={`accordion-content-${item.id}`}\n            >\n              <div class=\"flex items-center gap-2 text-left\">\n                <ChevronRightIcon\n                  class={`w-3.5 h-3.5 text-surface-500 dark:text-surface-400 transition-transform duration-200 ${isOpen(item.id) ? 'rotate-90' : ''}`}\n                />\n                <span class=\"text-xs font-medium text-surface-700 dark:text-surface-200\">\n                  {item.title}\n                </span>\n              </div>\n              <ChevronDownIcon\n                class={`w-3.5 h-3.5 text-surface-400 dark:text-surface-500 transition-transform duration-200 ${isOpen(item.id) ? 'rotate-180' : ''}`}\n              />\n            </button>\n\n            <Show when={isOpen(item.id)}>\n              <div\n                id={`accordion-content-${item.id}`}\n                class={`px-3 pb-3 border-t border-surface-200 dark:border-white/5 ${ACCORDION_CONTENT_ENTER}`}\n              >\n                <div class=\"pt-3\">{item.content}</div>\n              </div>\n            </Show>\n          </div>\n        )}\n      </For>\n    </div>\n  );\n};\n"],"names":["Accordion","props","getDefaultOpen","defaults","item","items","defaultOpen","push","id","openItems","setOpenItems","createSignal","isOpen","includes","toggle","multiple","prev","filter","i","_el$","_tmpl$","_$insert","_$createComponent","For","each","children","_el$2","_tmpl$3","_el$3","firstChild","_el$4","_el$5","$$click","ChevronRightIcon","title","ChevronDownIcon","Show","when","_el$6","_tmpl$2","_el$7","_$className","ACCORDION_CONTENT_ENTER","content","_$effect","_$setAttribute","_p$","_v$","_v$2","e","t","undefined","class","_$delegateEvents"],"mappings":";;;;;AAKO,MAAMA,IAAwCC,CAAAA,MAAU;AAC7D,QAAMC,IAAiBA,MAAM;AAC3B,UAAMC,IAAqB,CAAA;AAC3B,eAAWC,KAAQH,EAAMI;AACvB,MAAID,EAAKE,eACPH,EAASI,KAAKH,EAAKI,EAAE;AAGzB,WAAOL;AAAAA,EACT,GAEM,CAACM,GAAWC,CAAY,IAAIC,EAAuBT,GAAgB,GAEnEU,IAASA,CAACJ,MAAeC,EAAAA,EAAYI,SAASL,CAAE,GAEhDM,IAASA,CAACN,MAAe;AAC7B,IAAIP,EAAMc,WACRL,EAAcM,CAAAA,MAAUA,EAAKH,SAASL,CAAE,IAAIQ,EAAKC,OAAQC,CAAAA,MAAMA,MAAMV,CAAE,IAAI,CAAC,GAAGQ,GAAMR,CAAE,CAAE,IAEzFE,EAAcM,CAAAA,MAAUA,EAAKH,SAASL,CAAE,IAAI,CAAA,IAAK,CAACA,CAAE,CAAE;AAAA,EAE1D;AAEA,UAAA,MAAA;AAAA,QAAAW,IAAAC,EAAAA;AAAAC,WAAAA,EAAAF,GAAAG,EAEKC,GAAG;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEvB,EAAMI;AAAAA,MAAK;AAAA,MAAAoB,UAClBrB,QAAI,MAAA;AAAA,YAAAsB,IAAAC,KAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAAAD,EAAAD;AAAAD,eAAAA,EAAAI,UAIS,MAAMlB,EAAOV,EAAKI,EAAE,GAACa,EAAAS,GAAAR,EAM3BW,GAAgB;AAAA,UAAA,IAAA,QAAA;AAAA,mBACR,wFAAwFrB,EAAOR,EAAKI,EAAE,IAAI,cAAc,EAAE;AAAA,UAAE;AAAA,QAAA,CAAA,GAAAuB,CAAA,GAAAV,EAAAU,GAAA,MAGlI3B,EAAK8B,KAAK,GAAAb,EAAAO,GAAAN,EAGda,GAAe;AAAA,UAAA,IAAA,QAAA;AAAA,mBACP,wFAAwFvB,EAAOR,EAAKI,EAAE,IAAI,eAAe,EAAE;AAAA,UAAE;AAAA,QAAA,CAAA,GAAA,IAAA,GAAAa,EAAAK,GAAAJ,EAIvIc,GAAI;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAEzB,EAAOR,EAAKI,EAAE;AAAA,UAAC;AAAA,UAAA,IAAAiB,WAAA;AAAA,gBAAAa,IAAAC,EAAAA,GAAAC,IAAAF,EAAAT;AAAAY,mBAAAA,EAAAH,GAGhB,6DAA6DI,CAAuB,EAAE,GAAArB,EAAAmB,GAAA,MAE1EpC,EAAKuC,OAAO,GAAAC,EAAA,MAAAC,EAAAP,SAH3B,qBAAqBlC,EAAKI,EAAE,EAAE,CAAA,GAAA8B;AAAAA,UAAA;AAAA,QAAA,CAAA,GAAA,IAAA,GAAAM,EAAAE,CAAAA,MAAA;AAAA,cAAAC,IAlBrBnC,EAAOR,EAAKI,EAAE,GAACwC,IACf,qBAAqB5C,EAAKI,EAAE;AAAEuC,iBAAAA,MAAAD,EAAAG,KAAAJ,EAAAjB,GAAA,iBAAAkB,EAAAG,IAAAF,CAAA,GAAAC,MAAAF,EAAAI,KAAAL,EAAAjB,GAAA,iBAAAkB,EAAAI,IAAAF,CAAA,GAAAF;AAAAA,QAAA,GAAA;AAAA,UAAAG,GAAAE;AAAAA,UAAAD,GAAAC;AAAAA,QAAAA,CAAA,GAAAzB;AAAAA,MAAA,GAAA;AAAA,IAAA,CAwBlD,CAAA,GAAAkB,EAAA,MAAAH,EAAAtB,GAjCO,eAAelB,EAAMmD,SAAS,EAAE,EAAE,CAAA,GAAAjC;AAAAA,EAAA,GAAA;AAqClD;AAAEkC,EAAA,CAAA,OAAA,CAAA;"}
+{"version":3,"file":"Accordion.js","sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import { type Component, For, Show, createSignal } from 'solid-js';\nimport { ACCORDION_CONTENT_ENTER } from '../../constants';\nimport { ChevronDownIcon, ChevronRightIcon } from '../shared/icons';\nimport type { AccordionProps } from './types';\n\nexport const Accordion: Component<AccordionProps> = (props) => {\n  const getDefaultOpen = () => {\n    const defaults: string[] = [];\n    for (const item of props.items) {\n      if (item.defaultOpen) {\n        defaults.push(item.id);\n      }\n    }\n    return defaults;\n  };\n\n  const [openItems, setOpenItems] = createSignal<string[]>(getDefaultOpen());\n\n  const isOpen = (id: string) => openItems().includes(id);\n\n  const toggle = (id: string) => {\n    if (props.multiple) {\n      setOpenItems((prev) =>\n        prev.includes(id) ? prev.filter((i) => i !== id) : [...prev, id],\n      );\n    } else {\n      setOpenItems((prev) => (prev.includes(id) ? [] : [id]));\n    }\n  };\n\n  return (\n    <div class={`space-y-1.5 ${props.class ?? ''}`}>\n      <For each={props.items}>\n        {(item) => (\n          <div class=\"glass-card rounded-lg overflow-hidden\">\n            <button\n              type=\"button\"\n              onClick={() => toggle(item.id)}\n              class=\"w-full flex items-center justify-between px-3 py-2.5 hover:bg-black/2 dark:hover:bg-white/2 transition-colors\"\n              aria-expanded={isOpen(item.id)}\n              aria-controls={`accordion-content-${item.id}`}\n            >\n              <div class=\"flex items-center gap-2 text-left\">\n                <ChevronRightIcon\n                  class={`w-3.5 h-3.5 text-surface-500 dark:text-surface-400 transition-transform duration-200 ${isOpen(item.id) ? 'rotate-90' : ''}`}\n                />\n                <span class=\"text-xs font-medium text-surface-700 dark:text-surface-200\">\n                  {item.title}\n                </span>\n              </div>\n              <ChevronDownIcon\n                class={`w-3.5 h-3.5 text-surface-400 dark:text-surface-500 transition-transform duration-200 ${isOpen(item.id) ? 'rotate-180' : ''}`}\n              />\n            </button>\n\n            <Show when={isOpen(item.id)}>\n              <div\n                id={`accordion-content-${item.id}`}\n                class={`px-3 pb-3 border-t border-surface-200 dark:border-white/5 ${ACCORDION_CONTENT_ENTER}`}\n              >\n                <div class=\"pt-3\">{item.content}</div>\n              </div>\n            </Show>\n          </div>\n        )}\n      </For>\n    </div>\n  );\n};\n"],"names":["Accordion","props","getDefaultOpen","defaults","item","items","defaultOpen","push","id","openItems","setOpenItems","createSignal","isOpen","includes","toggle","multiple","prev","filter","i","_el$","_tmpl$","_$insert","_$createComponent","For","each","children","_el$2","_tmpl$3","_el$3","firstChild","_el$4","_el$5","$$click","ChevronRightIcon","title","ChevronDownIcon","Show","when","_el$6","_tmpl$2","_el$7","_$className","ACCORDION_CONTENT_ENTER","content","_$effect","_$setAttribute","_p$","_v$","_v$2","e","t","undefined","class","_$delegateEvents"],"mappings":";;;;;AAKO,MAAMA,IAAwCC,CAAAA,MAAU;AAC7D,QAAMC,IAAiBA,MAAM;AAC3B,UAAMC,IAAqB,CAAA;AAC3B,eAAWC,KAAQH,EAAMI;AACvB,MAAID,EAAKE,eACPH,EAASI,KAAKH,EAAKI,EAAE;AAGzB,WAAOL;AAAAA,EACT,GAEM,CAACM,GAAWC,CAAY,IAAIC,EAAuBT,GAAgB,GAEnEU,IAASA,CAACJ,MAAeC,EAAAA,EAAYI,SAASL,CAAE,GAEhDM,IAASA,CAACN,MAAe;AAC7B,IAAIP,EAAMc,WACRL,EAAcM,CAAAA,MACZA,EAAKH,SAASL,CAAE,IAAIQ,EAAKC,OAAQC,CAAAA,MAAMA,MAAMV,CAAE,IAAI,CAAC,GAAGQ,GAAMR,CAAE,CACjE,IAEAE,EAAcM,CAAAA,MAAUA,EAAKH,SAASL,CAAE,IAAI,CAAA,IAAK,CAACA,CAAE,CAAE;AAAA,EAE1D;AAEA,UAAA,MAAA;AAAA,QAAAW,IAAAC,EAAAA;AAAAC,WAAAA,EAAAF,GAAAG,EAEKC,GAAG;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEvB,EAAMI;AAAAA,MAAK;AAAA,MAAAoB,UAClBrB,QAAI,MAAA;AAAA,YAAAsB,IAAAC,KAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAAAD,EAAAD;AAAAD,eAAAA,EAAAI,UAIS,MAAMlB,EAAOV,EAAKI,EAAE,GAACa,EAAAS,GAAAR,EAM3BW,GAAgB;AAAA,UAAA,IAAA,QAAA;AAAA,mBACR,wFAAwFrB,EAAOR,EAAKI,EAAE,IAAI,cAAc,EAAE;AAAA,UAAE;AAAA,QAAA,CAAA,GAAAuB,CAAA,GAAAV,EAAAU,GAAA,MAGlI3B,EAAK8B,KAAK,GAAAb,EAAAO,GAAAN,EAGda,GAAe;AAAA,UAAA,IAAA,QAAA;AAAA,mBACP,wFAAwFvB,EAAOR,EAAKI,EAAE,IAAI,eAAe,EAAE;AAAA,UAAE;AAAA,QAAA,CAAA,GAAA,IAAA,GAAAa,EAAAK,GAAAJ,EAIvIc,GAAI;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAEzB,EAAOR,EAAKI,EAAE;AAAA,UAAC;AAAA,UAAA,IAAAiB,WAAA;AAAA,gBAAAa,IAAAC,EAAAA,GAAAC,IAAAF,EAAAT;AAAAY,mBAAAA,EAAAH,GAGhB,6DAA6DI,CAAuB,EAAE,GAAArB,EAAAmB,GAAA,MAE1EpC,EAAKuC,OAAO,GAAAC,EAAA,MAAAC,EAAAP,SAH3B,qBAAqBlC,EAAKI,EAAE,EAAE,CAAA,GAAA8B;AAAAA,UAAA;AAAA,QAAA,CAAA,GAAA,IAAA,GAAAM,EAAAE,CAAAA,MAAA;AAAA,cAAAC,IAlBrBnC,EAAOR,EAAKI,EAAE,GAACwC,IACf,qBAAqB5C,EAAKI,EAAE;AAAEuC,iBAAAA,MAAAD,EAAAG,KAAAJ,EAAAjB,GAAA,iBAAAkB,EAAAG,IAAAF,CAAA,GAAAC,MAAAF,EAAAI,KAAAL,EAAAjB,GAAA,iBAAAkB,EAAAI,IAAAF,CAAA,GAAAF;AAAAA,QAAA,GAAA;AAAA,UAAAG,GAAAE;AAAAA,UAAAD,GAAAC;AAAAA,QAAAA,CAAA,GAAAzB;AAAAA,MAAA,GAAA;AAAA,IAAA,CAwBlD,CAAA,GAAAkB,EAAA,MAAAH,EAAAtB,GAjCO,eAAelB,EAAMmD,SAAS,EAAE,EAAE,CAAA,GAAAjC;AAAAA,EAAA,GAAA;AAqClD;AAAEkC,EAAA,CAAA,OAAA,CAAA;"}

package/dist/components/Accordion/AccordionPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAsB,MAAM,UAAU,CAAC;AAE9D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,kDAAkD;AAClD,eAAO,MAAM,cAAc,EAAE,SAAS,CAAC,mBAAmB,CA6BzD,CAAC"}
+{"version":3,"file":"AccordionPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAsB,MAAM,UAAU,CAAC;AAE9D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,kDAAkD;AAClD,eAAO,MAAM,cAAc,EAAE,SAAS,CAAC,mBAAmB,CA+BzD,CAAC"}

package/dist/components/Accordion/AccordionPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionPanel.js","sources":["../../../src/components/Accordion/AccordionPanel.tsx"],"sourcesContent":["import { type Component, Show, createSignal } from 'solid-js';\nimport { ChevronDownIcon, ChevronRightIcon } from '../shared/icons';\nimport type { AccordionPanelProps } from './types';\n\n/** Single accordion panel for simple use cases */\nexport const AccordionPanel: Component<AccordionPanelProps> = (props) => {\n  const [open, setOpen] = createSignal(props.defaultOpen ?? false);\n\n  return (\n    <div class={`glass-card rounded-lg overflow-hidden ${props.class ?? ''}`}>\n      <button\n        type=\"button\"\n        onClick={() => setOpen(!open())}\n        class=\"w-full flex items-center justify-between px-3 py-2.5 hover:bg-black/[0.02] dark:hover:bg-white/[0.02] transition-colors\"\n        aria-expanded={open()}\n      >\n        <div class=\"flex items-center gap-2 text-left\">\n          <ChevronRightIcon\n            class={`w-3.5 h-3.5 text-surface-500 dark:text-surface-400 transition-transform duration-200 ${open() ? 'rotate-90' : ''}`}\n          />\n          <span class=\"text-xs font-medium text-surface-700 dark:text-surface-200\">{props.title}</span>\n        </div>\n        <ChevronDownIcon\n          class={`w-3.5 h-3.5 text-surface-400 dark:text-surface-500 transition-transform duration-200 ${open() ? 'rotate-180' : ''}`}\n        />\n      </button>\n\n      <Show when={open()}>\n        <div class=\"px-3 pb-3 border-t border-surface-200 dark:border-white/5 animate-in fade-in slide-in-from-top-2 duration-200\">\n          <div class=\"pt-3\">{props.children}</div>\n        </div>\n      </Show>\n    </div>\n  );\n};\n"],"names":["AccordionPanel","props","open","setOpen","createSignal","defaultOpen","_el$","_tmpl$2","_el$2","firstChild","_el$3","_el$4","$$click","_$insert","_$createComponent","ChevronRightIcon","title","ChevronDownIcon","Show","when","children","_el$5","_tmpl$","_el$6","_$effect","_p$","_v$","class","_v$2","e","_$className","t","_$setAttribute","undefined","_$delegateEvents"],"mappings":";;;;AAKO,MAAMA,IAAkDC,CAAAA,MAAU;AACvE,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAaH,EAAMI,eAAe,EAAK;AAE/D,UAAA,MAAA;AAAA,QAAAC,IAAAC,KAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAAAD,EAAAD;AAAAD,WAAAA,EAAAI,UAIe,MAAMT,EAAQ,CAACD,GAAM,GAACW,EAAAH,GAAAI,EAK5BC,GAAgB;AAAA,MAAA,IAAA,QAAA;AAAA,eACR,wFAAwFb,EAAAA,IAAS,cAAc,EAAE;AAAA,MAAE;AAAA,IAAA,CAAA,GAAAS,CAAA,GAAAE,EAAAF,GAAA,MAElDV,EAAMe,KAAK,GAAAH,EAAAL,GAAAM,EAEtFG,GAAe;AAAA,MAAA,IAAA,QAAA;AAAA,eACP,wFAAwFf,EAAAA,IAAS,eAAe,EAAE;AAAA,MAAE;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAW,EAAAP,GAAAQ,EAI9HI,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEjB,EAAAA;AAAAA,MAAM;AAAA,MAAA,IAAAkB,WAAA;AAAA,YAAAC,IAAAC,EAAAA,GAAAC,IAAAF,EAAAZ;AAAAI,eAAAA,EAAAU,GAAA,MAEKtB,EAAMmB,QAAQ,GAAAC;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAG,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IApB3B,yCAAyCzB,EAAM0B,SAAS,EAAE,IAAEC,IAKrD1B,EAAAA;AAAMwB,aAAAA,MAAAD,EAAAI,KAAAC,EAAAxB,GAAAmB,EAAAI,IAAAH,CAAA,GAAAE,MAAAH,EAAAM,KAAAC,EAAAxB,GAAA,iBAAAiB,EAAAM,IAAAH,CAAA,GAAAH;AAAAA,IAAA,GAAA;AAAA,MAAAI,GAAAI;AAAAA,MAAAF,GAAAE;AAAAA,IAAAA,CAAA,GAAA3B;AAAAA,EAAA,GAAA;AAoB7B;AAAE4B,EAAA,CAAA,OAAA,CAAA;"}
+{"version":3,"file":"AccordionPanel.js","sources":["../../../src/components/Accordion/AccordionPanel.tsx"],"sourcesContent":["import { type Component, Show, createSignal } from 'solid-js';\nimport { ChevronDownIcon, ChevronRightIcon } from '../shared/icons';\nimport type { AccordionPanelProps } from './types';\n\n/** Single accordion panel for simple use cases */\nexport const AccordionPanel: Component<AccordionPanelProps> = (props) => {\n  const [open, setOpen] = createSignal(props.defaultOpen ?? false);\n\n  return (\n    <div class={`glass-card rounded-lg overflow-hidden ${props.class ?? ''}`}>\n      <button\n        type=\"button\"\n        onClick={() => setOpen(!open())}\n        class=\"w-full flex items-center justify-between px-3 py-2.5 hover:bg-black/[0.02] dark:hover:bg-white/[0.02] transition-colors\"\n        aria-expanded={open()}\n      >\n        <div class=\"flex items-center gap-2 text-left\">\n          <ChevronRightIcon\n            class={`w-3.5 h-3.5 text-surface-500 dark:text-surface-400 transition-transform duration-200 ${open() ? 'rotate-90' : ''}`}\n          />\n          <span class=\"text-xs font-medium text-surface-700 dark:text-surface-200\">\n            {props.title}\n          </span>\n        </div>\n        <ChevronDownIcon\n          class={`w-3.5 h-3.5 text-surface-400 dark:text-surface-500 transition-transform duration-200 ${open() ? 'rotate-180' : ''}`}\n        />\n      </button>\n\n      <Show when={open()}>\n        <div class=\"px-3 pb-3 border-t border-surface-200 dark:border-white/5 animate-in fade-in slide-in-from-top-2 duration-200\">\n          <div class=\"pt-3\">{props.children}</div>\n        </div>\n      </Show>\n    </div>\n  );\n};\n"],"names":["AccordionPanel","props","open","setOpen","createSignal","defaultOpen","_el$","_tmpl$2","_el$2","firstChild","_el$3","_el$4","$$click","_$insert","_$createComponent","ChevronRightIcon","title","ChevronDownIcon","Show","when","children","_el$5","_tmpl$","_el$6","_$effect","_p$","_v$","class","_v$2","e","_$className","t","_$setAttribute","undefined","_$delegateEvents"],"mappings":";;;;AAKO,MAAMA,IAAkDC,CAAAA,MAAU;AACvE,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAaH,EAAMI,eAAe,EAAK;AAE/D,UAAA,MAAA;AAAA,QAAAC,IAAAC,KAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAAAD,EAAAD;AAAAD,WAAAA,EAAAI,UAIe,MAAMT,EAAQ,CAACD,GAAM,GAACW,EAAAH,GAAAI,EAK5BC,GAAgB;AAAA,MAAA,IAAA,QAAA;AAAA,eACR,wFAAwFb,EAAAA,IAAS,cAAc,EAAE;AAAA,MAAE;AAAA,IAAA,CAAA,GAAAS,CAAA,GAAAE,EAAAF,GAAA,MAGzHV,EAAMe,KAAK,GAAAH,EAAAL,GAAAM,EAGfG,GAAe;AAAA,MAAA,IAAA,QAAA;AAAA,eACP,wFAAwFf,EAAAA,IAAS,eAAe,EAAE;AAAA,MAAE;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAW,EAAAP,GAAAQ,EAI9HI,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEjB,EAAAA;AAAAA,MAAM;AAAA,MAAA,IAAAkB,WAAA;AAAA,YAAAC,IAAAC,EAAAA,GAAAC,IAAAF,EAAAZ;AAAAI,eAAAA,EAAAU,GAAA,MAEKtB,EAAMmB,QAAQ,GAAAC;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAG,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IAtB3B,yCAAyCzB,EAAM0B,SAAS,EAAE,IAAEC,IAKrD1B,EAAAA;AAAMwB,aAAAA,MAAAD,EAAAI,KAAAC,EAAAxB,GAAAmB,EAAAI,IAAAH,CAAA,GAAAE,MAAAH,EAAAM,KAAAC,EAAAxB,GAAA,iBAAAiB,EAAAM,IAAAH,CAAA,GAAAH;AAAAA,IAAA,GAAA;AAAA,MAAAI,GAAAI;AAAAA,MAAAF,GAAAE;AAAAA,IAAAA,CAAA,GAAA3B;AAAAA,EAAA,GAAA;AAsB7B;AAAE4B,EAAA,CAAA,OAAA,CAAA;"}

package/dist/components/Accordion/index.d.ts

@@ -1,4 +1,4 @@
 export { Accordion } from './Accordion';
 export { AccordionPanel } from './AccordionPanel';
-export type { AccordionItem, AccordionPanelProps, AccordionProps } from './types';
+export type { AccordionItem, AccordionPanelProps, AccordionProps, } from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Accordion/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,aAAa,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EACV,aAAa,EACb,mBAAmB,EACnB,cAAc,GACf,MAAM,SAAS,CAAC"}

package/dist/components/Alert/Alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAQ,MAAM,UAAU,CAAC;AAUhD,OAAO,KAAK,EAAE,UAAU,EAAa,MAAM,SAAS,CAAC;AAcrD,eAAO,MAAM,KAAK,EAAE,SAAS,CAAC,UAAU,CAwCvC,CAAC"}
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAQ,MAAM,UAAU,CAAC;AAUhD,OAAO,KAAK,EAAE,UAAU,EAAa,MAAM,SAAS,CAAC;AAcrD,eAAO,MAAM,KAAK,EAAE,SAAS,CAAC,UAAU,CA4CvC,CAAC"}

package/dist/components/Alert/Alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import { type Component, Show } from 'solid-js';\nimport { Dynamic } from 'solid-js/web';\nimport { ALERT_COLORS } from '../../constants';\nimport {\n  CheckCircleIcon,\n  CloseIcon,\n  ErrorIcon,\n  InfoIcon,\n  WarningIcon,\n} from '../shared/icons';\nimport type { AlertProps, AlertType } from './types';\n\n/** Icon component mapping by alert type */\nconst ALERT_ICONS: Record<AlertType, Component<{ class?: string }>> = {\n  info: InfoIcon,\n  success: CheckCircleIcon,\n  warning: WarningIcon,\n  error: ErrorIcon,\n};\n\nconst DefaultIcon: Component<{ type: AlertType }> = (props) => (\n  <Dynamic component={ALERT_ICONS[props.type]} class=\"w-5 h-5\" />\n);\n\nexport const Alert: Component<AlertProps> = (props) => {\n  const styles = () => ALERT_COLORS[props.type];\n\n  return (\n    <div\n      class={`glass-card border-l-4 ${styles().border} ${styles().bg} p-4 rounded-xl ${props.class ?? ''}`}\n      role=\"alert\"\n    >\n      <div class=\"flex items-start gap-3\">\n        {/* Icon */}\n        <div\n          class={`flex-shrink-0 w-8 h-8 rounded-lg ${styles().iconBg} ${styles().icon} flex items-center justify-center`}\n        >\n          <Show when={props.icon} fallback={<DefaultIcon type={props.type} />}>\n            {props.icon}\n          </Show>\n        </div>\n\n        {/* Content */}\n        <div class=\"flex-1 min-w-0\">\n          <Show when={props.title}>\n            <h3 class=\"text-sm font-semibold text-surface-900 dark:text-surface-100 mb-1\">{props.title}</h3>\n          </Show>\n          <div class=\"text-sm text-surface-700 dark:text-surface-300\">{props.children}</div>\n        </div>\n\n        {/* Close button */}\n        <Show when={props.onClose}>\n          <button\n            type=\"button\"\n            onClick={props.onClose}\n            class=\"flex-shrink-0 p-1.5 rounded-lg text-surface-400 hover:text-surface-600 dark:hover:text-surface-200 hover:bg-black/5 dark:hover:bg-white/5 transition-colors\"\n            aria-label=\"Close\"\n          >\n            <CloseIcon class=\"w-4 h-4\" />\n          </button>\n        </Show>\n      </div>\n    </div>\n  );\n};\n"],"names":["ALERT_ICONS","info","InfoIcon","success","CheckCircleIcon","warning","WarningIcon","error","ErrorIcon","DefaultIcon","props","_$createComponent","Dynamic","component","type","Alert","styles","ALERT_COLORS","_el$","_tmpl$3","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$6","_$insert","Show","when","icon","fallback","children","title","_el$5","_tmpl$","onClose","_el$7","_tmpl$2","_$addEventListener","CloseIcon","_$effect","_p$","_v$","border","bg","class","_v$2","iconBg","e","_$className","t","undefined","_$delegateEvents"],"mappings":";;;;;;;;;AAaA,MAAMA,IAAgE;AAAA,EACpEC,MAAMC;AAAAA,EACNC,SAASC;AAAAA,EACTC,SAASC;AAAAA,EACTC,OAAOC;AACT,GAEMC,IAA+CC,CAAAA,MAAKC,EACvDC,GAAO;AAAA,EAAA,IAACC,YAAS;AAAA,WAAEb,EAAYU,EAAMI,IAAI;AAAA,EAAC;AAAA,EAAA,OAAA;AAAA,CAAA,GAGhCC,IAAgCL,CAAAA,MAAU;AACrD,QAAMM,IAASA,MAAMC,EAAaP,EAAMI,IAAI;AAE5C,UAAA,MAAA;AAAA,QAAAI,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAAAD,EAAAE,aAAAC,IAAAF,EAAAF;AAAAK,WAAAA,EAAAJ,GAAAX,EAUSgB,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAElB,EAAMmB;AAAAA,MAAI;AAAA,MAAA,IAAEC,WAAQ;AAAA,eAAAnB,EAAGF,GAAW;AAAA,UAAA,IAACK,OAAI;AAAA,mBAAEJ,EAAMI;AAAAA,UAAI;AAAA,QAAA,CAAA;AAAA,MAAA;AAAA,MAAA,IAAAiB,WAAA;AAAA,eAC5DrB,EAAMmB;AAAAA,MAAI;AAAA,IAAA,CAAA,CAAA,GAAAH,EAAAH,GAAAZ,EAMZgB,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAElB,EAAMsB;AAAAA,MAAK;AAAA,MAAA,IAAAD,WAAA;AAAA,YAAAE,IAAAC,EAAAA;AAAAR,eAAAA,EAAAO,GAAA,MAC0DvB,EAAMsB,KAAK,GAAAC;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAAR,CAAA,GAAAC,EAAAD,GAAA,MAE/Bf,EAAMqB,QAAQ,GAAAL,EAAAN,GAAAT,EAI5EgB,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAElB,EAAMyB;AAAAA,MAAO;AAAA,MAAA,IAAAJ,WAAA;AAAA,YAAAK,IAAAC,EAAAA;AAAAC,eAAAA,EAAAF,GAAA,SAGZ1B,EAAMyB,SAAO,EAAA,GAAAT,EAAAU,GAAAzB,EAIrB4B,GAAS;AAAA,UAAA,OAAA;AAAA,QAAA,CAAA,CAAA,GAAAH;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAI,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IA7BT,yBAAyB1B,IAAS2B,MAAM,IAAI3B,EAAAA,EAAS4B,EAAE,mBAAmBlC,EAAMmC,SAAS,EAAE,IAAEC,IAMzF,oCAAoC9B,EAAAA,EAAS+B,MAAM,IAAI/B,IAASa,IAAI;AAAmCa,aAAAA,MAAAD,EAAAO,KAAAC,EAAA/B,GAAAuB,EAAAO,IAAAN,CAAA,GAAAI,MAAAL,EAAAS,KAAAD,EAAA3B,GAAAmB,EAAAS,IAAAJ,CAAA,GAAAL;AAAAA,IAAA,GAAA;AAAA,MAAAO,GAAAG;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA,GAAAjC;AAAAA,EAAA,GAAA;AA6BxH;AAAEkC,EAAA,CAAA,OAAA,CAAA;"}
+{"version":3,"file":"Alert.js","sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import { type Component, Show } from 'solid-js';\nimport { Dynamic } from 'solid-js/web';\nimport { ALERT_COLORS } from '../../constants';\nimport {\n  CheckCircleIcon,\n  CloseIcon,\n  ErrorIcon,\n  InfoIcon,\n  WarningIcon,\n} from '../shared/icons';\nimport type { AlertProps, AlertType } from './types';\n\n/** Icon component mapping by alert type */\nconst ALERT_ICONS: Record<AlertType, Component<{ class?: string }>> = {\n  info: InfoIcon,\n  success: CheckCircleIcon,\n  warning: WarningIcon,\n  error: ErrorIcon,\n};\n\nconst DefaultIcon: Component<{ type: AlertType }> = (props) => (\n  <Dynamic component={ALERT_ICONS[props.type]} class=\"w-5 h-5\" />\n);\n\nexport const Alert: Component<AlertProps> = (props) => {\n  const styles = () => ALERT_COLORS[props.type];\n\n  return (\n    <div\n      class={`glass-card border-l-4 ${styles().border} ${styles().bg} p-4 rounded-xl ${props.class ?? ''}`}\n      role=\"alert\"\n    >\n      <div class=\"flex items-start gap-3\">\n        {/* Icon */}\n        <div\n          class={`flex-shrink-0 w-8 h-8 rounded-lg ${styles().iconBg} ${styles().icon} flex items-center justify-center`}\n        >\n          <Show when={props.icon} fallback={<DefaultIcon type={props.type} />}>\n            {props.icon}\n          </Show>\n        </div>\n\n        {/* Content */}\n        <div class=\"flex-1 min-w-0\">\n          <Show when={props.title}>\n            <h3 class=\"text-sm font-semibold text-surface-900 dark:text-surface-100 mb-1\">\n              {props.title}\n            </h3>\n          </Show>\n          <div class=\"text-sm text-surface-700 dark:text-surface-300\">\n            {props.children}\n          </div>\n        </div>\n\n        {/* Close button */}\n        <Show when={props.onClose}>\n          <button\n            type=\"button\"\n            onClick={props.onClose}\n            class=\"flex-shrink-0 p-1.5 rounded-lg text-surface-400 hover:text-surface-600 dark:hover:text-surface-200 hover:bg-black/5 dark:hover:bg-white/5 transition-colors\"\n            aria-label=\"Close\"\n          >\n            <CloseIcon class=\"w-4 h-4\" />\n          </button>\n        </Show>\n      </div>\n    </div>\n  );\n};\n"],"names":["ALERT_ICONS","info","InfoIcon","success","CheckCircleIcon","warning","WarningIcon","error","ErrorIcon","DefaultIcon","props","_$createComponent","Dynamic","component","type","Alert","styles","ALERT_COLORS","_el$","_tmpl$3","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$6","_$insert","Show","when","icon","fallback","children","title","_el$5","_tmpl$","onClose","_el$7","_tmpl$2","_$addEventListener","CloseIcon","_$effect","_p$","_v$","border","bg","class","_v$2","iconBg","e","_$className","t","undefined","_$delegateEvents"],"mappings":";;;;;;;;;AAaA,MAAMA,IAAgE;AAAA,EACpEC,MAAMC;AAAAA,EACNC,SAASC;AAAAA,EACTC,SAASC;AAAAA,EACTC,OAAOC;AACT,GAEMC,IAA+CC,CAAAA,MAAKC,EACvDC,GAAO;AAAA,EAAA,IAACC,YAAS;AAAA,WAAEb,EAAYU,EAAMI,IAAI;AAAA,EAAC;AAAA,EAAA,OAAA;AAAA,CAAA,GAGhCC,IAAgCL,CAAAA,MAAU;AACrD,QAAMM,IAASA,MAAMC,EAAaP,EAAMI,IAAI;AAE5C,UAAA,MAAA;AAAA,QAAAI,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAAAD,EAAAE,aAAAC,IAAAF,EAAAF;AAAAK,WAAAA,EAAAJ,GAAAX,EAUSgB,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAElB,EAAMmB;AAAAA,MAAI;AAAA,MAAA,IAAEC,WAAQ;AAAA,eAAAnB,EAAGF,GAAW;AAAA,UAAA,IAACK,OAAI;AAAA,mBAAEJ,EAAMI;AAAAA,UAAI;AAAA,QAAA,CAAA;AAAA,MAAA;AAAA,MAAA,IAAAiB,WAAA;AAAA,eAC5DrB,EAAMmB;AAAAA,MAAI;AAAA,IAAA,CAAA,CAAA,GAAAH,EAAAH,GAAAZ,EAMZgB,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAElB,EAAMsB;AAAAA,MAAK;AAAA,MAAA,IAAAD,WAAA;AAAA,YAAAE,IAAAC,EAAAA;AAAAR,eAAAA,EAAAO,GAAA,MAElBvB,EAAMsB,KAAK,GAAAC;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAAR,CAAA,GAAAC,EAAAD,GAAA,MAIbf,EAAMqB,QAAQ,GAAAL,EAAAN,GAAAT,EAKlBgB,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAElB,EAAMyB;AAAAA,MAAO;AAAA,MAAA,IAAAJ,WAAA;AAAA,YAAAK,IAAAC,EAAAA;AAAAC,eAAAA,EAAAF,GAAA,SAGZ1B,EAAMyB,SAAO,EAAA,GAAAT,EAAAU,GAAAzB,EAIrB4B,GAAS;AAAA,UAAA,OAAA;AAAA,QAAA,CAAA,CAAA,GAAAH;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAI,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IAjCT,yBAAyB1B,IAAS2B,MAAM,IAAI3B,EAAAA,EAAS4B,EAAE,mBAAmBlC,EAAMmC,SAAS,EAAE,IAAEC,IAMzF,oCAAoC9B,EAAAA,EAAS+B,MAAM,IAAI/B,IAASa,IAAI;AAAmCa,aAAAA,MAAAD,EAAAO,KAAAC,EAAA/B,GAAAuB,EAAAO,IAAAN,CAAA,GAAAI,MAAAL,EAAAS,KAAAD,EAAA3B,GAAAmB,EAAAS,IAAAJ,CAAA,GAAAL;AAAAA,IAAA,GAAA;AAAA,MAAAO,GAAAG;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA,GAAAjC;AAAAA,EAAA,GAAA;AAiCxH;AAAEkC,EAAA,CAAA,OAAA,CAAA;"}

package/dist/components/Alert/types.d.ts

@@ -1,5 +1,5 @@
 import { JSX } from 'solid-js';
-import { StatusColor, BaseComponentProps, IconProps } from '../../types';
+import { BaseComponentProps, IconProps, StatusColor } from '../../types';
 export interface AlertProps extends BaseComponentProps, IconProps {
     /** Type of alert, determines color styling */
     type: StatusColor;

package/dist/components/Alert/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AACpC,OAAO,KAAK,EAAE,WAAW,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAE9E,MAAM,WAAW,UAAW,SAAQ,kBAAkB,EAAE,SAAS;IAC/D,8CAA8C;IAC9C,IAAI,EAAE,WAAW,CAAC;IAClB,2CAA2C;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oBAAoB;IACpB,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;IACtB,+EAA+E;IAC/E,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAGD,YAAY,EAAE,WAAW,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AACpC,OAAO,KAAK,EAAE,kBAAkB,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE9E,MAAM,WAAW,UAAW,SAAQ,kBAAkB,EAAE,SAAS;IAC/D,8CAA8C;IAC9C,IAAI,EAAE,WAAW,CAAC;IAClB,2CAA2C;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oBAAoB;IACpB,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;IACtB,+EAA+E;IAC/E,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAGD,YAAY,EAAE,WAAW,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC"}

package/dist/components/Autocomplete/Autocomplete.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../../src/components/Autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,SAAS,EAQf,MAAM,UAAU,CAAC;AAIlB,OAAO,KAAK,EAAsB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AA4FrE;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,YAAY,EAAE,SAAS,CAAC,iBAAiB,CAgWrD,CAAC"}
+{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../../src/components/Autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,SAAS,EAQf,MAAM,UAAU,CAAC;AAQlB,OAAO,KAAK,EAAsB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AA+DrE;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,YAAY,EAAE,SAAS,CAAC,iBAAiB,CA2brD,CAAC"}

package/dist/components/Autocomplete/Autocomplete.js

@@ -1,258 +1,301 @@
-import { template as m, insert as h, createComponent as f, effect as k, setAttribute as $, use as H, className as D, style as te, delegateEvents as ne } from "solid-js/web";
-import { createSignal as V, createEffect as T, createMemo as A, on as re, onCleanup as le, Show as _, For as j } from "solid-js";
-import { useClickOutside as ae } from "../../hooks/useClickOutside.js";
-import { PortalWithDarkMode as ie } from "../shared/PortalWithDarkMode/PortalWithDarkMode.js";
-import { DROPDOWN_ITEM_SIZE_CLASSES as oe, INPUT_SIZE_CLASSES as se } from "../../constants/styles.js";
-var Z = /* @__PURE__ */ m("<span>"), ce = /* @__PURE__ */ m('<mark class="bg-primary-200 dark:bg-primary-700/50 text-inherit rounded-sm px-0.5">'), de = /* @__PURE__ */ m('<svg class="animate-spin h-4 w-4 text-surface-400"fill=none viewBox="0 0 24 24"aria-hidden=true><circle class=opacity-25 cx=12 cy=12 r=10 stroke=currentColor stroke-width=4></circle><path class=opacity-75 fill=currentColor d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z">'), ue = /* @__PURE__ */ m('<svg width=16 height=16 fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=2 aria-hidden=true><path stroke-linecap=round stroke-linejoin=round d="M19 9l-7 7-7-7">'), fe = /* @__PURE__ */ m('<label class="block text-sm font-medium text-surface-700 dark:text-surface-300 mb-1.5">'), he = /* @__PURE__ */ m('<p class="mt-1.5 text-sm text-red-500 dark:text-red-400">'), ge = /* @__PURE__ */ m('<div class="fixed z-50 glass-card rounded-xl shadow-lg overflow-hidden animate-in fade-in zoom-in-95 duration-150"role=listbox><div class="max-h-60 overflow-y-auto scrollbar-thin py-1">'), me = /* @__PURE__ */ m('<div><div class=relative><input type=text autocomplete=off role=combobox aria-haspopup=listbox aria-autocomplete=list><div class="absolute inset-y-0 right-0 flex items-center pr-3 pointer-events-none">'), ve = /* @__PURE__ */ m("<div>"), xe = /* @__PURE__ */ m("<button type=button data-option role=option tabindex=-1>");
-const be = (e, a) => e.label.toLowerCase().includes(a.toLowerCase()), we = (e) => {
-  const a = A(() => {
+import { template as b, insert as s, createComponent as u, effect as I, setAttribute as _, use as R, memo as ae, className as A, style as ie, delegateEvents as oe } from "solid-js/web";
+import { createSignal as M, createEffect as V, createMemo as z, on as se, onCleanup as de, Show as C, For as K } from "solid-js";
+import { useClickOutside as ce } from "../../hooks/useClickOutside.js";
+import { Spinner as ue } from "../Spinner/Spinner.js";
+import { CloseIcon as fe } from "../shared/icons/CloseIcon.js";
+import { ChevronDownIcon as he } from "../shared/icons/ChevronIcon.js";
+import { PortalWithDarkMode as ve } from "../shared/PortalWithDarkMode/PortalWithDarkMode.js";
+import { DROPDOWN_ITEM_SIZE_CLASSES as ge, INPUT_SIZE_CLASSES as me } from "../../constants/styles.js";
+var q = /* @__PURE__ */ b("<span>"), be = /* @__PURE__ */ b('<mark class="bg-primary-200 dark:bg-primary-700/50 text-inherit rounded-sm px-0.5">'), xe = /* @__PURE__ */ b('<label class="block text-sm font-medium text-surface-700 dark:text-surface-300 mb-1.5">'), we = /* @__PURE__ */ b("<div class=pointer-events-none>"), $e = /* @__PURE__ */ b('<button type=button class="p-1 rounded-full text-surface-400 hover:text-surface-600 dark:hover:text-surface-300 hover:bg-surface-200/50 dark:hover:bg-surface-700/50 transition-colors"tabindex=-1 aria-label="Clear selection">'), ke = /* @__PURE__ */ b('<button type=button class="p-1 text-surface-400 cursor-pointer disabled:cursor-not-allowed"tabindex=-1>'), Ce = /* @__PURE__ */ b('<p class="mt-1.5 text-sm text-red-500 dark:text-red-400">'), ye = /* @__PURE__ */ b('<div class="fixed z-50 glass-card rounded-xl shadow-lg overflow-hidden animate-in fade-in zoom-in-95 duration-150"role=listbox><div class="max-h-60 overflow-y-auto scrollbar-thin py-1">'), Ie = /* @__PURE__ */ b('<div><div class=relative><input type=text autocomplete=off role=combobox aria-haspopup=listbox aria-autocomplete=list><div class="absolute inset-y-0 right-0 flex items-center gap-1 pr-2">'), _e = /* @__PURE__ */ b("<div>"), Se = /* @__PURE__ */ b("<button type=button data-option role=option tabindex=-1>");
+const Oe = (e, i) => e.label.toLowerCase().includes(i.toLowerCase()), Ee = (e) => {
+  const i = z(() => {
     if (!e.highlight.trim())
       return [{
         text: e.text,
         match: !1
       }];
-    const v = e.text.toLowerCase(), c = e.highlight.toLowerCase(), i = [];
-    let d = 0, s = v.indexOf(c, d);
-    for (; s !== -1; )
-      s > d && i.push({
-        text: e.text.slice(d, s),
+    const w = e.text.toLowerCase(), f = e.highlight.toLowerCase(), r = [];
+    let g = 0, d = w.indexOf(f, g);
+    for (; d !== -1; )
+      d > g && r.push({
+        text: e.text.slice(g, d),
         match: !1
-      }), i.push({
-        text: e.text.slice(s, s + e.highlight.length),
+      }), r.push({
+        text: e.text.slice(d, d + e.highlight.length),
         match: !0
-      }), d = s + e.highlight.length, s = v.indexOf(c, d);
-    return d < e.text.length && i.push({
-      text: e.text.slice(d),
+      }), g = d + e.highlight.length, d = w.indexOf(f, g);
+    return g < e.text.length && r.push({
+      text: e.text.slice(g),
       match: !1
-    }), i.length > 0 ? i : [{
+    }), r.length > 0 ? r : [{
       text: e.text,
       match: !1
     }];
   });
   return (() => {
-    var v = Z();
-    return h(v, f(j, {
+    var w = q();
+    return s(w, u(K, {
       get each() {
-        return a();
+        return i();
       },
-      children: (c) => f(_, {
+      children: (f) => u(C, {
         get when() {
-          return c.match;
+          return f.match;
         },
         get fallback() {
           return (() => {
-            var i = Z();
-            return h(i, () => c.text), i;
+            var r = q();
+            return s(r, () => f.text), r;
           })();
         },
         get children() {
-          var i = ce();
-          return h(i, () => c.text), i;
+          var r = be();
+          return s(r, () => f.text), r;
         }
       })
-    })), v;
+    })), w;
   })();
-}, ke = () => de(), $e = (e) => (() => {
-  var a = ue();
-  return k(() => $(a, "class", e.class)), a;
-})(), Se = (e) => {
-  const [a, v] = V(!1), [c, i] = V(""), [d, s] = V(-1);
-  let M, I, b;
-  const q = (t) => {
-    M = t, typeof e.ref == "function" ? e.ref(t) : e.ref;
-  }, R = () => e.size ?? "md", K = () => e.emptyText ?? "No options found", G = () => e.filterFn ?? be;
-  T(() => {
-    const t = e.options.find((l) => l.value === e.value);
-    t ? i(t.label) : e.allowCustomValue ? i(e.value) : i("");
+}, Re = (e) => {
+  const [i, w] = M(!1), [f, r] = M(""), [g, d] = M(-1);
+  let T, O, y, H = !1;
+  const G = (t) => {
+    T = t, typeof e.ref == "function" ? e.ref(t) : e.ref;
+  }, P = () => e.size ?? "md", J = () => e.emptyText ?? "No options found", Q = () => e.filterFn ?? Oe;
+  V(() => {
+    const t = e.options.find((o) => o.value === e.value);
+    t ? r(t.label) : e.allowCustomValue ? r(e.value) : r("");
   });
-  const E = A(() => {
-    const t = c().trim();
-    return t ? e.options.filter((l) => G()(l, t)) : e.options;
-  }), z = A(() => E().filter((t) => !t.disabled));
-  T(re(() => E(), () => s(-1))), T(() => {
-    const t = d();
-    if (t >= 0 && b) {
-      const r = b.querySelectorAll("[data-option]")[t];
-      r && r.scrollIntoView({
+  const F = z(() => {
+    const t = f().trim();
+    return t ? e.options.filter((o) => Q()(o, t)) : e.options;
+  }), E = z(() => F().filter((t) => !t.disabled));
+  V(se(() => F(), () => {
+    if (i()) {
+      const t = E().length > 0 ? 0 : -1;
+      d(t);
+    }
+  })), V(() => {
+    const t = g();
+    if (t >= 0 && y) {
+      const l = y.querySelectorAll("[data-option]")[t];
+      l && l.scrollIntoView({
         block: "nearest"
       });
     }
   });
-  const F = () => {
-    e.disabled || (v(!0), s(-1));
-  }, w = () => {
-    v(!1), s(-1);
-  }, B = (t) => {
-    t.disabled || (i(t.label), e.onChange(t.value), w(), M?.focus());
-  }, J = (t) => {
-    i(t), e.onInputChange?.(t), a() || F();
-  }, Q = () => {
-    F();
-  }, X = (t) => {
-    const l = t.relatedTarget;
-    b?.contains(l) || setTimeout(() => {
-      if (!a()) return;
-      const r = e.options.find((x) => x.label.toLowerCase() === c().toLowerCase());
-      if (r)
-        e.onChange(r.value), i(r.label);
+  const L = () => {
+    if (e.disabled)
+      return;
+    w(!0);
+    const t = E().length > 0 ? 0 : -1;
+    d(t);
+  }, X = () => {
+    e.disabled || (i() ? $() : (L(), T?.focus()));
+  }, $ = () => {
+    w(!1), d(-1);
+  }, N = (t) => {
+    t.disabled || (r(t.label), e.onChange(t.value), $(), H = !0, T?.focus());
+  }, Y = (t) => {
+    t.stopPropagation(), r(""), e.onChange(""), e.onInputChange?.(""), T?.focus();
+  }, B = () => !!e.value, p = (t) => {
+    r(t), e.onInputChange?.(t), i() || L();
+  }, ee = () => {
+    if (H) {
+      H = !1;
+      return;
+    }
+    L();
+  }, te = (t) => {
+    const o = t.relatedTarget;
+    y?.contains(o) || setTimeout(() => {
+      if (!i())
+        return;
+      const l = e.options.find((c) => c.label.toLowerCase() === f().toLowerCase());
+      if (l)
+        e.onChange(l.value), r(l.label);
       else if (e.allowCustomValue)
-        e.onChange(c());
+        e.onChange(f());
       else {
-        const x = e.options.find((C) => C.value === e.value);
-        i(x?.label ?? "");
+        const c = e.options.find((x) => x.value === e.value);
+        r(c?.label ?? "");
       }
-      w();
+      $();
     }, 150);
-  }, Y = (t) => {
-    const l = z();
+  }, ne = (t) => {
+    const o = E(), l = o.length, c = i(), x = g();
     switch (t.key) {
       case "ArrowDown":
-        t.preventDefault(), a() ? l.length > 0 && s((r) => Math.min(r + 1, l.length - 1)) : F();
+        t.preventDefault(), c ? l > 0 && d((n) => Math.min(n + 1, l - 1)) : L();
         break;
       case "ArrowUp":
-        t.preventDefault(), a() && l.length > 0 && s((r) => Math.max(r - 1, 0));
+        t.preventDefault(), c && l > 0 && d((n) => Math.max(n - 1, 0));
         break;
       case "Enter":
-        t.preventDefault(), a() && d() >= 0 && d() < l.length ? B(l[d()]) : e.allowCustomValue && c().trim() && (e.onChange(c()), w());
+        t.preventDefault(), c && x >= 0 && x < l ? N(o[x]) : e.allowCustomValue && f().trim() && (e.onChange(f()), $());
         break;
       case "Escape":
-        if (t.preventDefault(), a()) {
-          w();
-          const r = e.options.find((x) => x.value === e.value);
-          i(r?.label ?? (e.allowCustomValue ? e.value : ""));
+        if (c) {
+          t.preventDefault(), $();
+          const n = e.options.find((h) => h.value === e.value);
+          r(n?.label ?? (e.allowCustomValue ? e.value : ""));
         }
         break;
       case "Tab":
-        a() && w();
+        c && $();
         break;
       case "Home":
-        a() && l.length > 0 && (t.preventDefault(), s(0));
+        c && l > 0 && (t.preventDefault(), d(0));
         break;
       case "End":
-        a() && l.length > 0 && (t.preventDefault(), s(l.length - 1));
+        c && l > 0 && (t.preventDefault(), d(l - 1));
         break;
     }
   };
-  ae({
-    refs: () => [I, b],
-    onClickOutside: w,
-    enabled: a
-  }), T(() => {
-    if (!a())
+  ce({
+    refs: () => [O, y],
+    onClickOutside: $,
+    enabled: i
+  }), V(() => {
+    if (!i())
       return;
-    const t = (l) => {
-      b?.contains(l.target) || w();
+    const t = (o) => {
+      y?.contains(o.target) || $();
     };
-    window.addEventListener("scroll", t, !0), le(() => window.removeEventListener("scroll", t, !0));
+    window.addEventListener("scroll", t, !0), de(() => window.removeEventListener("scroll", t, !0));
   });
-  const p = A(() => {
-    if (!a() || !I) return {};
-    const t = I.getBoundingClientRect(), l = window.innerHeight - t.bottom, r = t.top, C = l < 240 && r > l;
+  const le = z(() => {
+    if (!i() || !O)
+      return {};
+    const t = O.getBoundingClientRect(), o = window.innerHeight - t.bottom, l = t.top, x = o < 240 && l > o;
     return {
       left: `${t.left}px`,
       width: `${t.width}px`,
-      ...C ? {
+      ...x ? {
         bottom: `${window.innerHeight - t.top + 4}px`
       } : {
         top: `${t.bottom + 4}px`
       }
     };
-  }), ee = () => se[R()], N = () => oe[R()];
+  }), re = () => me[P()], U = () => ge[P()];
   return (() => {
-    var t = me(), l = t.firstChild, r = l.firstChild, x = r.nextSibling, C = I;
-    return typeof C == "function" ? H(C, t) : I = t, h(t, f(_, {
+    var t = Ie(), o = t.firstChild, l = o.firstChild, c = l.nextSibling, x = O;
+    return typeof x == "function" ? R(x, t) : O = t, s(t, u(C, {
       get when() {
         return e.label;
       },
       get children() {
-        var n = fe();
-        return h(n, () => e.label), k(() => $(n, "for", e.id)), n;
+        var n = xe();
+        return s(n, () => e.label), I(() => _(n, "for", e.id)), n;
       }
-    }), l), r.$$keydown = Y, r.addEventListener("blur", X), r.addEventListener("focus", Q), r.$$input = (n) => J(n.currentTarget.value), H(q, r), h(x, f(_, {
+    }), o), l.$$click = () => !i() && L(), l.$$keydown = ne, l.addEventListener("blur", te), l.addEventListener("focus", ee), l.$$input = (n) => p(n.currentTarget.value), R(G, l), s(c, u(C, {
       get when() {
         return e.loading;
       },
-      get fallback() {
-        return f($e, {
-          get class() {
-            return `text-surface-400 transition-transform duration-150 ${a() ? "rotate-180" : ""}`;
-          }
-        });
+      get children() {
+        var n = we();
+        return s(n, u(ue, {
+          size: "sm"
+        })), n;
+      }
+    }), null), s(c, u(C, {
+      get when() {
+        return ae(() => !!(!e.loading && B()))() && !e.disabled;
       },
       get children() {
-        return f(ke, {});
+        var n = $e();
+        return n.$$click = Y, s(n, u(fe, {
+          class: "w-4 h-4"
+        })), n;
+      }
+    }), null), s(c, u(C, {
+      get when() {
+        return !e.loading;
+      },
+      get children() {
+        var n = ke();
+        return n.$$click = X, s(n, u(he, {
+          get class() {
+            return `transition-transform duration-150 ${i() ? "rotate-180" : ""}`;
+          }
+        })), I((h) => {
+          var k = e.disabled, a = i() ? "Close dropdown" : "Open dropdown";
+          return k !== h.e && (n.disabled = h.e = k), a !== h.t && _(n, "aria-label", h.t = a), h;
+        }, {
+          e: void 0,
+          t: void 0
+        }), n;
       }
-    })), h(t, f(_, {
+    }), null), s(t, u(C, {
       get when() {
         return e.error;
       },
       get children() {
-        var n = he();
-        return h(n, () => e.error), n;
+        var n = Ce();
+        return s(n, () => e.error), n;
       }
-    }), null), h(t, f(_, {
+    }), null), s(t, u(C, {
       get when() {
-        return a();
+        return i();
       },
       get children() {
-        return f(ie, {
+        return u(ve, {
           get children() {
-            var n = ge(), L = n.firstChild, O = b;
-            return typeof O == "function" ? H(O, n) : b = n, h(L, f(_, {
+            var n = ye(), h = n.firstChild, k = y;
+            return typeof k == "function" ? R(k, n) : y = n, s(h, u(C, {
               get when() {
-                return E().length > 0;
+                return F().length > 0;
               },
               get fallback() {
                 return (() => {
-                  var o = ve();
-                  return h(o, K), k(() => D(o, `text-surface-500 dark:text-surface-400 text-center ${N()}`)), o;
+                  var a = _e();
+                  return s(a, J), I(() => A(a, `text-surface-500 dark:text-surface-400 text-center ${U()}`)), a;
                 })();
               },
               get children() {
-                return f(j, {
+                return u(K, {
                   get each() {
-                    return E();
+                    return F();
                   },
-                  children: (o) => {
-                    const S = () => z().indexOf(o) === d(), y = () => o.value === e.value;
+                  children: (a) => {
+                    const D = () => E().indexOf(a) === g(), S = () => a.value === e.value;
                     return (() => {
-                      var g = xe();
-                      return g.addEventListener("mouseenter", () => {
-                        if (!o.disabled) {
-                          const u = z().indexOf(o);
-                          s(u);
+                      var m = Se();
+                      return m.addEventListener("mouseenter", () => {
+                        if (!a.disabled) {
+                          const v = E().indexOf(a);
+                          d(v);
                         }
-                      }), g.$$click = () => B(o), h(g, f(we, {
+                      }), m.$$click = () => N(a), s(m, u(Ee, {
                         get text() {
-                          return o.label;
+                          return a.label;
                         },
                         get highlight() {
-                          return c();
+                          return f();
                         }
-                      })), k((u) => {
-                        var P = `w-full text-left transition-colors ${N()}
-                          ${o.disabled ? "text-surface-400 dark:text-surface-600 cursor-not-allowed" : "text-surface-700 dark:text-surface-200 cursor-pointer"}
-                          ${S() ? "bg-black/5 dark:bg-white/5" : ""}
-                          ${y() ? "bg-primary-50 dark:bg-primary-900/20 text-primary-700 dark:text-primary-300" : ""}
-                          ${!o.disabled && !S() && !y() ? "hover:bg-black/5 dark:hover:bg-white/5" : ""}
-                        `, U = o.disabled, W = y();
-                        return P !== u.e && D(g, u.e = P), U !== u.t && (g.disabled = u.t = U), W !== u.a && $(g, "aria-selected", u.a = W), u;
+                      })), I((v) => {
+                        var W = `w-full text-left transition-colors ${U()}
+                          ${a.disabled ? "text-surface-400 dark:text-surface-600 cursor-not-allowed" : "text-surface-700 dark:text-surface-200 cursor-pointer"}
+                          ${D() ? "bg-black/5 dark:bg-white/5" : ""}
+                          ${S() ? "bg-primary-50 dark:bg-primary-900/20 text-primary-700 dark:text-primary-300" : ""}
+                          ${!a.disabled && !D() && !S() ? "hover:bg-black/5 dark:hover:bg-white/5" : ""}
+                        `, Z = a.disabled, j = S();
+                        return W !== v.e && A(m, v.e = W), Z !== v.t && (m.disabled = v.t = Z), j !== v.a && _(m, "aria-selected", v.a = j), v;
                       }, {
                         e: void 0,
                         t: void 0,
                         a: void 0
-                      }), g;
+                      }), m;
                     })();
                   }
                 });
               }
-            })), k((o) => te(n, p(), o)), n;
+            })), I((a) => ie(n, le(), a)), n;
           }
         });
       }
-    }), null), k((n) => {
-      var L = `w-full ${e.class ?? ""}`, O = e.id, o = e.name, S = `w-full glass-input text-surface-900 dark:text-surface-100 focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed pr-10 ${ee()} ${e.error ? "border-red-500 dark:border-red-400" : ""}`, y = e.placeholder, g = e.disabled, u = a();
-      return L !== n.e && D(t, n.e = L), O !== n.t && $(r, "id", n.t = O), o !== n.a && $(r, "name", n.a = o), S !== n.o && D(r, n.o = S), y !== n.i && $(r, "placeholder", n.i = y), g !== n.n && (r.disabled = n.n = g), u !== n.s && $(r, "aria-expanded", n.s = u), n;
+    }), null), I((n) => {
+      var h = `w-full ${e.class ?? ""}`, k = e.id, a = e.name, D = `w-full glass-input text-surface-900 dark:text-surface-100 focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed ${B() && !e.disabled ? "pr-16" : "pr-10"} ${re()} ${e.error ? "border-red-500 dark:border-red-400" : ""}`, S = e.placeholder, m = e.disabled, v = i();
+      return h !== n.e && A(t, n.e = h), k !== n.t && _(l, "id", n.t = k), a !== n.a && _(l, "name", n.a = a), D !== n.o && A(l, n.o = D), S !== n.i && _(l, "placeholder", n.i = S), m !== n.n && (l.disabled = n.n = m), v !== n.s && _(l, "aria-expanded", n.s = v), n;
     }, {
       e: void 0,
       t: void 0,
@@ -261,11 +304,11 @@ const be = (e, a) => e.label.toLowerCase().includes(a.toLowerCase()), we = (e) =
       i: void 0,
       n: void 0,
       s: void 0
-    }), k(() => r.value = c()), t;
+    }), I(() => l.value = f()), t;
   })();
 };
-ne(["input", "keydown", "click"]);
+oe(["input", "keydown", "click"]);
 export {
-  Se as Autocomplete
+  Re as Autocomplete
 };
 //# sourceMappingURL=Autocomplete.js.map