@sc-360-v2/storefront-cms-library 0.5.50 → 0.5.52

package/dist/text-temp-v2.scss

@@ -5,6 +5,7 @@
 $ie: '[contenteditable="true"]';
 $re: '[data-cms-tool="cms-element-resizer"]';
 $dblclk: '[data-cms-tt-ee-dbl-clkd="true"]';
+$overflowSelector: ".flex__overflow";
 
 [data-div-type="element"] {
   &[data-element-type="text"] {
@@ -42,6 +43,7 @@ $dblclk: '[data-cms-tt-ee-dbl-clkd="true"]';
     &#{$dblclk} {
       --_sf-op-bm-zz: 1;
       --_sf-vt-bm-zz: visible;
+
       #{$re} {
         display: none !important;
       }
@@ -51,6 +53,7 @@ $dblclk: '[data-cms-tt-ee-dbl-clkd="true"]';
       white-space: normal;
       unicode-bidi: plaintext;
     }
+
     &[data-haslink="true"] {
       cursor: pointer;
     }
@@ -63,7 +66,10 @@ $dblclk: '[data-cms-tt-ee-dbl-clkd="true"]';
       padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
       border-color: var(--_ctm-mob-dn-br-cr, var(--_ctm-tab-dn-br-cr, var(--_ctm-dn-br-cr)));
       border-style: var(--_ctm-mob-dn-br-se, var(--_ctm-tab-dn-br-se, var(--_ctm-dn-br-se)));
-      border-width: var(--_ctm-mob-dn-br-wh, var(--_ctm-tab-dn-br-wh, var(--_ctm-dn-br-wh)));
+      border-width: var(
+        --_show-border,
+        var(--_ctm-mob-dn-br-wh, var(--_ctm-tab-dn-br-wh, var(--_ctm-dn-br-wh)))
+      );
       border-radius: var(--_ctm-mob-dn-br-rs, var(--_ctm-tab-dn-br-rs, var(--_ctm-dn-br-rs)));
 
       box-shadow: var(
@@ -82,10 +88,15 @@ $dblclk: '[data-cms-tt-ee-dbl-clkd="true"]';
         }
       }
     }
+
     &[data-show-shadow="false"] {
       --_show-shadow: none;
     }
 
+    &[data-show-border="false"] {
+      --_show-border: 0;
+    }
+
     .text-element {
       // background-color: var(--_ctm-mob-dn-bd-cr, var(--_ctm-tab-dn-bd-cr, var(--_ctm-dn-bd-cr)));
       // padding: var(--_ctm-lt-pg, var(--_tst-lt-pg));
@@ -108,9 +119,11 @@ $dblclk: '[data-cms-tt-ee-dbl-clkd="true"]';
 
       // transform: scale(var(--_ctm-dn-zm-ie));
       scale: var(--_ctm-dn-zm-ie);
+
       &[data-flip-x="true"] {
         transform: scaleX(-1);
       }
+
       &[data-flip-y="true"] {
         transform: scaleY(-1);
       }
@@ -136,6 +149,10 @@ $dblclk: '[data-cms-tt-ee-dbl-clkd="true"]';
           word-break: prepareMediaVariable(--_ctm-dn-wd-bk);
         }
       }
+
+      &#{$overflowSelector} {
+        @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
+      }
     }
   }
 }

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

@@ -58,6 +58,11 @@ export declare const getDefaultData: () => {
             property: string;
             propertyType: CMSElementEditTypes;
         };
+        overflowItems: {
+            value: string;
+            property: string;
+            propertyType: CMSElementEditTypes;
+        };
         numOfItemsToLoad: {
             value: string;
             property: string;
@@ -69,11 +74,6 @@ export declare const getDefaultData: () => {
             property: string;
             propertyType: CMSElementEditTypes;
         };
-        collapseInTheMiddle: {
-            value: boolean;
-            property: string;
-            propertyType: CMSElementEditTypes;
-        };
         showMoreItems: {
             value: string;
             property: string;
@@ -152,6 +152,13 @@ export declare const getDefaultData: () => {
             characterSpacing: import("../../interfaces/global").CMSIBSizeInterface;
             lineHeight: import("../../interfaces/global").CMSIBSizeInterface;
             backgroundColor: CMSIBCommonInterface;
+            textTransform: {
+                value: string;
+                property: string;
+                propertyType: CMSElementEditTypes;
+            };
+            wordWrap: CMSIBCommonInterface;
+            wordBreak: CMSIBCommonInterface;
             borderColor: CMSIBCommonInterface;
             borderStyle: CMSIBCommonInterface;
             borderPerSlide: import("../../interfaces/global").CSSPaddingValues;
@@ -205,6 +212,13 @@ export declare const getDefaultData: () => {
             characterSpacing: import("../../interfaces/global").CMSIBSizeInterface;
             lineHeight: import("../../interfaces/global").CMSIBSizeInterface;
             backgroundColor: CMSIBCommonInterface;
+            textTransform: {
+                value: string;
+                property: string;
+                propertyType: CMSElementEditTypes;
+            };
+            wordWrap: CMSIBCommonInterface;
+            wordBreak: CMSIBCommonInterface;
             borderColor: CMSIBCommonInterface;
             borderStyle: CMSIBCommonInterface;
             borderPerSlide: import("../../interfaces/global").CSSPaddingValues;
@@ -258,6 +272,13 @@ export declare const getDefaultData: () => {
             characterSpacing: import("../../interfaces/global").CMSIBSizeInterface;
             lineHeight: import("../../interfaces/global").CMSIBSizeInterface;
             backgroundColor: CMSIBCommonInterface;
+            textTransform: {
+                value: string;
+                property: string;
+                propertyType: CMSElementEditTypes;
+            };
+            wordWrap: CMSIBCommonInterface;
+            wordBreak: CMSIBCommonInterface;
             borderColor: CMSIBCommonInterface;
             borderStyle: CMSIBCommonInterface;
             borderPerSlide: import("../../interfaces/global").CSSPaddingValues;

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

@@ -23,6 +23,7 @@ export interface selfDesignInterface {
         angle: CMSIBCommonInterface;
         borderRadius: CMSIBCommonInterface;
         shadows: CMSIBSizeInterface;
+        itemGap: CMSIBSizeInterface;
     };
     cartIcon: {
         selectorKey: string;
@@ -68,6 +69,12 @@ export interface selfDesignInterface {
         textAlignDesc: CMSIBCommonInterface;
         characterSpacingDesc: CMSIBSizeInterface | undefined;
         lineHeightDesc: CMSIBCommonInterface;
+        textTransform: CMSIBCommonInterface;
+        wordWrap: CMSIBCommonInterface;
+        wordBreak: CMSIBCommonInterface;
+        textTransformDesc: CMSIBCommonInterface;
+        wordWrapDesc: CMSIBCommonInterface;
+        wordBreakDesc: CMSIBCommonInterface;
     };
     cartItemsCount: {
         selectorKey: string;

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

@@ -59,7 +59,6 @@ export interface selfDesignInterface {
         borderStyle: CMSIBCommonInterface;
         borderColor: CMSIBCommonInterface;
         borderPerSlide: CMSIBCommonInterface;
-        borderRadius: CMSIBCommonInterface;
         showShadow: CMSIBCommonInterface;
         shadowColor: CMSIBCommonInterface;
         angle: CMSIBCommonInterface;

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

@@ -24,6 +24,7 @@ interface selfLayoutInterface {
     autoplayDuration: CMSIBSizeInterface;
     sliderSpeed: CMSIBSizeInterface;
     fitOptions: CMSIBCommonInterface;
+    imageMagnifierOptions: CMSIBCommonInterface;
     objectPosition: CMSIBCommonInterface;
     thumbnailPlacement: CMSIBSizeInterface;
     thumbnailWidth: CMSIBSizeInterface;

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

@@ -34,6 +34,7 @@ export interface QuickLinksControlInterface {
     margin?: CMSIBCommonInterface;
     padding?: CMSIBCommonInterface;
     alignment?: CMSIBCommonInterface;
+    itemsAlignment?: CMSIBCommonInterface;
     itemSpacing?: ControlInterface;
     iconSize?: CMSIBCommonInterface;
     positionType?: CMSIBCommonInterface;
@@ -99,6 +100,11 @@ export declare const getDefaultData: () => {
             value: string;
             propertyType: CMSElementEditTypes;
         };
+        itemsAlignment: {
+            value: string;
+            property: string;
+            propertyType: CMSElementEditTypes;
+        };
         gapBetweenItems: {
             value: string;
             unit: number;

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

@@ -43,6 +43,7 @@ interface selfLayoutInterface {
         value: string | number | any;
         unit: CMSCSSUnitTypesEnums;
     };
+    arrowIconColor: CMSIBCommonInterface;
     dotSize: Pick<CMSIBCommonInterface, "property" | "propertyType"> & {
         value: string | number | any;
         unit: CMSCSSUnitTypesEnums;
@@ -65,7 +66,6 @@ export interface selfDesignInterface {
     repeaterWidget: any;
     buttonStyle: any;
     gridViewControlStyle: any;
-    adStyle: any;
 }
 export declare enum selfSelectorKeysEnum {
     LAYOUT = "layout",

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

@@ -23,67 +23,10 @@ export interface selfDesignInterface {
             propertyType: CMSElementEditTypes;
         };
     };
-    searchBar: {
-        selectorKey: string;
-        backgroundColor: CMSIBCommonInterface;
-        borderColor: CMSIBCommonInterface;
-        borderStyle: CMSIBCommonInterface;
-        borderPerSlide: CMSIBCommonInterface;
-        showBorder: CMSIBCommonInterface;
-        showShadow: CMSIBCommonInterface;
-        shadowColor: CMSIBCommonInterface;
-        blur: CMSIBCommonInterface;
-        spread: CMSIBCommonInterface;
-        angle: CMSIBCommonInterface;
-        borderRadius: CMSIBCommonInterface;
-        itemGap: CMSIBCommonInterface;
-        theme: CMSIBCommonInterface;
-        font: CMSIBCommonInterface;
-        fontSize: CMSIBCommonInterface;
-        textColor: CMSIBCommonInterface;
-        bold: CMSIBCommonInterface;
-        italic: CMSIBCommonInterface;
-        linethrough: CMSIBCommonInterface;
-        underline: CMSIBCommonInterface;
-        textAlign: CMSIBCommonInterface;
-        characterSpacing: CMSIBCommonInterface;
-        lineHeight: CMSIBCommonInterface;
-    };
-    searchIcon: {
-        selectorKey: string;
-        showIcon: CMSIBCommonInterface | undefined;
-        iconSize: CMSIBCommonInterface;
-        iconColor: CMSIBCommonInterface;
-        icon: CMSIBCommonInterface;
-    };
-    searchBarFocus: {
-        selectorKey: string;
-        backgroundColor: CMSIBCommonInterface;
-        borderColor: CMSIBCommonInterface;
-        borderStyle: CMSIBCommonInterface;
-        borderPerSlide: CMSIBCommonInterface;
-        showBorder: CMSIBCommonInterface;
-        showShadow: CMSIBCommonInterface;
-        shadowColor: CMSIBCommonInterface;
-        blur: CMSIBCommonInterface;
-        spread: CMSIBCommonInterface;
-        angle: CMSIBCommonInterface;
-        borderRadius: CMSIBCommonInterface;
-    };
-    placeholderText: {
-        selectorKey: string;
-        theme: CMSIBCommonInterface;
-        font: CMSIBCommonInterface;
-        fontSize: CMSIBCommonInterface;
-        textColor: CMSIBCommonInterface;
-        bold: CMSIBCommonInterface;
-        italic: CMSIBCommonInterface;
-        linethrough: CMSIBCommonInterface;
-        underline: CMSIBCommonInterface;
-        textAlign: CMSIBCommonInterface;
-        characterSpacing: CMSIBCommonInterface;
-        lineHeight: CMSIBCommonInterface;
-    };
+    searchBar: any;
+    searchIcon: any;
+    searchBarFocus: any;
+    placeholderText: any;
     buttonStyles: any;
 }
 export declare enum searchSelectorKeysEnum {

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

@@ -25,6 +25,16 @@ export declare const getDefaultData: () => {
             property: string;
             propertyType: CMSElementEditTypes;
         };
+        displayContent: {
+            value: string;
+            property: string;
+            propertyType: CMSElementEditTypes;
+        };
+        contentAlignment: {
+            value: string;
+            property: string;
+            propertyType: CMSElementEditTypes;
+        };
         alignItems: {
             value: string;
             property: string;
@@ -41,7 +51,7 @@ export declare const getDefaultData: () => {
             property: string;
             propertyType: CMSElementEditTypes;
         };
-        tabContainerSpacing: {
+        tabContainerGap: {
             value: number;
             unit: number;
             property: string;
@@ -119,6 +129,39 @@ export declare const getDefaultData: () => {
         tabs: {
             selectorKey: SelectorKeysEnum;
             defaultState: {
+                showIcon: {
+                    value?: any;
+                    property?: any;
+                    propertyType?: any;
+                    isReadOnly?: boolean | undefined;
+                    parentRef?: string | undefined;
+                };
+                iconSize: {
+                    unit?: string | number | undefined;
+                    value?: any;
+                    property?: any;
+                    propertyType?: any;
+                    isReadOnly?: boolean | undefined;
+                    parentRef?: string | undefined;
+                };
+                iconColor: {
+                    value?: any;
+                    property?: any;
+                    propertyType?: any;
+                    isReadOnly?: boolean | undefined;
+                    parentRef?: string | undefined;
+                };
+                verticalAlignment: {
+                    value: string;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
+                iconGap: {
+                    value: number;
+                    unit: CMSCSSUnitTypesEnums;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
                 theme: CMSIBCommonInterface;
                 font: CMSIBCommonInterface;
                 fontSize: import("../../interfaces/global").CMSIBSizeInterface;
@@ -130,6 +173,24 @@ export declare const getDefaultData: () => {
                 textAlign: CMSIBCommonInterface;
                 characterSpacing: import("../../interfaces/global").CMSIBSizeInterface;
                 lineHeight: import("../../interfaces/global").CMSIBSizeInterface;
+                textTransform: {
+                    value: string;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
+                wordWrap: CMSIBCommonInterface;
+                wordBreak: CMSIBCommonInterface;
+                textOverflow: {
+                    value: boolean;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
+                numberOfDisplayedLines: {
+                    unit: CMSCSSUnitTypesEnums;
+                    value: number;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
                 borderColor: CMSIBCommonInterface;
                 borderStyle: CMSIBCommonInterface;
                 borderPerSlide: import("../../interfaces/global").CSSPaddingValues;
@@ -162,6 +223,39 @@ export declare const getDefaultData: () => {
                 selectorKey: SelectorKeysEnum;
             };
             hoverState: {
+                showIcon: {
+                    value?: any;
+                    property?: any;
+                    propertyType?: any;
+                    isReadOnly?: boolean | undefined;
+                    parentRef?: string | undefined;
+                };
+                iconSize: {
+                    unit?: string | number | undefined;
+                    value?: any;
+                    property?: any;
+                    propertyType?: any;
+                    isReadOnly?: boolean | undefined;
+                    parentRef?: string | undefined;
+                };
+                iconColor: {
+                    value?: any;
+                    property?: any;
+                    propertyType?: any;
+                    isReadOnly?: boolean | undefined;
+                    parentRef?: string | undefined;
+                };
+                verticalAlignment: {
+                    value: string;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
+                iconGap: {
+                    value: number;
+                    unit: CMSCSSUnitTypesEnums;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
                 theme: CMSIBCommonInterface;
                 font: CMSIBCommonInterface;
                 fontSize: import("../../interfaces/global").CMSIBSizeInterface;
@@ -173,6 +267,24 @@ export declare const getDefaultData: () => {
                 textAlign: CMSIBCommonInterface;
                 characterSpacing: import("../../interfaces/global").CMSIBSizeInterface;
                 lineHeight: import("../../interfaces/global").CMSIBSizeInterface;
+                textTransform: {
+                    value: string;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
+                wordWrap: CMSIBCommonInterface;
+                wordBreak: CMSIBCommonInterface;
+                textOverflow: {
+                    value: boolean;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
+                numberOfDisplayedLines: {
+                    unit: CMSCSSUnitTypesEnums;
+                    value: number;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
                 borderColor: CMSIBCommonInterface;
                 borderStyle: CMSIBCommonInterface;
                 borderPerSlide: import("../../interfaces/global").CSSPaddingValues;
@@ -205,6 +317,39 @@ export declare const getDefaultData: () => {
                 selectorKey: SelectorKeysEnum;
             };
             selectedState: {
+                showIcon: {
+                    value?: any;
+                    property?: any;
+                    propertyType?: any;
+                    isReadOnly?: boolean | undefined;
+                    parentRef?: string | undefined;
+                };
+                iconSize: {
+                    unit?: string | number | undefined;
+                    value?: any;
+                    property?: any;
+                    propertyType?: any;
+                    isReadOnly?: boolean | undefined;
+                    parentRef?: string | undefined;
+                };
+                iconColor: {
+                    value?: any;
+                    property?: any;
+                    propertyType?: any;
+                    isReadOnly?: boolean | undefined;
+                    parentRef?: string | undefined;
+                };
+                verticalAlignment: {
+                    value: string;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
+                iconGap: {
+                    value: number;
+                    unit: CMSCSSUnitTypesEnums;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
                 theme: CMSIBCommonInterface;
                 font: CMSIBCommonInterface;
                 fontSize: import("../../interfaces/global").CMSIBSizeInterface;
@@ -216,6 +361,24 @@ export declare const getDefaultData: () => {
                 textAlign: CMSIBCommonInterface;
                 characterSpacing: import("../../interfaces/global").CMSIBSizeInterface;
                 lineHeight: import("../../interfaces/global").CMSIBSizeInterface;
+                textTransform: {
+                    value: string;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
+                wordWrap: CMSIBCommonInterface;
+                wordBreak: CMSIBCommonInterface;
+                textOverflow: {
+                    value: boolean;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
+                numberOfDisplayedLines: {
+                    unit: CMSCSSUnitTypesEnums;
+                    value: number;
+                    property: string;
+                    propertyType: CMSElementEditTypes;
+                };
                 borderColor: CMSIBCommonInterface;
                 borderStyle: CMSIBCommonInterface;
                 borderPerSlide: import("../../interfaces/global").CSSPaddingValues;

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

@@ -184,6 +184,21 @@ export declare const getDefaultData: () => {
             };
         };
         videoWidgetDesign: {
+            textTransformDesc: {
+                value: string;
+                property: string;
+                propertyType: CMSElementEditTypes;
+            };
+            wordWrapDesc: {
+                value: string;
+                property: string;
+                propertyType: CMSElementEditTypes;
+            };
+            wordBreakDesc: {
+                value: string;
+                property: string;
+                propertyType: CMSElementEditTypes;
+            };
             themeDesc: {
                 value: string;
                 property: string;
@@ -285,6 +300,13 @@ export declare const getDefaultData: () => {
                 propertyType: CMSElementEditTypes;
                 parentRef: string;
             };
+            textTransform: {
+                value: string;
+                property: string;
+                propertyType: CMSElementEditTypes;
+            };
+            wordWrap: CMSIBCommonInterface;
+            wordBreak: CMSIBCommonInterface;
             theme: {
                 value: string;
                 property: string;
@@ -477,6 +499,16 @@ export declare const getDefaultData: () => {
                 propertyType: CMSElementEditTypes;
             };
             backgroundColor: CMSIBCommonInterface;
+            padding: any;
+            showBorder: CMSIBCommonInterface;
+            borderColor: CMSIBCommonInterface;
+            borderStyle: CMSIBCommonInterface;
+            borderPerSlide: import("../../interfaces/global").CSSPaddingValues;
+            showShadow: CMSIBCommonInterface;
+            shadowColor: CMSIBCommonInterface;
+            angle: import("../../interfaces/global").CMSIBSizeInterface;
+            spread: import("../../interfaces/global").CMSIBSizeInterface;
+            blur: import("../../interfaces/global").CMSIBSizeInterface;
         };
     };
 };

package/dist/upload-media.scss

@@ -296,6 +296,7 @@ $isPublish: "[data-is-publish='true']";
     align-items: center;
     border-radius: 6px;
     height: 170px;
+
     &:hover {
       border: 1px solid var(--_primary-200);
       box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
@@ -406,6 +407,7 @@ $isPublish: "[data-is-publish='true']";
       color 0.2s,
       border-color 0.2s,
       box-shadow 0.2s;
+
     &:focus-within {
       border: 1px solid var(--_primary-300);
       outline: 2px solid var(--_primary-50);
@@ -703,6 +705,7 @@ $isPublish: "[data-is-publish='true']";
     transition: border-color 0.15s ease;
     height: 170px;
     width: 100%;
+
     .sc-upload-media-assets__img-cntainer {
       height: 130px;
       width: 100%;
@@ -710,12 +713,14 @@ $isPublish: "[data-is-publish='true']";
       justify-content: center;
       align-items: center;
       overflow: hidden;
+
       &__image-thumb {
         max-width: 100%;
         max-height: 128px;
 
         object-fit: contain;
       }
+
       &__image-placeholder {
         width: 100%;
         height: 128px;
@@ -748,6 +753,7 @@ $isPublish: "[data-is-publish='true']";
     width: 100%;
     border-top: 1px solid var(--_gray-200);
     justify-content: space-between;
+
     span {
       white-space: nowrap;
       overflow: hidden;
@@ -827,6 +833,7 @@ $isPublish: "[data-is-publish='true']";
   0% {
     background-position: 200% 0;
   }
+
   100% {
     background-position: -200% 0;
   }
@@ -847,6 +854,7 @@ $isPublish: "[data-is-publish='true']";
       .sc-upload-media__tabs {
         padding: 8px 0px 0px 0px;
       }
+
       .sc-upload-media__footer {
         padding: 12px 0px 16px 0px;
       }
@@ -871,9 +879,13 @@ $isPublish: "[data-is-publish='true']";
   .p-dialog-content {
     padding: 0 !important;
     border-radius: 12px !important;
+
+    .sc-upload-media {
+      padding: 16px 24px;
+    }
   }
 }
 
-.upload-media-dialog + .p-dialog-mask {
+.upload-media-dialog+.p-dialog-mask {
   z-index: 99999 !important;
-}
+}