@aurodesignsystem/design-tokens 5.4.0 → 5.6.0

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 (80) hide show
  1. package/CHANGELOG.md +27 -0
  2. package/dist/CSSCustomProperties--bundled.css +847 -71
  3. package/dist/alaska/CSSCustomProperties--alaska.css +457 -0
  4. package/dist/alaska/JSONVariablesNested--alaska.json +706 -0
  5. package/dist/alaska/JSObject--allTokens.js +15481 -0
  6. package/dist/alaska/SCSSVariables--alaska.scss +454 -0
  7. package/dist/alaska/SCSSVariablesMapFlat--alaska.scss +458 -0
  8. package/dist/alaska/primitives--alaska.scss +246 -0
  9. package/dist/auro-classic/CSSCustomProperties.css +1 -1
  10. package/dist/auro-classic/CSSSizeCustomProperties.css +1 -1
  11. package/dist/auro-classic/JSData--color.js +1 -1
  12. package/dist/auro-classic/JSObject--allTokens.js +1 -1
  13. package/dist/auro-classic/JSObject--deprecated.js +1 -1
  14. package/dist/auro-classic/JSVariables--color.js +1 -1
  15. package/dist/auro-classic/SCSSVariableMap.scss +1 -1
  16. package/dist/auro-classic/SCSSVariables.scss +1 -1
  17. package/dist/auro-classic/SCSSVariablesMapFlat.scss +1 -1
  18. package/dist/auro-classic/SassCustomProperties.scss +1 -1
  19. package/dist/auro-classic/SassSizeCustomProperties.scss +1 -1
  20. package/dist/hawaiian/CSSCustomProperties--hawaiian.css +393 -71
  21. package/dist/hawaiian/JSONVariablesNested--hawaiian.json +614 -96
  22. package/dist/hawaiian/JSObject--allTokens.js +13917 -2636
  23. package/dist/hawaiian/SCSSVariables--hawaiian.scss +393 -71
  24. package/dist/hawaiian/SCSSVariablesMapFlat--hawaiian.scss +394 -72
  25. package/dist/hawaiian/primitives--hawaiian.scss +25 -24
  26. package/dist/transparent/CSSCustomProperties--transparent.css +1 -1
  27. package/package.json +1 -1
  28. package/src/primitives/alaska/color.json +456 -456
  29. package/src/primitives/alaska/font.json +9 -9
  30. package/src/primitives/base/color.json +284 -284
  31. package/src/primitives/base/font.json +186 -175
  32. package/src/primitives/base/transparency.json +108 -108
  33. package/src/primitives/hawaiian/color.json +287 -287
  34. package/src/primitives/hawaiian/font.json +9 -9
  35. package/src/themes/alaska/advanced/accents.json +104 -0
  36. package/src/themes/alaska/advanced/boolean.json +87 -95
  37. package/src/themes/alaska/advanced/button/primary.json +146 -0
  38. package/src/themes/alaska/advanced/button/secondary.json +106 -0
  39. package/src/themes/alaska/advanced/button/tertiary.json +98 -0
  40. package/src/themes/alaska/advanced/hyperlink.json +34 -56
  41. package/src/themes/alaska/advanced/shared.json +43 -41
  42. package/src/themes/alaska/advanced/state.json +42 -48
  43. package/src/themes/alaska/basic/color/border.json +43 -45
  44. package/src/themes/alaska/basic/color/brand.json +68 -72
  45. package/src/themes/alaska/basic/color/fare-brand.json +46 -46
  46. package/src/themes/alaska/basic/color/page-background.json +9 -9
  47. package/src/themes/alaska/basic/color/status.json +61 -69
  48. package/src/themes/alaska/basic/color/surface.json +72 -80
  49. package/src/themes/alaska/basic/color/text-icon.json +38 -78
  50. package/src/themes/alaska/basic/corner-radius.json +15 -15
  51. package/src/themes/alaska/basic/font/accent.json +847 -217
  52. package/src/themes/alaska/basic/font/body.json +203 -48
  53. package/src/themes/alaska/basic/font/display.json +727 -187
  54. package/src/themes/alaska/basic/font/heading.json +725 -182
  55. package/src/themes/alaska-classic/color.json +2 -2
  56. package/src/themes/alaska-classic/typography.json +124 -124
  57. package/src/themes/hawaiian/advanced/accents.json +104 -0
  58. package/src/themes/hawaiian/advanced/boolean.json +115 -125
  59. package/src/themes/hawaiian/advanced/button/primary.json +146 -0
  60. package/src/themes/hawaiian/advanced/button/secondary.json +106 -0
  61. package/src/themes/hawaiian/advanced/button/tertiary.json +98 -0
  62. package/src/themes/hawaiian/advanced/hyperlink.json +19 -43
  63. package/src/themes/hawaiian/advanced/shared.json +30 -30
  64. package/src/themes/hawaiian/advanced/state.json +52 -60
  65. package/src/themes/hawaiian/basic/color/border.json +28 -29
  66. package/src/themes/hawaiian/basic/color/brand.json +48 -49
  67. package/src/themes/hawaiian/basic/color/fare-brand.json +44 -45
  68. package/src/themes/hawaiian/basic/color/page-background.json +8 -9
  69. package/src/themes/hawaiian/basic/color/status.json +36 -37
  70. package/src/themes/hawaiian/basic/color/surface.json +40 -41
  71. package/src/themes/hawaiian/basic/color/text-icon.json +38 -40
  72. package/src/themes/hawaiian/basic/corner-radius.json +30 -0
  73. package/src/themes/hawaiian/basic/font/accent.json +846 -216
  74. package/src/themes/hawaiian/basic/font/body.json +202 -47
  75. package/src/themes/hawaiian/basic/font/display.json +788 -0
  76. package/src/themes/hawaiian/basic/font/heading.json +724 -184
  77. package/src/themes/alaska/advanced/button.json +0 -260
  78. package/src/themes/hawaiian/advanced/button.json +0 -334
  79. package/src/themes/hawaiian/basic/color/color.json +0 -57
  80. package/src/themes/hawaiian/basic/font/typography.json +0 -248
@@ -0,0 +1,98 @@
1
+ {
2
+ "advanced": {
3
+ "color": {
4
+ "button": {
5
+ "tertiary": {
6
+ "background": {
7
+ "default": true,
8
+ "deprecated": false,
9
+ "public": true,
10
+ "type": "semantic",
11
+ "usage": "Tertiary button background color",
12
+ "value": "{transparency.black.5.value}"
13
+ },
14
+ "backgroundHover": {
15
+ "default": true,
16
+ "deprecated": false,
17
+ "public": true,
18
+ "type": "semantic",
19
+ "usage": "Tertiary button background hover color",
20
+ "value": "{transparency.black.10.value}"
21
+ },
22
+ "backgroundInverse": {
23
+ "default": true,
24
+ "deprecated": false,
25
+ "public": true,
26
+ "type": "semantic",
27
+ "usage": "Tertiary button inverse background color",
28
+ "value": "{transparency.white.5.value}"
29
+ },
30
+ "backgroundInverseHover": {
31
+ "default": true,
32
+ "deprecated": false,
33
+ "public": true,
34
+ "type": "semantic",
35
+ "usage": "Tertiary button inverse background hover color",
36
+ "value": "{transparency.white.10.value}"
37
+ },
38
+ "border": {
39
+ "default": true,
40
+ "deprecated": false,
41
+ "public": true,
42
+ "type": "semantic",
43
+ "usage": "Tertiary button border color",
44
+ "value": "{transparency.black.5.value}"
45
+ },
46
+ "borderHover": {
47
+ "default": true,
48
+ "deprecated": false,
49
+ "public": true,
50
+ "type": "semantic",
51
+ "usage": "Tertiary button border hover color",
52
+ "value": "{transparency.black.10.value}"
53
+ },
54
+ "borderInverse": {
55
+ "default": true,
56
+ "deprecated": false,
57
+ "public": true,
58
+ "type": "semantic",
59
+ "usage": "Tertiary button inverse border color",
60
+ "value": "{transparency.white.5.value}"
61
+ },
62
+ "borderInverseHover": {
63
+ "default": true,
64
+ "deprecated": false,
65
+ "public": true,
66
+ "type": "semantic",
67
+ "usage": "Tertiary button inverse border hover color",
68
+ "value": "{transparency.white.10.value}"
69
+ },
70
+ "text": {
71
+ "default": true,
72
+ "deprecated": false,
73
+ "public": true,
74
+ "type": "semantic",
75
+ "usage": "Tertiary button text color",
76
+ "value": "{basic.color.brand.primary.value}"
77
+ },
78
+ "textHover": {
79
+ "default": true,
80
+ "deprecated": false,
81
+ "public": true,
82
+ "type": "semantic",
83
+ "usage": "Tertiary button text hover color",
84
+ "value": "{basic.color.brand.primaryBold.value}"
85
+ },
86
+ "textInverse": {
87
+ "default": true,
88
+ "deprecated": false,
89
+ "public": true,
90
+ "type": "semantic",
91
+ "usage": "Tertiary button inverse text color",
92
+ "value": "{color.white.value}"
93
+ }
94
+ }
95
+ }
96
+ }
97
+ }
98
+ }
@@ -1,61 +1,39 @@
1
1
  {
2
2
  "advanced": {
3
- "hyperlink": {
4
- "default": {
5
- "value": "{color.brand.primary.value}",
6
- "type": "semantic",
7
- "public": true,
8
- "default": true,
9
- "usage": "Default hyperlink color",
10
- "deprecated": false
11
- },
12
- "hover": {
13
- "value": "{color.brand.primaryBold.value}",
14
- "type": "semantic",
15
- "public": true,
16
- "default": true,
17
- "usage": "Hyperlink hover state color",
18
- "deprecated": false
19
- },
20
- "active": {
21
- "value": "{color.brand.primaryBold.value}",
22
- "type": "semantic",
23
- "public": true,
24
- "default": true,
25
- "usage": "Hyperlink active state color",
26
- "deprecated": false
27
- },
28
- "visited": {
29
- "value": "{color.brand.primaryMuted.value}",
30
- "type": "semantic",
31
- "public": true,
32
- "default": true,
33
- "usage": "Hyperlink visited state color",
34
- "deprecated": false
35
- },
36
- "disabled": {
37
- "value": "{color.gray.400.value}",
38
- "type": "semantic",
39
- "public": true,
40
- "default": true,
41
- "usage": "Hyperlink disabled state color",
42
- "deprecated": false
43
- },
44
- "inverse": {
45
- "value": "{color.white.value}",
46
- "type": "semantic",
47
- "public": true,
48
- "default": true,
49
- "usage": "Hyperlink inverse color",
50
- "deprecated": false
51
- },
52
- "inverseHover": {
53
- "value": "{color.brand.primaryMuted.value}",
54
- "type": "semantic",
55
- "public": true,
56
- "default": true,
57
- "usage": "Hyperlink inverse hover color",
58
- "deprecated": false
3
+ "color": {
4
+ "hyperlink": {
5
+ "text": {
6
+ "default": true,
7
+ "deprecated": false,
8
+ "public": true,
9
+ "type": "semantic",
10
+ "usage": "Default hyperlink color",
11
+ "value": "{basic.color.brand.primarySubtle.value}"
12
+ },
13
+ "textHover": {
14
+ "default": true,
15
+ "deprecated": false,
16
+ "public": true,
17
+ "type": "semantic",
18
+ "usage": "Hyperlink hover state color",
19
+ "value": "{basic.color.brand.primary.value}"
20
+ },
21
+ "textInverse": {
22
+ "default": true,
23
+ "deprecated": false,
24
+ "public": true,
25
+ "type": "semantic",
26
+ "usage": "Default hyperlink color on inverse/dark backgrounds",
27
+ "value": "{basic.color.texticon.inverse.value}"
28
+ },
29
+ "textInverseHover": {
30
+ "default": true,
31
+ "deprecated": false,
32
+ "public": true,
33
+ "type": "semantic",
34
+ "usage": "Hyperlink hover state color on inverse/dark backgrounds",
35
+ "value": "{basic.color.brand.primaryMuted.value}"
36
+ }
59
37
  }
60
38
  }
61
39
  }
@@ -1,46 +1,48 @@
1
1
  {
2
2
  "advanced": {
3
- "background": {
4
- "default": {
5
- "value": "{color.white.value}",
6
- "type": "semantic",
7
- "public": true,
8
- "default": true,
9
- "usage": "Component background color",
10
- "deprecated": false
11
- },
12
- "muted": {
13
- "value": "{color.gray.50.value}",
14
- "type": "semantic",
15
- "public": true,
16
- "default": true,
17
- "usage": "Component background muted color",
18
- "deprecated": false
19
- },
20
- "strong": {
21
- "value": "{color.gray.600.value}",
22
- "type": "semantic",
23
- "public": true,
24
- "default": true,
25
- "usage": "Component background strong color",
26
- "deprecated": false
27
- },
28
- "inverse": {
29
- "value": "{color.transparencies.white.5.value}",
30
- "type": "semantic",
31
- "public": true,
32
- "default": true,
33
- "usage": "Component background hover color",
34
- "deprecated": false
3
+ "color": {
4
+ "shared": {
5
+ "background": {
6
+ "default": true,
7
+ "deprecated": false,
8
+ "public": true,
9
+ "type": "semantic",
10
+ "usage": "Component background color",
11
+ "value": "{color.white.value}"
12
+ },
13
+ "backgroundInverse": {
14
+ "default": true,
15
+ "deprecated": false,
16
+ "public": true,
17
+ "type": "semantic",
18
+ "usage": "Component background hover color",
19
+ "value": "{transparency.white.5.value}"
20
+ },
21
+ "backgroundMuted": {
22
+ "default": true,
23
+ "deprecated": false,
24
+ "public": true,
25
+ "type": "semantic",
26
+ "usage": "Component background muted color",
27
+ "value": "{color.gray.50.value}"
28
+ },
29
+ "backgroundStrong": {
30
+ "default": true,
31
+ "deprecated": false,
32
+ "public": true,
33
+ "type": "semantic",
34
+ "usage": "Component background strong color",
35
+ "value": "{color.gray.600.value}"
36
+ },
37
+ "textAccent": {
38
+ "default": true,
39
+ "deprecated": false,
40
+ "public": true,
41
+ "type": "semantic",
42
+ "usage": "",
43
+ "value": "{basic.color.brand.primarySubtle.value}"
44
+ }
35
45
  }
36
- },
37
- "textAccent": {
38
- "value": "{color.brand.primarySubtle.value}",
39
- "type": "semantic",
40
- "public": true,
41
- "default": true,
42
- "usage": "",
43
- "deprecated": false
44
46
  }
45
47
  }
46
- }
48
+ }
@@ -1,70 +1,64 @@
1
1
  {
2
2
  "advanced": {
3
- "state": {
4
- "focused": {
5
- "default": {
6
- "value": "{color.brand.primary.value}",
7
- "type": "semantic",
8
- "public": true,
3
+ "color": {
4
+ "state": {
5
+ "backgroundDisabled": {
9
6
  "default": true,
7
+ "deprecated": false,
8
+ "public": true,
9
+ "type": "semantic",
10
10
  "usage": "",
11
- "deprecated": false
11
+ "value": "{color.gray.200.value}"
12
12
  },
13
- "inverse": {
14
- "value": "{color.white.value}",
15
- "type": "semantic",
16
- "public": true,
13
+ "backgroundHover": {
17
14
  "default": true,
18
- "usage": "",
19
- "deprecated": false
20
- }
21
- },
22
- "selected": {
23
- "default": {
24
- "value": "{color.brand.primary.value}",
25
- "type": "semantic",
15
+ "deprecated": false,
26
16
  "public": true,
27
- "default": true,
17
+ "type": "semantic",
28
18
  "usage": "",
29
- "deprecated": false
19
+ "value": "{color.gray.100.value}"
30
20
  },
31
- "hover": {
32
- "value": "{color.brand.primaryBold.value}",
33
- "type": "semantic",
34
- "public": true,
21
+ "backgroundInverseHover": {
35
22
  "default": true,
36
- "usage": "",
37
- "deprecated": false
38
- }
39
- },
40
- "background": {
41
- "hover": {
42
- "value": "{color.gray.100.value}",
43
- "type": "semantic",
23
+ "deprecated": false,
44
24
  "public": true,
45
- "default": true,
25
+ "type": "semantic",
46
26
  "usage": "",
47
- "deprecated": false
27
+ "value": "{transparency.white.15.value}"
48
28
  },
49
- "disabled": {
50
- "value": "{color.gray.200.value}",
29
+ "focused": {
30
+ "default": true,
31
+ "deprecated": false,
32
+ "public": true,
51
33
  "type": "semantic",
34
+ "usage": "",
35
+ "value": "{basic.color.brand.primary.value}"
36
+ },
37
+ "focusedInverse": {
38
+ "default": true,
39
+ "deprecated": false,
52
40
  "public": true,
41
+ "type": "semantic",
42
+ "usage": "",
43
+ "value": "{color.white.value}"
44
+ },
45
+ "selected": {
53
46
  "default": true,
47
+ "deprecated": false,
48
+ "public": true,
49
+ "type": "semantic",
54
50
  "usage": "",
55
- "deprecated": false
51
+ "value": "{basic.color.brand.primary.value}"
56
52
  },
57
- "inverse": {
58
- "hover": {
59
- "value": "{color.transparencies.white.15.value}",
60
- "type": "semantic",
61
- "public": true,
62
- "default": true,
63
- "usage": "",
64
- "deprecated": false
65
- }
53
+ "selectedHover": {
54
+ "default": true,
55
+ "deprecated": false,
56
+ "public": true,
57
+ "type": "semantic",
58
+ "usage": "",
59
+ "value": "{basic.color.brand.primaryBold.value}"
66
60
  }
67
61
  }
68
62
  }
69
63
  }
70
- }
64
+ }
@@ -2,65 +2,63 @@
2
2
  "basic": {
3
3
  "color": {
4
4
  "border": {
5
- "default": {
6
- "value": "{color.midnight.900.value}",
7
- "type": "semantic",
8
- "public": true,
5
+ "bold": {
9
6
  "default": true,
10
- "usage": "Primary brand color",
11
- "deprecated": false
12
- },
13
- "subtle": {
14
- "value": "{color.midnight.600.value}",
15
- "type": "semantic",
7
+ "deprecated": false,
16
8
  "public": true,
17
- "default": true,
18
- "usage": "Subtle neutral surface color",
19
- "deprecated": false
20
- },
21
- "bold": {
22
- "value": "{color.midnight.1000.value}",
23
9
  "type": "semantic",
24
- "public": true,
25
- "default": true,
26
- "usage": "Bold neutral surface color",
27
- "deprecated": false
10
+ "usage": "Bold border color",
11
+ "value": "{color.neutral.800.value}"
28
12
  },
29
13
  "brand": {
30
- "value": "{color.brand.primary.value}",
31
- "type": "semantic",
32
- "public": true,
33
14
  "default": true,
15
+ "deprecated": false,
16
+ "public": true,
17
+ "type": "semantic",
34
18
  "usage": "Brand border color",
35
- "deprecated": false
19
+ "value": "{basic.color.brand.primaryBold.value}"
36
20
  },
37
- "inverse": {
38
- "value": "{color.white.value}",
21
+ "default": {
22
+ "default": true,
23
+ "deprecated": false,
24
+ "public": true,
39
25
  "type": "semantic",
26
+ "usage": "Default border color",
27
+ "value": "{color.gray.500.value}"
28
+ },
29
+ "divider": {
30
+ "default": true,
31
+ "deprecated": false,
40
32
  "public": true,
33
+ "type": "semantic",
34
+ "usage": "Divider border color",
35
+ "value": "{transparency.black.15.value}"
36
+ },
37
+ "dividerInverse": {
38
+ "default": true,
39
+ "deprecated": false,
40
+ "public": true,
41
+ "type": "semantic",
42
+ "usage": "Inverse divider border color",
43
+ "value": "{transparency.white.40.value}"
44
+ },
45
+ "inverse": {
41
46
  "default": true,
47
+ "deprecated": false,
48
+ "public": true,
49
+ "type": "semantic",
42
50
  "usage": "Inverse border color",
43
- "deprecated": false
51
+ "value": "{color.white.value}"
44
52
  },
45
- "divider": {
46
- "base": {
47
- "value": "{transparency.black.15.value}",
48
- "type": "semantic",
49
- "public": true,
50
- "default": true,
51
- "usage": "Divider border color",
52
- "deprecated": false
53
- },
54
- "inverse": {
55
- "value": "{transparency.white.40.value}",
56
- "type": "semantic",
57
- "public": true,
58
- "default": true,
59
- "usage": "Inverse divider border color",
60
- "deprecated": false
61
- }
53
+ "subtle": {
54
+ "default": true,
55
+ "deprecated": false,
56
+ "public": true,
57
+ "type": "semantic",
58
+ "usage": "Subtle border color",
59
+ "value": "{color.gray.200.value}"
62
60
  }
63
61
  }
64
62
  }
65
63
  }
66
- }
64
+ }