@dxc-technology/halstack-react 0.0.0-c5f6a2f → 0.0.0-c667373

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 (723) hide show
  1. package/BackgroundColorContext.d.ts +1 -0
  2. package/BackgroundColorContext.js +30 -0
  3. package/HalstackContext.d.ts +1280 -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/bar-chart/BarChart.d.ts +4 -0
  56. package/bar-chart/BarChart.js +152 -0
  57. package/bar-chart/BarChart.stories.tsx +281 -0
  58. package/bar-chart/BarChart.test.d.ts +1 -0
  59. package/bar-chart/BarChart.test.js +194 -0
  60. package/bar-chart/theme.d.ts +3 -0
  61. package/bar-chart/theme.js +31 -0
  62. package/bar-chart/types.d.ts +118 -0
  63. package/bar-chart/types.js +5 -0
  64. package/bleed/Bleed.d.ts +3 -0
  65. package/bleed/Bleed.js +43 -0
  66. package/bleed/Bleed.stories.tsx +341 -0
  67. package/bleed/types.d.ts +37 -0
  68. package/bleed/types.js +5 -0
  69. package/box/Box.accessibility.test.d.ts +1 -0
  70. package/box/Box.accessibility.test.js +33 -0
  71. package/box/Box.d.ts +4 -0
  72. package/box/Box.js +75 -0
  73. package/box/Box.stories.tsx +119 -0
  74. package/box/Box.test.d.ts +1 -0
  75. package/box/Box.test.js +13 -0
  76. package/box/types.d.ts +32 -0
  77. package/box/types.js +5 -0
  78. package/breadcrumbs/Breadcrumbs.accessibility.test.d.ts +1 -0
  79. package/breadcrumbs/Breadcrumbs.accessibility.test.js +96 -0
  80. package/breadcrumbs/Breadcrumbs.d.ts +4 -0
  81. package/breadcrumbs/Breadcrumbs.js +79 -0
  82. package/breadcrumbs/Breadcrumbs.stories.tsx +194 -0
  83. package/breadcrumbs/Breadcrumbs.test.d.ts +1 -0
  84. package/breadcrumbs/Breadcrumbs.test.js +168 -0
  85. package/breadcrumbs/Item.d.ts +4 -0
  86. package/breadcrumbs/Item.js +52 -0
  87. package/breadcrumbs/dropdownTheme.d.ts +53 -0
  88. package/breadcrumbs/dropdownTheme.js +62 -0
  89. package/breadcrumbs/types.d.ts +40 -0
  90. package/breadcrumbs/types.js +5 -0
  91. package/bulleted-list/BulletedList.accessibility.test.d.ts +1 -0
  92. package/bulleted-list/BulletedList.accessibility.test.js +119 -0
  93. package/bulleted-list/BulletedList.d.ts +7 -0
  94. package/bulleted-list/BulletedList.js +92 -0
  95. package/bulleted-list/BulletedList.stories.tsx +115 -0
  96. package/bulleted-list/types.d.ts +38 -0
  97. package/bulleted-list/types.js +5 -0
  98. package/button/Button.accessibility.test.d.ts +1 -0
  99. package/button/Button.accessibility.test.js +127 -0
  100. package/button/Button.d.ts +4 -0
  101. package/button/Button.js +121 -0
  102. package/button/Button.stories.tsx +325 -0
  103. package/button/Button.test.d.ts +1 -0
  104. package/button/Button.test.js +38 -0
  105. package/button/types.d.ts +57 -0
  106. package/button/types.js +5 -0
  107. package/card/Card.accessibility.test.d.ts +1 -0
  108. package/card/Card.accessibility.test.js +36 -0
  109. package/card/Card.d.ts +4 -0
  110. package/card/Card.js +121 -0
  111. package/card/Card.stories.tsx +171 -0
  112. package/card/Card.test.d.ts +1 -0
  113. package/card/Card.test.js +39 -0
  114. package/card/types.d.ts +62 -0
  115. package/card/types.js +5 -0
  116. package/checkbox/Checkbox.accessibility.test.d.ts +1 -0
  117. package/checkbox/Checkbox.accessibility.test.js +87 -0
  118. package/checkbox/Checkbox.d.ts +4 -0
  119. package/checkbox/Checkbox.js +212 -0
  120. package/checkbox/Checkbox.stories.tsx +222 -0
  121. package/checkbox/Checkbox.test.d.ts +1 -0
  122. package/checkbox/Checkbox.test.js +199 -0
  123. package/checkbox/types.d.ts +72 -0
  124. package/checkbox/types.js +5 -0
  125. package/chip/Chip.accessibility.test.d.ts +1 -0
  126. package/chip/Chip.accessibility.test.js +67 -0
  127. package/chip/Chip.d.ts +4 -0
  128. package/chip/Chip.js +126 -0
  129. package/chip/Chip.stories.tsx +195 -0
  130. package/chip/Chip.test.d.ts +1 -0
  131. package/chip/Chip.test.js +41 -0
  132. package/chip/types.d.ts +45 -0
  133. package/chip/types.js +5 -0
  134. package/common/coreTokens.d.ts +236 -0
  135. package/common/coreTokens.js +183 -0
  136. package/common/utils.d.ts +1 -0
  137. package/{dist/common → common}/utils.js +6 -12
  138. package/common/variables.d.ts +1432 -0
  139. package/common/variables.js +1298 -0
  140. package/container/Container.d.ts +4 -0
  141. package/container/Container.js +194 -0
  142. package/container/Container.stories.tsx +214 -0
  143. package/container/types.d.ts +176 -0
  144. package/container/types.js +5 -0
  145. package/contextual-menu/ContextualMenu.accessibility.test.d.ts +1 -0
  146. package/contextual-menu/ContextualMenu.accessibility.test.js +98 -0
  147. package/contextual-menu/ContextualMenu.d.ts +5 -0
  148. package/contextual-menu/ContextualMenu.js +136 -0
  149. package/contextual-menu/ContextualMenu.stories.tsx +231 -0
  150. package/contextual-menu/ContextualMenu.test.d.ts +1 -0
  151. package/contextual-menu/ContextualMenu.test.js +247 -0
  152. package/contextual-menu/GroupItem.d.ts +4 -0
  153. package/contextual-menu/GroupItem.js +67 -0
  154. package/contextual-menu/ItemAction.d.ts +4 -0
  155. package/contextual-menu/ItemAction.js +88 -0
  156. package/contextual-menu/MenuItem.d.ts +4 -0
  157. package/contextual-menu/MenuItem.js +29 -0
  158. package/contextual-menu/SingleItem.d.ts +4 -0
  159. package/contextual-menu/SingleItem.js +38 -0
  160. package/contextual-menu/types.d.ts +65 -0
  161. package/contextual-menu/types.js +5 -0
  162. package/date-input/Calendar.d.ts +4 -0
  163. package/date-input/Calendar.js +230 -0
  164. package/date-input/DateInput.accessibility.test.d.ts +1 -0
  165. package/date-input/DateInput.accessibility.test.js +229 -0
  166. package/date-input/DateInput.d.ts +4 -0
  167. package/date-input/DateInput.js +228 -0
  168. package/date-input/DateInput.stories.tsx +291 -0
  169. package/date-input/DateInput.test.d.ts +1 -0
  170. package/date-input/DateInput.test.js +808 -0
  171. package/date-input/DatePicker.d.ts +4 -0
  172. package/date-input/DatePicker.js +121 -0
  173. package/date-input/YearPicker.d.ts +4 -0
  174. package/date-input/YearPicker.js +105 -0
  175. package/date-input/types.d.ts +164 -0
  176. package/date-input/types.js +5 -0
  177. package/dialog/Dialog.accessibility.test.d.ts +1 -0
  178. package/dialog/Dialog.accessibility.test.js +69 -0
  179. package/dialog/Dialog.d.ts +4 -0
  180. package/dialog/Dialog.js +93 -0
  181. package/dialog/Dialog.stories.tsx +369 -0
  182. package/dialog/Dialog.test.d.ts +1 -0
  183. package/dialog/Dialog.test.js +370 -0
  184. package/dialog/types.d.ts +36 -0
  185. package/dialog/types.js +5 -0
  186. package/divider/Divider.accessibility.test.d.ts +1 -0
  187. package/divider/Divider.accessibility.test.js +33 -0
  188. package/divider/Divider.d.ts +4 -0
  189. package/divider/Divider.js +36 -0
  190. package/divider/Divider.stories.tsx +224 -0
  191. package/divider/Divider.test.d.ts +1 -0
  192. package/divider/Divider.test.js +38 -0
  193. package/divider/types.d.ts +21 -0
  194. package/divider/types.js +5 -0
  195. package/dropdown/Dropdown.accessibility.test.d.ts +1 -0
  196. package/dropdown/Dropdown.accessibility.test.js +183 -0
  197. package/dropdown/Dropdown.d.ts +4 -0
  198. package/dropdown/Dropdown.js +320 -0
  199. package/dropdown/Dropdown.stories.tsx +427 -0
  200. package/dropdown/Dropdown.test.d.ts +1 -0
  201. package/dropdown/Dropdown.test.js +628 -0
  202. package/dropdown/DropdownMenu.d.ts +4 -0
  203. package/dropdown/DropdownMenu.js +63 -0
  204. package/dropdown/DropdownMenuItem.d.ts +4 -0
  205. package/dropdown/DropdownMenuItem.js +71 -0
  206. package/dropdown/types.d.ts +96 -0
  207. package/dropdown/types.js +5 -0
  208. package/file-input/FileInput.accessibility.test.d.ts +1 -0
  209. package/file-input/FileInput.accessibility.test.js +167 -0
  210. package/file-input/FileInput.d.ts +4 -0
  211. package/file-input/FileInput.js +438 -0
  212. package/file-input/FileInput.stories.tsx +618 -0
  213. package/file-input/FileInput.test.d.ts +1 -0
  214. package/file-input/FileInput.test.js +404 -0
  215. package/file-input/FileItem.d.ts +4 -0
  216. package/file-input/FileItem.js +125 -0
  217. package/file-input/types.d.ts +125 -0
  218. package/file-input/types.js +5 -0
  219. package/flex/Flex.d.ts +4 -0
  220. package/flex/Flex.js +57 -0
  221. package/flex/Flex.stories.tsx +112 -0
  222. package/flex/types.d.ts +97 -0
  223. package/flex/types.js +5 -0
  224. package/footer/Footer.accessibility.test.d.ts +1 -0
  225. package/footer/Footer.accessibility.test.js +125 -0
  226. package/footer/Footer.d.ts +4 -0
  227. package/footer/Footer.js +140 -0
  228. package/footer/Footer.stories.tsx +208 -0
  229. package/footer/Footer.test.d.ts +1 -0
  230. package/footer/Footer.test.js +85 -0
  231. package/footer/Icons.d.ts +3 -0
  232. package/footer/Icons.js +108 -0
  233. package/footer/types.d.ts +64 -0
  234. package/footer/types.js +5 -0
  235. package/grid/Grid.d.ts +7 -0
  236. package/grid/Grid.js +76 -0
  237. package/grid/Grid.stories.tsx +221 -0
  238. package/grid/types.d.ts +115 -0
  239. package/grid/types.js +5 -0
  240. package/header/Header.accessibility.test.d.ts +1 -0
  241. package/header/Header.accessibility.test.js +94 -0
  242. package/header/Header.d.ts +8 -0
  243. package/header/Header.js +210 -0
  244. package/header/Header.stories.tsx +267 -0
  245. package/header/Header.test.d.ts +1 -0
  246. package/header/Header.test.js +66 -0
  247. package/header/Icons.d.ts +2 -0
  248. package/header/Icons.js +24 -0
  249. package/header/types.d.ts +33 -0
  250. package/header/types.js +5 -0
  251. package/heading/Heading.accessibility.test.d.ts +1 -0
  252. package/heading/Heading.accessibility.test.js +33 -0
  253. package/heading/Heading.d.ts +4 -0
  254. package/{dist/heading → heading}/Heading.js +34 -119
  255. package/heading/Heading.stories.tsx +54 -0
  256. package/heading/Heading.test.d.ts +1 -0
  257. package/heading/Heading.test.js +156 -0
  258. package/heading/types.d.ts +33 -0
  259. package/heading/types.js +5 -0
  260. package/icon/Icon.accessibility.test.d.ts +1 -0
  261. package/icon/Icon.accessibility.test.js +30 -0
  262. package/icon/Icon.d.ts +4 -0
  263. package/icon/Icon.js +33 -0
  264. package/icon/Icon.stories.tsx +28 -0
  265. package/icon/types.d.ts +4 -0
  266. package/icon/types.js +5 -0
  267. package/image/Image.accessibility.test.d.ts +1 -0
  268. package/image/Image.accessibility.test.js +56 -0
  269. package/image/Image.d.ts +4 -0
  270. package/image/Image.js +70 -0
  271. package/image/Image.stories.tsx +129 -0
  272. package/image/types.d.ts +72 -0
  273. package/image/types.js +5 -0
  274. package/inset/Inset.d.ts +3 -0
  275. package/inset/Inset.js +43 -0
  276. package/inset/Inset.stories.tsx +230 -0
  277. package/inset/types.d.ts +37 -0
  278. package/inset/types.js +5 -0
  279. package/layout/ApplicationLayout.d.ts +20 -0
  280. package/layout/ApplicationLayout.js +137 -0
  281. package/layout/ApplicationLayout.stories.tsx +162 -0
  282. package/layout/Icons.d.ts +7 -0
  283. package/layout/Icons.js +48 -0
  284. package/layout/types.d.ts +41 -0
  285. package/layout/types.js +5 -0
  286. package/link/Link.accessibility.test.d.ts +1 -0
  287. package/link/Link.accessibility.test.js +108 -0
  288. package/link/Link.d.ts +4 -0
  289. package/link/Link.js +117 -0
  290. package/link/Link.stories.tsx +253 -0
  291. package/link/Link.test.d.ts +1 -0
  292. package/link/Link.test.js +63 -0
  293. package/link/types.d.ts +54 -0
  294. package/link/types.js +5 -0
  295. package/main.d.ts +50 -0
  296. package/{dist/main.js → main.js} +168 -115
  297. package/nav-tabs/NavTabs.accessibility.test.d.ts +1 -0
  298. package/nav-tabs/NavTabs.accessibility.test.js +44 -0
  299. package/nav-tabs/NavTabs.d.ts +7 -0
  300. package/nav-tabs/NavTabs.js +108 -0
  301. package/nav-tabs/NavTabs.stories.tsx +294 -0
  302. package/nav-tabs/NavTabs.test.d.ts +1 -0
  303. package/nav-tabs/NavTabs.test.js +77 -0
  304. package/nav-tabs/NavTabsContext.d.ts +3 -0
  305. package/nav-tabs/NavTabsContext.js +8 -0
  306. package/nav-tabs/Tab.d.ts +4 -0
  307. package/nav-tabs/Tab.js +117 -0
  308. package/nav-tabs/types.d.ts +52 -0
  309. package/nav-tabs/types.js +5 -0
  310. package/number-input/NumberInput.accessibility.test.d.ts +1 -0
  311. package/number-input/NumberInput.accessibility.test.js +227 -0
  312. package/number-input/NumberInput.d.ts +4 -0
  313. package/number-input/NumberInput.js +89 -0
  314. package/number-input/NumberInput.stories.tsx +126 -0
  315. package/number-input/NumberInput.test.d.ts +1 -0
  316. package/number-input/NumberInput.test.js +988 -0
  317. package/number-input/NumberInputContext.d.ts +3 -0
  318. package/number-input/NumberInputContext.js +8 -0
  319. package/number-input/types.d.ts +136 -0
  320. package/number-input/types.js +5 -0
  321. package/package.json +70 -54
  322. package/paginator/Paginator.accessibility.test.d.ts +1 -0
  323. package/paginator/Paginator.accessibility.test.js +78 -0
  324. package/paginator/Paginator.d.ts +4 -0
  325. package/paginator/Paginator.js +138 -0
  326. package/paginator/Paginator.stories.tsx +87 -0
  327. package/paginator/Paginator.test.d.ts +1 -0
  328. package/paginator/Paginator.test.js +334 -0
  329. package/paginator/types.d.ts +38 -0
  330. package/paginator/types.js +5 -0
  331. package/paragraph/Paragraph.accessibility.test.d.ts +1 -0
  332. package/paragraph/Paragraph.accessibility.test.js +28 -0
  333. package/paragraph/Paragraph.d.ts +5 -0
  334. package/paragraph/Paragraph.js +22 -0
  335. package/paragraph/Paragraph.stories.tsx +27 -0
  336. package/password-input/PasswordInput.accessibility.test.d.ts +1 -0
  337. package/password-input/PasswordInput.accessibility.test.js +152 -0
  338. package/password-input/PasswordInput.d.ts +4 -0
  339. package/password-input/PasswordInput.js +100 -0
  340. package/password-input/PasswordInput.stories.tsx +108 -0
  341. package/password-input/PasswordInput.test.d.ts +1 -0
  342. package/password-input/PasswordInput.test.js +197 -0
  343. package/password-input/types.d.ts +111 -0
  344. package/password-input/types.js +5 -0
  345. package/progress-bar/ProgressBar.accessibility.test.d.ts +1 -0
  346. package/progress-bar/ProgressBar.accessibility.test.js +35 -0
  347. package/progress-bar/ProgressBar.d.ts +4 -0
  348. package/progress-bar/ProgressBar.js +146 -0
  349. package/progress-bar/ProgressBar.stories.tsx +93 -0
  350. package/progress-bar/ProgressBar.test.d.ts +1 -0
  351. package/progress-bar/ProgressBar.test.js +93 -0
  352. package/progress-bar/types.d.ts +37 -0
  353. package/progress-bar/types.js +5 -0
  354. package/quick-nav/QuickNav.accessibility.test.d.ts +1 -0
  355. package/quick-nav/QuickNav.accessibility.test.js +57 -0
  356. package/quick-nav/QuickNav.d.ts +4 -0
  357. package/quick-nav/QuickNav.js +94 -0
  358. package/quick-nav/QuickNav.stories.tsx +356 -0
  359. package/quick-nav/types.d.ts +21 -0
  360. package/quick-nav/types.js +5 -0
  361. package/radio-group/Radio.d.ts +4 -0
  362. package/radio-group/Radio.js +121 -0
  363. package/radio-group/RadioGroup.accessibility.test.d.ts +1 -0
  364. package/radio-group/RadioGroup.accessibility.test.js +97 -0
  365. package/radio-group/RadioGroup.d.ts +4 -0
  366. package/radio-group/RadioGroup.js +233 -0
  367. package/radio-group/RadioGroup.stories.tsx +214 -0
  368. package/radio-group/RadioGroup.test.d.ts +1 -0
  369. package/radio-group/RadioGroup.test.js +754 -0
  370. package/radio-group/types.d.ts +114 -0
  371. package/radio-group/types.js +5 -0
  372. package/resultset-table/Icons.d.ts +7 -0
  373. package/resultset-table/Icons.js +47 -0
  374. package/resultset-table/ResultsetTable.accessibility.test.d.ts +1 -0
  375. package/resultset-table/ResultsetTable.accessibility.test.js +284 -0
  376. package/resultset-table/ResultsetTable.d.ts +7 -0
  377. package/resultset-table/ResultsetTable.js +195 -0
  378. package/resultset-table/ResultsetTable.stories.tsx +413 -0
  379. package/resultset-table/ResultsetTable.test.d.ts +1 -0
  380. package/resultset-table/ResultsetTable.test.js +450 -0
  381. package/resultset-table/types.d.ts +101 -0
  382. package/resultset-table/types.js +5 -0
  383. package/select/Listbox.d.ts +4 -0
  384. package/select/Listbox.js +151 -0
  385. package/select/Option.d.ts +4 -0
  386. package/select/Option.js +89 -0
  387. package/select/Select.accessibility.test.d.ts +1 -0
  388. package/select/Select.accessibility.test.js +227 -0
  389. package/select/Select.d.ts +4 -0
  390. package/select/Select.js +602 -0
  391. package/select/Select.stories.tsx +928 -0
  392. package/select/Select.test.d.ts +1 -0
  393. package/select/Select.test.js +2168 -0
  394. package/select/types.d.ts +209 -0
  395. package/select/types.js +5 -0
  396. package/sidenav/Sidenav.accessibility.test.d.ts +1 -0
  397. package/sidenav/Sidenav.accessibility.test.js +59 -0
  398. package/sidenav/Sidenav.d.ts +10 -0
  399. package/sidenav/Sidenav.js +201 -0
  400. package/sidenav/Sidenav.stories.tsx +277 -0
  401. package/sidenav/Sidenav.test.d.ts +1 -0
  402. package/sidenav/Sidenav.test.js +37 -0
  403. package/sidenav/SidenavContext.d.ts +5 -0
  404. package/sidenav/SidenavContext.js +13 -0
  405. package/sidenav/types.d.ts +76 -0
  406. package/sidenav/types.js +5 -0
  407. package/slider/Slider.accessibility.test.d.ts +1 -0
  408. package/slider/Slider.accessibility.test.js +103 -0
  409. package/slider/Slider.d.ts +4 -0
  410. package/slider/Slider.js +283 -0
  411. package/slider/Slider.stories.tsx +180 -0
  412. package/slider/Slider.test.d.ts +1 -0
  413. package/slider/Slider.test.js +256 -0
  414. package/slider/types.d.ts +86 -0
  415. package/slider/types.js +5 -0
  416. package/spinner/Spinner.accessibility.test.d.ts +1 -0
  417. package/spinner/Spinner.accessibility.test.js +96 -0
  418. package/spinner/Spinner.d.ts +4 -0
  419. package/spinner/Spinner.js +191 -0
  420. package/spinner/Spinner.stories.tsx +129 -0
  421. package/spinner/Spinner.test.d.ts +1 -0
  422. package/spinner/Spinner.test.js +55 -0
  423. package/spinner/types.d.ts +32 -0
  424. package/spinner/types.js +5 -0
  425. package/status-light/StatusLight.accessibility.test.d.ts +1 -0
  426. package/status-light/StatusLight.accessibility.test.js +157 -0
  427. package/status-light/StatusLight.d.ts +4 -0
  428. package/status-light/StatusLight.js +51 -0
  429. package/status-light/StatusLight.stories.tsx +74 -0
  430. package/status-light/StatusLight.test.d.ts +1 -0
  431. package/status-light/StatusLight.test.js +25 -0
  432. package/status-light/types.d.ts +17 -0
  433. package/status-light/types.js +5 -0
  434. package/switch/Switch.accessibility.test.d.ts +1 -0
  435. package/switch/Switch.accessibility.test.js +98 -0
  436. package/switch/Switch.d.ts +4 -0
  437. package/switch/Switch.js +211 -0
  438. package/switch/Switch.stories.tsx +149 -0
  439. package/switch/Switch.test.d.ts +1 -0
  440. package/switch/Switch.test.js +180 -0
  441. package/switch/types.d.ts +66 -0
  442. package/switch/types.js +5 -0
  443. package/table/DropdownTheme.js +62 -0
  444. package/table/Table.accessibility.test.d.ts +1 -0
  445. package/table/Table.accessibility.test.js +92 -0
  446. package/table/Table.d.ts +8 -0
  447. package/table/Table.js +161 -0
  448. package/table/Table.stories.tsx +663 -0
  449. package/table/Table.test.d.ts +1 -0
  450. package/table/Table.test.js +111 -0
  451. package/table/types.d.ts +49 -0
  452. package/table/types.js +5 -0
  453. package/tabs/Tab.d.ts +4 -0
  454. package/tabs/Tab.js +117 -0
  455. package/tabs/Tabs.accessibility.test.d.ts +1 -0
  456. package/tabs/Tabs.accessibility.test.js +56 -0
  457. package/tabs/Tabs.d.ts +4 -0
  458. package/tabs/Tabs.js +373 -0
  459. package/tabs/Tabs.stories.tsx +230 -0
  460. package/tabs/Tabs.test.d.ts +1 -0
  461. package/tabs/Tabs.test.js +276 -0
  462. package/tabs/types.d.ts +92 -0
  463. package/tabs/types.js +5 -0
  464. package/tag/Tag.accessibility.test.d.ts +1 -0
  465. package/tag/Tag.accessibility.test.js +69 -0
  466. package/tag/Tag.d.ts +4 -0
  467. package/tag/Tag.js +151 -0
  468. package/tag/Tag.stories.tsx +152 -0
  469. package/tag/Tag.test.d.ts +1 -0
  470. package/tag/Tag.test.js +41 -0
  471. package/tag/types.d.ts +69 -0
  472. package/tag/types.js +5 -0
  473. package/text-input/Suggestion.d.ts +4 -0
  474. package/text-input/Suggestion.js +67 -0
  475. package/text-input/Suggestions.d.ts +4 -0
  476. package/text-input/Suggestions.js +94 -0
  477. package/text-input/TextInput.accessibility.test.d.ts +1 -0
  478. package/text-input/TextInput.accessibility.test.js +320 -0
  479. package/text-input/TextInput.d.ts +4 -0
  480. package/text-input/TextInput.js +571 -0
  481. package/text-input/TextInput.stories.tsx +477 -0
  482. package/text-input/TextInput.test.d.ts +1 -0
  483. package/text-input/TextInput.test.js +1755 -0
  484. package/text-input/types.d.ts +205 -0
  485. package/text-input/types.js +5 -0
  486. package/textarea/Textarea.accessibility.test.d.ts +1 -0
  487. package/textarea/Textarea.accessibility.test.js +155 -0
  488. package/textarea/Textarea.d.ts +4 -0
  489. package/textarea/Textarea.js +235 -0
  490. package/textarea/Textarea.stories.tsx +174 -0
  491. package/textarea/Textarea.test.d.ts +1 -0
  492. package/textarea/Textarea.test.js +406 -0
  493. package/textarea/types.d.ts +141 -0
  494. package/textarea/types.js +5 -0
  495. package/toggle-group/ToggleGroup.accessibility.test.d.ts +1 -0
  496. package/toggle-group/ToggleGroup.accessibility.test.js +107 -0
  497. package/toggle-group/ToggleGroup.d.ts +4 -0
  498. package/toggle-group/ToggleGroup.js +199 -0
  499. package/toggle-group/ToggleGroup.stories.tsx +218 -0
  500. package/toggle-group/ToggleGroup.test.d.ts +1 -0
  501. package/toggle-group/ToggleGroup.test.js +137 -0
  502. package/toggle-group/types.d.ts +114 -0
  503. package/toggle-group/types.js +5 -0
  504. package/tooltip/Tooltip.accessibility.test.d.ts +1 -0
  505. package/tooltip/Tooltip.accessibility.test.js +144 -0
  506. package/tooltip/Tooltip.d.ts +4 -0
  507. package/tooltip/Tooltip.js +50 -0
  508. package/tooltip/Tooltip.stories.tsx +111 -0
  509. package/tooltip/Tooltip.test.d.ts +1 -0
  510. package/tooltip/Tooltip.test.js +112 -0
  511. package/tooltip/types.d.ts +16 -0
  512. package/tooltip/types.js +5 -0
  513. package/typography/Typography.accessibility.test.d.ts +1 -0
  514. package/typography/Typography.accessibility.test.js +339 -0
  515. package/typography/Typography.d.ts +4 -0
  516. package/typography/Typography.js +23 -0
  517. package/typography/Typography.stories.tsx +196 -0
  518. package/typography/Typography.test.js +23 -0
  519. package/typography/types.d.ts +18 -0
  520. package/typography/types.js +5 -0
  521. package/useTheme.d.ts +1168 -0
  522. package/{dist/useTheme.js → useTheme.js} +4 -11
  523. package/useTranslatedLabels.d.ts +96 -0
  524. package/useTranslatedLabels.js +14 -0
  525. package/utils/BaseTypography.d.ts +21 -0
  526. package/utils/BaseTypography.js +98 -0
  527. package/utils/FocusLock.d.ts +13 -0
  528. package/utils/FocusLock.js +125 -0
  529. package/wizard/Wizard.accessibility.test.d.ts +1 -0
  530. package/wizard/Wizard.accessibility.test.js +55 -0
  531. package/wizard/Wizard.d.ts +4 -0
  532. package/wizard/Wizard.js +239 -0
  533. package/wizard/Wizard.stories.tsx +272 -0
  534. package/wizard/Wizard.test.d.ts +1 -0
  535. package/wizard/Wizard.test.js +114 -0
  536. package/wizard/types.d.ts +64 -0
  537. package/wizard/types.js +5 -0
  538. package/babel.config.js +0 -8
  539. package/dist/BackgroundColorContext.js +0 -46
  540. package/dist/ThemeContext.js +0 -216
  541. package/dist/accordion/Accordion.js +0 -356
  542. package/dist/accordion/Accordion.stories.js +0 -207
  543. package/dist/accordion/readme.md +0 -96
  544. package/dist/accordion-group/AccordionGroup.js +0 -188
  545. package/dist/accordion-group/AccordionGroup.stories.js +0 -207
  546. package/dist/accordion-group/readme.md +0 -70
  547. package/dist/alert/Alert.js +0 -318
  548. package/dist/alert/Alert.stories.js +0 -158
  549. package/dist/alert/close.svg +0 -4
  550. package/dist/alert/error.svg +0 -4
  551. package/dist/alert/info.svg +0 -4
  552. package/dist/alert/readme.md +0 -43
  553. package/dist/alert/success.svg +0 -4
  554. package/dist/alert/warning.svg +0 -4
  555. package/dist/badge/Badge.js +0 -61
  556. package/dist/box/Box.js +0 -164
  557. package/dist/button/Button.js +0 -228
  558. package/dist/button/Button.stories.js +0 -224
  559. package/dist/button/readme.md +0 -93
  560. package/dist/card/Card.js +0 -247
  561. package/dist/checkbox/Checkbox.js +0 -233
  562. package/dist/checkbox/Checkbox.stories.js +0 -144
  563. package/dist/checkbox/readme.md +0 -116
  564. package/dist/chip/Chip.js +0 -223
  565. package/dist/common/OpenSans.css +0 -81
  566. package/dist/common/RequiredComponent.js +0 -40
  567. package/dist/common/fonts/OpenSans-Bold.ttf +0 -0
  568. package/dist/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  569. package/dist/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  570. package/dist/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  571. package/dist/common/fonts/OpenSans-Italic.ttf +0 -0
  572. package/dist/common/fonts/OpenSans-Light.ttf +0 -0
  573. package/dist/common/fonts/OpenSans-LightItalic.ttf +0 -0
  574. package/dist/common/fonts/OpenSans-Regular.ttf +0 -0
  575. package/dist/common/fonts/OpenSans-SemiBold.ttf +0 -0
  576. package/dist/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  577. package/dist/common/variables.js +0 -882
  578. package/dist/date/Date.js +0 -359
  579. package/dist/date/Date.stories.js +0 -205
  580. package/dist/date/calendar.svg +0 -1
  581. package/dist/date/calendar_dark.svg +0 -1
  582. package/dist/date/readme.md +0 -73
  583. package/dist/dialog/Dialog.js +0 -203
  584. package/dist/dialog/Dialog.stories.js +0 -217
  585. package/dist/dialog/readme.md +0 -32
  586. package/dist/dropdown/Dropdown.js +0 -456
  587. package/dist/dropdown/Dropdown.stories.js +0 -249
  588. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  589. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  590. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  591. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  592. package/dist/dropdown/readme.md +0 -69
  593. package/dist/footer/Footer.js +0 -405
  594. package/dist/footer/Footer.stories.js +0 -94
  595. package/dist/footer/dxc_logo_wht.png +0 -0
  596. package/dist/footer/readme.md +0 -41
  597. package/dist/header/Header.js +0 -431
  598. package/dist/header/Header.stories.js +0 -176
  599. package/dist/header/close_icon.svg +0 -1
  600. package/dist/header/dxc_logo_black.png +0 -0
  601. package/dist/header/dxc_logo_blk_rgb.svg +0 -6
  602. package/dist/header/dxc_logo_white.png +0 -0
  603. package/dist/header/hamb_menu_black.svg +0 -1
  604. package/dist/header/hamb_menu_white.svg +0 -1
  605. package/dist/header/readme.md +0 -33
  606. package/dist/input-text/InputText.js +0 -631
  607. package/dist/input-text/InputText.stories.js +0 -209
  608. package/dist/input-text/error.svg +0 -1
  609. package/dist/input-text/readme.md +0 -91
  610. package/dist/layout/ApplicationLayout.js +0 -331
  611. package/dist/layout/facebook.svg +0 -45
  612. package/dist/layout/linkedin.svg +0 -50
  613. package/dist/layout/twitter.svg +0 -53
  614. package/dist/link/Link.js +0 -212
  615. package/dist/link/readme.md +0 -51
  616. package/dist/paginator/Paginator.js +0 -283
  617. package/dist/paginator/images/next.svg +0 -3
  618. package/dist/paginator/images/nextPage.svg +0 -3
  619. package/dist/paginator/images/previous.svg +0 -3
  620. package/dist/paginator/images/previousPage.svg +0 -3
  621. package/dist/paginator/readme.md +0 -50
  622. package/dist/progress-bar/ProgressBar.js +0 -206
  623. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  624. package/dist/progress-bar/readme.md +0 -63
  625. package/dist/radio/Radio.js +0 -190
  626. package/dist/radio/Radio.stories.js +0 -166
  627. package/dist/radio/readme.md +0 -70
  628. package/dist/resultsetTable/ResultsetTable.js +0 -332
  629. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  630. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  631. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  632. package/dist/select/Select.js +0 -490
  633. package/dist/select/Select.stories.js +0 -235
  634. package/dist/select/readme.md +0 -72
  635. package/dist/sidenav/Sidenav.js +0 -183
  636. package/dist/slider/Slider.js +0 -267
  637. package/dist/slider/Slider.stories.js +0 -241
  638. package/dist/slider/readme.md +0 -64
  639. package/dist/spinner/Spinner.js +0 -214
  640. package/dist/spinner/Spinner.stories.js +0 -183
  641. package/dist/spinner/readme.md +0 -65
  642. package/dist/switch/Switch.js +0 -222
  643. package/dist/switch/Switch.stories.js +0 -134
  644. package/dist/switch/readme.md +0 -133
  645. package/dist/table/Table.js +0 -118
  646. package/dist/tabs/Tabs.js +0 -347
  647. package/dist/tabs/Tabs.stories.js +0 -130
  648. package/dist/tabs/readme.md +0 -78
  649. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  650. package/dist/tabs-for-sections/readme.md +0 -78
  651. package/dist/tag/Tag.js +0 -268
  652. package/dist/textarea/Textarea.js +0 -238
  653. package/dist/toggle/Toggle.js +0 -220
  654. package/dist/toggle/Toggle.stories.js +0 -297
  655. package/dist/toggle/readme.md +0 -80
  656. package/dist/toggle-group/ToggleGroup.js +0 -241
  657. package/dist/toggle-group/readme.md +0 -82
  658. package/dist/upload/Upload.js +0 -209
  659. package/dist/upload/Upload.stories.js +0 -72
  660. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -123
  661. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  662. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  663. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -293
  664. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  665. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  666. package/dist/upload/file-upload/FileToUpload.js +0 -162
  667. package/dist/upload/file-upload/audio-icon.svg +0 -4
  668. package/dist/upload/file-upload/close.svg +0 -4
  669. package/dist/upload/file-upload/file-icon.svg +0 -4
  670. package/dist/upload/file-upload/video-icon.svg +0 -4
  671. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  672. package/dist/upload/readme.md +0 -37
  673. package/dist/upload/transaction/Transaction.js +0 -152
  674. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  675. package/dist/upload/transaction/audio-icon.svg +0 -4
  676. package/dist/upload/transaction/error-icon.svg +0 -4
  677. package/dist/upload/transaction/file-icon-err.svg +0 -4
  678. package/dist/upload/transaction/file-icon.svg +0 -4
  679. package/dist/upload/transaction/image-icon-err.svg +0 -4
  680. package/dist/upload/transaction/image-icon.svg +0 -4
  681. package/dist/upload/transaction/success-icon.svg +0 -4
  682. package/dist/upload/transaction/video-icon-err.svg +0 -4
  683. package/dist/upload/transaction/video-icon.svg +0 -4
  684. package/dist/upload/transactions/Transactions.js +0 -122
  685. package/dist/wizard/Wizard.js +0 -383
  686. package/dist/wizard/invalid_icon.svg +0 -6
  687. package/dist/wizard/valid_icon.svg +0 -6
  688. package/dist/wizard/validation-wrong.svg +0 -6
  689. package/test/Accordion.test.js +0 -33
  690. package/test/AccordionGroup.test.js +0 -125
  691. package/test/Alert.test.js +0 -53
  692. package/test/Box.test.js +0 -10
  693. package/test/Button.test.js +0 -18
  694. package/test/Card.test.js +0 -30
  695. package/test/Checkbox.test.js +0 -45
  696. package/test/Chip.test.js +0 -25
  697. package/test/Date.test.js +0 -393
  698. package/test/Dialog.test.js +0 -23
  699. package/test/Dropdown.test.js +0 -130
  700. package/test/Footer.test.js +0 -99
  701. package/test/Header.test.js +0 -39
  702. package/test/Heading.test.js +0 -35
  703. package/test/InputText.test.js +0 -240
  704. package/test/Link.test.js +0 -42
  705. package/test/Paginator.test.js +0 -177
  706. package/test/ProgressBar.test.js +0 -35
  707. package/test/Radio.test.js +0 -37
  708. package/test/ResultsetTable.test.js +0 -330
  709. package/test/Select.test.js +0 -192
  710. package/test/Sidenav.test.js +0 -45
  711. package/test/Slider.test.js +0 -82
  712. package/test/Spinner.test.js +0 -27
  713. package/test/Switch.test.js +0 -45
  714. package/test/Table.test.js +0 -36
  715. package/test/Tabs.test.js +0 -109
  716. package/test/TabsForSections.test.js +0 -34
  717. package/test/Tag.test.js +0 -32
  718. package/test/TextArea.test.js +0 -52
  719. package/test/ToggleGroup.test.js +0 -81
  720. package/test/Upload.test.js +0 -60
  721. package/test/Wizard.test.js +0 -130
  722. package/test/mocks/pngMock.js +0 -1
  723. package/test/mocks/svgMock.js +0 -1
package/test/Card.test.js DELETED
@@ -1,30 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcCard from "../src/card/Card";
4
-
5
- describe("Card component tests", () => {
6
- test("Card renders with correct content", () => {
7
- const { getByText } = render(<DxcCard>test-card</DxcCard>);
8
- expect(getByText("test-card")).toBeTruthy();
9
- });
10
-
11
- test("Card renders with correct href", () => {
12
- const { getByRole } = render(<DxcCard linkHref="/testPage">test-card</DxcCard>);
13
- const card = getByRole("link");
14
- expect(card.getAttribute("href")).toEqual("/testPage");
15
- });
16
-
17
- test("Card renders with correct image", () => {
18
- const { getByRole } = render(<DxcCard imageSrc="/testImage">test-card</DxcCard>);
19
- const card = getByRole("img");
20
- expect(card.getAttribute("src")).toEqual("/testImage");
21
- });
22
-
23
- test("OnClick function is called", () => {
24
- const onClick = jest.fn();
25
- const { getByText } = render(<DxcCard onClick={onClick}>test-card</DxcCard>);
26
- const card = getByText("test-card");
27
- fireEvent.click(card);
28
- expect(onClick).toHaveBeenCalled();
29
- });
30
- });
@@ -1,45 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
-
4
- import DxcCheckbox from "../src/checkbox/Checkbox";
5
-
6
- describe("Checkbox component tests", () => {
7
- test("Checkbox renders with correct text", () => {
8
- const { getByText } = render(<DxcCheckbox label="Checkbox" />);
9
-
10
- expect(getByText("Checkbox")).toBeTruthy();
11
- });
12
-
13
- test("Calls correct function on click", () => {
14
- const onChange = jest.fn();
15
- const { getByText } = render(<DxcCheckbox label="Checkbox" onChange={onChange} />);
16
-
17
- fireEvent.click(getByText("Checkbox"));
18
- expect(onChange).toHaveBeenCalled();
19
- });
20
-
21
- test("Uncontrolled checkbox", () => {
22
- const onChange = jest.fn();
23
- const component = render(<DxcCheckbox label="Checkbox" onChange={onChange} />);
24
- const visibleCheckbox = component.getByText("Checkbox");
25
- const input = component.getByRole("checkbox");
26
- expect(input.checked).toBe(false);
27
- fireEvent.click(visibleCheckbox);
28
- expect(onChange).toHaveBeenCalled();
29
- expect(onChange).toHaveBeenCalledWith(true);
30
- expect(input.checked).toBe(true);
31
- });
32
-
33
- test("Controlled checkbox", () => {
34
- const onChange = jest.fn();
35
- const component = render(<DxcCheckbox label="Checkbox" checked={false} onChange={onChange} />);
36
-
37
- const input = component.getByRole("checkbox");
38
- const visibleCheckbox = component.getByText("Checkbox");
39
-
40
- fireEvent.click(visibleCheckbox);
41
- expect(onChange).toHaveBeenCalled();
42
- expect(onChange).toHaveBeenCalledWith(true);
43
- expect(input.checked).toBe(false);
44
- });
45
- });
package/test/Chip.test.js DELETED
@@ -1,25 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcChip from "../src/chip/Chip";
4
- import icon from "../../app/src/images/invision.svg";
5
-
6
- describe("Chip component tests", () => {
7
- test("Chip renders with correct text", () => {
8
- const { getByText } = render(<DxcChip label="Chip" />);
9
- expect(getByText("Chip")).toBeTruthy();
10
- });
11
- test("Calls correct function when clicking on prefix icon", () => {
12
- const onClick = jest.fn();
13
- const { getByText, getByRole } = render(<DxcChip label="Chip" prefixIconSrc={icon} onClickPrefix={onClick} />);
14
- expect(getByText("Chip")).toBeTruthy();
15
- fireEvent.click(getByRole("img"));
16
- expect(onClick).toHaveBeenCalled();
17
- });
18
- test("Calls correct function when clicking on suffix icon", () => {
19
- const onClick = jest.fn();
20
- const { getByText, getByRole } = render(<DxcChip label="Chip" suffixIconSrc={icon} onClickSuffix={onClick} />);
21
- expect(getByText("Chip")).toBeTruthy();
22
- fireEvent.click(getByRole("img"));
23
- expect(onClick).toHaveBeenCalled();
24
- });
25
- });
package/test/Date.test.js DELETED
@@ -1,393 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcDate from "../src/date/Date";
4
-
5
- const defaultFormat = "DD-MM-YYYY";
6
-
7
- describe("Date component general tests", () => {
8
- test("Date renders correctly", () => {
9
- const { getByPlaceholderText } = render(<DxcDate label="Birthdate" placeholder />);
10
- // const input = getByPlaceholderText('DD-MM-YYYY');
11
- expect(getByPlaceholderText(defaultFormat)).toBeTruthy();
12
- });
13
- });
14
-
15
- describe("Controlled Date Component", () => {
16
- const date = new Date("2020-10-16 00:00:00");
17
-
18
- test("Changing the input value and after this deleting its content input´s value should be ''", () => {
19
- const onChange = jest.fn((returnedValue) => {
20
- expect(returnedValue.dateValue).toBeNull();
21
- expect(returnedValue.stringValue).toBe("something");
22
- });
23
-
24
- const { getByRole, getByPlaceholderText, rerender } = render(
25
- <DxcDate label="Birthdate" value="30-03-1981" onChange={onChange} placeholder />
26
- );
27
- const input = getByPlaceholderText(defaultFormat);
28
-
29
- fireEvent.change(input, { target: { value: "something" } });
30
- expect(onChange).toHaveBeenCalled();
31
- fireEvent.blur(input);
32
- rerender(<DxcDate label="Birthdate" value="" placeholder />);
33
- // expect(getByRole("textbox").value).toBe('');
34
- });
35
-
36
- test("The input´s value is the same as the one received as a parameter (Default format)", () => {
37
- const { getByRole, getByPlaceholderText } = render(<DxcDate label="Birthdate" value="30/03/1981" placeholder />);
38
- // const input = getByRole("textbox");
39
- const input = getByPlaceholderText(defaultFormat);
40
- expect(input.value).toBe("30/03/1981");
41
- });
42
-
43
- test("The input´s value is the same as the one received as a parameter (Custom format)", () => {
44
- const { getByRole, getByPlaceholderText } = render(
45
- <DxcDate label="Birthdate" format="dd/MM/yy" value="30/03/81" placeholder />
46
- );
47
- // const input = getByRole("textbox");
48
- const input = getByPlaceholderText("DD/MM/YY");
49
- expect(input.value).toBe("30/03/81");
50
- });
51
-
52
- test("Calendar´s value is the same as the input´s date if it´s right (Depending on the format)", () => {
53
- const { getByRole, getByText } = render(<DxcDate label="Birthdate" value="16-10-2020" />);
54
- fireEvent.click(getByRole("img"));
55
- expect(getByText("Fri, Oct 16")).toBeTruthy();
56
- });
57
-
58
- test("Calendar´s value is the same as the input´s date if it´s right after changing the input value", () => {
59
- const { getByRole, getByText, rerender, getByPlaceholderText } = render(
60
- <DxcDate label="Birthdate" value="30-03-1981" placeholder />
61
- );
62
- // const input = getByRole("textbox");
63
- const input = getByPlaceholderText(defaultFormat);
64
- fireEvent.change(input, { target: { value: "10-02-2020" } });
65
-
66
- rerender(<DxcDate label="Birthdate" value="10-02-2020" />);
67
- const calendarButton = getByRole("img");
68
- fireEvent.click(calendarButton);
69
- expect(getByText("Mon, Feb 10")).toBeTruthy();
70
- });
71
-
72
- test("onChange function is called when the user types something in the input", () => {
73
- const onChange = jest.fn((returnedValue) => {
74
- expect(returnedValue.dateValue).toBeNull();
75
- expect(returnedValue.stringValue).toBe("something");
76
- });
77
-
78
- const { getByRole, getByPlaceholderText } = render(
79
- <DxcDate label="Birthdate" value="30-03-1981" onChange={onChange} placeholder />
80
- );
81
- // const input = getByRole("textbox");
82
- const input = getByPlaceholderText(defaultFormat);
83
-
84
- fireEvent.change(input, { target: { value: "something" } });
85
- expect(onChange).toHaveBeenCalled();
86
- });
87
-
88
- test("onChange function is called when the user types in the input a valid date(based on its format), the object received as a parameter in the onChange function is what should be(DEFAULT FORMAT)", () => {
89
- const onChange = jest.fn((returnedValue) => {
90
- expect(returnedValue.dateValue.getTime()).toBe(date.getTime());
91
- expect(returnedValue.stringValue).toBe("16-10-2020");
92
- });
93
-
94
- const { getByRole, getByPlaceholderText } = render(
95
- <DxcDate label="Birthdate" value="30-03-1981" onChange={onChange} placeholder />
96
- );
97
- // const input = getByRole("textbox");
98
- const input = getByPlaceholderText(defaultFormat);
99
- fireEvent.change(input, { target: { value: "16-10-2020" } });
100
- expect(onChange).toHaveBeenCalled();
101
- });
102
-
103
- test("onChange function is called when the user types in the input a valid date(based on its format), the object received as a parameter in the onChange function is what should be(CUSTOM FORMAT)", () => {
104
- const onChange = jest.fn((returnedValue) => {
105
- expect(returnedValue.dateValue.getTime()).toBe(date.getTime());
106
- expect(returnedValue.stringValue).toBe("16-10-20");
107
- });
108
-
109
- const { getByRole, getByPlaceholderText } = render(
110
- <DxcDate label="Birthdate" format="dd-MM-yy" value="30-03-81" onChange={onChange} placeholder />
111
- );
112
- // const input = getByRole("textbox");
113
- const input = getByPlaceholderText("DD-MM-YY");
114
-
115
- fireEvent.change(input, { target: { value: "16-10-20" } });
116
- expect(onChange).toHaveBeenCalled();
117
- });
118
-
119
- test("onChange function is called when the user types in the input an invalid date(based on its format), the object received as a parameter in the onChange function is what should be(stringValue with the written string, and null as dateValue)(DEFAULT FORMAT)", () => {
120
- const onChange = jest.fn((returnedValue) => {
121
- expect(returnedValue.dateValue).toBeNull();
122
- expect(returnedValue.stringValue).toBe("11-15-2020");
123
- });
124
-
125
- const { getByRole, getByPlaceholderText } = render(
126
- <DxcDate label="Birthdate" value="30-03-1981" onChange={onChange} placeholder />
127
- );
128
- // const input = getByRole("textbox");
129
- const input = getByPlaceholderText(defaultFormat);
130
-
131
- fireEvent.change(input, { target: { value: "11-15-2020" } });
132
- expect(onChange).toHaveBeenCalled();
133
- });
134
-
135
- test("onChange function is called when the user types in the input an invalid date(based on its format), the object received as a parameter in the onChange function is what should be(stringValue with the written string, and null as dateValue)(CUSTOM FORMAT)", () => {
136
- const onChange = jest.fn((returnedValue) => {
137
- expect(returnedValue.dateValue).toBeNull();
138
- expect(returnedValue.stringValue).toBe("15/11/2020");
139
- });
140
-
141
- const { getByRole, getByPlaceholderText } = render(
142
- <DxcDate label="Birthdate" value="03/30/1981" format="MM/dd/yyyy" onChange={onChange} placeholder />
143
- );
144
- // const input = getByRole("textbox");
145
- const input = getByPlaceholderText("MM/DD/YYYY");
146
-
147
- fireEvent.change(input, { target: { value: "15/11/2020" } });
148
- expect(onChange).toHaveBeenCalled();
149
- });
150
-
151
- test("onChange function is called when the user selects from the calendar", () => {
152
- const onChange = jest.fn();
153
-
154
- const component = render(<DxcDate label="Birthdate" value="01-02-2020" onChange={onChange} />);
155
- const calendarButton = component.getByRole("img");
156
- fireEvent.click(calendarButton);
157
- const dayButton = component.getByRole("button", { name: "10" });
158
- fireEvent.click(dayButton);
159
- expect(dayButton).toBeTruthy();
160
- expect(onChange).toHaveBeenCalled();
161
- });
162
-
163
- test("onChange function is called when the user selects from the calendar, the dateValue received by the onChange function is the selected date", () => {
164
- const onChange = jest.fn((returnedValue) => {
165
- expect(returnedValue.dateValue.getTime()).toBe(date.getTime());
166
- });
167
-
168
- const component = render(<DxcDate label="Birthdate" value="30-10-2020" onChange={onChange} />);
169
- const calendarButton = component.getByRole("img");
170
- fireEvent.click(calendarButton);
171
- const dayButton = component.getByRole("button", { name: "16" });
172
- fireEvent.click(dayButton);
173
- expect(dayButton).toBeTruthy();
174
- });
175
-
176
- test("onChange function is called when the user selects from the calendar, the stringValue received by the onChange function is the date with the correct format (DEFAULT FORMAT)", () => {
177
- const onChange = jest.fn((returnedValue) => {
178
- expect(returnedValue.stringValue).toBe("16-10-2020");
179
- });
180
-
181
- const component = render(<DxcDate label="Birthdate" value="01-10-2020" onChange={onChange} />);
182
- const calendarButton = component.getByRole("img");
183
- fireEvent.click(calendarButton);
184
- const dayButton = component.getByRole("button", { name: "16" });
185
- fireEvent.click(dayButton);
186
- expect(dayButton).toBeTruthy();
187
- });
188
-
189
- test("onChange function is called when the user selects from the calendar, the stringValue received by the onChange function is the date with the correct format (CUSTOM FORMAT)", () => {
190
- const onChange = jest.fn((returnedValue) => {
191
- expect(returnedValue.stringValue).toBe("2020/10/16");
192
- });
193
-
194
- const component = render(<DxcDate label="Birthdate" format="yyyy/MM/dd" value="2020/10/01" onChange={onChange} />);
195
- const calendarButton = component.getByRole("img");
196
- fireEvent.click(calendarButton);
197
- const dayButton = component.getByRole("button", { name: "16" });
198
- fireEvent.click(dayButton);
199
- expect(dayButton).toBeTruthy();
200
- });
201
-
202
- test("Check selected date on calendar is the same date as the one on the input", () => {
203
- const component = render(<DxcDate label="Birthdate" value="01-10-2020" />);
204
- const calendarButton = component.getByRole("img");
205
- fireEvent.click(calendarButton);
206
- const dayButton = component.getByRole("button", { name: "1" });
207
- expect(dayButton.classList.contains("MuiPickersDay-daySelected")).toBe(true);
208
- });
209
- test("onBlur function is called", () => {
210
- const onBlur = jest.fn();
211
- const { getByRole, getByPlaceholderText } = render(
212
- <DxcDate label="Birthdate" value="30-03-81" onBlur={onBlur} placeholder />
213
- );
214
- // const input = getByRole("textbox");
215
- const input = getByPlaceholderText(defaultFormat);
216
-
217
- fireEvent.blur(input);
218
- expect(onBlur).toHaveBeenCalled();
219
- });
220
- test("onBlur function is called and the parameter received is what should be(DEFAULT FORMAT)", () => {
221
- const onBlur = jest.fn((returnedValue) => {
222
- expect(returnedValue).toBe("30-03-81");
223
- });
224
- const { getByRole, getByPlaceholderText } = render(
225
- <DxcDate label="Birthdate" value="30-03-81" onBlur={onBlur} placeholder />
226
- );
227
- // const input = getByRole("textbox");
228
- const input = getByPlaceholderText(defaultFormat);
229
-
230
- fireEvent.blur(input);
231
- expect(onBlur).toHaveBeenCalled();
232
- });
233
- test("onBlur function is called and the parameter received is what should be(CUSTOM FORMAT)", () => {
234
- const onBlur = jest.fn((returnedValue) => {
235
- expect(returnedValue).toBe("30/03/81");
236
- });
237
- const { getByRole, getByPlaceholderText } = render(
238
- <DxcDate label="Birthdate" format="dd/MM/yy" value="30/03/81" onBlur={onBlur} placeholder />
239
- );
240
- // const input = getByRole("textbox");
241
- const input = getByPlaceholderText("DD/MM/YY");
242
-
243
- fireEvent.blur(input);
244
- expect(onBlur).toHaveBeenCalled();
245
- });
246
- });
247
-
248
- describe("Uncontrolled Date Component", () => {
249
- const date = new Date("2020-10-16 00:00:00");
250
-
251
- test("Calendar´s value is the same as the input´s date if it´s right after changing the input value", () => {
252
- const { getByRole, getByText, rerender, getByPlaceholderText } = render(<DxcDate label="Birthdate" placeholder />);
253
- // const input = getByRole("textbox");
254
- const input = getByPlaceholderText(defaultFormat);
255
-
256
- fireEvent.change(input, { target: { value: "10-02-2020" } });
257
-
258
- rerender(<DxcDate label="Birthdate" value="10-02-2020" />);
259
- const calendarButton = getByRole("img");
260
- fireEvent.click(calendarButton);
261
- expect(getByText("Mon, Feb 10")).toBeTruthy();
262
- });
263
-
264
- test("onChange function is called when the user types something in the input", () => {
265
- const onChange = jest.fn((returnedValue) => {
266
- expect(returnedValue.dateValue).toBeNull();
267
- expect(returnedValue.stringValue).toBe("something");
268
- });
269
-
270
- const { getByRole, getByPlaceholderText } = render(<DxcDate label="Birthdate" onChange={onChange} placeholder />);
271
- // const input = getByRole("textbox");
272
- const input = getByPlaceholderText(defaultFormat);
273
-
274
- fireEvent.change(input, { target: { value: "something" } });
275
- expect(onChange).toHaveBeenCalled();
276
- });
277
- test("onChange function is called when the user types in the input a valid date(based on its format), the object received as a parameter in the onChange function is what should be(DEFAULT FORMAT)", () => {
278
- const onChange = jest.fn((returnedValue) => {
279
- expect(returnedValue.dateValue.getTime()).toBe(date.getTime());
280
- expect(returnedValue.stringValue).toBe("16-10-2020");
281
- });
282
-
283
- const { getByRole, getByPlaceholderText } = render(<DxcDate label="Birthdate" onChange={onChange} placeholder />);
284
- // const input = getByRole("textbox");
285
- const input = getByPlaceholderText(defaultFormat);
286
-
287
- fireEvent.change(input, { target: { value: "16-10-2020" } });
288
- expect(onChange).toHaveBeenCalled();
289
- });
290
- test("onChange function is called when the user types in the input a valid date(based on its format), the object received as a parameter in the onChange function is what should be(CUSTOM FORMAT)", () => {
291
- const onChange = jest.fn((returnedValue) => {
292
- expect(returnedValue.dateValue.getTime()).toBe(date.getTime());
293
- expect(returnedValue.stringValue).toBe("16-10-20");
294
- });
295
-
296
- const { getByRole, getByPlaceholderText } = render(
297
- <DxcDate label="Birthdate" format="dd-MM-yy" onChange={onChange} placeholder />
298
- );
299
- // const input = getByRole("textbox");
300
- const input = getByPlaceholderText("DD-MM-YY");
301
-
302
- fireEvent.change(input, { target: { value: "16-10-20" } });
303
- expect(onChange).toHaveBeenCalled();
304
- });
305
-
306
- test("onChange function is called when the user types in the input an invalid date(based on its format), the object received as a parameter in the onChange function is what should be(stringValue with the written string, and null as dateValue)(DEFAULT FORMAT)", () => {
307
- const onChange = jest.fn((returnedValue) => {
308
- expect(returnedValue.dateValue).toBeNull();
309
- expect(returnedValue.stringValue).toBe("11-15-2020");
310
- });
311
-
312
- const { getByRole, getByPlaceholderText } = render(<DxcDate label="Birthdate" onChange={onChange} placeholder />);
313
- // const input = getByRole("textbox");
314
- const input = getByPlaceholderText(defaultFormat);
315
-
316
- fireEvent.change(input, { target: { value: "11-15-2020" } });
317
- expect(onChange).toHaveBeenCalled();
318
- });
319
-
320
- test("onChange function is called when the user types in the input an invalid date(based on its format), the object received as a parameter in the onChange function is what should be(stringValue with the written string, and null as dateValue)(CUSTOM FORMAT)", () => {
321
- const onChange = jest.fn((returnedValue) => {
322
- expect(returnedValue.dateValue).toBeNull();
323
- expect(returnedValue.stringValue).toBe("15/11/2020");
324
- });
325
-
326
- const { getByRole, getByPlaceholderText } = render(
327
- <DxcDate label="Birthdate" format="MM/dd/yyyy" onChange={onChange} placeholder />
328
- );
329
- // const input = getByRole("textbox");
330
- const input = getByPlaceholderText("MM/DD/YYYY");
331
-
332
- fireEvent.change(input, { target: { value: "15/11/2020" } });
333
- expect(onChange).toHaveBeenCalled();
334
- });
335
- test("onChange function is called when the user selects from the calendar", () => {
336
- const onChange = jest.fn();
337
-
338
- const component = render(<DxcDate label="Birthdate" onChange={onChange} />);
339
- const calendarButton = component.getByRole("img");
340
- fireEvent.click(calendarButton);
341
- const dayButton = component.getByRole("button", { name: "10" });
342
- fireEvent.click(dayButton);
343
- expect(dayButton).toBeTruthy();
344
- expect(onChange).toHaveBeenCalled();
345
- });
346
-
347
- test("Check selected date on calendar is the same date as the one on the input", () => {
348
- const component = render(<DxcDate label="Birthdate" placeholder />);
349
- // const input = component.getByRole("textbox");
350
- const input = component.getByPlaceholderText(defaultFormat);
351
-
352
- fireEvent.change(input, { target: { value: "10-02-2020" } });
353
- const calendarButton = component.getByRole("img");
354
- fireEvent.click(calendarButton);
355
- const dayButton = component.getByRole("button", { name: "10" });
356
- expect(dayButton.classList.contains("MuiPickersDay-daySelected")).toBe(true);
357
- });
358
- test("onBlur function is called", () => {
359
- const onBlur = jest.fn();
360
- const { getByRole, getByPlaceholderText } = render(<DxcDate label="Birthdate" onBlur={onBlur} placeholder />);
361
- // const input = getByRole("textbox");
362
- const input = getByPlaceholderText(defaultFormat);
363
-
364
- fireEvent.blur(input);
365
- expect(onBlur).toHaveBeenCalled();
366
- });
367
- test("onBlur function is called and the parameter received is what should be(DEFAULT FORMAT)", () => {
368
- const onBlur = jest.fn((returnedValue) => {
369
- expect(returnedValue).toBe("10-02-2020");
370
- });
371
- const { getByRole, getByPlaceholderText } = render(<DxcDate label="Birthdate" onBlur={onBlur} placeholder />);
372
- // const input = getByRole("textbox");
373
- const input = getByPlaceholderText("DD-MM-YYYY");
374
-
375
- fireEvent.change(input, { target: { value: "10-02-2020" } });
376
- fireEvent.blur(input);
377
- expect(onBlur).toHaveBeenCalled();
378
- });
379
- test("onBlur function is called and the parameter received is what should be(CUSTOM FORMAT)", () => {
380
- const onBlur = jest.fn((returnedValue) => {
381
- expect(returnedValue).toBe("10/02/20");
382
- });
383
- const { getByRole, getByPlaceholderText } = render(
384
- <DxcDate label="Birthdate" format="dd/MM/yy" onBlur={onBlur} placeholder />
385
- );
386
- // const input = getByRole("textbox");
387
- const input = getByPlaceholderText("DD/MM/YY");
388
-
389
- fireEvent.change(input, { target: { value: "10/02/20" } });
390
- fireEvent.blur(input);
391
- expect(onBlur).toHaveBeenCalled();
392
- });
393
- });
@@ -1,23 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcDialog from "../src/dialog/Dialog";
4
-
5
- describe("Dialog component tests", () => {
6
- test("Dialog renders with correct text", () => {
7
- const { getByText } = render(<DxcDialog>dialog-text</DxcDialog>);
8
- expect(getByText("dialog-text")).toBeTruthy();
9
- });
10
-
11
- test("Dialog renders without close button", () => {
12
- const { queryByRole } = render(<DxcDialog isCloseVisible={false}>dialog-text</DxcDialog>);
13
- expect(queryByRole("button")).toBeFalsy();
14
- });
15
-
16
- test("Calls correct function onCloseClick", () => {
17
- const onCloseClick = jest.fn();
18
- const { getByRole } = render(<DxcDialog onCloseClick={onCloseClick}>dialog-text</DxcDialog>);
19
- const closeButton = getByRole("button");
20
- fireEvent.click(closeButton);
21
- expect(onCloseClick).toHaveBeenCalled();
22
- });
23
- });
@@ -1,130 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent, act } from "@testing-library/react";
3
- import DxcDropdown from "../src/dropdown/Dropdown";
4
-
5
- global.document.createRange = () => ({
6
- setStart: () => {},
7
- setEnd: () => {},
8
- commonAncestorContainer: {
9
- nodeName: "BODY",
10
- ownerDocument: document,
11
- },
12
- });
13
-
14
- describe("Dropdown component tests", () => {
15
- test("Dropdown renders with correct label", () => {
16
- const { getByText } = render(<DxcDropdown label="dropdown-test"></DxcDropdown>);
17
- expect(getByText("dropdown-test")).toBeTruthy();
18
- });
19
-
20
- test("Dropdown renders with correct icon before", () => {
21
- const { getAllByRole } = render(<DxcDropdown iconSrc="/testIcon" label="dropdown-test"></DxcDropdown>);
22
- const image = getAllByRole("img")[0];
23
- expect(image.getAttribute("src")).toEqual("/testIcon");
24
- });
25
-
26
- test("Dropdown renders with correct icon after", () => {
27
- const { getAllByRole } = render(
28
- <DxcDropdown iconSrc="/testIcon" iconPosition="after" label="dropdown-test"></DxcDropdown>
29
- );
30
- const image = getAllByRole("img")[0];
31
- expect(image.getAttribute("src")).toEqual("/testIcon");
32
- });
33
-
34
- test("onClick shows and hides option", () => {
35
- const options = [
36
- {
37
- value: 1,
38
- label: "option-test",
39
- },
40
- ];
41
- const { queryByText } = render(<DxcDropdown options={options} label="dropdown-test"></DxcDropdown>);
42
- const dropdown = queryByText("dropdown-test");
43
- //Before clicked is not showed
44
- expect(queryByText("option-test")).toBeFalsy();
45
- act(() => {
46
- fireEvent.click(dropdown);
47
- });
48
- expect(queryByText("option-test")).toBeTruthy();
49
- });
50
-
51
- test("Dropdown renders with correct icon before option", () => {
52
- const options = [
53
- {
54
- value: 1,
55
- label: "option-test",
56
- iconSrc: "/testIcon",
57
- },
58
- ];
59
- const { getByText, getByRole } = render(<DxcDropdown options={options} label="dropdown-test"></DxcDropdown>);
60
- const dropdown = getByText("dropdown-test");
61
- act(() => {
62
- fireEvent.click(dropdown);
63
- });
64
- expect(getByRole("img").getAttribute("src")).toEqual("/testIcon");
65
- });
66
-
67
- test("Dropdown renders with correct icon after option", () => {
68
- const options = [
69
- {
70
- value: 1,
71
- label: "option-test",
72
- iconSrc: "/testIcon",
73
- },
74
- ];
75
- const { getByText, getByRole } = render(
76
- <DxcDropdown options={options} optionsIconPosition="after" label="dropdown-test"></DxcDropdown>
77
- );
78
- const dropdown = getByText("dropdown-test");
79
- act(() => {
80
- fireEvent.click(dropdown);
81
- });
82
- expect(getByRole("img").getAttribute("src")).toEqual("/testIcon");
83
- });
84
-
85
- test("Dropdown renders with caret hidden", () => {
86
- const { queryByRole } = render(<DxcDropdown caretHidden={true} label="dropdown-test"></DxcDropdown>);
87
- expect(queryByRole("img")).toBeFalsy();
88
- });
89
-
90
- test("onSelectOption fuction is called correctly", () => {
91
- const onSelectOption = jest.fn((i) => i);
92
- const options = [
93
- {
94
- value: 1,
95
- label: "option-test",
96
- },
97
- ];
98
- const { getByText } = render(
99
- <DxcDropdown options={options} onSelectOption={onSelectOption} label="dropdown-test"></DxcDropdown>
100
- );
101
- const dropdown = getByText("dropdown-test");
102
- act(() => {
103
- fireEvent.click(dropdown);
104
- });
105
- const option = getByText("option-test");
106
- act(() => {
107
- fireEvent.click(option);
108
- });
109
- expect(onSelectOption).toHaveBeenCalledWith(1);
110
- });
111
-
112
- test("expandOnHover shows and hides the option correctly", () => {
113
- const options = [
114
- {
115
- value: 1,
116
- label: "option-test",
117
- },
118
- ];
119
- const { queryByText } = render(
120
- <DxcDropdown options={options} expandOnHover={true} label="dropdown-test"></DxcDropdown>
121
- );
122
- const dropdown = queryByText("dropdown-test");
123
- //Verify that is not showed before
124
- expect(queryByText("option-test")).toBeFalsy();
125
- act(() => {
126
- fireEvent.mouseOver(dropdown);
127
- });
128
- expect(queryByText("option-test")).toBeTruthy();
129
- });
130
- });