@flyingrobots/bijou-tui 7.2.0 → 8.0.0-rc.1

package/dist/app-frame.js

@@ -1,1809 +1,5 @@
 /**
- * `appFrame()` — high-level TEA app shell.
- *
- * Provides tabs, pane focus/scroll isolation, shell key handling, help,
- * panel-scoped overlay context, and optional frame-level command palette.
+ * Public facade for the high-level TEA application frame.
  */
-import { cloneContextWithResolvedTheme, createSurface, perfOverlaySurface, setDefaultContext, resolveClock, resolveSafeCtx, } from '@flyingrobots/bijou';
-import { createKeyMap, formatKeyCombo } from './keybindings.js';
-import { isKeyMsg, isMouseMsg, isResizeMsg } from './types.js';
-import { quit } from './commands.js';
-import { runWithLifecycleHooks } from './runtime.js';
-import { compositeSurfaceInto, modal } from './overlay.js';
-import { isShellQuitConfirmAccept, isShellQuitConfirmDismiss, isShellQuitRequest, renderShellQuitOverlay, shouldUseShellQuitConfirm, } from './shell-quit.js';
-import { commandPaletteSurface, commandPaletteKeyMap, } from './command-palette.js';
-import { restoreLayoutState } from './layout-preset.js';
-import { createNotificationState, dismissNotification, hitTestNotificationStack, notificationsNeedTick, pushNotification, renderNotificationStack, tickNotifications, trimNotificationsToViewport, } from './notification.js';
-import { isFrameScopedMsg, isPageScopedMsg, wrapCmdForPage, emitMsg, emitMsgForPage, wrapFrameMsg, } from './app-frame-types.js';
-import { createFrameKeyMap, frameBodyRect, mergeBindingSources, resolveFramePageText, } from './app-frame-utils.js';
-import { renderHelpOverlay, isHelpScrollAction, resolveFrameShellThemeChoices, resolveCurrentShellTheme, resolveNextShellTheme, resolveShellThemeModeToggle, resolveShellThemeForContext, resolveFrameSettings, resolveFrameNotificationCenter, resolveSettingsLayout, resolveNotificationCenterLayout, resolveInputAreas, findInputAreaByPaneId, moveSettingsFocus, scrollSettingsBy, clampSettingsScroll, scrollNotificationCenterBy, cycleNotificationCenterFilter, clampSettingsFocus, renderSettingsDrawer, renderNotificationCenterDrawer, resolveNotificationFooterCue, } from './app-frame-overlays.js';
-import { activeFrameLayer, describeFrameRuntimeViewStack, projectFrameControls, } from './app-frame-layers.js';
-import { applyRuntimeCommandBuffer, bufferRuntimeRouteResult, createRuntimeBuffers, createRuntimeRetainedLayouts, retainRuntimeLayout, routeRuntimeInput, } from './runtime-engine.js';
-import { frameMessage, frameNotificationFilterLabel, } from './app-frame-i18n.js';
-import { resolveHeaderLine, renderHelpLine, renderPageContent, renderPageContentInto, renderMaximizedPane, renderMaximizedPaneInto, renderTransition, createFramePaneScratchPool, } from './app-frame-render.js';
-import { applyFrameAction, scrollFocusedPane, switchTab, syncPageFrameState, } from './app-frame-actions.js';
-import { handlePaletteKey, openCommandPalette, openSearchPalette, } from './app-frame-palette.js';
-/** Stable values for shell theme mode siblings. */
-export const FRAME_SHELL_THEME_MODE_SUPPORT = Object.freeze({
-    single: 'single',
-    paired: 'paired',
-});
-export { FRAME_MSG_TOKEN, PAGE_MSG_TOKEN, emitMsg, emitFrameAction, emitMsgForPage, isFrameScopedMsg, isPageScopedMsg, notify, wrapCmdForPage, wrapFrameMsg, wrapPageMsg, } from './app-frame-types.js';
-export { activeFrameLayer, describeFrameLayerStack, describeFrameRuntimeViewStack, projectFrameControls, underlyingFrameLayer, } from './app-frame-layers.js';
-// ---------------------------------------------------------------------------
-// Frame Notification Helpers
-// ---------------------------------------------------------------------------
-const FRAME_NOTIFICATION_TICK_MS = 40;
-const DEFAULT_FRAME_NOTIFICATION_DURATION_MS = 6_000;
-const SETTINGS_FEEDBACK_TOAST_WIDTH = 40;
-const EMPTY_RUNTIME_LAYOUTS = createRuntimeRetainedLayouts();
-function createQuitHelpKeys(i18n) {
-    const t = (id, fallback) => frameMessage(i18n, id, fallback);
-    return createKeyMap()
-        .group(t('help.group.quit', 'Quit'), (g) => g
-        .bind('q', t('help.key.quit', 'Quit'), { type: 'toggle-help' })
-        .bind('escape', t('help.key.quit', 'Quit'), { type: 'toggle-help' })
-        .bind('ctrl+c', t('help.key.quit', 'Quit'), { type: 'toggle-help' }));
-}
-function createHelpLayerHelpKeys(i18n) {
-    const t = (id, fallback) => frameMessage(i18n, id, fallback);
-    return createKeyMap()
-        .group(t('help.group.help', 'Help'), (g) => g
-        .bind('escape', t('help.key.closeHelp', 'Close help'), { type: 'noop' })
-        .bind('?', t('help.key.closeHelp', 'Close help'), { type: 'noop' })
-        .bind('up', t('key.scrollUp', 'Scroll up'), { type: 'noop' })
-        .bind('down', t('key.scrollDown', 'Scroll down'), { type: 'noop' })
-        .bind('j', t('key.scrollDown', 'Scroll down'), { type: 'noop' })
-        .bind('k', t('key.scrollUp', 'Scroll up'), { type: 'noop' })
-        .bind('d', t('key.pageDown', 'Page down'), { type: 'noop' })
-        .bind('u', t('key.pageUp', 'Page up'), { type: 'noop' })
-        .bind('g', t('key.top', 'Top'), { type: 'noop' })
-        .bind('shift+g', t('key.bottom', 'Bottom'), { type: 'noop' }));
-}
-function createSettingsHelpKeys(i18n) {
-    const t = (id, fallback) => frameMessage(i18n, id, fallback);
-    return createKeyMap()
-        .group(t('help.group.settings', 'Settings'), (g) => g
-        .bind('escape', t('help.key.closeSettings', 'Close settings'), { type: 'toggle-settings' })
-        .bind('f2', t('help.key.closeSettings', 'Close settings'), { type: 'toggle-settings' })
-        .bind('up', t('help.key.previousRow', 'Previous row'), { type: 'scroll-up' })
-        .bind('down', t('help.key.nextRow', 'Next row'), { type: 'scroll-down' })
-        .bind('enter', t('help.key.activateSetting', 'Activate setting'), { type: 'toggle-settings' })
-        .bind('space', t('help.key.activateSetting', 'Activate setting'), { type: 'toggle-settings' })
-        .bind('j', t('key.scrollDown', 'Scroll down'), { type: 'scroll-down' })
-        .bind('k', t('key.scrollUp', 'Scroll up'), { type: 'scroll-up' })
-        .bind('d', t('key.pageDown', 'Page down'), { type: 'page-down' })
-        .bind('u', t('key.pageUp', 'Page up'), { type: 'page-up' })
-        .bind('g', t('key.top', 'Top'), { type: 'top' })
-        .bind('shift+g', t('key.bottom', 'Bottom'), { type: 'bottom' })
-        .bind('/', t('key.search', 'Search'), { type: 'open-search' })
-        .bind('ctrl+p', t('key.openPalette', 'Open command palette'), { type: 'open-palette' })
-        .bind(':', t('key.openPalette', 'Open command palette'), { type: 'open-palette' })
-        .bind('?', t('key.toggleHelp', 'Toggle help'), { type: 'toggle-help' }));
-}
-function createNotificationCenterHelpKeys(i18n) {
-    const t = (id, fallback) => frameMessage(i18n, id, fallback);
-    return createKeyMap()
-        .group(t('help.group.notifications', 'Notifications'), (g) => g
-        .bind('shift+n', t('help.key.closeNotifications', 'Close notification center'), { type: 'noop' })
-        .bind('up', t('key.scrollUp', 'Scroll up'), { type: 'noop' })
-        .bind('down', t('key.scrollDown', 'Scroll down'), { type: 'noop' })
-        .bind('j', t('key.scrollDown', 'Scroll down'), { type: 'noop' })
-        .bind('k', t('key.scrollUp', 'Scroll up'), { type: 'noop' })
-        .bind('d', t('key.pageDown', 'Page down'), { type: 'noop' })
-        .bind('u', t('key.pageUp', 'Page up'), { type: 'noop' })
-        .bind('g', t('key.top', 'Top'), { type: 'noop' })
-        .bind('shift+g', t('key.bottom', 'Bottom'), { type: 'noop' })
-        .bind('f', t('help.key.cycleFilter', 'Cycle filter'), { type: 'noop' })
-        .bind('/', t('key.search', 'Search'), { type: 'noop' })
-        .bind('ctrl+p', t('key.openPalette', 'Open command palette'), { type: 'noop' })
-        .bind(':', t('key.openPalette', 'Open command palette'), { type: 'noop' })
-        .bind('?', t('key.toggleHelp', 'Toggle help'), { type: 'noop' }));
-}
-function createQuitConfirmHelpKeys(i18n) {
-    const t = (id, fallback) => frameMessage(i18n, id, fallback);
-    return createKeyMap()
-        .group(t('help.group.quit', 'Quit'), (g) => g
-        .bind('y', t('help.key.quit', 'Quit'), { type: 'noop' })
-        .bind('enter', t('help.key.quit', 'Quit'), { type: 'noop' })
-        .bind('n', t('help.key.stay', 'Stay'), { type: 'noop' })
-        .bind('escape', t('help.key.stay', 'Stay'), { type: 'noop' })
-        .bind('q', t('help.key.stay', 'Stay'), { type: 'noop' }));
-}
-function resolveFrameNotificationOptions(options) {
-    if (options.runtimeNotifications === false) {
-        return {
-            enabled: false,
-            placement: 'LOWER_RIGHT',
-            durationMs: DEFAULT_FRAME_NOTIFICATION_DURATION_MS,
-            margin: 1,
-            gap: 1,
-            overflow: 'wrap',
-        };
-    }
-    const configured = options.runtimeNotifications === true || options.runtimeNotifications == null
-        ? {}
-        : options.runtimeNotifications;
-    return {
-        enabled: configured.enabled ?? true,
-        placement: configured.placement ?? 'LOWER_RIGHT',
-        durationMs: configured.durationMs ?? DEFAULT_FRAME_NOTIFICATION_DURATION_MS,
-        margin: configured.margin ?? 1,
-        gap: configured.gap ?? 1,
-        overflow: configured.overflow ?? 'wrap',
-    };
-}
-function createFrameNotificationTickCmd() {
-    return async (_emit, caps) => {
-        if (!caps.sleep) {
-            throw new Error('createFrameNotificationTickCmd requires sleep capability');
-        }
-        await caps.sleep(FRAME_NOTIFICATION_TICK_MS);
-        return wrapFrameMsg({
-            type: 'notification-tick',
-            atMs: caps.now?.() ?? 0,
-        });
-    };
-}
-function cloneShellThemeContext(ctx, resolvedTheme) {
-    return cloneContextWithResolvedTheme(ctx, resolvedTheme);
-}
-function readStageDuration(timings, stage) {
-    return timings.find((timing) => timing.stage === stage)?.durationMs ?? 0;
-}
-export function summarizeFrameTimings(timings, frameBudgetMs) {
-    const frameTimeMs = timings.reduce((total, timing) => total + timing.durationMs, 0);
-    return {
-        frameTimeMs,
-        viewTimeMs: readStageDuration(timings, 'Layout'),
-        diffTimeMs: readStageDuration(timings, 'Diff'),
-        frameBudgetMs,
-        frameOverBudget: frameBudgetMs != null && frameTimeMs > frameBudgetMs,
-    };
-}
-export function renderFramePerfHudOverlay(telemetry, options = {}) {
-    const refreshRate = telemetry.refreshRate ?? options.ctx?.runtime.refreshRate ?? 60;
-    const fps = telemetry.frameTimeMs > 0
-        ? Math.min(refreshRate, 1000 / telemetry.frameTimeMs)
-        : refreshRate;
-    const width = Math.max(12, Math.min(40, telemetry.columns - 2));
-    const surface = perfOverlaySurface({
-        fps,
-        frameTimeMs: telemetry.frameTimeMs,
-        width: telemetry.columns,
-        height: telemetry.rows,
-        extras: [
-            { label: 'view', value: `${telemetry.viewTimeMs.toFixed(2)} ms` },
-            { label: 'diff', value: `${telemetry.diffTimeMs.toFixed(2)} ms` },
-        ],
-    }, {
-        title: frameMessage(options.i18n, 'perfHud.title', 'Perf HUD'),
-        width,
-        showChart: false,
-        borderToken: options.ctx?.border('primary'),
-        bgToken: options.ctx?.surface('elevated'),
-        ctx: options.ctx,
-    });
-    return {
-        content: '',
-        surface,
-        row: 1,
-        col: Math.max(0, telemetry.columns - surface.width - 1),
-    };
-}
-function applyFrameTimingSnapshot(model, snapshot) {
-    if (model.frameTimeMs === snapshot.frameTimeMs
-        && model.viewTimeMs === snapshot.viewTimeMs
-        && model.diffTimeMs === snapshot.diffTimeMs
-        && model.frameBudgetMs === snapshot.frameBudgetMs
-        && model.frameOverBudget === snapshot.frameOverBudget) {
-        return model;
-    }
-    return {
-        ...model,
-        frameTimeMs: snapshot.frameTimeMs,
-        viewTimeMs: snapshot.viewTimeMs,
-        diffTimeMs: snapshot.diffTimeMs,
-        frameBudgetMs: snapshot.frameBudgetMs,
-        frameOverBudget: snapshot.frameOverBudget,
-    };
-}
-function resolveFrameBudgetMs(runOptions, fallbackCtx) {
-    if (runOptions?.frameBudgetMs != null)
-        return runOptions.frameBudgetMs;
-    const refreshRate = runOptions?.ctx?.runtime.refreshRate ?? fallbackCtx?.runtime.refreshRate;
-    if (refreshRate == null || !Number.isFinite(refreshRate) || refreshRate <= 0) {
-        return undefined;
-    }
-    return 1_000 / refreshRate;
-}
-// Factory
-// ---------------------------------------------------------------------------
-/**
- * Create a fully framed TEA app shell.
- */
-export function createFramedApp(options) {
-    if (options.pages.length === 0) {
-        throw new Error('createFramedApp: "pages" must contain at least one page');
-    }
-    const pagesById = new Map();
-    for (const page of options.pages) {
-        if (pagesById.has(page.id)) {
-            throw new Error(`createFramedApp: duplicate page id "${page.id}"`);
-        }
-        pagesById.set(page.id, page);
-    }
-    const pageOrder = options.pages.map((p) => p.id);
-    const defaultPageId = options.defaultPageId ?? pageOrder.at(0);
-    if (defaultPageId === undefined || !pagesById.has(defaultPageId)) {
-        throw new Error(`createFramedApp: defaultPageId "${String(defaultPageId)}" not found in pages`);
-    }
-    const shellThemeSpecs = options.shellThemes ?? [];
-    let defaultFrameCtx = options.ctx ?? resolveSafeCtx();
-    let resolvedShellThemes = [];
-    const enableShellThemeSettings = shellThemeSpecs.length > 1
-        || shellThemeSpecs.some((theme) => (theme.modes?.length ?? 0) > 1);
-    const usesAmbientDefaultContext = options.ctx == null && defaultFrameCtx != null;
-    let frameCtx = options.ctx;
-    let frameCtxShellThemeId;
-    let useRunScopedFrameCtx = false;
-    function ensureResolvedShellThemes(explicitCtx) {
-        if (shellThemeSpecs.length === 0 || resolvedShellThemes.length > 0)
-            return;
-        const baseCtx = explicitCtx ?? frameCtx ?? options.ctx ?? resolveSafeCtx();
-        if (baseCtx == null) {
-            throw new Error('createFramedApp: shellThemes requires options.ctx, app.run({ ctx }), or a default Bijou context');
-        }
-        defaultFrameCtx ??= baseCtx;
-        resolvedShellThemes = resolveFrameShellThemeChoices(shellThemeSpecs, defaultFrameCtx);
-    }
-    if (frameCtx != null) {
-        ensureResolvedShellThemes(frameCtx);
-        frameCtxShellThemeId = resolveShellThemeForContext(resolvedShellThemes, frameCtx)?.id;
-    }
-    function resolveFrameCtx() {
-        return frameCtx ?? options.ctx ?? resolveSafeCtx();
-    }
-    function resolveFrameThemeCtx(activeShellThemeId) {
-        const baseCtx = resolveFrameCtx();
-        ensureResolvedShellThemes(baseCtx);
-        if (defaultFrameCtx == null)
-            return baseCtx;
-        const activeTheme = resolveCurrentShellTheme(resolvedShellThemes, activeShellThemeId);
-        if (activeTheme == null)
-            return baseCtx;
-        if (frameCtx != null && frameCtxShellThemeId === activeTheme.id) {
-            return frameCtx;
-        }
-        if (resolveShellThemeForContext(resolvedShellThemes, baseCtx)?.id === activeTheme.id) {
-            return baseCtx;
-        }
-        return cloneShellThemeContext(defaultFrameCtx, activeTheme.resolvedTheme);
-    }
-    function publishShellThemeContext(nextTheme) {
-        ensureResolvedShellThemes(resolveFrameCtx());
-        if (defaultFrameCtx == null)
-            return resolveFrameCtx();
-        frameCtx = cloneShellThemeContext(defaultFrameCtx, nextTheme.resolvedTheme);
-        frameCtxShellThemeId = nextTheme.id;
-        if (usesAmbientDefaultContext && !useRunScopedFrameCtx) {
-            setDefaultContext(frameCtx);
-        }
-        options.onShellThemeChange?.({
-            shellTheme: nextTheme.shellTheme,
-            shellThemeSpec: nextTheme.shellThemeSpec,
-            shellThemeId: nextTheme.shellThemeId,
-            shellThemeLabel: nextTheme.shellThemeLabel,
-            modeId: nextTheme.modeId,
-            modeLabel: nextTheme.modeLabel,
-            ctx: frameCtx,
-        });
-        return frameCtx;
-    }
-    const frameKeys = createFrameKeyMap({
-        enableSettings: options.settings != null || enableShellThemeSettings,
-        enableShellThemeModeToggle: shellThemeSpecs.some((theme) => (theme.modes?.length ?? 0) > 1),
-        enableNotifications: options.notificationCenter != null || options.runtimeNotifications !== false,
-        i18n: options.i18n,
-    });
-    const quitHelpKeys = createQuitHelpKeys(options.i18n);
-    const helpLayerHelpKeys = createHelpLayerHelpKeys(options.i18n);
-    const settingsHelpKeys = createSettingsHelpKeys(options.i18n);
-    const notificationCenterHelpKeys = createNotificationCenterHelpKeys(options.i18n);
-    const quitConfirmHelpKeys = createQuitConfirmHelpKeys(options.i18n);
-    const frameNotificationOptions = resolveFrameNotificationOptions(options);
-    let composedFrameScratch = null;
-    let headerScratch;
-    let helpLineScratch;
-    const paneScratchPool = createFramePaneScratchPool();
-    let workspaceLayoutCache;
-    const paletteKeys = commandPaletteKeyMap({
-        focusNext: { type: 'cp-next' },
-        focusPrev: { type: 'cp-prev' },
-        pageDown: { type: 'cp-page-down' },
-        pageUp: { type: 'cp-page-up' },
-        select: { type: 'cp-select' },
-        close: { type: 'cp-close' },
-    });
-    function bindingComboKey(binding) {
-        const combo = binding.combo;
-        return [combo.key, combo.ctrl ? '1' : '0', combo.alt ? '1' : '0', combo.shift ? '1' : '0'].join('|');
-    }
-    function findBindingForMessage(bindings, msg) {
-        const comboKey = [msg.key, msg.ctrl ? '1' : '0', msg.alt ? '1' : '0', msg.shift ? '1' : '0'].join('|');
-        return bindings.find((binding) => binding.enabled && bindingComboKey(binding) === comboKey);
-    }
-    function queueFrameKeyCollisionWarning(model, msg, teaCmds) {
-        if (!frameNotificationOptions.enabled)
-            return model;
-        if ((options.keyPriority ?? 'frame-first') !== 'frame-first')
-            return model;
-        if (model.warnedFrameKeyCollisionPages[model.activePageId])
-            return model;
-        const activePage = pagesById.get(model.activePageId);
-        if (activePage?.keyMap == null)
-            return model;
-        const pageBinding = findBindingForMessage(activePage.keyMap.bindings(), msg);
-        const frameBinding = findBindingForMessage(frameKeys.bindings(), msg);
-        if (pageBinding == null || frameBinding == null)
-            return model;
-        const warningCmd = () => wrapFrameMsg({
-            type: 'runtime-issue',
-            issue: {
-                level: 'warning',
-                source: 'runtime',
-                message: `Page "${model.activePageId}" key binding ${formatKeyCombo(pageBinding.combo)} `
-                    + `("${pageBinding.description}") is shadowed by the frame binding `
-                    + `"${frameBinding.description}" under keyPriority="frame-first". `
-                    + `Use keyPriority: 'page-first' or choose a different page binding.`,
-                atMs: resolveClock(resolveFrameCtx()).now(),
-            },
-        });
-        teaCmds.push(warningCmd);
-        return {
-            ...model,
-            warnedFrameKeyCollisionPages: {
-                ...model.warnedFrameKeyCollisionPages,
-                [model.activePageId]: true,
-            },
-        };
-    }
-    function getComposedFrameScratch(width, height) {
-        if (composedFrameScratch?.width !== width
-            || composedFrameScratch.height !== height) {
-            composedFrameScratch = createSurface(width, height);
-        }
-        return composedFrameScratch;
-    }
-    function closeCommandPalette(model) {
-        return {
-            ...model,
-            commandPalette: undefined,
-            commandPaletteEntries: undefined,
-            commandPaletteTitle: undefined,
-            commandPaletteKind: undefined,
-        };
-    }
-    function applyShellCommand(model, cmd, teaCmds) {
-        switch (cmd.type) {
-            case 'close-help':
-                return { ...model, helpOpen: false, helpScrollY: 0 };
-            case 'close-settings':
-                return { ...model, settingsOpen: false };
-            case 'close-notification-center':
-                return { ...model, notificationCenterOpen: false, notificationCenterScrollY: 0 };
-            case 'close-palette':
-                return closeCommandPalette(model);
-            case 'close-quit-confirm':
-                return { ...model, quitConfirmOpen: false };
-            case 'open-help':
-                return { ...model, helpOpen: true };
-            case 'open-quit-confirm': {
-                if (!shouldUseShellQuitConfirm() || model.quitConfirmOpen)
-                    return model;
-                return {
-                    ...model,
-                    quitConfirmOpen: true,
-                    helpOpen: false,
-                    helpScrollY: 0,
-                    settingsOpen: false,
-                    notificationCenterOpen: false,
-                    commandPalette: undefined,
-                    commandPaletteEntries: undefined,
-                    commandPaletteTitle: undefined,
-                    commandPaletteKind: undefined,
-                };
-            }
-            case 'open-search-palette':
-                return openSearchPalette(model, frameKeys, options, pagesById);
-            case 'open-command-palette':
-                return openCommandPalette(model, frameKeys, options, pagesById);
-            case 'settings-focus-move': {
-                const layout = resolveSettingsLayout(model, options, pagesById, resolvedShellThemes);
-                return layout != null ? moveSettingsFocus(model, layout, cmd.delta) : model;
-            }
-            case 'settings-scroll': {
-                const layout = resolveSettingsLayout(model, options, pagesById, resolvedShellThemes);
-                return layout != null ? scrollSettingsBy(model, layout, cmd.delta) : model;
-            }
-            case 'settings-scroll-to': {
-                const layout = resolveSettingsLayout(model, options, pagesById, resolvedShellThemes);
-                if (layout == null)
-                    return model;
-                return { ...model, settingsScrollY: cmd.position === 'top' ? 0 : layout.maxScrollY };
-            }
-            case 'activate-settings-row': {
-                const layout = resolveSettingsLayout(model, options, pagesById, resolvedShellThemes);
-                if (layout == null)
-                    return model;
-                const hitRow = layout.rows.find((row) => row.index === cmd.rowIndex);
-                if (hitRow == null)
-                    return model;
-                const focusedModel = { ...model, settingsFocusIndex: hitRow.index };
-                if (hitRow.behavior === 'cycle-shell-theme') {
-                    const [nextModel, cmds] = cycleShellThemeSetting(focusedModel, hitRow.row);
-                    teaCmds.push(...cmds);
-                    return nextModel;
-                }
-                if (hitRow.row.action === undefined || hitRow.row.enabled === false || hitRow.row.kind === 'info') {
-                    return focusedModel;
-                }
-                const [nextModel, cmds] = activateSettingsRow(focusedModel, hitRow.row);
-                teaCmds.push(...cmds);
-                return nextModel;
-            }
-            case 'toggle-shell-theme-mode': {
-                const [nextModel, cmds] = toggleShellThemeMode(model);
-                teaCmds.push(...cmds);
-                return nextModel;
-            }
-            case 'notification-center-scroll': {
-                const layout = resolveNotificationCenterLayout(model, options, pagesById, resolveFrameThemeCtx(model.activeShellThemeId));
-                return layout != null ? scrollNotificationCenterBy(model, layout, cmd.delta) : model;
-            }
-            case 'notification-center-scroll-to': {
-                const layout = resolveNotificationCenterLayout(model, options, pagesById, resolveFrameThemeCtx(model.activeShellThemeId));
-                if (layout == null)
-                    return model;
-                return { ...model, notificationCenterScrollY: cmd.position === 'top' ? 0 : layout.maxScrollY };
-            }
-            case 'cycle-notification-filter': {
-                const layout = resolveNotificationCenterLayout(model, options, pagesById, resolveFrameThemeCtx(model.activeShellThemeId));
-                if (layout == null)
-                    return model;
-                const [nextModel, cmds] = cycleNotificationCenterFilter(model, layout);
-                teaCmds.push(...cmds);
-                return nextModel;
-            }
-            case 'warn-frame-key-collision':
-                return queueFrameKeyCollisionWarning(model, cmd.msg, teaCmds);
-            case 'help-scroll': {
-                const helpSource = resolvePresentedLayerContext(model).controlProjection.helpSource;
-                if (helpSource == null)
-                    return model;
-                const overlay = renderHelpOverlay(model, helpSource, options.i18n);
-                const viewportHeight = Math.max(1, overlay.body.height - 1);
-                const delta = cmd.action === 'down' ? 3
-                    : cmd.action === 'up' ? -3
-                        : cmd.action === 'page-down' ? viewportHeight
-                            : cmd.action === 'page-up' ? -viewportHeight
-                                : cmd.action === 'bottom' ? Infinity
-                                    : -Infinity;
-                return { ...model, helpScrollY: Math.max(0, Math.min(overlay.maxScrollY, overlay.scrollY + delta)) };
-            }
-            case 'focus-pane':
-                return focusPane(model, cmd.paneId);
-            case 'scroll-focused-pane':
-                return scrollFocusedPane(model, { type: cmd.direction === 'down' ? 'scroll-down' : 'scroll-up' }, pagesById, options);
-            case 'switch-tab': {
-                const [nextModel, cmds] = switchTab(model, cmd.delta, pagesById, options);
-                teaCmds.push(...cmds);
-                return nextModel;
-            }
-            case 'apply-frame-action': {
-                const [nextModel, cmds] = applyFrameAction(cmd.action, model, options, pagesById);
-                teaCmds.push(...cmds);
-                return nextModel;
-            }
-            case 'palette-key': {
-                const [nextModel, cmds] = handlePaletteKey(cmd.msg, model, paletteKeys, options, pagesById, (action, closedModel) => action.type === 'toggle-shell-theme-mode'
-                    ? toggleShellThemeMode(closedModel)
-                    : undefined);
-                teaCmds.push(...cmds);
-                return nextModel;
-            }
-            case 'emit-page-msg':
-                teaCmds.push(emitMsgForPage(cmd.pageId, cmd.msg));
-                return model;
-            case 'emit-global-msg':
-                teaCmds.push(emitMsg(cmd.msg));
-                return model;
-            case 'quit':
-                teaCmds.push(quit());
-                return model;
-            case 'dismiss-notification': {
-                if (!frameNotificationOptions.enabled)
-                    return model;
-                const nowMs = resolveClock(resolveFrameCtx()).now();
-                const [nextModel, cmds] = applyFrameNotificationState(model, dismissNotification(model.runtimeNotifications, cmd.notificationId, nowMs), nowMs);
-                teaCmds.push(...cmds);
-                return nextModel;
-            }
-            case 'observed-key': {
-                const observed = options.observeKey?.(cmd.msg, cmd.route);
-                if (observed !== undefined)
-                    teaCmds.push(emitMsgForPage(model.activePageId, observed));
-                return model;
-            }
-        }
-    }
-    function drainShellCommandBuffer(model, routeResult) {
-        const buffers = bufferRuntimeRouteResult(createRuntimeBuffers(), routeResult);
-        const teaCmds = [];
-        const { state } = applyRuntimeCommandBuffer(model, buffers.commands, (s, cmd) => applyShellCommand(s, cmd, teaCmds));
-        return [state, teaCmds];
-    }
-    function resolveLayerContext(model) {
-        const activePage = pagesById.get(model.activePageId);
-        const activePageModel = model.pageModels[model.activePageId];
-        if (activePage == null || activePageModel === undefined) {
-            throw new Error(`createFramedApp: active page "${model.activePageId}" is missing`);
-        }
-        const inputAreas = resolveInputAreas(activePage, activePageModel);
-        const activeInputArea = findInputAreaByPaneId(inputAreas, model.focusedPaneByPage[model.activePageId]);
-        const modalKeyMap = activePage.modalKeyMap?.(activePageModel);
-        const pageModalOpen = modalKeyMap != null;
-        const activeLayer = activeFrameLayer(model, { pageModalOpen });
-        return {
-            activePage,
-            activePageModel,
-            inputAreas,
-            activeInputArea,
-            modalKeyMap,
-            pageModalOpen,
-            activeLayer,
-        };
-    }
-    function quitRequestCommands(msg, route) {
-        if (!shouldUseShellQuitConfirm()) {
-            return [{ type: 'observed-key', msg, route }, { type: 'quit' }];
-        }
-        return [{ type: 'observed-key', msg, route }, { type: 'open-quit-confirm' }];
-    }
-    function resolveFrameActionCommands(msg, action, route) {
-        if (action.type === 'open-search' && options.enableCommandPalette) {
-            return [{ type: 'observed-key', msg, route }, { type: 'open-search-palette' }];
-        }
-        if (action.type === 'open-palette' && options.enableCommandPalette) {
-            return [{ type: 'observed-key', msg, route }, { type: 'open-command-palette' }];
-        }
-        if (action.type === 'toggle-shell-theme-mode') {
-            return [{ type: 'observed-key', msg, route }, { type: 'toggle-shell-theme-mode' }];
-        }
-        return [{ type: 'observed-key', msg, route }, { type: 'apply-frame-action', action }];
-    }
-    function handlePaletteLayerKeyCommands(msg, routedLayerKind) {
-        const obs = { type: 'observed-key', msg, route: 'palette' };
-        if (msg.ctrl && !msg.alt && msg.key === 'c') {
-            return quitRequestCommands(msg, 'palette');
-        }
-        if (!msg.ctrl && !msg.alt && !msg.shift && msg.key === 'escape') {
-            return [obs, { type: 'close-palette' }];
-        }
-        const frameAction = frameKeys.handle(msg);
-        if (frameAction?.type === 'open-search') {
-            return routedLayerKind === 'search'
-                ? [obs, { type: 'close-palette' }]
-                : [obs, { type: 'open-search-palette' }];
-        }
-        if (frameAction?.type === 'open-palette') {
-            return routedLayerKind === 'command-palette'
-                ? [obs, { type: 'close-palette' }]
-                : [obs, { type: 'open-command-palette' }];
-        }
-        if (frameAction?.type === 'toggle-shell-theme-mode') {
-            return [obs, { type: 'toggle-shell-theme-mode' }];
-        }
-        if (frameAction?.type === 'toggle-notifications') {
-            return [obs, { type: 'close-palette' }, { type: 'apply-frame-action', action: frameAction }];
-        }
-        if (frameAction?.type === 'toggle-perf-hud') {
-            return [obs, { type: 'apply-frame-action', action: frameAction }];
-        }
-        return [obs, { type: 'palette-key', msg }];
-    }
-    function handleHelpLayerKeyCommands(msg) {
-        const obs = { type: 'observed-key', msg, route: 'help' };
-        if (!msg.ctrl && !msg.alt && (msg.key === '?' || msg.key === 'escape')) {
-            return [obs, { type: 'close-help' }];
-        }
-        if (isShellQuitRequest(msg)) {
-            return quitRequestCommands(msg, 'help');
-        }
-        const helpAction = frameKeys.handle(msg);
-        if (helpAction?.type === 'toggle-shell-theme-mode') {
-            return [obs, { type: 'toggle-shell-theme-mode' }];
-        }
-        if (helpAction?.type === 'toggle-perf-hud') {
-            return [obs, { type: 'apply-frame-action', action: helpAction }];
-        }
-        if (helpAction && isHelpScrollAction(helpAction)) {
-            const action = helpAction.type === 'scroll-down' ? 'down'
-                : helpAction.type === 'scroll-up' ? 'up'
-                    : helpAction.type === 'page-down' ? 'page-down'
-                        : helpAction.type === 'page-up' ? 'page-up'
-                            : helpAction.type === 'bottom' ? 'bottom'
-                                : 'top';
-            return [obs, { type: 'help-scroll', action }];
-        }
-        return [obs];
-    }
-    function handleSettingsLayerKeyCommands(msg, model) {
-        const layout = resolveSettingsLayout(model, options, pagesById, resolvedShellThemes);
-        if (layout == null)
-            return undefined;
-        const obs = { type: 'observed-key', msg, route: 'frame' };
-        if (!msg.ctrl && !msg.alt && (msg.key === 'escape' || msg.key === 'f2')) {
-            return [obs, { type: 'close-settings' }];
-        }
-        if (msg.ctrl && !msg.alt && msg.key === ',') {
-            return [obs, { type: 'close-settings' }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === '?') {
-            return [obs, { type: 'open-help' }];
-        }
-        if (isShellQuitRequest(msg)) {
-            return quitRequestCommands(msg, 'frame');
-        }
-        if (options.enableCommandPalette && !msg.ctrl && !msg.alt && msg.key === '/') {
-            return [obs, { type: 'open-search-palette' }];
-        }
-        if (options.enableCommandPalette && ((msg.ctrl && !msg.alt && msg.key === 'p') || (!msg.ctrl && !msg.alt && msg.key === ':'))) {
-            return [obs, { type: 'open-command-palette' }];
-        }
-        const settingsFrameAction = frameKeys.handle(msg);
-        if (settingsFrameAction?.type === 'toggle-shell-theme-mode') {
-            return [obs, { type: 'toggle-shell-theme-mode' }];
-        }
-        if (settingsFrameAction?.type === 'toggle-notifications') {
-            return [obs, { type: 'apply-frame-action', action: settingsFrameAction }];
-        }
-        if (settingsFrameAction?.type === 'toggle-perf-hud') {
-            return [obs, { type: 'apply-frame-action', action: settingsFrameAction }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'up') {
-            return [obs, { type: 'settings-focus-move', delta: -1 }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'down') {
-            return [obs, { type: 'settings-focus-move', delta: 1 }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'j') {
-            return [obs, { type: 'settings-scroll', delta: 1 }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'k') {
-            return [obs, { type: 'settings-scroll', delta: -1 }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'd') {
-            return [obs, { type: 'settings-scroll', delta: Math.max(1, layout.contentHeight - 1) }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'u') {
-            return [obs, { type: 'settings-scroll', delta: -Math.max(1, layout.contentHeight - 1) }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'g') {
-            return [obs, { type: 'settings-scroll-to', position: 'top' }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'G') {
-            return [obs, { type: 'settings-scroll-to', position: 'bottom' }];
-        }
-        if (!msg.ctrl && !msg.alt && (msg.key === 'enter' || msg.key === 'space')) {
-            const rowIndex = clampSettingsFocus(model, layout);
-            const row = layout.rows[rowIndex];
-            if (row != null
-                && row.row.enabled !== false
-                && row.row.kind !== 'info'
-                && (row.behavior === 'cycle-shell-theme' || row.row.action !== undefined)) {
-                return [obs, { type: 'activate-settings-row', rowIndex: row.index }];
-            }
-            return [obs];
-        }
-        return [obs];
-    }
-    function handleNotificationCenterLayerKeyCommands(msg, model) {
-        const layout = resolveNotificationCenterLayout(model, options, pagesById, resolveFrameThemeCtx(model.activeShellThemeId));
-        if (layout == null)
-            return undefined;
-        const obs = { type: 'observed-key', msg, route: 'frame' };
-        if (!msg.ctrl && !msg.alt && msg.key === 'escape') {
-            return [obs, { type: 'close-notification-center' }];
-        }
-        if (isShellQuitRequest(msg)) {
-            return quitRequestCommands(msg, 'frame');
-        }
-        const centerFrameAction = frameKeys.handle(msg);
-        if (centerFrameAction?.type === 'toggle-shell-theme-mode') {
-            return [obs, { type: 'toggle-shell-theme-mode' }];
-        }
-        if (centerFrameAction?.type === 'toggle-notifications') {
-            return [obs, { type: 'apply-frame-action', action: centerFrameAction }];
-        }
-        if (centerFrameAction?.type === 'toggle-perf-hud') {
-            return [obs, { type: 'apply-frame-action', action: centerFrameAction }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'f2') {
-            return [obs, { type: 'close-notification-center' }, { type: 'apply-frame-action', action: { type: 'toggle-settings' } }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === '?') {
-            return [obs, { type: 'close-notification-center' }, { type: 'open-help' }];
-        }
-        if (options.enableCommandPalette && !msg.ctrl && !msg.alt && msg.key === '/') {
-            return [obs, { type: 'close-notification-center' }, { type: 'open-search-palette' }];
-        }
-        if (options.enableCommandPalette && ((msg.ctrl && !msg.alt && msg.key === 'p') || (!msg.ctrl && !msg.alt && msg.key === ':'))) {
-            return [obs, { type: 'close-notification-center' }, { type: 'open-command-palette' }];
-        }
-        if (!msg.ctrl && !msg.alt && (msg.key === 'up' || msg.key === 'k')) {
-            return [obs, { type: 'notification-center-scroll', delta: -1 }];
-        }
-        if (!msg.ctrl && !msg.alt && (msg.key === 'down' || msg.key === 'j')) {
-            return [obs, { type: 'notification-center-scroll', delta: 1 }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'd') {
-            return [obs, { type: 'notification-center-scroll', delta: Math.max(1, layout.contentHeight - 2) }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'u') {
-            return [obs, { type: 'notification-center-scroll', delta: -Math.max(1, layout.contentHeight - 2) }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'g') {
-            return [obs, { type: 'notification-center-scroll-to', position: 'top' }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'G') {
-            return [obs, { type: 'notification-center-scroll-to', position: 'bottom' }];
-        }
-        if (!msg.ctrl && !msg.alt && msg.key === 'f') {
-            return [obs, { type: 'cycle-notification-filter' }];
-        }
-        return [obs];
-    }
-    function handleWorkspaceLayerKeyCommands(msg, model) {
-        if (isShellQuitRequest(msg)) {
-            return quitRequestCommands(msg, 'frame');
-        }
-        const context = resolveLayerContext(model);
-        const { activePage, activeInputArea } = context;
-        const paneAction = activeInputArea?.keyMap?.handle(msg);
-        const pageAction = activePage.keyMap?.handle(msg);
-        const globalAction = options.globalKeys?.handle(msg);
-        const frameAction = frameKeys.handle(msg);
-        const keyPriority = options.keyPriority ?? 'frame-first';
-        if (keyPriority === 'page-first') {
-            if (paneAction !== undefined) {
-                return [{ type: 'observed-key', msg, route: 'page' }, { type: 'emit-page-msg', pageId: model.activePageId, msg: paneAction }];
-            }
-            if (pageAction !== undefined) {
-                return [{ type: 'observed-key', msg, route: 'page' }, { type: 'emit-page-msg', pageId: model.activePageId, msg: pageAction }];
-            }
-            if (globalAction !== undefined) {
-                return [{ type: 'observed-key', msg, route: 'global' }, { type: 'emit-global-msg', msg: globalAction }];
-            }
-            if (frameAction !== undefined) {
-                return resolveFrameActionCommands(msg, frameAction, 'frame');
-            }
-            return [{ type: 'observed-key', msg, route: 'unhandled' }];
-        }
-        // frame-first (default)
-        if (frameAction !== undefined) {
-            return pageAction !== undefined
-                ? [...resolveFrameActionCommands(msg, frameAction, 'frame'), { type: 'warn-frame-key-collision', msg }]
-                : resolveFrameActionCommands(msg, frameAction, 'frame');
-        }
-        if (paneAction !== undefined) {
-            return [{ type: 'observed-key', msg, route: 'page' }, { type: 'emit-page-msg', pageId: model.activePageId, msg: paneAction }];
-        }
-        if (globalAction !== undefined) {
-            return [{ type: 'observed-key', msg, route: 'global' }, { type: 'emit-global-msg', msg: globalAction }];
-        }
-        if (pageAction !== undefined) {
-            return [{ type: 'observed-key', msg, route: 'page' }, { type: 'emit-page-msg', pageId: model.activePageId, msg: pageAction }];
-        }
-        return [{ type: 'observed-key', msg, route: 'unhandled' }];
-    }
-    function resolveRoutedKeyLayer(msg, model) {
-        const context = resolveLayerContext(model);
-        const runtimeStack = describeFrameRuntimeViewStack(model, {
-            pageModalOpen: context.pageModalOpen,
-        });
-        return routeRuntimeInput(runtimeStack, EMPTY_RUNTIME_LAYOUTS, { kind: 'key', key: msg.key }, ({ layer }) => {
-            const frameLayer = layer.model;
-            if (frameLayer == null)
-                return undefined;
-            if (frameLayer.kind === 'search' || frameLayer.kind === 'command-palette') {
-                return { handled: true, commands: handlePaletteLayerKeyCommands(msg, frameLayer.kind) };
-            }
-            if (frameLayer.kind === 'help') {
-                return { handled: true, commands: handleHelpLayerKeyCommands(msg) };
-            }
-            if (frameLayer.kind === 'settings') {
-                const cmds = handleSettingsLayerKeyCommands(msg, model);
-                return cmds != null ? { handled: true, commands: cmds } : { bubble: true };
-            }
-            if (frameLayer.kind === 'notification-center') {
-                const cmds = handleNotificationCenterLayerKeyCommands(msg, model);
-                return cmds != null ? { handled: true, commands: cmds } : { bubble: true };
-            }
-            if (frameLayer.kind === 'quit-confirm') {
-                const obs = { type: 'observed-key', msg, route: 'frame' };
-                const frameAction = frameKeys.handle(msg);
-                if (frameAction?.type === 'toggle-perf-hud') {
-                    return { handled: true, commands: [obs, { type: 'apply-frame-action', action: frameAction }] };
-                }
-                if (isShellQuitConfirmAccept(msg)) {
-                    return { handled: true, commands: [obs, { type: 'close-quit-confirm' }, { type: 'quit' }] };
-                }
-                if (isShellQuitConfirmDismiss(msg)) {
-                    return { handled: true, commands: [obs, { type: 'close-quit-confirm' }] };
-                }
-                return { handled: true, commands: [obs] };
-            }
-            if (frameLayer.kind === 'page-modal') {
-                const { modalKeyMap } = context;
-                const obs = { type: 'observed-key', msg, route: 'page' };
-                const frameAction = frameKeys.handle(msg);
-                if (frameAction?.type === 'toggle-perf-hud') {
-                    return { handled: true, commands: [obs, { type: 'apply-frame-action', action: frameAction }] };
-                }
-                if (modalKeyMap != null) {
-                    const modalAction = modalKeyMap.handle(msg);
-                    if (modalAction !== undefined) {
-                        return { handled: true, commands: [obs, { type: 'emit-page-msg', pageId: model.activePageId, msg: modalAction }] };
-                    }
-                }
-                return { handled: true, commands: [obs] };
-            }
-            // workspace (root layer)
-            return { handled: true, commands: handleWorkspaceLayerKeyCommands(msg, model) };
-        });
-    }
-    function createShellRetainedLayoutNode(id, rect, children) {
-        return {
-            id,
-            rect: {
-                x: rect.col,
-                y: rect.row,
-                width: rect.width,
-                height: rect.height,
-            },
-            children: children ?? [],
-        };
-    }
-    function buildWorkspaceLayoutTreeFromPaneRects(model, paneRects, tabTargets) {
-        const resolvedTabTargets = tabTargets ?? resolveHeaderLine(model, options, pagesById, headerScratch, resolveFrameThemeCtx(model.activeShellThemeId)).tabTargets;
-        const tabChildren = resolvedTabTargets.map((target) => createShellRetainedLayoutNode(`tab:${target.pageId}`, {
-            row: 0,
-            col: target.startCol,
-            width: target.endCol - target.startCol + 1,
-            height: 1,
-        }));
-        const bodyRect = resolveBodyRect(model, options);
-        const paneChildren = [];
-        for (const [paneId, rect] of paneRects.entries()) {
-            paneChildren.push(createShellRetainedLayoutNode(`pane:${paneId}`, rect));
-        }
-        return createShellRetainedLayoutNode('workspace', { row: 0, col: 0, width: model.columns, height: model.rows }, [
-            createShellRetainedLayoutNode('header-bar', { row: 0, col: 0, width: model.columns, height: 1 }, tabChildren),
-            createShellRetainedLayoutNode('workspace-body', bodyRect, paneChildren),
-        ]);
-    }
-    function rememberWorkspaceLayout(model, paneRects, tabTargets) {
-        const activePageId = model.activePageId;
-        const activePageModel = model.pageModels[activePageId];
-        if (activePageModel === undefined) {
-            throw new Error(`createFramedApp: active page model "${activePageId}" is missing`);
-        }
-        const next = {
-            activePageId,
-            activePageModel,
-            columns: model.columns,
-            rows: model.rows,
-            visibilityState: model.minimizedByPage[activePageId],
-            dockState: model.dockStateByPage[activePageId],
-            splitRatioOverrides: model.splitRatioOverrides,
-            maximizedPaneId: model.maximizedPaneByPage[activePageId]?.maximizedPaneId,
-            paneRects,
-            tree: buildWorkspaceLayoutTreeFromPaneRects(model, paneRects, tabTargets),
-        };
-        workspaceLayoutCache = next;
-        return next;
-    }
-    function matchesWorkspaceLayoutCache(model) {
-        if (workspaceLayoutCache == null)
-            return false;
-        const activePageId = model.activePageId;
-        return workspaceLayoutCache.activePageId === activePageId
-            && workspaceLayoutCache.activePageModel === model.pageModels[activePageId]
-            && workspaceLayoutCache.columns === model.columns
-            && workspaceLayoutCache.rows === model.rows
-            && workspaceLayoutCache.visibilityState === model.minimizedByPage[activePageId]
-            && workspaceLayoutCache.dockState === model.dockStateByPage[activePageId]
-            && workspaceLayoutCache.splitRatioOverrides === model.splitRatioOverrides
-            && workspaceLayoutCache.maximizedPaneId === model.maximizedPaneByPage[activePageId]?.maximizedPaneId;
-    }
-    function resolveWorkspaceLayout(model) {
-        if (matchesWorkspaceLayoutCache(model)) {
-            const cached = workspaceLayoutCache;
-            if (cached !== undefined)
-                return cached;
-        }
-        const bodyRect = resolveBodyRect(model, options);
-        const maxState = model.maximizedPaneByPage[model.activePageId];
-        const maximizedPaneId = maxState?.maximizedPaneId;
-        const themedFrameCtx = resolveFrameThemeCtx(model.activeShellThemeId);
-        const renderResult = maximizedPaneId
-            ? renderMaximizedPane(model.activePageId, model, bodyRect, pagesById, maximizedPaneId, paneScratchPool, themedFrameCtx)
-            : renderPageContent(model.activePageId, model, bodyRect, pagesById, themedFrameCtx);
-        return rememberWorkspaceLayout(model, renderResult.paneRects);
-    }
-    function resolveWorkspacePaneRects(model) {
-        return resolveWorkspaceLayout(model).paneRects;
-    }
-    function buildWorkspaceLayoutTree(model) {
-        return resolveWorkspaceLayout(model).tree;
-    }
-    function buildSettingsRowChildren(model, layout) {
-        const scrollY = clampSettingsScroll(model, layout);
-        const viewportTop = 1;
-        const viewportBottom = model.rows - 1;
-        const children = [];
-        for (const flatRow of layout.rows) {
-            const screenRow = flatRow.line - scrollY + viewportTop;
-            const clippedTop = Math.max(viewportTop, screenRow);
-            const clippedBottom = Math.min(viewportBottom, screenRow + flatRow.height);
-            if (clippedTop >= clippedBottom)
-                continue;
-            children.push(createShellRetainedLayoutNode(`settings-row:${String(flatRow.index)}`, {
-                row: clippedTop,
-                col: layout.startCol,
-                width: layout.drawerWidth,
-                height: clippedBottom - clippedTop,
-            }));
-        }
-        return children;
-    }
-    function nodeIdSuffix(node, prefix) {
-        const id = node.id;
-        return id?.startsWith(prefix) === true ? id.slice(prefix.length) : undefined;
-    }
-    function resolveFrameMouseRuntimeLayouts(model) {
-        let layouts = EMPTY_RUNTIME_LAYOUTS;
-        const settingsLayout = model.settingsOpen
-            ? resolveSettingsLayout(model, options, pagesById, resolvedShellThemes)
-            : undefined;
-        if (settingsLayout != null) {
-            layouts = retainRuntimeLayout(layouts, {
-                viewId: 'settings',
-                tree: createShellRetainedLayoutNode('settings-drawer', {
-                    row: 0,
-                    col: settingsLayout.startCol,
-                    width: settingsLayout.drawerWidth,
-                    height: model.rows,
-                }, buildSettingsRowChildren(model, settingsLayout)),
-            });
-        }
-        const notificationCenterLayout = model.notificationCenterOpen
-            ? resolveNotificationCenterLayout(model, options, pagesById, resolveFrameThemeCtx(model.activeShellThemeId))
-            : undefined;
-        if (notificationCenterLayout != null) {
-            layouts = retainRuntimeLayout(layouts, {
-                viewId: 'notification-center',
-                tree: createShellRetainedLayoutNode('notification-center-drawer', {
-                    row: 0,
-                    col: notificationCenterLayout.startCol,
-                    width: notificationCenterLayout.drawerWidth,
-                    height: model.rows,
-                }),
-            });
-        }
-        layouts = retainRuntimeLayout(layouts, {
-            viewId: 'workspace',
-            tree: buildWorkspaceLayoutTree(model),
-        });
-        return layouts;
-    }
-    function resolveRoutedMouseLayer(msg, model) {
-        const context = resolveLayerContext(model);
-        const { activePageModel, inputAreas } = context;
-        const runtimeStack = describeFrameRuntimeViewStack(model, {
-            pageModalOpen: context.pageModalOpen,
-        });
-        return routeRuntimeInput(runtimeStack, resolveFrameMouseRuntimeLayouts(model), {
-            kind: 'pointer',
-            action: msg.action,
-            x: msg.col,
-            y: msg.row,
-            button: msg.button === 'none' ? undefined : msg.button,
-        }, ({ layer, hit }) => {
-            const frameLayer = layer.model;
-            if (frameLayer == null)
-                return undefined;
-            const cmds = [];
-            if (frameLayer.kind === 'help') {
-                if (msg.action === 'scroll-up' || msg.action === 'scroll-down') {
-                    cmds.push({ type: 'help-scroll', action: msg.action === 'scroll-down' ? 'down' : 'up' });
-                }
-                return { handled: true, commands: cmds };
-            }
-            if (frameLayer.kind === 'search' || frameLayer.kind === 'command-palette'
-                || frameLayer.kind === 'quit-confirm' || frameLayer.kind === 'page-modal') {
-                return { handled: true };
-            }
-            if (frameLayer.kind === 'settings') {
-                if (hit == null)
-                    return { handled: true };
-                if (msg.action === 'scroll-up' || msg.action === 'scroll-down') {
-                    cmds.push({ type: 'settings-scroll', delta: msg.action === 'scroll-down' ? 3 : -3 });
-                    return { handled: true, commands: cmds };
-                }
-                if (msg.action === 'press' && msg.button === 'left') {
-                    const rowNode = hit.path.find((n) => n.id?.startsWith('settings-row:'));
-                    if (rowNode != null) {
-                        const rowId = nodeIdSuffix(rowNode, 'settings-row:');
-                        if (rowId !== undefined)
-                            cmds.push({ type: 'activate-settings-row', rowIndex: Number.parseInt(rowId, 10) });
-                    }
-                    return { handled: true, commands: cmds };
-                }
-                return { handled: true };
-            }
-            if (frameLayer.kind === 'notification-center') {
-                if (hit == null)
-                    return { handled: true };
-                if (msg.action === 'scroll-up' || msg.action === 'scroll-down') {
-                    cmds.push({ type: 'notification-center-scroll', delta: msg.action === 'scroll-down' ? 3 : -3 });
-                    return { handled: true, commands: cmds };
-                }
-                return { handled: true };
-            }
-            // workspace layer
-            if (msg.action === 'press' && msg.button === 'left') {
-                // notification toast hit-testing (outside retained layouts)
-                if (frameNotificationOptions.enabled) {
-                    const notificationTarget = hitTestNotificationStack(model.runtimeNotifications, {
-                        screenWidth: model.columns,
-                        screenHeight: model.rows,
-                        margin: frameNotificationOptions.margin,
-                        gap: frameNotificationOptions.gap,
-                        ctx: resolveFrameThemeCtx(model.activeShellThemeId) ?? undefined,
-                    }, msg.col, msg.row);
-                    if (notificationTarget?.kind === 'dismiss') {
-                        cmds.push({ type: 'dismiss-notification', notificationId: notificationTarget.item.id });
-                        return { handled: true, commands: cmds };
-                    }
-                    if (notificationTarget != null) {
-                        return { handled: true };
-                    }
-                }
-                // tab click
-                const tabNode = hit?.path.find((n) => n.id?.startsWith('tab:'));
-                const pageId = tabNode == null ? undefined : nodeIdSuffix(tabNode, 'tab:');
-                if (pageId !== undefined) {
-                    const currentIndex = model.pageOrder.indexOf(model.activePageId);
-                    const nextIndex = model.pageOrder.indexOf(pageId);
-                    if (currentIndex >= 0 && nextIndex >= 0 && nextIndex !== currentIndex) {
-                        cmds.push({ type: 'switch-tab', delta: nextIndex - currentIndex });
-                    }
-                    return { handled: true, commands: cmds };
-                }
-                if (msg.row === 0) {
-                    return { handled: true };
-                }
-                // pane click
-                const clickedPaneNode = hit?.path.find((n) => n.id?.startsWith('pane:'));
-                const clickedPaneId = clickedPaneNode == null ? undefined : nodeIdSuffix(clickedPaneNode, 'pane:');
-                if (clickedPaneId !== undefined) {
-                    const paneRects = resolveWorkspacePaneRects(model);
-                    const paneRect = paneRects.get(clickedPaneId);
-                    if (paneRect != null) {
-                        cmds.push({ type: 'focus-pane', paneId: clickedPaneId });
-                        const inputArea = findInputAreaByPaneId(inputAreas, clickedPaneId);
-                        const areaMsg = inputArea?.mouse?.({ msg, model: activePageModel, rect: paneRect });
-                        let routedMsg = msg;
-                        if (areaMsg !== undefined)
-                            routedMsg = areaMsg;
-                        cmds.push({
-                            type: 'emit-page-msg',
-                            pageId: model.activePageId,
-                            msg: routedMsg,
-                        });
-                        return { handled: true, commands: cmds };
-                    }
-                }
-            }
-            if (msg.action === 'scroll-up' || msg.action === 'scroll-down') {
-                const scrollPaneNode = hit?.path.find((n) => n.id?.startsWith('pane:'));
-                const scrollPaneId = scrollPaneNode == null ? undefined : nodeIdSuffix(scrollPaneNode, 'pane:');
-                if (scrollPaneId !== undefined) {
-                    const paneRects = resolveWorkspacePaneRects(model);
-                    const paneRect = paneRects.get(scrollPaneId);
-                    if (paneRect != null) {
-                        cmds.push({ type: 'focus-pane', paneId: scrollPaneId });
-                        const inputArea = findInputAreaByPaneId(inputAreas, scrollPaneId);
-                        const areaMsg = inputArea?.mouse?.({ msg, model: activePageModel, rect: paneRect });
-                        if (areaMsg !== undefined) {
-                            cmds.push({ type: 'emit-page-msg', pageId: model.activePageId, msg: areaMsg });
-                        }
-                        else {
-                            cmds.push({ type: 'scroll-focused-pane', direction: msg.action === 'scroll-down' ? 'down' : 'up' });
-                        }
-                        return { handled: true, commands: cmds };
-                    }
-                }
-            }
-            return { handled: false };
-        });
-    }
-    function resolveWorkspaceHelpSource(activePage, activeInputArea) {
-        return mergeBindingSources(frameKeys, quitHelpKeys, options.globalKeys, activeInputArea?.helpSource ?? activeInputArea?.keyMap, activePage.helpSource ?? activePage.keyMap);
-    }
-    function resolveWorkspaceHintSource(model, activePage, activeInputArea) {
-        const helpLineOverride = options.helpLineSource?.({
-            model,
-            activePage,
-            frameKeys,
-            globalKeys: options.globalKeys,
-        });
-        if (typeof helpLineOverride === 'string') {
-            return helpLineOverride;
-        }
-        return helpLineOverride ?? mergeBindingSources(frameKeys, options.globalKeys, activeInputArea?.helpSource ?? activeInputArea?.keyMap, activePage.helpSource ?? activePage.keyMap);
-    }
-    function resolveLayerMetadata(model, activePage, activePageModel, activeInputArea, modalKeyMap) {
-        const settings = resolveFrameSettings(model, options, pagesById, resolvedShellThemes);
-        const notificationCenter = resolveFrameNotificationCenter(model, options, pagesById);
-        const workspaceHintSource = resolveWorkspaceHintSource(model, activePage, activeInputArea);
-        const workspaceHelpSource = resolveWorkspaceHelpSource(activePage, activeInputArea);
-        const paletteHint = frameMessage(options.i18n, 'palette.hint', 'Enter select • Esc close');
-        const helpHint = frameMessage(options.i18n, 'help.hint', 'j/k scroll • d/u page • g/G top/bottom • mouse wheel • ?/Esc close');
-        const settingsHint = frameMessage(options.i18n, 'settings.footer', 'F2/Esc close • ↑/↓ rows • Enter toggle • / search • q quit');
-        const notificationsHint = frameMessage(options.i18n, 'notifications.footer', 'Shift+N close • f filter • j/k scroll • q quit');
-        const quitHint = frameMessage(options.i18n, 'quit.footer', 'Y Quit • N Stay');
-        const paletteTitle = model.commandPaletteTitle
-            ?? frameMessage(options.i18n, 'palette.title', 'Command Palette');
-        const activePageTitle = resolveFramePageText(activePage.title, activePageModel) ?? '';
-        const searchTitle = model.commandPaletteTitle
-            ?? resolveFramePageText(activePage.searchTitle, activePageModel)
-            ?? frameMessage(options.i18n, 'search.title', 'Search');
-        const notificationsTitle = notificationCenter == null
-            ? frameMessage(options.i18n, 'notifications.title', 'Notifications')
-            : `${notificationCenter.title} • ${frameNotificationFilterLabel(options.i18n, notificationCenter.activeFilter)}`;
-        const pageLayers = activePage.layers?.(activePageModel);
-        const workspaceLayer = {
-            title: activePageTitle,
-            hintSource: workspaceHintSource,
-            helpSource: workspaceHelpSource,
-            ...pageLayers?.workspace,
-        };
-        const pageModalLayer = {
-            title: activePageTitle,
-            hintSource: modalKeyMap ?? activePage.helpSource ?? activePage.keyMap,
-            helpSource: mergeBindingSources(quitHelpKeys, modalKeyMap, activePage.helpSource ?? activePage.keyMap),
-            ...pageLayers?.['page-modal'],
-        };
-        return {
-            workspace: workspaceLayer,
-            'page-modal': pageModalLayer,
-            settings: {
-                title: settings?.title ?? frameMessage(options.i18n, 'settings.title', 'Settings'),
-                hintSource: settingsHint,
-                helpSource: mergeBindingSources(settingsHelpKeys, quitHelpKeys),
-            },
-            help: {
-                title: frameMessage(options.i18n, 'help.title', 'Keyboard Help'),
-                hintSource: helpHint,
-                helpSource: helpLayerHelpKeys,
-            },
-            'notification-center': {
-                title: notificationsTitle,
-                hintSource: notificationsHint,
-                helpSource: mergeBindingSources(notificationCenterHelpKeys, quitHelpKeys),
-            },
-            search: {
-                title: searchTitle,
-                hintSource: paletteHint,
-                helpSource: mergeBindingSources(paletteKeys, quitHelpKeys),
-            },
-            'command-palette': {
-                title: paletteTitle,
-                hintSource: paletteHint,
-                helpSource: mergeBindingSources(paletteKeys, quitHelpKeys),
-            },
-            'quit-confirm': {
-                title: frameMessage(options.i18n, 'quit.title', 'Quit?'),
-                hintSource: quitHint,
-                helpSource: quitConfirmHelpKeys,
-            },
-        };
-    }
-    function resolvePresentedLayerContext(model) {
-        const { activePage, activePageModel, inputAreas, activeInputArea, modalKeyMap, pageModalOpen, } = resolveLayerContext(model);
-        const layerMetadata = resolveLayerMetadata(model, activePage, activePageModel, activeInputArea, modalKeyMap);
-        const controlProjection = projectFrameControls(model, {
-            pageModalOpen,
-            layers: layerMetadata,
-        });
-        return {
-            activePage,
-            activePageModel,
-            inputAreas,
-            activeInputArea,
-            modalKeyMap,
-            pageModalOpen,
-            layerMetadata,
-            controlProjection,
-            layerStack: controlProjection.layerStack,
-            activeLayer: controlProjection.activeLayer,
-            underlyingLayer: controlProjection.underlyingLayer,
-        };
-    }
-    function updateTargetPage(model, targetPageId, targetMsg) {
-        const targetPage = pagesById.get(targetPageId);
-        if (targetPage == null)
-            return [model, []];
-        const pageModel = model.pageModels[targetPageId];
-        if (pageModel === undefined)
-            return [model, []];
-        const updateResult = targetPage.update(targetMsg, pageModel);
-        const [nextPageModel, cmds] = updateResult;
-        const nextModels = { ...model.pageModels, [targetPageId]: nextPageModel };
-        const synced = syncPageFrameState({ ...model, pageModels: nextModels }, targetPageId, pagesById);
-        const wrappedCmds = cmds.map((cmd) => wrapCmdForPage(targetPageId, cmd));
-        return [synced, wrappedCmds];
-    }
-    function applyFrameNotificationState(model, notifications, nowMs, forceTick = false) {
-        const trimmed = trimNotificationsToViewport(notifications, {
-            screenWidth: model.columns,
-            screenHeight: model.rows,
-            margin: frameNotificationOptions.margin,
-            gap: frameNotificationOptions.gap,
-        }, nowMs);
-        const needsTick = notificationsNeedTick(trimmed);
-        const nextModel = {
-            ...model,
-            runtimeNotifications: trimmed,
-            runtimeNotificationLoopActive: needsTick,
-        };
-        if (needsTick && (forceTick || !model.runtimeNotificationLoopActive)) {
-            return [nextModel, [createFrameNotificationTickCmd()]];
-        }
-        return [nextModel, []];
-    }
-    function pushSettingsFeedback(model, row) {
-        if (!frameNotificationOptions.enabled) {
-            return [model, []];
-        }
-        const feedback = row.feedback ?? {
-            title: 'Setting updated',
-            message: `${row.label} updated.`,
-        };
-        const nowMs = resolveClock(resolveFrameCtx()).now();
-        const notifications = pushNotification(model.runtimeNotifications, {
-            title: feedback.title ?? 'Setting updated',
-            message: feedback.message,
-            variant: 'TOAST',
-            tone: feedback.tone ?? 'INFO',
-            width: SETTINGS_FEEDBACK_TOAST_WIDTH,
-            placement: frameNotificationOptions.placement,
-            durationMs: feedback.durationMs ?? 2_500,
-            overflow: frameNotificationOptions.overflow,
-        }, nowMs);
-        return applyFrameNotificationState(model, notifications, nowMs);
-    }
-    function activateSettingsRow(model, row) {
-        if (row.action === undefined || row.enabled === false || row.kind === 'info') {
-            return [model, []];
-        }
-        const cmds = [emitMsgForPage(model.activePageId, row.action)];
-        const [nextModel, notificationCmds] = pushSettingsFeedback(model, row);
-        return [nextModel, [...cmds, ...notificationCmds]];
-    }
-    function cycleShellThemeSetting(model, row) {
-        const nextTheme = resolveNextShellTheme(resolvedShellThemes, model.activeShellThemeId);
-        if (nextTheme == null) {
-            return [model, []];
-        }
-        publishShellThemeContext(nextTheme);
-        const [nextModel, notificationCmds] = pushSettingsFeedback({
-            ...model,
-            activeShellThemeId: nextTheme.id,
-        }, row);
-        return [nextModel, notificationCmds];
-    }
-    function pushShellThemeModeFeedback(model, nextTheme) {
-        if (!frameNotificationOptions.enabled) {
-            return [model, []];
-        }
-        const nowMs = resolveClock(resolveFrameCtx()).now();
-        const notifications = pushNotification(model.runtimeNotifications, {
-            title: frameMessage(options.i18n, 'settings.title', 'Settings'),
-            message: frameMessage(options.i18n, 'settings.shellTheme.feedback', 'Shell theme set to {theme}.', { theme: nextTheme.label }),
-            variant: 'TOAST',
-            tone: 'INFO',
-            width: SETTINGS_FEEDBACK_TOAST_WIDTH,
-            placement: frameNotificationOptions.placement,
-            durationMs: 2_500,
-            overflow: frameNotificationOptions.overflow,
-        }, nowMs);
-        return applyFrameNotificationState(model, notifications, nowMs);
-    }
-    function pushShellThemeModeUnsupportedFeedback(model, currentTheme) {
-        if (!frameNotificationOptions.enabled || currentTheme == null) {
-            return [model, []];
-        }
-        const nowMs = resolveClock(resolveFrameCtx()).now();
-        const notifications = pushNotification(model.runtimeNotifications, {
-            title: frameMessage(options.i18n, 'settings.title', 'Settings'),
-            message: frameMessage(options.i18n, 'settings.shellTheme.modeUnsupported', 'Shell theme {theme} has no alternate mode.', { theme: currentTheme.label }),
-            variant: 'TOAST',
-            tone: 'INFO',
-            width: SETTINGS_FEEDBACK_TOAST_WIDTH,
-            placement: frameNotificationOptions.placement,
-            durationMs: 2_500,
-            overflow: frameNotificationOptions.overflow,
-        }, nowMs);
-        return applyFrameNotificationState(model, notifications, nowMs);
-    }
-    function toggleShellThemeMode(model) {
-        ensureResolvedShellThemes(resolveFrameCtx());
-        const currentTheme = resolveCurrentShellTheme(resolvedShellThemes, model.activeShellThemeId);
-        const nextTheme = resolveShellThemeModeToggle(resolvedShellThemes, model.activeShellThemeId);
-        if (nextTheme == null) {
-            return pushShellThemeModeUnsupportedFeedback(model, currentTheme);
-        }
-        publishShellThemeContext(nextTheme);
-        return pushShellThemeModeFeedback({
-            ...model,
-            activeShellThemeId: nextTheme.id,
-        }, nextTheme);
-    }
-    const app = {
-        init() {
-            const pageModels = {};
-            const initCmds = [];
-            for (const page of options.pages) {
-                const [pageModel, cmds] = page.init();
-                pageModels[page.id] = pageModel;
-                initCmds.push(...cmds.map((cmd) => wrapCmdForPage(page.id, cmd)));
-            }
-            let model = {
-                activePageId: defaultPageId,
-                pageOrder,
-                pageModels,
-                warnedFrameKeyCollisionPages: {},
-                focusedPaneByPage: {},
-                scrollByPage: {},
-                columns: Math.max(1, options.initialColumns ?? 80),
-                rows: Math.max(1, options.initialRows ?? 24),
-                frameTimeMs: 0,
-                viewTimeMs: 0,
-                diffTimeMs: 0,
-                frameBudgetMs: undefined,
-                frameOverBudget: false,
-                perfHudOpen: false,
-                helpOpen: false,
-                footerVisible: true,
-                footerTranslateY: 0,
-                footerAnimationGeneration: 0,
-                helpScrollY: 0,
-                commandPaletteKind: undefined,
-                settingsOpen: false,
-                notificationCenterOpen: false,
-                quitConfirmOpen: false,
-                settingsFocusIndex: 0,
-                settingsScrollY: 0,
-                notificationCenterScrollY: 0,
-                transitionProgress: 1,
-                transitionGeneration: 0,
-                transitionFrame: 0,
-                minimizedByPage: {},
-                maximizedPaneByPage: {},
-                dockStateByPage: {},
-                splitRatioOverrides: {},
-                runtimeNotifications: createNotificationState(),
-                runtimeNotificationHistoryFilter: 'ALL',
-                runtimeNotificationLoopActive: false,
-                activeShellThemeId: undefined,
-            };
-            ensureResolvedShellThemes(resolveFrameCtx());
-            const initialShellTheme = resolveShellThemeForContext(resolvedShellThemes, resolveFrameCtx())
-                ?? resolvedShellThemes[0];
-            model = {
-                ...model,
-                activeShellThemeId: initialShellTheme?.id,
-            };
-            if (initialShellTheme != null) {
-                publishShellThemeContext(initialShellTheme);
-            }
-            for (const pageId of pageOrder) {
-                model = syncPageFrameState(model, pageId, pagesById);
-            }
-            // Apply initial layout if provided
-            if (options.initialLayout) {
-                const restored = restoreLayoutState(options.initialLayout);
-                model = {
-                    ...model,
-                    activePageId: pagesById.has(restored.activePageId) ? restored.activePageId : model.activePageId,
-                    focusedPaneByPage: { ...model.focusedPaneByPage, ...restored.focusedPaneByPage },
-                    minimizedByPage: restored.minimizedByPage,
-                    maximizedPaneByPage: restored.maximizedPaneByPage,
-                    dockStateByPage: restored.dockStateByPage,
-                    splitRatioOverrides: restored.splitRatiosByPage,
-                };
-            }
-            return [model, initCmds];
-        },
-        update(msg, model) {
-            if (isFrameScopedMsg(msg)) {
-                const action = msg.action;
-                if (action.type === 'runtime-issue') {
-                    if (!frameNotificationOptions.enabled)
-                        return [model, []];
-                    const notifications = pushNotification(model.runtimeNotifications, {
-                        title: action.issue.level === 'warning' ? 'Framework warning' : 'Runtime error',
-                        message: action.issue.message,
-                        variant: 'TOAST',
-                        tone: action.issue.level === 'warning' ? 'WARNING' : 'ERROR',
-                        placement: frameNotificationOptions.placement,
-                        durationMs: frameNotificationOptions.durationMs,
-                        overflow: frameNotificationOptions.overflow,
-                    }, action.issue.atMs);
-                    return applyFrameNotificationState(model, notifications, action.issue.atMs);
-                }
-                if (action.type === 'push-notification') {
-                    if (!frameNotificationOptions.enabled)
-                        return [model, []];
-                    const nowMs = resolveClock(resolveFrameCtx()).now();
-                    const notifications = pushNotification(model.runtimeNotifications, {
-                        ...action.notification,
-                        placement: action.notification.placement ?? frameNotificationOptions.placement,
-                        durationMs: action.notification.durationMs === undefined
-                            ? frameNotificationOptions.durationMs
-                            : action.notification.durationMs,
-                        overflow: action.notification.overflow ?? frameNotificationOptions.overflow,
-                    }, nowMs);
-                    return applyFrameNotificationState(model, notifications, nowMs);
-                }
-                if (action.type === 'notification-tick') {
-                    const notifications = tickNotifications(model.runtimeNotifications, action.atMs);
-                    return applyFrameNotificationState(model, notifications, action.atMs, true);
-                }
-                if (action.type === 'toggle-shell-theme-mode') {
-                    return toggleShellThemeMode(model);
-                }
-                if (action.type === 'transition') {
-                    // Ignore stale transition ticks from a previous generation
-                    if (action.generation !== model.transitionGeneration)
-                        return [model, []];
-                    // Advance timeline from deterministic pulse deltas.
-                    if (model.transitionTimeline && model.transitionTimelineState) {
-                        const state = model.transitionTimeline.step(model.transitionTimelineState, Math.max(0, action.dt));
-                        const vals = model.transitionTimeline.values(state);
-                        const progress = Math.min(1, Math.max(0, vals['progress'] ?? action.progress));
-                        if (model.transitionTimeline.done(state) || progress >= 1) {
-                            return [{
-                                    ...model,
-                                    transitionProgress: 1,
-                                    transitionFrame: 0,
-                                    previousPageId: undefined,
-                                    activeTransition: undefined,
-                                    transitionStartMs: undefined,
-                                    transitionTimeline: undefined,
-                                    transitionTimelineState: undefined,
-                                }, []];
-                        }
-                        return [{
-                                ...model,
-                                transitionProgress: progress,
-                                transitionFrame: model.transitionFrame + 1,
-                                transitionTimelineState: state,
-                            }, []];
-                    }
-                    // Fallback for non-timeline transitions (backward compat)
-                    return [{
-                            ...model,
-                            transitionProgress: action.progress,
-                            transitionFrame: model.transitionFrame + 1,
-                        }, []];
-                }
-                if (action.type === 'transition-complete') {
-                    if (action.generation !== model.transitionGeneration)
-                        return [model, []];
-                    return [{
-                            ...model,
-                            transitionProgress: 1,
-                            transitionFrame: 0,
-                            previousPageId: undefined,
-                            activeTransition: undefined,
-                            transitionStartMs: undefined,
-                            transitionTimeline: undefined,
-                            transitionTimelineState: undefined,
-                        }, []];
-                }
-                return applyFrameAction(action, model, options, pagesById);
-            }
-            if (isResizeMsg(msg)) {
-                return [{
-                        ...model,
-                        columns: msg.columns,
-                        rows: msg.rows,
-                    }, []];
-            }
-            if (isKeyMsg(msg)) {
-                return drainShellCommandBuffer(model, resolveRoutedKeyLayer(msg, model));
-            }
-            if (isMouseMsg(msg)) {
-                const mouseRouteResult = resolveRoutedMouseLayer(msg, model);
-                if (mouseRouteResult.handled) {
-                    return drainShellCommandBuffer(model, mouseRouteResult);
-                }
-                return updateTargetPage(model, model.activePageId, msg);
-            }
-            // Custom message path: route to originating page when command messages are scoped.
-            if (isPageScopedMsg(msg)) {
-                return updateTargetPage(model, msg.pageId, msg.msg);
-            }
-            return updateTargetPage(model, model.activePageId, msg);
-        },
-        view(model) {
-            const themedFrameCtx = resolveFrameThemeCtx(model.activeShellThemeId);
-            const { controlProjection, layerStack, activeLayer, } = resolvePresentedLayerContext(model);
-            const headerResult = resolveHeaderLine(model, options, pagesById, headerScratch, themedFrameCtx);
-            headerScratch = headerResult.surface;
-            const header = headerResult.surface;
-            helpLineScratch = renderHelpLine(model, activeLayer, options.i18n, resolveNotificationFooterCue(model, options, pagesById), helpLineScratch, themedFrameCtx);
-            const helpLine = helpLineScratch;
-            const bodyRect = resolveBodyRect(model, options);
-            // Check for maximized pane — if set, render only that pane at full body rect
-            const maxState = model.maximizedPaneByPage[model.activePageId];
-            const maximizedPaneId = maxState?.maximizedPaneId;
-            const frameSurface = getComposedFrameScratch(model.columns, model.rows);
-            // clear() is load-bearing: it resets dim flags left by overlay compositing
-            // on the previous frame. Do not skip or defer this call.
-            frameSurface.clear();
-            frameSurface.blit(header, 0, 0);
-            if (model.rows > 1) {
-                const footerVisible = model.footerVisible ?? true;
-                const footerTranslateY = Math.max(0, Math.min(1, model.footerTranslateY ?? (footerVisible ? 0 : 1)));
-                const footerRow = model.rows - helpLine.height + Math.floor(footerTranslateY * helpLine.height);
-                if (footerRow < model.rows) {
-                    frameSurface.blit(helpLine, 0, footerRow);
-                }
-            }
-            let activeResult;
-            let bodySurface;
-            const activeTransition = model.activeTransition ?? options.transition;
-            if (model.previousPageId != null && model.transitionProgress < 1 && activeTransition && activeTransition !== 'none') {
-                const activeBodyResult = maximizedPaneId
-                    ? renderMaximizedPane(model.activePageId, model, bodyRect, pagesById, maximizedPaneId, paneScratchPool, themedFrameCtx)
-                    : renderPageContent(model.activePageId, model, bodyRect, pagesById, themedFrameCtx);
-                activeResult = activeBodyResult;
-                bodySurface = activeBodyResult.surface;
-                const ctx = themedFrameCtx;
-                if (ctx) {
-                    const prevResult = renderPageContent(model.previousPageId, model, bodyRect, pagesById, themedFrameCtx);
-                    bodySurface = renderTransition(prevResult.surface, activeBodyResult.surface, activeTransition, model.transitionProgress, bodyRect.width, bodyRect.height, ctx, model.transitionFrame);
-                }
-            }
-            else {
-                activeResult = maximizedPaneId
-                    ? renderMaximizedPaneInto(model.activePageId, model, bodyRect, pagesById, maximizedPaneId, frameSurface, bodyRect.row, bodyRect.col, paneScratchPool, themedFrameCtx)
-                    : renderPageContentInto(model.activePageId, model, bodyRect, pagesById, frameSurface, bodyRect.row, bodyRect.col, paneScratchPool, themedFrameCtx);
-            }
-            rememberWorkspaceLayout(model, activeResult.paneRects, headerResult.tabTargets);
-            const overlays = [];
-            if (options.overlayFactory != null) {
-                const activePageModel = model.pageModels[model.activePageId];
-                if (activePageModel === undefined) {
-                    throw new Error(`createFramedApp: active page model "${model.activePageId}" is missing`);
-                }
-                overlays.push(...options.overlayFactory({
-                    activePageId: model.activePageId,
-                    pageModel: activePageModel,
-                    paneRects: activeResult.paneRects,
-                    screenRect: { row: 0, col: 0, width: model.columns, height: model.rows },
-                }));
-            }
-            if (frameNotificationOptions.enabled) {
-                const ctx = themedFrameCtx;
-                overlays.push(...renderNotificationStack(model.runtimeNotifications, {
-                    screenWidth: model.columns,
-                    screenHeight: model.rows,
-                    margin: frameNotificationOptions.margin,
-                    gap: frameNotificationOptions.gap,
-                    ctx: ctx ?? undefined,
-                }));
-            }
-            if (model.settingsOpen) {
-                const settingsLayer = layerStack.find((layer) => layer.kind === 'settings');
-                const settingsOverlay = renderSettingsDrawer(model, options, pagesById, resolvedShellThemes, settingsLayer?.title, themedFrameCtx);
-                if (settingsOverlay != null) {
-                    overlays.push(settingsOverlay);
-                }
-            }
-            if (model.notificationCenterOpen) {
-                const notificationLayer = layerStack.find((layer) => layer.kind === 'notification-center');
-                const notificationCenterOverlay = renderNotificationCenterDrawer(model, options, pagesById, notificationLayer?.title, themedFrameCtx);
-                if (notificationCenterOverlay != null) {
-                    overlays.push(notificationCenterOverlay);
-                }
-            }
-            if (model.helpOpen) {
-                const helpSource = controlProjection.helpSource;
-                if (helpSource == null) {
-                    throw new Error('createFramedApp: help layer projection is missing a help source');
-                }
-                const helpOverlay = renderHelpOverlay(model, helpSource, options.i18n);
-                overlays.push(modal({
-                    title: activeLayer.kind === 'help'
-                        ? (activeLayer.title ?? frameMessage(options.i18n, 'help.title', 'Keyboard Help'))
-                        : frameMessage(options.i18n, 'help.title', 'Keyboard Help'),
-                    body: helpOverlay.body,
-                    hint: typeof activeLayer.hintSource === 'string'
-                        ? activeLayer.hintSource
-                        : frameMessage(options.i18n, 'help.hint', 'j/k scroll • d/u page • g/G top/bottom • mouse wheel • ?/Esc close'),
-                    borderToken: themedFrameCtx?.border('primary'),
-                    bgToken: themedFrameCtx?.surface('elevated'),
-                    ctx: themedFrameCtx,
-                    width: helpOverlay.body.width + 4,
-                    screenWidth: model.columns,
-                    screenHeight: model.rows,
-                }));
-            }
-            if (model.commandPalette != null) {
-                const paletteWidth = Math.max(20, Math.min(80, model.columns - 4));
-                const paletteBody = commandPaletteSurface(model.commandPalette, {
-                    width: Math.max(16, paletteWidth - 4),
-                    ctx: themedFrameCtx,
-                    showScrollbar: false,
-                });
-                const paletteLayer = activeLayer.kind === 'search' || activeLayer.kind === 'command-palette'
-                    ? activeLayer
-                    : undefined;
-                overlays.push(modal({
-                    title: paletteLayer?.title ?? model.commandPaletteTitle ?? frameMessage(options.i18n, 'palette.title', 'Command Palette'),
-                    body: paletteBody,
-                    hint: typeof paletteLayer?.hintSource === 'string'
-                        ? paletteLayer.hintSource
-                        : frameMessage(options.i18n, 'palette.hint', 'Enter select • Esc close'),
-                    borderToken: themedFrameCtx?.border('primary'),
-                    bgToken: themedFrameCtx?.surface('elevated'),
-                    ctx: themedFrameCtx,
-                    width: paletteWidth,
-                    screenWidth: model.columns,
-                    screenHeight: model.rows,
-                }));
-            }
-            if (model.quitConfirmOpen) {
-                overlays.push(renderShellQuitOverlay(model.columns, model.rows, options.i18n, themedFrameCtx));
-            }
-            const dimBackground = overlays.length > 0;
-            if (model.perfHudOpen) {
-                overlays.push(renderFramePerfHudOverlay({
-                    columns: model.columns,
-                    rows: model.rows,
-                    frameTimeMs: model.frameTimeMs,
-                    viewTimeMs: model.viewTimeMs,
-                    diffTimeMs: model.diffTimeMs,
-                    refreshRate: themedFrameCtx?.runtime.refreshRate,
-                }, {
-                    i18n: options.i18n,
-                    ctx: themedFrameCtx,
-                }));
-            }
-            if (bodySurface != null && bodyRect.width > 0 && bodyRect.height > 0) {
-                frameSurface.blit(bodySurface, bodyRect.col, bodyRect.row);
-            }
-            return compositeSurfaceInto(frameSurface, frameSurface, overlays, { dim: dimBackground });
-        },
-        routeRuntimeIssue(issue) {
-            if (!frameNotificationOptions.enabled)
-                return undefined;
-            return wrapFrameMsg({ type: 'runtime-issue', issue });
-        },
-    };
-    function isInternalFrameModel(model) {
-        return 'helpScrollY' in model && 'warnedFrameKeyCollisionPages' in model;
-    }
-    function requireInternalFrameModel(model) {
-        if (isInternalFrameModel(model))
-            return model;
-        throw new Error('createFramedApp: framed runtime received a non-frame model');
-    }
-    let hostedRunActive = false;
-    const framedApp = {
-        init() {
-            return app.init();
-        },
-        update(msg, model) {
-            return app.update(msg, requireInternalFrameModel(model));
-        },
-        view(model) {
-            return app.view(requireInternalFrameModel(model));
-        },
-        routeRuntimeIssue(issue) {
-            return app.routeRuntimeIssue?.(issue);
-        },
-        run: runHostedFramedApp,
-    };
-    async function runHostedFramedApp(runOptions) {
-        if (hostedRunActive) {
-            throw new Error('createFramedApp: concurrent app.run() calls on the same framed app are not supported');
-        }
-        hostedRunActive = true;
-        const previousFrameCtx = frameCtx;
-        const previousFrameCtxShellThemeId = frameCtxShellThemeId;
-        const previousDefaultFrameCtx = defaultFrameCtx;
-        const previousResolvedShellThemes = resolvedShellThemes;
-        const runtimeCtx = runOptions?.ctx;
-        if (runtimeCtx != null && options.ctx == null) {
-            useRunScopedFrameCtx = true;
-            frameCtx = runtimeCtx;
-            defaultFrameCtx = runtimeCtx;
-            resolvedShellThemes = [];
-            ensureResolvedShellThemes(runtimeCtx);
-            frameCtxShellThemeId = resolveShellThemeForContext(resolvedShellThemes, runtimeCtx)?.id;
-        }
-        const frameBudgetMs = resolveFrameBudgetMs(runOptions, resolveFrameCtx());
-        let pendingTimingSnapshot;
-        let needsTimingHydrationRender = true;
-        try {
-            await runWithLifecycleHooks(framedApp, {
-                ...runOptions,
-                mouse: runOptions?.mouse ?? true,
-            }, {
-                beforeRender(model) {
-                    if (pendingTimingSnapshot == null)
-                        return model;
-                    return applyFrameTimingSnapshot(requireInternalFrameModel(model), pendingTimingSnapshot);
-                },
-                afterRender({ timings }) {
-                    pendingTimingSnapshot = summarizeFrameTimings(timings, frameBudgetMs);
-                    if (!needsTimingHydrationRender)
-                        return;
-                    needsTimingHydrationRender = false;
-                    return { requestRender: true };
-                },
-            });
-        }
-        finally {
-            hostedRunActive = false;
-            useRunScopedFrameCtx = false;
-            frameCtx = previousFrameCtx;
-            frameCtxShellThemeId = previousFrameCtxShellThemeId;
-            defaultFrameCtx = previousDefaultFrameCtx;
-            resolvedShellThemes = previousResolvedShellThemes;
-        }
-    }
-    return framedApp;
-}
-/**
- * Create and immediately run a batteries-included framed shell.
- *
- * This is the one-call hosted path for users who want the frame to own the
- * runtime pump while `run(app)` remains the low-level TEA contract.
- */
-export async function runFramedApp(options, runOptions) {
-    await createFramedApp(options).run(runOptions);
-}
-function focusPane(model, paneId) {
-    if (model.focusedPaneByPage[model.activePageId] === paneId)
-        return model;
-    return {
-        ...model,
-        focusedPaneByPage: {
-            ...model.focusedPaneByPage,
-            [model.activePageId]: paneId,
-        },
-    };
-}
-function resolveBodyRect(model, options) {
-    return frameBodyRect(model.columns, model.rows, options.bodyTopRows ?? 1, options.bodyBottomRows ?? 1);
-}
+export { FRAME_MSG_TOKEN, FRAME_SHELL_THEME_MODE_SUPPORT, PAGE_MSG_TOKEN, activeFrameLayer, createFramedApp, describeFrameLayerStack, describeFrameRuntimeViewStack, emitFrameAction, emitMsg, emitMsgForPage, isFrameScopedMsg, isPageScopedMsg, notify, projectFrameControls, renderFramePerfHudOverlay, runFramedApp, summarizeFrameTimings, underlyingFrameLayer, wrapCmdForPage, wrapFrameMsg, wrapPageMsg, } from './app-frame-runtime.js';
 //# sourceMappingURL=app-frame.js.map