valtech-components 2.0.988 → 2.0.990

package/fesm2022/valtech-components.mjs

@@ -1,11 +1,11 @@
 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, shareReplay, race, timer, forkJoin } from 'rxjs';
-import { catchError, switchMap, finalize, filter, take, map as map$1, tap, retry, timeout, debounceTime as debounceTime$1, takeUntil as takeUntil$1 } from 'rxjs/operators';
+import { 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';
 import * as i1$1 from '@angular/fire/firestore';
-import { provideFirestore, getFirestore, connectFirestoreEmulator, enableIndexedDbPersistence, doc, getDoc, collection, query as query$1, getDocs, getCountFromServer, limit, docData, collectionData, serverTimestamp, addDoc, setDoc, updateDoc, deleteDoc, writeBatch, arrayUnion, arrayRemove, increment, where, orderBy, startAfter, startAt, endBefore, endAt, Timestamp, onSnapshot } from '@angular/fire/firestore';
+import { provideFirestore, getFirestore, connectFirestoreEmulator, enableIndexedDbPersistence, doc, getDoc, collection, query as query$1, getDocs, getCountFromServer, limit, docData, collectionData, serverTimestamp, addDoc, setDoc, updateDoc, deleteDoc, writeBatch, arrayUnion, arrayRemove, increment, where, orderBy, startAfter, startAt, endBefore, endAt, Timestamp, onSnapshot, Firestore } from '@angular/fire/firestore';
 import * as i1$5 from '@angular/common';
 import { isPlatformBrowser, CommonModule, NgStyle, NgFor, DOCUMENT, NgClass, TitleCasePipe } from '@angular/common';
 import { provideAnalytics, getAnalytics, Analytics, logEvent, setUserId, setUserProperties } from '@angular/fire/analytics';
@@ -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.988';
+const VERSION = '2.0.990';
 
 // Control de estado de refresco (singleton a nivel de módulo)
 let isRefreshing = false;
@@ -10497,6 +10497,7 @@ class ButtonComponent {
       [fill]="resolvedProps.fill"
       [size]="resolvedProps.size"
       [href]="resolvedProps.href"
+      [routerLink]="resolvedProps.routerLink ?? null"
       [target]="resolvedProps.target"
       [shape]="resolvedProps.shape"
       (click)="clickHandler()"
@@ -10507,11 +10508,11 @@ class ButtonComponent {
       <ion-spinner *ngIf="resolvedProps.state === states.WORKING" name="circular"></ion-spinner>
       <ion-text *ngIf="resolvedProps.state !== states.WORKING">{{ displayText }}</ion-text>
     </ion-button>
-  `, isInline: true, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}ion-button{font-family:var(--ion-default-font),Arial,sans-serif;min-width:6.25rem;margin:0}ion-button.small{--padding-bottom: 12px;--padding-end: 14px;--padding-start: 14px;--padding-top: 12px}ion-button.button-clear{padding:0;margin:0}ion-button ion-spinner{--color: currentColor}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: IonText, selector: "ion-text", inputs: ["color", "mode"] }] }); }
+  `, isInline: true, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}ion-button{font-family:var(--ion-default-font),Arial,sans-serif;min-width:6.25rem;margin:0}ion-button.small{--padding-bottom: 12px;--padding-end: 14px;--padding-start: 14px;--padding-top: 12px}ion-button.button-clear{padding:0;margin:0}ion-button ion-spinner{--color: currentColor}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { 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: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: IonText, selector: "ion-text", inputs: ["color", "mode"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'val-button', standalone: true, imports: [CommonModule, IonButton, IonIcon, IonSpinner, IonText], template: `
+            args: [{ selector: 'val-button', standalone: true, imports: [CommonModule, RouterLink, IonButton, IonIcon, IonSpinner, IonText], template: `
     <ion-button
       [attr.data-testid]="resolvedProps.token"
       [type]="resolvedProps.type"
@@ -10520,6 +10521,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
       [fill]="resolvedProps.fill"
       [size]="resolvedProps.size"
       [href]="resolvedProps.href"
+      [routerLink]="resolvedProps.routerLink ?? null"
       [target]="resolvedProps.target"
       [shape]="resolvedProps.shape"
       (click)="clickHandler()"
@@ -41735,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$7 = 'Settings.Profile';
+const DEFAULT_NAMESPACE$c = 'Settings.Profile';
 /**
  * `val-profile-view` — vista Perfil full-feature autocontenida (organism).
  *
@@ -41785,7 +41787,7 @@ class ProfileViewComponent {
                 showPhone: merged.showPhone ?? true,
                 showShareCta: merged.showShareCta ?? true,
                 profileBaseUrl: merged.profileBaseUrl ?? '',
-                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$7,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$c,
                 onSaved: merged.onSaved,
                 onAvatarUploaded: merged.onAvatarUploaded,
             };
@@ -42701,7 +42703,7 @@ const PREFERENCES_VIEW_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$6 = 'Settings.General';
+const DEFAULT_NAMESPACE$b = 'Settings.General';
 const DEFAULT_LANGUAGES = ['es', 'en'];
 /**
  * `val-preferences-view` — vista de preferencias de UI cross-app (tema +
@@ -42738,7 +42740,7 @@ class PreferencesViewComponent {
                 showLanguage: merged.showLanguage ?? true,
                 showFontSize: merged.showFontSize ?? true,
                 supportedLanguages: merged.supportedLanguages ?? DEFAULT_LANGUAGES,
-                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$6,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$b,
                 onThemeChanged: merged.onThemeChanged,
                 onLanguageChanged: merged.onLanguageChanged,
                 onFontSizeChanged: merged.onFontSizeChanged,
@@ -44550,7 +44552,7 @@ const SECURITY_VIEW_I18N = {
 };
 
 addIcons({ laptopOutline, phonePortraitOutline });
-const DEFAULT_NAMESPACE$5 = 'Settings.Security';
+const DEFAULT_NAMESPACE$a = 'Settings.Security';
 /**
  * `val-security-view` — vista Seguridad full-feature autocontenida (organism).
  *
@@ -44599,7 +44601,7 @@ class SecurityViewComponent {
                 showChangeEmail: merged.showChangeEmail ?? true,
                 showMfa: merged.showMfa ?? true,
                 showPolicies: merged.showPolicies ?? true,
-                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$5,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$a,
                 handleDeepLinks: merged.handleDeepLinks ?? true,
                 homeRoute: merged.homeRoute ?? '/app/home',
                 onMfaCompleted: merged.onMfaCompleted,
@@ -45505,7 +45507,7 @@ const CREATE_ORG_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$4 = 'CreateOrgModal';
+const DEFAULT_NAMESPACE$9 = '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
@@ -45531,10 +45533,10 @@ class CreateOrgModalComponent {
         this.toast = inject(ToastService);
         this.errors = inject(ValtechErrorService);
         /** Namespace i18n con que la vista resuelve sus textos. */
-        this.i18nNamespace = DEFAULT_NAMESPACE$4;
+        this.i18nNamespace = DEFAULT_NAMESPACE$9;
         this._busy = signal(false);
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$4)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$4, CREATE_ORG_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$9)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$9, CREATE_ORG_MODAL_I18N);
         }
         this.formMeta = signal(this.buildFormMeta());
         effect(() => {
@@ -45770,7 +45772,7 @@ const DELETE_ACCOUNT_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$3 = 'Settings.DeleteAccount';
+const DEFAULT_NAMESPACE$8 = '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.
@@ -45796,7 +45798,7 @@ class DeleteAccountModalComponent {
         this.i18n = inject(I18nService);
         this.toast = inject(ToastService);
         /** Namespace i18n con que la vista resuelve sus textos. */
-        this.i18nNamespace = DEFAULT_NAMESPACE$3;
+        this.i18nNamespace = DEFAULT_NAMESPACE$8;
         this.hasPassword = signal(null);
         this.codeSent = signal(false);
         this.formState = signal(ComponentStates.ENABLED);
@@ -45863,8 +45865,8 @@ class DeleteAccountModalComponent {
             ],
             actions: this.submitBtn('delete-code-submit', 'confirmCta'),
         }));
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$3)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$3, DELETE_ACCOUNT_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$8)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$8, DELETE_ACCOUNT_MODAL_I18N);
         }
     }
     ngOnInit() {
@@ -46065,7 +46067,7 @@ const ORG_INFO_SHEET_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$2 = 'OrgInfoSheet';
+const DEFAULT_NAMESPACE$7 = 'OrgInfoSheet';
 /**
  * `val-org-info-sheet` — sheet informativo "¿Qué son las organizaciones?".
  * Extraído del `OrgInfoSheetComponent` inline de `AccountPage` bajo el proceso de
@@ -46110,15 +46112,15 @@ class OrgInfoSheetComponent {
             text: this.closeProps.text || this.resolvedCloseLabel(),
         }));
         addIcons({ peopleOutline, swapHorizontalOutline, mailOutline });
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$2)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$2, ORG_INFO_SHEET_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$7)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$7, ORG_INFO_SHEET_I18N);
         }
     }
     dismiss() {
         this._modalRef?.dismiss(null, 'cancel');
     }
     tt(key) {
-        return this.i18n.t(key, DEFAULT_NAMESPACE$2);
+        return this.i18n.t(key, DEFAULT_NAMESPACE$7);
     }
     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: `
@@ -46285,7 +46287,7 @@ const SWITCH_ORG_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$1 = 'Settings.SwitchOrg';
+const DEFAULT_NAMESPACE$6 = 'Settings.SwitchOrg';
 addIcons({ businessOutline, checkmarkCircleOutline });
 /**
  * `val-switch-org-modal` — modal de cambio de organización activa (organism
@@ -46311,7 +46313,7 @@ class SwitchOrgModalComponent {
         this.orgSwitch = inject(OrgSwitchService);
         this.errors = inject(ValtechErrorService);
         /** Namespace i18n con que la vista resuelve sus textos. */
-        this.i18nNamespace = DEFAULT_NAMESPACE$1;
+        this.i18nNamespace = DEFAULT_NAMESPACE$6;
         this.orgs = signal([]);
         this.loading = signal(false);
         this.query = signal('');
@@ -46327,8 +46329,8 @@ class SwitchOrgModalComponent {
                 return list;
             return list.filter(o => o.name.toLowerCase().includes(q));
         });
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$1)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$1, SWITCH_ORG_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$6)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$6, SWITCH_ORG_MODAL_I18N);
         }
         this.loadOrgs();
     }
@@ -46646,7 +46648,7 @@ const ACCOUNT_VIEW_I18N = {
 };
 
 addIcons({ peopleOutline, businessOutline, chevronForwardOutline, swapHorizontalOutline, mailOutline });
-const DEFAULT_NAMESPACE = 'Settings.Account';
+const DEFAULT_NAMESPACE$5 = 'Settings.Account';
 const DEFAULT_MANAGE_ORG_ROUTE = '/app/settings/organization';
 /**
  * `val-account-view` — vista Cuenta full-feature autocontenida (organism).
@@ -46687,7 +46689,7 @@ class AccountViewComponent {
                 showNewOrgCta: merged.showNewOrgCta ?? true,
                 showLogout: merged.showLogout ?? true,
                 showDeleteAccount: merged.showDeleteAccount ?? true,
-                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$5,
                 manageOrgRoute: merged.manageOrgRoute ?? DEFAULT_MANAGE_ORG_ROUTE,
                 onOrgSwitched: merged.onOrgSwitched,
                 onOrgCreated: merged.onOrgCreated,
@@ -47374,6 +47376,2729 @@ function provideValtechAccountRoutes(opts) {
     ];
 }
 
+/**
+ * Defaults i18n (es/en) embebidos en `val-edit-org-modal`. Auto-registrados en
+ * el constructor del componente si el consumer no proveyó el namespace
+ * (`EditOrgModal` por default). SOLO incluye las keys que el modal usa.
+ */
+const EDIT_ORG_MODAL_I18N = {
+    es: {
+        title: 'Editar organización',
+        subtitle: 'Actualiza el nombre y descripción.',
+        nameLabel: 'Nombre',
+        namePlaceholder: 'Nombre de la organización',
+        nameRequired: 'El nombre es obligatorio.',
+        nameMin: 'Mínimo 2 caracteres.',
+        descriptionLabel: 'Descripción (opcional)',
+        descriptionPlaceholder: 'Describe tu organización',
+        saveCta: 'Guardar cambios',
+        close: 'Cancelar',
+        saveSuccess: 'Organización actualizada.',
+        saveError: 'No se pudo guardar. Intenta de nuevo.',
+        fillRequired: 'Completa todos los campos requeridos.',
+    },
+    en: {
+        title: 'Edit organization',
+        subtitle: 'Update the name and description.',
+        nameLabel: 'Name',
+        namePlaceholder: 'Organization name',
+        nameRequired: 'Name is required.',
+        nameMin: 'Minimum 2 characters.',
+        descriptionLabel: 'Description (optional)',
+        descriptionPlaceholder: 'Describe your organization',
+        saveCta: 'Save changes',
+        close: 'Cancel',
+        saveSuccess: 'Organization updated.',
+        saveError: 'Could not save. Please try again.',
+        fillRequired: 'Please fill in all required fields.',
+    },
+};
+
+const DEFAULT_NAMESPACE$4 = '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
+ * gestión de organización (y futuras vistas org-aware).
+ *
+ * Edita la org vía `OrgService.updateOrg`. El formulario se construye una vez y se
+ * mantiene reactivo a idioma + estado de trabajo vía effects `allowSignalWrites`.
+ * Si el consumer no pasa `org`, cae al `activeOrgId` del `AuthService`.
+ *
+ * Abierto vía `ModalService` — recibe `_modalRef` por `componentProps` + callback
+ * `onSuccess(updated)`. Header canónico (Regla #5): sin `ion-title`, botón Cerrar
+ * texto en `slot=end`, título/subtítulo en el body con `val-display`/`val-title`.
+ *
+ * Auto-registra sus defaults i18n (es/en) si el consumer no proveyó el namespace
+ * `EditOrgModal`.
+ */
+class EditOrgModalComponent {
+    constructor() {
+        this.i18n = inject(I18nService);
+        this.orgService = inject(OrgService);
+        this.toast = inject(ToastService);
+        this.errors = inject(ValtechErrorService);
+        this.auth = inject(AuthService);
+        /** Organización a editar (pasada por `componentProps`). */
+        this.org = null;
+        /** Namespace i18n con que la vista resuelve sus textos. */
+        this.i18nNamespace = DEFAULT_NAMESPACE$4;
+        this.saving = signal(false);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$4)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$4, EDIT_ORG_MODAL_I18N);
+        }
+        this.formMeta = signal(this.buildFormMeta());
+        effect(() => {
+            this.i18n.lang();
+            this.formMeta.set(this.buildFormMeta());
+        }, { allowSignalWrites: true });
+        effect(() => {
+            const w = this.saving();
+            this.formMeta.update(m => ({
+                ...m,
+                state: w ? ComponentStates.WORKING : ComponentStates.ENABLED,
+                actions: {
+                    ...m.actions,
+                    state: w ? ComponentStates.WORKING : ComponentStates.ENABLED,
+                },
+            }));
+        }, { allowSignalWrites: true });
+    }
+    ngOnInit() {
+        this.formMeta.set(this.buildFormMeta());
+    }
+    get activeOrgId() {
+        const u = this.auth.user();
+        return u?.activeOrgId ?? u?.activeOrg ?? '';
+    }
+    buildFormMeta() {
+        const nameField = {
+            token: 'edit-org-name',
+            name: 'name',
+            label: this.t('nameLabel'),
+            hint: '',
+            placeholder: this.t('namePlaceholder'),
+            type: InputType.TEXT,
+            order: 1,
+            validators: [Validators.required, Validators.minLength(2), Validators.maxLength(100)],
+            errors: {
+                required: this.t('nameRequired'),
+                minlength: this.t('nameMin'),
+            },
+            value: this.org?.name ?? '',
+            state: ComponentStates.ENABLED,
+        };
+        const descField = {
+            token: 'edit-org-desc',
+            name: 'description',
+            label: this.t('descriptionLabel'),
+            hint: '',
+            placeholder: this.t('descriptionPlaceholder'),
+            type: InputType.TEXTAREA,
+            order: 2,
+            validators: [],
+            errors: {},
+            value: this.org?.description ?? '',
+            state: ComponentStates.ENABLED,
+        };
+        return {
+            name: '',
+            state: ComponentStates.ENABLED,
+            sections: [{ name: '', order: 1, fields: [nameField, descField] }],
+            actions: {
+                text: this.t('saveCta'),
+                color: 'dark',
+                type: 'submit',
+                fill: 'solid',
+                size: 'default',
+                shape: 'round',
+                expand: 'block',
+                state: ComponentStates.ENABLED,
+                token: 'edit-org-submit',
+            },
+        };
+    }
+    onFormSubmit(event) {
+        const name = event.fields['name'];
+        if (!name?.trim()) {
+            this.toast.show({
+                message: this.t('fillRequired'),
+                duration: 3000,
+                color: 'dark',
+                position: 'top',
+            });
+            return;
+        }
+        const description = event.fields['description'] ?? '';
+        void this.save(name, description);
+    }
+    async save(name, description) {
+        const orgId = this.org?.id ?? this.activeOrgId;
+        if (!orgId || this.saving())
+            return;
+        this.saving.set(true);
+        try {
+            const updated = await firstValueFrom(this.orgService.updateOrg(orgId, { name, description }));
+            this.toast.show({
+                message: this.t('saveSuccess'),
+                color: 'dark',
+                duration: 3500,
+            });
+            this.onSuccess?.(updated);
+            this._modalRef?.dismiss(updated, 'confirm');
+        }
+        catch (err) {
+            this.errors.handle(err, {
+                context: 'editOrgModal.save',
+                fallbackKey: 'saveError',
+                i18nNamespace: this.i18nNamespace,
+            });
+        }
+        finally {
+            this.saving.set(false);
+        }
+    }
+    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: EditOrgModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: EditOrgModalComponent, isStandalone: true, selector: "val-edit-org-modal", inputs: { _modalRef: "_modalRef", org: "org", onSuccess: "onSuccess", 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' }" />
+      <val-title
+        [props]="{
+          content: t('subtitle'),
+          size: 'large',
+          color: '',
+          bold: false,
+        }"
+      />
+      <val-form [props]="formMeta()" (onSubmit)="onFormSubmit($event)" />
+    </ion-content>
+  `, isInline: true, dependencies: [{ 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: FormComponent, selector: "val-form", inputs: ["props"], outputs: ["onSubmit", "onInvalid", "onSelectChange"] }, { kind: "component", type: DisplayComponent, selector: "val-display", inputs: ["props"] }, { kind: "component", type: TitleComponent, selector: "val-title", inputs: ["props"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EditOrgModalComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'val-edit-org-modal',
+                    standalone: true,
+                    imports: [IonHeader, IonToolbar, IonButtons, IonButton, IonContent, FormComponent, DisplayComponent, 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' }" />
+      <val-title
+        [props]="{
+          content: t('subtitle'),
+          size: 'large',
+          color: '',
+          bold: false,
+        }"
+      />
+      <val-form [props]="formMeta()" (onSubmit)="onFormSubmit($event)" />
+    </ion-content>
+  `,
+                }]
+        }], ctorParameters: () => [], propDecorators: { _modalRef: [{
+                type: Input
+            }], org: [{
+                type: Input
+            }], onSuccess: [{
+                type: Input
+            }], i18nNamespace: [{
+                type: Input
+            }] } });
+
+/**
+ * Defaults i18n (es/en) embebidos en `val-invite-member-modal`. Auto-registrados
+ * en el constructor del componente si el consumer no proveyó el namespace
+ * (`InviteModal` por default). SOLO incluye las keys que el modal usa.
+ */
+const INVITE_MEMBER_MODAL_I18N = {
+    es: {
+        title: 'Invitar miembro',
+        subtitle: 'Busca por handle o escribe un correo para invitar.',
+        searchPlaceholder: 'Handle (@usuario) o correo...',
+        searchingLabel: 'Buscando...',
+        noResults: 'No se encontraron usuarios.',
+        inviteByEmail: 'Invitar por correo a:',
+        sendInvite: 'Enviar invitación',
+        sending: 'Enviando...',
+        success: 'Invitación enviada.',
+        successPlural: 'Invitaciones enviadas.',
+        close: 'Cerrar',
+        errorInvalid: 'Ingresa un handle o correo válido.',
+        sendSelected: 'Invitar seleccionados',
+        selectedLabel: 'Seleccionados',
+        roleLabel: 'Rol',
+        roleViewer: 'Visor',
+        roleViewerDesc: 'Solo lectura',
+        roleEditor: 'Editor',
+        roleEditorDesc: 'Puede editar contenido',
+        roleAdmin: 'Administrador',
+        roleAdminDesc: 'Gestión completa',
+    },
+    en: {
+        title: 'Invite member',
+        subtitle: 'Search by handle or enter an email to invite.',
+        searchPlaceholder: 'Handle (@user) or email...',
+        searchingLabel: 'Searching...',
+        noResults: 'No users found.',
+        inviteByEmail: 'Invite by email:',
+        sendInvite: 'Send invitation',
+        sending: 'Sending...',
+        success: 'Invitation sent.',
+        successPlural: 'Invitations sent.',
+        close: 'Close',
+        errorInvalid: 'Enter a valid handle or email.',
+        sendSelected: 'Invite selected',
+        selectedLabel: 'Selected',
+        roleLabel: 'Role',
+        roleViewer: 'Viewer',
+        roleViewerDesc: 'Read only',
+        roleEditor: 'Editor',
+        roleEditorDesc: 'Can edit content',
+        roleAdmin: 'Admin',
+        roleAdminDesc: 'Full management',
+    },
+};
+
+const DEFAULT_NAMESPACE$3 = 'InviteModal';
+addIcons({ personOutline, mailOutline, closeOutline, checkmarkCircleOutline });
+/**
+ * `val-invite-member-modal` — invitación de miembros a una organización.
+ * Promovido desde `showcase` bajo el proceso de ADR-021.
+ *
+ * Busca usuarios por handle en Firestore `/profiles` (multi-select) o invita por
+ * email cuando el query es un correo válido. Asigna el rol seleccionado y envía la
+ * invitación vía `OrgService.inviteUser`. Excluye al usuario actual y a los
+ * `existingMemberIds` de los resultados.
+ *
+ * Abierto vía `ModalService` — recibe `_modalRef` por `componentProps` + callback
+ * `onSuccess`. Header canónico (Regla #5): sin `ion-title`, botón Cerrar texto en
+ * `slot=end`, título/subtítulo en el body con `val-display`/`val-title`.
+ *
+ * Auto-registra sus defaults i18n (es/en) si el consumer no proveyó el namespace
+ * `InviteModal`.
+ */
+class InviteMemberModalComponent {
+    constructor() {
+        this.orgService = inject(OrgService);
+        this.auth = inject(AuthService);
+        this.toast = inject(ToastService);
+        this.errors = inject(ValtechErrorService);
+        this.firestore = inject(Firestore);
+        this.i18n = inject(I18nService);
+        /** Organización a la que se invita. */
+        this.orgId = '';
+        /** Ids de miembros ya existentes (excluidos de los resultados). */
+        this.existingMemberIds = [];
+        /** Namespace i18n con que la vista resuelve sus textos. */
+        this.i18nNamespace = DEFAULT_NAMESPACE$3;
+        this.query = signal('');
+        this.searching = signal(false);
+        this.searchResults = signal([]);
+        this.selectedUsers = signal([]);
+        this.sending = signal(false);
+        this.selectedRole = signal('viewer');
+        this.availableRoles = signal([
+            { id: 'viewer', name: 'viewer' },
+            { id: 'editor', name: 'editor' },
+            { id: 'admin', name: 'admin' },
+        ]);
+        this.roleControl = new FormControl('viewer');
+        this.roleSelectProps = computed(() => ({
+            control: this.roleControl,
+            label: '',
+            placeholder: this.t('roleLabel'),
+            type: InputType.SELECT,
+            state: ComponentStates.ENABLED,
+            options: this.availableRoles().map(r => ({
+                id: r.id,
+                name: this.roleDisplayName(r),
+                order: 0,
+            })),
+        }));
+        this.isEmail = computed(() => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(this.query().trim()));
+        this.sendButtonProps = computed(() => ({
+            text: this.t('sendInvite'),
+            token: 'invite-submit-email',
+            color: 'primary',
+            fill: 'solid',
+            expand: 'block',
+            size: 'default',
+            type: 'button',
+            state: this.sending() ? ComponentStates.WORKING : ComponentStates.ENABLED,
+        }));
+        this.sendSelectedProps = computed(() => ({
+            text: `${this.t('sendSelected')} (${this.selectedUsers().length})`,
+            token: 'invite-submit',
+            color: 'primary',
+            fill: 'solid',
+            expand: 'block',
+            size: 'default',
+            type: 'button',
+            state: this.sending() ? ComponentStates.WORKING : ComponentStates.ENABLED,
+        }));
+        this.searchSubject = new Subject();
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$3)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$3, INVITE_MEMBER_MODAL_I18N);
+        }
+        this.loadRoles();
+        this.roleSub = this.roleControl.valueChanges.subscribe(v => {
+            if (v)
+                this.selectedRole.set(v);
+        });
+        // val-searchbar already debounces -- pipeline only needs distinctUntilChanged + switchMap
+        this.searchSubject
+            .pipe(distinctUntilChanged$1(), switchMap(q => {
+            if (!q || q.length < 2 || this.isEmail()) {
+                this.searching.set(false);
+                this.searchResults.set([]);
+                return [];
+            }
+            const cleanQ = (q.startsWith('@') ? q.slice(1) : q).toLowerCase();
+            const q$ = query$1(collection(this.firestore, 'profiles'), orderBy('handle'), startAt(cleanQ), endAt(cleanQ + ''), limit(8));
+            return from(getDocs(q$)).pipe(map$1(snap => ({
+                users: snap.docs.map(d => ({
+                    userId: d.id,
+                    handle: d.data()['handle'],
+                    name: d.data()['name'],
+                })),
+            })));
+        }))
+            .subscribe({
+            next: res => {
+                if (res && 'users' in res) {
+                    const currentUserId = this.auth.user()?.userId;
+                    const excluded = new Set([
+                        ...(currentUserId ? [currentUserId] : []),
+                        ...this.existingMemberIds,
+                    ]);
+                    this.searchResults.set(res.users.filter(u => !excluded.has(u.userId)));
+                }
+                this.searching.set(false);
+            },
+            error: () => {
+                this.searchResults.set([]);
+                this.searching.set(false);
+            },
+        });
+    }
+    onQueryChange(value) {
+        this.query.set(value ?? '');
+        if (!this.isEmail() && (value ?? '').length >= 2) {
+            this.searching.set(true);
+        }
+        else {
+            this.searching.set(false);
+            this.searchResults.set([]);
+        }
+        this.searchSubject.next(value ?? '');
+    }
+    loadRoles() {
+        if (!this.orgId)
+            return;
+        this.orgService.listOrgRoles(this.orgId).subscribe({
+            next: roles => {
+                if (roles.length)
+                    this.availableRoles.set(roles);
+            },
+        });
+    }
+    roleDisplayName(role) {
+        const keyMap = {
+            viewer: 'roleViewer',
+            editor: 'roleEditor',
+            admin: 'roleAdmin',
+        };
+        const key = keyMap[role.name] ?? role.name;
+        const label = this.t(key);
+        return label && !label.startsWith('[') ? label : role.name;
+    }
+    async onInviteByEmail() {
+        const email = this.query().trim();
+        if (!email || this.sending())
+            return;
+        this.sending.set(true);
+        try {
+            await firstValueFrom(this.orgService.inviteUser(this.orgId, {
+                email,
+                roleId: this.selectedRole(),
+            }));
+            this.toast.show({
+                message: this.t('success'),
+                color: 'dark',
+                duration: 3500,
+            });
+            this.onSuccess?.();
+            this.dismiss();
+        }
+        catch (err) {
+            this.errors.handle(err, {
+                context: 'invite.byEmail',
+                fallbackKey: 'sendInvite',
+                i18nNamespace: this.i18nNamespace,
+            });
+        }
+        finally {
+            this.sending.set(false);
+        }
+    }
+    isSelected(userId) {
+        return this.selectedUsers().some(u => u.userId === userId);
+    }
+    toggleUser(user) {
+        if (this.isSelected(user.userId)) {
+            this.selectedUsers.update(list => list.filter(u => u.userId !== user.userId));
+        }
+        else {
+            this.selectedUsers.update(list => [...list, user]);
+        }
+    }
+    async onSendSelected() {
+        const users = this.selectedUsers();
+        if (!users.length || this.sending())
+            return;
+        this.sending.set(true);
+        try {
+            await Promise.all(users.map(u => firstValueFrom(this.orgService.inviteUser(this.orgId, {
+                userId: u.userId,
+                roleId: this.selectedRole(),
+            }))));
+            this.toast.show({
+                message: users.length === 1 ? this.t('success') : this.t('successPlural'),
+                color: 'dark',
+                duration: 3500,
+            });
+            this.selectedUsers.set([]);
+            this.onSuccess?.();
+            this.dismiss();
+        }
+        catch (err) {
+            this.errors.handle(err, {
+                context: 'invite.byUserId',
+                fallbackKey: 'sendInvite',
+                i18nNamespace: this.i18nNamespace,
+            });
+        }
+        finally {
+            this.sending.set(false);
+        }
+    }
+    ngOnDestroy() {
+        this.roleSub?.unsubscribe();
+    }
+    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: InviteMemberModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: InviteMemberModalComponent, isStandalone: true, selector: "val-invite-member-modal", inputs: { _modalRef: "_modalRef", orgId: "orgId", existingMemberIds: "existingMemberIds", onSuccess: "onSuccess", 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' }" />
+      <val-title
+        [props]="{
+          content: t('subtitle'),
+          size: 'large',
+          color: '',
+          bold: false,
+        }"
+      />
+
+      <div class="role-select-wrap">
+        <val-title
+          [props]="{
+            content: t('roleLabel'),
+            size: 'small',
+            color: 'dark',
+            bold: false,
+          }"
+        />
+        <val-select-input data-testid="invite-role-select" [props]="roleSelectProps()" />
+      </div>
+
+      <div class="search-section">
+        <val-searchbar
+          data-testid="invite-search"
+          [props]="{
+            placeholder: t('searchPlaceholder'),
+            debounce: 350,
+            showCancelButton: 'never',
+          }"
+          (filterEvent)="onQueryChange($event)"
+        />
+
+        @if (searching()) {
+          <div class="search-state">
+            <ion-spinner name="crescent" />
+            <span>{{ t('searchingLabel') }}</span>
+          </div>
+        } @else if (isEmail()) {
+          <div class="email-invite-card">
+            <ion-icon name="mail-outline" class="email-icon" />
+            <div class="email-invite-text">
+              <span class="email-invite-label">{{ t('inviteByEmail') }}</span>
+              <span class="email-invite-address">{{ query().trim() }}</span>
+            </div>
+          </div>
+          <val-button [props]="sendButtonProps()" (click)="onInviteByEmail()" />
+        } @else if (query().length >= 2 && searchResults().length === 0) {
+          <val-empty-state
+            [props]="{
+              variant: 'empty',
+              title: t('noResults'),
+              icon: 'person-outline',
+            }"
+          />
+        } @else if (searchResults().length > 0) {
+          <div class="results-list">
+            @for (user of searchResults(); track user.userId) {
+              <div
+                class="result-card"
+                [attr.data-testid]="'invite-result-' + user.userId"
+                [class.result-card--selected]="isSelected(user.userId)"
+                (click)="toggleUser(user)"
+                role="checkbox"
+                [attr.aria-checked]="isSelected(user.userId)"
+              >
+                <div class="result-card__avatar">
+                  <ion-icon name="person-outline" />
+                </div>
+                <div class="result-card__body">
+                  <span class="result-card__name">{{ user.name || user.handle }}</span>
+                  @if (user.handle) {
+                    <span class="result-card__handle">&#64;{{ user.handle }}</span>
+                  }
+                </div>
+                <div class="result-card__check">
+                  @if (isSelected(user.userId)) {
+                    <ion-icon name="checkmark-circle-outline" class="check-on" />
+                  } @else {
+                    <div class="check-off"></div>
+                  }
+                </div>
+              </div>
+            }
+          </div>
+        }
+
+        @if (selectedUsers().length > 0) {
+          <div class="selected-section">
+            <span class="selected-section__label">{{ t('selectedLabel') }} ({{ selectedUsers().length }})</span>
+            <div class="selected-chips">
+              @for (user of selectedUsers(); track user.userId) {
+                <div class="selected-chip">
+                  <span>{{ user.handle ? '@' + user.handle : user.name || user.userId }}</span>
+                  <button class="selected-chip__remove" (click)="toggleUser(user)" aria-label="Quitar">&times;</button>
+                </div>
+              }
+            </div>
+            <val-button [props]="sendSelectedProps()" (click)="onSendSelected()" />
+          </div>
+        }
+      </div>
+    </ion-content>
+  `, isInline: true, styles: ["ion-content{--padding-bottom: 24px}val-display{margin-bottom:4px;display:block}val-title{margin-bottom:8px;display:block}.role-select-wrap{margin-bottom:12px}.role-select{width:100%}val-searchbar{display:block;margin-bottom:4px}.search-section{display:flex;flex-direction:column;gap:14px}.search-state{display:flex;align-items:center;gap:10px;padding:12px 0;color:var(--ion-color-medium);font-size:.88rem}.email-invite-card{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:12px;border:1.5px solid var(--ion-color-primary);background:color-mix(in srgb,var(--ion-color-primary) 8%,transparent)}.email-icon{font-size:24px;color:var(--ion-color-primary);flex-shrink:0}.email-invite-text{display:flex;flex-direction:column;gap:2px}.email-invite-label{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.email-invite-address{font-weight:600;font-size:.95rem;color:var(--ion-color-dark);word-break:break-all}.results-list{display:flex;flex-direction:column;gap:8px}.result-card{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:12px;background:var(--ion-color-light, #f4f5f8);cursor:pointer;transition:opacity .15s}.result-card:active{opacity:.7}:host-context(body.dark) .result-card,:host-context(html.ion-palette-dark) .result-card,:host-context([data-theme=\"dark\"]) .result-card{background:#ffffff0d}.result-card__avatar{width:40px;height:40px;border-radius:50%;background:color-mix(in srgb,var(--ion-color-primary) 15%,transparent);display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--ion-color-primary);flex-shrink:0}.result-card__body{display:flex;flex-direction:column;gap:2px}.result-card__name{font-weight:600;font-size:.9rem;color:var(--ion-color-dark)}.result-card__handle{font-size:.78rem;color:var(--ion-color-medium)}.result-card--selected{border:1.5px solid var(--ion-color-primary);background:color-mix(in srgb,var(--ion-color-primary) 8%,transparent)}.result-card__check{flex-shrink:0;margin-left:auto}.check-on{font-size:22px;color:var(--ion-color-primary)}.check-off{width:22px;height:22px;border-radius:50%;border:2px solid var(--ion-color-medium)}.selected-section{border-top:1px solid var(--val-border-color, rgba(0, 0, 0, .08));padding-top:14px;display:flex;flex-direction:column;gap:10px}.selected-section__label{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.selected-chips{display:flex;flex-wrap:wrap;gap:6px}.selected-chip{display:flex;align-items:center;gap:4px;padding:4px 10px 4px 12px;border-radius:20px;background:color-mix(in srgb,var(--ion-color-primary) 12%,transparent);color:var(--ion-color-primary);font-size:.82rem;font-weight:600}.selected-chip__remove{border:none;background:none;cursor:pointer;font-size:1rem;line-height:1;color:var(--ion-color-primary);padding:0 2px;opacity:.7}.selected-chip__remove:hover{opacity:1}\n"], dependencies: [{ 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: IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: ButtonComponent, selector: "val-button", inputs: ["preset", "props"], outputs: ["onClick"] }, { kind: "component", type: DisplayComponent, selector: "val-display", inputs: ["props"] }, { kind: "component", type: EmptyStateComponent, selector: "val-empty-state", inputs: ["props"] }, { kind: "component", type: SearchbarComponent, selector: "val-searchbar", inputs: ["preset", "props"], outputs: ["filterEvent", "focusEvent", "blurEvent"] }, { kind: "component", type: SearchSelectorComponent, selector: "val-select-input", inputs: ["preset", "props"] }, { kind: "component", type: TitleComponent, selector: "val-title", inputs: ["props"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: InviteMemberModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'val-invite-member-modal', standalone: true, imports: [
+                        IonHeader,
+                        IonToolbar,
+                        IonButtons,
+                        IonButton,
+                        IonContent,
+                        IonSpinner,
+                        IonIcon,
+                        ReactiveFormsModule,
+                        ButtonComponent,
+                        DisplayComponent,
+                        EmptyStateComponent,
+                        SearchbarComponent,
+                        SearchSelectorComponent,
+                        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' }" />
+      <val-title
+        [props]="{
+          content: t('subtitle'),
+          size: 'large',
+          color: '',
+          bold: false,
+        }"
+      />
+
+      <div class="role-select-wrap">
+        <val-title
+          [props]="{
+            content: t('roleLabel'),
+            size: 'small',
+            color: 'dark',
+            bold: false,
+          }"
+        />
+        <val-select-input data-testid="invite-role-select" [props]="roleSelectProps()" />
+      </div>
+
+      <div class="search-section">
+        <val-searchbar
+          data-testid="invite-search"
+          [props]="{
+            placeholder: t('searchPlaceholder'),
+            debounce: 350,
+            showCancelButton: 'never',
+          }"
+          (filterEvent)="onQueryChange($event)"
+        />
+
+        @if (searching()) {
+          <div class="search-state">
+            <ion-spinner name="crescent" />
+            <span>{{ t('searchingLabel') }}</span>
+          </div>
+        } @else if (isEmail()) {
+          <div class="email-invite-card">
+            <ion-icon name="mail-outline" class="email-icon" />
+            <div class="email-invite-text">
+              <span class="email-invite-label">{{ t('inviteByEmail') }}</span>
+              <span class="email-invite-address">{{ query().trim() }}</span>
+            </div>
+          </div>
+          <val-button [props]="sendButtonProps()" (click)="onInviteByEmail()" />
+        } @else if (query().length >= 2 && searchResults().length === 0) {
+          <val-empty-state
+            [props]="{
+              variant: 'empty',
+              title: t('noResults'),
+              icon: 'person-outline',
+            }"
+          />
+        } @else if (searchResults().length > 0) {
+          <div class="results-list">
+            @for (user of searchResults(); track user.userId) {
+              <div
+                class="result-card"
+                [attr.data-testid]="'invite-result-' + user.userId"
+                [class.result-card--selected]="isSelected(user.userId)"
+                (click)="toggleUser(user)"
+                role="checkbox"
+                [attr.aria-checked]="isSelected(user.userId)"
+              >
+                <div class="result-card__avatar">
+                  <ion-icon name="person-outline" />
+                </div>
+                <div class="result-card__body">
+                  <span class="result-card__name">{{ user.name || user.handle }}</span>
+                  @if (user.handle) {
+                    <span class="result-card__handle">&#64;{{ user.handle }}</span>
+                  }
+                </div>
+                <div class="result-card__check">
+                  @if (isSelected(user.userId)) {
+                    <ion-icon name="checkmark-circle-outline" class="check-on" />
+                  } @else {
+                    <div class="check-off"></div>
+                  }
+                </div>
+              </div>
+            }
+          </div>
+        }
+
+        @if (selectedUsers().length > 0) {
+          <div class="selected-section">
+            <span class="selected-section__label">{{ t('selectedLabel') }} ({{ selectedUsers().length }})</span>
+            <div class="selected-chips">
+              @for (user of selectedUsers(); track user.userId) {
+                <div class="selected-chip">
+                  <span>{{ user.handle ? '@' + user.handle : user.name || user.userId }}</span>
+                  <button class="selected-chip__remove" (click)="toggleUser(user)" aria-label="Quitar">&times;</button>
+                </div>
+              }
+            </div>
+            <val-button [props]="sendSelectedProps()" (click)="onSendSelected()" />
+          </div>
+        }
+      </div>
+    </ion-content>
+  `, styles: ["ion-content{--padding-bottom: 24px}val-display{margin-bottom:4px;display:block}val-title{margin-bottom:8px;display:block}.role-select-wrap{margin-bottom:12px}.role-select{width:100%}val-searchbar{display:block;margin-bottom:4px}.search-section{display:flex;flex-direction:column;gap:14px}.search-state{display:flex;align-items:center;gap:10px;padding:12px 0;color:var(--ion-color-medium);font-size:.88rem}.email-invite-card{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:12px;border:1.5px solid var(--ion-color-primary);background:color-mix(in srgb,var(--ion-color-primary) 8%,transparent)}.email-icon{font-size:24px;color:var(--ion-color-primary);flex-shrink:0}.email-invite-text{display:flex;flex-direction:column;gap:2px}.email-invite-label{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.email-invite-address{font-weight:600;font-size:.95rem;color:var(--ion-color-dark);word-break:break-all}.results-list{display:flex;flex-direction:column;gap:8px}.result-card{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:12px;background:var(--ion-color-light, #f4f5f8);cursor:pointer;transition:opacity .15s}.result-card:active{opacity:.7}:host-context(body.dark) .result-card,:host-context(html.ion-palette-dark) .result-card,:host-context([data-theme=\"dark\"]) .result-card{background:#ffffff0d}.result-card__avatar{width:40px;height:40px;border-radius:50%;background:color-mix(in srgb,var(--ion-color-primary) 15%,transparent);display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--ion-color-primary);flex-shrink:0}.result-card__body{display:flex;flex-direction:column;gap:2px}.result-card__name{font-weight:600;font-size:.9rem;color:var(--ion-color-dark)}.result-card__handle{font-size:.78rem;color:var(--ion-color-medium)}.result-card--selected{border:1.5px solid var(--ion-color-primary);background:color-mix(in srgb,var(--ion-color-primary) 8%,transparent)}.result-card__check{flex-shrink:0;margin-left:auto}.check-on{font-size:22px;color:var(--ion-color-primary)}.check-off{width:22px;height:22px;border-radius:50%;border:2px solid var(--ion-color-medium)}.selected-section{border-top:1px solid var(--val-border-color, rgba(0, 0, 0, .08));padding-top:14px;display:flex;flex-direction:column;gap:10px}.selected-section__label{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.selected-chips{display:flex;flex-wrap:wrap;gap:6px}.selected-chip{display:flex;align-items:center;gap:4px;padding:4px 10px 4px 12px;border-radius:20px;background:color-mix(in srgb,var(--ion-color-primary) 12%,transparent);color:var(--ion-color-primary);font-size:.82rem;font-weight:600}.selected-chip__remove{border:none;background:none;cursor:pointer;font-size:1rem;line-height:1;color:var(--ion-color-primary);padding:0 2px;opacity:.7}.selected-chip__remove:hover{opacity:1}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { _modalRef: [{
+                type: Input
+            }], orgId: [{
+                type: Input
+            }], existingMemberIds: [{
+                type: Input
+            }], onSuccess: [{
+                type: Input
+            }], i18nNamespace: [{
+                type: Input
+            }] } });
+
+/**
+ * Defaults i18n (es/en) embebidos en `val-member-detail-modal`. Auto-registrados
+ * en el constructor del componente si el consumer no proveyó el namespace
+ * (`Settings.MemberDetail` por default). SOLO incluye las keys que el modal usa.
+ */
+const MEMBER_DETAIL_MODAL_I18N = {
+    es: {
+        close: 'Cerrar',
+        subtitleSelf: 'Tú',
+        roleLabel: 'Rol',
+        roleHint: 'Cambia el rol de este miembro en la organización.',
+        roleReadonly: 'Rol en la organización',
+        roleViewer: 'Visor',
+        roleEditor: 'Editor',
+        roleAdmin: 'Admin',
+        roleSuperAdmin: 'Super Admin',
+        removeCta: 'Quitar de la organización',
+        removeConfirmTitle: 'Quitar miembro',
+        removeConfirmMessage: '¿Quitar a este miembro de la organización?',
+        removeConfirmOk: 'Quitar',
+        cancelCta: 'Cancelar',
+        changeRoleSuccess: 'Rol actualizado.',
+        changeRoleError: 'No se pudo cambiar el rol.',
+        removeSuccess: 'Miembro eliminado.',
+        removeError: 'No se pudo eliminar al miembro.',
+        permissionsTitle: 'Permisos del rol',
+        permAll: 'Todo',
+        permUsers: 'Usuarios',
+        permDocuments: 'Documentos',
+        permRoles: 'Roles',
+        permMedia: 'Media',
+        permTemplates: 'Plantillas',
+        permRead: 'Leer',
+        permWrite: 'Escribir',
+        permCreate: 'Crear',
+        permDelete: 'Eliminar',
+        permManage: 'Gestionar',
+    },
+    en: {
+        close: 'Close',
+        subtitleSelf: 'You',
+        roleLabel: 'Role',
+        roleHint: "Change this member's role in the organization.",
+        roleReadonly: 'Role in the organization',
+        roleViewer: 'Viewer',
+        roleEditor: 'Editor',
+        roleAdmin: 'Admin',
+        roleSuperAdmin: 'Super Admin',
+        removeCta: 'Remove from organization',
+        removeConfirmTitle: 'Remove member',
+        removeConfirmMessage: 'Remove this member from the organization?',
+        removeConfirmOk: 'Remove',
+        cancelCta: 'Cancel',
+        changeRoleSuccess: 'Role updated.',
+        changeRoleError: 'Could not change role.',
+        removeSuccess: 'Member removed.',
+        removeError: 'Could not remove member.',
+        permissionsTitle: 'Role permissions',
+        permAll: 'All',
+        permUsers: 'Users',
+        permDocuments: 'Documents',
+        permRoles: 'Roles',
+        permMedia: 'Media',
+        permTemplates: 'Templates',
+        permRead: 'Read',
+        permWrite: 'Write',
+        permCreate: 'Create',
+        permDelete: 'Delete',
+        permManage: 'Manage',
+    },
+};
+
+const DEFAULT_NAMESPACE$2 = '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.
+ *
+ * Si `canManage` es true, permite cambiar el rol (vía `OrgService.changeMemberRole`)
+ * y quitar al miembro (vía `OrgService.removeMember`, con confirmación destructiva).
+ * Los permisos del rol actual se muestran cuando el consumer los provee en
+ * `availableRoles`.
+ *
+ * Abierto vía `ModalService` — recibe `_modalRef` por `componentProps` + callback
+ * `onChanged`. Header canónico (Regla #5): sin `ion-title`, botón Cerrar texto en
+ * `slot=end`, identidad en el body con `val-user-avatar`/`val-display`/`val-title`.
+ *
+ * Auto-registra sus defaults i18n (es/en) si el consumer no proveyó el namespace
+ * `Settings.MemberDetail`.
+ */
+class MemberDetailModalComponent {
+    constructor() {
+        this.orgService = inject(OrgService);
+        this.toast = inject(ToastService);
+        this.errors = inject(ValtechErrorService);
+        this.i18n = inject(I18nService);
+        this.confirmDialog = inject(ConfirmationDialogService);
+        /** Organización a la que pertenece el miembro. */
+        this.orgId = '';
+        /** Si true, habilita cambio de rol y eliminación. */
+        this.canManage = false;
+        /** Si true, el miembro mostrado es el propio usuario. */
+        this.isSelf = false;
+        /** Roles disponibles (con permisos opcionales) para el selector de rol. */
+        this.availableRoles = [
+            { id: 'viewer', name: 'viewer' },
+            { id: 'editor', name: 'editor' },
+            { id: 'admin', name: 'admin' },
+        ];
+        /** Namespace i18n con que la vista resuelve sus textos. */
+        this.i18nNamespace = DEFAULT_NAMESPACE$2;
+        this.working = signal(false);
+        this.currentRole = signal('');
+        this.roleControl = new FormControl('');
+        this.displayName = computed(() => this.member?.name || this.member?.handle || this.member?.email || '—');
+        this.subtitle = computed(() => {
+            if (this.isSelf)
+                return this.t('subtitleSelf');
+            if (this.member?.handle)
+                return '@' + this.member.handle;
+            return this.member?.email ?? '';
+        });
+        this.currentRoleLabel = computed(() => this.roleLabel(this.currentRole()));
+        this.permissionsForCurrentRole = computed(() => {
+            const roleId = this.currentRole();
+            const role = this.availableRoles.find(r => r.id === roleId || r.name === roleId);
+            return role?.permissions ?? [];
+        });
+        this.roleSelectProps = computed(() => ({
+            control: this.roleControl,
+            label: '',
+            placeholder: this.t('roleLabel'),
+            type: InputType.SELECT,
+            state: this.working() ? ComponentStates.DISABLED : ComponentStates.ENABLED,
+            options: this.availableRoles.map(r => ({
+                id: r.id,
+                name: this.roleLabel(r.name),
+                order: 0,
+            })),
+        }));
+        this.removeButtonProps = computed(() => ({
+            text: this.t('removeCta'),
+            token: 'member-remove',
+            color: 'danger',
+            fill: 'outline',
+            expand: 'block',
+            size: 'default',
+            type: 'button',
+            state: this.working() ? ComponentStates.WORKING : ComponentStates.ENABLED,
+        }));
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$2)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$2, MEMBER_DETAIL_MODAL_I18N);
+        }
+    }
+    ngOnInit() {
+        if (!this.i18n.hasNamespace(this.i18nNamespace)) {
+            this.i18n.registerContent(this.i18nNamespace, MEMBER_DETAIL_MODAL_I18N);
+        }
+        const roleName = this.member?.roles?.[0] ?? '';
+        // Resolve the role name to its UUID -- the select uses r.id (UUID) as value
+        const matched = this.availableRoles.find(r => r.name === roleName);
+        const roleId = matched?.id ?? roleName;
+        this.currentRole.set(roleId);
+        this.roleControl.setValue(roleId, { emitEvent: false });
+        this.roleSub = this.roleControl.valueChanges.subscribe(v => {
+            if (v && v !== this.currentRole())
+                void this.onChangeRole(v);
+        });
+    }
+    permissionLabel(perm) {
+        if (perm === '*:*')
+            return this.t('permAll');
+        const [resource, action] = perm.split(':');
+        const resKey = {
+            users: 'permUsers',
+            documents: 'permDocuments',
+            roles: 'permRoles',
+            media: 'permMedia',
+            templates: 'permTemplates',
+            '*': 'permAll',
+        };
+        const actKey = {
+            read: 'permRead',
+            write: 'permWrite',
+            create: 'permCreate',
+            delete: 'permDelete',
+            manage: 'permManage',
+            '*': 'permAll',
+        };
+        const res = this.t(resKey[resource] ?? resource);
+        const act = this.t(actKey[action] ?? action);
+        return `${res}: ${act}`;
+    }
+    async onChangeRole(newRoleId) {
+        if (this.working())
+            return;
+        this.working.set(true);
+        try {
+            await firstValueFrom(this.orgService.changeMemberRole(this.orgId, this.member.userId, newRoleId));
+            this.currentRole.set(newRoleId);
+            this.member = { ...this.member, roles: [newRoleId] };
+            this.toast.show({
+                message: this.t('changeRoleSuccess'),
+                color: 'dark',
+                duration: 3000,
+            });
+            this.onChanged?.();
+        }
+        catch (err) {
+            this.roleControl.setValue(this.currentRole(), { emitEvent: false });
+            this.errors.handle(err, {
+                context: 'memberDetail.changeRole',
+                fallbackKey: 'changeRoleError',
+                i18nNamespace: this.i18nNamespace,
+            });
+        }
+        finally {
+            this.working.set(false);
+        }
+    }
+    async onRemove() {
+        if (this.working())
+            return;
+        const result = await this.confirmDialog.confirmDestructive({
+            title: this.t('removeConfirmTitle'),
+            message: this.t('removeConfirmMessage'),
+            confirmButton: { text: this.t('removeConfirmOk') },
+            cancelButton: { text: this.t('cancelCta') },
+        });
+        if (!result.confirmed)
+            return;
+        this.working.set(true);
+        try {
+            await firstValueFrom(this.orgService.removeMember(this.orgId, this.member.userId));
+            this.toast.show({
+                message: this.t('removeSuccess'),
+                color: 'dark',
+                duration: 3000,
+            });
+            this.onChanged?.();
+            this.dismiss();
+        }
+        catch (err) {
+            this.errors.handle(err, {
+                context: 'memberDetail.remove',
+                fallbackKey: 'removeError',
+                i18nNamespace: this.i18nNamespace,
+            });
+        }
+        finally {
+            this.working.set(false);
+        }
+    }
+    roleLabel(roleIdOrName) {
+        // Try to find by id first (post-change, UUID stored), then by name (initial load)
+        const found = this.availableRoles.find(r => r.id === roleIdOrName || r.name === roleIdOrName);
+        const name = found?.name ?? roleIdOrName;
+        const keyMap = {
+            viewer: 'roleViewer',
+            editor: 'roleEditor',
+            admin: 'roleAdmin',
+            super_admin: 'roleSuperAdmin',
+        };
+        const key = keyMap[name] ?? name;
+        const label = this.t(key);
+        return label && !label.startsWith('[') ? label : name;
+    }
+    ngOnDestroy() {
+        this.roleSub?.unsubscribe();
+    }
+    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: MemberDetailModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: MemberDetailModalComponent, isStandalone: true, selector: "val-member-detail-modal", inputs: { _modalRef: "_modalRef", member: "member", orgId: "orgId", canManage: "canManage", isSelf: "isSelf", availableRoles: "availableRoles", onChanged: "onChanged", 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">
+      <div class="member-head">
+        <val-user-avatar
+          [props]="{
+            name: member.name,
+            avatarUrl: member.avatar,
+            email: member.email,
+            size: 'large',
+          }"
+        />
+        <val-display [props]="{ content: displayName(), size: 'small', color: 'dark' }" />
+        <val-title
+          [props]="{
+            content: subtitle(),
+            size: 'large',
+            color: '',
+            bold: false,
+          }"
+        />
+      </div>
+
+      <div class="role-section">
+        @if (canManage) {
+          <val-title
+            [props]="{
+              content: t('roleLabel'),
+              size: 'small',
+              color: 'dark',
+              bold: false,
+            }"
+          />
+          <val-select-input data-testid="member-role-select" [props]="roleSelectProps()" />
+          <val-text
+            [props]="{
+              content: t('roleHint'),
+              size: 'small',
+              color: 'medium',
+              bold: false,
+            }"
+          />
+        } @else {
+          <span class="role-readonly-label">{{ t('roleReadonly') }}</span>
+          <span class="member-role-badge">{{ currentRoleLabel() }}</span>
+        }
+      </div>
+
+      @if (permissionsForCurrentRole().length > 0) {
+        <div class="perms-section">
+          <span class="perms-label">{{ t('permissionsTitle') }}</span>
+          <div class="perms-list">
+            @for (perm of permissionsForCurrentRole(); track perm) {
+              <span class="perm-chip">{{ permissionLabel(perm) }}</span>
+            }
+          </div>
+        </div>
+      }
+
+      @if (canManage) {
+        <div class="remove-section">
+          <val-button [props]="removeButtonProps()" (click)="onRemove()" />
+        </div>
+      }
+    </ion-content>
+  `, isInline: true, styles: ["ion-content{--padding-bottom: 24px}.member-head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;margin-bottom:20px}val-display{display:block}val-title{display:block}.role-section{display:flex;flex-direction:column;gap:8px;margin-bottom:24px}.role-readonly-label{font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.member-role-badge{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:4px 12px;border-radius:20px;width:fit-content;background:color-mix(in srgb,var(--ion-color-primary) 12%,transparent);color:var(--ion-color-primary)}.perms-section{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}.perms-label{font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.perms-list{display:flex;flex-wrap:wrap;gap:6px}.perm-chip{font-size:.75rem;font-weight:500;padding:3px 10px;border-radius:20px;border:1px solid var(--val-border-color, rgba(0, 0, 0, .12));color:var(--ion-color-dark);background:transparent}.remove-section{border-top:1px solid var(--val-border-color, rgba(0, 0, 0, .08));padding-top:20px}\n"], dependencies: [{ 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: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: ButtonComponent, selector: "val-button", inputs: ["preset", "props"], outputs: ["onClick"] }, { kind: "component", type: DisplayComponent, selector: "val-display", inputs: ["props"] }, { kind: "component", type: SearchSelectorComponent, selector: "val-select-input", inputs: ["preset", "props"] }, { kind: "component", type: TextComponent, selector: "val-text", inputs: ["props"] }, { kind: "component", type: TitleComponent, selector: "val-title", inputs: ["props"] }, { kind: "component", type: UserAvatarComponent, selector: "val-user-avatar", inputs: ["props"], outputs: ["onClick"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MemberDetailModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'val-member-detail-modal', standalone: true, imports: [
+                        IonHeader,
+                        IonToolbar,
+                        IonButtons,
+                        IonButton,
+                        IonContent,
+                        ReactiveFormsModule,
+                        ButtonComponent,
+                        DisplayComponent,
+                        SearchSelectorComponent,
+                        TextComponent,
+                        TitleComponent,
+                        UserAvatarComponent,
+                    ], 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">
+      <div class="member-head">
+        <val-user-avatar
+          [props]="{
+            name: member.name,
+            avatarUrl: member.avatar,
+            email: member.email,
+            size: 'large',
+          }"
+        />
+        <val-display [props]="{ content: displayName(), size: 'small', color: 'dark' }" />
+        <val-title
+          [props]="{
+            content: subtitle(),
+            size: 'large',
+            color: '',
+            bold: false,
+          }"
+        />
+      </div>
+
+      <div class="role-section">
+        @if (canManage) {
+          <val-title
+            [props]="{
+              content: t('roleLabel'),
+              size: 'small',
+              color: 'dark',
+              bold: false,
+            }"
+          />
+          <val-select-input data-testid="member-role-select" [props]="roleSelectProps()" />
+          <val-text
+            [props]="{
+              content: t('roleHint'),
+              size: 'small',
+              color: 'medium',
+              bold: false,
+            }"
+          />
+        } @else {
+          <span class="role-readonly-label">{{ t('roleReadonly') }}</span>
+          <span class="member-role-badge">{{ currentRoleLabel() }}</span>
+        }
+      </div>
+
+      @if (permissionsForCurrentRole().length > 0) {
+        <div class="perms-section">
+          <span class="perms-label">{{ t('permissionsTitle') }}</span>
+          <div class="perms-list">
+            @for (perm of permissionsForCurrentRole(); track perm) {
+              <span class="perm-chip">{{ permissionLabel(perm) }}</span>
+            }
+          </div>
+        </div>
+      }
+
+      @if (canManage) {
+        <div class="remove-section">
+          <val-button [props]="removeButtonProps()" (click)="onRemove()" />
+        </div>
+      }
+    </ion-content>
+  `, styles: ["ion-content{--padding-bottom: 24px}.member-head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;margin-bottom:20px}val-display{display:block}val-title{display:block}.role-section{display:flex;flex-direction:column;gap:8px;margin-bottom:24px}.role-readonly-label{font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.member-role-badge{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:4px 12px;border-radius:20px;width:fit-content;background:color-mix(in srgb,var(--ion-color-primary) 12%,transparent);color:var(--ion-color-primary)}.perms-section{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}.perms-label{font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.perms-list{display:flex;flex-wrap:wrap;gap:6px}.perm-chip{font-size:.75rem;font-weight:500;padding:3px 10px;border-radius:20px;border:1px solid var(--val-border-color, rgba(0, 0, 0, .12));color:var(--ion-color-dark);background:transparent}.remove-section{border-top:1px solid var(--val-border-color, rgba(0, 0, 0, .08));padding-top:20px}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { _modalRef: [{
+                type: Input
+            }], member: [{
+                type: Input
+            }], orgId: [{
+                type: Input
+            }], canManage: [{
+                type: Input
+            }], isSelf: [{
+                type: Input
+            }], availableRoles: [{
+                type: Input
+            }], onChanged: [{
+                type: Input
+            }], i18nNamespace: [{
+                type: Input
+            }] } });
+
+/**
+ * Defaults i18n (es/en) embebidos en `val-transfer-ownership-modal`.
+ * Auto-registrados en el constructor del componente si el consumer no proveyó el
+ * namespace (`Settings.TransferModal` por default). SOLO incluye las keys que el
+ * modal usa.
+ */
+const TRANSFER_OWNERSHIP_MODAL_I18N = {
+    es: {
+        title: 'Transferir propiedad',
+        hint: 'Selecciona el nuevo propietario de la organización.',
+        searchPlaceholder: 'Buscar miembro...',
+        empty: 'No hay otros miembros disponibles.',
+        noResults: 'Sin resultados para',
+        confirmCta: 'Confirmar transferencia',
+        close: 'Cancelar',
+    },
+    en: {
+        title: 'Transfer ownership',
+        hint: 'Select the new owner of the organization.',
+        searchPlaceholder: 'Search member...',
+        empty: 'No other members available.',
+        noResults: 'No results for',
+        confirmCta: 'Confirm transfer',
+        close: 'Cancel',
+    },
+};
+
+const DEFAULT_NAMESPACE$1 = 'Settings.TransferModal';
+/**
+ * `val-transfer-ownership-modal` — selector de miembro para transferir la
+ * propiedad de la organización. Promovido desde `showcase` bajo el proceso de
+ * ADR-021.
+ *
+ * Recibe la lista de candidatos por `members` (todos excepto el owner actual),
+ * permite filtrarlos con `val-searchbar` y, al confirmar, ejecuta el callback
+ * `onConfirm(newOwnerId)`. La ejecución real de la transferencia (vía
+ * `OrgService.transferOwnership`) queda en el consumer.
+ *
+ * Abierto vía `ModalService` — recibe `_modalRef` por `componentProps`. Header
+ * canónico (Regla #5): sin `ion-title`, botón Cerrar texto en `slot=end`,
+ * título/subtítulo en el body con `val-display`/`val-title`.
+ *
+ * Auto-registra sus defaults i18n (es/en) si el consumer no proveyó el namespace
+ * `Settings.TransferModal`.
+ */
+class TransferOwnershipModalComponent {
+    constructor() {
+        this.i18n = inject(I18nService);
+        /** Lista de miembros transferibles (todos excepto el owner actual). */
+        this.members = [];
+        /** Namespace i18n con que la vista resuelve sus textos. */
+        this.i18nNamespace = DEFAULT_NAMESPACE$1;
+        this.query = signal('');
+        this.selectedId = signal('');
+        this.filtered = computed(() => {
+            const q = this.query().trim().toLowerCase();
+            if (!q)
+                return this.members;
+            return this.members.filter(m => m.name?.toLowerCase().includes(q) ||
+                m.email?.toLowerCase().includes(q) ||
+                m.userId.toLowerCase().includes(q));
+        });
+        this.noResultsLabel = computed(() => `${this.t('noResults')} "${this.query()}"`);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$1)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$1, TRANSFER_OWNERSHIP_MODAL_I18N);
+        }
+    }
+    ngOnInit() {
+        if (!this.i18n.hasNamespace(this.i18nNamespace)) {
+            this.i18n.registerContent(this.i18nNamespace, TRANSFER_OWNERSHIP_MODAL_I18N);
+        }
+    }
+    confirm() {
+        const id = this.selectedId();
+        if (!id)
+            return;
+        this.onConfirm?.(id);
+        this.dismiss();
+    }
+    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: TransferOwnershipModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: TransferOwnershipModalComponent, isStandalone: true, selector: "val-transfer-ownership-modal", inputs: { members: "members", onConfirm: "onConfirm", _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' }" />
+      <val-title
+        [props]="{
+          content: t('hint'),
+          size: 'large',
+          color: '',
+          bold: false,
+        }"
+      />
+
+      <val-searchbar
+        [props]="{ placeholder: t('searchPlaceholder'), debounce: 150 }"
+        (filterEvent)="query.set($event)"
+      />
+
+      @if (members.length === 0) {
+        <val-text
+          [props]="{
+            content: t('empty'),
+            size: 'medium',
+            color: 'medium',
+            bold: false,
+          }"
+        />
+      } @else if (filtered().length === 0) {
+        <val-text
+          [props]="{
+            content: noResultsLabel(),
+            size: 'medium',
+            color: 'medium',
+            bold: false,
+          }"
+        />
+      } @else {
+        <div class="transfer-member-list">
+          @for (m of filtered(); track m.userId) {
+            <button
+              class="transfer-member-row"
+              [class.transfer-member-row--selected]="selectedId() === m.userId"
+              (click)="selectedId.set(m.userId)"
+              type="button"
+            >
+              <span class="transfer-member-name">{{ m.name || m.email || m.userId }}</span>
+              @if (selectedId() === m.userId) {
+                <span class="transfer-member-check">&#10003;</span>
+              }
+            </button>
+          }
+        </div>
+      }
+
+      <div class="transfer-confirm-row">
+        <ion-button expand="block" color="dark" [disabled]="!selectedId()" (click)="confirm()">
+          {{ t('confirmCta') }}
+        </ion-button>
+      </div>
+    </ion-content>
+  `, isInline: true, styles: ["val-display{display:block;margin-bottom:4px}val-title{display:block;margin-bottom:16px}val-searchbar{display:block;margin-bottom:12px}.transfer-member-list{display:flex;flex-direction:column;gap:4px}.transfer-member-row{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-radius:10px;border:1.5px solid var(--ion-color-light);background:transparent;cursor:pointer;width:100%;text-align:left;font-size:15px;color:var(--ion-color-dark);transition:border-color .15s}.transfer-member-row--selected{border-color:var(--ion-color-dark);background:var(--ion-color-light)}.transfer-member-check{font-size:17px;color:var(--ion-color-dark)}.transfer-confirm-row{margin-top:24px}\n"], dependencies: [{ 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: SearchbarComponent, selector: "val-searchbar", inputs: ["preset", "props"], outputs: ["filterEvent", "focusEvent", "blurEvent"] }, { 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: TransferOwnershipModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'val-transfer-ownership-modal', standalone: true, imports: [
+                        IonHeader,
+                        IonToolbar,
+                        IonButtons,
+                        IonButton,
+                        IonContent,
+                        SearchbarComponent,
+                        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' }" />
+      <val-title
+        [props]="{
+          content: t('hint'),
+          size: 'large',
+          color: '',
+          bold: false,
+        }"
+      />
+
+      <val-searchbar
+        [props]="{ placeholder: t('searchPlaceholder'), debounce: 150 }"
+        (filterEvent)="query.set($event)"
+      />
+
+      @if (members.length === 0) {
+        <val-text
+          [props]="{
+            content: t('empty'),
+            size: 'medium',
+            color: 'medium',
+            bold: false,
+          }"
+        />
+      } @else if (filtered().length === 0) {
+        <val-text
+          [props]="{
+            content: noResultsLabel(),
+            size: 'medium',
+            color: 'medium',
+            bold: false,
+          }"
+        />
+      } @else {
+        <div class="transfer-member-list">
+          @for (m of filtered(); track m.userId) {
+            <button
+              class="transfer-member-row"
+              [class.transfer-member-row--selected]="selectedId() === m.userId"
+              (click)="selectedId.set(m.userId)"
+              type="button"
+            >
+              <span class="transfer-member-name">{{ m.name || m.email || m.userId }}</span>
+              @if (selectedId() === m.userId) {
+                <span class="transfer-member-check">&#10003;</span>
+              }
+            </button>
+          }
+        </div>
+      }
+
+      <div class="transfer-confirm-row">
+        <ion-button expand="block" color="dark" [disabled]="!selectedId()" (click)="confirm()">
+          {{ t('confirmCta') }}
+        </ion-button>
+      </div>
+    </ion-content>
+  `, styles: ["val-display{display:block;margin-bottom:4px}val-title{display:block;margin-bottom:16px}val-searchbar{display:block;margin-bottom:12px}.transfer-member-list{display:flex;flex-direction:column;gap:4px}.transfer-member-row{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-radius:10px;border:1.5px solid var(--ion-color-light);background:transparent;cursor:pointer;width:100%;text-align:left;font-size:15px;color:var(--ion-color-dark);transition:border-color .15s}.transfer-member-row--selected{border-color:var(--ion-color-dark);background:var(--ion-color-light)}.transfer-member-check{font-size:17px;color:var(--ion-color-dark)}.transfer-confirm-row{margin-top:24px}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { members: [{
+                type: Input
+            }], onConfirm: [{
+                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
+ * (`Settings.Organization` por default). SOLO incluye las keys que la vista usa.
+ *
+ * Portado de `ORG_I18N_CONTENT` (showcase) bajo el proceso de ADR-021.
+ */
+const ORGANIZATION_VIEW_I18N = {
+    es: {
+        pageTitle: 'Organización',
+        pageDescription: 'Gestiona tu organización activa',
+        infoTitle: 'Información',
+        infoName: 'Nombre',
+        infoDescription: 'Descripción',
+        infoPlan: 'Plan',
+        infoType: 'Tipo',
+        editCta: 'Editar',
+        saveCta: 'Guardar',
+        cancelCta: 'Cancelar',
+        membersTitle: 'Miembros',
+        membersEmpty: 'Sin miembros aún.',
+        memberRoles: 'Roles',
+        inviteTitle: 'Invitar',
+        inviteEmail: 'Correo electrónico',
+        inviteRole: 'Rol',
+        inviteCta: 'Invitar',
+        inviteSuccess: 'Invitación enviada.',
+        inviteError: 'No se pudo enviar la invitación.',
+        membersError: 'No se pudieron cargar los miembros.',
+        leaveTitle: 'Salir de la organización',
+        leaveHint: 'Dejarás de tener acceso a esta organización.',
+        leaveCta: 'Salir',
+        leaveOwnerHint: 'Eres el propietario. Transfiere la propiedad antes de salir.',
+        leaveConfirm: '¿Salir de la organización?',
+        planFree: 'Gratuito',
+        planPro: 'Pro',
+        planEnterprise: 'Empresa',
+        saveSuccess: 'Organización actualizada.',
+        leaveSuccess: 'Has salido de la organización.',
+        errorTitle: 'No se pudo cargar la organización',
+        offlineTitle: 'Sin conexión',
+        offlineHint: 'Verifica tu conexión e intenta de nuevo.',
+        retry: 'Reintentar',
+        saveError: 'No se pudo guardar. Intenta de nuevo.',
+        leaveError: 'No se pudo salir. Intenta de nuevo.',
+        transferTitle: 'Transferir propiedad',
+        transferHint: 'Elige un miembro para transferirle la propiedad de la organización.',
+        transferSelect: 'Seleccionar nuevo propietario',
+        transferCta: 'Transferir',
+        transferConfirm: '¿Transferir la propiedad a este miembro? Perderás el rol de propietario.',
+        transferSuccess: 'Propiedad transferida.',
+        transferError: 'No se pudo transferir la propiedad.',
+        inviteCtaTitle: '¿Deseas agregar a alguien?',
+        inviteCtaHint: 'Invita a usuarios a unirse a tu organización.',
+        inviteOpen: 'Invitar',
+        viewMemberCta: 'Ver miembro',
+        roleViewer: 'Visor',
+        roleEditor: 'Editor',
+        roleAdmin: 'Admin',
+        roleSuperAdmin: 'Super Admin',
+        rolesSectionTitle: 'Roles y permisos',
+        rolesHint: 'Tu organización tiene roles que controlan lo que cada miembro puede ver y hacer. Cada rol lleva un conjunto de permisos asociados.',
+        rolesViewPerms: 'Ver roles y permisos',
+        rolesSystemBadge: 'Sistema',
+        permAll: 'Todo',
+        permUsers: 'Usuarios',
+        permDocuments: 'Documentos',
+        permRoles: 'Roles',
+        permMedia: 'Media',
+        permTemplates: 'Plantillas',
+        permRead: 'Leer',
+        permWrite: 'Escribir',
+        permCreate: 'Crear',
+        permDelete: 'Eliminar',
+        permManage: 'Gestionar',
+        membersShowMore: 'Ver más',
+    },
+    en: {
+        pageTitle: 'Organization',
+        pageDescription: 'Manage your active organization',
+        infoTitle: 'Information',
+        infoName: 'Name',
+        infoDescription: 'Description',
+        infoPlan: 'Plan',
+        infoType: 'Type',
+        editCta: 'Edit',
+        saveCta: 'Save',
+        cancelCta: 'Cancel',
+        membersTitle: 'Members',
+        membersEmpty: 'No members yet.',
+        memberRoles: 'Roles',
+        inviteTitle: 'Invite',
+        inviteEmail: 'Email address',
+        inviteRole: 'Role',
+        inviteCta: 'Invite',
+        inviteSuccess: 'Invitation sent.',
+        inviteError: 'Could not send invitation.',
+        membersError: 'Could not load members.',
+        leaveTitle: 'Leave organization',
+        leaveHint: 'You will lose access to this organization.',
+        leaveCta: 'Leave',
+        leaveOwnerHint: 'You are the owner. Transfer ownership before leaving.',
+        leaveConfirm: 'Leave this organization?',
+        planFree: 'Free',
+        planPro: 'Pro',
+        planEnterprise: 'Enterprise',
+        saveSuccess: 'Organization updated.',
+        leaveSuccess: 'You have left the organization.',
+        errorTitle: 'Could not load organization',
+        offlineTitle: 'No connection',
+        offlineHint: 'Check your connection and try again.',
+        retry: 'Retry',
+        saveError: 'Could not save. Please try again.',
+        leaveError: 'Could not leave. Please try again.',
+        transferTitle: 'Transfer ownership',
+        transferHint: 'Choose a member to transfer ownership of this organization.',
+        transferSelect: 'Select new owner',
+        transferCta: 'Transfer',
+        transferConfirm: 'Transfer ownership to this member? You will lose the owner role.',
+        transferSuccess: 'Ownership transferred.',
+        transferError: 'Could not transfer ownership.',
+        inviteCtaTitle: 'Want to add someone?',
+        inviteCtaHint: 'Invite users to join your organization.',
+        inviteOpen: 'Invite',
+        viewMemberCta: 'View member',
+        roleViewer: 'Viewer',
+        roleEditor: 'Editor',
+        roleAdmin: 'Admin',
+        roleSuperAdmin: 'Super Admin',
+        rolesSectionTitle: 'Roles & permissions',
+        rolesHint: 'Your organization has roles that control what each member can see and do. Each role carries a set of associated permissions.',
+        rolesViewPerms: 'View roles & permissions',
+        rolesSystemBadge: 'System',
+        permAll: 'All',
+        permUsers: 'Users',
+        permDocuments: 'Documents',
+        permRoles: 'Roles',
+        permMedia: 'Media',
+        permTemplates: 'Templates',
+        permRead: 'Read',
+        permWrite: 'Write',
+        permCreate: 'Create',
+        permDelete: 'Delete',
+        permManage: 'Manage',
+        membersShowMore: 'Show more',
+    },
+};
+
+const DEFAULT_NAMESPACE = 'Settings.Organization';
+const DEFAULT_VIEW_PERMISSIONS_ROUTE = '/app/settings/permissions';
+const DEFAULT_LEAVE_REDIRECT_ROUTE = '/app/settings/account';
+/**
+ * `val-organization-view` — vista Gestión de organización full-feature
+ * autocontenida (organism). Promovida desde `showcase` bajo el proceso de
+ * ADR-021. Reúne:
+ *  - **Información** — nombre, descripción, plan y tipo de la org activa; editar
+ *    vía modal `val-edit-org-modal` (solo si `canEditOrg()`).
+ *  - **Miembros** — lista paginada (`val-member-card`) enriquecida con perfiles
+ *    públicos (Firestore); ver detalle vía `val-member-detail-modal`.
+ *  - **Roles y permisos** — sección explicativa con CTA a la ruta de permisos.
+ *  - **Invitar** — CTA que abre `val-invite-member-modal` (gateada por `users:*`).
+ *  - **Transferir propiedad** — `val-transfer-ownership-modal` (solo owner).
+ *  - **Salir de la organización** — `OrgService.leaveOrg` con confirmación
+ *    destructiva.
+ *
+ * **RBAC interno** (decisión CTO, ADR-021): el gating fino se resuelve dentro de
+ * la vista vía `AuthService.hasPermission()` + `*valHasPermission` + computeds
+ * `isOwner()`/`canManageMembers()`/`canEditOrg()`. NO se expone como config.
+ *
+ * **Auto-reload en org-switch**: un `effect` reactiona a `activeOrgId()` y recarga
+ * org + miembros cuando el usuario cambia de organización activa mientras la vista
+ * está montada. El effect cubre también la carga inicial (sin doble carga).
+ *
+ * NO renderiza ion-content — vive dentro de val-page-wrapper. `ActivatedRoute` se
+ * inyecta `{ optional: true }` solo para leer el route data de config (no-op
+ * embebido). Auto-registra sus defaults i18n (es/en) si el consumer no proveyó el
+ * namespace (default `Settings.Organization`).
+ */
+class OrganizationViewComponent {
+    /** Namespace i18n resuelto (capturado para llamadas no-reactivas). */
+    get ns() {
+        return this.resolvedConfig().i18nNamespace;
+    }
+    constructor() {
+        this.nav = inject(NavigationService);
+        this.i18n = inject(I18nService);
+        this.auth = inject(AuthService);
+        this.orgService = inject(OrgService);
+        this.toast = inject(ToastService);
+        this.errors = inject(ValtechErrorService);
+        this.modalService = inject(ModalService);
+        this.firestore = inject(Firestore);
+        this.confirmDialog = inject(ConfirmationDialogService);
+        this.route = inject(ActivatedRoute, { optional: true });
+        this.isDebug = isDevMode();
+        this.resolvedConfig = computed(() => {
+            const fromRoute = (this.route?.snapshot.data['organizationConfig'] ?? {});
+            const merged = { ...fromRoute, ...(this.config ?? {}) };
+            return {
+                showInfo: merged.showInfo ?? true,
+                showMembers: merged.showMembers ?? true,
+                showRoles: merged.showRoles ?? true,
+                showInvite: merged.showInvite ?? true,
+                showTransferOwnership: merged.showTransferOwnership ?? true,
+                showLeave: merged.showLeave ?? true,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE,
+                viewPermissionsRoute: merged.viewPermissionsRoute ?? DEFAULT_VIEW_PERMISSIONS_ROUTE,
+                leaveRedirectRoute: merged.leaveRedirectRoute ?? DEFAULT_LEAVE_REDIRECT_ROUTE,
+                onOrgEdited: merged.onOrgEdited,
+                onMemberInvited: merged.onMemberInvited,
+                onOwnershipTransferred: merged.onOwnershipTransferred,
+                onLeftOrg: merged.onLeftOrg,
+            };
+        });
+        this.org = signal(null);
+        this.loading = signal(false);
+        this.leaving = signal(false);
+        this.orgLoadError = signal(null);
+        this.orgErrorState = computed(() => {
+            this.i18n.lang();
+            const err = this.orgLoadError();
+            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.loadOrg(),
+                retrying: this.loading(),
+            });
+        });
+        this.members = signal([]);
+        this.membersLoading = signal(false);
+        this.membersLoadError = signal(null);
+        this.membersNextToken = signal(null);
+        this.loadingMoreMembers = signal(false);
+        this.showAllMembers = signal(false);
+        this.visibleMembers = computed(() => (this.showAllMembers() ? this.members() : this.members().slice(0, 3)));
+        this.transferring = signal(false);
+        this.availableRoles = signal([
+            { id: 'viewer', name: 'viewer' },
+            { id: 'editor', name: 'editor' },
+            { id: 'admin', name: 'admin' },
+        ]);
+        this.activeOrgId = computed(() => {
+            const u = this.auth.user();
+            return u?.activeOrgId ?? u?.activeOrg ?? '';
+        });
+        this.userId = computed(() => this.auth.user()?.userId ?? '');
+        this.isOwner = computed(() => {
+            const o = this.org();
+            const uid = this.userId();
+            return !!o && !!uid && o.ownerId === uid;
+        });
+        this.canEditOrg = computed(() => this.isOwner() || this.auth.hasPermission('org:manage'));
+        this.canManageMembers = computed(() => {
+            if (this.isOwner())
+                return true;
+            const uid = this.userId();
+            const me = this.members().find(m => m.userId === uid);
+            if (!me)
+                return false;
+            return me.roles.some(r => r === 'admin' || r === 'super_admin');
+        });
+        this.pageTitle = computed(() => this.tt('pageTitle'));
+        this.pageDescription = computed(() => this.tt('pageDescription'));
+        this.planLabel = computed(() => {
+            const plan = this.org()?.plan;
+            if (plan === 'pro')
+                return this.tt('planPro');
+            if (plan === 'enterprise')
+                return this.tt('planEnterprise');
+            return this.tt('planFree');
+        });
+        this.editButtonProps = computed(() => ({
+            text: this.tt('editCta'),
+            color: 'primary',
+            fill: 'outline',
+            size: 'small',
+            shape: 'round',
+            type: 'button',
+        }));
+        this.leaveButtonProps = computed(() => ({
+            text: this.tt('leaveCta'),
+            token: 'org-leave',
+            color: 'dark',
+            fill: 'outline',
+            size: 'default',
+            shape: 'round',
+            type: 'button',
+            state: this.isOwner() || this.leaving() ? ComponentStates.DISABLED : ComponentStates.ENABLED,
+        }));
+        this.transferableMembers = computed(() => this.members().filter(m => m.userId !== this.userId()));
+        this.viewPermissionsButtonProps = computed(() => ({
+            text: this.tt('rolesViewPerms'),
+            color: 'primary',
+            fill: 'outline',
+            size: 'default',
+            shape: 'round',
+            type: 'button',
+            token: 'org-view-permissions',
+        }));
+        this.transferButtonProps = computed(() => ({
+            text: this.tt('transferCta'),
+            token: 'org-transfer-submit',
+            color: 'dark',
+            fill: 'outline',
+            size: 'default',
+            shape: 'round',
+            type: 'button',
+            state: this.transferring() ? ComponentStates.DISABLED : ComponentStates.ENABLED,
+        }));
+        this.openInviteButtonProps = computed(() => ({
+            text: this.tt('inviteOpen'),
+            color: 'primary',
+            fill: 'solid',
+            size: 'default',
+            shape: 'round',
+            type: 'button',
+        }));
+        /** Guarda para detectar el primer disparo del effect (evita doble carga). */
+        this.lastLoadedOrgId = null;
+        const ns = this.ns;
+        if (!this.i18n.hasNamespace(ns)) {
+            this.i18n.registerContent(ns, ORGANIZATION_VIEW_I18N);
+        }
+        this.nav.setBackHeader('pageTitle', ns, { withMenu: true });
+        // Auto-reload en org-switch: reacciona a activeOrgId() y recarga org + miembros
+        // cuando el usuario cambia de organización activa mientras la vista está
+        // montada. Cubre también la carga inicial — `lastLoadedOrgId` evita recargar
+        // dos veces el mismo id (p.ej. si el effect re-corre por otra dependencia).
+        // `allowSignalWrites` porque las load fns escriben signals síncronamente
+        // (loading/error/token) — Angular 18 bloquea writes en effect sin el flag.
+        effect(() => {
+            const orgId = this.activeOrgId();
+            if (orgId === this.lastLoadedOrgId)
+                return;
+            this.lastLoadedOrgId = orgId;
+            this.loadOrg();
+            this.loadMembers();
+            this.loadRoles();
+        }, { allowSignalWrites: true });
+        connectPageRefresh(async () => {
+            await Promise.all([this.loadOrg(), this.loadMembers()]);
+        });
+    }
+    onEdit() {
+        void this.modalService.open({
+            component: EditOrgModalComponent,
+            componentProps: {
+                org: this.org(),
+                onSuccess: (updated) => {
+                    this.org.set(updated);
+                    this.resolvedConfig().onOrgEdited?.();
+                },
+            },
+            breakpoints: {
+                breakpoints: [0, 0.85],
+                initialBreakpoint: 0.85,
+                showHandle: true,
+            },
+            backdropDismiss: true,
+        });
+    }
+    async onLeave() {
+        if (this.isOwner() || this.leaving())
+            return;
+        const result = await this.confirmDialog.confirmDestructive({
+            title: this.tt('leaveTitle'),
+            message: this.tt('leaveConfirm'),
+            confirmButton: { text: this.tt('leaveCta') },
+            cancelButton: { text: this.tt('cancelCta') },
+        });
+        if (!result.confirmed)
+            return;
+        const orgId = this.activeOrgId();
+        if (!orgId)
+            return;
+        this.leaving.set(true);
+        try {
+            await firstValueFrom(this.orgService.leaveOrg(orgId));
+            this.toast.show({
+                message: this.tt('leaveSuccess'),
+                color: 'dark',
+                duration: 3500,
+            });
+            const cfg = this.resolvedConfig();
+            this.nav.navigateByUrl(cfg.leaveRedirectRoute);
+            cfg.onLeftOrg?.();
+        }
+        catch (err) {
+            this.errors.handle(err, {
+                context: 'organization.leave',
+                fallbackKey: 'leaveError',
+                i18nNamespace: this.ns,
+            });
+        }
+        finally {
+            this.leaving.set(false);
+        }
+    }
+    onOpenInvite() {
+        void this.modalService.open({
+            component: InviteMemberModalComponent,
+            componentProps: {
+                orgId: this.activeOrgId(),
+                existingMemberIds: this.members().map(m => m.userId),
+                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);
+    }
+    onOpenTransfer() {
+        void this.modalService.open({
+            component: TransferOwnershipModalComponent,
+            componentProps: {
+                members: this.transferableMembers(),
+                onConfirm: (newOwnerId) => void this.onTransfer(newOwnerId),
+            },
+            breakpoints: {
+                breakpoints: [0, 0.75],
+                initialBreakpoint: 0.75,
+                showHandle: true,
+            },
+            backdropDismiss: true,
+        });
+    }
+    async onTransfer(newOwnerId) {
+        if (!newOwnerId || this.transferring())
+            return;
+        const result = await this.confirmDialog.confirmDestructive({
+            title: this.tt('transferTitle'),
+            message: this.tt('transferConfirm'),
+            confirmButton: { text: this.tt('transferCta') },
+            cancelButton: { text: this.tt('cancelCta') },
+        });
+        if (!result.confirmed)
+            return;
+        const orgId = this.activeOrgId();
+        if (!orgId)
+            return;
+        this.transferring.set(true);
+        try {
+            await firstValueFrom(this.orgService.transferOwnership(orgId, newOwnerId));
+            this.toast.show({
+                message: this.tt('transferSuccess'),
+                color: 'dark',
+                duration: 3500,
+            });
+            this.loadOrg();
+            this.loadMembers();
+            this.resolvedConfig().onOwnershipTransferred?.();
+        }
+        catch (err) {
+            this.errors.handle(err, {
+                context: 'organization.transfer',
+                fallbackKey: 'transferError',
+                i18nNamespace: this.ns,
+            });
+        }
+        finally {
+            this.transferring.set(false);
+        }
+    }
+    loadOrg() {
+        const orgId = this.activeOrgId();
+        if (!orgId)
+            return Promise.resolve();
+        this.loading.set(true);
+        this.orgLoadError.set(null);
+        return new Promise(resolve => {
+            this.orgService.getOrg(orgId).subscribe({
+                next: org => {
+                    this.org.set(org);
+                    this.loading.set(false);
+                    resolve();
+                },
+                error: err => {
+                    this.orgLoadError.set(err);
+                    this.loading.set(false);
+                    resolve();
+                },
+            });
+        });
+    }
+    loadMembers() {
+        const orgId = this.activeOrgId();
+        if (!orgId)
+            return Promise.resolve();
+        this.membersLoading.set(true);
+        this.membersNextToken.set(null);
+        this.showAllMembers.set(false);
+        return new Promise(resolve => {
+            this.orgService.getOrgMembers(orgId, { limit: 20 }).subscribe({
+                next: async (res) => {
+                    const cards = await this.enrichWithProfiles(res.members);
+                    this.members.set(cards);
+                    this.membersNextToken.set(res.nextToken ?? null);
+                    this.membersLoading.set(false);
+                    resolve();
+                },
+                error: err => {
+                    this.membersLoadError.set(err);
+                    this.membersLoading.set(false);
+                    resolve();
+                },
+            });
+        });
+    }
+    loadMoreMembers() {
+        const orgId = this.activeOrgId();
+        const token = this.membersNextToken();
+        if (!orgId || !token || this.loadingMoreMembers())
+            return;
+        this.loadingMoreMembers.set(true);
+        this.orgService.getOrgMembers(orgId, { limit: 20, nextToken: token }).subscribe({
+            next: async (res) => {
+                const cards = await this.enrichWithProfiles(res.members);
+                this.members.update(prev => [...prev, ...cards]);
+                this.membersNextToken.set(res.nextToken ?? null);
+                this.loadingMoreMembers.set(false);
+            },
+            error: err => {
+                this.errors.handle(err, {
+                    context: 'organization.loadMoreMembers',
+                    fallbackKey: 'membersError',
+                    i18nNamespace: this.ns,
+                });
+                this.loadingMoreMembers.set(false);
+            },
+        });
+    }
+    async enrichWithProfiles(members) {
+        const results = await Promise.allSettled(members.map(async (m) => {
+            try {
+                const snap = await getDoc(doc(this.firestore, `profiles/${m.userId}`));
+                const p = snap.exists() ? snap.data() : {};
+                return {
+                    ...m,
+                    handle: p['handle'],
+                    avatar: (p['avatarUrl'] ?? p['avatar']),
+                    name: p['name'] || m.name,
+                };
+            }
+            catch {
+                return m;
+            }
+        }));
+        return results.map(r => (r.status === 'fulfilled' ? r.value : {}));
+    }
+    loadRoles() {
+        const orgId = this.activeOrgId();
+        if (!orgId)
+            return;
+        this.orgService.listOrgRoles(orgId).subscribe({
+            next: roles => {
+                if (roles.length)
+                    this.availableRoles.set(roles);
+            },
+        });
+    }
+    roleLabel(roleIdOrName) {
+        // Try to find by id first (UUID), then by name
+        const found = this.availableRoles().find(r => r.id === roleIdOrName || r.name === roleIdOrName);
+        const name = found?.name ?? roleIdOrName;
+        const keyMap = {
+            viewer: 'roleViewer',
+            editor: 'roleEditor',
+            admin: 'roleAdmin',
+            super_admin: 'roleSuperAdmin',
+        };
+        const key = keyMap[name] ?? name;
+        const label = this.tt(key);
+        return label && !label.startsWith('[') ? label : name;
+    }
+    permissionLabel(perm) {
+        if (perm === '*:*')
+            return this.tt('permAll');
+        const [resource, action] = perm.split(':');
+        const resKey = {
+            users: 'permUsers',
+            documents: 'permDocuments',
+            roles: 'permRoles',
+            media: 'permMedia',
+            templates: 'permTemplates',
+            '*': 'permAll',
+        };
+        const actKey = {
+            read: 'permRead',
+            write: 'permWrite',
+            create: 'permCreate',
+            delete: 'permDelete',
+            manage: 'permManage',
+            '*': 'permAll',
+        };
+        const res = this.tt(resKey[resource] ?? resource);
+        const act = this.tt(actKey[action] ?? action);
+        return `${res}: ${act}`;
+    }
+    onViewMember(member) {
+        void this.modalService.open({
+            component: MemberDetailModalComponent,
+            componentProps: {
+                member,
+                orgId: this.activeOrgId(),
+                availableRoles: this.availableRoles(),
+                canManage: this.canManageMembers() && member.userId !== this.userId(),
+                isSelf: member.userId === this.userId(),
+                onChanged: () => this.loadMembers(),
+            },
+            breakpoints: {
+                breakpoints: [0, 0.7],
+                initialBreakpoint: 0.7,
+                showHandle: true,
+            },
+            backdropDismiss: true,
+        });
+    }
+    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: OrganizationViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: OrganizationViewComponent, isStandalone: true, selector: "val-organization-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 (resolvedConfig().showInfo) {
+        <!-- Org Info -->
+        <section class="settings-section">
+          <div class="section-header-row">
+            <val-title
+              [props]="{
+                size: 'medium',
+                color: 'dark',
+                bold: true,
+                content: tt('infoTitle'),
+              }"
+            />
+            @if (canEditOrg()) {
+              <val-button [props]="editButtonProps()" (click)="onEdit()" />
+            }
+          </div>
+
+          <div class="section-body">
+            @if (loading()) {
+              <val-skeleton-layout [props]="{ preset: 'detail', rows: 4 }" />
+            } @else if (orgErrorState()) {
+              <val-empty-state [props]="orgErrorState()!" />
+            } @else {
+              @if (org(); as o) {
+                <div class="org-info-card">
+                  <div class="org-info-field org-info-field--full">
+                    <span class="org-info-label">{{ tt('infoName') }}</span>
+                    <span class="org-info-value">{{ o.name }}</span>
+                  </div>
+                  <div class="org-info-field org-info-field--full">
+                    <span class="org-info-label">{{ tt('infoDescription') }}</span>
+                    <span class="org-info-value org-info-value--muted">{{ o.description || '—' }}</span>
+                  </div>
+                  <div class="org-info-row">
+                    <div class="org-info-field">
+                      <span class="org-info-label">{{ tt('infoPlan') }}</span>
+                      <span class="plan-badge plan-badge--{{ o.plan }}">{{ planLabel() }}</span>
+                    </div>
+                    <div class="org-info-field">
+                      <span class="org-info-label">{{ tt('infoType') }}</span>
+                      <span class="org-info-value">{{ o.type }}</span>
+                    </div>
+                  </div>
+                </div>
+              }
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showMembers) {
+        <!-- Members -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('membersTitle'),
+            }"
+          />
+          <div class="section-body">
+            @if (membersLoading()) {
+              <val-skeleton-layout [props]="{ preset: 'list', rows: 3 }" />
+            } @else if (members().length === 0) {
+              <val-text
+                [props]="{
+                  content: tt('membersEmpty'),
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                }"
+              />
+            } @else {
+              <div class="members-list">
+                @for (m of visibleMembers(); track m.userId) {
+                  <val-member-card
+                    [attr.data-testid]="'org-member-' + m.userId"
+                    [props]="{
+                      id: m.userId,
+                      name: m.name,
+                      handle: m.handle,
+                      email: m.email,
+                      avatarUrl: m.avatar,
+                      roleLabel: m.roles[0] ? roleLabel(m.roles[0]) : '',
+                      actionAriaLabel: tt('viewMemberCta'),
+                    }"
+                    (onAction)="onViewMember(m)"
+                  />
+                }
+              </div>
+              @if (!showAllMembers() && members().length > 3) {
+                <button class="members-show-more" (click)="showAllMembers.set(true)">
+                  {{ tt('membersShowMore') }} ({{ members().length - 3 }})
+                </button>
+              }
+              @if (showAllMembers() && membersNextToken()) {
+                <button class="members-show-more" [disabled]="loadingMoreMembers()" (click)="loadMoreMembers()">
+                  {{ loadingMoreMembers() ? '…' : tt('membersShowMore') }}
+                </button>
+              }
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showRoles) {
+        <!-- Roles y permisos: seccion explicativa, detalle en la ruta de permisos -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('rolesSectionTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: tt('rolesHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            <div class="row-actions">
+              <val-button [props]="viewPermissionsButtonProps()" (click)="onViewPermissions()" />
+            </div>
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showInvite) {
+        <!-- Invite: solo admin+ (gating RBAC interno) -->
+        <section *valHasPermission="'users:*'" class="settings-section" data-testid="org-invite-section">
+          <div class="invite-cta">
+            <div class="invite-cta__text">
+              <val-title
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: true,
+                  content: tt('inviteCtaTitle'),
+                }"
+              />
+              <val-text
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                  content: tt('inviteCtaHint'),
+                }"
+              />
+            </div>
+            <val-button [props]="openInviteButtonProps()" (click)="onOpenInvite()" />
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showTransferOwnership && isOwner()) {
+        <!-- Transfer ownership: solo owner (gating RBAC interno) -->
+        <section class="settings-section" data-testid="org-transfer-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('transferTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: tt('transferHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            @if (transferableMembers().length > 0) {
+              <div class="row-actions">
+                <val-button [props]="transferButtonProps()" (click)="onOpenTransfer()" />
+              </div>
+            } @else {
+              <val-text
+                [props]="{
+                  content: tt('membersEmpty'),
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                }"
+              />
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showLeave) {
+        <!-- Leave org -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('leaveTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: isOwner() ? tt('leaveOwnerHint') : tt('leaveHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            <div class="row-actions">
+              <val-button [props]="leaveButtonProps()" (click)="onLeave()" />
+            </div>
+          </div>
+        </section>
+      }
+
+      @if (isDebug) {
+        <section class="settings-section rbac-debug">
+          <div class="section-header-row">
+            <val-title
+              [props]="{
+                content: 'RBAC (live)',
+                size: 'small',
+                color: 'medium',
+                bold: false,
+              }"
+            />
+          </div>
+          <div class="rbac-debug__body">
+            <div class="rbac-debug__row">
+              <span class="rbac-debug__label">Roles</span>
+              <span class="rbac-debug__value">{{ auth.roles().join(', ') || '—' }}</span>
+            </div>
+            <div class="rbac-debug__row">
+              <span class="rbac-debug__label">Permisos</span>
+              <span class="rbac-debug__value rbac-debug__value--perms">{{ auth.permissions().join(', ') || '—' }}</span>
+            </div>
+          </div>
+        </section>
+      }
+    </div>
+  `, isInline: true, styles: [".page{padding:16px 0;max-width:720px;margin:0 auto}.page-header{margin-bottom:16px}.settings-section{padding:16px 0}.settings-section+.settings-section{border-top:1px solid var(--val-border-color, rgba(0, 0, 0, .08))}.section-header-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.section-body{display:flex;flex-direction:column;gap:10px}.row-actions{margin-top:12px}.row-actions--gap{display:flex;gap:8px}.invite-cta{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}.invite-cta__text{display:flex;flex-direction:column;gap:4px;flex:1}.org-info-card{border-radius:14px;background:var(--ion-color-light, #f4f5f8);overflow:hidden}:host-context(body.dark) .org-info-card,:host-context(html.ion-palette-dark) .org-info-card,:host-context([data-theme=\"dark\"]) .org-info-card{background:#ffffff0d}.org-info-field{padding:12px 16px;display:flex;flex-direction:column;gap:4px;border-bottom:1px solid var(--val-border-color, rgba(0, 0, 0, .06))}.org-info-field--full{width:100%}.org-info-field:last-child{border-bottom:none}.org-info-row{display:flex}.org-info-row .org-info-field{flex:1}.org-info-row .org-info-field:first-child{border-right:1px solid var(--val-border-color, rgba(0, 0, 0, .06))}.org-info-label{font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.org-info-value{font-size:.95rem;font-weight:500;color:var(--ion-color-dark)}.org-info-value--muted{color:var(--ion-color-medium);font-weight:400}.plan-badge{display:inline-block;font-size:.78rem;font-weight:700;padding:3px 10px;border-radius:20px;width:fit-content}.plan-badge--free{background:var(--ion-color-light-shade, #d7d8da);color:var(--ion-color-dark)}.plan-badge--pro{background:var(--ion-color-primary);color:#fff}.plan-badge--enterprise{background:#f5c542;color:#222}.members-list{display:flex;flex-direction:column;gap:8px}.members-show-more{background:none;border:none;color:var(--ion-color-primary);font-size:14px;font-weight:500;cursor:pointer;padding:8px 0}.rbac-debug{opacity:.7}.rbac-debug__body{display:flex;flex-direction:column;gap:6px;font-family:monospace;font-size:.78rem}.rbac-debug__row{display:flex;gap:8px;align-items:flex-start}.rbac-debug__label{color:var(--ion-color-medium);min-width:72px;flex-shrink:0}.rbac-debug__value{color:var(--ion-color-dark);word-break:break-all}.rbac-debug__value--perms{color:var(--ion-color-medium)}\n"], dependencies: [{ kind: "component", type: DisplayComponent, selector: "val-display", inputs: ["props"] }, { kind: "component", type: EmptyStateComponent, selector: "val-empty-state", inputs: ["props"] }, { kind: "directive", type: HasPermissionDirective, selector: "[valHasPermission]", inputs: ["valHasPermission"] }, { kind: "component", type: SkeletonLayoutComponent, selector: "val-skeleton-layout", inputs: ["props"] }, { 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"] }, { kind: "component", type: MemberCardComponent, selector: "val-member-card", inputs: ["props"], outputs: ["onAction"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: OrganizationViewComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'val-organization-view', standalone: true, imports: [
+                        DisplayComponent,
+                        EmptyStateComponent,
+                        HasPermissionDirective,
+                        SkeletonLayoutComponent,
+                        TitleComponent,
+                        TextComponent,
+                        ButtonComponent,
+                        MemberCardComponent,
+                        TransferOwnershipModalComponent,
+                    ], 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 (resolvedConfig().showInfo) {
+        <!-- Org Info -->
+        <section class="settings-section">
+          <div class="section-header-row">
+            <val-title
+              [props]="{
+                size: 'medium',
+                color: 'dark',
+                bold: true,
+                content: tt('infoTitle'),
+              }"
+            />
+            @if (canEditOrg()) {
+              <val-button [props]="editButtonProps()" (click)="onEdit()" />
+            }
+          </div>
+
+          <div class="section-body">
+            @if (loading()) {
+              <val-skeleton-layout [props]="{ preset: 'detail', rows: 4 }" />
+            } @else if (orgErrorState()) {
+              <val-empty-state [props]="orgErrorState()!" />
+            } @else {
+              @if (org(); as o) {
+                <div class="org-info-card">
+                  <div class="org-info-field org-info-field--full">
+                    <span class="org-info-label">{{ tt('infoName') }}</span>
+                    <span class="org-info-value">{{ o.name }}</span>
+                  </div>
+                  <div class="org-info-field org-info-field--full">
+                    <span class="org-info-label">{{ tt('infoDescription') }}</span>
+                    <span class="org-info-value org-info-value--muted">{{ o.description || '—' }}</span>
+                  </div>
+                  <div class="org-info-row">
+                    <div class="org-info-field">
+                      <span class="org-info-label">{{ tt('infoPlan') }}</span>
+                      <span class="plan-badge plan-badge--{{ o.plan }}">{{ planLabel() }}</span>
+                    </div>
+                    <div class="org-info-field">
+                      <span class="org-info-label">{{ tt('infoType') }}</span>
+                      <span class="org-info-value">{{ o.type }}</span>
+                    </div>
+                  </div>
+                </div>
+              }
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showMembers) {
+        <!-- Members -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('membersTitle'),
+            }"
+          />
+          <div class="section-body">
+            @if (membersLoading()) {
+              <val-skeleton-layout [props]="{ preset: 'list', rows: 3 }" />
+            } @else if (members().length === 0) {
+              <val-text
+                [props]="{
+                  content: tt('membersEmpty'),
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                }"
+              />
+            } @else {
+              <div class="members-list">
+                @for (m of visibleMembers(); track m.userId) {
+                  <val-member-card
+                    [attr.data-testid]="'org-member-' + m.userId"
+                    [props]="{
+                      id: m.userId,
+                      name: m.name,
+                      handle: m.handle,
+                      email: m.email,
+                      avatarUrl: m.avatar,
+                      roleLabel: m.roles[0] ? roleLabel(m.roles[0]) : '',
+                      actionAriaLabel: tt('viewMemberCta'),
+                    }"
+                    (onAction)="onViewMember(m)"
+                  />
+                }
+              </div>
+              @if (!showAllMembers() && members().length > 3) {
+                <button class="members-show-more" (click)="showAllMembers.set(true)">
+                  {{ tt('membersShowMore') }} ({{ members().length - 3 }})
+                </button>
+              }
+              @if (showAllMembers() && membersNextToken()) {
+                <button class="members-show-more" [disabled]="loadingMoreMembers()" (click)="loadMoreMembers()">
+                  {{ loadingMoreMembers() ? '…' : tt('membersShowMore') }}
+                </button>
+              }
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showRoles) {
+        <!-- Roles y permisos: seccion explicativa, detalle en la ruta de permisos -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('rolesSectionTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: tt('rolesHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            <div class="row-actions">
+              <val-button [props]="viewPermissionsButtonProps()" (click)="onViewPermissions()" />
+            </div>
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showInvite) {
+        <!-- Invite: solo admin+ (gating RBAC interno) -->
+        <section *valHasPermission="'users:*'" class="settings-section" data-testid="org-invite-section">
+          <div class="invite-cta">
+            <div class="invite-cta__text">
+              <val-title
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: true,
+                  content: tt('inviteCtaTitle'),
+                }"
+              />
+              <val-text
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                  content: tt('inviteCtaHint'),
+                }"
+              />
+            </div>
+            <val-button [props]="openInviteButtonProps()" (click)="onOpenInvite()" />
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showTransferOwnership && isOwner()) {
+        <!-- Transfer ownership: solo owner (gating RBAC interno) -->
+        <section class="settings-section" data-testid="org-transfer-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('transferTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: tt('transferHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            @if (transferableMembers().length > 0) {
+              <div class="row-actions">
+                <val-button [props]="transferButtonProps()" (click)="onOpenTransfer()" />
+              </div>
+            } @else {
+              <val-text
+                [props]="{
+                  content: tt('membersEmpty'),
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                }"
+              />
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showLeave) {
+        <!-- Leave org -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('leaveTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: isOwner() ? tt('leaveOwnerHint') : tt('leaveHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            <div class="row-actions">
+              <val-button [props]="leaveButtonProps()" (click)="onLeave()" />
+            </div>
+          </div>
+        </section>
+      }
+
+      @if (isDebug) {
+        <section class="settings-section rbac-debug">
+          <div class="section-header-row">
+            <val-title
+              [props]="{
+                content: 'RBAC (live)',
+                size: 'small',
+                color: 'medium',
+                bold: false,
+              }"
+            />
+          </div>
+          <div class="rbac-debug__body">
+            <div class="rbac-debug__row">
+              <span class="rbac-debug__label">Roles</span>
+              <span class="rbac-debug__value">{{ auth.roles().join(', ') || '—' }}</span>
+            </div>
+            <div class="rbac-debug__row">
+              <span class="rbac-debug__label">Permisos</span>
+              <span class="rbac-debug__value rbac-debug__value--perms">{{ auth.permissions().join(', ') || '—' }}</span>
+            </div>
+          </div>
+        </section>
+      }
+    </div>
+  `, styles: [".page{padding:16px 0;max-width:720px;margin:0 auto}.page-header{margin-bottom:16px}.settings-section{padding:16px 0}.settings-section+.settings-section{border-top:1px solid var(--val-border-color, rgba(0, 0, 0, .08))}.section-header-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.section-body{display:flex;flex-direction:column;gap:10px}.row-actions{margin-top:12px}.row-actions--gap{display:flex;gap:8px}.invite-cta{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}.invite-cta__text{display:flex;flex-direction:column;gap:4px;flex:1}.org-info-card{border-radius:14px;background:var(--ion-color-light, #f4f5f8);overflow:hidden}:host-context(body.dark) .org-info-card,:host-context(html.ion-palette-dark) .org-info-card,:host-context([data-theme=\"dark\"]) .org-info-card{background:#ffffff0d}.org-info-field{padding:12px 16px;display:flex;flex-direction:column;gap:4px;border-bottom:1px solid var(--val-border-color, rgba(0, 0, 0, .06))}.org-info-field--full{width:100%}.org-info-field:last-child{border-bottom:none}.org-info-row{display:flex}.org-info-row .org-info-field{flex:1}.org-info-row .org-info-field:first-child{border-right:1px solid var(--val-border-color, rgba(0, 0, 0, .06))}.org-info-label{font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.org-info-value{font-size:.95rem;font-weight:500;color:var(--ion-color-dark)}.org-info-value--muted{color:var(--ion-color-medium);font-weight:400}.plan-badge{display:inline-block;font-size:.78rem;font-weight:700;padding:3px 10px;border-radius:20px;width:fit-content}.plan-badge--free{background:var(--ion-color-light-shade, #d7d8da);color:var(--ion-color-dark)}.plan-badge--pro{background:var(--ion-color-primary);color:#fff}.plan-badge--enterprise{background:#f5c542;color:#222}.members-list{display:flex;flex-direction:column;gap:8px}.members-show-more{background:none;border:none;color:var(--ion-color-primary);font-size:14px;font-weight:500;cursor:pointer;padding:8px 0}.rbac-debug{opacity:.7}.rbac-debug__body{display:flex;flex-direction:column;gap:6px;font-family:monospace;font-size:.78rem}.rbac-debug__row{display:flex;gap:8px;align-items:flex-start}.rbac-debug__label{color:var(--ion-color-medium);min-width:72px;flex-shrink:0}.rbac-debug__value{color:var(--ion-color-dark);word-break:break-all}.rbac-debug__value--perms{color:var(--ion-color-medium)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { config: [{
+                type: Input
+            }] } });
+
+/**
+ * Helper para montar la vista Gestión de organización (`val-organization-view`)
+ * como ruta en una app del factory. El `config` se pasa por route `data`
+ * (`organizationConfig`) y el componente lo lee como fallback de su
+ * `@Input() config`.
+ *
+ * @example
+ * ```ts
+ * // settings.routes.ts
+ * export const settingsRoutes: Routes = [
+ *   ...provideValtechOrganizationRoutes(),                 // → /app/settings/organization
+ *   { path: 'preferences', loadComponent: () => ... },
+ * ];
+ *
+ * // con config acotada:
+ * ...provideValtechOrganizationRoutes({ config: { showLeave: false } }),
+ * ...provideValtechOrganizationRoutes({ config: { viewPermissionsRoute: '/app/roles' } }),
+ * ```
+ */
+function provideValtechOrganizationRoutes(opts) {
+    return [
+        {
+            path: opts?.path ?? 'organization',
+            component: OrganizationViewComponent,
+            data: { organizationConfig: opts?.config },
+        },
+    ];
+}
+
 /** Built-in label sets for the three platform locales. */
 const CALLOUT_LABELS = {
     es: {
@@ -57698,5 +60423,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, 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, 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, MenuComponent, MessagingService, MetaService, MetricCardComponent, MfaModalComponent, ModalService, ModalShellComponent, MultiSelectSearchComponent, NUM_KEYS, NavigationService, NetworkBannerComponent, NetworkStatusService, NewsBuilder, NoContentComponent, NotesBoxComponent, NotificationActionService, NotificationsService, NumberFromToComponent, NumberInputComponent, NumberStepperComponent, OAUTH_PROVIDERS_INFO, OAuthCallbackComponent, OAuthService, OrgInfoSheetComponent, OrgService, OrgSwitchService, 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, 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, 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, NotificationsService, 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, provideValtechOrganizationRoutes, 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