@hopper-ui/styled-system 3.2.2 → 4.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 (35) hide show
  1. package/CHANGELOG.md +28 -0
  2. package/dist/StyledSystemProvider.css +34 -34
  3. package/dist/StyledSystemProvider.js +9 -9
  4. package/dist/{chunk-ASSKAO2A.js → chunk-2BMH444W.js} +45 -5
  5. package/dist/{chunk-VYSHJ4BC.js → chunk-3W57BWQT.js} +3 -3
  6. package/dist/{chunk-UR27V3AY.js → chunk-BLSIMXE7.js} +3 -3
  7. package/dist/{chunk-ODDLVJ3T.js → chunk-G37OO232.js} +1 -1
  8. package/dist/{chunk-WMA6YQHA.js → chunk-LLGTCJEP.js} +2 -2
  9. package/dist/{chunk-46R7LA5R.js → chunk-QAUUAHRK.js} +1 -1
  10. package/dist/{chunk-2B3FQDBI.js → chunk-RIOM7ASY.js} +1 -1
  11. package/dist/{chunk-F5DBKR5B.js → chunk-TSN5DPDB.js} +1 -1
  12. package/dist/{chunk-YFZ3HPSH.js → chunk-TZCNHN3Q.js} +4 -3
  13. package/dist/global-styles/BodyStyleProvider.js +2 -2
  14. package/dist/html-wrappers/html.css +34 -34
  15. package/dist/html-wrappers/html.js +6 -6
  16. package/dist/html-wrappers/htmlElement.css +34 -34
  17. package/dist/html-wrappers/htmlElement.js +5 -5
  18. package/dist/index.css +34 -34
  19. package/dist/index.d.ts +1 -1
  20. package/dist/index.js +9 -9
  21. package/dist/styledSystemProps.d.ts +13 -5
  22. package/dist/styledSystemRootCssClass.js +2 -2
  23. package/dist/theme/generated/sharegate/dark.css +273 -259
  24. package/dist/theme/generated/sharegate/light.css +307 -220
  25. package/dist/theme/generated/workleap/dark.css +27 -13
  26. package/dist/theme/generated/workleap/light.css +100 -13
  27. package/dist/tokens/generated/styledSystemConstants.d.ts +1 -1
  28. package/dist/tokens/generated/styledSystemConstants.js +1 -1
  29. package/dist/tokens/generated/styledSystemToTokenMappings.d.ts +42 -2
  30. package/dist/tokens/generated/styledSystemToTokenMappings.js +1 -1
  31. package/dist/tokens/tokenMappings.d.ts +42 -38
  32. package/dist/tokens/tokenMappings.js +3 -3
  33. package/dist/useStyledSystem.css +31 -31
  34. package/dist/useStyledSystem.js +4 -4
  35. package/package.json +2 -2
package/dist/theme/generated/sharegate/dark.css CHANGED
@@ -2,7 +2,7 @@
2
2
  * This file is generated by Style Dictionary. Do not edit directly.
3
3
  */
4
4
 
5
- .hop-5-2-2-sharegate-dark {
5
+ .hop-5-3-0-sharegate-dark {
6
6
  --hop-neutral-surface-weak-transparent-always-dark: rgb(49 51 53 / 0.75);
7
7
  --hop-neutral-surface-transparent: rgb(35 36 38 / 0.9);
8
8
  --hop-space-1280: 8rem;
@@ -33,11 +33,23 @@
33
33
  --hop-easing-duration-3: 300ms;
34
34
  --hop-easing-duration-2: 200ms;
35
35
  --hop-easing-duration-1: 100ms;
36
+ --hop-letter-spacing-wide-30: 0.1875rem;
37
+ --hop-letter-spacing-wide-25: 0.15625rem;
38
+ --hop-letter-spacing-wide-20: 0.125rem;
39
+ --hop-letter-spacing-wide-15: 0.09375rem;
40
+ --hop-letter-spacing-wide-10: 0.0625rem;
41
+ --hop-letter-spacing-wide-5: 0.03125rem;
42
+ --hop-letter-spacing-dense-5: -0.03125rem;
43
+ --hop-letter-spacing-dense-10: -0.0625rem;
44
+ --hop-letter-spacing-0: 0;
36
45
  --hop-line-height-1-50: 1.5;
37
46
  --hop-line-height-1-4285: 1.4285714;
47
+ --hop-line-height-1-40: 1.4;
38
48
  --hop-line-height-1-33: 1.3333333;
49
+ --hop-line-height-1-2857: 1.2857142;
39
50
  --hop-line-height-1-25: 1.25;
40
51
  --hop-line-height-1-20: 1.2;
52
+ --hop-line-height-1-1666: 1.1666666;
41
53
  --hop-line-height-1-14: 1.1428571;
42
54
  --hop-line-height-1-125: 1.125;
43
55
  --hop-font-weight-690: 690;
@@ -57,6 +69,7 @@
57
69
  --hop-font-size-160: 1rem;
58
70
  --hop-font-size-140: 0.875rem;
59
71
  --hop-font-size-120: 0.75rem;
72
+ --hop-font-size-100: 0.625rem;
60
73
  --hop-font-family-tertiary: 'ABC Favorit Mono', Consolas, 'SF Mono', monospace;
61
74
  --hop-font-family-secondary: 'Inter', Helvetica, Arial, sans-serif;
62
75
  --hop-font-family-primary: 'ABC Favorit', Helvetica, Arial, sans-serif;
@@ -100,18 +113,18 @@
100
113
  --hop-amber-75: #ffe39a;
101
114
  --hop-amber-50: #fff1cc;
102
115
  --hop-amber-25: #fff6e0;
103
- --hop-rose-900: #2b1e23;
104
- --hop-rose-800: #3d2630;
105
- --hop-rose-700: #542f3e;
106
- --hop-rose-600: #6a394c;
107
- --hop-rose-500: #80435a;
108
- --hop-rose-400: #995068;
109
- --hop-rose-300: #fc5992;
110
- --hop-rose-200: #f47c9e;
111
- --hop-rose-100: #f7a3ba;
112
- --hop-rose-75: #f9c1cf;
113
- --hop-rose-50: #fbd6df;
114
- --hop-rose-25: #fdecef;
116
+ --hop-rose-900: #341417;
117
+ --hop-rose-800: #50161c;
118
+ --hop-rose-700: #711822;
119
+ --hop-rose-600: #951b2a;
120
+ --hop-rose-500: #ba1f34;
121
+ --hop-rose-400: #de2840;
122
+ --hop-rose-300: #f5425d;
123
+ --hop-rose-200: #f76d83;
124
+ --hop-rose-100: #fa9ba9;
125
+ --hop-rose-75: #fcbcc5;
126
+ --hop-rose-50: #fdd3d8;
127
+ --hop-rose-25: #feeaec;
115
128
  --hop-samoyed: #ffffff;
116
129
  --hop-rock-900: #232426;
117
130
  --hop-rock-800: #313335;
@@ -288,211 +301,211 @@
288
301
  --hop-dataviz-unavailable-strong: var(--hop-rock-700);
289
302
  --hop-dataviz-unavailable-weak: var(--hop-rock-400);
290
303
  --hop-dataviz-unavailable: var(--hop-rock-600);
291
- --hop-warning-text-weak: var(--hop-koi-400);
292
- --hop-warning-text: var(--hop-koi-75);
293
- --hop-warning-surface-weak: var(--hop-koi-800);
294
- --hop-warning-surface-strong: var(--hop-koi-600);
295
- --hop-warning-surface: var(--hop-koi-900);
296
- --hop-warning-icon-weak: var(--hop-koi-400);
297
- --hop-warning-icon-weakest: var(--hop-koi-600);
298
- --hop-warning-icon: var(--hop-koi-75);
299
- --hop-warning-border: var(--hop-koi-600);
300
- --hop-success-text-hover: var(--hop-moss-50);
301
- --hop-success-text-weak: var(--hop-moss-400);
302
- --hop-success-text: var(--hop-moss-75);
303
- --hop-success-surface-weak: var(--hop-moss-800);
304
- --hop-success-surface-strong: var(--hop-moss-600);
305
- --hop-success-surface: var(--hop-moss-900);
306
- --hop-success-icon-weak: var(--hop-moss-400);
307
- --hop-success-icon-weakest: var(--hop-moss-600);
308
- --hop-success-icon: var(--hop-moss-75);
309
- --hop-success-border: var(--hop-moss-600);
310
- --hop-status-progress-text-selected: var(--hop-sapphire-75);
311
- --hop-status-progress-text-press: var(--hop-sapphire-800);
312
- --hop-status-progress-text-hover: var(--hop-sapphire-900);
313
- --hop-status-progress-text-disabled: var(--hop-sapphire-500);
314
- --hop-status-progress-text: var(--hop-sapphire-800);
315
- --hop-status-progress-surface-strong: var(--hop-sapphire-200);
316
- --hop-status-progress-surface-selected: var(--hop-sapphire-800);
317
- --hop-status-progress-surface-press: var(--hop-sapphire-300);
318
- --hop-status-progress-surface-hover: var(--hop-sapphire-200);
319
- --hop-status-progress-surface-disabled: var(--hop-sapphire-800);
320
- --hop-status-progress-surface: var(--hop-sapphire-100);
321
- --hop-status-progress-icon-selected: var(--hop-sapphire-75);
322
- --hop-status-progress-icon-press: var(--hop-sapphire-800);
323
- --hop-status-progress-icon-hover: var(--hop-sapphire-900);
324
- --hop-status-progress-icon-disabled: var(--hop-sapphire-500);
325
- --hop-status-progress-icon: var(--hop-sapphire-800);
326
- --hop-status-progress-border-selected: var(--hop-sapphire-75);
327
- --hop-status-progress-border-press: var(--hop-sapphire-400);
328
- --hop-status-progress-border-hover: var(--hop-sapphire-500);
329
- --hop-status-progress-border-disabled: var(--hop-sapphire-600);
330
- --hop-status-progress-border: var(--hop-sapphire-400);
331
- --hop-status-positive-text-selected: var(--hop-moss-75);
332
- --hop-status-positive-text-press: var(--hop-moss-800);
333
- --hop-status-positive-text-hover: var(--hop-moss-900);
334
- --hop-status-positive-text-disabled: var(--hop-moss-500);
335
- --hop-status-positive-text: var(--hop-moss-800);
336
- --hop-status-positive-surface-strong: var(--hop-moss-200);
337
- --hop-status-positive-surface-selected: var(--hop-moss-800);
338
- --hop-status-positive-surface-press: var(--hop-moss-300);
339
- --hop-status-positive-surface-hover: var(--hop-moss-200);
340
- --hop-status-positive-surface-disabled: var(--hop-moss-800);
341
- --hop-status-positive-surface: var(--hop-moss-100);
342
- --hop-status-positive-icon-selected: var(--hop-moss-75);
343
- --hop-status-positive-icon-press: var(--hop-moss-800);
344
- --hop-status-positive-icon-hover: var(--hop-moss-900);
345
- --hop-status-positive-icon-disabled: var(--hop-moss-500);
346
- --hop-status-positive-icon: var(--hop-moss-800);
347
- --hop-status-positive-border-selected: var(--hop-moss-75);
348
- --hop-status-positive-border-press: var(--hop-moss-400);
349
- --hop-status-positive-border-hover: var(--hop-moss-500);
350
- --hop-status-positive-border-disabled: var(--hop-moss-800);
351
- --hop-status-positive-border: var(--hop-moss-400);
352
- --hop-status-option6-text-selected: var(--hop-sunken-treasure-75);
353
- --hop-status-option6-text-press: var(--hop-sunken-treasure-800);
354
- --hop-status-option6-text-hover: var(--hop-sunken-treasure-900);
355
- --hop-status-option6-text-disabled: var(--hop-sunken-treasure-500);
356
- --hop-status-option6-text: var(--hop-sunken-treasure-800);
357
- --hop-status-option6-surface-strong: var(--hop-sunken-treasure-100);
358
- --hop-status-option6-surface-selected: var(--hop-sunken-treasure-800);
359
- --hop-status-option6-surface-press: var(--hop-sunken-treasure-300);
360
- --hop-status-option6-surface-hover: var(--hop-sunken-treasure-200);
361
- --hop-status-option6-surface-disabled: var(--hop-sunken-treasure-800);
362
- --hop-status-option6-surface: var(--hop-sunken-treasure-100);
363
- --hop-status-option6-icon-selected: var(--hop-sunken-treasure-75);
364
- --hop-status-option6-icon-press: var(--hop-sunken-treasure-800);
365
- --hop-status-option6-icon-hover: var(--hop-sunken-treasure-900);
366
- --hop-status-option6-icon-disabled: var(--hop-sunken-treasure-500);
367
- --hop-status-option6-icon: var(--hop-sunken-treasure-800);
368
- --hop-status-option6-border-selected: var(--hop-sunken-treasure-75);
369
- --hop-status-option6-border-press: var(--hop-sunken-treasure-400);
370
- --hop-status-option6-border-hover: var(--hop-sunken-treasure-500);
371
- --hop-status-option6-border-disabled: var(--hop-sunken-treasure-600);
372
- --hop-status-option6-border: var(--hop-sunken-treasure-400);
304
+ --hop-warning-text-weak: var(--hop-amber-400);
305
+ --hop-warning-text: var(--hop-amber-75);
306
+ --hop-warning-surface-weak: var(--hop-amber-800);
307
+ --hop-warning-surface-strong: var(--hop-amber-600);
308
+ --hop-warning-surface: var(--hop-amber-900);
309
+ --hop-warning-icon-weak: var(--hop-amber-400);
310
+ --hop-warning-icon-weakest: var(--hop-amber-600);
311
+ --hop-warning-icon: var(--hop-amber-75);
312
+ --hop-warning-border: var(--hop-amber-600);
313
+ --hop-success-text-hover: var(--hop-mint-50);
314
+ --hop-success-text-weak: var(--hop-mint-400);
315
+ --hop-success-text: var(--hop-mint-75);
316
+ --hop-success-surface-weak: var(--hop-mint-800);
317
+ --hop-success-surface-strong: var(--hop-mint-600);
318
+ --hop-success-surface: var(--hop-mint-900);
319
+ --hop-success-icon-weak: var(--hop-mint-400);
320
+ --hop-success-icon-weakest: var(--hop-mint-600);
321
+ --hop-success-icon: var(--hop-mint-75);
322
+ --hop-success-border: var(--hop-mint-600);
323
+ --hop-status-progress-text-selected: var(--hop-cobalt-75);
324
+ --hop-status-progress-text-press: var(--hop-cobalt-50);
325
+ --hop-status-progress-text-hover: var(--hop-cobalt-75);
326
+ --hop-status-progress-text-disabled: var(--hop-cobalt-500);
327
+ --hop-status-progress-text: var(--hop-cobalt-100);
328
+ --hop-status-progress-surface-strong: var(--hop-cobalt-500);
329
+ --hop-status-progress-surface-selected: var(--hop-cobalt-800);
330
+ --hop-status-progress-surface-press: var(--hop-cobalt-600);
331
+ --hop-status-progress-surface-hover: var(--hop-cobalt-700);
332
+ --hop-status-progress-surface-disabled: var(--hop-cobalt-900);
333
+ --hop-status-progress-surface: var(--hop-cobalt-800);
334
+ --hop-status-progress-icon-selected: var(--hop-cobalt-75);
335
+ --hop-status-progress-icon-press: var(--hop-cobalt-50);
336
+ --hop-status-progress-icon-hover: var(--hop-cobalt-75);
337
+ --hop-status-progress-icon-disabled: var(--hop-cobalt-500);
338
+ --hop-status-progress-icon: var(--hop-cobalt-100);
339
+ --hop-status-progress-border-selected: var(--hop-cobalt-75);
340
+ --hop-status-progress-border-press: var(--hop-cobalt-200);
341
+ --hop-status-progress-border-hover: var(--hop-cobalt-300);
342
+ --hop-status-progress-border-disabled: var(--hop-cobalt-800);
343
+ --hop-status-progress-border: var(--hop-cobalt-400);
344
+ --hop-status-positive-text-selected: var(--hop-mint-75);
345
+ --hop-status-positive-text-press: var(--hop-mint-50);
346
+ --hop-status-positive-text-hover: var(--hop-mint-75);
347
+ --hop-status-positive-text-disabled: var(--hop-mint-500);
348
+ --hop-status-positive-text: var(--hop-mint-100);
349
+ --hop-status-positive-surface-strong: var(--hop-mint-500);
350
+ --hop-status-positive-surface-selected: var(--hop-mint-800);
351
+ --hop-status-positive-surface-press: var(--hop-mint-600);
352
+ --hop-status-positive-surface-hover: var(--hop-mint-700);
353
+ --hop-status-positive-surface-disabled: var(--hop-mint-900);
354
+ --hop-status-positive-surface: var(--hop-mint-800);
355
+ --hop-status-positive-icon-selected: var(--hop-mint-75);
356
+ --hop-status-positive-icon-press: var(--hop-mint-50);
357
+ --hop-status-positive-icon-hover: var(--hop-mint-75);
358
+ --hop-status-positive-icon-disabled: var(--hop-mint-500);
359
+ --hop-status-positive-icon: var(--hop-mint-100);
360
+ --hop-status-positive-border-selected: var(--hop-mint-75);
361
+ --hop-status-positive-border-press: var(--hop-mint-200);
362
+ --hop-status-positive-border-hover: var(--hop-mint-300);
363
+ --hop-status-positive-border-disabled: var(--hop-mint-800);
364
+ --hop-status-positive-border: var(--hop-mint-400);
365
+ --hop-status-option6-text-selected: var(--hop-limeburst-75);
366
+ --hop-status-option6-text-press: var(--hop-limeburst-50);
367
+ --hop-status-option6-text-hover: var(--hop-limeburst-75);
368
+ --hop-status-option6-text-disabled: var(--hop-limeburst-500);
369
+ --hop-status-option6-text: var(--hop-limeburst-100);
370
+ --hop-status-option6-surface-strong: var(--hop-limeburst-500);
371
+ --hop-status-option6-surface-selected: var(--hop-limeburst-800);
372
+ --hop-status-option6-surface-press: var(--hop-limeburst-600);
373
+ --hop-status-option6-surface-hover: var(--hop-limeburst-700);
374
+ --hop-status-option6-surface-disabled: var(--hop-limeburst-900);
375
+ --hop-status-option6-surface: var(--hop-limeburst-800);
376
+ --hop-status-option6-icon-selected: var(--hop-limeburst-75);
377
+ --hop-status-option6-icon-press: var(--hop-limeburst-50);
378
+ --hop-status-option6-icon-hover: var(--hop-limeburst-75);
379
+ --hop-status-option6-icon-disabled: var(--hop-limeburst-500);
380
+ --hop-status-option6-icon: var(--hop-limeburst-100);
381
+ --hop-status-option6-border-selected: var(--hop-limeburst-75);
382
+ --hop-status-option6-border-press: var(--hop-limeburst-200);
383
+ --hop-status-option6-border-hover: var(--hop-limeburst-300);
384
+ --hop-status-option6-border-disabled: var(--hop-limeburst-800);
385
+ --hop-status-option6-border: var(--hop-limeburst-400);
373
386
  --hop-status-option5-text-selected: var(--hop-toad-75);
374
- --hop-status-option5-text-press: var(--hop-toad-800);
375
- --hop-status-option5-text-hover: var(--hop-toad-900);
387
+ --hop-status-option5-text-press: var(--hop-toad-50);
388
+ --hop-status-option5-text-hover: var(--hop-toad-75);
376
389
  --hop-status-option5-text-disabled: var(--hop-toad-500);
377
- --hop-status-option5-text: var(--hop-toad-800);
378
- --hop-status-option5-surface-strong: var(--hop-toad-100);
390
+ --hop-status-option5-text: var(--hop-toad-100);
391
+ --hop-status-option5-surface-strong: var(--hop-toad-500);
379
392
  --hop-status-option5-surface-selected: var(--hop-toad-800);
380
- --hop-status-option5-surface-press: var(--hop-toad-300);
381
- --hop-status-option5-surface-hover: var(--hop-toad-200);
382
- --hop-status-option5-surface-disabled: var(--hop-toad-800);
383
- --hop-status-option5-surface: var(--hop-toad-100);
393
+ --hop-status-option5-surface-press: var(--hop-toad-600);
394
+ --hop-status-option5-surface-hover: var(--hop-toad-700);
395
+ --hop-status-option5-surface-disabled: var(--hop-toad-900);
396
+ --hop-status-option5-surface: var(--hop-toad-800);
384
397
  --hop-status-option5-icon-selected: var(--hop-toad-75);
385
- --hop-status-option5-icon-press: var(--hop-toad-800);
386
- --hop-status-option5-icon-hover: var(--hop-toad-900);
398
+ --hop-status-option5-icon-press: var(--hop-toad-50);
399
+ --hop-status-option5-icon-hover: var(--hop-toad-75);
387
400
  --hop-status-option5-icon-disabled: var(--hop-toad-500);
388
- --hop-status-option5-icon: var(--hop-toad-800);
401
+ --hop-status-option5-icon: var(--hop-toad-100);
389
402
  --hop-status-option5-border-selected: var(--hop-toad-75);
390
- --hop-status-option5-border-press: var(--hop-toad-400);
391
- --hop-status-option5-border-hover: var(--hop-toad-500);
392
- --hop-status-option5-border-disabled: var(--hop-toad-600);
403
+ --hop-status-option5-border-press: var(--hop-toad-200);
404
+ --hop-status-option5-border-hover: var(--hop-toad-300);
405
+ --hop-status-option5-border-disabled: var(--hop-toad-800);
393
406
  --hop-status-option5-border: var(--hop-toad-400);
394
407
  --hop-status-option4-text-selected: var(--hop-fog-75);
395
- --hop-status-option4-text-press: var(--hop-fog-900);
396
- --hop-status-option4-text-hover: var(--hop-fog-900);
408
+ --hop-status-option4-text-press: var(--hop-fog-50);
409
+ --hop-status-option4-text-hover: var(--hop-fog-75);
397
410
  --hop-status-option4-text-disabled: var(--hop-fog-500);
398
- --hop-status-option4-text: var(--hop-fog-800);
399
- --hop-status-option4-surface-strong: var(--hop-fog-100);
411
+ --hop-status-option4-text: var(--hop-fog-100);
412
+ --hop-status-option4-surface-strong: var(--hop-fog-500);
400
413
  --hop-status-option4-surface-selected: var(--hop-fog-800);
401
- --hop-status-option4-surface-press: var(--hop-fog-300);
402
- --hop-status-option4-surface-hover: var(--hop-fog-200);
403
- --hop-status-option4-surface-disabled: var(--hop-fog-600);
404
- --hop-status-option4-surface: var(--hop-fog-100);
414
+ --hop-status-option4-surface-press: var(--hop-fog-600);
415
+ --hop-status-option4-surface-hover: var(--hop-fog-700);
416
+ --hop-status-option4-surface-disabled: var(--hop-fog-900);
417
+ --hop-status-option4-surface: var(--hop-fog-800);
405
418
  --hop-status-option4-icon-selected: var(--hop-fog-75);
406
- --hop-status-option4-icon-press: var(--hop-fog-800);
407
- --hop-status-option4-icon-hover: var(--hop-fog-900);
419
+ --hop-status-option4-icon-press: var(--hop-fog-50);
420
+ --hop-status-option4-icon-hover: var(--hop-fog-75);
408
421
  --hop-status-option4-icon-disabled: var(--hop-fog-500);
409
- --hop-status-option4-icon: var(--hop-fog-800);
422
+ --hop-status-option4-icon: var(--hop-fog-100);
410
423
  --hop-status-option4-border-selected: var(--hop-fog-75);
411
- --hop-status-option4-border-press: var(--hop-fog-400);
412
- --hop-status-option4-border-hover: var(--hop-fog-500);
413
- --hop-status-option4-border-disabled: var(--hop-fog-600);
424
+ --hop-status-option4-border-press: var(--hop-fog-200);
425
+ --hop-status-option4-border-hover: var(--hop-fog-300);
426
+ --hop-status-option4-border-disabled: var(--hop-fog-800);
414
427
  --hop-status-option4-border: var(--hop-fog-400);
415
- --hop-status-option3-text-selected: var(--hop-quetzal-75);
416
- --hop-status-option3-text-press: var(--hop-quetzal-800);
417
- --hop-status-option3-text-hover: var(--hop-quetzal-900);
418
- --hop-status-option3-text-disabled: var(--hop-quetzal-200);
419
- --hop-status-option3-text: var(--hop-quetzal-800);
420
- --hop-status-option3-surface-strong: var(--hop-quetzal-100);
421
- --hop-status-option3-surface-selected: var(--hop-quetzal-800);
422
- --hop-status-option3-surface-press: var(--hop-quetzal-300);
423
- --hop-status-option3-surface-hover: var(--hop-quetzal-200);
424
- --hop-status-option3-surface-disabled: var(--hop-quetzal-800);
425
- --hop-status-option3-surface: var(--hop-quetzal-100);
426
- --hop-status-option3-icon-selected: var(--hop-quetzal-75);
427
- --hop-status-option3-icon-press: var(--hop-quetzal-800);
428
- --hop-status-option3-icon-hover: var(--hop-quetzal-900);
429
- --hop-status-option3-icon-disabled: var(--hop-quetzal-500);
430
- --hop-status-option3-icon: var(--hop-quetzal-800);
431
- --hop-status-option3-border-selected: var(--hop-quetzal-75);
432
- --hop-status-option3-border-press: var(--hop-quetzal-400);
433
- --hop-status-option3-border-hover: var(--hop-quetzal-500);
434
- --hop-status-option3-border-disabled: var(--hop-quetzal-600);
435
- --hop-status-option3-border: var(--hop-quetzal-400);
436
- --hop-status-option2-text-selected: var(--hop-orchid-bloom-75);
437
- --hop-status-option2-text-press: var(--hop-orchid-bloom-800);
438
- --hop-status-option2-text-hover: var(--hop-orchid-bloom-900);
439
- --hop-status-option2-text-disabled: var(--hop-orchid-bloom-500);
440
- --hop-status-option2-text: var(--hop-orchid-bloom-800);
441
- --hop-status-option2-surface-strong: var(--hop-orchid-bloom-100);
442
- --hop-status-option2-surface-selected: var(--hop-orchid-bloom-800);
443
- --hop-status-option2-surface-press: var(--hop-orchid-bloom-300);
444
- --hop-status-option2-surface-hover: var(--hop-orchid-bloom-200);
445
- --hop-status-option2-surface-disabled: var(--hop-orchid-bloom-800);
446
- --hop-status-option2-surface: var(--hop-orchid-bloom-100);
447
- --hop-status-option2-icon-selected: var(--hop-orchid-bloom-75);
448
- --hop-status-option2-icon-press: var(--hop-orchid-bloom-800);
449
- --hop-status-option2-icon-hover: var(--hop-orchid-bloom-900);
450
- --hop-status-option2-icon-disabled: var(--hop-orchid-bloom-500);
451
- --hop-status-option2-icon: var(--hop-orchid-bloom-800);
452
- --hop-status-option2-border-selected: var(--hop-orchid-bloom-800);
453
- --hop-status-option2-border-press: var(--hop-orchid-bloom-300);
454
- --hop-status-option2-border-hover: var(--hop-orchid-bloom-500);
455
- --hop-status-option2-border-disabled: var(--hop-orchid-bloom-600);
456
- --hop-status-option2-border: var(--hop-orchid-bloom-300);
457
- --hop-status-option1-text-selected: var(--hop-coastal-75);
458
- --hop-status-option1-text-press: var(--hop-coastal-800);
459
- --hop-status-option1-text-hover: var(--hop-coastal-900);
460
- --hop-status-option1-text-disabled: var(--hop-coastal-500);
461
- --hop-status-option1-text: var(--hop-coastal-800);
462
- --hop-status-option1-surface-strong: var(--hop-coastal-100);
463
- --hop-status-option1-surface-selected: var(--hop-coastal-800);
464
- --hop-status-option1-surface-press: var(--hop-coastal-300);
465
- --hop-status-option1-surface-hover: var(--hop-coastal-200);
466
- --hop-status-option1-surface-disabled: var(--hop-coastal-800);
467
- --hop-status-option1-surface: var(--hop-coastal-100);
468
- --hop-status-option1-icon-selected: var(--hop-coastal-75);
469
- --hop-status-option1-icon-press: var(--hop-coastal-800);
470
- --hop-status-option1-icon-hover: var(--hop-coastal-900);
471
- --hop-status-option1-icon-disabled: var(--hop-coastal-500);
472
- --hop-status-option1-icon: var(--hop-coastal-800);
473
- --hop-status-option1-border-selected: var(--hop-coastal-75);
474
- --hop-status-option1-border-press: var(--hop-coastal-400);
475
- --hop-status-option1-border-hover: var(--hop-coastal-500);
476
- --hop-status-option1-border-disabled: var(--hop-coastal-600);
477
- --hop-status-option1-border: var(--hop-coastal-400);
428
+ --hop-status-option3-text-selected: var(--hop-moss-75);
429
+ --hop-status-option3-text-press: var(--hop-moss-50);
430
+ --hop-status-option3-text-hover: var(--hop-moss-75);
431
+ --hop-status-option3-text-disabled: var(--hop-moss-500);
432
+ --hop-status-option3-text: var(--hop-moss-100);
433
+ --hop-status-option3-surface-strong: var(--hop-moss-500);
434
+ --hop-status-option3-surface-selected: var(--hop-moss-800);
435
+ --hop-status-option3-surface-press: var(--hop-moss-600);
436
+ --hop-status-option3-surface-hover: var(--hop-moss-700);
437
+ --hop-status-option3-surface-disabled: var(--hop-moss-900);
438
+ --hop-status-option3-surface: var(--hop-moss-800);
439
+ --hop-status-option3-icon-selected: var(--hop-moss-75);
440
+ --hop-status-option3-icon-press: var(--hop-moss-50);
441
+ --hop-status-option3-icon-hover: var(--hop-moss-75);
442
+ --hop-status-option3-icon-disabled: var(--hop-moss-500);
443
+ --hop-status-option3-icon: var(--hop-moss-100);
444
+ --hop-status-option3-border-selected: var(--hop-moss-75);
445
+ --hop-status-option3-border-press: var(--hop-moss-200);
446
+ --hop-status-option3-border-hover: var(--hop-moss-300);
447
+ --hop-status-option3-border-disabled: var(--hop-moss-800);
448
+ --hop-status-option3-border: var(--hop-moss-400);
449
+ --hop-status-option2-text-selected: var(--hop-persimmon-75);
450
+ --hop-status-option2-text-press: var(--hop-persimmon-50);
451
+ --hop-status-option2-text-hover: var(--hop-persimmon-75);
452
+ --hop-status-option2-text-disabled: var(--hop-persimmon-500);
453
+ --hop-status-option2-text: var(--hop-persimmon-100);
454
+ --hop-status-option2-surface-strong: var(--hop-persimmon-500);
455
+ --hop-status-option2-surface-selected: var(--hop-persimmon-800);
456
+ --hop-status-option2-surface-press: var(--hop-persimmon-600);
457
+ --hop-status-option2-surface-hover: var(--hop-persimmon-700);
458
+ --hop-status-option2-surface-disabled: var(--hop-persimmon-900);
459
+ --hop-status-option2-surface: var(--hop-persimmon-800);
460
+ --hop-status-option2-icon-selected: var(--hop-persimmon-75);
461
+ --hop-status-option2-icon-press: var(--hop-persimmon-50);
462
+ --hop-status-option2-icon-hover: var(--hop-persimmon-75);
463
+ --hop-status-option2-icon-disabled: var(--hop-persimmon-500);
464
+ --hop-status-option2-icon: var(--hop-persimmon-100);
465
+ --hop-status-option2-border-selected: var(--hop-persimmon-75);
466
+ --hop-status-option2-border-press: var(--hop-persimmon-200);
467
+ --hop-status-option2-border-hover: var(--hop-persimmon-300);
468
+ --hop-status-option2-border-disabled: var(--hop-persimmon-800);
469
+ --hop-status-option2-border: var(--hop-persimmon-400);
470
+ --hop-status-option1-text-selected: var(--hop-iris-75);
471
+ --hop-status-option1-text-press: var(--hop-iris-50);
472
+ --hop-status-option1-text-hover: var(--hop-iris-75);
473
+ --hop-status-option1-text-disabled: var(--hop-iris-500);
474
+ --hop-status-option1-text: var(--hop-iris-100);
475
+ --hop-status-option1-surface-strong: var(--hop-iris-500);
476
+ --hop-status-option1-surface-selected: var(--hop-iris-800);
477
+ --hop-status-option1-surface-press: var(--hop-iris-600);
478
+ --hop-status-option1-surface-hover: var(--hop-iris-700);
479
+ --hop-status-option1-surface-disabled: var(--hop-iris-900);
480
+ --hop-status-option1-surface: var(--hop-iris-800);
481
+ --hop-status-option1-icon-selected: var(--hop-iris-75);
482
+ --hop-status-option1-icon-press: var(--hop-iris-50);
483
+ --hop-status-option1-icon-hover: var(--hop-iris-75);
484
+ --hop-status-option1-icon-disabled: var(--hop-iris-500);
485
+ --hop-status-option1-icon: var(--hop-iris-100);
486
+ --hop-status-option1-border-selected: var(--hop-iris-75);
487
+ --hop-status-option1-border-press: var(--hop-iris-200);
488
+ --hop-status-option1-border-hover: var(--hop-iris-300);
489
+ --hop-status-option1-border-disabled: var(--hop-iris-800);
490
+ --hop-status-option1-border: var(--hop-iris-400);
478
491
  --hop-status-neutral-text-selected: var(--hop-rock-900);
479
- --hop-status-neutral-text-press: var(--hop-rock-25);
492
+ --hop-status-neutral-text-press: var(--hop-rock-20);
480
493
  --hop-status-neutral-text-hover: var(--hop-rock-50);
481
- --hop-status-neutral-text-disabled: var(--hop-rock-500);
494
+ --hop-status-neutral-text-disabled: var(--hop-rock-300);
482
495
  --hop-status-neutral-text: var(--hop-rock-25);
483
- --hop-status-neutral-surface-strong: var(--hop-rock-100);
484
- --hop-status-neutral-surface-selected: var(--hop-toad-25);
496
+ --hop-status-neutral-surface-strong: var(--hop-rock-500);
497
+ --hop-status-neutral-surface-selected: var(--hop-rock-25);
485
498
  --hop-status-neutral-surface-press: var(--hop-rock-700);
486
499
  --hop-status-neutral-surface-hover: var(--hop-rock-800);
487
500
  --hop-status-neutral-surface-disabled: var(--hop-rock-700);
488
501
  --hop-status-neutral-surface: var(--hop-abyss);
489
- --hop-status-neutral-icon-selected: var(--hop-rock-25);
490
- --hop-status-neutral-icon-press: var(--hop-rock-25);
502
+ --hop-status-neutral-icon-selected: var(--hop-rock-900);
503
+ --hop-status-neutral-icon-press: var(--hop-rock-20);
491
504
  --hop-status-neutral-icon-hover: var(--hop-rock-50);
492
505
  --hop-status-neutral-icon-disabled: var(--hop-rock-500);
493
506
  --hop-status-neutral-icon: var(--hop-rock-25);
494
507
  --hop-status-neutral-border-selected: var(--hop-rock-25);
495
- --hop-status-neutral-border-press: var(--hop-rock-25);
508
+ --hop-status-neutral-border-press: var(--hop-rock-20);
496
509
  --hop-status-neutral-border-hover: var(--hop-rock-50);
497
510
  --hop-status-neutral-border-disabled: var(--hop-rock-800);
498
511
  --hop-status-neutral-border: var(--hop-rock-25);
@@ -518,47 +531,47 @@
518
531
  --hop-status-negative-border-disabled: var(--hop-amanita-600);
519
532
  --hop-status-negative-border: var(--hop-amanita-400);
520
533
  --hop-status-inactive-text-selected: var(--hop-rock-75);
521
- --hop-status-inactive-text-press: var(--hop-rock-800);
522
- --hop-status-inactive-text-hover: var(--hop-rock-900);
534
+ --hop-status-inactive-text-press: var(--hop-rock-50);
535
+ --hop-status-inactive-text-hover: var(--hop-rock-75);
523
536
  --hop-status-inactive-text-disabled: var(--hop-rock-500);
524
- --hop-status-inactive-text: var(--hop-rock-800);
525
- --hop-status-inactive-surface-strong: var(--hop-rock-100);
537
+ --hop-status-inactive-text: var(--hop-rock-100);
538
+ --hop-status-inactive-surface-strong: var(--hop-rock-500);
526
539
  --hop-status-inactive-surface-selected: var(--hop-rock-800);
527
- --hop-status-inactive-surface-press: var(--hop-rock-300);
528
- --hop-status-inactive-surface-hover: var(--hop-rock-200);
529
- --hop-status-inactive-surface-disabled: var(--hop-rock-800);
530
- --hop-status-inactive-surface: var(--hop-rock-75);
540
+ --hop-status-inactive-surface-press: var(--hop-rock-600);
541
+ --hop-status-inactive-surface-hover: var(--hop-rock-700);
542
+ --hop-status-inactive-surface-disabled: var(--hop-rock-900);
543
+ --hop-status-inactive-surface: var(--hop-rock-800);
531
544
  --hop-status-inactive-icon-selected: var(--hop-rock-75);
532
- --hop-status-inactive-icon-press: var(--hop-rock-800);
533
- --hop-status-inactive-icon-hover: var(--hop-rock-900);
545
+ --hop-status-inactive-icon-press: var(--hop-rock-50);
546
+ --hop-status-inactive-icon-hover: var(--hop-rock-75);
534
547
  --hop-status-inactive-icon-disabled: var(--hop-rock-500);
535
- --hop-status-inactive-icon: var(--hop-rock-800);
548
+ --hop-status-inactive-icon: var(--hop-rock-100);
536
549
  --hop-status-inactive-border-selected: var(--hop-rock-75);
537
- --hop-status-inactive-border-press: var(--hop-rock-400);
538
- --hop-status-inactive-border-hover: var(--hop-rock-500);
539
- --hop-status-inactive-border-disabled: var(--hop-rock-600);
550
+ --hop-status-inactive-border-press: var(--hop-rock-200);
551
+ --hop-status-inactive-border-hover: var(--hop-rock-300);
552
+ --hop-status-inactive-border-disabled: var(--hop-rock-800);
540
553
  --hop-status-inactive-border: var(--hop-rock-400);
541
- --hop-status-caution-text-selected: var(--hop-koi-75);
542
- --hop-status-caution-text-press: var(--hop-koi-800);
543
- --hop-status-caution-text-hover: var(--hop-koi-900);
544
- --hop-status-caution-text-disabled: var(--hop-koi-500);
545
- --hop-status-caution-text: var(--hop-koi-800);
546
- --hop-status-caution-surface-strong: var(--hop-koi-200);
547
- --hop-status-caution-surface-selected: var(--hop-koi-800);
548
- --hop-status-caution-surface-press: var(--hop-koi-300);
549
- --hop-status-caution-surface-hover: var(--hop-koi-200);
550
- --hop-status-caution-surface-disabled: var(--hop-koi-800);
551
- --hop-status-caution-surface: var(--hop-koi-100);
552
- --hop-status-caution-icon-selected: var(--hop-koi-75);
553
- --hop-status-caution-icon-press: var(--hop-koi-800);
554
- --hop-status-caution-icon-hover: var(--hop-koi-900);
555
- --hop-status-caution-icon-disabled: var(--hop-koi-500);
556
- --hop-status-caution-icon: var(--hop-koi-800);
557
- --hop-status-caution-border-selected: var(--hop-koi-75);
558
- --hop-status-caution-border-press: var(--hop-koi-400);
559
- --hop-status-caution-border-hover: var(--hop-koi-500);
560
- --hop-status-caution-border-disabled: var(--hop-koi-600);
561
- --hop-status-caution-border: var(--hop-koi-400);
554
+ --hop-status-caution-text-selected: var(--hop-amber-75);
555
+ --hop-status-caution-text-press: var(--hop-amber-50);
556
+ --hop-status-caution-text-hover: var(--hop-amber-75);
557
+ --hop-status-caution-text-disabled: var(--hop-amber-500);
558
+ --hop-status-caution-text: var(--hop-amber-100);
559
+ --hop-status-caution-surface-strong: var(--hop-amber-500);
560
+ --hop-status-caution-surface-selected: var(--hop-amber-800);
561
+ --hop-status-caution-surface-press: var(--hop-amber-600);
562
+ --hop-status-caution-surface-hover: var(--hop-amber-700);
563
+ --hop-status-caution-surface-disabled: var(--hop-amber-900);
564
+ --hop-status-caution-surface: var(--hop-amber-800);
565
+ --hop-status-caution-icon-selected: var(--hop-amber-75);
566
+ --hop-status-caution-icon-press: var(--hop-amber-50);
567
+ --hop-status-caution-icon-hover: var(--hop-amber-75);
568
+ --hop-status-caution-icon-disabled: var(--hop-amber-500);
569
+ --hop-status-caution-icon: var(--hop-amber-100);
570
+ --hop-status-caution-border-selected: var(--hop-amber-75);
571
+ --hop-status-caution-border-press: var(--hop-amber-200);
572
+ --hop-status-caution-border-hover: var(--hop-amber-300);
573
+ --hop-status-caution-border-disabled: var(--hop-amber-800);
574
+ --hop-status-caution-border: var(--hop-amber-400);
562
575
  --hop-secondary-icon-strong-hover: var(--hop-samoyed);
563
576
  --hop-secondary-icon-strong: var(--hop-samoyed);
564
577
  --hop-secondary-icon-disabled: var(--hop-persimmon-700);
@@ -824,41 +837,42 @@
824
837
  --hop-neutral-icon-weak-active: var(--hop-rock-50);
825
838
  --hop-neutral-icon-active: var(--hop-toad-25);
826
839
  --hop-neutral-border-active: var(--hop-rock-700);
827
- --hop-danger-text-weak-press: var(--hop-amanita-300);
828
- --hop-danger-text-weak-hover: var(--hop-amanita-200);
829
- --hop-danger-text-weak: var(--hop-amanita-100);
840
+ --hop-danger-text-weak-press: var(--hop-rose-100);
841
+ --hop-danger-text-weak-hover: var(--hop-rose-200);
842
+ --hop-danger-text-weak: var(--hop-rose-300);
830
843
  --hop-danger-text-strong-hover: var(--hop-samoyed);
831
844
  --hop-danger-text-strong: var(--hop-samoyed);
832
- --hop-danger-text-press: var(--hop-amanita-50);
833
- --hop-danger-text-hover: var(--hop-amanita-200);
834
- --hop-danger-text-disabled: var(--hop-amanita-600);
835
- --hop-danger-text-selected: var(--hop-amanita-100);
836
- --hop-danger-text: var(--hop-amanita-900);
837
- --hop-danger-surface-weak-press: var(--hop-amanita-600);
838
- --hop-danger-surface-weak-hover: var(--hop-amanita-700);
839
- --hop-danger-surface-weak: var(--hop-amanita-900);
840
- --hop-danger-surface-strong-hover: var(--hop-amanita-500);
841
- --hop-danger-surface-strong: var(--hop-amanita-400);
842
- --hop-danger-surface-press: var(--hop-amanita-600);
843
- --hop-danger-surface-hover: var(--hop-amanita-300);
844
- --hop-danger-surface-disabled: var(--hop-amanita-600);
845
- --hop-danger-surface-selected: var(--hop-amanita-800);
846
- --hop-danger-surface: var(--hop-amanita-200);
847
- --hop-danger-icon-weakest: var(--hop-amanita-100);
848
- --hop-danger-icon-weak-press: var(--hop-amanita-300);
849
- --hop-danger-icon-weak-hover: var(--hop-amanita-200);
850
- --hop-danger-icon-weak: var(--hop-amanita-100);
845
+ --hop-danger-text-press: var(--hop-rose-50);
846
+ --hop-danger-text-hover: var(--hop-rose-200);
847
+ --hop-danger-text-disabled: var(--hop-rose-600);
848
+ --hop-danger-text-selected: var(--hop-rose-300);
849
+ --hop-danger-text: var(--hop-rose-75);
850
+ --hop-danger-surface-weak-selected: var(--hop-rose-600);
851
+ --hop-danger-surface-weak-press: var(--hop-rose-600);
852
+ --hop-danger-surface-weak-hover: var(--hop-rose-700);
853
+ --hop-danger-surface-weak: var(--hop-rose-800);
854
+ --hop-danger-surface-strong-hover: var(--hop-rose-200);
855
+ --hop-danger-surface-strong: var(--hop-rose-300);
856
+ --hop-danger-surface-press: var(--hop-rose-100);
857
+ --hop-danger-surface-hover: var(--hop-rose-200);
858
+ --hop-danger-surface-disabled: var(--hop-rose-600);
859
+ --hop-danger-surface-selected: var(--hop-rose-800);
860
+ --hop-danger-surface: var(--hop-rose-900);
861
+ --hop-danger-icon-weakest: var(--hop-rose-700);
862
+ --hop-danger-icon-weak-press: var(--hop-rose-100);
863
+ --hop-danger-icon-weak-hover: var(--hop-rose-200);
864
+ --hop-danger-icon-weak: var(--hop-rose-300);
851
865
  --hop-danger-icon-strong-hover: var(--hop-samoyed);
852
866
  --hop-danger-icon-strong: var(--hop-samoyed);
853
- --hop-danger-icon-press: var(--hop-amanita-50);
854
- --hop-danger-icon-hover: var(--hop-amanita-200);
855
- --hop-danger-icon-disabled: var(--hop-amanita-600);
856
- --hop-danger-icon-selected: var(--hop-amanita-100);
857
- --hop-danger-icon: var(--hop-amanita-900);
858
- --hop-danger-border-strong: var(--hop-amanita-300);
859
- --hop-danger-border-press: var(--hop-amanita-400);
860
- --hop-danger-border-selected: var(--hop-amanita-100);
861
- --hop-danger-border: var(--hop-amanita-500);
867
+ --hop-danger-icon-press: var(--hop-rose-50);
868
+ --hop-danger-icon-hover: var(--hop-rose-200);
869
+ --hop-danger-icon-disabled: var(--hop-rose-500);
870
+ --hop-danger-icon-selected: var(--hop-rose-300);
871
+ --hop-danger-icon: var(--hop-rose-75);
872
+ --hop-danger-border-strong: var(--hop-rose-400);
873
+ --hop-danger-border-press: var(--hop-rose-400);
874
+ --hop-danger-border-selected: var(--hop-rose-300);
875
+ --hop-danger-border: var(--hop-rose-600);
862
876
  --hop-danger-text-weak-active: var(--hop-amanita-300);
863
877
  --hop-danger-text-active: var(--hop-amanita-50);
864
878
  --hop-danger-surface-weak-active: var(--hop-amanita-600);