sh3-core 0.19.5 → 0.20.1

package/dist/documents/config.js

@@ -5,18 +5,31 @@
  * calls __setActiveScope and __setDocumentBackend before bootstrap() to
  * configure multi-scope routing and swap backends (e.g. Tauri FS).
  *
+ * Project scope: when a project is active (sessionState.activeProjectId),
+ * the scope resolver returns the project id so all document operations
+ * operate on the project's virtual tenant instead of the user's personal
+ * scope. The resolver is wired by createShell after bootstrap.
+ *
  * Defaults: scopeId='local' (single-user self-hosted), backend=IndexedDB.
  */
 import { IndexedDBDocumentBackend } from './backends';
 const DEFAULT_SCOPE = 'local';
 let scopeId = DEFAULT_SCOPE;
 let backend = new IndexedDBDocumentBackend();
+let scopeResolver = null;
+/** Host-only. Register a callback that resolves the active project scope.
+ *  When non-null and returns a string, that string overrides the static
+ *  scopeId for all document operations. Wired by createShell after bootstrap. */
+export function __setScopeResolver(resolver) {
+    scopeResolver = resolver;
+}
 export function getActiveScopeId() {
-    return scopeId;
+    var _a;
+    return (_a = scopeResolver === null || scopeResolver === void 0 ? void 0 : scopeResolver()) !== null && _a !== void 0 ? _a : scopeId;
 }
 /** @deprecated use getActiveScopeId — kept until callers migrate. */
 export function getTenantId() {
-    return scopeId;
+    return getActiveScopeId();
 }
 export function getDocumentBackend() {
     return backend;

package/dist/documents/handle.js

@@ -31,36 +31,43 @@ export function createDocumentHandle(tenantId, shardId, backend, options) {
             return true;
         return options.extensions.some((ext) => path.endsWith(ext));
     }
-    function emitChange(type, path) {
-        documentChanges.emit({ type, path, tenantId, shardId });
+    function resolveTenant(opts) {
+        var _a;
+        return (_a = opts === null || opts === void 0 ? void 0 : opts.scope) !== null && _a !== void 0 ? _a : tenantId;
+    }
+    function emitChange(type, path, tid) {
+        documentChanges.emit({ type, path, tenantId: tid, shardId });
     }
     const handle = {
-        async list() {
-            const all = await backend.list(tenantId, shardId);
+        async list(opts) {
+            const tid = resolveTenant(opts);
+            const all = await backend.list(tid, shardId);
             if (!options.extensions || options.extensions.length === 0)
                 return all;
             return all.filter((meta) => matchesExtensions(meta.path));
         },
-        async read(path) {
-            const content = await backend.read(tenantId, shardId, path);
+        async read(path, opts) {
+            const content = await backend.read(resolveTenant(opts), shardId, path);
             if (content === null)
                 return null;
             // Phase 1: text format only. Binary returns as-is from the backend
             // but the handle types it as string for text-format handles.
             return typeof content === 'string' ? content : new TextDecoder().decode(content);
         },
-        async write(path, content) {
-            const existed = await backend.exists(tenantId, shardId, path);
-            await backend.write(tenantId, shardId, path, content);
-            emitChange(existed ? 'update' : 'create', path);
+        async write(path, content, opts) {
+            const tid = resolveTenant(opts);
+            const existed = await backend.exists(tid, shardId, path);
+            await backend.write(tid, shardId, path, content);
+            emitChange(existed ? 'update' : 'create', path, tid);
         },
-        async delete(path) {
-            const existed = await backend.exists(tenantId, shardId, path);
-            await backend.delete(tenantId, shardId, path);
+        async delete(path, opts) {
+            const tid = resolveTenant(opts);
+            const existed = await backend.exists(tid, shardId, path);
+            await backend.delete(tid, shardId, path);
             if (existed)
-                emitChange('delete', path);
+                emitChange('delete', path, tid);
         },
-        async rename(oldPath, newPath) {
+        async rename(oldPath, newPath, opts) {
             if (!matchesExtensions(newPath)) {
                 throw new Error(`Cannot rename to ${newPath}: violates handle extensions filter`);
             }
@@ -69,12 +76,13 @@ export function createDocumentHandle(tenantId, shardId, backend, options) {
                     throw new Error(`Cannot rename: active autosave on ${oldPath}; flush and dispose first`);
                 }
             }
-            await backend.rename(tenantId, shardId, oldPath, newPath);
+            const tid = resolveTenant(opts);
+            await backend.rename(tid, shardId, oldPath, newPath);
             documentChanges.emit({
                 type: 'rename',
                 path: newPath,
                 oldPath,
-                tenantId,
+                tenantId: tid,
                 shardId,
             });
         },

package/dist/documents/http-backend.js

@@ -52,8 +52,16 @@ export class HttpDocumentBackend {
         const url = `${__classPrivateFieldGet(this, _HttpDocumentBackend_baseUrl, "f")}/api/docs/${tenantId}/${shardId}/${path}`;
         const headers = Object.assign(Object.assign({}, __classPrivateFieldGet(this, _HttpDocumentBackend_instances, "m", _HttpDocumentBackend_authHeaders).call(this)), { 'Content-Type': typeof content === 'string' ? 'text/plain' : 'application/octet-stream' });
         const res = await apiFetch(url, { method: 'PUT', headers, body: content, credentials: 'include' });
-        if (!res.ok)
-            throw new Error(`Document write failed: ${res.status}`);
+        if (!res.ok) {
+            let detail = `HTTP ${res.status}`;
+            try {
+                const b = await res.json();
+                if (b.error)
+                    detail = b.error;
+            }
+            catch ( /* body not JSON */_a) { /* body not JSON */ }
+            throw new Error(`Document write failed: ${detail}`);
+        }
     }
     async delete(tenantId, shardId, path) {
         const url = `${__classPrivateFieldGet(this, _HttpDocumentBackend_baseUrl, "f")}/api/docs/${tenantId}/${shardId}/${path}`;

package/dist/documents/index.d.ts

@@ -1,8 +1,8 @@
-export type { DocumentFormat, DocumentHandleOptions, DocumentMeta, DocumentChange, DocumentBackend, DocumentHandle, AutosaveController, } from './types';
+export type { DocumentFormat, DocumentHandleOptions, DocumentMeta, DocumentChange, DocumentBackend, DocumentHandle, AutosaveController, ScopeOption, } from './types';
 export { MemoryDocumentBackend, IndexedDBDocumentBackend } from './backends';
 export { HttpDocumentBackend } from './http-backend';
 export { createDocumentHandle } from './handle';
 export { documentChanges } from './notifications';
-export { getActiveScopeId, getTenantId, getDocumentBackend, __setActiveScope, __setTenantId, __setDocumentBackend, } from './config';
+export { getActiveScopeId, getTenantId, getDocumentBackend, __setActiveScope, __setTenantId, __setDocumentBackend, __setScopeResolver, } from './config';
 export type { SyncPolicy, SyncPolicyRule, DocStatus, ConflictFile, ConflictBranch, } from './sync-types';
 export { PERMISSION_SYNC_PEER, PERMISSION_SYNC_POLICY, } from './sync-types';

package/dist/documents/index.js

@@ -5,5 +5,5 @@ export { MemoryDocumentBackend, IndexedDBDocumentBackend } from './backends';
 export { HttpDocumentBackend } from './http-backend';
 export { createDocumentHandle } from './handle';
 export { documentChanges } from './notifications';
-export { getActiveScopeId, getTenantId, getDocumentBackend, __setActiveScope, __setTenantId, __setDocumentBackend, } from './config';
+export { getActiveScopeId, getTenantId, getDocumentBackend, __setActiveScope, __setTenantId, __setDocumentBackend, __setScopeResolver, } from './config';
 export { PERMISSION_SYNC_PEER, PERMISSION_SYNC_POLICY, } from './sync-types';

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

@@ -0,0 +1,33 @@
+import type { DocEntry, OpenerValue, SaverValue } from '../primitives/widgets/DocumentFilePicker';
+/** Function that returns the document tree for the picker to browse. */
+export type DocListFn = () => Promise<DocEntry[]>;
+/** Options for `ctx.documentPicker.open()`. */
+export interface DocumentOpenOptions {
+    /** When set, the browser opens as a popup anchored to this element.
+     *  When omitted (default), the browser opens as a centered modal. */
+    anchor?: HTMLElement;
+}
+/** Options for `ctx.documentPicker.save()`. */
+export interface DocumentSaveOptions {
+    /** Pre-fill the filename input in the save dialog. */
+    suggestedName?: string;
+    /** When set, the browser opens as a popup anchored to this element.
+     *  When omitted (default), the browser opens as a centered modal. */
+    anchor?: HTMLElement;
+}
+/** Programmatic document picker API — available on `ctx.documentPicker`. */
+export interface DocumentPickerApi {
+    /**
+     * Open the document browser in "open" mode. The user browses and selects
+     * an existing document. Returns the selected `{shardId, path}` or null
+     * if cancelled or dismissed externally.
+     */
+    open(opts?: DocumentOpenOptions): Promise<OpenerValue | null>;
+    /**
+     * Open the document browser in "save" mode. The user navigates to a
+     * folder and provides a filename. Returns the full path string or null
+     * if cancelled or dismissed externally.
+     */
+    save(opts?: DocumentSaveOptions): Promise<SaverValue | null>;
+}
+export type { OpenerValue, SaverValue };

package/dist/documents/picker-api.js

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

package/dist/documents/picker-api.test.d.ts

@@ -0,0 +1 @@
+import '../sh3Runtime.svelte';

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

@@ -0,0 +1,162 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import '../sh3Runtime.svelte'; // intercepted by vi.mock below
+import { createDocumentPicker } from './picker-primitive';
+const { mockPopupShow, mockModalOpen } = vi.hoisted(() => ({
+    mockPopupShow: vi.fn(),
+    mockModalOpen: vi.fn(),
+}));
+vi.mock('../sh3Runtime.svelte', () => ({
+    sh3: {
+        popup: { show: mockPopupShow },
+        modal: { open: mockModalOpen },
+    },
+}));
+function mockPopup() {
+    let captured = null;
+    const handle = { close: vi.fn() };
+    mockPopupShow.mockImplementation((_Content, _opts, props) => {
+        captured = props;
+        return handle;
+    });
+    return {
+        commit: (v) => { captured === null || captured === void 0 ? void 0 : captured.onCommit(v); },
+        cancel: () => { captured === null || captured === void 0 ? void 0 : captured.onCancel(); },
+        dismiss: () => { handle.close(); },
+        handle,
+    };
+}
+function mockModal() {
+    let captured = null;
+    const handle = { close: vi.fn() };
+    mockModalOpen.mockImplementation((_Content, props) => {
+        captured = props;
+        return handle;
+    });
+    return {
+        commit: (v) => { captured === null || captured === void 0 ? void 0 : captured.onCommit(v); },
+        cancel: () => { captured === null || captured === void 0 ? void 0 : captured.onCancel(); },
+        dismiss: () => { handle.close(); },
+        handle,
+    };
+}
+beforeEach(() => {
+    vi.clearAllMocks();
+});
+describe('createDocumentPicker', () => {
+    const sampleDoc = { shardId: 'my-shard', path: 'readme.md' };
+    describe('open() — modal (no anchor)', () => {
+        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 modal = mockModal();
+            const promise = picker.open();
+            await vi.waitFor(() => expect(mockModalOpen).toHaveBeenCalledOnce());
+            modal.commit(sampleDoc);
+            const result = await promise;
+            expect(result).toEqual({ shardId: 'my-shard', path: 'readme.md' });
+            expect(mockPopupShow).not.toHaveBeenCalled();
+        });
+        it('resolves with null when user cancels', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            const modal = mockModal();
+            const promise = picker.open();
+            await vi.waitFor(() => expect(mockModalOpen).toHaveBeenCalledOnce());
+            modal.cancel();
+            const result = await promise;
+            expect(result).toBeNull();
+        });
+        it('resolves with null when modal is dismissed externally', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            const modal = mockModal();
+            const promise = picker.open();
+            await vi.waitFor(() => expect(mockModalOpen).toHaveBeenCalledOnce());
+            modal.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(mockModalOpen).not.toHaveBeenCalled();
+            expect(mockPopupShow).not.toHaveBeenCalled();
+        });
+        it('passes mode and dismissOnBackdrop to modal', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            mockModal();
+            picker.open();
+            await vi.waitFor(() => expect(mockModalOpen).toHaveBeenCalledOnce());
+            const call = mockModalOpen.mock.calls[0];
+            expect(call[1].mode).toBe('open');
+            expect(call[2]).toEqual({ dismissOnBackdrop: true, boxStyle: 'max-width: min(800px, 95vw);' });
+        });
+    });
+    describe('open() — popup (with anchor)', () => {
+        it('uses popup when anchor element is provided', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            mockPopup();
+            const el = document.createElement('div');
+            picker.open({ anchor: el });
+            await vi.waitFor(() => expect(mockPopupShow).toHaveBeenCalledOnce());
+            expect(mockModalOpen).not.toHaveBeenCalled();
+            const call = mockPopupShow.mock.calls[0];
+            expect(call[1].anchor).toEqual({ x: 0, y: 0 });
+        });
+    });
+    describe('save() — modal (no anchor)', () => {
+        it('resolves with SaverValue string when user commits a filename', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            const modal = mockModal();
+            const promise = picker.save();
+            await vi.waitFor(() => expect(mockModalOpen).toHaveBeenCalledOnce());
+            modal.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 modal = mockModal();
+            const promise = picker.save();
+            await vi.waitFor(() => expect(mockModalOpen).toHaveBeenCalledOnce());
+            modal.cancel();
+            const result = await promise;
+            expect(result).toBeNull();
+        });
+        it('passes suggestedName as prop', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            mockModal();
+            picker.save({ suggestedName: 'draft.txt' });
+            await vi.waitFor(() => expect(mockModalOpen).toHaveBeenCalledOnce());
+            const call = mockModalOpen.mock.calls[0];
+            expect(call[1].suggestedName).toBe('draft.txt');
+        });
+        it('passes mode to modal', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            mockModal();
+            picker.save();
+            await vi.waitFor(() => expect(mockModalOpen).toHaveBeenCalledOnce());
+            const call = mockModalOpen.mock.calls[0];
+            expect(call[1].mode).toBe('save');
+        });
+    });
+    describe('save() — popup (with anchor)', () => {
+        it('uses popup when anchor element is provided', async () => {
+            const listFn = async () => [];
+            const picker = createDocumentPicker(listFn);
+            mockPopup();
+            const el = document.createElement('div');
+            picker.save({ anchor: el });
+            await vi.waitFor(() => expect(mockPopupShow).toHaveBeenCalledOnce());
+            expect(mockModalOpen).not.toHaveBeenCalled();
+        });
+    });
+});

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

@@ -0,0 +1,11 @@
+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.
+ *
+ * When an `anchor` element is provided the browser opens as a popup
+ * (anchored near the element). Without an anchor it opens as a centered
+ * modal (the expected default for file-browser dialogs).
+ */
+export declare function createDocumentPicker(listFn: DocListFn): DocumentPickerApi;

package/dist/documents/picker-primitive.js

@@ -0,0 +1,56 @@
+import { sh3 } from '../sh3Runtime.svelte';
+import DocumentBrowser from '../primitives/widgets/_DocumentBrowser.svelte';
+const BOX_STYLE = 'max-width: min(800px, 95vw);';
+const MODAL_OPTS = { dismissOnBackdrop: true, boxStyle: BOX_STYLE };
+/**
+ * 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.
+ *
+ * When an `anchor` element is provided the browser opens as a popup
+ * (anchored near the element). Without an anchor it opens as a centered
+ * modal (the expected default for file-browser dialogs).
+ */
+export function createDocumentPicker(listFn) {
+    /** Resolve handle for either popup (anchored) or modal (centered) path. */
+    function openBrowser(browserProps, anchor) {
+        if (anchor) {
+            const rect = anchor.getBoundingClientRect();
+            return sh3.popup.show(DocumentBrowser, { anchor: { x: rect.left + rect.width / 2, y: rect.top } }, browserProps);
+        }
+        return sh3.modal.open(DocumentBrowser, browserProps, MODAL_OPTS);
+    }
+    function wrapHandle(handle, resolve) {
+        const origClose = handle.close;
+        handle.close = () => {
+            origClose();
+            resolve(null);
+        };
+    }
+    async function open(opts) {
+        const docs = await listFn();
+        return new Promise((resolve) => {
+            const handle = openBrowser({
+                mode: 'open',
+                docs,
+                onCommit: (value) => { resolve(value); },
+                onCancel: () => { resolve(null); },
+            }, opts === null || opts === void 0 ? void 0 : opts.anchor);
+            wrapHandle(handle, resolve);
+        });
+    }
+    async function save(opts) {
+        const docs = await listFn();
+        return new Promise((resolve) => {
+            const handle = openBrowser({
+                mode: 'save',
+                docs,
+                suggestedName: opts === null || opts === void 0 ? void 0 : opts.suggestedName,
+                onCommit: (value) => { resolve(value); },
+                onCancel: () => { resolve(null); },
+            }, opts === null || opts === void 0 ? void 0 : opts.anchor);
+            wrapHandle(handle, resolve);
+        });
+    }
+    return { open, save };
+}

package/dist/documents/types.d.ts

@@ -34,6 +34,8 @@ export declare const PERMISSION_DOCUMENTS_READ = "documents:read";
  * `browse`.
  */
 export declare const PERMISSION_DOCUMENTS_WRITE = "documents:write";
+/** Permission to manage document mount points (admin-only). */
+export declare const PERMISSION_DOCUMENTS_MOUNT = "documents:mount";
 /**
  * Format hint for document content. Determines whether reads return a string
  * (`text`) or an `ArrayBuffer` (`binary`).
@@ -158,23 +160,33 @@ export interface DocumentBackend {
 /**
  * Shard-facing document handle returned by `ctx.documents()`. Binds
  * the tenant, shard, and backend so shard code only deals in paths.
+ *
+ * All read/write/list/delete/rename methods accept an optional scope
+ * override for cross-scope document transfers (e.g. moving documents
+ * between a personal tenant and a project). When omitted, the handle's
+ * bound tenant is used.
  */
+/** Optional scope override for cross-tenant operations. */
+export interface ScopeOption {
+    /** Override the handle's bound tenant for a single operation. */
+    scope?: string;
+}
 export interface DocumentHandle {
     /** List documents matching the handle's extensions filter. */
-    list(): Promise<DocumentMeta[]>;
+    list(opts?: ScopeOption): Promise<DocumentMeta[]>;
     /** Read a document by path. Returns null if not found. */
-    read(path: string): Promise<string | null>;
+    read(path: string, opts?: ScopeOption): Promise<string | null>;
     /** Write (create or overwrite) a document. Explicit save. */
-    write(path: string, content: string): Promise<void>;
+    write(path: string, content: string, opts?: ScopeOption): Promise<void>;
     /** Delete a document. */
-    delete(path: string): Promise<void>;
+    delete(path: string, opts?: ScopeOption): Promise<void>;
     /**
      * Rename a document. Throws if there is an active autosave controller
      * for oldPath (caller must flush and dispose first). Throws if newPath
      * already exists or if oldPath does not. Subject to the handle's
      * extensions filter — newPath must satisfy the filter.
      */
-    rename(oldPath: string, newPath: string): Promise<void>;
+    rename(oldPath: string, newPath: string, opts?: ScopeOption): Promise<void>;
     /** Check existence without reading content. */
     exists(path: string): Promise<boolean>;
     /** Fetch sync-state metadata for a path. Null if the doc does not exist. */

package/dist/documents/types.js

@@ -45,6 +45,8 @@ export const PERMISSION_DOCUMENTS_READ = 'documents:read';
  * `browse`.
  */
 export const PERMISSION_DOCUMENTS_WRITE = 'documents:write';
+/** Permission to manage document mount points (admin-only). */
+export const PERMISSION_DOCUMENTS_MOUNT = 'documents:mount';
 /** Type guard: narrows a DocumentChange to the rename variant. */
 export function isRename(change) {
     return change.type === 'rename';

package/dist/layout/presets.test.js

@@ -25,7 +25,7 @@ describe('normalizeInitialLayout', () => {
     });
     it('canonicalizes a preset list, using tree as default and preserving variants', () => {
         const authorTree = { docked: leafNode, floats: [] };
-        const companionTree = {
+        const compactTree = {
             docked: { type: 'slot', slotId: 's2', viewId: 'v2' },
             floats: [],
         };
@@ -33,7 +33,7 @@ describe('normalizeInitialLayout', () => {
             {
                 name: 'author',
                 tree: authorTree,
-                variants: { companion: companionTree },
+                variants: { compact: compactTree },
             },
         ];
         const result = normalizeInitialLayout(presets);
@@ -42,7 +42,7 @@ describe('normalizeInitialLayout', () => {
                 name: 'author',
                 variants: {
                     default: authorTree,
-                    companion: companionTree,
+                    compact: compactTree,
                 },
             },
         ]);
@@ -54,7 +54,7 @@ describe('normalizeInitialLayout', () => {
         expect(result).toEqual([{ name: 'x', variants: { default: tree } }]);
     });
     it('throws if a preset has neither tree nor variants.default', () => {
-        const bad = [{ name: 'broken', variants: { companion: { docked: leafNode, floats: [] } } }];
+        const bad = [{ name: 'broken', variants: { compact: { docked: leafNode, floats: [] } } }];
         expect(() => normalizeInitialLayout(bad)).toThrow(/must provide either 'tree' or 'variants.default'/);
     });
     it('when a preset has both tree and variants.default, variants.default wins', () => {

package/dist/layout/types.d.ts

@@ -176,7 +176,7 @@ export interface LayoutTree {
  * manifest; users switch between them at runtime. The ergonomic `tree`
  * field is shorthand for `variants.default`; the normalizer canonicalizes
  * every preset into a variants-only shape on load. v1 always uses the
- * `default` variant; other variant keys (e.g. `companion`) are reserved
+ * `default` variant; other variant keys (e.g. `compact`) are reserved
  * for the rescoped DF10 selection policy and are persisted but inert.
  */
 export interface LayoutPreset {

package/dist/layouts-shard/LayoutsSection.svelte

@@ -11,6 +11,7 @@
   import { toastManager } from '../overlays/toast';
   import { sh3 } from '../sh3Runtime.svelte';
   import { makeSelectionApi } from '../actions/selection.svelte';
+  import HomeSection from '../sh3core-shard/HomeSection.svelte';
   import iconsUrl from '../assets/icons.svg';
 
   const layouts = $derived(getLayouts());
@@ -41,8 +42,7 @@
 </script>
 
 {#if layouts.length > 0}
-  <section class="saved-layouts-section">
-    <h2 class="saved-layouts-heading">Saved Layouts</h2>
+  <HomeSection title="Saved Layouts" persistKey="layouts">
     <div class="saved-layouts-grid">
       {#each layouts as layout (layout.id)}
         <button
@@ -64,23 +64,10 @@
         </button>
       {/each}
     </div>
-  </section>
+  </HomeSection>
 {/if}
 
 <style>
-  .saved-layouts-section {
-    width: 100%;
-    max-width: 720px;
-    margin-bottom: 28px;
-  }
-  .saved-layouts-heading {
-    font-size: 13px;
-    font-weight: 600;
-    text-transform: uppercase;
-    letter-spacing: 0.06em;
-    color: var(--sh3-fg-subtle);
-    margin: 0 0 12px;
-  }
   .saved-layouts-grid {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));

package/dist/primitives/widgets/DocumentFilePicker.svelte

@@ -58,9 +58,8 @@
       return;
     }
 
-    const popupHandle = sh3.popup.show(
+    const modalHandle = sh3.modal.open(
       DocumentBrowser,
-      { anchor: trigger },
       {
         mode,
         docs,
@@ -69,10 +68,11 @@
         },
         onCancel: () => {},
       },
+      { dismissOnBackdrop: true, boxStyle: 'max-width: min(800px, 95vw);' },
     );
 
-    const origClose = popupHandle.close;
-    popupHandle.close = () => {
+    const origClose = modalHandle.close;
+    modalHandle.close = () => {
       origClose();
       onOpenClosed();
     };

package/dist/primitives/widgets/PickerList.svelte

@@ -65,6 +65,7 @@
         <label class="sh3-picker__row">
           <input
             type="checkbox"
+            class="sh3-base-check"
             checked={value.includes(item.id)}
             {disabled}
             onchange={() => toggleId(item.id)}

package/dist/primitives/widgets/_DocumentBrowser.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { untrack } from 'svelte';
   import {
     buildTree,
     formatSize,
@@ -17,18 +18,20 @@
     onCommit,
     onCancel,
     close,
+    suggestedName = '',
   }: {
     mode: 'open' | 'save';
     docs: DocEntry[];
     onCommit: (value: OpenerValue | SaverValue) => void;
     onCancel: () => void;
     close: () => void;
+    suggestedName?: string;
   } = $props();
 
   let shardId = $state<string | null>(null);
   let prefix = $state('');
   let selectedFile = $state<DocEntry | null>(null);
-  let filename = $state('');
+  let filename = $state(untrack(() => suggestedName));
   let activeIdx = $state(0);
   let listEl = $state<HTMLElement | undefined>(undefined);
 
@@ -234,13 +237,9 @@
 
 <style>
   .sh3-doc-browser {
-    background: var(--sh3-bg-elevated);
-    border: 1px solid var(--sh3-border-strong);
-    border-radius: var(--sh3-widget-radius);
-    box-shadow: var(--sh3-shadow-lg);
-    width: 420px;
-    max-height: 480px;
-    display: flex; flex-direction: column;
+    display: flex;
+    flex-direction: column;
+    max-height: 85vh;
     overflow: hidden;
     color: var(--sh3-fg);
     font-size: 0.8125rem;

package/dist/primitives/widgets/_DocumentBrowser.svelte.d.ts

@@ -5,6 +5,7 @@ type $$ComponentProps = {
     onCommit: (value: OpenerValue | SaverValue) => void;
     onCancel: () => void;
     close: () => void;
+    suggestedName?: string;
 };
 declare const DocumentBrowser: import("svelte").Component<$$ComponentProps, {}, "">;
 type DocumentBrowser = ReturnType<typeof DocumentBrowser>;