@sc-360-v2/storefront-cms-library 0.4.18 → 0.4.20

package/dist/table.scss

@@ -69,6 +69,26 @@
         --_show-table-shadow: none;
       }
     }
+    &[data-show-header-border="true"] {
+      .table__container {
+        table {
+          thead {
+            border-color: var(
+              --_ctm-mob-dn-te-hr-br-cr,
+              var(--_ctm-tab-dn-te-hr-br-cr, var(--_ctm-dn-te-hr-br-cr))
+            );
+            border-style: var(
+              --_ctm-mob-dn-te-hr-br-se,
+              var(--_ctm-tab-dn-te-hr-br-se, var(--_ctm-dn-te-hr-br-se))
+            );
+            border-width: var(
+              --_ctm-mob-dn-te-hr-br-wh,
+              var(--_ctm-tab-dn-te-hr-br-wh, var(--_ctm-dn-te-hr-br-wh))
+            );
+          }
+        }
+      }
+    }
     &[data-table-border="true"] {
       .table__container {
         border-color: var(
@@ -204,6 +224,8 @@
     }
 
     .table__wrapper {
+      overflow-x: auto;
+      -webkit-overflow-scrolling: touch;
       padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg, var(--_tst-lt-pg))));
 
       background-color: var(
@@ -227,6 +249,7 @@
       width: 100%;
 
       .table__container {
+        overflow-x: auto;
         background-color: var(
           --_ctm-mob-dn-te-bd-cr,
           var(--_ctm-tab-dn-te-bd-cr, var(--_ctm-dn-te-bd-cr))
@@ -258,11 +281,22 @@
         // height: 100%;
         text-align: var(--_ctm-mob-lt-ct-at, var(--_ctm-tab-lt-ct-at, var(--_ctm-lt-ct-at)));
 
+        @media (max-width: 1024px) {
+          min-width: 700px;
+        }
+
+        @media (max-width: 768px) {
+          min-width: 600px;
+        }
+
         th,
         td {
           border: none;
+          white-space: nowrap;
         }
         thead {
+          position: sticky;
+          top: 0;
           background-color: var(
             --_ctm-mob-dn-te-hr-bd-cr,
             var(--_ctm-tab-dn-te-hr-bd-cr, var(--_ctm-dn-te-hr-bd-cr))

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

@@ -11,6 +11,7 @@ interface selfLayoutInterface {
     noOfItemToShow: CMSIBCommonInterface;
     searchPlaceholderText: CMSIBCommonInterface;
     buttonPosition: CMSIBCommonInterface;
+    radioButtonItemGap: CMSIBCommonInterface;
 }
 interface selfDesignInterface {
     selectorKey: string;
@@ -18,6 +19,10 @@ interface selfDesignInterface {
         selectorKey: string;
         [key: string]: any;
     };
+    radioButton: {
+        selectorKey: string;
+        [key: string]: any;
+    };
     storeLocationsButton: {
         selectorKey: string;
         [key: string]: any;
@@ -86,7 +91,8 @@ export declare enum PickupLocationsSelectorKeysEnum {
     SHOW_MORE_ITEMS_BUTTON = "showMoreItemsButtons",
     HOVER_STATE = "hover",
     DEFAULT_STATE = "default",
-    WIDGET_STYLE = "widgetStyle"
+    WIDGET_STYLE = "widgetStyle",
+    RADIO_BUTTON = "radioButton"
 }
 export declare const getDefaultData: () => CMSElementEditPopupInterface<selfLayoutInterface & CMSElementEditPopupLayoutInterface, selfDesignInterface & CMSElementEditPopupDesignInterface>;
 export {};

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

@@ -11,6 +11,7 @@ interface selfLayoutInterface {
     overflowItems: CMSIBCommonInterface;
     noOfItemToShow: CMSIBCommonInterface;
     searchPlaceholderText: CMSIBCommonInterface;
+    radioButtonItemGap: CMSIBCommonInterface;
 }
 interface selfDesignInterface {
     selectorKey: string;
@@ -18,6 +19,10 @@ interface selfDesignInterface {
         selectorKey: string;
         [key: string]: any;
     };
+    radioButton: {
+        selectorKey: string;
+        [key: string]: any;
+    };
     storeLocationsButton: {
         selectorKey: string;
         [key: string]: any;
@@ -86,7 +91,8 @@ export declare enum StoreLocationSelectorKeysEnum {
     HOVER_STATE = "hover",
     DEFAULT_STATE = "default",
     DATA_CONNECTOR = "dataConnector",
-    WIDGET_STYLE = "widgetStyle"
+    WIDGET_STYLE = "widgetStyle",
+    RADIO_BUTTON = "radioButton"
 }
 export declare const getDefaultData: () => CMSElementEditPopupInterface<selfLayoutInterface & CMSElementEditPopupLayoutInterface, selfDesignInterface & CMSElementEditPopupDesignInterface>;
 export {};

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

@@ -56,8 +56,8 @@ export interface TableControlInterface {
         blur?: CMSIBCommonInterface;
     };
     tableHeader?: {
-        selectorKey?: string;
-        backgroundColor?: CMSIBCommonInterface;
+        selectorKey: string;
+        [key: string]: any;
     };
     headerText?: {
         selectorKey?: string;

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

@@ -64,7 +64,8 @@ export declare enum VideoSelectorKeysEnum {
     VIDEO_WIDGET_LAYOUT = "videoWidgetLayout",
     VIDEO_WIDGET_DESIGN = "videoWidgetDesign",
     VIDEO_TEXT_LAYOUT = "videoTextLayout",
-    VIDEO_TEXT_CONTAINER_DESIGN = "videoTextContainerDesign"
+    VIDEO_TEXT_CONTAINER_DESIGN = "videoTextContainerDesign",
+    VIDEO_PLAYER = "videoPlayer"
 }
 export interface SelectorKeys {
     LAYOUT: string;
@@ -391,6 +392,20 @@ export declare const getDefaultData: () => {
             iconSize: import("../../interfaces/global").CMSIBSizeInterface;
             iconColor: CMSIBCommonInterface;
         };
+        videoPlayer: {
+            selectorKey: VideoSelectorKeysEnum;
+            backgroundColor: CMSIBCommonInterface;
+            borderColor: CMSIBCommonInterface;
+            borderStyle: CMSIBCommonInterface;
+            borderPerSlide: import("../../interfaces/global").CSSPaddingValues;
+            showBorder: CMSIBCommonInterface;
+            showShadow: CMSIBCommonInterface;
+            shadowColor: CMSIBCommonInterface;
+            blur: import("../../interfaces/global").CMSIBSizeInterface;
+            spread: import("../../interfaces/global").CMSIBSizeInterface;
+            angle: import("../../interfaces/global").CMSIBSizeInterface;
+            borderRadius: import("../../interfaces/global").CSSPaddingValues;
+        };
         videoTextLayout: {
             selectorKey: VideoSelectorKeysEnum;
             textVerticalPadding: {

package/dist/video.scss

@@ -14,6 +14,7 @@
           )
       )
     );
+    height: var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht)));
     margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
     // aspect-ratio: 1 / var(--_sf-aspect-ratio);
     --_aspect-ratio: calc(
@@ -80,7 +81,86 @@
         }
       }
     }
-
+    &[data-show-video-border="true"] {
+      .video__container {
+        .video__thumbnail {
+          .placeholder__img {
+            border-color: var(
+              --_ctm-mob-dn-vo-pr-br-cr,
+              var(--_ctm-tab-dn-vo-pr-br-cr, var(--_ctm-dn-vo-pr-br-cr))
+            );
+            border-style: var(
+              --_ctm-mob-dn-vo-pr-br-se,
+              var(--_ctm-tab-dn-vo-pr-br-se, var(--_ctm-dn-vo-pr-br-se))
+            );
+            border-width: var(
+              --_ctm-mob-dn-vo-pr-br-wh,
+              var(--_ctm-tab-dn-vo-pr-br-wh, var(--_ctm-dn-vo-pr-br-wh))
+            );
+          }
+        }
+        .video__data {
+          video {
+            border-color: var(
+              --_ctm-mob-dn-vo-pr-br-cr,
+              var(--_ctm-tab-dn-vo-pr-br-cr, var(--_ctm-dn-vo-pr-br-cr))
+            );
+            border-style: var(
+              --_ctm-mob-dn-vo-pr-br-se,
+              var(--_ctm-tab-dn-vo-pr-br-se, var(--_ctm-dn-vo-pr-br-se))
+            );
+            border-width: var(
+              --_ctm-mob-dn-vo-pr-br-wh,
+              var(--_ctm-tab-dn-vo-pr-br-wh, var(--_ctm-dn-vo-pr-br-wh))
+            );
+          }
+        }
+      }
+    }
+    &[data-show-video-shadow="true"] {
+      .video__container {
+        .video__thumbnail {
+          .placeholder__img {
+            box-shadow: var(
+                --_ctm-mob-dn-vo-pr-sw-ae,
+                var(--_ctm-tab-dn-vo-pr-sw-ae, var(--_ctm-dn-vo-pr-sw-ae))
+              )
+              var(
+                --_ctm-mob-dn-vo-pr-sw-br,
+                var(--_ctm-tab-dn-vo-pr-sw-br, var(--_ctm-dn-vo-pr-sw-br))
+              )
+              var(
+                --_ctm-mob-dn-vo-pr-sw-sd,
+                var(--_ctm-tab-dn-vo-pr-sw-sd, var(--_ctm-dn-vo-pr-sw-sd))
+              )
+              var(
+                --_ctm-mob-dn-vo-pr-sw-cr,
+                var(--_ctm-tab-dn-vo-pr-sw-cr, var(--_ctm-dn-vo-pr-sw-cr))
+              );
+          }
+        }
+        .video__data {
+          video {
+            box-shadow: var(
+                --_ctm-mob-dn-vo-pr-sw-ae,
+                var(--_ctm-tab-dn-vo-pr-sw-ae, var(--_ctm-dn-vo-pr-sw-ae))
+              )
+              var(
+                --_ctm-mob-dn-vo-pr-sw-br,
+                var(--_ctm-tab-dn-vo-pr-sw-br, var(--_ctm-dn-vo-pr-sw-br))
+              )
+              var(
+                --_ctm-mob-dn-vo-pr-sw-sd,
+                var(--_ctm-tab-dn-vo-pr-sw-sd, var(--_ctm-dn-vo-pr-sw-sd))
+              )
+              var(
+                --_ctm-mob-dn-vo-pr-sw-cr,
+                var(--_ctm-tab-dn-vo-pr-sw-cr, var(--_ctm-dn-vo-pr-sw-cr))
+              );
+          }
+        }
+      }
+    }
     &[data-widget-border="true"] {
       .video__container {
         border-color: var(
@@ -308,7 +388,19 @@
         video {
           // max-width: 100%;
           width: prepareMediaVariable(--_ctm-lt-vo-wh, 100%);
-          height: prepareMediaVariable(--_ctm-lt-vo-ht, auto);
+          height: prepareMediaVariable(--_ctm-lt-vo-ht, 100%);
+          // border-radius: var(
+          //   --_ctm-mob-dn-vo-wt-dn-br-rs,
+          //   var(--_ctm-tab-dn-vo-wt-dn-br-rs, var(--_ctm-dn-vo-wt-dn-br-rs))
+          // );
+          background-color: var(
+            --_ctm-mob-dn-vo-pr-bd-cr,
+            var(--_ctm-tab-dn-vo-pr-bd-cr, var(--_ctm-dn-vo-pr-bd-cr))
+          );
+          border-radius: var(
+            --_ctm-mob-dn-vo-pr-br-rs,
+            var(--_ctm-tab-dn-vo-pr-br-rs, var(--_ctm-dn-vo-pr-br-rs))
+          );
         }
       }
       .video__thumbnail {
@@ -319,7 +411,17 @@
         .placeholder__img {
           // width: 100%;
           width: prepareMediaVariable(--_ctm-lt-vo-wh, 100%);
-          height: prepareMediaVariable(--_ctm-lt-vo-ht, auto);
+          height: prepareMediaVariable(--_ctm-lt-vo-ht, 100%);
+
+          background-color: var(
+            --_ctm-mob-dn-vo-pr-bd-cr,
+            var(--_ctm-tab-dn-vo-pr-bd-cr, var(--_ctm-dn-vo-pr-bd-cr))
+          );
+          border-radius: var(
+            --_ctm-mob-dn-vo-pr-br-rs,
+            var(--_ctm-tab-dn-vo-pr-br-rs, var(--_ctm-dn-vo-pr-br-rs))
+          );
+
           // position: absolute;
           // left: 0;
           // top: 0;

package/dist/widget.scss

@@ -28,7 +28,7 @@
 @use "./volume-pricing.scss";
 @use "./product-inventory.scss";
 @use "./store-locations.scss";
-@use "./pickup-locations.scss";
+// @use "./pickup-locations.scss";
 @use "./product-highlights.scss";
 @use "./payment-methods.scss";
 @use "./shipping-estimator.scss";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sc-360-v2/storefront-cms-library",
-  "version": "0.4.18",
+  "version": "0.4.20",
   "main": "/dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {