@dxc-technology/halstack-react 0.0.0-b1729d7 → 0.0.0-b18ba60

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 (680) hide show
  1. package/BackgroundColorContext.d.ts +1 -0
  2. package/BackgroundColorContext.js +30 -0
  3. package/HalstackContext.d.ts +1247 -0
  4. package/HalstackContext.js +310 -0
  5. package/README.md +28 -47
  6. package/accordion/Accordion.accessibility.test.d.ts +1 -0
  7. package/accordion/Accordion.accessibility.test.js +71 -0
  8. package/accordion/Accordion.d.ts +4 -0
  9. package/accordion/Accordion.js +168 -0
  10. package/accordion/Accordion.stories.tsx +241 -0
  11. package/accordion/Accordion.test.d.ts +1 -0
  12. package/accordion/Accordion.test.js +56 -0
  13. package/accordion/types.d.ts +57 -0
  14. package/accordion/types.js +5 -0
  15. package/accordion-group/AccordionGroup.accessibility.test.d.ts +1 -0
  16. package/accordion-group/AccordionGroup.accessibility.test.js +82 -0
  17. package/accordion-group/AccordionGroup.d.ts +7 -0
  18. package/accordion-group/AccordionGroup.js +101 -0
  19. package/accordion-group/AccordionGroup.stories.tsx +252 -0
  20. package/accordion-group/AccordionGroup.test.d.ts +1 -0
  21. package/accordion-group/AccordionGroup.test.js +94 -0
  22. package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
  23. package/accordion-group/AccordionGroupAccordion.js +31 -0
  24. package/accordion-group/AccordionGroupContext.d.ts +3 -0
  25. package/accordion-group/AccordionGroupContext.js +8 -0
  26. package/accordion-group/types.d.ts +67 -0
  27. package/accordion-group/types.js +5 -0
  28. package/action-icon/ActionIcon.accessibility.test.d.ts +1 -0
  29. package/action-icon/ActionIcon.accessibility.test.js +63 -0
  30. package/action-icon/ActionIcon.d.ts +4 -0
  31. package/action-icon/ActionIcon.js +48 -0
  32. package/action-icon/ActionIcon.stories.tsx +41 -0
  33. package/action-icon/ActionIcon.test.d.ts +1 -0
  34. package/action-icon/ActionIcon.test.js +64 -0
  35. package/action-icon/types.d.ts +26 -0
  36. package/action-icon/types.js +5 -0
  37. package/alert/Alert.accessibility.test.d.ts +1 -0
  38. package/alert/Alert.accessibility.test.js +95 -0
  39. package/alert/Alert.d.ts +4 -0
  40. package/alert/Alert.js +203 -0
  41. package/alert/Alert.stories.tsx +198 -0
  42. package/alert/Alert.test.d.ts +1 -0
  43. package/alert/Alert.test.js +75 -0
  44. package/alert/types.d.ts +49 -0
  45. package/alert/types.js +5 -0
  46. package/badge/Badge.accessibility.test.d.ts +1 -0
  47. package/badge/Badge.accessibility.test.js +129 -0
  48. package/badge/Badge.d.ts +4 -0
  49. package/badge/Badge.js +161 -0
  50. package/badge/Badge.stories.tsx +210 -0
  51. package/badge/Badge.test.d.ts +1 -0
  52. package/badge/Badge.test.js +30 -0
  53. package/badge/types.d.ts +54 -0
  54. package/badge/types.js +5 -0
  55. package/bleed/Bleed.d.ts +3 -0
  56. package/bleed/Bleed.js +43 -0
  57. package/bleed/Bleed.stories.tsx +342 -0
  58. package/bleed/types.d.ts +37 -0
  59. package/bleed/types.js +5 -0
  60. package/box/Box.accessibility.test.d.ts +1 -0
  61. package/box/Box.accessibility.test.js +33 -0
  62. package/box/Box.d.ts +4 -0
  63. package/box/Box.js +75 -0
  64. package/box/Box.stories.tsx +119 -0
  65. package/box/Box.test.d.ts +1 -0
  66. package/box/Box.test.js +13 -0
  67. package/box/types.d.ts +32 -0
  68. package/box/types.js +5 -0
  69. package/breadcrumbs/Breadcrumbs.accessibility.test.d.ts +1 -0
  70. package/breadcrumbs/Breadcrumbs.accessibility.test.js +96 -0
  71. package/breadcrumbs/Breadcrumbs.d.ts +4 -0
  72. package/breadcrumbs/Breadcrumbs.js +79 -0
  73. package/breadcrumbs/Breadcrumbs.stories.tsx +194 -0
  74. package/breadcrumbs/Breadcrumbs.test.d.ts +1 -0
  75. package/breadcrumbs/Breadcrumbs.test.js +169 -0
  76. package/breadcrumbs/Item.d.ts +4 -0
  77. package/breadcrumbs/Item.js +52 -0
  78. package/breadcrumbs/dropdownTheme.d.ts +53 -0
  79. package/breadcrumbs/dropdownTheme.js +62 -0
  80. package/breadcrumbs/types.d.ts +16 -0
  81. package/breadcrumbs/types.js +5 -0
  82. package/bulleted-list/BulletedList.accessibility.test.d.ts +1 -0
  83. package/bulleted-list/BulletedList.accessibility.test.js +119 -0
  84. package/bulleted-list/BulletedList.d.ts +7 -0
  85. package/bulleted-list/BulletedList.js +92 -0
  86. package/bulleted-list/BulletedList.stories.tsx +115 -0
  87. package/bulleted-list/types.d.ts +38 -0
  88. package/bulleted-list/types.js +5 -0
  89. package/button/Button.accessibility.test.d.ts +1 -0
  90. package/button/Button.accessibility.test.js +127 -0
  91. package/button/Button.d.ts +4 -0
  92. package/button/Button.js +121 -0
  93. package/button/Button.stories.tsx +325 -0
  94. package/button/Button.test.d.ts +1 -0
  95. package/button/Button.test.js +38 -0
  96. package/button/types.d.ts +57 -0
  97. package/button/types.js +5 -0
  98. package/card/Card.accessibility.test.d.ts +1 -0
  99. package/card/Card.accessibility.test.js +36 -0
  100. package/card/Card.d.ts +4 -0
  101. package/card/Card.js +121 -0
  102. package/card/Card.stories.tsx +171 -0
  103. package/card/Card.test.d.ts +1 -0
  104. package/card/Card.test.js +39 -0
  105. package/card/types.d.ts +62 -0
  106. package/card/types.js +5 -0
  107. package/checkbox/Checkbox.accessibility.test.d.ts +1 -0
  108. package/checkbox/Checkbox.accessibility.test.js +87 -0
  109. package/checkbox/Checkbox.d.ts +4 -0
  110. package/checkbox/Checkbox.js +212 -0
  111. package/checkbox/Checkbox.stories.tsx +222 -0
  112. package/checkbox/Checkbox.test.d.ts +1 -0
  113. package/checkbox/Checkbox.test.js +199 -0
  114. package/checkbox/types.d.ts +72 -0
  115. package/checkbox/types.js +5 -0
  116. package/chip/Chip.accessibility.test.d.ts +1 -0
  117. package/chip/Chip.accessibility.test.js +69 -0
  118. package/chip/Chip.d.ts +4 -0
  119. package/chip/Chip.js +115 -0
  120. package/chip/Chip.stories.tsx +231 -0
  121. package/chip/Chip.test.d.ts +1 -0
  122. package/chip/Chip.test.js +41 -0
  123. package/chip/types.d.ts +68 -0
  124. package/chip/types.js +5 -0
  125. package/common/coreTokens.d.ts +237 -0
  126. package/common/coreTokens.js +184 -0
  127. package/common/utils.d.ts +1 -0
  128. package/{dist/common → common}/utils.js +6 -12
  129. package/common/variables.d.ts +1390 -0
  130. package/common/variables.js +1262 -0
  131. package/container/Container.d.ts +4 -0
  132. package/container/Container.js +194 -0
  133. package/container/Container.stories.tsx +214 -0
  134. package/container/types.d.ts +74 -0
  135. package/container/types.js +5 -0
  136. package/contextual-menu/ContextualMenu.accessibility.test.d.ts +1 -0
  137. package/contextual-menu/ContextualMenu.accessibility.test.js +98 -0
  138. package/contextual-menu/ContextualMenu.d.ts +5 -0
  139. package/contextual-menu/ContextualMenu.js +88 -0
  140. package/contextual-menu/ContextualMenu.stories.tsx +232 -0
  141. package/contextual-menu/ContextualMenu.test.d.ts +1 -0
  142. package/contextual-menu/ContextualMenu.test.js +205 -0
  143. package/contextual-menu/GroupItem.d.ts +4 -0
  144. package/contextual-menu/GroupItem.js +67 -0
  145. package/contextual-menu/ItemAction.d.ts +4 -0
  146. package/contextual-menu/ItemAction.js +51 -0
  147. package/contextual-menu/MenuItem.d.ts +4 -0
  148. package/contextual-menu/MenuItem.js +29 -0
  149. package/contextual-menu/SingleItem.d.ts +4 -0
  150. package/contextual-menu/SingleItem.js +38 -0
  151. package/contextual-menu/types.d.ts +58 -0
  152. package/contextual-menu/types.js +5 -0
  153. package/date-input/Calendar.d.ts +4 -0
  154. package/date-input/Calendar.js +214 -0
  155. package/date-input/DateInput.accessibility.test.d.ts +1 -0
  156. package/date-input/DateInput.accessibility.test.js +230 -0
  157. package/date-input/DateInput.d.ts +4 -0
  158. package/date-input/DateInput.js +222 -0
  159. package/date-input/DateInput.stories.tsx +292 -0
  160. package/date-input/DateInput.test.d.ts +1 -0
  161. package/date-input/DateInput.test.js +809 -0
  162. package/date-input/DatePicker.d.ts +4 -0
  163. package/date-input/DatePicker.js +121 -0
  164. package/date-input/YearPicker.d.ts +4 -0
  165. package/date-input/YearPicker.js +100 -0
  166. package/date-input/types.d.ts +164 -0
  167. package/date-input/types.js +5 -0
  168. package/dialog/Dialog.accessibility.test.d.ts +1 -0
  169. package/dialog/Dialog.accessibility.test.js +69 -0
  170. package/dialog/Dialog.d.ts +4 -0
  171. package/dialog/Dialog.js +93 -0
  172. package/dialog/Dialog.stories.tsx +370 -0
  173. package/dialog/Dialog.test.d.ts +1 -0
  174. package/dialog/Dialog.test.js +371 -0
  175. package/dialog/types.d.ts +36 -0
  176. package/dialog/types.js +5 -0
  177. package/divider/Divider.accessibility.test.d.ts +1 -0
  178. package/divider/Divider.accessibility.test.js +33 -0
  179. package/divider/Divider.d.ts +4 -0
  180. package/divider/Divider.js +36 -0
  181. package/divider/Divider.stories.tsx +223 -0
  182. package/divider/Divider.test.d.ts +1 -0
  183. package/divider/Divider.test.js +38 -0
  184. package/divider/types.d.ts +21 -0
  185. package/divider/types.js +5 -0
  186. package/dropdown/Dropdown.accessibility.test.d.ts +1 -0
  187. package/dropdown/Dropdown.accessibility.test.js +184 -0
  188. package/dropdown/Dropdown.d.ts +4 -0
  189. package/dropdown/Dropdown.js +320 -0
  190. package/dropdown/Dropdown.stories.tsx +427 -0
  191. package/dropdown/Dropdown.test.d.ts +1 -0
  192. package/dropdown/Dropdown.test.js +629 -0
  193. package/dropdown/DropdownMenu.d.ts +4 -0
  194. package/dropdown/DropdownMenu.js +63 -0
  195. package/dropdown/DropdownMenuItem.d.ts +4 -0
  196. package/dropdown/DropdownMenuItem.js +71 -0
  197. package/dropdown/types.d.ts +96 -0
  198. package/dropdown/types.js +5 -0
  199. package/file-input/FileInput.accessibility.test.d.ts +1 -0
  200. package/file-input/FileInput.accessibility.test.js +167 -0
  201. package/file-input/FileInput.d.ts +4 -0
  202. package/file-input/FileInput.js +440 -0
  203. package/file-input/FileInput.stories.tsx +618 -0
  204. package/file-input/FileInput.test.d.ts +1 -0
  205. package/file-input/FileInput.test.js +404 -0
  206. package/file-input/FileItem.d.ts +4 -0
  207. package/file-input/FileItem.js +125 -0
  208. package/file-input/types.d.ts +129 -0
  209. package/file-input/types.js +5 -0
  210. package/flex/Flex.d.ts +4 -0
  211. package/flex/Flex.js +57 -0
  212. package/flex/Flex.stories.tsx +112 -0
  213. package/flex/types.d.ts +97 -0
  214. package/flex/types.js +5 -0
  215. package/footer/Footer.accessibility.test.d.ts +1 -0
  216. package/footer/Footer.accessibility.test.js +125 -0
  217. package/footer/Footer.d.ts +4 -0
  218. package/footer/Footer.js +140 -0
  219. package/footer/Footer.stories.tsx +208 -0
  220. package/footer/Footer.test.d.ts +1 -0
  221. package/footer/Footer.test.js +85 -0
  222. package/footer/Icons.d.ts +3 -0
  223. package/footer/Icons.js +108 -0
  224. package/footer/types.d.ts +64 -0
  225. package/footer/types.js +5 -0
  226. package/grid/Grid.d.ts +7 -0
  227. package/grid/Grid.js +76 -0
  228. package/grid/Grid.stories.tsx +219 -0
  229. package/grid/types.d.ts +115 -0
  230. package/grid/types.js +5 -0
  231. package/header/Header.accessibility.test.d.ts +1 -0
  232. package/header/Header.accessibility.test.js +94 -0
  233. package/header/Header.d.ts +8 -0
  234. package/header/Header.js +210 -0
  235. package/header/Header.stories.tsx +267 -0
  236. package/header/Header.test.d.ts +1 -0
  237. package/header/Header.test.js +66 -0
  238. package/header/Icons.d.ts +2 -0
  239. package/{dist/header → header}/Icons.js +8 -43
  240. package/header/types.d.ts +33 -0
  241. package/header/types.js +5 -0
  242. package/heading/Heading.accessibility.test.d.ts +1 -0
  243. package/heading/Heading.accessibility.test.js +33 -0
  244. package/heading/Heading.d.ts +4 -0
  245. package/{dist/heading → heading}/Heading.js +34 -115
  246. package/heading/Heading.stories.tsx +54 -0
  247. package/heading/Heading.test.d.ts +1 -0
  248. package/heading/Heading.test.js +156 -0
  249. package/heading/types.d.ts +33 -0
  250. package/heading/types.js +5 -0
  251. package/icon/Icon.accessibility.test.d.ts +1 -0
  252. package/icon/Icon.accessibility.test.js +30 -0
  253. package/icon/Icon.d.ts +4 -0
  254. package/icon/Icon.js +33 -0
  255. package/icon/Icon.stories.tsx +28 -0
  256. package/icon/types.d.ts +4 -0
  257. package/icon/types.js +5 -0
  258. package/image/Image.accessibility.test.d.ts +1 -0
  259. package/image/Image.accessibility.test.js +56 -0
  260. package/image/Image.d.ts +4 -0
  261. package/image/Image.js +70 -0
  262. package/image/Image.stories.tsx +129 -0
  263. package/image/types.d.ts +72 -0
  264. package/image/types.js +5 -0
  265. package/inset/Inset.d.ts +3 -0
  266. package/inset/Inset.js +43 -0
  267. package/inset/Inset.stories.tsx +230 -0
  268. package/inset/types.d.ts +37 -0
  269. package/inset/types.js +5 -0
  270. package/layout/ApplicationLayout.d.ts +20 -0
  271. package/layout/ApplicationLayout.js +137 -0
  272. package/layout/ApplicationLayout.stories.tsx +162 -0
  273. package/layout/Icons.d.ts +7 -0
  274. package/layout/Icons.js +48 -0
  275. package/layout/types.d.ts +41 -0
  276. package/layout/types.js +5 -0
  277. package/link/Link.accessibility.test.d.ts +1 -0
  278. package/link/Link.accessibility.test.js +108 -0
  279. package/link/Link.d.ts +4 -0
  280. package/link/Link.js +117 -0
  281. package/link/Link.stories.tsx +253 -0
  282. package/link/Link.test.d.ts +1 -0
  283. package/link/Link.test.js +63 -0
  284. package/link/types.d.ts +54 -0
  285. package/link/types.js +5 -0
  286. package/main.d.ts +50 -0
  287. package/{dist/main.js → main.js} +141 -144
  288. package/nav-tabs/NavTabs.accessibility.test.d.ts +1 -0
  289. package/nav-tabs/NavTabs.accessibility.test.js +44 -0
  290. package/nav-tabs/NavTabs.d.ts +7 -0
  291. package/nav-tabs/NavTabs.js +108 -0
  292. package/nav-tabs/NavTabs.stories.tsx +294 -0
  293. package/nav-tabs/NavTabs.test.d.ts +1 -0
  294. package/nav-tabs/NavTabs.test.js +77 -0
  295. package/nav-tabs/NavTabsContext.d.ts +3 -0
  296. package/nav-tabs/NavTabsContext.js +8 -0
  297. package/nav-tabs/Tab.d.ts +4 -0
  298. package/nav-tabs/Tab.js +117 -0
  299. package/nav-tabs/types.d.ts +52 -0
  300. package/nav-tabs/types.js +5 -0
  301. package/number-input/NumberInput.accessibility.test.d.ts +1 -0
  302. package/number-input/NumberInput.accessibility.test.js +228 -0
  303. package/number-input/NumberInput.d.ts +4 -0
  304. package/number-input/NumberInput.js +86 -0
  305. package/number-input/NumberInput.stories.tsx +131 -0
  306. package/number-input/NumberInput.test.d.ts +1 -0
  307. package/number-input/NumberInput.test.js +989 -0
  308. package/number-input/NumberInputContext.d.ts +3 -0
  309. package/number-input/NumberInputContext.js +8 -0
  310. package/number-input/types.d.ts +136 -0
  311. package/number-input/types.js +5 -0
  312. package/package.json +64 -56
  313. package/paginator/Paginator.accessibility.test.d.ts +1 -0
  314. package/paginator/Paginator.accessibility.test.js +79 -0
  315. package/paginator/Paginator.d.ts +4 -0
  316. package/paginator/Paginator.js +138 -0
  317. package/paginator/Paginator.stories.tsx +87 -0
  318. package/paginator/Paginator.test.d.ts +1 -0
  319. package/paginator/Paginator.test.js +335 -0
  320. package/paginator/types.d.ts +38 -0
  321. package/paginator/types.js +5 -0
  322. package/paragraph/Paragraph.accessibility.test.d.ts +1 -0
  323. package/paragraph/Paragraph.accessibility.test.js +28 -0
  324. package/paragraph/Paragraph.d.ts +5 -0
  325. package/paragraph/Paragraph.js +22 -0
  326. package/paragraph/Paragraph.stories.tsx +27 -0
  327. package/password-input/PasswordInput.accessibility.test.d.ts +1 -0
  328. package/password-input/PasswordInput.accessibility.test.js +153 -0
  329. package/password-input/PasswordInput.d.ts +4 -0
  330. package/password-input/PasswordInput.js +97 -0
  331. package/password-input/PasswordInput.stories.tsx +99 -0
  332. package/password-input/PasswordInput.test.d.ts +1 -0
  333. package/password-input/PasswordInput.test.js +198 -0
  334. package/password-input/types.d.ts +111 -0
  335. package/password-input/types.js +5 -0
  336. package/progress-bar/ProgressBar.accessibility.test.d.ts +1 -0
  337. package/progress-bar/ProgressBar.accessibility.test.js +35 -0
  338. package/progress-bar/ProgressBar.d.ts +4 -0
  339. package/progress-bar/ProgressBar.js +146 -0
  340. package/progress-bar/ProgressBar.stories.tsx +93 -0
  341. package/progress-bar/ProgressBar.test.d.ts +1 -0
  342. package/progress-bar/ProgressBar.test.js +93 -0
  343. package/progress-bar/types.d.ts +37 -0
  344. package/progress-bar/types.js +5 -0
  345. package/quick-nav/QuickNav.accessibility.test.d.ts +1 -0
  346. package/quick-nav/QuickNav.accessibility.test.js +57 -0
  347. package/quick-nav/QuickNav.d.ts +4 -0
  348. package/quick-nav/QuickNav.js +94 -0
  349. package/quick-nav/QuickNav.stories.tsx +356 -0
  350. package/quick-nav/types.d.ts +21 -0
  351. package/quick-nav/types.js +5 -0
  352. package/radio-group/Radio.d.ts +4 -0
  353. package/radio-group/Radio.js +121 -0
  354. package/radio-group/RadioGroup.accessibility.test.d.ts +1 -0
  355. package/radio-group/RadioGroup.accessibility.test.js +97 -0
  356. package/radio-group/RadioGroup.d.ts +4 -0
  357. package/radio-group/RadioGroup.js +233 -0
  358. package/radio-group/RadioGroup.stories.tsx +214 -0
  359. package/radio-group/RadioGroup.test.d.ts +1 -0
  360. package/radio-group/RadioGroup.test.js +754 -0
  361. package/radio-group/types.d.ts +114 -0
  362. package/radio-group/types.js +5 -0
  363. package/resultset-table/Icons.d.ts +7 -0
  364. package/resultset-table/Icons.js +47 -0
  365. package/resultset-table/ResultsetTable.accessibility.test.d.ts +1 -0
  366. package/resultset-table/ResultsetTable.accessibility.test.js +285 -0
  367. package/resultset-table/ResultsetTable.d.ts +7 -0
  368. package/resultset-table/ResultsetTable.js +171 -0
  369. package/resultset-table/ResultsetTable.stories.tsx +413 -0
  370. package/resultset-table/ResultsetTable.test.d.ts +1 -0
  371. package/resultset-table/ResultsetTable.test.js +380 -0
  372. package/resultset-table/types.d.ts +100 -0
  373. package/resultset-table/types.js +5 -0
  374. package/select/Listbox.d.ts +4 -0
  375. package/select/Listbox.js +151 -0
  376. package/select/Option.d.ts +4 -0
  377. package/select/Option.js +89 -0
  378. package/select/Select.accessibility.test.d.ts +1 -0
  379. package/select/Select.accessibility.test.js +228 -0
  380. package/select/Select.d.ts +4 -0
  381. package/select/Select.js +600 -0
  382. package/select/Select.stories.tsx +919 -0
  383. package/select/Select.test.d.ts +1 -0
  384. package/select/Select.test.js +2268 -0
  385. package/select/types.d.ts +209 -0
  386. package/select/types.js +5 -0
  387. package/sidenav/Sidenav.accessibility.test.d.ts +1 -0
  388. package/sidenav/Sidenav.accessibility.test.js +59 -0
  389. package/sidenav/Sidenav.d.ts +10 -0
  390. package/sidenav/Sidenav.js +201 -0
  391. package/sidenav/Sidenav.stories.tsx +277 -0
  392. package/sidenav/Sidenav.test.d.ts +1 -0
  393. package/sidenav/Sidenav.test.js +37 -0
  394. package/sidenav/SidenavContext.d.ts +5 -0
  395. package/sidenav/SidenavContext.js +13 -0
  396. package/sidenav/types.d.ts +76 -0
  397. package/sidenav/types.js +5 -0
  398. package/slider/Slider.accessibility.test.d.ts +1 -0
  399. package/slider/Slider.accessibility.test.js +104 -0
  400. package/slider/Slider.d.ts +4 -0
  401. package/slider/Slider.js +283 -0
  402. package/slider/Slider.stories.tsx +180 -0
  403. package/slider/Slider.test.d.ts +1 -0
  404. package/slider/Slider.test.js +257 -0
  405. package/slider/types.d.ts +86 -0
  406. package/slider/types.js +5 -0
  407. package/spinner/Spinner.accessibility.test.d.ts +1 -0
  408. package/spinner/Spinner.accessibility.test.js +96 -0
  409. package/spinner/Spinner.d.ts +4 -0
  410. package/spinner/Spinner.js +210 -0
  411. package/spinner/Spinner.stories.tsx +129 -0
  412. package/spinner/Spinner.test.d.ts +1 -0
  413. package/spinner/Spinner.test.js +55 -0
  414. package/spinner/types.d.ts +32 -0
  415. package/spinner/types.js +5 -0
  416. package/status-light/StatusLight.accessibility.test.d.ts +1 -0
  417. package/status-light/StatusLight.accessibility.test.js +157 -0
  418. package/status-light/StatusLight.d.ts +4 -0
  419. package/status-light/StatusLight.js +51 -0
  420. package/status-light/StatusLight.stories.tsx +74 -0
  421. package/status-light/StatusLight.test.d.ts +1 -0
  422. package/status-light/StatusLight.test.js +25 -0
  423. package/status-light/types.d.ts +17 -0
  424. package/status-light/types.js +5 -0
  425. package/switch/Switch.accessibility.test.d.ts +1 -0
  426. package/switch/Switch.accessibility.test.js +98 -0
  427. package/switch/Switch.d.ts +4 -0
  428. package/switch/Switch.js +211 -0
  429. package/switch/Switch.stories.tsx +149 -0
  430. package/switch/Switch.test.d.ts +1 -0
  431. package/switch/Switch.test.js +180 -0
  432. package/switch/types.d.ts +66 -0
  433. package/switch/types.js +5 -0
  434. package/table/DropdownTheme.js +62 -0
  435. package/table/Table.accessibility.test.d.ts +1 -0
  436. package/table/Table.accessibility.test.js +93 -0
  437. package/table/Table.d.ts +8 -0
  438. package/table/Table.js +161 -0
  439. package/table/Table.stories.tsx +663 -0
  440. package/table/Table.test.d.ts +1 -0
  441. package/table/Table.test.js +112 -0
  442. package/table/types.d.ts +49 -0
  443. package/table/types.js +5 -0
  444. package/tabs/Tab.d.ts +4 -0
  445. package/tabs/Tab.js +117 -0
  446. package/tabs/Tabs.accessibility.test.d.ts +1 -0
  447. package/tabs/Tabs.accessibility.test.js +56 -0
  448. package/tabs/Tabs.d.ts +4 -0
  449. package/tabs/Tabs.js +373 -0
  450. package/tabs/Tabs.stories.tsx +230 -0
  451. package/tabs/Tabs.test.d.ts +1 -0
  452. package/tabs/Tabs.test.js +276 -0
  453. package/tabs/types.d.ts +92 -0
  454. package/tabs/types.js +5 -0
  455. package/tag/Tag.accessibility.test.d.ts +1 -0
  456. package/tag/Tag.accessibility.test.js +69 -0
  457. package/tag/Tag.d.ts +4 -0
  458. package/tag/Tag.js +151 -0
  459. package/tag/Tag.stories.tsx +152 -0
  460. package/tag/Tag.test.d.ts +1 -0
  461. package/tag/Tag.test.js +41 -0
  462. package/tag/types.d.ts +69 -0
  463. package/tag/types.js +5 -0
  464. package/text-input/Suggestion.d.ts +4 -0
  465. package/text-input/Suggestion.js +67 -0
  466. package/text-input/Suggestions.d.ts +4 -0
  467. package/text-input/Suggestions.js +94 -0
  468. package/text-input/TextInput.accessibility.test.d.ts +1 -0
  469. package/text-input/TextInput.accessibility.test.js +321 -0
  470. package/text-input/TextInput.d.ts +4 -0
  471. package/text-input/TextInput.js +569 -0
  472. package/text-input/TextInput.stories.tsx +474 -0
  473. package/text-input/TextInput.test.d.ts +1 -0
  474. package/text-input/TextInput.test.js +1756 -0
  475. package/text-input/types.d.ts +205 -0
  476. package/text-input/types.js +5 -0
  477. package/textarea/Textarea.accessibility.test.d.ts +1 -0
  478. package/textarea/Textarea.accessibility.test.js +155 -0
  479. package/textarea/Textarea.d.ts +4 -0
  480. package/textarea/Textarea.js +232 -0
  481. package/textarea/Textarea.stories.tsx +174 -0
  482. package/textarea/Textarea.test.d.ts +1 -0
  483. package/textarea/Textarea.test.js +406 -0
  484. package/textarea/types.d.ts +141 -0
  485. package/textarea/types.js +5 -0
  486. package/toggle-group/ToggleGroup.accessibility.test.d.ts +1 -0
  487. package/toggle-group/ToggleGroup.accessibility.test.js +107 -0
  488. package/toggle-group/ToggleGroup.d.ts +4 -0
  489. package/toggle-group/ToggleGroup.js +199 -0
  490. package/toggle-group/ToggleGroup.stories.tsx +218 -0
  491. package/toggle-group/ToggleGroup.test.d.ts +1 -0
  492. package/toggle-group/ToggleGroup.test.js +137 -0
  493. package/toggle-group/types.d.ts +114 -0
  494. package/toggle-group/types.js +5 -0
  495. package/typography/Typography.accessibility.test.d.ts +1 -0
  496. package/typography/Typography.accessibility.test.js +339 -0
  497. package/typography/Typography.d.ts +4 -0
  498. package/typography/Typography.js +23 -0
  499. package/typography/Typography.stories.tsx +198 -0
  500. package/typography/types.d.ts +18 -0
  501. package/typography/types.js +5 -0
  502. package/useTheme.d.ts +1143 -0
  503. package/{dist/useTheme.js → useTheme.js} +4 -11
  504. package/useTranslatedLabels.d.ts +85 -0
  505. package/useTranslatedLabels.js +14 -0
  506. package/utils/BaseTypography.d.ts +21 -0
  507. package/utils/BaseTypography.js +94 -0
  508. package/utils/FocusLock.d.ts +13 -0
  509. package/utils/FocusLock.js +124 -0
  510. package/wizard/Wizard.accessibility.test.d.ts +1 -0
  511. package/wizard/Wizard.accessibility.test.js +55 -0
  512. package/wizard/Wizard.d.ts +4 -0
  513. package/wizard/Wizard.js +239 -0
  514. package/wizard/Wizard.stories.tsx +272 -0
  515. package/wizard/Wizard.test.d.ts +1 -0
  516. package/wizard/Wizard.test.js +114 -0
  517. package/wizard/types.d.ts +64 -0
  518. package/wizard/types.js +5 -0
  519. package/babel.config.js +0 -8
  520. package/dist/BackgroundColorContext.js +0 -46
  521. package/dist/ThemeContext.js +0 -248
  522. package/dist/V3Textarea/V3Textarea.js +0 -264
  523. package/dist/accordion/Accordion.js +0 -353
  524. package/dist/accordion-group/AccordionGroup.js +0 -186
  525. package/dist/alert/Alert.js +0 -403
  526. package/dist/alert/index.d.ts +0 -51
  527. package/dist/badge/Badge.js +0 -63
  528. package/dist/box/Box.js +0 -156
  529. package/dist/button/Button.js +0 -238
  530. package/dist/card/Card.js +0 -254
  531. package/dist/checkbox/Checkbox.js +0 -300
  532. package/dist/checkbox/Checkbox.stories.js +0 -144
  533. package/dist/checkbox/readme.md +0 -116
  534. package/dist/chip/Chip.js +0 -265
  535. package/dist/common/OpenSans.css +0 -81
  536. package/dist/common/RequiredComponent.js +0 -40
  537. package/dist/common/fonts/OpenSans-Bold.ttf +0 -0
  538. package/dist/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  539. package/dist/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  540. package/dist/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  541. package/dist/common/fonts/OpenSans-Italic.ttf +0 -0
  542. package/dist/common/fonts/OpenSans-Light.ttf +0 -0
  543. package/dist/common/fonts/OpenSans-LightItalic.ttf +0 -0
  544. package/dist/common/fonts/OpenSans-Regular.ttf +0 -0
  545. package/dist/common/fonts/OpenSans-SemiBold.ttf +0 -0
  546. package/dist/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  547. package/dist/common/variables.js +0 -1569
  548. package/dist/date/Date.js +0 -379
  549. package/dist/date/Date.stories.js +0 -205
  550. package/dist/date/readme.md +0 -73
  551. package/dist/date-input/DateInput.js +0 -400
  552. package/dist/date-input/index.d.ts +0 -95
  553. package/dist/dialog/Dialog.js +0 -218
  554. package/dist/dropdown/Dropdown.js +0 -544
  555. package/dist/file-input/FileInput.js +0 -644
  556. package/dist/file-input/FileItem.js +0 -280
  557. package/dist/file-input/index.d.ts +0 -81
  558. package/dist/footer/Footer.js +0 -421
  559. package/dist/footer/Icons.js +0 -77
  560. package/dist/header/Header.js +0 -434
  561. package/dist/input-text/Icons.js +0 -22
  562. package/dist/input-text/InputText.js +0 -705
  563. package/dist/layout/ApplicationLayout.js +0 -327
  564. package/dist/layout/Icons.js +0 -55
  565. package/dist/link/Link.js +0 -237
  566. package/dist/link/readme.md +0 -51
  567. package/dist/main.d.ts +0 -8
  568. package/dist/new-select/NewSelect.js +0 -836
  569. package/dist/new-select/index.d.ts +0 -53
  570. package/dist/number-input/NumberInput.js +0 -136
  571. package/dist/number-input/NumberInputContext.js +0 -16
  572. package/dist/number-input/index.d.ts +0 -113
  573. package/dist/paginator/Icons.js +0 -66
  574. package/dist/paginator/Paginator.js +0 -283
  575. package/dist/password-input/PasswordInput.js +0 -198
  576. package/dist/password-input/index.d.ts +0 -94
  577. package/dist/progress-bar/ProgressBar.js +0 -242
  578. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  579. package/dist/progress-bar/readme.md +0 -63
  580. package/dist/radio/Radio.js +0 -209
  581. package/dist/radio/Radio.stories.js +0 -166
  582. package/dist/radio/readme.md +0 -70
  583. package/dist/resultsetTable/ResultsetTable.js +0 -358
  584. package/dist/select/Select.js +0 -549
  585. package/dist/sidenav/Sidenav.js +0 -179
  586. package/dist/slider/Slider.js +0 -404
  587. package/dist/slider/readme.md +0 -64
  588. package/dist/spinner/Spinner.js +0 -381
  589. package/dist/spinner/Spinner.stories.js +0 -183
  590. package/dist/spinner/readme.md +0 -65
  591. package/dist/switch/Switch.js +0 -222
  592. package/dist/switch/Switch.stories.js +0 -134
  593. package/dist/switch/readme.md +0 -133
  594. package/dist/table/Table.js +0 -132
  595. package/dist/tabs/Tabs.js +0 -343
  596. package/dist/tabs/Tabs.stories.js +0 -130
  597. package/dist/tabs/readme.md +0 -78
  598. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  599. package/dist/tabs-for-sections/readme.md +0 -78
  600. package/dist/tag/Tag.js +0 -282
  601. package/dist/text-input/TextInput.js +0 -971
  602. package/dist/text-input/index.d.ts +0 -135
  603. package/dist/textarea/Textarea.js +0 -369
  604. package/dist/textarea/index.d.ts +0 -117
  605. package/dist/toggle/Toggle.js +0 -220
  606. package/dist/toggle/Toggle.stories.js +0 -297
  607. package/dist/toggle/readme.md +0 -80
  608. package/dist/toggle-group/ToggleGroup.js +0 -327
  609. package/dist/upload/Upload.js +0 -205
  610. package/dist/upload/Upload.stories.js +0 -72
  611. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -139
  612. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  613. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  614. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  615. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  616. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  617. package/dist/upload/file-upload/FileToUpload.js +0 -184
  618. package/dist/upload/file-upload/audio-icon.svg +0 -4
  619. package/dist/upload/file-upload/close.svg +0 -4
  620. package/dist/upload/file-upload/file-icon.svg +0 -4
  621. package/dist/upload/file-upload/video-icon.svg +0 -4
  622. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  623. package/dist/upload/readme.md +0 -37
  624. package/dist/upload/transaction/Transaction.js +0 -175
  625. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  626. package/dist/upload/transaction/audio-icon.svg +0 -4
  627. package/dist/upload/transaction/error-icon.svg +0 -4
  628. package/dist/upload/transaction/file-icon-err.svg +0 -4
  629. package/dist/upload/transaction/file-icon.svg +0 -4
  630. package/dist/upload/transaction/image-icon-err.svg +0 -4
  631. package/dist/upload/transaction/image-icon.svg +0 -4
  632. package/dist/upload/transaction/success-icon.svg +0 -4
  633. package/dist/upload/transaction/video-icon-err.svg +0 -4
  634. package/dist/upload/transaction/video-icon.svg +0 -4
  635. package/dist/upload/transactions/Transactions.js +0 -138
  636. package/dist/wizard/Wizard.js +0 -411
  637. package/dist/wizard/invalid_icon.svg +0 -5
  638. package/dist/wizard/valid_icon.svg +0 -5
  639. package/dist/wizard/validation-wrong.svg +0 -6
  640. package/test/Accordion.test.js +0 -33
  641. package/test/AccordionGroup.test.js +0 -125
  642. package/test/Alert.test.js +0 -53
  643. package/test/Box.test.js +0 -10
  644. package/test/Button.test.js +0 -18
  645. package/test/Card.test.js +0 -30
  646. package/test/Checkbox.test.js +0 -45
  647. package/test/Chip.test.js +0 -25
  648. package/test/Date.test.js +0 -397
  649. package/test/DateInput.test.js +0 -242
  650. package/test/Dialog.test.js +0 -23
  651. package/test/Dropdown.test.js +0 -145
  652. package/test/FileInput.test.js +0 -201
  653. package/test/Footer.test.js +0 -94
  654. package/test/Header.test.js +0 -34
  655. package/test/Heading.test.js +0 -35
  656. package/test/InputText.test.js +0 -248
  657. package/test/Link.test.js +0 -43
  658. package/test/NumberInput.test.js +0 -259
  659. package/test/Paginator.test.js +0 -177
  660. package/test/PasswordInput.test.js +0 -83
  661. package/test/ProgressBar.test.js +0 -35
  662. package/test/Radio.test.js +0 -37
  663. package/test/ResultsetTable.test.js +0 -329
  664. package/test/Select.test.js +0 -212
  665. package/test/Sidenav.test.js +0 -45
  666. package/test/Slider.test.js +0 -74
  667. package/test/Spinner.test.js +0 -32
  668. package/test/Switch.test.js +0 -45
  669. package/test/Table.test.js +0 -36
  670. package/test/Tabs.test.js +0 -109
  671. package/test/TabsForSections.test.js +0 -34
  672. package/test/Tag.test.js +0 -32
  673. package/test/TextInput.test.js +0 -732
  674. package/test/Textarea.test.js +0 -193
  675. package/test/ToggleGroup.test.js +0 -85
  676. package/test/Upload.test.js +0 -60
  677. package/test/V3TextArea.test.js +0 -51
  678. package/test/Wizard.test.js +0 -130
  679. package/test/mocks/pngMock.js +0 -1
  680. package/test/mocks/svgMock.js +0 -1
@@ -1,259 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import userEvent from "@testing-library/user-event";
4
- import DxcNumberInput from "../src/number-input/NumberInput";
5
-
6
- describe("Number input component tests", () => {
7
- test("Number input renders with label", () => {
8
- const { getByText } = render(<DxcNumberInput label="Number input label" />);
9
- expect(getByText("Number input label")).toBeTruthy();
10
- });
11
-
12
- test("Number input renders with helper text", () => {
13
- const { getByText } = render(<DxcNumberInput helperText="Helper text" />);
14
- expect(getByText("Helper text")).toBeTruthy();
15
- });
16
-
17
- test("Number input renders with placeholder", () => {
18
- const { getByLabelText } = render(<DxcNumberInput label="Number label" placeholder="Placeholder" />);
19
- const number = getByLabelText("Number label");
20
- expect(number.getAttribute("placeholder")).toBe("Placeholder");
21
- });
22
-
23
- test("Number input renders increment and decrement buttons", () => {
24
- const { queryAllByRole } = render(<DxcNumberInput label="Number label" />);
25
- expect(queryAllByRole("button").length).toBe(2);
26
- });
27
-
28
- test("Number input is disabled", () => {
29
- const { getByLabelText } = render(<DxcNumberInput label="Number label" disabled />);
30
- const number = getByLabelText("Number label");
31
- expect(number.disabled).toBeTruthy();
32
- });
33
-
34
- test("Number input is optional", () => {
35
- const { getByText } = render(<DxcNumberInput label="Number label" optional />);
36
- expect(getByText("(Optional)")).toBeTruthy();
37
- });
38
-
39
- test("Number input is not optional: required field, displays error if not filled in", () => {
40
- const onBlur = jest.fn();
41
- const onChange = jest.fn();
42
- const { getByRole } = render(<DxcNumberInput onBlur={onBlur} onChange={onChange} />);
43
- const input = getByRole("textbox");
44
-
45
- userEvent.type(input, "1");
46
- userEvent.clear(input);
47
- fireEvent.blur(input);
48
- expect(onBlur).toHaveBeenCalled();
49
- expect(onBlur).toHaveBeenCalledWith({ value: "", error: "This field is required. Please, enter a value." });
50
- expect(onChange).toHaveBeenCalled();
51
- expect(onChange).toHaveBeenCalledWith({ value: "", error: "This field is required. Please, enter a value." });
52
- });
53
-
54
- test("Suffix and prefix must be shown)", () => {
55
- const { getByText } = render(<DxcNumberInput label="Number input label" prefix="+34" suffix="USD" />);
56
- expect(getByText("+34")).toBeTruthy();
57
- expect(getByText("USD")).toBeTruthy();
58
- });
59
-
60
- test("Invalid number input renders error", () => {
61
- const { getByText } = render(<DxcNumberInput error="Error message." />);
62
- expect(getByText("Error message.")).toBeTruthy();
63
- });
64
-
65
- test("onChange function is called correctly", () => {
66
- const onChange = jest.fn();
67
- const { getByLabelText } = render(<DxcNumberInput label="Number input label" onChange={onChange} />);
68
- const number = getByLabelText("Number input label");
69
- userEvent.type(number, "t");
70
- expect(onChange).not.toHaveBeenCalledWith({ value: "t", error: null });
71
- expect(number.value).toBe("");
72
- userEvent.type(number, "1");
73
- expect(onChange).toHaveBeenCalledWith({ value: "1", error: null });
74
- expect(number.value).toBe("1");
75
- });
76
-
77
- test("Error message is shown if the value is less than the min value", () => {
78
- const onChange = jest.fn(({ value, error }) => {
79
- expect(value).toBe("1");
80
- expect(error).toBe("Value must be greater than or equal to 5.");
81
- });
82
- const onBlur = jest.fn(({ value, error }) => {
83
- expect(value).toBe("1");
84
- expect(error).toBe("Value must be greater than or equal to 5.");
85
- });
86
- const { getByLabelText } = render(
87
- <DxcNumberInput label="Number input label" min={5} onBlur={onBlur} onChange={onChange} />
88
- );
89
- const number = getByLabelText("Number input label");
90
-
91
- userEvent.type(number, "1");
92
- fireEvent.blur(number);
93
- });
94
-
95
- test("Cannot decrement the value if it is less than the min value", () => {
96
- const { getByLabelText, getAllByRole } = render(<DxcNumberInput label="Number input label" min={5} />);
97
- const number = getByLabelText("Number input label");
98
- userEvent.type(number, "1");
99
- fireEvent.blur(number);
100
- expect(number.value).toBe("1");
101
- const decrement = getAllByRole("button")[0];
102
- userEvent.click(decrement);
103
- expect(number.value).toBe("1");
104
- });
105
-
106
- test("Increment the value when it is less than the min value", () => {
107
- const { getByLabelText, getAllByRole } = render(<DxcNumberInput label="Number input label" min={5} />);
108
- const number = getByLabelText("Number input label");
109
- userEvent.type(number, "1");
110
- fireEvent.blur(number);
111
- expect(number.value).toBe("1");
112
- const increment = getAllByRole("button")[1];
113
- userEvent.click(increment);
114
- expect(number.value).toBe("5");
115
- });
116
-
117
- test("Error message is shown if the value is greater than the max value", () => {
118
- const onChange = jest.fn();
119
- const onBlur = jest.fn();
120
- const { getByLabelText } = render(
121
- <DxcNumberInput label="Number input label" max={10} onBlur={onBlur} onChange={onChange} />
122
- );
123
- const number = getByLabelText("Number input label");
124
-
125
- userEvent.type(number, "12");
126
- expect(onChange).toHaveBeenCalledTimes(2);
127
- expect(onChange).toHaveBeenCalledWith({ value: "12", error: "Value must be less than or equal to 10." });
128
- fireEvent.blur(number);
129
- expect(onBlur).toHaveBeenCalled();
130
- expect(onBlur).toHaveBeenCalledWith({ value: "12", error: "Value must be less than or equal to 10." });
131
- });
132
-
133
- test("Cannot increment the value if it is greater than the max value", () => {
134
- const { getByLabelText, getAllByRole } = render(<DxcNumberInput label="Number input label" max={10} />);
135
- const number = getByLabelText("Number input label");
136
- userEvent.type(number, "12");
137
- fireEvent.blur(number);
138
- expect(number.value).toBe("12");
139
- const decrement = getAllByRole("button")[1];
140
- userEvent.click(decrement);
141
- expect(number.value).toBe("12");
142
- });
143
-
144
- test("Decrement the value when it is greater than the max value", () => {
145
- const { getByLabelText, getAllByRole } = render(<DxcNumberInput label="Number input label" max={10} />);
146
- const number = getByLabelText("Number input label");
147
- userEvent.type(number, "12");
148
- fireEvent.blur(number);
149
- expect(number.value).toBe("12");
150
- const decrement = getAllByRole("button")[0];
151
- userEvent.click(decrement);
152
- expect(number.value).toBe("10");
153
- });
154
-
155
- test("Increment and decrement the value with min and max values", () => {
156
- const { getByLabelText, getAllByRole } = render(<DxcNumberInput label="Number input label" min={5} max={10} />);
157
- const number = getByLabelText("Number input label");
158
- userEvent.type(number, "1");
159
- fireEvent.blur(number);
160
- expect(number.value).toBe("1");
161
- const decrement = getAllByRole("button")[0];
162
- userEvent.click(decrement);
163
- expect(number.value).toBe("1");
164
- const increment = getAllByRole("button")[1];
165
- userEvent.click(increment);
166
- expect(number.value).toBe("5");
167
- userEvent.click(increment);
168
- userEvent.click(increment);
169
- userEvent.click(increment);
170
- userEvent.click(increment);
171
- userEvent.click(increment);
172
- expect(number.value).toBe("10");
173
- userEvent.click(increment);
174
- expect(number.value).toBe("10");
175
- });
176
-
177
- test("Increment and decrement the value with step", () => {
178
- const { getByLabelText, getAllByRole } = render(<DxcNumberInput label="Number input label" step={5} />);
179
- const number = getByLabelText("Number input label");
180
- userEvent.type(number, "10");
181
- fireEvent.blur(number);
182
- expect(number.value).toBe("10");
183
- const increment = getAllByRole("button")[1];
184
- userEvent.click(increment);
185
- expect(number.value).toBe("15");
186
- userEvent.click(increment);
187
- expect(number.value).toBe("20");
188
- const decrement = getAllByRole("button")[0];
189
- userEvent.click(decrement);
190
- expect(number.value).toBe("15");
191
- userEvent.click(decrement);
192
- expect(number.value).toBe("10");
193
- });
194
-
195
- test("Increment and decrement the value with min, max and step", () => {
196
- const onBlur = jest.fn(({ value, error }) => {
197
- expect(value).toBe("1");
198
- expect(error).toBe("Value must be greater than or equal to 5.");
199
- });
200
- const { getByLabelText, getAllByRole } = render(
201
- <DxcNumberInput label="Number input label" min={5} max={20} step={8} onBlur={onBlur} />
202
- );
203
- const number = getByLabelText("Number input label");
204
- userEvent.type(number, "1");
205
- fireEvent.blur(number);
206
- const increment = getAllByRole("button")[1];
207
- userEvent.click(increment);
208
- expect(number.value).toBe("5");
209
- userEvent.click(increment);
210
- expect(number.value).toBe("13");
211
- userEvent.click(increment);
212
- expect(number.value).toBe("20");
213
- userEvent.click(increment);
214
- expect(number.value).toBe("20");
215
- const decrement = getAllByRole("button")[0];
216
- userEvent.click(decrement);
217
- expect(number.value).toBe("12");
218
- userEvent.click(decrement);
219
- expect(number.value).toBe("5");
220
- userEvent.click(decrement);
221
- expect(number.value).toBe("5");
222
- });
223
-
224
- test("Increment and decrement the value with min, max and step using the arrows in keyboard", () => {
225
- const { getByLabelText } = render(<DxcNumberInput label="Number input label" min={5} max={20} step={5} />);
226
- const number = getByLabelText("Number input label");
227
- userEvent.type(number, "1");
228
- fireEvent.keyDown(number, { keyCode: 38 });
229
- expect(number.value).toBe("5");
230
- fireEvent.keyDown(number, { keyCode: 38 });
231
- expect(number.value).toBe("10");
232
- fireEvent.keyDown(number, { keyCode: 38 });
233
- expect(number.value).toBe("15");
234
- fireEvent.keyDown(number, { keyCode: 38 });
235
- expect(number.value).toBe("20");
236
- fireEvent.keyDown(number, { keyCode: 38 });
237
- expect(number.value).toBe("20");
238
- fireEvent.keyDown(number, { keyCode: 40 });
239
- expect(number.value).toBe("15");
240
- fireEvent.keyDown(number, { keyCode: 40 });
241
- expect(number.value).toBe("10");
242
- fireEvent.keyDown(number, { keyCode: 40 });
243
- expect(number.value).toBe("5");
244
- fireEvent.keyDown(number, { keyCode: 40 });
245
- expect(number.value).toBe("5");
246
- });
247
-
248
- test("Number has correct accesibility attributes", () => {
249
- const { getByLabelText, getAllByRole } = render(<DxcNumberInput label="Number input label" />);
250
- const number = getByLabelText("Number input label");
251
- expect(number.getAttribute("aria-autocomplete")).toBeNull();
252
- expect(number.getAttribute("aria-controls")).toBeNull();
253
- expect(number.getAttribute("aria-expanded")).toBeNull();
254
- const decrement = getAllByRole("button")[0];
255
- expect(decrement.getAttribute("aria-label")).toBe("Decrement");
256
- const increment = getAllByRole("button")[1];
257
- expect(increment.getAttribute("aria-label")).toBe("Increment");
258
- });
259
- });
@@ -1,177 +0,0 @@
1
- import React from "react";
2
- import { render, act } from "@testing-library/react";
3
- import userEvent from "@testing-library/user-event";
4
- import DxcPaginator from "../src/paginator/Paginator";
5
-
6
- describe("Paginator component tests", () => {
7
- test("Paginator renders with default values", () => {
8
- const { getByText } = render(<DxcPaginator></DxcPaginator>);
9
- expect(getByText("1 to 1 of 1")).toBeTruthy();
10
- expect(getByText("Page: 1 of 1")).toBeTruthy();
11
- });
12
-
13
- test("Paginator renders with currentPage", () => {
14
- const { getByText } = render(<DxcPaginator currentPage={2}></DxcPaginator>);
15
- expect(getByText("Page: 2 of 1")).toBeTruthy();
16
- });
17
-
18
- test("Paginator renders with itemsPerPageOptions", () => {
19
- const { getByText } = render(
20
- <DxcPaginator currentPage={1} itemsPerPage={10} itemsPerPageOptions={[10, 15]} totalItems={20}></DxcPaginator>
21
- );
22
- expect(getByText("Items per page")).toBeTruthy();
23
- });
24
-
25
- test("Paginator renders with itemsPerPageOptions", () => {
26
- const { getByText } = render(<DxcPaginator currentPage={1} itemsPerPage={10} totalItems={20}></DxcPaginator>);
27
- expect(getByText("1 to 10 of 20")).toBeTruthy();
28
- expect(getByText("Page: 1 of 2")).toBeTruthy();
29
- });
30
-
31
- test("Paginator renders with totalItems", () => {
32
- const { getByText } = render(<DxcPaginator totalItems={20}></DxcPaginator>);
33
- expect(getByText("1 to 5 of 20")).toBeTruthy();
34
- expect(getByText("Page: 1 of 4")).toBeTruthy();
35
- });
36
-
37
- test("Paginator renders with correct text in second page", () => {
38
- const { getByText } = render(<DxcPaginator currentPage={2} itemsPerPage={10} totalItems={20}></DxcPaginator>);
39
- expect(getByText("11 to 20 of 20")).toBeTruthy();
40
- expect(getByText("Page: 2 of 2")).toBeTruthy();
41
- });
42
-
43
- test("Paginator renders goToPage select", () => {
44
- const { getByText } = render(
45
- <DxcPaginator currentPage={2} showGoToPage={true} itemsPerPage={10} totalItems={20}></DxcPaginator>
46
- );
47
- expect(getByText("Go to page:")).toBeTruthy();
48
- });
49
-
50
- test("Paginator goToPage call correct function", () => {
51
- const onClick = jest.fn();
52
- const { getByText, getAllByRole, getByRole } = render(
53
- <DxcPaginator
54
- currentPage={1}
55
- itemsPerPage={10}
56
- totalItems={27}
57
- showGoToPage={true}
58
- onPageChange={onClick}
59
- ></DxcPaginator>
60
- );
61
- const goToPageSelect = getAllByRole("button")[2];
62
- act(() => {
63
- userEvent.click(goToPageSelect);
64
- });
65
- const goToPageOption = getByText("2");
66
- act(() => {
67
- userEvent.click(goToPageOption);
68
- });
69
- expect(onClick).toHaveBeenCalledWith(2);
70
- });
71
-
72
- test("Call correct goToPageFunction", () => {
73
- const onClick = jest.fn();
74
- const { getAllByRole } = render(
75
- <DxcPaginator onPageChange={onClick} currentPage={1} itemsPerPage={10} totalItems={20}></DxcPaginator>
76
- );
77
- const nextButton = getAllByRole("button")[2];
78
- userEvent.click(nextButton);
79
- expect(onClick).toHaveBeenCalled();
80
- });
81
-
82
- test("Call correct itemsPerPageFunction", () => {
83
- const onClick = jest.fn();
84
- const { getAllByText, getByText } = render(
85
- <DxcPaginator
86
- currentPage={1}
87
- itemsPerPage={10}
88
- itemsPerPageOptions={[10, 15]}
89
- itemsPerPageFunction={onClick}
90
- totalItems={20}
91
- ></DxcPaginator>
92
- );
93
- const select = getAllByText("10")[0];
94
- act(() => {
95
- userEvent.click(select);
96
- });
97
- const itemPerPageOption = getByText("15");
98
- act(() => {
99
- userEvent.click(itemPerPageOption);
100
- });
101
- expect(onClick).toHaveBeenCalledWith(15);
102
- });
103
-
104
- test("Next button is disable in last page", () => {
105
- const onClick = jest.fn();
106
- const { getAllByRole } = render(
107
- <DxcPaginator onPageChange={onClick} currentPage={2} itemsPerPage={10} totalItems={20}></DxcPaginator>
108
- );
109
- const nextButton = getAllByRole("button")[2];
110
- expect(nextButton.hasAttribute("disabled")).toBeTruthy();
111
- userEvent.click(nextButton);
112
- expect(onClick).toHaveBeenCalledTimes(0);
113
- });
114
-
115
- test("Last button is disable in last page", () => {
116
- const onClick = jest.fn();
117
- const { getAllByRole } = render(
118
- <DxcPaginator onPageChange={onClick} currentPage={2} itemsPerPage={10} totalItems={20}></DxcPaginator>
119
- );
120
- const lastButton = getAllByRole("button")[3];
121
- expect(lastButton.hasAttribute("disabled")).toBeTruthy();
122
- userEvent.click(lastButton);
123
- expect(onClick).toHaveBeenCalledTimes(0);
124
- });
125
-
126
- test("First button is disable in first page", () => {
127
- const onClick = jest.fn();
128
- const { getAllByRole } = render(
129
- <DxcPaginator onPageChange={onClick} currentPage={1} itemsPerPage={10} totalItems={20}></DxcPaginator>
130
- );
131
- const lastButton = getAllByRole("button")[0];
132
- expect(lastButton.hasAttribute("disabled")).toBeTruthy();
133
- userEvent.click(lastButton);
134
- expect(onClick).toHaveBeenCalledTimes(0);
135
- });
136
-
137
- test("Previous button is disable in first page", () => {
138
- const onClick = jest.fn();
139
- const { getAllByRole } = render(
140
- <DxcPaginator onPageChange={onClick} currentPage={1} itemsPerPage={10} totalItems={20}></DxcPaginator>
141
- );
142
- const lastButton = getAllByRole("button")[1];
143
- expect(lastButton.hasAttribute("disabled")).toBeTruthy();
144
- userEvent.click(lastButton);
145
- expect(onClick).toHaveBeenCalledTimes(0);
146
- });
147
-
148
- test("Last and next buttons are disable in last page", () => {
149
- const onClick = jest.fn();
150
- const { getAllByRole } = render(
151
- <DxcPaginator onPageChange={onClick} currentPage={2} itemsPerPage={10} totalItems={20}></DxcPaginator>
152
- );
153
- const firstButton = getAllByRole("button")[0];
154
- const prevButton = getAllByRole("button")[1];
155
- const nextButton = getAllByRole("button")[2];
156
- const lastButton = getAllByRole("button")[3];
157
- expect(firstButton.hasAttribute("disabled")).toBeFalsy();
158
- expect(prevButton.hasAttribute("disabled")).toBeFalsy();
159
- expect(nextButton.hasAttribute("disabled")).toBeTruthy();
160
- expect(lastButton.hasAttribute("disabled")).toBeTruthy();
161
- });
162
-
163
- test("First and previous buttons are disable in first page", () => {
164
- const onClick = jest.fn();
165
- const { getAllByRole } = render(
166
- <DxcPaginator onPageChange={onClick} currentPage={1} itemsPerPage={10} totalItems={20}></DxcPaginator>
167
- );
168
- const firstButton = getAllByRole("button")[0];
169
- const prevButton = getAllByRole("button")[1];
170
- const nextButton = getAllByRole("button")[2];
171
- const lastButton = getAllByRole("button")[3];
172
- expect(firstButton.hasAttribute("disabled")).toBeTruthy();
173
- expect(prevButton.hasAttribute("disabled")).toBeTruthy();
174
- expect(nextButton.hasAttribute("disabled")).toBeFalsy();
175
- expect(lastButton.hasAttribute("disabled")).toBeFalsy();
176
- });
177
- });
@@ -1,83 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import userEvent from "@testing-library/user-event";
4
- import DxcPasswordInput from "../src/password-input/PasswordInput";
5
-
6
- describe("Password input component tests", () => {
7
- test("Password input renders with label", () => {
8
- const { getByText } = render(<DxcPasswordInput label="Password input label" />);
9
- expect(getByText("Password input label")).toBeTruthy();
10
- });
11
-
12
- test("Password input renders with helper text", () => {
13
- const { getByText } = render(<DxcPasswordInput helperText="Helper text" />);
14
- expect(getByText("Helper text")).toBeTruthy();
15
- });
16
-
17
- test("Password input renders error", () => {
18
- const { getByText } = render(<DxcPasswordInput error="Error message." />);
19
- expect(getByText("Error message.")).toBeTruthy();
20
- });
21
-
22
- test("onChange function is called correctly", () => {
23
- const onChange = jest.fn();
24
- const { getByRole } = render(<DxcPasswordInput label="Password input" onChange={onChange} />);
25
- const passwordInput = getByRole("textbox");
26
- userEvent.type(passwordInput, "Pa$$w0rd");
27
- expect(onChange).toHaveBeenCalledWith({ value: "P", error: null });
28
- expect(passwordInput.value).toBe("Pa$$w0rd");
29
- });
30
-
31
- test("onBlur function is called correctly", () => {
32
- const onBlur = jest.fn();
33
- const { getByRole } = render(<DxcPasswordInput label="Password input" onBlur={onBlur} />);
34
- const passwordInput = getByRole("textbox");
35
- userEvent.type(passwordInput, "Pa$$w0rd");
36
- fireEvent.blur(passwordInput);
37
- expect(onBlur).toHaveBeenCalledWith({ value: "Pa$$w0rd", error: null });
38
- expect(passwordInput.value).toBe("Pa$$w0rd");
39
- });
40
-
41
- test("Clear password input value", () => {
42
- const { getAllByRole, getByRole } = render(<DxcPasswordInput label="Password input" clearable />);
43
- const passwordInput = getByRole("textbox");
44
- userEvent.type(passwordInput, "Pa$$w0rd");
45
- expect(passwordInput.value).toBe("Pa$$w0rd");
46
- const clearButton = getAllByRole("button")[0];
47
- userEvent.click(clearButton);
48
- expect(passwordInput.value).toBe("");
49
- });
50
-
51
- test("Non clearable password input has no clear icon", () => {
52
- const { getAllByRole, getByRole } = render(<DxcPasswordInput label="Password input" />);
53
- const passwordInput = getByRole("textbox");
54
- userEvent.type(passwordInput, "Pa$$w0rd");
55
- expect(passwordInput.value).toBe("Pa$$w0rd");
56
- const buttons = getAllByRole("button");
57
- expect(buttons.length).toBe(1);
58
- });
59
-
60
- test("Show/hide password input button works correctly", () => {
61
- const { getAllByRole, getByRole } = render(<DxcPasswordInput label="Password input" clearable />);
62
- const passwordInput = getByRole("textbox");
63
- userEvent.type(passwordInput, "Pa$$w0rd");
64
- expect(passwordInput.value).toBe("Pa$$w0rd");
65
- expect(passwordInput.type).toBe("password");
66
- const showButton = getAllByRole("button")[1];
67
- userEvent.click(showButton);
68
- expect(passwordInput.type).toBe("text");
69
- });
70
-
71
- test("Password input has correct accesibility attributes", () => {
72
- const { getByRole } = render(<DxcPasswordInput label="Password input" />);
73
- const passwordInput = getByRole("textbox");
74
- expect(passwordInput.getAttribute("aria-autocomplete")).toBeNull();
75
- expect(passwordInput.getAttribute("aria-controls")).toBeNull();
76
- const showButton = getByRole("button");
77
- expect(showButton.getAttribute("aria-expanded")).toBe("false");
78
- expect(showButton.getAttribute("aria-label")).toBe("Show");
79
- userEvent.click(showButton);
80
- expect(showButton.getAttribute("aria-expanded")).toBe("true");
81
- expect(showButton.getAttribute("aria-label")).toBe("Hide");
82
- });
83
- });
@@ -1,35 +0,0 @@
1
- import React from "react";
2
- import { render } from "@testing-library/react";
3
- import DxcProgressBar from "../src/progress-bar/ProgressBar";
4
-
5
- describe("ProgressBar component tests", () => {
6
- test("ProgressBar renders with label", () => {
7
- const { getByText } = render(<DxcProgressBar label="test-label"></DxcProgressBar>);
8
- expect(getByText("test-label")).toBeTruthy();
9
- });
10
-
11
- test("Overlay progressBar renders with label", () => {
12
- const { getByText } = render(<DxcProgressBar label="test-label" overlay></DxcProgressBar>);
13
- expect(getByText("test-label")).toBeTruthy();
14
- });
15
-
16
- test("ProgressBar renders with default value", () => {
17
- const { getByText } = render(<DxcProgressBar showValue></DxcProgressBar>);
18
- expect(getByText("100 %")).toBeTruthy();
19
- });
20
-
21
- test("Overlay progressBar renders with default value", () => {
22
- const { getByText } = render(<DxcProgressBar showValue overlay></DxcProgressBar>);
23
- expect(getByText("100 %")).toBeTruthy();
24
- });
25
-
26
- test("ProgressBar renders with value", () => {
27
- const { getByText } = render(<DxcProgressBar showValue value={25}></DxcProgressBar>);
28
- expect(getByText("25 %")).toBeTruthy();
29
- });
30
-
31
- test("Overlay progressBar renders with value", () => {
32
- const { getByText } = render(<DxcProgressBar showValue value={25} overlay></DxcProgressBar>);
33
- expect(getByText("25 %")).toBeTruthy();
34
- });
35
- });
@@ -1,37 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcRadio from "../src/radio/Radio";
4
-
5
- describe("Radio component tests", () => {
6
- test("Radio renders correctly", () => {
7
- const { getByText } = render(<DxcRadio label="Radio button" />);
8
- expect(getByText("Radio button")).toBeTruthy();
9
- });
10
- test("Calls correct function on click", () => {
11
- const onClick = jest.fn();
12
- const { getByText} = render(<DxcRadio label="Radio button" onClick={onClick} />);
13
- fireEvent.click(getByText("Radio button"));
14
-
15
- expect(onClick).toHaveBeenCalled();
16
- expect(onClick).toHaveBeenCalledWith(true);
17
- });
18
- test("Controlled Radio", () => {
19
- const onClick = jest.fn();
20
- const { getByText, getByRole } = render(<DxcRadio label="Radio button" checked={false} onClick={onClick} />);
21
- expect(getByRole("radio").checked).toBe(false);
22
- fireEvent.click(getByText("Radio button"));
23
- expect(onClick).toHaveBeenCalled();
24
- expect(onClick).toHaveBeenCalledWith(true);
25
- expect(getByRole("radio").checked).toBe(false);
26
- });
27
- test("Uncontrolled Radio", () => {
28
- const onClick = jest.fn();
29
- const { getByText, getByRole } = render(<DxcRadio label="Radio button" onClick={onClick} />);
30
- expect(getByRole("radio").checked).toBe(false);
31
- fireEvent.click(getByText("Radio button"));
32
- expect(onClick).toHaveBeenCalled();
33
- expect(onClick).toHaveBeenCalledWith(true);
34
- expect(getByRole("radio").checked).toBe(false);
35
- });
36
-
37
- });