@memberjunction/ng-explorer-core 6.1.4 → 6.2.0-edge.1

package/dist/lib/shell/components/tabs/tab-container.component.js

@@ -158,20 +158,60 @@ export class TabContainerComponent extends BaseAngularComponent {
     appRef;
     environmentInjector;
     cdr;
-    glContainer;
-    directContentContainer;
-    recordsGlContainer;
+    GlContainer;
+    /** @deprecated Use {@link GlContainer}. */
+    get glContainer() {
+        return this.GlContainer;
+    }
+    /** @deprecated Use {@link GlContainer}. */
+    set glContainer(value) {
+        this.GlContainer = value;
+    }
+    DirectContentContainer;
+    /** @deprecated Use {@link DirectContentContainer}. */
+    get directContentContainer() {
+        return this.DirectContentContainer;
+    }
+    /** @deprecated Use {@link DirectContentContainer}. */
+    set directContentContainer(value) {
+        this.DirectContentContainer = value;
+    }
+    RecordsGlContainer;
+    /** @deprecated Use {@link RecordsGlContainer}. */
+    get recordsGlContainer() {
+        return this.RecordsGlContainer;
+    }
+    /** @deprecated Use {@link RecordsGlContainer}. */
+    set recordsGlContainer(value) {
+        this.RecordsGlContainer = value;
+    }
     /**
      * Emitted when the first resource component finishes loading.
      * This allows the shell to keep showing its loading indicator until the first
      * resource is ready, eliminating the visual gap between shell loading and resource loading.
      */
-    firstResourceLoadComplete = new EventEmitter();
+    FirstResourceLoadComplete = new EventEmitter();
+    /**
+     * @deprecated Use {@link FirstResourceLoadComplete}.
+     *
+     * The same emitter under the old binding name, so a template still binding
+     * (firstResourceLoadComplete) keeps working. Must stay AFTER FirstResourceLoadComplete: class fields
+     * initialise in order, and the other way round this captures undefined.
+     */
+    firstResourceLoadComplete = this.FirstResourceLoadComplete;
     /**
      * Emitted when Golden Layout fails to initialize after multiple retries.
      * The shell can use this to show an error dialog and redirect.
      */
-    layoutInitError = new EventEmitter();
+    LayoutInitError = new EventEmitter();
+    /**
+     * @deprecated Use {@link LayoutInitError}.
+     *
+     * The same emitter under the old binding name, so a template still binding
+     * (layoutInitError) keeps working. Must stay AFTER LayoutInitError: class fields
+     * initialise in order, and the other way round this captures undefined.
+     */
+    layoutInitError = this.LayoutInitError;
     pinService = inject(HomeAppPinService);
     navigationService = inject(NavigationService);
     recordSwitcher = inject(RecordSwitcherService);
@@ -188,11 +228,28 @@ export class TabContainerComponent extends BaseAngularComponent {
     // When a tab's content changes while active, both the reload path (workspace config subscription)
     // and onTabShown can race to call loadTabContent, resulting in duplicate component rendering.
     tabsCurrentlyLoading = new Set();
+    // Record-tab shows GL fired while the records region was HIDDEN, by tab id.
+    // Their content loads are deferred until the region is the visible surface —
+    // see the TabShown handler in wireRecordsLayoutEvents.
+    //
+    // A SET, not a map of containers: the replay deliberately re-resolves the live
+    // container via GetContainer(tabId), so a parked one would never be read — and
+    // holding it would retain a GL container, and its possibly-detached DOM, for as
+    // long as the region stays hidden. The type says the id is all that is kept.
+    pendingRecordShows = new Set();
     // NEW: Smart component cache for preserving state across tab switches
     cacheManager;
     // Single-resource mode: render component directly without Golden Layout
     // This avoids the 20px height issue when GL header is hidden
-    useSingleResourceMode = false;
+    UseSingleResourceMode = false;
+    /** @deprecated Use {@link UseSingleResourceMode}. */
+    get useSingleResourceMode() {
+        return this.UseSingleResourceMode;
+    }
+    /** @deprecated Use {@link UseSingleResourceMode}. */
+    set useSingleResourceMode(value) {
+        this.UseSingleResourceMode = value;
+    }
     singleResourceComponentRef = null;
     /** Cache identity of the current single-resource component for detachment */
     singleResourceCacheIdentity = null;
@@ -200,10 +257,42 @@ export class TabContainerComponent extends BaseAngularComponent {
     currentSingleResourceSignature = null; // Track loaded content signature to avoid unnecessary reloads
     isCreatingInitialTabs = false; // Flag to prevent syncTabsWithConfiguration during initial tab creation
     // Context menu state
-    contextMenuVisible = false;
-    contextMenuX = 0;
-    contextMenuY = 0;
-    contextMenuTabId = null;
+    ContextMenuVisible = false;
+    /** @deprecated Use {@link ContextMenuVisible}. */
+    get contextMenuVisible() {
+        return this.ContextMenuVisible;
+    }
+    /** @deprecated Use {@link ContextMenuVisible}. */
+    set contextMenuVisible(value) {
+        this.ContextMenuVisible = value;
+    }
+    ContextMenuX = 0;
+    /** @deprecated Use {@link ContextMenuX}. */
+    get contextMenuX() {
+        return this.ContextMenuX;
+    }
+    /** @deprecated Use {@link ContextMenuX}. */
+    set contextMenuX(value) {
+        this.ContextMenuX = value;
+    }
+    ContextMenuY = 0;
+    /** @deprecated Use {@link ContextMenuY}. */
+    get contextMenuY() {
+        return this.ContextMenuY;
+    }
+    /** @deprecated Use {@link ContextMenuY}. */
+    set contextMenuY(value) {
+        this.ContextMenuY = value;
+    }
+    ContextMenuTabId = null;
+    /** @deprecated Use {@link ContextMenuTabId}. */
+    get contextMenuTabId() {
+        return this.ContextMenuTabId;
+    }
+    /** @deprecated Use {@link ContextMenuTabId}. */
+    set contextMenuTabId(value) {
+        this.ContextMenuTabId = value;
+    }
     /** The control that opened the context menu — focus returns here on close */
     contextMenuAnchor = null;
     // ---- RECORDS region (records-style record opens) ----
@@ -420,6 +509,9 @@ export class TabContainerComponent extends BaseAngularComponent {
             // Flush NOW — the visibility class must land in this pass, not
             // whenever the next unrelated emission happens to run CD.
             this.flushRegionCd();
+            if (showing) {
+                this.flushPendingRecordShows();
+            }
         }
         if (showing && activeTab && this.recordsLayoutInitialized) {
             this.focusRecordsTab(activeTab.id);
@@ -536,6 +628,46 @@ export class TabContainerComponent extends BaseAngularComponent {
         }
         return true;
     }
+    /**
+     * Load a record tab's content into its GL container and mark it loaded —
+     * the second half of the TabShown handler, split out so a show parked
+     * while the region was hidden can be replayed on reveal.
+     */
+    async loadShownRecordTab(tabId, container) {
+        await this.loadTabContent(tabId, container);
+        // Mark loaded ONLY when content actually attached to the LIVE
+        // container. During layout restore, GL can re-render item elements
+        // while an async load is in flight — the load appends into a
+        // detached element and the visible pane stays blank. Leaving the
+        // tab unmarked lets the next show retry, which hits the component
+        // cache and reattaches instantly into the live element.
+        const live = this.recordsLayoutManager.GetContainer(tabId);
+        if (live?.element && live.element.childElementCount > 0) {
+            this.recordsLayoutManager.MarkTabLoaded(tabId);
+        }
+    }
+    /**
+     * Replay the shows parked while the records region was hidden (see the
+     * TabShown handler). Always against the LIVE container: a breakpoint
+     * rebuild between park and reveal replaces the one GL handed us (and its
+     * Destroy fires TabClosed, which drops the stale entry anyway).
+     */
+    flushPendingRecordShows() {
+        if (this.pendingRecordShows.size === 0) {
+            return;
+        }
+        const parked = [...this.pendingRecordShows];
+        this.pendingRecordShows.clear();
+        for (const tabId of parked) {
+            if (this.recordsLayoutManager.IsTabLoaded(tabId)) {
+                continue;
+            }
+            const live = this.recordsLayoutManager.GetContainer(tabId);
+            if (live) {
+                this.loadShownRecordTab(tabId, live).catch(e => LogError(`Deferred record tab load failed for ${tabId}: ${e}`));
+            }
+        }
+    }
     /** Focus a records-region tab without feeding back into SetActiveTab loops */
     focusRecordsTab(tabId) {
         if (this.recordsRegionActiveTabId !== tabId) {
@@ -554,7 +686,7 @@ export class TabContainerComponent extends BaseAngularComponent {
         if (this.recordsLayoutInitialized) {
             return;
         }
-        const container = this.recordsGlContainer?.nativeElement;
+        const container = this.RecordsGlContainer?.nativeElement;
         if (!container) {
             return; // Template not settled yet — the next sync pass retries
         }
@@ -690,7 +822,7 @@ export class TabContainerComponent extends BaseAngularComponent {
         }), this.layoutManager.TabDoubleClicked.subscribe(tabId => {
             this.workspaceManager.TogglePin(tabId);
         }), this.layoutManager.TabRightClicked.subscribe(event => {
-            this.showContextMenu(event.x, event.y, event.tabId, event.anchorEl);
+            this.ShowContextMenu(event.x, event.y, event.tabId, event.anchorEl);
         }));
         this.wireRecordsLayoutEvents();
         // Breakpoint crossings rebuild the records GL in the other chrome mode
@@ -728,7 +860,7 @@ export class TabContainerComponent extends BaseAngularComponent {
                     // the region is the visible surface for this configuration.
                     this.syncRecordsRegion(config);
                     this.updateRecordSurfaceState(config);
-                    if (this.useSingleResourceMode) {
+                    if (this.UseSingleResourceMode) {
                         // In single-resource mode, reload content if the tab content changed
                         // The same tab ID can have different content (tab gets reused)
                         const activeTab = config.tabs.find(t => t.id === config.activeTabId) || config.tabs[0];
@@ -781,20 +913,28 @@ export class TabContainerComponent extends BaseAngularComponent {
      */
     wireRecordsLayoutEvents() {
         this.subscriptions.push(this.recordsLayoutManager.TabShown.subscribe(async (event) => {
-            if (event.isFirstShow) {
-                await this.loadTabContent(event.tabId, event.container);
-                // Mark loaded ONLY when content actually attached to the LIVE
-                // container. During layout restore, GL can re-render item elements
-                // while an async load is in flight — the load appends into a
-                // detached element and the visible pane stays blank. Leaving the
-                // tab unmarked lets the next show retry, which hits the component
-                // cache and reattaches instantly into the live element.
-                const live = this.recordsLayoutManager.GetContainer(event.tabId);
-                if (live?.element && live.element.childElementCount > 0) {
-                    this.recordsLayoutManager.MarkTabLoaded(event.tabId);
-                }
+            if (!event.isFirstShow) {
+                return;
+            }
+            // LAZY content. The records GL initializes EAGERLY (see
+            // ensureRecordsLayoutInitialized) so the strip and the pill never
+            // drift from the workspace — and as it builds, GL fires 'show' for
+            // every stack's active tab while the region is still
+            // visibility-hidden behind the main surface. Loading content on
+            // those shows means every restored record hydrates at BOOT: an open
+            // AI Agent Run pulls its whole run tree (every prompt run, action
+            // log, step) before the user has looked at it, and client-side
+            // RunView coalescing folds the ACTIVE tab's own reads into the same
+            // requests, so the surface the user is looking at waits for records
+            // they are not. Park the show; it is replayed when the region shows.
+            if (!this.ShowRecordsRegion) {
+                this.pendingRecordShows.add(event.tabId);
+                return;
             }
+            this.pendingRecordShows.delete(event.tabId);
+            await this.loadShownRecordTab(event.tabId, event.container);
         }), this.recordsLayoutManager.TabClosed.subscribe(async (tabId) => {
+            this.pendingRecordShows.delete(tabId);
             this.cleanupTabComponent(tabId);
             // REBUILD guard (breakpoint crossing): Destroy() fires TabClosed for
             // every pane. The tabs are NOT closing — the layout is being rebuilt
@@ -843,12 +983,12 @@ export class TabContainerComponent extends BaseAngularComponent {
         }), this.recordsLayoutManager.TabDoubleClicked.subscribe(tabId => {
             this.workspaceManager.TogglePin(tabId);
         }), this.recordsLayoutManager.TabRightClicked.subscribe(event => {
-            this.showContextMenu(event.x, event.y, event.tabId, event.anchorEl);
+            this.ShowContextMenu(event.x, event.y, event.tabId, event.anchorEl);
         }));
     }
     ngAfterViewInit() {
         // Initialize Golden Layout only if we're not in single-resource mode
-        if (!this.useSingleResourceMode) {
+        if (!this.UseSingleResourceMode) {
             this.initializeGoldenLayout();
         }
         else {
@@ -862,13 +1002,13 @@ export class TabContainerComponent extends BaseAngularComponent {
      */
     initializeGoldenLayout(forceCreateTabs = false) {
         // If we are in single resource mode we do NOT need to do this work as golden layout should not exist in that state
-        if (this.useSingleResourceMode)
+        if (this.UseSingleResourceMode)
             return;
-        if (!this.glContainer?.nativeElement) {
+        if (!this.GlContainer?.nativeElement) {
             this.layoutInitRetryCount++;
             if (this.layoutInitRetryCount > this.MAX_LAYOUT_INIT_RETRIES) {
                 console.error(`Golden Layout container not available after ${this.MAX_LAYOUT_INIT_RETRIES} retries, emitting error`);
-                this.layoutInitError.emit();
+                this.LayoutInitError.emit();
                 return;
             }
             console.warn(`Golden Layout container not available, retry ${this.layoutInitRetryCount}/${this.MAX_LAYOUT_INIT_RETRIES}...`);
@@ -902,7 +1042,7 @@ export class TabContainerComponent extends BaseAngularComponent {
             return;
         }
         // Initialize Golden Layout (we have config now)
-        this.layoutManager.Initialize(this.glContainer.nativeElement);
+        this.layoutManager.Initialize(this.GlContainer.nativeElement);
         // Mark layout as initialized
         this.layoutInitialized = true;
         // The MAIN layout hosts only non-record tabs — record tabs live in the
@@ -1002,7 +1142,7 @@ export class TabContainerComponent extends BaseAngularComponent {
     async ReloadAllTabs() {
         // Destroy all cached component instances
         this.cacheManager.clearCache();
-        if (this.useSingleResourceMode) {
+        if (this.UseSingleResourceMode) {
             // Force reload by clearing the signature check
             this.currentSingleResourceSignature = null;
             this.singleResourceComponentRef = null;
@@ -1095,7 +1235,7 @@ export class TabContainerComponent extends BaseAngularComponent {
      * ensures the layout is properly sized after browser window changes.
      */
     onWindowResize() {
-        if (this.layoutInitialized && !this.useSingleResourceMode) {
+        if (this.layoutInitialized && !this.UseSingleResourceMode) {
             this.layoutManager.updateSize();
         }
     }
@@ -1110,12 +1250,12 @@ export class TabContainerComponent extends BaseAngularComponent {
         this.previousTabBarVisible = tabBarVisible;
         // Determine if we should use single-resource mode
         const shouldUseSingleResourceMode = !tabBarVisible;
-        if (shouldUseSingleResourceMode !== this.useSingleResourceMode) {
-            this.useSingleResourceMode = shouldUseSingleResourceMode;
+        if (shouldUseSingleResourceMode !== this.UseSingleResourceMode) {
+            this.UseSingleResourceMode = shouldUseSingleResourceMode;
             // Defer detectChanges to next microtask to avoid ExpressionChangedAfterItHasBeenCheckedError
             // when this handler fires during an already-running change detection cycle.
             Promise.resolve().then(() => this.cdr.detectChanges());
-            if (this.useSingleResourceMode) {
+            if (this.UseSingleResourceMode) {
                 // Transitioning to single-resource mode
                 // **CRITICAL FIX**: Wait for the template to render directContentContainer
                 // before trying to load content. detectChanges() only marks dirty, doesn't render immediately.
@@ -1217,7 +1357,7 @@ export class TabContainerComponent extends BaseAngularComponent {
         }
         this.currentSingleResourceSignature = newSignature;
         // Get the container element
-        const container = this.directContentContainer?.nativeElement;
+        const container = this.DirectContentContainer?.nativeElement;
         if (!container) {
             // Retry after view is updated
             setTimeout(() => this.loadSingleResourceContent(), 50);
@@ -1415,7 +1555,7 @@ export class TabContainerComponent extends BaseAngularComponent {
         // Remove children from the container. This detaches the wrapper DOM element
         // without destroying the Angular component — it lives on in the cache.
         // Using removeChild (not innerHTML='') to avoid aggressive DOM cleanup.
-        const container = this.directContentContainer?.nativeElement;
+        const container = this.DirectContentContainer?.nativeElement;
         if (container) {
             while (container.firstChild) {
                 container.removeChild(container.firstChild);
@@ -1469,7 +1609,7 @@ export class TabContainerComponent extends BaseAngularComponent {
             // Pre-compute and stamp the new signature so the configuration-subscription path
             // in single-resource mode doesn't see a "content changed" delta and trigger a
             // needless reload cycle (which would destroy the currently attached component).
-            if (this.useSingleResourceMode && this.currentSingleResourceSignature !== null) {
+            if (this.UseSingleResourceMode && this.currentSingleResourceSignature !== null) {
                 const updatedTab = {
                     ...tab,
                     resourceRecordId: newRecordId,
@@ -1552,7 +1692,7 @@ export class TabContainerComponent extends BaseAngularComponent {
             this.singleResourceCacheIdentity = null;
             // Clear the host container's DOM so the user isn't briefly looking at the
             // destroyed component's wrapper between CloseTab and the default-tab load.
-            const directContainer = this.directContentContainer?.nativeElement;
+            const directContainer = this.DirectContentContainer?.nativeElement;
             if (directContainer) {
                 while (directContainer.firstChild)
                     directContainer.removeChild(directContainer.firstChild);
@@ -2242,11 +2382,11 @@ export class TabContainerComponent extends BaseAngularComponent {
     /**
      * Show context menu
      */
-    showContextMenu(x, y, tabId, anchorEl) {
-        this.contextMenuX = x;
-        this.contextMenuY = y;
-        this.contextMenuTabId = tabId;
-        this.contextMenuVisible = true;
+    ShowContextMenu(x, y, tabId, anchorEl) {
+        this.ContextMenuX = x;
+        this.ContextMenuY = y;
+        this.ContextMenuTabId = tabId;
+        this.ContextMenuVisible = true;
         // Remember the invoking control so closing can hand focus back (the
         // slot button passes itself; right-click falls back to whatever was
         // focused). aria-expanded reflects the open menu on the anchor.
@@ -2273,14 +2413,14 @@ export class TabContainerComponent extends BaseAngularComponent {
             const clickHandler = (event) => {
                 const target = event.target;
                 if (!target.closest('.context-menu')) {
-                    this.hideContextMenu();
+                    this.HideContextMenu();
                     document.removeEventListener('click', clickHandler, true);
                     document.removeEventListener('keydown', keyHandler, true);
                 }
             };
             const keyHandler = (event) => {
                 if (event.key === 'Escape') {
-                    this.hideContextMenu();
+                    this.HideContextMenu();
                     document.removeEventListener('click', clickHandler, true);
                     document.removeEventListener('keydown', keyHandler, true);
                 }
@@ -2289,12 +2429,16 @@ export class TabContainerComponent extends BaseAngularComponent {
             document.addEventListener('keydown', keyHandler, true);
         }, 0);
     }
+    /** @deprecated Use {@link ShowContextMenu}. */
+    showContextMenu(x, y, tabId, anchorEl) {
+        return this.ShowContextMenu(x, y, tabId, anchorEl);
+    }
     /**
      * Hide context menu
      */
-    hideContextMenu(restoreFocus = true) {
-        this.contextMenuVisible = false;
-        this.contextMenuTabId = null;
+    HideContextMenu(restoreFocus = true) {
+        this.ContextMenuVisible = false;
+        this.ContextMenuTabId = null;
         const anchor = this.contextMenuAnchor;
         this.contextMenuAnchor = null;
         if (anchor?.classList.contains('mj-tab-type-slot')) {
@@ -2310,12 +2454,16 @@ export class TabContainerComponent extends BaseAngularComponent {
             requestAnimationFrame(() => anchor.focus());
         }
     }
+    /** @deprecated Use {@link HideContextMenu}. */
+    hideContextMenu(restoreFocus = true) {
+        return this.HideContextMenu(restoreFocus);
+    }
     /**
      * role="menu" keyboard model: ArrowUp/Down rove (wrapping) over enabled
      * items, Home/End jump, Escape closes with focus return, Tab dismisses
      * (native menus don't trap Tab).
      */
-    onMenuKeydown(event) {
+    OnMenuKeydown(event) {
         const items = Array.from(document.querySelectorAll('.context-menu [role="menuitem"]:not([disabled])'));
         if (items.length === 0) {
             return;
@@ -2343,37 +2491,53 @@ export class TabContainerComponent extends BaseAngularComponent {
                 // deferred document-level teardown listener attaches.
                 event.preventDefault();
                 event.stopPropagation();
-                this.hideContextMenu();
+                this.HideContextMenu();
                 break;
             case 'Tab':
-                this.hideContextMenu(false);
+                this.HideContextMenu(false);
                 break;
         }
     }
+    /** @deprecated Use {@link OnMenuKeydown}. */
+    onMenuKeydown(event) {
+        return this.OnMenuKeydown(event);
+    }
     /**
      * Check if context menu tab is pinned
      */
-    get isContextTabPinned() {
-        if (!this.contextMenuTabId)
+    get IsContextTabPinned() {
+        if (!this.ContextMenuTabId)
             return false;
-        const tab = this.workspaceManager.GetTab(this.contextMenuTabId);
+        const tab = this.workspaceManager.GetTab(this.ContextMenuTabId);
         return tab?.isPinned || false;
     }
+    /** @deprecated Use {@link IsContextTabPinned}. */
+    get isContextTabPinned() {
+        return this.IsContextTabPinned;
+    }
     /** Context tab is a records-REGION record — eligible for "Move to Workspace" */
-    get canContextMoveToWorkspace() {
+    get CanContextMoveToWorkspace() {
         // Docked/region composition is a DESKTOP concept — no move actions on mobile
-        if (!this.contextMenuTabId || !this.RecordsStyleActive || this.mobileRecordsActive)
+        if (!this.ContextMenuTabId || !this.RecordsStyleActive || this.mobileRecordsActive)
             return false;
-        const tab = this.workspaceManager.GetTab(this.contextMenuTabId);
+        const tab = this.workspaceManager.GetTab(this.ContextMenuTabId);
         return !!tab && IsRecordsRegionTab(tab.configuration);
     }
+    /** @deprecated Use {@link CanContextMoveToWorkspace}. */
+    get canContextMoveToWorkspace() {
+        return this.CanContextMoveToWorkspace;
+    }
     /** Context tab is a DOCKED record — eligible for "Move to Records" */
-    get canContextMoveToRecords() {
-        if (!this.contextMenuTabId || !this.RecordsStyleActive || this.mobileRecordsActive)
+    get CanContextMoveToRecords() {
+        if (!this.ContextMenuTabId || !this.RecordsStyleActive || this.mobileRecordsActive)
             return false;
-        const tab = this.workspaceManager.GetTab(this.contextMenuTabId);
+        const tab = this.workspaceManager.GetTab(this.ContextMenuTabId);
         return !!tab && IsRecordsTabConfiguration(tab.configuration) && IsRecordDockedToWorkspace(tab.configuration);
     }
+    /** @deprecated Use {@link CanContextMoveToRecords}. */
+    get canContextMoveToRecords() {
+        return this.CanContextMoveToRecords;
+    }
     /**
      * Promote: records region → main workspace layout ("Move to Workspace").
      * ORDER MATTERS: activate FIRST, then flip the flag. With the tab already
@@ -2382,15 +2546,19 @@ export class TabContainerComponent extends BaseAngularComponent {
      * (b) a single-resource→multi-tab transition triggered by the flip exempts
      * it from the force-pin sweep (it IS the activeTabId).
      */
-    onContextMoveToWorkspace() {
-        const tabId = this.contextMenuTabId;
-        this.hideContextMenu(false);
+    OnContextMoveToWorkspace() {
+        const tabId = this.ContextMenuTabId;
+        this.HideContextMenu(false);
         if (!tabId)
             return;
         this.workspaceManager.SetActiveTab(tabId);
         this.workspaceManager.UpdateTabConfiguration(tabId, { [RECORD_DOCKED_TO_WORKSPACE_KEY]: true });
         this.assertMovedTabActivation(tabId);
     }
+    /** @deprecated Use {@link OnContextMoveToWorkspace}. */
+    onContextMoveToWorkspace() {
+        return this.OnContextMoveToWorkspace();
+    }
     /**
      * Demote: main workspace layout → records region ("Move to Records").
      * Same activate-first ordering: the flip's emission then computes
@@ -2398,15 +2566,19 @@ export class TabContainerComponent extends BaseAngularComponent {
      * the returned tab. `false` (not undefined) so the choice is explicit in
      * the persisted configuration.
      */
-    onContextMoveToRecords() {
-        const tabId = this.contextMenuTabId;
-        this.hideContextMenu(false);
+    OnContextMoveToRecords() {
+        const tabId = this.ContextMenuTabId;
+        this.HideContextMenu(false);
         if (!tabId)
             return;
         this.workspaceManager.SetActiveTab(tabId);
         this.workspaceManager.UpdateTabConfiguration(tabId, { [RECORD_DOCKED_TO_WORKSPACE_KEY]: false });
         this.assertMovedTabActivation(tabId);
     }
+    /** @deprecated Use {@link OnContextMoveToRecords}. */
+    onContextMoveToRecords() {
+        return this.OnContextMoveToRecords();
+    }
     /**
      * A move's SOURCE layout auto-activates its next tab when the moved tab is
      * removed, and that GL activation WRITES BACK into the workspace — stomping
@@ -2425,69 +2597,89 @@ export class TabContainerComponent extends BaseAngularComponent {
     /**
      * Toggle pin from context menu
      */
-    onContextPin() {
-        if (this.contextMenuTabId) {
-            this.workspaceManager.TogglePin(this.contextMenuTabId);
+    OnContextPin() {
+        if (this.ContextMenuTabId) {
+            this.workspaceManager.TogglePin(this.ContextMenuTabId);
         }
-        this.hideContextMenu();
+        this.HideContextMenu();
+    }
+    /** @deprecated Use {@link OnContextPin}. */
+    onContextPin() {
+        return this.OnContextPin();
     }
     /**
      * Close tab from context menu
      */
-    onContextClose() {
-        if (this.contextMenuTabId) {
-            const tab = this.workspaceManager.GetTab(this.contextMenuTabId);
+    OnContextClose() {
+        if (this.ContextMenuTabId) {
+            const tab = this.workspaceManager.GetTab(this.ContextMenuTabId);
             const manager = tab && this.isRecordTab(tab) ? this.recordsLayoutManager : this.layoutManager;
-            manager.RemoveTab(this.contextMenuTabId);
+            manager.RemoveTab(this.ContextMenuTabId);
         }
         // The anchor lives on the closed tab — nothing to return focus to.
-        this.hideContextMenu(false);
+        this.HideContextMenu(false);
+    }
+    /** @deprecated Use {@link OnContextClose}. */
+    onContextClose() {
+        return this.OnContextClose();
     }
     /**
      * Close all other tabs from context menu
      */
-    onContextCloseOthers() {
-        if (this.contextMenuTabId) {
-            this.workspaceManager.CloseOtherTabs(this.contextMenuTabId);
+    OnContextCloseOthers() {
+        if (this.ContextMenuTabId) {
+            this.workspaceManager.CloseOtherTabs(this.ContextMenuTabId);
         }
-        this.hideContextMenu();
+        this.HideContextMenu();
+    }
+    /** @deprecated Use {@link OnContextCloseOthers}. */
+    onContextCloseOthers() {
+        return this.OnContextCloseOthers();
     }
     /**
      * Close tabs to the right from context menu
      */
-    onContextCloseToRight() {
-        if (this.contextMenuTabId) {
-            this.workspaceManager.CloseTabsToRight(this.contextMenuTabId);
+    OnContextCloseToRight() {
+        if (this.ContextMenuTabId) {
+            this.workspaceManager.CloseTabsToRight(this.ContextMenuTabId);
         }
-        this.hideContextMenu();
+        this.HideContextMenu();
+    }
+    /** @deprecated Use {@link OnContextCloseToRight}. */
+    onContextCloseToRight() {
+        return this.OnContextCloseToRight();
     }
     /**
      * Check if context menu tab is pinned to Home dashboard
      */
-    get isContextTabPinnedToHome() {
-        if (!this.contextMenuTabId)
+    get IsContextTabPinnedToHome() {
+        if (!this.ContextMenuTabId)
             return false;
-        const tab = this.workspaceManager.GetTab(this.contextMenuTabId);
+        const tab = this.workspaceManager.GetTab(this.ContextMenuTabId);
         if (!tab)
             return false;
         const resourceType = this.resolveResourceType(tab);
         return this.pinService.IsPinned(resourceType, tab.configuration);
     }
+    /** @deprecated Use {@link IsContextTabPinnedToHome}. */
+    get isContextTabPinnedToHome() {
+        return this.IsContextTabPinnedToHome;
+    }
     /**
      * Pin current context menu tab to Home dashboard
      */
-    async onContextPinToHome() {
-        if (this.isContextTabPinnedToHome) {
-            this.hideContextMenu();
+    async OnContextPinToHome() {
+        if (this.IsContextTabPinnedToHome) {
+            this.HideContextMenu();
             return;
         }
-        if (!this.contextMenuTabId) {
-            this.hideContextMenu();
+        if (!this.ContextMenuTabId) {
+            this.HideContextMenu();
             return;
         }
-        const tab = this.workspaceManager.GetTab(this.contextMenuTabId);
+        const tab = this.workspaceManager.GetTab(this.ContextMenuTabId);
         if (!tab) {
-            this.hideContextMenu();
+            this.HideContextMenu();
             return;
         }
         const resourceType = this.resolveResourceType(tab);
@@ -2518,7 +2710,11 @@ export class TabContainerComponent extends BaseAngularComponent {
         else {
             MJNotificationService.Instance.CreateSimpleNotification(`"${tab.title}" is already pinned to Home`, 'info', 3000);
         }
-        this.hideContextMenu();
+        this.HideContextMenu();
+    }
+    /** @deprecated Use {@link OnContextPinToHome}. */
+    async onContextPinToHome() {
+        return this.OnContextPinToHome();
     }
     /**
      * Resolve a WorkspaceTab's resource type string for pin matching
@@ -2545,12 +2741,12 @@ export class TabContainerComponent extends BaseAngularComponent {
         try {
             // Find the active content element — differs by mode
             let contentEl = null;
-            if (this.useSingleResourceMode) {
-                contentEl = this.directContentContainer?.nativeElement ?? null;
+            if (this.UseSingleResourceMode) {
+                contentEl = this.DirectContentContainer?.nativeElement ?? null;
             }
             else {
                 // In Golden Layout mode, find the active tab's content pane
-                contentEl = this.glContainer?.nativeElement?.querySelector('.lm_item_container .lm_content');
+                contentEl = this.GlContainer?.nativeElement?.querySelector('.lm_item_container .lm_content');
             }
             if (!contentEl)
                 return;
@@ -2574,11 +2770,11 @@ export class TabContainerComponent extends BaseAngularComponent {
     async CaptureActiveThumbnail() {
         try {
             let contentEl = null;
-            if (this.useSingleResourceMode) {
-                contentEl = this.directContentContainer?.nativeElement ?? null;
+            if (this.UseSingleResourceMode) {
+                contentEl = this.DirectContentContainer?.nativeElement ?? null;
             }
             else {
-                contentEl = this.glContainer?.nativeElement?.querySelector('.lm_item_container .lm_content');
+                contentEl = this.GlContainer?.nativeElement?.querySelector('.lm_item_container .lm_content');
             }
             if (!contentEl)
                 return undefined;
@@ -2594,7 +2790,7 @@ export class TabContainerComponent extends BaseAngularComponent {
      * forever we emit all events upstream
      */
     emitFirstLoadCompleteOnce() {
-        this.firstResourceLoadComplete.emit(); // do this each time to be sure we don't suppress messages
+        this.FirstResourceLoadComplete.emit(); // do this each time to be sure we don't suppress messages
     }
     /**
      * Render an inline "missing resource component" error into a host element when
@@ -2655,12 +2851,12 @@ export class TabContainerComponent extends BaseAngularComponent {
             i0.ɵɵviewQuery(_c0, 5)(_c1, 5)(_c2, 5);
         } if (rf & 2) {
             let _t;
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.glContainer = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.directContentContainer = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.recordsGlContainer = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.GlContainer = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.DirectContentContainer = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.RecordsGlContainer = _t.first);
         } }, hostBindings: function TabContainerComponent_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("resize", function TabContainerComponent_resize_HostBindingHandler() { return ctx.onWindowResize(); }, i0.ɵɵresolveWindow);
-        } }, outputs: { firstResourceLoadComplete: "firstResourceLoadComplete", layoutInitError: "layoutInitError" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 6, vars: 5, consts: [["directContentContainer", ""], ["glContainer", ""], ["recordsGlContainer", ""], [1, "tab-container"], [1, "main-region"], [1, "direct-content-container"], [1, "gl-container"], ["role", "menu", "aria-label", "Tab actions", 1, "context-menu", 3, "left", "top"], [1, "records-region"], [3, "Title", "Icon", "Color", "Count"], [1, "records-gl-container"], [3, "VisibleChange", "ActivateRequested", "CloseRequested", "Entries", "Visible"], [3, "SwitcherRequested", "Title", "Icon", "Color", "Count"], ["role", "menu", "aria-label", "Tab actions", 1, "context-menu", 3, "keydown"], ["type", "button", "role", "menuitem", 1, "context-menu-item", 3, "click"], ["aria-hidden", "true", 1, "fa-solid", "fa-thumbtack"], [1, "context-menu-divider"], ["type", "button", "role", "menuitem", 1, "context-menu-item", 3, "click", "disabled"], ["aria-hidden", "true", 1, "fa-solid", "fa-house-chimney"], ["aria-hidden", "true", 1, "fa-solid", "fa-xmark"], ["aria-hidden", "true", 1, "fa-solid", "fa-layer-group"], ["aria-hidden", "true", 1, "fa-solid", "fa-angles-right"], [1, "check"], ["aria-hidden", "true", 1, "fa-solid", "fa-check"], ["type", "button", "role", "menuitem", 1, "context-menu-item"], ["aria-hidden", "true", 1, "fa-solid", "fa-arrow-up-right-from-square"], ["aria-hidden", "true", 1, "fa-solid", "fa-file-lines"]], template: function TabContainerComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, outputs: { FirstResourceLoadComplete: "FirstResourceLoadComplete", firstResourceLoadComplete: "firstResourceLoadComplete", LayoutInitError: "LayoutInitError", layoutInitError: "layoutInitError" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 6, vars: 5, consts: [["directContentContainer", ""], ["glContainer", ""], ["recordsGlContainer", ""], [1, "tab-container"], [1, "main-region"], [1, "direct-content-container"], [1, "gl-container"], ["role", "menu", "aria-label", "Tab actions", 1, "context-menu", 3, "left", "top"], [1, "records-region"], [3, "Title", "Icon", "Color", "Count"], [1, "records-gl-container"], [3, "VisibleChange", "ActivateRequested", "CloseRequested", "Entries", "Visible"], [3, "SwitcherRequested", "Title", "Icon", "Color", "Count"], ["role", "menu", "aria-label", "Tab actions", 1, "context-menu", 3, "keydown"], ["type", "button", "role", "menuitem", 1, "context-menu-item", 3, "click"], ["aria-hidden", "true", 1, "fa-solid", "fa-thumbtack"], [1, "context-menu-divider"], ["type", "button", "role", "menuitem", 1, "context-menu-item", 3, "click", "disabled"], ["aria-hidden", "true", 1, "fa-solid", "fa-house-chimney"], ["aria-hidden", "true", 1, "fa-solid", "fa-xmark"], ["aria-hidden", "true", 1, "fa-solid", "fa-layer-group"], ["aria-hidden", "true", 1, "fa-solid", "fa-angles-right"], [1, "check"], ["aria-hidden", "true", 1, "fa-solid", "fa-check"], ["type", "button", "role", "menuitem", 1, "context-menu-item"], ["aria-hidden", "true", 1, "fa-solid", "fa-arrow-up-right-from-square"], ["aria-hidden", "true", 1, "fa-solid", "fa-file-lines"]], template: function TabContainerComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 3)(1, "div", 4);
             i0.ɵɵconditionalCreate(2, TabContainerComponent_Conditional_2_Template, 2, 0, "div", 5)(3, TabContainerComponent_Conditional_3_Template, 2, 0, "div", 6);
             i0.ɵɵelementEnd();
@@ -2681,17 +2877,21 @@ export class TabContainerComponent extends BaseAngularComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TabContainerComponent, [{
         type: Component,
         args: [{ standalone: false, selector: 'mj-tab-container', encapsulation: ViewEncapsulation.None, template: "<div class=\"tab-container\">\n\n  <!-- Main region: nav pages (single-resource or main Golden Layout).\n       Hidden (not destroyed) while the RECORDS region is showing, so nav\n       content keeps its state and reappears instantly. -->\n  <div class=\"main-region\" [class.region-hidden]=\"ShowRecordsRegion\">\n    <!-- Single-Resource Mode: Direct component rendering without Golden Layout -->\n    <!-- This avoids the 20px height issue when GL header is hidden -->\n    @if (useSingleResourceMode) {\n      <div #directContentContainer class=\"direct-content-container\"></div>\n    } @else {\n      <!-- Multi-Tab Mode: Golden Layout Container -->\n      <div #glContainer class=\"gl-container\"></div>\n    }\n  </div>\n\n  <!-- RECORDS region: a SEPARATE Golden Layout hosting only record tabs\n       (records-style record opens). Always in the DOM once created so the\n       layout survives visibility flips; shown only while the active tab is\n       a record. Native GL tab bar = record tabs, drag-to-split included. -->\n  @if (RecordsStyleActive) {\n    <!-- Origin crumbs are PANE-LEVEL now (first element inside each record\n         pane \u2014 see RecordOriginCrumbComponent); the region needs no bar. -->\n    <div class=\"records-region\" [class.region-hidden]=\"!ShowRecordsRegion\">\n      <!-- MOBILE: the GL tab strip is unusable at phone widths (one tab\n           fits, no overflow UI) \u2014 the record bar replaces it and opens the\n           record switcher sheet. The GL itself runs headerless (HideHeaders). -->\n      @if (IsMobileRecords) {\n        <mj-record-bar\n          [Title]=\"RecordBarTitle\"\n          [Icon]=\"RecordBarIcon\"\n          [Color]=\"RecordBarColor\"\n          [Count]=\"OpenRecordCount\"\n          (SwitcherRequested)=\"OpenRecordSwitcher()\">\n        </mj-record-bar>\n      }\n      <div #recordsGlContainer class=\"records-gl-container\"></div>\n    </div>\n\n    <!-- MOBILE record switcher: bottom sheet listing ALL open records\n         (region + docked). Fixed-position \u2014 DOM location here is\n         visual-neutral; living in tab-container keeps close routing on the\n         same path as the tab context menu. -->\n    <mj-record-switcher-sheet\n      [Entries]=\"SwitcherEntries\"\n      [Visible]=\"RecordSwitcherVisible\"\n      (VisibleChange)=\"OnSwitcherVisibleChange($event)\"\n      (ActivateRequested)=\"OnSwitcherActivate($event)\"\n      (CloseRequested)=\"OnSwitcherClose($event)\">\n    </mj-record-switcher-sheet>\n  }\n\n  <!-- Context Menu (only relevant in multi-tab mode). Real buttons with\n       menu semantics: arrow keys rove, Escape closes with focus return to\n       the invoking control (see onMenuKeydown / hideContextMenu). -->\n  @if (contextMenuVisible) {\n    <div\n      class=\"context-menu\"\n      role=\"menu\"\n      aria-label=\"Tab actions\"\n      (keydown)=\"onMenuKeydown($event)\"\n      [style.left.px]=\"contextMenuX\"\n      [style.top.px]=\"contextMenuY\">\n      <button type=\"button\" role=\"menuitem\" class=\"context-menu-item\" (click)=\"onContextPin()\">\n        <i class=\"fa-solid fa-thumbtack\" aria-hidden=\"true\"></i>\n        <span>{{ isContextTabPinned ? 'Unpin Tab' : 'Pin Tab' }}</span>\n      </button>\n      <div class=\"context-menu-divider\"></div>\n      <button type=\"button\" role=\"menuitem\" class=\"context-menu-item\" [class.new-item]=\"!isContextTabPinnedToHome\" [class.disabled]=\"isContextTabPinnedToHome\" [disabled]=\"isContextTabPinnedToHome\" (click)=\"onContextPinToHome()\">\n        <i class=\"fa-solid fa-house-chimney\" aria-hidden=\"true\"></i>\n        @if (isContextTabPinnedToHome) {\n          <span>Pinned to Home</span>\n          <span class=\"check\"><i class=\"fa-solid fa-check\" aria-hidden=\"true\"></i></span>\n        } @else {\n          <span>Pin to Home</span>\n        }\n      </button>\n      @if (canContextMoveToWorkspace || canContextMoveToRecords) {\n        <div class=\"context-menu-divider\"></div>\n        @if (canContextMoveToWorkspace) {\n          <button type=\"button\" role=\"menuitem\" class=\"context-menu-item\" (click)=\"onContextMoveToWorkspace()\">\n            <i class=\"fa-solid fa-arrow-up-right-from-square\" aria-hidden=\"true\"></i>\n            <span>Move to Workspace</span>\n          </button>\n        }\n        @if (canContextMoveToRecords) {\n          <button type=\"button\" role=\"menuitem\" class=\"context-menu-item\" (click)=\"onContextMoveToRecords()\">\n            <i class=\"fa-solid fa-file-lines\" aria-hidden=\"true\"></i>\n            <span>Move to Records</span>\n          </button>\n        }\n      }\n      <div class=\"context-menu-divider\"></div>\n      <button type=\"button\" role=\"menuitem\" class=\"context-menu-item\" (click)=\"onContextClose()\">\n        <i class=\"fa-solid fa-xmark\" aria-hidden=\"true\"></i>\n        <span>Close Tab</span>\n      </button>\n      <button type=\"button\" role=\"menuitem\" class=\"context-menu-item\" (click)=\"onContextCloseOthers()\">\n        <i class=\"fa-solid fa-layer-group\" aria-hidden=\"true\"></i>\n        <span>Close Others</span>\n      </button>\n      <button type=\"button\" role=\"menuitem\" class=\"context-menu-item\" (click)=\"onContextCloseToRight()\">\n        <i class=\"fa-solid fa-angles-right\" aria-hidden=\"true\"></i>\n        <span>Close to Right</span>\n      </button>\n    </div>\n  }\n</div>\n", styles: [":host {\n  display: flex;\n  flex: 1;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n}\n\n.tab-container {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  width: 100%;\n  overflow: hidden;\n}\n\n.gl-container {\n  flex: 1;\n  width: 100%;\n  height: 100%;\n  position: relative;\n  background: var(--mj-bg-page);\n}\n\n/* Main region (nav pages) and the separate RECORDS region \u2014 exactly one is\n   visible at a time. CRITICAL: the hidden region keeps its FULL LAYOUT BOX\n   (visibility, not display:none). Golden Layout instances live in both;\n   display:none would feed GL 0-size resizes and let it initialize/restore\n   against a zero baseline \u2014 the root cause of clipped tab headers, stale\n   strips, and the collapsed-sliver layout. */\n.tab-container {\n  position: relative;\n}\n\n.main-region,\n.records-region {\n  position: absolute;\n  inset: 0;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  background: var(--mj-bg-page);\n}\n\n/* The records GL host fills the region below the origin bar. Must keep a\n   real layout box at all times (see the region comment above) \u2014 it's a flex\n   child of an always-sized absolute region, so it does. */\n.records-gl-container {\n  flex: 1;\n  min-height: 0;\n  position: relative;\n  background: var(--mj-bg-page);\n}\n\n/* Pane layout with an origin crumb as the FIRST element: the crumb keeps\n   its fixed 32px (component host); the content sibling flex-fills. The\n   height override neutralizes inline height:100% that cached wrapper\n   elements carry from earlier renders (CSS !important beats inline). */\nmj-tab-container .lm_items > div > mj-record-origin-crumb,\n.direct-content-container > mj-record-origin-crumb {\n  flex-shrink: 0;\n}\n\nmj-tab-container .lm_items > div > *:not(mj-record-origin-crumb),\n.direct-content-container > *:not(mj-record-origin-crumb) {\n  flex: 1 1 auto;\n  min-height: 0;\n  height: auto !important;\n}\n\n/* Defense against visibility punch-through: `visibility: visible` on a\n   DESCENDANT defeats an ancestor's visibility:hidden (unlike display:none).\n   Real case: explorer-app's global `.visible { visibility: visible\n   !important }` utility collides with components whose show-state class is\n   named `visible` (several bespoke detail panels did this), leaving their\n   overlays painted on top of the records region. The two-class specificity\n   here outranks the single-class utility even with both !important. */\n.region-hidden,\n.region-hidden * {\n  visibility: hidden !important;\n  pointer-events: none !important;\n  /* Region swaps must be INSTANT: `transition: all` rules on GL internals\n     (e.g. .lm_stack) would otherwise transition `visibility` \u2014 which\n     interpolates discretely, keeping the outgoing region painted on top for\n     the full transition duration (a ~200ms flash of the record form over\n     the destination page). */\n  transition: none !important;\n}\n\n/* Direct content container for single-resource mode */\n/* Renders components directly without Golden Layout overhead */\n.direct-content-container {\n  flex: 1;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  background: var(--mj-bg-page);\n  overflow: hidden;\n}\n\n.tab-content-container {\n  background: var(--mj-bg-page);\n  color: var(--mj-text-primary);\n  padding: 20px;\n}\n\n/* Context Menu */\n.context-menu {\n  position: fixed;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n  min-width: 150px;\n  z-index: 10001;\n  overflow: hidden;\n}\n\n.context-menu .context-menu-item {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n  cursor: pointer;\n  font-size: 13px;\n  color: var(--mj-text-primary);\n  transition: background 0.15s;\n  /* Real <button role=\"menuitem\"> now \u2014 neutralize UA chrome */\n  width: 100%;\n  text-align: left;\n  background: transparent;\n  border: none;\n  font-family: inherit;\n}\n\n/* Keyboard roving highlights like hover; ring omitted on purpose \u2014 the\n   moving highlight IS the focus indicator inside a menu. */\n.context-menu .context-menu-item:focus-visible {\n  outline: none;\n  background: var(--mj-bg-surface-hover);\n}\n\n.context-menu .context-menu-item i {\n  width: 16px;\n  text-align: center;\n  color: var(--mj-text-secondary);\n}\n\n.context-menu .context-menu-item:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.context-menu .context-menu-divider {\n  height: 1px;\n  background: var(--mj-border-default);\n  margin: 4px 0;\n}\n\n/* Context menu item variants */\n.context-menu-item.new-item i { color: var(--mj-brand-primary); }\n.context-menu-item.new-item { font-weight: 500; }\n.context-menu-item.disabled { color: var(--mj-text-disabled); cursor: default; }\n.context-menu-item.disabled:hover { background: transparent; }\n.context-menu-item.disabled i { color: var(--mj-text-disabled); }\n.context-menu-item .check { margin-left: auto; color: var(--mj-status-success); font-size: 12px; }\n\n/* Override Golden Layout styles */\n/* Global overrides */\n\n/* Ensure GL root container fills available space */\nmj-tab-container .lm_goldenlayout {\n  width: 100% !important;\n  height: 100% !important;\n}\n\n/* Ensure the root layout item fills space */\nmj-tab-container .lm_root {\n  width: 100% !important;\n  height: 100% !important;\n}\n\n/* Ensure proper box-sizing for all GL layout elements */\nmj-tab-container .lm_item,\nmj-tab-container .lm_content,\nmj-tab-container .lm_stack,\nmj-tab-container .lm_row,\nmj-tab-container .lm_column {\n  box-sizing: border-box !important;\n}\n\n/* Ensure layout items don't overflow */\nmj-tab-container .lm_item {\n  overflow: hidden !important;\n}\n\n/* SPLIT panes get a subtle frame so side-by-side content doesn't bleed\n   together (single-pane layouts stay frameless). \"Adjacent to a splitter\"\n   is exactly and only the split case \u2014 any orientation, any nesting. */\nmj-tab-container .lm_stack:has(+ .lm_splitter),\nmj-tab-container .lm_splitter + .lm_stack {\n  border: 1px solid var(--mj-border-default) !important;\n}\n\n/* Fix for .lm_items - the content container inside stacks */\n/* This is separate from .lm_item - it holds the actual tab content */\nmj-tab-container .lm_items {\n  width: 100% !important;\n  height: calc(100% - 38px) !important; /* Account for header height (38px) */\n  box-sizing: border-box !important;\n  position: relative !important;\n}\n\n/* When tabs are maximized, no header visible */\nmj-tab-container .lm_stack.lm_maximised > .lm_items {\n  height: 100% !important;\n}\n\n/* Target the anonymous ComponentItem div inside lm_items (has no class) */\n/* Created in golden-layout/src/ts/items/component-item.ts:51 without a class */\n/* NOTE: Do NOT set display here - GL uses display:none to hide inactive tabs */\nmj-tab-container .lm_items > div {\n  width: 100% !important;\n  height: 100% !important;\n  box-sizing: border-box !important;\n  flex-direction: column !important;\n}\n\n/* Only apply flex display to the active/visible tab content div */\nmj-tab-container .lm_items > div:not([style*=\"display: none\"]) {\n  display: flex !important;\n}\n\n/* Clearfix for float-based row layout - GL uses float:left for horizontal panes */\nmj-tab-container .lm_row::after {\n  content: \"\" !important;\n  display: table !important;\n  clear: both !important;\n}\n\n/* Force content children to respect parent bounds (GL sets pixel widths inline) */\nmj-tab-container .lm_content > * {\n  max-width: 100% !important;\n  width: 100% !important;\n}\n\nmj-tab-container .lm_content {\n  background: var(--mj-bg-page) !important;\n  display: flex !important;\n  flex-direction: column !important;\n  height: 100% !important;\n  width: 100% !important;\n}\n\nmj-tab-container .lm_item_container {\n  background: var(--mj-bg-page) !important;\n}\n\n/* Tab content wrapper - allow scrolling */\n.tab-content-wrapper {\n  overflow: auto !important;\n}\n\n/* Make tabs larger and easier to click */\nmj-tab-container .lm_header {\n  height: 38px !important;\n  padding-top: 2px !important;\n  padding-left: 4px !important;\n  background: var(--mj-bg-surface-sunken) !important;\n  border-bottom: 1px solid var(--mj-border-default) !important;\n  overflow: visible !important;\n  box-sizing: border-box !important;\n}\n\n/* SCROLLING TAB STRIP (browser-tab pattern, Matt's call over GL's overflow\n   dropdown): tabs keep natural width and the strip scrolls horizontally.\n   Works with settingsConfig()'s effectively-infinite tabOverlapAllowance \u2014\n   GL then never re-homes tabs to its dropdown, only writes inline zIndex +\n   negative marginLeft, both neutralized here. Scrollbar hidden per the\n   browser-tab convention; wheel input is translated to horizontal scroll by\n   GoldenLayoutManager.onStripWheel, and activation scrolls the tab into view. */\nmj-tab-container .lm_tabs {\n  height: 36px !important;\n  left: 0;\n  right: 0;\n  overflow-x: auto;\n  overflow-y: hidden;\n  scrollbar-width: none;\n}\n\nmj-tab-container .lm_tabs::-webkit-scrollbar {\n  display: none;\n}\n\n/* Strip nudge arrows \u2014 the VISIBLE overflow affordance (created by\n   GoldenLayoutManager.updateStripNudges, one pair per header, [hidden]\n   unless that direction has more tabs). The gradient doubles as the\n   \"content continues\" edge fade. */\nmj-tab-container .mj-strip-nudge {\n  position: absolute;\n  top: 0;\n  height: 36px;\n  width: 28px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border: none;\n  padding: 0;\n  margin: 0;\n  z-index: 3; /* above tabs (z 1/2) within the header context */\n  font-size: 11px;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n}\n\nmj-tab-container .mj-strip-nudge[hidden] {\n  display: none;\n}\n\nmj-tab-container .mj-strip-nudge--left {\n  left: 0;\n  background: linear-gradient(to right, var(--mj-bg-surface-sunken) 55%, transparent);\n  justify-content: flex-start;\n  padding-left: 6px;\n}\n\nmj-tab-container .mj-strip-nudge--right {\n  right: 0;\n  background: linear-gradient(to left, var(--mj-bg-surface-sunken) 55%, transparent);\n  justify-content: flex-end;\n  padding-right: 6px;\n}\n\nmj-tab-container .mj-strip-nudge:hover {\n  color: var(--mj-text-primary);\n}\n\nmj-tab-container .mj-strip-nudge:focus-visible {\n  outline: 2px solid var(--mj-border-focus);\n  outline-offset: -2px;\n}\n\n/* Hide Golden Layout WINDOW controls (popout/maximise/stack-close). The\n   scrolling strip replaces GL's lm_tabdropdown overflow menu entirely (it\n   never activates with the infinite overlap allowance). */\nmj-tab-container .lm_controls .lm_popout,\nmj-tab-container .lm_controls .lm_maximise,\nmj-tab-container .lm_controls .lm_close {\n  display: none !important;\n}\n\nmj-tab-container .lm_header .lm_tab {\n  /* Flex centering: the type-icon slot (and any future adornment) must sit\n     on the tab's vertical center \u2014 inline baseline alignment inside the\n     35px line-height text line pushed it ~15px low. */\n  /* FULL FLEX FLOW (Matt's refactor): [type icon] [title] [pin] [close] are\n     ordinary flex siblings \u2014 no absolute anchoring, no padding reservations,\n     no vertical transforms. gap owns horizontal rhythm; align-items owns\n     vertical centering for every child. */\n  display: flex !important;\n  align-items: center !important;\n  gap: 5px !important;\n  padding: 0 9px !important;\n  font-size: 13px !important;\n  height: 35px !important;\n  /* Scrolling strip: tabs are flex items of .lm_tabs \u2014 never let them\n     shrink to \"fit\" (that's what the strip's scroll is for), and zero out\n     the negative overlap margins GL writes inline when tabs overflow. */\n  flex: 0 0 auto !important;\n  margin-left: 0 !important;\n  line-height: 35px !important;\n  box-sizing: border-box !important;\n  cursor: pointer !important;\n  user-select: none !important;\n  background: transparent !important;\n  border: none !important;\n  border-bottom: 1px solid var(--mj-border-default) !important;\n  transition: all 0.15s ease !important;\n  position: relative !important;\n  z-index: 1 !important;\n  margin-right: 1px !important;\n}\n\n/* Pipe separators between INACTIVE tabs (browser-tab pattern): a short\n   centered divider on each tab's right edge establishes separation without\n   boxing every tab. Suppressed around the ACTIVE tab (its raised card has\n   real edges), around the hovered tab, and after the last tab. */\nmj-tab-container .lm_header .lm_tab::after {\n  content: '' !important;\n  position: absolute !important;\n  right: -1px !important;\n  top: 50% !important;\n  transform: translateY(-50%) !important;\n  width: 1px !important;\n  height: 16px !important;\n  background: var(--mj-border-strong) !important;\n}\n\nmj-tab-container .lm_header .lm_tab.lm_active::after,\nmj-tab-container .lm_header .lm_tab:has(+ .lm_tab.lm_active)::after,\nmj-tab-container .lm_header .lm_tab:hover::after,\nmj-tab-container .lm_header .lm_tab:has(+ .lm_tab:hover)::after,\nmj-tab-container .lm_header .lm_tab:last-child::after {\n  content: none !important;\n}\n\n/* Type-icon slot (Matt's tab design, 2026-07-29): every tab leads with its\n   TYPE icon tinted in the app color \u2014 entity icon for records, nav-item/app\n   icon for pages. The old 3px app-color left-edge bar is GONE; the icon\n   tint carries app identity now. Hovering the TAB swaps the icon to an\n   ellipsis: the slot is the visible \"this tab has actions\" affordance \u2014\n   clicking it opens the tab-actions menu (same menu as right-click). */\nmj-tab-container .lm_header .lm_tab .mj-tab-type-slot {\n  display: inline-flex !important;\n  align-items: center !important;\n  justify-content: center !important;\n  /* 24px = WCAG 2.2 AA minimum pointer target (SC 2.5.8); glyph stays 12px */\n  width: 24px !important;\n  height: 24px !important;\n  border-radius: 5px !important;\n  flex-shrink: 0 !important;\n  cursor: pointer !important;\n  /* The slot is a real <button> now \u2014 neutralize UA button chrome */\n  background: transparent !important;\n  border: none !important;\n  padding: 0 !important;\n  font: inherit !important;\n  color: inherit !important;\n}\n\n/* Keyboard parity with hover: focused slot shows the dots + house focus\n   ring (outline idiom \u2014 GL headers clip box-shadows). */\nmj-tab-container .lm_header .lm_tab .mj-tab-type-slot:focus-visible {\n  outline: 2px solid var(--mj-border-focus) !important;\n  outline-offset: -2px !important;\n}\nmj-tab-container .lm_header .lm_tab .mj-tab-type-slot:focus-visible .mj-tab-type-ico {\n  display: none !important;\n}\nmj-tab-container .lm_header .lm_tab .mj-tab-type-slot:focus-visible .mj-tab-dots {\n  display: inline-block !important;\n}\n/* GL's base stylesheet styles EVERY `i` inside a tab as its legacy 2x19px\n   absolutely-positioned corner decoration (.lm_header .lm_tab i) \u2014 which\n   turns our icon elements into slivers the glyph overflows. Restore normal\n   flow for the slot's icons. */\nmj-tab-container .lm_header .lm_tab .mj-tab-type-slot i {\n  position: static !important;\n  width: auto !important;\n  height: auto !important;\n}\n\nmj-tab-container .lm_header .lm_tab .mj-tab-type-ico {\n  color: var(--app-color, var(--mj-text-muted)) !important;\n  font-size: 12px !important;\n  line-height: 1 !important;\n}\nmj-tab-container .lm_header .lm_tab .mj-tab-dots {\n  display: none !important;\n  color: var(--mj-text-secondary) !important;\n  font-size: 12px !important;\n  line-height: 1 !important;\n}\nmj-tab-container .lm_header .lm_tab:hover .mj-tab-type-ico {\n  display: none !important;\n}\nmj-tab-container .lm_header .lm_tab:hover .mj-tab-dots {\n  display: inline-block !important;\n}\nmj-tab-container .lm_header .lm_tab .mj-tab-type-slot:hover {\n  background: var(--mj-bg-surface-hover) !important;\n}\nmj-tab-container .lm_header .lm_tab .mj-tab-type-slot:hover .mj-tab-dots {\n  color: var(--mj-text-primary) !important;\n}\n\nmj-tab-container .lm_header .lm_tab:hover {\n  background: var(--mj-bg-surface-hover) !important;\n}\n\n\nmj-tab-container .lm_header .lm_tab.lm_active {\n  background: var(--mj-bg-surface) !important;\n  height: 36px !important;\n  margin-bottom: -1px !important;\n  margin-right: 0 !important;\n  border: 1px solid var(--mj-border-default) !important;\n  border-bottom-color: var(--mj-bg-surface) !important;\n  border-radius: 4px 4px 0 0 !important;\n  z-index: 2 !important;\n}\n\n\nmj-tab-container .lm_title {\n  cursor: pointer !important;\n  user-select: none !important;\n  /* In-flow flex child: normalize the inherited 35px line-height so the\n     text box is glyph-height and centers identically to its siblings;\n     truncate instead of colliding when GL constrains tab width. */\n  line-height: normal !important;\n  flex: 0 1 auto !important;\n  min-width: 0 !important;\n  overflow: hidden !important;\n  text-overflow: ellipsis !important;\n  white-space: nowrap !important;\n  /* Glyph-overhang room: italics (unpinned tabs) paint past the last\n     glyph's advance width, and overflow:hidden clips at the padding edge \u2014\n     without this the final letter loses its slant. */\n  padding-right: 3px !important;\n}\n\nmj-tab-container .lm_close_tab {\n  position: static !important;\n  order: 10 !important;\n  transform: none !important;\n  margin: 0 !important;\n  /* 24px WCAG target; glyph stays 10px */\n  width: 24px !important;\n  height: 24px !important;\n  border-radius: 5px !important;\n  cursor: pointer !important;\n  /* ALWAYS visible (Matt's call): quiet at rest, full on its own hover/focus.\n     Discoverability shouldn't depend on hovering. */\n  opacity: 0.55 !important;\n  transition: opacity 0.15s ease !important;\n  flex-shrink: 0 !important;\n  display: flex !important;\n  align-items: center !important;\n  justify-content: center !important;\n  font-size: 10px !important;\n  color: var(--mj-text-secondary) !important;\n}\n\nmj-tab-container .lm_close_tab:focus-visible {\n  outline: 2px solid var(--mj-border-focus) !important;\n  outline-offset: -2px !important;\n  opacity: 1 !important;\n}\n\nmj-tab-container .lm_close_tab:hover {\n  opacity: 1 !important;\n  color: var(--mj-status-error) !important;\n  /* background-COLOR, never the shorthand: GL's stock close was a\n     background-image PNG and the shorthand silently wiped it (now it's an\n     FA ::before glyph, but the discipline stands). */\n  background-color: var(--mj-bg-surface-hover) !important;\n}\n\n/* Pinned tabs never show close button (the pin control replaces it) */\nmj-tab-container .lm_header .lm_tab.pinned .lm_close_tab {\n  display: none !important;\n}\n\n\n"] }]
-    }], () => [{ type: i1.GoldenLayoutManager }, { type: i1.WorkspaceStateManager }, { type: i1.ApplicationManager }, { type: i0.ApplicationRef }, { type: i0.EnvironmentInjector }, { type: i0.ChangeDetectorRef }], { glContainer: [{
+    }], () => [{ type: i1.GoldenLayoutManager }, { type: i1.WorkspaceStateManager }, { type: i1.ApplicationManager }, { type: i0.ApplicationRef }, { type: i0.EnvironmentInjector }, { type: i0.ChangeDetectorRef }], { GlContainer: [{
             type: ViewChild,
             args: ['glContainer', { static: false }]
-        }], directContentContainer: [{
+        }], DirectContentContainer: [{
             type: ViewChild,
             args: ['directContentContainer', { static: false }]
-        }], recordsGlContainer: [{
+        }], RecordsGlContainer: [{
             type: ViewChild,
             args: ['recordsGlContainer', { static: false }]
+        }], FirstResourceLoadComplete: [{
+            type: Output
         }], firstResourceLoadComplete: [{
             type: Output
+        }], LayoutInitError: [{
+            type: Output
         }], layoutInitError: [{
             type: Output
         }], onWindowResize: [{