@dxc-technology/halstack-react 0.0.0-b646454 → 0.0.0-b6bbb51

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 (535) hide show
  1. package/BackgroundColorContext.d.ts +1 -0
  2. package/BackgroundColorContext.js +30 -0
  3. package/HalstackContext.d.ts +1237 -0
  4. package/HalstackContext.js +310 -0
  5. package/README.md +28 -47
  6. package/accordion/Accordion.d.ts +4 -0
  7. package/accordion/Accordion.js +182 -0
  8. package/accordion/Accordion.stories.tsx +283 -0
  9. package/accordion/Accordion.test.js +56 -0
  10. package/accordion/types.d.ts +57 -0
  11. package/accordion/types.js +5 -0
  12. package/accordion-group/AccordionGroup.d.ts +8 -0
  13. package/accordion-group/AccordionGroup.js +101 -0
  14. package/accordion-group/AccordionGroup.stories.tsx +252 -0
  15. package/accordion-group/AccordionGroup.test.js +98 -0
  16. package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
  17. package/accordion-group/AccordionGroupAccordion.js +31 -0
  18. package/accordion-group/types.d.ts +67 -0
  19. package/accordion-group/types.js +5 -0
  20. package/action-icon/ActionIcon.d.ts +4 -0
  21. package/action-icon/ActionIcon.js +47 -0
  22. package/action-icon/ActionIcon.stories.tsx +41 -0
  23. package/action-icon/ActionIcon.test.js +64 -0
  24. package/action-icon/types.d.ts +26 -0
  25. package/action-icon/types.js +5 -0
  26. package/alert/Alert.d.ts +4 -0
  27. package/alert/Alert.js +254 -0
  28. package/alert/Alert.stories.tsx +198 -0
  29. package/alert/Alert.test.js +75 -0
  30. package/alert/types.d.ts +49 -0
  31. package/alert/types.js +5 -0
  32. package/badge/Badge.d.ts +4 -0
  33. package/badge/Badge.js +159 -0
  34. package/badge/Badge.stories.tsx +210 -0
  35. package/badge/Badge.test.js +30 -0
  36. package/badge/types.d.ts +54 -0
  37. package/badge/types.js +5 -0
  38. package/bleed/Bleed.d.ts +3 -0
  39. package/bleed/Bleed.js +43 -0
  40. package/bleed/Bleed.stories.tsx +342 -0
  41. package/bleed/types.d.ts +37 -0
  42. package/bleed/types.js +5 -0
  43. package/box/Box.d.ts +4 -0
  44. package/box/Box.js +75 -0
  45. package/box/Box.stories.tsx +119 -0
  46. package/box/Box.test.js +13 -0
  47. package/box/types.d.ts +32 -0
  48. package/box/types.js +5 -0
  49. package/bulleted-list/BulletedList.d.ts +7 -0
  50. package/bulleted-list/BulletedList.js +89 -0
  51. package/bulleted-list/BulletedList.stories.tsx +115 -0
  52. package/bulleted-list/types.d.ts +38 -0
  53. package/bulleted-list/types.js +5 -0
  54. package/button/Button.d.ts +4 -0
  55. package/button/Button.js +120 -0
  56. package/button/Button.stories.tsx +344 -0
  57. package/button/Button.test.js +38 -0
  58. package/button/types.d.ts +57 -0
  59. package/button/types.js +5 -0
  60. package/card/Card.d.ts +4 -0
  61. package/card/Card.js +120 -0
  62. package/card/Card.stories.tsx +171 -0
  63. package/card/Card.test.js +39 -0
  64. package/card/types.d.ts +62 -0
  65. package/card/types.js +5 -0
  66. package/checkbox/Checkbox.d.ts +4 -0
  67. package/checkbox/Checkbox.js +215 -0
  68. package/checkbox/Checkbox.stories.tsx +222 -0
  69. package/checkbox/Checkbox.test.js +199 -0
  70. package/checkbox/types.d.ts +72 -0
  71. package/checkbox/types.js +5 -0
  72. package/chip/Chip.d.ts +4 -0
  73. package/chip/Chip.js +121 -0
  74. package/chip/Chip.stories.tsx +214 -0
  75. package/chip/Chip.test.js +41 -0
  76. package/chip/types.d.ts +45 -0
  77. package/chip/types.js +5 -0
  78. package/common/OpenSans.css +69 -0
  79. package/common/coreTokens.d.ts +237 -0
  80. package/common/coreTokens.js +184 -0
  81. package/common/utils.d.ts +1 -0
  82. package/common/utils.js +16 -0
  83. package/common/variables.d.ts +1383 -0
  84. package/common/variables.js +1255 -0
  85. package/container/Container.d.ts +4 -0
  86. package/container/Container.js +194 -0
  87. package/container/Container.stories.tsx +214 -0
  88. package/container/types.d.ts +74 -0
  89. package/container/types.js +5 -0
  90. package/date-input/Calendar.d.ts +4 -0
  91. package/date-input/Calendar.js +214 -0
  92. package/date-input/DateInput.d.ts +4 -0
  93. package/date-input/DateInput.js +223 -0
  94. package/date-input/DateInput.stories.tsx +285 -0
  95. package/date-input/DateInput.test.js +808 -0
  96. package/date-input/DatePicker.d.ts +4 -0
  97. package/date-input/DatePicker.js +115 -0
  98. package/date-input/Icons.d.ts +6 -0
  99. package/date-input/Icons.js +58 -0
  100. package/date-input/YearPicker.d.ts +4 -0
  101. package/date-input/YearPicker.js +100 -0
  102. package/date-input/types.d.ts +164 -0
  103. package/date-input/types.js +5 -0
  104. package/dialog/Dialog.d.ts +4 -0
  105. package/dialog/Dialog.js +104 -0
  106. package/dialog/Dialog.stories.tsx +365 -0
  107. package/dialog/Dialog.test.js +307 -0
  108. package/dialog/types.d.ts +36 -0
  109. package/dialog/types.js +5 -0
  110. package/dropdown/Dropdown.d.ts +4 -0
  111. package/dropdown/Dropdown.js +336 -0
  112. package/dropdown/Dropdown.stories.tsx +438 -0
  113. package/dropdown/Dropdown.test.js +599 -0
  114. package/dropdown/DropdownMenu.d.ts +4 -0
  115. package/dropdown/DropdownMenu.js +63 -0
  116. package/dropdown/DropdownMenuItem.d.ts +4 -0
  117. package/dropdown/DropdownMenuItem.js +67 -0
  118. package/dropdown/types.d.ts +98 -0
  119. package/dropdown/types.js +5 -0
  120. package/file-input/FileInput.d.ts +4 -0
  121. package/file-input/FileInput.js +479 -0
  122. package/file-input/FileInput.stories.tsx +618 -0
  123. package/file-input/FileInput.test.js +459 -0
  124. package/file-input/FileItem.d.ts +4 -0
  125. package/file-input/FileItem.js +135 -0
  126. package/file-input/types.d.ts +129 -0
  127. package/file-input/types.js +5 -0
  128. package/flex/Flex.d.ts +4 -0
  129. package/flex/Flex.js +57 -0
  130. package/flex/Flex.stories.tsx +112 -0
  131. package/flex/types.d.ts +97 -0
  132. package/flex/types.js +5 -0
  133. package/footer/Footer.d.ts +4 -0
  134. package/footer/Footer.js +138 -0
  135. package/footer/Footer.stories.tsx +171 -0
  136. package/footer/Footer.test.js +85 -0
  137. package/footer/Icons.d.ts +3 -0
  138. package/footer/Icons.js +136 -0
  139. package/footer/types.d.ts +64 -0
  140. package/footer/types.js +5 -0
  141. package/grid/Grid.d.ts +7 -0
  142. package/grid/Grid.js +76 -0
  143. package/grid/Grid.stories.tsx +219 -0
  144. package/grid/types.d.ts +115 -0
  145. package/grid/types.js +5 -0
  146. package/header/Header.d.ts +8 -0
  147. package/header/Header.js +220 -0
  148. package/header/Header.stories.tsx +251 -0
  149. package/header/Header.test.js +66 -0
  150. package/header/Icons.d.ts +2 -0
  151. package/header/Icons.js +29 -0
  152. package/header/types.d.ts +33 -0
  153. package/header/types.js +5 -0
  154. package/heading/Heading.d.ts +4 -0
  155. package/heading/Heading.js +137 -0
  156. package/heading/Heading.stories.tsx +54 -0
  157. package/heading/Heading.test.js +169 -0
  158. package/heading/types.d.ts +33 -0
  159. package/heading/types.js +5 -0
  160. package/image/Image.d.ts +4 -0
  161. package/image/Image.js +70 -0
  162. package/image/Image.stories.tsx +127 -0
  163. package/image/types.d.ts +72 -0
  164. package/image/types.js +5 -0
  165. package/inset/Inset.d.ts +3 -0
  166. package/inset/Inset.js +43 -0
  167. package/inset/Inset.stories.tsx +230 -0
  168. package/inset/types.d.ts +37 -0
  169. package/inset/types.js +5 -0
  170. package/layout/ApplicationLayout.d.ts +20 -0
  171. package/layout/ApplicationLayout.js +134 -0
  172. package/layout/ApplicationLayout.stories.tsx +162 -0
  173. package/layout/Icons.d.ts +8 -0
  174. package/layout/Icons.js +58 -0
  175. package/layout/SidenavContext.d.ts +5 -0
  176. package/layout/SidenavContext.js +13 -0
  177. package/layout/types.d.ts +41 -0
  178. package/layout/types.js +5 -0
  179. package/link/Link.d.ts +4 -0
  180. package/link/Link.js +115 -0
  181. package/link/Link.stories.tsx +253 -0
  182. package/link/Link.test.js +63 -0
  183. package/link/types.d.ts +54 -0
  184. package/link/types.js +5 -0
  185. package/main.d.ts +47 -0
  186. package/main.js +343 -0
  187. package/nav-tabs/NavTabs.d.ts +8 -0
  188. package/nav-tabs/NavTabs.js +93 -0
  189. package/nav-tabs/NavTabs.stories.tsx +276 -0
  190. package/nav-tabs/NavTabs.test.js +76 -0
  191. package/nav-tabs/Tab.d.ts +4 -0
  192. package/nav-tabs/Tab.js +118 -0
  193. package/nav-tabs/types.d.ts +52 -0
  194. package/nav-tabs/types.js +5 -0
  195. package/number-input/NumberInput.d.ts +11 -0
  196. package/number-input/NumberInput.js +67 -0
  197. package/number-input/NumberInput.stories.tsx +131 -0
  198. package/number-input/NumberInput.test.js +830 -0
  199. package/number-input/types.d.ts +130 -0
  200. package/number-input/types.js +5 -0
  201. package/package.json +60 -44
  202. package/paginator/Icons.d.ts +5 -0
  203. package/paginator/Icons.js +40 -0
  204. package/paginator/Paginator.d.ts +4 -0
  205. package/paginator/Paginator.js +135 -0
  206. package/paginator/Paginator.stories.tsx +87 -0
  207. package/paginator/Paginator.test.js +335 -0
  208. package/paginator/types.d.ts +38 -0
  209. package/paginator/types.js +5 -0
  210. package/paragraph/Paragraph.d.ts +5 -0
  211. package/paragraph/Paragraph.js +22 -0
  212. package/paragraph/Paragraph.stories.tsx +27 -0
  213. package/password-input/Icons.d.ts +6 -0
  214. package/password-input/Icons.js +35 -0
  215. package/password-input/PasswordInput.d.ts +4 -0
  216. package/password-input/PasswordInput.js +97 -0
  217. package/password-input/PasswordInput.stories.tsx +99 -0
  218. package/password-input/PasswordInput.test.js +198 -0
  219. package/password-input/types.d.ts +111 -0
  220. package/password-input/types.js +5 -0
  221. package/progress-bar/ProgressBar.d.ts +4 -0
  222. package/progress-bar/ProgressBar.js +144 -0
  223. package/progress-bar/ProgressBar.stories.tsx +93 -0
  224. package/progress-bar/ProgressBar.test.js +93 -0
  225. package/progress-bar/types.d.ts +37 -0
  226. package/progress-bar/types.js +5 -0
  227. package/quick-nav/QuickNav.d.ts +4 -0
  228. package/quick-nav/QuickNav.js +94 -0
  229. package/quick-nav/QuickNav.stories.tsx +356 -0
  230. package/quick-nav/types.d.ts +21 -0
  231. package/quick-nav/types.js +5 -0
  232. package/radio-group/Radio.d.ts +4 -0
  233. package/radio-group/Radio.js +124 -0
  234. package/radio-group/RadioGroup.d.ts +4 -0
  235. package/radio-group/RadioGroup.js +235 -0
  236. package/radio-group/RadioGroup.stories.tsx +214 -0
  237. package/radio-group/RadioGroup.test.js +756 -0
  238. package/radio-group/types.d.ts +114 -0
  239. package/radio-group/types.js +5 -0
  240. package/resultset-table/Icons.d.ts +7 -0
  241. package/resultset-table/Icons.js +47 -0
  242. package/resultset-table/ResultsetTable.d.ts +7 -0
  243. package/resultset-table/ResultsetTable.js +167 -0
  244. package/resultset-table/ResultsetTable.stories.tsx +381 -0
  245. package/resultset-table/ResultsetTable.test.js +371 -0
  246. package/resultset-table/types.d.ts +73 -0
  247. package/resultset-table/types.js +5 -0
  248. package/select/Icons.d.ts +10 -0
  249. package/select/Icons.js +89 -0
  250. package/select/Listbox.d.ts +4 -0
  251. package/select/Listbox.js +143 -0
  252. package/select/Option.d.ts +4 -0
  253. package/select/Option.js +87 -0
  254. package/select/Select.d.ts +4 -0
  255. package/select/Select.js +590 -0
  256. package/select/Select.stories.tsx +971 -0
  257. package/select/Select.test.js +2370 -0
  258. package/select/types.d.ts +209 -0
  259. package/select/types.js +5 -0
  260. package/sidenav/Icons.d.ts +7 -0
  261. package/sidenav/Icons.js +47 -0
  262. package/sidenav/Sidenav.d.ts +10 -0
  263. package/sidenav/Sidenav.js +196 -0
  264. package/sidenav/Sidenav.stories.tsx +282 -0
  265. package/sidenav/Sidenav.test.js +37 -0
  266. package/sidenav/types.d.ts +76 -0
  267. package/sidenav/types.js +5 -0
  268. package/slider/Slider.d.ts +4 -0
  269. package/slider/Slider.js +285 -0
  270. package/slider/Slider.test.js +254 -0
  271. package/slider/types.d.ts +86 -0
  272. package/slider/types.js +5 -0
  273. package/spinner/Spinner.d.ts +4 -0
  274. package/spinner/Spinner.js +206 -0
  275. package/spinner/Spinner.stories.tsx +129 -0
  276. package/spinner/Spinner.test.js +55 -0
  277. package/spinner/types.d.ts +32 -0
  278. package/spinner/types.js +5 -0
  279. package/status-light/StatusLight.d.ts +4 -0
  280. package/status-light/StatusLight.js +51 -0
  281. package/status-light/StatusLight.stories.tsx +74 -0
  282. package/status-light/StatusLight.test.js +25 -0
  283. package/status-light/types.d.ts +17 -0
  284. package/status-light/types.js +5 -0
  285. package/switch/Switch.d.ts +4 -0
  286. package/switch/Switch.js +214 -0
  287. package/switch/Switch.stories.tsx +137 -0
  288. package/switch/Switch.test.js +180 -0
  289. package/switch/types.d.ts +66 -0
  290. package/switch/types.js +5 -0
  291. package/table/ActionsCell.d.ts +4 -0
  292. package/table/ActionsCell.js +55 -0
  293. package/table/DropdownTheme.js +58 -0
  294. package/table/Table.d.ts +7 -0
  295. package/table/Table.js +113 -0
  296. package/table/Table.stories.tsx +615 -0
  297. package/table/Table.test.js +113 -0
  298. package/table/types.d.ts +60 -0
  299. package/table/types.js +5 -0
  300. package/tabs/Tab.d.ts +4 -0
  301. package/tabs/Tab.js +116 -0
  302. package/tabs/Tabs.d.ts +4 -0
  303. package/tabs/Tabs.js +384 -0
  304. package/tabs/Tabs.stories.tsx +226 -0
  305. package/tabs/Tabs.test.js +294 -0
  306. package/tabs/types.d.ts +92 -0
  307. package/tabs/types.js +5 -0
  308. package/tag/Tag.d.ts +4 -0
  309. package/tag/Tag.js +151 -0
  310. package/tag/Tag.stories.tsx +155 -0
  311. package/tag/Tag.test.js +49 -0
  312. package/tag/types.d.ts +69 -0
  313. package/tag/types.js +5 -0
  314. package/text-input/Icons.d.ts +8 -0
  315. package/text-input/Icons.js +56 -0
  316. package/text-input/Suggestion.d.ts +4 -0
  317. package/text-input/Suggestion.js +67 -0
  318. package/text-input/Suggestions.d.ts +4 -0
  319. package/text-input/Suggestions.js +84 -0
  320. package/text-input/TextInput.d.ts +4 -0
  321. package/text-input/TextInput.js +572 -0
  322. package/text-input/TextInput.stories.tsx +465 -0
  323. package/text-input/TextInput.test.js +1739 -0
  324. package/text-input/types.d.ts +205 -0
  325. package/text-input/types.js +5 -0
  326. package/textarea/Textarea.d.ts +4 -0
  327. package/textarea/Textarea.js +234 -0
  328. package/textarea/Textarea.stories.tsx +174 -0
  329. package/textarea/Textarea.test.js +406 -0
  330. package/textarea/types.d.ts +141 -0
  331. package/textarea/types.js +5 -0
  332. package/toggle-group/ToggleGroup.d.ts +4 -0
  333. package/toggle-group/ToggleGroup.js +201 -0
  334. package/toggle-group/ToggleGroup.stories.tsx +218 -0
  335. package/toggle-group/ToggleGroup.test.js +137 -0
  336. package/toggle-group/types.d.ts +114 -0
  337. package/toggle-group/types.js +5 -0
  338. package/typography/Typography.d.ts +4 -0
  339. package/typography/Typography.js +23 -0
  340. package/typography/Typography.stories.tsx +198 -0
  341. package/typography/types.d.ts +18 -0
  342. package/typography/types.js +5 -0
  343. package/useTheme.d.ts +1136 -0
  344. package/useTheme.js +15 -0
  345. package/useTranslatedLabels.d.ts +85 -0
  346. package/useTranslatedLabels.js +14 -0
  347. package/utils/BaseTypography.d.ts +21 -0
  348. package/utils/BaseTypography.js +94 -0
  349. package/utils/FocusLock.d.ts +13 -0
  350. package/utils/FocusLock.js +124 -0
  351. package/wizard/Wizard.d.ts +4 -0
  352. package/wizard/Wizard.js +250 -0
  353. package/wizard/Wizard.stories.tsx +253 -0
  354. package/wizard/Wizard.test.js +114 -0
  355. package/wizard/types.d.ts +64 -0
  356. package/wizard/types.js +5 -0
  357. package/babel.config.js +0 -4
  358. package/dist/ThemeContext.js +0 -15
  359. package/dist/accordion/Accordion.js +0 -242
  360. package/dist/accordion/Accordion.stories.js +0 -207
  361. package/dist/accordion/readme.md +0 -96
  362. package/dist/alert/Alert.js +0 -304
  363. package/dist/alert/Alert.stories.js +0 -158
  364. package/dist/alert/close.svg +0 -4
  365. package/dist/alert/error.svg +0 -4
  366. package/dist/alert/info.svg +0 -4
  367. package/dist/alert/readme.md +0 -43
  368. package/dist/alert/success.svg +0 -4
  369. package/dist/alert/warning.svg +0 -4
  370. package/dist/box/Box.js +0 -148
  371. package/dist/button/Button.js +0 -181
  372. package/dist/button/Button.stories.js +0 -224
  373. package/dist/button/readme.md +0 -93
  374. package/dist/card/Card.js +0 -217
  375. package/dist/checkbox/Checkbox.js +0 -224
  376. package/dist/checkbox/Checkbox.stories.js +0 -144
  377. package/dist/checkbox/readme.md +0 -116
  378. package/dist/chip/Chip.js +0 -173
  379. package/dist/common/OpenSans.css +0 -81
  380. package/dist/common/RequiredComponent.js +0 -46
  381. package/dist/common/services/example-service.js +0 -10
  382. package/dist/common/services/example-service.test.js +0 -12
  383. package/dist/common/utils.js +0 -42
  384. package/dist/common/variables.js +0 -400
  385. package/dist/date/Date.js +0 -357
  386. package/dist/date/Date.stories.js +0 -205
  387. package/dist/date/calendar.svg +0 -1
  388. package/dist/date/calendar_dark.svg +0 -1
  389. package/dist/date/readme.md +0 -73
  390. package/dist/dialog/Dialog.js +0 -197
  391. package/dist/dialog/Dialog.stories.js +0 -217
  392. package/dist/dialog/readme.md +0 -32
  393. package/dist/dropdown/Dropdown.js +0 -424
  394. package/dist/dropdown/Dropdown.stories.js +0 -249
  395. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  396. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  397. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  398. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  399. package/dist/dropdown/readme.md +0 -69
  400. package/dist/footer/Footer.js +0 -346
  401. package/dist/footer/Footer.stories.js +0 -94
  402. package/dist/footer/dxc_logo_wht.png +0 -0
  403. package/dist/footer/readme.md +0 -41
  404. package/dist/header/Header.js +0 -372
  405. package/dist/header/Header.stories.js +0 -176
  406. package/dist/header/close_icon.svg +0 -1
  407. package/dist/header/dxc_logo_black.png +0 -0
  408. package/dist/header/dxc_logo_white.png +0 -0
  409. package/dist/header/hamb_menu_black.svg +0 -1
  410. package/dist/header/hamb_menu_white.svg +0 -1
  411. package/dist/header/readme.md +0 -33
  412. package/dist/heading/Heading.js +0 -153
  413. package/dist/input-text/InputText.js +0 -519
  414. package/dist/input-text/InputText.stories.js +0 -209
  415. package/dist/input-text/error.svg +0 -1
  416. package/dist/input-text/readme.md +0 -91
  417. package/dist/link/Link.js +0 -136
  418. package/dist/link/readme.md +0 -51
  419. package/dist/main.js +0 -263
  420. package/dist/paginator/Paginator.js +0 -196
  421. package/dist/paginator/images/next.svg +0 -3
  422. package/dist/paginator/images/nextPage.svg +0 -3
  423. package/dist/paginator/images/previous.svg +0 -3
  424. package/dist/paginator/images/previousPage.svg +0 -3
  425. package/dist/paginator/readme.md +0 -50
  426. package/dist/progress-bar/ProgressBar.js +0 -185
  427. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  428. package/dist/progress-bar/readme.md +0 -63
  429. package/dist/radio/Radio.js +0 -187
  430. package/dist/radio/Radio.stories.js +0 -166
  431. package/dist/radio/readme.md +0 -70
  432. package/dist/resultsetTable/ResultsetTable.js +0 -333
  433. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  434. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  435. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  436. package/dist/select/Select.js +0 -445
  437. package/dist/select/Select.stories.js +0 -235
  438. package/dist/select/readme.md +0 -72
  439. package/dist/sidenav/Sidenav.js +0 -236
  440. package/dist/sidenav/arrow_icon.svg +0 -3
  441. package/dist/slider/Slider.js +0 -258
  442. package/dist/slider/Slider.stories.js +0 -241
  443. package/dist/slider/readme.md +0 -64
  444. package/dist/spinner/Spinner.js +0 -193
  445. package/dist/spinner/Spinner.stories.js +0 -183
  446. package/dist/spinner/readme.md +0 -65
  447. package/dist/switch/Switch.js +0 -199
  448. package/dist/switch/Switch.stories.js +0 -134
  449. package/dist/switch/readme.md +0 -133
  450. package/dist/table/Table.js +0 -87
  451. package/dist/tabs/Tabs.js +0 -172
  452. package/dist/tabs/Tabs.stories.js +0 -130
  453. package/dist/tabs/readme.md +0 -78
  454. package/dist/tabs-for-sections/TabsForSections.js +0 -107
  455. package/dist/tabs-for-sections/readme.md +0 -78
  456. package/dist/tag/Tag.js +0 -217
  457. package/dist/textarea/Textarea.js +0 -227
  458. package/dist/toggle/Toggle.js +0 -223
  459. package/dist/toggle/Toggle.stories.js +0 -297
  460. package/dist/toggle/readme.md +0 -80
  461. package/dist/upload/Upload.js +0 -200
  462. package/dist/upload/Upload.stories.js +0 -72
  463. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -122
  464. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  465. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  466. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -279
  467. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  468. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  469. package/dist/upload/file-upload/FileToUpload.js +0 -158
  470. package/dist/upload/file-upload/audio-icon.svg +0 -4
  471. package/dist/upload/file-upload/close.svg +0 -4
  472. package/dist/upload/file-upload/file-icon.svg +0 -4
  473. package/dist/upload/file-upload/video-icon.svg +0 -4
  474. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  475. package/dist/upload/readme.md +0 -37
  476. package/dist/upload/transaction/Transaction.js +0 -155
  477. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  478. package/dist/upload/transaction/audio-icon.svg +0 -4
  479. package/dist/upload/transaction/error-icon.svg +0 -4
  480. package/dist/upload/transaction/file-icon-err.svg +0 -4
  481. package/dist/upload/transaction/file-icon.svg +0 -4
  482. package/dist/upload/transaction/image-icon-err.svg +0 -4
  483. package/dist/upload/transaction/image-icon.svg +0 -4
  484. package/dist/upload/transaction/success-icon.svg +0 -4
  485. package/dist/upload/transaction/video-icon-err.svg +0 -4
  486. package/dist/upload/transaction/video-icon.svg +0 -4
  487. package/dist/upload/transactions/Transactions.js +0 -120
  488. package/dist/wizard/Wizard.js +0 -327
  489. package/dist/wizard/invalid_icon.svg +0 -6
  490. package/dist/wizard/valid_icon.svg +0 -6
  491. package/dist/wizard/validation-wrong.svg +0 -6
  492. package/test/Accordion.test.js +0 -33
  493. package/test/Alert.test.js +0 -53
  494. package/test/Box.test.js +0 -10
  495. package/test/Button.test.js +0 -18
  496. package/test/Card.test.js +0 -30
  497. package/test/Checkbox.test.js +0 -45
  498. package/test/Chip.test.js +0 -25
  499. package/test/Date.test.js +0 -393
  500. package/test/Dialog.test.js +0 -23
  501. package/test/Dropdown.test.js +0 -130
  502. package/test/Footer.test.js +0 -99
  503. package/test/Header.test.js +0 -39
  504. package/test/Heading.test.js +0 -35
  505. package/test/InputText.test.js +0 -236
  506. package/test/Link.test.js +0 -25
  507. package/test/Paginator.test.js +0 -165
  508. package/test/ProgressBar.test.js +0 -35
  509. package/test/Radio.test.js +0 -37
  510. package/test/ResultsetTable.test.js +0 -282
  511. package/test/Select.test.js +0 -191
  512. package/test/Sidenav.test.js +0 -87
  513. package/test/Slider.test.js +0 -65
  514. package/test/Spinner.test.js +0 -27
  515. package/test/Switch.test.js +0 -45
  516. package/test/Table.test.js +0 -36
  517. package/test/Tabs.test.js +0 -88
  518. package/test/TabsForSections.test.js +0 -34
  519. package/test/Tag.test.js +0 -32
  520. package/test/TextArea.test.js +0 -52
  521. package/test/Toggle.test.js +0 -43
  522. package/test/Upload.test.js +0 -60
  523. package/test/Wizard.test.js +0 -130
  524. package/test/mocks/pngMock.js +0 -1
  525. package/test/mocks/svgMock.js +0 -1
  526. /package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  527. /package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  528. /package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  529. /package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  530. /package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  531. /package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  532. /package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  533. /package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  534. /package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  535. /package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
package/table/Table.stories.tsx ADDED
@@ -0,0 +1,615 @@
1
+ import React from "react";
2
+ import DxcTable from "./Table";
3
+ import Title from "../../.storybook/components/Title";
4
+ import ExampleContainer from "../../.storybook/components/ExampleContainer";
5
+ import { HalstackProvider } from "../HalstackContext";
6
+ import { userEvent, within } from "@storybook/testing-library";
7
+
8
+ export default {
9
+ title: "Table",
10
+ component: DxcTable,
11
+ };
12
+
13
+ const opinionatedTheme = {
14
+ table: {
15
+ baseColor: "#5f249f",
16
+ headerFontColor: "#ffffff",
17
+ cellFontColor: "#000000",
18
+ },
19
+ };
20
+
21
+ const icon1 = (
22
+ <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
23
+ <path d="M0 0h24v24H0V0z" fill="none" />
24
+ <path d="M7.77 6.76L6.23 5.48.82 12l5.41 6.52 1.54-1.28L3.42 12l4.35-5.24zM7 13h2v-2H7v2zm10-2h-2v2h2v-2zm-6 2h2v-2h-2v2zm6.77-7.52l-1.54 1.28L20.58 12l-4.35 5.24 1.54 1.28L23.18 12l-5.41-6.52z" />
25
+ </svg>
26
+ );
27
+
28
+ const actions = [
29
+ {
30
+ title: "icon",
31
+ onClick: (value?) => {
32
+ console.log(value);
33
+ },
34
+ options: [
35
+ {
36
+ value: "1",
37
+ label: "Amazon with a very long text",
38
+ },
39
+ {
40
+ value: "2",
41
+ label: "Ebay",
42
+ },
43
+ {
44
+ value: "3",
45
+ label: "Apple",
46
+ },
47
+ ],
48
+ },
49
+ {
50
+ title: "icon",
51
+ onClick: (value?) => {
52
+ console.log(value);
53
+ },
54
+ options: [
55
+ {
56
+ value: "1",
57
+ label: "Amazon with a very long text",
58
+ },
59
+ {
60
+ value: "2",
61
+ label: "Ebay",
62
+ },
63
+ {
64
+ value: "3",
65
+ label: "Apple",
66
+ },
67
+ ],
68
+ },
69
+ {
70
+ disabled: true,
71
+ title: "icon",
72
+ onClick: (value?) => {
73
+ console.log(value);
74
+ },
75
+ options: [
76
+ {
77
+ value: "1",
78
+ label: "Amazon with a very long text",
79
+ },
80
+ {
81
+ value: "2",
82
+ label: "Ebay",
83
+ },
84
+ {
85
+ value: "3",
86
+ label: "Apple",
87
+ },
88
+ ],
89
+ },
90
+ {
91
+ icon: icon1,
92
+ title: "icon",
93
+ onClick: () => {},
94
+ },
95
+ {
96
+ icon: icon1,
97
+ title: "icon",
98
+ onClick: () => {},
99
+ disabled: true,
100
+ },
101
+ ];
102
+
103
+ export const Chromatic = () => (
104
+ <>
105
+ <ExampleContainer>
106
+ <Title title="Default" theme="light" level={4} />
107
+ <DxcTable>
108
+ <tr>
109
+ <th>header 1</th>
110
+ <th>header 2</th>
111
+ <th>actions</th>
112
+ </tr>
113
+ <tr>
114
+ <td>cell 1</td>
115
+ <td>cell 2</td>
116
+ <td>
117
+ <DxcTable.ActionsCell actions={actions} />
118
+ </td>
119
+ </tr>
120
+ <tr>
121
+ <td>cell 4</td>
122
+ <td>cell 5</td>
123
+ <td>
124
+ <DxcTable.ActionsCell actions={actions} />
125
+ </td>
126
+ </tr>
127
+ <tr>
128
+ <td>cell 7</td>
129
+ <td>cell 8</td>
130
+ <td>
131
+ <DxcTable.ActionsCell actions={actions} />
132
+ </td>
133
+ </tr>
134
+ </DxcTable>
135
+ </ExampleContainer>
136
+ <ExampleContainer>
137
+ <Title title="With scrollbar" theme="light" level={4} />
138
+ <div
139
+ style={{ height: 200 + "px", display: "flex", flexDirection: "row", width: 100 + "%", marginBottom: 50 + "px" }}
140
+ >
141
+ <DxcTable>
142
+ <tr>
143
+ <th>
144
+ header<br></br>subheader
145
+ </th>
146
+ <th>
147
+ header<br></br>subheader
148
+ </th>
149
+ <th>
150
+ header<br></br>subheader
151
+ </th>
152
+ </tr>
153
+ <tr>
154
+ <td>
155
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
156
+ dolore magna aliqua.
157
+ </td>
158
+ <td>
159
+ Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
160
+ consequat.
161
+ </td>
162
+ <td>
163
+ Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
164
+ </td>
165
+ </tr>
166
+ <tr>
167
+ <td>cell data</td>
168
+ <td>cell data</td>
169
+ <td>cell data</td>
170
+ </tr>
171
+ <tr>
172
+ <td>cell data</td>
173
+ <td>cell data</td>
174
+ <td>cell data</td>
175
+ </tr>
176
+ <tr>
177
+ <td>cell data</td>
178
+ <td>cell data</td>
179
+ <td>cell data</td>
180
+ </tr>
181
+ <tr>
182
+ <td>cell data</td>
183
+ <td>cell data</td>
184
+ <td>cell data</td>
185
+ </tr>
186
+ <tr>
187
+ <td>cell data</td>
188
+ <td>cell data</td>
189
+ <td>cell data</td>
190
+ </tr>
191
+ <tr>
192
+ <td>cell data</td>
193
+ <td>cell data</td>
194
+ <td>cell data</td>
195
+ </tr>
196
+ <tr>
197
+ <td>cell data</td>
198
+ <td>cell data</td>
199
+ <td>cell data</td>
200
+ </tr>
201
+ <tr>
202
+ <td>cell data</td>
203
+ <td>cell data</td>
204
+ <td>cell data</td>
205
+ </tr>
206
+ </DxcTable>
207
+ </div>
208
+ </ExampleContainer>
209
+ <ExampleContainer>
210
+ <Title title="Default reduced" theme="light" level={4} />
211
+ <DxcTable mode="reduced">
212
+ <tr>
213
+ <th>header 1</th>
214
+ <th>header 2</th>
215
+ <th>header 3</th>
216
+ </tr>
217
+ <tr>
218
+ <td>cell 1</td>
219
+ <td>cell 2</td>
220
+ <td>cell 3</td>
221
+ </tr>
222
+ <tr>
223
+ <td>cell 4</td>
224
+ <td>cell 5</td>
225
+ <td>cell 6</td>
226
+ </tr>
227
+ <tr>
228
+ <td>cell 7</td>
229
+ <td>cell 8</td>
230
+ <td>Cell 9</td>
231
+ </tr>
232
+ </DxcTable>
233
+ </ExampleContainer>
234
+ <ExampleContainer>
235
+ <Title title="Reduced with scrollbar" theme="light" level={4} />
236
+ <div
237
+ style={{ height: 200 + "px", display: "flex", flexDirection: "row", width: 100 + "%", marginBottom: 50 + "px" }}
238
+ >
239
+ <DxcTable mode="reduced">
240
+ <tr>
241
+ <th>
242
+ header<br></br>subheader
243
+ </th>
244
+ <th>
245
+ header<br></br>subheader
246
+ </th>
247
+ <th>
248
+ header<br></br>subheader
249
+ </th>
250
+ </tr>
251
+ <tr>
252
+ <td>
253
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
254
+ dolore magna aliqua.
255
+ </td>
256
+ <td>
257
+ Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
258
+ consequat.
259
+ </td>
260
+ <td>
261
+ Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
262
+ </td>
263
+ </tr>
264
+ <tr>
265
+ <td>cell data</td>
266
+ <td>cell data</td>
267
+ <td>cell data</td>
268
+ </tr>
269
+ <tr>
270
+ <td>cell data</td>
271
+ <td>cell data</td>
272
+ <td>cell data</td>
273
+ </tr>
274
+ <tr>
275
+ <td>cell data</td>
276
+ <td>cell data</td>
277
+ <td>cell data</td>
278
+ </tr>
279
+ <tr>
280
+ <td>cell data</td>
281
+ <td>cell data</td>
282
+ <td>cell data</td>
283
+ </tr>
284
+ <tr>
285
+ <td>cell data</td>
286
+ <td>cell data</td>
287
+ <td>cell data</td>
288
+ </tr>
289
+ <tr>
290
+ <td>cell data</td>
291
+ <td>cell data</td>
292
+ <td>cell data</td>
293
+ </tr>
294
+ <tr>
295
+ <td>cell data</td>
296
+ <td>cell data</td>
297
+ <td>cell data</td>
298
+ </tr>
299
+ <tr>
300
+ <td>cell data</td>
301
+ <td>cell data</td>
302
+ <td>cell data</td>
303
+ </tr>
304
+ </DxcTable>
305
+ </div>
306
+ </ExampleContainer>
307
+ <ExampleContainer>
308
+ <Title title="Reduced table with actions" theme="light" level={4} />
309
+ <DxcTable mode="reduced">
310
+ <tr>
311
+ <th>header 1</th>
312
+ <th>header 2</th>
313
+ <th>header 3</th>
314
+ </tr>
315
+ <tr>
316
+ <td>cell 1</td>
317
+ <td>cell 2</td>
318
+ <td>
319
+ <DxcTable.ActionsCell actions={actions} />
320
+ </td>
321
+ </tr>
322
+ <tr>
323
+ <td>cell 4</td>
324
+ <td>cell 5</td>
325
+ <td>
326
+ <DxcTable.ActionsCell actions={actions} />
327
+ </td>
328
+ </tr>
329
+ <tr>
330
+ <td>cell 7</td>
331
+ <td>cell 8</td>
332
+ <td>
333
+ <DxcTable.ActionsCell actions={actions} />
334
+ </td>
335
+ </tr>
336
+ </DxcTable>
337
+ </ExampleContainer>
338
+ <Title title="Margins" theme="light" level={2} />
339
+ <ExampleContainer>
340
+ <Title title="Xxsmall margin" theme="light" level={4} />
341
+ <DxcTable margin="xxsmall">
342
+ <tr>
343
+ <th>header 1</th>
344
+ <th>header 2</th>
345
+ <th>header 3</th>
346
+ </tr>
347
+ <tr>
348
+ <td>cell 1</td>
349
+ <td>cell 2</td>
350
+ <td>cell 3</td>
351
+ </tr>
352
+ <tr>
353
+ <td>cell 4</td>
354
+ <td>cell 5</td>
355
+ <td>cell 6</td>
356
+ </tr>
357
+ <tr>
358
+ <td>cell 7</td>
359
+ <td>cell 8</td>
360
+ <td>Cell 9</td>
361
+ </tr>
362
+ </DxcTable>
363
+ <Title title="Xsmall margin" theme="light" level={4} />
364
+ <DxcTable margin="xsmall">
365
+ <tr>
366
+ <th>header 1</th>
367
+ <th>header 2</th>
368
+ <th>header 3</th>
369
+ </tr>
370
+ <tr>
371
+ <td>cell 1</td>
372
+ <td>cell 2</td>
373
+ <td>cell 3</td>
374
+ </tr>
375
+ <tr>
376
+ <td>cell 4</td>
377
+ <td>cell 5</td>
378
+ <td>cell 6</td>
379
+ </tr>
380
+ <tr>
381
+ <td>cell 7</td>
382
+ <td>cell 8</td>
383
+ <td>Cell 9</td>
384
+ </tr>
385
+ </DxcTable>
386
+ <Title title="Small margin" theme="light" level={4} />
387
+ <DxcTable margin="small">
388
+ <tr>
389
+ <th>header 1</th>
390
+ <th>header 2</th>
391
+ <th>header 3</th>
392
+ </tr>
393
+ <tr>
394
+ <td>cell 1</td>
395
+ <td>cell 2</td>
396
+ <td>cell 3</td>
397
+ </tr>
398
+ <tr>
399
+ <td>cell 4</td>
400
+ <td>cell 5</td>
401
+ <td>cell 6</td>
402
+ </tr>
403
+ <tr>
404
+ <td>cell 7</td>
405
+ <td>cell 8</td>
406
+ <td>Cell 9</td>
407
+ </tr>
408
+ </DxcTable>
409
+ <Title title="Medium margin" theme="light" level={4} />
410
+ <DxcTable margin="medium">
411
+ <tr>
412
+ <th>header 1</th>
413
+ <th>header 2</th>
414
+ <th>header 3</th>
415
+ </tr>
416
+ <tr>
417
+ <td>cell 1</td>
418
+ <td>cell 2</td>
419
+ <td>cell 3</td>
420
+ </tr>
421
+ <tr>
422
+ <td>cell 4</td>
423
+ <td>cell 5</td>
424
+ <td>cell 6</td>
425
+ </tr>
426
+ <tr>
427
+ <td>cell 7</td>
428
+ <td>cell 8</td>
429
+ <td>Cell 9</td>
430
+ </tr>
431
+ </DxcTable>
432
+ <Title title="Large margin" theme="light" level={4} />
433
+ <DxcTable margin="large">
434
+ <tr>
435
+ <th>header 1</th>
436
+ <th>header 2</th>
437
+ <th>header 3</th>
438
+ </tr>
439
+ <tr>
440
+ <td>cell 1</td>
441
+ <td>cell 2</td>
442
+ <td>cell 3</td>
443
+ </tr>
444
+ <tr>
445
+ <td>cell 4</td>
446
+ <td>cell 5</td>
447
+ <td>cell 6</td>
448
+ </tr>
449
+ <tr>
450
+ <td>cell 7</td>
451
+ <td>cell 8</td>
452
+ <td>Cell 9</td>
453
+ </tr>
454
+ </DxcTable>
455
+ <Title title="Xlarge margin" theme="light" level={4} />
456
+ <DxcTable margin="xlarge">
457
+ <tr>
458
+ <th>header 1</th>
459
+ <th>header 2</th>
460
+ <th>header 3</th>
461
+ </tr>
462
+ <tr>
463
+ <td>cell 1</td>
464
+ <td>cell 2</td>
465
+ <td>cell 3</td>
466
+ </tr>
467
+ <tr>
468
+ <td>cell 4</td>
469
+ <td>cell 5</td>
470
+ <td>cell 6</td>
471
+ </tr>
472
+ <tr>
473
+ <td>cell 7</td>
474
+ <td>cell 8</td>
475
+ <td>Cell 9</td>
476
+ </tr>
477
+ </DxcTable>
478
+ <Title title="Xxlarge margin" theme="light" level={4} />
479
+ <DxcTable margin="xxlarge">
480
+ <tr>
481
+ <th>header 1</th>
482
+ <th>header 2</th>
483
+ <th>header 3</th>
484
+ </tr>
485
+ <tr>
486
+ <td>cell 1</td>
487
+ <td>cell 2</td>
488
+ <td>cell 3</td>
489
+ </tr>
490
+ <tr>
491
+ <td>cell 4</td>
492
+ <td>cell 5</td>
493
+ <td>cell 6</td>
494
+ </tr>
495
+ <tr>
496
+ <td>cell 7</td>
497
+ <td>cell 8</td>
498
+ <td>Cell 9</td>
499
+ </tr>
500
+ </DxcTable>
501
+ </ExampleContainer>
502
+ <Title title="Opinionated theme" theme="light" level={2} />
503
+ <ExampleContainer>
504
+ <HalstackProvider theme={opinionatedTheme}>
505
+ <DxcTable>
506
+ <tr>
507
+ <th>
508
+ header<br></br>subheader
509
+ </th>
510
+ <th>
511
+ header<br></br>subheader
512
+ </th>
513
+ <th>
514
+ header<br></br>subheader
515
+ </th>
516
+ </tr>
517
+ <tr>
518
+ <td>
519
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
520
+ dolore magna aliqua.
521
+ </td>
522
+ <td>
523
+ Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
524
+ consequat.
525
+ </td>
526
+ <td>
527
+ Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
528
+ </td>
529
+ </tr>
530
+ <tr>
531
+ <td>cell data</td>
532
+ <td>cell data</td>
533
+ <td>cell data</td>
534
+ </tr>
535
+ <tr>
536
+ <td>cell data</td>
537
+ <td>cell data</td>
538
+ <td>cell data</td>
539
+ </tr>
540
+ <tr>
541
+ <td>cell data</td>
542
+ <td>cell data</td>
543
+ <td>cell data</td>
544
+ </tr>
545
+ <tr>
546
+ <td>cell data</td>
547
+ <td>cell data</td>
548
+ <td>cell data</td>
549
+ </tr>
550
+ <tr>
551
+ <td>cell data</td>
552
+ <td>cell data</td>
553
+ <td>cell data</td>
554
+ </tr>
555
+ <tr>
556
+ <td>cell data</td>
557
+ <td>cell data</td>
558
+ <td>cell data</td>
559
+ </tr>
560
+ <tr>
561
+ <td>cell data</td>
562
+ <td>cell data</td>
563
+ <td>cell data</td>
564
+ </tr>
565
+ <tr>
566
+ <td>cell data</td>
567
+ <td>cell data</td>
568
+ <td>cell data</td>
569
+ </tr>
570
+ </DxcTable>
571
+ </HalstackProvider>
572
+ </ExampleContainer>
573
+ </>
574
+ );
575
+
576
+ const ActionsCellDropdown = () => (
577
+ <ExampleContainer>
578
+ <Title title="Dropdown Action" theme="light" level={4} />
579
+ <DxcTable>
580
+ <tr>
581
+ <th>header 1</th>
582
+ <th>header 2</th>
583
+ <th>actions</th>
584
+ </tr>
585
+ <tr>
586
+ <td>cell 1</td>
587
+ <td>cell 2</td>
588
+ <td>
589
+ <DxcTable.ActionsCell actions={actions} />
590
+ </td>
591
+ </tr>
592
+ <tr>
593
+ <td>cell 4</td>
594
+ <td>cell 5</td>
595
+ <td>
596
+ <DxcTable.ActionsCell actions={actions} />
597
+ </td>
598
+ </tr>
599
+ <tr>
600
+ <td>cell 7</td>
601
+ <td>cell 8</td>
602
+ <td>
603
+ <DxcTable.ActionsCell actions={actions} />
604
+ </td>
605
+ </tr>
606
+ </DxcTable>
607
+ </ExampleContainer>
608
+ );
609
+
610
+ export const DropdownAction = ActionsCellDropdown.bind({});
611
+ DropdownAction.play = async ({ canvasElement }) => {
612
+ const canvas = within(canvasElement);
613
+ const nextButton = canvas.getAllByRole("button")[8];
614
+ await userEvent.click(nextButton);
615
+ };