@channel.io/bezier-tokens 0.3.3-beta.5 → 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 +39 -33
  2. package/dist/beta/cjs/global.js +13 -12
  3. package/dist/beta/cjs/lightTheme.js +6 -0
  4. package/dist/beta/css/styles.css +42 -29
  5. package/dist/beta/esm/darkTheme.mjs +39 -33
  6. package/dist/beta/esm/global.mjs +13 -12
  7. package/dist/beta/esm/lightTheme.mjs +6 -0
  8. package/dist/beta/scss/dark-theme.scss +27 -19
  9. package/dist/beta/scss/global.scss +14 -12
  10. package/dist/beta/scss/light-theme.scss +9 -1
  11. package/dist/types/beta/cjs/darkTheme.d.ts +56 -35
  12. package/dist/types/beta/cjs/global.d.ts +15 -12
  13. package/dist/types/beta/cjs/index.d.ts +92 -47
  14. package/dist/types/beta/cjs/lightTheme.d.ts +21 -0
  15. package/dist/types/beta/esm/darkTheme.d.mts +56 -35
  16. package/dist/types/beta/esm/global.d.mts +15 -12
  17. package/dist/types/beta/esm/index.d.mts +92 -47
  18. package/dist/types/beta/esm/index.d.mts.map +1 -1
  19. package/dist/types/beta/esm/lightTheme.d.mts +21 -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"}),
@@ -144,6 +144,8 @@ module.exports = Object.freeze({
144
144
  "color-text-accent-orange-hovered": Object.freeze({"value":"#f8a45cff"}),
145
145
  "color-text-accent-yellow": Object.freeze({"value":"#f0be27ff","ref":"color-yellow-300"}),
146
146
  "color-text-accent-yellow-hovered": Object.freeze({"value":"#f7c736ff"}),
147
+ "color-text-accent-olive": Object.freeze({"value":"#b7c427ff","ref":"color-olive-300"}),
148
+ "color-text-accent-olive-hovered": Object.freeze({"value":"#ccdb25ff"}),
147
149
  "color-text-accent-teal": Object.freeze({"value":"#40d3c5ff","ref":"color-teal-300"}),
148
150
  "color-text-accent-teal-hovered": Object.freeze({"value":"#4cdccfff"}),
149
151
  "color-text-accent-navy": Object.freeze({"value":"#6f7bc8ff","ref":"color-navy-300"}),
@@ -156,6 +158,8 @@ module.exports = Object.freeze({
156
158
  "color-text-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
157
159
  "color-text-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
158
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"}),
159
163
  "color-icon-action": Object.freeze({"value":"#6b6effff","ref":"color-blue-300"}),
160
164
  "color-icon-action-hovered": Object.freeze({"value":"#8184ffff"}),
161
165
  "color-icon-success": Object.freeze({"value":"#4bc16cff","ref":"color-green-300"}),
@@ -198,6 +202,8 @@ module.exports = Object.freeze({
198
202
  "color-icon-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
199
203
  "color-icon-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
200
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"}),
201
207
  "color-fill-neutral-heaviest": Object.freeze({"value":"#ffffffe6","ref":"color-white-90"}),
202
208
  "color-fill-neutral-heaviest-hovered": Object.freeze({"value":"#ededede6"}),
203
209
  "color-fill-neutral-heavier": Object.freeze({"value":"#fff6","ref":"color-white-40"}),
@@ -252,12 +258,12 @@ module.exports = Object.freeze({
252
258
  "color-fill-critical-lighter-hovered": Object.freeze({"value":"#f7717145"}),
253
259
  "color-fill-critical-transparent": Object.freeze({"value":"#f2606000","ref":"color-red-300-0"}),
254
260
  "color-fill-critical-transparent-hovered": Object.freeze({"value":"#f260601a"}),
255
- "color-fill-grey": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
256
- "color-fill-grey-hovered": Object.freeze({"value":"#343438ff"}),
257
- "color-fill-grey-heavy": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
258
- "color-fill-grey-heavy-hovered": Object.freeze({"value":"#3a3a40ff"}),
259
- "color-fill-grey-heavier": Object.freeze({"value":"#37373cff","ref":"color-grey-750"}),
260
- "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"}),
261
267
  "color-fill-accent-blue": Object.freeze({"value":"#6b6eff2e","ref":"color-blue-300-18"}),
262
268
  "color-fill-accent-blue-hovered": Object.freeze({"value":"#8184ff45"}),
263
269
  "color-fill-accent-blue-heavy": Object.freeze({"value":"#6b6eff4d","ref":"color-blue-300-30"}),
@@ -364,36 +370,36 @@ module.exports = Object.freeze({
364
370
  "color-border-neutral-heavy-hovered": Object.freeze({"value":"#ededed4d"}),
365
371
  "color-border-neutral-heavier": Object.freeze({"value":"#fff6","ref":"color-white-40"}),
366
372
  "color-border-neutral-heavier-hovered": Object.freeze({"value":"#ededed66"}),
367
- "color-border-detach": Object.freeze({"value":"#242428ff","ref":"color-grey-900"}),
368
- "color-border-detach-hovered": Object.freeze({"value":"#2e2e33ff"}),
369
- "color-border-detach-highest": Object.freeze({"value":"#454549ff","ref":"color-grey-700"}),
370
- "color-border-detach-highest-hovered": Object.freeze({"value":"#4f4f54ff"}),
371
- "color-border-detach-higher": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
372
- "color-border-detach-higher-hovered": Object.freeze({"value":"#3a3a40ff"}),
373
- "color-border-detach-high": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
374
- "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"}),
375
381
  "color-border-detach-low": Object.freeze({"value":"#1a1a1cff","ref":"color-grey-950"}),
376
382
  "color-border-detach-low-hovered": Object.freeze({"value":"#242427ff"}),
377
383
  "color-border-absolute-white": Object.freeze({"value":"#ffff","ref":"color-white-100"}),
378
384
  "color-border-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
379
- "color-surface": Object.freeze({"value":"#242428ff","ref":"color-grey-900"}),
380
- "color-surface-hovered": Object.freeze({"value":"#2e2e33ff"}),
381
- "color-surface-highest": Object.freeze({"value":"#37373cff","ref":"color-grey-750"}),
382
- "color-surface-highest-hovered": Object.freeze({"value":"#414147ff"}),
383
- "color-surface-higher": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
384
- "color-surface-higher-hovered": Object.freeze({"value":"#3a3a40ff"}),
385
- "color-surface-high": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
386
- "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"}),
387
393
  "color-surface-low": Object.freeze({"value":"#1a1a1cff","ref":"color-grey-950"}),
388
394
  "color-surface-low-hovered": Object.freeze({"value":"#242427ff"}),
389
- "color-surface-glass": Object.freeze({"value":"#303035e6","ref":"color-grey-800-90"}),
390
- "color-surface-glass-hovered": Object.freeze({"value":"#3a3a40e6"}),
391
- "color-surface-glass-highest": Object.freeze({"value":"#454549e6","ref":"color-grey-700-90"}),
392
- "color-surface-glass-highest-hovered": Object.freeze({"value":"#4f4f54e6"}),
393
- "color-surface-glass-higher": Object.freeze({"value":"#303035e6","ref":"color-grey-800-90"}),
394
- "color-surface-glass-higher-hovered": Object.freeze({"value":"#3a3a40e6"}),
395
- "color-surface-glass-high": Object.freeze({"value":"#2a2a2de6","ref":"color-grey-850-90"}),
396
- "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"}),
397
403
  "color-surface-accent-blue": Object.freeze({"value":"#6b6effff","ref":"color-blue-300"}),
398
404
  "color-surface-accent-blue-hovered": Object.freeze({"value":"#8184ffff"}),
399
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
@@ -144,6 +144,8 @@ module.exports = Object.freeze({
144
144
  "color-text-accent-orange-hovered": Object.freeze({"value":"#df751fff"}),
145
145
  "color-text-accent-yellow": Object.freeze({"value":"#edae0dff","ref":"color-yellow-400"}),
146
146
  "color-text-accent-yellow-hovered": Object.freeze({"value":"#d9a010ff"}),
147
+ "color-text-accent-olive": Object.freeze({"value":"#b7c427ff","ref":"color-olive-300"}),
148
+ "color-text-accent-olive-hovered": Object.freeze({"value":"#a7b328ff"}),
147
149
  "color-text-accent-teal": Object.freeze({"value":"#09b2acff","ref":"color-teal-400"}),
148
150
  "color-text-accent-teal-hovered": Object.freeze({"value":"#08a5a0ff"}),
149
151
  "color-text-accent-navy": Object.freeze({"value":"#424fabff","ref":"color-navy-400"}),
@@ -156,6 +158,8 @@ module.exports = Object.freeze({
156
158
  "color-text-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
157
159
  "color-text-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
158
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"}),
159
163
  "color-icon-action": Object.freeze({"value":"#6157eaff","ref":"color-blue-400"}),
160
164
  "color-icon-action-hovered": Object.freeze({"value":"#5146e4ff"}),
161
165
  "color-icon-success": Object.freeze({"value":"#20ab55ff","ref":"color-green-400"}),
@@ -198,6 +202,8 @@ module.exports = Object.freeze({
198
202
  "color-icon-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
199
203
  "color-icon-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
200
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"}),
201
207
  "color-fill-neutral-heaviest": Object.freeze({"value":"#000000d9","ref":"color-black-85"}),
202
208
  "color-fill-neutral-heaviest-hovered": Object.freeze({"value":"#1c1c1cd9"}),
203
209
  "color-fill-neutral-heavier": Object.freeze({"value":"#0006","ref":"color-black-40"}),
package/dist/beta/css/styles.css CHANGED
@@ -125,6 +125,8 @@
125
125
  --color-text-accent-orange-hovered: #f8a45cff;
126
126
  --color-text-accent-yellow: var(--color-yellow-300);
127
127
  --color-text-accent-yellow-hovered: #f7c736ff;
128
+ --color-text-accent-olive: var(--color-olive-300);
129
+ --color-text-accent-olive-hovered: #ccdb25ff;
128
130
  --color-text-accent-teal: var(--color-teal-300);
129
131
  --color-text-accent-teal-hovered: #4cdccfff;
130
132
  --color-text-accent-navy: var(--color-navy-300);
@@ -137,6 +139,8 @@
137
139
  --color-text-absolute-white-hovered: #edededff;
138
140
  --color-text-absolute-black: var(--color-black-100);
139
141
  --color-text-absolute-black-hovered: #0a0a0aff;
142
+ --color-text-inverse: var(--color-black-85);
143
+ --color-text-inverse-hovered: #0a0a0ad9;
140
144
  --color-icon-action: var(--color-blue-300);
141
145
  --color-icon-action-hovered: #8184ffff;
142
146
  --color-icon-success: var(--color-green-300);
@@ -179,6 +183,8 @@
179
183
  --color-icon-absolute-white-hovered: #edededff;
180
184
  --color-icon-absolute-black: var(--color-black-100);
181
185
  --color-icon-absolute-black-hovered: #0a0a0aff;
186
+ --color-icon-inverse-heavier: var(--color-black-85);
187
+ --color-icon-inverse-heavier-hovered: #0a0a0ad9;
182
188
  --color-fill-neutral-heaviest: var(--color-white-90);
183
189
  --color-fill-neutral-heaviest-hovered: #ededede6;
184
190
  --color-fill-neutral-heavier: var(--color-white-40);
@@ -234,11 +240,11 @@
234
240
  --color-fill-critical-transparent: var(--color-red-300-0);
235
241
  --color-fill-critical-transparent-hovered: #f260601a;
236
242
  --color-fill-grey: var(--color-grey-850);
237
- --color-fill-grey-hovered: #343438ff;
243
+ --color-fill-grey-hovered: #2e2e31ff;
238
244
  --color-fill-grey-heavy: var(--color-grey-800);
239
- --color-fill-grey-heavy-hovered: #3a3a40ff;
245
+ --color-fill-grey-heavy-hovered: #333338ff;
240
246
  --color-fill-grey-heavier: var(--color-grey-750);
241
- --color-fill-grey-heavier-hovered: #414147ff;
247
+ --color-fill-grey-heavier-hovered: #3b3b40ff;
242
248
  --color-fill-accent-blue: var(--color-blue-300-18);
243
249
  --color-fill-accent-blue-hovered: #8184ff45;
244
250
  --color-fill-accent-blue-heavy: var(--color-blue-300-30);
@@ -346,35 +352,35 @@
346
352
  --color-border-neutral-heavier: var(--color-white-40);
347
353
  --color-border-neutral-heavier-hovered: #ededed66;
348
354
  --color-border-detach: var(--color-grey-900);
349
- --color-border-detach-hovered: #2e2e33ff;
350
- --color-border-detach-highest: var(--color-grey-700);
351
- --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;
352
358
  --color-border-detach-higher: var(--color-grey-800);
353
- --color-border-detach-higher-hovered: #3a3a40ff;
359
+ --color-border-detach-higher-hovered: #333338ff;
354
360
  --color-border-detach-high: var(--color-grey-850);
355
- --color-border-detach-high-hovered: #343438ff;
361
+ --color-border-detach-high-hovered: #2e2e31ff;
356
362
  --color-border-detach-low: var(--color-grey-950);
357
363
  --color-border-detach-low-hovered: #242427ff;
358
364
  --color-border-absolute-white: var(--color-white-100);
359
365
  --color-border-absolute-white-hovered: #edededff;
360
366
  --color-surface: var(--color-grey-900);
361
- --color-surface-hovered: #2e2e33ff;
367
+ --color-surface-hovered: #27272bff;
362
368
  --color-surface-highest: var(--color-grey-750);
363
- --color-surface-highest-hovered: #414147ff;
369
+ --color-surface-highest-hovered: #3b3b40ff;
364
370
  --color-surface-higher: var(--color-grey-800);
365
- --color-surface-higher-hovered: #3a3a40ff;
371
+ --color-surface-higher-hovered: #333338ff;
366
372
  --color-surface-high: var(--color-grey-850);
367
- --color-surface-high-hovered: #343438ff;
373
+ --color-surface-high-hovered: #2e2e31ff;
368
374
  --color-surface-low: var(--color-grey-950);
369
375
  --color-surface-low-hovered: #242427ff;
370
376
  --color-surface-glass: var(--color-grey-800-90);
371
- --color-surface-glass-hovered: #3a3a40e6;
372
- --color-surface-glass-highest: var(--color-grey-700-90);
373
- --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;
374
380
  --color-surface-glass-higher: var(--color-grey-800-90);
375
- --color-surface-glass-higher-hovered: #3a3a40e6;
381
+ --color-surface-glass-higher-hovered: #333338e6;
376
382
  --color-surface-glass-high: var(--color-grey-850-90);
377
- --color-surface-glass-high-hovered: #343438e6;
383
+ --color-surface-glass-high-hovered: #2e2e31e6;
378
384
  --color-surface-accent-blue: var(--color-blue-300);
379
385
  --color-surface-accent-blue-hovered: #8184ffff;
380
386
  --color-surface-accent-cobalt: var(--color-cobalt-300);
@@ -617,25 +623,26 @@
617
623
  --color-grey-400: #cfcfd1ff;
618
624
  --color-grey-500: #a7a7aaff;
619
625
  --color-grey-600: #79797eff;
620
- --color-grey-700: #454549ff;
621
- --color-grey-750: #37373cff;
622
- --color-grey-800: #303035ff;
623
- --color-grey-850: #2a2a2dff;
624
- --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;
625
631
  --color-grey-950: #1a1a1cff;
626
632
  --color-grey-50-80: #fbfbfbcc;
627
633
  --color-grey-100-80: #f7f7f8cc;
628
634
  --color-grey-100-90: #f7f7f8e6;
629
635
  --color-grey-200-80: #efeff0cc;
630
636
  --color-grey-200-90: #efeff0e6;
631
- --color-grey-700-80: #454549cc;
632
- --color-grey-700-90: #454549e6;
633
- --color-grey-800-80: #303035cc;
634
- --color-grey-800-90: #303035e6;
635
- --color-grey-850-80: #2a2a2dcc;
636
- --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;
637
644
  --color-grey-900-0: #24242800;
638
- --color-grey-900-90: #242428e6;
645
+ --color-grey-900-90: #1d1d2000;
639
646
  --color-white-0: #fff0;
640
647
  --color-white-3: #ffffff08;
641
648
  --color-white-5: #ffffff0d;
@@ -874,6 +881,8 @@
874
881
  --color-text-accent-orange-hovered: #df751fff;
875
882
  --color-text-accent-yellow: var(--color-yellow-400);
876
883
  --color-text-accent-yellow-hovered: #d9a010ff;
884
+ --color-text-accent-olive: var(--color-olive-300);
885
+ --color-text-accent-olive-hovered: #a7b328ff;
877
886
  --color-text-accent-teal: var(--color-teal-400);
878
887
  --color-text-accent-teal-hovered: #08a5a0ff;
879
888
  --color-text-accent-navy: var(--color-navy-400);
@@ -886,6 +895,8 @@
886
895
  --color-text-absolute-white-hovered: #edededff;
887
896
  --color-text-absolute-black: var(--color-black-100);
888
897
  --color-text-absolute-black-hovered: #1c1c1cff;
898
+ --color-text-inverse: var(--color-white-80);
899
+ --color-text-inverse-hovered: #edededcc;
889
900
  --color-icon-action: var(--color-blue-400);
890
901
  --color-icon-action-hovered: #5146e4ff;
891
902
  --color-icon-success: var(--color-green-400);
@@ -928,6 +939,8 @@
928
939
  --color-icon-absolute-white-hovered: #edededff;
929
940
  --color-icon-absolute-black: var(--color-black-100);
930
941
  --color-icon-absolute-black-hovered: #1c1c1cff;
942
+ --color-icon-inverse-heavier: var(--color-white-80);
943
+ --color-icon-inverse-heavier-hovered: #edededcc;
931
944
  --color-fill-neutral-heaviest: var(--color-black-85);
932
945
  --color-fill-neutral-heaviest-hovered: #1c1c1cd9;
933
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"}),
@@ -144,6 +144,8 @@ export default Object.freeze({
144
144
  "color-text-accent-orange-hovered": Object.freeze({"value":"#f8a45cff"}),
145
145
  "color-text-accent-yellow": Object.freeze({"value":"#f0be27ff","ref":"color-yellow-300"}),
146
146
  "color-text-accent-yellow-hovered": Object.freeze({"value":"#f7c736ff"}),
147
+ "color-text-accent-olive": Object.freeze({"value":"#b7c427ff","ref":"color-olive-300"}),
148
+ "color-text-accent-olive-hovered": Object.freeze({"value":"#ccdb25ff"}),
147
149
  "color-text-accent-teal": Object.freeze({"value":"#40d3c5ff","ref":"color-teal-300"}),
148
150
  "color-text-accent-teal-hovered": Object.freeze({"value":"#4cdccfff"}),
149
151
  "color-text-accent-navy": Object.freeze({"value":"#6f7bc8ff","ref":"color-navy-300"}),
@@ -156,6 +158,8 @@ export default Object.freeze({
156
158
  "color-text-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
157
159
  "color-text-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
158
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"}),
159
163
  "color-icon-action": Object.freeze({"value":"#6b6effff","ref":"color-blue-300"}),
160
164
  "color-icon-action-hovered": Object.freeze({"value":"#8184ffff"}),
161
165
  "color-icon-success": Object.freeze({"value":"#4bc16cff","ref":"color-green-300"}),
@@ -198,6 +202,8 @@ export default Object.freeze({
198
202
  "color-icon-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
199
203
  "color-icon-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
200
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"}),
201
207
  "color-fill-neutral-heaviest": Object.freeze({"value":"#ffffffe6","ref":"color-white-90"}),
202
208
  "color-fill-neutral-heaviest-hovered": Object.freeze({"value":"#ededede6"}),
203
209
  "color-fill-neutral-heavier": Object.freeze({"value":"#fff6","ref":"color-white-40"}),
@@ -252,12 +258,12 @@ export default Object.freeze({
252
258
  "color-fill-critical-lighter-hovered": Object.freeze({"value":"#f7717145"}),
253
259
  "color-fill-critical-transparent": Object.freeze({"value":"#f2606000","ref":"color-red-300-0"}),
254
260
  "color-fill-critical-transparent-hovered": Object.freeze({"value":"#f260601a"}),
255
- "color-fill-grey": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
256
- "color-fill-grey-hovered": Object.freeze({"value":"#343438ff"}),
257
- "color-fill-grey-heavy": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
258
- "color-fill-grey-heavy-hovered": Object.freeze({"value":"#3a3a40ff"}),
259
- "color-fill-grey-heavier": Object.freeze({"value":"#37373cff","ref":"color-grey-750"}),
260
- "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"}),
261
267
  "color-fill-accent-blue": Object.freeze({"value":"#6b6eff2e","ref":"color-blue-300-18"}),
262
268
  "color-fill-accent-blue-hovered": Object.freeze({"value":"#8184ff45"}),
263
269
  "color-fill-accent-blue-heavy": Object.freeze({"value":"#6b6eff4d","ref":"color-blue-300-30"}),
@@ -364,36 +370,36 @@ export default Object.freeze({
364
370
  "color-border-neutral-heavy-hovered": Object.freeze({"value":"#ededed4d"}),
365
371
  "color-border-neutral-heavier": Object.freeze({"value":"#fff6","ref":"color-white-40"}),
366
372
  "color-border-neutral-heavier-hovered": Object.freeze({"value":"#ededed66"}),
367
- "color-border-detach": Object.freeze({"value":"#242428ff","ref":"color-grey-900"}),
368
- "color-border-detach-hovered": Object.freeze({"value":"#2e2e33ff"}),
369
- "color-border-detach-highest": Object.freeze({"value":"#454549ff","ref":"color-grey-700"}),
370
- "color-border-detach-highest-hovered": Object.freeze({"value":"#4f4f54ff"}),
371
- "color-border-detach-higher": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
372
- "color-border-detach-higher-hovered": Object.freeze({"value":"#3a3a40ff"}),
373
- "color-border-detach-high": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
374
- "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"}),
375
381
  "color-border-detach-low": Object.freeze({"value":"#1a1a1cff","ref":"color-grey-950"}),
376
382
  "color-border-detach-low-hovered": Object.freeze({"value":"#242427ff"}),
377
383
  "color-border-absolute-white": Object.freeze({"value":"#ffff","ref":"color-white-100"}),
378
384
  "color-border-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
379
- "color-surface": Object.freeze({"value":"#242428ff","ref":"color-grey-900"}),
380
- "color-surface-hovered": Object.freeze({"value":"#2e2e33ff"}),
381
- "color-surface-highest": Object.freeze({"value":"#37373cff","ref":"color-grey-750"}),
382
- "color-surface-highest-hovered": Object.freeze({"value":"#414147ff"}),
383
- "color-surface-higher": Object.freeze({"value":"#303035ff","ref":"color-grey-800"}),
384
- "color-surface-higher-hovered": Object.freeze({"value":"#3a3a40ff"}),
385
- "color-surface-high": Object.freeze({"value":"#2a2a2dff","ref":"color-grey-850"}),
386
- "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"}),
387
393
  "color-surface-low": Object.freeze({"value":"#1a1a1cff","ref":"color-grey-950"}),
388
394
  "color-surface-low-hovered": Object.freeze({"value":"#242427ff"}),
389
- "color-surface-glass": Object.freeze({"value":"#303035e6","ref":"color-grey-800-90"}),
390
- "color-surface-glass-hovered": Object.freeze({"value":"#3a3a40e6"}),
391
- "color-surface-glass-highest": Object.freeze({"value":"#454549e6","ref":"color-grey-700-90"}),
392
- "color-surface-glass-highest-hovered": Object.freeze({"value":"#4f4f54e6"}),
393
- "color-surface-glass-higher": Object.freeze({"value":"#303035e6","ref":"color-grey-800-90"}),
394
- "color-surface-glass-higher-hovered": Object.freeze({"value":"#3a3a40e6"}),
395
- "color-surface-glass-high": Object.freeze({"value":"#2a2a2de6","ref":"color-grey-850-90"}),
396
- "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"}),
397
403
  "color-surface-accent-blue": Object.freeze({"value":"#6b6effff","ref":"color-blue-300"}),
398
404
  "color-surface-accent-blue-hovered": Object.freeze({"value":"#8184ffff"}),
399
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
@@ -144,6 +144,8 @@ export default Object.freeze({
144
144
  "color-text-accent-orange-hovered": Object.freeze({"value":"#df751fff"}),
145
145
  "color-text-accent-yellow": Object.freeze({"value":"#edae0dff","ref":"color-yellow-400"}),
146
146
  "color-text-accent-yellow-hovered": Object.freeze({"value":"#d9a010ff"}),
147
+ "color-text-accent-olive": Object.freeze({"value":"#b7c427ff","ref":"color-olive-300"}),
148
+ "color-text-accent-olive-hovered": Object.freeze({"value":"#a7b328ff"}),
147
149
  "color-text-accent-teal": Object.freeze({"value":"#09b2acff","ref":"color-teal-400"}),
148
150
  "color-text-accent-teal-hovered": Object.freeze({"value":"#08a5a0ff"}),
149
151
  "color-text-accent-navy": Object.freeze({"value":"#424fabff","ref":"color-navy-400"}),
@@ -156,6 +158,8 @@ export default Object.freeze({
156
158
  "color-text-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
157
159
  "color-text-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
158
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"}),
159
163
  "color-icon-action": Object.freeze({"value":"#6157eaff","ref":"color-blue-400"}),
160
164
  "color-icon-action-hovered": Object.freeze({"value":"#5146e4ff"}),
161
165
  "color-icon-success": Object.freeze({"value":"#20ab55ff","ref":"color-green-400"}),
@@ -198,6 +202,8 @@ export default Object.freeze({
198
202
  "color-icon-absolute-white-hovered": Object.freeze({"value":"#edededff"}),
199
203
  "color-icon-absolute-black": Object.freeze({"value":"#000f","ref":"color-black-100"}),
200
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"}),
201
207
  "color-fill-neutral-heaviest": Object.freeze({"value":"#000000d9","ref":"color-black-85"}),
202
208
  "color-fill-neutral-heaviest-hovered": Object.freeze({"value":"#1c1c1cd9"}),
203
209
  "color-fill-neutral-heavier": Object.freeze({"value":"#0006","ref":"color-black-40"}),