valtech-components 4.0.177 → 4.0.179

package/esm2022/lib/version.mjs

@@ -2,5 +2,5 @@
  * Current version of valtech-components.
  * This is automatically updated during the publish process.
  */
-export const VERSION = '4.0.177';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmVyc2lvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9saWIvdmVyc2lvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7O0dBR0c7QUFDSCxNQUFNLENBQUMsTUFBTSxPQUFPLEdBQUcsU0FBUyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDdXJyZW50IHZlcnNpb24gb2YgdmFsdGVjaC1jb21wb25lbnRzLlxuICogVGhpcyBpcyBhdXRvbWF0aWNhbGx5IHVwZGF0ZWQgZHVyaW5nIHRoZSBwdWJsaXNoIHByb2Nlc3MuXG4gKi9cbmV4cG9ydCBjb25zdCBWRVJTSU9OID0gJzQuMC4xNzcnO1xuIl19
+export const VERSION = '4.0.179';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmVyc2lvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9saWIvdmVyc2lvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7O0dBR0c7QUFDSCxNQUFNLENBQUMsTUFBTSxPQUFPLEdBQUcsU0FBUyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDdXJyZW50IHZlcnNpb24gb2YgdmFsdGVjaC1jb21wb25lbnRzLlxuICogVGhpcyBpcyBhdXRvbWF0aWNhbGx5IHVwZGF0ZWQgZHVyaW5nIHRoZSBwdWJsaXNoIHByb2Nlc3MuXG4gKi9cbmV4cG9ydCBjb25zdCBWRVJTSU9OID0gJzQuMC4xNzknO1xuIl19

package/fesm2022/valtech-components.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { inject, InjectionToken, makeEnvironmentProviders, APP_INITIALIZER, ErrorHandler, Injectable, DestroyRef, Inject, signal, computed, PLATFORM_ID, isDevMode, Optional, runInInjectionContext, effect, Pipe, TemplateRef, ViewContainerRef, input, Directive, EventEmitter, Component, Input, Output, ChangeDetectionStrategy, HostBinding, HostListener, SecurityContext, NgZone, ViewChild, ElementRef, ChangeDetectorRef, output, ContentChild, model, ViewEncapsulation, untracked, viewChild, Injector, isSignal } from '@angular/core';
-import { BehaviorSubject, throwError, Subject, map, distinctUntilChanged, filter as filter$1, take as take$1, firstValueFrom, of, from, EMPTY, Observable, interval, debounceTime, switchMap as switchMap$1, catchError as catchError$1, takeUntil, isObservable, forkJoin, race, timer, shareReplay } from 'rxjs';
-import { catchError, switchMap, finalize, filter, take, timeout, map as map$1, tap, distinctUntilChanged as distinctUntilChanged$1, retry, debounceTime as debounceTime$1, takeUntil as takeUntil$1 } from 'rxjs/operators';
+import { BehaviorSubject, throwError, Subject, map, distinctUntilChanged, filter as filter$1, take as take$1, firstValueFrom, of, from, EMPTY, Observable, interval, debounceTime, switchMap as switchMap$1, catchError as catchError$1, takeUntil, isObservable, forkJoin, race, timer, shareReplay as shareReplay$1 } from 'rxjs';
+import { catchError, switchMap, finalize, filter, take, timeout, map as map$1, tap, shareReplay, distinctUntilChanged as distinctUntilChanged$1, retry, debounceTime as debounceTime$1, takeUntil as takeUntil$1 } from 'rxjs/operators';
 import * as i1$3 from '@angular/common/http';
 import { provideHttpClient, withInterceptors, HttpClient, HttpErrorResponse } from '@angular/common/http';
 import * as i1$1 from '@angular/fire/firestore';
@@ -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.177';
+const VERSION = '4.0.179';
 
 // Control de estado de refresco (singleton a nivel de módulo)
 let isRefreshing = false;
@@ -8352,6 +8352,13 @@ class AuthService {
         this.refreshTimerId = null;
         this.syncSubscription = null;
         this.firestoreRBACUnsubscribe = null;
+        // Single-flight refresh: un solo POST /refresh en vuelo a la vez. Todos los
+        // callers (bootstrap, reestablecer Firebase, interceptor 401, timer proactivo)
+        // comparten el MISMO observable. Sin esto, refreshes concurrentes chocan contra
+        // la rotación de refresh token del backend: el primero rota el token y el
+        // segundo llega con el token ya invalidado → 401 → logout espurio (el usuario
+        // cae a la landing al actualizar). Ver project_pwa-login-freeze.
+        this.inFlightRefresh$ = null;
         // =============================================
         // ESTADO PÚBLICO (Signals readonly)
         // =============================================
@@ -8762,13 +8769,20 @@ class AuthService {
      * que el cliente debe guardar para el próximo refresh.
      */
     refreshAccessToken() {
+        // Single-flight: si ya hay un /refresh en vuelo, devolvemos el MISMO
+        // observable (multicast vía shareReplay). Evita la carrera contra la rotación
+        // de refresh token del backend, que producía 401 espurios → logout al
+        // actualizar. Ver inFlightRefresh$ y project_pwa-login-freeze.
+        if (this.inFlightRefresh$) {
+            return this.inFlightRefresh$;
+        }
         // H-05 same-site-aware: en same-site (prod) el refresh va SOLO por la cookie
         // HttpOnly (body vacío), no se persiste en localStorage → un XSS no lo roba.
         // En cross-site (dev) la cookie de terceros se bloquea (Safari ITP / Chrome
         // 3rd-party phase-out) → se manda en el body + se persiste (fallback).
         // withCredentials adjunta la cookie cuando el browser la permite.
         const body = this.storageService.cookieOnly ? {} : { refreshToken: this.state().refreshToken };
-        return this.http
+        this.inFlightRefresh$ = this.http
             .post(`${this.baseUrl}/refresh`, body, { withCredentials: true })
             .pipe(
         // Nunca dejar el refresh colgado: si la red/Lambda no responde a tiempo,
@@ -8798,7 +8812,17 @@ class AuthService {
             // initialize() only clears state (no redirect). Auto-navigating to
             // /login from this method redirects even users on public routes.
             return throwError(() => error);
-        }));
+        }), 
+        // Liberar el slot al terminar (éxito, error o timeout) para que el
+        // próximo refresh real arranque uno nuevo.
+        finalize(() => {
+            this.inFlightRefresh$ = null;
+        }), 
+        // Multicast: los side-effects del tap corren UNA vez y todos los callers
+        // concurrentes reciben la misma respuesta/error. refCount:false → que un
+        // caller se desuscribe temprano NO cancela la rotación de token en vuelo.
+        shareReplay({ bufferSize: 1, refCount: false }));
+        return this.inFlightRefresh$;
     }
     /**
      * Maneja autenticación exitosa desde fuentes externas (OAuth, etc).
@@ -28351,6 +28375,13 @@ class UpdateBannerComponent {
                 dismissAction: this.tr('dismissAction'),
             };
         });
+        /**
+         * Feedback visual mientras se aplica el update. El botón pasa a estado
+         * WORKING (spinner) y se bloquean nuevos taps. `applyUpdate()` siempre
+         * recarga la página al terminar (try/finally), así que NO reseteamos este
+         * flag: queda en true hasta que el reload reemplaza la app.
+         */
+        this.applying = signal(false);
         if (!this.i18n.hasNamespace(UPDATE_BANNER_I18N_NAMESPACE)) {
             this.i18n.registerContent(UPDATE_BANNER_I18N_NAMESPACE, {
                 es: UPDATE_BANNER_DEFAULT_CONTENT.es,
@@ -28360,6 +28391,11 @@ class UpdateBannerComponent {
     }
     /** Aplica la actualización (activa el SW si existe + recarga). */
     onUpdate() {
+        // Anti multi-tap: el botón WORKING no queda `disabled` a nivel DOM, así que
+        // sin este guard un usuario impaciente dispararía applyUpdate() N veces.
+        if (this.applying())
+            return;
+        this.applying.set(true);
         void this.version.applyUpdate();
     }
     /** Descarta el banner opcional. No-op en modo obligatorio. */
@@ -28429,7 +28465,7 @@ class UpdateBannerComponent {
                 color: 'primary',
                 fill: 'solid',
                 size: 'small',
-                state: 'ENABLED',
+                state: applying() ? 'WORKING' : 'ENABLED',
                 type: 'button',
               }"
               (onClick)="onUpdate()"
@@ -28441,7 +28477,7 @@ class UpdateBannerComponent {
                   color: 'dark',
                   fill: 'clear',
                   size: 'small',
-                  state: 'ENABLED',
+                  state: applying() ? 'DISABLED' : 'ENABLED',
                   type: 'button',
                 }"
                 (onClick)="onDismiss()"
@@ -28504,7 +28540,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                 color: 'primary',
                 fill: 'solid',
                 size: 'small',
-                state: 'ENABLED',
+                state: applying() ? 'WORKING' : 'ENABLED',
                 type: 'button',
               }"
               (onClick)="onUpdate()"
@@ -28516,7 +28552,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                   color: 'dark',
                   fill: 'clear',
                   size: 'small',
-                  state: 'ENABLED',
+                  state: applying() ? 'DISABLED' : 'ENABLED',
                   type: 'button',
                 }"
                 (onClick)="onDismiss()"
@@ -35347,7 +35383,7 @@ class HtmlViewerModalComponent {
     <ion-content>
       <iframe [srcdoc]="safeHtml" style="width: 100%; height: 100%; border: none;" title="Visor de documento"></iframe>
     </ion-content>
-  `, isInline: true, styles: [":host{display:flex;flex-direction:column}ion-content{--padding-bottom: 0;--padding-top: 0}iframe{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: 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: IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }] }); }
+  `, isInline: true, styles: [":host{display:flex;flex-direction:column}ion-content{--padding-top: 12px;--padding-bottom: 12px;--padding-start: 12px;--padding-end: 12px;--background: var(--ion-color-light, #f4f5f8)}iframe{display:block;border-radius:8px;background:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: 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: IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: HtmlViewerModalComponent, decorators: [{
             type: Component,
@@ -35370,7 +35406,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
     <ion-content>
       <iframe [srcdoc]="safeHtml" style="width: 100%; height: 100%; border: none;" title="Visor de documento"></iframe>
     </ion-content>
-  `, styles: [":host{display:flex;flex-direction:column}ion-content{--padding-bottom: 0;--padding-top: 0}iframe{display:block}\n"] }]
+  `, styles: [":host{display:flex;flex-direction:column}ion-content{--padding-top: 12px;--padding-bottom: 12px;--padding-start: 12px;--padding-end: 12px;--background: var(--ion-color-light, #f4f5f8)}iframe{display:block;border-radius:8px;background:#fff}\n"] }]
         }], propDecorators: { html: [{
                 type: Input
             }], title: [{
@@ -54194,7 +54230,8 @@ const ORGANIZATION_VIEW_I18N = {
         apiKeysFeaturePermsDesc: 'Cada key lleva solo los permisos que tú le asignes — concede el mínimo.',
         apiKeysFeatureSecretTitle: 'Secreto único',
         apiKeysFeatureSecretDesc: 'El secreto se muestra una sola vez. Guárdalo en un gestor de secretos.',
-        switchOrgCta: 'Cambiar organización',
+        activeOrgTitle: 'Organización activa',
+        switchOrgCta: 'Cambiar',
         orgsMoreInfo: 'Aprender más sobre organizaciones',
         orgsInfoTitle: '¿Qué son las organizaciones?',
         orgsInfoSubtitle: 'Todo lo que necesitas saber',
@@ -54293,7 +54330,8 @@ const ORGANIZATION_VIEW_I18N = {
         apiKeysFeaturePermsDesc: 'Each key carries only the permissions you assign — grant the minimum.',
         apiKeysFeatureSecretTitle: 'One-time secret',
         apiKeysFeatureSecretDesc: 'The secret is shown only once. Store it in a secret manager.',
-        switchOrgCta: 'Switch organization',
+        activeOrgTitle: 'Active organization',
+        switchOrgCta: 'Switch',
         orgsMoreInfo: 'Learn more about organizations',
         orgsInfoTitle: 'What are organizations?',
         orgsInfoSubtitle: 'Everything you need to know',
@@ -54485,14 +54523,18 @@ class OrganizationViewComponent {
                 return this.tt('planEnterprise');
             return this.tt('planFree');
         });
-        this.switchOrgButtonProps = computed(() => ({
-            text: this.tt('switchOrgCta'),
-            color: 'dark',
-            fill: 'outline',
-            size: 'default',
-            shape: 'round',
-            type: 'button',
-            token: 'org-switch',
+        this.switchOrgSectionProps = computed(() => ({
+            title: this.tt('activeOrgTitle'),
+            action: {
+                text: this.tt('switchOrgCta'),
+                color: 'dark',
+                fill: 'outline',
+                size: 'small',
+                shape: 'round',
+                type: 'button',
+                token: 'org-switch',
+                state: ComponentStates.ENABLED,
+            },
         }));
         this.editButtonProps = computed(() => ({
             text: this.tt('editCta'),
@@ -55011,15 +55053,8 @@ class OrganizationViewComponent {
             content: pageDescription(),
           }"
         />
-        <!-- "Aprender más sobre organizaciones" — bajo el título+subtítulo
-             principal de la vista (abre el explainer org-info-sheet). -->
-        <button class="org-more-info-link" type="button" (click)="onOrgInfo()">
-          {{ tt('orgsMoreInfo') }}
-        </button>
-        <!-- Cambiar de organización activa. -->
-        <div class="org-switch-row">
-          <val-button [props]="switchOrgButtonProps()" (onClick)="onSwitchOrg()" />
-        </div>
+        <!-- Sección "Organización activa" con botón Cambiar a la derecha. -->
+        <val-section-header [props]="switchOrgSectionProps()" (actionClick)="onSwitchOrg()" />
       </header>
 
       @if (resolvedConfig().showInfo) {
@@ -55321,7 +55356,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"] }] }); }
+  `, 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"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: OrganizationViewComponent, decorators: [{
             type: Component,
@@ -55341,6 +55376,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         TransferOwnershipModalComponent,
                         MemberImportModalComponent,
                         OrgInfoSheetComponent,
+                        SectionHeaderComponent,
                         SwitchOrgModalComponent,
                     ], template: `
     <div class="page">
@@ -55354,15 +55390,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
             content: pageDescription(),
           }"
         />
-        <!-- "Aprender más sobre organizaciones" — bajo el título+subtítulo
-             principal de la vista (abre el explainer org-info-sheet). -->
-        <button class="org-more-info-link" type="button" (click)="onOrgInfo()">
-          {{ tt('orgsMoreInfo') }}
-        </button>
-        <!-- Cambiar de organización activa. -->
-        <div class="org-switch-row">
-          <val-button [props]="switchOrgButtonProps()" (onClick)="onSwitchOrg()" />
-        </div>
+        <!-- Sección "Organización activa" con botón Cambiar a la derecha. -->
+        <val-section-header [props]="switchOrgSectionProps()" (actionClick)="onSwitchOrg()" />
       </header>
 
       @if (resolvedConfig().showInfo) {
@@ -61903,7 +61932,7 @@ class LegalContentService {
         const stream = fallback && fallback !== locale
             ? primary.pipe(catchError$1(() => this.loadOne(slug, fallback, options.basePath)))
             : primary;
-        const shared = stream.pipe(shareReplay({ bufferSize: 1, refCount: false }));
+        const shared = stream.pipe(shareReplay$1({ bufferSize: 1, refCount: false }));
         this.cache.set(key, shared);
         return shared;
     }