valtech-components 4.0.179 → 4.0.181

package/fesm2022/valtech-components.mjs

@@ -56,7 +56,7 @@ import { BrowserMultiFormatReader } from '@zxing/browser';
  * Current version of valtech-components.
  * This is automatically updated during the publish process.
  */
-const VERSION = '4.0.179';
+const VERSION = '4.0.181';
 
 // Control de estado de refresco (singleton a nivel de módulo)
 let isRefreshing = false;
@@ -6587,145 +6587,21 @@ class OAuthService {
             this.clearLocalStorageFallback();
             const nonce = this.generateNonce();
             this.expectedNonce = nonce;
-            // popup=true sobrevive el bounce cross-origin (Google/MS borran window.name
-            // por privacidad). El backend lo reenvía en el redirect final vía appendParams.
-            const redirectUri = `${window.location.origin}/auth/oauth/callback?popup=true`;
+            // Flujo REDIRECT (sin popup). El popup quedaba COLGADO bajo COOP: Google
+            // setea Cross-Origin-Opener-Policy → window.opener queda severado (el
+            // postMessage del popup no llega), BroadcastChannel/localStorage no siempre
+            // entregan, y popup.closed queda bloqueado ("COOP policy would block the
+            // window.closed call") → ni siquiera dispara el cancel: la ventana principal
+            // espera para siempre sin redirigir. Navegamos la VENTANA COMPLETA al /start;
+            // al volver, OAuthCallbackComponent corre como ventana principal (redirect_uri
+            // SIN popup=true) y completa la sesión vía completeInMainWindow → navega al
+            // home. Sin popup = sin COOP = sin cuelgue. (El link-flow sigue por popup.)
+            const redirectUri = `${window.location.origin}/auth/oauth/callback`;
             const startUrl = `${this.config?.apiUrl}/v2/auth/oauth/${provider}/start?redirect_uri=${encodeURIComponent(redirectUri)}&client_nonce=${encodeURIComponent(nonce)}`;
-            // Abrir popup centrado
-            const width = 500;
-            const height = 600;
-            const left = window.screenX + (window.outerWidth - width) / 2;
-            const top = window.screenY + (window.outerHeight - height) / 2;
-            const features = `width=${width},height=${height},left=${left},top=${top},popup=yes`;
-            this.popup = window.open(startUrl, 'oauth', features);
-            if (!this.popup) {
-                observer.error({
-                    code: 'POPUP_BLOCKED',
-                    message: 'El navegador bloqueó la ventana emergente. Por favor, permite popups para este sitio.',
-                });
-                return () => { };
-            }
-            // Escuchar mensajes del popup
-            this.messageHandler = (event) => {
-                // Validar origen
-                if (event.origin !== window.location.origin) {
-                    return;
-                }
-                // Validar tipo de mensaje
-                const data = event.data;
-                if (data?.type !== 'oauth-callback') {
-                    return;
-                }
-                // Verificar el nonce del flujo (M-07): si no coincide, no es nuestro
-                // callback → ignorar (no consumir el observable).
-                if (!this.isNonceValid(data)) {
-                    return;
-                }
-                // Limpiar
-                this.cleanup();
-                // Emitir resultado dentro de NgZone para trigger change detection
-                this.ngZone.run(() => {
-                    if (data.error) {
-                        observer.error(data.error);
-                    }
-                    else if (data.tokens) {
-                        observer.next(data.tokens);
-                        observer.complete();
-                    }
-                    else {
-                        observer.error({
-                            code: 'INVALID_RESPONSE',
-                            message: 'Respuesta inválida del servidor de autenticación',
-                        });
-                    }
-                });
-            };
-            window.addEventListener('message', this.messageHandler);
-            // BroadcastChannel: canal adicional immune a COOP (funciona entre misma
-            // origin sin importar el browsing context group). Es el canal más fiable
-            // cuando COOP sever el link opener→popup al pasar por Google/MS.
-            try {
-                this.broadcastChannel = new BroadcastChannel('valtech-oauth-callback');
-                this.broadcastChannel.onmessage = (event) => {
-                    const data = event.data;
-                    if (data?.type !== 'oauth-callback')
-                        return;
-                    if (!this.isNonceValid(data))
-                        return;
-                    this.clearLocalStorageFallback();
-                    this.cleanup();
-                    this.ngZone.run(() => {
-                        if (data.error) {
-                            observer.error(data.error);
-                        }
-                        else if (data.tokens) {
-                            observer.next(data.tokens);
-                            observer.complete();
-                        }
-                        else {
-                            observer.error({
-                                code: 'INVALID_RESPONSE',
-                                message: 'Respuesta inválida del servidor de autenticación',
-                            });
-                        }
-                    });
-                };
-            }
-            catch {
-                // BroadcastChannel no disponible (contextos muy restringidos) — ignorar
-            }
-            // Polling de localStorage (COOP workaround - no podemos detectar popup.closed)
-            // También verifica si el popup se cerró manualmente
-            this.checkClosedInterval = setInterval(() => {
-                // Primero verificar localStorage (funciona aunque COOP bloquee todo)
-                const storedData = this.checkLocalStorageFallback();
-                if (storedData) {
-                    this.cleanup();
-                    this.ngZone.run(() => {
-                        if (storedData.error) {
-                            observer.error(storedData.error);
-                        }
-                        else if (storedData.tokens) {
-                            // Gate de diagnóstico: la metadata de tokens (keys, presencia y
-                            // longitud del firebaseToken) no debe filtrarse a la consola en
-                            // producción (L4 del audit). Solo en dev.
-                            if (isDevMode()) {
-                                console.log('[OAuthService] Retrieved tokens from localStorage fallback', {
-                                    keys: Object.keys(storedData.tokens),
-                                    hasFirebaseToken: !!storedData.tokens.firebaseToken,
-                                    firebaseTokenLength: storedData.tokens.firebaseToken?.length ?? 0,
-                                });
-                            }
-                            observer.next(storedData.tokens);
-                            observer.complete();
-                        }
-                        else {
-                            observer.error({
-                                code: 'INVALID_RESPONSE',
-                                message: 'Respuesta inválida del servidor de autenticación',
-                            });
-                        }
-                    });
-                    return;
-                }
-                // Intentar verificar si popup se cerró (puede fallar por COOP)
-                try {
-                    if (this.popup?.closed) {
-                        this.cleanup();
-                        this.ngZone.run(() => {
-                            observer.error({
-                                code: 'POPUP_CLOSED',
-                                message: 'Se cerró la ventana de autenticación',
-                            });
-                        });
-                    }
-                }
-                catch {
-                    // COOP bloquea acceso a popup.closed - ignorar y seguir con polling
-                }
-            }, 300);
-            // Cleanup cuando el observable se destruye
-            return () => this.cleanup();
+            window.location.assign(startUrl);
+            // La página se descarga acá; el observable no emite (la finalización ocurre
+            // en el callback, ya como ventana principal). Sin listeners ni polling.
+            return () => { };
         });
     }
     /**
@@ -28487,7 +28363,7 @@ class UpdateBannerComponent {
         </div>
       </div>
     }
-  `, isInline: true, styles: ["@charset \"UTF-8\";:host{display:contents}.val-update-banner{position:fixed;top:0;left:0;right:0;z-index:1100;display:flex;justify-content:center;padding:calc(12px + env(safe-area-inset-top,0px)) 16px 12px;pointer-events:none}.val-update-banner__backdrop{position:fixed;inset:0;z-index:-1;background:#0000008c;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);pointer-events:auto}.val-update-banner__panel{pointer-events:auto;display:flex;flex-direction:row;align-items:center;gap:12px;width:100%;max-width:640px;padding:12px 16px;background:var(--ion-background-color, #fff);border:1px solid var(--val-border-color, rgba(0, 0, 0, .08));border-radius:var(--val-border-radius, 12px);box-shadow:0 4px 24px #0000001f;animation:val-update-banner-in .25s ease-out}.val-update-banner--required{align-items:center;height:100%}.val-update-banner--required .val-update-banner__panel{flex-direction:column;text-align:center;max-width:420px}.val-update-banner__icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:color-mix(in srgb,var(--ion-color-primary) 14%,transparent);font-size:22px}.val-update-banner__icon val-icon{display:flex;line-height:0}.val-update-banner__icon ::ng-deep ion-icon{display:block}.val-update-banner--required .val-update-banner__icon{background:color-mix(in srgb,var(--ion-color-warning) 16%,transparent)}.val-update-banner__body{flex:1 1 auto;display:flex;flex-direction:column;gap:2px;min-width:0}.val-update-banner__actions{flex:0 0 auto;display:flex;flex-direction:row;align-items:center;gap:4px}.val-update-banner--required .val-update-banner__actions{margin-top:8px}@keyframes val-update-banner-in{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 540px){.val-update-banner__panel{flex-direction:column;text-align:center}.val-update-banner__actions{width:100%;justify-content:center}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: TextComponent, selector: "val-text", inputs: ["props"] }, { kind: "component", type: ButtonComponent, selector: "val-button", inputs: ["preset", "props"], outputs: ["onClick"] }, { kind: "component", type: IconComponent, selector: "val-icon", inputs: ["props"] }] }); }
+  `, isInline: true, styles: ["@charset \"UTF-8\";:host{display:contents}.val-update-banner{position:fixed;top:0;left:0;right:0;z-index:1100;display:flex;justify-content:center;padding:calc(12px + env(safe-area-inset-top,0px)) 16px 12px;pointer-events:none}.val-update-banner__backdrop{position:fixed;inset:0;z-index:-1;background:#0000008c;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);pointer-events:auto}.val-update-banner__panel{pointer-events:auto;display:flex;flex-direction:row;align-items:center;gap:12px;width:100%;max-width:640px;padding:12px 16px;background:var(--ion-background-color, #fff);border:1px solid var(--val-border-color, rgba(0, 0, 0, .08));border-radius:var(--val-border-radius, 12px);box-shadow:0 4px 24px #0000001f;animation:val-update-banner-in .25s ease-out}.val-update-banner--required{align-items:center;height:100%}.val-update-banner--required .val-update-banner__panel{flex-direction:column;text-align:center;max-width:420px}.val-update-banner__icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:color-mix(in srgb,var(--ion-color-primary) 14%,transparent);font-size:22px}.val-update-banner__icon val-icon{display:flex;line-height:0}.val-update-banner__icon ::ng-deep ion-icon{display:block}.val-update-banner--required .val-update-banner__icon{background:color-mix(in srgb,var(--ion-color-warning) 16%,transparent)}.val-update-banner__body{flex:1 1 auto;display:flex;flex-direction:column;gap:2px;min-width:0}.val-update-banner__actions{flex:0 0 auto;display:flex;flex-direction:row;align-items:center;gap:4px}.val-update-banner__actions val-button:first-child ::ng-deep ion-button{min-width:100px}.val-update-banner--required .val-update-banner__actions{margin-top:8px}@keyframes val-update-banner-in{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 540px){.val-update-banner__panel{flex-direction:column;text-align:center}.val-update-banner__actions{width:100%;justify-content:center}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: TextComponent, selector: "val-text", inputs: ["props"] }, { kind: "component", type: ButtonComponent, selector: "val-button", inputs: ["preset", "props"], outputs: ["onClick"] }, { kind: "component", type: IconComponent, selector: "val-icon", inputs: ["props"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: UpdateBannerComponent, decorators: [{
             type: Component,
@@ -28562,7 +28438,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
         </div>
       </div>
     }
-  `, styles: ["@charset \"UTF-8\";:host{display:contents}.val-update-banner{position:fixed;top:0;left:0;right:0;z-index:1100;display:flex;justify-content:center;padding:calc(12px + env(safe-area-inset-top,0px)) 16px 12px;pointer-events:none}.val-update-banner__backdrop{position:fixed;inset:0;z-index:-1;background:#0000008c;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);pointer-events:auto}.val-update-banner__panel{pointer-events:auto;display:flex;flex-direction:row;align-items:center;gap:12px;width:100%;max-width:640px;padding:12px 16px;background:var(--ion-background-color, #fff);border:1px solid var(--val-border-color, rgba(0, 0, 0, .08));border-radius:var(--val-border-radius, 12px);box-shadow:0 4px 24px #0000001f;animation:val-update-banner-in .25s ease-out}.val-update-banner--required{align-items:center;height:100%}.val-update-banner--required .val-update-banner__panel{flex-direction:column;text-align:center;max-width:420px}.val-update-banner__icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:color-mix(in srgb,var(--ion-color-primary) 14%,transparent);font-size:22px}.val-update-banner__icon val-icon{display:flex;line-height:0}.val-update-banner__icon ::ng-deep ion-icon{display:block}.val-update-banner--required .val-update-banner__icon{background:color-mix(in srgb,var(--ion-color-warning) 16%,transparent)}.val-update-banner__body{flex:1 1 auto;display:flex;flex-direction:column;gap:2px;min-width:0}.val-update-banner__actions{flex:0 0 auto;display:flex;flex-direction:row;align-items:center;gap:4px}.val-update-banner--required .val-update-banner__actions{margin-top:8px}@keyframes val-update-banner-in{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 540px){.val-update-banner__panel{flex-direction:column;text-align:center}.val-update-banner__actions{width:100%;justify-content:center}}\n"] }]
+  `, styles: ["@charset \"UTF-8\";:host{display:contents}.val-update-banner{position:fixed;top:0;left:0;right:0;z-index:1100;display:flex;justify-content:center;padding:calc(12px + env(safe-area-inset-top,0px)) 16px 12px;pointer-events:none}.val-update-banner__backdrop{position:fixed;inset:0;z-index:-1;background:#0000008c;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);pointer-events:auto}.val-update-banner__panel{pointer-events:auto;display:flex;flex-direction:row;align-items:center;gap:12px;width:100%;max-width:640px;padding:12px 16px;background:var(--ion-background-color, #fff);border:1px solid var(--val-border-color, rgba(0, 0, 0, .08));border-radius:var(--val-border-radius, 12px);box-shadow:0 4px 24px #0000001f;animation:val-update-banner-in .25s ease-out}.val-update-banner--required{align-items:center;height:100%}.val-update-banner--required .val-update-banner__panel{flex-direction:column;text-align:center;max-width:420px}.val-update-banner__icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:color-mix(in srgb,var(--ion-color-primary) 14%,transparent);font-size:22px}.val-update-banner__icon val-icon{display:flex;line-height:0}.val-update-banner__icon ::ng-deep ion-icon{display:block}.val-update-banner--required .val-update-banner__icon{background:color-mix(in srgb,var(--ion-color-warning) 16%,transparent)}.val-update-banner__body{flex:1 1 auto;display:flex;flex-direction:column;gap:2px;min-width:0}.val-update-banner__actions{flex:0 0 auto;display:flex;flex-direction:row;align-items:center;gap:4px}.val-update-banner__actions val-button:first-child ::ng-deep ion-button{min-width:100px}.val-update-banner--required .val-update-banner__actions{margin-top:8px}@keyframes val-update-banner-in{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 540px){.val-update-banner__panel{flex-direction:column;text-align:center}.val-update-banner__actions{width:100%;justify-content:center}}\n"] }]
         }], ctorParameters: () => [] });
 
 /**
@@ -54370,7 +54246,7 @@ const ORGANIZATION_VIEW_I18N = {
     },
 };
 
-addIcons({ warningOutline });
+addIcons({ warningOutline, swapHorizontalOutline });
 const DEFAULT_NAMESPACE$6 = 'Settings.Organization';
 const DEFAULT_VIEW_PERMISSIONS_ROUTE = '/app/settings/permissions';
 const DEFAULT_API_KEYS_ROUTE = '/app/settings/api-keys';
@@ -54524,9 +54400,10 @@ class OrganizationViewComponent {
             return this.tt('planFree');
         });
         this.switchOrgSectionProps = computed(() => ({
-            title: this.tt('activeOrgTitle'),
+            title: this.pageTitle(),
             action: {
                 text: this.tt('switchOrgCta'),
+                icon: { name: 'swap-horizontal-outline', slot: 'start' },
                 color: 'dark',
                 fill: 'outline',
                 size: 'small',
@@ -54535,6 +54412,7 @@ class OrganizationViewComponent {
                 token: 'org-switch',
                 state: ComponentStates.ENABLED,
             },
+            infoLink: { label: this.tt('orgsMoreInfo'), token: 'org-more-info' },
         }));
         this.editButtonProps = computed(() => ({
             text: this.tt('editCta'),
@@ -54778,6 +54656,12 @@ class OrganizationViewComponent {
         this.nav.navigateByUrl(this.resolvedConfig().apiKeysRoute);
     }
     // "Más información" sobre organizaciones — mismo sheet explicativo que muestra
+    onHeaderAction(token) {
+        if (token === 'org-switch')
+            this.onSwitchOrg();
+        else if (token === 'org-more-info')
+            this.onOrgInfo();
+    }
     // account-view sin org, pero disponible siempre (todo user tiene org por defecto).
     onSwitchOrg() {
         void this.modalService.open({
@@ -55044,17 +54928,7 @@ class OrganizationViewComponent {
     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(),
-          }"
-        />
-        <!-- Sección "Organización activa" con botón Cambiar a la derecha. -->
-        <val-section-header [props]="switchOrgSectionProps()" (actionClick)="onSwitchOrg()" />
+        <val-section-header [props]="switchOrgSectionProps()" (actionClick)="onHeaderAction($event)" />
       </header>
 
       @if (resolvedConfig().showInfo) {
@@ -55356,7 +55230,7 @@ class OrganizationViewComponent {
         (created)="onOrgCreated($event)"
       />
     </div>
-  `, isInline: true, styles: [".page{padding:16px 0;max-width:720px;margin:0 auto}.org-more-info-link{background:none;border:none;padding:4px 0;margin-top:4px;font-size:13px;font-weight:600;color:var(--ion-color-primary, #7026df);cursor:pointer;text-align:left}.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;flex-direction:column;gap:16px}.invite-cta__text{display:flex;flex-direction:column;gap:4px}.invite-cta__actions{display:flex;gap:12px;flex-wrap:wrap}.org-info-card{border-radius:14px;background:var(--ion-color-light, #f4f5f8);overflow:hidden}.org-info-logo{display:flex;justify-content:center;padding:8px 0 16px}.org-logo-img{width:80px;height:80px;border-radius:50%;object-fit:cover;border:2px solid var(--ion-color-light)}: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:last-child{border-bottom:none}.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)}.section-title-danger{display:flex;align-items:center;gap:8px;margin-bottom:12px}.section-title-danger val-title{display:block;margin:0}.danger-icon{display:block;font-size:1.125rem;color:var(--ion-color-warning-shade, #d4a017);flex-shrink:0}\n"], dependencies: [{ kind: "component", type: CreateOrgModalComponent, selector: "val-create-org-modal", inputs: ["i18nNamespace", "isOpen"], outputs: ["dismissed", "created"] }, { kind: "component", type: CtaCardComponent, selector: "val-cta-card", inputs: ["props"], outputs: ["onAction"] }, { 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: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { 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"] }, { kind: "component", type: PermissionsModalComponent, selector: "val-permissions-modal", inputs: ["isOpen", "config"], outputs: ["dismissed"] }, { kind: "component", type: SectionHeaderComponent, selector: "val-section-header", inputs: ["props"], outputs: ["actionClick"] }] }); }
+  `, isInline: true, styles: [".page{padding:16px 0;max-width:720px;margin:0 auto}.org-more-info-link{background:none;border:none;padding:4px 0;margin-top:4px;font-size:13px;font-weight:600;color:var(--ion-color-primary, #7026df);cursor:pointer;text-align:left}.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;flex-direction:column;gap:16px}.invite-cta__text{display:flex;flex-direction:column;gap:4px}.invite-cta__actions{display:flex;gap:12px;flex-wrap:wrap}.org-info-card{border-radius:14px;background:var(--ion-color-light, #f4f5f8);overflow:hidden}.org-info-logo{display:flex;justify-content:center;padding:8px 0 16px}.org-logo-img{width:80px;height:80px;border-radius:50%;object-fit:cover;border:2px solid var(--ion-color-light)}: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:last-child{border-bottom:none}.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)}.section-title-danger{display:flex;align-items:center;gap:8px;margin-bottom:12px}.section-title-danger val-title{display:block;margin:0}.danger-icon{display:block;font-size:1.125rem;color:var(--ion-color-warning-shade, #d4a017);flex-shrink:0}\n"], dependencies: [{ kind: "component", type: CreateOrgModalComponent, selector: "val-create-org-modal", inputs: ["i18nNamespace", "isOpen"], outputs: ["dismissed", "created"] }, { kind: "component", type: CtaCardComponent, selector: "val-cta-card", inputs: ["props"], outputs: ["onAction"] }, { kind: "component", type: EmptyStateComponent, selector: "val-empty-state", inputs: ["props"] }, { kind: "directive", type: HasPermissionDirective, selector: "[valHasPermission]", inputs: ["valHasPermission"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { 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"] }, { kind: "component", type: PermissionsModalComponent, selector: "val-permissions-modal", inputs: ["isOpen", "config"], outputs: ["dismissed"] }, { kind: "component", type: SectionHeaderComponent, selector: "val-section-header", inputs: ["props"], outputs: ["actionClick"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: OrganizationViewComponent, decorators: [{
             type: Component,
@@ -55381,17 +55255,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                     ], 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(),
-          }"
-        />
-        <!-- Sección "Organización activa" con botón Cambiar a la derecha. -->
-        <val-section-header [props]="switchOrgSectionProps()" (actionClick)="onSwitchOrg()" />
+        <val-section-header [props]="switchOrgSectionProps()" (actionClick)="onHeaderAction($event)" />
       </header>
 
       @if (resolvedConfig().showInfo) {