@aurodesignsystem/design-tokens 4.4.0 → 4.5.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 (47) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/README.md +26 -23
  3. package/dist/tokens/CSSCustomProperties.css +1541 -64
  4. package/dist/tokens/CSSSizeCustomProperties.css +1 -1
  5. package/dist/tokens/JSData--color.js +16496 -2089
  6. package/dist/tokens/JSONVariablesFlat.json +470 -33
  7. package/dist/tokens/JSONVariablesNested.json +733 -48
  8. package/dist/tokens/JSObject--allTokens.js +13602 -2331
  9. package/dist/tokens/JSObject--deprecated.js +2266 -1897
  10. package/dist/tokens/JSVariables--color.js +736 -39
  11. package/dist/tokens/SCSSVariableMap.scss +1 -1
  12. package/dist/tokens/SCSSVariables.scss +1003 -46
  13. package/dist/tokens/SCSSVariablesMapFlat.scss +1006 -47
  14. package/dist/tokens/SassCustomProperties.scss +1541 -64
  15. package/dist/tokens/SassSizeCustomProperties.scss +1 -1
  16. package/dist/tokens/darkmode/CSSCustomProperties.css +4 -4
  17. package/dist/tokens/darkmode/JSDataColor.js +94 -30
  18. package/dist/tokens/darkmode/{JSObject--allDarkTokens.js → JSObject--deprecatedDark.js} +107 -43
  19. package/dist/tokens/darkmode/JSVariablesColor.js +4 -4
  20. package/dist/tokens/darkmode/SCSSVariables.scss +4 -4
  21. package/dist/tokens/darkmode/SCSSVariablesMapFlat.scss +4 -4
  22. package/dist/tokens/darkmode/SassCustomProperties.scss +4 -4
  23. package/dist/tokens/excursion/JSONVariablesFlat.json +67 -0
  24. package/dist/tokens/excursion/JSONVariablesNested.json +105 -0
  25. package/package.json +5 -5
  26. package/src/color/alert.json +18 -103
  27. package/src/color/background.json +213 -10
  28. package/src/color/base.json +1219 -70
  29. package/src/color/border.json +253 -133
  30. package/src/color/brand.json +1204 -185
  31. package/src/color/container.json +464 -0
  32. package/src/color/icon.json +449 -91
  33. package/src/color/text.json +200 -145
  34. package/src/color/tier.json +118 -52
  35. package/src/color/ui.json +29 -115
  36. package/src/color-darkmode/base.json +6 -2
  37. package/src/color-darkmode/border.json +6 -2
  38. package/src/color-darkmode/icon.json +6 -2
  39. package/src/color-darkmode/text.json +15 -5
  40. package/src/color-darkmode/tier.json +6 -2
  41. package/src/depth.json +0 -7
  42. package/src/size/scale.json +0 -80
  43. package/src/themes/excursion/color/background.json +73 -0
  44. package/src/themes/excursion/color/base.json +234 -0
  45. package/src/themes/excursion/color/brand.json +254 -0
  46. package/src/breakpoint.json +0 -28
  47. package/src/shadow.json +0 -13
package/src/color/border.json CHANGED
@@ -2,36 +2,14 @@
2
2
  "color": {
3
3
  "border": {
4
4
  "primary": {
5
- "onLight": {
6
- "value": "{color.brand.neutral.500.value}",
7
- "public": false,
8
- "onLight": true,
9
- "usage": "Primary border color on light backgrounds",
10
- "wcag": "n/a",
11
- "deprecated": true,
12
- "comment": "Deprecated token",
13
- "reference": "color-border-primary-default",
14
- "version": "3.15.0"
15
- },
16
5
  "default": {
17
- "value": "{color.brand.neutral.500.value}",
6
+ "value": "{color.brand.neutral.800.value}",
18
7
  "public": true,
19
8
  "default": true,
20
9
  "usage": "Primary border color on light backgrounds",
21
10
  "wcag": "n/a",
22
11
  "deprecated": false
23
12
  },
24
- "onDark": {
25
- "value": "{color.brand.neutral.400.value}",
26
- "public": false,
27
- "onDark": true,
28
- "usage": "Primary border color on dark background",
29
- "wcag": "n/a",
30
- "deprecated": true,
31
- "comment": "Deprecated token",
32
- "reference": "color-border-primary-inverse",
33
- "version": "3.15.0"
34
- },
35
13
  "inverse": {
36
14
  "value": "{color.brand.neutral.400.value}",
37
15
  "public": true,
@@ -41,179 +19,321 @@
41
19
  "deprecated": false
42
20
  }
43
21
  },
44
- "active": {
45
- "onLight": {
46
- "value": "{color.brand.atlas.400.value}",
47
- "public": false,
48
- "onLight": true,
49
- "usage": "Active border color on light backgrounds",
50
- "wcag": "n/a",
51
- "deprecated": true,
52
- "comment": "Deprecated token",
53
- "reference": "color-border-active-default",
54
- "version": "3.15.0"
55
- },
22
+ "secondary": {
56
23
  "default": {
57
- "value": "{color.brand.atlas.400.value}",
24
+ "value": "{color.brand.neutral.500.value}",
58
25
  "public": true,
59
26
  "default": true,
60
- "usage": "Active border color on light backgrounds",
27
+ "usage": "Secondary border color on light backgrounds",
61
28
  "wcag": "n/a",
62
29
  "deprecated": false
63
30
  },
64
- "onDark": {
65
- "value": "{color.brand.breeze.300.value}",
66
- "public": false,
67
- "onDark": true,
68
- "usage": "Active border color on dark backgrounds",
31
+ "inverse": {
32
+ "value": "{color.brand.neutral.600.value}",
33
+ "public": true,
34
+ "inverse": true,
35
+ "usage": "Secondary border color on dark background",
69
36
  "wcag": "n/a",
70
- "deprecated": true,
71
- "comment": "Deprecated token",
72
- "reference": "n/a",
73
- "version": "3.12.0"
37
+ "deprecated": false
38
+ }
39
+ },
40
+ "tertiary": {
41
+ "default": {
42
+ "value": "{color.brand.gray.200.value}",
43
+ "public": true,
44
+ "default": true,
45
+ "usage": "Tertiary border color on light backgrounds",
46
+ "wcag": "n/a",
47
+ "deprecated": false
74
48
  },
75
49
  "inverse": {
76
- "value": "{color.brand.breeze.300.value}",
50
+ "value": "{color.brand.gray.700.value}",
77
51
  "public": true,
78
52
  "inverse": true,
79
- "usage": "Active border color on dark backgrounds",
53
+ "usage": "Tertiary border color on dark background",
54
+ "wcag": "n/a",
80
55
  "deprecated": false
81
56
  }
82
57
  },
83
58
  "error": {
84
- "onLight": {
85
- "value": "{color.state.error.500.value}",
86
- "public": false,
87
- "onLight": true,
88
- "usage": "Error states border color on light backgrounds",
59
+ "default": {
60
+ "value": "{color.base.error.400.value}",
61
+ "public": true,
62
+ "default": true,
63
+ "usage": "Error border color on light backgrounds",
89
64
  "wcag": "n/a",
90
- "deprecated": true,
91
- "comment": "Deprecated token",
92
- "reference": "color-border-error-default",
93
- "version": "3.15.0"
65
+ "deprecated": false
94
66
  },
67
+ "inverse": {
68
+ "value": "{color.base.error.200.value}",
69
+ "public": true,
70
+ "inverse": true,
71
+ "usage": "Error border color on dark backgrounds",
72
+ "wcag": "n/a",
73
+ "deprecated": false
74
+ }
75
+ },
76
+ "divider": {
95
77
  "default": {
96
- "value": "{color.state.error.500.value}",
78
+ "value": "{color.base.black-200.value}",
97
79
  "public": true,
98
80
  "default": true,
99
- "usage": "Error states border color on light backgrounds",
81
+ "usage": "Strict use as divider between elements on light backgrounds",
100
82
  "wcag": "n/a",
101
83
  "deprecated": false
102
84
  },
103
- "onDark": {
104
- "value": "{color.state.error.100.value}",
105
- "public": false,
106
- "onDark": true,
107
- "usage": "Error states border color on dark background",
85
+ "inverse": {
86
+ "value": "{color.base.white-200.value}",
87
+ "public": true,
88
+ "inverse": true,
89
+ "usage": "Strict use as divider between elements on dark backgrounds",
108
90
  "wcag": "n/a",
109
- "deprecated": true,
110
- "comment": "Deprecated token",
111
- "reference": "n/a",
112
- "version": "3.12.0"
91
+ "deprecated": false
113
92
  }
114
93
  },
115
- "disabled": {
116
- "onLight": {
117
- "value": "{color.base.gray.200.value}",
118
- "public": false,
119
- "onLight": true,
120
- "usage": "Disabled border color on light backgrounds",
94
+ "subtle": {
95
+ "default": {
96
+ "value": "{color.brand.blue.100.value}",
97
+ "public": true,
98
+ "default": true,
99
+ "usage": "Subtle border color on light backgrounds",
121
100
  "wcag": "n/a",
122
- "deprecated": true,
123
- "comment": "Deprecated token",
124
- "reference": "color-border-disabled-default",
125
- "version": "3.15.0"
101
+ "deprecated": false
126
102
  },
103
+ "inverse": {
104
+ "value": "{color.base.navy.700.value}",
105
+ "public": true,
106
+ "inverse": true,
107
+ "usage": "Subtle border color on dark backgrounds",
108
+ "wcag": "n/a",
109
+ "deprecated": false
110
+ }
111
+ },
112
+ "emphasis": {
127
113
  "default": {
128
- "value": "{color.base.gray.200.value}",
114
+ "value": "{color.brand.navy.900.value}",
129
115
  "public": true,
130
116
  "default": true,
131
- "usage": "Disabled border color on light backgrounds",
117
+ "usage": "Emphasis border color on light backgrounds",
132
118
  "wcag": "n/a",
133
119
  "deprecated": false
134
120
  },
135
- "onDark": {
136
- "value": "{color.base.gray.200.value}",
137
- "public": false,
138
- "onDark": true,
139
- "usage": "Disabled border color on dark background",
121
+ "inverse": {
122
+ "value": "{color.brand.navy.100.value}",
123
+ "public": true,
124
+ "inverse": true,
125
+ "usage": "Emphasis border color on dark backgrounds",
140
126
  "wcag": "n/a",
141
- "deprecated": true,
142
- "comment": "Deprecated token",
143
- "reference": "n/a",
144
- "version": "3.12.0"
127
+ "deprecated": false
145
128
  }
146
129
  },
147
- "Focus": {
148
- "onLight": {
149
- "value": "{color.base.gray.500.value}",
150
- "public": false,
151
- "onLight": true,
152
- "usage": "Focus border color for light backgrounds",
130
+ "accent": {
131
+ "default": {
132
+ "value": "{color.brand.lime.300.value}",
133
+ "public": true,
134
+ "default": true,
135
+ "usage": "Accent border color on light backgrounds",
153
136
  "wcag": "n/a",
154
- "deprecated": true,
155
- "comment": "Deprecated token",
156
- "reference": "color-border-focus-default",
157
- "version": "3.15.0"
137
+ "deprecated": false
158
138
  },
139
+ "inverse": {
140
+ "value": "{color.brand.lime.400.value}",
141
+ "public": true,
142
+ "inverse": true,
143
+ "usage": "Accent border color on dark backgrounds",
144
+ "wcag": "n/a",
145
+ "deprecated": false
146
+ }
147
+ },
148
+ "success": {
159
149
  "default": {
160
- "value": "{color.base.gray.500.value}",
150
+ "value": "{color.base.success.400.value}",
161
151
  "public": true,
162
152
  "default": true,
163
- "usage": "Focus border color for light backgrounds",
153
+ "usage": "Success border color on light backgrounds",
164
154
  "wcag": "n/a",
165
155
  "deprecated": false
166
156
  },
167
- "onDark": {
168
- "value": "{color.base.white.value}",
169
- "public": false,
170
- "onDark": true,
171
- "usage": "Focus border color for dark backgrounds",
157
+ "inverse": {
158
+ "value": "{color.base.success.200.value}",
159
+ "public": true,
160
+ "inverse": true,
161
+ "usage": "Success border color on dark backgrounds",
172
162
  "wcag": "n/a",
173
- "deprecated": true,
174
- "comment": "Deprecated token",
175
- "reference": "n/a",
176
- "version": "3.12.0"
163
+ "deprecated": false
177
164
  }
178
165
  },
179
- "divider": {
180
- "onLight": {
181
- "value": "{color.base.black-opacity-15.value}",
182
- "public": false,
183
- "onLight": true,
184
- "usage": "Strict use as divider between elements on light backgrounds",
166
+ "warning": {
167
+ "default": {
168
+ "value": "{color.base.warning.100.value}",
169
+ "public": true,
170
+ "default": true,
171
+ "usage": "Warning border color on light backgrounds",
185
172
  "wcag": "n/a",
186
- "deprecated": true,
187
- "comment": "Deprecated token",
188
- "reference": "color-border-divider-default",
189
- "version": "3.15.0"
173
+ "deprecated": false
190
174
  },
175
+ "inverse": {
176
+ "value": "{color.base.warning.200.value}",
177
+ "public": true,
178
+ "inverse": true,
179
+ "usage": "Warning border color on dark backgrounds",
180
+ "wcag": "n/a",
181
+ "deprecated": false
182
+ }
183
+ },
184
+ "info": {
191
185
  "default": {
192
- "value": "{color.base.black-opacity-15.value}",
186
+ "value": "{color.brand.navy.700.value}",
193
187
  "public": true,
194
188
  "default": true,
195
- "usage": "Strict use as divider between elements on light backgrounds",
189
+ "usage": "Info border color on light backgrounds",
196
190
  "wcag": "n/a",
197
191
  "deprecated": false
198
192
  },
199
- "onDark": {
200
- "value": "{color.base.white.value}",
201
- "public": false,
202
- "onDark": true,
203
- "usage": "Strict use as divider between elements on dark backgrounds",
193
+ "inverse": {
194
+ "value": "{color.brand.navy.400.value}",
195
+ "public": true,
196
+ "inverse": true,
197
+ "usage": "Info border color on dark backgrounds",
198
+ "wcag": "n/a",
199
+ "deprecated": false
200
+ }
201
+ },
202
+ "ui": {
203
+ "default": {
204
+ "default": {
205
+ "value": "{color.brand.blue.700.value}",
206
+ "public": true,
207
+ "default": true,
208
+ "usage": "Default UI border color on light backgrounds",
209
+ "wcag": "n/a",
210
+ "deprecated": false
211
+ },
212
+ "inverse": {
213
+ "value": "{color.brand.cyan.400.value}",
214
+ "public": true,
215
+ "inverse": true,
216
+ "usage": "Default UI border color on dark backgrounds",
217
+ "wcag": "n/a",
218
+ "deprecated": false
219
+ }
220
+ },
221
+ "hover": {
222
+ "default": {
223
+ "value": "{color.brand.blue.900.value}",
224
+ "public": true,
225
+ "default": true,
226
+ "usage": "Hover UI border color on light backgrounds",
227
+ "wcag": "n/a",
228
+ "deprecated": false
229
+ },
230
+ "inverse": {
231
+ "value": "{color.brand.cyan.200.value}",
232
+ "public": true,
233
+ "inverse": true,
234
+ "usage": "Hover UI border color on dark backgrounds",
235
+ "wcag": "n/a",
236
+ "deprecated": false
237
+ }
238
+ },
239
+ "active": {
240
+ "default": {
241
+ "value": "{color.brand.blue.800.value}",
242
+ "public": true,
243
+ "default": true,
244
+ "usage": "Active UI border color on light backgrounds",
245
+ "wcag": "n/a",
246
+ "deprecated": false
247
+ },
248
+ "inverse": {
249
+ "value": "{color.brand.cyan.300.value}",
250
+ "public": true,
251
+ "inverse": true,
252
+ "usage": "Active UI border color on dark backgrounds",
253
+ "wcag": "n/a",
254
+ "deprecated": false
255
+ }
256
+ },
257
+ "focus": {
258
+ "default": {
259
+ "value": "{color.brand.blue.700.value}",
260
+ "public": true,
261
+ "default": true,
262
+ "usage": "Focus UI border color on light backgrounds",
263
+ "wcag": "n/a",
264
+ "deprecated": false
265
+ },
266
+ "inverse": {
267
+ "value": "{color.brand.cyan.400.value}",
268
+ "public": true,
269
+ "inverse": true,
270
+ "usage": "Focus UI border color on dark backgrounds",
271
+ "wcag": "n/a",
272
+ "deprecated": false
273
+ }
274
+ },
275
+ "disabled": {
276
+ "default": {
277
+ "value": "{color.brand.gray.400.value}",
278
+ "public": true,
279
+ "default": true,
280
+ "usage": "Disabled UI border color on light backgrounds",
281
+ "wcag": "n/a",
282
+ "deprecated": false
283
+ },
284
+ "inverse": {
285
+ "value": "{color.brand.gray.600.value}",
286
+ "public": true,
287
+ "inverse": true,
288
+ "usage": "Disabled UI border color on dark backgrounds",
289
+ "wcag": "n/a",
290
+ "deprecated": false
291
+ }
292
+ }
293
+ },
294
+ "active": {
295
+ "default": {
296
+ "value": "{color.brand.atlas.400.value}",
297
+ "public": true,
298
+ "default": true,
299
+ "usage": "Active border color on light backgrounds",
204
300
  "wcag": "n/a",
205
301
  "deprecated": true,
206
- "comment": "Deprecated token",
207
- "reference": "color-border-divider-inverse",
208
- "version": "3.15.0"
302
+ "version": "4.5.0",
303
+ "reference": "n/a"
209
304
  },
210
305
  "inverse": {
211
- "value": "{color.base.white.value}",
306
+ "value": "{color.brand.breeze.300.value}",
212
307
  "public": true,
213
308
  "inverse": true,
214
- "usage": "Strict use as divider between elements on dark backgrounds",
309
+ "usage": "Active border color on dark backgrounds",
310
+ "deprecated": true,
311
+ "version": "4.5.0",
312
+ "reference": "n/a"
313
+ }
314
+ },
315
+ "disabled": {
316
+ "default": {
317
+ "value": "{color.base.gray.200.value}",
318
+ "public": true,
319
+ "default": true,
320
+ "usage": "Disabled border color on light backgrounds",
215
321
  "wcag": "n/a",
216
- "deprecated": false
322
+ "deprecated": true,
323
+ "version": "4.5.0",
324
+ "reference": "n/a"
325
+ }
326
+ },
327
+ "focus": {
328
+ "default": {
329
+ "value": "{color.base.gray.500.value}",
330
+ "public": true,
331
+ "default": true,
332
+ "usage": "Focus border color for light backgrounds",
333
+ "wcag": "n/a",
334
+ "deprecated": true,
335
+ "version": "4.5.0",
336
+ "reference": "n/a"
217
337
  }
218
338
  }
219
339
  }