@sc-360-v2/storefront-cms-library 0.1.7 → 0.1.9

package/dist/store-locations.scss

@@ -8,173 +8,24 @@
     aspect-ratio: 1 / var(--_sf-aspect-ratio);
 
     & > .wrapper {
-      // width: 100%;
-      // height: 100%;
-    }
-
-    &[data-show-shadow="false"] {
-      --_show-shadow: none;
-    }
-    &[data-icon-position="left"] {
-      --_sf-fd-bn: row;
-    }
-    &[data-icon-position="right"] {
-      --_sf-fd-bn: row-reverse;
-    }
-    &[data-icon-position="center"] {
-      --_sf-fd-bn: row;
-    }
-
-    &:hover {
-      --_sf-hr-bd-cr: var(--_ctm-dn-hr-se-bd-cr, var(--_tst-dn-hr-se-bd-cr));
-      --_sf-hr-br-cr: var(--_ctm-dn-hr-se-br-cr, var(--_tst-dn-hr-se-br-cr));
-      --_sf-hr-br-st: var(--_ctm-dn-hr-se-br-se, var(--_tst-dn-hr-se-br-se));
-      --_sf-hr-br-wt: var(--_ctm-dn-hr-se-br-wh, var(--_tst-dn-hr-se-br-wh));
-      --_sf-hr-br-br: var(--_ctm-dn-hr-se-br-rs, var(--_tst-dn-hr-se-br-rs));
-      --_sf-hr-bx-sw: var(--_ctm-dn-hr-se-sw-ae, var(--_tst-dn-hr-se-sw-ae))
-        var(--_ctm-dn-hr-se-sw-br, var(--_tst-dn-hr-se-sw-br))
-        var(--_ctm-dn-hr-se-sw-sd, var(--_tst-dn-hr-se-sw-sd))
-        var(--_ctm-dn-hr-se-sw-cr, var(--_tst-dn-hr-se-sw-cr));
-
-      --_sf-hr-fc: var(--_ctm-dn-hr-se-cr, var(--_tst-dn-hr-se-cr));
-      --_sf-hr-ff: var(--_ctm-dn-hr-se-ft-fy, var(--_tst-dn-hr-se-ft-fy));
-      --_sf-hr-fs: var(--_ctm-dn-hr-se-ft-se, var(--_tst-dn-hr-se-ft-se));
-      --_sf-hr-fw: var(--_ctm-dn-hr-se-ft-wt, var(--_tst-dn-hr-se-ft-wt));
-      --_sf-hr-ft: var(--_ctm-dn-hr-se-ft-se-ic, var(--_tst-dn-hr-se-ft-se-ic));
-      --_sf-hr-ta: var(--_ctm-dn-hr-se-tt-an, var(--_tst-dn-hr-se-tt-an));
-      --_sf-hr-ls: var(--_ctm-dn-hr-se-lr-sg, var(--_tst-dn-hr-se-lr-sg));
-      --_sf-hr-lh: var(--_ctm-dn-hr-se-le-ht, var(--_tst-dn-hr-se-le-ht));
-
-      --_sf-hr-ic-wt: var(--_ctm-dn-hr-se-in-se, var(--_tst-dn-hr-se-in-se));
-      --_sf-hr-ic-ht: var(--_ctm-dn-hr-se-in-se, var(--_tst-dn-hr-se-in-se));
-      --_sf-hr-ic-st: var(--_ctm-dn-hr-se-in-c1, var(--_tst-dn-hr-se-in-c1));
-      --_sf-hr-tt-dn: var(--_ctm-dn-hr-se-ue, var(--_tst-dn-hr-se-in-c1));
-
-      &[data-hover-show-shadow="false"] {
-        --_hover-show-shadow: none;
-      }
-      &[data-hover-show-icon="false"] {
-        --_hover-show-icon: none;
-      }
-    }
-    &[data-show-icon="false"] {
-      --_show-icon: none;
-    }
-    &[data-element-style="Icon"] {
-      &[data-icon-position="left"] {
-        --_sf-jc: start;
-      }
-      &[data-icon-position="right"] {
-        --_sf-jc: end;
-      }
-      &[data-icon-position="center"] {
-        --_sf-jc: center;
-      }
+      width: 100%;
     }
-
-    .btn__with__text {
-      background-color: var(--_sf-hr-bd-cr, var(--_ctm-dn-dt-se-bd-cr, var(--_tst-dn-dt-se-bd-cr)));
-      // padding: var(--_ctm-lt-pg, var(--_tst-lt-pg));
-      padding: var(--_sf-element-vt-pd) var(--_sf-element-hr-pd);
-      display: flex;
-      flex-direction: var(--_sf-fd-bn);
-      align-items: center;
-      // justify-content: var(--_sf-jc, center);
-      justify-content: var(--_ctm-lt-tt-an, center);
-      gap: var(--_ctm-lt-gp, var(--_tst-lt-gp));
-
+    table {
+      font-family: arial, sans-serif;
+      border-collapse: collapse;
       width: 100%;
       height: 100%;
+    }
 
-      border-radius: var(--_sf-hr-br-br, var(--_ctm-dn-dt-se-br-rs, var(--s_tst-dn-dt-se-br-rs)));
-      box-shadow: var(
-        --_hover-show-shadow,
-        var(
-          --_sf-hr-bx-sw,
-          var(
-            --_show-shadow,
-            var(--_ctm-dn-dt-se-sw-ae, var(--_tst-dn-dt-se-sw-ae))
-              var(--_ctm-dn-dt-se-sw-br, var(--_tst-dn-dt-se-sw-br))
-              var(--_ctm-dn-dt-se-sw-sd, var(--_tst-dn-dt-se-sw-sd))
-              var(--_ctm-dn-dt-se-sw-cr, var(--_tst-dn-dt-se-sw-cr))
-          )
-        )
-      );
-      &[data-show-border="true"] {
-        border-color: var(--_sf-hr-br-cr, var(--_ctm-dn-dt-se-br-cr, var(--_tst-dn-dt-se-br-cr)));
-        border-style: var(--_sf-hr-br-st, var(--_ctm-dn-dt-se-br-se, var(--_tst-dn-dt-se-br-se)));
-        border-width: var(--_sf-hr-br-wt, var(--_ctm-dn-dt-se-br-wh, var(--_tst-dn-dt-se-br-wh)));
-      }
-      // &.btn__with__text__icon {
-      //   justify-content: center;
-      //   // gap: 10px;
-      // }
-      // & > span {
-      //   align-items: center;
-      //   justify-content: center;
-      //   &.txt {
-      //     display: flex;
-      //     color: var(--_sf-hr-fc, var(--_ctm-dn-dt-se-cr, var(--_tst-dn-dt-se-cr)));
-      //     font-family: var(--_sf-hr-ff, var(--_ctm-dn-dt-se-ft-fy, var(--_tst-dn-dt-se-ft-fy))),
-      //       sans-serif;
-      //     font-size: var(--_sf-hr-fs, var(--_ctm-dn-dt-se-ft-se, var(--_tst-dn-dt-se-ft-se)));
-      //     font-weight: var(--_sf-hr-fw, var(--_ctm-dn-dt-se-ft-wt, var(--_tst-dn-dt-se-ft-wt)));
-      //     font-style: var(
-      //       --_sf-hr-ft,
-      //       var(--_ctm-dn-dt-se-ft-se-ic, var(--_tst-dn-dt-se-ft-se-ic))
-      //     );
-      //     text-align: var(--_sf-hr-ta, var(--_ctm-dn-dt-se-tt-an, var(--_tst-dn-dt-se-tt-an)));
-      //     letter-spacing: var(--_sf-hr-ls, var(--_ctm-dn-dt-se-lr-sg, var(--_tst-dn-dt-se-lr-sg)));
-      //     line-height: var(--_sf-hr-lh, var(--_ctm-dn-dt-se-le-ht, var(--_tst-dn-dt-se-le-ht)));
-      //     text-decoration: var(--_sf-hr-tt-dn, var(--_ctm-dn-dt-se-ue, var(--_tst-dn-dt-se-le-ht)));
-      //     // --_sf-hr-tt-dn: var(--_ctm-dn-hr-se-ue, var(--_tst-dn-hr-se-in-c1));
-      //   }
-
-      //   &.icon {
-      //     display: var(--_hover-show-icon, var(--_show-icon, flex));
-      //     svg {
-      //       width: var(--_sf-hr-ic-wt, var(--_ctm-dn-dt-se-in-se, var(--_tst-dn-dt-se-in-se)));
-      //       height: var(--_sf-hr-ic-ht, var(--_ctm-dn-dt-se-in-se, var(--_tst-dn-dt-se-in-se)));
-      //       path {
-      //         stroke: var(--_sf-hr-ic-st, var(--_ctm-dn-dt-se-in-c1, var(--_tst-dn-dt-se-in-c1)));
-      //       }
-      //     }
-      //   }
-      //   &[data-element-style="Text"] {
-      //     display: inline-block;
-      //     width: 100%;
-      //   }
-      // }
-
-      .txt {
-        display: flex;
-        color: var(--_sf-hr-fc, var(--_ctm-dn-dt-se-cr, var(--_tst-dn-dt-se-cr)));
-        font-family: var(--_sf-hr-ff, var(--_ctm-dn-dt-se-ft-fy, var(--_tst-dn-dt-se-ft-fy))),
-          sans-serif;
-        font-size: var(--_sf-hr-fs, var(--_ctm-dn-dt-se-ft-se, var(--_tst-dn-dt-se-ft-se)));
-        font-weight: var(--_sf-hr-fw, var(--_ctm-dn-dt-se-ft-wt, var(--_tst-dn-dt-se-ft-wt)));
-        font-style: var(--_sf-hr-ft, var(--_ctm-dn-dt-se-ft-se-ic, var(--_tst-dn-dt-se-ft-se-ic)));
-        text-align: var(--_sf-hr-ta, var(--_ctm-dn-dt-se-tt-an, var(--_tst-dn-dt-se-tt-an)));
-        letter-spacing: var(--_sf-hr-ls, var(--_ctm-dn-dt-se-lr-sg, var(--_tst-dn-dt-se-lr-sg)));
-        line-height: var(--_sf-hr-lh, var(--_ctm-dn-dt-se-le-ht, var(--_tst-dn-dt-se-le-ht)));
-        text-decoration: var(--_sf-hr-tt-dn, var(--_ctm-dn-dt-se-ue, var(--_tst-dn-dt-se-le-ht)));
-        // --_sf-hr-tt-dn: var(--_ctm-dn-hr-se-ue, var(--_tst-dn-hr-se-in-c1));
-      }
+    td,
+    th {
+      border: 1px solid #dddddd;
+      text-align: center;
+      padding: 8px;
+    }
 
-      .icon {
-        display: var(--_hover-show-icon, var(--_show-icon, flex));
-        svg {
-          width: var(--_sf-hr-ic-wt, var(--_ctm-dn-dt-se-in-se, var(--_tst-dn-dt-se-in-se)));
-          height: var(--_sf-hr-ic-ht, var(--_ctm-dn-dt-se-in-se, var(--_tst-dn-dt-se-in-se)));
-          path {
-            stroke: var(--_sf-hr-ic-st, var(--_ctm-dn-dt-se-in-c1, var(--_tst-dn-dt-se-in-c1)));
-          }
-        }
-      }
-      [data-element-style="Text"] {
-        display: inline-block;
-        width: 100%;
-      }
+    tr:nth-child(even) {
+      // background-color: #dddddd;
     }
   }
 }

package/dist/table.scss

@@ -3,7 +3,8 @@
 
 [data-div-type="element"] {
   &[data-element-type="table"] {
-    width: var(--_sf-nw-wh, var(--_tst-lt-wh));
+    // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
+    width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
     margin: var(--_ctm-lt-mn, --_tst-lt-mn);
     // aspect-ratio: 1 / var(--_sf-aspect-ratio);
     // --_aspect-ratio: calc(

package/dist/text-temp.scss

@@ -8,7 +8,8 @@
     // margin: var(--_lt-mn);
     // padding: var(--_lt-pg);
     // width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
-    width: var(--_sf-nw-wh, var(--_tst-lt-wh));
+    // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
+    width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
     margin: var(--_ctm-lt-mn, --_tst-lt-mn);
     // height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
     // height: ;

package/dist/types/builder/elements/bulk-variant-picker/index.d.ts

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

package/dist/types/builder/elements/common.d.ts

@@ -24,4 +24,5 @@ export interface CMSElementInterface {
     responsiveBehaviour: ResponsiveBehaviourTypes;
     builderData?: any;
     controls?: any;
+    sort?: number;
 }

package/dist/types/builder/elements/product-image/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 ProductImageStyleProperties 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: () => ProductImageStyleProperties;
+export interface CMSProductImageInterface extends Omit<CMSElementInterface, "attributes"> {
+    attributes: {
+        HTML: Pick<CMSHTMLAttributes, GlobalImageAttributes>;
+        BUILDER: Pick<BuilderAttributes, ImageBuilderAttributes>;
+        CUSTOM: any;
+    };
+    styles: ProductImageStyleProperties;
+    childrenStyles?: CommonStyleProperties;
+}

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

@@ -0,0 +1,37 @@
+import { CMSHTMLAttributes } from "../../../global/attributes";
+import { CommonStyleProperties } from "../../../global/style-properties";
+import { ResponsiveBehaviourTypes } from "../../../global/types";
+import { BuilderAttributes } from "../common";
+export interface StackStyleProperties extends CommonStyleProperties {
+    maxWidth: string;
+    maxHeight: string;
+    gridArea: string;
+    boxSizing: string;
+    gridTemplateRows: string;
+    gridTemplateColumns: string;
+}
+export declare const getDefaultStyles: () => StackStyleProperties;
+export interface CommonStackElementAttributes extends CMSHTMLAttributes {
+    role?: string;
+    ariaLabel?: string;
+    ariaDescribedBy?: string;
+    id?: string;
+    className?: string;
+    lang?: string;
+    dataMeta?: string;
+}
+export interface StackElementInterface {
+    id?: string | number;
+    uniqueKey?: string | number;
+    attributes?: {
+        BUILDER?: Pick<BuilderAttributes, "dataDivType" | "dataType" | "dataElementType" | "dataDropElement">;
+        HTML?: CommonStackElementAttributes;
+        CUSTOM?: any;
+    };
+    styles?: StackStyleProperties;
+    editedStyles?: CommonStyleProperties;
+    responsiveBehaviour: ResponsiveBehaviourTypes;
+    children: any;
+    childIds: any[];
+    previewImage?: string;
+}

package/dist/types/builder/elements/uom-selector/index.d.ts

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

package/dist/types/builder/elements/variant-picker/index.d.ts

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

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

@@ -32,11 +32,13 @@ export declare enum CMSToolIdTypes {
     cmsPageLoader = "cms-page-loader",
     dataDropElement = "cms-drop-element",
     containerWrapper = "cms-container-wrapper",
+    stackWrapper = "cms-stack-wrapper",
     cmsSubElementLayer = "cms-sub-element-layer",
     editorHeader = "cms-editor-header",
     cmsAddElementBodyLayer = "data-global-temp-body",
     cmsIframePreview = "cms-iframe-preview",
-    cmsIframeMainElement = "cms-iframe-preview-main"
+    cmsIframeMainElement = "cms-iframe-preview-main",
+    duplicateElement = "cms-element-duplicate"
 }
 export declare enum CMSElementSelectors {
     iframeSelector = "iframe[data-title='iframe__playground']",
@@ -73,7 +75,9 @@ export declare enum CMSElementSelectors {
     layerDataDropElement = "div[data-layer-drop-element='cms-drop-element']",
     layerSubElement = "div[data-cms-tool='cms-sub-element-layer']",
     editorHeader = "div[data-cms-tool='cms-editor-header']",
-    cmsAddElementBodyLayer = "div[data-cms-tool='data-global-temp-body']"
+    cmsAddElementBodyLayer = "div[data-cms-tool='data-global-temp-body']",
+    duplicateElement = "div[data-cms-tool='cms-element-duplicate']",
+    stackWrapper = "div[data-div-type='cms-stack-wrapper']"
 }
 export declare enum CMSToolAttributes {
     id = "data-cms-tool",
@@ -119,3 +123,7 @@ export declare enum CMSComponentImportTypeEnum {
     PREVIEW = 2,
     WEBSITE = 3
 }
+export declare enum CMSStackDisplayTypeEnum {
+    HORIZONTAL = "horizontal",
+    VERTICAL = "vertical"
+}

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

@@ -33,4 +33,9 @@ import * as shippingEstimatorSchema from "./elements/shippingEstimator/index";
 import * as productPromotionsSchema from "./elements/product-promotions/index";
 import * as amountEstimatorSchema from "./elements/amount-estimator/index";
 import * as quantitySelectorSchema from "./elements/quantity-selector/index";
-export { commonFunctions, interfaces, enums, sectionSchema, gridSchema, cmsTypes, textSchema, ElementEditSchema, imageSchema, videoSChema, socialIconsSchema, buttonSchema, gallerySliderSchema, tabSchema, tableSchema, faqSchema, codeSchema, embedSchema, scrollSchema, countdownSchema, imageHotspotSchema, mapSchema, containerSchema, priceSchema, productActionsSchema, volumePricingSchema, pickupLocationsSchema, storeLocationsSchema, productInventorySchema, paymentMethodsSchema, productHighlightsSchema, shippingEstimatorSchema, productPromotionsSchema, amountEstimatorSchema, quantitySelectorSchema, };
+import * as stackSchema from "./elements/stack/index";
+import * as uomSelectorSchema from "./elements/uom-selector/index";
+import * as variantPickerSchema from "./elements/variant-picker/index";
+import * as bulkVariantPickerSchema from "./elements/bulk-variant-picker/index";
+import * as productImageSchema from "./elements/product-image/index";
+export { commonFunctions, interfaces, enums, sectionSchema, gridSchema, cmsTypes, textSchema, ElementEditSchema, imageSchema, videoSChema, socialIconsSchema, buttonSchema, gallerySliderSchema, tabSchema, tableSchema, faqSchema, codeSchema, embedSchema, scrollSchema, countdownSchema, imageHotspotSchema, mapSchema, containerSchema, priceSchema, productActionsSchema, volumePricingSchema, pickupLocationsSchema, storeLocationsSchema, productInventorySchema, paymentMethodsSchema, productHighlightsSchema, shippingEstimatorSchema, productPromotionsSchema, amountEstimatorSchema, quantitySelectorSchema, stackSchema, uomSelectorSchema, variantPickerSchema, bulkVariantPickerSchema, productImageSchema, };

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

@@ -0,0 +1,118 @@
+import { CMSIBCommonInterface } from "../../interfaces/global";
+import { CMSElementEditPopupDesignInterface, CMSElementEditPopupInterface, CMSElementEditPopupLayoutInterface } from "./common";
+interface selfLayoutInterface {
+    selectorKey: string;
+    optionSelection: CMSIBCommonInterface;
+    displayStyle: CMSIBCommonInterface;
+    displayOutOfStockValues: CMSIBCommonInterface;
+    notifyMeButton: CMSIBCommonInterface;
+    quantitySelectorForVariantSelector: CMSIBCommonInterface;
+    dividerBetweenItems: CMSIBCommonInterface;
+    optionTitleValueSpacing: CMSIBCommonInterface;
+    remainingDisplayStyle: CMSIBCommonInterface;
+    allowUserToSearch: CMSIBCommonInterface;
+    allowUserToFilter: CMSIBCommonInterface;
+    swatchTypeDisplayStyle: {
+        selectorKey: string;
+        displayValues: CMSIBCommonInterface;
+        itemPadding: CMSIBCommonInterface;
+        itemSpacing: CMSIBCommonInterface;
+        maxItemsToDisplay: CMSIBCommonInterface;
+        overflowItems: CMSIBCommonInterface;
+        swatchImageType: CMSIBCommonInterface;
+    };
+    singleSelectDisplayStyle: {
+        selectorKey: string;
+        displayValues: CMSIBCommonInterface;
+        itemSpacing: CMSIBCommonInterface;
+        itemPadding: CMSIBCommonInterface;
+        maxItemsToDisplay: CMSIBCommonInterface;
+        overflowItems: CMSIBCommonInterface;
+        imageBehaviour: CMSIBCommonInterface;
+        itemsPerRow: CMSIBCommonInterface;
+        itemContentAlignment: CMSIBCommonInterface;
+        overflowDirection: CMSIBCommonInterface;
+    };
+    dropdownDisplayStyle: {
+        selectorKey: string;
+        dropdownOptionsSpacing: CMSIBCommonInterface;
+        dropdownOptionsPadding: CMSIBCommonInterface;
+        dropdownStyle: CMSIBCommonInterface;
+        optionAndListSpacing: CMSIBCommonInterface;
+        dropdownListItemSpacing: CMSIBCommonInterface;
+        dropdownListItemPadding: CMSIBCommonInterface;
+        dividerBetweenListItems: CMSIBCommonInterface;
+        maxItemsToDisplay: CMSIBCommonInterface;
+        overflowItems: CMSIBCommonInterface;
+    };
+    groupedOptionsDisplayStyle: {
+        selectorKey: string;
+        groupsDisplayStyle: CMSIBCommonInterface;
+        groupSpacing: CMSIBCommonInterface;
+        groupPadding: CMSIBCommonInterface;
+        groupHeaderAndOptionSpacing: CMSIBCommonInterface;
+        tabDirection: CMSIBCommonInterface;
+        tabLayout: CMSIBCommonInterface;
+        tabAlignment: CMSIBCommonInterface;
+        tabSpacing: CMSIBCommonInterface;
+        tabAndContainerSpacing: CMSIBCommonInterface;
+        tabHorizontalPadding: CMSIBCommonInterface;
+        tabVerticalPadding: CMSIBCommonInterface;
+        containerPadding: CMSIBCommonInterface;
+        overflowItems: CMSIBCommonInterface;
+        tabRowSpacing: CMSIBCommonInterface;
+        expandIconPositon: CMSIBCommonInterface;
+        expandFirstItemByDefault: CMSIBCommonInterface;
+        allowMultipleOpenItems: CMSIBCommonInterface;
+        itemDividers: CMSIBCommonInterface;
+        accordionSpacing: CMSIBCommonInterface;
+        accordionAndContainerSpacing: CMSIBCommonInterface;
+        accordionHorizontalPadding: CMSIBCommonInterface;
+        accordionVerticalPadding: CMSIBCommonInterface;
+        groupAndContainerSpacing: CMSIBCommonInterface;
+        groupHorizontalPadding: CMSIBCommonInterface;
+        groupVerticalPadding: CMSIBCommonInterface;
+        canCollapseGroups: CMSIBCommonInterface;
+    };
+    matrixDisplayStyle: {
+        selectorKey: string;
+        header: CMSIBCommonInterface;
+        headerHeight: CMSIBCommonInterface;
+        rowHeight: CMSIBCommonInterface;
+        headerDivider: CMSIBCommonInterface;
+        rowDivider: CMSIBCommonInterface;
+        columnDivider: CMSIBCommonInterface;
+        alternativeRowColors: CMSIBCommonInterface;
+        headerCellPadding: CMSIBCommonInterface;
+        rowCellPadding: CMSIBCommonInterface;
+        contentAlignment: CMSIBCommonInterface;
+        rowsPerPage: CMSIBCommonInterface;
+        overflowControl: CMSIBCommonInterface;
+        paginationType: CMSIBCommonInterface;
+        paginationAliginment: CMSIBCommonInterface;
+        showMoreRows: CMSIBCommonInterface;
+    };
+    groupedMatrixDisplayStyle: {
+        selectorKey: string;
+        groupsDisplayStyle: CMSIBCommonInterface;
+        groupSpacing: CMSIBCommonInterface;
+        groupPadding: CMSIBCommonInterface;
+        groupHeaderAndOptionSpacing: CMSIBCommonInterface;
+    };
+}
+interface selfDesignInterface {
+    selectorKey: string;
+}
+export declare enum BulkVariantPickerSelectorKeysEnum {
+    LAYOUT = "layout",
+    CONTENT = "content",
+    DESIGN = "design",
+    SWATFH_TYPE_DISPLAY_STYLE = "swatchTypeDisplayStyle",
+    SINGLE_SELECT_DISPLAY_STYLE = "singleSelectDisplayStyle",
+    DROPDOWN_DISPLAY_STYLE = "dropdownDisplayStyle",
+    GROUPED_OPTION_DISPLAY_STYLE = "groupedOptionsDisplayStyle",
+    MATRIX_DISPLAY_STYLE = "matrixDisplayStyle",
+    GROUPED_MATRIX_DISPLAY_STYLE = "groupedMatrixDisplayStyle"
+}
+export declare const getDefaultData: () => CMSElementEditPopupInterface<selfLayoutInterface & CMSElementEditPopupLayoutInterface, selfDesignInterface & CMSElementEditPopupDesignInterface>;
+export {};

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

@@ -31,4 +31,9 @@ import * as shippingEstimator from "./shippingEstimator";
 import * as productPromotions from "./productPromotions";
 import * as amountEstimator from "./amountEstimator";
 import * as quantitySelector from "./quantitySelector";
-export { section, grid, common, image, button, slideShowLayouter, tabs, video, table, gallerySlider, social, faq, code, text, embed, buttonV2, scroll, countdown, imageHotspot, map, container, price, productActions, volumePricing, pickupLocations, storeLocations, productInventory, paymentMethods, productHighlights, shippingEstimator, productPromotions, amountEstimator, quantitySelector, };
+import * as stack from "./stack";
+import * as uomSelector from "./uomSelector";
+import * as variantPicker from "./variantPicker";
+import * as bulkVariantPicker from "./bulkVariantPicker";
+import * as productImage from "./product-image";
+export { section, grid, common, image, button, slideShowLayouter, tabs, video, table, gallerySlider, social, faq, code, text, embed, buttonV2, scroll, countdown, imageHotspot, map, container, price, productActions, volumePricing, pickupLocations, storeLocations, productInventory, paymentMethods, productHighlights, shippingEstimator, productPromotions, amountEstimator, quantitySelector, stack, uomSelector, variantPicker, bulkVariantPicker, productImage, };

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

@@ -0,0 +1,112 @@
+import { CMSIBCommonInterface, CMSIBSizeInterface } from "../../interfaces/global";
+import { CMSElementEditPopupDesignInterface, CMSElementEditPopupInterface, CMSElementEditPopupLayoutInterface } from "./common";
+interface selfLayoutInterface {
+    selectorKey: string;
+    displayStyle: CMSIBCommonInterface;
+    itemsPerSlide: CMSIBSizeInterface;
+    itemGap: CMSIBSizeInterface;
+    rowGap: CMSIBSizeInterface;
+    sliderControl: CMSIBCommonInterface;
+    controlPosition: CMSIBCommonInterface;
+    loopImages: CMSIBCommonInterface;
+    sliderDisplayScrollbar: CMSIBCommonInterface;
+    autoplay: CMSIBCommonInterface;
+    autoplayStyle: CMSIBCommonInterface;
+    autoplayDuration: CMSIBSizeInterface;
+    sliderSpeed: CMSIBSizeInterface;
+}
+export interface selfDesignInterface {
+    selectorKey: string;
+    galleryWidgetStyle: {
+        selectorKey: string;
+        backgroundColor: CMSIBCommonInterface;
+        borderColor: CMSIBCommonInterface;
+        borderStyle: CMSIBCommonInterface;
+        borderPerSlide: CMSIBCommonInterface;
+        showBorder: CMSIBCommonInterface;
+        showShadow: CMSIBCommonInterface;
+        shadowColor: CMSIBCommonInterface;
+        blur: CMSIBCommonInterface;
+        spread: CMSIBCommonInterface;
+        angle: CMSIBCommonInterface;
+        borderRadius: CMSIBCommonInterface;
+        [key: string]: any;
+    };
+    galleryWidgetLayout: {
+        selectorKey: string;
+        galleryTextAndItemAlignment: CMSIBCommonInterface;
+        galleryTextAndItemSpacing: CMSIBCommonInterface;
+        galleryTitleAndDescriptionSpacing: CMSIBCommonInterface;
+        [key: string]: any;
+    };
+    galleryWidgetTextContainerDesign: {
+        [key: string]: any;
+    };
+    galleryWidgetTextContainerLayout: {
+        [key: string]: any;
+    };
+    itemStyle: {
+        selectorKey: string;
+        backgroundColor: CMSIBCommonInterface;
+        borderColor: CMSIBCommonInterface;
+        borderStyle: CMSIBCommonInterface;
+        borderPerSlide: CMSIBCommonInterface;
+        showBorder: CMSIBCommonInterface;
+        showShadow: CMSIBCommonInterface;
+        shadowColor: CMSIBCommonInterface;
+        blur: CMSIBCommonInterface;
+        spread: CMSIBCommonInterface;
+        angle: CMSIBCommonInterface;
+        borderRadius: CMSIBCommonInterface;
+        [key: string]: any;
+    };
+    itemLayout: {
+        selectorKey: string;
+        galleryTextAndItemAlignment: CMSIBCommonInterface;
+        textAndImageSpacing: CMSIBCommonInterface;
+        galleryTitleAndDescriptionSpacing: CMSIBCommonInterface;
+        [key: string]: any;
+    };
+    itemTextContainerDesign: {
+        [key: string]: any;
+    };
+    itemTextContainerLayout: {
+        [key: string]: any;
+    };
+    paginationArrows: {
+        selectorKey: string;
+        arrowIconStyle: CMSIBCommonInterface;
+        leftArrowIconStyle: CMSIBCommonInterface;
+        rightArrowIconStyle: CMSIBCommonInterface;
+        backgroundShape: CMSIBCommonInterface;
+        arrowSize: CMSIBCommonInterface;
+        arrowColor: CMSIBCommonInterface;
+    };
+    paginationDots: {
+        selectorKey: string;
+        dotSize: CMSIBCommonInterface;
+        currentDotColor: CMSIBCommonInterface;
+        otherDotColor: CMSIBCommonInterface;
+    };
+    paginationLine: {
+        selectorKey: string;
+        currentLineColor: CMSIBCommonInterface;
+        otherLineColor: CMSIBCommonInterface;
+        lineHeight: CMSIBCommonInterface;
+        lineWidth: CMSIBCommonInterface;
+    };
+}
+export declare enum SelectorKeysEnum {
+    LAYOUT = "layout",
+    DESIGN = "design",
+    GALLERY_WIDGET_STYLE = "gallery-widget-style",
+    GALLERY_LAYOUT = "gallery-layout",
+    ITEM_STYLE = "item-style",
+    PAGINATION_ARROWS = "pagination-arrows",
+    PAGINATION_DOTS = "pagination-dots",
+    PAGINATION_LINE = "pagination-lines",
+    MAP_WIDGET_TEXT_CONTAINER_DESIGN = "galleryWidgetTextContainerDesign",
+    MAP_WIDGET_TEXT_CONTAINER_LAYOUT = "galleryWidgetTextContainerLayout"
+}
+export declare const getDefaultData: () => CMSElementEditPopupInterface<selfLayoutInterface & CMSElementEditPopupLayoutInterface, selfDesignInterface & CMSElementEditPopupDesignInterface>;
+export {};