ng-easycommerce-v18 0.3.11 → 0.3.12-beta.1

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, ChangeDetectorRef, HostListener, CUSTOM_ELEMENTS_SCHEMA, Input, Pipe, Injector, EventEmitter, Output, forwardRef, afterRender, ViewChild, computed, Renderer2, ChangeDetectionStrategy, Directive, Inject } from '@angular/core';
+import { InjectionToken, makeEnvironmentProviders, inject, Injectable, PLATFORM_ID, RendererFactory2, afterNextRender, signal, EnvironmentInjector, runInInjectionContext, Component, ChangeDetectorRef, HostListener, CUSTOM_ELEMENTS_SCHEMA, Input, Pipe, Injector, EventEmitter, Output, forwardRef, afterRender, ViewChild, Inject, computed, Renderer2, ChangeDetectionStrategy, Directive } from '@angular/core';
 import * as i1 from '@angular/common';
 import { DOCUMENT, isPlatformBrowser, AsyncPipe, CommonModule, TitleCasePipe, JsonPipe, UpperCasePipe, Location } from '@angular/common';
 import { take, BehaviorSubject, shareReplay, map, catchError, of, filter, ReplaySubject, firstValueFrom, concatMap, throwError, switchMap, combineLatest } from 'rxjs';
@@ -7525,6 +7525,157 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 args: ['mainCanvas', { static: true }]
             }] } });
 
+class ComponentHelper {
+    constructor() {
+        this.ecOnConstruct();
+    }
+    ecOnInit = (params = {}) => {
+    };
+    ecOnConstruct = (params = {}) => {
+    };
+    hasParams = (params, searched) => {
+        if (!params || !searched)
+            return false;
+        const q = searched.trim().toLowerCase();
+        return params.some(p => {
+            const code = p?.['code']?.toString().toLowerCase() ?? '';
+            // Primero chequeo exacto, y si no, parcial
+            return code === q || code.includes(q);
+        });
+    };
+    navigateOnRouter(router, url) {
+        router.navigateByUrl(`/${url}`);
+    }
+}
+
+class RedsysCatchEcComponent extends ComponentHelper {
+    activedRoute;
+    router;
+    checkoutService;
+    renderer;
+    elementRef;
+    document;
+    message = '';
+    subscription = null;
+    constructor(activedRoute, router, checkoutService, renderer, elementRef, document) {
+        super();
+        this.activedRoute = activedRoute;
+        this.router = router;
+        this.checkoutService = checkoutService;
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+        this.document = document;
+        this.hideHeaderFooter();
+        this.ecOnConstruct();
+    }
+    ngOnInit() {
+        this.subscription = combineLatest([
+            this.activedRoute.params,
+            this.activedRoute.queryParams
+        ]).subscribe(([queryRouter, queryParams]) => {
+            let state;
+            state = queryRouter['state'];
+            if (state && state === 'statuspayment') {
+                state = queryParams['status'];
+            }
+            console.log('PARAMETROS STATE  -> ', state);
+            this.handlePaymentState(state, queryParams);
+        });
+        this.ecOnInit();
+    }
+    ngOnDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+        this.showHeaderFooter();
+        // this.ecOnDestroy(); // Removido si no existe en ComponentHelper
+    }
+    hideHeaderFooter() {
+        // Usar Renderer2 en lugar de jQuery para manipular el DOM
+        const header = this.document.querySelector('header');
+        const footer = this.document.querySelector('footer');
+        if (header) {
+            this.renderer.setStyle(header, 'display', 'none');
+        }
+        if (footer) {
+            this.renderer.setStyle(footer, 'display', 'none');
+        }
+    }
+    showHeaderFooter() {
+        // Restaurar la visibilidad al destruir el componente
+        const header = this.document.querySelector('header');
+        const footer = this.document.querySelector('footer');
+        if (header) {
+            this.renderer.removeStyle(header, 'display');
+        }
+        if (footer) {
+            this.renderer.removeStyle(footer, 'display');
+        }
+    }
+    handlePaymentState(state, queryParams) {
+        switch (state) {
+            case '200':
+                this.setStateInLocal('Su pago fue procesado con éxito.', 'success');
+                this.storeTotalAmount(queryParams);
+                break;
+            case 'success':
+                this.setStateInLocal('Su pago fue procesado con éxito.', state);
+                this.storeTotalAmount(queryParams);
+                break;
+            case 'pending':
+                this.setStateInLocal('Su pago fue procesado con éxito.', state);
+                break;
+            case 'failure':
+                this.setStateInLocal('Se ha cancelado el proceso de pago.', state);
+                this.storeTotalAmount(queryParams);
+                break;
+            case 'cancel':
+                this.setStateInLocal('Se ha cancelado el proceso de pago.', state);
+                break;
+            case 'ok':
+                this.setStateInSesion('Su pago fue procesado con éxito.', state);
+                break;
+            case 'challenge':
+                this.setStateInSesion('Redirigiendo a autenticación del banco emisor.', state);
+                break;
+            case 'error':
+                this.setStateInSesion('Algo no salio bien en la validación de sus datos.', state);
+                break;
+            case '0':
+                this.setStateInLocal('Se ha cancelado el proceso de pago.', 'failure');
+                break;
+            default:
+                break;
+        }
+    }
+    storeTotalAmount(queryParams) {
+        const totalAmount = queryParams['total_amount'];
+        if (totalAmount) {
+            localStorage.setItem('total_amount', totalAmount);
+        }
+    }
+    setStateInLocal = (mensaje, state) => {
+        this.message = mensaje;
+        localStorage.setItem('state', state);
+        sessionStorage.setItem('modalnews', 'false');
+    };
+    setStateInSesion = (mensaje, state) => {
+        this.message = mensaje;
+        sessionStorage.setItem('state', state);
+        localStorage.setItem('state', state);
+        sessionStorage.setItem('modalnews', 'false');
+    };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RedsysCatchEcComponent, deps: [{ token: i2.ActivatedRoute }, { token: i2.Router }, { token: CheckoutService }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RedsysCatchEcComponent, isStandalone: true, selector: "app-redsys-catch-ec", usesInheritance: true, ngImport: i0, template: "<div id=\"container\">\r\n    <div class=\"row\">\r\n        <div class=\"col align-self-center\">\r\n            <h4 class=\"titpage center-block text-center font-nexa font-lg my-3\">{{ message | uppercase }}</h4>\r\n        </div>\r\n    </div>\r\n    <div class=\"row\">\r\n        <div class=\"col align-self-center\">\r\n            <h5 class=\"center-block text-center font-nexa my-3\">Redirigiendo en segundos...</h5>\r\n            <br>\r\n            <div class=\"d-flex flex-column jusitfy-content-center align-items-center\">\r\n                <app-loading-full-ec></app-loading-full-ec>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".loader{border:16px solid #f3f3f3;border-top:16px solid #dc3545;border-radius:50%;width:50px;height:50px;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.flex-container{display:flex;justify-content:center;align-items:center;height:80vh;width:100%}.flex-container>div{width:90%;height:100px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "component", type: LoadingFullEcComponent, selector: "app-loading-full-ec" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RedsysCatchEcComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-redsys-catch-ec', standalone: true, imports: [CommonModule, LoadingFullEcComponent], template: "<div id=\"container\">\r\n    <div class=\"row\">\r\n        <div class=\"col align-self-center\">\r\n            <h4 class=\"titpage center-block text-center font-nexa font-lg my-3\">{{ message | uppercase }}</h4>\r\n        </div>\r\n    </div>\r\n    <div class=\"row\">\r\n        <div class=\"col align-self-center\">\r\n            <h5 class=\"center-block text-center font-nexa my-3\">Redirigiendo en segundos...</h5>\r\n            <br>\r\n            <div class=\"d-flex flex-column jusitfy-content-center align-items-center\">\r\n                <app-loading-full-ec></app-loading-full-ec>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".loader{border:16px solid #f3f3f3;border-top:16px solid #dc3545;border-radius:50%;width:50px;height:50px;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.flex-container{display:flex;justify-content:center;align-items:center;height:80vh;width:100%}.flex-container>div{width:90%;height:100px}\n"] }]
+        }], ctorParameters: () => [{ type: i2.ActivatedRoute }, { type: i2.Router }, { type: CheckoutService }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: Document, decorators: [{
+                    type: Inject,
+                    args: [DOCUMENT]
+                }] }] });
+
 // export * from './rating-ec/rating-ec.component';
 
 class BlockFormContactEcComponent extends BlockEcComponent {
@@ -8256,29 +8407,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: Output
             }] } });
 
-class ComponentHelper {
-    constructor() {
-        this.ecOnConstruct();
-    }
-    ecOnInit = (params = {}) => {
-    };
-    ecOnConstruct = (params = {}) => {
-    };
-    hasParams = (params, searched) => {
-        if (!params || !searched)
-            return false;
-        const q = searched.trim().toLowerCase();
-        return params.some(p => {
-            const code = p?.['code']?.toString().toLowerCase() ?? '';
-            // Primero chequeo exacto, y si no, parcial
-            return code === q || code.includes(q);
-        });
-    };
-    navigateOnRouter(router, url) {
-        router.navigateByUrl(`/${url}`);
-    }
-}
-
 class PasswordResetEcComponent extends ComponentHelper {
     authService;
     toastr;
@@ -9820,11 +9948,11 @@ class DecidirEcComponent extends ComponentHelper {
         obj.style.width = obj.contentWindow.document.body.scrollWidth + 'px';
     };
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DecidirEcComponent, deps: [{ token: i0.Renderer2 }, { token: ConnectionService }, { token: ToastService }, { token: CoreConstantsService }, { token: ApiConstantsService }, { token: CartService }, { token: i2.ActivatedRoute }, { token: i1$4.DomSanitizer }, { token: ParametersService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: DecidirEcComponent, isStandalone: true, selector: "app-decidir-ec", inputs: { paymentServiceInst: "paymentServiceInst", method: "method", total_amount: "total_amount", allData: "allData", user_data: "user_data" }, outputs: { ready: "ready" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"text-center\">\r\n    <h3>Continuar con el pago en Decidir</h3>\r\n    @if (method) {\r\n    <p class=\"px-5\">{{ method.description }}</p>\r\n    <p class=\"px-5\">{{ method.instructions }}</p>\r\n    }\r\n    @if (!loading) {\r\n        <button class=\"btn btn-outline-secondary comprar\" (click)=\"openModal()\">Pagar</button>\r\n    } @else {\r\n    <div class=\"d-flex flex-column jusitfy-content-center align-items-center mt-2\">\r\n        <app-loading-full-ec></app-loading-full-ec>\r\n    </div>\r\n    }\r\n    </div>\r\n\r\n@if (showModal) {\r\n<div class=\"modal-backdrop\" (click)=\"clickClose()\">\r\n    <div class=\"modal-dialog modal-lg\" (click)=\"$event.stopPropagation()\">\r\n        <div class=\"modal-content\">\r\n\r\n            <div class=\"modal-body\">\r\n                <div class=\"payment-container\">\r\n                   \r\n                    <!-- Iframe del formulario de decidir -->\r\n                    <div class=\"iframe-container\">\r\n                        <iframe [src]=\"url\" frameborder=\"0\" class=\"payment-iframe\"></iframe>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n}\r\n", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1050;backdrop-filter:blur(2px)}.modal-dialog{max-width:90%;max-height:90%;width:800px;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 20px 60px #0000004d;animation:modalFadeIn .3s ease-out}.modal-dialog.modal-lg{max-width:900px;width:90%}@keyframes modalFadeIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-content{display:flex;flex-direction:column;height:100%;border:none;border-radius:16px;background:#fff}.modal-header{padding:1.5rem 2rem;border-bottom:1px solid #e9ecef;background:linear-gradient(135deg,#f8f9fa,#e9ecef);display:flex;justify-content:space-between;align-items:center;position:relative}.modal-header:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,#dee2e6 50%,transparent 100%)}.modal-header .modal-title{margin:0;font-size:1.5rem;font-weight:700;color:#2c3e50;text-shadow:0 1px 2px rgba(0,0,0,.1)}.modal-header .btn-close{background:none;border:none;font-size:1.8rem;color:#6c757d;cursor:pointer;padding:0;width:35px;height:35px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .3s ease;position:relative}.modal-header .btn-close:hover{background-color:#dc3545;color:#fff;transform:rotate(90deg);box-shadow:0 4px 12px #dc35454d}.modal-header .btn-close:active{transform:rotate(90deg) scale(.95)}.modal-body{padding:0;flex:1;overflow:hidden;background:#fff}.payment-container{height:100%;display:flex;flex-direction:column;background:#fff}.cards-accepted{padding:1.5rem 2rem;text-align:center;border-bottom:1px solid #e9ecef;background:linear-gradient(135deg,#fff,#f8f9fa);position:relative}.cards-accepted:after{content:\"\";position:absolute;bottom:0;left:5%;right:5%;height:1px;background:linear-gradient(90deg,transparent 0%,#dee2e6 50%,transparent 100%)}.cards-accepted .cards-img{height:45px;max-width:100%;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1));transition:transform .2s ease}.cards-accepted .cards-img:hover{transform:scale(1.05)}.iframe-container{flex:1;padding:1.5rem;background:#fff;position:relative}.iframe-container:before{content:\"\";position:absolute;top:0;left:1.5rem;right:1.5rem;height:1px;background:linear-gradient(90deg,transparent 0%,#e9ecef 50%,transparent 100%)}.payment-iframe{width:100%;height:620px;border:none;border-radius:12px;background:#fff;box-shadow:inset 0 2px 8px #0000000d}.half-width{width:49%!important}.ml-1{margin-left:1%}#card-form{height:450px}.iframeStyle{height:520px;width:100%}@media only screen and (max-width: 1024px){.modal-dialog,.modal-dialog.modal-lg{max-width:95%;width:95%}.payment-iframe{height:650px}.modal-header{padding:1rem 1.5rem}.modal-header .modal-title{font-size:1.125rem}.cards-accepted{padding:.75rem 1.5rem}}@media only screen and (max-width: 680px){.modal-dialog{max-width:98%;width:98%;margin:1rem;max-height:calc(100vh - 2rem)}.modal-dialog.modal-lg{max-width:98%;width:98%}.payment-iframe{height:550px}.modal-header{padding:1rem}.modal-header .modal-title{font-size:1rem}.modal-header .btn-close{width:28px;height:28px;font-size:1.25rem}.cards-accepted{padding:.5rem 1rem}.cards-accepted .cards-img{height:35px}.iframe-container{padding:.5rem}}@media only screen and (max-width: 480px){.modal-dialog{margin:.5rem;max-height:calc(100vh - 1rem);border-radius:8px}.modal-content{border-radius:8px}.payment-iframe{height:500px}.cards-accepted .cards-img{height:30px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: LoadingFullEcComponent, selector: "app-loading-full-ec" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: DecidirEcComponent, isStandalone: true, selector: "app-decidir-ec", inputs: { paymentServiceInst: "paymentServiceInst", method: "method", total_amount: "total_amount", allData: "allData", user_data: "user_data" }, outputs: { ready: "ready" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"text-center\">\r\n    <h3>Continuar con el pago en Decidir</h3>\r\n    @if (method) {\r\n    <p class=\"px-5\">{{ method.description }}</p>\r\n    <p class=\"px-5\">{{ method.instructions }}</p>\r\n    }\r\n    @if (!loading) {\r\n        <button class=\"btn btn-outline-secondary comprar\" (click)=\"openModal()\">Pagar</button>\r\n    } @else {\r\n    <div class=\"d-flex flex-column jusitfy-content-center align-items-center mt-2\">\r\n        <app-loading-full-ec></app-loading-full-ec>\r\n    </div>\r\n    }\r\n    </div>\r\n\r\n@if (showModal) {\r\n<div class=\"modal-backdrop\" (click)=\"clickClose()\">\r\n    <div class=\"modal-dialog modal-lg\" (click)=\"$event.stopPropagation()\">\r\n        <div class=\"modal-content\">\r\n\r\n            <div class=\"modal-body\">\r\n                <div class=\"payment-container\">\r\n                   \r\n                    <!-- Iframe del formulario de decidir -->\r\n                    <div class=\"iframe-container\">\r\n                        <iframe [src]=\"url\" frameborder=\"0\" class=\"payment-iframe\"></iframe>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n}\r\n", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1050;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal-dialog{max-width:90%;max-height:90%;width:800px;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 20px 60px #0000004d;animation:modalFadeIn .3s ease-out}.modal-dialog.modal-lg{max-width:900px;width:90%}@keyframes modalFadeIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-content{display:flex;flex-direction:column;height:100%;border:none;border-radius:16px;background:#fff}.modal-header{padding:1.5rem 2rem;border-bottom:1px solid #e9ecef;background:linear-gradient(135deg,#f8f9fa,#e9ecef);display:flex;justify-content:space-between;align-items:center;position:relative}.modal-header:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,#dee2e6 50%,transparent 100%)}.modal-header .modal-title{margin:0;font-size:1.5rem;font-weight:700;color:#2c3e50;text-shadow:0 1px 2px rgba(0,0,0,.1)}.modal-header .btn-close{background:none;border:none;font-size:1.8rem;color:#6c757d;cursor:pointer;padding:0;width:35px;height:35px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .3s ease;position:relative}.modal-header .btn-close:hover{background-color:#dc3545;color:#fff;transform:rotate(90deg);box-shadow:0 4px 12px #dc35454d}.modal-header .btn-close:active{transform:rotate(90deg) scale(.95)}.modal-body{padding:0;flex:1;overflow:hidden;background:#fff}.payment-container{height:100%;display:flex;flex-direction:column;background:#fff}.cards-accepted{padding:1.5rem 2rem;text-align:center;border-bottom:1px solid #e9ecef;background:linear-gradient(135deg,#fff,#f8f9fa);position:relative}.cards-accepted:after{content:\"\";position:absolute;bottom:0;left:5%;right:5%;height:1px;background:linear-gradient(90deg,transparent 0%,#dee2e6 50%,transparent 100%)}.cards-accepted .cards-img{height:45px;max-width:100%;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1));transition:transform .2s ease}.cards-accepted .cards-img:hover{transform:scale(1.05)}.iframe-container{flex:1;padding:1.5rem;background:#fff;position:relative}.iframe-container:before{content:\"\";position:absolute;top:0;left:1.5rem;right:1.5rem;height:1px;background:linear-gradient(90deg,transparent 0%,#e9ecef 50%,transparent 100%)}.payment-iframe{width:100%;height:620px;border:none;border-radius:12px;background:#fff;box-shadow:inset 0 2px 8px #0000000d}.half-width{width:49%!important}.ml-1{margin-left:1%}#card-form{height:450px}.iframeStyle{height:520px;width:100%}@media only screen and (max-width: 1024px){.modal-dialog,.modal-dialog.modal-lg{max-width:95%;width:95%}.payment-iframe{height:650px}.modal-header{padding:1rem 1.5rem}.modal-header .modal-title{font-size:1.125rem}.cards-accepted{padding:.75rem 1.5rem}}@media only screen and (max-width: 680px){.modal-dialog{max-width:98%;width:98%;margin:1rem;max-height:calc(100vh - 2rem)}.modal-dialog.modal-lg{max-width:98%;width:98%}.payment-iframe{height:550px}.modal-header{padding:1rem}.modal-header .modal-title{font-size:1rem}.modal-header .btn-close{width:28px;height:28px;font-size:1.25rem}.cards-accepted{padding:.5rem 1rem}.cards-accepted .cards-img{height:35px}.iframe-container{padding:.5rem}}@media only screen and (max-width: 480px){.modal-dialog{margin:.5rem;max-height:calc(100vh - 1rem);border-radius:8px}.modal-content{border-radius:8px}.payment-iframe{height:500px}.cards-accepted .cards-img{height:30px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: LoadingFullEcComponent, selector: "app-loading-full-ec" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DecidirEcComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-decidir-ec', standalone: true, imports: [CommonModule, FormsModule, LoadingFullEcComponent], template: "<div class=\"text-center\">\r\n    <h3>Continuar con el pago en Decidir</h3>\r\n    @if (method) {\r\n    <p class=\"px-5\">{{ method.description }}</p>\r\n    <p class=\"px-5\">{{ method.instructions }}</p>\r\n    }\r\n    @if (!loading) {\r\n        <button class=\"btn btn-outline-secondary comprar\" (click)=\"openModal()\">Pagar</button>\r\n    } @else {\r\n    <div class=\"d-flex flex-column jusitfy-content-center align-items-center mt-2\">\r\n        <app-loading-full-ec></app-loading-full-ec>\r\n    </div>\r\n    }\r\n    </div>\r\n\r\n@if (showModal) {\r\n<div class=\"modal-backdrop\" (click)=\"clickClose()\">\r\n    <div class=\"modal-dialog modal-lg\" (click)=\"$event.stopPropagation()\">\r\n        <div class=\"modal-content\">\r\n\r\n            <div class=\"modal-body\">\r\n                <div class=\"payment-container\">\r\n                   \r\n                    <!-- Iframe del formulario de decidir -->\r\n                    <div class=\"iframe-container\">\r\n                        <iframe [src]=\"url\" frameborder=\"0\" class=\"payment-iframe\"></iframe>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n}\r\n", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1050;backdrop-filter:blur(2px)}.modal-dialog{max-width:90%;max-height:90%;width:800px;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 20px 60px #0000004d;animation:modalFadeIn .3s ease-out}.modal-dialog.modal-lg{max-width:900px;width:90%}@keyframes modalFadeIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-content{display:flex;flex-direction:column;height:100%;border:none;border-radius:16px;background:#fff}.modal-header{padding:1.5rem 2rem;border-bottom:1px solid #e9ecef;background:linear-gradient(135deg,#f8f9fa,#e9ecef);display:flex;justify-content:space-between;align-items:center;position:relative}.modal-header:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,#dee2e6 50%,transparent 100%)}.modal-header .modal-title{margin:0;font-size:1.5rem;font-weight:700;color:#2c3e50;text-shadow:0 1px 2px rgba(0,0,0,.1)}.modal-header .btn-close{background:none;border:none;font-size:1.8rem;color:#6c757d;cursor:pointer;padding:0;width:35px;height:35px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .3s ease;position:relative}.modal-header .btn-close:hover{background-color:#dc3545;color:#fff;transform:rotate(90deg);box-shadow:0 4px 12px #dc35454d}.modal-header .btn-close:active{transform:rotate(90deg) scale(.95)}.modal-body{padding:0;flex:1;overflow:hidden;background:#fff}.payment-container{height:100%;display:flex;flex-direction:column;background:#fff}.cards-accepted{padding:1.5rem 2rem;text-align:center;border-bottom:1px solid #e9ecef;background:linear-gradient(135deg,#fff,#f8f9fa);position:relative}.cards-accepted:after{content:\"\";position:absolute;bottom:0;left:5%;right:5%;height:1px;background:linear-gradient(90deg,transparent 0%,#dee2e6 50%,transparent 100%)}.cards-accepted .cards-img{height:45px;max-width:100%;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1));transition:transform .2s ease}.cards-accepted .cards-img:hover{transform:scale(1.05)}.iframe-container{flex:1;padding:1.5rem;background:#fff;position:relative}.iframe-container:before{content:\"\";position:absolute;top:0;left:1.5rem;right:1.5rem;height:1px;background:linear-gradient(90deg,transparent 0%,#e9ecef 50%,transparent 100%)}.payment-iframe{width:100%;height:620px;border:none;border-radius:12px;background:#fff;box-shadow:inset 0 2px 8px #0000000d}.half-width{width:49%!important}.ml-1{margin-left:1%}#card-form{height:450px}.iframeStyle{height:520px;width:100%}@media only screen and (max-width: 1024px){.modal-dialog,.modal-dialog.modal-lg{max-width:95%;width:95%}.payment-iframe{height:650px}.modal-header{padding:1rem 1.5rem}.modal-header .modal-title{font-size:1.125rem}.cards-accepted{padding:.75rem 1.5rem}}@media only screen and (max-width: 680px){.modal-dialog{max-width:98%;width:98%;margin:1rem;max-height:calc(100vh - 2rem)}.modal-dialog.modal-lg{max-width:98%;width:98%}.payment-iframe{height:550px}.modal-header{padding:1rem}.modal-header .modal-title{font-size:1rem}.modal-header .btn-close{width:28px;height:28px;font-size:1.25rem}.cards-accepted{padding:.5rem 1rem}.cards-accepted .cards-img{height:35px}.iframe-container{padding:.5rem}}@media only screen and (max-width: 480px){.modal-dialog{margin:.5rem;max-height:calc(100vh - 1rem);border-radius:8px}.modal-content{border-radius:8px}.payment-iframe{height:500px}.cards-accepted .cards-img{height:30px}}\n"] }]
+            args: [{ selector: 'app-decidir-ec', standalone: true, imports: [CommonModule, FormsModule, LoadingFullEcComponent], template: "<div class=\"text-center\">\r\n    <h3>Continuar con el pago en Decidir</h3>\r\n    @if (method) {\r\n    <p class=\"px-5\">{{ method.description }}</p>\r\n    <p class=\"px-5\">{{ method.instructions }}</p>\r\n    }\r\n    @if (!loading) {\r\n        <button class=\"btn btn-outline-secondary comprar\" (click)=\"openModal()\">Pagar</button>\r\n    } @else {\r\n    <div class=\"d-flex flex-column jusitfy-content-center align-items-center mt-2\">\r\n        <app-loading-full-ec></app-loading-full-ec>\r\n    </div>\r\n    }\r\n    </div>\r\n\r\n@if (showModal) {\r\n<div class=\"modal-backdrop\" (click)=\"clickClose()\">\r\n    <div class=\"modal-dialog modal-lg\" (click)=\"$event.stopPropagation()\">\r\n        <div class=\"modal-content\">\r\n\r\n            <div class=\"modal-body\">\r\n                <div class=\"payment-container\">\r\n                   \r\n                    <!-- Iframe del formulario de decidir -->\r\n                    <div class=\"iframe-container\">\r\n                        <iframe [src]=\"url\" frameborder=\"0\" class=\"payment-iframe\"></iframe>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n}\r\n", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1050;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal-dialog{max-width:90%;max-height:90%;width:800px;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 20px 60px #0000004d;animation:modalFadeIn .3s ease-out}.modal-dialog.modal-lg{max-width:900px;width:90%}@keyframes modalFadeIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-content{display:flex;flex-direction:column;height:100%;border:none;border-radius:16px;background:#fff}.modal-header{padding:1.5rem 2rem;border-bottom:1px solid #e9ecef;background:linear-gradient(135deg,#f8f9fa,#e9ecef);display:flex;justify-content:space-between;align-items:center;position:relative}.modal-header:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,#dee2e6 50%,transparent 100%)}.modal-header .modal-title{margin:0;font-size:1.5rem;font-weight:700;color:#2c3e50;text-shadow:0 1px 2px rgba(0,0,0,.1)}.modal-header .btn-close{background:none;border:none;font-size:1.8rem;color:#6c757d;cursor:pointer;padding:0;width:35px;height:35px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .3s ease;position:relative}.modal-header .btn-close:hover{background-color:#dc3545;color:#fff;transform:rotate(90deg);box-shadow:0 4px 12px #dc35454d}.modal-header .btn-close:active{transform:rotate(90deg) scale(.95)}.modal-body{padding:0;flex:1;overflow:hidden;background:#fff}.payment-container{height:100%;display:flex;flex-direction:column;background:#fff}.cards-accepted{padding:1.5rem 2rem;text-align:center;border-bottom:1px solid #e9ecef;background:linear-gradient(135deg,#fff,#f8f9fa);position:relative}.cards-accepted:after{content:\"\";position:absolute;bottom:0;left:5%;right:5%;height:1px;background:linear-gradient(90deg,transparent 0%,#dee2e6 50%,transparent 100%)}.cards-accepted .cards-img{height:45px;max-width:100%;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1));transition:transform .2s ease}.cards-accepted .cards-img:hover{transform:scale(1.05)}.iframe-container{flex:1;padding:1.5rem;background:#fff;position:relative}.iframe-container:before{content:\"\";position:absolute;top:0;left:1.5rem;right:1.5rem;height:1px;background:linear-gradient(90deg,transparent 0%,#e9ecef 50%,transparent 100%)}.payment-iframe{width:100%;height:620px;border:none;border-radius:12px;background:#fff;box-shadow:inset 0 2px 8px #0000000d}.half-width{width:49%!important}.ml-1{margin-left:1%}#card-form{height:450px}.iframeStyle{height:520px;width:100%}@media only screen and (max-width: 1024px){.modal-dialog,.modal-dialog.modal-lg{max-width:95%;width:95%}.payment-iframe{height:650px}.modal-header{padding:1rem 1.5rem}.modal-header .modal-title{font-size:1.125rem}.cards-accepted{padding:.75rem 1.5rem}}@media only screen and (max-width: 680px){.modal-dialog{max-width:98%;width:98%;margin:1rem;max-height:calc(100vh - 2rem)}.modal-dialog.modal-lg{max-width:98%;width:98%}.payment-iframe{height:550px}.modal-header{padding:1rem}.modal-header .modal-title{font-size:1rem}.modal-header .btn-close{width:28px;height:28px;font-size:1.25rem}.cards-accepted{padding:.5rem 1rem}.cards-accepted .cards-img{height:35px}.iframe-container{padding:.5rem}}@media only screen and (max-width: 480px){.modal-dialog{margin:.5rem;max-height:calc(100vh - 1rem);border-radius:8px}.modal-content{border-radius:8px}.payment-iframe{height:500px}.cards-accepted .cards-img{height:30px}}\n"] }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: ConnectionService }, { type: ToastService }, { type: CoreConstantsService }, { type: ApiConstantsService }, { type: CartService }, { type: i2.ActivatedRoute }, { type: i1$4.DomSanitizer }, { type: ParametersService }], propDecorators: { paymentServiceInst: [{
                 type: Input
             }], method: [{
@@ -11695,5 +11823,5 @@ const directives = [
  * 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, ContactEcComponent, CoreConstantsService, CouponEcComponent, CurrencyService, DopplerService, ENVIRONMENT_TOKEN, EcCurrencySymbolPipe, EcSafeHtmlPipe, FacebookPixelService, FaqsEcComponent, FiltersEcComponent, FiltersService, FiltersSortEcComponent, FooterEcComponent, ForgotPasswordEcComponent, FormService, GTMService, GoogleAnalyticsService, HeaderEcComponent, HomeEcComponent, LoadingFullEcComponent, LoadingInlineEcComponent, LoadingSectionEcComponent, LocalStorageService, LoginFormEcComponent, MagnizoomEcComponent, MetricoolPixelService, NgxLocalStorageService, OptionsService, OrderEcComponent, OrderUtilityService, OrdersListEcComponent, OrdersService, PaginationService, ParametersService, ParamsContext, PasswordResetEcComponent, PaymentService, PriceEcComponent, PriceRangeFilterComponent, ProductDetailEcComponent, ProductDetailService, ProductEcComponent, ProductOffDirective, ProductStockDirective, ProductsService, ReCaptchaEcComponent, ReCaptchaService, RegisterFormEcComponent, RegisterWholesalerFormEcComponent, RelatedProductsEcComponent, ReviewsEcComponent, ReviewsFormEcComponent, SectionContainerEcComponent, ShareEcComponent, ShipmentService, SidebarEcComponent, StoresEcComponent, SuccessEcComponent, TestService, ToastService, VariantsEcComponent, authGuard, authInterceptor, directives, 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, ContactEcComponent, CoreConstantsService, CouponEcComponent, CurrencyService, DopplerService, ENVIRONMENT_TOKEN, EcCurrencySymbolPipe, EcSafeHtmlPipe, FacebookPixelService, FaqsEcComponent, FiltersEcComponent, FiltersService, FiltersSortEcComponent, FooterEcComponent, ForgotPasswordEcComponent, FormService, GTMService, GoogleAnalyticsService, HeaderEcComponent, HomeEcComponent, LoadingFullEcComponent, LoadingInlineEcComponent, LoadingSectionEcComponent, LocalStorageService, LoginFormEcComponent, MagnizoomEcComponent, MetricoolPixelService, NgxLocalStorageService, OptionsService, OrderEcComponent, OrderUtilityService, OrdersListEcComponent, OrdersService, PaginationService, ParametersService, ParamsContext, PasswordResetEcComponent, PaymentService, PriceEcComponent, PriceRangeFilterComponent, ProductDetailEcComponent, ProductDetailService, ProductEcComponent, ProductOffDirective, ProductStockDirective, ProductsService, ReCaptchaEcComponent, ReCaptchaService, RedsysCatchEcComponent, RegisterFormEcComponent, RegisterWholesalerFormEcComponent, RelatedProductsEcComponent, ReviewsEcComponent, ReviewsFormEcComponent, SectionContainerEcComponent, ShareEcComponent, ShipmentService, SidebarEcComponent, StoresEcComponent, SuccessEcComponent, TestService, ToastService, VariantsEcComponent, authGuard, authInterceptor, directives, provideEnvironment };
 //# sourceMappingURL=ng-easycommerce-v18.mjs.map