@sc-360-v2/storefront-cms-library 0.3.85 → 0.3.86

package/dist/my-templates.scss

@@ -53,272 +53,247 @@
     // }
   }
 
-     .template_wrapper {
-       width: 100%;
-  
-       .template_section {
-         width: 100%;
-         display: flex;
-         justify-content: space-between;
-         align-items: center;
-         margin-bottom: 24px;
-  
-         h2 {
-           font-size: 24px;
-         }
-  
-         .back_to_cart {
-           color: var(--_primary-400);
-  
-           &:hover {
-             text-decoration: underline;
-           }
-         }
-       }
-  
-       .template_body {
-         display: flex;
-         gap: 60px;
-         justify-content: space-between;
-  
-         .template_col_left {
-           width: 100%;
-           height: 400px;
-           background-color: var(--_base-white);
-  
-           .wishlist-modal {
-             display: flex;
-             flex-direction: column;
-             width: 100%;
-  
-             .wishlist-modal-section {
-               // padding: 16px 24px 24px 24px;
-               gap: 16px !important;
-               overflow-x: hidden;
-               display: flex;
-               flex-direction: column;
-  
-               .form-group {
-                 display: flex;
-                 flex-direction: column;
-                 gap: 8px;
-                 max-width: 500px;
-  
-                 label {
-                   display: block;
-                   font-size: 0.875rem;
-                   font-weight: 500;
-                   color: #374151;
-                 }
-  
-                 .primary_text_label {
-                   font-weight: 700;
-                 }
-  
-                 input[type="radio"],
-                 textarea {
-                   width: 100%;
-                   padding: 0.5rem 0.75rem;
-                   font-size: 0.875rem;
-                   border: 1px solid #d1d5db;
-                   border-radius: 0.375rem;
-                   outline: none;
-                   box-sizing: border-box;
-                   transition: all 0.2s;
-  
-                   &:focus {
-                     border-color: #2563eb;
-                     // box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.3);
-                   }
-  
-                   &[type="radio"] {
-                     width: fit-content;
-                     height: fit-content;
-                   }
-                 }
-  
-                 .radio-group {
-                   display: flex;
-                   flex-direction: column;
-                   gap: 12px;
-                   font-weight: normal;
-  
-                   .radio-label {
-                     display: inline-flex;
-                     align-items: center;
-                     gap: 8px;
-                     cursor: pointer;
-                     width: fit-content;
-  
-                     span {
-                       color: var(--_gray-500);
-  
-                       span {
-                         color: var(--_gray-900);
-                         font-weight: 500;
-                       }
-                     }
-                   }
-                 }
-  
-                 textarea {
-                   min-height: 100px;
-                   resize: vertical;
-                 }
-  
-                 .global-can-edit {
-                   display: flex;
-                   flex-direction: column;
-                   align-items: flex-start;
-                   margin-left: 20px;
-                   margin-top: 6px;
-                   gap: 6px;
-  
-                   input[type="checkbox"] {
-                     margin: 0;
-                     width: 16px;
-                     height: 16px;
-                     cursor: pointer;
-                   }
-  
-                   span {
-                     font-size: 0.875rem;
-                     font-weight: 600;
-                     color: var(--_gray-900);
-                     margin-left: -15px;
-                   }
-                 }
-               }
-  
-               input[type="text"] {
-                 height: 40px;
-                 border: 1px solid var(--_gray-300);
-                 border-radius: 6px;
-                 padding-inline: 16px;
-               }
-             }
-           }
-  
-           .action-buttons {
-             display: flex;
-             gap: 1rem;
-             align-items: center;
-             // justify-content: flex-end;
-             flex: 1 1 auto;
-             // padding: 16px 24px;
-             // border-top: 1px solid var(--_gray-200);
-             gap: 12px;
-             margin-block: 24px;
-             padding-bottom: 24px;
-  
-             button {
-               padding: 12px 16px;
-               border-radius: 6px;
-             }
-  
-             .create-btn {
-               display: flex;
-               justify-content: center;
-               align-items: center;
-               gap: 8px;
-               background-color: var(--_primary-400);
-               color: var(--_base-white);
-  
-               &.disabled {
-                 opacity: 0.5;
-                 pointer-events: none;
-               }
-  
-               .loader {
-                 animation: rotate-icon 1s linear infinite;
-                 display: inline-block;
-                 transform-origin: center;
-  
-                 svg path {
-                   stroke: var(--_primary-200);
-                 }
-               }
-  
-               &:hover {
-                 background-color: var(--_primary-500);
-               }
-             }
-  
-             .discard-btn {
-               &:hover {
-                 background-color: var(--_gray-50);
-                 color: var(--_gray-900);
-               }
-             }
-           }
-         }
-  
-         .template_col_right {
-           width: 400px;
-           height: fit-content;
-           background-color: var(--_base-white);
-  
-           .template_summary_wrapper {
-             border: 1px solid var(--_gray-300);
-             border-radius: 4px;
-             width: 350px;
-  
-             .template_summary_header {
-               padding: 12px 16px;
-               border-bottom: 1px solid var(--_gray-300);
-               font-size: 16px;
-               font-weight: 600;
-               background-color: #f5f5f5;
-             }
-  
-             .template_summary_body {
-               .template_summary_items {
-                 padding: 16px;
-                 display: flex;
-                 flex-direction: column;
-                 gap: 8px;
-  
-                 .template_summary_item {
-                   display: flex;
-                   justify-content: space-between;
-                   gap: 16px;
-  
-                   .template_summary_item_details {
-                     display: flex;
-                     gap: 16px;
-  
-                     .template_summary_item_pro_info {
-                       h5 {
-                         font-size: 16px;
-                         font-weight: 600;
-                         color: var(--_gray-900);
-                       }
-  
-                       .template_summary_item_pro_qty {
-                         color: var(--_gray-500);
-                         font-size: 12px;
-  
-                         span {
-                           display: block;
-                         }
-  
-                         .qty {
-                           color: var(--_gray-900);
-                         }
-                       }
-                     }
-                   }
-  
-                   .template_summary_item_detail_price {
-                     font-size: 16px;
-                     font-weight: 600;
-                     color: var(--_gray-900);
-                   }
-                 }
-               }
-             }
-           }
-         }
-       }
-     }
+  .template_wrapper {
+    width: 100%;
+    .template_section {
+      width: 100%;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      margin-bottom: 24px;
+      h2 {
+        font-size: 24px;
+      }
+      .back_to_cart {
+        color: var(--_primary-400);
+        &:hover {
+          text-decoration: underline;
+        }
+      }
+    }
+    .template_body {
+      display: flex;
+      gap: 60px;
+      justify-content: space-between;
+      .template_col_left {
+        width: 100%;
+        height: 400px;
+        background-color: var(--_base-white);
+        .wishlist-modal {
+          display: flex;
+          flex-direction: column;
+          width: 100%;
+
+          .wishlist-modal-section {
+            // padding: 16px 24px 24px 24px;
+            gap: 16px !important;
+            overflow-x: hidden;
+            display: flex;
+            flex-direction: column;
+
+            .form-group {
+              display: flex;
+              flex-direction: column;
+              gap: 8px;
+              max-width: 500px;
+
+              label {
+                display: block;
+                font-size: 0.875rem;
+                font-weight: 500;
+                color: #374151;
+              }
+
+              .primary_text_label {
+                font-weight: 700;
+              }
+
+              input[type="radio"],
+              textarea {
+                width: 100%;
+                padding: 0.5rem 0.75rem;
+                font-size: 0.875rem;
+                border: 1px solid #d1d5db;
+                border-radius: 0.375rem;
+                outline: none;
+                box-sizing: border-box;
+                transition: all 0.2s;
+
+                &:focus {
+                  border-color: #2563eb;
+                  // box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.3);
+                }
+
+                &[type="radio"] {
+                  width: fit-content;
+                  height: fit-content;
+                }
+              }
+
+              .radio-group {
+                display: flex;
+                flex-direction: column;
+                gap: 12px;
+                font-weight: normal;
+
+                .radio-label {
+                  display: inline-flex;
+                  align-items: center;
+                  gap: 8px;
+                  cursor: pointer;
+                  width: fit-content;
+
+                  span {
+                    color: var(--_gray-500);
+
+                    span {
+                      color: var(--_gray-900);
+                      font-weight: 500;
+                    }
+                  }
+                }
+              }
+
+              textarea {
+                min-height: 100px;
+                resize: vertical;
+              }
+
+              .global-can-edit {
+                display: flex;
+                flex-direction: column;
+                align-items: flex-start;
+                margin-left: 20px;
+                margin-top: 6px;
+                gap: 6px;
+
+                input[type="checkbox"] {
+                  margin: 0;
+                  width: 16px;
+                  height: 16px;
+                  cursor: pointer;
+                }
+
+                span {
+                  font-size: 0.875rem;
+                  font-weight: 600;
+                  color: var(--_gray-900);
+                  margin-left: -15px;
+                }
+              }
+            }
+            input[type="text"] {
+              height: 40px;
+              border: 1px solid var(--_gray-300);
+              border-radius: 6px;
+              padding-inline: 16px;
+            }
+          }
+        }
+        .action-buttons {
+          display: flex;
+          gap: 1rem;
+          align-items: center;
+          // justify-content: flex-end;
+          flex: 1 1 auto;
+          // padding: 16px 24px;
+          // border-top: 1px solid var(--_gray-200);
+          gap: 12px;
+          margin-block: 24px;
+          padding-bottom: 24px;
+          button {
+            padding: 12px 16px;
+            border-radius: 6px;
+          }
+          .create-btn {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            gap: 8px;
+            background-color: var(--_primary-400);
+            color: var(--_base-white);
+            &.disabled {
+              opacity: 0.5;
+              pointer-events: none;
+            }
+            .loader {
+              animation: rotate-icon 1s linear infinite;
+              display: inline-block;
+              transform-origin: center;
+
+              svg path {
+                stroke: var(--_primary-200);
+              }
+            }
+
+            &:hover {
+              background-color: var(--_primary-500);
+            }
+          }
+          .discard-btn {
+            &:hover {
+              background-color: var(--_gray-50);
+              color: var(--_gray-900);
+            }
+          }
+        }
+      }
+      .template_col_right {
+        width: 400px;
+        height: fit-content;
+        background-color: var(--_base-white);
+        .template_summary_wrapper {
+          border: 1px solid var(--_gray-300);
+          border-radius: 4px;
+          width: 350px;
+          .template_summary_header {
+            padding: 12px 16px;
+            border-bottom: 1px solid var(--_gray-300);
+            font-size: 16px;
+            font-weight: 600;
+            background-color: #f5f5f5;
+          }
+          .template_summary_body {
+            .template_summary_items {
+              padding: 16px;
+              display: flex;
+              flex-direction: column;
+              gap: 8px;
+              .template_summary_item {
+                display: flex;
+                justify-content: space-between;
+                gap: 16px;
+                .template_summary_item_details {
+                  display: flex;
+                  gap: 16px;
+                  .template_summary_item_pro_info {
+                    h5 {
+                      font-size: 16px;
+                      font-weight: 600;
+                      color: var(--_gray-900);
+                    }
+                    .template_summary_item_pro_qty {
+                      color: var(--_gray-500);
+                      font-size: 12px;
+                      span {
+                        display: block;
+                      }
+                      .qty {
+                        color: var(--_gray-900);
+                      }
+                    }
+                  }
+                }
+                .template_summary_item_detail_price {
+                  font-size: 16px;
+                  font-weight: 600;
+                  color: var(--_gray-900);
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
 }

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

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

package/dist/types/builder/elements/form-builder/index.d.ts

@@ -257,6 +257,7 @@ export interface FormGridLayoutInterface {
     maxW?: number;
     minH?: number;
     minW?: number;
+    resizeHandles?: ("s" | "e" | "w" | "n" | "se" | "sw" | "ne" | "nw")[];
 }
 export declare enum FormConfirmationOption {
     ShowMessage = 1,

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

@@ -351,6 +351,7 @@ export declare const CMSElementsListEnum: {
     MY_TEMPLATES: string;
     MY_WISHLIST: string;
     REQUEST_FOR_QUOTE: string;
+    EMBROIDERY: string;
 };
 export declare enum CMSResponsiveModeEnums {
     DESKTOP = "desktop",
@@ -415,7 +416,8 @@ export declare enum CMSCustomEventsListEnums {
     FORM_BUILDER_STATE = "formBuilderState",
     EMBROIDERY_PLAYGROUND_STATE = "embroideryPlaygroundState",
     FLEX_BUILDER_ANIMATION_TEMP_STATE = "flexBuilderAnimationTempState",
-    FLEX_EDITOR_SCROLL_TRIGGER = "flexEditorScrollTrigger"
+    FLEX_EDITOR_SCROLL_TRIGGER = "flexEditorScrollTrigger",
+    FLEX_EMBROIDERY_SESSION_DATA_V2 = "flexEmbroiderySessionDataV2"
 }
 export declare enum FlexAppVersionEnums {
     NESTEDJSON = 1,

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

@@ -91,4 +91,5 @@ import * as megaMenuSchema from "./elements/mega-menu";
 import * as megaMenuContainerSchema from "./elements/mega-menu-container";
 import * as simpleListSchema from "./elements/simple-list";
 import * as cartWrapperSchema from "./elements/cart-wrapper";
-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, addProductsTabSchema, shippingPaymentsSchema, couponSchema, megaMenuSchema, megaMenuContainerSchema, simpleListSchema, cartWrapperSchema, };
+import * as embroiderySchema from "./elements/embroidery";
+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, addProductsTabSchema, shippingPaymentsSchema, couponSchema, megaMenuSchema, megaMenuContainerSchema, simpleListSchema, cartWrapperSchema, embroiderySchema, };