npm - @sc-360-v2/storefront-cms-library - Versions diffs - 0.4.8 → 0.4.10 - Mend

@sc-360-v2/storefront-cms-library 0.4.8 → 0.4.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

package/dist/breadcrumbs.scss +1 -0
package/dist/builder.js +1 -1
package/dist/checkout.scss +65 -131
package/dist/icons.js +1 -1
package/dist/index.js +1 -1
package/dist/product-actions.scss +168 -4
package/dist/types/builder/tools/element-edit/productActions.d.ts +1 -0
package/dist/user-elements.scss +19 -18
package/package.json +1 -1

package/dist/product-actions.scss CHANGED Viewed

@@ -78,10 +78,6 @@
       //   white-space: nowrap;
       // }
-      .show__more__btn__wrapper {
-        position: relative;
-      }
       .btn__with__text[data-btn-name="addToCart"] {
         justify-content: center;
         &[data-show-shadow="false"] {
@@ -2126,6 +2122,174 @@
       //       )
       //   );
       // }
+      .popover-container {
+        position: relative;
+        display: inline-block;
+        .popover-trigger {
+          cursor: pointer;
+          font-weight: 500;
+          color: #2b6cb0;
+        }
+        .popover-box {
+          // position: absolute;
+          // top: calc(100% + 10px);
+          // right: 0;
+          // background: white;
+          // padding: 12px 16px;
+          // box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
+          // border-radius: 8px;
+          // min-width: 150px;
+          // z-index: 10;
+          position: absolute;
+          // border: 1px solid #ccc;
+          min-width: 150px;
+          max-width: 200px;
+          z-index: 1000;
+          // left: 40px;
+          // top: 0;
+          // right: -125%;
+          padding: 8px;
+          border-radius: 4px;
+        }
+        .popover-box {
+          display: flex;
+          flex-direction: column;
+          // width: 100%;
+          gap: prepareMediaVariable(--_ctm-dn-pr-se-im-gp);
+          background-color: var(
+            --_ctm-mob-dn-pr-se-bd-cr,
+            var(--_ctm-tab-dn-pr-se-bd-cr, var(--_ctm-dn-pr-se-bd-cr))
+          );
+          border-color: var(
+            --_ctm-mob-dn-pr-se-br-cr,
+            var(--_ctm-tab-dn-pr-se-br-cr, var(--_ctm-dn-pr-se-br-cr))
+          );
+          border-style: var(
+            --_ctm-mob-dn-pr-se-br-se,
+            var(--_ctm-tab-dn-pr-se-br-se, var(--_ctm-dn-pr-se-br-se))
+          );
+          border-width: var(
+            --_ctm-mob-dn-pr-se-br-wh,
+            var(--_ctm-tab-dn-pr-se-br-wh, var(--_ctm-dn-pr-se-br-wh))
+          );
+          border-radius: var(
+            --_ctm-mob-dn-pr-se-br-rs,
+            var(--_ctm-tab-dn-pr-se-br-rs, var(--_ctm-dn-pr-se-br-rs))
+          );
+          box-shadow: var(
+            --_show-shadow,
+            var(
+                --_ctm-mob-dn-pr-se-sw-ae,
+                var(--_ctm-tab-dn-pr-se-sw-ae, var(--_ctm-dn-pr-se-sw-ae))
+              )
+              var(
+                --_ctm-mob-dn-pr-se-sw-br,
+                var(--_ctm-tab-dn-pr-se-sw-br, var(--_ctm-dn-pr-se-sw-br))
+              )
+              var(
+                --_ctm-mob-dn-pr-se-sw-sd,
+                var(--_ctm-tab-dn-pr-se-sw-sd, var(--_ctm-dn-pr-se-sw-sd))
+              )
+              var(
+                --_ctm-mob-dn-pr-se-sw-cr,
+                var(--_ctm-tab-dn-pr-se-sw-cr, var(--_ctm-dn-pr-se-sw-cr))
+              )
+          );
+          padding: var(
+            --_ctm-mob-dn-pr-se-pg,
+            var(--_ctm-tab-dn-pr-se-pg, var(--_ctm-dn-pr-se-pg))
+          );
+        }
+        .popover-box strong {
+          display: block;
+          margin-bottom: 6px;
+          font-weight: bold;
+        }
+        .popover-arrow {
+          position: absolute;
+          top: 8px;
+          left: -5px;
+          width: 12px;
+          min-height: 12px;
+          // background-color: var(
+          //   --_ctm-mob-dn-pr-se-bd-cr,
+          //   var(--_ctm-tab-dn-pr-se-bd-cr, var(--_ctm-dn-pr-se-bd-cr))
+          // );
+          transform: rotate(-45deg);
+          box-shadow: -1px -1px 0px
+            var(
+              --_ctm-mob-dn-pr-se-br-cr,
+              var(--_ctm-tab-dn-pr-se-br-cr, var(--_ctm-dn-pr-se-br-cr))
+            );
+        }
+        .popover_item {
+          // padding-inline: var(--_sf-cd-gp);
+          color: var(--_ctm-mob-dn-pr-se-cr, var(--_ctm-tab-dn-pr-se-cr, var(--_ctm-dn-pr-se-cr)));
+          font-family:
+            var(
+              --_ctm-mob-dn-pr-se-ft-fy,
+              var(--_ctm-tab-dn-pr-se-ft-fy, var(--_ctm-dn-pr-se-ft-fy))
+            ),
+            sans-serif;
+          font-size: var(
+            --_ctm-mob-dn-pr-se-ft-se,
+            var(--_ctm-tab-dn-pr-se-ft-se, var(--_ctm-dn-pr-se-ft-se))
+          );
+          font-weight: var(
+            --_ctm-mob-dn-pr-se-ft-wt,
+            var(--_ctm-tab-dn-pr-se-ft-wt, var(--_ctm-dn-pr-se-ft-wt))
+          );
+          font-style: var(
+            --_ctm-mob-dn-pr-se-ft-se-ic,
+            var(--_ctm-tab-dn-pr-se-ft-se-ic, var(--_ctm-dn-pr-se-ft-se-ic))
+          );
+          text-align: var(
+            --_ctm-mob-dn-pr-se-tt-an,
+            var(--_ctm-tab-dn-pr-se-tt-an, var(--_ctm-dn-pr-se-tt-an))
+          );
+          letter-spacing: var(
+            --_ctm-mob-dn-pr-se-lr-sg,
+            var(--_ctm-tab-dn-pr-se-lr-sg, var(--_ctm-dn-pr-se-lr-sg))
+          );
+          line-height: var(
+            --_ctm-mob-dn-pr-se-le-ht,
+            var(--_ctm-tab-dn-pr-se-le-ht, var(--_ctm-dn-pr-se-le-ht-dc))
+          );
+          text-decoration: var(
+            --_ctm-mob-dn-pr-se-ue,
+            var(--_ctm-tab-dn-pr-se-ue, var(--_ctm-dn-pr-se-ue))
+          );
+          // margin-left: 10px;
+        }
+      }
+      &[data-display-style="Stack Vertically"] {
+        .popover-box {
+          left: 100%;
+          transform: translate(0%);
+          margin-left: 6px;
+          top: 0;
+        }
+      }
+      &[data-display-style="Stack Horizontally"] {
+        .popover-box {
+          right: 0;
+          margin-top: 6px;
+        }
+      }
     }
   }
 }

package/dist/types/builder/tools/element-edit/productActions.d.ts CHANGED Viewed

@@ -44,6 +44,7 @@ export interface selfDesignInterface {
     download: any;
     hoverState: any;
     more: any;
+    popoverStyle: any;
 }
 export declare enum ButtonSelectorKeysEnum {
     HOVER_STATE = "hover",

package/dist/user-elements.scss CHANGED Viewed

@@ -935,10 +935,9 @@ $resizeActive: '[data-cms-element-resizer="true"]';
         gap: prepareMediaVariable(--_ctm-lt-qa-im-sg);
         .quota_label_wrapper {
           display: flex;
+          flex-direction: column;
           min-width: 109px;
           gap: 10px;
-          align-items: center;
           .quota_label {
             display: flex;
@@ -1816,6 +1815,8 @@ $resizeActive: '[data-cms-element-resizer="true"]';
             top: 0;
             padding: 8px;
             border-radius: 4px;
+            max-height: 150px;
+            overflow-y: auto;
           }
           .popover-box {
@@ -1953,20 +1954,20 @@ $resizeActive: '[data-cms-element-resizer="true"]';
         var(--_ctm-tab-dn-dn-se-wt-se-bd-cr, var(--_ctm-dn-dn-se-wt-se-bd-cr))
       );
-      border-color: var(
-        --_ctm-mob-dn-dn-se-wt-se-br-cr,
-        var(--_ctm-tab-dn-dn-se-wt-se-br-cr, var(--_ctm-dn-dn-se-wt-se-br-cr))
-      );
+      // border-color: var(
+      //   --_ctm-mob-dn-dn-se-wt-se-br-cr,
+      //   var(--_ctm-tab-dn-dn-se-wt-se-br-cr, var(--_ctm-dn-dn-se-wt-se-br-cr))
+      // );
-      border-style: var(
-        --_ctm-mob-dn-dn-se-wt-se-br-se,
-        var(--_ctm-tab-dn-dn-se-wt-se-br-se, var(--_ctm-dn-dn-se-wt-se-br-se))
-      );
+      // border-style: var(
+      //   --_ctm-mob-dn-dn-se-wt-se-br-se,
+      //   var(--_ctm-tab-dn-dn-se-wt-se-br-se, var(--_ctm-dn-dn-se-wt-se-br-se))
+      // );
-      border-width: var(
-        --_ctm-mob-dn-dn-se-wt-se-br-wh,
-        var(--_ctm-tab-dn-dn-se-dn-se-wt-se-br-wh, var(--_ctm-dn-dn-se-wt-se-br-wh))
-      );
+      // border-width: var(
+      //   --_ctm-mob-dn-dn-se-wt-se-br-wh,
+      //   var(--_ctm-tab-dn-dn-se-dn-se-wt-se-br-wh, var(--_ctm-dn-dn-se-wt-se-br-wh))
+      // );
       border-radius: var(
         --_ctm-mob-dn-dn-se-wt-se-br-rs,
@@ -2439,10 +2440,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
             z-index: var(--_higher-zIndex);
             max-height: 200px;
             overflow-y: auto;
-            margin-top: var(
-              --_ctm-mob-dn-dn-se-lt-ss-gp-bn-is,
-              var(--_ctm-tab-dn-dn-se-lt-ss-gp-bn-is, var(--_ctm-dn-dn-se-lt-ss-gp-bn-is))
-            );
+            // margin-top: var(
+            //   --_ctm-mob-dn-dn-se-lt-ss-gp-bn-is,
+            //   var(--_ctm-tab-dn-dn-se-lt-ss-gp-bn-is, var(--_ctm-dn-dn-se-lt-ss-gp-bn-is))
+            // );
             gap: var(
               --_ctm-mob-dn-dn-se-lt-ss-gp-bn-is,
               var(--_ctm-tab-dn-dn-se-lt-ss-gp-bn-is, var(--_ctm-dn-dn-se-lt-ss-gp-bn-is))

package/package.json CHANGED Viewed

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