valtech-components 2.0.929 → 2.0.931

package/esm2022/lib/version.mjs

@@ -2,5 +2,5 @@
  * Current version of valtech-components.
  * This is automatically updated during the publish process.
  */
-export const VERSION = '2.0.929';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmVyc2lvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9saWIvdmVyc2lvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7O0dBR0c7QUFDSCxNQUFNLENBQUMsTUFBTSxPQUFPLEdBQUcsU0FBUyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDdXJyZW50IHZlcnNpb24gb2YgdmFsdGVjaC1jb21wb25lbnRzLlxuICogVGhpcyBpcyBhdXRvbWF0aWNhbGx5IHVwZGF0ZWQgZHVyaW5nIHRoZSBwdWJsaXNoIHByb2Nlc3MuXG4gKi9cbmV4cG9ydCBjb25zdCBWRVJTSU9OID0gJzIuMC45MjknO1xuIl19
+export const VERSION = '2.0.931';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmVyc2lvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9saWIvdmVyc2lvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7O0dBR0c7QUFDSCxNQUFNLENBQUMsTUFBTSxPQUFPLEdBQUcsU0FBUyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDdXJyZW50IHZlcnNpb24gb2YgdmFsdGVjaC1jb21wb25lbnRzLlxuICogVGhpcyBpcyBhdXRvbWF0aWNhbGx5IHVwZGF0ZWQgZHVyaW5nIHRoZSBwdWJsaXNoIHByb2Nlc3MuXG4gKi9cbmV4cG9ydCBjb25zdCBWRVJTSU9OID0gJzIuMC45MzEnO1xuIl19

package/fesm2022/valtech-components.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, InjectionToken, makeEnvironmentProviders, APP_INITIALIZER, ErrorHandler, Injectable, DestroyRef, Inject, signal, computed, PLATFORM_ID, isDevMode, Optional, runInInjectionContext, effect, Pipe, TemplateRef, ViewContainerRef, input, Directive, EventEmitter, Component, Input, Output, ChangeDetectionStrategy, HostBinding, HostListener, ViewChild, ChangeDetectorRef, ContentChild, output, Injector, isSignal, ElementRef, ViewEncapsulation } from '@angular/core';
+import { inject, InjectionToken, makeEnvironmentProviders, APP_INITIALIZER, ErrorHandler, Injectable, DestroyRef, Inject, signal, computed, PLATFORM_ID, isDevMode, Optional, runInInjectionContext, effect, Pipe, TemplateRef, ViewContainerRef, input, Directive, EventEmitter, Component, Input, Output, ChangeDetectionStrategy, HostBinding, HostListener, NgZone, ViewChild, ChangeDetectorRef, ContentChild, output, Injector, isSignal, ElementRef, ViewEncapsulation } from '@angular/core';
 import { BehaviorSubject, throwError, Subject, map, distinctUntilChanged, filter as filter$1, take as take$1, firstValueFrom, of, from, EMPTY, Observable, interval, debounceTime, switchMap as switchMap$1, catchError as catchError$1, takeUntil, isObservable, shareReplay, race, timer } from 'rxjs';
 import { catchError, switchMap, finalize, filter, take, map as map$1, tap, retry, timeout, debounceTime as debounceTime$1, takeUntil as takeUntil$1 } from 'rxjs/operators';
 import * as i1$3 from '@angular/common/http';
@@ -54,7 +54,7 @@ import 'prismjs/components/prism-json';
  * Current version of valtech-components.
  * This is automatically updated during the publish process.
  */
-const VERSION = '2.0.929';
+const VERSION = '2.0.931';
 
 // Control de estado de refresco (singleton a nivel de módulo)
 let isRefreshing = false;
@@ -8081,6 +8081,13 @@ class AuthService {
                 // cualquier listener Firestore (ej. el inbox de notificaciones) cuelga.
                 // Fire-and-forget: NO debe demorar el resolve de initialize().
                 void this.ensureFirebaseSessionOnBootstrap();
+                // 5. Listener RBAC Firestore — re-establecer tras reload de página.
+                // handleSuccessfulAuth lo configura en el login inicial, pero no sobrevive
+                // recargas: initialize() restaura el state desde storage pero no el listener.
+                // setupFirestoreRBACSync espera internamente a que Firebase Auth esté lista.
+                if (claims?.uid) {
+                    this.setupFirestoreRBACSync(claims.uid);
+                }
             }
             else if (storedState.refreshToken) {
                 // 4. Token expirado pero hay refresh token.
@@ -8107,6 +8114,9 @@ class AuthService {
                     if (expiredClaims.org) {
                         this.stateService.updateActiveOrg(expiredClaims.org);
                     }
+                    if (expiredClaims.uid) {
+                        this.setupFirestoreRBACSync(expiredClaims.uid);
+                    }
                 }
                 // Refresh en segundo plano — NO se hace await: initialize() resuelve ya.
                 firstValueFrom(this.refreshAccessToken()).catch(() => {
@@ -8854,6 +8864,20 @@ class AuthService {
         if (!this.config?.enableFirestoreRBAC || !this.firestoreInstance)
             return;
         this.teardownFirestoreRBACSync();
+        if (!this.firebaseService || this.firebaseService.firebaseAuthReady()) {
+            // Firebase not used or already authenticated — attach listener now.
+            this._attachFirestoreRBACListener(userId);
+        }
+        else {
+            // Firebase Auth not ready yet. Firestore permission-denied errors terminate
+            // onSnapshot permanently (no automatic retry when auth state changes).
+            // Wait until the user is authenticated, then attach.
+            this.firebaseService.firebaseAuthReady$
+                .pipe(filter(ready => ready), take(1))
+                .subscribe(() => this._attachFirestoreRBACListener(userId));
+        }
+    }
+    _attachFirestoreRBACListener(userId) {
         const docRef = doc(this.firestoreInstance, 'users', userId);
         this.firestoreRBACUnsubscribe = onSnapshot(docRef, snap => {
             const rbac = snap.data()?.['rbac'];
@@ -14341,6 +14365,7 @@ class PatternComponent {
     }
     constructor() {
         this.sanitizer = inject(DomSanitizer);
+        this.ngZone = inject(NgZone);
         this.cols = signal(12);
         this.rows = signal(4);
         this.seed = signal(this.randomSeed());
@@ -14391,6 +14416,8 @@ class PatternComponent {
         // con un seed nuevo. Visualmente: el patrón cambia de vez en cuando.
         // Si `tilesPerTick > 0` y < total tiles, hace staggered (reemplaza solo
         // N tiles en vez de toda la grid). Default tilesPerTick=0 → reseed total.
+        // El setInterval corre FUERA de Zone.js para no disparar un CD completo
+        // de toda la app en cada tick — solo val-pattern se actualiza vía señales.
         effect(onCleanup => {
             const isAnimated = this.animated();
             const interval = this.reshuffleInterval();
@@ -14400,14 +14427,16 @@ class PatternComponent {
             this.timer = undefined;
             if (!isAnimated)
                 return;
-            this.timer = setInterval(() => {
-                if (perTick > 0) {
-                    this.mutateRandomTiles(perTick);
-                }
-                else {
-                    this.seed.set(this.randomSeed());
-                }
-            }, interval);
+            this.ngZone.runOutsideAngular(() => {
+                this.timer = setInterval(() => {
+                    if (perTick > 0) {
+                        this.mutateRandomTiles(perTick);
+                    }
+                    else {
+                        this.seed.set(this.randomSeed());
+                    }
+                }, interval);
+            });
             onCleanup(() => {
                 if (this.timer) {
                     clearInterval(this.timer);
@@ -31641,7 +31670,7 @@ class ChangeEmailModalComponent {
         this.toast.show({ message, duration: 3500 });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChangeEmailModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ChangeEmailModalComponent, isStandalone: true, selector: "val-change-email-modal", inputs: { isOpen: "isOpen" }, outputs: { changed: "changed", dismissed: "dismissed" }, ngImport: i0, template: "<ion-modal [isOpen]=\"isOpen\" (didDismiss)=\"close()\">\n  <ng-template>\n    <ion-header>\n      <ion-toolbar>\n        <ion-buttons slot=\"end\">\n          <ion-button fill=\"clear\" color=\"dark\" (click)=\"close()\">\n            <strong>{{ t('close') }}</strong>\n          </ion-button>\n        </ion-buttons>\n      </ion-toolbar>\n    </ion-header>\n    <ion-content class=\"ion-padding\">\n      <section class=\"modal-form-section\">\n        @if (_step() === 'loading') {\n        <div class=\"modal-loading\">\n          <ion-spinner name=\"crescent\"></ion-spinner>\n        </div>\n        } @else if (_step() === 'no-password') {\n        <val-display [props]=\"{ content: noPasswordTitle(), size: 'small', color: 'dark' }\" />\n        <val-text [props]=\"{ content: noPasswordHint(), size: 'medium', color: 'medium', bold: false }\" />\n        <ion-button expand=\"block\" fill=\"solid\" color=\"dark\" (click)=\"close()\">\n          <strong>{{ t('close') }}</strong>\n        </ion-button>\n        } @else if (_step() === 'step1') {\n        <val-form [props]=\"step1Props()\" (onSubmit)=\"handleStep1($event)\" />\n        } @else if (_step() === 'step2') {\n        <val-form [props]=\"step2Props()\" (onSubmit)=\"handleStep2($event)\" />\n        } @else if (_step() === 'step3') {\n        <val-form [props]=\"step3Props()\" (onSubmit)=\"handleStep3($event)\" />\n        }\n      </section>\n    </ion-content>\n  </ng-template>\n</ion-modal>\n", styles: [".modal-form-section{display:flex;flex-direction:column;gap:16px;max-width:420px;margin:0 auto;padding-top:8px}.modal-loading{display:flex;justify-content:center;padding:40px 0}\n"], dependencies: [{ kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: IonModal, selector: "ion-modal" }, { kind: "component", type: IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: FormComponent, selector: "val-form", inputs: ["props"], outputs: ["onSubmit", "onInvalid", "onSelectChange"] }, { kind: "component", type: DisplayComponent, selector: "val-display", inputs: ["props"] }, { kind: "component", type: TextComponent, selector: "val-text", inputs: ["props"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ChangeEmailModalComponent, isStandalone: true, selector: "val-change-email-modal", inputs: { isOpen: "isOpen" }, outputs: { changed: "changed", dismissed: "dismissed" }, ngImport: i0, template: "<ion-modal [isOpen]=\"isOpen\" (didDismiss)=\"close()\">\n  <ng-template>\n    <ion-header>\n      <ion-toolbar>\n        <ion-buttons slot=\"end\">\n          <ion-button fill=\"clear\" color=\"dark\" (click)=\"close()\">\n            <strong>{{ t('close') }}</strong>\n          </ion-button>\n        </ion-buttons>\n      </ion-toolbar>\n    </ion-header>\n    <ion-content class=\"ion-padding\">\n      <section class=\"modal-form-section\">\n        @if (_step() === 'loading') {\n        <div class=\"modal-loading\">\n          <ion-spinner name=\"crescent\"></ion-spinner>\n        </div>\n        } @else if (_step() === 'no-password') {\n        <val-display [props]=\"{ content: noPasswordTitle(), size: 'small', color: 'dark' }\" />\n        <val-title [props]=\"{ content: noPasswordHint(), size: 'large', color: 'dark', bold: false }\" />\n        <ion-button expand=\"block\" fill=\"solid\" color=\"dark\" (click)=\"close()\">\n          <strong>{{ t('close') }}</strong>\n        </ion-button>\n        } @else if (_step() === 'step1') {\n        <val-form [props]=\"step1Props()\" (onSubmit)=\"handleStep1($event)\" />\n        } @else if (_step() === 'step2') {\n        <val-form [props]=\"step2Props()\" (onSubmit)=\"handleStep2($event)\" />\n        } @else if (_step() === 'step3') {\n        <val-form [props]=\"step3Props()\" (onSubmit)=\"handleStep3($event)\" />\n        }\n      </section>\n    </ion-content>\n  </ng-template>\n</ion-modal>\n", styles: [".modal-form-section{display:flex;flex-direction:column;gap:16px;max-width:420px;margin:0 auto;padding-top:8px}.modal-loading{display:flex;justify-content:center;padding:40px 0}\n"], dependencies: [{ kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: IonModal, selector: "ion-modal" }, { kind: "component", type: IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: FormComponent, selector: "val-form", inputs: ["props"], outputs: ["onSubmit", "onInvalid", "onSelectChange"] }, { kind: "component", type: DisplayComponent, selector: "val-display", inputs: ["props"] }, { kind: "component", type: TitleComponent, selector: "val-title", inputs: ["props"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChangeEmailModalComponent, decorators: [{
             type: Component,
@@ -31656,7 +31685,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         FormComponent,
                         DisplayComponent,
                         TextComponent,
-                    ], template: "<ion-modal [isOpen]=\"isOpen\" (didDismiss)=\"close()\">\n  <ng-template>\n    <ion-header>\n      <ion-toolbar>\n        <ion-buttons slot=\"end\">\n          <ion-button fill=\"clear\" color=\"dark\" (click)=\"close()\">\n            <strong>{{ t('close') }}</strong>\n          </ion-button>\n        </ion-buttons>\n      </ion-toolbar>\n    </ion-header>\n    <ion-content class=\"ion-padding\">\n      <section class=\"modal-form-section\">\n        @if (_step() === 'loading') {\n        <div class=\"modal-loading\">\n          <ion-spinner name=\"crescent\"></ion-spinner>\n        </div>\n        } @else if (_step() === 'no-password') {\n        <val-display [props]=\"{ content: noPasswordTitle(), size: 'small', color: 'dark' }\" />\n        <val-text [props]=\"{ content: noPasswordHint(), size: 'medium', color: 'medium', bold: false }\" />\n        <ion-button expand=\"block\" fill=\"solid\" color=\"dark\" (click)=\"close()\">\n          <strong>{{ t('close') }}</strong>\n        </ion-button>\n        } @else if (_step() === 'step1') {\n        <val-form [props]=\"step1Props()\" (onSubmit)=\"handleStep1($event)\" />\n        } @else if (_step() === 'step2') {\n        <val-form [props]=\"step2Props()\" (onSubmit)=\"handleStep2($event)\" />\n        } @else if (_step() === 'step3') {\n        <val-form [props]=\"step3Props()\" (onSubmit)=\"handleStep3($event)\" />\n        }\n      </section>\n    </ion-content>\n  </ng-template>\n</ion-modal>\n", styles: [".modal-form-section{display:flex;flex-direction:column;gap:16px;max-width:420px;margin:0 auto;padding-top:8px}.modal-loading{display:flex;justify-content:center;padding:40px 0}\n"] }]
+                        TitleComponent,
+                    ], template: "<ion-modal [isOpen]=\"isOpen\" (didDismiss)=\"close()\">\n  <ng-template>\n    <ion-header>\n      <ion-toolbar>\n        <ion-buttons slot=\"end\">\n          <ion-button fill=\"clear\" color=\"dark\" (click)=\"close()\">\n            <strong>{{ t('close') }}</strong>\n          </ion-button>\n        </ion-buttons>\n      </ion-toolbar>\n    </ion-header>\n    <ion-content class=\"ion-padding\">\n      <section class=\"modal-form-section\">\n        @if (_step() === 'loading') {\n        <div class=\"modal-loading\">\n          <ion-spinner name=\"crescent\"></ion-spinner>\n        </div>\n        } @else if (_step() === 'no-password') {\n        <val-display [props]=\"{ content: noPasswordTitle(), size: 'small', color: 'dark' }\" />\n        <val-title [props]=\"{ content: noPasswordHint(), size: 'large', color: 'dark', bold: false }\" />\n        <ion-button expand=\"block\" fill=\"solid\" color=\"dark\" (click)=\"close()\">\n          <strong>{{ t('close') }}</strong>\n        </ion-button>\n        } @else if (_step() === 'step1') {\n        <val-form [props]=\"step1Props()\" (onSubmit)=\"handleStep1($event)\" />\n        } @else if (_step() === 'step2') {\n        <val-form [props]=\"step2Props()\" (onSubmit)=\"handleStep2($event)\" />\n        } @else if (_step() === 'step3') {\n        <val-form [props]=\"step3Props()\" (onSubmit)=\"handleStep3($event)\" />\n        }\n      </section>\n    </ion-content>\n  </ng-template>\n</ion-modal>\n", styles: [".modal-form-section{display:flex;flex-direction:column;gap:16px;max-width:420px;margin:0 auto;padding-top:8px}.modal-loading{display:flex;justify-content:center;padding:40px 0}\n"] }]
         }], propDecorators: { isOpen: [{
                 type: Input
             }], changed: [{