@dxc-technology/halstack-react 0.0.0-4bc8a44 → 0.0.0-4c0fd86

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 (460) hide show
  1. package/BackgroundColorContext.d.ts +1 -10
  2. package/BackgroundColorContext.js +4 -21
  3. package/HalstackContext.d.ts +77 -144
  4. package/HalstackContext.js +41 -56
  5. package/README.md +47 -0
  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 +1 -1
  9. package/accordion/Accordion.js +35 -101
  10. package/accordion/Accordion.stories.tsx +8 -162
  11. package/accordion/Accordion.test.d.ts +1 -0
  12. package/accordion/Accordion.test.js +19 -34
  13. package/accordion/types.d.ts +6 -18
  14. package/accordion-group/AccordionGroup.accessibility.test.d.ts +1 -0
  15. package/accordion-group/AccordionGroup.accessibility.test.js +82 -0
  16. package/accordion-group/AccordionGroup.d.ts +2 -2
  17. package/accordion-group/AccordionGroup.js +27 -75
  18. package/accordion-group/AccordionGroup.stories.tsx +78 -77
  19. package/accordion-group/AccordionGroup.test.d.ts +1 -0
  20. package/accordion-group/AccordionGroup.test.js +42 -74
  21. package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
  22. package/accordion-group/AccordionGroupAccordion.js +31 -0
  23. package/accordion-group/AccordionGroupContext.d.ts +3 -0
  24. package/accordion-group/AccordionGroupContext.js +8 -0
  25. package/accordion-group/types.d.ts +7 -19
  26. package/action-icon/ActionIcon.accessibility.test.d.ts +1 -0
  27. package/action-icon/ActionIcon.accessibility.test.js +63 -0
  28. package/action-icon/ActionIcon.d.ts +4 -0
  29. package/action-icon/ActionIcon.js +48 -0
  30. package/action-icon/ActionIcon.stories.tsx +41 -0
  31. package/action-icon/ActionIcon.test.d.ts +1 -0
  32. package/action-icon/ActionIcon.test.js +64 -0
  33. package/action-icon/types.d.ts +26 -0
  34. package/alert/Alert.accessibility.test.d.ts +1 -0
  35. package/alert/Alert.accessibility.test.js +95 -0
  36. package/alert/Alert.js +34 -120
  37. package/alert/Alert.test.d.ts +1 -0
  38. package/alert/Alert.test.js +29 -46
  39. package/alert/types.d.ts +5 -5
  40. package/badge/Badge.accessibility.test.d.ts +1 -0
  41. package/badge/Badge.accessibility.test.js +129 -0
  42. package/badge/Badge.d.ts +1 -1
  43. package/badge/Badge.js +142 -42
  44. package/badge/Badge.stories.tsx +210 -0
  45. package/badge/Badge.test.d.ts +1 -0
  46. package/badge/Badge.test.js +30 -0
  47. package/badge/types.d.ts +52 -3
  48. package/bleed/Bleed.js +13 -21
  49. package/bleed/types.d.ts +2 -2
  50. package/box/Box.accessibility.test.d.ts +1 -0
  51. package/box/Box.accessibility.test.js +33 -0
  52. package/box/Box.d.ts +1 -1
  53. package/box/Box.js +16 -55
  54. package/box/Box.stories.tsx +25 -53
  55. package/box/Box.test.d.ts +1 -0
  56. package/box/Box.test.js +2 -7
  57. package/box/types.d.ts +3 -15
  58. package/breadcrumbs/Breadcrumbs.accessibility.test.d.ts +1 -0
  59. package/breadcrumbs/Breadcrumbs.accessibility.test.js +96 -0
  60. package/breadcrumbs/Breadcrumbs.d.ts +4 -0
  61. package/breadcrumbs/Breadcrumbs.js +79 -0
  62. package/breadcrumbs/Breadcrumbs.stories.tsx +194 -0
  63. package/breadcrumbs/Breadcrumbs.test.d.ts +1 -0
  64. package/breadcrumbs/Breadcrumbs.test.js +168 -0
  65. package/breadcrumbs/Item.d.ts +4 -0
  66. package/breadcrumbs/Item.js +52 -0
  67. package/breadcrumbs/dropdownTheme.d.ts +53 -0
  68. package/breadcrumbs/dropdownTheme.js +62 -0
  69. package/breadcrumbs/types.d.ts +40 -0
  70. package/bulleted-list/BulletedList.accessibility.test.d.ts +1 -0
  71. package/bulleted-list/BulletedList.accessibility.test.js +119 -0
  72. package/bulleted-list/BulletedList.js +22 -55
  73. package/bulleted-list/BulletedList.stories.tsx +2 -93
  74. package/bulleted-list/types.d.ts +5 -5
  75. package/button/Button.accessibility.test.d.ts +1 -0
  76. package/button/Button.accessibility.test.js +127 -0
  77. package/button/Button.d.ts +1 -1
  78. package/button/Button.js +68 -100
  79. package/button/Button.stories.tsx +35 -135
  80. package/button/Button.test.d.ts +1 -0
  81. package/button/Button.test.js +20 -17
  82. package/button/types.d.ts +9 -5
  83. package/card/Card.accessibility.test.d.ts +1 -0
  84. package/card/Card.accessibility.test.js +36 -0
  85. package/card/Card.d.ts +1 -1
  86. package/card/Card.js +40 -79
  87. package/card/Card.stories.tsx +1 -30
  88. package/card/Card.test.d.ts +1 -0
  89. package/card/Card.test.js +11 -22
  90. package/card/types.d.ts +6 -12
  91. package/checkbox/Checkbox.accessibility.test.d.ts +1 -0
  92. package/checkbox/Checkbox.accessibility.test.js +87 -0
  93. package/checkbox/Checkbox.js +88 -126
  94. package/checkbox/Checkbox.stories.tsx +16 -54
  95. package/checkbox/Checkbox.test.d.ts +1 -0
  96. package/checkbox/Checkbox.test.js +108 -64
  97. package/checkbox/types.d.ts +8 -4
  98. package/chip/Chip.accessibility.test.d.ts +1 -0
  99. package/chip/Chip.accessibility.test.js +67 -0
  100. package/chip/Chip.js +22 -36
  101. package/chip/Chip.stories.tsx +6 -25
  102. package/chip/Chip.test.d.ts +1 -0
  103. package/chip/Chip.test.js +18 -31
  104. package/chip/types.d.ts +4 -4
  105. package/common/coreTokens.d.ts +105 -15
  106. package/common/coreTokens.js +41 -25
  107. package/common/utils.js +2 -8
  108. package/common/variables.d.ts +83 -144
  109. package/common/variables.js +153 -227
  110. package/container/Container.d.ts +4 -0
  111. package/container/Container.js +194 -0
  112. package/container/Container.stories.tsx +214 -0
  113. package/container/types.d.ts +176 -0
  114. package/container/types.js +5 -0
  115. package/contextual-menu/ContextualMenu.accessibility.test.d.ts +1 -0
  116. package/contextual-menu/ContextualMenu.accessibility.test.js +98 -0
  117. package/contextual-menu/ContextualMenu.d.ts +5 -0
  118. package/contextual-menu/ContextualMenu.js +136 -0
  119. package/contextual-menu/ContextualMenu.stories.tsx +231 -0
  120. package/contextual-menu/ContextualMenu.test.d.ts +1 -0
  121. package/contextual-menu/ContextualMenu.test.js +247 -0
  122. package/contextual-menu/GroupItem.d.ts +4 -0
  123. package/contextual-menu/GroupItem.js +67 -0
  124. package/contextual-menu/ItemAction.d.ts +4 -0
  125. package/contextual-menu/ItemAction.js +88 -0
  126. package/contextual-menu/MenuItem.d.ts +4 -0
  127. package/contextual-menu/MenuItem.js +29 -0
  128. package/contextual-menu/SingleItem.d.ts +4 -0
  129. package/contextual-menu/SingleItem.js +38 -0
  130. package/contextual-menu/types.d.ts +65 -0
  131. package/contextual-menu/types.js +5 -0
  132. package/date-input/Calendar.js +59 -87
  133. package/date-input/DateInput.accessibility.test.d.ts +1 -0
  134. package/date-input/DateInput.accessibility.test.js +229 -0
  135. package/date-input/DateInput.js +70 -111
  136. package/date-input/DateInput.stories.tsx +22 -35
  137. package/date-input/DateInput.test.d.ts +1 -0
  138. package/date-input/DateInput.test.js +675 -702
  139. package/date-input/DatePicker.js +23 -48
  140. package/date-input/YearPicker.js +17 -38
  141. package/date-input/types.d.ts +28 -22
  142. package/dialog/Dialog.accessibility.test.d.ts +1 -0
  143. package/dialog/Dialog.accessibility.test.js +69 -0
  144. package/dialog/Dialog.d.ts +1 -1
  145. package/dialog/Dialog.js +23 -79
  146. package/dialog/Dialog.stories.tsx +219 -169
  147. package/dialog/Dialog.test.d.ts +1 -0
  148. package/dialog/Dialog.test.js +216 -215
  149. package/dialog/types.d.ts +18 -26
  150. package/divider/Divider.accessibility.test.d.ts +1 -0
  151. package/divider/Divider.accessibility.test.js +33 -0
  152. package/divider/Divider.d.ts +4 -0
  153. package/divider/Divider.js +36 -0
  154. package/divider/Divider.stories.tsx +224 -0
  155. package/divider/Divider.test.d.ts +1 -0
  156. package/divider/Divider.test.js +38 -0
  157. package/divider/types.d.ts +21 -0
  158. package/divider/types.js +5 -0
  159. package/dropdown/Dropdown.accessibility.test.d.ts +1 -0
  160. package/dropdown/Dropdown.accessibility.test.js +183 -0
  161. package/dropdown/Dropdown.js +67 -135
  162. package/dropdown/Dropdown.stories.tsx +16 -27
  163. package/dropdown/Dropdown.test.d.ts +1 -0
  164. package/dropdown/Dropdown.test.js +434 -392
  165. package/dropdown/DropdownMenu.js +12 -23
  166. package/dropdown/DropdownMenuItem.js +13 -21
  167. package/dropdown/types.d.ts +20 -24
  168. package/file-input/FileInput.accessibility.test.d.ts +1 -0
  169. package/file-input/FileInput.accessibility.test.js +167 -0
  170. package/file-input/FileInput.js +177 -286
  171. package/file-input/FileInput.stories.tsx +1 -1
  172. package/file-input/FileInput.test.d.ts +1 -0
  173. package/file-input/FileInput.test.js +303 -356
  174. package/file-input/FileItem.js +30 -67
  175. package/file-input/types.d.ts +9 -13
  176. package/flex/Flex.js +25 -39
  177. package/flex/types.d.ts +6 -6
  178. package/footer/Footer.accessibility.test.d.ts +1 -0
  179. package/footer/Footer.accessibility.test.js +125 -0
  180. package/footer/Footer.d.ts +1 -1
  181. package/footer/Footer.js +72 -115
  182. package/footer/Footer.stories.tsx +77 -97
  183. package/footer/Footer.test.d.ts +1 -0
  184. package/footer/Footer.test.js +22 -34
  185. package/footer/Icons.d.ts +3 -2
  186. package/footer/Icons.js +53 -22
  187. package/footer/types.d.ts +26 -28
  188. package/grid/Grid.d.ts +1 -1
  189. package/grid/Grid.js +2 -17
  190. package/grid/Grid.stories.tsx +41 -39
  191. package/grid/types.d.ts +10 -10
  192. package/header/Header.accessibility.test.d.ts +1 -0
  193. package/header/Header.accessibility.test.js +94 -0
  194. package/header/Header.d.ts +2 -2
  195. package/header/Header.js +41 -134
  196. package/header/Header.stories.tsx +24 -72
  197. package/header/Header.test.d.ts +1 -0
  198. package/header/Header.test.js +13 -26
  199. package/header/Icons.d.ts +2 -2
  200. package/header/Icons.js +3 -13
  201. package/header/types.d.ts +7 -22
  202. package/heading/Heading.accessibility.test.d.ts +1 -0
  203. package/heading/Heading.accessibility.test.js +33 -0
  204. package/heading/Heading.js +9 -31
  205. package/heading/Heading.test.d.ts +1 -0
  206. package/heading/Heading.test.js +65 -95
  207. package/heading/types.d.ts +7 -7
  208. package/icon/Icon.accessibility.test.d.ts +1 -0
  209. package/icon/Icon.accessibility.test.js +30 -0
  210. package/icon/Icon.d.ts +4 -0
  211. package/icon/Icon.js +33 -0
  212. package/icon/Icon.stories.tsx +28 -0
  213. package/icon/types.d.ts +4 -0
  214. package/icon/types.js +5 -0
  215. package/image/Image.accessibility.test.d.ts +1 -0
  216. package/image/Image.accessibility.test.js +56 -0
  217. package/image/Image.d.ts +4 -0
  218. package/image/Image.js +70 -0
  219. package/image/Image.stories.tsx +129 -0
  220. package/image/types.d.ts +72 -0
  221. package/image/types.js +5 -0
  222. package/inset/Inset.js +13 -21
  223. package/inset/types.d.ts +2 -2
  224. package/layout/ApplicationLayout.d.ts +3 -3
  225. package/layout/ApplicationLayout.js +35 -69
  226. package/layout/ApplicationLayout.stories.tsx +1 -1
  227. package/layout/Icons.d.ts +7 -5
  228. package/layout/Icons.js +41 -59
  229. package/layout/types.d.ts +3 -3
  230. package/link/Link.accessibility.test.d.ts +1 -0
  231. package/link/Link.accessibility.test.js +108 -0
  232. package/link/Link.js +28 -47
  233. package/link/Link.stories.tsx +4 -4
  234. package/link/Link.test.d.ts +1 -0
  235. package/link/Link.test.js +24 -42
  236. package/link/types.d.ts +14 -14
  237. package/main.d.ts +9 -4
  238. package/main.js +46 -59
  239. package/nav-tabs/NavTabs.accessibility.test.d.ts +1 -0
  240. package/nav-tabs/NavTabs.accessibility.test.js +44 -0
  241. package/nav-tabs/NavTabs.d.ts +2 -3
  242. package/nav-tabs/NavTabs.js +39 -56
  243. package/nav-tabs/NavTabs.stories.tsx +57 -23
  244. package/nav-tabs/NavTabs.test.d.ts +1 -0
  245. package/nav-tabs/NavTabs.test.js +46 -51
  246. package/nav-tabs/NavTabsContext.d.ts +3 -0
  247. package/nav-tabs/NavTabsContext.js +8 -0
  248. package/nav-tabs/Tab.js +53 -86
  249. package/nav-tabs/types.d.ts +15 -16
  250. package/number-input/NumberInput.accessibility.test.d.ts +1 -0
  251. package/number-input/NumberInput.accessibility.test.js +227 -0
  252. package/number-input/NumberInput.js +50 -37
  253. package/number-input/NumberInput.stories.tsx +37 -26
  254. package/number-input/NumberInput.test.d.ts +1 -0
  255. package/number-input/NumberInput.test.js +859 -413
  256. package/number-input/NumberInputContext.d.ts +3 -4
  257. package/number-input/NumberInputContext.js +3 -14
  258. package/number-input/types.d.ts +17 -5
  259. package/package.json +48 -41
  260. package/paginator/Paginator.accessibility.test.d.ts +1 -0
  261. package/paginator/Paginator.accessibility.test.js +78 -0
  262. package/paginator/Paginator.js +28 -53
  263. package/paginator/Paginator.test.d.ts +1 -0
  264. package/paginator/Paginator.test.js +231 -202
  265. package/paginator/types.d.ts +3 -3
  266. package/paragraph/Paragraph.accessibility.test.d.ts +1 -0
  267. package/paragraph/Paragraph.accessibility.test.js +28 -0
  268. package/paragraph/Paragraph.js +3 -19
  269. package/paragraph/Paragraph.stories.tsx +0 -17
  270. package/password-input/PasswordInput.accessibility.test.d.ts +1 -0
  271. package/password-input/PasswordInput.accessibility.test.js +152 -0
  272. package/password-input/PasswordInput.js +62 -128
  273. package/password-input/PasswordInput.stories.tsx +11 -34
  274. package/password-input/PasswordInput.test.d.ts +1 -0
  275. package/password-input/PasswordInput.test.js +157 -141
  276. package/password-input/types.d.ts +8 -7
  277. package/progress-bar/ProgressBar.accessibility.test.d.ts +1 -0
  278. package/progress-bar/ProgressBar.accessibility.test.js +35 -0
  279. package/progress-bar/ProgressBar.js +26 -56
  280. package/progress-bar/{ProgressBar.stories.jsx → ProgressBar.stories.tsx} +1 -1
  281. package/progress-bar/ProgressBar.test.d.ts +1 -0
  282. package/progress-bar/ProgressBar.test.js +36 -53
  283. package/progress-bar/types.d.ts +3 -3
  284. package/quick-nav/QuickNav.accessibility.test.d.ts +1 -0
  285. package/quick-nav/QuickNav.accessibility.test.js +57 -0
  286. package/quick-nav/QuickNav.js +4 -27
  287. package/quick-nav/QuickNav.stories.tsx +1 -1
  288. package/quick-nav/types.d.ts +10 -10
  289. package/radio-group/Radio.d.ts +1 -1
  290. package/radio-group/Radio.js +31 -66
  291. package/radio-group/RadioGroup.accessibility.test.d.ts +1 -0
  292. package/radio-group/RadioGroup.accessibility.test.js +97 -0
  293. package/radio-group/RadioGroup.js +48 -98
  294. package/radio-group/RadioGroup.stories.tsx +10 -10
  295. package/radio-group/RadioGroup.test.d.ts +1 -0
  296. package/radio-group/RadioGroup.test.js +505 -473
  297. package/radio-group/types.d.ts +8 -8
  298. package/resultset-table/Icons.d.ts +7 -0
  299. package/{resultsetTable → resultset-table}/Icons.js +1 -5
  300. package/resultset-table/ResultsetTable.accessibility.test.d.ts +1 -0
  301. package/resultset-table/ResultsetTable.accessibility.test.js +284 -0
  302. package/resultset-table/ResultsetTable.d.ts +7 -0
  303. package/{resultsetTable → resultset-table}/ResultsetTable.js +74 -74
  304. package/{resultsetTable → resultset-table}/ResultsetTable.stories.tsx +119 -6
  305. package/resultset-table/ResultsetTable.test.d.ts +1 -0
  306. package/resultset-table/ResultsetTable.test.js +450 -0
  307. package/{resultsetTable → resultset-table}/types.d.ts +44 -11
  308. package/resultset-table/types.js +5 -0
  309. package/select/Listbox.js +36 -54
  310. package/select/Option.js +28 -36
  311. package/select/Select.accessibility.test.d.ts +1 -0
  312. package/select/Select.accessibility.test.js +227 -0
  313. package/select/Select.js +114 -178
  314. package/select/Select.stories.tsx +70 -113
  315. package/select/Select.test.d.ts +1 -0
  316. package/select/Select.test.js +1900 -1861
  317. package/select/types.d.ts +15 -16
  318. package/sidenav/Sidenav.accessibility.test.d.ts +1 -0
  319. package/sidenav/Sidenav.accessibility.test.js +59 -0
  320. package/sidenav/Sidenav.js +44 -81
  321. package/sidenav/Sidenav.stories.tsx +5 -10
  322. package/sidenav/Sidenav.test.d.ts +1 -0
  323. package/sidenav/Sidenav.test.js +4 -11
  324. package/{layout → sidenav}/SidenavContext.d.ts +1 -1
  325. package/{layout → sidenav}/SidenavContext.js +3 -9
  326. package/sidenav/types.d.ts +20 -20
  327. package/slider/Slider.accessibility.test.d.ts +1 -0
  328. package/slider/Slider.accessibility.test.js +103 -0
  329. package/slider/Slider.js +66 -125
  330. package/slider/Slider.stories.tsx +0 -60
  331. package/slider/Slider.test.d.ts +1 -0
  332. package/slider/Slider.test.js +118 -112
  333. package/slider/types.d.ts +4 -4
  334. package/spinner/Spinner.accessibility.test.d.ts +1 -0
  335. package/spinner/Spinner.accessibility.test.js +96 -0
  336. package/spinner/Spinner.js +21 -55
  337. package/spinner/Spinner.test.d.ts +1 -0
  338. package/spinner/Spinner.test.js +26 -35
  339. package/spinner/types.d.ts +3 -3
  340. package/status-light/StatusLight.accessibility.test.d.ts +1 -0
  341. package/status-light/StatusLight.accessibility.test.js +157 -0
  342. package/status-light/StatusLight.d.ts +4 -0
  343. package/status-light/StatusLight.js +51 -0
  344. package/status-light/StatusLight.stories.tsx +74 -0
  345. package/status-light/StatusLight.test.d.ts +1 -0
  346. package/status-light/StatusLight.test.js +25 -0
  347. package/status-light/types.d.ts +17 -0
  348. package/status-light/types.js +5 -0
  349. package/switch/Switch.accessibility.test.d.ts +1 -0
  350. package/switch/Switch.accessibility.test.js +98 -0
  351. package/switch/Switch.js +49 -100
  352. package/switch/Switch.stories.tsx +12 -34
  353. package/switch/Switch.test.d.ts +1 -0
  354. package/switch/Switch.test.js +52 -97
  355. package/switch/types.d.ts +4 -4
  356. package/table/DropdownTheme.js +62 -0
  357. package/table/Table.accessibility.test.d.ts +1 -0
  358. package/table/Table.accessibility.test.js +92 -0
  359. package/table/Table.d.ts +6 -2
  360. package/table/Table.js +76 -33
  361. package/table/{Table.stories.jsx → Table.stories.tsx} +309 -2
  362. package/table/Table.test.d.ts +1 -0
  363. package/table/Table.test.js +92 -7
  364. package/table/types.d.ts +34 -6
  365. package/tabs/Tab.js +22 -37
  366. package/tabs/Tabs.accessibility.test.d.ts +1 -0
  367. package/tabs/Tabs.accessibility.test.js +56 -0
  368. package/tabs/Tabs.js +59 -147
  369. package/tabs/Tabs.stories.tsx +8 -4
  370. package/tabs/Tabs.test.d.ts +1 -0
  371. package/tabs/Tabs.test.js +58 -132
  372. package/tabs/types.d.ts +21 -21
  373. package/tag/Tag.accessibility.test.d.ts +1 -0
  374. package/tag/Tag.accessibility.test.js +69 -0
  375. package/tag/Tag.js +27 -57
  376. package/tag/Tag.stories.tsx +5 -8
  377. package/tag/Tag.test.d.ts +1 -0
  378. package/tag/Tag.test.js +18 -37
  379. package/tag/types.d.ts +9 -9
  380. package/text-input/Suggestion.js +9 -26
  381. package/text-input/Suggestions.d.ts +1 -1
  382. package/text-input/Suggestions.js +30 -70
  383. package/text-input/TextInput.accessibility.test.d.ts +1 -0
  384. package/text-input/TextInput.accessibility.test.js +320 -0
  385. package/text-input/TextInput.js +224 -326
  386. package/text-input/TextInput.stories.tsx +68 -160
  387. package/text-input/TextInput.test.d.ts +1 -0
  388. package/text-input/TextInput.test.js +1227 -1195
  389. package/text-input/types.d.ts +25 -17
  390. package/textarea/Textarea.accessibility.test.d.ts +1 -0
  391. package/textarea/Textarea.accessibility.test.js +155 -0
  392. package/textarea/Textarea.js +64 -105
  393. package/textarea/{Textarea.stories.jsx → Textarea.stories.tsx} +58 -100
  394. package/textarea/Textarea.test.d.ts +1 -0
  395. package/textarea/Textarea.test.js +151 -180
  396. package/textarea/types.d.ts +9 -5
  397. package/toggle-group/ToggleGroup.accessibility.test.d.ts +1 -0
  398. package/toggle-group/ToggleGroup.accessibility.test.js +107 -0
  399. package/toggle-group/ToggleGroup.js +90 -109
  400. package/toggle-group/ToggleGroup.stories.tsx +11 -8
  401. package/toggle-group/ToggleGroup.test.d.ts +1 -0
  402. package/toggle-group/ToggleGroup.test.js +69 -88
  403. package/toggle-group/types.d.ts +28 -19
  404. package/tooltip/Tooltip.accessibility.test.d.ts +1 -0
  405. package/tooltip/Tooltip.accessibility.test.js +144 -0
  406. package/tooltip/Tooltip.d.ts +4 -0
  407. package/tooltip/Tooltip.js +50 -0
  408. package/tooltip/Tooltip.stories.tsx +111 -0
  409. package/tooltip/Tooltip.test.d.ts +1 -0
  410. package/tooltip/Tooltip.test.js +112 -0
  411. package/tooltip/types.d.ts +16 -0
  412. package/tooltip/types.js +5 -0
  413. package/typography/Typography.accessibility.test.d.ts +1 -0
  414. package/typography/Typography.accessibility.test.js +339 -0
  415. package/typography/Typography.js +4 -13
  416. package/typography/Typography.stories.tsx +1 -3
  417. package/typography/Typography.test.js +23 -0
  418. package/typography/types.d.ts +1 -1
  419. package/useTheme.d.ts +74 -141
  420. package/useTheme.js +1 -8
  421. package/useTranslatedLabels.js +1 -7
  422. package/utils/BaseTypography.d.ts +2 -2
  423. package/utils/BaseTypography.js +60 -70
  424. package/utils/FocusLock.js +26 -39
  425. package/wizard/Wizard.accessibility.test.d.ts +1 -0
  426. package/wizard/Wizard.accessibility.test.js +55 -0
  427. package/wizard/Wizard.js +27 -73
  428. package/wizard/Wizard.stories.tsx +20 -1
  429. package/wizard/Wizard.test.d.ts +1 -0
  430. package/wizard/Wizard.test.js +54 -81
  431. package/wizard/types.d.ts +8 -8
  432. package/card/ice-cream.jpg +0 -0
  433. package/common/OpenSans.css +0 -69
  434. package/common/fonts/OpenSans-Bold.ttf +0 -0
  435. package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  436. package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  437. package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  438. package/common/fonts/OpenSans-Italic.ttf +0 -0
  439. package/common/fonts/OpenSans-Light.ttf +0 -0
  440. package/common/fonts/OpenSans-LightItalic.ttf +0 -0
  441. package/common/fonts/OpenSans-Regular.ttf +0 -0
  442. package/common/fonts/OpenSans-SemiBold.ttf +0 -0
  443. package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  444. package/date-input/Icons.d.ts +0 -6
  445. package/date-input/Icons.js +0 -75
  446. package/number-input/numberInputContextTypes.d.ts +0 -19
  447. package/paginator/Icons.d.ts +0 -5
  448. package/paginator/Icons.js +0 -54
  449. package/resultsetTable/Icons.d.ts +0 -7
  450. package/resultsetTable/ResultsetTable.d.ts +0 -4
  451. package/resultsetTable/ResultsetTable.test.js +0 -325
  452. package/select/Icons.d.ts +0 -10
  453. package/select/Icons.js +0 -93
  454. package/sidenav/Icons.d.ts +0 -7
  455. package/sidenav/Icons.js +0 -51
  456. package/text-input/Icons.d.ts +0 -8
  457. package/text-input/Icons.js +0 -60
  458. /package/{resultsetTable → action-icon}/types.js +0 -0
  459. /package/{number-input/numberInputContextTypes.js → breadcrumbs/types.js} +0 -0
  460. /package/spinner/{Spinner.stories.jsx → Spinner.stories.tsx} +0 -0
@@ -1,73 +1,37 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
5
  Object.defineProperty(exports, "__esModule", {
8
6
  value: true
9
7
  });
10
8
  exports["default"] = void 0;
11
-
12
9
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
13
-
14
10
  var _react = _interopRequireDefault(require("react"));
15
-
16
11
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
17
-
18
- var _main = require("../main");
19
-
12
+ var _Flex = _interopRequireDefault(require("../flex/Flex"));
20
13
  var _useTheme = _interopRequireDefault(require("../useTheme"));
21
-
22
14
  var _useTranslatedLabels = _interopRequireDefault(require("../useTranslatedLabels"));
23
-
15
+ var _Icon = _interopRequireDefault(require("../icon/Icon"));
24
16
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
25
-
26
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
27
-
28
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
29
-
30
- var deleteIcon = /*#__PURE__*/_react["default"].createElement("svg", {
31
- xmlns: "http://www.w3.org/2000/svg",
32
- width: "24",
33
- height: "24",
34
- viewBox: "0 0 24 24",
35
- fill: "currentColor"
36
- }, /*#__PURE__*/_react["default"].createElement("path", {
37
- d: "M0 0h24v24H0V0z",
38
- fill: "none"
39
- }), /*#__PURE__*/_react["default"].createElement("path", {
40
- d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"
41
- }));
42
-
43
- var errorIcon = /*#__PURE__*/_react["default"].createElement("svg", {
44
- xmlns: "http://www.w3.org/2000/svg",
45
- height: "24px",
46
- viewBox: "0 0 24 24",
47
- width: "24px",
48
- fill: "currentColor"
49
- }, /*#__PURE__*/_react["default"].createElement("path", {
50
- d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"
51
- }));
52
-
17
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
18
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
53
19
  var FileItem = function FileItem(_ref) {
54
20
  var _ref$fileName = _ref.fileName,
55
- fileName = _ref$fileName === void 0 ? "" : _ref$fileName,
56
- _ref$error = _ref.error,
57
- error = _ref$error === void 0 ? "" : _ref$error,
58
- singleFileMode = _ref.singleFileMode,
59
- showPreview = _ref.showPreview,
60
- preview = _ref.preview,
61
- type = _ref.type,
62
- onDelete = _ref.onDelete,
63
- tabIndex = _ref.tabIndex;
21
+ fileName = _ref$fileName === void 0 ? "" : _ref$fileName,
22
+ _ref$error = _ref.error,
23
+ error = _ref$error === void 0 ? "" : _ref$error,
24
+ singleFileMode = _ref.singleFileMode,
25
+ showPreview = _ref.showPreview,
26
+ preview = _ref.preview,
27
+ type = _ref.type,
28
+ onDelete = _ref.onDelete,
29
+ tabIndex = _ref.tabIndex;
64
30
  var colorsTheme = (0, _useTheme["default"])();
65
31
  var translatedLabels = (0, _useTranslatedLabels["default"])();
66
-
67
32
  var getIconAriaLabel = function getIconAriaLabel() {
68
33
  if (type.includes("video")) return "video";else if (type.includes("audio")) return "audio";else return "file";
69
34
  };
70
-
71
35
  return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
72
36
  theme: colorsTheme.fileInput
73
37
  }, /*#__PURE__*/_react["default"].createElement(MainContainer, {
@@ -79,10 +43,15 @@ var FileItem = function FileItem(_ref) {
79
43
  alt: fileName
80
44
  }) : /*#__PURE__*/_react["default"].createElement(IconPreview, {
81
45
  error: error,
46
+ role: "document",
82
47
  "aria-label": getIconAriaLabel()
83
- }, preview)), /*#__PURE__*/_react["default"].createElement(FileItemContent, null, /*#__PURE__*/_react["default"].createElement(FileName, null, fileName), /*#__PURE__*/_react["default"].createElement(_main.DxcFlex, {
48
+ }, /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
49
+ icon: preview
50
+ }))), /*#__PURE__*/_react["default"].createElement(FileItemContent, null, /*#__PURE__*/_react["default"].createElement(FileName, null, fileName), /*#__PURE__*/_react["default"].createElement(_Flex["default"], {
84
51
  gap: "0.25rem"
85
- }, error && /*#__PURE__*/_react["default"].createElement(ErrorIcon, null, errorIcon), /*#__PURE__*/_react["default"].createElement(DeleteFileAction, {
52
+ }, error && /*#__PURE__*/_react["default"].createElement(ErrorIcon, null, /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
53
+ icon: "filled_error"
54
+ })), /*#__PURE__*/_react["default"].createElement(DeleteFileAction, {
86
55
  onClick: function onClick() {
87
56
  onDelete(fileName);
88
57
  },
@@ -90,9 +59,13 @@ var FileItem = function FileItem(_ref) {
90
59
  title: translatedLabels.fileInput.deleteFileActionTitle,
91
60
  "aria-label": translatedLabels.fileInput.deleteFileActionTitle,
92
61
  tabIndex: tabIndex
93
- }, deleteIcon)), error && !singleFileMode && /*#__PURE__*/_react["default"].createElement(ErrorMessage, null, error))));
62
+ }, /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
63
+ icon: "close"
64
+ }))), error && !singleFileMode && /*#__PURE__*/_react["default"].createElement(ErrorMessage, {
65
+ role: "alert",
66
+ "aria-live": "assertive"
67
+ }, error))));
94
68
  };
95
-
96
69
  var MainContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n gap: 0.75rem;\n width: ", ";\n padding: ", ";\n ", ";\n border-color: ", ";\n border-width: ", ";\n border-style: ", ";\n border-radius: ", ";\n"])), function (props) {
97
70
  return props.singleFileMode ? "230px" : "320px";
98
71
  }, function (props) {
@@ -108,17 +81,13 @@ var MainContainer = _styledComponents["default"].div(_templateObject || (_templa
108
81
  }, function (props) {
109
82
  return props.theme.fileItemBorderRadius;
110
83
  });
111
-
112
84
  var ImagePreview = _styledComponents["default"].img(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n width: 48px;\n height: 48px;\n border-radius: 2px;\n object-fit: contain;\n"])));
113
-
114
- var IconPreview = _styledComponents["default"].span(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ", ";\n width: 48px;\n height: 48px;\n padding: 15px;\n border-radius: 2px;\n color: ", ";\n\n svg {\n height: 18px;\n width: 18px;\n }\n"])), function (props) {
85
+ var IconPreview = _styledComponents["default"].span(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ", ";\n width: 48px;\n height: 48px;\n padding: 15px;\n border-radius: 2px;\n color: ", ";\n font-size: 18px;\n svg {\n height: 18px;\n width: 18px;\n }\n"])), function (props) {
115
86
  return props.error ? props.theme.errorFilePreviewBackgroundColor : props.theme.filePreviewBackgroundColor;
116
87
  }, function (props) {
117
88
  return props.error ? props.theme.errorFilePreviewIconColor : props.theme.filePreviewIconColor;
118
89
  });
119
-
120
90
  var FileItemContent = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n flex-grow: 1;\n display: grid;\n grid-template-columns: auto min-content;\n grid-template-rows: min-content auto;\n column-gap: 0.25rem;\n"])));
121
-
122
91
  var FileName = _styledComponents["default"].span(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n align-self: center;\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"])), function (props) {
123
92
  return props.theme.fileNameFontColor;
124
93
  }, function (props) {
@@ -130,10 +99,8 @@ var FileName = _styledComponents["default"].span(_templateObject5 || (_templateO
130
99
  }, function (props) {
131
100
  return props.theme.fileItemLineHeight;
132
101
  });
133
-
134
- var ErrorIcon = _styledComponents["default"].span(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-wrap: wrap;\n align-content: center;\n padding: 3px;\n height: 18px;\n width: 18px;\n color: #d0011b;\n"])));
135
-
136
- var DeleteFileAction = _styledComponents["default"].button(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-wrap: wrap;\n align-content: center;\n height: 24px;\n width: 24px;\n font-size: 1rem;\n font-family: ", ";\n border: 1px solid transparent;\n border-radius: 2px;\n background-color: transparent;\n box-shadow: 0 0 0 2px transparent;\n padding: 3px;\n cursor: pointer;\n color: ", ";\n\n svg {\n line-height: 18px;\n }\n &:hover {\n background-color: ", ";\n }\n &:focus,\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 2px ", ";\n }\n &:active {\n background-color: ", ";\n }\n"])), function (props) {
102
+ var ErrorIcon = _styledComponents["default"].span(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-wrap: wrap;\n align-content: center;\n padding: 3px;\n height: 18px;\n width: 18px;\n font-size: 18px;\n color: #d0011b;\n"])));
103
+ var DeleteFileAction = _styledComponents["default"].button(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-wrap: wrap;\n align-content: center;\n height: 24px;\n width: 24px;\n font-size: 1rem;\n font-family: ", ";\n border: 1px solid transparent;\n border-radius: 2px;\n background-color: transparent;\n box-shadow: 0 0 0 2px transparent;\n padding: 3px;\n cursor: pointer;\n color: ", ";\n font-size: 18px;\n &:hover {\n background-color: ", ";\n }\n &:focus,\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 2px ", ";\n }\n &:active {\n background-color: ", ";\n }\n"])), function (props) {
137
104
  return props.theme.fontFamily;
138
105
  }, function (props) {
139
106
  return props.theme.deleteFileItemColor;
@@ -144,7 +111,6 @@ var DeleteFileAction = _styledComponents["default"].button(_templateObject7 || (
144
111
  }, function (props) {
145
112
  return props.theme.activeDeleteFileItemBackgroundColor;
146
113
  });
147
-
148
114
  var ErrorMessage = _styledComponents["default"].span(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n"])), function (props) {
149
115
  return props.theme.errorMessageFontColor;
150
116
  }, function (props) {
@@ -156,7 +122,4 @@ var ErrorMessage = _styledComponents["default"].span(_templateObject8 || (_templ
156
122
  }, function (props) {
157
123
  return props.theme.errorMessageLineHeight;
158
124
  });
159
-
160
- var _default = /*#__PURE__*/_react["default"].memo(FileItem);
161
-
162
- exports["default"] = _default;
125
+ var _default = exports["default"] = /*#__PURE__*/_react["default"].memo(FileItem);
@@ -1,11 +1,11 @@
1
- declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- declare type Margin = {
1
+ type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
+ type Margin = {
3
3
  top?: Space;
4
4
  bottom?: Space;
5
5
  left?: Space;
6
6
  right?: Space;
7
7
  };
8
- declare type FileData = {
8
+ export type FileData = {
9
9
  /**
10
10
  * Selected file.
11
11
  */
@@ -19,11 +19,7 @@ declare type FileData = {
19
19
  */
20
20
  preview?: string;
21
21
  };
22
- declare type CommonProps = {
23
- /**
24
- * Name attribute.
25
- */
26
- name?: string;
22
+ type CommonProps = {
27
23
  /**
28
24
  * Text to be placed above the component.
29
25
  */
@@ -80,7 +76,7 @@ declare type CommonProps = {
80
76
  */
81
77
  tabIndex?: number;
82
78
  };
83
- declare type DropModeProps = CommonProps & {
79
+ type DropModeProps = CommonProps & {
84
80
  /**
85
81
  * Uses one of the available file input modes:
86
82
  * 'file': Files are selected by clicking the button and selecting it through the file explorer.
@@ -94,7 +90,7 @@ declare type DropModeProps = CommonProps & {
94
90
  */
95
91
  dropAreaLabel?: string;
96
92
  };
97
- declare type FileModeProps = CommonProps & {
93
+ type FileModeProps = CommonProps & {
98
94
  /**
99
95
  * Uses one of the available file input modes:
100
96
  * 'file': Files are selected by clicking the button and selecting it through the file explorer.
@@ -111,12 +107,12 @@ declare type FileModeProps = CommonProps & {
111
107
  /**
112
108
  * Reference to the component.
113
109
  */
114
- export declare type RefType = HTMLDivElement;
115
- declare type Props = DropModeProps | FileModeProps;
110
+ export type RefType = HTMLDivElement;
111
+ type Props = DropModeProps | FileModeProps;
116
112
  /**
117
113
  * Single file item preview.
118
114
  */
119
- export declare type FileItemProps = {
115
+ export type FileItemProps = {
120
116
  fileName?: string;
121
117
  error?: string;
122
118
  showPreview: boolean;
package/flex/Flex.js CHANGED
@@ -1,46 +1,36 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  Object.defineProperty(exports, "__esModule", {
6
5
  value: true
7
6
  });
8
7
  exports["default"] = void 0;
9
-
10
8
  var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
11
-
12
9
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
13
-
14
10
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
15
-
16
11
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
17
-
18
12
  var _react = _interopRequireDefault(require("react"));
19
-
20
13
  var _styledComponents = _interopRequireDefault(require("styled-components"));
21
-
22
14
  var _templateObject;
23
-
24
15
  var _excluded = ["direction", "wrap", "gap", "order", "grow", "shrink", "basis", "children"],
25
- _excluded2 = ["justifyContent", "alignItems", "alignContent", "alignSelf"];
26
-
16
+ _excluded2 = ["justifyContent", "alignItems", "alignContent", "alignSelf"];
27
17
  var DxcFlex = function DxcFlex(_ref) {
28
18
  var _ref$direction = _ref.direction,
29
- direction = _ref$direction === void 0 ? "row" : _ref$direction,
30
- _ref$wrap = _ref.wrap,
31
- wrap = _ref$wrap === void 0 ? "nowrap" : _ref$wrap,
32
- _ref$gap = _ref.gap,
33
- gap = _ref$gap === void 0 ? "0rem" : _ref$gap,
34
- _ref$order = _ref.order,
35
- order = _ref$order === void 0 ? 0 : _ref$order,
36
- _ref$grow = _ref.grow,
37
- grow = _ref$grow === void 0 ? 0 : _ref$grow,
38
- _ref$shrink = _ref.shrink,
39
- shrink = _ref$shrink === void 0 ? 1 : _ref$shrink,
40
- _ref$basis = _ref.basis,
41
- basis = _ref$basis === void 0 ? "auto" : _ref$basis,
42
- children = _ref.children,
43
- props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
19
+ direction = _ref$direction === void 0 ? "row" : _ref$direction,
20
+ _ref$wrap = _ref.wrap,
21
+ wrap = _ref$wrap === void 0 ? "nowrap" : _ref$wrap,
22
+ _ref$gap = _ref.gap,
23
+ gap = _ref$gap === void 0 ? "0rem" : _ref$gap,
24
+ _ref$order = _ref.order,
25
+ order = _ref$order === void 0 ? 0 : _ref$order,
26
+ _ref$grow = _ref.grow,
27
+ grow = _ref$grow === void 0 ? 0 : _ref$grow,
28
+ _ref$shrink = _ref.shrink,
29
+ shrink = _ref$shrink === void 0 ? 1 : _ref$shrink,
30
+ _ref$basis = _ref.basis,
31
+ basis = _ref$basis === void 0 ? "auto" : _ref$basis,
32
+ children = _ref.children,
33
+ props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
44
34
  return /*#__PURE__*/_react["default"].createElement(Flex, (0, _extends2["default"])({
45
35
  $direction: direction,
46
36
  $wrap: wrap,
@@ -51,21 +41,17 @@ var DxcFlex = function DxcFlex(_ref) {
51
41
  $gap: gap
52
42
  }, props), children);
53
43
  };
54
-
55
44
  var Flex = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n ", "\n"])), function (_ref2) {
56
45
  var _props$$gap, _props$$gap$rowGap, _props$$gap$columnGap;
57
-
58
46
  var _ref2$justifyContent = _ref2.justifyContent,
59
- justifyContent = _ref2$justifyContent === void 0 ? "flex-start" : _ref2$justifyContent,
60
- _ref2$alignItems = _ref2.alignItems,
61
- alignItems = _ref2$alignItems === void 0 ? "stretch" : _ref2$alignItems,
62
- _ref2$alignContent = _ref2.alignContent,
63
- alignContent = _ref2$alignContent === void 0 ? "normal" : _ref2$alignContent,
64
- _ref2$alignSelf = _ref2.alignSelf,
65
- alignSelf = _ref2$alignSelf === void 0 ? "auto" : _ref2$alignSelf,
66
- props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
47
+ justifyContent = _ref2$justifyContent === void 0 ? "flex-start" : _ref2$justifyContent,
48
+ _ref2$alignItems = _ref2.alignItems,
49
+ alignItems = _ref2$alignItems === void 0 ? "stretch" : _ref2$alignItems,
50
+ _ref2$alignContent = _ref2.alignContent,
51
+ alignContent = _ref2$alignContent === void 0 ? "normal" : _ref2$alignContent,
52
+ _ref2$alignSelf = _ref2.alignSelf,
53
+ alignSelf = _ref2$alignSelf === void 0 ? "auto" : _ref2$alignSelf,
54
+ props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
67
55
  return "\n flex-direction: ".concat(props.$direction, "; \n flex-wrap: ").concat(props.$wrap, "; \n justify-content: ").concat(justifyContent, "; \n align-items: ").concat(alignItems, ";\n align-content: ").concat(alignContent, ";\n align-self: ").concat(alignSelf, ";\n gap: ").concat(props.$gap != null && typeof props.$gap === "string" ? (_props$$gap = props.$gap) !== null && _props$$gap !== void 0 ? _props$$gap : "" : "", "}\n row-gap: ").concat(props.$gap != null && (0, _typeof2["default"])(props.$gap) === "object" ? (_props$$gap$rowGap = props.$gap.rowGap) !== null && _props$$gap$rowGap !== void 0 ? _props$$gap$rowGap : "" : "", "}\n column-gap: ").concat(props.$gap != null && (0, _typeof2["default"])(props.$gap) === "object" ? (_props$$gap$columnGap = props.$gap.columnGap) !== null && _props$$gap$columnGap !== void 0 ? _props$$gap$columnGap : "" : "", "}\n order: ").concat(props.$order, ";\n flex-grow: ").concat(props.$grow, ";\n flex-shrink: ").concat(props.$shrink, ";\n flex-basis: ").concat(props.$basis, ";\n ");
68
56
  });
69
-
70
- var _default = DxcFlex;
71
- exports["default"] = _default;
57
+ var _default = exports["default"] = DxcFlex;
package/flex/types.d.ts CHANGED
@@ -1,13 +1,13 @@
1
1
  /// <reference types="react" />
2
- declare type Spaces = "0rem" | "0.125rem" | "0.25rem" | "0.5rem" | "1rem" | "1.5rem" | "2rem" | "3rem" | "4rem" | "5rem";
3
- declare type Gap = {
2
+ type Spaces = "0rem" | "0.125rem" | "0.25rem" | "0.5rem" | "1rem" | "1.5rem" | "2rem" | "3rem" | "4rem" | "5rem";
3
+ type Gap = {
4
4
  rowGap: Spaces;
5
5
  columnGap?: Spaces;
6
6
  } | {
7
7
  rowGap?: Spaces;
8
- columnGap?: Spaces;
8
+ columnGap: Spaces;
9
9
  } | Spaces;
10
- declare type CommonProps = {
10
+ type CommonProps = {
11
11
  /**
12
12
  * Sets the justify-content CSS property.
13
13
  *
@@ -33,7 +33,7 @@ declare type CommonProps = {
33
33
  */
34
34
  alignSelf?: "auto" | "flex-start" | "flex-end" | "center" | "baseline" | "stretch";
35
35
  };
36
- declare type Props = CommonProps & {
36
+ type Props = CommonProps & {
37
37
  /**
38
38
  * Sets the flex-direction CSS property.
39
39
  *
@@ -85,7 +85,7 @@ declare type Props = CommonProps & {
85
85
  */
86
86
  children: React.ReactNode;
87
87
  };
88
- export declare type StyledProps = CommonProps & {
88
+ export type StyledProps = CommonProps & {
89
89
  $direction?: "row" | "row-reverse" | "column" | "column-reverse";
90
90
  $wrap?: "nowrap" | "wrap" | "wrap-reverse";
91
91
  $gap?: Spaces | Gap;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,125 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
5
+ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
6
+ var _react = _interopRequireDefault(require("react"));
7
+ var _react2 = require("@testing-library/react");
8
+ var _axeHelper = require("../../test/accessibility/axe-helper.js");
9
+ var _Footer = _interopRequireDefault(require("./Footer"));
10
+ var _disabledRules = require("../../test/accessibility/rules/specific/footer/disabledRules.js");
11
+ var disabledRules = {
12
+ rules: _disabledRules.disabledRules.reduce(function (rulesObj, rule) {
13
+ rulesObj[rule] = {
14
+ enabled: false
15
+ };
16
+ return rulesObj;
17
+ }, {})
18
+ };
19
+ var social = [{
20
+ href: "https://www.linkedin.com/company/dxctechnology",
21
+ logo: /*#__PURE__*/_react["default"].createElement("svg", {
22
+ version: "1.1",
23
+ x: "0px",
24
+ y: "0px",
25
+ viewBox: "0 0 438.536 438.536",
26
+ fill: "currentColor"
27
+ }, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("path", {
28
+ d: "M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123 C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126 h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225 C438.532,59.576,430.49,40.204,414.41,24.123z M133.618,367.157H67.666V169.016h65.952V367.157z M127.626,132.332 c-6.851,6.567-15.893,9.851-27.124,9.851h-0.288c-10.848,0-19.648-3.284-26.407-9.851c-6.76-6.567-10.138-14.703-10.138-24.41 c0-9.897,3.476-18.083,10.421-24.556c6.95-6.471,15.942-9.708,26.98-9.708c11.039,0,19.89,3.237,26.553,9.708 c6.661,6.473,10.088,14.659,10.277,24.556C137.899,117.625,134.477,125.761,127.626,132.332z M370.873,367.157h-65.952v-105.92 c0-29.879-11.036-44.823-33.116-44.823c-8.374,0-15.42,2.331-21.128,6.995c-5.715,4.661-9.996,10.324-12.847,16.991 c-1.335,3.422-1.999,8.75-1.999,15.981v110.775h-65.952c0.571-119.529,0.571-185.579,0-198.142h65.952v27.974 c13.867-21.681,33.558-32.544,59.101-32.544c22.84,0,41.21,7.52,55.104,22.554c13.895,15.037,20.841,37.214,20.841,66.519v113.64 H370.873z"
29
+ }))),
30
+ title: "Linkedin"
31
+ }, {
32
+ href: "https://x.com/dxctechnology",
33
+ logo: /*#__PURE__*/_react["default"].createElement("svg", {
34
+ width: "256",
35
+ height: "256",
36
+ viewBox: "0 0 256 256",
37
+ fill: "none",
38
+ xmlns: "http://www.w3.org/2000/svg"
39
+ }, /*#__PURE__*/_react["default"].createElement("rect", {
40
+ width: "256",
41
+ height: "256",
42
+ rx: "40",
43
+ fill: "white"
44
+ }), /*#__PURE__*/_react["default"].createElement("path", {
45
+ d: "M140.192 118.205L187.848 64H176.556L135.158 111.056L102.117 64H64L113.975 135.163L64 192H75.2914L118.982 142.296L153.883 192H192L140.192 118.205ZM124.722 135.787L119.65 128.697L79.3634 72.3294H96.7094L129.232 117.837L134.282 124.927L176.551 184.076H159.205L124.722 135.787Z",
46
+ fill: "#0F1419"
47
+ })),
48
+ title: "X"
49
+ }, {
50
+ href: "https://www.facebook.com/DXCTechnology/",
51
+ logo: /*#__PURE__*/_react["default"].createElement("svg", {
52
+ version: "1.1",
53
+ x: "0px",
54
+ y: "0px",
55
+ viewBox: "0 0 438.536 438.536",
56
+ fill: "currentColor",
57
+ width: "1000px",
58
+ height: "500px"
59
+ }, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("path", {
60
+ d: "M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123 C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126 h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225 C438.532,59.576,430.49,40.204,414.41,24.123z M373.155,225.548h-49.963V406.84h-74.802V225.548H210.99V163.02h37.401v-37.402 c0-26.838,6.283-47.107,18.843-60.813c12.559-13.706,33.304-20.555,62.242-20.555h49.963v62.526h-31.401 c-10.663,0-17.467,1.853-20.417,5.568c-2.949,3.711-4.428,10.23-4.428,19.558v31.119h56.534L373.155,225.548z"
61
+ }))),
62
+ title: "Facebook"
63
+ }];
64
+ var bottom = [{
65
+ href: "https://www.linkedin.com/company/dxctechnology",
66
+ text: "Linkedin"
67
+ }, {
68
+ href: "https://x.com/dxctechnology",
69
+ text: "X"
70
+ }, {
71
+ href: "https://www.facebook.com/DXCTechnology/",
72
+ text: "Facebook"
73
+ }];
74
+ describe("Footer component accessibility tests", function () {
75
+ it("Should not have basic accessibility issues", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
76
+ var _render, container, results;
77
+ return _regenerator["default"].wrap(function _callee$(_context) {
78
+ while (1) switch (_context.prev = _context.next) {
79
+ case 0:
80
+ _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Footer["default"], {
81
+ copyright: "Copyright",
82
+ socialLinks: social,
83
+ bottomLinks: bottom,
84
+ margin: "small",
85
+ mode: "default"
86
+ }, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("a", {
87
+ href: "https://www.linkedin.com/company/dxctechnology"
88
+ }, "Linkedin")))), container = _render.container;
89
+ _context.next = 3;
90
+ return (0, _axeHelper.axe)(container, disabledRules);
91
+ case 3:
92
+ results = _context.sent;
93
+ expect(results).toHaveNoViolations();
94
+ case 5:
95
+ case "end":
96
+ return _context.stop();
97
+ }
98
+ }, _callee);
99
+ })));
100
+ it("Should not have basic accessibility issues for reduced mode", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
101
+ var _render2, container, results;
102
+ return _regenerator["default"].wrap(function _callee2$(_context2) {
103
+ while (1) switch (_context2.prev = _context2.next) {
104
+ case 0:
105
+ _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Footer["default"], {
106
+ copyright: "Copyright",
107
+ socialLinks: social,
108
+ bottomLinks: bottom,
109
+ margin: "small",
110
+ mode: "reduced"
111
+ }, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("a", {
112
+ href: "https://www.linkedin.com/company/dxctechnology"
113
+ }, "Linkedin")))), container = _render2.container;
114
+ _context2.next = 3;
115
+ return (0, _axeHelper.axe)(container, disabledRules);
116
+ case 3:
117
+ results = _context2.sent;
118
+ expect(results).toHaveNoViolations();
119
+ case 5:
120
+ case "end":
121
+ return _context2.stop();
122
+ }
123
+ }, _callee2);
124
+ })));
125
+ });
@@ -1,4 +1,4 @@
1
1
  /// <reference types="react" />
2
2
  import FooterPropsType from "./types";
3
- declare const DxcFooter: ({ socialLinks, bottomLinks, copyright, children, padding, margin, tabIndex, }: FooterPropsType) => JSX.Element;
3
+ declare const DxcFooter: ({ socialLinks, bottomLinks, copyright, children, margin, tabIndex, mode, }: FooterPropsType) => JSX.Element;
4
4
  export default DxcFooter;