@tribepad/themis 1.0.1 → 1.0.2

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 (301) 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/index.js +1 -666
  115. package/dist/elements/NumberField/index.js.map +1 -1
  116. package/dist/elements/NumberField/index.mjs +1 -654
  117. package/dist/elements/NumberField/index.mjs.map +1 -1
  118. package/dist/elements/OTPInput/OTPInput.d.ts.map +1 -1
  119. package/dist/elements/OTPInput/index.js +1 -734
  120. package/dist/elements/OTPInput/index.js.map +1 -1
  121. package/dist/elements/OTPInput/index.mjs +1 -732
  122. package/dist/elements/OTPInput/index.mjs.map +1 -1
  123. package/dist/elements/Pagination/Pagination.d.ts +45 -0
  124. package/dist/elements/Pagination/Pagination.d.ts.map +1 -0
  125. package/dist/elements/Pagination/Pagination.styles.d.ts +10 -0
  126. package/dist/elements/Pagination/Pagination.styles.d.ts.map +1 -0
  127. package/dist/elements/Pagination/Pagination.types.d.ts +55 -0
  128. package/dist/elements/Pagination/Pagination.types.d.ts.map +1 -0
  129. package/dist/elements/Pagination/index.d.ts +21 -0
  130. package/dist/elements/Pagination/index.d.ts.map +1 -0
  131. package/dist/elements/Pagination/index.js +3 -0
  132. package/dist/elements/Pagination/index.js.map +1 -0
  133. package/dist/elements/Pagination/index.mjs +3 -0
  134. package/dist/elements/Pagination/index.mjs.map +1 -0
  135. package/dist/elements/Panel/index.js +1 -330
  136. package/dist/elements/Panel/index.js.map +1 -1
  137. package/dist/elements/Panel/index.mjs +1 -323
  138. package/dist/elements/Panel/index.mjs.map +1 -1
  139. package/dist/elements/PasswordField/PasswordField.d.ts +27 -0
  140. package/dist/elements/PasswordField/PasswordField.d.ts.map +1 -0
  141. package/dist/elements/PasswordField/PasswordField.styles.d.ts +32 -0
  142. package/dist/elements/PasswordField/PasswordField.styles.d.ts.map +1 -0
  143. package/dist/elements/PasswordField/PasswordField.types.d.ts +100 -0
  144. package/dist/elements/PasswordField/PasswordField.types.d.ts.map +1 -0
  145. package/dist/elements/PasswordField/index.css +2 -0
  146. package/dist/elements/PasswordField/index.css.map +1 -0
  147. package/dist/elements/PasswordField/index.d.ts +20 -0
  148. package/dist/elements/PasswordField/index.d.ts.map +1 -0
  149. package/dist/elements/PasswordField/index.js +3 -0
  150. package/dist/elements/PasswordField/index.js.map +1 -0
  151. package/dist/elements/PasswordField/index.mjs +3 -0
  152. package/dist/elements/PasswordField/index.mjs.map +1 -0
  153. package/dist/elements/Progress/index.js +1 -187
  154. package/dist/elements/Progress/index.js.map +1 -1
  155. package/dist/elements/Progress/index.mjs +1 -181
  156. package/dist/elements/Progress/index.mjs.map +1 -1
  157. package/dist/elements/RadioGroup/index.js +1 -369
  158. package/dist/elements/RadioGroup/index.js.map +1 -1
  159. package/dist/elements/RadioGroup/index.mjs +1 -359
  160. package/dist/elements/RadioGroup/index.mjs.map +1 -1
  161. package/dist/elements/Resizable/index.js +1 -1580
  162. package/dist/elements/Resizable/index.js.map +1 -1
  163. package/dist/elements/Resizable/index.mjs +1 -1566
  164. package/dist/elements/Resizable/index.mjs.map +1 -1
  165. package/dist/elements/SearchField/SearchField.d.ts +27 -0
  166. package/dist/elements/SearchField/SearchField.d.ts.map +1 -0
  167. package/dist/elements/SearchField/SearchField.styles.d.ts +32 -0
  168. package/dist/elements/SearchField/SearchField.styles.d.ts.map +1 -0
  169. package/dist/elements/SearchField/SearchField.types.d.ts +45 -0
  170. package/dist/elements/SearchField/SearchField.types.d.ts.map +1 -0
  171. package/dist/elements/SearchField/index.css +2 -0
  172. package/dist/elements/SearchField/index.css.map +1 -0
  173. package/dist/elements/SearchField/index.d.ts +21 -0
  174. package/dist/elements/SearchField/index.d.ts.map +1 -0
  175. package/dist/elements/SearchField/index.js +3 -0
  176. package/dist/elements/SearchField/index.js.map +1 -0
  177. package/dist/elements/SearchField/index.mjs +3 -0
  178. package/dist/elements/SearchField/index.mjs.map +1 -0
  179. package/dist/elements/Select/Select.d.ts +19 -48
  180. package/dist/elements/Select/Select.d.ts.map +1 -1
  181. package/dist/elements/Select/Select.styles.d.ts +55 -0
  182. package/dist/elements/Select/Select.styles.d.ts.map +1 -0
  183. package/dist/elements/Select/index.js +1 -589
  184. package/dist/elements/Select/index.js.map +1 -1
  185. package/dist/elements/Select/index.mjs +1 -582
  186. package/dist/elements/Select/index.mjs.map +1 -1
  187. package/dist/elements/Skeleton/index.js +1 -82
  188. package/dist/elements/Skeleton/index.js.map +1 -1
  189. package/dist/elements/Skeleton/index.mjs +1 -78
  190. package/dist/elements/Skeleton/index.mjs.map +1 -1
  191. package/dist/elements/Switch/index.js +1 -179
  192. package/dist/elements/Switch/index.js.map +1 -1
  193. package/dist/elements/Switch/index.mjs +1 -173
  194. package/dist/elements/Switch/index.mjs.map +1 -1
  195. package/dist/elements/Table/Table.d.ts +3 -24
  196. package/dist/elements/Table/Table.d.ts.map +1 -1
  197. package/dist/elements/Table/Table.styles.d.ts +24 -0
  198. package/dist/elements/Table/Table.styles.d.ts.map +1 -0
  199. package/dist/elements/Table/index.js +1 -595
  200. package/dist/elements/Table/index.js.map +1 -1
  201. package/dist/elements/Table/index.mjs +1 -578
  202. package/dist/elements/Table/index.mjs.map +1 -1
  203. package/dist/elements/Tabs/index.js +1 -337
  204. package/dist/elements/Tabs/index.js.map +1 -1
  205. package/dist/elements/Tabs/index.mjs +1 -320
  206. package/dist/elements/Tabs/index.mjs.map +1 -1
  207. package/dist/elements/TextField/TextField.d.ts +6 -42
  208. package/dist/elements/TextField/TextField.d.ts.map +1 -1
  209. package/dist/elements/TextField/TextField.hooks.d.ts +63 -0
  210. package/dist/elements/TextField/TextField.hooks.d.ts.map +1 -0
  211. package/dist/elements/TextField/TextField.icons.d.ts +19 -0
  212. package/dist/elements/TextField/TextField.icons.d.ts.map +1 -0
  213. package/dist/elements/TextField/TextField.styles.d.ts +37 -0
  214. package/dist/elements/TextField/TextField.styles.d.ts.map +1 -0
  215. package/dist/elements/TextField/TextField.types.d.ts +3 -0
  216. package/dist/elements/TextField/TextField.types.d.ts.map +1 -1
  217. package/dist/elements/TextField/index.css +1 -22
  218. package/dist/elements/TextField/index.css.map +1 -1
  219. package/dist/elements/TextField/index.js +1 -902
  220. package/dist/elements/TextField/index.js.map +1 -1
  221. package/dist/elements/TextField/index.mjs +1 -882
  222. package/dist/elements/TextField/index.mjs.map +1 -1
  223. package/dist/elements/TimeField/index.js +1 -254
  224. package/dist/elements/TimeField/index.js.map +1 -1
  225. package/dist/elements/TimeField/index.mjs +1 -238
  226. package/dist/elements/TimeField/index.mjs.map +1 -1
  227. package/dist/elements/Toast/Toast.d.ts +0 -22
  228. package/dist/elements/Toast/Toast.d.ts.map +1 -1
  229. package/dist/elements/Toast/index.js +1 -737
  230. package/dist/elements/Toast/index.js.map +1 -1
  231. package/dist/elements/Toast/index.mjs +1 -724
  232. package/dist/elements/Toast/index.mjs.map +1 -1
  233. package/dist/elements/Tooltip/index.js +1 -323
  234. package/dist/elements/Tooltip/index.js.map +1 -1
  235. package/dist/elements/Tooltip/index.mjs +1 -310
  236. package/dist/elements/Tooltip/index.mjs.map +1 -1
  237. package/dist/elements/index.css +1 -22
  238. package/dist/elements/index.css.map +1 -1
  239. package/dist/elements/index.d.ts +13 -1
  240. package/dist/elements/index.d.ts.map +1 -1
  241. package/dist/elements/index.js +1 -12455
  242. package/dist/elements/index.js.map +1 -1
  243. package/dist/elements/index.mjs +1 -12233
  244. package/dist/elements/index.mjs.map +1 -1
  245. package/dist/index.css +1 -22
  246. package/dist/index.css.map +1 -1
  247. package/dist/index.js +2 -12490
  248. package/dist/index.js.map +1 -1
  249. package/dist/index.mjs +2 -12262
  250. package/dist/index.mjs.map +1 -1
  251. package/dist/schemas/index.js +2 -54
  252. package/dist/schemas/index.js.map +1 -1
  253. package/dist/schemas/index.mjs +2 -48
  254. package/dist/schemas/index.mjs.map +1 -1
  255. package/dist/styles/defaults.css +151 -0
  256. package/dist/styles/index.js +1 -166
  257. package/dist/styles/index.js.map +1 -1
  258. package/dist/styles/index.mjs +1 -129
  259. package/dist/styles/index.mjs.map +1 -1
  260. package/dist/utils/index.js +1 -12
  261. package/dist/utils/index.js.map +1 -1
  262. package/dist/utils/index.mjs +1 -10
  263. package/dist/utils/index.mjs.map +1 -1
  264. package/package.json +9 -7
  265. package/src/elements/Accordion/Accordion.stories.tsx +1 -1
  266. package/src/elements/AlertDialog/AlertDialog.stories.tsx +124 -0
  267. package/src/elements/Avatar/Avatar.stories.tsx +1 -1
  268. package/src/elements/Badge/Badge.stories.tsx +1 -1
  269. package/src/elements/Breadcrumbs/Breadcrumbs.stories.tsx +1 -1
  270. package/src/elements/Button/Button.stories.tsx +1 -1
  271. package/src/elements/ButtonGroup/ButtonGroup.stories.tsx +1 -1
  272. package/src/elements/Card/Card.stories.tsx +1 -1
  273. package/src/elements/Carousel/Carousel.stories.tsx +1 -1
  274. package/src/elements/Chart/Chart.stories.tsx +1 -1
  275. package/src/elements/Checkbox/Checkbox.stories.tsx +1 -1
  276. package/src/elements/CheckboxGroup/CheckboxGroup.stories.tsx +1 -1
  277. package/src/elements/Combobox/Combobox.stories.tsx +133 -0
  278. package/src/elements/DatePicker/DatePicker.stories.tsx +1 -1
  279. package/src/elements/Dropdown/Dropdown.stories.tsx +1 -1
  280. package/src/elements/FileField/FileField.stories.tsx +1 -1
  281. package/src/elements/FileField/FileProgress.stories.tsx +1 -1
  282. package/src/elements/FormLayout/FormLayout.stories.tsx +1 -1
  283. package/src/elements/Modal/Modal.stories.tsx +1 -1
  284. package/src/elements/NumberField/NumberField.stories.tsx +1 -1
  285. package/src/elements/OTPInput/OTPInput.stories.tsx +1 -1
  286. package/src/elements/Pagination/Pagination.stories.tsx +203 -0
  287. package/src/elements/Panel/Panel.stories.tsx +1 -1
  288. package/src/elements/PasswordField/PasswordField.stories.tsx +167 -0
  289. package/src/elements/Progress/Progress.stories.tsx +1 -1
  290. package/src/elements/RadioGroup/RadioGroup.stories.tsx +1 -1
  291. package/src/elements/Resizable/Resizable.stories.tsx +1 -1
  292. package/src/elements/SearchField/SearchField.stories.tsx +146 -0
  293. package/src/elements/Select/Select.stories.tsx +1 -1
  294. package/src/elements/Skeleton/Skeleton.stories.tsx +1 -1
  295. package/src/elements/Switch/Switch.stories.tsx +1 -1
  296. package/src/elements/Table/Table.stories.tsx +1 -1
  297. package/src/elements/Tabs/Tabs.stories.tsx +1 -1
  298. package/src/elements/TextField/TextField.stories.tsx +1 -1
  299. package/src/elements/TimeField/TimeField.stories.tsx +1 -1
  300. package/src/elements/Toast/Toast.stories.tsx +1 -1
  301. package/src/elements/Tooltip/Tooltip.stories.tsx +1 -1
@@ -1,904 +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 clsx = require('clsx');
8
- var tailwindMerge = require('tailwind-merge');
9
- var lucideReact = require('lucide-react');
10
- var jsxRuntime = require('react/jsx-runtime');
11
- var zod = require('zod');
12
-
13
- // src/elements/TextField/TextField.tsx
14
- function cn(...inputs) {
15
- return tailwindMerge.twMerge(clsx.clsx(inputs));
16
- }
17
- var PRESSED_STYLES = "data-[pressed]:scale-[0.97]";
18
- var HOVER_STYLES = "data-[hovered]:shadow-md";
19
- var HIGH_CONTRAST_HOVER = "hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground";
20
- var HIGH_CONTRAST_PRESSED = "hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground";
21
- var DISABLED_STYLES = "disabled:pointer-events-none disabled:opacity-50";
22
- var ButtonGroupContext = react.createContext(null);
23
- ButtonGroupContext.displayName = "ButtonGroupContext";
24
- function useButtonGroupContext() {
25
- return react.useContext(ButtonGroupContext);
26
- }
27
- var ButtonGroupItemContext = react.createContext(null);
28
- ButtonGroupItemContext.displayName = "ButtonGroupItemContext";
29
- function useButtonGroupItemContext() {
30
- return react.useContext(ButtonGroupItemContext);
31
- }
32
- classVarianceAuthority.cva("inline-flex items-center gap-0", {
33
- variants: {
34
- orientation: {
35
- horizontal: "flex-row",
36
- vertical: "flex-col w-full"
37
- }
38
- },
39
- defaultVariants: {
40
- orientation: "horizontal"
41
- }
42
- });
43
- var buttonGroupItemVariants = classVarianceAuthority.cva("", {
44
- variants: {
45
- orientation: {
46
- // min-w-[44px] ensures visual layer fills touch target width (for icon buttons)
47
- horizontal: "min-w-[44px]",
48
- // flex (overrides inline-flex) + min-h-[44px] makes visual layer fill touch target,
49
- // eliminating gaps between stacked buttons in vertical orientation
50
- vertical: "flex min-h-[44px]"
51
- },
52
- position: {
53
- first: "",
54
- middle: "",
55
- last: "",
56
- only: ""
57
- // Single button - no modifications needed
58
- }
59
- },
60
- compoundVariants: [
61
- // ==========================================================================
62
- // Horizontal Orientation
63
- // ==========================================================================
64
- {
65
- orientation: "horizontal",
66
- position: "first",
67
- className: "rounded-r-none border-r-0"
68
- },
69
- {
70
- orientation: "horizontal",
71
- position: "middle",
72
- className: "rounded-none border-r-0"
73
- },
74
- {
75
- orientation: "horizontal",
76
- position: "last",
77
- className: "rounded-l-none"
78
- },
79
- // ==========================================================================
80
- // Vertical Orientation
81
- // Note: w-full is handled by Button's effectiveFullWidth for both layers
82
- // ==========================================================================
83
- {
84
- orientation: "vertical",
85
- position: "first",
86
- className: "rounded-b-none border-b-0"
87
- },
88
- {
89
- orientation: "vertical",
90
- position: "middle",
91
- className: "rounded-none border-b-0"
92
- },
93
- {
94
- orientation: "vertical",
95
- position: "last",
96
- className: "rounded-t-none"
97
- }
98
- ],
99
- defaultVariants: {
100
- orientation: "horizontal",
101
- position: "only"
102
- }
103
- });
104
- classVarianceAuthority.cva("bg-[var(--border)]", {
105
- variants: {
106
- orientation: {
107
- horizontal: "w-px h-6 mx-1",
108
- vertical: "h-px w-full my-1"
109
- }
110
- },
111
- defaultVariants: {
112
- orientation: "horizontal"
113
- }
114
- });
115
- var buttonOuterVariants = classVarianceAuthority.cva(
116
- "inline-flex justify-center min-h-[44px] min-w-[44px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50",
117
- {
118
- variants: {
119
- fullWidth: {
120
- true: "w-full",
121
- false: ""
122
- },
123
- inVerticalGroup: {
124
- true: "items-stretch",
125
- false: "items-center"
126
- }
127
- },
128
- defaultVariants: {
129
- fullWidth: false,
130
- inVerticalGroup: false
131
- }
132
- }
133
- );
134
- var buttonVisualVariants = classVarianceAuthority.cva(
135
- "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 relative cursor-pointer",
136
- {
137
- variants: {
138
- variant: {
139
- default: "bg-[var(--primary-action)] text-[var(--primary-action-foreground)] shadow-md hover:bg-[var(--primary-action-hover)] data-[pressed]:bg-[var(--primary-action)]/80",
140
- destructive: "bg-[var(--destructive-background)] text-[var(--destructive-foreground)] shadow-md hover:bg-[var(--destructive-background)]/90 data-[pressed]:bg-[var(--destructive-background)]/80",
141
- outline: "border border-[var(--input-border)] bg-[var(--page-background)] hover:bg-[var(--input-border)] data-[pressed]:bg-[var(--input-border)]",
142
- secondary: "bg-[var(--secondary)] text-[var(--secondary-foreground)] shadow-md hover:bg-[var(--secondary)]/80 data-[pressed]:bg-[var(--secondary)]/70",
143
- ghost: "hover:bg-[var(--accent)] hover:text-[var(--accent-foreground)] data-[pressed]:bg-[var(--accent)]",
144
- link: "text-[var(--text-link)] underline-offset-4 hover:underline data-[pressed]:text-[var(--text-link-hover)]"
145
- },
146
- fullWidth: {
147
- true: "w-full",
148
- false: ""
149
- },
150
- visualSize: {
151
- default: "h-10 px-4 py-2",
152
- sm: "h-9 rounded-md px-3 text-xs",
153
- lg: "h-11 rounded-md px-8",
154
- icon: "h-10 w-10",
155
- dot: "h-5 w-5 rounded-full p-0 min-h-0 min-w-0"
156
- },
157
- paywall: {
158
- true: "!bg-[var(--paywall)] !text-[var(--paywall-foreground)] !shadow-md hover:!bg-[var(--paywall)]/90 !cursor-not-allowed !border-transparent",
159
- false: ""
160
- }
161
- },
162
- defaultVariants: {
163
- variant: "default",
164
- visualSize: "default",
165
- paywall: false
166
- }
167
- }
168
- );
169
- var Button = react.memo(react.forwardRef(
170
- ({
171
- className,
172
- buttonVisualClassName,
173
- variant,
174
- size,
175
- visualSize,
176
- fullWidth,
177
- loading = false,
178
- loadingText = "Loading...",
179
- shortcut,
180
- children,
181
- isDisabled,
182
- paywall = false,
183
- paywallRedirect,
184
- paywallDescription,
185
- onPress,
186
- ...props
187
- }, ref) => {
188
- const paywallDescriptionId = react.useId();
189
- const groupContext = useButtonGroupContext();
190
- const itemContext = useButtonGroupItemContext();
191
- const effectiveVariant = variant ?? groupContext?.variant ?? "default";
192
- const effectiveSize = size ?? groupContext?.size;
193
- const effectiveIsDisabled = isDisabled ?? groupContext?.isDisabled ?? false;
194
- const isInVerticalGroup = groupContext?.orientation === "vertical";
195
- const effectiveFullWidth = fullWidth || isInVerticalGroup;
196
- const positionClassName = itemContext ? buttonGroupItemVariants({
197
- orientation: groupContext?.orientation ?? "horizontal",
198
- position: itemContext.position
199
- }) : "";
200
- const effectiveVisualSize = visualSize ?? effectiveSize ?? "default";
201
- if (process.env.NODE_ENV !== "production") {
202
- if ((effectiveVisualSize === "dot" || effectiveVisualSize === "icon") && !props["aria-label"] && !children) {
203
- console.warn(
204
- '[Button] visualSize="dot" or "icon" requires aria-label when no visible text is provided (WCAG 1.1.1)'
205
- );
206
- }
207
- }
208
- const handlePress = (e) => {
209
- if (paywall) {
210
- if (paywallRedirect) {
211
- window.open(paywallRedirect, "_blank", "noopener,noreferrer");
212
- }
213
- return;
214
- }
215
- onPress?.(e);
216
- };
217
- const computedIsDisabled = effectiveIsDisabled || loading || void 0;
218
- return /* @__PURE__ */ jsxRuntime.jsx(
219
- reactAriaComponents.Button,
220
- {
221
- ref,
222
- isDisabled: computedIsDisabled,
223
- "aria-disabled": paywall ? true : void 0,
224
- "aria-describedby": paywall ? paywallDescriptionId : void 0,
225
- onPress: handlePress,
226
- className: cn(buttonOuterVariants({ fullWidth: effectiveFullWidth, inVerticalGroup: isInVerticalGroup }), className),
227
- ...props,
228
- children: (renderProps) => (
229
- /* Layer 2: Visual Button */
230
- /* @__PURE__ */ jsxRuntime.jsxs(
231
- "span",
232
- {
233
- className: cn(
234
- buttonVisualVariants({
235
- variant: effectiveVariant,
236
- visualSize: effectiveVisualSize,
237
- paywall,
238
- fullWidth: effectiveFullWidth
239
- }),
240
- // Position styling from ButtonGroup context (border-radius adjustments)
241
- positionClassName,
242
- buttonVisualClassName,
243
- // Layer 2 interaction styles (no focus - focus ring is on Layer 1)
244
- PRESSED_STYLES,
245
- HOVER_STYLES,
246
- HIGH_CONTRAST_HOVER,
247
- HIGH_CONTRAST_PRESSED
248
- ),
249
- "data-pressed": renderProps.isPressed || void 0,
250
- children: [
251
- loading && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
252
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "motion-safe:animate-spin", "aria-hidden": "true" }),
253
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", "aria-live": "polite", children: loadingText })
254
- ] }),
255
- !loading && children,
256
- paywall && /* @__PURE__ */ jsxRuntime.jsx(
257
- lucideReact.Zap,
258
- {
259
- "data-testid": "zap-icon",
260
- "aria-hidden": "true",
261
- className: "ml-1"
262
- }
263
- ),
264
- paywall && /* @__PURE__ */ jsxRuntime.jsxs("span", { id: paywallDescriptionId, className: "sr-only", children: [
265
- "Premium feature: ",
266
- paywallDescription || "Upgrade required to access this feature"
267
- ] }),
268
- renderProps.isFocusVisible && shortcut && /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "ml-auto hidden text-xs opacity-60 lg:inline", children: shortcut }),
269
- renderProps.isPressed && /* @__PURE__ */ jsxRuntime.jsx(
270
- "span",
271
- {
272
- className: "absolute inset-0 rounded-[inherit] bg-current opacity-10 motion-safe:animate-in motion-safe:zoom-in-95",
273
- "aria-hidden": "true"
274
- }
275
- )
276
- ]
277
- }
278
- )
279
- )
280
- }
281
- );
282
- }
283
- ));
284
- Button.displayName = "Button";
285
- var inputVariants = classVarianceAuthority.cva(
286
- // Base styles - FR-014: Proper input styling with focus states
287
- "flex w-full rounded-md border bg-[var(--content-background)] shadow-xs px-3 py-2 text-sm ring-offset-[var(--content-background)] file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-[var(--content-foreground)] placeholder:text-[var(--menu-muted)] transition-all duration-200",
288
- {
289
- variants: {
290
- // Size variants (matching Button sizes)
291
- size: {
292
- sm: "h-9 text-xs px-2 py-1",
293
- default: "h-10 px-3 py-2",
294
- lg: "h-11 px-4 py-3 text-base"
295
- },
296
- // State variants
297
- state: {
298
- default: "border-[var(--input-border)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
299
- error: "border-[var(--destructive-background)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--destructive-background)] focus-visible:ring-offset-2",
300
- success: "border-green-500 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-green-500 focus-visible:ring-offset-2",
301
- disabled: "cursor-not-allowed opacity-50",
302
- readonly: "cursor-default bg-[var(--content-background)] opacity-70"
303
- }
304
- },
305
- defaultVariants: {
306
- size: "default",
307
- state: "default"
308
- }
309
- }
310
- );
311
- var labelVariants = classVarianceAuthority.cva(
312
- // Base styles - FR-009: WCAG 2.2 AAA compliance
313
- "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
314
- {
315
- variants: {
316
- state: {
317
- default: "text-[var(--content-foreground)]",
318
- error: "text-[var(--destructive-foreground)]",
319
- disabled: "opacity-50 cursor-not-allowed"
320
- }
321
- },
322
- defaultVariants: {
323
- state: "default"
324
- }
325
- }
326
- );
327
- var descriptionVariants = classVarianceAuthority.cva(
328
- "text-sm text-[var(--content-foreground)]"
329
- );
330
- var errorMessageVariants = classVarianceAuthority.cva(
331
- "text-sm text-[var(--destructive-foreground)] font-medium mt-1.5"
332
- );
333
- var successMessageVariants = classVarianceAuthority.cva(
334
- "text-sm text-green-600 dark:text-green-500 font-medium mt-1.5"
335
- );
336
- var TextFieldLabel = react.forwardRef(
337
- ({ className, state = "default", children, ...props }, ref) => {
338
- return /* @__PURE__ */ jsxRuntime.jsx(
339
- reactAriaComponents.Label,
340
- {
341
- ref,
342
- className: cn(labelVariants({ state }), className),
343
- ...props,
344
- children
345
- }
346
- );
347
- }
348
- );
349
- TextFieldLabel.displayName = "TextFieldLabel";
350
- var TextFieldInput = react.forwardRef(
351
- ({ className, size = "default", state = "default", ...props }, ref) => {
352
- return /* @__PURE__ */ jsxRuntime.jsx(
353
- reactAriaComponents.Input,
354
- {
355
- ref,
356
- className: cn(inputVariants({ size, state }), DISABLED_STYLES, className),
357
- ...props
358
- }
359
- );
360
- }
361
- );
362
- TextFieldInput.displayName = "TextFieldInput";
363
- var TextFieldDescription = react.forwardRef(
364
- ({ className, children, ...props }, ref) => {
365
- return /* @__PURE__ */ jsxRuntime.jsx(
366
- reactAriaComponents.Text,
367
- {
368
- ref,
369
- slot: "description",
370
- className: cn(descriptionVariants(), className),
371
- ...props,
372
- children
373
- }
374
- );
375
- }
376
- );
377
- TextFieldDescription.displayName = "TextFieldDescription";
378
- var TextFieldError = react.forwardRef(
379
- ({ className, children, ...props }, ref) => {
380
- return /* @__PURE__ */ jsxRuntime.jsx(
381
- reactAriaComponents.FieldError,
382
- {
383
- ref,
384
- ...props,
385
- className: cn(errorMessageVariants(), className),
386
- children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-2", role: "alert", children: [
387
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleAlert, { className: "h-4 w-4" }),
388
- children
389
- ] })
390
- }
391
- );
392
- }
393
- );
394
- TextFieldError.displayName = "TextFieldError";
395
- var TextFieldSuccess = react.forwardRef(
396
- ({ className, children, ...props }, ref) => {
397
- return /* @__PURE__ */ jsxRuntime.jsx(
398
- reactAriaComponents.Text,
399
- {
400
- ref,
401
- slot: "description",
402
- className: cn(successMessageVariants(), className),
403
- ...props,
404
- children
405
- }
406
- );
407
- }
408
- );
409
- TextFieldSuccess.displayName = "TextFieldSuccess";
410
- var TextField = react.forwardRef(
411
- ({
412
- className,
413
- size = "default",
414
- label,
415
- description,
416
- errorMessage,
417
- successMessage,
418
- type = "text",
419
- isRequired = false,
420
- isReadOnly = false,
421
- isDisabled = false,
422
- isInvalid = false,
423
- isValid = false,
424
- id,
425
- autoComplete,
426
- disableCopyPaste = false,
427
- pattern,
428
- patternDescription,
429
- expandOnFocus = false,
430
- collapsedWidth = "200px",
431
- prefix,
432
- suffix,
433
- prefixSize = 16,
434
- suffixSize = 16,
435
- showPasswordToggle,
436
- value,
437
- defaultValue,
438
- onFocus: userOnFocus,
439
- onBlur: userOnBlur,
440
- ...props
441
- }, ref) => {
442
- const errorId = react.useId();
443
- const generatedId = react.useId();
444
- const fieldId = id || generatedId;
445
- const [isShaking, setIsShaking] = react.useState(false);
446
- const [screenReaderMessage, setScreenReaderMessage] = react.useState("");
447
- const [isFocused, setIsFocused] = react.useState(false);
448
- const [showPassword, setShowPassword] = react.useState(false);
449
- react.useEffect(() => {
450
- if (disableCopyPaste && typeof process !== "undefined" && process.env.NODE_ENV === "development") {
451
- console.warn(
452
- "[TextField] Copy/paste prevention should only be used for security-critical fields like password confirmation. This feature can break assistive technology workflows and password managers."
453
- );
454
- }
455
- }, [disableCopyPaste]);
456
- const handlePaste = react.useCallback((e) => {
457
- if (disableCopyPaste) {
458
- e.preventDefault();
459
- setIsShaking(true);
460
- setScreenReaderMessage("Pasting is not allowed in this field. Please type your entry.");
461
- setTimeout(() => {
462
- setIsShaking(false);
463
- setScreenReaderMessage("");
464
- }, 400);
465
- }
466
- }, [disableCopyPaste]);
467
- const handleFocus = react.useCallback((e) => {
468
- if (expandOnFocus) {
469
- setIsFocused(true);
470
- }
471
- userOnFocus?.(e);
472
- }, [expandOnFocus, userOnFocus]);
473
- const handleBlur = react.useCallback((e) => {
474
- if (expandOnFocus) {
475
- const isEmpty = e.target.value === "";
476
- if (isEmpty) {
477
- setIsFocused(false);
478
- }
479
- }
480
- userOnBlur?.(e);
481
- }, [expandOnFocus, userOnBlur]);
482
- const inputWidth = react.useMemo(() => {
483
- if (!expandOnFocus) return void 0;
484
- const hasValue = value !== void 0 ? value !== "" : defaultValue !== void 0 && defaultValue !== "";
485
- if (isFocused || hasValue) {
486
- return "100%";
487
- }
488
- return collapsedWidth;
489
- }, [expandOnFocus, isFocused, value, defaultValue, collapsedWidth]);
490
- const inputState = react.useMemo(() => {
491
- if (isDisabled) return "disabled";
492
- if (isReadOnly) return "readonly";
493
- if (isInvalid) return "error";
494
- if (isValid) return "success";
495
- return "default";
496
- }, [isDisabled, isReadOnly, isInvalid, isValid]);
497
- const labelState = react.useMemo(() => {
498
- if (isDisabled) return "disabled";
499
- if (isInvalid) return "error";
500
- return "default";
501
- }, [isDisabled, isInvalid]);
502
- const combinedDescription = react.useMemo(() => {
503
- if (description && patternDescription) {
504
- return `${description} ${patternDescription}`;
505
- }
506
- return description || patternDescription;
507
- }, [description, patternDescription]);
508
- const inputPadding = react.useMemo(() => {
509
- const basePadding = { left: 12, right: 12 };
510
- if (prefix) {
511
- const prefixWidth = typeof prefix === "string" ? prefix.length * 8 + 16 : prefixSize + 16;
512
- basePadding.left = prefixWidth;
513
- }
514
- if (type === "password" && showPasswordToggle) {
515
- basePadding.right = 16 + 16;
516
- } else if (suffix) {
517
- const suffixWidth = typeof suffix === "string" ? suffix.length * 8 + 16 : suffixSize + 16;
518
- basePadding.right = suffixWidth;
519
- }
520
- return basePadding;
521
- }, [prefix, suffix, prefixSize, suffixSize, type, showPasswordToggle]);
522
- const actualType = react.useMemo(() => {
523
- if (type === "password" && showPasswordToggle && showPassword) {
524
- return "text";
525
- }
526
- return type;
527
- }, [type, showPasswordToggle, showPassword]);
528
- const handlePasswordToggle = react.useCallback(() => {
529
- setShowPassword((prev) => !prev);
530
- }, []);
531
- const EyeIcon = () => /* @__PURE__ */ jsxRuntime.jsxs(
532
- "svg",
533
- {
534
- "data-testid": "password-toggle-icon-show",
535
- width: "16",
536
- height: "16",
537
- viewBox: "0 0 16 16",
538
- fill: "none",
539
- stroke: "currentColor",
540
- strokeWidth: "2",
541
- strokeLinecap: "round",
542
- strokeLinejoin: "round",
543
- children: [
544
- /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M1 8s3-5 7-5 7 5 7 5-3 5-7 5-7-5-7-5z" }),
545
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "8", cy: "8", r: "2" })
546
- ]
547
- }
548
- );
549
- const EyeOffIcon = () => /* @__PURE__ */ jsxRuntime.jsxs(
550
- "svg",
551
- {
552
- "data-testid": "password-toggle-icon-hide",
553
- width: "16",
554
- height: "16",
555
- viewBox: "0 0 16 16",
556
- fill: "none",
557
- stroke: "currentColor",
558
- strokeWidth: "2",
559
- strokeLinecap: "round",
560
- strokeLinejoin: "round",
561
- children: [
562
- /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10.5 5.5l-5 5" }),
563
- /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M1 8s3-5 7-5c1.5 0 2.8.6 4 1.5M15 8s-1.5 2.5-4 4" }),
564
- /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 13l2-2m7-7l2-2" }),
565
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "8", cy: "8", r: "2" })
566
- ]
567
- }
568
- );
569
- const actualSuffix = react.useMemo(() => {
570
- if (type === "password" && showPasswordToggle) {
571
- return /* @__PURE__ */ jsxRuntime.jsx(
572
- Button,
573
- {
574
- variant: "ghost",
575
- visualSize: "icon",
576
- onPress: handlePasswordToggle,
577
- "aria-label": showPassword ? "Hide password" : "Show password",
578
- className: "!min-h-0 !min-w-0 h-8 w-8",
579
- children: showPassword ? /* @__PURE__ */ jsxRuntime.jsx(EyeOffIcon, {}) : /* @__PURE__ */ jsxRuntime.jsx(EyeIcon, {})
580
- }
581
- );
582
- }
583
- return suffix;
584
- }, [type, showPasswordToggle, showPassword, suffix, handlePasswordToggle]);
585
- return /* @__PURE__ */ jsxRuntime.jsxs(
586
- reactAriaComponents.TextField,
587
- {
588
- ref,
589
- className: cn("flex flex-col gap-1.5", className),
590
- isRequired,
591
- isReadOnly,
592
- isDisabled,
593
- isInvalid,
594
- value,
595
- defaultValue,
596
- ...props,
597
- children: [
598
- label && /* @__PURE__ */ jsxRuntime.jsxs(reactAriaComponents.Label, { className: cn(labelVariants({ state: labelState })), children: [
599
- label,
600
- isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 text-[var(--destructive-background)]", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "*" }) })
601
- ] }),
602
- combinedDescription && /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.Text, { slot: "description", className: cn(descriptionVariants()), children: combinedDescription }),
603
- /* @__PURE__ */ jsxRuntime.jsxs(
604
- "div",
605
- {
606
- className: "relative flex items-center transition-all duration-200",
607
- style: {
608
- width: inputWidth
609
- },
610
- children: [
611
- prefix && /* @__PURE__ */ jsxRuntime.jsx(
612
- "div",
613
- {
614
- "data-testid": "textfield-prefix",
615
- className: "absolute left-3 flex items-center justify-center pointer-events-none text-[var(--content-foreground)]",
616
- "aria-hidden": "true",
617
- children: prefix
618
- }
619
- ),
620
- /* @__PURE__ */ jsxRuntime.jsx(
621
- reactAriaComponents.Input,
622
- {
623
- type: actualType,
624
- id: fieldId,
625
- className: cn(
626
- inputVariants({ size, state: inputState }),
627
- DISABLED_STYLES,
628
- isShaking && "shake"
629
- ),
630
- style: {
631
- width: "100%",
632
- paddingLeft: `${inputPadding.left}px`,
633
- paddingRight: `${inputPadding.right}px`
634
- },
635
- autoComplete,
636
- pattern,
637
- onPaste: handlePaste,
638
- onFocus: handleFocus,
639
- onBlur: handleBlur,
640
- "aria-required": isRequired ? "true" : void 0,
641
- "aria-readonly": isReadOnly ? "true" : void 0,
642
- "aria-errormessage": isInvalid && errorMessage ? errorId : void 0
643
- }
644
- ),
645
- actualSuffix && /* @__PURE__ */ jsxRuntime.jsx(
646
- "div",
647
- {
648
- "data-testid": "textfield-suffix",
649
- className: cn(
650
- "absolute right-3 flex items-center justify-center text-[var(--content-foreground)]",
651
- // Password toggle is clickable, other suffixes are not
652
- type === "password" && showPasswordToggle ? "" : "pointer-events-none"
653
- ),
654
- "aria-hidden": type === "password" && showPasswordToggle ? void 0 : "true",
655
- children: actualSuffix
656
- }
657
- )
658
- ]
659
- }
660
- ),
661
- isValid && successMessage && !isInvalid && /* @__PURE__ */ jsxRuntime.jsx(reactAriaComponents.Text, { slot: "description", className: cn(successMessageVariants()), children: successMessage }),
662
- isInvalid && errorMessage && /* @__PURE__ */ jsxRuntime.jsx(TextFieldError, { id: errorId, children: errorMessage }),
663
- screenReaderMessage && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sr-only", role: "status", "aria-live": "polite", "aria-atomic": "true", children: screenReaderMessage })
664
- ]
665
- }
666
- );
667
- }
668
- );
669
- TextField.displayName = "TextField";
670
- var BaseComponentPropsSchema = zod.z.object({
671
- // Styling
672
- className: zod.z.string().optional(),
673
- // React
674
- children: zod.z.any().optional(),
675
- // ReactNode not directly supported by Zod
676
- id: zod.z.string().optional(),
677
- // Accessibility (WCAG 2.2 AA requirements)
678
- "aria-label": zod.z.string().optional(),
679
- "aria-labelledby": zod.z.string().optional(),
680
- "aria-describedby": zod.z.string().optional(),
681
- "aria-live": zod.z.enum(["off", "polite", "assertive"]).optional(),
682
- "aria-hidden": zod.z.boolean().optional(),
683
- // Testing & Development
684
- "data-testid": zod.z.string().optional()
685
- });
686
-
687
- // src/elements/TextField/TextField.types.ts
688
- var AutoCompleteValue = zod.z.enum([
689
- // Control tokens
690
- "off",
691
- "on",
692
- // Name-related
693
- "name",
694
- "honorific-prefix",
695
- "given-name",
696
- "additional-name",
697
- "family-name",
698
- "honorific-suffix",
699
- "nickname",
700
- // Contact
701
- "email",
702
- "username",
703
- // Authentication
704
- "new-password",
705
- "current-password",
706
- "one-time-code",
707
- // Organization
708
- "organization-title",
709
- "organization",
710
- // Address
711
- "street-address",
712
- "address-line1",
713
- "address-line2",
714
- "address-line3",
715
- "address-level4",
716
- "address-level3",
717
- "address-level2",
718
- "address-level1",
719
- "country",
720
- "country-name",
721
- "postal-code",
722
- // Payment
723
- "cc-name",
724
- "cc-given-name",
725
- "cc-additional-name",
726
- "cc-family-name",
727
- "cc-number",
728
- "cc-exp",
729
- "cc-exp-month",
730
- "cc-exp-year",
731
- "cc-csc",
732
- "cc-type",
733
- // Transaction
734
- "transaction-currency",
735
- "transaction-amount",
736
- // Personal
737
- "language",
738
- "bday",
739
- "bday-day",
740
- "bday-month",
741
- "bday-year",
742
- "sex",
743
- // Telephone
744
- "tel",
745
- "tel-country-code",
746
- "tel-national",
747
- "tel-area-code",
748
- "tel-local",
749
- "tel-extension",
750
- // Other
751
- "impp",
752
- "url",
753
- "photo"
754
- ]);
755
- var DANGEROUS_REGEX_PATTERNS = [
756
- /\(\.\*\)\+/,
757
- // Catastrophic backtracking: (.*)+
758
- /\(\.\+\)\+/,
759
- // Catastrophic backtracking: (.+)+
760
- /\([^)]*\)\{.*,.*\}/,
761
- // Excessive quantifiers: (x){10,1000}
762
- /\(\?!\)/,
763
- // Negative lookahead (can be slow)
764
- /\(\?<=\)/
765
- // Positive lookbehind (can be slow)
766
- ];
767
- var validatePatternSafety = (pattern) => {
768
- for (const dangerous of DANGEROUS_REGEX_PATTERNS) {
769
- if (dangerous.test(pattern)) {
770
- return false;
771
- }
772
- }
773
- const quantifierCount = (pattern.match(/[*+{}]/g) || []).length;
774
- if (quantifierCount > 5) {
775
- return false;
776
- }
777
- return true;
778
- };
779
- var TextFieldPropsSchema = BaseComponentPropsSchema.extend({
780
- // Size variants (matching Button sizes: sm, default, lg)
781
- size: zod.z.enum(["sm", "default", "lg"]).optional().default("default"),
782
- // Text content
783
- label: zod.z.string().optional(),
784
- description: zod.z.string().optional(),
785
- errorMessage: zod.z.string().optional(),
786
- successMessage: zod.z.string().optional(),
787
- // Input type - BREAKING: removed 'tel' (use TelField component instead)
788
- // @see DECISIONS.md Decision 14
789
- type: zod.z.enum(["text", "email", "password", "url", "search"]).optional().default("text"),
790
- // State props
791
- isRequired: zod.z.boolean().optional(),
792
- isReadOnly: zod.z.boolean().optional(),
793
- isDisabled: zod.z.boolean().optional(),
794
- isInvalid: zod.z.boolean().optional(),
795
- isValid: zod.z.boolean().optional(),
796
- // Input attributes
797
- placeholder: zod.z.string().optional(),
798
- value: zod.z.string().optional(),
799
- defaultValue: zod.z.string().optional(),
800
- name: zod.z.string().optional(),
801
- autoFocus: zod.z.boolean().optional(),
802
- // AutoComplete - BREAKING: strict MDN enum instead of string
803
- // @see DECISIONS.md Decision 13
804
- autoComplete: AutoCompleteValue.optional(),
805
- maxLength: zod.z.number().optional(),
806
- minLength: zod.z.number().optional(),
807
- // Pattern validation with security check
808
- // @see DECISIONS.md Decision 15, 18
809
- // @warning SECURITY: Only use patterns defined in source code, never from user input
810
- pattern: zod.z.string().optional(),
811
- patternDescription: zod.z.string().optional(),
812
- // Feature: Copy/Paste Restriction
813
- // @see DECISIONS.md Decision 4
814
- disableCopyPaste: zod.z.boolean().optional().default(false),
815
- // Feature: Prefix/Suffix
816
- // @see DECISIONS.md Decision 9
817
- prefix: zod.z.any().optional(),
818
- // ReactNode - can't validate with Zod
819
- suffix: zod.z.any().optional(),
820
- // ReactNode - can't validate with Zod
821
- prefixSize: zod.z.number().optional().default(16),
822
- suffixSize: zod.z.number().optional().default(16),
823
- // Feature: Expand on Focus
824
- // @see DECISIONS.md Decision 6, 17
825
- expandOnFocus: zod.z.boolean().optional().default(false),
826
- collapsedWidth: zod.z.string().optional().default("200px"),
827
- // Feature: Password Toggle
828
- // @see DECISIONS.md Decision 8
829
- showPasswordToggle: zod.z.boolean().optional()
830
- // Event handlers (onChange, onBlur, onFocus inherited from AriaTextFieldProps)
831
- // Custom validate function added in TypeScript type below (not in Zod schema)
832
- }).refine(
833
- (data) => !data.pattern || data.patternDescription,
834
- {
835
- message: "patternDescription is required when pattern is provided",
836
- path: ["patternDescription"]
837
- }
838
- ).refine(
839
- (data) => !data.pattern || validatePatternSafety(data.pattern),
840
- {
841
- message: "Unsafe regex pattern detected. Pattern may cause ReDoS vulnerability. Avoid patterns like (.*)+, (.+)+, or excessive quantifiers.",
842
- path: ["pattern"]
843
- }
844
- ).refine(
845
- (data) => !(data.successMessage && data.errorMessage),
846
- {
847
- message: "Cannot provide both successMessage and errorMessage. Use one based on validation state.",
848
- path: ["successMessage"]
849
- }
850
- ).refine(
851
- (data) => {
852
- if (typeof process !== "undefined" && process.env.NODE_ENV === "development") {
853
- if (data.isValid && data.isInvalid) {
854
- console.error("[TextField] Both isValid and isInvalid are true. isInvalid takes precedence.");
855
- }
856
- }
857
- return true;
858
- }
859
- );
860
- var TextFieldLabelPropsSchema = zod.z.object({
861
- children: zod.z.any().optional(),
862
- className: zod.z.string().optional(),
863
- htmlFor: zod.z.string().optional(),
864
- state: zod.z.enum(["default", "error", "disabled"]).optional().default("default")
865
- });
866
- var TextFieldInputPropsSchema = zod.z.object({
867
- className: zod.z.string().optional(),
868
- size: zod.z.enum(["sm", "default", "lg"]).optional().default("default"),
869
- state: zod.z.enum(["default", "error", "success", "disabled", "readonly"]).optional().default("default")
870
- });
871
- var TextFieldDescriptionPropsSchema = zod.z.object({
872
- children: zod.z.any().optional(),
873
- className: zod.z.string().optional()
874
- });
875
- var TextFieldErrorPropsSchema = zod.z.object({
876
- children: zod.z.any().optional(),
877
- className: zod.z.string().optional()
878
- });
879
- var TextFieldSuccessPropsSchema = zod.z.object({
880
- children: zod.z.any().optional(),
881
- className: zod.z.string().optional()
882
- });
883
-
884
- exports.AutoCompleteValueSchema = AutoCompleteValue;
885
- exports.TextField = TextField;
886
- exports.TextFieldDescription = TextFieldDescription;
887
- exports.TextFieldDescriptionPropsSchema = TextFieldDescriptionPropsSchema;
888
- exports.TextFieldError = TextFieldError;
889
- exports.TextFieldErrorPropsSchema = TextFieldErrorPropsSchema;
890
- exports.TextFieldInput = TextFieldInput;
891
- exports.TextFieldInputPropsSchema = TextFieldInputPropsSchema;
892
- exports.TextFieldLabel = TextFieldLabel;
893
- exports.TextFieldLabelPropsSchema = TextFieldLabelPropsSchema;
894
- exports.TextFieldPropsSchema = TextFieldPropsSchema;
895
- exports.TextFieldSuccess = TextFieldSuccess;
896
- exports.TextFieldSuccessPropsSchema = TextFieldSuccessPropsSchema;
897
- exports.inputVariants = inputVariants;
898
- exports.labelVariants = labelVariants;
899
- exports.successMessageVariants = successMessageVariants;
900
- exports.textFieldInputVariants = inputVariants;
901
- exports.textFieldLabelVariants = labelVariants;
902
- exports.validatePatternSafety = validatePatternSafety;
903
- //# sourceMappingURL=index.js.map
2
+ 'use strict';var react=require('react'),reactAriaComponents=require('react-aria-components'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),lucideReact=require('lucide-react'),classVarianceAuthority=require('class-variance-authority'),jsxRuntime=require('react/jsx-runtime'),zod=require('zod');function d(...t){return tailwindMerge.twMerge(clsx.clsx(t))}var ae="data-[pressed]:scale-[0.97]";var ne="data-[hovered]:shadow-md";var U="hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground",q="hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground",se="disabled:pointer-events-none disabled:opacity-50";var le=classVarianceAuthority.cva("inline-flex justify-center min-h-[44px] min-w-[44px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50",{variants:{fullWidth:{true:"w-full",false:""},inVerticalGroup:{true:"items-stretch",false:"items-center"}},defaultVariants:{fullWidth:false,inVerticalGroup:false}}),de=classVarianceAuthority.cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 relative cursor-pointer",{variants:{variant:{default:"bg-[var(--primary-action)] text-[var(--primary-action-foreground)] shadow-md hover:bg-[var(--primary-action-hover)] data-[pressed]:bg-[var(--primary-action)]/80",destructive:"bg-[var(--destructive-background)] text-[var(--destructive-foreground)] shadow-md hover:bg-[var(--destructive-background)]/90 data-[pressed]:bg-[var(--destructive-background)]/80",outline:"border border-[var(--input-border)] bg-[var(--page-background)] hover:bg-[var(--input-border)] data-[pressed]:bg-[var(--input-border)]",secondary:"bg-[var(--secondary)] text-[var(--secondary-foreground)] shadow-md hover:bg-[var(--secondary)]/80 data-[pressed]:bg-[var(--secondary)]/70",ghost:"hover:bg-[var(--accent)] hover:text-[var(--accent-foreground)] data-[pressed]:bg-[var(--accent)]",link:"text-[var(--text-link)] underline-offset-4 hover:underline data-[pressed]:text-[var(--text-link-hover)]"},fullWidth:{true:"w-full",false:""},visualSize:{default:"h-10 px-4 py-2",sm:"h-9 rounded-md px-3 text-xs",lg:"h-11 rounded-md px-8",icon:"h-10 w-10",dot:"h-5 w-5 rounded-full p-0 min-h-0 min-w-0"},paywall:{true:"!bg-[var(--paywall)] !text-[var(--paywall-foreground)] !shadow-md hover:!bg-[var(--paywall)]/90 !cursor-not-allowed !border-transparent",false:""}},defaultVariants:{variant:"default",visualSize:"default",paywall:false}});var Ve=react.createContext(null);Ve.displayName="ButtonGroupContext";function we(){return react.useContext(Ve)}var Ce=react.createContext(null);Ce.displayName="ButtonGroupItemContext";function Ie(){return react.useContext(Ce)}classVarianceAuthority.cva("inline-flex items-center gap-0",{variants:{orientation:{horizontal:"flex-row",vertical:"flex-col w-full"}},defaultVariants:{orientation:"horizontal"}});var Le=classVarianceAuthority.cva("",{variants:{orientation:{horizontal:"min-w-[44px]",vertical:"flex min-h-[44px]"},position:{first:"",middle:"",last:"",only:""}},compoundVariants:[{orientation:"horizontal",position:"first",className:"rounded-r-none border-r-0"},{orientation:"horizontal",position:"middle",className:"rounded-none border-r-0"},{orientation:"horizontal",position:"last",className:"rounded-l-none"},{orientation:"vertical",position:"first",className:"rounded-b-none border-b-0"},{orientation:"vertical",position:"middle",className:"rounded-none border-b-0"},{orientation:"vertical",position:"last",className:"rounded-t-none"}],defaultVariants:{orientation:"horizontal",position:"only"}});classVarianceAuthority.cva("bg-[var(--border)]",{variants:{orientation:{horizontal:"w-px h-6 mx-1",vertical:"h-px w-full my-1"}},defaultVariants:{orientation:"horizontal"}});var R=react.memo(react.forwardRef(({className:t,buttonVisualClassName:o,variant:r,size:a,visualSize:s,fullWidth:c,loading:i=false,loadingText:g="Loading...",shortcut:h,children:m,isDisabled:u,paywall:l=false,paywallRedirect:L,paywallDescription:ee,onPress:te,...H},F)=>{let O=react.useId(),T=we(),S=Ie(),y=r??T?.variant??"default",W=a??T?.size,$=u??T?.isDisabled??false,v=T?.orientation==="vertical",A=c||v,k=S?Le({orientation:T?.orientation??"horizontal",position:S.position}):"",E=s??W??"default";return process.env.NODE_ENV!=="production"&&(E==="dot"||E==="icon")&&!H["aria-label"]&&!m&&console.warn('[Button] visualSize="dot" or "icon" requires aria-label when no visible text is provided (WCAG 1.1.1)'),jsxRuntime.jsx(reactAriaComponents.Button,{ref:F,isDisabled:$||i||void 0,"aria-disabled":l?true:void 0,"aria-describedby":l?O:void 0,onPress:P=>{if(l){L&&window.open(L,"_blank","noopener,noreferrer");return}te?.(P);},className:d(le({fullWidth:A,inVerticalGroup:v}),t),...H,children:P=>jsxRuntime.jsxs("span",{className:d(de({variant:y,visualSize:E,paywall:l,fullWidth:A}),k,o,ae,ne,U,q),"data-pressed":P.isPressed||void 0,children:[i&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(lucideReact.Loader2,{className:"motion-safe:animate-spin","aria-hidden":"true"}),jsxRuntime.jsx("span",{className:"sr-only","aria-live":"polite",children:g})]}),!i&&m,l&&jsxRuntime.jsx(lucideReact.Zap,{"data-testid":"zap-icon","aria-hidden":"true",className:"ml-1"}),l&&jsxRuntime.jsxs("span",{id:O,className:"sr-only",children:["Premium feature: ",ee||"Upgrade required to access this feature"]}),P.isFocusVisible&&h&&jsxRuntime.jsx("kbd",{className:"ml-auto hidden text-xs opacity-60 lg:inline",children:h}),P.isPressed&&jsxRuntime.jsx("span",{className:"absolute inset-0 rounded-[inherit] bg-current opacity-10 motion-safe:animate-in motion-safe:zoom-in-95","aria-hidden":"true"})]})})}));R.displayName="Button";var Ae=()=>jsxRuntime.jsxs("svg",{"data-testid":"password-toggle-icon-show",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("path",{d:"M1 8s3-5 7-5 7 5 7 5-3 5-7 5-7-5-7-5z"}),jsxRuntime.jsx("circle",{cx:"8",cy:"8",r:"2"})]}),ke=()=>jsxRuntime.jsxs("svg",{"data-testid":"password-toggle-icon-hide",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[jsxRuntime.jsx("path",{d:"M10.5 5.5l-5 5"}),jsxRuntime.jsx("path",{d:"M1 8s3-5 7-5c1.5 0 2.8.6 4 1.5M15 8s-1.5 2.5-4 4"}),jsxRuntime.jsx("path",{d:"M3 13l2-2m7-7l2-2"}),jsxRuntime.jsx("circle",{cx:"8",cy:"8",r:"2"})]});var G=classVarianceAuthority.cva("flex w-full rounded-md border bg-[var(--content-background)] shadow-xs px-3 py-2 text-sm ring-offset-[var(--content-background)] file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-[var(--content-foreground)] placeholder:text-[var(--menu-muted)] transition-all duration-200",{variants:{size:{sm:"h-9 text-xs px-2 py-1",default:"h-10 px-3 py-2",lg:"h-11 px-4 py-3 text-base"},state:{default:"border-[var(--input-border)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",error:"border-[var(--destructive-background)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--destructive-background)] focus-visible:ring-offset-2",success:"border-[var(--success-background)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--success-ring)] focus-visible:ring-offset-2",disabled:"cursor-not-allowed opacity-50",readonly:"cursor-default bg-[var(--content-background)] opacity-70"}},defaultVariants:{size:"default",state:"default"}}),M=classVarianceAuthority.cva("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",{variants:{state:{default:"text-[var(--content-foreground)]",error:"text-[var(--destructive-foreground)]",disabled:"opacity-50 cursor-not-allowed"}},defaultVariants:{state:"default"}}),ce=classVarianceAuthority.cva("text-sm text-[var(--content-foreground)]"),ze=classVarianceAuthority.cva("text-sm text-[var(--destructive-foreground)] font-medium mt-1.5"),X=classVarianceAuthority.cva("text-sm text-[var(--success-foreground)] font-medium mt-1.5");function Re({expandOnFocus:t,collapsedWidth:o,value:r,defaultValue:a,userOnFocus:s,userOnBlur:c}){let[i,g]=react.useState(false),h=react.useCallback(l=>{t&&g(true),s?.(l);},[t,s]),m=react.useCallback(l=>{t&&l.target.value===""&&g(false),c?.(l);},[t,c]),u=react.useMemo(()=>t?i||(r!==void 0?r!=="":a!==void 0&&a!=="")?"100%":o:void 0,[t,i,r,a,o]);return {handleFocus:h,handleBlur:m,inputWidth:u}}function _e({disableCopyPaste:t}){let[o,r]=react.useState(false),[a,s]=react.useState("");react.useEffect(()=>{t&&typeof process<"u"&&process.env.NODE_ENV==="development"&&console.warn("[TextField] Copy/paste prevention should only be used for security-critical fields like password confirmation. This feature can break assistive technology workflows and password managers.");},[t]);let c=react.useCallback(i=>{t&&(i.preventDefault(),r(true),s("Pasting is not allowed in this field. Please type your entry."),setTimeout(()=>{r(false),s("");},400));},[t]);return {isShaking:o,screenReaderMessage:a,handlePaste:c}}function Ge({type:t,showPasswordToggle:o}){let[r,a]=react.useState(false),s=react.useCallback(()=>{a(i=>!i);},[]),c=react.useMemo(()=>t==="password"&&o&&r?"text":t,[t,o,r]);return {showPassword:r,actualType:c,handlePasswordToggle:s}}var We=react.forwardRef(({className:t,state:o="default",children:r,...a},s)=>jsxRuntime.jsx(reactAriaComponents.Label,{ref:s,className:d(M({state:o}),t),...a,children:r}));We.displayName="TextFieldLabel";var $e=react.forwardRef(({className:t,size:o="default",state:r="default",...a},s)=>jsxRuntime.jsx(reactAriaComponents.Input,{ref:s,className:d(G({size:o,state:r}),se,t),...a}));$e.displayName="TextFieldInput";var je=react.forwardRef(({className:t,children:o,...r},a)=>jsxRuntime.jsx(reactAriaComponents.Text,{ref:a,slot:"description",className:d(ce(),t),...r,children:o}));je.displayName="TextFieldDescription";var me=react.forwardRef(({className:t,children:o,...r},a)=>jsxRuntime.jsx(reactAriaComponents.FieldError,{ref:a,...r,className:d(ze(),t),children:jsxRuntime.jsxs("span",{className:"flex items-center gap-2",role:"alert",children:[jsxRuntime.jsx(lucideReact.CircleAlert,{className:"h-4 w-4"}),o]})}));me.displayName="TextFieldError";var Ye=react.forwardRef(({className:t,children:o,...r},a)=>jsxRuntime.jsx(reactAriaComponents.Text,{ref:a,slot:"description",className:d(X(),t),...r,children:o}));Ye.displayName="TextFieldSuccess";var Ue=react.forwardRef(({className:t,size:o="default",label:r,description:a,errorMessage:s,successMessage:c,type:i="text",isRequired:g=false,isReadOnly:h=false,isDisabled:m=false,isInvalid:u=false,isValid:l=false,id:L,autoComplete:ee,disableCopyPaste:te=false,pattern:H,patternDescription:F,expandOnFocus:O=false,collapsedWidth:T="200px",prefix:S,suffix:y,prefixSize:W=16,suffixSize:$=16,showPasswordToggle:v,isIconHidden:A=false,onSubmit:k,onClear:E,value:B,defaultValue:j,onFocus:P,onBlur:Ze,...z},Je)=>{let xe=react.useId(),Qe=react.useId(),et=L||Qe,{handleFocus:tt,handleBlur:ot,inputWidth:rt}=Re({expandOnFocus:O,collapsedWidth:T,value:B,defaultValue:j,userOnFocus:P,userOnBlur:Ze}),{isShaking:at,screenReaderMessage:he,handlePaste:nt}=_e({disableCopyPaste:te}),{showPassword:oe,actualType:it,handlePasswordToggle:ve}=Ge({type:i,showPasswordToggle:v}),f=i==="search",[st,be]=react.useState(j??""),D=B!==void 0,b=D?B:st,lt=react.useCallback(p=>{D||be(p),z.onChange?.(p);},[D,z]),Y=react.useCallback(()=>{D||be(""),z.onChange?.(""),E?.();},[D,z,E]),dt=react.useCallback(p=>{p.key==="Enter"&&k&&k(b),p.key==="Escape"&&b&&(p.preventDefault(),Y());},[b,k,Y]),pt=react.useMemo(()=>m?"disabled":h?"readonly":u?"error":l?"success":"default",[m,h,u,l]),ut=react.useMemo(()=>m?"disabled":u?"error":"default",[m,u]),ge=react.useMemo(()=>a&&F?`${a} ${F}`:a||F,[a,F]),N=react.useMemo(()=>f&&!A&&!S?jsxRuntime.jsx(lucideReact.Search,{className:o==="sm"?"h-3.5 w-3.5":o==="lg"?"h-5 w-5":"h-4 w-4"}):S,[f,A,S,o]),ye=react.useMemo(()=>{let p={left:12,right:12};if(N){let re=typeof N=="string"?N.length*8+16:W+16;p.left=re;}if(i==="password"&&v)p.right=32;else if(f&&b)p.right=44;else if(y){let re=typeof y=="string"?y.length*8+16:$+16;p.right=re;}return p},[N,S,y,W,$,i,v,f,b]),Te=react.useMemo(()=>i==="password"&&v?jsxRuntime.jsx(R,{variant:"ghost",visualSize:"icon",onPress:ve,"aria-label":oe?"Hide password":"Show password",className:"!min-h-0 !min-w-0 h-8 w-8",children:oe?jsxRuntime.jsx(ke,{}):jsxRuntime.jsx(Ae,{})}):f&&b?jsxRuntime.jsx(R,{variant:"ghost",visualSize:"icon",onPress:Y,"aria-label":"Clear search",className:"!min-h-0 !min-w-0 h-8 w-8",children:jsxRuntime.jsx(lucideReact.X,{className:o==="sm"?"h-3 w-3":o==="lg"?"h-5 w-5":"h-4 w-4"})}):y,[i,v,oe,y,ve,f,b,o,Y]),Se=i==="password"&&v||f&&!!b;return jsxRuntime.jsxs(reactAriaComponents.TextField,{ref:Je,className:d("flex flex-col gap-1.5",t),isRequired:g,isReadOnly:h,isDisabled:m,isInvalid:u,value:f?b:B,defaultValue:f?void 0:j,onChange:f?lt:void 0,...z,children:[r&&jsxRuntime.jsxs(reactAriaComponents.Label,{className:d(M({state:ut})),children:[r,g&&jsxRuntime.jsx("span",{className:"ml-1 text-[var(--destructive-background)]","aria-hidden":"true",children:jsxRuntime.jsx("strong",{children:"*"})})]}),ge&&jsxRuntime.jsx(reactAriaComponents.Text,{slot:"description",className:d(ce()),children:ge}),jsxRuntime.jsxs("div",{className:"relative flex items-center motion-safe:transition-all motion-safe:duration-200",style:{width:rt},children:[N&&jsxRuntime.jsx("div",{"data-testid":"textfield-prefix",className:"absolute left-3 flex items-center justify-center pointer-events-none text-[var(--content-foreground)]","aria-hidden":"true",children:N}),jsxRuntime.jsx(reactAriaComponents.Input,{type:it,id:et,className:d(G({size:o,state:pt}),se,at&&"shake"),style:{width:"100%",paddingLeft:`${ye.left}px`,paddingRight:`${ye.right}px`},autoComplete:ee,pattern:H,onPaste:nt,onFocus:tt,onBlur:ot,onKeyDown:f?dt:void 0,"aria-required":g?"true":void 0,"aria-readonly":h?"true":void 0,"aria-errormessage":u&&s?xe:void 0}),Te&&jsxRuntime.jsx("div",{"data-testid":"textfield-suffix",className:d("absolute right-3 flex items-center justify-center text-[var(--content-foreground)]",Se?"":"pointer-events-none"),"aria-hidden":Se?void 0:"true",children:Te})]}),l&&c&&!u&&jsxRuntime.jsx(reactAriaComponents.Text,{slot:"description",className:d(X()),children:c}),u&&s&&jsxRuntime.jsx(me,{id:xe,children:s}),he&&jsxRuntime.jsx("div",{className:"sr-only",role:"status","aria-live":"polite","aria-atomic":"true",children:he})]})});Ue.displayName="TextField";var qe=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 Xe=zod.z.enum(["off","on","name","honorific-prefix","given-name","additional-name","family-name","honorific-suffix","nickname","email","username","new-password","current-password","one-time-code","organization-title","organization","street-address","address-line1","address-line2","address-line3","address-level4","address-level3","address-level2","address-level1","country","country-name","postal-code","cc-name","cc-given-name","cc-additional-name","cc-family-name","cc-number","cc-exp","cc-exp-month","cc-exp-year","cc-csc","cc-type","transaction-currency","transaction-amount","language","bday","bday-day","bday-month","bday-year","sex","tel","tel-country-code","tel-national","tel-area-code","tel-local","tel-extension","impp","url","photo"]),Ct=[/\(\.\*\)\+/,/\(\.\+\)\+/,/\([^)]*\)\{.*,.*\}/,/\(\?!\)/,/\(\?<=\)/],Ke=t=>{for(let r of Ct)if(r.test(t))return false;return !((t.match(/[*+{}]/g)||[]).length>5)},It=qe.extend({size:zod.z.enum(["sm","default","lg"]).optional().default("default"),label:zod.z.string().optional(),description:zod.z.string().optional(),errorMessage:zod.z.string().optional(),successMessage:zod.z.string().optional(),type:zod.z.enum(["text","email","password","url","search"]).optional().default("text"),isRequired:zod.z.boolean().optional(),isReadOnly:zod.z.boolean().optional(),isDisabled:zod.z.boolean().optional(),isInvalid:zod.z.boolean().optional(),isValid:zod.z.boolean().optional(),placeholder:zod.z.string().optional(),value:zod.z.string().optional(),defaultValue:zod.z.string().optional(),name:zod.z.string().optional(),autoFocus:zod.z.boolean().optional(),autoComplete:Xe.optional(),maxLength:zod.z.number().optional(),minLength:zod.z.number().optional(),pattern:zod.z.string().optional(),patternDescription:zod.z.string().optional(),disableCopyPaste:zod.z.boolean().optional().default(false),prefix:zod.z.any().optional(),suffix:zod.z.any().optional(),prefixSize:zod.z.number().optional().default(16),suffixSize:zod.z.number().optional().default(16),expandOnFocus:zod.z.boolean().optional().default(false),collapsedWidth:zod.z.string().optional().default("200px"),showPasswordToggle:zod.z.boolean().optional(),isIconHidden:zod.z.boolean().optional().default(false),onSubmit:zod.z.custom().optional(),onClear:zod.z.custom().optional()}).refine(t=>!t.pattern||t.patternDescription,{message:"patternDescription is required when pattern is provided",path:["patternDescription"]}).refine(t=>!t.pattern||Ke(t.pattern),{message:"Unsafe regex pattern detected. Pattern may cause ReDoS vulnerability. Avoid patterns like (.*)+, (.+)+, or excessive quantifiers.",path:["pattern"]}).refine(t=>!(t.successMessage&&t.errorMessage),{message:"Cannot provide both successMessage and errorMessage. Use one based on validation state.",path:["successMessage"]}).refine(t=>(typeof process<"u"&&process.env.NODE_ENV==="development"&&t.isValid&&t.isInvalid&&console.error("[TextField] Both isValid and isInvalid are true. isInvalid takes precedence."),true)),Lt=zod.z.object({children:zod.z.any().optional(),className:zod.z.string().optional(),htmlFor:zod.z.string().optional(),state:zod.z.enum(["default","error","disabled"]).optional().default("default")}),At=zod.z.object({className:zod.z.string().optional(),size:zod.z.enum(["sm","default","lg"]).optional().default("default"),state:zod.z.enum(["default","error","success","disabled","readonly"]).optional().default("default")}),kt=zod.z.object({children:zod.z.any().optional(),className:zod.z.string().optional()}),Bt=zod.z.object({children:zod.z.any().optional(),className:zod.z.string().optional()}),zt=zod.z.object({children:zod.z.any().optional(),className:zod.z.string().optional()});exports.AutoCompleteValueSchema=Xe;exports.TextField=Ue;exports.TextFieldDescription=je;exports.TextFieldDescriptionPropsSchema=kt;exports.TextFieldError=me;exports.TextFieldErrorPropsSchema=Bt;exports.TextFieldInput=$e;exports.TextFieldInputPropsSchema=At;exports.TextFieldLabel=We;exports.TextFieldLabelPropsSchema=Lt;exports.TextFieldPropsSchema=It;exports.TextFieldSuccess=Ye;exports.TextFieldSuccessPropsSchema=zt;exports.inputVariants=G;exports.labelVariants=M;exports.successMessageVariants=X;exports.textFieldInputVariants=G;exports.textFieldLabelVariants=M;exports.validatePatternSafety=Ke;//# sourceMappingURL=index.js.map
904
3
  //# sourceMappingURL=index.js.map