@sc-360-v2/storefront-cms-library 0.3.5 → 0.3.8

package/dist/product-basic-elements.scss

@@ -112,8 +112,8 @@ $overflowSelector: ".flex__overflow";
       //     var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
       // );
       color: var(--_ctm-mob-dn-cr, var(--_ctm-tab-dn-cr, var(--_ctm-dn-cr)));
-      font-family: var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))),
-        sans-serif;
+      font-family:
+        var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))), sans-serif;
       font-size: var(--_ctm-mob-dn-ft-se, var(--_ctm-tab-dn-ft-se, var(--_ctm-dn-ft-se)));
       font-weight: var(--_ctm-mob-dn-ft-wt, var(--_ctm-tab-dn-ft-wt, var(--_ctm-dn-ft-wt)));
       font-style: var(--_ctm-mob-dn-ft-se-ic, var(--_ctm-tab-dn-ft-se-ic, var(--_ctm-dn-ft-se-ic)));
@@ -241,8 +241,8 @@ $overflowSelector: ".flex__overflow";
       //     var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
       // );
       color: var(--_ctm-mob-dn-cr, var(--_ctm-tab-dn-cr, var(--_ctm-dn-cr)));
-      font-family: var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))),
-        sans-serif;
+      font-family:
+        var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))), sans-serif;
       font-size: var(--_ctm-mob-dn-ft-se, var(--_ctm-tab-dn-ft-se, var(--_ctm-dn-ft-se)));
       font-weight: var(--_ctm-mob-dn-ft-wt, var(--_ctm-tab-dn-ft-wt, var(--_ctm-dn-ft-wt)));
       font-style: var(--_ctm-mob-dn-ft-se-ic, var(--_ctm-tab-dn-ft-se-ic, var(--_ctm-dn-ft-se-ic)));
@@ -361,8 +361,8 @@ $overflowSelector: ".flex__overflow";
       //     var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
       // );
       color: var(--_ctm-mob-dn-cr, var(--_ctm-tab-dn-cr, var(--_ctm-dn-cr)));
-      font-family: var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))),
-        sans-serif;
+      font-family:
+        var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))), sans-serif;
       font-size: var(--_ctm-mob-dn-ft-se, var(--_ctm-tab-dn-ft-se, var(--_ctm-dn-ft-se)));
       font-weight: var(--_ctm-mob-dn-ft-wt, var(--_ctm-tab-dn-ft-wt, var(--_ctm-dn-ft-wt)));
       font-style: var(--_ctm-mob-dn-ft-se-ic, var(--_ctm-tab-dn-ft-se-ic, var(--_ctm-dn-ft-se-ic)));
@@ -481,8 +481,8 @@ $overflowSelector: ".flex__overflow";
       //     var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
       // );
       color: var(--_ctm-mob-dn-cr, var(--_ctm-tab-dn-cr, var(--_ctm-dn-cr)));
-      font-family: var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))),
-        sans-serif;
+      font-family:
+        var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))), sans-serif;
       font-size: var(--_ctm-mob-dn-ft-se, var(--_ctm-tab-dn-ft-se, var(--_ctm-dn-ft-se)));
       font-weight: var(--_ctm-mob-dn-ft-wt, var(--_ctm-tab-dn-ft-wt, var(--_ctm-dn-ft-wt)));
       font-style: var(--_ctm-mob-dn-ft-se-ic, var(--_ctm-tab-dn-ft-se-ic, var(--_ctm-dn-ft-se-ic)));
@@ -601,8 +601,8 @@ $overflowSelector: ".flex__overflow";
       //     var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
       // );
       color: var(--_ctm-mob-dn-cr, var(--_ctm-tab-dn-cr, var(--_ctm-dn-cr)));
-      font-family: var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))),
-        sans-serif;
+      font-family:
+        var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))), sans-serif;
       font-size: var(--_ctm-mob-dn-ft-se, var(--_ctm-tab-dn-ft-se, var(--_ctm-dn-ft-se)));
       font-weight: var(--_ctm-mob-dn-ft-wt, var(--_ctm-tab-dn-ft-wt, var(--_ctm-dn-ft-wt)));
       font-style: var(--_ctm-mob-dn-ft-se-ic, var(--_ctm-tab-dn-ft-se-ic, var(--_ctm-dn-ft-se-ic)));
@@ -723,8 +723,8 @@ $overflowSelector: ".flex__overflow";
       //     var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
       // );
       color: var(--_ctm-mob-dn-cr, var(--_ctm-tab-dn-cr, var(--_ctm-dn-cr)));
-      font-family: var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))),
-        sans-serif;
+      font-family:
+        var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))), sans-serif;
       font-size: var(--_ctm-mob-dn-ft-se, var(--_ctm-tab-dn-ft-se, var(--_ctm-dn-ft-se)));
       font-weight: var(--_ctm-mob-dn-ft-wt, var(--_ctm-tab-dn-ft-wt, var(--_ctm-dn-ft-wt)));
       font-style: var(--_ctm-mob-dn-ft-se-ic, var(--_ctm-tab-dn-ft-se-ic, var(--_ctm-dn-ft-se-ic)));

package/dist/product-options.scss

@@ -72,7 +72,8 @@
       .title {
         margin-bottom: 4px;
         color: var(--_ctm-mob-dn-on-te-cr, var(--_ctm-tab-dn-on-te-cr, var(--_ctm-dn-on-te-cr)));
-        font-family: var(
+        font-family:
+          var(
             --_ctm-mob-dn-on-te-ft-fy,
             var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy))
           ),
@@ -337,6 +338,7 @@
         .product-select-image {
           height: 100%;
           width: 100%;
+          object-fit: cover;
         }
 
         &[data-background-shape="circle"] {
@@ -471,8 +473,8 @@
 
         .option__value__text {
           color: var(--_sf-sd-cr, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-cr));
-          font-family: var(--_sf-sd-ft-fy, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-ft-fy)),
-            sans-serif;
+          font-family:
+            var(--_sf-sd-ft-fy, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-ft-fy)), sans-serif;
           font-size: var(--_sf-sd-ft-se, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-ft-se));
           font-weight: var(--_sf-sd-ft-wt, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-ft-wt));
           font-style: var(
@@ -484,48 +486,65 @@
           line-height: var(--_sf-sd-le-ht, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-le-ht-dc));
           text-decoration: var(--_sf-sd-ue, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-ue));
         }
-      }
-
-      .disabled {
-        cursor: not-allowed;
-        opacity: 0.4;
-
-        &[data-swatch-type="Swatch image"] {
-          position: relative;
+        &.disabled {
+          color: #aaa;
+          background-color: #f9f9f9;
+          border-color: #ddd;
+          cursor: not-allowed;
+          opacity: 0.3;
           overflow: hidden;
-          &::after {
-            content: "";
-            width: 172%;
-            height: 1px;
-            position: absolute;
-            background: #f00;
-            left: -14px;
-            transform: rotate(48deg);
-            /* -webkit-transform: rotate(48deg); */
-            -moz-transform: rotate(48deg);
-            top: 14px;
-            box-shadow: 2px 0 5px rgba(255, 255, 255, 1);
-          }
-          &::before {
-            content: "";
-            width: 164%;
-            height: 1px;
-            position: absolute;
-            background: #f00;
-            left: -14px;
-            transform: rotate(-48deg);
-            -webkit-transform: rotate(-48deg);
-            -moz-transform: rotate(-48deg);
-            top: 14px;
-            box-shadow: 2px 0 5px rgba(255, 255, 255, 1);
-          }
+          position: relative;
+        }
+
+        .cross-line {
+          position: absolute;
+          inset: 0;
+          background-color: #cccccc;
+          clip-path: polygon(100% 0, 100% 1px, 0 100%, 0 96%);
+          pointer-events: none;
         }
       }
 
+      // .disabled {
+      //   cursor: not-allowed;
+      //   opacity: 0.4;
+
+      //   &[data-swatch-type="Swatch image"] {
+      //     position: relative;
+      //     overflow: hidden;
+      //     &::after {
+      //       content: "";
+      //       width: 172%;
+      //       height: 1px;
+      //       position: absolute;
+      //       background: #f00;
+      //       left: -14px;
+      //       transform: rotate(48deg);
+      //       /* -webkit-transform: rotate(48deg); */
+      //       -moz-transform: rotate(48deg);
+      //       top: 14px;
+      //       box-shadow: 2px 0 5px rgba(255, 255, 255, 1);
+      //     }
+      //     &::before {
+      //       content: "";
+      //       width: 164%;
+      //       height: 1px;
+      //       position: absolute;
+      //       background: #f00;
+      //       left: -14px;
+      //       transform: rotate(-48deg);
+      //       -webkit-transform: rotate(-48deg);
+      //       -moz-transform: rotate(-48deg);
+      //       top: 14px;
+      //       box-shadow: 2px 0 5px rgba(255, 255, 255, 1);
+      //     }
+      //   }
+      // }
+
       .option__value__text {
         color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-cr));
-        font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-ft-fy)),
-          sans-serif;
+        font-family:
+          var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-ft-fy)), sans-serif;
         font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-ft-se));
         font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-ft-wt));
         font-style: var(--_sf-hr-ft-se-ic, prepareMediaVariable(--_ctm-dn-on-ve-se-dt-se-ft-se-ic));
@@ -738,7 +757,9 @@
               width: 100%;
               display: flex;
               top: calc(
-                calc(var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) + 8px) /
+                calc(
+                    var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) + 8px
+                  ) /
                   2
               );
             }
@@ -763,7 +784,8 @@
                               --_ctm-tab-lt-dn-dy-se-dn-lt-im-sg,
                               var(--_ctm-lt-dn-dy-se-dn-lt-im-sg)
                             )
-                          ) / 2
+                          ) /
+                          2
                       );
                     }
                   }
@@ -813,7 +835,8 @@
                     var(
                         --_ctm-mob-dn-pn-as-aw-se,
                         var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
-                      ) + 8px
+                      ) +
+                      8px
                   )
               );
             }
@@ -823,7 +846,8 @@
                     var(
                         --_ctm-mob-dn-pn-le-le-ht,
                         var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht))
-                      ) + 20px
+                      ) +
+                      20px
                   )
               );
             }
@@ -833,7 +857,8 @@
                     var(
                         --_ctm-mob-dn-pn-ds-dt-se,
                         var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))
-                      ) + 20px
+                      ) +
+                      20px
                   )
               );
             }
@@ -945,13 +970,15 @@
                 var(
                     --_ctm-mob-dn-pn-as-aw-se,
                     var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
-                  ) * 0.5
+                  ) *
+                  0.5
               );
               height: calc(
                 var(
                     --_ctm-mob-dn-pn-as-aw-se,
                     var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
-                  ) * 0.5
+                  ) *
+                  0.5
               );
               path {
                 stroke: var(

package/dist/quotes.scss

@@ -23,6 +23,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
     & > div {
       &.wrapper {
         width: 100%;
+        padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
         &[data-divider-type="true"] .metric_item {
           border: 0px !important;
           border-top: 2px solid var(--_primary-100) !important;

package/dist/repeater.scss

@@ -108,6 +108,7 @@ $rai: "repeater-advertise-item";
             auto-fit,
             minmax(#{prepareMediaVariable(--_ctm-rep-lt-rw-mn-ht-lt)}, 1fr)
           );
+          width: 100%;
 
           & > div {
             &#{$childItemSelector} {
@@ -465,7 +466,8 @@ $rai: "repeater-advertise-item";
                 --_ctm-mob-rep-dn-bn-se-dt-se-cr,
                 var(--_ctm-tab-rep-dn-bn-se-dt-se-cr, var(--_ctm-rep-dn-bn-se-dt-se-cr))
               );
-              font-family: var(
+              font-family:
+                var(
                   --_ctm-mob-rep-dn-bn-se-dt-se-ft-fy,
                   var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-fy, var(--_ctm-rep-dn-bn-se-dt-se-ft-fy))
                 ),
@@ -623,7 +625,8 @@ $rai: "repeater-advertise-item";
                     --_ctm-mob-rep-dn-bn-se-hr-se-cr,
                     var(--_ctm-tab-rep-dn-bn-se-hr-se-cr, var(--_ctm-rep-dn-bn-se-hr-se-cr))
                   );
-                  font-family: var(
+                  font-family:
+                    var(
                       --_ctm-mob-rep-dn-bn-se-hr-se-ft-fy,
                       var(--_ctm-tab-rep-dn-bn-se-hr-se-ft-fy, var(--_ctm-rep-dn-bn-se-hr-se-ft-fy))
                     ),

package/dist/text-temp-v2.scss

@@ -119,8 +119,8 @@ $dblclk: '[data-cms-tt-ee-dbl-clkd="true"]';
         &,
         * {
           color: var(--_ctm-mob-dn-cr, var(--_ctm-tab-dn-cr, var(--_ctm-dn-cr)));
-          font-family: var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))),
-            sans-serif;
+          font-family:
+            var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy))), sans-serif;
           font-size: var(--_ctm-mob-dn-ft-se, var(--_ctm-tab-dn-ft-se, var(--_ctm-dn-ft-se)));
           font-weight: var(--_ctm-mob-dn-ft-wt, var(--_ctm-tab-dn-ft-wt, var(--_ctm-dn-ft-wt)));
           font-style: var(

package/dist/toggle-button.scss

@@ -0,0 +1,32 @@
+.toggle__button {
+  position: relative;
+  width: 36px;
+  height: 20px;
+  background-color: #d0d5dd;
+  border-radius: 12px;
+  cursor: pointer;
+
+  .toggle__slider {
+    position: absolute;
+    top: 2px;
+    left: 2px;
+    transform: translateY(0%);
+    width: 16px;
+    height: 16px;
+    background-color: #fff;
+    border-radius: 50%;
+    transition: transform 0.3s ease;
+    fill: var(--_base-white);
+    filter: drop-shadow(0px 1px 2px rgba(16, 24, 40, 0.06))
+      drop-shadow(0px 1px 3px rgba(16, 24, 40, 0.1));
+  }
+
+  &.toggle__active {
+    background: #132067;
+
+    .toggle__slider {
+      top: 2px;
+      transform: translateX(16px);
+    }
+  }
+}

package/dist/types/builder/constants/data-connectors.d.ts

@@ -0,0 +1,55 @@
+import { ApiMethods } from "../enums/data-connectors";
+export declare const dataConnectorApisData: {
+    PRODUST: {
+        url: string;
+        method: ApiMethods;
+    };
+    PRODUCT_BY_ID: {
+        url: string;
+        method: ApiMethods;
+    };
+    CATEGORIES: {
+        url: string;
+        method: ApiMethods;
+    };
+    CATegory_BY_ID: {
+        url: string;
+        method: ApiMethods;
+    };
+    BRANDS: {
+        url: string;
+        method: ApiMethods;
+    };
+    BRAND_BY_ID: {
+        url: string;
+        method: ApiMethods;
+    };
+    SUB_CATEGORY: {
+        url: string;
+        method: ApiMethods;
+    };
+    MARCHANDISER_SETS: {
+        url: string;
+        method: ApiMethods;
+    };
+    BUNDLES: {
+        url: string;
+        method: ApiMethods;
+    };
+    BUNLES_BY_ID: {
+        url: string;
+        method: ApiMethods;
+    };
+    BUNDLE_BY_TYPE: {
+        url: string;
+        method: ApiMethods;
+    };
+    PRODUCT_BUNDLE_DETAILS: {
+        url: string;
+        method: ApiMethods;
+    };
+    CATEGORY_BUNDLE_DETAILS: {
+        url: string;
+        method: ApiMethods;
+    };
+};

package/dist/types/builder/elements/form-builder/index.d.ts

@@ -155,3 +155,18 @@ export declare enum FormMessageDisplay {
     Custom = 1,
     Always = 2
 }
+export declare enum FormRequiredFieldStyle {
+    Character = 1,
+    SVG = 2,
+    Label = 3,
+    None = 4
+}
+export declare enum FormSpamFilterMethod {
+    None = 0,
+    GoogleRecaptchaV2 = 2,
+    GoogleRecaptchaV3 = 3
+}
+export declare enum FormRequiredFieldPlacement {
+    BeforeField = 1,
+    AfterField = 2
+}

package/dist/types/builder/elements/product-sizechart/index.d.ts

@@ -0,0 +1,26 @@
+import { CommonStyleProperties } from "../../../global/style-properties";
+import { CMSHTMLAttributes } from "../../../global/attributes";
+import { AlignSelfValue, BoxSizingValue, GlobalImageAttributes, GridAreaValue, HeightValue, ImageBuilderAttributes, JustifySelfValue, MaxHeightValue, MaxWidthValue, MinHeightValue, MinWidthValue, PaddingValue } from "../../../global/types";
+import { BuilderAttributes, CMSElementInterface } from "../common";
+export interface ProductSizeChartStyleProperties extends CommonStyleProperties {
+    minHeight?: MinHeightValue;
+    height?: HeightValue;
+    minWidth?: MinWidthValue;
+    maxWidth?: MaxWidthValue;
+    maxHeight?: MaxHeightValue;
+    gridArea?: GridAreaValue;
+    boxSizing?: BoxSizingValue;
+    padding?: PaddingValue;
+    justifySelf?: JustifySelfValue;
+    alignSelf?: AlignSelfValue;
+}
+export declare const getDefaultStyles: () => ProductSizeChartStyleProperties;
+export interface CMSProductSizeChartInterface extends Omit<CMSElementInterface, "attributes"> {
+    attributes: {
+        HTML: Pick<CMSHTMLAttributes, GlobalImageAttributes>;
+        BUILDER: Pick<BuilderAttributes, ImageBuilderAttributes>;
+        CUSTOM: any;
+    };
+    styles: ProductSizeChartStyleProperties;
+    childrenStyles?: CommonStyleProperties;
+}

package/dist/types/builder/elements/user-elements/index.d.ts

@@ -0,0 +1,30 @@
+import { CommonStyleProperties } from "../../../global/style-properties";
+import { CMSHTMLAttributes } from "../../../global/attributes";
+import { AlignSelfValue, BoxSizingValue, GlobalImageAttributes, GridAreaValue, HeightValue, ImageBuilderAttributes, JustifySelfValue, MarginValue, MaxHeightValue, MaxWidthValue, MinHeightValue, MinWidthValue, PaddingValue } from "../../../global/types";
+import { BuilderAttributes, CMSElementInterface } from "../common";
+export interface UserElementsStyleProperties extends CommonStyleProperties {
+    minHeight?: MinHeightValue;
+    height?: HeightValue;
+    minWidth?: MinWidthValue;
+    maxWidth?: MaxWidthValue;
+    maxHeight?: MaxHeightValue;
+    gridArea?: GridAreaValue;
+    boxSizing?: BoxSizingValue;
+    padding?: PaddingValue;
+    marginLeft?: MarginValue;
+    marginTop?: MarginValue;
+    marginBottom?: MarginValue;
+    marginRight?: MarginValue;
+    justifySelf?: JustifySelfValue;
+    alignSelf?: AlignSelfValue;
+}
+export declare const getDefaultStyles: () => UserElementsStyleProperties;
+export interface CMSUserElementsInterface extends Omit<CMSElementInterface, "attributes"> {
+    attributes: {
+        HTML: Pick<CMSHTMLAttributes, GlobalImageAttributes>;
+        BUILDER: Pick<BuilderAttributes, ImageBuilderAttributes>;
+        CUSTOM: any;
+    };
+    styles: UserElementsStyleProperties;
+    childrenStyles?: CommonStyleProperties;
+}

package/dist/types/builder/enums/data-connectors.d.ts

@@ -0,0 +1,21 @@
+export declare enum ApiMethods {
+    GET = "GET",
+    POST = "POST",
+    PUT = "PUT",
+    DELETE = "DELETE"
+}
+export declare enum dataConnectorapis {
+    PRODUST = "PRODUST",
+    CATEGORIES = "CATEGORIES",
+    BRANDS = "BRANDS",
+    PRODUCT_BY_ID = "PRODUCT_BY_ID",
+    CATEGORY_BY_ID = "CATegory_BY_ID",
+    BRAND_BY_ID = "BRAND_BY_ID",
+    SUB_CATEGORY = "SUB_CATEGORY",
+    MARCHANDISER_SETS = "MARCHANDISER_SETS",
+    BUNDLES = "BUNDLES",
+    BUNLES_BY_ID = "BUNLES_BY_ID",
+    BUNDLE_BY_TYPE = "BUNDLE_BY_TYPE",
+    PRODUCT_BUNDLE_DETAILS = "PRODUCT_BUNDLE_DETAILS",
+    CATEGORY_BUNDLE_DETAILS = "CATEGORY_BUNDLE_DETAILS"
+}

package/dist/types/builder/enums/index.d.ts

@@ -1,3 +1,4 @@
+export * as dataConnectorsEnums from "./data-connectors";
 export declare enum CMSToolIdTypes {
     playgroundWrapper = "playground_wrapper",
     layers = "CMS Layers",
@@ -131,7 +132,8 @@ export declare enum CMSElementSelectors {
     gridSwapBtn = "div[data-cms-tool='cms-grid-swap-btn']",
     lightBox = "#cms_lt_bx_mn",
     marchandiserSetsElement = "div[data-element-type='marchandiserSets']",
-    spotlightElement = "div[data-element-type='spotlight']"
+    spotlightElement = "div[data-element-type='spotlight']",
+    layouterProElement = "div[data-element-type='layouter-pro']"
 }
 export declare enum CMSToolAttributes {
     id = "data-cms-tool",
@@ -317,7 +319,9 @@ export declare const CMSElementsListEnum: {
     SIMPLE_LIST_ITEM: string;
     LAYOUTER_PRO: string;
     LAYOUTER_PRO_ITEM: string;
+    USER_ELEMENTS: string;
     FILTER_RESULTS: string;
+    PRODUCT_SIZECHART: string;
 };
 export declare enum CMSResponsiveModeEnums {
     DESKTOP = "desktop",

package/dist/types/builder/index.d.ts

@@ -77,5 +77,8 @@ import * as menuV2Schema from "./elements/menu-v2/index";
 import * as menuItemSchema from "./elements/menu-item/index";
 import * as layouterProSchema from "./elements/layouter-pro/index";
 import * as layouterProItemSchema from "./elements/layouter-pro-item/index";
+import * as userElementsSchema from "./elements/user-elements/index";
 import * as filterResultsSchema from "./elements/filter-results/index";
-export { ElementEditSchema, amountEstimatorSchema, bulkVariantPickerSchema, buttonSchema, cmsTypes, codeSchema, commonFunctions, containerSchema, countdownSchema, embedSchema, enums, faqSchema, gallerySliderSchema, gridSchema, imageHotspotSchema, imageSchema, interfaces, mapSchema, paymentMethodsSchema, pickupLocationsSchema, priceSchema, productActionsSchema, productHighlightsSchema, productImageSchema, productInventorySchema, productPromotionsSchema, quantitySelectorSchema, scrollSchema, sectionSchema, shippingEstimatorSchema, socialIconsSchema, stackSchema, storeLocationsSchema, tabSchema, tableSchema, textSchema, uomSelectorSchema, variantPickerSchema, videoSChema, volumePricingSchema, lightboxSchema, cartSchema, profileSchema, productSchema, repeaterSchema, brandSchema, bundleSchema, bundleDetailsSchema, brandImageSchema, lightBoxV2Schema, searchSchema, layouterSchema, layouterItemSchema, categoryDetailsSchema, contactUsSchema, loginSchema, createFormSchema, resetPasswordSchema, searchResultsHeadingSchema, itemStockSchema, lineItemSchema, tabsV2Schema, tabsContainerSchema, marchandiserSetsSchema, formBuilder, quickLinksSchema, addOrderSchema, buyForTabsSchema, buyForTabsContainerSchema, checkoutSchema, toasterSchema, spotlightSchema, productCustomizationsSchema, iconListSchema, orderStatusSchema, menuV2Schema, menuItemSchema, layouterProSchema, layouterProItemSchema, filterResultsSchema, };
+import * as productSizeChartSchema from "./elements/product-sizechart/index";
+import * as dataConnectorContants from "./constants/data-connectors";
+export { ElementEditSchema, amountEstimatorSchema, bulkVariantPickerSchema, buttonSchema, cmsTypes, codeSchema, commonFunctions, containerSchema, countdownSchema, embedSchema, enums, faqSchema, gallerySliderSchema, gridSchema, imageHotspotSchema, imageSchema, interfaces, mapSchema, paymentMethodsSchema, pickupLocationsSchema, priceSchema, productActionsSchema, productHighlightsSchema, productImageSchema, productInventorySchema, productPromotionsSchema, quantitySelectorSchema, scrollSchema, sectionSchema, shippingEstimatorSchema, socialIconsSchema, stackSchema, storeLocationsSchema, tabSchema, tableSchema, textSchema, uomSelectorSchema, variantPickerSchema, videoSChema, volumePricingSchema, lightboxSchema, cartSchema, profileSchema, productSchema, repeaterSchema, brandSchema, bundleSchema, bundleDetailsSchema, brandImageSchema, lightBoxV2Schema, searchSchema, layouterSchema, layouterItemSchema, categoryDetailsSchema, contactUsSchema, loginSchema, createFormSchema, resetPasswordSchema, searchResultsHeadingSchema, itemStockSchema, lineItemSchema, tabsV2Schema, tabsContainerSchema, marchandiserSetsSchema, formBuilder, quickLinksSchema, addOrderSchema, buyForTabsSchema, buyForTabsContainerSchema, checkoutSchema, toasterSchema, spotlightSchema, productCustomizationsSchema, iconListSchema, orderStatusSchema, menuV2Schema, menuItemSchema, layouterProSchema, layouterProItemSchema, userElementsSchema, filterResultsSchema, productSizeChartSchema, dataConnectorContants, };

package/dist/types/builder/tools/element-edit/common.d.ts

@@ -14,6 +14,14 @@ export interface CMSElementEditPopupLayoutInterface {
     displayScrollbar?: CMSIBCommonInterface;
     positionType?: CMSIBCommonInterface;
     pinTo?: CMSIBCommonInterface;
+    dropdownOptionsSpacing?: CMSIBSizeInterface;
+    dropdownOptionsPadding?: CMSIBSizeInterface;
+    dropdownStyle?: CMSIBCommonInterface;
+    optionAndListSpacing?: CMSIBSizeInterface;
+    dropdownListItemSpacing?: CMSIBSizeInterface;
+    dropdownListItemPadding?: CMSIBSizeInterface;
+    dividerBetweenListItems?: CMSIBSizeInterface;
+    maxItemsToDisplay?: CMSIBSizeInterface;
 }
 export interface CMSElementEditPopupDesignInterface {
     backgroundColor: CMSIBCommonInterface;

package/dist/types/builder/tools/element-edit/index.d.ts

@@ -92,4 +92,6 @@ import * as menuItem from "./menu-item";
 import * as layouterPro from "./layouterPro";
 import * as layouterProItem from "./layouter-pro-item";
 import * as filterResults from "./filterResults";
-export { amountEstimator, bulkVariantPicker, button, code, staticText, common, container, countdown, embed, faq, gallerySlider, grid, image, imageHotspot, map, paymentMethods, pickupLocations, price, productActions, productHighlights, productImage, productInventory, productPromotions, quantitySelector, scroll, section, shippingEstimator, slideShowLayouter, social, stack, storeLocations, table, tabs, text, uomSelector, variantPicker, video, volumePricing, lightbox, cart, profile, repeater, repeaterItem, product, menu, productOptions, productDetails, category, subCategory, brand, bundle, brandImage, filters, sort, pastOrders, quotes, rfqs, lightBoxV2, allocations, search, layouter, layouterItem, categoryDetails, contactUs, login, resetPassword, breadcrumbs, iconLibrary, searchResultsHeading, itemStock, cartDetails, cartSummary, checkout, allocationDetails, line, tabsV2, tabContainer, marchandiserSets, createForm, quickLinks, addOrder, buyForWithTabs, buyForTabsContainer, toaster, spotlight, bundleDetails, productCustomizations, iconList, orderStatus, menuV2, menuItem, layouterPro, layouterProItem, filterResults, };
+import * as productSizeChart from "./productSizeChart";
+import * as userElements from "./userElements";
+export { amountEstimator, bulkVariantPicker, button, code, staticText, common, container, countdown, embed, faq, gallerySlider, grid, image, imageHotspot, map, paymentMethods, pickupLocations, price, productActions, productHighlights, productImage, productInventory, productPromotions, quantitySelector, scroll, section, shippingEstimator, slideShowLayouter, social, stack, storeLocations, table, tabs, text, uomSelector, variantPicker, video, volumePricing, lightbox, cart, profile, repeater, repeaterItem, product, menu, productOptions, productDetails, category, subCategory, brand, bundle, brandImage, filters, sort, pastOrders, quotes, rfqs, lightBoxV2, allocations, search, layouter, layouterItem, categoryDetails, contactUs, login, resetPassword, breadcrumbs, iconLibrary, searchResultsHeading, itemStock, cartDetails, cartSummary, checkout, allocationDetails, line, tabsV2, tabContainer, marchandiserSets, createForm, quickLinks, addOrder, buyForWithTabs, buyForTabsContainer, toaster, spotlight, bundleDetails, productCustomizations, iconList, orderStatus, menuV2, menuItem, layouterPro, layouterProItem, filterResults, productSizeChart, userElements, };

package/dist/types/builder/tools/element-edit/layouter-pro-item.d.ts

@@ -1,4 +1,16 @@
+import { FlexSizeType, JustifyContentValue } from "../../../../components/global/types";
+import { CMSIBCommonInterface, PaddingProps } from "../../interfaces/global";
 import { CMSElementEditPopupDesignInterface, CMSElementEditPopupInterface, CMSElementEditPopupLayoutInterface } from "./common";
+interface selfLayoutInterface {
+    selectorKey: string;
+    itemGap: Pick<CMSIBCommonInterface, "property" | "propertyType"> & PaddingProps;
+    justifyContent: Pick<CMSIBCommonInterface, "property" | "propertyType"> & {
+        value: JustifyContentValue;
+    };
+    flexSize?: Pick<CMSIBCommonInterface, "property" | "propertyType"> & {
+        value: FlexSizeType;
+    };
+}
 export interface selfDesignInterface {
     selectorKey: string;
 }
@@ -6,4 +18,5 @@ export declare enum selfSelectorKeysEnum {
     LAYOUT = "layout",
     DESIGN = "design"
 }
-export declare const getDefaultData: () => CMSElementEditPopupInterface<CMSElementEditPopupLayoutInterface, selfDesignInterface & CMSElementEditPopupDesignInterface>;
+export declare const getDefaultData: () => CMSElementEditPopupInterface<selfLayoutInterface & CMSElementEditPopupLayoutInterface, selfDesignInterface & CMSElementEditPopupDesignInterface>;
+export {};

package/dist/types/builder/tools/element-edit/layouterPro.d.ts

@@ -1,4 +1,4 @@
-import { AlignItemsValue, FlexDirectionValue, JustifyContentValue, LayouterProDisplayStyleType } from "../../../../components/global/types";
+import { AlignItemsValue, FlexDirectionValue, FlexWrapValue, JustifyContentValue, LayouterProDisplayStyleType, OverflowValue } from "../../../../components/global/types";
 import { CMSIBCommonInterface, PaddingProps } from "../../interfaces/global";
 import { CMSElementEditPopupDesignInterface, CMSElementEditPopupInterface, CMSElementEditPopupLayoutInterface } from "./common";
 interface selfLayoutInterface {
@@ -9,7 +9,8 @@ interface selfLayoutInterface {
     direction?: Pick<CMSIBCommonInterface, "property" | "propertyType"> & {
         value: FlexDirectionValue;
     };
-    itemGap: Pick<CMSIBCommonInterface, "property" | "propertyType"> & PaddingProps;
+    rowGap: Pick<CMSIBCommonInterface, "property" | "propertyType"> & PaddingProps;
+    columnGap: Pick<CMSIBCommonInterface, "property" | "propertyType"> & PaddingProps;
     justifyContent: Pick<CMSIBCommonInterface, "property" | "propertyType"> & {
         value: JustifyContentValue;
     };
@@ -20,6 +21,12 @@ interface selfLayoutInterface {
         isShow: boolean;
         value: string | number | any;
     };
+    flexWrap?: Pick<CMSIBCommonInterface, "property" | "propertyType"> & {
+        value: FlexWrapValue;
+    };
+    flexboxOverflow?: Pick<CMSIBCommonInterface, "property" | "propertyType"> & {
+        value: OverflowValue;
+    };
 }
 export interface selfDesignInterface {
     selectorKey: string;