@phcdevworks/spectre-tokens 2.1.1 → 2.2.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.
package/dist/index.js CHANGED
@@ -2,1122 +2,349 @@
2
2
  var coreTokens = {
3
3
  "component": {
4
4
  "card": {
5
- "text": {
6
- "value": "{colors.neutral.900}"
7
- },
8
- "textMuted": {
9
- "value": "{colors.neutral.500}"
10
- }
5
+ "text": "{colors.neutral.900}",
6
+ "textMuted": "{colors.neutral.500}"
11
7
  },
12
8
  "input": {
13
- "text": {
14
- "value": "{colors.neutral.900}"
15
- },
16
- "placeholder": {
17
- "value": "{colors.neutral.400}"
18
- }
9
+ "text": "{colors.neutral.900}",
10
+ "placeholder": "{colors.neutral.500}"
19
11
  },
20
12
  "button": {
21
- "textDefault": {
22
- "value": "{colors.neutral.900}"
23
- },
24
- "textOnPrimary": {
25
- "value": "{colors.white}"
26
- }
13
+ "textDefault": "{colors.neutral.900}",
14
+ "textOnPrimary": "{colors.white}"
27
15
  },
28
16
  "badge": {
29
- "neutralBg": {
30
- "value": "{colors.neutral.100}",
31
- "metadata": {
32
- "pair": "component.badge.neutralText"
33
- }
34
- },
35
- "neutralBgHover": {
36
- "value": "{colors.neutral.200}",
37
- "metadata": {
38
- "pair": "component.badge.neutralText"
39
- }
40
- },
41
- "neutralText": {
42
- "value": "{colors.neutral.700}"
43
- },
44
- "infoBg": {
45
- "value": "{colors.info.100}",
46
- "metadata": {
47
- "pair": "component.badge.infoText"
48
- }
49
- },
50
- "infoBgHover": {
51
- "value": "{colors.info.200}",
52
- "metadata": {
53
- "pair": "component.badge.infoText"
54
- }
55
- },
56
- "infoText": {
57
- "value": "{colors.info.700}"
58
- },
59
- "successBg": {
60
- "value": "{colors.success.100}",
61
- "metadata": {
62
- "pair": "component.badge.successText"
63
- }
64
- },
65
- "successBgHover": {
66
- "value": "{colors.success.200}",
67
- "metadata": {
68
- "pair": "component.badge.successText"
69
- }
70
- },
71
- "successText": {
72
- "value": "{colors.success.800}"
73
- },
74
- "warningBg": {
75
- "value": "{colors.warning.100}",
76
- "metadata": {
77
- "pair": "component.badge.warningText"
78
- }
79
- },
80
- "warningBgHover": {
81
- "value": "{colors.warning.200}",
82
- "metadata": {
83
- "pair": "component.badge.warningText"
84
- }
85
- },
86
- "warningText": {
87
- "value": "{colors.warning.800}"
88
- },
89
- "dangerBg": {
90
- "value": "{colors.error.100}",
91
- "metadata": {
92
- "pair": "component.badge.dangerText"
93
- }
94
- },
95
- "dangerBgHover": {
96
- "value": "{colors.error.200}",
97
- "metadata": {
98
- "pair": "component.badge.dangerText"
99
- }
100
- },
101
- "dangerText": {
102
- "value": "{colors.error.800}"
103
- }
17
+ "neutralBg": "{colors.neutral.100}",
18
+ "neutralBgHover": "{colors.neutral.200}",
19
+ "neutralText": "{colors.neutral.700}",
20
+ "infoBg": "{colors.info.100}",
21
+ "infoBgHover": "{colors.info.200}",
22
+ "infoText": "{colors.info.700}",
23
+ "successBg": "{colors.success.100}",
24
+ "successBgHover": "{colors.success.200}",
25
+ "successText": "{colors.success.800}",
26
+ "warningBg": "{colors.warning.100}",
27
+ "warningBgHover": "{colors.warning.200}",
28
+ "warningText": "{colors.warning.800}",
29
+ "dangerBg": "{colors.error.100}",
30
+ "dangerBgHover": "{colors.error.200}",
31
+ "dangerText": "{colors.error.800}"
104
32
  },
105
33
  "iconBox": {
106
- "bg": {
107
- "value": "{colors.white}"
108
- },
109
- "border": {
110
- "value": "{colors.neutral.200}"
111
- },
112
- "iconDefault": {
113
- "value": "{colors.info.600}"
114
- },
115
- "iconSuccess": {
116
- "value": "{colors.success.600}"
117
- },
118
- "iconWarning": {
119
- "value": "{colors.warning.600}"
120
- },
121
- "iconDanger": {
122
- "value": "{colors.error.600}"
123
- }
34
+ "bg": "{colors.white}",
35
+ "border": "{colors.neutral.200}",
36
+ "iconDefault": "{colors.info.600}",
37
+ "iconSuccess": "{colors.success.600}",
38
+ "iconWarning": "{colors.warning.600}",
39
+ "iconDanger": "{colors.error.600}"
124
40
  },
125
41
  "testimonial": {
126
- "bg": {
127
- "value": "{colors.white}"
128
- },
129
- "border": {
130
- "value": "{colors.neutral.200}"
131
- },
132
- "text": {
133
- "value": "{colors.neutral.700}"
134
- },
135
- "authorName": {
136
- "value": "{colors.neutral.900}"
137
- },
138
- "authorTitle": {
139
- "value": "{colors.neutral.500}"
140
- },
141
- "quoteMark": {
142
- "value": "{colors.neutral.300}"
143
- }
42
+ "bg": "{colors.white}",
43
+ "bgHover": "{colors.neutral.50}",
44
+ "border": "{colors.neutral.200}",
45
+ "text": "{colors.neutral.700}",
46
+ "authorName": "{colors.neutral.900}",
47
+ "authorTitle": "{colors.neutral.500}",
48
+ "quoteMark": "{colors.neutral.300}"
144
49
  },
145
50
  "pricingCard": {
146
- "bg": {
147
- "value": "{colors.white}",
148
- "metadata": {}
149
- },
150
- "border": {
151
- "value": "{colors.neutral.200}",
152
- "metadata": {}
153
- },
154
- "featuredBg": {
155
- "value": "{colors.info.600}",
156
- "metadata": {
157
- "pair": "component.pricingCard.featuredText"
158
- }
159
- },
160
- "featuredText": {
161
- "value": "{colors.white}",
162
- "metadata": {}
163
- },
164
- "featuredBadgeBg": {
165
- "value": "{colors.warning.500}",
166
- "metadata": {
167
- "pair": "component.pricingCard.featuredBadgeText"
168
- }
169
- },
170
- "featuredBadgeText": {
171
- "value": "{colors.neutral.900}",
172
- "metadata": {}
173
- },
174
- "price": {
175
- "value": "{colors.neutral.900}",
176
- "metadata": {}
177
- },
178
- "priceDescription": {
179
- "value": "{colors.neutral.500}",
180
- "metadata": {}
181
- }
51
+ "bg": "{colors.white}",
52
+ "bgHover": "{colors.neutral.50}",
53
+ "border": "{colors.neutral.200}",
54
+ "featuredBg": "{colors.info.600}",
55
+ "featuredText": "{colors.white}",
56
+ "featuredBadgeBg": "{colors.warning.500}",
57
+ "featuredBadgeText": "{colors.neutral.900}",
58
+ "price": "{colors.neutral.900}",
59
+ "priceDescription": "{colors.neutral.500}"
182
60
  },
183
61
  "rating": {
184
- "starFilled": {
185
- "value": "{colors.warning.500}"
186
- },
187
- "starEmpty": {
188
- "value": "{colors.neutral.200}"
189
- },
190
- "text": {
191
- "value": "{colors.neutral.500}"
192
- }
62
+ "starFilled": "{colors.warning.500}",
63
+ "starEmpty": "{colors.neutral.200}",
64
+ "text": "{colors.neutral.500}"
193
65
  }
194
66
  },
195
67
  "buttons": {
196
68
  "primary": {
197
- "bg": {
198
- "value": "{colors.info.600}",
199
- "metadata": {
200
- "pair": "buttons.primary.text"
201
- }
202
- },
203
- "bgHover": {
204
- "value": "{colors.info.700}",
205
- "metadata": {
206
- "pair": "buttons.primary.text"
207
- }
208
- },
209
- "bgActive": {
210
- "value": "{colors.info.800}",
211
- "metadata": {
212
- "pair": "buttons.primary.text"
213
- }
214
- },
215
- "bgDisabled": {
216
- "value": "{colors.neutral.200}"
217
- },
218
- "text": {
219
- "value": "{colors.white}"
220
- },
221
- "textDisabled": {
222
- "value": "{colors.neutral.400}"
223
- },
224
- "focusRing": {
225
- "value": "{colors.info.500} / 0.4"
226
- }
69
+ "bg": "{colors.info.600}",
70
+ "bgHover": "{colors.info.700}",
71
+ "bgActive": "{colors.info.800}",
72
+ "bgDisabled": "{colors.neutral.200}",
73
+ "text": "{colors.white}",
74
+ "textDisabled": "{colors.neutral.400}",
75
+ "focusRing": "{colors.info.500} / 0.4",
76
+ "focusVisible": "{buttons.primary.focusRing}"
227
77
  },
228
78
  "secondary": {
229
- "bg": {
230
- "value": "{colors.white}",
231
- "metadata": {
232
- "pair": "buttons.secondary.text"
233
- }
234
- },
235
- "bgHover": {
236
- "value": "{colors.neutral.50}",
237
- "metadata": {
238
- "pair": "buttons.secondary.text"
239
- }
240
- },
241
- "bgActive": {
242
- "value": "{colors.neutral.100}",
243
- "metadata": {
244
- "pair": "buttons.secondary.text"
245
- }
246
- },
247
- "bgDisabled": {
248
- "value": "{colors.neutral.50}"
249
- },
250
- "text": {
251
- "value": "{colors.info.700}"
252
- },
253
- "textDisabled": {
254
- "value": "{colors.neutral.400}"
255
- },
256
- "border": {
257
- "value": "{colors.info.700}"
258
- },
259
- "borderDisabled": {
260
- "value": "{colors.neutral.200}"
261
- },
262
- "focusRing": {
263
- "value": "{colors.info.500} / 0.4"
264
- }
79
+ "bg": "{colors.white}",
80
+ "bgHover": "{colors.neutral.50}",
81
+ "bgActive": "{colors.neutral.100}",
82
+ "bgDisabled": "{colors.neutral.50}",
83
+ "text": "{colors.info.700}",
84
+ "textDisabled": "{colors.neutral.400}",
85
+ "border": "{colors.info.700}",
86
+ "borderDisabled": "{colors.neutral.200}",
87
+ "focusRing": "{colors.info.500} / 0.4",
88
+ "focusVisible": "{buttons.secondary.focusRing}"
265
89
  },
266
90
  "ghost": {
267
- "bg": {
268
- "value": "transparent"
269
- },
270
- "bgHover": {
271
- "value": "{colors.info.50}",
272
- "metadata": {
273
- "pair": "buttons.ghost.text"
274
- }
275
- },
276
- "bgActive": {
277
- "value": "{colors.info.100}",
278
- "metadata": {
279
- "pair": "buttons.ghost.text"
280
- }
281
- },
282
- "bgDisabled": {
283
- "value": "transparent"
284
- },
285
- "text": {
286
- "value": "{colors.info.700}"
287
- },
288
- "textDisabled": {
289
- "value": "{colors.neutral.400}"
290
- },
291
- "focusRing": {
292
- "value": "{colors.info.500} / 0.4"
293
- }
91
+ "bg": "transparent",
92
+ "bgHover": "{colors.info.50}",
93
+ "bgActive": "{colors.info.100}",
94
+ "bgDisabled": "transparent",
95
+ "text": "{colors.info.700}",
96
+ "textDisabled": "{colors.neutral.400}",
97
+ "focusRing": "{colors.info.500} / 0.4",
98
+ "focusVisible": "{buttons.ghost.focusRing}"
294
99
  },
295
100
  "danger": {
296
- "bg": {
297
- "value": "{colors.error.600}",
298
- "metadata": {
299
- "pair": "buttons.danger.text"
300
- }
301
- },
302
- "bgHover": {
303
- "value": "{colors.error.700}",
304
- "metadata": {
305
- "pair": "buttons.danger.text"
306
- }
307
- },
308
- "bgActive": {
309
- "value": "{colors.error.800}",
310
- "metadata": {
311
- "pair": "buttons.danger.text"
312
- }
313
- },
314
- "bgDisabled": {
315
- "value": "{colors.error.200}"
316
- },
317
- "text": {
318
- "value": "{colors.white}"
319
- },
320
- "textDisabled": {
321
- "value": "{colors.neutral.400}"
322
- },
323
- "focusRing": {
324
- "value": "{colors.error.500} / 0.4"
325
- }
101
+ "bg": "{colors.error.600}",
102
+ "bgHover": "{colors.error.700}",
103
+ "bgActive": "{colors.error.800}",
104
+ "bgDisabled": "{colors.error.200}",
105
+ "text": "{colors.white}",
106
+ "textDisabled": "{colors.neutral.400}",
107
+ "focusRing": "{colors.error.500} / 0.4"
326
108
  },
327
109
  "success": {
328
- "bg": {
329
- "value": "{colors.success.700}",
330
- "metadata": {
331
- "pair": "buttons.success.text"
332
- }
333
- },
334
- "bgHover": {
335
- "value": "{colors.success.800}",
336
- "metadata": {
337
- "pair": "buttons.success.text"
338
- }
339
- },
340
- "bgActive": {
341
- "value": "{colors.success.900}",
342
- "metadata": {
343
- "pair": "buttons.success.text"
344
- }
345
- },
346
- "bgDisabled": {
347
- "value": "{colors.success.200}"
348
- },
349
- "text": {
350
- "value": "{colors.white}"
351
- },
352
- "textDisabled": {
353
- "value": "{colors.neutral.400}"
354
- },
355
- "focusRing": {
356
- "value": "{colors.success.500} / 0.4"
357
- }
110
+ "bg": "{colors.success.700}",
111
+ "bgHover": "{colors.success.800}",
112
+ "bgActive": "{colors.success.900}",
113
+ "bgDisabled": "{colors.success.200}",
114
+ "text": "{colors.white}",
115
+ "textDisabled": "{colors.neutral.400}",
116
+ "focusRing": "{colors.success.500} / 0.4"
358
117
  },
359
118
  "cta": {
360
- "bg": {
361
- "value": "{colors.brand.600}",
362
- "metadata": {
363
- "pair": "buttons.cta.text"
364
- }
365
- },
366
- "bgHover": {
367
- "value": "{colors.brand.700}",
368
- "metadata": {
369
- "pair": "buttons.cta.text"
370
- }
371
- },
372
- "bgActive": {
373
- "value": "{colors.brand.800}",
374
- "metadata": {
375
- "pair": "buttons.cta.text"
376
- }
377
- },
378
- "bgDisabled": {
379
- "value": "{colors.brand.200}"
380
- },
381
- "text": {
382
- "value": "{colors.white}"
383
- },
384
- "textDisabled": {
385
- "value": "{colors.neutral.400}"
386
- },
387
- "shadow": {
388
- "value": "0 4px 14px 0 {colors.brand.500} / 0.39"
389
- },
390
- "focusRing": {
391
- "value": "{colors.brand.500} / 0.4"
392
- }
119
+ "bg": "{colors.brand.600}",
120
+ "bgHover": "{colors.brand.700}",
121
+ "bgActive": "{colors.brand.800}",
122
+ "bgDisabled": "{colors.brand.200}",
123
+ "text": "{colors.white}",
124
+ "textDisabled": "{colors.neutral.400}",
125
+ "shadow": "0 4px 14px 0 {colors.brand.500} / 0.39",
126
+ "focusRing": "{colors.brand.500} / 0.4"
393
127
  },
394
128
  "accent": {
395
- "bg": {
396
- "value": "{colors.accent.600}",
397
- "metadata": {
398
- "pair": "buttons.accent.text"
399
- }
400
- },
401
- "bgHover": {
402
- "value": "{colors.accent.700}",
403
- "metadata": {
404
- "pair": "buttons.accent.text"
405
- }
406
- },
407
- "bgActive": {
408
- "value": "{colors.accent.800}",
409
- "metadata": {
410
- "pair": "buttons.accent.text"
411
- }
412
- },
413
- "bgDisabled": {
414
- "value": "{colors.accent.200}"
415
- },
416
- "text": {
417
- "value": "{colors.white}"
418
- },
419
- "textDisabled": {
420
- "value": "{colors.neutral.400}"
421
- },
422
- "focusRing": {
423
- "value": "{colors.accent.500} / 0.4"
424
- }
129
+ "bg": "{colors.accent.600}",
130
+ "bgHover": "{colors.accent.700}",
131
+ "bgActive": "{colors.accent.800}",
132
+ "bgDisabled": "{colors.accent.200}",
133
+ "text": "{colors.white}",
134
+ "textDisabled": "{colors.neutral.400}",
135
+ "focusRing": "{colors.accent.500} / 0.4",
136
+ "focusVisible": "{buttons.accent.focusRing}"
425
137
  }
426
138
  },
427
139
  "forms": {
428
140
  "default": {
429
- "bg": {
430
- "value": "{colors.white}"
431
- },
432
- "border": {
433
- "value": "{colors.neutral.300}"
434
- },
435
- "text": {
436
- "value": "{colors.neutral.900}"
437
- },
438
- "placeholder": {
439
- "value": "{colors.neutral.400}"
440
- }
141
+ "bg": "{colors.white}",
142
+ "border": "{colors.neutral.300}",
143
+ "text": "{colors.neutral.900}",
144
+ "placeholder": "{colors.neutral.500}"
441
145
  },
442
146
  "hover": {
443
- "border": {
444
- "value": "{colors.info.500}"
445
- }
147
+ "border": "{colors.info.500}"
446
148
  },
447
149
  "focus": {
448
- "border": {
449
- "value": "{colors.info.500}"
450
- },
451
- "ring": {
452
- "value": "{colors.info.500}"
453
- }
150
+ "border": "{colors.info.500}",
151
+ "ring": "{colors.info.500}"
152
+ },
153
+ "focusVisible": {
154
+ "border": "{forms.focus.border}",
155
+ "ring": "{forms.focus.ring}"
454
156
  },
455
157
  "valid": {
456
- "border": {
457
- "value": "{colors.success.500}"
458
- },
459
- "bg": {
460
- "value": "{colors.success.50}",
461
- "metadata": {
462
- "pair": "forms.valid.text"
463
- }
464
- },
465
- "text": {
466
- "value": "{colors.success.700}"
467
- }
158
+ "border": "{colors.success.500}",
159
+ "bg": "{colors.success.50}",
160
+ "text": "{colors.success.700}"
468
161
  },
469
162
  "invalid": {
470
- "border": {
471
- "value": "{colors.error.500}"
472
- },
473
- "bg": {
474
- "value": "{colors.error.50}",
475
- "metadata": {
476
- "pair": "forms.invalid.text"
477
- }
478
- },
479
- "text": {
480
- "value": "{colors.error.700}"
481
- }
163
+ "border": "{colors.error.500}",
164
+ "bg": "{colors.error.50}",
165
+ "text": "{colors.error.700}"
482
166
  },
483
167
  "disabled": {
484
- "bg": {
485
- "value": "{colors.neutral.50}"
486
- },
487
- "border": {
488
- "value": "{colors.neutral.200}"
489
- },
490
- "text": {
491
- "value": "{colors.neutral.400}"
492
- }
168
+ "bg": "{colors.neutral.50}",
169
+ "border": "{colors.neutral.200}",
170
+ "text": "{colors.neutral.400}"
493
171
  }
494
172
  },
495
173
  "modes": {
496
174
  "default": {
497
175
  "surface": {
498
- "page": {
499
- "value": "{colors.neutral.50}",
500
- "metadata": {
501
- "pair": "modes.default.text.onPage.default"
502
- }
503
- },
504
- "card": {
505
- "value": "{colors.white}",
506
- "metadata": {
507
- "pair": "modes.default.text.onSurface.default"
508
- }
509
- },
510
- "input": {
511
- "value": "{colors.white}",
512
- "metadata": {
513
- "pair": "modes.default.text.onSurface.default"
514
- }
515
- },
516
- "overlay": {
517
- "value": "{colors.neutral.900} / 0.6"
518
- },
519
- "alternate": {
520
- "value": "{colors.neutral.100}",
521
- "metadata": {
522
- "pair": "modes.default.text.onPage.default"
523
- }
524
- },
525
- "hero": {
526
- "value": "linear-gradient(135deg, {colors.indigo.500} 0%, {colors.violet.600} 100%)"
527
- }
176
+ "page": "{colors.neutral.50}",
177
+ "card": "{colors.white}",
178
+ "input": "{colors.white}",
179
+ "overlay": "{colors.neutral.900} / 0.6",
180
+ "alternate": "{colors.neutral.100}",
181
+ "hero": "linear-gradient(135deg, {colors.indigo.500} 0%, {colors.violet.600} 100%)"
528
182
  },
529
183
  "text": {
530
184
  "onPage": {
531
- "default": {
532
- "value": "{colors.neutral.900}",
533
- "metadata": {
534
- "pair": "modes.default.surface.page"
535
- }
536
- },
537
- "muted": {
538
- "value": "{colors.neutral.600}",
539
- "metadata": {
540
- "pair": "modes.default.surface.page"
541
- }
542
- },
543
- "subtle": {
544
- "value": "{colors.neutral.500}",
545
- "metadata": {
546
- "pair": "modes.default.surface.page"
547
- }
548
- },
549
- "meta": {
550
- "value": "{colors.neutral.500}",
551
- "metadata": {
552
- "pair": "modes.default.surface.page"
553
- }
554
- },
555
- "brand": {
556
- "value": "{colors.brand.600}",
557
- "metadata": {
558
- "pair": "modes.default.surface.page"
559
- }
560
- }
185
+ "default": "{colors.neutral.900}",
186
+ "muted": "{colors.neutral.600}",
187
+ "subtle": "{colors.neutral.500}",
188
+ "meta": "{colors.neutral.500}",
189
+ "brand": "{colors.brand.600}"
561
190
  },
562
191
  "onSurface": {
563
- "default": {
564
- "value": "{colors.neutral.900}",
565
- "metadata": {
566
- "pair": "modes.default.surface.card"
567
- }
568
- },
569
- "muted": {
570
- "value": "{colors.neutral.600}",
571
- "metadata": {
572
- "pair": "modes.default.surface.card"
573
- }
574
- },
575
- "subtle": {
576
- "value": "{colors.neutral.500}",
577
- "metadata": {
578
- "pair": "modes.default.surface.card"
579
- }
580
- },
581
- "meta": {
582
- "value": "{colors.neutral.500}",
583
- "metadata": {
584
- "pair": "modes.default.surface.card"
585
- }
586
- },
587
- "brand": {
588
- "value": "{colors.brand.600}",
589
- "metadata": {
590
- "pair": "modes.default.surface.card"
591
- }
592
- }
192
+ "default": "{colors.neutral.900}",
193
+ "muted": "{colors.neutral.600}",
194
+ "subtle": "{colors.neutral.500}",
195
+ "meta": "{colors.neutral.500}",
196
+ "brand": "{colors.brand.600}"
593
197
  }
594
198
  },
595
199
  "component": {
596
200
  "card": {
597
- "text": {
598
- "value": "{colors.neutral.900}"
599
- },
600
- "textMuted": {
601
- "value": "{colors.neutral.500}"
602
- }
201
+ "text": "{colors.neutral.900}",
202
+ "textMuted": "{colors.neutral.600}"
603
203
  },
604
204
  "input": {
605
- "text": {
606
- "value": "{colors.neutral.900}"
607
- },
608
- "placeholder": {
609
- "value": "{colors.neutral.400}"
610
- }
205
+ "text": "{colors.neutral.900}",
206
+ "placeholder": "{colors.neutral.500}"
611
207
  },
612
208
  "button": {
613
- "textDefault": {
614
- "value": "{colors.neutral.900}"
615
- },
616
- "textOnPrimary": {
617
- "value": "{colors.white}"
618
- }
209
+ "textDefault": "{colors.neutral.900}",
210
+ "textOnPrimary": "{colors.white}"
619
211
  },
620
212
  "badge": {
621
- "neutralBg": {
622
- "value": "{colors.neutral.100}",
623
- "metadata": {
624
- "pair": "modes.default.component.badge.neutralText"
625
- }
626
- },
627
- "neutralText": {
628
- "value": "{colors.neutral.700}",
629
- "metadata": {}
630
- },
631
- "infoBg": {
632
- "value": "{colors.info.100}",
633
- "metadata": {
634
- "pair": "modes.default.component.badge.infoText"
635
- }
636
- },
637
- "infoText": {
638
- "value": "{colors.info.700}",
639
- "metadata": {}
640
- },
641
- "successBg": {
642
- "value": "{colors.success.100}",
643
- "metadata": {
644
- "pair": "modes.default.component.badge.successText"
645
- }
646
- },
647
- "successText": {
648
- "value": "{colors.success.700}",
649
- "metadata": {}
650
- },
651
- "warningBg": {
652
- "value": "{colors.warning.100}",
653
- "metadata": {
654
- "pair": "modes.default.component.badge.warningText"
655
- }
656
- },
657
- "warningText": {
658
- "value": "{colors.warning.800}",
659
- "metadata": {}
660
- },
661
- "dangerBg": {
662
- "value": "{colors.error.100}",
663
- "metadata": {
664
- "pair": "modes.default.component.badge.dangerText"
665
- }
666
- },
667
- "dangerText": {
668
- "value": "{colors.error.700}",
669
- "metadata": {}
670
- }
213
+ "neutralBg": "{colors.neutral.100}",
214
+ "neutralBgHover": "{colors.neutral.200}",
215
+ "neutralText": "{colors.neutral.700}",
216
+ "infoBg": "{colors.info.100}",
217
+ "infoBgHover": "{colors.info.200}",
218
+ "infoText": "{colors.info.700}",
219
+ "successBg": "{colors.success.100}",
220
+ "successText": "{colors.success.700}",
221
+ "warningBg": "{colors.warning.100}",
222
+ "warningText": "{colors.warning.800}",
223
+ "dangerBg": "{colors.error.100}",
224
+ "dangerText": "{colors.error.700}"
671
225
  },
672
226
  "iconBox": {
673
- "bg": {
674
- "value": "{colors.white}",
675
- "metadata": {}
676
- },
677
- "border": {
678
- "value": "{colors.neutral.200}",
679
- "metadata": {}
680
- },
681
- "iconDefault": {
682
- "value": "{colors.info.600}",
683
- "metadata": {}
684
- },
685
- "iconSuccess": {
686
- "value": "{colors.success.600}",
687
- "metadata": {}
688
- },
689
- "iconWarning": {
690
- "value": "{colors.warning.600}",
691
- "metadata": {}
692
- },
693
- "iconDanger": {
694
- "value": "{colors.error.600}",
695
- "metadata": {}
696
- }
227
+ "bg": "{colors.white}",
228
+ "border": "{colors.neutral.200}",
229
+ "iconDefault": "{colors.info.600}",
230
+ "iconSuccess": "{colors.success.600}",
231
+ "iconWarning": "{colors.warning.600}",
232
+ "iconDanger": "{colors.error.600}"
697
233
  },
698
234
  "testimonial": {
699
- "bg": {
700
- "value": "{colors.white}",
701
- "metadata": {
702
- "pair": "modes.default.component.testimonial.text"
703
- }
704
- },
705
- "border": {
706
- "value": "{colors.neutral.200}",
707
- "metadata": {}
708
- },
709
- "text": {
710
- "value": "{colors.neutral.700}",
711
- "metadata": {
712
- "pair": "modes.default.component.testimonial.bg"
713
- }
714
- },
715
- "authorName": {
716
- "value": "{colors.neutral.900}",
717
- "metadata": {
718
- "pair": "modes.default.component.testimonial.bg"
719
- }
720
- },
721
- "authorTitle": {
722
- "value": "{colors.neutral.500}",
723
- "metadata": {
724
- "pair": "modes.default.component.testimonial.bg"
725
- }
726
- },
727
- "quoteMark": {
728
- "value": "{colors.neutral.300}",
729
- "metadata": {}
730
- }
235
+ "bg": "{colors.white}",
236
+ "bgHover": "{colors.neutral.50}",
237
+ "border": "{colors.neutral.200}",
238
+ "text": "{colors.neutral.700}",
239
+ "authorName": "{colors.neutral.900}",
240
+ "authorTitle": "{colors.neutral.500}",
241
+ "quoteMark": "{colors.neutral.500}"
731
242
  },
732
243
  "pricingCard": {
733
- "bg": {
734
- "value": "{colors.white}",
735
- "metadata": {
736
- "pair": "modes.default.component.pricingCard.price"
737
- }
738
- },
739
- "border": {
740
- "value": "{colors.neutral.200}",
741
- "metadata": {}
742
- },
743
- "featuredBg": {
744
- "value": "{colors.info.600}",
745
- "metadata": {
746
- "pair": "modes.default.component.pricingCard.featuredText"
747
- }
748
- },
749
- "featuredText": {
750
- "value": "{colors.white}",
751
- "metadata": {}
752
- },
753
- "featuredBadgeBg": {
754
- "value": "{colors.warning.500}",
755
- "metadata": {
756
- "pair": "modes.default.component.pricingCard.featuredBadgeText"
757
- }
758
- },
759
- "featuredBadgeText": {
760
- "value": "{colors.neutral.900}",
761
- "metadata": {}
762
- },
763
- "price": {
764
- "value": "{colors.neutral.900}",
765
- "metadata": {
766
- "pair": "modes.default.component.pricingCard.bg"
767
- }
768
- },
769
- "priceDescription": {
770
- "value": "{colors.neutral.500}",
771
- "metadata": {
772
- "pair": "modes.default.component.pricingCard.bg"
773
- }
774
- }
244
+ "bg": "{colors.white}",
245
+ "bgHover": "{colors.neutral.50}",
246
+ "border": "{colors.neutral.200}",
247
+ "featuredBg": "{colors.info.600}",
248
+ "featuredText": "{colors.white}",
249
+ "featuredBadgeBg": "{colors.warning.500}",
250
+ "featuredBadgeText": "{colors.neutral.900}",
251
+ "price": "{colors.neutral.900}",
252
+ "priceDescription": "{colors.neutral.500}"
775
253
  },
776
254
  "rating": {
777
- "starFilled": {
778
- "value": "{colors.warning.500}",
779
- "metadata": {}
780
- },
781
- "starEmpty": {
782
- "value": "{colors.neutral.200}",
783
- "metadata": {}
784
- },
785
- "text": {
786
- "value": "{colors.neutral.500}",
787
- "metadata": {}
788
- }
255
+ "starFilled": "{colors.warning.500}",
256
+ "starEmpty": "{colors.neutral.200}",
257
+ "text": "{colors.neutral.500}"
789
258
  }
790
259
  }
791
260
  },
792
261
  "dark": {
793
262
  "surface": {
794
- "page": {
795
- "value": "{colors.neutral.900}",
796
- "metadata": {
797
- "pair": "modes.dark.text.onPage.default"
798
- }
799
- },
800
- "card": {
801
- "value": "{colors.neutral.800}",
802
- "metadata": {
803
- "pair": "modes.dark.text.onSurface.default"
804
- }
805
- },
806
- "input": {
807
- "value": "{colors.neutral.700}",
808
- "metadata": {
809
- "pair": "modes.dark.text.onSurface.default"
810
- }
811
- },
812
- "overlay": {
813
- "value": "{colors.neutral.800}"
814
- },
815
- "alternate": {
816
- "value": "{colors.neutral.800}",
817
- "metadata": {
818
- "pair": "modes.dark.text.onPage.default"
819
- }
820
- },
821
- "hero": {
822
- "value": "linear-gradient(135deg, {colors.accent.900} 0%, {colors.accent.700} 100%)"
823
- }
263
+ "page": "{colors.neutral.900}",
264
+ "card": "{colors.neutral.800}",
265
+ "input": "{colors.neutral.700}",
266
+ "overlay": "{colors.neutral.800}",
267
+ "alternate": "{colors.neutral.800}",
268
+ "hero": "linear-gradient(135deg, {colors.accent.900} 0%, {colors.accent.700} 100%)"
824
269
  },
825
270
  "text": {
826
271
  "onPage": {
827
- "default": {
828
- "value": "{colors.neutral.50}",
829
- "metadata": {
830
- "pair": "modes.dark.surface.page"
831
- }
832
- },
833
- "muted": {
834
- "value": "{colors.neutral.200}",
835
- "metadata": {
836
- "pair": "modes.dark.surface.page"
837
- }
838
- },
839
- "subtle": {
840
- "value": "{colors.neutral.300}",
841
- "metadata": {
842
- "pair": "modes.dark.surface.page"
843
- }
844
- },
845
- "meta": {
846
- "value": "{colors.neutral.300}",
847
- "metadata": {
848
- "pair": "modes.dark.surface.page"
849
- }
850
- },
851
- "brand": {
852
- "value": "{colors.brand.400}",
853
- "metadata": {
854
- "pair": "modes.dark.surface.page"
855
- }
856
- }
272
+ "default": "{colors.neutral.50}",
273
+ "muted": "{colors.neutral.300}",
274
+ "subtle": "{colors.neutral.400}",
275
+ "meta": "{colors.neutral.400}",
276
+ "brand": "{colors.brand.400}"
857
277
  },
858
278
  "onSurface": {
859
- "default": {
860
- "value": "{colors.neutral.100}",
861
- "metadata": {
862
- "pair": "modes.dark.surface.card"
863
- }
864
- },
865
- "muted": {
866
- "value": "{colors.neutral.200}",
867
- "metadata": {
868
- "pair": "modes.dark.surface.card"
869
- }
870
- },
871
- "subtle": {
872
- "value": "{colors.neutral.300}",
873
- "metadata": {
874
- "pair": "modes.dark.surface.card"
875
- }
876
- },
877
- "meta": {
878
- "value": "{colors.neutral.300}",
879
- "metadata": {
880
- "pair": "modes.dark.surface.card"
881
- }
882
- },
883
- "brand": {
884
- "value": "{colors.brand.400}",
885
- "metadata": {
886
- "pair": "modes.dark.surface.card"
887
- }
888
- }
279
+ "default": "{colors.neutral.100}",
280
+ "muted": "{colors.neutral.300}",
281
+ "subtle": "{colors.neutral.400}",
282
+ "meta": "{colors.neutral.400}",
283
+ "brand": "{colors.brand.400}"
889
284
  }
890
285
  },
891
286
  "component": {
892
287
  "card": {
893
- "text": {
894
- "value": "{colors.neutral.100}",
895
- "metadata": {
896
- "pair": "modes.dark.surface.card"
897
- }
898
- },
899
- "textMuted": {
900
- "value": "{colors.neutral.200}",
901
- "metadata": {
902
- "pair": "modes.dark.surface.card"
903
- }
904
- }
288
+ "text": "{colors.neutral.100}",
289
+ "textMuted": "{colors.neutral.300}"
905
290
  },
906
291
  "input": {
907
- "text": {
908
- "value": "{colors.neutral.100}"
909
- },
910
- "placeholder": {
911
- "value": "{colors.neutral.400}"
912
- }
292
+ "text": "{colors.neutral.100}",
293
+ "placeholder": "{colors.neutral.300}"
913
294
  },
914
295
  "button": {
915
- "textDefault": {
916
- "value": "{colors.neutral.100}"
917
- },
918
- "textOnPrimary": {
919
- "value": "{colors.white}"
920
- }
296
+ "textDefault": "{colors.neutral.100}",
297
+ "textOnPrimary": "{colors.white}"
921
298
  },
922
299
  "badge": {
923
- "neutralBg": {
924
- "value": "{colors.neutral.700}",
925
- "metadata": {
926
- "pair": "modes.dark.component.badge.neutralText"
927
- }
928
- },
929
- "neutralBgHover": {
930
- "value": "{colors.neutral.600}",
931
- "metadata": {
932
- "pair": "modes.dark.component.badge.neutralText"
933
- }
934
- },
935
- "neutralText": {
936
- "value": "{colors.neutral.100}",
937
- "metadata": {}
938
- },
939
- "infoBg": {
940
- "value": "{colors.info.900}",
941
- "metadata": {
942
- "pair": "modes.dark.component.badge.infoText"
943
- }
944
- },
945
- "infoBgHover": {
946
- "value": "{colors.info.700}",
947
- "metadata": {
948
- "pair": "modes.dark.component.badge.infoText"
949
- }
950
- },
951
- "infoText": {
952
- "value": "{colors.info.100}",
953
- "metadata": {}
954
- },
955
- "successBg": {
956
- "value": "{colors.success.800}",
957
- "metadata": {
958
- "pair": "modes.dark.component.badge.successText"
959
- }
960
- },
961
- "successBgHover": {
962
- "value": "{colors.success.700}",
963
- "metadata": {
964
- "pair": "modes.dark.component.badge.successText"
965
- }
966
- },
967
- "successText": {
968
- "value": "{colors.success.100}",
969
- "metadata": {}
970
- },
971
- "warningBg": {
972
- "value": "{colors.warning.800}",
973
- "metadata": {
974
- "pair": "modes.dark.component.badge.warningText"
975
- }
976
- },
977
- "warningBgHover": {
978
- "value": "{colors.warning.800}",
979
- "metadata": {
980
- "pair": "modes.dark.component.badge.warningText"
981
- }
982
- },
983
- "warningText": {
984
- "value": "{colors.warning.100}",
985
- "metadata": {}
986
- },
987
- "dangerBg": {
988
- "value": "{colors.error.800}",
989
- "metadata": {
990
- "pair": "modes.dark.component.badge.dangerText"
991
- }
992
- },
993
- "dangerBgHover": {
994
- "value": "{colors.error.700}",
995
- "metadata": {
996
- "pair": "modes.dark.component.badge.dangerText"
997
- }
998
- },
999
- "dangerText": {
1000
- "value": "{colors.error.100}",
1001
- "metadata": {}
1002
- }
300
+ "neutralBg": "{colors.neutral.700}",
301
+ "neutralBgHover": "{colors.neutral.600}",
302
+ "neutralText": "{colors.neutral.100}",
303
+ "infoBg": "{colors.info.800}",
304
+ "infoBgHover": "{colors.info.700}",
305
+ "infoText": "{colors.info.100}",
306
+ "successBg": "{colors.success.800}",
307
+ "successBgHover": "{colors.success.700}",
308
+ "successText": "{colors.success.100}",
309
+ "warningBg": "{colors.warning.800}",
310
+ "warningBgHover": "{colors.warning.800}",
311
+ "warningText": "{colors.warning.100}",
312
+ "dangerBg": "{colors.error.800}",
313
+ "dangerBgHover": "{colors.error.700}",
314
+ "dangerText": "{colors.error.100}"
1003
315
  },
1004
316
  "iconBox": {
1005
- "bg": {
1006
- "value": "{colors.neutral.800}",
1007
- "metadata": {}
1008
- },
1009
- "border": {
1010
- "value": "{colors.neutral.700}",
1011
- "metadata": {}
1012
- },
1013
- "iconDefault": {
1014
- "value": "{colors.info.300}",
1015
- "metadata": {}
1016
- },
1017
- "iconSuccess": {
1018
- "value": "{colors.success.400}",
1019
- "metadata": {}
1020
- },
1021
- "iconWarning": {
1022
- "value": "{colors.warning.400}",
1023
- "metadata": {}
1024
- },
1025
- "iconDanger": {
1026
- "value": "{colors.error.400}",
1027
- "metadata": {}
1028
- }
317
+ "bg": "{colors.neutral.800}",
318
+ "border": "{colors.neutral.700}",
319
+ "iconDefault": "{colors.info.400}",
320
+ "iconSuccess": "{colors.success.400}",
321
+ "iconWarning": "{colors.warning.400}",
322
+ "iconDanger": "{colors.error.400}"
1029
323
  },
1030
324
  "testimonial": {
1031
- "bg": {
1032
- "value": "{colors.neutral.800}",
1033
- "metadata": {
1034
- "pair": "modes.dark.component.testimonial.text"
1035
- }
1036
- },
1037
- "border": {
1038
- "value": "{colors.neutral.700}",
1039
- "metadata": {}
1040
- },
1041
- "text": {
1042
- "value": "{colors.neutral.200}",
1043
- "metadata": {
1044
- "pair": "modes.dark.component.testimonial.bg"
1045
- }
1046
- },
1047
- "authorName": {
1048
- "value": "{colors.neutral.100}",
1049
- "metadata": {
1050
- "pair": "modes.dark.component.testimonial.bg"
1051
- }
1052
- },
1053
- "authorTitle": {
1054
- "value": "{colors.neutral.300}",
1055
- "metadata": {
1056
- "pair": "modes.dark.component.testimonial.bg"
1057
- }
1058
- },
1059
- "quoteMark": {
1060
- "value": "{colors.neutral.600}",
1061
- "metadata": {}
1062
- }
325
+ "bg": "{colors.neutral.800}",
326
+ "bgHover": "{colors.neutral.700}",
327
+ "border": "{colors.neutral.700}",
328
+ "text": "{colors.neutral.200}",
329
+ "authorName": "{colors.neutral.100}",
330
+ "authorTitle": "{colors.neutral.400}",
331
+ "quoteMark": "{colors.neutral.400}"
1063
332
  },
1064
333
  "pricingCard": {
1065
- "bg": {
1066
- "value": "{colors.neutral.800}",
1067
- "metadata": {
1068
- "pair": "modes.dark.component.pricingCard.price"
1069
- }
1070
- },
1071
- "border": {
1072
- "value": "{colors.neutral.700}",
1073
- "metadata": {}
1074
- },
1075
- "featuredBg": {
1076
- "value": "{colors.info.600}",
1077
- "metadata": {
1078
- "pair": "modes.dark.component.pricingCard.featuredText"
1079
- }
1080
- },
1081
- "featuredText": {
1082
- "value": "{colors.white}",
1083
- "metadata": {}
1084
- },
1085
- "featuredBadgeBg": {
1086
- "value": "{colors.warning.500}",
1087
- "metadata": {
1088
- "pair": "modes.dark.component.pricingCard.featuredBadgeText"
1089
- }
1090
- },
1091
- "featuredBadgeText": {
1092
- "value": "{colors.neutral.900}",
1093
- "metadata": {}
1094
- },
1095
- "price": {
1096
- "value": "{colors.neutral.100}",
1097
- "metadata": {
1098
- "pair": "modes.dark.component.pricingCard.bg"
1099
- }
1100
- },
1101
- "priceDescription": {
1102
- "value": "{colors.neutral.300}",
1103
- "metadata": {
1104
- "pair": "modes.dark.component.pricingCard.bg"
1105
- }
1106
- }
334
+ "bg": "{colors.neutral.800}",
335
+ "bgHover": "{colors.neutral.700}",
336
+ "border": "{colors.neutral.700}",
337
+ "featuredBg": "{colors.info.600}",
338
+ "featuredText": "{colors.white}",
339
+ "featuredBadgeBg": "{colors.warning.500}",
340
+ "featuredBadgeText": "{colors.neutral.900}",
341
+ "price": "{colors.neutral.100}",
342
+ "priceDescription": "{colors.neutral.400}"
1107
343
  },
1108
344
  "rating": {
1109
- "starFilled": {
1110
- "value": "{colors.warning.400}",
1111
- "metadata": {}
1112
- },
1113
- "starEmpty": {
1114
- "value": "{colors.neutral.700}",
1115
- "metadata": {}
1116
- },
1117
- "text": {
1118
- "value": "{colors.neutral.400}",
1119
- "metadata": {}
1120
- }
345
+ "starFilled": "{colors.warning.400}",
346
+ "starEmpty": "{colors.neutral.700}",
347
+ "text": "{colors.neutral.400}"
1121
348
  }
1122
349
  }
1123
350
  }
@@ -1361,10 +588,6 @@ var coreTokens = {
1361
588
  "minTouchTarget": "44px",
1362
589
  "minTextSize": "16px"
1363
590
  },
1364
- "borders": {
1365
- "card": "{colors.neutral.200}",
1366
- "input": "{colors.neutral.300}"
1367
- },
1368
591
  "border": {
1369
592
  "width": {
1370
593
  "base": "1px",
@@ -1372,22 +595,10 @@ var coreTokens = {
1372
595
  }
1373
596
  },
1374
597
  "surface": {
1375
- "page": {
1376
- "value": "{colors.neutral.50}",
1377
- "description": "primary app background"
1378
- },
1379
- "card": {
1380
- "value": "{colors.white}",
1381
- "description": "containers and tiles"
1382
- },
1383
- "input": {
1384
- "value": "{colors.white}",
1385
- "description": "form inputs, textareas"
1386
- },
1387
- "overlay": {
1388
- "value": "{colors.neutral.900} / 0.6",
1389
- "description": "modals, dropdowns, flyouts"
1390
- }
598
+ "page": "{colors.neutral.50}",
599
+ "card": "{colors.white}",
600
+ "input": "{colors.white}",
601
+ "overlay": "{colors.neutral.900} / 0.6"
1391
602
  },
1392
603
  "text": {
1393
604
  "onPage": {
@@ -1453,7 +664,7 @@ var coreTokens = {
1453
664
  "lg": {
1454
665
  "size": "1.25rem",
1455
666
  "lineHeight": "2rem",
1456
- "weight": 500
667
+ "weight": 600
1457
668
  },
1458
669
  "xl": {
1459
670
  "size": "1.5rem",
@@ -1463,7 +674,27 @@ var coreTokens = {
1463
674
  "2xl": {
1464
675
  "size": "1.875rem",
1465
676
  "lineHeight": "2.5rem",
1466
- "weight": 600
677
+ "weight": 700
678
+ },
679
+ "3xl": {
680
+ "size": "2.25rem",
681
+ "lineHeight": "2.75rem",
682
+ "weight": 700
683
+ },
684
+ "4xl": {
685
+ "size": "3rem",
686
+ "lineHeight": "3.5rem",
687
+ "weight": 800
688
+ },
689
+ "5xl": {
690
+ "size": "3.75rem",
691
+ "lineHeight": "4.25rem",
692
+ "weight": 800
693
+ },
694
+ "6xl": {
695
+ "size": "4.5rem",
696
+ "lineHeight": "5rem",
697
+ "weight": 900
1467
698
  }
1468
699
  },
1469
700
  "typography": {