@tribepad/themis 1.0.0 → 1.0.1

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 (326) hide show
  1. package/dist/elements/Accordion/index.js +325 -66
  2. package/dist/elements/Accordion/index.js.map +1 -1
  3. package/dist/elements/Accordion/index.mjs +317 -3
  4. package/dist/elements/Accordion/index.mjs.map +1 -1
  5. package/dist/elements/Avatar/index.js +461 -45
  6. package/dist/elements/Avatar/index.js.map +1 -1
  7. package/dist/elements/Avatar/index.mjs +456 -3
  8. package/dist/elements/Avatar/index.mjs.map +1 -1
  9. package/dist/elements/Badge/index.js +238 -36
  10. package/dist/elements/Badge/index.js.map +1 -1
  11. package/dist/elements/Badge/index.mjs +234 -4
  12. package/dist/elements/Badge/index.mjs.map +1 -1
  13. package/dist/elements/Breadcrumbs/index.js +808 -39
  14. package/dist/elements/Breadcrumbs/index.js.map +1 -1
  15. package/dist/elements/Breadcrumbs/index.mjs +810 -7
  16. package/dist/elements/Breadcrumbs/index.mjs.map +1 -1
  17. package/dist/elements/Button/index.js +282 -19
  18. package/dist/elements/Button/index.js.map +1 -1
  19. package/dist/elements/Button/index.mjs +283 -4
  20. package/dist/elements/Button/index.mjs.map +1 -1
  21. package/dist/elements/ButtonGroup/index.js +229 -56
  22. package/dist/elements/ButtonGroup/index.js.map +1 -1
  23. package/dist/elements/ButtonGroup/index.mjs +222 -3
  24. package/dist/elements/ButtonGroup/index.mjs.map +1 -1
  25. package/dist/elements/Card/Card.d.ts.map +1 -1
  26. package/dist/elements/Card/index.js +563 -67
  27. package/dist/elements/Card/index.js.map +1 -1
  28. package/dist/elements/Card/index.mjs +560 -6
  29. package/dist/elements/Card/index.mjs.map +1 -1
  30. package/dist/elements/Carousel/index.js +782 -14
  31. package/dist/elements/Carousel/index.js.map +1 -1
  32. package/dist/elements/Carousel/index.mjs +786 -8
  33. package/dist/elements/Carousel/index.mjs.map +1 -1
  34. package/dist/elements/Chart/index.js +1833 -36
  35. package/dist/elements/Chart/index.js.map +1 -1
  36. package/dist/elements/Chart/index.mjs +1832 -4
  37. package/dist/elements/Chart/index.mjs.map +1 -1
  38. package/dist/elements/Checkbox/index.js +310 -39
  39. package/dist/elements/Checkbox/index.js.map +1 -1
  40. package/dist/elements/Checkbox/index.mjs +306 -4
  41. package/dist/elements/Checkbox/index.mjs.map +1 -1
  42. package/dist/elements/CheckboxGroup/index.js +445 -59
  43. package/dist/elements/CheckboxGroup/index.js.map +1 -1
  44. package/dist/elements/CheckboxGroup/index.mjs +439 -4
  45. package/dist/elements/CheckboxGroup/index.mjs.map +1 -1
  46. package/dist/elements/DatePicker/index.js +871 -89
  47. package/dist/elements/DatePicker/index.js.map +1 -1
  48. package/dist/elements/DatePicker/index.mjs +853 -4
  49. package/dist/elements/DatePicker/index.mjs.map +1 -1
  50. package/dist/elements/Dropdown/index.js +189 -35
  51. package/dist/elements/Dropdown/index.js.map +1 -1
  52. package/dist/elements/Dropdown/index.mjs +184 -2
  53. package/dist/elements/Dropdown/index.mjs.map +1 -1
  54. package/dist/elements/FileField/index.js +1532 -129
  55. package/dist/elements/FileField/index.js.map +1 -1
  56. package/dist/elements/FileField/index.mjs +1507 -7
  57. package/dist/elements/FileField/index.mjs.map +1 -1
  58. package/dist/elements/FormLayout/index.js +166 -11
  59. package/dist/elements/FormLayout/index.js.map +1 -1
  60. package/dist/elements/FormLayout/index.mjs +167 -2
  61. package/dist/elements/FormLayout/index.mjs.map +1 -1
  62. package/dist/elements/Modal/index.js +228 -46
  63. package/dist/elements/Modal/index.js.map +1 -1
  64. package/dist/elements/Modal/index.mjs +220 -1
  65. package/dist/elements/Modal/index.mjs.map +1 -1
  66. package/dist/elements/NumberField/index.js +659 -48
  67. package/dist/elements/NumberField/index.js.map +1 -1
  68. package/dist/elements/NumberField/index.mjs +654 -6
  69. package/dist/elements/NumberField/index.mjs.map +1 -1
  70. package/dist/elements/OTPInput/index.js +729 -6
  71. package/dist/elements/OTPInput/index.js.map +1 -1
  72. package/dist/elements/OTPInput/index.mjs +732 -2
  73. package/dist/elements/OTPInput/index.mjs.map +1 -1
  74. package/dist/elements/Panel/index.js +326 -27
  75. package/dist/elements/Panel/index.js.map +1 -1
  76. package/dist/elements/Panel/index.mjs +323 -2
  77. package/dist/elements/Panel/index.mjs.map +1 -1
  78. package/dist/elements/Progress/index.js +181 -22
  79. package/dist/elements/Progress/index.js.map +1 -1
  80. package/dist/elements/Progress/index.mjs +181 -3
  81. package/dist/elements/Progress/index.mjs.map +1 -1
  82. package/dist/elements/RadioGroup/index.js +358 -34
  83. package/dist/elements/RadioGroup/index.js.map +1 -1
  84. package/dist/elements/RadioGroup/index.mjs +359 -4
  85. package/dist/elements/RadioGroup/index.mjs.map +1 -1
  86. package/dist/elements/Resizable/components/ResizableHandle.d.ts +0 -8
  87. package/dist/elements/Resizable/components/ResizableHandle.d.ts.map +1 -1
  88. package/dist/elements/Resizable/components/ResizablePanel.d.ts +0 -8
  89. package/dist/elements/Resizable/components/ResizablePanel.d.ts.map +1 -1
  90. package/dist/elements/Resizable/components/ResizablePanelGroup.d.ts +0 -8
  91. package/dist/elements/Resizable/components/ResizablePanelGroup.d.ts.map +1 -1
  92. package/dist/elements/Resizable/components/ResizablePopover.d.ts +0 -8
  93. package/dist/elements/Resizable/components/ResizablePopover.d.ts.map +1 -1
  94. package/dist/elements/Resizable/index.js +1568 -51
  95. package/dist/elements/Resizable/index.js.map +1 -1
  96. package/dist/elements/Resizable/index.mjs +1566 -6
  97. package/dist/elements/Resizable/index.mjs.map +1 -1
  98. package/dist/elements/Select/index.js +580 -22
  99. package/dist/elements/Select/index.js.map +1 -1
  100. package/dist/elements/Select/index.mjs +582 -2
  101. package/dist/elements/Select/index.mjs.map +1 -1
  102. package/dist/elements/Skeleton/index.js +77 -15
  103. package/dist/elements/Skeleton/index.js.map +1 -1
  104. package/dist/elements/Skeleton/index.mjs +78 -3
  105. package/dist/elements/Skeleton/index.mjs.map +1 -1
  106. package/dist/elements/Switch/index.js +153 -21
  107. package/dist/elements/Switch/index.js.map +1 -1
  108. package/dist/elements/Switch/index.mjs +149 -5
  109. package/dist/elements/Switch/index.mjs.map +1 -1
  110. package/dist/elements/Table/index.js +589 -68
  111. package/dist/elements/Table/index.js.map +1 -1
  112. package/dist/elements/Table/index.mjs +578 -5
  113. package/dist/elements/Table/index.mjs.map +1 -1
  114. package/dist/elements/Tabs/index.js +328 -63
  115. package/dist/elements/Tabs/index.js.map +1 -1
  116. package/dist/elements/Tabs/index.mjs +320 -3
  117. package/dist/elements/Tabs/index.mjs.map +1 -1
  118. package/dist/elements/TextField/index.js +695 -51
  119. package/dist/elements/TextField/index.js.map +1 -1
  120. package/dist/elements/TextField/index.mjs +684 -7
  121. package/dist/elements/TextField/index.mjs.map +1 -1
  122. package/dist/elements/TimeField/index.js +244 -33
  123. package/dist/elements/TimeField/index.js.map +1 -1
  124. package/dist/elements/TimeField/index.mjs +238 -2
  125. package/dist/elements/TimeField/index.mjs.map +1 -1
  126. package/dist/elements/Toast/index.js +727 -48
  127. package/dist/elements/Toast/index.js.map +1 -1
  128. package/dist/elements/Toast/index.mjs +724 -5
  129. package/dist/elements/Toast/index.mjs.map +1 -1
  130. package/dist/elements/Tooltip/index.js +315 -49
  131. package/dist/elements/Tooltip/index.js.map +1 -1
  132. package/dist/elements/Tooltip/index.mjs +310 -4
  133. package/dist/elements/Tooltip/index.mjs.map +1 -1
  134. package/dist/elements/index.js +12417 -799
  135. package/dist/elements/index.js.map +1 -1
  136. package/dist/elements/index.mjs +12233 -40
  137. package/dist/elements/index.mjs.map +1 -1
  138. package/dist/index.js +12452 -825
  139. package/dist/index.js.map +1 -1
  140. package/dist/index.mjs +12262 -42
  141. package/dist/index.mjs.map +1 -1
  142. package/dist/schemas/index.js +47 -21
  143. package/dist/schemas/index.js.map +1 -1
  144. package/dist/schemas/index.mjs +47 -2
  145. package/dist/schemas/index.mjs.map +1 -1
  146. package/dist/styles/index.js +161 -147
  147. package/dist/styles/index.js.map +1 -1
  148. package/dist/styles/index.mjs +128 -2
  149. package/dist/styles/index.mjs.map +1 -1
  150. package/dist/utils/index.js +7 -7
  151. package/dist/utils/index.js.map +1 -1
  152. package/dist/utils/index.mjs +9 -2
  153. package/dist/utils/index.mjs.map +1 -1
  154. package/package.json +1 -1
  155. package/dist/Carousel-NTZX5TOW.js +0 -16
  156. package/dist/Carousel-NTZX5TOW.js.map +0 -1
  157. package/dist/Carousel-YH3DOQJU.mjs +0 -7
  158. package/dist/Carousel-YH3DOQJU.mjs.map +0 -1
  159. package/dist/chunk-2HIUTHMU.mjs +0 -234
  160. package/dist/chunk-2HIUTHMU.mjs.map +0 -1
  161. package/dist/chunk-34GTFTDO.js +0 -431
  162. package/dist/chunk-34GTFTDO.js.map +0 -1
  163. package/dist/chunk-3H7ASYR7.js +0 -250
  164. package/dist/chunk-3H7ASYR7.js.map +0 -1
  165. package/dist/chunk-3IEN7JOP.js +0 -316
  166. package/dist/chunk-3IEN7JOP.js.map +0 -1
  167. package/dist/chunk-3JHN4GAL.js +0 -326
  168. package/dist/chunk-3JHN4GAL.js.map +0 -1
  169. package/dist/chunk-3MJPASQU.js +0 -232
  170. package/dist/chunk-3MJPASQU.js.map +0 -1
  171. package/dist/chunk-3XD2JUL3.js +0 -572
  172. package/dist/chunk-3XD2JUL3.js.map +0 -1
  173. package/dist/chunk-3YOY2VJ6.js +0 -189
  174. package/dist/chunk-3YOY2VJ6.js.map +0 -1
  175. package/dist/chunk-4DU5JSXB.js +0 -408
  176. package/dist/chunk-4DU5JSXB.js.map +0 -1
  177. package/dist/chunk-4E4E2GSS.js +0 -352
  178. package/dist/chunk-4E4E2GSS.js.map +0 -1
  179. package/dist/chunk-4NHAP4AN.mjs +0 -3
  180. package/dist/chunk-4NHAP4AN.mjs.map +0 -1
  181. package/dist/chunk-4S33J5NY.mjs +0 -415
  182. package/dist/chunk-4S33J5NY.mjs.map +0 -1
  183. package/dist/chunk-5SMGRT3G.mjs +0 -354
  184. package/dist/chunk-5SMGRT3G.mjs.map +0 -1
  185. package/dist/chunk-5SVLJN2C.mjs +0 -22
  186. package/dist/chunk-5SVLJN2C.mjs.map +0 -1
  187. package/dist/chunk-66WTU4EB.mjs +0 -299
  188. package/dist/chunk-66WTU4EB.mjs.map +0 -1
  189. package/dist/chunk-6S25NMOT.mjs +0 -335
  190. package/dist/chunk-6S25NMOT.mjs.map +0 -1
  191. package/dist/chunk-6SP7UB3D.js +0 -4
  192. package/dist/chunk-6SP7UB3D.js.map +0 -1
  193. package/dist/chunk-6TYWWQHM.mjs +0 -565
  194. package/dist/chunk-6TYWWQHM.mjs.map +0 -1
  195. package/dist/chunk-A3YUJA6W.mjs +0 -384
  196. package/dist/chunk-A3YUJA6W.mjs.map +0 -1
  197. package/dist/chunk-A6KEDVUR.js +0 -61
  198. package/dist/chunk-A6KEDVUR.js.map +0 -1
  199. package/dist/chunk-A77RUEWL.js +0 -730
  200. package/dist/chunk-A77RUEWL.js.map +0 -1
  201. package/dist/chunk-AA4IKMPE.mjs +0 -3
  202. package/dist/chunk-AA4IKMPE.mjs.map +0 -1
  203. package/dist/chunk-AKIA6GW6.mjs +0 -163
  204. package/dist/chunk-AKIA6GW6.mjs.map +0 -1
  205. package/dist/chunk-AL6P275L.mjs +0 -435
  206. package/dist/chunk-AL6P275L.mjs.map +0 -1
  207. package/dist/chunk-AZ3RJYTB.js +0 -37
  208. package/dist/chunk-AZ3RJYTB.js.map +0 -1
  209. package/dist/chunk-B5Q4UPL6.js +0 -32
  210. package/dist/chunk-B5Q4UPL6.js.map +0 -1
  211. package/dist/chunk-B6DHPMDP.mjs +0 -335
  212. package/dist/chunk-B6DHPMDP.mjs.map +0 -1
  213. package/dist/chunk-BDXKKMBZ.mjs +0 -184
  214. package/dist/chunk-BDXKKMBZ.mjs.map +0 -1
  215. package/dist/chunk-BL6E2DLZ.mjs +0 -52
  216. package/dist/chunk-BL6E2DLZ.mjs.map +0 -1
  217. package/dist/chunk-CGFDS4XS.mjs +0 -121
  218. package/dist/chunk-CGFDS4XS.mjs.map +0 -1
  219. package/dist/chunk-CJIW5TKI.js +0 -139
  220. package/dist/chunk-CJIW5TKI.js.map +0 -1
  221. package/dist/chunk-CKNISJOQ.js +0 -314
  222. package/dist/chunk-CKNISJOQ.js.map +0 -1
  223. package/dist/chunk-D6CBOECS.mjs +0 -1757
  224. package/dist/chunk-D6CBOECS.mjs.map +0 -1
  225. package/dist/chunk-DDWEVC2S.js +0 -166
  226. package/dist/chunk-DDWEVC2S.js.map +0 -1
  227. package/dist/chunk-DZ556D2F.mjs +0 -176
  228. package/dist/chunk-DZ556D2F.mjs.map +0 -1
  229. package/dist/chunk-E2KQFV3O.mjs +0 -10
  230. package/dist/chunk-E2KQFV3O.mjs.map +0 -1
  231. package/dist/chunk-EMMLADSC.js +0 -126
  232. package/dist/chunk-EMMLADSC.js.map +0 -1
  233. package/dist/chunk-EP4WOI5D.mjs +0 -926
  234. package/dist/chunk-EP4WOI5D.mjs.map +0 -1
  235. package/dist/chunk-FJRXLJC2.mjs +0 -160
  236. package/dist/chunk-FJRXLJC2.mjs.map +0 -1
  237. package/dist/chunk-FKQI434R.js +0 -345
  238. package/dist/chunk-FKQI434R.js.map +0 -1
  239. package/dist/chunk-FPKEAJRZ.mjs +0 -100
  240. package/dist/chunk-FPKEAJRZ.mjs.map +0 -1
  241. package/dist/chunk-FWQYB22U.js +0 -183
  242. package/dist/chunk-FWQYB22U.js.map +0 -1
  243. package/dist/chunk-GD5GHTMA.js +0 -189
  244. package/dist/chunk-GD5GHTMA.js.map +0 -1
  245. package/dist/chunk-GE5XTSDZ.js +0 -447
  246. package/dist/chunk-GE5XTSDZ.js.map +0 -1
  247. package/dist/chunk-GVE47ZAX.mjs +0 -32
  248. package/dist/chunk-GVE47ZAX.mjs.map +0 -1
  249. package/dist/chunk-HK46BT5U.mjs +0 -18
  250. package/dist/chunk-HK46BT5U.mjs.map +0 -1
  251. package/dist/chunk-HQVRMR6N.js +0 -365
  252. package/dist/chunk-HQVRMR6N.js.map +0 -1
  253. package/dist/chunk-HSGBJPJO.mjs +0 -398
  254. package/dist/chunk-HSGBJPJO.mjs.map +0 -1
  255. package/dist/chunk-I3AUTOMZ.mjs +0 -125
  256. package/dist/chunk-I3AUTOMZ.mjs.map +0 -1
  257. package/dist/chunk-IEI5LD5C.mjs +0 -1161
  258. package/dist/chunk-IEI5LD5C.mjs.map +0 -1
  259. package/dist/chunk-IIPTC2X7.mjs +0 -118
  260. package/dist/chunk-IIPTC2X7.mjs.map +0 -1
  261. package/dist/chunk-J7TLHF2Q.js +0 -4
  262. package/dist/chunk-J7TLHF2Q.js.map +0 -1
  263. package/dist/chunk-JJOWXFXQ.mjs +0 -765
  264. package/dist/chunk-JJOWXFXQ.mjs.map +0 -1
  265. package/dist/chunk-JPTSS2OA.mjs +0 -3
  266. package/dist/chunk-JPTSS2OA.mjs.map +0 -1
  267. package/dist/chunk-KFXXRLTP.js +0 -396
  268. package/dist/chunk-KFXXRLTP.js.map +0 -1
  269. package/dist/chunk-KPRRBSG6.mjs +0 -272
  270. package/dist/chunk-KPRRBSG6.mjs.map +0 -1
  271. package/dist/chunk-NFSBGRDB.mjs +0 -57
  272. package/dist/chunk-NFSBGRDB.mjs.map +0 -1
  273. package/dist/chunk-NGJVCFTM.js +0 -219
  274. package/dist/chunk-NGJVCFTM.js.map +0 -1
  275. package/dist/chunk-NSQ6MZJ6.mjs +0 -728
  276. package/dist/chunk-NSQ6MZJ6.mjs.map +0 -1
  277. package/dist/chunk-NYQYHT76.mjs +0 -296
  278. package/dist/chunk-NYQYHT76.mjs.map +0 -1
  279. package/dist/chunk-OLJJGI5B.js +0 -1193
  280. package/dist/chunk-OLJJGI5B.js.map +0 -1
  281. package/dist/chunk-Q3572X2J.js +0 -292
  282. package/dist/chunk-Q3572X2J.js.map +0 -1
  283. package/dist/chunk-QH7N7D4I.mjs +0 -210
  284. package/dist/chunk-QH7N7D4I.mjs.map +0 -1
  285. package/dist/chunk-R7XUIV25.js +0 -466
  286. package/dist/chunk-R7XUIV25.js.map +0 -1
  287. package/dist/chunk-RFFO4KPM.js +0 -135
  288. package/dist/chunk-RFFO4KPM.js.map +0 -1
  289. package/dist/chunk-RFX7QKA7.mjs +0 -180
  290. package/dist/chunk-RFX7QKA7.mjs.map +0 -1
  291. package/dist/chunk-SN5LFAP3.js +0 -940
  292. package/dist/chunk-SN5LFAP3.js.map +0 -1
  293. package/dist/chunk-T4COXKQ3.js +0 -24
  294. package/dist/chunk-T4COXKQ3.js.map +0 -1
  295. package/dist/chunk-TS54QM27.js +0 -125
  296. package/dist/chunk-TS54QM27.js.map +0 -1
  297. package/dist/chunk-UE2S4PCX.mjs +0 -220
  298. package/dist/chunk-UE2S4PCX.mjs.map +0 -1
  299. package/dist/chunk-UTW3QX2A.mjs +0 -282
  300. package/dist/chunk-UTW3QX2A.mjs.map +0 -1
  301. package/dist/chunk-V74LGMAE.js +0 -1767
  302. package/dist/chunk-V74LGMAE.js.map +0 -1
  303. package/dist/chunk-VIREG536.js +0 -12
  304. package/dist/chunk-VIREG536.js.map +0 -1
  305. package/dist/chunk-VY7M7346.js +0 -4
  306. package/dist/chunk-VY7M7346.js.map +0 -1
  307. package/dist/chunk-W3TJOO7H.mjs +0 -319
  308. package/dist/chunk-W3TJOO7H.mjs.map +0 -1
  309. package/dist/chunk-WIUOB36M.js +0 -54
  310. package/dist/chunk-WIUOB36M.js.map +0 -1
  311. package/dist/chunk-WJGLM4CY.js +0 -291
  312. package/dist/chunk-WJGLM4CY.js.map +0 -1
  313. package/dist/chunk-WNURH5OO.mjs +0 -453
  314. package/dist/chunk-WNURH5OO.mjs.map +0 -1
  315. package/dist/chunk-X25TNRSD.mjs +0 -364
  316. package/dist/chunk-X25TNRSD.mjs.map +0 -1
  317. package/dist/chunk-Y3GT7ETK.js +0 -108
  318. package/dist/chunk-Y3GT7ETK.js.map +0 -1
  319. package/dist/chunk-Z4FRNOF6.mjs +0 -115
  320. package/dist/chunk-Z4FRNOF6.mjs.map +0 -1
  321. package/dist/chunk-ZMYLD3BN.js +0 -166
  322. package/dist/chunk-ZMYLD3BN.js.map +0 -1
  323. package/dist/chunk-ZP2KV6EX.js +0 -815
  324. package/dist/chunk-ZP2KV6EX.js.map +0 -1
  325. package/dist/chunk-ZVKXFELU.js +0 -366
  326. package/dist/chunk-ZVKXFELU.js.map +0 -1
@@ -1,335 +0,0 @@
1
- import { FOCUS_STYLES, HIGH_CONTRAST_FOCUS } from './chunk-HK46BT5U.mjs';
2
- import { cn } from './chunk-E2KQFV3O.mjs';
3
- import { BaseComponentPropsSchema } from './chunk-5SVLJN2C.mjs';
4
- import { createContext, forwardRef, useId, useContext } from 'react';
5
- import { RadioGroup as RadioGroup$1, Label, Text, FieldError, Radio as Radio$1 } from 'react-aria-components';
6
- import { cva } from 'class-variance-authority';
7
- import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
8
- import { z } from 'zod';
9
-
10
- var RadioGroupContext = createContext({
11
- variant: "default",
12
- size: "default",
13
- isInvalid: false
14
- });
15
- var radioGroupVariants = cva(
16
- // Base: flex container
17
- "flex",
18
- {
19
- variants: {
20
- orientation: {
21
- vertical: "flex-col gap-2",
22
- horizontal: "flex-row flex-wrap gap-2"
23
- }
24
- },
25
- defaultVariants: {
26
- orientation: "vertical"
27
- }
28
- }
29
- );
30
- var radioItemVariants = cva(
31
- // Base: bordered container with flex layout, RTL support
32
- [
33
- "flex items-center gap-3 rounded-md border cursor-pointer",
34
- "transition-colors duration-200",
35
- "rtl:flex-row-reverse",
36
- // RTL: indicator flips to right
37
- // Focus ring on entire container
38
- FOCUS_STYLES,
39
- HIGH_CONTRAST_FOCUS
40
- ].join(" "),
41
- {
42
- variants: {
43
- variant: {
44
- default: [
45
- "border-[var(--border)]",
46
- "data-[hovered]:bg-[var(--accent)]/10",
47
- "data-[selected]:border-[var(--primary)]",
48
- "data-[selected]:bg-[var(--primary)]/10"
49
- ].join(" "),
50
- destructive: [
51
- "border-[var(--border)]",
52
- "data-[hovered]:bg-[var(--destructive)]/10",
53
- "data-[selected]:border-[var(--destructive)]",
54
- "data-[selected]:bg-[var(--destructive)]/10"
55
- ].join(" ")
56
- },
57
- size: {
58
- sm: "min-h-[44px] py-2 px-3 text-sm",
59
- default: "min-h-[48px] py-3 px-4 text-sm",
60
- lg: "min-h-[56px] py-4 px-5 text-base"
61
- },
62
- isDisabled: {
63
- true: "opacity-50 cursor-not-allowed",
64
- false: ""
65
- },
66
- isInvalid: {
67
- // Error: ALL items get destructive border (cognitive accessibility)
68
- true: "border-[var(--destructive)]",
69
- false: ""
70
- }
71
- },
72
- defaultVariants: {
73
- variant: "default",
74
- size: "default",
75
- isDisabled: false,
76
- isInvalid: false
77
- }
78
- }
79
- );
80
- var radioIndicatorVariants = cva(
81
- // Base: circle with border, flex-shrink-0 to prevent squishing
82
- "flex-shrink-0 rounded-full border-2 flex items-center justify-center transition-colors duration-200",
83
- {
84
- variants: {
85
- variant: {
86
- default: [
87
- "border-[var(--border)]",
88
- "data-[selected]:border-[var(--primary)]"
89
- ].join(" "),
90
- destructive: [
91
- "border-[var(--border)]",
92
- "data-[selected]:border-[var(--destructive)]"
93
- ].join(" ")
94
- },
95
- size: {
96
- sm: "h-4 w-4",
97
- default: "h-5 w-5",
98
- lg: "h-6 w-6"
99
- }
100
- },
101
- defaultVariants: {
102
- variant: "default",
103
- size: "default"
104
- }
105
- }
106
- );
107
- var radioInnerDotVariants = cva(
108
- // Base: centered dot with spring animation
109
- [
110
- "rounded-full transition-transform duration-200",
111
- // Spring animation with overshoot
112
- "[transition-timing-function:cubic-bezier(0.34,1.56,0.64,1)]",
113
- // Respect reduced motion preference
114
- "motion-reduce:transition-none",
115
- // Scale from 0 to 1 on selection
116
- "scale-0 data-[selected]:scale-100"
117
- ].join(" "),
118
- {
119
- variants: {
120
- variant: {
121
- default: "bg-[var(--primary)]",
122
- destructive: "bg-[var(--destructive)]"
123
- },
124
- size: {
125
- sm: "h-2 w-2",
126
- default: "h-2.5 w-2.5",
127
- lg: "h-3 w-3"
128
- }
129
- },
130
- defaultVariants: {
131
- variant: "default",
132
- size: "default"
133
- }
134
- }
135
- );
136
- function RadioLabel({ children, className }) {
137
- return /* @__PURE__ */ jsx("span", { className: cn("font-medium text-[var(--content-foreground)]", className), children });
138
- }
139
- RadioLabel.displayName = "Radio.Label";
140
- function RadioDescription({ children, className }) {
141
- return /* @__PURE__ */ jsx("span", { className: cn("text-sm text-[var(--menu-muted)]", className), children });
142
- }
143
- RadioDescription.displayName = "Radio.Description";
144
- function RadioComponent({ value, isDisabled, children, className }) {
145
- const { variant, size, isInvalid } = useContext(RadioGroupContext);
146
- return /* @__PURE__ */ jsx(
147
- Radio$1,
148
- {
149
- value,
150
- isDisabled,
151
- className: (renderProps) => cn(
152
- radioItemVariants({
153
- variant,
154
- size,
155
- isDisabled: renderProps.isDisabled,
156
- isInvalid
157
- }),
158
- className
159
- ),
160
- children: (renderProps) => /* @__PURE__ */ jsxs(Fragment, { children: [
161
- /* @__PURE__ */ jsx(
162
- "div",
163
- {
164
- className: radioIndicatorVariants({ variant, size }),
165
- "data-selected": renderProps.isSelected || void 0,
166
- children: /* @__PURE__ */ jsx(
167
- "div",
168
- {
169
- className: radioInnerDotVariants({ variant, size }),
170
- "data-selected": renderProps.isSelected || void 0
171
- }
172
- )
173
- }
174
- ),
175
- /* @__PURE__ */ jsx("div", { className: "flex-1 flex flex-col", children })
176
- ] })
177
- }
178
- );
179
- }
180
- var Radio = Object.assign(RadioComponent, {
181
- Label: RadioLabel,
182
- Description: RadioDescription
183
- });
184
- Radio.displayName = "Radio";
185
- var RadioGroup = forwardRef(
186
- function RadioGroup2(props, ref) {
187
- const {
188
- // Display props
189
- label,
190
- description,
191
- errorMessage,
192
- // Selection props
193
- value,
194
- defaultValue,
195
- // State props
196
- isDisabled = false,
197
- isReadOnly = false,
198
- isRequired = false,
199
- isInvalid = false,
200
- // Layout props
201
- orientation = "vertical",
202
- // Variant props
203
- variant = "default",
204
- size = "default",
205
- // Form props
206
- name,
207
- // Event handlers
208
- onChange,
209
- onFocusChange,
210
- // Standard props
211
- className,
212
- children,
213
- id,
214
- "aria-label": ariaLabel,
215
- "aria-labelledby": ariaLabelledby,
216
- "aria-describedby": ariaDescribedby,
217
- "data-testid": dataTestId,
218
- ...restProps
219
- } = props;
220
- const generatedId = useId();
221
- const radioGroupId = id ?? generatedId;
222
- const labelId = `${radioGroupId}-label`;
223
- const descriptionId = `${radioGroupId}-description`;
224
- const errorId = `${radioGroupId}-error`;
225
- const describedByParts = [];
226
- if (ariaDescribedby) describedByParts.push(ariaDescribedby);
227
- if (description) describedByParts.push(descriptionId);
228
- if (isInvalid && errorMessage) describedByParts.push(errorId);
229
- const computedAriaDescribedBy = describedByParts.length > 0 ? describedByParts.join(" ") : void 0;
230
- return /* @__PURE__ */ jsx(RadioGroupContext.Provider, { value: { variant, size, isInvalid }, children: /* @__PURE__ */ jsxs(
231
- RadioGroup$1,
232
- {
233
- ref,
234
- id: radioGroupId,
235
- name,
236
- value: value ?? void 0,
237
- defaultValue: defaultValue ?? void 0,
238
- isDisabled,
239
- isReadOnly,
240
- isRequired,
241
- isInvalid,
242
- orientation,
243
- onChange,
244
- onFocusChange,
245
- "aria-label": ariaLabel,
246
- "aria-labelledby": label ? labelId : ariaLabelledby,
247
- "aria-describedby": computedAriaDescribedBy,
248
- "data-testid": dataTestId,
249
- "data-orientation": orientation,
250
- className: cn("flex flex-col gap-1.5", className),
251
- ...restProps,
252
- children: [
253
- label && /* @__PURE__ */ jsxs(Label, { id: labelId, className: "text-sm font-medium text-[var(--content-foreground)]", children: [
254
- label,
255
- isRequired && /* @__PURE__ */ jsx("span", { className: "ml-1 text-[var(--destructive)]", "aria-hidden": "true", children: "*" })
256
- ] }),
257
- description && /* @__PURE__ */ jsx(
258
- Text,
259
- {
260
- id: descriptionId,
261
- slot: "description",
262
- className: "text-sm text-[var(--menu-muted)]",
263
- children: description
264
- }
265
- ),
266
- /* @__PURE__ */ jsx("div", { className: radioGroupVariants({ orientation }), children }),
267
- isInvalid && errorMessage && /* @__PURE__ */ jsx(
268
- FieldError,
269
- {
270
- id: errorId,
271
- className: "text-sm text-[var(--destructive)]",
272
- children: /* @__PURE__ */ jsx("span", { role: "alert", children: errorMessage })
273
- }
274
- )
275
- ]
276
- }
277
- ) });
278
- }
279
- );
280
- RadioGroup.displayName = "RadioGroup";
281
- var RadioGroupVariantSchema = z.enum(["default", "destructive"]);
282
- var RadioGroupSizeSchema = z.enum(["sm", "default", "lg"]);
283
- var RadioGroupOrientationSchema = z.enum(["vertical", "horizontal"]);
284
- var RadioGroupPropsSchema = BaseComponentPropsSchema.extend({
285
- // Display props (US-4)
286
- label: z.string().optional(),
287
- description: z.string().optional(),
288
- errorMessage: z.string().optional(),
289
- // Selection props (US-1) - nullable for no initial selection
290
- value: z.string().nullable().optional(),
291
- defaultValue: z.string().nullable().optional(),
292
- // State props (US-6)
293
- isDisabled: z.boolean().optional().default(false),
294
- isReadOnly: z.boolean().optional().default(false),
295
- isRequired: z.boolean().optional().default(false),
296
- isInvalid: z.boolean().optional().default(false),
297
- // Layout props (US-5)
298
- orientation: RadioGroupOrientationSchema.optional().default("vertical"),
299
- // Variant props (US-2, US-3) - 2 variants only
300
- variant: RadioGroupVariantSchema.optional().default("default"),
301
- size: RadioGroupSizeSchema.optional().default("default"),
302
- // Form props (US-6)
303
- name: z.string().optional(),
304
- // Event handlers
305
- onChange: z.custom().optional(),
306
- onFocusChange: z.custom().optional(),
307
- // Children (Radio components)
308
- children: z.custom()
309
- });
310
- var RadioPropsSchema = BaseComponentPropsSchema.extend({
311
- // Item value (required)
312
- value: z.string(),
313
- // Disabled state (individual item)
314
- isDisabled: z.boolean().optional().default(false),
315
- // Item content - accepts any ReactNode for flexible children
316
- children: z.custom(),
317
- // Optional className for custom styling
318
- className: z.string().optional()
319
- });
320
- var RadioLabelPropsSchema = z.object({
321
- // Label content
322
- children: z.custom(),
323
- // Optional className for custom styling
324
- className: z.string().optional()
325
- });
326
- var RadioDescriptionPropsSchema = z.object({
327
- // Description content
328
- children: z.custom(),
329
- // Optional className for custom styling
330
- className: z.string().optional()
331
- });
332
-
333
- export { Radio, RadioDescriptionPropsSchema, RadioGroup, RadioGroupOrientationSchema, RadioGroupPropsSchema, RadioGroupSizeSchema, RadioGroupVariantSchema, RadioLabelPropsSchema, RadioPropsSchema };
334
- //# sourceMappingURL=chunk-B6DHPMDP.mjs.map
335
- //# sourceMappingURL=chunk-B6DHPMDP.mjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/elements/RadioGroup/RadioGroup.tsx","../src/elements/RadioGroup/RadioGroup.types.ts"],"names":["AriaRadio","RadioGroup","AriaRadioGroup"],"mappings":"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","file":"chunk-B6DHPMDP.mjs","sourcesContent":["\"use client\";\n\n/**\n * RadioGroup Component\n * Accessible single-selection radio group with React Aria primitives and CVA styling\n *\n * Key Features:\n * - Bordered container design with explicit 44px+ touch targets\n * - 2 variants: default, destructive (no outline per clarification)\n * - 3 sizes: sm (44px), default (48px), lg (56px)\n * - Arrow keys move focus AND select (WAI-ARIA standard selection-follows-focus)\n * - Error styling on ALL items (cognitive accessibility)\n * - Spring animation for selection indicator\n * - RTL support (indicator auto-flips)\n * - Radio.Label and Radio.Description sub-components\n *\n * @see radiogroup-prd.md (Product Requirements)\n * @see plan.md (11 Key Clarifications)\n * @see React Aria RadioGroup: https://react-spectrum.adobe.com/react-aria/RadioGroup.html\n * @see constitution.md Principle IV (Accessibility First - WCAG 2.2 AAA)\n */\n\nimport {\n forwardRef,\n createContext,\n useContext,\n useId,\n type ReactNode,\n type ForwardedRef,\n} from 'react';\nimport {\n RadioGroup as AriaRadioGroup,\n Radio as AriaRadio,\n Label,\n Text,\n FieldError,\n} from 'react-aria-components';\nimport { cva } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { FOCUS_STYLES, HIGH_CONTRAST_FOCUS } from '../../styles/interaction-states';\nimport type {\n RadioGroupProps,\n RadioProps,\n RadioLabelProps,\n RadioDescriptionProps,\n RadioGroupVariant,\n RadioGroupSize,\n} from './RadioGroup.types';\n\n// ============================================================================\n// Context\n// ============================================================================\n\ninterface RadioGroupContextValue {\n variant: RadioGroupVariant;\n size: RadioGroupSize;\n isInvalid: boolean;\n}\n\nconst RadioGroupContext = createContext<RadioGroupContextValue>({\n variant: 'default',\n size: 'default',\n isInvalid: false,\n});\n\n// ============================================================================\n// CVA Variants\n// ============================================================================\n\n/**\n * RadioGroup container variants\n * Controls orientation and spacing (gap-2 = 8px per clarification)\n */\nconst radioGroupVariants = cva(\n // Base: flex container\n \"flex\",\n {\n variants: {\n orientation: {\n vertical: \"flex-col gap-2\",\n horizontal: \"flex-row flex-wrap gap-2\",\n },\n },\n defaultVariants: {\n orientation: \"vertical\",\n },\n }\n);\n\n/**\n * Radio item bordered container variants\n * Bordered container design with explicit touch targets\n * All sizes maintain 44px minimum height (WCAG 2.2 AAA)\n * All sizes use rounded-md (6px) per clarification\n */\nconst radioItemVariants = cva(\n // Base: bordered container with flex layout, RTL support\n [\n \"flex items-center gap-3 rounded-md border cursor-pointer\",\n \"transition-colors duration-200\",\n \"rtl:flex-row-reverse\", // RTL: indicator flips to right\n // Focus ring on entire container\n FOCUS_STYLES,\n HIGH_CONTRAST_FOCUS,\n ].join(\" \"),\n {\n variants: {\n variant: {\n default: [\n \"border-[var(--border)]\",\n \"data-[hovered]:bg-[var(--accent)]/10\",\n \"data-[selected]:border-[var(--primary)]\",\n \"data-[selected]:bg-[var(--primary)]/10\",\n ].join(\" \"),\n destructive: [\n \"border-[var(--border)]\",\n \"data-[hovered]:bg-[var(--destructive)]/10\",\n \"data-[selected]:border-[var(--destructive)]\",\n \"data-[selected]:bg-[var(--destructive)]/10\",\n ].join(\" \"),\n },\n size: {\n sm: \"min-h-[44px] py-2 px-3 text-sm\",\n default: \"min-h-[48px] py-3 px-4 text-sm\",\n lg: \"min-h-[56px] py-4 px-5 text-base\",\n },\n isDisabled: {\n true: \"opacity-50 cursor-not-allowed\",\n false: \"\",\n },\n isInvalid: {\n // Error: ALL items get destructive border (cognitive accessibility)\n true: \"border-[var(--destructive)]\",\n false: \"\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n isDisabled: false,\n isInvalid: false,\n },\n }\n);\n\n/**\n * Circle indicator (outer ring) variants\n */\nconst radioIndicatorVariants = cva(\n // Base: circle with border, flex-shrink-0 to prevent squishing\n \"flex-shrink-0 rounded-full border-2 flex items-center justify-center transition-colors duration-200\",\n {\n variants: {\n variant: {\n default: [\n \"border-[var(--border)]\",\n \"data-[selected]:border-[var(--primary)]\",\n ].join(\" \"),\n destructive: [\n \"border-[var(--border)]\",\n \"data-[selected]:border-[var(--destructive)]\",\n ].join(\" \"),\n },\n size: {\n sm: \"h-4 w-4\",\n default: \"h-5 w-5\",\n lg: \"h-6 w-6\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n }\n);\n\n/**\n * Inner dot variants (appears when selected)\n * Spring animation: cubic-bezier(0.34, 1.56, 0.64, 1) with slight overshoot\n */\nconst radioInnerDotVariants = cva(\n // Base: centered dot with spring animation\n [\n \"rounded-full transition-transform duration-200\",\n // Spring animation with overshoot\n \"[transition-timing-function:cubic-bezier(0.34,1.56,0.64,1)]\",\n // Respect reduced motion preference\n \"motion-reduce:transition-none\",\n // Scale from 0 to 1 on selection\n \"scale-0 data-[selected]:scale-100\",\n ].join(\" \"),\n {\n variants: {\n variant: {\n default: \"bg-[var(--primary)]\",\n destructive: \"bg-[var(--destructive)]\",\n },\n size: {\n sm: \"h-2 w-2\",\n default: \"h-2.5 w-2.5\",\n lg: \"h-3 w-3\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n }\n);\n\n// ============================================================================\n// Sub-components\n// ============================================================================\n\n/**\n * Radio.Label - Styled label for radio item content\n */\nfunction RadioLabel({ children, className }: RadioLabelProps): ReactNode {\n return (\n <span className={cn(\"font-medium text-[var(--content-foreground)]\", className)}>\n {children}\n </span>\n );\n}\n\nRadioLabel.displayName = \"Radio.Label\";\n\n/**\n * Radio.Description - Styled description for radio item content (muted)\n */\nfunction RadioDescription({ children, className }: RadioDescriptionProps): ReactNode {\n return (\n <span className={cn(\"text-sm text-[var(--menu-muted)]\", className)}>\n {children}\n </span>\n );\n}\n\nRadioDescription.displayName = \"Radio.Description\";\n\n// ============================================================================\n// Radio Component\n// ============================================================================\n\n/**\n * Radio item component with bordered container design\n */\nfunction RadioComponent({ value, isDisabled, children, className }: RadioProps): ReactNode {\n const { variant, size, isInvalid } = useContext(RadioGroupContext);\n\n return (\n <AriaRadio\n value={value}\n isDisabled={isDisabled}\n className={(renderProps) =>\n cn(\n radioItemVariants({\n variant,\n size,\n isDisabled: renderProps.isDisabled,\n isInvalid,\n }),\n className\n )\n }\n >\n {(renderProps) => (\n <>\n {/* Circle indicator */}\n <div\n className={radioIndicatorVariants({ variant, size })}\n data-selected={renderProps.isSelected || undefined}\n >\n {/* Inner dot with spring animation */}\n <div\n className={radioInnerDotVariants({ variant, size })}\n data-selected={renderProps.isSelected || undefined}\n />\n </div>\n\n {/* Children content (flexible - text, icons, complex layouts) */}\n <div className=\"flex-1 flex flex-col\">\n {children}\n </div>\n </>\n )}\n </AriaRadio>\n );\n}\n\n// Attach sub-components\nconst Radio = Object.assign(RadioComponent, {\n Label: RadioLabel,\n Description: RadioDescription,\n}) as typeof RadioComponent & {\n Label: typeof RadioLabel;\n Description: typeof RadioDescription;\n displayName: string;\n};\n\nRadio.displayName = \"Radio\";\n\n// ============================================================================\n// RadioGroup Component\n// ============================================================================\n\n/**\n * RadioGroup root component\n * Accessible single-selection control with bordered container design\n */\nconst RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\n function RadioGroup(props: RadioGroupProps, ref: ForwardedRef<HTMLDivElement>) {\n const {\n // Display props\n label,\n description,\n errorMessage,\n // Selection props\n value,\n defaultValue,\n // State props\n isDisabled = false,\n isReadOnly = false,\n isRequired = false,\n isInvalid = false,\n // Layout props\n orientation = 'vertical',\n // Variant props\n variant = 'default',\n size = 'default',\n // Form props\n name,\n // Event handlers\n onChange,\n onFocusChange,\n // Standard props\n className,\n children,\n id,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescribedby,\n 'data-testid': dataTestId,\n ...restProps\n } = props;\n\n // Generate unique IDs for accessibility\n const generatedId = useId();\n const radioGroupId = id ?? generatedId;\n const labelId = `${radioGroupId}-label`;\n const descriptionId = `${radioGroupId}-description`;\n const errorId = `${radioGroupId}-error`;\n\n // Build aria-describedby from description and error\n const describedByParts: string[] = [];\n if (ariaDescribedby) describedByParts.push(ariaDescribedby);\n if (description) describedByParts.push(descriptionId);\n if (isInvalid && errorMessage) describedByParts.push(errorId);\n const computedAriaDescribedBy = describedByParts.length > 0\n ? describedByParts.join(' ')\n : undefined;\n\n return (\n <RadioGroupContext.Provider value={{ variant, size, isInvalid }}>\n <AriaRadioGroup\n ref={ref}\n id={radioGroupId}\n name={name}\n value={value ?? undefined}\n defaultValue={defaultValue ?? undefined}\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n isRequired={isRequired}\n isInvalid={isInvalid}\n orientation={orientation}\n onChange={onChange}\n onFocusChange={onFocusChange}\n aria-label={ariaLabel}\n aria-labelledby={label ? labelId : ariaLabelledby}\n aria-describedby={computedAriaDescribedBy}\n data-testid={dataTestId}\n data-orientation={orientation}\n className={cn(\"flex flex-col gap-1.5\", className)}\n {...restProps}\n >\n {/* Label with optional required asterisk */}\n {label && (\n <Label id={labelId} className=\"text-sm font-medium text-[var(--content-foreground)]\">\n {label}\n {isRequired && (\n <span className=\"ml-1 text-[var(--destructive)]\" aria-hidden=\"true\">\n *\n </span>\n )}\n </Label>\n )}\n\n {/* Description */}\n {description && (\n <Text\n id={descriptionId}\n slot=\"description\"\n className=\"text-sm text-[var(--menu-muted)]\"\n >\n {description}\n </Text>\n )}\n\n {/* Radio items container with orientation */}\n <div className={radioGroupVariants({ orientation })}>\n {children}\n </div>\n\n {/* Error message with role=\"alert\" for screen reader announcements */}\n {isInvalid && errorMessage && (\n <FieldError\n id={errorId}\n className=\"text-sm text-[var(--destructive)]\"\n >\n <span role=\"alert\">{errorMessage}</span>\n </FieldError>\n )}\n </AriaRadioGroup>\n </RadioGroupContext.Provider>\n );\n }\n);\n\nRadioGroup.displayName = \"RadioGroup\";\n\n// ============================================================================\n// Exports\n// ============================================================================\n\nexport {\n RadioGroup,\n Radio,\n radioGroupVariants,\n radioItemVariants,\n radioIndicatorVariants,\n radioInnerDotVariants,\n};\n","import { z } from 'zod';\nimport { BaseComponentPropsSchema } from '../../schemas/BaseComponentProps';\nimport type { ReactNode } from 'react';\nimport type {\n RadioGroupProps as AriaRadioGroupProps,\n RadioProps as AriaRadioProps,\n} from 'react-aria-components';\n\n/**\n * RadioGroup variant schema\n * Only 2 variants: default and destructive (no outline per clarification)\n *\n * @see radiogroup-prd.md US-2 (Style Variants)\n * @see plan.md Decision 9 (2 variants only)\n */\nexport const RadioGroupVariantSchema = z.enum(['default', 'destructive']);\nexport type RadioGroupVariant = z.infer<typeof RadioGroupVariantSchema>;\n\n/**\n * RadioGroup size schema\n * All sizes maintain 44px minimum height for WCAG 2.2 AAA compliance\n *\n * @see radiogroup-prd.md US-3 (Size Variants)\n * @see constitution.md Principle IV (Accessibility First)\n */\nexport const RadioGroupSizeSchema = z.enum(['sm', 'default', 'lg']);\nexport type RadioGroupSize = z.infer<typeof RadioGroupSizeSchema>;\n\n/**\n * RadioGroup orientation schema\n *\n * @see radiogroup-prd.md US-5 (Orientation Support)\n */\nexport const RadioGroupOrientationSchema = z.enum(['vertical', 'horizontal']);\nexport type RadioGroupOrientation = z.infer<typeof RadioGroupOrientationSchema>;\n\n/**\n * RadioGroup root component props schema\n *\n * @see radiogroup-prd.md US-1 (Basic Single Selection)\n * @see radiogroup-prd.md US-4 (Labels, Descriptions, Errors)\n * @see radiogroup-prd.md US-6 (Validation States)\n * @see plan.md (All design decisions from clarification session)\n */\nexport const RadioGroupPropsSchema = BaseComponentPropsSchema.extend({\n // Display props (US-4)\n label: z.string().optional(),\n description: z.string().optional(),\n errorMessage: z.string().optional(),\n\n // Selection props (US-1) - nullable for no initial selection\n value: z.string().nullable().optional(),\n defaultValue: z.string().nullable().optional(),\n\n // State props (US-6)\n isDisabled: z.boolean().optional().default(false),\n isReadOnly: z.boolean().optional().default(false),\n isRequired: z.boolean().optional().default(false),\n isInvalid: z.boolean().optional().default(false),\n\n // Layout props (US-5)\n orientation: RadioGroupOrientationSchema.optional().default('vertical'),\n\n // Variant props (US-2, US-3) - 2 variants only\n variant: RadioGroupVariantSchema.optional().default('default'),\n size: RadioGroupSizeSchema.optional().default('default'),\n\n // Form props (US-6)\n name: z.string().optional(),\n\n // Event handlers\n onChange: z.custom<(value: string) => void>().optional(),\n onFocusChange: z.custom<(isFocused: boolean) => void>().optional(),\n\n // Children (Radio components)\n children: z.custom<ReactNode>(),\n});\n\nexport type RadioGroupProps = z.infer<typeof RadioGroupPropsSchema> &\n Omit<AriaRadioGroupProps, keyof z.infer<typeof RadioGroupPropsSchema>>;\n\n/**\n * Radio item component props schema\n *\n * @see radiogroup-prd.md US-1 (Basic Single Selection)\n * @see radiogroup-prd.md US-7 (Rich Content Support)\n */\nexport const RadioPropsSchema = BaseComponentPropsSchema.extend({\n // Item value (required)\n value: z.string(),\n\n // Disabled state (individual item)\n isDisabled: z.boolean().optional().default(false),\n\n // Item content - accepts any ReactNode for flexible children\n children: z.custom<ReactNode>(),\n\n // Optional className for custom styling\n className: z.string().optional(),\n});\n\nexport type RadioProps = z.infer<typeof RadioPropsSchema> &\n Omit<AriaRadioProps, keyof z.infer<typeof RadioPropsSchema>>;\n\n/**\n * Radio.Label sub-component props schema\n * Helper component for styled label within Radio item\n *\n * @see radiogroup-prd.md US-7 (Rich Content Support)\n * @see plan.md Decision 1 (Sub-components)\n */\nexport const RadioLabelPropsSchema = z.object({\n // Label content\n children: z.custom<ReactNode>(),\n\n // Optional className for custom styling\n className: z.string().optional(),\n});\n\nexport type RadioLabelProps = z.infer<typeof RadioLabelPropsSchema>;\n\n/**\n * Radio.Description sub-component props schema\n * Helper component for styled description within Radio item (muted text)\n *\n * @see radiogroup-prd.md US-7 (Rich Content Support)\n * @see plan.md Decision 1 (Sub-components)\n */\nexport const RadioDescriptionPropsSchema = z.object({\n // Description content\n children: z.custom<ReactNode>(),\n\n // Optional className for custom styling\n className: z.string().optional(),\n});\n\nexport type RadioDescriptionProps = z.infer<typeof RadioDescriptionPropsSchema>;\n\n/**\n * CVA variant configuration types\n * Used for class-variance-authority integration\n */\nexport type RadioGroupVariantType = RadioGroupVariant;\nexport type RadioGroupSizeType = RadioGroupSize;\nexport type RadioGroupOrientationType = RadioGroupOrientation;\n"]}
@@ -1,184 +0,0 @@
1
- import { useButtonGroupContext, useButtonGroupItemContext, buttonGroupItemVariants } from './chunk-FPKEAJRZ.mjs';
2
- import { PRESSED_STYLES, HOVER_STYLES, HIGH_CONTRAST_HOVER, HIGH_CONTRAST_PRESSED } from './chunk-HK46BT5U.mjs';
3
- import { cn } from './chunk-E2KQFV3O.mjs';
4
- import { memo, forwardRef, useId } from 'react';
5
- import { Button as Button$1 } from 'react-aria-components';
6
- import { cva } from 'class-variance-authority';
7
- import { Loader2, Zap } from 'lucide-react';
8
- import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
9
-
10
- var buttonOuterVariants = cva(
11
- "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",
12
- {
13
- variants: {
14
- fullWidth: {
15
- true: "w-full",
16
- false: ""
17
- },
18
- inVerticalGroup: {
19
- true: "items-stretch",
20
- false: "items-center"
21
- }
22
- },
23
- defaultVariants: {
24
- fullWidth: false,
25
- inVerticalGroup: false
26
- }
27
- }
28
- );
29
- var buttonVisualVariants = cva(
30
- "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",
31
- {
32
- variants: {
33
- variant: {
34
- 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",
35
- destructive: "bg-[var(--destructive-background)] text-[var(--destructive-foreground)] shadow-md hover:bg-[var(--destructive-background)]/90 data-[pressed]:bg-[var(--destructive-background)]/80",
36
- outline: "border border-[var(--input-border)] bg-[var(--page-background)] hover:bg-[var(--input-border)] data-[pressed]:bg-[var(--input-border)]",
37
- secondary: "bg-[var(--secondary)] text-[var(--secondary-foreground)] shadow-md hover:bg-[var(--secondary)]/80 data-[pressed]:bg-[var(--secondary)]/70",
38
- ghost: "hover:bg-[var(--accent)] hover:text-[var(--accent-foreground)] data-[pressed]:bg-[var(--accent)]",
39
- link: "text-[var(--text-link)] underline-offset-4 hover:underline data-[pressed]:text-[var(--text-link-hover)]"
40
- },
41
- fullWidth: {
42
- true: "w-full",
43
- false: ""
44
- },
45
- visualSize: {
46
- default: "h-10 px-4 py-2",
47
- sm: "h-9 rounded-md px-3 text-xs",
48
- lg: "h-11 rounded-md px-8",
49
- icon: "h-10 w-10",
50
- dot: "h-5 w-5 rounded-full p-0 min-h-0 min-w-0"
51
- },
52
- paywall: {
53
- true: "!bg-[var(--paywall)] !text-[var(--paywall-foreground)] !shadow-md hover:!bg-[var(--paywall)]/90 !cursor-not-allowed !border-transparent",
54
- false: ""
55
- }
56
- },
57
- defaultVariants: {
58
- variant: "default",
59
- visualSize: "default",
60
- paywall: false
61
- }
62
- }
63
- );
64
- var buttonVariants = buttonVisualVariants;
65
- var Button = memo(forwardRef(
66
- ({
67
- className,
68
- buttonVisualClassName,
69
- variant,
70
- size,
71
- visualSize,
72
- fullWidth,
73
- loading = false,
74
- loadingText = "Loading...",
75
- shortcut,
76
- children,
77
- isDisabled,
78
- paywall = false,
79
- paywallRedirect,
80
- paywallDescription,
81
- onPress,
82
- ...props
83
- }, ref) => {
84
- const paywallDescriptionId = useId();
85
- const groupContext = useButtonGroupContext();
86
- const itemContext = useButtonGroupItemContext();
87
- const effectiveVariant = variant ?? groupContext?.variant ?? "default";
88
- const effectiveSize = size ?? groupContext?.size;
89
- const effectiveIsDisabled = isDisabled ?? groupContext?.isDisabled ?? false;
90
- const isInVerticalGroup = groupContext?.orientation === "vertical";
91
- const effectiveFullWidth = fullWidth || isInVerticalGroup;
92
- const positionClassName = itemContext ? buttonGroupItemVariants({
93
- orientation: groupContext?.orientation ?? "horizontal",
94
- position: itemContext.position
95
- }) : "";
96
- const effectiveVisualSize = visualSize ?? effectiveSize ?? "default";
97
- if (process.env.NODE_ENV !== "production") {
98
- if ((effectiveVisualSize === "dot" || effectiveVisualSize === "icon") && !props["aria-label"] && !children) {
99
- console.warn(
100
- '[Button] visualSize="dot" or "icon" requires aria-label when no visible text is provided (WCAG 1.1.1)'
101
- );
102
- }
103
- }
104
- const handlePress = (e) => {
105
- if (paywall) {
106
- if (paywallRedirect) {
107
- window.open(paywallRedirect, "_blank", "noopener,noreferrer");
108
- }
109
- return;
110
- }
111
- onPress?.(e);
112
- };
113
- const computedIsDisabled = effectiveIsDisabled || loading || void 0;
114
- return /* @__PURE__ */ jsx(
115
- Button$1,
116
- {
117
- ref,
118
- isDisabled: computedIsDisabled,
119
- "aria-disabled": paywall ? true : void 0,
120
- "aria-describedby": paywall ? paywallDescriptionId : void 0,
121
- onPress: handlePress,
122
- className: cn(buttonOuterVariants({ fullWidth: effectiveFullWidth, inVerticalGroup: isInVerticalGroup }), className),
123
- ...props,
124
- children: (renderProps) => (
125
- /* Layer 2: Visual Button */
126
- /* @__PURE__ */ jsxs(
127
- "span",
128
- {
129
- className: cn(
130
- buttonVisualVariants({
131
- variant: effectiveVariant,
132
- visualSize: effectiveVisualSize,
133
- paywall,
134
- fullWidth: effectiveFullWidth
135
- }),
136
- // Position styling from ButtonGroup context (border-radius adjustments)
137
- positionClassName,
138
- buttonVisualClassName,
139
- // Layer 2 interaction styles (no focus - focus ring is on Layer 1)
140
- PRESSED_STYLES,
141
- HOVER_STYLES,
142
- HIGH_CONTRAST_HOVER,
143
- HIGH_CONTRAST_PRESSED
144
- ),
145
- "data-pressed": renderProps.isPressed || void 0,
146
- children: [
147
- loading && /* @__PURE__ */ jsxs(Fragment, { children: [
148
- /* @__PURE__ */ jsx(Loader2, { className: "motion-safe:animate-spin", "aria-hidden": "true" }),
149
- /* @__PURE__ */ jsx("span", { className: "sr-only", "aria-live": "polite", children: loadingText })
150
- ] }),
151
- !loading && children,
152
- paywall && /* @__PURE__ */ jsx(
153
- Zap,
154
- {
155
- "data-testid": "zap-icon",
156
- "aria-hidden": "true",
157
- className: "ml-1"
158
- }
159
- ),
160
- paywall && /* @__PURE__ */ jsxs("span", { id: paywallDescriptionId, className: "sr-only", children: [
161
- "Premium feature: ",
162
- paywallDescription || "Upgrade required to access this feature"
163
- ] }),
164
- renderProps.isFocusVisible && shortcut && /* @__PURE__ */ jsx("kbd", { className: "ml-auto hidden text-xs opacity-60 lg:inline", children: shortcut }),
165
- renderProps.isPressed && /* @__PURE__ */ jsx(
166
- "span",
167
- {
168
- className: "absolute inset-0 rounded-[inherit] bg-current opacity-10 motion-safe:animate-in motion-safe:zoom-in-95",
169
- "aria-hidden": "true"
170
- }
171
- )
172
- ]
173
- }
174
- )
175
- )
176
- }
177
- );
178
- }
179
- ));
180
- Button.displayName = "Button";
181
-
182
- export { Button, buttonOuterVariants, buttonVariants, buttonVisualVariants };
183
- //# sourceMappingURL=chunk-BDXKKMBZ.mjs.map
184
- //# sourceMappingURL=chunk-BDXKKMBZ.mjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/elements/Button/Button.tsx"],"names":["AriaButton"],"mappings":"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","file":"chunk-BDXKKMBZ.mjs","sourcesContent":["\"use client\";\n\n/**\n * Button Component - 3-Layer Architecture\n * Accessible button with React Aria primitives and CVA styling\n *\n * Architecture:\n * - Layer 1: Touch Target (44x44px WCAG AAA compliant, transparent)\n * - Layer 2: Visual Button (configurable size, colors, borders)\n * - Layer 3: Content & Effects (text, icons, ripple, loading spinner)\n *\n * @see 3layer-plan.md for architecture details\n * @see spec.md FR-029 to FR-037 (Button Component Requirements)\n * @see spec.md FR-009 (WCAG 2.2 AAA - 7:1 contrast ratio)\n * @see spec.md FR-014 (44x44px minimum touch targets)\n * @see constitution.md Principle IV (Accessibility First)\n */\n\nimport { forwardRef, memo, useId, type ReactNode } from 'react';\nimport {\n Button as AriaButton,\n type ButtonProps as AriaButtonProps,\n} from 'react-aria-components';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { Loader2, Zap } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport { PRESSED_STYLES, HOVER_STYLES, HIGH_CONTRAST_HOVER, HIGH_CONTRAST_PRESSED } from '../../styles/interaction-states';\nimport {\n useButtonGroupContext,\n useButtonGroupItemContext,\n} from '../ButtonGroup/ButtonGroupContext';\nimport { buttonGroupItemVariants } from '../ButtonGroup/ButtonGroup.variants';\n\n/**\n * Layer 1: Transparent outer touch target (44x44px minimum)\n * Handles WCAG 2.2 AAA touch target requirement\n * Always transparent, centers the visual button inside\n * IMPORTANT: Focus ring stays on Layer 1 for AAA compliance (2.4.13)\n *\n * In vertical ButtonGroups, uses items-stretch so the visual layer (Layer 2)\n * can fill the full touch target height, eliminating gaps between buttons.\n */\nconst buttonOuterVariants = cva(\n \"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\",\n {\n variants: {\n fullWidth: {\n true: \"w-full\",\n false: \"\",\n },\n inVerticalGroup: {\n true: \"items-stretch\",\n false: \"items-center\",\n },\n },\n defaultVariants: {\n fullWidth: false,\n inVerticalGroup: false,\n },\n }\n);\n\n/**\n * Layer 2: Visual button appearance (adjustable size)\n * Provides the visual appearance with configurable size\n * Can be smaller than touch target for use cases like carousel dots\n * NOTE: NO focus-visible styles here - focus ring is on Layer 1\n */\nconst buttonVisualVariants = cva(\n \"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\",\n {\n variants: {\n variant: {\n default:\n \"bg-[var(--primary-action)] text-[var(--primary-action-foreground)] shadow-md hover:bg-[var(--primary-action-hover)] data-[pressed]:bg-[var(--primary-action)]/80\",\n destructive:\n \"bg-[var(--destructive-background)] text-[var(--destructive-foreground)] shadow-md hover:bg-[var(--destructive-background)]/90 data-[pressed]:bg-[var(--destructive-background)]/80\",\n outline:\n \"border border-[var(--input-border)] bg-[var(--page-background)] hover:bg-[var(--input-border)] data-[pressed]:bg-[var(--input-border)]\",\n secondary:\n \"bg-[var(--secondary)] text-[var(--secondary-foreground)] shadow-md hover:bg-[var(--secondary)]/80 data-[pressed]:bg-[var(--secondary)]/70\",\n ghost:\n \"hover:bg-[var(--accent)] hover:text-[var(--accent-foreground)] data-[pressed]:bg-[var(--accent)]\",\n link: \"text-[var(--text-link)] underline-offset-4 hover:underline data-[pressed]:text-[var(--text-link-hover)]\",\n },\n fullWidth: {\n true: \"w-full\",\n false: \"\",\n },\n visualSize: {\n default: \"h-10 px-4 py-2\",\n sm: \"h-9 rounded-md px-3 text-xs\",\n lg: \"h-11 rounded-md px-8\",\n icon: \"h-10 w-10\",\n dot: \"h-5 w-5 rounded-full p-0 min-h-0 min-w-0\",\n },\n paywall: {\n true: \"!bg-[var(--paywall)] !text-[var(--paywall-foreground)] !shadow-md hover:!bg-[var(--paywall)]/90 !cursor-not-allowed !border-transparent\",\n false: \"\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n visualSize: \"default\",\n paywall: false,\n },\n }\n);\n\n/**\n * @deprecated Use buttonVisualVariants instead. This alias is kept for backward compatibility.\n */\nconst buttonVariants = buttonVisualVariants;\n\nexport interface ButtonProps\n extends Omit<AriaButtonProps, 'className'>,\n VariantProps<typeof buttonVisualVariants> {\n as?: 'button' | 'a';\n loading?: boolean;\n loadingText?: string;\n shortcut?: string;\n className?: string;\n buttonVisualClassName?: string;\n children?: ReactNode;\n /** Enables paywall state - overrides variant styling and prevents normal action */\n paywall?: boolean;\n /** URL to open in new tab when paywalled button is clicked */\n paywallRedirect?: string;\n /** Description of the premium feature for tooltips and screen readers (max 200 chars) */\n paywallDescription?: string;\n /** Full width button */\n fullWidth?: boolean;\n /**\n * Visual size of the button (Layer 2)\n * Defaults to `size` for backward compatibility\n * Use independently for small visual buttons with large touch targets\n * @example <Button size=\"default\" visualSize=\"dot\" /> // 44px touch, 12px visual\n */\n visualSize?: 'sm' | 'default' | 'lg' | 'icon' | 'dot';\n /**\n * Size of the button - controls both touch target awareness and visual size\n * @deprecated For independent visual sizing, use visualSize prop instead\n */\n size?: 'sm' | 'default' | 'lg' | 'icon';\n}\n\n/**\n * Button Component - 3-Layer Architecture\n * Fully accessible button with React Aria and themed styling\n *\n * Layer 1: Touch Target (AriaButton) - 44x44px WCAG AAA compliant\n * Layer 2: Visual Button (span) - configurable appearance\n * Layer 3: Content (children) - text, icons, effects\n */\nconst Button = memo(forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n buttonVisualClassName,\n variant,\n size,\n visualSize,\n fullWidth,\n loading = false,\n loadingText = \"Loading...\",\n shortcut,\n children,\n isDisabled,\n paywall = false,\n paywallRedirect,\n paywallDescription,\n onPress,\n ...props\n },\n ref\n ) => {\n const paywallDescriptionId = useId();\n\n // ==========================================================================\n // ButtonGroup Context Integration\n // ==========================================================================\n\n // Consume group-level context (variant, size, isDisabled, orientation)\n const groupContext = useButtonGroupContext();\n\n // Consume item-level context (position for border-radius styling)\n const itemContext = useButtonGroupItemContext();\n\n // Merge context values with props (props take precedence)\n const effectiveVariant = variant ?? groupContext?.variant ?? 'default';\n const effectiveSize = size ?? groupContext?.size;\n const effectiveIsDisabled = isDisabled ?? groupContext?.isDisabled ?? false;\n\n // In vertical groups, buttons should be full width automatically\n const isInVerticalGroup = groupContext?.orientation === 'vertical';\n const effectiveFullWidth = fullWidth || isInVerticalGroup;\n\n // Position styling for ButtonGroup (only applied when in a group)\n const positionClassName = itemContext\n ? buttonGroupItemVariants({\n orientation: groupContext?.orientation ?? 'horizontal',\n position: itemContext.position,\n })\n : '';\n\n // Default visualSize to size for backward compatibility\n const effectiveVisualSize = visualSize ?? effectiveSize ?? 'default';\n\n // AAA Accessibility: Warn in dev/test if icon/dot variant lacks accessible name\n if (process.env.NODE_ENV !== 'production') {\n if (\n (effectiveVisualSize === 'dot' || effectiveVisualSize === 'icon') &&\n !props['aria-label'] &&\n !children\n ) {\n console.warn(\n '[Button] visualSize=\"dot\" or \"icon\" requires aria-label when no visible text is provided (WCAG 1.1.1)'\n );\n }\n }\n\n /**\n * Handle button press - intercepts action when paywalled\n * If paywalled with redirect URL, opens in new tab\n * Otherwise, calls the normal onPress handler\n */\n const handlePress = (e: Parameters<NonNullable<AriaButtonProps['onPress']>>[0]): void => {\n if (paywall) {\n if (paywallRedirect) {\n window.open(paywallRedirect, '_blank', 'noopener,noreferrer');\n }\n // Don't call onPress when paywalled\n return;\n }\n onPress?.(e);\n };\n\n // Only set isDisabled when we have a reason to disable\n // Otherwise, let slot system control disabled state (e.g., in NumberField)\n const computedIsDisabled = effectiveIsDisabled || loading || undefined;\n\n return (\n <AriaButton\n ref={ref}\n isDisabled={computedIsDisabled}\n aria-disabled={paywall ? true : undefined}\n aria-describedby={paywall ? paywallDescriptionId : undefined}\n onPress={handlePress}\n className={cn(buttonOuterVariants({ fullWidth: effectiveFullWidth, inVerticalGroup: isInVerticalGroup }), className)}\n {...props}\n >\n {(renderProps) => (\n /* Layer 2: Visual Button */\n <span\n className={cn(\n buttonVisualVariants({\n variant: effectiveVariant,\n visualSize: effectiveVisualSize,\n paywall,\n fullWidth: effectiveFullWidth,\n }),\n // Position styling from ButtonGroup context (border-radius adjustments)\n positionClassName,\n buttonVisualClassName,\n // Layer 2 interaction styles (no focus - focus ring is on Layer 1)\n PRESSED_STYLES,\n HOVER_STYLES,\n HIGH_CONTRAST_HOVER,\n HIGH_CONTRAST_PRESSED\n )}\n data-pressed={renderProps.isPressed || undefined}\n >\n {/* Layer 3: Content & Effects */}\n\n {/* FR-033: Loading spinner with screen reader announcement */}\n {/* Uses motion-safe: for WCAG 2.3.3 AAA (Animation from Interactions) */}\n {loading && (\n <>\n <Loader2 className=\"motion-safe:animate-spin\" aria-hidden=\"true\" />\n <span className=\"sr-only\" aria-live=\"polite\">\n {loadingText}\n </span>\n </>\n )}\n\n {/* Hide children during loading */}\n {!loading && children}\n\n {/* Paywall: Lightning bolt icon */}\n {paywall && (\n <Zap\n data-testid=\"zap-icon\"\n aria-hidden=\"true\"\n className=\"ml-1\"\n />\n )}\n\n {/* Paywall: Screen reader description */}\n {paywall && (\n <span id={paywallDescriptionId} className=\"sr-only\">\n Premium feature: {paywallDescription || \"Upgrade required to access this feature\"}\n </span>\n )}\n\n {/* FR-034: Keyboard shortcut display on focus */}\n {renderProps.isFocusVisible && shortcut && (\n <kbd className=\"ml-auto hidden text-xs opacity-60 lg:inline\">\n {shortcut}\n </kbd>\n )}\n\n {/* Touch/press ripple effect - FR-031: Pressed state feedback */}\n {/* Uses motion-safe: for WCAG 2.3.3 AAA (Animation from Interactions) */}\n {renderProps.isPressed && (\n <span\n className=\"absolute inset-0 rounded-[inherit] bg-current opacity-10 motion-safe:animate-in motion-safe:zoom-in-95\"\n aria-hidden=\"true\"\n />\n )}\n </span>\n )}\n </AriaButton>\n );\n }\n));\n\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants, buttonOuterVariants, buttonVisualVariants };\n"]}