sh3-core 0.19.3 → 0.19.6

package/dist/documents/picker-api.test.js

@@ -0,0 +1,132 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { sh3 } from '../sh3Runtime.svelte';
+import { createDocumentPicker } from './picker-primitive';
+vi.mock('../sh3Runtime.svelte', () => ({
+    sh3: {
+        popup: {
+            show: vi.fn(),
+        },
+    },
+}));
+const mockShow = sh3.popup.show;
+function mockPopup() {
+    let capturedCommit = null;
+    let capturedCancel = null;
+    const handle = {
+        close: vi.fn(),
+    };
+    mockShow.mockImplementation((_Content, _opts, props) => {
+        capturedCommit = props.onCommit;
+        capturedCancel = props.onCancel;
+        return handle;
+    });
+    return {
+        commit: (v) => {
+            capturedCommit === null || capturedCommit === void 0 ? void 0 : capturedCommit(v);
+        },
+        cancel: () => {
+            capturedCancel === null || capturedCancel === void 0 ? void 0 : capturedCancel();
+        },
+        dismiss: () => {
+            handle.close();
+        },
+        handle,
+    };
+}
+beforeEach(() => {
+    vi.clearAllMocks();
+});
+describe('createDocumentPicker', () => {
+    const sampleDoc = { shardId: 'my-shard', path: 'readme.md' };
+    describe('open()', () => {
+        it('resolves with OpenerValue when user commits', async () => {
+            const listFn = async () => [{ shardId: 'my-shard', path: 'readme.md', size: 100, lastModified: 0 }];
+            const picker = createDocumentPicker(listFn);
+            const popup = mockPopup();
+            const promise = picker.open();
+            await vi.waitFor(() => expect(mockShow).toHaveBeenCalledOnce());
+            popup.commit(sampleDoc);
+            const result = await promise;
+            expect(result).toEqual({ shardId: 'my-shard', path: 'readme.md' });
+        });
+        it('resolves with null when user cancels', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            const popup = mockPopup();
+            const promise = picker.open();
+            await vi.waitFor(() => expect(mockShow).toHaveBeenCalledOnce());
+            popup.cancel();
+            const result = await promise;
+            expect(result).toBeNull();
+        });
+        it('resolves with null when popup is dismissed externally', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            const popup = mockPopup();
+            const promise = picker.open();
+            await vi.waitFor(() => expect(mockShow).toHaveBeenCalledOnce());
+            popup.dismiss();
+            const result = await promise;
+            expect(result).toBeNull();
+        });
+        it('rejects when listFn fails', async () => {
+            const listFn = async () => { throw new Error('network error'); };
+            const picker = createDocumentPicker(listFn);
+            const promise = picker.open();
+            await expect(promise).rejects.toThrow('network error');
+            expect(mockShow).not.toHaveBeenCalled();
+        });
+        it('uses anchor element position when provided', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            mockPopup();
+            const el = document.createElement('div');
+            picker.open({ anchor: el });
+            await vi.waitFor(() => expect(mockShow).toHaveBeenCalledOnce());
+            const call = mockShow.mock.calls[0];
+            expect(call[1].anchor).toEqual({ x: 0, y: 0 });
+        });
+    });
+    describe('save()', () => {
+        it('resolves with SaverValue string when user commits a filename', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            const popup = mockPopup();
+            const promise = picker.save();
+            await vi.waitFor(() => expect(mockShow).toHaveBeenCalledOnce());
+            popup.commit('my-shard/report.txt');
+            const result = await promise;
+            expect(result).toBe('my-shard/report.txt');
+        });
+        it('resolves with null when user cancels', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            const popup = mockPopup();
+            const promise = picker.save();
+            await vi.waitFor(() => expect(mockShow).toHaveBeenCalledOnce());
+            popup.cancel();
+            const result = await promise;
+            expect(result).toBeNull();
+        });
+        it('passes suggestedName as prop', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            mockPopup();
+            picker.save({ suggestedName: 'draft.txt' });
+            await vi.waitFor(() => expect(mockShow).toHaveBeenCalledOnce());
+            const call = mockShow.mock.calls[0];
+            expect(call[2].suggestedName).toBe('draft.txt');
+        });
+    });
+    it('defaults anchor to viewport center when not provided', async () => {
+        const listFn = async () => [];
+        const picker = createDocumentPicker(listFn);
+        mockPopup();
+        const w = window.innerWidth;
+        const h = window.innerHeight;
+        picker.open();
+        await vi.waitFor(() => expect(mockShow).toHaveBeenCalledOnce());
+        const call = mockShow.mock.calls[0];
+        expect(call[1].anchor).toEqual({ x: w / 2, y: h / 2 });
+    });
+});

package/dist/documents/picker-primitive.d.ts

@@ -0,0 +1,7 @@
+import type { DocumentPickerApi, DocListFn } from './picker-api';
+/**
+ * Create a document picker API bound to a document listing function.
+ * The listFn is derived from the shard's document zone + browse permission
+ * and baked in at construction time so callers don't pass their own scope.
+ */
+export declare function createDocumentPicker(listFn: DocListFn): DocumentPickerApi;

package/dist/documents/picker-primitive.js

@@ -0,0 +1,58 @@
+import { sh3 } from '../sh3Runtime.svelte';
+import DocumentBrowser from '../primitives/widgets/_DocumentBrowser.svelte';
+/**
+ * Create a document picker API bound to a document listing function.
+ * The listFn is derived from the shard's document zone + browse permission
+ * and baked in at construction time so callers don't pass their own scope.
+ */
+export function createDocumentPicker(listFn) {
+    function anchorOrDefault(anchor) {
+        if (anchor) {
+            const rect = anchor.getBoundingClientRect();
+            return { x: rect.left + rect.width / 2, y: rect.top };
+        }
+        return { x: window.innerWidth / 2, y: window.innerHeight / 2 };
+    }
+    async function open(opts) {
+        const docs = await listFn();
+        return new Promise((resolve) => {
+            const handle = sh3.popup.show(DocumentBrowser, { anchor: anchorOrDefault(opts === null || opts === void 0 ? void 0 : opts.anchor) }, {
+                mode: 'open',
+                docs,
+                onCommit: (value) => {
+                    resolve(value);
+                },
+                onCancel: () => {
+                    resolve(null);
+                },
+            });
+            const origClose = handle.close;
+            handle.close = () => {
+                origClose();
+                resolve(null);
+            };
+        });
+    }
+    async function save(opts) {
+        const docs = await listFn();
+        return new Promise((resolve) => {
+            const handle = sh3.popup.show(DocumentBrowser, { anchor: anchorOrDefault(opts === null || opts === void 0 ? void 0 : opts.anchor) }, {
+                mode: 'save',
+                docs,
+                suggestedName: opts === null || opts === void 0 ? void 0 : opts.suggestedName,
+                onCommit: (value) => {
+                    resolve(value);
+                },
+                onCancel: () => {
+                    resolve(null);
+                },
+            });
+            const origClose = handle.close;
+            handle.close = () => {
+                origClose();
+                resolve(null);
+            };
+        });
+    }
+    return { open, save };
+}

package/dist/layout/compact/CompactRenderer.svelte

@@ -15,14 +15,20 @@
    * tag them at authoring time. View-default fall-through ships when the
    * registry exposes a pre-mount lookup (deferred from this PR).
    */
-  import { layoutStore } from '../store.svelte';
   import { drawerStore } from './drawerStore.svelte';
   import { derive } from './derive';
+  import { resolveCompactBodyRoot } from './rootStore.svelte';
   import LayoutRenderer from '../LayoutRenderer.svelte';
   import DrawerSurface from '../../overlays/DrawerSurface.svelte';
   import type { DrawerAnchor } from './types';
 
-  const rendering = $derived(derive(layoutStore.root));
+  // Compact body shows whatever compactRootStore currently points at —
+  // the docked tree by default, or one float when the user navigates
+  // there via the FloatsSheet. Drawer derivation runs on the same root,
+  // so a float carrying role-tagged sidebar slots gets the same drawer
+  // chrome the docked tree gets.
+  const bodyRoot = $derived(resolveCompactBodyRoot());
+  const rendering = $derived(derive(bodyRoot));
 
   const anchors: DrawerAnchor[] = ['left', 'right', 'top'];
 </script>

package/dist/layout/compact/rootStore.svelte.d.ts

@@ -0,0 +1,20 @@
+import type { LayoutNode } from '../types';
+export type CompactRoot = {
+    kind: 'docked';
+} | {
+    kind: 'float';
+    floatId: string;
+};
+export declare const compactRootStore: {
+    readonly current: CompactRoot;
+    setRoot(r: CompactRoot): void;
+    reset(): void;
+};
+/**
+ * Resolve the LayoutNode the compact body should render. Returns
+ * `layoutStore.root` when current is docked OR when the referenced float
+ * has been removed (self-heal: also resets `current` to docked).
+ */
+export declare function resolveCompactBodyRoot(): LayoutNode;
+/** Test-only reset. Not exported from src/index.ts. */
+export declare function __resetCompactRootStoreForTest(): void;

package/dist/layout/compact/rootStore.svelte.js

@@ -0,0 +1,59 @@
+/*
+ * compactRootStore — selects which LayoutNode the compact body shows.
+ *
+ * In compact mode the user sees exactly one root at a time: either the
+ * docked tree (the "active layout"), or the content of one float. This
+ * module is the source of truth for that selection. Desktop never reads it.
+ *
+ * Reset triggers (called from existing modules):
+ *   - bindFloatStore (active tree changed)
+ *   - closeFloat(id) when current.floatId === id
+ *   - resolveCompactBodyRoot self-heal when the referenced float is gone
+ *
+ * Set triggers:
+ *   - floatManager.open in compact + non-dismissable
+ *   - focusView / focusTab in compact when the target lives in a float
+ *   - FloatsSheet row tap
+ */
+import { layoutStore } from '../store.svelte';
+let current = $state({ kind: 'docked' });
+export const compactRootStore = {
+    get current() {
+        return current;
+    },
+    setRoot(r) {
+        if (r.kind === 'float') {
+            const exists = layoutStore.tree.floats.some((f) => f.id === r.floatId);
+            if (!exists) {
+                throw new Error(`compactRootStore.setRoot: float id "${r.floatId}" is not in the active tree`);
+            }
+        }
+        current = r;
+    },
+    reset() {
+        current = { kind: 'docked' };
+    },
+};
+/**
+ * Resolve the LayoutNode the compact body should render. Returns
+ * `layoutStore.root` when current is docked OR when the referenced float
+ * has been removed (self-heal: also resets `current` to docked).
+ */
+export function resolveCompactBodyRoot() {
+    // Snapshot locally — narrowing on a module-level $state binding is lost
+    // across function calls because the narrowed-out branch could in theory
+    // reassign before the next read.
+    const cur = current;
+    if (cur.kind === 'docked')
+        return layoutStore.root;
+    const entry = layoutStore.tree.floats.find((f) => f.id === cur.floatId);
+    if (!entry) {
+        current = { kind: 'docked' };
+        return layoutStore.root;
+    }
+    return entry.content;
+}
+/** Test-only reset. Not exported from src/index.ts. */
+export function __resetCompactRootStoreForTest() {
+    current = { kind: 'docked' };
+}

package/dist/layout/compact/rootStore.svelte.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/layout/compact/rootStore.svelte.test.js

@@ -0,0 +1,54 @@
+import { describe, it, expect, beforeEach } from 'vitest';
+import { compactRootStore, resolveCompactBodyRoot, __resetCompactRootStoreForTest, } from './rootStore.svelte';
+import { __resetLayoutStoreForTest, layoutStore, } from '../store.svelte';
+function makeFloat(id, viewId = 'v') {
+    return {
+        id,
+        content: { type: 'slot', slotId: `slot-${id}`, viewId },
+        position: { x: 0, y: 0 },
+        size: { w: 200, h: 200 },
+    };
+}
+describe('compactRootStore', () => {
+    beforeEach(() => {
+        __resetLayoutStoreForTest();
+        __resetCompactRootStoreForTest();
+    });
+    it('starts at { kind: "docked" }', () => {
+        expect(compactRootStore.current).toEqual({ kind: 'docked' });
+    });
+    it('setRoot accepts a float id present in the active tree', () => {
+        const f = makeFloat('f-1');
+        layoutStore.tree.floats.push(f);
+        compactRootStore.setRoot({ kind: 'float', floatId: 'f-1' });
+        expect(compactRootStore.current).toEqual({ kind: 'float', floatId: 'f-1' });
+    });
+    it('setRoot throws when the float id is not in the active tree', () => {
+        expect(() => compactRootStore.setRoot({ kind: 'float', floatId: 'missing' })).toThrow(/missing/);
+    });
+    it('reset returns to docked', () => {
+        layoutStore.tree.floats.push(makeFloat('f-2'));
+        compactRootStore.setRoot({ kind: 'float', floatId: 'f-2' });
+        compactRootStore.reset();
+        expect(compactRootStore.current).toEqual({ kind: 'docked' });
+    });
+    it('resolveCompactBodyRoot returns docked content when current is docked', () => {
+        expect(resolveCompactBodyRoot()).toEqual(layoutStore.tree.docked);
+    });
+    it('resolveCompactBodyRoot returns the float content when current points at it', () => {
+        const f = makeFloat('f-3');
+        layoutStore.tree.floats.push(f);
+        compactRootStore.setRoot({ kind: 'float', floatId: 'f-3' });
+        // Workspace-zone reactivity proxies the pushed object, so identity
+        // (`toBe`) does not hold; the structural content is what we care about.
+        expect(resolveCompactBodyRoot()).toEqual(f.content);
+    });
+    it('resolveCompactBodyRoot self-heals on stale id (returns docked + resets)', () => {
+        const f = makeFloat('f-4');
+        layoutStore.tree.floats.push(f);
+        compactRootStore.setRoot({ kind: 'float', floatId: 'f-4' });
+        layoutStore.tree.floats.length = 0;
+        expect(resolveCompactBodyRoot()).toEqual(layoutStore.tree.docked);
+        expect(compactRootStore.current).toEqual({ kind: 'docked' });
+    });
+});

package/dist/layout/floats.d.ts

@@ -23,6 +23,33 @@ export declare function cascadePosition(existing: FloatEntry[], bounds: {
 };
 /** Stable, process-unique float id. Not cryptographic — just unique within a session. */
 export declare function generateFloatId(): string;
+/**
+ * Pull a float's rect into the supplied viewport bounds. Used at bind
+ * time so a float persisted from a larger viewport doesn't render past
+ * the overlay root — Firefox in particular grows the parent's painted
+ * area to fit an off-screen abspos child, which visibly bleeds the
+ * docked grid (footer ends up below the viewport).
+ *
+ * Size is shrunk to fit but never below `minSize`; if `minSize` itself
+ * exceeds bounds, position is pinned to (0,0) and size stays at min.
+ * Position is then clamped so the frame fits within bounds.
+ */
+export declare function clampFloatToViewport(rect: {
+    position: {
+        x: number;
+        y: number;
+    };
+    size: Size;
+}, minSize: Size, bounds: {
+    w: number;
+    h: number;
+}): {
+    position: {
+        x: number;
+        y: number;
+    };
+    size: Size;
+};
 /**
  * True if a LayoutNode subtree contains no leaf slot with a bound viewId.
  * Used by the drag-commit auto-close invariant: when the last bound leaf

package/dist/layout/floats.js

@@ -55,6 +55,26 @@ export function generateFloatId() {
     floatIdCounter += 1;
     return `float-${Date.now().toString(36)}-${floatIdCounter.toString(36)}`;
 }
+/**
+ * Pull a float's rect into the supplied viewport bounds. Used at bind
+ * time so a float persisted from a larger viewport doesn't render past
+ * the overlay root — Firefox in particular grows the parent's painted
+ * area to fit an off-screen abspos child, which visibly bleeds the
+ * docked grid (footer ends up below the viewport).
+ *
+ * Size is shrunk to fit but never below `minSize`; if `minSize` itself
+ * exceeds bounds, position is pinned to (0,0) and size stays at min.
+ * Position is then clamped so the frame fits within bounds.
+ */
+export function clampFloatToViewport(rect, minSize, bounds) {
+    const w = Math.max(minSize.w, Math.min(rect.size.w, bounds.w));
+    const h = Math.max(minSize.h, Math.min(rect.size.h, bounds.h));
+    const maxX = Math.max(0, bounds.w - w);
+    const maxY = Math.max(0, bounds.h - h);
+    const x = Math.max(0, Math.min(rect.position.x, maxX));
+    const y = Math.max(0, Math.min(rect.position.y, maxY));
+    return { position: { x, y }, size: { w, h } };
+}
 /**
  * True if a LayoutNode subtree contains no leaf slot with a bound viewId.
  * Used by the drag-commit auto-close invariant: when the last bound leaf

package/dist/layout/floats.test.js

@@ -1,5 +1,5 @@
 import { describe, it, expect } from 'vitest';
-import { computeMinSize, cascadePosition, isEmptyContent } from './floats';
+import { computeMinSize, cascadePosition, isEmptyContent, clampFloatToViewport } from './floats';
 const slot = (slotId, viewId = 'v') => ({
     type: 'slot',
     slotId,
@@ -72,6 +72,39 @@ describe('cascadePosition', () => {
         expect(cascadePosition(existing, bounds)).toEqual({ x: 48, y: 48 });
     });
 });
+describe('clampFloatToViewport', () => {
+    const min = { w: 120, h: 80 };
+    const bounds = { w: 1024, h: 768 };
+    it('returns the rect unchanged when fully inside bounds', () => {
+        const out = clampFloatToViewport({ position: { x: 100, y: 200 }, size: { w: 600, h: 400 } }, min, bounds);
+        expect(out).toEqual({ position: { x: 100, y: 200 }, size: { w: 600, h: 400 } });
+    });
+    it('pulls a float that extends past the right edge back inside', () => {
+        const out = clampFloatToViewport({ position: { x: 900, y: 50 }, size: { w: 600, h: 400 } }, min, bounds);
+        expect(out.position.x).toBe(bounds.w - 600);
+        expect(out.position.y).toBe(50);
+        expect(out.size).toEqual({ w: 600, h: 400 });
+    });
+    it('pulls a float that extends past the bottom edge back inside', () => {
+        const out = clampFloatToViewport({ position: { x: 50, y: 600 }, size: { w: 600, h: 400 } }, min, bounds);
+        expect(out.position.y).toBe(bounds.h - 400);
+    });
+    it('clamps negative position back to (0,0)', () => {
+        const out = clampFloatToViewport({ position: { x: -200, y: -50 }, size: { w: 600, h: 400 } }, min, bounds);
+        expect(out.position).toEqual({ x: 0, y: 0 });
+    });
+    it('shrinks size larger than bounds down to bounds (above min)', () => {
+        const out = clampFloatToViewport({ position: { x: 0, y: 0 }, size: { w: 4000, h: 3000 } }, min, bounds);
+        expect(out.size).toEqual({ w: bounds.w, h: bounds.h });
+        expect(out.position).toEqual({ x: 0, y: 0 });
+    });
+    it('never shrinks size below the supplied min, even when bounds < min', () => {
+        const tiny = { w: 80, h: 60 };
+        const out = clampFloatToViewport({ position: { x: 999, y: 999 }, size: { w: 600, h: 400 } }, min, tiny);
+        expect(out.size).toEqual(min);
+        expect(out.position).toEqual({ x: 0, y: 0 });
+    });
+});
 describe('isEmptyContent', () => {
     it('true for a slot with null viewId', () => {
         expect(isEmptyContent({ type: 'slot', slotId: 's', viewId: null })).toBe(true);

package/dist/layout/inspection.js

@@ -16,6 +16,24 @@ import { activeLayout, getActiveRoot } from './store.svelte';
 import { nodeAtPath, findTabBySlotId, removeTabBySlotId, cleanupTree, splitNodeAtPath, locateSlotIn, } from './ops';
 import { getSlotHandle } from './slotHostPool.svelte';
 import { floatManager } from '../overlays/float';
+import { viewportStore } from '../viewport/store.svelte';
+import { compactRootStore } from './compact/rootStore.svelte';
+/**
+ * In compact mode the user sees one root at a time. When focus lands on
+ * a slot in a float, swap the compact body root to that float before
+ * returning. When focus lands in the docked tree, snap back to docked.
+ * Desktop is unaffected.
+ */
+function maybeSwapForCompact(located) {
+    if (viewportStore.current.class !== 'compact')
+        return;
+    if (located.kind === 'float') {
+        compactRootStore.setRoot({ kind: 'float', floatId: located.floatId });
+    }
+    else {
+        compactRootStore.reset();
+    }
+}
 /**
  * Read-only snapshot of the currently-rendered layout tree. The return
  * value is the live object — callers MUST NOT mutate it directly;
@@ -48,8 +66,10 @@ export function spliceIntoActiveLayout(entry) {
  */
 export function focusTab(slotId) {
     const tree = activeLayout();
-    if (focusTabWhere(tree.docked, (entry) => entry.slotId === slotId))
+    if (focusTabWhere(tree.docked, (entry) => entry.slotId === slotId)) {
+        maybeSwapForCompact({ kind: 'docked' });
         return true;
+    }
     return focusTabInFloats(tree, (entry) => entry.slotId === slotId);
 }
 /**
@@ -58,8 +78,10 @@ export function focusTab(slotId) {
  */
 export function focusView(viewId) {
     const tree = activeLayout();
-    if (focusTabWhere(tree.docked, (entry) => entry.viewId === viewId))
+    if (focusTabWhere(tree.docked, (entry) => entry.viewId === viewId)) {
+        maybeSwapForCompact({ kind: 'docked' });
         return true;
+    }
     return focusTabInFloats(tree, (entry) => entry.viewId === viewId);
 }
 /** Walk the tree looking for a tab entry that satisfies `pred`, activate it. */
@@ -85,6 +107,7 @@ function focusTabInFloats(tree, pred) {
     for (const floatEntry of tree.floats) {
         if (focusTabWhere(floatEntry.content, pred)) {
             floatManager.focus(floatEntry.id);
+            maybeSwapForCompact({ kind: 'float', floatId: floatEntry.id });
             return true;
         }
     }

package/dist/layout/inspection.svelte.test.js

@@ -112,3 +112,52 @@ describe('dockIntoActiveLayout — body-role preference', () => {
         expect(right.tabs.map((t) => t.viewId)).toEqual(['view:r']);
     });
 });
+// ---------------------------------------------------------------------------
+// Compact body-root swap on focusView / focusTab
+// ---------------------------------------------------------------------------
+import { compactRootStore, __resetCompactRootStoreForTest, } from './compact/rootStore.svelte';
+import { viewportStore } from '../viewport/store.svelte';
+import { focusView } from './inspection';
+import { floatManager, __resetFloatManagerForTest, bindFloatStore, } from '../overlays/float';
+describe('focusView — compact body-root swap', () => {
+    beforeEach(() => {
+        __resetLayoutStoreForTest();
+        __resetCompactRootStoreForTest();
+        __resetFloatManagerForTest();
+        viewportStore.override(null);
+        bindFloatStore(layoutStore.floats, () => ({ w: 1024, h: 768 }));
+    });
+    it('compact: focusView in a float swaps body root before activating', () => {
+        viewportStore.override('compact');
+        const id = floatManager.open('view:in-float', { title: 'In Float' });
+        // open() in compact already auto-switches; reset so we can see the swap.
+        compactRootStore.reset();
+        expect(compactRootStore.current).toEqual({ kind: 'docked' });
+        const ok = focusView('view:in-float');
+        expect(ok).toBe(true);
+        expect(compactRootStore.current).toEqual({ kind: 'float', floatId: id });
+        viewportStore.override(null);
+    });
+    it('compact: focusView for a docked tab resets body root', () => {
+        viewportStore.override('compact');
+        layoutStore.tree.docked = {
+            type: 'tabs',
+            tabs: [{ slotId: 's-d', viewId: 'view:docked', label: 'Docked' }],
+            activeTab: 0,
+        };
+        floatManager.open('view:other');
+        expect(compactRootStore.current.kind).toBe('float');
+        const ok = focusView('view:docked');
+        expect(ok).toBe(true);
+        expect(compactRootStore.current).toEqual({ kind: 'docked' });
+        viewportStore.override(null);
+    });
+    it('desktop: focusView does not touch the compact body root', () => {
+        viewportStore.override('desktop');
+        floatManager.open('view:any');
+        const before = compactRootStore.current;
+        focusView('view:any');
+        expect(compactRootStore.current).toEqual(before);
+        viewportStore.override(null);
+    });
+});

package/dist/overlays/FloatLayer.svelte

@@ -7,14 +7,25 @@
 -->
 <script lang="ts">
   import { layoutStore } from '../layout/store.svelte';
+  import { viewportStore } from '../viewport/store.svelte';
   import FloatFrame from './FloatFrame.svelte';
 
   const floats = $derived(layoutStore.floats);
+  // In compact mode, non-dismissable floats are body-or-menu only — the
+  // compact-floats-menu design demotes them to the FloatsSheet so the
+  // user sees one root at a time. Dismissable pickers (anchored
+  // popovers) keep floating because they're transient.
+  const compact = $derived(viewportStore.current.class === 'compact');
+  function shouldRender(entry: { dismissable?: boolean }): boolean {
+    return !compact || entry.dismissable === true;
+  }
 </script>
 
 <div class="sh3-float-layer">
   {#each floats as entry, i (entry.id)}
-    <FloatFrame bind:entry={floats[i]} />
+    {#if shouldRender(entry)}
+      <FloatFrame bind:entry={floats[i]} />
+    {/if}
   {/each}
 </div>
 

package/dist/overlays/float.d.ts

@@ -74,6 +74,13 @@ export interface FloatManager {
  * Bind the manager to the active LayoutTree's `floats` array. Called
  * from Sh3.svelte during boot. `getBounds` returns the current
  * tree-allocated area for cascade-position wraparound.
+ *
+ * Persisted floats observed for the first time are pulled into the
+ * supplied viewport — without this, a float whose position/size came
+ * from a larger window renders past the overlay root, which Firefox
+ * paints by growing the parent and visibly shifts the docked grid.
+ * Ids already in `clampedIds` (re-bound on viewport-class swap, etc.)
+ * are left alone.
  */
 export declare function bindFloatStore(floats: FloatEntry[], getBounds: () => {
     w: number;