@wix/design-system-tokens 1.129.0 → 1.131.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 (26) hide show
  1. package/CHANGELOG.md +32 -0
  2. package/all.css +86 -22
  3. package/all.scss +86 -22
  4. package/all.st.css +224 -96
  5. package/component.st.css +173 -59
  6. package/foundation.st.css +15 -15
  7. package/odeditor/all.css +84 -51
  8. package/odeditor/all.scss +84 -51
  9. package/odeditor/all.st.css +159 -93
  10. package/odeditor/component.st.css +112 -60
  11. package/odeditor/foundation.st.css +16 -16
  12. package/odeditor/semantic.st.css +31 -17
  13. package/package.json +2 -2
  14. package/semantic.st.css +36 -22
  15. package/studio/all.css +98 -33
  16. package/studio/all.scss +98 -33
  17. package/studio/all.st.css +264 -134
  18. package/studio/component.st.css +186 -70
  19. package/studio/foundation.st.css +17 -17
  20. package/studio/semantic.st.css +61 -47
  21. package/wixel/all.css +105 -29
  22. package/wixel/all.scss +105 -29
  23. package/wixel/all.st.css +247 -95
  24. package/wixel/component.st.css +178 -64
  25. package/wixel/foundation.st.css +10 -10
  26. package/wixel/semantic.st.css +59 -21
package/wixel/semantic.st.css CHANGED
@@ -34,6 +34,8 @@
34
34
  @property st-global(--wds-color-border-light-active);
35
35
  @property st-global(--wds-color-border-light-disabled);
36
36
  @property st-global(--wds-color-border-light-hover);
37
+ @property st-global(--wds-color-border-light-primary-active);
38
+ @property st-global(--wds-color-border-light-primary-disabled);
37
39
  @property st-global(--wds-color-border-premium-primary);
38
40
  @property st-global(--wds-color-border-premium-primary-active);
39
41
  @property st-global(--wds-color-border-premium-primary-disabled);
@@ -342,6 +344,10 @@
342
344
  @property st-global(--wds-color-fill-warning-secondary-active);
343
345
  @property st-global(--wds-color-fill-warning-secondary-disabled);
344
346
  @property st-global(--wds-color-fill-warning-secondary-hover);
347
+ @property st-global(--wds-color-fill-warning-tertiary);
348
+ @property st-global(--wds-color-fill-warning-tertiary-active);
349
+ @property st-global(--wds-color-fill-warning-tertiary-disabled);
350
+ @property st-global(--wds-color-fill-warning-tertiary-hover);
345
351
  @property st-global(--wds-color-text-destructive);
346
352
  @property st-global(--wds-color-text-disabled);
347
353
  @property st-global(--wds-color-text-disabled-light);
@@ -393,6 +399,19 @@
393
399
  @property st-global(--wds-font-weight-heading-4);
394
400
  @property st-global(--wds-font-weight-heading-5);
395
401
  @property st-global(--wds-font-weight-heading-6);
402
+ @property st-global(--wds-inner-shadow-blur-input);
403
+ @property st-global(--wds-inner-shadow-blur-primary);
404
+ @property st-global(--wds-inner-shadow-blur-secondary);
405
+ @property st-global(--wds-inner-shadow-fill-input);
406
+ @property st-global(--wds-inner-shadow-fill-primary);
407
+ @property st-global(--wds-inner-shadow-fill-secondary);
408
+ @property st-global(--wds-inner-shadow-fill-track);
409
+ @property st-global(--wds-inner-shadow-x-input);
410
+ @property st-global(--wds-inner-shadow-x-primary);
411
+ @property st-global(--wds-inner-shadow-x-secondary);
412
+ @property st-global(--wds-inner-shadow-y-input);
413
+ @property st-global(--wds-inner-shadow-y-primary);
414
+ @property st-global(--wds-inner-shadow-y-secondary);
396
415
  @property st-global(--wds-shadow-blur-input);
397
416
  @property st-global(--wds-shadow-blur-primary-modal);
398
417
  @property st-global(--wds-shadow-blur-primary-overlay);
@@ -461,13 +480,13 @@
461
480
  @property st-global(--wds-width-default-2);
462
481
 
463
482
  .root {
464
- --wds-background-blur-modal: 0;
483
+ --wds-background-blur-modal: 0px;
465
484
  --wds-border-radius-surface-default: 12px;
466
485
  --wds-border-radius-surface-modal: 12px;
467
- --wds-border-radius-surface-modal-backdrop: 0;
486
+ --wds-border-radius-surface-modal-backdrop: 0px;
468
487
  --wds-border-radius-surface-overlay: 12px;
469
488
  --wds-border-radius-surface-raised: 12px;
470
- --wds-border-radius-surface-sunken: 0;
489
+ --wds-border-radius-surface-sunken: 0px;
471
490
  --wds-border-width-default: 0px;
472
491
  --wds-color-border-ai-primary: #ffffff;
473
492
  --wds-color-border-ai-primary-active: #ffffff;
@@ -497,6 +516,8 @@
497
516
  --wds-color-border-light-active: #ffffff;
498
517
  --wds-color-border-light-disabled: rgba(255, 255, 255, 0.3000);
499
518
  --wds-color-border-light-hover: rgba(255, 255, 255, 0.7000);
519
+ --wds-color-border-light-primary-active: #ffffff;
520
+ --wds-color-border-light-primary-disabled: rgba(255, 255, 255, 0.3000);
500
521
  --wds-color-border-premium-primary: #cf8cf1;
501
522
  --wds-color-border-premium-primary-active: #9a27d5;
502
523
  --wds-color-border-premium-primary-disabled: rgba(38, 37, 36, 0.1000);
@@ -805,6 +826,10 @@
805
826
  --wds-color-fill-warning-secondary-active: #fef3e5;
806
827
  --wds-color-fill-warning-secondary-disabled: #e5e5e5;
807
828
  --wds-color-fill-warning-secondary-hover: #fcd29d;
829
+ --wds-color-fill-warning-tertiary: #ffffff;
830
+ --wds-color-fill-warning-tertiary-active: #fdead2;
831
+ --wds-color-fill-warning-tertiary-disabled: #ffffff;
832
+ --wds-color-fill-warning-tertiary-hover: #f7f8f8;
808
833
  --wds-color-text-destructive: #ee4437;
809
834
  --wds-color-text-disabled: rgba(38, 37, 36, 0.3000);
810
835
  --wds-color-text-disabled-light: rgba(255, 255, 255, 0.7000);
@@ -823,10 +848,10 @@
823
848
  --wds-color-text-success: #25a55a;
824
849
  --wds-color-text-urgent: #f96132;
825
850
  --wds-color-text-warning: #f9ad4d;
826
- --wds-font-letter-spacing-heading-1: 0;
827
- --wds-font-letter-spacing-heading-2: 0;
851
+ --wds-font-letter-spacing-heading-1: 0px;
852
+ --wds-font-letter-spacing-heading-2: 0px;
828
853
  --wds-font-letter-spacing-heading-3: -0.50;
829
- --wds-font-letter-spacing-heading-4: 0;
854
+ --wds-font-letter-spacing-heading-4: 0px;
830
855
  --wds-font-letter-spacing-heading-5: 1px;
831
856
  --wds-font-letter-spacing-heading-6: 1px;
832
857
  --wds-font-line-height-body-extra-tiny: 14px;
@@ -856,17 +881,30 @@
856
881
  --wds-font-weight-heading-4: 700;
857
882
  --wds-font-weight-heading-5: 700;
858
883
  --wds-font-weight-heading-6: 400;
859
- --wds-shadow-blur-input: 0;
884
+ --wds-inner-shadow-blur-input: 0px;
885
+ --wds-inner-shadow-blur-primary: 0px;
886
+ --wds-inner-shadow-blur-secondary: 0px;
887
+ --wds-inner-shadow-fill-input: rgba(38, 37, 36, 0.0000);
888
+ --wds-inner-shadow-fill-primary: rgba(255, 255, 255, 0.0000);
889
+ --wds-inner-shadow-fill-secondary: rgba(255, 255, 255, 0.0000);
890
+ --wds-inner-shadow-fill-track: rgba(38, 37, 36, 0.0000);
891
+ --wds-inner-shadow-x-input: 0px;
892
+ --wds-inner-shadow-x-primary: 0px;
893
+ --wds-inner-shadow-x-secondary: 0px;
894
+ --wds-inner-shadow-y-input: 0px;
895
+ --wds-inner-shadow-y-primary: 0px;
896
+ --wds-inner-shadow-y-secondary: 0px;
897
+ --wds-shadow-blur-input: 0px;
860
898
  --wds-shadow-blur-primary-modal: 30px;
861
899
  --wds-shadow-blur-primary-overlay: 30px;
862
900
  --wds-shadow-blur-primary-overlay-dark: 8px;
863
901
  --wds-shadow-blur-primary-raised: 10px;
864
- --wds-shadow-blur-primary-toggle: 0;
865
- --wds-shadow-blur-secondary-modal: 0;
866
- --wds-shadow-blur-secondary-overlay: 0;
867
- --wds-shadow-blur-secondary-overlay-dark: 0;
902
+ --wds-shadow-blur-primary-toggle: 0px;
903
+ --wds-shadow-blur-secondary-modal: 0px;
904
+ --wds-shadow-blur-secondary-overlay: 0px;
905
+ --wds-shadow-blur-secondary-overlay-dark: 0px;
868
906
  --wds-shadow-blur-secondary-raised: 2px;
869
- --wds-shadow-blur-secondary-toggle: 0;
907
+ --wds-shadow-blur-secondary-toggle: 0px;
870
908
  --wds-shadow-fill-input: rgba(38, 37, 36, 0.0000);
871
909
  --wds-shadow-fill-primary-modal: rgba(38, 37, 36, 0.2000);
872
910
  --wds-shadow-fill-primary-overlay: rgba(38, 37, 36, 0.1000);
@@ -893,19 +931,19 @@
893
931
  --wds-shadow-surface-overlay: 0 2px 18px rgba(38, 37, 36, 0.1000), 0 6px 6px rgba(38, 37, 36, 0.0000);
894
932
  --wds-shadow-surface-overlay-dark: 0 10px 18px rgba(38, 37, 36, 0.1000), 0 6px 6px rgba(38, 37, 36, 0.0000);
895
933
  --wds-shadow-surface-raised: 0 1px 4px rgba(38, 37, 36, 0.3000), 0 2px 4px rgba(38, 37, 36, 0.0000);
896
- --wds-shadow-x-input: 0;
934
+ --wds-shadow-x-input: 0px;
897
935
  --wds-shadow-x-secondary-raised: 1px;
898
- --wds-shadow-y-input: 0;
936
+ --wds-shadow-y-input: 0px;
899
937
  --wds-shadow-y-primary-modal: 10px;
900
938
  --wds-shadow-y-primary-overlay: 10px;
901
- --wds-shadow-y-primary-overlay-dark: 0;
939
+ --wds-shadow-y-primary-overlay-dark: 0px;
902
940
  --wds-shadow-y-primary-raised: 1px;
903
- --wds-shadow-y-primary-toggle: 0;
904
- --wds-shadow-y-secondary-modal: 0;
905
- --wds-shadow-y-secondary-overlay: 0;
906
- --wds-shadow-y-secondary-overlay-dark: 0;
907
- --wds-shadow-y-secondary-raised: 0;
908
- --wds-shadow-y-secondary-toggle: 0;
941
+ --wds-shadow-y-primary-toggle: 0px;
942
+ --wds-shadow-y-secondary-modal: 0px;
943
+ --wds-shadow-y-secondary-overlay: 0px;
944
+ --wds-shadow-y-secondary-overlay-dark: 0px;
945
+ --wds-shadow-y-secondary-raised: 0px;
946
+ --wds-shadow-y-secondary-toggle: 0px;
909
947
  --wds-space-mobile-viewport-spacing: 32px;
910
948
  --wds-space-padding-horizontal-large: 24px;
911
949
  --wds-space-padding-horizontal-medium: 20px;