@bcc-code/design-tokens 3.0.10 → 3.0.13

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 (18) hide show
  1. package/README.md +37 -2
  2. package/build/bcc/css/auto.css +155 -52
  3. package/build/bcc/css/dark.css +141 -48
  4. package/build/bcc/css/light.css +45 -36
  5. package/build/bcc/css/tailwind-auto.css +155 -52
  6. package/build/bcc/css/tailwind-dark.css +141 -48
  7. package/build/bcc/css/tailwind-light.css +45 -36
  8. package/build/bcc/js/dark.js +213 -51
  9. package/build/bcc/js/light.js +57 -41
  10. package/build/primevue/component-dark.js +2390 -0
  11. package/build/primevue/component-light.js +2390 -0
  12. package/build/primevue/primitive.js +554 -0
  13. package/build/primevue/semantic-dark.js +345 -0
  14. package/build/primevue/semantic-light.js +345 -0
  15. package/config/primevue.config.d.ts +6 -2
  16. package/config/primevue.config.js +987 -23
  17. package/package.json +6 -3
  18. package/build/bcc/js/aura-bcc-config.js +0 -1148
package/build/bcc/css/light.css CHANGED
@@ -4,7 +4,6 @@
4
4
 
5
5
 
6
6
  :root {
7
- --font-family-archivo: Archivo;
8
7
  --color-neutral-0: #ffffff;
9
8
  --color-neutral-100: #f7f8f9;
10
9
  --color-neutral-200: #f1f2f4;
@@ -36,7 +35,6 @@
36
35
  --color-dark-neutral-900: #b6c2cf;
37
36
  --color-dark-neutral-1000: #c7d1db;
38
37
  --color-dark-neutral-1100: #dee4ea;
39
- --color-dark-neutral-negative-100: #101214;
40
38
  --color-dark-neutral-alpha-100-a: rgba(0, 0, 0, 0.24);
41
39
  --color-dark-neutral-alpha-200-a: rgba(188, 214, 240, 0.08);
42
40
  --color-dark-neutral-alpha-250-a: rgba(188, 214, 240, 0.1);
@@ -176,26 +174,24 @@
176
174
  --space-negative-300: -1.5rem; /** -24px */
177
175
  --space-negative-400: -2rem; /** -32px */
178
176
  --border-radius-none: 0; /** 0 */
179
- --border-radius-xs: 0.125rem; /** 2px */
180
- --border-radius-sm: 0.25rem; /** 4px */
177
+ --border-radius-2xs: 0.125rem; /** 2px */
178
+ --border-radius-xs: 0.25rem; /** 4px */
179
+ --border-radius-sm: 0.375rem; /** 6px */
181
180
  --border-radius-md: 0.5rem; /** 8px */
182
- --border-radius-lg: 1rem; /** 16px */
183
- --border-radius-xl: 1.5rem; /** 24px */
184
- --border-radius-2xl: 2rem; /** 32px */
185
- --border-radius-3xl: 3rem; /** 48px */
181
+ --border-radius-lg: 0.75rem; /** 12px */
182
+ --border-radius-xl: 1rem; /** 16px */
183
+ --border-radius-2xl: 1.5rem; /** 24px */
184
+ --border-radius-3xl: 2rem; /** 32 */
185
+ --border-radius-4xl: 3rem; /** 48px */
186
186
  --border-radius-full: 999px;
187
- --icon-size-xs: 1rem; /** 16px */
188
- --icon-size-sm: 1.25rem; /** 20px */
189
- --icon-size-md: 1.5rem; /** 24px */
190
- --icon-size-lg: 2rem; /** 32px */
191
- --icon-size-xl: 3rem; /** 48px */
192
187
  --border-width-0: 0;
193
188
  --border-width-1: 1px;
194
189
  --border-width-2: 2px;
190
+ --font-family-archivo: Archivo;
195
191
  --font-weight-regular: 400;
196
192
  --font-weight-medium: 500;
197
193
  --font-weight-bold: 700;
198
- --line-height-1: 12px;
194
+ --line-height-1: 14px;
199
195
  --line-height-2: 16px;
200
196
  --line-height-3: 20px;
201
197
  --line-height-4: 24px;
@@ -203,9 +199,9 @@
203
199
  --line-height-6: 32px;
204
200
  --line-height-7: 36px;
205
201
  --line-height-8: 40px;
206
- --line-height-9: 52px;
202
+ --line-height-9: 56px;
207
203
  --line-height-10: 64px;
208
- --line-height-none: 1;
204
+ --line-height-none: normal;
209
205
  --font-size-xs: 0.75rem; /** 12px */
210
206
  --font-size-sm: 0.875rem; /** 14px */
211
207
  --font-size-md: 1rem; /** 16px */
@@ -214,6 +210,9 @@
214
210
  --font-size-2xl: 2em; /** 32px */
215
211
  --font-size-3xl: 2.25rem; /** 36px */
216
212
  --font-size-4xl: 3rem; /** 48px */
213
+ --elevation-shadow-overlow: 0 0 8px 0 rgba(30,31,33,0.16), 0 0 1px 0 rgba(30,31,33,0.12);
214
+ --elevation-shadow-overlay: 0 8px 12px 0 rgba(30,31,33,0.15), 0 0 1px 0 rgba(30,31,33,0.31);
215
+ --elevation-shadow-raised: 0 1px 1px 0 rgba(30,31,33,0.25), 0 0 1px 0 rgba(30,31,33,0.31);
217
216
  --color-text-default: var(--color-neutral-1000);
218
217
  --color-text-subtle: var(--color-neutral-800);
219
218
  --color-text-subtlest: var(--color-neutral-700);
@@ -355,18 +354,18 @@
355
354
  --color-background-brand-boldest-default: var(--color-bcc-1000);
356
355
  --color-background-brand-boldest-hover: var(--color-bcc-900);
357
356
  --color-background-brand-boldest-pressed: var(--color-bcc-800);
358
- --color-background-accent-neutral-default: var(--color-neutral-alpha-300-a);
359
- --color-background-accent-neutral-hover: var(--color-neutral-alpha-400-a);
360
- --color-background-accent-neutral-pressed: var(--color-neutral-alpha-500-a);
361
- --color-background-accent-neutral-subtle-default: var(--color-neutral-alpha-200-a);
362
- --color-background-accent-neutral-subtle-hover: var(--color-neutral-alpha-300-a);
363
- --color-background-accent-neutral-subtle-pressed: var(--color-neutral-alpha-400-a);
364
- --color-background-accent-neutral-subtler-default: var(--color-neutral-alpha-100-a);
365
- --color-background-accent-neutral-subtler-hover: var(--color-neutral-alpha-200-a);
366
- --color-background-accent-neutral-subtler-pressed: var(--color-neutral-alpha-300-a);
367
- --color-background-accent-neutral-subtlest-default: var(--color-transparent);
368
- --color-background-accent-neutral-subtlest-hover: var(--color-neutral-alpha-100-a);
369
- --color-background-accent-neutral-subtlest-pressed: var(--color-neutral-alpha-200-a);
357
+ --color-background-neutral-default: var(--color-neutral-alpha-300-a);
358
+ --color-background-neutral-hover: var(--color-neutral-alpha-400-a);
359
+ --color-background-neutral-pressed: var(--color-neutral-alpha-500-a);
360
+ --color-background-neutral-subtle-default: var(--color-neutral-alpha-200-a);
361
+ --color-background-neutral-subtle-hover: var(--color-neutral-alpha-300-a);
362
+ --color-background-neutral-subtle-pressed: var(--color-neutral-alpha-400-a);
363
+ --color-background-neutral-subtler-default: var(--color-neutral-alpha-100-a);
364
+ --color-background-neutral-subtler-hover: var(--color-neutral-alpha-200-a);
365
+ --color-background-neutral-subtler-pressed: var(--color-neutral-alpha-300-a);
366
+ --color-background-neutral-subtlest-default: var(--color-transparent);
367
+ --color-background-neutral-subtlest-hover: var(--color-neutral-alpha-100-a);
368
+ --color-background-neutral-subtlest-pressed: var(--color-neutral-alpha-200-a);
370
369
  --color-background-accent-blue-subtle-default: var(--color-blue-400);
371
370
  --color-background-accent-blue-subtle-hover: var(--color-blue-300);
372
371
  --color-background-accent-blue-subtle-pressed: var(--color-blue-200);
@@ -441,7 +440,10 @@
441
440
  --color-background-accent-orange-bolder-pressed: var(--color-orange-900);
442
441
  --color-background-accent-red-subtle-default: var(--color-red-400);
443
442
  --color-background-accent-red-subtle-hover: var(--color-red-300);
444
- --color-background-accent-red-subtle-pressed: var(--color-red-400);
443
+ --color-background-accent-red-subtle-pressed: var(--color-red-200);
444
+ --color-background-accent-red-subtler-default: var(--color-red-200);
445
+ --color-background-accent-red-subtler-hover: var(--color-red-300);
446
+ --color-background-accent-red-subtler-pressed: var(--color-red-400);
445
447
  --color-background-accent-red-subtlest-default: var(--color-red-100);
446
448
  --color-background-accent-red-subtlest-hover: var(--color-red-200);
447
449
  --color-background-accent-red-subtlest-pressed: var(--color-red-300);
@@ -500,13 +502,20 @@
500
502
  --color-elevation-surface-raised-hovered: var(--color-neutral-200);
501
503
  --color-elevation-surface-raised-pressed: var(--color-neutral-300);
502
504
  --color-elevation-surface-sunken-default: var(--color-neutral-100);
503
- --heading-xs: var(--font-weight-medium) var(--font-size-xs)/var(--line-height-2) var(--font-family-archivo);
504
- --heading-sm: var(--font-weight-medium) var(--font-size-md)/var(--line-height-3) var(--font-family-archivo);
505
- --heading-md: var(--font-weight-medium) var(--font-size-lg)/var(--line-height-4) var(--font-family-archivo);
506
- --heading-lg: var(--font-weight-medium) var(--font-size-xl)/var(--line-height-5) var(--font-family-archivo);
507
- --heading-xl: var(--font-weight-medium) var(--font-size-2xl)/var(--line-height-6) var(--font-family-archivo);
508
- --heading-2xl: var(--font-weight-medium) var(--font-size-3xl)/var(--line-height-8) var(--font-family-archivo);
509
- --heading-3xl: var(--font-weight-medium) var(--font-size-4xl)/var(--line-height-9) var(--font-family-archivo);
505
+ --icon-size-xs: var(--space-200); /** 16px */
506
+ --icon-size-sm: var(--space-250); /** 20px */
507
+ --icon-size-md: var(--space-300); /** 24px */
508
+ --icon-size-lg: var(--space-400); /** 32px */
509
+ --icon-size-xl: var(--space-600); /** 48px */
510
+ --heading-xs: var(--font-weight-bold) var(--font-size-xs)/var(--line-height-1) var(--font-family-archivo);
511
+ --heading-sm: var(--font-weight-bold) var(--font-size-sm)/var(--line-height-2) var(--font-family-archivo);
512
+ --heading-md: var(--font-weight-bold) var(--font-size-md)/var(--line-height-3) var(--font-family-archivo);
513
+ --heading-lg: var(--font-weight-bold) var(--font-size-lg)/var(--line-height-4) var(--font-family-archivo);
514
+ --heading-xl: var(--font-weight-bold) var(--font-size-xl)/var(--line-height-5) var(--font-family-archivo);
515
+ --heading-2xl: var(--font-weight-bold) var(--font-size-2xl)/var(--line-height-6) var(--font-family-archivo);
516
+ --heading-3xl: var(--font-weight-bold) var(--font-size-3xl)/var(--line-height-8) var(--font-family-archivo);
517
+ --heading-4xl: var(--font-weight-bold) var(--font-size-4xl)/var(--line-height-9) var(--font-family-archivo);
518
+ --heading-5xl: var(--font-weight-bold) var(--font-size-4xl)/var(--line-height-10) var(--font-family-archivo);
510
519
  --body-sm: var(--font-weight-regular) var(--font-size-xs)/var(--line-height-2) var(--font-family-archivo);
511
520
  --body-md: var(--font-weight-regular) var(--font-size-sm)/var(--line-height-3) var(--font-family-archivo);
512
521
  --body-lg: var(--font-weight-regular) var(--font-size-md)/var(--line-height-4) var(--font-family-archivo);
package/build/bcc/css/tailwind-auto.css CHANGED
@@ -6,7 +6,6 @@
6
6
  @custom-variant dark (&:where(.dark, .dark *));
7
7
 
8
8
  @theme {
9
- --font-archivo: Archivo;
10
9
  --color-neutral-0: #ffffff;
11
10
  --color-neutral-100: #f7f8f9;
12
11
  --color-neutral-200: #f1f2f4;
@@ -38,7 +37,6 @@
38
37
  --color-dark-neutral-900: #b6c2cf;
39
38
  --color-dark-neutral-1000: #c7d1db;
40
39
  --color-dark-neutral-1100: #dee4ea;
41
- --color-dark-neutral-negative-100: #101214;
42
40
  --color-dark-neutral-alpha-100-a: rgba(0, 0, 0, 0.24);
43
41
  --color-dark-neutral-alpha-200-a: rgba(188, 214, 240, 0.08);
44
42
  --color-dark-neutral-alpha-250-a: rgba(188, 214, 240, 0.1);
@@ -179,26 +177,24 @@
179
177
  --spacing-negative-300: -1.5rem; /** -24px */
180
178
  --spacing-negative-400: -2rem; /** -32px */
181
179
  --radius-none: 0; /** 0 */
182
- --radius-xs: 0.125rem; /** 2px */
183
- --radius-sm: 0.25rem; /** 4px */
180
+ --radius-2xs: 0.125rem; /** 2px */
181
+ --radius-xs: 0.25rem; /** 4px */
182
+ --radius-sm: 0.375rem; /** 6px */
184
183
  --radius-md: 0.5rem; /** 8px */
185
- --radius-lg: 1rem; /** 16px */
186
- --radius-xl: 1.5rem; /** 24px */
187
- --radius-2xl: 2rem; /** 32px */
188
- --radius-3xl: 3rem; /** 48px */
184
+ --radius-lg: 0.75rem; /** 12px */
185
+ --radius-xl: 1rem; /** 16px */
186
+ --radius-2xl: 1.5rem; /** 24px */
187
+ --radius-3xl: 2rem; /** 32 */
188
+ --radius-4xl: 3rem; /** 48px */
189
189
  --radius-full: 999px;
190
- --icon-size-xs: 1rem; /** 16px */
191
- --icon-size-sm: 1.25rem; /** 20px */
192
- --icon-size-md: 1.5rem; /** 24px */
193
- --icon-size-lg: 2rem; /** 32px */
194
- --icon-size-xl: 3rem; /** 48px */
195
190
  --border-width-0: 0;
196
191
  --border-width-1: 1px;
197
192
  --border-width-2: 2px;
193
+ --font-archivo: Archivo;
198
194
  --font-weight-regular: 400;
199
195
  --font-weight-medium: 500;
200
196
  --font-weight-bold: 700;
201
- --leading-1: 12px;
197
+ --leading-1: 14px;
202
198
  --leading-2: 16px;
203
199
  --leading-3: 20px;
204
200
  --leading-4: 24px;
@@ -206,9 +202,9 @@
206
202
  --leading-6: 32px;
207
203
  --leading-7: 36px;
208
204
  --leading-8: 40px;
209
- --leading-9: 52px;
205
+ --leading-9: 56px;
210
206
  --leading-10: 64px;
211
- --leading-none: 1;
207
+ --leading-none: normal;
212
208
  --text-xs: 0.75rem; /** 12px */
213
209
  --text-sm: 0.875rem; /** 14px */
214
210
  --text-md: 1rem; /** 16px */
@@ -217,6 +213,9 @@
217
213
  --text-2xl: 2em; /** 32px */
218
214
  --text-3xl: 2.25rem; /** 36px */
219
215
  --text-4xl: 3rem; /** 48px */
216
+ --shadow-overlow: 0 0 8px 0 rgba(30,31,33,0.16), 0 0 1px 0 rgba(30,31,33,0.12);
217
+ --shadow-overlay: 0 8px 12px 0 rgba(30,31,33,0.15), 0 0 1px 0 rgba(30,31,33,0.31);
218
+ --shadow-raised: 0 1px 1px 0 rgba(30,31,33,0.25), 0 0 1px 0 rgba(30,31,33,0.31);
220
219
  --color-text-default: var(--color-neutral-1000);
221
220
  --color-text-subtle: var(--color-neutral-800);
222
221
  --color-text-subtlest: var(--color-neutral-700);
@@ -358,18 +357,18 @@
358
357
  --color-background-brand-boldest-default: var(--color-bcc-1000);
359
358
  --color-background-brand-boldest-hover: var(--color-bcc-900);
360
359
  --color-background-brand-boldest-pressed: var(--color-bcc-800);
361
- --color-background-accent-neutral-default: var(--color-neutral-alpha-300-a);
362
- --color-background-accent-neutral-hover: var(--color-neutral-alpha-400-a);
363
- --color-background-accent-neutral-pressed: var(--color-neutral-alpha-500-a);
364
- --color-background-accent-neutral-subtle-default: var(--color-neutral-alpha-200-a);
365
- --color-background-accent-neutral-subtle-hover: var(--color-neutral-alpha-300-a);
366
- --color-background-accent-neutral-subtle-pressed: var(--color-neutral-alpha-400-a);
367
- --color-background-accent-neutral-subtler-default: var(--color-neutral-alpha-100-a);
368
- --color-background-accent-neutral-subtler-hover: var(--color-neutral-alpha-200-a);
369
- --color-background-accent-neutral-subtler-pressed: var(--color-neutral-alpha-300-a);
370
- --color-background-accent-neutral-subtlest-default: var(--color-transparent);
371
- --color-background-accent-neutral-subtlest-hover: var(--color-neutral-alpha-100-a);
372
- --color-background-accent-neutral-subtlest-pressed: var(--color-neutral-alpha-200-a);
360
+ --color-background-neutral-default: var(--color-neutral-alpha-300-a);
361
+ --color-background-neutral-hover: var(--color-neutral-alpha-400-a);
362
+ --color-background-neutral-pressed: var(--color-neutral-alpha-500-a);
363
+ --color-background-neutral-subtle-default: var(--color-neutral-alpha-200-a);
364
+ --color-background-neutral-subtle-hover: var(--color-neutral-alpha-300-a);
365
+ --color-background-neutral-subtle-pressed: var(--color-neutral-alpha-400-a);
366
+ --color-background-neutral-subtler-default: var(--color-neutral-alpha-100-a);
367
+ --color-background-neutral-subtler-hover: var(--color-neutral-alpha-200-a);
368
+ --color-background-neutral-subtler-pressed: var(--color-neutral-alpha-300-a);
369
+ --color-background-neutral-subtlest-default: var(--color-transparent);
370
+ --color-background-neutral-subtlest-hover: var(--color-neutral-alpha-100-a);
371
+ --color-background-neutral-subtlest-pressed: var(--color-neutral-alpha-200-a);
373
372
  --color-background-accent-blue-subtle-default: var(--color-blue-400);
374
373
  --color-background-accent-blue-subtle-hover: var(--color-blue-300);
375
374
  --color-background-accent-blue-subtle-pressed: var(--color-blue-200);
@@ -444,7 +443,10 @@
444
443
  --color-background-accent-orange-bolder-pressed: var(--color-orange-900);
445
444
  --color-background-accent-red-subtle-default: var(--color-red-400);
446
445
  --color-background-accent-red-subtle-hover: var(--color-red-300);
447
- --color-background-accent-red-subtle-pressed: var(--color-red-400);
446
+ --color-background-accent-red-subtle-pressed: var(--color-red-200);
447
+ --color-background-accent-red-subtler-default: var(--color-red-200);
448
+ --color-background-accent-red-subtler-hover: var(--color-red-300);
449
+ --color-background-accent-red-subtler-pressed: var(--color-red-400);
448
450
  --color-background-accent-red-subtlest-default: var(--color-red-100);
449
451
  --color-background-accent-red-subtlest-hover: var(--color-red-200);
450
452
  --color-background-accent-red-subtlest-pressed: var(--color-red-300);
@@ -503,13 +505,20 @@
503
505
  --color-elevation-surface-raised-hovered: var(--color-neutral-200);
504
506
  --color-elevation-surface-raised-pressed: var(--color-neutral-300);
505
507
  --color-elevation-surface-sunken-default: var(--color-neutral-100);
506
- --heading-xs: var(--font-weight-medium) var(--text-xs)/var(--leading-2) var(--font-archivo);
507
- --heading-sm: var(--font-weight-medium) var(--text-md)/var(--leading-3) var(--font-archivo);
508
- --heading-md: var(--font-weight-medium) var(--text-lg)/var(--leading-4) var(--font-archivo);
509
- --heading-lg: var(--font-weight-medium) var(--text-xl)/var(--leading-5) var(--font-archivo);
510
- --heading-xl: var(--font-weight-medium) var(--text-2xl)/var(--leading-6) var(--font-archivo);
511
- --heading-2xl: var(--font-weight-medium) var(--text-3xl)/var(--leading-8) var(--font-archivo);
512
- --heading-3xl: var(--font-weight-medium) var(--text-4xl)/var(--leading-9) var(--font-archivo);
508
+ --icon-size-xs: var(--spacing-200); /** 16px */
509
+ --icon-size-sm: var(--spacing-250); /** 20px */
510
+ --icon-size-md: var(--spacing-300); /** 24px */
511
+ --icon-size-lg: var(--spacing-400); /** 32px */
512
+ --icon-size-xl: var(--spacing-600); /** 48px */
513
+ --heading-xs: var(--font-weight-bold) var(--text-xs)/var(--leading-1) var(--font-archivo);
514
+ --heading-sm: var(--font-weight-bold) var(--text-sm)/var(--leading-2) var(--font-archivo);
515
+ --heading-md: var(--font-weight-bold) var(--text-md)/var(--leading-3) var(--font-archivo);
516
+ --heading-lg: var(--font-weight-bold) var(--text-lg)/var(--leading-4) var(--font-archivo);
517
+ --heading-xl: var(--font-weight-bold) var(--text-xl)/var(--leading-5) var(--font-archivo);
518
+ --heading-2xl: var(--font-weight-bold) var(--text-2xl)/var(--leading-6) var(--font-archivo);
519
+ --heading-3xl: var(--font-weight-bold) var(--text-3xl)/var(--leading-8) var(--font-archivo);
520
+ --heading-4xl: var(--font-weight-bold) var(--text-4xl)/var(--leading-9) var(--font-archivo);
521
+ --heading-5xl: var(--font-weight-bold) var(--text-4xl)/var(--leading-10) var(--font-archivo);
513
522
  --body-sm: var(--font-weight-regular) var(--text-xs)/var(--leading-2) var(--font-archivo);
514
523
  --body-md: var(--font-weight-regular) var(--text-sm)/var(--leading-3) var(--font-archivo);
515
524
  --body-lg: var(--font-weight-regular) var(--text-md)/var(--leading-4) var(--font-archivo);
@@ -519,7 +528,6 @@
519
528
  --color-background-inverse-subtle-default: rgba(255, 255, 255, 0.16);
520
529
  --color-background-inverse-subtle-hovered: rgba(255, 255, 255, 0.24);
521
530
  --color-background-inverse-subtle-pressed: rgba(255, 255, 255, 0.32);
522
- --color-background-accent-neutral-subtle-default: rgba(0, 0, 0, 0);
523
531
  --color-blanket-default: rgba(16, 18, 20, 0.6);
524
532
  --color-blanket-selected: rgba(29, 122, 252, 0.08);
525
533
  --color-blanket-danger: rgba(227, 73, 53, 0.08);
@@ -663,11 +671,103 @@
663
671
  --color-background-brand-bolder-default: var(--color-bcc-400);
664
672
  --color-background-brand-bolder-hover: var(--color-bcc-300);
665
673
  --color-background-brand-bolder-pressed: var(--color-bcc-200);
666
- --color-background-accent-neutral-subtlest-default: var(--color-dark-neutral-alpha-300-a);
667
- --color-background-accent-neutral-subtlest-hover: var(--color-dark-neutral-alpha-400-a);
668
- --color-background-accent-neutral-subtlest-pressed: var(--color-dark-neutral-alpha-200-a);
669
- --color-background-accent-neutral-subtle-hover: var(--color-dark-neutral-alpha-200-a);
670
- --color-background-accent-neutral-subtle-pressed: var(--color-dark-neutral-alpha-300-a);
674
+ --color-background-brand-boldest-default: var(--color-bcc-100);
675
+ --color-background-brand-boldest-hover: var(--color-bcc-200);
676
+ --color-background-brand-boldest-pressed: var(--color-bcc-300);
677
+ --color-background-neutral-default: var(--color-dark-neutral-alpha-300-a);
678
+ --color-background-neutral-hover: var(--color-dark-neutral-alpha-400-a);
679
+ --color-background-neutral-pressed: var(--color-dark-neutral-alpha-500-a);
680
+ --color-background-neutral-subtle-default: var(--color-dark-neutral-alpha-200-a);
681
+ --color-background-neutral-subtle-hover: var(--color-dark-neutral-alpha-300-a);
682
+ --color-background-neutral-subtle-pressed: var(--color-dark-neutral-alpha-400-a);
683
+ --color-background-neutral-subtler-default: var(--color-dark-neutral-alpha-100-a);
684
+ --color-background-neutral-subtler-hover: var(--color-dark-neutral-alpha-200-a);
685
+ --color-background-neutral-subtler-pressed: var(--color-dark-neutral-alpha-300-a);
686
+ --color-background-neutral-subtlest-hover: var(--color-dark-neutral-alpha-250-a);
687
+ --color-background-neutral-subtlest-pressed: var(--color-dark-neutral-alpha-300-a);
688
+ --color-background-accent-blue-subtlest-default: var(--color-blue-1000);
689
+ --color-background-accent-blue-subtlest-hover: var(--color-blue-900);
690
+ --color-background-accent-blue-subtlest-pressed: var(--color-blue-800);
691
+ --color-background-accent-blue-subtler-default: var(--color-blue-900);
692
+ --color-background-accent-blue-subtler-hover: var(--color-blue-800);
693
+ --color-background-accent-blue-subtler-pressed: var(--color-blue-700);
694
+ --color-background-accent-blue-subtle-default: var(--color-blue-700);
695
+ --color-background-accent-blue-subtle-hover: var(--color-blue-600);
696
+ --color-background-accent-blue-subtle-pressed: var(--color-blue-500);
697
+ --color-background-accent-blue-bolder-default: var(--color-blue-400);
698
+ --color-background-accent-blue-bolder-hover: var(--color-blue-300);
699
+ --color-background-accent-blue-bolder-pressed: var(--color-blue-200);
700
+ --color-background-accent-teal-subtlest-default: var(--color-teal-1000);
701
+ --color-background-accent-teal-subtlest-hover: var(--color-teal-900);
702
+ --color-background-accent-teal-subtlest-pressed: var(--color-teal-800);
703
+ --color-background-accent-teal-subtler-default: var(--color-teal-900);
704
+ --color-background-accent-teal-subtler-hover: var(--color-teal-800);
705
+ --color-background-accent-teal-subtler-pressed: var(--color-teal-700);
706
+ --color-background-accent-teal-subtle-default: var(--color-teal-700);
707
+ --color-background-accent-teal-subtle-hover: var(--color-teal-600);
708
+ --color-background-accent-teal-subtle-pressed: var(--color-teal-500);
709
+ --color-background-accent-teal-bolder-default: var(--color-teal-400);
710
+ --color-background-accent-teal-bolder-hover: var(--color-teal-300);
711
+ --color-background-accent-teal-bolder-pressed: var(--color-teal-200);
712
+ --color-background-accent-green-subtlest-default: var(--color-green-1000);
713
+ --color-background-accent-green-subtlest-hover: var(--color-green-900);
714
+ --color-background-accent-green-subtlest-pressed: var(--color-green-800);
715
+ --color-background-accent-green-subtler-default: var(--color-green-900);
716
+ --color-background-accent-green-subtler-hover: var(--color-green-800);
717
+ --color-background-accent-green-subtler-pressed: var(--color-green-700);
718
+ --color-background-accent-green-subtle-default: var(--color-green-700);
719
+ --color-background-accent-green-subtle-hover: var(--color-green-600);
720
+ --color-background-accent-green-subtle-pressed: var(--color-green-500);
721
+ --color-background-accent-green-bolder-default: var(--color-green-400);
722
+ --color-background-accent-green-bolder-hover: var(--color-green-300);
723
+ --color-background-accent-green-bolder-pressed: var(--color-green-200);
724
+ --color-background-accent-brown-subtlest-default: var(--color-brown-1000);
725
+ --color-background-accent-brown-subtlest-hover: var(--color-brown-900);
726
+ --color-background-accent-brown-subtlest-pressed: var(--color-brown-800);
727
+ --color-background-accent-brown-subtler-default: var(--color-brown-900);
728
+ --color-background-accent-brown-subtler-hover: var(--color-brown-800);
729
+ --color-background-accent-brown-subtler-pressed: var(--color-brown-700);
730
+ --color-background-accent-brown-subtle-default: var(--color-brown-700);
731
+ --color-background-accent-brown-subtle-hover: var(--color-brown-600);
732
+ --color-background-accent-brown-subtle-pressed: var(--color-brown-500);
733
+ --color-background-accent-brown-bolder-default: var(--color-brown-400);
734
+ --color-background-accent-brown-bolder-hover: var(--color-brown-300);
735
+ --color-background-accent-brown-bolder-pressed: var(--color-brown-200);
736
+ --color-background-accent-yellow-subtlest-default: var(--color-yellow-1000);
737
+ --color-background-accent-yellow-subtlest-hover: var(--color-yellow-900);
738
+ --color-background-accent-yellow-subtlest-pressed: var(--color-yellow-800);
739
+ --color-background-accent-yellow-subtler-default: var(--color-yellow-900);
740
+ --color-background-accent-yellow-subtler-hover: var(--color-yellow-800);
741
+ --color-background-accent-yellow-subtler-pressed: var(--color-yellow-700);
742
+ --color-background-accent-yellow-subtle-default: var(--color-yellow-700);
743
+ --color-background-accent-yellow-subtle-hover: var(--color-yellow-600);
744
+ --color-background-accent-yellow-bolder-default: var(--color-yellow-400);
745
+ --color-background-accent-yellow-bolder-hover: var(--color-yellow-300);
746
+ --color-background-accent-yellow-bolder-pressed: var(--color-yellow-200);
747
+ --color-background-accent-orange-subtlest-default: var(--color-orange-1000);
748
+ --color-background-accent-orange-subtlest-hover: var(--color-orange-900);
749
+ --color-background-accent-orange-subtlest-pressed: var(--color-orange-800);
750
+ --color-background-accent-orange-subtler-default: var(--color-orange-900);
751
+ --color-background-accent-orange-subtler-hover: var(--color-orange-800);
752
+ --color-background-accent-orange-subtler-pressed: var(--color-orange-700);
753
+ --color-background-accent-orange-subtle-default: var(--color-orange-700);
754
+ --color-background-accent-orange-subtle-hover: var(--color-orange-600);
755
+ --color-background-accent-orange-subtle-pressed: var(--color-orange-500);
756
+ --color-background-accent-orange-bolder-default: var(--color-orange-400);
757
+ --color-background-accent-orange-bolder-hover: var(--color-orange-300);
758
+ --color-background-accent-orange-bolder-pressed: var(--color-orange-200);
759
+ --color-background-accent-red-subtlest-default: var(--color-red-1000);
760
+ --color-background-accent-red-subtlest-hover: var(--color-red-900);
761
+ --color-background-accent-red-subtlest-pressed: var(--color-red-800);
762
+ --color-background-accent-red-subtler-default: var(--color-red-900);
763
+ --color-background-accent-red-subtler-hover: var(--color-red-800);
764
+ --color-background-accent-red-subtler-pressed: var(--color-red-700);
765
+ --color-background-accent-red-subtle-default: var(--color-red-700);
766
+ --color-background-accent-red-subtle-hover: var(--color-red-600);
767
+ --color-background-accent-red-subtle-pressed: var(--color-red-500);
768
+ --color-background-accent-red-bolder-default: var(--color-red-400);
769
+ --color-background-accent-red-bolder-hover: var(--color-red-300);
770
+ --color-background-accent-red-bolder-pressed: var(--color-red-200);
671
771
  --color-background-accent-purple-subtlest-default: var(--color-purple-1000);
672
772
  --color-background-accent-purple-subtlest-hover: var(--color-purple-900);
673
773
  --color-background-accent-purple-subtlest-pressed: var(--color-purple-800);
@@ -692,17 +792,20 @@
692
792
  --color-background-accent-magenta-bolder-default: var(--color-magenta-400);
693
793
  --color-background-accent-magenta-bolder-hover: var(--color-magenta-300);
694
794
  --color-background-accent-magenta-bolder-pressed: var(--color-magenta-200);
695
- --color-background-accent-gray-subtlest-default: var(--color-dark-neutral-200);
696
- --color-background-accent-gray-subtlest-hover: var(--color-dark-neutral-300);
697
- --color-background-accent-gray-subtlest-pressed: var(--color-dark-neutral-400);
698
- --color-background-accent-gray-subtler-default: var(--color-dark-neutral-400);
699
- --color-background-accent-gray-subtler-hover: var(--color-dark-neutral-500);
700
- --color-background-accent-gray-subtler-pressed: var(--color-dark-neutral-600);
701
- --color-background-accent-gray-subtle-default: var(--color-dark-neutral-500);
702
- --color-background-accent-gray-subtle-hover: var(--color-dark-neutral-400);
703
- --color-background-accent-gray-subtle-pressed: var(--color-dark-neutral-300);
795
+ --color-background-accent-gray-default: var(--color-dark-neutral-300);
796
+ --color-background-accent-gray-hover: var(--color-dark-neutral-400);
797
+ --color-background-accent-gray-pressed: var(--color-dark-neutral-500);
798
+ --color-background-accent-gray-subtle-default: var(--color-dark-neutral-200);
799
+ --color-background-accent-gray-subtle-hover: var(--color-dark-neutral-300);
800
+ --color-background-accent-gray-subtle-pressed: var(--color-dark-neutral-400);
801
+ --color-background-accent-gray-subtler-default: var(--color-dark-neutral-100);
802
+ --color-background-accent-gray-subtler-hover: var(--color-dark-neutral-200);
803
+ --color-background-accent-gray-subtler-pressed: var(--color-dark-neutral-300);
804
+ --color-background-accent-gray-subtlest-default: var(--color-dark-neutral-0);
805
+ --color-background-accent-gray-subtlest-hover: var(--color-dark-neutral-100);
806
+ --color-background-accent-gray-subtlest-pressed: var(--color-dark-neutral-200);
704
807
  --color-background-accent-gray-bolder-default: var(--color-dark-neutral-700);
705
- --color-background-accent-gray-bolder-hover: var(--color-dark-neutral-900);
808
+ --color-background-accent-gray-bolder-hover: var(--color-dark-neutral-800);
706
809
  --color-background-accent-gray-bolder-pressed: var(--color-dark-neutral-900);
707
810
  --color-skeleton-default: var(--color-dark-neutral-alpha-200-a);
708
811
  --color-skeleton-subtle: var(--color-dark-neutral-alpha-100-a);