@wix/react-component-schema 1.7.0 → 1.8.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 (9) hide show
  1. package/dist/index.d.ts +414 -0
  2. package/dist/index.js +237 -1
  3. package/dist/theme-variables.module.css +199 -0
  4. package/dist/theme-variables.scss +199 -0
  5. package/package.json +7 -3
  6. package/src/__snapshots__/index.test.ts.snap +1057 -1
  7. package/src/index.test.ts +10 -0
  8. package/src/index.ts +15 -0
  9. package/vite.config.ts +25 -0
package/src/__snapshots__/index.test.ts.snap CHANGED
@@ -659,6 +659,51 @@ export declare interface Behaviors {
659
659
  removable?: boolean | null;
660
660
  }
661
661
 
662
+ export declare const BoxVariableNames: {
663
+ readonly 'wst-box-primary-background-image': "wst-box-primary-background-image";
664
+ readonly 'wst-box-secondary-background-image': "wst-box-secondary-background-image";
665
+ readonly 'wst-box-primary-border-left-width': "wst-box-primary-border-left-width";
666
+ readonly 'wst-box-primary-border-right-width': "wst-box-primary-border-right-width";
667
+ readonly 'wst-box-primary-border-top-width': "wst-box-primary-border-top-width";
668
+ readonly 'wst-box-primary-border-bottom-width': "wst-box-primary-border-bottom-width";
669
+ readonly 'wst-box-primary-border-left-style': "wst-box-primary-border-left-style";
670
+ readonly 'wst-box-primary-border-right-style': "wst-box-primary-border-right-style";
671
+ readonly 'wst-box-primary-border-top-style': "wst-box-primary-border-top-style";
672
+ readonly 'wst-box-primary-border-bottom-style': "wst-box-primary-border-bottom-style";
673
+ readonly 'wst-box-primary-border-top-left-radius': "wst-box-primary-border-top-left-radius";
674
+ readonly 'wst-box-primary-border-top-right-radius': "wst-box-primary-border-top-right-radius";
675
+ readonly 'wst-box-primary-border-bottom-left-radius': "wst-box-primary-border-bottom-left-radius";
676
+ readonly 'wst-box-primary-border-bottom-right-radius': "wst-box-primary-border-bottom-right-radius";
677
+ readonly 'wst-box-primary-box-shadow': "wst-box-primary-box-shadow";
678
+ readonly 'wst-box-secondary-border-left-width': "wst-box-secondary-border-left-width";
679
+ readonly 'wst-box-secondary-border-right-width': "wst-box-secondary-border-right-width";
680
+ readonly 'wst-box-secondary-border-top-width': "wst-box-secondary-border-top-width";
681
+ readonly 'wst-box-secondary-border-bottom-width': "wst-box-secondary-border-bottom-width";
682
+ readonly 'wst-box-secondary-border-left-style': "wst-box-secondary-border-left-style";
683
+ readonly 'wst-box-secondary-border-right-style': "wst-box-secondary-border-right-style";
684
+ readonly 'wst-box-secondary-border-top-style': "wst-box-secondary-border-top-style";
685
+ readonly 'wst-box-secondary-border-bottom-style': "wst-box-secondary-border-bottom-style";
686
+ readonly 'wst-box-secondary-border-top-left-radius': "wst-box-secondary-border-top-left-radius";
687
+ readonly 'wst-box-secondary-border-top-right-radius': "wst-box-secondary-border-top-right-radius";
688
+ readonly 'wst-box-secondary-border-bottom-left-radius': "wst-box-secondary-border-bottom-left-radius";
689
+ readonly 'wst-box-secondary-border-bottom-right-radius': "wst-box-secondary-border-bottom-right-radius";
690
+ readonly 'wst-box-secondary-padding-bottom': "wst-box-secondary-padding-bottom";
691
+ readonly 'wst-box-secondary-padding-top': "wst-box-secondary-padding-top";
692
+ readonly 'wst-box-secondary-padding-left': "wst-box-secondary-padding-left";
693
+ readonly 'wst-box-secondary-padding-right': "wst-box-secondary-padding-right";
694
+ readonly 'wst-box-secondary-box-shadow': "wst-box-secondary-box-shadow";
695
+ readonly 'wst-box-primary-background-color': "wst-box-primary-background-color";
696
+ readonly 'wst-box-primary-border-left-color': "wst-box-primary-border-left-color";
697
+ readonly 'wst-box-primary-border-right-color': "wst-box-primary-border-right-color";
698
+ readonly 'wst-box-primary-border-top-color': "wst-box-primary-border-top-color";
699
+ readonly 'wst-box-primary-border-bottom-color': "wst-box-primary-border-bottom-color";
700
+ readonly 'wst-box-secondary-background-color': "wst-box-secondary-background-color";
701
+ readonly 'wst-box-secondary-border-left-color': "wst-box-secondary-border-left-color";
702
+ readonly 'wst-box-secondary-border-right-color': "wst-box-secondary-border-right-color";
703
+ readonly 'wst-box-secondary-border-top-color': "wst-box-secondary-border-top-color";
704
+ readonly 'wst-box-secondary-border-bottom-color': "wst-box-secondary-border-bottom-color";
705
+ };
706
+
662
707
  declare enum BreakpointEnumBreakpoint {
663
708
  UNKNOWN_Breakpoint = "UNKNOWN_Breakpoint",
664
709
  /** Represents the small (mobile) breakpoint */
@@ -674,6 +719,123 @@ declare interface BreakpointPresetStyleOverrides {
674
719
  small?: PresetStyleOverrides;
675
720
  }
676
721
 
722
+ export declare const ButtonVariableNames: {
723
+ readonly 'wst-button-primary-background-image': "wst-button-primary-background-image";
724
+ readonly 'wst-button-secondary-background-image': "wst-button-secondary-background-image";
725
+ readonly 'wst-button-tertiary-background-image': "wst-button-tertiary-background-image";
726
+ readonly 'wst-button-primary-font': "wst-button-primary-font";
727
+ readonly 'wst-button-primary-font-family': "wst-button-primary-font-family";
728
+ readonly 'wst-button-primary-font-size': "wst-button-primary-font-size";
729
+ readonly 'wst-button-primary-font-style': "wst-button-primary-font-style";
730
+ readonly 'wst-button-primary-font-weight': "wst-button-primary-font-weight";
731
+ readonly 'wst-button-primary-text-decoration': "wst-button-primary-text-decoration";
732
+ readonly 'wst-button-primary-text-transform': "wst-button-primary-text-transform";
733
+ readonly 'wst-button-primary-letter-spacing': "wst-button-primary-letter-spacing";
734
+ readonly 'wst-button-primary-line-height': "wst-button-primary-line-height";
735
+ readonly 'wst-button-primary-text-shadow': "wst-button-primary-text-shadow";
736
+ readonly 'wst-button-primary-box-shadow': "wst-button-primary-box-shadow";
737
+ readonly 'wst-button-primary-border-left-width': "wst-button-primary-border-left-width";
738
+ readonly 'wst-button-primary-border-right-width': "wst-button-primary-border-right-width";
739
+ readonly 'wst-button-primary-border-top-width': "wst-button-primary-border-top-width";
740
+ readonly 'wst-button-primary-border-bottom-width': "wst-button-primary-border-bottom-width";
741
+ readonly 'wst-button-primary-border-left-style': "wst-button-primary-border-left-style";
742
+ readonly 'wst-button-primary-border-right-style': "wst-button-primary-border-right-style";
743
+ readonly 'wst-button-primary-border-top-style': "wst-button-primary-border-top-style";
744
+ readonly 'wst-button-primary-border-bottom-style': "wst-button-primary-border-bottom-style";
745
+ readonly 'wst-button-primary-padding-bottom': "wst-button-primary-padding-bottom";
746
+ readonly 'wst-button-primary-padding-top': "wst-button-primary-padding-top";
747
+ readonly 'wst-button-primary-padding-left': "wst-button-primary-padding-left";
748
+ readonly 'wst-button-primary-padding-right': "wst-button-primary-padding-right";
749
+ readonly 'wst-button-primary-border-top-left-radius': "wst-button-primary-border-top-left-radius";
750
+ readonly 'wst-button-primary-border-top-right-radius': "wst-button-primary-border-top-right-radius";
751
+ readonly 'wst-button-primary-border-bottom-left-radius': "wst-button-primary-border-bottom-left-radius";
752
+ readonly 'wst-button-primary-border-bottom-right-radius': "wst-button-primary-border-bottom-right-radius";
753
+ readonly 'wst-button-primary-column-gap': "wst-button-primary-column-gap";
754
+ readonly 'wst-button-primary-row-gap': "wst-button-primary-row-gap";
755
+ readonly 'wst-button-primary-justify-content': "wst-button-primary-justify-content";
756
+ readonly 'wst-button-secondary-font': "wst-button-secondary-font";
757
+ readonly 'wst-button-secondary-font-family': "wst-button-secondary-font-family";
758
+ readonly 'wst-button-secondary-font-size': "wst-button-secondary-font-size";
759
+ readonly 'wst-button-secondary-font-style': "wst-button-secondary-font-style";
760
+ readonly 'wst-button-secondary-font-weight': "wst-button-secondary-font-weight";
761
+ readonly 'wst-button-secondary-text-decoration': "wst-button-secondary-text-decoration";
762
+ readonly 'wst-button-secondary-text-transform': "wst-button-secondary-text-transform";
763
+ readonly 'wst-button-secondary-letter-spacing': "wst-button-secondary-letter-spacing";
764
+ readonly 'wst-button-secondary-line-height': "wst-button-secondary-line-height";
765
+ readonly 'wst-button-secondary-text-shadow': "wst-button-secondary-text-shadow";
766
+ readonly 'wst-button-secondary-box-shadow': "wst-button-secondary-box-shadow";
767
+ readonly 'wst-button-secondary-border-left-width': "wst-button-secondary-border-left-width";
768
+ readonly 'wst-button-secondary-border-right-width': "wst-button-secondary-border-right-width";
769
+ readonly 'wst-button-secondary-border-top-width': "wst-button-secondary-border-top-width";
770
+ readonly 'wst-button-secondary-border-bottom-width': "wst-button-secondary-border-bottom-width";
771
+ readonly 'wst-button-secondary-border-left-style': "wst-button-secondary-border-left-style";
772
+ readonly 'wst-button-secondary-border-right-style': "wst-button-secondary-border-right-style";
773
+ readonly 'wst-button-secondary-border-top-style': "wst-button-secondary-border-top-style";
774
+ readonly 'wst-button-secondary-border-bottom-style': "wst-button-secondary-border-bottom-style";
775
+ readonly 'wst-button-secondary-padding-bottom': "wst-button-secondary-padding-bottom";
776
+ readonly 'wst-button-secondary-padding-top': "wst-button-secondary-padding-top";
777
+ readonly 'wst-button-secondary-padding-left': "wst-button-secondary-padding-left";
778
+ readonly 'wst-button-secondary-padding-right': "wst-button-secondary-padding-right";
779
+ readonly 'wst-button-secondary-border-top-left-radius': "wst-button-secondary-border-top-left-radius";
780
+ readonly 'wst-button-secondary-border-top-right-radius': "wst-button-secondary-border-top-right-radius";
781
+ readonly 'wst-button-secondary-border-bottom-left-radius': "wst-button-secondary-border-bottom-left-radius";
782
+ readonly 'wst-button-secondary-border-bottom-right-radius': "wst-button-secondary-border-bottom-right-radius";
783
+ readonly 'wst-button-secondary-column-gap': "wst-button-secondary-column-gap";
784
+ readonly 'wst-button-secondary-row-gap': "wst-button-secondary-row-gap";
785
+ readonly 'wst-button-secondary-justify-content': "wst-button-secondary-justify-content";
786
+ readonly 'wst-button-tertiary-font': "wst-button-tertiary-font";
787
+ readonly 'wst-button-tertiary-font-family': "wst-button-tertiary-font-family";
788
+ readonly 'wst-button-tertiary-font-size': "wst-button-tertiary-font-size";
789
+ readonly 'wst-button-tertiary-font-style': "wst-button-tertiary-font-style";
790
+ readonly 'wst-button-tertiary-font-weight': "wst-button-tertiary-font-weight";
791
+ readonly 'wst-button-tertiary-text-decoration': "wst-button-tertiary-text-decoration";
792
+ readonly 'wst-button-tertiary-text-transform': "wst-button-tertiary-text-transform";
793
+ readonly 'wst-button-tertiary-letter-spacing': "wst-button-tertiary-letter-spacing";
794
+ readonly 'wst-button-tertiary-line-height': "wst-button-tertiary-line-height";
795
+ readonly 'wst-button-tertiary-text-shadow': "wst-button-tertiary-text-shadow";
796
+ readonly 'wst-button-tertiary-box-shadow': "wst-button-tertiary-box-shadow";
797
+ readonly 'wst-button-tertiary-border-left-width': "wst-button-tertiary-border-left-width";
798
+ readonly 'wst-button-tertiary-border-right-width': "wst-button-tertiary-border-right-width";
799
+ readonly 'wst-button-tertiary-border-top-width': "wst-button-tertiary-border-top-width";
800
+ readonly 'wst-button-tertiary-border-bottom-width': "wst-button-tertiary-border-bottom-width";
801
+ readonly 'wst-button-tertiary-border-left-style': "wst-button-tertiary-border-left-style";
802
+ readonly 'wst-button-tertiary-border-right-style': "wst-button-tertiary-border-right-style";
803
+ readonly 'wst-button-tertiary-border-top-style': "wst-button-tertiary-border-top-style";
804
+ readonly 'wst-button-tertiary-border-bottom-style': "wst-button-tertiary-border-bottom-style";
805
+ readonly 'wst-button-tertiary-padding-bottom': "wst-button-tertiary-padding-bottom";
806
+ readonly 'wst-button-tertiary-padding-top': "wst-button-tertiary-padding-top";
807
+ readonly 'wst-button-tertiary-padding-left': "wst-button-tertiary-padding-left";
808
+ readonly 'wst-button-tertiary-padding-right': "wst-button-tertiary-padding-right";
809
+ readonly 'wst-button-tertiary-border-top-left-radius': "wst-button-tertiary-border-top-left-radius";
810
+ readonly 'wst-button-tertiary-border-top-right-radius': "wst-button-tertiary-border-top-right-radius";
811
+ readonly 'wst-button-tertiary-border-bottom-left-radius': "wst-button-tertiary-border-bottom-left-radius";
812
+ readonly 'wst-button-tertiary-border-bottom-right-radius': "wst-button-tertiary-border-bottom-right-radius";
813
+ readonly 'wst-button-tertiary-column-gap': "wst-button-tertiary-column-gap";
814
+ readonly 'wst-button-tertiary-row-gap': "wst-button-tertiary-row-gap";
815
+ readonly 'wst-button-tertiary-justify-content': "wst-button-tertiary-justify-content";
816
+ readonly 'wst-button-primary-background-color': "wst-button-primary-background-color";
817
+ readonly 'wst-button-primary-border-left-color': "wst-button-primary-border-left-color";
818
+ readonly 'wst-button-primary-border-right-color': "wst-button-primary-border-right-color";
819
+ readonly 'wst-button-primary-border-top-color': "wst-button-primary-border-top-color";
820
+ readonly 'wst-button-primary-border-bottom-color': "wst-button-primary-border-bottom-color";
821
+ readonly 'wst-button-primary-color': "wst-button-primary-color";
822
+ readonly 'wst-button-primary-text-highlight': "wst-button-primary-text-highlight";
823
+ readonly 'wst-button-secondary-background-color': "wst-button-secondary-background-color";
824
+ readonly 'wst-button-secondary-border-left-color': "wst-button-secondary-border-left-color";
825
+ readonly 'wst-button-secondary-border-right-color': "wst-button-secondary-border-right-color";
826
+ readonly 'wst-button-secondary-border-top-color': "wst-button-secondary-border-top-color";
827
+ readonly 'wst-button-secondary-border-bottom-color': "wst-button-secondary-border-bottom-color";
828
+ readonly 'wst-button-secondary-color': "wst-button-secondary-color";
829
+ readonly 'wst-button-secondary-text-highlight': "wst-button-secondary-text-highlight";
830
+ readonly 'wst-button-tertiary-background-color': "wst-button-tertiary-background-color";
831
+ readonly 'wst-button-tertiary-border-left-color': "wst-button-tertiary-border-left-color";
832
+ readonly 'wst-button-tertiary-border-right-color': "wst-button-tertiary-border-right-color";
833
+ readonly 'wst-button-tertiary-border-top-color': "wst-button-tertiary-border-top-color";
834
+ readonly 'wst-button-tertiary-border-bottom-color': "wst-button-tertiary-border-bottom-color";
835
+ readonly 'wst-button-tertiary-color': "wst-button-tertiary-color";
836
+ readonly 'wst-button-tertiary-text-highlight': "wst-button-tertiary-text-highlight";
837
+ };
838
+
677
839
  declare interface ClientResources {
678
840
  /**
679
841
  * A URL to an ESM javascript bundle. It's default export should be the component
@@ -717,6 +879,29 @@ declare interface CodePanel {
717
879
  cssUrl?: string | null;
718
880
  }
719
881
 
882
+ export declare const ColorVariableNames: {
883
+ readonly 'wst-primary-background-color': "wst-primary-background-color";
884
+ readonly 'wst-secondary-background-color': "wst-secondary-background-color";
885
+ readonly 'wst-links-and-actions-color': "wst-links-and-actions-color";
886
+ readonly 'wst-graphics-1-color': "wst-graphics-1-color";
887
+ readonly 'wst-graphics-2-color': "wst-graphics-2-color";
888
+ readonly 'wst-system-success-color': "wst-system-success-color";
889
+ readonly 'wst-system-error-color': "wst-system-error-color";
890
+ readonly 'wst-system-alert-color': "wst-system-alert-color";
891
+ readonly 'wst-system-disabled-color': "wst-system-disabled-color";
892
+ readonly 'wst-system-default-dark-color': "wst-system-default-dark-color";
893
+ readonly 'wst-system-default-light-color': "wst-system-default-light-color";
894
+ readonly 'wst-base-1-color': "wst-base-1-color";
895
+ readonly 'wst-base-2-color': "wst-base-2-color";
896
+ readonly 'wst-shade-1-color': "wst-shade-1-color";
897
+ readonly 'wst-shade-2-color': "wst-shade-2-color";
898
+ readonly 'wst-shade-3-color': "wst-shade-3-color";
899
+ readonly 'wst-accent-1-color': "wst-accent-1-color";
900
+ readonly 'wst-accent-2-color': "wst-accent-2-color";
901
+ readonly 'wst-accent-3-color': "wst-accent-3-color";
902
+ readonly 'wst-accent-4-color': "wst-accent-4-color";
903
+ };
904
+
720
905
  export declare interface ComponentInitialSize {
721
906
  /** The component initial width setting */
722
907
  width?: InitialSizeSetting;
@@ -2747,6 +2932,13 @@ export declare const LAYOUT: {
2747
2932
  BREAKPOINT: typeof BreakpointEnumBreakpoint;
2748
2933
  };
2749
2934
 
2935
+ export declare const LineVariableNames: {
2936
+ readonly 'wst-system-line-1-width': "wst-system-line-1-width";
2937
+ readonly 'wst-system-line-2-width': "wst-system-line-2-width";
2938
+ readonly 'wst-system-line-1-color': "wst-system-line-1-color";
2939
+ readonly 'wst-system-line-2-color': "wst-system-line-2-color";
2940
+ };
2941
+
2750
2942
  export declare interface Link {
2751
2943
  /**
2752
2944
  * A collection of possible link types that the component supports. Only one of the types will make it to the component after input.
@@ -3819,6 +4011,27 @@ export declare interface TextGroup {
3819
4011
  a11y?: string | null;
3820
4012
  }
3821
4013
 
4014
+ export declare const TextVariableNames: {
4015
+ readonly 'wst-heading-1-font': "wst-heading-1-font";
4016
+ readonly 'wst-heading-2-font': "wst-heading-2-font";
4017
+ readonly 'wst-heading-3-font': "wst-heading-3-font";
4018
+ readonly 'wst-heading-4-font': "wst-heading-4-font";
4019
+ readonly 'wst-heading-5-font': "wst-heading-5-font";
4020
+ readonly 'wst-heading-6-font': "wst-heading-6-font";
4021
+ readonly 'wst-paragraph-1-font': "wst-paragraph-1-font";
4022
+ readonly 'wst-paragraph-2-font': "wst-paragraph-2-font";
4023
+ readonly 'wst-paragraph-3-font': "wst-paragraph-3-font";
4024
+ readonly 'wst-heading-1-color': "wst-heading-1-color";
4025
+ readonly 'wst-heading-2-color': "wst-heading-2-color";
4026
+ readonly 'wst-heading-3-color': "wst-heading-3-color";
4027
+ readonly 'wst-heading-4-color': "wst-heading-4-color";
4028
+ readonly 'wst-heading-5-color': "wst-heading-5-color";
4029
+ readonly 'wst-heading-6-color': "wst-heading-6-color";
4030
+ readonly 'wst-paragraph-1-color': "wst-paragraph-1-color";
4031
+ readonly 'wst-paragraph-2-color': "wst-paragraph-2-color";
4032
+ readonly 'wst-paragraph-3-color': "wst-paragraph-3-color";
4033
+ };
4034
+
3822
4035
  declare interface TranslationResources {
3823
4036
  /**
3824
4037
  * The URL that we will add the language to for fetching translations, example: \`https://somecdn.com/translations/\`
@@ -3909,6 +4122,207 @@ export declare interface VisibleState {
3909
4122
  elementPath?: string;
3910
4123
  }
3911
4124
 
4125
+ export declare const WixThemeVariableNames: {
4126
+ 'wst-system-line-1-width': "wst-system-line-1-width";
4127
+ 'wst-system-line-2-width': "wst-system-line-2-width";
4128
+ 'wst-system-line-1-color': "wst-system-line-1-color";
4129
+ 'wst-system-line-2-color': "wst-system-line-2-color";
4130
+ 'wst-box-primary-background-image': "wst-box-primary-background-image";
4131
+ 'wst-box-secondary-background-image': "wst-box-secondary-background-image";
4132
+ 'wst-box-primary-border-left-width': "wst-box-primary-border-left-width";
4133
+ 'wst-box-primary-border-right-width': "wst-box-primary-border-right-width";
4134
+ 'wst-box-primary-border-top-width': "wst-box-primary-border-top-width";
4135
+ 'wst-box-primary-border-bottom-width': "wst-box-primary-border-bottom-width";
4136
+ 'wst-box-primary-border-left-style': "wst-box-primary-border-left-style";
4137
+ 'wst-box-primary-border-right-style': "wst-box-primary-border-right-style";
4138
+ 'wst-box-primary-border-top-style': "wst-box-primary-border-top-style";
4139
+ 'wst-box-primary-border-bottom-style': "wst-box-primary-border-bottom-style";
4140
+ 'wst-box-primary-border-top-left-radius': "wst-box-primary-border-top-left-radius";
4141
+ 'wst-box-primary-border-top-right-radius': "wst-box-primary-border-top-right-radius";
4142
+ 'wst-box-primary-border-bottom-left-radius': "wst-box-primary-border-bottom-left-radius";
4143
+ 'wst-box-primary-border-bottom-right-radius': "wst-box-primary-border-bottom-right-radius";
4144
+ 'wst-box-primary-box-shadow': "wst-box-primary-box-shadow";
4145
+ 'wst-box-secondary-border-left-width': "wst-box-secondary-border-left-width";
4146
+ 'wst-box-secondary-border-right-width': "wst-box-secondary-border-right-width";
4147
+ 'wst-box-secondary-border-top-width': "wst-box-secondary-border-top-width";
4148
+ 'wst-box-secondary-border-bottom-width': "wst-box-secondary-border-bottom-width";
4149
+ 'wst-box-secondary-border-left-style': "wst-box-secondary-border-left-style";
4150
+ 'wst-box-secondary-border-right-style': "wst-box-secondary-border-right-style";
4151
+ 'wst-box-secondary-border-top-style': "wst-box-secondary-border-top-style";
4152
+ 'wst-box-secondary-border-bottom-style': "wst-box-secondary-border-bottom-style";
4153
+ 'wst-box-secondary-border-top-left-radius': "wst-box-secondary-border-top-left-radius";
4154
+ 'wst-box-secondary-border-top-right-radius': "wst-box-secondary-border-top-right-radius";
4155
+ 'wst-box-secondary-border-bottom-left-radius': "wst-box-secondary-border-bottom-left-radius";
4156
+ 'wst-box-secondary-border-bottom-right-radius': "wst-box-secondary-border-bottom-right-radius";
4157
+ 'wst-box-secondary-padding-bottom': "wst-box-secondary-padding-bottom";
4158
+ 'wst-box-secondary-padding-top': "wst-box-secondary-padding-top";
4159
+ 'wst-box-secondary-padding-left': "wst-box-secondary-padding-left";
4160
+ 'wst-box-secondary-padding-right': "wst-box-secondary-padding-right";
4161
+ 'wst-box-secondary-box-shadow': "wst-box-secondary-box-shadow";
4162
+ 'wst-box-primary-background-color': "wst-box-primary-background-color";
4163
+ 'wst-box-primary-border-left-color': "wst-box-primary-border-left-color";
4164
+ 'wst-box-primary-border-right-color': "wst-box-primary-border-right-color";
4165
+ 'wst-box-primary-border-top-color': "wst-box-primary-border-top-color";
4166
+ 'wst-box-primary-border-bottom-color': "wst-box-primary-border-bottom-color";
4167
+ 'wst-box-secondary-background-color': "wst-box-secondary-background-color";
4168
+ 'wst-box-secondary-border-left-color': "wst-box-secondary-border-left-color";
4169
+ 'wst-box-secondary-border-right-color': "wst-box-secondary-border-right-color";
4170
+ 'wst-box-secondary-border-top-color': "wst-box-secondary-border-top-color";
4171
+ 'wst-box-secondary-border-bottom-color': "wst-box-secondary-border-bottom-color";
4172
+ 'wst-button-primary-background-image': "wst-button-primary-background-image";
4173
+ 'wst-button-secondary-background-image': "wst-button-secondary-background-image";
4174
+ 'wst-button-tertiary-background-image': "wst-button-tertiary-background-image";
4175
+ 'wst-button-primary-font': "wst-button-primary-font";
4176
+ 'wst-button-primary-font-family': "wst-button-primary-font-family";
4177
+ 'wst-button-primary-font-size': "wst-button-primary-font-size";
4178
+ 'wst-button-primary-font-style': "wst-button-primary-font-style";
4179
+ 'wst-button-primary-font-weight': "wst-button-primary-font-weight";
4180
+ 'wst-button-primary-text-decoration': "wst-button-primary-text-decoration";
4181
+ 'wst-button-primary-text-transform': "wst-button-primary-text-transform";
4182
+ 'wst-button-primary-letter-spacing': "wst-button-primary-letter-spacing";
4183
+ 'wst-button-primary-line-height': "wst-button-primary-line-height";
4184
+ 'wst-button-primary-text-shadow': "wst-button-primary-text-shadow";
4185
+ 'wst-button-primary-box-shadow': "wst-button-primary-box-shadow";
4186
+ 'wst-button-primary-border-left-width': "wst-button-primary-border-left-width";
4187
+ 'wst-button-primary-border-right-width': "wst-button-primary-border-right-width";
4188
+ 'wst-button-primary-border-top-width': "wst-button-primary-border-top-width";
4189
+ 'wst-button-primary-border-bottom-width': "wst-button-primary-border-bottom-width";
4190
+ 'wst-button-primary-border-left-style': "wst-button-primary-border-left-style";
4191
+ 'wst-button-primary-border-right-style': "wst-button-primary-border-right-style";
4192
+ 'wst-button-primary-border-top-style': "wst-button-primary-border-top-style";
4193
+ 'wst-button-primary-border-bottom-style': "wst-button-primary-border-bottom-style";
4194
+ 'wst-button-primary-padding-bottom': "wst-button-primary-padding-bottom";
4195
+ 'wst-button-primary-padding-top': "wst-button-primary-padding-top";
4196
+ 'wst-button-primary-padding-left': "wst-button-primary-padding-left";
4197
+ 'wst-button-primary-padding-right': "wst-button-primary-padding-right";
4198
+ 'wst-button-primary-border-top-left-radius': "wst-button-primary-border-top-left-radius";
4199
+ 'wst-button-primary-border-top-right-radius': "wst-button-primary-border-top-right-radius";
4200
+ 'wst-button-primary-border-bottom-left-radius': "wst-button-primary-border-bottom-left-radius";
4201
+ 'wst-button-primary-border-bottom-right-radius': "wst-button-primary-border-bottom-right-radius";
4202
+ 'wst-button-primary-column-gap': "wst-button-primary-column-gap";
4203
+ 'wst-button-primary-row-gap': "wst-button-primary-row-gap";
4204
+ 'wst-button-primary-justify-content': "wst-button-primary-justify-content";
4205
+ 'wst-button-secondary-font': "wst-button-secondary-font";
4206
+ 'wst-button-secondary-font-family': "wst-button-secondary-font-family";
4207
+ 'wst-button-secondary-font-size': "wst-button-secondary-font-size";
4208
+ 'wst-button-secondary-font-style': "wst-button-secondary-font-style";
4209
+ 'wst-button-secondary-font-weight': "wst-button-secondary-font-weight";
4210
+ 'wst-button-secondary-text-decoration': "wst-button-secondary-text-decoration";
4211
+ 'wst-button-secondary-text-transform': "wst-button-secondary-text-transform";
4212
+ 'wst-button-secondary-letter-spacing': "wst-button-secondary-letter-spacing";
4213
+ 'wst-button-secondary-line-height': "wst-button-secondary-line-height";
4214
+ 'wst-button-secondary-text-shadow': "wst-button-secondary-text-shadow";
4215
+ 'wst-button-secondary-box-shadow': "wst-button-secondary-box-shadow";
4216
+ 'wst-button-secondary-border-left-width': "wst-button-secondary-border-left-width";
4217
+ 'wst-button-secondary-border-right-width': "wst-button-secondary-border-right-width";
4218
+ 'wst-button-secondary-border-top-width': "wst-button-secondary-border-top-width";
4219
+ 'wst-button-secondary-border-bottom-width': "wst-button-secondary-border-bottom-width";
4220
+ 'wst-button-secondary-border-left-style': "wst-button-secondary-border-left-style";
4221
+ 'wst-button-secondary-border-right-style': "wst-button-secondary-border-right-style";
4222
+ 'wst-button-secondary-border-top-style': "wst-button-secondary-border-top-style";
4223
+ 'wst-button-secondary-border-bottom-style': "wst-button-secondary-border-bottom-style";
4224
+ 'wst-button-secondary-padding-bottom': "wst-button-secondary-padding-bottom";
4225
+ 'wst-button-secondary-padding-top': "wst-button-secondary-padding-top";
4226
+ 'wst-button-secondary-padding-left': "wst-button-secondary-padding-left";
4227
+ 'wst-button-secondary-padding-right': "wst-button-secondary-padding-right";
4228
+ 'wst-button-secondary-border-top-left-radius': "wst-button-secondary-border-top-left-radius";
4229
+ 'wst-button-secondary-border-top-right-radius': "wst-button-secondary-border-top-right-radius";
4230
+ 'wst-button-secondary-border-bottom-left-radius': "wst-button-secondary-border-bottom-left-radius";
4231
+ 'wst-button-secondary-border-bottom-right-radius': "wst-button-secondary-border-bottom-right-radius";
4232
+ 'wst-button-secondary-column-gap': "wst-button-secondary-column-gap";
4233
+ 'wst-button-secondary-row-gap': "wst-button-secondary-row-gap";
4234
+ 'wst-button-secondary-justify-content': "wst-button-secondary-justify-content";
4235
+ 'wst-button-tertiary-font': "wst-button-tertiary-font";
4236
+ 'wst-button-tertiary-font-family': "wst-button-tertiary-font-family";
4237
+ 'wst-button-tertiary-font-size': "wst-button-tertiary-font-size";
4238
+ 'wst-button-tertiary-font-style': "wst-button-tertiary-font-style";
4239
+ 'wst-button-tertiary-font-weight': "wst-button-tertiary-font-weight";
4240
+ 'wst-button-tertiary-text-decoration': "wst-button-tertiary-text-decoration";
4241
+ 'wst-button-tertiary-text-transform': "wst-button-tertiary-text-transform";
4242
+ 'wst-button-tertiary-letter-spacing': "wst-button-tertiary-letter-spacing";
4243
+ 'wst-button-tertiary-line-height': "wst-button-tertiary-line-height";
4244
+ 'wst-button-tertiary-text-shadow': "wst-button-tertiary-text-shadow";
4245
+ 'wst-button-tertiary-box-shadow': "wst-button-tertiary-box-shadow";
4246
+ 'wst-button-tertiary-border-left-width': "wst-button-tertiary-border-left-width";
4247
+ 'wst-button-tertiary-border-right-width': "wst-button-tertiary-border-right-width";
4248
+ 'wst-button-tertiary-border-top-width': "wst-button-tertiary-border-top-width";
4249
+ 'wst-button-tertiary-border-bottom-width': "wst-button-tertiary-border-bottom-width";
4250
+ 'wst-button-tertiary-border-left-style': "wst-button-tertiary-border-left-style";
4251
+ 'wst-button-tertiary-border-right-style': "wst-button-tertiary-border-right-style";
4252
+ 'wst-button-tertiary-border-top-style': "wst-button-tertiary-border-top-style";
4253
+ 'wst-button-tertiary-border-bottom-style': "wst-button-tertiary-border-bottom-style";
4254
+ 'wst-button-tertiary-padding-bottom': "wst-button-tertiary-padding-bottom";
4255
+ 'wst-button-tertiary-padding-top': "wst-button-tertiary-padding-top";
4256
+ 'wst-button-tertiary-padding-left': "wst-button-tertiary-padding-left";
4257
+ 'wst-button-tertiary-padding-right': "wst-button-tertiary-padding-right";
4258
+ 'wst-button-tertiary-border-top-left-radius': "wst-button-tertiary-border-top-left-radius";
4259
+ 'wst-button-tertiary-border-top-right-radius': "wst-button-tertiary-border-top-right-radius";
4260
+ 'wst-button-tertiary-border-bottom-left-radius': "wst-button-tertiary-border-bottom-left-radius";
4261
+ 'wst-button-tertiary-border-bottom-right-radius': "wst-button-tertiary-border-bottom-right-radius";
4262
+ 'wst-button-tertiary-column-gap': "wst-button-tertiary-column-gap";
4263
+ 'wst-button-tertiary-row-gap': "wst-button-tertiary-row-gap";
4264
+ 'wst-button-tertiary-justify-content': "wst-button-tertiary-justify-content";
4265
+ 'wst-button-primary-background-color': "wst-button-primary-background-color";
4266
+ 'wst-button-primary-border-left-color': "wst-button-primary-border-left-color";
4267
+ 'wst-button-primary-border-right-color': "wst-button-primary-border-right-color";
4268
+ 'wst-button-primary-border-top-color': "wst-button-primary-border-top-color";
4269
+ 'wst-button-primary-border-bottom-color': "wst-button-primary-border-bottom-color";
4270
+ 'wst-button-primary-color': "wst-button-primary-color";
4271
+ 'wst-button-primary-text-highlight': "wst-button-primary-text-highlight";
4272
+ 'wst-button-secondary-background-color': "wst-button-secondary-background-color";
4273
+ 'wst-button-secondary-border-left-color': "wst-button-secondary-border-left-color";
4274
+ 'wst-button-secondary-border-right-color': "wst-button-secondary-border-right-color";
4275
+ 'wst-button-secondary-border-top-color': "wst-button-secondary-border-top-color";
4276
+ 'wst-button-secondary-border-bottom-color': "wst-button-secondary-border-bottom-color";
4277
+ 'wst-button-secondary-color': "wst-button-secondary-color";
4278
+ 'wst-button-secondary-text-highlight': "wst-button-secondary-text-highlight";
4279
+ 'wst-button-tertiary-background-color': "wst-button-tertiary-background-color";
4280
+ 'wst-button-tertiary-border-left-color': "wst-button-tertiary-border-left-color";
4281
+ 'wst-button-tertiary-border-right-color': "wst-button-tertiary-border-right-color";
4282
+ 'wst-button-tertiary-border-top-color': "wst-button-tertiary-border-top-color";
4283
+ 'wst-button-tertiary-border-bottom-color': "wst-button-tertiary-border-bottom-color";
4284
+ 'wst-button-tertiary-color': "wst-button-tertiary-color";
4285
+ 'wst-button-tertiary-text-highlight': "wst-button-tertiary-text-highlight";
4286
+ 'wst-heading-1-font': "wst-heading-1-font";
4287
+ 'wst-heading-2-font': "wst-heading-2-font";
4288
+ 'wst-heading-3-font': "wst-heading-3-font";
4289
+ 'wst-heading-4-font': "wst-heading-4-font";
4290
+ 'wst-heading-5-font': "wst-heading-5-font";
4291
+ 'wst-heading-6-font': "wst-heading-6-font";
4292
+ 'wst-paragraph-1-font': "wst-paragraph-1-font";
4293
+ 'wst-paragraph-2-font': "wst-paragraph-2-font";
4294
+ 'wst-paragraph-3-font': "wst-paragraph-3-font";
4295
+ 'wst-heading-1-color': "wst-heading-1-color";
4296
+ 'wst-heading-2-color': "wst-heading-2-color";
4297
+ 'wst-heading-3-color': "wst-heading-3-color";
4298
+ 'wst-heading-4-color': "wst-heading-4-color";
4299
+ 'wst-heading-5-color': "wst-heading-5-color";
4300
+ 'wst-heading-6-color': "wst-heading-6-color";
4301
+ 'wst-paragraph-1-color': "wst-paragraph-1-color";
4302
+ 'wst-paragraph-2-color': "wst-paragraph-2-color";
4303
+ 'wst-paragraph-3-color': "wst-paragraph-3-color";
4304
+ 'wst-primary-background-color': "wst-primary-background-color";
4305
+ 'wst-secondary-background-color': "wst-secondary-background-color";
4306
+ 'wst-links-and-actions-color': "wst-links-and-actions-color";
4307
+ 'wst-graphics-1-color': "wst-graphics-1-color";
4308
+ 'wst-graphics-2-color': "wst-graphics-2-color";
4309
+ 'wst-system-success-color': "wst-system-success-color";
4310
+ 'wst-system-error-color': "wst-system-error-color";
4311
+ 'wst-system-alert-color': "wst-system-alert-color";
4312
+ 'wst-system-disabled-color': "wst-system-disabled-color";
4313
+ 'wst-system-default-dark-color': "wst-system-default-dark-color";
4314
+ 'wst-system-default-light-color': "wst-system-default-light-color";
4315
+ 'wst-base-1-color': "wst-base-1-color";
4316
+ 'wst-base-2-color': "wst-base-2-color";
4317
+ 'wst-shade-1-color': "wst-shade-1-color";
4318
+ 'wst-shade-2-color': "wst-shade-2-color";
4319
+ 'wst-shade-3-color': "wst-shade-3-color";
4320
+ 'wst-accent-1-color': "wst-accent-1-color";
4321
+ 'wst-accent-2-color': "wst-accent-2-color";
4322
+ 'wst-accent-3-color': "wst-accent-3-color";
4323
+ 'wst-accent-4-color': "wst-accent-4-color";
4324
+ };
4325
+
3912
4326
  export declare interface WritingMode {
3913
4327
  /**
3914
4328
  * list of writing-mode values in case we want to reduce the abilities exposed to the User
@@ -4472,6 +4886,236 @@ var MEDIA = {
4472
4886
  VECTOR_ART_CATEGORY: VectorArtCategoryTypes,
4473
4887
  IMAGE_CATEGORY: ImageCategoryTypes
4474
4888
  };
4889
+ const BoxColorVariableNames = {
4890
+ "wst-box-primary-background-color": "wst-box-primary-background-color",
4891
+ "wst-box-primary-border-left-color": "wst-box-primary-border-left-color",
4892
+ "wst-box-primary-border-right-color": "wst-box-primary-border-right-color",
4893
+ "wst-box-primary-border-top-color": "wst-box-primary-border-top-color",
4894
+ "wst-box-primary-border-bottom-color": "wst-box-primary-border-bottom-color",
4895
+ "wst-box-secondary-background-color": "wst-box-secondary-background-color",
4896
+ "wst-box-secondary-border-left-color": "wst-box-secondary-border-left-color",
4897
+ "wst-box-secondary-border-right-color": "wst-box-secondary-border-right-color",
4898
+ "wst-box-secondary-border-top-color": "wst-box-secondary-border-top-color",
4899
+ "wst-box-secondary-border-bottom-color": "wst-box-secondary-border-bottom-color"
4900
+ };
4901
+ const BoxVariableNames = {
4902
+ ...BoxColorVariableNames,
4903
+ "wst-box-primary-background-image": "wst-box-primary-background-image",
4904
+ "wst-box-secondary-background-image": "wst-box-secondary-background-image",
4905
+ "wst-box-primary-border-left-width": "wst-box-primary-border-left-width",
4906
+ "wst-box-primary-border-right-width": "wst-box-primary-border-right-width",
4907
+ "wst-box-primary-border-top-width": "wst-box-primary-border-top-width",
4908
+ "wst-box-primary-border-bottom-width": "wst-box-primary-border-bottom-width",
4909
+ "wst-box-primary-border-left-style": "wst-box-primary-border-left-style",
4910
+ "wst-box-primary-border-right-style": "wst-box-primary-border-right-style",
4911
+ "wst-box-primary-border-top-style": "wst-box-primary-border-top-style",
4912
+ "wst-box-primary-border-bottom-style": "wst-box-primary-border-bottom-style",
4913
+ "wst-box-primary-border-top-left-radius": "wst-box-primary-border-top-left-radius",
4914
+ "wst-box-primary-border-top-right-radius": "wst-box-primary-border-top-right-radius",
4915
+ "wst-box-primary-border-bottom-left-radius": "wst-box-primary-border-bottom-left-radius",
4916
+ "wst-box-primary-border-bottom-right-radius": "wst-box-primary-border-bottom-right-radius",
4917
+ "wst-box-primary-box-shadow": "wst-box-primary-box-shadow",
4918
+ "wst-box-secondary-border-left-width": "wst-box-secondary-border-left-width",
4919
+ "wst-box-secondary-border-right-width": "wst-box-secondary-border-right-width",
4920
+ "wst-box-secondary-border-top-width": "wst-box-secondary-border-top-width",
4921
+ "wst-box-secondary-border-bottom-width": "wst-box-secondary-border-bottom-width",
4922
+ "wst-box-secondary-border-left-style": "wst-box-secondary-border-left-style",
4923
+ "wst-box-secondary-border-right-style": "wst-box-secondary-border-right-style",
4924
+ "wst-box-secondary-border-top-style": "wst-box-secondary-border-top-style",
4925
+ "wst-box-secondary-border-bottom-style": "wst-box-secondary-border-bottom-style",
4926
+ "wst-box-secondary-border-top-left-radius": "wst-box-secondary-border-top-left-radius",
4927
+ "wst-box-secondary-border-top-right-radius": "wst-box-secondary-border-top-right-radius",
4928
+ "wst-box-secondary-border-bottom-left-radius": "wst-box-secondary-border-bottom-left-radius",
4929
+ "wst-box-secondary-border-bottom-right-radius": "wst-box-secondary-border-bottom-right-radius",
4930
+ "wst-box-secondary-padding-bottom": "wst-box-secondary-padding-bottom",
4931
+ "wst-box-secondary-padding-top": "wst-box-secondary-padding-top",
4932
+ "wst-box-secondary-padding-left": "wst-box-secondary-padding-left",
4933
+ "wst-box-secondary-padding-right": "wst-box-secondary-padding-right",
4934
+ "wst-box-secondary-box-shadow": "wst-box-secondary-box-shadow"
4935
+ };
4936
+ const ButtonColorVariableNames = {
4937
+ "wst-button-primary-background-color": "wst-button-primary-background-color",
4938
+ "wst-button-primary-border-left-color": "wst-button-primary-border-left-color",
4939
+ "wst-button-primary-border-right-color": "wst-button-primary-border-right-color",
4940
+ "wst-button-primary-border-top-color": "wst-button-primary-border-top-color",
4941
+ "wst-button-primary-border-bottom-color": "wst-button-primary-border-bottom-color",
4942
+ "wst-button-primary-color": "wst-button-primary-color",
4943
+ "wst-button-primary-text-highlight": "wst-button-primary-text-highlight",
4944
+ "wst-button-secondary-background-color": "wst-button-secondary-background-color",
4945
+ "wst-button-secondary-border-left-color": "wst-button-secondary-border-left-color",
4946
+ "wst-button-secondary-border-right-color": "wst-button-secondary-border-right-color",
4947
+ "wst-button-secondary-border-top-color": "wst-button-secondary-border-top-color",
4948
+ "wst-button-secondary-border-bottom-color": "wst-button-secondary-border-bottom-color",
4949
+ "wst-button-secondary-color": "wst-button-secondary-color",
4950
+ "wst-button-secondary-text-highlight": "wst-button-secondary-text-highlight",
4951
+ "wst-button-tertiary-background-color": "wst-button-tertiary-background-color",
4952
+ "wst-button-tertiary-border-left-color": "wst-button-tertiary-border-left-color",
4953
+ "wst-button-tertiary-border-right-color": "wst-button-tertiary-border-right-color",
4954
+ "wst-button-tertiary-border-top-color": "wst-button-tertiary-border-top-color",
4955
+ "wst-button-tertiary-border-bottom-color": "wst-button-tertiary-border-bottom-color",
4956
+ "wst-button-tertiary-color": "wst-button-tertiary-color",
4957
+ "wst-button-tertiary-text-highlight": "wst-button-tertiary-text-highlight"
4958
+ };
4959
+ const ButtonVariableNames = {
4960
+ ...ButtonColorVariableNames,
4961
+ "wst-button-primary-background-image": "wst-button-primary-background-image",
4962
+ "wst-button-secondary-background-image": "wst-button-secondary-background-image",
4963
+ "wst-button-tertiary-background-image": "wst-button-tertiary-background-image",
4964
+ "wst-button-primary-font": "wst-button-primary-font",
4965
+ "wst-button-primary-font-family": "wst-button-primary-font-family",
4966
+ "wst-button-primary-font-size": "wst-button-primary-font-size",
4967
+ "wst-button-primary-font-style": "wst-button-primary-font-style",
4968
+ "wst-button-primary-font-weight": "wst-button-primary-font-weight",
4969
+ "wst-button-primary-text-decoration": "wst-button-primary-text-decoration",
4970
+ "wst-button-primary-text-transform": "wst-button-primary-text-transform",
4971
+ "wst-button-primary-letter-spacing": "wst-button-primary-letter-spacing",
4972
+ "wst-button-primary-line-height": "wst-button-primary-line-height",
4973
+ "wst-button-primary-text-shadow": "wst-button-primary-text-shadow",
4974
+ "wst-button-primary-box-shadow": "wst-button-primary-box-shadow",
4975
+ "wst-button-primary-border-left-width": "wst-button-primary-border-left-width",
4976
+ "wst-button-primary-border-right-width": "wst-button-primary-border-right-width",
4977
+ "wst-button-primary-border-top-width": "wst-button-primary-border-top-width",
4978
+ "wst-button-primary-border-bottom-width": "wst-button-primary-border-bottom-width",
4979
+ "wst-button-primary-border-left-style": "wst-button-primary-border-left-style",
4980
+ "wst-button-primary-border-right-style": "wst-button-primary-border-right-style",
4981
+ "wst-button-primary-border-top-style": "wst-button-primary-border-top-style",
4982
+ "wst-button-primary-border-bottom-style": "wst-button-primary-border-bottom-style",
4983
+ "wst-button-primary-padding-bottom": "wst-button-primary-padding-bottom",
4984
+ "wst-button-primary-padding-top": "wst-button-primary-padding-top",
4985
+ "wst-button-primary-padding-left": "wst-button-primary-padding-left",
4986
+ "wst-button-primary-padding-right": "wst-button-primary-padding-right",
4987
+ "wst-button-primary-border-top-left-radius": "wst-button-primary-border-top-left-radius",
4988
+ "wst-button-primary-border-top-right-radius": "wst-button-primary-border-top-right-radius",
4989
+ "wst-button-primary-border-bottom-left-radius": "wst-button-primary-border-bottom-left-radius",
4990
+ "wst-button-primary-border-bottom-right-radius": "wst-button-primary-border-bottom-right-radius",
4991
+ "wst-button-primary-column-gap": "wst-button-primary-column-gap",
4992
+ "wst-button-primary-row-gap": "wst-button-primary-row-gap",
4993
+ "wst-button-primary-justify-content": "wst-button-primary-justify-content",
4994
+ "wst-button-secondary-font": "wst-button-secondary-font",
4995
+ "wst-button-secondary-font-family": "wst-button-secondary-font-family",
4996
+ "wst-button-secondary-font-size": "wst-button-secondary-font-size",
4997
+ "wst-button-secondary-font-style": "wst-button-secondary-font-style",
4998
+ "wst-button-secondary-font-weight": "wst-button-secondary-font-weight",
4999
+ "wst-button-secondary-text-decoration": "wst-button-secondary-text-decoration",
5000
+ "wst-button-secondary-text-transform": "wst-button-secondary-text-transform",
5001
+ "wst-button-secondary-letter-spacing": "wst-button-secondary-letter-spacing",
5002
+ "wst-button-secondary-line-height": "wst-button-secondary-line-height",
5003
+ "wst-button-secondary-text-shadow": "wst-button-secondary-text-shadow",
5004
+ "wst-button-secondary-box-shadow": "wst-button-secondary-box-shadow",
5005
+ "wst-button-secondary-border-left-width": "wst-button-secondary-border-left-width",
5006
+ "wst-button-secondary-border-right-width": "wst-button-secondary-border-right-width",
5007
+ "wst-button-secondary-border-top-width": "wst-button-secondary-border-top-width",
5008
+ "wst-button-secondary-border-bottom-width": "wst-button-secondary-border-bottom-width",
5009
+ "wst-button-secondary-border-left-style": "wst-button-secondary-border-left-style",
5010
+ "wst-button-secondary-border-right-style": "wst-button-secondary-border-right-style",
5011
+ "wst-button-secondary-border-top-style": "wst-button-secondary-border-top-style",
5012
+ "wst-button-secondary-border-bottom-style": "wst-button-secondary-border-bottom-style",
5013
+ "wst-button-secondary-padding-bottom": "wst-button-secondary-padding-bottom",
5014
+ "wst-button-secondary-padding-top": "wst-button-secondary-padding-top",
5015
+ "wst-button-secondary-padding-left": "wst-button-secondary-padding-left",
5016
+ "wst-button-secondary-padding-right": "wst-button-secondary-padding-right",
5017
+ "wst-button-secondary-border-top-left-radius": "wst-button-secondary-border-top-left-radius",
5018
+ "wst-button-secondary-border-top-right-radius": "wst-button-secondary-border-top-right-radius",
5019
+ "wst-button-secondary-border-bottom-left-radius": "wst-button-secondary-border-bottom-left-radius",
5020
+ "wst-button-secondary-border-bottom-right-radius": "wst-button-secondary-border-bottom-right-radius",
5021
+ "wst-button-secondary-column-gap": "wst-button-secondary-column-gap",
5022
+ "wst-button-secondary-row-gap": "wst-button-secondary-row-gap",
5023
+ "wst-button-secondary-justify-content": "wst-button-secondary-justify-content",
5024
+ "wst-button-tertiary-font": "wst-button-tertiary-font",
5025
+ "wst-button-tertiary-font-family": "wst-button-tertiary-font-family",
5026
+ "wst-button-tertiary-font-size": "wst-button-tertiary-font-size",
5027
+ "wst-button-tertiary-font-style": "wst-button-tertiary-font-style",
5028
+ "wst-button-tertiary-font-weight": "wst-button-tertiary-font-weight",
5029
+ "wst-button-tertiary-text-decoration": "wst-button-tertiary-text-decoration",
5030
+ "wst-button-tertiary-text-transform": "wst-button-tertiary-text-transform",
5031
+ "wst-button-tertiary-letter-spacing": "wst-button-tertiary-letter-spacing",
5032
+ "wst-button-tertiary-line-height": "wst-button-tertiary-line-height",
5033
+ "wst-button-tertiary-text-shadow": "wst-button-tertiary-text-shadow",
5034
+ "wst-button-tertiary-box-shadow": "wst-button-tertiary-box-shadow",
5035
+ "wst-button-tertiary-border-left-width": "wst-button-tertiary-border-left-width",
5036
+ "wst-button-tertiary-border-right-width": "wst-button-tertiary-border-right-width",
5037
+ "wst-button-tertiary-border-top-width": "wst-button-tertiary-border-top-width",
5038
+ "wst-button-tertiary-border-bottom-width": "wst-button-tertiary-border-bottom-width",
5039
+ "wst-button-tertiary-border-left-style": "wst-button-tertiary-border-left-style",
5040
+ "wst-button-tertiary-border-right-style": "wst-button-tertiary-border-right-style",
5041
+ "wst-button-tertiary-border-top-style": "wst-button-tertiary-border-top-style",
5042
+ "wst-button-tertiary-border-bottom-style": "wst-button-tertiary-border-bottom-style",
5043
+ "wst-button-tertiary-padding-bottom": "wst-button-tertiary-padding-bottom",
5044
+ "wst-button-tertiary-padding-top": "wst-button-tertiary-padding-top",
5045
+ "wst-button-tertiary-padding-left": "wst-button-tertiary-padding-left",
5046
+ "wst-button-tertiary-padding-right": "wst-button-tertiary-padding-right",
5047
+ "wst-button-tertiary-border-top-left-radius": "wst-button-tertiary-border-top-left-radius",
5048
+ "wst-button-tertiary-border-top-right-radius": "wst-button-tertiary-border-top-right-radius",
5049
+ "wst-button-tertiary-border-bottom-left-radius": "wst-button-tertiary-border-bottom-left-radius",
5050
+ "wst-button-tertiary-border-bottom-right-radius": "wst-button-tertiary-border-bottom-right-radius",
5051
+ "wst-button-tertiary-column-gap": "wst-button-tertiary-column-gap",
5052
+ "wst-button-tertiary-row-gap": "wst-button-tertiary-row-gap",
5053
+ "wst-button-tertiary-justify-content": "wst-button-tertiary-justify-content"
5054
+ };
5055
+ const BaseColorVariableNames = {
5056
+ "wst-base-1-color": "wst-base-1-color",
5057
+ "wst-base-2-color": "wst-base-2-color",
5058
+ "wst-shade-1-color": "wst-shade-1-color",
5059
+ "wst-shade-2-color": "wst-shade-2-color",
5060
+ "wst-shade-3-color": "wst-shade-3-color",
5061
+ "wst-accent-1-color": "wst-accent-1-color",
5062
+ "wst-accent-2-color": "wst-accent-2-color",
5063
+ "wst-accent-3-color": "wst-accent-3-color",
5064
+ "wst-accent-4-color": "wst-accent-4-color"
5065
+ };
5066
+ const ColorVariableNames = {
5067
+ ...BaseColorVariableNames,
5068
+ "wst-primary-background-color": "wst-primary-background-color",
5069
+ "wst-secondary-background-color": "wst-secondary-background-color",
5070
+ "wst-links-and-actions-color": "wst-links-and-actions-color",
5071
+ "wst-graphics-1-color": "wst-graphics-1-color",
5072
+ "wst-graphics-2-color": "wst-graphics-2-color",
5073
+ "wst-system-success-color": "wst-system-success-color",
5074
+ "wst-system-error-color": "wst-system-error-color",
5075
+ "wst-system-alert-color": "wst-system-alert-color",
5076
+ "wst-system-disabled-color": "wst-system-disabled-color",
5077
+ "wst-system-default-dark-color": "wst-system-default-dark-color",
5078
+ "wst-system-default-light-color": "wst-system-default-light-color"
5079
+ };
5080
+ const LineColorVariableNames = {
5081
+ "wst-system-line-1-color": "wst-system-line-1-color",
5082
+ "wst-system-line-2-color": "wst-system-line-2-color"
5083
+ };
5084
+ const LineVariableNames = {
5085
+ ...LineColorVariableNames,
5086
+ "wst-system-line-1-width": "wst-system-line-1-width",
5087
+ "wst-system-line-2-width": "wst-system-line-2-width"
5088
+ };
5089
+ const TextColorVariableNames = {
5090
+ "wst-heading-1-color": "wst-heading-1-color",
5091
+ "wst-heading-2-color": "wst-heading-2-color",
5092
+ "wst-heading-3-color": "wst-heading-3-color",
5093
+ "wst-heading-4-color": "wst-heading-4-color",
5094
+ "wst-heading-5-color": "wst-heading-5-color",
5095
+ "wst-heading-6-color": "wst-heading-6-color",
5096
+ "wst-paragraph-1-color": "wst-paragraph-1-color",
5097
+ "wst-paragraph-2-color": "wst-paragraph-2-color",
5098
+ "wst-paragraph-3-color": "wst-paragraph-3-color"
5099
+ };
5100
+ const TextVariableNames = {
5101
+ ...TextColorVariableNames,
5102
+ "wst-heading-1-font": "wst-heading-1-font",
5103
+ "wst-heading-2-font": "wst-heading-2-font",
5104
+ "wst-heading-3-font": "wst-heading-3-font",
5105
+ "wst-heading-4-font": "wst-heading-4-font",
5106
+ "wst-heading-5-font": "wst-heading-5-font",
5107
+ "wst-heading-6-font": "wst-heading-6-font",
5108
+ "wst-paragraph-1-font": "wst-paragraph-1-font",
5109
+ "wst-paragraph-2-font": "wst-paragraph-2-font",
5110
+ "wst-paragraph-3-font": "wst-paragraph-3-font"
5111
+ };
5112
+ const WixThemeVariableNames = {
5113
+ ...ColorVariableNames,
5114
+ ...TextVariableNames,
5115
+ ...ButtonVariableNames,
5116
+ ...BoxVariableNames,
5117
+ ...LineVariableNames
5118
+ };
4475
5119
  const DOM_EVENT = {
4476
5120
  POINTER: "POINTER",
4477
5121
  CHANGE: "CHANGE",
@@ -4483,17 +5127,429 @@ export {
4483
5127
  ACTIONS,
4484
5128
  ActionName as ACTION_NAME,
4485
5129
  Archetype as ARCHETYPE,
5130
+ BoxVariableNames,
5131
+ ButtonVariableNames,
4486
5132
  ContainerType as CONTAINER_TYPE,
4487
5133
  CSS_PROPERTIES,
5134
+ ColorVariableNames,
4488
5135
  DATA,
4489
5136
  DISPLAY_GROUPS,
4490
5137
  DOM_EVENT,
4491
5138
  ELEMENTS,
4492
5139
  INTERACTIONS,
4493
5140
  LAYOUT,
5141
+ LineVariableNames,
4494
5142
  MEDIA,
4495
5143
  NativeStateType as NATIVE_STATE_TYPE,
4496
- OverrideType
5144
+ OverrideType,
5145
+ TextVariableNames,
5146
+ WixThemeVariableNames
4497
5147
  };
4498
5148
  "
4499
5149
  `;
5150
+
5151
+ exports[`react-component-schema dist > dist/theme-variables.module.css matches snapshot 1`] = `
5152
+ "/* Auto-generated — do not edit. Source: WixThemeVariableNames. */
5153
+ @value wst-base-1-color: --wst-base-1-color;
5154
+ @value wst-base-2-color: --wst-base-2-color;
5155
+ @value wst-shade-1-color: --wst-shade-1-color;
5156
+ @value wst-shade-2-color: --wst-shade-2-color;
5157
+ @value wst-shade-3-color: --wst-shade-3-color;
5158
+ @value wst-accent-1-color: --wst-accent-1-color;
5159
+ @value wst-accent-2-color: --wst-accent-2-color;
5160
+ @value wst-accent-3-color: --wst-accent-3-color;
5161
+ @value wst-accent-4-color: --wst-accent-4-color;
5162
+ @value wst-primary-background-color: --wst-primary-background-color;
5163
+ @value wst-secondary-background-color: --wst-secondary-background-color;
5164
+ @value wst-links-and-actions-color: --wst-links-and-actions-color;
5165
+ @value wst-graphics-1-color: --wst-graphics-1-color;
5166
+ @value wst-graphics-2-color: --wst-graphics-2-color;
5167
+ @value wst-system-success-color: --wst-system-success-color;
5168
+ @value wst-system-error-color: --wst-system-error-color;
5169
+ @value wst-system-alert-color: --wst-system-alert-color;
5170
+ @value wst-system-disabled-color: --wst-system-disabled-color;
5171
+ @value wst-system-default-dark-color: --wst-system-default-dark-color;
5172
+ @value wst-system-default-light-color: --wst-system-default-light-color;
5173
+ @value wst-heading-1-color: --wst-heading-1-color;
5174
+ @value wst-heading-2-color: --wst-heading-2-color;
5175
+ @value wst-heading-3-color: --wst-heading-3-color;
5176
+ @value wst-heading-4-color: --wst-heading-4-color;
5177
+ @value wst-heading-5-color: --wst-heading-5-color;
5178
+ @value wst-heading-6-color: --wst-heading-6-color;
5179
+ @value wst-paragraph-1-color: --wst-paragraph-1-color;
5180
+ @value wst-paragraph-2-color: --wst-paragraph-2-color;
5181
+ @value wst-paragraph-3-color: --wst-paragraph-3-color;
5182
+ @value wst-heading-1-font: --wst-heading-1-font;
5183
+ @value wst-heading-2-font: --wst-heading-2-font;
5184
+ @value wst-heading-3-font: --wst-heading-3-font;
5185
+ @value wst-heading-4-font: --wst-heading-4-font;
5186
+ @value wst-heading-5-font: --wst-heading-5-font;
5187
+ @value wst-heading-6-font: --wst-heading-6-font;
5188
+ @value wst-paragraph-1-font: --wst-paragraph-1-font;
5189
+ @value wst-paragraph-2-font: --wst-paragraph-2-font;
5190
+ @value wst-paragraph-3-font: --wst-paragraph-3-font;
5191
+ @value wst-button-primary-background-color: --wst-button-primary-background-color;
5192
+ @value wst-button-primary-border-left-color: --wst-button-primary-border-left-color;
5193
+ @value wst-button-primary-border-right-color: --wst-button-primary-border-right-color;
5194
+ @value wst-button-primary-border-top-color: --wst-button-primary-border-top-color;
5195
+ @value wst-button-primary-border-bottom-color: --wst-button-primary-border-bottom-color;
5196
+ @value wst-button-primary-color: --wst-button-primary-color;
5197
+ @value wst-button-primary-text-highlight: --wst-button-primary-text-highlight;
5198
+ @value wst-button-secondary-background-color: --wst-button-secondary-background-color;
5199
+ @value wst-button-secondary-border-left-color: --wst-button-secondary-border-left-color;
5200
+ @value wst-button-secondary-border-right-color: --wst-button-secondary-border-right-color;
5201
+ @value wst-button-secondary-border-top-color: --wst-button-secondary-border-top-color;
5202
+ @value wst-button-secondary-border-bottom-color: --wst-button-secondary-border-bottom-color;
5203
+ @value wst-button-secondary-color: --wst-button-secondary-color;
5204
+ @value wst-button-secondary-text-highlight: --wst-button-secondary-text-highlight;
5205
+ @value wst-button-tertiary-background-color: --wst-button-tertiary-background-color;
5206
+ @value wst-button-tertiary-border-left-color: --wst-button-tertiary-border-left-color;
5207
+ @value wst-button-tertiary-border-right-color: --wst-button-tertiary-border-right-color;
5208
+ @value wst-button-tertiary-border-top-color: --wst-button-tertiary-border-top-color;
5209
+ @value wst-button-tertiary-border-bottom-color: --wst-button-tertiary-border-bottom-color;
5210
+ @value wst-button-tertiary-color: --wst-button-tertiary-color;
5211
+ @value wst-button-tertiary-text-highlight: --wst-button-tertiary-text-highlight;
5212
+ @value wst-button-primary-background-image: --wst-button-primary-background-image;
5213
+ @value wst-button-secondary-background-image: --wst-button-secondary-background-image;
5214
+ @value wst-button-tertiary-background-image: --wst-button-tertiary-background-image;
5215
+ @value wst-button-primary-font: --wst-button-primary-font;
5216
+ @value wst-button-primary-font-family: --wst-button-primary-font-family;
5217
+ @value wst-button-primary-font-size: --wst-button-primary-font-size;
5218
+ @value wst-button-primary-font-style: --wst-button-primary-font-style;
5219
+ @value wst-button-primary-font-weight: --wst-button-primary-font-weight;
5220
+ @value wst-button-primary-text-decoration: --wst-button-primary-text-decoration;
5221
+ @value wst-button-primary-text-transform: --wst-button-primary-text-transform;
5222
+ @value wst-button-primary-letter-spacing: --wst-button-primary-letter-spacing;
5223
+ @value wst-button-primary-line-height: --wst-button-primary-line-height;
5224
+ @value wst-button-primary-text-shadow: --wst-button-primary-text-shadow;
5225
+ @value wst-button-primary-box-shadow: --wst-button-primary-box-shadow;
5226
+ @value wst-button-primary-border-left-width: --wst-button-primary-border-left-width;
5227
+ @value wst-button-primary-border-right-width: --wst-button-primary-border-right-width;
5228
+ @value wst-button-primary-border-top-width: --wst-button-primary-border-top-width;
5229
+ @value wst-button-primary-border-bottom-width: --wst-button-primary-border-bottom-width;
5230
+ @value wst-button-primary-border-left-style: --wst-button-primary-border-left-style;
5231
+ @value wst-button-primary-border-right-style: --wst-button-primary-border-right-style;
5232
+ @value wst-button-primary-border-top-style: --wst-button-primary-border-top-style;
5233
+ @value wst-button-primary-border-bottom-style: --wst-button-primary-border-bottom-style;
5234
+ @value wst-button-primary-padding-bottom: --wst-button-primary-padding-bottom;
5235
+ @value wst-button-primary-padding-top: --wst-button-primary-padding-top;
5236
+ @value wst-button-primary-padding-left: --wst-button-primary-padding-left;
5237
+ @value wst-button-primary-padding-right: --wst-button-primary-padding-right;
5238
+ @value wst-button-primary-border-top-left-radius: --wst-button-primary-border-top-left-radius;
5239
+ @value wst-button-primary-border-top-right-radius: --wst-button-primary-border-top-right-radius;
5240
+ @value wst-button-primary-border-bottom-left-radius: --wst-button-primary-border-bottom-left-radius;
5241
+ @value wst-button-primary-border-bottom-right-radius: --wst-button-primary-border-bottom-right-radius;
5242
+ @value wst-button-primary-column-gap: --wst-button-primary-column-gap;
5243
+ @value wst-button-primary-row-gap: --wst-button-primary-row-gap;
5244
+ @value wst-button-primary-justify-content: --wst-button-primary-justify-content;
5245
+ @value wst-button-secondary-font: --wst-button-secondary-font;
5246
+ @value wst-button-secondary-font-family: --wst-button-secondary-font-family;
5247
+ @value wst-button-secondary-font-size: --wst-button-secondary-font-size;
5248
+ @value wst-button-secondary-font-style: --wst-button-secondary-font-style;
5249
+ @value wst-button-secondary-font-weight: --wst-button-secondary-font-weight;
5250
+ @value wst-button-secondary-text-decoration: --wst-button-secondary-text-decoration;
5251
+ @value wst-button-secondary-text-transform: --wst-button-secondary-text-transform;
5252
+ @value wst-button-secondary-letter-spacing: --wst-button-secondary-letter-spacing;
5253
+ @value wst-button-secondary-line-height: --wst-button-secondary-line-height;
5254
+ @value wst-button-secondary-text-shadow: --wst-button-secondary-text-shadow;
5255
+ @value wst-button-secondary-box-shadow: --wst-button-secondary-box-shadow;
5256
+ @value wst-button-secondary-border-left-width: --wst-button-secondary-border-left-width;
5257
+ @value wst-button-secondary-border-right-width: --wst-button-secondary-border-right-width;
5258
+ @value wst-button-secondary-border-top-width: --wst-button-secondary-border-top-width;
5259
+ @value wst-button-secondary-border-bottom-width: --wst-button-secondary-border-bottom-width;
5260
+ @value wst-button-secondary-border-left-style: --wst-button-secondary-border-left-style;
5261
+ @value wst-button-secondary-border-right-style: --wst-button-secondary-border-right-style;
5262
+ @value wst-button-secondary-border-top-style: --wst-button-secondary-border-top-style;
5263
+ @value wst-button-secondary-border-bottom-style: --wst-button-secondary-border-bottom-style;
5264
+ @value wst-button-secondary-padding-bottom: --wst-button-secondary-padding-bottom;
5265
+ @value wst-button-secondary-padding-top: --wst-button-secondary-padding-top;
5266
+ @value wst-button-secondary-padding-left: --wst-button-secondary-padding-left;
5267
+ @value wst-button-secondary-padding-right: --wst-button-secondary-padding-right;
5268
+ @value wst-button-secondary-border-top-left-radius: --wst-button-secondary-border-top-left-radius;
5269
+ @value wst-button-secondary-border-top-right-radius: --wst-button-secondary-border-top-right-radius;
5270
+ @value wst-button-secondary-border-bottom-left-radius: --wst-button-secondary-border-bottom-left-radius;
5271
+ @value wst-button-secondary-border-bottom-right-radius: --wst-button-secondary-border-bottom-right-radius;
5272
+ @value wst-button-secondary-column-gap: --wst-button-secondary-column-gap;
5273
+ @value wst-button-secondary-row-gap: --wst-button-secondary-row-gap;
5274
+ @value wst-button-secondary-justify-content: --wst-button-secondary-justify-content;
5275
+ @value wst-button-tertiary-font: --wst-button-tertiary-font;
5276
+ @value wst-button-tertiary-font-family: --wst-button-tertiary-font-family;
5277
+ @value wst-button-tertiary-font-size: --wst-button-tertiary-font-size;
5278
+ @value wst-button-tertiary-font-style: --wst-button-tertiary-font-style;
5279
+ @value wst-button-tertiary-font-weight: --wst-button-tertiary-font-weight;
5280
+ @value wst-button-tertiary-text-decoration: --wst-button-tertiary-text-decoration;
5281
+ @value wst-button-tertiary-text-transform: --wst-button-tertiary-text-transform;
5282
+ @value wst-button-tertiary-letter-spacing: --wst-button-tertiary-letter-spacing;
5283
+ @value wst-button-tertiary-line-height: --wst-button-tertiary-line-height;
5284
+ @value wst-button-tertiary-text-shadow: --wst-button-tertiary-text-shadow;
5285
+ @value wst-button-tertiary-box-shadow: --wst-button-tertiary-box-shadow;
5286
+ @value wst-button-tertiary-border-left-width: --wst-button-tertiary-border-left-width;
5287
+ @value wst-button-tertiary-border-right-width: --wst-button-tertiary-border-right-width;
5288
+ @value wst-button-tertiary-border-top-width: --wst-button-tertiary-border-top-width;
5289
+ @value wst-button-tertiary-border-bottom-width: --wst-button-tertiary-border-bottom-width;
5290
+ @value wst-button-tertiary-border-left-style: --wst-button-tertiary-border-left-style;
5291
+ @value wst-button-tertiary-border-right-style: --wst-button-tertiary-border-right-style;
5292
+ @value wst-button-tertiary-border-top-style: --wst-button-tertiary-border-top-style;
5293
+ @value wst-button-tertiary-border-bottom-style: --wst-button-tertiary-border-bottom-style;
5294
+ @value wst-button-tertiary-padding-bottom: --wst-button-tertiary-padding-bottom;
5295
+ @value wst-button-tertiary-padding-top: --wst-button-tertiary-padding-top;
5296
+ @value wst-button-tertiary-padding-left: --wst-button-tertiary-padding-left;
5297
+ @value wst-button-tertiary-padding-right: --wst-button-tertiary-padding-right;
5298
+ @value wst-button-tertiary-border-top-left-radius: --wst-button-tertiary-border-top-left-radius;
5299
+ @value wst-button-tertiary-border-top-right-radius: --wst-button-tertiary-border-top-right-radius;
5300
+ @value wst-button-tertiary-border-bottom-left-radius: --wst-button-tertiary-border-bottom-left-radius;
5301
+ @value wst-button-tertiary-border-bottom-right-radius: --wst-button-tertiary-border-bottom-right-radius;
5302
+ @value wst-button-tertiary-column-gap: --wst-button-tertiary-column-gap;
5303
+ @value wst-button-tertiary-row-gap: --wst-button-tertiary-row-gap;
5304
+ @value wst-button-tertiary-justify-content: --wst-button-tertiary-justify-content;
5305
+ @value wst-box-primary-background-color: --wst-box-primary-background-color;
5306
+ @value wst-box-primary-border-left-color: --wst-box-primary-border-left-color;
5307
+ @value wst-box-primary-border-right-color: --wst-box-primary-border-right-color;
5308
+ @value wst-box-primary-border-top-color: --wst-box-primary-border-top-color;
5309
+ @value wst-box-primary-border-bottom-color: --wst-box-primary-border-bottom-color;
5310
+ @value wst-box-secondary-background-color: --wst-box-secondary-background-color;
5311
+ @value wst-box-secondary-border-left-color: --wst-box-secondary-border-left-color;
5312
+ @value wst-box-secondary-border-right-color: --wst-box-secondary-border-right-color;
5313
+ @value wst-box-secondary-border-top-color: --wst-box-secondary-border-top-color;
5314
+ @value wst-box-secondary-border-bottom-color: --wst-box-secondary-border-bottom-color;
5315
+ @value wst-box-primary-background-image: --wst-box-primary-background-image;
5316
+ @value wst-box-secondary-background-image: --wst-box-secondary-background-image;
5317
+ @value wst-box-primary-border-left-width: --wst-box-primary-border-left-width;
5318
+ @value wst-box-primary-border-right-width: --wst-box-primary-border-right-width;
5319
+ @value wst-box-primary-border-top-width: --wst-box-primary-border-top-width;
5320
+ @value wst-box-primary-border-bottom-width: --wst-box-primary-border-bottom-width;
5321
+ @value wst-box-primary-border-left-style: --wst-box-primary-border-left-style;
5322
+ @value wst-box-primary-border-right-style: --wst-box-primary-border-right-style;
5323
+ @value wst-box-primary-border-top-style: --wst-box-primary-border-top-style;
5324
+ @value wst-box-primary-border-bottom-style: --wst-box-primary-border-bottom-style;
5325
+ @value wst-box-primary-border-top-left-radius: --wst-box-primary-border-top-left-radius;
5326
+ @value wst-box-primary-border-top-right-radius: --wst-box-primary-border-top-right-radius;
5327
+ @value wst-box-primary-border-bottom-left-radius: --wst-box-primary-border-bottom-left-radius;
5328
+ @value wst-box-primary-border-bottom-right-radius: --wst-box-primary-border-bottom-right-radius;
5329
+ @value wst-box-primary-box-shadow: --wst-box-primary-box-shadow;
5330
+ @value wst-box-secondary-border-left-width: --wst-box-secondary-border-left-width;
5331
+ @value wst-box-secondary-border-right-width: --wst-box-secondary-border-right-width;
5332
+ @value wst-box-secondary-border-top-width: --wst-box-secondary-border-top-width;
5333
+ @value wst-box-secondary-border-bottom-width: --wst-box-secondary-border-bottom-width;
5334
+ @value wst-box-secondary-border-left-style: --wst-box-secondary-border-left-style;
5335
+ @value wst-box-secondary-border-right-style: --wst-box-secondary-border-right-style;
5336
+ @value wst-box-secondary-border-top-style: --wst-box-secondary-border-top-style;
5337
+ @value wst-box-secondary-border-bottom-style: --wst-box-secondary-border-bottom-style;
5338
+ @value wst-box-secondary-border-top-left-radius: --wst-box-secondary-border-top-left-radius;
5339
+ @value wst-box-secondary-border-top-right-radius: --wst-box-secondary-border-top-right-radius;
5340
+ @value wst-box-secondary-border-bottom-left-radius: --wst-box-secondary-border-bottom-left-radius;
5341
+ @value wst-box-secondary-border-bottom-right-radius: --wst-box-secondary-border-bottom-right-radius;
5342
+ @value wst-box-secondary-padding-bottom: --wst-box-secondary-padding-bottom;
5343
+ @value wst-box-secondary-padding-top: --wst-box-secondary-padding-top;
5344
+ @value wst-box-secondary-padding-left: --wst-box-secondary-padding-left;
5345
+ @value wst-box-secondary-padding-right: --wst-box-secondary-padding-right;
5346
+ @value wst-box-secondary-box-shadow: --wst-box-secondary-box-shadow;
5347
+ @value wst-system-line-1-color: --wst-system-line-1-color;
5348
+ @value wst-system-line-2-color: --wst-system-line-2-color;
5349
+ @value wst-system-line-1-width: --wst-system-line-1-width;
5350
+ @value wst-system-line-2-width: --wst-system-line-2-width;
5351
+ "
5352
+ `;
5353
+
5354
+ exports[`react-component-schema dist > dist/theme-variables.scss matches snapshot 1`] = `
5355
+ "// Auto-generated — do not edit. Source: WixThemeVariableNames.
5356
+ $wst-base-1-color: var(--wst-base-1-color);
5357
+ $wst-base-2-color: var(--wst-base-2-color);
5358
+ $wst-shade-1-color: var(--wst-shade-1-color);
5359
+ $wst-shade-2-color: var(--wst-shade-2-color);
5360
+ $wst-shade-3-color: var(--wst-shade-3-color);
5361
+ $wst-accent-1-color: var(--wst-accent-1-color);
5362
+ $wst-accent-2-color: var(--wst-accent-2-color);
5363
+ $wst-accent-3-color: var(--wst-accent-3-color);
5364
+ $wst-accent-4-color: var(--wst-accent-4-color);
5365
+ $wst-primary-background-color: var(--wst-primary-background-color);
5366
+ $wst-secondary-background-color: var(--wst-secondary-background-color);
5367
+ $wst-links-and-actions-color: var(--wst-links-and-actions-color);
5368
+ $wst-graphics-1-color: var(--wst-graphics-1-color);
5369
+ $wst-graphics-2-color: var(--wst-graphics-2-color);
5370
+ $wst-system-success-color: var(--wst-system-success-color);
5371
+ $wst-system-error-color: var(--wst-system-error-color);
5372
+ $wst-system-alert-color: var(--wst-system-alert-color);
5373
+ $wst-system-disabled-color: var(--wst-system-disabled-color);
5374
+ $wst-system-default-dark-color: var(--wst-system-default-dark-color);
5375
+ $wst-system-default-light-color: var(--wst-system-default-light-color);
5376
+ $wst-heading-1-color: var(--wst-heading-1-color);
5377
+ $wst-heading-2-color: var(--wst-heading-2-color);
5378
+ $wst-heading-3-color: var(--wst-heading-3-color);
5379
+ $wst-heading-4-color: var(--wst-heading-4-color);
5380
+ $wst-heading-5-color: var(--wst-heading-5-color);
5381
+ $wst-heading-6-color: var(--wst-heading-6-color);
5382
+ $wst-paragraph-1-color: var(--wst-paragraph-1-color);
5383
+ $wst-paragraph-2-color: var(--wst-paragraph-2-color);
5384
+ $wst-paragraph-3-color: var(--wst-paragraph-3-color);
5385
+ $wst-heading-1-font: var(--wst-heading-1-font);
5386
+ $wst-heading-2-font: var(--wst-heading-2-font);
5387
+ $wst-heading-3-font: var(--wst-heading-3-font);
5388
+ $wst-heading-4-font: var(--wst-heading-4-font);
5389
+ $wst-heading-5-font: var(--wst-heading-5-font);
5390
+ $wst-heading-6-font: var(--wst-heading-6-font);
5391
+ $wst-paragraph-1-font: var(--wst-paragraph-1-font);
5392
+ $wst-paragraph-2-font: var(--wst-paragraph-2-font);
5393
+ $wst-paragraph-3-font: var(--wst-paragraph-3-font);
5394
+ $wst-button-primary-background-color: var(--wst-button-primary-background-color);
5395
+ $wst-button-primary-border-left-color: var(--wst-button-primary-border-left-color);
5396
+ $wst-button-primary-border-right-color: var(--wst-button-primary-border-right-color);
5397
+ $wst-button-primary-border-top-color: var(--wst-button-primary-border-top-color);
5398
+ $wst-button-primary-border-bottom-color: var(--wst-button-primary-border-bottom-color);
5399
+ $wst-button-primary-color: var(--wst-button-primary-color);
5400
+ $wst-button-primary-text-highlight: var(--wst-button-primary-text-highlight);
5401
+ $wst-button-secondary-background-color: var(--wst-button-secondary-background-color);
5402
+ $wst-button-secondary-border-left-color: var(--wst-button-secondary-border-left-color);
5403
+ $wst-button-secondary-border-right-color: var(--wst-button-secondary-border-right-color);
5404
+ $wst-button-secondary-border-top-color: var(--wst-button-secondary-border-top-color);
5405
+ $wst-button-secondary-border-bottom-color: var(--wst-button-secondary-border-bottom-color);
5406
+ $wst-button-secondary-color: var(--wst-button-secondary-color);
5407
+ $wst-button-secondary-text-highlight: var(--wst-button-secondary-text-highlight);
5408
+ $wst-button-tertiary-background-color: var(--wst-button-tertiary-background-color);
5409
+ $wst-button-tertiary-border-left-color: var(--wst-button-tertiary-border-left-color);
5410
+ $wst-button-tertiary-border-right-color: var(--wst-button-tertiary-border-right-color);
5411
+ $wst-button-tertiary-border-top-color: var(--wst-button-tertiary-border-top-color);
5412
+ $wst-button-tertiary-border-bottom-color: var(--wst-button-tertiary-border-bottom-color);
5413
+ $wst-button-tertiary-color: var(--wst-button-tertiary-color);
5414
+ $wst-button-tertiary-text-highlight: var(--wst-button-tertiary-text-highlight);
5415
+ $wst-button-primary-background-image: var(--wst-button-primary-background-image);
5416
+ $wst-button-secondary-background-image: var(--wst-button-secondary-background-image);
5417
+ $wst-button-tertiary-background-image: var(--wst-button-tertiary-background-image);
5418
+ $wst-button-primary-font: var(--wst-button-primary-font);
5419
+ $wst-button-primary-font-family: var(--wst-button-primary-font-family);
5420
+ $wst-button-primary-font-size: var(--wst-button-primary-font-size);
5421
+ $wst-button-primary-font-style: var(--wst-button-primary-font-style);
5422
+ $wst-button-primary-font-weight: var(--wst-button-primary-font-weight);
5423
+ $wst-button-primary-text-decoration: var(--wst-button-primary-text-decoration);
5424
+ $wst-button-primary-text-transform: var(--wst-button-primary-text-transform);
5425
+ $wst-button-primary-letter-spacing: var(--wst-button-primary-letter-spacing);
5426
+ $wst-button-primary-line-height: var(--wst-button-primary-line-height);
5427
+ $wst-button-primary-text-shadow: var(--wst-button-primary-text-shadow);
5428
+ $wst-button-primary-box-shadow: var(--wst-button-primary-box-shadow);
5429
+ $wst-button-primary-border-left-width: var(--wst-button-primary-border-left-width);
5430
+ $wst-button-primary-border-right-width: var(--wst-button-primary-border-right-width);
5431
+ $wst-button-primary-border-top-width: var(--wst-button-primary-border-top-width);
5432
+ $wst-button-primary-border-bottom-width: var(--wst-button-primary-border-bottom-width);
5433
+ $wst-button-primary-border-left-style: var(--wst-button-primary-border-left-style);
5434
+ $wst-button-primary-border-right-style: var(--wst-button-primary-border-right-style);
5435
+ $wst-button-primary-border-top-style: var(--wst-button-primary-border-top-style);
5436
+ $wst-button-primary-border-bottom-style: var(--wst-button-primary-border-bottom-style);
5437
+ $wst-button-primary-padding-bottom: var(--wst-button-primary-padding-bottom);
5438
+ $wst-button-primary-padding-top: var(--wst-button-primary-padding-top);
5439
+ $wst-button-primary-padding-left: var(--wst-button-primary-padding-left);
5440
+ $wst-button-primary-padding-right: var(--wst-button-primary-padding-right);
5441
+ $wst-button-primary-border-top-left-radius: var(--wst-button-primary-border-top-left-radius);
5442
+ $wst-button-primary-border-top-right-radius: var(--wst-button-primary-border-top-right-radius);
5443
+ $wst-button-primary-border-bottom-left-radius: var(--wst-button-primary-border-bottom-left-radius);
5444
+ $wst-button-primary-border-bottom-right-radius: var(--wst-button-primary-border-bottom-right-radius);
5445
+ $wst-button-primary-column-gap: var(--wst-button-primary-column-gap);
5446
+ $wst-button-primary-row-gap: var(--wst-button-primary-row-gap);
5447
+ $wst-button-primary-justify-content: var(--wst-button-primary-justify-content);
5448
+ $wst-button-secondary-font: var(--wst-button-secondary-font);
5449
+ $wst-button-secondary-font-family: var(--wst-button-secondary-font-family);
5450
+ $wst-button-secondary-font-size: var(--wst-button-secondary-font-size);
5451
+ $wst-button-secondary-font-style: var(--wst-button-secondary-font-style);
5452
+ $wst-button-secondary-font-weight: var(--wst-button-secondary-font-weight);
5453
+ $wst-button-secondary-text-decoration: var(--wst-button-secondary-text-decoration);
5454
+ $wst-button-secondary-text-transform: var(--wst-button-secondary-text-transform);
5455
+ $wst-button-secondary-letter-spacing: var(--wst-button-secondary-letter-spacing);
5456
+ $wst-button-secondary-line-height: var(--wst-button-secondary-line-height);
5457
+ $wst-button-secondary-text-shadow: var(--wst-button-secondary-text-shadow);
5458
+ $wst-button-secondary-box-shadow: var(--wst-button-secondary-box-shadow);
5459
+ $wst-button-secondary-border-left-width: var(--wst-button-secondary-border-left-width);
5460
+ $wst-button-secondary-border-right-width: var(--wst-button-secondary-border-right-width);
5461
+ $wst-button-secondary-border-top-width: var(--wst-button-secondary-border-top-width);
5462
+ $wst-button-secondary-border-bottom-width: var(--wst-button-secondary-border-bottom-width);
5463
+ $wst-button-secondary-border-left-style: var(--wst-button-secondary-border-left-style);
5464
+ $wst-button-secondary-border-right-style: var(--wst-button-secondary-border-right-style);
5465
+ $wst-button-secondary-border-top-style: var(--wst-button-secondary-border-top-style);
5466
+ $wst-button-secondary-border-bottom-style: var(--wst-button-secondary-border-bottom-style);
5467
+ $wst-button-secondary-padding-bottom: var(--wst-button-secondary-padding-bottom);
5468
+ $wst-button-secondary-padding-top: var(--wst-button-secondary-padding-top);
5469
+ $wst-button-secondary-padding-left: var(--wst-button-secondary-padding-left);
5470
+ $wst-button-secondary-padding-right: var(--wst-button-secondary-padding-right);
5471
+ $wst-button-secondary-border-top-left-radius: var(--wst-button-secondary-border-top-left-radius);
5472
+ $wst-button-secondary-border-top-right-radius: var(--wst-button-secondary-border-top-right-radius);
5473
+ $wst-button-secondary-border-bottom-left-radius: var(--wst-button-secondary-border-bottom-left-radius);
5474
+ $wst-button-secondary-border-bottom-right-radius: var(--wst-button-secondary-border-bottom-right-radius);
5475
+ $wst-button-secondary-column-gap: var(--wst-button-secondary-column-gap);
5476
+ $wst-button-secondary-row-gap: var(--wst-button-secondary-row-gap);
5477
+ $wst-button-secondary-justify-content: var(--wst-button-secondary-justify-content);
5478
+ $wst-button-tertiary-font: var(--wst-button-tertiary-font);
5479
+ $wst-button-tertiary-font-family: var(--wst-button-tertiary-font-family);
5480
+ $wst-button-tertiary-font-size: var(--wst-button-tertiary-font-size);
5481
+ $wst-button-tertiary-font-style: var(--wst-button-tertiary-font-style);
5482
+ $wst-button-tertiary-font-weight: var(--wst-button-tertiary-font-weight);
5483
+ $wst-button-tertiary-text-decoration: var(--wst-button-tertiary-text-decoration);
5484
+ $wst-button-tertiary-text-transform: var(--wst-button-tertiary-text-transform);
5485
+ $wst-button-tertiary-letter-spacing: var(--wst-button-tertiary-letter-spacing);
5486
+ $wst-button-tertiary-line-height: var(--wst-button-tertiary-line-height);
5487
+ $wst-button-tertiary-text-shadow: var(--wst-button-tertiary-text-shadow);
5488
+ $wst-button-tertiary-box-shadow: var(--wst-button-tertiary-box-shadow);
5489
+ $wst-button-tertiary-border-left-width: var(--wst-button-tertiary-border-left-width);
5490
+ $wst-button-tertiary-border-right-width: var(--wst-button-tertiary-border-right-width);
5491
+ $wst-button-tertiary-border-top-width: var(--wst-button-tertiary-border-top-width);
5492
+ $wst-button-tertiary-border-bottom-width: var(--wst-button-tertiary-border-bottom-width);
5493
+ $wst-button-tertiary-border-left-style: var(--wst-button-tertiary-border-left-style);
5494
+ $wst-button-tertiary-border-right-style: var(--wst-button-tertiary-border-right-style);
5495
+ $wst-button-tertiary-border-top-style: var(--wst-button-tertiary-border-top-style);
5496
+ $wst-button-tertiary-border-bottom-style: var(--wst-button-tertiary-border-bottom-style);
5497
+ $wst-button-tertiary-padding-bottom: var(--wst-button-tertiary-padding-bottom);
5498
+ $wst-button-tertiary-padding-top: var(--wst-button-tertiary-padding-top);
5499
+ $wst-button-tertiary-padding-left: var(--wst-button-tertiary-padding-left);
5500
+ $wst-button-tertiary-padding-right: var(--wst-button-tertiary-padding-right);
5501
+ $wst-button-tertiary-border-top-left-radius: var(--wst-button-tertiary-border-top-left-radius);
5502
+ $wst-button-tertiary-border-top-right-radius: var(--wst-button-tertiary-border-top-right-radius);
5503
+ $wst-button-tertiary-border-bottom-left-radius: var(--wst-button-tertiary-border-bottom-left-radius);
5504
+ $wst-button-tertiary-border-bottom-right-radius: var(--wst-button-tertiary-border-bottom-right-radius);
5505
+ $wst-button-tertiary-column-gap: var(--wst-button-tertiary-column-gap);
5506
+ $wst-button-tertiary-row-gap: var(--wst-button-tertiary-row-gap);
5507
+ $wst-button-tertiary-justify-content: var(--wst-button-tertiary-justify-content);
5508
+ $wst-box-primary-background-color: var(--wst-box-primary-background-color);
5509
+ $wst-box-primary-border-left-color: var(--wst-box-primary-border-left-color);
5510
+ $wst-box-primary-border-right-color: var(--wst-box-primary-border-right-color);
5511
+ $wst-box-primary-border-top-color: var(--wst-box-primary-border-top-color);
5512
+ $wst-box-primary-border-bottom-color: var(--wst-box-primary-border-bottom-color);
5513
+ $wst-box-secondary-background-color: var(--wst-box-secondary-background-color);
5514
+ $wst-box-secondary-border-left-color: var(--wst-box-secondary-border-left-color);
5515
+ $wst-box-secondary-border-right-color: var(--wst-box-secondary-border-right-color);
5516
+ $wst-box-secondary-border-top-color: var(--wst-box-secondary-border-top-color);
5517
+ $wst-box-secondary-border-bottom-color: var(--wst-box-secondary-border-bottom-color);
5518
+ $wst-box-primary-background-image: var(--wst-box-primary-background-image);
5519
+ $wst-box-secondary-background-image: var(--wst-box-secondary-background-image);
5520
+ $wst-box-primary-border-left-width: var(--wst-box-primary-border-left-width);
5521
+ $wst-box-primary-border-right-width: var(--wst-box-primary-border-right-width);
5522
+ $wst-box-primary-border-top-width: var(--wst-box-primary-border-top-width);
5523
+ $wst-box-primary-border-bottom-width: var(--wst-box-primary-border-bottom-width);
5524
+ $wst-box-primary-border-left-style: var(--wst-box-primary-border-left-style);
5525
+ $wst-box-primary-border-right-style: var(--wst-box-primary-border-right-style);
5526
+ $wst-box-primary-border-top-style: var(--wst-box-primary-border-top-style);
5527
+ $wst-box-primary-border-bottom-style: var(--wst-box-primary-border-bottom-style);
5528
+ $wst-box-primary-border-top-left-radius: var(--wst-box-primary-border-top-left-radius);
5529
+ $wst-box-primary-border-top-right-radius: var(--wst-box-primary-border-top-right-radius);
5530
+ $wst-box-primary-border-bottom-left-radius: var(--wst-box-primary-border-bottom-left-radius);
5531
+ $wst-box-primary-border-bottom-right-radius: var(--wst-box-primary-border-bottom-right-radius);
5532
+ $wst-box-primary-box-shadow: var(--wst-box-primary-box-shadow);
5533
+ $wst-box-secondary-border-left-width: var(--wst-box-secondary-border-left-width);
5534
+ $wst-box-secondary-border-right-width: var(--wst-box-secondary-border-right-width);
5535
+ $wst-box-secondary-border-top-width: var(--wst-box-secondary-border-top-width);
5536
+ $wst-box-secondary-border-bottom-width: var(--wst-box-secondary-border-bottom-width);
5537
+ $wst-box-secondary-border-left-style: var(--wst-box-secondary-border-left-style);
5538
+ $wst-box-secondary-border-right-style: var(--wst-box-secondary-border-right-style);
5539
+ $wst-box-secondary-border-top-style: var(--wst-box-secondary-border-top-style);
5540
+ $wst-box-secondary-border-bottom-style: var(--wst-box-secondary-border-bottom-style);
5541
+ $wst-box-secondary-border-top-left-radius: var(--wst-box-secondary-border-top-left-radius);
5542
+ $wst-box-secondary-border-top-right-radius: var(--wst-box-secondary-border-top-right-radius);
5543
+ $wst-box-secondary-border-bottom-left-radius: var(--wst-box-secondary-border-bottom-left-radius);
5544
+ $wst-box-secondary-border-bottom-right-radius: var(--wst-box-secondary-border-bottom-right-radius);
5545
+ $wst-box-secondary-padding-bottom: var(--wst-box-secondary-padding-bottom);
5546
+ $wst-box-secondary-padding-top: var(--wst-box-secondary-padding-top);
5547
+ $wst-box-secondary-padding-left: var(--wst-box-secondary-padding-left);
5548
+ $wst-box-secondary-padding-right: var(--wst-box-secondary-padding-right);
5549
+ $wst-box-secondary-box-shadow: var(--wst-box-secondary-box-shadow);
5550
+ $wst-system-line-1-color: var(--wst-system-line-1-color);
5551
+ $wst-system-line-2-color: var(--wst-system-line-2-color);
5552
+ $wst-system-line-1-width: var(--wst-system-line-1-width);
5553
+ $wst-system-line-2-width: var(--wst-system-line-2-width);
5554
+ "
5555
+ `;