@dxc-technology/halstack-react 0.0.0-5b84635 → 0.0.0-5bbb9f7

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 (399) 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 +298 -0
  5. package/accordion/Accordion.d.ts +4 -0
  6. package/accordion/Accordion.js +226 -0
  7. package/accordion/Accordion.stories.tsx +307 -0
  8. package/accordion/Accordion.test.js +72 -0
  9. package/accordion/types.d.ts +68 -0
  10. package/accordion/types.js +5 -0
  11. package/accordion-group/AccordionGroup.d.ts +7 -0
  12. package/accordion-group/AccordionGroup.js +168 -0
  13. package/accordion-group/AccordionGroup.stories.tsx +225 -0
  14. package/accordion-group/AccordionGroup.test.js +151 -0
  15. package/accordion-group/types.d.ts +72 -0
  16. package/accordion-group/types.js +5 -0
  17. package/alert/Alert.d.ts +4 -0
  18. package/{dist/alert → alert}/Alert.js +43 -153
  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 +84 -0
  29. package/bleed/Bleed.stories.tsx +342 -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/{dist/box → box}/Box.js +15 -45
  34. package/box/Box.stories.tsx +132 -0
  35. package/box/Box.test.js +18 -0
  36. package/box/types.d.ts +43 -0
  37. package/box/types.js +5 -0
  38. package/button/Button.d.ts +4 -0
  39. package/{dist/button → button}/Button.js +33 -97
  40. package/button/Button.stories.tsx +274 -0
  41. package/button/Button.test.js +35 -0
  42. package/button/types.d.ts +53 -0
  43. package/button/types.js +5 -0
  44. package/card/Card.d.ts +4 -0
  45. package/card/Card.js +163 -0
  46. package/card/Card.stories.tsx +201 -0
  47. package/card/Card.test.js +50 -0
  48. package/card/ice-cream.jpg +0 -0
  49. package/card/types.d.ts +67 -0
  50. package/card/types.js +5 -0
  51. package/checkbox/Checkbox.d.ts +4 -0
  52. package/{dist/checkbox → checkbox}/Checkbox.js +52 -94
  53. package/checkbox/Checkbox.stories.tsx +188 -0
  54. package/checkbox/Checkbox.test.js +78 -0
  55. package/checkbox/types.d.ts +64 -0
  56. package/checkbox/types.js +5 -0
  57. package/chip/Chip.d.ts +4 -0
  58. package/chip/Chip.js +161 -0
  59. package/chip/Chip.stories.tsx +119 -0
  60. package/chip/Chip.test.js +56 -0
  61. package/chip/types.d.ts +45 -0
  62. package/chip/types.js +5 -0
  63. package/{dist/common → common}/OpenSans.css +0 -0
  64. package/{dist/common → common}/RequiredComponent.js +3 -11
  65. package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  66. package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  67. package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  68. package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  69. package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  70. package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  71. package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  72. package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  73. package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  74. package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  75. package/{dist/common → common}/utils.js +0 -0
  76. package/{dist/common → common}/variables.js +315 -408
  77. package/date-input/DateInput.d.ts +4 -0
  78. package/{dist/date-input → date-input}/DateInput.js +80 -108
  79. package/date-input/DateInput.stories.tsx +138 -0
  80. package/date-input/DateInput.test.js +479 -0
  81. package/date-input/types.d.ts +107 -0
  82. package/date-input/types.js +5 -0
  83. package/dialog/Dialog.d.ts +4 -0
  84. package/dialog/Dialog.js +138 -0
  85. package/dialog/Dialog.stories.tsx +212 -0
  86. package/dialog/Dialog.test.js +40 -0
  87. package/dialog/types.d.ts +43 -0
  88. package/dialog/types.js +5 -0
  89. package/dropdown/Dropdown.d.ts +4 -0
  90. package/{dist/dropdown → dropdown}/Dropdown.js +54 -207
  91. package/dropdown/Dropdown.stories.tsx +249 -0
  92. package/dropdown/Dropdown.test.js +189 -0
  93. package/dropdown/types.d.ts +80 -0
  94. package/dropdown/types.js +5 -0
  95. package/file-input/FileInput.d.ts +4 -0
  96. package/file-input/FileInput.js +593 -0
  97. package/file-input/FileInput.stories.tsx +507 -0
  98. package/file-input/FileInput.test.js +457 -0
  99. package/file-input/FileItem.d.ts +14 -0
  100. package/file-input/FileItem.js +186 -0
  101. package/file-input/types.d.ts +112 -0
  102. package/file-input/types.js +5 -0
  103. package/footer/Footer.d.ts +4 -0
  104. package/footer/Footer.js +185 -0
  105. package/footer/Footer.stories.tsx +130 -0
  106. package/footer/Footer.test.js +109 -0
  107. package/footer/Icons.d.ts +2 -0
  108. package/{dist/footer → footer}/Icons.js +15 -15
  109. package/footer/types.d.ts +65 -0
  110. package/footer/types.js +5 -0
  111. package/header/Header.d.ts +7 -0
  112. package/header/Header.js +303 -0
  113. package/header/Header.stories.tsx +172 -0
  114. package/header/Header.test.js +79 -0
  115. package/header/Icons.d.ts +2 -0
  116. package/{dist/header → header}/Icons.js +7 -32
  117. package/header/types.d.ts +47 -0
  118. package/header/types.js +5 -0
  119. package/heading/Heading.d.ts +4 -0
  120. package/{dist/heading → heading}/Heading.js +25 -96
  121. package/heading/Heading.stories.tsx +54 -0
  122. package/heading/Heading.test.js +186 -0
  123. package/heading/types.d.ts +33 -0
  124. package/heading/types.js +5 -0
  125. package/inset/Inset.d.ts +3 -0
  126. package/inset/Inset.js +84 -0
  127. package/inset/Inset.stories.tsx +229 -0
  128. package/inset/types.d.ts +37 -0
  129. package/inset/types.js +5 -0
  130. package/layout/ApplicationLayout.d.ts +10 -0
  131. package/layout/ApplicationLayout.js +218 -0
  132. package/layout/ApplicationLayout.stories.tsx +171 -0
  133. package/{dist/layout → layout}/Icons.js +7 -7
  134. package/layout/types.d.ts +57 -0
  135. package/layout/types.js +5 -0
  136. package/link/Link.d.ts +4 -0
  137. package/link/Link.js +131 -0
  138. package/link/Link.stories.tsx +186 -0
  139. package/link/Link.test.js +83 -0
  140. package/link/types.d.ts +54 -0
  141. package/link/types.js +5 -0
  142. package/list/List.d.ts +4 -0
  143. package/list/List.js +47 -0
  144. package/list/List.stories.tsx +95 -0
  145. package/list/types.d.ts +7 -0
  146. package/list/types.js +5 -0
  147. package/main.d.ts +48 -0
  148. package/{dist/main.js → main.js} +136 -94
  149. package/number-input/NumberInput.d.ts +4 -0
  150. package/number-input/NumberInput.js +76 -0
  151. package/number-input/NumberInput.stories.tsx +115 -0
  152. package/number-input/NumberInput.test.js +506 -0
  153. package/number-input/NumberInputContext.d.ts +4 -0
  154. package/{dist/number-input → number-input}/NumberInputContext.js +5 -2
  155. package/number-input/numberInputContextTypes.d.ts +19 -0
  156. package/number-input/numberInputContextTypes.js +5 -0
  157. package/number-input/types.d.ts +124 -0
  158. package/number-input/types.js +5 -0
  159. package/package.json +34 -20
  160. package/{dist/paginator → paginator}/Icons.js +9 -9
  161. package/paginator/Paginator.d.ts +4 -0
  162. package/paginator/Paginator.js +171 -0
  163. package/paginator/Paginator.stories.tsx +63 -0
  164. package/paginator/Paginator.test.js +266 -0
  165. package/paginator/types.d.ts +38 -0
  166. package/paginator/types.js +5 -0
  167. package/password-input/PasswordInput.d.ts +4 -0
  168. package/{dist/password-input → password-input}/PasswordInput.js +45 -77
  169. package/password-input/PasswordInput.stories.tsx +131 -0
  170. package/password-input/PasswordInput.test.js +180 -0
  171. package/password-input/types.d.ts +110 -0
  172. package/password-input/types.js +5 -0
  173. package/progress-bar/ProgressBar.d.ts +4 -0
  174. package/{dist/progress-bar → progress-bar}/ProgressBar.js +23 -95
  175. package/progress-bar/ProgressBar.stories.jsx +58 -0
  176. package/progress-bar/ProgressBar.test.js +65 -0
  177. package/progress-bar/types.d.ts +37 -0
  178. package/progress-bar/types.js +5 -0
  179. package/quick-nav/QuickNav.d.ts +4 -0
  180. package/quick-nav/QuickNav.js +112 -0
  181. package/quick-nav/QuickNav.stories.tsx +237 -0
  182. package/quick-nav/types.d.ts +21 -0
  183. package/quick-nav/types.js +5 -0
  184. package/radio/Radio.d.ts +4 -0
  185. package/{dist/radio → radio}/Radio.js +23 -59
  186. package/radio/Radio.stories.tsx +192 -0
  187. package/radio/Radio.test.js +71 -0
  188. package/radio/types.d.ts +54 -0
  189. package/radio/types.js +5 -0
  190. package/radio-group/Radio.d.ts +4 -0
  191. package/radio-group/Radio.js +141 -0
  192. package/radio-group/RadioGroup.d.ts +4 -0
  193. package/radio-group/RadioGroup.js +282 -0
  194. package/radio-group/RadioGroup.stories.tsx +100 -0
  195. package/radio-group/RadioGroup.test.js +695 -0
  196. package/radio-group/types.d.ts +114 -0
  197. package/radio-group/types.js +5 -0
  198. package/resultsetTable/ResultsetTable.d.ts +4 -0
  199. package/{dist/resultsetTable → resultsetTable}/ResultsetTable.js +43 -147
  200. package/resultsetTable/ResultsetTable.stories.tsx +275 -0
  201. package/resultsetTable/ResultsetTable.test.js +306 -0
  202. package/resultsetTable/types.d.ts +67 -0
  203. package/resultsetTable/types.js +5 -0
  204. package/row/Row.d.ts +3 -0
  205. package/row/Row.js +127 -0
  206. package/row/Row.stories.tsx +237 -0
  207. package/row/types.d.ts +28 -0
  208. package/row/types.js +5 -0
  209. package/select/Icons.d.ts +10 -0
  210. package/select/Icons.js +93 -0
  211. package/select/Listbox.d.ts +4 -0
  212. package/select/Listbox.js +152 -0
  213. package/select/Option.d.ts +4 -0
  214. package/select/Option.js +110 -0
  215. package/select/Select.d.ts +4 -0
  216. package/select/Select.js +645 -0
  217. package/select/Select.stories.tsx +594 -0
  218. package/select/Select.test.js +2120 -0
  219. package/select/types.d.ts +213 -0
  220. package/select/types.js +5 -0
  221. package/sidenav/Sidenav.d.ts +9 -0
  222. package/{dist/sidenav → sidenav}/Sidenav.js +21 -64
  223. package/sidenav/Sidenav.stories.tsx +182 -0
  224. package/sidenav/Sidenav.test.js +56 -0
  225. package/sidenav/types.d.ts +50 -0
  226. package/sidenav/types.js +5 -0
  227. package/slider/Slider.d.ts +4 -0
  228. package/{dist/slider → slider}/Slider.js +76 -162
  229. package/slider/Slider.stories.tsx +177 -0
  230. package/slider/Slider.test.js +150 -0
  231. package/slider/types.d.ts +82 -0
  232. package/slider/types.js +5 -0
  233. package/spinner/Spinner.d.ts +4 -0
  234. package/spinner/Spinner.js +250 -0
  235. package/spinner/Spinner.stories.jsx +103 -0
  236. package/spinner/Spinner.test.js +64 -0
  237. package/spinner/types.d.ts +32 -0
  238. package/spinner/types.js +5 -0
  239. package/stack/Stack.d.ts +3 -0
  240. package/stack/Stack.js +97 -0
  241. package/stack/Stack.stories.tsx +164 -0
  242. package/stack/types.d.ts +24 -0
  243. package/stack/types.js +5 -0
  244. package/switch/Switch.d.ts +4 -0
  245. package/switch/Switch.js +195 -0
  246. package/switch/Switch.stories.tsx +160 -0
  247. package/switch/Switch.test.js +98 -0
  248. package/switch/types.d.ts +62 -0
  249. package/switch/types.js +5 -0
  250. package/table/Table.d.ts +4 -0
  251. package/{dist/table → table}/Table.js +12 -26
  252. package/table/Table.stories.jsx +277 -0
  253. package/table/Table.test.js +26 -0
  254. package/table/types.d.ts +21 -0
  255. package/table/types.js +5 -0
  256. package/tabs/Tabs.d.ts +4 -0
  257. package/tabs/Tabs.js +211 -0
  258. package/tabs/Tabs.stories.tsx +112 -0
  259. package/tabs/Tabs.test.js +140 -0
  260. package/tabs/types.d.ts +82 -0
  261. package/tabs/types.js +5 -0
  262. package/tabs-nav/NavTabs.d.ts +7 -0
  263. package/tabs-nav/NavTabs.js +106 -0
  264. package/tabs-nav/NavTabs.stories.tsx +170 -0
  265. package/tabs-nav/NavTabs.test.js +82 -0
  266. package/tabs-nav/Tab.d.ts +4 -0
  267. package/tabs-nav/Tab.js +117 -0
  268. package/tabs-nav/types.d.ts +51 -0
  269. package/tabs-nav/types.js +5 -0
  270. package/tag/Tag.d.ts +4 -0
  271. package/tag/Tag.js +183 -0
  272. package/tag/Tag.stories.tsx +142 -0
  273. package/tag/Tag.test.js +60 -0
  274. package/tag/types.d.ts +69 -0
  275. package/tag/types.js +5 -0
  276. package/text/Text.d.ts +7 -0
  277. package/text/Text.js +30 -0
  278. package/text/Text.stories.tsx +19 -0
  279. package/text-input/Suggestion.d.ts +4 -0
  280. package/text-input/Suggestion.js +55 -0
  281. package/text-input/TextInput.d.ts +4 -0
  282. package/{dist/text-input → text-input}/TextInput.js +284 -485
  283. package/text-input/TextInput.stories.tsx +474 -0
  284. package/text-input/TextInput.test.js +1712 -0
  285. package/text-input/types.d.ts +178 -0
  286. package/text-input/types.js +5 -0
  287. package/textarea/Textarea.d.ts +4 -0
  288. package/{dist/textarea → textarea}/Textarea.js +50 -142
  289. package/textarea/Textarea.stories.jsx +157 -0
  290. package/textarea/Textarea.test.js +437 -0
  291. package/textarea/types.d.ts +137 -0
  292. package/textarea/types.js +5 -0
  293. package/toggle-group/ToggleGroup.d.ts +4 -0
  294. package/{dist/toggle-group → toggle-group}/ToggleGroup.js +36 -148
  295. package/toggle-group/ToggleGroup.stories.tsx +173 -0
  296. package/toggle-group/ToggleGroup.test.js +156 -0
  297. package/toggle-group/types.d.ts +105 -0
  298. package/toggle-group/types.js +5 -0
  299. package/useTheme.d.ts +2 -0
  300. package/{dist/useTheme.js → useTheme.js} +2 -2
  301. package/useTranslatedLabels.d.ts +2 -0
  302. package/useTranslatedLabels.js +20 -0
  303. package/wizard/Wizard.d.ts +4 -0
  304. package/wizard/Wizard.js +292 -0
  305. package/wizard/Wizard.stories.tsx +214 -0
  306. package/wizard/Wizard.test.js +141 -0
  307. package/wizard/types.d.ts +64 -0
  308. package/wizard/types.js +5 -0
  309. package/README.md +0 -66
  310. package/babel.config.js +0 -8
  311. package/dist/BackgroundColorContext.js +0 -46
  312. package/dist/ThemeContext.js +0 -250
  313. package/dist/V3Select/V3Select.js +0 -549
  314. package/dist/V3Textarea/V3Textarea.js +0 -264
  315. package/dist/accordion/Accordion.js +0 -353
  316. package/dist/accordion-group/AccordionGroup.js +0 -186
  317. package/dist/alert/index.d.ts +0 -51
  318. package/dist/badge/Badge.js +0 -63
  319. package/dist/card/Card.js +0 -254
  320. package/dist/chip/Chip.js +0 -265
  321. package/dist/date/Date.js +0 -379
  322. package/dist/date-input/index.d.ts +0 -95
  323. package/dist/dialog/Dialog.js +0 -218
  324. package/dist/file-input/FileInput.js +0 -644
  325. package/dist/file-input/FileItem.js +0 -280
  326. package/dist/file-input/index.d.ts +0 -81
  327. package/dist/footer/Footer.js +0 -421
  328. package/dist/header/Header.js +0 -470
  329. package/dist/input-text/Icons.js +0 -22
  330. package/dist/input-text/InputText.js +0 -705
  331. package/dist/layout/ApplicationLayout.js +0 -327
  332. package/dist/link/Link.js +0 -237
  333. package/dist/main.d.ts +0 -8
  334. package/dist/number-input/NumberInput.js +0 -136
  335. package/dist/number-input/index.d.ts +0 -113
  336. package/dist/paginator/Paginator.js +0 -283
  337. package/dist/password-input/index.d.ts +0 -94
  338. package/dist/select/Select.js +0 -1085
  339. package/dist/select/index.d.ts +0 -53
  340. package/dist/spinner/Spinner.js +0 -381
  341. package/dist/switch/Switch.js +0 -222
  342. package/dist/tabs/Tabs.js +0 -343
  343. package/dist/tag/Tag.js +0 -282
  344. package/dist/text-input/index.d.ts +0 -135
  345. package/dist/textarea/index.d.ts +0 -117
  346. package/dist/toggle/Toggle.js +0 -220
  347. package/dist/upload/Upload.js +0 -205
  348. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -135
  349. package/dist/upload/buttons-upload/Icons.js +0 -40
  350. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  351. package/dist/upload/dragAndDropArea/Icons.js +0 -39
  352. package/dist/upload/file-upload/FileToUpload.js +0 -189
  353. package/dist/upload/file-upload/Icons.js +0 -66
  354. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  355. package/dist/upload/transaction/Icons.js +0 -160
  356. package/dist/upload/transaction/Transaction.js +0 -148
  357. package/dist/upload/transactions/Transactions.js +0 -138
  358. package/dist/wizard/Icons.js +0 -65
  359. package/dist/wizard/Wizard.js +0 -405
  360. package/test/Accordion.test.js +0 -33
  361. package/test/AccordionGroup.test.js +0 -125
  362. package/test/Alert.test.js +0 -53
  363. package/test/Box.test.js +0 -10
  364. package/test/Button.test.js +0 -18
  365. package/test/Card.test.js +0 -30
  366. package/test/Checkbox.test.js +0 -45
  367. package/test/Chip.test.js +0 -25
  368. package/test/Date.test.js +0 -397
  369. package/test/DateInput.test.js +0 -242
  370. package/test/Dialog.test.js +0 -23
  371. package/test/Dropdown.test.js +0 -145
  372. package/test/FileInput.test.js +0 -201
  373. package/test/Footer.test.js +0 -94
  374. package/test/Header.test.js +0 -34
  375. package/test/Heading.test.js +0 -83
  376. package/test/InputText.test.js +0 -248
  377. package/test/Link.test.js +0 -43
  378. package/test/NumberInput.test.js +0 -259
  379. package/test/Paginator.test.js +0 -177
  380. package/test/PasswordInput.test.js +0 -83
  381. package/test/ProgressBar.test.js +0 -35
  382. package/test/Radio.test.js +0 -37
  383. package/test/ResultsetTable.test.js +0 -329
  384. package/test/Sidenav.test.js +0 -45
  385. package/test/Slider.test.js +0 -74
  386. package/test/Spinner.test.js +0 -32
  387. package/test/Switch.test.js +0 -45
  388. package/test/Table.test.js +0 -36
  389. package/test/Tabs.test.js +0 -109
  390. package/test/Tag.test.js +0 -32
  391. package/test/TextInput.test.js +0 -732
  392. package/test/Textarea.test.js +0 -193
  393. package/test/ToggleGroup.test.js +0 -85
  394. package/test/Upload.test.js +0 -60
  395. package/test/V3Select.test.js +0 -212
  396. package/test/V3TextArea.test.js +0 -51
  397. package/test/Wizard.test.js +0 -130
  398. package/test/mocks/pngMock.js +0 -1
  399. 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 _Icons = require("../header/Icons");
11
-
12
- var _Icons2 = _interopRequireDefault(require("../footer/Icons"));
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,
@@ -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,12 @@ 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
272
269
  },
273
270
  button: {
274
271
  labelFontLineHeight: globalTokens.type_leading_normal,
@@ -395,23 +392,6 @@ var componentTokens = {
395
392
  disabledIconColor: globalTokens.hal_grey_l_60,
396
393
  focusColor: globalTokens.hal_blue_l_50
397
394
  },
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
395
  dateInput: {
416
396
  pickerFontFamily: globalTokens.type_sans,
417
397
  pickerBackgroundColor: globalTokens.hal_white,
@@ -505,15 +485,14 @@ var componentTokens = {
505
485
  disabledDropLabelFontColor: globalTokens.hal_grey_l_60,
506
486
  focusDropBorderColor: globalTokens.hal_blue_l_50,
507
487
  disabledDropBorderColor: globalTokens.hal_grey_l_60,
508
- focusDropBackgroundColor: globalTokens.color_blue_50,
509
- hoverFileItemIconBackgroundColor: globalTokens.hal_grey_l_95,
488
+ dragoverDropBackgroundColor: globalTokens.color_blue_50,
510
489
  activeFileItemIconBackgrounColor: globalTokens.hal_grey_l_80,
511
490
  errorFileItemBorderColor: globalTokens.hal_red_s_41,
512
491
  errorFileItemBackgroundColor: globalTokens.color_red_50,
513
- errorFileItemIconBackgroundColor: globalTokens.color_red_700,
492
+ errorFilePreviewBackgroundColor: globalTokens.color_red_700,
514
493
  errorFileItemIconColor: globalTokens.hal_red_s_41,
515
494
  fileItemIconBackgroundColor: globalTokens.hal_grey_l_95,
516
- fileItemIconColor: globalTokens.color_grey_600,
495
+ deleteFileItemColor: globalTokens.hal_black,
517
496
  errorMessageFontColor: globalTokens.hal_red_s_41,
518
497
  labelFontFamily: globalTokens.type_sans,
519
498
  labelFontSize: globalTokens.type_scale_02,
@@ -533,13 +512,19 @@ var componentTokens = {
533
512
  errorMessageFontFamily: globalTokens.type_sans,
534
513
  errorMessageFontSize: globalTokens.type_scale_01,
535
514
  errorMessageFontWeight: globalTokens.type_regular,
536
- errorMessageLineHeight: globalTokens.type_scale_05,
515
+ errorMessageLineHeight: globalTokens.type_leading_normal,
537
516
  dropBorderThickness: globalTokens.border_width_1,
538
517
  dropBorderStyle: globalTokens.border_dashed,
539
518
  dropBorderRadius: globalTokens.border_radius_large,
540
519
  fileItemBorderThickness: globalTokens.border_width_1,
541
520
  fileItemBorderStyle: globalTokens.border_solid,
542
- fileItemBorderRadius: globalTokens.border_radius_medium
521
+ fileItemBorderRadius: globalTokens.border_radius_medium,
522
+ hoverDeleteFileItemBackgroundColor: globalTokens.color_grey_a_100,
523
+ activeDeleteFileItemBackgroundColor: globalTokens.color_grey_a_300,
524
+ focusDeleteFileItemBorderColor: globalTokens.hal_blue_l_50,
525
+ filePreviewBackgroundColor: globalTokens.hal_grey_l_95,
526
+ filePreviewIconColor: globalTokens.color_grey_600,
527
+ errorFilePreviewIconColor: globalTokens.hal_red_s_41
543
528
  },
544
529
  footer: {
545
530
  height: "124px",
@@ -559,7 +544,7 @@ var componentTokens = {
559
544
  copyrightFontStyle: globalTokens.type_normal,
560
545
  copyrightFontWeight: globalTokens.type_regular,
561
546
  copyrightFontColor: globalTokens.hal_white,
562
- logo: _Icons2["default"],
547
+ logo: "",
563
548
  logoHeight: "32px",
564
549
  logoWidth: "auto",
565
550
  socialLinksSize: "24px",
@@ -577,8 +562,8 @@ var componentTokens = {
577
562
  hamburguerTextTransform: globalTokens.type_uppercase,
578
563
  hamburguerIconColor: globalTokens.hal_black,
579
564
  hamburguerHoverColor: globalTokens.mediumGreyBlack,
580
- logo: _Icons.dxcLogo,
581
- logoResponsive: _Icons.dxcLogo,
565
+ logo: "",
566
+ logoResponsive: "",
582
567
  logoHeight: "40px",
583
568
  logoWidth: "auto",
584
569
  menuBackgroundColor: globalTokens.hal_white,
@@ -602,99 +587,40 @@ var componentTokens = {
602
587
  heading: {
603
588
  level1FontColor: globalTokens.inherit,
604
589
  level1FontFamily: globalTokens.type_sans,
605
- level1FontSize: globalTokens.type_scale_08,
590
+ level1FontSize: globalTokens.type_scale_07,
606
591
  level1FontStyle: globalTokens.type_normal,
607
- level1FontWeight: globalTokens.type_regular,
592
+ level1FontWeight: globalTokens.type_semibold,
608
593
  level1LineHeight: globalTokens.type_leading_compact_01,
609
594
  level1LetterSpacing: globalTokens.type_spacing_tight_01,
610
595
  level2FontColor: globalTokens.inherit,
611
596
  level2FontFamily: globalTokens.type_sans,
612
- level2FontSize: globalTokens.type_scale_07,
597
+ level2FontSize: globalTokens.type_scale_05,
613
598
  level2FontStyle: globalTokens.type_normal,
614
- level2FontWeight: globalTokens.type_regular,
599
+ level2FontWeight: globalTokens.type_semibold,
615
600
  level2LineHeight: globalTokens.type_leading_normal,
616
601
  level2LetterSpacing: globalTokens.type_spacing_normal,
617
602
  level3FontColor: globalTokens.inherit,
618
603
  level3FontFamily: globalTokens.type_sans,
619
- level3FontSize: globalTokens.type_scale_06,
604
+ level3FontSize: globalTokens.type_scale_04,
620
605
  level3FontStyle: globalTokens.type_normal,
621
- level3FontWeight: globalTokens.type_regular,
606
+ level3FontWeight: globalTokens.type_semibold,
622
607
  level3LineHeight: globalTokens.type_leading_compact_01,
623
608
  level3LetterSpacing: globalTokens.type_spacing_wide_01,
624
609
  level4FontColor: globalTokens.inherit,
625
610
  level4FontFamily: globalTokens.type_sans,
626
- level4FontSize: globalTokens.type_scale_05,
611
+ level4FontSize: globalTokens.type_scale_03,
627
612
  level4FontStyle: globalTokens.type_normal,
628
- level4FontWeight: globalTokens.type_regular,
613
+ level4FontWeight: globalTokens.type_semibold,
629
614
  level4LineHeight: globalTokens.type_leading_normal,
630
615
  level4LetterSpacing: globalTokens.type_spacing_normal,
631
616
  level5FontColor: globalTokens.inherit,
632
617
  level5FontFamily: globalTokens.type_sans,
633
- level5FontSize: globalTokens.type_scale_04,
618
+ level5FontSize: globalTokens.type_scale_02,
634
619
  level5FontStyle: globalTokens.type_normal,
635
- level5FontWeight: globalTokens.type_regular,
620
+ level5FontWeight: globalTokens.type_semibold,
636
621
  level5LineHeight: globalTokens.type_leading_normal,
637
622
  level5LetterSpacing: globalTokens.type_spacing_wide_01
638
623
  },
639
- inputText: {
640
- fontFamily: globalTokens.type_sans,
641
- assistiveTextFontColor: globalTokens.black,
642
- assistiveTextFontColorOnDark: globalTokens.white,
643
- assistiveTextFontSize: globalTokens.type_scale_01,
644
- assistiveTextFontStyle: globalTokens.type_normal,
645
- assistiveTextFontWeight: globalTokens.type_regular,
646
- disabledColor: globalTokens.lighterBlack,
647
- disabledColorOnDark: "#575757",
648
- errorColor: globalTokens.red,
649
- errorColorOnDark: globalTokens.hal_red_l_60,
650
- optionBackgroundColor: globalTokens.white,
651
- optionBorderColor: globalTokens.black,
652
- optionBorderThickness: "0px",
653
- optionBorderStyle: "solid",
654
- optionFontColor: globalTokens.black,
655
- optionFontColorOnDark: globalTokens.white,
656
- optionFontSize: globalTokens.type_scale_03,
657
- optionFontStyle: globalTokens.type_normal,
658
- optionFontWeight: globalTokens.type_regular,
659
- optionPaddingBottom: "6px",
660
- optionPaddingTop: "6px",
661
- scrollBarThumbColor: globalTokens.darkGrey,
662
- scrollBarTrackColor: globalTokens.lightGrey,
663
- hoverOptionColor: globalTokens.black,
664
- hoverOptionBackgroundColor: globalTokens.lightWhite,
665
- hoverOptionBackgroundColorOnDark: globalTokens.mediumGrey,
666
- selectedOptionBackgroundColor: globalTokens.lightGrey,
667
- selectedOptionBackgroundColorOnDark: globalTokens.lightGrey,
668
- labelFontColor: globalTokens.black,
669
- labelFontColorOnDark: globalTokens.white,
670
- labelFontSize: globalTokens.type_scale_03,
671
- labelFontStyle: globalTokens.type_normal,
672
- labelFontWeight: globalTokens.type_regular,
673
- valueFontColor: globalTokens.black,
674
- valueFontColorOnDark: globalTokens.white,
675
- valueFontSize: globalTokens.type_scale_03,
676
- valueFontStyle: globalTokens.type_normal,
677
- valueFontWeight: globalTokens.type_regular,
678
- prefixIconColor: globalTokens.black,
679
- prefixIconColorOnDark: globalTokens.white,
680
- prefixLabelFontColor: globalTokens.black,
681
- prefixLabelFontColorOnDark: globalTokens.white,
682
- prefixLabelFontSize: globalTokens.type_scale_03,
683
- prefixLabelFontStyle: globalTokens.type_normal,
684
- prefixLabelFontWeight: globalTokens.type_regular,
685
- suffixIconColor: globalTokens.black,
686
- suffixIconColorOnDark: globalTokens.white,
687
- suffixLabelFontColor: globalTokens.black,
688
- suffixLabelFontColorOnDark: globalTokens.white,
689
- suffixLabelFontSize: globalTokens.type_scale_03,
690
- suffixLabelFontStyle: globalTokens.type_normal,
691
- suffixLabelFontWeight: globalTokens.type_regular,
692
- underlineColor: globalTokens.black,
693
- underlineColorOnDark: globalTokens.white,
694
- underlineFocusColor: globalTokens.black,
695
- underlineFocusColorOnDark: globalTokens.white,
696
- underlineThickness: "1px"
697
- },
698
624
  textInput: {
699
625
  fontFamily: globalTokens.type_sans,
700
626
  enabledBorderColor: globalTokens.hal_black,
@@ -709,8 +635,10 @@ var componentTokens = {
709
635
  disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
710
636
  errorBorderColor: globalTokens.hal_red_s_41,
711
637
  errorBorderColorOnDark: globalTokens.hal_red_l_60,
712
- hoverErrorBorderColor: "#fe0123",
638
+ hoverErrorBorderColor: globalTokens.color_red_600,
713
639
  hoverErrorBorderColorOnDark: "#fe677b",
640
+ inputMarginTop: globalTokens.spacing_02,
641
+ inputMarginBottom: globalTokens.spacing_02,
714
642
  errorMessageColor: globalTokens.hal_red_s_41,
715
643
  errorMessageColorOnDark: globalTokens.hal_red_l_60,
716
644
  errorIconColor: globalTokens.hal_red_s_41,
@@ -740,7 +668,7 @@ var componentTokens = {
740
668
  disabledSuffixColor: globalTokens.hal_grey_l_75,
741
669
  disabledPrefixColorOnDark: globalTokens.hal_grey_l_60,
742
670
  disabledSuffixColorOnDark: globalTokens.hal_grey_l_60,
743
- placeholderFontColor: "#808080",
671
+ placeholderFontColor: "#000000b3",
744
672
  placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
745
673
  disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
746
674
  disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
@@ -771,20 +699,25 @@ var componentTokens = {
771
699
  focusActionBorderColorOnDark: globalTokens.hal_blue_l_50,
772
700
  activeActionBackgroundColor: globalTokens.hal_grey_l_80,
773
701
  activeActionBackgroundColorOnDark: globalTokens.hal_grey_l_60,
702
+ listDialogBackgroundColor: globalTokens.hal_white,
703
+ listDialogBorderColor: globalTokens.hal_grey_l_75,
704
+ listOptionDividerColor: globalTokens.hal_grey_l_90,
774
705
  listOptionFontColor: globalTokens.hal_black,
775
- listOptionFontSize: globalTokens.type_scale_03,
706
+ listOptionFontSize: globalTokens.type_scale_02,
776
707
  listOptionFontStyle: globalTokens.type_normal,
777
708
  listOptionFontWeight: globalTokens.type_regular,
778
709
  systemMessageFontColor: globalTokens.hal_grey_s_40,
779
- errorMessageBorderColor: globalTokens.hal_red_s_41,
780
- errorMessageBackgroundColor: globalTokens.hal_red_l_95,
710
+ errorListDialogFontColor: globalTokens.hal_black,
711
+ errorListDialogBackgroundColor: globalTokens.color_red_50,
712
+ errorListDialogBorderColor: globalTokens.hal_red_s_41,
781
713
  hoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
782
- activeListOptionBackgroundColor: globalTokens.hal_grey_l_80
714
+ activeListOptionBackgroundColor: globalTokens.hal_grey_l_80,
715
+ focusListOptionBorderColor: globalTokens.hal_blue_l_50
783
716
  },
784
717
  link: {
785
718
  fontColor: globalTokens.hal_blue_s_35,
786
719
  fontFamily: globalTokens.inherit,
787
- fontSize: globalTokens.type_scale_root,
720
+ fontSize: globalTokens.inherit,
788
721
  fontStyle: globalTokens.type_normal,
789
722
  fontWeight: globalTokens.type_regular,
790
723
  iconSize: "16px",
@@ -809,15 +742,15 @@ var componentTokens = {
809
742
  fontStyle: globalTokens.type_normal,
810
743
  fontWeight: globalTokens.type_regular,
811
744
  fontTextTransform: "none",
812
- height: "64px",
813
- width: "100%",
814
- marginRight: "40px",
815
- marginLeft: "20px",
745
+ verticalPadding: "0.75rem",
746
+ horizontalPadding: "2rem",
747
+ marginRight: "2rem",
748
+ marginLeft: "2rem",
816
749
  itemsPerPageSelectorMarginLeft: "0px",
817
- itemsPerPageSelectorMarginRight: "30px",
750
+ itemsPerPageSelectorMarginRight: "1rem",
818
751
  pageSelectorMarginRight: "30px",
819
752
  pageSelectorMarginLeft: "0px",
820
- totalItemsContainerMarginRight: "30px",
753
+ totalItemsContainerMarginRight: "3rem",
821
754
  totalItemsContainerMarginLeft: "0px"
822
755
  },
823
756
  progressBar: {
@@ -849,6 +782,24 @@ var componentTokens = {
849
782
  overlayColor: globalTokens.black,
850
783
  overlayOpacity: "0.8"
851
784
  },
785
+ quickNav: {
786
+ fontColor: globalTokens.hal_grey_s_40,
787
+ hoverFontColor: globalTokens.hal_purple_d_70,
788
+ selectedFontColor: globalTokens.hal_purple_s_38,
789
+ dividerBorderColor: globalTokens.hal_grey_l_75,
790
+ focusBorderColor: globalTokens.hal_blue_l_50,
791
+ focusBorderStyle: globalTokens.border_solid,
792
+ focusBorderThickness: globalTokens.border_width_2,
793
+ focusBorderRadius: globalTokens.border_width_2,
794
+ paddingTop: globalTokens.spacing_03,
795
+ paddingBottom: globalTokens.spacing_03,
796
+ paddingLeft: globalTokens.spacing_05,
797
+ paddingRight: globalTokens.spacing_05,
798
+ fontFamily: globalTokens.type_sans,
799
+ fontSize: globalTokens.type_scale_02,
800
+ fontStyle: globalTokens.type_normal,
801
+ fontWeight: globalTokens.type_regular
802
+ },
852
803
  radio: {
853
804
  circleLabelSpacing: "10px",
854
805
  circleSize: "24px",
@@ -867,88 +818,102 @@ var componentTokens = {
867
818
  fontStyle: globalTokens.type_normal,
868
819
  fontWeight: globalTokens.type_regular
869
820
  },
870
- select: {
821
+ radioGroup: {
871
822
  fontFamily: globalTokens.type_sans,
872
- enabledBorderColor: globalTokens.hal_black,
873
- enabledBorderColorOnDark: globalTokens.hal_white,
874
- hoverBorderColor: globalTokens.hal_purple_l_65,
875
- hoverBorderColorOnDark: globalTokens.hal_purple_l_65,
823
+ radioInputColor: globalTokens.hal_blue_l_45,
824
+ hoverRadioInputColor: globalTokens.hal_blue_s_35,
876
825
  focusBorderColor: globalTokens.hal_blue_l_50,
877
- focusBorderColorOnDark: globalTokens.hal_blue_l_50,
878
- disabledBorderColor: globalTokens.hal_grey_l_60,
879
- disabledBorderColorOnDark: globalTokens.hal_grey_l_60,
880
- disabledContainerFillColor: globalTokens.hal_grey_l_95,
881
- disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
882
- errorBorderColor: globalTokens.hal_red_s_41,
883
- errorBorderColorOnDark: globalTokens.hal_red_l_60,
884
- hoverErrorBorderColor: "#fe0123",
885
- hoverErrorBorderColorOnDark: "#fe677b",
826
+ activeRadioInputColor: globalTokens.hal_blue_d_20,
827
+ errorRadioInputColor: globalTokens.hal_red_s_41,
828
+ hoverErrorRadioInputColor: globalTokens.hal_red_d_30,
829
+ activeErrorRadioInputColor: globalTokens.hal_red_d_20,
830
+ readonlyRadioInputColor: globalTokens.hal_grey_l_60,
831
+ hoverReadonlyRadioInputColor: globalTokens.color_grey_600,
832
+ activeReadonlyRadioInputColor: globalTokens.hal_grey_s_40,
833
+ disabledRadioInputColor: globalTokens.hal_grey_l_60,
834
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
835
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
836
+ disabledRadioInputLabelFontColor: globalTokens.hal_grey_l_60,
837
+ errorMessageColor: globalTokens.hal_red_s_41,
838
+ labelFontColor: globalTokens.hal_black,
839
+ labelFontSize: globalTokens.type_scale_02,
840
+ labelFontStyle: globalTokens.type_normal,
841
+ labelFontWeight: globalTokens.type_semibold,
842
+ labelLineHeight: globalTokens.type_leading_loose_01,
843
+ optionalLabelFontWeight: globalTokens.type_regular,
844
+ helperTextFontColor: globalTokens.hal_black,
845
+ helperTextFontSize: globalTokens.type_scale_01,
846
+ helperTextFontStyle: globalTokens.type_normal,
847
+ helperTextFontWeight: globalTokens.type_regular,
848
+ helperTextLineHeight: globalTokens.type_leading_normal,
849
+ radioInputLabelFontColor: globalTokens.hal_black,
850
+ radioInputLabelFontSize: globalTokens.type_scale_02,
851
+ radioInputLabelFontStyle: globalTokens.type_normal,
852
+ radioInputLabelFontWeight: globalTokens.type_regular,
853
+ radioInputLabelLineHeight: globalTokens.type_leading_loose_01,
854
+ groupLabelMargin: globalTokens.spacing_03,
855
+ radioInputLabelMargin: globalTokens.spacing_03,
856
+ groupVerticalGutter: globalTokens.spacing_02,
857
+ groupHorizontalGutter: globalTokens.spacing_07
858
+ },
859
+ select: {
860
+ fontFamily: globalTokens.type_sans,
861
+ disabledColor: globalTokens.hal_grey_l_60,
862
+ enabledInputBorderColor: globalTokens.hal_black,
863
+ hoverInputBorderColor: globalTokens.hal_purple_l_65,
864
+ focusInputBorderColor: globalTokens.hal_blue_l_50,
865
+ errorInputBorderColor: globalTokens.hal_red_s_41,
866
+ hoverInputErrorBorderColor: globalTokens.color_red_600,
867
+ disabledInputBorderColor: globalTokens.hal_grey_l_60,
868
+ disabledInputBackgroundColor: globalTokens.hal_grey_l_95,
869
+ inputMarginTop: globalTokens.spacing_02,
870
+ inputMarginBottom: globalTokens.spacing_02,
886
871
  errorMessageColor: globalTokens.hal_red_s_41,
887
- errorMessageColorOnDark: globalTokens.hal_red_l_60,
888
872
  errorIconColor: globalTokens.hal_red_s_41,
889
- errorIconColorOnDark: globalTokens.hal_red_l_60,
890
873
  labelFontColor: globalTokens.hal_black,
891
- labelFontColorOnDark: globalTokens.hal_white,
892
874
  labelFontSize: globalTokens.type_scale_02,
893
875
  labelFontStyle: globalTokens.type_normal,
894
876
  labelFontWeight: globalTokens.type_semibold,
895
- disabledLabelFontColor: globalTokens.hal_grey_l_60,
896
- disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
877
+ labelLineHeight: globalTokens.type_leading_loose_01,
897
878
  optionalLabelFontWeight: globalTokens.type_regular,
898
879
  helperTextFontColor: globalTokens.hal_black,
899
- helperTextFontColorOnDark: globalTokens.hal_white,
900
880
  helperTextFontSize: globalTokens.type_scale_01,
901
881
  helperTextFontStyle: globalTokens.type_normal,
902
882
  helperTextFontWeight: globalTokens.type_regular,
903
- disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
904
- disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
905
- placeholderFontColor: "#808080",
906
- placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
907
- disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
908
- disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
883
+ helperTextLineHeight: globalTokens.type_leading_normal,
884
+ placeholderFontColor: "#000000b3",
909
885
  valueFontColor: globalTokens.hal_black,
910
- valueFontColorOnDark: globalTokens.hal_white,
911
886
  valueFontSize: globalTokens.type_scale_03,
912
887
  valueFontStyle: globalTokens.type_normal,
913
888
  valueFontWeight: globalTokens.type_regular,
914
- disabledValueFontColor: globalTokens.hal_grey_l_60,
915
- disabledValueFontColorOnDark: globalTokens.hal_grey_l_60,
916
889
  actionIconColor: globalTokens.hal_black,
917
- actionIconColorOnDark: globalTokens.hal_white,
918
- disabledActionIconColor: globalTokens.hal_grey_l_60,
919
- disabledActionIconColorOnDark: globalTokens.hal_grey_l_60,
920
890
  hoverActionIconColor: globalTokens.hal_black,
921
- hoverActionIconColorOnDark: globalTokens.hal_white,
922
- focusActionIconColor: globalTokens.hal_black,
923
- focusActionIconColorOnDark: globalTokens.hal_white,
924
891
  activeActionIconColor: globalTokens.hal_black,
925
- activeActionIconColorOnDark: globalTokens.hal_black,
926
892
  actionBackgroundColor: globalTokens.transparent,
927
- actionBackgroundColorOnDark: globalTokens.transparent,
928
- disabledActionBackgroundColor: globalTokens.transparent,
929
- disabledActionBackgroundColorOnDark: globalTokens.transparent,
930
893
  hoverActionBackgroundColor: globalTokens.hal_grey_l_95,
931
- hoverActionBackgroundColorOnDark: globalTokens.hal_grey_s_40,
932
- focusActionBorderColor: globalTokens.hal_blue_l_50,
933
- focusActionBorderColorOnDark: globalTokens.hal_blue_l_50,
934
894
  activeActionBackgroundColor: globalTokens.hal_grey_l_80,
935
- activeActionBackgroundColorOnDark: globalTokens.hal_grey_l_60,
936
895
  listOptionFontColor: globalTokens.hal_black,
937
896
  listOptionFontSize: globalTokens.type_scale_02,
938
897
  listOptionFontStyle: globalTokens.type_normal,
939
898
  listOptionFontWeight: globalTokens.type_regular,
899
+ listOptionIconColor: globalTokens.hal_black,
900
+ listOptionDividerColor: globalTokens.hal_grey_l_90,
901
+ listGroupLabelFontWeight: globalTokens.type_semibold,
902
+ focusListOptionBorderColor: globalTokens.hal_blue_l_50,
940
903
  systemMessageFontColor: globalTokens.hal_grey_s_40,
941
- errorMessageBorderColor: globalTokens.hal_red_s_41,
942
- errorMessageBackgroundColor: globalTokens.hal_red_l_95,
943
- hoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
944
- activeListOptionBackgroundColor: globalTokens.hal_grey_l_90,
945
- arrowColor: globalTokens.hal_black,
946
- arrowColorOnDark: globalTokens.hal_white,
947
- disabledArrowColor: globalTokens.hal_grey_l_60,
948
- disabledArrowColorOnDark: globalTokens.hal_grey_l_60,
949
- enabledListBorderColor: globalTokens.hal_grey_l_80,
950
- listOptionBorderBottomColor: globalTokens.hal_grey_l_90,
951
- selectedListOptionBackgroundColor: globalTokens.hal_grey_l_90,
904
+ collapseIndicatorColor: globalTokens.hal_black,
905
+ listDialogBackgroundColor: globalTokens.hal_white,
906
+ listDialogBorderColor: globalTokens.hal_grey_l_75,
907
+ selectedListOptionBackgroundColor: globalTokens.hal_blue_l_95,
908
+ selectedHoverListOptionBackgroundColor: globalTokens.color_blue_200,
909
+ selectedActiveListOptionBackgroundColor: globalTokens.hal_blue_l_80,
910
+ selectedListOptionIconColor: globalTokens.hal_blue_d_20,
911
+ unselectedHoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
912
+ unselectedActiveListOptionBackgroundColor: globalTokens.hal_grey_l_90,
913
+ selectionIndicatorFontColor: globalTokens.hal_black,
914
+ selectionIndicatorFontSize: globalTokens.type_scale_01,
915
+ selectionIndicatorFontStyle: globalTokens.type_regular,
916
+ selectionIndicatorFontWeight: globalTokens.type_normal,
952
917
  selectionIndicatorBorderColor: globalTokens.hal_grey_l_75,
953
918
  selectionIndicatorBackgroundColor: globalTokens.color_grey_50,
954
919
  enabledSelectionIndicatorActionBackgroundColor: globalTokens.transparent,
@@ -958,65 +923,6 @@ var componentTokens = {
958
923
  activeSelectionIndicatorActionBackgroundColor: globalTokens.hal_grey_l_80,
959
924
  activeSelectionIndicatorActionIconColor: globalTokens.hal_black
960
925
  },
961
- V3Select: {
962
- fontFamily: globalTokens.type_sans,
963
- assistiveTextFontColor: globalTokens.hal_black,
964
- assistiveTextFontColorOnDark: globalTokens.hal_white,
965
- assistiveTextFontSize: globalTokens.type_scale_01,
966
- assistiveTextFontStyle: globalTokens.type_normal,
967
- assistiveTextFontWeight: globalTokens.type_regular,
968
- labelFontColor: globalTokens.hal_black,
969
- labelFontColorOnDark: globalTokens.hal_white,
970
- labelFontSize: globalTokens.type_scale_03,
971
- labelFontStyle: globalTokens.type_normal,
972
- labelFontWeight: globalTokens.type_regular,
973
- disabledColor: globalTokens.lighterBlack,
974
- disabledColorOnDark: "#575757",
975
- errorColor: globalTokens.red,
976
- errorColorOnDark: globalTokens.hal_red_l_60,
977
- optionBackgroundColor: globalTokens.hal_white,
978
- optionBorderColor: globalTokens.hal_black,
979
- optionBorderThickness: "0px",
980
- optionBorderStyle: "solid",
981
- optionFontColor: globalTokens.hal_black,
982
- optionFontColorOnDark: globalTokens.hal_white,
983
- optionFontSize: globalTokens.type_scale_root,
984
- optionFontStyle: globalTokens.type_normal,
985
- optionFontWeight: globalTokens.type_regular,
986
- optionPaddingBottom: "6px",
987
- optionPaddingTop: "6px",
988
- scrollBarThumbColor: globalTokens.hal_grey_s_40,
989
- scrollBarTrackColor: globalTokens.lightGrey,
990
- optionIconColor: globalTokens.hal_black,
991
- optionIconColorOnDark: globalTokens.hal_white,
992
- optionIconSpacing: "12px",
993
- optionIconSize: "20px",
994
- optionCheckboxSpacing: "12px",
995
- hoverOptionBackgroundColor: globalTokens.hal_grey_l_95,
996
- hoverOptionBackgroundColorOnDark: globalTokens.hal_grey_l_95,
997
- activeOptionBackgroundColor: globalTokens.hal_grey_l_80,
998
- activeOptionBackgroundColorOnDark: globalTokens.hal_grey_l_80,
999
- selectedOptionBackgroundColor: globalTokens.lightGrey,
1000
- selectedOptionBackgroundColorOnDark: globalTokens.lightGrey,
1001
- underlineColor: globalTokens.hal_black,
1002
- underlineColorOnDark: globalTokens.hal_white,
1003
- underlineFocusColor: globalTokens.hal_black,
1004
- underlineFocusColorOnDark: globalTokens.hal_white,
1005
- underlineThickness: "1px",
1006
- valueFontColor: globalTokens.hal_black,
1007
- valueFontColorOnDark: globalTokens.hal_white,
1008
- valueFontSize: globalTokens.type_scale_03,
1009
- valueFontStyle: globalTokens.type_normal,
1010
- valueFontWeight: globalTokens.type_regular,
1011
- valueIconColor: globalTokens.hal_black,
1012
- valueIconColorOnDark: globalTokens.hal_white,
1013
- valueIconSize: "20px",
1014
- valueIconSpacing: "12px",
1015
- arrowColor: globalTokens.hal_black,
1016
- arrowColorOnDark: globalTokens.hal_white,
1017
- focusColor: globalTokens.hal_blue_l_50,
1018
- focusColorOnDark: globalTokens.hal_blue_l_50
1019
- },
1020
926
  sidenav: {
1021
927
  backgroundColor: globalTokens.hal_grey_l_95,
1022
928
  arrowContainerColor: globalTokens.hal_grey_l_90,
@@ -1053,9 +959,13 @@ var componentTokens = {
1053
959
  },
1054
960
  slider: {
1055
961
  fontFamily: globalTokens.type_sans,
1056
- fontSize: globalTokens.type_scale_03,
1057
- fontStyle: globalTokens.type_normal,
1058
- fontWeight: globalTokens.type_regular,
962
+ limitValuesFontColor: globalTokens.hal_black,
963
+ limitValuesFontColorOnDark: globalTokens.hal_white,
964
+ limitValuesFontSize: globalTokens.type_scale_03,
965
+ limitValuesFontStyle: globalTokens.type_normal,
966
+ limitValuesFontWeight: globalTokens.type_regular,
967
+ limitValuesFontLetterSpacing: globalTokens.type_spacing_normal,
968
+ disabledLimitValuesFontColor: globalTokens.hal_grey_l_60,
1059
969
  labelFontFamily: globalTokens.type_sans,
1060
970
  labelFontSize: globalTokens.type_scale_02,
1061
971
  labelFontStyle: globalTokens.type_normal,
@@ -1069,9 +979,13 @@ var componentTokens = {
1069
979
  fontColor: globalTokens.hal_black,
1070
980
  fontColorOnDark: globalTokens.hal_white,
1071
981
  labelFontColor: globalTokens.hal_black,
982
+ labelFontColorOnDark: globalTokens.hal_white,
1072
983
  helperTextFontColor: globalTokens.hal_black,
1073
- disabledFontColor: globalTokens.hal_grey_l_60,
1074
- fontLetterSpacing: globalTokens.type_spacing_normal,
984
+ helperTextFontColorOnDark: globalTokens.hal_white,
985
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
986
+ disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
987
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
988
+ disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
1075
989
  thumbHeight: "12px",
1076
990
  thumbWidth: "12px",
1077
991
  hoverThumbHeight: "14px",
@@ -1119,7 +1033,7 @@ var componentTokens = {
1119
1033
  },
1120
1034
  spinner: {
1121
1035
  trackCircleColor: "#5f249f",
1122
- trackCircleColorOnDark: "#a46ede",
1036
+ trackCircleColorOverlay: "#a46ede",
1123
1037
  totalCircleColor: globalTokens.white,
1124
1038
  labelFontFamily: globalTokens.type_sans,
1125
1039
  labelFontSize: globalTokens.type_scale_02,
@@ -1153,30 +1067,30 @@ var componentTokens = {
1153
1067
  "switch": {
1154
1068
  checkedTrackBackgroundColor: globalTokens.hal_purple_s_38,
1155
1069
  checkedTrackBackgroundColorOnDark: globalTokens.hal_purple_s_38,
1156
- checkedThumbBackgroundColor: globalTokens.white,
1157
- checkedThumbBackgroundColorOnDark: globalTokens.white,
1158
- uncheckedTrackBackgroundColor: globalTokens.lightGrey,
1159
- uncheckedTrackBackgroundColorOnDark: globalTokens.lightGrey,
1160
- uncheckedThumbBackgroundColor: globalTokens.white,
1161
- uncheckedThumbBackgroundColorOnDark: globalTokens.white,
1162
- disabledCheckedTrackBackgroundColor: globalTokens.lightPurple,
1070
+ checkedThumbBackgroundColor: globalTokens.hal_white,
1071
+ checkedThumbBackgroundColorOnDark: globalTokens.hal_white,
1072
+ uncheckedTrackBackgroundColor: globalTokens.hal_grey_l_75,
1073
+ uncheckedTrackBackgroundColorOnDark: globalTokens.hal_grey_l_75,
1074
+ uncheckedThumbBackgroundColor: globalTokens.hal_white,
1075
+ uncheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
1076
+ disabledCheckedTrackBackgroundColor: globalTokens.hal_purple_l_95,
1163
1077
  disabledCheckedTrackBackgroundColorOnDark: "#1c0b24",
1164
- disabledCheckedThumbBackgroundColor: globalTokens.white,
1165
- disabledCheckedThumbBackgroundColorOnDark: globalTokens.white,
1166
- disabledUncheckedTrackBackgroundColor: globalTokens.lightWhite,
1078
+ disabledCheckedThumbBackgroundColor: globalTokens.hal_white,
1079
+ disabledCheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
1080
+ disabledUncheckedTrackBackgroundColor: globalTokens.hal_grey_l_95,
1167
1081
  disabledUncheckedTrackBackgroundColorOnDark: "#363636",
1168
- disabledUncheckedThumbBackgroundColor: globalTokens.white,
1169
- disabledUncheckedThumbBackgroundColorOnDark: globalTokens.white,
1170
- disabledLabelFontColor: globalTokens.lighterBlack,
1082
+ disabledUncheckedThumbBackgroundColor: globalTokens.hal_white,
1083
+ disabledUncheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
1084
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1171
1085
  disabledLabelFontColorOnDark: "#575757",
1172
1086
  disabledLabelFontStyle: globalTokens.type_normal,
1173
1087
  labelFontFamily: globalTokens.type_sans,
1174
1088
  labelFontSize: globalTokens.type_scale_root,
1175
1089
  labelFontStyle: globalTokens.type_normal,
1176
1090
  labelFontWeight: globalTokens.type_regular,
1177
- labelFontColor: globalTokens.black,
1178
- labelFontColorOnDark: globalTokens.white,
1179
- thumbFocusColor: globalTokens.blue,
1091
+ labelFontColor: globalTokens.hal_black,
1092
+ labelFontColorOnDark: globalTokens.hal_white,
1093
+ thumbFocusColor: globalTokens.hal_blue_l_50,
1180
1094
  thumbFocusColorOnDark: "#1682FF",
1181
1095
  thumbHeight: "24px",
1182
1096
  thumbWidth: "24px",
@@ -1254,6 +1168,7 @@ var componentTokens = {
1254
1168
  disabledFontColor: "#999999",
1255
1169
  disabledIconColor: "#999999",
1256
1170
  disabledFontStyle: globalTokens.type_normal,
1171
+ disabledBadgeBackgroundColor: "#0000004D",
1257
1172
  hoverBackgroundColor: "#f2eafa",
1258
1173
  pressedBackgroundColor: "#e5d5f6",
1259
1174
  pressedFontWeight: globalTokens.type_semibold,
@@ -1289,8 +1204,10 @@ var componentTokens = {
1289
1204
  disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
1290
1205
  errorBorderColor: globalTokens.hal_red_s_41,
1291
1206
  errorBorderColorOnDark: globalTokens.hal_red_l_60,
1292
- hoverErrorBorderColor: "#fe0123",
1207
+ hoverErrorBorderColor: globalTokens.color_red_600,
1293
1208
  hoverErrorBorderColorOnDark: "#fe677b",
1209
+ inputMarginTop: globalTokens.spacing_02,
1210
+ inputMarginBottom: globalTokens.spacing_02,
1294
1211
  errorMessageColor: globalTokens.hal_red_s_41,
1295
1212
  errorMessageColorOnDark: globalTokens.hal_red_l_60,
1296
1213
  labelFontColor: globalTokens.hal_black,
@@ -1310,7 +1227,7 @@ var componentTokens = {
1310
1227
  helperTextLineHeight: globalTokens.type_leading_normal,
1311
1228
  disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
1312
1229
  disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
1313
- placeholderFontColor: "#808080",
1230
+ placeholderFontColor: "#000000b3",
1314
1231
  placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
1315
1232
  disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
1316
1233
  disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
@@ -1322,41 +1239,6 @@ var componentTokens = {
1322
1239
  disabledValueFontColor: globalTokens.hal_grey_l_60,
1323
1240
  disabledValueFontColorOnDark: globalTokens.hal_grey_l_60
1324
1241
  },
1325
- V3Textarea: {
1326
- fontFamily: globalTokens.type_sans,
1327
- assistiveTextFontSize: globalTokens.type_scale_01,
1328
- assistiveTextFontStyle: globalTokens.type_normal,
1329
- assistiveTextFontWeight: globalTokens.type_regular,
1330
- assistiveTextFontColor: globalTokens.black,
1331
- assistiveTextFontColorOnDark: globalTokens.white,
1332
- assistiveTextLetterSpacing: "0.03333em",
1333
- disabledColor: globalTokens.lighterBlack,
1334
- disabledColorOnDark: "#575757",
1335
- errorColor: globalTokens.red,
1336
- errorColorOnDark: globalTokens.hal_red_l_60,
1337
- scrollBarThumbColor: globalTokens.darkGrey,
1338
- scrollBarThumbColorOnDark: globalTokens.white,
1339
- scrollBarTrackColor: globalTokens.lightGrey,
1340
- scrollBarTrackColorOnDark: "#999999",
1341
- labelFontSize: globalTokens.type_scale_03,
1342
- labelFontStyle: globalTokens.type_normal,
1343
- labelFontWeight: globalTokens.type_regular,
1344
- labelFontColor: globalTokens.black,
1345
- labelFontColorOnDark: globalTokens.white,
1346
- labelLetterSpacing: "0.00938em",
1347
- valueFontSize: globalTokens.type_scale_03,
1348
- valueFontStyle: globalTokens.type_normal,
1349
- valueFontWeight: globalTokens.type_regular,
1350
- valueFontColor: globalTokens.black,
1351
- valueFontColorOnDark: globalTokens.white,
1352
- valueLetterSpacing: globalTokens.type_spacing_normal,
1353
- valueLineHeight: "1.1875em",
1354
- underlineColor: globalTokens.black,
1355
- underlineColorOnDark: globalTokens.white,
1356
- underlineFocusColor: globalTokens.black,
1357
- underlineFocusColorOnDark: globalTokens.white,
1358
- underlineThickness: "1px"
1359
- },
1360
1242
  toggleGroup: {
1361
1243
  containerBackgroundColor: globalTokens.color_grey_50,
1362
1244
  containerBorderColor: globalTokens.hal_grey_l_60,
@@ -1405,121 +1287,65 @@ var componentTokens = {
1405
1287
  containerBorderRadius: globalTokens.border_radius_large,
1406
1288
  optionFocusBorderThickness: globalTokens.border_width_2
1407
1289
  },
1408
- upload: {
1409
- fontFamily: globalTokens.type_sans,
1410
- shadowColor: globalTokens.lightWhite,
1411
- scrollBarThumbColor: globalTokens.darkGrey,
1412
- scrollBarTrackColor: globalTokens.lightGrey,
1413
- errorColor: globalTokens.red,
1414
- backgroundColor: globalTokens.white,
1415
- draggingStateBackgroundColor: globalTokens.lightWhite,
1416
- dragAndDropIconColor: globalTokens.black,
1417
- dragAndDropIconSize: "43.5px",
1418
- dragAndDropTitleFontSize: globalTokens.type_scale_04,
1419
- dragAndDropTitleFontStyle: globalTokens.type_normal,
1420
- dragAndDropTitleFontWeight: globalTokens.type_bold,
1421
- dragAndDropTitleFontTextTransform: "none",
1422
- dragAndDropTitleFontColor: globalTokens.black,
1423
- dragAndDropDescriptionFontSize: globalTokens.type_scale_03,
1424
- dragAndDropDescriptionFontStyle: globalTokens.type_italic,
1425
- dragAndDropDescriptionFontWeight: globalTokens.type_regular,
1426
- dragAndDropDescriptionFontTextTransform: "none",
1427
- dragAndDropDescriptionFontColor: globalTokens.darkGrey,
1428
- dragAndDropDraggingStateIconColor: globalTokens.darkGrey,
1429
- dragAndDropDraggingStateIconSize: "74.5px",
1430
- dragAndDropDraggingStateFontSize: globalTokens.type_scale_03,
1431
- dragAndDropDraggingStateFontStyle: globalTokens.type_italic,
1432
- dragAndDropDraggingStateFontWeight: globalTokens.type_regular,
1433
- dragAndDropDraggingStateFontTextTransform: "none",
1434
- dragAndDropDraggingStateFontColor: globalTokens.darkGrey,
1435
- dragAndDropAreaIconColor: globalTokens.darkGrey,
1436
- dragAndDropAreaIconSize: "24px",
1437
- dragAndDropAreaTextFontSize: globalTokens.type_scale_01,
1438
- dragAndDropAreaTextFontStyle: globalTokens.type_italic,
1439
- dragAndDropAreaTextFontWeight: globalTokens.type_regular,
1440
- dragAndDropAreaTextFontTextTransform: "none",
1441
- dragAndDropAreaTextFontColor: globalTokens.darkGrey,
1442
- fileDeleteIconColor: globalTokens.black,
1443
- fileDeleteIconSize: "30px",
1444
- fileUnderlineColor: globalTokens.lightGrey,
1445
- fileUnderlineThickness: "1px",
1446
- fileNameFontSize: globalTokens.type_scale_03,
1447
- fileNameFontStyle: globalTokens.type_normal,
1448
- fileNameFontWeight: globalTokens.type_regular,
1449
- fileNameFontTextTransform: "none",
1450
- fileNameFontColor: globalTokens.black,
1451
- fileTypeFontSize: globalTokens.type_scale_01,
1452
- fileTypeFontStyle: globalTokens.type_normal,
1453
- fileTypeFontWeight: globalTokens.type_regular,
1454
- fileTypeFontTextTransform: globalTokens.type_uppercase,
1455
- fileTypeFontColor: globalTokens.darkGrey,
1456
- hoverFileColor: globalTokens.darkWhite,
1457
- uploadedFileIconColor: globalTokens.lightGrey,
1458
- uploadedFileIconSize: "24px",
1459
- uploadedFilesTitleFontSize: globalTokens.type_scale_04,
1460
- uploadedFilesTitleFontStyle: globalTokens.type_normal,
1461
- uploadedFilesTitleFontWeight: globalTokens.type_regular,
1462
- uploadedFilesTitleFontTextTransform: "none",
1463
- uploadedFilesTitleFontColor: globalTokens.black,
1464
- uploadedFilesSubtitleFontSize: globalTokens.type_scale_01,
1465
- uploadedFilesSubtitleFontStyle: globalTokens.type_normal,
1466
- uploadedFilesSubtitleFontWeight: globalTokens.type_regular,
1467
- uploadedFilesSubtitleFontTextTransform: "none",
1468
- uploadedFilesSubtitleFontColor: globalTokens.darkGrey,
1469
- uploadedFilesNumberFontWeight: globalTokens.type_bold
1470
- },
1471
1290
  wizard: {
1472
- disabledBackgroundColor: globalTokens.lightGrey,
1473
- disabledFontColor: globalTokens.darkGrey,
1474
- stepContainerFontSize: globalTokens.type_scale_03,
1475
- stepContainerFontFamily: globalTokens.type_sans,
1476
- stepContainerFontStyle: globalTokens.type_normal,
1477
- stepContainerFontWeight: globalTokens.type_regular,
1478
- stepContainerLetterSpacing: globalTokens.type_spacing_wide_02,
1479
- stepContainerFontColor: globalTokens.black,
1480
- stepContainerSelectedFontColor: globalTokens.white,
1481
- stepContainerSelectedBackgroundColor: globalTokens.hal_purple_s_38,
1482
- stepContainerBackgroundColor: globalTokens.white,
1483
- stepContainerIconSize: "19px",
1291
+ visitedStepFontColor: globalTokens.hal_black,
1292
+ visitedStepBackgroundColor: globalTokens.hal_white,
1293
+ visitedStepBorderColor: globalTokens.hal_black,
1294
+ unvisitedStepFontColor: globalTokens.hal_grey_s_40,
1295
+ unvisitedLabelFontColor: globalTokens.hal_grey_s_40,
1296
+ unvisitedHelperTextFontColor: globalTokens.hal_grey_s_40,
1297
+ unvisitedStepBackgroundColor: globalTokens.transparent,
1298
+ unvisitedStepBorderColor: globalTokens.hal_grey_s_40,
1299
+ selectedStepFontColor: globalTokens.white,
1300
+ selectedStepBackgroundColor: globalTokens.hal_purple_s_38,
1301
+ selectedStepBorderColor: globalTokens.hal_purple_s_38,
1302
+ selectedLabelFontColor: globalTokens.hal_black,
1303
+ selectedHelperTextFontColor: globalTokens.hal_black,
1304
+ selectedStepWidth: "32px",
1305
+ selectedStepHeight: "32px",
1306
+ selectedStepBorderThickness: "2px",
1307
+ selectedStepBorderStyle: "solid",
1308
+ selectedStepBorderRadius: "45px",
1309
+ stepFontSize: globalTokens.type_scale_03,
1310
+ stepFontFamily: globalTokens.type_sans,
1311
+ stepFontStyle: globalTokens.type_normal,
1312
+ stepFontWeight: globalTokens.type_regular,
1313
+ stepFontTracking: globalTokens.type_spacing_wide_02,
1314
+ stepIconSize: "20px",
1315
+ stepWidth: "32px",
1316
+ stepHeight: "32px",
1317
+ stepBorderThickness: "2px",
1318
+ stepBorderStyle: "solid",
1319
+ stepBorderRadius: "45px",
1320
+ visitedLabelFontColor: globalTokens.hal_black,
1484
1321
  labelFontSize: globalTokens.type_scale_03,
1485
1322
  labelFontFamily: globalTokens.type_sans,
1486
1323
  labelFontStyle: globalTokens.type_normal,
1487
1324
  labelFontWeight: globalTokens.type_regular,
1488
- labelLetterSpacing: globalTokens.type_spacing_normal,
1325
+ labelFontTracking: globalTokens.type_spacing_normal,
1489
1326
  labelFontTextTransform: "none",
1490
1327
  labelTextAlign: "left",
1491
- labelFontColor: globalTokens.darkGrey,
1492
- visitedLabelFontColor: globalTokens.black,
1493
- visitedDescriptionFontColor: globalTokens.black,
1494
- descriptionFontSize: globalTokens.type_scale_01,
1495
- descriptionFontFamily: globalTokens.type_sans,
1496
- descriptionFontStyle: globalTokens.type_normal,
1497
- descriptionFontWeight: globalTokens.type_regular,
1498
- descriptionLetterSpacing: globalTokens.type_spacing_wide_01,
1499
- descriptionFontTextTransform: "none",
1500
- descriptionFontColor: globalTokens.darkGrey,
1501
- descriptionTextAlign: "left",
1502
- circleWidth: "32px",
1503
- circleHeight: "32px",
1504
- circleBorderThickness: "2px",
1505
- circleBorderStyle: "solid",
1506
- circleBorderRadius: "45px",
1507
- circleBorderColor: globalTokens.black,
1508
- selectedCircleWidth: "32px",
1509
- selectedCircleHeight: "32px",
1510
- selectedCircleBorderThickness: "2px",
1511
- selectedCircleBorderStyle: "solid",
1512
- selectedCircleBorderRadius: "45px",
1513
- selectedCircleBorderColor: globalTokens.purple,
1514
- disabledCircleWidth: "32px",
1515
- disabledCircleHeight: "32px",
1516
- disabledCircleBorderThickness: "2px",
1517
- disabledCircleBorderStyle: "solid",
1518
- disabledCircleBorderRadius: "45px",
1519
- disabledCircleBorderColor: globalTokens.lightGrey,
1328
+ helperTextFontSize: globalTokens.type_scale_02,
1329
+ helperTextFontFamily: globalTokens.type_sans,
1330
+ helperTextFontStyle: globalTokens.type_normal,
1331
+ helperTextFontWeight: globalTokens.type_regular,
1332
+ helperTextFontTracking: globalTokens.type_spacing_normal,
1333
+ helperTextFontTextTransform: "none",
1334
+ visitedHelperTextFontColor: globalTokens.hal_black,
1335
+ helperTextTextAlign: "left",
1336
+ disabledStepBackgroundColor: globalTokens.hal_grey_l_95,
1337
+ disabledStepFontColor: globalTokens.hal_grey_l_60,
1338
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1339
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
1340
+ disabledStepBorderColor: globalTokens.hal_grey_l_95,
1341
+ disabledStepWidth: "32px",
1342
+ disabledStepHeight: "32px",
1343
+ disabledStepBorderThickness: "2px",
1344
+ disabledStepBorderStyle: "solid",
1345
+ disabledStepBorderRadius: "45px",
1520
1346
  separatorBorderThickness: "1px",
1521
1347
  separatorBorderStyle: "solid",
1522
- separatorColor: globalTokens.lightGrey,
1348
+ separatorColor: globalTokens.hal_grey_s_40,
1523
1349
  focusColor: globalTokens.hal_blue_l_50
1524
1350
  }
1525
1351
  };
@@ -1535,12 +1361,11 @@ var spaces = {
1535
1361
  };
1536
1362
  exports.spaces = spaces;
1537
1363
  var responsiveSizes = {
1538
- mobileSmall: "320",
1539
- mobileMedium: "375",
1540
- mobileLarge: "425",
1541
- tablet: "768",
1542
- laptop: "1024",
1543
- desktop: "1440"
1364
+ xsmall: "20",
1365
+ small: "30",
1366
+ medium: "45",
1367
+ large: "66",
1368
+ xlarge: "90"
1544
1369
  };
1545
1370
  exports.responsiveSizes = responsiveSizes;
1546
1371
  var typeface = {
@@ -1575,4 +1400,86 @@ var typeface = {
1575
1400
  textTransform: "uppercase"
1576
1401
  }
1577
1402
  };
1578
- exports.typeface = typeface;
1403
+ exports.typeface = typeface;
1404
+ var defaultTranslatedComponentLabels = {
1405
+ formFields: {
1406
+ optionalLabel: "(Optional)",
1407
+ requiredSelectionErrorMessage: "This field is required. Please, choose an option.",
1408
+ requiredValueErrorMessage: "This field is required. Please, enter a value.",
1409
+ formatRequestedErrorMessage: "Please match the format requested.",
1410
+ lengthErrorMessage: function lengthErrorMessage(minLength, maxLength) {
1411
+ return "Min length ".concat(minLength, ", max length ").concat(maxLength, ".");
1412
+ },
1413
+ logoAlternativeText: "Logo"
1414
+ },
1415
+ alert: {
1416
+ infoTitleText: "information",
1417
+ successTitleText: "success",
1418
+ warningTitleText: "warning",
1419
+ errorTitleText: "error"
1420
+ },
1421
+ dateInput: {
1422
+ invalidDateErrorMessage: "Invalid date."
1423
+ },
1424
+ fileInput: {
1425
+ fileSizeGreaterThanErrorMessage: "File size must be greater than min size.",
1426
+ fileSizeLessThanErrorMessage: "File size must be less than max size.",
1427
+ multipleButtonLabelDefault: "Select files",
1428
+ singleButtonLabelDefault: "Select file",
1429
+ dropAreaButtonLabelDefault: "Select",
1430
+ multipleDropAreaLabelDefault: "or drop files",
1431
+ singleDropAreaLabelDefault: "or drop a file"
1432
+ },
1433
+ footer: {
1434
+ copyrightText: function copyrightText(year) {
1435
+ return "\xA9 DXC Technology ".concat(year, ". All rights reserved.");
1436
+ }
1437
+ },
1438
+ numberInput: {
1439
+ valueGreaterThanOrEqualToErrorMessage: function valueGreaterThanOrEqualToErrorMessage(value) {
1440
+ return "Value must be greater than or equal to ".concat(value, ".");
1441
+ },
1442
+ valueLessThanOrEqualToErrorMessage: function valueLessThanOrEqualToErrorMessage(value) {
1443
+ return "Value must be less than or equal to ".concat(value, ".");
1444
+ },
1445
+ decrementValueTitle: "Decrement value",
1446
+ incrementValueTitle: "Increment value"
1447
+ },
1448
+ paginator: {
1449
+ itemsPerPageText: "Items per page ",
1450
+ minToMaxOfText: function minToMaxOfText(minNumberOfItems, maxNumberOfItems, totalItems) {
1451
+ return "".concat(minNumberOfItems, " to ").concat(maxNumberOfItems, " of ").concat(totalItems);
1452
+ },
1453
+ goToPageText: "Go to page:",
1454
+ pageOfText: function pageOfText(pageNumber, totalPagesNumber) {
1455
+ return "Page: ".concat(pageNumber, " of ").concat(totalPagesNumber);
1456
+ }
1457
+ },
1458
+ passwordInput: {
1459
+ inputShowPasswordTitle: "Show password",
1460
+ inputHidePasswordTitle: "Hide password"
1461
+ },
1462
+ quickNav: {
1463
+ contentTitle: "Contents"
1464
+ },
1465
+ radioGroup: {
1466
+ optionalItemLabelDefault: "N/A"
1467
+ },
1468
+ select: {
1469
+ noMatchesErrorMessage: "No matches found",
1470
+ actionClearSelectionTitle: "Clear selection",
1471
+ actionClearSearchTitle: "Clear search"
1472
+ },
1473
+ textInput: {
1474
+ clearFieldActionTitle: "Clear field",
1475
+ searchingMessage: "Searching...",
1476
+ fetchingDataErrorMessage: "Error fetching data"
1477
+ },
1478
+ calendar: {
1479
+ days: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
1480
+ daysShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
1481
+ months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
1482
+ monthsShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
1483
+ }
1484
+ };
1485
+ exports.defaultTranslatedComponentLabels = defaultTranslatedComponentLabels;