@tribepad/themis 1.0.1 → 1.0.3

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 (308) hide show
  1. package/dist/elements/Accordion/index.js +1 -335
  2. package/dist/elements/Accordion/index.js.map +1 -1
  3. package/dist/elements/Accordion/index.mjs +1 -317
  4. package/dist/elements/Accordion/index.mjs.map +1 -1
  5. package/dist/elements/AlertDialog/AlertDialog.d.ts +43 -0
  6. package/dist/elements/AlertDialog/AlertDialog.d.ts.map +1 -0
  7. package/dist/elements/AlertDialog/AlertDialog.styles.d.ts +15 -0
  8. package/dist/elements/AlertDialog/AlertDialog.styles.d.ts.map +1 -0
  9. package/dist/elements/AlertDialog/AlertDialog.types.d.ts +72 -0
  10. package/dist/elements/AlertDialog/AlertDialog.types.d.ts.map +1 -0
  11. package/dist/elements/AlertDialog/index.d.ts +25 -0
  12. package/dist/elements/AlertDialog/index.d.ts.map +1 -0
  13. package/dist/elements/AlertDialog/index.js +3 -0
  14. package/dist/elements/AlertDialog/index.js.map +1 -0
  15. package/dist/elements/AlertDialog/index.mjs +3 -0
  16. package/dist/elements/AlertDialog/index.mjs.map +1 -0
  17. package/dist/elements/Avatar/index.js +1 -468
  18. package/dist/elements/Avatar/index.js.map +1 -1
  19. package/dist/elements/Avatar/index.mjs +1 -456
  20. package/dist/elements/Avatar/index.mjs.map +1 -1
  21. package/dist/elements/Badge/index.js +1 -243
  22. package/dist/elements/Badge/index.js.map +1 -1
  23. package/dist/elements/Badge/index.mjs +1 -234
  24. package/dist/elements/Badge/index.mjs.map +1 -1
  25. package/dist/elements/Breadcrumbs/index.js +1 -821
  26. package/dist/elements/Breadcrumbs/index.js.map +1 -1
  27. package/dist/elements/Breadcrumbs/index.mjs +1 -810
  28. package/dist/elements/Breadcrumbs/index.mjs.map +1 -1
  29. package/dist/elements/Button/Button.d.ts +26 -81
  30. package/dist/elements/Button/Button.d.ts.map +1 -1
  31. package/dist/elements/Button/Button.styles.d.ts +35 -0
  32. package/dist/elements/Button/Button.styles.d.ts.map +1 -0
  33. package/dist/elements/Button/Button.types.d.ts +20 -8
  34. package/dist/elements/Button/Button.types.d.ts.map +1 -1
  35. package/dist/elements/Button/index.js +1 -288
  36. package/dist/elements/Button/index.js.map +1 -1
  37. package/dist/elements/Button/index.mjs +1 -283
  38. package/dist/elements/Button/index.mjs.map +1 -1
  39. package/dist/elements/ButtonGroup/index.js +1 -237
  40. package/dist/elements/ButtonGroup/index.js.map +1 -1
  41. package/dist/elements/ButtonGroup/index.mjs +1 -222
  42. package/dist/elements/ButtonGroup/index.mjs.map +1 -1
  43. package/dist/elements/Card/index.js +1 -579
  44. package/dist/elements/Card/index.js.map +1 -1
  45. package/dist/elements/Card/index.mjs +1 -560
  46. package/dist/elements/Card/index.mjs.map +1 -1
  47. package/dist/elements/Carousel/Carousel.d.ts +1 -11
  48. package/dist/elements/Carousel/Carousel.d.ts.map +1 -1
  49. package/dist/elements/Carousel/LazyCarousel.d.ts +1 -1
  50. package/dist/elements/Carousel/LazyCarousel.d.ts.map +1 -1
  51. package/dist/elements/Carousel/index.js +1 -789
  52. package/dist/elements/Carousel/index.js.map +1 -1
  53. package/dist/elements/Carousel/index.mjs +1 -786
  54. package/dist/elements/Carousel/index.mjs.map +1 -1
  55. package/dist/elements/Chart/ChartContext.d.ts.map +1 -1
  56. package/dist/elements/Chart/index.js +1 -1842
  57. package/dist/elements/Chart/index.js.map +1 -1
  58. package/dist/elements/Chart/index.mjs +1 -1832
  59. package/dist/elements/Chart/index.mjs.map +1 -1
  60. package/dist/elements/Checkbox/index.js +1 -316
  61. package/dist/elements/Checkbox/index.js.map +1 -1
  62. package/dist/elements/Checkbox/index.mjs +1 -306
  63. package/dist/elements/Checkbox/index.mjs.map +1 -1
  64. package/dist/elements/CheckboxGroup/index.js +1 -455
  65. package/dist/elements/CheckboxGroup/index.js.map +1 -1
  66. package/dist/elements/CheckboxGroup/index.mjs +1 -439
  67. package/dist/elements/CheckboxGroup/index.mjs.map +1 -1
  68. package/dist/elements/Combobox/Combobox.d.ts +56 -0
  69. package/dist/elements/Combobox/Combobox.d.ts.map +1 -0
  70. package/dist/elements/Combobox/Combobox.styles.d.ts +29 -0
  71. package/dist/elements/Combobox/Combobox.styles.d.ts.map +1 -0
  72. package/dist/elements/Combobox/Combobox.types.d.ts +67 -0
  73. package/dist/elements/Combobox/Combobox.types.d.ts.map +1 -0
  74. package/dist/elements/Combobox/index.d.ts +20 -0
  75. package/dist/elements/Combobox/index.d.ts.map +1 -0
  76. package/dist/elements/Combobox/index.js +3 -0
  77. package/dist/elements/Combobox/index.js.map +1 -0
  78. package/dist/elements/Combobox/index.mjs +3 -0
  79. package/dist/elements/Combobox/index.mjs.map +1 -0
  80. package/dist/elements/DatePicker/DatePicker.d.ts +1 -1
  81. package/dist/elements/DatePicker/DatePicker.d.ts.map +1 -1
  82. package/dist/elements/DatePicker/index.js +1 -903
  83. package/dist/elements/DatePicker/index.js.map +1 -1
  84. package/dist/elements/DatePicker/index.mjs +1 -853
  85. package/dist/elements/DatePicker/index.mjs.map +1 -1
  86. package/dist/elements/Dropdown/Dropdown.d.ts +7 -15
  87. package/dist/elements/Dropdown/Dropdown.d.ts.map +1 -1
  88. package/dist/elements/Dropdown/Dropdown.styles.d.ts +22 -0
  89. package/dist/elements/Dropdown/Dropdown.styles.d.ts.map +1 -0
  90. package/dist/elements/Dropdown/index.d.ts +1 -0
  91. package/dist/elements/Dropdown/index.d.ts.map +1 -1
  92. package/dist/elements/Dropdown/index.js +1 -193
  93. package/dist/elements/Dropdown/index.js.map +1 -1
  94. package/dist/elements/Dropdown/index.mjs +1 -184
  95. package/dist/elements/Dropdown/index.mjs.map +1 -1
  96. package/dist/elements/FileField/index.js +1 -1539
  97. package/dist/elements/FileField/index.js.map +1 -1
  98. package/dist/elements/FileField/index.mjs +1 -1507
  99. package/dist/elements/FileField/index.mjs.map +1 -1
  100. package/dist/elements/FormLayout/index.js +1 -170
  101. package/dist/elements/FormLayout/index.js.map +1 -1
  102. package/dist/elements/FormLayout/index.mjs +1 -167
  103. package/dist/elements/FormLayout/index.mjs.map +1 -1
  104. package/dist/elements/Modal/Modal.d.ts +9 -14
  105. package/dist/elements/Modal/Modal.d.ts.map +1 -1
  106. package/dist/elements/Modal/Modal.styles.d.ts +29 -0
  107. package/dist/elements/Modal/Modal.styles.d.ts.map +1 -0
  108. package/dist/elements/Modal/index.d.ts +1 -0
  109. package/dist/elements/Modal/index.d.ts.map +1 -1
  110. package/dist/elements/Modal/index.js +1 -232
  111. package/dist/elements/Modal/index.js.map +1 -1
  112. package/dist/elements/Modal/index.mjs +1 -220
  113. package/dist/elements/Modal/index.mjs.map +1 -1
  114. package/dist/elements/NumberField/NumberField.variants.d.ts +1 -1
  115. package/dist/elements/NumberField/index.js +1 -666
  116. package/dist/elements/NumberField/index.js.map +1 -1
  117. package/dist/elements/NumberField/index.mjs +1 -654
  118. package/dist/elements/NumberField/index.mjs.map +1 -1
  119. package/dist/elements/OTPInput/OTPInput.d.ts.map +1 -1
  120. package/dist/elements/OTPInput/index.js +1 -734
  121. package/dist/elements/OTPInput/index.js.map +1 -1
  122. package/dist/elements/OTPInput/index.mjs +1 -732
  123. package/dist/elements/OTPInput/index.mjs.map +1 -1
  124. package/dist/elements/Pagination/Pagination.d.ts +45 -0
  125. package/dist/elements/Pagination/Pagination.d.ts.map +1 -0
  126. package/dist/elements/Pagination/Pagination.styles.d.ts +10 -0
  127. package/dist/elements/Pagination/Pagination.styles.d.ts.map +1 -0
  128. package/dist/elements/Pagination/Pagination.types.d.ts +55 -0
  129. package/dist/elements/Pagination/Pagination.types.d.ts.map +1 -0
  130. package/dist/elements/Pagination/index.d.ts +21 -0
  131. package/dist/elements/Pagination/index.d.ts.map +1 -0
  132. package/dist/elements/Pagination/index.js +3 -0
  133. package/dist/elements/Pagination/index.js.map +1 -0
  134. package/dist/elements/Pagination/index.mjs +3 -0
  135. package/dist/elements/Pagination/index.mjs.map +1 -0
  136. package/dist/elements/Panel/index.js +1 -330
  137. package/dist/elements/Panel/index.js.map +1 -1
  138. package/dist/elements/Panel/index.mjs +1 -323
  139. package/dist/elements/Panel/index.mjs.map +1 -1
  140. package/dist/elements/PasswordField/PasswordField.d.ts +27 -0
  141. package/dist/elements/PasswordField/PasswordField.d.ts.map +1 -0
  142. package/dist/elements/PasswordField/PasswordField.styles.d.ts +32 -0
  143. package/dist/elements/PasswordField/PasswordField.styles.d.ts.map +1 -0
  144. package/dist/elements/PasswordField/PasswordField.types.d.ts +100 -0
  145. package/dist/elements/PasswordField/PasswordField.types.d.ts.map +1 -0
  146. package/dist/elements/PasswordField/index.css +2 -0
  147. package/dist/elements/PasswordField/index.css.map +1 -0
  148. package/dist/elements/PasswordField/index.d.ts +20 -0
  149. package/dist/elements/PasswordField/index.d.ts.map +1 -0
  150. package/dist/elements/PasswordField/index.js +3 -0
  151. package/dist/elements/PasswordField/index.js.map +1 -0
  152. package/dist/elements/PasswordField/index.mjs +3 -0
  153. package/dist/elements/PasswordField/index.mjs.map +1 -0
  154. package/dist/elements/Progress/index.js +1 -187
  155. package/dist/elements/Progress/index.js.map +1 -1
  156. package/dist/elements/Progress/index.mjs +1 -181
  157. package/dist/elements/Progress/index.mjs.map +1 -1
  158. package/dist/elements/RadioGroup/index.js +1 -369
  159. package/dist/elements/RadioGroup/index.js.map +1 -1
  160. package/dist/elements/RadioGroup/index.mjs +1 -359
  161. package/dist/elements/RadioGroup/index.mjs.map +1 -1
  162. package/dist/elements/Resizable/index.js +1 -1580
  163. package/dist/elements/Resizable/index.js.map +1 -1
  164. package/dist/elements/Resizable/index.mjs +1 -1566
  165. package/dist/elements/Resizable/index.mjs.map +1 -1
  166. package/dist/elements/SearchField/SearchField.d.ts +27 -0
  167. package/dist/elements/SearchField/SearchField.d.ts.map +1 -0
  168. package/dist/elements/SearchField/SearchField.styles.d.ts +32 -0
  169. package/dist/elements/SearchField/SearchField.styles.d.ts.map +1 -0
  170. package/dist/elements/SearchField/SearchField.types.d.ts +45 -0
  171. package/dist/elements/SearchField/SearchField.types.d.ts.map +1 -0
  172. package/dist/elements/SearchField/index.css +2 -0
  173. package/dist/elements/SearchField/index.css.map +1 -0
  174. package/dist/elements/SearchField/index.d.ts +21 -0
  175. package/dist/elements/SearchField/index.d.ts.map +1 -0
  176. package/dist/elements/SearchField/index.js +3 -0
  177. package/dist/elements/SearchField/index.js.map +1 -0
  178. package/dist/elements/SearchField/index.mjs +3 -0
  179. package/dist/elements/SearchField/index.mjs.map +1 -0
  180. package/dist/elements/Select/Select.d.ts +19 -48
  181. package/dist/elements/Select/Select.d.ts.map +1 -1
  182. package/dist/elements/Select/Select.styles.d.ts +55 -0
  183. package/dist/elements/Select/Select.styles.d.ts.map +1 -0
  184. package/dist/elements/Select/index.js +1 -589
  185. package/dist/elements/Select/index.js.map +1 -1
  186. package/dist/elements/Select/index.mjs +1 -582
  187. package/dist/elements/Select/index.mjs.map +1 -1
  188. package/dist/elements/Skeleton/index.js +1 -82
  189. package/dist/elements/Skeleton/index.js.map +1 -1
  190. package/dist/elements/Skeleton/index.mjs +1 -78
  191. package/dist/elements/Skeleton/index.mjs.map +1 -1
  192. package/dist/elements/Switch/index.js +1 -179
  193. package/dist/elements/Switch/index.js.map +1 -1
  194. package/dist/elements/Switch/index.mjs +1 -173
  195. package/dist/elements/Switch/index.mjs.map +1 -1
  196. package/dist/elements/Table/Table.d.ts +3 -24
  197. package/dist/elements/Table/Table.d.ts.map +1 -1
  198. package/dist/elements/Table/Table.styles.d.ts +24 -0
  199. package/dist/elements/Table/Table.styles.d.ts.map +1 -0
  200. package/dist/elements/Table/index.js +1 -595
  201. package/dist/elements/Table/index.js.map +1 -1
  202. package/dist/elements/Table/index.mjs +1 -578
  203. package/dist/elements/Table/index.mjs.map +1 -1
  204. package/dist/elements/Tabs/Tabs.d.ts +5 -3
  205. package/dist/elements/Tabs/Tabs.d.ts.map +1 -1
  206. package/dist/elements/Tabs/Tabs.types.d.ts +15 -0
  207. package/dist/elements/Tabs/Tabs.types.d.ts.map +1 -1
  208. package/dist/elements/Tabs/index.js +1 -337
  209. package/dist/elements/Tabs/index.js.map +1 -1
  210. package/dist/elements/Tabs/index.mjs +1 -320
  211. package/dist/elements/Tabs/index.mjs.map +1 -1
  212. package/dist/elements/TextField/TextField.d.ts +6 -42
  213. package/dist/elements/TextField/TextField.d.ts.map +1 -1
  214. package/dist/elements/TextField/TextField.hooks.d.ts +63 -0
  215. package/dist/elements/TextField/TextField.hooks.d.ts.map +1 -0
  216. package/dist/elements/TextField/TextField.icons.d.ts +19 -0
  217. package/dist/elements/TextField/TextField.icons.d.ts.map +1 -0
  218. package/dist/elements/TextField/TextField.styles.d.ts +37 -0
  219. package/dist/elements/TextField/TextField.styles.d.ts.map +1 -0
  220. package/dist/elements/TextField/TextField.types.d.ts +3 -0
  221. package/dist/elements/TextField/TextField.types.d.ts.map +1 -1
  222. package/dist/elements/TextField/index.css +1 -22
  223. package/dist/elements/TextField/index.css.map +1 -1
  224. package/dist/elements/TextField/index.js +1 -902
  225. package/dist/elements/TextField/index.js.map +1 -1
  226. package/dist/elements/TextField/index.mjs +1 -882
  227. package/dist/elements/TextField/index.mjs.map +1 -1
  228. package/dist/elements/TimeField/index.js +1 -254
  229. package/dist/elements/TimeField/index.js.map +1 -1
  230. package/dist/elements/TimeField/index.mjs +1 -238
  231. package/dist/elements/TimeField/index.mjs.map +1 -1
  232. package/dist/elements/Toast/Toast.d.ts +0 -22
  233. package/dist/elements/Toast/Toast.d.ts.map +1 -1
  234. package/dist/elements/Toast/index.js +1 -737
  235. package/dist/elements/Toast/index.js.map +1 -1
  236. package/dist/elements/Toast/index.mjs +1 -724
  237. package/dist/elements/Toast/index.mjs.map +1 -1
  238. package/dist/elements/Tooltip/index.js +1 -323
  239. package/dist/elements/Tooltip/index.js.map +1 -1
  240. package/dist/elements/Tooltip/index.mjs +1 -310
  241. package/dist/elements/Tooltip/index.mjs.map +1 -1
  242. package/dist/elements/index.css +1 -22
  243. package/dist/elements/index.css.map +1 -1
  244. package/dist/elements/index.d.ts +13 -1
  245. package/dist/elements/index.d.ts.map +1 -1
  246. package/dist/elements/index.js +1 -12455
  247. package/dist/elements/index.js.map +1 -1
  248. package/dist/elements/index.mjs +1 -12233
  249. package/dist/elements/index.mjs.map +1 -1
  250. package/dist/index.css +1 -22
  251. package/dist/index.css.map +1 -1
  252. package/dist/index.js +2 -12490
  253. package/dist/index.js.map +1 -1
  254. package/dist/index.mjs +2 -12262
  255. package/dist/index.mjs.map +1 -1
  256. package/dist/schemas/index.js +2 -54
  257. package/dist/schemas/index.js.map +1 -1
  258. package/dist/schemas/index.mjs +2 -48
  259. package/dist/schemas/index.mjs.map +1 -1
  260. package/dist/styles/defaults.css +151 -0
  261. package/dist/styles/index.js +1 -166
  262. package/dist/styles/index.js.map +1 -1
  263. package/dist/styles/index.mjs +1 -129
  264. package/dist/styles/index.mjs.map +1 -1
  265. package/dist/styles/shared-variants.d.ts +3 -3
  266. package/dist/styles/shared-variants.d.ts.map +1 -1
  267. package/dist/utils/index.js +1 -12
  268. package/dist/utils/index.js.map +1 -1
  269. package/dist/utils/index.mjs +1 -10
  270. package/dist/utils/index.mjs.map +1 -1
  271. package/package.json +9 -7
  272. package/src/elements/Accordion/Accordion.stories.tsx +1 -1
  273. package/src/elements/AlertDialog/AlertDialog.stories.tsx +124 -0
  274. package/src/elements/Avatar/Avatar.stories.tsx +1 -1
  275. package/src/elements/Badge/Badge.stories.tsx +1 -1
  276. package/src/elements/Breadcrumbs/Breadcrumbs.stories.tsx +1 -1
  277. package/src/elements/Button/Button.stories.tsx +1 -1
  278. package/src/elements/ButtonGroup/ButtonGroup.stories.tsx +1 -1
  279. package/src/elements/Card/Card.stories.tsx +1 -1
  280. package/src/elements/Carousel/Carousel.stories.tsx +1 -1
  281. package/src/elements/Chart/Chart.stories.tsx +1 -1
  282. package/src/elements/Checkbox/Checkbox.stories.tsx +1 -1
  283. package/src/elements/CheckboxGroup/CheckboxGroup.stories.tsx +4 -4
  284. package/src/elements/Combobox/Combobox.stories.tsx +133 -0
  285. package/src/elements/DatePicker/DatePicker.stories.tsx +1 -1
  286. package/src/elements/Dropdown/Dropdown.stories.tsx +1 -1
  287. package/src/elements/FileField/FileField.stories.tsx +2 -2
  288. package/src/elements/FileField/FileProgress.stories.tsx +1 -1
  289. package/src/elements/FormLayout/FormLayout.stories.tsx +1 -1
  290. package/src/elements/Modal/Modal.stories.tsx +1 -1
  291. package/src/elements/NumberField/NumberField.stories.tsx +1 -1
  292. package/src/elements/OTPInput/OTPInput.stories.tsx +1 -1
  293. package/src/elements/Pagination/Pagination.stories.tsx +203 -0
  294. package/src/elements/Panel/Panel.stories.tsx +1 -1
  295. package/src/elements/PasswordField/PasswordField.stories.tsx +167 -0
  296. package/src/elements/Progress/Progress.stories.tsx +7 -2
  297. package/src/elements/RadioGroup/RadioGroup.stories.tsx +3 -3
  298. package/src/elements/Resizable/Resizable.stories.tsx +1 -1
  299. package/src/elements/SearchField/SearchField.stories.tsx +146 -0
  300. package/src/elements/Select/Select.stories.tsx +1 -1
  301. package/src/elements/Skeleton/Skeleton.stories.tsx +1 -1
  302. package/src/elements/Switch/Switch.stories.tsx +1 -1
  303. package/src/elements/Table/Table.stories.tsx +1 -1
  304. package/src/elements/Tabs/Tabs.stories.tsx +46 -2
  305. package/src/elements/TextField/TextField.stories.tsx +1 -1
  306. package/src/elements/TimeField/TimeField.stories.tsx +1 -1
  307. package/src/elements/Toast/Toast.stories.tsx +1 -1
  308. package/src/elements/Tooltip/Tooltip.stories.tsx +1 -1
@@ -1,591 +1,3 @@
1
1
  "use client";
2
- 'use strict';
3
-
4
- var react = require('react');
5
- var reactAriaComponents = require('react-aria-components');
6
- var classVarianceAuthority = require('class-variance-authority');
7
- var lucideReact = require('lucide-react');
8
- var jsxRuntime = require('react/jsx-runtime');
9
- var zod = require('zod');
10
-
11
- // src/elements/Select/Select.tsx
12
- var selectTriggerVariants = classVarianceAuthority.cva(
13
- [
14
- // Base styles
15
- "flex",
16
- "w-full",
17
- "items-center",
18
- "justify-between",
19
- "rounded-md",
20
- "border",
21
- "bg-[var(--content-background)]",
22
- "text-[var(--content-foreground)]",
23
- "transition-colors",
24
- "duration-200",
25
- "outline-none",
26
- // Focus ring (WCAG 2.2 AAA - 7:1 contrast)
27
- "focus-visible:ring-2",
28
- "focus-visible:ring-[var(--ring)]",
29
- "focus-visible:ring-offset-2",
30
- // Hover state
31
- "hover:bg-[var(--accent)]/10",
32
- // Disabled state
33
- "disabled:cursor-not-allowed",
34
- "disabled:opacity-50",
35
- // Loading state
36
- "data-[loading=true]:cursor-wait",
37
- // Truncate text
38
- "truncate"
39
- ],
40
- {
41
- variants: {
42
- size: {
43
- // All sizes use 44px minimum touch target for WCAG 2.2 AAA compliance
44
- // Visual height varies but touch area remains accessible
45
- sm: "h-9 px-3 text-sm min-h-[44px]",
46
- default: "h-11 px-4 text-base min-h-[44px]",
47
- lg: "h-14 px-5 text-lg min-h-[44px]"
48
- },
49
- isInvalid: {
50
- true: "border-[var(--destructive)]",
51
- false: "border-[var(--input)] hover:border-[var(--input)]/80"
52
- }
53
- },
54
- defaultVariants: {
55
- size: "default",
56
- isInvalid: false
57
- }
58
- }
59
- );
60
- var selectItemVariants = classVarianceAuthority.cva(
61
- [
62
- // Base styles
63
- "relative",
64
- "flex",
65
- "w-full",
66
- "cursor-pointer",
67
- "select-none",
68
- "items-center",
69
- "rounded-sm",
70
- "outline-none",
71
- "transition-colors",
72
- // Padding for checkmark icon (left side)
73
- "pl-8",
74
- "pr-2",
75
- // Hover state
76
- "hover:bg-[var(--accent)]",
77
- "hover:text-[var(--accent-foreground)]",
78
- // Focus state
79
- "focus:bg-[var(--accent)]",
80
- "focus:text-[var(--accent-foreground)]",
81
- // Selected state
82
- "data-[selected=true]:bg-[var(--accent)]",
83
- "data-[selected=true]:text-[var(--accent-foreground)]",
84
- // Disabled state
85
- "data-[disabled=true]:pointer-events-none",
86
- "data-[disabled=true]:opacity-50",
87
- "data-[disabled=true]:text-[var(--menu-muted)]"
88
- ],
89
- {
90
- variants: {
91
- size: {
92
- // All sizes use 44px minimum touch target for WCAG 2.2 AAA compliance
93
- sm: "h-9 py-1.5 text-sm min-h-[44px]",
94
- default: "h-11 py-2 text-base min-h-[44px]",
95
- lg: "h-14 py-3 text-lg min-h-[44px]"
96
- }
97
- },
98
- defaultVariants: {
99
- size: "default"
100
- }
101
- }
102
- );
103
- var selectPopoverVariants = classVarianceAuthority.cva(
104
- [
105
- // Base styles - use menu tokens to match Dropdown styling
106
- "z-50",
107
- "w-[--trigger-width]",
108
- "rounded-md",
109
- "border",
110
- "border-[var(--menu-border)]",
111
- "bg-[var(--menu-background)]",
112
- "text-[var(--menu-foreground)]",
113
- "shadow-md",
114
- "outline-none",
115
- "overflow-auto",
116
- // Animations
117
- "data-[entering]:animate-in",
118
- "data-[entering]:fade-in-0",
119
- "data-[entering]:zoom-in-95",
120
- "data-[exiting]:animate-out",
121
- "data-[exiting]:fade-out-0",
122
- "data-[exiting]:zoom-out-95"
123
- ],
124
- {
125
- variants: {
126
- size: {
127
- sm: "max-h-[200px] p-1",
128
- default: "max-h-[300px] p-1",
129
- lg: "max-h-[400px] p-1"
130
- }
131
- },
132
- defaultVariants: {
133
- size: "default"
134
- }
135
- }
136
- );
137
- var selectSectionVariants = classVarianceAuthority.cva(
138
- [
139
- "px-2",
140
- "py-1.5",
141
- "text-xs",
142
- "font-semibold",
143
- "text-[var(--menu-muted)]",
144
- "uppercase",
145
- "tracking-wider"
146
- ],
147
- {
148
- variants: {
149
- size: {
150
- sm: "px-2 py-1 text-[10px]",
151
- default: "px-2 py-1.5 text-xs",
152
- lg: "px-3 py-2 text-sm"
153
- }
154
- },
155
- defaultVariants: {
156
- size: "default"
157
- }
158
- }
159
- );
160
- var selectErrorVariants = classVarianceAuthority.cva(
161
- [
162
- "flex",
163
- "items-center",
164
- "gap-1.5",
165
- "text-sm",
166
- "font-medium",
167
- "text-[var(--destructive)]",
168
- "mt-1.5"
169
- ],
170
- {
171
- variants: {
172
- size: {
173
- sm: "text-xs mt-1",
174
- default: "text-sm mt-1.5",
175
- lg: "text-base mt-2"
176
- }
177
- },
178
- defaultVariants: {
179
- size: "default"
180
- }
181
- }
182
- );
183
- var SelectRoot = react.forwardRef(
184
- ({
185
- // Display props
186
- label,
187
- placeholder,
188
- description,
189
- // Selection props
190
- value,
191
- defaultValue,
192
- // State props
193
- isOpen,
194
- isDisabled = false,
195
- isRequired = false,
196
- disabledKeys,
197
- // Validation props
198
- validate,
199
- validationBehavior = "aria",
200
- errorMessage,
201
- // Loading state
202
- isLoading = false,
203
- emptyStateMessage,
204
- // Form integration
205
- name,
206
- // Size variant
207
- size = "default",
208
- // Event handlers
209
- onChange,
210
- onOpenChange,
211
- // Standard props
212
- className,
213
- children,
214
- ...props
215
- }, ref) => {
216
- const labelId = react.useId();
217
- const descriptionId = react.useId();
218
- const errorId = react.useId();
219
- const childCount = react.Children.count(children);
220
- if (childCount > 1e3) {
221
- console.warn(
222
- "Select has >1000 items. Consider using Autocomplete component for better performance."
223
- );
224
- }
225
- const isInvalid = Boolean(errorMessage);
226
- return /* @__PURE__ */ jsxRuntime.jsxs(
227
- reactAriaComponents.Select,
228
- {
229
- value,
230
- defaultValue,
231
- onChange: (key) => {
232
- if (onChange) {
233
- onChange(key);
234
- }
235
- },
236
- placeholder,
237
- disabledKeys,
238
- isOpen,
239
- onOpenChange,
240
- isDisabled: isDisabled || isLoading,
241
- isRequired,
242
- name,
243
- validate,
244
- validationBehavior,
245
- isInvalid,
246
- className,
247
- ...props,
248
- children: [
249
- /* @__PURE__ */ jsxRuntime.jsxs(reactAriaComponents.Label, { id: labelId, className: "text-sm font-medium text-[var(--content-foreground)]", children: [
250
- label,
251
- isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--destructive)] ml-1", children: "*" })
252
- ] }),
253
- description && /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.Text, { id: descriptionId, slot: "description", className: "text-sm text-[var(--menu-muted)] mt-1", children: description }),
254
- /* @__PURE__ */ jsxRuntime.jsxs(
255
- reactAriaComponents.Button,
256
- {
257
- ref,
258
- className: selectTriggerVariants({ size, isInvalid }),
259
- "aria-labelledby": labelId,
260
- "aria-describedby": description ? descriptionId : errorMessage ? errorId : void 0,
261
- "data-loading": isLoading,
262
- ...isRequired && { "aria-required": "true" },
263
- ...isLoading && { "aria-busy": "true" },
264
- ...(isDisabled || isLoading) && { "aria-disabled": "true" },
265
- children: [
266
- /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.SelectValue, { className: "flex-1 text-left truncate" }),
267
- isLoading ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin text-[var(--menu-muted)]", "aria-hidden": "true" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4 text-[var(--menu-muted)]", "aria-hidden": "true" })
268
- ]
269
- }
270
- ),
271
- /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.FieldError, { id: errorId, className: selectErrorVariants({ size }), children: ({ validationErrors }) => {
272
- const displayError = errorMessage || validationErrors.join(" ");
273
- return displayError ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
274
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircle, { className: "h-4 w-4", "aria-hidden": "true" }),
275
- displayError
276
- ] }) : null;
277
- } }),
278
- /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.Popover, { className: selectPopoverVariants({ size }), children: /* @__PURE__ */ jsxRuntime.jsxs(reactAriaComponents.ListBox, { className: "outline-none", children: [
279
- isLoading && childCount > 0 && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
280
- "div",
281
- {
282
- className: "h-11 px-4 py-2",
283
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4 bg-[var(--accent-background)] rounded animate-pulse" })
284
- },
285
- `skeleton-${i}`
286
- )) }),
287
- !isLoading && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
288
- children,
289
- childCount === 0 && /* @__PURE__ */ jsxRuntime.jsx(
290
- reactAriaComponents.ListBoxItem,
291
- {
292
- id: "__empty__",
293
- textValue: "empty",
294
- isDisabled: true,
295
- className: "py-6 text-center text-sm text-[var(--menu-muted)] cursor-default pointer-events-none",
296
- children: /* @__PURE__ */ jsxRuntime.jsx("span", { role: "status", children: emptyStateMessage || "No options available" })
297
- }
298
- )
299
- ] })
300
- ] }) })
301
- ]
302
- }
303
- );
304
- }
305
- );
306
- SelectRoot.displayName = "Select";
307
- var MultiSelectRoot = react.forwardRef(
308
- ({
309
- // Display props
310
- label,
311
- placeholder,
312
- description,
313
- // Selection props
314
- value,
315
- defaultValue,
316
- selectionMode: _selectionMode = "multiple",
317
- // State props
318
- isOpen,
319
- isDisabled = false,
320
- isRequired = false,
321
- disabledKeys,
322
- // Validation props
323
- validate,
324
- validationBehavior = "aria",
325
- errorMessage,
326
- // Loading state
327
- isLoading = false,
328
- emptyStateMessage,
329
- // Form integration
330
- name,
331
- // Size variant
332
- size = "default",
333
- // Event handlers
334
- onChange,
335
- onOpenChange,
336
- // Standard props
337
- className,
338
- children,
339
- ...props
340
- }, ref) => {
341
- const labelId = react.useId();
342
- const descriptionId = react.useId();
343
- const errorId = react.useId();
344
- const childCount = react.Children.count(children);
345
- if (childCount > 1e3) {
346
- console.warn(
347
- "Select has >1000 items. Consider using Autocomplete component for better performance."
348
- );
349
- }
350
- const isInvalid = Boolean(errorMessage);
351
- const valueToLabelMap = react.useMemo(() => {
352
- const map = /* @__PURE__ */ new Map();
353
- const processChildren = (nodes) => {
354
- react.Children.forEach(nodes, (child) => {
355
- if (react.isValidElement(child)) {
356
- const element = child;
357
- if (element.type === SelectItem || element.props?.value) {
358
- const itemValue = element.props.value;
359
- const itemChildren = element.props.children;
360
- if (itemValue && typeof itemChildren === "string") {
361
- map.set(itemValue, itemChildren);
362
- }
363
- }
364
- if (element.props?.children) {
365
- processChildren(element.props.children);
366
- }
367
- }
368
- });
369
- };
370
- processChildren(children);
371
- return map;
372
- }, [children]);
373
- const displayValue = react.useMemo(() => {
374
- if (!value || !Array.isArray(value) || value.length === 0) {
375
- return placeholder || "";
376
- }
377
- if (value.length <= 2) {
378
- const labels = value.map((v) => valueToLabelMap.get(v) || v);
379
- return labels.join(", ");
380
- }
381
- return `${value.length} items selected`;
382
- }, [value, valueToLabelMap, placeholder]);
383
- return /* @__PURE__ */ jsxRuntime.jsxs(
384
- reactAriaComponents.Select,
385
- {
386
- value,
387
- defaultValue,
388
- onChange: (keys) => {
389
- if (onChange) {
390
- onChange(keys);
391
- }
392
- },
393
- selectionMode: "multiple",
394
- disabledKeys,
395
- isOpen,
396
- onOpenChange,
397
- isDisabled: isDisabled || isLoading,
398
- isRequired,
399
- name,
400
- validate,
401
- validationBehavior,
402
- isInvalid,
403
- className,
404
- ...props,
405
- children: [
406
- /* @__PURE__ */ jsxRuntime.jsxs(reactAriaComponents.Label, { id: labelId, className: "text-sm font-medium text-[var(--content-foreground)]", children: [
407
- label,
408
- isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--destructive)] ml-1", children: "*" })
409
- ] }),
410
- description && /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.Text, { id: descriptionId, slot: "description", className: "text-sm text-[var(--menu-muted)] mt-1", children: description }),
411
- /* @__PURE__ */ jsxRuntime.jsxs(
412
- reactAriaComponents.Button,
413
- {
414
- ref,
415
- className: selectTriggerVariants({ size, isInvalid }),
416
- "aria-labelledby": labelId,
417
- "aria-describedby": description ? descriptionId : errorMessage ? errorId : void 0,
418
- "data-loading": isLoading,
419
- ...isRequired && { "aria-required": "true" },
420
- ...isLoading && { "aria-busy": "true" },
421
- ...(isDisabled || isLoading) && { "aria-disabled": "true" },
422
- children: [
423
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-left truncate", children: displayValue }),
424
- isLoading ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin text-[var(--menu-muted)]", "aria-hidden": "true" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4 text-[var(--menu-muted)]", "aria-hidden": "true" })
425
- ]
426
- }
427
- ),
428
- /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.FieldError, { id: errorId, className: selectErrorVariants({ size }), children: ({ validationErrors }) => {
429
- const displayError = errorMessage || validationErrors.join(" ");
430
- return displayError ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
431
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircle, { className: "h-4 w-4", "aria-hidden": "true" }),
432
- displayError
433
- ] }) : null;
434
- } }),
435
- /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.Popover, { className: selectPopoverVariants({ size }), children: /* @__PURE__ */ jsxRuntime.jsxs(reactAriaComponents.ListBox, { className: "outline-none", children: [
436
- isLoading && childCount > 0 && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-11 px-4 py-2", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4 bg-[var(--accent-background)] rounded animate-pulse" }) }, `skeleton-${i}`)) }),
437
- !isLoading && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
438
- children,
439
- childCount === 0 && /* @__PURE__ */ jsxRuntime.jsx(
440
- reactAriaComponents.ListBoxItem,
441
- {
442
- id: "__empty__",
443
- textValue: "empty",
444
- isDisabled: true,
445
- className: "py-6 text-center text-sm text-[var(--menu-muted)] cursor-default pointer-events-none",
446
- children: /* @__PURE__ */ jsxRuntime.jsx("span", { role: "status", children: emptyStateMessage || "No options available" })
447
- }
448
- )
449
- ] })
450
- ] }) })
451
- ]
452
- }
453
- );
454
- }
455
- );
456
- MultiSelectRoot.displayName = "MultiSelect";
457
- function SelectItem({ children, textValue, value, isDisabled = false, className, ...props }) {
458
- if (!textValue && typeof children !== "string") {
459
- const message = "Select.Item with custom children requires textValue prop for accessibility";
460
- if (process.env.NODE_ENV === "development") {
461
- throw new Error(message);
462
- } else {
463
- console.warn(message);
464
- }
465
- }
466
- return /* @__PURE__ */ jsxRuntime.jsx(
467
- reactAriaComponents.ListBoxItem,
468
- {
469
- id: value,
470
- textValue: textValue || (typeof children === "string" ? children : void 0),
471
- className: `${selectItemVariants({ size: "default" })} ${className || ""}`,
472
- isDisabled,
473
- ...props,
474
- children: ({ isSelected, selectionMode, isDisabled: itemDisabled }) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
475
- selectionMode === "multiple" ? /* @__PURE__ */ jsxRuntime.jsx(
476
- lucideReact.CheckSquare,
477
- {
478
- className: `absolute left-2 h-4 w-4 ${isSelected ? "visible" : "invisible"}`,
479
- "aria-hidden": "true"
480
- }
481
- ) : isSelected && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "absolute left-2 h-4 w-4", "aria-hidden": "true" }),
482
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: itemDisabled ? "text-[var(--menu-muted)]" : "", children })
483
- ] })
484
- }
485
- );
486
- }
487
- SelectItem.displayName = "SelectItem";
488
- function SelectSection({ children, className, ...props }) {
489
- return /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.ListBoxSection, { className: `border-t border-[var(--border)] first:border-t-0 ${className || ""}`, ...props, children });
490
- }
491
- SelectSection.displayName = "SelectSection";
492
- function SelectHeader({ children, className, ...props }) {
493
- return /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.Header, { className: `${selectSectionVariants({ size: "default" })} ${className || ""}`, ...props, children });
494
- }
495
- SelectHeader.displayName = "SelectHeader";
496
- var Select = Object.assign(SelectRoot, {
497
- Item: SelectItem,
498
- Section: SelectSection,
499
- Header: SelectHeader
500
- });
501
- var MultiSelect = Object.assign(MultiSelectRoot, {
502
- Item: SelectItem,
503
- Section: SelectSection,
504
- Header: SelectHeader
505
- });
506
- var BaseComponentPropsSchema = zod.z.object({
507
- // Styling
508
- className: zod.z.string().optional(),
509
- // React
510
- children: zod.z.any().optional(),
511
- // ReactNode not directly supported by Zod
512
- id: zod.z.string().optional(),
513
- // Accessibility (WCAG 2.2 AA requirements)
514
- "aria-label": zod.z.string().optional(),
515
- "aria-labelledby": zod.z.string().optional(),
516
- "aria-describedby": zod.z.string().optional(),
517
- "aria-live": zod.z.enum(["off", "polite", "assertive"]).optional(),
518
- "aria-hidden": zod.z.boolean().optional(),
519
- // Testing & Development
520
- "data-testid": zod.z.string().optional()
521
- });
522
-
523
- // src/elements/Select/Select.types.ts
524
- var SelectSizeSchema = zod.z.enum(["sm", "default", "lg"]);
525
- var SelectionModeSchema = zod.z.enum(["single", "multiple"]);
526
- var ValidationBehaviorSchema = zod.z.enum(["native", "aria"]);
527
- var SelectPropsSchema = BaseComponentPropsSchema.extend({
528
- // Display props (US-1)
529
- label: zod.z.string(),
530
- // Required for accessibility
531
- placeholder: zod.z.string().optional(),
532
- description: zod.z.string().optional(),
533
- // Selection props (US-1, US-6)
534
- value: zod.z.union([zod.z.string(), zod.z.array(zod.z.string())]).optional(),
535
- defaultValue: zod.z.union([zod.z.string(), zod.z.array(zod.z.string())]).optional(),
536
- selectionMode: SelectionModeSchema.optional().default("single"),
537
- // State props (US-1, US-5)
538
- isOpen: zod.z.boolean().optional(),
539
- isDisabled: zod.z.boolean().optional().default(false),
540
- isRequired: zod.z.boolean().optional().default(false),
541
- disabledKeys: zod.z.array(zod.z.string()).optional(),
542
- // Validation props (US-4)
543
- validate: zod.z.custom().optional(),
544
- validationBehavior: ValidationBehaviorSchema.optional().default("aria"),
545
- errorMessage: zod.z.string().optional(),
546
- // Loading state (US-7)
547
- isLoading: zod.z.boolean().optional().default(false),
548
- emptyStateMessage: zod.z.string().optional(),
549
- // Form integration (US-10)
550
- name: zod.z.string().optional(),
551
- // Size variant (US-9)
552
- size: SelectSizeSchema.optional().default("default"),
553
- // Event handlers (US-1)
554
- onChange: zod.z.custom().optional(),
555
- onOpenChange: zod.z.custom().optional(),
556
- // Children (Select.Item, Select.Section components)
557
- children: zod.z.custom()
558
- });
559
- var SelectItemPropsSchema = BaseComponentPropsSchema.extend({
560
- // Item value (required)
561
- value: zod.z.string(),
562
- // Text value for typeahead and accessibility (required for custom children)
563
- textValue: zod.z.string().optional(),
564
- // Disabled state
565
- isDisabled: zod.z.boolean().optional().default(false),
566
- // Item content
567
- children: zod.z.custom(),
568
- // Optional className for custom styling
569
- className: zod.z.string().optional()
570
- });
571
- var SelectSectionPropsSchema = BaseComponentPropsSchema.extend({
572
- // Section content (typically Select.Header + Select.Item components)
573
- children: zod.z.custom(),
574
- // Optional className for custom styling
575
- className: zod.z.string().optional()
576
- });
577
- var SelectHeaderPropsSchema = BaseComponentPropsSchema.extend({
578
- // Header text
579
- children: zod.z.custom(),
580
- // Optional className for header styling
581
- className: zod.z.string().optional()
582
- });
583
-
584
- exports.MultiSelect = MultiSelect;
585
- exports.Select = Select;
586
- exports.SelectHeaderPropsSchema = SelectHeaderPropsSchema;
587
- exports.SelectItemPropsSchema = SelectItemPropsSchema;
588
- exports.SelectPropsSchema = SelectPropsSchema;
589
- exports.SelectSectionPropsSchema = SelectSectionPropsSchema;
590
- //# sourceMappingURL=index.js.map
2
+ 'use strict';var react=require('react'),reactAriaComponents=require('react-aria-components'),lucideReact=require('lucide-react'),classVarianceAuthority=require('class-variance-authority'),jsxRuntime=require('react/jsx-runtime'),zod=require('zod');var q=classVarianceAuthority.cva(["flex","w-full","items-center","justify-between","rounded-md","border","bg-[var(--content-background)]","text-[var(--content-foreground)]","transition-colors","duration-200","outline-none","focus-visible:ring-2","focus-visible:ring-[var(--ring)]","focus-visible:ring-offset-2","hover:bg-[var(--accent)]/10","disabled:cursor-not-allowed","disabled:opacity-50","data-[loading=true]:cursor-wait","truncate"],{variants:{size:{sm:"h-9 px-3 text-sm min-h-[44px]",default:"h-11 px-4 text-base min-h-[44px]",lg:"h-14 px-5 text-lg min-h-[44px]"},isInvalid:{true:"border-[var(--destructive-background)]",false:"border-[var(--input-border)] hover:border-[var(--input-border)]/80"}},defaultVariants:{size:"default",isInvalid:false}}),F=classVarianceAuthority.cva(["relative","flex","w-full","cursor-pointer","select-none","items-center","rounded-sm","outline-none","transition-colors","pl-8","pr-2","hover:bg-[var(--accent)]","hover:text-[var(--accent-foreground)]","focus:bg-[var(--accent)]","focus:text-[var(--accent-foreground)]","data-[selected=true]:bg-[var(--accent)]","data-[selected=true]:text-[var(--accent-foreground)]","data-[disabled=true]:pointer-events-none","data-[disabled=true]:opacity-50","data-[disabled=true]:text-[var(--menu-muted)]"],{variants:{size:{sm:"h-9 py-1.5 text-sm min-h-[44px]",default:"h-11 py-2 text-base min-h-[44px]",lg:"h-14 py-3 text-lg min-h-[44px]"}},defaultVariants:{size:"default"}}),K=classVarianceAuthority.cva(["z-50","w-[--trigger-width]","rounded-md","border","border-[var(--menu-border)]","bg-[var(--menu-background)]","text-[var(--menu-foreground)]","shadow-md","outline-none","overflow-auto","data-[entering]:animate-in","data-[entering]:fade-in-0","data-[entering]:zoom-in-95","data-[exiting]:animate-out","data-[exiting]:fade-out-0","data-[exiting]:zoom-out-95"],{variants:{size:{sm:"max-h-[200px] p-1",default:"max-h-[300px] p-1",lg:"max-h-[400px] p-1"}},defaultVariants:{size:"default"}}),G=classVarianceAuthority.cva(["px-2","py-1.5","text-xs","font-semibold","text-[var(--menu-muted)]","uppercase","tracking-wider"],{variants:{size:{sm:"px-2 py-1 text-[10px]",default:"px-2 py-1.5 text-xs",lg:"px-3 py-2 text-sm"}},defaultVariants:{size:"default"}}),J=classVarianceAuthority.cva(["flex","items-center","gap-1.5","text-sm","font-medium","text-[var(--destructive-background)]","mt-1.5"],{variants:{size:{sm:"text-xs mt-1",default:"text-sm mt-1.5",lg:"text-base mt-2"}},defaultVariants:{size:"default"}});function X({ariaSelectProps:s,triggerContent:r,triggerRef:n,label:o,description:c,isRequired:u,isDisabled:d,isLoading:a,errorMessage:i,size:p,emptyStateMessage:N,childCount:b,children:v}){let f=react.useId(),y=react.useId(),h=react.useId(),S=!!i;return jsxRuntime.jsxs(reactAriaComponents.Select,{...s,isInvalid:S,children:[jsxRuntime.jsxs(reactAriaComponents.Label,{id:f,className:"text-sm font-medium text-[var(--content-foreground)]",children:[o,u&&jsxRuntime.jsx("span",{className:"text-[var(--destructive-background)] ml-1",children:"*"})]}),c&&jsxRuntime.jsx(reactAriaComponents.Text,{id:y,slot:"description",className:"text-sm text-[var(--menu-muted)] mt-1",children:c}),jsxRuntime.jsxs(reactAriaComponents.Button,{ref:n,className:q({size:p,isInvalid:S}),"aria-labelledby":f,"aria-describedby":c?y:i?h:void 0,"data-loading":a,...u&&{"aria-required":"true"},...a&&{"aria-busy":"true"},...(d||a)&&{"aria-disabled":"true"},children:[r,a?jsxRuntime.jsx(lucideReact.Loader2,{className:"h-4 w-4 animate-spin text-[var(--menu-muted)]","aria-hidden":"true"}):jsxRuntime.jsx(lucideReact.ChevronDown,{className:"h-4 w-4 text-[var(--menu-muted)]","aria-hidden":"true"})]}),jsxRuntime.jsx(reactAriaComponents.FieldError,{id:h,className:J({size:p}),children:({validationErrors:g})=>{let m=i||g.join(" ");return m?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(lucideReact.AlertCircle,{className:"h-4 w-4","aria-hidden":"true"}),m]}):null}}),jsxRuntime.jsx(reactAriaComponents.Popover,{className:K({size:p}),children:jsxRuntime.jsxs(reactAriaComponents.ListBox,{className:"outline-none",children:[a&&b>0&&jsxRuntime.jsx(jsxRuntime.Fragment,{children:Array.from({length:3}).map((g,m)=>jsxRuntime.jsx("div",{className:"h-11 px-4 py-2",children:jsxRuntime.jsx("div",{className:"h-4 bg-[var(--accent-background)] rounded animate-pulse"})},`skeleton-${m}`))}),!a&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[v,b===0&&jsxRuntime.jsx(reactAriaComponents.ListBoxItem,{id:"__empty__",textValue:"empty",isDisabled:true,className:"py-6 text-center text-sm text-[var(--menu-muted)] cursor-default pointer-events-none",children:jsxRuntime.jsx("span",{role:"status",children:N||"No options available"})})]})]})})]})}var Y=react.forwardRef(({label:s,placeholder:r,description:n,value:o,defaultValue:c,isOpen:u,isDisabled:d=false,isRequired:a=false,disabledKeys:i,validate:p,validationBehavior:N="aria",errorMessage:b,isLoading:v=false,emptyStateMessage:f,name:y,size:h="default",onChange:S,onOpenChange:g,className:m,children:M,...P},H)=>{let R=react.Children.count(M);return R>1e3&&console.warn("Select has >1000 items. Consider using Autocomplete component for better performance."),jsxRuntime.jsx(X,{ariaSelectProps:{value:o,defaultValue:c,onChange:C=>{S&&S(C);},placeholder:r,disabledKeys:i,isOpen:u,onOpenChange:g,isDisabled:d||v,isRequired:a,name:y,validate:p,validationBehavior:N,className:m,...P},triggerContent:jsxRuntime.jsx(reactAriaComponents.SelectValue,{className:"flex-1 text-left truncate"}),triggerRef:H,label:s,description:n,isRequired:a,isDisabled:d,isLoading:v,errorMessage:b,size:h,emptyStateMessage:f,childCount:R,children:M})});Y.displayName="Select";var Z=react.forwardRef(({label:s,placeholder:r,description:n,value:o,defaultValue:c,selectionMode:u="multiple",isOpen:d,isDisabled:a=false,isRequired:i=false,disabledKeys:p,validate:N,validationBehavior:b="aria",errorMessage:v,isLoading:f=false,emptyStateMessage:y,name:h,size:S="default",onChange:g,onOpenChange:m,className:M,children:P,...H},R)=>{let C=react.Children.count(P);C>1e3&&console.warn("Select has >1000 items. Consider using Autocomplete component for better performance.");let O=react.useMemo(()=>{let z=new Map,I=te=>{react.Children.forEach(te,$=>{if(react.isValidElement($)){let V=$;if(V.type===k||V.props?.value){let _=V.props.value,j=V.props.children;_&&typeof j=="string"&&z.set(_,j);}V.props?.children&&I(V.props.children);}});};return I(P),z},[P]),ee=react.useMemo(()=>!o||!Array.isArray(o)||o.length===0?r||"":o.length<=2?o.map(I=>O.get(I)||I).join(", "):`${o.length} items selected`,[o,O,r]);return jsxRuntime.jsx(X,{ariaSelectProps:{value:o,defaultValue:c,onChange:z=>{g&&g(z);},selectionMode:"multiple",disabledKeys:p,isOpen:d,onOpenChange:m,isDisabled:a||f,isRequired:i,name:h,validate:N,validationBehavior:b,className:M,...H},triggerContent:jsxRuntime.jsx("span",{className:"flex-1 text-left truncate",children:ee}),triggerRef:R,label:s,description:n,isRequired:i,isDisabled:a,isLoading:f,errorMessage:v,size:S,emptyStateMessage:y,childCount:C,children:P})});Z.displayName="MultiSelect";var k=react.memo(function({children:r,textValue:n,value:o,isDisabled:c=false,className:u,...d}){if(!n&&typeof r!="string"){let a="Select.Item with custom children requires textValue prop for accessibility";if(process.env.NODE_ENV==="development")throw new Error(a);console.warn(a);}return jsxRuntime.jsx(reactAriaComponents.ListBoxItem,{id:o,textValue:n||(typeof r=="string"?r:void 0),className:`${F({size:"default"})} ${u||""}`,isDisabled:c,...d,children:({isSelected:a,selectionMode:i,isDisabled:p})=>jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[i==="multiple"?jsxRuntime.jsx(lucideReact.CheckSquare,{className:`absolute left-2 h-4 w-4 ${a?"visible":"invisible"}`,"aria-hidden":"true"}):a&&jsxRuntime.jsx(lucideReact.Check,{className:"absolute left-2 h-4 w-4","aria-hidden":"true"}),jsxRuntime.jsx("span",{className:p?"text-[var(--menu-muted)]":"",children:r})]})})});k.displayName="SelectItem";function T({children:s,className:r,...n}){return jsxRuntime.jsx(reactAriaComponents.ListBoxSection,{className:`border-t border-[var(--border)] first:border-t-0 ${r||""}`,...n,children:s})}T.displayName="SelectSection";function D({children:s,className:r,...n}){return jsxRuntime.jsx(reactAriaComponents.Header,{className:`${G({size:"default"})} ${r||""}`,...n,children:s})}D.displayName="SelectHeader";var ve=Object.assign(Y,{Item:k,Section:T,Header:D}),ye=Object.assign(Z,{Item:k,Section:T,Header:D});var B=zod.z.object({className:zod.z.string().optional(),children:zod.z.any().optional(),id:zod.z.string().optional(),"aria-label":zod.z.string().optional(),"aria-labelledby":zod.z.string().optional(),"aria-describedby":zod.z.string().optional(),"aria-live":zod.z.enum(["off","polite","assertive"]).optional(),"aria-hidden":zod.z.boolean().optional(),"data-testid":zod.z.string().optional()});var he=zod.z.enum(["sm","default","lg"]),Pe=zod.z.enum(["single","multiple"]),Ve=zod.z.enum(["native","aria"]),Ne=B.extend({label:zod.z.string(),placeholder:zod.z.string().optional(),description:zod.z.string().optional(),value:zod.z.union([zod.z.string(),zod.z.array(zod.z.string())]).optional(),defaultValue:zod.z.union([zod.z.string(),zod.z.array(zod.z.string())]).optional(),selectionMode:Pe.optional().default("single"),isOpen:zod.z.boolean().optional(),isDisabled:zod.z.boolean().optional().default(false),isRequired:zod.z.boolean().optional().default(false),disabledKeys:zod.z.array(zod.z.string()).optional(),validate:zod.z.custom().optional(),validationBehavior:Ve.optional().default("aria"),errorMessage:zod.z.string().optional(),isLoading:zod.z.boolean().optional().default(false),emptyStateMessage:zod.z.string().optional(),name:zod.z.string().optional(),size:he.optional().default("default"),onChange:zod.z.custom().optional(),onOpenChange:zod.z.custom().optional(),children:zod.z.custom()}),ze=B.extend({value:zod.z.string(),textValue:zod.z.string().optional(),isDisabled:zod.z.boolean().optional().default(false),children:zod.z.custom(),className:zod.z.string().optional()}),Ie=B.extend({children:zod.z.custom(),className:zod.z.string().optional()}),we=B.extend({children:zod.z.custom(),className:zod.z.string().optional()});exports.MultiSelect=ye;exports.Select=ve;exports.SelectHeaderPropsSchema=we;exports.SelectItemPropsSchema=ze;exports.SelectPropsSchema=Ne;exports.SelectSectionPropsSchema=Ie;//# sourceMappingURL=index.js.map
591
3
  //# sourceMappingURL=index.js.map