@happyvertical/smrt-svelte 0.37.8 → 0.37.10

package/AGENTS.md

@@ -233,99 +233,35 @@ await expectNoA11yViolations(container); // axe; color-contrast off (jsdom has n
 - `@happyvertical/smrt-types` (shared types) — includes the identity data contracts (`User`, `Role`, `Membership`, `Tenant`) the role/membership components type against, so no dependency on `smrt-users` / `smrt-profiles` is needed
 - `@happyvertical/smrt-ui` (UI runtime: primitives, theme system, i18n client, module registry) is a hard `dependency`. The agent-admin shells that used to type against `@happyvertical/smrt-agents/ui` moved to `@happyvertical/smrt-agents/svelte` (#1589), so `smrt-agents` is no longer a dependency here — this drops smrt-svelte below smrt-agents in the package DAG.
 - `@happyvertical/smrt-languages` is a hard `dependency` (not an optional peer): the Node-only `/i18n/server` subpath imports its resolver. The browser bundle still excludes it — the client `/i18n` layer never imports the languages root, so it tree-shakes out.
-- `@happyvertical/logger` (SDK) is a `dependency` — the browser-safe console logger used for voice/AI error reporting in the form components.
+- `@happyvertical/logger` (SDK) is a `dependency` — the console logger used for voice/AI error reporting in the form components. Consume it **only** through `src/internal/logger.ts`, never `createLogger()` at module scope: `createLogger()` reads `HAVE_LOGGER_LEVEL` from `process.env`, so a top-level call throws `ReferenceError: process is not defined` in the browser and kills client-side hydration under `vite dev` (prod builds tree-shake/define it away, so this only bites in dev). The `internal/logger` wrapper constructs the logger lazily and falls back to a bare `ConsoleLogger` when `process.env` is absent, keeping this browser-reachable module (imported by `Provider` + the form primitives) safe.
 - Peer (all optional): `svelte` >=5.18.2, plus the browser-AI engines (`@huggingface/transformers`, `@mlc-ai/web-llm`, `@remotion/whisper-web`, `@xenova/transformers`) and `chrono-node`.
 
-## Workspace shell primitives
+## AdminShell workspace surface
 
-The `./workspace` subpath (`src/components/workspace/`) holds admin-shell primitives:
-`WorkspaceShell`, `NavTree`, `Breadcrumbs`, and `ToolsDock` (plus `defineToolsDock` /
-`useToolsDock`). Shared types live in `workspace/types.ts` and are re-exported via the
-subpath barrel.
+The `./workspace` subpath (`src/components/workspace/`) is the canonical
+AdminShell family for SMRT admin web apps. It exports the four-edge shell
+contract (`AdminShell`, `ShellState`, settings, hotkeys, focus tools,
+activities, tenant nav, app/system panels) from `workspace/admin-shell/`.
 
-**Layering**: primitives first (this folder), opinionated wrapper second (`AdminShell` — deferred),
-domain-specific tools live outside the framework in consumer packages.
+The first-generation workspace family (`WorkspaceShell`, `RoleShell`,
+`NavTree`, `Breadcrumbs`, `ToolsDock`) remains in source as migration reference
+only. Do not re-export it from the public `./workspace` barrel just to preserve
+compatibility.
 
 **Principles**:
-- SvelteKit-agnostic — no `$app/state` or `$app/navigation` imports
-- SSR-safe — guard all `window` / `localStorage` access
+- SvelteKit-agnostic core — no `$app/state` or `$app/navigation` imports
+- SSR-safe public shell import/render path; browser listeners and localStorage
+  activate after mount
 - No token bridges — consume `var(--smrt-color-*)` directly
-- Tool IDs are arbitrary strings (extensible, not an enum)
-
-**State-mirroring recipes** (issue #1235):
-- Dock events. `'dock:state-changed'` fires on `open()`/`close()`/`toggle()` and
-  on availability-driven `activeTool` clears (payload: `{ isOpen, activeTool }`).
-  `'dock:context-changed'` fires on `setContext()` with a different reference
-  (payload: `{ context }`). Legacy `'dock:change'` (payload: `{ isOpen, activeTool, context }`)
-  still fires on every observable transition (incl. badge-only availability
-  refresh) for back-compat with consumers mirroring `availableTools` — it's
-  `@deprecated`; prefer the granular pair. The `'dock:*'` prefix is reserved
-  for built-ins; consumer events should pick a different namespace.
-- `WorkspaceShell` exposes `bind:mobileNavOpen` so consumers can lift the drawer
-  state. Pair it with `<NavTree onNavigate={() => mobileNavOpen = false} />` to
-  close the drawer on navigation without any DOM querying.
-- `ToolDef.iconComponent?: Component` renders a custom icon (lucide-svelte etc.)
-  inside the rail glyph (and as a leading glyph in topbar layout). Takes
-  precedence over `icon: string`, then `label.charAt(0)` as last resort.
-- `dock.refreshAvailability()` forces a re-run of `fetchAvailability` with the
-  current context. `setContext()` short-circuits on strict-equal references —
-  use refresh when a side-channel event (websocket, button) signals availability
-  or badges changed without a context change.
-- Typed `defineToolsDock<TData, TActions>`. The factory's two generics flow
-  into `fetchAvailability`'s `ctx` param and through `ToolsDockContext<TData, TActions>`
-  for tool components. Inside a tool, type `context` locally:
-  `let { context }: { context: ToolsDockContext<MyData, MyActions> | null } = $props();`.
-  `context?.actions?.foo()` is then fully typed — no per-consumer redeclaration.
-  `ToolDef` itself is no longer generic (stored as a homogeneous `ToolDef[]`);
-  the consumer-side cast at registration is gone, the typed surface lives on
-  the component's `context` prop instead.
-- Layout positioning. `<ToolsDock layout='topbar'>` renders its own
-  `position: fixed` panel — **do not also use `<WorkspaceShell>`'s `inspector`
-  snippet** in that mode (the two panels overlap with no z-index coordination).
-  `'rail'` layout is safe to compose alongside `inspector` — its panel sits
-  inside the dock's own aside.
-
-### RoleShell
-
-Opinionated thin wrapper for multi-role admin shells. Pass a `RoleConfig[]` list
-and the current role id; renders `<WorkspaceShell>` + `<NavTree>` + `<Breadcrumbs>`
-wired together. Role colors flow through as `--smrt-role-color` CSS custom property.
-
-```svelte
-<script lang="ts">
-  import { page } from '$app/state';
-  import { RoleShell } from '@happyvertical/smrt-svelte/workspace';
-  import AccountMenu from '$lib/AccountMenu.svelte';
-  import { ROLE_CONFIGS } from '$lib/roles';
-
-  let { data, children } = $props();
-  let mobileNavOpen = $state(false);
-</script>
-
-<RoleShell
-  roles={ROLE_CONFIGS}
-  currentRole={data.currentRole}
-  currentPath={page.url.pathname}
-  bind:mobileNavOpen
->
-  {#snippet sidebarFooter()}
-    <AccountMenu user={data.user} />
-  {/snippet}
-  {@render children?.()}
-</RoleShell>
-```
-
-The `{@render children?.()}` call is the Svelte 5 idiom for rendering a
-layout's child route content — replace with the equivalent slot/render call
-for your framework if you're not using SvelteKit's `+layout.svelte` flow.
-
-The shell intentionally doesn't know about specific role IDs — consumers pick
-whatever set their app needs. Use this for role-based admin dashboards; use
-`<WorkspaceShell>` directly for non-role apps.
-
-See epic [happyvertical/smrt#1226](https://github.com/happyvertical/smrt/issues/1226) for context;
-implementations land via #1227 (`WorkspaceShell`), #1228 (`NavTree`/`Breadcrumbs`), and #1229
-(`ToolsDock` + registry).
+- App-owned configuration for hidden edges, push/overlay presentation, and
+  exclusivity groups
+- User-owned preferences persist as sparse `ShellSettingsDelta` values
+- Focus tools may register imperatively through `ShellState` or declaratively
+  through Svelte helpers
+- Shell activities are client-side records; server jobs, polling, WebSockets,
+  and `smrt-web` SSE can feed them through app adapters
+
+See `src/components/workspace/MIGRATION.md` for the old-to-new concept map.
 
 ### Dock availability gates (server-side)
 

package/README.md

@@ -80,40 +80,44 @@ pnpm add @happyvertical/smrt-svelte
 </ThemeProvider>
 ```
 
-### Workspace Navigation
+### Admin Workspace
 
 ```svelte
 <script lang="ts">
   import { manifest } from '$lib/smrt-manifest';
   import {
-    RoleShell,
-    navTreeFromManifest,
+    AdminShell,
+    TenantNav,
+    tenantNavFromManifest,
   } from '@happyvertical/smrt-svelte/workspace';
 
   let { children } = $props();
 
-  const sections = navTreeFromManifest(manifest, {
+  const sections = tenantNavFromManifest(manifest, {
     sectionHints: {
       '@happyvertical/smrt-content': 'Content',
       '@happyvertical/smrt-profiles': 'Profiles',
     },
   });
 
-  const roles = [{ id: 'admin', label: 'Admin', sections }];
 </script>
 
-<RoleShell {roles} currentRole="admin" currentPath="/admin/articles">
+<AdminShell title="Admin">
+  {#snippet tenantPanel()}
+    <TenantNav items={sections} currentHref="/admin/articles" />
+  {/snippet}
+
   {@render children?.()}
-</RoleShell>
+</AdminShell>
 ```
 
 Filter the same manifest by role permissions when only a subset of resources
 should be visible:
 
 ```ts
-import { navTreeFromManifest } from '@happyvertical/smrt-svelte/workspace';
+import { tenantNavFromManifest } from '@happyvertical/smrt-svelte/workspace';
 
-const editorSections = navTreeFromManifest(manifest, {
+const editorSections = tenantNavFromManifest(manifest, {
   permittedResources: [
     '@happyvertical/smrt-content:Article',
     '@happyvertical/smrt-content:Document',
@@ -137,7 +141,7 @@ const editorSections = navTreeFromManifest(manifest, {
 | `@happyvertical/smrt-svelte/ui` | UI primitives (Button, Card, Badge, Pagination) |
 | `@happyvertical/smrt-svelte/themes` | ThemeProvider, presets (material/glass/studio), CSS generation |
 | `@happyvertical/smrt-svelte/registry` | ModuleUIRegistry for agent admin panels |
-| `@happyvertical/smrt-svelte/workspace` | WorkspaceShell, RoleShell, NavTree, Breadcrumbs, ToolsDock, and manifest nav helpers |
+| `@happyvertical/smrt-svelte/workspace` | AdminShell, ShellState, tenant nav, focus tools, settings, activities, and system/app panels |
 | `@happyvertical/smrt-svelte/browser-ai` | Browser AI client (STT/TTS/LLM adapters, capability detection) |
 | `@happyvertical/smrt-svelte/browser-ai/svelte` | Svelte AI components (VoiceInput, CapabilityGate, etc.) |
 | `@happyvertical/smrt-svelte/styles/tokens.css` | Design tokens CSS |

package/dist/components/workspace/MIGRATION.md

@@ -0,0 +1,55 @@
+# AdminShell Migration
+
+The first-generation workspace family (`WorkspaceShell`, `RoleShell`,
+`NavTree`, `Breadcrumbs`, `ToolsDock`) is no longer the public
+`@happyvertical/smrt-svelte/workspace` surface. Treat those source files as a
+migration reference while moving apps to `AdminShell`.
+
+## Concept Map
+
+| First-generation concept | AdminShell concept |
+| --- | --- |
+| `WorkspaceShell` outer layout | `AdminShell` four-edge layout |
+| `RoleShell` wrapper | App-owned config + `TenantNav` |
+| `NavTree` | `TenantNav` fed by app data or `tenantNavFromManifest()` |
+| `ToolsDock` / `defineToolsDock` | Focus edge tools through `ShellState.registerFocusTool()` or `ShellDockTool` |
+| Dock localStorage | Sparse `ShellSettingsDelta` through `ShellSettingsAdapter` |
+| App-specific job panels | `SystemScopePanel` fed by app stores/endpoints |
+
+## Minimal Shape
+
+```svelte
+<script lang="ts">
+  import {
+    AdminShell,
+    TenantNav,
+    SystemStatusChips,
+  } from '@happyvertical/smrt-svelte/workspace';
+</script>
+
+<AdminShell title="My App">
+  {#snippet tenantPanel()}
+    <TenantNav items={navItems} currentHref={currentPath} />
+  {/snippet}
+
+  {#snippet systemBar()}
+    <SystemStatusChips chips={statusChips} />
+  {/snippet}
+
+  {@render children?.()}
+</AdminShell>
+```
+
+## Notes
+
+- `hidden` means the app omitted an edge; users normally persist only
+  collapsed/expanded panel deltas.
+- Push versus overlay is an app decision per edge.
+- Expanded panels are independent by default. Use matching `exclusiveGroup`
+  values on panel config to make panels mutually exclusive.
+- Hotkeys use `KeyboardEvent.code` so the WASD cluster remains physical across
+  keyboard layouts.
+- URL synchronization is intentionally adapter-owned. The shell exposes
+  serializable state and commands; apps decide their route/query shape.
+- Shell activities are client-side records. Server jobs, polling, WebSockets,
+  and `smrt-web` SSE live updates can all feed them through adapters.

package/dist/components/workspace/README.md

@@ -1,34 +1,31 @@
 # workspace/
 
-Upstream admin shell primitives for SMRT consumer apps. These pieces are
-SvelteKit-agnostic, SSR-safe, and carry no domain coupling — they slot into
-any Svelte 5 app that wants a sidebar + topbar + tools-dock layout.
+Canonical AdminShell family for SMRT admin web apps.
 
-## Tracking
+`@happyvertical/smrt-svelte/workspace` now exports the four-edge AdminShell
+contract:
 
-- Epic: [happyvertical/smrt#1226](https://github.com/happyvertical/smrt/issues/1226)
-- Implementers:
-  - `WorkspaceShell` — [#1227](https://github.com/happyvertical/smrt/issues/1227)
-  - `NavTree`, `Breadcrumbs` — [#1228](https://github.com/happyvertical/smrt/issues/1228)
-  - `ToolsDock`, `defineToolsDock`, `useToolsDock` — [#1229](https://github.com/happyvertical/smrt/issues/1229)
+- App scope on the top edge
+- Tenant scope on the left edge
+- Focus scope on the right edge
+- System scope on the bottom edge
 
-## Shared types (this PR)
+The shell owns geometry, keyboard behavior, settings deltas, responsive
+presentation, focus tool registration, activity registry/watch components, and
+optional SMRT-fed content seams. It does not depend on jobs, users, tenancy, or
+SvelteKit route APIs; apps pass data, endpoints, and permission-filtered nav in.
 
-Exported from `./types.js` via the barrel:
+## Main Exports
 
-- `NavItem`, `BreadcrumbItem`
-- `ToolDef`, `AvailableTool`, `ToolsDockContext`, `ToolsDockApi`
+- `AdminShell`
+- `ShellState` / `createShellState`
+- `ShellSettingsPanel`, `HotkeyInput`, `ShortcutsOverlay`
+- `ShellDockTool`, `TenantNav`
+- `ActivityBadge`, `ActivityList`, `ActivityItem`, `ActivityToasts`
+- `AppScopePanel`, `SystemStatusChips`, `SystemScopePanel`
+- `tenantNavFromManifest`
 
-## Planned component exports
+## Migration
 
-- `WorkspaceShell` (#1227) — outer shell layout primitive
-- `NavTree`, `Breadcrumbs` (#1228) — navigation primitives consuming `NavItem` / `BreadcrumbItem`
-- `ToolsDock` + `defineToolsDock` + `useToolsDock` (#1229) — right-rail tools dock + registry
-
-## Principles
-
-- **SvelteKit-agnostic** — no `$app/state` or `$app/navigation` imports
-- **SSR-safe** — guard all `window` / `localStorage` access
-- **No token bridges** — consume `var(--smrt-color-*)` tokens directly
-- **No domain coupling** — domain-specific tools live in consumer packages
-- **Extensible tool IDs** — tool IDs are arbitrary strings, not an enum
+See [MIGRATION.md](./MIGRATION.md) for the first-generation workspace migration
+map.

package/dist/components/workspace/__tests__/AdminShell.test.js

@@ -0,0 +1,55 @@
+import { createRawSnippet, flushSync, mount, tick, unmount } from 'svelte';
+import { afterEach, beforeEach, describe, expect, it } from 'vitest';
+import AdminShell from '../admin-shell/AdminShell.svelte';
+function textSnippet(text) {
+    return createRawSnippet(() => ({
+        render: () => `<span>${text}</span>`,
+    }));
+}
+let container;
+beforeEach(() => {
+    container = document.createElement('div');
+    document.body.appendChild(container);
+});
+afterEach(() => {
+    container.remove();
+});
+describe('AdminShell', () => {
+    it('renders the four edge shell and body content', () => {
+        const component = mount(AdminShell, {
+            target: container,
+            props: {
+                title: 'Ops',
+                children: textSnippet('main work'),
+            },
+        });
+        try {
+            expect(container.querySelector('.smrt-admin-shell')).not.toBeNull();
+            expect(container.querySelector('header')?.textContent).toContain('Ops');
+            expect(container.querySelector('main')?.textContent).toContain('main work');
+            expect(container.querySelector('[role="navigation"]')).not.toBeNull();
+        }
+        finally {
+            unmount(component);
+        }
+    });
+    it('toggles a physical-code panel hotkey', async () => {
+        const component = mount(AdminShell, {
+            target: container,
+            props: {
+                children: textSnippet('main work'),
+            },
+        });
+        try {
+            const shell = container.querySelector('.smrt-admin-shell');
+            expect(shell?.getAttribute('data-top-state')).toBe('collapsed');
+            await tick();
+            window.dispatchEvent(new KeyboardEvent('keydown', { code: 'KeyW' }));
+            flushSync();
+            expect(shell?.getAttribute('data-top-state')).toBe('expanded');
+        }
+        finally {
+            unmount(component);
+        }
+    });
+});

package/dist/components/workspace/__tests__/admin-shell-hotkeys.test.js

@@ -0,0 +1,34 @@
+import { describe, expect, it } from 'vitest';
+import { hotkeyMatchesEvent, shellActionFromKeyboardEvent, } from '../admin-shell/hotkeys.js';
+import { resolveShellConfig } from '../admin-shell/settings.js';
+function keyEvent(init) {
+    return new KeyboardEvent('keydown', init);
+}
+describe('AdminShell hotkeys', () => {
+    it('matches physical KeyboardEvent.code bindings', () => {
+        expect(hotkeyMatchesEvent({ code: 'KeyW' }, keyEvent({ code: 'KeyW' }))).toBe(true);
+        expect(hotkeyMatchesEvent({ code: 'KeyW' }, keyEvent({ code: 'KeyZ' }))).toBe(false);
+    });
+    it('maps WASD codes to shell edges', () => {
+        const { panels } = resolveShellConfig();
+        expect(shellActionFromKeyboardEvent(keyEvent({ code: 'KeyW' }), panels)).toEqual({ type: 'toggle-panel', edge: 'top' });
+        expect(shellActionFromKeyboardEvent(keyEvent({ code: 'KeyA' }), panels)).toEqual({ type: 'toggle-panel', edge: 'left' });
+        expect(shellActionFromKeyboardEvent(keyEvent({ code: 'KeyS' }), panels)).toEqual({ type: 'toggle-panel', edge: 'bottom' });
+        expect(shellActionFromKeyboardEvent(keyEvent({ code: 'KeyD' }), panels)).toEqual({ type: 'toggle-panel', edge: 'right' });
+    });
+    it('suppresses panel hotkeys in editable controls', () => {
+        const input = document.createElement('input');
+        const event = keyEvent({ code: 'KeyW' });
+        Object.defineProperty(event, 'target', { value: input });
+        expect(shellActionFromKeyboardEvent(event, resolveShellConfig().panels)).toBe(null);
+    });
+    it('keeps the shortcuts overlay available on question mark', () => {
+        expect(shellActionFromKeyboardEvent(keyEvent({ key: '?', code: 'Slash', shiftKey: true }), resolveShellConfig().panels)).toEqual({ type: 'show-shortcuts' });
+    });
+    it('does not open shortcuts when typing ? in an editable control', () => {
+        const input = document.createElement('input');
+        const event = keyEvent({ key: '?', code: 'Slash', shiftKey: true });
+        Object.defineProperty(event, 'target', { value: input });
+        expect(shellActionFromKeyboardEvent(event, resolveShellConfig().panels)).toBe(null);
+    });
+});

package/dist/components/workspace/__tests__/admin-shell-settings.test.js

@@ -0,0 +1,25 @@
+import { describe, expect, it } from 'vitest';
+import { mergeShellSettingsDelta, resolveHotkey, resolveInitialPanelState, resolveShellConfig, } from '../admin-shell/settings.js';
+describe('AdminShell settings', () => {
+    it('treats false app config as a hidden edge', () => {
+        const config = resolveShellConfig({ right: false });
+        expect(config.panels.right.initial).toBe('hidden');
+        expect(resolveInitialPanelState('right', config.panels.right)).toBe('hidden');
+        expect(resolveHotkey('right', config.panels.right)).toBeNull();
+    });
+    it('resolves user panel deltas over app defaults', () => {
+        const config = resolveShellConfig({
+            left: { initial: 'collapsed' },
+        });
+        expect(resolveInitialPanelState('left', config.panels.left, {
+            panels: { left: 'expanded' },
+        })).toBe('expanded');
+    });
+    it('merges sparse deltas without replacing unrelated keys', () => {
+        expect(mergeShellSettingsDelta({ hotkeysEnabled: true, panels: { left: 'expanded' } }, { keymap: { top: { code: 'KeyQ' } } })).toEqual({
+            hotkeysEnabled: true,
+            panels: { left: 'expanded' },
+            keymap: { top: { code: 'KeyQ' } },
+        });
+    });
+});

package/dist/components/workspace/__tests__/admin-shell-state.test.js

@@ -0,0 +1,110 @@
+import { describe, expect, it, vi } from 'vitest';
+import { createShellState } from '../admin-shell/state.svelte.js';
+describe('ShellState', () => {
+    it('allows panels to expand independently by default', () => {
+        const shell = createShellState();
+        shell.expandPanel('top');
+        shell.expandPanel('bottom');
+        expect(shell.panels.top).toBe('expanded');
+        expect(shell.panels.bottom).toBe('expanded');
+    });
+    it('closes peers in the same exclusivity group', () => {
+        const shell = createShellState({
+            config: {
+                top: { exclusiveGroup: 'vertical' },
+                bottom: { exclusiveGroup: 'vertical' },
+            },
+        });
+        shell.expandPanel('top');
+        shell.expandPanel('bottom');
+        expect(shell.panels.top).toBe('collapsed');
+        expect(shell.panels.bottom).toBe('expanded');
+    });
+    it('registers and unregisters focus tools', () => {
+        const shell = createShellState();
+        const unregister = shell.registerFocusTool({
+            id: 'activity',
+            label: 'Activity',
+        });
+        expect(shell.focusTools.map((tool) => tool.id)).toEqual(['activity']);
+        expect(shell.activeFocusToolId).toBe('activity');
+        unregister();
+        expect(shell.focusTools).toEqual([]);
+        expect(shell.activeFocusToolId).toBeNull();
+    });
+    it('re-homes activities to system when their edge is hidden', () => {
+        const shell = createShellState({ config: { right: false } });
+        shell.upsertActivity({
+            id: 'encode-1',
+            label: 'Encode',
+            kind: 'video-encode',
+            scope: 'focus',
+            status: 'running',
+        });
+        expect(shell.listActivities()[0]?.edge).toBe('bottom');
+        expect(shell.activityBadge('bottom').count).toBe(1);
+    });
+    it('emits lifecycle events for activity updates', () => {
+        const shell = createShellState();
+        const listener = vi.fn();
+        shell.watchActivities(listener);
+        shell.upsertActivity({
+            id: 'import-1',
+            label: 'Import',
+            kind: 'import',
+            scope: 'system',
+            status: 'running',
+        });
+        shell.updateActivity('import-1', { status: 'completed' });
+        expect(listener).toHaveBeenCalledWith(expect.objectContaining({ type: 'transition' }));
+    });
+    it('keeps an exclusivity-closed peer collapsed after settings re-resolve', () => {
+        const shell = createShellState({
+            config: {
+                top: { exclusiveGroup: 'vertical' },
+                bottom: { exclusiveGroup: 'vertical' },
+            },
+        });
+        shell.expandPanel('top');
+        shell.expandPanel('bottom');
+        // Re-applying settings (as hydrate / app-default changes do) must not
+        // resurrect the peer the exclusivity rule collapsed.
+        shell.applySettings({});
+        expect(shell.panels.top).toBe('collapsed');
+        expect(shell.panels.bottom).toBe('expanded');
+    });
+    it('re-homes to a visible edge when both the scope edge and system are hidden', () => {
+        const shell = createShellState({ config: { right: false, bottom: false } });
+        shell.upsertActivity({
+            id: 'encode-2',
+            label: 'Encode',
+            kind: 'video-encode',
+            scope: 'focus',
+            status: 'running',
+        });
+        const edge = shell.listActivities()[0]?.edge;
+        expect(edge).toBeDefined();
+        expect(shell.panels[edge]).not.toBe('hidden');
+    });
+    it('flags progress-only updates as upsert with a previous snapshot', () => {
+        const shell = createShellState();
+        const events = [];
+        shell.watchActivities((event) => {
+            if (event.type !== 'remove') {
+                events.push(`${event.type}:${event.previous ? 'has-prev' : 'new'}`);
+            }
+        });
+        shell.upsertActivity({
+            id: 'encode-3',
+            label: 'Encode',
+            kind: 'video-encode',
+            scope: 'system',
+            status: 'running',
+            progress: 10,
+        });
+        shell.updateActivity('encode-3', { progress: 40 });
+        // A new activity is a notify-worthy "started"; a progress-only tick is an
+        // upsert carrying `previous`, which the toaster filters out.
+        expect(events).toEqual(['upsert:new', 'upsert:has-prev']);
+    });
+});

package/dist/components/workspace/__tests__/index.test.js

@@ -1,37 +1,28 @@
-/**
- * Smoke test: the workspace subpath barrel must export the new
- * NavTree and Breadcrumbs components (plus existing types).
- */
 import { describe, expect, it } from 'vitest';
 import * as workspace from '../index.js';
 describe('workspace barrel', () => {
-    it('exports NavTree', () => {
-        expect(workspace.NavTree).toBeDefined();
+    it('exports AdminShell', () => {
+        expect(workspace.AdminShell).toBeDefined();
     });
-    it('exports Breadcrumbs', () => {
-        expect(workspace.Breadcrumbs).toBeDefined();
+    it('exports shell state helpers', () => {
+        expect(workspace.createShellState).toBeDefined();
+        expect(workspace.resolveShellConfig).toBeDefined();
     });
-    it('exports RoleShell', () => {
-        expect(workspace.RoleShell).toBeDefined();
+    it('exports settings and activity components', () => {
+        expect(workspace.ShellSettingsPanel).toBeDefined();
+        expect(workspace.ActivityList).toBeDefined();
     });
-    it('exports navTreeFromManifest helper', () => {
-        expect(workspace.navTreeFromManifest).toBeDefined();
-        expect(typeof workspace.navTreeFromManifest).toBe('function');
+    it('exports tenant nav helper from the manifest implementation', () => {
+        expect(workspace.tenantNavFromManifest).toBeDefined();
+        expect(typeof workspace.tenantNavFromManifest).toBe('function');
     });
     it('exports pluralizeClassName helper', () => {
         expect(workspace.pluralizeClassName).toBeDefined();
         expect(typeof workspace.pluralizeClassName).toBe('function');
     });
-    it('re-exports ToolsDockEvents for typed dock:* event payloads', () => {
-        // Compile-time assertion: the type must be importable from the barrel
-        // so consumers can reference the built-in `'dock:*'` event payloads in
-        // their own typed wrappers / stores.
-        // (No runtime export; the `import type` above is the real check.)
-        const _typeCheck = {
-            isOpen: false,
-            activeTool: null,
-            context: null,
-        };
-        expect(_typeCheck.isOpen).toBe(false);
+    it('does not export first-generation shell components as first-class API', () => {
+        expect('WorkspaceShell' in workspace).toBe(false);
+        expect('RoleShell' in workspace).toBe(false);
+        expect('ToolsDock' in workspace).toBe(false);
     });
 });

package/dist/components/workspace/__tests__/typed-tool-fixture/register-typed-tool.d.ts

@@ -23,7 +23,8 @@
  * If TypeScript ever rejects this file under strict checks, the regression
  * from review thread #1239/PRRT_kwDOQDruXs6CbBcK has returned.
  */
-import { type DefineToolsDockOptions, type ToolDef, type ToolsDockApi, type ToolsDockContext, type ToolsDockInstance } from '../../index.js';
+import { type DefineToolsDockOptions, type ToolsDockInstance } from '../../tools-dock/define-tools-dock.svelte.js';
+import type { ToolDef, ToolsDockApi, ToolsDockContext } from '../../types.js';
 import type { MyActions, MyData } from './typed-tool-types.js';
 /** Type-only export: a tool registry that uses the typed component. */
 export declare const typedTool: ToolDef;

package/dist/components/workspace/__tests__/typed-tool-fixture/register-typed-tool.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"register-typed-tool.d.ts","sourceRoot":"","sources":["../../../../../src/components/workspace/__tests__/typed-tool-fixture/register-typed-tool.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,EACL,KAAK,sBAAsB,EAE3B,KAAK,OAAO,EACZ,KAAK,YAAY,EACjB,KAAK,gBAAgB,EACrB,KAAK,iBAAiB,EACvB,MAAM,gBAAgB,CAAC;AAExB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAE/D,uEAAuE;AACvE,eAAO,MAAM,SAAS,EAAE,OAQvB,CAAC;AAEF,wEAAwE;AACxE,eAAO,MAAM,YAAY,EAAE,sBAAsB,CAAC,MAAM,EAAE,SAAS,CAElE,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,YAAY,EAAE,gBAAgB,CAAC,MAAM,EAAE,SAAS,CAO5D,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,cAAc,EAAE,gBAK5B,CAAC;AAEF,sEAAsE;AACtE,MAAM,MAAM,mBAAmB,GAAG,YAAY,CAAC,SAAS,CAAC,SAAS,MAAM,CAAC,GACrE,CAAC,GACD,KAAK,CAAC;AAEV;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,oBAAoB,IAAI,iBAAiB,CAAC,MAAM,EAAE,SAAS,CAAC,CAmC3E"}
+{"version":3,"file":"register-typed-tool.d.ts","sourceRoot":"","sources":["../../../../../src/components/workspace/__tests__/typed-tool-fixture/register-typed-tool.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,EACL,KAAK,sBAAsB,EAE3B,KAAK,iBAAiB,EACvB,MAAM,8CAA8C,CAAC;AACtD,OAAO,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAE9E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAE/D,uEAAuE;AACvE,eAAO,MAAM,SAAS,EAAE,OAQvB,CAAC;AAEF,wEAAwE;AACxE,eAAO,MAAM,YAAY,EAAE,sBAAsB,CAAC,MAAM,EAAE,SAAS,CAElE,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,YAAY,EAAE,gBAAgB,CAAC,MAAM,EAAE,SAAS,CAO5D,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,cAAc,EAAE,gBAK5B,CAAC;AAEF,sEAAsE;AACtE,MAAM,MAAM,mBAAmB,GAAG,YAAY,CAAC,SAAS,CAAC,SAAS,MAAM,CAAC,GACrE,CAAC,GACD,KAAK,CAAC;AAEV;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,oBAAoB,IAAI,iBAAiB,CAAC,MAAM,EAAE,SAAS,CAAC,CAmC3E"}

package/dist/components/workspace/__tests__/typed-tool-fixture/register-typed-tool.js

@@ -23,7 +23,7 @@
  * If TypeScript ever rejects this file under strict checks, the regression
  * from review thread #1239/PRRT_kwDOQDruXs6CbBcK has returned.
  */
-import { defineToolsDock, } from '../../index.js';
+import { defineToolsDock, } from '../../tools-dock/define-tools-dock.svelte.js';
 import TypedTool from './TypedTool.svelte';
 /** Type-only export: a tool registry that uses the typed component. */
 export const typedTool = {

package/dist/components/workspace/admin-shell/ActivityBadge.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+import { Badge } from '@happyvertical/smrt-ui/ui';
+import { useAdminShell } from './context.js';
+import type { PanelEdge } from './types.js';
+
+interface Props {
+  edge: PanelEdge;
+  label?: string;
+}
+
+let { edge, label = 'Running activities' }: Props = $props();
+const shell = useAdminShell();
+const badge = $derived(shell.activityBadge(edge));
+</script>
+
+{#if badge.count > 0 || badge.hasFailed}
+  <Badge
+    variant={badge.hasFailed ? 'error' : 'primary'}
+    size="sm"
+    title={label}
+    aria-label={`${label}: ${badge.count}`}
+  >
+    {badge.progress !== null ? `${Math.round(badge.progress)}%` : badge.count}
+  </Badge>
+{/if}

package/dist/components/workspace/admin-shell/ActivityBadge.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { PanelEdge } from './types.js';
+interface Props {
+    edge: PanelEdge;
+    label?: string;
+}
+declare const ActivityBadge: import("svelte").Component<Props, {}, "">;
+type ActivityBadge = ReturnType<typeof ActivityBadge>;
+export default ActivityBadge;
+//# sourceMappingURL=ActivityBadge.svelte.d.ts.map