@dxc-technology/halstack-react 0.0.0-356b44c → 0.0.0-35a1d38

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 (698) hide show
  1. package/BackgroundColorContext.d.ts +1 -0
  2. package/BackgroundColorContext.js +30 -0
  3. package/HalstackContext.d.ts +1246 -0
  4. package/HalstackContext.js +306 -0
  5. package/README.md +28 -47
  6. package/accordion/Accordion.accessibility.test.d.ts +1 -0
  7. package/accordion/Accordion.accessibility.test.js +71 -0
  8. package/accordion/Accordion.d.ts +4 -0
  9. package/accordion/Accordion.js +168 -0
  10. package/accordion/Accordion.stories.tsx +241 -0
  11. package/accordion/Accordion.test.d.ts +1 -0
  12. package/accordion/Accordion.test.js +56 -0
  13. package/accordion/types.d.ts +57 -0
  14. package/accordion/types.js +5 -0
  15. package/accordion-group/AccordionGroup.accessibility.test.d.ts +1 -0
  16. package/accordion-group/AccordionGroup.accessibility.test.js +82 -0
  17. package/accordion-group/AccordionGroup.d.ts +7 -0
  18. package/accordion-group/AccordionGroup.js +101 -0
  19. package/accordion-group/AccordionGroup.stories.tsx +252 -0
  20. package/accordion-group/AccordionGroup.test.d.ts +1 -0
  21. package/accordion-group/AccordionGroup.test.js +94 -0
  22. package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
  23. package/accordion-group/AccordionGroupAccordion.js +31 -0
  24. package/accordion-group/AccordionGroupContext.d.ts +3 -0
  25. package/accordion-group/AccordionGroupContext.js +8 -0
  26. package/accordion-group/types.d.ts +67 -0
  27. package/accordion-group/types.js +5 -0
  28. package/action-icon/ActionIcon.accessibility.test.d.ts +1 -0
  29. package/action-icon/ActionIcon.accessibility.test.js +63 -0
  30. package/action-icon/ActionIcon.d.ts +4 -0
  31. package/action-icon/ActionIcon.js +48 -0
  32. package/action-icon/ActionIcon.stories.tsx +41 -0
  33. package/action-icon/ActionIcon.test.d.ts +1 -0
  34. package/action-icon/ActionIcon.test.js +64 -0
  35. package/action-icon/types.d.ts +26 -0
  36. package/action-icon/types.js +5 -0
  37. package/alert/Alert.accessibility.test.d.ts +1 -0
  38. package/alert/Alert.accessibility.test.js +95 -0
  39. package/alert/Alert.d.ts +4 -0
  40. package/alert/Alert.js +203 -0
  41. package/alert/Alert.stories.tsx +198 -0
  42. package/alert/Alert.test.d.ts +1 -0
  43. package/alert/Alert.test.js +75 -0
  44. package/alert/types.d.ts +49 -0
  45. package/alert/types.js +5 -0
  46. package/badge/Badge.accessibility.test.d.ts +1 -0
  47. package/badge/Badge.accessibility.test.js +129 -0
  48. package/badge/Badge.d.ts +4 -0
  49. package/badge/Badge.js +161 -0
  50. package/badge/Badge.stories.tsx +210 -0
  51. package/badge/Badge.test.d.ts +1 -0
  52. package/badge/Badge.test.js +30 -0
  53. package/badge/types.d.ts +54 -0
  54. package/badge/types.js +5 -0
  55. package/bleed/Bleed.d.ts +3 -0
  56. package/bleed/Bleed.js +43 -0
  57. package/bleed/Bleed.stories.tsx +342 -0
  58. package/bleed/types.d.ts +37 -0
  59. package/bleed/types.js +5 -0
  60. package/box/Box.accessibility.test.d.ts +1 -0
  61. package/box/Box.accessibility.test.js +33 -0
  62. package/box/Box.d.ts +4 -0
  63. package/box/Box.js +75 -0
  64. package/box/Box.stories.tsx +119 -0
  65. package/box/Box.test.d.ts +1 -0
  66. package/box/Box.test.js +13 -0
  67. package/box/types.d.ts +32 -0
  68. package/box/types.js +5 -0
  69. package/breadcrumbs/Breadcrumbs.accessibility.test.d.ts +1 -0
  70. package/breadcrumbs/Breadcrumbs.accessibility.test.js +96 -0
  71. package/breadcrumbs/Breadcrumbs.d.ts +4 -0
  72. package/breadcrumbs/Breadcrumbs.js +79 -0
  73. package/breadcrumbs/Breadcrumbs.stories.tsx +194 -0
  74. package/breadcrumbs/Breadcrumbs.test.d.ts +1 -0
  75. package/breadcrumbs/Breadcrumbs.test.js +169 -0
  76. package/breadcrumbs/Item.d.ts +4 -0
  77. package/breadcrumbs/Item.js +52 -0
  78. package/breadcrumbs/dropdownTheme.d.ts +53 -0
  79. package/breadcrumbs/dropdownTheme.js +62 -0
  80. package/breadcrumbs/types.d.ts +16 -0
  81. package/breadcrumbs/types.js +5 -0
  82. package/bulleted-list/BulletedList.accessibility.test.d.ts +1 -0
  83. package/bulleted-list/BulletedList.accessibility.test.js +119 -0
  84. package/bulleted-list/BulletedList.d.ts +7 -0
  85. package/bulleted-list/BulletedList.js +92 -0
  86. package/bulleted-list/BulletedList.stories.tsx +115 -0
  87. package/bulleted-list/types.d.ts +38 -0
  88. package/bulleted-list/types.js +5 -0
  89. package/button/Button.accessibility.test.d.ts +1 -0
  90. package/button/Button.accessibility.test.js +127 -0
  91. package/button/Button.d.ts +4 -0
  92. package/button/Button.js +121 -0
  93. package/button/Button.stories.tsx +325 -0
  94. package/button/Button.test.d.ts +1 -0
  95. package/button/Button.test.js +38 -0
  96. package/button/types.d.ts +57 -0
  97. package/button/types.js +5 -0
  98. package/card/Card.accessibility.test.d.ts +1 -0
  99. package/card/Card.accessibility.test.js +36 -0
  100. package/card/Card.d.ts +4 -0
  101. package/card/Card.js +121 -0
  102. package/card/Card.stories.tsx +171 -0
  103. package/card/Card.test.d.ts +1 -0
  104. package/card/Card.test.js +39 -0
  105. package/card/types.d.ts +62 -0
  106. package/card/types.js +5 -0
  107. package/checkbox/Checkbox.accessibility.test.d.ts +1 -0
  108. package/checkbox/Checkbox.accessibility.test.js +87 -0
  109. package/checkbox/Checkbox.d.ts +4 -0
  110. package/checkbox/Checkbox.js +212 -0
  111. package/checkbox/Checkbox.stories.tsx +222 -0
  112. package/checkbox/Checkbox.test.d.ts +1 -0
  113. package/checkbox/Checkbox.test.js +199 -0
  114. package/checkbox/types.d.ts +72 -0
  115. package/checkbox/types.js +5 -0
  116. package/chip/Chip.accessibility.test.d.ts +1 -0
  117. package/chip/Chip.accessibility.test.js +67 -0
  118. package/chip/Chip.d.ts +4 -0
  119. package/chip/Chip.js +126 -0
  120. package/chip/Chip.stories.tsx +199 -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 +237 -0
  126. package/common/coreTokens.js +184 -0
  127. package/common/fonts.css +2 -0
  128. package/common/utils.d.ts +1 -0
  129. package/common/utils.js +16 -0
  130. package/common/variables.d.ts +1392 -0
  131. package/common/variables.js +1264 -0
  132. package/container/Container.d.ts +4 -0
  133. package/container/Container.js +194 -0
  134. package/container/Container.stories.tsx +214 -0
  135. package/container/types.d.ts +74 -0
  136. package/container/types.js +5 -0
  137. package/contextual-menu/ContextualMenu.accessibility.test.d.ts +1 -0
  138. package/contextual-menu/ContextualMenu.accessibility.test.js +98 -0
  139. package/contextual-menu/ContextualMenu.d.ts +5 -0
  140. package/contextual-menu/ContextualMenu.js +88 -0
  141. package/contextual-menu/ContextualMenu.stories.tsx +232 -0
  142. package/contextual-menu/ContextualMenu.test.d.ts +1 -0
  143. package/contextual-menu/ContextualMenu.test.js +205 -0
  144. package/contextual-menu/GroupItem.d.ts +4 -0
  145. package/contextual-menu/GroupItem.js +67 -0
  146. package/contextual-menu/ItemAction.d.ts +4 -0
  147. package/contextual-menu/ItemAction.js +51 -0
  148. package/contextual-menu/MenuItem.d.ts +4 -0
  149. package/contextual-menu/MenuItem.js +29 -0
  150. package/contextual-menu/SingleItem.d.ts +4 -0
  151. package/contextual-menu/SingleItem.js +38 -0
  152. package/contextual-menu/types.d.ts +58 -0
  153. package/contextual-menu/types.js +5 -0
  154. package/date-input/Calendar.d.ts +4 -0
  155. package/date-input/Calendar.js +214 -0
  156. package/date-input/DateInput.accessibility.test.d.ts +1 -0
  157. package/date-input/DateInput.accessibility.test.js +230 -0
  158. package/date-input/DateInput.d.ts +4 -0
  159. package/date-input/DateInput.js +222 -0
  160. package/date-input/DateInput.stories.tsx +292 -0
  161. package/date-input/DateInput.test.d.ts +1 -0
  162. package/date-input/DateInput.test.js +809 -0
  163. package/date-input/DatePicker.d.ts +4 -0
  164. package/date-input/DatePicker.js +121 -0
  165. package/date-input/YearPicker.d.ts +4 -0
  166. package/date-input/YearPicker.js +100 -0
  167. package/date-input/types.d.ts +164 -0
  168. package/date-input/types.js +5 -0
  169. package/dialog/Dialog.accessibility.test.d.ts +1 -0
  170. package/dialog/Dialog.accessibility.test.js +69 -0
  171. package/dialog/Dialog.d.ts +4 -0
  172. package/dialog/Dialog.js +93 -0
  173. package/dialog/Dialog.stories.tsx +370 -0
  174. package/dialog/Dialog.test.d.ts +1 -0
  175. package/dialog/Dialog.test.js +371 -0
  176. package/dialog/types.d.ts +36 -0
  177. package/dialog/types.js +5 -0
  178. package/divider/Divider.accessibility.test.d.ts +1 -0
  179. package/divider/Divider.accessibility.test.js +33 -0
  180. package/divider/Divider.d.ts +4 -0
  181. package/divider/Divider.js +36 -0
  182. package/divider/Divider.stories.tsx +223 -0
  183. package/divider/Divider.test.d.ts +1 -0
  184. package/divider/Divider.test.js +38 -0
  185. package/divider/types.d.ts +21 -0
  186. package/divider/types.js +5 -0
  187. package/dropdown/Dropdown.accessibility.test.d.ts +1 -0
  188. package/dropdown/Dropdown.accessibility.test.js +184 -0
  189. package/dropdown/Dropdown.d.ts +4 -0
  190. package/dropdown/Dropdown.js +320 -0
  191. package/dropdown/Dropdown.stories.tsx +427 -0
  192. package/dropdown/Dropdown.test.d.ts +1 -0
  193. package/dropdown/Dropdown.test.js +629 -0
  194. package/dropdown/DropdownMenu.d.ts +4 -0
  195. package/dropdown/DropdownMenu.js +63 -0
  196. package/dropdown/DropdownMenuItem.d.ts +4 -0
  197. package/dropdown/DropdownMenuItem.js +71 -0
  198. package/dropdown/types.d.ts +96 -0
  199. package/dropdown/types.js +5 -0
  200. package/file-input/FileInput.accessibility.test.d.ts +1 -0
  201. package/file-input/FileInput.accessibility.test.js +167 -0
  202. package/file-input/FileInput.d.ts +4 -0
  203. package/file-input/FileInput.js +440 -0
  204. package/file-input/FileInput.stories.tsx +618 -0
  205. package/file-input/FileInput.test.d.ts +1 -0
  206. package/file-input/FileInput.test.js +404 -0
  207. package/file-input/FileItem.d.ts +4 -0
  208. package/file-input/FileItem.js +125 -0
  209. package/file-input/types.d.ts +129 -0
  210. package/file-input/types.js +5 -0
  211. package/flex/Flex.d.ts +4 -0
  212. package/flex/Flex.js +57 -0
  213. package/flex/Flex.stories.tsx +112 -0
  214. package/flex/types.d.ts +97 -0
  215. package/flex/types.js +5 -0
  216. package/footer/Footer.accessibility.test.d.ts +1 -0
  217. package/footer/Footer.accessibility.test.js +125 -0
  218. package/footer/Footer.d.ts +4 -0
  219. package/footer/Footer.js +140 -0
  220. package/footer/Footer.stories.tsx +208 -0
  221. package/footer/Footer.test.d.ts +1 -0
  222. package/footer/Footer.test.js +85 -0
  223. package/footer/Icons.d.ts +3 -0
  224. package/footer/Icons.js +108 -0
  225. package/footer/types.d.ts +64 -0
  226. package/footer/types.js +5 -0
  227. package/grid/Grid.d.ts +7 -0
  228. package/grid/Grid.js +76 -0
  229. package/grid/Grid.stories.tsx +219 -0
  230. package/grid/types.d.ts +115 -0
  231. package/grid/types.js +5 -0
  232. package/header/Header.accessibility.test.d.ts +1 -0
  233. package/header/Header.accessibility.test.js +94 -0
  234. package/header/Header.d.ts +8 -0
  235. package/header/Header.js +210 -0
  236. package/header/Header.stories.tsx +267 -0
  237. package/header/Header.test.d.ts +1 -0
  238. package/header/Header.test.js +66 -0
  239. package/header/Icons.d.ts +2 -0
  240. package/header/Icons.js +24 -0
  241. package/header/types.d.ts +33 -0
  242. package/header/types.js +5 -0
  243. package/heading/Heading.accessibility.test.d.ts +1 -0
  244. package/heading/Heading.accessibility.test.js +33 -0
  245. package/heading/Heading.d.ts +4 -0
  246. package/heading/Heading.js +137 -0
  247. package/heading/Heading.stories.tsx +54 -0
  248. package/heading/Heading.test.d.ts +1 -0
  249. package/heading/Heading.test.js +156 -0
  250. package/heading/types.d.ts +33 -0
  251. package/heading/types.js +5 -0
  252. package/icon/Icon.accessibility.test.d.ts +1 -0
  253. package/icon/Icon.accessibility.test.js +30 -0
  254. package/icon/Icon.d.ts +4 -0
  255. package/icon/Icon.js +33 -0
  256. package/icon/Icon.stories.tsx +28 -0
  257. package/icon/types.d.ts +4 -0
  258. package/icon/types.js +5 -0
  259. package/image/Image.accessibility.test.d.ts +1 -0
  260. package/image/Image.accessibility.test.js +56 -0
  261. package/image/Image.d.ts +4 -0
  262. package/image/Image.js +70 -0
  263. package/image/Image.stories.tsx +129 -0
  264. package/image/types.d.ts +72 -0
  265. package/image/types.js +5 -0
  266. package/inset/Inset.d.ts +3 -0
  267. package/inset/Inset.js +43 -0
  268. package/inset/Inset.stories.tsx +230 -0
  269. package/inset/types.d.ts +37 -0
  270. package/inset/types.js +5 -0
  271. package/layout/ApplicationLayout.d.ts +20 -0
  272. package/layout/ApplicationLayout.js +137 -0
  273. package/layout/ApplicationLayout.stories.tsx +162 -0
  274. package/layout/Icons.d.ts +7 -0
  275. package/layout/Icons.js +48 -0
  276. package/layout/types.d.ts +41 -0
  277. package/layout/types.js +5 -0
  278. package/link/Link.accessibility.test.d.ts +1 -0
  279. package/link/Link.accessibility.test.js +108 -0
  280. package/link/Link.d.ts +4 -0
  281. package/link/Link.js +117 -0
  282. package/link/Link.stories.tsx +253 -0
  283. package/link/Link.test.d.ts +1 -0
  284. package/link/Link.test.js +63 -0
  285. package/link/types.d.ts +54 -0
  286. package/link/types.js +5 -0
  287. package/main.d.ts +51 -0
  288. package/main.js +365 -0
  289. package/nav-tabs/NavTabs.accessibility.test.d.ts +1 -0
  290. package/nav-tabs/NavTabs.accessibility.test.js +44 -0
  291. package/nav-tabs/NavTabs.d.ts +7 -0
  292. package/nav-tabs/NavTabs.js +108 -0
  293. package/nav-tabs/NavTabs.stories.tsx +294 -0
  294. package/nav-tabs/NavTabs.test.d.ts +1 -0
  295. package/nav-tabs/NavTabs.test.js +77 -0
  296. package/nav-tabs/NavTabsContext.d.ts +3 -0
  297. package/nav-tabs/NavTabsContext.js +8 -0
  298. package/nav-tabs/Tab.d.ts +4 -0
  299. package/nav-tabs/Tab.js +117 -0
  300. package/nav-tabs/types.d.ts +52 -0
  301. package/nav-tabs/types.js +5 -0
  302. package/number-input/NumberInput.accessibility.test.d.ts +1 -0
  303. package/number-input/NumberInput.accessibility.test.js +228 -0
  304. package/number-input/NumberInput.d.ts +4 -0
  305. package/number-input/NumberInput.js +86 -0
  306. package/number-input/NumberInput.stories.tsx +131 -0
  307. package/number-input/NumberInput.test.d.ts +1 -0
  308. package/number-input/NumberInput.test.js +989 -0
  309. package/number-input/NumberInputContext.d.ts +3 -0
  310. package/number-input/NumberInputContext.js +8 -0
  311. package/number-input/types.d.ts +136 -0
  312. package/number-input/types.js +5 -0
  313. package/package.json +67 -49
  314. package/paginator/Paginator.accessibility.test.d.ts +1 -0
  315. package/paginator/Paginator.accessibility.test.js +79 -0
  316. package/paginator/Paginator.d.ts +4 -0
  317. package/paginator/Paginator.js +138 -0
  318. package/paginator/Paginator.stories.tsx +87 -0
  319. package/paginator/Paginator.test.d.ts +1 -0
  320. package/paginator/Paginator.test.js +335 -0
  321. package/paginator/types.d.ts +38 -0
  322. package/paginator/types.js +5 -0
  323. package/paragraph/Paragraph.accessibility.test.d.ts +1 -0
  324. package/paragraph/Paragraph.accessibility.test.js +28 -0
  325. package/paragraph/Paragraph.d.ts +5 -0
  326. package/paragraph/Paragraph.js +22 -0
  327. package/paragraph/Paragraph.stories.tsx +27 -0
  328. package/password-input/PasswordInput.accessibility.test.d.ts +1 -0
  329. package/password-input/PasswordInput.accessibility.test.js +153 -0
  330. package/password-input/PasswordInput.d.ts +4 -0
  331. package/password-input/PasswordInput.js +97 -0
  332. package/password-input/PasswordInput.stories.tsx +99 -0
  333. package/password-input/PasswordInput.test.d.ts +1 -0
  334. package/password-input/PasswordInput.test.js +198 -0
  335. package/password-input/types.d.ts +111 -0
  336. package/password-input/types.js +5 -0
  337. package/progress-bar/ProgressBar.accessibility.test.d.ts +1 -0
  338. package/progress-bar/ProgressBar.accessibility.test.js +35 -0
  339. package/progress-bar/ProgressBar.d.ts +4 -0
  340. package/progress-bar/ProgressBar.js +146 -0
  341. package/progress-bar/ProgressBar.stories.tsx +93 -0
  342. package/progress-bar/ProgressBar.test.d.ts +1 -0
  343. package/progress-bar/ProgressBar.test.js +93 -0
  344. package/progress-bar/types.d.ts +37 -0
  345. package/progress-bar/types.js +5 -0
  346. package/quick-nav/QuickNav.accessibility.test.d.ts +1 -0
  347. package/quick-nav/QuickNav.accessibility.test.js +57 -0
  348. package/quick-nav/QuickNav.d.ts +4 -0
  349. package/quick-nav/QuickNav.js +94 -0
  350. package/quick-nav/QuickNav.stories.tsx +356 -0
  351. package/quick-nav/types.d.ts +21 -0
  352. package/quick-nav/types.js +5 -0
  353. package/radio-group/Radio.d.ts +4 -0
  354. package/radio-group/Radio.js +121 -0
  355. package/radio-group/RadioGroup.accessibility.test.d.ts +1 -0
  356. package/radio-group/RadioGroup.accessibility.test.js +97 -0
  357. package/radio-group/RadioGroup.d.ts +4 -0
  358. package/radio-group/RadioGroup.js +233 -0
  359. package/radio-group/RadioGroup.stories.tsx +214 -0
  360. package/radio-group/RadioGroup.test.d.ts +1 -0
  361. package/radio-group/RadioGroup.test.js +754 -0
  362. package/radio-group/types.d.ts +114 -0
  363. package/radio-group/types.js +5 -0
  364. package/resultset-table/Icons.d.ts +7 -0
  365. package/resultset-table/Icons.js +47 -0
  366. package/resultset-table/ResultsetTable.accessibility.test.d.ts +1 -0
  367. package/resultset-table/ResultsetTable.accessibility.test.js +285 -0
  368. package/resultset-table/ResultsetTable.d.ts +7 -0
  369. package/resultset-table/ResultsetTable.js +171 -0
  370. package/resultset-table/ResultsetTable.stories.tsx +413 -0
  371. package/resultset-table/ResultsetTable.test.d.ts +1 -0
  372. package/resultset-table/ResultsetTable.test.js +380 -0
  373. package/resultset-table/types.d.ts +100 -0
  374. package/resultset-table/types.js +5 -0
  375. package/select/Listbox.d.ts +4 -0
  376. package/select/Listbox.js +151 -0
  377. package/select/Option.d.ts +4 -0
  378. package/select/Option.js +89 -0
  379. package/select/Select.accessibility.test.d.ts +1 -0
  380. package/select/Select.accessibility.test.js +228 -0
  381. package/select/Select.d.ts +4 -0
  382. package/select/Select.js +600 -0
  383. package/select/Select.stories.tsx +919 -0
  384. package/select/Select.test.d.ts +1 -0
  385. package/select/Select.test.js +2268 -0
  386. package/select/types.d.ts +209 -0
  387. package/select/types.js +5 -0
  388. package/sidenav/Sidenav.accessibility.test.d.ts +1 -0
  389. package/sidenav/Sidenav.accessibility.test.js +59 -0
  390. package/sidenav/Sidenav.d.ts +10 -0
  391. package/sidenav/Sidenav.js +201 -0
  392. package/sidenav/Sidenav.stories.tsx +277 -0
  393. package/sidenav/Sidenav.test.d.ts +1 -0
  394. package/sidenav/Sidenav.test.js +37 -0
  395. package/sidenav/SidenavContext.d.ts +5 -0
  396. package/sidenav/SidenavContext.js +13 -0
  397. package/sidenav/types.d.ts +76 -0
  398. package/sidenav/types.js +5 -0
  399. package/slider/Slider.accessibility.test.d.ts +1 -0
  400. package/slider/Slider.accessibility.test.js +104 -0
  401. package/slider/Slider.d.ts +4 -0
  402. package/slider/Slider.js +283 -0
  403. package/slider/Slider.stories.tsx +180 -0
  404. package/slider/Slider.test.d.ts +1 -0
  405. package/slider/Slider.test.js +257 -0
  406. package/slider/types.d.ts +86 -0
  407. package/slider/types.js +5 -0
  408. package/spinner/Spinner.accessibility.test.d.ts +1 -0
  409. package/spinner/Spinner.accessibility.test.js +96 -0
  410. package/spinner/Spinner.d.ts +4 -0
  411. package/spinner/Spinner.js +210 -0
  412. package/spinner/Spinner.stories.tsx +129 -0
  413. package/spinner/Spinner.test.d.ts +1 -0
  414. package/spinner/Spinner.test.js +55 -0
  415. package/spinner/types.d.ts +32 -0
  416. package/spinner/types.js +5 -0
  417. package/status-light/StatusLight.accessibility.test.d.ts +1 -0
  418. package/status-light/StatusLight.accessibility.test.js +157 -0
  419. package/status-light/StatusLight.d.ts +4 -0
  420. package/status-light/StatusLight.js +51 -0
  421. package/status-light/StatusLight.stories.tsx +74 -0
  422. package/status-light/StatusLight.test.d.ts +1 -0
  423. package/status-light/StatusLight.test.js +25 -0
  424. package/status-light/types.d.ts +17 -0
  425. package/status-light/types.js +5 -0
  426. package/switch/Switch.accessibility.test.d.ts +1 -0
  427. package/switch/Switch.accessibility.test.js +98 -0
  428. package/switch/Switch.d.ts +4 -0
  429. package/switch/Switch.js +211 -0
  430. package/switch/Switch.stories.tsx +149 -0
  431. package/switch/Switch.test.d.ts +1 -0
  432. package/switch/Switch.test.js +180 -0
  433. package/switch/types.d.ts +66 -0
  434. package/switch/types.js +5 -0
  435. package/table/DropdownTheme.js +62 -0
  436. package/table/Table.accessibility.test.d.ts +1 -0
  437. package/table/Table.accessibility.test.js +93 -0
  438. package/table/Table.d.ts +8 -0
  439. package/table/Table.js +161 -0
  440. package/table/Table.stories.tsx +663 -0
  441. package/table/Table.test.d.ts +1 -0
  442. package/table/Table.test.js +112 -0
  443. package/table/types.d.ts +49 -0
  444. package/table/types.js +5 -0
  445. package/tabs/Tab.d.ts +4 -0
  446. package/tabs/Tab.js +117 -0
  447. package/tabs/Tabs.accessibility.test.d.ts +1 -0
  448. package/tabs/Tabs.accessibility.test.js +56 -0
  449. package/tabs/Tabs.d.ts +4 -0
  450. package/tabs/Tabs.js +373 -0
  451. package/tabs/Tabs.stories.tsx +230 -0
  452. package/tabs/Tabs.test.d.ts +1 -0
  453. package/tabs/Tabs.test.js +276 -0
  454. package/tabs/types.d.ts +92 -0
  455. package/tabs/types.js +5 -0
  456. package/tag/Tag.accessibility.test.d.ts +1 -0
  457. package/tag/Tag.accessibility.test.js +69 -0
  458. package/tag/Tag.d.ts +4 -0
  459. package/tag/Tag.js +151 -0
  460. package/tag/Tag.stories.tsx +152 -0
  461. package/tag/Tag.test.d.ts +1 -0
  462. package/tag/Tag.test.js +41 -0
  463. package/tag/types.d.ts +69 -0
  464. package/tag/types.js +5 -0
  465. package/text-input/Suggestion.d.ts +4 -0
  466. package/text-input/Suggestion.js +67 -0
  467. package/text-input/Suggestions.d.ts +4 -0
  468. package/text-input/Suggestions.js +94 -0
  469. package/text-input/TextInput.accessibility.test.d.ts +1 -0
  470. package/text-input/TextInput.accessibility.test.js +321 -0
  471. package/text-input/TextInput.d.ts +4 -0
  472. package/text-input/TextInput.js +569 -0
  473. package/text-input/TextInput.stories.tsx +474 -0
  474. package/text-input/TextInput.test.d.ts +1 -0
  475. package/text-input/TextInput.test.js +1756 -0
  476. package/text-input/types.d.ts +205 -0
  477. package/text-input/types.js +5 -0
  478. package/textarea/Textarea.accessibility.test.d.ts +1 -0
  479. package/textarea/Textarea.accessibility.test.js +155 -0
  480. package/textarea/Textarea.d.ts +4 -0
  481. package/textarea/Textarea.js +235 -0
  482. package/textarea/Textarea.stories.tsx +174 -0
  483. package/textarea/Textarea.test.d.ts +1 -0
  484. package/textarea/Textarea.test.js +406 -0
  485. package/textarea/types.d.ts +141 -0
  486. package/textarea/types.js +5 -0
  487. package/toggle-group/ToggleGroup.accessibility.test.d.ts +1 -0
  488. package/toggle-group/ToggleGroup.accessibility.test.js +107 -0
  489. package/toggle-group/ToggleGroup.d.ts +4 -0
  490. package/toggle-group/ToggleGroup.js +199 -0
  491. package/toggle-group/ToggleGroup.stories.tsx +218 -0
  492. package/toggle-group/ToggleGroup.test.d.ts +1 -0
  493. package/toggle-group/ToggleGroup.test.js +137 -0
  494. package/toggle-group/types.d.ts +114 -0
  495. package/toggle-group/types.js +5 -0
  496. package/typography/Typography.accessibility.test.d.ts +1 -0
  497. package/typography/Typography.accessibility.test.js +339 -0
  498. package/typography/Typography.d.ts +4 -0
  499. package/typography/Typography.js +23 -0
  500. package/typography/Typography.stories.tsx +198 -0
  501. package/typography/types.d.ts +18 -0
  502. package/typography/types.js +5 -0
  503. package/useTheme.d.ts +1145 -0
  504. package/useTheme.js +15 -0
  505. package/useTranslatedLabels.d.ts +85 -0
  506. package/useTranslatedLabels.js +14 -0
  507. package/utils/BaseTypography.d.ts +21 -0
  508. package/utils/BaseTypography.js +94 -0
  509. package/utils/FocusLock.d.ts +13 -0
  510. package/utils/FocusLock.js +124 -0
  511. package/wizard/Wizard.accessibility.test.d.ts +1 -0
  512. package/wizard/Wizard.accessibility.test.js +55 -0
  513. package/wizard/Wizard.d.ts +4 -0
  514. package/wizard/Wizard.js +239 -0
  515. package/wizard/Wizard.stories.tsx +272 -0
  516. package/wizard/Wizard.test.d.ts +1 -0
  517. package/wizard/Wizard.test.js +114 -0
  518. package/wizard/types.d.ts +64 -0
  519. package/wizard/types.js +5 -0
  520. package/babel.config.js +0 -4
  521. package/dist/ThemeContext.js +0 -15
  522. package/dist/accordion/Accordion.js +0 -248
  523. package/dist/accordion/Accordion.stories.js +0 -207
  524. package/dist/accordion/readme.md +0 -96
  525. package/dist/alert/Alert.js +0 -304
  526. package/dist/alert/Alert.stories.js +0 -158
  527. package/dist/alert/close.svg +0 -4
  528. package/dist/alert/error.svg +0 -4
  529. package/dist/alert/info.svg +0 -4
  530. package/dist/alert/readme.md +0 -43
  531. package/dist/alert/success.svg +0 -4
  532. package/dist/alert/warning.svg +0 -4
  533. package/dist/box/Box.js +0 -148
  534. package/dist/button/Button.js +0 -181
  535. package/dist/button/Button.stories.js +0 -224
  536. package/dist/button/readme.md +0 -93
  537. package/dist/card/Card.js +0 -217
  538. package/dist/checkbox/Checkbox.js +0 -240
  539. package/dist/checkbox/Checkbox.stories.js +0 -144
  540. package/dist/checkbox/readme.md +0 -116
  541. package/dist/chip/Chip.js +0 -173
  542. package/dist/common/OpenSans.css +0 -81
  543. package/dist/common/RequiredComponent.js +0 -46
  544. package/dist/common/fonts/OpenSans-Bold.ttf +0 -0
  545. package/dist/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  546. package/dist/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  547. package/dist/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  548. package/dist/common/fonts/OpenSans-Italic.ttf +0 -0
  549. package/dist/common/fonts/OpenSans-Light.ttf +0 -0
  550. package/dist/common/fonts/OpenSans-LightItalic.ttf +0 -0
  551. package/dist/common/fonts/OpenSans-Regular.ttf +0 -0
  552. package/dist/common/fonts/OpenSans-SemiBold.ttf +0 -0
  553. package/dist/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  554. package/dist/common/services/example-service.js +0 -10
  555. package/dist/common/services/example-service.test.js +0 -12
  556. package/dist/common/utils.js +0 -42
  557. package/dist/common/variables.js +0 -400
  558. package/dist/date/Date.js +0 -357
  559. package/dist/date/Date.stories.js +0 -205
  560. package/dist/date/calendar.svg +0 -1
  561. package/dist/date/calendar_dark.svg +0 -1
  562. package/dist/date/readme.md +0 -73
  563. package/dist/dialog/Dialog.js +0 -197
  564. package/dist/dialog/Dialog.stories.js +0 -217
  565. package/dist/dialog/readme.md +0 -32
  566. package/dist/dropdown/Dropdown.js +0 -416
  567. package/dist/dropdown/Dropdown.stories.js +0 -249
  568. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  569. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  570. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  571. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  572. package/dist/dropdown/readme.md +0 -69
  573. package/dist/footer/Footer.js +0 -346
  574. package/dist/footer/Footer.stories.js +0 -94
  575. package/dist/footer/dxc_logo_wht.png +0 -0
  576. package/dist/footer/readme.md +0 -41
  577. package/dist/header/Header.js +0 -360
  578. package/dist/header/Header.stories.js +0 -176
  579. package/dist/header/close_icon.svg +0 -1
  580. package/dist/header/dxc_logo_black.png +0 -0
  581. package/dist/header/dxc_logo_white.png +0 -0
  582. package/dist/header/hamb_menu_black.svg +0 -1
  583. package/dist/header/hamb_menu_white.svg +0 -1
  584. package/dist/header/readme.md +0 -33
  585. package/dist/heading/Heading.js +0 -153
  586. package/dist/input-text/InputText.js +0 -519
  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/link/Link.js +0 -136
  591. package/dist/link/readme.md +0 -51
  592. package/dist/main.js +0 -263
  593. package/dist/paginator/Paginator.js +0 -196
  594. package/dist/paginator/images/next.svg +0 -3
  595. package/dist/paginator/images/nextPage.svg +0 -3
  596. package/dist/paginator/images/previous.svg +0 -3
  597. package/dist/paginator/images/previousPage.svg +0 -3
  598. package/dist/paginator/readme.md +0 -50
  599. package/dist/progress-bar/ProgressBar.js +0 -185
  600. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  601. package/dist/progress-bar/readme.md +0 -63
  602. package/dist/radio/Radio.js +0 -195
  603. package/dist/radio/Radio.stories.js +0 -166
  604. package/dist/radio/readme.md +0 -70
  605. package/dist/resultsetTable/ResultsetTable.js +0 -333
  606. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  607. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  608. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  609. package/dist/select/Select.js +0 -451
  610. package/dist/select/Select.stories.js +0 -235
  611. package/dist/select/readme.md +0 -72
  612. package/dist/sidenav/Sidenav.js +0 -222
  613. package/dist/sidenav/arrow_icon.svg +0 -3
  614. package/dist/slider/Slider.js +0 -258
  615. package/dist/slider/Slider.stories.js +0 -241
  616. package/dist/slider/readme.md +0 -64
  617. package/dist/spinner/Spinner.js +0 -193
  618. package/dist/spinner/Spinner.stories.js +0 -183
  619. package/dist/spinner/readme.md +0 -65
  620. package/dist/switch/Switch.js +0 -199
  621. package/dist/switch/Switch.stories.js +0 -134
  622. package/dist/switch/readme.md +0 -133
  623. package/dist/table/Table.js +0 -93
  624. package/dist/tabs/Tabs.js +0 -172
  625. package/dist/tabs/Tabs.stories.js +0 -130
  626. package/dist/tabs/readme.md +0 -78
  627. package/dist/tabs-for-sections/TabsForSections.js +0 -107
  628. package/dist/tabs-for-sections/readme.md +0 -78
  629. package/dist/tag/Tag.js +0 -217
  630. package/dist/textarea/Textarea.js +0 -227
  631. package/dist/toggle/Toggle.js +0 -223
  632. package/dist/toggle/Toggle.stories.js +0 -297
  633. package/dist/toggle/readme.md +0 -80
  634. package/dist/upload/Upload.js +0 -200
  635. package/dist/upload/Upload.stories.js +0 -72
  636. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -122
  637. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  638. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  639. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -279
  640. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  641. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  642. package/dist/upload/file-upload/FileToUpload.js +0 -158
  643. package/dist/upload/file-upload/audio-icon.svg +0 -4
  644. package/dist/upload/file-upload/close.svg +0 -4
  645. package/dist/upload/file-upload/file-icon.svg +0 -4
  646. package/dist/upload/file-upload/video-icon.svg +0 -4
  647. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  648. package/dist/upload/readme.md +0 -37
  649. package/dist/upload/transaction/Transaction.js +0 -155
  650. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  651. package/dist/upload/transaction/audio-icon.svg +0 -4
  652. package/dist/upload/transaction/error-icon.svg +0 -4
  653. package/dist/upload/transaction/file-icon-err.svg +0 -4
  654. package/dist/upload/transaction/file-icon.svg +0 -4
  655. package/dist/upload/transaction/image-icon-err.svg +0 -4
  656. package/dist/upload/transaction/image-icon.svg +0 -4
  657. package/dist/upload/transaction/success-icon.svg +0 -4
  658. package/dist/upload/transaction/video-icon-err.svg +0 -4
  659. package/dist/upload/transaction/video-icon.svg +0 -4
  660. package/dist/upload/transactions/Transactions.js +0 -120
  661. package/dist/wizard/Wizard.js +0 -327
  662. package/dist/wizard/invalid_icon.svg +0 -6
  663. package/dist/wizard/valid_icon.svg +0 -6
  664. package/dist/wizard/validation-wrong.svg +0 -6
  665. package/test/Accordion.test.js +0 -33
  666. package/test/Alert.test.js +0 -53
  667. package/test/Box.test.js +0 -10
  668. package/test/Button.test.js +0 -18
  669. package/test/Card.test.js +0 -30
  670. package/test/Checkbox.test.js +0 -45
  671. package/test/Chip.test.js +0 -25
  672. package/test/Date.test.js +0 -393
  673. package/test/Dialog.test.js +0 -23
  674. package/test/Dropdown.test.js +0 -130
  675. package/test/Footer.test.js +0 -99
  676. package/test/Header.test.js +0 -39
  677. package/test/Heading.test.js +0 -35
  678. package/test/InputText.test.js +0 -236
  679. package/test/Link.test.js +0 -25
  680. package/test/Paginator.test.js +0 -165
  681. package/test/ProgressBar.test.js +0 -35
  682. package/test/Radio.test.js +0 -37
  683. package/test/ResultsetTable.test.js +0 -282
  684. package/test/Select.test.js +0 -191
  685. package/test/Sidenav.test.js +0 -87
  686. package/test/Slider.test.js +0 -65
  687. package/test/Spinner.test.js +0 -27
  688. package/test/Switch.test.js +0 -45
  689. package/test/Table.test.js +0 -36
  690. package/test/Tabs.test.js +0 -88
  691. package/test/TabsForSections.test.js +0 -34
  692. package/test/Tag.test.js +0 -32
  693. package/test/TextArea.test.js +0 -52
  694. package/test/Toggle.test.js +0 -43
  695. package/test/Upload.test.js +0 -60
  696. package/test/Wizard.test.js +0 -130
  697. package/test/mocks/pngMock.js +0 -1
  698. package/test/mocks/svgMock.js +0 -1
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
- });
@@ -1,99 +0,0 @@
1
- import React from "react";
2
- import { render } from "@testing-library/react";
3
- import DxcFooter from "../src/footer/Footer";
4
- import icon from "../../app/src/images/linkedin.svg";
5
-
6
- describe("Footer component tests", () => {
7
- test("Footer renders with default logo", () => {
8
- const { getByRole } = render(<DxcFooter></DxcFooter>);
9
- expect(getByRole("img")).toBeTruthy();
10
- });
11
-
12
- test("Footer renders with logo", () => {
13
- const { getByRole } = render(<DxcFooter logoSrc={icon}></DxcFooter>);
14
- expect(getByRole("img")).toBeTruthy();
15
- });
16
-
17
- test("Footer renders with social links", () => {
18
- const social = [
19
- {
20
- href: "https://www.test.com/test",
21
- logoSrc: icon,
22
- },
23
- ];
24
- const { getByRole } = render(<DxcFooter socialLinks={social}></DxcFooter>);
25
- const socialIcon = getByRole("link");
26
- expect(socialIcon.getAttribute("href")).toBe("https://www.test.com/test");
27
- });
28
-
29
- test("Footer renders with bottom links", () => {
30
- const bottom = [
31
- {
32
- href: "https://www.test.com/test",
33
- text: "bottom-link-text",
34
- },
35
- ];
36
- const { getByText } = render(<DxcFooter bottomLinks={bottom}></DxcFooter>);
37
- const link = getByText("bottom-link-text");
38
- expect(link.getAttribute("href")).toBe("https://www.test.com/test");
39
- });
40
-
41
- test("Footer renders with copyright text", () => {
42
- const { getByText } = render(<DxcFooter copyright="test-copyright"></DxcFooter>);
43
- expect(getByText("test-copyright")).toBeTruthy();
44
- });
45
-
46
- test("Footer renders with correct children", () => {
47
- //We need to force the offsetWidth value
48
- Object.defineProperty(HTMLElement.prototype, "offsetWidth", { configurable: true, value: 1024 });
49
-
50
- const { getByText } = render(
51
- <DxcFooter>
52
- <p>footer-child-text</p>
53
- </DxcFooter>
54
- );
55
-
56
- expect(getByText("footer-child-text")).toBeTruthy();
57
- });
58
-
59
- test("Footer renders without children in mobile", () => {
60
- //425 is mobile width
61
- Object.defineProperty(HTMLElement.prototype, "offsetWidth", { configurable: true, value: 425 });
62
-
63
- const { queryByText } = render(
64
- <DxcFooter>
65
- <p>footer-child-text</p>
66
- </DxcFooter>
67
- );
68
-
69
- expect(queryByText("footer-child-text")).toBeFalsy();
70
- });
71
-
72
- test("Footer is fully rendered", () => {
73
- Object.defineProperty(HTMLElement.prototype, "offsetWidth", { configurable: true, value: 1024 });
74
-
75
- const social = [
76
- {
77
- href: "https://www.test.com/social",
78
- logoSrc: icon,
79
- },
80
- ];
81
- const bottom = [
82
- {
83
- href: "https://www.test.com/bottom",
84
- text: "bottom-link-text",
85
- },
86
- ];
87
- const { getAllByRole, getByText } = render(
88
- <DxcFooter socialLinks={social} bottomLinks={bottom} copyright="test-copyright">
89
- <p>footer-child-text</p>
90
- </DxcFooter>
91
- );
92
- const socialIcon = getAllByRole("link")[0];
93
- expect(socialIcon.getAttribute("href")).toBe("https://www.test.com/social");
94
- const bottomLink = getByText("bottom-link-text");
95
- expect(bottomLink.getAttribute("href")).toBe("https://www.test.com/bottom");
96
- expect(getByText("test-copyright")).toBeTruthy();
97
- expect(getByText("footer-child-text")).toBeTruthy();
98
- });
99
- });