@dxc-technology/halstack-react 0.0.0-a0543ea → 0.0.0-a062293

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 (491) hide show
  1. package/BackgroundColorContext.d.ts +10 -0
  2. package/BackgroundColorContext.js +47 -0
  3. package/HalstackContext.d.ts +12 -0
  4. package/HalstackContext.js +294 -0
  5. package/accordion/Accordion.d.ts +4 -0
  6. package/accordion/Accordion.js +239 -0
  7. package/accordion/Accordion.stories.tsx +346 -0
  8. package/accordion/Accordion.test.js +71 -0
  9. package/accordion/types.d.ts +69 -0
  10. package/accordion/types.js +5 -0
  11. package/accordion-group/AccordionGroup.d.ts +7 -0
  12. package/accordion-group/AccordionGroup.js +149 -0
  13. package/accordion-group/AccordionGroup.stories.tsx +251 -0
  14. package/accordion-group/AccordionGroup.test.js +126 -0
  15. package/accordion-group/types.d.ts +79 -0
  16. package/accordion-group/types.js +5 -0
  17. package/alert/Alert.d.ts +4 -0
  18. package/{dist/alert → alert}/Alert.js +44 -154
  19. package/alert/Alert.stories.tsx +170 -0
  20. package/alert/Alert.test.js +92 -0
  21. package/alert/types.d.ts +49 -0
  22. package/alert/types.js +5 -0
  23. package/badge/Badge.d.ts +4 -0
  24. package/badge/Badge.js +61 -0
  25. package/badge/types.d.ts +5 -0
  26. package/badge/types.js +5 -0
  27. package/bleed/Bleed.d.ts +3 -0
  28. package/bleed/Bleed.js +51 -0
  29. package/bleed/Bleed.stories.tsx +341 -0
  30. package/bleed/types.d.ts +37 -0
  31. package/bleed/types.js +5 -0
  32. package/box/Box.d.ts +4 -0
  33. package/box/Box.js +116 -0
  34. package/box/Box.stories.tsx +132 -0
  35. package/box/Box.test.js +18 -0
  36. package/box/types.d.ts +44 -0
  37. package/box/types.js +5 -0
  38. package/bulleted-list/BulletedList.d.ts +7 -0
  39. package/bulleted-list/BulletedList.js +123 -0
  40. package/bulleted-list/BulletedList.stories.tsx +200 -0
  41. package/bulleted-list/types.d.ts +11 -0
  42. package/bulleted-list/types.js +5 -0
  43. package/button/Button.d.ts +4 -0
  44. package/button/Button.js +154 -0
  45. package/button/Button.stories.tsx +334 -0
  46. package/button/Button.test.js +35 -0
  47. package/button/types.d.ts +53 -0
  48. package/button/types.js +5 -0
  49. package/card/Card.d.ts +4 -0
  50. package/card/Card.js +161 -0
  51. package/card/Card.stories.tsx +201 -0
  52. package/card/Card.test.js +50 -0
  53. package/card/ice-cream.jpg +0 -0
  54. package/card/types.d.ts +68 -0
  55. package/card/types.js +5 -0
  56. package/checkbox/Checkbox.d.ts +4 -0
  57. package/checkbox/Checkbox.js +250 -0
  58. package/checkbox/Checkbox.stories.tsx +208 -0
  59. package/checkbox/Checkbox.test.js +155 -0
  60. package/checkbox/types.d.ts +68 -0
  61. package/checkbox/types.js +5 -0
  62. package/chip/Chip.d.ts +4 -0
  63. package/chip/Chip.js +149 -0
  64. package/chip/Chip.stories.tsx +151 -0
  65. package/chip/Chip.test.js +56 -0
  66. package/chip/types.d.ts +45 -0
  67. package/chip/types.js +5 -0
  68. package/{dist/common → common}/OpenSans.css +0 -0
  69. package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  70. package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  71. package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  72. package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  73. package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  74. package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  75. package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  76. package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  77. package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  78. package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  79. package/{dist/common → common}/utils.js +0 -0
  80. package/{dist/common → common}/variables.js +477 -534
  81. package/date-input/Calendar.d.ts +4 -0
  82. package/date-input/Calendar.js +246 -0
  83. package/date-input/DateInput.d.ts +4 -0
  84. package/date-input/DateInput.js +269 -0
  85. package/date-input/DateInput.stories.tsx +237 -0
  86. package/date-input/DateInput.test.js +835 -0
  87. package/date-input/DatePicker.d.ts +4 -0
  88. package/date-input/DatePicker.js +132 -0
  89. package/date-input/Icons.d.ts +6 -0
  90. package/date-input/Icons.js +75 -0
  91. package/date-input/YearPicker.d.ts +4 -0
  92. package/date-input/YearPicker.js +116 -0
  93. package/date-input/types.d.ts +158 -0
  94. package/date-input/types.js +5 -0
  95. package/dialog/Dialog.d.ts +4 -0
  96. package/dialog/Dialog.js +162 -0
  97. package/dialog/Dialog.stories.tsx +267 -0
  98. package/dialog/Dialog.test.js +70 -0
  99. package/dialog/types.d.ts +44 -0
  100. package/dialog/types.js +5 -0
  101. package/dropdown/Dropdown.d.ts +4 -0
  102. package/dropdown/Dropdown.js +389 -0
  103. package/dropdown/Dropdown.stories.tsx +320 -0
  104. package/dropdown/Dropdown.test.js +585 -0
  105. package/dropdown/DropdownMenu.d.ts +4 -0
  106. package/dropdown/DropdownMenu.js +80 -0
  107. package/dropdown/DropdownMenuItem.d.ts +4 -0
  108. package/dropdown/DropdownMenuItem.js +92 -0
  109. package/dropdown/types.d.ts +100 -0
  110. package/dropdown/types.js +5 -0
  111. package/file-input/FileInput.d.ts +4 -0
  112. package/file-input/FileInput.js +551 -0
  113. package/file-input/FileInput.stories.tsx +535 -0
  114. package/file-input/FileInput.test.js +498 -0
  115. package/file-input/FileItem.d.ts +4 -0
  116. package/file-input/FileItem.js +161 -0
  117. package/file-input/types.d.ts +129 -0
  118. package/file-input/types.js +5 -0
  119. package/flex/Flex.d.ts +4 -0
  120. package/flex/Flex.js +69 -0
  121. package/flex/Flex.stories.tsx +103 -0
  122. package/flex/types.d.ts +32 -0
  123. package/flex/types.js +5 -0
  124. package/footer/Footer.d.ts +4 -0
  125. package/footer/Footer.js +185 -0
  126. package/footer/Footer.stories.tsx +137 -0
  127. package/footer/Footer.test.js +109 -0
  128. package/footer/Icons.d.ts +2 -0
  129. package/footer/Icons.js +77 -0
  130. package/footer/types.d.ts +66 -0
  131. package/footer/types.js +5 -0
  132. package/header/Header.d.ts +7 -0
  133. package/header/Header.js +305 -0
  134. package/header/Header.stories.tsx +172 -0
  135. package/header/Header.test.js +79 -0
  136. package/header/Icons.d.ts +2 -0
  137. package/header/Icons.js +34 -0
  138. package/header/types.d.ts +48 -0
  139. package/header/types.js +5 -0
  140. package/heading/Heading.d.ts +4 -0
  141. package/{dist/heading → heading}/Heading.js +31 -90
  142. package/heading/Heading.stories.tsx +54 -0
  143. package/heading/Heading.test.js +186 -0
  144. package/heading/types.d.ts +33 -0
  145. package/heading/types.js +5 -0
  146. package/inset/Inset.d.ts +3 -0
  147. package/inset/Inset.js +51 -0
  148. package/inset/Inset.stories.tsx +229 -0
  149. package/inset/types.d.ts +37 -0
  150. package/inset/types.js +5 -0
  151. package/layout/ApplicationLayout.d.ts +20 -0
  152. package/layout/ApplicationLayout.js +171 -0
  153. package/layout/ApplicationLayout.stories.tsx +162 -0
  154. package/layout/Icons.d.ts +5 -0
  155. package/layout/Icons.js +66 -0
  156. package/layout/SidenavContext.d.ts +5 -0
  157. package/layout/SidenavContext.js +19 -0
  158. package/layout/types.d.ts +42 -0
  159. package/layout/types.js +5 -0
  160. package/link/Link.d.ts +4 -0
  161. package/link/Link.js +136 -0
  162. package/link/Link.stories.tsx +193 -0
  163. package/link/Link.test.js +83 -0
  164. package/link/types.d.ts +54 -0
  165. package/link/types.js +5 -0
  166. package/main.d.ts +44 -0
  167. package/{dist/main.js → main.js} +116 -114
  168. package/number-input/NumberInput.d.ts +4 -0
  169. package/number-input/NumberInput.js +76 -0
  170. package/number-input/NumberInput.stories.tsx +115 -0
  171. package/number-input/NumberInput.test.js +542 -0
  172. package/number-input/NumberInputContext.d.ts +4 -0
  173. package/{dist/number/NumberContext.js → number-input/NumberInputContext.js} +6 -3
  174. package/number-input/numberInputContextTypes.d.ts +19 -0
  175. package/number-input/numberInputContextTypes.js +5 -0
  176. package/number-input/types.d.ts +124 -0
  177. package/number-input/types.js +5 -0
  178. package/package.json +46 -40
  179. package/paginator/Icons.d.ts +5 -0
  180. package/paginator/Icons.js +54 -0
  181. package/paginator/Paginator.d.ts +4 -0
  182. package/paginator/Paginator.js +165 -0
  183. package/paginator/Paginator.stories.tsx +63 -0
  184. package/paginator/Paginator.test.js +315 -0
  185. package/paginator/types.d.ts +38 -0
  186. package/paginator/types.js +5 -0
  187. package/paragraph/Paragraph.d.ts +6 -0
  188. package/paragraph/Paragraph.js +38 -0
  189. package/paragraph/Paragraph.stories.tsx +44 -0
  190. package/password-input/PasswordInput.d.ts +4 -0
  191. package/{dist/password/Password.js → password-input/PasswordInput.js} +47 -81
  192. package/password-input/PasswordInput.stories.tsx +131 -0
  193. package/password-input/PasswordInput.test.js +181 -0
  194. package/password-input/types.d.ts +110 -0
  195. package/password-input/types.js +5 -0
  196. package/progress-bar/ProgressBar.d.ts +4 -0
  197. package/progress-bar/ProgressBar.js +176 -0
  198. package/progress-bar/ProgressBar.stories.jsx +60 -0
  199. package/progress-bar/ProgressBar.test.js +110 -0
  200. package/progress-bar/types.d.ts +36 -0
  201. package/progress-bar/types.js +5 -0
  202. package/quick-nav/QuickNav.d.ts +4 -0
  203. package/quick-nav/QuickNav.js +117 -0
  204. package/quick-nav/QuickNav.stories.tsx +342 -0
  205. package/quick-nav/types.d.ts +21 -0
  206. package/quick-nav/types.js +5 -0
  207. package/radio-group/Radio.d.ts +4 -0
  208. package/radio-group/Radio.js +156 -0
  209. package/radio-group/RadioGroup.d.ts +4 -0
  210. package/radio-group/RadioGroup.js +283 -0
  211. package/radio-group/RadioGroup.stories.tsx +101 -0
  212. package/radio-group/RadioGroup.test.js +722 -0
  213. package/radio-group/types.d.ts +114 -0
  214. package/radio-group/types.js +5 -0
  215. package/resultsetTable/Icons.d.ts +7 -0
  216. package/resultsetTable/Icons.js +51 -0
  217. package/resultsetTable/ResultsetTable.d.ts +4 -0
  218. package/resultsetTable/ResultsetTable.js +195 -0
  219. package/resultsetTable/ResultsetTable.stories.tsx +300 -0
  220. package/resultsetTable/ResultsetTable.test.js +325 -0
  221. package/resultsetTable/types.d.ts +67 -0
  222. package/resultsetTable/types.js +5 -0
  223. package/select/Icons.d.ts +10 -0
  224. package/select/Icons.js +93 -0
  225. package/select/Listbox.d.ts +4 -0
  226. package/select/Listbox.js +169 -0
  227. package/select/Option.d.ts +4 -0
  228. package/select/Option.js +97 -0
  229. package/select/Select.d.ts +4 -0
  230. package/select/Select.js +664 -0
  231. package/select/Select.stories.tsx +670 -0
  232. package/select/Select.test.js +2228 -0
  233. package/select/types.d.ts +210 -0
  234. package/select/types.js +5 -0
  235. package/sidenav/Sidenav.d.ts +10 -0
  236. package/sidenav/Sidenav.js +266 -0
  237. package/sidenav/Sidenav.stories.tsx +189 -0
  238. package/sidenav/Sidenav.test.js +44 -0
  239. package/sidenav/types.d.ts +73 -0
  240. package/sidenav/types.js +5 -0
  241. package/slider/Slider.d.ts +4 -0
  242. package/slider/Slider.js +343 -0
  243. package/slider/Slider.stories.tsx +183 -0
  244. package/slider/Slider.test.js +250 -0
  245. package/slider/types.d.ts +86 -0
  246. package/slider/types.js +5 -0
  247. package/spinner/Spinner.d.ts +4 -0
  248. package/spinner/Spinner.js +250 -0
  249. package/spinner/Spinner.stories.jsx +103 -0
  250. package/spinner/Spinner.test.js +64 -0
  251. package/spinner/types.d.ts +32 -0
  252. package/spinner/types.js +5 -0
  253. package/switch/Switch.d.ts +4 -0
  254. package/switch/Switch.js +262 -0
  255. package/switch/Switch.stories.tsx +138 -0
  256. package/switch/Switch.test.js +225 -0
  257. package/switch/types.d.ts +66 -0
  258. package/switch/types.js +5 -0
  259. package/table/Table.d.ts +4 -0
  260. package/{dist/table → table}/Table.js +12 -26
  261. package/table/Table.stories.jsx +277 -0
  262. package/table/Table.test.js +26 -0
  263. package/table/types.d.ts +21 -0
  264. package/table/types.js +5 -0
  265. package/tabs/Tab.d.ts +4 -0
  266. package/tabs/Tab.js +133 -0
  267. package/tabs/Tabs.d.ts +4 -0
  268. package/tabs/Tabs.js +467 -0
  269. package/tabs/Tabs.stories.tsx +188 -0
  270. package/tabs/Tabs.test.js +351 -0
  271. package/tabs/types.d.ts +92 -0
  272. package/tabs/types.js +5 -0
  273. package/tabs-nav/NavTabs.d.ts +8 -0
  274. package/tabs-nav/NavTabs.js +125 -0
  275. package/tabs-nav/NavTabs.stories.tsx +172 -0
  276. package/tabs-nav/NavTabs.test.js +82 -0
  277. package/tabs-nav/Tab.d.ts +4 -0
  278. package/tabs-nav/Tab.js +128 -0
  279. package/tabs-nav/types.d.ts +53 -0
  280. package/tabs-nav/types.js +5 -0
  281. package/tag/Tag.d.ts +4 -0
  282. package/tag/Tag.js +183 -0
  283. package/tag/Tag.stories.tsx +142 -0
  284. package/tag/Tag.test.js +60 -0
  285. package/tag/types.d.ts +69 -0
  286. package/tag/types.js +5 -0
  287. package/text-input/Icons.d.ts +8 -0
  288. package/text-input/Icons.js +60 -0
  289. package/text-input/Suggestion.d.ts +4 -0
  290. package/text-input/Suggestion.js +84 -0
  291. package/text-input/Suggestions.d.ts +4 -0
  292. package/text-input/Suggestions.js +134 -0
  293. package/text-input/TextInput.d.ts +4 -0
  294. package/text-input/TextInput.js +673 -0
  295. package/text-input/TextInput.stories.tsx +501 -0
  296. package/text-input/TextInput.test.js +1724 -0
  297. package/text-input/types.d.ts +197 -0
  298. package/text-input/types.js +5 -0
  299. package/textarea/Textarea.d.ts +4 -0
  300. package/{dist/new-textarea/NewTextarea.js → textarea/Textarea.js} +52 -144
  301. package/textarea/Textarea.stories.jsx +157 -0
  302. package/textarea/Textarea.test.js +437 -0
  303. package/textarea/types.d.ts +137 -0
  304. package/textarea/types.js +5 -0
  305. package/toggle-group/ToggleGroup.d.ts +4 -0
  306. package/{dist/toggle-group → toggle-group}/ToggleGroup.js +36 -148
  307. package/toggle-group/ToggleGroup.stories.tsx +173 -0
  308. package/toggle-group/ToggleGroup.test.js +156 -0
  309. package/toggle-group/types.d.ts +105 -0
  310. package/toggle-group/types.js +5 -0
  311. package/typography/Typography.d.ts +4 -0
  312. package/typography/Typography.js +131 -0
  313. package/typography/Typography.stories.tsx +198 -0
  314. package/typography/types.d.ts +18 -0
  315. package/typography/types.js +5 -0
  316. package/useTheme.d.ts +2 -0
  317. package/{dist/useTheme.js → useTheme.js} +2 -2
  318. package/useTranslatedLabels.d.ts +2 -0
  319. package/useTranslatedLabels.js +20 -0
  320. package/wizard/Wizard.d.ts +4 -0
  321. package/wizard/Wizard.js +285 -0
  322. package/wizard/Wizard.stories.tsx +233 -0
  323. package/wizard/Wizard.test.js +141 -0
  324. package/wizard/types.d.ts +65 -0
  325. package/wizard/types.js +5 -0
  326. package/README.md +0 -66
  327. package/babel.config.js +0 -8
  328. package/dist/BackgroundColorContext.js +0 -46
  329. package/dist/ThemeContext.js +0 -248
  330. package/dist/accordion/Accordion.js +0 -353
  331. package/dist/accordion-group/AccordionGroup.js +0 -186
  332. package/dist/alert/index.d.ts +0 -51
  333. package/dist/badge/Badge.js +0 -63
  334. package/dist/box/Box.js +0 -156
  335. package/dist/button/Button.js +0 -238
  336. package/dist/card/Card.js +0 -254
  337. package/dist/checkbox/Checkbox.js +0 -300
  338. package/dist/checkbox/Checkbox.stories.js +0 -144
  339. package/dist/checkbox/readme.md +0 -116
  340. package/dist/chip/Chip.js +0 -265
  341. package/dist/common/RequiredComponent.js +0 -40
  342. package/dist/date/Date.js +0 -379
  343. package/dist/date/Date.stories.js +0 -205
  344. package/dist/date/readme.md +0 -73
  345. package/dist/dialog/Dialog.js +0 -218
  346. package/dist/dropdown/Dropdown.js +0 -544
  347. package/dist/file-input/FileInput.js +0 -644
  348. package/dist/file-input/FileItem.js +0 -280
  349. package/dist/file-input/index.d.ts +0 -81
  350. package/dist/footer/Footer.js +0 -395
  351. package/dist/footer/Footer.stories.js +0 -94
  352. package/dist/footer/dxc_logo.svg +0 -15
  353. package/dist/footer/readme.md +0 -41
  354. package/dist/header/Header.js +0 -403
  355. package/dist/header/Header.stories.js +0 -176
  356. package/dist/header/close_icon.svg +0 -1
  357. package/dist/header/dxc_logo_black.svg +0 -8
  358. package/dist/header/hamb_menu_black.svg +0 -1
  359. package/dist/header/hamb_menu_white.svg +0 -1
  360. package/dist/header/readme.md +0 -33
  361. package/dist/input-text/InputText.js +0 -707
  362. package/dist/input-text/InputText.stories.js +0 -209
  363. package/dist/input-text/error.svg +0 -1
  364. package/dist/input-text/readme.md +0 -91
  365. package/dist/layout/ApplicationLayout.js +0 -331
  366. package/dist/layout/facebook.svg +0 -45
  367. package/dist/layout/linkedin.svg +0 -50
  368. package/dist/layout/twitter.svg +0 -53
  369. package/dist/link/Link.js +0 -237
  370. package/dist/link/readme.md +0 -51
  371. package/dist/main.d.ts +0 -8
  372. package/dist/new-date/NewDate.js +0 -400
  373. package/dist/new-date/index.d.ts +0 -95
  374. package/dist/new-input-text/NewInputText.js +0 -971
  375. package/dist/new-input-text/index.d.ts +0 -135
  376. package/dist/new-select/NewSelect.js +0 -836
  377. package/dist/new-select/index.d.ts +0 -53
  378. package/dist/new-textarea/index.d.ts +0 -117
  379. package/dist/number/Number.js +0 -136
  380. package/dist/number/index.d.ts +0 -113
  381. package/dist/paginator/Paginator.js +0 -289
  382. package/dist/paginator/images/next.svg +0 -3
  383. package/dist/paginator/images/nextPage.svg +0 -3
  384. package/dist/paginator/images/previous.svg +0 -3
  385. package/dist/paginator/images/previousPage.svg +0 -3
  386. package/dist/paginator/readme.md +0 -50
  387. package/dist/password/index.d.ts +0 -94
  388. package/dist/password/styles.css +0 -3
  389. package/dist/progress-bar/ProgressBar.js +0 -242
  390. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  391. package/dist/progress-bar/readme.md +0 -63
  392. package/dist/radio/Radio.js +0 -209
  393. package/dist/radio/Radio.stories.js +0 -166
  394. package/dist/radio/readme.md +0 -70
  395. package/dist/resultsetTable/ResultsetTable.js +0 -358
  396. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  397. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  398. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  399. package/dist/select/Select.js +0 -549
  400. package/dist/sidenav/Sidenav.js +0 -179
  401. package/dist/slider/Slider.js +0 -394
  402. package/dist/slider/Slider.stories.js +0 -241
  403. package/dist/slider/readme.md +0 -64
  404. package/dist/spinner/Spinner.js +0 -381
  405. package/dist/spinner/Spinner.stories.js +0 -183
  406. package/dist/spinner/readme.md +0 -65
  407. package/dist/switch/Switch.js +0 -222
  408. package/dist/switch/Switch.stories.js +0 -134
  409. package/dist/switch/readme.md +0 -133
  410. package/dist/tabs/Tabs.js +0 -343
  411. package/dist/tabs/Tabs.stories.js +0 -130
  412. package/dist/tabs/readme.md +0 -78
  413. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  414. package/dist/tabs-for-sections/readme.md +0 -78
  415. package/dist/tag/Tag.js +0 -282
  416. package/dist/textarea/Textarea.js +0 -264
  417. package/dist/toggle/Toggle.js +0 -220
  418. package/dist/toggle/Toggle.stories.js +0 -297
  419. package/dist/toggle/readme.md +0 -80
  420. package/dist/upload/Upload.js +0 -205
  421. package/dist/upload/Upload.stories.js +0 -72
  422. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -139
  423. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  424. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  425. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  426. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  427. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  428. package/dist/upload/file-upload/FileToUpload.js +0 -184
  429. package/dist/upload/file-upload/audio-icon.svg +0 -4
  430. package/dist/upload/file-upload/close.svg +0 -4
  431. package/dist/upload/file-upload/file-icon.svg +0 -4
  432. package/dist/upload/file-upload/video-icon.svg +0 -4
  433. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  434. package/dist/upload/readme.md +0 -37
  435. package/dist/upload/transaction/Transaction.js +0 -175
  436. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  437. package/dist/upload/transaction/audio-icon.svg +0 -4
  438. package/dist/upload/transaction/error-icon.svg +0 -4
  439. package/dist/upload/transaction/file-icon-err.svg +0 -4
  440. package/dist/upload/transaction/file-icon.svg +0 -4
  441. package/dist/upload/transaction/image-icon-err.svg +0 -4
  442. package/dist/upload/transaction/image-icon.svg +0 -4
  443. package/dist/upload/transaction/success-icon.svg +0 -4
  444. package/dist/upload/transaction/video-icon-err.svg +0 -4
  445. package/dist/upload/transaction/video-icon.svg +0 -4
  446. package/dist/upload/transactions/Transactions.js +0 -138
  447. package/dist/wizard/Wizard.js +0 -411
  448. package/dist/wizard/invalid_icon.svg +0 -5
  449. package/dist/wizard/valid_icon.svg +0 -5
  450. package/dist/wizard/validation-wrong.svg +0 -6
  451. package/test/Accordion.test.js +0 -33
  452. package/test/AccordionGroup.test.js +0 -125
  453. package/test/Alert.test.js +0 -53
  454. package/test/Box.test.js +0 -10
  455. package/test/Button.test.js +0 -18
  456. package/test/Card.test.js +0 -30
  457. package/test/Checkbox.test.js +0 -45
  458. package/test/Chip.test.js +0 -25
  459. package/test/Date.test.js +0 -393
  460. package/test/Dialog.test.js +0 -23
  461. package/test/Dropdown.test.js +0 -145
  462. package/test/FileInput.test.js +0 -201
  463. package/test/Footer.test.js +0 -99
  464. package/test/Header.test.js +0 -39
  465. package/test/Heading.test.js +0 -35
  466. package/test/InputText.test.js +0 -240
  467. package/test/Link.test.js +0 -43
  468. package/test/NewDate.test.js +0 -232
  469. package/test/NewInputText.test.js +0 -734
  470. package/test/NewTextarea.test.js +0 -195
  471. package/test/Number.test.js +0 -257
  472. package/test/Paginator.test.js +0 -177
  473. package/test/Password.test.js +0 -83
  474. package/test/ProgressBar.test.js +0 -35
  475. package/test/Radio.test.js +0 -37
  476. package/test/ResultsetTable.test.js +0 -329
  477. package/test/Select.test.js +0 -212
  478. package/test/Sidenav.test.js +0 -45
  479. package/test/Slider.test.js +0 -82
  480. package/test/Spinner.test.js +0 -32
  481. package/test/Switch.test.js +0 -45
  482. package/test/Table.test.js +0 -36
  483. package/test/Tabs.test.js +0 -109
  484. package/test/TabsForSections.test.js +0 -34
  485. package/test/Tag.test.js +0 -32
  486. package/test/TextArea.test.js +0 -52
  487. package/test/ToggleGroup.test.js +0 -85
  488. package/test/Upload.test.js +0 -60
  489. package/test/Wizard.test.js +0 -130
  490. package/test/mocks/pngMock.js +0 -1
  491. package/test/mocks/svgMock.js +0 -1
@@ -1,18 +1,11 @@
1
1
  "use strict";
2
2
 
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
3
  Object.defineProperty(exports, "__esModule", {
6
4
  value: true
7
5
  });
8
- exports.typeface = exports.responsiveSizes = exports.spaces = exports.componentTokens = exports.globalTokens = void 0;
9
-
10
- var _dxc_logo_black = _interopRequireDefault(require("../header/dxc_logo_black.svg"));
11
-
12
- var _dxc_logo = _interopRequireDefault(require("../footer/dxc_logo.svg"));
13
-
6
+ exports.typeface = exports.spaces = exports.responsiveSizes = exports.globalTokens = exports.defaultTranslatedComponentLabels = exports.componentTokens = void 0;
14
7
  var globalTokens = {
15
- // Color
8
+ // Color
16
9
  inherit: "inherit",
17
10
  transparent: "transparent",
18
11
  hal_white: "#ffffff",
@@ -26,12 +19,15 @@ var globalTokens = {
26
19
  color_grey_800: "#4d4d4d",
27
20
  color_grey_600: "#808080",
28
21
  color_grey_50: "#fafafa",
22
+ color_grey_a_100: "#0000000d",
23
+ color_grey_a_300: "#00000033",
29
24
  hal_purple_l_95: "#f2eafa",
30
25
  hal_purple_l_90: "#e5d5f6",
31
26
  hal_purple_l_65: "#a46ede",
32
27
  hal_purple_s_38: "#5f249f",
33
28
  hal_purple_d_30: "#4b1c7d",
34
29
  hal_purple_d_20: "#321353",
30
+ hal_purple_d_70: "#9A6BB2",
35
31
  color_purple_600: "#7D2FD0",
36
32
  color_purple_300: "#cbacec",
37
33
  hal_blue_l_95: "#e6f4ff",
@@ -40,6 +36,7 @@ var globalTokens = {
40
36
  hal_blue_l_45: "#0086e6",
41
37
  hal_blue_s_35: "#0067b3",
42
38
  hal_blue_d_20: "#003c66",
39
+ color_blue_200: "#cceaff",
43
40
  color_blue_500: "#33AAFF",
44
41
  color_blue_50: "#f5fbff",
45
42
  hal_red_l_95: "#ffe6e9",
@@ -50,6 +47,7 @@ var globalTokens = {
50
47
  hal_red_d_20: "#65010e",
51
48
  color_red_700: "#ffccd3",
52
49
  color_red_50: "#FFF5F6",
50
+ color_red_600: "#fe0123",
53
51
  hal_green_l_95: "#eafaef",
54
52
  hal_green_l_80: "#acecbe",
55
53
  hal_green_s_39: "#24a148",
@@ -97,7 +95,7 @@ var globalTokens = {
97
95
  type_sans: "Open Sans, sans-serif",
98
96
  type_scale_root: "16px",
99
97
  type_scale_08: "3.75rem",
100
- type_scale_07: "3rem",
98
+ type_scale_07: "2.5rem",
101
99
  type_scale_06: "2rem",
102
100
  type_scale_05: "1.5rem",
103
101
  type_scale_04: "1.25rem",
@@ -112,7 +110,7 @@ var globalTokens = {
112
110
  type_normal: "normal",
113
111
  type_spacing_tight_02: "-0.05em",
114
112
  type_spacing_tight_01: "-0.025em",
115
- type_spacing_normal: "0",
113
+ type_spacing_normal: "0em",
116
114
  type_spacing_wide_01: "0.025em",
117
115
  type_spacing_wide_02: "0.05em",
118
116
  type_spacing_wide_03: "0.1em",
@@ -162,7 +160,6 @@ exports.globalTokens = globalTokens;
162
160
  var componentTokens = {
163
161
  accordion: {
164
162
  backgroundColor: globalTokens.hal_white,
165
- disabledBackgroundColor: globalTokens.transparent,
166
163
  hoverBackgroundColor: globalTokens.hal_purple_l_95,
167
164
  arrowColor: globalTokens.hal_purple_s_38,
168
165
  disabledArrowColor: globalTokens.hal_grey_l_60,
@@ -182,13 +179,13 @@ var componentTokens = {
182
179
  titleLabelFontStyle: globalTokens.type_normal,
183
180
  titleLabelFontColor: globalTokens.hal_black,
184
181
  disabledTitleLabelFontColor: globalTokens.hal_grey_l_60,
185
- titleLabelPaddingLeft: "0px",
186
- titleLabelPaddingRight: "16px",
187
182
  titleLabelPaddingTop: "0px",
188
183
  titleLabelPaddingBottom: "0px",
184
+ titleLabelPaddingLeft: "0px",
185
+ titleLabelPaddingRight: "16px",
186
+ focusBorderColor: globalTokens.hal_blue_l_50,
189
187
  focusBorderStyle: "solid",
190
188
  focusBorderThickness: "2px",
191
- focusBorderColor: globalTokens.hal_blue_l_50,
192
189
  borderRadius: "4px",
193
190
  boxShadowOffsetX: "0px",
194
191
  boxShadowOffsetY: "6px",
@@ -242,7 +239,7 @@ var componentTokens = {
242
239
  successBackgroundColor: globalTokens.hal_green_l_95,
243
240
  warningBackgroundColor: globalTokens.hal_yellow_l_95,
244
241
  errorBackgroundColor: globalTokens.hal_red_l_95,
245
- hoverActionBackgroundColor: "#0000000D",
242
+ hoverActionBackgroundColor: globalTokens.color_grey_a_100,
246
243
  activeActionBackgroundColor: "#0000001A",
247
244
  focusActionBorderColor: globalTokens.hal_blue_l_50,
248
245
  overlayColor: "#000000B3"
@@ -263,12 +260,21 @@ var componentTokens = {
263
260
  oneShadowDepthShadowOffsetY: "3px",
264
261
  oneShadowDepthShadowBlur: "6px",
265
262
  oneShadowDepthShadowSpread: "0px",
266
- oneShadowDepthShadowColor: "#00000033",
263
+ oneShadowDepthShadowColor: globalTokens.color_grey_a_300,
267
264
  twoShadowDepthShadowOffsetX: "0px",
268
265
  twoShadowDepthShadowOffsetY: "3px",
269
266
  twoShadowDepthShadowBlur: "10px",
270
267
  twoShadowDepthShadowSpread: "0px",
271
- twoShadowDepthShadowColor: "#00000033"
268
+ twoShadowDepthShadowColor: globalTokens.color_grey_a_300
269
+ },
270
+ bulletedList: {
271
+ fontColor: globalTokens.hal_black,
272
+ fontColorOnDark: globalTokens.hal_white,
273
+ bulletIconHeight: "1.5rem",
274
+ bulletIconWidth: "1.5rem",
275
+ bulletHeight: "5px",
276
+ bulletWidth: "5px",
277
+ bulletMarginRight: "0.5rem"
272
278
  },
273
279
  button: {
274
280
  labelFontLineHeight: globalTokens.type_leading_normal,
@@ -348,7 +354,7 @@ var componentTokens = {
348
354
  backgroundColorChecked: globalTokens.hal_blue_s_35,
349
355
  backgroundColorCheckedOnDark: globalTokens.hal_grey_l_90,
350
356
  hoverBackgroundColorChecked: globalTokens.hal_blue_d_20,
351
- hoverBackgroundColorCheckedOnDark: global.hal_white,
357
+ hoverBackgroundColorCheckedOnDark: globalTokens.hal_white,
352
358
  disabledBackgroundColorChecked: globalTokens.hal_grey_l_60,
353
359
  disabledBackgroundColorCheckedOnDark: globalTokens.color_grey_800,
354
360
  borderColor: globalTokens.hal_blue_s_35,
@@ -395,31 +401,14 @@ var componentTokens = {
395
401
  disabledIconColor: globalTokens.hal_grey_l_60,
396
402
  focusColor: globalTokens.hal_blue_l_50
397
403
  },
398
- date: {
399
- pickerSelectedDateBackgroundColor: globalTokens.purple,
400
- pickerSelectedDateColor: globalTokens.hal_white,
401
- pickerBackgroundColor: globalTokens.hal_white,
402
- pickerFontColor: globalTokens.hal_black,
403
- pickerHoverDateBackgroundColor: globalTokens.lighterPurple,
404
- pickerHoverDateFontColor: globalTokens.hal_black,
405
- pickerActualDateColor: globalTokens.lightGrey,
406
- pickerYearColor: globalTokens.hal_black,
407
- pickerMonthColor: globalTokens.hal_black,
408
- pickerWeekLabelColor: globalTokens.hal_black,
409
- pickerBackgroundColorMonthArrows: globalTokens.transparent,
410
- focusColor: globalTokens.hal_blue_l_50,
411
- fontFamily: globalTokens.type_sans,
412
- pickerHeight: "316px",
413
- pickerWidth: "290px"
414
- },
415
- newDate: {
404
+ dateInput: {
416
405
  pickerFontFamily: globalTokens.type_sans,
417
406
  pickerBackgroundColor: globalTokens.hal_white,
418
407
  pickerHoverDateFontColor: globalTokens.hal_black,
419
408
  pickerHoverDateBackgroundColor: globalTokens.hal_purple_l_90,
420
409
  pickerSelectedDateColor: globalTokens.hal_white,
421
410
  pickerSelectedDateBackgroundColor: globalTokens.hal_purple_s_38,
422
- pickerActualDateFontColor: globalTokens.hal_grey_l_60,
411
+ pickerActualDateFontColor: globalTokens.hal_black,
423
412
  pickerYearFontColor: globalTokens.hal_black,
424
413
  pickerMonthFontColor: globalTokens.hal_black,
425
414
  pickerWeekFontColor: globalTokens.hal_black,
@@ -427,7 +416,8 @@ var componentTokens = {
427
416
  pickerMonthArrowsBackgroundColor: globalTokens.transparent,
428
417
  pickerFocusColor: globalTokens.hal_blue_l_50,
429
418
  pickerHeight: "316px",
430
- pickerWidth: "290px"
419
+ // not referenced in the actual implementation
420
+ pickerWidth: "292px"
431
421
  },
432
422
  dialog: {
433
423
  overlayColor: globalTokens.hal_black,
@@ -446,7 +436,10 @@ var componentTokens = {
446
436
  boxShadowOffsetY: "1px",
447
437
  boxShadowBlur: "3px",
448
438
  boxShadowColor: "rgba(0, 0, 0, 0.2)",
449
- overlayOpacity: "0.7"
439
+ overlayOpacity: "0.7",
440
+ fontFamily: globalTokens.type_sans,
441
+ fontSize: globalTokens.type_scale_03,
442
+ fontWeight: globalTokens.type_regular
450
443
  },
451
444
  dropdown: {
452
445
  buttonBackgroundColor: globalTokens.hal_white,
@@ -505,15 +498,14 @@ var componentTokens = {
505
498
  disabledDropLabelFontColor: globalTokens.hal_grey_l_60,
506
499
  focusDropBorderColor: globalTokens.hal_blue_l_50,
507
500
  disabledDropBorderColor: globalTokens.hal_grey_l_60,
508
- focusDropBackgroundColor: globalTokens.color_blue_50,
509
- hoverFileItemIconBackgroundColor: globalTokens.hal_grey_l_95,
501
+ dragoverDropBackgroundColor: globalTokens.color_blue_50,
510
502
  activeFileItemIconBackgrounColor: globalTokens.hal_grey_l_80,
511
503
  errorFileItemBorderColor: globalTokens.hal_red_s_41,
512
504
  errorFileItemBackgroundColor: globalTokens.color_red_50,
513
- errorFileItemIconBackgroundColor: globalTokens.color_red_700,
505
+ errorFilePreviewBackgroundColor: globalTokens.color_red_700,
514
506
  errorFileItemIconColor: globalTokens.hal_red_s_41,
515
507
  fileItemIconBackgroundColor: globalTokens.hal_grey_l_95,
516
- fileItemIconColor: globalTokens.color_grey_600,
508
+ deleteFileItemColor: globalTokens.hal_black,
517
509
  errorMessageFontColor: globalTokens.hal_red_s_41,
518
510
  labelFontFamily: globalTokens.type_sans,
519
511
  labelFontSize: globalTokens.type_scale_02,
@@ -533,13 +525,19 @@ var componentTokens = {
533
525
  errorMessageFontFamily: globalTokens.type_sans,
534
526
  errorMessageFontSize: globalTokens.type_scale_01,
535
527
  errorMessageFontWeight: globalTokens.type_regular,
536
- errorMessageLineHeight: globalTokens.type_scale_05,
528
+ errorMessageLineHeight: globalTokens.type_leading_normal,
537
529
  dropBorderThickness: globalTokens.border_width_1,
538
530
  dropBorderStyle: globalTokens.border_dashed,
539
531
  dropBorderRadius: globalTokens.border_radius_large,
540
532
  fileItemBorderThickness: globalTokens.border_width_1,
541
533
  fileItemBorderStyle: globalTokens.border_solid,
542
- fileItemBorderRadius: globalTokens.border_radius_medium
534
+ fileItemBorderRadius: globalTokens.border_radius_medium,
535
+ hoverDeleteFileItemBackgroundColor: globalTokens.color_grey_a_100,
536
+ activeDeleteFileItemBackgroundColor: globalTokens.color_grey_a_300,
537
+ focusDeleteFileItemBorderColor: globalTokens.hal_blue_l_50,
538
+ filePreviewBackgroundColor: globalTokens.hal_grey_l_95,
539
+ filePreviewIconColor: globalTokens.color_grey_600,
540
+ errorFilePreviewIconColor: globalTokens.hal_red_s_41
543
541
  },
544
542
  footer: {
545
543
  height: "124px",
@@ -559,7 +557,7 @@ var componentTokens = {
559
557
  copyrightFontStyle: globalTokens.type_normal,
560
558
  copyrightFontWeight: globalTokens.type_regular,
561
559
  copyrightFontColor: globalTokens.hal_white,
562
- logo: _dxc_logo["default"],
560
+ logo: "",
563
561
  logoHeight: "32px",
564
562
  logoWidth: "auto",
565
563
  socialLinksSize: "24px",
@@ -577,8 +575,8 @@ var componentTokens = {
577
575
  hamburguerTextTransform: globalTokens.type_uppercase,
578
576
  hamburguerIconColor: globalTokens.hal_black,
579
577
  hamburguerHoverColor: globalTokens.mediumGreyBlack,
580
- logo: _dxc_logo_black["default"],
581
- logoResponsive: _dxc_logo_black["default"],
578
+ logo: "",
579
+ logoResponsive: "",
582
580
  logoHeight: "40px",
583
581
  logoWidth: "auto",
584
582
  menuBackgroundColor: globalTokens.hal_white,
@@ -595,194 +593,51 @@ var componentTokens = {
595
593
  paddingLeft: "24px",
596
594
  underlinedColor: globalTokens.hal_black,
597
595
  underlinedThickness: "2px",
598
- underlinedStyle: "solid"
596
+ underlinedStyle: "solid",
597
+ contentColor: globalTokens.hal_black,
598
+ contentColorOnDark: globalTokens.hal_white
599
599
  },
600
600
  heading: {
601
601
  level1FontColor: globalTokens.inherit,
602
602
  level1FontFamily: globalTokens.type_sans,
603
- level1FontSize: globalTokens.type_scale_08,
603
+ level1FontSize: globalTokens.type_scale_07,
604
604
  level1FontStyle: globalTokens.type_normal,
605
- level1FontWeight: globalTokens.type_regular,
605
+ level1FontWeight: globalTokens.type_semibold,
606
606
  level1LineHeight: globalTokens.type_leading_compact_01,
607
607
  level1LetterSpacing: globalTokens.type_spacing_tight_01,
608
608
  level2FontColor: globalTokens.inherit,
609
609
  level2FontFamily: globalTokens.type_sans,
610
- level2FontSize: globalTokens.type_scale_07,
610
+ level2FontSize: globalTokens.type_scale_05,
611
611
  level2FontStyle: globalTokens.type_normal,
612
- level2FontWeight: globalTokens.type_regular,
612
+ level2FontWeight: globalTokens.type_semibold,
613
613
  level2LineHeight: globalTokens.type_leading_normal,
614
614
  level2LetterSpacing: globalTokens.type_spacing_normal,
615
615
  level3FontColor: globalTokens.inherit,
616
616
  level3FontFamily: globalTokens.type_sans,
617
- level3FontSize: globalTokens.type_scale_06,
617
+ level3FontSize: globalTokens.type_scale_04,
618
618
  level3FontStyle: globalTokens.type_normal,
619
- level3FontWeight: globalTokens.type_regular,
619
+ level3FontWeight: globalTokens.type_semibold,
620
620
  level3LineHeight: globalTokens.type_leading_compact_01,
621
621
  level3LetterSpacing: globalTokens.type_spacing_wide_01,
622
622
  level4FontColor: globalTokens.inherit,
623
623
  level4FontFamily: globalTokens.type_sans,
624
- level4FontSize: globalTokens.type_scale_05,
624
+ level4FontSize: globalTokens.type_scale_03,
625
625
  level4FontStyle: globalTokens.type_normal,
626
- level4FontWeight: globalTokens.type_regular,
626
+ level4FontWeight: globalTokens.type_semibold,
627
627
  level4LineHeight: globalTokens.type_leading_normal,
628
628
  level4LetterSpacing: globalTokens.type_spacing_normal,
629
629
  level5FontColor: globalTokens.inherit,
630
630
  level5FontFamily: globalTokens.type_sans,
631
- level5FontSize: globalTokens.type_scale_04,
631
+ level5FontSize: globalTokens.type_scale_02,
632
632
  level5FontStyle: globalTokens.type_normal,
633
- level5FontWeight: globalTokens.type_regular,
633
+ level5FontWeight: globalTokens.type_semibold,
634
634
  level5LineHeight: globalTokens.type_leading_normal,
635
635
  level5LetterSpacing: globalTokens.type_spacing_wide_01
636
636
  },
637
- inputText: {
638
- fontFamily: globalTokens.type_sans,
639
- assistiveTextFontColor: globalTokens.black,
640
- assistiveTextFontColorOnDark: globalTokens.white,
641
- assistiveTextFontSize: globalTokens.type_scale_01,
642
- assistiveTextFontStyle: globalTokens.type_normal,
643
- assistiveTextFontWeight: globalTokens.type_regular,
644
- disabledColor: globalTokens.lighterBlack,
645
- disabledColorOnDark: "#575757",
646
- errorColor: globalTokens.red,
647
- errorColorOnDark: globalTokens.hal_red_l_60,
648
- optionBackgroundColor: globalTokens.white,
649
- optionBorderColor: globalTokens.black,
650
- optionBorderThickness: "0px",
651
- optionBorderStyle: "solid",
652
- optionFontColor: globalTokens.black,
653
- optionFontColorOnDark: globalTokens.white,
654
- optionFontSize: globalTokens.type_scale_03,
655
- optionFontStyle: globalTokens.type_normal,
656
- optionFontWeight: globalTokens.type_regular,
657
- optionPaddingBottom: "6px",
658
- optionPaddingTop: "6px",
659
- scrollBarThumbColor: globalTokens.darkGrey,
660
- scrollBarTrackColor: globalTokens.lightGrey,
661
- hoverOptionColor: globalTokens.black,
662
- hoverOptionBackgroundColor: globalTokens.lightWhite,
663
- hoverOptionBackgroundColorOnDark: globalTokens.mediumGrey,
664
- selectedOptionBackgroundColor: globalTokens.lightGrey,
665
- selectedOptionBackgroundColorOnDark: globalTokens.lightGrey,
666
- labelFontColor: globalTokens.black,
667
- labelFontColorOnDark: globalTokens.white,
668
- labelFontSize: globalTokens.type_scale_03,
669
- labelFontStyle: globalTokens.type_normal,
670
- labelFontWeight: globalTokens.type_regular,
671
- valueFontColor: globalTokens.black,
672
- valueFontColorOnDark: globalTokens.white,
673
- valueFontSize: globalTokens.type_scale_03,
674
- valueFontStyle: globalTokens.type_normal,
675
- valueFontWeight: globalTokens.type_regular,
676
- prefixIconColor: globalTokens.black,
677
- prefixIconColorOnDark: globalTokens.white,
678
- prefixLabelFontColor: globalTokens.black,
679
- prefixLabelFontColorOnDark: globalTokens.white,
680
- prefixLabelFontSize: globalTokens.type_scale_03,
681
- prefixLabelFontStyle: globalTokens.type_normal,
682
- prefixLabelFontWeight: globalTokens.type_regular,
683
- suffixIconColor: globalTokens.black,
684
- suffixIconColorOnDark: globalTokens.white,
685
- suffixLabelFontColor: globalTokens.black,
686
- suffixLabelFontColorOnDark: globalTokens.white,
687
- suffixLabelFontSize: globalTokens.type_scale_03,
688
- suffixLabelFontStyle: globalTokens.type_normal,
689
- suffixLabelFontWeight: globalTokens.type_regular,
690
- underlineColor: globalTokens.black,
691
- underlineColorOnDark: globalTokens.white,
692
- underlineFocusColor: globalTokens.black,
693
- underlineFocusColorOnDark: globalTokens.white,
694
- underlineThickness: "1px"
695
- },
696
- newInputText: {
697
- fontFamily: globalTokens.type_sans,
698
- enabledBorderColor: globalTokens.hal_black,
699
- enabledBorderColorOnDark: globalTokens.hal_white,
700
- hoverBorderColor: globalTokens.hal_purple_l_65,
701
- hoverBorderColorOnDark: globalTokens.hal_purple_l_65,
702
- focusBorderColor: globalTokens.hal_blue_l_50,
703
- focusBorderColorOnDark: globalTokens.hal_blue_l_50,
704
- disabledBorderColor: globalTokens.hal_grey_l_60,
705
- disabledBorderColorOnDark: globalTokens.hal_grey_l_60,
706
- disabledContainerFillColor: globalTokens.hal_grey_l_95,
707
- disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
708
- errorBorderColor: globalTokens.hal_red_s_41,
709
- errorBorderColorOnDark: globalTokens.hal_red_l_60,
710
- hoverErrorBorderColor: "#fe0123",
711
- hoverErrorBorderColorOnDark: "#fe677b",
712
- errorMessageColor: globalTokens.hal_red_s_41,
713
- errorMessageColorOnDark: globalTokens.hal_red_l_60,
714
- errorIconColor: globalTokens.hal_red_s_41,
715
- errorIconColorOnDark: globalTokens.hal_red_l_60,
716
- labelFontColor: globalTokens.hal_black,
717
- labelFontColorOnDark: globalTokens.hal_white,
718
- labelFontSize: globalTokens.type_scale_02,
719
- labelFontStyle: globalTokens.type_normal,
720
- labelFontWeight: globalTokens.type_semibold,
721
- labelLineHeight: globalTokens.type_leading_loose_01,
722
- disabledLabelFontColor: globalTokens.hal_grey_l_60,
723
- disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
724
- optionalLabelFontWeight: globalTokens.type_regular,
725
- helperTextFontColor: globalTokens.hal_black,
726
- helperTextFontColorOnDark: globalTokens.hal_white,
727
- helperTextFontSize: globalTokens.type_scale_01,
728
- helperTextFontStyle: globalTokens.type_normal,
729
- helperTextFontWeight: globalTokens.type_regular,
730
- helperTextLineHeight: globalTokens.type_leading_normal,
731
- disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
732
- disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
733
- prefixColor: globalTokens.hal_grey_s_40,
734
- prefixColorOnDark: globalTokens.hal_white,
735
- suffixColor: globalTokens.hal_grey_s_40,
736
- suffixColorOnDark: globalTokens.hal_white,
737
- disabledPrefixColor: globalTokens.hal_grey_l_75,
738
- disabledSuffixColor: globalTokens.hal_grey_l_75,
739
- disabledPrefixColorOnDark: globalTokens.hal_grey_l_60,
740
- disabledSuffixColorOnDark: globalTokens.hal_grey_l_60,
741
- placeholderFontColor: "#808080",
742
- placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
743
- disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
744
- disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
745
- valueFontColor: globalTokens.hal_black,
746
- valueFontColorOnDark: globalTokens.hal_white,
747
- valueFontSize: globalTokens.type_scale_03,
748
- valueFontStyle: globalTokens.type_normal,
749
- valueFontWeight: globalTokens.type_regular,
750
- disabledValueFontColor: globalTokens.hal_grey_l_60,
751
- disabledValueFontColorOnDark: globalTokens.hal_grey_l_60,
752
- actionIconColor: globalTokens.hal_black,
753
- actionIconColorOnDark: globalTokens.hal_white,
754
- disabledActionIconColor: globalTokens.hal_grey_l_60,
755
- disabledActionIconColorOnDark: globalTokens.hal_grey_l_60,
756
- hoverActionIconColor: globalTokens.hal_black,
757
- hoverActionIconColorOnDark: globalTokens.hal_white,
758
- focusActionIconColor: globalTokens.hal_black,
759
- focusActionIconColorOnDark: globalTokens.hal_white,
760
- activeActionIconColor: globalTokens.hal_black,
761
- activeActionIconColorOnDark: globalTokens.hal_black,
762
- actionBackgroundColor: globalTokens.transparent,
763
- actionBackgroundColorOnDark: globalTokens.transparent,
764
- disabledActionBackgroundColor: globalTokens.transparent,
765
- disabledActionBackgroundColorOnDark: globalTokens.transparent,
766
- hoverActionBackgroundColor: globalTokens.hal_grey_l_95,
767
- hoverActionBackgroundColorOnDark: globalTokens.hal_grey_s_40,
768
- focusActionBorderColor: globalTokens.hal_blue_l_50,
769
- focusActionBorderColorOnDark: globalTokens.hal_blue_l_50,
770
- activeActionBackgroundColor: globalTokens.hal_grey_l_80,
771
- activeActionBackgroundColorOnDark: globalTokens.hal_grey_l_60,
772
- listOptionFontColor: globalTokens.hal_black,
773
- listOptionFontSize: globalTokens.type_scale_03,
774
- listOptionFontStyle: globalTokens.type_normal,
775
- listOptionFontWeight: globalTokens.type_regular,
776
- systemMessageFontColor: globalTokens.hal_grey_s_40,
777
- errorMessageBorderColor: globalTokens.hal_red_s_41,
778
- errorMessageBackgroundColor: globalTokens.hal_red_l_95,
779
- hoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
780
- activeListOptionBackgroundColor: globalTokens.hal_grey_l_80
781
- },
782
637
  link: {
783
638
  fontColor: globalTokens.hal_blue_s_35,
784
639
  fontFamily: globalTokens.inherit,
785
- fontSize: globalTokens.type_scale_root,
640
+ fontSize: globalTokens.inherit,
786
641
  fontStyle: globalTokens.type_normal,
787
642
  fontWeight: globalTokens.type_regular,
788
643
  iconSize: "16px",
@@ -799,6 +654,13 @@ var componentTokens = {
799
654
  activeUnderlineColor: globalTokens.black,
800
655
  focusColor: globalTokens.hal_blue_l_50
801
656
  },
657
+ paragraph: {
658
+ fontColor: globalTokens.hal_black,
659
+ fontColorOnDark: globalTokens.hal_white,
660
+ display: "block",
661
+ fontSize: globalTokens.type_scale_03,
662
+ fontWeight: globalTokens.type_regular
663
+ },
802
664
  paginator: {
803
665
  backgroundColor: globalTokens.darkWhite,
804
666
  fontColor: globalTokens.hal_black,
@@ -807,15 +669,15 @@ var componentTokens = {
807
669
  fontStyle: globalTokens.type_normal,
808
670
  fontWeight: globalTokens.type_regular,
809
671
  fontTextTransform: "none",
810
- height: "64px",
811
- width: "100%",
672
+ verticalPadding: "0.75rem",
673
+ horizontalPadding: "2rem",
812
674
  marginRight: "40px",
813
675
  marginLeft: "20px",
814
676
  itemsPerPageSelectorMarginLeft: "0px",
815
- itemsPerPageSelectorMarginRight: "30px",
677
+ itemsPerPageSelectorMarginRight: "0.5rem",
816
678
  pageSelectorMarginRight: "30px",
817
679
  pageSelectorMarginLeft: "0px",
818
- totalItemsContainerMarginRight: "30px",
680
+ totalItemsContainerMarginRight: "2.5rem",
819
681
  totalItemsContainerMarginLeft: "0px"
820
682
  },
821
683
  progressBar: {
@@ -847,190 +709,162 @@ var componentTokens = {
847
709
  overlayColor: globalTokens.black,
848
710
  overlayOpacity: "0.8"
849
711
  },
850
- radio: {
851
- circleLabelSpacing: "10px",
852
- circleSize: "24px",
853
- color: globalTokens.black,
854
- colorOnDark: globalTokens.white,
855
- disabledColor: globalTokens.lighterBlack,
856
- disabledColorOnDark: "#575757",
857
- disabledFontColor: globalTokens.lighterBlack,
858
- disabledFontColorOnDark: "#575757",
859
- focusColor: globalTokens.hal_blue_l_50,
860
- focusColorOnDark: "#1682FF",
861
- fontColor: globalTokens.inherit,
862
- fontColorOnDark: globalTokens.white,
712
+ quickNav: {
713
+ fontColor: globalTokens.hal_grey_s_40,
714
+ hoverFontColor: globalTokens.hal_purple_d_70,
715
+ dividerBorderColor: globalTokens.hal_grey_l_75,
716
+ focusBorderColor: globalTokens.hal_blue_l_50,
717
+ focusBorderStyle: globalTokens.border_solid,
718
+ focusBorderThickness: globalTokens.border_width_2,
719
+ focusBorderRadius: globalTokens.border_width_2,
720
+ paddingTop: globalTokens.spacing_03,
721
+ paddingBottom: globalTokens.spacing_03,
722
+ paddingLeft: globalTokens.spacing_05,
723
+ paddingRight: globalTokens.spacing_05,
863
724
  fontFamily: globalTokens.type_sans,
864
- fontSize: globalTokens.type_scale_root,
725
+ fontSize: globalTokens.type_scale_02,
865
726
  fontStyle: globalTokens.type_normal,
866
727
  fontWeight: globalTokens.type_regular
867
728
  },
868
- select: {
729
+ radioGroup: {
869
730
  fontFamily: globalTokens.type_sans,
870
- assistiveTextFontColor: globalTokens.hal_black,
871
- assistiveTextFontColorOnDark: globalTokens.hal_white,
872
- assistiveTextFontSize: globalTokens.type_scale_01,
873
- assistiveTextFontStyle: globalTokens.type_normal,
874
- assistiveTextFontWeight: globalTokens.type_regular,
731
+ radioInputColor: globalTokens.hal_blue_l_45,
732
+ hoverRadioInputColor: globalTokens.hal_blue_s_35,
733
+ focusBorderColor: globalTokens.hal_blue_l_50,
734
+ activeRadioInputColor: globalTokens.hal_blue_d_20,
735
+ errorRadioInputColor: globalTokens.hal_red_s_41,
736
+ hoverErrorRadioInputColor: globalTokens.hal_red_d_30,
737
+ activeErrorRadioInputColor: globalTokens.hal_red_d_20,
738
+ readonlyRadioInputColor: globalTokens.hal_grey_l_60,
739
+ hoverReadonlyRadioInputColor: globalTokens.color_grey_600,
740
+ activeReadonlyRadioInputColor: globalTokens.hal_grey_s_40,
741
+ disabledRadioInputColor: globalTokens.hal_grey_l_60,
742
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
743
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
744
+ disabledRadioInputLabelFontColor: globalTokens.hal_grey_l_60,
745
+ errorMessageColor: globalTokens.hal_red_s_41,
875
746
  labelFontColor: globalTokens.hal_black,
876
- labelFontColorOnDark: globalTokens.hal_white,
877
- labelFontSize: globalTokens.type_scale_03,
747
+ labelFontSize: globalTokens.type_scale_02,
878
748
  labelFontStyle: globalTokens.type_normal,
879
- labelFontWeight: globalTokens.type_regular,
880
- disabledColor: globalTokens.lighterBlack,
881
- disabledColorOnDark: "#575757",
882
- errorColor: globalTokens.red,
883
- errorColorOnDark: globalTokens.hal_red_l_60,
884
- optionBackgroundColor: globalTokens.hal_white,
885
- optionBorderColor: globalTokens.hal_black,
886
- optionBorderThickness: "0px",
887
- optionBorderStyle: "solid",
888
- optionFontColor: globalTokens.hal_black,
889
- optionFontColorOnDark: globalTokens.hal_white,
890
- optionFontSize: globalTokens.type_scale_root,
891
- optionFontStyle: globalTokens.type_normal,
892
- optionFontWeight: globalTokens.type_regular,
893
- optionPaddingBottom: "6px",
894
- optionPaddingTop: "6px",
895
- scrollBarThumbColor: globalTokens.hal_grey_s_40,
896
- scrollBarTrackColor: globalTokens.lightGrey,
897
- optionIconColor: globalTokens.hal_black,
898
- optionIconColorOnDark: globalTokens.hal_white,
899
- optionIconSpacing: "12px",
900
- optionIconSize: "20px",
901
- optionCheckboxSpacing: "12px",
902
- hoverOptionBackgroundColor: globalTokens.hal_grey_l_95,
903
- hoverOptionBackgroundColorOnDark: globalTokens.hal_grey_l_95,
904
- activeOptionBackgroundColor: globalTokens.hal_grey_l_80,
905
- activeOptionBackgroundColorOnDark: globalTokens.hal_grey_l_80,
906
- selectedOptionBackgroundColor: globalTokens.lightGrey,
907
- selectedOptionBackgroundColorOnDark: globalTokens.lightGrey,
908
- underlineColor: globalTokens.hal_black,
909
- underlineColorOnDark: globalTokens.hal_white,
910
- underlineFocusColor: globalTokens.hal_black,
911
- underlineFocusColorOnDark: globalTokens.hal_white,
912
- underlineThickness: "1px",
913
- valueFontColor: globalTokens.hal_black,
914
- valueFontColorOnDark: globalTokens.hal_white,
915
- valueFontSize: globalTokens.type_scale_03,
916
- valueFontStyle: globalTokens.type_normal,
917
- valueFontWeight: globalTokens.type_regular,
918
- valueIconColor: globalTokens.hal_black,
919
- valueIconColorOnDark: globalTokens.hal_white,
920
- valueIconSize: "20px",
921
- valueIconSpacing: "12px",
922
- arrowColor: globalTokens.hal_black,
923
- arrowColorOnDark: globalTokens.hal_white,
924
- focusColor: globalTokens.hal_blue_l_50,
925
- focusColorOnDark: globalTokens.hal_blue_l_50
749
+ labelFontWeight: globalTokens.type_semibold,
750
+ labelLineHeight: globalTokens.type_leading_loose_01,
751
+ optionalLabelFontWeight: globalTokens.type_regular,
752
+ helperTextFontColor: globalTokens.hal_black,
753
+ helperTextFontSize: globalTokens.type_scale_01,
754
+ helperTextFontStyle: globalTokens.type_normal,
755
+ helperTextFontWeight: globalTokens.type_regular,
756
+ helperTextLineHeight: globalTokens.type_leading_normal,
757
+ radioInputLabelFontColor: globalTokens.hal_black,
758
+ radioInputLabelFontSize: globalTokens.type_scale_02,
759
+ radioInputLabelFontStyle: globalTokens.type_normal,
760
+ radioInputLabelFontWeight: globalTokens.type_regular,
761
+ radioInputLabelLineHeight: globalTokens.type_leading_loose_01,
762
+ groupLabelMargin: globalTokens.spacing_03,
763
+ radioInputLabelMargin: globalTokens.spacing_03,
764
+ groupVerticalGutter: globalTokens.spacing_02,
765
+ groupHorizontalGutter: globalTokens.spacing_07
926
766
  },
927
- newSelect: {
767
+ select: {
928
768
  fontFamily: globalTokens.type_sans,
929
- enabledBorderColor: globalTokens.hal_black,
930
- enabledBorderColorOnDark: globalTokens.hal_white,
931
- hoverBorderColor: globalTokens.hal_purple_l_65,
932
- hoverBorderColorOnDark: globalTokens.hal_purple_l_65,
933
- focusBorderColor: globalTokens.hal_blue_l_50,
934
- focusBorderColorOnDark: globalTokens.hal_blue_l_50,
935
- disabledBorderColor: globalTokens.hal_grey_l_60,
936
- disabledBorderColorOnDark: globalTokens.hal_grey_l_60,
937
- disabledContainerFillColor: globalTokens.hal_grey_l_95,
938
- disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
939
- errorBorderColor: globalTokens.hal_red_s_41,
940
- errorBorderColorOnDark: globalTokens.hal_red_l_60,
941
- hoverErrorBorderColor: "#fe0123",
942
- hoverErrorBorderColorOnDark: "#fe677b",
769
+ disabledColor: globalTokens.hal_grey_l_60,
770
+ enabledInputBorderColor: globalTokens.hal_black,
771
+ hoverInputBorderColor: globalTokens.hal_purple_l_65,
772
+ focusInputBorderColor: globalTokens.hal_blue_l_50,
773
+ errorInputBorderColor: globalTokens.hal_red_s_41,
774
+ hoverInputErrorBorderColor: globalTokens.color_red_600,
775
+ disabledInputBorderColor: globalTokens.hal_grey_l_60,
776
+ disabledInputBackgroundColor: globalTokens.hal_grey_l_95,
777
+ inputMarginTop: globalTokens.spacing_02,
778
+ inputMarginBottom: globalTokens.spacing_02,
943
779
  errorMessageColor: globalTokens.hal_red_s_41,
944
- errorMessageColorOnDark: globalTokens.hal_red_l_60,
945
780
  errorIconColor: globalTokens.hal_red_s_41,
946
- errorIconColorOnDark: globalTokens.hal_red_l_60,
947
781
  labelFontColor: globalTokens.hal_black,
948
- labelFontColorOnDark: globalTokens.hal_white,
949
782
  labelFontSize: globalTokens.type_scale_02,
950
783
  labelFontStyle: globalTokens.type_normal,
951
784
  labelFontWeight: globalTokens.type_semibold,
952
- disabledLabelFontColor: globalTokens.hal_grey_l_60,
953
- disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
785
+ labelLineHeight: globalTokens.type_leading_loose_01,
954
786
  optionalLabelFontWeight: globalTokens.type_regular,
955
787
  helperTextFontColor: globalTokens.hal_black,
956
- helperTextFontColorOnDark: globalTokens.hal_white,
957
788
  helperTextFontSize: globalTokens.type_scale_01,
958
789
  helperTextFontStyle: globalTokens.type_normal,
959
790
  helperTextFontWeight: globalTokens.type_regular,
960
- disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
961
- disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
962
- placeholderFontColor: "#808080",
963
- placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
964
- disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
965
- disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
791
+ helperTextLineHeight: globalTokens.type_leading_normal,
792
+ placeholderFontColor: "#000000b3",
966
793
  valueFontColor: globalTokens.hal_black,
967
- valueFontColorOnDark: globalTokens.hal_white,
968
794
  valueFontSize: globalTokens.type_scale_03,
969
795
  valueFontStyle: globalTokens.type_normal,
970
796
  valueFontWeight: globalTokens.type_regular,
971
- disabledValueFontColor: globalTokens.hal_grey_l_60,
972
- disabledValueFontColorOnDark: globalTokens.hal_grey_l_60,
973
797
  actionIconColor: globalTokens.hal_black,
974
- actionIconColorOnDark: globalTokens.hal_white,
975
- disabledActionIconColor: globalTokens.hal_grey_l_60,
976
- disabledActionIconColorOnDark: globalTokens.hal_grey_l_60,
977
798
  hoverActionIconColor: globalTokens.hal_black,
978
- hoverActionIconColorOnDark: globalTokens.hal_white,
979
- focusActionIconColor: globalTokens.hal_black,
980
- focusActionIconColorOnDark: globalTokens.hal_white,
981
799
  activeActionIconColor: globalTokens.hal_black,
982
- activeActionIconColorOnDark: globalTokens.hal_black,
983
800
  actionBackgroundColor: globalTokens.transparent,
984
- actionBackgroundColorOnDark: globalTokens.transparent,
985
- disabledActionBackgroundColor: globalTokens.transparent,
986
- disabledActionBackgroundColorOnDark: globalTokens.transparent,
987
801
  hoverActionBackgroundColor: globalTokens.hal_grey_l_95,
988
- hoverActionBackgroundColorOnDark: globalTokens.hal_grey_s_40,
989
- focusActionBorderColor: globalTokens.hal_blue_l_50,
990
- focusActionBorderColorOnDark: globalTokens.hal_blue_l_50,
991
802
  activeActionBackgroundColor: globalTokens.hal_grey_l_80,
992
- activeActionBackgroundColorOnDark: globalTokens.hal_grey_l_60,
993
803
  listOptionFontColor: globalTokens.hal_black,
994
804
  listOptionFontSize: globalTokens.type_scale_02,
995
805
  listOptionFontStyle: globalTokens.type_normal,
996
806
  listOptionFontWeight: globalTokens.type_regular,
807
+ listOptionIconColor: globalTokens.hal_black,
808
+ listOptionDividerColor: globalTokens.hal_grey_l_90,
809
+ listGroupLabelFontWeight: globalTokens.type_semibold,
810
+ focusListOptionBorderColor: globalTokens.hal_blue_l_50,
997
811
  systemMessageFontColor: globalTokens.hal_grey_s_40,
998
- errorMessageBorderColor: globalTokens.hal_red_s_41,
999
- errorMessageBackgroundColor: globalTokens.hal_red_l_95,
1000
- hoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
1001
- activeListOptionBackgroundColor: globalTokens.hal_grey_l_90,
1002
- // NUEVO
1003
- arrowColor: globalTokens.hal_black,
1004
- arrowColorOnDark: globalTokens.hal_white,
1005
- disabledArrowColor: globalTokens.hal_grey_l_60,
1006
- disabledArrowColorOnDark: globalTokens.hal_grey_l_60,
1007
- enabledListBorderColor: globalTokens.hal_grey_l_80,
1008
- listOptionBorderBottomColor: globalTokens.hal_grey_l_90,
1009
- selectedListOptionBackgroundColor: globalTokens.hal_grey_l_90
812
+ collapseIndicatorColor: globalTokens.hal_black,
813
+ listDialogBackgroundColor: globalTokens.hal_white,
814
+ listDialogBorderColor: globalTokens.hal_grey_l_75,
815
+ selectedListOptionBackgroundColor: globalTokens.hal_blue_l_95,
816
+ selectedHoverListOptionBackgroundColor: globalTokens.color_blue_200,
817
+ selectedActiveListOptionBackgroundColor: globalTokens.hal_blue_l_80,
818
+ selectedListOptionIconColor: globalTokens.hal_blue_d_20,
819
+ unselectedHoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
820
+ unselectedActiveListOptionBackgroundColor: globalTokens.hal_grey_l_90,
821
+ selectionIndicatorFontColor: globalTokens.hal_black,
822
+ selectionIndicatorFontSize: globalTokens.type_scale_01,
823
+ selectionIndicatorFontStyle: globalTokens.type_regular,
824
+ selectionIndicatorFontWeight: globalTokens.type_normal,
825
+ selectionIndicatorBorderColor: globalTokens.hal_grey_l_75,
826
+ selectionIndicatorBackgroundColor: globalTokens.color_grey_50,
827
+ enabledSelectionIndicatorActionBackgroundColor: globalTokens.transparent,
828
+ enabledSelectionIndicatorActionIconColor: globalTokens.hal_black,
829
+ hoverSelectionIndicatorActionBackgroundColor: globalTokens.hal_grey_l_95,
830
+ hoverSelectionIndicatorActionIconColor: globalTokens.hal_black,
831
+ activeSelectionIndicatorActionBackgroundColor: globalTokens.hal_grey_l_80,
832
+ activeSelectionIndicatorActionIconColor: globalTokens.hal_black
1010
833
  },
1011
834
  sidenav: {
1012
835
  backgroundColor: globalTokens.hal_grey_l_95,
1013
836
  arrowContainerColor: globalTokens.hal_grey_l_90,
1014
837
  arrowColor: globalTokens.hal_black,
1015
838
  titleFontFamily: globalTokens.type_sans,
1016
- titleFontSize: globalTokens.type_scale_05,
839
+ titleFontSize: globalTokens.type_scale_04,
1017
840
  titleFontStyle: globalTokens.type_normal,
1018
- titleFontWeight: globalTokens.type_regular,
1019
- titleFontColor: globalTokens.hal_black,
841
+ titleFontWeight: globalTokens.type_semibold,
842
+ titleFontColor: globalTokens.color_grey_800,
1020
843
  titleFontTextTransform: "none",
1021
844
  titleFontLetterSpacing: globalTokens.type_spacing_normal,
1022
- subtitleFontFamily: globalTokens.type_sans,
1023
- subtitleFontSize: globalTokens.type_scale_03,
1024
- subtitleFontStyle: globalTokens.type_normal,
1025
- subtitleFontWeight: globalTokens.type_regular,
1026
- subtitleFontColor: globalTokens.color_grey_800,
1027
- subtitleFontTextTransform: globalTokens.type_uppercase,
1028
- subtitleFontLetterSpacing: globalTokens.type_spacing_wide_02,
845
+ groupTitleFontFamily: globalTokens.type_sans,
846
+ groupTitleFontSize: globalTokens.type_scale_02,
847
+ groupTitleFontStyle: globalTokens.type_normal,
848
+ groupTitleFontWeight: globalTokens.type_semibold,
849
+ groupTitleFontColor: globalTokens.black,
850
+ groupTitleHoverBackgroundColor: globalTokens.hal_grey_l_90,
851
+ groupTitleActiveBackgroundColor: globalTokens.hal_grey_l_80,
852
+ groupTitleSelectedFontColor: globalTokens.white,
853
+ groupTitleSelectedBackgroundColor: globalTokens.color_grey_800,
854
+ groupTitleSelectedHoverFontColor: globalTokens.white,
855
+ groupTitleSelectedHoverBackgroundColor: globalTokens.color_grey_600,
856
+ groupTitleFontTextTransform: globalTokens.type_uppercase,
857
+ groupTitleFontLetterSpacing: globalTokens.type_spacing_wide_02,
1029
858
  linkFontFamily: globalTokens.type_sans,
1030
859
  linkFontSize: globalTokens.type_scale_02,
1031
860
  linkFontStyle: globalTokens.type_normal,
1032
861
  linkFontWeight: globalTokens.type_regular,
1033
862
  linkFontColor: globalTokens.color_grey_800,
863
+ linkHoverBackgroundColor: globalTokens.hal_grey_l_90,
864
+ linkSelectedFontColor: globalTokens.white,
865
+ linkSelectedBackgroundColor: globalTokens.color_grey_800,
866
+ linkSelectedHoverFontColor: globalTokens.white,
867
+ linkSelectedHoverBackgroundColor: globalTokens.color_grey_600,
1034
868
  linkFontTextTransform: "none",
1035
869
  linkFontLetterSpacing: globalTokens.type_spacing_wide_01,
1036
870
  linkTextDecoration: globalTokens.type_no_line,
@@ -1044,9 +878,13 @@ var componentTokens = {
1044
878
  },
1045
879
  slider: {
1046
880
  fontFamily: globalTokens.type_sans,
1047
- fontSize: globalTokens.type_scale_03,
1048
- fontStyle: globalTokens.type_normal,
1049
- fontWeight: globalTokens.type_regular,
881
+ limitValuesFontColor: globalTokens.hal_black,
882
+ limitValuesFontColorOnDark: globalTokens.hal_white,
883
+ limitValuesFontSize: globalTokens.type_scale_03,
884
+ limitValuesFontStyle: globalTokens.type_normal,
885
+ limitValuesFontWeight: globalTokens.type_regular,
886
+ limitValuesFontLetterSpacing: globalTokens.type_spacing_normal,
887
+ disabledLimitValuesFontColor: globalTokens.hal_grey_l_60,
1050
888
  labelFontFamily: globalTokens.type_sans,
1051
889
  labelFontSize: globalTokens.type_scale_02,
1052
890
  labelFontStyle: globalTokens.type_normal,
@@ -1060,9 +898,13 @@ var componentTokens = {
1060
898
  fontColor: globalTokens.hal_black,
1061
899
  fontColorOnDark: globalTokens.hal_white,
1062
900
  labelFontColor: globalTokens.hal_black,
901
+ labelFontColorOnDark: globalTokens.hal_white,
1063
902
  helperTextFontColor: globalTokens.hal_black,
1064
- disabledFontColor: globalTokens.hal_grey_l_60,
1065
- fontLetterSpacing: globalTokens.type_spacing_normal,
903
+ helperTextFontColorOnDark: globalTokens.hal_white,
904
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
905
+ disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
906
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
907
+ disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
1066
908
  thumbHeight: "12px",
1067
909
  thumbWidth: "12px",
1068
910
  hoverThumbHeight: "14px",
@@ -1090,7 +932,7 @@ var componentTokens = {
1090
932
  trackLineColorOnDark: globalTokens.hal_blue_l_50,
1091
933
  totalLineThickness: "2px",
1092
934
  totalLineVerticalPosition: "50%",
1093
- totalLineColor: globalTokens.hal_grey_l_90,
935
+ totalLineColor: "#0000001a",
1094
936
  totalLineColorOnDark: globalTokens.hal_grey_l_75,
1095
937
  disabledThumbVerticalPosition: "10px",
1096
938
  disabledThumbBackgroundColor: globalTokens.hal_grey_l_60,
@@ -1110,7 +952,7 @@ var componentTokens = {
1110
952
  },
1111
953
  spinner: {
1112
954
  trackCircleColor: "#5f249f",
1113
- trackCircleColorOnDark: "#a46ede",
955
+ trackCircleColorOverlay: "#a46ede",
1114
956
  totalCircleColor: globalTokens.white,
1115
957
  labelFontFamily: globalTokens.type_sans,
1116
958
  labelFontSize: globalTokens.type_scale_02,
@@ -1144,54 +986,37 @@ var componentTokens = {
1144
986
  "switch": {
1145
987
  checkedTrackBackgroundColor: globalTokens.hal_purple_s_38,
1146
988
  checkedTrackBackgroundColorOnDark: globalTokens.hal_purple_s_38,
1147
- checkedThumbBackgroundColor: globalTokens.white,
1148
- checkedThumbBackgroundColorOnDark: globalTokens.white,
1149
- uncheckedTrackBackgroundColor: globalTokens.lightGrey,
1150
- uncheckedTrackBackgroundColorOnDark: globalTokens.lightGrey,
1151
- uncheckedThumbBackgroundColor: globalTokens.white,
1152
- uncheckedThumbBackgroundColorOnDark: globalTokens.white,
1153
- disabledCheckedTrackBackgroundColor: globalTokens.lightPurple,
989
+ checkedThumbBackgroundColor: globalTokens.hal_white,
990
+ checkedThumbBackgroundColorOnDark: globalTokens.hal_white,
991
+ uncheckedTrackBackgroundColor: globalTokens.hal_grey_l_75,
992
+ uncheckedTrackBackgroundColorOnDark: globalTokens.hal_grey_l_75,
993
+ uncheckedThumbBackgroundColor: globalTokens.hal_white,
994
+ uncheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
995
+ disabledCheckedTrackBackgroundColor: globalTokens.hal_purple_l_95,
1154
996
  disabledCheckedTrackBackgroundColorOnDark: "#1c0b24",
1155
- disabledCheckedThumbBackgroundColor: globalTokens.white,
1156
- disabledCheckedThumbBackgroundColorOnDark: globalTokens.white,
1157
- disabledUncheckedTrackBackgroundColor: globalTokens.lightWhite,
997
+ disabledCheckedThumbBackgroundColor: globalTokens.hal_white,
998
+ disabledCheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
999
+ disabledUncheckedTrackBackgroundColor: globalTokens.hal_grey_l_95,
1158
1000
  disabledUncheckedTrackBackgroundColorOnDark: "#363636",
1159
- disabledUncheckedThumbBackgroundColor: globalTokens.white,
1160
- disabledUncheckedThumbBackgroundColorOnDark: globalTokens.white,
1161
- disabledLabelFontColor: globalTokens.lighterBlack,
1001
+ disabledUncheckedThumbBackgroundColor: globalTokens.hal_white,
1002
+ disabledUncheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
1003
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1162
1004
  disabledLabelFontColorOnDark: "#575757",
1163
1005
  disabledLabelFontStyle: globalTokens.type_normal,
1164
1006
  labelFontFamily: globalTokens.type_sans,
1165
1007
  labelFontSize: globalTokens.type_scale_root,
1166
1008
  labelFontStyle: globalTokens.type_normal,
1167
1009
  labelFontWeight: globalTokens.type_regular,
1168
- labelFontColor: globalTokens.black,
1169
- labelFontColorOnDark: globalTokens.white,
1170
- thumbFocusColor: globalTokens.blue,
1010
+ labelFontColor: globalTokens.hal_black,
1011
+ labelFontColorOnDark: globalTokens.hal_white,
1012
+ thumbFocusColor: globalTokens.hal_blue_l_50,
1171
1013
  thumbFocusColorOnDark: "#1682FF",
1172
1014
  thumbHeight: "24px",
1173
1015
  thumbWidth: "24px",
1174
- thumbShift: "40%",
1016
+ thumbShift: "1.25rem",
1175
1017
  trackHeight: "12px",
1176
- trackWidth: "60px",
1177
- spaceBetweenLabelSwitch: "0px"
1178
- },
1179
- tag: {
1180
- fontFamily: globalTokens.type_sans,
1181
- fontColor: globalTokens.hal_black,
1182
- fontSize: globalTokens.type_scale_02,
1183
- fontStyle: globalTokens.type_normal,
1184
- fontWeight: globalTokens.type_regular,
1185
- labelPaddingTop: "0px",
1186
- labelPaddingBottom: "0px",
1187
- labelPaddingLeft: "16px",
1188
- labelPaddingRight: "16px",
1189
- height: "40px",
1190
- iconColor: globalTokens.hal_white,
1191
- iconSectionWidth: "40px",
1192
- iconHeight: "24px",
1193
- iconWidth: "auto",
1194
- focusColor: globalTokens.hal_blue_l_50
1018
+ trackWidth: "36px",
1019
+ spaceBetweenLabelSwitch: "8px"
1195
1020
  },
1196
1021
  table: {
1197
1022
  rowSeparatorThickness: "1px",
@@ -1199,7 +1024,7 @@ var componentTokens = {
1199
1024
  rowSeparatorColor: globalTokens.lightGrey,
1200
1025
  dataBackgroundColor: globalTokens.white,
1201
1026
  dataFontFamily: globalTokens.type_sans,
1202
- dataFontSize: globalTokens.type_scale_root,
1027
+ dataFontSize: globalTokens.type_scale_02,
1203
1028
  dataFontStyle: globalTokens.type_normal,
1204
1029
  dataFontWeight: globalTokens.type_regular,
1205
1030
  dataFontColor: globalTokens.black,
@@ -1245,6 +1070,7 @@ var componentTokens = {
1245
1070
  disabledFontColor: "#999999",
1246
1071
  disabledIconColor: "#999999",
1247
1072
  disabledFontStyle: globalTokens.type_normal,
1073
+ disabledBadgeBackgroundColor: "#0000004D",
1248
1074
  hoverBackgroundColor: "#f2eafa",
1249
1075
  pressedBackgroundColor: "#e5d5f6",
1250
1076
  pressedFontWeight: globalTokens.type_semibold,
@@ -1266,42 +1092,73 @@ var componentTokens = {
1266
1092
  badgeHeightWithNotificationNumber: "17px",
1267
1093
  badgeRadiusWithNotificationNumber: "10px"
1268
1094
  },
1095
+ tag: {
1096
+ fontFamily: globalTokens.type_sans,
1097
+ fontColor: globalTokens.hal_black,
1098
+ fontSize: globalTokens.type_scale_02,
1099
+ fontStyle: globalTokens.type_normal,
1100
+ fontWeight: globalTokens.type_regular,
1101
+ labelPaddingTop: "0px",
1102
+ labelPaddingBottom: "0px",
1103
+ labelPaddingLeft: "16px",
1104
+ labelPaddingRight: "16px",
1105
+ height: "40px",
1106
+ iconColor: globalTokens.hal_white,
1107
+ iconSectionWidth: "40px",
1108
+ iconHeight: "24px",
1109
+ iconWidth: "auto",
1110
+ focusColor: globalTokens.hal_blue_l_50
1111
+ },
1269
1112
  textarea: {
1270
1113
  fontFamily: globalTokens.type_sans,
1271
- assistiveTextFontSize: globalTokens.type_scale_01,
1272
- assistiveTextFontStyle: globalTokens.type_normal,
1273
- assistiveTextFontWeight: globalTokens.type_regular,
1274
- assistiveTextFontColor: globalTokens.black,
1275
- assistiveTextFontColorOnDark: globalTokens.white,
1276
- assistiveTextLetterSpacing: "0.03333em",
1277
- disabledColor: globalTokens.lighterBlack,
1278
- disabledColorOnDark: "#575757",
1279
- errorColor: globalTokens.red,
1280
- errorColorOnDark: globalTokens.hal_red_l_60,
1281
- scrollBarThumbColor: globalTokens.darkGrey,
1282
- scrollBarThumbColorOnDark: globalTokens.white,
1283
- scrollBarTrackColor: globalTokens.lightGrey,
1284
- scrollBarTrackColorOnDark: "#999999",
1285
- labelFontSize: globalTokens.type_scale_03,
1114
+ enabledBorderColor: globalTokens.hal_black,
1115
+ enabledBorderColorOnDark: globalTokens.hal_white,
1116
+ hoverBorderColor: globalTokens.hal_purple_l_65,
1117
+ hoverBorderColorOnDark: globalTokens.hal_purple_l_65,
1118
+ focusBorderColor: globalTokens.hal_blue_l_50,
1119
+ focusBorderColorOnDark: globalTokens.hal_blue_l_50,
1120
+ disabledBorderColor: globalTokens.hal_grey_l_60,
1121
+ disabledBorderColorOnDark: globalTokens.hal_grey_l_60,
1122
+ disabledContainerFillColor: globalTokens.hal_grey_l_95,
1123
+ disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
1124
+ errorBorderColor: globalTokens.hal_red_s_41,
1125
+ errorBorderColorOnDark: globalTokens.hal_red_l_60,
1126
+ hoverErrorBorderColor: globalTokens.color_red_600,
1127
+ hoverErrorBorderColorOnDark: "#fe677b",
1128
+ inputMarginTop: globalTokens.spacing_02,
1129
+ inputMarginBottom: globalTokens.spacing_02,
1130
+ errorMessageColor: globalTokens.hal_red_s_41,
1131
+ errorMessageColorOnDark: globalTokens.hal_red_l_60,
1132
+ labelFontColor: globalTokens.hal_black,
1133
+ labelFontColorOnDark: globalTokens.hal_white,
1134
+ labelFontSize: globalTokens.type_scale_02,
1286
1135
  labelFontStyle: globalTokens.type_normal,
1287
- labelFontWeight: globalTokens.type_regular,
1288
- labelFontColor: globalTokens.black,
1289
- labelFontColorOnDark: globalTokens.white,
1290
- labelLetterSpacing: "0.00938em",
1136
+ labelFontWeight: globalTokens.type_semibold,
1137
+ labelLineHeight: globalTokens.type_leading_loose_01,
1138
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1139
+ disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
1140
+ optionalLabelFontWeight: globalTokens.type_regular,
1141
+ helperTextFontColor: globalTokens.hal_black,
1142
+ helperTextFontColorOnDark: globalTokens.hal_white,
1143
+ helperTextFontSize: globalTokens.type_scale_01,
1144
+ helperTextFontStyle: globalTokens.type_normal,
1145
+ helperTextFontWeight: globalTokens.type_regular,
1146
+ helperTextLineHeight: globalTokens.type_leading_normal,
1147
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
1148
+ disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
1149
+ placeholderFontColor: "#000000b3",
1150
+ placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
1151
+ disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
1152
+ disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
1153
+ valueFontColor: globalTokens.hal_black,
1154
+ valueFontColorOnDark: globalTokens.hal_white,
1291
1155
  valueFontSize: globalTokens.type_scale_03,
1292
1156
  valueFontStyle: globalTokens.type_normal,
1293
1157
  valueFontWeight: globalTokens.type_regular,
1294
- valueFontColor: globalTokens.black,
1295
- valueFontColorOnDark: globalTokens.white,
1296
- valueLetterSpacing: globalTokens.type_spacing_normal,
1297
- valueLineHeight: "1.1875em",
1298
- underlineColor: globalTokens.black,
1299
- underlineColorOnDark: globalTokens.white,
1300
- underlineFocusColor: globalTokens.black,
1301
- underlineFocusColorOnDark: globalTokens.white,
1302
- underlineThickness: "1px"
1158
+ disabledValueFontColor: globalTokens.hal_grey_l_60,
1159
+ disabledValueFontColorOnDark: globalTokens.hal_grey_l_60
1303
1160
  },
1304
- newTextarea: {
1161
+ textInput: {
1305
1162
  fontFamily: globalTokens.type_sans,
1306
1163
  enabledBorderColor: globalTokens.hal_black,
1307
1164
  enabledBorderColorOnDark: globalTokens.hal_white,
@@ -1315,10 +1172,14 @@ var componentTokens = {
1315
1172
  disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
1316
1173
  errorBorderColor: globalTokens.hal_red_s_41,
1317
1174
  errorBorderColorOnDark: globalTokens.hal_red_l_60,
1318
- hoverErrorBorderColor: "#fe0123",
1175
+ hoverErrorBorderColor: globalTokens.color_red_600,
1319
1176
  hoverErrorBorderColorOnDark: "#fe677b",
1177
+ inputMarginTop: globalTokens.spacing_02,
1178
+ inputMarginBottom: globalTokens.spacing_02,
1320
1179
  errorMessageColor: globalTokens.hal_red_s_41,
1321
1180
  errorMessageColorOnDark: globalTokens.hal_red_l_60,
1181
+ errorIconColor: globalTokens.hal_red_s_41,
1182
+ errorIconColorOnDark: globalTokens.hal_red_l_60,
1322
1183
  labelFontColor: globalTokens.hal_black,
1323
1184
  labelFontColorOnDark: globalTokens.hal_white,
1324
1185
  labelFontSize: globalTokens.type_scale_02,
@@ -1336,7 +1197,15 @@ var componentTokens = {
1336
1197
  helperTextLineHeight: globalTokens.type_leading_normal,
1337
1198
  disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
1338
1199
  disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
1339
- placeholderFontColor: "#808080",
1200
+ prefixColor: globalTokens.hal_grey_s_40,
1201
+ prefixColorOnDark: globalTokens.hal_white,
1202
+ suffixColor: globalTokens.hal_grey_s_40,
1203
+ suffixColorOnDark: globalTokens.hal_white,
1204
+ disabledPrefixColor: globalTokens.hal_grey_l_75,
1205
+ disabledSuffixColor: globalTokens.hal_grey_l_75,
1206
+ disabledPrefixColorOnDark: globalTokens.hal_grey_l_60,
1207
+ disabledSuffixColorOnDark: globalTokens.hal_grey_l_60,
1208
+ placeholderFontColor: "#000000b3",
1340
1209
  placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
1341
1210
  disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
1342
1211
  disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
@@ -1346,7 +1215,41 @@ var componentTokens = {
1346
1215
  valueFontStyle: globalTokens.type_normal,
1347
1216
  valueFontWeight: globalTokens.type_regular,
1348
1217
  disabledValueFontColor: globalTokens.hal_grey_l_60,
1349
- disabledValueFontColorOnDark: globalTokens.hal_grey_l_60
1218
+ disabledValueFontColorOnDark: globalTokens.hal_grey_l_60,
1219
+ actionIconColor: globalTokens.hal_black,
1220
+ actionIconColorOnDark: globalTokens.hal_white,
1221
+ disabledActionIconColor: globalTokens.hal_grey_l_60,
1222
+ disabledActionIconColorOnDark: globalTokens.hal_grey_l_60,
1223
+ hoverActionIconColor: globalTokens.hal_black,
1224
+ hoverActionIconColorOnDark: globalTokens.hal_white,
1225
+ focusActionIconColor: globalTokens.hal_black,
1226
+ focusActionIconColorOnDark: globalTokens.hal_white,
1227
+ activeActionIconColor: globalTokens.hal_black,
1228
+ activeActionIconColorOnDark: globalTokens.hal_black,
1229
+ actionBackgroundColor: globalTokens.transparent,
1230
+ actionBackgroundColorOnDark: globalTokens.transparent,
1231
+ disabledActionBackgroundColor: globalTokens.transparent,
1232
+ disabledActionBackgroundColorOnDark: globalTokens.transparent,
1233
+ hoverActionBackgroundColor: globalTokens.hal_grey_l_95,
1234
+ hoverActionBackgroundColorOnDark: globalTokens.hal_grey_s_40,
1235
+ focusActionBorderColor: globalTokens.hal_blue_l_50,
1236
+ focusActionBorderColorOnDark: globalTokens.hal_blue_l_50,
1237
+ activeActionBackgroundColor: globalTokens.hal_grey_l_80,
1238
+ activeActionBackgroundColorOnDark: globalTokens.hal_grey_l_60,
1239
+ listDialogBackgroundColor: globalTokens.hal_white,
1240
+ listDialogBorderColor: globalTokens.hal_grey_l_75,
1241
+ listOptionDividerColor: globalTokens.hal_grey_l_90,
1242
+ listOptionFontColor: globalTokens.hal_black,
1243
+ listOptionFontSize: globalTokens.type_scale_02,
1244
+ listOptionFontStyle: globalTokens.type_normal,
1245
+ listOptionFontWeight: globalTokens.type_regular,
1246
+ systemMessageFontColor: globalTokens.hal_grey_s_40,
1247
+ errorListDialogFontColor: globalTokens.hal_black,
1248
+ errorListDialogBackgroundColor: globalTokens.color_red_50,
1249
+ errorListDialogBorderColor: globalTokens.hal_red_s_41,
1250
+ hoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
1251
+ activeListOptionBackgroundColor: globalTokens.hal_grey_l_80,
1252
+ focusListOptionBorderColor: globalTokens.hal_blue_l_50
1350
1253
  },
1351
1254
  toggleGroup: {
1352
1255
  containerBackgroundColor: globalTokens.color_grey_50,
@@ -1396,121 +1299,65 @@ var componentTokens = {
1396
1299
  containerBorderRadius: globalTokens.border_radius_large,
1397
1300
  optionFocusBorderThickness: globalTokens.border_width_2
1398
1301
  },
1399
- upload: {
1400
- fontFamily: globalTokens.type_sans,
1401
- shadowColor: globalTokens.lightWhite,
1402
- scrollBarThumbColor: globalTokens.darkGrey,
1403
- scrollBarTrackColor: globalTokens.lightGrey,
1404
- errorColor: globalTokens.red,
1405
- backgroundColor: globalTokens.white,
1406
- draggingStateBackgroundColor: globalTokens.lightWhite,
1407
- dragAndDropIconColor: globalTokens.black,
1408
- dragAndDropIconSize: "43.5px",
1409
- dragAndDropTitleFontSize: globalTokens.type_scale_04,
1410
- dragAndDropTitleFontStyle: globalTokens.type_normal,
1411
- dragAndDropTitleFontWeight: globalTokens.type_bold,
1412
- dragAndDropTitleFontTextTransform: "none",
1413
- dragAndDropTitleFontColor: globalTokens.black,
1414
- dragAndDropDescriptionFontSize: globalTokens.type_scale_03,
1415
- dragAndDropDescriptionFontStyle: globalTokens.type_italic,
1416
- dragAndDropDescriptionFontWeight: globalTokens.type_regular,
1417
- dragAndDropDescriptionFontTextTransform: "none",
1418
- dragAndDropDescriptionFontColor: globalTokens.darkGrey,
1419
- dragAndDropDraggingStateIconColor: globalTokens.darkGrey,
1420
- dragAndDropDraggingStateIconSize: "74.5px",
1421
- dragAndDropDraggingStateFontSize: globalTokens.type_scale_03,
1422
- dragAndDropDraggingStateFontStyle: globalTokens.type_italic,
1423
- dragAndDropDraggingStateFontWeight: globalTokens.type_regular,
1424
- dragAndDropDraggingStateFontTextTransform: "none",
1425
- dragAndDropDraggingStateFontColor: globalTokens.darkGrey,
1426
- dragAndDropAreaIconColor: globalTokens.darkGrey,
1427
- dragAndDropAreaIconSize: "24px",
1428
- dragAndDropAreaTextFontSize: globalTokens.type_scale_01,
1429
- dragAndDropAreaTextFontStyle: globalTokens.type_italic,
1430
- dragAndDropAreaTextFontWeight: globalTokens.type_regular,
1431
- dragAndDropAreaTextFontTextTransform: "none",
1432
- dragAndDropAreaTextFontColor: globalTokens.darkGrey,
1433
- fileDeleteIconColor: globalTokens.black,
1434
- fileDeleteIconSize: "30px",
1435
- fileUnderlineColor: globalTokens.lightGrey,
1436
- fileUnderlineThickness: "1px",
1437
- fileNameFontSize: globalTokens.type_scale_03,
1438
- fileNameFontStyle: globalTokens.type_normal,
1439
- fileNameFontWeight: globalTokens.type_regular,
1440
- fileNameFontTextTransform: "none",
1441
- fileNameFontColor: globalTokens.black,
1442
- fileTypeFontSize: globalTokens.type_scale_01,
1443
- fileTypeFontStyle: globalTokens.type_normal,
1444
- fileTypeFontWeight: globalTokens.type_regular,
1445
- fileTypeFontTextTransform: globalTokens.type_uppercase,
1446
- fileTypeFontColor: globalTokens.darkGrey,
1447
- hoverFileColor: globalTokens.darkWhite,
1448
- uploadedFileIconColor: globalTokens.lightGrey,
1449
- uploadedFileIconSize: "24px",
1450
- uploadedFilesTitleFontSize: globalTokens.type_scale_04,
1451
- uploadedFilesTitleFontStyle: globalTokens.type_normal,
1452
- uploadedFilesTitleFontWeight: globalTokens.type_regular,
1453
- uploadedFilesTitleFontTextTransform: "none",
1454
- uploadedFilesTitleFontColor: globalTokens.black,
1455
- uploadedFilesSubtitleFontSize: globalTokens.type_scale_01,
1456
- uploadedFilesSubtitleFontStyle: globalTokens.type_normal,
1457
- uploadedFilesSubtitleFontWeight: globalTokens.type_regular,
1458
- uploadedFilesSubtitleFontTextTransform: "none",
1459
- uploadedFilesSubtitleFontColor: globalTokens.darkGrey,
1460
- uploadedFilesNumberFontWeight: globalTokens.type_bold
1461
- },
1462
1302
  wizard: {
1463
- disabledBackgroundColor: globalTokens.lightGrey,
1464
- disabledFontColor: globalTokens.darkGrey,
1465
- stepContainerFontSize: globalTokens.type_scale_03,
1466
- stepContainerFontFamily: globalTokens.type_sans,
1467
- stepContainerFontStyle: globalTokens.type_normal,
1468
- stepContainerFontWeight: globalTokens.type_regular,
1469
- stepContainerLetterSpacing: globalTokens.type_spacing_wide_02,
1470
- stepContainerFontColor: globalTokens.black,
1471
- stepContainerSelectedFontColor: globalTokens.white,
1472
- stepContainerSelectedBackgroundColor: globalTokens.hal_purple_s_38,
1473
- stepContainerBackgroundColor: globalTokens.white,
1474
- stepContainerIconSize: "19px",
1303
+ visitedStepFontColor: globalTokens.hal_black,
1304
+ visitedStepBackgroundColor: globalTokens.hal_white,
1305
+ visitedStepBorderColor: globalTokens.hal_black,
1306
+ unvisitedStepFontColor: globalTokens.hal_grey_s_40,
1307
+ unvisitedLabelFontColor: globalTokens.hal_grey_s_40,
1308
+ unvisitedHelperTextFontColor: globalTokens.hal_grey_s_40,
1309
+ unvisitedStepBackgroundColor: globalTokens.transparent,
1310
+ unvisitedStepBorderColor: globalTokens.hal_grey_s_40,
1311
+ selectedStepFontColor: globalTokens.white,
1312
+ selectedStepBackgroundColor: globalTokens.hal_purple_s_38,
1313
+ selectedStepBorderColor: globalTokens.hal_purple_s_38,
1314
+ selectedLabelFontColor: globalTokens.hal_black,
1315
+ selectedHelperTextFontColor: globalTokens.hal_black,
1316
+ selectedStepWidth: "32px",
1317
+ selectedStepHeight: "32px",
1318
+ selectedStepBorderThickness: "2px",
1319
+ selectedStepBorderStyle: "solid",
1320
+ selectedStepBorderRadius: "45px",
1321
+ stepFontSize: globalTokens.type_scale_03,
1322
+ stepFontFamily: globalTokens.type_sans,
1323
+ stepFontStyle: globalTokens.type_normal,
1324
+ stepFontWeight: globalTokens.type_regular,
1325
+ stepFontTracking: globalTokens.type_spacing_wide_02,
1326
+ stepIconSize: "20px",
1327
+ stepWidth: "32px",
1328
+ stepHeight: "32px",
1329
+ stepBorderThickness: "2px",
1330
+ stepBorderStyle: "solid",
1331
+ stepBorderRadius: "45px",
1332
+ visitedLabelFontColor: globalTokens.hal_black,
1475
1333
  labelFontSize: globalTokens.type_scale_03,
1476
1334
  labelFontFamily: globalTokens.type_sans,
1477
1335
  labelFontStyle: globalTokens.type_normal,
1478
1336
  labelFontWeight: globalTokens.type_regular,
1479
- labelLetterSpacing: globalTokens.type_spacing_normal,
1337
+ labelFontTracking: globalTokens.type_spacing_normal,
1480
1338
  labelFontTextTransform: "none",
1481
1339
  labelTextAlign: "left",
1482
- labelFontColor: globalTokens.darkGrey,
1483
- visitedLabelFontColor: globalTokens.black,
1484
- visitedDescriptionFontColor: globalTokens.black,
1485
- descriptionFontSize: globalTokens.type_scale_01,
1486
- descriptionFontFamily: globalTokens.type_sans,
1487
- descriptionFontStyle: globalTokens.type_normal,
1488
- descriptionFontWeight: globalTokens.type_regular,
1489
- descriptionLetterSpacing: globalTokens.type_spacing_wide_01,
1490
- descriptionFontTextTransform: "none",
1491
- descriptionFontColor: globalTokens.darkGrey,
1492
- descriptionTextAlign: "left",
1493
- circleWidth: "32px",
1494
- circleHeight: "32px",
1495
- circleBorderThickness: "2px",
1496
- circleBorderStyle: "solid",
1497
- circleBorderRadius: "45px",
1498
- circleBorderColor: globalTokens.black,
1499
- selectedCircleWidth: "32px",
1500
- selectedCircleHeight: "32px",
1501
- selectedCircleBorderThickness: "2px",
1502
- selectedCircleBorderStyle: "solid",
1503
- selectedCircleBorderRadius: "45px",
1504
- selectedCircleBorderColor: globalTokens.purple,
1505
- disabledCircleWidth: "32px",
1506
- disabledCircleHeight: "32px",
1507
- disabledCircleBorderThickness: "2px",
1508
- disabledCircleBorderStyle: "solid",
1509
- disabledCircleBorderRadius: "45px",
1510
- disabledCircleBorderColor: globalTokens.lightGrey,
1340
+ helperTextFontSize: globalTokens.type_scale_02,
1341
+ helperTextFontFamily: globalTokens.type_sans,
1342
+ helperTextFontStyle: globalTokens.type_normal,
1343
+ helperTextFontWeight: globalTokens.type_regular,
1344
+ helperTextFontTracking: globalTokens.type_spacing_normal,
1345
+ helperTextFontTextTransform: "none",
1346
+ visitedHelperTextFontColor: globalTokens.hal_black,
1347
+ helperTextTextAlign: "left",
1348
+ disabledStepBackgroundColor: globalTokens.hal_grey_l_95,
1349
+ disabledStepFontColor: globalTokens.hal_grey_l_60,
1350
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1351
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
1352
+ disabledStepBorderColor: globalTokens.hal_grey_l_95,
1353
+ disabledStepWidth: "32px",
1354
+ disabledStepHeight: "32px",
1355
+ disabledStepBorderThickness: "2px",
1356
+ disabledStepBorderStyle: "solid",
1357
+ disabledStepBorderRadius: "45px",
1511
1358
  separatorBorderThickness: "1px",
1512
1359
  separatorBorderStyle: "solid",
1513
- separatorColor: globalTokens.lightGrey,
1360
+ separatorColor: globalTokens.hal_grey_s_40,
1514
1361
  focusColor: globalTokens.hal_blue_l_50
1515
1362
  }
1516
1363
  };
@@ -1526,12 +1373,11 @@ var spaces = {
1526
1373
  };
1527
1374
  exports.spaces = spaces;
1528
1375
  var responsiveSizes = {
1529
- mobileSmall: "320",
1530
- mobileMedium: "375",
1531
- mobileLarge: "425",
1532
- tablet: "768",
1533
- laptop: "1024",
1534
- desktop: "1440"
1376
+ xsmall: "20",
1377
+ small: "30",
1378
+ medium: "45",
1379
+ large: "66",
1380
+ xlarge: "90"
1535
1381
  };
1536
1382
  exports.responsiveSizes = responsiveSizes;
1537
1383
  var typeface = {
@@ -1566,4 +1412,101 @@ var typeface = {
1566
1412
  textTransform: "uppercase"
1567
1413
  }
1568
1414
  };
1569
- exports.typeface = typeface;
1415
+ exports.typeface = typeface;
1416
+ var defaultTranslatedComponentLabels = {
1417
+ formFields: {
1418
+ optionalLabel: "(Optional)",
1419
+ requiredSelectionErrorMessage: "This field is required. Please, choose an option.",
1420
+ requiredValueErrorMessage: "This field is required. Please, enter a value.",
1421
+ formatRequestedErrorMessage: "Please match the format requested.",
1422
+ lengthErrorMessage: function lengthErrorMessage(minLength, maxLength) {
1423
+ return "Min length ".concat(minLength, ", max length ").concat(maxLength, ".");
1424
+ },
1425
+ logoAlternativeText: "Logo"
1426
+ },
1427
+ applicationLayout: {
1428
+ visibilityToggleTitle: "Toggle visibility sidenav"
1429
+ },
1430
+ alert: {
1431
+ infoTitleText: "information",
1432
+ successTitleText: "success",
1433
+ warningTitleText: "warning",
1434
+ errorTitleText: "error"
1435
+ },
1436
+ dateInput: {
1437
+ invalidDateErrorMessage: "Invalid date."
1438
+ },
1439
+ fileInput: {
1440
+ fileSizeGreaterThanErrorMessage: "File size must be greater than min size.",
1441
+ fileSizeLessThanErrorMessage: "File size must be less than max size.",
1442
+ multipleButtonLabelDefault: "Select files",
1443
+ singleButtonLabelDefault: "Select file",
1444
+ dropAreaButtonLabelDefault: "Select",
1445
+ multipleDropAreaLabelDefault: "or drop files",
1446
+ singleDropAreaLabelDefault: "or drop a file",
1447
+ deleteFileActionTitle: "Remove file"
1448
+ },
1449
+ footer: {
1450
+ copyrightText: function copyrightText(year) {
1451
+ return "\xA9 DXC Technology ".concat(year, ". All rights reserved.");
1452
+ }
1453
+ },
1454
+ header: {
1455
+ closeIcon: "Close menu",
1456
+ hamburguerTitle: "Menu"
1457
+ },
1458
+ numberInput: {
1459
+ valueGreaterThanOrEqualToErrorMessage: function valueGreaterThanOrEqualToErrorMessage(value) {
1460
+ return "Value must be greater than or equal to ".concat(value, ".");
1461
+ },
1462
+ valueLessThanOrEqualToErrorMessage: function valueLessThanOrEqualToErrorMessage(value) {
1463
+ return "Value must be less than or equal to ".concat(value, ".");
1464
+ },
1465
+ decrementValueTitle: "Decrement value",
1466
+ incrementValueTitle: "Increment value"
1467
+ },
1468
+ paginator: {
1469
+ itemsPerPageText: "Items per page: ",
1470
+ minToMaxOfText: function minToMaxOfText(minNumberOfItems, maxNumberOfItems, totalItems) {
1471
+ return "".concat(minNumberOfItems, " to ").concat(maxNumberOfItems, " of ").concat(totalItems);
1472
+ },
1473
+ goToPageText: "Go to page:",
1474
+ pageOfText: function pageOfText(pageNumber, totalPagesNumber) {
1475
+ return "Page: ".concat(pageNumber, " of ").concat(totalPagesNumber);
1476
+ }
1477
+ },
1478
+ passwordInput: {
1479
+ inputShowPasswordTitle: "Show password",
1480
+ inputHidePasswordTitle: "Hide password"
1481
+ },
1482
+ quickNav: {
1483
+ contentTitle: "Contents"
1484
+ },
1485
+ radioGroup: {
1486
+ optionalItemLabelDefault: "N/A"
1487
+ },
1488
+ select: {
1489
+ noMatchesErrorMessage: "No matches found",
1490
+ actionClearSelectionTitle: "Clear selection",
1491
+ actionClearSearchTitle: "Clear search"
1492
+ },
1493
+ tabs: {
1494
+ scrollLeft: "Scroll left",
1495
+ scrollRight: "Scroll right"
1496
+ },
1497
+ textInput: {
1498
+ clearFieldActionTitle: "Clear field",
1499
+ searchingMessage: "Searching...",
1500
+ fetchingDataErrorMessage: "Error fetching data"
1501
+ },
1502
+ calendar: {
1503
+ days: ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"],
1504
+ daysShort: ["Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"],
1505
+ months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
1506
+ monthsShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
1507
+ previousMonthTitle: "Previous month",
1508
+ nextMonthTitle: "Next month",
1509
+ openCalendar: "Open calendar"
1510
+ }
1511
+ };
1512
+ exports.defaultTranslatedComponentLabels = defaultTranslatedComponentLabels;