@dxc-technology/halstack-react 0.0.0-669d8de → 0.0.0-66c6f2c

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 (715) hide show
  1. package/BackgroundColorContext.d.ts +1 -0
  2. package/BackgroundColorContext.js +30 -0
  3. package/HalstackContext.d.ts +1269 -0
  4. package/HalstackContext.js +320 -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 +168 -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 +40 -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 +67 -0
  118. package/chip/Chip.d.ts +4 -0
  119. package/chip/Chip.js +126 -0
  120. package/chip/Chip.stories.tsx +195 -0
  121. package/chip/Chip.test.d.ts +1 -0
  122. package/chip/Chip.test.js +41 -0
  123. package/chip/types.d.ts +45 -0
  124. package/chip/types.js +5 -0
  125. package/common/coreTokens.d.ts +236 -0
  126. package/common/coreTokens.js +183 -0
  127. package/common/utils.d.ts +1 -0
  128. package/{dist/common → common}/utils.js +6 -12
  129. package/common/variables.d.ts +1421 -0
  130. package/common/variables.js +1287 -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 +176 -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 +136 -0
  140. package/contextual-menu/ContextualMenu.stories.tsx +231 -0
  141. package/contextual-menu/ContextualMenu.test.d.ts +1 -0
  142. package/contextual-menu/ContextualMenu.test.js +247 -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 +88 -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 +65 -0
  152. package/contextual-menu/types.js +5 -0
  153. package/date-input/Calendar.d.ts +4 -0
  154. package/date-input/Calendar.js +230 -0
  155. package/date-input/DateInput.accessibility.test.d.ts +1 -0
  156. package/date-input/DateInput.accessibility.test.js +229 -0
  157. package/date-input/DateInput.d.ts +4 -0
  158. package/date-input/DateInput.js +228 -0
  159. package/date-input/DateInput.stories.tsx +291 -0
  160. package/date-input/DateInput.test.d.ts +1 -0
  161. package/date-input/DateInput.test.js +808 -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 +105 -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 +369 -0
  173. package/dialog/Dialog.test.d.ts +1 -0
  174. package/dialog/Dialog.test.js +370 -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 +224 -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 +183 -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 +628 -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 +438 -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 +125 -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 +221 -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/header/Icons.js +24 -0
  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} +154 -141
  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 +227 -0
  303. package/number-input/NumberInput.d.ts +4 -0
  304. package/number-input/NumberInput.js +89 -0
  305. package/number-input/NumberInput.stories.tsx +126 -0
  306. package/number-input/NumberInput.test.d.ts +1 -0
  307. package/number-input/NumberInput.test.js +988 -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 +69 -55
  313. package/paginator/Paginator.accessibility.test.d.ts +1 -0
  314. package/paginator/Paginator.accessibility.test.js +78 -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 +334 -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 +152 -0
  329. package/password-input/PasswordInput.d.ts +4 -0
  330. package/password-input/PasswordInput.js +100 -0
  331. package/password-input/PasswordInput.stories.tsx +108 -0
  332. package/password-input/PasswordInput.test.d.ts +1 -0
  333. package/password-input/PasswordInput.test.js +197 -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 +284 -0
  367. package/resultset-table/ResultsetTable.d.ts +7 -0
  368. package/resultset-table/ResultsetTable.js +195 -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 +450 -0
  372. package/resultset-table/types.d.ts +101 -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 +227 -0
  380. package/select/Select.d.ts +4 -0
  381. package/select/Select.js +602 -0
  382. package/select/Select.stories.tsx +928 -0
  383. package/select/Select.test.d.ts +1 -0
  384. package/select/Select.test.js +2267 -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 +103 -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 +256 -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 +92 -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 +111 -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 +320 -0
  470. package/text-input/TextInput.d.ts +4 -0
  471. package/text-input/TextInput.js +571 -0
  472. package/text-input/TextInput.stories.tsx +477 -0
  473. package/text-input/TextInput.test.d.ts +1 -0
  474. package/text-input/TextInput.test.js +1755 -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 +235 -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/tooltip/Tooltip.accessibility.test.d.ts +1 -0
  496. package/tooltip/Tooltip.accessibility.test.js +144 -0
  497. package/tooltip/Tooltip.d.ts +4 -0
  498. package/tooltip/Tooltip.js +50 -0
  499. package/tooltip/Tooltip.stories.tsx +111 -0
  500. package/tooltip/Tooltip.test.d.ts +1 -0
  501. package/tooltip/Tooltip.test.js +112 -0
  502. package/tooltip/types.d.ts +16 -0
  503. package/tooltip/types.js +5 -0
  504. package/typography/Typography.accessibility.test.d.ts +1 -0
  505. package/typography/Typography.accessibility.test.js +339 -0
  506. package/typography/Typography.d.ts +4 -0
  507. package/typography/Typography.js +23 -0
  508. package/typography/Typography.stories.tsx +196 -0
  509. package/typography/Typography.test.js +23 -0
  510. package/typography/types.d.ts +18 -0
  511. package/typography/types.js +5 -0
  512. package/useTheme.d.ts +1168 -0
  513. package/{dist/useTheme.js → useTheme.js} +4 -11
  514. package/useTranslatedLabels.d.ts +85 -0
  515. package/useTranslatedLabels.js +14 -0
  516. package/utils/BaseTypography.d.ts +21 -0
  517. package/utils/BaseTypography.js +98 -0
  518. package/utils/FocusLock.d.ts +13 -0
  519. package/utils/FocusLock.js +125 -0
  520. package/wizard/Wizard.accessibility.test.d.ts +1 -0
  521. package/wizard/Wizard.accessibility.test.js +55 -0
  522. package/wizard/Wizard.d.ts +4 -0
  523. package/wizard/Wizard.js +239 -0
  524. package/wizard/Wizard.stories.tsx +272 -0
  525. package/wizard/Wizard.test.d.ts +1 -0
  526. package/wizard/Wizard.test.js +114 -0
  527. package/wizard/types.d.ts +64 -0
  528. package/wizard/types.js +5 -0
  529. package/babel.config.js +0 -8
  530. package/dist/BackgroundColorContext.js +0 -46
  531. package/dist/ThemeContext.js +0 -216
  532. package/dist/accordion/Accordion.js +0 -348
  533. package/dist/accordion/Accordion.stories.js +0 -207
  534. package/dist/accordion/readme.md +0 -96
  535. package/dist/accordion-group/AccordionGroup.js +0 -188
  536. package/dist/accordion-group/AccordionGroup.stories.js +0 -207
  537. package/dist/accordion-group/readme.md +0 -70
  538. package/dist/alert/Alert.js +0 -403
  539. package/dist/badge/Badge.js +0 -63
  540. package/dist/box/Box.js +0 -156
  541. package/dist/button/Button.js +0 -231
  542. package/dist/button/Button.stories.js +0 -224
  543. package/dist/button/readme.md +0 -93
  544. package/dist/card/Card.js +0 -254
  545. package/dist/checkbox/Checkbox.js +0 -294
  546. package/dist/checkbox/Checkbox.stories.js +0 -144
  547. package/dist/checkbox/readme.md +0 -116
  548. package/dist/chip/Chip.js +0 -265
  549. package/dist/common/OpenSans.css +0 -81
  550. package/dist/common/RequiredComponent.js +0 -40
  551. package/dist/common/fonts/OpenSans-Bold.ttf +0 -0
  552. package/dist/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  553. package/dist/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  554. package/dist/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  555. package/dist/common/fonts/OpenSans-Italic.ttf +0 -0
  556. package/dist/common/fonts/OpenSans-Light.ttf +0 -0
  557. package/dist/common/fonts/OpenSans-LightItalic.ttf +0 -0
  558. package/dist/common/fonts/OpenSans-Regular.ttf +0 -0
  559. package/dist/common/fonts/OpenSans-SemiBold.ttf +0 -0
  560. package/dist/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  561. package/dist/common/variables.js +0 -1432
  562. package/dist/date/Date.js +0 -381
  563. package/dist/date/Date.stories.js +0 -205
  564. package/dist/date/readme.md +0 -73
  565. package/dist/dialog/Dialog.js +0 -240
  566. package/dist/dialog/Dialog.stories.js +0 -217
  567. package/dist/dialog/readme.md +0 -32
  568. package/dist/dropdown/Dropdown.js +0 -504
  569. package/dist/dropdown/Dropdown.stories.js +0 -249
  570. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  571. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  572. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  573. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  574. package/dist/dropdown/readme.md +0 -69
  575. package/dist/footer/Footer.js +0 -395
  576. package/dist/footer/Footer.stories.js +0 -94
  577. package/dist/footer/dxc_logo.svg +0 -15
  578. package/dist/footer/readme.md +0 -41
  579. package/dist/header/Header.js +0 -423
  580. package/dist/header/Header.stories.js +0 -176
  581. package/dist/header/close_icon.svg +0 -1
  582. package/dist/header/dxc_logo_black.svg +0 -8
  583. package/dist/header/hamb_menu_black.svg +0 -1
  584. package/dist/header/hamb_menu_white.svg +0 -1
  585. package/dist/header/readme.md +0 -33
  586. package/dist/input-text/InputText.js +0 -707
  587. package/dist/input-text/InputText.stories.js +0 -209
  588. package/dist/input-text/error.svg +0 -1
  589. package/dist/input-text/readme.md +0 -91
  590. package/dist/layout/ApplicationLayout.js +0 -331
  591. package/dist/layout/facebook.svg +0 -45
  592. package/dist/layout/linkedin.svg +0 -50
  593. package/dist/layout/twitter.svg +0 -53
  594. package/dist/link/Link.js +0 -241
  595. package/dist/link/readme.md +0 -51
  596. package/dist/new-date/NewDate.js +0 -403
  597. package/dist/new-input-text/NewInputText.js +0 -961
  598. package/dist/new-textarea/NewTextarea.js +0 -346
  599. package/dist/number/Number.js +0 -138
  600. package/dist/number/NumberContext.js +0 -16
  601. package/dist/paginator/Paginator.js +0 -289
  602. package/dist/paginator/images/next.svg +0 -3
  603. package/dist/paginator/images/nextPage.svg +0 -3
  604. package/dist/paginator/images/previous.svg +0 -3
  605. package/dist/paginator/images/previousPage.svg +0 -3
  606. package/dist/paginator/readme.md +0 -50
  607. package/dist/password/Password.js +0 -200
  608. package/dist/password/styles.css +0 -3
  609. package/dist/progress-bar/ProgressBar.js +0 -206
  610. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  611. package/dist/progress-bar/readme.md +0 -63
  612. package/dist/radio/Radio.js +0 -209
  613. package/dist/radio/Radio.stories.js +0 -166
  614. package/dist/radio/readme.md +0 -70
  615. package/dist/resultsetTable/ResultsetTable.js +0 -358
  616. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  617. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  618. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  619. package/dist/select/Select.js +0 -585
  620. package/dist/select/Select.stories.js +0 -235
  621. package/dist/select/readme.md +0 -72
  622. package/dist/sidenav/Sidenav.js +0 -177
  623. package/dist/slider/Slider.js +0 -315
  624. package/dist/slider/Slider.stories.js +0 -241
  625. package/dist/slider/readme.md +0 -64
  626. package/dist/spinner/Spinner.js +0 -218
  627. package/dist/spinner/Spinner.stories.js +0 -183
  628. package/dist/spinner/readme.md +0 -65
  629. package/dist/switch/Switch.js +0 -222
  630. package/dist/switch/Switch.stories.js +0 -134
  631. package/dist/switch/readme.md +0 -133
  632. package/dist/table/Table.js +0 -132
  633. package/dist/tabs/Tabs.js +0 -343
  634. package/dist/tabs/Tabs.stories.js +0 -130
  635. package/dist/tabs/readme.md +0 -78
  636. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  637. package/dist/tabs-for-sections/readme.md +0 -78
  638. package/dist/tag/Tag.js +0 -288
  639. package/dist/textarea/Textarea.js +0 -264
  640. package/dist/toggle/Toggle.js +0 -220
  641. package/dist/toggle/Toggle.stories.js +0 -297
  642. package/dist/toggle/readme.md +0 -80
  643. package/dist/toggle-group/ToggleGroup.js +0 -241
  644. package/dist/toggle-group/readme.md +0 -82
  645. package/dist/upload/Upload.js +0 -205
  646. package/dist/upload/Upload.stories.js +0 -72
  647. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -139
  648. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  649. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  650. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  651. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  652. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  653. package/dist/upload/file-upload/FileToUpload.js +0 -184
  654. package/dist/upload/file-upload/audio-icon.svg +0 -4
  655. package/dist/upload/file-upload/close.svg +0 -4
  656. package/dist/upload/file-upload/file-icon.svg +0 -4
  657. package/dist/upload/file-upload/video-icon.svg +0 -4
  658. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  659. package/dist/upload/readme.md +0 -37
  660. package/dist/upload/transaction/Transaction.js +0 -175
  661. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  662. package/dist/upload/transaction/audio-icon.svg +0 -4
  663. package/dist/upload/transaction/error-icon.svg +0 -4
  664. package/dist/upload/transaction/file-icon-err.svg +0 -4
  665. package/dist/upload/transaction/file-icon.svg +0 -4
  666. package/dist/upload/transaction/image-icon-err.svg +0 -4
  667. package/dist/upload/transaction/image-icon.svg +0 -4
  668. package/dist/upload/transaction/success-icon.svg +0 -4
  669. package/dist/upload/transaction/video-icon-err.svg +0 -4
  670. package/dist/upload/transaction/video-icon.svg +0 -4
  671. package/dist/upload/transactions/Transactions.js +0 -138
  672. package/dist/wizard/Wizard.js +0 -411
  673. package/dist/wizard/invalid_icon.svg +0 -5
  674. package/dist/wizard/valid_icon.svg +0 -5
  675. package/dist/wizard/validation-wrong.svg +0 -6
  676. package/test/Accordion.test.js +0 -33
  677. package/test/AccordionGroup.test.js +0 -125
  678. package/test/Alert.test.js +0 -53
  679. package/test/Box.test.js +0 -10
  680. package/test/Button.test.js +0 -18
  681. package/test/Card.test.js +0 -30
  682. package/test/Checkbox.test.js +0 -45
  683. package/test/Chip.test.js +0 -25
  684. package/test/Date.test.js +0 -393
  685. package/test/Dialog.test.js +0 -23
  686. package/test/Dropdown.test.js +0 -145
  687. package/test/Footer.test.js +0 -99
  688. package/test/Header.test.js +0 -39
  689. package/test/Heading.test.js +0 -35
  690. package/test/InputText.test.js +0 -240
  691. package/test/Link.test.js +0 -43
  692. package/test/NewDate.test.js +0 -203
  693. package/test/NewInputText.test.js +0 -817
  694. package/test/NewTextarea.test.js +0 -201
  695. package/test/Number.test.js +0 -241
  696. package/test/Paginator.test.js +0 -177
  697. package/test/Password.test.js +0 -76
  698. package/test/ProgressBar.test.js +0 -35
  699. package/test/Radio.test.js +0 -37
  700. package/test/ResultsetTable.test.js +0 -330
  701. package/test/Select.test.js +0 -189
  702. package/test/Sidenav.test.js +0 -45
  703. package/test/Slider.test.js +0 -82
  704. package/test/Spinner.test.js +0 -27
  705. package/test/Switch.test.js +0 -45
  706. package/test/Table.test.js +0 -36
  707. package/test/Tabs.test.js +0 -109
  708. package/test/TabsForSections.test.js +0 -34
  709. package/test/Tag.test.js +0 -32
  710. package/test/TextArea.test.js +0 -52
  711. package/test/ToggleGroup.test.js +0 -81
  712. package/test/Upload.test.js +0 -60
  713. package/test/Wizard.test.js +0 -130
  714. package/test/mocks/pngMock.js +0 -1
  715. package/test/mocks/svgMock.js +0 -1
@@ -1,201 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
-
4
- import DxcNewTextarea from "../src/new-textarea/NewTextarea";
5
-
6
- describe("NewTextarea component tests", () => {
7
- test("Renders with correct label", () => {
8
- const { getByText } = render(<DxcNewTextarea label="Example label" />);
9
- expect(getByText("Example label")).toBeTruthy();
10
- });
11
- test("Renders with correct label and helper text", () => {
12
- const { getByText } = render(<DxcNewTextarea label="Example label" helperText="Example helper text" />);
13
- expect(getByText("Example label")).toBeTruthy();
14
- expect(getByText("Example helper text")).toBeTruthy();
15
- });
16
- test("Renders with correct label and optional", () => {
17
- const { getByText } = render(<DxcNewTextarea label="Example label" helperText="Example helper text" optional />);
18
- expect(getByText("Example label")).toBeTruthy();
19
- expect(getByText("(Optional)")).toBeTruthy();
20
- expect(getByText("Example helper text")).toBeTruthy();
21
- });
22
- test("Renders with correct placeholder", () => {
23
- const { getByRole } = render(<DxcNewTextarea placeholder="Placeholder" />);
24
- const input = getByRole("textbox");
25
- expect(input.getAttribute("placeholder")).toBe("Placeholder");
26
- });
27
- test("Renders with error message", () => {
28
- const { getByText } = render(<DxcNewTextarea error="Error message." />);
29
- expect(getByText("Error message.")).toBeTruthy();
30
- });
31
- test("Renders with correct default rows", () => {
32
- const { getByLabelText } = render(<DxcNewTextarea label="Example label" rows={10} />);
33
- const textarea = getByLabelText("Example label");
34
- expect(textarea.rows).toBe(10);
35
- });
36
- test("Strict mode - Pattern constraint", () => {
37
- const onChange = jest.fn();
38
- const onBlur = jest.fn();
39
- const { getByLabelText, getByText, queryByText } = render(
40
- <DxcNewTextarea
41
- label="Example label"
42
- placeholder="Placeholder"
43
- onChange={onChange}
44
- onBlur={onBlur}
45
- margin={{ left: "medium", right: "medium" }}
46
- pattern='^.*(?=.*[a-zA-Z])(?=.*\d)(?=.*[!&$%&? "]).*$'
47
- />
48
- );
49
- const textarea = getByLabelText("Example label");
50
- fireEvent.change(textarea, { target: { value: "pattern test" } });
51
- fireEvent.blur(textarea);
52
- expect(getByText("Please match the format requested.")).toBeTruthy();
53
- fireEvent.change(textarea, { target: { value: "pattern4&" } });
54
- fireEvent.blur(textarea);
55
- expect(queryByText("Please match the format requested.")).toBeFalsy();
56
- });
57
- test("Strict mode - Length constraint", () => {
58
- const onChange = jest.fn();
59
- const onBlur = jest.fn();
60
- const { getByLabelText, getByText, queryByText } = render(
61
- <DxcNewTextarea
62
- label="Example label"
63
- placeholder="Placeholder"
64
- onChange={onChange}
65
- onBlur={onBlur}
66
- margin={{ left: "medium", right: "medium" }}
67
- length={{ min: 5, max: 10 }}
68
- />
69
- );
70
- const textarea = getByLabelText("Example label");
71
- fireEvent.change(textarea, { target: { value: "test" } });
72
- fireEvent.blur(textarea);
73
- expect(getByText("Min length 5, max length 10.")).toBeTruthy();
74
- fireEvent.change(textarea, { target: { value: "test " } });
75
- fireEvent.blur(textarea);
76
- expect(queryByText(/Min length /)).toBeFalsy();
77
- });
78
- test("Strict mode - Pattern and length constraints", () => {
79
- const onChange = jest.fn();
80
- const onBlur = jest.fn();
81
- const { getByLabelText, getByText, queryByText } = render(
82
- <DxcNewTextarea
83
- label="Example label"
84
- placeholder="Placeholder"
85
- onChange={onChange}
86
- onBlur={onBlur}
87
- margin={{ left: "medium", right: "medium" }}
88
- pattern='^.*(?=.*[a-zA-Z])(?=.*\d)(?=.*[!&$%&? "]).*$'
89
- length={{ min: 5, max: 10 }}
90
- />
91
- );
92
- const textarea = getByLabelText("Example label");
93
- fireEvent.change(textarea, { target: { value: "test" } });
94
- fireEvent.blur(textarea);
95
- expect(getByText("Min length 5, max length 10.")).toBeTruthy();
96
- fireEvent.change(textarea, { target: { value: "test " } });
97
- fireEvent.blur(textarea);
98
- expect(getByText("Please match the format requested.")).toBeTruthy();
99
- fireEvent.change(textarea, { target: { value: "test 4" } });
100
- fireEvent.blur(textarea);
101
- expect(queryByText("Please match the format requested.")).toBeFalsy();
102
- });
103
- test("Non Strict mode - Pattern constraint", () => {
104
- const onChange = jest.fn((value) => {
105
- expect(value).toBe("Example value");
106
- });
107
- const onBlur = jest.fn(({ value, error }) => {
108
- expect(value).toBe("Example value");
109
- expect(error).toBe("Please match the format requested.");
110
- });
111
- const { getByLabelText } = render(
112
- <DxcNewTextarea
113
- label="Example label"
114
- placeholder="Placeholder"
115
- onChange={onChange}
116
- onBlur={onBlur}
117
- margin={{ left: "medium", right: "medium" }}
118
- pattern='^.*(?=.*[a-zA-Z])(?=.*\d)(?=.*[!&$%&? "]).*$'
119
- />
120
- );
121
- const textarea = getByLabelText("Example label");
122
- fireEvent.change(textarea, { target: { value: "Example value" } });
123
- fireEvent.blur(textarea);
124
- });
125
- test("Non Strict mode - Length constraint", () => {
126
- const onChange = jest.fn((value) => {
127
- expect(value).toBe("Example value");
128
- });
129
- const onBlur = jest.fn(({ value, error }) => {
130
- expect(value).toBe("Example value");
131
- expect(error).toBe("Min length 5, max length 10.");
132
- });
133
- const { getByLabelText } = render(
134
- <DxcNewTextarea
135
- label="Example label"
136
- placeholder="Placeholder"
137
- onChange={onChange}
138
- onBlur={onBlur}
139
- margin={{ left: "medium", right: "medium" }}
140
- length={{ min: 5, max: 10 }}
141
- />
142
- );
143
- const textarea = getByLabelText("Example label");
144
- fireEvent.change(textarea, { target: { value: "Example value" } });
145
- fireEvent.blur(textarea);
146
- });
147
- test("Non Strict mode - Pattern and length constraints", () => {
148
- const onChange = jest.fn((value) => {
149
- expect(value).toBe("Example value");
150
- });
151
- const onBlur = jest.fn(({ value, error }) => {
152
- expect(value).toBe("Example value");
153
- expect(error).toBe("Min length 5, max length 10.");
154
- });
155
- const { getByLabelText } = render(
156
- <DxcNewTextarea
157
- label="Example label"
158
- placeholder="Placeholder"
159
- onChange={onChange}
160
- onBlur={onBlur}
161
- margin={{ left: "medium", right: "medium" }}
162
- length={{ min: 5, max: 10 }}
163
- />
164
- );
165
- const textarea = getByLabelText("Example label");
166
- fireEvent.change(textarea, { target: { value: "Example value" } });
167
- fireEvent.blur(textarea);
168
- });
169
- test("onBlur function is called correctly", () => {
170
- const onBlur = jest.fn();
171
- const { getByLabelText } = render(<DxcNewTextarea label="Example label" onBlur={onBlur} />);
172
- const textarea = getByLabelText("Example label");
173
- fireEvent.change(textarea, { target: { value: "Blur test" } });
174
- fireEvent.blur(textarea);
175
- expect(onBlur).toHaveBeenCalled();
176
- expect(onBlur).toHaveBeenCalledWith({ value: "Blur test", error: null });
177
- });
178
- test("Controlled textarea", () => {
179
- const onChange = jest.fn();
180
- const onBlur = jest.fn();
181
- const { getByLabelText } = render(
182
- <DxcNewTextarea label="Example label" value="Test value" onChange={onChange} onBlur={onBlur} />
183
- );
184
- const textarea = getByLabelText("Example label");
185
- fireEvent.change(textarea, { target: { value: "Controlled test" } });
186
- expect(onChange).toHaveBeenCalled();
187
- expect(textarea.value).toBe("Test value");
188
- fireEvent.blur(textarea);
189
- expect(onBlur).toHaveBeenCalled();
190
- expect(onBlur).toHaveBeenCalledWith({ value: "Test value", error: null });
191
- });
192
- test("Uncontrolled input", () => {
193
- const onChange = jest.fn();
194
- const { getByLabelText } = render(<DxcNewTextarea label="Example label" onChange={onChange} />);
195
- const textarea = getByLabelText("Example label");
196
- fireEvent.change(textarea, { target: { value: "Uncontrolled test" } });
197
- expect(onChange).toHaveBeenCalled();
198
- expect(onChange).toHaveBeenCalledWith("Uncontrolled test");
199
- expect(textarea.value).toBe("Uncontrolled test");
200
- });
201
- });
@@ -1,241 +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 DxcNumber from "../src/number/Number";
5
-
6
- describe("Number component tests", () => {
7
- test("Number renders with label", () => {
8
- const { getByText } = render(<DxcNumber label="Number label" />);
9
- expect(getByText("Number label")).toBeTruthy();
10
- });
11
-
12
- test("Number renders with helper text", () => {
13
- const { getByText } = render(<DxcNumber helperText="Helper text" />);
14
- expect(getByText("Helper text")).toBeTruthy();
15
- });
16
-
17
- test("Number renders with placeholder", () => {
18
- const { getByLabelText } = render(<DxcNumber label="Number label" placeholder="Placeholder" />);
19
- const number = getByLabelText("Number label");
20
- expect(number.getAttribute("placeholder")).toBe("Placeholder");
21
- });
22
-
23
- test("Number renders increment and decrement buttons", () => {
24
- const { queryAllByRole } = render(<DxcNumber label="Number label" />);
25
- expect(queryAllByRole("button").length).toBe(2);
26
- });
27
-
28
- test("Number is disabled", () => {
29
- const { getByLabelText } = render(<DxcNumber label="Number label" disabled />);
30
- const number = getByLabelText("Number label");
31
- expect(number.disabled).toBeTruthy();
32
- });
33
-
34
- test("Number is optional", () => {
35
- const { getByText } = render(<DxcNumber label="Number label" optional />);
36
- expect(getByText("(Optional)")).toBeTruthy();
37
- });
38
-
39
- test("Suffix and prefix must be shown)", () => {
40
- const { getByText } = render(<DxcNumber label="Number label" prefix="+34" suffix="USD" />);
41
- expect(getByText("+34")).toBeTruthy();
42
- expect(getByText("USD")).toBeTruthy();
43
- });
44
-
45
- test("Invalid number renders error", () => {
46
- const { getByText } = render(<DxcNumber error="Error message." />);
47
- expect(getByText("Error message.")).toBeTruthy();
48
- });
49
-
50
- test("onChange function is called correctly", () => {
51
- const onChange = jest.fn();
52
- const { getByLabelText } = render(<DxcNumber label="Number label" onChange={onChange} />);
53
- const number = getByLabelText("Number label");
54
- userEvent.type(number, "t");
55
- expect(onChange).not.toHaveBeenCalledWith("t");
56
- expect(number.value).toBe("");
57
- userEvent.type(number, "1");
58
- expect(onChange).toHaveBeenCalledWith("1");
59
- expect(number.value).toBe("1");
60
- });
61
-
62
- test("Error message is shown if the value is less than the min value", () => {
63
- const { getByLabelText, getByText } = render(<DxcNumber label="Number label" min={5} />);
64
- const number = getByLabelText("Number label");
65
- userEvent.type(number, "1");
66
- fireEvent.blur(number);
67
- expect(getByText("Value must be greater than or equal to 5.")).toBeTruthy();
68
- });
69
-
70
- test("Cannot decrement the value if it is less than the min value", () => {
71
- const { getByLabelText, getAllByRole } = render(<DxcNumber label="Number label" min={5} />);
72
- const number = getByLabelText("Number label");
73
- userEvent.type(number, "1");
74
- fireEvent.blur(number);
75
- expect(number.value).toBe("1");
76
- const decrement = getAllByRole("button")[0];
77
- userEvent.click(decrement);
78
- expect(number.value).toBe("1");
79
- });
80
-
81
- test("Increment the value when it is less than the min value", () => {
82
- const { getByLabelText, getAllByRole } = render(<DxcNumber label="Number label" min={5} />);
83
- const number = getByLabelText("Number label");
84
- userEvent.type(number, "1");
85
- fireEvent.blur(number);
86
- expect(number.value).toBe("1");
87
- const increment = getAllByRole("button")[1];
88
- userEvent.click(increment);
89
- expect(number.value).toBe("5");
90
- });
91
-
92
- test("Error message is shown if the value is greater than the max value", () => {
93
- const { getByLabelText, getByText } = render(<DxcNumber label="Number label" max={10} />);
94
- const number = getByLabelText("Number label");
95
- userEvent.type(number, "12");
96
- fireEvent.blur(number);
97
- expect(getByText("Value must be less than or equal to 10.")).toBeTruthy();
98
- });
99
-
100
- test("Cannot increment the value if it is greater than the max value", () => {
101
- const { getByLabelText, getAllByRole } = render(<DxcNumber label="Number label" max={10} />);
102
- const number = getByLabelText("Number label");
103
- userEvent.type(number, "12");
104
- fireEvent.blur(number);
105
- expect(number.value).toBe("12");
106
- const decrement = getAllByRole("button")[1];
107
- userEvent.click(decrement);
108
- expect(number.value).toBe("12");
109
- });
110
-
111
- test("Decrement the value when it is greater than the max value", () => {
112
- const { getByLabelText, getAllByRole } = render(<DxcNumber label="Number label" max={10} />);
113
- const number = getByLabelText("Number label");
114
- userEvent.type(number, "12");
115
- fireEvent.blur(number);
116
- expect(number.value).toBe("12");
117
- const decrement = getAllByRole("button")[0];
118
- userEvent.click(decrement);
119
- expect(number.value).toBe("10");
120
- });
121
-
122
- test("Increment and decrement the value with min and max values", () => {
123
- const { getByLabelText, getAllByRole } = render(<DxcNumber label="Number label" min={5} max={10} />);
124
- const number = getByLabelText("Number label");
125
- userEvent.type(number, "1");
126
- fireEvent.blur(number);
127
- expect(number.value).toBe("1");
128
- const decrement = getAllByRole("button")[0];
129
- userEvent.click(decrement);
130
- expect(number.value).toBe("1");
131
- const increment = getAllByRole("button")[1];
132
- userEvent.click(increment);
133
- expect(number.value).toBe("5");
134
- userEvent.click(increment);
135
- userEvent.click(increment);
136
- userEvent.click(increment);
137
- userEvent.click(increment);
138
- userEvent.click(increment);
139
- expect(number.value).toBe("10");
140
- userEvent.click(increment);
141
- expect(number.value).toBe("10");
142
- });
143
-
144
- test("Increment and decrement the value with step", () => {
145
- const { getByLabelText, getAllByRole } = render(<DxcNumber label="Number label" step={5} />);
146
- const number = getByLabelText("Number label");
147
- userEvent.type(number, "10");
148
- fireEvent.blur(number);
149
- expect(number.value).toBe("10");
150
- const increment = getAllByRole("button")[1];
151
- userEvent.click(increment);
152
- expect(number.value).toBe("15");
153
- userEvent.click(increment);
154
- expect(number.value).toBe("20");
155
- const decrement = getAllByRole("button")[0];
156
- userEvent.click(decrement);
157
- expect(number.value).toBe("15");
158
- userEvent.click(decrement);
159
- expect(number.value).toBe("10");
160
- });
161
-
162
- test("Increment and decrement the value with min, max and step", () => {
163
- const { getByLabelText, getByText, getAllByRole } = render(
164
- <DxcNumber label="Number label" min={5} max={20} step={8} />
165
- );
166
- const number = getByLabelText("Number label");
167
- userEvent.type(number, "1");
168
- fireEvent.blur(number);
169
- expect(getByText("Value must be greater than or equal to 5.")).toBeTruthy();
170
- const increment = getAllByRole("button")[1];
171
- userEvent.click(increment);
172
- expect(number.value).toBe("5");
173
- userEvent.click(increment);
174
- expect(number.value).toBe("13");
175
- userEvent.click(increment);
176
- expect(number.value).toBe("20");
177
- userEvent.click(increment);
178
- expect(number.value).toBe("20");
179
- const decrement = getAllByRole("button")[0];
180
- userEvent.click(decrement);
181
- expect(number.value).toBe("12");
182
- userEvent.click(decrement);
183
- expect(number.value).toBe("5");
184
- userEvent.click(decrement);
185
- expect(number.value).toBe("5");
186
- });
187
-
188
- test("Increment and decrement the value with min, max and step using the arrows in keyboard", () => {
189
- const { getByLabelText } = render(<DxcNumber label="Number label" min={5} max={20} step={5} />);
190
- const number = getByLabelText("Number label");
191
- userEvent.type(number, "1");
192
- fireEvent.keyDown(number, { keyCode: 38 });
193
- expect(number.value).toBe("5");
194
- fireEvent.keyDown(number, { keyCode: 38 });
195
- expect(number.value).toBe("10");
196
- fireEvent.keyDown(number, { keyCode: 38 });
197
- expect(number.value).toBe("15");
198
- fireEvent.keyDown(number, { keyCode: 38 });
199
- expect(number.value).toBe("20");
200
- fireEvent.keyDown(number, { keyCode: 38 });
201
- expect(number.value).toBe("20");
202
- fireEvent.keyDown(number, { keyCode: 40 });
203
- expect(number.value).toBe("15");
204
- fireEvent.keyDown(number, { keyCode: 40 });
205
- expect(number.value).toBe("10");
206
- fireEvent.keyDown(number, { keyCode: 40 });
207
- expect(number.value).toBe("5");
208
- fireEvent.keyDown(number, { keyCode: 40 });
209
- expect(number.value).toBe("5");
210
- });
211
-
212
- test("Custom error messages", () => {
213
- const onChange = jest.fn((value) => {
214
- expect(value).toBe("2");
215
- });
216
-
217
- const onBlur = jest.fn(({ value, error }) => {
218
- expect(value).toBe("2");
219
- expect(error).toBe("Value must be greater than or equal to 5.");
220
- });
221
-
222
- const { getByLabelText } = render(
223
- <DxcNumber label="Number label" min={5} step={8} onChange={onChange} onBlur={onBlur} />
224
- );
225
- const number = getByLabelText("Number label");
226
- userEvent.type(number, "2");
227
- fireEvent.blur(number);
228
- });
229
-
230
- test("Number has correct accesibility attributes", () => {
231
- const { getByLabelText, getAllByRole } = render(<DxcNumber label="Number label" />);
232
- const number = getByLabelText("Number label");
233
- expect(number.getAttribute("aria-autocomplete")).toBeNull();
234
- expect(number.getAttribute("aria-controls")).toBeNull();
235
- expect(number.getAttribute("aria-expanded")).toBeNull();
236
- const decrement = getAllByRole("button")[0];
237
- expect(decrement.getAttribute("aria-label")).toBe("Decrement");
238
- const increment = getAllByRole("button")[1];
239
- expect(increment.getAttribute("aria-label")).toBe("Increment");
240
- });
241
- });
@@ -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 = getByRole("option", { name: /2/i });
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
- });