solid-tom-ui 1.0.5 → 1.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (69) hide show
  1. package/README.md +246 -237
  2. package/dist/README.md +246 -0
  3. package/dist/components/avatar/avatar.js.map +1 -1
  4. package/dist/components/badge/badge.js.map +1 -1
  5. package/dist/components/breadcrumb/breadcrumb.js.map +1 -1
  6. package/dist/components/button/button.js.map +1 -1
  7. package/dist/components/carousel/carousel.js.map +1 -1
  8. package/dist/components/chat-bubble/chatBubble.js.map +1 -1
  9. package/dist/components/checkbox/checkbox.js.map +1 -1
  10. package/dist/components/collapse/collapse.js.map +1 -1
  11. package/dist/components/context-menu/context-menu.js.map +1 -1
  12. package/dist/components/context-menu/context-menu.store.js.map +1 -1
  13. package/dist/components/divider/divider.js.map +1 -1
  14. package/dist/components/dropdown/dropdown.js.map +1 -1
  15. package/dist/components/dropdown/dropdown.store.js.map +1 -1
  16. package/dist/components/float-button/float-button.js.map +1 -1
  17. package/dist/components/hover-3d-image/hover-3d-image.js.map +1 -1
  18. package/dist/components/image-preview/image-preview.js.map +1 -1
  19. package/dist/components/input/input.js.map +1 -1
  20. package/dist/components/input/input.utils.js.map +1 -1
  21. package/dist/components/input/variants/input-color.js.map +1 -1
  22. package/dist/components/input/variants/input-date.js.map +1 -1
  23. package/dist/components/input/variants/input-number.js.map +1 -1
  24. package/dist/components/input/variants/input-otp.js.map +1 -1
  25. package/dist/components/input/variants/input-password.js.map +1 -1
  26. package/dist/components/input/variants/input-radio.js.map +1 -1
  27. package/dist/components/input/variants/input-range.js.map +1 -1
  28. package/dist/components/input/variants/input-text.js.map +1 -1
  29. package/dist/components/input/variants/input-textarea.js.map +1 -1
  30. package/dist/components/loading/loading.js.map +1 -1
  31. package/dist/components/mansory/mansory.js.map +1 -1
  32. package/dist/components/menu/menu.js.map +1 -1
  33. package/dist/components/modal/modal.js.map +1 -1
  34. package/dist/components/modal/modalContext.js.map +1 -1
  35. package/dist/components/pagination/pagination.js.map +1 -1
  36. package/dist/components/progress-bar/progress-bar.js.map +1 -1
  37. package/dist/components/qr-code/qr-code.js.map +1 -1
  38. package/dist/components/select/select.js.map +1 -1
  39. package/dist/components/select-zone/select-zone.js.map +1 -1
  40. package/dist/components/skeleton/skeleton.js.map +1 -1
  41. package/dist/components/slider/slider.js.map +1 -1
  42. package/dist/components/splitter/splitter.js.map +1 -1
  43. package/dist/components/steps/steps.js.map +1 -1
  44. package/dist/components/swap/swap.js.map +1 -1
  45. package/dist/components/switch/switch.js.map +1 -1
  46. package/dist/components/tab/tab.js.map +1 -1
  47. package/dist/components/table/table.js.map +1 -1
  48. package/dist/components/timeline/timeline.js.map +1 -1
  49. package/dist/components/toast/icons/ErrorIcon.js.map +1 -1
  50. package/dist/components/toast/icons/IconCircle.js.map +1 -1
  51. package/dist/components/toast/icons/InfoIcon.js.map +1 -1
  52. package/dist/components/toast/icons/LoaderIcon.js.map +1 -1
  53. package/dist/components/toast/icons/SuccessIcon.js.map +1 -1
  54. package/dist/components/toast/icons/WarningIcon.js.map +1 -1
  55. package/dist/components/toast/toast.js.map +1 -1
  56. package/dist/components/toast/toast.store.js.map +1 -1
  57. package/dist/components/tooltip/tooltip.js.map +1 -1
  58. package/dist/components/tour/tour.js.map +1 -1
  59. package/dist/components/upload/upload.js.map +1 -1
  60. package/dist/components/z-index/z-index.context.js.map +1 -1
  61. package/dist/components/z-index/z-index.js.map +1 -1
  62. package/dist/components/z-index/z-index.store.js.map +1 -1
  63. package/dist/components/z-index/z-index.types.js.map +1 -1
  64. package/dist/package.json +39 -0
  65. package/dist/utils/cn.js.map +1 -1
  66. package/dist/utils/element-tracker.js.map +1 -1
  67. package/dist/utils/helper.js.map +1 -1
  68. package/dist/utils/hoc.js.map +1 -1
  69. package/package.json +38 -32
@@ -1 +1 @@
1
- {"version":3,"file":"context-menu.store.js","names":[],"sources":["../../../src/components/context-menu/context-menu.store.ts"],"sourcesContent":["import { createSignal } from 'solid-js';\nimport type {\n ContextRecord,\n RegistryItem,\n RenderedItem,\n ContextMenuHandle,\n} from './context-menu.types';\n\ntype MenuState = {\n x: number;\n y: number;\n items: RenderedItem[];\n} | null;\n\nconst [menuState, setMenuState] = createSignal<MenuState>(null);\n\nexport const contextMenuStore = {\n menuState,\n close: () => setMenuState(null),\n isOpen: () => menuState() !== null,\n};\n\nexport function createContextMenuHandle<\n TContext extends ContextRecord,\n>(): ContextMenuHandle<TContext> {\n const registry = new Map<string, RegistryItem<TContext>>();\n\n function register(item: RegistryItem<TContext>): void {\n registry.set(item.key, item);\n }\n\n function unregister(key: string): void {\n registry.delete(key);\n }\n\n function buildRenderedItems(ctx: TContext): RenderedItem[] {\n const visible = [...registry.values()]\n .filter(item => !item.when || item.when(ctx))\n .sort((a, b) => (a.order ?? 100) - (b.order ?? 100));\n\n if (visible.length === 0) return [];\n\n const groups: RegistryItem<TContext>[][] = [];\n const groupMap = new Map<string, RegistryItem<TContext>[]>();\n\n for (const item of visible) {\n const g = item.group ?? '__default__';\n if (!groupMap.has(g)) {\n const arr: RegistryItem<TContext>[] = [];\n groupMap.set(g, arr);\n groups.push(arr);\n }\n groupMap.get(g)!.push(item);\n }\n\n const result: RenderedItem[] = [];\n for (let i = 0; i < groups.length; i++) {\n if (i > 0) result.push({ type: 'separator' });\n for (const item of groups[i]) {\n if (item.type === 'item') {\n result.push({\n type: 'item',\n key: item.key,\n label: item.label,\n disabled: item.disabled?.(ctx),\n shortcut: item.shortcut,\n prefixIcon: item.prefixIcon,\n onClick: () => item.onClick(ctx),\n });\n } else {\n result.push({\n type: 'submenu',\n key: item.key,\n label: item.label,\n disabled: item.disabled?.(ctx),\n shortcut: item.shortcut,\n prefixIcon: item.prefixIcon,\n\n items: item.items\n .filter(sub => !sub.when || sub.when(ctx))\n .map(sub => {\n if (sub.type === 'item') {\n return {\n type: 'item' as const,\n key: sub.key,\n label: sub.label,\n disabled: sub.disabled?.(ctx),\n shortcut: sub.shortcut,\n prefixIcon: sub.prefixIcon,\n onClick: () => sub.onClick(ctx),\n };\n }\n return { type: 'separator' as const };\n }),\n });\n }\n }\n }\n return result;\n }\n\n function trigger(e: MouseEvent, ctx: TContext): void {\n e.preventDefault();\n e.stopPropagation();\n const items = buildRenderedItems(ctx);\n if (items.length === 0) return;\n setMenuState({ x: e.clientX, y: e.clientY, items });\n }\n\n return { register, unregister, trigger };\n}\n"],"mappings":"wCAcA,GAAM,CAAC,EAAW,GAAgB,EAAwB,KAAK,CAElD,EAAmB,CAC9B,YACA,UAAa,EAAa,KAAK,CAC/B,WAAc,GAAW,GAAK,KAC/B,CAED,SAAgB,GAEiB,CAC/B,IAAM,EAAW,IAAI,IAErB,SAAS,EAAS,EAAoC,CACpD,EAAS,IAAI,EAAK,IAAK,EAAK,CAG9B,SAAS,EAAW,EAAmB,CACrC,EAAS,OAAO,EAAI,CAGtB,SAAS,EAAmB,EAA+B,CACzD,IAAM,EAAU,CAAC,GAAG,EAAS,QAAQ,CAAC,CACnC,OAAO,GAAQ,CAAC,EAAK,MAAQ,EAAK,KAAK,EAAI,CAAC,CAC5C,MAAM,EAAG,KAAO,EAAE,OAAS,MAAQ,EAAE,OAAS,KAAK,CAEtD,GAAI,EAAQ,SAAW,EAAG,MAAO,EAAE,CAEnC,IAAM,EAAqC,EAAE,CACvC,EAAW,IAAI,IAErB,IAAK,IAAM,KAAQ,EAAS,CAC1B,IAAM,EAAI,EAAK,OAAS,cACxB,GAAI,CAAC,EAAS,IAAI,EAAE,CAAE,CACpB,IAAM,EAAgC,EAAE,CACxC,EAAS,IAAI,EAAG,EAAI,CACpB,EAAO,KAAK,EAAI,CAElB,EAAS,IAAI,EAAE,CAAE,KAAK,EAAK,CAG7B,IAAM,EAAyB,EAAE,CACjC,IAAK,IAAI,EAAI,EAAG,EAAI,EAAO,OAAQ,IAAK,CAClC,EAAI,GAAG,EAAO,KAAK,CAAE,KAAM,YAAa,CAAC,CAC7C,IAAK,IAAM,KAAQ,EAAO,GACpB,EAAK,OAAS,OAChB,EAAO,KAAK,CACV,KAAM,OACN,IAAK,EAAK,IACV,MAAO,EAAK,MACZ,SAAU,EAAK,WAAW,EAAI,CAC9B,SAAU,EAAK,SACf,WAAY,EAAK,WACjB,YAAe,EAAK,QAAQ,EAAI,CACjC,CAAC,CAEF,EAAO,KAAK,CACV,KAAM,UACN,IAAK,EAAK,IACV,MAAO,EAAK,MACZ,SAAU,EAAK,WAAW,EAAI,CAC9B,SAAU,EAAK,SACf,WAAY,EAAK,WAEjB,MAAO,EAAK,MACT,OAAO,GAAO,CAAC,EAAI,MAAQ,EAAI,KAAK,EAAI,CAAC,CACzC,IAAI,GACC,EAAI,OAAS,OACR,CACL,KAAM,OACN,IAAK,EAAI,IACT,MAAO,EAAI,MACX,SAAU,EAAI,WAAW,EAAI,CAC7B,SAAU,EAAI,SACd,WAAY,EAAI,WAChB,YAAe,EAAI,QAAQ,EAAI,CAChC,CAEI,CAAE,KAAM,YAAsB,CACrC,CACL,CAAC,CAIR,OAAO,EAGT,SAAS,EAAQ,EAAe,EAAqB,CACnD,EAAE,gBAAgB,CAClB,EAAE,iBAAiB,CACnB,IAAM,EAAQ,EAAmB,EAAI,CACjC,EAAM,SAAW,GACrB,EAAa,CAAE,EAAG,EAAE,QAAS,EAAG,EAAE,QAAS,QAAO,CAAC,CAGrD,MAAO,CAAE,WAAU,aAAY,UAAS"}
1
+ {"version":3,"file":"context-menu.store.js","names":[],"sources":["../../../src/components/context-menu/context-menu.store.ts"],"sourcesContent":["import { createSignal } from 'solid-js';\r\nimport type {\r\n ContextRecord,\r\n RegistryItem,\r\n RenderedItem,\r\n ContextMenuHandle,\r\n} from './context-menu.types';\r\n\r\ntype MenuState = {\r\n x: number;\r\n y: number;\r\n items: RenderedItem[];\r\n} | null;\r\n\r\nconst [menuState, setMenuState] = createSignal<MenuState>(null);\r\n\r\nexport const contextMenuStore = {\r\n menuState,\r\n close: () => setMenuState(null),\r\n isOpen: () => menuState() !== null,\r\n};\r\n\r\nexport function createContextMenuHandle<\r\n TContext extends ContextRecord,\r\n>(): ContextMenuHandle<TContext> {\r\n const registry = new Map<string, RegistryItem<TContext>>();\r\n\r\n function register(item: RegistryItem<TContext>): void {\r\n registry.set(item.key, item);\r\n }\r\n\r\n function unregister(key: string): void {\r\n registry.delete(key);\r\n }\r\n\r\n function buildRenderedItems(ctx: TContext): RenderedItem[] {\r\n const visible = [...registry.values()]\r\n .filter(item => !item.when || item.when(ctx))\r\n .sort((a, b) => (a.order ?? 100) - (b.order ?? 100));\r\n\r\n if (visible.length === 0) return [];\r\n\r\n const groups: RegistryItem<TContext>[][] = [];\r\n const groupMap = new Map<string, RegistryItem<TContext>[]>();\r\n\r\n for (const item of visible) {\r\n const g = item.group ?? '__default__';\r\n if (!groupMap.has(g)) {\r\n const arr: RegistryItem<TContext>[] = [];\r\n groupMap.set(g, arr);\r\n groups.push(arr);\r\n }\r\n groupMap.get(g)!.push(item);\r\n }\r\n\r\n const result: RenderedItem[] = [];\r\n for (let i = 0; i < groups.length; i++) {\r\n if (i > 0) result.push({ type: 'separator' });\r\n for (const item of groups[i]) {\r\n if (item.type === 'item') {\r\n result.push({\r\n type: 'item',\r\n key: item.key,\r\n label: item.label,\r\n disabled: item.disabled?.(ctx),\r\n shortcut: item.shortcut,\r\n prefixIcon: item.prefixIcon,\r\n onClick: () => item.onClick(ctx),\r\n });\r\n } else {\r\n result.push({\r\n type: 'submenu',\r\n key: item.key,\r\n label: item.label,\r\n disabled: item.disabled?.(ctx),\r\n shortcut: item.shortcut,\r\n prefixIcon: item.prefixIcon,\r\n\r\n items: item.items\r\n .filter(sub => !sub.when || sub.when(ctx))\r\n .map(sub => {\r\n if (sub.type === 'item') {\r\n return {\r\n type: 'item' as const,\r\n key: sub.key,\r\n label: sub.label,\r\n disabled: sub.disabled?.(ctx),\r\n shortcut: sub.shortcut,\r\n prefixIcon: sub.prefixIcon,\r\n onClick: () => sub.onClick(ctx),\r\n };\r\n }\r\n return { type: 'separator' as const };\r\n }),\r\n });\r\n }\r\n }\r\n }\r\n return result;\r\n }\r\n\r\n function trigger(e: MouseEvent, ctx: TContext): void {\r\n e.preventDefault();\r\n e.stopPropagation();\r\n const items = buildRenderedItems(ctx);\r\n if (items.length === 0) return;\r\n setMenuState({ x: e.clientX, y: e.clientY, items });\r\n }\r\n\r\n return { register, unregister, trigger };\r\n}\r\n"],"mappings":"wCAcA,GAAM,CAAC,EAAW,GAAgB,EAAwB,KAAK,CAElD,EAAmB,CAC9B,YACA,UAAa,EAAa,KAAK,CAC/B,WAAc,GAAW,GAAK,KAC/B,CAED,SAAgB,GAEiB,CAC/B,IAAM,EAAW,IAAI,IAErB,SAAS,EAAS,EAAoC,CACpD,EAAS,IAAI,EAAK,IAAK,EAAK,CAG9B,SAAS,EAAW,EAAmB,CACrC,EAAS,OAAO,EAAI,CAGtB,SAAS,EAAmB,EAA+B,CACzD,IAAM,EAAU,CAAC,GAAG,EAAS,QAAQ,CAAC,CACnC,OAAO,GAAQ,CAAC,EAAK,MAAQ,EAAK,KAAK,EAAI,CAAC,CAC5C,MAAM,EAAG,KAAO,EAAE,OAAS,MAAQ,EAAE,OAAS,KAAK,CAEtD,GAAI,EAAQ,SAAW,EAAG,MAAO,EAAE,CAEnC,IAAM,EAAqC,EAAE,CACvC,EAAW,IAAI,IAErB,IAAK,IAAM,KAAQ,EAAS,CAC1B,IAAM,EAAI,EAAK,OAAS,cACxB,GAAI,CAAC,EAAS,IAAI,EAAE,CAAE,CACpB,IAAM,EAAgC,EAAE,CACxC,EAAS,IAAI,EAAG,EAAI,CACpB,EAAO,KAAK,EAAI,CAElB,EAAS,IAAI,EAAE,CAAE,KAAK,EAAK,CAG7B,IAAM,EAAyB,EAAE,CACjC,IAAK,IAAI,EAAI,EAAG,EAAI,EAAO,OAAQ,IAAK,CAClC,EAAI,GAAG,EAAO,KAAK,CAAE,KAAM,YAAa,CAAC,CAC7C,IAAK,IAAM,KAAQ,EAAO,GACpB,EAAK,OAAS,OAChB,EAAO,KAAK,CACV,KAAM,OACN,IAAK,EAAK,IACV,MAAO,EAAK,MACZ,SAAU,EAAK,WAAW,EAAI,CAC9B,SAAU,EAAK,SACf,WAAY,EAAK,WACjB,YAAe,EAAK,QAAQ,EAAI,CACjC,CAAC,CAEF,EAAO,KAAK,CACV,KAAM,UACN,IAAK,EAAK,IACV,MAAO,EAAK,MACZ,SAAU,EAAK,WAAW,EAAI,CAC9B,SAAU,EAAK,SACf,WAAY,EAAK,WAEjB,MAAO,EAAK,MACT,OAAO,GAAO,CAAC,EAAI,MAAQ,EAAI,KAAK,EAAI,CAAC,CACzC,IAAI,GACC,EAAI,OAAS,OACR,CACL,KAAM,OACN,IAAK,EAAI,IACT,MAAO,EAAI,MACX,SAAU,EAAI,WAAW,EAAI,CAC7B,SAAU,EAAI,SACd,WAAY,EAAI,WAChB,YAAe,EAAI,QAAQ,EAAI,CAChC,CAEI,CAAE,KAAM,YAAsB,CACrC,CACL,CAAC,CAIR,OAAO,EAGT,SAAS,EAAQ,EAAe,EAAqB,CACnD,EAAE,gBAAgB,CAClB,EAAE,iBAAiB,CACnB,IAAM,EAAQ,EAAmB,EAAI,CACjC,EAAM,SAAW,GACrB,EAAa,CAAE,EAAG,EAAE,QAAS,EAAG,EAAE,QAAS,QAAO,CAAC,CAGrD,MAAO,CAAE,WAAU,aAAY,UAAS"}
@@ -1 +1 @@
1
- {"version":3,"file":"divider.js","names":["cn","getColor","mergeProps","ParentComponent","Show","DividerProps","thicknessClass","Record","NonNullable","Divider","p","orientation","const","variant","align","thickness","color","isVertical","lineClass","class","line","_$createComponent","when","children","fallback","_el$5","_tmpl$2","_$effect","_p$","_v$6","_v$7","root","e","_$setAttribute","t","_$className","undefined","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_el$4","_$insert","_v$","_v$2","_v$3","_v$4","content","_v$5","a","o","i"],"sources":["../../../src/components/divider/divider.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\nimport { getColor } from '@utils/helper';\nimport { mergeProps, ParentComponent, Show } from 'solid-js';\nimport { DividerProps } from './divider.types';\n\nconst thicknessClass: Record<NonNullable<DividerProps['thickness']>, string> = {\n 1: 'border-px',\n 2: 'border-[2px]',\n 3: 'border-[3px]',\n 4: 'border-[4px]',\n};\n\nconst Divider: ParentComponent<DividerProps> = p => {\n p = mergeProps(\n {\n orientation: 'horizontal' as const,\n variant: 'solid' as const,\n align: 'center' as const,\n thickness: 1 as const,\n color: 'secondary' as const,\n },\n p,\n );\n\n const isVertical = () => p.orientation === 'vertical';\n\n const lineClass = () =>\n cn(\n p.color ? 'divi3' : 'divi4',\n isVertical() ? 'border-l' : 'border-t',\n thicknessClass[p.thickness!],\n p.variant === 'dashed' && 'border-dashed',\n p.variant === 'dotted' && 'border-dotted',\n p.class?.line,\n );\n\n return (\n <Show\n when={!!p.children}\n fallback={\n <hr\n role=\"separator\"\n aria-orientation={p.orientation}\n class={cn(\n 'divi1',\n p.color ? 'divi3' : 'divi4',\n isVertical() ? 'h-auto self-stretch border-l' : 'w-full border-t',\n thicknessClass[p.thickness!],\n p.variant === 'dashed' && 'border-dashed',\n p.variant === 'dotted' && 'border-dotted',\n getColor(p.color),\n p.class?.root,\n )}\n />\n }\n >\n <div\n role=\"separator\"\n aria-orientation={p.orientation}\n class={cn(\n 'divi2',\n isVertical() ? 'flex-col self-stretch' : 'w-full flex-row',\n getColor(p.color),\n p.class?.root,\n )}\n >\n <div\n class={cn(lineClass(), p.align === 'center' || p.align === 'end' ? 'flex-1' : 'w-4')}\n />\n\n <span\n class={cn(\n 'divi5',\n p.color ? 'divi6' : 'divi7',\n isVertical() ? 'py-3' : 'px-3',\n p.class?.content,\n )}\n >\n {p.children}\n </span>\n\n <div\n class={cn(lineClass(), p.align === 'center' || p.align === 'start' ? 'flex-1' : 'w-4')}\n />\n </div>\n </Show>\n );\n};\n\nexport { Divider };\n"],"mappings":"sVAKMM,EAAyE,CAC7E,EAAG,YACH,EAAG,eACH,EAAG,eACH,EAAG,eACJ,CAEKG,EAAyCC,GAAK,CAClDA,EAAIR,EACF,CACES,YAAa,aACbE,QAAS,QACTC,MAAO,SACPC,UAAW,EACXC,MAAO,YACR,CACDN,EACD,CAED,IAAMO,MAAmBP,EAAEC,cAAgB,WAErCO,MACJlB,EACEU,EAAEM,MAAQ,QAAU,QACpBC,GAAY,CAAG,WAAa,WAC5BX,EAAeI,EAAEK,WACjBL,EAAEG,UAAY,UAAY,gBAC1BH,EAAEG,UAAY,UAAY,gBAC1BH,EAAES,OAAOC,KACV,CAEH,OAAAC,EACGjB,EAAI,CAAA,IACHkB,MAAI,CAAA,MAAE,CAAC,CAACZ,EAAEa,UAAQ,IAClBC,UAAQ,CAAA,WAAA,CAAA,IAAAC,EAAAC,GAAA,CAaH,OAbGC,EAAAC,GAAA,CAAA,IAAAC,EAGcnB,EAAEC,YAAWmB,EACxB9B,EACL,QACAU,EAAEM,MAAQ,QAAU,QACpBC,GAAY,CAAG,+BAAiC,kBAChDX,EAAeI,EAAEK,WACjBL,EAAEG,UAAY,UAAY,gBAC1BH,EAAEG,UAAY,UAAY,gBAC1BZ,EAASS,EAAEM,MAAM,CACjBN,EAAES,OAAOY,KACV,CAAA,OAAAF,IAAAD,EAAAI,GAAAC,EAAAR,EAAA,mBAAAG,EAAAI,EAAAH,EAAA,CAAAC,IAAAF,EAAAM,GAAAC,EAAAV,EAAAG,EAAAM,EAAAJ,EAAA,CAAAF,GAAA,CAAAI,EAAAI,IAAAA,GAAAF,EAAAE,IAAAA,GAAA,CAAA,CAAAX,KAAA,EAAA,IAAAF,UAAA,CAAA,IAAAc,EAAAC,GAAA,CAAAC,EAAAF,EAAAG,WAAAC,EAAAF,EAAAG,YAAAC,EAAAF,EAAAC,YA8BqF,OA9BrFE,EAAAH,MA0BA/B,EAAEa,SAAQ,CAAAI,EAAAC,GAAA,CAAA,IAAAiB,EApBKnC,EAAEC,YAAWmC,EACxB9C,EACL,QACAiB,GAAY,CAAG,wBAA0B,kBACzChB,EAASS,EAAEM,MAAM,CACjBN,EAAES,OAAOY,KACV,CAAAgB,EAGQ/C,EAAGkB,GAAW,CAAER,EAAEI,QAAU,UAAYJ,EAAEI,QAAU,MAAQ,SAAW,MAAM,CAAAkC,EAI7EhD,EACL,QACAU,EAAEM,MAAQ,QAAU,QACpBC,GAAY,CAAG,OAAS,OACxBP,EAAES,OAAO8B,QACV,CAAAC,EAMMlD,EAAGkB,GAAW,CAAER,EAAEI,QAAU,UAAYJ,EAAEI,QAAU,QAAU,SAAW,MAAM,CAAA,OAAA+B,IAAAjB,EAAAI,GAAAC,EAAAI,EAAA,mBAAAT,EAAAI,EAAAa,EAAA,CAAAC,IAAAlB,EAAAM,GAAAC,EAAAE,EAAAT,EAAAM,EAAAY,EAAA,CAAAC,IAAAnB,EAAAuB,GAAAhB,EAAAI,EAAAX,EAAAuB,EAAAJ,EAAA,CAAAC,IAAApB,EAAAwB,GAAAjB,EAAAM,EAAAb,EAAAwB,EAAAJ,EAAA,CAAAE,IAAAtB,EAAAyB,GAAAlB,EAAAQ,EAAAf,EAAAyB,EAAAH,EAAA,CAAAtB,GAAA,CAAAI,EAAAI,IAAAA,GAAAF,EAAAE,IAAAA,GAAAe,EAAAf,IAAAA,GAAAgB,EAAAhB,IAAAA,GAAAiB,EAAAjB,IAAAA,GAAA,CAAA,CAAAC,GAAA,CAAA"}
1
+ {"version":3,"file":"divider.js","names":["cn","getColor","mergeProps","ParentComponent","Show","DividerProps","thicknessClass","Record","NonNullable","Divider","p","orientation","const","variant","align","thickness","color","isVertical","lineClass","class","line","_$createComponent","when","children","fallback","_el$5","_tmpl$2","_$effect","_p$","_v$6","_v$7","root","e","_$setAttribute","t","_$className","undefined","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_el$4","_$insert","_v$","_v$2","_v$3","_v$4","content","_v$5","a","o","i"],"sources":["../../../src/components/divider/divider.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport { getColor } from '@utils/helper';\r\nimport { mergeProps, ParentComponent, Show } from 'solid-js';\r\nimport { DividerProps } from './divider.types';\r\n\r\nconst thicknessClass: Record<NonNullable<DividerProps['thickness']>, string> = {\r\n 1: 'border-px',\r\n 2: 'border-[2px]',\r\n 3: 'border-[3px]',\r\n 4: 'border-[4px]',\r\n};\r\n\r\nconst Divider: ParentComponent<DividerProps> = p => {\r\n p = mergeProps(\r\n {\r\n orientation: 'horizontal' as const,\r\n variant: 'solid' as const,\r\n align: 'center' as const,\r\n thickness: 1 as const,\r\n color: 'secondary' as const,\r\n },\r\n p,\r\n );\r\n\r\n const isVertical = () => p.orientation === 'vertical';\r\n\r\n const lineClass = () =>\r\n cn(\r\n p.color ? 'divi3' : 'divi4',\r\n isVertical() ? 'border-l' : 'border-t',\r\n thicknessClass[p.thickness!],\r\n p.variant === 'dashed' && 'border-dashed',\r\n p.variant === 'dotted' && 'border-dotted',\r\n p.class?.line,\r\n );\r\n\r\n return (\r\n <Show\r\n when={!!p.children}\r\n fallback={\r\n <hr\r\n role=\"separator\"\r\n aria-orientation={p.orientation}\r\n class={cn(\r\n 'divi1',\r\n p.color ? 'divi3' : 'divi4',\r\n isVertical() ? 'h-auto self-stretch border-l' : 'w-full border-t',\r\n thicknessClass[p.thickness!],\r\n p.variant === 'dashed' && 'border-dashed',\r\n p.variant === 'dotted' && 'border-dotted',\r\n getColor(p.color),\r\n p.class?.root,\r\n )}\r\n />\r\n }\r\n >\r\n <div\r\n role=\"separator\"\r\n aria-orientation={p.orientation}\r\n class={cn(\r\n 'divi2',\r\n isVertical() ? 'flex-col self-stretch' : 'w-full flex-row',\r\n getColor(p.color),\r\n p.class?.root,\r\n )}\r\n >\r\n <div\r\n class={cn(lineClass(), p.align === 'center' || p.align === 'end' ? 'flex-1' : 'w-4')}\r\n />\r\n\r\n <span\r\n class={cn(\r\n 'divi5',\r\n p.color ? 'divi6' : 'divi7',\r\n isVertical() ? 'py-3' : 'px-3',\r\n p.class?.content,\r\n )}\r\n >\r\n {p.children}\r\n </span>\r\n\r\n <div\r\n class={cn(lineClass(), p.align === 'center' || p.align === 'start' ? 'flex-1' : 'w-4')}\r\n />\r\n </div>\r\n </Show>\r\n );\r\n};\r\n\r\nexport { Divider };\r\n"],"mappings":"sVAKMM,EAAyE,CAC7E,EAAG,YACH,EAAG,eACH,EAAG,eACH,EAAG,eACJ,CAEKG,EAAyCC,GAAK,CAClDA,EAAIR,EACF,CACES,YAAa,aACbE,QAAS,QACTC,MAAO,SACPC,UAAW,EACXC,MAAO,YACR,CACDN,EACD,CAED,IAAMO,MAAmBP,EAAEC,cAAgB,WAErCO,MACJlB,EACEU,EAAEM,MAAQ,QAAU,QACpBC,GAAY,CAAG,WAAa,WAC5BX,EAAeI,EAAEK,WACjBL,EAAEG,UAAY,UAAY,gBAC1BH,EAAEG,UAAY,UAAY,gBAC1BH,EAAES,OAAOC,KACV,CAEH,OAAAC,EACGjB,EAAI,CAAA,IACHkB,MAAI,CAAA,MAAE,CAAC,CAACZ,EAAEa,UAAQ,IAClBC,UAAQ,CAAA,WAAA,CAAA,IAAAC,EAAAC,GAAA,CAaH,OAbGC,EAAAC,GAAA,CAAA,IAAAC,EAGcnB,EAAEC,YAAWmB,EACxB9B,EACL,QACAU,EAAEM,MAAQ,QAAU,QACpBC,GAAY,CAAG,+BAAiC,kBAChDX,EAAeI,EAAEK,WACjBL,EAAEG,UAAY,UAAY,gBAC1BH,EAAEG,UAAY,UAAY,gBAC1BZ,EAASS,EAAEM,MAAM,CACjBN,EAAES,OAAOY,KACV,CAAA,OAAAF,IAAAD,EAAAI,GAAAC,EAAAR,EAAA,mBAAAG,EAAAI,EAAAH,EAAA,CAAAC,IAAAF,EAAAM,GAAAC,EAAAV,EAAAG,EAAAM,EAAAJ,EAAA,CAAAF,GAAA,CAAAI,EAAAI,IAAAA,GAAAF,EAAAE,IAAAA,GAAA,CAAA,CAAAX,KAAA,EAAA,IAAAF,UAAA,CAAA,IAAAc,EAAAC,GAAA,CAAAC,EAAAF,EAAAG,WAAAC,EAAAF,EAAAG,YAAAC,EAAAF,EAAAC,YA8BqF,OA9BrFE,EAAAH,MA0BA/B,EAAEa,SAAQ,CAAAI,EAAAC,GAAA,CAAA,IAAAiB,EApBKnC,EAAEC,YAAWmC,EACxB9C,EACL,QACAiB,GAAY,CAAG,wBAA0B,kBACzChB,EAASS,EAAEM,MAAM,CACjBN,EAAES,OAAOY,KACV,CAAAgB,EAGQ/C,EAAGkB,GAAW,CAAER,EAAEI,QAAU,UAAYJ,EAAEI,QAAU,MAAQ,SAAW,MAAM,CAAAkC,EAI7EhD,EACL,QACAU,EAAEM,MAAQ,QAAU,QACpBC,GAAY,CAAG,OAAS,OACxBP,EAAES,OAAO8B,QACV,CAAAC,EAMMlD,EAAGkB,GAAW,CAAER,EAAEI,QAAU,UAAYJ,EAAEI,QAAU,QAAU,SAAW,MAAM,CAAA,OAAA+B,IAAAjB,EAAAI,GAAAC,EAAAI,EAAA,mBAAAT,EAAAI,EAAAa,EAAA,CAAAC,IAAAlB,EAAAM,GAAAC,EAAAE,EAAAT,EAAAM,EAAAY,EAAA,CAAAC,IAAAnB,EAAAuB,GAAAhB,EAAAI,EAAAX,EAAAuB,EAAAJ,EAAA,CAAAC,IAAApB,EAAAwB,GAAAjB,EAAAM,EAAAb,EAAAwB,EAAAJ,EAAA,CAAAE,IAAAtB,EAAAyB,GAAAlB,EAAAQ,EAAAf,EAAAyB,EAAAH,EAAA,CAAAtB,GAAA,CAAAI,EAAAI,IAAAA,GAAAF,EAAAE,IAAAA,GAAAe,EAAAf,IAAAA,GAAAgB,EAAAhB,IAAAA,GAAAiB,EAAAjB,IAAAA,GAAA,CAAA,CAAAC,GAAA,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown.js","names":["cn","trackElement","untrackElement","ZIndex","ZIndexType","cva","VariantProps","createContext","createEffect","createSignal","createUniqueId","mergeProps","onCleanup","ParentComponent","useContext","dropdownStore","DropdownProps","CloseAllContext","variants","position","top","bottom","left","right","align","start","center","end","DropdownVariantsProps","TriggerRect","width","height","Dropdown","props","p","const","blockScroll","closeAll","parentCloseAll","shouldCloseAll","id","isControlled","open","undefined","triggerRef","HTMLDivElement","rect","setRect","captureRect","r","getBoundingClientRect","isOpen","trackTrigger","untrackTrigger","handleControlledOpen","close","closeDropdownOnUnmount","toggle","anchorStyle","Record","_el$","_tmpl$","_$addEventListener","_$use","el","ref","_$insert","triggerElement","Element","_$effect","_$className","class","trigger","_$createComponent","type","DROPDOWN","customValue","zIndex","children","_$memo","_el$4","_tmpl$3","$$click","_el$2","_tmpl$2","_el$3","firstChild","Provider","value","_p$","_v$","anchor","_v$2","_v$3","_v$4","_v$5","content","e","t","_$setAttribute","a","o","_$style","i","_$delegateEvents"],"sources":["../../../src/components/dropdown/dropdown.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\nimport { trackElement, untrackElement } from '@/utils/element-tracker';\nimport { ZIndex, ZIndexType } from '@components/z-index';\nimport { cva, VariantProps } from 'class-variance-authority';\nimport {\n createContext,\n createEffect,\n createSignal,\n createUniqueId,\n mergeProps,\n onCleanup,\n ParentComponent,\n useContext,\n} from 'solid-js';\nimport { dropdownStore } from './dropdown.store';\nimport { DropdownProps } from './dropdown.types';\n\n/** Context truyền `closeAll` từ dropdown root xuống tất cả dropdown con */\nconst CloseAllContext = createContext(false);\n\nconst variants = cva('', {\n variants: {\n position: {\n top: 'dropdown-top',\n bottom: 'dropdown-bottom',\n left: 'dropdown-left',\n right: 'dropdown-right',\n },\n align: {\n start: 'dropdown-start',\n center: 'dropdown-center',\n end: 'dropdown-end',\n },\n },\n});\nexport type DropdownVariantsProps = VariantProps<typeof variants>;\n\ntype TriggerRect = {\n top: number;\n left: number;\n width: number;\n height: number;\n};\n\nexport const Dropdown: ParentComponent<DropdownProps> = props => {\n const p = mergeProps(\n {\n position: 'bottom' as const,\n align: 'start' as const,\n blockScroll: true,\n closeAll: false,\n },\n props,\n );\n\n // Kế thừa closeAll từ dropdown cha nếu có\n const parentCloseAll = useContext(CloseAllContext);\n const shouldCloseAll = () => p.closeAll || parentCloseAll;\n\n const id = createUniqueId();\n const isControlled = () => p.open !== undefined;\n\n let triggerRef!: HTMLDivElement;\n const [rect, setRect] = createSignal<TriggerRect | null>(null);\n\n const captureRect = () => {\n const r = triggerRef.getBoundingClientRect();\n setRect({ top: r.top, left: r.left, width: r.width, height: r.height });\n };\n\n const isOpen = () => {\n if (isControlled()) return !!p.open;\n return dropdownStore.isOpen(id);\n };\n\n createEffect(function trackTrigger() {\n if (!isOpen()) {\n untrackElement(triggerRef);\n return;\n }\n trackElement(triggerRef, r => setRect(r));\n onCleanup(function untrackTrigger() {\n untrackElement(triggerRef);\n });\n });\n\n createEffect(function handleControlledOpen() {\n if (!isControlled()) return;\n if (p.open) {\n captureRect();\n dropdownStore.open(id);\n } else {\n dropdownStore.close(id);\n }\n });\n\n onCleanup(function closeDropdownOnUnmount() {\n dropdownStore.close(id);\n untrackElement(triggerRef);\n });\n\n const toggle = () => {\n if (dropdownStore.isOpen(id)) {\n dropdownStore.close(id);\n } else {\n captureRect();\n dropdownStore.open(id);\n }\n };\n\n const close = () => (shouldCloseAll() ? dropdownStore.closeAll() : dropdownStore.close(id));\n\n const anchorStyle = () => {\n const r = rect();\n if (!r) return {};\n return {\n '--nd-t': `${r.top}px`,\n '--nd-l': `${r.left}px`,\n '--nd-w': `${r.width}px`,\n '--nd-h': `${r.height}px`,\n } as Record<string, string>;\n };\n return (\n <>\n <div\n ref={el => {\n triggerRef = el;\n const ref = p.ref;\n if (typeof ref === 'function') ref(el);\n }}\n class={cn('dp01', p.class?.trigger)}\n onClick={isControlled() ? undefined : toggle}\n >\n {p.triggerElement as Element}\n </div>\n\n <ZIndex\n open={isOpen()}\n type={ZIndexType.DROPDOWN}\n blockScroll={p.blockScroll}\n class={cn('inset-0', parentCloseAll && 'pointer-events-none')}\n customValue={p.zIndex}\n >\n {!parentCloseAll && <div class=\"dp02\" onClick={close} />}\n\n <div\n class={cn('dp03', p.class?.anchor)}\n data-pos={p.position}\n data-align={p.align}\n style={anchorStyle()}\n >\n <div class={cn('dp04', p.class?.content)}>\n <CloseAllContext.Provider value={shouldCloseAll()}>\n {p.children}\n </CloseAllContext.Provider>\n </div>\n </div>\n </ZIndex>\n </>\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"dropdown.js","names":["cn","trackElement","untrackElement","ZIndex","ZIndexType","cva","VariantProps","createContext","createEffect","createSignal","createUniqueId","mergeProps","onCleanup","ParentComponent","useContext","dropdownStore","DropdownProps","CloseAllContext","variants","position","top","bottom","left","right","align","start","center","end","DropdownVariantsProps","TriggerRect","width","height","Dropdown","props","p","const","blockScroll","closeAll","parentCloseAll","shouldCloseAll","id","isControlled","open","undefined","triggerRef","HTMLDivElement","rect","setRect","captureRect","r","getBoundingClientRect","isOpen","trackTrigger","untrackTrigger","handleControlledOpen","close","closeDropdownOnUnmount","toggle","anchorStyle","Record","_el$","_tmpl$","_$addEventListener","_$use","el","ref","_$insert","triggerElement","Element","_$effect","_$className","class","trigger","_$createComponent","type","DROPDOWN","customValue","zIndex","children","_$memo","_el$4","_tmpl$3","$$click","_el$2","_tmpl$2","_el$3","firstChild","Provider","value","_p$","_v$","anchor","_v$2","_v$3","_v$4","_v$5","content","e","t","_$setAttribute","a","o","_$style","i","_$delegateEvents"],"sources":["../../../src/components/dropdown/dropdown.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport { trackElement, untrackElement } from '@/utils/element-tracker';\r\nimport { ZIndex, ZIndexType } from '@components/z-index';\r\nimport { cva, VariantProps } from 'class-variance-authority';\r\nimport {\r\n createContext,\r\n createEffect,\r\n createSignal,\r\n createUniqueId,\r\n mergeProps,\r\n onCleanup,\r\n ParentComponent,\r\n useContext,\r\n} from 'solid-js';\r\nimport { dropdownStore } from './dropdown.store';\r\nimport { DropdownProps } from './dropdown.types';\r\n\r\n/** Context truyền `closeAll` từ dropdown root xuống tất cả dropdown con */\r\nconst CloseAllContext = createContext(false);\r\n\r\nconst variants = cva('', {\r\n variants: {\r\n position: {\r\n top: 'dropdown-top',\r\n bottom: 'dropdown-bottom',\r\n left: 'dropdown-left',\r\n right: 'dropdown-right',\r\n },\r\n align: {\r\n start: 'dropdown-start',\r\n center: 'dropdown-center',\r\n end: 'dropdown-end',\r\n },\r\n },\r\n});\r\nexport type DropdownVariantsProps = VariantProps<typeof variants>;\r\n\r\ntype TriggerRect = {\r\n top: number;\r\n left: number;\r\n width: number;\r\n height: number;\r\n};\r\n\r\nexport const Dropdown: ParentComponent<DropdownProps> = props => {\r\n const p = mergeProps(\r\n {\r\n position: 'bottom' as const,\r\n align: 'start' as const,\r\n blockScroll: true,\r\n closeAll: false,\r\n },\r\n props,\r\n );\r\n\r\n // Kế thừa closeAll từ dropdown cha nếu có\r\n const parentCloseAll = useContext(CloseAllContext);\r\n const shouldCloseAll = () => p.closeAll || parentCloseAll;\r\n\r\n const id = createUniqueId();\r\n const isControlled = () => p.open !== undefined;\r\n\r\n let triggerRef!: HTMLDivElement;\r\n const [rect, setRect] = createSignal<TriggerRect | null>(null);\r\n\r\n const captureRect = () => {\r\n const r = triggerRef.getBoundingClientRect();\r\n setRect({ top: r.top, left: r.left, width: r.width, height: r.height });\r\n };\r\n\r\n const isOpen = () => {\r\n if (isControlled()) return !!p.open;\r\n return dropdownStore.isOpen(id);\r\n };\r\n\r\n createEffect(function trackTrigger() {\r\n if (!isOpen()) {\r\n untrackElement(triggerRef);\r\n return;\r\n }\r\n trackElement(triggerRef, r => setRect(r));\r\n onCleanup(function untrackTrigger() {\r\n untrackElement(triggerRef);\r\n });\r\n });\r\n\r\n createEffect(function handleControlledOpen() {\r\n if (!isControlled()) return;\r\n if (p.open) {\r\n captureRect();\r\n dropdownStore.open(id);\r\n } else {\r\n dropdownStore.close(id);\r\n }\r\n });\r\n\r\n onCleanup(function closeDropdownOnUnmount() {\r\n dropdownStore.close(id);\r\n untrackElement(triggerRef);\r\n });\r\n\r\n const toggle = () => {\r\n if (dropdownStore.isOpen(id)) {\r\n dropdownStore.close(id);\r\n } else {\r\n captureRect();\r\n dropdownStore.open(id);\r\n }\r\n };\r\n\r\n const close = () => (shouldCloseAll() ? dropdownStore.closeAll() : dropdownStore.close(id));\r\n\r\n const anchorStyle = () => {\r\n const r = rect();\r\n if (!r) return {};\r\n return {\r\n '--nd-t': `${r.top}px`,\r\n '--nd-l': `${r.left}px`,\r\n '--nd-w': `${r.width}px`,\r\n '--nd-h': `${r.height}px`,\r\n } as Record<string, string>;\r\n };\r\n return (\r\n <>\r\n <div\r\n ref={el => {\r\n triggerRef = el;\r\n const ref = p.ref;\r\n if (typeof ref === 'function') ref(el);\r\n }}\r\n class={cn('dp01', p.class?.trigger)}\r\n onClick={isControlled() ? undefined : toggle}\r\n >\r\n {p.triggerElement as Element}\r\n </div>\r\n\r\n <ZIndex\r\n open={isOpen()}\r\n type={ZIndexType.DROPDOWN}\r\n blockScroll={p.blockScroll}\r\n class={cn('inset-0', parentCloseAll && 'pointer-events-none')}\r\n customValue={p.zIndex}\r\n >\r\n {!parentCloseAll && <div class=\"dp02\" onClick={close} />}\r\n\r\n <div\r\n class={cn('dp03', p.class?.anchor)}\r\n data-pos={p.position}\r\n data-align={p.align}\r\n style={anchorStyle()}\r\n >\r\n <div class={cn('dp04', p.class?.content)}>\r\n <CloseAllContext.Provider value={shouldCloseAll()}>\r\n {p.children}\r\n </CloseAllContext.Provider>\r\n </div>\r\n </div>\r\n </ZIndex>\r\n </>\r\n );\r\n};\r\n"],"mappings":"6sBAkBMiB,EAAkBV,EAAc,GAAM,CAE3BF,EAAI,GAAI,CACvBa,SAAU,CACRC,SAAU,CACRC,IAAK,eACLC,OAAQ,kBACRC,KAAM,gBACNC,MAAO,iBACR,CACDC,MAAO,CACLC,MAAO,iBACPC,OAAQ,kBACRC,IAAK,eACP,CACF,CACD,CAAC,CAUF,IAAaK,EAA2CC,GAAS,CAC/D,IAAMC,EAAIvB,EACR,CACEQ,SAAU,SACVK,MAAO,QACPY,YAAa,GACbC,SAAU,GACX,CACDJ,EACD,CAGKK,EAAiBxB,EAAWG,EAAgB,CAC5CsB,MAAuBL,EAAEG,UAAYC,EAErCE,EAAK9B,GAAgB,CACrB+B,MAAqBP,EAAEQ,OAASC,IAAAA,GAElCC,EACE,CAACE,EAAMC,GAAWtC,EAAiC,KAAK,CAExDuC,MAAoB,CACxB,IAAMC,EAAIL,EAAWM,uBAAuB,CAC5CH,EAAQ,CAAE3B,IAAK6B,EAAE7B,IAAKE,KAAM2B,EAAE3B,KAAMQ,MAAOmB,EAAEnB,MAAOC,OAAQkB,EAAElB,OAAQ,CAAC,EAGnEoB,MACAV,GAAc,CAAS,CAAC,CAACP,EAAEQ,KACxB3B,EAAcoC,OAAOX,EAAG,CAGjChC,EAAa,UAAwB,CACnC,GAAI,CAAC2C,GAAQ,CAAE,CACbjD,EAAe0C,EAAW,CAC1B,OAEF3C,EAAa2C,EAAYK,GAAKF,EAAQE,EAAE,CAAC,CACzCrC,EAAU,UAA0B,CAClCV,EAAe0C,EAAW,EAC1B,EACF,CAEFpC,EAAa,UAAgC,CACtCiC,GAAc,GACfP,EAAEQ,MACJM,GAAa,CACbjC,EAAc2B,KAAKF,EAAG,EAEtBzB,EAAcwC,MAAMf,EAAG,GAEzB,CAEF5B,EAAU,UAAkC,CAC1CG,EAAcwC,MAAMf,EAAG,CACvBtC,EAAe0C,EAAW,EAC1B,CAEF,IAAMa,MAAe,CACf1C,EAAcoC,OAAOX,EAAG,CAC1BzB,EAAcwC,MAAMf,EAAG,EAEvBQ,GAAa,CACbjC,EAAc2B,KAAKF,EAAG,GAIpBe,MAAehB,GAAgB,CAAGxB,EAAcsB,UAAU,CAAGtB,EAAcwC,MAAMf,EAAI,CAErFkB,MAAoB,CACxB,IAAMT,EAAIH,GAAM,CAEhB,OADKG,EACE,CACL,SAAU,GAAGA,EAAE7B,IAAG,IAClB,SAAU,GAAG6B,EAAE3B,KAAI,IACnB,SAAU,GAAG2B,EAAEnB,MAAK,IACpB,SAAU,GAAGmB,EAAElB,OAAM,IACtB,CANc,EAAE,EAQnB,MAAA,MAAA,CAAA,IAAA6B,EAAAC,GAAA,CAQyC,OARzCC,EAAAF,EAAA,QASenB,GAAc,CAAGE,IAAAA,GAAYc,EAAM,GAAA,CAAAM,EANvCC,GAAM,CACTpB,EAAaoB,EACb,IAAMC,EAAM/B,EAAE+B,IACV,OAAOA,GAAQ,YAAYA,EAAID,EAAG,EACvCJ,EAAA,CAAAM,EAAAN,MAIA1B,EAAEiC,eAAyB,CAAAE,MAAAC,EAAAV,EAHrB5D,EAAG,OAAQkC,EAAEqC,OAAOC,QAAQ,CAAA,CAAA,CAAAZ,KAAA,CAAAa,EAMpCtE,EAAM,CAAA,IACLuC,MAAI,CAAA,OAAES,GAAQ,EAAA,IACduB,MAAI,CAAA,OAAEtE,EAAWuE,UAAQ,IACzBvC,aAAW,CAAA,OAAEF,EAAEE,aAAW,IAAA,OAAA,CAAA,OACnBpC,EAAG,UAAWsC,GAAkB,sBAAsB,EAAA,IAC7DsC,aAAW,CAAA,OAAE1C,EAAE2C,QAAM,IAAAC,UAAA,CAAA,MAAA,CAAAC,MAEpB,CAACzC,QAAc,CAAA,IAAA0C,EAAAC,GAAA,CAAoC,MAApCD,GAAAE,QAA+B3B,EAAKyB,KAAI,CAAA,MAAA,CAAA,IAAAG,EAAAC,GAAA,CAAAC,EAAAF,EAAAG,WAQd,OARcpB,EAAAmB,EAAAZ,EASnDxD,EAAgBsE,SAAQ,CAAA,IAACC,OAAK,CAAA,OAAEjD,GAAgB,EAAA,IAAAuC,UAAA,CAAA,OAC9C5C,EAAE4C,UAAQ,CAAA,CAAA,CAAAT,EAAAoB,GAAA,CAAA,IAAAC,EAPR1F,EAAG,OAAQkC,EAAEqC,OAAOoB,OAAO,CAAAC,EACxB1D,EAAEf,SAAQ0E,EACR3D,EAAEV,MAAKsE,EACZpC,GAAa,CAAAqC,EAER/F,EAAG,OAAQkC,EAAEqC,OAAOyB,QAAQ,CAAA,OAAAN,IAAAD,EAAAQ,GAAA3B,EAAAa,EAAAM,EAAAQ,EAAAP,EAAA,CAAAE,IAAAH,EAAAS,GAAAC,EAAAhB,EAAA,WAAAM,EAAAS,EAAAN,EAAA,CAAAC,IAAAJ,EAAAW,GAAAD,EAAAhB,EAAA,aAAAM,EAAAW,EAAAP,EAAA,CAAAJ,EAAAY,EAAAC,EAAAnB,EAAAW,EAAAL,EAAAY,EAAA,CAAAN,IAAAN,EAAAc,GAAAjC,EAAAe,EAAAI,EAAAc,EAAAR,EAAA,CAAAN,GAAA,CAAAQ,EAAAtD,IAAAA,GAAAuD,EAAAvD,IAAAA,GAAAyD,EAAAzD,IAAAA,GAAA0D,EAAA1D,IAAAA,GAAA4D,EAAA5D,IAAAA,GAAA,CAAA,CAAAwC,KAAA,CAAA,EAAA,CAAA,CAAA,EAShDqB,EAAA,CAAA,QAAA,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown.store.js","names":[],"sources":["../../../src/components/dropdown/dropdown.store.ts"],"sourcesContent":["import { createSignal } from 'solid-js';\n\nconst [openIds, setOpenIds] = createSignal<ReadonlySet<string>>(new Set(), { equals: false });\n\nexport const dropdownStore = {\n openIds,\n open: (id: string) =>\n setOpenIds(prev => {\n if (prev.has(id)) return prev;\n const next = new Set(prev);\n next.add(id);\n return next;\n }),\n close: (id: string) =>\n setOpenIds(prev => {\n if (!prev.has(id)) return prev;\n const next = new Set(prev);\n next.delete(id);\n return next;\n }),\n closeAll: () => setOpenIds(new Set<string>()),\n isOpen: (id: string) => openIds().has(id),\n};\n"],"mappings":"wCAEA,GAAM,CAAC,EAAS,GAAc,EAAkC,IAAI,IAAO,CAAE,OAAQ,GAAO,CAAC,CAEhF,EAAgB,CAC3B,UACA,KAAO,GACL,EAAW,GAAQ,CACjB,GAAI,EAAK,IAAI,EAAG,CAAE,OAAO,EACzB,IAAM,EAAO,IAAI,IAAI,EAAK,CAE1B,OADA,EAAK,IAAI,EAAG,CACL,GACP,CACJ,MAAQ,GACN,EAAW,GAAQ,CACjB,GAAI,CAAC,EAAK,IAAI,EAAG,CAAE,OAAO,EAC1B,IAAM,EAAO,IAAI,IAAI,EAAK,CAE1B,OADA,EAAK,OAAO,EAAG,CACR,GACP,CACJ,aAAgB,EAAW,IAAI,IAAc,CAC7C,OAAS,GAAe,GAAS,CAAC,IAAI,EAAG,CAC1C"}
1
+ {"version":3,"file":"dropdown.store.js","names":[],"sources":["../../../src/components/dropdown/dropdown.store.ts"],"sourcesContent":["import { createSignal } from 'solid-js';\r\n\r\nconst [openIds, setOpenIds] = createSignal<ReadonlySet<string>>(new Set(), { equals: false });\r\n\r\nexport const dropdownStore = {\r\n openIds,\r\n open: (id: string) =>\r\n setOpenIds(prev => {\r\n if (prev.has(id)) return prev;\r\n const next = new Set(prev);\r\n next.add(id);\r\n return next;\r\n }),\r\n close: (id: string) =>\r\n setOpenIds(prev => {\r\n if (!prev.has(id)) return prev;\r\n const next = new Set(prev);\r\n next.delete(id);\r\n return next;\r\n }),\r\n closeAll: () => setOpenIds(new Set<string>()),\r\n isOpen: (id: string) => openIds().has(id),\r\n};\r\n"],"mappings":"wCAEA,GAAM,CAAC,EAAS,GAAc,EAAkC,IAAI,IAAO,CAAE,OAAQ,GAAO,CAAC,CAEhF,EAAgB,CAC3B,UACA,KAAO,GACL,EAAW,GAAQ,CACjB,GAAI,EAAK,IAAI,EAAG,CAAE,OAAO,EACzB,IAAM,EAAO,IAAI,IAAI,EAAK,CAE1B,OADA,EAAK,IAAI,EAAG,CACL,GACP,CACJ,MAAQ,GACN,EAAW,GAAQ,CACjB,GAAI,CAAC,EAAK,IAAI,EAAG,CAAE,OAAO,EAC1B,IAAM,EAAO,IAAI,IAAI,EAAK,CAE1B,OADA,EAAK,OAAO,EAAG,CACR,GACP,CACJ,aAAgB,EAAW,IAAI,IAAc,CAC7C,OAAS,GAAe,GAAS,CAAC,IAAI,EAAG,CAC1C"}
@@ -1 +1 @@
1
- {"version":3,"file":"float-button.js","names":["cn","For","Match","mergeProps","Show","Switch","Component","Button","FloatButtonProps","DEFAULT_PROPS","type","color","size","animate","closeIcon","label","icon","renderAnimateClass","AnimateInfinite","Record","ripple","pulse","bounce","heartBeat","headShake","swing","jello","renderBadgeWidth","count","FloatButtonBadge","badge","p","_el$","_tmpl$","_el$2","firstChild","_$insert","_c$","_$memo","_el$3","_tmpl$2","_$effect","_$className","class","FloatButton","props","_$createComponent","children","when","_el$4","_tmpl$3","_el$5","_$addEventListener","onClickOpen","variant","shape","tabIndex","style","width","height","_el$6","_tmpl$5","_el$7","_el$8","nextSibling","_el$9","_c$2","onClickClose","_$setStyleProperty","Element","_el$0","_tmpl$4","each","actions","item","_el$1","_tmpl$6","index","console","warn","_$delegateEvents"],"sources":["../../../src/components/float-button/float-button.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\nimport { For, Match, mergeProps, Show, Switch, type Component } from 'solid-js';\nimport { Button } from '../button';\nimport type { FloatButtonProps } from './float-button.types';\n\nconst DEFAULT_PROPS: FloatButtonProps = {\n type: 'default',\n color: 'var(--color-warning)',\n size: 24,\n animate: 'none',\n closeIcon: {\n label: 'Close',\n icon: 'X',\n },\n};\n\nexport function renderAnimateClass(animate: string | undefined) {\n const AnimateInfinite: Record<string, string> = {\n ripple: 'animate-ripple',\n pulse: 'animate-pulse',\n bounce: 'animate-bounce',\n heartBeat: 'animate-heartBeat',\n headShake: 'animate-headShake',\n swing: 'animate-swing',\n jello: 'animate-jello',\n };\n return animate ? AnimateInfinite[animate] : '';\n}\nfunction renderBadgeWidth(count: number): string {\n if (count >= 10_000) return 'px-1 translate-x-2';\n if (count >= 1000) return 'px-1 translate-x-1 -translate-y-1';\n if (count >= 100) return 'px-1';\n return 'w-5';\n}\nconst FloatButtonBadge: Component<{\n badge?: FloatButtonProps['badge'];\n}> = p => {\n return (\n <div class=\"absolute -top-2 -right-2\">\n <div\n class={cn(\n 'bg-error flex h-5 cursor-pointer rounded-full text-xs text-white *:m-auto',\n renderBadgeWidth(p.badge?.count!),\n p.badge?.animate && `animate-${p.badge?.animate}`,\n p.badge?.class,\n )}\n >\n {p.badge?.count && <div>{p.badge?.count}</div>}\n </div>\n </div>\n );\n};\n\nexport const FloatButton: Component<FloatButtonProps> = props => {\n const p = mergeProps(DEFAULT_PROPS, props);\n const size = `${p.size}px`;\n\n return (\n <Switch>\n <Match when={p.type === 'single'}>\n <div class={cn('fab pointer-events-auto', p.class)} onClick={p.onClickOpen}>\n <div class=\"relative\">\n <Button\n icon={p.icon}\n variant=\"solid\"\n shape=\"circle\"\n class={cn('fab-open border-0', renderAnimateClass(p.animate))}\n tabIndex={0}\n style={{\n 'background-color': p.color,\n width: size,\n height: size,\n ['--innner-color']: p.color,\n ['--btn-color']: p.color,\n }}\n />\n <Show when={p.badge?.count}>\n <FloatButtonBadge badge={p.badge} />\n </Show>\n </div>\n </div>\n </Match>\n <Match when={p.type !== 'single'}>\n <div class={cn('fab', p.type === 'flower' && 'fab-flower', p.class)}>\n <div class=\"relative\" tabIndex={0}>\n <Button\n icon={p.icon}\n variant=\"solid\"\n shape=\"circle\"\n class={cn('fab-open border-0', renderAnimateClass(p.animate))}\n style={{\n 'background-color': p.color,\n width: size,\n height: size,\n ['--innner-color']: p.color,\n }}\n />\n <Show when={p.badge?.count}>\n <FloatButtonBadge badge={p.badge} />\n </Show>\n </div>\n\n <div class=\"fab-close\">\n {p.type === 'default' && p.closeIcon?.label}\n <div\n class=\"float-close btn btn-circle btn-error\"\n style={{ width: size, height: size }}\n onClick={p.closeIcon?.onClickClose}\n >\n {(p.closeIcon?.icon as Element) ?? 'orange'}\n </div>\n </div>\n <Switch>\n <Match when={p.type === 'default'}>\n <div class=\"float-menu flex flex-col items-end\">\n <For each={p.actions}>\n {item => {\n return <div class=\"flex gap-2\">{item as Element}</div>;\n }}\n </For>\n </div>\n </Match>\n <Match when={p.type === 'flower'}>\n <For each={p.actions}>\n {(item, index) => {\n if (index() > 3) {\n console.warn(\n 'Chỉ có thể nhận tối đa 4 component. Cần xóa các Component sau: ',\n item,\n );\n return;\n }\n return <>{item}</>;\n }}\n </For>\n </Match>\n </Switch>\n </div>\n </Match>\n </Switch>\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"float-button.js","names":["cn","For","Match","mergeProps","Show","Switch","Component","Button","FloatButtonProps","DEFAULT_PROPS","type","color","size","animate","closeIcon","label","icon","renderAnimateClass","AnimateInfinite","Record","ripple","pulse","bounce","heartBeat","headShake","swing","jello","renderBadgeWidth","count","FloatButtonBadge","badge","p","_el$","_tmpl$","_el$2","firstChild","_$insert","_c$","_$memo","_el$3","_tmpl$2","_$effect","_$className","class","FloatButton","props","_$createComponent","children","when","_el$4","_tmpl$3","_el$5","_$addEventListener","onClickOpen","variant","shape","tabIndex","style","width","height","_el$6","_tmpl$5","_el$7","_el$8","nextSibling","_el$9","_c$2","onClickClose","_$setStyleProperty","Element","_el$0","_tmpl$4","each","actions","item","_el$1","_tmpl$6","index","console","warn","_$delegateEvents"],"sources":["../../../src/components/float-button/float-button.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport { For, Match, mergeProps, Show, Switch, type Component } from 'solid-js';\r\nimport { Button } from '../button';\r\nimport type { FloatButtonProps } from './float-button.types';\r\n\r\nconst DEFAULT_PROPS: FloatButtonProps = {\r\n type: 'default',\r\n color: 'var(--color-warning)',\r\n size: 24,\r\n animate: 'none',\r\n closeIcon: {\r\n label: 'Close',\r\n icon: 'X',\r\n },\r\n};\r\n\r\nexport function renderAnimateClass(animate: string | undefined) {\r\n const AnimateInfinite: Record<string, string> = {\r\n ripple: 'animate-ripple',\r\n pulse: 'animate-pulse',\r\n bounce: 'animate-bounce',\r\n heartBeat: 'animate-heartBeat',\r\n headShake: 'animate-headShake',\r\n swing: 'animate-swing',\r\n jello: 'animate-jello',\r\n };\r\n return animate ? AnimateInfinite[animate] : '';\r\n}\r\nfunction renderBadgeWidth(count: number): string {\r\n if (count >= 10_000) return 'px-1 translate-x-2';\r\n if (count >= 1000) return 'px-1 translate-x-1 -translate-y-1';\r\n if (count >= 100) return 'px-1';\r\n return 'w-5';\r\n}\r\nconst FloatButtonBadge: Component<{\r\n badge?: FloatButtonProps['badge'];\r\n}> = p => {\r\n return (\r\n <div class=\"absolute -top-2 -right-2\">\r\n <div\r\n class={cn(\r\n 'bg-error flex h-5 cursor-pointer rounded-full text-xs text-white *:m-auto',\r\n renderBadgeWidth(p.badge?.count!),\r\n p.badge?.animate && `animate-${p.badge?.animate}`,\r\n p.badge?.class,\r\n )}\r\n >\r\n {p.badge?.count && <div>{p.badge?.count}</div>}\r\n </div>\r\n </div>\r\n );\r\n};\r\n\r\nexport const FloatButton: Component<FloatButtonProps> = props => {\r\n const p = mergeProps(DEFAULT_PROPS, props);\r\n const size = `${p.size}px`;\r\n\r\n return (\r\n <Switch>\r\n <Match when={p.type === 'single'}>\r\n <div class={cn('fab pointer-events-auto', p.class)} onClick={p.onClickOpen}>\r\n <div class=\"relative\">\r\n <Button\r\n icon={p.icon}\r\n variant=\"solid\"\r\n shape=\"circle\"\r\n class={cn('fab-open border-0', renderAnimateClass(p.animate))}\r\n tabIndex={0}\r\n style={{\r\n 'background-color': p.color,\r\n width: size,\r\n height: size,\r\n ['--innner-color']: p.color,\r\n ['--btn-color']: p.color,\r\n }}\r\n />\r\n <Show when={p.badge?.count}>\r\n <FloatButtonBadge badge={p.badge} />\r\n </Show>\r\n </div>\r\n </div>\r\n </Match>\r\n <Match when={p.type !== 'single'}>\r\n <div class={cn('fab', p.type === 'flower' && 'fab-flower', p.class)}>\r\n <div class=\"relative\" tabIndex={0}>\r\n <Button\r\n icon={p.icon}\r\n variant=\"solid\"\r\n shape=\"circle\"\r\n class={cn('fab-open border-0', renderAnimateClass(p.animate))}\r\n style={{\r\n 'background-color': p.color,\r\n width: size,\r\n height: size,\r\n ['--innner-color']: p.color,\r\n }}\r\n />\r\n <Show when={p.badge?.count}>\r\n <FloatButtonBadge badge={p.badge} />\r\n </Show>\r\n </div>\r\n\r\n <div class=\"fab-close\">\r\n {p.type === 'default' && p.closeIcon?.label}\r\n <div\r\n class=\"float-close btn btn-circle btn-error\"\r\n style={{ width: size, height: size }}\r\n onClick={p.closeIcon?.onClickClose}\r\n >\r\n {(p.closeIcon?.icon as Element) ?? 'orange'}\r\n </div>\r\n </div>\r\n <Switch>\r\n <Match when={p.type === 'default'}>\r\n <div class=\"float-menu flex flex-col items-end\">\r\n <For each={p.actions}>\r\n {item => {\r\n return <div class=\"flex gap-2\">{item as Element}</div>;\r\n }}\r\n </For>\r\n </div>\r\n </Match>\r\n <Match when={p.type === 'flower'}>\r\n <For each={p.actions}>\r\n {(item, index) => {\r\n if (index() > 3) {\r\n console.warn(\r\n 'Chỉ có thể nhận tối đa 4 component. Cần xóa các Component sau: ',\r\n item,\r\n );\r\n return;\r\n }\r\n return <>{item}</>;\r\n }}\r\n </For>\r\n </Match>\r\n </Switch>\r\n </div>\r\n </Match>\r\n </Switch>\r\n );\r\n};\r\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"hover-3d-image.js","names":["cn","Image","ImagePreview","Component","createSignal","Show","ImagePreviewProps","Hover3DImage","image","preview","enabled","previewOptions","class","Partial","Record","p","open","setOpen","previewEnabled","_el$","_tmpl$","_el$2","firstChild","_el$3","$$click","_$spread","_$mergeProps","_$effect","_p$","_v$","root","_v$2","figure","e","_$className","t","undefined","_$createComponent","when","children","src","imageName","_$memo","alt","onClose","_$delegateEvents"],"sources":["../../../src/components/hover-3d-image/hover-3d-image.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\nimport { Image } from '@/utils/helper';\nimport { ImagePreview } from '@components/image-preview';\nimport { Component, createSignal, Show } from 'solid-js';\nimport { ImagePreviewProps } from '../image-preview/image-preview';\n\nexport const Hover3DImage: Component<{\n image: Image;\n /** Bật/tắt tính năng click để preview ảnh. @default true */\n preview?: boolean | { enabled: true; previewOptions?: ImagePreviewProps };\n class?: Partial<Record<'root' | 'figure' | 'image', string>>;\n}> = p => {\n const [open, setOpen] = createSignal(false);\n const previewEnabled = () => p.preview !== false;\n\n return (\n <>\n <div\n class={cn('hover-3d', previewEnabled() && 'cursor-zoom-in', p.class?.root)}\n onClick={() => previewEnabled() && setOpen(true)}\n >\n <figure class={cn('rounded-2xl', p.class?.figure)}>\n <img {...p.image} />\n </figure>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n <div></div>\n </div>\n\n <Show when={open()}>\n <ImagePreview\n src={p.image.src}\n imageName={typeof p.image.alt === 'string' ? p.image.alt : undefined}\n onClose={() => setOpen(false)}\n {...(typeof p.preview === 'object' ? p.preview.previewOptions : undefined)}\n />\n </Show>\n </>\n );\n};\n"],"mappings":"qaAMaO,EAKRQ,GAAK,CACR,GAAM,CAACC,EAAMC,GAAWb,EAAa,GAAM,CACrCc,MAAuBH,EAAEN,UAAY,GAE3C,MAAA,MAAA,CAAA,IAAAU,EAAAC,GAAA,CAAAC,EAAAF,EAAAG,WAAAC,EAAAF,EAAAC,WAMuD,MANvDH,GAAAK,YAIqBN,GAAgB,EAAID,EAAQ,GAAK,CAAAQ,EAAAF,EAAAG,MAGrCX,EAAEP,MAAK,CAAA,GAAA,GAAA,CAAAmB,EAAAC,GAAA,CAAA,IAAAC,EAJX7B,EAAG,WAAYkB,GAAgB,EAAI,iBAAkBH,EAAEH,OAAOkB,KAAK,CAAAC,EAG3D/B,EAAG,cAAee,EAAEH,OAAOoB,OAAO,CAAA,OAAAH,IAAAD,EAAAK,GAAAC,EAAAf,EAAAS,EAAAK,EAAAJ,EAAA,CAAAE,IAAAH,EAAAO,GAAAD,EAAAb,EAAAO,EAAAO,EAAAJ,EAAA,CAAAH,GAAA,CAAAK,EAAAG,IAAAA,GAAAD,EAAAC,IAAAA,GAAA,CAAA,CAAAjB,KAAA,CAAAkB,EAalDhC,EAAI,CAAA,IAACiC,MAAI,CAAA,OAAEtB,GAAM,EAAA,IAAAuB,UAAA,CAAA,OAAAF,EACfnC,EAAYwB,EAAA,CAAA,IACXc,KAAG,CAAA,OAAEzB,EAAEP,MAAMgC,KAAG,IAChBC,WAAS,CAAA,OAAEC,MAAA,OAAO3B,EAAEP,MAAMmC,KAAQ,SAAQ,EAAA,CAAG5B,EAAEP,MAAMmC,IAAMP,IAAAA,IAC3DQ,YAAe3B,EAAQ,GAAK,CAAC,KACxB,OAAOF,EAAEN,SAAY,SAAWM,EAAEN,QAAQE,eAAiByB,IAAAA,GAAS,CAAA,EAAA,CAAA,CAAA,EAKjFS,EAAA,CAAA,QAAA,CAAA"}
1
+ {"version":3,"file":"hover-3d-image.js","names":["cn","Image","ImagePreview","Component","createSignal","Show","ImagePreviewProps","Hover3DImage","image","preview","enabled","previewOptions","class","Partial","Record","p","open","setOpen","previewEnabled","_el$","_tmpl$","_el$2","firstChild","_el$3","$$click","_$spread","_$mergeProps","_$effect","_p$","_v$","root","_v$2","figure","e","_$className","t","undefined","_$createComponent","when","children","src","imageName","_$memo","alt","onClose","_$delegateEvents"],"sources":["../../../src/components/hover-3d-image/hover-3d-image.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport { Image } from '@/utils/helper';\r\nimport { ImagePreview } from '@components/image-preview';\r\nimport { Component, createSignal, Show } from 'solid-js';\r\nimport { ImagePreviewProps } from '../image-preview/image-preview';\r\n\r\nexport const Hover3DImage: Component<{\r\n image: Image;\r\n /** Bật/tắt tính năng click để preview ảnh. @default true */\r\n preview?: boolean | { enabled: true; previewOptions?: ImagePreviewProps };\r\n class?: Partial<Record<'root' | 'figure' | 'image', string>>;\r\n}> = p => {\r\n const [open, setOpen] = createSignal(false);\r\n const previewEnabled = () => p.preview !== false;\r\n\r\n return (\r\n <>\r\n <div\r\n class={cn('hover-3d', previewEnabled() && 'cursor-zoom-in', p.class?.root)}\r\n onClick={() => previewEnabled() && setOpen(true)}\r\n >\r\n <figure class={cn('rounded-2xl', p.class?.figure)}>\r\n <img {...p.image} />\r\n </figure>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n </div>\r\n\r\n <Show when={open()}>\r\n <ImagePreview\r\n src={p.image.src}\r\n imageName={typeof p.image.alt === 'string' ? p.image.alt : undefined}\r\n onClose={() => setOpen(false)}\r\n {...(typeof p.preview === 'object' ? p.preview.previewOptions : undefined)}\r\n />\r\n </Show>\r\n </>\r\n );\r\n};\r\n"],"mappings":"qaAMaO,EAKRQ,GAAK,CACR,GAAM,CAACC,EAAMC,GAAWb,EAAa,GAAM,CACrCc,MAAuBH,EAAEN,UAAY,GAE3C,MAAA,MAAA,CAAA,IAAAU,EAAAC,GAAA,CAAAC,EAAAF,EAAAG,WAAAC,EAAAF,EAAAC,WAMuD,MANvDH,GAAAK,YAIqBN,GAAgB,EAAID,EAAQ,GAAK,CAAAQ,EAAAF,EAAAG,MAGrCX,EAAEP,MAAK,CAAA,GAAA,GAAA,CAAAmB,EAAAC,GAAA,CAAA,IAAAC,EAJX7B,EAAG,WAAYkB,GAAgB,EAAI,iBAAkBH,EAAEH,OAAOkB,KAAK,CAAAC,EAG3D/B,EAAG,cAAee,EAAEH,OAAOoB,OAAO,CAAA,OAAAH,IAAAD,EAAAK,GAAAC,EAAAf,EAAAS,EAAAK,EAAAJ,EAAA,CAAAE,IAAAH,EAAAO,GAAAD,EAAAb,EAAAO,EAAAO,EAAAJ,EAAA,CAAAH,GAAA,CAAAK,EAAAG,IAAAA,GAAAD,EAAAC,IAAAA,GAAA,CAAA,CAAAjB,KAAA,CAAAkB,EAalDhC,EAAI,CAAA,IAACiC,MAAI,CAAA,OAAEtB,GAAM,EAAA,IAAAuB,UAAA,CAAA,OAAAF,EACfnC,EAAYwB,EAAA,CAAA,IACXc,KAAG,CAAA,OAAEzB,EAAEP,MAAMgC,KAAG,IAChBC,WAAS,CAAA,OAAEC,MAAA,OAAO3B,EAAEP,MAAMmC,KAAQ,SAAQ,EAAA,CAAG5B,EAAEP,MAAMmC,IAAMP,IAAAA,IAC3DQ,YAAe3B,EAAQ,GAAK,CAAC,KACxB,OAAOF,EAAEN,SAAY,SAAWM,EAAEN,QAAQE,eAAiByB,IAAAA,GAAS,CAAA,EAAA,CAAA,CAAA,EAKjFS,EAAA,CAAA,QAAA,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"image-preview.js","names":["cn","ZIndex","ZIndexType","FlipHorizontal2","FlipVertical2","Info","Maximize2","RotateCcw","RotateCw","X","ZoomIn","ZoomOut","createSignal","mergeProps","onCleanup","onMount","Show","ImagePreviewClassProps","backdrop","close","box","img","toolbar","toolBtn","zoomLabel","infoPopup","ImagePreviewProps","src","imageName","size","createdAt","Date","modifiedAt","onClose","closeOnBackdrop","closeOnEsc","class","zIndex","ZOOM_STEP","ZOOM_MIN","ZOOM_MAX","formatDate","value","undefined","d","isNaN","getTime","String","toLocaleString","day","month","year","hour","minute","InfoRow","props","label","_$createComponent","when","children","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_$insert","ImagePreview","p","rotate","setRotate","flipH","setFlipH","flipV","setFlipV","scale","setScale","offsetX","setOffsetX","offsetY","setOffsetY","isDragging","setIsDragging","showInfo","setShowInfo","naturalSize","setNaturalSize","w","h","dragStartX","dragStartY","dragStartOffsetX","dragStartOffsetY","canPan","imgTransform","sx","sy","zoomIn","s","Math","min","toFixed","zoomOut","next","max","resetView","rotateCw","r","rotateCcw","doFlipH","v","doFlipV","onPointerDown","e","PointerEvent","preventDefault","currentTarget","HTMLElement","setPointerCapture","pointerId","clientX","clientY","onPointerMove","onPointerUp","backdropRef","HTMLDivElement","boxRef","infoPopupRef","infoBtnRef","HTMLButtonElement","onWheel","WheelEvent","delta","deltaY","oldScale","newScale","rect","getBoundingClientRect","cx","left","width","cy","top","height","ratio","ox","oy","onKeyDown","KeyboardEvent","key","stopImmediatePropagation","onDocPointerDown","target","Node","contains","preventScroll","addEventListener","passive","document","capture","removePreviewEventListeners","removeEventListener","hasInfo","open","type","MODAL","blockScroll","positioning","preRender","customValue","_el$4","_tmpl$5","_el$5","_el$6","_el$7","_el$8","_el$9","_el$0","_el$1","_el$10","_el$11","_el$12","_el$13","_el$14","_el$15","_el$16","_el$17","_el$18","_$addEventListener","_ref$","_$use","$$pointerup","$$pointermove","$$pointerdown","$$click","stopPropagation","_ref$2","HTMLImageElement","naturalWidth","naturalHeight","_$setAttribute","round","_tmpl$2","_el$20","_tmpl$4","_el$21","_ref$3","_el$22","_tmpl$3","_el$23","_el$24","_ref$4","_$memo","_$effect","_$className","_p$","_v$","_v$2","_v$3","_v$4","_v$5","_v$6","_v$7","_v$8","_v$9","_v$0","_v$1","_v$10","_v$11","_v$12","_v$13","_v$14","_v$15","_v$16","_v$17","t","a","o","i","n","_$setStyleProperty","l","u","c","disabled","m","f","y","g","_$delegateEvents"],"sources":["../../../src/components/image-preview/image-preview.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\nimport { ZIndex, ZIndexType } from '@components/z-index';\nimport FlipHorizontal2 from 'lucide-solid/icons/flip-horizontal-2';\nimport FlipVertical2 from 'lucide-solid/icons/flip-vertical-2';\nimport Info from 'lucide-solid/icons/info';\nimport Maximize2 from 'lucide-solid/icons/maximize-2';\nimport RotateCcw from 'lucide-solid/icons/rotate-ccw';\nimport RotateCw from 'lucide-solid/icons/rotate-cw';\nimport X from 'lucide-solid/icons/x';\nimport ZoomIn from 'lucide-solid/icons/zoom-in';\nimport ZoomOut from 'lucide-solid/icons/zoom-out';\nimport { createSignal, mergeProps, onCleanup, onMount, Show } from 'solid-js';\n\ntype ImagePreviewClassProps = {\n backdrop?: string;\n close?: string;\n box?: string;\n img?: string;\n toolbar?: string;\n toolBtn?: string;\n zoomLabel?: string;\n infoPopup?: string;\n};\n\nexport type ImagePreviewProps = {\n src: string;\n imageName?: string;\n size?: string;\n createdAt?: Date | string;\n modifiedAt?: Date | string;\n onClose: () => void;\n closeOnBackdrop?: boolean;\n closeOnEsc?: boolean;\n class?: ImagePreviewClassProps;\n zIndex?: number;\n};\n\nconst ZOOM_STEP = 0.25;\nconst ZOOM_MIN = 0.25;\nconst ZOOM_MAX = 4;\n\nfunction formatDate(value: Date | string | undefined): string | undefined {\n if (!value) return undefined;\n const d = value instanceof Date ? value : new Date(value);\n if (isNaN(d.getTime())) return String(value);\n return d.toLocaleString('en-US', {\n day: '2-digit',\n month: '2-digit',\n year: 'numeric',\n hour: '2-digit',\n minute: '2-digit',\n });\n}\n\nfunction InfoRow(props: { label: string; value: string | undefined }) {\n return (\n <Show when={props.value}>\n <div class=\"flex items-start gap-2\">\n <span class=\"w-24 shrink-0 text-white/40\">{props.label}</span>\n <span class=\"min-w-0 break-all text-white/90\">{props.value}</span>\n </div>\n </Show>\n );\n}\n\nexport function ImagePreview(p: ImagePreviewProps) {\n p = mergeProps({ closeOnBackdrop: false, closeOnEsc: true }, p);\n const [rotate, setRotate] = createSignal(0);\n const [flipH, setFlipH] = createSignal(false);\n const [flipV, setFlipV] = createSignal(false);\n const [scale, setScale] = createSignal(1);\n const [offsetX, setOffsetX] = createSignal(0);\n const [offsetY, setOffsetY] = createSignal(0);\n const [isDragging, setIsDragging] = createSignal(false);\n const [showInfo, setShowInfo] = createSignal(false);\n const [naturalSize, setNaturalSize] = createSignal<{ w: number; h: number } | null>(null);\n\n let dragStartX = 0;\n let dragStartY = 0;\n let dragStartOffsetX = 0;\n let dragStartOffsetY = 0;\n\n const canPan = () => scale() > 1;\n\n const imgTransform = () => {\n const sx = flipH() ? -scale() : scale();\n const sy = flipV() ? -scale() : scale();\n return `translate(${offsetX()}px, ${offsetY()}px) rotate(${rotate()}deg) scale(${sx}, ${sy})`;\n };\n\n const zoomIn = () => setScale(s => Math.min(+(s + ZOOM_STEP).toFixed(2), ZOOM_MAX));\n\n const zoomOut = () => {\n const next = Math.max(+(scale() - ZOOM_STEP).toFixed(2), ZOOM_MIN);\n setScale(next);\n if (next <= 1) {\n setOffsetX(0);\n setOffsetY(0);\n }\n };\n\n const resetView = () => {\n setScale(1);\n setOffsetX(0);\n setOffsetY(0);\n };\n\n const rotateCw = () => {\n setRotate(r => r + 90);\n setOffsetX(0);\n setOffsetY(0);\n };\n const rotateCcw = () => {\n setRotate(r => r - 90);\n setOffsetX(0);\n setOffsetY(0);\n };\n const doFlipH = () => setFlipH(v => !v);\n const doFlipV = () => setFlipV(v => !v);\n\n const onPointerDown = (e: PointerEvent) => {\n if (!canPan()) return;\n e.preventDefault();\n (e.currentTarget as HTMLElement).setPointerCapture(e.pointerId);\n setIsDragging(true);\n dragStartX = e.clientX;\n dragStartY = e.clientY;\n dragStartOffsetX = offsetX();\n dragStartOffsetY = offsetY();\n };\n\n const onPointerMove = (e: PointerEvent) => {\n if (!isDragging()) return;\n setOffsetX(dragStartOffsetX + e.clientX - dragStartX);\n setOffsetY(dragStartOffsetY + e.clientY - dragStartY);\n };\n\n const onPointerUp = () => setIsDragging(false);\n\n let backdropRef!: HTMLDivElement;\n let boxRef!: HTMLDivElement;\n let infoPopupRef!: HTMLDivElement;\n let infoBtnRef!: HTMLButtonElement;\n\n onMount(() => {\n const onWheel = (e: WheelEvent) => {\n e.preventDefault();\n const delta = e.deltaY < 0 ? ZOOM_STEP : -ZOOM_STEP;\n const oldScale = scale();\n const newScale = Math.min(Math.max(+(oldScale + delta).toFixed(2), ZOOM_MIN), ZOOM_MAX);\n if (newScale === oldScale) return;\n\n const rect = boxRef.getBoundingClientRect();\n const cx = e.clientX - rect.left - rect.width / 2;\n const cy = e.clientY - rect.top - rect.height / 2;\n const ratio = newScale / oldScale - 1;\n\n setScale(newScale);\n setOffsetX(ox => ox - (cx - ox) * ratio);\n setOffsetY(oy => oy - (cy - oy) * ratio);\n\n if (newScale <= 1) {\n setOffsetX(0);\n setOffsetY(0);\n }\n };\n\n const onKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Escape' && (p.closeOnEsc ?? true)) {\n e.stopImmediatePropagation();\n p.onClose();\n }\n };\n\n const onDocPointerDown = (e: PointerEvent) => {\n if (!showInfo()) return;\n const target = e.target as Node;\n if (!infoPopupRef?.contains(target) && !infoBtnRef?.contains(target)) {\n setShowInfo(false);\n }\n };\n\n const preventScroll = (e: WheelEvent) => e.preventDefault();\n backdropRef.addEventListener('wheel', preventScroll, { passive: false });\n boxRef.addEventListener('wheel', onWheel, { passive: false });\n document.addEventListener('pointerdown', onDocPointerDown);\n document.addEventListener('keydown', onKeyDown, { capture: true });\n\n onCleanup(function removePreviewEventListeners() {\n backdropRef.removeEventListener('wheel', preventScroll);\n boxRef.removeEventListener('wheel', onWheel);\n document.removeEventListener('pointerdown', onDocPointerDown);\n document.removeEventListener('keydown', onKeyDown, { capture: true });\n });\n });\n\n const hasInfo = () => !!(p.imageName || p.size || p.createdAt || p.modifiedAt);\n\n return (\n <ZIndex\n open={true}\n type={ZIndexType.MODAL}\n blockScroll={true}\n positioning=\"fixed\"\n preRender={false}\n customValue={p.zIndex}\n class=\"inset-0\"\n >\n <div\n ref={backdropRef}\n class={cn('img01', p.class?.backdrop)}\n onClick={p.closeOnBackdrop ? p.onClose : undefined}\n >\n <button class={cn('img02', p.class?.close)} onClick={p.onClose}>\n <X size={20} />\n </button>\n\n <div\n ref={boxRef}\n class={cn(\n 'img03',\n canPan() && (isDragging() ? 'cursor-grabbing' : 'cursor-grab'),\n p.class?.box,\n )}\n onClick={e => e.stopPropagation()}\n onPointerDown={onPointerDown}\n onPointerMove={onPointerMove}\n onPointerUp={onPointerUp}\n onPointerCancel={onPointerUp}\n >\n <img\n src={p.src}\n alt={p.imageName}\n class={cn('img04', isDragging() && 'img04--drag', p.class?.img)}\n style={{ transform: imgTransform() }}\n draggable={false}\n onLoad={e => {\n const img = e.currentTarget as HTMLImageElement;\n setNaturalSize({ w: img.naturalWidth, h: img.naturalHeight });\n }}\n />\n </div>\n\n <div class={cn('img05', p.class?.toolbar)} onClick={e => e.stopPropagation()}>\n <button class={cn('img06', p.class?.toolBtn)} onClick={doFlipV} title=\"Flip vertically\">\n <FlipVertical2 size={16} />\n </button>\n <button class={cn('img06', p.class?.toolBtn)} onClick={doFlipH} title=\"Flip horizontally\">\n <FlipHorizontal2 size={16} />\n </button>\n <div class=\"img07\" />\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={rotateCcw}\n title=\"Rotate counter-clockwise\"\n >\n <RotateCcw size={16} />\n </button>\n <button class={cn('img06', p.class?.toolBtn)} onClick={rotateCw} title=\"Rotate clockwise\">\n <RotateCw size={16} />\n </button>\n <div class=\"img07\" />\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={zoomOut}\n title=\"Zoom out\"\n disabled={scale() <= ZOOM_MIN}\n >\n <ZoomOut size={16} />\n </button>\n <span class={cn('img08', p.class?.zoomLabel)}>{Math.round(scale() * 100)}%</span>\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={zoomIn}\n title=\"Zoom in\"\n disabled={scale() >= ZOOM_MAX}\n >\n <ZoomIn size={16} />\n </button>\n <div class=\"img07\" />\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={resetView}\n title=\"Reset to 100%\"\n disabled={scale() === 1}\n >\n <Maximize2 size={16} />\n </button>\n\n <Show when={hasInfo()}>\n <div class=\"img07\" />\n <div class=\"relative\">\n <button\n ref={infoBtnRef}\n class={cn('img06', showInfo() && 'bg-white/20 text-white', p.class?.toolBtn)}\n onClick={() => setShowInfo(v => !v)}\n title=\"Image info\"\n >\n <Info size={16} />\n </button>\n\n <Show when={showInfo()}>\n <div ref={infoPopupRef} class={cn('img09', p.class?.infoPopup)}>\n <p class=\"mb-2 text-xs font-semibold tracking-wide text-white/50 uppercase\">\n Image Info\n </p>\n <div class=\"flex flex-col gap-1.5 text-xs\">\n <InfoRow label=\"File name\" value={p.imageName} />\n <InfoRow label=\"Size\" value={p.size} />\n <InfoRow\n label=\"Dimension\"\n value={\n naturalSize() ? `${naturalSize()!.w} × ${naturalSize()!.h} px` : undefined\n }\n />\n <InfoRow label=\"Created\" value={formatDate(p.createdAt)} />\n <InfoRow label=\"Modified\" value={formatDate(p.modifiedAt)} />\n </div>\n </div>\n </Show>\n </div>\n </Show>\n </div>\n </div>\n </ZIndex>\n );\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"image-preview.js","names":["cn","ZIndex","ZIndexType","FlipHorizontal2","FlipVertical2","Info","Maximize2","RotateCcw","RotateCw","X","ZoomIn","ZoomOut","createSignal","mergeProps","onCleanup","onMount","Show","ImagePreviewClassProps","backdrop","close","box","img","toolbar","toolBtn","zoomLabel","infoPopup","ImagePreviewProps","src","imageName","size","createdAt","Date","modifiedAt","onClose","closeOnBackdrop","closeOnEsc","class","zIndex","ZOOM_STEP","ZOOM_MIN","ZOOM_MAX","formatDate","value","undefined","d","isNaN","getTime","String","toLocaleString","day","month","year","hour","minute","InfoRow","props","label","_$createComponent","when","children","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_$insert","ImagePreview","p","rotate","setRotate","flipH","setFlipH","flipV","setFlipV","scale","setScale","offsetX","setOffsetX","offsetY","setOffsetY","isDragging","setIsDragging","showInfo","setShowInfo","naturalSize","setNaturalSize","w","h","dragStartX","dragStartY","dragStartOffsetX","dragStartOffsetY","canPan","imgTransform","sx","sy","zoomIn","s","Math","min","toFixed","zoomOut","next","max","resetView","rotateCw","r","rotateCcw","doFlipH","v","doFlipV","onPointerDown","e","PointerEvent","preventDefault","currentTarget","HTMLElement","setPointerCapture","pointerId","clientX","clientY","onPointerMove","onPointerUp","backdropRef","HTMLDivElement","boxRef","infoPopupRef","infoBtnRef","HTMLButtonElement","onWheel","WheelEvent","delta","deltaY","oldScale","newScale","rect","getBoundingClientRect","cx","left","width","cy","top","height","ratio","ox","oy","onKeyDown","KeyboardEvent","key","stopImmediatePropagation","onDocPointerDown","target","Node","contains","preventScroll","addEventListener","passive","document","capture","removePreviewEventListeners","removeEventListener","hasInfo","open","type","MODAL","blockScroll","positioning","preRender","customValue","_el$4","_tmpl$5","_el$5","_el$6","_el$7","_el$8","_el$9","_el$0","_el$1","_el$10","_el$11","_el$12","_el$13","_el$14","_el$15","_el$16","_el$17","_el$18","_$addEventListener","_ref$","_$use","$$pointerup","$$pointermove","$$pointerdown","$$click","stopPropagation","_ref$2","HTMLImageElement","naturalWidth","naturalHeight","_$setAttribute","round","_tmpl$2","_el$20","_tmpl$4","_el$21","_ref$3","_el$22","_tmpl$3","_el$23","_el$24","_ref$4","_$memo","_$effect","_$className","_p$","_v$","_v$2","_v$3","_v$4","_v$5","_v$6","_v$7","_v$8","_v$9","_v$0","_v$1","_v$10","_v$11","_v$12","_v$13","_v$14","_v$15","_v$16","_v$17","t","a","o","i","n","_$setStyleProperty","l","u","c","disabled","m","f","y","g","_$delegateEvents"],"sources":["../../../src/components/image-preview/image-preview.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport { ZIndex, ZIndexType } from '@components/z-index';\r\nimport FlipHorizontal2 from 'lucide-solid/icons/flip-horizontal-2';\r\nimport FlipVertical2 from 'lucide-solid/icons/flip-vertical-2';\r\nimport Info from 'lucide-solid/icons/info';\r\nimport Maximize2 from 'lucide-solid/icons/maximize-2';\r\nimport RotateCcw from 'lucide-solid/icons/rotate-ccw';\r\nimport RotateCw from 'lucide-solid/icons/rotate-cw';\r\nimport X from 'lucide-solid/icons/x';\r\nimport ZoomIn from 'lucide-solid/icons/zoom-in';\r\nimport ZoomOut from 'lucide-solid/icons/zoom-out';\r\nimport { createSignal, mergeProps, onCleanup, onMount, Show } from 'solid-js';\r\n\r\ntype ImagePreviewClassProps = {\r\n backdrop?: string;\r\n close?: string;\r\n box?: string;\r\n img?: string;\r\n toolbar?: string;\r\n toolBtn?: string;\r\n zoomLabel?: string;\r\n infoPopup?: string;\r\n};\r\n\r\nexport type ImagePreviewProps = {\r\n src: string;\r\n imageName?: string;\r\n size?: string;\r\n createdAt?: Date | string;\r\n modifiedAt?: Date | string;\r\n onClose: () => void;\r\n closeOnBackdrop?: boolean;\r\n closeOnEsc?: boolean;\r\n class?: ImagePreviewClassProps;\r\n zIndex?: number;\r\n};\r\n\r\nconst ZOOM_STEP = 0.25;\r\nconst ZOOM_MIN = 0.25;\r\nconst ZOOM_MAX = 4;\r\n\r\nfunction formatDate(value: Date | string | undefined): string | undefined {\r\n if (!value) return undefined;\r\n const d = value instanceof Date ? value : new Date(value);\r\n if (isNaN(d.getTime())) return String(value);\r\n return d.toLocaleString('en-US', {\r\n day: '2-digit',\r\n month: '2-digit',\r\n year: 'numeric',\r\n hour: '2-digit',\r\n minute: '2-digit',\r\n });\r\n}\r\n\r\nfunction InfoRow(props: { label: string; value: string | undefined }) {\r\n return (\r\n <Show when={props.value}>\r\n <div class=\"flex items-start gap-2\">\r\n <span class=\"w-24 shrink-0 text-white/40\">{props.label}</span>\r\n <span class=\"min-w-0 break-all text-white/90\">{props.value}</span>\r\n </div>\r\n </Show>\r\n );\r\n}\r\n\r\nexport function ImagePreview(p: ImagePreviewProps) {\r\n p = mergeProps({ closeOnBackdrop: false, closeOnEsc: true }, p);\r\n const [rotate, setRotate] = createSignal(0);\r\n const [flipH, setFlipH] = createSignal(false);\r\n const [flipV, setFlipV] = createSignal(false);\r\n const [scale, setScale] = createSignal(1);\r\n const [offsetX, setOffsetX] = createSignal(0);\r\n const [offsetY, setOffsetY] = createSignal(0);\r\n const [isDragging, setIsDragging] = createSignal(false);\r\n const [showInfo, setShowInfo] = createSignal(false);\r\n const [naturalSize, setNaturalSize] = createSignal<{ w: number; h: number } | null>(null);\r\n\r\n let dragStartX = 0;\r\n let dragStartY = 0;\r\n let dragStartOffsetX = 0;\r\n let dragStartOffsetY = 0;\r\n\r\n const canPan = () => scale() > 1;\r\n\r\n const imgTransform = () => {\r\n const sx = flipH() ? -scale() : scale();\r\n const sy = flipV() ? -scale() : scale();\r\n return `translate(${offsetX()}px, ${offsetY()}px) rotate(${rotate()}deg) scale(${sx}, ${sy})`;\r\n };\r\n\r\n const zoomIn = () => setScale(s => Math.min(+(s + ZOOM_STEP).toFixed(2), ZOOM_MAX));\r\n\r\n const zoomOut = () => {\r\n const next = Math.max(+(scale() - ZOOM_STEP).toFixed(2), ZOOM_MIN);\r\n setScale(next);\r\n if (next <= 1) {\r\n setOffsetX(0);\r\n setOffsetY(0);\r\n }\r\n };\r\n\r\n const resetView = () => {\r\n setScale(1);\r\n setOffsetX(0);\r\n setOffsetY(0);\r\n };\r\n\r\n const rotateCw = () => {\r\n setRotate(r => r + 90);\r\n setOffsetX(0);\r\n setOffsetY(0);\r\n };\r\n const rotateCcw = () => {\r\n setRotate(r => r - 90);\r\n setOffsetX(0);\r\n setOffsetY(0);\r\n };\r\n const doFlipH = () => setFlipH(v => !v);\r\n const doFlipV = () => setFlipV(v => !v);\r\n\r\n const onPointerDown = (e: PointerEvent) => {\r\n if (!canPan()) return;\r\n e.preventDefault();\r\n (e.currentTarget as HTMLElement).setPointerCapture(e.pointerId);\r\n setIsDragging(true);\r\n dragStartX = e.clientX;\r\n dragStartY = e.clientY;\r\n dragStartOffsetX = offsetX();\r\n dragStartOffsetY = offsetY();\r\n };\r\n\r\n const onPointerMove = (e: PointerEvent) => {\r\n if (!isDragging()) return;\r\n setOffsetX(dragStartOffsetX + e.clientX - dragStartX);\r\n setOffsetY(dragStartOffsetY + e.clientY - dragStartY);\r\n };\r\n\r\n const onPointerUp = () => setIsDragging(false);\r\n\r\n let backdropRef!: HTMLDivElement;\r\n let boxRef!: HTMLDivElement;\r\n let infoPopupRef!: HTMLDivElement;\r\n let infoBtnRef!: HTMLButtonElement;\r\n\r\n onMount(() => {\r\n const onWheel = (e: WheelEvent) => {\r\n e.preventDefault();\r\n const delta = e.deltaY < 0 ? ZOOM_STEP : -ZOOM_STEP;\r\n const oldScale = scale();\r\n const newScale = Math.min(Math.max(+(oldScale + delta).toFixed(2), ZOOM_MIN), ZOOM_MAX);\r\n if (newScale === oldScale) return;\r\n\r\n const rect = boxRef.getBoundingClientRect();\r\n const cx = e.clientX - rect.left - rect.width / 2;\r\n const cy = e.clientY - rect.top - rect.height / 2;\r\n const ratio = newScale / oldScale - 1;\r\n\r\n setScale(newScale);\r\n setOffsetX(ox => ox - (cx - ox) * ratio);\r\n setOffsetY(oy => oy - (cy - oy) * ratio);\r\n\r\n if (newScale <= 1) {\r\n setOffsetX(0);\r\n setOffsetY(0);\r\n }\r\n };\r\n\r\n const onKeyDown = (e: KeyboardEvent) => {\r\n if (e.key === 'Escape' && (p.closeOnEsc ?? true)) {\r\n e.stopImmediatePropagation();\r\n p.onClose();\r\n }\r\n };\r\n\r\n const onDocPointerDown = (e: PointerEvent) => {\r\n if (!showInfo()) return;\r\n const target = e.target as Node;\r\n if (!infoPopupRef?.contains(target) && !infoBtnRef?.contains(target)) {\r\n setShowInfo(false);\r\n }\r\n };\r\n\r\n const preventScroll = (e: WheelEvent) => e.preventDefault();\r\n backdropRef.addEventListener('wheel', preventScroll, { passive: false });\r\n boxRef.addEventListener('wheel', onWheel, { passive: false });\r\n document.addEventListener('pointerdown', onDocPointerDown);\r\n document.addEventListener('keydown', onKeyDown, { capture: true });\r\n\r\n onCleanup(function removePreviewEventListeners() {\r\n backdropRef.removeEventListener('wheel', preventScroll);\r\n boxRef.removeEventListener('wheel', onWheel);\r\n document.removeEventListener('pointerdown', onDocPointerDown);\r\n document.removeEventListener('keydown', onKeyDown, { capture: true });\r\n });\r\n });\r\n\r\n const hasInfo = () => !!(p.imageName || p.size || p.createdAt || p.modifiedAt);\r\n\r\n return (\r\n <ZIndex\r\n open={true}\r\n type={ZIndexType.MODAL}\r\n blockScroll={true}\r\n positioning=\"fixed\"\r\n preRender={false}\r\n customValue={p.zIndex}\r\n class=\"inset-0\"\r\n >\r\n <div\r\n ref={backdropRef}\r\n class={cn('img01', p.class?.backdrop)}\r\n onClick={p.closeOnBackdrop ? p.onClose : undefined}\r\n >\r\n <button class={cn('img02', p.class?.close)} onClick={p.onClose}>\r\n <X size={20} />\r\n </button>\r\n\r\n <div\r\n ref={boxRef}\r\n class={cn(\r\n 'img03',\r\n canPan() && (isDragging() ? 'cursor-grabbing' : 'cursor-grab'),\r\n p.class?.box,\r\n )}\r\n onClick={e => e.stopPropagation()}\r\n onPointerDown={onPointerDown}\r\n onPointerMove={onPointerMove}\r\n onPointerUp={onPointerUp}\r\n onPointerCancel={onPointerUp}\r\n >\r\n <img\r\n src={p.src}\r\n alt={p.imageName}\r\n class={cn('img04', isDragging() && 'img04--drag', p.class?.img)}\r\n style={{ transform: imgTransform() }}\r\n draggable={false}\r\n onLoad={e => {\r\n const img = e.currentTarget as HTMLImageElement;\r\n setNaturalSize({ w: img.naturalWidth, h: img.naturalHeight });\r\n }}\r\n />\r\n </div>\r\n\r\n <div class={cn('img05', p.class?.toolbar)} onClick={e => e.stopPropagation()}>\r\n <button class={cn('img06', p.class?.toolBtn)} onClick={doFlipV} title=\"Flip vertically\">\r\n <FlipVertical2 size={16} />\r\n </button>\r\n <button class={cn('img06', p.class?.toolBtn)} onClick={doFlipH} title=\"Flip horizontally\">\r\n <FlipHorizontal2 size={16} />\r\n </button>\r\n <div class=\"img07\" />\r\n <button\r\n class={cn('img06', p.class?.toolBtn)}\r\n onClick={rotateCcw}\r\n title=\"Rotate counter-clockwise\"\r\n >\r\n <RotateCcw size={16} />\r\n </button>\r\n <button class={cn('img06', p.class?.toolBtn)} onClick={rotateCw} title=\"Rotate clockwise\">\r\n <RotateCw size={16} />\r\n </button>\r\n <div class=\"img07\" />\r\n <button\r\n class={cn('img06', p.class?.toolBtn)}\r\n onClick={zoomOut}\r\n title=\"Zoom out\"\r\n disabled={scale() <= ZOOM_MIN}\r\n >\r\n <ZoomOut size={16} />\r\n </button>\r\n <span class={cn('img08', p.class?.zoomLabel)}>{Math.round(scale() * 100)}%</span>\r\n <button\r\n class={cn('img06', p.class?.toolBtn)}\r\n onClick={zoomIn}\r\n title=\"Zoom in\"\r\n disabled={scale() >= ZOOM_MAX}\r\n >\r\n <ZoomIn size={16} />\r\n </button>\r\n <div class=\"img07\" />\r\n <button\r\n class={cn('img06', p.class?.toolBtn)}\r\n onClick={resetView}\r\n title=\"Reset to 100%\"\r\n disabled={scale() === 1}\r\n >\r\n <Maximize2 size={16} />\r\n </button>\r\n\r\n <Show when={hasInfo()}>\r\n <div class=\"img07\" />\r\n <div class=\"relative\">\r\n <button\r\n ref={infoBtnRef}\r\n class={cn('img06', showInfo() && 'bg-white/20 text-white', p.class?.toolBtn)}\r\n onClick={() => setShowInfo(v => !v)}\r\n title=\"Image info\"\r\n >\r\n <Info size={16} />\r\n </button>\r\n\r\n <Show when={showInfo()}>\r\n <div ref={infoPopupRef} class={cn('img09', p.class?.infoPopup)}>\r\n <p class=\"mb-2 text-xs font-semibold tracking-wide text-white/50 uppercase\">\r\n Image Info\r\n </p>\r\n <div class=\"flex flex-col gap-1.5 text-xs\">\r\n <InfoRow label=\"File name\" value={p.imageName} />\r\n <InfoRow label=\"Size\" value={p.size} />\r\n <InfoRow\r\n label=\"Dimension\"\r\n value={\r\n naturalSize() ? `${naturalSize()!.w} × ${naturalSize()!.h} px` : undefined\r\n }\r\n />\r\n <InfoRow label=\"Created\" value={formatDate(p.createdAt)} />\r\n <InfoRow label=\"Modified\" value={formatDate(p.modifiedAt)} />\r\n </div>\r\n </div>\r\n </Show>\r\n </div>\r\n </Show>\r\n </div>\r\n </div>\r\n </ZIndex>\r\n );\r\n}\r\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"input.js","names":["Component","createMemo","lazy","on","InputColorProps","InputDateProps","InputNumberProps","InputOTPProps","InputPasswordProps","InputRangeProps","InputTextAreaProps","InputTextProps","InputRadioProps","InputText","then","m","default","InputNumber","InputColor","InputPassword","InputDate","InputRange","InputTextArea","InputOTP","InputRadio","InputProps","Input","Text","TextArea","Color","Date","Number","Password","Range","OTP","Radio","props","render","type","_$createComponent","_$memo","InputVariantsProps","TextAreaVariantsProps"],"sources":["../../../src/components/input/input.tsx"],"sourcesContent":["import { Component, createMemo, lazy, on } from 'solid-js';\nimport type {\n InputColorProps,\n InputDateProps,\n InputNumberProps,\n InputOTPProps,\n InputPasswordProps,\n InputRangeProps,\n InputTextAreaProps,\n InputTextProps,\n} from './input.types';\nimport { InputRadioProps } from './variants/input-radio';\n\nconst InputText = lazy(() => import('./variants/input-text').then(m => ({ default: m.InputText })));\nconst InputNumber = lazy(() =>\n import('./variants/input-number').then(m => ({ default: m.InputNumber })),\n);\nconst InputColor = lazy(() =>\n import('./variants/input-color').then(m => ({ default: m.InputColor })),\n);\nconst InputPassword = lazy(() =>\n import('./variants/input-password').then(m => ({ default: m.InputPassword })),\n);\nconst InputDate = lazy(() => import('./variants/input-date').then(m => ({ default: m.InputDate })));\nconst InputRange = lazy(() =>\n import('./variants/input-range').then(m => ({ default: m.InputRange })),\n);\nconst InputTextArea = lazy(() =>\n import('./variants/input-textarea').then(m => ({ default: m.InputTextArea })),\n);\nconst InputOTP = lazy(() => import('./variants/input-otp').then(m => ({ default: m.InputOTP })));\n\nconst InputRadio = lazy(() =>\n import('./variants/input-radio').then(m => ({ default: m.InputRadio })),\n);\n\ntype InputProps =\n | InputTextProps\n | InputColorProps\n | InputDateProps\n | InputNumberProps\n | InputPasswordProps\n | InputRangeProps\n | InputTextAreaProps\n | InputOTPProps\n | InputRadioProps;\n\nexport const Input: Component<InputProps> & {\n Text: Component<InputTextProps>;\n TextArea: Component<InputTextAreaProps>;\n Color: Component<InputColorProps>;\n Date: Component<InputDateProps>;\n Number: Component<InputNumberProps>;\n Password: Component<InputPasswordProps>;\n Range: Component<InputRangeProps>;\n OTP: Component<InputOTPProps>;\n Radio: Component<InputRadioProps>;\n} = props => {\n const render = createMemo(\n on(\n () => props.type,\n () => {\n switch (props.type) {\n case 'text':\n return <InputText {...props} />;\n case 'textarea':\n return <InputTextArea {...props} />;\n case 'number':\n return <InputNumber {...props} />;\n case 'password':\n return <InputPassword {...props} />;\n case 'color':\n return <InputColor {...props} />;\n case 'date':\n return <InputDate {...props} />;\n case 'range':\n return <InputRange {...props} />;\n case 'otp':\n return <InputOTP {...props} />;\n case 'radio':\n return <InputRadio {...props} />;\n default:\n return <InputText {...(props as InputTextProps)} />;\n }\n },\n ),\n );\n return <>{render()}</>;\n};\n\nInput.Text = InputText as Component<InputTextProps>;\nInput.TextArea = InputTextArea as Component<InputTextAreaProps>;\nInput.Color = InputColor as Component<InputColorProps>;\nInput.Date = InputDate as Component<InputDateProps>;\nInput.Number = InputNumber as Component<InputNumberProps>;\nInput.Password = InputPassword as Component<InputPasswordProps>;\nInput.Range = InputRange as Component<InputRangeProps>;\nInput.OTP = InputOTP as Component<InputOTPProps>;\nInput.Radio = InputRadio as Component<InputRadioProps>;\nexport type { InputVariantsProps, TextAreaVariantsProps } from './input.utils';\n"],"mappings":"iHAaA,IAAMa,EAAYX,MAAW,OAAO,4BAAyBY,KAAKC,IAAM,CAAEC,QAASD,EAAEF,UAAW,EAAE,CAAC,CAC7FI,EAAcf,MAClB,OAAO,8BAA2BY,KAAKC,IAAM,CAAEC,QAASD,EAAEE,YAAa,EACzE,CAAC,CACKC,EAAahB,MACjB,OAAO,6BAA0BY,KAAKC,IAAM,CAAEC,QAASD,EAAEG,WAAY,EACvE,CAAC,CACKC,EAAgBjB,MACpB,OAAO,gCAA6BY,KAAKC,IAAM,CAAEC,QAASD,EAAEI,cAAe,EAC7E,CAAC,CACKC,EAAYlB,MAAW,OAAO,4BAAyBY,KAAKC,IAAM,CAAEC,QAASD,EAAEK,UAAW,EAAE,CAAC,CAC7FC,EAAanB,MACjB,OAAO,6BAA0BY,KAAKC,IAAM,CAAEC,QAASD,EAAEM,WAAY,EACvE,CAAC,CACKC,EAAgBpB,MACpB,OAAO,gCAA6BY,KAAKC,IAAM,CAAEC,QAASD,EAAEO,cAAe,EAC7E,CAAC,CACKC,EAAWrB,MAAW,OAAO,2BAAwBY,KAAKC,IAAM,CAAEC,QAASD,EAAEQ,SAAU,EAAE,CAAC,CAE1FC,EAAatB,MACjB,OAAO,6BAA0BY,KAAKC,IAAM,CAAEC,QAASD,EAAES,WAAY,EACvE,CAAC,CAaYE,EAUTU,GA8BFI,EA7BevC,EACbE,MACQiC,EAAME,SACN,CACJ,OAAQF,EAAME,KAAd,CACE,IAAK,OACH,OAAAC,EAAQ1B,EAAcuB,EAAK,CAC7B,IAAK,WACH,OAAAG,EAAQjB,EAAkBc,EAAK,CACjC,IAAK,SACH,OAAAG,EAAQtB,EAAgBmB,EAAK,CAC/B,IAAK,WACH,OAAAG,EAAQpB,EAAkBiB,EAAK,CACjC,IAAK,QACH,OAAAG,EAAQrB,EAAekB,EAAK,CAC9B,IAAK,OACH,OAAAG,EAAQnB,EAAcgB,EAAK,CAC7B,IAAK,QACH,OAAAG,EAAQlB,EAAee,EAAK,CAC9B,IAAK,MACH,OAAAG,EAAQhB,EAAaa,EAAK,CAC5B,IAAK,QACH,OAAAG,EAAQf,EAAeY,EAAK,CAC9B,QACE,OAAAG,EAAQ1B,EAAeuB,EAAuB,GAIxD,CAAC,CACe,CAGlBV,EAAMC,KAAOd,EACba,EAAME,SAAWN,EACjBI,EAAMG,MAAQX,EACdQ,EAAMI,KAAOV,EACbM,EAAMK,OAASd,EACfS,EAAMM,SAAWb,EACjBO,EAAMO,MAAQZ,EACdK,EAAMQ,IAAMX,EACZG,EAAMS,MAAQX"}
1
+ {"version":3,"file":"input.js","names":["Component","createMemo","lazy","on","InputColorProps","InputDateProps","InputNumberProps","InputOTPProps","InputPasswordProps","InputRangeProps","InputTextAreaProps","InputTextProps","InputRadioProps","InputText","then","m","default","InputNumber","InputColor","InputPassword","InputDate","InputRange","InputTextArea","InputOTP","InputRadio","InputProps","Input","Text","TextArea","Color","Date","Number","Password","Range","OTP","Radio","props","render","type","_$createComponent","_$memo","InputVariantsProps","TextAreaVariantsProps"],"sources":["../../../src/components/input/input.tsx"],"sourcesContent":["import { Component, createMemo, lazy, on } from 'solid-js';\r\nimport type {\r\n InputColorProps,\r\n InputDateProps,\r\n InputNumberProps,\r\n InputOTPProps,\r\n InputPasswordProps,\r\n InputRangeProps,\r\n InputTextAreaProps,\r\n InputTextProps,\r\n} from './input.types';\r\nimport { InputRadioProps } from './variants/input-radio';\r\n\r\nconst InputText = lazy(() => import('./variants/input-text').then(m => ({ default: m.InputText })));\r\nconst InputNumber = lazy(() =>\r\n import('./variants/input-number').then(m => ({ default: m.InputNumber })),\r\n);\r\nconst InputColor = lazy(() =>\r\n import('./variants/input-color').then(m => ({ default: m.InputColor })),\r\n);\r\nconst InputPassword = lazy(() =>\r\n import('./variants/input-password').then(m => ({ default: m.InputPassword })),\r\n);\r\nconst InputDate = lazy(() => import('./variants/input-date').then(m => ({ default: m.InputDate })));\r\nconst InputRange = lazy(() =>\r\n import('./variants/input-range').then(m => ({ default: m.InputRange })),\r\n);\r\nconst InputTextArea = lazy(() =>\r\n import('./variants/input-textarea').then(m => ({ default: m.InputTextArea })),\r\n);\r\nconst InputOTP = lazy(() => import('./variants/input-otp').then(m => ({ default: m.InputOTP })));\r\n\r\nconst InputRadio = lazy(() =>\r\n import('./variants/input-radio').then(m => ({ default: m.InputRadio })),\r\n);\r\n\r\ntype InputProps =\r\n | InputTextProps\r\n | InputColorProps\r\n | InputDateProps\r\n | InputNumberProps\r\n | InputPasswordProps\r\n | InputRangeProps\r\n | InputTextAreaProps\r\n | InputOTPProps\r\n | InputRadioProps;\r\n\r\nexport const Input: Component<InputProps> & {\r\n Text: Component<InputTextProps>;\r\n TextArea: Component<InputTextAreaProps>;\r\n Color: Component<InputColorProps>;\r\n Date: Component<InputDateProps>;\r\n Number: Component<InputNumberProps>;\r\n Password: Component<InputPasswordProps>;\r\n Range: Component<InputRangeProps>;\r\n OTP: Component<InputOTPProps>;\r\n Radio: Component<InputRadioProps>;\r\n} = props => {\r\n const render = createMemo(\r\n on(\r\n () => props.type,\r\n () => {\r\n switch (props.type) {\r\n case 'text':\r\n return <InputText {...props} />;\r\n case 'textarea':\r\n return <InputTextArea {...props} />;\r\n case 'number':\r\n return <InputNumber {...props} />;\r\n case 'password':\r\n return <InputPassword {...props} />;\r\n case 'color':\r\n return <InputColor {...props} />;\r\n case 'date':\r\n return <InputDate {...props} />;\r\n case 'range':\r\n return <InputRange {...props} />;\r\n case 'otp':\r\n return <InputOTP {...props} />;\r\n case 'radio':\r\n return <InputRadio {...props} />;\r\n default:\r\n return <InputText {...(props as InputTextProps)} />;\r\n }\r\n },\r\n ),\r\n );\r\n return <>{render()}</>;\r\n};\r\n\r\nInput.Text = InputText as Component<InputTextProps>;\r\nInput.TextArea = InputTextArea as Component<InputTextAreaProps>;\r\nInput.Color = InputColor as Component<InputColorProps>;\r\nInput.Date = InputDate as Component<InputDateProps>;\r\nInput.Number = InputNumber as Component<InputNumberProps>;\r\nInput.Password = InputPassword as Component<InputPasswordProps>;\r\nInput.Range = InputRange as Component<InputRangeProps>;\r\nInput.OTP = InputOTP as Component<InputOTPProps>;\r\nInput.Radio = InputRadio as Component<InputRadioProps>;\r\nexport type { InputVariantsProps, TextAreaVariantsProps } from './input.utils';\r\n"],"mappings":"iHAaA,IAAMa,EAAYX,MAAW,OAAO,4BAAyBY,KAAKC,IAAM,CAAEC,QAASD,EAAEF,UAAW,EAAE,CAAC,CAC7FI,EAAcf,MAClB,OAAO,8BAA2BY,KAAKC,IAAM,CAAEC,QAASD,EAAEE,YAAa,EACzE,CAAC,CACKC,EAAahB,MACjB,OAAO,6BAA0BY,KAAKC,IAAM,CAAEC,QAASD,EAAEG,WAAY,EACvE,CAAC,CACKC,EAAgBjB,MACpB,OAAO,gCAA6BY,KAAKC,IAAM,CAAEC,QAASD,EAAEI,cAAe,EAC7E,CAAC,CACKC,EAAYlB,MAAW,OAAO,4BAAyBY,KAAKC,IAAM,CAAEC,QAASD,EAAEK,UAAW,EAAE,CAAC,CAC7FC,EAAanB,MACjB,OAAO,6BAA0BY,KAAKC,IAAM,CAAEC,QAASD,EAAEM,WAAY,EACvE,CAAC,CACKC,EAAgBpB,MACpB,OAAO,gCAA6BY,KAAKC,IAAM,CAAEC,QAASD,EAAEO,cAAe,EAC7E,CAAC,CACKC,EAAWrB,MAAW,OAAO,2BAAwBY,KAAKC,IAAM,CAAEC,QAASD,EAAEQ,SAAU,EAAE,CAAC,CAE1FC,EAAatB,MACjB,OAAO,6BAA0BY,KAAKC,IAAM,CAAEC,QAASD,EAAES,WAAY,EACvE,CAAC,CAaYE,EAUTU,GA8BFI,EA7BevC,EACbE,MACQiC,EAAME,SACN,CACJ,OAAQF,EAAME,KAAd,CACE,IAAK,OACH,OAAAC,EAAQ1B,EAAcuB,EAAK,CAC7B,IAAK,WACH,OAAAG,EAAQjB,EAAkBc,EAAK,CACjC,IAAK,SACH,OAAAG,EAAQtB,EAAgBmB,EAAK,CAC/B,IAAK,WACH,OAAAG,EAAQpB,EAAkBiB,EAAK,CACjC,IAAK,QACH,OAAAG,EAAQrB,EAAekB,EAAK,CAC9B,IAAK,OACH,OAAAG,EAAQnB,EAAcgB,EAAK,CAC7B,IAAK,QACH,OAAAG,EAAQlB,EAAee,EAAK,CAC9B,IAAK,MACH,OAAAG,EAAQhB,EAAaa,EAAK,CAC5B,IAAK,QACH,OAAAG,EAAQf,EAAeY,EAAK,CAC9B,QACE,OAAAG,EAAQ1B,EAAeuB,EAAuB,GAIxD,CAAC,CACe,CAGlBV,EAAMC,KAAOd,EACba,EAAME,SAAWN,EACjBI,EAAMG,MAAQX,EACdQ,EAAMI,KAAOV,EACbM,EAAMK,OAASd,EACfS,EAAMM,SAAWb,EACjBO,EAAMO,MAAQZ,EACdK,EAAMQ,IAAMX,EACZG,EAAMS,MAAQX"}
@@ -1 +1 @@
1
- {"version":3,"file":"input.utils.js","names":[],"sources":["../../../src/components/input/input.utils.ts"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority';\nimport type { InputBaseProps } from './input.types';\n\nexport const inputTextVariants = cva('', {\n variants: {\n size: {\n '4xs': 'h-6.5 text-xs',\n '3xs': 'h-7 text-xs',\n '2xs': 'h-7.5 text-xs',\n xs: 'h-8 text-xs',\n sm: 'h-8.5',\n md: 'h-9',\n lg: 'h-9.5',\n xl: 'h-10 text-base',\n '2xl': 'h-10.5 text-base',\n '3xl': 'h-11 text-base',\n '4xl': 'h-11.5 text-base',\n },\n color: {\n neutral: 'input-neutral',\n primary: 'input-primary',\n secondary: 'input-secondary',\n accent: 'input-accent',\n info: 'input-info',\n success: 'input-success',\n warning: 'input-warning',\n error: 'input-error',\n },\n variant: {\n outline: '',\n borderless: 'border-0 outline-0',\n filled: 'it02',\n },\n },\n});\nexport type InputVariantsProps = VariantProps<typeof inputTextVariants>;\n\nexport const textareaVariants = cva('', {\n variants: {\n color: {\n neutral: 'textarea-neutral',\n primary: 'textarea-primary',\n secondary: 'textarea-secondary',\n accent: 'textarea-accent',\n info: 'textarea-info',\n success: 'textarea-success',\n warning: 'textarea-warning',\n error: 'textarea-error',\n },\n variant: {\n outline: '',\n borderless: 'border-0 outline-0',\n filled: 'ta03',\n },\n size: {\n xs: 'textarea-xs',\n sm: 'textarea-sm',\n md: 'textarea-md',\n lg: 'textarea-lg',\n xl: 'textarea-xl',\n },\n },\n});\nexport type TextAreaVariantsProps = VariantProps<typeof textareaVariants>;\n\nexport const DEFAULT_PROPS: Partial<InputBaseProps> = {\n variant: 'outline',\n allowClear: true,\n color: 'info',\n size: 'md',\n placeholder: '',\n};\n"],"mappings":"+CAGA,IAAa,EAAoB,EAAI,GAAI,CACvC,SAAU,CACR,KAAM,CACJ,MAAO,gBACP,MAAO,cACP,MAAO,iBACP,GAAI,cACJ,GAAI,QACJ,GAAI,MACJ,GAAI,QACJ,GAAI,iBACJ,MAAO,mBACP,MAAO,iBACP,MAAO,mBACR,CACD,MAAO,CACL,QAAS,gBACT,QAAS,gBACT,UAAW,kBACX,OAAQ,eACR,KAAM,aACN,QAAS,gBACT,QAAS,gBACT,MAAO,cACR,CACD,QAAS,CACP,QAAS,GACT,WAAY,qBACZ,OAAQ,OACT,CACF,CACF,CAAC,CAGW,EAAmB,EAAI,GAAI,CACtC,SAAU,CACR,MAAO,CACL,QAAS,mBACT,QAAS,mBACT,UAAW,qBACX,OAAQ,kBACR,KAAM,gBACN,QAAS,mBACT,QAAS,mBACT,MAAO,iBACR,CACD,QAAS,CACP,QAAS,GACT,WAAY,qBACZ,OAAQ,OACT,CACD,KAAM,CACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACL,CACF,CACF,CAAC,CAGW,EAAyC,CACpD,QAAS,UACT,WAAY,GACZ,MAAO,OACP,KAAM,KACN,YAAa,GACd"}
1
+ {"version":3,"file":"input.utils.js","names":[],"sources":["../../../src/components/input/input.utils.ts"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority';\r\nimport type { InputBaseProps } from './input.types';\r\n\r\nexport const inputTextVariants = cva('', {\r\n variants: {\r\n size: {\r\n '4xs': 'h-6.5 text-xs',\r\n '3xs': 'h-7 text-xs',\r\n '2xs': 'h-7.5 text-xs',\r\n xs: 'h-8 text-xs',\r\n sm: 'h-8.5',\r\n md: 'h-9',\r\n lg: 'h-9.5',\r\n xl: 'h-10 text-base',\r\n '2xl': 'h-10.5 text-base',\r\n '3xl': 'h-11 text-base',\r\n '4xl': 'h-11.5 text-base',\r\n },\r\n color: {\r\n neutral: 'input-neutral',\r\n primary: 'input-primary',\r\n secondary: 'input-secondary',\r\n accent: 'input-accent',\r\n info: 'input-info',\r\n success: 'input-success',\r\n warning: 'input-warning',\r\n error: 'input-error',\r\n },\r\n variant: {\r\n outline: '',\r\n borderless: 'border-0 outline-0',\r\n filled: 'it02',\r\n },\r\n },\r\n});\r\nexport type InputVariantsProps = VariantProps<typeof inputTextVariants>;\r\n\r\nexport const textareaVariants = cva('', {\r\n variants: {\r\n color: {\r\n neutral: 'textarea-neutral',\r\n primary: 'textarea-primary',\r\n secondary: 'textarea-secondary',\r\n accent: 'textarea-accent',\r\n info: 'textarea-info',\r\n success: 'textarea-success',\r\n warning: 'textarea-warning',\r\n error: 'textarea-error',\r\n },\r\n variant: {\r\n outline: '',\r\n borderless: 'border-0 outline-0',\r\n filled: 'ta03',\r\n },\r\n size: {\r\n xs: 'textarea-xs',\r\n sm: 'textarea-sm',\r\n md: 'textarea-md',\r\n lg: 'textarea-lg',\r\n xl: 'textarea-xl',\r\n },\r\n },\r\n});\r\nexport type TextAreaVariantsProps = VariantProps<typeof textareaVariants>;\r\n\r\nexport const DEFAULT_PROPS: Partial<InputBaseProps> = {\r\n variant: 'outline',\r\n allowClear: true,\r\n color: 'info',\r\n size: 'md',\r\n placeholder: '',\r\n};\r\n"],"mappings":"+CAGA,IAAa,EAAoB,EAAI,GAAI,CACvC,SAAU,CACR,KAAM,CACJ,MAAO,gBACP,MAAO,cACP,MAAO,iBACP,GAAI,cACJ,GAAI,QACJ,GAAI,MACJ,GAAI,QACJ,GAAI,iBACJ,MAAO,mBACP,MAAO,iBACP,MAAO,mBACR,CACD,MAAO,CACL,QAAS,gBACT,QAAS,gBACT,UAAW,kBACX,OAAQ,eACR,KAAM,aACN,QAAS,gBACT,QAAS,gBACT,MAAO,cACR,CACD,QAAS,CACP,QAAS,GACT,WAAY,qBACZ,OAAQ,OACT,CACF,CACF,CAAC,CAGW,EAAmB,EAAI,GAAI,CACtC,SAAU,CACR,MAAO,CACL,QAAS,mBACT,QAAS,mBACT,UAAW,qBACX,OAAQ,kBACR,KAAM,gBACN,QAAS,mBACT,QAAS,mBACT,MAAO,iBACR,CACD,QAAS,CACP,QAAS,GACT,WAAY,qBACZ,OAAQ,OACT,CACD,KAAM,CACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACL,CACF,CACF,CAAC,CAGW,EAAyC,CACpD,QAAS,UACT,WAAY,GACZ,MAAO,OACP,KAAM,KACN,YAAa,GACd"}
@@ -1 +1 @@
1
- {"version":3,"file":"input-color.js","names":["normalizeHexColor","Component","createSignal","splitProps","InputColorProps","InputText","InputColor","props","p","otherProps","initialValue","value","colorValue","setColorValue","colorPickerLabel","_el$","_tmpl$","_el$2","firstChild","addEventListener","e","newValue","currentTarget","onChange","_$effect","_$createComponent","_$mergeProps","type","typeOrigin","maskOptions","prefixIcon","onInput","normalizedValue","onBlur"],"sources":["../../../../src/components/input/variants/input-color.tsx"],"sourcesContent":["import { normalizeHexColor } from '@/utils/helper';\nimport { Component, createSignal, splitProps } from 'solid-js';\nimport type { InputColorProps } from '../input.types';\nimport { InputText } from './input-text';\n\nexport const InputColor: Component<InputColorProps> = (props => {\n const [p, otherProps] = splitProps(props, ['value', 'onChange', 'onBlur', 'onInput']);\n const initialValue = normalizeHexColor(p.value);\n const [colorValue, setColorValue] = createSignal(initialValue);\n\n const colorPickerLabel = (\n <label class=\"flex cursor-pointer\">\n <input\n type=\"color\"\n value={colorValue()}\n class=\"my-auto size-5 cursor-pointer\"\n onChange={e => {\n const newValue = normalizeHexColor(e.currentTarget.value);\n setColorValue(newValue);\n if (p.onChange) {\n p.onChange(newValue, e);\n }\n }}\n />\n </label>\n );\n\n return (\n <InputText\n {...otherProps}\n type={'text'}\n typeOrigin=\"color\"\n value={colorValue()}\n maskOptions={void 0}\n prefixIcon={colorPickerLabel}\n onInput={(value, e) => {\n setColorValue(value);\n if (p.onInput) {\n p.onInput(value, e);\n }\n }}\n onChange={(value, e) => {\n const normalizedValue = normalizeHexColor(value);\n setColorValue(normalizedValue);\n if (p.onChange) {\n p.onChange(normalizedValue, e);\n }\n }}\n onBlur={(value, e) => {\n const normalizedValue = normalizeHexColor(value);\n setColorValue(normalizedValue);\n if (p.onBlur) {\n p.onBlur(normalizedValue, e);\n }\n }}\n />\n );\n}) as Component<InputColorProps>;\n"],"mappings":"iWAKaM,GAA0CC,GAAS,CAC9D,GAAM,CAACC,EAAGC,GAAcN,EAAWI,EAAO,CAAC,QAAS,WAAY,SAAU,UAAU,CAAC,CAE/E,CAACK,EAAYC,GAAiBX,EADfF,EAAkBQ,EAAEG,MAAM,CACe,CAmB9D,OAAAc,EACGpB,EAASqB,EACJjB,EAAU,CACdkB,KAAM,OACNC,WAAU,QAAA,IACVjB,OAAK,CAAA,OAAEC,GAAY,EACnBiB,YAAa,IAAK,GAClBC,gBAxBkB,CAAA,IAAAf,EAAAC,GAAA,CAAAC,EAAAF,EAAAG,WAIG,OAJHD,EAAAE,iBAAA,SAMNC,GAAK,CACb,IAAMC,EAAWrB,EAAkBoB,EAAEE,cAAcX,MAAM,CACzDE,EAAcQ,EAAS,CACnBb,EAAEe,UACJf,EAAEe,SAASF,EAAUD,EAAE,EAE1B,CAAAI,MAAAP,EAAAN,MARMC,GAAY,CAAA,CAAAG,KAWxB,CAUGgB,SAAUpB,EAAOS,IAAM,CACrBP,EAAcF,EAAM,CAChBH,EAAEuB,SACJvB,EAAEuB,QAAQpB,EAAOS,EAAE,EAGvBG,UAAWZ,EAAOS,IAAM,CACtB,IAAMY,EAAkBhC,EAAkBW,EAAM,CAChDE,EAAcmB,EAAgB,CAC1BxB,EAAEe,UACJf,EAAEe,SAASS,EAAiBZ,EAAE,EAGlCa,QAAStB,EAAOS,IAAM,CACpB,IAAMY,EAAkBhC,EAAkBW,EAAM,CAChDE,EAAcmB,EAAgB,CAC1BxB,EAAEyB,QACJzB,EAAEyB,OAAOD,EAAiBZ,EAAE,EAE/B,CAAA,CAAA"}
1
+ {"version":3,"file":"input-color.js","names":["normalizeHexColor","Component","createSignal","splitProps","InputColorProps","InputText","InputColor","props","p","otherProps","initialValue","value","colorValue","setColorValue","colorPickerLabel","_el$","_tmpl$","_el$2","firstChild","addEventListener","e","newValue","currentTarget","onChange","_$effect","_$createComponent","_$mergeProps","type","typeOrigin","maskOptions","prefixIcon","onInput","normalizedValue","onBlur"],"sources":["../../../../src/components/input/variants/input-color.tsx"],"sourcesContent":["import { normalizeHexColor } from '@/utils/helper';\r\nimport { Component, createSignal, splitProps } from 'solid-js';\r\nimport type { InputColorProps } from '../input.types';\r\nimport { InputText } from './input-text';\r\n\r\nexport const InputColor: Component<InputColorProps> = (props => {\r\n const [p, otherProps] = splitProps(props, ['value', 'onChange', 'onBlur', 'onInput']);\r\n const initialValue = normalizeHexColor(p.value);\r\n const [colorValue, setColorValue] = createSignal(initialValue);\r\n\r\n const colorPickerLabel = (\r\n <label class=\"flex cursor-pointer\">\r\n <input\r\n type=\"color\"\r\n value={colorValue()}\r\n class=\"my-auto size-5 cursor-pointer\"\r\n onChange={e => {\r\n const newValue = normalizeHexColor(e.currentTarget.value);\r\n setColorValue(newValue);\r\n if (p.onChange) {\r\n p.onChange(newValue, e);\r\n }\r\n }}\r\n />\r\n </label>\r\n );\r\n\r\n return (\r\n <InputText\r\n {...otherProps}\r\n type={'text'}\r\n typeOrigin=\"color\"\r\n value={colorValue()}\r\n maskOptions={void 0}\r\n prefixIcon={colorPickerLabel}\r\n onInput={(value, e) => {\r\n setColorValue(value);\r\n if (p.onInput) {\r\n p.onInput(value, e);\r\n }\r\n }}\r\n onChange={(value, e) => {\r\n const normalizedValue = normalizeHexColor(value);\r\n setColorValue(normalizedValue);\r\n if (p.onChange) {\r\n p.onChange(normalizedValue, e);\r\n }\r\n }}\r\n onBlur={(value, e) => {\r\n const normalizedValue = normalizeHexColor(value);\r\n setColorValue(normalizedValue);\r\n if (p.onBlur) {\r\n p.onBlur(normalizedValue, e);\r\n }\r\n }}\r\n />\r\n );\r\n}) as Component<InputColorProps>;\r\n"],"mappings":"iWAKaM,GAA0CC,GAAS,CAC9D,GAAM,CAACC,EAAGC,GAAcN,EAAWI,EAAO,CAAC,QAAS,WAAY,SAAU,UAAU,CAAC,CAE/E,CAACK,EAAYC,GAAiBX,EADfF,EAAkBQ,EAAEG,MAAM,CACe,CAmB9D,OAAAc,EACGpB,EAASqB,EACJjB,EAAU,CACdkB,KAAM,OACNC,WAAU,QAAA,IACVjB,OAAK,CAAA,OAAEC,GAAY,EACnBiB,YAAa,IAAK,GAClBC,gBAxBkB,CAAA,IAAAf,EAAAC,GAAA,CAAAC,EAAAF,EAAAG,WAIG,OAJHD,EAAAE,iBAAA,SAMNC,GAAK,CACb,IAAMC,EAAWrB,EAAkBoB,EAAEE,cAAcX,MAAM,CACzDE,EAAcQ,EAAS,CACnBb,EAAEe,UACJf,EAAEe,SAASF,EAAUD,EAAE,EAE1B,CAAAI,MAAAP,EAAAN,MARMC,GAAY,CAAA,CAAAG,KAWxB,CAUGgB,SAAUpB,EAAOS,IAAM,CACrBP,EAAcF,EAAM,CAChBH,EAAEuB,SACJvB,EAAEuB,QAAQpB,EAAOS,EAAE,EAGvBG,UAAWZ,EAAOS,IAAM,CACtB,IAAMY,EAAkBhC,EAAkBW,EAAM,CAChDE,EAAcmB,EAAgB,CAC1BxB,EAAEe,UACJf,EAAEe,SAASS,EAAiBZ,EAAE,EAGlCa,QAAStB,EAAOS,IAAM,CACpB,IAAMY,EAAkBhC,EAAkBW,EAAM,CAChDE,EAAcmB,EAAgB,CAC1BxB,EAAEyB,QACJzB,EAAEyB,OAAOD,EAAiBZ,EAAE,EAE/B,CAAA,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"input-date.js","names":["Component","createUniqueId","mergeProps","InputDateProps","DEFAULT_PROPS","InputText","InputDate","p","id","_$createComponent","_$mergeProps","type","typeOrigin","maskOptions","allowClear"],"sources":["../../../../src/components/input/variants/input-date.tsx"],"sourcesContent":["import { Component, createUniqueId, mergeProps } from 'solid-js';\nimport type { InputDateProps } from '../input.types';\nimport { DEFAULT_PROPS } from '../input.utils';\nimport { InputText } from './input-text';\n\nexport const InputDate: Component<InputDateProps> = (p => {\n const id = createUniqueId();\n p = mergeProps({ ...DEFAULT_PROPS, id }, p);\n return (\n <InputText\n {...p}\n type={'date' as 'text'}\n typeOrigin=\"date\"\n maskOptions={void 0}\n allowClear={false}\n />\n );\n}) as Component<InputDateProps>;\n"],"mappings":"uNAKA,IAAaM,GAAwCC,GAAK,CACxD,IAAMC,EAAKP,GAAgB,CAE3B,MADAM,GAAIL,EAAW,CAAE,GAAGE,EAAeI,KAAI,CAAED,EAAE,CAC3CE,EACGJ,EAASK,EACJH,EAAC,CACLI,KAAM,OACNC,WAAU,OACVC,YAAa,IAAK,GAClBC,WAAY,GAAK,CAAA,CAAA"}
1
+ {"version":3,"file":"input-date.js","names":["Component","createUniqueId","mergeProps","InputDateProps","DEFAULT_PROPS","InputText","InputDate","p","id","_$createComponent","_$mergeProps","type","typeOrigin","maskOptions","allowClear"],"sources":["../../../../src/components/input/variants/input-date.tsx"],"sourcesContent":["import { Component, createUniqueId, mergeProps } from 'solid-js';\r\nimport type { InputDateProps } from '../input.types';\r\nimport { DEFAULT_PROPS } from '../input.utils';\r\nimport { InputText } from './input-text';\r\n\r\nexport const InputDate: Component<InputDateProps> = (p => {\r\n const id = createUniqueId();\r\n p = mergeProps({ ...DEFAULT_PROPS, id }, p);\r\n return (\r\n <InputText\r\n {...p}\r\n type={'date' as 'text'}\r\n typeOrigin=\"date\"\r\n maskOptions={void 0}\r\n allowClear={false}\r\n />\r\n );\r\n}) as Component<InputDateProps>;\r\n"],"mappings":"uNAKA,IAAaM,GAAwCC,GAAK,CACxD,IAAMC,EAAKP,GAAgB,CAE3B,MADAM,GAAIL,EAAW,CAAE,GAAGE,EAAeI,KAAI,CAAED,EAAE,CAC3CE,EACGJ,EAASK,EACJH,EAAC,CACLI,KAAM,OACNC,WAAU,OACVC,YAAa,IAAK,GAClBC,WAAY,GAAK,CAAA,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"input-number.js","names":["cn","createThrottle","FactoryArg","InputMask","IMask","X","Component","createEffect","createUniqueId","mergeProps","on","onCleanup","onMount","Show","InputNumberProps","DEFAULT_PROPS","inputTextVariants","InputNumber","p","id","offset","wheel","keyboard","maskInstance","inputRef","HTMLInputElement","options","min","Number","NEGATIVE_INFINITY","max","POSITIVE_INFINITY","thousandsSeparator","radix","padFractionalZeros","normalizeZeros","maskOptions","mask","focusInput","focus","maskAcceptEvent","updateValue","delta","currentValue","unmaskedValue","numericValue","parseFloat","newValue","Math","String","onChange","value","Event","onInput","onAccept","handleKeyDown","e","KeyboardEvent","key","preventDefault","handleWheel","WheelEvent","deltaY","updateOptions","defer","InputEvent","destroyNumberMask","off","destroy","handleClear","MouseEvent","stopPropagation","undefined","_el$","_tmpl$2","_el$2","firstChild","$$click","_$insert","prefixIcon","addEventListener","document","activeElement","$$keydown","keyCode","onPressEnter","currentTarget","$$input","onBlur","_ref$","_$use","_$createComponent","when","allowClear","suffixIcon","children","_el$3","_tmpl$","_c$","_$memo","_el$4","_tmpl$3","_c$2","_el$5","_tmpl$4","_$effect","_p$","_v$","color","size","variant","class","input","disabled","_v$2","_v$3","placeholder","_v$4","_$className","t","_$setAttribute","a","o","_$delegateEvents"],"sources":["../../../../src/components/input/variants/input-number.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\nimport { createThrottle } from '@/utils/helper';\nimport type { FactoryArg, InputMask } from 'imask';\nimport IMask from 'imask/holder';\nimport 'imask/masked/number';\nimport X from 'lucide-solid/icons/x';\nimport {\n Component,\n createEffect,\n createUniqueId,\n mergeProps,\n on,\n onCleanup,\n onMount,\n Show,\n} from 'solid-js';\nimport type { InputNumberProps } from '../input.types';\nimport { DEFAULT_PROPS, inputTextVariants } from '../input.utils';\n\nexport const InputNumber: Component<InputNumberProps> = (p => {\n const id = createUniqueId();\n p = mergeProps({ ...DEFAULT_PROPS, id, offset: 1, wheel: false, keyboard: true }, p);\n let maskInstance: InputMask<FactoryArg> | undefined;\n let inputRef: HTMLInputElement | undefined;\n\n const options = () => ({\n min: Number.NEGATIVE_INFINITY,\n max: Number.POSITIVE_INFINITY,\n thousandsSeparator: '_',\n radix: '.',\n padFractionalZeros: false,\n normalizeZeros: true,\n ...p.maskOptions,\n mask: Number,\n });\n\n const focusInput = () => {\n inputRef?.focus();\n };\n\n let maskAcceptEvent: any = null;\n\n const updateValue = (delta: number) => {\n if (!maskInstance) return;\n\n const currentValue = maskInstance.unmaskedValue;\n const numericValue = currentValue === '' ? 0 : parseFloat(currentValue);\n let newValue = numericValue + delta;\n\n const min = p.maskOptions?.min ?? Number.NEGATIVE_INFINITY;\n const max = p.maskOptions?.max ?? Number.POSITIVE_INFINITY;\n newValue = Math.max(min, Math.min(max, newValue));\n\n maskInstance.unmaskedValue = String(newValue);\n maskInstance.updateValue();\n\n p.onChange?.(maskInstance.value, new Event('change'));\n p.onInput?.(maskInstance.value, new Event('input'));\n p.maskOptions?.onAccept?.(maskInstance.value, maskInstance.unmaskedValue);\n };\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!p.keyboard) return;\n\n const offset = p.offset ?? 1;\n\n if (e.key === 'ArrowUp') {\n e.preventDefault();\n updateValue(offset);\n } else if (e.key === 'ArrowDown') {\n e.preventDefault();\n updateValue(-offset);\n }\n };\n\n const handleWheel = createThrottle((e: WheelEvent) => {\n if (!p.wheel) return;\n\n e.preventDefault();\n const offset = p.offset ?? 1;\n const delta = e.deltaY < 0 ? offset : -offset;\n updateValue(delta);\n }, 50);\n\n createEffect(\n on(\n () => options(),\n value => maskInstance && value && maskInstance.updateOptions(value),\n { defer: true },\n ),\n );\n\n onMount(() => {\n if (inputRef) {\n maskInstance = IMask(inputRef, options());\n\n maskAcceptEvent = (e: InputEvent) => {\n p.onChange?.(maskInstance?.value ?? '', e);\n p.maskOptions?.onAccept?.(maskInstance?.value, maskInstance?.unmaskedValue);\n };\n maskInstance.on('accept', maskAcceptEvent);\n }\n });\n\n onCleanup(function destroyNumberMask() {\n if (maskInstance) {\n maskAcceptEvent && maskInstance.off('accept', maskAcceptEvent);\n maskInstance.destroy();\n }\n });\n\n const handleClear = (e: MouseEvent) => {\n e.stopPropagation();\n if (maskInstance) {\n maskInstance.value = '';\n maskInstance.updateValue();\n } else if (inputRef) {\n inputRef.value = '';\n }\n p.onInput?.('', undefined as any);\n p.onChange?.('', undefined as any);\n inputRef?.focus();\n };\n\n return (\n <div\n tabIndex={-1}\n class={cn(\n 'it01',\n inputTextVariants({ color: p.color, size: p.size, variant: p.variant }),\n p.class?.input,\n p.disabled && 'border-c5 pointer-events-none',\n )}\n onClick={focusInput}\n >\n {p.prefixIcon}\n <input\n id={p.id}\n ref={inputRef}\n type=\"text\"\n data-type=\"number\"\n value={p.value ?? ''}\n placeholder={p.placeholder}\n class=\"text-c2 grow\"\n onBlur={e => p.onBlur?.(e.currentTarget.value, e)}\n onChange={e => p.onChange?.(e.currentTarget.value, e)}\n onInput={e => p.onInput?.(e.currentTarget.value, e)}\n onKeyDown={e => {\n if (e.key === 'Enter' || e.keyCode === 13) {\n e.preventDefault();\n p.onPressEnter?.(e.currentTarget.value, e);\n }\n handleKeyDown(e);\n }}\n onWheel={e => {\n if (p.wheel && document.activeElement === inputRef) {\n handleWheel(e);\n }\n }}\n disabled={p.disabled}\n />\n <Show when={p.allowClear || p.suffixIcon}>\n <div class=\"it05\">\n {p.allowClear && (\n <div class=\"it03\" onClick={handleClear}>\n <X class=\"m-auto size-2\" />\n </div>\n )}\n {p.suffixIcon && <div class=\"it04\">{p.suffixIcon}</div>}\n </div>\n </Show>\n </div>\n );\n}) as Component<InputNumberProps>;\n"],"mappings":"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"}
1
+ {"version":3,"file":"input-number.js","names":["cn","createThrottle","FactoryArg","InputMask","IMask","X","Component","createEffect","createUniqueId","mergeProps","on","onCleanup","onMount","Show","InputNumberProps","DEFAULT_PROPS","inputTextVariants","InputNumber","p","id","offset","wheel","keyboard","maskInstance","inputRef","HTMLInputElement","options","min","Number","NEGATIVE_INFINITY","max","POSITIVE_INFINITY","thousandsSeparator","radix","padFractionalZeros","normalizeZeros","maskOptions","mask","focusInput","focus","maskAcceptEvent","updateValue","delta","currentValue","unmaskedValue","numericValue","parseFloat","newValue","Math","String","onChange","value","Event","onInput","onAccept","handleKeyDown","e","KeyboardEvent","key","preventDefault","handleWheel","WheelEvent","deltaY","updateOptions","defer","InputEvent","destroyNumberMask","off","destroy","handleClear","MouseEvent","stopPropagation","undefined","_el$","_tmpl$2","_el$2","firstChild","$$click","_$insert","prefixIcon","addEventListener","document","activeElement","$$keydown","keyCode","onPressEnter","currentTarget","$$input","onBlur","_ref$","_$use","_$createComponent","when","allowClear","suffixIcon","children","_el$3","_tmpl$","_c$","_$memo","_el$4","_tmpl$3","_c$2","_el$5","_tmpl$4","_$effect","_p$","_v$","color","size","variant","class","input","disabled","_v$2","_v$3","placeholder","_v$4","_$className","t","_$setAttribute","a","o","_$delegateEvents"],"sources":["../../../../src/components/input/variants/input-number.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport { createThrottle } from '@/utils/helper';\r\nimport type { FactoryArg, InputMask } from 'imask';\r\nimport IMask from 'imask/holder';\r\nimport 'imask/masked/number';\r\nimport X from 'lucide-solid/icons/x';\r\nimport {\r\n Component,\r\n createEffect,\r\n createUniqueId,\r\n mergeProps,\r\n on,\r\n onCleanup,\r\n onMount,\r\n Show,\r\n} from 'solid-js';\r\nimport type { InputNumberProps } from '../input.types';\r\nimport { DEFAULT_PROPS, inputTextVariants } from '../input.utils';\r\n\r\nexport const InputNumber: Component<InputNumberProps> = (p => {\r\n const id = createUniqueId();\r\n p = mergeProps({ ...DEFAULT_PROPS, id, offset: 1, wheel: false, keyboard: true }, p);\r\n let maskInstance: InputMask<FactoryArg> | undefined;\r\n let inputRef: HTMLInputElement | undefined;\r\n\r\n const options = () => ({\r\n min: Number.NEGATIVE_INFINITY,\r\n max: Number.POSITIVE_INFINITY,\r\n thousandsSeparator: '_',\r\n radix: '.',\r\n padFractionalZeros: false,\r\n normalizeZeros: true,\r\n ...p.maskOptions,\r\n mask: Number,\r\n });\r\n\r\n const focusInput = () => {\r\n inputRef?.focus();\r\n };\r\n\r\n let maskAcceptEvent: any = null;\r\n\r\n const updateValue = (delta: number) => {\r\n if (!maskInstance) return;\r\n\r\n const currentValue = maskInstance.unmaskedValue;\r\n const numericValue = currentValue === '' ? 0 : parseFloat(currentValue);\r\n let newValue = numericValue + delta;\r\n\r\n const min = p.maskOptions?.min ?? Number.NEGATIVE_INFINITY;\r\n const max = p.maskOptions?.max ?? Number.POSITIVE_INFINITY;\r\n newValue = Math.max(min, Math.min(max, newValue));\r\n\r\n maskInstance.unmaskedValue = String(newValue);\r\n maskInstance.updateValue();\r\n\r\n p.onChange?.(maskInstance.value, new Event('change'));\r\n p.onInput?.(maskInstance.value, new Event('input'));\r\n p.maskOptions?.onAccept?.(maskInstance.value, maskInstance.unmaskedValue);\r\n };\r\n\r\n const handleKeyDown = (e: KeyboardEvent) => {\r\n if (!p.keyboard) return;\r\n\r\n const offset = p.offset ?? 1;\r\n\r\n if (e.key === 'ArrowUp') {\r\n e.preventDefault();\r\n updateValue(offset);\r\n } else if (e.key === 'ArrowDown') {\r\n e.preventDefault();\r\n updateValue(-offset);\r\n }\r\n };\r\n\r\n const handleWheel = createThrottle((e: WheelEvent) => {\r\n if (!p.wheel) return;\r\n\r\n e.preventDefault();\r\n const offset = p.offset ?? 1;\r\n const delta = e.deltaY < 0 ? offset : -offset;\r\n updateValue(delta);\r\n }, 50);\r\n\r\n createEffect(\r\n on(\r\n () => options(),\r\n value => maskInstance && value && maskInstance.updateOptions(value),\r\n { defer: true },\r\n ),\r\n );\r\n\r\n onMount(() => {\r\n if (inputRef) {\r\n maskInstance = IMask(inputRef, options());\r\n\r\n maskAcceptEvent = (e: InputEvent) => {\r\n p.onChange?.(maskInstance?.value ?? '', e);\r\n p.maskOptions?.onAccept?.(maskInstance?.value, maskInstance?.unmaskedValue);\r\n };\r\n maskInstance.on('accept', maskAcceptEvent);\r\n }\r\n });\r\n\r\n onCleanup(function destroyNumberMask() {\r\n if (maskInstance) {\r\n maskAcceptEvent && maskInstance.off('accept', maskAcceptEvent);\r\n maskInstance.destroy();\r\n }\r\n });\r\n\r\n const handleClear = (e: MouseEvent) => {\r\n e.stopPropagation();\r\n if (maskInstance) {\r\n maskInstance.value = '';\r\n maskInstance.updateValue();\r\n } else if (inputRef) {\r\n inputRef.value = '';\r\n }\r\n p.onInput?.('', undefined as any);\r\n p.onChange?.('', undefined as any);\r\n inputRef?.focus();\r\n };\r\n\r\n return (\r\n <div\r\n tabIndex={-1}\r\n class={cn(\r\n 'it01',\r\n inputTextVariants({ color: p.color, size: p.size, variant: p.variant }),\r\n p.class?.input,\r\n p.disabled && 'border-c5 pointer-events-none',\r\n )}\r\n onClick={focusInput}\r\n >\r\n {p.prefixIcon}\r\n <input\r\n id={p.id}\r\n ref={inputRef}\r\n type=\"text\"\r\n data-type=\"number\"\r\n value={p.value ?? ''}\r\n placeholder={p.placeholder}\r\n class=\"text-c2 grow\"\r\n onBlur={e => p.onBlur?.(e.currentTarget.value, e)}\r\n onChange={e => p.onChange?.(e.currentTarget.value, e)}\r\n onInput={e => p.onInput?.(e.currentTarget.value, e)}\r\n onKeyDown={e => {\r\n if (e.key === 'Enter' || e.keyCode === 13) {\r\n e.preventDefault();\r\n p.onPressEnter?.(e.currentTarget.value, e);\r\n }\r\n handleKeyDown(e);\r\n }}\r\n onWheel={e => {\r\n if (p.wheel && document.activeElement === inputRef) {\r\n handleWheel(e);\r\n }\r\n }}\r\n disabled={p.disabled}\r\n />\r\n <Show when={p.allowClear || p.suffixIcon}>\r\n <div class=\"it05\">\r\n {p.allowClear && (\r\n <div class=\"it03\" onClick={handleClear}>\r\n <X class=\"m-auto size-2\" />\r\n </div>\r\n )}\r\n {p.suffixIcon && <div class=\"it04\">{p.suffixIcon}</div>}\r\n </div>\r\n </Show>\r\n </div>\r\n );\r\n}) as Component<InputNumberProps>;\r\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"input-otp.js","names":["cn","Component","createEffect","createSignal","For","mergeProps","on","InputOTPProps","getColor","InputOTP","p","color","length","inputMode","allowedChars","disabled","values","setValues","Array","fill","focusedIndex","setFocusedIndex","inputRefs","HTMLInputElement","value","undefined","chars","split","slice","newValues","forEach","char","i","getCombinedValue","join","notifyChange","combined","onChange","every","v","onComplete","updateValue","index","focusInput","focus","getNextIndex","currentIndex","nextIndex","allFilled","handleInput","e","InputEvent","input","target","inputValue","test","blur","handlePaste","ClipboardEvent","preventDefault","pasteData","clipboardData","getData","validChars","filter","lastFilledIndex","nextEmptyIndex","findIndex","handleKeyDown","KeyboardEvent","key","shiftKey","prevIndex","handleFocus","select","handleBlur","_index","FocusEvent","relatedTarget","HTMLElement","isInternalFocus","some","ref","onBlur","handleContainerClick","_el$","_tmpl$","_$insert","_$createComponent","each","children","_","_el$2","_tmpl$2","_el$3","firstChild","$$click","addEventListener","$$keydown","$$input","_$use","el","_$effect","_p$","_v$","class","inputWrap","_v$2","_v$3","_v$4","_v$5","_$className","t","_$setAttribute","a","o","_$memo","separator","_el$4","_tmpl$3","Element","root","_$delegateEvents"],"sources":["../../../../src/components/input/variants/input-otp.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\nimport { Component, createEffect, createSignal, For, mergeProps, on } from 'solid-js';\nimport type { InputOTPProps } from '../input.types';\nimport { getColor } from '@/utils/helper';\n\nexport const InputOTP: Component<InputOTPProps> = p => {\n p = mergeProps(\n {\n color: 'info',\n length: 6,\n inputMode: 'numeric',\n allowedChars: /^[0-9]$/,\n disabled: false,\n } as InputOTPProps,\n p,\n );\n\n const length = () => p.length || 6;\n const allowedChars = () => p.allowedChars || /^[0-9]$/;\n\n const [values, setValues] = createSignal<string[]>(Array(length()).fill(''));\n const [focusedIndex, setFocusedIndex] = createSignal<number | null>(null);\n\n let inputRefs: HTMLInputElement[] = [];\n\n createEffect(\n on(\n () => p.value,\n value => {\n if (value !== undefined) {\n const chars = value.split('').slice(0, length());\n const newValues = Array(length()).fill('');\n chars.forEach((char, i) => {\n newValues[i] = char;\n });\n setValues(newValues);\n }\n },\n ),\n );\n\n const getCombinedValue = () => values().join('');\n\n const notifyChange = (newValues: string[]) => {\n const combined = newValues.join('');\n p.onChange?.(combined);\n\n if (combined.length === length() && newValues.every(v => v !== '')) {\n p.onComplete?.(combined);\n }\n };\n\n const updateValue = (index: number, char: string) => {\n const newValues = [...values()];\n newValues[index] = char;\n setValues(newValues);\n notifyChange(newValues);\n };\n\n const focusInput = (index: number) => {\n if (index >= 0 && index < length() && inputRefs[index]) {\n inputRefs[index].focus();\n }\n };\n\n const getNextIndex = (currentIndex: number): number => {\n let nextIndex = (currentIndex + 1) % length();\n if (nextIndex === 0 && currentIndex === length() - 1) {\n const allFilled = values().every(v => v !== '');\n if (allFilled) {\n return -1;\n }\n }\n return nextIndex;\n };\n\n const handleInput = (index: number, e: InputEvent) => {\n const input = e.target as HTMLInputElement;\n const inputValue = input.value;\n input.value = '';\n\n if (!inputValue) return;\n const char = inputValue[inputValue.length - 1];\n\n if (!allowedChars().test(char)) return;\n\n updateValue(index, char);\n\n const nextIndex = getNextIndex(index);\n if (nextIndex === -1) {\n inputRefs[index]?.blur();\n } else {\n focusInput(nextIndex);\n }\n };\n\n const handlePaste = (index: number, e: ClipboardEvent) => {\n e.preventDefault();\n\n const pasteData = e.clipboardData?.getData('text') || '';\n if (!pasteData) return;\n\n const validChars = pasteData.split('').filter(char => allowedChars().test(char));\n if (validChars.length === 0) return;\n\n const newValues = [...values()];\n let lastFilledIndex = index;\n\n for (let i = 0; i < validChars.length && index + i < length(); i++) {\n newValues[index + i] = validChars[i];\n lastFilledIndex = index + i;\n }\n\n setValues(newValues);\n notifyChange(newValues);\n\n const allFilled = newValues.every(v => v !== '');\n if (allFilled) {\n inputRefs[lastFilledIndex]?.blur();\n } else {\n const nextEmptyIndex = newValues.findIndex((v, i) => i > lastFilledIndex && v === '');\n if (nextEmptyIndex !== -1) {\n focusInput(nextEmptyIndex);\n } else {\n focusInput(lastFilledIndex);\n }\n }\n };\n\n const handleKeyDown = (index: number, e: KeyboardEvent) => {\n switch (e.key) {\n case 'Backspace':\n e.preventDefault();\n if (values()[index]) {\n updateValue(index, '');\n } else if (index > 0) {\n updateValue(index - 1, '');\n focusInput(index - 1);\n }\n break;\n\n case 'Delete':\n e.preventDefault();\n updateValue(index, '');\n break;\n\n case 'ArrowLeft':\n e.preventDefault();\n if (index > 0) focusInput(index - 1);\n break;\n\n case 'ArrowRight':\n e.preventDefault();\n if (index < length() - 1) focusInput(index + 1);\n break;\n\n case 'Tab':\n e.preventDefault();\n if (e.shiftKey) {\n const prevIndex = index === 0 ? length() - 1 : index - 1;\n focusInput(prevIndex);\n } else {\n const nextIndex = (index + 1) % length();\n focusInput(nextIndex);\n }\n break;\n\n case 'ArrowUp':\n case 'ArrowDown':\n e.preventDefault();\n break;\n }\n };\n\n const handleFocus = (index: number) => {\n setFocusedIndex(index);\n inputRefs[index]?.select();\n };\n\n const handleBlur = (_index: number, e: FocusEvent) => {\n const relatedTarget = e.relatedTarget as HTMLElement;\n const isInternalFocus = inputRefs.some(ref => ref === relatedTarget);\n\n if (!isInternalFocus) {\n setFocusedIndex(null);\n p.onBlur?.(getCombinedValue());\n }\n };\n\n const handleContainerClick = (index: number) => {\n if (!p.disabled) focusInput(index);\n };\n\n return (\n <div\n class={cn(\n 'op01',\n getColor(p.color!),\n p.class?.root,\n p.disabled && 'pointer-events-none opacity-50',\n )}\n role=\"group\"\n aria-label=\"OTP Input\"\n >\n <For each={Array(length()).fill(0)}>\n {(_, i) => (\n <>\n <div\n class={cn(\n 'op04',\n focusedIndex() === i() ? 'op02' : 'border-c3 hover:border-c4',\n p.class?.inputWrap,\n p.disabled && 'border-c3',\n )}\n onClick={() => handleContainerClick(i())}\n >\n <input\n ref={el => (inputRefs[i()] = el)}\n type=\"text\"\n inputMode={p.inputMode}\n maxLength={2}\n disabled={p.disabled}\n class={cn('op03', p.class?.input, p.disabled && 'cursor-not-allowed bg-gray-200')}\n autocomplete=\"one-time-code\"\n aria-label={`OTP digit ${i() + 1}`}\n value={values()[i()] || ''}\n onInput={e => handleInput(i(), e)}\n onKeyDown={e => handleKeyDown(i(), e)}\n onPaste={e => handlePaste(i(), e)}\n onFocus={() => handleFocus(i())}\n onBlur={e => handleBlur(i(), e)}\n />\n </div>\n {p.separator && <div class=\"my-auto\">{p.separator as Element}</div>}\n </>\n )}\n </For>\n </div>\n );\n};\n\nexport default InputOTP;\n"],"mappings":"yeAKaS,EAAqCC,GAAK,CACrDA,EAAIL,EACF,CACEM,MAAO,OACPC,OAAQ,EACRC,UAAW,UACXC,aAAc,UACdC,SAAU,GACX,CACDL,EACD,CAED,IAAME,MAAeF,EAAEE,QAAU,EAC3BE,MAAqBJ,EAAEI,cAAgB,UAEvC,CAACE,EAAQC,GAAad,EAAuBe,MAAMN,GAAQ,CAAC,CAACO,KAAK,GAAG,CAAC,CACtE,CAACC,EAAcC,GAAmBlB,EAA4B,KAAK,CAErEmB,EAAgC,EAAE,CAEtCpB,EACEI,MACQI,EAAEc,MACRA,GAAS,CACP,GAAIA,IAAUC,IAAAA,GAAW,CACvB,IAAMC,EAAQF,EAAMG,MAAM,GAAG,CAACC,MAAM,EAAGhB,GAAQ,CAAC,CAC1CiB,EAAYX,MAAMN,GAAQ,CAAC,CAACO,KAAK,GAAG,CAC1CO,EAAMI,SAASC,EAAMC,IAAM,CACzBH,EAAUG,GAAKD,GACf,CACFd,EAAUY,EAAU,GAI5B,CAAC,CAED,IAAMI,MAAyBjB,GAAQ,CAACkB,KAAK,GAAG,CAE1CC,EAAgBN,GAAwB,CAC5C,IAAMO,EAAWP,EAAUK,KAAK,GAAG,CACnCxB,EAAE2B,WAAWD,EAAS,CAElBA,EAASxB,SAAWA,GAAQ,EAAIiB,EAAUS,MAAMC,GAAKA,IAAM,GAAG,EAChE7B,EAAE8B,aAAaJ,EAAS,EAItBK,GAAeC,EAAeX,IAAiB,CACnD,IAAMF,EAAY,CAAC,GAAGb,GAAQ,CAAC,CAC/Ba,EAAUa,GAASX,EACnBd,EAAUY,EAAU,CACpBM,EAAaN,EAAU,EAGnBc,EAAcD,GAAkB,CAChCA,GAAS,GAAKA,EAAQ9B,GAAQ,EAAIU,EAAUoB,IAC9CpB,EAAUoB,GAAOE,OAAO,EAItBC,EAAgBC,GAAiC,CACrD,IAAIC,GAAaD,EAAe,GAAKlC,GAAQ,CAO7C,OANImC,IAAc,GAAKD,IAAiBlC,GAAQ,CAAG,GAC/BI,GAAQ,CAACsB,MAAMC,GAAKA,IAAM,GAAG,CAEtC,GAGJQ,GAGHE,GAAeP,EAAeQ,IAAkB,CACpD,IAAME,EAAQF,EAAEG,OACVC,EAAaF,EAAM5B,MAGzB,GAFA4B,EAAM5B,MAAQ,GAEV,CAAC8B,EAAY,OACjB,IAAMvB,EAAOuB,EAAWA,EAAW1C,OAAS,GAE5C,GAAI,CAACE,GAAc,CAACyC,KAAKxB,EAAK,CAAE,OAEhCU,EAAYC,EAAOX,EAAK,CAExB,IAAMgB,EAAYF,EAAaH,EAAM,CACjCK,IAAc,GAChBzB,EAAUoB,IAAQc,MAAM,CAExBb,EAAWI,EAAU,EAInBU,GAAef,EAAeQ,IAAsB,CACxDA,EAAES,gBAAgB,CAElB,IAAMC,EAAYV,EAAEW,eAAeC,QAAQ,OAAO,EAAI,GACtD,GAAI,CAACF,EAAW,OAEhB,IAAMG,EAAaH,EAAUjC,MAAM,GAAG,CAACqC,OAAOjC,GAAQjB,GAAc,CAACyC,KAAKxB,EAAK,CAAC,CAChF,GAAIgC,EAAWnD,SAAW,EAAG,OAE7B,IAAMiB,EAAY,CAAC,GAAGb,GAAQ,CAAC,CAC3BiD,EAAkBvB,EAEtB,IAAK,IAAIV,EAAI,EAAGA,EAAI+B,EAAWnD,QAAU8B,EAAQV,EAAIpB,GAAQ,CAAEoB,IAC7DH,EAAUa,EAAQV,GAAK+B,EAAW/B,GAClCiC,EAAkBvB,EAAQV,EAO5B,GAJAf,EAAUY,EAAU,CACpBM,EAAaN,EAAU,CAELA,EAAUS,MAAMC,GAAKA,IAAM,GAAG,CAE9CjB,EAAU2C,IAAkBT,MAAM,KAC7B,CACL,IAAMU,EAAiBrC,EAAUsC,WAAW5B,EAAGP,IAAMA,EAAIiC,GAAmB1B,IAAM,GAAG,CAInFI,EAHEuB,IAAmB,GAGVD,EAFAC,EAEgB,GAK3BE,GAAiB1B,EAAeQ,IAAqB,CACzD,OAAQA,EAAEoB,IAAV,CACE,IAAK,YACHpB,EAAES,gBAAgB,CACd3C,GAAQ,CAAC0B,GACXD,EAAYC,EAAO,GAAG,CACbA,EAAQ,IACjBD,EAAYC,EAAQ,EAAG,GAAG,CAC1BC,EAAWD,EAAQ,EAAE,EAEvB,MAEF,IAAK,SACHQ,EAAES,gBAAgB,CAClBlB,EAAYC,EAAO,GAAG,CACtB,MAEF,IAAK,YACHQ,EAAES,gBAAgB,CACdjB,EAAQ,GAAGC,EAAWD,EAAQ,EAAE,CACpC,MAEF,IAAK,aACHQ,EAAES,gBAAgB,CACdjB,EAAQ9B,GAAQ,CAAG,GAAG+B,EAAWD,EAAQ,EAAE,CAC/C,MAEF,IAAK,MACHQ,EAAES,gBAAgB,CACdT,EAAEqB,SAEJ5B,EADkBD,IAAU,EAAI9B,GAAQ,CAAG,EAAI8B,EAAQ,EAClC,CAGrBC,GADmBD,EAAQ,GAAK9B,GAAQ,CACnB,CAEvB,MAEF,IAAK,UACL,IAAK,YACHsC,EAAES,gBAAgB,CAClB,QAIAc,EAAe/B,GAAkB,CACrCrB,EAAgBqB,EAAM,CACtBpB,EAAUoB,IAAQgC,QAAQ,EAGtBC,GAAcC,EAAgB1B,IAAkB,CACpD,IAAM4B,EAAgB5B,EAAE4B,cACAxD,EAAU2D,KAAKC,GAAOA,IAAQJ,EAAc,GAGlEzD,EAAgB,KAAK,CACrBX,EAAEyE,SAASlD,GAAkB,CAAC,GAI5BmD,EAAwB1C,GAAkB,CACzChC,EAAEK,UAAU4B,EAAWD,EAAM,EAGpC,WAAA,CAAA,IAAA2C,EAAAC,GAAA,CAOK,OAPLC,EAAAF,EAAAG,EAWKpF,EAAG,CAAA,IAACqF,MAAI,CAAA,OAAEvE,MAAMN,GAAQ,CAAC,CAACO,KAAK,EAAE,EAAAuE,UAC9BC,EAAG3D,IAAC,MAAA,CAAA,IAAA4D,EAAAC,GAAA,CAAAC,EAAAF,EAAAG,WAoB4B,MApB5BH,GAAAI,YASeZ,EAAqBpD,GAAG,CAAC,CAAA8D,EAAAG,iBAAA,OAgB9B/C,GAAKyB,EAAW3C,GAAG,CAAEkB,EAAE,CAAA,CAAA4C,EAAAG,iBAAA,YADhBxB,EAAYzC,GAAG,CAAC,CAAA,CAAA8D,EAAAG,iBAAA,QADtB/C,GAAKO,EAAYzB,GAAG,CAAEkB,EAAE,CAAA,CAAA4C,EAAAI,UADtBhD,GAAKkB,EAAcpC,GAAG,CAAEkB,EAAE,CAAA4C,EAAAK,QAD5BjD,GAAKD,EAAYjB,GAAG,CAAEkB,EAAE,CAAAkD,EAT5BC,GAAO/E,EAAUU,GAAG,EAAIqE,EAAGP,EAAA,CAAAQ,EAAAC,GAAA,CAAA,IAAAC,EAT3BxG,EACL,OACAoB,GAAc,GAAKY,GAAG,CAAG,OAAS,4BAClCtB,EAAE+F,OAAOC,UACThG,EAAEK,UAAY,YACf,CAAA4F,EAMYjG,EAAEG,UAAS+F,EAEZlG,EAAEK,SAAQ8F,EACb7G,EAAG,OAAQU,EAAE+F,OAAOrD,MAAO1C,EAAEK,UAAY,iCAAiC,CAAA+F,EAErE,aAAa9E,GAAG,CAAG,IAAG,OAAAwE,IAAAD,EAAArD,GAAA6D,EAAAnB,EAAAW,EAAArD,EAAAsD,EAAA,CAAAG,IAAAJ,EAAAS,GAAAC,EAAAnB,EAAA,YAAAS,EAAAS,EAAAL,EAAA,CAAAC,IAAAL,EAAAW,IAAApB,EAAA/E,SAAAwF,EAAAW,EAAAN,GAAAC,IAAAN,EAAAY,GAAAJ,EAAAjB,EAAAS,EAAAY,EAAAN,EAAA,CAAAC,IAAAP,EAAAvE,GAAAiF,EAAAnB,EAAA,aAAAS,EAAAvE,EAAA8E,EAAA,CAAAP,GAAA,CAAArD,EAAAzB,IAAAA,GAAAuF,EAAAvF,IAAAA,GAAAyF,EAAAzF,IAAAA,GAAA0F,EAAA1F,IAAAA,GAAAO,EAAAP,IAAAA,GAAA,CAAA,CAAA6E,MAAAR,EAAAtE,MAC3BR,GAAQ,CAACgB,GAAG,GAAK,GAAE,CAAA4D,KAAA,CAAAwB,MAQ7BA,MAAA,CAAA,CAAA1G,EAAE2G,UAAS,EAAA,OAAA,CAAA,IAAAC,EAAAC,GAAA,CAAgD,OAAhDhC,EAAA+B,MAA0B5G,EAAE2G,UAAoB,CAAAC,KAAO,CAAA,CAAA,CAEtE,CAAA,CAAA,CAAAhB,MAAAS,EAAA1B,EAxCIrF,EACL,OACAQ,EAASE,EAAEC,MAAO,CAClBD,EAAE+F,OAAOgB,KACT/G,EAAEK,UAAY,iCACf,CAAA,CAAA,CAAAsE,KAAA,EAyCiBqC,EAAA,CAAA,QAAA,QAAA,UAAA,CAAA"}
1
+ {"version":3,"file":"input-otp.js","names":["cn","Component","createEffect","createSignal","For","mergeProps","on","InputOTPProps","getColor","InputOTP","p","color","length","inputMode","allowedChars","disabled","values","setValues","Array","fill","focusedIndex","setFocusedIndex","inputRefs","HTMLInputElement","value","undefined","chars","split","slice","newValues","forEach","char","i","getCombinedValue","join","notifyChange","combined","onChange","every","v","onComplete","updateValue","index","focusInput","focus","getNextIndex","currentIndex","nextIndex","allFilled","handleInput","e","InputEvent","input","target","inputValue","test","blur","handlePaste","ClipboardEvent","preventDefault","pasteData","clipboardData","getData","validChars","filter","lastFilledIndex","nextEmptyIndex","findIndex","handleKeyDown","KeyboardEvent","key","shiftKey","prevIndex","handleFocus","select","handleBlur","_index","FocusEvent","relatedTarget","HTMLElement","isInternalFocus","some","ref","onBlur","handleContainerClick","_el$","_tmpl$","_$insert","_$createComponent","each","children","_","_el$2","_tmpl$2","_el$3","firstChild","$$click","addEventListener","$$keydown","$$input","_$use","el","_$effect","_p$","_v$","class","inputWrap","_v$2","_v$3","_v$4","_v$5","_$className","t","_$setAttribute","a","o","_$memo","separator","_el$4","_tmpl$3","Element","root","_$delegateEvents"],"sources":["../../../../src/components/input/variants/input-otp.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport { Component, createEffect, createSignal, For, mergeProps, on } from 'solid-js';\r\nimport type { InputOTPProps } from '../input.types';\r\nimport { getColor } from '@/utils/helper';\r\n\r\nexport const InputOTP: Component<InputOTPProps> = p => {\r\n p = mergeProps(\r\n {\r\n color: 'info',\r\n length: 6,\r\n inputMode: 'numeric',\r\n allowedChars: /^[0-9]$/,\r\n disabled: false,\r\n } as InputOTPProps,\r\n p,\r\n );\r\n\r\n const length = () => p.length || 6;\r\n const allowedChars = () => p.allowedChars || /^[0-9]$/;\r\n\r\n const [values, setValues] = createSignal<string[]>(Array(length()).fill(''));\r\n const [focusedIndex, setFocusedIndex] = createSignal<number | null>(null);\r\n\r\n let inputRefs: HTMLInputElement[] = [];\r\n\r\n createEffect(\r\n on(\r\n () => p.value,\r\n value => {\r\n if (value !== undefined) {\r\n const chars = value.split('').slice(0, length());\r\n const newValues = Array(length()).fill('');\r\n chars.forEach((char, i) => {\r\n newValues[i] = char;\r\n });\r\n setValues(newValues);\r\n }\r\n },\r\n ),\r\n );\r\n\r\n const getCombinedValue = () => values().join('');\r\n\r\n const notifyChange = (newValues: string[]) => {\r\n const combined = newValues.join('');\r\n p.onChange?.(combined);\r\n\r\n if (combined.length === length() && newValues.every(v => v !== '')) {\r\n p.onComplete?.(combined);\r\n }\r\n };\r\n\r\n const updateValue = (index: number, char: string) => {\r\n const newValues = [...values()];\r\n newValues[index] = char;\r\n setValues(newValues);\r\n notifyChange(newValues);\r\n };\r\n\r\n const focusInput = (index: number) => {\r\n if (index >= 0 && index < length() && inputRefs[index]) {\r\n inputRefs[index].focus();\r\n }\r\n };\r\n\r\n const getNextIndex = (currentIndex: number): number => {\r\n let nextIndex = (currentIndex + 1) % length();\r\n if (nextIndex === 0 && currentIndex === length() - 1) {\r\n const allFilled = values().every(v => v !== '');\r\n if (allFilled) {\r\n return -1;\r\n }\r\n }\r\n return nextIndex;\r\n };\r\n\r\n const handleInput = (index: number, e: InputEvent) => {\r\n const input = e.target as HTMLInputElement;\r\n const inputValue = input.value;\r\n input.value = '';\r\n\r\n if (!inputValue) return;\r\n const char = inputValue[inputValue.length - 1];\r\n\r\n if (!allowedChars().test(char)) return;\r\n\r\n updateValue(index, char);\r\n\r\n const nextIndex = getNextIndex(index);\r\n if (nextIndex === -1) {\r\n inputRefs[index]?.blur();\r\n } else {\r\n focusInput(nextIndex);\r\n }\r\n };\r\n\r\n const handlePaste = (index: number, e: ClipboardEvent) => {\r\n e.preventDefault();\r\n\r\n const pasteData = e.clipboardData?.getData('text') || '';\r\n if (!pasteData) return;\r\n\r\n const validChars = pasteData.split('').filter(char => allowedChars().test(char));\r\n if (validChars.length === 0) return;\r\n\r\n const newValues = [...values()];\r\n let lastFilledIndex = index;\r\n\r\n for (let i = 0; i < validChars.length && index + i < length(); i++) {\r\n newValues[index + i] = validChars[i];\r\n lastFilledIndex = index + i;\r\n }\r\n\r\n setValues(newValues);\r\n notifyChange(newValues);\r\n\r\n const allFilled = newValues.every(v => v !== '');\r\n if (allFilled) {\r\n inputRefs[lastFilledIndex]?.blur();\r\n } else {\r\n const nextEmptyIndex = newValues.findIndex((v, i) => i > lastFilledIndex && v === '');\r\n if (nextEmptyIndex !== -1) {\r\n focusInput(nextEmptyIndex);\r\n } else {\r\n focusInput(lastFilledIndex);\r\n }\r\n }\r\n };\r\n\r\n const handleKeyDown = (index: number, e: KeyboardEvent) => {\r\n switch (e.key) {\r\n case 'Backspace':\r\n e.preventDefault();\r\n if (values()[index]) {\r\n updateValue(index, '');\r\n } else if (index > 0) {\r\n updateValue(index - 1, '');\r\n focusInput(index - 1);\r\n }\r\n break;\r\n\r\n case 'Delete':\r\n e.preventDefault();\r\n updateValue(index, '');\r\n break;\r\n\r\n case 'ArrowLeft':\r\n e.preventDefault();\r\n if (index > 0) focusInput(index - 1);\r\n break;\r\n\r\n case 'ArrowRight':\r\n e.preventDefault();\r\n if (index < length() - 1) focusInput(index + 1);\r\n break;\r\n\r\n case 'Tab':\r\n e.preventDefault();\r\n if (e.shiftKey) {\r\n const prevIndex = index === 0 ? length() - 1 : index - 1;\r\n focusInput(prevIndex);\r\n } else {\r\n const nextIndex = (index + 1) % length();\r\n focusInput(nextIndex);\r\n }\r\n break;\r\n\r\n case 'ArrowUp':\r\n case 'ArrowDown':\r\n e.preventDefault();\r\n break;\r\n }\r\n };\r\n\r\n const handleFocus = (index: number) => {\r\n setFocusedIndex(index);\r\n inputRefs[index]?.select();\r\n };\r\n\r\n const handleBlur = (_index: number, e: FocusEvent) => {\r\n const relatedTarget = e.relatedTarget as HTMLElement;\r\n const isInternalFocus = inputRefs.some(ref => ref === relatedTarget);\r\n\r\n if (!isInternalFocus) {\r\n setFocusedIndex(null);\r\n p.onBlur?.(getCombinedValue());\r\n }\r\n };\r\n\r\n const handleContainerClick = (index: number) => {\r\n if (!p.disabled) focusInput(index);\r\n };\r\n\r\n return (\r\n <div\r\n class={cn(\r\n 'op01',\r\n getColor(p.color!),\r\n p.class?.root,\r\n p.disabled && 'pointer-events-none opacity-50',\r\n )}\r\n role=\"group\"\r\n aria-label=\"OTP Input\"\r\n >\r\n <For each={Array(length()).fill(0)}>\r\n {(_, i) => (\r\n <>\r\n <div\r\n class={cn(\r\n 'op04',\r\n focusedIndex() === i() ? 'op02' : 'border-c3 hover:border-c4',\r\n p.class?.inputWrap,\r\n p.disabled && 'border-c3',\r\n )}\r\n onClick={() => handleContainerClick(i())}\r\n >\r\n <input\r\n ref={el => (inputRefs[i()] = el)}\r\n type=\"text\"\r\n inputMode={p.inputMode}\r\n maxLength={2}\r\n disabled={p.disabled}\r\n class={cn('op03', p.class?.input, p.disabled && 'cursor-not-allowed bg-gray-200')}\r\n autocomplete=\"one-time-code\"\r\n aria-label={`OTP digit ${i() + 1}`}\r\n value={values()[i()] || ''}\r\n onInput={e => handleInput(i(), e)}\r\n onKeyDown={e => handleKeyDown(i(), e)}\r\n onPaste={e => handlePaste(i(), e)}\r\n onFocus={() => handleFocus(i())}\r\n onBlur={e => handleBlur(i(), e)}\r\n />\r\n </div>\r\n {p.separator && <div class=\"my-auto\">{p.separator as Element}</div>}\r\n </>\r\n )}\r\n </For>\r\n </div>\r\n );\r\n};\r\n\r\nexport default InputOTP;\r\n"],"mappings":"yeAKaS,EAAqCC,GAAK,CACrDA,EAAIL,EACF,CACEM,MAAO,OACPC,OAAQ,EACRC,UAAW,UACXC,aAAc,UACdC,SAAU,GACX,CACDL,EACD,CAED,IAAME,MAAeF,EAAEE,QAAU,EAC3BE,MAAqBJ,EAAEI,cAAgB,UAEvC,CAACE,EAAQC,GAAad,EAAuBe,MAAMN,GAAQ,CAAC,CAACO,KAAK,GAAG,CAAC,CACtE,CAACC,EAAcC,GAAmBlB,EAA4B,KAAK,CAErEmB,EAAgC,EAAE,CAEtCpB,EACEI,MACQI,EAAEc,MACRA,GAAS,CACP,GAAIA,IAAUC,IAAAA,GAAW,CACvB,IAAMC,EAAQF,EAAMG,MAAM,GAAG,CAACC,MAAM,EAAGhB,GAAQ,CAAC,CAC1CiB,EAAYX,MAAMN,GAAQ,CAAC,CAACO,KAAK,GAAG,CAC1CO,EAAMI,SAASC,EAAMC,IAAM,CACzBH,EAAUG,GAAKD,GACf,CACFd,EAAUY,EAAU,GAI5B,CAAC,CAED,IAAMI,MAAyBjB,GAAQ,CAACkB,KAAK,GAAG,CAE1CC,EAAgBN,GAAwB,CAC5C,IAAMO,EAAWP,EAAUK,KAAK,GAAG,CACnCxB,EAAE2B,WAAWD,EAAS,CAElBA,EAASxB,SAAWA,GAAQ,EAAIiB,EAAUS,MAAMC,GAAKA,IAAM,GAAG,EAChE7B,EAAE8B,aAAaJ,EAAS,EAItBK,GAAeC,EAAeX,IAAiB,CACnD,IAAMF,EAAY,CAAC,GAAGb,GAAQ,CAAC,CAC/Ba,EAAUa,GAASX,EACnBd,EAAUY,EAAU,CACpBM,EAAaN,EAAU,EAGnBc,EAAcD,GAAkB,CAChCA,GAAS,GAAKA,EAAQ9B,GAAQ,EAAIU,EAAUoB,IAC9CpB,EAAUoB,GAAOE,OAAO,EAItBC,EAAgBC,GAAiC,CACrD,IAAIC,GAAaD,EAAe,GAAKlC,GAAQ,CAO7C,OANImC,IAAc,GAAKD,IAAiBlC,GAAQ,CAAG,GAC/BI,GAAQ,CAACsB,MAAMC,GAAKA,IAAM,GAAG,CAEtC,GAGJQ,GAGHE,GAAeP,EAAeQ,IAAkB,CACpD,IAAME,EAAQF,EAAEG,OACVC,EAAaF,EAAM5B,MAGzB,GAFA4B,EAAM5B,MAAQ,GAEV,CAAC8B,EAAY,OACjB,IAAMvB,EAAOuB,EAAWA,EAAW1C,OAAS,GAE5C,GAAI,CAACE,GAAc,CAACyC,KAAKxB,EAAK,CAAE,OAEhCU,EAAYC,EAAOX,EAAK,CAExB,IAAMgB,EAAYF,EAAaH,EAAM,CACjCK,IAAc,GAChBzB,EAAUoB,IAAQc,MAAM,CAExBb,EAAWI,EAAU,EAInBU,GAAef,EAAeQ,IAAsB,CACxDA,EAAES,gBAAgB,CAElB,IAAMC,EAAYV,EAAEW,eAAeC,QAAQ,OAAO,EAAI,GACtD,GAAI,CAACF,EAAW,OAEhB,IAAMG,EAAaH,EAAUjC,MAAM,GAAG,CAACqC,OAAOjC,GAAQjB,GAAc,CAACyC,KAAKxB,EAAK,CAAC,CAChF,GAAIgC,EAAWnD,SAAW,EAAG,OAE7B,IAAMiB,EAAY,CAAC,GAAGb,GAAQ,CAAC,CAC3BiD,EAAkBvB,EAEtB,IAAK,IAAIV,EAAI,EAAGA,EAAI+B,EAAWnD,QAAU8B,EAAQV,EAAIpB,GAAQ,CAAEoB,IAC7DH,EAAUa,EAAQV,GAAK+B,EAAW/B,GAClCiC,EAAkBvB,EAAQV,EAO5B,GAJAf,EAAUY,EAAU,CACpBM,EAAaN,EAAU,CAELA,EAAUS,MAAMC,GAAKA,IAAM,GAAG,CAE9CjB,EAAU2C,IAAkBT,MAAM,KAC7B,CACL,IAAMU,EAAiBrC,EAAUsC,WAAW5B,EAAGP,IAAMA,EAAIiC,GAAmB1B,IAAM,GAAG,CAInFI,EAHEuB,IAAmB,GAGVD,EAFAC,EAEgB,GAK3BE,GAAiB1B,EAAeQ,IAAqB,CACzD,OAAQA,EAAEoB,IAAV,CACE,IAAK,YACHpB,EAAES,gBAAgB,CACd3C,GAAQ,CAAC0B,GACXD,EAAYC,EAAO,GAAG,CACbA,EAAQ,IACjBD,EAAYC,EAAQ,EAAG,GAAG,CAC1BC,EAAWD,EAAQ,EAAE,EAEvB,MAEF,IAAK,SACHQ,EAAES,gBAAgB,CAClBlB,EAAYC,EAAO,GAAG,CACtB,MAEF,IAAK,YACHQ,EAAES,gBAAgB,CACdjB,EAAQ,GAAGC,EAAWD,EAAQ,EAAE,CACpC,MAEF,IAAK,aACHQ,EAAES,gBAAgB,CACdjB,EAAQ9B,GAAQ,CAAG,GAAG+B,EAAWD,EAAQ,EAAE,CAC/C,MAEF,IAAK,MACHQ,EAAES,gBAAgB,CACdT,EAAEqB,SAEJ5B,EADkBD,IAAU,EAAI9B,GAAQ,CAAG,EAAI8B,EAAQ,EAClC,CAGrBC,GADmBD,EAAQ,GAAK9B,GAAQ,CACnB,CAEvB,MAEF,IAAK,UACL,IAAK,YACHsC,EAAES,gBAAgB,CAClB,QAIAc,EAAe/B,GAAkB,CACrCrB,EAAgBqB,EAAM,CACtBpB,EAAUoB,IAAQgC,QAAQ,EAGtBC,GAAcC,EAAgB1B,IAAkB,CACpD,IAAM4B,EAAgB5B,EAAE4B,cACAxD,EAAU2D,KAAKC,GAAOA,IAAQJ,EAAc,GAGlEzD,EAAgB,KAAK,CACrBX,EAAEyE,SAASlD,GAAkB,CAAC,GAI5BmD,EAAwB1C,GAAkB,CACzChC,EAAEK,UAAU4B,EAAWD,EAAM,EAGpC,WAAA,CAAA,IAAA2C,EAAAC,GAAA,CAOK,OAPLC,EAAAF,EAAAG,EAWKpF,EAAG,CAAA,IAACqF,MAAI,CAAA,OAAEvE,MAAMN,GAAQ,CAAC,CAACO,KAAK,EAAE,EAAAuE,UAC9BC,EAAG3D,IAAC,MAAA,CAAA,IAAA4D,EAAAC,GAAA,CAAAC,EAAAF,EAAAG,WAoB4B,MApB5BH,GAAAI,YASeZ,EAAqBpD,GAAG,CAAC,CAAA8D,EAAAG,iBAAA,OAgB9B/C,GAAKyB,EAAW3C,GAAG,CAAEkB,EAAE,CAAA,CAAA4C,EAAAG,iBAAA,YADhBxB,EAAYzC,GAAG,CAAC,CAAA,CAAA8D,EAAAG,iBAAA,QADtB/C,GAAKO,EAAYzB,GAAG,CAAEkB,EAAE,CAAA,CAAA4C,EAAAI,UADtBhD,GAAKkB,EAAcpC,GAAG,CAAEkB,EAAE,CAAA4C,EAAAK,QAD5BjD,GAAKD,EAAYjB,GAAG,CAAEkB,EAAE,CAAAkD,EAT5BC,GAAO/E,EAAUU,GAAG,EAAIqE,EAAGP,EAAA,CAAAQ,EAAAC,GAAA,CAAA,IAAAC,EAT3BxG,EACL,OACAoB,GAAc,GAAKY,GAAG,CAAG,OAAS,4BAClCtB,EAAE+F,OAAOC,UACThG,EAAEK,UAAY,YACf,CAAA4F,EAMYjG,EAAEG,UAAS+F,EAEZlG,EAAEK,SAAQ8F,EACb7G,EAAG,OAAQU,EAAE+F,OAAOrD,MAAO1C,EAAEK,UAAY,iCAAiC,CAAA+F,EAErE,aAAa9E,GAAG,CAAG,IAAG,OAAAwE,IAAAD,EAAArD,GAAA6D,EAAAnB,EAAAW,EAAArD,EAAAsD,EAAA,CAAAG,IAAAJ,EAAAS,GAAAC,EAAAnB,EAAA,YAAAS,EAAAS,EAAAL,EAAA,CAAAC,IAAAL,EAAAW,IAAApB,EAAA/E,SAAAwF,EAAAW,EAAAN,GAAAC,IAAAN,EAAAY,GAAAJ,EAAAjB,EAAAS,EAAAY,EAAAN,EAAA,CAAAC,IAAAP,EAAAvE,GAAAiF,EAAAnB,EAAA,aAAAS,EAAAvE,EAAA8E,EAAA,CAAAP,GAAA,CAAArD,EAAAzB,IAAAA,GAAAuF,EAAAvF,IAAAA,GAAAyF,EAAAzF,IAAAA,GAAA0F,EAAA1F,IAAAA,GAAAO,EAAAP,IAAAA,GAAA,CAAA,CAAA6E,MAAAR,EAAAtE,MAC3BR,GAAQ,CAACgB,GAAG,GAAK,GAAE,CAAA4D,KAAA,CAAAwB,MAQ7BA,MAAA,CAAA,CAAA1G,EAAE2G,UAAS,EAAA,OAAA,CAAA,IAAAC,EAAAC,GAAA,CAAgD,OAAhDhC,EAAA+B,MAA0B5G,EAAE2G,UAAoB,CAAAC,KAAO,CAAA,CAAA,CAEtE,CAAA,CAAA,CAAAhB,MAAAS,EAAA1B,EAxCIrF,EACL,OACAQ,EAASE,EAAEC,MAAO,CAClBD,EAAE+F,OAAOgB,KACT/G,EAAEK,UAAY,iCACf,CAAA,CAAA,CAAAsE,KAAA,EAyCiBqC,EAAA,CAAA,QAAA,QAAA,UAAA,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"input-password.js","names":["cn","Eye","EyeOff","Component","createSignal","createUniqueId","mergeProps","InputPasswordProps","DEFAULT_PROPS","InputText","InputPassword","p","id","showPassword","setShowPassword","timeoutId","ReturnType","setTimeout","togglePasswordVisibility","e","MouseEvent","stopPropagation","undefined","clearTimeout","next","_$createComponent","_$mergeProps","type","typeOrigin","maskOptions","suffixIcon","_el$","_tmpl$","$$click","_$insert","class","_$delegateEvents"],"sources":["../../../../src/components/input/variants/input-password.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\nimport Eye from 'lucide-solid/icons/eye';\nimport EyeOff from 'lucide-solid/icons/eye-off';\nimport { Component, createSignal, createUniqueId, mergeProps } from 'solid-js';\nimport type { InputPasswordProps } from '../input.types';\nimport { DEFAULT_PROPS } from '../input.utils';\nimport { InputText } from './input-text';\n\nexport const InputPassword: Component<InputPasswordProps> = (p => {\n p = mergeProps({ ...DEFAULT_PROPS, id: createUniqueId() }, p);\n\n const [showPassword, setShowPassword] = createSignal(false);\n let timeoutId: ReturnType<typeof setTimeout> | undefined;\n\n const togglePasswordVisibility = (e: MouseEvent) => {\n e.stopPropagation();\n if (timeoutId !== undefined) {\n clearTimeout(timeoutId);\n timeoutId = undefined;\n }\n const next = !showPassword();\n setShowPassword(next);\n if (next) {\n timeoutId = setTimeout(() => {\n setShowPassword(false);\n timeoutId = undefined;\n }, 1000);\n }\n };\n\n return (\n <InputText\n {...p}\n type={(showPassword() ? 'text' : 'password') as 'text'}\n typeOrigin=\"password\"\n maskOptions={void 0}\n suffixIcon={\n <div class=\"ipa01\" onClick={togglePasswordVisibility}>\n <EyeOff class={cn('ipa02', showPassword() ? 'opacity-100' : 'opacity-0')} />\n <Eye class={cn('ipa03', !showPassword() ? 'opacity-100' : 'opacity-0')} />\n </div>\n }\n />\n );\n}) as Component<InputPasswordProps>;\n"],"mappings":"8aAQaU,GAAgDC,GAAK,CAChEA,EAAIL,EAAW,CAAE,GAAGE,EAAeI,GAAIP,GAAe,CAAG,CAAEM,EAAE,CAE7D,GAAM,CAACE,EAAcC,GAAmBV,EAAa,GAAM,CACvDW,EAEEG,EAA4BC,GAAkB,CAClDA,EAAEE,iBAAiB,CACfN,IAAcO,IAAAA,KAChBC,aAAaR,EAAU,CACvBA,EAAYO,IAAAA,IAEd,IAAME,EAAO,CAACX,GAAc,CAC5BC,EAAgBU,EAAK,CACjBA,IACFT,EAAYE,eAAiB,CAC3BH,EAAgB,GAAM,CACtBC,EAAYO,IAAAA,IACX,IAAK,GAIZ,OAAAG,EACGhB,EAASiB,EACJf,EAAC,CAAA,IACLgB,MAAI,CAAA,OAAGd,GAAc,CAAG,OAAS,YACjCe,WAAU,WACVC,YAAa,IAAK,GAAC,IACnBC,YAAU,CAAA,WAAA,CAAA,IAAAC,EAAAC,GAAA,CAGgE,MAHhED,GAAAE,QACoBf,EAAwBgB,EAAAH,EAAAN,EACjDvB,EAAM,CAAA,IAAA,OAAA,CAAA,OAAQF,EAAG,QAASa,GAAc,CAAG,cAAgB,YAAY,EAAA,CAAA,CAAA,KAAA,CAAAqB,EAAAH,EAAAN,EACvExB,EAAG,CAAA,IAAA,OAAA,CAAA,OAAQD,EAAG,QAAUa,GAAc,CAAmB,YAAhB,cAA4B,EAAA,CAAA,CAAA,KAAA,CAAAkB,KAAA,EAAA,CAAA,CAAA,GAK5CK,EAAA,CAAA,QAAA,CAAA"}
1
+ {"version":3,"file":"input-password.js","names":["cn","Eye","EyeOff","Component","createSignal","createUniqueId","mergeProps","InputPasswordProps","DEFAULT_PROPS","InputText","InputPassword","p","id","showPassword","setShowPassword","timeoutId","ReturnType","setTimeout","togglePasswordVisibility","e","MouseEvent","stopPropagation","undefined","clearTimeout","next","_$createComponent","_$mergeProps","type","typeOrigin","maskOptions","suffixIcon","_el$","_tmpl$","$$click","_$insert","class","_$delegateEvents"],"sources":["../../../../src/components/input/variants/input-password.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\r\nimport Eye from 'lucide-solid/icons/eye';\r\nimport EyeOff from 'lucide-solid/icons/eye-off';\r\nimport { Component, createSignal, createUniqueId, mergeProps } from 'solid-js';\r\nimport type { InputPasswordProps } from '../input.types';\r\nimport { DEFAULT_PROPS } from '../input.utils';\r\nimport { InputText } from './input-text';\r\n\r\nexport const InputPassword: Component<InputPasswordProps> = (p => {\r\n p = mergeProps({ ...DEFAULT_PROPS, id: createUniqueId() }, p);\r\n\r\n const [showPassword, setShowPassword] = createSignal(false);\r\n let timeoutId: ReturnType<typeof setTimeout> | undefined;\r\n\r\n const togglePasswordVisibility = (e: MouseEvent) => {\r\n e.stopPropagation();\r\n if (timeoutId !== undefined) {\r\n clearTimeout(timeoutId);\r\n timeoutId = undefined;\r\n }\r\n const next = !showPassword();\r\n setShowPassword(next);\r\n if (next) {\r\n timeoutId = setTimeout(() => {\r\n setShowPassword(false);\r\n timeoutId = undefined;\r\n }, 1000);\r\n }\r\n };\r\n\r\n return (\r\n <InputText\r\n {...p}\r\n type={(showPassword() ? 'text' : 'password') as 'text'}\r\n typeOrigin=\"password\"\r\n maskOptions={void 0}\r\n suffixIcon={\r\n <div class=\"ipa01\" onClick={togglePasswordVisibility}>\r\n <EyeOff class={cn('ipa02', showPassword() ? 'opacity-100' : 'opacity-0')} />\r\n <Eye class={cn('ipa03', !showPassword() ? 'opacity-100' : 'opacity-0')} />\r\n </div>\r\n }\r\n />\r\n );\r\n}) as Component<InputPasswordProps>;\r\n"],"mappings":"8aAQaU,GAAgDC,GAAK,CAChEA,EAAIL,EAAW,CAAE,GAAGE,EAAeI,GAAIP,GAAe,CAAG,CAAEM,EAAE,CAE7D,GAAM,CAACE,EAAcC,GAAmBV,EAAa,GAAM,CACvDW,EAEEG,EAA4BC,GAAkB,CAClDA,EAAEE,iBAAiB,CACfN,IAAcO,IAAAA,KAChBC,aAAaR,EAAU,CACvBA,EAAYO,IAAAA,IAEd,IAAME,EAAO,CAACX,GAAc,CAC5BC,EAAgBU,EAAK,CACjBA,IACFT,EAAYE,eAAiB,CAC3BH,EAAgB,GAAM,CACtBC,EAAYO,IAAAA,IACX,IAAK,GAIZ,OAAAG,EACGhB,EAASiB,EACJf,EAAC,CAAA,IACLgB,MAAI,CAAA,OAAGd,GAAc,CAAG,OAAS,YACjCe,WAAU,WACVC,YAAa,IAAK,GAAC,IACnBC,YAAU,CAAA,WAAA,CAAA,IAAAC,EAAAC,GAAA,CAGgE,MAHhED,GAAAE,QACoBf,EAAwBgB,EAAAH,EAAAN,EACjDvB,EAAM,CAAA,IAAA,OAAA,CAAA,OAAQF,EAAG,QAASa,GAAc,CAAG,cAAgB,YAAY,EAAA,CAAA,CAAA,KAAA,CAAAqB,EAAAH,EAAAN,EACvExB,EAAG,CAAA,IAAA,OAAA,CAAA,OAAQD,EAAG,QAAUa,GAAc,CAAmB,YAAhB,cAA4B,EAAA,CAAA,CAAA,KAAA,CAAAkB,KAAA,EAAA,CAAA,CAAA,GAK5CK,EAAA,CAAA,QAAA,CAAA"}