@clubmed/trident-ui 1.6.0 → 1.6.1-beta.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 (472) hide show
  1. package/README.md +3 -2
  2. package/assets/icons/Utilities/LightBulb.svg +3 -0
  3. package/assets/trident-ui.css +1 -1
  4. package/atoms/Heading/Heading.d.ts +1 -6
  5. package/atoms/Heading/Heading.js +2 -11
  6. package/atoms/Heading/Heading.js.map +1 -1
  7. package/atoms/Heading/HeadingGroup.d.ts +1 -7
  8. package/atoms/Heading/HeadingGroup.js +2 -12
  9. package/atoms/Heading/HeadingGroup.js.map +1 -1
  10. package/atoms/Icons/IconsResolver.js +2 -2
  11. package/atoms/Icons/contexts/IconsContext.js +2 -2
  12. package/atoms/Icons/index.d.ts +0 -1
  13. package/atoms/Icons/index.js +8 -9
  14. package/atoms/Icons/index.js.map +1 -1
  15. package/atoms/Image/Image.d.ts +1 -7
  16. package/atoms/Image/Image.js +2 -15
  17. package/atoms/Image/Image.js.map +1 -1
  18. package/atoms/Prose/Prose.d.ts +1 -5
  19. package/atoms/Prose/Prose.js +2 -15
  20. package/atoms/Prose/Prose.js.map +1 -1
  21. package/chunks/ResizeObserver.js +13 -13
  22. package/chunks/ResizeObserver.js.map +1 -1
  23. package/chunks/_commonjsHelpers.js +4 -29
  24. package/chunks/_commonjsHelpers.js.map +1 -1
  25. package/chunks/clsx.js.map +1 -1
  26. package/chunks/plugin.js +4 -4
  27. package/chunks/plugin.js.map +1 -1
  28. package/molecules/Arrows/Arrows.d.ts +1 -16
  29. package/molecules/Arrows/Arrows.js +2 -63
  30. package/molecules/Arrows/Arrows.js.map +1 -1
  31. package/molecules/Arrows.d.ts +1 -1
  32. package/molecules/Arrows.js +1 -1
  33. package/molecules/Avatar.d.ts +1 -8
  34. package/molecules/Avatar.js +2 -47
  35. package/molecules/Avatar.js.map +1 -1
  36. package/molecules/Backdrop.d.ts +1 -23
  37. package/molecules/Backdrop.js +2 -115
  38. package/molecules/Backdrop.js.map +1 -1
  39. package/molecules/Breadcrumb.d.ts +1 -10
  40. package/molecules/Breadcrumb.js +2 -47
  41. package/molecules/Breadcrumb.js.map +1 -1
  42. package/molecules/Breadcrumb.themes.d.ts +1 -8
  43. package/molecules/Breadcrumb.themes.js +2 -12
  44. package/molecules/Breadcrumb.themes.js.map +1 -1
  45. package/molecules/Buttons/ArrowButton.js.map +1 -1
  46. package/molecules/Buttons/Button.d.ts +1 -1
  47. package/molecules/Buttons/Button.js +1 -1
  48. package/molecules/Buttons/Button.js.map +1 -1
  49. package/molecules/Buttons/ButtonAnchor.js +1 -1
  50. package/molecules/Buttons/ButtonAnchor.js.map +1 -1
  51. package/molecules/Buttons/ButtonContent.d.ts +1 -17
  52. package/molecules/Buttons/ButtonContent.js +2 -15
  53. package/molecules/Buttons/ButtonContent.js.map +1 -1
  54. package/molecules/Buttons/FakeButton.d.ts +1 -1
  55. package/molecules/Buttons/FakeButton.js +1 -1
  56. package/molecules/Buttons/FakeButton.js.map +1 -1
  57. package/molecules/Buttons/v2/Button.d.ts +1 -2288
  58. package/molecules/Buttons/v2/Button.js +3 -47
  59. package/molecules/Buttons/v2/Button.js.map +1 -1
  60. package/molecules/Buttons/v2/Button.type.d.ts +1 -57
  61. package/molecules/Buttons/v2/Button.type.js +6 -42
  62. package/molecules/Buttons/v2/Button.type.js.map +1 -1
  63. package/molecules/Card.d.ts +1 -1
  64. package/molecules/Card.js +1 -1
  65. package/molecules/Cards/Card.js +2 -2
  66. package/molecules/Cards/CardAspectRatios.d.ts +1 -6
  67. package/molecules/Cards/CardAspectRatios.js +2 -7
  68. package/molecules/Cards/CardAspectRatios.js.map +1 -1
  69. package/molecules/Cards/CardBackground.d.ts +1 -4
  70. package/molecules/Cards/CardBackground.js +2 -27
  71. package/molecules/Cards/CardBackground.js.map +1 -1
  72. package/molecules/Cards/CardBackgroundContext.d.ts +1 -6
  73. package/molecules/Cards/CardBackgroundContext.js +3 -7
  74. package/molecules/Cards/CardBackgroundContext.js.map +1 -1
  75. package/molecules/Cards/CardClickable.d.ts +1 -6
  76. package/molecules/Cards/CardClickable.js +2 -34
  77. package/molecules/Cards/CardClickable.js.map +1 -1
  78. package/molecules/Cards/ExpandableCard.d.ts +1 -14
  79. package/molecules/Cards/ExpandableCard.js +2 -77
  80. package/molecules/Cards/ExpandableCard.js.map +1 -1
  81. package/molecules/Cards/v2/Card.d.ts +1 -15
  82. package/molecules/Cards/v2/Card.js +2 -31
  83. package/molecules/Cards/v2/Card.js.map +1 -1
  84. package/molecules/Chip.d.ts +1 -9
  85. package/molecules/Chip.js +2 -28
  86. package/molecules/Chip.js.map +1 -1
  87. package/molecules/Chip.themes.d.ts +1 -12
  88. package/molecules/Chip.themes.js +3 -21
  89. package/molecules/Chip.themes.js.map +1 -1
  90. package/molecules/Clickable/Clickable.d.ts +1 -0
  91. package/molecules/Clickable/Clickable.js +5 -0
  92. package/molecules/Clickable/Clickable.js.map +1 -0
  93. package/molecules/ElasticHeight.d.ts +1 -8
  94. package/molecules/ElasticHeight.js +2 -33
  95. package/molecules/ElasticHeight.js.map +1 -1
  96. package/molecules/Forms/Checkboxes/Checkbox.d.ts +1 -6
  97. package/molecules/Forms/Checkboxes/Checkbox.js +2 -97
  98. package/molecules/Forms/Checkboxes/Checkbox.js.map +1 -1
  99. package/molecules/Forms/Checkboxes/Checkboxes.d.ts +1 -5
  100. package/molecules/Forms/Checkboxes/Checkboxes.js +2 -46
  101. package/molecules/Forms/Checkboxes/Checkboxes.js.map +1 -1
  102. package/molecules/Forms/Checkboxes/index.d.ts +2 -2
  103. package/molecules/Forms/Checkboxes/index.js +2 -2
  104. package/molecules/Forms/DateField.d.ts +1 -24
  105. package/molecules/Forms/DateField.js +2 -185
  106. package/molecules/Forms/DateField.js.map +1 -1
  107. package/molecules/Forms/Filter.d.ts +1 -9
  108. package/molecules/Forms/Filter.js +2 -65
  109. package/molecules/Forms/Filter.js.map +1 -1
  110. package/molecules/Forms/FormControl.d.ts +1 -14
  111. package/molecules/Forms/FormControl.js +2 -51
  112. package/molecules/Forms/FormControl.js.map +1 -1
  113. package/molecules/Forms/FormControlError.d.ts +1 -2
  114. package/molecules/Forms/FormControlError.js +2 -23
  115. package/molecules/Forms/FormControlError.js.map +1 -1
  116. package/molecules/Forms/FormLabel.d.ts +1 -8
  117. package/molecules/Forms/FormLabel.js +2 -34
  118. package/molecules/Forms/FormLabel.js.map +1 -1
  119. package/molecules/Forms/NumberField.d.ts +1 -320
  120. package/molecules/Forms/NumberField.js +3 -126
  121. package/molecules/Forms/NumberField.js.map +1 -1
  122. package/molecules/Forms/Password/Password.d.ts +1 -7
  123. package/molecules/Forms/Password/Password.js +2 -112
  124. package/molecules/Forms/Password/Password.js.map +1 -1
  125. package/molecules/Forms/Password/ValidationMessage.d.ts +1 -6
  126. package/molecules/Forms/Password/ValidationMessage.js +2 -25
  127. package/molecules/Forms/Password/ValidationMessage.js.map +1 -1
  128. package/molecules/Forms/Password/index.d.ts +2 -2
  129. package/molecules/Forms/Password/index.js +2 -2
  130. package/molecules/Forms/Radios/Radio.d.ts +1 -17
  131. package/molecules/Forms/Radios/Radio.js +2 -60
  132. package/molecules/Forms/Radios/Radio.js.map +1 -1
  133. package/molecules/Forms/Radios/RadioGroup.d.ts +1 -5
  134. package/molecules/Forms/Radios/RadioGroup.js +2 -73
  135. package/molecules/Forms/Radios/RadioGroup.js.map +1 -1
  136. package/molecules/Forms/Radios/index.d.ts +2 -2
  137. package/molecules/Forms/Radios/index.js +4 -4
  138. package/molecules/Forms/Range.d.ts +1 -40
  139. package/molecules/Forms/Range.js +2 -230
  140. package/molecules/Forms/Range.js.map +1 -1
  141. package/molecules/Forms/Select.d.ts +1 -10
  142. package/molecules/Forms/Select.js +2 -101
  143. package/molecules/Forms/Select.js.map +1 -1
  144. package/molecules/Forms/Switch.d.ts +1 -5
  145. package/molecules/Forms/Switch.js +2 -60
  146. package/molecules/Forms/Switch.js.map +1 -1
  147. package/molecules/Forms/TextField.d.ts +1 -12
  148. package/molecules/Forms/TextField.js +2 -95
  149. package/molecules/Forms/TextField.js.map +1 -1
  150. package/molecules/HamburgerIcon.d.ts +1 -6
  151. package/molecules/HamburgerIcon.js +2 -40
  152. package/molecules/HamburgerIcon.js.map +1 -1
  153. package/molecules/Link.d.ts +1 -35
  154. package/molecules/Link.js +2 -53
  155. package/molecules/Link.js.map +1 -1
  156. package/molecules/Loader.d.ts +1 -7
  157. package/molecules/Loader.js +2 -63
  158. package/molecules/Loader.js.map +1 -1
  159. package/molecules/Pagination.d.ts +1 -38
  160. package/molecules/Pagination.helper.d.ts +1 -48
  161. package/molecules/Pagination.helper.js +5 -27
  162. package/molecules/Pagination.helper.js.map +1 -1
  163. package/molecules/Pagination.js +2 -151
  164. package/molecules/Pagination.js.map +1 -1
  165. package/molecules/Popin.d.ts +1 -22
  166. package/molecules/Popin.js +2 -58
  167. package/molecules/Popin.js.map +1 -1
  168. package/molecules/Portal/Portal.d.ts +1 -11
  169. package/molecules/Portal/Portal.js +2 -28
  170. package/molecules/Portal/Portal.js.map +1 -1
  171. package/molecules/Spinner.d.ts +1 -9
  172. package/molecules/Spinner.js +2 -19
  173. package/molecules/Spinner.js.map +1 -1
  174. package/molecules/Tabs/Tab.d.ts +1 -31
  175. package/molecules/Tabs/Tab.js +2 -107
  176. package/molecules/Tabs/Tab.js.map +1 -1
  177. package/molecules/Tabs/TabList.d.ts +1 -10
  178. package/molecules/Tabs/TabList.js +2 -51
  179. package/molecules/Tabs/TabList.js.map +1 -1
  180. package/molecules/Tabs/TabPanel.d.ts +1 -17
  181. package/molecules/Tabs/TabPanel.js +2 -40
  182. package/molecules/Tabs/TabPanel.js.map +1 -1
  183. package/molecules/Tabs/Tabs.d.ts +1 -12
  184. package/molecules/Tabs/Tabs.js +2 -17
  185. package/molecules/Tabs/Tabs.js.map +1 -1
  186. package/molecules/Tabs/TabsBody.d.ts +0 -6
  187. package/molecules/Tabs/TabsBody.js +1 -6
  188. package/molecules/Tabs/TabsBody.js.map +1 -1
  189. package/molecules/Tabs/TabsHeader.js +1 -1
  190. package/molecules/Tabs/TabsHeading.js +1 -1
  191. package/molecules/Tabs/TabsPanel.js +1 -1
  192. package/molecules/Tabs/context/TabControl.d.ts +1 -52
  193. package/molecules/Tabs/context/TabControl.js +3 -87
  194. package/molecules/Tabs/context/TabControl.js.map +1 -1
  195. package/molecules/Tabs/hooks/tabControl.d.ts +1 -44
  196. package/molecules/Tabs/hooks/tabControl.js +7 -31
  197. package/molecules/Tabs/hooks/tabControl.js.map +1 -1
  198. package/molecules/Tabs/index.d.ts +7 -7
  199. package/molecules/Tabs/index.js +13 -14
  200. package/molecules/Tabs/theme.d.ts +1 -10
  201. package/molecules/Tabs/theme.js +1 -20
  202. package/molecules/Tabs/theme.js.map +1 -1
  203. package/molecules/Tag.d.ts +1 -45
  204. package/molecules/Tag.js +2 -76
  205. package/molecules/Tag.js.map +1 -1
  206. package/package.json +30 -93
  207. package/tailwind/tailwind.preset.js +232 -232
  208. package/tailwind/tailwind.preset.js.map +1 -1
  209. package/ui/Avatar.d.ts +8 -0
  210. package/ui/Avatar.js +50 -0
  211. package/ui/Avatar.js.map +1 -0
  212. package/ui/Backdrop.d.ts +23 -0
  213. package/ui/Backdrop.js +118 -0
  214. package/ui/Backdrop.js.map +1 -0
  215. package/ui/Breadcrumb.d.ts +10 -0
  216. package/ui/Breadcrumb.js +50 -0
  217. package/ui/Breadcrumb.js.map +1 -0
  218. package/ui/Breadcrumb.themes.d.ts +8 -0
  219. package/ui/Breadcrumb.themes.js +15 -0
  220. package/ui/Breadcrumb.themes.js.map +1 -0
  221. package/ui/Chip.d.ts +9 -0
  222. package/ui/Chip.js +31 -0
  223. package/ui/Chip.js.map +1 -0
  224. package/ui/Chip.themes.d.ts +12 -0
  225. package/ui/Chip.themes.js +24 -0
  226. package/ui/Chip.themes.js.map +1 -0
  227. package/{atoms/Clickable → ui}/Clickable.js +1 -1
  228. package/ui/Clickable.js.map +1 -0
  229. package/ui/ElasticHeight.d.ts +8 -0
  230. package/ui/ElasticHeight.js +36 -0
  231. package/ui/ElasticHeight.js.map +1 -0
  232. package/ui/HamburgerIcon.d.ts +6 -0
  233. package/ui/HamburgerIcon.js +43 -0
  234. package/ui/HamburgerIcon.js.map +1 -0
  235. package/ui/Image.d.ts +7 -0
  236. package/ui/Image.js +18 -0
  237. package/ui/Image.js.map +1 -0
  238. package/ui/Link.d.ts +35 -0
  239. package/ui/Link.js +56 -0
  240. package/ui/Link.js.map +1 -0
  241. package/ui/Loader.d.ts +7 -0
  242. package/ui/Loader.js +66 -0
  243. package/ui/Loader.js.map +1 -0
  244. package/ui/Pagination.d.ts +38 -0
  245. package/ui/Pagination.helper.d.ts +48 -0
  246. package/ui/Pagination.helper.js +30 -0
  247. package/ui/Pagination.helper.js.map +1 -0
  248. package/ui/Pagination.js +154 -0
  249. package/ui/Pagination.js.map +1 -0
  250. package/ui/Popin.d.ts +22 -0
  251. package/ui/Popin.js +61 -0
  252. package/ui/Popin.js.map +1 -0
  253. package/ui/Portal.d.ts +11 -0
  254. package/ui/Portal.js +31 -0
  255. package/ui/Portal.js.map +1 -0
  256. package/ui/Prose.d.ts +5 -0
  257. package/ui/Prose.js +18 -0
  258. package/ui/Prose.js.map +1 -0
  259. package/ui/Spinner.d.ts +9 -0
  260. package/ui/Spinner.js +22 -0
  261. package/ui/Spinner.js.map +1 -0
  262. package/ui/Tag.d.ts +45 -0
  263. package/ui/Tag.js +79 -0
  264. package/ui/Tag.js.map +1 -0
  265. package/ui/arrows/Arrows.d.ts +16 -0
  266. package/ui/arrows/Arrows.js +66 -0
  267. package/ui/arrows/Arrows.js.map +1 -0
  268. package/ui/buttons/ArrowButton.d.ts +6 -0
  269. package/ui/buttons/ArrowButton.js +7 -0
  270. package/ui/buttons/ArrowButton.js.map +1 -0
  271. package/ui/buttons/Button.d.ts +2392 -0
  272. package/ui/buttons/Button.js +50 -0
  273. package/ui/buttons/Button.js.map +1 -0
  274. package/ui/buttons/Button.type.d.ts +57 -0
  275. package/ui/buttons/Button.type.js +45 -0
  276. package/ui/buttons/Button.type.js.map +1 -0
  277. package/ui/buttons/ButtonContent.d.ts +17 -0
  278. package/ui/buttons/ButtonContent.js +18 -0
  279. package/ui/buttons/ButtonContent.js.map +1 -0
  280. package/ui/cards/Card.d.ts +15 -0
  281. package/ui/cards/Card.js +34 -0
  282. package/ui/cards/Card.js.map +1 -0
  283. package/ui/cards/CardAspectRatios.d.ts +6 -0
  284. package/ui/cards/CardAspectRatios.js +10 -0
  285. package/ui/cards/CardAspectRatios.js.map +1 -0
  286. package/ui/cards/CardBackground.d.ts +4 -0
  287. package/ui/cards/CardBackground.js +30 -0
  288. package/ui/cards/CardBackground.js.map +1 -0
  289. package/ui/cards/CardBackgroundContext.d.ts +6 -0
  290. package/ui/cards/CardBackgroundContext.js +10 -0
  291. package/ui/cards/CardBackgroundContext.js.map +1 -0
  292. package/ui/cards/CardClickable.d.ts +6 -0
  293. package/ui/cards/CardClickable.js +37 -0
  294. package/ui/cards/CardClickable.js.map +1 -0
  295. package/ui/cards/ExpandableCard.d.ts +14 -0
  296. package/ui/cards/ExpandableCard.js +80 -0
  297. package/ui/cards/ExpandableCard.js.map +1 -0
  298. package/{contexts → ui/contexts}/Device.d.ts +1 -1
  299. package/{contexts → ui/contexts}/Device.js +1 -1
  300. package/{contexts → ui/contexts}/TridentUIConfig.js +68 -68
  301. package/ui/contexts/TridentUIConfig.js.map +1 -0
  302. package/ui/contexts/devices/Device.js.map +1 -0
  303. package/{contexts/Devices → ui/contexts/devices}/hooks/useQueries.d.ts +8 -1
  304. package/ui/contexts/devices/hooks/useQueries.js.map +1 -0
  305. package/ui/contexts/devices/reducers/reducer.js.map +1 -0
  306. package/ui/forms/DateField.d.ts +24 -0
  307. package/ui/forms/DateField.js +162 -0
  308. package/ui/forms/DateField.js.map +1 -0
  309. package/ui/forms/Filter.d.ts +9 -0
  310. package/ui/forms/Filter.js +68 -0
  311. package/ui/forms/Filter.js.map +1 -0
  312. package/ui/forms/FormControl.d.ts +14 -0
  313. package/ui/forms/FormControl.js +54 -0
  314. package/ui/forms/FormControl.js.map +1 -0
  315. package/ui/forms/FormControlError.d.ts +2 -0
  316. package/ui/forms/FormControlError.js +26 -0
  317. package/ui/forms/FormControlError.js.map +1 -0
  318. package/ui/forms/FormLabel.d.ts +8 -0
  319. package/ui/forms/FormLabel.js +37 -0
  320. package/ui/forms/FormLabel.js.map +1 -0
  321. package/ui/forms/NumberField.d.ts +332 -0
  322. package/ui/forms/NumberField.js +129 -0
  323. package/ui/forms/NumberField.js.map +1 -0
  324. package/ui/forms/Range.d.ts +40 -0
  325. package/ui/forms/Range.js +161 -0
  326. package/ui/forms/Range.js.map +1 -0
  327. package/ui/forms/Select.d.ts +10 -0
  328. package/ui/forms/Select.js +104 -0
  329. package/ui/forms/Select.js.map +1 -0
  330. package/ui/forms/Switch.d.ts +5 -0
  331. package/ui/forms/Switch.js +63 -0
  332. package/ui/forms/Switch.js.map +1 -0
  333. package/ui/forms/TextField.d.ts +12 -0
  334. package/ui/forms/TextField.js +98 -0
  335. package/ui/forms/TextField.js.map +1 -0
  336. package/ui/forms/checkboxes/Checkbox.d.ts +6 -0
  337. package/ui/forms/checkboxes/Checkbox.js +100 -0
  338. package/ui/forms/checkboxes/Checkbox.js.map +1 -0
  339. package/ui/forms/checkboxes/Checkboxes.d.ts +5 -0
  340. package/ui/forms/checkboxes/Checkboxes.js +49 -0
  341. package/ui/forms/checkboxes/Checkboxes.js.map +1 -0
  342. package/ui/forms/checkboxes/index.d.ts +2 -0
  343. package/ui/forms/checkboxes/index.js +7 -0
  344. package/ui/forms/checkboxes/index.js.map +1 -0
  345. package/ui/forms/password/Password.d.ts +7 -0
  346. package/ui/forms/password/Password.js +115 -0
  347. package/ui/forms/password/Password.js.map +1 -0
  348. package/ui/forms/password/ValidationMessage.d.ts +6 -0
  349. package/ui/forms/password/ValidationMessage.js +28 -0
  350. package/ui/forms/password/ValidationMessage.js.map +1 -0
  351. package/ui/forms/password/index.d.ts +2 -0
  352. package/ui/forms/password/index.js +7 -0
  353. package/ui/forms/password/index.js.map +1 -0
  354. package/ui/forms/radios/Radio.d.ts +17 -0
  355. package/ui/forms/radios/Radio.js +63 -0
  356. package/ui/forms/radios/Radio.js.map +1 -0
  357. package/ui/forms/radios/RadioGroup.d.ts +5 -0
  358. package/ui/forms/radios/RadioGroup.js +76 -0
  359. package/ui/forms/radios/RadioGroup.js.map +1 -0
  360. package/ui/forms/radios/index.d.ts +2 -0
  361. package/ui/forms/radios/index.js +7 -0
  362. package/ui/forms/radios/index.js.map +1 -0
  363. package/ui/heading/Heading.d.ts +6 -0
  364. package/ui/heading/Heading.js +14 -0
  365. package/ui/heading/Heading.js.map +1 -0
  366. package/ui/heading/HeadingGroup.d.ts +7 -0
  367. package/ui/heading/HeadingGroup.js +15 -0
  368. package/ui/heading/HeadingGroup.js.map +1 -0
  369. package/ui/helpers/colors/colors.js.map +1 -0
  370. package/ui/helpers/twMerge.js.map +1 -0
  371. package/ui/hooks/keyboard.constants.js.map +1 -0
  372. package/{hooks → ui/hooks}/useInternalStatus.d.ts +1 -1
  373. package/ui/hooks/useInternalStatus.js.map +1 -0
  374. package/ui/hooks/useKeyboardControls.js.map +1 -0
  375. package/{hooks → ui/hooks}/useResizeObserver.js +1 -1
  376. package/ui/hooks/useResizeObserver.js.map +1 -0
  377. package/{hooks → ui/hooks}/useSafeBoop.js +674 -708
  378. package/ui/hooks/useSafeBoop.js.map +1 -0
  379. package/ui/hooks/useSlots.js.map +1 -0
  380. package/ui/hooks/useValue.js.map +1 -0
  381. package/ui/tabs/Tab.d.ts +31 -0
  382. package/ui/tabs/Tab.js +110 -0
  383. package/ui/tabs/Tab.js.map +1 -0
  384. package/ui/tabs/TabList.d.ts +10 -0
  385. package/ui/tabs/TabList.js +54 -0
  386. package/ui/tabs/TabList.js.map +1 -0
  387. package/ui/tabs/TabPanel.d.ts +17 -0
  388. package/ui/tabs/TabPanel.js +43 -0
  389. package/ui/tabs/TabPanel.js.map +1 -0
  390. package/ui/tabs/Tabs.d.ts +12 -0
  391. package/ui/tabs/Tabs.js +20 -0
  392. package/ui/tabs/Tabs.js.map +1 -0
  393. package/ui/tabs/TabsBody.d.ts +6 -0
  394. package/ui/tabs/TabsBody.js +7 -0
  395. package/ui/tabs/TabsBody.js.map +1 -0
  396. package/ui/tabs/context/TabControl.d.ts +52 -0
  397. package/ui/tabs/context/TabControl.js +90 -0
  398. package/ui/tabs/context/TabControl.js.map +1 -0
  399. package/ui/tabs/hooks/tabControl.d.ts +44 -0
  400. package/ui/tabs/hooks/tabControl.js +34 -0
  401. package/ui/tabs/hooks/tabControl.js.map +1 -0
  402. package/ui/tabs/index.d.ts +5 -0
  403. package/ui/tabs/index.js +13 -0
  404. package/ui/tabs/index.js.map +1 -0
  405. package/ui/tabs/theme.d.ts +10 -0
  406. package/ui/tabs/theme.js +24 -0
  407. package/ui/tabs/theme.js.map +1 -0
  408. package/ui/types/Devices.js.map +1 -0
  409. package/CHANGELOG.md +0 -1949
  410. package/atoms/Clickable/Clickable.js.map +0 -1
  411. package/atoms/Icons/Iconics.d.ts +0 -9
  412. package/atoms/Icons/Iconics.js +0 -2
  413. package/atoms/Icons/Iconics.js.map +0 -1
  414. package/contexts/Devices/Device.js.map +0 -1
  415. package/contexts/Devices/hooks/useQueries.js.map +0 -1
  416. package/contexts/Devices/reducers/reducer.js.map +0 -1
  417. package/contexts/TridentUIConfig.js.map +0 -1
  418. package/helpers/colors/colors.js.map +0 -1
  419. package/helpers/twMerge.js.map +0 -1
  420. package/hooks/keyboard.constants.js.map +0 -1
  421. package/hooks/useInternalStatus.js.map +0 -1
  422. package/hooks/useKeyboardControls.js.map +0 -1
  423. package/hooks/useResizeObserver.js.map +0 -1
  424. package/hooks/useSafeBoop.js.map +0 -1
  425. package/hooks/useSlots.js.map +0 -1
  426. package/hooks/useValue.js.map +0 -1
  427. package/types/Devices.js.map +0 -1
  428. /package/{atoms/Clickable → ui}/Clickable.d.ts +0 -0
  429. /package/{molecules/Arrows → ui/arrows}/ArrowsLabels.d.js +0 -0
  430. /package/{molecules/Arrows → ui/arrows}/ArrowsLabels.d.js.map +0 -0
  431. /package/{contexts → ui/contexts}/Device.js.map +0 -0
  432. /package/{contexts → ui/contexts}/TridentUIConfig.d.ts +0 -0
  433. /package/{contexts/Devices → ui/contexts/devices}/Device.d.ts +0 -0
  434. /package/{contexts/Devices → ui/contexts/devices}/Device.js +0 -0
  435. /package/{contexts/Devices → ui/contexts/devices}/hooks/useQueries.js +0 -0
  436. /package/{contexts/Devices → ui/contexts/devices}/reducers/reducer.d.ts +0 -0
  437. /package/{contexts/Devices → ui/contexts/devices}/reducers/reducer.js +0 -0
  438. /package/{helpers → ui/helpers}/colors/colors.d.ts +0 -0
  439. /package/{helpers → ui/helpers}/colors/colors.js +0 -0
  440. /package/{helpers → ui/helpers}/twMerge.d.ts +0 -0
  441. /package/{helpers → ui/helpers}/twMerge.js +0 -0
  442. /package/{hooks → ui/hooks}/keyboard.constants.d.ts +0 -0
  443. /package/{hooks → ui/hooks}/keyboard.constants.js +0 -0
  444. /package/{hooks → ui/hooks}/useInternalStatus.js +0 -0
  445. /package/{hooks → ui/hooks}/useKeyboardControls.d.ts +0 -0
  446. /package/{hooks → ui/hooks}/useKeyboardControls.js +0 -0
  447. /package/{hooks → ui/hooks}/useResizeObserver.d.ts +0 -0
  448. /package/{hooks → ui/hooks}/useSafeBoop.d.ts +0 -0
  449. /package/{hooks → ui/hooks}/useSlots.d.ts +0 -0
  450. /package/{hooks → ui/hooks}/useSlots.js +0 -0
  451. /package/{hooks → ui/hooks}/useValue.d.ts +0 -0
  452. /package/{hooks → ui/hooks}/useValue.js +0 -0
  453. /package/{types → ui/types}/Colors.d.ts +0 -0
  454. /package/{types → ui/types}/Colors.js +0 -0
  455. /package/{types → ui/types}/Colors.js.map +0 -0
  456. /package/{types → ui/types}/Devices.d.ts +0 -0
  457. /package/{types → ui/types}/Devices.js +0 -0
  458. /package/{types → ui/types}/Direction.d.ts +0 -0
  459. /package/{types → ui/types}/Direction.js +0 -0
  460. /package/{types → ui/types}/Direction.js.map +0 -0
  461. /package/{types → ui/types}/LiteralUnion.d.ts +0 -0
  462. /package/{types → ui/types}/LiteralUnion.js +0 -0
  463. /package/{types → ui/types}/LiteralUnion.js.map +0 -0
  464. /package/{types → ui/types}/ScrollerLabels.d.ts +0 -0
  465. /package/{types → ui/types}/ScrollerLabels.js +0 -0
  466. /package/{types → ui/types}/ScrollerLabels.js.map +0 -0
  467. /package/{types → ui/types}/Theme.d.ts +0 -0
  468. /package/{types → ui/types}/Theme.js +0 -0
  469. /package/{types → ui/types}/Theme.js.map +0 -0
  470. /package/{types → ui/types}/index.d.ts +0 -0
  471. /package/{types → ui/types}/index.js +0 -0
  472. /package/{types → ui/types}/index.js.map +0 -0
@@ -1,129 +1,6 @@
1
- import { jsx as d, jsxs as C } from "react/jsx-runtime";
2
- import { c as g } from "../../chunks/clsx.js";
3
- import { useId as I } from "react";
4
- import { useValue as y } from "../../hooks/useValue.js";
5
- import { Button as v } from "../Buttons/Button.js";
6
- import { FormControl as F } from "./FormControl.js";
7
- const V = { width: "28px", height: "28px" };
8
- function T(c) {
9
- const e = I(), {
10
- id: i = e,
11
- name: n = i,
12
- value: o = 0,
13
- onChange: u,
14
- min: r = 0,
15
- max: a = 10,
16
- disabled: s = !1,
17
- dataTestId: m = "NumberField",
18
- ...f
19
- } = c, { value: t, setValue: l } = y({
20
- name: n,
21
- defaultValue: o,
22
- formatter: Number,
23
- onChange: u
24
- });
25
- return {
26
- ...f,
27
- id: i,
28
- min: r,
29
- max: a,
30
- name: n,
31
- value: t,
32
- dataTestId: m,
33
- disabled: s,
34
- handleChange: (h) => {
35
- const x = Number(h.target.value);
36
- x >= r && x <= a && l(Number(x));
37
- },
38
- increase: () => {
39
- t < a && l(t + 1);
40
- },
41
- decrease: () => {
42
- t > r && l(t - 1);
43
- }
44
- };
45
- }
46
- const M = (c) => {
47
- const {
48
- disabled: e,
49
- min: i,
50
- max: n,
51
- label: o,
52
- description: u,
53
- id: r,
54
- dataTestId: a,
55
- value: s,
56
- handleChange: m,
57
- increase: f,
58
- decrease: t,
59
- errorMessage: l,
60
- validationStatus: N,
61
- hideRequiredStar: p,
62
- required: b,
63
- ...h
64
- } = T(c);
65
- return /* @__PURE__ */ d(
66
- F,
67
- {
68
- id: r,
69
- label: o,
70
- description: u,
71
- className: g("flex items-center justify-between", c.className),
72
- dataName: "NumberField",
73
- dataTestId: a,
74
- errorMessage: l,
75
- validationStatus: N,
76
- disabled: e,
77
- required: b,
78
- hideRequiredStar: p,
79
- layout: "vertical",
80
- children: /* @__PURE__ */ C("div", { className: "flex items-center gap-x-8", children: [
81
- /* @__PURE__ */ d(
82
- v,
83
- {
84
- onClick: t,
85
- variant: "circle",
86
- disabled: s <= i || e,
87
- icon: "MinusDefault",
88
- "aria-label": "Decrease",
89
- "data-testid": `${a}-decrease`
90
- }
91
- ),
92
- /* @__PURE__ */ d(
93
- "input",
94
- {
95
- ...h,
96
- className: g("text-b2 text-center font-normal outline-none", {
97
- "bg-pearl text-grey": e
98
- }),
99
- style: V,
100
- type: "number",
101
- id: r,
102
- onChange: m,
103
- disabled: e,
104
- required: b,
105
- value: s,
106
- min: i,
107
- max: n
108
- }
109
- ),
110
- /* @__PURE__ */ d(
111
- v,
112
- {
113
- onClick: f,
114
- variant: "circle",
115
- "aria-label": "Increase",
116
- disabled: s >= n || e,
117
- icon: "PlusDefault",
118
- "data-testid": `${a}-increase`
119
- }
120
- )
121
- ] })
122
- }
123
- );
124
- };
1
+ import { NumberField as m, useNumberField as u } from "../../ui/forms/NumberField.js";
125
2
  export {
126
- M as NumberField,
127
- T as useNumberField
3
+ m as NumberField,
4
+ u as useNumberField
128
5
  };
129
6
  //# sourceMappingURL=NumberField.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"NumberField.js","sources":["../../../lib/molecules/Forms/NumberField.tsx"],"sourcesContent":["import clsx from 'clsx';\n\nimport { type ChangeEvent, useId } from 'react';\n\nimport { useValue } from '@/hooks/useValue.js';\nimport { Button } from '../Buttons/Button';\nimport { FormControl, type FormControlProps } from './FormControl.js';\n\ninterface NumberFieldProps extends FormControlProps<number> {\n min?: number;\n max?: number;\n}\n\nconst INPUT_STYLE = { width: '28px', height: '28px' };\n\nexport function useNumberField(props: NumberFieldProps) {\n const internalId = useId();\n\n const {\n id = internalId,\n name = id,\n value: initialValue = 0,\n onChange,\n min = 0,\n max = 10,\n disabled = false,\n dataTestId = 'NumberField',\n ...rest\n } = props;\n\n const { value, setValue } = useValue<number, string | number | boolean>({\n name: name!,\n defaultValue: initialValue,\n formatter: Number,\n onChange,\n });\n\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n const newValue = Number(e.target.value);\n\n if (newValue >= min && newValue <= max) {\n setValue(Number(newValue));\n }\n };\n\n const increase = () => {\n if (value < max) {\n setValue(value + 1);\n }\n };\n\n const decrease = () => {\n if (value > min) {\n setValue(value - 1);\n }\n };\n\n return {\n ...rest,\n id,\n min,\n max,\n name,\n value,\n dataTestId,\n disabled,\n handleChange,\n increase,\n decrease,\n };\n}\n\nexport const NumberField = (props: NumberFieldProps) => {\n const {\n disabled,\n min,\n max,\n label,\n description,\n id,\n dataTestId,\n value,\n handleChange,\n increase,\n decrease,\n errorMessage,\n validationStatus,\n hideRequiredStar,\n required,\n ...rest\n } = useNumberField(props);\n\n return (\n <FormControl\n id={id}\n label={label}\n description={description}\n className={clsx('flex items-center justify-between', props.className)}\n dataName=\"NumberField\"\n dataTestId={dataTestId}\n errorMessage={errorMessage}\n validationStatus={validationStatus}\n disabled={disabled}\n required={required}\n hideRequiredStar={hideRequiredStar}\n layout=\"vertical\"\n >\n <div className=\"flex items-center gap-x-8\">\n <Button\n onClick={decrease}\n variant=\"circle\"\n disabled={value <= min || disabled}\n icon=\"MinusDefault\"\n aria-label=\"Decrease\"\n data-testid={`${dataTestId}-decrease`}\n />\n <input\n {...rest}\n className={clsx('text-b2 text-center font-normal outline-none', {\n 'bg-pearl text-grey': disabled,\n })}\n style={INPUT_STYLE}\n type=\"number\"\n id={id}\n onChange={handleChange}\n disabled={disabled}\n required={required}\n value={value}\n min={min}\n max={max}\n />\n <Button\n onClick={increase}\n variant=\"circle\"\n aria-label=\"Increase\"\n disabled={value >= max || disabled}\n icon=\"PlusDefault\"\n data-testid={`${dataTestId}-increase`}\n />\n </div>\n </FormControl>\n );\n};\n"],"names":["INPUT_STYLE","useNumberField","props","internalId","useId","id","name","initialValue","onChange","min","max","disabled","dataTestId","rest","value","setValue","useValue","e","newValue","NumberField","label","description","handleChange","increase","decrease","errorMessage","validationStatus","hideRequiredStar","required","jsx","FormControl","clsx","jsxs","Button"],"mappings":"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"}
1
+ {"version":3,"file":"NumberField.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,7 +1 @@
1
- import { FormControlProps } from '../FormControl';
2
- import { ValidationMessage } from './ValidationMessage';
3
- export interface PasswordProps<Value> extends FormControlProps<Value> {
4
- validationMessages?: ValidationMessage[];
5
- withoutFieldValidation?: boolean;
6
- }
7
- export declare function Password<Value = string>(props: PasswordProps<Value>): import("react/jsx-runtime").JSX.Element;
1
+ export * from '../../../ui/forms/password/Password';
@@ -1,115 +1,5 @@
1
- import { jsxs as c, jsx as a } from "react/jsx-runtime";
2
- import { useInternalStatus as M } from "../../../hooks/useInternalStatus.js";
3
- import { c as f } from "../../../chunks/clsx.js";
4
- import { useId as P, useState as T, useEffect as q } from "react";
5
- import { useValue as F } from "../../../hooks/useValue.js";
6
- import { FormControl as z } from "../FormControl.js";
7
- import { Icon as p } from "@clubmed/trident-icons";
8
- import { ValidationMessage as E } from "./ValidationMessage.js";
9
- function O(b) {
10
- const x = P(), {
11
- id: l = x,
12
- name: o = l,
13
- label: g,
14
- value: h,
15
- disabled: t = !1,
16
- required: u = !1,
17
- hideRequiredStar: v,
18
- validationStatus: e = "default",
19
- errorMessage: w,
20
- validationMessages: m = [],
21
- withoutFieldValidation: s = !1,
22
- className: y,
23
- onChange: N,
24
- dataTestId: C = "Password",
25
- ...I
26
- } = b, i = M({
27
- isDisabled: t,
28
- validationStatus: e
29
- }), { value: S, setValue: V } = F({
30
- name: o,
31
- initialValue: h,
32
- onChange: N
33
- }), [r, n] = T("password");
34
- q(() => {
35
- n(t ? "password" : r);
36
- }, [r, t]);
37
- const k = () => n(r === "password" ? "text" : "password");
38
- return /* @__PURE__ */ c(
39
- z,
40
- {
41
- className: y,
42
- id: l,
43
- label: g,
44
- dataName: "Password",
45
- dataTestId: C,
46
- disabled: t,
47
- required: u,
48
- hideRequiredStar: v,
49
- validationStatus: s ? "default" : e,
50
- errorMessage: w,
51
- children: [
52
- /* @__PURE__ */ c("div", { className: "relative", children: [
53
- /* @__PURE__ */ a(
54
- "input",
55
- {
56
- ...I,
57
- id: l,
58
- name: o,
59
- type: r,
60
- value: S,
61
- disabled: t,
62
- required: u,
63
- onChange: (d) => V(d.target.value),
64
- className: f(
65
- "text-b3 rounded-pill w-full border ps-20 py-[11px] font-normal outline-none",
66
- {
67
- "border-lightGrey focus:border-black active:border-black pe-[52px]": (s || e === "default") && i !== "disabled",
68
- "bg-white text-black": i !== "disabled",
69
- "bg-pearl text-grey": i === "disabled",
70
- "pe-[84px]": !s && (e === "error" || e === "success"),
71
- "border-red": !s && e === "error",
72
- "border-green": !s && e === "success"
73
- }
74
- ),
75
- "aria-label": o
76
- }
77
- ),
78
- /* @__PURE__ */ a(
79
- "div",
80
- {
81
- className: f(
82
- "pointer-events-none absolute inset-0 flex items-center justify-between px-20 py-12"
83
- ),
84
- children: /* @__PURE__ */ c("span", { className: "ms-auto flex gap-x-8", children: [
85
- !s && e === "error" && /* @__PURE__ */ a(p, { name: "CrossDefault", color: "red", width: "24px" }),
86
- !s && e === "success" && /* @__PURE__ */ a(p, { name: "CheckDefault", color: "green", width: "24px" }),
87
- !t && /* @__PURE__ */ a(
88
- "button",
89
- {
90
- type: "button",
91
- className: "pointer-events-auto size-24 inline-flex",
92
- onClick: k,
93
- children: /* @__PURE__ */ a(
94
- p,
95
- {
96
- name: r === "password" ? "Invisible" : "Visible",
97
- width: "24px",
98
- type: "svg"
99
- }
100
- )
101
- }
102
- )
103
- ] })
104
- }
105
- )
106
- ] }),
107
- m.length > 0 && /* @__PURE__ */ a("div", { className: "flex flex-col gap-[10px] mt-8", children: m.map(({ label: d, status: j }, D) => /* @__PURE__ */ a(E, { label: d, status: j }, D)) })
108
- ]
109
- }
110
- );
111
- }
1
+ import { Password as s } from "../../../ui/forms/password/Password.js";
112
2
  export {
113
- O as Password
3
+ s as Password
114
4
  };
115
5
  //# sourceMappingURL=Password.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Password.js","sources":["../../../../lib/molecules/Forms/Password/Password.tsx"],"sourcesContent":["import { useInternalStatus } from '@/hooks/useInternalStatus';\nimport clsx from 'clsx';\n\nimport { type HTMLInputTypeAttribute, useEffect, useId, useState } from 'react';\n\nimport { useValue } from '@/hooks/useValue';\nimport { FormControl, type FormControlProps } from '../FormControl';\nimport { Icon } from '@clubmed/trident-icons';\nimport { ValidationMessage } from './ValidationMessage';\n\nexport interface PasswordProps<Value> extends FormControlProps<Value> {\n validationMessages?: ValidationMessage[];\n withoutFieldValidation?: boolean;\n}\n\nexport function Password<Value = string>(props: PasswordProps<Value>) {\n const internalId = useId();\n\n const {\n id = internalId,\n name = id,\n label,\n value: initialValue,\n disabled = false,\n required = false,\n hideRequiredStar,\n validationStatus = 'default',\n errorMessage,\n validationMessages = [],\n withoutFieldValidation = false,\n className,\n onChange,\n dataTestId = 'Password',\n ...rest\n } = props;\n\n const internalStatus = useInternalStatus({\n isDisabled: disabled,\n validationStatus,\n });\n\n const { value, setValue } = useValue<Value>({\n name,\n initialValue,\n onChange,\n });\n const [type, setType] = useState<HTMLInputTypeAttribute>('password');\n\n useEffect(() => {\n if (disabled) {\n setType('password');\n } else {\n setType(type);\n }\n }, [type, disabled]);\n\n const toggleType = () => setType(type === 'password' ? 'text' : 'password');\n\n return (\n <FormControl\n className={className}\n id={id}\n label={label}\n dataName=\"Password\"\n dataTestId={dataTestId}\n disabled={disabled}\n required={required}\n hideRequiredStar={hideRequiredStar}\n validationStatus={withoutFieldValidation ? 'default' : validationStatus}\n errorMessage={errorMessage}\n >\n <div className=\"relative\">\n <input\n {...rest}\n id={id}\n name={name}\n type={type}\n value={value as any}\n disabled={disabled}\n required={required}\n onChange={(e) => setValue(e.target.value as Value)}\n className={clsx(\n 'text-b3 rounded-pill w-full border ps-20 py-[11px] font-normal outline-none',\n {\n 'border-lightGrey focus:border-black active:border-black pe-[52px]':\n (withoutFieldValidation || validationStatus === 'default') &&\n internalStatus !== 'disabled',\n 'bg-white text-black': internalStatus !== 'disabled',\n 'bg-pearl text-grey': internalStatus === 'disabled',\n 'pe-[84px]':\n !withoutFieldValidation &&\n (validationStatus === 'error' || validationStatus === 'success'),\n 'border-red': !withoutFieldValidation && validationStatus === 'error',\n 'border-green': !withoutFieldValidation && validationStatus === 'success',\n },\n )}\n aria-label={name}\n />\n\n <div\n className={clsx(\n 'pointer-events-none absolute inset-0 flex items-center justify-between px-20 py-12',\n )}\n >\n <span className=\"ms-auto flex gap-x-8\">\n {!withoutFieldValidation && validationStatus === 'error' && (\n <Icon name=\"CrossDefault\" color=\"red\" width=\"24px\" />\n )}\n\n {!withoutFieldValidation && validationStatus === 'success' && (\n <Icon name=\"CheckDefault\" color=\"green\" width=\"24px\" />\n )}\n\n {!disabled && (\n <button\n type=\"button\"\n className=\"pointer-events-auto size-24 inline-flex\"\n onClick={toggleType}\n >\n <Icon\n name={type === 'password' ? 'Invisible' : 'Visible'}\n width=\"24px\"\n type=\"svg\"\n />\n </button>\n )}\n </span>\n </div>\n </div>\n\n {validationMessages.length > 0 && (\n <div className=\"flex flex-col gap-[10px] mt-8\">\n {validationMessages.map(({ label, status }, index) => (\n <ValidationMessage label={label} status={status} key={index} />\n ))}\n </div>\n )}\n </FormControl>\n );\n}\n"],"names":["Password","props","internalId","useId","id","name","label","initialValue","disabled","required","hideRequiredStar","validationStatus","errorMessage","validationMessages","withoutFieldValidation","className","onChange","dataTestId","rest","internalStatus","useInternalStatus","value","setValue","useValue","type","setType","useState","useEffect","toggleType","jsxs","FormControl","jsx","e","clsx","Icon","status","index","ValidationMessage"],"mappings":";;;;;;;;AAeO,SAASA,EAAyBC,GAA6B;AACpE,QAAMC,IAAaC,EAAA,GAEb;AAAA,IACJ,IAAAC,IAAKF;AAAA,IACL,MAAAG,IAAOD;AAAA,IACP,OAAAE;AAAA,IACA,OAAOC;AAAA,IACP,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW;AAAA,IACX,kBAAAC;AAAA,IACA,kBAAAC,IAAmB;AAAA,IACnB,cAAAC;AAAA,IACA,oBAAAC,IAAqB,CAAA;AAAA,IACrB,wBAAAC,IAAyB;AAAA,IACzB,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC,IAAa;AAAA,IACb,GAAGC;AAAA,EAAA,IACDjB,GAEEkB,IAAiBC,EAAkB;AAAA,IACvC,YAAYZ;AAAA,IACZ,kBAAAG;AAAA,EAAA,CACD,GAEK,EAAE,OAAAU,GAAO,UAAAC,EAAA,IAAaC,EAAgB;AAAA,IAC1C,MAAAlB;AAAA,IACA,cAAAE;AAAA,IACA,UAAAS;AAAA,EAAA,CACD,GACK,CAACQ,GAAMC,CAAO,IAAIC,EAAiC,UAAU;AAEnE,EAAAC,EAAU,MAAM;AACd,IACEF,EADEjB,IACM,aAEAgB,CAFU;AAAA,EAItB,GAAG,CAACA,GAAMhB,CAAQ,CAAC;AAEnB,QAAMoB,IAAa,MAAMH,EAAQD,MAAS,aAAa,SAAS,UAAU;AAE1E,SACE,gBAAAK;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAAf;AAAA,MACA,IAAAX;AAAA,MACA,OAAAE;AAAA,MACA,UAAS;AAAA,MACT,YAAAW;AAAA,MACA,UAAAT;AAAA,MACA,UAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,kBAAkBI,IAAyB,YAAYH;AAAA,MACvD,cAAAC;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAiB,EAAC,OAAA,EAAI,WAAU,YACb,UAAA;AAAA,UAAA,gBAAAE;AAAA,YAAC;AAAA,YAAA;AAAA,cACE,GAAGb;AAAA,cACJ,IAAAd;AAAA,cACA,MAAAC;AAAA,cACA,MAAAmB;AAAA,cACA,OAAAH;AAAA,cACA,UAAAb;AAAA,cACA,UAAAC;AAAA,cACA,UAAU,CAACuB,MAAMV,EAASU,EAAE,OAAO,KAAc;AAAA,cACjD,WAAWC;AAAA,gBACT;AAAA,gBACA;AAAA,kBACE,sEACGnB,KAA0BH,MAAqB,cAChDQ,MAAmB;AAAA,kBACrB,uBAAuBA,MAAmB;AAAA,kBAC1C,sBAAsBA,MAAmB;AAAA,kBACzC,aACE,CAACL,MACAH,MAAqB,WAAWA,MAAqB;AAAA,kBACxD,cAAc,CAACG,KAA0BH,MAAqB;AAAA,kBAC9D,gBAAgB,CAACG,KAA0BH,MAAqB;AAAA,gBAAA;AAAA,cAClE;AAAA,cAEF,cAAYN;AAAA,YAAA;AAAA,UAAA;AAAA,UAGd,gBAAA0B;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWE;AAAA,gBACT;AAAA,cAAA;AAAA,cAGF,UAAA,gBAAAJ,EAAC,QAAA,EAAK,WAAU,wBACb,UAAA;AAAA,gBAAA,CAACf,KAA0BH,MAAqB,WAC/C,gBAAAoB,EAACG,GAAA,EAAK,MAAK,gBAAe,OAAM,OAAM,OAAM,OAAA,CAAO;AAAA,gBAGpD,CAACpB,KAA0BH,MAAqB,aAC/C,gBAAAoB,EAACG,GAAA,EAAK,MAAK,gBAAe,OAAM,SAAQ,OAAM,OAAA,CAAO;AAAA,gBAGtD,CAAC1B,KACA,gBAAAuB;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAK;AAAA,oBACL,WAAU;AAAA,oBACV,SAASH;AAAA,oBAET,UAAA,gBAAAG;AAAA,sBAACG;AAAA,sBAAA;AAAA,wBACC,MAAMV,MAAS,aAAa,cAAc;AAAA,wBAC1C,OAAM;AAAA,wBACN,MAAK;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACP;AAAA,gBAAA;AAAA,cACF,EAAA,CAEJ;AAAA,YAAA;AAAA,UAAA;AAAA,QACF,GACF;AAAA,QAECX,EAAmB,SAAS,KAC3B,gBAAAkB,EAAC,SAAI,WAAU,iCACZ,UAAAlB,EAAmB,IAAI,CAAC,EAAE,OAAAP,GAAO,QAAA6B,EAAA,GAAUC,MAC1C,gBAAAL,EAACM,GAAA,EAAkB,OAAO/B,GAAO,QAAA6B,KAAqBC,CAAO,CAC9D,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}
1
+ {"version":3,"file":"Password.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,6 +1 @@
1
- import { ValidationStatus } from '../../../hooks/useInternalStatus';
2
- export interface ValidationMessage {
3
- label: string;
4
- status: ValidationStatus;
5
- }
6
- export declare function ValidationMessage({ label, status }: ValidationMessage): import("react/jsx-runtime").JSX.Element;
1
+ export * from '../../../ui/forms/password/ValidationMessage';
@@ -1,28 +1,5 @@
1
- import { jsxs as n, jsx as e } from "react/jsx-runtime";
2
- import { c as t } from "../../../chunks/clsx.js";
3
- import { Icon as s } from "@clubmed/trident-icons";
4
- const a = {
5
- default: {
6
- iconName: "Edit",
7
- iconColor: "middleGrey"
8
- },
9
- error: {
10
- iconName: "Error",
11
- iconColor: "red"
12
- },
13
- success: {
14
- iconName: "CheckDefault",
15
- iconColor: "green"
16
- }
17
- };
18
- function x({ label: r, status: c }) {
19
- const { iconName: i, iconColor: o } = a[c];
20
- return /* @__PURE__ */ n("div", { className: "flex gap-[6px] px-20 items-center", children: [
21
- /* @__PURE__ */ e(s, { name: i, width: "30px", color: o }),
22
- /* @__PURE__ */ e("span", { className: t("text-b3", `text-${o}`), children: r })
23
- ] });
24
- }
1
+ import { ValidationMessage as o } from "../../../ui/forms/password/ValidationMessage.js";
25
2
  export {
26
- x as ValidationMessage
3
+ o as ValidationMessage
27
4
  };
28
5
  //# sourceMappingURL=ValidationMessage.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ValidationMessage.js","sources":["../../../../lib/molecules/Forms/Password/ValidationMessage.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { Icon } from '@clubmed/trident-icons';\nimport type { ValidationStatus } from '@/hooks/useInternalStatus';\n\nexport interface ValidationMessage {\n label: string;\n status: ValidationStatus;\n}\n\nconst ICON_PROPS = {\n default: {\n iconName: 'Edit',\n iconColor: 'middleGrey',\n },\n error: {\n iconName: 'Error',\n iconColor: 'red',\n },\n success: {\n iconName: 'CheckDefault',\n iconColor: 'green',\n },\n};\n\nexport function ValidationMessage({ label, status }: ValidationMessage) {\n const { iconName, iconColor } = ICON_PROPS[status];\n\n return (\n <div className=\"flex gap-[6px] px-20 items-center\">\n <Icon name={iconName} width=\"30px\" color={iconColor} />\n <span className={clsx('text-b3', `text-${iconColor}`)}>{label}</span>\n </div>\n );\n}\n"],"names":["ICON_PROPS","ValidationMessage","label","status","iconName","iconColor","jsxs","jsx","Icon","clsx"],"mappings":";;;AASA,MAAMA,IAAa;AAAA,EACjB,SAAS;AAAA,IACP,UAAU;AAAA,IACV,WAAW;AAAA,EAAA;AAAA,EAEb,OAAO;AAAA,IACL,UAAU;AAAA,IACV,WAAW;AAAA,EAAA;AAAA,EAEb,SAAS;AAAA,IACP,UAAU;AAAA,IACV,WAAW;AAAA,EAAA;AAEf;AAEO,SAASC,EAAkB,EAAE,OAAAC,GAAO,QAAAC,KAA6B;AACtE,QAAM,EAAE,UAAAC,GAAU,WAAAC,MAAcL,EAAWG,CAAM;AAEjD,SACE,gBAAAG,EAAC,OAAA,EAAI,WAAU,qCACb,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAK,MAAMJ,GAAU,OAAM,QAAO,OAAOC,GAAW;AAAA,IACrD,gBAAAE,EAAC,UAAK,WAAWE,EAAK,WAAW,QAAQJ,CAAS,EAAE,GAAI,UAAAH,EAAA,CAAM;AAAA,EAAA,GAChE;AAEJ;"}
1
+ {"version":3,"file":"ValidationMessage.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,2 +1,2 @@
1
- export * from './Password.js';
2
- export * from './ValidationMessage.js';
1
+ export * from './Password';
2
+ export * from './ValidationMessage';
@@ -1,5 +1,5 @@
1
- import { Password as a } from "./Password.js";
2
- import { ValidationMessage as s } from "./ValidationMessage.js";
1
+ import { Password as a } from "../../../ui/forms/password/Password.js";
2
+ import { ValidationMessage as s } from "../../../ui/forms/password/ValidationMessage.js";
3
3
  export {
4
4
  a as Password,
5
5
  s as ValidationMessage
@@ -1,17 +1 @@
1
- import { InputHTMLAttributes } from 'react';
2
- export interface RadioProps<Value = string> extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange'> {
3
- /**
4
- * The data-testid to apply to the button.
5
- * This is used for testing purposes.
6
- * */
7
- dataTestId?: string;
8
- /**
9
- * The diameter of the radio button.
10
- * */
11
- size?: number;
12
- onChange?: (name: string, value: Value | null) => void;
13
- }
14
- export declare function Radio<Value = string>(props: RadioProps<Value>): import("react/jsx-runtime").JSX.Element;
15
- export declare namespace Radio {
16
- var displayName: string;
17
- }
1
+ export * from '../../../ui/forms/radios/Radio';
@@ -1,63 +1,5 @@
1
- import { jsxs as r, jsx as e } from "react/jsx-runtime";
2
- import { c as C } from "../../../chunks/clsx.js";
3
- import { useId as N } from "react";
4
- import { useValue as b } from "../../../hooks/useValue.js";
5
- /* empty css */
6
- function k(d) {
7
- const n = N(), {
8
- id: o = n,
9
- name: l = o,
10
- className: c,
11
- dataTestId: h,
12
- disabled: a,
13
- checked: m = !1,
14
- value: i,
15
- size: t = 24,
16
- tabIndex: f = 0,
17
- children: p,
18
- onChange: u,
19
- ...v
20
- } = d, { value: s, setValue: x } = b({
21
- name: l,
22
- initialValue: m,
23
- onChange(g, y) {
24
- u?.(g, i !== void 0 ? i : y);
25
- }
26
- });
27
- return /* @__PURE__ */ r(
28
- "label",
29
- {
30
- className: C(c, "relative flex items-center gap-8", {
31
- "text-grey": a
32
- }),
33
- children: [
34
- /* @__PURE__ */ r("span", { className: "relative", children: [
35
- /* @__PURE__ */ e(
36
- "input",
37
- {
38
- ...v,
39
- name: l,
40
- "data-testid": h,
41
- type: "radio",
42
- tabIndex: f,
43
- onChange: () => {
44
- a || x(!s);
45
- },
46
- defaultChecked: s,
47
- "data-name": "Radio",
48
- disabled: a,
49
- value: i
50
- }
51
- ),
52
- /* @__PURE__ */ e("span", { style: { height: t, width: t }, children: /* @__PURE__ */ e("svg", { viewBox: "0 0 16 16", width: t * 2 / 3, className: "overflow-visible", children: /* @__PURE__ */ e("circle", { cx: "8", cy: "8", r: "8px", style: { fill: "hsl(var(--color-saffron))" } }) }) })
53
- ] }),
54
- p
55
- ]
56
- }
57
- );
58
- }
59
- k.displayName = "Radio";
1
+ import { Radio as a } from "../../../ui/forms/radios/Radio.js";
60
2
  export {
61
- k as Radio
3
+ a as Radio
62
4
  };
63
5
  //# sourceMappingURL=Radio.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Radio.js","sources":["../../../../lib/molecules/Forms/Radios/Radio.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { type InputHTMLAttributes, useId } from 'react';\nimport { useValue } from '@/hooks/useValue.js';\nimport '../controls.css';\n\nexport interface RadioProps<Value = string>\n extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange'> {\n /**\n * The data-testid to apply to the button.\n * This is used for testing purposes.\n * */\n dataTestId?: string;\n /**\n * The diameter of the radio button.\n * */\n size?: number;\n\n onChange?: (name: string, value: Value | null) => void;\n}\n\nexport function Radio<Value = string>(props: RadioProps<Value>) {\n const internalId = useId();\n\n const {\n id = internalId,\n name = id,\n className,\n dataTestId,\n disabled,\n checked: initialChecked = false,\n value,\n size = 24,\n tabIndex = 0,\n children,\n onChange,\n ...rest\n } = props;\n\n const { value: checked, setValue } = useValue<boolean>({\n name,\n initialValue: initialChecked,\n onChange(name, checked) {\n onChange?.(name, (value !== undefined ? value : checked) as Value);\n },\n });\n\n return (\n <label\n className={clsx(className, 'relative flex items-center gap-8', {\n 'text-grey': disabled,\n })}\n >\n <span className=\"relative\">\n <input\n {...rest}\n name={name}\n data-testid={dataTestId}\n type=\"radio\"\n tabIndex={tabIndex}\n onChange={() => {\n if (!disabled) {\n setValue(!checked);\n }\n }}\n defaultChecked={checked}\n data-name=\"Radio\"\n disabled={disabled}\n value={value}\n />\n\n <span style={{ height: size, width: size }}>\n <svg viewBox=\"0 0 16 16\" width={(size * 2) / 3} className=\"overflow-visible\">\n <circle cx=\"8\" cy=\"8\" r=\"8px\" style={{ fill: 'hsl(var(--color-saffron))' }} />\n </svg>\n </span>\n </span>\n\n {children}\n </label>\n );\n}\n\nRadio.displayName = 'Radio';\n"],"names":["Radio","props","internalId","useId","id","name","className","dataTestId","disabled","initialChecked","value","size","tabIndex","children","onChange","rest","checked","setValue","useValue","jsxs","clsx","jsx"],"mappings":";;;;;AAoBO,SAASA,EAAsBC,GAA0B;AAC9D,QAAMC,IAAaC,EAAA,GAEb;AAAA,IACJ,IAAAC,IAAKF;AAAA,IACL,MAAAG,IAAOD;AAAA,IACP,WAAAE;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,SAASC,IAAiB;AAAA,IAC1B,OAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,UAAAC,IAAW;AAAA,IACX,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDd,GAEE,EAAE,OAAOe,GAAS,UAAAC,EAAA,IAAaC,EAAkB;AAAA,IACrD,MAAAb;AAAA,IACA,cAAcI;AAAA,IACd,SAASJ,GAAMW,GAAS;AACtB,MAAAF,IAAWT,GAAOK,MAAU,SAAYA,IAAQM,CAAiB;AAAA,IACnE;AAAA,EAAA,CACD;AAED,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKd,GAAW,oCAAoC;AAAA,QAC7D,aAAaE;AAAA,MAAA,CACd;AAAA,MAED,UAAA;AAAA,QAAA,gBAAAW,EAAC,QAAA,EAAK,WAAU,YACd,UAAA;AAAA,UAAA,gBAAAE;AAAA,YAAC;AAAA,YAAA;AAAA,cACE,GAAGN;AAAA,cACJ,MAAAV;AAAA,cACA,eAAaE;AAAA,cACb,MAAK;AAAA,cACL,UAAAK;AAAA,cACA,UAAU,MAAM;AACd,gBAAKJ,KACHS,EAAS,CAACD,CAAO;AAAA,cAErB;AAAA,cACA,gBAAgBA;AAAA,cAChB,aAAU;AAAA,cACV,UAAAR;AAAA,cACA,OAAAE;AAAA,YAAA;AAAA,UAAA;AAAA,UAGF,gBAAAW,EAAC,QAAA,EAAK,OAAO,EAAE,QAAQV,GAAM,OAAOA,EAAA,GAClC,UAAA,gBAAAU,EAAC,OAAA,EAAI,SAAQ,aAAY,OAAQV,IAAO,IAAK,GAAG,WAAU,oBACxD,UAAA,gBAAAU,EAAC,UAAA,EAAO,IAAG,KAAI,IAAG,KAAI,GAAE,OAAM,OAAO,EAAE,MAAM,4BAAA,EAA4B,CAAG,GAC9E,EAAA,CACF;AAAA,QAAA,GACF;AAAA,QAECR;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;AAEAb,EAAM,cAAc;"}
1
+ {"version":3,"file":"Radio.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,5 +1 @@
1
- import { HTMLAttributes } from 'react';
2
- import { FormControlProps } from '../FormControl.js';
3
- export interface RadioGroupProps<Value = string> extends Pick<FormControlProps<Value>, 'id' | 'name' | 'value' | 'onChange' | 'disabled' | 'readOnly' | 'tabIndex' | 'description' | 'validationStatus' | 'errorMessage'>, Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
4
- }
5
- export declare function RadioGroup<Value = string>(props: RadioGroupProps<Value>): import("react/jsx-runtime").JSX.Element;
1
+ export * from '../../../ui/forms/radios/RadioGroup';
@@ -1,76 +1,5 @@
1
- import { jsx as N } from "react/jsx-runtime";
2
- import { useId as O, Children as V, isValidElement as W, cloneElement as y } from "react";
3
- import { useValue as _ } from "../../../hooks/useValue.js";
4
- import { c as h } from "../../../chunks/clsx.js";
5
- import { KEY as r } from "../../../hooks/keyboard.constants.js";
6
- function x(k) {
7
- const R = O(), {
8
- id: s = R,
9
- name: u = s,
10
- children: g,
11
- value: v,
12
- defaultValue: I,
13
- onChange: E,
14
- disabled: p,
15
- readOnly: c,
16
- tabIndex: b = 0,
17
- ...m
18
- } = k, { value: a, setValue: i } = _({
19
- name: u,
20
- initialValue: v,
21
- defaultValue: I,
22
- onChange: E
23
- }), A = (e, o) => {
24
- let n = o;
25
- const t = e.target.parentNode.querySelectorAll('[role="radio"]');
26
- if (e.key === r.ARROW_RIGHT || e.key === r.ARROW_DOWN)
27
- n = (o + 1) % t.length, t[n]?.focus();
28
- else if (e.key === r.ARROW_LEFT || e.key === r.ARROW_UP)
29
- n = (o - 1 + t.length) % t.length, t[n]?.focus();
30
- else if (e.key === r.SPACE || e.key === r.ENTER) {
31
- i(t[o].dataset.value);
32
- return;
33
- }
34
- };
35
- function d(e, o) {
36
- return a == null || a === "" ? b === o ? 0 : -1 : e ? 0 : -1;
37
- }
38
- return /* @__PURE__ */ N("div", { ...m, className: h("flex gap-12", m.className), role: "radiogroup", children: V.map(g, (e, o) => {
39
- if (!W(e))
40
- return e;
41
- const n = e.type.displayName, t = e.props.value, l = a === t;
42
- return n?.includes("Button") ? y(e, {
43
- color: l ? "black" : "white",
44
- ...e.props,
45
- value: void 0,
46
- role: "radio",
47
- name: u,
48
- component: "span",
49
- id: `${s}-${o}`,
50
- disabled: p,
51
- readOnly: c,
52
- tabIndex: d(l, o),
53
- "data-value": t,
54
- "aria-checked": a === t,
55
- onKeyDown: (f) => A(f, o),
56
- onClick() {
57
- i(t), e.props?.onClick?.(t);
58
- }
59
- }) : y(e, {
60
- ...e.props,
61
- name: u,
62
- id: `${s}-${o}`,
63
- disabled: p,
64
- readOnly: c,
65
- tabIndex: d(l, o),
66
- checked: l,
67
- onChange(f, C) {
68
- i(C);
69
- }
70
- });
71
- }) });
72
- }
1
+ import { RadioGroup as p } from "../../../ui/forms/radios/RadioGroup.js";
73
2
  export {
74
- x as RadioGroup
3
+ p as RadioGroup
75
4
  };
76
5
  //# sourceMappingURL=RadioGroup.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"RadioGroup.js","sources":["../../../../lib/molecules/Forms/Radios/RadioGroup.tsx"],"sourcesContent":["import {\n Children,\n cloneElement,\n type HTMLAttributes,\n isValidElement,\n useId,\n type ReactElement,\n} from 'react';\nimport type { FormControlProps } from '@/molecules/Forms/FormControl.js';\nimport type { RadioProps } from '@/molecules/Forms/Radios/Radio.js';\nimport { useValue } from '@/hooks/useValue.js';\nimport clsx from 'clsx';\nimport type { ButtonProps } from '@/molecules/Buttons/v2/Button';\nimport { KEY } from '@/hooks/keyboard.constants';\n\nexport interface RadioGroupProps<Value = string>\n extends Pick<\n FormControlProps<Value>,\n | 'id'\n | 'name'\n | 'value'\n | 'onChange'\n | 'disabled'\n | 'readOnly'\n | 'tabIndex'\n | 'description'\n | 'validationStatus'\n | 'errorMessage'\n >,\n Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {}\n\nexport function RadioGroup<Value = string>(props: RadioGroupProps<Value>) {\n const internalId = useId();\n\n const {\n id = internalId,\n name = id,\n children,\n value: initialValue,\n defaultValue,\n onChange,\n disabled,\n readOnly,\n tabIndex = 0,\n ...rest\n } = props;\n\n const { value, setValue } = useValue<Value>({\n name,\n initialValue,\n defaultValue: defaultValue as Value,\n onChange,\n });\n\n const handleKeyDown = (e: KeyboardEvent, index: number) => {\n let newIndex = index;\n const options = (e.target as any)!.parentNode!.querySelectorAll('[role=\"radio\"]');\n\n if (e.key === KEY.ARROW_RIGHT || e.key === KEY.ARROW_DOWN) {\n newIndex = (index + 1) % options.length;\n options[newIndex]?.focus();\n } else if (e.key === KEY.ARROW_LEFT || e.key === KEY.ARROW_UP) {\n newIndex = (index - 1 + options.length) % options.length;\n options[newIndex]?.focus();\n } else if (e.key === KEY.SPACE || e.key === KEY.ENTER) {\n setValue(options[index].dataset.value as Value);\n return;\n }\n };\n\n function getTabIndex(checked: boolean, index: number) {\n if (value === undefined || value === null || value === '') {\n return tabIndex === index ? 0 : -1;\n }\n\n return checked ? 0 : -1;\n }\n\n return (\n <div {...rest} className={clsx('flex gap-12', rest.className)} role=\"radiogroup\">\n {Children.map(children, (child, index) => {\n if (!isValidElement(child)) {\n return child;\n }\n\n const type = (child.type as unknown as ReactElement & { displayName?: string }).displayName;\n const itemValue = (child.props as ButtonProps | RadioProps).value;\n const checked = value === itemValue;\n\n if (type?.includes('Button')) {\n return cloneElement(child, {\n color: checked ? 'black' : 'white',\n ...child.props,\n value: undefined,\n role: 'radio',\n name,\n component: 'span',\n id: `${id}-${index}`,\n disabled,\n readOnly,\n tabIndex: getTabIndex(checked, index),\n 'data-value': itemValue,\n 'aria-checked': value === itemValue,\n onKeyDown: (e: KeyboardEvent) => handleKeyDown(e, index),\n onClick() {\n setValue(itemValue as Value);\n child.props?.onClick?.(itemValue as Value);\n },\n } as ButtonProps);\n }\n\n return cloneElement(child, {\n ...child.props,\n name,\n id: `${id}-${index}`,\n disabled,\n readOnly,\n tabIndex: getTabIndex(checked, index),\n checked: checked,\n onChange(_: string, value: Value) {\n setValue(value);\n },\n } as RadioProps<Value>);\n })}\n </div>\n );\n}\n"],"names":["RadioGroup","props","internalId","useId","id","name","children","initialValue","defaultValue","onChange","disabled","readOnly","tabIndex","rest","value","setValue","useValue","handleKeyDown","index","newIndex","options","KEY","getTabIndex","checked","clsx","Children","child","isValidElement","type","itemValue","cloneElement","e","_"],"mappings":";;;;;AA+BO,SAASA,EAA2BC,GAA+B;AACxE,QAAMC,IAAaC,EAAA,GAEb;AAAA,IACJ,IAAAC,IAAKF;AAAA,IACL,MAAAG,IAAOD;AAAA,IACP,UAAAE;AAAA,IACA,OAAOC;AAAA,IACP,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,GAAGC;AAAA,EAAA,IACDZ,GAEE,EAAE,OAAAa,GAAO,UAAAC,EAAA,IAAaC,EAAgB;AAAA,IAC1C,MAAAX;AAAA,IACA,cAAAE;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,EAAA,CACD,GAEKQ,IAAgB,CAAC,GAAkBC,MAAkB;AACzD,QAAIC,IAAWD;AACf,UAAME,IAAW,EAAE,OAAgB,WAAY,iBAAiB,gBAAgB;AAEhF,QAAI,EAAE,QAAQC,EAAI,eAAe,EAAE,QAAQA,EAAI;AAC7C,MAAAF,KAAYD,IAAQ,KAAKE,EAAQ,QACjCA,EAAQD,CAAQ,GAAG,MAAA;AAAA,aACV,EAAE,QAAQE,EAAI,cAAc,EAAE,QAAQA,EAAI;AACnD,MAAAF,KAAYD,IAAQ,IAAIE,EAAQ,UAAUA,EAAQ,QAClDA,EAAQD,CAAQ,GAAG,MAAA;AAAA,aACV,EAAE,QAAQE,EAAI,SAAS,EAAE,QAAQA,EAAI,OAAO;AACrD,MAAAN,EAASK,EAAQF,CAAK,EAAE,QAAQ,KAAc;AAC9C;AAAA,IACF;AAAA,EACF;AAEA,WAASI,EAAYC,GAAkBL,GAAe;AACpD,WAA2BJ,KAAU,QAAQA,MAAU,KAC9CF,MAAaM,IAAQ,IAAI,KAG3BK,IAAU,IAAI;AAAA,EACvB;AAEA,2BACG,OAAA,EAAK,GAAGV,GAAM,WAAWW,EAAK,eAAeX,EAAK,SAAS,GAAG,MAAK,cACjE,UAAAY,EAAS,IAAInB,GAAU,CAACoB,GAAOR,MAAU;AACxC,QAAI,CAACS,EAAeD,CAAK;AACvB,aAAOA;AAGT,UAAME,IAAQF,EAAM,KAA4D,aAC1EG,IAAaH,EAAM,MAAmC,OACtDH,IAAUT,MAAUe;AAE1B,WAAID,GAAM,SAAS,QAAQ,IAClBE,EAAaJ,GAAO;AAAA,MACzB,OAAOH,IAAU,UAAU;AAAA,MAC3B,GAAGG,EAAM;AAAA,MACT,OAAO;AAAA,MACP,MAAM;AAAA,MACN,MAAArB;AAAA,MACA,WAAW;AAAA,MACX,IAAI,GAAGD,CAAE,IAAIc,CAAK;AAAA,MAClB,UAAAR;AAAA,MACA,UAAAC;AAAA,MACA,UAAUW,EAAYC,GAASL,CAAK;AAAA,MACpC,cAAcW;AAAA,MACd,gBAAgBf,MAAUe;AAAA,MAC1B,WAAW,CAACE,MAAqBd,EAAcc,GAAGb,CAAK;AAAA,MACvD,UAAU;AACR,QAAAH,EAASc,CAAkB,GAC3BH,EAAM,OAAO,UAAUG,CAAkB;AAAA,MAC3C;AAAA,IAAA,CACc,IAGXC,EAAaJ,GAAO;AAAA,MACzB,GAAGA,EAAM;AAAA,MACT,MAAArB;AAAA,MACA,IAAI,GAAGD,CAAE,IAAIc,CAAK;AAAA,MAClB,UAAAR;AAAA,MACA,UAAAC;AAAA,MACA,UAAUW,EAAYC,GAASL,CAAK;AAAA,MACpC,SAAAK;AAAA,MACA,SAASS,GAAWlB,GAAc;AAChC,QAAAC,EAASD,CAAK;AAAA,MAChB;AAAA,IAAA,CACoB;AAAA,EACxB,CAAC,EAAA,CACH;AAEJ;"}
1
+ {"version":3,"file":"RadioGroup.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,2 +1,2 @@
1
- export * from './RadioGroup.js';
2
- export * from './Radio.js';
1
+ export * from '../../../ui/forms/radios/Radio';
2
+ export * from '../../../ui/forms/radios/RadioGroup';
@@ -1,7 +1,7 @@
1
- import { RadioGroup as p } from "./RadioGroup.js";
2
- import { Radio as d } from "./Radio.js";
1
+ import { Radio as p } from "../../../ui/forms/radios/Radio.js";
2
+ import { RadioGroup as d } from "../../../ui/forms/radios/RadioGroup.js";
3
3
  export {
4
- d as Radio,
5
- p as RadioGroup
4
+ p as Radio,
5
+ d as RadioGroup
6
6
  };
7
7
  //# sourceMappingURL=index.js.map
@@ -1,40 +1 @@
1
- import { InputHTMLAttributes } from 'react';
2
- interface RangeProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange'> {
3
- /**
4
- * Aria label
5
- * @default 'Range'
6
- * */
7
- ariaLabel?: string;
8
- /**
9
- * Additional class names
10
- * */
11
- className?: string;
12
- /**
13
- * Data test id
14
- * */
15
- dataTestId?: string;
16
- /**
17
- * Single cursor mode
18
- * @default false
19
- * */
20
- singleCursorMode?: boolean;
21
- /**
22
- * Min value
23
- * @default 0
24
- * */
25
- min?: number;
26
- /**
27
- * On change
28
- * */
29
- onChange?: (name: string, value: number[]) => void;
30
- /**
31
- * Options
32
- * @default []
33
- * */
34
- options: {
35
- value: number;
36
- label: string;
37
- }[];
38
- }
39
- export declare const Range: (props: RangeProps) => import("react/jsx-runtime").JSX.Element;
40
- export {};
1
+ export * from '../../ui/forms/Range';