@dxc-technology/halstack-react 0.0.0-4d89cae → 0.0.0-4dc980c

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 (372) hide show
  1. package/BackgroundColorContext.d.ts +10 -0
  2. package/BackgroundColorContext.js +7 -6
  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 +129 -237
  7. package/accordion/Accordion.stories.tsx +306 -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 +68 -105
  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/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 +15 -17
  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 +37 -77
  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 +63 -145
  45. package/button/Button.stories.tsx +283 -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 +44 -137
  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 +110 -159
  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 +26 -130
  64. package/chip/Chip.stories.tsx +119 -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/common/variables.js +327 -382
  69. package/date-input/Calendar.d.ts +4 -0
  70. package/date-input/Calendar.js +258 -0
  71. package/date-input/DateInput.d.ts +4 -0
  72. package/date-input/DateInput.js +130 -303
  73. package/date-input/DateInput.stories.tsx +151 -0
  74. package/date-input/DateInput.test.js +752 -0
  75. package/date-input/DatePicker.d.ts +4 -0
  76. package/date-input/DatePicker.js +160 -0
  77. package/date-input/YearPicker.d.ts +4 -0
  78. package/date-input/YearPicker.js +115 -0
  79. package/date-input/types.d.ts +160 -0
  80. package/date-input/types.js +5 -0
  81. package/dialog/Dialog.d.ts +4 -0
  82. package/dialog/Dialog.js +60 -116
  83. package/dialog/Dialog.stories.tsx +267 -0
  84. package/dialog/Dialog.test.js +70 -0
  85. package/dialog/types.d.ts +44 -0
  86. package/dialog/types.js +5 -0
  87. package/dropdown/Dropdown.d.ts +4 -0
  88. package/dropdown/Dropdown.js +243 -396
  89. package/dropdown/Dropdown.stories.tsx +312 -0
  90. package/dropdown/Dropdown.test.js +585 -0
  91. package/dropdown/DropdownMenu.d.ts +4 -0
  92. package/dropdown/DropdownMenu.js +80 -0
  93. package/dropdown/DropdownMenuItem.d.ts +4 -0
  94. package/dropdown/DropdownMenuItem.js +92 -0
  95. package/dropdown/types.d.ts +100 -0
  96. package/dropdown/types.js +5 -0
  97. package/file-input/FileInput.d.ts +4 -0
  98. package/file-input/FileInput.js +212 -305
  99. package/file-input/FileInput.stories.tsx +535 -0
  100. package/file-input/FileInput.test.js +498 -0
  101. package/file-input/FileItem.d.ts +4 -0
  102. package/file-input/FileItem.js +57 -183
  103. package/file-input/types.d.ts +129 -0
  104. package/file-input/types.js +5 -0
  105. package/flex/Flex.d.ts +4 -0
  106. package/flex/Flex.js +69 -0
  107. package/flex/Flex.stories.tsx +103 -0
  108. package/flex/types.d.ts +32 -0
  109. package/flex/types.js +5 -0
  110. package/footer/Footer.d.ts +4 -0
  111. package/footer/Footer.js +50 -286
  112. package/footer/Footer.stories.tsx +137 -0
  113. package/footer/Footer.test.js +109 -0
  114. package/footer/Icons.d.ts +2 -0
  115. package/footer/Icons.js +16 -16
  116. package/footer/types.d.ts +66 -0
  117. package/footer/types.js +5 -0
  118. package/header/Header.d.ts +7 -0
  119. package/header/Header.js +131 -296
  120. package/header/Header.stories.tsx +172 -0
  121. package/header/Header.test.js +79 -0
  122. package/header/Icons.d.ts +2 -0
  123. package/header/Icons.js +9 -34
  124. package/header/types.d.ts +48 -0
  125. package/header/types.js +5 -0
  126. package/heading/Heading.d.ts +4 -0
  127. package/heading/Heading.js +25 -96
  128. package/heading/Heading.stories.tsx +54 -0
  129. package/heading/Heading.test.js +186 -0
  130. package/heading/types.d.ts +33 -0
  131. package/heading/types.js +5 -0
  132. package/inset/Inset.d.ts +3 -0
  133. package/inset/Inset.js +51 -0
  134. package/inset/Inset.stories.tsx +229 -0
  135. package/inset/types.d.ts +37 -0
  136. package/inset/types.js +5 -0
  137. package/layout/ApplicationLayout.d.ts +20 -0
  138. package/layout/ApplicationLayout.js +76 -232
  139. package/layout/ApplicationLayout.stories.tsx +162 -0
  140. package/layout/Icons.d.ts +5 -0
  141. package/layout/Icons.js +19 -8
  142. package/layout/SidenavContext.d.ts +5 -0
  143. package/layout/SidenavContext.js +19 -0
  144. package/layout/types.d.ts +42 -0
  145. package/layout/types.js +5 -0
  146. package/link/Link.d.ts +4 -0
  147. package/link/Link.js +65 -166
  148. package/link/Link.stories.tsx +193 -0
  149. package/link/Link.test.js +83 -0
  150. package/link/types.d.ts +54 -0
  151. package/link/types.js +5 -0
  152. package/main.d.ts +44 -40
  153. package/main.js +114 -104
  154. package/number-input/NumberInput.d.ts +4 -0
  155. package/number-input/NumberInput.js +21 -81
  156. package/number-input/NumberInput.stories.tsx +115 -0
  157. package/number-input/NumberInput.test.js +542 -0
  158. package/number-input/NumberInputContext.d.ts +4 -0
  159. package/number-input/NumberInputContext.js +5 -2
  160. package/number-input/numberInputContextTypes.d.ts +19 -0
  161. package/number-input/numberInputContextTypes.js +5 -0
  162. package/number-input/types.d.ts +124 -0
  163. package/number-input/types.js +5 -0
  164. package/package.json +34 -32
  165. package/paginator/Icons.js +9 -9
  166. package/paginator/Paginator.d.ts +4 -0
  167. package/paginator/Paginator.js +32 -166
  168. package/paginator/Paginator.stories.tsx +63 -0
  169. package/paginator/Paginator.test.js +308 -0
  170. package/paginator/types.d.ts +38 -0
  171. package/paginator/types.js +5 -0
  172. package/paragraph/Paragraph.d.ts +6 -0
  173. package/paragraph/Paragraph.js +38 -0
  174. package/paragraph/Paragraph.stories.tsx +44 -0
  175. package/password-input/PasswordInput.d.ts +4 -0
  176. package/password-input/PasswordInput.js +40 -77
  177. package/password-input/PasswordInput.stories.tsx +131 -0
  178. package/password-input/PasswordInput.test.js +181 -0
  179. package/password-input/types.d.ts +110 -0
  180. package/password-input/types.js +5 -0
  181. package/progress-bar/ProgressBar.d.ts +4 -0
  182. package/progress-bar/ProgressBar.js +72 -138
  183. package/progress-bar/ProgressBar.stories.jsx +60 -0
  184. package/progress-bar/ProgressBar.test.js +110 -0
  185. package/progress-bar/types.d.ts +36 -0
  186. package/progress-bar/types.js +5 -0
  187. package/quick-nav/QuickNav.d.ts +4 -0
  188. package/quick-nav/QuickNav.js +117 -0
  189. package/quick-nav/QuickNav.stories.tsx +342 -0
  190. package/quick-nav/types.d.ts +21 -0
  191. package/quick-nav/types.js +5 -0
  192. package/radio-group/Radio.d.ts +4 -0
  193. package/radio-group/Radio.js +156 -0
  194. package/radio-group/RadioGroup.d.ts +4 -0
  195. package/radio-group/RadioGroup.js +283 -0
  196. package/radio-group/RadioGroup.stories.tsx +101 -0
  197. package/radio-group/RadioGroup.test.js +722 -0
  198. package/radio-group/types.d.ts +114 -0
  199. package/radio-group/types.js +5 -0
  200. package/resultsetTable/Icons.d.ts +7 -0
  201. package/resultsetTable/Icons.js +51 -0
  202. package/resultsetTable/ResultsetTable.d.ts +4 -0
  203. package/resultsetTable/ResultsetTable.js +60 -223
  204. package/resultsetTable/ResultsetTable.stories.tsx +300 -0
  205. package/resultsetTable/ResultsetTable.test.js +330 -0
  206. package/resultsetTable/types.d.ts +67 -0
  207. package/resultsetTable/types.js +5 -0
  208. package/select/Icons.d.ts +10 -0
  209. package/select/Icons.js +93 -0
  210. package/select/Listbox.d.ts +4 -0
  211. package/select/Listbox.js +198 -0
  212. package/select/Option.d.ts +4 -0
  213. package/select/Option.js +110 -0
  214. package/select/Select.d.ts +4 -0
  215. package/select/Select.js +231 -724
  216. package/select/Select.stories.tsx +624 -0
  217. package/select/Select.test.js +2233 -0
  218. package/select/types.d.ts +210 -0
  219. package/select/types.js +5 -0
  220. package/sidenav/Sidenav.d.ts +10 -0
  221. package/sidenav/Sidenav.js +194 -105
  222. package/sidenav/Sidenav.stories.tsx +180 -0
  223. package/sidenav/Sidenav.test.js +44 -0
  224. package/sidenav/types.d.ts +73 -0
  225. package/sidenav/types.js +5 -0
  226. package/slider/Slider.d.ts +4 -0
  227. package/slider/Slider.js +166 -227
  228. package/slider/Slider.stories.tsx +183 -0
  229. package/slider/Slider.test.js +250 -0
  230. package/slider/types.d.ts +86 -0
  231. package/slider/types.js +5 -0
  232. package/spinner/Spinner.d.ts +4 -0
  233. package/spinner/Spinner.js +46 -177
  234. package/spinner/Spinner.stories.jsx +103 -0
  235. package/spinner/Spinner.test.js +64 -0
  236. package/spinner/types.d.ts +32 -0
  237. package/spinner/types.js +5 -0
  238. package/switch/Switch.d.ts +4 -0
  239. package/switch/Switch.js +161 -121
  240. package/switch/Switch.stories.tsx +138 -0
  241. package/switch/Switch.test.js +225 -0
  242. package/switch/types.d.ts +66 -0
  243. package/switch/types.js +5 -0
  244. package/table/Table.d.ts +4 -0
  245. package/table/Table.js +12 -26
  246. package/table/Table.stories.jsx +277 -0
  247. package/table/Table.test.js +26 -0
  248. package/table/types.d.ts +21 -0
  249. package/table/types.js +5 -0
  250. package/tabs/Tab.d.ts +4 -0
  251. package/tabs/Tab.js +135 -0
  252. package/tabs/Tabs.d.ts +4 -0
  253. package/tabs/Tabs.js +353 -229
  254. package/tabs/Tabs.stories.tsx +185 -0
  255. package/tabs/Tabs.test.js +351 -0
  256. package/tabs/types.d.ts +92 -0
  257. package/tabs/types.js +5 -0
  258. package/tabs-nav/NavTabs.d.ts +8 -0
  259. package/tabs-nav/NavTabs.js +125 -0
  260. package/tabs-nav/NavTabs.stories.tsx +170 -0
  261. package/tabs-nav/NavTabs.test.js +82 -0
  262. package/tabs-nav/Tab.d.ts +4 -0
  263. package/tabs-nav/Tab.js +130 -0
  264. package/tabs-nav/types.d.ts +53 -0
  265. package/tabs-nav/types.js +5 -0
  266. package/tag/Tag.d.ts +4 -0
  267. package/tag/Tag.js +45 -144
  268. package/tag/Tag.stories.tsx +142 -0
  269. package/tag/Tag.test.js +60 -0
  270. package/tag/types.d.ts +69 -0
  271. package/tag/types.js +5 -0
  272. package/text-input/Icons.d.ts +8 -0
  273. package/text-input/Icons.js +60 -0
  274. package/text-input/Suggestion.d.ts +4 -0
  275. package/text-input/Suggestion.js +57 -0
  276. package/text-input/Suggestions.d.ts +4 -0
  277. package/text-input/Suggestions.js +134 -0
  278. package/text-input/TextInput.d.ts +4 -0
  279. package/text-input/TextInput.js +261 -576
  280. package/text-input/TextInput.stories.tsx +481 -0
  281. package/text-input/TextInput.test.js +1624 -0
  282. package/text-input/types.d.ts +197 -0
  283. package/text-input/types.js +5 -0
  284. package/textarea/Textarea.d.ts +4 -0
  285. package/textarea/Textarea.js +50 -142
  286. package/textarea/Textarea.stories.jsx +157 -0
  287. package/textarea/Textarea.test.js +437 -0
  288. package/textarea/types.d.ts +137 -0
  289. package/textarea/types.js +5 -0
  290. package/toggle-group/ToggleGroup.d.ts +4 -0
  291. package/toggle-group/ToggleGroup.js +36 -148
  292. package/toggle-group/ToggleGroup.stories.tsx +173 -0
  293. package/toggle-group/ToggleGroup.test.js +156 -0
  294. package/toggle-group/types.d.ts +105 -0
  295. package/toggle-group/types.js +5 -0
  296. package/typography/Typography.d.ts +4 -0
  297. package/typography/Typography.js +131 -0
  298. package/typography/Typography.stories.tsx +198 -0
  299. package/typography/types.d.ts +18 -0
  300. package/typography/types.js +5 -0
  301. package/useTheme.d.ts +2 -0
  302. package/useTheme.js +2 -2
  303. package/useTranslatedLabels.d.ts +2 -0
  304. package/useTranslatedLabels.js +20 -0
  305. package/wizard/Wizard.d.ts +4 -0
  306. package/wizard/Wizard.js +132 -252
  307. package/wizard/Wizard.stories.tsx +233 -0
  308. package/wizard/Wizard.test.js +141 -0
  309. package/wizard/types.d.ts +65 -0
  310. package/wizard/types.js +5 -0
  311. package/ThemeContext.js +0 -250
  312. package/V3Select/V3Select.js +0 -549
  313. package/V3Select/index.d.ts +0 -27
  314. package/V3Textarea/V3Textarea.js +0 -264
  315. package/V3Textarea/index.d.ts +0 -27
  316. package/accordion/index.d.ts +0 -28
  317. package/accordion-group/index.d.ts +0 -16
  318. package/alert/index.d.ts +0 -51
  319. package/box/index.d.ts +0 -25
  320. package/button/Button.stories.js +0 -27
  321. package/button/index.d.ts +0 -24
  322. package/card/index.d.ts +0 -22
  323. package/checkbox/index.d.ts +0 -24
  324. package/chip/index.d.ts +0 -22
  325. package/common/RequiredComponent.js +0 -40
  326. package/date/Date.js +0 -379
  327. package/date/index.d.ts +0 -27
  328. package/date-input/index.d.ts +0 -95
  329. package/dialog/index.d.ts +0 -18
  330. package/dropdown/index.d.ts +0 -26
  331. package/file-input/index.d.ts +0 -81
  332. package/footer/index.d.ts +0 -25
  333. package/header/index.d.ts +0 -25
  334. package/heading/index.d.ts +0 -17
  335. package/input-text/Icons.js +0 -22
  336. package/input-text/InputText.js +0 -705
  337. package/input-text/index.d.ts +0 -36
  338. package/link/index.d.ts +0 -23
  339. package/number-input/index.d.ts +0 -113
  340. package/paginator/index.d.ts +0 -20
  341. package/password-input/index.d.ts +0 -94
  342. package/progress-bar/index.d.ts +0 -18
  343. package/radio/Radio.js +0 -209
  344. package/radio/index.d.ts +0 -23
  345. package/resultsetTable/index.d.ts +0 -19
  346. package/select/index.d.ts +0 -131
  347. package/sidenav/index.d.ts +0 -13
  348. package/slider/index.d.ts +0 -29
  349. package/spinner/index.d.ts +0 -17
  350. package/switch/index.d.ts +0 -24
  351. package/table/index.d.ts +0 -13
  352. package/tabs/index.d.ts +0 -19
  353. package/tag/index.d.ts +0 -24
  354. package/text-input/index.d.ts +0 -135
  355. package/textarea/index.d.ts +0 -117
  356. package/toggle/Toggle.js +0 -220
  357. package/toggle/index.d.ts +0 -21
  358. package/toggle-group/index.d.ts +0 -21
  359. package/upload/Upload.js +0 -205
  360. package/upload/buttons-upload/ButtonsUpload.js +0 -135
  361. package/upload/buttons-upload/Icons.js +0 -40
  362. package/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  363. package/upload/dragAndDropArea/Icons.js +0 -39
  364. package/upload/file-upload/FileToUpload.js +0 -189
  365. package/upload/file-upload/Icons.js +0 -66
  366. package/upload/files-upload/FilesToUpload.js +0 -123
  367. package/upload/index.d.ts +0 -15
  368. package/upload/transaction/Icons.js +0 -160
  369. package/upload/transaction/Transaction.js +0 -148
  370. package/upload/transactions/Transactions.js +0 -138
  371. package/wizard/Icons.js +0 -65
  372. package/wizard/index.d.ts +0 -18
@@ -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",
@@ -99,7 +95,7 @@ var globalTokens = {
99
95
  type_sans: "Open Sans, sans-serif",
100
96
  type_scale_root: "16px",
101
97
  type_scale_08: "3.75rem",
102
- type_scale_07: "3rem",
98
+ type_scale_07: "2.5rem",
103
99
  type_scale_06: "2rem",
104
100
  type_scale_05: "1.5rem",
105
101
  type_scale_04: "1.25rem",
@@ -114,7 +110,7 @@ var globalTokens = {
114
110
  type_normal: "normal",
115
111
  type_spacing_tight_02: "-0.05em",
116
112
  type_spacing_tight_01: "-0.025em",
117
- type_spacing_normal: "0",
113
+ type_spacing_normal: "0em",
118
114
  type_spacing_wide_01: "0.025em",
119
115
  type_spacing_wide_02: "0.05em",
120
116
  type_spacing_wide_03: "0.1em",
@@ -164,7 +160,6 @@ exports.globalTokens = globalTokens;
164
160
  var componentTokens = {
165
161
  accordion: {
166
162
  backgroundColor: globalTokens.hal_white,
167
- disabledBackgroundColor: globalTokens.transparent,
168
163
  hoverBackgroundColor: globalTokens.hal_purple_l_95,
169
164
  arrowColor: globalTokens.hal_purple_s_38,
170
165
  disabledArrowColor: globalTokens.hal_grey_l_60,
@@ -184,13 +179,13 @@ var componentTokens = {
184
179
  titleLabelFontStyle: globalTokens.type_normal,
185
180
  titleLabelFontColor: globalTokens.hal_black,
186
181
  disabledTitleLabelFontColor: globalTokens.hal_grey_l_60,
187
- titleLabelPaddingLeft: "0px",
188
- titleLabelPaddingRight: "16px",
189
182
  titleLabelPaddingTop: "0px",
190
183
  titleLabelPaddingBottom: "0px",
184
+ titleLabelPaddingLeft: "0px",
185
+ titleLabelPaddingRight: "16px",
186
+ focusBorderColor: globalTokens.hal_blue_l_50,
191
187
  focusBorderStyle: "solid",
192
188
  focusBorderThickness: "2px",
193
- focusBorderColor: globalTokens.hal_blue_l_50,
194
189
  borderRadius: "4px",
195
190
  boxShadowOffsetX: "0px",
196
191
  boxShadowOffsetY: "6px",
@@ -244,7 +239,7 @@ var componentTokens = {
244
239
  successBackgroundColor: globalTokens.hal_green_l_95,
245
240
  warningBackgroundColor: globalTokens.hal_yellow_l_95,
246
241
  errorBackgroundColor: globalTokens.hal_red_l_95,
247
- hoverActionBackgroundColor: "#0000000D",
242
+ hoverActionBackgroundColor: globalTokens.color_grey_a_100,
248
243
  activeActionBackgroundColor: "#0000001A",
249
244
  focusActionBorderColor: globalTokens.hal_blue_l_50,
250
245
  overlayColor: "#000000B3"
@@ -265,12 +260,21 @@ var componentTokens = {
265
260
  oneShadowDepthShadowOffsetY: "3px",
266
261
  oneShadowDepthShadowBlur: "6px",
267
262
  oneShadowDepthShadowSpread: "0px",
268
- oneShadowDepthShadowColor: "#00000033",
263
+ oneShadowDepthShadowColor: globalTokens.color_grey_a_300,
269
264
  twoShadowDepthShadowOffsetX: "0px",
270
265
  twoShadowDepthShadowOffsetY: "3px",
271
266
  twoShadowDepthShadowBlur: "10px",
272
267
  twoShadowDepthShadowSpread: "0px",
273
- 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"
274
278
  },
275
279
  button: {
276
280
  labelFontLineHeight: globalTokens.type_leading_normal,
@@ -350,7 +354,7 @@ var componentTokens = {
350
354
  backgroundColorChecked: globalTokens.hal_blue_s_35,
351
355
  backgroundColorCheckedOnDark: globalTokens.hal_grey_l_90,
352
356
  hoverBackgroundColorChecked: globalTokens.hal_blue_d_20,
353
- hoverBackgroundColorCheckedOnDark: global.hal_white,
357
+ hoverBackgroundColorCheckedOnDark: globalTokens.hal_white,
354
358
  disabledBackgroundColorChecked: globalTokens.hal_grey_l_60,
355
359
  disabledBackgroundColorCheckedOnDark: globalTokens.color_grey_800,
356
360
  borderColor: globalTokens.hal_blue_s_35,
@@ -397,23 +401,6 @@ var componentTokens = {
397
401
  disabledIconColor: globalTokens.hal_grey_l_60,
398
402
  focusColor: globalTokens.hal_blue_l_50
399
403
  },
400
- date: {
401
- pickerSelectedDateBackgroundColor: globalTokens.purple,
402
- pickerSelectedDateColor: globalTokens.hal_white,
403
- pickerBackgroundColor: globalTokens.hal_white,
404
- pickerFontColor: globalTokens.hal_black,
405
- pickerHoverDateBackgroundColor: globalTokens.lighterPurple,
406
- pickerHoverDateFontColor: globalTokens.hal_black,
407
- pickerActualDateColor: globalTokens.lightGrey,
408
- pickerYearColor: globalTokens.hal_black,
409
- pickerMonthColor: globalTokens.hal_black,
410
- pickerWeekLabelColor: globalTokens.hal_black,
411
- pickerBackgroundColorMonthArrows: globalTokens.transparent,
412
- focusColor: globalTokens.hal_blue_l_50,
413
- fontFamily: globalTokens.type_sans,
414
- pickerHeight: "316px",
415
- pickerWidth: "290px"
416
- },
417
404
  dateInput: {
418
405
  pickerFontFamily: globalTokens.type_sans,
419
406
  pickerBackgroundColor: globalTokens.hal_white,
@@ -421,7 +408,7 @@ var componentTokens = {
421
408
  pickerHoverDateBackgroundColor: globalTokens.hal_purple_l_90,
422
409
  pickerSelectedDateColor: globalTokens.hal_white,
423
410
  pickerSelectedDateBackgroundColor: globalTokens.hal_purple_s_38,
424
- pickerActualDateFontColor: globalTokens.hal_grey_l_60,
411
+ pickerActualDateFontColor: globalTokens.hal_black,
425
412
  pickerYearFontColor: globalTokens.hal_black,
426
413
  pickerMonthFontColor: globalTokens.hal_black,
427
414
  pickerWeekFontColor: globalTokens.hal_black,
@@ -429,7 +416,8 @@ var componentTokens = {
429
416
  pickerMonthArrowsBackgroundColor: globalTokens.transparent,
430
417
  pickerFocusColor: globalTokens.hal_blue_l_50,
431
418
  pickerHeight: "316px",
432
- pickerWidth: "290px"
419
+ // not referenced in the actual implementation
420
+ pickerWidth: "292px"
433
421
  },
434
422
  dialog: {
435
423
  overlayColor: globalTokens.hal_black,
@@ -448,7 +436,10 @@ var componentTokens = {
448
436
  boxShadowOffsetY: "1px",
449
437
  boxShadowBlur: "3px",
450
438
  boxShadowColor: "rgba(0, 0, 0, 0.2)",
451
- overlayOpacity: "0.7"
439
+ overlayOpacity: "0.7",
440
+ fontFamily: globalTokens.type_sans,
441
+ fontSize: globalTokens.type_scale_03,
442
+ fontWeight: globalTokens.type_regular
452
443
  },
453
444
  dropdown: {
454
445
  buttonBackgroundColor: globalTokens.hal_white,
@@ -508,14 +499,13 @@ var componentTokens = {
508
499
  focusDropBorderColor: globalTokens.hal_blue_l_50,
509
500
  disabledDropBorderColor: globalTokens.hal_grey_l_60,
510
501
  dragoverDropBackgroundColor: globalTokens.color_blue_50,
511
- hoverFileItemIconBackgroundColor: globalTokens.hal_grey_l_95,
512
502
  activeFileItemIconBackgrounColor: globalTokens.hal_grey_l_80,
513
503
  errorFileItemBorderColor: globalTokens.hal_red_s_41,
514
504
  errorFileItemBackgroundColor: globalTokens.color_red_50,
515
- errorFileItemIconBackgroundColor: globalTokens.color_red_700,
505
+ errorFilePreviewBackgroundColor: globalTokens.color_red_700,
516
506
  errorFileItemIconColor: globalTokens.hal_red_s_41,
517
507
  fileItemIconBackgroundColor: globalTokens.hal_grey_l_95,
518
- fileItemIconColor: globalTokens.color_grey_600,
508
+ deleteFileItemColor: globalTokens.hal_black,
519
509
  errorMessageFontColor: globalTokens.hal_red_s_41,
520
510
  labelFontFamily: globalTokens.type_sans,
521
511
  labelFontSize: globalTokens.type_scale_02,
@@ -535,17 +525,19 @@ var componentTokens = {
535
525
  errorMessageFontFamily: globalTokens.type_sans,
536
526
  errorMessageFontSize: globalTokens.type_scale_01,
537
527
  errorMessageFontWeight: globalTokens.type_regular,
538
- errorMessageLineHeight: globalTokens.type_scale_05,
528
+ errorMessageLineHeight: globalTokens.type_leading_normal,
539
529
  dropBorderThickness: globalTokens.border_width_1,
540
530
  dropBorderStyle: globalTokens.border_dashed,
541
531
  dropBorderRadius: globalTokens.border_radius_large,
542
532
  fileItemBorderThickness: globalTokens.border_width_1,
543
533
  fileItemBorderStyle: globalTokens.border_solid,
544
534
  fileItemBorderRadius: globalTokens.border_radius_medium,
545
- hoverDeleteFileItemBackgroundColor: globalTokens.hal_grey_l_95,
546
- activeDeleteFileItemBackgroundColor: globalTokens.hal_grey_l_80,
547
- errorHoverDeleteFileItemBackgroundColor: globalTokens.hal_red_l_95,
548
- errorActiveDeleteFileItemBackgroundColor: globalTokens.hal_red_s_41
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
549
541
  },
550
542
  footer: {
551
543
  height: "124px",
@@ -565,7 +557,7 @@ var componentTokens = {
565
557
  copyrightFontStyle: globalTokens.type_normal,
566
558
  copyrightFontWeight: globalTokens.type_regular,
567
559
  copyrightFontColor: globalTokens.hal_white,
568
- logo: _Icons2["default"],
560
+ logo: "",
569
561
  logoHeight: "32px",
570
562
  logoWidth: "auto",
571
563
  socialLinksSize: "24px",
@@ -583,8 +575,8 @@ var componentTokens = {
583
575
  hamburguerTextTransform: globalTokens.type_uppercase,
584
576
  hamburguerIconColor: globalTokens.hal_black,
585
577
  hamburguerHoverColor: globalTokens.mediumGreyBlack,
586
- logo: _Icons.dxcLogo,
587
- logoResponsive: _Icons.dxcLogo,
578
+ logo: "",
579
+ logoResponsive: "",
588
580
  logoHeight: "40px",
589
581
  logoWidth: "auto",
590
582
  menuBackgroundColor: globalTokens.hal_white,
@@ -608,99 +600,40 @@ var componentTokens = {
608
600
  heading: {
609
601
  level1FontColor: globalTokens.inherit,
610
602
  level1FontFamily: globalTokens.type_sans,
611
- level1FontSize: globalTokens.type_scale_08,
603
+ level1FontSize: globalTokens.type_scale_07,
612
604
  level1FontStyle: globalTokens.type_normal,
613
- level1FontWeight: globalTokens.type_regular,
605
+ level1FontWeight: globalTokens.type_semibold,
614
606
  level1LineHeight: globalTokens.type_leading_compact_01,
615
607
  level1LetterSpacing: globalTokens.type_spacing_tight_01,
616
608
  level2FontColor: globalTokens.inherit,
617
609
  level2FontFamily: globalTokens.type_sans,
618
- level2FontSize: globalTokens.type_scale_07,
610
+ level2FontSize: globalTokens.type_scale_05,
619
611
  level2FontStyle: globalTokens.type_normal,
620
- level2FontWeight: globalTokens.type_regular,
612
+ level2FontWeight: globalTokens.type_semibold,
621
613
  level2LineHeight: globalTokens.type_leading_normal,
622
614
  level2LetterSpacing: globalTokens.type_spacing_normal,
623
615
  level3FontColor: globalTokens.inherit,
624
616
  level3FontFamily: globalTokens.type_sans,
625
- level3FontSize: globalTokens.type_scale_06,
617
+ level3FontSize: globalTokens.type_scale_04,
626
618
  level3FontStyle: globalTokens.type_normal,
627
- level3FontWeight: globalTokens.type_regular,
619
+ level3FontWeight: globalTokens.type_semibold,
628
620
  level3LineHeight: globalTokens.type_leading_compact_01,
629
621
  level3LetterSpacing: globalTokens.type_spacing_wide_01,
630
622
  level4FontColor: globalTokens.inherit,
631
623
  level4FontFamily: globalTokens.type_sans,
632
- level4FontSize: globalTokens.type_scale_05,
624
+ level4FontSize: globalTokens.type_scale_03,
633
625
  level4FontStyle: globalTokens.type_normal,
634
- level4FontWeight: globalTokens.type_regular,
626
+ level4FontWeight: globalTokens.type_semibold,
635
627
  level4LineHeight: globalTokens.type_leading_normal,
636
628
  level4LetterSpacing: globalTokens.type_spacing_normal,
637
629
  level5FontColor: globalTokens.inherit,
638
630
  level5FontFamily: globalTokens.type_sans,
639
- level5FontSize: globalTokens.type_scale_04,
631
+ level5FontSize: globalTokens.type_scale_02,
640
632
  level5FontStyle: globalTokens.type_normal,
641
- level5FontWeight: globalTokens.type_regular,
633
+ level5FontWeight: globalTokens.type_semibold,
642
634
  level5LineHeight: globalTokens.type_leading_normal,
643
635
  level5LetterSpacing: globalTokens.type_spacing_wide_01
644
636
  },
645
- inputText: {
646
- fontFamily: globalTokens.type_sans,
647
- assistiveTextFontColor: globalTokens.black,
648
- assistiveTextFontColorOnDark: globalTokens.white,
649
- assistiveTextFontSize: globalTokens.type_scale_01,
650
- assistiveTextFontStyle: globalTokens.type_normal,
651
- assistiveTextFontWeight: globalTokens.type_regular,
652
- disabledColor: globalTokens.lighterBlack,
653
- disabledColorOnDark: "#575757",
654
- errorColor: globalTokens.red,
655
- errorColorOnDark: globalTokens.hal_red_l_60,
656
- optionBackgroundColor: globalTokens.white,
657
- optionBorderColor: globalTokens.black,
658
- optionBorderThickness: "0px",
659
- optionBorderStyle: "solid",
660
- optionFontColor: globalTokens.black,
661
- optionFontColorOnDark: globalTokens.white,
662
- optionFontSize: globalTokens.type_scale_03,
663
- optionFontStyle: globalTokens.type_normal,
664
- optionFontWeight: globalTokens.type_regular,
665
- optionPaddingBottom: "6px",
666
- optionPaddingTop: "6px",
667
- scrollBarThumbColor: globalTokens.darkGrey,
668
- scrollBarTrackColor: globalTokens.lightGrey,
669
- hoverOptionColor: globalTokens.black,
670
- hoverOptionBackgroundColor: globalTokens.lightWhite,
671
- hoverOptionBackgroundColorOnDark: globalTokens.mediumGrey,
672
- selectedOptionBackgroundColor: globalTokens.lightGrey,
673
- selectedOptionBackgroundColorOnDark: globalTokens.lightGrey,
674
- labelFontColor: globalTokens.black,
675
- labelFontColorOnDark: globalTokens.white,
676
- labelFontSize: globalTokens.type_scale_03,
677
- labelFontStyle: globalTokens.type_normal,
678
- labelFontWeight: globalTokens.type_regular,
679
- valueFontColor: globalTokens.black,
680
- valueFontColorOnDark: globalTokens.white,
681
- valueFontSize: globalTokens.type_scale_03,
682
- valueFontStyle: globalTokens.type_normal,
683
- valueFontWeight: globalTokens.type_regular,
684
- prefixIconColor: globalTokens.black,
685
- prefixIconColorOnDark: globalTokens.white,
686
- prefixLabelFontColor: globalTokens.black,
687
- prefixLabelFontColorOnDark: globalTokens.white,
688
- prefixLabelFontSize: globalTokens.type_scale_03,
689
- prefixLabelFontStyle: globalTokens.type_normal,
690
- prefixLabelFontWeight: globalTokens.type_regular,
691
- suffixIconColor: globalTokens.black,
692
- suffixIconColorOnDark: globalTokens.white,
693
- suffixLabelFontColor: globalTokens.black,
694
- suffixLabelFontColorOnDark: globalTokens.white,
695
- suffixLabelFontSize: globalTokens.type_scale_03,
696
- suffixLabelFontStyle: globalTokens.type_normal,
697
- suffixLabelFontWeight: globalTokens.type_regular,
698
- underlineColor: globalTokens.black,
699
- underlineColorOnDark: globalTokens.white,
700
- underlineFocusColor: globalTokens.black,
701
- underlineFocusColorOnDark: globalTokens.white,
702
- underlineThickness: "1px"
703
- },
704
637
  textInput: {
705
638
  fontFamily: globalTokens.type_sans,
706
639
  enabledBorderColor: globalTokens.hal_black,
@@ -780,7 +713,7 @@ var componentTokens = {
780
713
  activeActionBackgroundColor: globalTokens.hal_grey_l_80,
781
714
  activeActionBackgroundColorOnDark: globalTokens.hal_grey_l_60,
782
715
  listDialogBackgroundColor: globalTokens.hal_white,
783
- listDialogBorderColor: globalTokens.hal_black,
716
+ listDialogBorderColor: globalTokens.hal_grey_l_75,
784
717
  listOptionDividerColor: globalTokens.hal_grey_l_90,
785
718
  listOptionFontColor: globalTokens.hal_black,
786
719
  listOptionFontSize: globalTokens.type_scale_02,
@@ -797,7 +730,7 @@ var componentTokens = {
797
730
  link: {
798
731
  fontColor: globalTokens.hal_blue_s_35,
799
732
  fontFamily: globalTokens.inherit,
800
- fontSize: globalTokens.type_scale_root,
733
+ fontSize: globalTokens.inherit,
801
734
  fontStyle: globalTokens.type_normal,
802
735
  fontWeight: globalTokens.type_regular,
803
736
  iconSize: "16px",
@@ -814,6 +747,13 @@ var componentTokens = {
814
747
  activeUnderlineColor: globalTokens.black,
815
748
  focusColor: globalTokens.hal_blue_l_50
816
749
  },
750
+ paragraph: {
751
+ fontColor: globalTokens.hal_black,
752
+ fontColorOnDark: globalTokens.hal_white,
753
+ display: "block",
754
+ fontSize: globalTokens.type_scale_03,
755
+ fontWeight: globalTokens.type_regular
756
+ },
817
757
  paginator: {
818
758
  backgroundColor: globalTokens.darkWhite,
819
759
  fontColor: globalTokens.hal_black,
@@ -822,15 +762,15 @@ var componentTokens = {
822
762
  fontStyle: globalTokens.type_normal,
823
763
  fontWeight: globalTokens.type_regular,
824
764
  fontTextTransform: "none",
825
- height: "64px",
826
- width: "100%",
765
+ verticalPadding: "0.75rem",
766
+ horizontalPadding: "2rem",
827
767
  marginRight: "40px",
828
768
  marginLeft: "20px",
829
769
  itemsPerPageSelectorMarginLeft: "0px",
830
- itemsPerPageSelectorMarginRight: "30px",
770
+ itemsPerPageSelectorMarginRight: "0.5rem",
831
771
  pageSelectorMarginRight: "30px",
832
772
  pageSelectorMarginLeft: "0px",
833
- totalItemsContainerMarginRight: "30px",
773
+ totalItemsContainerMarginRight: "2.5rem",
834
774
  totalItemsContainerMarginLeft: "0px"
835
775
  },
836
776
  progressBar: {
@@ -862,24 +802,61 @@ var componentTokens = {
862
802
  overlayColor: globalTokens.black,
863
803
  overlayOpacity: "0.8"
864
804
  },
865
- radio: {
866
- circleLabelSpacing: "10px",
867
- circleSize: "24px",
868
- color: globalTokens.black,
869
- colorOnDark: globalTokens.white,
870
- disabledColor: globalTokens.lighterBlack,
871
- disabledColorOnDark: "#575757",
872
- disabledFontColor: globalTokens.lighterBlack,
873
- disabledFontColorOnDark: "#575757",
874
- focusColor: globalTokens.hal_blue_l_50,
875
- focusColorOnDark: "#1682FF",
876
- fontColor: globalTokens.inherit,
877
- fontColorOnDark: globalTokens.white,
805
+ quickNav: {
806
+ fontColor: globalTokens.hal_grey_s_40,
807
+ hoverFontColor: globalTokens.hal_purple_d_70,
808
+ dividerBorderColor: globalTokens.hal_grey_l_75,
809
+ focusBorderColor: globalTokens.hal_blue_l_50,
810
+ focusBorderStyle: globalTokens.border_solid,
811
+ focusBorderThickness: globalTokens.border_width_2,
812
+ focusBorderRadius: globalTokens.border_width_2,
813
+ paddingTop: globalTokens.spacing_03,
814
+ paddingBottom: globalTokens.spacing_03,
815
+ paddingLeft: globalTokens.spacing_05,
816
+ paddingRight: globalTokens.spacing_05,
878
817
  fontFamily: globalTokens.type_sans,
879
- fontSize: globalTokens.type_scale_root,
818
+ fontSize: globalTokens.type_scale_02,
880
819
  fontStyle: globalTokens.type_normal,
881
820
  fontWeight: globalTokens.type_regular
882
821
  },
822
+ radioGroup: {
823
+ fontFamily: globalTokens.type_sans,
824
+ radioInputColor: globalTokens.hal_blue_l_45,
825
+ hoverRadioInputColor: globalTokens.hal_blue_s_35,
826
+ focusBorderColor: globalTokens.hal_blue_l_50,
827
+ activeRadioInputColor: globalTokens.hal_blue_d_20,
828
+ errorRadioInputColor: globalTokens.hal_red_s_41,
829
+ hoverErrorRadioInputColor: globalTokens.hal_red_d_30,
830
+ activeErrorRadioInputColor: globalTokens.hal_red_d_20,
831
+ readonlyRadioInputColor: globalTokens.hal_grey_l_60,
832
+ hoverReadonlyRadioInputColor: globalTokens.color_grey_600,
833
+ activeReadonlyRadioInputColor: globalTokens.hal_grey_s_40,
834
+ disabledRadioInputColor: globalTokens.hal_grey_l_60,
835
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
836
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
837
+ disabledRadioInputLabelFontColor: globalTokens.hal_grey_l_60,
838
+ errorMessageColor: globalTokens.hal_red_s_41,
839
+ labelFontColor: globalTokens.hal_black,
840
+ labelFontSize: globalTokens.type_scale_02,
841
+ labelFontStyle: globalTokens.type_normal,
842
+ labelFontWeight: globalTokens.type_semibold,
843
+ labelLineHeight: globalTokens.type_leading_loose_01,
844
+ optionalLabelFontWeight: globalTokens.type_regular,
845
+ helperTextFontColor: globalTokens.hal_black,
846
+ helperTextFontSize: globalTokens.type_scale_01,
847
+ helperTextFontStyle: globalTokens.type_normal,
848
+ helperTextFontWeight: globalTokens.type_regular,
849
+ helperTextLineHeight: globalTokens.type_leading_normal,
850
+ radioInputLabelFontColor: globalTokens.hal_black,
851
+ radioInputLabelFontSize: globalTokens.type_scale_02,
852
+ radioInputLabelFontStyle: globalTokens.type_normal,
853
+ radioInputLabelFontWeight: globalTokens.type_regular,
854
+ radioInputLabelLineHeight: globalTokens.type_leading_loose_01,
855
+ groupLabelMargin: globalTokens.spacing_03,
856
+ radioInputLabelMargin: globalTokens.spacing_03,
857
+ groupVerticalGutter: globalTokens.spacing_02,
858
+ groupHorizontalGutter: globalTokens.spacing_07
859
+ },
883
860
  select: {
884
861
  fontFamily: globalTokens.type_sans,
885
862
  disabledColor: globalTokens.hal_grey_l_60,
@@ -947,88 +924,40 @@ var componentTokens = {
947
924
  activeSelectionIndicatorActionBackgroundColor: globalTokens.hal_grey_l_80,
948
925
  activeSelectionIndicatorActionIconColor: globalTokens.hal_black
949
926
  },
950
- V3Select: {
951
- fontFamily: globalTokens.type_sans,
952
- assistiveTextFontColor: globalTokens.hal_black,
953
- assistiveTextFontColorOnDark: globalTokens.hal_white,
954
- assistiveTextFontSize: globalTokens.type_scale_01,
955
- assistiveTextFontStyle: globalTokens.type_normal,
956
- assistiveTextFontWeight: globalTokens.type_regular,
957
- labelFontColor: globalTokens.hal_black,
958
- labelFontColorOnDark: globalTokens.hal_white,
959
- labelFontSize: globalTokens.type_scale_03,
960
- labelFontStyle: globalTokens.type_normal,
961
- labelFontWeight: globalTokens.type_regular,
962
- disabledColor: globalTokens.lighterBlack,
963
- disabledColorOnDark: "#575757",
964
- errorColor: globalTokens.red,
965
- errorColorOnDark: globalTokens.hal_red_l_60,
966
- optionBackgroundColor: globalTokens.hal_white,
967
- optionBorderColor: globalTokens.hal_black,
968
- optionBorderThickness: "0px",
969
- optionBorderStyle: "solid",
970
- optionFontColor: globalTokens.hal_black,
971
- optionFontColorOnDark: globalTokens.hal_white,
972
- optionFontSize: globalTokens.type_scale_root,
973
- optionFontStyle: globalTokens.type_normal,
974
- optionFontWeight: globalTokens.type_regular,
975
- optionPaddingBottom: "6px",
976
- optionPaddingTop: "6px",
977
- scrollBarThumbColor: globalTokens.hal_grey_s_40,
978
- scrollBarTrackColor: globalTokens.lightGrey,
979
- optionIconColor: globalTokens.hal_black,
980
- optionIconColorOnDark: globalTokens.hal_white,
981
- optionIconSpacing: "12px",
982
- optionIconSize: "20px",
983
- optionCheckboxSpacing: "12px",
984
- hoverOptionBackgroundColor: globalTokens.hal_grey_l_95,
985
- hoverOptionBackgroundColorOnDark: globalTokens.hal_grey_l_95,
986
- activeOptionBackgroundColor: globalTokens.hal_grey_l_80,
987
- activeOptionBackgroundColorOnDark: globalTokens.hal_grey_l_80,
988
- selectedOptionBackgroundColor: globalTokens.lightGrey,
989
- selectedOptionBackgroundColorOnDark: globalTokens.lightGrey,
990
- underlineColor: globalTokens.hal_black,
991
- underlineColorOnDark: globalTokens.hal_white,
992
- underlineFocusColor: globalTokens.hal_black,
993
- underlineFocusColorOnDark: globalTokens.hal_white,
994
- underlineThickness: "1px",
995
- valueFontColor: globalTokens.hal_black,
996
- valueFontColorOnDark: globalTokens.hal_white,
997
- valueFontSize: globalTokens.type_scale_03,
998
- valueFontStyle: globalTokens.type_normal,
999
- valueFontWeight: globalTokens.type_regular,
1000
- valueIconColor: globalTokens.hal_black,
1001
- valueIconColorOnDark: globalTokens.hal_white,
1002
- valueIconSize: "20px",
1003
- valueIconSpacing: "12px",
1004
- arrowColor: globalTokens.hal_black,
1005
- arrowColorOnDark: globalTokens.hal_white,
1006
- focusColor: globalTokens.hal_blue_l_50,
1007
- focusColorOnDark: globalTokens.hal_blue_l_50
1008
- },
1009
927
  sidenav: {
1010
928
  backgroundColor: globalTokens.hal_grey_l_95,
1011
929
  arrowContainerColor: globalTokens.hal_grey_l_90,
1012
930
  arrowColor: globalTokens.hal_black,
1013
931
  titleFontFamily: globalTokens.type_sans,
1014
- titleFontSize: globalTokens.type_scale_05,
932
+ titleFontSize: globalTokens.type_scale_04,
1015
933
  titleFontStyle: globalTokens.type_normal,
1016
- titleFontWeight: globalTokens.type_regular,
1017
- titleFontColor: globalTokens.hal_black,
934
+ titleFontWeight: globalTokens.type_semibold,
935
+ titleFontColor: globalTokens.color_grey_800,
1018
936
  titleFontTextTransform: "none",
1019
937
  titleFontLetterSpacing: globalTokens.type_spacing_normal,
1020
- subtitleFontFamily: globalTokens.type_sans,
1021
- subtitleFontSize: globalTokens.type_scale_03,
1022
- subtitleFontStyle: globalTokens.type_normal,
1023
- subtitleFontWeight: globalTokens.type_regular,
1024
- subtitleFontColor: globalTokens.color_grey_800,
1025
- subtitleFontTextTransform: globalTokens.type_uppercase,
1026
- subtitleFontLetterSpacing: globalTokens.type_spacing_wide_02,
938
+ groupTitleFontFamily: globalTokens.type_sans,
939
+ groupTitleFontSize: globalTokens.type_scale_02,
940
+ groupTitleFontStyle: globalTokens.type_normal,
941
+ groupTitleFontWeight: globalTokens.type_semibold,
942
+ groupTitleFontColor: globalTokens.black,
943
+ groupTitleHoverBackgroundColor: globalTokens.hal_grey_l_90,
944
+ groupTitleActiveBackgroundColor: globalTokens.hal_grey_l_80,
945
+ groupTitleSelectedFontColor: globalTokens.white,
946
+ groupTitleSelectedBackgroundColor: globalTokens.color_grey_800,
947
+ groupTitleSelectedHoverFontColor: globalTokens.white,
948
+ groupTitleSelectedHoverBackgroundColor: globalTokens.color_grey_600,
949
+ groupTitleFontTextTransform: globalTokens.type_uppercase,
950
+ groupTitleFontLetterSpacing: globalTokens.type_spacing_wide_02,
1027
951
  linkFontFamily: globalTokens.type_sans,
1028
952
  linkFontSize: globalTokens.type_scale_02,
1029
953
  linkFontStyle: globalTokens.type_normal,
1030
954
  linkFontWeight: globalTokens.type_regular,
1031
955
  linkFontColor: globalTokens.color_grey_800,
956
+ linkHoverBackgroundColor: globalTokens.hal_grey_l_90,
957
+ linkSelectedFontColor: globalTokens.white,
958
+ linkSelectedBackgroundColor: globalTokens.color_grey_800,
959
+ linkSelectedHoverFontColor: globalTokens.white,
960
+ linkSelectedHoverBackgroundColor: globalTokens.color_grey_600,
1032
961
  linkFontTextTransform: "none",
1033
962
  linkFontLetterSpacing: globalTokens.type_spacing_wide_01,
1034
963
  linkTextDecoration: globalTokens.type_no_line,
@@ -1042,9 +971,13 @@ var componentTokens = {
1042
971
  },
1043
972
  slider: {
1044
973
  fontFamily: globalTokens.type_sans,
1045
- fontSize: globalTokens.type_scale_03,
1046
- fontStyle: globalTokens.type_normal,
1047
- fontWeight: globalTokens.type_regular,
974
+ limitValuesFontColor: globalTokens.hal_black,
975
+ limitValuesFontColorOnDark: globalTokens.hal_white,
976
+ limitValuesFontSize: globalTokens.type_scale_03,
977
+ limitValuesFontStyle: globalTokens.type_normal,
978
+ limitValuesFontWeight: globalTokens.type_regular,
979
+ limitValuesFontLetterSpacing: globalTokens.type_spacing_normal,
980
+ disabledLimitValuesFontColor: globalTokens.hal_grey_l_60,
1048
981
  labelFontFamily: globalTokens.type_sans,
1049
982
  labelFontSize: globalTokens.type_scale_02,
1050
983
  labelFontStyle: globalTokens.type_normal,
@@ -1058,9 +991,13 @@ var componentTokens = {
1058
991
  fontColor: globalTokens.hal_black,
1059
992
  fontColorOnDark: globalTokens.hal_white,
1060
993
  labelFontColor: globalTokens.hal_black,
994
+ labelFontColorOnDark: globalTokens.hal_white,
1061
995
  helperTextFontColor: globalTokens.hal_black,
1062
- disabledFontColor: globalTokens.hal_grey_l_60,
1063
- fontLetterSpacing: globalTokens.type_spacing_normal,
996
+ helperTextFontColorOnDark: globalTokens.hal_white,
997
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
998
+ disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
999
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
1000
+ disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
1064
1001
  thumbHeight: "12px",
1065
1002
  thumbWidth: "12px",
1066
1003
  hoverThumbHeight: "14px",
@@ -1088,7 +1025,7 @@ var componentTokens = {
1088
1025
  trackLineColorOnDark: globalTokens.hal_blue_l_50,
1089
1026
  totalLineThickness: "2px",
1090
1027
  totalLineVerticalPosition: "50%",
1091
- totalLineColor: globalTokens.hal_grey_l_90,
1028
+ totalLineColor: "#0000001a",
1092
1029
  totalLineColorOnDark: globalTokens.hal_grey_l_75,
1093
1030
  disabledThumbVerticalPosition: "10px",
1094
1031
  disabledThumbBackgroundColor: globalTokens.hal_grey_l_60,
@@ -1108,7 +1045,7 @@ var componentTokens = {
1108
1045
  },
1109
1046
  spinner: {
1110
1047
  trackCircleColor: "#5f249f",
1111
- trackCircleColorOnDark: "#a46ede",
1048
+ trackCircleColorOverlay: "#a46ede",
1112
1049
  totalCircleColor: globalTokens.white,
1113
1050
  labelFontFamily: globalTokens.type_sans,
1114
1051
  labelFontSize: globalTokens.type_scale_02,
@@ -1142,37 +1079,37 @@ var componentTokens = {
1142
1079
  "switch": {
1143
1080
  checkedTrackBackgroundColor: globalTokens.hal_purple_s_38,
1144
1081
  checkedTrackBackgroundColorOnDark: globalTokens.hal_purple_s_38,
1145
- checkedThumbBackgroundColor: globalTokens.white,
1146
- checkedThumbBackgroundColorOnDark: globalTokens.white,
1147
- uncheckedTrackBackgroundColor: globalTokens.lightGrey,
1148
- uncheckedTrackBackgroundColorOnDark: globalTokens.lightGrey,
1149
- uncheckedThumbBackgroundColor: globalTokens.white,
1150
- uncheckedThumbBackgroundColorOnDark: globalTokens.white,
1151
- disabledCheckedTrackBackgroundColor: globalTokens.lightPurple,
1082
+ checkedThumbBackgroundColor: globalTokens.hal_white,
1083
+ checkedThumbBackgroundColorOnDark: globalTokens.hal_white,
1084
+ uncheckedTrackBackgroundColor: globalTokens.hal_grey_l_75,
1085
+ uncheckedTrackBackgroundColorOnDark: globalTokens.hal_grey_l_75,
1086
+ uncheckedThumbBackgroundColor: globalTokens.hal_white,
1087
+ uncheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
1088
+ disabledCheckedTrackBackgroundColor: globalTokens.hal_purple_l_95,
1152
1089
  disabledCheckedTrackBackgroundColorOnDark: "#1c0b24",
1153
- disabledCheckedThumbBackgroundColor: globalTokens.white,
1154
- disabledCheckedThumbBackgroundColorOnDark: globalTokens.white,
1155
- disabledUncheckedTrackBackgroundColor: globalTokens.lightWhite,
1090
+ disabledCheckedThumbBackgroundColor: globalTokens.hal_white,
1091
+ disabledCheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
1092
+ disabledUncheckedTrackBackgroundColor: globalTokens.hal_grey_l_95,
1156
1093
  disabledUncheckedTrackBackgroundColorOnDark: "#363636",
1157
- disabledUncheckedThumbBackgroundColor: globalTokens.white,
1158
- disabledUncheckedThumbBackgroundColorOnDark: globalTokens.white,
1159
- disabledLabelFontColor: globalTokens.lighterBlack,
1094
+ disabledUncheckedThumbBackgroundColor: globalTokens.hal_white,
1095
+ disabledUncheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
1096
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1160
1097
  disabledLabelFontColorOnDark: "#575757",
1161
1098
  disabledLabelFontStyle: globalTokens.type_normal,
1162
1099
  labelFontFamily: globalTokens.type_sans,
1163
1100
  labelFontSize: globalTokens.type_scale_root,
1164
1101
  labelFontStyle: globalTokens.type_normal,
1165
1102
  labelFontWeight: globalTokens.type_regular,
1166
- labelFontColor: globalTokens.black,
1167
- labelFontColorOnDark: globalTokens.white,
1168
- thumbFocusColor: globalTokens.blue,
1103
+ labelFontColor: globalTokens.hal_black,
1104
+ labelFontColorOnDark: globalTokens.hal_white,
1105
+ thumbFocusColor: globalTokens.hal_blue_l_50,
1169
1106
  thumbFocusColorOnDark: "#1682FF",
1170
1107
  thumbHeight: "24px",
1171
1108
  thumbWidth: "24px",
1172
- thumbShift: "40%",
1109
+ thumbShift: "1.25rem",
1173
1110
  trackHeight: "12px",
1174
- trackWidth: "60px",
1175
- spaceBetweenLabelSwitch: "0px"
1111
+ trackWidth: "36px",
1112
+ spaceBetweenLabelSwitch: "8px"
1176
1113
  },
1177
1114
  tag: {
1178
1115
  fontFamily: globalTokens.type_sans,
@@ -1243,6 +1180,7 @@ var componentTokens = {
1243
1180
  disabledFontColor: "#999999",
1244
1181
  disabledIconColor: "#999999",
1245
1182
  disabledFontStyle: globalTokens.type_normal,
1183
+ disabledBadgeBackgroundColor: "#0000004D",
1246
1184
  hoverBackgroundColor: "#f2eafa",
1247
1185
  pressedBackgroundColor: "#e5d5f6",
1248
1186
  pressedFontWeight: globalTokens.type_semibold,
@@ -1280,6 +1218,8 @@ var componentTokens = {
1280
1218
  errorBorderColorOnDark: globalTokens.hal_red_l_60,
1281
1219
  hoverErrorBorderColor: globalTokens.color_red_600,
1282
1220
  hoverErrorBorderColorOnDark: "#fe677b",
1221
+ inputMarginTop: globalTokens.spacing_02,
1222
+ inputMarginBottom: globalTokens.spacing_02,
1283
1223
  errorMessageColor: globalTokens.hal_red_s_41,
1284
1224
  errorMessageColorOnDark: globalTokens.hal_red_l_60,
1285
1225
  labelFontColor: globalTokens.hal_black,
@@ -1311,41 +1251,6 @@ var componentTokens = {
1311
1251
  disabledValueFontColor: globalTokens.hal_grey_l_60,
1312
1252
  disabledValueFontColorOnDark: globalTokens.hal_grey_l_60
1313
1253
  },
1314
- V3Textarea: {
1315
- fontFamily: globalTokens.type_sans,
1316
- assistiveTextFontSize: globalTokens.type_scale_01,
1317
- assistiveTextFontStyle: globalTokens.type_normal,
1318
- assistiveTextFontWeight: globalTokens.type_regular,
1319
- assistiveTextFontColor: globalTokens.black,
1320
- assistiveTextFontColorOnDark: globalTokens.white,
1321
- assistiveTextLetterSpacing: "0.03333em",
1322
- disabledColor: globalTokens.lighterBlack,
1323
- disabledColorOnDark: "#575757",
1324
- errorColor: globalTokens.red,
1325
- errorColorOnDark: globalTokens.hal_red_l_60,
1326
- scrollBarThumbColor: globalTokens.darkGrey,
1327
- scrollBarThumbColorOnDark: globalTokens.white,
1328
- scrollBarTrackColor: globalTokens.lightGrey,
1329
- scrollBarTrackColorOnDark: "#999999",
1330
- labelFontSize: globalTokens.type_scale_03,
1331
- labelFontStyle: globalTokens.type_normal,
1332
- labelFontWeight: globalTokens.type_regular,
1333
- labelFontColor: globalTokens.black,
1334
- labelFontColorOnDark: globalTokens.white,
1335
- labelLetterSpacing: "0.00938em",
1336
- valueFontSize: globalTokens.type_scale_03,
1337
- valueFontStyle: globalTokens.type_normal,
1338
- valueFontWeight: globalTokens.type_regular,
1339
- valueFontColor: globalTokens.black,
1340
- valueFontColorOnDark: globalTokens.white,
1341
- valueLetterSpacing: globalTokens.type_spacing_normal,
1342
- valueLineHeight: "1.1875em",
1343
- underlineColor: globalTokens.black,
1344
- underlineColorOnDark: globalTokens.white,
1345
- underlineFocusColor: globalTokens.black,
1346
- underlineFocusColorOnDark: globalTokens.white,
1347
- underlineThickness: "1px"
1348
- },
1349
1254
  toggleGroup: {
1350
1255
  containerBackgroundColor: globalTokens.color_grey_50,
1351
1256
  containerBorderColor: globalTokens.hal_grey_l_60,
@@ -1394,121 +1299,65 @@ var componentTokens = {
1394
1299
  containerBorderRadius: globalTokens.border_radius_large,
1395
1300
  optionFocusBorderThickness: globalTokens.border_width_2
1396
1301
  },
1397
- upload: {
1398
- fontFamily: globalTokens.type_sans,
1399
- shadowColor: globalTokens.lightWhite,
1400
- scrollBarThumbColor: globalTokens.darkGrey,
1401
- scrollBarTrackColor: globalTokens.lightGrey,
1402
- errorColor: globalTokens.red,
1403
- backgroundColor: globalTokens.white,
1404
- draggingStateBackgroundColor: globalTokens.lightWhite,
1405
- dragAndDropIconColor: globalTokens.black,
1406
- dragAndDropIconSize: "43.5px",
1407
- dragAndDropTitleFontSize: globalTokens.type_scale_04,
1408
- dragAndDropTitleFontStyle: globalTokens.type_normal,
1409
- dragAndDropTitleFontWeight: globalTokens.type_bold,
1410
- dragAndDropTitleFontTextTransform: "none",
1411
- dragAndDropTitleFontColor: globalTokens.black,
1412
- dragAndDropDescriptionFontSize: globalTokens.type_scale_03,
1413
- dragAndDropDescriptionFontStyle: globalTokens.type_italic,
1414
- dragAndDropDescriptionFontWeight: globalTokens.type_regular,
1415
- dragAndDropDescriptionFontTextTransform: "none",
1416
- dragAndDropDescriptionFontColor: globalTokens.darkGrey,
1417
- dragAndDropDraggingStateIconColor: globalTokens.darkGrey,
1418
- dragAndDropDraggingStateIconSize: "74.5px",
1419
- dragAndDropDraggingStateFontSize: globalTokens.type_scale_03,
1420
- dragAndDropDraggingStateFontStyle: globalTokens.type_italic,
1421
- dragAndDropDraggingStateFontWeight: globalTokens.type_regular,
1422
- dragAndDropDraggingStateFontTextTransform: "none",
1423
- dragAndDropDraggingStateFontColor: globalTokens.darkGrey,
1424
- dragAndDropAreaIconColor: globalTokens.darkGrey,
1425
- dragAndDropAreaIconSize: "24px",
1426
- dragAndDropAreaTextFontSize: globalTokens.type_scale_01,
1427
- dragAndDropAreaTextFontStyle: globalTokens.type_italic,
1428
- dragAndDropAreaTextFontWeight: globalTokens.type_regular,
1429
- dragAndDropAreaTextFontTextTransform: "none",
1430
- dragAndDropAreaTextFontColor: globalTokens.darkGrey,
1431
- fileDeleteIconColor: globalTokens.black,
1432
- fileDeleteIconSize: "30px",
1433
- fileUnderlineColor: globalTokens.lightGrey,
1434
- fileUnderlineThickness: "1px",
1435
- fileNameFontSize: globalTokens.type_scale_03,
1436
- fileNameFontStyle: globalTokens.type_normal,
1437
- fileNameFontWeight: globalTokens.type_regular,
1438
- fileNameFontTextTransform: "none",
1439
- fileNameFontColor: globalTokens.black,
1440
- fileTypeFontSize: globalTokens.type_scale_01,
1441
- fileTypeFontStyle: globalTokens.type_normal,
1442
- fileTypeFontWeight: globalTokens.type_regular,
1443
- fileTypeFontTextTransform: globalTokens.type_uppercase,
1444
- fileTypeFontColor: globalTokens.darkGrey,
1445
- hoverFileColor: globalTokens.darkWhite,
1446
- uploadedFileIconColor: globalTokens.lightGrey,
1447
- uploadedFileIconSize: "24px",
1448
- uploadedFilesTitleFontSize: globalTokens.type_scale_04,
1449
- uploadedFilesTitleFontStyle: globalTokens.type_normal,
1450
- uploadedFilesTitleFontWeight: globalTokens.type_regular,
1451
- uploadedFilesTitleFontTextTransform: "none",
1452
- uploadedFilesTitleFontColor: globalTokens.black,
1453
- uploadedFilesSubtitleFontSize: globalTokens.type_scale_01,
1454
- uploadedFilesSubtitleFontStyle: globalTokens.type_normal,
1455
- uploadedFilesSubtitleFontWeight: globalTokens.type_regular,
1456
- uploadedFilesSubtitleFontTextTransform: "none",
1457
- uploadedFilesSubtitleFontColor: globalTokens.darkGrey,
1458
- uploadedFilesNumberFontWeight: globalTokens.type_bold
1459
- },
1460
1302
  wizard: {
1461
- disabledBackgroundColor: globalTokens.lightGrey,
1462
- disabledFontColor: globalTokens.darkGrey,
1463
- stepContainerFontSize: globalTokens.type_scale_03,
1464
- stepContainerFontFamily: globalTokens.type_sans,
1465
- stepContainerFontStyle: globalTokens.type_normal,
1466
- stepContainerFontWeight: globalTokens.type_regular,
1467
- stepContainerLetterSpacing: globalTokens.type_spacing_wide_02,
1468
- stepContainerFontColor: globalTokens.black,
1469
- stepContainerSelectedFontColor: globalTokens.white,
1470
- stepContainerSelectedBackgroundColor: globalTokens.hal_purple_s_38,
1471
- stepContainerBackgroundColor: globalTokens.white,
1472
- 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,
1473
1333
  labelFontSize: globalTokens.type_scale_03,
1474
1334
  labelFontFamily: globalTokens.type_sans,
1475
1335
  labelFontStyle: globalTokens.type_normal,
1476
1336
  labelFontWeight: globalTokens.type_regular,
1477
- labelLetterSpacing: globalTokens.type_spacing_normal,
1337
+ labelFontTracking: globalTokens.type_spacing_normal,
1478
1338
  labelFontTextTransform: "none",
1479
1339
  labelTextAlign: "left",
1480
- labelFontColor: globalTokens.darkGrey,
1481
- visitedLabelFontColor: globalTokens.black,
1482
- visitedDescriptionFontColor: globalTokens.black,
1483
- descriptionFontSize: globalTokens.type_scale_01,
1484
- descriptionFontFamily: globalTokens.type_sans,
1485
- descriptionFontStyle: globalTokens.type_normal,
1486
- descriptionFontWeight: globalTokens.type_regular,
1487
- descriptionLetterSpacing: globalTokens.type_spacing_wide_01,
1488
- descriptionFontTextTransform: "none",
1489
- descriptionFontColor: globalTokens.darkGrey,
1490
- descriptionTextAlign: "left",
1491
- circleWidth: "32px",
1492
- circleHeight: "32px",
1493
- circleBorderThickness: "2px",
1494
- circleBorderStyle: "solid",
1495
- circleBorderRadius: "45px",
1496
- circleBorderColor: globalTokens.black,
1497
- selectedCircleWidth: "32px",
1498
- selectedCircleHeight: "32px",
1499
- selectedCircleBorderThickness: "2px",
1500
- selectedCircleBorderStyle: "solid",
1501
- selectedCircleBorderRadius: "45px",
1502
- selectedCircleBorderColor: globalTokens.purple,
1503
- disabledCircleWidth: "32px",
1504
- disabledCircleHeight: "32px",
1505
- disabledCircleBorderThickness: "2px",
1506
- disabledCircleBorderStyle: "solid",
1507
- disabledCircleBorderRadius: "45px",
1508
- 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",
1509
1358
  separatorBorderThickness: "1px",
1510
1359
  separatorBorderStyle: "solid",
1511
- separatorColor: globalTokens.lightGrey,
1360
+ separatorColor: globalTokens.hal_grey_s_40,
1512
1361
  focusColor: globalTokens.hal_blue_l_50
1513
1362
  }
1514
1363
  };
@@ -1524,12 +1373,11 @@ var spaces = {
1524
1373
  };
1525
1374
  exports.spaces = spaces;
1526
1375
  var responsiveSizes = {
1527
- mobileSmall: "320",
1528
- mobileMedium: "375",
1529
- mobileLarge: "425",
1530
- tablet: "768",
1531
- laptop: "1024",
1532
- desktop: "1440"
1376
+ xsmall: "20",
1377
+ small: "30",
1378
+ medium: "45",
1379
+ large: "66",
1380
+ xlarge: "90"
1533
1381
  };
1534
1382
  exports.responsiveSizes = responsiveSizes;
1535
1383
  var typeface = {
@@ -1564,4 +1412,101 @@ var typeface = {
1564
1412
  textTransform: "uppercase"
1565
1413
  }
1566
1414
  };
1567
- 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: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
1504
+ daysShort: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
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;