ngx-dsxlibrary 1.0.0 → 1.0.1

package/fesm2022/ngx-dsx.mjs

@@ -0,0 +1,553 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, signal, Injectable, inject, Component, isDevMode, Input, input, Pipe } from '@angular/core';
+import { HttpClient, HttpHeaders, HttpParams, HttpStatusCode, HttpErrorResponse } from '@angular/common/http';
+import { throwError, catchError, switchMap, finalize, Observable } from 'rxjs';
+import { JwtHelperService } from '@auth0/angular-jwt';
+import { CookieService } from 'ngx-cookie-service';
+import { ToastrService } from 'ngx-toastr';
+import Swal from 'sweetalert2';
+import * as i1 from 'primeng/tag';
+import { TagModule } from 'primeng/tag';
+import * as i1$1 from 'ngx-countup';
+import { CountUpModule } from 'ngx-countup';
+
+const ENVIRONMENT = new InjectionToken('EnvironmentConfig');
+
+class SpinnerLoadingService {
+    // Creamos una señal para el estado de visibilidad
+    spinnerVisible = signal(false);
+    constructor() { }
+    // Método para mostrar el spinner
+    show() {
+        this.spinnerVisible.set(true);
+    }
+    // Método para ocultar el spinner
+    hide() {
+        this.spinnerVisible.set(false);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: SpinnerLoadingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: SpinnerLoadingService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: SpinnerLoadingService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
+class LoadingComponent {
+    // Accedemos directamente a la señal del servicio
+    _spinnerService = inject(SpinnerLoadingService);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.0", type: LoadingComponent, isStandalone: true, selector: "app-loading", ngImport: i0, template: "<!-- Actualizaci\u00F3n 2025-31-01 12:00 -->\r\n@if(_spinnerService.spinnerVisible()){\r\n<div class=\"spinner-overlay\">\r\n  <div class=\"loader\">\r\n    <div class=\"external-shadow\">\r\n      <div class=\"central\"></div>\r\n    </div>\r\n    <img src=\"assets/icon/secure.png\" class=\"spinner-image\" />\r\n  </div>\r\n  <p class=\"loading-text\">Desarollo Software Xela</p>\r\n</div>\r\n}\r\n", styles: ["@charset \"UTF-8\";.spinner-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000c;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:9999}.loader{display:flex;justify-content:center;align-items:center;position:relative;cursor:not-allowed;scale:.7}.central{display:flex;justify-content:center;align-items:center;position:relative;width:10em;height:10em;border-radius:50%;box-shadow:.5em 1em 1em #8a2be2,-.5em .5em 1em #00f,.5em -.5em 1em purple,-.5em -.5em 1em #0ff;background-color:#0000004d}.external-shadow{width:10em;height:10em;border-radius:50%;display:flex;justify-content:center;align-items:center;position:relative;box-shadow:.5em .5em 3em #8a2be2,-.5em .5em 3em #00f,.5em -.5em 3em purple,-.5em -.5em 3em #0ff;z-index:999;animation:rotate 3s linear infinite;background-color:#21212180}@keyframes rotate{0%{transform:rotate(0)}50%{transform:rotate(180deg)}to{transform:rotate(360deg)}}.spinner-image{width:70%;height:70%;border-radius:50%;object-fit:cover;position:absolute;z-index:1000}.loading-text{font-family:Montserrat,sans-serif;text-transform:uppercase;letter-spacing:3px;background:linear-gradient(45deg,#0ff,#f0f);-webkit-background-clip:text;background-clip:text;color:transparent}@keyframes pulse{0%,to{opacity:.7}50%{opacity:1}}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: LoadingComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-loading', imports: [], template: "<!-- Actualizaci\u00F3n 2025-31-01 12:00 -->\r\n@if(_spinnerService.spinnerVisible()){\r\n<div class=\"spinner-overlay\">\r\n  <div class=\"loader\">\r\n    <div class=\"external-shadow\">\r\n      <div class=\"central\"></div>\r\n    </div>\r\n    <img src=\"assets/icon/secure.png\" class=\"spinner-image\" />\r\n  </div>\r\n  <p class=\"loading-text\">Desarollo Software Xela</p>\r\n</div>\r\n}\r\n", styles: ["@charset \"UTF-8\";.spinner-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000c;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:9999}.loader{display:flex;justify-content:center;align-items:center;position:relative;cursor:not-allowed;scale:.7}.central{display:flex;justify-content:center;align-items:center;position:relative;width:10em;height:10em;border-radius:50%;box-shadow:.5em 1em 1em #8a2be2,-.5em .5em 1em #00f,.5em -.5em 1em purple,-.5em -.5em 1em #0ff;background-color:#0000004d}.external-shadow{width:10em;height:10em;border-radius:50%;display:flex;justify-content:center;align-items:center;position:relative;box-shadow:.5em .5em 3em #8a2be2,-.5em .5em 3em #00f,.5em -.5em 3em purple,-.5em -.5em 3em #0ff;z-index:999;animation:rotate 3s linear infinite;background-color:#21212180}@keyframes rotate{0%{transform:rotate(0)}50%{transform:rotate(180deg)}to{transform:rotate(360deg)}}.spinner-image{width:70%;height:70%;border-radius:50%;object-fit:cover;position:absolute;z-index:1000}.loading-text{font-family:Montserrat,sans-serif;text-transform:uppercase;letter-spacing:3px;background:linear-gradient(45deg,#0ff,#f0f);-webkit-background-clip:text;background-clip:text;color:transparent}@keyframes pulse{0%,to{opacity:.7}50%{opacity:1}}\n"] }]
+        }] });
+
+class AuthorizeService {
+    environment = inject(ENVIRONMENT);
+    _cookieService = inject(CookieService);
+    helperJwt = new JwtHelperService();
+    _isRefreshing = false;
+    // Función para obtener opciones de cookies estándar
+    getCookieOptions(expiryDate) {
+        const isProduction = this.environment.production;
+        const cookieOptions = {
+            path: '/',
+            expires: expiryDate,
+            secure: isProduction,
+            sameSite: isProduction ? 'None' : 'Lax', // sameSite: 'None',
+        };
+        if (isProduction) {
+            cookieOptions.domain = '.itgtxela.com';
+        }
+        return cookieOptions;
+    }
+    // Función para establecer una cookie
+    setCookie(name, value, expiryDate) {
+        const options = this.getCookieOptions(expiryDate);
+        this._cookieService.set(name, value, options);
+    }
+    get isRefreshing() {
+        return this._isRefreshing;
+    }
+    set isRefreshing(value) {
+        this._isRefreshing = value;
+    }
+    getToken() {
+        return this._cookieService.get(this.environment.tokenName);
+        //return localStorage.getItem(environment.tokenName);
+    }
+    getTokenRefresh() {
+        //USO EN MODO DESARROLLO
+        if (isDevMode()) {
+            const tokenRefresh = this._cookieService.get(this.environment.tokenNameRF);
+            const tokens = {
+                token: '',
+                tokenRefresh: '8508408a-6cbc-4ebb-b105-d851655a3b0c',
+                refreshTokenExpiry: new Date(),
+            };
+            !!tokenRefresh ? null : this.tokenReload(tokens);
+        }
+        return this._cookieService.get(this.environment.tokenNameRF);
+        //return localStorage.getItem(environment.tokenNameRF);
+    }
+    // Actualizar valores de status
+    setLastActivity() {
+        const tokenExpiryDate = new Date();
+        // Expira en 30 minutos
+        tokenExpiryDate.setMinutes(tokenExpiryDate.getMinutes() + 30);
+        this.setCookie(this.environment.sessionStatus, Date.now().toString(), tokenExpiryDate);
+    }
+    // Almacenar los tokens en cookies
+    tokenReload(tokens) {
+        const tokenExpiryDate = new Date();
+        tokenExpiryDate.setMinutes(tokenExpiryDate.getMinutes() + 30); // Access token expiry: 30 mins
+        const refreshTokenExpiryDate = new Date();
+        refreshTokenExpiryDate.setDate(refreshTokenExpiryDate.getDate() + 7); // Refresh token expiry: 7 days
+        // Guardar el access token y refresh token
+        this.setCookie(this.environment.tokenName, tokens.token, tokenExpiryDate);
+        this.setCookie(this.environment.tokenNameRF, tokens.tokenRefresh, refreshTokenExpiryDate);
+        // Guardar el estado de sesión
+        this.setLastActivity();
+        // Almacenar la fecha de expiración del refresh token en localStorage
+        const expiryDate = new Date(tokens.refreshTokenExpiry).toISOString();
+        localStorage.setItem(this.environment.refreshTokenExpiry, expiryDate);
+    }
+    getTokenValid(token) {
+        // Devuelve true si el token NO ha expirado
+        return !this.helperJwt.isTokenExpired(token);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: AuthorizeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: AuthorizeService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: AuthorizeService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class SecurityService {
+    http = inject(HttpClient);
+    environment = inject(ENVIRONMENT);
+    urlApi = `${this.environment.myAppUrl}api/authorize`;
+    tokenRefresh(refreshToken) {
+        const body = { refreshToken }; // Enviar el token en formato JSON
+        return this.http.post(`${this.urlApi}/TokenRefresh/`, body, {
+            headers: new HttpHeaders({
+                'Content-Type': 'application/json', // Asegúrate de que se está enviando como JSON
+            }),
+        });
+    }
+    getParameterSecurity(invalidCacheParam = false) {
+        const params = new HttpParams().set('invalidCacheParam', invalidCacheParam);
+        return this.http.get(`${this.urlApi}/securityParameter/`, { params });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: SecurityService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: SecurityService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: SecurityService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class AlertaService {
+    //Update: 2024-10-28 14:58  Arrendamientos
+    toastrService = inject(ToastrService);
+    /**
+     * @param {number} toastrAlign - Alineación de la alerta, por defecto 1. OPCIONES: 0. top-left  1. top-center 2. top-right 3. bottom-left 5. bottom-center 6. bottom-right
+     * @param {number} toastrType - 1. Success 2. Info 3. Warning 4. Error
+     * @param {number} toastrTimer - Tiempo de la alerta default 3000
+     * @param {string} toastrTitle - Titulo de la alerta
+     * @param {string} toastrMessage - Mensaje de la alerta
+     * @returns - Retonar una alerta toastr
+     * */
+    toastrAlerts(toastrType, toastrTitle, toastrMessage, toastrAlign = 1, toastrTimer = 3000) {
+        const alignMessage = [
+            { id: 0, align: 'toast-top-left' },
+            { id: 1, align: 'toast-top-center' },
+            { id: 2, align: 'toast-top-right' },
+            { id: 3, align: 'toast-bottom-left' },
+            { id: 4, align: 'toast-bottom-center' },
+            { id: 5, align: 'toast-bottom-right' },
+        ];
+        const valueAlign = alignMessage.find((c) => c.id == toastrAlign)?.align;
+        const toastrMethods = {
+            1: this.toastrService.success.bind(this.toastrService),
+            2: this.toastrService.info.bind(this.toastrService),
+            3: this.toastrService.warning.bind(this.toastrService),
+            4: this.toastrService.error.bind(this.toastrService),
+        };
+        const showToast = toastrMethods[toastrType];
+        if (showToast) {
+            showToast(toastrMessage, toastrTitle, {
+                enableHtml: true,
+                closeButton: true,
+                progressBar: true,
+                positionClass: valueAlign,
+                timeOut: toastrTimer,
+            });
+        }
+    }
+    alertaHtml(titleAlert, message) {
+        Swal.fire({
+            title: titleAlert,
+            imageUrl: 'assets/image/notFound01.png',
+            imageWidth: 145,
+            imageHeight: 125,
+            imageAlt: 'error 404',
+            html: `
+              <strong>ALERTA: </strong><i class='text-red-300'>${message}</i> <span class='text-blue-600'> comuniquese con el administrador. </span>
+            `,
+            showConfirmButton: false,
+            timerProgressBar: true,
+            timer: 2500,
+        });
+    }
+    alertaHtmlSuccess(titleAlert, message) {
+        Swal.fire({
+            title: titleAlert,
+            imageUrl: 'https://firebasestorage.googleapis.com/v0/b/seguridadintegrada-36204.appspot.com/o/Logos%2FSuccess.png?alt=media&token=275135d6-277e-4619-baa5-f76da95ca0eb',
+            imageWidth: 150,
+            imageHeight: 120,
+            imageAlt: 'success 200',
+            html: `
+              <strong>Alerta: </strong><b class='text-success'>${message}</b>
+            `,
+            showConfirmButton: false,
+            timerProgressBar: true,
+            timer: 2000,
+        });
+    }
+    preloadImage(icono) {
+        return new Promise((resolve, reject) => {
+            const img = new Image();
+            img.src = `assets/icon/${icono}`;
+            img.onload = () => resolve();
+            img.onerror = (err) => reject(err);
+        });
+    }
+    alertConfirm(title, text, icono) {
+        return this.preloadImage(icono).then(() => Swal.fire({
+            title: title,
+            html: text,
+            footer: '<strong>DevSoftXela</strong> 2025',
+            imageUrl: `assets/icon/${icono}`,
+            imageWidth: 150,
+            imageHeight: 150,
+            imageAlt: 'icon',
+            showCloseButton: true,
+            showCancelButton: true,
+            confirmButtonColor: '#3085d6',
+            cancelButtonColor: '#d33',
+            confirmButtonText: `<i class="fa fa-thumbs-up"></i> Aceptar!`,
+            cancelButtonText: `<i class="fa fa-thumbs-down"></i> Cancelar`,
+        }).then((result) => result.isConfirmed));
+    }
+    //notifyAlertSuccess(message: string) {
+    //  this._notyf.success({
+    //    message: message,
+    //    duration: 1500,
+    //    position: {
+    //      x: 'center',
+    //      y: 'top'
+    //    }
+    //  });
+    //}
+    toastrHttpResponse(response) {
+        const time = 3000;
+        const align = 'toast-top-center';
+        if (response.isSuccess) {
+            this.toastrService.success(response.statusMessage, response.title, {
+                enableHtml: true,
+                closeButton: true,
+                progressBar: true,
+                positionClass: align,
+                timeOut: time,
+            });
+        }
+        else {
+            this.toastrService.error(response.statusMessage, response.title, {
+                enableHtml: true,
+                closeButton: true,
+                progressBar: true,
+                positionClass: align,
+                timeOut: time,
+            });
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: AlertaService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: AlertaService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: AlertaService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class ErrorHandlerService {
+    _serviceAlerta = inject(AlertaService);
+    handleErrorResponse(error) {
+        const err = error;
+        const technicalMessage = `Error status: ${error.status}, Message: ${error.message}, URL: ${error.url}`;
+        let userMessage = 'Ha ocurrido un error inesperado.';
+        switch (error.status) {
+            case HttpStatusCode.BadRequest:
+                userMessage =
+                    'Solicitud incorrecta (400). Verifica los datos ingresados o validaciones existentes.';
+                break;
+            case HttpStatusCode.Unauthorized:
+                userMessage = 'Acceso no autorizado (401). Por favor inicia sesión.';
+                break;
+            case HttpStatusCode.Forbidden:
+                userMessage = 'No tienes permisos para realizar esta acción (403).';
+                break;
+            case HttpStatusCode.NotFound:
+                userMessage = 'No se encontró el recurso solicitado (404).';
+                break;
+            case HttpStatusCode.Conflict: // Capturar error de concurrencia
+                userMessage =
+                    'El registro fue modificado por otro usuario. Por favor, actualiza los datos antes de continuar.';
+                break;
+            case HttpStatusCode.InternalServerError:
+                userMessage =
+                    'Ocurrió un error en el servidor (500). Inténtalo más tarde.';
+                break;
+            default:
+                userMessage = 'Un error inesperado ha ocurrido.';
+                break;
+        }
+        // Mostrar mensaje para el usuario
+        this._serviceAlerta.alertaHtml('Servicios de Errores', '<i>Código:</i> ' +
+            err.status +
+            ' <i>Message:</i> ' +
+            userMessage +
+            `. (${error.error})`);
+        // Imprimir el mensaje técnico
+        if (isDevMode()) {
+            console.error(err);
+        }
+        // Retornar el error para continuar con el flujo de manejo de errores
+        return throwError(() => new Error(technicalMessage));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: ErrorHandlerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: ErrorHandlerService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: ErrorHandlerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+//Update: 2024-01-29 12:00
+let _activeRequest = 0;
+//let isRefreshing = false; // Estado de si se está refrescando el token
+let pendingRequests = []; // Cola de solicitudes pendientes
+const httpAuthorizeInterceptor = (req, next) => {
+    //console.log('------ INGRESO A HTTPINTERCEPTOR -------');
+    const _authorizeService = inject(AuthorizeService);
+    const _securityService = inject(SecurityService);
+    const _spinnerService = inject(SpinnerLoadingService);
+    const _handleErrorService = inject(ErrorHandlerService);
+    //Variables
+    const _token = _authorizeService.getToken();
+    const _tokenRefresh = _authorizeService.getTokenRefresh();
+    //Generar la petición con el token
+    const authReq = req.clone({
+        setHeaders: {
+            Authorization: `Bearer ${_token}`,
+        },
+    });
+    if (_activeRequest == 0) {
+        _spinnerService.show();
+    }
+    _activeRequest++;
+    return next(authReq).pipe(catchError((error) => {
+        // Si el error es 401
+        if (error.status === HttpStatusCode.Unauthorized) {
+            // Si no hay refreshToken, finalizar la sesión
+            if (!_tokenRefresh) {
+                _spinnerService.hide();
+                return _handleErrorService.handleErrorResponse(new HttpErrorResponse({
+                    status: 401,
+                    statusText: 'No autorizado. El token de refresco no está disponible.',
+                }));
+            }
+            // Intentar refrescar el token si no se está haciendo ya
+            if (!_authorizeService.isRefreshing) {
+                // Marcamos que se está refrescando el token
+                _authorizeService.isRefreshing = true;
+                // Intentar refrescar el token
+                return _securityService.tokenRefresh(_tokenRefresh).pipe(switchMap((response) => {
+                    if (!response.token || !response.tokenRefresh) {
+                        _spinnerService.hide();
+                        return _handleErrorService.handleErrorResponse(new HttpErrorResponse({
+                            status: 401,
+                            statusText: 'No autorizado. El token de refresco ha expirado.',
+                        }));
+                    }
+                    // Recargar el token en el servicio
+                    _authorizeService.tokenReload(response);
+                    // Generar una nueva solicitud con el token actualizado
+                    const newReq = req.clone({
+                        setHeaders: {
+                            Authorization: `Bearer ${response.token}`,
+                        },
+                    });
+                    // Refresco completado
+                    _authorizeService.isRefreshing = false;
+                    pendingRequests.forEach((pendingReq) => {
+                        const clonedReq = pendingReq.authReq.clone({
+                            setHeaders: {
+                                Authorization: `Bearer ${_authorizeService.getToken()}`,
+                            },
+                        });
+                        // Volver a ejecutar las solicitudes pendientes con el nuevo token
+                        next(clonedReq).subscribe({
+                            next: pendingReq.next,
+                            error: pendingReq.error,
+                            complete: pendingReq.complete,
+                        });
+                    });
+                    pendingRequests = []; // Limpiar la cola
+                    return next(newReq); // Procesar la solicitud original con el nuevo token
+                }), catchError((refreshError) => {
+                    // Finalizamos el refresco si hay error
+                    _authorizeService.isRefreshing = false;
+                    _spinnerService.hide();
+                    return _handleErrorService.handleErrorResponse(new HttpErrorResponse({
+                        status: 401,
+                        statusText: 'Error al refrescar el token. Redirigiendo al login.',
+                    }));
+                }), finalize(() => {
+                    _authorizeService.isRefreshing = false;
+                }));
+            }
+            else {
+                // Si ya se está refrescando, añadir la solicitud a la cola
+                return new Observable((observer) => {
+                    pendingRequests.push({
+                        authReq,
+                        next: observer.next.bind(observer),
+                        error: observer.error.bind(observer),
+                        complete: observer.complete.bind(observer),
+                    });
+                });
+            }
+        }
+        // Si no es un error 401, manejar otros errores
+        return _handleErrorService.handleErrorResponse(error);
+    }), finalize(() => {
+        _activeRequest--;
+        if (_activeRequest === 0) {
+            _spinnerService.hide();
+        }
+    }));
+};
+
+class AppMessageErrorComponent {
+    // Control de formulario que se pasa como input
+    control;
+    form = null;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: AppMessageErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.0", type: AppMessageErrorComponent, isStandalone: true, selector: "app-message-error", inputs: { control: "control", form: "form" }, ngImport: i0, template: "@if(control?.touched && control?.invalid){\r\n<div class=\"absolute dsx-error-message\">\r\n  @if(control?.errors?.['required']){ El campo <strong>es requerido.</strong>\r\n  } @else if(control?.errors?.['invalidDateRange']){\r\n  <strong>{{ control?.errors?.['invalidDateRange']?.message }}</strong\r\n  >. } @else if(control?.errors?.['dateNotRange']){\r\n  <strong>{{ control?.errors?.['dateNotRange']?.message }}</strong\r\n  >. } @else if(control?.errors?.['minlength']){ Debe tener al menos\r\n  <strong>{{ control?.errors?.['minlength']?.requiredLength }}</strong>\r\n  caracteres. } @else if(control?.errors?.['maxlength']){ Debe tener como m\u00E1ximo\r\n  <strong>{{ control?.errors?.['maxlength']?.requiredLength }}</strong>\r\n  caracteres. } @else if(control?.errors?.['min']){ El valor m\u00EDnimo permitido es\r\n  <strong>{{ control?.errors?.['min']?.min }}</strong\r\n  >. } @else if(control?.errors?.['max']){ El valor m\u00E1ximo permitido es\r\n  <strong>{{ control?.errors?.['max']?.max }}</strong\r\n  >. } @else if(control?.errors?.['email']){ Debe ser una direcci\u00F3n de correo\r\n  v\u00E1lida. } @else if(control?.errors?.['pattern']){ El campo no tiene el formato\r\n  requerido. } @else{ Existe un error a\u00FAn no identificado. }\r\n</div>\r\n}\r\n<!-- mensaje para formulario en general -->\r\n@if(form?.invalid && form?.touched){\r\n<div class=\"mt-2 mb-2\">\r\n  @if(this.form?.errors?.['atLeastOneRequired']){\r\n  <p-tag severity=\"danger\" [rounded]=\"true\">\r\n    {{ form?.getError(\"atLeastOneRequired\")?.message }}</p-tag\r\n  >\r\n  }\r\n</div>\r\n}\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TagModule }, { kind: "component", type: i1.Tag, selector: "p-tag", inputs: ["style", "styleClass", "severity", "value", "icon", "rounded"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: AppMessageErrorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-message-error', imports: [TagModule], template: "@if(control?.touched && control?.invalid){\r\n<div class=\"absolute dsx-error-message\">\r\n  @if(control?.errors?.['required']){ El campo <strong>es requerido.</strong>\r\n  } @else if(control?.errors?.['invalidDateRange']){\r\n  <strong>{{ control?.errors?.['invalidDateRange']?.message }}</strong\r\n  >. } @else if(control?.errors?.['dateNotRange']){\r\n  <strong>{{ control?.errors?.['dateNotRange']?.message }}</strong\r\n  >. } @else if(control?.errors?.['minlength']){ Debe tener al menos\r\n  <strong>{{ control?.errors?.['minlength']?.requiredLength }}</strong>\r\n  caracteres. } @else if(control?.errors?.['maxlength']){ Debe tener como m\u00E1ximo\r\n  <strong>{{ control?.errors?.['maxlength']?.requiredLength }}</strong>\r\n  caracteres. } @else if(control?.errors?.['min']){ El valor m\u00EDnimo permitido es\r\n  <strong>{{ control?.errors?.['min']?.min }}</strong\r\n  >. } @else if(control?.errors?.['max']){ El valor m\u00E1ximo permitido es\r\n  <strong>{{ control?.errors?.['max']?.max }}</strong\r\n  >. } @else if(control?.errors?.['email']){ Debe ser una direcci\u00F3n de correo\r\n  v\u00E1lida. } @else if(control?.errors?.['pattern']){ El campo no tiene el formato\r\n  requerido. } @else{ Existe un error a\u00FAn no identificado. }\r\n</div>\r\n}\r\n<!-- mensaje para formulario en general -->\r\n@if(form?.invalid && form?.touched){\r\n<div class=\"mt-2 mb-2\">\r\n  @if(this.form?.errors?.['atLeastOneRequired']){\r\n  <p-tag severity=\"danger\" [rounded]=\"true\">\r\n    {{ form?.getError(\"atLeastOneRequired\")?.message }}</p-tag\r\n  >\r\n  }\r\n</div>\r\n}\r\n" }]
+        }], propDecorators: { control: [{
+                type: Input
+            }], form: [{
+                type: Input
+            }] } });
+
+class KpicardComponent {
+    //type = input.required<string>();
+    option = input.required();
+    label = input.required();
+    iconType = input('fa-regular fa-bell');
+    color = input();
+    valor = input(0);
+    theme = input('light');
+    options = {
+        currency: {
+            startVal: 0,
+            duration: 0.5,
+            prefix: 'Q',
+            decimalPlaces: 2, // Decimales
+            useGrouping: true, // Separador de miles
+            separator: ',', // Carácter separador
+            decimal: '.', // Carácter decimal
+            suffix: ' GTQ', // Sufijo
+            scrollSpyDelay: 200, // Retardo antes de la animación
+            enableScrollSpy: true,
+            scrollSpyOnce: true,
+        },
+        integer: {
+            startVal: 0,
+            duration: 0.5,
+            prefix: 'Cant. ',
+            decimalPlaces: 2, // Decimales
+            useGrouping: true, // Separador de miles
+            separator: ',', // Carácter separador
+            decimal: '.', // Carácter decimal
+            scrollSpyDelay: 200, // Retardo antes de la animación
+            enableScrollSpy: true,
+            scrollSpyOnce: true,
+        },
+    };
+    // ✅ Método auxiliar para obtener la opción con seguridad
+    getSelectedOption() {
+        return this.options[this.option()] ?? this.options.currency; // Si no existe, usa `currency`
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: KpicardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.0", type: KpicardComponent, isStandalone: true, selector: "app-kpicard", inputs: { option: { classPropertyName: "option", publicName: "option", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, iconType: { classPropertyName: "iconType", publicName: "iconType", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, valor: { classPropertyName: "valor", publicName: "valor", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"kpi-card {{ color() }}\">\r\n  <span\r\n    [countUp]=\"valor()\"\r\n    [options]=\"getSelectedOption()\"\r\n    [class]=\"theme() === 'light' ? 'card-value-light' : 'card-value-dark'\"\r\n    >0</span\r\n  >\r\n  <span [class]=\"theme() === 'light' ? 'card-text-light' : 'card-text-dark'\">{{\r\n    label()\r\n  }}</span>\r\n  <i\r\n    [class]=\"\r\n      theme() === 'light'\r\n        ? iconType() + ' icon icon-light'\r\n        : iconType() + ' icon icon-dark'\r\n    \"\r\n  ></i>\r\n</div>\r\n", styles: [".icon{float:right;font-size:500%;position:absolute;top:0rem;right:-.3rem;opacity:.2}.icon-light{color:#000}.icon-dark{color:#fff}#container{width:1200px;display:flex}.grey-dark{background:#495057;color:#efefef}.red-gradient{background:linear-gradient(180deg,#cf5252,#790909 80%);color:#fff}.red{background:#a83b3b;color:#fff}.purple{background:#886ab5;color:#fff}.orange{background:#ffc241;color:#fff}.kpi-card{overflow:hidden;position:relative;box-shadow:1px 1px 3px #000000bf;display:inline-block;float:left;padding:1em;border-radius:.3em;font-family:sans-serif;width:240px;min-width:180px;margin-left:.5em;margin-top:.5em}.card-value-light{display:block;font-size:200%;font-weight:bolder;background:linear-gradient(45deg,#00fffc,#a200ff,#0094ff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 5px rgba(0,255,252,.3),0 0 10px rgba(162,0,255,.2),0 0 15px rgba(0,148,255,.1)}.card-value-dark{display:block;font-size:200%;font-weight:bolder;background:linear-gradient(45deg,#ff7e5f,#feb47b,#ff6a00);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 5px rgba(255,126,95,.5),0 0 10px rgba(254,180,123,.4),0 0 15px rgba(255,106,0,.3)}.card-text-light{display:block;font-family:Orbitron,sans-serif;font-size:90%;padding-left:.2em;color:#495057}.card-text-dark{display:block;font-family:Orbitron,sans-serif;font-size:90%;padding-left:.2em;color:#d5d7d8}\n"], dependencies: [{ kind: "ngmodule", type: CountUpModule }, { kind: "directive", type: i1$1.CountUpDirective, selector: "[countUp]", inputs: ["countUp", "options", "reanimateOnClick"], outputs: ["complete"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: KpicardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-kpicard', imports: [CountUpModule], template: "<div class=\"kpi-card {{ color() }}\">\r\n  <span\r\n    [countUp]=\"valor()\"\r\n    [options]=\"getSelectedOption()\"\r\n    [class]=\"theme() === 'light' ? 'card-value-light' : 'card-value-dark'\"\r\n    >0</span\r\n  >\r\n  <span [class]=\"theme() === 'light' ? 'card-text-light' : 'card-text-dark'\">{{\r\n    label()\r\n  }}</span>\r\n  <i\r\n    [class]=\"\r\n      theme() === 'light'\r\n        ? iconType() + ' icon icon-light'\r\n        : iconType() + ' icon icon-dark'\r\n    \"\r\n  ></i>\r\n</div>\r\n", styles: [".icon{float:right;font-size:500%;position:absolute;top:0rem;right:-.3rem;opacity:.2}.icon-light{color:#000}.icon-dark{color:#fff}#container{width:1200px;display:flex}.grey-dark{background:#495057;color:#efefef}.red-gradient{background:linear-gradient(180deg,#cf5252,#790909 80%);color:#fff}.red{background:#a83b3b;color:#fff}.purple{background:#886ab5;color:#fff}.orange{background:#ffc241;color:#fff}.kpi-card{overflow:hidden;position:relative;box-shadow:1px 1px 3px #000000bf;display:inline-block;float:left;padding:1em;border-radius:.3em;font-family:sans-serif;width:240px;min-width:180px;margin-left:.5em;margin-top:.5em}.card-value-light{display:block;font-size:200%;font-weight:bolder;background:linear-gradient(45deg,#00fffc,#a200ff,#0094ff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 5px rgba(0,255,252,.3),0 0 10px rgba(162,0,255,.2),0 0 15px rgba(0,148,255,.1)}.card-value-dark{display:block;font-size:200%;font-weight:bolder;background:linear-gradient(45deg,#ff7e5f,#feb47b,#ff6a00);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 5px rgba(255,126,95,.5),0 0 10px rgba(254,180,123,.4),0 0 15px rgba(255,106,0,.3)}.card-text-light{display:block;font-family:Orbitron,sans-serif;font-size:90%;padding-left:.2em;color:#495057}.card-text-dark{display:block;font-family:Orbitron,sans-serif;font-size:90%;padding-left:.2em;color:#d5d7d8}\n"] }]
+        }] });
+
+class JsonHighlightPipe {
+    transform(value) {
+        if (!value) {
+            return '';
+        }
+        const json = JSON.stringify(value, null, 2); // Formatea el JSON con sangría
+        // Aplica estilo y colores básicos para diferenciar claves y valores
+        return json
+            .replace(/&/g, '&amp;')
+            .replace(/</g, '&lt;')
+            .replace(/>/g, '&gt;')
+            .replace(/(".*?"):/g, '<span class="json-key">$1</span>:')
+            .replace(/:\s(".*?")/g, ': <span class="json-string">$1</span>')
+            .replace(/\b(true|false|null)\b/g, '<span class="json-boolean">$1</span>')
+            .replace(/:\s(\d+)/g, ': <span class="json-number">$1</span>');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: JsonHighlightPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.0", ngImport: i0, type: JsonHighlightPipe, isStandalone: true, name: "jsonHighlight" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.0", ngImport: i0, type: JsonHighlightPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'jsonHighlight',
+                }]
+        }] });
+
+/*
+ * Public API Surface of ngx-dsx
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AlertaService, AppMessageErrorComponent, AuthorizeService, ENVIRONMENT, JsonHighlightPipe, KpicardComponent, LoadingComponent, SecurityService, httpAuthorizeInterceptor };
+//# sourceMappingURL=ngx-dsx.mjs.map