@dxc-technology/halstack-react 0.0.0-efa7c74 → 0.0.0-eff2879

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 (434) hide show
  1. package/BackgroundColorContext.d.ts +1 -0
  2. package/BackgroundColorContext.js +6 -26
  3. package/HalstackContext.d.ts +1248 -0
  4. package/HalstackContext.js +310 -0
  5. package/README.md +47 -0
  6. package/accordion/Accordion.accessibility.test.js +71 -0
  7. package/accordion/Accordion.d.ts +1 -1
  8. package/accordion/Accordion.js +106 -193
  9. package/accordion/Accordion.stories.tsx +251 -0
  10. package/accordion/Accordion.test.js +56 -0
  11. package/accordion/types.d.ts +12 -23
  12. package/accordion-group/AccordionGroup.accessibility.test.js +88 -0
  13. package/accordion-group/AccordionGroup.d.ts +3 -3
  14. package/accordion-group/AccordionGroup.js +39 -108
  15. package/accordion-group/AccordionGroup.stories.tsx +252 -0
  16. package/accordion-group/AccordionGroup.test.js +98 -0
  17. package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
  18. package/accordion-group/AccordionGroupAccordion.js +31 -0
  19. package/accordion-group/AccordionGroupContext.d.ts +3 -0
  20. package/accordion-group/AccordionGroupContext.js +8 -0
  21. package/accordion-group/types.d.ts +18 -23
  22. package/action-icon/ActionIcon.accessibility.test.js +63 -0
  23. package/action-icon/ActionIcon.d.ts +4 -0
  24. package/action-icon/ActionIcon.js +48 -0
  25. package/action-icon/ActionIcon.stories.tsx +41 -0
  26. package/action-icon/ActionIcon.test.js +64 -0
  27. package/action-icon/types.d.ts +26 -0
  28. package/alert/Alert.accessibility.test.js +95 -0
  29. package/alert/Alert.js +36 -126
  30. package/alert/Alert.stories.tsx +28 -0
  31. package/alert/Alert.test.js +75 -0
  32. package/alert/types.d.ts +5 -5
  33. package/badge/Badge.accessibility.test.js +129 -0
  34. package/badge/Badge.d.ts +4 -0
  35. package/badge/Badge.js +142 -40
  36. package/badge/Badge.stories.tsx +210 -0
  37. package/badge/Badge.test.js +30 -0
  38. package/badge/types.d.ts +54 -0
  39. package/bleed/Bleed.d.ts +3 -0
  40. package/bleed/Bleed.js +43 -0
  41. package/bleed/Bleed.stories.tsx +342 -0
  42. package/bleed/types.d.ts +37 -0
  43. package/box/Box.accessibility.test.js +33 -0
  44. package/box/Box.d.ts +1 -1
  45. package/box/Box.js +31 -82
  46. package/box/Box.stories.tsx +38 -51
  47. package/box/Box.test.js +13 -0
  48. package/box/types.d.ts +3 -14
  49. package/bulleted-list/BulletedList.accessibility.test.js +107 -0
  50. package/bulleted-list/BulletedList.d.ts +7 -0
  51. package/bulleted-list/BulletedList.js +92 -0
  52. package/bulleted-list/BulletedList.stories.tsx +115 -0
  53. package/bulleted-list/types.d.ts +38 -0
  54. package/bulleted-list/types.js +5 -0
  55. package/button/Button.accessibility.test.js +127 -0
  56. package/button/Button.d.ts +1 -1
  57. package/button/Button.js +65 -123
  58. package/button/Button.stories.tsx +155 -106
  59. package/button/Button.test.js +38 -0
  60. package/button/types.d.ts +12 -12
  61. package/card/Card.accessibility.test.js +36 -0
  62. package/card/Card.d.ts +1 -1
  63. package/card/Card.js +59 -103
  64. package/card/Card.stories.tsx +13 -43
  65. package/card/Card.test.js +39 -0
  66. package/card/types.d.ts +6 -11
  67. package/checkbox/Checkbox.accessibility.test.js +87 -0
  68. package/checkbox/Checkbox.d.ts +2 -2
  69. package/checkbox/Checkbox.js +145 -183
  70. package/checkbox/Checkbox.stories.tsx +166 -136
  71. package/checkbox/Checkbox.test.js +199 -0
  72. package/checkbox/types.d.ts +19 -7
  73. package/chip/Chip.accessibility.test.js +67 -0
  74. package/chip/Chip.d.ts +4 -0
  75. package/chip/Chip.js +49 -146
  76. package/chip/Chip.stories.tsx +104 -30
  77. package/chip/Chip.test.js +41 -0
  78. package/chip/types.d.ts +45 -0
  79. package/chip/types.js +5 -0
  80. package/common/coreTokens.d.ts +237 -0
  81. package/common/coreTokens.js +184 -0
  82. package/common/utils.d.ts +1 -0
  83. package/common/utils.js +6 -12
  84. package/common/variables.d.ts +1394 -0
  85. package/common/variables.js +1035 -1346
  86. package/container/Container.d.ts +4 -0
  87. package/container/Container.js +194 -0
  88. package/container/Container.stories.tsx +214 -0
  89. package/container/types.d.ts +74 -0
  90. package/container/types.js +5 -0
  91. package/contextual-menu/ContextualMenu.accessibility.test.js +86 -0
  92. package/contextual-menu/ContextualMenu.d.ts +5 -0
  93. package/contextual-menu/ContextualMenu.js +88 -0
  94. package/contextual-menu/ContextualMenu.stories.tsx +219 -0
  95. package/contextual-menu/ContextualMenu.test.js +205 -0
  96. package/contextual-menu/GroupItem.d.ts +4 -0
  97. package/contextual-menu/GroupItem.js +67 -0
  98. package/contextual-menu/ItemAction.d.ts +4 -0
  99. package/contextual-menu/ItemAction.js +52 -0
  100. package/contextual-menu/MenuItem.d.ts +4 -0
  101. package/contextual-menu/MenuItem.js +29 -0
  102. package/contextual-menu/SingleItem.d.ts +4 -0
  103. package/contextual-menu/SingleItem.js +38 -0
  104. package/contextual-menu/types.d.ts +58 -0
  105. package/contextual-menu/types.js +5 -0
  106. package/date-input/Calendar.d.ts +4 -0
  107. package/date-input/Calendar.js +214 -0
  108. package/date-input/DateInput.accessibility.test.js +216 -0
  109. package/date-input/DateInput.js +174 -313
  110. package/date-input/DateInput.stories.tsx +203 -56
  111. package/date-input/DateInput.test.js +808 -0
  112. package/date-input/DatePicker.d.ts +4 -0
  113. package/date-input/DatePicker.js +121 -0
  114. package/date-input/YearPicker.d.ts +4 -0
  115. package/date-input/YearPicker.js +100 -0
  116. package/date-input/types.d.ts +86 -22
  117. package/dialog/Dialog.accessibility.test.js +69 -0
  118. package/dialog/Dialog.d.ts +1 -1
  119. package/dialog/Dialog.js +57 -130
  120. package/dialog/Dialog.stories.tsx +320 -167
  121. package/dialog/Dialog.test.js +307 -0
  122. package/dialog/types.d.ts +18 -25
  123. package/divider/Divider.accessibility.test.js +33 -0
  124. package/divider/Divider.d.ts +4 -0
  125. package/divider/Divider.js +36 -0
  126. package/divider/Divider.stories.tsx +223 -0
  127. package/divider/Divider.test.js +38 -0
  128. package/divider/types.d.ts +21 -0
  129. package/divider/types.js +5 -0
  130. package/dropdown/Dropdown.accessibility.test.js +180 -0
  131. package/dropdown/Dropdown.d.ts +1 -1
  132. package/dropdown/Dropdown.js +232 -330
  133. package/dropdown/Dropdown.stories.tsx +427 -0
  134. package/dropdown/Dropdown.test.js +599 -0
  135. package/dropdown/DropdownMenu.d.ts +4 -0
  136. package/dropdown/DropdownMenu.js +63 -0
  137. package/dropdown/DropdownMenuItem.d.ts +4 -0
  138. package/dropdown/DropdownMenuItem.js +70 -0
  139. package/dropdown/types.d.ts +38 -31
  140. package/file-input/FileInput.accessibility.test.js +160 -0
  141. package/file-input/FileInput.d.ts +2 -2
  142. package/file-input/FileInput.js +272 -340
  143. package/file-input/FileInput.stories.tsx +618 -0
  144. package/file-input/FileInput.test.js +382 -0
  145. package/file-input/FileItem.d.ts +4 -14
  146. package/file-input/FileItem.js +60 -121
  147. package/file-input/types.d.ts +53 -11
  148. package/flex/Flex.d.ts +4 -0
  149. package/flex/Flex.js +57 -0
  150. package/flex/Flex.stories.tsx +112 -0
  151. package/flex/types.d.ts +97 -0
  152. package/flex/types.js +5 -0
  153. package/footer/Footer.accessibility.test.js +117 -0
  154. package/footer/Footer.d.ts +1 -1
  155. package/footer/Footer.js +74 -200
  156. package/footer/{Footer.stories.jsx → Footer.stories.tsx} +84 -39
  157. package/footer/Footer.test.js +85 -0
  158. package/footer/Icons.d.ts +3 -0
  159. package/footer/Icons.js +67 -8
  160. package/footer/types.d.ts +40 -37
  161. package/grid/Grid.d.ts +7 -0
  162. package/grid/Grid.js +76 -0
  163. package/grid/Grid.stories.tsx +219 -0
  164. package/grid/types.d.ts +115 -0
  165. package/grid/types.js +5 -0
  166. package/header/Header.accessibility.test.js +84 -0
  167. package/header/Header.d.ts +4 -3
  168. package/header/Header.js +103 -218
  169. package/header/Header.stories.tsx +152 -63
  170. package/header/Header.test.js +66 -0
  171. package/header/Icons.d.ts +2 -0
  172. package/header/Icons.js +4 -9
  173. package/header/types.d.ts +7 -21
  174. package/heading/Heading.accessibility.test.js +33 -0
  175. package/heading/Heading.js +11 -33
  176. package/heading/Heading.stories.tsx +3 -2
  177. package/heading/Heading.test.js +169 -0
  178. package/heading/types.d.ts +7 -7
  179. package/icon/Icon.accessibility.test.js +30 -0
  180. package/icon/Icon.d.ts +4 -0
  181. package/icon/Icon.js +33 -0
  182. package/icon/Icon.stories.tsx +28 -0
  183. package/icon/types.d.ts +4 -0
  184. package/icon/types.js +5 -0
  185. package/image/Image.accessibility.test.js +56 -0
  186. package/image/Image.d.ts +4 -0
  187. package/image/Image.js +70 -0
  188. package/image/Image.stories.tsx +129 -0
  189. package/image/types.d.ts +72 -0
  190. package/image/types.js +5 -0
  191. package/inset/Inset.d.ts +3 -0
  192. package/inset/Inset.js +43 -0
  193. package/inset/Inset.stories.tsx +230 -0
  194. package/inset/types.d.ts +37 -0
  195. package/inset/types.js +5 -0
  196. package/layout/ApplicationLayout.d.ts +20 -0
  197. package/layout/ApplicationLayout.js +86 -184
  198. package/layout/ApplicationLayout.stories.tsx +162 -0
  199. package/layout/Icons.d.ts +7 -0
  200. package/layout/Icons.js +41 -48
  201. package/layout/types.d.ts +41 -0
  202. package/layout/types.js +5 -0
  203. package/link/Link.accessibility.test.js +112 -0
  204. package/link/Link.d.ts +3 -2
  205. package/link/Link.js +65 -109
  206. package/link/Link.stories.tsx +159 -52
  207. package/link/Link.test.js +63 -0
  208. package/link/types.d.ts +15 -35
  209. package/main.d.ts +19 -14
  210. package/main.js +92 -98
  211. package/nav-tabs/NavTabs.accessibility.test.js +44 -0
  212. package/nav-tabs/NavTabs.d.ts +7 -0
  213. package/nav-tabs/NavTabs.js +93 -0
  214. package/nav-tabs/NavTabs.stories.tsx +279 -0
  215. package/nav-tabs/NavTabs.test.js +75 -0
  216. package/nav-tabs/NavTabsContext.d.ts +3 -0
  217. package/nav-tabs/NavTabsContext.js +8 -0
  218. package/nav-tabs/Tab.d.ts +4 -0
  219. package/nav-tabs/Tab.js +117 -0
  220. package/nav-tabs/types.d.ts +52 -0
  221. package/nav-tabs/types.js +5 -0
  222. package/number-input/NumberInput.accessibility.test.js +228 -0
  223. package/number-input/NumberInput.js +48 -48
  224. package/number-input/NumberInput.stories.tsx +44 -28
  225. package/number-input/NumberInput.test.js +989 -0
  226. package/number-input/NumberInputContext.d.ts +3 -4
  227. package/number-input/NumberInputContext.js +3 -14
  228. package/number-input/types.d.ts +34 -15
  229. package/package.json +52 -51
  230. package/paginator/Paginator.accessibility.test.js +79 -0
  231. package/paginator/Paginator.js +39 -103
  232. package/paginator/Paginator.stories.tsx +24 -0
  233. package/paginator/Paginator.test.js +335 -0
  234. package/paginator/types.d.ts +3 -3
  235. package/paragraph/Paragraph.accessibility.test.js +28 -0
  236. package/paragraph/Paragraph.d.ts +5 -0
  237. package/paragraph/Paragraph.js +22 -0
  238. package/paragraph/Paragraph.stories.tsx +27 -0
  239. package/password-input/PasswordInput.accessibility.test.js +153 -0
  240. package/password-input/PasswordInput.js +59 -125
  241. package/password-input/PasswordInput.stories.tsx +3 -35
  242. package/password-input/PasswordInput.test.js +198 -0
  243. package/password-input/types.d.ts +32 -26
  244. package/progress-bar/ProgressBar.accessibility.test.js +35 -0
  245. package/progress-bar/ProgressBar.js +66 -92
  246. package/progress-bar/ProgressBar.stories.tsx +93 -0
  247. package/progress-bar/ProgressBar.test.js +93 -0
  248. package/progress-bar/types.d.ts +3 -3
  249. package/quick-nav/QuickNav.accessibility.test.js +57 -0
  250. package/quick-nav/QuickNav.d.ts +4 -0
  251. package/quick-nav/QuickNav.js +94 -0
  252. package/quick-nav/QuickNav.stories.tsx +356 -0
  253. package/quick-nav/types.d.ts +21 -0
  254. package/quick-nav/types.js +5 -0
  255. package/radio-group/Radio.d.ts +4 -0
  256. package/radio-group/Radio.js +124 -0
  257. package/radio-group/RadioGroup.accessibility.test.js +97 -0
  258. package/radio-group/RadioGroup.d.ts +4 -0
  259. package/radio-group/RadioGroup.js +235 -0
  260. package/radio-group/RadioGroup.stories.tsx +214 -0
  261. package/radio-group/RadioGroup.test.js +756 -0
  262. package/radio-group/types.d.ts +114 -0
  263. package/radio-group/types.js +5 -0
  264. package/resultset-table/Icons.d.ts +7 -0
  265. package/resultset-table/Icons.js +47 -0
  266. package/resultset-table/ResultsetTable.accessibility.test.js +274 -0
  267. package/resultset-table/ResultsetTable.d.ts +7 -0
  268. package/resultset-table/ResultsetTable.js +170 -0
  269. package/resultset-table/ResultsetTable.stories.tsx +401 -0
  270. package/resultset-table/ResultsetTable.test.js +381 -0
  271. package/resultset-table/types.d.ts +100 -0
  272. package/resultset-table/types.js +5 -0
  273. package/select/Listbox.d.ts +4 -0
  274. package/select/Listbox.js +145 -0
  275. package/select/Option.d.ts +4 -0
  276. package/select/Option.js +88 -0
  277. package/select/Select.accessibility.test.js +217 -0
  278. package/select/Select.d.ts +4 -0
  279. package/select/Select.js +248 -515
  280. package/select/Select.stories.tsx +590 -255
  281. package/select/Select.test.js +2276 -0
  282. package/select/types.d.ts +209 -0
  283. package/select/types.js +5 -0
  284. package/sidenav/Sidenav.accessibility.test.js +59 -0
  285. package/sidenav/Sidenav.d.ts +6 -5
  286. package/sidenav/Sidenav.js +137 -72
  287. package/sidenav/Sidenav.stories.tsx +246 -134
  288. package/sidenav/Sidenav.test.js +37 -0
  289. package/sidenav/SidenavContext.d.ts +5 -0
  290. package/sidenav/SidenavContext.js +13 -0
  291. package/sidenav/types.d.ts +52 -26
  292. package/slider/Slider.accessibility.test.js +104 -0
  293. package/slider/Slider.d.ts +2 -2
  294. package/slider/Slider.js +149 -181
  295. package/slider/Slider.test.js +254 -0
  296. package/slider/types.d.ts +11 -3
  297. package/spinner/Spinner.accessibility.test.js +96 -0
  298. package/spinner/Spinner.js +32 -76
  299. package/spinner/{Spinner.stories.jsx → Spinner.stories.tsx} +53 -26
  300. package/spinner/Spinner.test.js +55 -0
  301. package/spinner/types.d.ts +3 -3
  302. package/status-light/StatusLight.accessibility.test.js +157 -0
  303. package/status-light/StatusLight.d.ts +4 -0
  304. package/status-light/StatusLight.js +51 -0
  305. package/status-light/StatusLight.stories.tsx +74 -0
  306. package/status-light/StatusLight.test.js +25 -0
  307. package/status-light/types.d.ts +17 -0
  308. package/status-light/types.js +5 -0
  309. package/switch/Switch.accessibility.test.js +89 -0
  310. package/switch/Switch.d.ts +2 -2
  311. package/switch/Switch.js +150 -115
  312. package/switch/Switch.stories.tsx +45 -68
  313. package/switch/Switch.test.js +180 -0
  314. package/switch/types.d.ts +13 -5
  315. package/table/DropdownTheme.js +62 -0
  316. package/table/Table.accessibility.test.js +82 -0
  317. package/table/Table.d.ts +6 -2
  318. package/table/Table.js +79 -36
  319. package/table/Table.stories.tsx +651 -0
  320. package/table/Table.test.js +113 -0
  321. package/table/types.d.ts +34 -6
  322. package/tabs/Tab.d.ts +4 -0
  323. package/tabs/Tab.js +117 -0
  324. package/tabs/Tabs.accessibility.test.js +56 -0
  325. package/tabs/Tabs.d.ts +1 -1
  326. package/tabs/Tabs.js +307 -147
  327. package/tabs/Tabs.stories.tsx +121 -18
  328. package/tabs/Tabs.test.js +276 -0
  329. package/tabs/types.d.ts +46 -24
  330. package/tag/Tag.accessibility.test.js +69 -0
  331. package/tag/Tag.d.ts +1 -1
  332. package/tag/Tag.js +44 -86
  333. package/tag/Tag.stories.tsx +37 -30
  334. package/tag/Tag.test.js +41 -0
  335. package/tag/types.d.ts +25 -16
  336. package/text-input/Suggestion.d.ts +4 -0
  337. package/text-input/Suggestion.js +67 -0
  338. package/text-input/Suggestions.d.ts +4 -0
  339. package/text-input/Suggestions.js +86 -0
  340. package/text-input/TextInput.accessibility.test.js +321 -0
  341. package/text-input/TextInput.js +335 -553
  342. package/text-input/TextInput.stories.tsx +465 -0
  343. package/text-input/TextInput.test.js +1756 -0
  344. package/text-input/types.d.ts +82 -34
  345. package/textarea/Textarea.accessibility.test.js +155 -0
  346. package/textarea/Textarea.d.ts +4 -0
  347. package/textarea/Textarea.js +98 -181
  348. package/textarea/Textarea.stories.tsx +174 -0
  349. package/textarea/Textarea.test.js +406 -0
  350. package/textarea/types.d.ts +141 -0
  351. package/textarea/types.js +5 -0
  352. package/toggle-group/ToggleGroup.accessibility.test.js +107 -0
  353. package/toggle-group/ToggleGroup.d.ts +2 -2
  354. package/toggle-group/ToggleGroup.js +98 -113
  355. package/toggle-group/ToggleGroup.stories.tsx +79 -39
  356. package/toggle-group/ToggleGroup.test.js +137 -0
  357. package/toggle-group/types.d.ts +68 -38
  358. package/typography/Typography.accessibility.test.js +339 -0
  359. package/typography/Typography.d.ts +4 -0
  360. package/typography/Typography.js +23 -0
  361. package/typography/Typography.stories.tsx +198 -0
  362. package/typography/types.d.ts +18 -0
  363. package/typography/types.js +5 -0
  364. package/useTheme.d.ts +1147 -0
  365. package/useTheme.js +4 -11
  366. package/useTranslatedLabels.d.ts +85 -0
  367. package/useTranslatedLabels.js +14 -0
  368. package/utils/BaseTypography.d.ts +21 -0
  369. package/utils/BaseTypography.js +94 -0
  370. package/utils/FocusLock.d.ts +13 -0
  371. package/utils/FocusLock.js +124 -0
  372. package/wizard/Wizard.accessibility.test.js +55 -0
  373. package/wizard/Wizard.d.ts +1 -1
  374. package/wizard/Wizard.js +130 -114
  375. package/wizard/{Wizard.stories.jsx → Wizard.stories.tsx} +67 -19
  376. package/wizard/Wizard.test.js +114 -0
  377. package/wizard/types.d.ts +15 -15
  378. package/ThemeContext.js +0 -246
  379. package/V3Select/V3Select.js +0 -455
  380. package/V3Select/index.d.ts +0 -27
  381. package/V3Textarea/V3Textarea.js +0 -260
  382. package/V3Textarea/index.d.ts +0 -27
  383. package/card/ice-cream.jpg +0 -0
  384. package/chip/index.d.ts +0 -22
  385. package/common/OpenSans.css +0 -81
  386. package/common/RequiredComponent.js +0 -32
  387. package/common/fonts/OpenSans-Bold.ttf +0 -0
  388. package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  389. package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  390. package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  391. package/common/fonts/OpenSans-Italic.ttf +0 -0
  392. package/common/fonts/OpenSans-Light.ttf +0 -0
  393. package/common/fonts/OpenSans-LightItalic.ttf +0 -0
  394. package/common/fonts/OpenSans-Regular.ttf +0 -0
  395. package/common/fonts/OpenSans-SemiBold.ttf +0 -0
  396. package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  397. package/date/Date.js +0 -373
  398. package/date/index.d.ts +0 -27
  399. package/input-text/Icons.js +0 -22
  400. package/input-text/InputText.js +0 -611
  401. package/input-text/index.d.ts +0 -36
  402. package/number-input/numberInputContextTypes.d.ts +0 -19
  403. package/paginator/Icons.js +0 -66
  404. package/progress-bar/ProgressBar.stories.jsx +0 -58
  405. package/radio/Radio.d.ts +0 -4
  406. package/radio/Radio.js +0 -174
  407. package/radio/Radio.stories.tsx +0 -192
  408. package/radio/types.d.ts +0 -54
  409. package/resultsetTable/ResultsetTable.d.ts +0 -4
  410. package/resultsetTable/ResultsetTable.js +0 -249
  411. package/resultsetTable/types.d.ts +0 -63
  412. package/select/index.d.ts +0 -131
  413. package/slider/Slider.stories.tsx +0 -177
  414. package/table/Table.stories.jsx +0 -276
  415. package/textarea/Textarea.stories.jsx +0 -135
  416. package/textarea/index.d.ts +0 -117
  417. package/toggle/Toggle.js +0 -186
  418. package/toggle/index.d.ts +0 -21
  419. package/upload/Upload.js +0 -201
  420. package/upload/buttons-upload/ButtonsUpload.js +0 -111
  421. package/upload/buttons-upload/Icons.js +0 -40
  422. package/upload/dragAndDropArea/DragAndDropArea.js +0 -225
  423. package/upload/dragAndDropArea/Icons.js +0 -39
  424. package/upload/file-upload/FileToUpload.js +0 -115
  425. package/upload/file-upload/Icons.js +0 -66
  426. package/upload/files-upload/FilesToUpload.js +0 -109
  427. package/upload/index.d.ts +0 -15
  428. package/upload/transaction/Icons.js +0 -160
  429. package/upload/transaction/Transaction.js +0 -104
  430. package/upload/transactions/Transactions.js +0 -94
  431. package/wizard/Icons.js +0 -65
  432. /package/{radio → action-icon}/types.js +0 -0
  433. /package/{resultsetTable → badge}/types.js +0 -0
  434. /package/{number-input/numberInputContextTypes.js → bleed/types.js} +0 -0
@@ -1,66 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.previousIcon = exports.nextIcon = exports.lastIcon = exports.firstIcon = void 0;
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var firstIcon = /*#__PURE__*/_react["default"].createElement("svg", {
13
- xmlns: "http://www.w3.org/2000/svg",
14
- width: "12.41",
15
- height: "12",
16
- viewBox: "0 0 12.41 12"
17
- }, /*#__PURE__*/_react["default"].createElement("path", {
18
- id: "Path_2463",
19
- "data-name": "Path 2463",
20
- d: "M18.41,16.59,13.82,12l4.59-4.59L17,6l-6,6,6,6ZM6,6H8V18H6Z",
21
- transform: "translate(-6 -6)"
22
- }));
23
-
24
- exports.firstIcon = firstIcon;
25
-
26
- var previousIcon = /*#__PURE__*/_react["default"].createElement("svg", {
27
- xmlns: "http://www.w3.org/2000/svg",
28
- width: "7.41",
29
- height: "12",
30
- viewBox: "0 0 7.41 12"
31
- }, /*#__PURE__*/_react["default"].createElement("path", {
32
- id: "Path_2459",
33
- "data-name": "Path 2459",
34
- d: "M15.41,7.41,14,6,8,12l6,6,1.41-1.41L10.83,12Z",
35
- transform: "translate(-8 -6)"
36
- }));
37
-
38
- exports.previousIcon = previousIcon;
39
-
40
- var nextIcon = /*#__PURE__*/_react["default"].createElement("svg", {
41
- xmlns: "http://www.w3.org/2000/svg",
42
- width: "7.41",
43
- height: "12",
44
- viewBox: "0 0 7.41 12"
45
- }, /*#__PURE__*/_react["default"].createElement("path", {
46
- id: "Path_2461",
47
- "data-name": "Path 2461",
48
- d: "M10,6,8.59,7.41,13.17,12,8.59,16.59,10,18l6-6Z",
49
- transform: "translate(-8.59 -6)"
50
- }));
51
-
52
- exports.nextIcon = nextIcon;
53
-
54
- var lastIcon = /*#__PURE__*/_react["default"].createElement("svg", {
55
- xmlns: "http://www.w3.org/2000/svg",
56
- width: "12.41",
57
- height: "12",
58
- viewBox: "0 0 12.41 12"
59
- }, /*#__PURE__*/_react["default"].createElement("path", {
60
- id: "Path_2465",
61
- "data-name": "Path 2465",
62
- d: "M5.59,7.41,10.18,12,5.59,16.59,7,18l6-6L7,6ZM16,6h2V18H16Z",
63
- transform: "translate(-5.59 -6)"
64
- }));
65
-
66
- exports.lastIcon = lastIcon;
@@ -1,58 +0,0 @@
1
- import React from "react";
2
- import DxcProgressBar from "./ProgressBar";
3
- import Title from "../../.storybook/components/Title";
4
- import ExampleContainer from "../../.storybook/components/ExampleContainer";
5
-
6
- export default {
7
- title: "ProgressBar",
8
- component: DxcProgressBar,
9
- };
10
-
11
- export const Chromatic = () => (
12
- <>
13
- <ExampleContainer>
14
- <Title title="Without labels" theme="light" level={4} />
15
- <DxcProgressBar overlay={false} value={50} showValue />
16
- <Title title="With helperText" theme="light" level={4} />
17
- <DxcProgressBar helperText="Helper text" value={50} overlay={false} showValue />
18
- <Title title="Without default value" theme="light" level={4} />
19
- <DxcProgressBar label="Loading..." overlay={false} showValue />
20
- </ExampleContainer>
21
- <Title title="Margins" theme="light" level={2} />
22
- <ExampleContainer>
23
- <Title title="Xxsmall margin" theme="light" level={4} />
24
- <DxcProgressBar label="Margin xxsmall" margin="xxsmall" overlay={false} value={50} showValue />
25
- </ExampleContainer>
26
- <ExampleContainer>
27
- <Title title="Xsmall margin" theme="light" level={4} />
28
- <DxcProgressBar label="Margin xsmall" margin="xsmall" overlay={false} value={50} showValue />
29
- </ExampleContainer>
30
- <ExampleContainer>
31
- <Title title="Small margin" theme="light" level={4} />
32
- <DxcProgressBar label="Margin small" margin="small" overlay={false} value={50} showValue />
33
- </ExampleContainer>
34
- <ExampleContainer>
35
- <Title title="Medium margin" theme="light" level={4} />
36
- <DxcProgressBar label="Margin medium" margin="medium" overlay={false} value={50} showValue />
37
- </ExampleContainer>
38
- <ExampleContainer>
39
- <Title title="Large margin" theme="light" level={4} />
40
- <DxcProgressBar label="Margin large" margin="large" overlay={false} value={50} showValue />
41
- </ExampleContainer>
42
- <ExampleContainer>
43
- <Title title="Xlarge margin" theme="light" level={4} />
44
- <DxcProgressBar label="Margin xlarge" margin="xlarge" overlay={false} value={50} showValue />
45
- </ExampleContainer>
46
- <ExampleContainer>
47
- <Title title="XxLarge margin" theme="light" level={4} />
48
- <DxcProgressBar label="Margin xxlarge" margin="xxlarge" overlay={false} value={50} showValue />
49
- </ExampleContainer>
50
- </>
51
- );
52
-
53
- export const ProgressBarOverlay = () => (
54
- <ExampleContainer>
55
- <Title title="Overlay" theme="dark" level={4} />
56
- <DxcProgressBar label="Overlay" helperText="Helper text" showValue value={50} />
57
- </ExampleContainer>
58
- );
package/radio/Radio.d.ts DELETED
@@ -1,4 +0,0 @@
1
- /// <reference types="react" />
2
- import RadioPropsType from "./types";
3
- declare const DxcRadio: ({ checked, value, label, labelPosition, name, disabled, onClick, required, margin, size, }: RadioPropsType) => JSX.Element;
4
- export default DxcRadio;
package/radio/Radio.js DELETED
@@ -1,174 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof3 = require("@babel/runtime/helpers/typeof");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- exports["default"] = void 0;
11
-
12
- var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
13
-
14
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
15
-
16
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
17
-
18
- var _react = _interopRequireWildcard(require("react"));
19
-
20
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
21
-
22
- var _Radio = _interopRequireDefault(require("@material-ui/core/Radio"));
23
-
24
- var _RequiredComponent = _interopRequireDefault(require("../common/RequiredComponent"));
25
-
26
- var _variables = require("../common/variables.js");
27
-
28
- var _utils = require("../common/utils.js");
29
-
30
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
31
-
32
- var _BackgroundColorContext = _interopRequireDefault(require("../BackgroundColorContext.js"));
33
-
34
- var _templateObject, _templateObject2;
35
-
36
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
37
-
38
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
39
-
40
- var DxcRadio = function DxcRadio(_ref) {
41
- var _ref$checked = _ref.checked,
42
- checked = _ref$checked === void 0 ? false : _ref$checked,
43
- value = _ref.value,
44
- _ref$label = _ref.label,
45
- label = _ref$label === void 0 ? "" : _ref$label,
46
- _ref$labelPosition = _ref.labelPosition,
47
- labelPosition = _ref$labelPosition === void 0 ? "before" : _ref$labelPosition,
48
- name = _ref.name,
49
- _ref$disabled = _ref.disabled,
50
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
51
- onClick = _ref.onClick,
52
- _ref$required = _ref.required,
53
- required = _ref$required === void 0 ? false : _ref$required,
54
- margin = _ref.margin,
55
- _ref$size = _ref.size,
56
- size = _ref$size === void 0 ? "fitContent" : _ref$size;
57
-
58
- var _useState = (0, _react.useState)(false),
59
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
60
- innerChecked = _useState2[0],
61
- setInnerChecked = _useState2[1];
62
-
63
- var colorsTheme = (0, _useTheme["default"])();
64
- var backgroundType = (0, _react.useContext)(_BackgroundColorContext["default"]);
65
-
66
- var handlerRadioChange = function handlerRadioChange() {
67
- if (checked == null) {
68
- setInnerChecked(true);
69
- }
70
-
71
- if (typeof onClick === "function") {
72
- onClick(true);
73
- }
74
- };
75
-
76
- return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
77
- theme: colorsTheme.radio
78
- }, /*#__PURE__*/_react["default"].createElement(RadioContainer, {
79
- id: name,
80
- labelPosition: labelPosition,
81
- disabled: disabled,
82
- margin: margin,
83
- size: size,
84
- backgroundType: backgroundType
85
- }, /*#__PURE__*/_react["default"].createElement(_Radio["default"], {
86
- checked: checked != null && checked || innerChecked,
87
- name: name,
88
- onClick: handlerRadioChange,
89
- value: value,
90
- disabled: disabled,
91
- disableRipple: true
92
- }), /*#__PURE__*/_react["default"].createElement(LabelContainer, {
93
- checked: checked || innerChecked,
94
- labelPosition: labelPosition,
95
- disabled: disabled,
96
- onClick: !disabled && handlerRadioChange || null,
97
- backgroundType: backgroundType
98
- }, required && /*#__PURE__*/_react["default"].createElement(_RequiredComponent["default"], null), label)));
99
- };
100
-
101
- var sizes = {
102
- small: "120px",
103
- medium: "240px",
104
- large: "480px",
105
- fillParent: "100%",
106
- fitContent: "unset"
107
- };
108
-
109
- var calculateWidth = function calculateWidth(margin, size) {
110
- if (size === "fillParent") {
111
- return "calc(".concat(sizes[size], " - ").concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), ")");
112
- }
113
-
114
- return sizes[size];
115
- };
116
-
117
- var RadioContainer = _styledComponents["default"].span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n width: ", ";\n\n display: inline-flex;\n align-items: center;\n max-height: 42px;\n position: relative;\n flex-direction: ", ";\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n cursor: ", ";\n .MuiButtonBase-root {\n width: auto;\n height: auto;\n padding: 10px;\n margin: 2px;\n ", ": ", ";\n padding-left: ", ";\n padding-right: ", ";\n margin-left: ", ";\n margin-right: ", ";\n .MuiIconButton-label {\n .MuiSvgIcon-root {\n height: ", ";\n width: ", ";\n }\n color: ", ";\n\n > div > :nth-child(2) path {\n color: ", ";\n }\n }\n\n &.Mui-focusVisible {\n background-color: transparent;\n .MuiSvgIcon-root {\n outline: ", "\n auto 1px;\n }\n }\n :hover {\n background-color: transparent;\n }\n .MuiTouchRipple-ripple {\n height: 40px !important;\n width: 40px !important;\n top: 0px !important;\n left: 0px !important;\n }\n }\n .MuiRadio-colorSecondary.Mui-checked {\n color: ", ";\n :hover {\n background-color: transparent;\n }\n }\n"])), function (props) {
118
- return calculateWidth(props.margin, props.size);
119
- }, function (props) {
120
- return props.labelPosition === "before" ? "row-reverse" : "row";
121
- }, function (props) {
122
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
123
- }, function (props) {
124
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
125
- }, function (props) {
126
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
127
- }, function (props) {
128
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
129
- }, function (props) {
130
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
131
- }, function (props) {
132
- return props.disabled === true ? "not-allowed" : "default";
133
- }, function (props) {
134
- return props.labelPosition === "after" ? "padding-right" : "padding-left";
135
- }, function (props) {
136
- return props.theme.circleLabelSpacing;
137
- }, function (props) {
138
- return props.labelPosition === "after" ? "0px" : "";
139
- }, function (props) {
140
- return props.labelPosition === "before" ? "0px" : "";
141
- }, function (props) {
142
- return props.labelPosition === "after" ? "0px" : "";
143
- }, function (props) {
144
- return props.labelPosition === "before" ? "0px" : "";
145
- }, function (props) {
146
- return props.theme.circleSize;
147
- }, function (props) {
148
- return props.theme.circleSize;
149
- }, function (props) {
150
- return props.backgroundType === "dark" ? props.disabled && props.theme.disabledColorOnDark || props.theme.colorOnDark : props.disabled && props.theme.disabledColor || props.theme.color;
151
- }, function (props) {
152
- return props.backgroundType === "dark" ? props.disabled && props.theme.disabledColorOnDark || props.theme.colorOnDark : props.disabled && props.theme.disabledColor || props.theme.color;
153
- }, function (props) {
154
- return props.backgroundType === "dark" ? props.theme.focusColorOnDark : props.theme.focusColor;
155
- }, function (props) {
156
- return props.backgroundType === "dark" ? props.disabled && props.theme.disabledColorOnDark || props.theme.colorOnDark : props.disabled && props.theme.disabledColor || props.theme.color;
157
- });
158
-
159
- var LabelContainer = _styledComponents["default"].span(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: ", ";\n color: ", ";\n cursor: ", ";\n"])), function (props) {
160
- return props.theme.fontFamily;
161
- }, function (props) {
162
- return props.theme.fontSize;
163
- }, function (props) {
164
- return props.theme.fontWeight;
165
- }, function (props) {
166
- return props.theme.fontStyle;
167
- }, function (props) {
168
- return props.backgroundType === "dark" ? props.disabled && props.theme.disabledFontColorOnDark || props.theme.fontColorOnDark : props.disabled && props.theme.disabledFontColor || props.theme.fontColor;
169
- }, function (props) {
170
- return props.disabled === true ? "not-allowed" : "pointer";
171
- });
172
-
173
- var _default = DxcRadio;
174
- exports["default"] = _default;
@@ -1,192 +0,0 @@
1
- import React from "react";
2
- import DxcRadio from "./Radio";
3
- import { BackgroundColorProvider } from "../BackgroundColorContext";
4
- import Title from "../../.storybook/components/Title";
5
- import ExampleContainer from "../../.storybook/components/ExampleContainer";
6
- import DarkContainer from "../../.storybook/components/DarkSection";
7
- import { userEvent, within } from "@storybook/testing-library";
8
-
9
- export default {
10
- title: "Radio",
11
- component: DxcRadio,
12
- };
13
-
14
- const Radio = () => (
15
- <>
16
- <>
17
- <ExampleContainer>
18
- <Title title="Default" theme="light" level={4} />
19
- <DxcRadio label="Radio" />
20
- </ExampleContainer>
21
- <ExampleContainer>
22
- <Title title="Focused" theme="light" level={4} />
23
- <DxcRadio label="Focused" />
24
- </ExampleContainer>
25
- <ExampleContainer>
26
- <Title title="Checked" theme="light" level={4} />
27
- <DxcRadio label="Radio" checked />
28
- </ExampleContainer>
29
- <ExampleContainer>
30
- <Title title="Required" theme="light" level={4} />
31
- <DxcRadio label="Radio" required />
32
- </ExampleContainer>
33
- <ExampleContainer>
34
- <Title title="Disabled and checked" theme="light" level={4} />
35
- <DxcRadio label="Radio" disabled checked />
36
- </ExampleContainer>
37
- <ExampleContainer>
38
- <Title title="Disabled and required" theme="light" level={4} />
39
- <DxcRadio label="Radio" disabled required />
40
- </ExampleContainer>
41
- <ExampleContainer>
42
- <Title title="Disabled, required and checked" theme="light" level={4} />
43
- <DxcRadio label="Radio" disabled required checked />
44
- </ExampleContainer>
45
- <ExampleContainer>
46
- <Title title="Label after" theme="light" level={4} />
47
- <DxcRadio label="Radio" labelPosition="after" />
48
- </ExampleContainer>
49
- <ExampleContainer>
50
- <Title title="Checked with label after" theme="light" level={4} />
51
- <DxcRadio label="Radio" checked labelPosition="after" />
52
- </ExampleContainer>
53
- <ExampleContainer>
54
- <Title title="Required with label after" theme="light" level={4} />
55
- <DxcRadio label="Radio" required labelPosition="after" />
56
- </ExampleContainer>
57
- <ExampleContainer>
58
- <Title title="Disabled and checked with label after" theme="light" level={4} />
59
- <DxcRadio label="Radio" disabled checked labelPosition="after" />
60
- </ExampleContainer>
61
- <ExampleContainer>
62
- <Title title="Disabled and required with label after" theme="light" level={4} />
63
- <DxcRadio label="Radio" disabled required labelPosition="after" />
64
- </ExampleContainer>
65
- <ExampleContainer>
66
- <Title title="Disabled, required and checked with label after" theme="light" level={4} />
67
- <DxcRadio label="Radio" disabled required checked labelPosition="after" />
68
- </ExampleContainer>
69
- <ExampleContainer pseudoState="pseudo-hover">
70
- <Title title="Hovered" theme="light" level={4} />
71
- <DxcRadio label="Hovered" />
72
- </ExampleContainer>
73
- <ExampleContainer pseudoState="pseudo-hover">
74
- <Title title="Hovered and checked" theme="light" level={4} />
75
- <DxcRadio label="Hovered" checked />
76
- </ExampleContainer>
77
- </>
78
- <BackgroundColorProvider color="#333333">
79
- <DarkContainer>
80
- <>
81
- <ExampleContainer>
82
- <Title title="Default" theme="dark" level={4} />
83
- <DxcRadio label="Radio" />
84
- </ExampleContainer>
85
- <ExampleContainer>
86
- <Title title="Checked" theme="dark" level={4} />
87
- <DxcRadio label="Radio" checked />
88
- </ExampleContainer>
89
- <ExampleContainer>
90
- <Title title="Required" theme="dark" level={4} />
91
- <DxcRadio label="Radio" required />
92
- </ExampleContainer>
93
- <ExampleContainer>
94
- <Title title="Disabled and checked" theme="dark" level={4} />
95
- <DxcRadio label="Radio" disabled checked />
96
- </ExampleContainer>
97
- <ExampleContainer>
98
- <Title title="Disabled and required" theme="dark" level={4} />
99
- <DxcRadio label="Radio" disabled required />
100
- </ExampleContainer>
101
- <ExampleContainer>
102
- <Title title="Disabled, required and checked" theme="dark" level={4} />
103
- <DxcRadio label="Radio" disabled required checked />
104
- </ExampleContainer>
105
- <ExampleContainer>
106
- <Title title="Label after" theme="dark" level={4} />
107
- <DxcRadio label="Radio" labelPosition="after" />
108
- </ExampleContainer>
109
- <ExampleContainer>
110
- <Title title="Checked with label after" theme="dark" level={4} />
111
- <DxcRadio label="Radio" checked labelPosition="after" />
112
- </ExampleContainer>
113
- <ExampleContainer>
114
- <Title title="Required with label after" theme="dark" level={4} />
115
- <DxcRadio label="Radio" required labelPosition="after" />
116
- </ExampleContainer>
117
- <ExampleContainer>
118
- <Title title="Disabled and checked with label after" theme="dark" level={4} />
119
- <DxcRadio label="Radio" disabled checked labelPosition="after" />
120
- </ExampleContainer>
121
- <ExampleContainer>
122
- <Title title="Disabled and required with label after" theme="dark" level={4} />
123
- <DxcRadio label="Radio" disabled required labelPosition="after" />
124
- </ExampleContainer>
125
- <ExampleContainer>
126
- <Title title="Disabled, required and checked with label after" theme="dark" level={4} />
127
- <DxcRadio label="Radio" disabled required checked labelPosition="after" />
128
- </ExampleContainer>
129
- <ExampleContainer pseudoState="pseudo-hover">
130
- <Title title="Hovered" theme="dark" level={4} />
131
- <DxcRadio label="Hovered" />
132
- </ExampleContainer>
133
- <ExampleContainer pseudoState="pseudo-hover">
134
- <Title title="Hovered and checked" theme="dark" level={4} />
135
- <DxcRadio label="Hovered" checked />
136
- </ExampleContainer>
137
- </>
138
- </DarkContainer>
139
- </BackgroundColorProvider>
140
- <Title title="Sizes" theme="light" level={2} />
141
- <ExampleContainer>
142
- <DxcRadio label="Small" size="small" />
143
- </ExampleContainer>
144
- <ExampleContainer>
145
- <DxcRadio label="Medium" size="medium" />
146
- </ExampleContainer>
147
- <ExampleContainer>
148
- <DxcRadio label="Large" size="large" />
149
- </ExampleContainer>
150
- <ExampleContainer>
151
- <DxcRadio label="FitContent" size="fitContent" />
152
- </ExampleContainer>
153
- <ExampleContainer>
154
- <DxcRadio label="FillParent" size="fillParent" />
155
- </ExampleContainer>
156
- <Title title="Margins" theme="light" level={2} />
157
- <ExampleContainer>
158
- <Title title="Xxsmall" theme="light" level={4} />
159
- <DxcRadio label="Xxsmall" margin={"xxsmall"} />
160
- </ExampleContainer>
161
- <ExampleContainer>
162
- <Title title="Xsmall" theme="light" level={4} />
163
- <DxcRadio label="Xsmall" margin={"xsmall"} />
164
- </ExampleContainer>
165
- <ExampleContainer>
166
- <Title title="Small" theme="light" level={4} />
167
- <DxcRadio label="Small" margin={"small"} />
168
- </ExampleContainer>
169
- <ExampleContainer>
170
- <Title title="Medium" theme="light" level={4} />
171
- <DxcRadio label="Medium" margin={"medium"} />
172
- </ExampleContainer>
173
- <ExampleContainer>
174
- <Title title="Large" theme="light" level={4} />
175
- <DxcRadio label="Large" margin={"large"} />
176
- </ExampleContainer>
177
- <ExampleContainer>
178
- <Title title="Xlarge" theme="light" level={4} />
179
- <DxcRadio label="Xlarge" margin={"xlarge"} />
180
- </ExampleContainer>
181
- <ExampleContainer>
182
- <Title title="Xxlarge" theme="light" level={4} />
183
- <DxcRadio label="Xxlarge" margin={"xxlarge"} />
184
- </ExampleContainer>
185
- </>
186
- );
187
-
188
- export const Chromatic = Radio.bind({});
189
- Chromatic.play = async () => {
190
- await userEvent.tab();
191
- await userEvent.tab();
192
- };
package/radio/types.d.ts DELETED
@@ -1,54 +0,0 @@
1
- declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- declare type Margin = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
- declare type Props = {
9
- /**
10
- * If true, the radio is selected. If undefined the component will be uncontrolled
11
- * and the value will be managed internally by the component.
12
- */
13
- checked?: boolean;
14
- /**
15
- * Will be passed to the value attribute of the html input element. When inside a
16
- * form, this value will be only submitted if the radio is checked.
17
- */
18
- value?: string;
19
- /**
20
- * Text to be placed next to the radio.
21
- */
22
- label: string;
23
- /**
24
- * Whether the label should appear after or before the radio.
25
- */
26
- labelPosition?: "before" | "after";
27
- /**
28
- * Name attribute of the input element.
29
- */
30
- name?: string;
31
- /**
32
- * If true, the component will be disabled.
33
- */
34
- disabled?: boolean;
35
- /**
36
- * If true, the radio will change its appearence, showing that the value is required.
37
- */
38
- required?: boolean;
39
- /**
40
- * This function will be called when the user clicks the radio. The new value will
41
- * be passed as a parameter.
42
- */
43
- onClick?: (val: boolean) => void;
44
- /**
45
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
46
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
47
- */
48
- margin?: Space | Margin;
49
- /**
50
- * Size of the component.
51
- */
52
- size?: "small" | "medium" | "large" | "fillParent" | "fitContent";
53
- };
54
- export default Props;
@@ -1,4 +0,0 @@
1
- /// <reference types="react" />
2
- import ResultsetTablePropsType from "./types";
3
- declare const DxcResultsetTable: ({ columns, rows, itemsPerPage, itemsPerPageOptions, itemsPerPageFunction, margin, tabIndex, }: ResultsetTablePropsType) => JSX.Element;
4
- export default DxcResultsetTable;