@sb1/ffe-core 33.2.0 → 100.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/css/colors-semantic-tailwind-4.css +6 -0
  2. package/css/colors-semantic.css +136 -100
  3. package/css/ffe.css +138 -100
  4. package/less/colors-semantic-chevron.less +1 -1
  5. package/less/colors-semantic.less +136 -100
  6. package/lib/semanticColors.js +7 -1
  7. package/lib/semanticColorsTailwind.js +7 -1
  8. package/package.json +3 -3
package/less/colors-semantic.less CHANGED
@@ -8,8 +8,8 @@
8
8
  .regard-color-scheme-preference,
9
9
  .regard-color-scheme-preference .ffe-default-mode {
10
10
  --ffe-color-background-default: #020a0a;
11
- --ffe-color-background-subtle: #1f1f1f;
12
- --ffe-color-surface-primary-default: #292929;
11
+ --ffe-color-background-subtle: #121212;
12
+ --ffe-color-surface-primary-default: #262626;
13
13
  --ffe-color-surface-primary-default-hover: #333333;
14
14
  --ffe-color-surface-primary-default-pressed: #3d3d3d;
15
15
  --ffe-color-surface-secondary-default: #0c2232;
@@ -18,9 +18,9 @@
18
18
  --ffe-color-surface-tertiary-default: #1d192f;
19
19
  --ffe-color-surface-tertiary-default-hover: #27223a;
20
20
  --ffe-color-surface-tertiary-default-pressed: #312c44;
21
- --ffe-color-surface-neutral-default: #3d3d3d;
22
- --ffe-color-surface-neutral-default-hover: #474747;
23
- --ffe-color-surface-neutral-default-pressed: #525252;
21
+ --ffe-color-surface-neutral-default: #333333;
22
+ --ffe-color-surface-neutral-default-hover: #3d3d3d;
23
+ --ffe-color-surface-neutral-default-pressed: #474747;
24
24
  --ffe-color-surface-feedback-info: #163853;
25
25
  --ffe-color-surface-feedback-success: #0a4330;
26
26
  --ffe-color-surface-feedback-warning: #491c00;
@@ -58,15 +58,15 @@
58
58
  --ffe-color-fill-neutral-extra-subtle-hover: #ffffff0d;
59
59
  --ffe-color-fill-neutral-extra-subtle-pressed: #ffffff13;
60
60
  --ffe-color-fill-feedback-info: #7eb5d2;
61
- --ffe-color-fill-feedback-info-subtle: #234f71;
61
+ --ffe-color-fill-feedback-info-subtle: #163853;
62
62
  --ffe-color-fill-feedback-success: #6abe97;
63
- --ffe-color-fill-feedback-success-subtle: #09583b;
63
+ --ffe-color-fill-feedback-success-subtle: #0a4330;
64
64
  --ffe-color-fill-feedback-warning: #ea910b;
65
- --ffe-color-fill-feedback-warning-subtle: #682c00;
65
+ --ffe-color-fill-feedback-warning-subtle: #491c00;
66
66
  --ffe-color-fill-feedback-critical: #ff5e5c;
67
- --ffe-color-fill-feedback-critical-subtle: #7c1214;
67
+ --ffe-color-fill-feedback-critical-subtle: #640e10;
68
68
  --ffe-color-fill-feedback-tip: #c1c1dc;
69
- --ffe-color-fill-feedback-tip-subtle: #45415a;
69
+ --ffe-color-fill-feedback-tip-subtle: #312c44;
70
70
  --ffe-color-foreground-default: #ffffff;
71
71
  --ffe-color-foreground-subtle: #c2c2c2;
72
72
  --ffe-color-foreground-emphasis: #d7e7f4;
@@ -75,6 +75,7 @@
75
75
  --ffe-color-foreground-interactive-link-hover: #b6d1ec;
76
76
  --ffe-color-foreground-interactive-link-pressed: #9ec2e5;
77
77
  --ffe-color-foreground-interactive-link-active: #f7fafd;
78
+ --ffe-color-foreground-interactive-disabled: #8f8f8f;
78
79
  --ffe-color-foreground-feedback-info: #c3dfea;
79
80
  --ffe-color-foreground-feedback-success: #b2e6cd;
80
81
  --ffe-color-foreground-feedback-warning: #ffc675;
@@ -83,27 +84,32 @@
83
84
  --ffe-color-component-form-input-foreground-default: #ffffff;
84
85
  --ffe-color-component-form-input-foreground-subtle: #c2c2c2;
85
86
  --ffe-color-component-form-input-foreground-placeholder: #adadad;
86
- --ffe-color-component-form-input-foreground-disabled: #8f8f8f;
87
+ --ffe-color-component-form-input-foreground-disabled: #adadad;
87
88
  --ffe-color-component-form-input-foreground-read-only: #c2c2c2;
88
89
  --ffe-color-component-form-input-foreground-error: #ffaea8;
89
90
  --ffe-color-component-form-input-border-active: #d7e7f4;
90
- --ffe-color-component-form-input-fill-default: #292929;
91
+ --ffe-color-component-form-input-fill-default: #262626;
91
92
  --ffe-color-component-form-input-fill-default-hover: #333333;
92
93
  --ffe-color-component-form-input-fill-default-pressed: #3d3d3d;
93
94
  --ffe-color-component-form-input-fill-disabled: #5c5c5c;
94
- --ffe-color-component-form-input-fill-read-only: #474747;
95
+ --ffe-color-component-form-input-fill-read-only: #262626;
95
96
  --ffe-color-component-form-input-fill-error: #640e10;
96
97
  --ffe-color-component-form-toggleswitch-handle-default: #ffffff;
98
+ --ffe-color-component-form-toggleswitch-handle-disabled: #a4a4a4;
97
99
  --ffe-color-component-form-toggleswitch-fill-default: #7a7a7a;
98
100
  --ffe-color-component-form-toggleswitch-fill-default-hover: #8f8f8f;
99
101
  --ffe-color-component-form-toggleswitch-fill-default-pressed: #adadad;
100
102
  --ffe-color-component-form-toggleswitch-fill-selected: #48a781;
101
103
  --ffe-color-component-form-toggleswitch-fill-selected-hover: #6abe97;
102
104
  --ffe-color-component-form-toggleswitch-fill-selected-pressed: #8fd1b1;
105
+ --ffe-color-component-form-toggleswitch-fill-selected-disabled: #00754e;
106
+ --ffe-color-component-form-toggleswitch-fill-selected-read-only: #0a4330;
103
107
  --ffe-color-component-form-toggleswitch-fill-critical: #e44244;
104
- --ffe-color-component-button-action-border-default: #48a781;
105
- --ffe-color-component-button-action-border-hover: #6abe97;
106
- --ffe-color-component-button-action-border-pressed: #8fd1b1;
108
+ --ffe-color-component-form-toggleswitch-fill-disabled: #5c5c5c;
109
+ --ffe-color-component-form-toggleswitch-fill-read-only: #262626;
110
+ --ffe-color-component-button-action-border-default: #00754e;
111
+ --ffe-color-component-button-action-border-hover: #2a7e5b;
112
+ --ffe-color-component-button-action-border-pressed: #409674;
107
113
  --ffe-color-component-button-action-fill-default: #00754e;
108
114
  --ffe-color-component-button-action-fill-hover: #2a7e5b;
109
115
  --ffe-color-component-button-action-fill-pressed: #409674;
@@ -134,9 +140,9 @@
134
140
  --ffe-color-component-logo-number1: #ffffff;
135
141
  --ffe-color-component-logo-circle-dark-red: #af0000;
136
142
  --ffe-color-component-logo-circle-light-red: #e60000;
137
- --ffe-color-border-primary-default: #ffffff26;
138
- --ffe-color-border-primary-default-hover: #ffffff33;
139
- --ffe-color-border-primary-default-pressed: #ffffff40;
143
+ --ffe-color-border-primary-default: #ffffff33;
144
+ --ffe-color-border-primary-default-hover: #ffffff40;
145
+ --ffe-color-border-primary-default-pressed: #ffffff4d;
140
146
  --ffe-color-border-primary-subtle: #ffffff13;
141
147
  --ffe-color-border-primary-subtle-hover: #ffffff1a;
142
148
  --ffe-color-border-primary-subtle-pressed: #ffffff26;
@@ -156,8 +162,8 @@
156
162
  .ffe-dark,
157
163
  .ffe-dark .ffe-default-mode {
158
164
  --ffe-color-background-default: #020a0a;
159
- --ffe-color-background-subtle: #1f1f1f;
160
- --ffe-color-surface-primary-default: #292929;
165
+ --ffe-color-background-subtle: #121212;
166
+ --ffe-color-surface-primary-default: #262626;
161
167
  --ffe-color-surface-primary-default-hover: #333333;
162
168
  --ffe-color-surface-primary-default-pressed: #3d3d3d;
163
169
  --ffe-color-surface-secondary-default: #0c2232;
@@ -166,9 +172,9 @@
166
172
  --ffe-color-surface-tertiary-default: #1d192f;
167
173
  --ffe-color-surface-tertiary-default-hover: #27223a;
168
174
  --ffe-color-surface-tertiary-default-pressed: #312c44;
169
- --ffe-color-surface-neutral-default: #3d3d3d;
170
- --ffe-color-surface-neutral-default-hover: #474747;
171
- --ffe-color-surface-neutral-default-pressed: #525252;
175
+ --ffe-color-surface-neutral-default: #333333;
176
+ --ffe-color-surface-neutral-default-hover: #3d3d3d;
177
+ --ffe-color-surface-neutral-default-pressed: #474747;
172
178
  --ffe-color-surface-feedback-info: #163853;
173
179
  --ffe-color-surface-feedback-success: #0a4330;
174
180
  --ffe-color-surface-feedback-warning: #491c00;
@@ -206,15 +212,15 @@
206
212
  --ffe-color-fill-neutral-extra-subtle-hover: #ffffff0d;
207
213
  --ffe-color-fill-neutral-extra-subtle-pressed: #ffffff13;
208
214
  --ffe-color-fill-feedback-info: #7eb5d2;
209
- --ffe-color-fill-feedback-info-subtle: #234f71;
215
+ --ffe-color-fill-feedback-info-subtle: #163853;
210
216
  --ffe-color-fill-feedback-success: #6abe97;
211
- --ffe-color-fill-feedback-success-subtle: #09583b;
217
+ --ffe-color-fill-feedback-success-subtle: #0a4330;
212
218
  --ffe-color-fill-feedback-warning: #ea910b;
213
- --ffe-color-fill-feedback-warning-subtle: #682c00;
219
+ --ffe-color-fill-feedback-warning-subtle: #491c00;
214
220
  --ffe-color-fill-feedback-critical: #ff5e5c;
215
- --ffe-color-fill-feedback-critical-subtle: #7c1214;
221
+ --ffe-color-fill-feedback-critical-subtle: #640e10;
216
222
  --ffe-color-fill-feedback-tip: #c1c1dc;
217
- --ffe-color-fill-feedback-tip-subtle: #45415a;
223
+ --ffe-color-fill-feedback-tip-subtle: #312c44;
218
224
  --ffe-color-foreground-default: #ffffff;
219
225
  --ffe-color-foreground-subtle: #c2c2c2;
220
226
  --ffe-color-foreground-emphasis: #d7e7f4;
@@ -223,6 +229,7 @@
223
229
  --ffe-color-foreground-interactive-link-hover: #b6d1ec;
224
230
  --ffe-color-foreground-interactive-link-pressed: #9ec2e5;
225
231
  --ffe-color-foreground-interactive-link-active: #f7fafd;
232
+ --ffe-color-foreground-interactive-disabled: #8f8f8f;
226
233
  --ffe-color-foreground-feedback-info: #c3dfea;
227
234
  --ffe-color-foreground-feedback-success: #b2e6cd;
228
235
  --ffe-color-foreground-feedback-warning: #ffc675;
@@ -231,27 +238,32 @@
231
238
  --ffe-color-component-form-input-foreground-default: #ffffff;
232
239
  --ffe-color-component-form-input-foreground-subtle: #c2c2c2;
233
240
  --ffe-color-component-form-input-foreground-placeholder: #adadad;
234
- --ffe-color-component-form-input-foreground-disabled: #8f8f8f;
241
+ --ffe-color-component-form-input-foreground-disabled: #adadad;
235
242
  --ffe-color-component-form-input-foreground-read-only: #c2c2c2;
236
243
  --ffe-color-component-form-input-foreground-error: #ffaea8;
237
244
  --ffe-color-component-form-input-border-active: #d7e7f4;
238
- --ffe-color-component-form-input-fill-default: #292929;
245
+ --ffe-color-component-form-input-fill-default: #262626;
239
246
  --ffe-color-component-form-input-fill-default-hover: #333333;
240
247
  --ffe-color-component-form-input-fill-default-pressed: #3d3d3d;
241
248
  --ffe-color-component-form-input-fill-disabled: #5c5c5c;
242
- --ffe-color-component-form-input-fill-read-only: #474747;
249
+ --ffe-color-component-form-input-fill-read-only: #262626;
243
250
  --ffe-color-component-form-input-fill-error: #640e10;
244
251
  --ffe-color-component-form-toggleswitch-handle-default: #ffffff;
252
+ --ffe-color-component-form-toggleswitch-handle-disabled: #a4a4a4;
245
253
  --ffe-color-component-form-toggleswitch-fill-default: #7a7a7a;
246
254
  --ffe-color-component-form-toggleswitch-fill-default-hover: #8f8f8f;
247
255
  --ffe-color-component-form-toggleswitch-fill-default-pressed: #adadad;
248
256
  --ffe-color-component-form-toggleswitch-fill-selected: #48a781;
249
257
  --ffe-color-component-form-toggleswitch-fill-selected-hover: #6abe97;
250
258
  --ffe-color-component-form-toggleswitch-fill-selected-pressed: #8fd1b1;
259
+ --ffe-color-component-form-toggleswitch-fill-selected-disabled: #00754e;
260
+ --ffe-color-component-form-toggleswitch-fill-selected-read-only: #0a4330;
251
261
  --ffe-color-component-form-toggleswitch-fill-critical: #e44244;
252
- --ffe-color-component-button-action-border-default: #48a781;
253
- --ffe-color-component-button-action-border-hover: #6abe97;
254
- --ffe-color-component-button-action-border-pressed: #8fd1b1;
262
+ --ffe-color-component-form-toggleswitch-fill-disabled: #5c5c5c;
263
+ --ffe-color-component-form-toggleswitch-fill-read-only: #262626;
264
+ --ffe-color-component-button-action-border-default: #00754e;
265
+ --ffe-color-component-button-action-border-hover: #2a7e5b;
266
+ --ffe-color-component-button-action-border-pressed: #409674;
255
267
  --ffe-color-component-button-action-fill-default: #00754e;
256
268
  --ffe-color-component-button-action-fill-hover: #2a7e5b;
257
269
  --ffe-color-component-button-action-fill-pressed: #409674;
@@ -282,9 +294,9 @@
282
294
  --ffe-color-component-logo-number1: #ffffff;
283
295
  --ffe-color-component-logo-circle-dark-red: #af0000;
284
296
  --ffe-color-component-logo-circle-light-red: #e60000;
285
- --ffe-color-border-primary-default: #ffffff26;
286
- --ffe-color-border-primary-default-hover: #ffffff33;
287
- --ffe-color-border-primary-default-pressed: #ffffff40;
297
+ --ffe-color-border-primary-default: #ffffff33;
298
+ --ffe-color-border-primary-default-hover: #ffffff40;
299
+ --ffe-color-border-primary-default-pressed: #ffffff4d;
288
300
  --ffe-color-border-primary-subtle: #ffffff13;
289
301
  --ffe-color-border-primary-subtle-hover: #ffffff1a;
290
302
  --ffe-color-border-primary-subtle-pressed: #ffffff26;
@@ -301,9 +313,9 @@
301
313
  /* dark mode accent context */
302
314
  @media (prefers-color-scheme: dark) {
303
315
  .regard-color-scheme-preference .ffe-accent-mode {
304
- --ffe-color-background-default: #141414;
305
- --ffe-color-background-subtle: #1f1f1f;
306
- --ffe-color-surface-primary-default: #292929;
316
+ --ffe-color-background-default: #1a1a1a;
317
+ --ffe-color-background-subtle: #121212;
318
+ --ffe-color-surface-primary-default: #262626;
307
319
  --ffe-color-surface-primary-default-hover: #333333;
308
320
  --ffe-color-surface-primary-default-pressed: #3d3d3d;
309
321
  --ffe-color-surface-secondary-default: #0c2232;
@@ -312,9 +324,9 @@
312
324
  --ffe-color-surface-tertiary-default: #1d192f;
313
325
  --ffe-color-surface-tertiary-default-hover: #27223a;
314
326
  --ffe-color-surface-tertiary-default-pressed: #312c44;
315
- --ffe-color-surface-neutral-default: #3d3d3d;
316
- --ffe-color-surface-neutral-default-hover: #474747;
317
- --ffe-color-surface-neutral-default-pressed: #525252;
327
+ --ffe-color-surface-neutral-default: #333333;
328
+ --ffe-color-surface-neutral-default-hover: #3d3d3d;
329
+ --ffe-color-surface-neutral-default-pressed: #474747;
318
330
  --ffe-color-surface-feedback-info: #163853;
319
331
  --ffe-color-surface-feedback-success: #0a4330;
320
332
  --ffe-color-surface-feedback-warning: #491c00;
@@ -369,6 +381,7 @@
369
381
  --ffe-color-foreground-interactive-link-hover: #b6d1ec;
370
382
  --ffe-color-foreground-interactive-link-pressed: #9ec2e5;
371
383
  --ffe-color-foreground-interactive-link-active: #f7fafd;
384
+ --ffe-color-foreground-interactive-disabled: #8f8f8f;
372
385
  --ffe-color-foreground-feedback-info: #c3dfea;
373
386
  --ffe-color-foreground-feedback-success: #b2e6cd;
374
387
  --ffe-color-foreground-feedback-warning: #ffc675;
@@ -377,27 +390,32 @@
377
390
  --ffe-color-component-form-input-foreground-default: #ffffff;
378
391
  --ffe-color-component-form-input-foreground-subtle: #c2c2c2;
379
392
  --ffe-color-component-form-input-foreground-placeholder: #adadad;
380
- --ffe-color-component-form-input-foreground-disabled: #8f8f8f;
393
+ --ffe-color-component-form-input-foreground-disabled: #adadad;
381
394
  --ffe-color-component-form-input-foreground-read-only: #c2c2c2;
382
395
  --ffe-color-component-form-input-foreground-error: #ffaea8;
383
396
  --ffe-color-component-form-input-border-active: #d7e7f4;
384
- --ffe-color-component-form-input-fill-default: #292929;
397
+ --ffe-color-component-form-input-fill-default: #262626;
385
398
  --ffe-color-component-form-input-fill-default-hover: #333333;
386
399
  --ffe-color-component-form-input-fill-default-pressed: #3d3d3d;
387
400
  --ffe-color-component-form-input-fill-disabled: #5c5c5c;
388
- --ffe-color-component-form-input-fill-read-only: #474747;
401
+ --ffe-color-component-form-input-fill-read-only: #262626;
389
402
  --ffe-color-component-form-input-fill-error: #640e10;
390
403
  --ffe-color-component-form-toggleswitch-handle-default: #ffffff;
404
+ --ffe-color-component-form-toggleswitch-handle-disabled: #a4a4a4;
391
405
  --ffe-color-component-form-toggleswitch-fill-default: #7a7a7a;
392
406
  --ffe-color-component-form-toggleswitch-fill-default-hover: #8f8f8f;
393
407
  --ffe-color-component-form-toggleswitch-fill-default-pressed: #adadad;
394
408
  --ffe-color-component-form-toggleswitch-fill-selected: #48a781;
395
409
  --ffe-color-component-form-toggleswitch-fill-selected-hover: #6abe97;
396
410
  --ffe-color-component-form-toggleswitch-fill-selected-pressed: #8fd1b1;
411
+ --ffe-color-component-form-toggleswitch-fill-selected-disabled: #00754e;
412
+ --ffe-color-component-form-toggleswitch-fill-selected-read-only: #0a4330;
397
413
  --ffe-color-component-form-toggleswitch-fill-critical: #e44244;
398
- --ffe-color-component-button-action-border-default: #48a781;
399
- --ffe-color-component-button-action-border-hover: #6abe97;
400
- --ffe-color-component-button-action-border-pressed: #8fd1b1;
414
+ --ffe-color-component-form-toggleswitch-fill-disabled: #5c5c5c;
415
+ --ffe-color-component-form-toggleswitch-fill-read-only: #262626;
416
+ --ffe-color-component-button-action-border-default: #00754e;
417
+ --ffe-color-component-button-action-border-hover: #2a7e5b;
418
+ --ffe-color-component-button-action-border-pressed: #409674;
401
419
  --ffe-color-component-button-action-fill-default: #00754e;
402
420
  --ffe-color-component-button-action-fill-hover: #2a7e5b;
403
421
  --ffe-color-component-button-action-fill-pressed: #409674;
@@ -428,9 +446,9 @@
428
446
  --ffe-color-component-logo-number1: #ffffff;
429
447
  --ffe-color-component-logo-circle-dark-red: #af0000;
430
448
  --ffe-color-component-logo-circle-light-red: #e60000;
431
- --ffe-color-border-primary-default: #ffffff26;
432
- --ffe-color-border-primary-default-hover: #ffffff33;
433
- --ffe-color-border-primary-default-pressed: #ffffff40;
449
+ --ffe-color-border-primary-default: #ffffff33;
450
+ --ffe-color-border-primary-default-hover: #ffffff40;
451
+ --ffe-color-border-primary-default-pressed: #ffffff4d;
434
452
  --ffe-color-border-primary-subtle: #ffffff13;
435
453
  --ffe-color-border-primary-subtle-hover: #ffffff1a;
436
454
  --ffe-color-border-primary-subtle-pressed: #ffffff26;
@@ -446,10 +464,10 @@
446
464
  }
447
465
 
448
466
  /* dark mode accent når en overstyrer os/nettleser light/dark preferanser*/
449
- .ffe-dark .ffe-accent-mode {
450
- --ffe-color-background-default: #141414;
451
- --ffe-color-background-subtle: #1f1f1f;
452
- --ffe-color-surface-primary-default: #292929;
467
+ .ffe-dark .ffe-accent-mode, .ffe-dark.ffe-accent-mode {
468
+ --ffe-color-background-default: #1a1a1a;
469
+ --ffe-color-background-subtle: #121212;
470
+ --ffe-color-surface-primary-default: #262626;
453
471
  --ffe-color-surface-primary-default-hover: #333333;
454
472
  --ffe-color-surface-primary-default-pressed: #3d3d3d;
455
473
  --ffe-color-surface-secondary-default: #0c2232;
@@ -458,9 +476,9 @@
458
476
  --ffe-color-surface-tertiary-default: #1d192f;
459
477
  --ffe-color-surface-tertiary-default-hover: #27223a;
460
478
  --ffe-color-surface-tertiary-default-pressed: #312c44;
461
- --ffe-color-surface-neutral-default: #3d3d3d;
462
- --ffe-color-surface-neutral-default-hover: #474747;
463
- --ffe-color-surface-neutral-default-pressed: #525252;
479
+ --ffe-color-surface-neutral-default: #333333;
480
+ --ffe-color-surface-neutral-default-hover: #3d3d3d;
481
+ --ffe-color-surface-neutral-default-pressed: #474747;
464
482
  --ffe-color-surface-feedback-info: #163853;
465
483
  --ffe-color-surface-feedback-success: #0a4330;
466
484
  --ffe-color-surface-feedback-warning: #491c00;
@@ -515,6 +533,7 @@
515
533
  --ffe-color-foreground-interactive-link-hover: #b6d1ec;
516
534
  --ffe-color-foreground-interactive-link-pressed: #9ec2e5;
517
535
  --ffe-color-foreground-interactive-link-active: #f7fafd;
536
+ --ffe-color-foreground-interactive-disabled: #8f8f8f;
518
537
  --ffe-color-foreground-feedback-info: #c3dfea;
519
538
  --ffe-color-foreground-feedback-success: #b2e6cd;
520
539
  --ffe-color-foreground-feedback-warning: #ffc675;
@@ -523,27 +542,32 @@
523
542
  --ffe-color-component-form-input-foreground-default: #ffffff;
524
543
  --ffe-color-component-form-input-foreground-subtle: #c2c2c2;
525
544
  --ffe-color-component-form-input-foreground-placeholder: #adadad;
526
- --ffe-color-component-form-input-foreground-disabled: #8f8f8f;
545
+ --ffe-color-component-form-input-foreground-disabled: #adadad;
527
546
  --ffe-color-component-form-input-foreground-read-only: #c2c2c2;
528
547
  --ffe-color-component-form-input-foreground-error: #ffaea8;
529
548
  --ffe-color-component-form-input-border-active: #d7e7f4;
530
- --ffe-color-component-form-input-fill-default: #292929;
549
+ --ffe-color-component-form-input-fill-default: #262626;
531
550
  --ffe-color-component-form-input-fill-default-hover: #333333;
532
551
  --ffe-color-component-form-input-fill-default-pressed: #3d3d3d;
533
552
  --ffe-color-component-form-input-fill-disabled: #5c5c5c;
534
- --ffe-color-component-form-input-fill-read-only: #474747;
553
+ --ffe-color-component-form-input-fill-read-only: #262626;
535
554
  --ffe-color-component-form-input-fill-error: #640e10;
536
555
  --ffe-color-component-form-toggleswitch-handle-default: #ffffff;
556
+ --ffe-color-component-form-toggleswitch-handle-disabled: #a4a4a4;
537
557
  --ffe-color-component-form-toggleswitch-fill-default: #7a7a7a;
538
558
  --ffe-color-component-form-toggleswitch-fill-default-hover: #8f8f8f;
539
559
  --ffe-color-component-form-toggleswitch-fill-default-pressed: #adadad;
540
560
  --ffe-color-component-form-toggleswitch-fill-selected: #48a781;
541
561
  --ffe-color-component-form-toggleswitch-fill-selected-hover: #6abe97;
542
562
  --ffe-color-component-form-toggleswitch-fill-selected-pressed: #8fd1b1;
563
+ --ffe-color-component-form-toggleswitch-fill-selected-disabled: #00754e;
564
+ --ffe-color-component-form-toggleswitch-fill-selected-read-only: #0a4330;
543
565
  --ffe-color-component-form-toggleswitch-fill-critical: #e44244;
544
- --ffe-color-component-button-action-border-default: #48a781;
545
- --ffe-color-component-button-action-border-hover: #6abe97;
546
- --ffe-color-component-button-action-border-pressed: #8fd1b1;
566
+ --ffe-color-component-form-toggleswitch-fill-disabled: #5c5c5c;
567
+ --ffe-color-component-form-toggleswitch-fill-read-only: #262626;
568
+ --ffe-color-component-button-action-border-default: #00754e;
569
+ --ffe-color-component-button-action-border-hover: #2a7e5b;
570
+ --ffe-color-component-button-action-border-pressed: #409674;
547
571
  --ffe-color-component-button-action-fill-default: #00754e;
548
572
  --ffe-color-component-button-action-fill-hover: #2a7e5b;
549
573
  --ffe-color-component-button-action-fill-pressed: #409674;
@@ -574,9 +598,9 @@
574
598
  --ffe-color-component-logo-number1: #ffffff;
575
599
  --ffe-color-component-logo-circle-dark-red: #af0000;
576
600
  --ffe-color-component-logo-circle-light-red: #e60000;
577
- --ffe-color-border-primary-default: #ffffff26;
578
- --ffe-color-border-primary-default-hover: #ffffff33;
579
- --ffe-color-border-primary-default-pressed: #ffffff40;
601
+ --ffe-color-border-primary-default: #ffffff33;
602
+ --ffe-color-border-primary-default-hover: #ffffff40;
603
+ --ffe-color-border-primary-default-pressed: #ffffff4d;
580
604
  --ffe-color-border-primary-subtle: #ffffff13;
581
605
  --ffe-color-border-primary-subtle-hover: #ffffff1a;
582
606
  --ffe-color-border-primary-subtle-pressed: #ffffff26;
@@ -595,7 +619,7 @@
595
619
  :host,
596
620
  .ffe-default-mode,
597
621
  .ffe-light,
598
- .ffe-light .ffe-default-mode {
622
+ .ffe-light .ffe-default-mode, .ffe-light.ffe-default-mode {
599
623
  --ffe-color-background-default: #ffffff;
600
624
  --ffe-color-background-subtle: #fdf8f5;
601
625
  --ffe-color-surface-primary-default: #ffffff;
@@ -647,16 +671,16 @@
647
671
  --ffe-color-fill-neutral-extra-subtle-hover: #020a0a0d;
648
672
  --ffe-color-fill-neutral-extra-subtle-pressed: #020a0a13;
649
673
  --ffe-color-fill-feedback-info: #457aa1;
650
- --ffe-color-fill-feedback-info-subtle: #cbe2eb;
674
+ --ffe-color-fill-feedback-info-subtle: #e5f0f5;
651
675
  --ffe-color-fill-feedback-success: #2a7e5b;
652
- --ffe-color-fill-feedback-success-subtle: #bbedd5;
676
+ --ffe-color-fill-feedback-success-subtle: #dff6eb;
653
677
  --ffe-color-fill-feedback-warning: #a95704;
654
- --ffe-color-fill-feedback-warning-subtle: #ffd394;
678
+ --ffe-color-fill-feedback-warning-subtle: #fdeed3;
655
679
  --ffe-color-fill-feedback-critical: #c62a2f;
656
- --ffe-color-fill-feedback-critical-subtle: #ffbeb8;
680
+ --ffe-color-fill-feedback-critical-subtle: #ffe3e0;
657
681
  --ffe-color-fill-feedback-tip: #5a5671;
658
- --ffe-color-fill-feedback-tip-subtle: #dcdcef;
659
- --ffe-color-foreground-default: #1f1f1f;
682
+ --ffe-color-fill-feedback-tip-subtle: #eaeaf6;
683
+ --ffe-color-foreground-default: #1a1a1a;
660
684
  --ffe-color-foreground-subtle: #525252;
661
685
  --ffe-color-foreground-emphasis: #08235e;
662
686
  --ffe-color-foreground-inverse: #ffffff;
@@ -664,15 +688,16 @@
664
688
  --ffe-color-foreground-interactive-link-hover: #073f83;
665
689
  --ffe-color-foreground-interactive-link-pressed: #082868;
666
690
  --ffe-color-foreground-interactive-link-active: #005aa4;
691
+ --ffe-color-foreground-interactive-disabled: #a4a4a4;
667
692
  --ffe-color-foreground-feedback-info: #234f71;
668
693
  --ffe-color-foreground-feedback-success: #0a4d37;
669
694
  --ffe-color-foreground-feedback-warning: #682c00;
670
695
  --ffe-color-foreground-feedback-critical: #7c1214;
671
696
  --ffe-color-foreground-feedback-tip: #45415a;
672
- --ffe-color-component-form-input-foreground-default: #1f1f1f;
697
+ --ffe-color-component-form-input-foreground-default: #1a1a1a;
673
698
  --ffe-color-component-form-input-foreground-subtle: #525252;
674
699
  --ffe-color-component-form-input-foreground-placeholder: #8f8f8f;
675
- --ffe-color-component-form-input-foreground-disabled: #a4a4a4;
700
+ --ffe-color-component-form-input-foreground-disabled: #8f8f8f;
676
701
  --ffe-color-component-form-input-foreground-read-only: #525252;
677
702
  --ffe-color-component-form-input-foreground-error: #7c1214;
678
703
  --ffe-color-component-form-input-border-active: #08235e;
@@ -680,19 +705,24 @@
680
705
  --ffe-color-component-form-input-fill-default-hover: #e7f1f9;
681
706
  --ffe-color-component-form-input-fill-default-pressed: #d7e7f4;
682
707
  --ffe-color-component-form-input-fill-disabled: #d6d6d6;
683
- --ffe-color-component-form-input-fill-read-only: #e5e5e5;
708
+ --ffe-color-component-form-input-fill-read-only: #f0f0f0;
684
709
  --ffe-color-component-form-input-fill-error: #ffe3e0;
685
710
  --ffe-color-component-form-toggleswitch-handle-default: #ffffff;
711
+ --ffe-color-component-form-toggleswitch-handle-disabled: #a4a4a4;
686
712
  --ffe-color-component-form-toggleswitch-fill-default: #c2c2c2;
687
713
  --ffe-color-component-form-toggleswitch-fill-default-hover: #a4a4a4;
688
714
  --ffe-color-component-form-toggleswitch-fill-default-pressed: #8f8f8f;
689
715
  --ffe-color-component-form-toggleswitch-fill-selected: #48a781;
690
716
  --ffe-color-component-form-toggleswitch-fill-selected-hover: #2a7e5b;
691
717
  --ffe-color-component-form-toggleswitch-fill-selected-pressed: #0d6346;
718
+ --ffe-color-component-form-toggleswitch-fill-selected-disabled: #9edbbe;
719
+ --ffe-color-component-form-toggleswitch-fill-selected-read-only: #dff6eb;
692
720
  --ffe-color-component-form-toggleswitch-fill-critical: #e44244;
693
- --ffe-color-component-button-action-border-default: #48a781;
694
- --ffe-color-component-button-action-border-hover: #2a7e5b;
695
- --ffe-color-component-button-action-border-pressed: #0d6346;
721
+ --ffe-color-component-form-toggleswitch-fill-disabled: #d6d6d6;
722
+ --ffe-color-component-form-toggleswitch-fill-read-only: #f0f0f0;
723
+ --ffe-color-component-button-action-border-default: #2a7e5b;
724
+ --ffe-color-component-button-action-border-hover: #0d6346;
725
+ --ffe-color-component-button-action-border-pressed: #0a4d37;
696
726
  --ffe-color-component-button-action-fill-default: #2a7e5b;
697
727
  --ffe-color-component-button-action-fill-hover: #0d6346;
698
728
  --ffe-color-component-button-action-fill-pressed: #0a4d37;
@@ -723,9 +753,9 @@
723
753
  --ffe-color-component-logo-number1: #ffffff;
724
754
  --ffe-color-component-logo-circle-dark-red: #af0000;
725
755
  --ffe-color-component-logo-circle-light-red: #e60000;
726
- --ffe-color-border-primary-default: #020a0a26;
727
- --ffe-color-border-primary-default-hover: #020a0a33;
728
- --ffe-color-border-primary-default-pressed: #020a0a40;
756
+ --ffe-color-border-primary-default: #020a0a33;
757
+ --ffe-color-border-primary-default-hover: #020a0a40;
758
+ --ffe-color-border-primary-default-pressed: #020a0a4d;
729
759
  --ffe-color-border-primary-subtle: #020a0a13;
730
760
  --ffe-color-border-primary-subtle-hover: #020a0a1a;
731
761
  --ffe-color-border-primary-subtle-pressed: #020a0a26;
@@ -743,7 +773,7 @@
743
773
  .ffe-light .ffe-accent-mode,
744
774
  .ffe-accent-mode {
745
775
  --ffe-color-background-default: #084f91;
746
- --ffe-color-background-subtle: #073f83;
776
+ --ffe-color-background-subtle: #04347c;
747
777
  --ffe-color-surface-primary-default: #005aa4;
748
778
  --ffe-color-surface-primary-default-hover: #1566b2;
749
779
  --ffe-color-surface-primary-default-pressed: #2975c2;
@@ -753,9 +783,9 @@
753
783
  --ffe-color-surface-tertiary-default: #45415a;
754
784
  --ffe-color-surface-tertiary-default-hover: #3c374e;
755
785
  --ffe-color-surface-tertiary-default-pressed: #312c44;
756
- --ffe-color-surface-neutral-default: #04347c;
757
- --ffe-color-surface-neutral-default-hover: #073f83;
758
- --ffe-color-surface-neutral-default-pressed: #084f91;
786
+ --ffe-color-surface-neutral-default: #073f83;
787
+ --ffe-color-surface-neutral-default-hover: #084f91;
788
+ --ffe-color-surface-neutral-default-pressed: #005aa4;
759
789
  --ffe-color-surface-feedback-info: #234f71;
760
790
  --ffe-color-surface-feedback-success: #09583b;
761
791
  --ffe-color-surface-feedback-warning: #682c00;
@@ -767,9 +797,9 @@
767
797
  --ffe-color-fill-primary-selected-default: #ffffff;
768
798
  --ffe-color-fill-primary-selected-hover: #d7e7f4;
769
799
  --ffe-color-fill-primary-selected-pressed: #c3d9ef;
770
- --ffe-color-fill-primary-subtle: #ffffff1a;
771
- --ffe-color-fill-primary-subtle-hover: #ffffff26;
772
- --ffe-color-fill-primary-subtle-pressed: #ffffff33;
800
+ --ffe-color-fill-primary-subtle: #ffffff26;
801
+ --ffe-color-fill-primary-subtle-hover: #ffffff33;
802
+ --ffe-color-fill-primary-subtle-pressed: #ffffff40;
773
803
  --ffe-color-fill-primary-invisible: #ffffff00;
774
804
  --ffe-color-fill-secondary-default: #457aa1;
775
805
  --ffe-color-fill-secondary-default-hover: #a6cee2;
@@ -810,15 +840,16 @@
810
840
  --ffe-color-foreground-interactive-link-hover: #e7f1f9;
811
841
  --ffe-color-foreground-interactive-link-pressed: #d7e7f4;
812
842
  --ffe-color-foreground-interactive-link-active: #ffffff;
843
+ --ffe-color-foreground-interactive-disabled: #ffffff66;
813
844
  --ffe-color-foreground-feedback-info: #dceaef;
814
845
  --ffe-color-foreground-feedback-success: #cbf0df;
815
846
  --ffe-color-foreground-feedback-warning: #ffe0b2;
816
847
  --ffe-color-foreground-feedback-critical: #ffd5d1;
817
848
  --ffe-color-foreground-feedback-tip: #e6e6f4;
818
- --ffe-color-component-form-input-foreground-default: #1f1f1f;
849
+ --ffe-color-component-form-input-foreground-default: #1a1a1a;
819
850
  --ffe-color-component-form-input-foreground-subtle: #525252;
820
851
  --ffe-color-component-form-input-foreground-placeholder: #8f8f8f;
821
- --ffe-color-component-form-input-foreground-disabled: #a4a4a4;
852
+ --ffe-color-component-form-input-foreground-disabled: #8f8f8f;
822
853
  --ffe-color-component-form-input-foreground-read-only: #525252;
823
854
  --ffe-color-component-form-input-foreground-error: #7c1214;
824
855
  --ffe-color-component-form-input-border-active: #7dabd9;
@@ -826,19 +857,24 @@
826
857
  --ffe-color-component-form-input-fill-default-hover: #e7f1f9;
827
858
  --ffe-color-component-form-input-fill-default-pressed: #d7e7f4;
828
859
  --ffe-color-component-form-input-fill-disabled: #d6d6d6;
829
- --ffe-color-component-form-input-fill-read-only: #e5e5e5;
860
+ --ffe-color-component-form-input-fill-read-only: #f0f0f0;
830
861
  --ffe-color-component-form-input-fill-error: #ffe3e0;
831
862
  --ffe-color-component-form-toggleswitch-handle-default: #ffffff;
863
+ --ffe-color-component-form-toggleswitch-handle-disabled: #a4a4a4;
832
864
  --ffe-color-component-form-toggleswitch-fill-default: #c2c2c2;
833
865
  --ffe-color-component-form-toggleswitch-fill-default-hover: #a4a4a4;
834
866
  --ffe-color-component-form-toggleswitch-fill-default-pressed: #8f8f8f;
835
867
  --ffe-color-component-form-toggleswitch-fill-selected: #48a781;
836
868
  --ffe-color-component-form-toggleswitch-fill-selected-hover: #2a7e5b;
837
869
  --ffe-color-component-form-toggleswitch-fill-selected-pressed: #0d6346;
870
+ --ffe-color-component-form-toggleswitch-fill-selected-disabled: #9edbbe;
871
+ --ffe-color-component-form-toggleswitch-fill-selected-read-only: #dff6eb;
838
872
  --ffe-color-component-form-toggleswitch-fill-critical: #ff5e5c;
839
- --ffe-color-component-button-action-border-default: #48a781;
873
+ --ffe-color-component-form-toggleswitch-fill-disabled: #d6d6d6;
874
+ --ffe-color-component-form-toggleswitch-fill-read-only: #f0f0f0;
875
+ --ffe-color-component-button-action-border-default: #00754e;
840
876
  --ffe-color-component-button-action-border-hover: #2a7e5b;
841
- --ffe-color-component-button-action-border-pressed: #0d6346;
877
+ --ffe-color-component-button-action-border-pressed: #409674;
842
878
  --ffe-color-component-button-action-fill-default: #00754e;
843
879
  --ffe-color-component-button-action-fill-hover: #2a7e5b;
844
880
  --ffe-color-component-button-action-fill-pressed: #409674;
@@ -869,9 +905,9 @@
869
905
  --ffe-color-component-logo-number1: #ffffff;
870
906
  --ffe-color-component-logo-circle-dark-red: #af0000;
871
907
  --ffe-color-component-logo-circle-light-red: #e60000;
872
- --ffe-color-border-primary-default: #ffffff26;
873
- --ffe-color-border-primary-default-hover: #ffffff33;
874
- --ffe-color-border-primary-default-pressed: #ffffff40;
908
+ --ffe-color-border-primary-default: #ffffff33;
909
+ --ffe-color-border-primary-default-hover: #ffffff40;
910
+ --ffe-color-border-primary-default-pressed: #ffffff4d;
875
911
  --ffe-color-border-primary-subtle: #ffffff13;
876
912
  --ffe-color-border-primary-subtle-hover: #ffffff1a;
877
913
  --ffe-color-border-primary-subtle-pressed: #ffffff26;
package/lib/semanticColors.js CHANGED
@@ -2,7 +2,7 @@
2
2
  "use strict";
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
 
5
- exports.backgroundDefault = exports.backgroundSubtle = exports.surfacePrimaryDefault = exports.surfacePrimaryDefaultHover = exports.surfacePrimaryDefaultPressed = exports.surfaceSecondaryDefault = exports.surfaceSecondaryDefaultHover = exports.surfaceSecondaryDefaultPressed = exports.surfaceTertiaryDefault = exports.surfaceTertiaryDefaultHover = exports.surfaceTertiaryDefaultPressed = exports.surfaceNeutralDefault = exports.surfaceNeutralDefaultHover = exports.surfaceNeutralDefaultPressed = exports.surfaceFeedbackInfo = exports.surfaceFeedbackSuccess = exports.surfaceFeedbackWarning = exports.surfaceFeedbackCritical = exports.surfaceFeedbackTip = exports.fillPrimaryDefault = exports.fillPrimaryDefaultHover = exports.fillPrimaryDefaultPressed = exports.fillPrimarySelectedDefault = exports.fillPrimarySelectedHover = exports.fillPrimarySelectedPressed = exports.fillPrimarySubtle = exports.fillPrimarySubtleHover = exports.fillPrimarySubtlePressed = exports.fillPrimaryInvisible = exports.fillSecondaryDefault = exports.fillSecondaryDefaultHover = exports.fillSecondaryDefaultPressed = exports.fillSecondarySubtle = exports.fillSecondarySubtleHover = exports.fillSecondarySubtlePressed = exports.fillTertiaryDefault = exports.fillTertiaryDefaultHover = exports.fillTertiaryDefaultPressed = exports.fillTertiarySubtle = exports.fillTertiarySubtleHover = exports.fillTertiarySubtlePressed = exports.fillNeutralDefault = exports.fillNeutralDefaultHover = exports.fillNeutralDefaultPressed = exports.fillNeutralSubtle = exports.fillNeutralSubtleHover = exports.fillNeutralSubtlePressed = exports.fillNeutralExtraSubtle = exports.fillNeutralExtraSubtleHover = exports.fillNeutralExtraSubtlePressed = exports.fillFeedbackInfo = exports.fillFeedbackInfoSubtle = exports.fillFeedbackSuccess = exports.fillFeedbackSuccessSubtle = exports.fillFeedbackWarning = exports.fillFeedbackWarningSubtle = exports.fillFeedbackCritical = exports.fillFeedbackCriticalSubtle = exports.fillFeedbackTip = exports.fillFeedbackTipSubtle = exports.foregroundDefault = exports.foregroundSubtle = exports.foregroundEmphasis = exports.foregroundInverse = exports.foregroundInteractiveLink = exports.foregroundInteractiveLinkHover = exports.foregroundInteractiveLinkPressed = exports.foregroundInteractiveLinkActive = exports.foregroundFeedbackInfo = exports.foregroundFeedbackSuccess = exports.foregroundFeedbackWarning = exports.foregroundFeedbackCritical = exports.foregroundFeedbackTip = exports.componentFormInputForegroundDefault = exports.componentFormInputForegroundSubtle = exports.componentFormInputForegroundPlaceholder = exports.componentFormInputForegroundDisabled = exports.componentFormInputForegroundReadOnly = exports.componentFormInputForegroundError = exports.componentFormInputBorderActive = exports.componentFormInputFillDefault = exports.componentFormInputFillDefaultHover = exports.componentFormInputFillDefaultPressed = exports.componentFormInputFillDisabled = exports.componentFormInputFillReadOnly = exports.componentFormInputFillError = exports.componentFormToggleswitchHandleDefault = exports.componentFormToggleswitchFillDefault = exports.componentFormToggleswitchFillDefaultHover = exports.componentFormToggleswitchFillDefaultPressed = exports.componentFormToggleswitchFillSelected = exports.componentFormToggleswitchFillSelectedHover = exports.componentFormToggleswitchFillSelectedPressed = exports.componentFormToggleswitchFillCritical = exports.componentButtonActionBorderDefault = exports.componentButtonActionBorderHover = exports.componentButtonActionBorderPressed = exports.componentButtonActionFillDefault = exports.componentButtonActionFillHover = exports.componentButtonActionFillPressed = exports.componentButtonActionForegroundDefault = exports.componentButtonActionForegroundHover = exports.componentButtonPrimaryBorderDefault = exports.componentButtonPrimaryBorderHover = exports.componentButtonPrimaryBorderPressed = exports.componentButtonPrimaryFillDefault = exports.componentButtonPrimaryFillHover = exports.componentButtonPrimaryFillPressed = exports.componentButtonPrimaryForegroundDefault = exports.componentButtonPrimaryForegroundHover = exports.componentButtonSecondaryBorderDefault = exports.componentButtonSecondaryBorderHover = exports.componentButtonSecondaryBorderPressed = exports.componentButtonSecondaryFillDefault = exports.componentButtonSecondaryFillHover = exports.componentButtonSecondaryFillPressed = exports.componentButtonSecondaryForegroundDefault = exports.componentButtonSecondaryForegroundHover = exports.componentButtonTertiaryFillDefault = exports.componentButtonTertiaryFillHover = exports.componentButtonTertiaryFillPressed = exports.componentButtonTertiaryForegroundDefault = exports.componentButtonTertiaryForegroundHover = exports.componentLogoName = exports.componentLogoNumber1 = exports.componentLogoCircleDarkRed = exports.componentLogoCircleLightRed = exports.borderPrimaryDefault = exports.borderPrimaryDefaultHover = exports.borderPrimaryDefaultPressed = exports.borderPrimarySubtle = exports.borderPrimarySubtleHover = exports.borderPrimarySubtlePressed = exports.borderPrimaryEmphasis = exports.borderFeedbackInfo = exports.borderFeedbackSuccess = exports.borderFeedbackWarning = exports.borderFeedbackCritical = exports.borderFeedbackTip = exports.borderInteractiveFocus = exports.borderInteractiveSelected = void 0
5
+ exports.backgroundDefault = exports.backgroundSubtle = exports.surfacePrimaryDefault = exports.surfacePrimaryDefaultHover = exports.surfacePrimaryDefaultPressed = exports.surfaceSecondaryDefault = exports.surfaceSecondaryDefaultHover = exports.surfaceSecondaryDefaultPressed = exports.surfaceTertiaryDefault = exports.surfaceTertiaryDefaultHover = exports.surfaceTertiaryDefaultPressed = exports.surfaceNeutralDefault = exports.surfaceNeutralDefaultHover = exports.surfaceNeutralDefaultPressed = exports.surfaceFeedbackInfo = exports.surfaceFeedbackSuccess = exports.surfaceFeedbackWarning = exports.surfaceFeedbackCritical = exports.surfaceFeedbackTip = exports.fillPrimaryDefault = exports.fillPrimaryDefaultHover = exports.fillPrimaryDefaultPressed = exports.fillPrimarySelectedDefault = exports.fillPrimarySelectedHover = exports.fillPrimarySelectedPressed = exports.fillPrimarySubtle = exports.fillPrimarySubtleHover = exports.fillPrimarySubtlePressed = exports.fillPrimaryInvisible = exports.fillSecondaryDefault = exports.fillSecondaryDefaultHover = exports.fillSecondaryDefaultPressed = exports.fillSecondarySubtle = exports.fillSecondarySubtleHover = exports.fillSecondarySubtlePressed = exports.fillTertiaryDefault = exports.fillTertiaryDefaultHover = exports.fillTertiaryDefaultPressed = exports.fillTertiarySubtle = exports.fillTertiarySubtleHover = exports.fillTertiarySubtlePressed = exports.fillNeutralDefault = exports.fillNeutralDefaultHover = exports.fillNeutralDefaultPressed = exports.fillNeutralSubtle = exports.fillNeutralSubtleHover = exports.fillNeutralSubtlePressed = exports.fillNeutralExtraSubtle = exports.fillNeutralExtraSubtleHover = exports.fillNeutralExtraSubtlePressed = exports.fillFeedbackInfo = exports.fillFeedbackInfoSubtle = exports.fillFeedbackSuccess = exports.fillFeedbackSuccessSubtle = exports.fillFeedbackWarning = exports.fillFeedbackWarningSubtle = exports.fillFeedbackCritical = exports.fillFeedbackCriticalSubtle = exports.fillFeedbackTip = exports.fillFeedbackTipSubtle = exports.foregroundDefault = exports.foregroundSubtle = exports.foregroundEmphasis = exports.foregroundInverse = exports.foregroundInteractiveLink = exports.foregroundInteractiveLinkHover = exports.foregroundInteractiveLinkPressed = exports.foregroundInteractiveLinkActive = exports.foregroundInteractiveDisabled = exports.foregroundFeedbackInfo = exports.foregroundFeedbackSuccess = exports.foregroundFeedbackWarning = exports.foregroundFeedbackCritical = exports.foregroundFeedbackTip = exports.componentFormInputForegroundDefault = exports.componentFormInputForegroundSubtle = exports.componentFormInputForegroundPlaceholder = exports.componentFormInputForegroundDisabled = exports.componentFormInputForegroundReadOnly = exports.componentFormInputForegroundError = exports.componentFormInputBorderActive = exports.componentFormInputFillDefault = exports.componentFormInputFillDefaultHover = exports.componentFormInputFillDefaultPressed = exports.componentFormInputFillDisabled = exports.componentFormInputFillReadOnly = exports.componentFormInputFillError = exports.componentFormToggleswitchHandleDefault = exports.componentFormToggleswitchHandleDisabled = exports.componentFormToggleswitchFillDefault = exports.componentFormToggleswitchFillDefaultHover = exports.componentFormToggleswitchFillDefaultPressed = exports.componentFormToggleswitchFillSelected = exports.componentFormToggleswitchFillSelectedHover = exports.componentFormToggleswitchFillSelectedPressed = exports.componentFormToggleswitchFillSelectedDisabled = exports.componentFormToggleswitchFillSelectedReadOnly = exports.componentFormToggleswitchFillCritical = exports.componentFormToggleswitchFillDisabled = exports.componentFormToggleswitchFillReadOnly = exports.componentButtonActionBorderDefault = exports.componentButtonActionBorderHover = exports.componentButtonActionBorderPressed = exports.componentButtonActionFillDefault = exports.componentButtonActionFillHover = exports.componentButtonActionFillPressed = exports.componentButtonActionForegroundDefault = exports.componentButtonActionForegroundHover = exports.componentButtonPrimaryBorderDefault = exports.componentButtonPrimaryBorderHover = exports.componentButtonPrimaryBorderPressed = exports.componentButtonPrimaryFillDefault = exports.componentButtonPrimaryFillHover = exports.componentButtonPrimaryFillPressed = exports.componentButtonPrimaryForegroundDefault = exports.componentButtonPrimaryForegroundHover = exports.componentButtonSecondaryBorderDefault = exports.componentButtonSecondaryBorderHover = exports.componentButtonSecondaryBorderPressed = exports.componentButtonSecondaryFillDefault = exports.componentButtonSecondaryFillHover = exports.componentButtonSecondaryFillPressed = exports.componentButtonSecondaryForegroundDefault = exports.componentButtonSecondaryForegroundHover = exports.componentButtonTertiaryFillDefault = exports.componentButtonTertiaryFillHover = exports.componentButtonTertiaryFillPressed = exports.componentButtonTertiaryForegroundDefault = exports.componentButtonTertiaryForegroundHover = exports.componentLogoName = exports.componentLogoNumber1 = exports.componentLogoCircleDarkRed = exports.componentLogoCircleLightRed = exports.borderPrimaryDefault = exports.borderPrimaryDefaultHover = exports.borderPrimaryDefaultPressed = exports.borderPrimarySubtle = exports.borderPrimarySubtleHover = exports.borderPrimarySubtlePressed = exports.borderPrimaryEmphasis = exports.borderFeedbackInfo = exports.borderFeedbackSuccess = exports.borderFeedbackWarning = exports.borderFeedbackCritical = exports.borderFeedbackTip = exports.borderInteractiveFocus = exports.borderInteractiveSelected = void 0
6
6
 
7
7
  exports.backgroundDefault = 'var(--ffe-color-background-default)';
8
8
  exports.backgroundSubtle = 'var(--ffe-color-background-subtle)';
@@ -72,6 +72,7 @@ exports.foregroundInteractiveLink = 'var(--ffe-color-foreground-interactive-link
72
72
  exports.foregroundInteractiveLinkHover = 'var(--ffe-color-foreground-interactive-link-hover)';
73
73
  exports.foregroundInteractiveLinkPressed = 'var(--ffe-color-foreground-interactive-link-pressed)';
74
74
  exports.foregroundInteractiveLinkActive = 'var(--ffe-color-foreground-interactive-link-active)';
75
+ exports.foregroundInteractiveDisabled = 'var(--ffe-color-foreground-interactive-disabled)';
75
76
  exports.foregroundFeedbackInfo = 'var(--ffe-color-foreground-feedback-info)';
76
77
  exports.foregroundFeedbackSuccess = 'var(--ffe-color-foreground-feedback-success)';
77
78
  exports.foregroundFeedbackWarning = 'var(--ffe-color-foreground-feedback-warning)';
@@ -91,13 +92,18 @@ exports.componentFormInputFillDisabled = 'var(--ffe-color-component-form-input-f
91
92
  exports.componentFormInputFillReadOnly = 'var(--ffe-color-component-form-input-fill-read-only)';
92
93
  exports.componentFormInputFillError = 'var(--ffe-color-component-form-input-fill-error)';
93
94
  exports.componentFormToggleswitchHandleDefault = 'var(--ffe-color-component-form-toggleswitch-handle-default)';
95
+ exports.componentFormToggleswitchHandleDisabled = 'var(--ffe-color-component-form-toggleswitch-handle-disabled)';
94
96
  exports.componentFormToggleswitchFillDefault = 'var(--ffe-color-component-form-toggleswitch-fill-default)';
95
97
  exports.componentFormToggleswitchFillDefaultHover = 'var(--ffe-color-component-form-toggleswitch-fill-default-hover)';
96
98
  exports.componentFormToggleswitchFillDefaultPressed = 'var(--ffe-color-component-form-toggleswitch-fill-default-pressed)';
97
99
  exports.componentFormToggleswitchFillSelected = 'var(--ffe-color-component-form-toggleswitch-fill-selected)';
98
100
  exports.componentFormToggleswitchFillSelectedHover = 'var(--ffe-color-component-form-toggleswitch-fill-selected-hover)';
99
101
  exports.componentFormToggleswitchFillSelectedPressed = 'var(--ffe-color-component-form-toggleswitch-fill-selected-pressed)';
102
+ exports.componentFormToggleswitchFillSelectedDisabled = 'var(--ffe-color-component-form-toggleswitch-fill-selected-disabled)';
103
+ exports.componentFormToggleswitchFillSelectedReadOnly = 'var(--ffe-color-component-form-toggleswitch-fill-selected-read-only)';
100
104
  exports.componentFormToggleswitchFillCritical = 'var(--ffe-color-component-form-toggleswitch-fill-critical)';
105
+ exports.componentFormToggleswitchFillDisabled = 'var(--ffe-color-component-form-toggleswitch-fill-disabled)';
106
+ exports.componentFormToggleswitchFillReadOnly = 'var(--ffe-color-component-form-toggleswitch-fill-read-only)';
101
107
  exports.componentButtonActionBorderDefault = 'var(--ffe-color-component-button-action-border-default)';
102
108
  exports.componentButtonActionBorderHover = 'var(--ffe-color-component-button-action-border-hover)';
103
109
  exports.componentButtonActionBorderPressed = 'var(--ffe-color-component-button-action-border-pressed)';