valtech-components 2.0.987 → 2.0.989

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.987';
+const VERSION = '2.0.989';
 
 // Control de estado de refresco (singleton a nivel de módulo)
 let isRefreshing = false;
@@ -41737,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$b = 'Settings.Profile';
 /**
  * `val-profile-view` — vista Perfil full-feature autocontenida (organism).
  *
@@ -41787,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$b,
                 onSaved: merged.onSaved,
                 onAvatarUploaded: merged.onAvatarUploaded,
             };
@@ -42703,7 +42703,7 @@ const PREFERENCES_VIEW_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$6 = 'Settings.General';
+const DEFAULT_NAMESPACE$a = 'Settings.General';
 const DEFAULT_LANGUAGES = ['es', 'en'];
 /**
  * `val-preferences-view` — vista de preferencias de UI cross-app (tema +
@@ -42740,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$a,
                 onThemeChanged: merged.onThemeChanged,
                 onLanguageChanged: merged.onLanguageChanged,
                 onFontSizeChanged: merged.onFontSizeChanged,
@@ -44552,7 +44552,7 @@ const SECURITY_VIEW_I18N = {
 };
 
 addIcons({ laptopOutline, phonePortraitOutline });
-const DEFAULT_NAMESPACE$5 = 'Settings.Security';
+const DEFAULT_NAMESPACE$9 = 'Settings.Security';
 /**
  * `val-security-view` — vista Seguridad full-feature autocontenida (organism).
  *
@@ -44601,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$9,
                 handleDeepLinks: merged.handleDeepLinks ?? true,
                 homeRoute: merged.homeRoute ?? '/app/home',
                 onMfaCompleted: merged.onMfaCompleted,
@@ -45507,7 +45507,7 @@ const CREATE_ORG_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$4 = 'CreateOrgModal';
+const DEFAULT_NAMESPACE$8 = '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
@@ -45533,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$8;
         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$8)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$8, CREATE_ORG_MODAL_I18N);
         }
         this.formMeta = signal(this.buildFormMeta());
         effect(() => {
@@ -45772,7 +45772,7 @@ const DELETE_ACCOUNT_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$3 = 'Settings.DeleteAccount';
+const DEFAULT_NAMESPACE$7 = '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.
@@ -45798,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$7;
         this.hasPassword = signal(null);
         this.codeSent = signal(false);
         this.formState = signal(ComponentStates.ENABLED);
@@ -45865,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$7)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$7, DELETE_ACCOUNT_MODAL_I18N);
         }
     }
     ngOnInit() {
@@ -46067,7 +46067,7 @@ const ORG_INFO_SHEET_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$2 = 'OrgInfoSheet';
+const DEFAULT_NAMESPACE$6 = 'OrgInfoSheet';
 /**
  * `val-org-info-sheet` — sheet informativo "¿Qué son las organizaciones?".
  * Extraído del `OrgInfoSheetComponent` inline de `AccountPage` bajo el proceso de
@@ -46112,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$6)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$6, 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$6);
     }
     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: `
@@ -46287,7 +46287,7 @@ const SWITCH_ORG_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$1 = 'Settings.SwitchOrg';
+const DEFAULT_NAMESPACE$5 = 'Settings.SwitchOrg';
 addIcons({ businessOutline, checkmarkCircleOutline });
 /**
  * `val-switch-org-modal` — modal de cambio de organización activa (organism
@@ -46313,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$5;
         this.orgs = signal([]);
         this.loading = signal(false);
         this.query = signal('');
@@ -46329,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$5)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$5, SWITCH_ORG_MODAL_I18N);
         }
         this.loadOrgs();
     }
@@ -46648,7 +46648,7 @@ const ACCOUNT_VIEW_I18N = {
 };
 
 addIcons({ peopleOutline, businessOutline, chevronForwardOutline, swapHorizontalOutline, mailOutline });
-const DEFAULT_NAMESPACE = 'Settings.Account';
+const DEFAULT_NAMESPACE$4 = 'Settings.Account';
 const DEFAULT_MANAGE_ORG_ROUTE = '/app/settings/organization';
 /**
  * `val-account-view` — vista Cuenta full-feature autocontenida (organism).
@@ -46689,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$4,
                 manageOrgRoute: merged.manageOrgRoute ?? DEFAULT_MANAGE_ORG_ROUTE,
                 onOrgSwitched: merged.onOrgSwitched,
                 onOrgCreated: merged.onOrgCreated,
@@ -47376,6 +47376,1517 @@ function provideValtechAccountRoutes(opts) {
     ];
 }
 
+/**
+ * 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-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$1 = '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$1;
+        this.saving = signal(false);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$1)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$1, 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-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 = '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;
+        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)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE, 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
+            }] } });
+
 /** Built-in label sets for the three platform locales. */
 const CALLOUT_LABELS = {
     es: {
@@ -57700,5 +59211,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, 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, 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