valtech-components 2.0.989 → 2.0.990

package/fesm2022/valtech-components.mjs

@@ -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.989';
+const VERSION = '2.0.990';
 
 // 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$b = 'Settings.Profile';
+const DEFAULT_NAMESPACE$c = '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$b,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$c,
                 onSaved: merged.onSaved,
                 onAvatarUploaded: merged.onAvatarUploaded,
             };
@@ -42703,7 +42703,7 @@ const PREFERENCES_VIEW_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$a = 'Settings.General';
+const DEFAULT_NAMESPACE$b = '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$a,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$b,
                 onThemeChanged: merged.onThemeChanged,
                 onLanguageChanged: merged.onLanguageChanged,
                 onFontSizeChanged: merged.onFontSizeChanged,
@@ -44552,7 +44552,7 @@ const SECURITY_VIEW_I18N = {
 };
 
 addIcons({ laptopOutline, phonePortraitOutline });
-const DEFAULT_NAMESPACE$9 = 'Settings.Security';
+const DEFAULT_NAMESPACE$a = '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$9,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$a,
                 handleDeepLinks: merged.handleDeepLinks ?? true,
                 homeRoute: merged.homeRoute ?? '/app/home',
                 onMfaCompleted: merged.onMfaCompleted,
@@ -45507,7 +45507,7 @@ const CREATE_ORG_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$8 = 'CreateOrgModal';
+const DEFAULT_NAMESPACE$9 = 'CreateOrgModal';
 /**
  * `val-create-org-modal` — modal de creación de organización (organism
  * compartido). Promovido desde `showcase` bajo el proceso de ADR-021. Reusado por
@@ -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$8;
+        this.i18nNamespace = DEFAULT_NAMESPACE$9;
         this._busy = signal(false);
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$8)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$8, CREATE_ORG_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$9)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$9, CREATE_ORG_MODAL_I18N);
         }
         this.formMeta = signal(this.buildFormMeta());
         effect(() => {
@@ -45772,7 +45772,7 @@ const DELETE_ACCOUNT_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$7 = 'Settings.DeleteAccount';
+const DEFAULT_NAMESPACE$8 = 'Settings.DeleteAccount';
 /**
  * `val-delete-account-modal` — modal de eliminación de cuenta (organism,
  * cuenta-específico). Promovido desde `showcase` bajo el proceso de ADR-021.
@@ -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$7;
+        this.i18nNamespace = DEFAULT_NAMESPACE$8;
         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$7)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$7, DELETE_ACCOUNT_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$8)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$8, DELETE_ACCOUNT_MODAL_I18N);
         }
     }
     ngOnInit() {
@@ -46067,7 +46067,7 @@ const ORG_INFO_SHEET_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$6 = 'OrgInfoSheet';
+const DEFAULT_NAMESPACE$7 = 'OrgInfoSheet';
 /**
  * `val-org-info-sheet` — sheet informativo "¿Qué son las organizaciones?".
  * Extraído del `OrgInfoSheetComponent` inline de `AccountPage` bajo el proceso de
@@ -46112,15 +46112,15 @@ class OrgInfoSheetComponent {
             text: this.closeProps.text || this.resolvedCloseLabel(),
         }));
         addIcons({ peopleOutline, swapHorizontalOutline, mailOutline });
-        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$6)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$6, ORG_INFO_SHEET_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$7)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$7, ORG_INFO_SHEET_I18N);
         }
     }
     dismiss() {
         this._modalRef?.dismiss(null, 'cancel');
     }
     tt(key) {
-        return this.i18n.t(key, DEFAULT_NAMESPACE$6);
+        return this.i18n.t(key, DEFAULT_NAMESPACE$7);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: OrgInfoSheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: OrgInfoSheetComponent, isStandalone: true, selector: "val-org-info-sheet", inputs: { title: "title", subtitle: "subtitle", body: "body", closeLabel: "closeLabel", closeProps: "closeProps", _modalRef: "_modalRef" }, ngImport: i0, template: `
@@ -46287,7 +46287,7 @@ const SWITCH_ORG_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE$5 = 'Settings.SwitchOrg';
+const DEFAULT_NAMESPACE$6 = '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$5;
+        this.i18nNamespace = DEFAULT_NAMESPACE$6;
         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$5)) {
-            this.i18n.registerContent(DEFAULT_NAMESPACE$5, SWITCH_ORG_MODAL_I18N);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$6)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$6, SWITCH_ORG_MODAL_I18N);
         }
         this.loadOrgs();
     }
@@ -46648,7 +46648,7 @@ const ACCOUNT_VIEW_I18N = {
 };
 
 addIcons({ peopleOutline, businessOutline, chevronForwardOutline, swapHorizontalOutline, mailOutline });
-const DEFAULT_NAMESPACE$4 = 'Settings.Account';
+const DEFAULT_NAMESPACE$5 = 'Settings.Account';
 const DEFAULT_MANAGE_ORG_ROUTE = '/app/settings/organization';
 /**
  * `val-account-view` — vista Cuenta full-feature autocontenida (organism).
@@ -46689,7 +46689,7 @@ class AccountViewComponent {
                 showNewOrgCta: merged.showNewOrgCta ?? true,
                 showLogout: merged.showLogout ?? true,
                 showDeleteAccount: merged.showDeleteAccount ?? true,
-                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$4,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE$5,
                 manageOrgRoute: merged.manageOrgRoute ?? DEFAULT_MANAGE_ORG_ROUTE,
                 onOrgSwitched: merged.onOrgSwitched,
                 onOrgCreated: merged.onOrgCreated,
@@ -47376,6 +47376,258 @@ function provideValtechAccountRoutes(opts) {
     ];
 }
 
+/**
+ * Defaults i18n (es/en) embebidos en `val-edit-org-modal`. Auto-registrados en
+ * el constructor del componente si el consumer no proveyó el namespace
+ * (`EditOrgModal` por default). SOLO incluye las keys que el modal usa.
+ */
+const EDIT_ORG_MODAL_I18N = {
+    es: {
+        title: 'Editar organización',
+        subtitle: 'Actualiza el nombre y descripción.',
+        nameLabel: 'Nombre',
+        namePlaceholder: 'Nombre de la organización',
+        nameRequired: 'El nombre es obligatorio.',
+        nameMin: 'Mínimo 2 caracteres.',
+        descriptionLabel: 'Descripción (opcional)',
+        descriptionPlaceholder: 'Describe tu organización',
+        saveCta: 'Guardar cambios',
+        close: 'Cancelar',
+        saveSuccess: 'Organización actualizada.',
+        saveError: 'No se pudo guardar. Intenta de nuevo.',
+        fillRequired: 'Completa todos los campos requeridos.',
+    },
+    en: {
+        title: 'Edit organization',
+        subtitle: 'Update the name and description.',
+        nameLabel: 'Name',
+        namePlaceholder: 'Organization name',
+        nameRequired: 'Name is required.',
+        nameMin: 'Minimum 2 characters.',
+        descriptionLabel: 'Description (optional)',
+        descriptionPlaceholder: 'Describe your organization',
+        saveCta: 'Save changes',
+        close: 'Cancel',
+        saveSuccess: 'Organization updated.',
+        saveError: 'Could not save. Please try again.',
+        fillRequired: 'Please fill in all required fields.',
+    },
+};
+
+const DEFAULT_NAMESPACE$4 = 'EditOrgModal';
+/**
+ * `val-edit-org-modal` — modal de edición de organización (nombre + descripción).
+ * Promovido desde `showcase` bajo el proceso de ADR-021. Reusado por la vista de
+ * gestión de organización (y futuras vistas org-aware).
+ *
+ * Edita la org vía `OrgService.updateOrg`. El formulario se construye una vez y se
+ * mantiene reactivo a idioma + estado de trabajo vía effects `allowSignalWrites`.
+ * Si el consumer no pasa `org`, cae al `activeOrgId` del `AuthService`.
+ *
+ * Abierto vía `ModalService` — recibe `_modalRef` por `componentProps` + callback
+ * `onSuccess(updated)`. Header canónico (Regla #5): sin `ion-title`, botón Cerrar
+ * texto en `slot=end`, título/subtítulo en el body con `val-display`/`val-title`.
+ *
+ * Auto-registra sus defaults i18n (es/en) si el consumer no proveyó el namespace
+ * `EditOrgModal`.
+ */
+class EditOrgModalComponent {
+    constructor() {
+        this.i18n = inject(I18nService);
+        this.orgService = inject(OrgService);
+        this.toast = inject(ToastService);
+        this.errors = inject(ValtechErrorService);
+        this.auth = inject(AuthService);
+        /** Organización a editar (pasada por `componentProps`). */
+        this.org = null;
+        /** Namespace i18n con que la vista resuelve sus textos. */
+        this.i18nNamespace = DEFAULT_NAMESPACE$4;
+        this.saving = signal(false);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$4)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$4, EDIT_ORG_MODAL_I18N);
+        }
+        this.formMeta = signal(this.buildFormMeta());
+        effect(() => {
+            this.i18n.lang();
+            this.formMeta.set(this.buildFormMeta());
+        }, { allowSignalWrites: true });
+        effect(() => {
+            const w = this.saving();
+            this.formMeta.update(m => ({
+                ...m,
+                state: w ? ComponentStates.WORKING : ComponentStates.ENABLED,
+                actions: {
+                    ...m.actions,
+                    state: w ? ComponentStates.WORKING : ComponentStates.ENABLED,
+                },
+            }));
+        }, { allowSignalWrites: true });
+    }
+    ngOnInit() {
+        this.formMeta.set(this.buildFormMeta());
+    }
+    get activeOrgId() {
+        const u = this.auth.user();
+        return u?.activeOrgId ?? u?.activeOrg ?? '';
+    }
+    buildFormMeta() {
+        const nameField = {
+            token: 'edit-org-name',
+            name: 'name',
+            label: this.t('nameLabel'),
+            hint: '',
+            placeholder: this.t('namePlaceholder'),
+            type: InputType.TEXT,
+            order: 1,
+            validators: [Validators.required, Validators.minLength(2), Validators.maxLength(100)],
+            errors: {
+                required: this.t('nameRequired'),
+                minlength: this.t('nameMin'),
+            },
+            value: this.org?.name ?? '',
+            state: ComponentStates.ENABLED,
+        };
+        const descField = {
+            token: 'edit-org-desc',
+            name: 'description',
+            label: this.t('descriptionLabel'),
+            hint: '',
+            placeholder: this.t('descriptionPlaceholder'),
+            type: InputType.TEXTAREA,
+            order: 2,
+            validators: [],
+            errors: {},
+            value: this.org?.description ?? '',
+            state: ComponentStates.ENABLED,
+        };
+        return {
+            name: '',
+            state: ComponentStates.ENABLED,
+            sections: [{ name: '', order: 1, fields: [nameField, descField] }],
+            actions: {
+                text: this.t('saveCta'),
+                color: 'dark',
+                type: 'submit',
+                fill: 'solid',
+                size: 'default',
+                shape: 'round',
+                expand: 'block',
+                state: ComponentStates.ENABLED,
+                token: 'edit-org-submit',
+            },
+        };
+    }
+    onFormSubmit(event) {
+        const name = event.fields['name'];
+        if (!name?.trim()) {
+            this.toast.show({
+                message: this.t('fillRequired'),
+                duration: 3000,
+                color: 'dark',
+                position: 'top',
+            });
+            return;
+        }
+        const description = event.fields['description'] ?? '';
+        void this.save(name, description);
+    }
+    async save(name, description) {
+        const orgId = this.org?.id ?? this.activeOrgId;
+        if (!orgId || this.saving())
+            return;
+        this.saving.set(true);
+        try {
+            const updated = await firstValueFrom(this.orgService.updateOrg(orgId, { name, description }));
+            this.toast.show({
+                message: this.t('saveSuccess'),
+                color: 'dark',
+                duration: 3500,
+            });
+            this.onSuccess?.(updated);
+            this._modalRef?.dismiss(updated, 'confirm');
+        }
+        catch (err) {
+            this.errors.handle(err, {
+                context: 'editOrgModal.save',
+                fallbackKey: 'saveError',
+                i18nNamespace: this.i18nNamespace,
+            });
+        }
+        finally {
+            this.saving.set(false);
+        }
+    }
+    dismiss() {
+        this._modalRef?.dismiss(null, 'cancel');
+    }
+    t(key) {
+        return this.i18n.t(key, this.i18nNamespace);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EditOrgModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: EditOrgModalComponent, isStandalone: true, selector: "val-edit-org-modal", inputs: { _modalRef: "_modalRef", org: "org", onSuccess: "onSuccess", i18nNamespace: "i18nNamespace" }, ngImport: i0, template: `
+    <ion-header>
+      <ion-toolbar>
+        <ion-buttons slot="end">
+          <ion-button fill="clear" color="dark" (click)="dismiss()">
+            <strong>{{ t('close') }}</strong>
+          </ion-button>
+        </ion-buttons>
+      </ion-toolbar>
+    </ion-header>
+    <ion-content class="ion-padding">
+      <val-display [props]="{ content: t('title'), size: 'small', color: 'dark' }" />
+      <val-title
+        [props]="{
+          content: t('subtitle'),
+          size: 'large',
+          color: '',
+          bold: false,
+        }"
+      />
+      <val-form [props]="formMeta()" (onSubmit)="onFormSubmit($event)" />
+    </ion-content>
+  `, isInline: true, dependencies: [{ kind: "component", type: IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: FormComponent, selector: "val-form", inputs: ["props"], outputs: ["onSubmit", "onInvalid", "onSelectChange"] }, { kind: "component", type: DisplayComponent, selector: "val-display", inputs: ["props"] }, { kind: "component", type: TitleComponent, selector: "val-title", inputs: ["props"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EditOrgModalComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'val-edit-org-modal',
+                    standalone: true,
+                    imports: [IonHeader, IonToolbar, IonButtons, IonButton, IonContent, FormComponent, DisplayComponent, TitleComponent],
+                    template: `
+    <ion-header>
+      <ion-toolbar>
+        <ion-buttons slot="end">
+          <ion-button fill="clear" color="dark" (click)="dismiss()">
+            <strong>{{ t('close') }}</strong>
+          </ion-button>
+        </ion-buttons>
+      </ion-toolbar>
+    </ion-header>
+    <ion-content class="ion-padding">
+      <val-display [props]="{ content: t('title'), size: 'small', color: 'dark' }" />
+      <val-title
+        [props]="{
+          content: t('subtitle'),
+          size: 'large',
+          color: '',
+          bold: false,
+        }"
+      />
+      <val-form [props]="formMeta()" (onSubmit)="onFormSubmit($event)" />
+    </ion-content>
+  `,
+                }]
+        }], ctorParameters: () => [], propDecorators: { _modalRef: [{
+                type: Input
+            }], org: [{
+                type: Input
+            }], onSuccess: [{
+                type: Input
+            }], i18nNamespace: [{
+                type: Input
+            }] } });
+
 /**
  * Defaults i18n (es/en) embebidos en `val-invite-member-modal`. Auto-registrados
  * en el constructor del componente si el consumer no proveyó el namespace
@@ -48386,258 +48638,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                 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
@@ -48665,7 +48665,7 @@ const TRANSFER_OWNERSHIP_MODAL_I18N = {
     },
 };
 
-const DEFAULT_NAMESPACE = 'Settings.TransferModal';
+const DEFAULT_NAMESPACE$1 = 'Settings.TransferModal';
 /**
  * `val-transfer-ownership-modal` — selector de miembro para transferir la
  * propiedad de la organización. Promovido desde `showcase` bajo el proceso de
@@ -48689,7 +48689,7 @@ class TransferOwnershipModalComponent {
         /** Lista de miembros transferibles (todos excepto el owner actual). */
         this.members = [];
         /** Namespace i18n con que la vista resuelve sus textos. */
-        this.i18nNamespace = DEFAULT_NAMESPACE;
+        this.i18nNamespace = DEFAULT_NAMESPACE$1;
         this.query = signal('');
         this.selectedId = signal('');
         this.filtered = computed(() => {
@@ -48701,8 +48701,8 @@ class TransferOwnershipModalComponent {
                 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);
+        if (!this.i18n.hasNamespace(DEFAULT_NAMESPACE$1)) {
+            this.i18n.registerContent(DEFAULT_NAMESPACE$1, TRANSFER_OWNERSHIP_MODAL_I18N);
         }
     }
     ngOnInit() {
@@ -48887,6 +48887,1218 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                 type: Input
             }] } });
 
+/**
+ * Defaults i18n (es/en) embebidos en `val-organization-view`. Auto-registrados en
+ * el constructor del componente si el consumer no proveyó el namespace
+ * (`Settings.Organization` por default). SOLO incluye las keys que la vista usa.
+ *
+ * Portado de `ORG_I18N_CONTENT` (showcase) bajo el proceso de ADR-021.
+ */
+const ORGANIZATION_VIEW_I18N = {
+    es: {
+        pageTitle: 'Organización',
+        pageDescription: 'Gestiona tu organización activa',
+        infoTitle: 'Información',
+        infoName: 'Nombre',
+        infoDescription: 'Descripción',
+        infoPlan: 'Plan',
+        infoType: 'Tipo',
+        editCta: 'Editar',
+        saveCta: 'Guardar',
+        cancelCta: 'Cancelar',
+        membersTitle: 'Miembros',
+        membersEmpty: 'Sin miembros aún.',
+        memberRoles: 'Roles',
+        inviteTitle: 'Invitar',
+        inviteEmail: 'Correo electrónico',
+        inviteRole: 'Rol',
+        inviteCta: 'Invitar',
+        inviteSuccess: 'Invitación enviada.',
+        inviteError: 'No se pudo enviar la invitación.',
+        membersError: 'No se pudieron cargar los miembros.',
+        leaveTitle: 'Salir de la organización',
+        leaveHint: 'Dejarás de tener acceso a esta organización.',
+        leaveCta: 'Salir',
+        leaveOwnerHint: 'Eres el propietario. Transfiere la propiedad antes de salir.',
+        leaveConfirm: '¿Salir de la organización?',
+        planFree: 'Gratuito',
+        planPro: 'Pro',
+        planEnterprise: 'Empresa',
+        saveSuccess: 'Organización actualizada.',
+        leaveSuccess: 'Has salido de la organización.',
+        errorTitle: 'No se pudo cargar la organización',
+        offlineTitle: 'Sin conexión',
+        offlineHint: 'Verifica tu conexión e intenta de nuevo.',
+        retry: 'Reintentar',
+        saveError: 'No se pudo guardar. Intenta de nuevo.',
+        leaveError: 'No se pudo salir. Intenta de nuevo.',
+        transferTitle: 'Transferir propiedad',
+        transferHint: 'Elige un miembro para transferirle la propiedad de la organización.',
+        transferSelect: 'Seleccionar nuevo propietario',
+        transferCta: 'Transferir',
+        transferConfirm: '¿Transferir la propiedad a este miembro? Perderás el rol de propietario.',
+        transferSuccess: 'Propiedad transferida.',
+        transferError: 'No se pudo transferir la propiedad.',
+        inviteCtaTitle: '¿Deseas agregar a alguien?',
+        inviteCtaHint: 'Invita a usuarios a unirse a tu organización.',
+        inviteOpen: 'Invitar',
+        viewMemberCta: 'Ver miembro',
+        roleViewer: 'Visor',
+        roleEditor: 'Editor',
+        roleAdmin: 'Admin',
+        roleSuperAdmin: 'Super Admin',
+        rolesSectionTitle: 'Roles y permisos',
+        rolesHint: 'Tu organización tiene roles que controlan lo que cada miembro puede ver y hacer. Cada rol lleva un conjunto de permisos asociados.',
+        rolesViewPerms: 'Ver roles y permisos',
+        rolesSystemBadge: 'Sistema',
+        permAll: 'Todo',
+        permUsers: 'Usuarios',
+        permDocuments: 'Documentos',
+        permRoles: 'Roles',
+        permMedia: 'Media',
+        permTemplates: 'Plantillas',
+        permRead: 'Leer',
+        permWrite: 'Escribir',
+        permCreate: 'Crear',
+        permDelete: 'Eliminar',
+        permManage: 'Gestionar',
+        membersShowMore: 'Ver más',
+    },
+    en: {
+        pageTitle: 'Organization',
+        pageDescription: 'Manage your active organization',
+        infoTitle: 'Information',
+        infoName: 'Name',
+        infoDescription: 'Description',
+        infoPlan: 'Plan',
+        infoType: 'Type',
+        editCta: 'Edit',
+        saveCta: 'Save',
+        cancelCta: 'Cancel',
+        membersTitle: 'Members',
+        membersEmpty: 'No members yet.',
+        memberRoles: 'Roles',
+        inviteTitle: 'Invite',
+        inviteEmail: 'Email address',
+        inviteRole: 'Role',
+        inviteCta: 'Invite',
+        inviteSuccess: 'Invitation sent.',
+        inviteError: 'Could not send invitation.',
+        membersError: 'Could not load members.',
+        leaveTitle: 'Leave organization',
+        leaveHint: 'You will lose access to this organization.',
+        leaveCta: 'Leave',
+        leaveOwnerHint: 'You are the owner. Transfer ownership before leaving.',
+        leaveConfirm: 'Leave this organization?',
+        planFree: 'Free',
+        planPro: 'Pro',
+        planEnterprise: 'Enterprise',
+        saveSuccess: 'Organization updated.',
+        leaveSuccess: 'You have left the organization.',
+        errorTitle: 'Could not load organization',
+        offlineTitle: 'No connection',
+        offlineHint: 'Check your connection and try again.',
+        retry: 'Retry',
+        saveError: 'Could not save. Please try again.',
+        leaveError: 'Could not leave. Please try again.',
+        transferTitle: 'Transfer ownership',
+        transferHint: 'Choose a member to transfer ownership of this organization.',
+        transferSelect: 'Select new owner',
+        transferCta: 'Transfer',
+        transferConfirm: 'Transfer ownership to this member? You will lose the owner role.',
+        transferSuccess: 'Ownership transferred.',
+        transferError: 'Could not transfer ownership.',
+        inviteCtaTitle: 'Want to add someone?',
+        inviteCtaHint: 'Invite users to join your organization.',
+        inviteOpen: 'Invite',
+        viewMemberCta: 'View member',
+        roleViewer: 'Viewer',
+        roleEditor: 'Editor',
+        roleAdmin: 'Admin',
+        roleSuperAdmin: 'Super Admin',
+        rolesSectionTitle: 'Roles & permissions',
+        rolesHint: 'Your organization has roles that control what each member can see and do. Each role carries a set of associated permissions.',
+        rolesViewPerms: 'View roles & permissions',
+        rolesSystemBadge: 'System',
+        permAll: 'All',
+        permUsers: 'Users',
+        permDocuments: 'Documents',
+        permRoles: 'Roles',
+        permMedia: 'Media',
+        permTemplates: 'Templates',
+        permRead: 'Read',
+        permWrite: 'Write',
+        permCreate: 'Create',
+        permDelete: 'Delete',
+        permManage: 'Manage',
+        membersShowMore: 'Show more',
+    },
+};
+
+const DEFAULT_NAMESPACE = 'Settings.Organization';
+const DEFAULT_VIEW_PERMISSIONS_ROUTE = '/app/settings/permissions';
+const DEFAULT_LEAVE_REDIRECT_ROUTE = '/app/settings/account';
+/**
+ * `val-organization-view` — vista Gestión de organización full-feature
+ * autocontenida (organism). Promovida desde `showcase` bajo el proceso de
+ * ADR-021. Reúne:
+ *  - **Información** — nombre, descripción, plan y tipo de la org activa; editar
+ *    vía modal `val-edit-org-modal` (solo si `canEditOrg()`).
+ *  - **Miembros** — lista paginada (`val-member-card`) enriquecida con perfiles
+ *    públicos (Firestore); ver detalle vía `val-member-detail-modal`.
+ *  - **Roles y permisos** — sección explicativa con CTA a la ruta de permisos.
+ *  - **Invitar** — CTA que abre `val-invite-member-modal` (gateada por `users:*`).
+ *  - **Transferir propiedad** — `val-transfer-ownership-modal` (solo owner).
+ *  - **Salir de la organización** — `OrgService.leaveOrg` con confirmación
+ *    destructiva.
+ *
+ * **RBAC interno** (decisión CTO, ADR-021): el gating fino se resuelve dentro de
+ * la vista vía `AuthService.hasPermission()` + `*valHasPermission` + computeds
+ * `isOwner()`/`canManageMembers()`/`canEditOrg()`. NO se expone como config.
+ *
+ * **Auto-reload en org-switch**: un `effect` reactiona a `activeOrgId()` y recarga
+ * org + miembros cuando el usuario cambia de organización activa mientras la vista
+ * está montada. El effect cubre también la carga inicial (sin doble carga).
+ *
+ * NO renderiza ion-content — vive dentro de val-page-wrapper. `ActivatedRoute` se
+ * inyecta `{ optional: true }` solo para leer el route data de config (no-op
+ * embebido). Auto-registra sus defaults i18n (es/en) si el consumer no proveyó el
+ * namespace (default `Settings.Organization`).
+ */
+class OrganizationViewComponent {
+    /** Namespace i18n resuelto (capturado para llamadas no-reactivas). */
+    get ns() {
+        return this.resolvedConfig().i18nNamespace;
+    }
+    constructor() {
+        this.nav = inject(NavigationService);
+        this.i18n = inject(I18nService);
+        this.auth = inject(AuthService);
+        this.orgService = inject(OrgService);
+        this.toast = inject(ToastService);
+        this.errors = inject(ValtechErrorService);
+        this.modalService = inject(ModalService);
+        this.firestore = inject(Firestore);
+        this.confirmDialog = inject(ConfirmationDialogService);
+        this.route = inject(ActivatedRoute, { optional: true });
+        this.isDebug = isDevMode();
+        this.resolvedConfig = computed(() => {
+            const fromRoute = (this.route?.snapshot.data['organizationConfig'] ?? {});
+            const merged = { ...fromRoute, ...(this.config ?? {}) };
+            return {
+                showInfo: merged.showInfo ?? true,
+                showMembers: merged.showMembers ?? true,
+                showRoles: merged.showRoles ?? true,
+                showInvite: merged.showInvite ?? true,
+                showTransferOwnership: merged.showTransferOwnership ?? true,
+                showLeave: merged.showLeave ?? true,
+                i18nNamespace: merged.i18nNamespace ?? DEFAULT_NAMESPACE,
+                viewPermissionsRoute: merged.viewPermissionsRoute ?? DEFAULT_VIEW_PERMISSIONS_ROUTE,
+                leaveRedirectRoute: merged.leaveRedirectRoute ?? DEFAULT_LEAVE_REDIRECT_ROUTE,
+                onOrgEdited: merged.onOrgEdited,
+                onMemberInvited: merged.onMemberInvited,
+                onOwnershipTransferred: merged.onOwnershipTransferred,
+                onLeftOrg: merged.onLeftOrg,
+            };
+        });
+        this.org = signal(null);
+        this.loading = signal(false);
+        this.leaving = signal(false);
+        this.orgLoadError = signal(null);
+        this.orgErrorState = computed(() => {
+            this.i18n.lang();
+            const err = this.orgLoadError();
+            if (!err)
+                return null;
+            return createErrorStateProps(err, {
+                title: { offline: this.tt('offlineTitle'), error: this.tt('errorTitle') },
+                description: {
+                    offline: this.tt('offlineHint'),
+                    error: interpretError(err).message,
+                },
+                retryLabel: this.tt('retry'),
+                onRetry: () => this.loadOrg(),
+                retrying: this.loading(),
+            });
+        });
+        this.members = signal([]);
+        this.membersLoading = signal(false);
+        this.membersLoadError = signal(null);
+        this.membersNextToken = signal(null);
+        this.loadingMoreMembers = signal(false);
+        this.showAllMembers = signal(false);
+        this.visibleMembers = computed(() => (this.showAllMembers() ? this.members() : this.members().slice(0, 3)));
+        this.transferring = signal(false);
+        this.availableRoles = signal([
+            { id: 'viewer', name: 'viewer' },
+            { id: 'editor', name: 'editor' },
+            { id: 'admin', name: 'admin' },
+        ]);
+        this.activeOrgId = computed(() => {
+            const u = this.auth.user();
+            return u?.activeOrgId ?? u?.activeOrg ?? '';
+        });
+        this.userId = computed(() => this.auth.user()?.userId ?? '');
+        this.isOwner = computed(() => {
+            const o = this.org();
+            const uid = this.userId();
+            return !!o && !!uid && o.ownerId === uid;
+        });
+        this.canEditOrg = computed(() => this.isOwner() || this.auth.hasPermission('org:manage'));
+        this.canManageMembers = computed(() => {
+            if (this.isOwner())
+                return true;
+            const uid = this.userId();
+            const me = this.members().find(m => m.userId === uid);
+            if (!me)
+                return false;
+            return me.roles.some(r => r === 'admin' || r === 'super_admin');
+        });
+        this.pageTitle = computed(() => this.tt('pageTitle'));
+        this.pageDescription = computed(() => this.tt('pageDescription'));
+        this.planLabel = computed(() => {
+            const plan = this.org()?.plan;
+            if (plan === 'pro')
+                return this.tt('planPro');
+            if (plan === 'enterprise')
+                return this.tt('planEnterprise');
+            return this.tt('planFree');
+        });
+        this.editButtonProps = computed(() => ({
+            text: this.tt('editCta'),
+            color: 'primary',
+            fill: 'outline',
+            size: 'small',
+            shape: 'round',
+            type: 'button',
+        }));
+        this.leaveButtonProps = computed(() => ({
+            text: this.tt('leaveCta'),
+            token: 'org-leave',
+            color: 'dark',
+            fill: 'outline',
+            size: 'default',
+            shape: 'round',
+            type: 'button',
+            state: this.isOwner() || this.leaving() ? ComponentStates.DISABLED : ComponentStates.ENABLED,
+        }));
+        this.transferableMembers = computed(() => this.members().filter(m => m.userId !== this.userId()));
+        this.viewPermissionsButtonProps = computed(() => ({
+            text: this.tt('rolesViewPerms'),
+            color: 'primary',
+            fill: 'outline',
+            size: 'default',
+            shape: 'round',
+            type: 'button',
+            token: 'org-view-permissions',
+        }));
+        this.transferButtonProps = computed(() => ({
+            text: this.tt('transferCta'),
+            token: 'org-transfer-submit',
+            color: 'dark',
+            fill: 'outline',
+            size: 'default',
+            shape: 'round',
+            type: 'button',
+            state: this.transferring() ? ComponentStates.DISABLED : ComponentStates.ENABLED,
+        }));
+        this.openInviteButtonProps = computed(() => ({
+            text: this.tt('inviteOpen'),
+            color: 'primary',
+            fill: 'solid',
+            size: 'default',
+            shape: 'round',
+            type: 'button',
+        }));
+        /** Guarda para detectar el primer disparo del effect (evita doble carga). */
+        this.lastLoadedOrgId = null;
+        const ns = this.ns;
+        if (!this.i18n.hasNamespace(ns)) {
+            this.i18n.registerContent(ns, ORGANIZATION_VIEW_I18N);
+        }
+        this.nav.setBackHeader('pageTitle', ns, { withMenu: true });
+        // Auto-reload en org-switch: reacciona a activeOrgId() y recarga org + miembros
+        // cuando el usuario cambia de organización activa mientras la vista está
+        // montada. Cubre también la carga inicial — `lastLoadedOrgId` evita recargar
+        // dos veces el mismo id (p.ej. si el effect re-corre por otra dependencia).
+        // `allowSignalWrites` porque las load fns escriben signals síncronamente
+        // (loading/error/token) — Angular 18 bloquea writes en effect sin el flag.
+        effect(() => {
+            const orgId = this.activeOrgId();
+            if (orgId === this.lastLoadedOrgId)
+                return;
+            this.lastLoadedOrgId = orgId;
+            this.loadOrg();
+            this.loadMembers();
+            this.loadRoles();
+        }, { allowSignalWrites: true });
+        connectPageRefresh(async () => {
+            await Promise.all([this.loadOrg(), this.loadMembers()]);
+        });
+    }
+    onEdit() {
+        void this.modalService.open({
+            component: EditOrgModalComponent,
+            componentProps: {
+                org: this.org(),
+                onSuccess: (updated) => {
+                    this.org.set(updated);
+                    this.resolvedConfig().onOrgEdited?.();
+                },
+            },
+            breakpoints: {
+                breakpoints: [0, 0.85],
+                initialBreakpoint: 0.85,
+                showHandle: true,
+            },
+            backdropDismiss: true,
+        });
+    }
+    async onLeave() {
+        if (this.isOwner() || this.leaving())
+            return;
+        const result = await this.confirmDialog.confirmDestructive({
+            title: this.tt('leaveTitle'),
+            message: this.tt('leaveConfirm'),
+            confirmButton: { text: this.tt('leaveCta') },
+            cancelButton: { text: this.tt('cancelCta') },
+        });
+        if (!result.confirmed)
+            return;
+        const orgId = this.activeOrgId();
+        if (!orgId)
+            return;
+        this.leaving.set(true);
+        try {
+            await firstValueFrom(this.orgService.leaveOrg(orgId));
+            this.toast.show({
+                message: this.tt('leaveSuccess'),
+                color: 'dark',
+                duration: 3500,
+            });
+            const cfg = this.resolvedConfig();
+            this.nav.navigateByUrl(cfg.leaveRedirectRoute);
+            cfg.onLeftOrg?.();
+        }
+        catch (err) {
+            this.errors.handle(err, {
+                context: 'organization.leave',
+                fallbackKey: 'leaveError',
+                i18nNamespace: this.ns,
+            });
+        }
+        finally {
+            this.leaving.set(false);
+        }
+    }
+    onOpenInvite() {
+        void this.modalService.open({
+            component: InviteMemberModalComponent,
+            componentProps: {
+                orgId: this.activeOrgId(),
+                existingMemberIds: this.members().map(m => m.userId),
+                onSuccess: () => {
+                    this.loadMembers();
+                    this.resolvedConfig().onMemberInvited?.();
+                },
+            },
+            breakpoints: {
+                breakpoints: [0, 0.92],
+                initialBreakpoint: 0.92,
+                showHandle: true,
+            },
+            backdropDismiss: true,
+        });
+    }
+    onViewPermissions() {
+        this.nav.navigateByUrl(this.resolvedConfig().viewPermissionsRoute);
+    }
+    onOpenTransfer() {
+        void this.modalService.open({
+            component: TransferOwnershipModalComponent,
+            componentProps: {
+                members: this.transferableMembers(),
+                onConfirm: (newOwnerId) => void this.onTransfer(newOwnerId),
+            },
+            breakpoints: {
+                breakpoints: [0, 0.75],
+                initialBreakpoint: 0.75,
+                showHandle: true,
+            },
+            backdropDismiss: true,
+        });
+    }
+    async onTransfer(newOwnerId) {
+        if (!newOwnerId || this.transferring())
+            return;
+        const result = await this.confirmDialog.confirmDestructive({
+            title: this.tt('transferTitle'),
+            message: this.tt('transferConfirm'),
+            confirmButton: { text: this.tt('transferCta') },
+            cancelButton: { text: this.tt('cancelCta') },
+        });
+        if (!result.confirmed)
+            return;
+        const orgId = this.activeOrgId();
+        if (!orgId)
+            return;
+        this.transferring.set(true);
+        try {
+            await firstValueFrom(this.orgService.transferOwnership(orgId, newOwnerId));
+            this.toast.show({
+                message: this.tt('transferSuccess'),
+                color: 'dark',
+                duration: 3500,
+            });
+            this.loadOrg();
+            this.loadMembers();
+            this.resolvedConfig().onOwnershipTransferred?.();
+        }
+        catch (err) {
+            this.errors.handle(err, {
+                context: 'organization.transfer',
+                fallbackKey: 'transferError',
+                i18nNamespace: this.ns,
+            });
+        }
+        finally {
+            this.transferring.set(false);
+        }
+    }
+    loadOrg() {
+        const orgId = this.activeOrgId();
+        if (!orgId)
+            return Promise.resolve();
+        this.loading.set(true);
+        this.orgLoadError.set(null);
+        return new Promise(resolve => {
+            this.orgService.getOrg(orgId).subscribe({
+                next: org => {
+                    this.org.set(org);
+                    this.loading.set(false);
+                    resolve();
+                },
+                error: err => {
+                    this.orgLoadError.set(err);
+                    this.loading.set(false);
+                    resolve();
+                },
+            });
+        });
+    }
+    loadMembers() {
+        const orgId = this.activeOrgId();
+        if (!orgId)
+            return Promise.resolve();
+        this.membersLoading.set(true);
+        this.membersNextToken.set(null);
+        this.showAllMembers.set(false);
+        return new Promise(resolve => {
+            this.orgService.getOrgMembers(orgId, { limit: 20 }).subscribe({
+                next: async (res) => {
+                    const cards = await this.enrichWithProfiles(res.members);
+                    this.members.set(cards);
+                    this.membersNextToken.set(res.nextToken ?? null);
+                    this.membersLoading.set(false);
+                    resolve();
+                },
+                error: err => {
+                    this.membersLoadError.set(err);
+                    this.membersLoading.set(false);
+                    resolve();
+                },
+            });
+        });
+    }
+    loadMoreMembers() {
+        const orgId = this.activeOrgId();
+        const token = this.membersNextToken();
+        if (!orgId || !token || this.loadingMoreMembers())
+            return;
+        this.loadingMoreMembers.set(true);
+        this.orgService.getOrgMembers(orgId, { limit: 20, nextToken: token }).subscribe({
+            next: async (res) => {
+                const cards = await this.enrichWithProfiles(res.members);
+                this.members.update(prev => [...prev, ...cards]);
+                this.membersNextToken.set(res.nextToken ?? null);
+                this.loadingMoreMembers.set(false);
+            },
+            error: err => {
+                this.errors.handle(err, {
+                    context: 'organization.loadMoreMembers',
+                    fallbackKey: 'membersError',
+                    i18nNamespace: this.ns,
+                });
+                this.loadingMoreMembers.set(false);
+            },
+        });
+    }
+    async enrichWithProfiles(members) {
+        const results = await Promise.allSettled(members.map(async (m) => {
+            try {
+                const snap = await getDoc(doc(this.firestore, `profiles/${m.userId}`));
+                const p = snap.exists() ? snap.data() : {};
+                return {
+                    ...m,
+                    handle: p['handle'],
+                    avatar: (p['avatarUrl'] ?? p['avatar']),
+                    name: p['name'] || m.name,
+                };
+            }
+            catch {
+                return m;
+            }
+        }));
+        return results.map(r => (r.status === 'fulfilled' ? r.value : {}));
+    }
+    loadRoles() {
+        const orgId = this.activeOrgId();
+        if (!orgId)
+            return;
+        this.orgService.listOrgRoles(orgId).subscribe({
+            next: roles => {
+                if (roles.length)
+                    this.availableRoles.set(roles);
+            },
+        });
+    }
+    roleLabel(roleIdOrName) {
+        // Try to find by id first (UUID), then by name
+        const found = this.availableRoles().find(r => r.id === roleIdOrName || r.name === roleIdOrName);
+        const name = found?.name ?? roleIdOrName;
+        const keyMap = {
+            viewer: 'roleViewer',
+            editor: 'roleEditor',
+            admin: 'roleAdmin',
+            super_admin: 'roleSuperAdmin',
+        };
+        const key = keyMap[name] ?? name;
+        const label = this.tt(key);
+        return label && !label.startsWith('[') ? label : name;
+    }
+    permissionLabel(perm) {
+        if (perm === '*:*')
+            return this.tt('permAll');
+        const [resource, action] = perm.split(':');
+        const resKey = {
+            users: 'permUsers',
+            documents: 'permDocuments',
+            roles: 'permRoles',
+            media: 'permMedia',
+            templates: 'permTemplates',
+            '*': 'permAll',
+        };
+        const actKey = {
+            read: 'permRead',
+            write: 'permWrite',
+            create: 'permCreate',
+            delete: 'permDelete',
+            manage: 'permManage',
+            '*': 'permAll',
+        };
+        const res = this.tt(resKey[resource] ?? resource);
+        const act = this.tt(actKey[action] ?? action);
+        return `${res}: ${act}`;
+    }
+    onViewMember(member) {
+        void this.modalService.open({
+            component: MemberDetailModalComponent,
+            componentProps: {
+                member,
+                orgId: this.activeOrgId(),
+                availableRoles: this.availableRoles(),
+                canManage: this.canManageMembers() && member.userId !== this.userId(),
+                isSelf: member.userId === this.userId(),
+                onChanged: () => this.loadMembers(),
+            },
+            breakpoints: {
+                breakpoints: [0, 0.7],
+                initialBreakpoint: 0.7,
+                showHandle: true,
+            },
+            backdropDismiss: true,
+        });
+    }
+    tt(key) {
+        return this.i18n.t(key, this.ns);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: OrganizationViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: OrganizationViewComponent, isStandalone: true, selector: "val-organization-view", inputs: { config: "config" }, ngImport: i0, template: `
+    <div class="page">
+      <header class="page-header">
+        <val-display [props]="{ size: 'small', color: 'dark', content: pageTitle() }" />
+        <val-title
+          [props]="{
+            size: 'large',
+            color: 'dark',
+            bold: false,
+            content: pageDescription(),
+          }"
+        />
+      </header>
+
+      @if (resolvedConfig().showInfo) {
+        <!-- Org Info -->
+        <section class="settings-section">
+          <div class="section-header-row">
+            <val-title
+              [props]="{
+                size: 'medium',
+                color: 'dark',
+                bold: true,
+                content: tt('infoTitle'),
+              }"
+            />
+            @if (canEditOrg()) {
+              <val-button [props]="editButtonProps()" (click)="onEdit()" />
+            }
+          </div>
+
+          <div class="section-body">
+            @if (loading()) {
+              <val-skeleton-layout [props]="{ preset: 'detail', rows: 4 }" />
+            } @else if (orgErrorState()) {
+              <val-empty-state [props]="orgErrorState()!" />
+            } @else {
+              @if (org(); as o) {
+                <div class="org-info-card">
+                  <div class="org-info-field org-info-field--full">
+                    <span class="org-info-label">{{ tt('infoName') }}</span>
+                    <span class="org-info-value">{{ o.name }}</span>
+                  </div>
+                  <div class="org-info-field org-info-field--full">
+                    <span class="org-info-label">{{ tt('infoDescription') }}</span>
+                    <span class="org-info-value org-info-value--muted">{{ o.description || '—' }}</span>
+                  </div>
+                  <div class="org-info-row">
+                    <div class="org-info-field">
+                      <span class="org-info-label">{{ tt('infoPlan') }}</span>
+                      <span class="plan-badge plan-badge--{{ o.plan }}">{{ planLabel() }}</span>
+                    </div>
+                    <div class="org-info-field">
+                      <span class="org-info-label">{{ tt('infoType') }}</span>
+                      <span class="org-info-value">{{ o.type }}</span>
+                    </div>
+                  </div>
+                </div>
+              }
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showMembers) {
+        <!-- Members -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('membersTitle'),
+            }"
+          />
+          <div class="section-body">
+            @if (membersLoading()) {
+              <val-skeleton-layout [props]="{ preset: 'list', rows: 3 }" />
+            } @else if (members().length === 0) {
+              <val-text
+                [props]="{
+                  content: tt('membersEmpty'),
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                }"
+              />
+            } @else {
+              <div class="members-list">
+                @for (m of visibleMembers(); track m.userId) {
+                  <val-member-card
+                    [attr.data-testid]="'org-member-' + m.userId"
+                    [props]="{
+                      id: m.userId,
+                      name: m.name,
+                      handle: m.handle,
+                      email: m.email,
+                      avatarUrl: m.avatar,
+                      roleLabel: m.roles[0] ? roleLabel(m.roles[0]) : '',
+                      actionAriaLabel: tt('viewMemberCta'),
+                    }"
+                    (onAction)="onViewMember(m)"
+                  />
+                }
+              </div>
+              @if (!showAllMembers() && members().length > 3) {
+                <button class="members-show-more" (click)="showAllMembers.set(true)">
+                  {{ tt('membersShowMore') }} ({{ members().length - 3 }})
+                </button>
+              }
+              @if (showAllMembers() && membersNextToken()) {
+                <button class="members-show-more" [disabled]="loadingMoreMembers()" (click)="loadMoreMembers()">
+                  {{ loadingMoreMembers() ? '…' : tt('membersShowMore') }}
+                </button>
+              }
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showRoles) {
+        <!-- Roles y permisos: seccion explicativa, detalle en la ruta de permisos -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('rolesSectionTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: tt('rolesHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            <div class="row-actions">
+              <val-button [props]="viewPermissionsButtonProps()" (click)="onViewPermissions()" />
+            </div>
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showInvite) {
+        <!-- Invite: solo admin+ (gating RBAC interno) -->
+        <section *valHasPermission="'users:*'" class="settings-section" data-testid="org-invite-section">
+          <div class="invite-cta">
+            <div class="invite-cta__text">
+              <val-title
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: true,
+                  content: tt('inviteCtaTitle'),
+                }"
+              />
+              <val-text
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                  content: tt('inviteCtaHint'),
+                }"
+              />
+            </div>
+            <val-button [props]="openInviteButtonProps()" (click)="onOpenInvite()" />
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showTransferOwnership && isOwner()) {
+        <!-- Transfer ownership: solo owner (gating RBAC interno) -->
+        <section class="settings-section" data-testid="org-transfer-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('transferTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: tt('transferHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            @if (transferableMembers().length > 0) {
+              <div class="row-actions">
+                <val-button [props]="transferButtonProps()" (click)="onOpenTransfer()" />
+              </div>
+            } @else {
+              <val-text
+                [props]="{
+                  content: tt('membersEmpty'),
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                }"
+              />
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showLeave) {
+        <!-- Leave org -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('leaveTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: isOwner() ? tt('leaveOwnerHint') : tt('leaveHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            <div class="row-actions">
+              <val-button [props]="leaveButtonProps()" (click)="onLeave()" />
+            </div>
+          </div>
+        </section>
+      }
+
+      @if (isDebug) {
+        <section class="settings-section rbac-debug">
+          <div class="section-header-row">
+            <val-title
+              [props]="{
+                content: 'RBAC (live)',
+                size: 'small',
+                color: 'medium',
+                bold: false,
+              }"
+            />
+          </div>
+          <div class="rbac-debug__body">
+            <div class="rbac-debug__row">
+              <span class="rbac-debug__label">Roles</span>
+              <span class="rbac-debug__value">{{ auth.roles().join(', ') || '—' }}</span>
+            </div>
+            <div class="rbac-debug__row">
+              <span class="rbac-debug__label">Permisos</span>
+              <span class="rbac-debug__value rbac-debug__value--perms">{{ auth.permissions().join(', ') || '—' }}</span>
+            </div>
+          </div>
+        </section>
+      }
+    </div>
+  `, isInline: true, styles: [".page{padding:16px 0;max-width:720px;margin:0 auto}.page-header{margin-bottom:16px}.settings-section{padding:16px 0}.settings-section+.settings-section{border-top:1px solid var(--val-border-color, rgba(0, 0, 0, .08))}.section-header-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.section-body{display:flex;flex-direction:column;gap:10px}.row-actions{margin-top:12px}.row-actions--gap{display:flex;gap:8px}.invite-cta{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}.invite-cta__text{display:flex;flex-direction:column;gap:4px;flex:1}.org-info-card{border-radius:14px;background:var(--ion-color-light, #f4f5f8);overflow:hidden}:host-context(body.dark) .org-info-card,:host-context(html.ion-palette-dark) .org-info-card,:host-context([data-theme=\"dark\"]) .org-info-card{background:#ffffff0d}.org-info-field{padding:12px 16px;display:flex;flex-direction:column;gap:4px;border-bottom:1px solid var(--val-border-color, rgba(0, 0, 0, .06))}.org-info-field--full{width:100%}.org-info-field:last-child{border-bottom:none}.org-info-row{display:flex}.org-info-row .org-info-field{flex:1}.org-info-row .org-info-field:first-child{border-right:1px solid var(--val-border-color, rgba(0, 0, 0, .06))}.org-info-label{font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.org-info-value{font-size:.95rem;font-weight:500;color:var(--ion-color-dark)}.org-info-value--muted{color:var(--ion-color-medium);font-weight:400}.plan-badge{display:inline-block;font-size:.78rem;font-weight:700;padding:3px 10px;border-radius:20px;width:fit-content}.plan-badge--free{background:var(--ion-color-light-shade, #d7d8da);color:var(--ion-color-dark)}.plan-badge--pro{background:var(--ion-color-primary);color:#fff}.plan-badge--enterprise{background:#f5c542;color:#222}.members-list{display:flex;flex-direction:column;gap:8px}.members-show-more{background:none;border:none;color:var(--ion-color-primary);font-size:14px;font-weight:500;cursor:pointer;padding:8px 0}.rbac-debug{opacity:.7}.rbac-debug__body{display:flex;flex-direction:column;gap:6px;font-family:monospace;font-size:.78rem}.rbac-debug__row{display:flex;gap:8px;align-items:flex-start}.rbac-debug__label{color:var(--ion-color-medium);min-width:72px;flex-shrink:0}.rbac-debug__value{color:var(--ion-color-dark);word-break:break-all}.rbac-debug__value--perms{color:var(--ion-color-medium)}\n"], dependencies: [{ kind: "component", type: DisplayComponent, selector: "val-display", inputs: ["props"] }, { kind: "component", type: EmptyStateComponent, selector: "val-empty-state", inputs: ["props"] }, { kind: "directive", type: HasPermissionDirective, selector: "[valHasPermission]", inputs: ["valHasPermission"] }, { kind: "component", type: SkeletonLayoutComponent, selector: "val-skeleton-layout", inputs: ["props"] }, { kind: "component", type: TitleComponent, selector: "val-title", inputs: ["props"] }, { kind: "component", type: TextComponent, selector: "val-text", inputs: ["props"] }, { kind: "component", type: ButtonComponent, selector: "val-button", inputs: ["preset", "props"], outputs: ["onClick"] }, { kind: "component", type: MemberCardComponent, selector: "val-member-card", inputs: ["props"], outputs: ["onAction"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: OrganizationViewComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'val-organization-view', standalone: true, imports: [
+                        DisplayComponent,
+                        EmptyStateComponent,
+                        HasPermissionDirective,
+                        SkeletonLayoutComponent,
+                        TitleComponent,
+                        TextComponent,
+                        ButtonComponent,
+                        MemberCardComponent,
+                        TransferOwnershipModalComponent,
+                    ], template: `
+    <div class="page">
+      <header class="page-header">
+        <val-display [props]="{ size: 'small', color: 'dark', content: pageTitle() }" />
+        <val-title
+          [props]="{
+            size: 'large',
+            color: 'dark',
+            bold: false,
+            content: pageDescription(),
+          }"
+        />
+      </header>
+
+      @if (resolvedConfig().showInfo) {
+        <!-- Org Info -->
+        <section class="settings-section">
+          <div class="section-header-row">
+            <val-title
+              [props]="{
+                size: 'medium',
+                color: 'dark',
+                bold: true,
+                content: tt('infoTitle'),
+              }"
+            />
+            @if (canEditOrg()) {
+              <val-button [props]="editButtonProps()" (click)="onEdit()" />
+            }
+          </div>
+
+          <div class="section-body">
+            @if (loading()) {
+              <val-skeleton-layout [props]="{ preset: 'detail', rows: 4 }" />
+            } @else if (orgErrorState()) {
+              <val-empty-state [props]="orgErrorState()!" />
+            } @else {
+              @if (org(); as o) {
+                <div class="org-info-card">
+                  <div class="org-info-field org-info-field--full">
+                    <span class="org-info-label">{{ tt('infoName') }}</span>
+                    <span class="org-info-value">{{ o.name }}</span>
+                  </div>
+                  <div class="org-info-field org-info-field--full">
+                    <span class="org-info-label">{{ tt('infoDescription') }}</span>
+                    <span class="org-info-value org-info-value--muted">{{ o.description || '—' }}</span>
+                  </div>
+                  <div class="org-info-row">
+                    <div class="org-info-field">
+                      <span class="org-info-label">{{ tt('infoPlan') }}</span>
+                      <span class="plan-badge plan-badge--{{ o.plan }}">{{ planLabel() }}</span>
+                    </div>
+                    <div class="org-info-field">
+                      <span class="org-info-label">{{ tt('infoType') }}</span>
+                      <span class="org-info-value">{{ o.type }}</span>
+                    </div>
+                  </div>
+                </div>
+              }
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showMembers) {
+        <!-- Members -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('membersTitle'),
+            }"
+          />
+          <div class="section-body">
+            @if (membersLoading()) {
+              <val-skeleton-layout [props]="{ preset: 'list', rows: 3 }" />
+            } @else if (members().length === 0) {
+              <val-text
+                [props]="{
+                  content: tt('membersEmpty'),
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                }"
+              />
+            } @else {
+              <div class="members-list">
+                @for (m of visibleMembers(); track m.userId) {
+                  <val-member-card
+                    [attr.data-testid]="'org-member-' + m.userId"
+                    [props]="{
+                      id: m.userId,
+                      name: m.name,
+                      handle: m.handle,
+                      email: m.email,
+                      avatarUrl: m.avatar,
+                      roleLabel: m.roles[0] ? roleLabel(m.roles[0]) : '',
+                      actionAriaLabel: tt('viewMemberCta'),
+                    }"
+                    (onAction)="onViewMember(m)"
+                  />
+                }
+              </div>
+              @if (!showAllMembers() && members().length > 3) {
+                <button class="members-show-more" (click)="showAllMembers.set(true)">
+                  {{ tt('membersShowMore') }} ({{ members().length - 3 }})
+                </button>
+              }
+              @if (showAllMembers() && membersNextToken()) {
+                <button class="members-show-more" [disabled]="loadingMoreMembers()" (click)="loadMoreMembers()">
+                  {{ loadingMoreMembers() ? '…' : tt('membersShowMore') }}
+                </button>
+              }
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showRoles) {
+        <!-- Roles y permisos: seccion explicativa, detalle en la ruta de permisos -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('rolesSectionTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: tt('rolesHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            <div class="row-actions">
+              <val-button [props]="viewPermissionsButtonProps()" (click)="onViewPermissions()" />
+            </div>
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showInvite) {
+        <!-- Invite: solo admin+ (gating RBAC interno) -->
+        <section *valHasPermission="'users:*'" class="settings-section" data-testid="org-invite-section">
+          <div class="invite-cta">
+            <div class="invite-cta__text">
+              <val-title
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: true,
+                  content: tt('inviteCtaTitle'),
+                }"
+              />
+              <val-text
+                [props]="{
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                  content: tt('inviteCtaHint'),
+                }"
+              />
+            </div>
+            <val-button [props]="openInviteButtonProps()" (click)="onOpenInvite()" />
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showTransferOwnership && isOwner()) {
+        <!-- Transfer ownership: solo owner (gating RBAC interno) -->
+        <section class="settings-section" data-testid="org-transfer-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('transferTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: tt('transferHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            @if (transferableMembers().length > 0) {
+              <div class="row-actions">
+                <val-button [props]="transferButtonProps()" (click)="onOpenTransfer()" />
+              </div>
+            } @else {
+              <val-text
+                [props]="{
+                  content: tt('membersEmpty'),
+                  size: 'medium',
+                  color: 'dark',
+                  bold: false,
+                }"
+              />
+            }
+          </div>
+        </section>
+      }
+
+      @if (resolvedConfig().showLeave) {
+        <!-- Leave org -->
+        <section class="settings-section">
+          <val-title
+            [props]="{
+              size: 'medium',
+              color: 'dark',
+              bold: true,
+              content: tt('leaveTitle'),
+            }"
+          />
+          <div class="section-body">
+            <val-text
+              [props]="{
+                content: isOwner() ? tt('leaveOwnerHint') : tt('leaveHint'),
+                size: 'medium',
+                color: 'dark',
+                bold: false,
+              }"
+            />
+            <div class="row-actions">
+              <val-button [props]="leaveButtonProps()" (click)="onLeave()" />
+            </div>
+          </div>
+        </section>
+      }
+
+      @if (isDebug) {
+        <section class="settings-section rbac-debug">
+          <div class="section-header-row">
+            <val-title
+              [props]="{
+                content: 'RBAC (live)',
+                size: 'small',
+                color: 'medium',
+                bold: false,
+              }"
+            />
+          </div>
+          <div class="rbac-debug__body">
+            <div class="rbac-debug__row">
+              <span class="rbac-debug__label">Roles</span>
+              <span class="rbac-debug__value">{{ auth.roles().join(', ') || '—' }}</span>
+            </div>
+            <div class="rbac-debug__row">
+              <span class="rbac-debug__label">Permisos</span>
+              <span class="rbac-debug__value rbac-debug__value--perms">{{ auth.permissions().join(', ') || '—' }}</span>
+            </div>
+          </div>
+        </section>
+      }
+    </div>
+  `, styles: [".page{padding:16px 0;max-width:720px;margin:0 auto}.page-header{margin-bottom:16px}.settings-section{padding:16px 0}.settings-section+.settings-section{border-top:1px solid var(--val-border-color, rgba(0, 0, 0, .08))}.section-header-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.section-body{display:flex;flex-direction:column;gap:10px}.row-actions{margin-top:12px}.row-actions--gap{display:flex;gap:8px}.invite-cta{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}.invite-cta__text{display:flex;flex-direction:column;gap:4px;flex:1}.org-info-card{border-radius:14px;background:var(--ion-color-light, #f4f5f8);overflow:hidden}:host-context(body.dark) .org-info-card,:host-context(html.ion-palette-dark) .org-info-card,:host-context([data-theme=\"dark\"]) .org-info-card{background:#ffffff0d}.org-info-field{padding:12px 16px;display:flex;flex-direction:column;gap:4px;border-bottom:1px solid var(--val-border-color, rgba(0, 0, 0, .06))}.org-info-field--full{width:100%}.org-info-field:last-child{border-bottom:none}.org-info-row{display:flex}.org-info-row .org-info-field{flex:1}.org-info-row .org-info-field:first-child{border-right:1px solid var(--val-border-color, rgba(0, 0, 0, .06))}.org-info-label{font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ion-color-medium)}.org-info-value{font-size:.95rem;font-weight:500;color:var(--ion-color-dark)}.org-info-value--muted{color:var(--ion-color-medium);font-weight:400}.plan-badge{display:inline-block;font-size:.78rem;font-weight:700;padding:3px 10px;border-radius:20px;width:fit-content}.plan-badge--free{background:var(--ion-color-light-shade, #d7d8da);color:var(--ion-color-dark)}.plan-badge--pro{background:var(--ion-color-primary);color:#fff}.plan-badge--enterprise{background:#f5c542;color:#222}.members-list{display:flex;flex-direction:column;gap:8px}.members-show-more{background:none;border:none;color:var(--ion-color-primary);font-size:14px;font-weight:500;cursor:pointer;padding:8px 0}.rbac-debug{opacity:.7}.rbac-debug__body{display:flex;flex-direction:column;gap:6px;font-family:monospace;font-size:.78rem}.rbac-debug__row{display:flex;gap:8px;align-items:flex-start}.rbac-debug__label{color:var(--ion-color-medium);min-width:72px;flex-shrink:0}.rbac-debug__value{color:var(--ion-color-dark);word-break:break-all}.rbac-debug__value--perms{color:var(--ion-color-medium)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { config: [{
+                type: Input
+            }] } });
+
+/**
+ * Helper para montar la vista Gestión de organización (`val-organization-view`)
+ * como ruta en una app del factory. El `config` se pasa por route `data`
+ * (`organizationConfig`) y el componente lo lee como fallback de su
+ * `@Input() config`.
+ *
+ * @example
+ * ```ts
+ * // settings.routes.ts
+ * export const settingsRoutes: Routes = [
+ *   ...provideValtechOrganizationRoutes(),                 // → /app/settings/organization
+ *   { path: 'preferences', loadComponent: () => ... },
+ * ];
+ *
+ * // con config acotada:
+ * ...provideValtechOrganizationRoutes({ config: { showLeave: false } }),
+ * ...provideValtechOrganizationRoutes({ config: { viewPermissionsRoute: '/app/roles' } }),
+ * ```
+ */
+function provideValtechOrganizationRoutes(opts) {
+    return [
+        {
+            path: opts?.path ?? 'organization',
+            component: OrganizationViewComponent,
+            data: { organizationConfig: opts?.config },
+        },
+    ];
+}
+
 /** Built-in label sets for the three platform locales. */
 const CALLOUT_LABELS = {
     es: {
@@ -59211,5 +60423,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ACTION_CARD_DEFAULTS, AD_SIZE_MAP, API_TABLE_COLUMN_LABELS, ARTICLE_CARD_DEFAULTS, ARTICLE_SPACING, ARTICLE_STRIP_DEFAULTS, AUTH_CTA_DEFAULTS, AVATAR_UPLOAD_DEFAULTS, AccordionComponent, AccountViewComponent, ActionCardComponent, ActionHeaderComponent, ActionType, AdSlotComponent, AdsLoaderService, AdsService, AlertBoxComponent, AnalyticsErrorHandler, AnalyticsRouterTracker, AnalyticsService, AnimatedTerminalComponent, AppConfigService, AppVersionService, ArticleBuilder, ArticleCardComponent, ArticleComponent, ArticleStripComponent, AttachmentUploaderComponent, AuthBackgroundComponent, AuthCtaComponent, AuthService, AuthStateService, AuthStorageService, AuthSyncService, AvatarComponent, AvatarUploadComponent, BOTTOM_NAV_DEFAULTS, BannerComponent, BaseDefault, BlogPostBuilder, BottomNavComponent, BoxComponent, BreadcrumbComponent, ButtonComponent, ButtonGroupComponent, CALLOUT_LABELS, CHEV_KEYS, CIRCLE_KEYS, COMMON_COUNTRY_CODES, COMMON_CURRENCIES, CONTENT_CARD_DEFAULTS, CORNER_KEYS, CTA_CARD_DEFAULTS, CURRENCY_INFO, CardComponent, CardSection, CardType, CardsCarouselComponent, ChangeEmailModalComponent, ChangePasswordModalComponent, CheckInputComponent, CheckboxRadioInputComponent, ChipGroupComponent, ClearDefault, ClearDefaultBlock, ClearDefaultFull, ClearDefaultRound, ClearDefaultRoundBlock, ClearDefaultRoundFull, CodeDisplayComponent, CommandDisplayComponent, CommentComponent, CommentInputComponent, CommentSectionComponent, CompanyFooterComponent, ComponentStates, ConfirmationDialogService, ContainerComponent, ContentCardComponent, ContentLoaderComponent, ContentReactionComponent, ContentService, ContentTransformer, CookieBannerComponent, CountdownComponent, CreateOrgModalComponent, CtaCardComponent, CurrencyInputComponent, DEFAULT_ADS_CONFIG, DEFAULT_APP_CONFIG_SERVICE_CONFIG, DEFAULT_APP_VERSION_SERVICE_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_BACK_HEADER, DEFAULT_CANCEL_BUTTON, DEFAULT_CHECK_INTERVAL_MS, DEFAULT_CONFIRM_BUTTON, DEFAULT_COUNTDOWN_LABELS, DEFAULT_COUNTDOWN_LABELS_EN, DEFAULT_DEBUG_CONSOLE_CONFIG, DEFAULT_DONATION_CONFIG, DEFAULT_EMPTY_STATE, DEFAULT_EMULATOR_CONFIG, DEFAULT_FEEDBACK_CONFIG, DEFAULT_FEEDBACK_TYPE_OPTIONS, DEFAULT_HOME_HEADER, DEFAULT_INFINITE_LIST_METADATA, DEFAULT_MODAL_CANCEL_BUTTON, DEFAULT_MODAL_CONFIRM_BUTTON, DEFAULT_PAGE_SIZE_OPTIONS, DEFAULT_PLATFORMS, DEFAULT_REFRESHER_METADATA, DEFAULT_SKELETON_CONFIG, DEFAULT_SPLASH_SCREEN_CONFIG, DataTableComponent, DateInputComponent, DateRangeInputComponent, DebugConsoleComponent, DeleteAccountModalComponent, DetailSkeletonComponent, DeviceService, DisplayComponent, DividerComponent, DocsApiTableComponent, DocsBreadcrumbComponent, DocsBuilder, DocsCalloutComponent, DocsCodeExampleComponent, DocsLayoutComponent, DocsNavLinksComponent, DocsNavigationService, DocsPageComponent, DocsSearchComponent, DocsSectionComponent, DocsShellComponent, DocsSidebarComponent, DocsTocComponent, DonationService, DownloadService, 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 };
+export { ACTION_CARD_DEFAULTS, AD_SIZE_MAP, API_TABLE_COLUMN_LABELS, ARTICLE_CARD_DEFAULTS, ARTICLE_SPACING, ARTICLE_STRIP_DEFAULTS, AUTH_CTA_DEFAULTS, AVATAR_UPLOAD_DEFAULTS, AccordionComponent, AccountViewComponent, ActionCardComponent, ActionHeaderComponent, ActionType, AdSlotComponent, AdsLoaderService, AdsService, AlertBoxComponent, AnalyticsErrorHandler, AnalyticsRouterTracker, AnalyticsService, AnimatedTerminalComponent, AppConfigService, AppVersionService, ArticleBuilder, ArticleCardComponent, ArticleComponent, ArticleStripComponent, AttachmentUploaderComponent, AuthBackgroundComponent, AuthCtaComponent, AuthService, AuthStateService, AuthStorageService, AuthSyncService, AvatarComponent, AvatarUploadComponent, BOTTOM_NAV_DEFAULTS, BannerComponent, BaseDefault, BlogPostBuilder, BottomNavComponent, BoxComponent, BreadcrumbComponent, ButtonComponent, ButtonGroupComponent, CALLOUT_LABELS, CHEV_KEYS, CIRCLE_KEYS, COMMON_COUNTRY_CODES, COMMON_CURRENCIES, CONTENT_CARD_DEFAULTS, CORNER_KEYS, CTA_CARD_DEFAULTS, CURRENCY_INFO, CardComponent, CardSection, CardType, CardsCarouselComponent, ChangeEmailModalComponent, ChangePasswordModalComponent, CheckInputComponent, CheckboxRadioInputComponent, ChipGroupComponent, ClearDefault, ClearDefaultBlock, ClearDefaultFull, ClearDefaultRound, ClearDefaultRoundBlock, ClearDefaultRoundFull, CodeDisplayComponent, CommandDisplayComponent, CommentComponent, CommentInputComponent, CommentSectionComponent, CompanyFooterComponent, ComponentStates, ConfirmationDialogService, ContainerComponent, ContentCardComponent, ContentLoaderComponent, ContentReactionComponent, ContentService, ContentTransformer, CookieBannerComponent, CountdownComponent, CreateOrgModalComponent, CtaCardComponent, CurrencyInputComponent, DEFAULT_ADS_CONFIG, DEFAULT_APP_CONFIG_SERVICE_CONFIG, DEFAULT_APP_VERSION_SERVICE_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_BACK_HEADER, DEFAULT_CANCEL_BUTTON, DEFAULT_CHECK_INTERVAL_MS, DEFAULT_CONFIRM_BUTTON, DEFAULT_COUNTDOWN_LABELS, DEFAULT_COUNTDOWN_LABELS_EN, DEFAULT_DEBUG_CONSOLE_CONFIG, DEFAULT_DONATION_CONFIG, DEFAULT_EMPTY_STATE, DEFAULT_EMULATOR_CONFIG, DEFAULT_FEEDBACK_CONFIG, DEFAULT_FEEDBACK_TYPE_OPTIONS, DEFAULT_HOME_HEADER, DEFAULT_INFINITE_LIST_METADATA, DEFAULT_MODAL_CANCEL_BUTTON, DEFAULT_MODAL_CONFIRM_BUTTON, DEFAULT_PAGE_SIZE_OPTIONS, DEFAULT_PLATFORMS, DEFAULT_REFRESHER_METADATA, DEFAULT_SKELETON_CONFIG, DEFAULT_SPLASH_SCREEN_CONFIG, DataTableComponent, DateInputComponent, DateRangeInputComponent, DebugConsoleComponent, DeleteAccountModalComponent, DetailSkeletonComponent, DeviceService, DisplayComponent, DividerComponent, DocsApiTableComponent, DocsBreadcrumbComponent, DocsBuilder, DocsCalloutComponent, DocsCodeExampleComponent, DocsLayoutComponent, DocsNavLinksComponent, DocsNavigationService, DocsPageComponent, DocsSearchComponent, DocsSectionComponent, DocsShellComponent, DocsSidebarComponent, DocsTocComponent, DonationService, DownloadService, EditOrgModalComponent, EmailInputComponent, EmptyStateComponent, ExpandableTextComponent, FEATURES_LIST_DEFAULTS, FUN_MODAL_DEFAULTS, FabComponent, FaqComponent, FeaturesListComponent, FeedbackFormComponent, FeedbackService, FileInputComponent, FirebaseService, FirestoreCollectionFactory, FirestoreService, FontSizeOption, FontSizeService, FooterComponent, FooterLinksComponent, FormComponent, FormSkeletonComponent, FunHeaderComponent, FunModalComponent, GlassComponent, GlowCardComponent, GlowComponent, GridSkeletonComponent, HANDOFF_ROUTE_PARAM, HANDOFF_TOKEN_PARAM, HandoffService, HasPermissionDirective, HeaderComponent, HintComponent, HorizontalScrollComponent, HourInputComponent, HrefComponent, I18nService, IMAGE_DEFAULTS, INFO_CARD_DEFAULTS, INITIAL_AUTH_STATE, INITIAL_MFA_STATE, INVITATION_CARD_DEFAULTS, Icon, IconComponent, IconService, ImageComponent, ImageCropComponent, ImageService, InAppBrowserService, InfiniteListComponent, InfoCardComponent, InfoComponent, InputI18nHelper, InputType, InvitationCardComponent, InviteMemberModalComponent, ItemListComponent, LANG_STORAGE_KEY$1 as LANG_STORAGE_KEY, LEGAL_CONTENT_CONFIG, LOGIN_DEFAULTS, LandingSplitComponent, LandingStepsComponent, LanguageSelectorComponent, LayeredCardComponent, LegalContentService, LegalLinkService, LinkComponent, LinkProcessorService, LinkedProvidersComponent, LinksAccordionComponent, LinksCakeComponent, ListSkeletonComponent, LoadingDirective, LocalStorageService, LocaleService, LoginAttemptModalComponent, LoginComponent, MEDIA_OBJECT_DEFAULTS, MEMBER_CARD_DEFAULTS, METRIC_CARD_DEFAULTS, MODAL_SIZES, MOTIF_KEYS, MOTION, MaintenancePageComponent, MarkdownArticleParserService, MediaObjectComponent, MemberCardComponent, MemberDetailModalComponent, MenuComponent, MessagingService, MetaService, MetricCardComponent, MfaModalComponent, ModalService, ModalShellComponent, MultiSelectSearchComponent, NUM_KEYS, NavigationService, NetworkBannerComponent, NetworkStatusService, NewsBuilder, NoContentComponent, NotesBoxComponent, NotificationActionService, NotificationsService, NumberFromToComponent, NumberInputComponent, NumberStepperComponent, OAUTH_PROVIDERS_INFO, OAuthCallbackComponent, OAuthService, OrgInfoSheetComponent, OrgService, OrgSwitchService, OrganizationViewComponent, OutlineDefault, OutlineDefaultBlock, OutlineDefaultFull, OutlineDefaultRound, OutlineDefaultRoundBlock, OutlineDefaultRoundFull, PATTERN_MOTIFS, PATTERN_PALETTES, PATTERN_STYLE_CONFIGS, PLATFORM_CONFIGS, PageContentComponent, PageLinksComponent, PageRefreshService, PageTemplateComponent, PageWavesComponent, PageWrapperComponent, PaginationComponent, PaginationService, PasswordInputComponent, PatternComponent, PhoneInputComponent, PillComponent, PinInputComponent, PlainCodeBoxComponent, PopoverSelectorComponent, PreferencesService, PreferencesViewComponent, PresetService, PriceTagComponent, PrimarySolidBlockButton, PrimarySolidBlockHrefButton, PrimarySolidBlockIconButton, PrimarySolidBlockIconHrefButton, PrimarySolidDefaultRoundButton, PrimarySolidDefaultRoundHrefButton, PrimarySolidDefaultRoundIconButton, PrimarySolidDefaultRoundIconHrefButton, PrimarySolidFullButton, PrimarySolidFullHrefButton, PrimarySolidFullIconButton, PrimarySolidFullIconHrefButton, PrimarySolidLargeRoundButton, PrimarySolidLargeRoundHrefButton, PrimarySolidLargeRoundIconButton, PrimarySolidLargeRoundIconHrefButton, PrimarySolidSmallRoundButton, PrimarySolidSmallRoundHrefButton, PrimarySolidSmallRoundIconButton, PrimarySolidSmallRoundIconHrefButton, ProcessLinksPipe, ProfileSkeletonComponent, ProfileViewComponent, ProgressBarComponent, ProgressRingComponent, ProgressStatusComponent, PrompterComponent, QR_PRESETS, QrCodeComponent, QrGeneratorService, QueryBuilder, QuoteBoxComponent, REQUEST_STATUSES, RadioInputComponent, RangeInputComponent, RatingComponent, RefresherComponent, RequestFirestoreService, RequestFormBuilderService, RequestService, RightsFooterComponent, RotatingTextComponent, SEARCH_HEADER_DEFAULTS, SETTINGS_SECTIONS_CATALOG, SHAPE_KEYS, SHARE_PROFILE_MODAL_DEFAULTS, SKELETON_LAYOUT_DEFAULT_ROWS, SKELETON_PRESETS, SOLID_KEYS, STATS_BAR_DEFAULTS, STROKE_KEYS, SearchHeaderComponent, SearchSelectorComponent, SearchbarComponent, SecondarySolidBlockButton, SecondarySolidBlockHrefButton, SecondarySolidBlockIconButton, SecondarySolidBlockIconHrefButton, SecondarySolidDefaultRoundButton, SecondarySolidDefaultRoundHrefButton, SecondarySolidDefaultRoundIconButton, SecondarySolidDefaultRoundIconHrefButton, SecondarySolidFullButton, SecondarySolidFullHrefButton, SecondarySolidFullIconButton, SecondarySolidFullIconHrefButton, SecondarySolidLargeRoundButton, SecondarySolidLargeRoundHrefButton, SecondarySolidLargeRoundIconButton, SecondarySolidLargeRoundIconHrefButton, SecondarySolidSmallRoundButton, SecondarySolidSmallRoundHrefButton, SecondarySolidSmallRoundIconButton, SecondarySolidSmallRoundIconHrefButton, SecurityViewComponent, SegmentControlComponent, SelectSearchComponent, SessionListModalComponent, SessionService, SettingsHubComponent, ShareButtonsComponent, ShareProfileModalComponent, SimpleComponent, SkeletonComponent, SkeletonLayoutComponent, SkeletonService, SolidBlockButton, SolidDefault, SolidDefaultBlock, SolidDefaultButton, SolidDefaultFull, SolidDefaultRound, SolidDefaultRoundBlock, SolidDefaultRoundButton, SolidDefaultRoundFull, SolidFullButton, SolidLargeButton, SolidLargeRoundButton, SolidSmallButton, SolidSmallRoundButton, SplashScreenService, StatsBarComponent, StatsCardComponent, StepperComponent, StorageService, SwipeCarouselComponent, SwitchOrgModalComponent, TRI_KEYS, TabbedContentComponent, TableSkeletonComponent, TabsComponent, Terminal404Component, TestimonialCardComponent, TestimonialCarouselComponent, TextComponent, TextInputComponent, TextareaInputComponent, ThemeOption, ThemeService, TimelineComponent, TitleBlockComponent, TitleComponent, ToastService, ToggleInputComponent, TokenService, ToolbarActionType, ToolbarComponent, TransferOwnershipModalComponent, TranslatePipe, TypedCollection, UPDATE_BANNER_DEFAULT_CONTENT, UPDATE_BANNER_I18N_NAMESPACE, UpdateBannerComponent, UserAvatarComponent, UsernameInputComponent, VALTECH_ADS_CONFIG, VALTECH_APP_CONFIG, VALTECH_APP_VERSION, VALTECH_AUTH_CONFIG, VALTECH_COMPANY_LINKS, VALTECH_CONTENT_CONFIG, VALTECH_DEBUG_CONSOLE, VALTECH_DEFAULT_CONTENT, VALTECH_DONATION_CONFIG, VALTECH_FEEDBACK_CONFIG, VALTECH_FIREBASE_CONFIG, VALTECH_FOOTER_I18N, VALTECH_FOOTER_LOGO, VALTECH_LANGUAGE_SELECTOR, VALTECH_LEGAL_CONFIG, VALTECH_NETWORK_ERROR_KEY, VALTECH_SITE_PATHS, VALTECH_SOCIAL_LINKS, VALTECH_SPLASH_SCREEN, VALTECH_WEB_BASE_URLS, VERSION, ValtechErrorService, WizardComponent, WizardFooterComponent, applyDefaultValueToControl, authGuard, authInterceptor, authPasswordValidator, beautifyLegalArticle, blogPost, buildCompanyFooterProps, buildFooterLinks, buildLegalLinkResolver, buildPath, buildSettingsCards, collections, connectPageRefresh, createErrorStateProps, createFirebaseConfig, createGlowCardProps, createInitialPaginationState, createNumberFromToField, createRefreshableStream, createTitleProps, docs, errorLoggingInterceptor, extractPathParams, generatePatternTiles, generateRandomTile, getAppInfo, getAppVersion, getCollectionPath, getDocumentId, getTimeOfDayKey, goToTop, guestGuard, hasEmulators, interpretError, isAtEnd, isCollectionPath, isDocumentPath, isEmulatorMode, isValidPath, joinPath, maxLength, mulberry32, news, parseMarkdownArticle, permissionGuard, permissionGuardFromRoute, provideLegalContent, provideSplashScreen, provideValtechAccountRoutes, provideValtechAds, provideValtechAppConfig, provideValtechAppVersion, provideValtechAuth, provideValtechAuthInterceptor, provideValtechContent, provideValtechDebugConsole, provideValtechDonations, provideValtechErrorHandling, provideValtechFeedback, provideValtechFirebase, provideValtechI18n, provideValtechLegal, provideValtechOrganizationRoutes, provideValtechPreferencesRoutes, provideValtechPresets, provideValtechProfileRoutes, provideValtechSecurityRoutes, provideValtechSettingsRoutes, provideValtechSite, provideValtechSkeleton, query, renderPatternSvgInner, replaceSpecialChars, resolveColor$1 as resolveColor, resolveInputDefaultValue, resolveWebBaseUrl, roleGuard, storagePaths, superAdminGuard, toArticle };
 //# sourceMappingURL=valtech-components.mjs.map