ng-easycommerce-v18 0.0.3 → 0.0.4

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 } 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' });
 }
@@ -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    @if (shouldShowPrice) {\r\n    <app-price-ec [price]=\"product.price\" [saleprice]=\"product.saleprice\" class=\"\" />\r\n    }@else {\r\n    <p class=\"noPrice mb-1 mt-2 pt-1\"></p>\r\n    }\r\n\r\n    <!-- Nombre del producto -->\r\n    <h6 class=\"my-0\">{{ product.name | titlecase }}</h6>\r\n\r\n    <p class=\"sku mt-2\" [innerHTML]=\"product.shortdetails\"></p>\r\n\r\n    <div class=\"fixBottom mt-1\">\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\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    @if (shouldShowPrice) {\r\n    <app-price-ec [price]=\"product.price\" [saleprice]=\"product.saleprice\" class=\"\" />\r\n    }@else {\r\n    <p class=\"noPrice mb-1 mt-2 pt-1\"></p>\r\n    }\r\n\r\n    <!-- Nombre del producto -->\r\n    <h6 class=\"my-0\">{{ product.name | titlecase }}</h6>\r\n\r\n    <p class=\"sku mt-2\" [innerHTML]=\"product.shortdetails\"></p>\r\n\r\n    <div class=\"fixBottom mt-1\">\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\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,6 +7167,7 @@ class FiltersEcComponent {
     _filtersService = inject(FiltersService);
     filters = [];
     filter$ = this._filtersService.filters$;
+    setSelect;
     constructor() {
         this.filter$.subscribe(res => {
             this.filters = this._filtersService.getSpecificFilters(['attributes', 'categories', 'dynamics']);
@@ -7038,13 +7191,102 @@ 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.
+    */
+    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" }, 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
+            }] } });
 
 class ProductDetailEcComponent {
     _productDetailService = inject(ProductDetailService);
@@ -7053,6 +7295,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 +7305,23 @@ class ProductDetailEcComponent {
     data$ = this._productDetailService.associatedData$;
     mediaUrl = this._consts.mediaUrl();
     code = '';
+    showFormContact = false;
+    showReviews = 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 +7370,15 @@ 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);
+    }
     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: [""] });
 }
@@ -7177,13 +7441,16 @@ 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'];
     ngOnInit() {
         this.quantity = this.item.quantity;
+        console.log(this.item, this.mediaUrl);
     }
     updateQuantity(stock) {
         if (this.quantity > 0 && this.quantity <= stock) {
@@ -7205,17 +7472,59 @@ 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;
+        }
+    }
     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 +8435,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 +8464,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
 
 /**
@@ -8219,10 +8644,12 @@ const authInterceptor = (req, next) => {
  * Public API Surface of ng-easycommerce
  */
 //Components
+// Directives
+//export * from './lib/ec-directive/index';
 
 /**
  * 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, PaymentService, PriceEcComponent, ProductDetailEcComponent, ProductDetailService, ProductEcComponent, ProductsService, ReCaptchaEcComponent, ReCaptchaService, RegisterFormEcComponent, RegisterWholesalerFormEcComponent, ShipmentService, SidebarEcComponent, SuccessEcComponent, TestService, ToastService, VariantsEcComponent, authGuard, authInterceptor, provideEnvironment };
 //# sourceMappingURL=ng-easycommerce-v18.mjs.map