@channel.io/bezier-tokens 0.3.3-beta.6 → 0.3.3-beta.7

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 (20) hide show
  1. package/dist/beta/cjs/darkTheme.js +37 -33
  2. package/dist/beta/cjs/global.js +13 -12
  3. package/dist/beta/cjs/lightTheme.js +4 -0
  4. package/dist/beta/css/styles.css +38 -29
  5. package/dist/beta/esm/darkTheme.mjs +37 -33
  6. package/dist/beta/esm/global.mjs +13 -12
  7. package/dist/beta/esm/lightTheme.mjs +4 -0
  8. package/dist/beta/scss/dark-theme.scss +25 -19
  9. package/dist/beta/scss/global.scss +14 -12
  10. package/dist/beta/scss/light-theme.scss +7 -1
  11. package/dist/types/beta/cjs/darkTheme.d.ts +49 -35
  12. package/dist/types/beta/cjs/global.d.ts +15 -12
  13. package/dist/types/beta/cjs/index.d.ts +78 -47
  14. package/dist/types/beta/cjs/lightTheme.d.ts +14 -0
  15. package/dist/types/beta/esm/darkTheme.d.mts +49 -35
  16. package/dist/types/beta/esm/global.d.mts +15 -12
  17. package/dist/types/beta/esm/index.d.mts +78 -47
  18. package/dist/types/beta/esm/index.d.mts.map +1 -1
  19. package/dist/types/beta/esm/lightTheme.d.mts +14 -0
  20. package/package.json +1 -1
package/dist/beta/cjs/darkTheme.js CHANGED
@@ -9,9 +9,9 @@ module.exports = Object.freeze({
9
9
  "border-right": Object.freeze({"value":"-1px 0 0 0 #ffffff1f","ref":"dimension-1-m 0 0 0 color-border-neutral"}),
10
10
  "border-left": Object.freeze({"value":"1px 0 0 0 #ffffff1f","ref":"dimension-1 0 0 0 color-border-neutral"}),
11
11
  "border-top": Object.freeze({"value":"0 1px 0 0 #ffffff1f","ref":"0 dimension-1 0 0 color-border-neutral"}),
12
- "border-white-high": Object.freeze({"value":"0 0 0 1px #2a2a2dff","ref":"0 0 0 dimension-1 color-surface-high"}),
13
- "border-white-higher": Object.freeze({"value":"0 0 0 1px #303035ff","ref":"0 0 0 dimension-1 color-surface-higher"}),
14
- "border-white-highest": Object.freeze({"value":"0 0 0 1px #37373cff","ref":"0 0 0 dimension-1 color-surface-highest"}),
12
+ "border-white-high": Object.freeze({"value":"0 0 0 1px #242426ff","ref":"0 0 0 dimension-1 color-surface-high"}),
13
+ "border-white-higher": Object.freeze({"value":"0 0 0 1px #29292dff","ref":"0 0 0 dimension-1 color-surface-higher"}),
14
+ "border-white-highest": Object.freeze({"value":"0 0 0 1px #313135ff","ref":"0 0 0 dimension-1 color-surface-highest"}),
15
15
  }),
16
16
  "elevation": Object.freeze({
17
17
  "elevation-1": Object.freeze({"value":"0 1px 2px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f","ref":"0 dimension-1 dimension-2 0 color-elevation-small, 0 0 dimension-2 dimension-1 color-elevation-base, inset 0 0 dimension-2 0 color-elevation-base-inner"}),
@@ -158,6 +158,8 @@ module.exports = Object.freeze({
158
158
  "color-text-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
159
159
  "color-text-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
160
160
  "color-text-absolute-black-hovered": Object.freeze({"value":"#0a0a0aff"}),
161
+ "color-text-inverse": Object.freeze({"value":"#000000d9","ref":"color-black-85"}),
162
+ "color-text-inverse-hovered": Object.freeze({"value":"#0a0a0ad9"}),
161
163
  "color-icon-action": Object.freeze({"value":"#6b6effff","ref":"color-blue-300"}),
162
164
  "color-icon-action-hovered": Object.freeze({"value":"#8184ffff"}),
163
165
  "color-icon-success": Object.freeze({"value":"#4bc16cff","ref":"color-green-300"}),
@@ -200,6 +202,8 @@ module.exports = Object.freeze({
200
202
  "color-icon-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
201
203
  "color-icon-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
202
204
  "color-icon-absolute-black-hovered": Object.freeze({"value":"#0a0a0aff"}),
205
+ "color-icon-inverse-heavier": Object.freeze({"value":"#000000d9","ref":"color-black-85"}),
206
+ "color-icon-inverse-heavier-hovered": Object.freeze({"value":"#0a0a0ad9"}),
203
207
  "color-fill-neutral-heaviest": Object.freeze({"value":"#ffffffe6","ref":"color-white-90"}),
204
208
  "color-fill-neutral-heaviest-hovered": Object.freeze({"value":"#ededede6"}),
205
209
  "color-fill-neutral-heavier": Object.freeze({"value":"#fff6","ref":"color-white-40"}),
@@ -254,12 +258,12 @@ module.exports = Object.freeze({
254
258
  "color-fill-critical-lighter-hovered": Object.freeze({"value":"#f7717145"}),
255
259
  "color-fill-critical-transparent": Object.freeze({"value":"#f2606000","ref":"color-red-300-0"}),
256
260
  "color-fill-critical-transparent-hovered": Object.freeze({"value":"#f260601a"}),
257
- "color-fill-grey": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
258
- "color-fill-grey-hovered": Object.freeze({"value":"#343438ff"}),
259
- "color-fill-grey-heavy": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
260
- "color-fill-grey-heavy-hovered": Object.freeze({"value":"#3a3a40ff"}),
261
- "color-fill-grey-heavier": Object.freeze({"value":"#37373cff","ref":"color-grey-750"}),
262
- "color-fill-grey-heavier-hovered": Object.freeze({"value":"#414147ff"}),
261
+ "color-fill-grey": Object.freeze({"value":"#242426ff","ref":"color-grey-850"}),
262
+ "color-fill-grey-hovered": Object.freeze({"value":"#2e2e31ff"}),
263
+ "color-fill-grey-heavy": Object.freeze({"value":"#29292dff","ref":"color-grey-800"}),
264
+ "color-fill-grey-heavy-hovered": Object.freeze({"value":"#333338ff"}),
265
+ "color-fill-grey-heavier": Object.freeze({"value":"#313135ff","ref":"color-grey-750"}),
266
+ "color-fill-grey-heavier-hovered": Object.freeze({"value":"#3b3b40ff"}),
263
267
  "color-fill-accent-blue": Object.freeze({"value":"#6b6eff2e","ref":"color-blue-300-18"}),
264
268
  "color-fill-accent-blue-hovered": Object.freeze({"value":"#8184ff45"}),
265
269
  "color-fill-accent-blue-heavy": Object.freeze({"value":"#6b6eff4d","ref":"color-blue-300-30"}),
@@ -366,36 +370,36 @@ module.exports = Object.freeze({
366
370
  "color-border-neutral-heavy-hovered": Object.freeze({"value":"#ededed4d"}),
367
371
  "color-border-neutral-heavier": Object.freeze({"value":"#fff6","ref":"color-white-40"}),
368
372
  "color-border-neutral-heavier-hovered": Object.freeze({"value":"#ededed66"}),
369
- "color-border-detach": Object.freeze({"value":"#242428ff","ref":"color-grey-900"}),
370
- "color-border-detach-hovered": Object.freeze({"value":"#2e2e33ff"}),
371
- "color-border-detach-highest": Object.freeze({"value":"#454549ff","ref":"color-grey-700"}),
372
- "color-border-detach-highest-hovered": Object.freeze({"value":"#4f4f54ff"}),
373
- "color-border-detach-higher": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
374
- "color-border-detach-higher-hovered": Object.freeze({"value":"#3a3a40ff"}),
375
- "color-border-detach-high": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
376
- "color-border-detach-high-hovered": Object.freeze({"value":"#343438ff"}),
373
+ "color-border-detach": Object.freeze({"value":"#1d1d20ff","ref":"color-grey-900"}),
374
+ "color-border-detach-hovered": Object.freeze({"value":"#27272bff"}),
375
+ "color-border-detach-highest": Object.freeze({"value":"#313135ff","ref":"color-grey-750"}),
376
+ "color-border-detach-highest-hovered": Object.freeze({"value":"#3b3b40ff"}),
377
+ "color-border-detach-higher": Object.freeze({"value":"#29292dff","ref":"color-grey-800"}),
378
+ "color-border-detach-higher-hovered": Object.freeze({"value":"#333338ff"}),
379
+ "color-border-detach-high": Object.freeze({"value":"#242426ff","ref":"color-grey-850"}),
380
+ "color-border-detach-high-hovered": Object.freeze({"value":"#2e2e31ff"}),
377
381
  "color-border-detach-low": Object.freeze({"value":"#1a1a1cff","ref":"color-grey-950"}),
378
382
  "color-border-detach-low-hovered": Object.freeze({"value":"#242427ff"}),
379
383
  "color-border-absolute-white": Object.freeze({"value":"#ffff","ref":"color-white-100"}),
380
384
  "color-border-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
381
- "color-surface": Object.freeze({"value":"#242428ff","ref":"color-grey-900"}),
382
- "color-surface-hovered": Object.freeze({"value":"#2e2e33ff"}),
383
- "color-surface-highest": Object.freeze({"value":"#37373cff","ref":"color-grey-750"}),
384
- "color-surface-highest-hovered": Object.freeze({"value":"#414147ff"}),
385
- "color-surface-higher": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
386
- "color-surface-higher-hovered": Object.freeze({"value":"#3a3a40ff"}),
387
- "color-surface-high": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
388
- "color-surface-high-hovered": Object.freeze({"value":"#343438ff"}),
385
+ "color-surface": Object.freeze({"value":"#1d1d20ff","ref":"color-grey-900"}),
386
+ "color-surface-hovered": Object.freeze({"value":"#27272bff"}),
387
+ "color-surface-highest": Object.freeze({"value":"#313135ff","ref":"color-grey-750"}),
388
+ "color-surface-highest-hovered": Object.freeze({"value":"#3b3b40ff"}),
389
+ "color-surface-higher": Object.freeze({"value":"#29292dff","ref":"color-grey-800"}),
390
+ "color-surface-higher-hovered": Object.freeze({"value":"#333338ff"}),
391
+ "color-surface-high": Object.freeze({"value":"#242426ff","ref":"color-grey-850"}),
392
+ "color-surface-high-hovered": Object.freeze({"value":"#2e2e31ff"}),
389
393
  "color-surface-low": Object.freeze({"value":"#1a1a1cff","ref":"color-grey-950"}),
390
394
  "color-surface-low-hovered": Object.freeze({"value":"#242427ff"}),
391
- "color-surface-glass": Object.freeze({"value":"#303035e6","ref":"color-grey-800-90"}),
392
- "color-surface-glass-hovered": Object.freeze({"value":"#3a3a40e6"}),
393
- "color-surface-glass-highest": Object.freeze({"value":"#454549e6","ref":"color-grey-700-90"}),
394
- "color-surface-glass-highest-hovered": Object.freeze({"value":"#4f4f54e6"}),
395
- "color-surface-glass-higher": Object.freeze({"value":"#303035e6","ref":"color-grey-800-90"}),
396
- "color-surface-glass-higher-hovered": Object.freeze({"value":"#3a3a40e6"}),
397
- "color-surface-glass-high": Object.freeze({"value":"#2a2a2de6","ref":"color-grey-850-90"}),
398
- "color-surface-glass-high-hovered": Object.freeze({"value":"#343438e6"}),
395
+ "color-surface-glass": Object.freeze({"value":"#29292de6","ref":"color-grey-800-90"}),
396
+ "color-surface-glass-hovered": Object.freeze({"value":"#333338e6"}),
397
+ "color-surface-glass-highest": Object.freeze({"value":"#313135e6","ref":"color-grey-750-90"}),
398
+ "color-surface-glass-highest-hovered": Object.freeze({"value":"#3b3b40e6"}),
399
+ "color-surface-glass-higher": Object.freeze({"value":"#29292de6","ref":"color-grey-800-90"}),
400
+ "color-surface-glass-higher-hovered": Object.freeze({"value":"#333338e6"}),
401
+ "color-surface-glass-high": Object.freeze({"value":"#242426e6","ref":"color-grey-850-90"}),
402
+ "color-surface-glass-high-hovered": Object.freeze({"value":"#2e2e31e6"}),
399
403
  "color-surface-accent-blue": Object.freeze({"value":"#6b6effff","ref":"color-blue-300"}),
400
404
  "color-surface-accent-blue-hovered": Object.freeze({"value":"#8184ffff"}),
401
405
  "color-surface-accent-cobalt": Object.freeze({"value":"#5cadefff","ref":"color-cobalt-300"}),
package/dist/beta/cjs/global.js CHANGED
@@ -183,25 +183,26 @@ module.exports = Object.freeze({
183
183
  "color-grey-400": Object.freeze({"value":"#cfcfd1ff"}),
184
184
  "color-grey-500": Object.freeze({"value":"#a7a7aaff"}),
185
185
  "color-grey-600": Object.freeze({"value":"#79797eff"}),
186
- "color-grey-700": Object.freeze({"value":"#454549ff"}),
187
- "color-grey-750": Object.freeze({"value":"#37373cff"}),
188
- "color-grey-800": Object.freeze({"value":"#303035ff"}),
189
- "color-grey-850": Object.freeze({"value":"#2a2a2dff"}),
190
- "color-grey-900": Object.freeze({"value":"#242428ff"}),
186
+ "color-grey-700": Object.freeze({"value":"#3b3b3fff"}),
187
+ "color-grey-750": Object.freeze({"value":"#313135ff"}),
188
+ "color-grey-800": Object.freeze({"value":"#29292dff"}),
189
+ "color-grey-850": Object.freeze({"value":"#242426ff"}),
190
+ "color-grey-900": Object.freeze({"value":"#1d1d20ff"}),
191
191
  "color-grey-950": Object.freeze({"value":"#1a1a1cff"}),
192
192
  "color-grey-50-80": Object.freeze({"value":"#fbfbfbcc"}),
193
193
  "color-grey-100-80": Object.freeze({"value":"#f7f7f8cc"}),
194
194
  "color-grey-100-90": Object.freeze({"value":"#f7f7f8e6"}),
195
195
  "color-grey-200-80": Object.freeze({"value":"#efeff0cc"}),
196
196
  "color-grey-200-90": Object.freeze({"value":"#efeff0e6"}),
197
- "color-grey-700-80": Object.freeze({"value":"#454549cc"}),
198
- "color-grey-700-90": Object.freeze({"value":"#454549e6"}),
199
- "color-grey-800-80": Object.freeze({"value":"#303035cc"}),
200
- "color-grey-800-90": Object.freeze({"value":"#303035e6"}),
201
- "color-grey-850-80": Object.freeze({"value":"#2a2a2dcc"}),
202
- "color-grey-850-90": Object.freeze({"value":"#2a2a2de6"}),
197
+ "color-grey-700-80": Object.freeze({"value":"#3b3b3fcc"}),
198
+ "color-grey-700-90": Object.freeze({"value":"#3b3b3fe6"}),
199
+ "color-grey-750-90": Object.freeze({"value":"#313135e6"}),
200
+ "color-grey-800-80": Object.freeze({"value":"#29292dcc"}),
201
+ "color-grey-800-90": Object.freeze({"value":"#29292de6"}),
202
+ "color-grey-850-80": Object.freeze({"value":"#242426cc"}),
203
+ "color-grey-850-90": Object.freeze({"value":"#242426e6"}),
203
204
  "color-grey-900-0": Object.freeze({"value":"#24242800"}),
204
- "color-grey-900-90": Object.freeze({"value":"#242428e6"}),
205
+ "color-grey-900-90": Object.freeze({"value":"#1d1d2000"}),
205
206
  "color-white-0": Object.freeze({"value":"#fff0"}),
206
207
  "color-white-3": Object.freeze({"value":"#ffffff08"}),
207
208
  "color-white-5": Object.freeze({"value":"#ffffff0d"}),
package/dist/beta/cjs/lightTheme.js CHANGED
@@ -158,6 +158,8 @@ module.exports = Object.freeze({
158
158
  "color-text-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
159
159
  "color-text-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
160
160
  "color-text-absolute-black-hovered": Object.freeze({"value":"#1c1c1cff"}),
161
+ "color-text-inverse": Object.freeze({"value":"#fffc","ref":"color-white-80"}),
162
+ "color-text-inverse-hovered": Object.freeze({"value":"#edededcc"}),
161
163
  "color-icon-action": Object.freeze({"value":"#6157eaff","ref":"color-blue-400"}),
162
164
  "color-icon-action-hovered": Object.freeze({"value":"#5146e4ff"}),
163
165
  "color-icon-success": Object.freeze({"value":"#20ab55ff","ref":"color-green-400"}),
@@ -200,6 +202,8 @@ module.exports = Object.freeze({
200
202
  "color-icon-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
201
203
  "color-icon-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
202
204
  "color-icon-absolute-black-hovered": Object.freeze({"value":"#1c1c1cff"}),
205
+ "color-icon-inverse-heavier": Object.freeze({"value":"#fffc","ref":"color-white-80"}),
206
+ "color-icon-inverse-heavier-hovered": Object.freeze({"value":"#edededcc"}),
203
207
  "color-fill-neutral-heaviest": Object.freeze({"value":"#000000d9","ref":"color-black-85"}),
204
208
  "color-fill-neutral-heaviest-hovered": Object.freeze({"value":"#1c1c1cd9"}),
205
209
  "color-fill-neutral-heavier": Object.freeze({"value":"#0006","ref":"color-black-40"}),
package/dist/beta/css/styles.css CHANGED
@@ -139,6 +139,8 @@
139
139
  --color-text-absolute-white-hovered: #edededff;
140
140
  --color-text-absolute-black: var(--color-black-100);
141
141
  --color-text-absolute-black-hovered: #0a0a0aff;
142
+ --color-text-inverse: var(--color-black-85);
143
+ --color-text-inverse-hovered: #0a0a0ad9;
142
144
  --color-icon-action: var(--color-blue-300);
143
145
  --color-icon-action-hovered: #8184ffff;
144
146
  --color-icon-success: var(--color-green-300);
@@ -181,6 +183,8 @@
181
183
  --color-icon-absolute-white-hovered: #edededff;
182
184
  --color-icon-absolute-black: var(--color-black-100);
183
185
  --color-icon-absolute-black-hovered: #0a0a0aff;
186
+ --color-icon-inverse-heavier: var(--color-black-85);
187
+ --color-icon-inverse-heavier-hovered: #0a0a0ad9;
184
188
  --color-fill-neutral-heaviest: var(--color-white-90);
185
189
  --color-fill-neutral-heaviest-hovered: #ededede6;
186
190
  --color-fill-neutral-heavier: var(--color-white-40);
@@ -236,11 +240,11 @@
236
240
  --color-fill-critical-transparent: var(--color-red-300-0);
237
241
  --color-fill-critical-transparent-hovered: #f260601a;
238
242
  --color-fill-grey: var(--color-grey-850);
239
- --color-fill-grey-hovered: #343438ff;
243
+ --color-fill-grey-hovered: #2e2e31ff;
240
244
  --color-fill-grey-heavy: var(--color-grey-800);
241
- --color-fill-grey-heavy-hovered: #3a3a40ff;
245
+ --color-fill-grey-heavy-hovered: #333338ff;
242
246
  --color-fill-grey-heavier: var(--color-grey-750);
243
- --color-fill-grey-heavier-hovered: #414147ff;
247
+ --color-fill-grey-heavier-hovered: #3b3b40ff;
244
248
  --color-fill-accent-blue: var(--color-blue-300-18);
245
249
  --color-fill-accent-blue-hovered: #8184ff45;
246
250
  --color-fill-accent-blue-heavy: var(--color-blue-300-30);
@@ -348,35 +352,35 @@
348
352
  --color-border-neutral-heavier: var(--color-white-40);
349
353
  --color-border-neutral-heavier-hovered: #ededed66;
350
354
  --color-border-detach: var(--color-grey-900);
351
- --color-border-detach-hovered: #2e2e33ff;
352
- --color-border-detach-highest: var(--color-grey-700);
353
- --color-border-detach-highest-hovered: #4f4f54ff;
355
+ --color-border-detach-hovered: #27272bff;
356
+ --color-border-detach-highest: var(--color-grey-750);
357
+ --color-border-detach-highest-hovered: #3b3b40ff;
354
358
  --color-border-detach-higher: var(--color-grey-800);
355
- --color-border-detach-higher-hovered: #3a3a40ff;
359
+ --color-border-detach-higher-hovered: #333338ff;
356
360
  --color-border-detach-high: var(--color-grey-850);
357
- --color-border-detach-high-hovered: #343438ff;
361
+ --color-border-detach-high-hovered: #2e2e31ff;
358
362
  --color-border-detach-low: var(--color-grey-950);
359
363
  --color-border-detach-low-hovered: #242427ff;
360
364
  --color-border-absolute-white: var(--color-white-100);
361
365
  --color-border-absolute-white-hovered: #edededff;
362
366
  --color-surface: var(--color-grey-900);
363
- --color-surface-hovered: #2e2e33ff;
367
+ --color-surface-hovered: #27272bff;
364
368
  --color-surface-highest: var(--color-grey-750);
365
- --color-surface-highest-hovered: #414147ff;
369
+ --color-surface-highest-hovered: #3b3b40ff;
366
370
  --color-surface-higher: var(--color-grey-800);
367
- --color-surface-higher-hovered: #3a3a40ff;
371
+ --color-surface-higher-hovered: #333338ff;
368
372
  --color-surface-high: var(--color-grey-850);
369
- --color-surface-high-hovered: #343438ff;
373
+ --color-surface-high-hovered: #2e2e31ff;
370
374
  --color-surface-low: var(--color-grey-950);
371
375
  --color-surface-low-hovered: #242427ff;
372
376
  --color-surface-glass: var(--color-grey-800-90);
373
- --color-surface-glass-hovered: #3a3a40e6;
374
- --color-surface-glass-highest: var(--color-grey-700-90);
375
- --color-surface-glass-highest-hovered: #4f4f54e6;
377
+ --color-surface-glass-hovered: #333338e6;
378
+ --color-surface-glass-highest: var(--color-grey-750-90);
379
+ --color-surface-glass-highest-hovered: #3b3b40e6;
376
380
  --color-surface-glass-higher: var(--color-grey-800-90);
377
- --color-surface-glass-higher-hovered: #3a3a40e6;
381
+ --color-surface-glass-higher-hovered: #333338e6;
378
382
  --color-surface-glass-high: var(--color-grey-850-90);
379
- --color-surface-glass-high-hovered: #343438e6;
383
+ --color-surface-glass-high-hovered: #2e2e31e6;
380
384
  --color-surface-accent-blue: var(--color-blue-300);
381
385
  --color-surface-accent-blue-hovered: #8184ffff;
382
386
  --color-surface-accent-cobalt: var(--color-cobalt-300);
@@ -619,25 +623,26 @@
619
623
  --color-grey-400: #cfcfd1ff;
620
624
  --color-grey-500: #a7a7aaff;
621
625
  --color-grey-600: #79797eff;
622
- --color-grey-700: #454549ff;
623
- --color-grey-750: #37373cff;
624
- --color-grey-800: #303035ff;
625
- --color-grey-850: #2a2a2dff;
626
- --color-grey-900: #242428ff;
626
+ --color-grey-700: #3b3b3fff;
627
+ --color-grey-750: #313135ff;
628
+ --color-grey-800: #29292dff;
629
+ --color-grey-850: #242426ff;
630
+ --color-grey-900: #1d1d20ff;
627
631
  --color-grey-950: #1a1a1cff;
628
632
  --color-grey-50-80: #fbfbfbcc;
629
633
  --color-grey-100-80: #f7f7f8cc;
630
634
  --color-grey-100-90: #f7f7f8e6;
631
635
  --color-grey-200-80: #efeff0cc;
632
636
  --color-grey-200-90: #efeff0e6;
633
- --color-grey-700-80: #454549cc;
634
- --color-grey-700-90: #454549e6;
635
- --color-grey-800-80: #303035cc;
636
- --color-grey-800-90: #303035e6;
637
- --color-grey-850-80: #2a2a2dcc;
638
- --color-grey-850-90: #2a2a2de6;
637
+ --color-grey-700-80: #3b3b3fcc;
638
+ --color-grey-700-90: #3b3b3fe6;
639
+ --color-grey-750-90: #313135e6;
640
+ --color-grey-800-80: #29292dcc;
641
+ --color-grey-800-90: #29292de6;
642
+ --color-grey-850-80: #242426cc;
643
+ --color-grey-850-90: #242426e6;
639
644
  --color-grey-900-0: #24242800;
640
- --color-grey-900-90: #242428e6;
645
+ --color-grey-900-90: #1d1d2000;
641
646
  --color-white-0: #fff0;
642
647
  --color-white-3: #ffffff08;
643
648
  --color-white-5: #ffffff0d;
@@ -890,6 +895,8 @@
890
895
  --color-text-absolute-white-hovered: #edededff;
891
896
  --color-text-absolute-black: var(--color-black-100);
892
897
  --color-text-absolute-black-hovered: #1c1c1cff;
898
+ --color-text-inverse: var(--color-white-80);
899
+ --color-text-inverse-hovered: #edededcc;
893
900
  --color-icon-action: var(--color-blue-400);
894
901
  --color-icon-action-hovered: #5146e4ff;
895
902
  --color-icon-success: var(--color-green-400);
@@ -932,6 +939,8 @@
932
939
  --color-icon-absolute-white-hovered: #edededff;
933
940
  --color-icon-absolute-black: var(--color-black-100);
934
941
  --color-icon-absolute-black-hovered: #1c1c1cff;
942
+ --color-icon-inverse-heavier: var(--color-white-80);
943
+ --color-icon-inverse-heavier-hovered: #edededcc;
935
944
  --color-fill-neutral-heaviest: var(--color-black-85);
936
945
  --color-fill-neutral-heaviest-hovered: #1c1c1cd9;
937
946
  --color-fill-neutral-heavier: var(--color-black-40);
package/dist/beta/esm/darkTheme.mjs CHANGED
@@ -9,9 +9,9 @@ export default Object.freeze({
9
9
  "border-right": Object.freeze({"value":"-1px 0 0 0 #ffffff1f","ref":"dimension-1-m 0 0 0 color-border-neutral"}),
10
10
  "border-left": Object.freeze({"value":"1px 0 0 0 #ffffff1f","ref":"dimension-1 0 0 0 color-border-neutral"}),
11
11
  "border-top": Object.freeze({"value":"0 1px 0 0 #ffffff1f","ref":"0 dimension-1 0 0 color-border-neutral"}),
12
- "border-white-high": Object.freeze({"value":"0 0 0 1px #2a2a2dff","ref":"0 0 0 dimension-1 color-surface-high"}),
13
- "border-white-higher": Object.freeze({"value":"0 0 0 1px #303035ff","ref":"0 0 0 dimension-1 color-surface-higher"}),
14
- "border-white-highest": Object.freeze({"value":"0 0 0 1px #37373cff","ref":"0 0 0 dimension-1 color-surface-highest"}),
12
+ "border-white-high": Object.freeze({"value":"0 0 0 1px #242426ff","ref":"0 0 0 dimension-1 color-surface-high"}),
13
+ "border-white-higher": Object.freeze({"value":"0 0 0 1px #29292dff","ref":"0 0 0 dimension-1 color-surface-higher"}),
14
+ "border-white-highest": Object.freeze({"value":"0 0 0 1px #313135ff","ref":"0 0 0 dimension-1 color-surface-highest"}),
15
15
  }),
16
16
  "elevation": Object.freeze({
17
17
  "elevation-1": Object.freeze({"value":"0 1px 2px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f","ref":"0 dimension-1 dimension-2 0 color-elevation-small, 0 0 dimension-2 dimension-1 color-elevation-base, inset 0 0 dimension-2 0 color-elevation-base-inner"}),
@@ -158,6 +158,8 @@ export default Object.freeze({
158
158
  "color-text-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
159
159
  "color-text-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
160
160
  "color-text-absolute-black-hovered": Object.freeze({"value":"#0a0a0aff"}),
161
+ "color-text-inverse": Object.freeze({"value":"#000000d9","ref":"color-black-85"}),
162
+ "color-text-inverse-hovered": Object.freeze({"value":"#0a0a0ad9"}),
161
163
  "color-icon-action": Object.freeze({"value":"#6b6effff","ref":"color-blue-300"}),
162
164
  "color-icon-action-hovered": Object.freeze({"value":"#8184ffff"}),
163
165
  "color-icon-success": Object.freeze({"value":"#4bc16cff","ref":"color-green-300"}),
@@ -200,6 +202,8 @@ export default Object.freeze({
200
202
  "color-icon-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
201
203
  "color-icon-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
202
204
  "color-icon-absolute-black-hovered": Object.freeze({"value":"#0a0a0aff"}),
205
+ "color-icon-inverse-heavier": Object.freeze({"value":"#000000d9","ref":"color-black-85"}),
206
+ "color-icon-inverse-heavier-hovered": Object.freeze({"value":"#0a0a0ad9"}),
203
207
  "color-fill-neutral-heaviest": Object.freeze({"value":"#ffffffe6","ref":"color-white-90"}),
204
208
  "color-fill-neutral-heaviest-hovered": Object.freeze({"value":"#ededede6"}),
205
209
  "color-fill-neutral-heavier": Object.freeze({"value":"#fff6","ref":"color-white-40"}),
@@ -254,12 +258,12 @@ export default Object.freeze({
254
258
  "color-fill-critical-lighter-hovered": Object.freeze({"value":"#f7717145"}),
255
259
  "color-fill-critical-transparent": Object.freeze({"value":"#f2606000","ref":"color-red-300-0"}),
256
260
  "color-fill-critical-transparent-hovered": Object.freeze({"value":"#f260601a"}),
257
- "color-fill-grey": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
258
- "color-fill-grey-hovered": Object.freeze({"value":"#343438ff"}),
259
- "color-fill-grey-heavy": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
260
- "color-fill-grey-heavy-hovered": Object.freeze({"value":"#3a3a40ff"}),
261
- "color-fill-grey-heavier": Object.freeze({"value":"#37373cff","ref":"color-grey-750"}),
262
- "color-fill-grey-heavier-hovered": Object.freeze({"value":"#414147ff"}),
261
+ "color-fill-grey": Object.freeze({"value":"#242426ff","ref":"color-grey-850"}),
262
+ "color-fill-grey-hovered": Object.freeze({"value":"#2e2e31ff"}),
263
+ "color-fill-grey-heavy": Object.freeze({"value":"#29292dff","ref":"color-grey-800"}),
264
+ "color-fill-grey-heavy-hovered": Object.freeze({"value":"#333338ff"}),
265
+ "color-fill-grey-heavier": Object.freeze({"value":"#313135ff","ref":"color-grey-750"}),
266
+ "color-fill-grey-heavier-hovered": Object.freeze({"value":"#3b3b40ff"}),
263
267
  "color-fill-accent-blue": Object.freeze({"value":"#6b6eff2e","ref":"color-blue-300-18"}),
264
268
  "color-fill-accent-blue-hovered": Object.freeze({"value":"#8184ff45"}),
265
269
  "color-fill-accent-blue-heavy": Object.freeze({"value":"#6b6eff4d","ref":"color-blue-300-30"}),
@@ -366,36 +370,36 @@ export default Object.freeze({
366
370
  "color-border-neutral-heavy-hovered": Object.freeze({"value":"#ededed4d"}),
367
371
  "color-border-neutral-heavier": Object.freeze({"value":"#fff6","ref":"color-white-40"}),
368
372
  "color-border-neutral-heavier-hovered": Object.freeze({"value":"#ededed66"}),
369
- "color-border-detach": Object.freeze({"value":"#242428ff","ref":"color-grey-900"}),
370
- "color-border-detach-hovered": Object.freeze({"value":"#2e2e33ff"}),
371
- "color-border-detach-highest": Object.freeze({"value":"#454549ff","ref":"color-grey-700"}),
372
- "color-border-detach-highest-hovered": Object.freeze({"value":"#4f4f54ff"}),
373
- "color-border-detach-higher": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
374
- "color-border-detach-higher-hovered": Object.freeze({"value":"#3a3a40ff"}),
375
- "color-border-detach-high": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
376
- "color-border-detach-high-hovered": Object.freeze({"value":"#343438ff"}),
373
+ "color-border-detach": Object.freeze({"value":"#1d1d20ff","ref":"color-grey-900"}),
374
+ "color-border-detach-hovered": Object.freeze({"value":"#27272bff"}),
375
+ "color-border-detach-highest": Object.freeze({"value":"#313135ff","ref":"color-grey-750"}),
376
+ "color-border-detach-highest-hovered": Object.freeze({"value":"#3b3b40ff"}),
377
+ "color-border-detach-higher": Object.freeze({"value":"#29292dff","ref":"color-grey-800"}),
378
+ "color-border-detach-higher-hovered": Object.freeze({"value":"#333338ff"}),
379
+ "color-border-detach-high": Object.freeze({"value":"#242426ff","ref":"color-grey-850"}),
380
+ "color-border-detach-high-hovered": Object.freeze({"value":"#2e2e31ff"}),
377
381
  "color-border-detach-low": Object.freeze({"value":"#1a1a1cff","ref":"color-grey-950"}),
378
382
  "color-border-detach-low-hovered": Object.freeze({"value":"#242427ff"}),
379
383
  "color-border-absolute-white": Object.freeze({"value":"#ffff","ref":"color-white-100"}),
380
384
  "color-border-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
381
- "color-surface": Object.freeze({"value":"#242428ff","ref":"color-grey-900"}),
382
- "color-surface-hovered": Object.freeze({"value":"#2e2e33ff"}),
383
- "color-surface-highest": Object.freeze({"value":"#37373cff","ref":"color-grey-750"}),
384
- "color-surface-highest-hovered": Object.freeze({"value":"#414147ff"}),
385
- "color-surface-higher": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
386
- "color-surface-higher-hovered": Object.freeze({"value":"#3a3a40ff"}),
387
- "color-surface-high": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
388
- "color-surface-high-hovered": Object.freeze({"value":"#343438ff"}),
385
+ "color-surface": Object.freeze({"value":"#1d1d20ff","ref":"color-grey-900"}),
386
+ "color-surface-hovered": Object.freeze({"value":"#27272bff"}),
387
+ "color-surface-highest": Object.freeze({"value":"#313135ff","ref":"color-grey-750"}),
388
+ "color-surface-highest-hovered": Object.freeze({"value":"#3b3b40ff"}),
389
+ "color-surface-higher": Object.freeze({"value":"#29292dff","ref":"color-grey-800"}),
390
+ "color-surface-higher-hovered": Object.freeze({"value":"#333338ff"}),
391
+ "color-surface-high": Object.freeze({"value":"#242426ff","ref":"color-grey-850"}),
392
+ "color-surface-high-hovered": Object.freeze({"value":"#2e2e31ff"}),
389
393
  "color-surface-low": Object.freeze({"value":"#1a1a1cff","ref":"color-grey-950"}),
390
394
  "color-surface-low-hovered": Object.freeze({"value":"#242427ff"}),
391
- "color-surface-glass": Object.freeze({"value":"#303035e6","ref":"color-grey-800-90"}),
392
- "color-surface-glass-hovered": Object.freeze({"value":"#3a3a40e6"}),
393
- "color-surface-glass-highest": Object.freeze({"value":"#454549e6","ref":"color-grey-700-90"}),
394
- "color-surface-glass-highest-hovered": Object.freeze({"value":"#4f4f54e6"}),
395
- "color-surface-glass-higher": Object.freeze({"value":"#303035e6","ref":"color-grey-800-90"}),
396
- "color-surface-glass-higher-hovered": Object.freeze({"value":"#3a3a40e6"}),
397
- "color-surface-glass-high": Object.freeze({"value":"#2a2a2de6","ref":"color-grey-850-90"}),
398
- "color-surface-glass-high-hovered": Object.freeze({"value":"#343438e6"}),
395
+ "color-surface-glass": Object.freeze({"value":"#29292de6","ref":"color-grey-800-90"}),
396
+ "color-surface-glass-hovered": Object.freeze({"value":"#333338e6"}),
397
+ "color-surface-glass-highest": Object.freeze({"value":"#313135e6","ref":"color-grey-750-90"}),
398
+ "color-surface-glass-highest-hovered": Object.freeze({"value":"#3b3b40e6"}),
399
+ "color-surface-glass-higher": Object.freeze({"value":"#29292de6","ref":"color-grey-800-90"}),
400
+ "color-surface-glass-higher-hovered": Object.freeze({"value":"#333338e6"}),
401
+ "color-surface-glass-high": Object.freeze({"value":"#242426e6","ref":"color-grey-850-90"}),
402
+ "color-surface-glass-high-hovered": Object.freeze({"value":"#2e2e31e6"}),
399
403
  "color-surface-accent-blue": Object.freeze({"value":"#6b6effff","ref":"color-blue-300"}),
400
404
  "color-surface-accent-blue-hovered": Object.freeze({"value":"#8184ffff"}),
401
405
  "color-surface-accent-cobalt": Object.freeze({"value":"#5cadefff","ref":"color-cobalt-300"}),
package/dist/beta/esm/global.mjs CHANGED
@@ -183,25 +183,26 @@ export default Object.freeze({
183
183
  "color-grey-400": Object.freeze({"value":"#cfcfd1ff"}),
184
184
  "color-grey-500": Object.freeze({"value":"#a7a7aaff"}),
185
185
  "color-grey-600": Object.freeze({"value":"#79797eff"}),
186
- "color-grey-700": Object.freeze({"value":"#454549ff"}),
187
- "color-grey-750": Object.freeze({"value":"#37373cff"}),
188
- "color-grey-800": Object.freeze({"value":"#303035ff"}),
189
- "color-grey-850": Object.freeze({"value":"#2a2a2dff"}),
190
- "color-grey-900": Object.freeze({"value":"#242428ff"}),
186
+ "color-grey-700": Object.freeze({"value":"#3b3b3fff"}),
187
+ "color-grey-750": Object.freeze({"value":"#313135ff"}),
188
+ "color-grey-800": Object.freeze({"value":"#29292dff"}),
189
+ "color-grey-850": Object.freeze({"value":"#242426ff"}),
190
+ "color-grey-900": Object.freeze({"value":"#1d1d20ff"}),
191
191
  "color-grey-950": Object.freeze({"value":"#1a1a1cff"}),
192
192
  "color-grey-50-80": Object.freeze({"value":"#fbfbfbcc"}),
193
193
  "color-grey-100-80": Object.freeze({"value":"#f7f7f8cc"}),
194
194
  "color-grey-100-90": Object.freeze({"value":"#f7f7f8e6"}),
195
195
  "color-grey-200-80": Object.freeze({"value":"#efeff0cc"}),
196
196
  "color-grey-200-90": Object.freeze({"value":"#efeff0e6"}),
197
- "color-grey-700-80": Object.freeze({"value":"#454549cc"}),
198
- "color-grey-700-90": Object.freeze({"value":"#454549e6"}),
199
- "color-grey-800-80": Object.freeze({"value":"#303035cc"}),
200
- "color-grey-800-90": Object.freeze({"value":"#303035e6"}),
201
- "color-grey-850-80": Object.freeze({"value":"#2a2a2dcc"}),
202
- "color-grey-850-90": Object.freeze({"value":"#2a2a2de6"}),
197
+ "color-grey-700-80": Object.freeze({"value":"#3b3b3fcc"}),
198
+ "color-grey-700-90": Object.freeze({"value":"#3b3b3fe6"}),
199
+ "color-grey-750-90": Object.freeze({"value":"#313135e6"}),
200
+ "color-grey-800-80": Object.freeze({"value":"#29292dcc"}),
201
+ "color-grey-800-90": Object.freeze({"value":"#29292de6"}),
202
+ "color-grey-850-80": Object.freeze({"value":"#242426cc"}),
203
+ "color-grey-850-90": Object.freeze({"value":"#242426e6"}),
203
204
  "color-grey-900-0": Object.freeze({"value":"#24242800"}),
204
- "color-grey-900-90": Object.freeze({"value":"#242428e6"}),
205
+ "color-grey-900-90": Object.freeze({"value":"#1d1d2000"}),
205
206
  "color-white-0": Object.freeze({"value":"#fff0"}),
206
207
  "color-white-3": Object.freeze({"value":"#ffffff08"}),
207
208
  "color-white-5": Object.freeze({"value":"#ffffff0d"}),
package/dist/beta/esm/lightTheme.mjs CHANGED
@@ -158,6 +158,8 @@ export default Object.freeze({
158
158
  "color-text-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
159
159
  "color-text-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
160
160
  "color-text-absolute-black-hovered": Object.freeze({"value":"#1c1c1cff"}),
161
+ "color-text-inverse": Object.freeze({"value":"#fffc","ref":"color-white-80"}),
162
+ "color-text-inverse-hovered": Object.freeze({"value":"#edededcc"}),
161
163
  "color-icon-action": Object.freeze({"value":"#6157eaff","ref":"color-blue-400"}),
162
164
  "color-icon-action-hovered": Object.freeze({"value":"#5146e4ff"}),
163
165
  "color-icon-success": Object.freeze({"value":"#20ab55ff","ref":"color-green-400"}),
@@ -200,6 +202,8 @@ export default Object.freeze({
200
202
  "color-icon-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
201
203
  "color-icon-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
202
204
  "color-icon-absolute-black-hovered": Object.freeze({"value":"#1c1c1cff"}),
205
+ "color-icon-inverse-heavier": Object.freeze({"value":"#fffc","ref":"color-white-80"}),
206
+ "color-icon-inverse-heavier-hovered": Object.freeze({"value":"#edededcc"}),
203
207
  "color-fill-neutral-heaviest": Object.freeze({"value":"#000000d9","ref":"color-black-85"}),
204
208
  "color-fill-neutral-heaviest-hovered": Object.freeze({"value":"#1c1c1cd9"}),
205
209
  "color-fill-neutral-heavier": Object.freeze({"value":"#0006","ref":"color-black-40"}),
package/dist/beta/scss/dark-theme.scss CHANGED
@@ -6,9 +6,9 @@ $border-bottom: 0 -1px 0 0 #ffffff1f !default;
6
6
  $border-right: -1px 0 0 0 #ffffff1f !default;
7
7
  $border-left: 1px 0 0 0 #ffffff1f !default;
8
8
  $border-top: 0 1px 0 0 #ffffff1f !default;
9
- $border-white-high: 0 0 0 1px #2a2a2dff !default;
10
- $border-white-higher: 0 0 0 1px #303035ff !default;
11
- $border-white-highest: 0 0 0 1px #37373cff !default;
9
+ $border-white-high: 0 0 0 1px #242426ff !default;
10
+ $border-white-higher: 0 0 0 1px #29292dff !default;
11
+ $border-white-highest: 0 0 0 1px #313135ff !default;
12
12
  $elevation-1: 0 1px 2px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
13
13
  $elevation-2: 0 2px 6px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
14
14
  $elevation-3: 0 4px 12px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
@@ -117,6 +117,7 @@ $color-text-accent-purple: #a970ffff !default;
117
117
  $color-text-accent-pink: #ec6fd3ff !default;
118
118
  $color-text-absolute-white: #ffff !default;
119
119
  $color-text-absolute-black: #000f !default;
120
+ $color-text-inverse: #000000d9 !default;
120
121
  $color-icon-action: #6b6effff !default;
121
122
  $color-icon-success: #4bc16cff !default;
122
123
  $color-icon-highlight: #5cadefff !default;
@@ -138,6 +139,7 @@ $color-icon-accent-purple: #a970ffff !default;
138
139
  $color-icon-accent-pink: #ec6fd3ff !default;
139
140
  $color-icon-absolute-white: #ffff !default;
140
141
  $color-icon-absolute-black: #000f !default;
142
+ $color-icon-inverse-heavier: #000000d9 !default;
141
143
  $color-fill-neutral-heaviest: #ffffffe6 !default;
142
144
  $color-fill-neutral-heavier: #fff6 !default;
143
145
  $color-fill-neutral-heavy: #fff3 !default;
@@ -165,9 +167,9 @@ $color-fill-critical: #f26060ff !default;
165
167
  $color-fill-critical-light: #f260604d !default;
166
168
  $color-fill-critical-lighter: #f260602e !default;
167
169
  $color-fill-critical-transparent: #f2606000 !default;
168
- $color-fill-grey: #2a2a2dff !default;
169
- $color-fill-grey-heavy: #303035ff !default;
170
- $color-fill-grey-heavier: #37373cff !default;
170
+ $color-fill-grey: #242426ff !default;
171
+ $color-fill-grey-heavy: #29292dff !default;
172
+ $color-fill-grey-heavier: #313135ff !default;
171
173
  $color-fill-accent-blue: #6b6eff2e !default;
172
174
  $color-fill-accent-blue-heavy: #6b6eff4d !default;
173
175
  $color-fill-accent-blue-heavier: #6b6effff !default;
@@ -221,21 +223,21 @@ $color-fill-absolute-black-transparent: #0000 !default;
221
223
  $color-border-neutral: #ffffff1f !default;
222
224
  $color-border-neutral-heavy: #fff3 !default;
223
225
  $color-border-neutral-heavier: #fff6 !default;
224
- $color-border-detach: #242428ff !default;
225
- $color-border-detach-highest: #454549ff !default;
226
- $color-border-detach-higher: #303035ff !default;
227
- $color-border-detach-high: #2a2a2dff !default;
226
+ $color-border-detach: #1d1d20ff !default;
227
+ $color-border-detach-highest: #313135ff !default;
228
+ $color-border-detach-higher: #29292dff !default;
229
+ $color-border-detach-high: #242426ff !default;
228
230
  $color-border-detach-low: #1a1a1cff !default;
229
231
  $color-border-absolute-white: #ffff !default;
230
- $color-surface: #242428ff !default;
231
- $color-surface-highest: #37373cff !default;
232
- $color-surface-higher: #303035ff !default;
233
- $color-surface-high: #2a2a2dff !default;
232
+ $color-surface: #1d1d20ff !default;
233
+ $color-surface-highest: #313135ff !default;
234
+ $color-surface-higher: #29292dff !default;
235
+ $color-surface-high: #242426ff !default;
234
236
  $color-surface-low: #1a1a1cff !default;
235
- $color-surface-glass: #303035e6 !default;
236
- $color-surface-glass-highest: #454549e6 !default;
237
- $color-surface-glass-higher: #303035e6 !default;
238
- $color-surface-glass-high: #2a2a2de6 !default;
237
+ $color-surface-glass: #29292de6 !default;
238
+ $color-surface-glass-highest: #313135e6 !default;
239
+ $color-surface-glass-higher: #29292de6 !default;
240
+ $color-surface-glass-high: #242426e6 !default;
239
241
  $color-surface-accent-blue: #6b6effff !default;
240
242
  $color-surface-accent-cobalt: #5cadefff !default;
241
243
  $color-surface-accent-green: #4bc16cff !default;
@@ -455,7 +457,8 @@ $tokens: (
455
457
  'absolute': (
456
458
  'white': $color-text-absolute-white,
457
459
  'black': $color-text-absolute-black
458
- )
460
+ ),
461
+ 'inverse': $color-text-inverse
459
462
  ),
460
463
  'icon': (
461
464
  'action': $color-icon-action,
@@ -484,6 +487,9 @@ $tokens: (
484
487
  'absolute': (
485
488
  'white': $color-icon-absolute-white,
486
489
  'black': $color-icon-absolute-black
490
+ ),
491
+ 'inverse': (
492
+ 'heavier': $color-icon-inverse-heavier
487
493
  )
488
494
  ),
489
495
  'fill': (