valtech-components 2.0.995 → 2.0.997

package/fesm2022/valtech-components.mjs

@@ -1,6 +1,6 @@
 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, NgZone, ViewChild, ChangeDetectorRef, output, ContentChild, ElementRef, viewChild, untracked, Injector, isSignal, 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, race, timer, shareReplay, forkJoin } from 'rxjs';
+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, race, timer, forkJoin, shareReplay } from 'rxjs';
 import { catchError, switchMap, finalize, filter, take, map as map$1, tap, distinctUntilChanged as distinctUntilChanged$1, retry, timeout, debounceTime as debounceTime$1, takeUntil as takeUntil$1 } from 'rxjs/operators';
 import * as i1$3 from '@angular/common/http';
 import { provideHttpClient, withInterceptors, HttpClient, HttpErrorResponse } 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.995';
+const VERSION = '2.0.997';
 
 // Control de estado de refresco (singleton a nivel de módulo)
 let isRefreshing = false;
@@ -8658,19 +8658,6 @@ class AuthService {
             .post(`${this.baseUrl}/reset-password`, request)
             .pipe(catchError(error => this.handleAuthError(error)));
     }
-    /**
-     * Activa una cuenta pre-aprovisionada por una organización (ADR-023): define
-     * la contraseña con el token del enlace de email. En éxito el backend devuelve
-     * tokens de auto-signin → el usuario queda logueado (mismo flujo que verify-email).
-     */
-    activateAccount(request) {
-        this.stateService.clearError();
-        return this.http.post(`${this.baseUrl}/activate`, request).pipe(tap(response => {
-            if (response.activated && response.accessToken) {
-                this.handleSuccessfulAuth(response);
-            }
-        }), catchError(error => this.handleAuthError(error)));
-    }
     /**
      * Cambia la contraseña del usuario autenticado.
      * Requiere la contraseña actual para verificación.
@@ -41750,7 +41737,7 @@ const PROFILE_VIEW_I18N = {
 const HANDLE_PATTERN = /^[a-z_][a-z0-9_]*$/;
 const HANDLE_MIN = 3;
 const HANDLE_MAX = 20;
-const DEFAULT_NAMESPACE$e = 'Settings.Profile';
+const DEFAULT_NAMESPACE$f = 'Settings.Profile';
 /**
  * `val-profile-view` — vista Perfil full-feature autocontenida (organism).
  *
@@ -41800,7 +41787,7 @@ class ProfileViewComponent {
                 showPhone: merged.showPhone ?? true,
                 showShareCta: merged.showShareCta ?? true,
                 profileBaseUrl: merged.profileBaseUrl ?? '',
-                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$e,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$f,
                 onSaved: merged.onSaved,
                 onAvatarUploaded: merged.onAvatarUploaded,
             };
@@ -42716,7 +42703,7 @@ const PREFERENCES_VIEW_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$d = 'Settings.General';
+const DEFAULT_NAMESPACE$e = 'Settings.General';
 const DEFAULT_LANGUAGES = ['es', 'en'];
 /**
  * `val-preferences-view` — vista de preferencias de UI cross-app (tema +
@@ -42753,7 +42740,7 @@ class PreferencesViewComponent {
                 showLanguage: merged.showLanguage ?? true,
                 showFontSize: merged.showFontSize ?? true,
                 supportedLanguages: merged.supportedLanguages ?? DEFAULT_LANGUAGES,
-                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$d,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$e,
                 onThemeChanged: merged.onThemeChanged,
                 onLanguageChanged: merged.onLanguageChanged,
                 onFontSizeChanged: merged.onFontSizeChanged,
@@ -43401,62 +43388,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                 type: Input
             }] } });
 
-/**
- * Helper para montar el bloque completo de Settings en una app del factory: el
- * HUB de navegación (`val-settings-hub`) en el index + las vistas promovidas
- * (Perfil, Preferencias) + las rutas propias de la app (`extraRoutes`).
- *
- * Pensado para apps nuevas (greenfield) que adoptan el set entero. showcase NO
- * lo usa hoy (preserva su `settings.routes.ts` por la semántica de sus muchas
- * secciones no promovidas — ver guía de promoción), pero el provider debe
- * existir y compilar para el resto de apps.
- *
- * @example
- * ```ts
- * // app.routes.ts
- * import { provideValtechSettingsRoutes } from 'valtech-components';
- *
- * export const routes: Routes = [
- *   {
- *     path: 'app',
- *     children: [
- *       ...provideValtechSettingsRoutes({
- *         hubConfig: { onLogout: () => auth.logoutWithConfirmation() },
- *         extraRoutes: [
- *           { path: 'security', loadComponent: () => ... },
- *         ],
- *       }),
- *     ],
- *   },
- * ];
- * ```
- */
-function provideValtechSettingsRoutes(opts) {
-    const basePath = opts?.basePath ?? 'settings';
-    const includeProfile = opts?.includeProfile ?? true;
-    const includePreferences = opts?.includePreferences ?? true;
-    return [
-        {
-            path: basePath,
-            children: [
-                {
-                    path: '',
-                    component: SettingsHubComponent,
-                    data: { settingsHubConfig: opts?.hubConfig },
-                },
-                ...(includeProfile ? provideValtechProfileRoutes({ config: opts?.profileConfig }) : []),
-                ...(includePreferences
-                    ? provideValtechPreferencesRoutes({
-                        path: opts?.preferencesPath ?? 'preferences',
-                        config: opts?.preferencesConfig,
-                    })
-                    : []),
-                ...(opts?.extraRoutes ?? []),
-            ],
-        },
-    ];
-}
-
 addIcons({ shieldCheckmarkOutline, checkmarkCircleOutline });
 /**
  * `val-login-attempt-modal` — modal de confirmación de intento de inicio de sesión.
@@ -44565,7 +44496,7 @@ const SECURITY_VIEW_I18N = {
 };
 
 addIcons({ laptopOutline, phonePortraitOutline });
-const DEFAULT_NAMESPACE$c = 'Settings.Security';
+const DEFAULT_NAMESPACE$d = 'Settings.Security';
 /**
  * `val-security-view` — vista Seguridad full-feature autocontenida (organism).
  *
@@ -44614,7 +44545,7 @@ class SecurityViewComponent {
                 showChangeEmail: merged.showChangeEmail ?? true,
                 showMfa: merged.showMfa ?? true,
                 showPolicies: merged.showPolicies ?? true,
-                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$c,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$d,
                 handleDeepLinks: merged.handleDeepLinks ?? true,
                 homeRoute: merged.homeRoute ?? '/app/home',
                 onMfaCompleted: merged.onMfaCompleted,
@@ -45416,13 +45347,6 @@ class OrgService {
     inviteUser(orgId, req) {
         return this.http.post(`${this.baseUrl}/${orgId}/invite`, req);
     }
-    /**
-     * Crea/asigna miembros en masa (ADR-023). Resultado por-fila (partial success):
-     * `created` (pre-aprovisionado), `assigned` (ya existía), `skipped`, `error`.
-     */
-    importMembers(orgId, req) {
-        return this.http.post(`${this.baseUrl}/${orgId}/members/import`, req);
-    }
     leaveOrg(orgId) {
         return this.http.post(`${this.baseUrl}/${orgId}/leave`, {});
     }
@@ -45527,7 +45451,7 @@ const CREATE_ORG_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$b = 'CreateOrgModal';
+const DEFAULT_NAMESPACE$c = 'CreateOrgModal';
 /**
  * `val-create-org-modal` — modal de creación de organización (organism
  * compartido). Promovido desde `showcase` bajo el proceso de ADR-021. Reusado por
@@ -45553,10 +45477,10 @@ class CreateOrgModalComponent {
         this.toast = inject(ToastService);
         this.errors = inject(ValtechErrorService);
         /** Namespace i18n con que la vista resuelve sus textos. */
-        this.i18nNamespace = DEFAULT_NAMESPACE$b;
+        this.i18nNamespace = DEFAULT_NAMESPACE$c;
         this._busy = signal(false);
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$b)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$b, CREATE_ORG_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$c)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$c, CREATE_ORG_MODAL_I18N);
         }
         this.formMeta = signal(this.buildFormMeta());
         effect(() => {
@@ -45792,7 +45716,7 @@ const DELETE_ACCOUNT_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$a = 'Settings.DeleteAccount';
+const DEFAULT_NAMESPACE$b = 'Settings.DeleteAccount';
 /**
  * `val-delete-account-modal` — modal de eliminación de cuenta (organism,
  * cuenta-específico). Promovido desde `showcase` bajo el proceso de ADR-021.
@@ -45818,7 +45742,7 @@ class DeleteAccountModalComponent {
         this.i18n = inject(I18nService);
         this.toast = inject(ToastService);
         /** Namespace i18n con que la vista resuelve sus textos. */
-        this.i18nNamespace = DEFAULT_NAMESPACE$a;
+        this.i18nNamespace = DEFAULT_NAMESPACE$b;
         this.hasPassword = signal(null);
         this.codeSent = signal(false);
         this.formState = signal(ComponentStates.ENABLED);
@@ -45885,8 +45809,8 @@ class DeleteAccountModalComponent {
             ],
             actions: this.submitBtn('delete-code-submit', 'confirmCta'),
         }));
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$a)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$a, DELETE_ACCOUNT_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$b)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$b, DELETE_ACCOUNT_MODAL_I18N);
         }
     }
     ngOnInit() {
@@ -46087,7 +46011,7 @@ const ORG_INFO_SHEET_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$9 = 'OrgInfoSheet';
+const DEFAULT_NAMESPACE$a = 'OrgInfoSheet';
 /**
  * `val-org-info-sheet` — sheet informativo "¿Qué son las organizaciones?".
  * Extraído del `OrgInfoSheetComponent` inline de `AccountPage` bajo el proceso de
@@ -46132,15 +46056,15 @@ class OrgInfoSheetComponent {
             text: this.closeProps.text || this.resolvedCloseLabel(),
         }));
         addIcons({ peopleOutline, swapHorizontalOutline, mailOutline });
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$9)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$9, ORG_INFO_SHEET_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$a)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$a, ORG_INFO_SHEET_I18N);
         }
     }
     dismiss() {
         this._modalRef?.dismiss(null, 'cancel');
     }
     tt(key) {
-        return this.i18n.t(key, DEFAULT_NAMESPACE$9);
+        return this.i18n.t(key, DEFAULT_NAMESPACE$a);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: OrgInfoSheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: OrgInfoSheetComponent, isStandalone: true, selector: "val-org-info-sheet", inputs: { title: "title", subtitle: "subtitle", body: "body", closeLabel: "closeLabel", closeProps: "closeProps", _modalRef: "_modalRef" }, ngImport: i0, template: `
@@ -46307,7 +46231,7 @@ const SWITCH_ORG_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$8 = 'Settings.SwitchOrg';
+const DEFAULT_NAMESPACE$9 = 'Settings.SwitchOrg';
 addIcons({ businessOutline, checkmarkCircleOutline });
 /**
  * `val-switch-org-modal` — modal de cambio de organización activa (organism
@@ -46333,7 +46257,7 @@ class SwitchOrgModalComponent {
         this.orgSwitch = inject(OrgSwitchService);
         this.errors = inject(ValtechErrorService);
         /** Namespace i18n con que la vista resuelve sus textos. */
-        this.i18nNamespace = DEFAULT_NAMESPACE$8;
+        this.i18nNamespace = DEFAULT_NAMESPACE$9;
         this.orgs = signal([]);
         this.loading = signal(false);
         this.query = signal('');
@@ -46349,8 +46273,8 @@ class SwitchOrgModalComponent {
                 return list;
             return list.filter(o => o.name.toLowerCase().includes(q));
         });
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$8)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$8, SWITCH_ORG_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$9)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$9, SWITCH_ORG_MODAL_I18N);
         }
         this.loadOrgs();
     }
@@ -46668,7 +46592,7 @@ const ACCOUNT_VIEW_I18N = {
 };
 
 addIcons({ peopleOutline, businessOutline, chevronForwardOutline, swapHorizontalOutline, mailOutline });
-const DEFAULT_NAMESPACE$7 = 'Settings.Account';
+const DEFAULT_NAMESPACE$8 = 'Settings.Account';
 const DEFAULT_MANAGE_ORG_ROUTE = '/app/settings/organization';
 /**
  * `val-account-view` — vista Cuenta full-feature autocontenida (organism).
@@ -46709,7 +46633,7 @@ class AccountViewComponent {
                 showNewOrgCta: merged.showNewOrgCta ?? true,
                 showLogout: merged.showLogout ?? true,
                 showDeleteAccount: merged.showDeleteAccount ?? true,
-                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$7,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$8,
                 manageOrgRoute: merged.manageOrgRoute ?? DEFAULT_MANAGE_ORG_ROUTE,
                 onOrgSwitched: merged.onOrgSwitched,
                 onOrgCreated: merged.onOrgCreated,
@@ -47434,7 +47358,7 @@ const EDIT_ORG_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$6 = 'EditOrgModal';
+const DEFAULT_NAMESPACE$7 = 'EditOrgModal';
 /**
  * `val-edit-org-modal` — modal de edición de organización (nombre + descripción).
  * Promovido desde `showcase` bajo el proceso de ADR-021. Reusado por la vista de
@@ -47461,10 +47385,10 @@ class EditOrgModalComponent {
         /** Organización a editar (pasada por `componentProps`). */
         this.org = null;
         /** Namespace i18n con que la vista resuelve sus textos. */
-        this.i18nNamespace = DEFAULT_NAMESPACE$6;
+        this.i18nNamespace = DEFAULT_NAMESPACE$7;
         this.saving = signal(false);
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$6)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$6, EDIT_ORG_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$7)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$7, EDIT_ORG_MODAL_I18N);
         }
         this.formMeta = signal(this.buildFormMeta());
         effect(() => {
@@ -47702,7 +47626,7 @@ const INVITE_MEMBER_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$5 = 'InviteModal';
+const DEFAULT_NAMESPACE$6 = 'InviteModal';
 addIcons({ personOutline, mailOutline, closeOutline, checkmarkCircleOutline });
 /**
  * `val-invite-member-modal` — invitación de miembros a una organización.
@@ -47733,7 +47657,7 @@ class InviteMemberModalComponent {
         /** Ids de miembros ya existentes (excluidos de los resultados). */
         this.existingMemberIds = [];
         /** Namespace i18n con que la vista resuelve sus textos. */
-        this.i18nNamespace = DEFAULT_NAMESPACE$5;
+        this.i18nNamespace = DEFAULT_NAMESPACE$6;
         this.query = signal('');
         this.searching = signal(false);
         this.searchResults = signal([]);
@@ -47780,8 +47704,8 @@ class InviteMemberModalComponent {
             state: this.sending() ? ComponentStates.WORKING : ComponentStates.ENABLED,
         }));
         this.searchSubject = new Subject();
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$5)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$5, INVITE_MEMBER_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$6)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$6, INVITE_MEMBER_MODAL_I18N);
         }
         this.loadRoles();
         this.roleSub = this.roleControl.valueChanges.subscribe(v => {
@@ -48270,7 +48194,7 @@ const MEMBER_DETAIL_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$4 = 'Settings.MemberDetail';
+const DEFAULT_NAMESPACE$5 = 'Settings.MemberDetail';
 /**
  * `val-member-detail-modal` — detalle de miembro de organización: perfil, rol y
  * permisos. Promovido desde `showcase` bajo el proceso de ADR-021.
@@ -48307,7 +48231,7 @@ class MemberDetailModalComponent {
             { id: 'admin', name: 'admin' },
         ];
         /** Namespace i18n con que la vista resuelve sus textos. */
-        this.i18nNamespace = DEFAULT_NAMESPACE$4;
+        this.i18nNamespace = DEFAULT_NAMESPACE$5;
         this.working = signal(false);
         this.currentRole = signal('');
         this.roleControl = new FormControl('');
@@ -48347,8 +48271,8 @@ class MemberDetailModalComponent {
             type: 'button',
             state: this.working() ? ComponentStates.WORKING : ComponentStates.ENABLED,
         }));
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$4)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$4, MEMBER_DETAIL_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$5)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$5, MEMBER_DETAIL_MODAL_I18N);
         }
     }
     ngOnInit() {
@@ -48685,7 +48609,7 @@ const TRANSFER_OWNERSHIP_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$3 = 'Settings.TransferModal';
+const DEFAULT_NAMESPACE$4 = 'Settings.TransferModal';
 /**
  * `val-transfer-ownership-modal` — selector de miembro para transferir la
  * propiedad de la organización. Promovido desde `showcase` bajo el proceso de
@@ -48709,7 +48633,7 @@ class TransferOwnershipModalComponent {
         /** Lista de miembros transferibles (todos excepto el owner actual). */
         this.members = [];
         /** Namespace i18n con que la vista resuelve sus textos. */
-        this.i18nNamespace = DEFAULT_NAMESPACE$3;
+        this.i18nNamespace = DEFAULT_NAMESPACE$4;
         this.query = signal('');
         this.selectedId = signal('');
         this.filtered = computed(() => {
@@ -48721,8 +48645,8 @@ class TransferOwnershipModalComponent {
                 m.userId.toLowerCase().includes(q));
         });
         this.noResultsLabel = computed(() => `${this.t('noResults')} "${this.query()}"`);
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$3)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$3, TRANSFER_OWNERSHIP_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$4)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$4, TRANSFER_OWNERSHIP_MODAL_I18N);
         }
     }
     ngOnInit() {
@@ -48907,371 +48831,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                 type: Input
             }] } });
 
-/**
- * Defaults i18n (es/en) embebidos en `val-member-import-modal` (ADR-023).
- * Auto-registrados si el consumer no proveyó el namespace `Settings.ImportModal`.
- */
-const MEMBER_IMPORT_MODAL_I18N = {
-    es: {
-        title: 'Importar miembros',
-        hint: 'Pega un CSV con columnas: email, nombre, rol (una fila por persona).',
-        csvPlaceholder: 'email,nombre,rol\nana@x.com,Ana,editor\nbeto@x.com,Beto,viewer',
-        rolesAvailable: 'Roles disponibles:',
-        onConflictLabel: 'Si el email ya existe',
-        conflictAssign: 'Asignar el rol',
-        conflictSkip: 'Omitir',
-        conflictError: 'Marcar error',
-        sendActivation: 'Enviar email de activación a las cuentas nuevas',
-        submit: 'Importar',
-        submitting: 'Importando...',
-        parseError: 'No se pudo interpretar el CSV. Revisa el formato.',
-        noRows: 'Pega al menos una fila válida (email y rol).',
-        summary: 'Resumen',
-        created: 'creados',
-        assigned: 'asignados',
-        skipped: 'omitidos',
-        failed: 'con error',
-        colEmail: 'Email',
-        colStatus: 'Estado',
-        colDetail: 'Detalle',
-        activationSent: 'activación enviada',
-        activationPending: 'activación pendiente',
-        again: 'Importar otro lote',
-        close: 'Cerrar',
-        genericError: 'No se pudo completar la importación. Intenta de nuevo.',
-    },
-    en: {
-        title: 'Import members',
-        hint: 'Paste a CSV with columns: email, name, role (one row per person).',
-        csvPlaceholder: 'email,name,role\nana@x.com,Ana,editor\nbeto@x.com,Beto,viewer',
-        rolesAvailable: 'Available roles:',
-        onConflictLabel: 'If the email already exists',
-        conflictAssign: 'Assign the role',
-        conflictSkip: 'Skip',
-        conflictError: 'Mark as error',
-        sendActivation: 'Send activation email to new accounts',
-        submit: 'Import',
-        submitting: 'Importing...',
-        parseError: "Couldn't parse the CSV. Check the format.",
-        noRows: 'Paste at least one valid row (email and role).',
-        summary: 'Summary',
-        created: 'created',
-        assigned: 'assigned',
-        skipped: 'skipped',
-        failed: 'failed',
-        colEmail: 'Email',
-        colStatus: 'Status',
-        colDetail: 'Detail',
-        activationSent: 'activation sent',
-        activationPending: 'activation pending',
-        again: 'Import another batch',
-        close: 'Close',
-        genericError: "Couldn't complete the import. Try again.",
-    },
-};
-
-const DEFAULT_NAMESPACE$2 = 'Settings.ImportModal';
-/**
- * `val-member-import-modal` — panel de carga masiva de miembros (ADR-023 fase 6).
- *
- * El admin pega un CSV (`email,nombre,rol`); el modal lo parsea a filas y llama
- * `OrgService.importMembers`. Muestra el resultado por-fila (partial success):
- * `created` / `assigned` / `skipped` / `error`. Header canónico (Regla #5).
- *
- * Auto-registra defaults i18n (es/en) en `Settings.ImportModal`.
- */
-class MemberImportModalComponent {
-    constructor() {
-        this.i18n = inject(I18nService);
-        this.orgService = inject(OrgService);
-        /** Org destino del import. */
-        this.orgId = '';
-        /** Nombres de roles disponibles (para el hint). Opcional. */
-        this.availableRoles = [];
-        /** Namespace i18n. */
-        this.i18nNamespace = DEFAULT_NAMESPACE$2;
-        this.csv = '';
-        this.onConflict = 'assignRole';
-        this.sendActivation = true;
-        this.submitting = signal(false);
-        this.errorMsg = signal('');
-        this.results = signal(null);
-        this.rolesHint = computed(() => this.availableRoles.length ? `${this.t('rolesAvailable')} ${this.availableRoles.join(', ')}` : '');
-        this.summaryLabel = computed(() => {
-            const s = this.results()?.summary;
-            if (!s)
-                return this.t('summary');
-            return `${this.t('summary')}: ${s.created} ${this.t('created')} · ${s.assigned} ${this.t('assigned')} · ${s.skipped} ${this.t('skipped')} · ${s.failed} ${this.t('failed')}`;
-        });
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$2)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$2, MEMBER_IMPORT_MODAL_I18N);
-        }
-    }
-    ngOnInit() {
-        if (!this.i18n.hasNamespace(this.i18nNamespace)) {
-            this.i18n.registerContent(this.i18nNamespace, MEMBER_IMPORT_MODAL_I18N);
-        }
-    }
-    /** Parsea el CSV pegado a filas {email,name,roleName}. Tolera header. */
-    parseCsv() {
-        const rows = [];
-        for (const raw of this.csv.split(/\r?\n/)) {
-            const line = raw.trim();
-            if (!line)
-                continue;
-            const cols = line.split(',').map(c => c.trim());
-            const email = (cols[0] ?? '').toLowerCase();
-            // Saltar header (primera col "email") o líneas sin @.
-            if (!email || !email.includes('@'))
-                continue;
-            rows.push({ email, name: cols[1] ?? '', roleName: cols[2] ?? '' });
-        }
-        return rows;
-    }
-    submit() {
-        this.errorMsg.set('');
-        const users = this.parseCsv();
-        if (users.length === 0) {
-            this.errorMsg.set(this.t('noRows'));
-            return;
-        }
-        if (users.some(u => !u.roleName)) {
-            this.errorMsg.set(this.t('parseError'));
-            return;
-        }
-        this.submitting.set(true);
-        this.orgService
-            .importMembers(this.orgId, {
-            users,
-            onConflict: this.onConflict,
-            sendActivation: this.sendActivation,
-        })
-            .subscribe({
-            next: res => {
-                this.submitting.set(false);
-                this.results.set(res);
-                // Refrescar lista del consumer si hubo altas/asignaciones efectivas.
-                if (res.summary.created + res.summary.assigned > 0) {
-                    this.onSuccess?.();
-                }
-            },
-            error: err => {
-                this.submitting.set(false);
-                this.errorMsg.set(err?.error?.message ?? this.t('genericError'));
-            },
-        });
-    }
-    statusLabel(r) {
-        const base = this.t(r.status === 'error' ? 'failed' : r.status);
-        if (r.status === 'created' && r.activation) {
-            return `${base} · ${this.t(r.activation === 'sent' ? 'activationSent' : 'activationPending')}`;
-        }
-        return base;
-    }
-    reset() {
-        this.csv = '';
-        this.errorMsg.set('');
-        this.results.set(null);
-    }
-    dismiss() {
-        this._modalRef?.dismiss(null, 'cancel');
-    }
-    t(key) {
-        return this.i18n.t(key, this.i18nNamespace);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MemberImportModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: MemberImportModalComponent, isStandalone: true, selector: "val-member-import-modal", inputs: { orgId: "orgId", availableRoles: "availableRoles", onSuccess: "onSuccess", _modalRef: "_modalRef", i18nNamespace: "i18nNamespace" }, ngImport: i0, template: `
-    <ion-header>
-      <ion-toolbar>
-        <ion-buttons slot="end">
-          <ion-button fill="clear" color="dark" (click)="dismiss()">
-            <strong>{{ t('close') }}</strong>
-          </ion-button>
-        </ion-buttons>
-      </ion-toolbar>
-    </ion-header>
-
-    <ion-content class="ion-padding">
-      <val-display [props]="{ content: t('title'), size: 'small', color: 'dark' }" />
-
-      @if (!results()) {
-        <val-title [props]="{ content: t('hint'), size: 'large', color: '', bold: false }" />
-
-        @if (rolesHint()) {
-          <val-text [props]="{ content: rolesHint(), size: 'small', color: 'medium', bold: false }" />
-        }
-
-        <ion-textarea
-          class="import-csv"
-          [autoGrow]="true"
-          [rows]="6"
-          [placeholder]="t('csvPlaceholder')"
-          [(ngModel)]="csv"
-        />
-
-        <ion-select
-          class="import-conflict"
-          label="{{ t('onConflictLabel') }}"
-          labelPlacement="stacked"
-          interface="popover"
-          [(ngModel)]="onConflict"
-        >
-          <ion-select-option value="assignRole">{{ t('conflictAssign') }}</ion-select-option>
-          <ion-select-option value="skip">{{ t('conflictSkip') }}</ion-select-option>
-          <ion-select-option value="error">{{ t('conflictError') }}</ion-select-option>
-        </ion-select>
-
-        <ion-checkbox class="import-activation" labelPlacement="end" [(ngModel)]="sendActivation">
-          {{ t('sendActivation') }}
-        </ion-checkbox>
-
-        @if (errorMsg()) {
-          <p class="import-error">{{ errorMsg() }}</p>
-        }
-
-        <div class="import-actions">
-          <ion-button expand="block" color="dark" [disabled]="submitting()" (click)="submit()">
-            @if (submitting()) {
-              <ion-spinner name="dots" />
-              &nbsp;{{ t('submitting') }}
-            } @else {
-              {{ t('submit') }}
-            }
-          </ion-button>
-        </div>
-      } @else {
-        <!-- Resultados -->
-        <val-title [props]="{ content: summaryLabel(), size: 'large', color: '', bold: true }" />
-        <div class="import-results">
-          @for (r of results()!.results; track r.email) {
-            <div class="import-row import-row--{{ r.status }}">
-              <span class="import-row__email">{{ r.email }}</span>
-              <span class="import-row__status">{{ statusLabel(r) }}</span>
-              @if (r.reason) {
-                <span class="import-row__reason">{{ r.reason }}</span>
-              }
-            </div>
-          }
-        </div>
-        <div class="import-actions">
-          <ion-button expand="block" fill="outline" color="dark" (click)="reset()">
-            {{ t('again') }}
-          </ion-button>
-        </div>
-      }
-    </ion-content>
-  `, isInline: true, styles: ["val-display{display:block;margin-bottom:4px}val-title{display:block;margin-bottom:12px}.import-csv{--background: var(--ion-color-light);border-radius:10px;margin-bottom:16px;font-family:monospace;font-size:13px}.import-conflict{margin-bottom:12px}.import-activation{display:block;margin-bottom:16px;font-size:14px}.import-error{margin:0 0 12px;font-size:.875rem;color:var(--ion-color-danger, #c0392b)}.import-actions{margin-top:8px}.import-results{display:flex;flex-direction:column;gap:6px;margin:12px 0}.import-row{display:grid;grid-template-columns:1fr auto;grid-row-gap:2px;align-items:center;padding:10px 12px;border-radius:8px;border-left:3px solid var(--ion-color-medium);background:var(--ion-color-light);font-size:14px}.import-row--created{border-left-color:var(--ion-color-success, #2dd36f)}.import-row--assigned{border-left-color:var(--ion-color-primary, #7026df)}.import-row--skipped{border-left-color:var(--ion-color-medium, #92949c)}.import-row--error{border-left-color:var(--ion-color-danger, #c0392b)}.import-row__email{font-weight:600;color:var(--ion-color-dark)}.import-row__status{text-align:right;color:var(--ion-color-medium-shade, #6b6e76)}.import-row__reason{grid-column:1 / -1;font-size:12px;color:var(--ion-color-danger, #c0392b)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { 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: IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: IonTextarea, selector: "ion-textarea", inputs: ["autoGrow", "autocapitalize", "autofocus", "clearOnEdit", "color", "cols", "counter", "counterFormatter", "debounce", "disabled", "enterkeyhint", "errorText", "fill", "helperText", "inputmode", "label", "labelPlacement", "maxlength", "minlength", "mode", "name", "placeholder", "readonly", "required", "rows", "shape", "spellcheck", "value", "wrap"] }, { kind: "component", type: IonSelect, selector: "ion-select", inputs: ["cancelText", "color", "compareWith", "disabled", "errorText", "expandedIcon", "fill", "helperText", "interface", "interfaceOptions", "justify", "label", "labelPlacement", "mode", "multiple", "name", "okText", "placeholder", "selectedText", "shape", "toggleIcon", "value"] }, { kind: "component", type: IonSelectOption, selector: "ion-select-option", inputs: ["disabled", "value"] }, { kind: "component", type: IonCheckbox, selector: "ion-checkbox", inputs: ["checked", "color", "disabled", "errorText", "helperText", "indeterminate", "justify", "labelPlacement", "mode", "name", "value"] }, { kind: "component", type: IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: DisplayComponent, selector: "val-display", inputs: ["props"] }, { kind: "component", type: TextComponent, selector: "val-text", inputs: ["props"] }, { kind: "component", type: TitleComponent, selector: "val-title", inputs: ["props"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MemberImportModalComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'val-member-import-modal', standalone: true, imports: [
-                        FormsModule,
-                        IonHeader,
-                        IonToolbar,
-                        IonButtons,
-                        IonButton,
-                        IonContent,
-                        IonTextarea,
-                        IonSelect,
-                        IonSelectOption,
-                        IonCheckbox,
-                        IonSpinner,
-                        DisplayComponent,
-                        TextComponent,
-                        TitleComponent,
-                    ], template: `
-    <ion-header>
-      <ion-toolbar>
-        <ion-buttons slot="end">
-          <ion-button fill="clear" color="dark" (click)="dismiss()">
-            <strong>{{ t('close') }}</strong>
-          </ion-button>
-        </ion-buttons>
-      </ion-toolbar>
-    </ion-header>
-
-    <ion-content class="ion-padding">
-      <val-display [props]="{ content: t('title'), size: 'small', color: 'dark' }" />
-
-      @if (!results()) {
-        <val-title [props]="{ content: t('hint'), size: 'large', color: '', bold: false }" />
-
-        @if (rolesHint()) {
-          <val-text [props]="{ content: rolesHint(), size: 'small', color: 'medium', bold: false }" />
-        }
-
-        <ion-textarea
-          class="import-csv"
-          [autoGrow]="true"
-          [rows]="6"
-          [placeholder]="t('csvPlaceholder')"
-          [(ngModel)]="csv"
-        />
-
-        <ion-select
-          class="import-conflict"
-          label="{{ t('onConflictLabel') }}"
-          labelPlacement="stacked"
-          interface="popover"
-          [(ngModel)]="onConflict"
-        >
-          <ion-select-option value="assignRole">{{ t('conflictAssign') }}</ion-select-option>
-          <ion-select-option value="skip">{{ t('conflictSkip') }}</ion-select-option>
-          <ion-select-option value="error">{{ t('conflictError') }}</ion-select-option>
-        </ion-select>
-
-        <ion-checkbox class="import-activation" labelPlacement="end" [(ngModel)]="sendActivation">
-          {{ t('sendActivation') }}
-        </ion-checkbox>
-
-        @if (errorMsg()) {
-          <p class="import-error">{{ errorMsg() }}</p>
-        }
-
-        <div class="import-actions">
-          <ion-button expand="block" color="dark" [disabled]="submitting()" (click)="submit()">
-            @if (submitting()) {
-              <ion-spinner name="dots" />
-              &nbsp;{{ t('submitting') }}
-            } @else {
-              {{ t('submit') }}
-            }
-          </ion-button>
-        </div>
-      } @else {
-        <!-- Resultados -->
-        <val-title [props]="{ content: summaryLabel(), size: 'large', color: '', bold: true }" />
-        <div class="import-results">
-          @for (r of results()!.results; track r.email) {
-            <div class="import-row import-row--{{ r.status }}">
-              <span class="import-row__email">{{ r.email }}</span>
-              <span class="import-row__status">{{ statusLabel(r) }}</span>
-              @if (r.reason) {
-                <span class="import-row__reason">{{ r.reason }}</span>
-              }
-            </div>
-          }
-        </div>
-        <div class="import-actions">
-          <ion-button expand="block" fill="outline" color="dark" (click)="reset()">
-            {{ t('again') }}
-          </ion-button>
-        </div>
-      }
-    </ion-content>
-  `, styles: ["val-display{display:block;margin-bottom:4px}val-title{display:block;margin-bottom:12px}.import-csv{--background: var(--ion-color-light);border-radius:10px;margin-bottom:16px;font-family:monospace;font-size:13px}.import-conflict{margin-bottom:12px}.import-activation{display:block;margin-bottom:16px;font-size:14px}.import-error{margin:0 0 12px;font-size:.875rem;color:var(--ion-color-danger, #c0392b)}.import-actions{margin-top:8px}.import-results{display:flex;flex-direction:column;gap:6px;margin:12px 0}.import-row{display:grid;grid-template-columns:1fr auto;grid-row-gap:2px;align-items:center;padding:10px 12px;border-radius:8px;border-left:3px solid var(--ion-color-medium);background:var(--ion-color-light);font-size:14px}.import-row--created{border-left-color:var(--ion-color-success, #2dd36f)}.import-row--assigned{border-left-color:var(--ion-color-primary, #7026df)}.import-row--skipped{border-left-color:var(--ion-color-medium, #92949c)}.import-row--error{border-left-color:var(--ion-color-danger, #c0392b)}.import-row__email{font-weight:600;color:var(--ion-color-dark)}.import-row__status{text-align:right;color:var(--ion-color-medium-shade, #6b6e76)}.import-row__reason{grid-column:1 / -1;font-size:12px;color:var(--ion-color-danger, #c0392b)}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { orgId: [{
-                type: Input
-            }], availableRoles: [{
-                type: Input
-            }], onSuccess: [{
-                type: Input
-            }], _modalRef: [{
-                type: Input
-            }], i18nNamespace: [{
-                type: Input
-            }] } });
-
 /**
  * Defaults i18n (es/en) embebidos en `val-organization-view`. Auto-registrados en
  * el constructor del componente si el consumer no proveyó el namespace
@@ -49327,7 +48886,6 @@ const ORGANIZATION_VIEW_I18N = {
         inviteCtaTitle: '¿Deseas agregar a alguien?',
         inviteCtaHint: 'Invita a usuarios a unirse a tu organización.',
         inviteOpen: 'Invitar',
-        importOpen: 'Importar',
         viewMemberCta: 'Ver miembro',
         roleViewer: 'Visor',
         roleEditor: 'Editor',
@@ -49397,7 +48955,6 @@ const ORGANIZATION_VIEW_I18N = {
         inviteCtaTitle: 'Want to add someone?',
         inviteCtaHint: 'Invite users to join your organization.',
         inviteOpen: 'Invite',
-        importOpen: 'Import',
         viewMemberCta: 'View member',
         roleViewer: 'Viewer',
         roleEditor: 'Editor',
@@ -49422,7 +48979,7 @@ const ORGANIZATION_VIEW_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$1 = 'Settings.Organization';
+const DEFAULT_NAMESPACE$3 = 'Settings.Organization';
 const DEFAULT_VIEW_PERMISSIONS_ROUTE = '/app/settings/permissions';
 const DEFAULT_LEAVE_REDIRECT_ROUTE = '/app/settings/account';
 /**
@@ -49479,7 +49036,7 @@ class OrganizationViewComponent {
                 showInvite: merged.showInvite ?? true,
                 showTransferOwnership: merged.showTransferOwnership ?? true,
                 showLeave: merged.showLeave ?? true,
-                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$1,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$3,
                 viewPermissionsRoute: merged.viewPermissionsRoute ?? DEFAULT_VIEW_PERMISSIONS_ROUTE,
                 leaveRedirectRoute: merged.leaveRedirectRoute ?? DEFAULT_LEAVE_REDIRECT_ROUTE,
                 onOrgEdited: merged.onOrgEdited,
@@ -49511,22 +49068,6 @@ class OrganizationViewComponent {
         this.members = signal([]);
         this.membersLoading = signal(false);
         this.membersLoadError = signal(null);
-        this.membersErrorState = computed(() => {
-            this.i18n.lang();
-            const err = this.membersLoadError();
-            if (!err)
-                return null;
-            return createErrorStateProps(err, {
-                title: { offline: this.tt('offlineTitle'), error: this.tt('errorTitle') },
-                description: {
-                    offline: this.tt('offlineHint'),
-                    error: interpretError(err).message,
-                },
-                retryLabel: this.tt('retry'),
-                onRetry: () => this.loadMembers(),
-                retrying: this.membersLoading(),
-            });
-        });
         this.membersNextToken = signal(null);
         this.loadingMoreMembers = signal(false);
         this.showAllMembers = signal(false);
@@ -49613,14 +49154,6 @@ class OrganizationViewComponent {
             shape: 'round',
             type: 'button',
         }));
-        this.openImportButtonProps = computed(() => ({
-            text: this.tt('importOpen'),
-            color: 'dark',
-            fill: 'outline',
-            size: 'default',
-            shape: 'round',
-            type: 'button',
-        }));
         /** Guarda para detectar el primer disparo del effect (evita doble carga). */
         this.lastLoadedOrgId = null;
         const ns = this.ns;
@@ -49721,25 +49254,6 @@ class OrganizationViewComponent {
             backdropDismiss: true,
         });
     }
-    onOpenImport() {
-        void this.modalService.open({
-            component: MemberImportModalComponent,
-            componentProps: {
-                orgId: this.activeOrgId(),
-                availableRoles: this.availableRoles().map(r => r.name),
-                onSuccess: () => {
-                    this.loadMembers();
-                    this.resolvedConfig().onMemberInvited?.();
-                },
-            },
-            breakpoints: {
-                breakpoints: [0, 0.92],
-                initialBreakpoint: 0.92,
-                showHandle: true,
-            },
-            backdropDismiss: true,
-        });
-    }
     onViewPermissions() {
         this.nav.navigateByUrl(this.resolvedConfig().viewPermissionsRoute);
     }
@@ -49821,7 +49335,6 @@ class OrganizationViewComponent {
         if (!orgId)
             return Promise.resolve();
         this.membersLoading.set(true);
-        this.membersLoadError.set(null);
         this.membersNextToken.set(null);
         this.showAllMembers.set(false);
         return new Promise(resolve => {
@@ -50032,8 +49545,6 @@ class OrganizationViewComponent {
           <div class="section-body">
             @if (membersLoading()) {
               <val-skeleton-layout [props]="{ preset: 'list', rows: 3 }" />
-            } @else if (membersErrorState()) {
-              <val-empty-state [props]="membersErrorState()!" />
             } @else if (members().length === 0) {
               <val-text
                 [props]="{
@@ -50126,7 +49637,6 @@ class OrganizationViewComponent {
               />
             </div>
             <val-button [props]="openInviteButtonProps()" (click)="onOpenInvite()" />
-            <val-button [props]="openImportButtonProps()" (click)="onOpenImport()" />
           </div>
         </section>
       }
@@ -50235,7 +49745,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         ButtonComponent,
                         MemberCardComponent,
                         TransferOwnershipModalComponent,
-                        MemberImportModalComponent,
                     ], template: `
     <div class="page">
       <header class="page-header">
@@ -50314,8 +49823,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
           <div class="section-body">
             @if (membersLoading()) {
               <val-skeleton-layout [props]="{ preset: 'list', rows: 3 }" />
-            } @else if (membersErrorState()) {
-              <val-empty-state [props]="membersErrorState()!" />
             } @else if (members().length === 0) {
               <val-text
                 [props]="{
@@ -50408,7 +49915,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
               />
             </div>
             <val-button [props]="openInviteButtonProps()" (click)="onOpenInvite()" />
-            <val-button [props]="openImportButtonProps()" (click)="onOpenImport()" />
           </div>
         </section>
       }
@@ -50537,6 +50043,70 @@ function provideValtechOrganizationRoutes(opts) {
     ];
 }
 
+/**
+ * Helper para montar el bloque completo de Settings en una app del factory: el
+ * HUB de navegación (`val-settings-hub`) en el index + las vistas promovidas
+ * (Perfil, Preferencias) + las rutas propias de la app (`extraRoutes`).
+ *
+ * Pensado para apps nuevas (greenfield) que adoptan el set entero. showcase NO
+ * lo usa hoy (preserva su `settings.routes.ts` por la semántica de sus muchas
+ * secciones no promovidas — ver guía de promoción), pero el provider debe
+ * existir y compilar para el resto de apps.
+ *
+ * @example
+ * ```ts
+ * // app.routes.ts
+ * import { provideValtechSettingsRoutes } from 'valtech-components';
+ *
+ * export const routes: Routes = [
+ *   {
+ *     path: 'app',
+ *     children: [
+ *       ...provideValtechSettingsRoutes({
+ *         hubConfig: { onLogout: () => auth.logoutWithConfirmation() },
+ *         extraRoutes: [
+ *           { path: 'security', loadComponent: () => ... },
+ *         ],
+ *       }),
+ *     ],
+ *   },
+ * ];
+ * ```
+ */
+function provideValtechSettingsRoutes(opts) {
+    const basePath = opts?.basePath ?? 'settings';
+    const includeProfile = opts?.includeProfile ?? true;
+    const includePreferences = opts?.includePreferences ?? true;
+    const includeSecurity = opts?.includeSecurity ?? true;
+    const includeAccount = opts?.includeAccount ?? true;
+    const includeOrganization = opts?.includeOrganization ?? true;
+    return [
+        {
+            path: basePath,
+            children: [
+                {
+                    path: '',
+                    component: SettingsHubComponent,
+                    data: { settingsHubConfig: opts?.hubConfig },
+                },
+                ...(includeProfile ? provideValtechProfileRoutes({ config: opts?.profileConfig }) : []),
+                ...(includePreferences
+                    ? provideValtechPreferencesRoutes({
+                        path: opts?.preferencesPath ?? 'preferences',
+                        config: opts?.preferencesConfig,
+                    })
+                    : []),
+                ...(includeSecurity ? provideValtechSecurityRoutes({ config: opts?.securityConfig }) : []),
+                ...(includeAccount ? provideValtechAccountRoutes({ config: opts?.accountConfig }) : []),
+                ...(includeOrganization
+                    ? provideValtechOrganizationRoutes({ config: opts?.organizationConfig })
+                    : []),
+                ...(opts?.extraRoutes ?? []),
+            ],
+        },
+    ];
+}
+
 /**
  * Refreshable Stream
  *
@@ -50745,7 +50315,7 @@ addIcons({
     openOutline,
     personOutline,
 });
-const DEFAULT_NAMESPACE = 'Notifications';
+const DEFAULT_NAMESPACE$2 = 'Notifications';
 const DEFAULT_SETTINGS_PATH = '/app/settings/notifications';
 const DEFAULT_PAGE_SIZE = 10;
 const DEFAULT_MAX_LOAD = 50;
@@ -50805,7 +50375,7 @@ class NotificationsViewComponent {
                 showPushOffCta: merged.showPushOffCta ?? true,
                 enableMarkAll: merged.enableMarkAll ?? true,
                 settingsNotificationsPath: merged.settingsNotificationsPath ?? DEFAULT_SETTINGS_PATH,
-                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$2,
                 pageSize: merged.pageSize ?? DEFAULT_PAGE_SIZE,
                 maxLoad: merged.maxLoad ?? DEFAULT_MAX_LOAD,
                 onNotificationOpen: merged.onNotificationOpen,
@@ -51473,6 +51043,1419 @@ function provideValtechNotificationsRoutes(opts) {
     ];
 }
 
+/**
+ * Defaults i18n (es/en) embebidos en `val-notification-preferences-view`.
+ * Auto-registrados en el constructor del componente si el consumer no proveyó
+ * el namespace (`Settings.Notifications` por default). SOLO incluye las keys que
+ * la vista usa.
+ *
+ * Portado del override `Settings.Notifications` (showcase) bajo el proceso de
+ * ADR-021.
+ */
+const NOTIFICATION_PREFERENCES_VIEW_I18N = {
+    es: {
+        pageTitle: 'Notificaciones',
+        pageDescription: 'Configura como quieres recibir notificaciones',
+        // Control principal (UX simplificado)
+        simpleTitle: 'Notificaciones push en este dispositivo',
+        simpleDescription: 'Recibe alertas en tiempo real incluso con la app cerrada.',
+        enabling: 'Activando…',
+        disabling: 'Desactivando…',
+        enabled: 'Activadas',
+        errorGeneric: 'No pudimos completar la configuración. Verifica los permisos del navegador y reintenta.',
+        retryCta: 'Reintentar',
+        // Mensajes contextuales
+        permissionUnsupported: 'Tu navegador no soporta notificaciones push.',
+        permissionDeniedInfo: 'Tu navegador esta bloqueando las notificaciones. Para habilitarlas, ve a la configuracion del sitio y permitelas manualmente.',
+        // iOS PWA install
+        iosInstallTitle: 'En iOS, instala la app para recibir notificaciones',
+        iosInstallHint: 'Las notificaciones push en iOS (iPhone/iPad) solo funcionan cuando la app está instalada en la pantalla de inicio. Edge, Chrome y Firefox en iOS comparten esta limitación.',
+        iosInstallStep1: 'Abre este sitio en Safari (no en Chrome/Edge).',
+        iosInstallStep2: 'Toca el botón Compartir (□ con flecha hacia arriba).',
+        iosInstallStep3: "Elige 'Añadir a pantalla de inicio'.",
+        iosInstallStep4: 'Abre la app desde el ícono recién creado y vuelve aquí.',
+        // Detalles técnicos (expandible)
+        detailsShow: 'Ver detalles técnicos',
+        detailsHide: 'Ocultar detalles',
+        detailsToken: 'Token',
+        detailsNone: 'Sin registrar',
+        diagnosticsPermission: 'Permiso del navegador',
+        diagnosticsSupported: 'Soporte del navegador',
+        // Toasts
+        enableSuccess: 'Notificaciones habilitadas',
+        disableSuccess: 'Notificaciones deshabilitadas',
+    },
+    en: {
+        pageTitle: 'Notifications',
+        pageDescription: 'Configure how you want to receive notifications',
+        simpleTitle: 'Push notifications on this device',
+        simpleDescription: 'Get real-time alerts even when the app is closed.',
+        enabling: 'Enabling…',
+        disabling: 'Disabling…',
+        enabled: 'Enabled',
+        errorGeneric: "We couldn't complete the setup. Check your browser permissions and retry.",
+        retryCta: 'Retry',
+        permissionUnsupported: 'Your browser does not support push notifications.',
+        permissionDeniedInfo: 'Your browser is blocking notifications. To enable them, go to site settings and allow them manually.',
+        iosInstallTitle: 'On iOS, install the app to receive notifications',
+        iosInstallHint: 'Push notifications on iOS (iPhone/iPad) only work when the app is installed on the Home Screen. Edge, Chrome and Firefox on iOS share this limitation.',
+        iosInstallStep1: 'Open this site in Safari (not Chrome/Edge).',
+        iosInstallStep2: 'Tap the Share button (□ with an up arrow).',
+        iosInstallStep3: "Choose 'Add to Home Screen'.",
+        iosInstallStep4: 'Open the app from the new icon and come back here.',
+        detailsShow: 'View technical details',
+        detailsHide: 'Hide details',
+        detailsToken: 'Token',
+        detailsNone: 'Not registered',
+        diagnosticsPermission: 'Browser permission',
+        diagnosticsSupported: 'Browser support',
+        enableSuccess: 'Notifications enabled',
+        disableSuccess: 'Notifications disabled',
+    },
+};
+
+addIcons({
+    alertCircleOutline,
+    chevronDownOutline,
+    chevronUpOutline,
+    closeCircleOutline,
+    notificationsOffOutline,
+    notificationsOutline,
+    refreshOutline,
+});
+const DEFAULT_NAMESPACE$1 = 'Settings.Notifications';
+/**
+ * `val-notification-preferences-view` — **preferencias de notificaciones push**
+ * (FCM) full-feature autocontenida (organism). Promovida desde `showcase` bajo el
+ * proceso de ADR-021.
+ *
+ * Separada de `val-notifications-view` (el inbox / feed). Aquí el user **activa o
+ * desactiva** las notificaciones push en este dispositivo.
+ *
+ * UX simplificado: UN solo toggle que ejecuta toda la secuencia (pedir permiso →
+ * SW ready → getToken → registrar en backend → set master pref) vía
+ * `MessagingService.enable()`. El registro del device en el backend va como
+ * callback (la lib no depende de `AuthService` para evitar ciclos). Mensajes
+ * contextuales y botón "Reintentar" aparecen solo cuando aplican.
+ *
+ * NO renderiza ion-content — vive dentro de val-page-wrapper. `ActivatedRoute` se
+ * inyecta `{ optional: true }` → funciona sin router (embebida / Storybook).
+ */
+class NotificationPreferencesViewComponent {
+    /** Namespace i18n resuelto (capturado para llamadas no-reactivas). */
+    get ns() {
+        return this.resolvedConfig().i18nNamespace;
+    }
+    // ---------------------------------------------------------------------------
+    // Lifecycle
+    // ---------------------------------------------------------------------------
+    constructor() {
+        this.nav = inject(NavigationService);
+        this.i18n = inject(I18nService);
+        this.toast = inject(ToastService);
+        this.auth = inject(AuthService);
+        this.messaging = inject(MessagingService);
+        this.pageRefresh = inject(PageRefreshService);
+        this.prefs = inject(PreferencesService);
+        // `ActivatedRoute` opcional → la vista funciona embebida / en Storybook sin
+        // router (solo lo usa para leer el route data de config como fallback).
+        this.route = inject(ActivatedRoute, { optional: true });
+        this.resolvedConfig = computed(() => {
+            const fromRoute = (this.route?.snapshot.data['notificationPreferencesConfig'] ??
+                {});
+            const merged = { ...fromRoute, ...(this.config ?? {}) };
+            return {
+                showDetails: merged.showDetails ?? true,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$1,
+                onPushEnabled: merged.onPushEnabled,
+                onPushDisabled: merged.onPushDisabled,
+            };
+        });
+        /** Operación en curso (gobierna spinner del toggle + label "Activando…"). */
+        this._busy = signal(null);
+        /** True si el último intento falló — gobierna estado `error` + retry button. */
+        this._lastFailed = signal(false);
+        /** True mientras se re-obtiene el token FCM en background (no afecta la UI). */
+        this._repairingToken = false;
+        /** Toggle del expand de detalles técnicos. */
+        this.showDetails = signal(false);
+        this.permission = signal('default');
+        this.isSupported = signal(false);
+        this.currentToken = signal(null);
+        this.needsIOSInstall = signal(this.detectNeedsIOSInstall());
+        /** FormControl del toggle (sync-eado con `isEnabled` via effect). */
+        this.toggleControl = new FormControl(false, {
+            nonNullable: true,
+        });
+        /** Handler del listener `focus` — referencia guardada para poder removerlo. */
+        this.onWindowFocus = () => this.scheduleBrowserRefresh();
+        /** Timer del debounce del refresh disparado por `focus`. */
+        this.focusDebounceTimer = null;
+        /** Ventana de debounce (ms) para el refresh disparado por `focus`. */
+        this.FOCUS_DEBOUNCE_MS = 500;
+        // ---------------------------------------------------------------------------
+        // Estado derivado
+        // ---------------------------------------------------------------------------
+        this.pageTitle = computed(() => this.tt('pageTitle'));
+        this.pageDescription = computed(() => this.tt('pageDescription'));
+        /**
+         * Estado efectivo del toggle: "el usuario tiene push activo".
+         *
+         * Se deriva SOLO de la decisión del usuario (`master`) y del permiso del SO
+         * (`permission`). El token FCM NO forma parte del estado de UI: vive en
+         * memoria, se pierde en cada recarga/suspensión de la PWA y produciría flicker.
+         * Si falta token con `master && granted`, es un detalle reparable en
+         * background (ver `repairTokenIfNeeded`), no un cambio del toggle.
+         */
+        this.isEnabled = computed(() => this.prefs.notificationsMaster() && this.permission() === 'granted');
+        this.state = computed(() => {
+            if (this.needsIOSInstall())
+                return 'needs-install';
+            if (this.permission() === 'unsupported' || !this.isSupported()) {
+                // iOS standalone aún puede dar isSupported false temprano antes de init —
+                // solo bloqueamos si el browser explícitamente no soporta APIs.
+                if (this.permission() === 'unsupported')
+                    return 'unsupported';
+            }
+            const busy = this._busy();
+            if (busy === 'enabling')
+                return 'enabling';
+            if (busy === 'disabling')
+                return 'disabling';
+            if (this.isEnabled())
+                return 'enabled';
+            if (this.permission() === 'denied')
+                return 'blocked';
+            if (this._lastFailed())
+                return 'error';
+            return 'idle';
+        });
+        this.busyLabel = computed(() => {
+            const s = this.state();
+            if (s === 'enabling')
+                return this.tt('enabling');
+            if (s === 'disabling')
+                return this.tt('disabling');
+            return null;
+        });
+        this.contextMessage = computed(() => {
+            switch (this.state()) {
+                case 'unsupported':
+                    return this.tt('permissionUnsupported');
+                case 'blocked':
+                    return this.tt('permissionDeniedInfo');
+                case 'error':
+                    return this.tt('errorGeneric');
+                default:
+                    return null;
+            }
+        });
+        this.alertVariant = computed(() => {
+            const s = this.state();
+            if (s === 'error' || s === 'blocked')
+                return 'warning';
+            if (s === 'unsupported')
+                return 'danger';
+            return 'info';
+        });
+        this.alertIcon = computed(() => {
+            const s = this.state();
+            if (s === 'unsupported')
+                return 'close-circle-outline';
+            return 'alert-circle-outline';
+        });
+        this.toggleProps = computed(() => ({
+            control: this.toggleControl,
+            color: 'primary',
+            disabled: this._busy() !== null ||
+                this.state() === 'unsupported' ||
+                this.state() === 'needs-install' ||
+                this.state() === 'blocked',
+        }));
+        this.retryButtonProps = computed(() => ({
+            text: this.tt('retryCta'),
+            color: 'dark',
+            fill: 'outline',
+            size: 'default',
+            shape: 'round',
+            type: 'button',
+            icon: { name: 'refresh-outline', slot: 'start' },
+            state: this._busy() !== null ? ComponentStates.WORKING : ComponentStates.ENABLED,
+        }));
+        this.tokenPreview = computed(() => {
+            const t = this.currentToken();
+            if (!t)
+                return null;
+            return `${t.slice(0, 22)}…${t.slice(-6)}`;
+        });
+        const ns = this.ns;
+        if (!this.i18n.hasNamespace(ns)) {
+            this.i18n.registerContent(ns, NOTIFICATION_PREFERENCES_VIEW_I18N);
+        }
+        this.nav.setBackHeader('pageTitle', ns, { withMenu: true });
+        void this.refreshBrowserState();
+        // Re-aplicar header en cambio de idioma.
+        effect(() => {
+            this.i18n.lang();
+            this.nav.setBackHeader('pageTitle', this.ns, { withMenu: true });
+        }, { allowSignalWrites: true });
+        // Sync FormControl ←→ estado efectivo. Cuando el estado cambia (cambio de
+        // permission por el browser, o snapshot Firestore de `master`), el toggle se
+        // re-alinea con la realidad.
+        //
+        // IMPORTANTE: se ignoran los cambios mientras hay una operación en curso
+        // (`_busy() !== null`). Durante `onEnable`/`onDisable` las señales fuente se
+        // actualizan en momentos distintos y producirían estados intermedios →
+        // flicker visible. El toggle se re-alinea UNA sola vez en el `finally`.
+        effect(() => {
+            const eff = this.isEnabled();
+            if (this._busy() !== null)
+                return;
+            if (this.toggleControl.value !== eff) {
+                this.toggleControl.setValue(eff, { emitEvent: false });
+            }
+        }, { allowSignalWrites: true });
+        // Interceptar click del user: el toggle ya cambió visualmente, ejecutar
+        // la acción correspondiente.
+        this.toggleControl.valueChanges.subscribe(v => {
+            if (this._busy() !== null)
+                return;
+            if (v && !this.isEnabled()) {
+                void this.onEnable();
+            }
+            else if (!v && this.isEnabled()) {
+                void this.onDisable();
+            }
+        });
+        // Detectar regreso a la pestaña — el user pudo haber cambiado permisos
+        // desde la config del browser. El refresh va con debounce para no
+        // dispararse en ráfagas (en PWA mobile `focus` salta con cada cambio de
+        // app / aparición del teclado). El listener se remueve en ngOnDestroy.
+        if (typeof window !== 'undefined') {
+            window.addEventListener('focus', this.onWindowFocus);
+        }
+    }
+    /**
+     * Registra el pull-to-refresh estándar. Aunque esta vista no muestra una
+     * lista remota, sí refleja estado mutable del browser (permiso, token,
+     * soporte FCM) que puede cambiar fuera de la app — el refresh re-evalúa todo.
+     *
+     * Se usa `ngOnInit`/`ngOnDestroy` (NO `ionViewWillEnter`) porque
+     * `val-page-wrapper` usa `<router-outlet>` plano — los hooks `ionView*` solo
+     * disparan dentro de `<ion-router-outlet>`.
+     */
+    ngOnInit() {
+        this.pageRefresh.register(() => this.refreshBrowserState());
+    }
+    ngOnDestroy() {
+        this.pageRefresh.unregister();
+        if (typeof window !== 'undefined') {
+            window.removeEventListener('focus', this.onWindowFocus);
+        }
+        if (this.focusDebounceTimer !== null) {
+            clearTimeout(this.focusDebounceTimer);
+            this.focusDebounceTimer = null;
+        }
+    }
+    /** Refresca el estado del browser con debounce — evita ráfagas de `focus`. */
+    scheduleBrowserRefresh() {
+        if (this.focusDebounceTimer !== null) {
+            clearTimeout(this.focusDebounceTimer);
+        }
+        this.focusDebounceTimer = setTimeout(() => {
+            this.focusDebounceTimer = null;
+            void this.refreshBrowserState();
+        }, this.FOCUS_DEBOUNCE_MS);
+    }
+    // ---------------------------------------------------------------------------
+    // Actions
+    // ---------------------------------------------------------------------------
+    /**
+     * Secuencia completa de activación.
+     *
+     * Toda la mecánica (permission → SW ready → getToken con retry → watchdog de
+     * auto-reload) vive en `MessagingService.enable()` de la lib. El paso de
+     * registro del device en el backend se pasa como callback (`registerDevice`)
+     * porque la lib no puede depender de `AuthService` sin crear un ciclo.
+     *
+     * `enable()` no hace throw: resuelve con un `EnablePushResult` descriptivo.
+     */
+    async onEnable() {
+        this._busy.set('enabling');
+        this._lastFailed.set(false);
+        try {
+            const result = await this.messaging.enable({
+                registerDevice: token => this.auth.registerDevice(token).then(r => r.registered),
+            });
+            if (result.status === 'enabled') {
+                // Persistir flag master si aún no estaba activo.
+                if (!this.prefs.notificationsMaster()) {
+                    await this.prefs.setNotificationsMaster(true);
+                }
+                this.toast.show({
+                    message: this.tt('enableSuccess'),
+                    duration: 2000,
+                    color: 'dark',
+                    position: 'top',
+                });
+                this.resolvedConfig().onPushEnabled?.();
+            }
+            else if (result.status === 'timeout' && result.reloaded) {
+                // La lib disparó el auto-reload — la página está por recargarse.
+                return;
+            }
+            else {
+                // denied / unsupported / error / timeout sin reload → fallo recuperable.
+                this._lastFailed.set(true);
+                this.toast.show({
+                    message: this.tt('errorGeneric'),
+                    duration: 3000,
+                    color: 'dark',
+                    position: 'top',
+                });
+            }
+        }
+        catch {
+            // `enable()` no hace throw, pero el callback de registro sí puede.
+            this._lastFailed.set(true);
+            this.toast.show({
+                message: this.tt('errorGeneric'),
+                duration: 3000,
+                color: 'dark',
+                position: 'top',
+            });
+        }
+        finally {
+            // Único refresh final: re-alinea el toggle UNA sola vez con el estado real.
+            await this.refreshBrowserState();
+            this._busy.set(null);
+        }
+    }
+    async onDisable() {
+        this._busy.set('disabling');
+        this._lastFailed.set(false);
+        try {
+            await this.auth.disableNotifications();
+            if (this.prefs.notificationsMaster()) {
+                await this.prefs.setNotificationsMaster(false);
+            }
+            this.toast.show({
+                message: this.tt('disableSuccess'),
+                duration: 2000,
+                color: 'dark',
+                position: 'top',
+            });
+            this.resolvedConfig().onPushDisabled?.();
+        }
+        catch {
+            this._lastFailed.set(true);
+        }
+        finally {
+            await this.refreshBrowserState();
+            this._busy.set(null);
+        }
+    }
+    /** Reintentar la secuencia completa de activación, sin importar el estado actual. */
+    async onRetry() {
+        this._lastFailed.set(false);
+        await this.onEnable();
+    }
+    toggleDetails() {
+        this.showDetails.update(v => !v);
+    }
+    // ---------------------------------------------------------------------------
+    // Privados
+    // ---------------------------------------------------------------------------
+    async refreshBrowserState() {
+        this.isSupported.set(await this.messaging.isSupported());
+        this.permission.set(this.auth.getNotificationPermissionState());
+        this.currentToken.set(this.messaging.currentToken ?? null);
+        void this.repairTokenIfNeeded();
+    }
+    /**
+     * Repara el token FCM en background.
+     *
+     * Si el usuario tiene push activo (`master && granted`) pero no hay token en
+     * memoria — caso típico tras un cold start de la PWA — re-obtenemos el token
+     * y re-registramos el device sin tocar el toggle ni mostrar un error
+     * alarmista. El token es un detalle de implementación reparable, no parte del
+     * estado de UI (ver `isEnabled`).
+     */
+    async repairTokenIfNeeded() {
+        if (this._busy() !== null)
+            return;
+        if (this._repairingToken)
+            return;
+        if (!this.isEnabled())
+            return;
+        if (this.currentToken())
+            return;
+        this._repairingToken = true;
+        try {
+            const token = await this.messaging.getToken();
+            if (token) {
+                this.currentToken.set(token);
+                await this.auth.registerDevice(token);
+            }
+        }
+        catch {
+            // Reparación best-effort: no degradamos el toggle ni mostramos error.
+        }
+        finally {
+            this._repairingToken = false;
+        }
+    }
+    /**
+     * iOS browser sin estar instalado como PWA — push web no disponible.
+     * Aplica a Safari y a Edge/Chrome/Firefox en iOS (todos WebKit por mandato Apple).
+     */
+    detectNeedsIOSInstall() {
+        if (typeof window === 'undefined' || typeof navigator === 'undefined') {
+            return false;
+        }
+        const ua = navigator.userAgent || '';
+        const isIOS = /iPad|iPhone|iPod/.test(ua);
+        if (!isIOS)
+            return false;
+        const isStandalone = window.matchMedia?.('(display-mode: standalone)').matches ||
+            navigator.standalone === true;
+        return !isStandalone;
+    }
+    tt(key) {
+        return this.i18n.t(key, this.ns);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: NotificationPreferencesViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: NotificationPreferencesViewComponent, isStandalone: true, selector: "val-notification-preferences-view", inputs: { config: "config" }, ngImport: i0, template: `
+    <div class="page">
+      <header class="page-header">
+        <val-display [props]="{ size: 'small', color: 'dark', content: pageTitle() }" />
+        <val-title
+          [props]="{
+            size: 'large',
+            color: 'dark',
+            bold: false,
+            content: pageDescription(),
+          }"
+        />
+      </header>
+
+      @if (state() === 'needs-install') {
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('iosInstallTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                size: 'small',
+                color: 'medium',
+                bold: false,
+                content: tt('iosInstallHint'),
+              }"
+            />
+            <ol class="install-steps">
+              <li>{{ tt('iosInstallStep1') }}</li>
+              <li>{{ tt('iosInstallStep2') }}</li>
+              <li>{{ tt('iosInstallStep3') }}</li>
+              <li>{{ tt('iosInstallStep4') }}</li>
+            </ol>
+          </div>
+        </section>
+      }
+
+      <section class="settings-section">
+        <div class="notif-row">
+          <div class="notif-row__icon">
+            <ion-icon name="notifications-outline" aria-hidden="true" />
+          </div>
+          <div class="notif-row__body">
+            <val-title
+              [props]="{
+                size: 'medium',
+                color: 'dark',
+                bold: true,
+                content: tt('simpleTitle'),
+              }"
+            />
+            <val-text
+              [props]="{
+                size: 'small',
+                color: 'medium',
+                bold: false,
+                content: tt('simpleDescription'),
+              }"
+            />
+            @if (busyLabel(); as label) {
+              <span class="notif-row__busy">{{ label }}</span>
+            }
+          </div>
+          <div class="notif-row__control">
+            <val-toggle-input [props]="toggleProps()" />
+          </div>
+        </div>
+
+        @if (contextMessage(); as msg) {
+          <div class="alert" [class]="'alert--' + alertVariant()">
+            <ion-icon [name]="alertIcon()" aria-hidden="true" />
+            <span>{{ msg }}</span>
+          </div>
+        }
+
+        @if (state() === 'error') {
+          <div class="row-actions">
+            <val-button [props]="retryButtonProps()" (click)="onRetry()" />
+          </div>
+        }
+      </section>
+
+      @if (resolvedConfig().showDetails && state() !== 'needs-install' && state() !== 'unsupported') {
+        <section class="settings-section">
+          <button class="details-toggle" type="button" (click)="toggleDetails()">
+            <span>{{ showDetails() ? tt('detailsHide') : tt('detailsShow') }}</span>
+            <ion-icon [name]="showDetails() ? 'chevron-up-outline' : 'chevron-down-outline'" aria-hidden="true" />
+          </button>
+          @if (showDetails()) {
+            <dl class="details">
+              <div class="details__row">
+                <dt>{{ tt('detailsToken') }}</dt>
+                <dd>{{ tokenPreview() ?? tt('detailsNone') }}</dd>
+              </div>
+              <div class="details__row">
+                <dt>{{ tt('diagnosticsPermission') }}</dt>
+                <dd>{{ permission() }}</dd>
+              </div>
+              <div class="details__row">
+                <dt>{{ tt('diagnosticsSupported') }}</dt>
+                <dd>{{ isSupported() ? '✓' : '✗' }}</dd>
+              </div>
+            </dl>
+          }
+        </section>
+      }
+    </div>
+  `, isInline: true, styles: [".page{padding:16px 0;max-width:720px;margin:0 auto}.page-header{margin-bottom:8px}.settings-section{padding:16px 0}.settings-section+.settings-section{border-top:1px solid var(--val-border-color, rgba(0, 0, 0, .08))}.section-body{margin-top:16px;display:flex;flex-direction:column;gap:10px}.row-actions{margin-top:12px}.notif-row{display:grid;grid-template-columns:44px 1fr auto;gap:16px;align-items:center}.notif-row__icon{width:44px;height:44px;border-radius:50%;background:var(--ion-color-light, rgba(0, 0, 0, .06));display:flex;align-items:center;justify-content:center}.notif-row__icon ion-icon{font-size:22px;color:var(--ion-color-dark, #1a1a1a)}.notif-row__body{display:flex;flex-direction:column;gap:4px;min-width:0}.notif-row__busy{font-size:12px;color:var(--ion-color-medium, #92949c);font-style:italic;margin-top:4px}.notif-row__control{flex-shrink:0}.alert{display:flex;gap:10px;align-items:flex-start;margin-top:12px;padding:12px 14px;border-radius:10px;font-size:13px;line-height:1.45;background:var(--ion-color-light, rgba(0, 0, 0, .04));color:var(--ion-color-dark, #1a1a1a)}.alert ion-icon{font-size:18px;flex-shrink:0;margin-top:1px}.alert--warning ion-icon{color:var(--ion-color-warning-shade, #c79e08)}.alert--danger ion-icon{color:var(--ion-color-danger-shade, #cf3c4f)}.alert--info ion-icon{color:var(--ion-color-medium, #6b6b6b)}.install-steps{margin:0;padding-left:20px;font-size:13px;line-height:1.6;color:var(--ion-color-dark, #1a1a1a)}.install-steps li+li{margin-top:4px}.details-toggle{display:flex;align-items:center;gap:6px;background:none;border:0;padding:0;font-size:13px;color:var(--ion-color-medium, #6b6b6b);cursor:pointer}.details-toggle ion-icon{font-size:14px}.details{margin:12px 0 0;display:flex;flex-direction:column;gap:6px}.details__row{display:grid;grid-template-columns:140px 1fr;gap:12px;font-size:12px;align-items:baseline}.details__row dt{margin:0;color:var(--ion-color-medium, #6b6b6b);text-transform:uppercase;letter-spacing:.4px;font-weight:500}.details__row dd{margin:0;color:var(--ion-color-dark, #1a1a1a);font-family:ui-monospace,SFMono-Regular,monospace;font-size:11px;word-break:break-all}\n"], dependencies: [{ kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: ToggleInputComponent, selector: "val-toggle-input", inputs: ["preset", "props"] }, { kind: "component", type: ButtonComponent, selector: "val-button", inputs: ["preset", "props"], outputs: ["onClick"] }, { kind: "component", type: DisplayComponent, selector: "val-display", inputs: ["props"] }, { kind: "component", type: TitleComponent, selector: "val-title", inputs: ["props"] }, { kind: "component", type: TextComponent, selector: "val-text", inputs: ["props"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: NotificationPreferencesViewComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'val-notification-preferences-view', standalone: true, imports: [IonIcon, ToggleInputComponent, ButtonComponent, DisplayComponent, TitleComponent, TextComponent], template: `
+    <div class="page">
+      <header class="page-header">
+        <val-display [props]="{ size: 'small', color: 'dark', content: pageTitle() }" />
+        <val-title
+          [props]="{
+            size: 'large',
+            color: 'dark',
+            bold: false,
+            content: pageDescription(),
+          }"
+        />
+      </header>
+
+      @if (state() === 'needs-install') {
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('iosInstallTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                size: 'small',
+                color: 'medium',
+                bold: false,
+                content: tt('iosInstallHint'),
+              }"
+            />
+            <ol class="install-steps">
+              <li>{{ tt('iosInstallStep1') }}</li>
+              <li>{{ tt('iosInstallStep2') }}</li>
+              <li>{{ tt('iosInstallStep3') }}</li>
+              <li>{{ tt('iosInstallStep4') }}</li>
+            </ol>
+          </div>
+        </section>
+      }
+
+      <section class="settings-section">
+        <div class="notif-row">
+          <div class="notif-row__icon">
+            <ion-icon name="notifications-outline" aria-hidden="true" />
+          </div>
+          <div class="notif-row__body">
+            <val-title
+              [props]="{
+                size: 'medium',
+                color: 'dark',
+                bold: true,
+                content: tt('simpleTitle'),
+              }"
+            />
+            <val-text
+              [props]="{
+                size: 'small',
+                color: 'medium',
+                bold: false,
+                content: tt('simpleDescription'),
+              }"
+            />
+            @if (busyLabel(); as label) {
+              <span class="notif-row__busy">{{ label }}</span>
+            }
+          </div>
+          <div class="notif-row__control">
+            <val-toggle-input [props]="toggleProps()" />
+          </div>
+        </div>
+
+        @if (contextMessage(); as msg) {
+          <div class="alert" [class]="'alert--' + alertVariant()">
+            <ion-icon [name]="alertIcon()" aria-hidden="true" />
+            <span>{{ msg }}</span>
+          </div>
+        }
+
+        @if (state() === 'error') {
+          <div class="row-actions">
+            <val-button [props]="retryButtonProps()" (click)="onRetry()" />
+          </div>
+        }
+      </section>
+
+      @if (resolvedConfig().showDetails && state() !== 'needs-install' && state() !== 'unsupported') {
+        <section class="settings-section">
+          <button class="details-toggle" type="button" (click)="toggleDetails()">
+            <span>{{ showDetails() ? tt('detailsHide') : tt('detailsShow') }}</span>
+            <ion-icon [name]="showDetails() ? 'chevron-up-outline' : 'chevron-down-outline'" aria-hidden="true" />
+          </button>
+          @if (showDetails()) {
+            <dl class="details">
+              <div class="details__row">
+                <dt>{{ tt('detailsToken') }}</dt>
+                <dd>{{ tokenPreview() ?? tt('detailsNone') }}</dd>
+              </div>
+              <div class="details__row">
+                <dt>{{ tt('diagnosticsPermission') }}</dt>
+                <dd>{{ permission() }}</dd>
+              </div>
+              <div class="details__row">
+                <dt>{{ tt('diagnosticsSupported') }}</dt>
+                <dd>{{ isSupported() ? '✓' : '✗' }}</dd>
+              </div>
+            </dl>
+          }
+        </section>
+      }
+    </div>
+  `, styles: [".page{padding:16px 0;max-width:720px;margin:0 auto}.page-header{margin-bottom:8px}.settings-section{padding:16px 0}.settings-section+.settings-section{border-top:1px solid var(--val-border-color, rgba(0, 0, 0, .08))}.section-body{margin-top:16px;display:flex;flex-direction:column;gap:10px}.row-actions{margin-top:12px}.notif-row{display:grid;grid-template-columns:44px 1fr auto;gap:16px;align-items:center}.notif-row__icon{width:44px;height:44px;border-radius:50%;background:var(--ion-color-light, rgba(0, 0, 0, .06));display:flex;align-items:center;justify-content:center}.notif-row__icon ion-icon{font-size:22px;color:var(--ion-color-dark, #1a1a1a)}.notif-row__body{display:flex;flex-direction:column;gap:4px;min-width:0}.notif-row__busy{font-size:12px;color:var(--ion-color-medium, #92949c);font-style:italic;margin-top:4px}.notif-row__control{flex-shrink:0}.alert{display:flex;gap:10px;align-items:flex-start;margin-top:12px;padding:12px 14px;border-radius:10px;font-size:13px;line-height:1.45;background:var(--ion-color-light, rgba(0, 0, 0, .04));color:var(--ion-color-dark, #1a1a1a)}.alert ion-icon{font-size:18px;flex-shrink:0;margin-top:1px}.alert--warning ion-icon{color:var(--ion-color-warning-shade, #c79e08)}.alert--danger ion-icon{color:var(--ion-color-danger-shade, #cf3c4f)}.alert--info ion-icon{color:var(--ion-color-medium, #6b6b6b)}.install-steps{margin:0;padding-left:20px;font-size:13px;line-height:1.6;color:var(--ion-color-dark, #1a1a1a)}.install-steps li+li{margin-top:4px}.details-toggle{display:flex;align-items:center;gap:6px;background:none;border:0;padding:0;font-size:13px;color:var(--ion-color-medium, #6b6b6b);cursor:pointer}.details-toggle ion-icon{font-size:14px}.details{margin:12px 0 0;display:flex;flex-direction:column;gap:6px}.details__row{display:grid;grid-template-columns:140px 1fr;gap:12px;font-size:12px;align-items:baseline}.details__row dt{margin:0;color:var(--ion-color-medium, #6b6b6b);text-transform:uppercase;letter-spacing:.4px;font-weight:500}.details__row dd{margin:0;color:var(--ion-color-dark, #1a1a1a);font-family:ui-monospace,SFMono-Regular,monospace;font-size:11px;word-break:break-all}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { config: [{
+                type: Input
+            }] } });
+
+/**
+ * Helper para montar las **preferencias de notificaciones push**
+ * (`val-notification-preferences-view`) como ruta en una app del factory. El
+ * `config` se pasa por route `data` (`notificationPreferencesConfig`) y el
+ * componente lo lee como fallback de su `@Input() config`.
+ *
+ * No confundir con `provideValtechNotificationsRoutes` (el inbox / feed).
+ *
+ * @example
+ * ```ts
+ * // app.routes.ts (típicamente bajo settings)
+ * export const settingsRoutes: Routes = [
+ *   ...provideValtechNotificationPreferencesRoutes(),       // → notifications
+ * ];
+ *
+ * // con config acotada:
+ * ...provideValtechNotificationPreferencesRoutes({ config: { showDetails: false } }),
+ * ...provideValtechNotificationPreferencesRoutes({ path: 'push' }),
+ * ```
+ */
+function provideValtechNotificationPreferencesRoutes(opts) {
+    return [
+        {
+            path: opts?.path ?? 'notifications',
+            component: NotificationPreferencesViewComponent,
+            data: { notificationPreferencesConfig: opts?.config },
+        },
+    ];
+}
+
+/**
+ * Consume el catálogo de permisos del backend (`GET /org/{orgId}/permissions-catalog`).
+ * El backend es la fuente de verdad de qué permisos existen y de su alcance
+ * (globales de plataforma vs. propios de una app). La respuesta incluye el
+ * `appId` del request para que la vista distinga la app actual.
+ *
+ * Promovido desde `showcase` a la lib bajo el proceso de ADR-021. Usa
+ * `VALTECH_AUTH_CONFIG.apiUrl` (como `OrgService`) en vez del `environment` de la
+ * app — la lib no importa el environment del consumer.
+ */
+class PermissionCatalogService {
+    constructor(config, http) {
+        this.config = config;
+        this.http = http;
+    }
+    getCatalog(orgId) {
+        return this.http.get(`${this.config.apiUrl}/org/${orgId}/permissions-catalog`);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PermissionCatalogService, deps: [{ token: VALTECH_AUTH_CONFIG }, { token: i1$3.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PermissionCatalogService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PermissionCatalogService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [VALTECH_AUTH_CONFIG]
+                }] }, { type: i1$3.HttpClient }] });
+
+/**
+ * Defaults i18n (es/en) embebidos en `val-permissions-view`. Auto-registrados en
+ * el constructor del componente si el consumer no proveyó el namespace
+ * (`Settings.Permissions` por default). SOLO incluye las keys que la vista usa.
+ *
+ * Portado EXACTO de `PERMISSIONS_I18N` (showcase) bajo el proceso de ADR-021.
+ */
+const PERMISSIONS_VIEW_I18N = {
+    es: {
+        pageTitle: 'Permisos',
+        pageDescription: 'Roles y permisos de esta app en la organización activa',
+        systemRolesTitle: 'Roles del sistema',
+        systemRolesHint: 'Predefinidos por la plataforma. No editables.',
+        customRolesTitle: 'Roles personalizados',
+        customRolesHint: 'Definidos por tu organización.',
+        systemBadge: 'Sistema',
+        noCustomRoles: 'Esta organización no tiene roles personalizados.',
+        noPermissions: 'Sin permisos asignados.',
+        // Grupos de alcance
+        groupApp: 'Permisos de la app',
+        groupPlatform: 'Permisos de plataforma',
+        groupOther: 'Otras apps',
+        // Roles del sistema
+        roleViewer: 'Visor',
+        roleEditor: 'Editor',
+        roleAdmin: 'Administrador',
+        roleSuperAdmin: 'Super Administrador',
+        roleBingoAdmin: 'Bingo · Administrador',
+        roleBingoTesorero: 'Bingo · Tesorero',
+        roleBingoTaquilla: 'Bingo · Taquilla',
+        roleBingoOperator: 'Bingo · Operador',
+        // Apps
+        app_showcase: 'Showcase',
+        app_bingo: 'Bingo',
+        // Recursos
+        permUsers: 'Usuarios',
+        permRoles: 'Roles',
+        permRbac: 'Control de acceso',
+        permApps: 'Apps',
+        'permApi-keys': 'API keys',
+        'permEmail-logs': 'Logs de correo',
+        'permSms-logs': 'Logs de SMS',
+        permDocuments: 'Documentos',
+        permMedia: 'Media',
+        permTemplates: 'Plantillas',
+        permRequests: 'Solicitudes',
+        permBingo: 'Bingo',
+        // Acciones
+        permRead: 'Leer',
+        permWrite: 'Escribir',
+        permCreate: 'Crear',
+        permDelete: 'Eliminar',
+        permManage: 'Gestionar',
+        permEdit: 'Editar',
+        permSell: 'Vender',
+        permCheckin: 'Canjear',
+        permSettle: 'Rendir',
+        permExport: 'Exportar',
+        permOperate: 'Operar',
+        permAll: 'Todo',
+        // Loading / error
+        errorTitle: 'Error al cargar permisos',
+        retry: 'Reintentar',
+    },
+    en: {
+        pageTitle: 'Permissions',
+        pageDescription: 'Roles and permissions of this app in the active organization',
+        systemRolesTitle: 'System roles',
+        systemRolesHint: 'Defined by the platform. Not editable.',
+        customRolesTitle: 'Custom roles',
+        customRolesHint: 'Defined by your organization.',
+        systemBadge: 'System',
+        noCustomRoles: 'This organization has no custom roles.',
+        noPermissions: 'No permissions assigned.',
+        groupApp: 'App permissions',
+        groupPlatform: 'Platform permissions',
+        groupOther: 'Other apps',
+        roleViewer: 'Viewer',
+        roleEditor: 'Editor',
+        roleAdmin: 'Administrator',
+        roleSuperAdmin: 'Super Administrator',
+        roleBingoAdmin: 'Bingo · Administrator',
+        roleBingoTesorero: 'Bingo · Treasurer',
+        roleBingoTaquilla: 'Bingo · Box office',
+        roleBingoOperator: 'Bingo · Operator',
+        app_showcase: 'Showcase',
+        app_bingo: 'Bingo',
+        permUsers: 'Users',
+        permRoles: 'Roles',
+        permRbac: 'Access control',
+        permApps: 'Apps',
+        'permApi-keys': 'API keys',
+        'permEmail-logs': 'Email logs',
+        'permSms-logs': 'SMS logs',
+        permDocuments: 'Documents',
+        permMedia: 'Media',
+        permTemplates: 'Templates',
+        permRequests: 'Requests',
+        permBingo: 'Bingo',
+        permRead: 'Read',
+        permWrite: 'Write',
+        permCreate: 'Create',
+        permDelete: 'Delete',
+        permManage: 'Manage',
+        permEdit: 'Edit',
+        permSell: 'Sell',
+        permCheckin: 'Check-in',
+        permSettle: 'Settle',
+        permExport: 'Export',
+        permOperate: 'Operate',
+        permAll: 'All',
+        errorTitle: 'Error loading permissions',
+        retry: 'Retry',
+    },
+};
+
+const DEFAULT_NAMESPACE = 'Settings.Permissions';
+/**
+ * `val-permissions-view` — vista Permisos full-feature autocontenida (organism).
+ * Visor RBAC de solo lectura: muestra los roles del sistema (Visor/Editor/Admin +
+ * roles de plataforma) y los roles personalizados de la org activa, con el
+ * catálogo de permisos agrupado por alcance (app actual / plataforma / otras apps).
+ * Promovida desde `showcase` bajo el proceso de ADR-021.
+ *
+ * **RBAC interno** (como `organization-view`): lee la org activa vía
+ * `AuthService.user().activeOrgId`. La vista NO muta nada — el control de quién
+ * puede verla es responsabilidad del guard de ruta del consumer; no hay gating
+ * fino interno ni se expone como config.
+ *
+ * Datos: `forkJoin` de `OrgService.listOrgRoles(orgId)` (roles de la org) +
+ * `PermissionCatalogService.getCatalog(orgId)` (catálogo + appId actual). El
+ * catálogo define el alcance (`scope`/`appId`) de cada recurso para agrupar.
+ *
+ * NO renderiza ion-content — vive dentro de val-page-wrapper. `ActivatedRoute` se
+ * inyecta `{ optional: true }` solo para leer el route data de config. Auto-registra
+ * sus defaults i18n (es/en) si el consumer no proveyó el namespace (default
+ * `Settings.Permissions`).
+ */
+class PermissionsViewComponent {
+    /** Namespace i18n resuelto (capturado para llamadas no-reactivas). */
+    get ns() {
+        return this.resolvedConfig().i18nNamespace;
+    }
+    constructor() {
+        this.i18n = inject(I18nService);
+        this.orgService = inject(OrgService);
+        this.catalog = inject(PermissionCatalogService);
+        this.auth = inject(AuthService);
+        this.nav = inject(NavigationService);
+        this.route = inject(ActivatedRoute, { optional: true });
+        this.resolvedConfig = computed(() => {
+            const fromRoute = (this.route?.snapshot.data['permissionsConfig'] ?? {});
+            const merged = { ...fromRoute, ...(this.config ?? {}) };
+            return {
+                showSystemRoles: merged.showSystemRoles ?? true,
+                showCustomRoles: merged.showCustomRoles ?? true,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE,
+            };
+        });
+        this.loading = signal(false);
+        this.loadError = signal(null);
+        this.roles = signal([]);
+        this.systemRoles = computed(() => this.roles().filter(r => r.isSystem));
+        this.customRoles = computed(() => this.roles().filter(r => !r.isSystem));
+        this.activeOrgId = computed(() => {
+            const u = this.auth.user();
+            return u?.activeOrgId ?? u?.activeOrg ?? '';
+        });
+        this.retryButtonProps = computed(() => ({
+            text: this.tt('retry'),
+            color: 'dark',
+            fill: 'outline',
+            size: 'default',
+            type: 'button',
+            state: this.loading() ? ComponentStates.DISABLED : ComponentStates.ENABLED,
+        }));
+        const ns = this.ns;
+        if (!this.i18n.hasNamespace(ns)) {
+            this.i18n.registerContent(ns, PERMISSIONS_VIEW_I18N);
+        }
+        this.nav.setBackHeader('pageTitle', ns, { withMenu: true });
+        this.load();
+        connectPageRefresh(() => this.load());
+    }
+    load() {
+        const orgId = this.activeOrgId();
+        if (!orgId)
+            return;
+        this.loading.set(true);
+        this.loadError.set(null);
+        forkJoin({
+            roles: this.orgService.listOrgRoles(orgId),
+            catalog: this.catalog.getCatalog(orgId),
+        }).subscribe({
+            next: ({ roles: rawRoles, catalog }) => {
+                const byResource = new Map();
+                for (const r of catalog.permissions)
+                    byResource.set(r.resource, r);
+                const currentAppId = catalog.appId;
+                this.roles.set((rawRoles ?? []).map((r) => this.buildRoleView({
+                    id: r.id,
+                    name: r.name,
+                    description: r.description,
+                    permissions: r.permissions ?? [],
+                    isSystem: r.isSystem ?? false,
+                }, byResource, currentAppId)));
+                this.loading.set(false);
+            },
+            error: err => {
+                this.loadError.set(err);
+                this.loading.set(false);
+            },
+        });
+    }
+    buildRoleView(role, byResource, currentAppId) {
+        const appPerms = [];
+        const platformPerms = [];
+        const otherByApp = new Map();
+        for (const perm of role.permissions) {
+            const [resource, action] = perm.split(':');
+            const label = this.permLabel(resource, action);
+            const entry = byResource.get(resource);
+            if (entry?.scope === 'app') {
+                if (entry.appId === currentAppId) {
+                    appPerms.push(label);
+                }
+                else {
+                    const appId = entry.appId ?? '?';
+                    const arr = otherByApp.get(appId) ?? [];
+                    arr.push(label);
+                    otherByApp.set(appId, arr);
+                }
+            }
+            else {
+                // global o desconocido → plataforma
+                platformPerms.push(label);
+            }
+        }
+        const groups = [];
+        if (appPerms.length) {
+            groups.push({ key: 'app', label: this.tt('groupApp'), perms: appPerms });
+        }
+        if (platformPerms.length) {
+            groups.push({
+                key: 'platform',
+                label: this.tt('groupPlatform'),
+                perms: platformPerms,
+            });
+        }
+        for (const [appId, perms] of otherByApp) {
+            groups.push({
+                key: `other:${appId}`,
+                label: `${this.tt('groupOther')}: ${this.appLabel(appId)}`,
+                perms,
+            });
+        }
+        return {
+            id: role.id,
+            name: role.name,
+            description: role.description,
+            isSystem: role.isSystem,
+            groups,
+            hasPerms: groups.length > 0,
+        };
+    }
+    tt(key) {
+        return this.i18n.t(key, this.ns);
+    }
+    appLabel(appId) {
+        const key = `app_${appId}`;
+        const label = this.tt(key);
+        return label === key ? appId : label;
+    }
+    roleLabel(name) {
+        const map = {
+            viewer: 'roleViewer',
+            editor: 'roleEditor',
+            admin: 'roleAdmin',
+            super_admin: 'roleSuperAdmin',
+            bingo_admin: 'roleBingoAdmin',
+            bingo_tesorero: 'roleBingoTesorero',
+            bingo_taquilla: 'roleBingoTaquilla',
+            bingo_operator: 'roleBingoOperator',
+        };
+        return this.tt(map[name] ?? name);
+    }
+    permLabel(resource, action) {
+        if (resource === '*' && action === '*')
+            return this.tt('permAll');
+        const resKey = resource === '*' ? 'permAll' : `perm${resource.charAt(0).toUpperCase()}${resource.slice(1)}`;
+        const actKey = action === '*' ? 'permAll' : `perm${action.charAt(0).toUpperCase()}${action.slice(1)}`;
+        const res = this.tt(resKey);
+        const act = this.tt(actKey);
+        return `${res}: ${act}`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PermissionsViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: PermissionsViewComponent, isStandalone: true, selector: "val-permissions-view", inputs: { config: "config" }, ngImport: i0, template: `
+    <div class="page">
+      <header class="page-header">
+        <val-display [props]="{ size: 'small', color: 'dark', content: tt('pageTitle') }" />
+        <val-title
+          [props]="{
+            size: 'large',
+            color: 'dark',
+            bold: false,
+            content: tt('pageDescription'),
+          }"
+        />
+      </header>
+
+      @if (loading()) {
+        <div class="spinner-row">
+          <ion-spinner name="crescent" />
+        </div>
+      } @else if (loadError()) {
+        <div class="error-row">
+          <val-text
+            [props]="{
+              content: tt('errorTitle'),
+              size: 'medium',
+              color: 'medium',
+              bold: false,
+            }"
+          />
+          <val-button [props]="retryButtonProps()" (click)="load()" />
+        </div>
+      } @else {
+        @if (resolvedConfig().showSystemRoles) {
+          <section class="perm-section">
+            <div class="perm-section__header">
+              <val-title
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: true,
+                  content: tt('systemRolesTitle'),
+                }"
+              />
+              <val-text
+                [props]="{
+                  content: tt('systemRolesHint'),
+                  size: 'medium',
+                  color: 'medium',
+                  bold: false,
+                }"
+              />
+            </div>
+            <div class="role-list">
+              @for (role of systemRoles(); track role.id) {
+                <div class="role-card">
+                  <div class="role-card__header">
+                    <span class="role-card__name">{{ roleLabel(role.name) }}</span>
+                    <val-pill
+                      [props]="{
+                        label: tt('systemBadge'),
+                        color: 'primary',
+                        weight: 'bold',
+                      }"
+                    />
+                  </div>
+                  @if (role.description) {
+                    <span class="role-card__desc">{{ role.description }}</span>
+                  }
+                  @if (!role.hasPerms) {
+                    <div class="perm-chips">
+                      <span class="perm-chip perm-chip--empty">{{ tt('noPermissions') }}</span>
+                    </div>
+                  } @else {
+                    @for (g of role.groups; track g.key) {
+                      <div class="perm-group">
+                        <span class="perm-group__label">{{ g.label }}</span>
+                        <div class="perm-chips">
+                          @for (p of g.perms; track p) {
+                            <span class="perm-chip">{{ p }}</span>
+                          }
+                        </div>
+                      </div>
+                    }
+                  }
+                </div>
+              }
+            </div>
+          </section>
+        }
+
+        @if (resolvedConfig().showCustomRoles) {
+          <section class="perm-section">
+            <div class="perm-section__header">
+              <val-title
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: true,
+                  content: tt('customRolesTitle'),
+                }"
+              />
+              <val-text
+                [props]="{
+                  content: tt('customRolesHint'),
+                  size: 'medium',
+                  color: 'medium',
+                  bold: false,
+                }"
+              />
+            </div>
+            @if (customRoles().length === 0) {
+              <val-text
+                [props]="{
+                  content: tt('noCustomRoles'),
+                  size: 'medium',
+                  color: 'medium',
+                  bold: false,
+                }"
+              />
+            } @else {
+              <div class="role-list">
+                @for (role of customRoles(); track role.id) {
+                  <div class="role-card">
+                    <div class="role-card__header">
+                      <span class="role-card__name">{{ role.name }}</span>
+                    </div>
+                    @if (role.description) {
+                      <span class="role-card__desc">{{ role.description }}</span>
+                    }
+                    @if (!role.hasPerms) {
+                      <div class="perm-chips">
+                        <span class="perm-chip perm-chip--empty">{{ tt('noPermissions') }}</span>
+                      </div>
+                    } @else {
+                      @for (g of role.groups; track g.key) {
+                        <div class="perm-group">
+                          <span class="perm-group__label">{{ g.label }}</span>
+                          <div class="perm-chips">
+                            @for (p of g.perms; track p) {
+                              <span class="perm-chip">{{ p }}</span>
+                            }
+                          </div>
+                        </div>
+                      }
+                    }
+                  </div>
+                }
+              </div>
+            }
+          </section>
+        }
+      }
+    </div>
+  `, isInline: true, styles: [".page{padding:16px 0;max-width:720px;margin:0 auto}.page-header{margin-bottom:24px}.spinner-row,.error-row{display:flex;flex-direction:column;align-items:center;gap:16px;padding:32px 0}.perm-section{margin-bottom:32px}.perm-section__header{margin-bottom:12px}.role-list{display:flex;flex-direction:column;gap:10px}.role-card{border:1.5px solid var(--ion-color-light);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}.role-card__header{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.role-card__name{font-size:15px;font-weight:600;color:var(--ion-color-dark)}.role-card__desc{font-size:13px;color:var(--ion-color-medium);line-height:1.4}.perm-group{display:flex;flex-direction:column;gap:6px}.perm-group__label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--ion-color-medium)}.perm-chips{display:flex;flex-wrap:wrap;gap:6px}.perm-chip{font-size:12px;padding:3px 10px;border-radius:20px;background:var(--ion-color-light);color:var(--ion-color-dark)}.perm-chip--empty{color:var(--ion-color-medium);background:transparent;padding-left:0}\n"], dependencies: [{ kind: "component", type: IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: DisplayComponent, selector: "val-display", inputs: ["props"] }, { kind: "component", type: PillComponent, selector: "val-pill", inputs: ["preset", "props"], outputs: ["pillClick", "pillAction"] }, { kind: "component", type: TitleComponent, selector: "val-title", inputs: ["props"] }, { kind: "component", type: TextComponent, selector: "val-text", inputs: ["props"] }, { kind: "component", type: ButtonComponent, selector: "val-button", inputs: ["preset", "props"], outputs: ["onClick"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PermissionsViewComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'val-permissions-view', standalone: true, imports: [IonSpinner, DisplayComponent, PillComponent, TitleComponent, TextComponent, ButtonComponent], template: `
+    <div class="page">
+      <header class="page-header">
+        <val-display [props]="{ size: 'small', color: 'dark', content: tt('pageTitle') }" />
+        <val-title
+          [props]="{
+            size: 'large',
+            color: 'dark',
+            bold: false,
+            content: tt('pageDescription'),
+          }"
+        />
+      </header>
+
+      @if (loading()) {
+        <div class="spinner-row">
+          <ion-spinner name="crescent" />
+        </div>
+      } @else if (loadError()) {
+        <div class="error-row">
+          <val-text
+            [props]="{
+              content: tt('errorTitle'),
+              size: 'medium',
+              color: 'medium',
+              bold: false,
+            }"
+          />
+          <val-button [props]="retryButtonProps()" (click)="load()" />
+        </div>
+      } @else {
+        @if (resolvedConfig().showSystemRoles) {
+          <section class="perm-section">
+            <div class="perm-section__header">
+              <val-title
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: true,
+                  content: tt('systemRolesTitle'),
+                }"
+              />
+              <val-text
+                [props]="{
+                  content: tt('systemRolesHint'),
+                  size: 'medium',
+                  color: 'medium',
+                  bold: false,
+                }"
+              />
+            </div>
+            <div class="role-list">
+              @for (role of systemRoles(); track role.id) {
+                <div class="role-card">
+                  <div class="role-card__header">
+                    <span class="role-card__name">{{ roleLabel(role.name) }}</span>
+                    <val-pill
+                      [props]="{
+                        label: tt('systemBadge'),
+                        color: 'primary',
+                        weight: 'bold',
+                      }"
+                    />
+                  </div>
+                  @if (role.description) {
+                    <span class="role-card__desc">{{ role.description }}</span>
+                  }
+                  @if (!role.hasPerms) {
+                    <div class="perm-chips">
+                      <span class="perm-chip perm-chip--empty">{{ tt('noPermissions') }}</span>
+                    </div>
+                  } @else {
+                    @for (g of role.groups; track g.key) {
+                      <div class="perm-group">
+                        <span class="perm-group__label">{{ g.label }}</span>
+                        <div class="perm-chips">
+                          @for (p of g.perms; track p) {
+                            <span class="perm-chip">{{ p }}</span>
+                          }
+                        </div>
+                      </div>
+                    }
+                  }
+                </div>
+              }
+            </div>
+          </section>
+        }
+
+        @if (resolvedConfig().showCustomRoles) {
+          <section class="perm-section">
+            <div class="perm-section__header">
+              <val-title
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: true,
+                  content: tt('customRolesTitle'),
+                }"
+              />
+              <val-text
+                [props]="{
+                  content: tt('customRolesHint'),
+                  size: 'medium',
+                  color: 'medium',
+                  bold: false,
+                }"
+              />
+            </div>
+            @if (customRoles().length === 0) {
+              <val-text
+                [props]="{
+                  content: tt('noCustomRoles'),
+                  size: 'medium',
+                  color: 'medium',
+                  bold: false,
+                }"
+              />
+            } @else {
+              <div class="role-list">
+                @for (role of customRoles(); track role.id) {
+                  <div class="role-card">
+                    <div class="role-card__header">
+                      <span class="role-card__name">{{ role.name }}</span>
+                    </div>
+                    @if (role.description) {
+                      <span class="role-card__desc">{{ role.description }}</span>
+                    }
+                    @if (!role.hasPerms) {
+                      <div class="perm-chips">
+                        <span class="perm-chip perm-chip--empty">{{ tt('noPermissions') }}</span>
+                      </div>
+                    } @else {
+                      @for (g of role.groups; track g.key) {
+                        <div class="perm-group">
+                          <span class="perm-group__label">{{ g.label }}</span>
+                          <div class="perm-chips">
+                            @for (p of g.perms; track p) {
+                              <span class="perm-chip">{{ p }}</span>
+                            }
+                          </div>
+                        </div>
+                      }
+                    }
+                  </div>
+                }
+              </div>
+            }
+          </section>
+        }
+      }
+    </div>
+  `, styles: [".page{padding:16px 0;max-width:720px;margin:0 auto}.page-header{margin-bottom:24px}.spinner-row,.error-row{display:flex;flex-direction:column;align-items:center;gap:16px;padding:32px 0}.perm-section{margin-bottom:32px}.perm-section__header{margin-bottom:12px}.role-list{display:flex;flex-direction:column;gap:10px}.role-card{border:1.5px solid var(--ion-color-light);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}.role-card__header{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.role-card__name{font-size:15px;font-weight:600;color:var(--ion-color-dark)}.role-card__desc{font-size:13px;color:var(--ion-color-medium);line-height:1.4}.perm-group{display:flex;flex-direction:column;gap:6px}.perm-group__label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--ion-color-medium)}.perm-chips{display:flex;flex-wrap:wrap;gap:6px}.perm-chip{font-size:12px;padding:3px 10px;border-radius:20px;background:var(--ion-color-light);color:var(--ion-color-dark)}.perm-chip--empty{color:var(--ion-color-medium);background:transparent;padding-left:0}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { config: [{
+                type: Input
+            }] } });
+
+/**
+ * Helper para montar la vista Permisos (`val-permissions-view`) como ruta en una
+ * app del factory. El `config` se pasa por route `data` (`permissionsConfig`) y el
+ * componente lo lee como fallback de su `@Input() config`.
+ *
+ * @example
+ * ```ts
+ * // settings.routes.ts
+ * export const settingsRoutes: Routes = [
+ *   ...provideValtechPermissionsRoutes(),                  // → /app/settings/permissions
+ *   { path: 'preferences', loadComponent: () => ... },
+ * ];
+ *
+ * // con config acotada:
+ * ...provideValtechPermissionsRoutes({ config: { showCustomRoles: false } }),
+ * ...provideValtechPermissionsRoutes({ path: 'roles' }),
+ * ```
+ */
+function provideValtechPermissionsRoutes(opts) {
+    return [
+        {
+            path: opts?.path ?? 'permissions',
+            component: PermissionsViewComponent,
+            data: { permissionsConfig: opts?.config },
+        },
+    ];
+}
+
 /** Built-in label sets for the three platform locales. */
 const CALLOUT_LABELS = {
     es: {
@@ -61679,5 +62662,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ACTION_CARD_DEFAULTS, AD_SIZE_MAP, API_TABLE_COLUMN_LABELS, ARTICLE_CARD_DEFAULTS, ARTICLE_SPACING, ARTICLE_STRIP_DEFAULTS, AUTH_CTA_DEFAULTS, AVATAR_UPLOAD_DEFAULTS, AccordionComponent, AccountViewComponent, ActionCardComponent, ActionHeaderComponent, ActionType, AdSlotComponent, AdsLoaderService, AdsService, AlertBoxComponent, AnalyticsErrorHandler, AnalyticsRouterTracker, AnalyticsService, AnimatedTerminalComponent, AppConfigService, AppVersionService, ArticleBuilder, ArticleCardComponent, ArticleComponent, ArticleStripComponent, AttachmentUploaderComponent, AuthBackgroundComponent, AuthCtaComponent, AuthService, AuthStateService, AuthStorageService, AuthSyncService, AvatarComponent, AvatarUploadComponent, BOTTOM_NAV_DEFAULTS, BannerComponent, BaseDefault, BlogPostBuilder, BottomNavComponent, BoxComponent, BreadcrumbComponent, ButtonComponent, ButtonGroupComponent, CALLOUT_LABELS, CHEV_KEYS, CIRCLE_KEYS, COMMON_COUNTRY_CODES, COMMON_CURRENCIES, CONTENT_CARD_DEFAULTS, CORNER_KEYS, CTA_CARD_DEFAULTS, CURRENCY_INFO, CardComponent, CardSection, CardType, CardsCarouselComponent, ChangeEmailModalComponent, ChangePasswordModalComponent, CheckInputComponent, CheckboxRadioInputComponent, ChipGroupComponent, ClearDefault, ClearDefaultBlock, ClearDefaultFull, ClearDefaultRound, ClearDefaultRoundBlock, ClearDefaultRoundFull, CodeDisplayComponent, CommandDisplayComponent, CommentComponent, CommentInputComponent, CommentSectionComponent, CompanyFooterComponent, ComponentStates, ConfirmationDialogService, ContainerComponent, ContentCardComponent, ContentLoaderComponent, ContentReactionComponent, ContentService, ContentTransformer, CookieBannerComponent, CountdownComponent, CreateOrgModalComponent, CtaCardComponent, CurrencyInputComponent, DEFAULT_ADS_CONFIG, DEFAULT_APP_CONFIG_SERVICE_CONFIG, DEFAULT_APP_VERSION_SERVICE_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_BACK_HEADER, DEFAULT_CANCEL_BUTTON, DEFAULT_CHECK_INTERVAL_MS, DEFAULT_CONFIRM_BUTTON, DEFAULT_COUNTDOWN_LABELS, DEFAULT_COUNTDOWN_LABELS_EN, DEFAULT_DEBUG_CONSOLE_CONFIG, DEFAULT_DONATION_CONFIG, DEFAULT_EMPTY_STATE, DEFAULT_EMULATOR_CONFIG, DEFAULT_FEEDBACK_CONFIG, DEFAULT_FEEDBACK_TYPE_OPTIONS, DEFAULT_HOME_HEADER, DEFAULT_INFINITE_LIST_METADATA, DEFAULT_MODAL_CANCEL_BUTTON, DEFAULT_MODAL_CONFIRM_BUTTON, DEFAULT_PAGE_SIZE_OPTIONS, DEFAULT_PLATFORMS, DEFAULT_REFRESHER_METADATA, DEFAULT_SKELETON_CONFIG, DEFAULT_SPLASH_SCREEN_CONFIG, DataTableComponent, DateInputComponent, DateRangeInputComponent, DebugConsoleComponent, DeleteAccountModalComponent, DetailSkeletonComponent, DeviceService, DisplayComponent, DividerComponent, DocsApiTableComponent, DocsBreadcrumbComponent, DocsBuilder, DocsCalloutComponent, DocsCodeExampleComponent, DocsLayoutComponent, DocsNavLinksComponent, DocsNavigationService, DocsPageComponent, DocsSearchComponent, DocsSectionComponent, DocsShellComponent, DocsSidebarComponent, DocsTocComponent, DonationService, DownloadService, EditOrgModalComponent, EmailInputComponent, EmptyStateComponent, ExpandableTextComponent, FEATURES_LIST_DEFAULTS, FUN_MODAL_DEFAULTS, FabComponent, FaqComponent, FeaturesListComponent, FeedbackFormComponent, FeedbackService, FileInputComponent, FirebaseService, FirestoreCollectionFactory, FirestoreService, FontSizeOption, FontSizeService, FooterComponent, FooterLinksComponent, FormComponent, FormSkeletonComponent, FunHeaderComponent, FunModalComponent, GlassComponent, GlowCardComponent, GlowComponent, GridSkeletonComponent, HANDOFF_ROUTE_PARAM, HANDOFF_TOKEN_PARAM, HandoffService, HasPermissionDirective, HeaderComponent, HintComponent, HorizontalScrollComponent, HourInputComponent, HrefComponent, I18nService, IMAGE_DEFAULTS, INFO_CARD_DEFAULTS, INITIAL_AUTH_STATE, INITIAL_MFA_STATE, INVITATION_CARD_DEFAULTS, Icon, IconComponent, IconService, ImageComponent, ImageCropComponent, ImageService, InAppBrowserService, InfiniteListComponent, InfoCardComponent, InfoComponent, InputI18nHelper, InputType, InvitationCardComponent, InviteMemberModalComponent, ItemListComponent, LANG_STORAGE_KEY$1 as LANG_STORAGE_KEY, LEGAL_CONTENT_CONFIG, LOGIN_DEFAULTS, LandingSplitComponent, LandingStepsComponent, LanguageSelectorComponent, LayeredCardComponent, LegalContentService, LegalLinkService, LinkComponent, LinkProcessorService, LinkedProvidersComponent, LinksAccordionComponent, LinksCakeComponent, ListSkeletonComponent, LoadingDirective, LocalStorageService, LocaleService, LoginAttemptModalComponent, LoginComponent, MEDIA_OBJECT_DEFAULTS, MEMBER_CARD_DEFAULTS, METRIC_CARD_DEFAULTS, MODAL_SIZES, MOTIF_KEYS, MOTION, MaintenancePageComponent, MarkdownArticleParserService, MediaObjectComponent, MemberCardComponent, MemberDetailModalComponent, MemberImportModalComponent, MenuComponent, MessagingService, MetaService, MetricCardComponent, MfaModalComponent, ModalService, ModalShellComponent, MultiSelectSearchComponent, NUM_KEYS, NavigationService, NetworkBannerComponent, NetworkStatusService, NewsBuilder, NoContentComponent, NotesBoxComponent, NotificationActionService, NotificationsService, NotificationsViewComponent, NumberFromToComponent, NumberInputComponent, NumberStepperComponent, OAUTH_PROVIDERS_INFO, OAuthCallbackComponent, OAuthService, OrgInfoSheetComponent, OrgService, OrgSwitchService, OrganizationViewComponent, OutlineDefault, OutlineDefaultBlock, OutlineDefaultFull, OutlineDefaultRound, OutlineDefaultRoundBlock, OutlineDefaultRoundFull, PATTERN_MOTIFS, PATTERN_PALETTES, PATTERN_STYLE_CONFIGS, PLATFORM_CONFIGS, PageContentComponent, PageLinksComponent, PageRefreshService, PageTemplateComponent, PageWavesComponent, PageWrapperComponent, PaginationComponent, PaginationService, PasswordInputComponent, PatternComponent, PhoneInputComponent, PillComponent, PinInputComponent, PlainCodeBoxComponent, PopoverSelectorComponent, PreferencesService, PreferencesViewComponent, PresetService, PriceTagComponent, PrimarySolidBlockButton, PrimarySolidBlockHrefButton, PrimarySolidBlockIconButton, PrimarySolidBlockIconHrefButton, PrimarySolidDefaultRoundButton, PrimarySolidDefaultRoundHrefButton, PrimarySolidDefaultRoundIconButton, PrimarySolidDefaultRoundIconHrefButton, PrimarySolidFullButton, PrimarySolidFullHrefButton, PrimarySolidFullIconButton, PrimarySolidFullIconHrefButton, PrimarySolidLargeRoundButton, PrimarySolidLargeRoundHrefButton, PrimarySolidLargeRoundIconButton, PrimarySolidLargeRoundIconHrefButton, PrimarySolidSmallRoundButton, PrimarySolidSmallRoundHrefButton, PrimarySolidSmallRoundIconButton, PrimarySolidSmallRoundIconHrefButton, ProcessLinksPipe, ProfileSkeletonComponent, ProfileViewComponent, ProgressBarComponent, ProgressRingComponent, ProgressStatusComponent, PrompterComponent, QR_PRESETS, QrCodeComponent, QrGeneratorService, QueryBuilder, QuoteBoxComponent, REQUEST_STATUSES, RadioInputComponent, RangeInputComponent, RatingComponent, RefresherComponent, RequestFirestoreService, RequestFormBuilderService, RequestService, RightsFooterComponent, RotatingTextComponent, SEARCH_HEADER_DEFAULTS, SETTINGS_SECTIONS_CATALOG, SHAPE_KEYS, SHARE_PROFILE_MODAL_DEFAULTS, SKELETON_LAYOUT_DEFAULT_ROWS, SKELETON_PRESETS, SOLID_KEYS, STATS_BAR_DEFAULTS, STROKE_KEYS, SearchHeaderComponent, SearchSelectorComponent, SearchbarComponent, SecondarySolidBlockButton, SecondarySolidBlockHrefButton, SecondarySolidBlockIconButton, SecondarySolidBlockIconHrefButton, SecondarySolidDefaultRoundButton, SecondarySolidDefaultRoundHrefButton, SecondarySolidDefaultRoundIconButton, SecondarySolidDefaultRoundIconHrefButton, SecondarySolidFullButton, SecondarySolidFullHrefButton, SecondarySolidFullIconButton, SecondarySolidFullIconHrefButton, SecondarySolidLargeRoundButton, SecondarySolidLargeRoundHrefButton, SecondarySolidLargeRoundIconButton, SecondarySolidLargeRoundIconHrefButton, SecondarySolidSmallRoundButton, SecondarySolidSmallRoundHrefButton, SecondarySolidSmallRoundIconButton, SecondarySolidSmallRoundIconHrefButton, SecurityViewComponent, SegmentControlComponent, SelectSearchComponent, SessionListModalComponent, SessionService, SettingsHubComponent, ShareButtonsComponent, ShareProfileModalComponent, SimpleComponent, SkeletonComponent, SkeletonLayoutComponent, SkeletonService, SolidBlockButton, SolidDefault, SolidDefaultBlock, SolidDefaultButton, SolidDefaultFull, SolidDefaultRound, SolidDefaultRoundBlock, SolidDefaultRoundButton, SolidDefaultRoundFull, SolidFullButton, SolidLargeButton, SolidLargeRoundButton, SolidSmallButton, SolidSmallRoundButton, SplashScreenService, StatsBarComponent, StatsCardComponent, StepperComponent, StorageService, SwipeCarouselComponent, SwitchOrgModalComponent, TRI_KEYS, TabbedContentComponent, TableSkeletonComponent, TabsComponent, Terminal404Component, TestimonialCardComponent, TestimonialCarouselComponent, TextComponent, TextInputComponent, TextareaInputComponent, ThemeOption, ThemeService, TimelineComponent, TitleBlockComponent, TitleComponent, ToastService, ToggleInputComponent, TokenService, ToolbarActionType, ToolbarComponent, TransferOwnershipModalComponent, TranslatePipe, TypedCollection, UPDATE_BANNER_DEFAULT_CONTENT, UPDATE_BANNER_I18N_NAMESPACE, UpdateBannerComponent, UserAvatarComponent, UsernameInputComponent, VALTECH_ADS_CONFIG, VALTECH_APP_CONFIG, VALTECH_APP_VERSION, VALTECH_AUTH_CONFIG, VALTECH_COMPANY_LINKS, VALTECH_CONTENT_CONFIG, VALTECH_DEBUG_CONSOLE, VALTECH_DEFAULT_CONTENT, VALTECH_DONATION_CONFIG, VALTECH_FEEDBACK_CONFIG, VALTECH_FIREBASE_CONFIG, VALTECH_FOOTER_I18N, VALTECH_FOOTER_LOGO, VALTECH_LANGUAGE_SELECTOR, VALTECH_LEGAL_CONFIG, VALTECH_NETWORK_ERROR_KEY, VALTECH_SITE_PATHS, VALTECH_SOCIAL_LINKS, VALTECH_SPLASH_SCREEN, VALTECH_WEB_BASE_URLS, VERSION, ValtechErrorService, WizardComponent, WizardFooterComponent, applyDefaultValueToControl, authGuard, authInterceptor, authPasswordValidator, beautifyLegalArticle, blogPost, buildCompanyFooterProps, buildFooterLinks, buildLegalLinkResolver, buildPath, buildSettingsCards, collections, connectPageRefresh, createErrorStateProps, createFirebaseConfig, createGlowCardProps, createInitialPaginationState, createNumberFromToField, createRefreshableStream, createTitleProps, docs, errorLoggingInterceptor, extractPathParams, generatePatternTiles, generateRandomTile, getAppInfo, getAppVersion, getCollectionPath, getDocumentId, getTimeOfDayKey, goToTop, guestGuard, hasEmulators, interpretError, isAtEnd, isCollectionPath, isDocumentPath, isEmulatorMode, isValidPath, joinPath, maxLength, mulberry32, news, parseMarkdownArticle, permissionGuard, permissionGuardFromRoute, provideLegalContent, provideSplashScreen, provideValtechAccountRoutes, provideValtechAds, provideValtechAppConfig, provideValtechAppVersion, provideValtechAuth, provideValtechAuthInterceptor, provideValtechContent, provideValtechDebugConsole, provideValtechDonations, provideValtechErrorHandling, provideValtechFeedback, provideValtechFirebase, provideValtechI18n, provideValtechLegal, provideValtechNotificationsRoutes, provideValtechOrganizationRoutes, provideValtechPreferencesRoutes, provideValtechPresets, provideValtechProfileRoutes, provideValtechSecurityRoutes, provideValtechSettingsRoutes, provideValtechSite, provideValtechSkeleton, query, renderPatternSvgInner, replaceSpecialChars, resolveColor$1 as resolveColor, resolveInputDefaultValue, resolveWebBaseUrl, roleGuard, storagePaths, superAdminGuard, toArticle };
+export { ACTION_CARD_DEFAULTS, AD_SIZE_MAP, API_TABLE_COLUMN_LABELS, ARTICLE_CARD_DEFAULTS, ARTICLE_SPACING, ARTICLE_STRIP_DEFAULTS, AUTH_CTA_DEFAULTS, AVATAR_UPLOAD_DEFAULTS, AccordionComponent, AccountViewComponent, ActionCardComponent, ActionHeaderComponent, ActionType, AdSlotComponent, AdsLoaderService, AdsService, AlertBoxComponent, AnalyticsErrorHandler, AnalyticsRouterTracker, AnalyticsService, AnimatedTerminalComponent, AppConfigService, AppVersionService, ArticleBuilder, ArticleCardComponent, ArticleComponent, ArticleStripComponent, AttachmentUploaderComponent, AuthBackgroundComponent, AuthCtaComponent, AuthService, AuthStateService, AuthStorageService, AuthSyncService, AvatarComponent, AvatarUploadComponent, BOTTOM_NAV_DEFAULTS, BannerComponent, BaseDefault, BlogPostBuilder, BottomNavComponent, BoxComponent, BreadcrumbComponent, ButtonComponent, ButtonGroupComponent, CALLOUT_LABELS, CHEV_KEYS, CIRCLE_KEYS, COMMON_COUNTRY_CODES, COMMON_CURRENCIES, CONTENT_CARD_DEFAULTS, CORNER_KEYS, CTA_CARD_DEFAULTS, CURRENCY_INFO, CardComponent, CardSection, CardType, CardsCarouselComponent, ChangeEmailModalComponent, ChangePasswordModalComponent, CheckInputComponent, CheckboxRadioInputComponent, ChipGroupComponent, ClearDefault, ClearDefaultBlock, ClearDefaultFull, ClearDefaultRound, ClearDefaultRoundBlock, ClearDefaultRoundFull, CodeDisplayComponent, CommandDisplayComponent, CommentComponent, CommentInputComponent, CommentSectionComponent, CompanyFooterComponent, ComponentStates, ConfirmationDialogService, ContainerComponent, ContentCardComponent, ContentLoaderComponent, ContentReactionComponent, ContentService, ContentTransformer, CookieBannerComponent, CountdownComponent, CreateOrgModalComponent, CtaCardComponent, CurrencyInputComponent, DEFAULT_ADS_CONFIG, DEFAULT_APP_CONFIG_SERVICE_CONFIG, DEFAULT_APP_VERSION_SERVICE_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_BACK_HEADER, DEFAULT_CANCEL_BUTTON, DEFAULT_CHECK_INTERVAL_MS, DEFAULT_CONFIRM_BUTTON, DEFAULT_COUNTDOWN_LABELS, DEFAULT_COUNTDOWN_LABELS_EN, DEFAULT_DEBUG_CONSOLE_CONFIG, DEFAULT_DONATION_CONFIG, DEFAULT_EMPTY_STATE, DEFAULT_EMULATOR_CONFIG, DEFAULT_FEEDBACK_CONFIG, DEFAULT_FEEDBACK_TYPE_OPTIONS, DEFAULT_HOME_HEADER, DEFAULT_INFINITE_LIST_METADATA, DEFAULT_MODAL_CANCEL_BUTTON, DEFAULT_MODAL_CONFIRM_BUTTON, DEFAULT_PAGE_SIZE_OPTIONS, DEFAULT_PLATFORMS, DEFAULT_REFRESHER_METADATA, DEFAULT_SKELETON_CONFIG, DEFAULT_SPLASH_SCREEN_CONFIG, DataTableComponent, DateInputComponent, DateRangeInputComponent, DebugConsoleComponent, DeleteAccountModalComponent, DetailSkeletonComponent, DeviceService, DisplayComponent, DividerComponent, DocsApiTableComponent, DocsBreadcrumbComponent, DocsBuilder, DocsCalloutComponent, DocsCodeExampleComponent, DocsLayoutComponent, DocsNavLinksComponent, DocsNavigationService, DocsPageComponent, DocsSearchComponent, DocsSectionComponent, DocsShellComponent, DocsSidebarComponent, DocsTocComponent, DonationService, DownloadService, EditOrgModalComponent, EmailInputComponent, EmptyStateComponent, ExpandableTextComponent, FEATURES_LIST_DEFAULTS, FUN_MODAL_DEFAULTS, FabComponent, FaqComponent, FeaturesListComponent, FeedbackFormComponent, FeedbackService, FileInputComponent, FirebaseService, FirestoreCollectionFactory, FirestoreService, FontSizeOption, FontSizeService, FooterComponent, FooterLinksComponent, FormComponent, FormSkeletonComponent, FunHeaderComponent, FunModalComponent, GlassComponent, GlowCardComponent, GlowComponent, GridSkeletonComponent, HANDOFF_ROUTE_PARAM, HANDOFF_TOKEN_PARAM, HandoffService, HasPermissionDirective, HeaderComponent, HintComponent, HorizontalScrollComponent, HourInputComponent, HrefComponent, I18nService, IMAGE_DEFAULTS, INFO_CARD_DEFAULTS, INITIAL_AUTH_STATE, INITIAL_MFA_STATE, INVITATION_CARD_DEFAULTS, Icon, IconComponent, IconService, ImageComponent, ImageCropComponent, ImageService, InAppBrowserService, InfiniteListComponent, InfoCardComponent, InfoComponent, InputI18nHelper, InputType, InvitationCardComponent, InviteMemberModalComponent, ItemListComponent, LANG_STORAGE_KEY$1 as LANG_STORAGE_KEY, LEGAL_CONTENT_CONFIG, LOGIN_DEFAULTS, LandingSplitComponent, LandingStepsComponent, LanguageSelectorComponent, LayeredCardComponent, LegalContentService, LegalLinkService, LinkComponent, LinkProcessorService, LinkedProvidersComponent, LinksAccordionComponent, LinksCakeComponent, ListSkeletonComponent, LoadingDirective, LocalStorageService, LocaleService, LoginAttemptModalComponent, LoginComponent, MEDIA_OBJECT_DEFAULTS, MEMBER_CARD_DEFAULTS, METRIC_CARD_DEFAULTS, MODAL_SIZES, MOTIF_KEYS, MOTION, MaintenancePageComponent, MarkdownArticleParserService, MediaObjectComponent, MemberCardComponent, MemberDetailModalComponent, MenuComponent, MessagingService, MetaService, MetricCardComponent, MfaModalComponent, ModalService, ModalShellComponent, MultiSelectSearchComponent, NUM_KEYS, NavigationService, NetworkBannerComponent, NetworkStatusService, NewsBuilder, NoContentComponent, NotesBoxComponent, NotificationActionService, NotificationPreferencesViewComponent, NotificationsService, NotificationsViewComponent, NumberFromToComponent, NumberInputComponent, NumberStepperComponent, OAUTH_PROVIDERS_INFO, OAuthCallbackComponent, OAuthService, OrgInfoSheetComponent, OrgService, OrgSwitchService, OrganizationViewComponent, OutlineDefault, OutlineDefaultBlock, OutlineDefaultFull, OutlineDefaultRound, OutlineDefaultRoundBlock, OutlineDefaultRoundFull, PATTERN_MOTIFS, PATTERN_PALETTES, PATTERN_STYLE_CONFIGS, PLATFORM_CONFIGS, PageContentComponent, PageLinksComponent, PageRefreshService, PageTemplateComponent, PageWavesComponent, PageWrapperComponent, PaginationComponent, PaginationService, PasswordInputComponent, PatternComponent, PermissionCatalogService, PermissionsViewComponent, PhoneInputComponent, PillComponent, PinInputComponent, PlainCodeBoxComponent, PopoverSelectorComponent, PreferencesService, PreferencesViewComponent, PresetService, PriceTagComponent, PrimarySolidBlockButton, PrimarySolidBlockHrefButton, PrimarySolidBlockIconButton, PrimarySolidBlockIconHrefButton, PrimarySolidDefaultRoundButton, PrimarySolidDefaultRoundHrefButton, PrimarySolidDefaultRoundIconButton, PrimarySolidDefaultRoundIconHrefButton, PrimarySolidFullButton, PrimarySolidFullHrefButton, PrimarySolidFullIconButton, PrimarySolidFullIconHrefButton, PrimarySolidLargeRoundButton, PrimarySolidLargeRoundHrefButton, PrimarySolidLargeRoundIconButton, PrimarySolidLargeRoundIconHrefButton, PrimarySolidSmallRoundButton, PrimarySolidSmallRoundHrefButton, PrimarySolidSmallRoundIconButton, PrimarySolidSmallRoundIconHrefButton, ProcessLinksPipe, ProfileSkeletonComponent, ProfileViewComponent, ProgressBarComponent, ProgressRingComponent, ProgressStatusComponent, PrompterComponent, QR_PRESETS, QrCodeComponent, QrGeneratorService, QueryBuilder, QuoteBoxComponent, REQUEST_STATUSES, RadioInputComponent, RangeInputComponent, RatingComponent, RefresherComponent, RequestFirestoreService, RequestFormBuilderService, RequestService, RightsFooterComponent, RotatingTextComponent, SEARCH_HEADER_DEFAULTS, SETTINGS_SECTIONS_CATALOG, SHAPE_KEYS, SHARE_PROFILE_MODAL_DEFAULTS, SKELETON_LAYOUT_DEFAULT_ROWS, SKELETON_PRESETS, SOLID_KEYS, STATS_BAR_DEFAULTS, STROKE_KEYS, SearchHeaderComponent, SearchSelectorComponent, SearchbarComponent, SecondarySolidBlockButton, SecondarySolidBlockHrefButton, SecondarySolidBlockIconButton, SecondarySolidBlockIconHrefButton, SecondarySolidDefaultRoundButton, SecondarySolidDefaultRoundHrefButton, SecondarySolidDefaultRoundIconButton, SecondarySolidDefaultRoundIconHrefButton, SecondarySolidFullButton, SecondarySolidFullHrefButton, SecondarySolidFullIconButton, SecondarySolidFullIconHrefButton, SecondarySolidLargeRoundButton, SecondarySolidLargeRoundHrefButton, SecondarySolidLargeRoundIconButton, SecondarySolidLargeRoundIconHrefButton, SecondarySolidSmallRoundButton, SecondarySolidSmallRoundHrefButton, SecondarySolidSmallRoundIconButton, SecondarySolidSmallRoundIconHrefButton, SecurityViewComponent, SegmentControlComponent, SelectSearchComponent, SessionListModalComponent, SessionService, SettingsHubComponent, ShareButtonsComponent, ShareProfileModalComponent, SimpleComponent, SkeletonComponent, SkeletonLayoutComponent, SkeletonService, SolidBlockButton, SolidDefault, SolidDefaultBlock, SolidDefaultButton, SolidDefaultFull, SolidDefaultRound, SolidDefaultRoundBlock, SolidDefaultRoundButton, SolidDefaultRoundFull, SolidFullButton, SolidLargeButton, SolidLargeRoundButton, SolidSmallButton, SolidSmallRoundButton, SplashScreenService, StatsBarComponent, StatsCardComponent, StepperComponent, StorageService, SwipeCarouselComponent, SwitchOrgModalComponent, TRI_KEYS, TabbedContentComponent, TableSkeletonComponent, TabsComponent, Terminal404Component, TestimonialCardComponent, TestimonialCarouselComponent, TextComponent, TextInputComponent, TextareaInputComponent, ThemeOption, ThemeService, TimelineComponent, TitleBlockComponent, TitleComponent, ToastService, ToggleInputComponent, TokenService, ToolbarActionType, ToolbarComponent, TransferOwnershipModalComponent, TranslatePipe, TypedCollection, UPDATE_BANNER_DEFAULT_CONTENT, UPDATE_BANNER_I18N_NAMESPACE, UpdateBannerComponent, UserAvatarComponent, UsernameInputComponent, VALTECH_ADS_CONFIG, VALTECH_APP_CONFIG, VALTECH_APP_VERSION, VALTECH_AUTH_CONFIG, VALTECH_COMPANY_LINKS, VALTECH_CONTENT_CONFIG, VALTECH_DEBUG_CONSOLE, VALTECH_DEFAULT_CONTENT, VALTECH_DONATION_CONFIG, VALTECH_FEEDBACK_CONFIG, VALTECH_FIREBASE_CONFIG, VALTECH_FOOTER_I18N, VALTECH_FOOTER_LOGO, VALTECH_LANGUAGE_SELECTOR, VALTECH_LEGAL_CONFIG, VALTECH_NETWORK_ERROR_KEY, VALTECH_SITE_PATHS, VALTECH_SOCIAL_LINKS, VALTECH_SPLASH_SCREEN, VALTECH_WEB_BASE_URLS, VERSION, ValtechErrorService, WizardComponent, WizardFooterComponent, applyDefaultValueToControl, authGuard, authInterceptor, authPasswordValidator, beautifyLegalArticle, blogPost, buildCompanyFooterProps, buildFooterLinks, buildLegalLinkResolver, buildPath, buildSettingsCards, collections, connectPageRefresh, createErrorStateProps, createFirebaseConfig, createGlowCardProps, createInitialPaginationState, createNumberFromToField, createRefreshableStream, createTitleProps, docs, errorLoggingInterceptor, extractPathParams, generatePatternTiles, generateRandomTile, getAppInfo, getAppVersion, getCollectionPath, getDocumentId, getTimeOfDayKey, goToTop, guestGuard, hasEmulators, interpretError, isAtEnd, isCollectionPath, isDocumentPath, isEmulatorMode, isValidPath, joinPath, maxLength, mulberry32, news, parseMarkdownArticle, permissionGuard, permissionGuardFromRoute, provideLegalContent, provideSplashScreen, provideValtechAccountRoutes, provideValtechAds, provideValtechAppConfig, provideValtechAppVersion, provideValtechAuth, provideValtechAuthInterceptor, provideValtechContent, provideValtechDebugConsole, provideValtechDonations, provideValtechErrorHandling, provideValtechFeedback, provideValtechFirebase, provideValtechI18n, provideValtechLegal, provideValtechNotificationPreferencesRoutes, provideValtechNotificationsRoutes, provideValtechOrganizationRoutes, provideValtechPermissionsRoutes, provideValtechPreferencesRoutes, provideValtechPresets, provideValtechProfileRoutes, provideValtechSecurityRoutes, provideValtechSettingsRoutes, provideValtechSite, provideValtechSkeleton, query, renderPatternSvgInner, replaceSpecialChars, resolveColor$1 as resolveColor, resolveInputDefaultValue, resolveWebBaseUrl, roleGuard, storagePaths, superAdminGuard, toArticle };
 //# sourceMappingURL=valtech-components.mjs.map