ng-easycommerce-v18 0.0.3 → 0.0.5

package/fesm2022/ng-easycommerce-v18.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, makeEnvironmentProviders, inject, Injectable, PLATFORM_ID, RendererFactory2, afterNextRender, signal, EnvironmentInjector, runInInjectionContext, Component, CUSTOM_ELEMENTS_SCHEMA, Input, Pipe, EventEmitter, Output, forwardRef, afterRender, ViewChild } from '@angular/core';
+import { InjectionToken, makeEnvironmentProviders, inject, Injectable, PLATFORM_ID, RendererFactory2, afterNextRender, signal, EnvironmentInjector, runInInjectionContext, Component, CUSTOM_ELEMENTS_SCHEMA, Input, Pipe, EventEmitter, Output, forwardRef, afterRender, ViewChild, Injector, Directive, Inject } from '@angular/core';
 import * as i1 from '@angular/common';
 import { isPlatformBrowser, DOCUMENT, AsyncPipe, CommonModule, JsonPipe, UpperCasePipe, Location, TitleCasePipe } from '@angular/common';
 import { take, BehaviorSubject, shareReplay, map, catchError, of, filter, ReplaySubject, firstValueFrom, concatMap, switchMap, combineLatest, throwError } from 'rxjs';
@@ -12,7 +12,7 @@ import { Router, NavigationEnd, RouterLink, RouterModule, ActivatedRoute, Router
 import { signalStore, withState, withMethods, patchState } from '@ngrx/signals';
 import { ToastrService } from 'ngx-toastr';
 import moment from 'moment';
-import { LocalStorage } from '@ngx-pwa/local-storage';
+import { StorageMap } from '@ngx-pwa/local-storage';
 import * as i1$3 from '@angular/forms';
 import { Validators, FormBuilder, NG_VALUE_ACCESSOR, ReactiveFormsModule, FormsModule } from '@angular/forms';
 import { register } from 'swiper/element/bundle';
@@ -3283,11 +3283,12 @@ class AuthService {
      * Chequea si un usuario esta habilitado a comprar o no.
      * @returns
      */
-    isAbleToBuy() {
-        const currentUser = this.getUserProfileAsUser();
-        const isSeller = currentUser.typeUser && currentUser.typeUser == 'seller' || false;
-        return !isSeller || !this.getCustomer();
-    }
+    // isAbleToBuy():boolean {
+    // 	const currentUser = this.getUserProfileAsUser() as User;
+    // 	const isSeller = currentUser.typeUser && currentUser.typeUser == 'seller' || false
+    // 	return !isSeller || !this.getCustomer();
+    // }
+    isAbleToBuy = () => !this.getUserProfileAsUser()?.isSeller() || !!this.getCustomer();
     /**
      * Retorna un usuario de tipo cliente.
      * @returns
@@ -3374,6 +3375,16 @@ class AuthService {
             locale: channelConfig.locale
         });
     };
+    getUserProfile() {
+        return (this._user && of(this._user)) || this.getCurrentUser();
+    }
+    getCurrentUser() {
+        this._user = new User();
+        if (!this.loadUserFromStorage()) {
+            this._user = null;
+        }
+        return of(this._user);
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AuthService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AuthService, providedIn: 'root' });
 }
@@ -3448,7 +3459,7 @@ class FiltersService {
     setFilters(paginationSettings) {
         let final_filters = [];
         if (this._optionsFilters?.includes('all'))
-            this._optionsFilters = ['attributes', 'categories', 'dynamics', 'sort'];
+            this._optionsFilters = ['attributes', 'categories', 'dynamics', 'sort', 'price_range'];
         runInInjectionContext(this.environmentInjector, () => {
             const filterFactory = new FilterFactory();
             this._optionsFilters?.forEach(filter => final_filters.push(filterFactory.create(filter, paginationSettings)));
@@ -3458,6 +3469,7 @@ class FiltersService {
             filter && filterDefault.codes.forEach(value => filter.setSelected(value));
         });
         this._filtersSubject.next(final_filters);
+        // case 'price_range': instance = new PriceRangeFilter(); break; COMO ADAPTO ESTE CODIGO A LA NUEVA ESTRUCTURA DE FILTROS
     }
     /**
      * Obtengo filtros especificos según el tipo.
@@ -3544,6 +3556,8 @@ class PaginationService {
     nextProducts$ = this._nextProductsSubject.asObservable();
     _resetSubject = new BehaviorSubject(false);
     reset$ = this._resetSubject.asObservable();
+    priceRangeSubject = new BehaviorSubject({ price_min: 0, price_max: 0 });
+    priceRange$ = this.priceRangeSubject.asObservable();
     constructor() { }
     /**
      * Inicializa la configuración para el Servicio de Paginación.
@@ -3589,6 +3603,11 @@ class PaginationService {
         this._dataPagination.set({ ...response, called: true });
         this._finished = (response.page == response.pages);
         this._waiting = false;
+        // Emitir los valores de price_min y price_max a través de priceRangeSubject
+        // this.priceRangeSubject.next({
+        //     price_min: response.price_min,
+        //     price_max: response.price_max
+        // });
     }
     /**
      * Marca el final de las paginas, es decir cuando ya no queda mas elementos que mostrar.
@@ -3671,6 +3690,54 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                 }]
         }], ctorParameters: () => [] });
 
+class PriceRangeFilter extends Filter {
+    minPrice = 0;
+    maxPrice = 1000;
+    currentMinPrice = null;
+    currentMaxPrice = null;
+    type = () => 'price_range';
+    // Método para configurar el rango de precios inicial
+    setContent = (options) => {
+        this.minPrice = options.minPrice || this.minPrice;
+        this.maxPrice = options.maxPrice || this.maxPrice;
+        this.currentMinPrice = options.currentMinPrice || this.minPrice;
+        this.currentMaxPrice = options.currentMaxPrice || this.maxPrice;
+    };
+    updatePrices(min, max) {
+        this.minPrice = min;
+        this.maxPrice = max;
+    }
+    // Método para actualizar los valores seleccionados
+    setSelected = (min, max) => {
+        this.currentMinPrice = min;
+        this.currentMaxPrice = max;
+    };
+    // Retorna los valores seleccionados (rango de precios)
+    getSelectedRange = () => {
+        return {
+            min: this.currentMinPrice || this.minPrice,
+            max: this.currentMaxPrice || this.maxPrice,
+        };
+    };
+    // Genera los parámetros de la URL en base al rango de precios seleccionado
+    toUrlParams = () => {
+        let params = '';
+        if (this.currentMinPrice !== null) {
+            params += `&price_min=${this.currentMinPrice}`;
+        }
+        if (this.currentMaxPrice !== null) {
+            params += `&price_max=${this.currentMaxPrice}`;
+        }
+        return params;
+    };
+    // Restablece el filtro a los valores por defecto
+    reset = () => {
+        this.currentMinPrice = 0;
+        this.currentMaxPrice = this.maxPrice;
+    };
+}
+
+;
 class ProductsService {
     _connection = inject(ConnectionService);
     _apiConsts = inject(ApiConstantsService);
@@ -3680,6 +3747,8 @@ class ProductsService {
     _productsSubject = new BehaviorSubject([]);
     products$ = this._productsSubject.asObservable();
     _filtersService = inject(FiltersService);
+    filtersSubject = new BehaviorSubject([]);
+    filters$ = this.filtersSubject.asObservable();
     searchValue = signal('');
     constructor() {
         this._paginationService.reset$.subscribe(res => {
@@ -3692,10 +3761,18 @@ class ProductsService {
             const currentProducts = this._productsSubject.value;
             this._productsSubject.next([...currentProducts, ...products]);
         });
+        // Suscribirse a los cambios en el rango de precios
+        this._paginationService.priceRange$.subscribe(range => {
+            this.updatePriceRangeFilter(range.price_min, range.price_max);
+        });
     }
     //API URL
     _shopApiUrl = this._apiConsts.SHOP_API_URL;
     productByCodeApi(code, variant) { return this._shopApiUrl + this._apiConsts.CHANNEL + '/products/by-code/' + (variant ? 'variant/' : '') + code + '?locale=' + this._apiConsts.LOCALE; }
+    // review
+    saveProductReviewsApi(code) { return this._shopApiUrl + this._apiConsts.CHANNEL + '/products/by-code/' + code + '/reviews'; }
+    //related products
+    relatedProductsApi = (key) => 'shop-api/' + this._apiConsts.CHANNEL + '/products/related/by-code/' + key + '?locale=' + this._apiConsts.LOCALE;
     /**
      * Setea los filtros para obtener los productos.
      * @param paginationSettings
@@ -3722,6 +3799,13 @@ class ProductsService {
     getProductByCode(code, variant) {
         return this._connection.get(this.productByCodeApi(code, variant));
     }
+    /**
+    * @description Guarda la reseña de un producto.
+    * @param code
+    * @param form_data
+    * @returns
+    */
+    saveReviews = (code, form_data) => this._connection.post(this.saveProductReviewsApi(code), form_data);
     /**
      * Recibe una lista de productos y retorna los mismos productos tantas veces como variantes tenga.
      * cada producto retornado tendrá una única variante.
@@ -3801,6 +3885,15 @@ class ProductsService {
     getObjectWithVariant = () => {
         return this._consts.getParamsProductsWithUniqueVariant();
     };
+    updatePriceRangeFilter(min, max) {
+        const final_filters = this.filtersSubject.value;
+        const priceRangeFilter = final_filters.find(filter => filter instanceof PriceRangeFilter);
+        if (priceRangeFilter) {
+            priceRangeFilter.updatePrices(min, max);
+            this.filtersSubject.next(final_filters);
+        }
+    }
+    getRelatedProducts = (key) => this._connection.get(this.relatedProductsApi(key));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: ProductsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: ProductsService, providedIn: 'root' });
 }
@@ -3820,11 +3913,11 @@ class NgxLocalStorageService {
     /**
      * Servicio usado para guardar los datos en el localstorage.
      */
-    _storage = inject(LocalStorage);
+    _storage = inject(StorageMap);
     constructor() { }
     getItemPromise(key) {
         return new Promise((resolve, reject) => {
-            this._storage.getItem(key).subscribe({
+            this._storage.get(key).subscribe({
                 next: (data) => resolve(data),
                 error: (err) => reject(err),
             });
@@ -3836,7 +3929,7 @@ class NgxLocalStorageService {
      * @returns
      */
     getItem(key) {
-        return this._storage.getItem(key);
+        return this._storage.get(key);
     }
     /**
      * Guarda un dato en el storage.
@@ -3845,7 +3938,7 @@ class NgxLocalStorageService {
      * @param metadata Opciones extra que puede necesitar el servicio.
      */
     setItem(key, value, metadata = { path: '/' }) {
-        this._storage.setItem(key, value).subscribe(() => { });
+        this._storage.set(key, value).subscribe(() => { });
     }
     /**
      * Remueve el item del storage.
@@ -3853,7 +3946,7 @@ class NgxLocalStorageService {
      * @param metadata Opciones extra que puede necesitar el servicio.
      */
     removeItem(key, metadata) {
-        this._storage.removeItem(key).subscribe(() => { });
+        this._storage.delete(key).subscribe(() => { });
     }
     /**
      * Limpia el Storage.
@@ -3896,6 +3989,8 @@ class CartService {
         showMax: false,
         showPrice: false,
         remainingCredits: 0,
+        applyMaxOrders: false,
+        maxOrders: Infinity
     });
     CART_KEY = 'cart';
     CART_TOKEN_KEY = 'cart_token';
@@ -3909,6 +4004,13 @@ class CartService {
     cart$ = this._cartSubject.asObservable();
     loading$ = this._requestInProcess.asObservable();
     _haveToUpdate = true;
+    balanceCustomer$ = this._balanceCustomerSubject.asObservable();
+    allowAnyPaymentMethod$ = this.balanceCustomer$.pipe(map(data => data.allowAnyPaymentMethod));
+    allowExceedBalance$ = this.balanceCustomer$.pipe(map(data => data.allowExceedBalance));
+    creditAmount$ = this.balanceCustomer$.pipe(map(data => data.creditAmount));
+    showMax$ = this.balanceCustomer$.pipe(map(data => data.showMax));
+    showPrice$ = this.balanceCustomer$.pipe(map(data => data.showPrice));
+    promotions$ = this._promotionsSubject.asObservable();
     //API URL
     _cartBaseUrl = `${this._apiConsts.SHOP_API_URL}${this._apiConsts.CHANNEL}/carts`;
     updateItemQuantityApi(item_id) { return this._cartBaseUrl + '/' + this.cartToken + '/items/' + item_id + '?locale=' + this._apiConsts.LOCALE; }
@@ -3979,7 +4081,11 @@ class CartService {
      * @returns
      */
     addToCart(product, quantity, variantId) {
-        //console.log(product);
+        const balance = this._balanceCustomerSubject.value;
+        if (balance.applyMaxOrders && (balance.maxOrders && (balance.maxOrders <= 0 || balance.maxOrders === null))) {
+            this._toastService.show('max-orders-reached');
+            return;
+        }
         if (!this._authService.isAbleToBuy()) {
             this._toastService.show('must-select-customer');
             return;
@@ -4302,6 +4408,8 @@ class CartService {
             remainingCredits: cartData?.creditAmount && cartData?.creditAmount >= cartData?.totals.total
                 ? cartData?.creditAmount - cartData?.totals.total
                 : 0,
+            applyMaxOrders: cartData?.applyMaxOrders ?? false,
+            maxOrders: cartData?.maxOrders ?? Infinity
         };
         this._balanceCustomerSubject.next(balanceData);
         console.log(balanceData);
@@ -4318,6 +4426,8 @@ class CartService {
             error: (err) => this.handleError(err)
         });
     }
+    getCreditAmount = () => this._balanceCustomerSubject.pipe(map((balanceCustomer) => balanceCustomer?.creditAmount ?? null));
+    getRemainingCredits = () => this._balanceCustomerSubject.pipe(map((balanceCustomer) => balanceCustomer?.remainingCredits));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: CartService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: CartService, providedIn: 'root' });
 }
@@ -5243,10 +5353,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
 class OrdersService {
     _connection = inject(ConnectionService);
     _apiConsts = inject(ApiConstantsService);
+    _cartService = inject(CartService);
     _ordersSubject = new BehaviorSubject(null);
     _errorSubject = new BehaviorSubject(null);
+    _selectedOrderSubject = new BehaviorSubject(null);
     orders$ = this._ordersSubject.asObservable();
+    selectedOrder$ = this._selectedOrderSubject.asObservable();
     loading = false;
+    channelConfig = {};
     //API URL
     ordersListapi() { return `shop-api/${this._apiConsts.CHANNEL}/orders`; }
     ;
@@ -5273,6 +5387,28 @@ class OrdersService {
             return order;
         });
     }
+    setSelectedOrder(order) {
+        this._selectedOrderSubject.next(order);
+        this.channelConfig = (this._cartService.channelConfig);
+    }
+    getOrderByNumber(number) {
+        this.loading = true;
+        this._connection.get(this.ordersListapi())
+            .pipe(map(res => {
+            let orders = this.mapOrdersAndAddInfo(res);
+            const order = orders.find((order) => order.number == number);
+            return order;
+        }))
+            .subscribe({
+            next: (response) => {
+                this._selectedOrderSubject.next(response);
+                this.loading = false;
+            },
+            error: (e) => {
+                this._errorSubject.next({ message: 'unable-get-orders' });
+            }
+        });
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: OrdersService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: OrdersService, providedIn: 'root' });
 }
@@ -5847,11 +5983,11 @@ class PriceEcComponent {
      */
     saleprice;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: PriceEcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: PriceEcComponent, isStandalone: true, selector: "app-price-ec", inputs: { price: "price", saleprice: "saleprice" }, ngImport: i0, template: "@if(saleprice){\r\n    <!--With saleprice-->\r\n  <div class=\"\">\r\n    @if(price && price.split(' - ').length > 1){\r\n        <div class=\"price text-center p-0 mx-0 mx-md-3\">\r\n            <del class=\"text-center  price\">\r\n                {{ price.split(' - ')[0] | ecCurrencySymbol }}\r\n                {{ price.split(' - ')[1] | ecCurrencySymbol }}\r\n            </del>\r\n        </div>\r\n    }@else {\r\n        <!--Simple Price Del-->\r\n        <div class=\" text-center delete p-0 mx-0 mx-md-3\">\r\n            <del class=\" text-center delete\">\r\n                {{ price | ecCurrencySymbol }}</del>\r\n        </div>\r\n    }\r\n    @if(saleprice && saleprice.split(' - ').length > 1){\r\n        <div class=\"\">\r\n            {{\r\n            saleprice.split(' - ')[0] | ecCurrencySymbol\r\n            }}\r\n            {{\r\n            saleprice.split(' - ')[1] | ecCurrencySymbol\r\n            }}\r\n        </div>\r\n    } @else {\r\n        <!--Simple saleprice-->\r\n        <div class=\"text-center  price p-0 mx-0 mx-md-3\">\r\n            {{ saleprice | ecCurrencySymbol }}\r\n       </div>\r\n    }\r\n</div>  \r\n}@else {\r\n    <!--Only Price-->\r\n    @if(price && price.split(' - ').length > 1){\r\n        <div class=\"price\">\r\n            {{ price.split(' - ')[0] | ecCurrencySymbol }} -\r\n            {{ price.split(' - ')[1] | ecCurrencySymbol }}\r\n        </div> \r\n    } @else {\r\n        <!--Simple price-->\r\n        <div class=\"text-center price p-0 mx-0 mx-md-3\">\r\n            {{ price | ecCurrencySymbol }}\r\n        </div>\r\n    }\r\n}", styles: [""], dependencies: [{ kind: "pipe", type: EcCurrencySymbolPipe, name: "ecCurrencySymbol" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: PriceEcComponent, isStandalone: true, selector: "app-price-ec", inputs: { price: "price", saleprice: "saleprice" }, ngImport: i0, template: " <div class=\"price\">\r\n    @if(saleprice){\r\n    <!--With saleprice-->\r\n \r\n    @if(price && price.split(' - ').length > 1){\r\n        <div class=\"price-whithSaleprice\">\r\n            <del class=\"\">\r\n                {{ price.split(' - ')[0] | ecCurrencySymbol }}\r\n                {{ price.split(' - ')[1] | ecCurrencySymbol }}\r\n            </del>\r\n        </div>\r\n    }@else {\r\n        <!--Simple Price Del-->\r\n        <div class=\"price-simpleDel\">\r\n            <del class=\"\">\r\n                {{ price | ecCurrencySymbol }}</del>\r\n        </div>\r\n    }\r\n    @if(saleprice && saleprice.split(' - ').length > 1){\r\n        <div class=\"\">\r\n            {{\r\n            saleprice.split(' - ')[0] | ecCurrencySymbol\r\n            }}\r\n            {{\r\n            saleprice.split(' - ')[1] | ecCurrencySymbol\r\n            }}\r\n        </div>\r\n    } @else {\r\n        <!--Simple saleprice-->\r\n        <div class=\"price-simpleSaleprice\">\r\n            {{ saleprice | ecCurrencySymbol }}\r\n       </div>\r\n    }\r\n\r\n}@else {\r\n    <!--Only Price-->\r\n\r\n    @if(price && price.split(' - ').length > 1){\r\n        <div class=\"price-onlyPrice\">\r\n            {{ price.split(' - ')[0] | ecCurrencySymbol }} -\r\n            {{ price.split(' - ')[1] | ecCurrencySymbol }}\r\n        </div> \r\n    } @else {\r\n        <!--Simple price-->\r\n        <del>&nbsp;</del>\r\n        <div class=\"price-simplePrice\">\r\n            {{ price | ecCurrencySymbol }}\r\n        </div>\r\n    }\r\n}\r\n</div>  ", styles: [""], dependencies: [{ kind: "pipe", type: EcCurrencySymbolPipe, name: "ecCurrencySymbol" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: PriceEcComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-price-ec', standalone: true, imports: [EcCurrencySymbolPipe], template: "@if(saleprice){\r\n    <!--With saleprice-->\r\n  <div class=\"\">\r\n    @if(price && price.split(' - ').length > 1){\r\n        <div class=\"price text-center p-0 mx-0 mx-md-3\">\r\n            <del class=\"text-center  price\">\r\n                {{ price.split(' - ')[0] | ecCurrencySymbol }}\r\n                {{ price.split(' - ')[1] | ecCurrencySymbol }}\r\n            </del>\r\n        </div>\r\n    }@else {\r\n        <!--Simple Price Del-->\r\n        <div class=\" text-center delete p-0 mx-0 mx-md-3\">\r\n            <del class=\" text-center delete\">\r\n                {{ price | ecCurrencySymbol }}</del>\r\n        </div>\r\n    }\r\n    @if(saleprice && saleprice.split(' - ').length > 1){\r\n        <div class=\"\">\r\n            {{\r\n            saleprice.split(' - ')[0] | ecCurrencySymbol\r\n            }}\r\n            {{\r\n            saleprice.split(' - ')[1] | ecCurrencySymbol\r\n            }}\r\n        </div>\r\n    } @else {\r\n        <!--Simple saleprice-->\r\n        <div class=\"text-center  price p-0 mx-0 mx-md-3\">\r\n            {{ saleprice | ecCurrencySymbol }}\r\n       </div>\r\n    }\r\n</div>  \r\n}@else {\r\n    <!--Only Price-->\r\n    @if(price && price.split(' - ').length > 1){\r\n        <div class=\"price\">\r\n            {{ price.split(' - ')[0] | ecCurrencySymbol }} -\r\n            {{ price.split(' - ')[1] | ecCurrencySymbol }}\r\n        </div> \r\n    } @else {\r\n        <!--Simple price-->\r\n        <div class=\"text-center price p-0 mx-0 mx-md-3\">\r\n            {{ price | ecCurrencySymbol }}\r\n        </div>\r\n    }\r\n}" }]
+            args: [{ selector: 'app-price-ec', standalone: true, imports: [EcCurrencySymbolPipe], template: " <div class=\"price\">\r\n    @if(saleprice){\r\n    <!--With saleprice-->\r\n \r\n    @if(price && price.split(' - ').length > 1){\r\n        <div class=\"price-whithSaleprice\">\r\n            <del class=\"\">\r\n                {{ price.split(' - ')[0] | ecCurrencySymbol }}\r\n                {{ price.split(' - ')[1] | ecCurrencySymbol }}\r\n            </del>\r\n        </div>\r\n    }@else {\r\n        <!--Simple Price Del-->\r\n        <div class=\"price-simpleDel\">\r\n            <del class=\"\">\r\n                {{ price | ecCurrencySymbol }}</del>\r\n        </div>\r\n    }\r\n    @if(saleprice && saleprice.split(' - ').length > 1){\r\n        <div class=\"\">\r\n            {{\r\n            saleprice.split(' - ')[0] | ecCurrencySymbol\r\n            }}\r\n            {{\r\n            saleprice.split(' - ')[1] | ecCurrencySymbol\r\n            }}\r\n        </div>\r\n    } @else {\r\n        <!--Simple saleprice-->\r\n        <div class=\"price-simpleSaleprice\">\r\n            {{ saleprice | ecCurrencySymbol }}\r\n       </div>\r\n    }\r\n\r\n}@else {\r\n    <!--Only Price-->\r\n\r\n    @if(price && price.split(' - ').length > 1){\r\n        <div class=\"price-onlyPrice\">\r\n            {{ price.split(' - ')[0] | ecCurrencySymbol }} -\r\n            {{ price.split(' - ')[1] | ecCurrencySymbol }}\r\n        </div> \r\n    } @else {\r\n        <!--Simple price-->\r\n        <del>&nbsp;</del>\r\n        <div class=\"price-simplePrice\">\r\n            {{ price | ecCurrencySymbol }}\r\n        </div>\r\n    }\r\n}\r\n</div>  " }]
         }], propDecorators: { price: [{
                 type: Input
             }], saleprice: [{
@@ -5875,6 +6011,7 @@ class ProductEcComponent {
      * Constantes del core
      */
     loaded = new EventEmitter();
+    isCollection = false;
     ngOnInit() {
         this.loaded.emit(this.product.id);
     }
@@ -5885,12 +6022,23 @@ class ProductEcComponent {
      * URL para las imagenes del producto.
      */
     mediaUrl = this.consts.mediaUrl();
+    openWhatsApp(url) {
+        if (url) {
+            window.open(url, '_blank');
+        }
+    }
+    get shouldShowPrice() {
+        return !this.product?.special_mark || this.product.special_mark.length === 0 || this.product.special_mark[0]?.showPrice;
+    }
+    get hasDiscount() {
+        return this.product.saleprice && this.product.saleprice !== this.product.price;
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: ProductEcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: ProductEcComponent, isStandalone: true, selector: "app-product-ec", inputs: { product: "product", isProductBox: "isProductBox" }, outputs: { loaded: "loaded" }, ngImport: i0, template: "@if(isProductBox){\r\n    <div class=\"position-relative h-100\">\r\n        <div class=\"marcas position-absolute w-100\">\r\n            <span>20 %OFF</span>\r\n        </div>\r\n        <div>\r\n            @if(product.picturesdefault){\r\n                <img [src]=\"mediaUrl+product.picturesdefault[0]\" class=\"img-fluid mx-auto\" />\r\n            }\r\n        </div>\r\n        <div class=\"d-flex flex-column justify-center align-items-center\">\r\n            <h6 class=\"productName text-center\">{{product.name}}aa</h6> \r\n            <p class=\"productID\">{{product.id}}</p>\r\n            @if(product.shortdetails){\r\n                <div class=\"shortdetails\" [innerHTML]=\"product.shortdetails\"></div>\r\n            }\r\n            @if(product.currentOption && product.currentOption.name){\r\n                <p class=\"currentOption\" >{{product.currentOption.name}}</p>\r\n            }\r\n        </div>\r\n        <div class=\"d-flex flex-column justify-center alig-items-center\">\r\n            @if(true){\r\n                <!--Servicio de auth para controlar si esta logueado o no-->\r\n                <app-price-ec [price]=\"product.price\" [saleprice]=\"product.saleprice\" class=\"\" />\r\n            }\r\n            <button class=\"btn btn-primary\" routerLink=\"{{'/product/' + product.id}}\">Ver Producto</button>\r\n        </div>\r\n    </div>\r\n} @else {\r\n    \r\n}\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: PriceEcComponent, selector: "app-price-ec", inputs: ["price", "saleprice"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: ProductEcComponent, isStandalone: true, selector: "app-product-ec", inputs: { product: "product", isProductBox: "isProductBox", isCollection: "isCollection" }, outputs: { loaded: "loaded" }, ngImport: i0, template: "<a [routerLink]=\"['/product', product.id]\" class=\"text-decoration-none\">\r\n    <!-- Marca especial y descuento -->\r\n    <!-- <div *ngIf=\"product.saleprice || (product.special_mark && product.special_mark !== null && product.special_mark !== undefined && product.special_mark.length >0)\"\r\n        class=\"marcas\">\r\n        <div *ecProductStock=\"product\" [ecProductMini]=\"product.special_mark\"></div>\r\n        <ng-container *ngIf=\"shouldShowPrice\">\r\n            <div *ecProductStock=\"product\" [ngClass]=\"{'tag-dsc float-right': product.saleprice}\"\r\n                [ecProductOff]=\"product\">\r\n            </div>\r\n        </ng-container>\r\n    </div> -->\r\n\r\n    <!-- Imagen del producto -->\r\n    <div class=\"foto\">\r\n        @if(product.picturesdefault){\r\n        @if (product.picturesdefault && product.picturesdefault.length > 1 ) {\r\n        <img [src]=\"mediaUrl + product.picturesdefault[0]\" alt=\"Imagen principal\" class=\"w-100 pic01\" />\r\n        <img [src]=\"mediaUrl + product.picturesdefault[1]\" alt=\"Imagen secundaria\" class=\"w-100 pic02\" />\r\n        } @else {\r\n        <img [src]=\"mediaUrl + product.picturesdefault[0]\" alt=\"Imagen principal\" class=\"w-100 pic01\" />\r\n        }\r\n        }\r\n    </div>\r\n    <!-- Precio -->\r\n    \r\n\r\n    <!-- Nombre del producto -->\r\n    <h6 class=\"title\">{{ product.name | titlecase }}</h6>\r\n\r\n    <div class=\"sku\" [innerHTML]=\"product.shortdetails\"></div>\r\n    \r\n    @if (shouldShowPrice) {\r\n    <app-price-ec [price]=\"product.price\" [saleprice]=\"product.saleprice\" class=\"\" />\r\n    }@else {\r\n    <p class=\"noPrice\"></p>\r\n    }\r\n\r\n    <div class=\"fixBottom\">\r\n\r\n        <!-- Bot\u00F3n de acciones -->\r\n         <!-- <ng-container *ecProductStock=\"product; else noStock\"> -->\r\n        <!-- Cuando no tiene marca especial o es de tipo 'standard' -->\r\n        @if (!product.special_mark || product.special_mark.length === 0 || product.special_mark[0]?.type ===\r\n        'standard') {\r\n        <button class=\"btn\" [ngClass]=\"isCollection ? 'px-2 w-100 d-sm-block' : 'py-2 px-4'\">\r\n            <ng-container *ngIf=\"isCollection; else normalText\">\r\n                <span> {{(\"buy\" | translate) | uppercase}} </span>\r\n            </ng-container>\r\n            <ng-template #normalText>\r\n                {{(\"buy\" | translate) | uppercase}}\r\n            </ng-template>\r\n        </button>\r\n        }\r\n        <!-- Cuando tiene marca especial y el tipo no es 'standard' -->\r\n        @if(product.special_mark?.[0]?.type !== 'standard'){\r\n        @for (item of product.special_mark; track $index) {\r\n        <!-- Caso 1: Agotado o Disponible muy pronto -->\r\n        @if (item.type === 'out_of_stock' || item.type === 'coming_soon') {\r\n        <button class=\"btn\" [ngClass]=\"isCollection ? 'px-2 w-100 d-sm-block' : 'py-2 px-4'\">\r\n            @if(isCollection){\r\n            <span>{{ item.name | uppercase }} </span>\r\n            }@else {\r\n            {{ item.name | uppercase }}\r\n            }\r\n        </button>}\r\n        <!-- Caso 2: Contacto por WhatsApp -->\r\n        @if (item.type === 'whatsapp_contact') {\r\n        <button class=\"btn\" [ngClass]=\"isCollection ? 'px-2 w-100 d-sm-block' : 'py-2 px-4'\"\r\n            (click)=\"openWhatsApp(item.whatsappContact)\">\r\n            @if(isCollection){\r\n            <span>{{ item.name | uppercase }}</span>\r\n            }@else {\r\n            {{ item.name | uppercase }}\r\n            }\r\n\r\n        </button>\r\n        }\r\n        <!-- Caso 3: Solicitar m\u00E1s informaci\u00F3n -->\r\n        @if (item.type === 'more_info') {\r\n        <button *ngIf=\"\" class=\"btn\" [ngClass]=\"isCollection ? 'px-2 w-100 d-sm-block' : 'py-2 px-4'\">\r\n            @if(isCollection){\r\n            <span>{{ item.name | uppercase }}</span>\r\n            }@else {\r\n            {{ item.name | uppercase }}\r\n            }\r\n        </button>\r\n        }\r\n\r\n        }\r\n        }\r\n\r\n        <!-- </ng-container>\r\n        <ng-template #noStock>\r\n            <button class=\"btn\" [ngClass]=\"isCollection ? 'px-2 w-100 d-sm-block' : 'py-2 px-4'\">\r\n                <ng-container *ngIf=\"isCollection; else normalText\">\r\n                    <span>{{(\"out-of-stock-short\" | translate) | uppercase}}</span>\r\n                </ng-container>\r\n                <ng-template #normalText>\r\n                    {{(\"out-of-stock-short\" | translate) | uppercase}}\r\n                </ng-template>\r\n            </button>\r\n        </ng-template> -->\r\n    </div>\r\n</a>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }, { kind: "component", type: PriceEcComponent, selector: "app-price-ec", inputs: ["price", "saleprice"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: ProductEcComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-product-ec', standalone: true, imports: [CommonModule, PriceEcComponent, RouterLink], template: "@if(isProductBox){\r\n    <div class=\"position-relative h-100\">\r\n        <div class=\"marcas position-absolute w-100\">\r\n            <span>20 %OFF</span>\r\n        </div>\r\n        <div>\r\n            @if(product.picturesdefault){\r\n                <img [src]=\"mediaUrl+product.picturesdefault[0]\" class=\"img-fluid mx-auto\" />\r\n            }\r\n        </div>\r\n        <div class=\"d-flex flex-column justify-center align-items-center\">\r\n            <h6 class=\"productName text-center\">{{product.name}}aa</h6> \r\n            <p class=\"productID\">{{product.id}}</p>\r\n            @if(product.shortdetails){\r\n                <div class=\"shortdetails\" [innerHTML]=\"product.shortdetails\"></div>\r\n            }\r\n            @if(product.currentOption && product.currentOption.name){\r\n                <p class=\"currentOption\" >{{product.currentOption.name}}</p>\r\n            }\r\n        </div>\r\n        <div class=\"d-flex flex-column justify-center alig-items-center\">\r\n            @if(true){\r\n                <!--Servicio de auth para controlar si esta logueado o no-->\r\n                <app-price-ec [price]=\"product.price\" [saleprice]=\"product.saleprice\" class=\"\" />\r\n            }\r\n            <button class=\"btn btn-primary\" routerLink=\"{{'/product/' + product.id}}\">Ver Producto</button>\r\n        </div>\r\n    </div>\r\n} @else {\r\n    \r\n}\r\n" }]
+            args: [{ selector: 'app-product-ec', standalone: true, imports: [CommonModule, PriceEcComponent, RouterLink, TranslateModule], template: "<a [routerLink]=\"['/product', product.id]\" class=\"text-decoration-none\">\r\n    <!-- Marca especial y descuento -->\r\n    <!-- <div *ngIf=\"product.saleprice || (product.special_mark && product.special_mark !== null && product.special_mark !== undefined && product.special_mark.length >0)\"\r\n        class=\"marcas\">\r\n        <div *ecProductStock=\"product\" [ecProductMini]=\"product.special_mark\"></div>\r\n        <ng-container *ngIf=\"shouldShowPrice\">\r\n            <div *ecProductStock=\"product\" [ngClass]=\"{'tag-dsc float-right': product.saleprice}\"\r\n                [ecProductOff]=\"product\">\r\n            </div>\r\n        </ng-container>\r\n    </div> -->\r\n\r\n    <!-- Imagen del producto -->\r\n    <div class=\"foto\">\r\n        @if(product.picturesdefault){\r\n        @if (product.picturesdefault && product.picturesdefault.length > 1 ) {\r\n        <img [src]=\"mediaUrl + product.picturesdefault[0]\" alt=\"Imagen principal\" class=\"w-100 pic01\" />\r\n        <img [src]=\"mediaUrl + product.picturesdefault[1]\" alt=\"Imagen secundaria\" class=\"w-100 pic02\" />\r\n        } @else {\r\n        <img [src]=\"mediaUrl + product.picturesdefault[0]\" alt=\"Imagen principal\" class=\"w-100 pic01\" />\r\n        }\r\n        }\r\n    </div>\r\n    <!-- Precio -->\r\n    \r\n\r\n    <!-- Nombre del producto -->\r\n    <h6 class=\"title\">{{ product.name | titlecase }}</h6>\r\n\r\n    <div class=\"sku\" [innerHTML]=\"product.shortdetails\"></div>\r\n    \r\n    @if (shouldShowPrice) {\r\n    <app-price-ec [price]=\"product.price\" [saleprice]=\"product.saleprice\" class=\"\" />\r\n    }@else {\r\n    <p class=\"noPrice\"></p>\r\n    }\r\n\r\n    <div class=\"fixBottom\">\r\n\r\n        <!-- Bot\u00F3n de acciones -->\r\n         <!-- <ng-container *ecProductStock=\"product; else noStock\"> -->\r\n        <!-- Cuando no tiene marca especial o es de tipo 'standard' -->\r\n        @if (!product.special_mark || product.special_mark.length === 0 || product.special_mark[0]?.type ===\r\n        'standard') {\r\n        <button class=\"btn\" [ngClass]=\"isCollection ? 'px-2 w-100 d-sm-block' : 'py-2 px-4'\">\r\n            <ng-container *ngIf=\"isCollection; else normalText\">\r\n                <span> {{(\"buy\" | translate) | uppercase}} </span>\r\n            </ng-container>\r\n            <ng-template #normalText>\r\n                {{(\"buy\" | translate) | uppercase}}\r\n            </ng-template>\r\n        </button>\r\n        }\r\n        <!-- Cuando tiene marca especial y el tipo no es 'standard' -->\r\n        @if(product.special_mark?.[0]?.type !== 'standard'){\r\n        @for (item of product.special_mark; track $index) {\r\n        <!-- Caso 1: Agotado o Disponible muy pronto -->\r\n        @if (item.type === 'out_of_stock' || item.type === 'coming_soon') {\r\n        <button class=\"btn\" [ngClass]=\"isCollection ? 'px-2 w-100 d-sm-block' : 'py-2 px-4'\">\r\n            @if(isCollection){\r\n            <span>{{ item.name | uppercase }} </span>\r\n            }@else {\r\n            {{ item.name | uppercase }}\r\n            }\r\n        </button>}\r\n        <!-- Caso 2: Contacto por WhatsApp -->\r\n        @if (item.type === 'whatsapp_contact') {\r\n        <button class=\"btn\" [ngClass]=\"isCollection ? 'px-2 w-100 d-sm-block' : 'py-2 px-4'\"\r\n            (click)=\"openWhatsApp(item.whatsappContact)\">\r\n            @if(isCollection){\r\n            <span>{{ item.name | uppercase }}</span>\r\n            }@else {\r\n            {{ item.name | uppercase }}\r\n            }\r\n\r\n        </button>\r\n        }\r\n        <!-- Caso 3: Solicitar m\u00E1s informaci\u00F3n -->\r\n        @if (item.type === 'more_info') {\r\n        <button *ngIf=\"\" class=\"btn\" [ngClass]=\"isCollection ? 'px-2 w-100 d-sm-block' : 'py-2 px-4'\">\r\n            @if(isCollection){\r\n            <span>{{ item.name | uppercase }}</span>\r\n            }@else {\r\n            {{ item.name | uppercase }}\r\n            }\r\n        </button>\r\n        }\r\n\r\n        }\r\n        }\r\n\r\n        <!-- </ng-container>\r\n        <ng-template #noStock>\r\n            <button class=\"btn\" [ngClass]=\"isCollection ? 'px-2 w-100 d-sm-block' : 'py-2 px-4'\">\r\n                <ng-container *ngIf=\"isCollection; else normalText\">\r\n                    <span>{{(\"out-of-stock-short\" | translate) | uppercase}}</span>\r\n                </ng-container>\r\n                <ng-template #normalText>\r\n                    {{(\"out-of-stock-short\" | translate) | uppercase}}\r\n                </ng-template>\r\n            </button>\r\n        </ng-template> -->\r\n    </div>\r\n</a>" }]
         }], propDecorators: { product: [{
                 type: Input,
                 args: [{
@@ -5900,6 +6048,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                 type: Input
             }], loaded: [{
                 type: Output
+            }], isCollection: [{
+                type: Input
             }] } });
 
 register();
@@ -5983,7 +6133,7 @@ class BlockProductsEcComponent extends BlockEcComponent {
         this.analyticsService.callEvent('select_promotion', item);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: BlockProductsEcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: BlockProductsEcComponent, isStandalone: true, selector: "app-block-products-ec", inputs: { appProduct: "appProduct", products: "products", meta: "meta" }, usesInheritance: true, ngImport: i0, template: "<section [ngClass]=\"trimClassBlock(meta.code) + ' container-fluid'\">\r\n\r\n    <div class=\"blockProduct block-product\">\r\n        @if(meta.name){\r\n            <div class=\"row\">\r\n                <div class=\"col-12 mt-4\">\r\n                    <h2  class=\"font-weight-normal font-gd\">\r\n                        <span>{{meta.name}}</span>\r\n                    </h2>\r\n                </div>\r\n            </div>\r\n        }\r\n\r\n\r\n            @if(meta.styles && meta.styles.carrousel == false){\r\n                <div class=\"row \">\r\n                    @for (product of products; track $index) {\r\n                        <div [class]=\"'item '+ ' col-'+ (meta.styles.items?.sm) + ' col-md-' + (meta.styles.items?.md)  + ' col-lg-' + (meta.styles.items?.lg)  + ' px-2'\" [id]=\"$index\">\r\n                            <!-- verifica que si vienen un template para un custom appProduct llamado \"appProduct\" con un objeto \"product\"- sino usa por defecto el del core -->\r\n                            <ng-container *ngTemplateOutlet=\"appProduct ? appProduct : defaultAppProduct; context: {product:product}\"></ng-container> \r\n                        </div>\r\n                    }\r\n                </div>\r\n            } @else {\r\n                <swiper-container init=\"false\" [id]=\"meta?.code\">\r\n                    @for (product of products; track $index) {\r\n                        <swiper-slide>\r\n                            <ng-container *ngTemplateOutlet=\"appProduct ? appProduct : defaultAppProduct; context: {product:product}\"></ng-container> \r\n                        </swiper-slide>\r\n                    }\r\n                </swiper-container>\r\n            }\r\n    </div>\r\n</section>\r\n\r\n\r\n<!-- componente por defecto (tomara como producto el contexto pasado como \"product\") -->\r\n<ng-template #defaultAppProduct let-product=\"product\" > \r\n    <app-product-ec [product]=\"product\"></app-product-ec>\r\n</ng-template>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ProductEcComponent, selector: "app-product-ec", inputs: ["product", "isProductBox"], outputs: ["loaded"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: BlockProductsEcComponent, isStandalone: true, selector: "app-block-products-ec", inputs: { appProduct: "appProduct", products: "products", meta: "meta" }, usesInheritance: true, ngImport: i0, template: "<section [ngClass]=\"trimClassBlock(meta.code) + ' container-fluid'\">\r\n\r\n    <div class=\"blockProduct block-product\">\r\n        @if(meta.name){\r\n            <div class=\"row\">\r\n                <div class=\"col-12 mt-4\">\r\n                    <h2  class=\"font-weight-normal font-gd\">\r\n                        <span>{{meta.name}}</span>\r\n                    </h2>\r\n                </div>\r\n            </div>\r\n        }\r\n\r\n\r\n            @if(meta.styles && meta.styles.carrousel == false){\r\n                <div class=\"row \">\r\n                    @for (product of products; track $index) {\r\n                        <div [class]=\"'item '+ ' col-'+ (meta.styles.items?.sm) + ' col-md-' + (meta.styles.items?.md)  + ' col-lg-' + (meta.styles.items?.lg)  + ' px-2'\" [id]=\"$index\">\r\n                            <!-- verifica que si vienen un template para un custom appProduct llamado \"appProduct\" con un objeto \"product\"- sino usa por defecto el del core -->\r\n                            <ng-container *ngTemplateOutlet=\"appProduct ? appProduct : defaultAppProduct; context: {product:product}\"></ng-container> \r\n                        </div>\r\n                    }\r\n                </div>\r\n            } @else {\r\n                <swiper-container init=\"false\" [id]=\"meta?.code\">\r\n                    @for (product of products; track $index) {\r\n                        <swiper-slide>\r\n                            <ng-container *ngTemplateOutlet=\"appProduct ? appProduct : defaultAppProduct; context: {product:product}\"></ng-container> \r\n                        </swiper-slide>\r\n                    }\r\n                </swiper-container>\r\n            }\r\n    </div>\r\n</section>\r\n\r\n\r\n<!-- componente por defecto (tomara como producto el contexto pasado como \"product\") -->\r\n<ng-template #defaultAppProduct let-product=\"product\" > \r\n    <app-product-ec [product]=\"product\"></app-product-ec>\r\n</ng-template>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ProductEcComponent, selector: "app-product-ec", inputs: ["product", "isProductBox", "isCollection"], outputs: ["loaded"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: BlockProductsEcComponent, decorators: [{
             type: Component,
@@ -6351,6 +6501,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                 args: ['mainCanvas', { static: true }]
             }] } });
 
+// export * from './rating-ec/rating-ec.component';
+
 class BlockFormContactEcComponent extends BlockEcComponent {
     block;
     success_message;
@@ -7015,9 +7167,13 @@ class FiltersEcComponent {
     _filtersService = inject(FiltersService);
     filters = [];
     filter$ = this._filtersService.filters$;
+    setSelect;
+    rangeMinRef;
+    rangeMaxRef;
+    priceGapPercentage = 0.1;
     constructor() {
         this.filter$.subscribe(res => {
-            this.filters = this._filtersService.getSpecificFilters(['attributes', 'categories', 'dynamics']);
+            this.filters = this._filtersService.getSpecificFilters(['attributes', 'categories', 'price_range', 'dynamics']);
         });
     }
     getSpecificFilter(type) {
@@ -7038,13 +7194,114 @@ class FiltersEcComponent {
         console.log("set", filter);
         filter && this._filtersService.setFilterSelected(filter, selected);
     }
+    /**
+    * Redondea al múltiplo de 'step' respetando el redondeo entero:
+    * - Mínimo: redondea hacia abajo.
+    * - Máximo: redondea hacia arriba.
+    */
+    onRangeChange(event, type, filter) {
+        const input = event.target;
+        let value = parseInt(input.value, 10);
+        value = this.roundToNearest(value, 5, type, filter);
+        this.updateFilterPrices(type, value, filter, this.priceGapPercentage);
+    }
+    roundToNearest(value, step, type, filter) {
+        let rounded = Math.round(value / step) * step;
+        if (type === 'max' && rounded < filter.maxPrice) {
+            rounded = Math.ceil(value / step) * step;
+        }
+        if (type === 'min' && rounded > filter.minPrice) {
+            rounded = Math.floor(value / step) * step;
+        }
+        return rounded;
+    }
+    uniqueSelection(filter, filterChild) {
+        // Buscar si hay un filtro de tipo PriceRangeFilter en la lista de filtros
+        const priceRangeFilter = this.filters.find(f => f instanceof PriceRangeFilter);
+        if (priceRangeFilter) {
+            priceRangeFilter.reset();
+        }
+        filter.data.forEach(filterElement => {
+            if (filterElement.selected) {
+                filterElement.selected = false;
+            }
+            filterElement.children.forEach((filterChildren) => {
+                if (filterChildren != filterChild && filterChildren.selected) {
+                    filterChildren.selected = false;
+                }
+            });
+        });
+    }
+    /**
+   * Actualiza los valores del filtro permitiendo que un input empuje al otro.
+  */
+    updateFilterPrices(type, value, filter, priceGap) {
+        const globalMin = filter.minPrice ?? 0;
+        const globalMax = filter.maxPrice;
+        let currentMin = filter.currentMinPrice ?? globalMin;
+        let currentMax = filter.currentMaxPrice ?? globalMax;
+        if (type === 'min') {
+            let newMin = Math.min(Math.max(value, globalMin), globalMax);
+            if (newMin + priceGap > currentMax) {
+                let newMaxCandidate = newMin + priceGap;
+                if (newMaxCandidate <= globalMax) {
+                    currentMax = newMaxCandidate;
+                }
+                else {
+                    newMin = globalMax - priceGap;
+                }
+            }
+            filter.currentMinPrice = newMin;
+            filter.currentMaxPrice = currentMax;
+        }
+        else if (type === 'max') {
+            let newMax = Math.max(Math.min(value, globalMax), globalMin);
+            if (newMax - priceGap < currentMin) {
+                let newMinCandidate = newMax - priceGap;
+                if (newMinCandidate >= globalMin) {
+                    currentMin = newMinCandidate;
+                }
+                else {
+                    newMax = globalMin + priceGap;
+                }
+            }
+            filter.currentMaxPrice = newMax;
+            filter.currentMinPrice = currentMin;
+        }
+    }
+    // Método para actualizar los valores de precio seleccionados
+    updatePriceRange(min, max, priceFilter) {
+        priceFilter.setSelected(min, max);
+        this.setSelect(priceFilter);
+    }
+    // Métodos para actualizar la barra del filtro por precio
+    calculateLeftPercentage(currentMinPrice, minPrice, maxPrice) {
+        const minVal = Math.max(minPrice, Math.min(currentMinPrice ?? minPrice, maxPrice));
+        return Math.max(0, Math.min(((minVal - minPrice) / (maxPrice - minPrice)) * 100, 100));
+    }
+    calculateRightPercentage(currentMaxPrice, minPrice, maxPrice) {
+        const maxVal = Math.max(minPrice, Math.min(currentMaxPrice ?? maxPrice, maxPrice));
+        return Math.max(0, Math.min(100 - ((maxVal - minPrice) / (maxPrice - minPrice)) * 100, 100));
+    }
+    scrollUp = () => {
+        window.scroll(0, 0);
+        return true;
+    };
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: FiltersEcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: FiltersEcComponent, isStandalone: true, selector: "lib-filters-ec", ngImport: i0, template: "<p>filters-ec works!</p>\r\n", styles: [""] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: FiltersEcComponent, isStandalone: true, selector: "lib-filters-ec", inputs: { setSelect: "setSelect" }, viewQueries: [{ propertyName: "rangeMinRef", first: true, predicate: ["rangeMin"], descendants: true }, { propertyName: "rangeMaxRef", first: true, predicate: ["rangeMax"], descendants: true }], ngImport: i0, template: "<p>filters-ec works!</p>\r\n", styles: [""] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: FiltersEcComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-filters-ec', standalone: true, imports: [], template: "<p>filters-ec works!</p>\r\n" }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { setSelect: [{
+                type: Input
+            }], rangeMinRef: [{
+                type: ViewChild,
+                args: ['rangeMin']
+            }], rangeMaxRef: [{
+                type: ViewChild,
+                args: ['rangeMax']
+            }] } });
 
 class ProductDetailEcComponent {
     _productDetailService = inject(ProductDetailService);
@@ -7053,6 +7310,8 @@ class ProductDetailEcComponent {
     _domSanitizer = inject(DomSanitizer);
     _consts = inject(CoreConstantsService);
     _toastService = inject(ToastService);
+    parametersService = inject(ParametersService);
+    injector = inject(Injector);
     _meta = inject(Meta);
     _title = inject(Title);
     _location = inject(Location);
@@ -7061,12 +7320,25 @@ class ProductDetailEcComponent {
     data$ = this._productDetailService.associatedData$;
     mediaUrl = this._consts.mediaUrl();
     code = '';
+    showFormContact = false;
+    showReviews = false;
+    reset = false;
+    success = false;
     quantity = signal(1);
+    parameters$ = this.parametersService.getParameters();
+    hasParams = this.parametersService.hasParams;
     constructor() {
         this._activedRoute.params.subscribe(queryParams => {
             this.code = queryParams["id"];
             this._productDetailService.loadProduct(this.code);
         });
+        this._activedRoute.params.subscribe(queryParams => {
+            this.code = queryParams["id"];
+            this._productDetailService.loadProduct(this.code);
+        });
+        this.injector.get(ChannelService).channel$.subscribe(channel => {
+            this.showReviews = channel.showReviews;
+        });
     }
     ngOnInit() {
         this.product$.subscribe(product => {
@@ -7115,6 +7387,19 @@ class ProductDetailEcComponent {
         if (this.quantity() >= stock)
             this.quantity.set(stock);
     }
+    goToSection(section) {
+        this.showFormContact = true;
+        setTimeout(() => {
+            const element = document.getElementById(section);
+            if (element) {
+                element.scrollIntoView({ behavior: 'smooth' });
+            }
+        }, 500);
+    }
+    resetForm = () => {
+        this.reset = !this.reset;
+        this.success = true;
+    };
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: ProductDetailEcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: ProductDetailEcComponent, isStandalone: true, selector: "app-product-detail-ec", ngImport: i0, template: "", styles: [""] });
 }
@@ -7130,11 +7415,11 @@ class VariantsEcComponent {
         this._productDetailsService.setOption(optionCode, optionValue);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: VariantsEcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: VariantsEcComponent, isStandalone: true, selector: "app-variants-ec", ngImport: i0, template: "@if(options$ | async; as options){\r\n    @if(options && options.length){\r\n        @for(option of options; track $index){\r\n            @switch (option.type) {\r\n                @case ('color') {\r\n                <h5>Colores disponibles</h5>\r\n                <div class=\"row w-100 mx-auto pb-3 mb-3\">\r\n                    @for(value of option.values; track $index; let x = $index){\r\n                    <a role=\"button\" [title]=\"value.description\" (click)=\"setOption(option.code, value.name)\"\r\n                        [class]=\"'item m-1 circle ' + (value.selected ? 'shadow' : '')\" [id]=\"x + value.name\"\r\n                        [style.background]=\"'#' + value.name\" [style.box-shadow]=\"(value.selected ? '0px 0px 0px 2px #000' : 'none')\">\r\n                    </a>\r\n                    }\r\n                </div>\r\n                }\r\n                @case ('size') {\r\n\r\n                }\r\n                @default {\r\n\r\n                }\r\n            }\r\n        }\r\n    } @else {\r\n    <p>loading</p>\r\n    }\r\n}\r\n\r\n<!-- <div *ngIf=\"(options$ | async) as options\">\r\n    <div *ngIf=\"options && options.length; else loading\">\r\n         <div *ngFor=\"let option of options; let i = index\">\r\n\r\n              <div [ngSwitch]=\"option.type\">\r\n                   <div *ngSwitchCase=\"'color'\">\r\n                        <h5>Colores disponibles</h5>\r\n                        <div class=\"row w-100 mx-auto pb-3 mb-3\">\r\n                            <a *ngFor=\"let value of option.values; let x = index\" role=\"button\"\r\n                                (click)=\"setOption(option.code, value.name)\" [class]=\"'item m-1 ' + (value.selected ? 'shadow' : '')\"\r\n                                [id]=\"x + value.name\"\r\n                                [style.background]=\"'#' + value.name\"\r\n                                [style.box-shadow]=\"(value.selected ? '0px 0px 0px 2px #000' : 'none')\">\r\n                            </a>\r\n                        </div>\r\n                   </div>\r\n                   <div *ngSwitchCase=\"'size'\">\r\n                        <h5>Talles displonibles</h5>\r\n                        <div class=\"row w-100 mx-auto pb-3\">\r\n                             <a *ngFor=\"let value of option.values; let x = index\" role=\"buttom\"\r\n                                  (click)=\"setOption(option.code, value.name)\"\r\n                                  [id]=\"x + value.name\"\r\n                                  [class]=\"'btn item m-1 ' + (value.selected ? 'selected-size' : 'unselected-size')\">\r\n                                  {{ value.name }}\r\n                             </a>\r\n                        </div>\r\n                   </div>\r\n              </div>\r\n         </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #loading>\r\n    <div class=\"loading-container\">\r\n         <div id=\"loading\"></div>\r\n    </div>\r\n</ng-template> -->", styles: [".circle{width:32px;height:32px;border-radius:50%}.shadow{border:1px solid #000}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: VariantsEcComponent, isStandalone: true, selector: "app-variants-ec", ngImport: i0, template: "@if(options$ | async; as options){\r\n@if(options && options.length){\r\n@for(option of options; track $index){\r\n@switch (option.type) {\r\n@case ('color') {\r\n<h5>Colores disponibles</h5>\r\n<div class=\"row w-100 mx-auto pb-3 mb-3\">\r\n    @for(value of option.values; track $index; let x = $index){\r\n    <a role=\"button\" [title]=\"value.description\" (click)=\"setOption(option.code, value.name)\"\r\n        [class]=\"'item m-1 circle ' + (value.selected ? 'shadow' : '')\" [id]=\"x + value.name\"\r\n        [style.background]=\"'#' + value.name\" [style.box-shadow]=\"(value.selected ? '0px 0px 0px 2px #000' : 'none')\">\r\n    </a>\r\n    }\r\n</div>\r\n}\r\n@case ('size') {\r\n<h5>Talles displonibles</h5>\r\n<div class=\"row w-100 mx-auto pb-3\">\r\n    @for(value of option.values; track $index; let x = $index){\r\n    <a role=\"buttom\" (click)=\"setOption(option.code, value.name)\" [id]=\"x + value.name\"\r\n        [class]=\"'btn item m-1 ' + (value.selected ? 'selected-size' : 'unselected-size')\">\r\n        {{ value.name }}\r\n    </a>\r\n    }\r\n\r\n</div>\r\n}\r\n@default {\r\n\r\n}\r\n}\r\n}\r\n}\r\n}\r\n", styles: [".circle{width:32px;height:32px;border-radius:50%}.shadow{border:1px solid #000}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: VariantsEcComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-variants-ec', standalone: true, imports: [AsyncPipe], template: "@if(options$ | async; as options){\r\n    @if(options && options.length){\r\n        @for(option of options; track $index){\r\n            @switch (option.type) {\r\n                @case ('color') {\r\n                <h5>Colores disponibles</h5>\r\n                <div class=\"row w-100 mx-auto pb-3 mb-3\">\r\n                    @for(value of option.values; track $index; let x = $index){\r\n                    <a role=\"button\" [title]=\"value.description\" (click)=\"setOption(option.code, value.name)\"\r\n                        [class]=\"'item m-1 circle ' + (value.selected ? 'shadow' : '')\" [id]=\"x + value.name\"\r\n                        [style.background]=\"'#' + value.name\" [style.box-shadow]=\"(value.selected ? '0px 0px 0px 2px #000' : 'none')\">\r\n                    </a>\r\n                    }\r\n                </div>\r\n                }\r\n                @case ('size') {\r\n\r\n                }\r\n                @default {\r\n\r\n                }\r\n            }\r\n        }\r\n    } @else {\r\n    <p>loading</p>\r\n    }\r\n}\r\n\r\n<!-- <div *ngIf=\"(options$ | async) as options\">\r\n    <div *ngIf=\"options && options.length; else loading\">\r\n         <div *ngFor=\"let option of options; let i = index\">\r\n\r\n              <div [ngSwitch]=\"option.type\">\r\n                   <div *ngSwitchCase=\"'color'\">\r\n                        <h5>Colores disponibles</h5>\r\n                        <div class=\"row w-100 mx-auto pb-3 mb-3\">\r\n                            <a *ngFor=\"let value of option.values; let x = index\" role=\"button\"\r\n                                (click)=\"setOption(option.code, value.name)\" [class]=\"'item m-1 ' + (value.selected ? 'shadow' : '')\"\r\n                                [id]=\"x + value.name\"\r\n                                [style.background]=\"'#' + value.name\"\r\n                                [style.box-shadow]=\"(value.selected ? '0px 0px 0px 2px #000' : 'none')\">\r\n                            </a>\r\n                        </div>\r\n                   </div>\r\n                   <div *ngSwitchCase=\"'size'\">\r\n                        <h5>Talles displonibles</h5>\r\n                        <div class=\"row w-100 mx-auto pb-3\">\r\n                             <a *ngFor=\"let value of option.values; let x = index\" role=\"buttom\"\r\n                                  (click)=\"setOption(option.code, value.name)\"\r\n                                  [id]=\"x + value.name\"\r\n                                  [class]=\"'btn item m-1 ' + (value.selected ? 'selected-size' : 'unselected-size')\">\r\n                                  {{ value.name }}\r\n                             </a>\r\n                        </div>\r\n                   </div>\r\n              </div>\r\n         </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #loading>\r\n    <div class=\"loading-container\">\r\n         <div id=\"loading\"></div>\r\n    </div>\r\n</ng-template> -->", styles: [".circle{width:32px;height:32px;border-radius:50%}.shadow{border:1px solid #000}\n"] }]
+            args: [{ selector: 'app-variants-ec', standalone: true, imports: [AsyncPipe], template: "@if(options$ | async; as options){\r\n@if(options && options.length){\r\n@for(option of options; track $index){\r\n@switch (option.type) {\r\n@case ('color') {\r\n<h5>Colores disponibles</h5>\r\n<div class=\"row w-100 mx-auto pb-3 mb-3\">\r\n    @for(value of option.values; track $index; let x = $index){\r\n    <a role=\"button\" [title]=\"value.description\" (click)=\"setOption(option.code, value.name)\"\r\n        [class]=\"'item m-1 circle ' + (value.selected ? 'shadow' : '')\" [id]=\"x + value.name\"\r\n        [style.background]=\"'#' + value.name\" [style.box-shadow]=\"(value.selected ? '0px 0px 0px 2px #000' : 'none')\">\r\n    </a>\r\n    }\r\n</div>\r\n}\r\n@case ('size') {\r\n<h5>Talles displonibles</h5>\r\n<div class=\"row w-100 mx-auto pb-3\">\r\n    @for(value of option.values; track $index; let x = $index){\r\n    <a role=\"buttom\" (click)=\"setOption(option.code, value.name)\" [id]=\"x + value.name\"\r\n        [class]=\"'btn item m-1 ' + (value.selected ? 'selected-size' : 'unselected-size')\">\r\n        {{ value.name }}\r\n    </a>\r\n    }\r\n\r\n</div>\r\n}\r\n@default {\r\n\r\n}\r\n}\r\n}\r\n}\r\n}\r\n", styles: [".circle{width:32px;height:32px;border-radius:50%}.shadow{border:1px solid #000}\n"] }]
         }] });
 
 class BreadcrumbEcComponent {
@@ -7164,6 +7449,8 @@ class CartEcComponent {
     totalPromotionAmount$ = this._cartService.getTotalPromotionAmount();
     taxesAmount$ = this._cartService.getTaxesAmount();
     totalAmount$ = this._cartService.getTotalAmount();
+    _authService = inject(AuthService);
+    isAuthenticated$ = this._authService.isAuthenticated();
     removeCoupon() {
         this._cartService.removeCoupon();
     }
@@ -7177,13 +7464,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
 
 class CartItemEcComponent {
     item;
+    inSidebar = false;
     _cartService = inject(CartService);
     _toastService = inject(ToastService);
     _constants = inject(CoreConstantsService);
     mediaUrl = this._constants.mediaUrl();
     quantity = 0;
+    variantsToShow = ['TALLE', 'COLOR'];
+    updateStock = false;
     ngOnInit() {
         this.quantity = this.item.quantity;
+        console.log(this.item, this.mediaUrl);
     }
     updateQuantity(stock) {
         if (this.quantity > 0 && this.quantity <= stock) {
@@ -7205,17 +7496,82 @@ class CartItemEcComponent {
     deleteCartItem() {
         this._cartService.deleteCartItem(this.item);
     }
+    getVariants(product) {
+        let item = product.product;
+        if (item.variants && item.variants.length && item.variants[0].options && item.variants[0].options.length) {
+            let options = item.variants[0].options;
+            options = options.filter((option) => this.variantsToShow.find((name) => option.hasOwnProperty(name)));
+            let optionsMap = [];
+            options.map((option) => {
+                Object.keys(option).forEach((entry) => {
+                    let optionAdded = false; // Variable para evitar múltiples inserciones
+                    item.options.forEach((option2) => {
+                        if (option2.code == 'COLOR') {
+                            option2.values.forEach((color) => {
+                                if (color.code == option[entry] && !optionAdded) {
+                                    optionsMap.push({ name: entry, value: option[entry], image: color.image, mobileImage: color.mobileImage });
+                                    optionAdded = true; // Marcar opción agregada
+                                }
+                            });
+                        }
+                    });
+                    // Si no se añadió la opción de COLOR, manejar otras opciones
+                    if (!optionAdded) {
+                        item.options.forEach((option2) => {
+                            if (option2.code !== 'COLOR') {
+                                optionsMap.push({
+                                    name: entry,
+                                    value: option[entry]
+                                });
+                                optionAdded = true;
+                            }
+                        });
+                    }
+                });
+                return optionsMap;
+            });
+            return optionsMap;
+        }
+        else {
+            return null;
+        }
+    }
+    createDiscountMessage(saleprice, price) {
+        if (isNaN(saleprice) || isNaN(price) || saleprice >= price || saleprice <= 0 || price <= 0) {
+            return '';
+        }
+        let discountPercentage = Math.round(((price - saleprice) / price) * 100);
+        let discountMessage = `${discountPercentage}% OFF`;
+        return discountMessage;
+    }
+    checkStock(product) {
+        for (const variant of product.product.variants) {
+            if (product.variant_id === variant.code) {
+                if (variant.stock === 0) {
+                    this.updateStock = true;
+                    return '0';
+                }
+                else if (product.quantity > variant.stock) {
+                    this.updateStock = true;
+                    return variant.stock;
+                }
+            }
+        }
+        return false; // Solo se ejecuta si no se cumple la condición
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: CartItemEcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: CartItemEcComponent, isStandalone: true, selector: "lib-cart-item-ec", inputs: { item: "item" }, ngImport: i0, template: "<p>cart-item-ec works!</p>\r\n", styles: [""] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: CartItemEcComponent, isStandalone: true, selector: "app-cart-item-ec", inputs: { item: "item", inSidebar: "inSidebar" }, ngImport: i0, template: "@if(!inSidebar){\r\n<p>cart-item-ec works!</p>\r\n}@else{\r\n\r\n<div class=\"row\">\r\n    <div class=\"col-2\">\r\n        @let product= item.product;\r\n        @if(item.variant_id && product.variants.length>0){\r\n            <img [src]=\"mediaUrl +  product.variants[0].images[0]\" alt=\"\" class=\"img-fluid\">\r\n        }@else{\r\n            <img [src]=\"mediaUrl +  product.picturesdefault[0]\" alt=\"\" class=\"img-fluid\">\r\n        }\r\n    </div>\r\n    <div class=\"col-8\">\r\n        <div class=\"info d-flex flex-column align-items-start\">\r\n            <a class=\"title text-dark text-decoration-none m-0 p-0 h6 mb-0\"\r\n                [routerLink]=\"['/product', item.variant_id]\">{{\r\n                item.product.name | titlecase\r\n                }}</a>\r\n            <div class=\"qty1\">\r\n                <span>{{ item.product.id}}</span>\r\n            </div>\r\n            <div class=\"price h6 fw-bold mb-0 pb-0\">{{ item.product.price | ecCurrencySymbol\r\n                }}</div>\r\n             @if(getVariants(item); as options){\r\n                <div class=\"d-flex align-items-center p-0\">\r\n                    @for(option of options; track $index){\r\n                        <span class=\"me-1\"> {{option.name | titlecase}}:</span>\r\n                        @if(option.name == 'COLOR'){\r\n                            <div class=\"p-2 rounded\" [style.background]=\"'#' + option.value\"></div>\r\n                        }@else{\r\n                            <b>{{option.value}}</b>\r\n                        }\r\n                    }\r\n                </div>\r\n            }\r\n            <div class=\"input-group mb-3\">\r\n                <button (click)=\"less(item.product.variants[0]?.stock)\" class=\"btn btn-outline-secondary\" type=\"button\" id=\"button-addon1\">\r\n                    <i class=\"fa fa-minus\" aria-hidden=\"true\"></i>\r\n                </button>\r\n                <input type=\"text\" class=\"form-control text-center\" placeholder=\"\" aria-label=\"Example text with button addon\"\r\n                    aria-describedby=\"button-addon1\" [value]=\"item.quantity\" min=\"1\" step=\"1\" [(ngModel)]=\"quantity\"\r\n                    (change)=\"updateQuantity(item.product.variants[0]?.stock)\">\r\n                <button (click)=\"plus(item.product.variants[0]?.stock)\" class=\"btn btn-outline-secondary\" type=\"button\" id=\"button-addon1\">\r\n                    <i class=\"fa fa-plus\" aria-hidden=\"true\"></i>\r\n                </button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"col-2\">\r\n        <a (click)=\"deleteCartItem()\" class=\"btn botBorrar\"><i class=\"fa fa-trash\" aria-hidden=\"true\"></i></a>\r\n    </div>\r\n</div>\r\n\r\n\r\n\r\n\r\n\r\n}", styles: [""], dependencies: [{ kind: "pipe", type: TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: EcCurrencySymbolPipe, name: "ecCurrencySymbol" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: CartItemEcComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-cart-item-ec', standalone: true, imports: [], template: "<p>cart-item-ec works!</p>\r\n" }]
+            args: [{ selector: 'app-cart-item-ec', standalone: true, imports: [TitleCasePipe, EcCurrencySymbolPipe, RouterLink, FormsModule], template: "@if(!inSidebar){\r\n<p>cart-item-ec works!</p>\r\n}@else{\r\n\r\n<div class=\"row\">\r\n    <div class=\"col-2\">\r\n        @let product= item.product;\r\n        @if(item.variant_id && product.variants.length>0){\r\n            <img [src]=\"mediaUrl +  product.variants[0].images[0]\" alt=\"\" class=\"img-fluid\">\r\n        }@else{\r\n            <img [src]=\"mediaUrl +  product.picturesdefault[0]\" alt=\"\" class=\"img-fluid\">\r\n        }\r\n    </div>\r\n    <div class=\"col-8\">\r\n        <div class=\"info d-flex flex-column align-items-start\">\r\n            <a class=\"title text-dark text-decoration-none m-0 p-0 h6 mb-0\"\r\n                [routerLink]=\"['/product', item.variant_id]\">{{\r\n                item.product.name | titlecase\r\n                }}</a>\r\n            <div class=\"qty1\">\r\n                <span>{{ item.product.id}}</span>\r\n            </div>\r\n            <div class=\"price h6 fw-bold mb-0 pb-0\">{{ item.product.price | ecCurrencySymbol\r\n                }}</div>\r\n             @if(getVariants(item); as options){\r\n                <div class=\"d-flex align-items-center p-0\">\r\n                    @for(option of options; track $index){\r\n                        <span class=\"me-1\"> {{option.name | titlecase}}:</span>\r\n                        @if(option.name == 'COLOR'){\r\n                            <div class=\"p-2 rounded\" [style.background]=\"'#' + option.value\"></div>\r\n                        }@else{\r\n                            <b>{{option.value}}</b>\r\n                        }\r\n                    }\r\n                </div>\r\n            }\r\n            <div class=\"input-group mb-3\">\r\n                <button (click)=\"less(item.product.variants[0]?.stock)\" class=\"btn btn-outline-secondary\" type=\"button\" id=\"button-addon1\">\r\n                    <i class=\"fa fa-minus\" aria-hidden=\"true\"></i>\r\n                </button>\r\n                <input type=\"text\" class=\"form-control text-center\" placeholder=\"\" aria-label=\"Example text with button addon\"\r\n                    aria-describedby=\"button-addon1\" [value]=\"item.quantity\" min=\"1\" step=\"1\" [(ngModel)]=\"quantity\"\r\n                    (change)=\"updateQuantity(item.product.variants[0]?.stock)\">\r\n                <button (click)=\"plus(item.product.variants[0]?.stock)\" class=\"btn btn-outline-secondary\" type=\"button\" id=\"button-addon1\">\r\n                    <i class=\"fa fa-plus\" aria-hidden=\"true\"></i>\r\n                </button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"col-2\">\r\n        <a (click)=\"deleteCartItem()\" class=\"btn botBorrar\"><i class=\"fa fa-trash\" aria-hidden=\"true\"></i></a>\r\n    </div>\r\n</div>\r\n\r\n\r\n\r\n\r\n\r\n}" }]
         }], propDecorators: { item: [{
                 type: Input,
                 args: [{
                         required: true
                     }]
+            }], inSidebar: [{
+                type: Input
             }] } });
 
 class CouponEcComponent {
@@ -8126,8 +8482,8 @@ class OrdersListEcComponent {
     }
     toDate(date, format) { return moment(date).format(!format && 'DD/MM/YYYY, h:mm:ss a' || format); }
     goToOrder(order) {
-        //this._ordersService.setSelectedOrder(order);
-        //this._router.navigateByUrl((`account/orders/${order.number}`))
+        this._ordersService.setSelectedOrder(order);
+        this._router.navigateByUrl((`account/orders/${order.number}`));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: OrdersListEcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: OrdersListEcComponent, isStandalone: true, selector: "app-orders-ec", ngImport: i0, template: "<div class=\"container-fluid\" id=\"ordersEcComponent\">\r\n    @if(!loading){\r\n    <section id=\"orders\" class=\"w-100\">\r\n        @if(orders && orders.length){\r\n            <div class=\"row mb-1 border-bottom\">\r\n                <div class=\"col-lg-2 col-12\">\r\n                    <p [class]=\"'st dropdown-toggle cursor-pointer my-2 '+ (currentSort.name == 'number' ? 'applied ' + (!currentSort.asc ? 'asc' : 'desc') : '')\"\r\n                        (click)=\"sortOrders('number')\">{{ 'order' | translate }}:</p>\r\n                </div>\r\n                <div class=\"col-lg-2 col-12\">\r\n                    <p [class]=\"'st dropdown-toggle cursor-pointer my-2 '+ (currentSort.name == 'paymentState' ? 'applied ' + (!currentSort.asc ? 'asc' : 'desc') : '')\"\r\n                        (click)=\"sortOrders('paymentState')\">{{ 'payment-state' | translate }}:</p>\r\n                </div>\r\n                <div class=\"col-lg-2 col-12\">\r\n                    <p [class]=\"'st dropdown-toggle cursor-pointer my-2 '+ (currentSort.name == 'method' ? 'applied ' + (!currentSort.asc ? 'asc' : 'desc') : '')\"\r\n                        (click)=\"sortOrders('method')\">{{ 'shipment-method' | translate }}:</p>\r\n                </div>\r\n                <div class=\"col-lg-2 col-12 \">\r\n                    <p [class]=\"'st dropdown-toggle cursor-pointer my-2 '+ (currentSort.name == 'methodState' ? 'applied ' + (!currentSort.asc ? 'asc' : 'desc') : '')\"\r\n                        (click)=\"sortOrders('methodState')\">\r\n                        {{ 'shipment-state' | translate }}:</p>\r\n                </div>\r\n                <div class=\"col-lg-2 col-12\">\r\n                    <p [class]=\"'st dropdown-toggle cursor-pointer my-2 '+ (currentSort.name == 'date' ? 'applied ' + (!currentSort.asc ? 'asc' : 'desc') : '')\"\r\n                        (click)=\"sortOrders('date')\">{{ 'date' | translate }}:</p>\r\n                </div>\r\n                <div class=\"col-lg-2 col-12\">\r\n                    <p [class]=\"'st dropdown-toggle cursor-pointer my-2 '+ (currentSort.name == 'total' ? 'applied ' + (!currentSort.asc ? 'asc' : 'desc') : '')\"\r\n                        (click)=\"sortOrders('total')\">{{ 'total' | translate }}:</p>\r\n                </div>\r\n            </div>\r\n            @for(order of orders; track $index){\r\n                <div class=\"row item border-bottom py-2\">\r\n                    <div class=\"col-lg-2 col-12\">\r\n                        <h5 class=\"fw-bold\">\r\n                            {{ order.number }}\r\n                        </h5>\r\n                    </div>\r\n                    <div class=\"col-lg-2 col-12\">\r\n                        @if(order.payments && order.payments.length > 0){\r\n                            <p class=\"price\">\r\n                                {{ order.payments[0].state | translate | titlecase }}\r\n                            </p>\r\n                        }\r\n                    </div>\r\n                    <div class=\"col-lg-2 col-12\">\r\n                        <p class=\"price\">\r\n                            {{ order.shipments[0].method.name }}\r\n                        </p>\r\n                    </div>\r\n                    <div class=\"col-lg-2 col-12\">\r\n                        <p class=\"price\">\r\n                            {{ order.shipments[0].state | translate | titlecase }}\r\n                        </p>\r\n                        <!-- ACA DEBERIA IR EL LINK DE SEGUIMIENTO -->\r\n                        <!-- <button class=\"btn btn-outline-dark btnLogout px-3 py-1 font-size-10 w-auto btn-sm\">Ver seguimiento</button> -->\r\n                        @if(order.tracking){\r\n                            <a [href]=\"order.tracking\"\r\n                            class=\"btn btn-outline-dark btnLogout px-3 py-1 font-size-10 w-auto btn-sm\">Ver seguimiento</a>\r\n                        }\r\n                    </div>\r\n                    <div class=\"col-lg-2 col-12\">\r\n                        <p class=\"price\">\r\n                            {{ toDate(order.checkoutCompletedAt, 'DD/MM/YYYY') | translate }}<br>\r\n                            {{ toDate(order.checkoutCompletedAt, 'h:mm:ss a') | translate }}\r\n                        </p>\r\n                    </div>\r\n                    <div class=\"col-lg-2 col-12 d-flex\">\r\n                        @if(creditAmountConfigured ? showPrice : true){\r\n                            <h5 class=\"fw-bold text-nowrap\">\r\n                                {{ (order.totals.total) | ecCurrencySymbol }}\r\n                            </h5>\r\n                        }\r\n                        <!-- <button class=\"btn px-0 w-100 btdetalle\" (click)=\"goToOrder(order)\">{{\r\n                                                'see-order' | translate }}</button> -->\r\n                        <button class=\"btn px-0 w-100 btdetalle\" (click)=\"goToOrder(order)\">\r\n                            <i class=\"bi bi-box-arrow-in-right\"></i></button>\r\n                    </div>\r\n                </div>\r\n            }\r\n        }@else {\r\n            <div class=\"w-100 h-50\">\r\n                <div class=\"d-flex flex-row justify-content-center align-items-center text-center\">\r\n                    <h5>{{ 'no-orders' | translate }}</h5>\r\n                </div>\r\n            </div>\r\n        }\r\n    </section>\r\n    }@else {\r\n        <div class=\"w-100 h-50 py-5\">\r\n            <div class=\"d-flex flex-row justify-content-center align-items-center text-center\">\r\n                <app-loading-full-ec></app-loading-full-ec>\r\n            </div>\r\n        </div>\r\n    }\r\n</div>\r\n\r\n<ng-template #errorView>\r\n    <div class=\"w-100 h-50\">\r\n        <div class=\"d-flex flex-row justify-content-center align-items-center text-center\">\r\n            <h4>{{ 'orders-error' | translate }}</h4>\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n", styles: [""], dependencies: [{ kind: "component", type: LoadingFullEcComponent, selector: "app-loading-full-ec" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: EcCurrencySymbolPipe, name: "ecCurrencySymbol" }] });
@@ -8155,18 +8511,134 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
         }] });
 
 class OrderEcComponent {
-    _orderService = inject(OrdersService);
+    _ordersService = inject(OrdersService);
+    _consts = inject(ApiConstantsService);
+    _constants = inject(CoreConstantsService);
+    _router = inject(Router);
+    _cartService = inject(CartService);
+    _channelConfigService = inject(ChannelService);
+    _activedRoute = inject(ActivatedRoute);
+    order$ = this._ordersService.selectedOrder$;
+    allowRepeatOrders = false;
+    loading = false;
+    showPrice = false;
+    creditAmountConfigured = false;
+    hidePrices = false;
+    hideDiscounts = false;
+    hideTaxes = false;
+    channelConfig = this._ordersService.channelConfig;
+    numberOrder;
     ngOnInit() {
-        throw new Error('Method not implemented.');
+        this.loading = true;
+        this._ordersService.selectedOrder$.subscribe(res => {
+            if (!res) {
+                const number = this._activedRoute.snapshot.params["number"];
+                this._ordersService.getOrderByNumber(number);
+            }
+            console.log('inside');
+        });
+        this._channelConfigService.channel$.subscribe((config) => {
+            if (config && config.allowRepeatOrders !== undefined) {
+                this.allowRepeatOrders = config.allowRepeatOrders;
+            }
+            else {
+                this.allowRepeatOrders = false;
+            }
+            this.hidePrices = config?.hidePrices ?? false;
+            this.hideDiscounts = config?.hideDiscounts ?? false;
+            this.hideTaxes = config?.hideTaxes ?? false;
+        });
+        this._cartService.showPrice$.subscribe((showPrice) => {
+            this.showPrice = showPrice;
+        });
+        this._cartService.creditAmount$.subscribe((creditAmount) => {
+            this.creditAmountConfigured = creditAmount !== null;
+        });
+    }
+    getUrlBase() {
+        return this._consts.getUrlBase();
     }
+    back() {
+        this._router.navigateByUrl('account/orders');
+    }
+    toDate(date, format) {
+        return moment(date).format(!format && 'DD/MM/YYYY, h:mm:ss a' || format);
+    }
+    repeatOrder(order) {
+        if (this.allowRepeatOrders && order) {
+            //this._cartService.addRepeatOrderToCart(this.order.items);
+        }
+    }
+    mediaUrl = () => this._constants.mediaUrl();
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: OrderEcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: OrderEcComponent, isStandalone: true, selector: "app-order-ec", ngImport: i0, template: "<p>order-ec works!</p>\r\n", styles: [""] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: OrderEcComponent, isStandalone: true, selector: "app-order-ec", ngImport: i0, template: "<main class=\"py-5\" id=\"orderEcComponent\">\r\n    <div class=\"container\">\r\n        @if(order$ | async; as order){\r\n            <div class=\"wrap\">\r\n                @if(order){\r\n\r\n                    <div class=\"row justify-content-between \">\r\n                        <div class=\"col-sm-auto col-12 font-brandon\">\r\n                            <h4 class=\"tit1 fw-bold\">{{ ('order' | translate) + ': ' + order.number }}</h4>\r\n                        </div>\r\n                        @if(order?.invoice){\r\n                            <div class=\"col-sm col-12 font-brandon\">\r\n                                <a target=\"_blank\" [href]=\"getUrlBase().slice(0, -1) + order.invoice\"\r\n                                    class=\"btn btn-link btn-invoice\">\r\n                                    <i class=\"fas fa-file-download me-1\"></i>\r\n                                    {{ 'download' | translate }} {{ 'invoices' | translate | titlecase }}\r\n                                </a>\r\n                            </div>\r\n                        }\r\n                        <a (click)=\"back()\" class=\"col-auto text-end\">\r\n                            <button class=\"btn btn-outline-dark btvolver border\">{{ 'back-to-orders' | translate }}</button>\r\n                        </a>\r\n                    </div>\r\n\r\n                    <section id=\"orders\">\r\n                        <div class=\"row pt-2\">\r\n                            <div class=\"col-md-2 col-12\">\r\n                                <p class=\"st\">{{ 'payment-state' | translate }}:</p>\r\n                                <p class=\"\">\r\n                                    {{ order.payments[0].state | translate }}\r\n                                </p>\r\n                            </div>\r\n                            <div class=\"col-md-2 col-12 font-brandon\">\r\n                                <p class=\"st\">{{ 'shipment-state' | translate }}:</p>\r\n                                <p class=\"\">\r\n                                    {{ order.shipments[0].state | translate }}\r\n                                </p>\r\n                            </div>\r\n                            <div class=\"col-md-2 col-12 font-brandon\">\r\n                                <p class=\"st\">{{ 'payment-method' | translate }}:</p>\r\n                                <p class=\"\">\r\n                                    {{ order.payments[0]?.method?.name | translate }}\r\n                                </p>\r\n                            </div>\r\n                            <div class=\"col-md-2 col-12 font-brandon\">\r\n                                <p class=\"st\">{{ 'shipment-method' | translate }}:</p>\r\n                                <p class=\"\">\r\n                                    {{ order.shipments[0].method.name }}\r\n                                </p>\r\n                                <!-- ACA DEBERIA IR EL LINK DE SEGUIMIENTO -->\r\n                                 @if(order.tracking){\r\n                                    <a [href]=\"order.tracking\"\r\n                                    class=\"btn btn-outline-dark btnLogout px-3 py-1 font-size-10 w-auto btn-sm\">\r\n                                    Ver seguimiento</a>\r\n                                 }\r\n                            </div>\r\n                            <div class=\"col-md-2 col-12 font-brandon\">\r\n                                <p class=\"st\">{{ 'date' | translate }}:</p>\r\n                                <p class=\"\">\r\n                                    {{ toDate(order.checkoutCompletedAt, 'DD/MM/YYYY') | translate }}<br>\r\n                                    {{ toDate(order.checkoutCompletedAt, 'h:mm:ss a') | translate }}\r\n                                </p>\r\n                            </div>\r\n                            @if(creditAmountConfigured ? showPrice : true){\r\n                                <div class=\"col-md-2 col-12 font-brandon\">\r\n                                    <p class=\"st\">{{ 'total' | translate }}:</p>\r\n                                    <h5 class=\"fw-bold\">\r\n                                        {{ (order.totals.total) | ecCurrencySymbol}}\r\n\r\n                                    </h5>\r\n                                </div>\r\n                            }\r\n                        </div>\r\n                    </section>\r\n                    @if(!hidePrices && allowRepeatOrders){\r\n                        <div class=\"text-end mt-3\">\r\n                            <button class=\"btn btn-primary mb-2\" (click)=\"repeatOrder(order)\">\r\n                                {{ 'repeat-order' | translate }}\r\n                            </button>\r\n                        </div>\r\n                    }\r\n\r\n                    <div class=\"container py-3 border-top border-bottom\">\r\n                        @if(order.items.length){\r\n                            <div  class=\"row\">\r\n                                <div class=\"col-2 font-sm font-brandon d-none d-md-block\">\r\n                                    {{ 'product' | translate | uppercase }}\r\n                                </div>\r\n                                <div class=\"col-4 font-sm font-brandon d-none d-md-block\">\r\n                                    {{ 'description' | translate | uppercase }}\r\n                                </div>\r\n                                @if(channelConfig.applyOrderLot){\r\n                                    <div id=\"colLots\" class=\"col-1 font-sm font-brandon d-none d-md-block\">\r\n                                        <!-- {{ 'description' | translate | uppercase }} -->\r\n                                        {{ 'lots' | translate | uppercase }}\r\n                                    </div>\r\n                                }\r\n                                @if(creditAmountConfigured ? showPrice : true){\r\n                                    <div class=\"col-2 text-center font-sm font-brandon d-none d-md-block\">\r\n                                        {{ 'unit-price' | translate | uppercase }}\r\n                                    </div>\r\n                                }\r\n                                <div class=\"col-1 text-center font-sm font-brandon d-none d-md-block\">\r\n                                    {{ 'quantity' | translate | uppercase }}\r\n                                </div>\r\n                                @if(creditAmountConfigured ? showPrice : true){\r\n                                    <div class=\"col-2 text-end font-sm font-brandon d-none d-md-block\">\r\n                                        {{ 'total' | translate | uppercase }}\r\n                                    </div>\r\n                                }\r\n                            </div>\r\n                        } @else {\r\n\r\n                        }\r\n                        @for(item of order.items; track $index; let i = $index){\r\n                            <div class=\"row cart-items\">\r\n                                <div class=\"col-5 col-md-2 py-2\">\r\n                                    @if(item.product.variants[0]?.images?.length){\r\n                                        <img class=\"smc maxwidth img-fluid rounded-custom \"\r\n                                            [src]=\"mediaUrl() +  item.product.variants[0].images[0]\" alt=\"\">\r\n                                    } @else {\r\n                                        @if(item.product.picturesdefault){\r\n                                            <img class=\"smc maxwidth img-fluid rounded-custom\"\r\n                                            [src]=\"mediaUrl() + item.product.picturesdefault[0]\" alt=\"\">\r\n                                        }\r\n                                    }\r\n                                </div>\r\n                                <div\r\n                                    class=\"col-md-4 col-7 flex-column flex-md-row justify-content-start d-flex align-items-center\">\r\n                                    <p class=\"font-brandon d-flex w-100 mb-0\">\r\n                                        {{ item.product.name }} (Cod:{{ item.product.variants[0].code }})\r\n                                    </p>\r\n                                </div>\r\n                                @if(channelConfig.applyOrderLot){\r\n                                    <div class=\"col-md-1 col-1 flex-column flex-md-row justify-content-start d-flex align-items-center\">\r\n                                        <input type=\"button\" class=\"btn btn-primary btnSeguir m-0 text-center\" type=\"button\"\r\n                                            [attr.data-bs-toggle]=\"'collapse'\" [attr.data-bs-target]=\"'#collapseExample'+i\"\r\n                                            aria-expanded=\"false\" [attr.aria-controls]=\"'collapseExample'+i\"\r\n                                            value=\"{{ 'see' | translate | uppercase }}\">\r\n                                    </div>\r\n                                }\r\n                                <div class=\"container d-md-none\">\r\n                                    <div class=\"row\">\r\n                                        <div class=\"col-4\">\r\n                                            <p class=\"text-center w-100 m-0\"> {{ item.quantity }}</p>\r\n                                        </div>\r\n                                        @if(creditAmountConfigured ? showPrice : true){\r\n                                            <div class=\"col-4 font-xl\">\r\n                                                <p class=\"text-center w-100 m-0\"> {{ (item.product.variants[0].saleprice ?\r\n                                                    item.product.variants[0].saleprice : item.product.variants[0].price) |\r\n                                                    ecCurrencySymbol}}</p>\r\n                                            </div>\r\n                                        }\r\n                                        @if(creditAmountConfigured ? showPrice : true){\r\n                                            <div class=\"col-4 font-xl\">\r\n                                                <p class=\"text-center w-100 m-0\"> {{ ((item.product.variants[0].saleprice ?\r\n                                                    item.product.variants[0].saleprice : item.product.variants[0].price) *\r\n                                                    item.quantity) | ecCurrencySymbol}}</p>\r\n                                            </div>\r\n                                        }\r\n                                    </div>\r\n                                </div>\r\n                                @if(creditAmountConfigured ? showPrice : true){\r\n                                    <div class=\"col-2 d-none d-md-flex align-items-center\">\r\n                                        <p class=\"text-center w-100 m-0\">\r\n                                            {{ (item.product.variants[0].saleprice ? item.product.variants[0].saleprice :\r\n                                            item.product.variants[0].price) | ecCurrencySymbol}}\r\n                                        </p>\r\n                                    </div>\r\n                                }\r\n                                <div class=\"col-1 d-none d-md-flex align-items-center\">\r\n                                    <p class=\"text-center w-100 m-0\"> {{ item.quantity }}</p>\r\n                                </div>\r\n                                @if(creditAmountConfigured ? showPrice : true){\r\n                                    <div class=\"col-2 d-none d-md-flex align-items-center\">\r\n                                        <p class=\"text-end w-100 m-0\">\r\n                                            {{ ((item.product.variants[0].saleprice ? item.product.variants[0].saleprice :\r\n                                            item.product.variants[0].price) * item.quantity) | ecCurrencySymbol}}</p>\r\n                                    </div>\r\n                                }\r\n                                <div class=\"collapse\" [attr.id]=\"'collapseExample'+i\">\r\n                                    <div class=\"card card-body\">\r\n                                        <table class=\"table table-striped\">\r\n                                            <thead>\r\n                                                <tr>\r\n                                                    <th scope=\"col\">#</th>\r\n                                                    <th scope=\"col\">Estado</th>\r\n                                                    <th scope=\"col\">Cantidad</th>\r\n                                                    <th scope=\"col\">Fecha Solicitada</th>\r\n                                                    <th scope=\"col\">Fecha Estimada</th>\r\n                                                    <th scope=\"col\">Sede</th>\r\n                                                    <th scope=\"col\">Nota</th>\r\n                                                    <th scope=\"col\">Total Lote</th>\r\n                                                </tr>\r\n                                            </thead>\r\n                                            <tbody>\r\n                                                @for( lot of item.orderItemLot; track $index){\r\n                                                    <tr>\r\n                                                        <th scope=\"row\">{{lot.id}}</th>\r\n                                                        <td>{{lot.lot_status}}</td>\r\n                                                        <td>{{lot.quantity}}</td>\r\n                                                        <td>{{ toDate(lot.date_request, 'DD/MM/YYYY') | translate }}</td>\r\n                                                        @if(lot.date_deliver){\r\n                                                            <td>{{\r\n                                                            toDate(lot.date_deliver, 'DD/MM/YYYY') | translate }}</td>\r\n                                                        } @else {\r\n                                                            <td>Pendiente</td>\r\n                                                        }\r\n                                                        <td>{{lot.shipping_address_name}}</td>\r\n                                                        <td>{{lot.notes}}</td>\r\n                                                        <td>{{lot.total_lot | ecCurrencySymbol}}</td>\r\n                                                    </tr>\r\n                                                }\r\n                                            </tbody>\r\n                                        </table>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        }\r\n                    </div>\r\n\r\n                    <div class=\"container\">\r\n                        <div class=\"row\">\r\n                            <div class=\"col-12 col-md-6\"></div>\r\n                            @if(creditAmountConfigured ? showPrice : true){\r\n                            <div class=\"col-12 col-md-6\">\r\n                                <div class=\"row py-4\">\r\n                                    <div class=\"col-6 font-brandon font-md text-gray border-bottom \">{{ 'total-products' |\r\n                                        translate }}</div>\r\n                                    <div class=\"col-6 font-brandon font-md text-gray border-bottom  text-end\">\r\n                                        {{ (order.totals.items) | ecCurrencySymbol }}\r\n                                    </div>\r\n\r\n                                    <div class=\"col-6 font-brandon font-md text-gray border-bottom \">{{ 'shipment' |\r\n                                        translate }}</div>\r\n                                    <div class=\"col-6 font-brandon font-md text-gray border-bottom  text-end\">\r\n                                        {{ (order.totals.shipping || '0') | ecCurrencySymbol }}\r\n\r\n                                    </div>\r\n                                    @if(!hideDiscounts && order.totals.promotion && order.totals.promotion != 0){\r\n                                        <div class=\"col-6 font-brandon font-md text-gray border-bottom \">{{ 'discount' |\r\n                                        translate }}</div>\r\n                                    }\r\n                                    @if(!hideDiscounts && order.totals.promotion && order.totals.promotion != 0){\r\n                                        <div class=\"col-6 font-brandon font-md text-gray border-bottom  text-end text-end\">\r\n                                        {{ (order.totals.promotion) | ecCurrencySymbol }}</div>\r\n                                    }\r\n                                    @if(!hideTaxes && order.totals.taxes && order.totals.taxes != 0 ){\r\n                                        <div class=\"col-6 font-brandon font-md text-gray border-bottom \">{{ 'taxes' | translate }}</div>\r\n                                    }\r\n                                    @if(!hideTaxes && order.totals.taxes && order.totals.taxes != 0){\r\n                                        <div class=\"col-6 font-brandon font-md text-gray border-bottom  text-end\">\r\n                                        {{ (order.totals.taxes) | ecCurrencySymbol }}</div>\r\n                                    }\r\n\r\n                                    <div class=\"col-6 font-brandon font-md\">{{ 'total' | translate | uppercase }}</div>\r\n                                    <div class=\"col-6 font-brandon font-md text-end\">\r\n                                        {{ (order.totals.total) | ecCurrencySymbol }}\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                            }\r\n                        </div>\r\n                    </div>\r\n\r\n                } @else {\r\n                    <div class=\"w-100 h-50\">\r\n                        <div class=\"d-flex flex-row justify-content-center align-items-center text-center\">\r\n                            <h5>{{ 'no-orders' | translate }}</h5>\r\n                        </div>\r\n                    </div>\r\n                }\r\n            </div>\r\n\r\n        } @else {\r\n            <div class=\"w-100 h-50 py-5\">\r\n                <div class=\"d-flex flex-row justify-content-center align-items-center text-center\">\r\n                    <app-loading-full-ec></app-loading-full-ec>\r\n                </div>\r\n            </div>\r\n        }\r\n    </div>\r\n</main>", styles: [""], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: EcCurrencySymbolPipe, name: "ecCurrencySymbol" }, { kind: "component", type: LoadingFullEcComponent, selector: "app-loading-full-ec" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: OrderEcComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-order-ec', standalone: true, imports: [], template: "<p>order-ec works!</p>\r\n" }]
+            args: [{ selector: 'app-order-ec', standalone: true, imports: [TranslateModule,
+                        EcCurrencySymbolPipe,
+                        LoadingFullEcComponent,
+                        AsyncPipe,
+                        TitleCasePipe,
+                        UpperCasePipe
+                    ], template: "<main class=\"py-5\" id=\"orderEcComponent\">\r\n    <div class=\"container\">\r\n        @if(order$ | async; as order){\r\n            <div class=\"wrap\">\r\n                @if(order){\r\n\r\n                    <div class=\"row justify-content-between \">\r\n                        <div class=\"col-sm-auto col-12 font-brandon\">\r\n                            <h4 class=\"tit1 fw-bold\">{{ ('order' | translate) + ': ' + order.number }}</h4>\r\n                        </div>\r\n                        @if(order?.invoice){\r\n                            <div class=\"col-sm col-12 font-brandon\">\r\n                                <a target=\"_blank\" [href]=\"getUrlBase().slice(0, -1) + order.invoice\"\r\n                                    class=\"btn btn-link btn-invoice\">\r\n                                    <i class=\"fas fa-file-download me-1\"></i>\r\n                                    {{ 'download' | translate }} {{ 'invoices' | translate | titlecase }}\r\n                                </a>\r\n                            </div>\r\n                        }\r\n                        <a (click)=\"back()\" class=\"col-auto text-end\">\r\n                            <button class=\"btn btn-outline-dark btvolver border\">{{ 'back-to-orders' | translate }}</button>\r\n                        </a>\r\n                    </div>\r\n\r\n                    <section id=\"orders\">\r\n                        <div class=\"row pt-2\">\r\n                            <div class=\"col-md-2 col-12\">\r\n                                <p class=\"st\">{{ 'payment-state' | translate }}:</p>\r\n                                <p class=\"\">\r\n                                    {{ order.payments[0].state | translate }}\r\n                                </p>\r\n                            </div>\r\n                            <div class=\"col-md-2 col-12 font-brandon\">\r\n                                <p class=\"st\">{{ 'shipment-state' | translate }}:</p>\r\n                                <p class=\"\">\r\n                                    {{ order.shipments[0].state | translate }}\r\n                                </p>\r\n                            </div>\r\n                            <div class=\"col-md-2 col-12 font-brandon\">\r\n                                <p class=\"st\">{{ 'payment-method' | translate }}:</p>\r\n                                <p class=\"\">\r\n                                    {{ order.payments[0]?.method?.name | translate }}\r\n                                </p>\r\n                            </div>\r\n                            <div class=\"col-md-2 col-12 font-brandon\">\r\n                                <p class=\"st\">{{ 'shipment-method' | translate }}:</p>\r\n                                <p class=\"\">\r\n                                    {{ order.shipments[0].method.name }}\r\n                                </p>\r\n                                <!-- ACA DEBERIA IR EL LINK DE SEGUIMIENTO -->\r\n                                 @if(order.tracking){\r\n                                    <a [href]=\"order.tracking\"\r\n                                    class=\"btn btn-outline-dark btnLogout px-3 py-1 font-size-10 w-auto btn-sm\">\r\n                                    Ver seguimiento</a>\r\n                                 }\r\n                            </div>\r\n                            <div class=\"col-md-2 col-12 font-brandon\">\r\n                                <p class=\"st\">{{ 'date' | translate }}:</p>\r\n                                <p class=\"\">\r\n                                    {{ toDate(order.checkoutCompletedAt, 'DD/MM/YYYY') | translate }}<br>\r\n                                    {{ toDate(order.checkoutCompletedAt, 'h:mm:ss a') | translate }}\r\n                                </p>\r\n                            </div>\r\n                            @if(creditAmountConfigured ? showPrice : true){\r\n                                <div class=\"col-md-2 col-12 font-brandon\">\r\n                                    <p class=\"st\">{{ 'total' | translate }}:</p>\r\n                                    <h5 class=\"fw-bold\">\r\n                                        {{ (order.totals.total) | ecCurrencySymbol}}\r\n\r\n                                    </h5>\r\n                                </div>\r\n                            }\r\n                        </div>\r\n                    </section>\r\n                    @if(!hidePrices && allowRepeatOrders){\r\n                        <div class=\"text-end mt-3\">\r\n                            <button class=\"btn btn-primary mb-2\" (click)=\"repeatOrder(order)\">\r\n                                {{ 'repeat-order' | translate }}\r\n                            </button>\r\n                        </div>\r\n                    }\r\n\r\n                    <div class=\"container py-3 border-top border-bottom\">\r\n                        @if(order.items.length){\r\n                            <div  class=\"row\">\r\n                                <div class=\"col-2 font-sm font-brandon d-none d-md-block\">\r\n                                    {{ 'product' | translate | uppercase }}\r\n                                </div>\r\n                                <div class=\"col-4 font-sm font-brandon d-none d-md-block\">\r\n                                    {{ 'description' | translate | uppercase }}\r\n                                </div>\r\n                                @if(channelConfig.applyOrderLot){\r\n                                    <div id=\"colLots\" class=\"col-1 font-sm font-brandon d-none d-md-block\">\r\n                                        <!-- {{ 'description' | translate | uppercase }} -->\r\n                                        {{ 'lots' | translate | uppercase }}\r\n                                    </div>\r\n                                }\r\n                                @if(creditAmountConfigured ? showPrice : true){\r\n                                    <div class=\"col-2 text-center font-sm font-brandon d-none d-md-block\">\r\n                                        {{ 'unit-price' | translate | uppercase }}\r\n                                    </div>\r\n                                }\r\n                                <div class=\"col-1 text-center font-sm font-brandon d-none d-md-block\">\r\n                                    {{ 'quantity' | translate | uppercase }}\r\n                                </div>\r\n                                @if(creditAmountConfigured ? showPrice : true){\r\n                                    <div class=\"col-2 text-end font-sm font-brandon d-none d-md-block\">\r\n                                        {{ 'total' | translate | uppercase }}\r\n                                    </div>\r\n                                }\r\n                            </div>\r\n                        } @else {\r\n\r\n                        }\r\n                        @for(item of order.items; track $index; let i = $index){\r\n                            <div class=\"row cart-items\">\r\n                                <div class=\"col-5 col-md-2 py-2\">\r\n                                    @if(item.product.variants[0]?.images?.length){\r\n                                        <img class=\"smc maxwidth img-fluid rounded-custom \"\r\n                                            [src]=\"mediaUrl() +  item.product.variants[0].images[0]\" alt=\"\">\r\n                                    } @else {\r\n                                        @if(item.product.picturesdefault){\r\n                                            <img class=\"smc maxwidth img-fluid rounded-custom\"\r\n                                            [src]=\"mediaUrl() + item.product.picturesdefault[0]\" alt=\"\">\r\n                                        }\r\n                                    }\r\n                                </div>\r\n                                <div\r\n                                    class=\"col-md-4 col-7 flex-column flex-md-row justify-content-start d-flex align-items-center\">\r\n                                    <p class=\"font-brandon d-flex w-100 mb-0\">\r\n                                        {{ item.product.name }} (Cod:{{ item.product.variants[0].code }})\r\n                                    </p>\r\n                                </div>\r\n                                @if(channelConfig.applyOrderLot){\r\n                                    <div class=\"col-md-1 col-1 flex-column flex-md-row justify-content-start d-flex align-items-center\">\r\n                                        <input type=\"button\" class=\"btn btn-primary btnSeguir m-0 text-center\" type=\"button\"\r\n                                            [attr.data-bs-toggle]=\"'collapse'\" [attr.data-bs-target]=\"'#collapseExample'+i\"\r\n                                            aria-expanded=\"false\" [attr.aria-controls]=\"'collapseExample'+i\"\r\n                                            value=\"{{ 'see' | translate | uppercase }}\">\r\n                                    </div>\r\n                                }\r\n                                <div class=\"container d-md-none\">\r\n                                    <div class=\"row\">\r\n                                        <div class=\"col-4\">\r\n                                            <p class=\"text-center w-100 m-0\"> {{ item.quantity }}</p>\r\n                                        </div>\r\n                                        @if(creditAmountConfigured ? showPrice : true){\r\n                                            <div class=\"col-4 font-xl\">\r\n                                                <p class=\"text-center w-100 m-0\"> {{ (item.product.variants[0].saleprice ?\r\n                                                    item.product.variants[0].saleprice : item.product.variants[0].price) |\r\n                                                    ecCurrencySymbol}}</p>\r\n                                            </div>\r\n                                        }\r\n                                        @if(creditAmountConfigured ? showPrice : true){\r\n                                            <div class=\"col-4 font-xl\">\r\n                                                <p class=\"text-center w-100 m-0\"> {{ ((item.product.variants[0].saleprice ?\r\n                                                    item.product.variants[0].saleprice : item.product.variants[0].price) *\r\n                                                    item.quantity) | ecCurrencySymbol}}</p>\r\n                                            </div>\r\n                                        }\r\n                                    </div>\r\n                                </div>\r\n                                @if(creditAmountConfigured ? showPrice : true){\r\n                                    <div class=\"col-2 d-none d-md-flex align-items-center\">\r\n                                        <p class=\"text-center w-100 m-0\">\r\n                                            {{ (item.product.variants[0].saleprice ? item.product.variants[0].saleprice :\r\n                                            item.product.variants[0].price) | ecCurrencySymbol}}\r\n                                        </p>\r\n                                    </div>\r\n                                }\r\n                                <div class=\"col-1 d-none d-md-flex align-items-center\">\r\n                                    <p class=\"text-center w-100 m-0\"> {{ item.quantity }}</p>\r\n                                </div>\r\n                                @if(creditAmountConfigured ? showPrice : true){\r\n                                    <div class=\"col-2 d-none d-md-flex align-items-center\">\r\n                                        <p class=\"text-end w-100 m-0\">\r\n                                            {{ ((item.product.variants[0].saleprice ? item.product.variants[0].saleprice :\r\n                                            item.product.variants[0].price) * item.quantity) | ecCurrencySymbol}}</p>\r\n                                    </div>\r\n                                }\r\n                                <div class=\"collapse\" [attr.id]=\"'collapseExample'+i\">\r\n                                    <div class=\"card card-body\">\r\n                                        <table class=\"table table-striped\">\r\n                                            <thead>\r\n                                                <tr>\r\n                                                    <th scope=\"col\">#</th>\r\n                                                    <th scope=\"col\">Estado</th>\r\n                                                    <th scope=\"col\">Cantidad</th>\r\n                                                    <th scope=\"col\">Fecha Solicitada</th>\r\n                                                    <th scope=\"col\">Fecha Estimada</th>\r\n                                                    <th scope=\"col\">Sede</th>\r\n                                                    <th scope=\"col\">Nota</th>\r\n                                                    <th scope=\"col\">Total Lote</th>\r\n                                                </tr>\r\n                                            </thead>\r\n                                            <tbody>\r\n                                                @for( lot of item.orderItemLot; track $index){\r\n                                                    <tr>\r\n                                                        <th scope=\"row\">{{lot.id}}</th>\r\n                                                        <td>{{lot.lot_status}}</td>\r\n                                                        <td>{{lot.quantity}}</td>\r\n                                                        <td>{{ toDate(lot.date_request, 'DD/MM/YYYY') | translate }}</td>\r\n                                                        @if(lot.date_deliver){\r\n                                                            <td>{{\r\n                                                            toDate(lot.date_deliver, 'DD/MM/YYYY') | translate }}</td>\r\n                                                        } @else {\r\n                                                            <td>Pendiente</td>\r\n                                                        }\r\n                                                        <td>{{lot.shipping_address_name}}</td>\r\n                                                        <td>{{lot.notes}}</td>\r\n                                                        <td>{{lot.total_lot | ecCurrencySymbol}}</td>\r\n                                                    </tr>\r\n                                                }\r\n                                            </tbody>\r\n                                        </table>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        }\r\n                    </div>\r\n\r\n                    <div class=\"container\">\r\n                        <div class=\"row\">\r\n                            <div class=\"col-12 col-md-6\"></div>\r\n                            @if(creditAmountConfigured ? showPrice : true){\r\n                            <div class=\"col-12 col-md-6\">\r\n                                <div class=\"row py-4\">\r\n                                    <div class=\"col-6 font-brandon font-md text-gray border-bottom \">{{ 'total-products' |\r\n                                        translate }}</div>\r\n                                    <div class=\"col-6 font-brandon font-md text-gray border-bottom  text-end\">\r\n                                        {{ (order.totals.items) | ecCurrencySymbol }}\r\n                                    </div>\r\n\r\n                                    <div class=\"col-6 font-brandon font-md text-gray border-bottom \">{{ 'shipment' |\r\n                                        translate }}</div>\r\n                                    <div class=\"col-6 font-brandon font-md text-gray border-bottom  text-end\">\r\n                                        {{ (order.totals.shipping || '0') | ecCurrencySymbol }}\r\n\r\n                                    </div>\r\n                                    @if(!hideDiscounts && order.totals.promotion && order.totals.promotion != 0){\r\n                                        <div class=\"col-6 font-brandon font-md text-gray border-bottom \">{{ 'discount' |\r\n                                        translate }}</div>\r\n                                    }\r\n                                    @if(!hideDiscounts && order.totals.promotion && order.totals.promotion != 0){\r\n                                        <div class=\"col-6 font-brandon font-md text-gray border-bottom  text-end text-end\">\r\n                                        {{ (order.totals.promotion) | ecCurrencySymbol }}</div>\r\n                                    }\r\n                                    @if(!hideTaxes && order.totals.taxes && order.totals.taxes != 0 ){\r\n                                        <div class=\"col-6 font-brandon font-md text-gray border-bottom \">{{ 'taxes' | translate }}</div>\r\n                                    }\r\n                                    @if(!hideTaxes && order.totals.taxes && order.totals.taxes != 0){\r\n                                        <div class=\"col-6 font-brandon font-md text-gray border-bottom  text-end\">\r\n                                        {{ (order.totals.taxes) | ecCurrencySymbol }}</div>\r\n                                    }\r\n\r\n                                    <div class=\"col-6 font-brandon font-md\">{{ 'total' | translate | uppercase }}</div>\r\n                                    <div class=\"col-6 font-brandon font-md text-end\">\r\n                                        {{ (order.totals.total) | ecCurrencySymbol }}\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                            }\r\n                        </div>\r\n                    </div>\r\n\r\n                } @else {\r\n                    <div class=\"w-100 h-50\">\r\n                        <div class=\"d-flex flex-row justify-content-center align-items-center text-center\">\r\n                            <h5>{{ 'no-orders' | translate }}</h5>\r\n                        </div>\r\n                    </div>\r\n                }\r\n            </div>\r\n\r\n        } @else {\r\n            <div class=\"w-100 h-50 py-5\">\r\n                <div class=\"d-flex flex-row justify-content-center align-items-center text-center\">\r\n                    <app-loading-full-ec></app-loading-full-ec>\r\n                </div>\r\n            </div>\r\n        }\r\n    </div>\r\n</main>" }]
         }] });
 
+class SidebarEcComponent {
+    _cartService = inject(CartService);
+    _consts = inject(CoreConstantsService);
+    _authService = inject(AuthService);
+    _router = inject(Router);
+    _toastrService = inject(ToastService);
+    _channelService = inject(ChannelService);
+    user = null;
+    mediaUrl = this._consts.mediaUrl();
+    promotions = [];
+    variantsToShow = ['TALLE', 'COLOR'];
+    hideDiscounts = false;
+    hideTaxes = false;
+    cartItems$ = this._cartService.cartItems$;
+    subTotalAmount$ = this._cartService.getSubTotalAmount();
+    totalPromotionAmount$ = this._cartService.getTotalPromotionAmount();
+    taxesAmount$ = this._cartService.getTaxesAmount();
+    totalAmount$ = this._cartService.getTotalAmount();
+    ngOnInit() {
+        this._cartService.promotions$.subscribe(promotions => this.promotions = promotions);
+        this._authService.getUserProfile().subscribe(u => {
+            this.user = u;
+        });
+        this._channelService.channel$.subscribe(channel => {
+            this.hideDiscounts = channel?.hideDiscounts ?? false;
+            this.hideTaxes = channel?.hideTaxes ?? false;
+        });
+    }
+    actualizarCantidad(_t13, arg1, arg2, arg3, arg4) {
+        throw new Error('Method not implemented.');
+    }
+    getVariants(_t8) {
+        throw new Error('Method not implemented.');
+    }
+    getTotalAmount() {
+        throw new Error('Method not implemented.');
+    }
+    removeCoupon() {
+        throw new Error('Method not implemented.');
+    }
+    deleteCartItem(_t8, arg1) {
+        throw new Error('Method not implemented.');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: SidebarEcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: SidebarEcComponent, isStandalone: true, selector: "app-sidebar-ec", ngImport: i0, template: "<div class=\"nav my-4 mx-0 position-relative text-center shadow-sm border-bottom d-flex justify-content-center\">\r\n    <h2 class=\"row text-center\">Mi carrito</h2>\r\n    <div class=\" me-3 closeCart position-absolute end-0\" data-bs-dismiss=\"offcanvas\" aria-label=\"Close\">\r\n        <i class=\"fa fa-times-circle fs-5\" aria-hidden=\"true\"></i>\r\n    </div>\r\n</div>\r\n\r\n\r\n@if(cartItems$ | async; as items){\r\n    @if(items.length > 0){\r\n    <!-- PRODUCTO -->\r\n    <div class=\"d-flex flex-column mb-4 items\">\r\n        @for(item of items; track $index; let i = $index){\r\n        <div class=\"productoCarrito mt-1 mb-2 w-100\">\r\n            <app-cart-item-ec [inSidebar]=\"true\" [item]=\"item\"></app-cart-item-ec>\r\n        </div>\r\n        }\r\n    </div>\r\n    <div class=\"d-flex mx-4 justify-content-between border-top \">\r\n        <p>Subtotal</p>\r\n        <p class=\"fw-700\">{{ (subTotalAmount$ | async) | ecCurrencySymbol}}</p>\r\n    </div>\r\n    <div class=\"mx-4 bordeBot\">\r\n        <app-coupon-ec></app-coupon-ec>\r\n    </div>\r\n    <div class=\"d-flex mx-4 justify-content-between bordeBot2\">\r\n        <p>Descuentos:</p>\r\n        <p>{{ (totalPromotionAmount$ | async) |ecCurrencySymbol }}</p>\r\n    </div>\r\n\r\n    <div class=\"d-flex mx-4 justify-content-between bordeBot2\">\r\n        <!--  @if(this._cartService.cart.source.value.couponCode){\r\n                <a class=\"quitar-cupon text-dark\" role=\"button\"\r\n                (click)=\"removeCoupon()\">(Quitar cup\u00F3n)</a>\r\n            } -->\r\n    </div>\r\n    <div class=\"d-flex mx-4 justify-content-between mb-3 mt-2\">\r\n        <p class=\"fw-bold h5\">TOTAL</p>\r\n     <p class=\"fw-bold h5\">{{(totalAmount$ | async) | ecCurrencySymbol}}</p>\r\n    </div>\r\n    <div class=\"d-flex flex-column mx-4 justify-content-between mb-3\" data-bs-dismiss=\"offcanvas\" aria-label=\"Close\">\r\n        <a [routerLink]=\"['/cart']\" class=\"btn btn-primary btn-block w-100 btnComprar mb-2 mt-3 \">CONFIRMAR PEDIDO</a>\r\n        <a [routerLink]=\"['/collection']\" class=\"btn btn-secondary btn-block w-100 btnSeguir\">SEGUIR COMPRANDO</a>\r\n    </div>\r\n\r\n\r\n    } @else {\r\n    <div class=\"container-lg px-lg-0 px-md-4 my-5\">\r\n        <div class=\"row\">\r\n            <div class=\"col-12\">\r\n                <h5 class=\"text-center mb-sm-4 text-uppercase\"> \u00B7 Su carrito se\r\n                    encuentra vac\u00EDo \u00B7 </h5>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    }\r\n}", styles: [".items{max-height:35vh;overflow-y:scroll;overflow-x:hidden}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: CouponEcComponent, selector: "app-coupon-ec" }, { kind: "component", type: CartItemEcComponent, selector: "app-cart-item-ec", inputs: ["item", "inSidebar"] }, { kind: "pipe", type: EcCurrencySymbolPipe, name: "ecCurrencySymbol" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: SidebarEcComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-sidebar-ec', standalone: true, imports: [RouterLink, AsyncPipe, CouponEcComponent, CartItemEcComponent, EcCurrencySymbolPipe], template: "<div class=\"nav my-4 mx-0 position-relative text-center shadow-sm border-bottom d-flex justify-content-center\">\r\n    <h2 class=\"row text-center\">Mi carrito</h2>\r\n    <div class=\" me-3 closeCart position-absolute end-0\" data-bs-dismiss=\"offcanvas\" aria-label=\"Close\">\r\n        <i class=\"fa fa-times-circle fs-5\" aria-hidden=\"true\"></i>\r\n    </div>\r\n</div>\r\n\r\n\r\n@if(cartItems$ | async; as items){\r\n    @if(items.length > 0){\r\n    <!-- PRODUCTO -->\r\n    <div class=\"d-flex flex-column mb-4 items\">\r\n        @for(item of items; track $index; let i = $index){\r\n        <div class=\"productoCarrito mt-1 mb-2 w-100\">\r\n            <app-cart-item-ec [inSidebar]=\"true\" [item]=\"item\"></app-cart-item-ec>\r\n        </div>\r\n        }\r\n    </div>\r\n    <div class=\"d-flex mx-4 justify-content-between border-top \">\r\n        <p>Subtotal</p>\r\n        <p class=\"fw-700\">{{ (subTotalAmount$ | async) | ecCurrencySymbol}}</p>\r\n    </div>\r\n    <div class=\"mx-4 bordeBot\">\r\n        <app-coupon-ec></app-coupon-ec>\r\n    </div>\r\n    <div class=\"d-flex mx-4 justify-content-between bordeBot2\">\r\n        <p>Descuentos:</p>\r\n        <p>{{ (totalPromotionAmount$ | async) |ecCurrencySymbol }}</p>\r\n    </div>\r\n\r\n    <div class=\"d-flex mx-4 justify-content-between bordeBot2\">\r\n        <!--  @if(this._cartService.cart.source.value.couponCode){\r\n                <a class=\"quitar-cupon text-dark\" role=\"button\"\r\n                (click)=\"removeCoupon()\">(Quitar cup\u00F3n)</a>\r\n            } -->\r\n    </div>\r\n    <div class=\"d-flex mx-4 justify-content-between mb-3 mt-2\">\r\n        <p class=\"fw-bold h5\">TOTAL</p>\r\n     <p class=\"fw-bold h5\">{{(totalAmount$ | async) | ecCurrencySymbol}}</p>\r\n    </div>\r\n    <div class=\"d-flex flex-column mx-4 justify-content-between mb-3\" data-bs-dismiss=\"offcanvas\" aria-label=\"Close\">\r\n        <a [routerLink]=\"['/cart']\" class=\"btn btn-primary btn-block w-100 btnComprar mb-2 mt-3 \">CONFIRMAR PEDIDO</a>\r\n        <a [routerLink]=\"['/collection']\" class=\"btn btn-secondary btn-block w-100 btnSeguir\">SEGUIR COMPRANDO</a>\r\n    </div>\r\n\r\n\r\n    } @else {\r\n    <div class=\"container-lg px-lg-0 px-md-4 my-5\">\r\n        <div class=\"row\">\r\n            <div class=\"col-12\">\r\n                <h5 class=\"text-center mb-sm-4 text-uppercase\"> \u00B7 Su carrito se\r\n                    encuentra vac\u00EDo \u00B7 </h5>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    }\r\n}", styles: [".items{max-height:35vh;overflow-y:scroll;overflow-x:hidden}\n"] }]
+        }] });
+
+// export * from './related-products-ec/related-products-ec.component';
+// export * from './reviews-form-ec/reviews-form-ec.component';    
+// export * from './reviews-ec/reviews-ec.component';
+
 //Types
 
 /**
@@ -8215,6 +8687,198 @@ const authInterceptor = (req, next) => {
     return next(req);
 };
 
+class ProductStockDirective {
+    templateRef;
+    viewContainer;
+    productDirective = null;
+    ecProductStockElse;
+    set ecProductStock(product) {
+        this.productDirective = product;
+        this.viewContainer.clear();
+        if (this.validateStock()) {
+            if (this.ecProductStockElse) {
+                this.viewContainer.createEmbeddedView(this.ecProductStockElse);
+            }
+            else {
+                console.error('falta definir el template de agotado');
+            }
+        }
+        else {
+            this.viewContainer.createEmbeddedView(this.templateRef);
+        }
+    }
+    constructor(templateRef, viewContainer) {
+        this.templateRef = templateRef;
+        this.viewContainer = viewContainer;
+    }
+    ngOnInit() { }
+    ngOnDestroy() { }
+    ngOnChanges() { }
+    validateStock = () => {
+        if (!this.productDirective || this.productDirective.special_mark == undefined || this.productDirective.variants == undefined) {
+            setTimeout(() => {
+                this.validateStock();
+            }, 1000);
+            return false; // Ensure a boolean is returned
+        }
+        else {
+            return this.checkValuesForStock();
+        }
+    };
+    checkValuesForStock = () => {
+        let existMark = false;
+        // Check special_mark
+        if (this.productDirective?.special_mark) {
+            this.productDirective.special_mark.forEach(special_mark => {
+                if (special_mark.type === 'out_of_stock') {
+                    existMark = true;
+                }
+            });
+        }
+        // Check variants
+        if (!existMark && this.productDirective) {
+            existMark = !!(this.productDirective.variant_id
+                ? this.productDirective.variants?.find(v => v.code === this.productDirective?.variant_id && v.stock > 0) === undefined
+                : this.productDirective.variants?.find(v => v.stock > 0) === undefined);
+        }
+        return existMark;
+    };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: ProductStockDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.0", type: ProductStockDirective, selector: "[ecProductStock]", inputs: { ecProductStockElse: "ecProductStockElse", ecProductStock: "ecProductStock" }, usesOnChanges: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: ProductStockDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[ecProductStock]"
+                }]
+        }], ctorParameters: () => [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }], propDecorators: { ecProductStockElse: [{
+                type: Input
+            }], ecProductStock: [{
+                type: Input
+            }] } });
+
+class ParamsContext {
+}
+class ProductOffDirective {
+    document;
+    elementRef;
+    renderer;
+    product;
+    classStr = "";
+    customMessageStr = "{discount}% OFF";
+    set ecProductOff(value) {
+        this.product = value;
+    }
+    set classStrSpacing(value) {
+        this.classStr = value;
+    }
+    set customMessage(value) {
+        this.customMessageStr = value;
+    }
+    constructor(document, elementRef, renderer) {
+        this.document = document;
+        this.elementRef = elementRef;
+        this.renderer = renderer;
+    }
+    ngOnInit() { }
+    hasDiscount = (product) => {
+        if (!product.saleprice) {
+            return null;
+        }
+        if (typeof product.price === 'string' && product.price.includes("-") &&
+            typeof product.saleprice === 'string' && product.saleprice.includes("-")) {
+            let prices = product.price.split('-');
+            let saleprices = product.saleprice.split('-');
+            let saleBf = this.generateDiscount(prices[1]?.trim(), saleprices[1]?.trim());
+            let saleLt = this.generateDiscount(prices[0]?.trim(), saleprices[0]?.trim());
+            if (!saleBf && !saleLt) {
+                return null;
+            }
+            if (saleBf && saleLt && saleBf === saleLt) {
+                return `${saleBf}`;
+            }
+            if (saleBf && !saleLt) {
+                return `${saleBf}`;
+            }
+            if (!saleBf && saleLt) {
+                return `${saleLt}`;
+            }
+            return `${saleBf} - ${saleLt}`;
+        }
+        else {
+            if (parseInt(product.price) > parseInt(product.saleprice)) {
+                return this.generateDiscount(product.price, product.saleprice)?.toString() || null;
+            }
+        }
+        return null; // Ensure a return value in all code paths
+    };
+    generateDiscount = (price, saleprice) => {
+        if (parseFloat(price) > parseFloat(saleprice)) {
+            let result = ((parseFloat(price) - parseFloat(saleprice)) /
+                parseFloat(price)) *
+                100;
+            if (Number.isNaN(result)) {
+                return null;
+            }
+            else
+                return Math.round(result); //Math.floor(result);
+        }
+        return null;
+    };
+    ngOnChanges(changes) {
+        if (this.product.price) {
+            let discount = this.hasDiscount(this.product);
+            this.elementRef.nativeElement.childNodes.forEach((node) => {
+                this.renderer.removeChild(this.elementRef.nativeElement, node);
+            });
+            if (discount) {
+                this.renderer.appendChild(this.elementRef.nativeElement, this.createImage(discount));
+            }
+            // else {
+            //     this.renderer.removeChild(this.elementRef.nativeElement.parentElement, this.elementRef.nativeElement);
+            // }
+        }
+    }
+    createImage = (discount) => {
+        let popover = this.renderer.createElement("a");
+        this.customMessageStr = this.customMessageStr.replace('{discount}', discount);
+        this.renderer.setProperty(popover, "innerHTML", this.customMessageStr);
+        this.classStr?.split(" ").forEach((cl) => {
+            try {
+                this.renderer.addClass(popover, cl);
+            }
+            catch (error) {
+                console.log('add class directive -> ', error);
+            }
+        });
+        return popover;
+    };
+    ngOnDestroy() { }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: ProductOffDirective, deps: [{ token: DOCUMENT }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.0", type: ProductOffDirective, selector: "[ecProductOff]", inputs: { ecProductOff: "ecProductOff", classStrSpacing: "classStrSpacing", customMessage: "customMessage" }, usesOnChanges: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: ProductOffDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[ecProductOff]",
+                }]
+        }], ctorParameters: () => [{ type: Document, decorators: [{
+                    type: Inject,
+                    args: [DOCUMENT]
+                }] }, { type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { ecProductOff: [{
+                type: Input
+            }], classStrSpacing: [{
+                type: Input
+            }], customMessage: [{
+                type: Input
+            }] } });
+
+//Directives base
+const directives = [
+    ProductOffDirective,
+    ProductStockDirective,
+];
+
 /*
  * Public API Surface of ng-easycommerce
  */
@@ -8224,5 +8888,5 @@ const authInterceptor = (req, next) => {
  * Generated bundle index. Do not edit.
  */
 
-export { AccountEcComponent, AddressingService, AnalyticsService, AuthEcComponent, AuthService, AuthStorageService, BlockBannerBoxEcComponent, BlockBannerFullEcComponent, BlockFormContactEcComponent, BlockHtmlEcComponent, BlockNewsletterEcComponent, BlockProductsEcComponent, BlocksEcComponent, BlocksRepositoryService, BlocksService, BreadcrumbEcComponent, CartEcComponent, CartItemEcComponent, CartService, ChannelService, CheckoutEcComponent, CheckoutService, CollectionEcComponent, ConfirmAccountEcComponent, CoreConstantsService, CouponEcComponent, CurrencyService, DopplerService, ENVIRONMENT_TOKEN, EcCurrencySymbolPipe, FacebookPixelService, FiltersEcComponent, FiltersService, FiltersSortEcComponent, FooterEcComponent, ForgotPasswordEcComponent, FormService, GTMService, GoogleAnalyticsService, HeaderEcComponent, HomeEcComponent, LoadingFullEcComponent, LoadingInlineEcComponent, LoadingSectionEcComponent, LocalStorageService, LoginFormEcComponent, MagnizoomEcComponent, MetricoolPixelService, NgxLocalStorageService, OptionsService, OrderEcComponent, OrderUtilityService, OrdersListEcComponent, OrdersService, PaginationService, ParametersService, PaymentService, PriceEcComponent, ProductDetailEcComponent, ProductDetailService, ProductEcComponent, ProductsService, ReCaptchaEcComponent, ReCaptchaService, RegisterFormEcComponent, RegisterWholesalerFormEcComponent, ShipmentService, SuccessEcComponent, TestService, ToastService, VariantsEcComponent, authGuard, authInterceptor, provideEnvironment };
+export { AccountEcComponent, AddressingService, AnalyticsService, AuthEcComponent, AuthService, AuthStorageService, BlockBannerBoxEcComponent, BlockBannerFullEcComponent, BlockFormContactEcComponent, BlockHtmlEcComponent, BlockNewsletterEcComponent, BlockProductsEcComponent, BlocksEcComponent, BlocksRepositoryService, BlocksService, BreadcrumbEcComponent, CartEcComponent, CartItemEcComponent, CartService, ChannelService, CheckoutEcComponent, CheckoutService, CollectionEcComponent, ConfirmAccountEcComponent, CoreConstantsService, CouponEcComponent, CurrencyService, DopplerService, ENVIRONMENT_TOKEN, EcCurrencySymbolPipe, FacebookPixelService, FiltersEcComponent, FiltersService, FiltersSortEcComponent, FooterEcComponent, ForgotPasswordEcComponent, FormService, GTMService, GoogleAnalyticsService, HeaderEcComponent, HomeEcComponent, LoadingFullEcComponent, LoadingInlineEcComponent, LoadingSectionEcComponent, LocalStorageService, LoginFormEcComponent, MagnizoomEcComponent, MetricoolPixelService, NgxLocalStorageService, OptionsService, OrderEcComponent, OrderUtilityService, OrdersListEcComponent, OrdersService, PaginationService, ParametersService, ParamsContext, PaymentService, PriceEcComponent, ProductDetailEcComponent, ProductDetailService, ProductEcComponent, ProductOffDirective, ProductStockDirective, ProductsService, ReCaptchaEcComponent, ReCaptchaService, RegisterFormEcComponent, RegisterWholesalerFormEcComponent, ShipmentService, SidebarEcComponent, SuccessEcComponent, TestService, ToastService, VariantsEcComponent, authGuard, authInterceptor, directives, provideEnvironment };
 //# sourceMappingURL=ng-easycommerce-v18.mjs.map