villa-design-tokens 1.0.174 → 1.0.176

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.
@@ -1,109 +1,49 @@
1
1
  {
2
- "fontfamily": {
3
- "body": {
4
- "value": "{fontfamily.global.simplistic}",
5
- "type": "fontFamilies"
6
- },
7
- "utility": {
8
- "value": "{fontfamily.global.helvetica}",
9
- "type": "fontFamilies"
10
- },
11
- "heading": {
12
- "value": "{fontfamily.global.simplistic}",
13
- "type": "fontFamilies"
14
- },
15
- "display": {
16
- "intro": {
17
- "value": "{fontfamily.global.simplistic}",
18
- "type": "fontFamilies"
19
- },
20
- "name": {
21
- "value": "{fontfamily.global.simplistic}",
22
- "type": "fontFamilies"
23
- },
24
- "quote": {
25
- "value": "{fontfamily.global.simplistic}",
26
- "type": "fontFamilies"
27
- },
28
- "question": {
29
- "value": "{fontfamily.global.helvetica}",
30
- "type": "fontFamilies"
31
- }
32
- }
33
- },
34
- "lineheight": {
35
- "body": {
36
- "value": "{lineheight.global.300}",
37
- "type": "lineHeights"
38
- },
39
- "utility": {
40
- "value": "{lineheight.global.100}",
41
- "type": "lineHeights"
42
- },
43
- "heading": {
44
- "value": "{lineheight.global.100}",
45
- "type": "lineHeights"
46
- },
47
- "display": {
48
- "intro": {
49
- "value": "{lineheight.global.400}",
50
- "type": "lineHeights"
51
- },
52
- "name": {
53
- "value": "{lineheight.global.100}",
54
- "type": "lineHeights"
55
- },
56
- "quote": {
57
- "value": "{lineheight.global.400}",
58
- "type": "lineHeights"
59
- },
60
- "question": {
61
- "value": "{lineheight.global.300}",
62
- "type": "lineHeights"
63
- }
64
- }
65
- },
66
- "fontweight": {
67
- "body": {
68
- "value": "{fontweight.global.400}",
69
- "type": "fontWeights"
70
- },
71
- "utility": {
72
- "value": "{fontweight.global.400}",
73
- "type": "fontWeights"
74
- },
75
- "heading": {
76
- "value": "{fontweight.global.700}",
77
- "type": "fontWeights"
78
- },
79
- "display": {
80
- "intro": {
81
- "value": "{fontweight.global.500}",
82
- "type": "fontWeights"
83
- },
84
- "name": {
85
- "value": "{fontweight.global.700}",
86
- "type": "fontWeights"
87
- },
88
- "quote": {
89
- "value": "{fontweight.global.500}",
90
- "type": "fontWeights"
91
- },
92
- "question": {
93
- "value": "{fontweight.global.700}",
94
- "type": "fontWeights"
95
- }
96
- }
97
- },
98
2
  "color": {
99
- "brand": {
3
+ "palette": {
100
4
  "primary": {
101
- "value": "{color.global.dark-blue.100}",
102
- "type": "color"
5
+ "faded": {
6
+ "value": "{color.global.orchid.25}",
7
+ "type": "color"
8
+ },
9
+ "pastel": {
10
+ "value": "{color.global.orchid.50}",
11
+ "type": "color"
12
+ },
13
+ "main": {
14
+ "value": "{color.global.orchid.100}",
15
+ "type": "color"
16
+ },
17
+ "muted": {
18
+ "value": "{color.global.orchid.150}",
19
+ "type": "color"
20
+ },
21
+ "dark": {
22
+ "value": "{color.global.orchid.200}",
23
+ "type": "color"
24
+ }
103
25
  },
104
26
  "secondary": {
105
- "value": "{color.global.grey.500}",
106
- "type": "color"
27
+ "faded": {
28
+ "value": "{color.global.radioactive.25}",
29
+ "type": "color"
30
+ },
31
+ "pastel": {
32
+ "value": "{color.global.radioactive.50}",
33
+ "type": "color"
34
+ },
35
+ "main": {
36
+ "value": "{color.global.radioactive.100}",
37
+ "type": "color"
38
+ },
39
+ "muted": {
40
+ "value": "{color.global.radioactive.150}",
41
+ "type": "color"
42
+ },
43
+ "dark": {
44
+ "value": "{color.global.radioactive.200}",
45
+ "type": "color"
46
+ }
107
47
  }
108
48
  },
109
49
  "background": {
@@ -111,26 +51,42 @@
111
51
  "value": "{color.global.grey.100}",
112
52
  "type": "color"
113
53
  },
54
+ "primary": {
55
+ "value": "{color.palette.primary.faded}",
56
+ "type": "color"
57
+ },
114
58
  "secondary": {
115
- "value": "{color.global.grey.150}",
59
+ "value": "{color.palette.primary.pastel}",
60
+ "type": "color"
61
+ },
62
+ "tertiary": {
63
+ "value": "{color.palette.secondary.faded}",
64
+ "type": "color"
65
+ },
66
+ "brand": {
67
+ "value": "{color.palette.secondary.main}",
68
+ "type": "color"
69
+ },
70
+ "dark": {
71
+ "value": "{color.palette.primary.dark}",
116
72
  "type": "color"
117
73
  },
118
- "tertiairy": {
74
+ "disabled": {
119
75
  "value": "{color.global.grey.200}",
120
76
  "type": "color"
121
77
  }
122
78
  },
123
79
  "text": {
124
- "title": {
125
- "value": "{color.global.grey.500}",
80
+ "default": {
81
+ "value": "{color.palette.primary.dark}",
126
82
  "type": "color"
127
83
  },
128
- "default": {
129
- "value": "{color.global.grey.500}",
84
+ "title": {
85
+ "value": "{color.palette.primary.muted}",
130
86
  "type": "color"
131
87
  },
132
88
  "subtle": {
133
- "value": "{color.global.grey.400}",
89
+ "value": "{color.global.grey.300}",
134
90
  "type": "color"
135
91
  },
136
92
  "disabled": {
@@ -144,11 +100,11 @@
144
100
  },
145
101
  "icon": {
146
102
  "primary": {
147
- "value": "{color.global.grey.500}",
103
+ "value": "{color.palette.primary.dark}",
148
104
  "type": "color"
149
105
  },
150
106
  "secondary": {
151
- "value": "{color.global.grey.400}",
107
+ "value": "{color.palette.primary.pastel}",
152
108
  "type": "color"
153
109
  },
154
110
  "tertiary": {
@@ -162,278 +118,416 @@
162
118
  },
163
119
  "border": {
164
120
  "default": {
165
- "value": "{color.global.grey.250}",
166
- "type": "color"
167
- },
168
- "inverse": {
169
- "value": "{color.global.grey.300}",
121
+ "value": "{color.palette.primary.faded}",
170
122
  "type": "color"
171
123
  },
172
124
  "hover": {
173
- "value": "{color.brand.primary}",
174
- "type": "color"
175
- },
176
- "active": {
177
- "value": "{color.global.dark-blue.150}",
125
+ "value": "{color.palette.secondary.main}",
178
126
  "type": "color"
179
127
  },
180
128
  "focus": {
181
- "value": "{color.brand.primary}",
129
+ "value": "{color.palette.primary.main}",
182
130
  "type": "color"
183
131
  },
184
132
  "filled": {
185
- "value": "{color.global.grey.500}",
133
+ "value": "{color.palette.primary.dark}",
134
+ "type": "color"
135
+ },
136
+ "inverse": {
137
+ "value": "{color.palette.primary.pastel}",
186
138
  "type": "color"
187
139
  }
188
140
  },
189
141
  "link": {
190
142
  "default": {
191
- "value": "{color.brand.primary}",
143
+ "value": "{color.palette.secondary.muted}",
192
144
  "type": "color"
193
145
  },
194
146
  "hover": {
195
- "value": "{color.global.dark-blue.150}",
147
+ "value": "{color.palette.secondary.main}",
196
148
  "type": "color"
197
149
  },
198
- "inverse": {
199
- "value": "{color.global.grey.100}",
200
- "type": "color"
201
- },
202
- "inverse-hover": {
203
- "value": "{color.global.grey.300}",
204
- "type": "color"
205
- },
206
- "inverse-subtle": {
207
- "value": "{color.global.grey.300}",
150
+ "active": {
151
+ "value": "{color.palette.secondary.dark}",
208
152
  "type": "color"
209
153
  },
210
- "inverse-subtle-hover": {
211
- "value": "{color.global.grey.100}",
154
+ "inverse": {
155
+ "value": "{color.palette.secondary.faded}",
212
156
  "type": "color"
213
157
  }
214
158
  },
215
- "primary": {
216
- "interactive": {
217
- "default": {
218
- "value": "{color.global.dark-blue.100}",
219
- "type": "color"
220
- },
221
- "hover": {
222
- "value": "{color.global.dark-blue.150}",
223
- "type": "color"
159
+ "interactive": {
160
+ "primary": {
161
+ "background": {
162
+ "default": {
163
+ "value": "{color.palette.secondary.main}",
164
+ "type": "color"
165
+ },
166
+ "hover": {
167
+ "value": "{color.palette.secondary.muted}",
168
+ "type": "color"
169
+ },
170
+ "active": {
171
+ "value": "{color.palette.secondary.dark}",
172
+ "type": "color"
173
+ }
224
174
  },
225
- "active": {
226
- "value": "{color.global.grey.450}",
227
- "type": "color"
175
+ "foreground": {
176
+ "default": {
177
+ "value": "{color.palette.primary.dark}",
178
+ "type": "color"
179
+ },
180
+ "hover": {
181
+ "value": "{color.palette.secondary.faded}",
182
+ "type": "color"
183
+ },
184
+ "active": {
185
+ "value": "{color.global.grey.100}",
186
+ "type": "color"
187
+ }
228
188
  }
229
189
  },
230
- "on-interactive": {
231
- "default": {
232
- "value": "{color.global.grey.100}",
233
- "type": "color"
234
- },
235
- "hover": {
236
- "value": "{color.global.grey.100}",
237
- "type": "color"
190
+ "secondary": {
191
+ "background": {
192
+ "default": {
193
+ "value": "{color.palette.secondary.main}",
194
+ "type": "color"
195
+ },
196
+ "hover": {
197
+ "value": "{color.palette.secondary.muted}",
198
+ "type": "color"
199
+ },
200
+ "active": {
201
+ "value": "{color.palette.secondary.dark}",
202
+ "type": "color"
203
+ }
238
204
  },
239
- "active": {
240
- "value": "{color.global.grey.100}",
241
- "type": "color"
205
+ "foreground": {
206
+ "default": {
207
+ "value": "{color.palette.primary.dark}",
208
+ "type": "color"
209
+ },
210
+ "hover": {
211
+ "value": "{color.palette.secondary.faded}",
212
+ "type": "color"
213
+ },
214
+ "active": {
215
+ "value": "{color.global.grey.100}",
216
+ "type": "color"
217
+ }
242
218
  }
243
219
  },
244
- "border": {
245
- "default": {
246
- "value": "{color.global.dark-blue.100}",
247
- "type": "color"
248
- },
249
- "hover": {
250
- "value": "{color.global.dark-blue.150}",
251
- "type": "color"
220
+ "tertiary": {
221
+ "background": {
222
+ "default": {
223
+ "value": "{color.transparent.0}",
224
+ "type": "color"
225
+ },
226
+ "hover": {
227
+ "value": "{color.palette.secondary.muted}",
228
+ "type": "color"
229
+ },
230
+ "active": {
231
+ "value": "{color.palette.secondary.dark}",
232
+ "type": "color"
233
+ }
252
234
  },
253
- "active": {
254
- "value": "{color.global.grey.450}",
255
- "type": "color"
235
+ "foreground": {
236
+ "default": {
237
+ "value": "{color.palette.secondary.main}",
238
+ "type": "color"
239
+ },
240
+ "hover": {
241
+ "value": "{color.palette.secondary.faded}",
242
+ "type": "color"
243
+ },
244
+ "active": {
245
+ "value": "{color.global.grey.100}",
246
+ "type": "color"
247
+ }
256
248
  }
257
249
  }
258
250
  },
259
- "secondary": {
260
- "interactive": {
261
- "default": {
262
- "value": "{color.transparent.0}",
263
- "type": "color"
264
- },
265
- "hover": {
266
- "value": "{color.global.dark-blue.150}",
267
- "type": "color"
268
- },
269
- "active": {
270
- "value": "{color.global.grey.450}",
271
- "type": "color"
251
+ "surface": {
252
+ "primary": {
253
+ "background": {
254
+ "value": "{color.palette.primary.faded}",
255
+ "type": "color"
256
+ },
257
+ "text": {
258
+ "default": {
259
+ "value": "{color.palette.primary.dark}",
260
+ "type": "color"
261
+ },
262
+ "subtle": {
263
+ "value": "{color.palette.primary.muted}",
264
+ "type": "color"
265
+ },
266
+ "title": {
267
+ "value": "{color.palette.primary.main}",
268
+ "type": "color"
269
+ },
270
+ "link": {
271
+ "value": "{color.palette.primary.main}",
272
+ "type": "color"
273
+ },
274
+ "hover": {
275
+ "value": "{color.palette.primary.muted}",
276
+ "type": "color"
277
+ }
278
+ },
279
+ "interactive": {
280
+ "background": {
281
+ "value": "{color.palette.primary.main}",
282
+ "type": "color"
283
+ },
284
+ "foreground": {
285
+ "value": "{color.palette.primary.faded}",
286
+ "type": "color"
287
+ },
288
+ "hover-background": {
289
+ "value": "{color.palette.secondary.muted}",
290
+ "type": "color"
291
+ },
292
+ "hover-foreground": {
293
+ "value": "{color.palette.primary.faded}",
294
+ "type": "color"
295
+ }
272
296
  }
273
297
  },
274
- "on-interactive": {
275
- "default": {
276
- "value": "{color.global.dark-blue.100}",
277
- "type": "color"
278
- },
279
- "hover": {
280
- "value": "{color.global.grey.100}",
281
- "type": "color"
282
- },
283
- "active": {
284
- "value": "{color.global.grey.100}",
285
- "type": "color"
298
+ "secondary": {
299
+ "background": {
300
+ "value": "{color.palette.secondary.faded}",
301
+ "type": "color"
302
+ },
303
+ "text": {
304
+ "default": {
305
+ "value": "{color.palette.primary.dark}",
306
+ "type": "color"
307
+ },
308
+ "subtle": {
309
+ "value": "{color.palette.secondary.muted}",
310
+ "type": "color"
311
+ },
312
+ "title": {
313
+ "value": "{color.palette.secondary.dark}",
314
+ "type": "color"
315
+ },
316
+ "link": {
317
+ "value": "{color.palette.secondary.muted}",
318
+ "type": "color"
319
+ },
320
+ "hover": {
321
+ "value": "{color.palette.primary.muted}",
322
+ "type": "color"
323
+ }
324
+ },
325
+ "interactive": {
326
+ "background": {
327
+ "value": "{color.palette.primary.main}",
328
+ "type": "color"
329
+ },
330
+ "foreground": {
331
+ "value": "{color.palette.primary.faded}",
332
+ "type": "color"
333
+ },
334
+ "hover-background": {
335
+ "value": "{color.palette.secondary.muted}",
336
+ "type": "color"
337
+ },
338
+ "hover-foreground": {
339
+ "value": "{color.palette.secondary.faded}",
340
+ "type": "color"
341
+ }
286
342
  }
287
343
  },
288
- "border": {
289
- "default": {
290
- "value": "{color.global.dark-blue.100}",
291
- "type": "color"
292
- },
293
- "hover": {
294
- "value": "{color.global.dark-blue.150}",
295
- "type": "color"
296
- },
297
- "active": {
298
- "value": "{color.global.grey.450}",
299
- "type": "color"
344
+ "alt-primary": {
345
+ "background": {
346
+ "value": "{color.palette.primary.main}",
347
+ "type": "color"
348
+ },
349
+ "text": {
350
+ "default": {
351
+ "value": "{color.global.grey.100}",
352
+ "type": "color"
353
+ },
354
+ "subtle": {
355
+ "value": "{color.palette.primary.faded}",
356
+ "type": "color"
357
+ },
358
+ "title": {
359
+ "value": "{color.palette.primary.faded}",
360
+ "type": "color"
361
+ },
362
+ "link": {
363
+ "value": "{color.palette.secondary.faded}",
364
+ "type": "color"
365
+ },
366
+ "hover": {
367
+ "value": "{color.palette.secondary.main}",
368
+ "type": "color"
369
+ }
370
+ },
371
+ "interactive": {
372
+ "background": {
373
+ "value": "{color.palette.secondary.main}",
374
+ "type": "color"
375
+ },
376
+ "foreground": {
377
+ "value": "{color.palette.primary.dark}",
378
+ "type": "color"
379
+ },
380
+ "hover-background": {
381
+ "value": "{color.palette.secondary.muted}",
382
+ "type": "color"
383
+ },
384
+ "hover-foreground": {
385
+ "value": "{color.palette.secondary.faded}",
386
+ "type": "color"
387
+ }
388
+ }
389
+ },
390
+ "alt-secondary": {
391
+ "background": {
392
+ "value": "{color.palette.secondary.main}",
393
+ "type": "color"
394
+ },
395
+ "text": {
396
+ "default": {
397
+ "value": "{color.palette.primary.dark}",
398
+ "type": "color"
399
+ },
400
+ "subtle": {
401
+ "value": "{color.palette.secondary.muted}",
402
+ "type": "color"
403
+ },
404
+ "title": {
405
+ "value": "{color.palette.secondary.dark}",
406
+ "type": "color"
407
+ },
408
+ "link": {
409
+ "value": "{color.palette.primary.main}",
410
+ "type": "color"
411
+ },
412
+ "hover": {
413
+ "value": "{color.palette.primary.muted}",
414
+ "type": "color"
415
+ }
416
+ },
417
+ "interactive": {
418
+ "background": {
419
+ "value": "{color.palette.primary.main}",
420
+ "type": "color"
421
+ },
422
+ "foreground": {
423
+ "value": "{color.palette.primary.faded}",
424
+ "type": "color"
425
+ },
426
+ "hover-background": {
427
+ "value": "{color.palette.secondary.muted}",
428
+ "type": "color"
429
+ },
430
+ "hover-foreground": {
431
+ "value": "{color.palette.secondary.faded}",
432
+ "type": "color"
433
+ }
300
434
  }
301
435
  }
436
+ }
437
+ },
438
+ "fontfamily": {
439
+ "body": {
440
+ "value": "{fontfamily.global.simplistic}",
441
+ "type": "fontFamilies"
302
442
  },
303
- "tertiary": {
304
- "interactive": {
305
- "default": {
306
- "value": "{color.transparent.0}",
307
- "type": "color"
308
- },
309
- "hover": {
310
- "value": "{color.global.dark-blue.150}",
311
- "type": "color"
312
- },
313
- "active": {
314
- "value": "{color.global.grey.450}",
315
- "type": "color"
316
- }
443
+ "utility": {
444
+ "value": "{fontfamily.global.helvetica}",
445
+ "type": "fontFamilies"
446
+ },
447
+ "heading": {
448
+ "value": "{fontfamily.global.simplistic}",
449
+ "type": "fontFamilies"
450
+ },
451
+ "display": {
452
+ "intro": {
453
+ "value": "{fontfamily.global.simplistic}",
454
+ "type": "fontFamilies"
317
455
  },
318
- "on-interactive": {
319
- "default": {
320
- "value": "{color.global.dark-blue.100}",
321
- "type": "color"
322
- },
323
- "hover": {
324
- "value": "{color.global.grey.100}",
325
- "type": "color"
326
- },
327
- "active": {
328
- "value": "{color.global.grey.100}",
329
- "type": "color"
330
- }
456
+ "name": {
457
+ "value": "{fontfamily.global.simplistic}",
458
+ "type": "fontFamilies"
331
459
  },
332
- "border": {
333
- "default": {
334
- "value": "{color.transparent.0}",
335
- "type": "color"
336
- },
337
- "hover": {
338
- "value": "{color.global.dark-blue.150}",
339
- "type": "color"
340
- },
341
- "active": {
342
- "value": "{color.global.grey.450}",
343
- "type": "color"
344
- }
460
+ "quote": {
461
+ "value": "{fontfamily.global.simplistic}",
462
+ "type": "fontFamilies"
463
+ },
464
+ "question": {
465
+ "value": "{fontfamily.global.helvetica}",
466
+ "type": "fontFamilies"
345
467
  }
468
+ }
469
+ },
470
+ "lineheight": {
471
+ "body": {
472
+ "value": "{lineheight.global.300}",
473
+ "type": "lineHeights"
346
474
  },
347
- "surface": {
348
- "brand": {
349
- "background": {
350
- "value": "{color.brand.primary}",
351
- "type": "color"
352
- },
353
- "foreground": {
354
- "value": "{color.global.grey.100}",
355
- "type": "color"
356
- },
357
- "hover": {
358
- "value": "{color.transparent.50}",
359
- "type": "color"
360
- },
361
- "active": {
362
- "value": "{color.transparent.75}",
363
- "type": "color"
364
- }
475
+ "utility": {
476
+ "value": "{lineheight.global.100}",
477
+ "type": "lineHeights"
478
+ },
479
+ "heading": {
480
+ "value": "{lineheight.global.100}",
481
+ "type": "lineHeights"
482
+ },
483
+ "display": {
484
+ "intro": {
485
+ "value": "{lineheight.global.400}",
486
+ "type": "lineHeights"
365
487
  },
366
- "primary": {
367
- "background": {
368
- "value": "{color.global.grey.150}",
369
- "type": "color"
370
- },
371
- "foreground": {
372
- "value": "{color.global.grey.500}",
373
- "type": "color"
374
- },
375
- "hover": {
376
- "value": "{color.transparent-dark.50}",
377
- "type": "color"
378
- },
379
- "active": {
380
- "value": "{color.transparent-dark.75}",
381
- "type": "color"
382
- }
488
+ "name": {
489
+ "value": "{lineheight.global.100}",
490
+ "type": "lineHeights"
383
491
  },
384
- "secondary": {
385
- "background": {
386
- "value": "{color.global.grey.100}",
387
- "type": "color"
388
- },
389
- "foreground": {
390
- "value": "{color.global.grey.500}",
391
- "type": "color"
392
- },
393
- "hover": {
394
- "value": "{color.transparent-dark.50}",
395
- "type": "color"
396
- },
397
- "active": {
398
- "value": "{color.transparent-dark.75}",
399
- "type": "color"
400
- }
492
+ "quote": {
493
+ "value": "{lineheight.global.400}",
494
+ "type": "lineHeights"
401
495
  },
402
- "tertiary": {
403
- "background": {
404
- "value": "{color.global.grey.300}",
405
- "type": "color"
406
- },
407
- "foreground": {
408
- "value": "{color.global.grey.500}",
409
- "type": "color"
410
- },
411
- "hover": {
412
- "value": "{color.transparent-dark.50}",
413
- "type": "color"
414
- },
415
- "active": {
416
- "value": "{color.transparent-dark.75}",
417
- "type": "color"
418
- }
496
+ "question": {
497
+ "value": "{lineheight.global.300}",
498
+ "type": "lineHeights"
499
+ }
500
+ }
501
+ },
502
+ "fontweight": {
503
+ "body": {
504
+ "value": "{fontweight.global.400}",
505
+ "type": "fontWeights"
506
+ },
507
+ "utility": {
508
+ "value": "{fontweight.global.400}",
509
+ "type": "fontWeights"
510
+ },
511
+ "heading": {
512
+ "value": "{fontweight.global.700}",
513
+ "type": "fontWeights"
514
+ },
515
+ "display": {
516
+ "intro": {
517
+ "value": "{fontweight.global.500}",
518
+ "type": "fontWeights"
419
519
  },
420
- "dark": {
421
- "background": {
422
- "value": "{color.global.grey.500}",
423
- "type": "color"
424
- },
425
- "foreground": {
426
- "value": "{color.global.grey.100}",
427
- "type": "color"
428
- },
429
- "hover": {
430
- "value": "{color.transparent.50}",
431
- "type": "color"
432
- },
433
- "active": {
434
- "value": "{color.transparent.75}",
435
- "type": "color"
436
- }
520
+ "name": {
521
+ "value": "{fontweight.global.700}",
522
+ "type": "fontWeights"
523
+ },
524
+ "quote": {
525
+ "value": "{fontweight.global.500}",
526
+ "type": "fontWeights"
527
+ },
528
+ "question": {
529
+ "value": "{fontweight.global.700}",
530
+ "type": "fontWeights"
437
531
  }
438
532
  }
439
533
  }