simpo-component-library 1.4.8 → 1.4.10

package/fesm2022/simpo-component-library.mjs

@@ -2983,34 +2983,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
                 args: ['simpoSticky']
             }] } });
 
-var cartId = "";
 var orderedItems$1 = [
-	{
-		itemId: "1ef50089-2cf0-6bdf-8ea9-b51e0a912f33",
-		businessId: "21",
-		itemName: "Anime T-Shirt",
-		brandName: "Excee",
-		imgUrl: "https://dev-beeos.s3.amazonaws.com/library-media/291611c1707983189501product-details-2.jpg.jpg",
-		price: 120,
-		itemTax: 10,
-		quantity: 2,
-		discountedPrice: 20,
-		taxAfterDiscount: 10
-	}
 ];
+var cartType$1 = "CART";
 var billdetails$1 = {
-	totalNetValue: 260,
+	totalNetValue: 0,
 	totalGrossValue: 0,
-	totalTax: 20,
+	totalTax: 0,
 	totalOfferedValue: 0,
 	deliveryCharges: 0,
 	couponId: "",
-	discountAmount: 10,
+	discountAmount: 0,
 	afterDiscountAmount: 0,
 	taxBreakup: {
-		cgstValue: 5,
-		sgstValue: 5,
-		igstValue: 5
+		cgstValue: 0,
+		sgstValue: 0,
+		igstValue: 0
 	}
 };
 var locationDetails$1 = {
@@ -3025,16 +3013,33 @@ var locationDetails$1 = {
 	pinCode: ""
 };
 var platform$1 = "WEB";
-var totalAmount$1 = 400;
+var totalAmount$1 = 0;
 var UserCart = {
-	cartId: cartId,
 	orderedItems: orderedItems$1,
+	cartType: cartType$1,
 	billdetails: billdetails$1,
 	locationDetails: locationDetails$1,
 	platform: platform$1,
 	totalAmount: totalAmount$1
 };
 
+var user = {
+	address: {
+	},
+	businessId: "",
+	gender: "",
+	id: "",
+	contact: {
+		countryCode: "",
+		email: "",
+		mobile: "",
+		name: ""
+	}
+};
+var UserDetails = {
+	user: user
+};
+
 class RestService {
     constructor(http, eventService) {
         this.http = http;
@@ -3100,12 +3105,24 @@ class RestService {
         return this.http.put(this.BASE_URL + `ecommerce/product/item/search`, payload);
     }
     generateOTP(mobile, countryCode) {
-        return this.http.post(this.BASE_URL + `ecommerce/user/otp/trigger?mobile=${mobile}&countryCode=${countryCode}`, null);
+        const businessId = localStorage.getItem("bId") ?? "";
+        return this.http.post(this.BASE_URL + `ecommerce/user/otp/trigger?mobile=${mobile}&countryCode=${countryCode}&businessId=${businessId}`, null);
     }
     verifyOTP(mobile, otp) {
         const businessId = localStorage.getItem("bId") ?? "";
         return this.http.put(this.BASE_URL + `ecommerce/user/authenticate?mobile=${mobile}&otp=${otp}&businessId=${businessId}`, null);
     }
+    addItemToDB(userCart) {
+        return this.http.post(this.BASE_URL + `ecommerce/order/cart`, userCart);
+    }
+    getUserItems(userId, cartType) {
+        return this.http.get(this.BASE_URL + `ecommerce/order/cart?userId=${userId}&cartType=${cartType}`);
+    }
+    placeOrder(cartId) {
+        return this.http.post(this.BASE_URL + `ecommerce/order/order?cartId=${cartId}`, null);
+    }
+    toggleItemCartToFav() {
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: RestService, deps: [{ token: i1$1.HttpClient }, { token: EventsService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: RestService, providedIn: 'root' }); }
 }
@@ -3148,13 +3165,14 @@ class AuthenticateUserComponent {
         this.screen = "LOGIN";
     }
     generateOTP() {
-        this.restService.generateOTP(this.countryCode ?? "", this.mobile ?? "").subscribe((response) => {
+        this.restService.generateOTP(this.mobile ?? "", this.countryCode ?? "").subscribe((response) => {
             this.screen = "OTP";
         });
     }
     verifyOTP() {
         this.restService.verifyOTP(this.mobile ?? "", this.otpString).subscribe((response) => {
             // localStorage.setItem("userId", response.userId);
+            UserDetails.user = response.data;
             if (this.dialogRef)
                 this.dialogRef.close();
         });
@@ -3210,14 +3228,19 @@ class NavbarSectionComponent {
         this.router.navigate(['/whislist']);
     }
     goToAccount() {
-        if (this.screenWidth <= 475)
+        if (UserDetails.user.id.length > 0) {
             this.router.navigate(['/profile']);
+        }
         else {
-            this.matDialog.open(AuthenticateUserComponent, {
-                height: '50vh',
-                width: '35vw',
-                data: this.data
-            });
+            if (this.screenWidth <= 475)
+                this.router.navigate(['/auth']);
+            else {
+                this.matDialog.open(AuthenticateUserComponent, {
+                    height: '50vh',
+                    width: '35vw',
+                    data: this.data
+                });
+            }
         }
     }
     goToCart() {
@@ -4499,19 +4522,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
             }] } });
 
 var orderedItems = [
-	{
-		itemId: "1ef50089-2cf0-6bdf-8ea9-b51e0a912f33",
-		businessId: "21",
-		itemName: "Anime T-Shirt",
-		brandName: "Excee",
-		imgUrl: "https://dev-beeos.s3.amazonaws.com/library-media/291611c1707983189501product-details-2.jpg.jpg",
-		price: 120,
-		itemTax: 10,
-		quantity: 2,
-		discountedPrice: 20,
-		taxAfterDiscount: 10
-	}
 ];
+var cartType = "WISHLIST";
 var billdetails = {
 	totalNetValue: 0,
 	totalGrossValue: 0,
@@ -4542,6 +4554,7 @@ var platform = "WEB";
 var totalAmount = 0;
 var UserFavourite = {
 	orderedItems: orderedItems,
+	cartType: cartType,
 	billdetails: billdetails,
 	locationDetails: locationDetails,
 	platform: platform,
@@ -4554,7 +4567,7 @@ class OrderedItems {
         this.businessId = json?.["businessId"];
         this.itemName = json?.["name"];
         this.brandName = json?.["brandName"];
-        this.imgUrl = json?.["itemImages"]?.[0];
+        this.imgUrl = json?.["itemImages"]?.[0]?.["imgUrl"];
         this.price = json?.["price"]?.["value"];
         this.itemTax = json?.["price"]?.["taxAmount"];
         this.quantity = json?.["quantity"];
@@ -4570,12 +4583,14 @@ class OrderedItems {
 }
 
 class CartService {
-    constructor() { }
+    constructor(restService) {
+        this.restService = restService;
+    }
     addItemToCart(product) {
-        this.storeItemToJSON(UserCart, product);
+        this.storeItemToJSON(UserCart, product, "CART");
     }
     addItemToFavourite(product) {
-        this.storeItemToJSON(UserFavourite, product);
+        this.storeItemToJSON(UserFavourite, product, "WISHLIST");
     }
     removeItemToFavourite(product) {
         const index = this.getItemIdxJSON(product.itemId, UserFavourite);
@@ -4598,7 +4613,7 @@ class CartService {
             UserFavourite.orderedItems.push(item);
         }
     }
-    storeItemToJSON(json, product) {
+    storeItemToJSON(json, product, type) {
         const orderProduct = this.objectMapper(product);
         let productIndex = -1;
         json.orderedItems.forEach((p, idx) => {
@@ -4630,7 +4645,7 @@ class CartService {
         if (productIndex == -1)
             return 0;
         else
-            return UserCart.orderedItems[productIndex].quantity;
+            return UserCart.orderedItems[productIndex].getQuantity;
     }
     getIsItemPresent(itemId, type) {
         return type == "FAVOURITE" ? this.getItemIdxJSON(itemId, UserFavourite) >= 0 : this.getItemIdxJSON(itemId, UserCart) >= 0;
@@ -4646,7 +4661,24 @@ class CartService {
     objectMapper(product) {
         return new OrderedItems(product);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: CartService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    storeJSONToDB() {
+        this.restService.addItemToDB(UserCart).subscribe((response) => { });
+        this.restService.addItemToDB(UserFavourite).subscribe((response) => { });
+    }
+    storeDBToJSON() {
+        const userId = UserDetails.user.id;
+        this.restService.getUserItems(userId, "CART").subscribe((response) => {
+            UserCart.orderedItems = response.data.orderedItems;
+            UserCart.billdetails = response.data.billdetails;
+            UserCart.totalAmount = response.totalAmount;
+        });
+        this.restService.getUserItems(userId, "WISHLIST").subscribe((response) => {
+            UserFavourite.orderedItems = response.data.orderedItems;
+            UserFavourite.billdetails = response.data.billdetails;
+            UserFavourite.totalAmount = response.totalAmount;
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: CartService, deps: [{ token: RestService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: CartService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: CartService, decorators: [{
@@ -4654,7 +4686,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [{ type: RestService }] });
 
 class FeaturedProductsComponent extends BaseSection {
     constructor(platformId, _eventService, restService, router, cartService) {
@@ -4721,8 +4753,16 @@ class FeaturedProductsComponent extends BaseSection {
     isItemFav(product) {
         return this.cartService.getIsItemPresent(product.itemId, 'FAVOURITE');
     }
+    togglePreviewImage(product, idx) {
+        const element = document.getElementById('preview_' + idx);
+        element?.classList.add("transition-preivew");
+        setTimeout(() => {
+            product.prviewIdx = ((product?.itemImages?.length ?? 0) > 1 ? 1 : 0);
+            element?.classList.remove('transition-preivew');
+        }, 50);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: FeaturedProductsComponent, deps: [{ token: PLATFORM_ID }, { token: EventsService }, { token: RestService }, { token: i2$4.Router }, { token: CartService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: FeaturedProductsComponent, isStandalone: true, selector: "simpo-featured-products", inputs: { data: "data", responseData: "responseData", index: "index", delete: "delete" }, host: { listeners: { "window: resize": "getScreenSize($event)" } }, usesInheritance: true, ngImport: i0, template: "<section class=\"container-fluid total-container\" [id]=\"data?.id\" >\r\n  <div [id]=\"data?.id\" class=\"display-block\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\"\r\n    [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\">\r\n    <div *ngFor=\"let item of content?.inputText\">\r\n      <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\">\r\n      </div>\r\n    </div>\r\n    <img src=\"https://dev-beeos.s3.amazonaws.com/library-media/714126c1707378935732span.png\" alt=\"\"\r\n      class=\"span-img mt-15\">\r\n    <div class=\"product-parent\" *ngIf=\"responseData && responseData.length > 0\">\r\n      <div *ngFor=\"let product of responseData | slice:getSliceParameters()[0]:getSliceParameters()[1]\" class=\"product\"\r\n        [style.width]=\"getProductWidth()\">\r\n        <div *ngIf=\"!(product.itemImages.length > 0 && product.itemImages[0].imgUrl)\" class=\"default-image\"(click)=\"proceedToProductDesc(product.itemId)\">\r\n          <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" alt=\"\">\r\n        </div>\r\n        <div *ngIf=\"product.itemImages.length > 0 && product.itemImages[0].imgUrl\"(click)=\"proceedToProductDesc(product.itemId)\">\r\n          <img [src]=\"product.itemImages[0].imgUrl\" alt=\"\" class=\"product-img\">\r\n        </div>\r\n        <div class=\"mt-15\">\r\n          <div class=\"product-name heading-large\" [id]=\"data?.id\" [simpoColor]=\"styles?.background?.color\">\r\n            {{product.name}}</div>\r\n          <div class=\"d-flex justify-content-between\">\r\n            <div class=\"price body-large\" [id]=\"data?.id\" [simpoColor]=\"styles?.background?.color\">\r\n              &#8377;\r\n              {{product.price.sellingPrice}}\r\n            </div>\r\n            <div *ngIf=\"content?.display?.showButton\" class=\"add-to-cart-btn\">\r\n              <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"toggleItemToFav(product, 'ADD')\" *ngIf=\"!isItemFav(product)\">favorite_border</mat-icon>\r\n              <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"toggleItemToFav(product, 'REMOVE')\" *ngIf=\"isItemFav(product)\">favorite</mat-icon>\r\n              <button simpoButtonDirective [id]=\"data?.id+(button?.id || '')\" [buttonStyle]=\"button?.styles\"\r\n                [color]=\"styles?.background?.accentColor\" *ngIf=\"!product.quantity\" (click)=\"addItemToCart(product, 'ADD')\">{{content?.button}}</button>\r\n              <div class=\"quantity\" *ngIf=\"product.quantity\">\r\n                <span (click)=\"addItemToCart(product, 'SUBSTRACT')\">-</span>\r\n                <span>{{product.quantity}}</span>\r\n                <span (click)=\"addItemToCart(product, 'ADD')\">+</span>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n\r\n</section>\r\n", styles: [".product-parent{display:flex;flex-wrap:wrap;margin-top:15px}.product{padding:10px;cursor:pointer}.product-img{height:310px;width:100%}.price{color:#222;font-size:16px;font-weight:600;line-height:normal}.product-name{color:#222;font-size:16px;line-height:26px;margin-bottom:5px}.add-product-button{width:20%}.mt-15{margin-top:15px}.default-image{background-color:#f2f3f5;text-align:center}.default-image img{width:70%;height:310px}.total-container{height:auto;position:relative}.display-block{display:block!important}.quantity{display:flex;justify-content:space-between;align-items:center;border:1.5px solid lightgray;border-radius:3px;padding:5px;font-weight:600;width:95px}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (max-width: 475px){.product-img{height:250px}.default-image img{height:250px}}.add-to-cart-btn{display:flex;gap:10px}.add-to-cart-btn .mat-icon{height:30px;width:35px;font-size:27px;margin-top:5px}.add-to-cart-btn button{height:35px;font-size:16px!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.SlicePipe, name: "slice" }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "ngmodule", type: HttpClientModule }, { kind: "component", type: 
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: FeaturedProductsComponent, isStandalone: true, selector: "simpo-featured-products", inputs: { data: "data", responseData: "responseData", index: "index", delete: "delete" }, host: { listeners: { "window: resize": "getScreenSize($event)" } }, usesInheritance: true, ngImport: i0, template: "<section class=\"container-fluid total-container\" [id]=\"data?.id\" >\r\n  <div [id]=\"data?.id\" class=\"display-block\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\"\r\n    [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\">\r\n    <div *ngFor=\"let item of content?.inputText\">\r\n      <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\">\r\n      </div>\r\n    </div>\r\n    <img src=\"https://dev-beeos.s3.amazonaws.com/library-media/714126c1707378935732span.png\" alt=\"\"\r\n      class=\"span-img mt-15\">\r\n    <div class=\"product-parent\" *ngIf=\"responseData && responseData.length > 0\">\r\n      <div *ngFor=\"let product of responseData | slice:getSliceParameters()[0]:getSliceParameters()[1]; let idx = index\" class=\"product\"\r\n        [style.width]=\"getProductWidth()\">\r\n        <div *ngIf=\"!(product.itemImages.length > 0 && product.itemImages[0].imgUrl)\" class=\"default-image\"(click)=\"proceedToProductDesc(product.itemId)\">\r\n          <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" alt=\"\">\r\n        </div>\r\n        <div *ngIf=\"product.itemImages.length > 0 && product.itemImages[0].imgUrl\"(click)=\"proceedToProductDesc(product.itemId)\">\r\n          <img [id]=\"'preview_'+idx\" [src]=\"product.itemImages[product.prviewIdx]?.imgUrl\" alt=\"\" class=\"product-img preivew\" (mouseenter)=\"togglePreviewImage(product, idx)\" (mouseleave)=\"product.prviewIdx = 0\">\r\n        </div>\r\n        <div class=\"mt-15\">\r\n          <div class=\"product-name heading-large\" [id]=\"data?.id\" [simpoColor]=\"styles?.background?.color\">\r\n            {{product.name}}</div>\r\n          <div class=\"d-flex justify-content-between\">\r\n            <div class=\"price body-large\" [id]=\"data?.id\" [simpoColor]=\"styles?.background?.color\">\r\n              &#8377;\r\n              {{product.price.sellingPrice}}\r\n            </div>\r\n            <div *ngIf=\"content?.display?.showButton\" class=\"add-to-cart-btn\">\r\n              <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"toggleItemToFav(product, 'ADD')\" *ngIf=\"!isItemFav(product)\">favorite_border</mat-icon>\r\n              <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"toggleItemToFav(product, 'REMOVE')\" *ngIf=\"isItemFav(product)\">favorite</mat-icon>\r\n              <button simpoButtonDirective [id]=\"data?.id+(button?.id || '')\" [buttonStyle]=\"button?.styles\"\r\n                [color]=\"styles?.background?.accentColor\" *ngIf=\"!product.quantity\" (click)=\"addItemToCart(product, 'ADD')\">{{content?.button}}</button>\r\n              <div class=\"quantity\" *ngIf=\"product.quantity\">\r\n                <span (click)=\"addItemToCart(product, 'SUBSTRACT')\">-</span>\r\n                <span>{{product.quantity}}</span>\r\n                <span (click)=\"addItemToCart(product, 'ADD')\">+</span>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n\r\n</section>\r\n", styles: [".product-parent{display:flex;flex-wrap:wrap;margin-top:15px}.product{padding:10px;cursor:pointer}.product-img{height:310px;width:100%}.price{color:#222;font-size:16px;font-weight:600;line-height:normal}.product-name{color:#222;font-size:16px;line-height:26px;margin-bottom:5px}.add-product-button{width:20%}.mt-15{margin-top:15px}.default-image{background-color:#f2f3f5;text-align:center}.default-image img{width:70%;height:310px}.total-container{height:auto;position:relative}.display-block{display:block!important}.quantity{display:flex;justify-content:space-between;align-items:center;border:1.5px solid lightgray;border-radius:3px;padding:5px;font-weight:600;width:95px}.preivew{transition:opacity .5s ease-in-out;opacity:1}.transition-preview{opacity:0}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (max-width: 475px){.product-img{height:250px}.default-image img{height:250px}}.add-to-cart-btn{display:flex;gap:10px}.add-to-cart-btn .mat-icon{height:30px;width:35px;font-size:27px;margin-top:5px}.add-to-cart-btn button{height:35px;font-size:16px!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.SlicePipe, name: "slice" }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "ngmodule", type: HttpClientModule }, { kind: "component", type: 
                 //directive
                 MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: ColorDirective, selector: "[simpoColor]", inputs: ["simpoColor"] }, { kind: "directive", type: ButtonDirectiveDirective, selector: "[simpoButtonDirective]", inputs: ["buttonStyle", "color", "scrollValue"] }] }); }
 }
@@ -4743,7 +4783,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
                         TextBackgroundDirectiveDirective,
                         ColorDirective,
                         ButtonDirectiveDirective
-                    ], template: "<section class=\"container-fluid total-container\" [id]=\"data?.id\" >\r\n  <div [id]=\"data?.id\" class=\"display-block\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\"\r\n    [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\">\r\n    <div *ngFor=\"let item of content?.inputText\">\r\n      <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\">\r\n      </div>\r\n    </div>\r\n    <img src=\"https://dev-beeos.s3.amazonaws.com/library-media/714126c1707378935732span.png\" alt=\"\"\r\n      class=\"span-img mt-15\">\r\n    <div class=\"product-parent\" *ngIf=\"responseData && responseData.length > 0\">\r\n      <div *ngFor=\"let product of responseData | slice:getSliceParameters()[0]:getSliceParameters()[1]\" class=\"product\"\r\n        [style.width]=\"getProductWidth()\">\r\n        <div *ngIf=\"!(product.itemImages.length > 0 && product.itemImages[0].imgUrl)\" class=\"default-image\"(click)=\"proceedToProductDesc(product.itemId)\">\r\n          <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" alt=\"\">\r\n        </div>\r\n        <div *ngIf=\"product.itemImages.length > 0 && product.itemImages[0].imgUrl\"(click)=\"proceedToProductDesc(product.itemId)\">\r\n          <img [src]=\"product.itemImages[0].imgUrl\" alt=\"\" class=\"product-img\">\r\n        </div>\r\n        <div class=\"mt-15\">\r\n          <div class=\"product-name heading-large\" [id]=\"data?.id\" [simpoColor]=\"styles?.background?.color\">\r\n            {{product.name}}</div>\r\n          <div class=\"d-flex justify-content-between\">\r\n            <div class=\"price body-large\" [id]=\"data?.id\" [simpoColor]=\"styles?.background?.color\">\r\n              &#8377;\r\n              {{product.price.sellingPrice}}\r\n            </div>\r\n            <div *ngIf=\"content?.display?.showButton\" class=\"add-to-cart-btn\">\r\n              <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"toggleItemToFav(product, 'ADD')\" *ngIf=\"!isItemFav(product)\">favorite_border</mat-icon>\r\n              <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"toggleItemToFav(product, 'REMOVE')\" *ngIf=\"isItemFav(product)\">favorite</mat-icon>\r\n              <button simpoButtonDirective [id]=\"data?.id+(button?.id || '')\" [buttonStyle]=\"button?.styles\"\r\n                [color]=\"styles?.background?.accentColor\" *ngIf=\"!product.quantity\" (click)=\"addItemToCart(product, 'ADD')\">{{content?.button}}</button>\r\n              <div class=\"quantity\" *ngIf=\"product.quantity\">\r\n                <span (click)=\"addItemToCart(product, 'SUBSTRACT')\">-</span>\r\n                <span>{{product.quantity}}</span>\r\n                <span (click)=\"addItemToCart(product, 'ADD')\">+</span>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n\r\n</section>\r\n", styles: [".product-parent{display:flex;flex-wrap:wrap;margin-top:15px}.product{padding:10px;cursor:pointer}.product-img{height:310px;width:100%}.price{color:#222;font-size:16px;font-weight:600;line-height:normal}.product-name{color:#222;font-size:16px;line-height:26px;margin-bottom:5px}.add-product-button{width:20%}.mt-15{margin-top:15px}.default-image{background-color:#f2f3f5;text-align:center}.default-image img{width:70%;height:310px}.total-container{height:auto;position:relative}.display-block{display:block!important}.quantity{display:flex;justify-content:space-between;align-items:center;border:1.5px solid lightgray;border-radius:3px;padding:5px;font-weight:600;width:95px}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (max-width: 475px){.product-img{height:250px}.default-image img{height:250px}}.add-to-cart-btn{display:flex;gap:10px}.add-to-cart-btn .mat-icon{height:30px;width:35px;font-size:27px;margin-top:5px}.add-to-cart-btn button{height:35px;font-size:16px!important}\n"] }]
+                    ], template: "<section class=\"container-fluid total-container\" [id]=\"data?.id\" >\r\n  <div [id]=\"data?.id\" class=\"display-block\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\"\r\n    [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\">\r\n    <div *ngFor=\"let item of content?.inputText\">\r\n      <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\">\r\n      </div>\r\n    </div>\r\n    <img src=\"https://dev-beeos.s3.amazonaws.com/library-media/714126c1707378935732span.png\" alt=\"\"\r\n      class=\"span-img mt-15\">\r\n    <div class=\"product-parent\" *ngIf=\"responseData && responseData.length > 0\">\r\n      <div *ngFor=\"let product of responseData | slice:getSliceParameters()[0]:getSliceParameters()[1]; let idx = index\" class=\"product\"\r\n        [style.width]=\"getProductWidth()\">\r\n        <div *ngIf=\"!(product.itemImages.length > 0 && product.itemImages[0].imgUrl)\" class=\"default-image\"(click)=\"proceedToProductDesc(product.itemId)\">\r\n          <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" alt=\"\">\r\n        </div>\r\n        <div *ngIf=\"product.itemImages.length > 0 && product.itemImages[0].imgUrl\"(click)=\"proceedToProductDesc(product.itemId)\">\r\n          <img [id]=\"'preview_'+idx\" [src]=\"product.itemImages[product.prviewIdx]?.imgUrl\" alt=\"\" class=\"product-img preivew\" (mouseenter)=\"togglePreviewImage(product, idx)\" (mouseleave)=\"product.prviewIdx = 0\">\r\n        </div>\r\n        <div class=\"mt-15\">\r\n          <div class=\"product-name heading-large\" [id]=\"data?.id\" [simpoColor]=\"styles?.background?.color\">\r\n            {{product.name}}</div>\r\n          <div class=\"d-flex justify-content-between\">\r\n            <div class=\"price body-large\" [id]=\"data?.id\" [simpoColor]=\"styles?.background?.color\">\r\n              &#8377;\r\n              {{product.price.sellingPrice}}\r\n            </div>\r\n            <div *ngIf=\"content?.display?.showButton\" class=\"add-to-cart-btn\">\r\n              <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"toggleItemToFav(product, 'ADD')\" *ngIf=\"!isItemFav(product)\">favorite_border</mat-icon>\r\n              <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"toggleItemToFav(product, 'REMOVE')\" *ngIf=\"isItemFav(product)\">favorite</mat-icon>\r\n              <button simpoButtonDirective [id]=\"data?.id+(button?.id || '')\" [buttonStyle]=\"button?.styles\"\r\n                [color]=\"styles?.background?.accentColor\" *ngIf=\"!product.quantity\" (click)=\"addItemToCart(product, 'ADD')\">{{content?.button}}</button>\r\n              <div class=\"quantity\" *ngIf=\"product.quantity\">\r\n                <span (click)=\"addItemToCart(product, 'SUBSTRACT')\">-</span>\r\n                <span>{{product.quantity}}</span>\r\n                <span (click)=\"addItemToCart(product, 'ADD')\">+</span>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n\r\n</section>\r\n", styles: [".product-parent{display:flex;flex-wrap:wrap;margin-top:15px}.product{padding:10px;cursor:pointer}.product-img{height:310px;width:100%}.price{color:#222;font-size:16px;font-weight:600;line-height:normal}.product-name{color:#222;font-size:16px;line-height:26px;margin-bottom:5px}.add-product-button{width:20%}.mt-15{margin-top:15px}.default-image{background-color:#f2f3f5;text-align:center}.default-image img{width:70%;height:310px}.total-container{height:auto;position:relative}.display-block{display:block!important}.quantity{display:flex;justify-content:space-between;align-items:center;border:1.5px solid lightgray;border-radius:3px;padding:5px;font-weight:600;width:95px}.preivew{transition:opacity .5s ease-in-out;opacity:1}.transition-preview{opacity:0}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (max-width: 475px){.product-img{height:250px}.default-image img{height:250px}}.add-to-cart-btn{display:flex;gap:10px}.add-to-cart-btn .mat-icon{height:30px;width:35px;font-size:27px;margin-top:5px}.add-to-cart-btn button{height:35px;font-size:16px!important}\n"] }]
         }], ctorParameters: () => [{ type: Object, decorators: [{
                     type: Inject,
                     args: [PLATFORM_ID]
@@ -4854,6 +4894,9 @@ class ProductDescComponent extends BaseSection {
             }
         });
     }
+    routeToHome() {
+        this.router.navigate(['/']);
+    }
     getScreenSize() {
         this.screenWidth = window.innerWidth;
     }
@@ -4885,7 +4928,7 @@ class ProductDescComponent extends BaseSection {
         return this.cartService.getIsItemPresent(this.responseData?.itemId, "FAVOURITE");
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ProductDescComponent, deps: [{ token: PLATFORM_ID }, { token: EventsService }, { token: i2$4.Router }, { token: i2$4.ActivatedRoute }, { token: RestService }, { token: CartService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ProductDescComponent, isStandalone: true, selector: "simpo-product-desc", inputs: { data: "data", responseData: "responseData", index: "index", edit: "edit", delete: "delete" }, host: { listeners: { "window: resize": "getScreenSize($event)" } }, usesInheritance: true, ngImport: i0, template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n  <section class=\"container\" [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n    <div><a href=\"javascript:void(0)\" style=\"text-decoration: none; color: #0267C1\">Home</a> / <span>{{ responseData?.name | titlecase }}</span></div>\r\n    <div class=\"row\">\r\n      <div class=\"col-lg-6 col-12\">\r\n        <div class=\"prod-img-block\">\r\n          <div class=\"img-list\" *ngIf=\"screenWidth > 500\">\r\n            <ng-container *ngFor=\"let img of responseData?.itemImages\">\r\n              <img [src]=\"img.imgUrl\" alt=\"\" class=\"img\" (click)=\"changeImg(img.imgUrl)\" *ngIf=\"img.imgUrl\">\r\n              <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!img.imgUrl\">\r\n            </ng-container>\r\n          </div>\r\n          <div class=\"item-img\">\r\n            <img [src]=\"currentImg\" alt=\"\" *ngIf=\"currentImg\">\r\n            <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!currentImg\">\r\n          </div>\r\n          <div class=\"img-list\" *ngIf=\"screenWidth <= 500\">\r\n            <ng-container *ngFor=\"let img of responseData?.itemImages\">\r\n              <img [src]=\"img.imgUrl\" alt=\"\" class=\"img\" (click)=\"changeImg(img.imgUrl)\" *ngIf=\"img.imgUrl\">\r\n              <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!img.imgUrl\">\r\n            </ng-container>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"col-lg-6 col-12 product-detail\">\r\n        <div class=\"heading-large\">{{responseData?.name}}</div>\r\n        <div class=\"price\">&#8377; {{responseData?.price?.sellingPrice}}</div>\r\n        <div class=\"product-desc body-large\" *ngIf=\"responseData?.brief\">{{responseData.brief}}</div>\r\n\r\n        <div class=\"button-parent\">\r\n          <div class=\"quantity\" *ngIf=\"responseData?.quantity\">\r\n            <div class=\"plus\" (click)=\"addToCart('SUBSTRACT')\">-</div>\r\n            <div style=\"width: 50px;\" class=\"d-flex justify-content-center\">{{responseData.quantity}}</div>\r\n            <!-- <input type=\"number\" (keyup)=\"changeQuantity(quantity.value)\" [value]=\"addedQuantity\" #quantity> -->\r\n            <div class=\"minus\" (click)=\"addToCart('ADD')\">+</div>\r\n          </div>\r\n          <div *ngIf=\"!responseData?.quantity\">\r\n            <button class=\"send-btn\" simpoButtonDirective [id]=\"buttonId\" [buttonStyle]=\"button?.styles\" [color]=\"data?.styles?.background?.accentColor\" (click)=\"addToCart()\">{{data?.content?.button}}</button>\r\n          </div>\r\n          <div class=\"favourite\">\r\n            <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"addToFavourite()\" *ngIf=\"!isItemAsFavorite\">favorite_border</mat-icon>\r\n            <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"removeToFavourite()\" *ngIf=\"isItemAsFavorite\">favorite</mat-icon>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"product-sku\">\r\n          <div *ngIf=\"responseData?.itemInventory\">SKU :\r\n            {{responseData.itemInventory.openingStock}}</div>\r\n          <div *ngIf=\"responseData?.itemCategorisation?.itemCategories\">Category : <a href=\"javascript:void(0)\" (click)=\"goToFilter(cat.refName)\"\r\n              *ngFor=\"let cat of responseData?.itemCategorisation?.itemCategories;let idx = index\">{{cat.refName | titlecase}} <ng-container *ngIf=\"(idx+1) != responseData?.itemCategorisation?.itemCategories?.length\">,</ng-container>\r\n          </a></div>\r\n          <div *ngIf=\"(responseData?.itemCategorisation?.productTags?.length || 0) > 0\">Tags : <span\r\n              *ngFor=\"let tag of responseData?.itemCategorisation?.productTags\">{{tag.tagName}},\r\n            </span></div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"row prod-desc\">\r\n      <div class=\"tab-group\">\r\n        <div class=\"tab\">Description</div>\r\n      </div>\r\n      <div style=\"margin-top: 10px;\" class=\"body-large\" *ngIf=\"responseData?.properties?.description\">{{responseData?.properties?.description}}</div>\r\n    </div>\r\n  </section>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n</section>\r\n", styles: [".product-desc{display:flex}.row{margin-top:25px}.prod-img-block{display:flex;gap:5px}.img-list{display:flex;flex-direction:column;gap:5px}.img-list img{height:100px;width:100%;cursor:pointer}.item-img img{height:500px;width:460px}.price{font-weight:600;font-family:Poppins;font-size:20px;margin-top:15px}.product-desc{margin-top:15px}.button-parent{margin-top:15px;display:flex;gap:10px;align-items:center}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.product-sku{margin-top:20px}.product-sku div{font-weight:400;font-size:15px;color:#848484;font-family:Poppins;margin-top:.5rem}.tab-group{display:flex;gap:10px;overflow-y:scroll}.tab{font-family:Poppins;font-weight:500;font-size:18px;color:#222;padding-bottom:2px;border-bottom:1px solid black}@media screen and (max-width: 500px){.item-img img{width:100%;height:448px}.prod-img-block{flex-direction:column}.img-list{flex-direction:row;overflow-y:scroll}.product-detail,.prod-desc{margin-top:20px}.product-img{height:220px}}.send-btn{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important;margin-top:1rem}.favourite .mat-icon{min-height:55px;min-width:55px;font-size:35px;display:flex;align-items:center;justify-content:center;border:1.5px solid lightgray;border-radius:5px;padding:30px 25px 25px;position:relative;top:5px;cursor:pointer}a{text-decoration:none}.body-large{color:#848484}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.TitleCasePipe, name: "titlecase" }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: HttpClientModule }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: 
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ProductDescComponent, isStandalone: true, selector: "simpo-product-desc", inputs: { data: "data", responseData: "responseData", index: "index", edit: "edit", delete: "delete" }, host: { listeners: { "window: resize": "getScreenSize($event)" } }, usesInheritance: true, ngImport: i0, template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n  <section class=\"container\" [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n    <div><a href=\"javascript:void(0)\" style=\"text-decoration: none; color: #0267C1\" (click)=\"routeToHome()\">Home</a> / <span>{{ responseData?.name | titlecase }}</span></div>\r\n    <div class=\"row\">\r\n      <div class=\"col-lg-6 col-12\">\r\n        <div class=\"prod-img-block\">\r\n          <div class=\"img-list\" *ngIf=\"screenWidth > 500\">\r\n            <ng-container *ngFor=\"let img of responseData?.itemImages\">\r\n              <img [src]=\"img.imgUrl\" alt=\"\" class=\"img\" (click)=\"changeImg(img.imgUrl)\" *ngIf=\"img.imgUrl\">\r\n              <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!img.imgUrl\">\r\n            </ng-container>\r\n          </div>\r\n          <div class=\"item-img\">\r\n            <img [src]=\"currentImg\" alt=\"\" *ngIf=\"currentImg\">\r\n            <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!currentImg\">\r\n          </div>\r\n          <div class=\"img-list\" *ngIf=\"screenWidth <= 500\">\r\n            <ng-container *ngFor=\"let img of responseData?.itemImages\">\r\n              <img [src]=\"img.imgUrl\" alt=\"\" class=\"img\" (click)=\"changeImg(img.imgUrl)\" *ngIf=\"img.imgUrl\">\r\n              <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!img.imgUrl\">\r\n            </ng-container>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"col-lg-6 col-12 product-detail\">\r\n        <div class=\"heading-large\">{{responseData?.name}}</div>\r\n        <div class=\"price\">&#8377; {{responseData?.price?.sellingPrice}}</div>\r\n        <div class=\"product-desc body-large\" *ngIf=\"responseData?.brief\">{{responseData.brief}}</div>\r\n\r\n        <div class=\"button-parent\">\r\n          <div class=\"quantity\" *ngIf=\"responseData?.quantity\">\r\n            <div class=\"plus\" (click)=\"addToCart('SUBSTRACT')\">-</div>\r\n            <div style=\"width: 50px;\" class=\"d-flex justify-content-center\">{{responseData.quantity}}</div>\r\n            <!-- <input type=\"number\" (keyup)=\"changeQuantity(quantity.value)\" [value]=\"addedQuantity\" #quantity> -->\r\n            <div class=\"minus\" (click)=\"addToCart('ADD')\">+</div>\r\n          </div>\r\n          <div *ngIf=\"!responseData?.quantity\">\r\n            <button class=\"send-btn\" simpoButtonDirective [id]=\"buttonId\" [buttonStyle]=\"button?.styles\" [color]=\"data?.styles?.background?.accentColor\" (click)=\"addToCart()\">{{data?.content?.button}}</button>\r\n          </div>\r\n          <div class=\"favourite\">\r\n            <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"addToFavourite()\" *ngIf=\"!isItemAsFavorite\">favorite_border</mat-icon>\r\n            <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"removeToFavourite()\" *ngIf=\"isItemAsFavorite\">favorite</mat-icon>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"product-sku\">\r\n          <div *ngIf=\"responseData?.itemInventory\">SKU :\r\n            {{responseData.itemInventory.openingStock}}</div>\r\n          <div *ngIf=\"responseData?.itemCategorisation?.itemCategories\">Category : <a href=\"javascript:void(0)\" (click)=\"goToFilter(cat.refName)\"\r\n              *ngFor=\"let cat of responseData?.itemCategorisation?.itemCategories;let idx = index\">{{cat.refName | titlecase}} <ng-container *ngIf=\"(idx+1) != responseData?.itemCategorisation?.itemCategories?.length\">,</ng-container>\r\n          </a></div>\r\n          <div *ngIf=\"(responseData?.itemCategorisation?.productTags?.length || 0) > 0\">Tags : <span\r\n              *ngFor=\"let tag of responseData?.itemCategorisation?.productTags\">{{tag.tagName}},\r\n            </span></div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"row prod-desc\">\r\n      <div class=\"tab-group\">\r\n        <div class=\"tab\">Description</div>\r\n      </div>\r\n      <div style=\"margin-top: 10px;\" class=\"body-large\" *ngIf=\"responseData?.properties?.description\">{{responseData?.properties?.description}}</div>\r\n    </div>\r\n  </section>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n</section>\r\n", styles: [".product-desc{display:flex}.row{margin-top:25px}.prod-img-block{display:flex;gap:5px}.img-list{display:flex;flex-direction:column;gap:5px}.img-list img{height:100px;width:100%;cursor:pointer}.item-img img{height:500px;width:460px}.price{font-weight:600;font-family:Poppins;font-size:20px;margin-top:15px}.product-desc{margin-top:15px}.button-parent{margin-top:15px;display:flex;gap:10px;align-items:center}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.product-sku{margin-top:20px}.product-sku div{font-weight:400;font-size:15px;color:#848484;font-family:Poppins;margin-top:.5rem}.tab-group{display:flex;gap:10px;overflow-y:scroll}.tab{font-family:Poppins;font-weight:500;font-size:18px;color:#222;padding-bottom:2px;border-bottom:1px solid black}@media screen and (max-width: 500px){.item-img img{width:100%;height:448px}.prod-img-block{flex-direction:column}.img-list{flex-direction:row;overflow-y:scroll}.product-detail,.prod-desc{margin-top:20px}.product-img{height:220px}}.send-btn{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important;margin-top:1rem}.favourite .mat-icon{min-height:55px;min-width:55px;font-size:35px;display:flex;align-items:center;justify-content:center;border:1.5px solid lightgray;border-radius:5px;padding:30px 25px 25px;position:relative;top:5px;cursor:pointer}a{text-decoration:none}.body-large{color:#848484}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.TitleCasePipe, name: "titlecase" }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: HttpClientModule }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: 
                 //DIRECTIVE
                 ButtonDirectiveDirective, selector: "[simpoButtonDirective]", inputs: ["buttonStyle", "color", "scrollValue"] }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }] }); }
 }
@@ -4901,7 +4944,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
                         AnimationDirective,
                         ContentFitDirective,
                         HoverDirective
-                    ], template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n  <section class=\"container\" [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n    <div><a href=\"javascript:void(0)\" style=\"text-decoration: none; color: #0267C1\">Home</a> / <span>{{ responseData?.name | titlecase }}</span></div>\r\n    <div class=\"row\">\r\n      <div class=\"col-lg-6 col-12\">\r\n        <div class=\"prod-img-block\">\r\n          <div class=\"img-list\" *ngIf=\"screenWidth > 500\">\r\n            <ng-container *ngFor=\"let img of responseData?.itemImages\">\r\n              <img [src]=\"img.imgUrl\" alt=\"\" class=\"img\" (click)=\"changeImg(img.imgUrl)\" *ngIf=\"img.imgUrl\">\r\n              <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!img.imgUrl\">\r\n            </ng-container>\r\n          </div>\r\n          <div class=\"item-img\">\r\n            <img [src]=\"currentImg\" alt=\"\" *ngIf=\"currentImg\">\r\n            <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!currentImg\">\r\n          </div>\r\n          <div class=\"img-list\" *ngIf=\"screenWidth <= 500\">\r\n            <ng-container *ngFor=\"let img of responseData?.itemImages\">\r\n              <img [src]=\"img.imgUrl\" alt=\"\" class=\"img\" (click)=\"changeImg(img.imgUrl)\" *ngIf=\"img.imgUrl\">\r\n              <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!img.imgUrl\">\r\n            </ng-container>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"col-lg-6 col-12 product-detail\">\r\n        <div class=\"heading-large\">{{responseData?.name}}</div>\r\n        <div class=\"price\">&#8377; {{responseData?.price?.sellingPrice}}</div>\r\n        <div class=\"product-desc body-large\" *ngIf=\"responseData?.brief\">{{responseData.brief}}</div>\r\n\r\n        <div class=\"button-parent\">\r\n          <div class=\"quantity\" *ngIf=\"responseData?.quantity\">\r\n            <div class=\"plus\" (click)=\"addToCart('SUBSTRACT')\">-</div>\r\n            <div style=\"width: 50px;\" class=\"d-flex justify-content-center\">{{responseData.quantity}}</div>\r\n            <!-- <input type=\"number\" (keyup)=\"changeQuantity(quantity.value)\" [value]=\"addedQuantity\" #quantity> -->\r\n            <div class=\"minus\" (click)=\"addToCart('ADD')\">+</div>\r\n          </div>\r\n          <div *ngIf=\"!responseData?.quantity\">\r\n            <button class=\"send-btn\" simpoButtonDirective [id]=\"buttonId\" [buttonStyle]=\"button?.styles\" [color]=\"data?.styles?.background?.accentColor\" (click)=\"addToCart()\">{{data?.content?.button}}</button>\r\n          </div>\r\n          <div class=\"favourite\">\r\n            <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"addToFavourite()\" *ngIf=\"!isItemAsFavorite\">favorite_border</mat-icon>\r\n            <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"removeToFavourite()\" *ngIf=\"isItemAsFavorite\">favorite</mat-icon>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"product-sku\">\r\n          <div *ngIf=\"responseData?.itemInventory\">SKU :\r\n            {{responseData.itemInventory.openingStock}}</div>\r\n          <div *ngIf=\"responseData?.itemCategorisation?.itemCategories\">Category : <a href=\"javascript:void(0)\" (click)=\"goToFilter(cat.refName)\"\r\n              *ngFor=\"let cat of responseData?.itemCategorisation?.itemCategories;let idx = index\">{{cat.refName | titlecase}} <ng-container *ngIf=\"(idx+1) != responseData?.itemCategorisation?.itemCategories?.length\">,</ng-container>\r\n          </a></div>\r\n          <div *ngIf=\"(responseData?.itemCategorisation?.productTags?.length || 0) > 0\">Tags : <span\r\n              *ngFor=\"let tag of responseData?.itemCategorisation?.productTags\">{{tag.tagName}},\r\n            </span></div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"row prod-desc\">\r\n      <div class=\"tab-group\">\r\n        <div class=\"tab\">Description</div>\r\n      </div>\r\n      <div style=\"margin-top: 10px;\" class=\"body-large\" *ngIf=\"responseData?.properties?.description\">{{responseData?.properties?.description}}</div>\r\n    </div>\r\n  </section>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n</section>\r\n", styles: [".product-desc{display:flex}.row{margin-top:25px}.prod-img-block{display:flex;gap:5px}.img-list{display:flex;flex-direction:column;gap:5px}.img-list img{height:100px;width:100%;cursor:pointer}.item-img img{height:500px;width:460px}.price{font-weight:600;font-family:Poppins;font-size:20px;margin-top:15px}.product-desc{margin-top:15px}.button-parent{margin-top:15px;display:flex;gap:10px;align-items:center}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.product-sku{margin-top:20px}.product-sku div{font-weight:400;font-size:15px;color:#848484;font-family:Poppins;margin-top:.5rem}.tab-group{display:flex;gap:10px;overflow-y:scroll}.tab{font-family:Poppins;font-weight:500;font-size:18px;color:#222;padding-bottom:2px;border-bottom:1px solid black}@media screen and (max-width: 500px){.item-img img{width:100%;height:448px}.prod-img-block{flex-direction:column}.img-list{flex-direction:row;overflow-y:scroll}.product-detail,.prod-desc{margin-top:20px}.product-img{height:220px}}.send-btn{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important;margin-top:1rem}.favourite .mat-icon{min-height:55px;min-width:55px;font-size:35px;display:flex;align-items:center;justify-content:center;border:1.5px solid lightgray;border-radius:5px;padding:30px 25px 25px;position:relative;top:5px;cursor:pointer}a{text-decoration:none}.body-large{color:#848484}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}\n"] }]
+                    ], template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n  <section class=\"container\" [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n    <div><a href=\"javascript:void(0)\" style=\"text-decoration: none; color: #0267C1\" (click)=\"routeToHome()\">Home</a> / <span>{{ responseData?.name | titlecase }}</span></div>\r\n    <div class=\"row\">\r\n      <div class=\"col-lg-6 col-12\">\r\n        <div class=\"prod-img-block\">\r\n          <div class=\"img-list\" *ngIf=\"screenWidth > 500\">\r\n            <ng-container *ngFor=\"let img of responseData?.itemImages\">\r\n              <img [src]=\"img.imgUrl\" alt=\"\" class=\"img\" (click)=\"changeImg(img.imgUrl)\" *ngIf=\"img.imgUrl\">\r\n              <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!img.imgUrl\">\r\n            </ng-container>\r\n          </div>\r\n          <div class=\"item-img\">\r\n            <img [src]=\"currentImg\" alt=\"\" *ngIf=\"currentImg\">\r\n            <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!currentImg\">\r\n          </div>\r\n          <div class=\"img-list\" *ngIf=\"screenWidth <= 500\">\r\n            <ng-container *ngFor=\"let img of responseData?.itemImages\">\r\n              <img [src]=\"img.imgUrl\" alt=\"\" class=\"img\" (click)=\"changeImg(img.imgUrl)\" *ngIf=\"img.imgUrl\">\r\n              <img src=\"https://www.svgrepo.com/show/149861/t-shirt-black-silhouette.svg\" *ngIf=\"!img.imgUrl\">\r\n            </ng-container>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"col-lg-6 col-12 product-detail\">\r\n        <div class=\"heading-large\">{{responseData?.name}}</div>\r\n        <div class=\"price\">&#8377; {{responseData?.price?.sellingPrice}}</div>\r\n        <div class=\"product-desc body-large\" *ngIf=\"responseData?.brief\">{{responseData.brief}}</div>\r\n\r\n        <div class=\"button-parent\">\r\n          <div class=\"quantity\" *ngIf=\"responseData?.quantity\">\r\n            <div class=\"plus\" (click)=\"addToCart('SUBSTRACT')\">-</div>\r\n            <div style=\"width: 50px;\" class=\"d-flex justify-content-center\">{{responseData.quantity}}</div>\r\n            <!-- <input type=\"number\" (keyup)=\"changeQuantity(quantity.value)\" [value]=\"addedQuantity\" #quantity> -->\r\n            <div class=\"minus\" (click)=\"addToCart('ADD')\">+</div>\r\n          </div>\r\n          <div *ngIf=\"!responseData?.quantity\">\r\n            <button class=\"send-btn\" simpoButtonDirective [id]=\"buttonId\" [buttonStyle]=\"button?.styles\" [color]=\"data?.styles?.background?.accentColor\" (click)=\"addToCart()\">{{data?.content?.button}}</button>\r\n          </div>\r\n          <div class=\"favourite\">\r\n            <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"addToFavourite()\" *ngIf=\"!isItemAsFavorite\">favorite_border</mat-icon>\r\n            <mat-icon [style.color]=\"data?.styles?.background?.accentColor\" (click)=\"removeToFavourite()\" *ngIf=\"isItemAsFavorite\">favorite</mat-icon>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"product-sku\">\r\n          <div *ngIf=\"responseData?.itemInventory\">SKU :\r\n            {{responseData.itemInventory.openingStock}}</div>\r\n          <div *ngIf=\"responseData?.itemCategorisation?.itemCategories\">Category : <a href=\"javascript:void(0)\" (click)=\"goToFilter(cat.refName)\"\r\n              *ngFor=\"let cat of responseData?.itemCategorisation?.itemCategories;let idx = index\">{{cat.refName | titlecase}} <ng-container *ngIf=\"(idx+1) != responseData?.itemCategorisation?.itemCategories?.length\">,</ng-container>\r\n          </a></div>\r\n          <div *ngIf=\"(responseData?.itemCategorisation?.productTags?.length || 0) > 0\">Tags : <span\r\n              *ngFor=\"let tag of responseData?.itemCategorisation?.productTags\">{{tag.tagName}},\r\n            </span></div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"row prod-desc\">\r\n      <div class=\"tab-group\">\r\n        <div class=\"tab\">Description</div>\r\n      </div>\r\n      <div style=\"margin-top: 10px;\" class=\"body-large\" *ngIf=\"responseData?.properties?.description\">{{responseData?.properties?.description}}</div>\r\n    </div>\r\n  </section>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n</section>\r\n", styles: [".product-desc{display:flex}.row{margin-top:25px}.prod-img-block{display:flex;gap:5px}.img-list{display:flex;flex-direction:column;gap:5px}.img-list img{height:100px;width:100%;cursor:pointer}.item-img img{height:500px;width:460px}.price{font-weight:600;font-family:Poppins;font-size:20px;margin-top:15px}.product-desc{margin-top:15px}.button-parent{margin-top:15px;display:flex;gap:10px;align-items:center}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.product-sku{margin-top:20px}.product-sku div{font-weight:400;font-size:15px;color:#848484;font-family:Poppins;margin-top:.5rem}.tab-group{display:flex;gap:10px;overflow-y:scroll}.tab{font-family:Poppins;font-weight:500;font-size:18px;color:#222;padding-bottom:2px;border-bottom:1px solid black}@media screen and (max-width: 500px){.item-img img{width:100%;height:448px}.prod-img-block{flex-direction:column}.img-list{flex-direction:row;overflow-y:scroll}.product-detail,.prod-desc{margin-top:20px}.product-img{height:220px}}.send-btn{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important;margin-top:1rem}.favourite .mat-icon{min-height:55px;min-width:55px;font-size:35px;display:flex;align-items:center;justify-content:center;border:1.5px solid lightgray;border-radius:5px;padding:30px 25px 25px;position:relative;top:5px;cursor:pointer}a{text-decoration:none}.body-large{color:#848484}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}\n"] }]
         }], ctorParameters: () => [{ type: Object, decorators: [{
                     type: Inject,
                     args: [PLATFORM_ID]
@@ -5131,8 +5174,8 @@ class CartComponent extends BaseSection {
         this.cartService = cartService;
     }
     ngOnInit() {
+        this.cartService.storeDBToJSON();
         this.responseData = UserCart;
-        console.log(this.responseData);
         this.styles = this.data?.styles;
     }
     proceedToCheckout() {
@@ -5157,7 +5200,7 @@ class CartComponent extends BaseSection {
         this.cartService.addItemToCart(item);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: CartComponent, deps: [{ token: EventsService }, { token: CartService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: CartComponent, isStandalone: true, selector: "simpo-cart", inputs: { data: "data", responseData: "responseData", index: "index", edit: "edit", delete: "delete" }, usesInheritance: true, ngImport: i0, template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n  <div class=\"cart-parent container\" *ngIf=\"(responseData?.orderedItems?.length || 0) > 0\"  [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n    <div class=\"left-panel\">\r\n      <div class=\"my-bag\">\r\n        My Bag&nbsp; <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n      </div>\r\n      <div class=\"cart-items\">\r\n        <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n          <div class=\"row item-parent\">\r\n            <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n              <img class=\"product-img\" [src]=\"item.imgUrl.imgUrl\" alt=\"\">\r\n            </div>\r\n            <div class=\"col-md-6 h-100\">\r\n              <div class=\"lh-23\">\r\n                <div class=\"item-name heading-large\">{{item.itemName}}</div>\r\n                <div class=\"price-with-tax\">\r\n                  &#8377; {{item.price + (item.itemTax ?? 0)}}\r\n                </div>\r\n                <div class=\"item-quantity\">\r\n                  <span class=\"cursor\" (click)=\"addToCart(item, 'SUBSTRACT')\">-</span>\r\n                  <span>{{item.quantity}}</span>\r\n                  <span class=\"cursor\" (click)=\"addToCart(item, 'ADD')\">+</span>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            <div class=\"col-md-4 position-relative\" style=\"margin-left: auto;\">\r\n              <div class=\"item-price\">&#8377; {{(item.price + (item.itemTax ?? 0)) * item.quantity}}</div>\r\n              <div>\r\n                <mat-icon class=\"delete-item\" (click)=\"removeItem(item)\">delete</mat-icon>\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <hr *ngIf=\"responseData?.orderedItems?.length != (idx +1)\">\r\n        </ng-container>\r\n      </div>\r\n    </div>\r\n    <div class=\"right-panel\">\r\n      <div class=\"my-bag\">\r\n        Price Details\r\n      </div>\r\n      <div class=\"price-details\">\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.billdetails?.totalNetValue\">\r\n          <div class=\"price-type\">Total Price</div>\r\n          <div class=\"price-value\">&#8377; {{responseData.billdetails.totalNetValue}}</div>\r\n        </div>\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.billdetails?.totalTax\">\r\n          <div class=\"price-type\">Total Tax</div>\r\n          <div class=\"price-value\">&#8377; {{responseData?.billdetails?.totalTax}}</div>\r\n        </div>\r\n        <div class=\"price-parent-block\"\r\n          *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n          <div class=\"price-type\">Delivery Charge</div>\r\n          <div class=\"price-value\">&#8377; {{responseData.billdetails.deliveryCharges}}</div>\r\n        </div>\r\n        <hr>\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.totalAmount\">\r\n          <div class=\"price-type\" style=\"color: black;font-weight: 600;\">Total Amount</div>\r\n          <div class=\"price-value\" style=\"font-weight: 600;\">&#8377; {{responseData.totalAmount}}</div>\r\n        </div>\r\n\r\n        <div class=\"button-parent\">\r\n          <div *ngFor=\"let button of data?.action?.buttons;let i = index\">\r\n            <button class=\"btn\" (click)=\"i == 0 ? proceedToCheckout() : proceedToListPage()\" simpoButtonDirective [id]=\"data?.id+button.id\" [buttonStyle]=\"button?.styles\"\r\n              [color]=\"styles?.background?.accentColor\">{{button?.content?.label}}</button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <section class=\"empty-cart\" *ngIf=\"(responseData?.orderedItems?.length || 0) == 0\">\r\n    <div>\r\n      <div class=\"cart-image\">\r\n        <img src=\"https://prod-simpo.s3.ap-south-1.amazonaws.com/prod-images/107213c1716543334040empty-cart.png\" alt=\"\">\r\n      </div>\r\n      <div class=\"cart-text\">\r\n        <div class=\"heading-medium d-flex justify-content-center\">\r\n          Your cart is empty\r\n        </div>\r\n        <div class=\"description d-flex mt-4\">\r\n          Looks like you have not added anything to your cart. Go ahead & explore top categories.\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </section>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n\r\n</section>\r\n", styles: [".cart-parent{display:flex;margin-top:15px;gap:20px}.left-panel{width:65%}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029}.right-panel{width:35%}.my-bag{font-size:16px;font-weight:600;color:#000}.my-bag span{color:#939393}.item-parent{margin:10px 0}.lh-23{line-height:23px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;justify-content:flex-end;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:95px;width:100px;padding:0}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#626262;cursor:pointer}.item-quantity{margin-top:5px;display:flex;width:90px;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.left-panel,.right-panel{width:100%}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "directive", type: 
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: CartComponent, isStandalone: true, selector: "simpo-cart", inputs: { data: "data", responseData: "responseData", index: "index", edit: "edit", delete: "delete" }, usesInheritance: true, ngImport: i0, template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n  <div class=\"cart-parent container\" *ngIf=\"(responseData?.orderedItems?.length || 0) > 0\"  [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n    <div class=\"left-panel\">\r\n      <div class=\"my-bag\">\r\n        My Bag&nbsp; <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n      </div>\r\n      <div class=\"cart-items\">\r\n        <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n          <div class=\"row item-parent\">\r\n            <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n              <img class=\"product-img\" [src]=\"item.imgUrl\" alt=\"\">\r\n            </div>\r\n            <div class=\"col-md-6 h-100\">\r\n              <div class=\"lh-23\">\r\n                <div class=\"item-name heading-large\">{{item.itemName}}</div>\r\n                <div class=\"price-with-tax\">\r\n                  &#8377; {{item.price + (item.itemTax ?? 0)}}\r\n                </div>\r\n                <div class=\"item-quantity\">\r\n                  <span class=\"cursor\" (click)=\"addToCart(item, 'SUBSTRACT')\">-</span>\r\n                  <span>{{item.quantity}}</span>\r\n                  <span class=\"cursor\" (click)=\"addToCart(item, 'ADD')\">+</span>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            <div class=\"col-md-4 position-relative\" style=\"margin-left: auto;\">\r\n              <div class=\"item-price\">&#8377; {{(item.price + (item.itemTax ?? 0)) * item.quantity}}</div>\r\n              <div>\r\n                <mat-icon class=\"delete-item\" (click)=\"removeItem(item)\">delete</mat-icon>\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <hr *ngIf=\"responseData?.orderedItems?.length != (idx +1)\">\r\n        </ng-container>\r\n      </div>\r\n    </div>\r\n    <div class=\"right-panel\">\r\n      <div class=\"my-bag\">\r\n        Price Details\r\n      </div>\r\n      <div class=\"price-details\">\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.billdetails?.totalNetValue\">\r\n          <div class=\"price-type\">Total Price</div>\r\n          <div class=\"price-value\">&#8377; {{responseData.billdetails.totalNetValue}}</div>\r\n        </div>\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.billdetails?.totalTax\">\r\n          <div class=\"price-type\">Total Tax</div>\r\n          <div class=\"price-value\">&#8377; {{responseData?.billdetails?.totalTax}}</div>\r\n        </div>\r\n        <div class=\"price-parent-block\"\r\n          *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n          <div class=\"price-type\">Delivery Charge</div>\r\n          <div class=\"price-value\">&#8377; {{responseData.billdetails.deliveryCharges}}</div>\r\n        </div>\r\n        <hr>\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.totalAmount\">\r\n          <div class=\"price-type\" style=\"color: black;font-weight: 600;\">Total Amount</div>\r\n          <div class=\"price-value\" style=\"font-weight: 600;\">&#8377; {{responseData.totalAmount}}</div>\r\n        </div>\r\n\r\n        <div class=\"button-parent\">\r\n          <div *ngFor=\"let button of data?.action?.buttons;let i = index\">\r\n            <button class=\"btn\" (click)=\"i == 0 ? proceedToCheckout() : proceedToListPage()\" simpoButtonDirective [id]=\"data?.id+button.id\" [buttonStyle]=\"button?.styles\"\r\n              [color]=\"styles?.background?.accentColor\">{{button?.content?.label}}</button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <section class=\"empty-cart\" *ngIf=\"(responseData?.orderedItems?.length || 0) == 0\">\r\n    <div>\r\n      <div class=\"cart-image\">\r\n        <img src=\"https://prod-simpo.s3.ap-south-1.amazonaws.com/prod-images/107213c1716543334040empty-cart.png\" alt=\"\">\r\n      </div>\r\n      <div class=\"cart-text\">\r\n        <div class=\"heading-medium d-flex justify-content-center\">\r\n          Your cart is empty\r\n        </div>\r\n        <div class=\"description d-flex mt-4\">\r\n          Looks like you have not added anything to your cart. Go ahead & explore top categories.\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </section>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n\r\n</section>\r\n", styles: [".cart-parent{display:flex;margin-top:15px;gap:20px}.left-panel{width:65%}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029}.right-panel{width:35%}.my-bag{font-size:16px;font-weight:600;color:#000}.my-bag span{color:#939393}.item-parent{margin:10px 0}.lh-23{line-height:23px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;justify-content:flex-end;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:95px;width:100px;padding:0}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#626262;cursor:pointer}.item-quantity{margin-top:5px;display:flex;width:90px;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.left-panel,.right-panel{width:100%}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "directive", type: 
                 //DIRECTIVE
                 ButtonDirectiveDirective, selector: "[simpoButtonDirective]", inputs: ["buttonStyle", "color", "scrollValue"] }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }] }); }
 }
@@ -5171,7 +5214,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
                         AnimationDirective,
                         ContentFitDirective,
                         HoverDirective
-                    ], template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n  <div class=\"cart-parent container\" *ngIf=\"(responseData?.orderedItems?.length || 0) > 0\"  [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n    <div class=\"left-panel\">\r\n      <div class=\"my-bag\">\r\n        My Bag&nbsp; <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n      </div>\r\n      <div class=\"cart-items\">\r\n        <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n          <div class=\"row item-parent\">\r\n            <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n              <img class=\"product-img\" [src]=\"item.imgUrl.imgUrl\" alt=\"\">\r\n            </div>\r\n            <div class=\"col-md-6 h-100\">\r\n              <div class=\"lh-23\">\r\n                <div class=\"item-name heading-large\">{{item.itemName}}</div>\r\n                <div class=\"price-with-tax\">\r\n                  &#8377; {{item.price + (item.itemTax ?? 0)}}\r\n                </div>\r\n                <div class=\"item-quantity\">\r\n                  <span class=\"cursor\" (click)=\"addToCart(item, 'SUBSTRACT')\">-</span>\r\n                  <span>{{item.quantity}}</span>\r\n                  <span class=\"cursor\" (click)=\"addToCart(item, 'ADD')\">+</span>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            <div class=\"col-md-4 position-relative\" style=\"margin-left: auto;\">\r\n              <div class=\"item-price\">&#8377; {{(item.price + (item.itemTax ?? 0)) * item.quantity}}</div>\r\n              <div>\r\n                <mat-icon class=\"delete-item\" (click)=\"removeItem(item)\">delete</mat-icon>\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <hr *ngIf=\"responseData?.orderedItems?.length != (idx +1)\">\r\n        </ng-container>\r\n      </div>\r\n    </div>\r\n    <div class=\"right-panel\">\r\n      <div class=\"my-bag\">\r\n        Price Details\r\n      </div>\r\n      <div class=\"price-details\">\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.billdetails?.totalNetValue\">\r\n          <div class=\"price-type\">Total Price</div>\r\n          <div class=\"price-value\">&#8377; {{responseData.billdetails.totalNetValue}}</div>\r\n        </div>\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.billdetails?.totalTax\">\r\n          <div class=\"price-type\">Total Tax</div>\r\n          <div class=\"price-value\">&#8377; {{responseData?.billdetails?.totalTax}}</div>\r\n        </div>\r\n        <div class=\"price-parent-block\"\r\n          *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n          <div class=\"price-type\">Delivery Charge</div>\r\n          <div class=\"price-value\">&#8377; {{responseData.billdetails.deliveryCharges}}</div>\r\n        </div>\r\n        <hr>\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.totalAmount\">\r\n          <div class=\"price-type\" style=\"color: black;font-weight: 600;\">Total Amount</div>\r\n          <div class=\"price-value\" style=\"font-weight: 600;\">&#8377; {{responseData.totalAmount}}</div>\r\n        </div>\r\n\r\n        <div class=\"button-parent\">\r\n          <div *ngFor=\"let button of data?.action?.buttons;let i = index\">\r\n            <button class=\"btn\" (click)=\"i == 0 ? proceedToCheckout() : proceedToListPage()\" simpoButtonDirective [id]=\"data?.id+button.id\" [buttonStyle]=\"button?.styles\"\r\n              [color]=\"styles?.background?.accentColor\">{{button?.content?.label}}</button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <section class=\"empty-cart\" *ngIf=\"(responseData?.orderedItems?.length || 0) == 0\">\r\n    <div>\r\n      <div class=\"cart-image\">\r\n        <img src=\"https://prod-simpo.s3.ap-south-1.amazonaws.com/prod-images/107213c1716543334040empty-cart.png\" alt=\"\">\r\n      </div>\r\n      <div class=\"cart-text\">\r\n        <div class=\"heading-medium d-flex justify-content-center\">\r\n          Your cart is empty\r\n        </div>\r\n        <div class=\"description d-flex mt-4\">\r\n          Looks like you have not added anything to your cart. Go ahead & explore top categories.\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </section>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n\r\n</section>\r\n", styles: [".cart-parent{display:flex;margin-top:15px;gap:20px}.left-panel{width:65%}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029}.right-panel{width:35%}.my-bag{font-size:16px;font-weight:600;color:#000}.my-bag span{color:#939393}.item-parent{margin:10px 0}.lh-23{line-height:23px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;justify-content:flex-end;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:95px;width:100px;padding:0}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#626262;cursor:pointer}.item-quantity{margin-top:5px;display:flex;width:90px;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.left-panel,.right-panel{width:100%}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}}\n"] }]
+                    ], template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n  <div class=\"cart-parent container\" *ngIf=\"(responseData?.orderedItems?.length || 0) > 0\"  [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n    <div class=\"left-panel\">\r\n      <div class=\"my-bag\">\r\n        My Bag&nbsp; <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n      </div>\r\n      <div class=\"cart-items\">\r\n        <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n          <div class=\"row item-parent\">\r\n            <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n              <img class=\"product-img\" [src]=\"item.imgUrl\" alt=\"\">\r\n            </div>\r\n            <div class=\"col-md-6 h-100\">\r\n              <div class=\"lh-23\">\r\n                <div class=\"item-name heading-large\">{{item.itemName}}</div>\r\n                <div class=\"price-with-tax\">\r\n                  &#8377; {{item.price + (item.itemTax ?? 0)}}\r\n                </div>\r\n                <div class=\"item-quantity\">\r\n                  <span class=\"cursor\" (click)=\"addToCart(item, 'SUBSTRACT')\">-</span>\r\n                  <span>{{item.quantity}}</span>\r\n                  <span class=\"cursor\" (click)=\"addToCart(item, 'ADD')\">+</span>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            <div class=\"col-md-4 position-relative\" style=\"margin-left: auto;\">\r\n              <div class=\"item-price\">&#8377; {{(item.price + (item.itemTax ?? 0)) * item.quantity}}</div>\r\n              <div>\r\n                <mat-icon class=\"delete-item\" (click)=\"removeItem(item)\">delete</mat-icon>\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <hr *ngIf=\"responseData?.orderedItems?.length != (idx +1)\">\r\n        </ng-container>\r\n      </div>\r\n    </div>\r\n    <div class=\"right-panel\">\r\n      <div class=\"my-bag\">\r\n        Price Details\r\n      </div>\r\n      <div class=\"price-details\">\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.billdetails?.totalNetValue\">\r\n          <div class=\"price-type\">Total Price</div>\r\n          <div class=\"price-value\">&#8377; {{responseData.billdetails.totalNetValue}}</div>\r\n        </div>\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.billdetails?.totalTax\">\r\n          <div class=\"price-type\">Total Tax</div>\r\n          <div class=\"price-value\">&#8377; {{responseData?.billdetails?.totalTax}}</div>\r\n        </div>\r\n        <div class=\"price-parent-block\"\r\n          *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n          <div class=\"price-type\">Delivery Charge</div>\r\n          <div class=\"price-value\">&#8377; {{responseData.billdetails.deliveryCharges}}</div>\r\n        </div>\r\n        <hr>\r\n        <div class=\"price-parent-block\" *ngIf=\"responseData?.totalAmount\">\r\n          <div class=\"price-type\" style=\"color: black;font-weight: 600;\">Total Amount</div>\r\n          <div class=\"price-value\" style=\"font-weight: 600;\">&#8377; {{responseData.totalAmount}}</div>\r\n        </div>\r\n\r\n        <div class=\"button-parent\">\r\n          <div *ngFor=\"let button of data?.action?.buttons;let i = index\">\r\n            <button class=\"btn\" (click)=\"i == 0 ? proceedToCheckout() : proceedToListPage()\" simpoButtonDirective [id]=\"data?.id+button.id\" [buttonStyle]=\"button?.styles\"\r\n              [color]=\"styles?.background?.accentColor\">{{button?.content?.label}}</button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <section class=\"empty-cart\" *ngIf=\"(responseData?.orderedItems?.length || 0) == 0\">\r\n    <div>\r\n      <div class=\"cart-image\">\r\n        <img src=\"https://prod-simpo.s3.ap-south-1.amazonaws.com/prod-images/107213c1716543334040empty-cart.png\" alt=\"\">\r\n      </div>\r\n      <div class=\"cart-text\">\r\n        <div class=\"heading-medium d-flex justify-content-center\">\r\n          Your cart is empty\r\n        </div>\r\n        <div class=\"description d-flex mt-4\">\r\n          Looks like you have not added anything to your cart. Go ahead & explore top categories.\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </section>\r\n  <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n    <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n  </div>\r\n  <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n    <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n  </div>\r\n\r\n</section>\r\n", styles: [".cart-parent{display:flex;margin-top:15px;gap:20px}.left-panel{width:65%}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029}.right-panel{width:35%}.my-bag{font-size:16px;font-weight:600;color:#000}.my-bag span{color:#939393}.item-parent{margin:10px 0}.lh-23{line-height:23px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;justify-content:flex-end;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:95px;width:100px;padding:0}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#626262;cursor:pointer}.item-quantity{margin-top:5px;display:flex;width:90px;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.left-panel,.right-panel{width:100%}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}}\n"] }]
         }], ctorParameters: () => [{ type: EventsService }, { type: CartService }], propDecorators: { data: [{
                 type: Input
             }], responseData: [{
@@ -5248,7 +5291,7 @@ class WhislistComponent {
         this.cartService.addItemToFavourite(item);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: WhislistComponent, deps: [{ token: CartService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: WhislistComponent, isStandalone: true, selector: "simpo-whislist", inputs: { responseData: "responseData", data: "data", index: "index", edit: "edit", delete: "delete" }, ngImport: i0, template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\r\n    <div class=\"cart-parent container\" *ngIf=\"(responseData?.orderedItems?.length || 0) > 0\"  [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n      <div class=\"left-panel\">\r\n        <div class=\"my-bag\">\r\n          My Whislist&nbsp; <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n        </div>\r\n        \r\n        <div class=\"flex flex-wrap\">\r\n          <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n              <div class=\"cart-items\">\r\n                  <div class=\"row item-parent\">\r\n                  <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n                      <img class=\"product-img\" [src]=\"item.imgUrl.imgUrl\" alt=\"\">\r\n                  </div>\r\n                  <div class=\"col-md-6 h-100 item-desc\">\r\n                      <div class=\"lh-23\">\r\n                      <div class=\"item-name heading-large\">{{item.itemName}}</div>\r\n                      <div class=\"price-with-tax\">\r\n                          &#8377; {{item.price + (item.itemTax ?? 0)}}\r\n                      </div>\r\n                      <div class=\"item-quantity\">\r\n                          <span class=\"cursor\" (click)=\"addToFav(item, 'SUBSTRACT')\">-</span>\r\n                          <span>{{item.quantity}}</span>\r\n                          <span class=\"cursor\" (click)=\"addToFav(item, 'ADD')\">+</span>\r\n                      </div>\r\n                      </div>\r\n                  </div>\r\n                  <div class=\"position-relative itemPrice\" style=\"margin-left: auto; width: 30%;\">\r\n                      <div class=\"item-price\">&#8377; {{(item.price + (item.itemTax ?? 0)) * item.quantity}}</div>\r\n                      <div>\r\n                      <mat-icon class=\"cart-item\" (click)=\"moveToCart(item)\">add_shopping_cart</mat-icon>\r\n                      <mat-icon class=\"delete-item\" (click)=\"deleteFromWhislist(item)\">delete</mat-icon>\r\n                      </div>\r\n                  </div>\r\n                  </div>\r\n                  <hr *ngIf=\"responseData?.orderedItems?.length != (idx +1)\">\r\n              </div>\r\n          </ng-container>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  \r\n    <section class=\"empty-cart\" *ngIf=\"(responseData?.orderedItems?.length || 0) == 0\">\r\n      <div>\r\n        <div class=\"cart-image\">\r\n          <img src=\"https://prod-simpo.s3.ap-south-1.amazonaws.com/prod-images/107213c1716543334040empty-cart.png\" alt=\"\">\r\n        </div>\r\n        <div class=\"cart-text\">\r\n          <div class=\"heading-medium d-flex justify-content-center\">\r\n            Your Whislist is empty\r\n          </div>\r\n          <div class=\"description d-flex mt-4\">\r\n            Looks like you have not added anything to your Whislist. Go ahead & explore top categories.\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </section>\r\n  \r\n  </section>", styles: [".cart-parent{display:flex;flex-wrap:wrap;margin-top:15px;gap:20px}.left-panel{width:100%}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;width:48%;display:flex;flex-wrap:wrap}.my-bag{font-size:16px;font-weight:600;color:#000}.my-bag span{color:#939393}.item-parent{margin:10px 0;width:100%}.lh-23{line-height:23px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.cart-item{position:absolute;right:50px;bottom:10px;cursor:pointer}.item-price{display:flex;justify-content:flex-end;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:95px;width:100px;padding:0}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#626262;cursor:pointer}.item-quantity{margin-top:5px;display:flex;width:90px;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.item-parent{flex-direction:row!important;flex-wrap:nowrap!important}.cart-items,.left-panel{width:100%}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-desc{width:50%}.itemPrice{width:25%}}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: WhislistComponent, isStandalone: true, selector: "simpo-whislist", inputs: { responseData: "responseData", data: "data", index: "index", edit: "edit", delete: "delete" }, ngImport: i0, template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\r\n    <div class=\"cart-parent container\" *ngIf=\"(responseData?.orderedItems?.length || 0) > 0\"  [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n      <div class=\"left-panel\">\r\n        <div class=\"my-bag\">\r\n          My Whislist&nbsp; <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n        </div>\r\n        \r\n        <div class=\"d-flex flex-wrap justify-content-between\" style=\"gap: 10px;\">\r\n          <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n              <div class=\"cart-items\">\r\n                  <div class=\"row item-parent\">\r\n                  <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n                      <img class=\"product-img\" [src]=\"item.imgUrl\" alt=\"\">\r\n                  </div>\r\n                  <div class=\"col-md-6 h-100 item-desc\">\r\n                      <div class=\"lh-23\">\r\n                      <div class=\"item-name heading-large\">{{item.itemName}}</div>\r\n                      <div class=\"price-with-tax\">\r\n                          &#8377; {{item.price + (item.itemTax ?? 0)}}\r\n                      </div>\r\n                      <div class=\"item-quantity\">\r\n                          <span class=\"cursor\" (click)=\"addToFav(item, 'SUBSTRACT')\">-</span>\r\n                          <span>{{item.quantity}}</span>\r\n                          <span class=\"cursor\" (click)=\"addToFav(item, 'ADD')\">+</span>\r\n                      </div>\r\n                      </div>\r\n                  </div>\r\n                  <div class=\"position-relative itemPrice\" style=\"margin-left: auto; width: 30%;\">\r\n                      <div class=\"item-price\">&#8377; {{(item.price + (item.itemTax ?? 0)) * item.quantity}}</div>\r\n                      <div>\r\n                      <mat-icon class=\"cart-item\" (click)=\"moveToCart(item)\">add_shopping_cart</mat-icon>\r\n                      <mat-icon class=\"delete-item\" (click)=\"deleteFromWhislist(item)\">delete</mat-icon>\r\n                      </div>\r\n                  </div>\r\n                  </div>\r\n              </div>\r\n          </ng-container>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  \r\n    <section class=\"empty-cart\" *ngIf=\"(responseData?.orderedItems?.length || 0) == 0\">\r\n      <div>\r\n        <div class=\"cart-image\">\r\n          <img src=\"https://prod-simpo.s3.ap-south-1.amazonaws.com/prod-images/107213c1716543334040empty-cart.png\" alt=\"\">\r\n        </div>\r\n        <div class=\"cart-text\">\r\n          <div class=\"heading-medium d-flex justify-content-center\">\r\n            Your Whislist is empty\r\n          </div>\r\n          <div class=\"description d-flex mt-4\">\r\n            Looks like you have not added anything to your Whislist. Go ahead & explore top categories.\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </section>\r\n  \r\n  </section>", styles: [".cart-parent{display:flex;flex-wrap:wrap;margin-top:15px;gap:20px}.left-panel{width:100%}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;width:48%;display:flex;flex-wrap:wrap}.my-bag{font-size:16px;font-weight:600;color:#000}.my-bag span{color:#939393}.item-parent{margin:10px 0;width:100%}.lh-23{line-height:23px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.cart-item{position:absolute;right:50px;bottom:10px;cursor:pointer}.item-price{display:flex;justify-content:flex-end;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:95px;width:100px;padding:0}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#626262;cursor:pointer}.item-quantity{margin-top:5px;display:flex;width:90px;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.item-parent{flex-direction:row!important;flex-wrap:nowrap!important}.cart-items,.left-panel{width:100%}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-desc{width:50%}.itemPrice{width:25%}}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: WhislistComponent, decorators: [{
             type: Component,
@@ -5261,7 +5304,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
                         AnimationDirective,
                         ContentFitDirective,
                         HoverDirective
-                    ], template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\r\n    <div class=\"cart-parent container\" *ngIf=\"(responseData?.orderedItems?.length || 0) > 0\"  [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n      <div class=\"left-panel\">\r\n        <div class=\"my-bag\">\r\n          My Whislist&nbsp; <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n        </div>\r\n        \r\n        <div class=\"flex flex-wrap\">\r\n          <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n              <div class=\"cart-items\">\r\n                  <div class=\"row item-parent\">\r\n                  <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n                      <img class=\"product-img\" [src]=\"item.imgUrl.imgUrl\" alt=\"\">\r\n                  </div>\r\n                  <div class=\"col-md-6 h-100 item-desc\">\r\n                      <div class=\"lh-23\">\r\n                      <div class=\"item-name heading-large\">{{item.itemName}}</div>\r\n                      <div class=\"price-with-tax\">\r\n                          &#8377; {{item.price + (item.itemTax ?? 0)}}\r\n                      </div>\r\n                      <div class=\"item-quantity\">\r\n                          <span class=\"cursor\" (click)=\"addToFav(item, 'SUBSTRACT')\">-</span>\r\n                          <span>{{item.quantity}}</span>\r\n                          <span class=\"cursor\" (click)=\"addToFav(item, 'ADD')\">+</span>\r\n                      </div>\r\n                      </div>\r\n                  </div>\r\n                  <div class=\"position-relative itemPrice\" style=\"margin-left: auto; width: 30%;\">\r\n                      <div class=\"item-price\">&#8377; {{(item.price + (item.itemTax ?? 0)) * item.quantity}}</div>\r\n                      <div>\r\n                      <mat-icon class=\"cart-item\" (click)=\"moveToCart(item)\">add_shopping_cart</mat-icon>\r\n                      <mat-icon class=\"delete-item\" (click)=\"deleteFromWhislist(item)\">delete</mat-icon>\r\n                      </div>\r\n                  </div>\r\n                  </div>\r\n                  <hr *ngIf=\"responseData?.orderedItems?.length != (idx +1)\">\r\n              </div>\r\n          </ng-container>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  \r\n    <section class=\"empty-cart\" *ngIf=\"(responseData?.orderedItems?.length || 0) == 0\">\r\n      <div>\r\n        <div class=\"cart-image\">\r\n          <img src=\"https://prod-simpo.s3.ap-south-1.amazonaws.com/prod-images/107213c1716543334040empty-cart.png\" alt=\"\">\r\n        </div>\r\n        <div class=\"cart-text\">\r\n          <div class=\"heading-medium d-flex justify-content-center\">\r\n            Your Whislist is empty\r\n          </div>\r\n          <div class=\"description d-flex mt-4\">\r\n            Looks like you have not added anything to your Whislist. Go ahead & explore top categories.\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </section>\r\n  \r\n  </section>", styles: [".cart-parent{display:flex;flex-wrap:wrap;margin-top:15px;gap:20px}.left-panel{width:100%}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;width:48%;display:flex;flex-wrap:wrap}.my-bag{font-size:16px;font-weight:600;color:#000}.my-bag span{color:#939393}.item-parent{margin:10px 0;width:100%}.lh-23{line-height:23px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.cart-item{position:absolute;right:50px;bottom:10px;cursor:pointer}.item-price{display:flex;justify-content:flex-end;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:95px;width:100px;padding:0}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#626262;cursor:pointer}.item-quantity{margin-top:5px;display:flex;width:90px;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.item-parent{flex-direction:row!important;flex-wrap:nowrap!important}.cart-items,.left-panel{width:100%}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-desc{width:50%}.itemPrice{width:25%}}\n"] }]
+                    ], template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\r\n    <div class=\"cart-parent container\" *ngIf=\"(responseData?.orderedItems?.length || 0) > 0\"  [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\">\r\n      <div class=\"left-panel\">\r\n        <div class=\"my-bag\">\r\n          My Whislist&nbsp; <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n        </div>\r\n        \r\n        <div class=\"d-flex flex-wrap justify-content-between\" style=\"gap: 10px;\">\r\n          <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n              <div class=\"cart-items\">\r\n                  <div class=\"row item-parent\">\r\n                  <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n                      <img class=\"product-img\" [src]=\"item.imgUrl\" alt=\"\">\r\n                  </div>\r\n                  <div class=\"col-md-6 h-100 item-desc\">\r\n                      <div class=\"lh-23\">\r\n                      <div class=\"item-name heading-large\">{{item.itemName}}</div>\r\n                      <div class=\"price-with-tax\">\r\n                          &#8377; {{item.price + (item.itemTax ?? 0)}}\r\n                      </div>\r\n                      <div class=\"item-quantity\">\r\n                          <span class=\"cursor\" (click)=\"addToFav(item, 'SUBSTRACT')\">-</span>\r\n                          <span>{{item.quantity}}</span>\r\n                          <span class=\"cursor\" (click)=\"addToFav(item, 'ADD')\">+</span>\r\n                      </div>\r\n                      </div>\r\n                  </div>\r\n                  <div class=\"position-relative itemPrice\" style=\"margin-left: auto; width: 30%;\">\r\n                      <div class=\"item-price\">&#8377; {{(item.price + (item.itemTax ?? 0)) * item.quantity}}</div>\r\n                      <div>\r\n                      <mat-icon class=\"cart-item\" (click)=\"moveToCart(item)\">add_shopping_cart</mat-icon>\r\n                      <mat-icon class=\"delete-item\" (click)=\"deleteFromWhislist(item)\">delete</mat-icon>\r\n                      </div>\r\n                  </div>\r\n                  </div>\r\n              </div>\r\n          </ng-container>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  \r\n    <section class=\"empty-cart\" *ngIf=\"(responseData?.orderedItems?.length || 0) == 0\">\r\n      <div>\r\n        <div class=\"cart-image\">\r\n          <img src=\"https://prod-simpo.s3.ap-south-1.amazonaws.com/prod-images/107213c1716543334040empty-cart.png\" alt=\"\">\r\n        </div>\r\n        <div class=\"cart-text\">\r\n          <div class=\"heading-medium d-flex justify-content-center\">\r\n            Your Whislist is empty\r\n          </div>\r\n          <div class=\"description d-flex mt-4\">\r\n            Looks like you have not added anything to your Whislist. Go ahead & explore top categories.\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </section>\r\n  \r\n  </section>", styles: [".cart-parent{display:flex;flex-wrap:wrap;margin-top:15px;gap:20px}.left-panel{width:100%}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;width:48%;display:flex;flex-wrap:wrap}.my-bag{font-size:16px;font-weight:600;color:#000}.my-bag span{color:#939393}.item-parent{margin:10px 0;width:100%}.lh-23{line-height:23px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.cart-item{position:absolute;right:50px;bottom:10px;cursor:pointer}.item-price{display:flex;justify-content:flex-end;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:95px;width:100px;padding:0}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#626262;cursor:pointer}.item-quantity{margin-top:5px;display:flex;width:90px;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.total-container{height:auto;position:relative;display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.item-parent{flex-direction:row!important;flex-wrap:nowrap!important}.cart-items,.left-panel{width:100%}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-desc{width:50%}.itemPrice{width:25%}}\n"] }]
         }], ctorParameters: () => [{ type: CartService }], propDecorators: { responseData: [{
                 type: Input
             }], data: [{
@@ -5391,6 +5434,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
                 type: Input
             }] } });
 
+class Cart {
+    constructor(json, type = null) {
+        this.cartId = json?.["cartId"];
+        this.pgOrderId = json?.["pgOrderId"];
+        this.orderedItems = json?.["orderedItems"];
+        this.billdetails = json?.["billdetails"];
+        this.platform = json?.["platform"];
+        this.locationDetails = json?.["locationDetails"];
+        this.userDetails = json?.["userDetails"];
+    }
+}
+
 class BaseCollection {
     constructor(json) {
         this.storeId = json?.["storeId"];
@@ -5457,6 +5512,7 @@ class Product {
         this.recommended = json?.["recommended"];
         this.returnable = json?.["returnable"];
         this.availableOnCod = json?.["availableOnCod"];
+        this.prviewIdx = 0;
         this.quantity = json?.["quantity"] ?? 0;
     }
 }
@@ -5471,5 +5527,5 @@ class Product {
  * Generated bundle index. Do not edit.
  */
 
-export { AddNewSectionComponent, AlignContent, AnimationDirective, AuthenticateUserComponent, BANNERALIGNMENT, BANNERHALIGN, BackgroundDirective, BannerCarouselComponent, BannerContentFitDirective, BannerGridSectionComponent, BannerSectionComponent, BlogListComponent, BorderDirective, ButtonDirectiveDirective, CartComponent, Category, ChannelType, CheckoutComponent, ChooseUsSectionComponent, Collection, ColorDirective, ColumnDirectiveDirective, ContactUsComponent, ContainerFitDirective, ContentFitDirective, CornerDirective, Corners, EventsService, FaqSectionComponent, FeaturedCategoryComponent, FeaturedProductsComponent, FeaturesSectionComponent, FooterSectionComponent, FooterTypes, HALIGN, HeaderButtonStyle, HeaderTextComponent, HoverDirective, ImageCarouselSectionComponent, ImageDirectiveDirective, ImageFit, ImageGridSectionComponent, ImageRatio, ImageSectionComponent, LocationSectionComponent, LogoShowcaseComponent, MapType, NavbarSectionComponent, ObjectPositionDirective, OverlayDirective, OverlayValue, Padding, PositionLayoutDirectiveDirective, PricingSectionComponent, ProcessModernComponent, ProcessSectionComponent, Product, ProductDescComponent, ProductListComponent, RecentBlogPostSectionComponent, RedirectionLinkType, SPACING$1 as SPACING, ServiceSectionComponent, SimpoContainerAligment, SimpoFooterLayoutDirective, SimpoStickyDirective, SkeletonLoaderSectionComponent, Style, TEXT_SIZE, TeamMemberSectionComponent, TestimonialFullwidthComponent, TestimonialSectionComponent, TextBackgroundDirectiveDirective, TextImageSectionComponent, TextPosition, TextSectionComponent, UserProfileComponent, VALIGN, VideoSectionComponent, ViewBlogComponent, WhislistComponent, animation, applySpacing, applyStyle, contentAlignment, fitContent, fitScreen, fontSize, logoDirection, logoSpeed, logoType, mapStyle, showCaseType, simpoConetenAlignmentDirective };
+export { AddNewSectionComponent, AlignContent, AnimationDirective, AuthenticateUserComponent, BANNERALIGNMENT, BANNERHALIGN, BackgroundDirective, BannerCarouselComponent, BannerContentFitDirective, BannerGridSectionComponent, BannerSectionComponent, BlogListComponent, BorderDirective, ButtonDirectiveDirective, Cart, CartComponent, Category, ChannelType, CheckoutComponent, ChooseUsSectionComponent, Collection, ColorDirective, ColumnDirectiveDirective, ContactUsComponent, ContainerFitDirective, ContentFitDirective, CornerDirective, Corners, EventsService, FaqSectionComponent, FeaturedCategoryComponent, FeaturedProductsComponent, FeaturesSectionComponent, FooterSectionComponent, FooterTypes, HALIGN, HeaderButtonStyle, HeaderTextComponent, HoverDirective, ImageCarouselSectionComponent, ImageDirectiveDirective, ImageFit, ImageGridSectionComponent, ImageRatio, ImageSectionComponent, LocationSectionComponent, LogoShowcaseComponent, MapType, NavbarSectionComponent, ObjectPositionDirective, OverlayDirective, OverlayValue, Padding, PositionLayoutDirectiveDirective, PricingSectionComponent, ProcessModernComponent, ProcessSectionComponent, Product, ProductDescComponent, ProductListComponent, RecentBlogPostSectionComponent, RedirectionLinkType, SPACING$1 as SPACING, ServiceSectionComponent, SimpoContainerAligment, SimpoFooterLayoutDirective, SimpoStickyDirective, SkeletonLoaderSectionComponent, Style, TEXT_SIZE, TeamMemberSectionComponent, TestimonialFullwidthComponent, TestimonialSectionComponent, TextBackgroundDirectiveDirective, TextImageSectionComponent, TextPosition, TextSectionComponent, UserProfileComponent, VALIGN, VideoSectionComponent, ViewBlogComponent, WhislistComponent, animation, applySpacing, applyStyle, contentAlignment, fitContent, fitScreen, fontSize, logoDirection, logoSpeed, logoType, mapStyle, showCaseType, simpoConetenAlignmentDirective };
 //# sourceMappingURL=simpo-component-library.mjs.map