@dxc-technology/halstack-react 0.0.0-f4bae62 → 0.0.0-f4dcdd7

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 (679) hide show
  1. package/BackgroundColorContext.d.ts +1 -0
  2. package/BackgroundColorContext.js +30 -0
  3. package/HalstackContext.d.ts +1244 -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 +69 -0
  118. package/chip/Chip.d.ts +4 -0
  119. package/chip/Chip.js +115 -0
  120. package/chip/Chip.stories.tsx +231 -0
  121. package/chip/Chip.test.d.ts +1 -0
  122. package/chip/Chip.test.js +41 -0
  123. package/chip/types.d.ts +68 -0
  124. package/chip/types.js +5 -0
  125. package/common/coreTokens.d.ts +237 -0
  126. package/common/coreTokens.js +184 -0
  127. package/common/fonts.css +2 -0
  128. package/common/utils.d.ts +1 -0
  129. package/{dist/common → common}/utils.js +6 -12
  130. package/common/variables.d.ts +1390 -0
  131. package/common/variables.js +1262 -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/{dist/header → header}/Icons.js +8 -43
  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/{dist/heading → heading}/Heading.js +34 -115
  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/{dist/main.js → main.js} +142 -144
  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 +66 -56
  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 +232 -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 +1143 -0
  504. package/{dist/useTheme.js → useTheme.js} +4 -11
  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 -8
  521. package/dist/BackgroundColorContext.js +0 -46
  522. package/dist/ThemeContext.js +0 -248
  523. package/dist/V3Textarea/V3Textarea.js +0 -264
  524. package/dist/accordion/Accordion.js +0 -353
  525. package/dist/accordion-group/AccordionGroup.js +0 -186
  526. package/dist/alert/Alert.js +0 -403
  527. package/dist/alert/index.d.ts +0 -51
  528. package/dist/badge/Badge.js +0 -63
  529. package/dist/box/Box.js +0 -156
  530. package/dist/button/Button.js +0 -238
  531. package/dist/card/Card.js +0 -254
  532. package/dist/checkbox/Checkbox.js +0 -300
  533. package/dist/checkbox/Checkbox.stories.js +0 -144
  534. package/dist/checkbox/readme.md +0 -116
  535. package/dist/chip/Chip.js +0 -265
  536. package/dist/common/OpenSans.css +0 -81
  537. package/dist/common/RequiredComponent.js +0 -40
  538. package/dist/common/fonts/OpenSans-Bold.ttf +0 -0
  539. package/dist/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  540. package/dist/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  541. package/dist/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  542. package/dist/common/fonts/OpenSans-Italic.ttf +0 -0
  543. package/dist/common/fonts/OpenSans-Light.ttf +0 -0
  544. package/dist/common/fonts/OpenSans-LightItalic.ttf +0 -0
  545. package/dist/common/fonts/OpenSans-Regular.ttf +0 -0
  546. package/dist/common/fonts/OpenSans-SemiBold.ttf +0 -0
  547. package/dist/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  548. package/dist/common/variables.js +0 -1569
  549. package/dist/date/Date.js +0 -379
  550. package/dist/date/Date.stories.js +0 -205
  551. package/dist/date/readme.md +0 -73
  552. package/dist/date-input/DateInput.js +0 -400
  553. package/dist/date-input/index.d.ts +0 -95
  554. package/dist/dialog/Dialog.js +0 -218
  555. package/dist/dropdown/Dropdown.js +0 -544
  556. package/dist/file-input/FileInput.js +0 -644
  557. package/dist/file-input/FileItem.js +0 -280
  558. package/dist/file-input/index.d.ts +0 -81
  559. package/dist/footer/Footer.js +0 -421
  560. package/dist/footer/Icons.js +0 -77
  561. package/dist/header/Header.js +0 -434
  562. package/dist/input-text/Icons.js +0 -22
  563. package/dist/input-text/InputText.js +0 -705
  564. package/dist/layout/ApplicationLayout.js +0 -327
  565. package/dist/layout/Icons.js +0 -55
  566. package/dist/link/Link.js +0 -237
  567. package/dist/link/readme.md +0 -51
  568. package/dist/main.d.ts +0 -8
  569. package/dist/new-select/NewSelect.js +0 -836
  570. package/dist/new-select/index.d.ts +0 -53
  571. package/dist/number-input/NumberInput.js +0 -136
  572. package/dist/number-input/NumberInputContext.js +0 -16
  573. package/dist/number-input/index.d.ts +0 -113
  574. package/dist/paginator/Icons.js +0 -66
  575. package/dist/paginator/Paginator.js +0 -283
  576. package/dist/password-input/PasswordInput.js +0 -198
  577. package/dist/password-input/index.d.ts +0 -94
  578. package/dist/progress-bar/ProgressBar.js +0 -242
  579. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  580. package/dist/progress-bar/readme.md +0 -63
  581. package/dist/radio/Radio.js +0 -209
  582. package/dist/radio/Radio.stories.js +0 -166
  583. package/dist/radio/readme.md +0 -70
  584. package/dist/resultsetTable/ResultsetTable.js +0 -358
  585. package/dist/select/Select.js +0 -549
  586. package/dist/sidenav/Sidenav.js +0 -179
  587. package/dist/slider/Slider.js +0 -404
  588. package/dist/slider/readme.md +0 -64
  589. package/dist/spinner/Spinner.js +0 -381
  590. package/dist/spinner/Spinner.stories.js +0 -183
  591. package/dist/spinner/readme.md +0 -65
  592. package/dist/switch/Switch.js +0 -222
  593. package/dist/switch/Switch.stories.js +0 -134
  594. package/dist/switch/readme.md +0 -133
  595. package/dist/table/Table.js +0 -132
  596. package/dist/tabs/Tabs.js +0 -343
  597. package/dist/tabs/Tabs.stories.js +0 -130
  598. package/dist/tabs/readme.md +0 -78
  599. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  600. package/dist/tabs-for-sections/readme.md +0 -78
  601. package/dist/tag/Tag.js +0 -282
  602. package/dist/text-input/TextInput.js +0 -971
  603. package/dist/text-input/index.d.ts +0 -135
  604. package/dist/textarea/Textarea.js +0 -369
  605. package/dist/textarea/index.d.ts +0 -117
  606. package/dist/toggle/Toggle.js +0 -220
  607. package/dist/toggle/Toggle.stories.js +0 -297
  608. package/dist/toggle/readme.md +0 -80
  609. package/dist/toggle-group/ToggleGroup.js +0 -327
  610. package/dist/upload/Upload.js +0 -205
  611. package/dist/upload/Upload.stories.js +0 -72
  612. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -139
  613. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  614. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  615. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  616. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  617. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  618. package/dist/upload/file-upload/FileToUpload.js +0 -184
  619. package/dist/upload/file-upload/audio-icon.svg +0 -4
  620. package/dist/upload/file-upload/close.svg +0 -4
  621. package/dist/upload/file-upload/file-icon.svg +0 -4
  622. package/dist/upload/file-upload/video-icon.svg +0 -4
  623. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  624. package/dist/upload/readme.md +0 -37
  625. package/dist/upload/transaction/Transaction.js +0 -175
  626. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  627. package/dist/upload/transaction/audio-icon.svg +0 -4
  628. package/dist/upload/transaction/error-icon.svg +0 -4
  629. package/dist/upload/transaction/file-icon-err.svg +0 -4
  630. package/dist/upload/transaction/file-icon.svg +0 -4
  631. package/dist/upload/transaction/image-icon-err.svg +0 -4
  632. package/dist/upload/transaction/image-icon.svg +0 -4
  633. package/dist/upload/transaction/success-icon.svg +0 -4
  634. package/dist/upload/transaction/video-icon-err.svg +0 -4
  635. package/dist/upload/transaction/video-icon.svg +0 -4
  636. package/dist/upload/transactions/Transactions.js +0 -138
  637. package/dist/wizard/Icons.js +0 -65
  638. package/dist/wizard/Wizard.js +0 -405
  639. package/test/Accordion.test.js +0 -33
  640. package/test/AccordionGroup.test.js +0 -125
  641. package/test/Alert.test.js +0 -53
  642. package/test/Box.test.js +0 -10
  643. package/test/Button.test.js +0 -18
  644. package/test/Card.test.js +0 -30
  645. package/test/Checkbox.test.js +0 -45
  646. package/test/Chip.test.js +0 -25
  647. package/test/Date.test.js +0 -397
  648. package/test/DateInput.test.js +0 -242
  649. package/test/Dialog.test.js +0 -23
  650. package/test/Dropdown.test.js +0 -145
  651. package/test/FileInput.test.js +0 -201
  652. package/test/Footer.test.js +0 -94
  653. package/test/Header.test.js +0 -34
  654. package/test/Heading.test.js +0 -35
  655. package/test/InputText.test.js +0 -248
  656. package/test/Link.test.js +0 -43
  657. package/test/NumberInput.test.js +0 -259
  658. package/test/Paginator.test.js +0 -177
  659. package/test/PasswordInput.test.js +0 -83
  660. package/test/ProgressBar.test.js +0 -35
  661. package/test/Radio.test.js +0 -37
  662. package/test/ResultsetTable.test.js +0 -329
  663. package/test/Select.test.js +0 -212
  664. package/test/Sidenav.test.js +0 -45
  665. package/test/Slider.test.js +0 -74
  666. package/test/Spinner.test.js +0 -32
  667. package/test/Switch.test.js +0 -45
  668. package/test/Table.test.js +0 -36
  669. package/test/Tabs.test.js +0 -109
  670. package/test/TabsForSections.test.js +0 -34
  671. package/test/Tag.test.js +0 -32
  672. package/test/TextInput.test.js +0 -732
  673. package/test/Textarea.test.js +0 -193
  674. package/test/ToggleGroup.test.js +0 -85
  675. package/test/Upload.test.js +0 -60
  676. package/test/V3TextArea.test.js +0 -51
  677. package/test/Wizard.test.js +0 -130
  678. package/test/mocks/pngMock.js +0 -1
  679. package/test/mocks/svgMock.js +0 -1
@@ -1,242 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import userEvent from "@testing-library/user-event";
4
-
5
- import DxcDateInput from "../src/date-input/DateInput";
6
-
7
- describe("DateInput component tests", () => {
8
- test("Renders with correct label, helper text, optional, placeholder and clearable action", () => {
9
- const { getByText, getByRole, getAllByRole } = render(
10
- <DxcDateInput label="Example label" helperText="Example of helper text" placeholder optional clearable />
11
- );
12
- const input = getByRole("textbox");
13
- expect(getByText("Example label")).toBeTruthy();
14
- expect(getByText("Example of helper text")).toBeTruthy();
15
- expect(getByText("(Optional)")).toBeTruthy();
16
- expect(input.getAttribute("placeholder")).toBe("DD-MM-YYYY");
17
- userEvent.type(input, "10/10/2010");
18
- const closeAction = getAllByRole("button")[0];
19
- userEvent.click(closeAction);
20
- expect(input.value).toBe("");
21
- });
22
-
23
- test("Renders with personalized error", () => {
24
- const { getByText } = render(<DxcDateInput error="Personalized error." />);
25
- expect(getByText("Personalized error.")).toBeTruthy();
26
- });
27
-
28
- test("Renders with correct format: user typed date but it's invalid, onBlur error", () => {
29
- const onBlur = jest.fn(({ value, error }) => {
30
- expect(value).toBe("10/90/2010");
31
- expect(error).toBe("Invalid date.");
32
- });
33
- const { getByRole } = render(<DxcDateInput label="With format MM/dd/yyyy" format="MM/dd/yyyy" onBlur={onBlur} />);
34
- const input = getByRole("textbox");
35
-
36
- userEvent.type(input, "10/90/2010");
37
- fireEvent.blur(input);
38
- });
39
-
40
- test("Renders with correct format: user typed date but it's invalid, onChange error", () => {
41
- const onChange = jest.fn();
42
- const { getByRole } = render(
43
- <DxcDateInput label="With format MM/dd/yyyy" format="MM/dd/yyyy" onChange={onChange} />
44
- );
45
- const input = getByRole("textbox");
46
-
47
- userEvent.type(input, "10/90/2010");
48
- expect(onChange).toHaveBeenCalledTimes(10);
49
- expect(onChange).toHaveBeenCalledWith({ value: "10/90/2010", error: "Invalid date.", date: null });
50
- });
51
-
52
- test("Calendar renders with correct date: today's date", () => {
53
- const { getByText, getByRole } = render(<DxcDateInput />);
54
- const calendarAction = getByRole("button");
55
- const d = new Date();
56
- const options = { weekday: "short", month: "short", day: "numeric" };
57
-
58
- userEvent.click(calendarAction);
59
- expect(getByText(d.toLocaleString("en-US", options))).toBeTruthy();
60
- });
61
-
62
- test("Calendar renders with correct date: value prop", () => {
63
- const { getByText, getByRole } = render(<DxcDateInput value="20-10-2019" />);
64
- const calendarAction = getByRole("button");
65
- const d = new Date(2019, 9, 20);
66
- const options = { weekday: "short", month: "short", day: "numeric" };
67
-
68
- userEvent.click(calendarAction);
69
- expect(getByText(d.toLocaleString("en-US", options))).toBeTruthy();
70
- });
71
-
72
- test("Calendar renders with correct date: user typed value", () => {
73
- const { getByText, getByRole } = render(<DxcDateInput />);
74
- const calendarAction = getByRole("button");
75
- const d = new Date(2010, 0, 1);
76
- const options = { weekday: "short", month: "short", day: "numeric" };
77
- const input = getByRole("textbox");
78
-
79
- userEvent.type(input, "01-01-2010");
80
- userEvent.click(calendarAction);
81
- expect(getByText(d.toLocaleString("en-US", options))).toBeTruthy();
82
- });
83
-
84
- test("Calendar renders with correct date: invalid date, renders with today's date", () => {
85
- const onBlur = jest.fn();
86
- const { getByText, getByRole } = render(<DxcDateInput onBlur={onBlur} />);
87
- const calendarAction = getByRole("button");
88
- const d = new Date();
89
- const options = { weekday: "short", month: "short", day: "numeric" };
90
- const input = getByRole("textbox");
91
-
92
- userEvent.type(input, "01-01-xxxx");
93
- fireEvent.blur(input);
94
- expect(onBlur).toHaveBeenCalled();
95
- expect(onBlur).toHaveBeenCalledWith({ value: "01-01-xxxx", error: "Invalid date.", date: null });
96
- userEvent.click(calendarAction);
97
- expect(getByText(d.toLocaleString("en-US", options))).toBeTruthy();
98
- });
99
-
100
- test("Selecting a date from the calendar with an specific format", () => {
101
- const { getByText, getByRole } = render(<DxcDateInput label="With format M-dd-yyyy" format="M-dd-yyyy" />);
102
- const input = getByRole("textbox");
103
- const calendarAction = getByRole("button");
104
- userEvent.click(calendarAction);
105
- const dayButton = getByText("10").closest("button");
106
- fireEvent.click(dayButton);
107
- const d = new Date();
108
- d.setDate(10);
109
- const options = { weekday: "short", month: "short", day: "numeric" };
110
- expect(getByText(d.toLocaleString("en-US", options))).toBeTruthy();
111
- fireEvent.keyDown(document, { key: "Esc", code: "Esc", keyCode: 27, charCode: 27 });
112
- expect(input.value).toBe(`${d.getMonth() + 1}-10-${d.getFullYear()}`);
113
- });
114
-
115
- test("Selecting a date from the calendar (using keyboard presses)", () => {
116
- const { getByRole } = render(<DxcDateInput />);
117
- const calendarAction = getByRole("button");
118
- const input = getByRole("textbox");
119
-
120
- userEvent.type(input, "01-01-2010");
121
- userEvent.click(calendarAction);
122
- fireEvent.keyDown(document, { key: "ArrowRight", code: "ArrowRight", keyCode: 39, charCode: 39 });
123
- fireEvent.keyDown(document, { key: "ArrowRight", code: "ArrowRight", keyCode: 39, charCode: 39 });
124
- fireEvent.keyDown(document, { key: "ArrowRight", code: "ArrowRight", keyCode: 39, charCode: 39 });
125
- fireEvent.keyDown(document, { key: "ArrowLeft", code: "ArrowLeft", keyCode: 37, charCode: 37 });
126
- fireEvent.keyDown(document, { key: "Esc", code: "Esc", keyCode: 27, charCode: 27 });
127
- expect(input.value).toBe("03-01-2010");
128
- });
129
-
130
- test("onChange & onBlur functions are called correctly", () => {
131
- const onBlur = jest.fn();
132
- const onChange = jest.fn();
133
- const { getByRole } = render(<DxcDateInput onChange={onChange} onBlur={onBlur} />);
134
- const input = getByRole("textbox");
135
- const d = new Date(2011, 9, 10);
136
-
137
- userEvent.type(input, "10-10-2011");
138
- expect(input.value).toBe("10-10-2011");
139
- expect(onChange).toHaveBeenCalledTimes(10);
140
- expect(onChange).toHaveBeenCalledWith({ value: "10-10-2011", error: null, date: d });
141
- fireEvent.blur(input);
142
- expect(onBlur).toHaveBeenCalled();
143
- expect(onBlur).toHaveBeenCalledWith({ value: "10-10-2011", error: null, date: d });
144
- });
145
-
146
- test("onChange & onBlur functions are called correctly, also with errors", () => {
147
- const onBlur = jest.fn();
148
- const onChange = jest.fn();
149
- const { getByRole } = render(<DxcDateInput onChange={onChange} onBlur={onBlur} />);
150
- const input = getByRole("textbox");
151
-
152
- userEvent.type(input, "10-10-");
153
- expect(input.value).toBe("10-10-");
154
- expect(onChange).toHaveBeenCalledTimes(6);
155
- expect(onChange).toHaveBeenCalledWith({ value: "10-10-", error: "Invalid date.", date: null });
156
- fireEvent.blur(input);
157
- expect(onBlur).toHaveBeenCalled();
158
- expect(onBlur).toHaveBeenCalledWith({ value: "10-10-", error: "Invalid date.", date: null });
159
- });
160
-
161
- test("onBlur function removes the error when it is fixed", () => {
162
- const onBlur = jest.fn();
163
- const { getByRole } = render(<DxcDateInput onBlur={onBlur} />);
164
- const input = getByRole("textbox");
165
- const d = new Date(2002, 1, 20);
166
-
167
- userEvent.type(input, "test");
168
- expect(input.value).toBe("test");
169
- fireEvent.blur(input);
170
- expect(onBlur).toHaveBeenCalled();
171
- expect(onBlur).toHaveBeenCalledWith({ value: "test", error: "Invalid date.", date: null });
172
- userEvent.clear(input);
173
- userEvent.type(input, "20-02-2002");
174
- expect(input.value).toBe("20-02-2002");
175
- fireEvent.blur(input);
176
- expect(onBlur).toHaveBeenCalled();
177
- expect(onBlur).toHaveBeenCalledWith({ value: "20-02-2002", error: null, date: d });
178
- });
179
-
180
- test("onBlur function removes the error when the input is empty", () => {
181
- const onBlur = jest.fn();
182
- const { getByRole } = render(<DxcDateInput onBlur={onBlur} optional />);
183
- const input = getByRole("textbox");
184
-
185
- userEvent.type(input, "test");
186
- expect(input.value).toBe("test");
187
- fireEvent.blur(input);
188
- expect(onBlur).toHaveBeenCalled();
189
- expect(onBlur).toHaveBeenCalledWith({ value: "test", error: "Invalid date.", date: null });
190
- userEvent.clear(input);
191
- fireEvent.blur(input);
192
- expect(onBlur).toHaveBeenCalled();
193
- expect(onBlur).toHaveBeenCalledWith({ value: "", error: null, date: null });
194
- });
195
-
196
- test("onBlur & onChange functions error: required field (not optional)", () => {
197
- const onBlur = jest.fn();
198
- const onChange = jest.fn();
199
- const { getByRole } = render(<DxcDateInput onBlur={onBlur} onChange={onChange} />);
200
- const date = getByRole("textbox");
201
-
202
- userEvent.type(date, "t");
203
- expect(date.value).toBe("t");
204
- userEvent.clear(date);
205
- fireEvent.blur(date);
206
- expect(onBlur).toHaveBeenCalled();
207
- expect(onBlur).toHaveBeenCalledWith({
208
- value: "",
209
- error: "This field is required. Please, enter a value.",
210
- date: null,
211
- });
212
- expect(onChange).toHaveBeenCalled();
213
- expect(onChange).toHaveBeenCalledWith({
214
- value: "",
215
- error: "This field is required. Please, enter a value.",
216
- date: null,
217
- });
218
- });
219
-
220
- test("Disabled date input (calendar action must be shown but not clickable)", () => {
221
- const { getByRole, queryByText } = render(<DxcDateInput disabled />);
222
- const calendarAction = getByRole("button");
223
- const d = new Date();
224
- const options = { weekday: "short", month: "short", day: "numeric" };
225
-
226
- expect(getByRole("textbox").disabled).toBeTruthy();
227
- userEvent.click(calendarAction);
228
- expect(queryByText(d.toLocaleString("en-US", options))).toBeFalsy();
229
- });
230
-
231
- test("Input has correct accesibility attributes", () => {
232
- const { getByRole } = render(<DxcDateInput label="Date input label" />);
233
- const input = getByRole("textbox");
234
- expect(input.getAttribute("aria-autocomplete")).toBeNull();
235
- expect(input.getAttribute("aria-controls")).toBeNull();
236
- expect(input.getAttribute("aria-expanded")).toBeNull();
237
- const calendarAction = getByRole("button");
238
- userEvent.click(calendarAction);
239
- const datePicker = getByRole("dialog");
240
- expect(datePicker.getAttribute("aria-modal")).toBe("true");
241
- });
242
- });
@@ -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,145 +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
- test("Disabled dropdown is not clickable", () => {
51
- const options = [
52
- {
53
- value: 1,
54
- label: "option-test",
55
- },
56
- ];
57
- const { queryByText } = render(<DxcDropdown options={options} disabled label="dropdown-test"></DxcDropdown>);
58
- const dropdown = queryByText("dropdown-test");
59
- expect(queryByText("option-test")).toBeFalsy();
60
- act(() => {
61
- fireEvent.click(dropdown);
62
- });
63
- expect(queryByText("option-test")).toBeFalsy();
64
- });
65
-
66
- test("Dropdown renders with correct icon before option", () => {
67
- const options = [
68
- {
69
- value: 1,
70
- label: "option-test",
71
- iconSrc: "/testIcon",
72
- },
73
- ];
74
- const { getByText, getByRole } = render(<DxcDropdown options={options} label="dropdown-test"></DxcDropdown>);
75
- const dropdown = getByText("dropdown-test");
76
- act(() => {
77
- fireEvent.click(dropdown);
78
- });
79
- expect(getByRole("img").getAttribute("src")).toEqual("/testIcon");
80
- });
81
-
82
- test("Dropdown renders with correct icon after option", () => {
83
- const options = [
84
- {
85
- value: 1,
86
- label: "option-test",
87
- iconSrc: "/testIcon",
88
- },
89
- ];
90
- const { getByText, getByRole } = render(
91
- <DxcDropdown options={options} optionsIconPosition="after" label="dropdown-test"></DxcDropdown>
92
- );
93
- const dropdown = getByText("dropdown-test");
94
- act(() => {
95
- fireEvent.click(dropdown);
96
- });
97
- expect(getByRole("img").getAttribute("src")).toEqual("/testIcon");
98
- });
99
-
100
- test("Dropdown renders with caret hidden", () => {
101
- const { queryByRole } = render(<DxcDropdown caretHidden={true} label="dropdown-test"></DxcDropdown>);
102
- expect(queryByRole("img")).toBeFalsy();
103
- });
104
-
105
- test("onSelectOption fuction is called correctly", () => {
106
- const onSelectOption = jest.fn((i) => i);
107
- const options = [
108
- {
109
- value: 1,
110
- label: "option-test",
111
- },
112
- ];
113
- const { getByText } = render(
114
- <DxcDropdown options={options} onSelectOption={onSelectOption} label="dropdown-test"></DxcDropdown>
115
- );
116
- const dropdown = getByText("dropdown-test");
117
- act(() => {
118
- fireEvent.click(dropdown);
119
- });
120
- const option = getByText("option-test");
121
- act(() => {
122
- fireEvent.click(option);
123
- });
124
- expect(onSelectOption).toHaveBeenCalledWith(1);
125
- });
126
-
127
- test("expandOnHover shows and hides the option correctly", () => {
128
- const options = [
129
- {
130
- value: 1,
131
- label: "option-test",
132
- },
133
- ];
134
- const { queryByText } = render(
135
- <DxcDropdown options={options} expandOnHover={true} label="dropdown-test"></DxcDropdown>
136
- );
137
- const dropdown = queryByText("dropdown-test");
138
- //Verify that is not showed before
139
- expect(queryByText("option-test")).toBeFalsy();
140
- act(() => {
141
- fireEvent.mouseOver(dropdown);
142
- });
143
- expect(queryByText("option-test")).toBeTruthy();
144
- });
145
- });
@@ -1,201 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent, waitFor } from "@testing-library/react";
3
- import userEvent from "@testing-library/user-event";
4
-
5
- import DxcFileInput from "../src/file-input/FileInput";
6
-
7
- describe("FileInput component tests", () => {
8
- const file1 = new File(["file1"], "file1.png", { type: "image/png" });
9
- const file2 = new File(["file2"], "file2.txt", {
10
- type: "text/plain",
11
- });
12
-
13
- const files = [
14
- {
15
- error: null,
16
- preview: null,
17
- file: file1,
18
- },
19
- {
20
- error: "Error message",
21
- preview: null,
22
- file: file2,
23
- },
24
- ];
25
-
26
- test("Renders with correct labels and helper text in file mode", () => {
27
- const { getByText } = render(<DxcFileInput label="File input label" helperText="File input helper text" />);
28
- expect(getByText("File input label")).toBeTruthy();
29
- expect(getByText("File input helper text")).toBeTruthy();
30
- });
31
- test("Renders with correct button label in file mode", () => {
32
- const { getByText } = render(<DxcFileInput label="File input label" helperText="File input helper text" />);
33
- expect(getByText("Select files")).toBeTruthy();
34
- });
35
- test("Renders with correct labels in filedrop mode", () => {
36
- const { getByText } = render(
37
- <DxcFileInput label="File input label" helperText="File input helper text" mode="filedrop" />
38
- );
39
- expect(getByText("Select")).toBeTruthy();
40
- expect(getByText("or drop files")).toBeTruthy();
41
- });
42
- test("Renders with correct labels in dropzone mode", () => {
43
- const { getByText } = render(
44
- <DxcFileInput label="File input label" helperText="File input helper text" mode="dropzone" />
45
- );
46
- expect(getByText("Select")).toBeTruthy();
47
- expect(getByText("or drop files")).toBeTruthy();
48
- });
49
- test("Disabled file input", () => {
50
- const { getByText, getByRole } = render(
51
- <DxcFileInput label="File input label" helperText="File input helper text" disabled />
52
- );
53
- expect(getByText("Select files")).toBeTruthy();
54
- const button = getByRole("button");
55
- expect(button.disabled).toBeTruthy();
56
- });
57
- test("Renders file items passed in value when multiple file input", () => {
58
- const callbackFile = jest.fn();
59
- const { getByText } = render(
60
- <DxcFileInput
61
- label="File input label"
62
- helperText="File input helper text"
63
- value={files}
64
- callbackFile={callbackFile}
65
- />
66
- );
67
- expect(getByText("file1.png")).toBeTruthy();
68
- expect(getByText("file2.txt")).toBeTruthy();
69
- expect(getByText("Error message")).toBeTruthy();
70
- });
71
- test("Renders file items when single file input", () => {
72
- const callbackFile = jest.fn();
73
- const { getByText } = render(
74
- <DxcFileInput
75
- label="File input label"
76
- helperText="File input helper text"
77
- multiple={false}
78
- value={files}
79
- callbackFile={callbackFile}
80
- />
81
- );
82
- expect(getByText("file1.png")).toBeTruthy();
83
- expect(getByText("file2.txt")).toBeTruthy();
84
- expect(getByText("Error message")).toBeTruthy();
85
- });
86
- test("Add file item when single file input", async () => {
87
- const newFile = new File(["newFile"], "newFile.pdf", { type: "pdf" });
88
- const callbackFile = jest.fn();
89
- const { getByText, getByLabelText } = render(
90
- <DxcFileInput
91
- label="File input label"
92
- helperText="File input helper text"
93
- value={files}
94
- callbackFile={callbackFile}
95
- multiple={false}
96
- />
97
- );
98
- expect(getByText("file1.png")).toBeTruthy();
99
- expect(getByText("file2.txt")).toBeTruthy();
100
- expect(getByText("Error message")).toBeTruthy();
101
- const inputFile = getByLabelText("File input label", { hidden: true });
102
- fireEvent.change(inputFile, { target: { files: [newFile] } });
103
- await waitFor(() => {
104
- expect(callbackFile).toHaveBeenCalledWith([
105
- {
106
- error: undefined,
107
- file: newFile,
108
- preview: (
109
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor">
110
- <path fill="none" d="M0 0h24v24H0V0z" />
111
- <path d="M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zM6 20V4h7v5h5v11H6z" />
112
- </svg>
113
- ),
114
- },
115
- ]);
116
- });
117
- });
118
- test("Renders file items and delete one file", async () => {
119
- const callbackFile = jest.fn();
120
- const { getByText, getAllByRole } = render(
121
- <DxcFileInput
122
- label="File input label"
123
- helperText="File input helper text"
124
- value={files}
125
- callbackFile={callbackFile}
126
- />
127
- );
128
- expect(getByText("file1.png")).toBeTruthy();
129
- expect(getByText("file2.txt")).toBeTruthy();
130
- expect(getByText("Error message")).toBeTruthy();
131
- const removeBtn = getAllByRole("button")[1];
132
- userEvent.click(removeBtn);
133
- await waitFor(() => {
134
- expect(callbackFile).toHaveBeenCalledWith([{ error: "Error message", file: file2, preview: null }]);
135
- });
136
- });
137
-
138
- test("CallbackFile is correctly called", async () => {
139
- const newFile = new File(["newFile"], "newFile.pdf", { type: "pdf" });
140
- const callbackFile = jest.fn();
141
- const { getByLabelText } = render(
142
- <DxcFileInput
143
- label="File input label"
144
- helperText="File input helper text"
145
- value={files}
146
- callbackFile={callbackFile}
147
- />
148
- );
149
- const inputFile = getByLabelText("File input label", { hidden: true });
150
- fireEvent.change(inputFile, { target: { files: [newFile] } });
151
- await waitFor(() => {
152
- expect(callbackFile).toHaveBeenCalledWith([
153
- { error: null, preview: null, file: file1 },
154
- { error: "Error message", preview: null, file: file2 },
155
- {
156
- error: undefined,
157
- file: newFile,
158
- preview: (
159
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor">
160
- <path fill="none" d="M0 0h24v24H0V0z" />
161
- <path d="M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zM6 20V4h7v5h5v11H6z" />
162
- </svg>
163
- ),
164
- },
165
- ]);
166
- });
167
- });
168
-
169
- test("Callback called correctly when a file size does not comply minSize or maxSize", async () => {
170
- const newFile = new File(["newFile"], "newFile.pdf", { type: "pdf" });
171
- const callbackFile = jest.fn();
172
- const { getByLabelText } = render(
173
- <DxcFileInput
174
- label="File input label"
175
- helperText="File input helper text"
176
- minSize={1000}
177
- maxSize={20000}
178
- value={files}
179
- callbackFile={callbackFile}
180
- />
181
- );
182
- const inputFile = getByLabelText("File input label", { hidden: true });
183
- fireEvent.change(inputFile, { target: { files: [newFile] } });
184
- await waitFor(() => {
185
- expect(callbackFile).toHaveBeenCalledWith([
186
- { error: null, preview: null, file: file1 },
187
- { error: "Error message", preview: null, file: file2 },
188
- {
189
- error: "File size must be greater than min size.",
190
- file: newFile,
191
- preview: (
192
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor">
193
- <path fill="none" d="M0 0h24v24H0V0z" />
194
- <path d="M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zM6 20V4h7v5h5v11H6z" />
195
- </svg>
196
- ),
197
- },
198
- ]);
199
- });
200
- });
201
- });