@sc-360-v2/storefront-cms-library 0.3.30 → 0.3.32

package/dist/menu-v2.scss

@@ -26,7 +26,7 @@ $defaultValues: (
       position: absolute;
       left: 0;
       width: 100%;
-      top: 100%;
+      top: calc(100% + var(--_ctm-dn-hr-os-cr-ot-y, 0px));
       z-index: 2;
       visibility: hidden;
       opacity: 0;
@@ -37,8 +37,12 @@ $defaultValues: (
       gap: prepareMediaVariable(--_ctm-lt-im-gp);
 
       &:is([data-hamburger-active="true"] > *) {
-        animation: animThree var(--_transition-duration) var(--_transition-timing-function) 1
-          forwards alternate;
+        // animation: animThree var(--_transition-duration) var(--_transition-timing-function) 1
+        //   forwards alternate;
+        visibility: visible;
+        opacity: 1;
+        max-height: var(--_min-submenu-height, 650px);
+        overflow-y: auto;
       }
 
       & > #{$menuItem} {
@@ -329,10 +333,12 @@ $defaultValues: (
                       width: 100%;
                     }
 
-                    max-height: 0px;
-                    overflow: clip;
-                    animation: animTwo var(--_transition-duration)
-                      var(--_transition-timing-function) 1 forwards alternate;
+                    // max-height: 0px;
+                    // overflow: clip;
+                    max-height: 500px;
+                    overflow-y: auto;
+                    // animation: animTwo var(--_transition-duration)
+                    //   var(--_transition-timing-function) 1 forwards alternate;
 
                     @keyframes animTwo {
                       100% {

package/dist/modal.scss

@@ -375,10 +375,15 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
 
         .actions {
           display: flex;
+          align-items: center;
           gap: 12px;
+          svg {
+            width: 16px;
+            height: 16px;
+          }
           span {
-            width: 36px;
-            height: 36px;
+            width: 32px;
+            height: 32px;
             cursor: pointer;
             font-size: 16px;
             color: $text-light;
@@ -388,12 +393,14 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
             justify-content: center;
 
             &:hover {
-              color: $black;
+              color: var(--_gray-900);
+              background-color: var(--_gray-100);
+              border-radius: 4px;
             }
           }
           .sc_modal-close svg {
-            width: 14px !important;
-            height: 14px !important;
+            width: 20px !important;
+            height: 20px !important;
           }
         }
       }
@@ -444,6 +451,7 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
       position: sticky;
       bottom: 0;
       display: flex;
+      align-items: center;
       justify-content: space-between;
       padding: 16px 22px;
       border-top: 1px solid $gray-300;
@@ -536,7 +544,7 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
       background-color: $white;
       display: flex;
       align-items: center; /* Align items vertically in the toolbar */
-      padding: 12px 16px; /* Add padding to the toolbar */
+      padding-inline-start: 16px; /* Add padding to the toolbar */
       border-radius: $radius 0 0 $radius; /* Rounded left corners */
       gap: 16px;
     }
@@ -562,6 +570,7 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
 
       &:hover {
         background: $primary-hover;
+        
       }
     }
 
@@ -574,6 +583,29 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
         font-size: 16px;
         color: $text-light;
         transition: color 0.2s;
+        width: 32px;
+        height: 32px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        &:hover {
+          background-color: var(--_gray-50);
+          border-radius: 4px;
+          svg path {
+          stroke: var(--_gray-900)
+        }
+        }
+        [title="maximize"] {
+          svg {
+            width: 14px;
+          height: 14px;
+          }
+        }
+
+        svg {
+          width: 20px;
+          height: 20px;
+        }
 
         &:hover {
           color: $black;

package/dist/quick-order-pad.scss

@@ -17,7 +17,6 @@ $input-padding: 10px 12px;
 // .quick-order-main Styles
 .quick-order-main {
   display: flex;
-  // padding: 12px;
   flex-direction: column;
   gap: 16px;
   width: 100%;
@@ -29,6 +28,7 @@ $input-padding: 10px 12px;
     align-items: center;
     padding: 12px;
     border-bottom: 0.5px solid var(--Gray-200, #eaecf0);
+    flex-shrink: 0;
 
     .quick-order-product-dropdown-section {
       width: 320px;
@@ -122,9 +122,11 @@ $input-padding: 10px 12px;
         align-items: center;
         justify-content: center;
 
+        
+
         svg {
-          width: 20px;
-          height: 20px;
+          width: 16px;
+          height: 16px;
           path {
             stroke: #fff;
           }
@@ -145,3 +147,12 @@ $input-padding: 10px 12px;
     line-height: 24px;
   }
 }
+
+@keyframes rotate360 {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}

package/dist/shareCartSideBar.scss

@@ -16,7 +16,6 @@ $shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
   width: 100%;
   height: 100%;
   top: 0;
-  background: rgba(112, 112, 112, 0.13);
   z-index: 9999;
 
   // Container overlay
@@ -67,7 +66,7 @@ $shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
     display: flex;
     justify-content: space-between;
     align-items: center;
-    padding: 16px 24px;
+    padding: 16px 16px 16px 24px;
     position: sticky;
     top: 0px;
     background: var(--_base-white);
@@ -80,11 +79,19 @@ $shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
     }
 
     .close-btn {
-      font-size: 24px;
-      background: none;
-      border: none;
       cursor: pointer;
-      color: $text-color;
+      width: 32px;
+      height: 32px;
+      display: flex;
+    justify-content: center;
+    align-items: center;
+    &:hover {
+      background-color: var(--_gray-50);
+      border-radius: 6px;
+      svg path {
+        stroke: var(--_gray-900);
+      }
+    }
     }
   }
 

package/dist/submit-quote.scss

@@ -50,14 +50,14 @@
           font-size: 16px;
           font-weight: 500;
           color: var(--_gray-900);
-          &:after {
-            width: 1px;
-            height: 10px;
-            background: var(--_gray-600);
-            display: inline-block;
-            content: "";
-            margin-left: 16px;
-          }
+          // &:after {
+          //   width: 1px;
+          //   height: 10px;
+          //   background: var(--_gray-600);
+          //   display: inline-block;
+          //   content: "";
+          //   margin-left: 16px;
+          // }
         }
 
         .quote-item__meta {
@@ -66,20 +66,20 @@
           font-size: 14px;
           font-weight: 400;
           color: var(--_gray-600);
-          // span {
-          //   &::after {
-          //     width: 1px;
-          //     height: 10px;
-          //     background: var(--_gray-600);
-          //     content: "";
-          //     display: inline-block;
-          //     margin-left: 6px;
-          //   }
-          //   &:last-child::after {
-          //     width: 0 !important;
-          //     margin: 0 !important;
-          //   }
-          // }
+          span {
+            &::after {
+              width: 1px;
+              height: 10px;
+              background: var(--_gray-600);
+              content: "";
+              display: inline-block;
+              margin-left: 6px;
+            }
+            &:last-child::after {
+              width: 0 !important;
+              margin: 0 !important;
+            }
+          }
         }
       }
 
@@ -111,7 +111,7 @@
             padding: 8px 12px;
             font-size: 15px;
             border: 1px solid #ccc;
-            border-radius: 6px;
+            border-radius: 4px;
             outline: none;
             width: 130px;
 
@@ -120,7 +120,10 @@
               box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.3);
             }
           }
-
+          .input-with-prefix:focus-within {
+            border-color: #007bff; /* Or any highlight color */
+            box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.2);
+          }
           .input-with-prefix {
             display: flex;
             align-items: center;
@@ -129,11 +132,13 @@
             overflow: hidden;
             width: 130px;
             height: 40px;
-
             span {
               padding: 0 8px;
               font-size: 15px;
               color: var(--_gray-500);
+              svg{
+                vertical-align: middle;
+              }
             }
 
             input {

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

@@ -0,0 +1,27 @@
+import { CMSHTMLAttributes } from "../../../global/attributes";
+import { CommonStyleProperties } from "../../../global/style-properties";
+import { AlignSelfValue, BoxSizingValue, GlobalImageAttributes, GridAreaValue, HeightValue, ImageBuilderAttributes, JustifySelfValue, MaxHeightValue, MaxWidthValue, MinHeightValue, MinWidthValue, PaddingValue } from "../../../global/types";
+import { BuilderAttributes, CMSElementInterface } from "../common";
+export interface LoaderStyleProperties 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: () => LoaderStyleProperties;
+export interface CMSLoaderInterface extends Omit<CMSElementInterface, "attributes"> {
+    attributes: {
+        HTML: Pick<CMSHTMLAttributes, GlobalImageAttributes>;
+        BUILDER: Pick<BuilderAttributes, ImageBuilderAttributes>;
+        CUSTOM: any;
+    };
+    styles: LoaderStyleProperties;
+    childrenStyles?: CommonStyleProperties;
+    content: string;
+}

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

@@ -328,6 +328,7 @@ export declare const CMSElementsListEnum: {
     BADGE: string;
     CART_ATTRIBUTES: string;
     LANGUAGE_MENU: string;
+    LOADER: string;
 };
 export declare enum CMSResponsiveModeEnums {
     DESKTOP = "desktop",

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

@@ -83,4 +83,5 @@ import * as filterResultsSchema from "./elements/filter-results/index";
 import * as productSizeChartSchema from "./elements/product-sizechart/index";
 import * as badgeSchema from "./elements/badge/index";
 import * as cartAttributesSchema from "./elements/cart-attributes/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, cartSummarySchema, toasterSchema, spotlightSchema, productCustomizationsSchema, iconListSchema, orderStatusSchema, menuV2Schema, menuItemSchema, layouterProSchema, layouterProItemSchema, userElementsSchema, filterResultsSchema, productSizeChartSchema, badgeSchema, cartAttributesSchema, };
+import * as loaderSchema from "./elements/loader/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, cartSummarySchema, toasterSchema, spotlightSchema, productCustomizationsSchema, iconListSchema, orderStatusSchema, menuV2Schema, menuItemSchema, layouterProSchema, layouterProItemSchema, userElementsSchema, filterResultsSchema, productSizeChartSchema, badgeSchema, cartAttributesSchema, loaderSchema, };

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

@@ -35,6 +35,14 @@ export declare const getDefaultData: () => {
         margin: import("../../interfaces/global").CSSPaddingValues | undefined;
         padding: import("../../interfaces/global").CSSPaddingValues | undefined;
         overflowContent: import("../../interfaces/global").CMSIBCommonInterface | undefined;
+        signInTemplate: {
+            value: string;
+            propertyType: CMSElementEditTypes;
+        };
+        accountTemplate: {
+            value: string;
+            propertyType: CMSElementEditTypes;
+        };
         scrollDirection: import("../../interfaces/global").CMSIBCommonInterface | undefined;
         displayScrollbar: import("../../interfaces/global").CMSIBCommonInterface | undefined;
         positionType: import("../../interfaces/global").CMSIBCommonInterface | undefined;

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

@@ -97,4 +97,5 @@ import * as userElements from "./userElements";
 import * as badge from "./badge";
 import * as languageMenu from "./language-menu";
 import * as cartAttributes from "./cartAttributes";
-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, badge, cartAttributes, languageMenu, };
+import * as loader from "./loader";
+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, badge, cartAttributes, languageMenu, loader, };

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

@@ -0,0 +1,28 @@
+import { CMSIBCommonInterface, CMSIBSizeInterface } from "../../interfaces/global";
+import { CMSElementEditPopupDesignInterface, CMSElementEditPopupInterface, CMSElementEditPopupLayoutInterface } from "./common";
+interface selfLayoutInterface {
+    selectorKey: string;
+    loaderWidth: {
+        [key: string]: CMSIBSizeInterface | any;
+    };
+    loaderHeight: CMSIBSizeInterface;
+    showLoaderText: CMSIBCommonInterface;
+    loadingText: CMSIBCommonInterface;
+    customLoader: CMSIBCommonInterface;
+    mode: CMSIBCommonInterface;
+    defaultLoaderType: CMSIBCommonInterface;
+}
+export interface selfDesignInterface {
+    selectorKey: string;
+    backgroundOverlay: CMSIBCommonInterface;
+    loaderColor: CMSIBCommonInterface;
+}
+export declare enum loaderSelectorKeysEnum {
+    LAYOUT = "layout",
+    DESIGN = "design",
+    LOADER_ICON = "loaderIcon",
+    MINI_LOADER_TEXT = "miniLoaderText",
+    LOADER_ITEMS_COUNT = "loaderItemsCount"
+}
+export declare const getDefaultData: () => CMSElementEditPopupInterface<selfLayoutInterface & CMSElementEditPopupLayoutInterface, selfDesignInterface & CMSElementEditPopupDesignInterface>;
+export {};

package/dist/widget.scss

@@ -116,3 +116,4 @@
 @use "./submit-quote.scss";
 @use "./cartAttributes.scss";
 @use "./language-selector.scss";
+@use "./empty-states.scss";

package/package.json

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