@aurodesignsystem/design-tokens 4.0.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 (70) hide show
  1. package/CHANGELOG.md +573 -0
  2. package/LICENSE +201 -0
  3. package/README.md +97 -0
  4. package/dist/tokens/CSSCustomProperties--darkmode.css +302 -0
  5. package/dist/tokens/CSSCustomProperties.css +315 -0
  6. package/dist/tokens/CSSCustomPropertiesColorRGB--darkmode.css +155 -0
  7. package/dist/tokens/CSSCustomPropertiesColorRGB.css +168 -0
  8. package/dist/tokens/CSSOpacityProperties--darkmode.scss +10 -0
  9. package/dist/tokens/CSSOpacityProperties.scss +10 -0
  10. package/dist/tokens/CSSSizeCustomProperties--darkmode.css +20 -0
  11. package/dist/tokens/CSSSizeCustomProperties.css +20 -0
  12. package/dist/tokens/CSSVariables--darkmode.css +302 -0
  13. package/dist/tokens/CSSVariablesMapFlat--darkmode.css +368 -0
  14. package/dist/tokens/JSData--color.js +3665 -0
  15. package/dist/tokens/JSData--darkmodeColor.js +3254 -0
  16. package/dist/tokens/JSObject--allDarkTokens.js +7087 -0
  17. package/dist/tokens/JSObject--allTokens.js +7498 -0
  18. package/dist/tokens/JSObject--deprecated.js +2788 -0
  19. package/dist/tokens/JSObject--deprecatedDark.js +675 -0
  20. package/dist/tokens/JSVariables--color.js +166 -0
  21. package/dist/tokens/JSVariables--darkmodeColor.js +153 -0
  22. package/dist/tokens/SCSSOpacityVariables--darkmode.scss +7 -0
  23. package/dist/tokens/SCSSOpacityVariables.scss +7 -0
  24. package/dist/tokens/SCSSVariableMap--darkmode.scss +37 -0
  25. package/dist/tokens/SCSSVariableMap.scss +37 -0
  26. package/dist/tokens/SCSSVariables--darkmode.scss +299 -0
  27. package/dist/tokens/SCSSVariables.scss +312 -0
  28. package/dist/tokens/SCSSVariablesMapFlat--darkmode.scss +368 -0
  29. package/dist/tokens/SCSSVariablesMapFlat.scss +381 -0
  30. package/dist/tokens/SassCustomProperties--darkmode.scss +302 -0
  31. package/dist/tokens/SassCustomProperties.scss +315 -0
  32. package/dist/tokens/SassCustomPropertiesColorRGB--darkmode.scss +155 -0
  33. package/dist/tokens/SassCustomPropertiesColorRGB.scss +168 -0
  34. package/dist/tokens/SassSizeCustomProperties--darkmode.scss +20 -0
  35. package/dist/tokens/SassSizeCustomProperties.scss +20 -0
  36. package/package.json +92 -0
  37. package/packageScripts/postinstall.mjs +34 -0
  38. package/src/animation.json +21 -0
  39. package/src/asset/font.json +35 -0
  40. package/src/breakpoint.json +28 -0
  41. package/src/color/alert.json +175 -0
  42. package/src/color/background.json +38 -0
  43. package/src/color/base.json +140 -0
  44. package/src/color/border.json +214 -0
  45. package/src/color/brand.json +530 -0
  46. package/src/color/icon.json +150 -0
  47. package/src/color/text.json +237 -0
  48. package/src/color/tier.json +114 -0
  49. package/src/color/ui.json +165 -0
  50. package/src/color-darkmode/alert.json +56 -0
  51. package/src/color-darkmode/background.json +38 -0
  52. package/src/color-darkmode/base.json +140 -0
  53. package/src/color-darkmode/border.json +66 -0
  54. package/src/color-darkmode/brand.json +530 -0
  55. package/src/color-darkmode/icon.json +46 -0
  56. package/src/color-darkmode/text.json +66 -0
  57. package/src/color-darkmode/tier.json +54 -0
  58. package/src/color-darkmode/ui.json +57 -0
  59. package/src/comments.json +34 -0
  60. package/src/depth.json +29 -0
  61. package/src/elevation.json +22 -0
  62. package/src/grid-breakpoint.json +29 -0
  63. package/src/grid-column.json +29 -0
  64. package/src/grid-gutter.json +29 -0
  65. package/src/grid-margin.json +29 -0
  66. package/src/shadow.json +13 -0
  67. package/src/size/radius.json +9 -0
  68. package/src/size/scale.json +308 -0
  69. package/src/size/unitless-scale.json +82 -0
  70. package/src/text.json +572 -0
package/src/color-darkmode/ui.json ADDED
@@ -0,0 +1,57 @@
1
+ {
2
+ "color": {
3
+ "ui": {
4
+ "default": {
5
+ "default": {
6
+ "value": "{color.brand.breeze.300.value}",
7
+ "public": true,
8
+ "default": true,
9
+ "usage": "default interaction color affordance",
10
+ "wcag": "AAA",
11
+ "deprecated": false
12
+ }
13
+ },
14
+ "hover": {
15
+ "default": {
16
+ "value": "{color.brand.breeze.200.value}",
17
+ "public": true,
18
+ "default": true,
19
+ "usage": "Hover interaction color on dark backgrounds",
20
+ "wcag": "AAA",
21
+ "deprecated": false
22
+ }
23
+ },
24
+ "active": {
25
+ "default": {
26
+ "value": "{color.brand.breeze.200.value}",
27
+ "public": true,
28
+ "default": true,
29
+ "usage": "default active state color affordance",
30
+ "wcag": "AAA",
31
+ "deprecated": false
32
+ }
33
+ },
34
+ "disabled": {
35
+ "default": {
36
+ "value": "{color.brand.breeze.300-opacity-30.value}",
37
+ "public": true,
38
+ "default": true,
39
+ "usage": "default disabled state color affordance",
40
+ "wcag": "n/a",
41
+ "deprecated": false
42
+ }
43
+ },
44
+ "bkg": {
45
+ "hover": {
46
+ "default": {
47
+ "value": "5de3f71a",
48
+ "public": true,
49
+ "default": true,
50
+ "usage": "Default hover affordance for background colors default",
51
+ "deprecated": false
52
+ }
53
+ }
54
+ }
55
+ }
56
+ }
57
+ }
package/src/comments.json ADDED
@@ -0,0 +1,34 @@
1
+ {
2
+ "comments": {
3
+ "deprecated": {
4
+ "comment": "\n // Deprecated, no replacement; token to be REMOVED in next MAJOR release"
5
+ },
6
+ "reference": {
7
+ "comment": "\n // New token, see"
8
+ },
9
+ "color": {
10
+ "deprecated": {
11
+ "comment": "{comments.deprecated.comment}"
12
+ },
13
+ "base": {
14
+ "value": {
15
+ "comment": "\n // Base value for token support; should not use in code!"
16
+ }
17
+ },
18
+ "brand": {
19
+ "value": {
20
+ "comment": "\n // Please consider descriptive token prior to using brand token"
21
+ }
22
+ },
23
+ "classic": {
24
+ "comment": "\n // DO NOT USE for anything other than legacy projects or classic component themes"
25
+ },
26
+ "matrix": {
27
+ "comment": "\n // DO NOT USE for anything other than legacy projects related to the matrix search"
28
+ },
29
+ "reference": {
30
+ "comment": "{comments.reference.comment}"
31
+ }
32
+ }
33
+ }
34
+ }
package/src/depth.json ADDED
@@ -0,0 +1,29 @@
1
+ {
2
+ "depth": {
3
+ "hidden": {
4
+ "value": "-1"
5
+ },
6
+ "dialog": {
7
+ "value": "100",
8
+ "public": false,
9
+ "deprecated": true,
10
+ "reference": "depth-modal",
11
+ "version": "3.2.1"
12
+ },
13
+ "overlay": {
14
+ "value": "200",
15
+ "public": true,
16
+ "deprecated": false
17
+ },
18
+ "modal": {
19
+ "value": "400",
20
+ "public": true,
21
+ "deprecated": false
22
+ },
23
+ "tooltip": {
24
+ "value": "300",
25
+ "public": true,
26
+ "deprecated": false
27
+ }
28
+ }
29
+ }
package/src/elevation.json ADDED
@@ -0,0 +1,22 @@
1
+ {
2
+ "elevation": {
3
+ "100": {
4
+ "value": "0px 0px 5px rgba(0, 0, 0, 0.15)",
5
+ "public": true,
6
+ "comment": "for the least amount of emphasis",
7
+ "deprecated": false
8
+ },
9
+ "200": {
10
+ "value": "0px 0px 10px rgba(0, 0, 0, 0.15)",
11
+ "public": true,
12
+ "comment": "for more emphasis than low elevation",
13
+ "deprecated": false
14
+ },
15
+ "300": {
16
+ "value": "0px 0px 15px rgba(0, 0, 0, 0.2)",
17
+ "public": true,
18
+ "comment": "for maximum emphasis or differentiation",
19
+ "deprecated": false
20
+ }
21
+ }
22
+ }
package/src/grid-breakpoint.json ADDED
@@ -0,0 +1,29 @@
1
+ {
2
+ "gridBreakpoint": {
3
+ "xs": {
4
+ "value": "320px",
5
+ "public": true,
6
+ "deprecated": false
7
+ },
8
+ "sm": {
9
+ "value": "576px",
10
+ "public": true,
11
+ "deprecated": false
12
+ },
13
+ "md": {
14
+ "value": "768px",
15
+ "public": true,
16
+ "deprecated": false
17
+ },
18
+ "lg": {
19
+ "value": "1024px",
20
+ "public": true,
21
+ "deprecated": false
22
+ },
23
+ "xl": {
24
+ "value": "1232px",
25
+ "public": true,
26
+ "deprecated": false
27
+ }
28
+ }
29
+ }
package/src/grid-column.json ADDED
@@ -0,0 +1,29 @@
1
+ {
2
+ "gridColumn": {
3
+ "xs": {
4
+ "value": "6",
5
+ "public": true,
6
+ "deprecated": false
7
+ },
8
+ "sm": {
9
+ "value": "12",
10
+ "public": true,
11
+ "deprecated": false
12
+ },
13
+ "md": {
14
+ "value": "12",
15
+ "public": true,
16
+ "deprecated": false
17
+ },
18
+ "lg": {
19
+ "value": "12",
20
+ "public": true,
21
+ "deprecated": false
22
+ },
23
+ "xl": {
24
+ "value": "12",
25
+ "public": true,
26
+ "deprecated": false
27
+ }
28
+ }
29
+ }
package/src/grid-gutter.json ADDED
@@ -0,0 +1,29 @@
1
+ {
2
+ "gridGutter": {
3
+ "xs": {
4
+ "value": "{size.100.value}",
5
+ "public": true,
6
+ "deprecated": false
7
+ },
8
+ "sm": {
9
+ "value": "{size.200.value}",
10
+ "public": true,
11
+ "deprecated": false
12
+ },
13
+ "md": {
14
+ "value": "{size.300.value}",
15
+ "public": true,
16
+ "deprecated": false
17
+ },
18
+ "lg": {
19
+ "value": "{size.300.value}",
20
+ "public": true,
21
+ "deprecated": false
22
+ },
23
+ "xl": {
24
+ "value": "{size.400.value}",
25
+ "public": true,
26
+ "deprecated": false
27
+ }
28
+ }
29
+ }
package/src/grid-margin.json ADDED
@@ -0,0 +1,29 @@
1
+ {
2
+ "gridMargin": {
3
+ "xs": {
4
+ "value": "{size.200.value}",
5
+ "public": true,
6
+ "deprecated": false
7
+ },
8
+ "sm": {
9
+ "value": "{size.200.value}",
10
+ "public": true,
11
+ "deprecated": false
12
+ },
13
+ "md": {
14
+ "value": "{size.300.value}",
15
+ "public": true,
16
+ "deprecated": false
17
+ },
18
+ "lg": {
19
+ "value": "{size.400.value}",
20
+ "public": true,
21
+ "deprecated": false
22
+ },
23
+ "xl": {
24
+ "value": "{size.400.value}",
25
+ "public": true,
26
+ "deprecated": false
27
+ }
28
+ }
29
+ }
package/src/shadow.json ADDED
@@ -0,0 +1,13 @@
1
+ {
2
+ "shadow": {
3
+ "boxShadow": {
4
+ "classic": {
5
+ "value": "0 0 3px 0 rgba(0, 0, 0, 0.35)",
6
+ "public": false,
7
+ "deprecated": true,
8
+ "reference": "n/a",
9
+ "version": "3.2.1"
10
+ }
11
+ }
12
+ }
13
+ }
package/src/size/radius.json ADDED
@@ -0,0 +1,9 @@
1
+ {
2
+ "border": {
3
+ "radius": {
4
+ "value": "0.375rem",
5
+ "public": true,
6
+ "deprecated": false
7
+ }
8
+ }
9
+ }
package/src/size/scale.json ADDED
@@ -0,0 +1,308 @@
1
+ {
2
+ "size": {
3
+ "font": {
4
+ "scale": {
5
+ "base": {
6
+ "60": {
7
+ "value": 0.625,
8
+ "px": {
9
+ "value": "10px"
10
+ }
11
+ },
12
+ "70": {
13
+ "value": 0.75,
14
+ "px": {
15
+ "value": "12px"
16
+ }
17
+ },
18
+ "80": {
19
+ "value": 0.875,
20
+ "px": {
21
+ "value": "14px"
22
+ }
23
+ },
24
+ "100": {
25
+ "value": 1,
26
+ "px": {
27
+ "value": "16px"
28
+ }
29
+ },
30
+ "110": {
31
+ "value": 1.125,
32
+ "px": {
33
+ "value": "18px"
34
+ }
35
+ },
36
+ "120": {
37
+ "value": 1.25,
38
+ "px": {
39
+ "value": "20px"
40
+ }
41
+ },
42
+ "130": {
43
+ "value": 1.375,
44
+ "px": {
45
+ "value": "22px"
46
+ }
47
+ },
48
+ "150": {
49
+ "value": 1.5,
50
+ "px": {
51
+ "value": "24px"
52
+ }
53
+ }
54
+ },
55
+ "responsive": {
56
+ "160": {
57
+ "value": 1.625,
58
+ "px": {
59
+ "value": "26px"
60
+ }
61
+ },
62
+ "170": {
63
+ "value": 1.75,
64
+ "px": {
65
+ "value": "28px"
66
+ }
67
+ },
68
+ "180": {
69
+ "value": 1.875,
70
+ "px": {
71
+ "value": "30px"
72
+ }
73
+ },
74
+ "200": {
75
+ "value": 2,
76
+ "px": {
77
+ "value": "32px"
78
+ }
79
+ },
80
+ "210": {
81
+ "value": 2.125,
82
+ "px": {
83
+ "value": "34px"
84
+ }
85
+ },
86
+ "220": {
87
+ "value": 2.25,
88
+ "px": {
89
+ "value": "36px"
90
+ }
91
+ },
92
+ "230": {
93
+ "value": 2.375,
94
+ "px": {
95
+ "value": "38px"
96
+ }
97
+ },
98
+ "250": {
99
+ "value": 2.5,
100
+ "px": {
101
+ "value": "40px"
102
+ }
103
+ },
104
+ "260": {
105
+ "value": 2.625,
106
+ "px": {
107
+ "value": "42px"
108
+ }
109
+ },
110
+ "270": {
111
+ "value": 2.75,
112
+ "px": {
113
+ "value": "44px"
114
+ }
115
+ },
116
+ "300": {
117
+ "value": 3.0,
118
+ "px": {
119
+ "value": "48px"
120
+ }
121
+ },
122
+ "330": {
123
+ "value": 3.375,
124
+ "px": {
125
+ "value": "54px"
126
+ }
127
+ },
128
+ "350": {
129
+ "value": 3.5,
130
+ "px": {
131
+ "value": "56px"
132
+ }
133
+ },
134
+ "370": {
135
+ "value": 3.75,
136
+ "px": {
137
+ "value": "60px"
138
+ }
139
+ },
140
+ "420": {
141
+ "value": 4.25,
142
+ "px": {
143
+ "value": "68px"
144
+ }
145
+ }
146
+ }
147
+ }
148
+ },
149
+ "none": {
150
+ "value": "0",
151
+ "comment": "Deprecated token, use 0 value",
152
+ "public": false,
153
+ "deprecated": true,
154
+ "reference": "n/a",
155
+ "version": "3.10.0"
156
+ },
157
+ "25": {
158
+ "value": 0.125,
159
+ "comment": "2px",
160
+ "public": true,
161
+ "deprecated": false
162
+ },
163
+ "50": {
164
+ "value": 0.25,
165
+ "comment": "4px",
166
+ "public": true,
167
+ "deprecated": false
168
+ },
169
+ "100": {
170
+ "value": 0.5,
171
+ "comment": "8px",
172
+ "public": true,
173
+ "deprecated": false
174
+ },
175
+ "150": {
176
+ "value": 0.75,
177
+ "comment": "12px",
178
+ "public": true,
179
+ "deprecated": false
180
+ },
181
+ "200": {
182
+ "value": 1.00,
183
+ "comment": "16px",
184
+ "public": true,
185
+ "deprecated": false
186
+ },
187
+ "300": {
188
+ "value": 1.50,
189
+ "comment": "24px",
190
+ "public": true,
191
+ "deprecated": false
192
+ },
193
+ "400": {
194
+ "value": 2.00,
195
+ "comment": "32px",
196
+ "public": true,
197
+ "deprecated": false
198
+ },
199
+ "500": {
200
+ "value": 2.50,
201
+ "comment": "40px",
202
+ "public": true,
203
+ "deprecated": false
204
+ },
205
+ "600": {
206
+ "value": 3.00,
207
+ "comment": "48px",
208
+ "public": true,
209
+ "deprecated": false
210
+ },
211
+ "700": {
212
+ "value": 3.50,
213
+ "comment": "56px",
214
+ "public": true,
215
+ "deprecated": false
216
+ },
217
+ "800": {
218
+ "value": 4.00,
219
+ "comment": "64px",
220
+ "public": true,
221
+ "deprecated": false
222
+ },
223
+ "900": {
224
+ "value": 4.50,
225
+ "comment": "72px",
226
+ "public": true,
227
+ "deprecated": false
228
+ },
229
+ "1000": {
230
+ "value": 5.00,
231
+ "comment": "80px",
232
+ "public": true,
233
+ "deprecated": false
234
+ },
235
+ "xxxs": {
236
+ "value": 0.125,
237
+ "comment": "{comments.reference.comment} auro-size-25",
238
+ "public": false,
239
+ "reference": "size-25",
240
+ "deprecated": true,
241
+ "version": "3.10.0"
242
+ },
243
+ "xxs": {
244
+ "value": 0.25,
245
+ "comment": "{comments.reference.comment} auro-size-50",
246
+ "public": false,
247
+ "reference": "size-50",
248
+ "deprecated": true,
249
+ "version": "3.10.0"
250
+ },
251
+ "xs": {
252
+ "value": 0.5,
253
+ "comment": "{comments.reference.comment} auro-size-100",
254
+ "public": false,
255
+ "reference": "size-100",
256
+ "deprecated": true,
257
+ "version": "3.10.0"
258
+ },
259
+ "sm": {
260
+ "value": 0.75,
261
+ "comment": "{comments.reference.comment} auro-size-150",
262
+ "public": false,
263
+ "reference": "size-150",
264
+ "deprecated": true,
265
+ "version": "3.10.0"
266
+ },
267
+ "md": {
268
+ "value": 1,
269
+ "comment": "{comments.reference.comment} auro-size-200",
270
+ "public": false,
271
+ "reference": "size-200",
272
+ "deprecated": true,
273
+ "version": "3.10.0"
274
+ },
275
+ "lg": {
276
+ "value": 1.5,
277
+ "comment": "{comments.reference.comment} auro-size-300",
278
+ "public": false,
279
+ "reference": "size-300",
280
+ "deprecated": true,
281
+ "version": "3.10.0"
282
+ },
283
+ "xl": {
284
+ "value": 2,
285
+ "comment": "{comments.reference.comment} auro-size-400",
286
+ "public": false,
287
+ "reference": "size-400",
288
+ "deprecated": true,
289
+ "version": "3.10.0"
290
+ },
291
+ "xxl": {
292
+ "value": 3,
293
+ "comment": "{comments.reference.comment} auro-size-600",
294
+ "reference": "size-600",
295
+ "public": false,
296
+ "deprecated": true,
297
+ "version": "3.10.0"
298
+ },
299
+ "xxxl": {
300
+ "value": 4,
301
+ "public": false,
302
+ "deprecated": true,
303
+ "version": "3.10.0",
304
+ "comment": "{comments.reference.comment} auro-size-800",
305
+ "reference": "size-800"
306
+ }
307
+ }
308
+ }
package/src/size/unitless-scale.json ADDED
@@ -0,0 +1,82 @@
1
+ {
2
+ "unitless": {
3
+ "scale": {
4
+ "20": {
5
+ "value": 0.25,
6
+ "public": true,
7
+ "deprecated": false
8
+ },
9
+ "50": {
10
+ "value": 0.5,
11
+ "public": true,
12
+ "deprecated": false
13
+ },
14
+ "100": {
15
+ "value": 1,
16
+ "public": true,
17
+ "deprecated": false
18
+ },
19
+ "120": {
20
+ "value": 1.25
21
+ },
22
+ "140": {
23
+ "value": 1.4,
24
+ "public": true,
25
+ "deprecated": false
26
+ },
27
+ "150": {
28
+ "value": 1.5,
29
+ "public": true,
30
+ "deprecated": false
31
+ },
32
+ "160": {
33
+ "value": 1.625
34
+ },
35
+ "170": {
36
+ "value": 1.75
37
+ },
38
+ "180": {
39
+ "value": 1.875
40
+ },
41
+ "200": {
42
+ "value": 2,
43
+ "public": true,
44
+ "deprecated": false
45
+ },
46
+ "210": {
47
+ "value": 2.125
48
+ },
49
+ "220": {
50
+ "value": 2.25
51
+ },
52
+ "230": {
53
+ "value": 2.375
54
+ },
55
+ "260": {
56
+ "value": 2.625
57
+ },
58
+ "270": {
59
+ "value": 2.75
60
+ },
61
+ "300": {
62
+ "value": 3,
63
+ "public": true,
64
+ "deprecated": false
65
+ },
66
+ "330": {
67
+ "value": 3.375
68
+ },
69
+ "350": {
70
+ "value": 3.5,
71
+ "public": true,
72
+ "deprecated": false
73
+ },
74
+ "370": {
75
+ "value": 3.75
76
+ },
77
+ "420": {
78
+ "value": 4.25
79
+ }
80
+ }
81
+ }
82
+ }