@hopper-ui/styled-system 3.0.1 → 3.1.1

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 (33) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/dist/StyledSystemProvider.css +34 -34
  3. package/dist/StyledSystemProvider.js +9 -9
  4. package/dist/{chunk-SVHEHWY4.js → chunk-7OVCUMWS.js} +1 -1
  5. package/dist/{chunk-6JU6DVRC.js → chunk-FKFCSZEJ.js} +2 -2
  6. package/dist/{chunk-UHOIN4YW.js → chunk-FU5TYP7R.js} +1 -1
  7. package/dist/{chunk-JJKYIWIT.js → chunk-K3ZBOVUZ.js} +2 -2
  8. package/dist/{chunk-A54ZRFEM.js → chunk-LMCQIGNN.js} +39 -0
  9. package/dist/{chunk-YQ665QH5.js → chunk-MCXXQTRK.js} +1 -1
  10. package/dist/{chunk-77XC2H4T.js → chunk-QQAZ3B22.js} +2 -2
  11. package/dist/{chunk-Y43G4ZOP.js → chunk-UZXDG6VG.js} +3 -3
  12. package/dist/{chunk-6ZFFJVAW.js → chunk-VVQINHG2.js} +1 -1
  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.js +9 -9
  20. package/dist/styledSystemRootCssClass.js +2 -2
  21. package/dist/theme/generated/sharegate/dark.css +109 -71
  22. package/dist/theme/generated/sharegate/light.css +206 -70
  23. package/dist/theme/generated/workleap/dark.css +56 -18
  24. package/dist/theme/generated/workleap/light.css +152 -16
  25. package/dist/tokens/generated/styledSystemConstants.d.ts +1 -1
  26. package/dist/tokens/generated/styledSystemConstants.js +1 -1
  27. package/dist/tokens/generated/styledSystemToTokenMappings.d.ts +39 -0
  28. package/dist/tokens/generated/styledSystemToTokenMappings.js +1 -1
  29. package/dist/tokens/tokenMappings.d.ts +184 -3
  30. package/dist/tokens/tokenMappings.js +3 -3
  31. package/dist/useStyledSystem.css +31 -31
  32. package/dist/useStyledSystem.js +4 -4
  33. package/package.json +2 -2
package/dist/theme/generated/sharegate/light.css CHANGED
@@ -2,7 +2,19 @@
2
2
  * This file is generated by Style Dictionary. Do not edit directly.
3
3
  */
4
4
 
5
- .hop-5-0-0-sharegate {
5
+ .hop-5-1-1-sharegate {
6
+ --hop-comp-button-ghost-disabled-border-color: transparent;
7
+ --hop-comp-button-ghost-disabled-background-color: transparent;
8
+ --hop-comp-button-ghost-danger-border-color: transparent;
9
+ --hop-comp-button-ghost-danger-background-color: transparent;
10
+ --hop-comp-button-ghost-danger-box-shadow: none;
11
+ --hop-comp-button-ghost-secondary-border-color: transparent;
12
+ --hop-comp-button-ghost-secondary-background-color: transparent;
13
+ --hop-comp-button-ghost-secondary-box-shadow: none;
14
+ --hop-comp-button-ghost-primary-border-color: transparent;
15
+ --hop-comp-button-ghost-primary-background-color: transparent;
16
+ --hop-comp-button-ghost-primary-box-shadow: none;
17
+ --hop-comp-button-secondary-border-color-selected: transparent;
6
18
  --hop-overline-bottom-offset: -0.25rem;
7
19
  --hop-overline-top-offset: -0.25rem;
8
20
  --hop-heading-xs-medium-bottom-offset: -0.25rem;
@@ -295,6 +307,7 @@
295
307
  --hop-space-20: 0.125rem;
296
308
  --hop-space-10: 0.0625rem;
297
309
  --hop-space-0: 0;
310
+ --hop-border-radius-2-5: 0.75rem;
298
311
  --hop-border-radius-9999: 624.9375rem;
299
312
  --hop-border-radius-4: 1.5rem;
300
313
  --hop-border-radius-3: 1rem;
@@ -336,24 +349,25 @@
336
349
  --hop-font-family-tertiary: 'ABC Favorit Mono', Consolas, 'SF Mono', monospace;
337
350
  --hop-font-family-secondary: 'Inter', Helvetica, Arial, sans-serif;
338
351
  --hop-font-family-primary: 'ABC Favorit', Helvetica, Arial, sans-serif;
352
+ --hop-shadow-inset-bevel: 0 2px 1px 0 rgba(255, 255, 255, 0.25) inset, 0 -2px 2px 0 rgba(0, 0, 0, 0.25) inset;
339
353
  --hop-shadow-lg: 0 10px 18px 8px rgba(60, 60, 60, 0.08);
340
354
  --hop-shadow-md: 0 4px 10px 4px rgba(60, 60, 60, 0.08);
341
355
  --hop-shadow-sm: 0 1px 6px 0 rgba(60, 60, 60, 0.10);
342
356
  --hop-shadow-none: none;
343
357
  --hop-samoyed: #ffffff;
344
- --hop-rock-900: #292929;
345
- --hop-rock-800: #3c3c3c;
346
- --hop-rock-700: #505050;
347
- --hop-rock-600: #636362;
348
- --hop-rock-500: #6c6c6b;
349
- --hop-rock-400: #777775;
350
- --hop-rock-300: #959593;
351
- --hop-rock-200: #b3b3b1;
352
- --hop-rock-100: #ccccca;
353
- --hop-rock-75: #e0dfdd;
354
- --hop-rock-50: #ecebe8;
355
- --hop-rock-25: #f8f6f3;
356
- --hop-rock-20: #fcfbfb;
358
+ --hop-rock-900: #232426;
359
+ --hop-rock-800: #313335;
360
+ --hop-rock-700: #484a4d;
361
+ --hop-rock-600: #5e6064;
362
+ --hop-rock-500: #6c6e72;
363
+ --hop-rock-400: #787a7e;
364
+ --hop-rock-300: #96989d;
365
+ --hop-rock-200: #b3b5ba;
366
+ --hop-rock-100: #cbcdd2;
367
+ --hop-rock-75: #e1e3e7;
368
+ --hop-rock-50: #eef0f2;
369
+ --hop-rock-25: #f8f9fa;
370
+ --hop-rock-20: #fafbfc;
357
371
  --hop-abyss: #1d1d1c;
358
372
  --hop-moss-900: #132a27;
359
373
  --hop-moss-800: #16433d;
@@ -379,6 +393,18 @@
379
393
  --hop-amanita-75: #ffd6d3;
380
394
  --hop-amanita-50: #fde6e5;
381
395
  --hop-amanita-25: #fdf6f6;
396
+ --hop-limeburst-900: #1f2b00;
397
+ --hop-limeburst-800: #304200;
398
+ --hop-limeburst-700: #415800;
399
+ --hop-limeburst-600: #4f6c00;
400
+ --hop-limeburst-500: #577600;
401
+ --hop-limeburst-400: #5f8100;
402
+ --hop-limeburst-300: #77a300;
403
+ --hop-limeburst-200: #8fc300;
404
+ --hop-limeburst-100: #a3df00;
405
+ --hop-limeburst-75: #b3f400;
406
+ --hop-limeburst-50: #ccff42;
407
+ --hop-limeburst-25: #edffbc;
382
408
  --hop-koi-900: #451a02;
383
409
  --hop-koi-800: #692803;
384
410
  --hop-koi-700: #8c3504;
@@ -415,6 +441,18 @@
415
441
  --hop-toad-75: #e5ded6;
416
442
  --hop-toad-50: #f0eae3;
417
443
  --hop-toad-25: #fef6ef;
444
+ --hop-iris-900: #292362;
445
+ --hop-iris-800: #3b356c;
446
+ --hop-iris-700: #4d468f;
447
+ --hop-iris-600: #6057b3;
448
+ --hop-iris-500: #685dc9;
449
+ --hop-iris-400: #736ad2;
450
+ --hop-iris-300: #8e85ec;
451
+ --hop-iris-200: #b4abff;
452
+ --hop-iris-100: #c3bcff;
453
+ --hop-iris-75: #deddff;
454
+ --hop-iris-50: #eceaff;
455
+ --hop-iris-25: #f6f6ff;
418
456
  --hop-fog-900: #20282a;
419
457
  --hop-fog-800: #313e43;
420
458
  --hop-fog-700: #40535a;
@@ -439,6 +477,18 @@
439
477
  --hop-sapphire-75: #d6e0ff;
440
478
  --hop-sapphire-50: #e6ebff;
441
479
  --hop-sapphire-25: #f5f6ff;
480
+ --hop-persimmon-900: #4c1300;
481
+ --hop-persimmon-800: #731e00;
482
+ --hop-persimmon-700: #982700;
483
+ --hop-persimmon-600: #ba3000;
484
+ --hop-persimmon-500: #ca3400;
485
+ --hop-persimmon-400: #dd3900;
486
+ --hop-persimmon-300: #ff5b22;
487
+ --hop-persimmon-200: #ff9874;
488
+ --hop-persimmon-100: #ffbda7;
489
+ --hop-persimmon-75: #ffd8ca;
490
+ --hop-persimmon-50: #ffe7df;
491
+ --hop-persimmon-25: #fff5f2;
442
492
  --hop-orchid-bloom-900: #1e1c5d;
443
493
  --hop-orchid-bloom-800: #322b8d;
444
494
  --hop-orchid-bloom-700: #433fac;
@@ -475,7 +525,10 @@
475
525
  --hop-coastal-75: #bae6ff;
476
526
  --hop-coastal-50: #d9efff;
477
527
  --hop-coastal-25: #f0f8ff;
478
- --hop-comp-button-border-color: var(--hop-amanita-100);
528
+ --hop-comp-button-danger-box-shadow: var(--hop-shadow-inset-bevel);
529
+ --hop-comp-button-upsell-box-shadow: var(--hop-shadow-inset-bevel);
530
+ --hop-comp-button-secondary-box-shadow: var(--hop-shadow-inset-bevel);
531
+ --hop-comp-button-primary-box-shadow: var(--hop-shadow-inset-bevel);
479
532
  --hop-shape-rounded-sm: var(--hop-border-radius-1);
480
533
  --hop-shape-rounded-md: var(--hop-border-radius-2);
481
534
  --hop-shape-rounded-lg: var(--hop-border-radius-3);
@@ -992,34 +1045,34 @@
992
1045
  --hop-decorative-option9-surface: var(--hop-rock-400);
993
1046
  --hop-decorative-option9-icon: var(--hop-samoyed);
994
1047
  --hop-decorative-option9-border: var(--hop-rock-100);
995
- --hop-upsell-text-weak-press: var(--hop-sunken-treasure-600);
996
- --hop-upsell-text-weak-hover: var(--hop-sunken-treasure-500);
997
- --hop-upsell-text-weak: var(--hop-sunken-treasure-300);
998
- --hop-upsell-text-press: var(--hop-sunken-treasure-900);
999
- --hop-upsell-text-hover: var(--hop-sunken-treasure-800);
1000
- --hop-upsell-text-disabled: var(--hop-sunken-treasure-400);
1001
- --hop-upsell-text-selected: var(--hop-sunken-treasure-400);
1002
- --hop-upsell-text: var(--hop-sunken-treasure-700);
1003
- --hop-upsell-surface-weak-press: var(--hop-sunken-treasure-200);
1004
- --hop-upsell-surface-weak-hover: var(--hop-sunken-treasure-100);
1005
- --hop-upsell-surface-weak: var(--hop-sunken-treasure-75);
1006
- --hop-upsell-surface-press: var(--hop-sunken-treasure-75);
1007
- --hop-upsell-surface-hover: var(--hop-sunken-treasure-50);
1008
- --hop-upsell-surface-disabled: var(--hop-sunken-treasure-25);
1009
- --hop-upsell-surface-selected: var(--hop-sunken-treasure-50);
1010
- --hop-upsell-surface: var(--hop-sunken-treasure-25);
1011
- --hop-upsell-icon-weak-press: var(--hop-sunken-treasure-600);
1012
- --hop-upsell-icon-weak-hover: var(--hop-sunken-treasure-500);
1013
- --hop-upsell-icon-weak: var(--hop-sunken-treasure-300);
1014
- --hop-upsell-icon-weakest: var(--hop-sunken-treasure-75);
1015
- --hop-upsell-icon-press: var(--hop-sunken-treasure-900);
1016
- --hop-upsell-icon-hover: var(--hop-sunken-treasure-800);
1017
- --hop-upsell-icon-selected: var(--hop-sunken-treasure-400);
1018
- --hop-upsell-icon: var(--hop-sunken-treasure-700);
1019
- --hop-upsell-border-press: var(--hop-sunken-treasure-300);
1020
- --hop-upsell-border-disabled: var(--hop-sunken-treasure-75);
1021
- --hop-upsell-border-selected: var(--hop-sunken-treasure-400);
1022
- --hop-upsell-border: var(--hop-sunken-treasure-100);
1048
+ --hop-upsell-text-weak-press: var(--hop-limeburst-600);
1049
+ --hop-upsell-text-weak-hover: var(--hop-limeburst-500);
1050
+ --hop-upsell-text-weak: var(--hop-limeburst-300);
1051
+ --hop-upsell-text-press: var(--hop-limeburst-900);
1052
+ --hop-upsell-text-hover: var(--hop-limeburst-800);
1053
+ --hop-upsell-text-disabled: var(--hop-limeburst-400);
1054
+ --hop-upsell-text-selected: var(--hop-limeburst-600);
1055
+ --hop-upsell-text: var(--hop-limeburst-700);
1056
+ --hop-upsell-surface-weak-press: var(--hop-limeburst-200);
1057
+ --hop-upsell-surface-weak-hover: var(--hop-limeburst-100);
1058
+ --hop-upsell-surface-weak: var(--hop-limeburst-75);
1059
+ --hop-upsell-surface-press: var(--hop-limeburst-75);
1060
+ --hop-upsell-surface-hover: var(--hop-limeburst-50);
1061
+ --hop-upsell-surface-disabled: var(--hop-limeburst-25);
1062
+ --hop-upsell-surface-selected: var(--hop-limeburst-50);
1063
+ --hop-upsell-surface: var(--hop-limeburst-25);
1064
+ --hop-upsell-icon-weak-press: var(--hop-limeburst-600);
1065
+ --hop-upsell-icon-weak-hover: var(--hop-limeburst-500);
1066
+ --hop-upsell-icon-weak: var(--hop-limeburst-300);
1067
+ --hop-upsell-icon-weakest: var(--hop-limeburst-75);
1068
+ --hop-upsell-icon-press: var(--hop-limeburst-900);
1069
+ --hop-upsell-icon-hover: var(--hop-limeburst-800);
1070
+ --hop-upsell-icon-selected: var(--hop-limeburst-600);
1071
+ --hop-upsell-icon: var(--hop-limeburst-700);
1072
+ --hop-upsell-border-press: var(--hop-limeburst-300);
1073
+ --hop-upsell-border-disabled: var(--hop-limeburst-75);
1074
+ --hop-upsell-border-selected: var(--hop-limeburst-400);
1075
+ --hop-upsell-border: var(--hop-limeburst-100);
1023
1076
  --hop-upsell-text-weak-active: var(--hop-sunken-treasure-600);
1024
1077
  --hop-upsell-text-active: var(--hop-sunken-treasure-900);
1025
1078
  --hop-upsell-surface-weak-active: var(--hop-sunken-treasure-75);
@@ -1029,35 +1082,36 @@
1029
1082
  --hop-upsell-border-active: var(--hop-sunken-treasure-200);
1030
1083
  --hop-primary-text-strong-hover: var(--hop-samoyed);
1031
1084
  --hop-primary-text-strong: var(--hop-samoyed);
1032
- --hop-primary-text-press: var(--hop-sapphire-700);
1033
- --hop-primary-text-hover: var(--hop-sapphire-600);
1034
- --hop-primary-text-disabled: var(--hop-sapphire-200);
1035
- --hop-primary-text-selected: var(--hop-sapphire-500);
1036
- --hop-primary-text: var(--hop-sapphire-500);
1037
- --hop-primary-surface-weak-press: var(--hop-sapphire-75);
1038
- --hop-primary-surface-weak-hover: var(--hop-sapphire-50);
1039
- --hop-primary-surface-weak: var(--hop-sapphire-25);
1040
- --hop-primary-surface-strong-press: var(--hop-sapphire-700);
1041
- --hop-primary-surface-strong-hover: var(--hop-sapphire-600);
1042
- --hop-primary-surface-strong-selected: var(--hop-sapphire-50);
1043
- --hop-primary-surface-strong: var(--hop-sapphire-400);
1044
- --hop-primary-surface-press: var(--hop-sapphire-300);
1045
- --hop-primary-surface-hover: var(--hop-sapphire-200);
1046
- --hop-primary-surface-focus: var(--hop-sapphire-25);
1047
- --hop-primary-surface-disabled: var(--hop-sapphire-200);
1048
- --hop-primary-surface-selected: var(--hop-sapphire-50);
1049
- --hop-primary-surface: var(--hop-sapphire-50);
1085
+ --hop-primary-text-press: var(--hop-iris-700);
1086
+ --hop-primary-text-hover: var(--hop-iris-600);
1087
+ --hop-primary-text-disabled: var(--hop-iris-200);
1088
+ --hop-primary-text-selected: var(--hop-persimmon-500);
1089
+ --hop-primary-text: var(--hop-iris-500);
1090
+ --hop-primary-surface-weak-press: var(--hop-iris-75);
1091
+ --hop-primary-surface-weak-hover: var(--hop-iris-50);
1092
+ --hop-primary-surface-weak-selected: var(--hop-persimmon-200);
1093
+ --hop-primary-surface-weak: var(--hop-iris-25);
1094
+ --hop-primary-surface-strong-press: var(--hop-iris-700);
1095
+ --hop-primary-surface-strong-hover: var(--hop-iris-600);
1096
+ --hop-primary-surface-strong-selected: var(--hop-persimmon-50);
1097
+ --hop-primary-surface-strong: var(--hop-iris-400);
1098
+ --hop-primary-surface-press: var(--hop-iris-300);
1099
+ --hop-primary-surface-hover: var(--hop-iris-200);
1100
+ --hop-primary-surface-focus: var(--hop-iris-25);
1101
+ --hop-primary-surface-disabled: var(--hop-iris-200);
1102
+ --hop-primary-surface-selected: var(--hop-persimmon-300);
1103
+ --hop-primary-surface: var(--hop-iris-50);
1050
1104
  --hop-primary-icon-strong-hover: var(--hop-samoyed);
1051
1105
  --hop-primary-icon-strong: var(--hop-samoyed);
1052
- --hop-primary-icon-press: var(--hop-sapphire-700);
1053
- --hop-primary-icon-hover: var(--hop-sapphire-600);
1054
- --hop-primary-icon-disabled: var(--hop-sapphire-200);
1055
- --hop-primary-icon-selected: var(--hop-sapphire-500);
1056
- --hop-primary-icon: var(--hop-sapphire-500);
1057
- --hop-primary-border-press: var(--hop-sapphire-300);
1058
- --hop-primary-border-focus: var(--hop-sapphire-500);
1059
- --hop-primary-border-selected: var(--hop-sapphire-400);
1060
- --hop-primary-border: var(--hop-sapphire-400);
1106
+ --hop-primary-icon-press: var(--hop-iris-700);
1107
+ --hop-primary-icon-hover: var(--hop-iris-600);
1108
+ --hop-primary-icon-disabled: var(--hop-iris-200);
1109
+ --hop-primary-icon-selected: var(--hop-persimmon-500);
1110
+ --hop-primary-icon: var(--hop-iris-500);
1111
+ --hop-primary-border-press: var(--hop-iris-500);
1112
+ --hop-primary-border-focus: var(--hop-iris-500);
1113
+ --hop-primary-border-selected: var(--hop-persimmon-400);
1114
+ --hop-primary-border: var(--hop-iris-400);
1061
1115
  --hop-primary-text-active: var(--hop-sapphire-700);
1062
1116
  --hop-primary-surface-weak-active: var(--hop-sapphire-75);
1063
1117
  --hop-primary-surface-strong-active: var(--hop-sapphire-700);
@@ -1179,4 +1233,86 @@
1179
1233
  --hop-space-stack-md: var(--hop-space-160);
1180
1234
  --hop-space-stack-sm: var(--hop-space-80);
1181
1235
  --hop-space-stack-xs: var(--hop-space-40);
1236
+ --hop-comp-button-ghost-disabled-text-color: var(--hop-neutral-text-disabled);
1237
+ --hop-comp-button-disabled-border-color: var(--hop-neutral-surface-disabled);
1238
+ --hop-comp-button-disabled-background-color: var(--hop-neutral-surface-disabled);
1239
+ --hop-comp-button-disabled-text-color: var(--hop-neutral-text-disabled);
1240
+ --hop-comp-button-ghost-danger-border-color-selected: var(--hop-danger-surface-weak-press);
1241
+ --hop-comp-button-ghost-danger-border-color-pressed: var(--hop-danger-surface-weak-press);
1242
+ --hop-comp-button-ghost-danger-border-color-hover: var(--hop-neutral-surface-hover);
1243
+ --hop-comp-button-ghost-danger-background-color-selected: var(--hop-danger-surface-weak-press);
1244
+ --hop-comp-button-ghost-danger-background-color-pressed: var(--hop-danger-surface-weak-press);
1245
+ --hop-comp-button-ghost-danger-background-color-hover: var(--hop-neutral-surface-hover);
1246
+ --hop-comp-button-ghost-danger-text-color-selected: var(--hop-danger-text-press);
1247
+ --hop-comp-button-ghost-danger-text-color-pressed: var(--hop-danger-text-press);
1248
+ --hop-comp-button-ghost-danger-text-color-hover: var(--hop-danger-text-hover);
1249
+ --hop-comp-button-ghost-danger-text-color: var(--hop-danger-text-weak);
1250
+ --hop-comp-button-ghost-secondary-border-color-selected: var(--hop-neutral-surface-press);
1251
+ --hop-comp-button-ghost-secondary-border-color-pressed: var(--hop-neutral-surface-press);
1252
+ --hop-comp-button-ghost-secondary-border-color-hover: var(--hop-neutral-surface-hover);
1253
+ --hop-comp-button-ghost-secondary-background-color-selected: var(--hop-neutral-surface-press);
1254
+ --hop-comp-button-ghost-secondary-background-color-pressed: var(--hop-neutral-surface-press);
1255
+ --hop-comp-button-ghost-secondary-background-color-hover: var(--hop-neutral-surface-hover);
1256
+ --hop-comp-button-ghost-secondary-text-color-selected: var(--hop-neutral-text-weak-press);
1257
+ --hop-comp-button-ghost-secondary-text-color-pressed: var(--hop-neutral-text-weak-press);
1258
+ --hop-comp-button-ghost-secondary-text-color-hover: var(--hop-neutral-text-weak-hover);
1259
+ --hop-comp-button-ghost-secondary-text-color: var(--hop-neutral-text-weak);
1260
+ --hop-comp-button-ghost-primary-border-color-selected: var(--hop-primary-surface-weak-selected);
1261
+ --hop-comp-button-ghost-primary-border-color-pressed: var(--hop-primary-surface-weak-press);
1262
+ --hop-comp-button-ghost-primary-border-color-hover: var(--hop-neutral-surface-hover);
1263
+ --hop-comp-button-ghost-primary-background-color-selected: var(--hop-primary-surface-weak-selected);
1264
+ --hop-comp-button-ghost-primary-background-color-pressed: var(--hop-primary-surface-weak-press);
1265
+ --hop-comp-button-ghost-primary-background-color-hover: var(--hop-neutral-surface-hover);
1266
+ --hop-comp-button-ghost-primary-text-color-selected: var(--hop-primary-text-press);
1267
+ --hop-comp-button-ghost-primary-text-color-pressed: var(--hop-primary-text-press);
1268
+ --hop-comp-button-ghost-primary-text-color-hover: var(--hop-primary-text-hover);
1269
+ --hop-comp-button-ghost-primary-text-color: var(--hop-primary-text);
1270
+ --hop-comp-button-danger-border-color-selected: var(--hop-danger-border-selected);
1271
+ --hop-comp-button-danger-border-color-pressed: var(--hop-danger-surface-press);
1272
+ --hop-comp-button-danger-border-color-hover: var(--hop-danger-surface-strong-hover);
1273
+ --hop-comp-button-danger-border-color: var(--hop-danger-surface-strong);
1274
+ --hop-comp-button-danger-background-color-selected: var(--hop-danger-surface-selected);
1275
+ --hop-comp-button-danger-background-color-pressed: var(--hop-danger-surface-press);
1276
+ --hop-comp-button-danger-background-color-hover: var(--hop-danger-surface-strong-hover);
1277
+ --hop-comp-button-danger-background-color: var(--hop-danger-surface-strong);
1278
+ --hop-comp-button-danger-text-color-selected: var(--hop-danger-text-selected);
1279
+ --hop-comp-button-danger-text-color-pressed: var(--hop-danger-text-strong-hover);
1280
+ --hop-comp-button-danger-text-color-hover: var(--hop-danger-text-strong-hover);
1281
+ --hop-comp-button-danger-text-color: var(--hop-danger-text-strong);
1282
+ --hop-comp-button-upsell-border-color-selected: var(--hop-upsell-border-selected);
1283
+ --hop-comp-button-upsell-border-color-pressed: var(--hop-neutral-border-weakest);
1284
+ --hop-comp-button-upsell-border-color-hover: var(--hop-neutral-border-weakest);
1285
+ --hop-comp-button-upsell-border-color: var(--hop-neutral-border-weakest);
1286
+ --hop-comp-button-upsell-background-color-selected: var(--hop-upsell-surface-selected);
1287
+ --hop-comp-button-upsell-background-color-pressed: var(--hop-upsell-surface-weak-press);
1288
+ --hop-comp-button-upsell-background-color-hover: var(--hop-upsell-surface-weak-hover);
1289
+ --hop-comp-button-upsell-background-color: var(--hop-upsell-surface-weak);
1290
+ --hop-comp-button-upsell-text-color-selected: var(--hop-upsell-text-selected);
1291
+ --hop-comp-button-upsell-text-color-pressed: var(--hop-upsell-text-press);
1292
+ --hop-comp-button-upsell-text-color-hover: var(--hop-upsell-text-hover);
1293
+ --hop-comp-button-upsell-text-color: var(--hop-upsell-text);
1294
+ --hop-comp-button-secondary-border-color-pressed: var(--hop-neutral-border-weakest);
1295
+ --hop-comp-button-secondary-border-color-hover: var(--hop-neutral-border-weakest);
1296
+ --hop-comp-button-secondary-border-color: var(--hop-neutral-border-weakest);
1297
+ --hop-comp-button-secondary-background-color-selected: var(--hop-primary-surface-weak-selected);
1298
+ --hop-comp-button-secondary-background-color-pressed: var(--hop-neutral-surface-press);
1299
+ --hop-comp-button-secondary-background-color-hover: var(--hop-neutral-surface-hover);
1300
+ --hop-comp-button-secondary-background-color: var(--hop-neutral-surface);
1301
+ --hop-comp-button-secondary-text-color-selected: var(--hop-neutral-text);
1302
+ --hop-comp-button-secondary-text-color-pressed: var(--hop-neutral-text-press);
1303
+ --hop-comp-button-secondary-text-color-hover: var(--hop-neutral-text-hover);
1304
+ --hop-comp-button-secondary-text-color: var(--hop-neutral-text);
1305
+ --hop-comp-button-primary-border-color-selected: var(--hop-neutral-border-weakest);
1306
+ --hop-comp-button-primary-border-color-pressed: var(--hop-neutral-border-weakest);
1307
+ --hop-comp-button-primary-border-color-hover: var(--hop-neutral-border-weakest);
1308
+ --hop-comp-button-primary-border-color: var(--hop-neutral-border-weakest);
1309
+ --hop-comp-button-primary-background-color-selected: var(--hop-primary-surface-selected);
1310
+ --hop-comp-button-primary-background-color-pressed: var(--hop-primary-surface-strong-press);
1311
+ --hop-comp-button-primary-background-color-hover: var(--hop-primary-surface-strong-hover);
1312
+ --hop-comp-button-primary-background-color: var(--hop-primary-surface-strong);
1313
+ --hop-comp-button-primary-text-color-selected: var(--hop-neutral-text-strong);
1314
+ --hop-comp-button-primary-text-color-pressed: var(--hop-primary-text-strong);
1315
+ --hop-comp-button-primary-text-color-hover: var(--hop-primary-text-strong-hover);
1316
+ --hop-comp-button-primary-text-color: var(--hop-primary-text-strong);
1317
+ --hop-comp-button-border-radius: var(--hop-shape-rounded-md);
1182
1318
  }
package/dist/theme/generated/workleap/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-0-0-workleap-dark {
5
+ .hop-5-1-1-workleap-dark {
6
6
  --hop-space-1280: 8rem;
7
7
  --hop-space-960: 6rem;
8
8
  --hop-space-800: 5rem;
@@ -17,6 +17,7 @@
17
17
  --hop-space-20: 0.125rem;
18
18
  --hop-space-10: 0.0625rem;
19
19
  --hop-space-0: 0;
20
+ --hop-border-radius-2-5: 0.75rem;
20
21
  --hop-border-radius-9999: 624.9375rem;
21
22
  --hop-border-radius-4: 1.5rem;
22
23
  --hop-border-radius-3: 1rem;
@@ -58,24 +59,25 @@
58
59
  --hop-font-family-tertiary: 'ABC Favorit Mono', Consolas, 'SF Mono', monospace;
59
60
  --hop-font-family-secondary: 'Inter', Helvetica, Arial, sans-serif;
60
61
  --hop-font-family-primary: 'ABC Favorit', Helvetica, Arial, sans-serif;
62
+ --hop-shadow-inset-bevel: 0 2px 1px 0 rgba(255, 255, 255, 0.25) inset, 0 -2px 2px 0 rgba(0, 0, 0, 0.25) inset;
61
63
  --hop-shadow-lg: 0 10px 18px 8px rgba(60, 60, 60, 0.08);
62
64
  --hop-shadow-md: 0 4px 10px 4px rgba(60, 60, 60, 0.08);
63
65
  --hop-shadow-sm: 0 1px 6px 0 rgba(60, 60, 60, 0.10);
64
66
  --hop-shadow-none: none;
65
67
  --hop-samoyed: #ffffff;
66
- --hop-rock-900: #292929;
67
- --hop-rock-800: #3c3c3c;
68
- --hop-rock-700: #505050;
69
- --hop-rock-600: #636362;
70
- --hop-rock-500: #6c6c6b;
71
- --hop-rock-400: #777775;
72
- --hop-rock-300: #959593;
73
- --hop-rock-200: #b3b3b1;
74
- --hop-rock-100: #ccccca;
75
- --hop-rock-75: #e0dfdd;
76
- --hop-rock-50: #ecebe8;
77
- --hop-rock-25: #f8f6f3;
78
- --hop-rock-20: #fcfbfb;
68
+ --hop-rock-900: #232426;
69
+ --hop-rock-800: #313335;
70
+ --hop-rock-700: #484a4d;
71
+ --hop-rock-600: #5e6064;
72
+ --hop-rock-500: #6c6e72;
73
+ --hop-rock-400: #787a7e;
74
+ --hop-rock-300: #96989d;
75
+ --hop-rock-200: #b3b5ba;
76
+ --hop-rock-100: #cbcdd2;
77
+ --hop-rock-75: #e1e3e7;
78
+ --hop-rock-50: #eef0f2;
79
+ --hop-rock-25: #f8f9fa;
80
+ --hop-rock-20: #fafbfc;
79
81
  --hop-abyss: #1d1d1c;
80
82
  --hop-moss-900: #132a27;
81
83
  --hop-moss-800: #16433d;
@@ -101,6 +103,18 @@
101
103
  --hop-amanita-75: #ffd6d3;
102
104
  --hop-amanita-50: #fde6e5;
103
105
  --hop-amanita-25: #fdf6f6;
106
+ --hop-limeburst-900: #1f2b00;
107
+ --hop-limeburst-800: #304200;
108
+ --hop-limeburst-700: #415800;
109
+ --hop-limeburst-600: #4f6c00;
110
+ --hop-limeburst-500: #577600;
111
+ --hop-limeburst-400: #5f8100;
112
+ --hop-limeburst-300: #77a300;
113
+ --hop-limeburst-200: #8fc300;
114
+ --hop-limeburst-100: #a3df00;
115
+ --hop-limeburst-75: #b3f400;
116
+ --hop-limeburst-50: #ccff42;
117
+ --hop-limeburst-25: #edffbc;
104
118
  --hop-koi-900: #451a02;
105
119
  --hop-koi-800: #692803;
106
120
  --hop-koi-700: #8c3504;
@@ -137,6 +151,18 @@
137
151
  --hop-toad-75: #e5ded6;
138
152
  --hop-toad-50: #f0eae3;
139
153
  --hop-toad-25: #fef6ef;
154
+ --hop-iris-900: #292362;
155
+ --hop-iris-800: #3b356c;
156
+ --hop-iris-700: #4d468f;
157
+ --hop-iris-600: #6057b3;
158
+ --hop-iris-500: #685dc9;
159
+ --hop-iris-400: #736ad2;
160
+ --hop-iris-300: #8e85ec;
161
+ --hop-iris-200: #b4abff;
162
+ --hop-iris-100: #c3bcff;
163
+ --hop-iris-75: #deddff;
164
+ --hop-iris-50: #eceaff;
165
+ --hop-iris-25: #f6f6ff;
140
166
  --hop-fog-900: #20282a;
141
167
  --hop-fog-800: #313e43;
142
168
  --hop-fog-700: #40535a;
@@ -161,6 +187,18 @@
161
187
  --hop-sapphire-75: #d6e0ff;
162
188
  --hop-sapphire-50: #e6ebff;
163
189
  --hop-sapphire-25: #f5f6ff;
190
+ --hop-persimmon-900: #4c1300;
191
+ --hop-persimmon-800: #731e00;
192
+ --hop-persimmon-700: #982700;
193
+ --hop-persimmon-600: #ba3000;
194
+ --hop-persimmon-500: #ca3400;
195
+ --hop-persimmon-400: #dd3900;
196
+ --hop-persimmon-300: #ff5b22;
197
+ --hop-persimmon-200: #ff9874;
198
+ --hop-persimmon-100: #ffbda7;
199
+ --hop-persimmon-75: #ffd8ca;
200
+ --hop-persimmon-50: #ffe7df;
201
+ --hop-persimmon-25: #fff5f2;
164
202
  --hop-orchid-bloom-900: #1e1c5d;
165
203
  --hop-orchid-bloom-800: #322b8d;
166
204
  --hop-orchid-bloom-700: #433fac;
@@ -197,7 +235,6 @@
197
235
  --hop-coastal-75: #bae6ff;
198
236
  --hop-coastal-50: #d9efff;
199
237
  --hop-coastal-25: #f0f8ff;
200
- --hop-comp-button-border-color: var(--hop-amanita-500);
201
238
  --hop-dataviz-text-ondark: var(--hop-samoyed);
202
239
  --hop-dataviz-text-onlight: var(--hop-rock-800);
203
240
  --hop-dataviz-unavailable-strong: var(--hop-rock-700);
@@ -617,6 +654,7 @@
617
654
  --hop-primary-text: var(--hop-sapphire-100);
618
655
  --hop-primary-surface-weak-press: var(--hop-sapphire-600);
619
656
  --hop-primary-surface-weak-hover: var(--hop-sapphire-700);
657
+ --hop-primary-surface-weak-selected: var(--hop-sapphire-600);
620
658
  --hop-primary-surface-weak: var(--hop-sapphire-800);
621
659
  --hop-primary-surface-strong-press: var(--hop-sapphire-600);
622
660
  --hop-primary-surface-strong-hover: var(--hop-sapphire-500);
@@ -628,14 +666,14 @@
628
666
  --hop-primary-surface-disabled: var(--hop-sapphire-700);
629
667
  --hop-primary-surface-selected: var(--hop-sapphire-800);
630
668
  --hop-primary-surface: var(--hop-sapphire-200);
631
- --hop-primary-icon-strong-hover: var(--hop-sapphire-300);
669
+ --hop-primary-icon-strong-hover: var(--hop-samoyed);
632
670
  --hop-primary-icon-strong: var(--hop-samoyed);
633
671
  --hop-primary-icon-press: var(--hop-sapphire-75);
634
672
  --hop-primary-icon-hover: var(--hop-sapphire-300);
635
673
  --hop-primary-icon-disabled: var(--hop-sapphire-700);
636
674
  --hop-primary-icon-selected: var(--hop-sapphire-200);
637
- --hop-primary-icon: var(--hop-sapphire-200);
638
- --hop-primary-border-press: var(--hop-sapphire-500);
675
+ --hop-primary-icon: var(--hop-sapphire-100);
676
+ --hop-primary-border-press: var(--hop-sapphire-400);
639
677
  --hop-primary-border-focus: var(--hop-sapphire-200);
640
678
  --hop-primary-border-selected: var(--hop-sapphire-300);
641
679
  --hop-primary-border: var(--hop-sapphire-300);