@dxc-technology/halstack-react 0.0.0-efc8cec → 0.0.0-f0d662d

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 (444) hide show
  1. package/BackgroundColorContext.d.ts +10 -0
  2. package/BackgroundColorContext.js +47 -0
  3. package/ThemeContext.d.ts +15 -0
  4. package/ThemeContext.js +243 -0
  5. package/V3Select/V3Select.js +455 -0
  6. package/V3Select/index.d.ts +27 -0
  7. package/V3Textarea/V3Textarea.js +260 -0
  8. package/V3Textarea/index.d.ts +27 -0
  9. package/accordion/Accordion.d.ts +4 -0
  10. package/accordion/Accordion.js +258 -0
  11. package/accordion/Accordion.stories.tsx +307 -0
  12. package/accordion/types.d.ts +68 -0
  13. package/accordion/types.js +5 -0
  14. package/accordion-group/AccordionGroup.d.ts +7 -0
  15. package/accordion-group/AccordionGroup.js +170 -0
  16. package/accordion-group/AccordionGroup.stories.tsx +225 -0
  17. package/accordion-group/types.d.ts +72 -0
  18. package/accordion-group/types.js +5 -0
  19. package/alert/Alert.d.ts +4 -0
  20. package/alert/Alert.js +290 -0
  21. package/alert/Alert.stories.tsx +170 -0
  22. package/alert/types.d.ts +49 -0
  23. package/alert/types.js +5 -0
  24. package/badge/Badge.js +59 -0
  25. package/bleed/Bleed.d.ts +3 -0
  26. package/bleed/Bleed.js +84 -0
  27. package/bleed/Bleed.stories.tsx +342 -0
  28. package/bleed/types.d.ts +13 -0
  29. package/bleed/types.js +5 -0
  30. package/box/Box.d.ts +4 -0
  31. package/box/Box.js +126 -0
  32. package/box/Box.stories.tsx +132 -0
  33. package/box/types.d.ts +43 -0
  34. package/box/types.js +5 -0
  35. package/button/Button.d.ts +4 -0
  36. package/button/Button.js +171 -0
  37. package/button/Button.stories.tsx +274 -0
  38. package/button/types.d.ts +53 -0
  39. package/button/types.js +5 -0
  40. package/card/Card.d.ts +4 -0
  41. package/card/Card.js +164 -0
  42. package/card/Card.stories.tsx +201 -0
  43. package/card/ice-cream.jpg +0 -0
  44. package/card/types.d.ts +67 -0
  45. package/card/types.js +5 -0
  46. package/checkbox/Checkbox.d.ts +4 -0
  47. package/checkbox/Checkbox.js +253 -0
  48. package/checkbox/Checkbox.stories.tsx +192 -0
  49. package/checkbox/types.d.ts +60 -0
  50. package/checkbox/types.js +5 -0
  51. package/chip/Chip.d.ts +4 -0
  52. package/chip/Chip.js +199 -0
  53. package/chip/Chip.stories.tsx +121 -0
  54. package/chip/types.d.ts +53 -0
  55. package/chip/types.js +5 -0
  56. package/{dist/common → common}/OpenSans.css +0 -0
  57. package/{dist/common → common}/RequiredComponent.js +3 -11
  58. package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  59. package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  60. package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  61. package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  62. package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  63. package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  64. package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  65. package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  66. package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  67. package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  68. package/common/utils.js +22 -0
  69. package/common/variables.js +1612 -0
  70. package/{dist/date → date}/Date.js +72 -58
  71. package/date/index.d.ts +27 -0
  72. package/date-input/DateInput.d.ts +4 -0
  73. package/date-input/DateInput.js +358 -0
  74. package/date-input/DateInput.stories.tsx +138 -0
  75. package/date-input/types.d.ts +100 -0
  76. package/date-input/types.js +5 -0
  77. package/dialog/Dialog.d.ts +4 -0
  78. package/dialog/Dialog.js +166 -0
  79. package/dialog/Dialog.stories.tsx +212 -0
  80. package/dialog/types.d.ts +43 -0
  81. package/dialog/types.js +5 -0
  82. package/dropdown/Dropdown.d.ts +4 -0
  83. package/dropdown/Dropdown.js +417 -0
  84. package/dropdown/Dropdown.stories.tsx +247 -0
  85. package/dropdown/types.d.ts +89 -0
  86. package/dropdown/types.js +5 -0
  87. package/file-input/FileInput.d.ts +4 -0
  88. package/file-input/FileInput.js +590 -0
  89. package/file-input/FileInput.stories.tsx +507 -0
  90. package/file-input/FileItem.d.ts +14 -0
  91. package/file-input/FileItem.js +184 -0
  92. package/file-input/types.d.ts +112 -0
  93. package/file-input/types.js +5 -0
  94. package/footer/Footer.d.ts +4 -0
  95. package/footer/Footer.js +258 -0
  96. package/footer/Footer.stories.tsx +130 -0
  97. package/footer/Icons.d.ts +2 -0
  98. package/footer/Icons.js +77 -0
  99. package/footer/types.d.ts +65 -0
  100. package/footer/types.js +5 -0
  101. package/header/Header.d.ts +7 -0
  102. package/header/Header.js +324 -0
  103. package/header/Header.stories.tsx +162 -0
  104. package/header/Icons.d.ts +2 -0
  105. package/header/Icons.js +34 -0
  106. package/header/types.d.ts +47 -0
  107. package/header/types.js +5 -0
  108. package/heading/Heading.d.ts +4 -0
  109. package/heading/Heading.js +159 -0
  110. package/heading/Heading.stories.tsx +54 -0
  111. package/heading/types.d.ts +33 -0
  112. package/heading/types.js +5 -0
  113. package/input-text/Icons.js +22 -0
  114. package/input-text/InputText.js +611 -0
  115. package/input-text/index.d.ts +36 -0
  116. package/inset/Inset.d.ts +3 -0
  117. package/inset/Inset.js +84 -0
  118. package/inset/Inset.stories.tsx +229 -0
  119. package/inset/types.d.ts +13 -0
  120. package/inset/types.js +5 -0
  121. package/layout/ApplicationLayout.d.ts +10 -0
  122. package/layout/ApplicationLayout.js +225 -0
  123. package/layout/ApplicationLayout.stories.tsx +171 -0
  124. package/layout/Icons.js +55 -0
  125. package/layout/types.d.ts +57 -0
  126. package/layout/types.js +5 -0
  127. package/link/Link.d.ts +3 -0
  128. package/link/Link.js +161 -0
  129. package/link/Link.stories.tsx +146 -0
  130. package/link/types.d.ts +74 -0
  131. package/link/types.js +5 -0
  132. package/list/List.d.ts +4 -0
  133. package/list/List.js +47 -0
  134. package/list/List.stories.tsx +95 -0
  135. package/list/types.d.ts +7 -0
  136. package/list/types.js +5 -0
  137. package/main.d.ts +48 -0
  138. package/{dist/main.js → main.js} +147 -55
  139. package/number-input/NumberInput.d.ts +4 -0
  140. package/number-input/NumberInput.js +83 -0
  141. package/number-input/NumberInput.stories.tsx +115 -0
  142. package/number-input/NumberInputContext.d.ts +4 -0
  143. package/number-input/NumberInputContext.js +19 -0
  144. package/number-input/numberInputContextTypes.d.ts +19 -0
  145. package/number-input/numberInputContextTypes.js +5 -0
  146. package/number-input/types.d.ts +117 -0
  147. package/number-input/types.js +5 -0
  148. package/package.json +34 -23
  149. package/paginator/Icons.js +66 -0
  150. package/paginator/Paginator.d.ts +4 -0
  151. package/paginator/Paginator.js +192 -0
  152. package/paginator/Paginator.stories.tsx +63 -0
  153. package/paginator/types.d.ts +38 -0
  154. package/paginator/types.js +5 -0
  155. package/password-input/PasswordInput.d.ts +4 -0
  156. package/password-input/PasswordInput.js +163 -0
  157. package/password-input/PasswordInput.stories.tsx +131 -0
  158. package/password-input/types.d.ts +107 -0
  159. package/password-input/types.js +5 -0
  160. package/progress-bar/ProgressBar.d.ts +4 -0
  161. package/progress-bar/ProgressBar.js +170 -0
  162. package/progress-bar/ProgressBar.stories.jsx +58 -0
  163. package/progress-bar/types.d.ts +37 -0
  164. package/progress-bar/types.js +5 -0
  165. package/radio/Radio.d.ts +4 -0
  166. package/radio/Radio.js +174 -0
  167. package/radio/Radio.stories.tsx +192 -0
  168. package/radio/types.d.ts +54 -0
  169. package/radio/types.js +5 -0
  170. package/radio-group/Radio.d.ts +4 -0
  171. package/radio-group/Radio.js +140 -0
  172. package/radio-group/RadioGroup.d.ts +4 -0
  173. package/radio-group/RadioGroup.js +273 -0
  174. package/radio-group/RadioGroup.stories.tsx +79 -0
  175. package/radio-group/RadioGroup.test.js +248 -0
  176. package/radio-group/types.d.ts +36 -0
  177. package/radio-group/types.js +5 -0
  178. package/resultsetTable/ResultsetTable.d.ts +4 -0
  179. package/{dist/resultsetTable → resultsetTable}/ResultsetTable.js +81 -163
  180. package/resultsetTable/ResultsetTable.stories.tsx +275 -0
  181. package/resultsetTable/types.d.ts +67 -0
  182. package/resultsetTable/types.js +5 -0
  183. package/row/Row.d.ts +3 -0
  184. package/row/Row.js +127 -0
  185. package/row/Row.stories.tsx +237 -0
  186. package/row/types.d.ts +10 -0
  187. package/row/types.js +5 -0
  188. package/select/Select.d.ts +4 -0
  189. package/select/Select.js +863 -0
  190. package/select/Select.stories.tsx +572 -0
  191. package/select/types.d.ts +170 -0
  192. package/select/types.js +5 -0
  193. package/sidenav/Sidenav.d.ts +9 -0
  194. package/sidenav/Sidenav.js +136 -0
  195. package/sidenav/Sidenav.stories.tsx +182 -0
  196. package/sidenav/types.d.ts +50 -0
  197. package/sidenav/types.js +5 -0
  198. package/slider/Slider.d.ts +4 -0
  199. package/slider/Slider.js +317 -0
  200. package/slider/Slider.stories.tsx +177 -0
  201. package/slider/types.d.ts +78 -0
  202. package/slider/types.js +5 -0
  203. package/spinner/Spinner.d.ts +4 -0
  204. package/spinner/Spinner.js +250 -0
  205. package/spinner/Spinner.stories.jsx +103 -0
  206. package/spinner/types.d.ts +32 -0
  207. package/spinner/types.js +5 -0
  208. package/stack/Stack.d.ts +3 -0
  209. package/stack/Stack.js +97 -0
  210. package/stack/Stack.stories.tsx +164 -0
  211. package/stack/types.d.ts +9 -0
  212. package/stack/types.js +5 -0
  213. package/switch/Switch.d.ts +4 -0
  214. package/switch/Switch.js +179 -0
  215. package/switch/Switch.stories.tsx +160 -0
  216. package/switch/types.d.ts +58 -0
  217. package/switch/types.js +5 -0
  218. package/table/Table.d.ts +4 -0
  219. package/table/Table.js +118 -0
  220. package/table/Table.stories.jsx +277 -0
  221. package/table/types.d.ts +21 -0
  222. package/table/types.js +5 -0
  223. package/tabs/Tabs.d.ts +4 -0
  224. package/tabs/Tabs.js +213 -0
  225. package/tabs/Tabs.stories.tsx +120 -0
  226. package/tabs/types.d.ts +78 -0
  227. package/tabs/types.js +5 -0
  228. package/tag/Tag.d.ts +4 -0
  229. package/tag/Tag.js +193 -0
  230. package/tag/Tag.stories.tsx +145 -0
  231. package/tag/types.d.ts +60 -0
  232. package/tag/types.js +5 -0
  233. package/text/Text.d.ts +7 -0
  234. package/text/Text.js +30 -0
  235. package/text/Text.stories.tsx +19 -0
  236. package/text-input/TextInput.d.ts +4 -0
  237. package/text-input/TextInput.js +794 -0
  238. package/text-input/TextInput.stories.tsx +456 -0
  239. package/text-input/types.d.ts +159 -0
  240. package/text-input/types.js +5 -0
  241. package/textarea/Textarea.d.ts +4 -0
  242. package/textarea/Textarea.js +284 -0
  243. package/textarea/Textarea.stories.jsx +136 -0
  244. package/textarea/types.d.ts +130 -0
  245. package/textarea/types.js +5 -0
  246. package/{dist/toggle → toggle}/Toggle.js +16 -52
  247. package/toggle/index.d.ts +21 -0
  248. package/toggle-group/ToggleGroup.d.ts +4 -0
  249. package/toggle-group/ToggleGroup.js +214 -0
  250. package/toggle-group/ToggleGroup.stories.tsx +173 -0
  251. package/toggle-group/types.d.ts +97 -0
  252. package/toggle-group/types.js +5 -0
  253. package/{dist/upload → upload}/Upload.js +11 -21
  254. package/upload/buttons-upload/ButtonsUpload.js +111 -0
  255. package/upload/buttons-upload/Icons.js +40 -0
  256. package/upload/dragAndDropArea/DragAndDropArea.js +225 -0
  257. package/upload/dragAndDropArea/Icons.js +39 -0
  258. package/upload/file-upload/FileToUpload.js +115 -0
  259. package/upload/file-upload/Icons.js +66 -0
  260. package/{dist/upload → upload}/files-upload/FilesToUpload.js +15 -31
  261. package/upload/index.d.ts +15 -0
  262. package/upload/transaction/Icons.js +160 -0
  263. package/upload/transaction/Transaction.js +104 -0
  264. package/upload/transactions/Transactions.js +94 -0
  265. package/useTheme.d.ts +2 -0
  266. package/{dist/useTheme.js → useTheme.js} +1 -1
  267. package/wizard/Wizard.d.ts +4 -0
  268. package/wizard/Wizard.js +281 -0
  269. package/wizard/Wizard.stories.tsx +224 -0
  270. package/wizard/types.d.ts +60 -0
  271. package/wizard/types.js +5 -0
  272. package/README.md +0 -66
  273. package/babel.config.js +0 -8
  274. package/dist/ThemeContext.js +0 -185
  275. package/dist/accordion/Accordion.js +0 -286
  276. package/dist/accordion/Accordion.stories.js +0 -207
  277. package/dist/accordion/readme.md +0 -96
  278. package/dist/accordion-group/AccordionGroup.js +0 -156
  279. package/dist/accordion-group/AccordionGroup.stories.js +0 -207
  280. package/dist/accordion-group/readme.md +0 -70
  281. package/dist/alert/Alert.js +0 -316
  282. package/dist/alert/Alert.stories.js +0 -158
  283. package/dist/alert/close.svg +0 -4
  284. package/dist/alert/error.svg +0 -4
  285. package/dist/alert/info.svg +0 -4
  286. package/dist/alert/readme.md +0 -43
  287. package/dist/alert/success.svg +0 -4
  288. package/dist/alert/warning.svg +0 -4
  289. package/dist/badge/Badge.js +0 -42
  290. package/dist/box/Box.js +0 -149
  291. package/dist/button/Button.js +0 -221
  292. package/dist/button/Button.stories.js +0 -224
  293. package/dist/button/readme.md +0 -93
  294. package/dist/card/Card.js +0 -247
  295. package/dist/checkbox/Checkbox.js +0 -235
  296. package/dist/checkbox/Checkbox.stories.js +0 -144
  297. package/dist/checkbox/readme.md +0 -116
  298. package/dist/chip/Chip.js +0 -225
  299. package/dist/common/services/example-service.js +0 -10
  300. package/dist/common/services/example-service.test.js +0 -12
  301. package/dist/common/utils.js +0 -42
  302. package/dist/common/variables.js +0 -522
  303. package/dist/date/Date.stories.js +0 -205
  304. package/dist/date/calendar.svg +0 -1
  305. package/dist/date/calendar_dark.svg +0 -1
  306. package/dist/date/readme.md +0 -73
  307. package/dist/dialog/Dialog.js +0 -205
  308. package/dist/dialog/Dialog.stories.js +0 -217
  309. package/dist/dialog/readme.md +0 -32
  310. package/dist/dropdown/Dropdown.js +0 -458
  311. package/dist/dropdown/Dropdown.stories.js +0 -249
  312. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  313. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  314. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  315. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  316. package/dist/dropdown/readme.md +0 -69
  317. package/dist/footer/Footer.js +0 -381
  318. package/dist/footer/Footer.stories.js +0 -94
  319. package/dist/footer/dxc_logo_wht.png +0 -0
  320. package/dist/footer/readme.md +0 -41
  321. package/dist/header/Header.js +0 -385
  322. package/dist/header/Header.stories.js +0 -176
  323. package/dist/header/close_icon.svg +0 -1
  324. package/dist/header/dxc_logo_black.png +0 -0
  325. package/dist/header/dxc_logo_blk_rgb.svg +0 -6
  326. package/dist/header/dxc_logo_white.png +0 -0
  327. package/dist/header/hamb_menu_black.svg +0 -1
  328. package/dist/header/hamb_menu_white.svg +0 -1
  329. package/dist/header/readme.md +0 -33
  330. package/dist/heading/Heading.js +0 -165
  331. package/dist/input-text/InputText.js +0 -599
  332. package/dist/input-text/InputText.stories.js +0 -209
  333. package/dist/input-text/error.svg +0 -1
  334. package/dist/input-text/readme.md +0 -91
  335. package/dist/layout/ApplicationLayout.js +0 -331
  336. package/dist/layout/facebook.svg +0 -45
  337. package/dist/layout/linkedin.svg +0 -50
  338. package/dist/layout/twitter.svg +0 -53
  339. package/dist/link/Link.js +0 -201
  340. package/dist/link/readme.md +0 -51
  341. package/dist/paginator/Paginator.js +0 -263
  342. package/dist/paginator/images/next.svg +0 -3
  343. package/dist/paginator/images/nextPage.svg +0 -3
  344. package/dist/paginator/images/previous.svg +0 -3
  345. package/dist/paginator/images/previousPage.svg +0 -3
  346. package/dist/paginator/readme.md +0 -50
  347. package/dist/progress-bar/ProgressBar.js +0 -194
  348. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  349. package/dist/progress-bar/readme.md +0 -63
  350. package/dist/radio/Radio.js +0 -192
  351. package/dist/radio/Radio.stories.js +0 -166
  352. package/dist/radio/readme.md +0 -70
  353. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  354. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  355. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  356. package/dist/select/Select.js +0 -492
  357. package/dist/select/Select.stories.js +0 -235
  358. package/dist/select/readme.md +0 -72
  359. package/dist/sidenav/Sidenav.js +0 -157
  360. package/dist/slider/Slider.js +0 -269
  361. package/dist/slider/Slider.stories.js +0 -241
  362. package/dist/slider/readme.md +0 -64
  363. package/dist/spinner/Spinner.js +0 -200
  364. package/dist/spinner/Spinner.stories.js +0 -183
  365. package/dist/spinner/readme.md +0 -65
  366. package/dist/switch/Switch.js +0 -196
  367. package/dist/switch/Switch.stories.js +0 -134
  368. package/dist/switch/readme.md +0 -133
  369. package/dist/table/Table.js +0 -100
  370. package/dist/tabs/Tabs.js +0 -327
  371. package/dist/tabs/Tabs.stories.js +0 -130
  372. package/dist/tabs/readme.md +0 -78
  373. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  374. package/dist/tabs-for-sections/readme.md +0 -78
  375. package/dist/tag/Tag.js +0 -268
  376. package/dist/textarea/Textarea.js +0 -240
  377. package/dist/toggle/Toggle.stories.js +0 -297
  378. package/dist/toggle/readme.md +0 -80
  379. package/dist/toggle-group/ToggleGroup.js +0 -225
  380. package/dist/toggle-group/readme.md +0 -82
  381. package/dist/upload/Upload.stories.js +0 -72
  382. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -125
  383. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  384. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  385. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -295
  386. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  387. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  388. package/dist/upload/file-upload/FileToUpload.js +0 -164
  389. package/dist/upload/file-upload/audio-icon.svg +0 -4
  390. package/dist/upload/file-upload/close.svg +0 -4
  391. package/dist/upload/file-upload/file-icon.svg +0 -4
  392. package/dist/upload/file-upload/video-icon.svg +0 -4
  393. package/dist/upload/readme.md +0 -37
  394. package/dist/upload/transaction/Transaction.js +0 -154
  395. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  396. package/dist/upload/transaction/audio-icon.svg +0 -4
  397. package/dist/upload/transaction/error-icon.svg +0 -4
  398. package/dist/upload/transaction/file-icon-err.svg +0 -4
  399. package/dist/upload/transaction/file-icon.svg +0 -4
  400. package/dist/upload/transaction/image-icon-err.svg +0 -4
  401. package/dist/upload/transaction/image-icon.svg +0 -4
  402. package/dist/upload/transaction/success-icon.svg +0 -4
  403. package/dist/upload/transaction/video-icon-err.svg +0 -4
  404. package/dist/upload/transaction/video-icon.svg +0 -4
  405. package/dist/upload/transactions/Transactions.js +0 -124
  406. package/dist/wizard/Wizard.js +0 -357
  407. package/dist/wizard/invalid_icon.svg +0 -6
  408. package/dist/wizard/valid_icon.svg +0 -6
  409. package/dist/wizard/validation-wrong.svg +0 -6
  410. package/test/Accordion.test.js +0 -33
  411. package/test/AccordionGroup.test.js +0 -109
  412. package/test/Alert.test.js +0 -53
  413. package/test/Box.test.js +0 -10
  414. package/test/Button.test.js +0 -18
  415. package/test/Card.test.js +0 -30
  416. package/test/Checkbox.test.js +0 -45
  417. package/test/Chip.test.js +0 -25
  418. package/test/Date.test.js +0 -393
  419. package/test/Dialog.test.js +0 -23
  420. package/test/Dropdown.test.js +0 -130
  421. package/test/Footer.test.js +0 -99
  422. package/test/Header.test.js +0 -39
  423. package/test/Heading.test.js +0 -35
  424. package/test/InputText.test.js +0 -240
  425. package/test/Link.test.js +0 -42
  426. package/test/Paginator.test.js +0 -177
  427. package/test/ProgressBar.test.js +0 -35
  428. package/test/Radio.test.js +0 -37
  429. package/test/ResultsetTable.test.js +0 -330
  430. package/test/Select.test.js +0 -192
  431. package/test/Sidenav.test.js +0 -45
  432. package/test/Slider.test.js +0 -82
  433. package/test/Spinner.test.js +0 -27
  434. package/test/Switch.test.js +0 -45
  435. package/test/Table.test.js +0 -36
  436. package/test/Tabs.test.js +0 -109
  437. package/test/TabsForSections.test.js +0 -34
  438. package/test/Tag.test.js +0 -32
  439. package/test/TextArea.test.js +0 -52
  440. package/test/ToggleGroup.test.js +0 -81
  441. package/test/Upload.test.js +0 -60
  442. package/test/Wizard.test.js +0 -130
  443. package/test/mocks/pngMock.js +0 -1
  444. package/test/mocks/svgMock.js +0 -1
@@ -0,0 +1,1612 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
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
+
12
+ var globalTokens = {
13
+ // Color
14
+ inherit: "inherit",
15
+ transparent: "transparent",
16
+ hal_white: "#ffffff",
17
+ hal_grey_l_95: "#f2f2f2",
18
+ hal_grey_l_90: "#e6e6e6",
19
+ hal_grey_l_80: "#cccccc",
20
+ hal_grey_l_75: "#bfbfbf",
21
+ hal_grey_l_60: "#999999",
22
+ hal_grey_s_40: "#666666",
23
+ hal_black: "#000000",
24
+ color_grey_800: "#4d4d4d",
25
+ color_grey_600: "#808080",
26
+ color_grey_50: "#fafafa",
27
+ hal_purple_l_95: "#f2eafa",
28
+ hal_purple_l_90: "#e5d5f6",
29
+ hal_purple_l_65: "#a46ede",
30
+ hal_purple_s_38: "#5f249f",
31
+ hal_purple_d_30: "#4b1c7d",
32
+ hal_purple_d_20: "#321353",
33
+ color_purple_600: "#7D2FD0",
34
+ color_purple_300: "#cbacec",
35
+ hal_blue_l_95: "#e6f4ff",
36
+ hal_blue_l_80: "#99d5ff",
37
+ hal_blue_l_50: "#0095ff",
38
+ hal_blue_l_45: "#0086e6",
39
+ hal_blue_s_35: "#0067b3",
40
+ hal_blue_d_20: "#003c66",
41
+ color_blue_200: "#cceaff",
42
+ color_blue_500: "#33AAFF",
43
+ color_blue_50: "#f5fbff",
44
+ hal_red_l_95: "#ffe6e9",
45
+ hal_red_l_80: "#fe9aa7",
46
+ hal_red_l_60: "#fe344f",
47
+ hal_red_s_41: "#d0011b",
48
+ hal_red_d_30: "#980115",
49
+ hal_red_d_20: "#65010e",
50
+ color_red_700: "#ffccd3",
51
+ color_red_50: "#FFF5F6",
52
+ color_red_600: "#fe0123",
53
+ hal_green_l_95: "#eafaef",
54
+ hal_green_l_80: "#acecbe",
55
+ hal_green_s_39: "#24a148",
56
+ hal_green_d_30: "#1c7d38",
57
+ hal_green_d_20: "#135325",
58
+ hal_yellow_l_95: "#fef9e6",
59
+ hal_yellow_l_80: "#fbe89d",
60
+ hal_yellow_s_57: "#f7cf2b",
61
+ hal_yellow_d_40: "#c59f07",
62
+ hal_yellow_d_30: "#947705",
63
+ hal_orange_s_54: "#f38f20",
64
+ black: "#000000",
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",
79
+ purple: "#6f2c91",
80
+ mediumPurple: "#ead8f3",
81
+ lightPurple: "#f5ebf9",
82
+ lighterPurple: "#d0bddb",
83
+ white: "#ffffff",
84
+ darkGrey: "#666666",
85
+ mediumGrey: "#bfbfbf",
86
+ mediumWhite: "#f9f9f9",
87
+ mediumBlue: "#0067b3",
88
+ softBlue: "#b1cee6",
89
+ darkWhite: "#eeeeee",
90
+ lighterBlack: "#b1b1b1",
91
+ mediumBlack: "#676767",
92
+ mediumGreyBlack: "#dbdbdb",
93
+ lightWhite: "#f2f2f2",
94
+ softGrey: "#cecece",
95
+ softBlack: "#565656",
96
+ // Typography
97
+ type_sans: "Open Sans, sans-serif",
98
+ type_scale_root: "16px",
99
+ type_scale_08: "3.75rem",
100
+ type_scale_07: "2.5rem",
101
+ type_scale_06: "2rem",
102
+ type_scale_05: "1.5rem",
103
+ type_scale_04: "1.25rem",
104
+ type_scale_03: "1rem",
105
+ type_scale_02: "0.875rem",
106
+ type_scale_01: "0.75rem",
107
+ type_light: "300",
108
+ type_regular: "400",
109
+ type_semibold: "600",
110
+ type_bold: "bold",
111
+ type_italic: "italic",
112
+ type_normal: "normal",
113
+ type_spacing_tight_02: "-0.05em",
114
+ type_spacing_tight_01: "-0.025em",
115
+ type_spacing_normal: "0",
116
+ type_spacing_wide_01: "0.025em",
117
+ type_spacing_wide_02: "0.05em",
118
+ type_spacing_wide_03: "0.1em",
119
+ type_initial: "initial",
120
+ type_uppercase: "uppercase",
121
+ type_no_line: "none",
122
+ type_underline: "underline",
123
+ type_line_through: "line-through",
124
+ type_leading_compact_03: "1em",
125
+ type_leading_compact_02: "1.25em",
126
+ type_leading_compact_01: "1.365em",
127
+ type_leading_normal: "1.5em",
128
+ type_leading_loose_01: "1.715em",
129
+ type_leading_loose_02: "2em",
130
+ fontSize10: "10px",
131
+ // Spacing
132
+ spacing_00: "0rem",
133
+ spacing_01: "0.125rem",
134
+ spacing_02: "0.25rem",
135
+ spacing_03: "0.5rem",
136
+ spacing_04: "0.75rem",
137
+ spacing_05: "1rem",
138
+ spacing_06: "1.5rem",
139
+ spacing_07: "2rem",
140
+ spacing_08: "2.5rem",
141
+ spacing_09: "3rem",
142
+ spacing_10: "3.5rem",
143
+ spacing_11: "4rem",
144
+ spacing_12: "5rem",
145
+ spacing_13: "6rem",
146
+ spacing_14: "7rem",
147
+ // Border
148
+ border_width_0: "0px",
149
+ border_width_1: "1px",
150
+ border_width_2: "2px",
151
+ border_width_4: "4px",
152
+ border_radius_none: "0rem",
153
+ border_radius_small: "0.125rem",
154
+ border_radius_medium: "0.25rem",
155
+ border_radius_large: "0.375rem",
156
+ border_radius_full: "9999px",
157
+ border_solid: "solid",
158
+ border_dashed: "dashed",
159
+ border_none: "none"
160
+ };
161
+ exports.globalTokens = globalTokens;
162
+ var componentTokens = {
163
+ accordion: {
164
+ backgroundColor: globalTokens.hal_white,
165
+ disabledBackgroundColor: globalTokens.transparent,
166
+ hoverBackgroundColor: globalTokens.hal_purple_l_95,
167
+ arrowColor: globalTokens.hal_purple_s_38,
168
+ disabledArrowColor: globalTokens.hal_grey_l_60,
169
+ assistiveTextFontFamily: globalTokens.type_sans,
170
+ assistiveTextFontSize: globalTokens.type_scale_03,
171
+ assistiveTextFontWeight: globalTokens.type_light,
172
+ assistiveTextFontStyle: globalTokens.type_italic,
173
+ assistiveTextLetterSpacing: globalTokens.type_spacing_wide_01,
174
+ assistiveTextFontColor: globalTokens.hal_grey_s_40,
175
+ disabledAssistiveTextFontColor: globalTokens.hal_grey_l_60,
176
+ assistiveTextMinWidth: "100px",
177
+ assistiveTextPaddingRight: "24px",
178
+ assistiveTextPaddingLeft: "0px",
179
+ titleLabelFontFamily: globalTokens.type_sans,
180
+ titleLabelFontSize: globalTokens.type_scale_03,
181
+ titleLabelFontWeight: globalTokens.type_regular,
182
+ titleLabelFontStyle: globalTokens.type_normal,
183
+ titleLabelFontColor: globalTokens.hal_black,
184
+ disabledTitleLabelFontColor: globalTokens.hal_grey_l_60,
185
+ titleLabelPaddingLeft: "0px",
186
+ titleLabelPaddingRight: "16px",
187
+ titleLabelPaddingTop: "0px",
188
+ titleLabelPaddingBottom: "0px",
189
+ focusBorderStyle: "solid",
190
+ focusBorderThickness: "2px",
191
+ focusBorderColor: globalTokens.hal_blue_l_50,
192
+ borderRadius: "4px",
193
+ boxShadowOffsetX: "0px",
194
+ boxShadowOffsetY: "6px",
195
+ boxShadowBlur: "10px",
196
+ boxShadowColor: "#0000001a",
197
+ iconColor: globalTokens.hal_purple_s_38,
198
+ disabledIconColor: globalTokens.hal_grey_l_60,
199
+ iconSize: "24px",
200
+ iconMarginLeft: "0px",
201
+ iconMarginRigth: "12px",
202
+ accordionGroupSeparatorBorderColor: "#0000001a",
203
+ accordionGroupSeparatorBorderThickness: "1px",
204
+ accordionGroupSeparatorBorderRadius: "0px",
205
+ accordionGroupSeparatorBorderStyle: "solid"
206
+ },
207
+ alert: {
208
+ titleFontFamily: globalTokens.type_sans,
209
+ titleFontColor: globalTokens.hal_black,
210
+ titleFontSize: globalTokens.type_scale_01,
211
+ titleFontStyle: globalTokens.type_normal,
212
+ titleFontWeight: globalTokens.type_bold,
213
+ titleTextTransform: globalTokens.type_uppercase,
214
+ titlePaddingRight: "0px",
215
+ titlePaddingLeft: "0px",
216
+ inlineTextFontFamily: globalTokens.type_sans,
217
+ inlineTextFontColor: globalTokens.hal_black,
218
+ inlineTextFontSize: globalTokens.type_scale_01,
219
+ inlineTextFontStyle: globalTokens.type_normal,
220
+ inlineTextFontWeight: globalTokens.type_regular,
221
+ inlineTextPaddingLeft: "0px",
222
+ inlineTextPaddingRight: "0px",
223
+ contentPaddingLeft: "0px",
224
+ contentPaddingRight: "0px",
225
+ contentPaddingTop: "20px",
226
+ contentPaddingBottom: "30px",
227
+ borderRadius: "4px",
228
+ borderStyle: "solid",
229
+ borderThickness: "1px",
230
+ infoBorderColor: globalTokens.hal_blue_s_35,
231
+ successBorderColor: globalTokens.hal_green_s_39,
232
+ warningBorderColor: globalTokens.hal_yellow_d_40,
233
+ errorBorderColor: globalTokens.hal_red_s_41,
234
+ iconSize: "24px",
235
+ iconPaddingLeft: "0px",
236
+ iconPaddingRight: "0px",
237
+ infoIconColor: globalTokens.hal_blue_s_35,
238
+ successIconColor: globalTokens.hal_green_s_39,
239
+ warningIconColor: globalTokens.hal_yellow_d_40,
240
+ errorIconColor: globalTokens.hal_red_s_41,
241
+ infoBackgroundColor: globalTokens.hal_blue_l_95,
242
+ successBackgroundColor: globalTokens.hal_green_l_95,
243
+ warningBackgroundColor: globalTokens.hal_yellow_l_95,
244
+ errorBackgroundColor: globalTokens.hal_red_l_95,
245
+ hoverActionBackgroundColor: "#0000000D",
246
+ activeActionBackgroundColor: "#0000001A",
247
+ focusActionBorderColor: globalTokens.hal_blue_l_50,
248
+ overlayColor: "#000000B3"
249
+ },
250
+ box: {
251
+ backgroundColor: globalTokens.white,
252
+ letterSpacing: globalTokens.type_spacing_wide_01,
253
+ borderRadius: "4px",
254
+ borderThickness: "0px",
255
+ borderStyle: "none",
256
+ borderColor: globalTokens.transparent,
257
+ noneShadowDepthShadowOffsetX: "none",
258
+ noneShadowDepthShadowOffsetY: "none",
259
+ noneShadowDepthShadowBlur: "none",
260
+ noneShadowDepthShadowSpread: "none",
261
+ noneShadowDepthShadowColor: globalTokens.transparent,
262
+ oneShadowDepthShadowOffsetX: "0px",
263
+ oneShadowDepthShadowOffsetY: "3px",
264
+ oneShadowDepthShadowBlur: "6px",
265
+ oneShadowDepthShadowSpread: "0px",
266
+ oneShadowDepthShadowColor: "#00000033",
267
+ twoShadowDepthShadowOffsetX: "0px",
268
+ twoShadowDepthShadowOffsetY: "3px",
269
+ twoShadowDepthShadowBlur: "10px",
270
+ twoShadowDepthShadowSpread: "0px",
271
+ twoShadowDepthShadowColor: "#00000033"
272
+ },
273
+ button: {
274
+ labelFontLineHeight: globalTokens.type_leading_normal,
275
+ labelLetterSpacing: globalTokens.type_spacing_wide_01,
276
+ paddingLeft: globalTokens.spacing_03,
277
+ paddingRight: globalTokens.spacing_03,
278
+ paddingTop: globalTokens.spacing_03,
279
+ paddingBottom: globalTokens.spacing_03,
280
+ focusBorderColor: globalTokens.hal_blue_l_50,
281
+ focusBorderColorOnDark: globalTokens.hal_blue_l_50,
282
+ primaryBackgroundColor: globalTokens.hal_purple_s_38,
283
+ primaryBackgroundColorOnDark: globalTokens.hal_purple_s_38,
284
+ primaryFontColor: globalTokens.hal_white,
285
+ primaryFontColorOnDark: globalTokens.hal_white,
286
+ primaryHoverBackgroundColor: globalTokens.hal_purple_d_30,
287
+ primaryHoverBackgroundColorOnDark: globalTokens.color_purple_600,
288
+ primaryActiveBackgroundColor: globalTokens.hal_purple_d_20,
289
+ primaryActiveBackgroundColorOnDark: globalTokens.hal_purple_d_30,
290
+ primaryDisabledBackgroundColor: globalTokens.hal_grey_l_95,
291
+ primaryDisabledBackgroundColorOnDark: globalTokens.color_grey_800,
292
+ primaryDisabledFontColor: globalTokens.hal_grey_l_60,
293
+ primaryDisabledFontColorOnDark: globalTokens.hal_grey_l_60,
294
+ primaryBorderThickness: globalTokens.border_width_0,
295
+ primaryBorderStyle: globalTokens.border_none,
296
+ primaryBorderRadius: globalTokens.border_radius_medium,
297
+ primaryFontFamily: globalTokens.type_sans,
298
+ primaryFontSize: globalTokens.type_scale_03,
299
+ primaryFontWeight: globalTokens.type_regular,
300
+ secondaryBackgroundColor: globalTokens.transparent,
301
+ secondaryBackgroundColorOnDark: globalTokens.transparent,
302
+ secondaryFontColor: globalTokens.hal_purple_s_38,
303
+ secondaryFontColorOnDark: globalTokens.hal_white,
304
+ secondaryHoverFontColor: globalTokens.hal_white,
305
+ secondaryHoverFontColorOnDark: globalTokens.hal_black,
306
+ secondaryBorderColor: globalTokens.hal_purple_s_38,
307
+ secondaryBorderColorOnDark: globalTokens.hal_white,
308
+ secondaryHoverBackgroundColor: globalTokens.hal_purple_s_38,
309
+ secondaryHoverBackgroundColorOnDark: globalTokens.hal_white,
310
+ secondaryActiveBackgroundColor: globalTokens.hal_purple_d_20,
311
+ secondaryActiveBackgroundColorOnDark: globalTokens.hal_grey_l_90,
312
+ secondaryDisabledBackgroundColor: globalTokens.transparent,
313
+ secondaryDisabledBackgroundColorOnDark: globalTokens.transparent,
314
+ secondaryDisabledFontColor: globalTokens.lighterBlack,
315
+ secondaryDisabledFontColorOnDark: globalTokens.hal_grey_l_60,
316
+ secondaryDisabledBorderColor: globalTokens.hal_grey_l_60,
317
+ secondaryDisabledBorderColorOnDark: globalTokens.hal_grey_l_60,
318
+ secondaryBorderThickness: globalTokens.border_width_1,
319
+ secondaryBorderStyle: globalTokens.border_solid,
320
+ secondaryBorderRadius: globalTokens.border_radius_medium,
321
+ secondaryFontFamily: globalTokens.type_sans,
322
+ secondaryFontSize: globalTokens.type_scale_03,
323
+ secondaryFontWeight: globalTokens.type_regular,
324
+ textBackgroundColor: globalTokens.transparent,
325
+ textBackgroundColorOnDark: globalTokens.transparent,
326
+ textFontColor: globalTokens.hal_purple_s_38,
327
+ textFontColorOnDark: globalTokens.hal_white,
328
+ textHoverBackgroundColor: globalTokens.hal_purple_l_95,
329
+ textHoverBackgroundColorOnDark: globalTokens.color_grey_800,
330
+ textActiveBackgroundColor: globalTokens.hal_purple_l_90,
331
+ textActiveBackgroundColorOnDark: globalTokens.hal_grey_s_40,
332
+ textDisabledBackgroundColor: globalTokens.transparent,
333
+ textDisabledBackgroundColorOnDark: globalTokens.transparent,
334
+ textDisabledFontColor: globalTokens.hal_grey_l_60,
335
+ textDisabledFontColorOnDark: globalTokens.hal_grey_l_60,
336
+ textBorderThickness: globalTokens.border_width_0,
337
+ textBorderStyle: globalTokens.border_none,
338
+ textBorderRadius: globalTokens.border_radius_medium,
339
+ textFontFamily: globalTokens.type_sans,
340
+ textFontSize: globalTokens.type_scale_03,
341
+ textFontWeight: globalTokens.type_regular
342
+ },
343
+ card: {
344
+ height: "220px",
345
+ width: "400px"
346
+ },
347
+ checkbox: {
348
+ backgroundColorChecked: globalTokens.hal_blue_s_35,
349
+ backgroundColorCheckedOnDark: globalTokens.hal_grey_l_90,
350
+ hoverBackgroundColorChecked: globalTokens.hal_blue_d_20,
351
+ hoverBackgroundColorCheckedOnDark: global.hal_white,
352
+ disabledBackgroundColorChecked: globalTokens.hal_grey_l_60,
353
+ disabledBackgroundColorCheckedOnDark: globalTokens.color_grey_800,
354
+ borderColor: globalTokens.hal_blue_s_35,
355
+ borderColorOnDark: globalTokens.hal_grey_l_90,
356
+ hoverBorderColor: globalTokens.hal_blue_d_20,
357
+ hoverBorderColorOnDark: globalTokens.hal_white,
358
+ disabledBorderColor: globalTokens.hal_grey_l_60,
359
+ disabledBorderColorOnDark: globalTokens.color_grey_800,
360
+ checkColor: globalTokens.hal_white,
361
+ checkColorOnDark: globalTokens.hal_black,
362
+ disabledCheckColor: globalTokens.hal_white,
363
+ disabledCheckColorOnDark: globalTokens.hal_grey_l_60,
364
+ fontFamily: globalTokens.type_sans,
365
+ fontSize: globalTokens.type_scale_02,
366
+ fontWeight: globalTokens.type_regular,
367
+ fontColor: globalTokens.hal_black,
368
+ fontColorOnDark: globalTokens.hal_white,
369
+ disabledFontColor: globalTokens.hal_grey_l_60,
370
+ disabledFontColorOnDark: globalTokens.hal_grey_l_60,
371
+ focusColor: globalTokens.hal_blue_l_50,
372
+ focusColorOnDark: globalTokens.hal_blue_l_50,
373
+ checkLabelSpacing: "8px"
374
+ },
375
+ chip: {
376
+ backgroundColor: globalTokens.hal_grey_l_90,
377
+ disabledBackgroundColor: globalTokens.hal_grey_l_95,
378
+ fontFamily: globalTokens.type_sans,
379
+ fontSize: globalTokens.type_scale_03,
380
+ fontStyle: globalTokens.type_normal,
381
+ fontWeight: globalTokens.type_regular,
382
+ fontColor: globalTokens.hal_black,
383
+ disabledFontColor: globalTokens.hal_grey_l_60,
384
+ borderColor: globalTokens.transparent,
385
+ borderRadius: "80px",
386
+ borderThickness: "0px",
387
+ borderStyle: "solid",
388
+ contentPaddingLeft: "16px",
389
+ contentPaddingRight: "16px",
390
+ contentPaddingTop: "0px",
391
+ contentPaddingBottom: "0px",
392
+ iconSize: "24px",
393
+ iconSpacing: "8px",
394
+ iconColor: globalTokens.hal_black,
395
+ 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
+ focusColor: globalTokens.hal_blue_l_50,
411
+ fontFamily: globalTokens.type_sans,
412
+ pickerHeight: "316px",
413
+ pickerWidth: "290px"
414
+ },
415
+ dateInput: {
416
+ pickerFontFamily: globalTokens.type_sans,
417
+ 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,
428
+ pickerFocusColor: globalTokens.hal_blue_l_50,
429
+ pickerHeight: "316px",
430
+ pickerWidth: "290px"
431
+ },
432
+ dialog: {
433
+ overlayColor: globalTokens.hal_black,
434
+ backgroundColor: globalTokens.hal_white,
435
+ closeIconWidth: "24px",
436
+ closeIconHeight: "24px",
437
+ closeIconTopPosition: "20px",
438
+ closeIconRightPosition: "20px",
439
+ closeIconBackgroundColor: "none",
440
+ closeIconBorderColor: "none",
441
+ closeIconColor: globalTokens.hal_black,
442
+ closeIconBorderThickness: "0px",
443
+ closeIconBorderStyle: "solid",
444
+ closeIconBorderRadius: "0px",
445
+ boxShadowOffsetX: "0px",
446
+ boxShadowOffsetY: "1px",
447
+ boxShadowBlur: "3px",
448
+ boxShadowColor: "rgba(0, 0, 0, 0.2)",
449
+ overlayOpacity: "0.7"
450
+ },
451
+ dropdown: {
452
+ buttonBackgroundColor: globalTokens.hal_white,
453
+ hoverButtonBackgroundColor: globalTokens.hal_grey_l_95,
454
+ activeButtonBackgroundColor: globalTokens.lightGrey,
455
+ buttonFontFamily: globalTokens.type_sans,
456
+ buttonFontSize: globalTokens.type_scale_03,
457
+ buttonFontStyle: globalTokens.type_normal,
458
+ buttonFontWeight: globalTokens.type_regular,
459
+ buttonFontColor: globalTokens.hal_black,
460
+ buttonIconSize: "20px",
461
+ buttonIconSpacing: "10px",
462
+ buttonIconColor: globalTokens.hal_black,
463
+ buttonPaddingTop: "0px",
464
+ buttonPaddingBottom: "0px",
465
+ buttonPaddingLeft: "16px",
466
+ buttonPaddingRight: "16px",
467
+ disabledColor: globalTokens.lighterBlack,
468
+ disabledButtonBackgroundColor: globalTokens.transparent,
469
+ disabledBorderColor: globalTokens.lighterBlack,
470
+ optionBackgroundColor: globalTokens.hal_white,
471
+ hoverOptionBackgroundColor: globalTokens.hal_grey_l_95,
472
+ activeOptionBackgroundColor: globalTokens.lightGrey,
473
+ optionFontFamily: globalTokens.type_sans,
474
+ optionFontSize: globalTokens.type_scale_root,
475
+ optionFontStyle: globalTokens.type_normal,
476
+ optionFontWeight: globalTokens.type_regular,
477
+ optionFontColor: globalTokens.hal_black,
478
+ optionIconSize: "20px",
479
+ optionIconSpacing: "10px",
480
+ optionIconColor: globalTokens.hal_black,
481
+ optionPaddingTop: "6px",
482
+ optionPaddingBottom: "6px",
483
+ optionPaddingLeft: "16px",
484
+ optionPaddingRight: "16px",
485
+ caretIconSize: "24px",
486
+ caretIconColor: globalTokens.hal_black,
487
+ caretIconSpacing: "12px",
488
+ borderRadius: "4px",
489
+ borderStyle: "none",
490
+ borderThickness: "0px",
491
+ borderColor: globalTokens.transparent,
492
+ scrollBarThumbColor: globalTokens.hal_grey_s_40,
493
+ scrollBarTrackColor: globalTokens.lightGrey,
494
+ focusColor: globalTokens.hal_blue_l_50
495
+ },
496
+ fileInput: {
497
+ dropBorderColor: globalTokens.hal_black,
498
+ fileItemBorderColor: globalTokens.hal_grey_l_80,
499
+ fileNameFontColor: globalTokens.hal_black,
500
+ labelFontColor: globalTokens.hal_black,
501
+ helperTextFontColor: globalTokens.hal_black,
502
+ dropLabelFontColor: globalTokens.hal_black,
503
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
504
+ disabledHelperTextFontcolor: globalTokens.hal_grey_l_60,
505
+ disabledDropLabelFontColor: globalTokens.hal_grey_l_60,
506
+ focusDropBorderColor: globalTokens.hal_blue_l_50,
507
+ disabledDropBorderColor: globalTokens.hal_grey_l_60,
508
+ dragoverDropBackgroundColor: globalTokens.color_blue_50,
509
+ hoverFileItemIconBackgroundColor: globalTokens.hal_grey_l_95,
510
+ activeFileItemIconBackgrounColor: globalTokens.hal_grey_l_80,
511
+ errorFileItemBorderColor: globalTokens.hal_red_s_41,
512
+ errorFileItemBackgroundColor: globalTokens.color_red_50,
513
+ errorFileItemIconBackgroundColor: globalTokens.color_red_700,
514
+ errorFileItemIconColor: globalTokens.hal_red_s_41,
515
+ fileItemIconBackgroundColor: globalTokens.hal_grey_l_95,
516
+ fileItemIconColor: globalTokens.color_grey_600,
517
+ errorMessageFontColor: globalTokens.hal_red_s_41,
518
+ labelFontFamily: globalTokens.type_sans,
519
+ labelFontSize: globalTokens.type_scale_02,
520
+ labelFontWeight: globalTokens.type_semibold,
521
+ labelLineHeight: globalTokens.type_leading_loose_01,
522
+ fileItemFontFamily: globalTokens.type_sans,
523
+ fileItemFontSize: globalTokens.type_scale_02,
524
+ fileItemFontWeight: globalTokens.type_regular,
525
+ fileItemLineHeight: globalTokens.type_leading_normal,
526
+ helperTextFontFamily: globalTokens.type_sans,
527
+ helperTextFontSize: globalTokens.type_scale_01,
528
+ helperTextFontWeight: globalTokens.type_regular,
529
+ helperTextLineHeight: globalTokens.type_leading_normal,
530
+ dropLabelFontFamily: globalTokens.type_sans,
531
+ dropLabelFontSize: globalTokens.type_scale_03,
532
+ dropLabelFontWeight: globalTokens.type_regular,
533
+ errorMessageFontFamily: globalTokens.type_sans,
534
+ errorMessageFontSize: globalTokens.type_scale_01,
535
+ errorMessageFontWeight: globalTokens.type_regular,
536
+ errorMessageLineHeight: globalTokens.type_leading_normal,
537
+ dropBorderThickness: globalTokens.border_width_1,
538
+ dropBorderStyle: globalTokens.border_dashed,
539
+ dropBorderRadius: globalTokens.border_radius_large,
540
+ fileItemBorderThickness: globalTokens.border_width_1,
541
+ fileItemBorderStyle: globalTokens.border_solid,
542
+ fileItemBorderRadius: globalTokens.border_radius_medium,
543
+ hoverDeleteFileItemBackgroundColor: "#0000000d",
544
+ activeDeleteFileItemBackgroundColor: "#00000033",
545
+ focusActionBorderColor: globalTokens.hal_blue_l_50
546
+ },
547
+ footer: {
548
+ height: "124px",
549
+ backgroundColor: globalTokens.hal_black,
550
+ bottomLinksDividerColor: globalTokens.hal_blue_l_50,
551
+ bottomLinksDividerThickness: "1px",
552
+ bottomLinksDividerStyle: "solid",
553
+ bottomLinksDividerSpacing: "8px",
554
+ bottomLinksFontFamily: globalTokens.type_sans,
555
+ bottomLinksFontSize: globalTokens.type_scale_01,
556
+ bottomLinksFontStyle: globalTokens.type_normal,
557
+ bottomLinksFontWeight: globalTokens.type_regular,
558
+ bottomLinksFontColor: globalTokens.hal_white,
559
+ bottomLinksTextDecoration: globalTokens.type_no_line,
560
+ copyrightFontFamily: globalTokens.type_sans,
561
+ copyrightFontSize: globalTokens.type_scale_01,
562
+ copyrightFontStyle: globalTokens.type_normal,
563
+ copyrightFontWeight: globalTokens.type_regular,
564
+ copyrightFontColor: globalTokens.hal_white,
565
+ logo: "",
566
+ logoHeight: "32px",
567
+ logoWidth: "auto",
568
+ socialLinksSize: "24px",
569
+ socialLinksGutter: "16px",
570
+ socialLinksColor: globalTokens.hal_white
571
+ },
572
+ header: {
573
+ backgroundColor: globalTokens.hal_white,
574
+ hamburguerFocusColor: globalTokens.hal_blue_l_50,
575
+ hamburguerFontFamily: globalTokens.type_sans,
576
+ hamburguerFontStyle: globalTokens.type_normal,
577
+ hamburguerFontColor: globalTokens.hal_black,
578
+ hamburguerFontSize: "10px",
579
+ hamburguerFontWeight: globalTokens.type_semibold,
580
+ hamburguerTextTransform: globalTokens.type_uppercase,
581
+ hamburguerIconColor: globalTokens.hal_black,
582
+ hamburguerHoverColor: globalTokens.mediumGreyBlack,
583
+ logo: "",
584
+ logoResponsive: "",
585
+ logoHeight: "40px",
586
+ logoWidth: "auto",
587
+ menuBackgroundColor: globalTokens.hal_white,
588
+ menuZindex: "2000",
589
+ menuTabletWidth: "60vw",
590
+ menuMobileWidth: "100vw",
591
+ minHeight: "64px",
592
+ overlayColor: globalTokens.softBlack,
593
+ overlayOpacity: "0.7",
594
+ overlayZindex: "1600",
595
+ paddingTop: "0px",
596
+ paddingBottom: "0px",
597
+ paddingRight: "24px",
598
+ paddingLeft: "24px",
599
+ underlinedColor: globalTokens.hal_black,
600
+ underlinedThickness: "2px",
601
+ underlinedStyle: "solid",
602
+ contentColor: globalTokens.hal_black,
603
+ contentColorOnDark: globalTokens.hal_white
604
+ },
605
+ heading: {
606
+ level1FontColor: globalTokens.inherit,
607
+ level1FontFamily: globalTokens.type_sans,
608
+ level1FontSize: globalTokens.type_scale_07,
609
+ level1FontStyle: globalTokens.type_normal,
610
+ level1FontWeight: globalTokens.type_semibold,
611
+ level1LineHeight: globalTokens.type_leading_compact_01,
612
+ level1LetterSpacing: globalTokens.type_spacing_tight_01,
613
+ level2FontColor: globalTokens.inherit,
614
+ level2FontFamily: globalTokens.type_sans,
615
+ level2FontSize: globalTokens.type_scale_05,
616
+ level2FontStyle: globalTokens.type_normal,
617
+ level2FontWeight: globalTokens.type_semibold,
618
+ level2LineHeight: globalTokens.type_leading_normal,
619
+ level2LetterSpacing: globalTokens.type_spacing_normal,
620
+ level3FontColor: globalTokens.inherit,
621
+ level3FontFamily: globalTokens.type_sans,
622
+ level3FontSize: globalTokens.type_scale_04,
623
+ level3FontStyle: globalTokens.type_normal,
624
+ level3FontWeight: globalTokens.type_semibold,
625
+ level3LineHeight: globalTokens.type_leading_compact_01,
626
+ level3LetterSpacing: globalTokens.type_spacing_wide_01,
627
+ level4FontColor: globalTokens.inherit,
628
+ level4FontFamily: globalTokens.type_sans,
629
+ level4FontSize: globalTokens.type_scale_03,
630
+ level4FontStyle: globalTokens.type_normal,
631
+ level4FontWeight: globalTokens.type_semibold,
632
+ level4LineHeight: globalTokens.type_leading_normal,
633
+ level4LetterSpacing: globalTokens.type_spacing_normal,
634
+ level5FontColor: globalTokens.inherit,
635
+ level5FontFamily: globalTokens.type_sans,
636
+ level5FontSize: globalTokens.type_scale_02,
637
+ level5FontStyle: globalTokens.type_normal,
638
+ level5FontWeight: globalTokens.type_semibold,
639
+ level5LineHeight: globalTokens.type_leading_normal,
640
+ level5LetterSpacing: globalTokens.type_spacing_wide_01
641
+ },
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
+ link: {
795
+ fontColor: globalTokens.hal_blue_s_35,
796
+ fontFamily: globalTokens.inherit,
797
+ fontSize: globalTokens.type_scale_root,
798
+ fontStyle: globalTokens.type_normal,
799
+ fontWeight: globalTokens.type_regular,
800
+ iconSize: "16px",
801
+ iconSpacing: "4px",
802
+ underlineSpacing: "0px",
803
+ underlineStyle: "solid",
804
+ underlineThickness: "1px",
805
+ disabledColor: globalTokens.lightGrey,
806
+ hoverFontColor: globalTokens.hal_blue_s_35,
807
+ hoverUnderlineColor: globalTokens.hal_blue_s_35,
808
+ visitedFontColor: globalTokens.purple,
809
+ visitedUnderlineColor: globalTokens.purple,
810
+ activeFontColor: globalTokens.black,
811
+ activeUnderlineColor: globalTokens.black,
812
+ focusColor: globalTokens.hal_blue_l_50
813
+ },
814
+ paginator: {
815
+ backgroundColor: globalTokens.darkWhite,
816
+ fontColor: globalTokens.hal_black,
817
+ fontFamily: globalTokens.type_sans,
818
+ fontSize: globalTokens.type_scale_02,
819
+ fontStyle: globalTokens.type_normal,
820
+ fontWeight: globalTokens.type_regular,
821
+ fontTextTransform: "none",
822
+ height: "64px",
823
+ width: "100%",
824
+ marginRight: "40px",
825
+ marginLeft: "20px",
826
+ itemsPerPageSelectorMarginLeft: "0px",
827
+ itemsPerPageSelectorMarginRight: "30px",
828
+ pageSelectorMarginRight: "30px",
829
+ pageSelectorMarginLeft: "0px",
830
+ totalItemsContainerMarginRight: "30px",
831
+ totalItemsContainerMarginLeft: "0px"
832
+ },
833
+ progressBar: {
834
+ trackLineColor: globalTokens.hal_purple_s_38,
835
+ trackLineColorOnDark: globalTokens.hal_purple_l_65,
836
+ totalLineColor: globalTokens.softGrey,
837
+ labelFontFamily: globalTokens.type_sans,
838
+ labelFontSize: globalTokens.type_scale_01,
839
+ labelFontStyle: globalTokens.type_normal,
840
+ labelFontWeight: globalTokens.type_regular,
841
+ labelFontColor: globalTokens.black,
842
+ labelFontColorOnDark: globalTokens.hal_white,
843
+ labelFontTextTransform: globalTokens.type_uppercase,
844
+ valueFontFamily: globalTokens.type_sans,
845
+ valueFontSize: globalTokens.type_scale_01,
846
+ valueFontStyle: globalTokens.type_normal,
847
+ valueFontWeight: globalTokens.type_regular,
848
+ valueFontColor: globalTokens.black,
849
+ valueFontColorOnDark: globalTokens.hal_white,
850
+ valueFontTextTransform: globalTokens.type_uppercase,
851
+ helperTextFontColor: globalTokens.black,
852
+ helperTextFontColorOnDark: globalTokens.hal_white,
853
+ helperTextFontSize: globalTokens.type_scale_01,
854
+ helperTextFontStyle: globalTokens.type_normal,
855
+ helperTextFontWeight: globalTokens.type_regular,
856
+ helperTextFontFamily: globalTokens.type_sans,
857
+ thickness: "9px",
858
+ borderRadius: "5px",
859
+ overlayColor: globalTokens.black,
860
+ overlayOpacity: "0.8"
861
+ },
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,
875
+ fontFamily: globalTokens.type_sans,
876
+ fontSize: globalTokens.type_scale_root,
877
+ fontStyle: globalTokens.type_normal,
878
+ fontWeight: globalTokens.type_regular
879
+ },
880
+ radioGroup: {
881
+ fontFamily: globalTokens.type_sans,
882
+ radioInputColor: globalTokens.hal_blue_l_45,
883
+ hoverRadioInputColor: globalTokens.hal_blue_s_35,
884
+ focusBorderColor: globalTokens.hal_blue_l_50,
885
+ activeRadioInputColor: globalTokens.hal_blue_d_20,
886
+ errorRadioInputColor: globalTokens.hal_red_s_41,
887
+ hoverErrorRadioInputColor: globalTokens.hal_red_d_30,
888
+ activeErrorRadioInputColor: globalTokens.hal_red_d_20,
889
+ readonlyRadioInputColor: globalTokens.hal_grey_l_60,
890
+ hoverReadonlyRadioInputColor: globalTokens.color_grey_600,
891
+ activeReadonlyRadioInputColor: globalTokens.hal_grey_s_40,
892
+ disabledRadioInputColor: globalTokens.hal_grey_l_60,
893
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
894
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
895
+ disabledRadioInputLabelFontColor: globalTokens.hal_grey_l_60,
896
+ errorMessageColor: globalTokens.hal_red_s_41,
897
+ labelFontColor: globalTokens.hal_black,
898
+ labelFontSize: globalTokens.type_scale_02,
899
+ labelFontStyle: globalTokens.type_normal,
900
+ labelFontWeight: globalTokens.type_semibold,
901
+ labelLineHeight: globalTokens.type_leading_loose_01,
902
+ optionalLabelFontWeight: globalTokens.type_regular,
903
+ helperTextFontColor: globalTokens.hal_black,
904
+ helperTextFontSize: globalTokens.type_scale_01,
905
+ helperTextFontStyle: globalTokens.type_normal,
906
+ helperTextFontWeight: globalTokens.type_regular,
907
+ helperTextLineHeight: globalTokens.type_leading_normal,
908
+ radioInputLabelFontColor: globalTokens.hal_black,
909
+ radioInputLabelFontSize: globalTokens.type_scale_02,
910
+ radioInputLabelFontStyle: globalTokens.type_normal,
911
+ radioInputLabelFontWeight: globalTokens.type_regular,
912
+ radioInputLabelLineHeight: globalTokens.type_leading_loose_01,
913
+ groupLabelMargin: globalTokens.spacing_03,
914
+ radioInputLabelMargin: globalTokens.spacing_03,
915
+ groupVerticalGutter: globalTokens.spacing_02,
916
+ groupHorizontalGutter: globalTokens.spacing_07
917
+ },
918
+ select: {
919
+ fontFamily: globalTokens.type_sans,
920
+ disabledColor: globalTokens.hal_grey_l_60,
921
+ enabledInputBorderColor: globalTokens.hal_black,
922
+ hoverInputBorderColor: globalTokens.hal_purple_l_65,
923
+ focusInputBorderColor: globalTokens.hal_blue_l_50,
924
+ errorInputBorderColor: globalTokens.hal_red_s_41,
925
+ hoverInputErrorBorderColor: globalTokens.color_red_600,
926
+ disabledInputBorderColor: globalTokens.hal_grey_l_60,
927
+ disabledInputBackgroundColor: globalTokens.hal_grey_l_95,
928
+ inputMarginTop: globalTokens.spacing_02,
929
+ inputMarginBottom: globalTokens.spacing_02,
930
+ errorMessageColor: globalTokens.hal_red_s_41,
931
+ errorIconColor: globalTokens.hal_red_s_41,
932
+ labelFontColor: globalTokens.hal_black,
933
+ labelFontSize: globalTokens.type_scale_02,
934
+ labelFontStyle: globalTokens.type_normal,
935
+ labelFontWeight: globalTokens.type_semibold,
936
+ labelLineHeight: globalTokens.type_leading_loose_01,
937
+ optionalLabelFontWeight: globalTokens.type_regular,
938
+ helperTextFontColor: globalTokens.hal_black,
939
+ helperTextFontSize: globalTokens.type_scale_01,
940
+ helperTextFontStyle: globalTokens.type_normal,
941
+ helperTextFontWeight: globalTokens.type_regular,
942
+ helperTextLineHeight: globalTokens.type_leading_normal,
943
+ placeholderFontColor: "#000000b3",
944
+ valueFontColor: globalTokens.hal_black,
945
+ valueFontSize: globalTokens.type_scale_03,
946
+ valueFontStyle: globalTokens.type_normal,
947
+ valueFontWeight: globalTokens.type_regular,
948
+ actionIconColor: globalTokens.hal_black,
949
+ hoverActionIconColor: globalTokens.hal_black,
950
+ activeActionIconColor: globalTokens.hal_black,
951
+ actionBackgroundColor: globalTokens.transparent,
952
+ hoverActionBackgroundColor: globalTokens.hal_grey_l_95,
953
+ activeActionBackgroundColor: globalTokens.hal_grey_l_80,
954
+ listOptionFontColor: globalTokens.hal_black,
955
+ listOptionFontSize: globalTokens.type_scale_02,
956
+ listOptionFontStyle: globalTokens.type_normal,
957
+ listOptionFontWeight: globalTokens.type_regular,
958
+ listOptionIconColor: globalTokens.hal_black,
959
+ listOptionDividerColor: globalTokens.hal_grey_l_90,
960
+ listGroupLabelFontWeight: globalTokens.type_semibold,
961
+ focusListOptionBorderColor: globalTokens.hal_blue_l_50,
962
+ systemMessageFontColor: globalTokens.hal_grey_s_40,
963
+ collapseIndicatorColor: globalTokens.hal_black,
964
+ listDialogBackgroundColor: globalTokens.hal_white,
965
+ listDialogBorderColor: globalTokens.hal_grey_l_75,
966
+ selectedListOptionBackgroundColor: globalTokens.hal_blue_l_95,
967
+ selectedHoverListOptionBackgroundColor: globalTokens.color_blue_200,
968
+ selectedActiveListOptionBackgroundColor: globalTokens.hal_blue_l_80,
969
+ selectedListOptionIconColor: globalTokens.hal_blue_d_20,
970
+ unselectedHoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
971
+ unselectedActiveListOptionBackgroundColor: globalTokens.hal_grey_l_90,
972
+ selectionIndicatorFontColor: globalTokens.hal_black,
973
+ selectionIndicatorFontSize: globalTokens.type_scale_01,
974
+ selectionIndicatorFontStyle: globalTokens.type_regular,
975
+ selectionIndicatorFontWeight: globalTokens.type_normal,
976
+ selectionIndicatorBorderColor: globalTokens.hal_grey_l_75,
977
+ selectionIndicatorBackgroundColor: globalTokens.color_grey_50,
978
+ enabledSelectionIndicatorActionBackgroundColor: globalTokens.transparent,
979
+ enabledSelectionIndicatorActionIconColor: globalTokens.hal_black,
980
+ hoverSelectionIndicatorActionBackgroundColor: globalTokens.hal_grey_l_95,
981
+ hoverSelectionIndicatorActionIconColor: globalTokens.hal_black,
982
+ activeSelectionIndicatorActionBackgroundColor: globalTokens.hal_grey_l_80,
983
+ activeSelectionIndicatorActionIconColor: globalTokens.hal_black
984
+ },
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
+ sidenav: {
1045
+ backgroundColor: globalTokens.hal_grey_l_95,
1046
+ arrowContainerColor: globalTokens.hal_grey_l_90,
1047
+ arrowColor: globalTokens.hal_black,
1048
+ titleFontFamily: globalTokens.type_sans,
1049
+ titleFontSize: globalTokens.type_scale_05,
1050
+ titleFontStyle: globalTokens.type_normal,
1051
+ titleFontWeight: globalTokens.type_regular,
1052
+ titleFontColor: globalTokens.hal_black,
1053
+ titleFontTextTransform: "none",
1054
+ 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,
1062
+ linkFontFamily: globalTokens.type_sans,
1063
+ linkFontSize: globalTokens.type_scale_02,
1064
+ linkFontStyle: globalTokens.type_normal,
1065
+ linkFontWeight: globalTokens.type_regular,
1066
+ linkFontColor: globalTokens.color_grey_800,
1067
+ linkFontTextTransform: "none",
1068
+ linkFontLetterSpacing: globalTokens.type_spacing_wide_01,
1069
+ linkTextDecoration: globalTokens.type_no_line,
1070
+ linkMarginTop: "4px",
1071
+ linkMarginBottom: "4px",
1072
+ linkMarginRight: "16px",
1073
+ linkMarginLeft: "16px",
1074
+ linkFocusColor: globalTokens.hal_blue_l_50,
1075
+ scrollBarThumbColor: "#66666626",
1076
+ scrollBarTrackColor: globalTokens.transparent
1077
+ },
1078
+ slider: {
1079
+ fontFamily: globalTokens.type_sans,
1080
+ limitValuesFontColor: globalTokens.hal_black,
1081
+ limitValuesFontColorOnDark: globalTokens.hal_white,
1082
+ limitValuesFontSize: globalTokens.type_scale_03,
1083
+ limitValuesFontStyle: globalTokens.type_normal,
1084
+ limitValuesFontWeight: globalTokens.type_regular,
1085
+ limitValuesFontLetterSpacing: globalTokens.type_spacing_normal,
1086
+ disabledLimitValuesFontColor: globalTokens.hal_grey_l_60,
1087
+ labelFontFamily: globalTokens.type_sans,
1088
+ labelFontSize: globalTokens.type_scale_02,
1089
+ labelFontStyle: globalTokens.type_normal,
1090
+ labelFontWeight: globalTokens.type_semibold,
1091
+ labelLineHeight: globalTokens.type_leading_loose_01,
1092
+ helperTextFontFamily: globalTokens.type_sans,
1093
+ helperTextFontSize: globalTokens.type_scale_01,
1094
+ helperTextFontStyle: globalTokens.type_normal,
1095
+ helperTextFontWeight: globalTokens.type_regular,
1096
+ helperTextLineHeight: globalTokens.type_leading_normal,
1097
+ fontColor: globalTokens.hal_black,
1098
+ fontColorOnDark: globalTokens.hal_white,
1099
+ labelFontColor: globalTokens.hal_black,
1100
+ labelFontColorOnDark: globalTokens.hal_white,
1101
+ helperTextFontColor: globalTokens.hal_black,
1102
+ helperTextFontColorOnDark: globalTokens.hal_white,
1103
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1104
+ disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
1105
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
1106
+ disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
1107
+ thumbHeight: "12px",
1108
+ thumbWidth: "12px",
1109
+ hoverThumbHeight: "14px",
1110
+ hoverThumbWidth: "14px",
1111
+ thumbVerticalPosition: "12px",
1112
+ hoverThumbVerticalPosition: "11px",
1113
+ thumbBackgroundColor: globalTokens.hal_blue_s_35,
1114
+ thumbBackgroundColorOnDark: globalTokens.hal_blue_l_50,
1115
+ hoverThumbScale: "1.166666",
1116
+ hoverThumbBackgroundColor: globalTokens.hal_blue_d_20,
1117
+ hoverThumbBackgroundColorOnDark: globalTokens.hal_blue_d_20,
1118
+ activeThumbScale: "1.166666",
1119
+ activeThumbBackgroundColor: globalTokens.hal_blue_d_20,
1120
+ activeThumbBackgroundColorOnDark: globalTokens.hal_blue_d_20,
1121
+ focusThumbBackgroundColor: globalTokens.hal_blue_s_35,
1122
+ focusThumbBackgroundColorOnDark: globalTokens.hal_blue_l_50,
1123
+ tickHeight: "4px",
1124
+ tickWidth: "4px",
1125
+ tickVerticalPosition: "11px",
1126
+ tickBackgroundColor: globalTokens.hal_blue_s_35,
1127
+ tickBackgroundColorOnDark: globalTokens.hal_blue_l_50,
1128
+ trackLineThickness: "2px",
1129
+ trackLineVerticalPosition: "50%",
1130
+ trackLineColor: globalTokens.hal_blue_s_35,
1131
+ trackLineColorOnDark: globalTokens.hal_blue_l_50,
1132
+ totalLineThickness: "2px",
1133
+ totalLineVerticalPosition: "50%",
1134
+ totalLineColor: globalTokens.hal_grey_l_90,
1135
+ totalLineColorOnDark: globalTokens.hal_grey_l_75,
1136
+ disabledThumbVerticalPosition: "10px",
1137
+ disabledThumbBackgroundColor: globalTokens.hal_grey_l_60,
1138
+ disabledThumbBackgroundColorOnDark: "#575757",
1139
+ disabledTickVerticalPosition: "11px",
1140
+ disabledTickBackgroundColor: globalTokens.hal_grey_l_60,
1141
+ disabledTickBackgroundColorOnDark: globalTokens.hal_grey_l_60,
1142
+ disabledTrackLineColor: globalTokens.hal_grey_l_60,
1143
+ disabledTrackLineColorOnDark: globalTokens.hal_grey_l_60,
1144
+ disabledTotalLineColor: globalTokens.hal_grey_l_95,
1145
+ disabledTotalLineColorOnDark: globalTokens.hal_grey_s_40,
1146
+ focusColor: globalTokens.hal_blue_l_50,
1147
+ focusColorOnDark: globalTokens.hal_blue_l_50,
1148
+ floorLabelMarginRight: globalTokens.type_scale_03,
1149
+ ceilLabelMarginLeft: globalTokens.type_scale_03,
1150
+ inputMarginLeft: globalTokens.type_scale_06
1151
+ },
1152
+ spinner: {
1153
+ trackCircleColor: "#5f249f",
1154
+ trackCircleColorOnDark: "#a46ede",
1155
+ totalCircleColor: globalTokens.white,
1156
+ labelFontFamily: globalTokens.type_sans,
1157
+ labelFontSize: globalTokens.type_scale_02,
1158
+ labelFontStyle: globalTokens.type_normal,
1159
+ labelFontWeight: globalTokens.type_regular,
1160
+ labelFontColor: globalTokens.black,
1161
+ labelFontColorOnDark: globalTokens.white,
1162
+ labelTextAlign: "center",
1163
+ progressValueFontFamily: globalTokens.type_sans,
1164
+ progressValueFontSize: globalTokens.type_scale_02,
1165
+ progressValueFontStyle: globalTokens.type_normal,
1166
+ progressValueFontWeight: globalTokens.type_bold,
1167
+ progressValueFontColor: globalTokens.inherit,
1168
+ progressValueFontColorOnDark: globalTokens.white,
1169
+ progressValueTextAlign: "center",
1170
+ overlayBackgroundColor: globalTokens.black,
1171
+ overlayOpacity: "0.8",
1172
+ overlayLabelFontFamily: globalTokens.type_sans,
1173
+ overlayLabelFontSize: globalTokens.type_scale_02,
1174
+ overlayLabelFontStyle: globalTokens.type_normal,
1175
+ overlayLabelFontWeight: globalTokens.type_regular,
1176
+ overlayLabelFontColor: globalTokens.white,
1177
+ overlayLabelTextAlign: "center",
1178
+ overlayProgressValueFontFamily: globalTokens.type_sans,
1179
+ overlayProgressValueFontSize: globalTokens.type_scale_02,
1180
+ overlayProgressValueFontStyle: globalTokens.type_normal,
1181
+ overlayProgressValueFontWeight: globalTokens.type_bold,
1182
+ overlayProgressValueFontColor: globalTokens.white,
1183
+ overlayProgressValueTextAlign: "center"
1184
+ },
1185
+ "switch": {
1186
+ checkedTrackBackgroundColor: globalTokens.hal_purple_s_38,
1187
+ checkedTrackBackgroundColorOnDark: globalTokens.hal_purple_s_38,
1188
+ checkedThumbBackgroundColor: globalTokens.hal_white,
1189
+ checkedThumbBackgroundColorOnDark: globalTokens.hal_white,
1190
+ uncheckedTrackBackgroundColor: globalTokens.hal_grey_l_75,
1191
+ uncheckedTrackBackgroundColorOnDark: globalTokens.hal_grey_l_75,
1192
+ uncheckedThumbBackgroundColor: globalTokens.hal_white,
1193
+ uncheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
1194
+ disabledCheckedTrackBackgroundColor: globalTokens.hal_purple_l_95,
1195
+ disabledCheckedTrackBackgroundColorOnDark: "#1c0b24",
1196
+ disabledCheckedThumbBackgroundColor: globalTokens.hal_white,
1197
+ disabledCheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
1198
+ disabledUncheckedTrackBackgroundColor: globalTokens.hal_grey_l_95,
1199
+ disabledUncheckedTrackBackgroundColorOnDark: "#363636",
1200
+ disabledUncheckedThumbBackgroundColor: globalTokens.hal_white,
1201
+ disabledUncheckedThumbBackgroundColorOnDark: globalTokens.hal_white,
1202
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1203
+ disabledLabelFontColorOnDark: "#575757",
1204
+ disabledLabelFontStyle: globalTokens.type_normal,
1205
+ labelFontFamily: globalTokens.type_sans,
1206
+ labelFontSize: globalTokens.type_scale_root,
1207
+ labelFontStyle: globalTokens.type_normal,
1208
+ labelFontWeight: globalTokens.type_regular,
1209
+ labelFontColor: globalTokens.hal_black,
1210
+ labelFontColorOnDark: globalTokens.hal_white,
1211
+ thumbFocusColor: globalTokens.hal_blue_l_50,
1212
+ thumbFocusColorOnDark: "#1682FF",
1213
+ thumbHeight: "24px",
1214
+ thumbWidth: "24px",
1215
+ thumbShift: "40%",
1216
+ 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
1236
+ },
1237
+ table: {
1238
+ rowSeparatorThickness: "1px",
1239
+ rowSeparatorStyle: "solid",
1240
+ rowSeparatorColor: globalTokens.lightGrey,
1241
+ dataBackgroundColor: globalTokens.white,
1242
+ dataFontFamily: globalTokens.type_sans,
1243
+ dataFontSize: globalTokens.type_scale_02,
1244
+ dataFontStyle: globalTokens.type_normal,
1245
+ dataFontWeight: globalTokens.type_regular,
1246
+ dataFontColor: globalTokens.black,
1247
+ dataFontTextTransform: "none",
1248
+ dataPaddingTop: "14px",
1249
+ dataPaddingBottom: "12px",
1250
+ dataPaddingRight: "20px",
1251
+ dataPaddingLeft: "40px",
1252
+ dataTextAlign: "left",
1253
+ dataTextLineHeight: "normal",
1254
+ headerBackgroundColor: globalTokens.hal_purple_s_38,
1255
+ headerBorderRadius: "4px",
1256
+ headerFontFamily: globalTokens.type_sans,
1257
+ headerFontSize: globalTokens.type_scale_02,
1258
+ headerFontStyle: globalTokens.type_normal,
1259
+ headerFontWeight: globalTokens.type_regular,
1260
+ headerFontColor: globalTokens.white,
1261
+ headerFontTextTransform: "none",
1262
+ headerPaddingTop: "16px",
1263
+ headerPaddingBottom: "16px",
1264
+ headerPaddingRight: "20px",
1265
+ headerPaddingLeft: "40px",
1266
+ headerTextAlign: "left",
1267
+ headerTextLineHeight: "normal",
1268
+ scrollBarThumbColor: globalTokens.darkGrey,
1269
+ scrollBarTrackColor: globalTokens.lightGrey,
1270
+ sortIconColor: globalTokens.white
1271
+ },
1272
+ tabs: {
1273
+ fontFamily: globalTokens.type_sans,
1274
+ fontSize: globalTokens.type_scale_03,
1275
+ fontStyle: globalTokens.type_normal,
1276
+ fontWeight: globalTokens.type_semibold,
1277
+ fontTextTransform: "none",
1278
+ selectedBackgroundColor: globalTokens.white,
1279
+ selectedFontColor: "#5f249f",
1280
+ selectedIconColor: "#5f249f",
1281
+ selectedUnderlineColor: "#5f249f",
1282
+ selectedUnderlineThickness: "2px",
1283
+ unselectedBackgroundColor: globalTokens.white,
1284
+ unselectedFontColor: globalTokens.darkGrey,
1285
+ unselectedIconColor: globalTokens.darkGrey,
1286
+ disabledFontColor: "#999999",
1287
+ disabledIconColor: "#999999",
1288
+ disabledFontStyle: globalTokens.type_normal,
1289
+ hoverBackgroundColor: "#f2eafa",
1290
+ pressedBackgroundColor: "#e5d5f6",
1291
+ pressedFontWeight: globalTokens.type_semibold,
1292
+ dividerColor: globalTokens.mediumGrey,
1293
+ dividerThickness: "1px",
1294
+ focusOutline: "#5f249f",
1295
+ scrollButtonsWidth: "48px",
1296
+ badgeBackgroundColor: globalTokens.darkRed,
1297
+ badgeFontFamily: globalTokens.type_sans,
1298
+ badgeFontSize: "10px",
1299
+ badgeFontStyle: globalTokens.type_normal,
1300
+ badgeFontWeight: "500",
1301
+ badgeFontColor: globalTokens.white,
1302
+ badgeLetterSpacing: globalTokens.type_spacing_wide_02,
1303
+ badgeWidth: "16px",
1304
+ badgeHeight: "16px",
1305
+ badgeRadius: "10px",
1306
+ badgeWidthWithNotificationNumber: "23px",
1307
+ badgeHeightWithNotificationNumber: "17px",
1308
+ badgeRadiusWithNotificationNumber: "10px"
1309
+ },
1310
+ textarea: {
1311
+ fontFamily: globalTokens.type_sans,
1312
+ enabledBorderColor: globalTokens.hal_black,
1313
+ enabledBorderColorOnDark: globalTokens.hal_white,
1314
+ hoverBorderColor: globalTokens.hal_purple_l_65,
1315
+ hoverBorderColorOnDark: globalTokens.hal_purple_l_65,
1316
+ focusBorderColor: globalTokens.hal_blue_l_50,
1317
+ focusBorderColorOnDark: globalTokens.hal_blue_l_50,
1318
+ disabledBorderColor: globalTokens.hal_grey_l_60,
1319
+ disabledBorderColorOnDark: globalTokens.hal_grey_l_60,
1320
+ disabledContainerFillColor: globalTokens.hal_grey_l_95,
1321
+ disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
1322
+ errorBorderColor: globalTokens.hal_red_s_41,
1323
+ errorBorderColorOnDark: globalTokens.hal_red_l_60,
1324
+ hoverErrorBorderColor: globalTokens.color_red_600,
1325
+ hoverErrorBorderColorOnDark: "#fe677b",
1326
+ inputMarginTop: globalTokens.spacing_02,
1327
+ inputMarginBottom: globalTokens.spacing_02,
1328
+ errorMessageColor: globalTokens.hal_red_s_41,
1329
+ errorMessageColorOnDark: globalTokens.hal_red_l_60,
1330
+ labelFontColor: globalTokens.hal_black,
1331
+ labelFontColorOnDark: globalTokens.hal_white,
1332
+ labelFontSize: globalTokens.type_scale_02,
1333
+ labelFontStyle: globalTokens.type_normal,
1334
+ labelFontWeight: globalTokens.type_semibold,
1335
+ labelLineHeight: globalTokens.type_leading_loose_01,
1336
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1337
+ disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
1338
+ optionalLabelFontWeight: globalTokens.type_regular,
1339
+ helperTextFontColor: globalTokens.hal_black,
1340
+ helperTextFontColorOnDark: globalTokens.hal_white,
1341
+ helperTextFontSize: globalTokens.type_scale_01,
1342
+ helperTextFontStyle: globalTokens.type_normal,
1343
+ helperTextFontWeight: globalTokens.type_regular,
1344
+ helperTextLineHeight: globalTokens.type_leading_normal,
1345
+ disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
1346
+ disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
1347
+ placeholderFontColor: "#000000b3",
1348
+ placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
1349
+ disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
1350
+ disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
1351
+ valueFontColor: globalTokens.hal_black,
1352
+ valueFontColorOnDark: globalTokens.hal_white,
1353
+ valueFontSize: globalTokens.type_scale_03,
1354
+ valueFontStyle: globalTokens.type_normal,
1355
+ valueFontWeight: globalTokens.type_regular,
1356
+ disabledValueFontColor: globalTokens.hal_grey_l_60,
1357
+ disabledValueFontColorOnDark: globalTokens.hal_grey_l_60
1358
+ },
1359
+ V3Textarea: {
1360
+ 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,
1376
+ labelFontStyle: globalTokens.type_normal,
1377
+ labelFontWeight: globalTokens.type_regular,
1378
+ labelFontColor: globalTokens.black,
1379
+ labelFontColorOnDark: globalTokens.white,
1380
+ labelLetterSpacing: "0.00938em",
1381
+ valueFontSize: globalTokens.type_scale_03,
1382
+ valueFontStyle: globalTokens.type_normal,
1383
+ 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"
1393
+ },
1394
+ toggleGroup: {
1395
+ containerBackgroundColor: globalTokens.color_grey_50,
1396
+ containerBorderColor: globalTokens.hal_grey_l_60,
1397
+ labelFontColor: globalTokens.hal_black,
1398
+ disabledLabelFontColor: globalTokens.hal_grey_l_60,
1399
+ helperTextFontColor: globalTokens.hal_black,
1400
+ disabledHelperTextFontcolor: globalTokens.hal_grey_l_60,
1401
+ unselectedBackgroundColor: globalTokens.hal_grey_l_90,
1402
+ unselectedHoverBackgroundColor: globalTokens.hal_grey_l_80,
1403
+ unselectedActiveBackgroundColor: globalTokens.hal_purple_s_38,
1404
+ unselectedDisabledBackgroundColor: globalTokens.hal_grey_l_95,
1405
+ unselectedFontColor: globalTokens.hal_black,
1406
+ unselectedDisabledFontColor: globalTokens.hal_grey_l_60,
1407
+ selectedBackgroundColor: globalTokens.hal_purple_s_38,
1408
+ selectedHoverBackgroundColor: globalTokens.hal_purple_d_30,
1409
+ selectedActiveBackgroundColor: globalTokens.hal_purple_d_20,
1410
+ selectedDisabledBackgroundColor: globalTokens.hal_purple_l_95,
1411
+ selectedFontColor: globalTokens.hal_white,
1412
+ selectedDisabledFontColor: globalTokens.color_purple_300,
1413
+ focusColor: globalTokens.hal_blue_l_50,
1414
+ labelFontFamily: globalTokens.type_sans,
1415
+ labelFontSize: globalTokens.type_scale_02,
1416
+ labelFontStyle: globalTokens.type_normal,
1417
+ labelFontWeight: globalTokens.type_semibold,
1418
+ labelLineHeight: globalTokens.type_leading_loose_01,
1419
+ helperTextFontFamily: globalTokens.type_sans,
1420
+ helperTextFontSize: globalTokens.type_scale_01,
1421
+ helperTextFontStyle: globalTokens.type_normal,
1422
+ helperTextFontWeight: globalTokens.type_regular,
1423
+ helperTextLineHeight: globalTokens.type_leading_normal,
1424
+ optionLabelFontFamily: globalTokens.type_sans,
1425
+ optionLabelFontSize: globalTokens.type_scale_03,
1426
+ optionLabelFontStyle: globalTokens.type_normal,
1427
+ optionLabelFontWeight: globalTokens.type_regular,
1428
+ iconPaddingRight: globalTokens.spacing_03,
1429
+ iconPaddingLeft: globalTokens.spacing_03,
1430
+ labelPaddingLeft: globalTokens.spacing_06,
1431
+ labelPaddingRight: globalTokens.spacing_06,
1432
+ iconMarginRight: globalTokens.spacing_03,
1433
+ containerMarginTop: globalTokens.spacing_02,
1434
+ optionBorderThickness: globalTokens.border_width_0,
1435
+ optionBorderStyle: globalTokens.border_none,
1436
+ optionBorderRadius: globalTokens.border_radius_medium,
1437
+ containerBorderThickness: globalTokens.border_width_1,
1438
+ containerBorderStyle: globalTokens.border_solid,
1439
+ containerBorderRadius: globalTokens.border_radius_large,
1440
+ optionFocusBorderThickness: globalTokens.border_width_2
1441
+ },
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
+ 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",
1518
+ labelFontSize: globalTokens.type_scale_03,
1519
+ labelFontFamily: globalTokens.type_sans,
1520
+ labelFontStyle: globalTokens.type_normal,
1521
+ labelFontWeight: globalTokens.type_regular,
1522
+ labelLetterSpacing: globalTokens.type_spacing_normal,
1523
+ labelFontTextTransform: "none",
1524
+ 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,
1554
+ separatorBorderThickness: "1px",
1555
+ separatorBorderStyle: "solid",
1556
+ separatorColor: globalTokens.lightGrey,
1557
+ focusColor: globalTokens.hal_blue_l_50
1558
+ }
1559
+ };
1560
+ exports.componentTokens = componentTokens;
1561
+ var spaces = {
1562
+ xxsmall: "6px",
1563
+ xsmall: "16px",
1564
+ small: "24px",
1565
+ medium: "36px",
1566
+ large: "48px",
1567
+ xlarge: "64px",
1568
+ xxlarge: "100px"
1569
+ };
1570
+ exports.spaces = spaces;
1571
+ var responsiveSizes = {
1572
+ mobileSmall: "320",
1573
+ mobileMedium: "375",
1574
+ mobileLarge: "425",
1575
+ tablet: "768",
1576
+ laptop: "1024",
1577
+ desktop: "1440"
1578
+ };
1579
+ exports.responsiveSizes = responsiveSizes;
1580
+ var typeface = {
1581
+ body: {
1582
+ fontSize: "16px",
1583
+ letterSpacing: "0.5",
1584
+ textTransform: "initial"
1585
+ },
1586
+ altBody: {
1587
+ fontSize: "14px",
1588
+ letterSpacing: "0.25",
1589
+ textTransform: "initial"
1590
+ },
1591
+ subtitle: {
1592
+ fontSize: "16px",
1593
+ letterSpacing: "0.15",
1594
+ textTransform: "initial"
1595
+ },
1596
+ altSubtitle: {
1597
+ fontSize: "14px",
1598
+ letterSpacing: "0.1",
1599
+ textTransform: "initial"
1600
+ },
1601
+ caption: {
1602
+ fontSize: "12px",
1603
+ letterSpacing: "0.4",
1604
+ textTransform: "initial"
1605
+ },
1606
+ overline: {
1607
+ fontSize: "12px",
1608
+ letterSpacing: "2",
1609
+ textTransform: "uppercase"
1610
+ }
1611
+ };
1612
+ exports.typeface = typeface;