@sc-360-v2/storefront-cms-library 0.3.47 → 0.3.49

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 (21) hide show
  1. package/dist/add-products-tab.scss +46 -12
  2. package/dist/builder.js +1 -1
  3. package/dist/buy-for-tab.scss +31 -32
  4. package/dist/buyForHeaders.scss +869 -55
  5. package/dist/cart-details.scss +4 -1
  6. package/dist/cart-summary.scss +161 -0
  7. package/dist/checkout.scss +135 -6
  8. package/dist/order-status.scss +95 -52
  9. package/dist/profile.scss +84 -21
  10. package/dist/shipping-payments.scss +204 -45
  11. package/dist/types/builder/tools/element-edit/addProductsTab.d.ts +33 -1
  12. package/dist/types/builder/tools/element-edit/buttonInstance.d.ts +23 -1
  13. package/dist/types/builder/tools/element-edit/buyForWithTab.d.ts +990 -210
  14. package/dist/types/builder/tools/element-edit/cartSummary.d.ts +79 -0
  15. package/dist/types/builder/tools/element-edit/orderStatus.d.ts +0 -8
  16. package/dist/types/builder/tools/element-edit/profile.d.ts +17 -1
  17. package/dist/types/builder/tools/element-edit/shipping-payments.d.ts +1012 -14
  18. package/dist/types/builder/tools/element-edit/userElements.d.ts +120 -0
  19. package/dist/user-elements copy.scss +1437 -0
  20. package/dist/user-elements.scss +263 -175
  21. package/package.json +1 -1
package/dist/profile.scss CHANGED
@@ -1,5 +1,6 @@
1
1
  @use "sass:map";
2
2
  @use "sass:list";
3
+ @use "./functions.scss" as *;
3
4
 
4
5
  [data-div-type="element"] {
5
6
  &[data-element-type="profile"] {
@@ -27,6 +28,14 @@
27
28
  // justify-content: center;
28
29
  }
29
30
 
31
+ &[data-show-text-avatar-border="true"] {
32
+ .profile__avatar__initials {
33
+ border-color: prepareMediaVariable(--_ctm-dn-tt-ar-br-cr);
34
+ border-style: prepareMediaVariable(--_ctm-dn-tt-ar-br-se);
35
+ border-width: prepareMediaVariable(--_ctm-dn-tt-ar-br-wh);
36
+ }
37
+ }
38
+
30
39
  &[data-widget-border="true"] {
31
40
  .profile__section {
32
41
  border-color: var(
@@ -74,6 +83,41 @@
74
83
  var(--_ctm-mob-dn-pe-wt-sw-cr, var(--_ctm-tab-dn-pe-wt-sw-cr, var(--_ctm-dn-pe-wt-sw-cr)))
75
84
  );
76
85
 
86
+ .collapse__icon {
87
+ svg {
88
+ width: var(
89
+ --_ctm-dn-ar-ln-ar-in-se,
90
+ var(--_ctm-dn-ce-in-in-se, var(--_ctm-dn-ce-in-in-se))
91
+ );
92
+ height: var(
93
+ --_ctm-dn-ce-in-in-se,
94
+ var(--_ctm-dn-ce-in-in-se, var(--_ctm-dn-ce-in-in-se))
95
+ );
96
+ path {
97
+ stroke: var(
98
+ --_ctm-mob-dn-ce-in-in-c1,
99
+ var(--_ctm-tab-dn-ce-in-cr, var(--_ctm-dn-ce-in-in-c1))
100
+ );
101
+ }
102
+ }
103
+ }
104
+ .expand__icon {
105
+ width: prepareMediaVariable(--_ctm-dn-ed-in-in-se);
106
+ height: prepareMediaVariable(--_ctm-dn-ed-in-in-se);
107
+
108
+ svg {
109
+ width: prepareMediaVariable(--_ctm-dn-ed-in-in-se);
110
+ height: prepareMediaVariable(--_ctm-dn-ed-in-in-se);
111
+
112
+ path {
113
+ stroke: var(
114
+ --_ctm-mob-dn-ed-in-in-c1,
115
+ var(--_ctm-tab-dn-ed-in-cr, var(--_ctm-dn-ed-in-in-c1))
116
+ );
117
+ }
118
+ }
119
+ }
120
+
77
121
  .profile__avatar__before__login {
78
122
  svg {
79
123
  width: var(
@@ -93,6 +137,7 @@
93
137
  }
94
138
  }
95
139
  }
140
+
96
141
  .profile__avatar__after__login {
97
142
  svg {
98
143
  width: var(
@@ -112,6 +157,34 @@
112
157
  }
113
158
  }
114
159
  }
160
+ .profile__avatar__initials {
161
+ // width: prepareMediaVariable(--_ctm-lt-tt-ar-se);
162
+ // height: prepareMediaVariable(--_ctm-lt-tt-ar-se);
163
+ width: var(--_ctm-mob-lt-tt-ar-se, var(--_ctm-tab-lt-tt-ar-se, var(--_ctm-lt-tt-ar-se)));
164
+ height: var(--_ctm-mob-lt-tt-ar-se, var(--_ctm-tab-lt-tt-ar-se, var(--_ctm-lt-tt-ar-se)));
165
+ background-color: prepareMediaVariable(--_ctm-dn-tt-ar-bd-cr);
166
+
167
+ font-family: prepareMediaVariable(--_ctm-dn-tt-ar-ft-fy), sans-serif;
168
+ font-size: prepareMediaVariable(--_ctm-dn-tt-ar-ft-se);
169
+ color: prepareMediaVariable(--_ctm-dn-tt-ar-cr);
170
+ font-weight: prepareMediaVariable(--_ctm-dn-tt-ar-ft-wt);
171
+ text-decoration: prepareMediaVariable(--_ctm-dn-tt-ar-ue);
172
+ font-style: prepareMediaVariable(--_ctm-dn-tt-ar-ft-se-ic);
173
+ text-align: #{prepareMediaVariable(--_ctm-dn-tt-ar-tt-an)};
174
+ letter-spacing: #{prepareMediaVariable(--_ctm-dn-tt-ar-lr-sg)};
175
+ line-height: #{prepareMediaVariable(--_ctm-dn-tt-ar-le-ht)};
176
+ border-radius: 50%;
177
+ // color: white;
178
+ // font-weight: 600;
179
+ // font-size: 18px;
180
+ display: flex;
181
+ justify-content: center;
182
+ text-transform: uppercase;
183
+ align-items: center;
184
+ // user-select: none;
185
+ // font-family: "Arial", sans-serif;
186
+ // letter-spacing: 1px;
187
+ }
115
188
 
116
189
  .icon {
117
190
  display: flex;
@@ -221,32 +294,22 @@
221
294
  }
222
295
  .add_order_menu {
223
296
  position: absolute;
224
- top: 83%;
225
- left: 0;
226
- width: 240px;
227
- background: #fff;
297
+ top: calc(100% + var(--_ctm-dn-pe-wt-cr-ot-y, 0px));
298
+ left: 50%;
299
+ transform: translateX(calc(-50% + var(--_ctm-dn-pe-wt-cr-ot-x, 0px)));
300
+ width: prepareMediaVariable(--_ctm-lt-dn-wh);
301
+ background-color: var(
302
+ --_ctm-mob-dn-dn-is-dt-se-bd-cr,
303
+ var(--_ctm-tab-dn-dn-is-dt-se-bd-cr, var(--_ctm-dn-dn-is-dt-se-bd-cr))
304
+ );
228
305
  border-radius: 10px;
229
- box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
230
- padding: 8px 0;
306
+ // padding: 8px 0;
231
307
  z-index: 10;
232
- // background-color: var(
233
- // --_sf-hr-bd-cr,
234
- // var(
235
- // --_ctm-mob-dn-pe-wt-bd-cr,
236
- // var(--_ctm-tab-dn-pe-wt-bd-cr, var(--_ctm-dn-pe-wt-bd-cr))
237
- // )
238
- // );
239
- // border-radius: var(
240
- // --_sf-hr-br-br,
241
- // var(
242
- // --_ctm-mob-dn-pe-wt-br-rs,
243
- // var(--_ctm-tab-dn-pe-wt-br-rs, var(--_ctm-dn-pe-wt-br-rs))
244
- // )
245
- // );
246
308
  }
247
309
 
248
310
  .add_order_item {
249
- padding: 12px 20px;
311
+ padding: prepareMediaVariable(--_ctm-dn-pe-wt-pg);
312
+
250
313
  // font-size: 15px;
251
314
  // font-weight: 500;
252
315
  // color: #1f2937;
package/dist/shipping-payments.scss CHANGED
@@ -65,14 +65,12 @@ $activeElementSelector: "[data-has-clicked='true']";
65
65
  }
66
66
 
67
67
  .chk_checkout_accordion {
68
- font-size: 0.95rem;
69
- color: $dark-color;
70
68
  display: flex;
71
- padding: 0px;
69
+ padding: var(--_ctm-lt-pg);
72
70
  flex-direction: column;
73
- // gap: var(--_ctm-lt-te-ad-it-gp);
74
- gap: 24px;
71
+ gap: var(--_ctm-lt-te-ad-it-gp);
75
72
  word-break: keep-all;
73
+ padding-bottom: 24px;
76
74
 
77
75
  .chk_checkout_title {
78
76
  color: rgba(16, 24, 40, 1);
@@ -126,6 +124,7 @@ $activeElementSelector: "[data-has-clicked='true']";
126
124
  }
127
125
 
128
126
  .accordion-body {
127
+ margin-bottom: 16px;
129
128
  .summary {
130
129
  .chk_shipping_method_label {
131
130
  display: flex;
@@ -597,17 +596,7 @@ $activeElementSelector: "[data-has-clicked='true']";
597
596
  }
598
597
 
599
598
  .input-field {
600
- background-color: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-dt-se-bd-cr);
601
- color: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-dt-se-cr);
602
- font-family: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-dt-se-ft-fy);
603
- font-size: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-dt-se-ft-se);
604
- font-style: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-dt-se-ft-se-ic);
605
- font-weight: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-dt-se-ft-wt);
606
- line-height: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-dt-se-le-ht);
607
- letter-spacing: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-dt-se-lr-sg);
608
- text-decoration: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-dt-se-ue);
609
-
610
- &:focus-within {
599
+ &:focus {
611
600
  background-color: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-sd-se-bd-cr);
612
601
  color: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-sd-se-cr);
613
602
  font-family: var(--_ctm-dn-me-sg-as-dn-me-sg-as-it-dn-sd-se-ft-fy);
@@ -779,6 +768,40 @@ $activeElementSelector: "[data-has-clicked='true']";
779
768
  flex-direction: column;
780
769
  gap: var(--_ctm-lt-pt-os-gp-bn-cs);
781
770
  }
771
+ .chk_pmnt_other_options {
772
+ display: flex;
773
+ justify-content: space-between;
774
+ gap: 80px;
775
+ padding: 16px;
776
+ .chk_pmnt_other_options_left_container {
777
+ display: flex;
778
+ gap: 12px;
779
+ .chk_pmnt_option_info_wrapper {
780
+ display: flex;
781
+ gap: 12px;
782
+ .cards {
783
+ display: flex;
784
+ flex-direction: column;
785
+ gap: 8px;
786
+ .chk_payment_options_name {
787
+ font-weight: 600;
788
+ }
789
+ span {
790
+ font-size: 12px;
791
+ .chk_payment_options_label {
792
+ color: var(--_gray-600);
793
+ }
794
+ .chk_payment_options_value {
795
+ color: var(--_gray-900);
796
+ }
797
+ }
798
+ }
799
+ }
800
+ }
801
+ .chk_pmnt_other_options_container {
802
+ padding: 16px;
803
+ }
804
+ }
782
805
 
783
806
  .chk_payment_option {
784
807
  width: 100%;
@@ -800,7 +823,130 @@ $activeElementSelector: "[data-has-clicked='true']";
800
823
  text-decoration: var(--_ctm-dn-pt-os-dn-pt-hg-dn-ue);
801
824
  }
802
825
 
803
- &__other_option_wrapper {
826
+ // gift card styles
827
+ .chk_gft_crd_wrapper {
828
+ display: flex;
829
+ justify-content: space-between;
830
+ align-items: center;
831
+ padding: 16px 16px 0 16px;
832
+ &_item {
833
+ display: flex;
834
+ align-items: center;
835
+ gap: 16px;
836
+ &_icon {
837
+ width: 40px;
838
+ height: 40px;
839
+ border: 1px solid var(--_gray-200);
840
+ border-radius: 6px;
841
+ display: flex;
842
+ justify-content: center;
843
+ align-items: center;
844
+ }
845
+ &_info {
846
+ display: flex;
847
+ flex-direction: column;
848
+ &_title {
849
+ font-size: 14px;
850
+ margin-bottom: 4px;
851
+ font-weight: 600;
852
+ }
853
+ &_desc {
854
+ display: flex;
855
+ &_value {
856
+ font-size: 12px;
857
+ color: var(--_gray-600);
858
+ }
859
+ &_label {
860
+ font-size: 12px;
861
+ color: var(--_gray-900);
862
+ }
863
+ }
864
+ }
865
+ &_pin {
866
+ margin-left: 36px;
867
+ input[type="number"] {
868
+ border: 1px solid var(--_gray-300);
869
+ border-radius: 4px;
870
+ background-color: var(--_base-white);
871
+ width: 95px;
872
+ height: 44px;
873
+ padding-inline: 10px;
874
+ &:focus {
875
+ outline: 2px solid var(--_primary-100);
876
+ border: 1px solid var(--_primary-300);
877
+ }
878
+ }
879
+ }
880
+ }
881
+
882
+ &_input {
883
+ border: 1px solid var(--_gray-300);
884
+ border-radius: 4px;
885
+ background-color: var(--_base-white);
886
+ height: 44px;
887
+ width: 100px;
888
+ display: flex;
889
+ align-items: center;
890
+ gap: 8px;
891
+ padding-left: 10px;
892
+ input[type="number"] {
893
+ background-color: var(--_base-white);
894
+ padding-right: 10px;
895
+ }
896
+ &:focus-within {
897
+ outline: 2px solid var(--_primary-100);
898
+ border: 1px solid var(--_primary-300);
899
+ }
900
+ }
901
+ }
902
+ .chk_gft_crd_wrapper {
903
+ &_btn {
904
+ text-align: left;
905
+ margin-bottom: 16px;
906
+ color: var(--_primary-400);
907
+ &:hover {
908
+ text-decoration: underline;
909
+ }
910
+ }
911
+ }
912
+
913
+ // payment other options styles
914
+ .chk_pmnt_other_options {
915
+ display: flex;
916
+ justify-content: space-between;
917
+ gap: 80px;
918
+ padding: 16px;
919
+ .chk_pmnt_other_options_left_container {
920
+ display: flex;
921
+ gap: 12px;
922
+ .chk_pmnt_option_info_wrapper {
923
+ display: flex;
924
+ gap: 12px;
925
+ .cards {
926
+ display: flex;
927
+ flex-direction: column;
928
+ gap: 8px;
929
+ .chk_payment_options_name {
930
+ font-weight: 600;
931
+ }
932
+ span {
933
+ font-size: 12px;
934
+ .chk_payment_options_label {
935
+ color: var(--_gray-600);
936
+ }
937
+ .chk_payment_options_value {
938
+ color: var(--_gray-900);
939
+ }
940
+ }
941
+ }
942
+ }
943
+ }
944
+ .chk_pmnt_other_options_container {
945
+ padding: 16px;
946
+ }
947
+ }
948
+
949
+ .chk_payment_option__other_option_wrapper {
804
950
  display: flex;
805
951
  width: 100%;
806
952
  justify-content: space-between;
@@ -811,29 +957,34 @@ $activeElementSelector: "[data-has-clicked='true']";
811
957
  }
812
958
  }
813
959
 
814
- &_left_container {
960
+ .chk_payment_option_left_container {
815
961
  display: flex;
816
- gap: 12px;
962
+ gap: 80px;
817
963
  align-items: flex-start;
818
964
 
965
+ & > div {
966
+ display: flex;
967
+ gap: 12px;
968
+ }
969
+
819
970
  @media (max-width: 500px) {
820
971
  flex-wrap: wrap;
821
972
  }
822
973
  }
823
974
 
824
- &__left_wrapper {
975
+ .chk_payment_option__left_wrapper {
825
976
  display: flex;
826
977
  flex-direction: column;
827
978
  align-items: flex-start;
828
979
  gap: 16px;
829
980
  }
830
981
 
831
- &__card_icon {
982
+ .chk_payment_option__card_icon {
832
983
  width: 60px;
833
984
  height: 40px;
834
985
  }
835
986
 
836
- &__remove_card_btn {
987
+ .chk_payment_option__remove_card_btn {
837
988
  color: #1a3dcc;
838
989
 
839
990
  &:hover {
@@ -841,15 +992,16 @@ $activeElementSelector: "[data-has-clicked='true']";
841
992
  }
842
993
  }
843
994
 
844
- &__info_wrapper {
995
+ .chk_payment_option__info_wrapper {
845
996
  display: flex;
846
997
  flex-direction: column;
847
998
  white-space: nowrap;
999
+ font-size: 14px;
848
1000
 
849
1001
  .chk_payment_options_name {
850
1002
  color: var(--_gray-700);
851
1003
  font-family: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-fy);
852
- font-size: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-se);
1004
+ font-size: 14px;
853
1005
  font-style: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-se-ic);
854
1006
  font-weight: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-wt);
855
1007
  line-height: var(--_ctm-dn-pt-os-dn-pt-ne-dn-le-ht);
@@ -860,7 +1012,7 @@ $activeElementSelector: "[data-has-clicked='true']";
860
1012
  .chk_payment_options_label {
861
1013
  color: var(--_gray-700);
862
1014
  font-family: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-fy);
863
- font-size: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-se);
1015
+ font-size: 12px;
864
1016
  font-style: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-se-ic);
865
1017
  font-weight: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-wt);
866
1018
  line-height: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-le-ht);
@@ -871,7 +1023,7 @@ $activeElementSelector: "[data-has-clicked='true']";
871
1023
  .chk_payment_options_value {
872
1024
  color: var(--_gray-700);
873
1025
  font-family: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-fy);
874
- font-size: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-se);
1026
+ font-size: 12px;
875
1027
  font-style: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-se-ic);
876
1028
  font-weight: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-wt);
877
1029
  line-height: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-le-ht);
@@ -880,7 +1032,7 @@ $activeElementSelector: "[data-has-clicked='true']";
880
1032
  }
881
1033
  }
882
1034
 
883
- &_right_container {
1035
+ .chk_payment_option_right_container {
884
1036
  display: flex;
885
1037
  gap: 6px;
886
1038
  align-items: flex-start;
@@ -890,13 +1042,14 @@ $activeElementSelector: "[data-has-clicked='true']";
890
1042
  }
891
1043
  }
892
1044
 
893
- &_input {
1045
+ .chk_payment_option_input {
894
1046
  display: flex;
895
- padding: 10px 12px;
1047
+ padding: 9px 12px;
896
1048
  align-items: center;
897
1049
  max-width: 96px;
898
1050
  background-color: var(--_base-white);
899
1051
  border: 1px solid var(--_gray-300);
1052
+ border-radius: 6px;
900
1053
 
901
1054
  &:focus-within {
902
1055
  outline: 2px solid #9baefa;
@@ -933,6 +1086,10 @@ $activeElementSelector: "[data-has-clicked='true']";
933
1086
  }
934
1087
  }
935
1088
  }
1089
+ &_error {
1090
+ font-size: 14px;
1091
+ color: var(--_error-700);
1092
+ }
936
1093
  }
937
1094
 
938
1095
  .chk_billing_address {
@@ -945,7 +1102,7 @@ $activeElementSelector: "[data-has-clicked='true']";
945
1102
  var(--_ctm-dn-pt-os-dn-pt-os-cr-dn-sw-sd)
946
1103
  var(--_ctm-dn-pt-os-dn-pt-os-cr-dn-sw-cr);
947
1104
 
948
- &_form_container {
1105
+ .chk_billing_address_form_container {
949
1106
  border-radius: 6px;
950
1107
  padding-top: 24px;
951
1108
  display: flex;
@@ -967,7 +1124,7 @@ $activeElementSelector: "[data-has-clicked='true']";
967
1124
  }
968
1125
  }
969
1126
 
970
- &_form_wrapper {
1127
+ .chk_billing_address_form_wrapper {
971
1128
  display: flex;
972
1129
  flex-direction: column;
973
1130
  gap: 24px;
@@ -1045,24 +1202,25 @@ $activeElementSelector: "[data-has-clicked='true']";
1045
1202
  background-color: var(--_base-white);
1046
1203
  border: 1px solid var(--_gray-300);
1047
1204
  border-radius: 6px;
1205
+ height: 40px;
1048
1206
 
1049
1207
  &:focus-within {
1050
1208
  border: 1px solid #4b63ee;
1051
1209
  outline: 2px solid #8497ff;
1052
1210
  }
1053
1211
 
1054
- .input-field {
1055
- padding: 8px 12px;
1056
- width: -webkit-fill-available;
1057
- background-color: var(--_base-white);
1058
- border: 1px solid var(--_gray-300);
1059
- border-radius: 6px;
1212
+ // .input-field {
1213
+ // padding: 8px 12px;
1214
+ // width: -webkit-fill-available;
1215
+ // background-color: var(--_base-white);
1216
+ // border: 1px solid var(--_gray-300);
1217
+ // border-radius: 6px;
1060
1218
 
1061
- &:focus-within {
1062
- border: 1px solid #4b63ee;
1063
- outline: 2px solid #8497ff;
1064
- }
1065
- }
1219
+ // &:focus-within {
1220
+ // border: 1px solid #4b63ee;
1221
+ // outline: 2px solid #8497ff;
1222
+ // }
1223
+ // }
1066
1224
  }
1067
1225
 
1068
1226
  input[type="checkbox"] {
@@ -1134,13 +1292,14 @@ $activeElementSelector: "[data-has-clicked='true']";
1134
1292
  width: fit-content;
1135
1293
  background-color: #004dff;
1136
1294
  color: var(--_base-white);
1295
+ border-radius: 6px;
1137
1296
 
1138
1297
  &:hover {
1139
1298
  background-color: #0f43bd;
1140
1299
  }
1141
1300
  }
1142
1301
 
1143
- &_same_as_billing_address_chkbx {
1302
+ .chk_shipping_address_use_as_billing_address_chkbx_same_as_billing_address_chkbx {
1144
1303
  color: var(--_gray-600);
1145
1304
  font-family: var(--_ctm-dn-se-sg-as-dn-cx-dn-ft-fy);
1146
1305
  font-size: var(--_ctm-dn-se-sg-as-dn-cx-dn-ft-se);
@@ -1151,7 +1310,7 @@ $activeElementSelector: "[data-has-clicked='true']";
1151
1310
  text-decoration: var(--_ctm-dn-se-sg-as-dn-cx-dn-ue);
1152
1311
  }
1153
1312
 
1154
- &_button_wrapper {
1313
+ .chk_billing_address_button_wrapper {
1155
1314
  display: flex;
1156
1315
  align-items: center;
1157
1316
  gap: 16px;
@@ -1183,7 +1342,7 @@ $activeElementSelector: "[data-has-clicked='true']";
1183
1342
  }
1184
1343
 
1185
1344
  .react-international-phone-input {
1186
- height: auto;
1345
+ height: 40px;
1187
1346
  border: none !important;
1188
1347
  color: var(--_gray-300);
1189
1348
  font-family: var(--_ctm-dn-it-bx-dn-ft-fy);
package/dist/types/builder/tools/element-edit/addProductsTab.d.ts CHANGED
@@ -25,6 +25,7 @@ export declare enum SelectorKeysEnum {
25
25
  PRODUCT_TITLE = "productTitle",
26
26
  PRODUCT_DESCRIPTION = "productDescription",
27
27
  PRODUCT_PRICE = "productPrice",
28
+ ADD_TO_CART = "addToCart",
28
29
  ALLOCATIONS_HEADING_SDESIGN = "allocationsHeadingDesign",
29
30
  ALLOCATIONS_NAME_DESIGN = "allocationsNameDesign",
30
31
  ALLOCATIONS_DESCRIPTION_DESIGN = "allocationsDescriptionDesign",
@@ -38,7 +39,6 @@ export declare enum SelectorKeysEnum {
38
39
  PRODUCT_INFO_DESIGN = "productInfoDesign",
39
40
  PRODUCT_PRICE_DESIGN = "productPriceDesign",
40
41
  SELECT_BUTTON_DESIGN = "selectButtonDesign",
41
- ADD_TO_CART_BUTTON_DESIGN = "addToCartButtonDesign",
42
42
  OPTION_TITLE = "optionTitle",
43
43
  SWATCH_OPTION_VALUE_STYLE = "swatchOptionValueStyle",
44
44
  SINGLE_OPTION_VALUE_STYLE = "singleOptionValueStyle"
@@ -812,6 +812,7 @@ export declare const getDefaultData: () => {
812
812
  value: string;
813
813
  propertyType: CMSElementEditTypes;
814
814
  };
815
+ padding: import("../../interfaces/global").CSSPaddingValues | undefined;
815
816
  theme: CMSIBCommonInterface;
816
817
  font: CMSIBCommonInterface;
817
818
  fontSize: import("../../interfaces/global").CMSIBSizeInterface;
@@ -846,6 +847,37 @@ export declare const getDefaultData: () => {
846
847
  lineHeight: import("../../interfaces/global").CMSIBSizeInterface;
847
848
  };
848
849
  };
850
+ addtocart: {
851
+ padding: import("../../interfaces/global").CSSPaddingValues | undefined;
852
+ borderColor: CMSIBCommonInterface;
853
+ borderStyle: CMSIBCommonInterface;
854
+ borderPerSlide: import("../../interfaces/global").CSSPaddingValues;
855
+ showBorder: CMSIBCommonInterface;
856
+ showShadow: CMSIBCommonInterface;
857
+ shadowColor: CMSIBCommonInterface;
858
+ blur: import("../../interfaces/global").CMSIBSizeInterface;
859
+ spread: import("../../interfaces/global").CMSIBSizeInterface;
860
+ angle: import("../../interfaces/global").CMSIBSizeInterface;
861
+ borderRadius: import("../../interfaces/global").CSSPaddingValues;
862
+ exposure: import("../../interfaces/global").CMSIBSizeInterface;
863
+ contrast: import("../../interfaces/global").CMSIBSizeInterface;
864
+ saturation: import("../../interfaces/global").CMSIBSizeInterface;
865
+ highlights: import("../../interfaces/global").CMSIBSizeInterface;
866
+ shadows: import("../../interfaces/global").CMSIBSizeInterface;
867
+ theme: CMSIBCommonInterface;
868
+ font: CMSIBCommonInterface;
869
+ fontSize: import("../../interfaces/global").CMSIBSizeInterface;
870
+ textColor: CMSIBCommonInterface;
871
+ bold: CMSIBCommonInterface;
872
+ italic: CMSIBCommonInterface;
873
+ linethrough: CMSIBCommonInterface;
874
+ underline: CMSIBCommonInterface;
875
+ textAlign: CMSIBCommonInterface;
876
+ characterSpacing: import("../../interfaces/global").CMSIBSizeInterface;
877
+ lineHeight: import("../../interfaces/global").CMSIBSizeInterface;
878
+ backgroundColor: CMSIBCommonInterface;
879
+ selectorKey: SelectorKeysEnum;
880
+ };
849
881
  optionTitle: {
850
882
  selectorKey: SelectorKeysEnum;
851
883
  theme: CMSIBCommonInterface;
package/dist/types/builder/tools/element-edit/buttonInstance.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { CMSElementEditTypes } from "../../enums";
1
+ import { CMSCSSUnitTypesEnums, CMSElementEditTypes } from "../../enums";
2
2
  export declare const buttonDefaultStateInstance: {
3
3
  backgroundColor: {
4
4
  value: null;
@@ -892,3 +892,25 @@ export declare const ButtonInstance: {
892
892
  propertyType?: any;
893
893
  };
894
894
  };
895
+ export declare const DividerStylesInstance: {
896
+ showDivider: {
897
+ value: boolean;
898
+ parentRef: string;
899
+ property?: any;
900
+ propertyType?: any;
901
+ isReadOnly?: boolean | undefined;
902
+ };
903
+ dividerWeight: {
904
+ value: string;
905
+ property: string;
906
+ unit: CMSCSSUnitTypesEnums;
907
+ propertyType: CMSElementEditTypes;
908
+ };
909
+ dividerColor: {
910
+ property: string;
911
+ value: null;
912
+ parentRef: string;
913
+ propertyType?: any;
914
+ isReadOnly?: boolean | undefined;
915
+ };
916
+ };