@dxc-technology/halstack-react 0.0.0-9b45027 → 0.0.0-9bd9511

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 (294) hide show
  1. package/BackgroundColorContext.d.ts +2 -2
  2. package/BackgroundColorContext.js +1 -11
  3. package/HalstackContext.d.ts +13 -0
  4. package/HalstackContext.js +318 -0
  5. package/accordion/Accordion.d.ts +1 -1
  6. package/accordion/Accordion.js +124 -179
  7. package/accordion/Accordion.stories.tsx +115 -27
  8. package/accordion/Accordion.test.js +56 -0
  9. package/accordion/types.d.ts +12 -11
  10. package/accordion-group/AccordionGroup.d.ts +1 -1
  11. package/accordion-group/AccordionGroup.js +28 -77
  12. package/accordion-group/AccordionGroup.stories.tsx +28 -2
  13. package/accordion-group/AccordionGroup.test.js +108 -0
  14. package/accordion-group/types.d.ts +19 -12
  15. package/alert/Alert.js +18 -46
  16. package/alert/Alert.stories.tsx +28 -0
  17. package/alert/Alert.test.js +75 -0
  18. package/alert/types.d.ts +3 -3
  19. package/badge/Badge.d.ts +4 -0
  20. package/badge/Badge.js +6 -16
  21. package/badge/types.d.ts +5 -0
  22. package/bleed/Bleed.d.ts +2 -2
  23. package/bleed/Bleed.js +14 -55
  24. package/bleed/Bleed.stories.tsx +94 -95
  25. package/bleed/types.d.ts +26 -2
  26. package/box/Box.js +34 -63
  27. package/box/Box.stories.tsx +15 -0
  28. package/box/Box.test.js +13 -0
  29. package/box/types.d.ts +5 -4
  30. package/bulleted-list/BulletedList.d.ts +7 -0
  31. package/bulleted-list/BulletedList.js +98 -0
  32. package/bulleted-list/BulletedList.stories.tsx +200 -0
  33. package/bulleted-list/types.d.ts +11 -0
  34. package/bulleted-list/types.js +5 -0
  35. package/button/Button.js +61 -100
  36. package/button/Button.stories.tsx +159 -8
  37. package/button/Button.test.js +26 -0
  38. package/button/types.d.ts +8 -8
  39. package/card/Card.js +44 -70
  40. package/card/Card.test.js +39 -0
  41. package/card/types.d.ts +4 -3
  42. package/checkbox/Checkbox.d.ts +2 -2
  43. package/checkbox/Checkbox.js +115 -162
  44. package/checkbox/Checkbox.stories.tsx +198 -130
  45. package/checkbox/Checkbox.test.js +128 -0
  46. package/checkbox/types.d.ts +14 -6
  47. package/chip/Chip.d.ts +1 -1
  48. package/chip/Chip.js +29 -91
  49. package/chip/Chip.stories.tsx +98 -13
  50. package/chip/Chip.test.js +42 -0
  51. package/chip/types.d.ts +8 -16
  52. package/common/utils.js +1 -6
  53. package/common/variables.d.ts +1431 -0
  54. package/common/variables.js +480 -554
  55. package/date-input/Calendar.d.ts +4 -0
  56. package/date-input/Calendar.js +215 -0
  57. package/date-input/DateInput.js +164 -300
  58. package/date-input/DateInput.stories.tsx +199 -33
  59. package/date-input/DateInput.test.js +648 -0
  60. package/date-input/DatePicker.d.ts +4 -0
  61. package/date-input/DatePicker.js +116 -0
  62. package/date-input/Icons.d.ts +6 -0
  63. package/date-input/Icons.js +63 -0
  64. package/date-input/YearPicker.d.ts +4 -0
  65. package/date-input/YearPicker.js +101 -0
  66. package/date-input/types.d.ts +71 -13
  67. package/dialog/Dialog.js +52 -84
  68. package/dialog/Dialog.stories.tsx +99 -22
  69. package/dialog/Dialog.test.js +56 -0
  70. package/dialog/types.d.ts +4 -3
  71. package/dropdown/Dropdown.d.ts +1 -1
  72. package/dropdown/Dropdown.js +240 -323
  73. package/dropdown/Dropdown.stories.tsx +255 -64
  74. package/dropdown/Dropdown.test.js +479 -0
  75. package/dropdown/DropdownMenu.d.ts +4 -0
  76. package/dropdown/DropdownMenu.js +60 -0
  77. package/dropdown/DropdownMenuItem.d.ts +4 -0
  78. package/dropdown/DropdownMenuItem.js +70 -0
  79. package/dropdown/types.d.ts +30 -19
  80. package/file-input/FileInput.d.ts +2 -2
  81. package/file-input/FileInput.js +224 -351
  82. package/file-input/FileInput.stories.tsx +122 -11
  83. package/file-input/FileInput.test.js +445 -0
  84. package/file-input/FileItem.d.ts +4 -14
  85. package/file-input/FileItem.js +48 -97
  86. package/file-input/types.d.ts +24 -7
  87. package/flex/Flex.d.ts +4 -0
  88. package/flex/Flex.js +57 -0
  89. package/flex/Flex.stories.tsx +103 -0
  90. package/flex/types.d.ts +32 -0
  91. package/flex/types.js +5 -0
  92. package/footer/Footer.js +36 -143
  93. package/footer/Footer.stories.tsx +99 -1
  94. package/footer/Footer.test.js +92 -0
  95. package/footer/Icons.js +1 -5
  96. package/footer/types.d.ts +7 -6
  97. package/header/Header.js +112 -177
  98. package/header/Header.stories.tsx +189 -36
  99. package/header/Header.test.js +66 -0
  100. package/header/Icons.js +2 -6
  101. package/header/types.d.ts +4 -3
  102. package/heading/Heading.js +8 -29
  103. package/heading/Heading.test.js +169 -0
  104. package/heading/types.d.ts +3 -3
  105. package/inset/Inset.js +14 -55
  106. package/inset/Inset.stories.tsx +36 -36
  107. package/inset/types.d.ts +26 -2
  108. package/layout/ApplicationLayout.d.ts +16 -6
  109. package/layout/ApplicationLayout.js +71 -164
  110. package/layout/ApplicationLayout.stories.tsx +84 -93
  111. package/layout/Icons.d.ts +5 -0
  112. package/layout/Icons.js +11 -10
  113. package/layout/SidenavContext.d.ts +5 -0
  114. package/layout/SidenavContext.js +15 -0
  115. package/layout/types.d.ts +18 -33
  116. package/link/Link.d.ts +3 -2
  117. package/link/Link.js +61 -106
  118. package/link/Link.stories.tsx +159 -52
  119. package/link/Link.test.js +65 -0
  120. package/link/types.d.ts +9 -29
  121. package/main.d.ts +11 -15
  122. package/main.js +48 -121
  123. package/nav-tabs/NavTabs.d.ts +8 -0
  124. package/nav-tabs/NavTabs.js +95 -0
  125. package/nav-tabs/NavTabs.stories.tsx +260 -0
  126. package/nav-tabs/NavTabs.test.js +75 -0
  127. package/nav-tabs/Tab.d.ts +4 -0
  128. package/nav-tabs/Tab.js +120 -0
  129. package/nav-tabs/types.d.ts +53 -0
  130. package/nav-tabs/types.js +5 -0
  131. package/number-input/NumberInput.js +21 -38
  132. package/number-input/NumberInput.stories.tsx +5 -5
  133. package/number-input/NumberInput.test.js +406 -0
  134. package/number-input/NumberInputContext.js +0 -5
  135. package/number-input/numberInputContextTypes.d.ts +1 -1
  136. package/number-input/types.d.ts +21 -14
  137. package/package.json +22 -25
  138. package/paginator/Icons.d.ts +5 -0
  139. package/paginator/Icons.js +16 -38
  140. package/paginator/Paginator.js +31 -82
  141. package/paginator/Paginator.stories.tsx +24 -0
  142. package/paginator/Paginator.test.js +266 -0
  143. package/paginator/types.d.ts +1 -1
  144. package/paragraph/Paragraph.d.ts +6 -0
  145. package/paragraph/Paragraph.js +28 -0
  146. package/paragraph/Paragraph.stories.tsx +44 -0
  147. package/password-input/PasswordInput.js +28 -54
  148. package/password-input/PasswordInput.test.js +138 -0
  149. package/password-input/types.d.ts +18 -15
  150. package/progress-bar/ProgressBar.d.ts +2 -2
  151. package/progress-bar/ProgressBar.js +65 -84
  152. package/progress-bar/ProgressBar.stories.jsx +47 -12
  153. package/progress-bar/ProgressBar.test.js +93 -0
  154. package/progress-bar/types.d.ts +3 -4
  155. package/quick-nav/QuickNav.d.ts +4 -0
  156. package/quick-nav/QuickNav.js +95 -0
  157. package/quick-nav/QuickNav.stories.tsx +356 -0
  158. package/quick-nav/types.d.ts +21 -0
  159. package/quick-nav/types.js +5 -0
  160. package/radio-group/Radio.d.ts +1 -1
  161. package/radio-group/Radio.js +61 -66
  162. package/radio-group/RadioGroup.js +99 -129
  163. package/radio-group/RadioGroup.stories.tsx +171 -36
  164. package/radio-group/RadioGroup.test.js +620 -0
  165. package/radio-group/types.d.ts +85 -7
  166. package/resultsetTable/Icons.d.ts +7 -0
  167. package/resultsetTable/Icons.js +48 -0
  168. package/resultsetTable/ResultsetTable.js +66 -157
  169. package/resultsetTable/ResultsetTable.stories.tsx +50 -25
  170. package/resultsetTable/ResultsetTable.test.js +292 -0
  171. package/resultsetTable/types.d.ts +5 -5
  172. package/select/Icons.d.ts +10 -0
  173. package/select/Icons.js +90 -0
  174. package/select/Listbox.d.ts +4 -0
  175. package/select/Listbox.js +144 -0
  176. package/select/Option.d.ts +4 -0
  177. package/select/Option.js +81 -0
  178. package/select/Select.js +201 -485
  179. package/select/Select.stories.tsx +600 -201
  180. package/select/Select.test.js +1845 -0
  181. package/select/types.d.ts +62 -22
  182. package/sidenav/Sidenav.d.ts +6 -5
  183. package/sidenav/Sidenav.js +164 -74
  184. package/sidenav/Sidenav.stories.tsx +249 -149
  185. package/sidenav/Sidenav.test.js +37 -0
  186. package/sidenav/types.d.ts +50 -27
  187. package/slider/Slider.d.ts +2 -2
  188. package/slider/Slider.js +143 -164
  189. package/slider/Slider.stories.tsx +72 -9
  190. package/slider/Slider.test.js +222 -0
  191. package/slider/types.d.ts +11 -3
  192. package/spinner/Spinner.js +12 -41
  193. package/spinner/Spinner.stories.jsx +27 -1
  194. package/spinner/Spinner.test.js +55 -0
  195. package/spinner/types.d.ts +3 -3
  196. package/switch/Switch.d.ts +2 -2
  197. package/switch/Switch.js +148 -107
  198. package/switch/Switch.stories.tsx +53 -42
  199. package/switch/Switch.test.js +180 -0
  200. package/switch/types.d.ts +13 -5
  201. package/table/Table.js +5 -23
  202. package/table/Table.stories.jsx +80 -1
  203. package/table/Table.test.js +21 -0
  204. package/table/types.d.ts +3 -3
  205. package/tabs/Tab.d.ts +4 -0
  206. package/tabs/Tab.js +115 -0
  207. package/tabs/Tabs.d.ts +1 -1
  208. package/tabs/Tabs.js +318 -139
  209. package/tabs/Tabs.stories.tsx +119 -13
  210. package/tabs/Tabs.test.js +295 -0
  211. package/tabs/types.d.ts +21 -7
  212. package/tag/Tag.d.ts +1 -1
  213. package/tag/Tag.js +36 -75
  214. package/tag/Tag.stories.tsx +37 -27
  215. package/tag/Tag.test.js +49 -0
  216. package/tag/types.d.ts +25 -16
  217. package/text-input/Icons.d.ts +8 -0
  218. package/text-input/Icons.js +57 -0
  219. package/text-input/Suggestion.d.ts +4 -0
  220. package/text-input/Suggestion.js +68 -0
  221. package/text-input/Suggestions.d.ts +4 -0
  222. package/text-input/Suggestions.js +109 -0
  223. package/text-input/TextInput.js +232 -438
  224. package/text-input/TextInput.stories.tsx +310 -197
  225. package/text-input/TextInput.test.js +1404 -0
  226. package/text-input/types.d.ts +55 -17
  227. package/textarea/Textarea.js +53 -96
  228. package/textarea/Textarea.stories.jsx +93 -13
  229. package/textarea/Textarea.test.js +360 -0
  230. package/textarea/types.d.ts +22 -15
  231. package/toggle-group/ToggleGroup.d.ts +1 -1
  232. package/toggle-group/ToggleGroup.js +23 -57
  233. package/toggle-group/ToggleGroup.stories.tsx +46 -4
  234. package/toggle-group/ToggleGroup.test.js +124 -0
  235. package/toggle-group/types.d.ts +19 -11
  236. package/translatedLabelsType.d.ts +82 -0
  237. package/translatedLabelsType.js +5 -0
  238. package/typography/Typography.d.ts +4 -0
  239. package/typography/Typography.js +119 -0
  240. package/typography/Typography.stories.tsx +198 -0
  241. package/typography/types.d.ts +18 -0
  242. package/typography/types.js +5 -0
  243. package/useTheme.d.ts +1 -1
  244. package/useTheme.js +3 -9
  245. package/useTranslatedLabels.d.ts +3 -0
  246. package/useTranslatedLabels.js +15 -0
  247. package/wizard/Wizard.d.ts +1 -1
  248. package/wizard/Wizard.js +68 -98
  249. package/wizard/Wizard.stories.tsx +48 -19
  250. package/wizard/Wizard.test.js +114 -0
  251. package/wizard/types.d.ts +12 -7
  252. package/ThemeContext.d.ts +0 -15
  253. package/ThemeContext.js +0 -243
  254. package/V3Select/V3Select.js +0 -455
  255. package/V3Select/index.d.ts +0 -27
  256. package/V3Textarea/V3Textarea.js +0 -260
  257. package/V3Textarea/index.d.ts +0 -27
  258. package/common/RequiredComponent.js +0 -32
  259. package/date/Date.js +0 -373
  260. package/date/index.d.ts +0 -27
  261. package/input-text/Icons.js +0 -22
  262. package/input-text/InputText.js +0 -611
  263. package/input-text/index.d.ts +0 -36
  264. package/list/List.d.ts +0 -8
  265. package/list/List.js +0 -47
  266. package/list/List.stories.tsx +0 -95
  267. package/radio/Radio.d.ts +0 -4
  268. package/radio/Radio.js +0 -174
  269. package/radio/Radio.stories.tsx +0 -192
  270. package/radio/types.d.ts +0 -54
  271. package/row/Row.d.ts +0 -11
  272. package/row/Row.js +0 -127
  273. package/row/Row.stories.tsx +0 -239
  274. package/stack/Stack.d.ts +0 -10
  275. package/stack/Stack.js +0 -97
  276. package/stack/Stack.stories.tsx +0 -166
  277. package/text/Text.d.ts +0 -7
  278. package/text/Text.js +0 -30
  279. package/text/Text.stories.tsx +0 -19
  280. package/toggle/Toggle.js +0 -186
  281. package/toggle/index.d.ts +0 -21
  282. package/upload/Upload.js +0 -201
  283. package/upload/buttons-upload/ButtonsUpload.js +0 -111
  284. package/upload/buttons-upload/Icons.js +0 -40
  285. package/upload/dragAndDropArea/DragAndDropArea.js +0 -225
  286. package/upload/dragAndDropArea/Icons.js +0 -39
  287. package/upload/file-upload/FileToUpload.js +0 -115
  288. package/upload/file-upload/Icons.js +0 -66
  289. package/upload/files-upload/FilesToUpload.js +0 -109
  290. package/upload/index.d.ts +0 -15
  291. package/upload/transaction/Icons.js +0 -160
  292. package/upload/transaction/Transaction.js +0 -104
  293. package/upload/transactions/Transactions.js +0 -94
  294. /package/{radio → badge}/types.js +0 -0
@@ -3,14 +3,9 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.typeface = exports.spaces = exports.responsiveSizes = exports.globalTokens = exports.componentTokens = void 0;
7
-
8
- var _Icons = require("../header/Icons");
9
-
10
- var _Icons2 = require("../footer/Icons");
11
-
6
+ exports.typeface = exports.spaces = exports.responsiveSizes = exports.globalTokens = exports.defaultTranslatedComponentLabels = exports.componentTokens = void 0;
12
7
  var globalTokens = {
13
- // Color
8
+ // Color
14
9
  inherit: "inherit",
15
10
  transparent: "transparent",
16
11
  hal_white: "#ffffff",
@@ -24,13 +19,19 @@ var globalTokens = {
24
19
  color_grey_800: "#4d4d4d",
25
20
  color_grey_600: "#808080",
26
21
  color_grey_50: "#fafafa",
22
+ color_grey_a_100: "#0000000d",
23
+ color_grey_a_200: "#0000001a",
24
+ color_grey_a_300: "#00000033",
25
+ color_grey_a_800: "#000000b3",
26
+ color_grey_a_900: "#333333",
27
27
  hal_purple_l_95: "#f2eafa",
28
28
  hal_purple_l_90: "#e5d5f6",
29
29
  hal_purple_l_65: "#a46ede",
30
30
  hal_purple_s_38: "#5f249f",
31
31
  hal_purple_d_30: "#4b1c7d",
32
32
  hal_purple_d_20: "#321353",
33
- color_purple_600: "#7D2FD0",
33
+ hal_purple_d_70: "#9A6bb2",
34
+ color_purple_600: "#7d2fd0",
34
35
  color_purple_300: "#cbacec",
35
36
  hal_blue_l_95: "#e6f4ff",
36
37
  hal_blue_l_80: "#99d5ff",
@@ -39,7 +40,7 @@ var globalTokens = {
39
40
  hal_blue_s_35: "#0067b3",
40
41
  hal_blue_d_20: "#003c66",
41
42
  color_blue_200: "#cceaff",
42
- color_blue_500: "#33AAFF",
43
+ color_blue_500: "#33aaff",
43
44
  color_blue_50: "#f5fbff",
44
45
  hal_red_l_95: "#ffe6e9",
45
46
  hal_red_l_80: "#fe9aa7",
@@ -48,7 +49,7 @@ var globalTokens = {
48
49
  hal_red_d_30: "#980115",
49
50
  hal_red_d_20: "#65010e",
50
51
  color_red_700: "#ffccd3",
51
- color_red_50: "#FFF5F6",
52
+ color_red_50: "#fff5f6",
52
53
  color_red_600: "#fe0123",
53
54
  hal_green_l_95: "#eafaef",
54
55
  hal_green_l_80: "#acecbe",
@@ -61,36 +62,28 @@ var globalTokens = {
61
62
  hal_yellow_d_40: "#c59f07",
62
63
  hal_yellow_d_30: "#947705",
63
64
  hal_orange_s_54: "#f38f20",
64
- black: "#000000",
65
65
  lightBlack: "#212121",
66
- yellow: "#FFED00",
67
- lightGrey: "#D9D9D9",
68
- darkRed: "#D0011B",
69
- lightRed: "#FF6161",
70
- lightBlue: "#CEE0F5",
71
- lightYellow: "#FCF2BD",
72
- lightPink: "#F9CFCF",
73
- lightGreen: "#DBF1C4",
74
- blue: "#005FCC",
75
- lighterGrey: "#F8F8F8",
76
- red: "#D0011B",
77
- violet: "#8800F6",
78
- darkBlue: "#006BF6",
66
+ yellow: "#ffed00",
67
+ lightGrey: "#d9d9d9",
68
+ lightRed: "#ff6161",
69
+ lightBlue: "#cee0f5",
70
+ lightYellow: "#fcf2bd",
71
+ lightPink: "#f9cfcf",
72
+ lightGreen: "#dbf1c4",
73
+ blue: "#005fcc",
74
+ lighterGrey: "#f8f8f8",
75
+ violet: "#8800f6",
76
+ darkBlue: "#006bf6",
79
77
  purple: "#6f2c91",
80
78
  mediumPurple: "#ead8f3",
81
79
  lightPurple: "#f5ebf9",
82
80
  lighterPurple: "#d0bddb",
83
- white: "#ffffff",
84
- darkGrey: "#666666",
85
- mediumGrey: "#bfbfbf",
86
81
  mediumWhite: "#f9f9f9",
87
- mediumBlue: "#0067b3",
88
82
  softBlue: "#b1cee6",
89
83
  darkWhite: "#eeeeee",
90
84
  lighterBlack: "#b1b1b1",
91
85
  mediumBlack: "#676767",
92
86
  mediumGreyBlack: "#dbdbdb",
93
- lightWhite: "#f2f2f2",
94
87
  softGrey: "#cecece",
95
88
  softBlack: "#565656",
96
89
  // Typography
@@ -112,7 +105,7 @@ var globalTokens = {
112
105
  type_normal: "normal",
113
106
  type_spacing_tight_02: "-0.05em",
114
107
  type_spacing_tight_01: "-0.025em",
115
- type_spacing_normal: "0",
108
+ type_spacing_normal: "0em",
116
109
  type_spacing_wide_01: "0.025em",
117
110
  type_spacing_wide_02: "0.05em",
118
111
  type_spacing_wide_03: "0.1em",
@@ -162,7 +155,6 @@ exports.globalTokens = globalTokens;
162
155
  var componentTokens = {
163
156
  accordion: {
164
157
  backgroundColor: globalTokens.hal_white,
165
- disabledBackgroundColor: globalTokens.transparent,
166
158
  hoverBackgroundColor: globalTokens.hal_purple_l_95,
167
159
  arrowColor: globalTokens.hal_purple_s_38,
168
160
  disabledArrowColor: globalTokens.hal_grey_l_60,
@@ -182,27 +174,27 @@ var componentTokens = {
182
174
  titleLabelFontStyle: globalTokens.type_normal,
183
175
  titleLabelFontColor: globalTokens.hal_black,
184
176
  disabledTitleLabelFontColor: globalTokens.hal_grey_l_60,
185
- titleLabelPaddingLeft: "0px",
186
- titleLabelPaddingRight: "16px",
187
177
  titleLabelPaddingTop: "0px",
188
178
  titleLabelPaddingBottom: "0px",
189
- focusBorderStyle: "solid",
190
- focusBorderThickness: "2px",
179
+ titleLabelPaddingLeft: "0px",
180
+ titleLabelPaddingRight: "16px",
191
181
  focusBorderColor: globalTokens.hal_blue_l_50,
182
+ focusBorderStyle: globalTokens.border_solid,
183
+ focusBorderThickness: "2px",
192
184
  borderRadius: "4px",
193
185
  boxShadowOffsetX: "0px",
194
186
  boxShadowOffsetY: "6px",
195
187
  boxShadowBlur: "10px",
196
- boxShadowColor: "#0000001a",
188
+ boxShadowColor: globalTokens.color_grey_a_200,
197
189
  iconColor: globalTokens.hal_purple_s_38,
198
190
  disabledIconColor: globalTokens.hal_grey_l_60,
199
191
  iconSize: "24px",
200
192
  iconMarginLeft: "0px",
201
193
  iconMarginRigth: "12px",
202
- accordionGroupSeparatorBorderColor: "#0000001a",
194
+ accordionGroupSeparatorBorderColor: globalTokens.color_grey_a_200,
203
195
  accordionGroupSeparatorBorderThickness: "1px",
204
196
  accordionGroupSeparatorBorderRadius: "0px",
205
- accordionGroupSeparatorBorderStyle: "solid"
197
+ accordionGroupSeparatorBorderStyle: globalTokens.border_solid
206
198
  },
207
199
  alert: {
208
200
  titleFontFamily: globalTokens.type_sans,
@@ -225,7 +217,7 @@ var componentTokens = {
225
217
  contentPaddingTop: "20px",
226
218
  contentPaddingBottom: "30px",
227
219
  borderRadius: "4px",
228
- borderStyle: "solid",
220
+ borderStyle: globalTokens.border_solid,
229
221
  borderThickness: "1px",
230
222
  infoBorderColor: globalTokens.hal_blue_s_35,
231
223
  successBorderColor: globalTokens.hal_green_s_39,
@@ -242,17 +234,17 @@ var componentTokens = {
242
234
  successBackgroundColor: globalTokens.hal_green_l_95,
243
235
  warningBackgroundColor: globalTokens.hal_yellow_l_95,
244
236
  errorBackgroundColor: globalTokens.hal_red_l_95,
245
- hoverActionBackgroundColor: "#0000000D",
246
- activeActionBackgroundColor: "#0000001A",
237
+ hoverActionBackgroundColor: globalTokens.color_grey_a_100,
238
+ activeActionBackgroundColor: globalTokens.color_grey_a_200,
247
239
  focusActionBorderColor: globalTokens.hal_blue_l_50,
248
- overlayColor: "#000000B3"
240
+ overlayColor: globalTokens.color_grey_a_800
249
241
  },
250
242
  box: {
251
- backgroundColor: globalTokens.white,
243
+ backgroundColor: globalTokens.hal_white,
252
244
  letterSpacing: globalTokens.type_spacing_wide_01,
253
245
  borderRadius: "4px",
254
- borderThickness: "0px",
255
- borderStyle: "none",
246
+ borderThickness: globalTokens.border_width_0,
247
+ borderStyle: globalTokens.border_none,
256
248
  borderColor: globalTokens.transparent,
257
249
  noneShadowDepthShadowOffsetX: "none",
258
250
  noneShadowDepthShadowOffsetY: "none",
@@ -263,12 +255,21 @@ var componentTokens = {
263
255
  oneShadowDepthShadowOffsetY: "3px",
264
256
  oneShadowDepthShadowBlur: "6px",
265
257
  oneShadowDepthShadowSpread: "0px",
266
- oneShadowDepthShadowColor: "#00000033",
258
+ oneShadowDepthShadowColor: globalTokens.color_grey_a_300,
267
259
  twoShadowDepthShadowOffsetX: "0px",
268
260
  twoShadowDepthShadowOffsetY: "3px",
269
261
  twoShadowDepthShadowBlur: "10px",
270
262
  twoShadowDepthShadowSpread: "0px",
271
- twoShadowDepthShadowColor: "#00000033"
263
+ twoShadowDepthShadowColor: globalTokens.color_grey_a_300
264
+ },
265
+ bulletedList: {
266
+ fontColor: globalTokens.hal_black,
267
+ fontColorOnDark: globalTokens.hal_white,
268
+ bulletIconHeight: "1.5rem",
269
+ bulletIconWidth: "1.5rem",
270
+ bulletHeight: "5px",
271
+ bulletWidth: "5px",
272
+ bulletMarginRight: "0.5rem"
272
273
  },
273
274
  button: {
274
275
  labelFontLineHeight: globalTokens.type_leading_normal,
@@ -348,7 +349,7 @@ var componentTokens = {
348
349
  backgroundColorChecked: globalTokens.hal_blue_s_35,
349
350
  backgroundColorCheckedOnDark: globalTokens.hal_grey_l_90,
350
351
  hoverBackgroundColorChecked: globalTokens.hal_blue_d_20,
351
- hoverBackgroundColorCheckedOnDark: global.hal_white,
352
+ hoverBackgroundColorCheckedOnDark: globalTokens.hal_white,
352
353
  disabledBackgroundColorChecked: globalTokens.hal_grey_l_60,
353
354
  disabledBackgroundColorCheckedOnDark: globalTokens.color_grey_800,
354
355
  borderColor: globalTokens.hal_blue_s_35,
@@ -383,70 +384,74 @@ var componentTokens = {
383
384
  disabledFontColor: globalTokens.hal_grey_l_60,
384
385
  borderColor: globalTokens.transparent,
385
386
  borderRadius: "80px",
386
- borderThickness: "0px",
387
- borderStyle: "solid",
387
+ borderThickness: globalTokens.border_width_0,
388
+ borderStyle: globalTokens.border_solid,
388
389
  contentPaddingLeft: "16px",
389
390
  contentPaddingRight: "16px",
390
391
  contentPaddingTop: "0px",
391
392
  contentPaddingBottom: "0px",
392
393
  iconSize: "24px",
393
394
  iconSpacing: "8px",
394
- iconColor: globalTokens.hal_black,
395
+ iconColor: globalTokens.color_grey_800,
396
+ hoverIconColor: globalTokens.color_grey_a_900,
397
+ activeIconColor: globalTokens.hal_black,
395
398
  disabledIconColor: globalTokens.hal_grey_l_60,
396
- focusColor: globalTokens.hal_blue_l_50
397
- },
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
399
  focusColor: globalTokens.hal_blue_l_50,
411
- fontFamily: globalTokens.type_sans,
412
- pickerHeight: "316px",
413
- pickerWidth: "290px"
400
+ focusBorderStyle: globalTokens.border_solid,
401
+ focusBorderThickness: globalTokens.border_width_2,
402
+ focusBorderRadius: globalTokens.border_radius_medium
414
403
  },
415
404
  dateInput: {
416
- pickerFontFamily: globalTokens.type_sans,
417
405
  pickerBackgroundColor: globalTokens.hal_white,
418
- pickerHoverDateFontColor: globalTokens.hal_black,
419
- pickerHoverDateBackgroundColor: globalTokens.hal_purple_l_90,
420
- pickerSelectedDateColor: globalTokens.hal_white,
421
- pickerSelectedDateBackgroundColor: globalTokens.hal_purple_s_38,
422
- pickerActualDateFontColor: globalTokens.hal_grey_l_60,
423
- pickerYearFontColor: globalTokens.hal_black,
424
- pickerMonthFontColor: globalTokens.hal_black,
425
- pickerWeekFontColor: globalTokens.hal_black,
426
- pickerDayFontColor: globalTokens.hal_black,
427
- pickerMonthArrowsBackgroundColor: globalTokens.transparent,
406
+ pickerFontColor: globalTokens.hal_black,
407
+ pickerBorderColor: globalTokens.hal_grey_l_75,
408
+ pickerSelectedBackgroundColor: globalTokens.hal_purple_s_38,
409
+ pickerSelectedFontColor: globalTokens.hal_white,
410
+ pickerHoverBackgroundColor: globalTokens.hal_purple_l_90,
411
+ pickerHoverFontColor: globalTokens.hal_black,
412
+ pickerActiveBackgroundColor: globalTokens.hal_purple_d_30,
413
+ pickerActiveFontColor: globalTokens.hal_white,
414
+ pickerNonCurrentMonthFontColor: globalTokens.hal_grey_l_60,
415
+ pickerCurrentDateBorderColor: globalTokens.color_purple_300,
416
+ pickerCurrentDateFontColor: globalTokens.hal_black,
417
+ pickerCurrentYearFontColor: globalTokens.hal_purple_s_38,
418
+ pickerHeaderBackgroundColor: globalTokens.transparent,
419
+ pickerHeaderFontColor: globalTokens.hal_black,
420
+ pickerHeaderHoverBackgroundColor: globalTokens.hal_purple_l_90,
421
+ pickerHeaderHoverFontColor: globalTokens.hal_black,
422
+ pickerHeaderActiveBackgroundColor: globalTokens.hal_purple_d_30,
423
+ pickerHeaderActiveFontColor: globalTokens.hal_white,
428
424
  pickerFocusColor: globalTokens.hal_blue_l_50,
429
- pickerHeight: "316px",
430
- pickerWidth: "290px"
425
+ pickerBorderWidth: globalTokens.border_width_1,
426
+ pickerBorderStyle: globalTokens.border_solid,
427
+ pickerFocusWidth: globalTokens.border_width_2,
428
+ pickerCurrentDateBorderWidth: globalTokens.border_width_1,
429
+ pickerFontFamily: globalTokens.type_sans,
430
+ pickerFontSize: globalTokens.type_scale_02,
431
+ pickerFontWeight: globalTokens.type_regular,
432
+ pickerInteractedYearFontSize: globalTokens.type_scale_05,
433
+ pickerHeaderFontSize: globalTokens.type_scale_02
431
434
  },
432
435
  dialog: {
433
- overlayColor: globalTokens.hal_black,
436
+ overlayColor: globalTokens.color_grey_a_800,
434
437
  backgroundColor: globalTokens.hal_white,
435
438
  closeIconWidth: "24px",
436
439
  closeIconHeight: "24px",
437
440
  closeIconTopPosition: "20px",
438
441
  closeIconRightPosition: "20px",
439
442
  closeIconBackgroundColor: "none",
440
- closeIconBorderColor: "none",
443
+ closeIconBorderColor: globalTokens.border_none,
441
444
  closeIconColor: globalTokens.hal_black,
442
- closeIconBorderThickness: "0px",
443
- closeIconBorderStyle: "solid",
445
+ closeIconBorderThickness: globalTokens.border_width_0,
446
+ closeIconBorderStyle: globalTokens.border_solid,
444
447
  closeIconBorderRadius: "0px",
445
448
  boxShadowOffsetX: "0px",
446
449
  boxShadowOffsetY: "1px",
447
450
  boxShadowBlur: "3px",
448
- boxShadowColor: "rgba(0, 0, 0, 0.2)",
449
- overlayOpacity: "0.7"
451
+ boxShadowColor: globalTokens.color_grey_a_300,
452
+ fontFamily: globalTokens.type_sans,
453
+ fontSize: globalTokens.type_scale_03,
454
+ fontWeight: globalTokens.type_regular
450
455
  },
451
456
  dropdown: {
452
457
  buttonBackgroundColor: globalTokens.hal_white,
@@ -464,12 +469,12 @@ var componentTokens = {
464
469
  buttonPaddingBottom: "0px",
465
470
  buttonPaddingLeft: "16px",
466
471
  buttonPaddingRight: "16px",
467
- disabledColor: globalTokens.lighterBlack,
472
+ disabledColor: globalTokens.hal_grey_l_60,
468
473
  disabledButtonBackgroundColor: globalTokens.transparent,
469
474
  disabledBorderColor: globalTokens.lighterBlack,
470
475
  optionBackgroundColor: globalTokens.hal_white,
471
476
  hoverOptionBackgroundColor: globalTokens.hal_grey_l_95,
472
- activeOptionBackgroundColor: globalTokens.lightGrey,
477
+ activeOptionBackgroundColor: globalTokens.hal_grey_l_80,
473
478
  optionFontFamily: globalTokens.type_sans,
474
479
  optionFontSize: globalTokens.type_scale_root,
475
480
  optionFontStyle: globalTokens.type_normal,
@@ -486,8 +491,8 @@ var componentTokens = {
486
491
  caretIconColor: globalTokens.hal_black,
487
492
  caretIconSpacing: "12px",
488
493
  borderRadius: "4px",
489
- borderStyle: "none",
490
- borderThickness: "0px",
494
+ borderStyle: globalTokens.border_none,
495
+ borderThickness: globalTokens.border_width_0,
491
496
  borderColor: globalTokens.transparent,
492
497
  scrollBarThumbColor: globalTokens.hal_grey_s_40,
493
498
  scrollBarTrackColor: globalTokens.lightGrey,
@@ -506,14 +511,13 @@ var componentTokens = {
506
511
  focusDropBorderColor: globalTokens.hal_blue_l_50,
507
512
  disabledDropBorderColor: globalTokens.hal_grey_l_60,
508
513
  dragoverDropBackgroundColor: globalTokens.color_blue_50,
509
- hoverFileItemIconBackgroundColor: globalTokens.hal_grey_l_95,
510
514
  activeFileItemIconBackgrounColor: globalTokens.hal_grey_l_80,
511
515
  errorFileItemBorderColor: globalTokens.hal_red_s_41,
512
516
  errorFileItemBackgroundColor: globalTokens.color_red_50,
513
- errorFileItemIconBackgroundColor: globalTokens.color_red_700,
517
+ errorFilePreviewBackgroundColor: globalTokens.color_red_700,
514
518
  errorFileItemIconColor: globalTokens.hal_red_s_41,
515
519
  fileItemIconBackgroundColor: globalTokens.hal_grey_l_95,
516
- fileItemIconColor: globalTokens.color_grey_600,
520
+ deleteFileItemColor: globalTokens.hal_black,
517
521
  errorMessageFontColor: globalTokens.hal_red_s_41,
518
522
  labelFontFamily: globalTokens.type_sans,
519
523
  labelFontSize: globalTokens.type_scale_02,
@@ -540,16 +544,19 @@ var componentTokens = {
540
544
  fileItemBorderThickness: globalTokens.border_width_1,
541
545
  fileItemBorderStyle: globalTokens.border_solid,
542
546
  fileItemBorderRadius: globalTokens.border_radius_medium,
543
- hoverDeleteFileItemBackgroundColor: "#0000000d",
544
- activeDeleteFileItemBackgroundColor: "#00000033",
545
- focusActionBorderColor: globalTokens.hal_blue_l_50
547
+ hoverDeleteFileItemBackgroundColor: globalTokens.color_grey_a_100,
548
+ activeDeleteFileItemBackgroundColor: globalTokens.color_grey_a_300,
549
+ focusDeleteFileItemBorderColor: globalTokens.hal_blue_l_50,
550
+ filePreviewBackgroundColor: globalTokens.hal_grey_l_95,
551
+ filePreviewIconColor: globalTokens.color_grey_600,
552
+ errorFilePreviewIconColor: globalTokens.hal_red_s_41
546
553
  },
547
554
  footer: {
548
555
  height: "124px",
549
556
  backgroundColor: globalTokens.hal_black,
550
557
  bottomLinksDividerColor: globalTokens.hal_blue_l_50,
551
558
  bottomLinksDividerThickness: "1px",
552
- bottomLinksDividerStyle: "solid",
559
+ bottomLinksDividerStyle: globalTokens.border_solid,
553
560
  bottomLinksDividerSpacing: "8px",
554
561
  bottomLinksFontFamily: globalTokens.type_sans,
555
562
  bottomLinksFontSize: globalTokens.type_scale_01,
@@ -579,7 +586,7 @@ var componentTokens = {
579
586
  hamburguerFontWeight: globalTokens.type_semibold,
580
587
  hamburguerTextTransform: globalTokens.type_uppercase,
581
588
  hamburguerIconColor: globalTokens.hal_black,
582
- hamburguerHoverColor: globalTokens.mediumGreyBlack,
589
+ hamburguerHoverColor: globalTokens.hal_grey_l_90,
583
590
  logo: "",
584
591
  logoResponsive: "",
585
592
  logoHeight: "40px",
@@ -589,7 +596,7 @@ var componentTokens = {
589
596
  menuTabletWidth: "60vw",
590
597
  menuMobileWidth: "100vw",
591
598
  minHeight: "64px",
592
- overlayColor: globalTokens.softBlack,
599
+ overlayColor: globalTokens.color_grey_a_800,
593
600
  overlayOpacity: "0.7",
594
601
  overlayZindex: "1600",
595
602
  paddingTop: "0px",
@@ -598,7 +605,7 @@ var componentTokens = {
598
605
  paddingLeft: "24px",
599
606
  underlinedColor: globalTokens.hal_black,
600
607
  underlinedThickness: "2px",
601
- underlinedStyle: "solid",
608
+ underlinedStyle: globalTokens.border_solid,
602
609
  contentColor: globalTokens.hal_black,
603
610
  contentColorOnDark: globalTokens.hal_white
604
611
  },
@@ -639,216 +646,90 @@ var componentTokens = {
639
646
  level5LineHeight: globalTokens.type_leading_normal,
640
647
  level5LetterSpacing: globalTokens.type_spacing_wide_01
641
648
  },
642
- inputText: {
643
- fontFamily: globalTokens.type_sans,
644
- assistiveTextFontColor: globalTokens.black,
645
- assistiveTextFontColorOnDark: globalTokens.white,
646
- assistiveTextFontSize: globalTokens.type_scale_01,
647
- assistiveTextFontStyle: globalTokens.type_normal,
648
- assistiveTextFontWeight: globalTokens.type_regular,
649
- disabledColor: globalTokens.lighterBlack,
650
- disabledColorOnDark: "#575757",
651
- errorColor: globalTokens.red,
652
- errorColorOnDark: globalTokens.hal_red_l_60,
653
- optionBackgroundColor: globalTokens.white,
654
- optionBorderColor: globalTokens.black,
655
- optionBorderThickness: "0px",
656
- optionBorderStyle: "solid",
657
- optionFontColor: globalTokens.black,
658
- optionFontColorOnDark: globalTokens.white,
659
- optionFontSize: globalTokens.type_scale_03,
660
- optionFontStyle: globalTokens.type_normal,
661
- optionFontWeight: globalTokens.type_regular,
662
- optionPaddingBottom: "6px",
663
- optionPaddingTop: "6px",
664
- scrollBarThumbColor: globalTokens.darkGrey,
665
- scrollBarTrackColor: globalTokens.lightGrey,
666
- hoverOptionColor: globalTokens.black,
667
- hoverOptionBackgroundColor: globalTokens.lightWhite,
668
- hoverOptionBackgroundColorOnDark: globalTokens.mediumGrey,
669
- selectedOptionBackgroundColor: globalTokens.lightGrey,
670
- selectedOptionBackgroundColorOnDark: globalTokens.lightGrey,
671
- labelFontColor: globalTokens.black,
672
- labelFontColorOnDark: globalTokens.white,
673
- labelFontSize: globalTokens.type_scale_03,
674
- labelFontStyle: globalTokens.type_normal,
675
- labelFontWeight: globalTokens.type_regular,
676
- valueFontColor: globalTokens.black,
677
- valueFontColorOnDark: globalTokens.white,
678
- valueFontSize: globalTokens.type_scale_03,
679
- valueFontStyle: globalTokens.type_normal,
680
- valueFontWeight: globalTokens.type_regular,
681
- prefixIconColor: globalTokens.black,
682
- prefixIconColorOnDark: globalTokens.white,
683
- prefixLabelFontColor: globalTokens.black,
684
- prefixLabelFontColorOnDark: globalTokens.white,
685
- prefixLabelFontSize: globalTokens.type_scale_03,
686
- prefixLabelFontStyle: globalTokens.type_normal,
687
- prefixLabelFontWeight: globalTokens.type_regular,
688
- suffixIconColor: globalTokens.black,
689
- suffixIconColorOnDark: globalTokens.white,
690
- suffixLabelFontColor: globalTokens.black,
691
- suffixLabelFontColorOnDark: globalTokens.white,
692
- suffixLabelFontSize: globalTokens.type_scale_03,
693
- suffixLabelFontStyle: globalTokens.type_normal,
694
- suffixLabelFontWeight: globalTokens.type_regular,
695
- underlineColor: globalTokens.black,
696
- underlineColorOnDark: globalTokens.white,
697
- underlineFocusColor: globalTokens.black,
698
- underlineFocusColorOnDark: globalTokens.white,
699
- underlineThickness: "1px"
700
- },
701
- textInput: {
702
- fontFamily: globalTokens.type_sans,
703
- enabledBorderColor: globalTokens.hal_black,
704
- enabledBorderColorOnDark: globalTokens.hal_white,
705
- hoverBorderColor: globalTokens.hal_purple_l_65,
706
- hoverBorderColorOnDark: globalTokens.hal_purple_l_65,
707
- focusBorderColor: globalTokens.hal_blue_l_50,
708
- focusBorderColorOnDark: globalTokens.hal_blue_l_50,
709
- disabledBorderColor: globalTokens.hal_grey_l_60,
710
- disabledBorderColorOnDark: globalTokens.hal_grey_l_60,
711
- disabledContainerFillColor: globalTokens.hal_grey_l_95,
712
- disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
713
- errorBorderColor: globalTokens.hal_red_s_41,
714
- errorBorderColorOnDark: globalTokens.hal_red_l_60,
715
- hoverErrorBorderColor: globalTokens.color_red_600,
716
- hoverErrorBorderColorOnDark: "#fe677b",
717
- inputMarginTop: globalTokens.spacing_02,
718
- inputMarginBottom: globalTokens.spacing_02,
719
- errorMessageColor: globalTokens.hal_red_s_41,
720
- errorMessageColorOnDark: globalTokens.hal_red_l_60,
721
- errorIconColor: globalTokens.hal_red_s_41,
722
- errorIconColorOnDark: globalTokens.hal_red_l_60,
723
- labelFontColor: globalTokens.hal_black,
724
- labelFontColorOnDark: globalTokens.hal_white,
725
- labelFontSize: globalTokens.type_scale_02,
726
- labelFontStyle: globalTokens.type_normal,
727
- labelFontWeight: globalTokens.type_semibold,
728
- labelLineHeight: globalTokens.type_leading_loose_01,
729
- disabledLabelFontColor: globalTokens.hal_grey_l_60,
730
- disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
731
- optionalLabelFontWeight: globalTokens.type_regular,
732
- helperTextFontColor: globalTokens.hal_black,
733
- helperTextFontColorOnDark: globalTokens.hal_white,
734
- helperTextFontSize: globalTokens.type_scale_01,
735
- helperTextFontStyle: globalTokens.type_normal,
736
- helperTextFontWeight: globalTokens.type_regular,
737
- helperTextLineHeight: globalTokens.type_leading_normal,
738
- disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
739
- disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
740
- prefixColor: globalTokens.hal_grey_s_40,
741
- prefixColorOnDark: globalTokens.hal_white,
742
- suffixColor: globalTokens.hal_grey_s_40,
743
- suffixColorOnDark: globalTokens.hal_white,
744
- disabledPrefixColor: globalTokens.hal_grey_l_75,
745
- disabledSuffixColor: globalTokens.hal_grey_l_75,
746
- disabledPrefixColorOnDark: globalTokens.hal_grey_l_60,
747
- disabledSuffixColorOnDark: globalTokens.hal_grey_l_60,
748
- placeholderFontColor: "#000000b3",
749
- placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
750
- disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
751
- disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
752
- valueFontColor: globalTokens.hal_black,
753
- valueFontColorOnDark: globalTokens.hal_white,
754
- valueFontSize: globalTokens.type_scale_03,
755
- valueFontStyle: globalTokens.type_normal,
756
- valueFontWeight: globalTokens.type_regular,
757
- disabledValueFontColor: globalTokens.hal_grey_l_60,
758
- disabledValueFontColorOnDark: globalTokens.hal_grey_l_60,
759
- actionIconColor: globalTokens.hal_black,
760
- actionIconColorOnDark: globalTokens.hal_white,
761
- disabledActionIconColor: globalTokens.hal_grey_l_60,
762
- disabledActionIconColorOnDark: globalTokens.hal_grey_l_60,
763
- hoverActionIconColor: globalTokens.hal_black,
764
- hoverActionIconColorOnDark: globalTokens.hal_white,
765
- focusActionIconColor: globalTokens.hal_black,
766
- focusActionIconColorOnDark: globalTokens.hal_white,
767
- activeActionIconColor: globalTokens.hal_black,
768
- activeActionIconColorOnDark: globalTokens.hal_black,
769
- actionBackgroundColor: globalTokens.transparent,
770
- actionBackgroundColorOnDark: globalTokens.transparent,
771
- disabledActionBackgroundColor: globalTokens.transparent,
772
- disabledActionBackgroundColorOnDark: globalTokens.transparent,
773
- hoverActionBackgroundColor: globalTokens.hal_grey_l_95,
774
- hoverActionBackgroundColorOnDark: globalTokens.hal_grey_s_40,
775
- focusActionBorderColor: globalTokens.hal_blue_l_50,
776
- focusActionBorderColorOnDark: globalTokens.hal_blue_l_50,
777
- activeActionBackgroundColor: globalTokens.hal_grey_l_80,
778
- activeActionBackgroundColorOnDark: globalTokens.hal_grey_l_60,
779
- listDialogBackgroundColor: globalTokens.hal_white,
780
- listDialogBorderColor: globalTokens.hal_grey_l_75,
781
- listOptionDividerColor: globalTokens.hal_grey_l_90,
782
- listOptionFontColor: globalTokens.hal_black,
783
- listOptionFontSize: globalTokens.type_scale_02,
784
- listOptionFontStyle: globalTokens.type_normal,
785
- listOptionFontWeight: globalTokens.type_regular,
786
- systemMessageFontColor: globalTokens.hal_grey_s_40,
787
- errorListDialogFontColor: globalTokens.hal_black,
788
- errorListDialogBackgroundColor: globalTokens.color_red_50,
789
- errorListDialogBorderColor: globalTokens.hal_red_s_41,
790
- hoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
791
- activeListOptionBackgroundColor: globalTokens.hal_grey_l_80,
792
- focusListOptionBorderColor: globalTokens.hal_blue_l_50
793
- },
794
649
  link: {
795
650
  fontColor: globalTokens.hal_blue_s_35,
796
651
  fontFamily: globalTokens.inherit,
797
- fontSize: globalTokens.type_scale_root,
652
+ fontSize: globalTokens.inherit,
798
653
  fontStyle: globalTokens.type_normal,
799
654
  fontWeight: globalTokens.type_regular,
800
655
  iconSize: "16px",
801
656
  iconSpacing: "4px",
802
657
  underlineSpacing: "0px",
803
- underlineStyle: "solid",
658
+ underlineStyle: globalTokens.border_solid,
804
659
  underlineThickness: "1px",
805
660
  disabledColor: globalTokens.lightGrey,
806
661
  hoverFontColor: globalTokens.hal_blue_s_35,
807
662
  hoverUnderlineColor: globalTokens.hal_blue_s_35,
808
- visitedFontColor: globalTokens.purple,
809
- visitedUnderlineColor: globalTokens.purple,
810
- activeFontColor: globalTokens.black,
811
- activeUnderlineColor: globalTokens.black,
663
+ visitedFontColor: globalTokens.hal_purple_s_38,
664
+ visitedUnderlineColor: globalTokens.hal_purple_s_38,
665
+ activeFontColor: globalTokens.hal_black,
666
+ activeUnderlineColor: globalTokens.hal_black,
812
667
  focusColor: globalTokens.hal_blue_l_50
813
668
  },
669
+ navTabs: {
670
+ selectedBackgroundColor: globalTokens.hal_white,
671
+ unselectedBackgroundColor: globalTokens.hal_white,
672
+ hoverBackgroundColor: globalTokens.hal_grey_l_95,
673
+ pressedBackgroundColor: globalTokens.hal_grey_l_90,
674
+ selectedFontColor: globalTokens.hal_grey_s_40,
675
+ unselectedFontColor: globalTokens.hal_grey_s_40,
676
+ disabledFontColor: globalTokens.hal_grey_l_60,
677
+ focusOutline: globalTokens.hal_blue_l_50,
678
+ selectedUnderlineColor: globalTokens.hal_purple_s_38,
679
+ dividerColor: globalTokens.hal_grey_l_75,
680
+ fontFamily: globalTokens.type_sans,
681
+ fontSize: globalTokens.type_scale_03,
682
+ fontStyle: globalTokens.type_normal,
683
+ fontWeight: globalTokens.type_regular,
684
+ selectedIconColor: globalTokens.hal_grey_s_40,
685
+ unselectedIconColor: globalTokens.hal_grey_s_40,
686
+ disabledIconColor: globalTokens.hal_grey_l_60
687
+ },
814
688
  paginator: {
815
- backgroundColor: globalTokens.darkWhite,
689
+ backgroundColor: globalTokens.hal_grey_l_95,
816
690
  fontColor: globalTokens.hal_black,
817
691
  fontFamily: globalTokens.type_sans,
818
692
  fontSize: globalTokens.type_scale_02,
819
693
  fontStyle: globalTokens.type_normal,
820
694
  fontWeight: globalTokens.type_regular,
821
695
  fontTextTransform: "none",
822
- height: "64px",
823
- width: "100%",
696
+ verticalPadding: "0.75rem",
697
+ horizontalPadding: "2rem",
824
698
  marginRight: "40px",
825
699
  marginLeft: "20px",
826
700
  itemsPerPageSelectorMarginLeft: "0px",
827
- itemsPerPageSelectorMarginRight: "30px",
701
+ itemsPerPageSelectorMarginRight: "0.5rem",
828
702
  pageSelectorMarginRight: "30px",
829
703
  pageSelectorMarginLeft: "0px",
830
- totalItemsContainerMarginRight: "30px",
704
+ totalItemsContainerMarginRight: "2.5rem",
831
705
  totalItemsContainerMarginLeft: "0px"
832
706
  },
707
+ paragraph: {
708
+ fontColor: globalTokens.hal_black,
709
+ fontColorOnDark: globalTokens.hal_white,
710
+ display: "block",
711
+ fontSize: globalTokens.type_scale_03,
712
+ fontWeight: globalTokens.type_regular
713
+ },
833
714
  progressBar: {
834
715
  trackLineColor: globalTokens.hal_purple_s_38,
835
716
  trackLineColorOnDark: globalTokens.hal_purple_l_65,
836
- totalLineColor: globalTokens.softGrey,
717
+ totalLineColor: globalTokens.hal_grey_l_90,
837
718
  labelFontFamily: globalTokens.type_sans,
838
719
  labelFontSize: globalTokens.type_scale_01,
839
720
  labelFontStyle: globalTokens.type_normal,
840
721
  labelFontWeight: globalTokens.type_regular,
841
- labelFontColor: globalTokens.black,
722
+ labelFontColor: globalTokens.hal_black,
842
723
  labelFontColorOnDark: globalTokens.hal_white,
843
724
  labelFontTextTransform: globalTokens.type_uppercase,
844
725
  valueFontFamily: globalTokens.type_sans,
845
726
  valueFontSize: globalTokens.type_scale_01,
846
727
  valueFontStyle: globalTokens.type_normal,
847
728
  valueFontWeight: globalTokens.type_regular,
848
- valueFontColor: globalTokens.black,
729
+ valueFontColor: globalTokens.hal_black,
849
730
  valueFontColorOnDark: globalTokens.hal_white,
850
731
  valueFontTextTransform: globalTokens.type_uppercase,
851
- helperTextFontColor: globalTokens.black,
732
+ helperTextFontColor: globalTokens.hal_black,
852
733
  helperTextFontColorOnDark: globalTokens.hal_white,
853
734
  helperTextFontSize: globalTokens.type_scale_01,
854
735
  helperTextFontStyle: globalTokens.type_normal,
@@ -856,24 +737,23 @@ var componentTokens = {
856
737
  helperTextFontFamily: globalTokens.type_sans,
857
738
  thickness: "9px",
858
739
  borderRadius: "5px",
859
- overlayColor: globalTokens.black,
860
- overlayOpacity: "0.8"
740
+ overlayColor: globalTokens.color_grey_a_800,
741
+ overlayFontColor: globalTokens.hal_white
861
742
  },
862
- radio: {
863
- circleLabelSpacing: "10px",
864
- circleSize: "24px",
865
- color: globalTokens.black,
866
- colorOnDark: globalTokens.white,
867
- disabledColor: globalTokens.lighterBlack,
868
- disabledColorOnDark: "#575757",
869
- disabledFontColor: globalTokens.lighterBlack,
870
- disabledFontColorOnDark: "#575757",
871
- focusColor: globalTokens.hal_blue_l_50,
872
- focusColorOnDark: "#1682FF",
873
- fontColor: globalTokens.inherit,
874
- fontColorOnDark: globalTokens.white,
743
+ quickNav: {
744
+ fontColor: globalTokens.hal_grey_s_40,
745
+ hoverFontColor: globalTokens.hal_purple_d_70,
746
+ dividerBorderColor: globalTokens.hal_grey_l_75,
747
+ focusBorderColor: globalTokens.hal_blue_l_50,
748
+ focusBorderStyle: globalTokens.border_solid,
749
+ focusBorderThickness: globalTokens.border_width_2,
750
+ focusBorderRadius: globalTokens.border_width_2,
751
+ paddingTop: globalTokens.spacing_03,
752
+ paddingBottom: globalTokens.spacing_03,
753
+ paddingLeft: globalTokens.spacing_05,
754
+ paddingRight: globalTokens.spacing_05,
875
755
  fontFamily: globalTokens.type_sans,
876
- fontSize: globalTokens.type_scale_root,
756
+ fontSize: globalTokens.type_scale_02,
877
757
  fontStyle: globalTokens.type_normal,
878
758
  fontWeight: globalTokens.type_regular
879
759
  },
@@ -940,7 +820,7 @@ var componentTokens = {
940
820
  helperTextFontStyle: globalTokens.type_normal,
941
821
  helperTextFontWeight: globalTokens.type_regular,
942
822
  helperTextLineHeight: globalTokens.type_leading_normal,
943
- placeholderFontColor: "#000000b3",
823
+ placeholderFontColor: globalTokens.color_grey_a_800,
944
824
  valueFontColor: globalTokens.hal_black,
945
825
  valueFontSize: globalTokens.type_scale_03,
946
826
  valueFontStyle: globalTokens.type_normal,
@@ -982,88 +862,38 @@ var componentTokens = {
982
862
  activeSelectionIndicatorActionBackgroundColor: globalTokens.hal_grey_l_80,
983
863
  activeSelectionIndicatorActionIconColor: globalTokens.hal_black
984
864
  },
985
- V3Select: {
986
- fontFamily: globalTokens.type_sans,
987
- assistiveTextFontColor: globalTokens.hal_black,
988
- assistiveTextFontColorOnDark: globalTokens.hal_white,
989
- assistiveTextFontSize: globalTokens.type_scale_01,
990
- assistiveTextFontStyle: globalTokens.type_normal,
991
- assistiveTextFontWeight: globalTokens.type_regular,
992
- labelFontColor: globalTokens.hal_black,
993
- labelFontColorOnDark: globalTokens.hal_white,
994
- labelFontSize: globalTokens.type_scale_03,
995
- labelFontStyle: globalTokens.type_normal,
996
- labelFontWeight: globalTokens.type_regular,
997
- disabledColor: globalTokens.lighterBlack,
998
- disabledColorOnDark: "#575757",
999
- errorColor: globalTokens.red,
1000
- errorColorOnDark: globalTokens.hal_red_l_60,
1001
- optionBackgroundColor: globalTokens.hal_white,
1002
- optionBorderColor: globalTokens.hal_black,
1003
- optionBorderThickness: "0px",
1004
- optionBorderStyle: "solid",
1005
- optionFontColor: globalTokens.hal_black,
1006
- optionFontColorOnDark: globalTokens.hal_white,
1007
- optionFontSize: globalTokens.type_scale_root,
1008
- optionFontStyle: globalTokens.type_normal,
1009
- optionFontWeight: globalTokens.type_regular,
1010
- optionPaddingBottom: "6px",
1011
- optionPaddingTop: "6px",
1012
- scrollBarThumbColor: globalTokens.hal_grey_s_40,
1013
- scrollBarTrackColor: globalTokens.lightGrey,
1014
- optionIconColor: globalTokens.hal_black,
1015
- optionIconColorOnDark: globalTokens.hal_white,
1016
- optionIconSpacing: "12px",
1017
- optionIconSize: "20px",
1018
- optionCheckboxSpacing: "12px",
1019
- hoverOptionBackgroundColor: globalTokens.hal_grey_l_95,
1020
- hoverOptionBackgroundColorOnDark: globalTokens.hal_grey_l_95,
1021
- activeOptionBackgroundColor: globalTokens.hal_grey_l_80,
1022
- activeOptionBackgroundColorOnDark: globalTokens.hal_grey_l_80,
1023
- selectedOptionBackgroundColor: globalTokens.lightGrey,
1024
- selectedOptionBackgroundColorOnDark: globalTokens.lightGrey,
1025
- underlineColor: globalTokens.hal_black,
1026
- underlineColorOnDark: globalTokens.hal_white,
1027
- underlineFocusColor: globalTokens.hal_black,
1028
- underlineFocusColorOnDark: globalTokens.hal_white,
1029
- underlineThickness: "1px",
1030
- valueFontColor: globalTokens.hal_black,
1031
- valueFontColorOnDark: globalTokens.hal_white,
1032
- valueFontSize: globalTokens.type_scale_03,
1033
- valueFontStyle: globalTokens.type_normal,
1034
- valueFontWeight: globalTokens.type_regular,
1035
- valueIconColor: globalTokens.hal_black,
1036
- valueIconColorOnDark: globalTokens.hal_white,
1037
- valueIconSize: "20px",
1038
- valueIconSpacing: "12px",
1039
- arrowColor: globalTokens.hal_black,
1040
- arrowColorOnDark: globalTokens.hal_white,
1041
- focusColor: globalTokens.hal_blue_l_50,
1042
- focusColorOnDark: globalTokens.hal_blue_l_50
1043
- },
1044
865
  sidenav: {
1045
866
  backgroundColor: globalTokens.hal_grey_l_95,
1046
- arrowContainerColor: globalTokens.hal_grey_l_90,
1047
- arrowColor: globalTokens.hal_black,
1048
867
  titleFontFamily: globalTokens.type_sans,
1049
- titleFontSize: globalTokens.type_scale_05,
868
+ titleFontSize: globalTokens.type_scale_04,
1050
869
  titleFontStyle: globalTokens.type_normal,
1051
- titleFontWeight: globalTokens.type_regular,
1052
- titleFontColor: globalTokens.hal_black,
870
+ titleFontWeight: globalTokens.type_semibold,
871
+ titleFontColor: globalTokens.color_grey_800,
1053
872
  titleFontTextTransform: "none",
1054
873
  titleFontLetterSpacing: globalTokens.type_spacing_normal,
1055
- subtitleFontFamily: globalTokens.type_sans,
1056
- subtitleFontSize: globalTokens.type_scale_03,
1057
- subtitleFontStyle: globalTokens.type_normal,
1058
- subtitleFontWeight: globalTokens.type_regular,
1059
- subtitleFontColor: globalTokens.color_grey_800,
1060
- subtitleFontTextTransform: globalTokens.type_uppercase,
1061
- subtitleFontLetterSpacing: globalTokens.type_spacing_wide_02,
874
+ groupTitleFontFamily: globalTokens.type_sans,
875
+ groupTitleFontSize: globalTokens.type_scale_02,
876
+ groupTitleFontStyle: globalTokens.type_normal,
877
+ groupTitleFontWeight: globalTokens.type_semibold,
878
+ groupTitleFontColor: globalTokens.hal_black,
879
+ groupTitleHoverBackgroundColor: globalTokens.hal_grey_l_90,
880
+ groupTitleActiveBackgroundColor: globalTokens.hal_grey_l_80,
881
+ groupTitleSelectedFontColor: globalTokens.hal_white,
882
+ groupTitleSelectedBackgroundColor: globalTokens.color_grey_800,
883
+ groupTitleSelectedHoverFontColor: globalTokens.hal_white,
884
+ groupTitleSelectedHoverBackgroundColor: globalTokens.color_grey_600,
885
+ groupTitleFontTextTransform: globalTokens.type_uppercase,
886
+ groupTitleFontLetterSpacing: globalTokens.type_spacing_wide_02,
1062
887
  linkFontFamily: globalTokens.type_sans,
1063
888
  linkFontSize: globalTokens.type_scale_02,
1064
889
  linkFontStyle: globalTokens.type_normal,
1065
890
  linkFontWeight: globalTokens.type_regular,
1066
891
  linkFontColor: globalTokens.color_grey_800,
892
+ linkHoverBackgroundColor: globalTokens.hal_grey_l_90,
893
+ linkSelectedFontColor: globalTokens.hal_white,
894
+ linkSelectedBackgroundColor: globalTokens.color_grey_800,
895
+ linkSelectedHoverFontColor: globalTokens.hal_white,
896
+ linkSelectedHoverBackgroundColor: globalTokens.color_grey_600,
1067
897
  linkFontTextTransform: "none",
1068
898
  linkFontLetterSpacing: globalTokens.type_spacing_wide_01,
1069
899
  linkTextDecoration: globalTokens.type_no_line,
@@ -1131,7 +961,7 @@ var componentTokens = {
1131
961
  trackLineColorOnDark: globalTokens.hal_blue_l_50,
1132
962
  totalLineThickness: "2px",
1133
963
  totalLineVerticalPosition: "50%",
1134
- totalLineColor: globalTokens.hal_grey_l_90,
964
+ totalLineColor: globalTokens.color_grey_a_200,
1135
965
  totalLineColorOnDark: globalTokens.hal_grey_l_75,
1136
966
  disabledThumbVerticalPosition: "10px",
1137
967
  disabledThumbBackgroundColor: globalTokens.hal_grey_l_60,
@@ -1150,36 +980,36 @@ var componentTokens = {
1150
980
  inputMarginLeft: globalTokens.type_scale_06
1151
981
  },
1152
982
  spinner: {
1153
- trackCircleColor: "#5f249f",
1154
- trackCircleColorOnDark: "#a46ede",
1155
- totalCircleColor: globalTokens.white,
983
+ trackCircleColor: globalTokens.hal_purple_s_38,
984
+ trackCircleColorOverlay: globalTokens.hal_purple_l_65,
985
+ totalCircleColor: globalTokens.hal_white,
1156
986
  labelFontFamily: globalTokens.type_sans,
1157
987
  labelFontSize: globalTokens.type_scale_02,
1158
988
  labelFontStyle: globalTokens.type_normal,
1159
989
  labelFontWeight: globalTokens.type_regular,
1160
- labelFontColor: globalTokens.black,
1161
- labelFontColorOnDark: globalTokens.white,
990
+ labelFontColor: globalTokens.hal_black,
991
+ labelFontColorOnDark: globalTokens.hal_white,
1162
992
  labelTextAlign: "center",
1163
993
  progressValueFontFamily: globalTokens.type_sans,
1164
994
  progressValueFontSize: globalTokens.type_scale_02,
1165
995
  progressValueFontStyle: globalTokens.type_normal,
1166
996
  progressValueFontWeight: globalTokens.type_bold,
1167
997
  progressValueFontColor: globalTokens.inherit,
1168
- progressValueFontColorOnDark: globalTokens.white,
998
+ progressValueFontColorOnDark: globalTokens.hal_white,
1169
999
  progressValueTextAlign: "center",
1170
- overlayBackgroundColor: globalTokens.black,
1000
+ overlayBackgroundColor: globalTokens.hal_black,
1171
1001
  overlayOpacity: "0.8",
1172
1002
  overlayLabelFontFamily: globalTokens.type_sans,
1173
1003
  overlayLabelFontSize: globalTokens.type_scale_02,
1174
1004
  overlayLabelFontStyle: globalTokens.type_normal,
1175
1005
  overlayLabelFontWeight: globalTokens.type_regular,
1176
- overlayLabelFontColor: globalTokens.white,
1006
+ overlayLabelFontColor: globalTokens.hal_white,
1177
1007
  overlayLabelTextAlign: "center",
1178
1008
  overlayProgressValueFontFamily: globalTokens.type_sans,
1179
1009
  overlayProgressValueFontSize: globalTokens.type_scale_02,
1180
1010
  overlayProgressValueFontStyle: globalTokens.type_normal,
1181
1011
  overlayProgressValueFontWeight: globalTokens.type_bold,
1182
- overlayProgressValueFontColor: globalTokens.white,
1012
+ overlayProgressValueFontColor: globalTokens.hal_white,
1183
1013
  overlayProgressValueTextAlign: "center"
1184
1014
  },
1185
1015
  "switch": {
@@ -1209,41 +1039,24 @@ var componentTokens = {
1209
1039
  labelFontColor: globalTokens.hal_black,
1210
1040
  labelFontColorOnDark: globalTokens.hal_white,
1211
1041
  thumbFocusColor: globalTokens.hal_blue_l_50,
1212
- thumbFocusColorOnDark: "#1682FF",
1042
+ thumbFocusColorOnDark: "#1682ff",
1213
1043
  thumbHeight: "24px",
1214
1044
  thumbWidth: "24px",
1215
- thumbShift: "40%",
1045
+ thumbShift: "1.25rem",
1216
1046
  trackHeight: "12px",
1217
- trackWidth: "60px",
1218
- spaceBetweenLabelSwitch: "0px"
1219
- },
1220
- tag: {
1221
- fontFamily: globalTokens.type_sans,
1222
- fontColor: globalTokens.hal_black,
1223
- fontSize: globalTokens.type_scale_02,
1224
- fontStyle: globalTokens.type_normal,
1225
- fontWeight: globalTokens.type_regular,
1226
- labelPaddingTop: "0px",
1227
- labelPaddingBottom: "0px",
1228
- labelPaddingLeft: "16px",
1229
- labelPaddingRight: "16px",
1230
- height: "40px",
1231
- iconColor: globalTokens.hal_white,
1232
- iconSectionWidth: "40px",
1233
- iconHeight: "24px",
1234
- iconWidth: "auto",
1235
- focusColor: globalTokens.hal_blue_l_50
1047
+ trackWidth: "36px",
1048
+ spaceBetweenLabelSwitch: "8px"
1236
1049
  },
1237
1050
  table: {
1238
1051
  rowSeparatorThickness: "1px",
1239
- rowSeparatorStyle: "solid",
1240
- rowSeparatorColor: globalTokens.lightGrey,
1241
- dataBackgroundColor: globalTokens.white,
1052
+ rowSeparatorStyle: globalTokens.border_solid,
1053
+ rowSeparatorColor: globalTokens.hal_grey_l_80,
1054
+ dataBackgroundColor: globalTokens.hal_white,
1242
1055
  dataFontFamily: globalTokens.type_sans,
1243
1056
  dataFontSize: globalTokens.type_scale_02,
1244
1057
  dataFontStyle: globalTokens.type_normal,
1245
1058
  dataFontWeight: globalTokens.type_regular,
1246
- dataFontColor: globalTokens.black,
1059
+ dataFontColor: globalTokens.hal_black,
1247
1060
  dataFontTextTransform: "none",
1248
1061
  dataPaddingTop: "14px",
1249
1062
  dataPaddingBottom: "12px",
@@ -1257,7 +1070,7 @@ var componentTokens = {
1257
1070
  headerFontSize: globalTokens.type_scale_02,
1258
1071
  headerFontStyle: globalTokens.type_normal,
1259
1072
  headerFontWeight: globalTokens.type_regular,
1260
- headerFontColor: globalTokens.white,
1073
+ headerFontColor: globalTokens.hal_white,
1261
1074
  headerFontTextTransform: "none",
1262
1075
  headerPaddingTop: "16px",
1263
1076
  headerPaddingBottom: "16px",
@@ -1265,9 +1078,9 @@ var componentTokens = {
1265
1078
  headerPaddingLeft: "40px",
1266
1079
  headerTextAlign: "left",
1267
1080
  headerTextLineHeight: "normal",
1268
- scrollBarThumbColor: globalTokens.darkGrey,
1269
- scrollBarTrackColor: globalTokens.lightGrey,
1270
- sortIconColor: globalTokens.white
1081
+ scrollBarThumbColor: globalTokens.hal_grey_s_40,
1082
+ scrollBarTrackColor: globalTokens.hal_grey_l_80,
1083
+ sortIconColor: globalTokens.hal_white
1271
1084
  },
1272
1085
  tabs: {
1273
1086
  fontFamily: globalTokens.type_sans,
@@ -1275,30 +1088,31 @@ var componentTokens = {
1275
1088
  fontStyle: globalTokens.type_normal,
1276
1089
  fontWeight: globalTokens.type_semibold,
1277
1090
  fontTextTransform: "none",
1278
- selectedBackgroundColor: globalTokens.white,
1279
- selectedFontColor: "#5f249f",
1280
- selectedIconColor: "#5f249f",
1281
- selectedUnderlineColor: "#5f249f",
1091
+ selectedBackgroundColor: globalTokens.hal_white,
1092
+ selectedFontColor: globalTokens.hal_purple_s_38,
1093
+ selectedIconColor: globalTokens.hal_purple_s_38,
1094
+ selectedUnderlineColor: globalTokens.hal_purple_s_38,
1282
1095
  selectedUnderlineThickness: "2px",
1283
- unselectedBackgroundColor: globalTokens.white,
1284
- unselectedFontColor: globalTokens.darkGrey,
1285
- unselectedIconColor: globalTokens.darkGrey,
1286
- disabledFontColor: "#999999",
1287
- disabledIconColor: "#999999",
1096
+ unselectedBackgroundColor: globalTokens.hal_white,
1097
+ unselectedFontColor: globalTokens.hal_grey_s_40,
1098
+ unselectedIconColor: globalTokens.hal_grey_s_40,
1099
+ disabledFontColor: globalTokens.hal_grey_l_60,
1100
+ disabledIconColor: globalTokens.hal_grey_l_60,
1288
1101
  disabledFontStyle: globalTokens.type_normal,
1289
- hoverBackgroundColor: "#f2eafa",
1290
- pressedBackgroundColor: "#e5d5f6",
1102
+ disabledBadgeBackgroundColor: "#0000004d",
1103
+ hoverBackgroundColor: globalTokens.hal_purple_l_95,
1104
+ pressedBackgroundColor: globalTokens.hal_purple_l_90,
1291
1105
  pressedFontWeight: globalTokens.type_semibold,
1292
- dividerColor: globalTokens.mediumGrey,
1106
+ dividerColor: globalTokens.hal_grey_l_75,
1293
1107
  dividerThickness: "1px",
1294
- focusOutline: "#5f249f",
1108
+ focusOutline: globalTokens.hal_purple_s_38,
1295
1109
  scrollButtonsWidth: "48px",
1296
- badgeBackgroundColor: globalTokens.darkRed,
1110
+ badgeBackgroundColor: globalTokens.hal_red_s_41,
1297
1111
  badgeFontFamily: globalTokens.type_sans,
1298
1112
  badgeFontSize: "10px",
1299
1113
  badgeFontStyle: globalTokens.type_normal,
1300
1114
  badgeFontWeight: "500",
1301
- badgeFontColor: globalTokens.white,
1115
+ badgeFontColor: globalTokens.hal_white,
1302
1116
  badgeLetterSpacing: globalTokens.type_spacing_wide_02,
1303
1117
  badgeWidth: "16px",
1304
1118
  badgeHeight: "16px",
@@ -1307,6 +1121,23 @@ var componentTokens = {
1307
1121
  badgeHeightWithNotificationNumber: "17px",
1308
1122
  badgeRadiusWithNotificationNumber: "10px"
1309
1123
  },
1124
+ tag: {
1125
+ fontFamily: globalTokens.type_sans,
1126
+ fontColor: globalTokens.hal_black,
1127
+ fontSize: globalTokens.type_scale_02,
1128
+ fontStyle: globalTokens.type_normal,
1129
+ fontWeight: globalTokens.type_regular,
1130
+ labelPaddingTop: "0px",
1131
+ labelPaddingBottom: "0px",
1132
+ labelPaddingLeft: "16px",
1133
+ labelPaddingRight: "16px",
1134
+ height: "40px",
1135
+ iconColor: globalTokens.hal_white,
1136
+ iconSectionWidth: "40px",
1137
+ iconHeight: "24px",
1138
+ iconWidth: "auto",
1139
+ focusColor: globalTokens.hal_blue_l_50
1140
+ },
1310
1141
  textarea: {
1311
1142
  fontFamily: globalTokens.type_sans,
1312
1143
  enabledBorderColor: globalTokens.hal_black,
@@ -1344,7 +1175,7 @@ var componentTokens = {
1344
1175
  helperTextLineHeight: globalTokens.type_leading_normal,
1345
1176
  disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
1346
1177
  disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
1347
- placeholderFontColor: "#000000b3",
1178
+ placeholderFontColor: globalTokens.color_grey_a_800,
1348
1179
  placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
1349
1180
  disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
1350
1181
  disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
@@ -1356,40 +1187,98 @@ var componentTokens = {
1356
1187
  disabledValueFontColor: globalTokens.hal_grey_l_60,
1357
1188
  disabledValueFontColorOnDark: globalTokens.hal_grey_l_60
1358
1189
  },
1359
- V3Textarea: {
1190
+ textInput: {
1360
1191
  fontFamily: globalTokens.type_sans,
1361
- assistiveTextFontSize: globalTokens.type_scale_01,
1362
- assistiveTextFontStyle: globalTokens.type_normal,
1363
- assistiveTextFontWeight: globalTokens.type_regular,
1364
- assistiveTextFontColor: globalTokens.black,
1365
- assistiveTextFontColorOnDark: globalTokens.white,
1366
- assistiveTextLetterSpacing: "0.03333em",
1367
- disabledColor: globalTokens.lighterBlack,
1368
- disabledColorOnDark: "#575757",
1369
- errorColor: globalTokens.red,
1370
- errorColorOnDark: globalTokens.hal_red_l_60,
1371
- scrollBarThumbColor: globalTokens.darkGrey,
1372
- scrollBarThumbColorOnDark: globalTokens.white,
1373
- scrollBarTrackColor: globalTokens.lightGrey,
1374
- scrollBarTrackColorOnDark: "#999999",
1375
- labelFontSize: globalTokens.type_scale_03,
1192
+ enabledBorderColor: globalTokens.hal_black,
1193
+ enabledBorderColorOnDark: globalTokens.hal_white,
1194
+ hoverBorderColor: globalTokens.hal_purple_l_65,
1195
+ hoverBorderColorOnDark: globalTokens.hal_purple_l_65,
1196
+ focusBorderColor: globalTokens.hal_blue_l_50,
1197
+ focusBorderColorOnDark: globalTokens.hal_blue_l_50,
1198
+ disabledBorderColor: globalTokens.hal_grey_l_60,
1199
+ disabledBorderColorOnDark: globalTokens.hal_grey_l_60,
1200
+ disabledContainerFillColor: globalTokens.hal_grey_l_95,
1201
+ disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
1202
+ errorBorderColor: globalTokens.hal_red_s_41,
1203
+ errorBorderColorOnDark: globalTokens.hal_red_l_60,
1204
+ hoverErrorBorderColor: globalTokens.color_red_600,
1205
+ hoverErrorBorderColorOnDark: "#fe677b",
1206
+ inputMarginTop: globalTokens.spacing_02,
1207
+ inputMarginBottom: globalTokens.spacing_02,
1208
+ errorMessageColor: globalTokens.hal_red_s_41,
1209
+ errorMessageColorOnDark: globalTokens.hal_red_l_60,
1210
+ errorIconColor: globalTokens.hal_red_s_41,
1211
+ errorIconColorOnDark: globalTokens.hal_red_l_60,
1212
+ labelFontColor: globalTokens.hal_black,
1213
+ labelFontColorOnDark: globalTokens.hal_white,
1214
+ labelFontSize: globalTokens.type_scale_02,
1376
1215
  labelFontStyle: globalTokens.type_normal,
1377
- labelFontWeight: globalTokens.type_regular,
1378
- labelFontColor: globalTokens.black,
1379
- labelFontColorOnDark: globalTokens.white,
1380
- labelLetterSpacing: "0.00938em",
1216
+ labelFontWeight: globalTokens.type_semibold,
1217
+ labelLineHeight: globalTokens.type_leading_loose_01,
1218
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1219
+ disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
1220
+ optionalLabelFontWeight: globalTokens.type_regular,
1221
+ helperTextFontColor: globalTokens.hal_black,
1222
+ helperTextFontColorOnDark: globalTokens.hal_white,
1223
+ helperTextFontSize: globalTokens.type_scale_01,
1224
+ helperTextFontStyle: globalTokens.type_normal,
1225
+ helperTextFontWeight: globalTokens.type_regular,
1226
+ helperTextLineHeight: globalTokens.type_leading_normal,
1227
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
1228
+ disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
1229
+ prefixColor: globalTokens.hal_grey_s_40,
1230
+ prefixColorOnDark: globalTokens.hal_white,
1231
+ suffixColor: globalTokens.hal_grey_s_40,
1232
+ suffixColorOnDark: globalTokens.hal_white,
1233
+ disabledPrefixColor: globalTokens.hal_grey_l_75,
1234
+ disabledSuffixColor: globalTokens.hal_grey_l_75,
1235
+ disabledPrefixColorOnDark: globalTokens.hal_grey_l_60,
1236
+ disabledSuffixColorOnDark: globalTokens.hal_grey_l_60,
1237
+ placeholderFontColor: globalTokens.color_grey_a_800,
1238
+ placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
1239
+ disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
1240
+ disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
1241
+ valueFontColor: globalTokens.hal_black,
1242
+ valueFontColorOnDark: globalTokens.hal_white,
1381
1243
  valueFontSize: globalTokens.type_scale_03,
1382
1244
  valueFontStyle: globalTokens.type_normal,
1383
1245
  valueFontWeight: globalTokens.type_regular,
1384
- valueFontColor: globalTokens.black,
1385
- valueFontColorOnDark: globalTokens.white,
1386
- valueLetterSpacing: globalTokens.type_spacing_normal,
1387
- valueLineHeight: "1.1875em",
1388
- underlineColor: globalTokens.black,
1389
- underlineColorOnDark: globalTokens.white,
1390
- underlineFocusColor: globalTokens.black,
1391
- underlineFocusColorOnDark: globalTokens.white,
1392
- underlineThickness: "1px"
1246
+ disabledValueFontColor: globalTokens.hal_grey_l_60,
1247
+ disabledValueFontColorOnDark: globalTokens.hal_grey_l_60,
1248
+ actionIconColor: globalTokens.hal_black,
1249
+ actionIconColorOnDark: globalTokens.hal_white,
1250
+ disabledActionIconColor: globalTokens.hal_grey_l_60,
1251
+ disabledActionIconColorOnDark: globalTokens.hal_grey_l_60,
1252
+ hoverActionIconColor: globalTokens.hal_black,
1253
+ hoverActionIconColorOnDark: globalTokens.hal_white,
1254
+ focusActionIconColor: globalTokens.hal_black,
1255
+ focusActionIconColorOnDark: globalTokens.hal_white,
1256
+ activeActionIconColor: globalTokens.hal_black,
1257
+ activeActionIconColorOnDark: globalTokens.hal_black,
1258
+ actionBackgroundColor: globalTokens.transparent,
1259
+ actionBackgroundColorOnDark: globalTokens.transparent,
1260
+ disabledActionBackgroundColor: globalTokens.transparent,
1261
+ disabledActionBackgroundColorOnDark: globalTokens.transparent,
1262
+ hoverActionBackgroundColor: globalTokens.hal_grey_l_95,
1263
+ hoverActionBackgroundColorOnDark: globalTokens.hal_grey_s_40,
1264
+ focusActionBorderColor: globalTokens.hal_blue_l_50,
1265
+ focusActionBorderColorOnDark: globalTokens.hal_blue_l_50,
1266
+ activeActionBackgroundColor: globalTokens.hal_grey_l_80,
1267
+ activeActionBackgroundColorOnDark: globalTokens.hal_grey_l_60,
1268
+ listDialogBackgroundColor: globalTokens.hal_white,
1269
+ listDialogBorderColor: globalTokens.hal_grey_l_75,
1270
+ listOptionDividerColor: globalTokens.hal_grey_l_90,
1271
+ listOptionFontColor: globalTokens.hal_black,
1272
+ listOptionFontSize: globalTokens.type_scale_02,
1273
+ listOptionFontStyle: globalTokens.type_normal,
1274
+ listOptionFontWeight: globalTokens.type_regular,
1275
+ systemMessageFontColor: globalTokens.hal_grey_s_40,
1276
+ errorListDialogFontColor: globalTokens.hal_black,
1277
+ errorListDialogBackgroundColor: globalTokens.color_red_50,
1278
+ errorListDialogBorderColor: globalTokens.hal_red_s_41,
1279
+ hoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
1280
+ activeListOptionBackgroundColor: globalTokens.hal_grey_l_80,
1281
+ focusListOptionBorderColor: globalTokens.hal_blue_l_50
1393
1282
  },
1394
1283
  toggleGroup: {
1395
1284
  containerBackgroundColor: globalTokens.color_grey_50,
@@ -1439,121 +1328,65 @@ var componentTokens = {
1439
1328
  containerBorderRadius: globalTokens.border_radius_large,
1440
1329
  optionFocusBorderThickness: globalTokens.border_width_2
1441
1330
  },
1442
- upload: {
1443
- fontFamily: globalTokens.type_sans,
1444
- shadowColor: globalTokens.lightWhite,
1445
- scrollBarThumbColor: globalTokens.darkGrey,
1446
- scrollBarTrackColor: globalTokens.lightGrey,
1447
- errorColor: globalTokens.red,
1448
- backgroundColor: globalTokens.white,
1449
- draggingStateBackgroundColor: globalTokens.lightWhite,
1450
- dragAndDropIconColor: globalTokens.black,
1451
- dragAndDropIconSize: "43.5px",
1452
- dragAndDropTitleFontSize: globalTokens.type_scale_04,
1453
- dragAndDropTitleFontStyle: globalTokens.type_normal,
1454
- dragAndDropTitleFontWeight: globalTokens.type_bold,
1455
- dragAndDropTitleFontTextTransform: "none",
1456
- dragAndDropTitleFontColor: globalTokens.black,
1457
- dragAndDropDescriptionFontSize: globalTokens.type_scale_03,
1458
- dragAndDropDescriptionFontStyle: globalTokens.type_italic,
1459
- dragAndDropDescriptionFontWeight: globalTokens.type_regular,
1460
- dragAndDropDescriptionFontTextTransform: "none",
1461
- dragAndDropDescriptionFontColor: globalTokens.darkGrey,
1462
- dragAndDropDraggingStateIconColor: globalTokens.darkGrey,
1463
- dragAndDropDraggingStateIconSize: "74.5px",
1464
- dragAndDropDraggingStateFontSize: globalTokens.type_scale_03,
1465
- dragAndDropDraggingStateFontStyle: globalTokens.type_italic,
1466
- dragAndDropDraggingStateFontWeight: globalTokens.type_regular,
1467
- dragAndDropDraggingStateFontTextTransform: "none",
1468
- dragAndDropDraggingStateFontColor: globalTokens.darkGrey,
1469
- dragAndDropAreaIconColor: globalTokens.darkGrey,
1470
- dragAndDropAreaIconSize: "24px",
1471
- dragAndDropAreaTextFontSize: globalTokens.type_scale_01,
1472
- dragAndDropAreaTextFontStyle: globalTokens.type_italic,
1473
- dragAndDropAreaTextFontWeight: globalTokens.type_regular,
1474
- dragAndDropAreaTextFontTextTransform: "none",
1475
- dragAndDropAreaTextFontColor: globalTokens.darkGrey,
1476
- fileDeleteIconColor: globalTokens.black,
1477
- fileDeleteIconSize: "30px",
1478
- fileUnderlineColor: globalTokens.lightGrey,
1479
- fileUnderlineThickness: "1px",
1480
- fileNameFontSize: globalTokens.type_scale_03,
1481
- fileNameFontStyle: globalTokens.type_normal,
1482
- fileNameFontWeight: globalTokens.type_regular,
1483
- fileNameFontTextTransform: "none",
1484
- fileNameFontColor: globalTokens.black,
1485
- fileTypeFontSize: globalTokens.type_scale_01,
1486
- fileTypeFontStyle: globalTokens.type_normal,
1487
- fileTypeFontWeight: globalTokens.type_regular,
1488
- fileTypeFontTextTransform: globalTokens.type_uppercase,
1489
- fileTypeFontColor: globalTokens.darkGrey,
1490
- hoverFileColor: globalTokens.darkWhite,
1491
- uploadedFileIconColor: globalTokens.lightGrey,
1492
- uploadedFileIconSize: "24px",
1493
- uploadedFilesTitleFontSize: globalTokens.type_scale_04,
1494
- uploadedFilesTitleFontStyle: globalTokens.type_normal,
1495
- uploadedFilesTitleFontWeight: globalTokens.type_regular,
1496
- uploadedFilesTitleFontTextTransform: "none",
1497
- uploadedFilesTitleFontColor: globalTokens.black,
1498
- uploadedFilesSubtitleFontSize: globalTokens.type_scale_01,
1499
- uploadedFilesSubtitleFontStyle: globalTokens.type_normal,
1500
- uploadedFilesSubtitleFontWeight: globalTokens.type_regular,
1501
- uploadedFilesSubtitleFontTextTransform: "none",
1502
- uploadedFilesSubtitleFontColor: globalTokens.darkGrey,
1503
- uploadedFilesNumberFontWeight: globalTokens.type_bold
1504
- },
1505
1331
  wizard: {
1506
- disabledBackgroundColor: globalTokens.lightGrey,
1507
- disabledFontColor: globalTokens.darkGrey,
1508
- stepContainerFontSize: globalTokens.type_scale_03,
1509
- stepContainerFontFamily: globalTokens.type_sans,
1510
- stepContainerFontStyle: globalTokens.type_normal,
1511
- stepContainerFontWeight: globalTokens.type_regular,
1512
- stepContainerLetterSpacing: globalTokens.type_spacing_wide_02,
1513
- stepContainerFontColor: globalTokens.black,
1514
- stepContainerSelectedFontColor: globalTokens.white,
1515
- stepContainerSelectedBackgroundColor: globalTokens.hal_purple_s_38,
1516
- stepContainerBackgroundColor: globalTokens.white,
1517
- stepContainerIconSize: "19px",
1332
+ visitedStepFontColor: globalTokens.hal_black,
1333
+ visitedStepBackgroundColor: globalTokens.hal_white,
1334
+ visitedStepBorderColor: globalTokens.hal_black,
1335
+ unvisitedStepFontColor: globalTokens.hal_grey_s_40,
1336
+ unvisitedLabelFontColor: globalTokens.hal_grey_s_40,
1337
+ unvisitedHelperTextFontColor: globalTokens.hal_grey_s_40,
1338
+ unvisitedStepBackgroundColor: globalTokens.transparent,
1339
+ unvisitedStepBorderColor: globalTokens.hal_grey_s_40,
1340
+ selectedStepFontColor: globalTokens.hal_white,
1341
+ selectedStepBackgroundColor: globalTokens.hal_purple_s_38,
1342
+ selectedStepBorderColor: globalTokens.hal_purple_s_38,
1343
+ selectedLabelFontColor: globalTokens.hal_black,
1344
+ selectedHelperTextFontColor: globalTokens.hal_black,
1345
+ selectedStepWidth: "32px",
1346
+ selectedStepHeight: "32px",
1347
+ selectedStepBorderThickness: "2px",
1348
+ selectedStepBorderStyle: globalTokens.border_solid,
1349
+ selectedStepBorderRadius: "45px",
1350
+ stepFontSize: globalTokens.type_scale_03,
1351
+ stepFontFamily: globalTokens.type_sans,
1352
+ stepFontStyle: globalTokens.type_normal,
1353
+ stepFontWeight: globalTokens.type_regular,
1354
+ stepFontTracking: globalTokens.type_spacing_wide_02,
1355
+ stepIconSize: "20px",
1356
+ stepWidth: "32px",
1357
+ stepHeight: "32px",
1358
+ stepBorderThickness: "2px",
1359
+ stepBorderStyle: globalTokens.border_solid,
1360
+ stepBorderRadius: "45px",
1361
+ visitedLabelFontColor: globalTokens.hal_black,
1518
1362
  labelFontSize: globalTokens.type_scale_03,
1519
1363
  labelFontFamily: globalTokens.type_sans,
1520
1364
  labelFontStyle: globalTokens.type_normal,
1521
1365
  labelFontWeight: globalTokens.type_regular,
1522
- labelLetterSpacing: globalTokens.type_spacing_normal,
1366
+ labelFontTracking: globalTokens.type_spacing_normal,
1523
1367
  labelFontTextTransform: "none",
1524
1368
  labelTextAlign: "left",
1525
- labelFontColor: globalTokens.darkGrey,
1526
- visitedLabelFontColor: globalTokens.black,
1527
- visitedDescriptionFontColor: globalTokens.black,
1528
- descriptionFontSize: globalTokens.type_scale_01,
1529
- descriptionFontFamily: globalTokens.type_sans,
1530
- descriptionFontStyle: globalTokens.type_normal,
1531
- descriptionFontWeight: globalTokens.type_regular,
1532
- descriptionLetterSpacing: globalTokens.type_spacing_wide_01,
1533
- descriptionFontTextTransform: "none",
1534
- descriptionFontColor: globalTokens.darkGrey,
1535
- descriptionTextAlign: "left",
1536
- circleWidth: "32px",
1537
- circleHeight: "32px",
1538
- circleBorderThickness: "2px",
1539
- circleBorderStyle: "solid",
1540
- circleBorderRadius: "45px",
1541
- circleBorderColor: globalTokens.black,
1542
- selectedCircleWidth: "32px",
1543
- selectedCircleHeight: "32px",
1544
- selectedCircleBorderThickness: "2px",
1545
- selectedCircleBorderStyle: "solid",
1546
- selectedCircleBorderRadius: "45px",
1547
- selectedCircleBorderColor: globalTokens.purple,
1548
- disabledCircleWidth: "32px",
1549
- disabledCircleHeight: "32px",
1550
- disabledCircleBorderThickness: "2px",
1551
- disabledCircleBorderStyle: "solid",
1552
- disabledCircleBorderRadius: "45px",
1553
- disabledCircleBorderColor: globalTokens.lightGrey,
1369
+ helperTextFontSize: globalTokens.type_scale_02,
1370
+ helperTextFontFamily: globalTokens.type_sans,
1371
+ helperTextFontStyle: globalTokens.type_normal,
1372
+ helperTextFontWeight: globalTokens.type_regular,
1373
+ helperTextFontTracking: globalTokens.type_spacing_normal,
1374
+ helperTextFontTextTransform: "none",
1375
+ visitedHelperTextFontColor: globalTokens.hal_black,
1376
+ helperTextTextAlign: "left",
1377
+ disabledStepBackgroundColor: globalTokens.hal_grey_l_95,
1378
+ disabledStepFontColor: globalTokens.hal_grey_l_60,
1379
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1380
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
1381
+ disabledStepBorderColor: globalTokens.hal_grey_l_95,
1382
+ disabledStepWidth: "32px",
1383
+ disabledStepHeight: "32px",
1384
+ disabledStepBorderThickness: "2px",
1385
+ disabledStepBorderStyle: globalTokens.border_solid,
1386
+ disabledStepBorderRadius: "45px",
1554
1387
  separatorBorderThickness: "1px",
1555
- separatorBorderStyle: "solid",
1556
- separatorColor: globalTokens.lightGrey,
1388
+ separatorBorderStyle: globalTokens.border_solid,
1389
+ separatorColor: globalTokens.hal_grey_s_40,
1557
1390
  focusColor: globalTokens.hal_blue_l_50
1558
1391
  }
1559
1392
  };
@@ -1569,12 +1402,11 @@ var spaces = {
1569
1402
  };
1570
1403
  exports.spaces = spaces;
1571
1404
  var responsiveSizes = {
1572
- mobileSmall: "320",
1573
- mobileMedium: "375",
1574
- mobileLarge: "425",
1575
- tablet: "768",
1576
- laptop: "1024",
1577
- desktop: "1440"
1405
+ xsmall: "20",
1406
+ small: "30",
1407
+ medium: "45",
1408
+ large: "66",
1409
+ xlarge: "90"
1578
1410
  };
1579
1411
  exports.responsiveSizes = responsiveSizes;
1580
1412
  var typeface = {
@@ -1609,4 +1441,98 @@ var typeface = {
1609
1441
  textTransform: "uppercase"
1610
1442
  }
1611
1443
  };
1612
- exports.typeface = typeface;
1444
+ exports.typeface = typeface;
1445
+ var defaultTranslatedComponentLabels = {
1446
+ formFields: {
1447
+ optionalLabel: "(Optional)",
1448
+ requiredSelectionErrorMessage: "This field is required. Please, choose an option.",
1449
+ requiredValueErrorMessage: "This field is required. Please, enter a value.",
1450
+ formatRequestedErrorMessage: "Please match the format requested.",
1451
+ lengthErrorMessage: function lengthErrorMessage(minLength, maxLength) {
1452
+ return "Min length ".concat(minLength, ", max length ").concat(maxLength, ".");
1453
+ },
1454
+ logoAlternativeText: "Logo"
1455
+ },
1456
+ applicationLayout: {
1457
+ visibilityToggleTitle: "Toggle visibility sidenav"
1458
+ },
1459
+ alert: {
1460
+ infoTitleText: "information",
1461
+ successTitleText: "success",
1462
+ warningTitleText: "warning",
1463
+ errorTitleText: "error"
1464
+ },
1465
+ dateInput: {
1466
+ invalidDateErrorMessage: "Invalid date."
1467
+ },
1468
+ fileInput: {
1469
+ fileSizeGreaterThanErrorMessage: "File size must be greater than min size.",
1470
+ fileSizeLessThanErrorMessage: "File size must be less than max size.",
1471
+ multipleButtonLabelDefault: "Select files",
1472
+ singleButtonLabelDefault: "Select file",
1473
+ dropAreaButtonLabelDefault: "Select",
1474
+ multipleDropAreaLabelDefault: "or drop files",
1475
+ singleDropAreaLabelDefault: "or drop a file",
1476
+ deleteFileActionTitle: "Remove file"
1477
+ },
1478
+ footer: {
1479
+ copyrightText: function copyrightText(year) {
1480
+ return "\xA9 DXC Technology ".concat(year, ". All rights reserved.");
1481
+ }
1482
+ },
1483
+ header: {
1484
+ closeIcon: "Close menu",
1485
+ hamburguerTitle: "Menu"
1486
+ },
1487
+ numberInput: {
1488
+ valueGreaterThanOrEqualToErrorMessage: function valueGreaterThanOrEqualToErrorMessage(value) {
1489
+ return "Value must be greater than or equal to ".concat(value, ".");
1490
+ },
1491
+ valueLessThanOrEqualToErrorMessage: function valueLessThanOrEqualToErrorMessage(value) {
1492
+ return "Value must be less than or equal to ".concat(value, ".");
1493
+ },
1494
+ decrementValueTitle: "Decrement value",
1495
+ incrementValueTitle: "Increment value"
1496
+ },
1497
+ paginator: {
1498
+ itemsPerPageText: "Items per page: ",
1499
+ minToMaxOfText: function minToMaxOfText(minNumberOfItems, maxNumberOfItems, totalItems) {
1500
+ return "".concat(minNumberOfItems, " to ").concat(maxNumberOfItems, " of ").concat(totalItems);
1501
+ },
1502
+ goToPageText: "Go to page:",
1503
+ pageOfText: function pageOfText(pageNumber, totalPagesNumber) {
1504
+ return "Page: ".concat(pageNumber, " of ").concat(totalPagesNumber);
1505
+ }
1506
+ },
1507
+ passwordInput: {
1508
+ inputShowPasswordTitle: "Show password",
1509
+ inputHidePasswordTitle: "Hide password"
1510
+ },
1511
+ quickNav: {
1512
+ contentTitle: "Contents"
1513
+ },
1514
+ radioGroup: {
1515
+ optionalItemLabelDefault: "N/A"
1516
+ },
1517
+ select: {
1518
+ noMatchesErrorMessage: "No matches found",
1519
+ actionClearSelectionTitle: "Clear selection",
1520
+ actionClearSearchTitle: "Clear search"
1521
+ },
1522
+ tabs: {
1523
+ scrollLeft: "Scroll left",
1524
+ scrollRight: "Scroll right"
1525
+ },
1526
+ textInput: {
1527
+ clearFieldActionTitle: "Clear field",
1528
+ searchingMessage: "Searching...",
1529
+ fetchingDataErrorMessage: "Error fetching data"
1530
+ },
1531
+ calendar: {
1532
+ daysShort: ["Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"],
1533
+ months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
1534
+ previousMonthTitle: "Previous month",
1535
+ nextMonthTitle: "Next month"
1536
+ }
1537
+ };
1538
+ exports.defaultTranslatedComponentLabels = defaultTranslatedComponentLabels;