@loomweaver/shell 0.7.4 → 0.7.6

package/fesm2022/loomweaver-shell.mjs

@@ -12,7 +12,7 @@ import { filter, map, of, catchError, forkJoin } from 'rxjs';
 import { DomSanitizer } from '@angular/platform-browser';
 import { WindowMessenger, connect } from 'penpal';
 import DOMPurify from 'dompurify';
-import { heroMinus, heroArrowsPointingIn, heroArrowTopRightOnSquare, heroArrowsPointingOut, heroArrowDownTray, heroPuzzlePiece, heroMagnifyingGlass, heroQuestionMarkCircle, heroCog6Tooth, heroXCircle, heroExclamationTriangle, heroCheck, heroLockClosed, heroInformationCircle, heroArrowUturnLeft, heroArrowPath, heroArrowsUpDown, heroEye, heroTrash, heroPencilSquare, heroPlus, heroListBullet, heroBars3, heroDocument, heroRectangleGroup, heroXMark, heroChevronDown, heroChevronDoubleRight, heroChevronDoubleLeft, heroComputerDesktop, heroMoon, heroSun } from '@ng-icons/heroicons/outline';
+import { heroMinus, heroArrowsPointingIn, heroArrowTopRightOnSquare, heroArrowsPointingOut, heroArrowDownTray, heroPuzzlePiece, heroMagnifyingGlass, heroQuestionMarkCircle, heroCog6Tooth, heroXCircle, heroExclamationTriangle, heroCheck, heroLockClosed, heroInformationCircle, heroArrowUturnLeft, heroArrowPath, heroArrowsUpDown, heroEye, heroTrash, heroPencilSquare, heroPlus, heroListBullet, heroBars3, heroViewColumns, heroDocument, heroRectangleGroup, heroXMark, heroChevronDown, heroChevronDoubleRight, heroChevronDoubleLeft, heroComputerDesktop, heroMoon, heroSun } from '@ng-icons/heroicons/outline';
 import { HttpClient, provideHttpClient } from '@angular/common/http';
 import { SwUpdate, provideServiceWorker } from '@angular/service-worker';
 import { marked } from 'marked';
@@ -65,8 +65,15 @@ function withoutQuery(url) {
     const end = url.search(/[?#]/);
     return end === -1 ? url : url.slice(0, end);
 }
+function withoutTrailingSlashes$1(path) {
+    let end = path.length;
+    while (end > 0 && path[end - 1] === '/') {
+        end -= 1;
+    }
+    return path.slice(0, end);
+}
 function bare(url) {
-    return withoutQuery(url).replace(/^\/+/, '').replace(/\/+$/, '');
+    return withoutTrailingSlashes$1(withoutQuery(url).replace(/^\/+/, ''));
 }
 function isPopoutUrl(url) {
     const path = bare(url);
@@ -94,7 +101,7 @@ function popoutUrlFor(paneTarget) {
 }
 
 function upsertBy(items, item, matches) {
-    const index = items.findIndex(matches);
+    const index = items.findIndex((existing) => matches(existing));
     if (index === -1) {
         return [...items, item];
     }
@@ -310,7 +317,7 @@ class ContributionRegistry {
         const visible = omitted.size === 0
             ? docked
             : docked.filter((entry) => entry.id === undefined || !omitted.has(entry.id));
-        return visible.map(entryToView);
+        return visible.map((entry) => entryToView(entry));
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "views" }] : /* istanbul ignore next */ []));
     barItems = this.visible(this.barItemsSignal);
@@ -321,7 +328,7 @@ class ContributionRegistry {
      * picker, `matchRoute` — drops them without knowing about omission.
      */
     contentRoutes = computed(() => {
-        const routes = this.routableSurfaces().map(entryToContentRoute);
+        const routes = this.routableSurfaces().map((entry) => entryToContentRoute(entry));
         const omitted = this.omittedSignal();
         if (omitted.size === 0) {
             return routes;
@@ -340,7 +347,7 @@ class ContributionRegistry {
             return NO_ROUTES;
         }
         return this.routableSurfaces()
-            .map(entryToContentRoute)
+            .map((entry) => entryToContentRoute(entry))
             .filter((route) => isRouteOmitted(route, omitted));
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "omittedContentRoutes" }] : /* istanbul ignore next */ []));
@@ -436,13 +443,13 @@ class ContributionRegistry {
     }
     /** Adds a menu-slot item. With an `id` a re-registration replaces in place (last-in wins); without one the item is additive and dispose removes this exact contribution. */
     addMenuItem(item) {
-        this.menuItemsSignal.update((items) => upsertBy(items, item, (i) => item.id !== undefined && i.id === item.id));
+        this.menuItemsSignal.update((items) => upsertBy(items, item, (index) => item.id !== undefined && index.id === item.id));
         return {
-            dispose: () => this.menuItemsSignal.update((items) => items.filter((i) => i !== item)),
+            dispose: () => this.menuItemsSignal.update((items) => items.filter((index) => index !== item)),
         };
     }
     removeMenuItemById(id) {
-        this.menuItemsSignal.update((items) => items.filter((i) => i.id !== id));
+        this.menuItemsSignal.update((items) => items.filter((index) => index.id !== id));
     }
     addSurface(entry) {
         this.surfacesSignal.update((entries) => upsertBy(entries, entry, sameSlotAs(entry)));
@@ -462,11 +469,11 @@ class ContributionRegistry {
     add(target, item) {
         target.update((items) => upsertById(items, item));
         return {
-            dispose: () => target.update((items) => items.filter((i) => i !== item)),
+            dispose: () => target.update((items) => items.filter((index) => index !== item)),
         };
     }
     removeById(target, id) {
-        target.update((items) => items.filter((i) => i.id !== id));
+        target.update((items) => items.filter((index) => index.id !== id));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: ContributionRegistry, deps: [], target: i0.ɵɵFactoryTarget.Service });
     static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.0", ngImport: i0, type: ContributionRegistry });
@@ -485,7 +492,7 @@ function sameSlotAs(entry) {
 }
 
 function normalizePath(url) {
-    return url.split(/[?#]/)[0].replace(/^\/+/, '');
+    return url.split(/[?#]/, 1)[0].replace(/^\/+/, '');
 }
 function segmentsOf(path) {
     return normalizePath(path).split('/').filter(Boolean);
@@ -538,11 +545,11 @@ function paramsOfPattern(pattern, path) {
     const parts = segmentsOf(pattern);
     const segments = segmentsOf(path);
     const params = {};
-    parts.forEach((part, index) => {
+    for (const [index, part] of parts.entries()) {
         if (part.startsWith(':') && segments[index] !== undefined) {
             params[part.slice(1)] = segments[index];
         }
-    });
+    }
     return params;
 }
 function routeParams(route, path) {
@@ -647,7 +654,7 @@ function reusableRoute(route) {
     return route.routeConfig?.data?.['chromeless'] !== true;
 }
 function effectiveRetain(declared, fallback) {
-    return declared !== undefined ? declared === 'always' : fallback === 'retain';
+    return declared === undefined ? fallback === 'retain' : declared === 'always';
 }
 function routeRetains(route, fallback) {
     if (route.container !== undefined) {
@@ -672,7 +679,7 @@ function surfaceRetentionMode(routes, path) {
     if (!route || route.container !== undefined) {
         return 'rebuild';
     }
-    return route.iframe !== undefined ? 'in-place' : 'move';
+    return route.iframe === undefined ? 'move' : 'in-place';
 }
 function containerChildInstances(entries, tabPath) {
     const scoped = containerDockFor(tabPath) + ':';
@@ -732,11 +739,11 @@ class ContentReuseStrategy {
     changes = signal(0, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "changes" }] : /* istanbul ignore next */ []));
     version = this.changes.asReadonly();
-    shouldReuseRoute(future, curr) {
-        if (!isContentRoute(future) || !isContentRoute(curr)) {
-            return future.routeConfig === curr.routeConfig;
+    shouldReuseRoute(future, current) {
+        if (!isContentRoute(future) || !isContentRoute(current)) {
+            return future.routeConfig === current.routeConfig;
         }
-        return future.routeConfig === curr.routeConfig && sameParams(future, curr);
+        return future.routeConfig === current.routeConfig && sameParams(future, current);
     }
     shouldDetach(route) {
         return reusableRoute(route);
@@ -782,11 +789,12 @@ class ContentReuseStrategy {
     }
     pruneExcept(isLive) {
         for (const [key, handle] of this.handles) {
-            if (!isLive(key)) {
-                handle.componentRef?.destroy();
-                this.handles.delete(key);
-                this.changes.update((value) => value + 1);
+            if (isLive(key)) {
+                continue;
             }
+            handle.componentRef?.destroy();
+            this.handles.delete(key);
+            this.changes.update((value) => value + 1);
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: ContentReuseStrategy, deps: [], target: i0.ɵɵFactoryTarget.Service });
@@ -884,7 +892,7 @@ class StateSyncChannel {
         }
         try {
             const opened = new BroadcastChannel(CHANNEL_NAME);
-            opened.onmessage = (event) => this.receive(event.data);
+            opened.addEventListener('message', (event) => this.receive(event.data));
             return opened;
         }
         catch {
@@ -1024,7 +1032,7 @@ function cleanArea(area, options, problems, depth) {
         problems.push(`${options.context}: the arrangement nests deeper than ${MAX_DEPTH} levels — the deeper areas are dropped.`);
         return null;
     }
-    const kinds = ['tabs', 'rows', 'columns'].filter((key) => key in area);
+    const kinds = ['tabs', 'rows', 'columns'].filter((key) => Object.hasOwn(area, key));
     if (kinds.length !== 1) {
         problems.push(`${options.context}: a pane area must be exactly one of tabs, rows or columns.`);
         return null;
@@ -1093,7 +1101,7 @@ function cleanTabsArea(area, size, options, problems) {
 function collectTabs$1(area) {
     return area.kind === 'tabs'
         ? [...area.tabs]
-        : area.children.flatMap(collectTabs$1);
+        : area.children.flatMap((child) => collectTabs$1(child));
 }
 function buildNode(area, idPrefix, ctx, indexPath) {
     if (area.kind === 'tabs') {
@@ -1122,6 +1130,12 @@ function buildNode(area, idPrefix, ctx, indexPath) {
     };
     return chain(0, 1);
 }
+function evenShareOf(remainder, declaredSum, children, unspecified) {
+    if (unspecified === 0) {
+        return 0;
+    }
+    return remainder > 0 ? remainder / unspecified : declaredSum / children;
+}
 function fractionsOf(children) {
     const declared = children
         .map((child) => child.size)
@@ -1129,11 +1143,7 @@ function fractionsOf(children) {
     const declaredSum = declared.reduce((sum, size) => sum + size, 0);
     const unspecified = children.length - declared.length;
     const remainder = Math.max(0, 100 - declaredSum);
-    const evenShare = unspecified > 0
-        ? remainder > 0
-            ? remainder / unspecified
-            : declaredSum / children.length
-        : 0;
+    const evenShare = evenShareOf(remainder, declaredSum, children.length, unspecified);
     const weights = children.map((child) => child.size ?? evenShare);
     const total = weights.reduce((sum, weight) => sum + weight, 0);
     return weights.map((weight) => weight / total);
@@ -1168,7 +1178,12 @@ function claimFor(claims, path) {
     if (matching.length === 0) {
         return null;
     }
-    const best = matching.reduce((winner, claim) => narrower(claim.pattern, winner.pattern) > 0 ? claim : winner);
+    let best = matching[0];
+    for (const claim of matching) {
+        if (narrower(claim.pattern, best.pattern) > 0) {
+            best = claim;
+        }
+    }
     const tied = matching.filter((claim) => claim.workspaceId !== best.workspaceId &&
         narrower(claim.pattern, best.pattern) === 0);
     return tied.length === 0 ? best : null;
@@ -1186,9 +1201,12 @@ function contestedShapes(claims) {
     return new Map([...byShape].filter(([, owners]) => owners.length > 1));
 }
 function conflictingClaims(claims) {
-    return [...contestedShapes(claims)].map(([shape, owners]) => `Workspaces ${owners.map((id) => `"${id}"`).join(' and ')} both claim "${shape}" — ` +
-        `neither is narrower than the other, so the claim is dropped and that address ` +
-        `behaves as though nothing claimed it. Give the address one home.`);
+    return [...contestedShapes(claims)].map(([shape, owners]) => {
+        const named = owners.map((id) => `"${id}"`).join(' and ');
+        return (`Workspaces ${named} both claim "${shape}" — ` +
+            `neither is narrower than the other, so the claim is dropped and that address ` +
+            `behaves as though nothing claimed it. Give the address one home.`);
+    });
 }
 function withoutConflicts(claims) {
     const contested = contestedShapes(claims);
@@ -1230,8 +1248,8 @@ function leafWith(id, tabs, candidateActive, declared) {
         kind: 'leaf',
         id,
         tabs,
-        ...(active === undefined ? {} : { active }),
-        ...(declared ? { declared: true } : {}),
+        ...(active !== undefined && { active }),
+        ...(declared && { declared: true }),
     };
 }
 
@@ -1324,15 +1342,13 @@ function normalizeTab(value) {
     }
     return {
         path: tab['path'],
-        ...(tab['pinned'] === true ? { pinned: true } : {}),
-        ...(tab['preview'] === true ? { preview: true } : {}),
-        ...(tab['closable'] === false ? { closable: false } : {}),
-        ...(typeof tab['title'] === 'string' ? { title: tab['title'] } : {}),
-        ...(tab['literalTitle'] === true ? { literalTitle: true } : {}),
-        ...(typeof tab['icon'] === 'string' ? { icon: tab['icon'] } : {}),
-        ...(typeof tab['instance'] === 'string'
-            ? { instance: tab['instance'] }
-            : {}),
+        ...(tab['pinned'] === true && { pinned: true }),
+        ...(tab['preview'] === true && { preview: true }),
+        ...(tab['closable'] === false && { closable: false }),
+        ...(typeof tab['title'] === 'string' && { title: tab['title'] }),
+        ...(tab['literalTitle'] === true && { literalTitle: true }),
+        ...(typeof tab['icon'] === 'string' && { icon: tab['icon'] }),
+        ...(typeof tab['instance'] === 'string' && { instance: tab['instance'] }),
     };
 }
 function normalizeLeafNode(id, node) {
@@ -1342,7 +1358,7 @@ function normalizeLeafNode(id, node) {
     }
     const rawTabs = node['tabs'];
     const tabs = Array.isArray(rawTabs)
-        ? rawTabs.map(normalizeTab).filter((tab) => tab !== null)
+        ? rawTabs.map((value) => normalizeTab(value)).filter((tab) => tab !== null)
         : [];
     const rawActive = node['active'];
     return leafWith(id, tabs, typeof rawActive === 'string' ? rawActive : undefined, node['declared'] === true);
@@ -1415,11 +1431,11 @@ function auditWorkspaceDefinitions(definitions, panelRegions) {
         }
         seen.add(definition.id);
         if (definition.initial) {
-            if (initial !== null) {
-                problems.push(`Workspace "${definition.id}" also declares initial: true — "${initial}" already does, so this one is ignored.`);
+            if (initial === null) {
+                initial = definition.id;
             }
             else {
-                initial = definition.id;
+                problems.push(`Workspace "${definition.id}" also declares initial: true — "${initial}" already does, so this one is ignored.`);
             }
         }
         auditDefinition(definition, panelRegions, problems);
@@ -1477,13 +1493,13 @@ function baselineSidebars(definition, deps) {
     if (sidebars === undefined) {
         return {};
     }
-    const listed = deps.panelRegions.filter((region) => region in sidebars);
+    const listed = deps.panelRegions.filter((region) => Object.hasOwn(sidebars, region));
     const hidden = listed
         .flatMap((region) => deps
         .declaredPaths(region)
         .map((path) => path.slice(VIEW_PANE_PREFIX.length))
         .filter((id) => !sidebars[region].includes(id)))
-        .sort();
+        .toSorted((a, b) => a.localeCompare(b));
     return hidden.length === 0 ? {} : { hiddenViews: JSON.stringify(hidden) };
 }
 function declaredTabPaths(definition) {
@@ -1511,7 +1527,7 @@ function bakeTab(definitionId, entry, problems) {
     return {
         tab: {
             path: tab.path,
-            ...(tab.closable === false ? { closable: false } : {}),
+            ...(tab.closable === false && { closable: false }),
         },
         active: tab.active === true,
     };
@@ -1592,9 +1608,16 @@ function movable(parent) {
 function supportsAtomicMove(document) {
     return movable(document.body ?? document.documentElement);
 }
+function insertNode(parent, node, before) {
+    if (before === null) {
+        parent.append(node);
+        return;
+    }
+    before.before(node);
+}
 function moveNode(parent, node, before) {
     if (!movable(parent) || !node.isConnected) {
-        parent.insertBefore(node, before);
+        insertNode(parent, node, before);
         return false;
     }
     try {
@@ -1602,7 +1625,7 @@ function moveNode(parent, node, before) {
         return true;
     }
     catch {
-        parent.insertBefore(node, before);
+        insertNode(parent, node, before);
         return false;
     }
 }
@@ -1652,10 +1675,11 @@ class RetainedViewStash {
             },
             stale: () => entry.tracked && (!owns() || this.entries.get(key) !== entry),
             describe: (mode, retain) => {
-                if (owns()) {
-                    entry.mode = mode;
-                    entry.keep = retain;
+                if (!owns()) {
+                    return;
                 }
+                entry.mode = mode;
+                entry.keep = retain;
             },
             release: (retained) => {
                 if (owns()) {
@@ -1722,14 +1746,16 @@ class RetainedViewStash {
         }
     }
     evictWorkspace(workspaceId) {
-        for (const entry of [...this.entries.values()]) {
+        const snapshot = [...this.entries.values()];
+        for (const entry of snapshot) {
             if (!entry.inUse && entry.workspace === workspaceId) {
                 this.destroyEntry(entry);
             }
         }
     }
     ngOnDestroy() {
-        for (const entry of [...this.entries.values()]) {
+        const snapshot = [...this.entries.values()];
+        for (const entry of snapshot) {
             this.destroyEntry(entry);
         }
         this.holdingArea?.remove();
@@ -1835,7 +1861,7 @@ class RetainedViewStash {
         const area = this.document.createElement('div');
         area.dataset['lwRetentionHold'] = '';
         area.style.display = 'none';
-        this.document.body.appendChild(area);
+        this.document.body.append(area);
         this.holdingArea = area;
         return area;
     }
@@ -1846,7 +1872,7 @@ class RetainedViewStash {
     }
     pullNodes(entry) {
         for (const node of liveRootNodes(entry)) {
-            node.parentNode?.removeChild(node);
+            node.remove();
         }
     }
     destroyEntry(entry) {
@@ -1870,7 +1896,8 @@ class RetainedViewStash {
         this.sweepQueued = true;
         queueMicrotask(() => {
             this.sweepQueued = false;
-            for (const entry of [...this.entries.values()]) {
+            const snapshot = [...this.entries.values()];
+            for (const entry of snapshot) {
                 if (entry.inUse) {
                     continue;
                 }
@@ -1950,7 +1977,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
             type: Service
         }] });
 function pathOfStashKey(key) {
-    return key.split('|')[1] ?? '';
+    return key.split('|', 2)[1] ?? '';
 }
 
 class RetentionUnloadGuard {
@@ -1983,7 +2010,6 @@ class RetentionUnloadGuard {
             return;
         }
         event.preventDefault();
-        event.returnValue = '';
     };
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: RetentionUnloadGuard, deps: [], target: i0.ɵɵFactoryTarget.Service });
     static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.0", ngImport: i0, type: RetentionUnloadGuard });
@@ -2169,16 +2195,20 @@ function isMacPlatform() {
 function normaliseKey(key) {
     const lower = key.toLowerCase();
     switch (lower) {
-        case 'esc':
+        case 'esc': {
             return 'escape';
-        case 'return':
+        }
+        case 'return': {
             return 'enter';
+        }
         case 'space':
         case 'spacebar':
-        case ' ':
+        case ' ': {
             return 'space';
-        default:
+        }
+        default: {
             return lower;
+        }
     }
 }
 function toSignature(parts) {
@@ -2202,72 +2232,89 @@ function chordSignature(chord, isMac) {
     };
     for (const raw of chord.split('+')) {
         const token = raw.trim().toLowerCase();
-        if (!token) {
-            continue;
+        if (token) {
+            applyToken(parts, token, isMac);
         }
-        switch (token) {
-            case 'mod':
-                if (isMac)
-                    parts.meta = true;
-                else
-                    parts.ctrl = true;
-                break;
-            case 'ctrl':
-            case 'control':
-                parts.ctrl = true;
-                break;
-            case 'meta':
-            case 'cmd':
-            case 'command':
-            case 'win':
+    }
+    return parts.key ? toSignature(parts) : null;
+}
+function applyToken(parts, token, isMac) {
+    switch (token) {
+        case 'mod': {
+            if (isMac)
                 parts.meta = true;
-                break;
-            case 'alt':
-            case 'option':
-                parts.alt = true;
-                break;
-            case 'shift':
-                parts.shift = true;
-                break;
-            default:
-                parts.key = normaliseKey(token);
+            else
+                parts.ctrl = true;
+            return;
+        }
+        case 'ctrl':
+        case 'control': {
+            parts.ctrl = true;
+            return;
+        }
+        case 'meta':
+        case 'cmd':
+        case 'command':
+        case 'win': {
+            parts.meta = true;
+            return;
+        }
+        case 'alt':
+        case 'option': {
+            parts.alt = true;
+            return;
+        }
+        case 'shift': {
+            parts.shift = true;
+            return;
+        }
+        default: {
+            parts.key = normaliseKey(token);
         }
     }
-    return parts.key ? toSignature(parts) : null;
 }
 function formatShortcut(chord, isMac) {
     const tokens = chord.split('+').map((raw) => {
         const token = raw.trim().toLowerCase();
         switch (token) {
-            case 'mod':
+            case 'mod': {
                 return isMac ? '⌘' : 'Ctrl';
+            }
             case 'ctrl':
-            case 'control':
+            case 'control': {
                 return isMac ? '⌃' : 'Ctrl';
+            }
             case 'meta':
             case 'cmd':
             case 'command':
-            case 'win':
+            case 'win': {
                 return isMac ? '⌘' : 'Meta';
+            }
             case 'alt':
-            case 'option':
+            case 'option': {
                 return isMac ? '⌥' : 'Alt';
-            case 'shift':
+            }
+            case 'shift': {
                 return isMac ? '⇧' : 'Shift';
+            }
             case 'enter':
-            case 'return':
+            case 'return': {
                 return isMac ? '↵' : 'Enter';
+            }
             case 'escape':
-            case 'esc':
+            case 'esc': {
                 return 'Esc';
+            }
             case 'space':
             case 'spacebar':
-            case ' ':
+            case ' ': {
                 return 'Space';
-            default:
+            }
+            default: {
                 return token.length === 1
                     ? token.toUpperCase()
                     : token.charAt(0).toUpperCase() + token.slice(1);
+            }
         }
     });
     return tokens.join(isMac ? '' : '+');
@@ -2428,20 +2475,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
             type: Service
         }] });
 
-function upgradeElementProperty(el, name) {
-    const self = el;
-    if (Object.prototype.hasOwnProperty.call(el, name)) {
+function upgradeElementProperty(element, name) {
+    const self = element;
+    if (Object.hasOwn(element, name)) {
         const value = self[name];
         delete self[name];
         self[name] = value;
     }
 }
-function reflectAttribute(el, name, value) {
+function reflectAttribute(element, name, value) {
     if (value === null || value === undefined) {
-        el.removeAttribute(name);
+        element.removeAttribute(name);
     }
     else {
-        el.setAttribute(name, value);
+        element.setAttribute(name, value);
     }
 }
 
@@ -2568,7 +2615,9 @@ class LwMenuElement extends HTMLElement {
             return;
         }
         this.active = (index + items.length) % items.length;
-        items.forEach((item, i) => (item.tabIndex = i === this.active ? 0 : -1));
+        for (const [index_, item] of items.entries()) {
+            item.tabIndex = index_ === this.active ? 0 : -1;
+        }
         const item = items[this.active];
         item.focus();
         item.scrollIntoView?.({ block: 'nearest' });
@@ -2581,18 +2630,22 @@ class LwMenuElement extends HTMLElement {
     }
     handleKeydown(event) {
         switch (event.key) {
-            case 'ArrowDown':
+            case 'ArrowDown': {
                 this.setActive(this.active < 0 ? 0 : this.active + 1);
                 break;
-            case 'ArrowUp':
-                this.setActive(this.active < 0 ? this.items().length - 1 : this.active - 1);
+            }
+            case 'ArrowUp': {
+                this.setActive((this.active < 0 ? this.items().length : this.active) - 1);
                 break;
-            case 'Home':
+            }
+            case 'Home': {
                 this.setActive(0);
                 break;
-            case 'End':
+            }
+            case 'End': {
                 this.setActive(this.items().length - 1);
                 break;
+            }
             case 'Enter':
             case ' ': {
                 const item = this.active >= 0 ? this.items()[this.active] : undefined;
@@ -2602,11 +2655,13 @@ class LwMenuElement extends HTMLElement {
                 break;
             }
             case 'Escape':
-            case 'Tab':
+            case 'Tab': {
                 this.dispatchEvent(new CustomEvent(LW_MENU_DISMISS, { bubbles: true }));
                 return;
-            default:
+            }
+            default: {
                 return;
+            }
         }
         event.preventDefault();
     }
@@ -2685,7 +2740,7 @@ class MenuService {
         document.body.append(menu);
         document.body.classList.add('lw-menu-open');
         menu.openAt(at.x, at.y);
-        const listenTimer = setTimeout(() => document.addEventListener('pointerdown', onOutside, true));
+        const listenTimer = setTimeout(() => document.addEventListener('pointerdown', onOutside, { capture: true }), 0);
         this.current = { menu, onOutside, restore, listenTimer };
     }
     resolve(menuIds, context) {
@@ -2718,7 +2773,7 @@ class MenuService {
             };
         })
             .filter((entry) => entry !== null)
-            .sort((a, b) => a.group.localeCompare(b.group) || a.order - b.order);
+            .toSorted((a, b) => a.group.localeCompare(b.group) || a.order - b.order);
     }
     createMenu(resolved) {
         const menu = document.createElement(LW_MENU_TAG);
@@ -2871,7 +2926,7 @@ class ShellBarItem {
     shortcut = computed(() => {
         const button = this.asButton();
         if (!button?.showShortcut || !button.command) {
-            return undefined;
+            return;
         }
         return this.commands.shortcutOf(this.commands.commands().find((entry) => entry.id === button.command));
     }, /* @ts-ignore */
@@ -2911,7 +2966,7 @@ class ShellBar {
             .filter((item) => item.bar === this.region().id && item.slot === slot)
             .filter((item) => this.auth.visible(item.access))
             .filter((item) => 'component' in item || this.commands.triggerable(item))
-            .sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
+            .toSorted((a, b) => (a.order ?? 0) - (b.order ?? 0));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: ShellBar, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: ShellBar, isStandalone: true, selector: "lw-shell-bar", inputs: { region: { classPropertyName: "region", publicName: "region", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<header\n  class=\"flex items-center gap-2 overflow-hidden border-border bg-surface px-2 md:px-4\"\n  [class.border-b]=\"dock() === 'top'\"\n  [class.h-12]=\"dock() === 'top'\"\n  [class.border-t]=\"dock() === 'bottom' || footer()\"\n  [class.py-1]=\"dock() === 'bottom' || footer()\"\n  [class.text-xs]=\"dock() === 'bottom'\"\n  [class.text-content-muted]=\"dock() === 'bottom'\"\n>\n  <div class=\"flex min-w-0 items-center gap-2\">\n    @for (item of startItems(); track item.id) {\n      <lw-shell-bar-item [item]=\"item\" [dock]=\"dock()\" />\n    }\n  </div>\n\n  @if (centerItems().length) {\n    <div class=\"mx-auto flex shrink-0 items-center gap-2\">\n      @for (item of centerItems(); track item.id) {\n        <lw-shell-bar-item [item]=\"item\" [dock]=\"dock()\" />\n      }\n    </div>\n  }\n\n  <div class=\"ml-auto flex shrink-0 items-center gap-2\">\n    @for (item of endItems(); track item.id) {\n      <lw-shell-bar-item [item]=\"item\" [dock]=\"dock()\" />\n    }\n  </div>\n</header>\n", dependencies: [{ kind: "component", type: ShellBarItem, selector: "lw-shell-bar-item", inputs: ["item", "dock"] }] });
@@ -3182,7 +3237,7 @@ class RailItemsService {
     }
     isVisible(itemId) {
         if (isWorkspaceRailItem(itemId)) {
-            return itemId in this.state().placed;
+            return Object.hasOwn(this.state().placed, itemId);
         }
         return !this.state().hidden.includes(itemId);
     }
@@ -3318,15 +3373,15 @@ class Reorderable {
     moveByKeyboard(item, direction) {
         const id = item.dataset['reorderId'] ?? '';
         const band = item.dataset['reorderBand'] ?? '';
-        const inBand = this.items().filter((el) => (el.dataset['reorderBand'] ?? '') === band);
-        const bandIds = inBand.map((el) => el.dataset['reorderId'] ?? '');
+        const inBand = this.items().filter((element) => (element.dataset['reorderBand'] ?? '') === band);
+        const bandIds = inBand.map((element) => element.dataset['reorderId'] ?? '');
         const target = bandIds.indexOf(id) + direction;
         if (target < 0 || target >= bandIds.length) {
             return false;
         }
         const neighbourId = bandIds[target];
         const without = this.items()
-            .map((el) => el.dataset['reorderId'] ?? '')
+            .map((element) => element.dataset['reorderId'] ?? '')
             .filter((x) => x !== id);
         const insertAt = without.indexOf(neighbourId) + (direction > 0 ? 1 : 0);
         without.splice(insertAt, 0, id);
@@ -3341,7 +3396,7 @@ class Reorderable {
     }
     focusItem(id) {
         this.items()
-            .find((el) => (el.dataset['reorderId'] ?? '') === id)
+            .find((element) => (element.dataset['reorderId'] ?? '') === id)
             ?.focus();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: Reorderable, deps: [], target: i0.ɵɵFactoryTarget.Directive });
@@ -3392,8 +3447,8 @@ class UserOrderService {
         const rank = new Map(sequence.map((id, index) => [id, index]));
         const ranked = (item) => rank.has(key(item));
         const knownInUserOrder = items
-            .filter(ranked)
-            .sort((a, b) => (rank.get(key(a)) ?? 0) - (rank.get(key(b)) ?? 0));
+            .filter((item) => ranked(item))
+            .toSorted((a, b) => (rank.get(key(a)) ?? 0) - (rank.get(key(b)) ?? 0));
         let next = 0;
         return items.map((item) => ranked(item) ? knownInUserOrder[next++] : item);
     }
@@ -3513,7 +3568,7 @@ function defaultTabTitle(route, root) {
 function withRefreshedPath(tabs, index, path) {
     return tabs[index].path === path
         ? tabs
-        : tabs.map((tab, i) => (i === index ? { ...tab, path } : tab));
+        : tabs.map((tab, index_) => (index_ === index ? { ...tab, path } : tab));
 }
 function autoOpenedTab(route, root, path) {
     if (!route ||
@@ -3553,11 +3608,11 @@ function toPaneTab(tab) {
     return {
         path: tab.path,
         title: tab.title,
-        ...(tab.literalTitle ? { literalTitle: true } : {}),
-        ...(tab.icon === undefined ? {} : { icon: tab.icon }),
-        ...(tab.pinned ? { pinned: true } : {}),
-        ...(tab.preview ? { preview: true } : {}),
-        ...(tab.closable ? {} : { closable: false }),
+        ...(tab.literalTitle && { literalTitle: true }),
+        ...(tab.icon !== undefined && { icon: tab.icon }),
+        ...(tab.pinned && { pinned: true }),
+        ...(tab.preview && { preview: true }),
+        ...(!tab.closable && { closable: false }),
     };
 }
 function facetTabViews(routes, addressOf = (route) => route.path) {
@@ -3565,7 +3620,7 @@ function facetTabViews(routes, addressOf = (route) => route.path) {
         .filter((route) => route.follows === true)
         .map((route) => ({ route, address: addressOf(route) }))
         .filter((entry) => entry.address !== null)
-        .sort((a, b) => (a.route.order ?? 0) - (b.route.order ?? 0) ||
+        .toSorted((a, b) => (a.route.order ?? 0) - (b.route.order ?? 0) ||
         a.route.path.localeCompare(b.route.path))
         .map(({ route, address }, index) => ({
         path: route.path,
@@ -3656,11 +3711,11 @@ function collidingParam(pattern, other) {
 function paramPrefixes(pattern) {
     const prefixes = new Map();
     const segments = segmentsOf(pattern);
-    segments.forEach((segment, index) => {
+    for (const [index, segment] of segments.entries()) {
         if (segment.startsWith(':')) {
             prefixes.set(segment.slice(1), segments.slice(0, index).join('/'));
         }
-    });
+    }
     return prefixes;
 }
 
@@ -3748,22 +3803,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
             type: Service
         }] });
 
-function transformLeaf(node, paneId, fn) {
+function transformLeaf(node, paneId, function_) {
     if (node.kind === 'leaf') {
-        return node.id === paneId ? fn(node) : node;
+        return node.id === paneId ? function_(node) : node;
     }
-    const first = transformLeaf(node.first, paneId, fn);
-    const second = transformLeaf(node.second, paneId, fn);
+    const first = transformLeaf(node.first, paneId, function_);
+    const second = transformLeaf(node.second, paneId, function_);
     return first === node.first && second === node.second
         ? node
         : { ...node, first, second };
 }
-function collapseLeaf(node, paneId, fn) {
+function collapseLeaf(node, paneId, function_) {
     if (node.kind === 'leaf') {
-        return node.id === paneId ? fn(node) : node;
+        return node.id === paneId ? function_(node) : node;
     }
-    const first = collapseLeaf(node.first, paneId, fn);
-    const second = collapseLeaf(node.second, paneId, fn);
+    const first = collapseLeaf(node.first, paneId, function_);
+    const second = collapseLeaf(node.second, paneId, function_);
     if (first === null) {
         return second;
     }
@@ -3878,8 +3933,8 @@ function pruneEmptyLeaves(node, primaryId, spare) {
 function insertTab(node, paneId, tab, index) {
     return transformLeaf(node, paneId, (leaf) => {
         const existingIndex = leaf.tabs.findIndex((existing) => existing.path === tab.path);
-        if (existingIndex >= 0) {
-            const tabs = leaf.tabs.map((existing, i) => i === existingIndex ? tab : existing);
+        if (existingIndex !== -1) {
+            const tabs = leaf.tabs.map((existing, index_) => index_ === existingIndex ? tab : existing);
             return { ...leaf, tabs, active: tab.path };
         }
         const at = index === undefined
@@ -3917,7 +3972,7 @@ function refineLeafTitles(leaf, skipLeaf, matches, patch) {
             ...tab,
             title: patch.title,
             literalTitle: patch.literalTitle,
-            ...(patch.icon === undefined ? {} : { icon: patch.icon }),
+            ...(patch.icon !== undefined && { icon: patch.icon }),
         };
     });
     return found
@@ -3955,7 +4010,7 @@ function reseatPinned(tabs, index, updated) {
 function pinTab(node, paneId, tabPath) {
     return transformLeaf(node, paneId, (leaf) => {
         const index = leaf.tabs.findIndex((tab) => tab.path === tabPath);
-        if (index < 0 || leaf.tabs[index].pinned === true) {
+        if (index === -1 || leaf.tabs[index].pinned === true) {
             return leaf;
         }
         const pinned = {
@@ -3968,7 +4023,7 @@ function pinTab(node, paneId, tabPath) {
 function unpinTab(node, paneId, tabPath) {
     return transformLeaf(node, paneId, (leaf) => {
         const index = leaf.tabs.findIndex((tab) => tab.path === tabPath && tab.pinned);
-        if (index < 0) {
+        if (index === -1) {
             return leaf;
         }
         const unpinned = tabWithout(leaf.tabs[index], 'pinned');
@@ -4025,7 +4080,7 @@ class PaneTreeService {
     }
     stackView(dock, viewId) {
         const segments = paneSegments(this.tree(dock));
-        const last = segments[segments.length - 1];
+        const last = segments.at(-1);
         if (last) {
             this.splitPane(dock, last.id, 'column', VIEW_PANE_PREFIX + viewId);
         }
@@ -4058,7 +4113,7 @@ class PaneTreeService {
             return;
         }
         const rank = new Map(order.map((path, index) => [path, index]));
-        const tabs = [...leaf.tabs].sort((a, b) => (rank.get(a.path) ?? leaf.tabs.indexOf(a)) -
+        const tabs = [...leaf.tabs].toSorted((a, b) => (rank.get(a.path) ?? leaf.tabs.indexOf(a)) -
             (rank.get(b.path) ?? leaf.tabs.indexOf(b)));
         this.commit(dock, setTabs(this.tree(dock), paneId, tabs));
     }
@@ -4110,7 +4165,7 @@ class PaneTreeService {
         const tree = this.tree(dock);
         const primary = this.primaryId(dock);
         const leaf = paneId === primary ? findLeaf(tree, primary) : undefined;
-        if (leaf && !leaf.tabs.some((tab) => tab.path === tabPath)) {
+        if (leaf?.tabs.every((tab) => tab.path !== tabPath)) {
             return;
         }
         if (leaf && !leaf.declared && leaf.tabs.length <= 1) {
@@ -4165,7 +4220,7 @@ class PaneTreeService {
         return this.docks()[dock] !== undefined;
     }
     dropDock(dock) {
-        if (!this.docks()[dock]) {
+        if (!this.hasDock(dock)) {
             return;
         }
         this.docks.update((docks) => {
@@ -4196,7 +4251,7 @@ class PaneTreeService {
         this.docks.update((current) => {
             const merged = { ...persisted };
             for (const [dock, entry] of Object.entries(current)) {
-                if (isContainerDock(dock) && !(dock in persisted)) {
+                if (isContainerDock(dock) && !Object.hasOwn(persisted, dock)) {
                     merged[dock] = entry;
                 }
             }
@@ -4331,7 +4386,7 @@ class OpenTabsService {
     activeViewInstance = computed(() => {
         const path = this.activeViewPath();
         if (path === null) {
-            return undefined;
+            return;
         }
         return this.paneTree
             .primaryTabs(CONTENT_DOCK)
@@ -4367,7 +4422,7 @@ class OpenTabsService {
         const facets = facetTabViews(routes, (route) => this.addressOf(route));
         const open = this.openTabs().filter((tab) => this.strippable(routes, tab));
         const dynamics = dynamicTabViews(routes, open);
-        return [...facets, ...dynamics, ...this.viewTabs()].sort((a, b) => a.order - b.order);
+        return [...facets, ...dynamics, ...this.viewTabs()].toSorted((a, b) => a.order - b.order);
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "tabs" }] : /* istanbul ignore next */ []));
     viewTabs = computed(() => viewTabViews(this.paneTree.primaryTabs(CONTENT_DOCK), (id) => this.registry.views().find((view) => view.id === id), (access) => this.auth.meets(access), VIEW_PANE_PREFIX), /* @ts-ignore */
@@ -4419,9 +4474,9 @@ class OpenTabsService {
     navigateTo(path) {
         this.navigate(path).catch((error) => console.error('Content navigation failed', error));
     }
-    updateOpen(fn) {
+    updateOpen(function_) {
         const current = this.openTabs();
-        const next = fn(current);
+        const next = function_(current);
         if (next === current) {
             return;
         }
@@ -4496,7 +4551,7 @@ class OpenTabsService {
         const routes = this.registry.contentRoutes();
         this.updateOpen((tabs) => {
             const index = tabs.findIndex((tab) => tabRootOf(routes, tab.path) === root);
-            if (index >= 0) {
+            if (index !== -1) {
                 return withRefreshedPath(tabs, index, path);
             }
             const opened = autoOpenedTab(route, root, path);
@@ -4511,7 +4566,7 @@ class OpenTabsService {
         return (route !== undefined &&
             route.chromeless !== true &&
             route.follows !== true &&
-            !(normalizePath(route.path) === '' && normalizePath(tab.path) !== ''));
+            (normalizePath(route.path) !== '' || normalizePath(tab.path) === ''));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: OpenTabsService, deps: [], target: i0.ɵɵFactoryTarget.Service });
     static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.0", ngImport: i0, type: OpenTabsService });
@@ -4927,7 +4982,7 @@ class SurfaceCloseGuard {
     }
     async saveAll(dirty) {
         try {
-            await Promise.all(dirty.map((surface) => surface.surfaceSave?.()));
+            await Promise.all(dirty.map(async (surface) => surface.surfaceSave?.()));
         }
         catch (error) {
             console.error('Save before closing failed', error);
@@ -5074,9 +5129,17 @@ class TabClosingService {
         const closing = this.state.openTabs().filter((tab) => roots.has(tabRootOf(routes, tab.path)));
         const activeWentAway = roots.has(this.state.activeTabRoot());
         this.state.updateOpen((tabs) => tabs.filter((tab) => !roots.has(tabRootOf(routes, tab.path))));
-        closing.forEach((tab) => this.closeHooks.runSafely(tab.onClose));
-        roots.forEach((root) => this.closeHooks.delete(root));
-        const evictAll = () => roots.forEach((root) => this.reuse.evict(root));
+        for (const tab of closing) {
+            this.closeHooks.runSafely(tab.onClose);
+        }
+        for (const root of roots) {
+            this.closeHooks.delete(root);
+        }
+        const evictAll = () => {
+            for (const root of roots) {
+                this.reuse.evict(root);
+            }
+        };
         if (activeWentAway) {
             void this.state.navigate(fallbackPath)
                 .catch((error) => console.error('Content navigation failed', error))
@@ -5108,7 +5171,7 @@ class TabClosingService {
     neighbourPath(root) {
         const routes = this.registry.contentRoutes();
         const siblings = this.state.openTabs().filter((tab) => tabRootOf(routes, tab.path) !== root);
-        return siblings.length > 0 ? siblings[siblings.length - 1].path : '';
+        return siblings.at(-1)?.path ?? '';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: TabClosingService, deps: [], target: i0.ɵɵFactoryTarget.Service });
     static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.0", ngImport: i0, type: TabClosingService });
@@ -5193,7 +5256,7 @@ class ContentTabsService {
         const seat = (tab, fallback) => rank.get(tabRootOf(routes, tab.path)) ?? fallback;
         this.state.updateOpen((tabs) => tabs
             .map((tab, index) => ({ tab, index }))
-            .sort((a, b) => seat(a.tab, a.index) - seat(b.tab, b.index))
+            .toSorted((a, b) => seat(a.tab, a.index) - seat(b.tab, b.index))
             .map((entry) => entry.tab));
     }
     /**
@@ -5209,7 +5272,7 @@ class ContentTabsService {
         const { routes, root } = this.state.rootFor(path);
         this.state.updateOpen((tabs) => {
             const index = tabs.findIndex((tab) => tabRootOf(routes, tab.path) === root);
-            return index < 0 || tabs[index].pinned
+            return index === -1 || tabs[index].pinned
                 ? tabs
                 : reseatPinned(tabs, index, tabs[index]);
         });
@@ -5364,7 +5427,7 @@ class ContentTabsService {
         const { routes, root } = this.state.rootFor(path);
         this.state.updateOpen((tabs) => {
             const index = tabs.findIndex((tab) => tabRootOf(routes, tab.path) === root);
-            if (index < 0 || tabs[index].pinned === pinned) {
+            if (index === -1 || tabs[index].pinned === pinned) {
                 return tabs;
             }
             const updated = pinned
@@ -5434,7 +5497,7 @@ class PanelViewsService {
         const declared = this.registry
             .views()
             .filter((view) => view.region === regionId)
-            .sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
+            .toSorted((a, b) => (a.order ?? 0) - (b.order ?? 0));
         return this.order.applyOrder(panelViewsContainerId(regionId), declared, (view) => view.id);
     }
     candidatesFor(regionId) {
@@ -5449,7 +5512,7 @@ class PanelViewsService {
             (panelRegions.has(view.region) &&
                 (holder === null || !panelRegions.has(holder))))
             .map(({ view, holder }) => ({ view, here: holder === regionId }))
-            .sort((a, b) => Number(b.here) - Number(a.here) ||
+            .toSorted((a, b) => Number(b.here) - Number(a.here) ||
             (a.view.order ?? 0) - (b.view.order ?? 0));
     }
     holderOf(viewId) {
@@ -5485,7 +5548,7 @@ class HiddenViewsService {
     ...(ngDevMode ? [{ debugName: "ids" }] : /* istanbul ignore next */ []));
     hidden = this.ids.asReadonly();
     constructor() {
-        void this.workspace.ready.then(() => hydrateAsync(this.store, this.storageKey(), (raw) => this.ids.set(parseHiddenViews(raw))));
+        this.hydrateWhenWorkspaceReady();
     }
     isHidden(viewId) {
         return this.ids().has(viewId);
@@ -5509,7 +5572,7 @@ class HiddenViewsService {
         void this.store.set(this.storageKey(), this.serialize());
     }
     serialize() {
-        return JSON.stringify([...this.ids()].sort());
+        return JSON.stringify([...this.ids()].toSorted((a, b) => a.localeCompare(b)));
     }
     commit(next) {
         this.ids.set(next);
@@ -5518,6 +5581,9 @@ class HiddenViewsService {
     storageKey() {
         return this.workspace.scopedKey(STORAGE_KEY$b);
     }
+    hydrateWhenWorkspaceReady() {
+        void this.workspace.ready.then(() => hydrateAsync(this.store, this.storageKey(), (raw) => this.ids.set(parseHiddenViews(raw))));
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: HiddenViewsService, deps: [], target: i0.ɵɵFactoryTarget.Service });
     static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.0", ngImport: i0, type: HiddenViewsService });
 }
@@ -5624,9 +5690,9 @@ function tabGaps(definition, routes, id) {
 }
 function sidebarGaps(definition, declaredPaths, id) {
     return Object.entries(definition.sidebars ?? {}).flatMap(([region, visible]) => {
-        const declared = declaredPaths(region).map((path) => path.slice(VIEW_PANE_PREFIX.length));
+        const declared = new Set(declaredPaths(region).map((path) => path.slice(VIEW_PANE_PREFIX.length)));
         return visible
-            .filter((viewId) => !declared.includes(viewId))
+            .filter((viewId) => !declared.has(viewId))
             .map((viewId) => `Workspace "${id}": sidebar view "${viewId}" is not declared for region "${region}" — the entry has no effect.`);
     });
 }
@@ -5643,7 +5709,7 @@ function canonicalState(read, shape) {
 }
 function canonicalValue(key, raw, hidden, shape) {
     if (key === shape.hiddenViewsKey) {
-        return JSON.stringify([...hidden].sort());
+        return JSON.stringify([...hidden].toSorted((a, b) => a.localeCompare(b)));
     }
     if (key === shape.paneTreesKey) {
         return canonicalTrees(raw, hidden, shape);
@@ -5657,7 +5723,8 @@ function canonicalTrees(raw, hidden, shape) {
     try {
         const parsed = JSON.parse(raw);
         const out = {};
-        for (const dock of Object.keys(parsed ?? {}).sort()) {
+        const docks = Object.keys(parsed ?? {}).toSorted((a, b) => a.localeCompare(b));
+        for (const dock of docks) {
             const entry = normalizeDockEntry(parsed[dock]);
             if (entry === null) {
                 continue;
@@ -5706,7 +5773,7 @@ function comparableTab(tab) {
 }
 function comparableNode(node) {
     if (node.kind === 'leaf') {
-        return { ...node, tabs: node.tabs.map(comparableTab) };
+        return { ...node, tabs: node.tabs.map((tab) => comparableTab(tab)) };
     }
     return {
         ...node,
@@ -5732,7 +5799,7 @@ function baseInitials(name) {
     if (letters.length === 1) {
         return letters[0].toUpperCase();
     }
-    return (letters[0] + letters[letters.length - 1]).toUpperCase();
+    return (letters[0] + (letters.at(-1) ?? '')).toUpperCase();
 }
 function* candidatesFor(name) {
     const base = baseInitials(name);
@@ -5741,8 +5808,8 @@ function* candidatesFor(name) {
     }
     yield base;
     const letters = [...(wordsOf(name)[0] ?? '')];
-    for (let i = 1; i < letters.length; i++) {
-        yield (letters[0] + letters[i]).toUpperCase();
+    for (let index = 1; index < letters.length; index++) {
+        yield (letters[0] + letters[index]).toUpperCase();
     }
     for (let digit = 2; digit <= LAST_RESORT_DIGITS; digit++) {
         yield letters[0].toUpperCase() + digit;
@@ -5752,17 +5819,22 @@ function assignWorkspaceInitials(workspaces) {
     const taken = new Set();
     const assigned = new Map();
     for (const workspace of workspaces) {
-        for (const candidate of candidatesFor(workspace.name)) {
-            if (taken.has(candidate)) {
-                continue;
-            }
+        const candidate = firstFree(candidatesFor(workspace.name), taken);
+        if (candidate !== undefined) {
             taken.add(candidate);
             assigned.set(workspace.id, candidate);
-            break;
         }
     }
     return assigned;
 }
+function firstFree(candidates, taken) {
+    for (const candidate of candidates) {
+        if (!taken.has(candidate)) {
+            return candidate;
+        }
+    }
+    return undefined;
+}
 
 const STORAGE_KEY$a = 'lw.shell.workspaces';
 const HIDDEN_VIEWS_KEY = 'lw.shell.hidden-views';
@@ -5849,14 +5921,16 @@ class WorkspaceService {
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "changedIds" }] : /* istanbul ignore next */ []));
     constructor() {
-        hydrateAsync(this.store, STORAGE_KEY$a, (raw) => this.list.set(parse(raw)));
-        this.sync.register('settings', STORAGE_KEY$a, (raw) => this.list.set(parse(raw)));
+        const setList = (raw) => this.list.set(parse(raw));
+        hydrateAsync(this.store, STORAGE_KEY$a, setList);
+        this.sync.register('settings', STORAGE_KEY$a, setList);
         if (isDevMode()) {
-            for (const problem of auditWorkspaceDefinitions(this.definitionBatches.flat(), this.panelRegions)) {
+            const all = this.definitionBatches.flat();
+            for (const problem of auditWorkspaceDefinitions(all, this.panelRegions)) {
                 console.warn(problem);
             }
         }
-        void this.active.ready.then(() => this.layOutAdoptedWorkspace());
+        this.layOutAdoptedWorkspaceWhenReady();
     }
     async saveCurrent(name) {
         const baseline = await this.currentState();
@@ -5864,7 +5938,7 @@ class WorkspaceService {
         const origin = this.originOf(this.active.id());
         this.commit([
             ...this.list(),
-            { id, name, baseline, ...(origin === null ? {} : { origin }) },
+            { id, name, baseline, ...(origin !== null && { origin }) },
         ]);
         this.active.set(id);
         this.applyState(baseline);
@@ -5976,10 +6050,8 @@ class WorkspaceService {
             declaredPaths: (region) => this.panelGroups.declaredPaths(region),
         });
         return {
-            ...(state.hiddenViews === undefined
-                ? {}
-                : { [HIDDEN_VIEWS_KEY]: state.hiddenViews }),
-            ...(state.trees === undefined ? {} : { [PANE_TREES_KEY]: state.trees }),
+            ...(state.hiddenViews !== undefined && { [HIDDEN_VIEWS_KEY]: state.hiddenViews }),
+            ...(state.trees !== undefined && { [PANE_TREES_KEY]: state.trees }),
         };
     }
     warnDeclarationGaps(id) {
@@ -6043,6 +6115,9 @@ class WorkspaceService {
         this.list.set(next);
         void this.store.set(STORAGE_KEY$a, JSON.stringify(next));
     }
+    layOutAdoptedWorkspaceWhenReady() {
+        void this.active.ready.then(() => this.layOutAdoptedWorkspace());
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: WorkspaceService, deps: [], target: i0.ɵɵFactoryTarget.Service });
     static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.0", ngImport: i0, type: WorkspaceService });
 }
@@ -6081,7 +6156,7 @@ class ShellRail {
         .filter((item) => this.railItems.regionOf(item.id, item.rail) === this.region().id)
         .filter((item) => this.auth.visible(item.access))
         .filter((item) => item.workspace !== undefined || this.commands.triggerable(item))
-        .sort((a, b) => (a.order ?? 0) - (b.order ?? 0)), /* @ts-ignore */
+        .toSorted((a, b) => (a.order ?? 0) - (b.order ?? 0)), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "registered" }] : /* istanbul ignore next */ []));
     items = computed(() => {
         const inRail = this.registered().filter((item) => this.railItems.isVisible(item.id));
@@ -6089,7 +6164,7 @@ class ShellRail {
         const id = this.containerId();
         const key = (item) => item.id;
         const top = this.userOrder.applyOrder(id, inRail.filter((item) => !isBottom(item)), key);
-        const bottom = this.userOrder.applyOrder(id, inRail.filter(isBottom), key);
+        const bottom = this.userOrder.applyOrder(id, inRail.filter((item) => isBottom(item)), key);
         return [...top, ...bottom];
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
@@ -6234,10 +6309,11 @@ class ViewStateService {
         hydrateAsync(this.store, key, (raw) => value.set(parseBlob$1(raw)));
         let timer;
         const cancelPendingSave = () => {
-            if (timer !== undefined) {
-                clearTimeout(timer);
-                timer = undefined;
+            if (timer === undefined) {
+                return;
             }
+            clearTimeout(timer);
+            timer = undefined;
         };
         const save = () => {
             cancelPendingSave();
@@ -6275,12 +6351,12 @@ function parseRecord(viewId, raw) {
         }
         const record = parsed;
         const instances = Array.isArray(record.instances)
-            ? record.instances.filter((i) => !!i && typeof i.id === 'string' && typeof i.name === 'string')
+            ? record.instances.filter((index) => !!index && typeof index.id === 'string' && typeof index.name === 'string')
             : [];
-        const withoutDefault = instances.filter((i) => i.id !== viewId);
+        const withoutDefault = instances.filter((index) => index.id !== viewId);
         const merged = [{ id: viewId, name: '' }, ...withoutDefault];
         const activeId = typeof record.activeId === 'string' &&
-            merged.some((i) => i.id === record.activeId)
+            merged.some((index) => index.id === record.activeId)
             ? record.activeId
             : viewId;
         return { instances: merged, activeId };
@@ -6313,7 +6389,7 @@ class ViewInstanceService {
     }
     setActive(viewId, instanceId) {
         const record = this.recordFor(viewId);
-        if (record().instances.some((i) => i.id === instanceId)) {
+        if (record().instances.some((index) => index.id === instanceId)) {
             this.commit(viewId, { ...record(), activeId: instanceId });
         }
     }
@@ -6332,7 +6408,7 @@ class ViewInstanceService {
         const record = this.recordFor(viewId);
         this.commit(viewId, {
             ...record(),
-            instances: record().instances.map((i) => i.id === instanceId ? { ...i, name } : i),
+            instances: record().instances.map((index) => index.id === instanceId ? { ...index, name } : index),
         });
     }
     remove(viewId, instanceId) {
@@ -6340,7 +6416,7 @@ class ViewInstanceService {
             return;
         }
         const record = this.recordFor(viewId);
-        const instances = record().instances.filter((i) => i.id !== instanceId);
+        const instances = record().instances.filter((index) => index.id !== instanceId);
         const activeId = record().activeId === instanceId ? viewId : record().activeId;
         this.commit(viewId, { instances, activeId });
         this.viewStates.clear(instanceId);
@@ -6601,7 +6677,7 @@ class PaneChromeService {
     clearMinimized(dock) {
         const prefix = `${dock}:`;
         const current = this.min();
-        if (![...current].some((id) => id.startsWith(prefix))) {
+        if ([...current].every((id) => !id.startsWith(prefix))) {
             return;
         }
         this.min.set(new Set([...current].filter((id) => !id.startsWith(prefix))));
@@ -6668,7 +6744,7 @@ function bakeChild(dock, spec, entry, problems, context) {
     return {
         tab: {
             ...containerChildTab(dock, spec, declared.surface),
-            ...(declared.closable === false ? { closable: false } : {}),
+            ...(declared.closable === false && { closable: false }),
         },
         active: declared.active === true,
     };
@@ -6705,13 +6781,11 @@ class PaneContainersService {
         const tab = {
             path,
             instance: `${dock}::${path}`,
-            ...(label?.title === undefined
-                ? {}
-                : {
-                    title: label.title,
-                    literalTitle: label.titleIsLiteral ?? false,
-                }),
-            ...(label?.icon === undefined ? {} : { icon: label.icon }),
+            ...(label?.title !== undefined && {
+                title: label.title,
+                literalTitle: label.titleIsLiteral ?? false,
+            }),
+            ...(label?.icon !== undefined && { icon: label.icon }),
         };
         this.paneTree.commit(dock, setActiveTab(insertTab(tree, target, tab), target, path));
     }
@@ -6737,11 +6811,11 @@ function offRouterPaneTargets(registry, auth) {
     const routes = registry
         .contentRoutes()
         .filter((route) => offRouterMountable(registry, auth, route.path))
-        .map(routeTarget);
+        .map((route) => routeTarget(route));
     const views = registry
         .views()
         .filter((view) => auth.meets(view.access))
-        .map(viewTarget);
+        .map((view) => viewTarget(view));
     return [...routes, ...views];
 }
 function containerChildTargets(registry, auth, spec) {
@@ -6750,14 +6824,14 @@ function containerChildTargets(registry, auth, spec) {
         .filter((child) => child.segment === undefined || isAddressable(child.segment))
         .map((child) => views.find((view) => view.id === child.surface))
         .filter((view) => view !== undefined && auth.meets(view.access))
-        .map(viewTarget);
+        .map((view) => viewTarget(view));
 }
 function routerPaneTargets(registry, auth) {
     return registry
         .contentRoutes()
         .filter((route) => barePathHostableRoute(registry, route.path) !== null &&
         auth.meets(route.access))
-        .map(routeTarget);
+        .map((route) => routeTarget(route));
 }
 function paneTargetEntries(targets, translate) {
     return targets.map((target) => ({
@@ -7126,7 +7200,7 @@ class PaneTabStrip {
                 targetKind: 'view-tab',
                 viewId: tab.path.slice(VIEW_PANE_PREFIX.length),
                 region: this.contextGroup(),
-                ...(tab.instance ? { instance: tab.instance } : {}),
+                ...(tab.instance && { instance: tab.instance }),
             };
         }
         return {
@@ -7180,22 +7254,22 @@ class PaneTabStrip {
         this.reorderTabs.emit(tabs.filter((tab) => this.canReorder(tab)).map((tab) => tab.path));
     }
     observeResize() {
-        const el = this.strip()?.nativeElement;
-        if (!el || typeof ResizeObserver === 'undefined') {
+        const element = this.strip()?.nativeElement;
+        if (!element || typeof ResizeObserver === 'undefined') {
             return;
         }
         const observer = new ResizeObserver(() => this.overflow() && this.measureOverflow());
-        observer.observe(el);
+        observer.observe(element);
         this.destroyRef.onDestroy(() => observer.disconnect());
     }
     measureOverflow() {
-        const el = this.strip()?.nativeElement;
-        this.overflowing.set(!!el && el.scrollWidth - el.clientWidth > EDGE_TOLERANCE_PX);
+        const element = this.strip()?.nativeElement;
+        this.overflowing.set(!!element && element.scrollWidth - element.clientWidth > EDGE_TOLERANCE_PX);
     }
     revealActiveTab() {
         const strip = this.strip()?.nativeElement;
         const active = this.activeId();
-        const wrapper = strip?.querySelector(`[data-tab-path="${active}"]`)?.parentElement;
+        const wrapper = strip?.querySelector(`[data-tab-path="${CSS.escape(active)}"]`)?.parentElement;
         if (!strip || !wrapper) {
             return;
         }
@@ -7400,12 +7474,14 @@ class PluginStateService {
         };
     }
     removePlugin(pluginId) {
-        for (const [storageKey, entry] of [...this.entries]) {
-            if (entry.pluginId === pluginId) {
-                this.cancelPending(entry);
-                entry.value.set(undefined);
-                this.entries.delete(storageKey);
+        const snapshot = [...this.entries];
+        for (const [storageKey, entry] of snapshot) {
+            if (entry.pluginId !== pluginId) {
+                continue;
             }
+            this.cancelPending(entry);
+            entry.value.set(undefined);
+            this.entries.delete(storageKey);
         }
         this.keysByPlugin.delete(pluginId);
         void readStoredValue(this.store, INDEX_PREFIX + pluginId).then((raw) => {
@@ -7495,10 +7571,11 @@ class PluginStateService {
         entry.pending = undefined;
     }
     cancelTimer(entry) {
-        if (entry.timer !== undefined) {
-            clearTimeout(entry.timer);
-            entry.timer = undefined;
+        if (entry.timer === undefined) {
+            return;
         }
+        clearTimeout(entry.timer);
+        entry.timer = undefined;
     }
     withinLimits(pluginId, key, serialised) {
         const bytes = serialised.length;
@@ -7660,10 +7737,9 @@ function ownerByToken(registrations) {
             ...Object.keys(registration.dark ?? {}),
         ];
         for (const name of names) {
-            if (!known.has(name) || owners.has(name)) {
-                continue;
+            if (known.has(name) && !owners.has(name)) {
+                owners.set(name, registration);
             }
-            owners.set(name, registration);
         }
     }
     return owners;
@@ -7702,7 +7778,7 @@ function createPluginLayerRules() {
     }
     const element = document.createElement('style');
     element.dataset['lwPluginTheme'] = '';
-    document.head.appendChild(element);
+    document.head.append(element);
     const sheet = element.sheet;
     if (!sheet) {
         return null;
@@ -7854,6 +7930,7 @@ const LOOM_ICONS = {
     workspaces: heroRectangleGroup,
     menu: heroBars3,
     document: heroDocument,
+    openWork: heroViewColumns,
     navigator: heroBars3,
     outline: heroListBullet,
     add: heroPlus,
@@ -8008,7 +8085,7 @@ class CapabilityGrantService {
             })),
         }))
             .filter((entry) => entry.capabilities.length > 0)
-            .sort((a, b) => a.pluginId.localeCompare(b.pluginId));
+            .toSorted((a, b) => a.pluginId.localeCompare(b.pluginId));
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "permissions" }] : /* istanbul ignore next */ []));
     constructor() {
@@ -8145,7 +8222,7 @@ class IframeSurface {
     ...(ngDevMode ? [{ debugName: "activeTab" }] : /* istanbul ignore next */ []));
     restPath = computed(() => {
         if (!this.ownsRest) {
-            return undefined;
+            return;
         }
         return this.hostMounted
             ? this.hostSub()
@@ -8176,7 +8253,9 @@ class IframeSurface {
             queueMicrotask(() => this.push({ ...snapshot, ...this.readResolved() }));
         });
         inject(DestroyRef).onDestroy(() => {
-            this.watched.forEach((entry) => entry.stop());
+            for (const entry of this.watched.values()) {
+                entry.stop();
+            }
             this.watched.clear();
             this.visibility?.disconnect();
             this.connection?.destroy();
@@ -8212,12 +8291,12 @@ class IframeSurface {
                         this.tabs.keep(this.tabRoot);
                     }
                 },
-                setDirty: (dirty) => this.dirty.set(dirty === true),
-                stateWatch: (key) => this.watchState(String(key)),
-                stateSet: (key, value) => this.watched.get(String(key))?.handle.set(value),
-                stateClear: (key) => this.watched.get(String(key))?.handle.clear(),
+                setDirty: (dirty) => this.dirty.set(dirty),
+                stateWatch: (key) => this.watchState(key),
+                stateSet: (key, value) => this.watched.get(key)?.handle.set(value),
+                stateClear: (key) => this.watched.get(key)?.handle.clear(),
                 stateUnwatch: (key) => {
-                    const name = String(key);
+                    const name = key;
                     this.watched.get(name)?.stop();
                     this.watched.delete(name);
                 },
@@ -8227,7 +8306,9 @@ class IframeSurface {
             .then((remote) => {
             this.remote = remote;
             this.push({ ...this.reactiveState(), ...this.readResolved() });
-            this.watched.forEach((entry, key) => this.pushState(key, entry.handle.value(), entry.handle.loaded()));
+            for (const [key, entry] of this.watched) {
+                this.pushState(key, entry.handle.value(), entry.handle.loaded());
+            }
         })
             .catch(() => undefined);
     }
@@ -8263,7 +8344,7 @@ class IframeSurface {
             return;
         }
         this.visibility = new IntersectionObserver((entries) => {
-            const last = entries[entries.length - 1];
+            const last = entries.at(-1);
             if (last) {
                 this.shown.set(last.isIntersecting);
             }
@@ -8286,19 +8367,15 @@ class IframeSurface {
             theme: this.theme.resolvedTheme(),
             preview: this.isPreview(),
             shown: this.shown(),
-            ...(this.instanceId ? { instanceId: this.instanceId } : {}),
-            ...(Object.keys(this.routeParams).length > 0
-                ? { params: this.routeParams }
-                : {}),
-            ...(rest === undefined ? {} : { rest }),
-            ...(this.sessionGranted()
-                ? {
-                    session: {
-                        authenticated: this.auth.authenticated(),
-                        roles: this.auth.roles(),
-                    },
-                }
-                : {}),
+            ...(this.instanceId && { instanceId: this.instanceId }),
+            ...(Object.keys(this.routeParams).length > 0 && { params: this.routeParams }),
+            ...(rest !== undefined && { rest }),
+            ...(this.sessionGranted() && {
+                session: {
+                    authenticated: this.auth.authenticated(),
+                    roles: this.auth.roles(),
+                },
+            }),
         };
     }
     readResolved() {
@@ -8311,19 +8388,19 @@ class IframeSurface {
         return {
             tokens,
             rootFontSize: styles.fontSize,
-            ...(Object.keys(icons).length > 0 ? { icons } : {}),
+            ...(Object.keys(icons).length > 0 && { icons }),
         };
     }
     navigateWithinTabRoot(path) {
         if (this.docked) {
             if (isDevMode()) {
-                console.warn(`[loom] a docked surface asked to navigate to "${String(path)}" — ignored. ` +
+                console.warn(`[loom] a docked surface asked to navigate to "${path}" — ignored. ` +
                     `A docked surface has no address of its own; the channel's navigate is confined to a tab ` +
                     `root and there is none. Use ctx.navigateContent (the 'navigation' grant) instead.`);
             }
             return;
         }
-        const raw = String(path);
+        const raw = path;
         const suffix = suffixOf(raw);
         const target = normalizePath(raw);
         if (target !== this.tabRoot && !target.startsWith(this.tabRoot + '/')) {
@@ -8392,8 +8469,8 @@ function syntheticDockedRoute(view, instanceId, params = {}) {
         url: [],
         params,
         data: {
-            ...(view.iframe !== undefined ? { iframe: view.iframe } : {}),
-            ...(view.pluginId ? { pluginId: view.pluginId } : {}),
+            ...(view.iframe !== undefined && { iframe: view.iframe }),
+            ...(view.pluginId && { pluginId: view.pluginId }),
             docked: true,
             instanceId,
         },
@@ -8409,13 +8486,13 @@ function syntheticRouteFor(route, path, options = {}) {
         url: segments.map((segment) => new UrlSegment(segment, {})),
         params,
         data: {
-            ...('iframe' in route ? { iframe: route.iframe } : {}),
-            ...('container' in route ? { container: route.container } : {}),
-            ...(route.pluginId ? { pluginId: route.pluginId } : {}),
-            ...(route.rest === true ? { rest: true } : {}),
-            ...(sub ? { sub } : {}),
-            ...(options.urlDriven ? { urlDriven: true } : {}),
-            ...(options.instanceId ? { instanceId: options.instanceId } : {}),
+            ...('iframe' in route && { iframe: route.iframe }),
+            ...('container' in route && { container: route.container }),
+            ...(route.pluginId && { pluginId: route.pluginId }),
+            ...(route.rest === true && { rest: true }),
+            ...(sub && { sub }),
+            ...(options.urlDriven && { urlDriven: true }),
+            ...(options.instanceId && { instanceId: options.instanceId }),
         },
     });
 }
@@ -8651,14 +8728,12 @@ class ContentSecondaryPane {
     mountParams = computed(() => {
         const ctx = this.containerCtx;
         if (!ctx) {
-            return undefined;
+            return;
         }
         const match = containerChildForPath(this.registry.contentRoutes(), this.registry.views(), this.path());
         return {
             ...ctx.params,
-            ...(match
-                ? paramsOfPattern(match.declaration.segment ?? '', match.segmentPath)
-                : {}),
+            ...(match && paramsOfPattern(match.declaration.segment ?? '', match.segmentPath)),
         };
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "mountParams" }] : /* istanbul ignore next */ []));
@@ -8690,12 +8765,12 @@ class ContentSecondaryPane {
     ...(ngDevMode ? [{ debugName: "activeRoute" }] : /* istanbul ignore next */ []));
     iframeSurface = computed(() => {
         const route = this.activeRoute();
-        return route?.iframe !== undefined
-            ? {
+        return route?.iframe === undefined
+            ? null
+            : {
                 component: IframeSurface,
                 injector: this.injectorFor(route, this.path(), this.surfaceKey()),
-            }
-            : null;
+            };
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "iframeSurface" }] : /* istanbul ignore next */ []));
     surface = computed(() => {
@@ -9147,11 +9222,11 @@ class PaneView {
         ];
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: PaneView, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: PaneView, isStandalone: true, selector: "lw-pane-view", inputs: { dock: { classPropertyName: "dock", publicName: "dock", isSignal: true, isRequired: true, transformFunction: null }, leaf: { classPropertyName: "leaf", publicName: "leaf", isSignal: true, isRequired: true, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "flex min-h-0 min-w-0 flex-1 flex-col" }, ngImport: i0, template: "<lw-pane-tab-strip\n  class=\"shrink-0\"\n  [variant]=\"options().variant\"\n  [tabs]=\"stripTabs()\"\n  [activeId]=\"activeTabId()\"\n  [urlDriven]=\"pointed()\"\n  [source]=\"source()\"\n  [reorderable]=\"tabsReorderable()\"\n  [draggable]=\"tabsDraggable()\"\n  [acceptsTabs]=\"acceptsTabs()\"\n  [canAddTab]=\"canAddTab()\"\n  [viewContextMenuSlot]=\"viewContextMenu()\"\n  [contextGroup]=\"dock()\"\n  [paneActions]=\"paneActions\"\n  (selectTab)=\"onSelectTab($event)\"\n  (escalate)=\"onEscalate($event)\"\n  (closeTab)=\"onCloseTab($event)\"\n  (unpinTab)=\"onUnpinTab($event)\"\n  (addTab)=\"openPicker($event)\"\n  (reorderTabs)=\"onReorderTabs($event)\"\n/>\n<ng-template #paneActions>\n  <lw-pane-toolbar\n    [canSplitRight]=\"canSplitRight()\"\n    [canSplitDown]=\"canSplitDown()\"\n    [canMinimize]=\"canMinimize()\"\n    [canMaximize]=\"canMaximize()\"\n    [maximized]=\"maximized()\"\n    [canClose]=\"canClose()\"\n    [closeLabel]=\"options().closeLabel\"\n    (splitRight)=\"splitPane('row')\"\n    (splitDown)=\"splitPane('column')\"\n    (minimize)=\"minimize()\"\n    (toggleMaximize)=\"toggleMaximize()\"\n    (closePane)=\"closePane()\"\n  />\n</ng-template>\n\n<div class=\"flex min-h-0 min-w-0 flex-1 flex-col\" (pointerdown)=\"onBodyPointerDown()\">\n  @if (awaitingContent()) {\n    <div\n      class=\"flex h-full items-center justify-center p-6 text-center text-sm text-content-faint\"\n      data-testid=\"pane-awaiting-content\"\n      role=\"status\"\n    >\n      {{ 'content.split.awaiting' | transloco }}\n    </div>\n  } @else {\n    <lw-content-secondary-pane\n      class=\"min-h-0 min-w-0 flex-1\"\n      [path]=\"path()\"\n      [instanceId]=\"instanceId()\"\n      [variant]=\"options().body\"\n      [retentionScope]=\"retentionScope()\"\n      (instanceReleased)=\"releaseTabInstance()\"\n    />\n  }\n</div>\n", dependencies: [{ kind: "component", type: ContentSecondaryPane, selector: "lw-content-secondary-pane", inputs: ["path", "variant", "instanceId", "retentionScope"], outputs: ["instanceReleased"] }, { kind: "component", type: PaneTabStrip, selector: "lw-pane-tab-strip", inputs: ["tabs", "activeId", "reorderable", "draggable", "acceptsTabs", "source", "variant", "urlDriven", "contextMenuSlot", "viewContextMenuSlot", "contextGroup", "overflow", "canAddTab", "paneActions"], outputs: ["selectTab", "escalate", "closeTab", "unpinTab", "reorderTabs", "runAction", "addTab", "revealRequest"] }, { kind: "component", type: PaneToolbar, selector: "lw-pane-toolbar", inputs: ["canNewTab", "canSplitRight", "canSplitDown", "canMinimize", "canMaximize", "maximized", "canClose", "closeLabel", "newTabTestId", "splitRightTestId", "splitDownTestId"], outputs: ["newTab", "splitRight", "splitDown", "minimize", "toggleMaximize", "closePane"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: PaneView, isStandalone: true, selector: "lw-pane-view", inputs: { dock: { classPropertyName: "dock", publicName: "dock", isSignal: true, isRequired: true, transformFunction: null }, leaf: { classPropertyName: "leaf", publicName: "leaf", isSignal: true, isRequired: true, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "flex min-h-0 min-w-0 flex-1 flex-col" }, ngImport: i0, template: "<lw-pane-tab-strip\n  class=\"shrink-0\"\n  [variant]=\"options().variant\"\n  [tabs]=\"stripTabs()\"\n  [activeId]=\"activeTabId()\"\n  [urlDriven]=\"pointed()\"\n  [source]=\"source()\"\n  [reorderable]=\"tabsReorderable()\"\n  [draggable]=\"tabsDraggable()\"\n  [acceptsTabs]=\"acceptsTabs()\"\n  [canAddTab]=\"canAddTab()\"\n  [viewContextMenuSlot]=\"viewContextMenu()\"\n  [contextGroup]=\"dock()\"\n  [paneActions]=\"paneActions\"\n  (selectTab)=\"onSelectTab($event)\"\n  (escalate)=\"onEscalate($event)\"\n  (closeTab)=\"onCloseTab($event)\"\n  (unpinTab)=\"onUnpinTab($event)\"\n  (addTab)=\"openPicker($event)\"\n  (reorderTabs)=\"onReorderTabs($event)\"\n/>\n<ng-template #paneActions>\n  <lw-pane-toolbar\n    [canSplitRight]=\"canSplitRight()\"\n    [canSplitDown]=\"canSplitDown()\"\n    [canMinimize]=\"canMinimize()\"\n    [canMaximize]=\"canMaximize()\"\n    [maximized]=\"maximized()\"\n    [canClose]=\"canClose()\"\n    [closeLabel]=\"options().closeLabel\"\n    (splitRight)=\"splitPane('row')\"\n    (splitDown)=\"splitPane('column')\"\n    (minimize)=\"minimize()\"\n    (toggleMaximize)=\"toggleMaximize()\"\n    (closePane)=\"closePane()\"\n  />\n</ng-template>\n\n<div class=\"flex min-h-0 min-w-0 flex-1 flex-col\" (pointerdown)=\"onBodyPointerDown()\">\n  @if (awaitingContent()) {\n    <output\n      class=\"flex h-full items-center justify-center p-6 text-center text-sm text-content-faint\"\n      data-testid=\"pane-awaiting-content\"\n    >\n      {{ 'content.split.awaiting' | transloco }}\n    </output>\n  } @else {\n    <lw-content-secondary-pane\n      class=\"min-h-0 min-w-0 flex-1\"\n      [path]=\"path()\"\n      [instanceId]=\"instanceId()\"\n      [variant]=\"options().body\"\n      [retentionScope]=\"retentionScope()\"\n      (instanceReleased)=\"releaseTabInstance()\"\n    />\n  }\n</div>\n", dependencies: [{ kind: "component", type: ContentSecondaryPane, selector: "lw-content-secondary-pane", inputs: ["path", "variant", "instanceId", "retentionScope"], outputs: ["instanceReleased"] }, { kind: "component", type: PaneTabStrip, selector: "lw-pane-tab-strip", inputs: ["tabs", "activeId", "reorderable", "draggable", "acceptsTabs", "source", "variant", "urlDriven", "contextMenuSlot", "viewContextMenuSlot", "contextGroup", "overflow", "canAddTab", "paneActions"], outputs: ["selectTab", "escalate", "closeTab", "unpinTab", "reorderTabs", "runAction", "addTab", "revealRequest"] }, { kind: "component", type: PaneToolbar, selector: "lw-pane-toolbar", inputs: ["canNewTab", "canSplitRight", "canSplitDown", "canMinimize", "canMaximize", "maximized", "canClose", "closeLabel", "newTabTestId", "splitRightTestId", "splitDownTestId"], outputs: ["newTab", "splitRight", "splitDown", "minimize", "toggleMaximize", "closePane"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: PaneView, decorators: [{
             type: Component,
-            args: [{ selector: 'lw-pane-view', imports: [ContentSecondaryPane, PaneTabStrip, PaneToolbar, TranslocoPipe], schemas: [CUSTOM_ELEMENTS_SCHEMA], host: { class: 'flex min-h-0 min-w-0 flex-1 flex-col' }, template: "<lw-pane-tab-strip\n  class=\"shrink-0\"\n  [variant]=\"options().variant\"\n  [tabs]=\"stripTabs()\"\n  [activeId]=\"activeTabId()\"\n  [urlDriven]=\"pointed()\"\n  [source]=\"source()\"\n  [reorderable]=\"tabsReorderable()\"\n  [draggable]=\"tabsDraggable()\"\n  [acceptsTabs]=\"acceptsTabs()\"\n  [canAddTab]=\"canAddTab()\"\n  [viewContextMenuSlot]=\"viewContextMenu()\"\n  [contextGroup]=\"dock()\"\n  [paneActions]=\"paneActions\"\n  (selectTab)=\"onSelectTab($event)\"\n  (escalate)=\"onEscalate($event)\"\n  (closeTab)=\"onCloseTab($event)\"\n  (unpinTab)=\"onUnpinTab($event)\"\n  (addTab)=\"openPicker($event)\"\n  (reorderTabs)=\"onReorderTabs($event)\"\n/>\n<ng-template #paneActions>\n  <lw-pane-toolbar\n    [canSplitRight]=\"canSplitRight()\"\n    [canSplitDown]=\"canSplitDown()\"\n    [canMinimize]=\"canMinimize()\"\n    [canMaximize]=\"canMaximize()\"\n    [maximized]=\"maximized()\"\n    [canClose]=\"canClose()\"\n    [closeLabel]=\"options().closeLabel\"\n    (splitRight)=\"splitPane('row')\"\n    (splitDown)=\"splitPane('column')\"\n    (minimize)=\"minimize()\"\n    (toggleMaximize)=\"toggleMaximize()\"\n    (closePane)=\"closePane()\"\n  />\n</ng-template>\n\n<div class=\"flex min-h-0 min-w-0 flex-1 flex-col\" (pointerdown)=\"onBodyPointerDown()\">\n  @if (awaitingContent()) {\n    <div\n      class=\"flex h-full items-center justify-center p-6 text-center text-sm text-content-faint\"\n      data-testid=\"pane-awaiting-content\"\n      role=\"status\"\n    >\n      {{ 'content.split.awaiting' | transloco }}\n    </div>\n  } @else {\n    <lw-content-secondary-pane\n      class=\"min-h-0 min-w-0 flex-1\"\n      [path]=\"path()\"\n      [instanceId]=\"instanceId()\"\n      [variant]=\"options().body\"\n      [retentionScope]=\"retentionScope()\"\n      (instanceReleased)=\"releaseTabInstance()\"\n    />\n  }\n</div>\n" }]
+            args: [{ selector: 'lw-pane-view', imports: [ContentSecondaryPane, PaneTabStrip, PaneToolbar, TranslocoPipe], schemas: [CUSTOM_ELEMENTS_SCHEMA], host: { class: 'flex min-h-0 min-w-0 flex-1 flex-col' }, template: "<lw-pane-tab-strip\n  class=\"shrink-0\"\n  [variant]=\"options().variant\"\n  [tabs]=\"stripTabs()\"\n  [activeId]=\"activeTabId()\"\n  [urlDriven]=\"pointed()\"\n  [source]=\"source()\"\n  [reorderable]=\"tabsReorderable()\"\n  [draggable]=\"tabsDraggable()\"\n  [acceptsTabs]=\"acceptsTabs()\"\n  [canAddTab]=\"canAddTab()\"\n  [viewContextMenuSlot]=\"viewContextMenu()\"\n  [contextGroup]=\"dock()\"\n  [paneActions]=\"paneActions\"\n  (selectTab)=\"onSelectTab($event)\"\n  (escalate)=\"onEscalate($event)\"\n  (closeTab)=\"onCloseTab($event)\"\n  (unpinTab)=\"onUnpinTab($event)\"\n  (addTab)=\"openPicker($event)\"\n  (reorderTabs)=\"onReorderTabs($event)\"\n/>\n<ng-template #paneActions>\n  <lw-pane-toolbar\n    [canSplitRight]=\"canSplitRight()\"\n    [canSplitDown]=\"canSplitDown()\"\n    [canMinimize]=\"canMinimize()\"\n    [canMaximize]=\"canMaximize()\"\n    [maximized]=\"maximized()\"\n    [canClose]=\"canClose()\"\n    [closeLabel]=\"options().closeLabel\"\n    (splitRight)=\"splitPane('row')\"\n    (splitDown)=\"splitPane('column')\"\n    (minimize)=\"minimize()\"\n    (toggleMaximize)=\"toggleMaximize()\"\n    (closePane)=\"closePane()\"\n  />\n</ng-template>\n\n<div class=\"flex min-h-0 min-w-0 flex-1 flex-col\" (pointerdown)=\"onBodyPointerDown()\">\n  @if (awaitingContent()) {\n    <output\n      class=\"flex h-full items-center justify-center p-6 text-center text-sm text-content-faint\"\n      data-testid=\"pane-awaiting-content\"\n    >\n      {{ 'content.split.awaiting' | transloco }}\n    </output>\n  } @else {\n    <lw-content-secondary-pane\n      class=\"min-h-0 min-w-0 flex-1\"\n      [path]=\"path()\"\n      [instanceId]=\"instanceId()\"\n      [variant]=\"options().body\"\n      [retentionScope]=\"retentionScope()\"\n      (instanceReleased)=\"releaseTabInstance()\"\n    />\n  }\n</div>\n" }]
         }], propDecorators: { dock: [{ type: i0.Input, args: [{ isSignal: true, alias: "dock", required: true }] }], leaf: [{ type: i0.Input, args: [{ isSignal: true, alias: "leaf", required: true }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }] } });
 
 class PaneDropZones {
@@ -9189,13 +9264,12 @@ class PaneDropZones {
     ...(ngDevMode ? [{ debugName: "accepts" }] : /* istanbul ignore next */ []));
     constructor() {
         effect((onCleanup) => {
-            const ids = this.fills()
-                ? this.accepts()
-                    ? [this.fillZoneId()]
-                    : []
-                : this.edges().map((edge) => this.zoneId(edge));
-            const disposers = ids.map((id) => this.drag.registerZone(id));
-            onCleanup(() => disposers.forEach((dispose) => dispose()));
+            const disposers = this.zoneIds().map((id) => this.drag.registerZone(id));
+            onCleanup(() => {
+                for (const dispose of disposers) {
+                    dispose();
+                }
+            });
         });
     }
     has(edge) {
@@ -9231,8 +9305,14 @@ class PaneDropZones {
             this.paneMove.moveToEdge(source, String(event.item.data ?? ''), { dock: this.dock(), paneId: this.paneId() }, edge);
         }
     }
+    zoneIds() {
+        if (!this.fills()) {
+            return this.edges().map((edge) => this.zoneId(edge));
+        }
+        return this.accepts() ? [this.fillZoneId()] : [];
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: PaneDropZones, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: PaneDropZones, isStandalone: true, selector: "lw-pane-drop-zones", inputs: { dock: { classPropertyName: "dock", publicName: "dock", isSignal: true, isRequired: true, transformFunction: null }, paneId: { classPropertyName: "paneId", publicName: "paneId", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.opacity-0": "!active()", "class.pointer-events-none": "!active()", "style.grid-template-columns": "\"1fr 2fr 1fr\"", "style.grid-template-rows": "\"1fr 2fr 1fr\"", "attr.aria-hidden": "true" }, classAttribute: "absolute inset-0 z-20 grid transition-opacity" }, ngImport: i0, template: "@if (fills()) {\n  @if (accepts()) {\n    <div\n      class=\"lw-pane-drop-zone col-span-3 row-span-3 col-start-1 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"fillZoneId()\"\n      (cdkDropListDropped)=\"onFill($event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--fill\"></div>\n    </div>\n  }\n} @else {\n  @if (has('left')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-1 row-span-3 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('left')\"\n      (cdkDropListDropped)=\"onDrop('left', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--left\"></div>\n    </div>\n  }\n  @if (has('right')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-3 row-span-3 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('right')\"\n      (cdkDropListDropped)=\"onDrop('right', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--right\"></div>\n    </div>\n  }\n  @if (has('top')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-2 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('top')\"\n      (cdkDropListDropped)=\"onDrop('top', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--top\"></div>\n    </div>\n  }\n  @if (has('bottom')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-2 row-start-3\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('bottom')\"\n      (cdkDropListDropped)=\"onDrop('bottom', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--bottom\"></div>\n    </div>\n  }\n}\n", dependencies: [{ kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: PaneDropZones, isStandalone: true, selector: "lw-pane-drop-zones", inputs: { dock: { classPropertyName: "dock", publicName: "dock", isSignal: true, isRequired: true, transformFunction: null }, paneId: { classPropertyName: "paneId", publicName: "paneId", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.opacity-0": "!active()", "class.pointer-events-none": "!active()", "style.grid-template-columns": "\"1fr 2fr 1fr\"", "style.grid-template-rows": "\"1fr 2fr 1fr\"", "attr.aria-hidden": "true" }, classAttribute: "absolute inset-0 z-20 grid transition-opacity" }, ngImport: i0, template: "@if (fills()) {\n  @if (accepts()) {\n    <div\n      class=\"lw-pane-drop-zone col-span-3 col-start-1 row-span-3 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"fillZoneId()\"\n      (cdkDropListDropped)=\"onFill($event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--fill\"></div>\n    </div>\n  }\n} @else {\n  @if (has('left')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-1 row-span-3 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('left')\"\n      (cdkDropListDropped)=\"onDrop('left', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--left\"></div>\n    </div>\n  }\n  @if (has('right')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-3 row-span-3 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('right')\"\n      (cdkDropListDropped)=\"onDrop('right', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--right\"></div>\n    </div>\n  }\n  @if (has('top')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-2 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('top')\"\n      (cdkDropListDropped)=\"onDrop('top', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--top\"></div>\n    </div>\n  }\n  @if (has('bottom')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-2 row-start-3\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('bottom')\"\n      (cdkDropListDropped)=\"onDrop('bottom', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--bottom\"></div>\n    </div>\n  }\n}\n", dependencies: [{ kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: PaneDropZones, decorators: [{
             type: Component,
@@ -9243,7 +9323,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                         '[style.grid-template-columns]': '"1fr 2fr 1fr"',
                         '[style.grid-template-rows]': '"1fr 2fr 1fr"',
                         '[attr.aria-hidden]': 'true',
-                    }, template: "@if (fills()) {\n  @if (accepts()) {\n    <div\n      class=\"lw-pane-drop-zone col-span-3 row-span-3 col-start-1 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"fillZoneId()\"\n      (cdkDropListDropped)=\"onFill($event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--fill\"></div>\n    </div>\n  }\n} @else {\n  @if (has('left')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-1 row-span-3 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('left')\"\n      (cdkDropListDropped)=\"onDrop('left', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--left\"></div>\n    </div>\n  }\n  @if (has('right')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-3 row-span-3 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('right')\"\n      (cdkDropListDropped)=\"onDrop('right', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--right\"></div>\n    </div>\n  }\n  @if (has('top')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-2 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('top')\"\n      (cdkDropListDropped)=\"onDrop('top', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--top\"></div>\n    </div>\n  }\n  @if (has('bottom')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-2 row-start-3\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('bottom')\"\n      (cdkDropListDropped)=\"onDrop('bottom', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--bottom\"></div>\n    </div>\n  }\n}\n" }]
+                    }, template: "@if (fills()) {\n  @if (accepts()) {\n    <div\n      class=\"lw-pane-drop-zone col-span-3 col-start-1 row-span-3 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"fillZoneId()\"\n      (cdkDropListDropped)=\"onFill($event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--fill\"></div>\n    </div>\n  }\n} @else {\n  @if (has('left')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-1 row-span-3 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('left')\"\n      (cdkDropListDropped)=\"onDrop('left', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--left\"></div>\n    </div>\n  }\n  @if (has('right')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-3 row-span-3 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('right')\"\n      (cdkDropListDropped)=\"onDrop('right', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--right\"></div>\n    </div>\n  }\n  @if (has('top')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-2 row-start-1\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('top')\"\n      (cdkDropListDropped)=\"onDrop('top', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--top\"></div>\n    </div>\n  }\n  @if (has('bottom')) {\n    <div\n      class=\"lw-pane-drop-zone col-start-2 row-start-3\"\n      cdkDropList\n      [cdkDropListEnterPredicate]=\"enterPredicate\"\n      [id]=\"zoneId('bottom')\"\n      (cdkDropListDropped)=\"onDrop('bottom', $event)\"\n    >\n      <div class=\"lw-pane-drop-preview lw-pane-drop-preview--bottom\"></div>\n    </div>\n  }\n}\n" }]
         }], ctorParameters: () => [], propDecorators: { dock: [{ type: i0.Input, args: [{ isSignal: true, alias: "dock", required: true }] }], paneId: [{ type: i0.Input, args: [{ isSignal: true, alias: "paneId", required: true }] }] } });
 
 class PaneMinimizedStrip {
@@ -9316,18 +9396,18 @@ class PaneSplitHandle {
             return;
         }
         const rect = parent.getBoundingClientRect();
-        const el = this.host.nativeElement;
-        el.setPointerCapture(event.pointerId);
+        const element = this.host.nativeElement;
+        element.setPointerCapture(event.pointerId);
         event.preventDefault();
         const move = (e) => this.ratioStream.emit(this.fraction(e, rect));
         const up = (e) => {
-            el.releasePointerCapture(e.pointerId);
-            el.removeEventListener('pointermove', move);
-            el.removeEventListener('pointerup', up);
+            element.releasePointerCapture(e.pointerId);
+            element.removeEventListener('pointermove', move);
+            element.removeEventListener('pointerup', up);
             this.ratioCommit.emit();
         };
-        el.addEventListener('pointermove', move);
-        el.addEventListener('pointerup', up);
+        element.addEventListener('pointermove', move);
+        element.addEventListener('pointerup', up);
     }
     onKeydown(event) {
         const step = event.shiftKey ? STEP_COARSE$1 : STEP$1;
@@ -9634,11 +9714,12 @@ function parseWidths(raw) {
         }
         const result = {};
         for (const [key, value] of Object.entries(parsed)) {
-            if (typeof value === 'number' && Number.isFinite(value)) {
-                const clamped = clampWidth(value);
-                if (clamped !== DEFAULT_PANEL_WIDTH) {
-                    result[key] = clamped;
-                }
+            if (!(typeof value === 'number' && Number.isFinite(value))) {
+                continue;
+            }
+            const clamped = clampWidth(value);
+            if (clamped !== DEFAULT_PANEL_WIDTH) {
+                result[key] = clamped;
             }
         }
         return result;
@@ -9741,20 +9822,25 @@ class PanelSplitter {
         const step = (event.shiftKey ? STEP_COARSE : STEP) * this.edgeSign();
         let next;
         switch (event.key) {
-            case 'ArrowRight':
+            case 'ArrowRight': {
                 next = this.width() + step;
                 break;
-            case 'ArrowLeft':
+            }
+            case 'ArrowLeft': {
                 next = this.width() - step;
                 break;
-            case 'Home':
+            }
+            case 'Home': {
                 next = this.size.minWidth;
                 break;
-            case 'End':
+            }
+            case 'End': {
                 next = this.size.maxWidth;
                 break;
-            default:
+            }
+            default: {
                 return;
+            }
         }
         event.preventDefault();
         this.size.setWidth(this.regionId(), next);
@@ -9811,7 +9897,7 @@ class ShellPanel {
     activeView = computed(() => {
         const path = this.activePath();
         if (!path?.startsWith(VIEW_PANE_PREFIX)) {
-            return undefined;
+            return;
         }
         return viewForPanePath(this.registry.views(), path);
     }, /* @ts-ignore */
@@ -9825,7 +9911,7 @@ class ShellPanel {
     ...(ngDevMode ? [{ debugName: "activeContentPath" }] : /* istanbul ignore next */ []));
     actions = computed(() => [...(this.activeView()?.actions ?? [])]
         .filter((action) => this.auth.visible(action.access))
-        .sort((a, b) => (a.order ?? 0) - (b.order ?? 0)), /* @ts-ignore */
+        .toSorted((a, b) => (a.order ?? 0) - (b.order ?? 0)), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "actions" }] : /* istanbul ignore next */ []));
     panelPaneOptions = PANEL_PANE_OPTIONS;
     primaryScope = computed(() => paneRetentionScope(this.region().id, this.paneTree.primaryId(this.region().id)), /* @ts-ignore */
@@ -10119,10 +10205,14 @@ function registerTabContextMenu(registry, tabs, paneMove, popout, shell) {
         },
     ];
     const registered = new Set(commands.map((command) => command.id));
-    commands.forEach((command) => registry.addCommand({ ...command, paletteHidden: true }));
-    items
-        .filter((item) => item.command !== undefined && registered.has(item.command))
-        .forEach((item) => registry.addMenuItem(item));
+    for (const command of commands) {
+        registry.addCommand({ ...command, paletteHidden: true });
+    }
+    for (const item of items) {
+        if (item.command !== undefined && registered.has(item.command)) {
+            registry.addMenuItem(item);
+        }
+    }
 }
 
 class ContentArea {
@@ -10328,7 +10418,7 @@ class ContentGrid {
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "tree" }] : /* istanbul ignore next */ []));
     constructor() {
-        const doc = inject(DOCUMENT);
+        const document_ = inject(DOCUMENT);
         const onKeydown = (event) => {
             if (event.key === 'Escape') {
                 this.chrome.restore();
@@ -10338,8 +10428,8 @@ class ContentGrid {
             if (!this.maximized()) {
                 return;
             }
-            doc.addEventListener('keydown', onKeydown);
-            onCleanup(() => doc.removeEventListener('keydown', onKeydown));
+            document_.addEventListener('keydown', onKeydown);
+            onCleanup(() => document_.removeEventListener('keydown', onKeydown));
         });
         effect(() => {
             if (!this.layout.isSplit(CONTENT_DOCK)) {
@@ -10512,8 +10602,8 @@ class DialogOutlet {
             if (!this.dialogs().length || !panels.length) {
                 return;
             }
-            const top = panels[panels.length - 1].nativeElement;
-            if (top.contains(this.document.activeElement)) {
+            const top = panels.at(-1)?.nativeElement;
+            if (!top || top.contains(this.document.activeElement)) {
                 return;
             }
             (top.querySelector('[data-lw-autofocus]') ?? top).focus();
@@ -10542,10 +10632,10 @@ class DialogOutlet {
             return;
         }
         const first = focusables[0];
-        const last = focusables[focusables.length - 1];
+        const last = focusables.at(-1);
         const active = this.document.activeElement;
         if (backward && active === first) {
-            last.focus();
+            last?.focus();
             event.preventDefault();
         }
         else if (!backward && active === last) {
@@ -10617,7 +10707,7 @@ class DialogOutlet {
     }
     topPanel() {
         const panels = this.panels();
-        return panels.length ? panels[panels.length - 1].nativeElement : undefined;
+        return panels.at(-1)?.nativeElement;
     }
     focusable(root) {
         const selector = 'button:not(:disabled), a[href], input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex]:not([tabindex="-1"])';
@@ -10625,7 +10715,7 @@ class DialogOutlet {
     }
     top() {
         const list = this.dialogs();
-        return list[list.length - 1];
+        return list.at(-1);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DialogOutlet, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DialogOutlet, isStandalone: true, selector: "lw-dialog-outlet", host: { listeners: { "document:keydown.escape": "onEscape()", "document:focusin": "onFocusIn($event)", "document:keydown.tab": "onTab($event, false)", "document:keydown.shift.tab": "onTab($event, true)" } }, viewQueries: [{ propertyName: "panels", predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: "@for (d of dialogs(); track d.id) {\n  <div [class]=\"wrapperClasses(d)\">\n    <button\n      type=\"button\"\n      class=\"lw-scrim absolute inset-0 cursor-default\"\n      [disabled]=\"!d.dismissable\"\n      [attr.aria-label]=\"'dialog.close' | transloco\"\n      (click)=\"dismiss(d)\"\n    ></button>\n\n    @if (d.bare) {\n      <dialog\n        #panel\n        open\n        class=\"relative z-10 m-0 flex max-h-full w-full flex-col overflow-hidden rounded-t-xl border border-border bg-surface-raised shadow-xl sm:rounded-xl\"\n        [class.rounded-xl]=\"d.align === 'top'\"\n        [class]=\"panelWidth(d)\"\n        aria-modal=\"true\"\n        [attr.aria-label]=\"d.title ? (d.title | transloco) : null\"\n        tabindex=\"-1\"\n      >\n        <ng-container\n          [ngComponentOutlet]=\"d.component ?? null\"\n          [ngComponentOutletInjector]=\"d.injector\"\n        />\n      </dialog>\n    } @else {\n      <dialog\n        #panel\n        open\n        class=\"relative z-10 m-0 flex max-h-full w-full flex-col gap-4 overflow-y-auto rounded-t-xl border border-border bg-surface-raised p-5 shadow-xl sm:rounded-xl\"\n        [class.rounded-xl]=\"d.align === 'top'\"\n        [class]=\"panelWidth(d)\"\n        aria-modal=\"true\"\n        [attr.aria-label]=\"d.title ? (d.title | transloco) : null\"\n        tabindex=\"-1\"\n      >\n        <div class=\"flex gap-3.5\">\n          @if (d.icon; as icon) {\n            <span\n              class=\"grid h-10 w-10 shrink-0 place-items-center rounded-full\"\n              [class]=\"toneCircle(d.tone)\"\n              aria-hidden=\"true\"\n            >\n              <lw-icon [name]=\"icon\" size=\"1.25rem\" />\n            </span>\n          }\n\n          <div class=\"flex min-w-0 flex-1 flex-col gap-3\">\n            @if (d.title || (d.kind === 'custom' && d.dismissable)) {\n              <div class=\"flex items-start justify-between gap-4\">\n                <h2 class=\"min-w-0 text-lg font-semibold text-content\">\n                  @if (d.title) {\n                    {{ d.title | transloco }}\n                  }\n                </h2>\n                <span class=\"flex shrink-0 items-center gap-1\">\n                  @if (d.maximizable) {\n                    <button\n                      lwButton\n                      variant=\"ghost\"\n                      size=\"sm\"\n                      iconOnly\n                      type=\"button\"\n                      class=\"-mt-1\"\n                      [attr.aria-label]=\"\n                        (d.ref.maximized() ? 'dialog.restore' : 'dialog.maximize') | transloco\n                      \"\n                      (click)=\"d.ref.toggleMaximized()\"\n                    >\n                      <lw-icon [name]=\"d.ref.maximized() ? 'restore' : 'maximize'\" size=\"1rem\" />\n                    </button>\n                  }\n                  @if (d.kind === 'custom' && d.dismissable) {\n                    <button\n                      lwButton\n                      variant=\"ghost\"\n                      size=\"sm\"\n                      iconOnly\n                      type=\"button\"\n                      class=\"-mt-1 -mr-1\"\n                      [attr.aria-label]=\"'dialog.close' | transloco\"\n                      (click)=\"dismiss(d)\"\n                    >\n                      <lw-icon name=\"close\" size=\"1rem\" />\n                    </button>\n                  }\n                </span>\n              </div>\n            }\n\n            @if (d.component) {\n              <ng-container\n                [ngComponentOutlet]=\"d.component\"\n                [ngComponentOutletInjector]=\"d.injector\"\n              />\n            } @else if (d.kind === 'progress') {\n              <div class=\"flex items-center gap-3 text-sm text-content\">\n                <lw-spinner [label]=\"'progress.busy' | transloco\" />\n                @if (d.progressMessage) {\n                  <span>{{ d.progressMessage() | transloco }}</span>\n                }\n              </div>\n            } @else {\n              @if (d.message) {\n                <lw-markdown [source]=\"d.message | transloco\" />\n              }\n              @if (d.requireLabel) {\n                <lw-markdown [source]=\"d.requireLabel | transloco\" />\n              }\n              @if (d.promptValue) {\n                <input\n                  type=\"text\"\n                  class=\"lw-field\"\n                  [class.lw-field--invalid]=\"guardError(d)\"\n                  [value]=\"d.promptValue()\"\n                  [attr.placeholder]=\"d.placeholder ? (d.placeholder | transloco) : null\"\n                  (input)=\"onPromptInput(d, $event)\"\n                  (keydown.enter)=\"onEnter(d)\"\n                  data-lw-autofocus\n                />\n                @if (guardError(d); as error) {\n                  <p class=\"text-xs text-negative\">{{ error | transloco }}</p>\n                }\n              }\n            }\n          </div>\n        </div>\n\n        @if (d.buttons.length) {\n          <div class=\"flex justify-end gap-2\">\n            @for (b of d.buttons; track $index) {\n              <button\n                lwButton\n                [variant]=\"b.variant\"\n                type=\"button\"\n                [disabled]=\"confirmBlocked(d, b)\"\n                [attr.data-lw-autofocus]=\"b.autofocus ? '' : null\"\n                (click)=\"onButton(d, b)\"\n              >\n                {{ b.label | transloco }}\n              </button>\n            }\n          </div>\n        }\n      </dialog>\n    }\n  </div>\n}\n", dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: LwButton, selector: "button[lwButton], a[lwButton]", inputs: ["variant", "size", "iconOnly"] }, { kind: "component", type: LwSpinner, selector: "lw-spinner", inputs: ["size", "label"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }] });
@@ -10775,7 +10865,7 @@ class SettingsRegistry {
         return this.sections()
             .map((section) => visibleSection(section, omitted))
             .filter((section) => section !== null)
-            .sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
+            .toSorted((a, b) => (a.order ?? 0) - (b.order ?? 0));
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "all" }] : /* istanbul ignore next */ []));
     register(section) {
@@ -11015,6 +11105,13 @@ function provideTranslationNamespaces(...namespaces) {
 /** Directory the distribution serves its overlay bundles from, without a trailing slash. */
 const TRANSLATION_OVERRIDES = new InjectionToken('TRANSLATION_OVERRIDES');
 const DEFAULT_OVERRIDES_PATH = '/i18n/overrides';
+function withoutTrailingSlashes(path) {
+    let end = path.length;
+    while (end > 0 && path[end - 1] === '/') {
+        end -= 1;
+    }
+    return path.slice(0, end);
+}
 /**
  * Load `<basePath>/<lang>.json` and merge it over everything else **key by key**, so a product
  * can reword the shell in its own house language ("Save as" rather than "Save as new") without
@@ -11034,7 +11131,7 @@ const DEFAULT_OVERRIDES_PATH = '/i18n/overrides';
  * nothing ships is dev-warned too, since a typo there would otherwise be a string that never appears.
  */
 function provideTranslationOverrides(basePath = DEFAULT_OVERRIDES_PATH) {
-    const normalized = basePath.replace(/\/+$/, '');
+    const normalized = withoutTrailingSlashes(basePath);
     if (normalized === '') {
         throw new Error('provideTranslationOverrides() needs a directory to load overlays from; ' +
             `pass one or omit the argument for "${DEFAULT_OVERRIDES_PATH}".`);
@@ -11086,7 +11183,9 @@ class TranslocoHttpLoader {
         return forkJoin([host$, ...namespaced$, this.overrides$(lang)]).pipe(map(([host, ...rest]) => {
             const overlay = rest.pop();
             const merged = { ...host };
-            this.namespaces.forEach((name, index) => (merged[name] = rest[index]));
+            for (const [index, name] of this.namespaces.entries()) {
+                merged[name] = rest[index];
+            }
             return this.applyOverrides(merged, overlay, lang);
         }));
     }
@@ -11157,9 +11256,7 @@ class LwIconElement extends HTMLElement {
         this.render();
     }
     attributeChangedCallback() {
-        if (this.isConnected) {
-            this.render();
-        }
+        this.refresh();
     }
     /**
      * Re-draws from the registry without changing the name. A sandboxed surface receives the product's
@@ -11266,7 +11363,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
 // GENERATED — do not edit by hand.
 // Written by tools/stamp-version.mjs from <Version> in Directory.Build.props.
 // Single source of truth: Directory.Build.props (bump via scripts/bump-version.sh).
-const APP_VERSION = '0.7.4';
+const APP_VERSION = '0.7.6';
 
 /**
  * The running build's version, sourced from `<Version>` in Directory.Build.props
@@ -11482,7 +11579,7 @@ class UpdateService {
         await bestEffort(async () => {
             const registrations = (await container?.getRegistrations()) ?? [];
             await Promise.all(registrations
-                .filter(isShellWorker)
+                .filter((registration) => isShellWorker(registration))
                 .map((registration) => registration.unregister()));
         });
         await bestEffort(async () => {
@@ -11490,14 +11587,14 @@ class UpdateService {
             const keys = (await storage?.keys()) ?? [];
             await Promise.all(keys
                 .filter((key) => key.startsWith(WORKER_CACHE_PREFIX))
-                .map((key) => storage?.delete(key)));
+                .map(async (key) => storage?.delete(key)));
         });
     }
     onVersionEvent(event) {
         if (event.type === 'VERSION_READY') {
             this.onUpdateReady();
         }
-        if (event.type === 'VERSION_INSTALLATION_FAILED') {
+        else if (event.type === 'VERSION_INSTALLATION_FAILED') {
             this.onUpdateFailed();
         }
     }
@@ -11861,7 +11958,7 @@ class CommandInvocationService {
             .filter((entry) => entry.command.callable === true &&
             this.reachable(entry, callerId, granted))
             .map((entry) => this.describe(entry.command))
-            .sort((a, b) => a.id.localeCompare(b.id));
+            .toSorted((a, b) => a.id.localeCompare(b.id));
     }
     async invoke(callerId, granted, id, args) {
         const entry = this.registry
@@ -12181,17 +12278,21 @@ class LwTooltipElement extends HTMLElement {
             const centerX = t.left + t.width / 2 - b.width / 2;
             const centerY = t.top + t.height / 2 - b.height / 2;
             switch (this.position) {
-                case 'bottom':
+                case 'bottom': {
                     [left, top] = [centerX, t.bottom + TOOLTIP_GAP];
                     break;
-                case 'left':
+                }
+                case 'left': {
                     [left, top] = [t.left - b.width - TOOLTIP_GAP, centerY];
                     break;
-                case 'right':
+                }
+                case 'right': {
                     [left, top] = [t.right + TOOLTIP_GAP, centerY];
                     break;
-                default:
+                }
+                default: {
                     [left, top] = [centerX, t.top - b.height - TOOLTIP_GAP];
+                }
             }
         }
         else {
@@ -12216,10 +12317,11 @@ class LwTooltipElement extends HTMLElement {
         }
     }
     clearTimer() {
-        if (this.showTimer !== undefined) {
-            clearTimeout(this.showTimer);
-            this.showTimer = undefined;
+        if (this.showTimer === undefined) {
+            return;
         }
+        clearTimeout(this.showTimer);
+        this.showTimer = undefined;
     }
 }
 /** Registers `<lw-tooltip>` once (idempotent) — called from {@link provideShell} at bootstrap. */
@@ -12230,11 +12332,7 @@ function defineLwTooltip() {
     }
 }
 
-const LW_SELECT_TAG = 'lw-select';
 const LW_OPTION_TAG = 'lw-option';
-const LW_SELECT_CHANGE = 'lw-select-change';
-let nextSelectId = 0;
-const TYPEAHEAD_RESET_MS = 500;
 class LwOptionElement extends HTMLElement {
     get value() {
         return this.getAttribute('value');
@@ -12253,6 +12351,87 @@ class LwOptionElement extends HTMLElement {
         upgradeElementProperty(this, 'icon');
     }
 }
+
+function readChoices(host) {
+    return [...host.querySelectorAll(LW_OPTION_TAG)].map((option) => ({
+        value: option.getAttribute('value') ?? '',
+        label: (option.textContent ?? '').trim(),
+        icon: option.getAttribute('icon'),
+        disabled: option.hasAttribute('disabled'),
+    }));
+}
+function createTrigger(options) {
+    const trigger = document.createElement('button');
+    trigger.type = 'button';
+    trigger.className = 'lw-select-trigger';
+    trigger.setAttribute('aria-haspopup', 'listbox');
+    trigger.setAttribute('aria-expanded', 'false');
+    trigger.setAttribute('aria-controls', options.listboxId);
+    trigger.style.setProperty('anchor-name', options.anchorName);
+    trigger.addEventListener('click', options.onToggle);
+    trigger.addEventListener('keydown', options.onKeydown);
+    const valueSlot = document.createElement('span');
+    valueSlot.className = 'lw-select-value';
+    const chevron = document.createElement('span');
+    chevron.className = 'lw-select-chevron';
+    chevron.setAttribute('aria-hidden', 'true');
+    chevron.textContent = '▾';
+    trigger.append(valueSlot, chevron);
+    return { trigger, valueSlot };
+}
+function createListbox(options) {
+    const listbox = document.createElement('div');
+    listbox.id = options.listboxId;
+    listbox.className = 'lw-select-listbox';
+    listbox.setAttribute('role', 'listbox');
+    listbox.hidden = true;
+    listbox.style.setProperty('position-anchor', options.anchorName);
+    listbox.addEventListener('keydown', options.onKeydown);
+    return listbox;
+}
+function fillValueSlot(slot, text, icon) {
+    slot.textContent = '';
+    if (icon) {
+        slot.append(createGlyph(icon));
+    }
+    slot.append(document.createTextNode(text));
+}
+function createOptionRow(options) {
+    const choice = options.choice;
+    const row = document.createElement('div');
+    row.className = 'lw-select-option';
+    row.setAttribute('role', 'option');
+    row.id = options.id;
+    row.dataset['value'] = choice.value;
+    row.setAttribute('aria-selected', String(options.selected));
+    row.tabIndex = -1;
+    if (choice.disabled) {
+        row.setAttribute('aria-disabled', 'true');
+    }
+    if (choice.icon) {
+        row.append(createGlyph(choice.icon));
+    }
+    row.append(document.createTextNode(choice.label));
+    row.addEventListener('click', () => {
+        if (!choice.disabled) {
+            options.onPick();
+        }
+    });
+    row.addEventListener('pointermove', options.onHover);
+    return row;
+}
+function createGlyph(icon) {
+    const glyph = document.createElement('span');
+    glyph.className = 'lw-select-glyph';
+    glyph.setAttribute('aria-hidden', 'true');
+    glyph.textContent = icon;
+    return glyph;
+}
+
+const LW_SELECT_TAG = 'lw-select';
+const LW_SELECT_CHANGE = 'lw-select-change';
+let nextSelectId = 0;
+const TYPEAHEAD_RESET_MS = 500;
 class LwSelectElement extends HTMLElement {
     static observedAttributes = [
         'value',
@@ -12297,10 +12476,7 @@ class LwSelectElement extends HTMLElement {
         if (!this.trigger) {
             return;
         }
-        if (name === 'value' ||
-            name === 'label' ||
-            name === 'placeholder' ||
-            name === 'disabled') {
+        if (LwSelectElement.observedAttributes.includes(name)) {
             this.syncTrigger();
         }
         if (name === 'disabled' && this.hasAttribute('disabled')) {
@@ -12320,51 +12496,34 @@ class LwSelectElement extends HTMLElement {
             attributes: true,
         });
     }
-    write(fn) {
+    write(function_) {
         this.observer?.disconnect();
         try {
-            fn();
+            function_();
         }
         finally {
             this.observe();
         }
     }
     choices() {
-        return [...this.querySelectorAll(LW_OPTION_TAG)].map((option) => ({
-            value: option.getAttribute('value') ?? '',
-            label: (option.textContent ?? '').trim(),
-            icon: option.getAttribute('icon'),
-            disabled: option.hasAttribute('disabled'),
-        }));
+        return readChoices(this);
     }
     selectedChoice() {
         const value = this.value;
         return this.choices().find((choice) => choice.value === value);
     }
     buildControl() {
-        const trigger = document.createElement('button');
-        trigger.type = 'button';
-        trigger.className = 'lw-select-trigger';
-        trigger.setAttribute('aria-haspopup', 'listbox');
-        trigger.setAttribute('aria-expanded', 'false');
-        trigger.setAttribute('aria-controls', this.listboxId);
-        trigger.style.setProperty('anchor-name', this.anchorName);
-        trigger.addEventListener('click', () => this.toggle());
-        trigger.addEventListener('keydown', (event) => this.onTriggerKeydown(event));
-        const valueSlot = document.createElement('span');
-        valueSlot.className = 'lw-select-value';
-        const chevron = document.createElement('span');
-        chevron.className = 'lw-select-chevron';
-        chevron.setAttribute('aria-hidden', 'true');
-        chevron.textContent = '▾';
-        trigger.append(valueSlot, chevron);
-        const listbox = document.createElement('div');
-        listbox.id = this.listboxId;
-        listbox.className = 'lw-select-listbox';
-        listbox.setAttribute('role', 'listbox');
-        listbox.hidden = true;
-        listbox.style.setProperty('position-anchor', this.anchorName);
-        listbox.addEventListener('keydown', (event) => this.onListboxKeydown(event));
+        const { trigger, valueSlot } = createTrigger({
+            anchorName: this.anchorName,
+            listboxId: this.listboxId,
+            onToggle: () => this.toggle(),
+            onKeydown: (event) => this.onTriggerKeydown(event),
+        });
+        const listbox = createListbox({
+            anchorName: this.anchorName,
+            listboxId: this.listboxId,
+            onKeydown: (event) => this.onListboxKeydown(event),
+        });
         this.append(trigger, listbox);
         this.trigger = trigger;
         this.valueSlot = valueSlot;
@@ -12379,22 +12538,13 @@ class LwSelectElement extends HTMLElement {
         const label = this.getAttribute('label');
         const selected = this.selectedChoice();
         const text = selected?.label ?? this.getAttribute('placeholder') ?? '';
-        const icon = selected?.icon ?? null;
         this.write(() => {
             trigger.disabled = this.hasAttribute('disabled');
             if (label !== null) {
                 trigger.setAttribute('aria-label', label);
                 this.listbox?.setAttribute('aria-label', label);
             }
-            valueSlot.textContent = '';
-            if (icon) {
-                const glyph = document.createElement('span');
-                glyph.className = 'lw-select-glyph';
-                glyph.setAttribute('aria-hidden', 'true');
-                glyph.textContent = icon;
-                valueSlot.append(glyph);
-            }
-            valueSlot.append(document.createTextNode(text));
+            fillValueSlot(valueSlot, text, selected?.icon ?? null);
         });
     }
     toggle() {
@@ -12420,7 +12570,9 @@ class LwSelectElement extends HTMLElement {
         const choices = this.choices();
         const selected = choices.findIndex((choice) => choice.value === this.value);
         this.setActive(Math.max(0, selected));
-        document.addEventListener('pointerdown', this.onOutsidePointer, true);
+        document.addEventListener('pointerdown', this.onOutsidePointer, {
+            capture: true,
+        });
     }
     close(refocusTrigger = true) {
         const listbox = this.listbox;
@@ -12440,94 +12592,83 @@ class LwSelectElement extends HTMLElement {
         }
     }
     renderOptions() {
-        if (!this.listbox) {
+        const listbox = this.listbox;
+        if (!listbox) {
             return;
         }
-        const items = this.choices().map((choice, index) => {
-            const option = document.createElement('div');
-            option.className = 'lw-select-option';
-            option.setAttribute('role', 'option');
-            option.id = `${this.listboxId}-opt-${index}`;
-            option.dataset['value'] = choice.value;
-            option.setAttribute('aria-selected', String(choice.value === this.value));
-            option.tabIndex = -1;
-            if (choice.disabled) {
-                option.setAttribute('aria-disabled', 'true');
-            }
-            if (choice.icon) {
-                const glyph = document.createElement('span');
-                glyph.className = 'lw-select-glyph';
-                glyph.setAttribute('aria-hidden', 'true');
-                glyph.textContent = choice.icon;
-                option.append(glyph);
-            }
-            option.append(document.createTextNode(choice.label));
-            option.addEventListener('click', () => {
-                if (!choice.disabled) {
-                    this.commit(choice.value);
-                }
-            });
-            option.addEventListener('pointermove', () => this.setActive(index));
-            return option;
-        });
-        const listbox = this.listbox;
-        this.write(() => listbox.replaceChildren(...items));
+        const rows = this.choices().map((choice, index) => createOptionRow({
+            choice,
+            id: `${this.listboxId}-opt-${index}`,
+            selected: choice.value === this.value,
+            onPick: () => this.commit(choice.value),
+            onHover: () => this.setActive(index),
+        }));
+        this.write(() => listbox.replaceChildren(...rows));
     }
     setActive(index) {
         if (!this.listbox) {
             return;
         }
-        const options = [...this.listbox.children];
-        if (options.length === 0) {
+        const rows = [...this.listbox.children];
+        if (rows.length === 0) {
             return;
         }
-        this.activeIndex = Math.max(0, Math.min(index, options.length - 1));
+        this.activeIndex = Math.max(0, Math.min(index, rows.length - 1));
         this.write(() => {
-            options.forEach((option, i) => {
-                option.classList.toggle('is-active', i === this.activeIndex);
-                option.tabIndex = i === this.activeIndex ? 0 : -1;
-            });
+            for (const [index_, row] of rows.entries()) {
+                row.classList.toggle('is-active', index_ === this.activeIndex);
+                row.tabIndex = index_ === this.activeIndex ? 0 : -1;
+            }
         });
-        const active = options[this.activeIndex];
+        const active = rows[this.activeIndex];
         active.focus();
         active.scrollIntoView?.({ block: 'nearest' });
     }
     onTriggerKeydown(event) {
-        if (['ArrowDown', 'ArrowUp', 'Enter', ' '].includes(event.key)) {
-            event.preventDefault();
-            this.openListbox();
+        if (!['ArrowDown', 'ArrowUp', 'Enter', ' '].includes(event.key)) {
+            return;
         }
+        event.preventDefault();
+        this.openListbox();
     }
     onListboxKeydown(event) {
         const last = this.choices().length - 1;
         switch (event.key) {
-            case 'ArrowDown':
+            case 'ArrowDown': {
                 this.setActive(this.activeIndex >= last ? 0 : this.activeIndex + 1);
                 break;
-            case 'ArrowUp':
+            }
+            case 'ArrowUp': {
                 this.setActive(this.activeIndex <= 0 ? last : this.activeIndex - 1);
                 break;
-            case 'Home':
+            }
+            case 'Home': {
                 this.setActive(0);
                 break;
-            case 'End':
+            }
+            case 'End': {
                 this.setActive(last);
                 break;
+            }
             case 'Enter':
-            case ' ':
+            case ' ': {
                 this.commitActive();
                 break;
-            case 'Escape':
+            }
+            case 'Escape': {
                 this.close();
                 break;
-            case 'Tab':
+            }
+            case 'Tab': {
                 this.close(false);
                 return;
-            default:
+            }
+            default: {
                 if (event.key.length === 1) {
                     this.onTypeahead(event.key);
                 }
                 return;
+            }
         }
         event.preventDefault();
     }
@@ -12539,7 +12680,7 @@ class LwSelectElement extends HTMLElement {
         this.typeaheadTimer = setTimeout(() => (this.typeahead = ''), TYPEAHEAD_RESET_MS);
         const match = this.choices().findIndex((choice) => !choice.disabled &&
             choice.label.toLowerCase().startsWith(this.typeahead));
-        if (match >= 0) {
+        if (match !== -1) {
             this.setActive(match);
         }
     }
@@ -12688,10 +12829,11 @@ class LwButtonElement extends HTMLElement {
         }
     }
     onKeydown = (event) => {
-        if ((event.key === 'Enter' || event.key === ' ') && !this.disabled) {
-            event.preventDefault();
-            this.click();
+        if (!(event.key === 'Enter' || event.key === ' ') || this.disabled) {
+            return;
         }
+        event.preventDefault();
+        this.click();
     };
     render() {
         const stale = [...this.classList].filter((cls) => cls.startsWith('lw-btn'));
@@ -12870,7 +13012,7 @@ class ViewVisibilityService {
         return this.stash
             .keyedInstances()
             .filter((entry) => !entry.key.startsWith(CONTAINER_DOCK_PREFIX) &&
-            entry.key.split('|')[1] === path)
+            entry.key.split('|', 2)[1] === path)
             .map((entry) => entry.instance);
     }
     removeTabs(path) {
@@ -12942,10 +13084,11 @@ class RailWorkspaceEntries {
     reconcile() {
         const wanted = this.wantedItems();
         for (const [id, registration] of this.registered) {
-            if (!wanted.has(id)) {
-                registration.disposable.dispose();
-                this.registered.delete(id);
+            if (wanted.has(id)) {
+                continue;
             }
+            registration.disposable.dispose();
+            this.registered.delete(id);
         }
         for (const [id, item] of wanted) {
             const current = this.registered.get(id);
@@ -13187,10 +13330,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
             type: Service
         }] });
 function installCompositionReport(report) {
-    if (typeof window === 'undefined') {
+    if (globalThis.window === undefined) {
         return;
     }
-    const host = window;
+    const host = globalThis;
     if (host['loomweaver'] !== undefined) {
         return;
     }
@@ -13261,7 +13404,7 @@ class PluginEnablementService {
         const disabled = this.disabledSet();
         return [...this.names().entries()]
             .map(([id, name]) => ({ id, name, enabled: !disabled.has(id) }))
-            .sort((a, b) => a.name.localeCompare(b.name));
+            .toSorted((a, b) => a.name.localeCompare(b.name));
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "plugins" }] : /* istanbul ignore next */ []));
     constructor() {
@@ -13415,7 +13558,7 @@ function parseCatalogEntry(raw) {
 function dedupeById(items) {
     const result = [];
     for (const item of items) {
-        if (item && !result.some((existing) => existing.id === item.id)) {
+        if (item && result.every((existing) => existing.id !== item.id)) {
             result.push(item);
         }
     }
@@ -13430,7 +13573,7 @@ function parseInstalledList(raw) {
         if (!Array.isArray(parsed)) {
             return [];
         }
-        return dedupeById(parsed.map(parseInstalledPlugin));
+        return dedupeById(parsed.map((raw) => parseInstalledPlugin(raw)));
     }
     catch {
         return [];
@@ -13440,7 +13583,7 @@ function parseCatalogList(raw) {
     if (!Array.isArray(raw)) {
         return [];
     }
-    return dedupeById(raw.map(parseCatalogEntry));
+    return dedupeById(raw.map((entry) => parseCatalogEntry(entry)));
 }
 
 const STORAGE_KEY$2 = 'lw.shell.deployed-plugins';
@@ -13468,7 +13611,7 @@ class PluginDeploymentService {
     adopt(entries) {
         this.persist(entries
             .filter((entry) => entry.deployed === true)
-            .map(withoutCatalogMetadata));
+            .map((entry) => withoutCatalogMetadata(entry)));
     }
     isDeployed(id) {
         return this.entries().some((entry) => entry.id === id);
@@ -13586,10 +13729,10 @@ function registerDefaultSettings(settings) {
 
 function fuzzyScore(query, label) {
     const needle = query.toLowerCase();
-    const haystack = label.toLowerCase();
     if (!needle) {
         return 0;
     }
+    const haystack = label.toLowerCase();
     let score = 0;
     let searchFrom = 0;
     let previous = -2;
@@ -13619,7 +13762,7 @@ function formatterFor(locale) {
     }
     catch {
         try {
-            return new Intl.RelativeTimeFormat(locale.replace(/_/g, '-'), {
+            return new Intl.RelativeTimeFormat(locale.replaceAll('_', '-'), {
                 numeric: 'auto',
             });
         }
@@ -13696,7 +13839,7 @@ function ranked(query, entries) {
     return entries
         .map((entry) => ({ entry, score: fuzzyScore(query, entry.label) }))
         .filter((scored) => scored.score !== null)
-        .sort((a, b) => b.score - a.score)
+        .toSorted((a, b) => b.score - a.score)
         .map((scored) => scored.entry);
 }
 class CommandPalette {
@@ -13753,9 +13896,9 @@ class CommandPalette {
             pinned: tab.pinned,
             closable: tab.closable,
             lastActive: tab.lastActive,
-            time: tab.lastActive !== undefined
-                ? formatRelativeTime(locale, tab.lastActive, now)
-                : undefined,
+            time: tab.lastActive === undefined
+                ? undefined
+                : formatRelativeTime(locale, tab.lastActive, now),
         }));
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "tabEntries" }] : /* istanbul ignore next */ []));
@@ -13784,7 +13927,7 @@ class CommandPalette {
         const query = this.query().trim();
         const entries = this.tabEntries();
         if (!query) {
-            return [...entries].sort((a, b) => (b.lastActive ?? 0) - (a.lastActive ?? 0));
+            return [...entries].toSorted((a, b) => (b.lastActive ?? 0) - (a.lastActive ?? 0));
         }
         return ranked(query, entries);
     }, /* @ts-ignore */
@@ -13859,7 +14002,7 @@ class CommandPalette {
             return;
         }
         const entry = this.results()[this.activeIndex()];
-        if (!entry || entry.kind !== 'tab') {
+        if (entry?.kind !== 'tab') {
             return;
         }
         event.preventDefault();
@@ -14139,7 +14282,7 @@ function seedHostCommands(registry, layout, deps) {
     registry.addCommand({
         id: QUICK_OPEN_COMMAND_ID,
         title: 'palette.quickOpenTitle',
-        icon: 'document',
+        icon: 'openWork',
         shortcut: 'mod+p',
         run: () => {
             dialogs.open(CommandPalette, {
@@ -14260,9 +14403,12 @@ function seedBuiltInMenus(registry, layout, deps) {
         return;
     }
     registerTabContextMenu(registry, deps.tabs, deps.paneMove, deps.popout, deps.features);
+    seedRailMenus(registry, layout, deps);
+    seedViewMenus(registry, layout, deps);
+}
+function seedRailMenus(registry, layout, deps) {
     const railCount = layout.regions.filter((region) => region.type === 'rail').length;
     const rail = deps.features.rail;
-    const sidebar = deps.features.sidebar;
     if (railCount >= 1 && rail.hideItems) {
         registerRailContextMenu(registry, deps.railItems);
     }
@@ -14272,6 +14418,9 @@ function seedBuiltInMenus(registry, layout, deps) {
     if (railCount >= 1 && rail.curate) {
         registerRailCustomizeMenu(registry);
     }
+}
+function seedViewMenus(registry, layout, deps) {
+    const sidebar = deps.features.sidebar;
     if (sidebar.resetViewState) {
         registerViewResetMenu(registry, deps.viewStates, deps.viewInstances);
     }
@@ -14420,7 +14569,7 @@ class BootLatchedIdentity {
             return this.latched;
         }
         const id = this.read();
-        if (id === null || id === undefined || id === '') {
+        if (!id) {
             return null;
         }
         this.latched = id;
@@ -14710,7 +14859,7 @@ function surfaceRoute(route, retained) {
 function subStub(path, pathMatch) {
     return {
         path,
-        ...(pathMatch ? { pathMatch } : {}),
+        ...(pathMatch && { pathMatch }),
         component: ContentSubStub,
         data: { content: true, sub: true },
     };
@@ -15001,13 +15150,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
             type: Service
         }] });
 function pathOfKey(key) {
-    return key.split('|')[1] ?? '';
+    return key.split('|', 2)[1] ?? '';
 }
 function stashKeyLive(key, open, routes, views) {
     if (key.startsWith(PRIMARY_RETENTION_PREFIX)) {
         return true;
     }
-    const [scope, path] = key.split('|');
+    const [scope, path] = key.split('|', 2);
     if (!tabOpen(open.get(scope), routes, path)) {
         return false;
     }
@@ -15540,7 +15689,8 @@ class IconRegistry {
             setIcon(name, safe);
             added.push(name);
         }
-        return { dispose: () => added.forEach((name) => removeIcon(name)) };
+        return { dispose: () => { for (const name of added)
+                removeIcon(name); } };
     }
     resolve(name) {
         return resolveIcon(name);
@@ -15690,6 +15840,9 @@ function providePlugins(...plugins) {
     ];
 }
 
+/** Multi-provider token: each contribution adds one sandboxed plugin to load. */
+const FRAME_PLUGIN = new InjectionToken('FRAME_PLUGIN');
+
 const STORAGE_KEY = 'lw.shell.installed-plugins';
 /**
  * The user's installed community plugins. Holds only the state: which catalog entries the
@@ -15721,7 +15874,7 @@ class PluginInstallService {
         return this.entries().some((entry) => entry.id === id);
     }
     /** The installed entry for an id, or `undefined` — the baseline an update is compared against. */
-    find(id) {
+    byId(id) {
         return this.entries().find((entry) => entry.id === id);
     }
     /**
@@ -15786,202 +15939,86 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
             type: Service
         }], ctorParameters: () => [] });
 
-const INPUT_TYPES = ['text', 'date', 'email', 'number', 'password'];
-function sanitizeOptions(raw) {
-    if (!Array.isArray(raw)) {
-        return [];
-    }
-    return raw
-        .filter((option) => typeof option === 'object' &&
-        option !== null &&
-        typeof option['value'] === 'string' &&
-        typeof option['label'] === 'string')
-        .map((option) => ({ value: option.value, label: option.label }));
-}
-function optionalString(value) {
-    return typeof value === 'string' ? value : undefined;
-}
-function optionalNumber(value) {
-    return typeof value === 'number' ? value : undefined;
-}
-function buildTextControl(value, control) {
-    return {
-        kind: 'text',
-        value,
-        inputType: INPUT_TYPES.find((type) => type === control['inputType']),
-        placeholder: optionalString(control['placeholder']),
-    };
+function levelOf(plugin) {
+    return plugin.level ?? DEFAULT_ISOLATION_LEVEL;
 }
-function buildSelectControl(pluginId, value, control) {
-    const options = sanitizeOptions(control['options']);
-    if (options.length === 0) {
-        throw new Error(`Sandbox plugin "${pluginId}": a select control needs at least one { value, label } option.`);
+function signatureOf(plugin) {
+    const sorted = (values) => [...(values ?? [])].toSorted((a, b) => a.localeCompare(b)).join(',');
+    return `${plugin.entryUrl}|${sorted(plugin.capabilities)}|${sorted(plugin.granted)}|${plugin.version ?? ''}|${levelOf(plugin)}`;
+}
+function runnablePlugins(composed, installed, deployed, catalogCap) {
+    const claimed = new Set(composed.map((plugin) => plugin.id));
+    const provided = new Set(deployed.map((plugin) => plugin.id));
+    const fromCatalog = [];
+    for (const plugin of [...deployed, ...installed]) {
+        if (claimed.has(plugin.id)) {
+            continue;
+        }
+        const asked = plugin.level ?? DEFAULT_ISOLATION_LEVEL;
+        if (exceedsLevel(asked, catalogCap)) {
+            console.error(`Plugin "${plugin.id}" asks to run ${asked}, which this catalog may not confer ` +
+                `(its cap is ${catalogCap}). It is not started.`);
+            continue;
+        }
+        claimed.add(plugin.id);
+        fromCatalog.push({
+            id: plugin.id,
+            entryUrl: plugin.entryUrl,
+            capabilities: plugin.capabilities,
+            name: plugin.name,
+            granted: plugin.capabilities ?? [],
+            version: plugin.version,
+            level: asked,
+            provided: provided.has(plugin.id) || undefined,
+        });
     }
-    return { kind: 'select', value, options };
+    return [...composed, ...fromCatalog];
 }
-function buildSliderControl(value, control) {
-    return {
-        kind: 'slider',
-        value,
-        min: optionalNumber(control['min']),
-        max: optionalNumber(control['max']),
-        step: optionalNumber(control['step']),
-    };
-}
-function sanitizeControl(pluginId, raw) {
-    const control = (raw ?? {});
-    const kind = control['kind'];
-    const value = control['value'];
-    if (kind === 'toggle' && typeof value === 'boolean') {
-        return { kind, value };
-    }
-    if (kind === 'text' && typeof value === 'string') {
-        return buildTextControl(value, control);
-    }
-    if (kind === 'select' && typeof value === 'string') {
-        return buildSelectControl(pluginId, value, control);
-    }
-    if (kind === 'slider' && typeof value === 'number') {
-        return buildSliderControl(value, control);
-    }
-    throw new Error(`Sandbox plugin "${pluginId}": a settings control must be toggle/text/select/slider with a matching default 'value'.`);
-}
-function sanitizeRow(pluginId, raw) {
-    const row = (raw ?? {});
-    if (typeof row['id'] !== 'string' || row['id'].length === 0) {
-        throw new Error(`Sandbox plugin "${pluginId}": every settings row needs a non-empty 'id'.`);
-    }
-    if (typeof row['label'] !== 'string' || row['label'].length === 0) {
-        throw new Error(`Sandbox plugin "${pluginId}": every settings row needs a non-empty 'label'.`);
-    }
-    return {
-        id: row['id'],
-        label: row['label'],
-        description: typeof row['description'] === 'string' ? row['description'] : undefined,
-        control: sanitizeControl(pluginId, row['control']),
-    };
-}
-function sanitizeRpcSettingsSection(pluginId, section) {
-    const raw = (section ?? {});
-    if (typeof raw['id'] !== 'string' || raw['id'].length === 0) {
-        throw new Error(`Sandbox plugin "${pluginId}": registerSettingsSection requires a non-empty 'id'.`);
-    }
-    if (typeof raw['title'] !== 'string' || raw['title'].length === 0) {
-        throw new Error(`Sandbox plugin "${pluginId}": registerSettingsSection requires a non-empty 'title'.`);
-    }
-    if (!Array.isArray(raw['rows']) || raw['rows'].length === 0) {
-        throw new Error(`Sandbox plugin "${pluginId}": registerSettingsSection requires at least one row.`);
-    }
-    return {
-        id: raw['id'],
-        title: raw['title'],
-        order: typeof raw['order'] === 'number' ? raw['order'] : undefined,
-        rows: raw['rows'].map((row) => sanitizeRow(pluginId, row)),
-    };
-}
-function defaultsOf(wire) {
-    const defaults = {};
-    for (const row of wire.rows) {
-        defaults[row.id] = row.control.value;
-    }
-    return defaults;
-}
-function typedOverlay(defaults, raw) {
-    if (!raw) {
-        return defaults;
-    }
-    try {
-        const parsed = JSON.parse(raw);
-        if (typeof parsed !== 'object' || parsed === null) {
-            return defaults;
-        }
-        const merged = { ...defaults };
-        for (const [key, value] of Object.entries(parsed)) {
-            if (key in defaults && typeof value === typeof defaults[key]) {
-                merged[key] = value;
-            }
-        }
-        return merged;
-    }
-    catch {
-        return defaults;
-    }
-}
-function buildFrameSection(deps) {
-    const { pluginId, wire, group, store, sync, notify } = deps;
-    const key = `lw.plugin-settings:${pluginId}:${wire.id}`;
-    const defaults = defaultsOf(wire);
-    const values = signal(typedOverlay(defaults, store.peek?.(key)), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "values" }] : /* istanbul ignore next */ []));
-    const applyStored = (raw) => {
-        values.set(typedOverlay(defaults, raw));
-        notify(wire.id, values());
-    };
-    if (store.peek) {
-        notify(wire.id, values());
-    }
-    else {
-        hydrateAsync(store, key, applyStored);
-    }
-    const disposeSync = sync.register('settings', key, applyStored);
-    const set = (rowId, value) => {
-        values.update((current) => ({ ...current, [rowId]: value }));
-        void store.set(key, JSON.stringify(values()));
-        notify(wire.id, values());
-    };
-    const section = {
-        id: `${pluginId}.${wire.id}`,
-        title: wire.title,
-        group,
-        order: wire.order,
-        rows: wire.rows.map((row) => ({
-            id: `${pluginId}.${wire.id}.${row.id}`,
-            label: row.label,
-            description: row.description,
-            control: hostControl(row, values, set),
-        })),
-    };
-    return { section, disposeSync };
-}
-function hostControl(row, values, set) {
-    const control = row.control;
-    switch (control.kind) {
-        case 'toggle':
-            return {
-                kind: 'toggle',
-                value: () => values()[row.id] === true,
-                set: (value) => set(row.id, value),
-            };
-        case 'text':
-            return {
-                kind: 'text',
-                inputType: control.inputType,
-                placeholder: control.placeholder,
-                value: () => String(values()[row.id] ?? ''),
-                set: (value) => set(row.id, value),
-            };
-        case 'select':
-            return {
-                kind: 'select',
-                options: control.options,
-                value: () => String(values()[row.id] ?? control.value),
-                set: (value) => set(row.id, value),
-            };
-        case 'slider':
-            return {
-                kind: 'slider',
-                min: control.min,
-                max: control.max,
-                step: control.step,
-                value: () => Number(values()[row.id] ?? control.value),
-                set: (value) => set(row.id, value),
-            };
-    }
+
+const UNCARRIABLE_ARGUMENTS = {
+    outcome: 'refused',
+    reason: 'invalid-arguments',
+    message: 'Arguments must be an object of single values or lists of them; anything else cannot cross the ' +
+        'sandbox boundary as the value it was.',
+};
+function invokeRpcCommand(ctx, id, args) {
+    const carried = args === undefined ? undefined : asCommandArguments(args);
+    return carried === null
+        ? Promise.resolve(UNCARRIABLE_ARGUMENTS)
+        : ctx.invokeCommand(String(id), carried);
 }
 
 const MAX_RPC_AREA_DEPTH = 8;
 function sanitizeRpcSurface(pluginId, surface, permitted) {
     const raw = (surface ?? {});
+    const { id, title } = rpcSurfaceIdentity(pluginId, raw);
+    const container = sanitizeRpcContainer(raw['container']);
+    const iframe = container === undefined
+        ? rpcIframeUrl(pluginId, raw['iframe'], permitted)
+        : undefined;
+    const routable = sanitizeRpcRoutable(raw['routable']);
+    const docks = sanitizeRpcDocks(raw['docks']);
+    assertRpcSurfaceAddress(pluginId, container, routable, docks);
+    const shared = {
+        id,
+        title,
+        icon: typeof raw['icon'] === 'string' ? raw['icon'] : undefined,
+        order: typeof raw['order'] === 'number' ? raw['order'] : undefined,
+        instanceable: raw['instanceable'] === true ? true : undefined,
+        retain: raw['retain'] === 'always' || raw['retain'] === 'never'
+            ? raw['retain']
+            : undefined,
+        saveOn: raw['saveOn'] === 'hide' ? 'hide' : undefined,
+        closable: raw['closable'] === false ? false : undefined,
+        padded: raw['padded'] === false ? false : undefined,
+        routable,
+        docks,
+    };
+    return container === undefined
+        ? { ...shared, iframe: iframe }
+        : { ...shared, container };
+}
+function rpcSurfaceIdentity(pluginId, raw) {
     if (typeof raw['id'] !== 'string' || raw['id'].length === 0) {
         throw new Error(`Sandbox plugin "${pluginId}": registerSurface requires a non-empty 'id'.`);
     }
@@ -15996,20 +16033,20 @@ function sanitizeRpcSurface(pluginId, surface, permitted) {
         throw new Error(`Sandbox plugin "${pluginId}": 'access' does not cross the RPC boundary — ` +
             `a sandboxed surface gates itself from the pushed session state.`);
     }
-    const container = sanitizeRpcContainer(raw['container']);
-    const iframe = raw['iframe'];
-    if (container === undefined) {
-        if (typeof iframe !== 'string') {
-            throw new Error(`Sandbox plugin "${pluginId}": registerSurface needs an { iframe } URL or a { container } spec.`);
-        }
-        const origin = surfaceOrigin(iframe);
-        if (origin === null || !permittedOrigins(permitted).has(origin)) {
-            throw new Error(`Sandbox plugin "${pluginId}": the iframe surface must be served from an origin this ` +
-                `distribution permitted for it, got "${iframe}".`);
-        }
+    return { id: raw['id'], title: raw['title'] };
+}
+function rpcIframeUrl(pluginId, value, permitted) {
+    if (typeof value !== 'string') {
+        throw new TypeError(`Sandbox plugin "${pluginId}": registerSurface needs an { iframe } URL or a { container } spec.`);
     }
-    const routable = sanitizeRpcRoutable(raw['routable']);
-    const docks = sanitizeRpcDocks(raw['docks']);
+    const origin = surfaceOrigin(value);
+    if (origin === null || !permittedOrigins(permitted).has(origin)) {
+        throw new Error(`Sandbox plugin "${pluginId}": the iframe surface must be served from an origin this ` +
+            `distribution permitted for it, got "${value}".`);
+    }
+    return value;
+}
+function assertRpcSurfaceAddress(pluginId, container, routable, docks) {
     if (routable === undefined && docks === undefined) {
         throw new Error(`Sandbox plugin "${pluginId}": registerSurface needs 'routable.path' (a URL-addressed surface) ` +
             `or 'docks' (a surface hosted at a dock).`);
@@ -16018,24 +16055,6 @@ function sanitizeRpcSurface(pluginId, surface, permitted) {
         throw new Error(`Sandbox plugin "${pluginId}": a container surface must be routable — a container tab holds ` +
             `its own ':id'.`);
     }
-    const shared = {
-        id: raw['id'],
-        title: raw['title'],
-        icon: typeof raw['icon'] === 'string' ? raw['icon'] : undefined,
-        order: typeof raw['order'] === 'number' ? raw['order'] : undefined,
-        instanceable: raw['instanceable'] === true ? true : undefined,
-        retain: raw['retain'] === 'always' || raw['retain'] === 'never'
-            ? raw['retain']
-            : undefined,
-        saveOn: raw['saveOn'] === 'hide' ? 'hide' : undefined,
-        closable: raw['closable'] === false ? false : undefined,
-        padded: raw['padded'] === false ? false : undefined,
-        routable,
-        docks,
-    };
-    return container !== undefined
-        ? { ...shared, container }
-        : { ...shared, iframe: iframe };
 }
 function sanitizeRpcRoutable(value) {
     if (typeof value !== 'object' || value === null) {
@@ -16088,7 +16107,7 @@ function sanitizeRpcArea(value, depth) {
     const raw = value;
     const size = typeof raw['size'] === 'number' ? { size: raw['size'] } : {};
     if (Array.isArray(raw['tabs'])) {
-        return { ...size, tabs: raw['tabs'].flatMap(sanitizeRpcContainerTab) };
+        return { ...size, tabs: raw['tabs'].flatMap((value) => sanitizeRpcContainerTab(value)) };
     }
     for (const kind of ['rows', 'columns']) {
         const declared = raw[kind];
@@ -16115,8 +16134,8 @@ function sanitizeRpcContainerTab(value) {
     return [
         {
             surface: raw['surface'],
-            ...(raw['closable'] === false ? { closable: false } : {}),
-            ...(raw['active'] === true ? { active: true } : {}),
+            ...(raw['closable'] === false && { closable: false }),
+            ...(raw['active'] === true && { active: true }),
         },
     ];
 }
@@ -16173,11 +16192,14 @@ function sanitizeRpcToastInput(input) {
         id: typeof raw['id'] === 'string' ? raw['id'] : undefined,
     };
 }
+const NOTIFICATION_KINDS = new Set([
+    'info',
+    'success',
+    'warning',
+    'error',
+]);
 function isNotificationKind(value) {
-    return (value === 'info' ||
-        value === 'success' ||
-        value === 'warning' ||
-        value === 'error');
+    return NOTIFICATION_KINDS.has(value);
 }
 function sanitizeRpcMenuItem(item) {
     const raw = (item ?? {});
@@ -16210,29 +16232,267 @@ function sanitizeMenuContext(value) {
     return clean;
 }
 
-const UNCARRIABLE_ARGUMENTS = {
-    outcome: 'refused',
-    reason: 'invalid-arguments',
-    message: 'Arguments must be an object of single values or lists of them; anything else cannot cross the ' +
-        'sandbox boundary as the value it was.',
-};
-function invokeRpcCommand(ctx, id, args) {
-    const carried = args === undefined ? undefined : asCommandArguments(args);
-    return carried === null
-        ? Promise.resolve(UNCARRIABLE_ARGUMENTS)
-        : ctx.invokeCommand(String(id), carried);
+const INPUT_TYPES = ['text', 'date', 'email', 'number', 'password'];
+function sanitizeOptions(raw) {
+    if (!Array.isArray(raw)) {
+        return [];
+    }
+    return raw
+        .filter((option) => typeof option === 'object' &&
+        option !== null &&
+        typeof option['value'] === 'string' &&
+        typeof option['label'] === 'string')
+        .map((option) => ({ value: option.value, label: option.label }));
 }
-
-/** Multi-provider token: each contribution adds one sandboxed plugin to load. */
-const FRAME_PLUGIN = new InjectionToken('FRAME_PLUGIN');
-function levelOf(plugin) {
-    return plugin.level ?? DEFAULT_ISOLATION_LEVEL;
+function optionalString(value) {
+    return typeof value === 'string' ? value : undefined;
 }
-function signatureOf(plugin) {
-    const caps = [...(plugin.capabilities ?? [])].sort().join(',');
-    const granted = [...(plugin.granted ?? [])].sort().join(',');
-    return `${plugin.entryUrl}|${caps}|${granted}|${plugin.version ?? ''}|${levelOf(plugin)}`;
+function optionalNumber(value) {
+    return typeof value === 'number' ? value : undefined;
 }
+function buildTextControl(value, control) {
+    return {
+        kind: 'text',
+        value,
+        inputType: INPUT_TYPES.find((type) => type === control['inputType']),
+        placeholder: optionalString(control['placeholder']),
+    };
+}
+function buildSelectControl(pluginId, value, control) {
+    const options = sanitizeOptions(control['options']);
+    if (options.length === 0) {
+        throw new Error(`Sandbox plugin "${pluginId}": a select control needs at least one { value, label } option.`);
+    }
+    return { kind: 'select', value, options };
+}
+function buildSliderControl(value, control) {
+    return {
+        kind: 'slider',
+        value,
+        min: optionalNumber(control['min']),
+        max: optionalNumber(control['max']),
+        step: optionalNumber(control['step']),
+    };
+}
+function sanitizeControl(pluginId, raw) {
+    const control = (raw ?? {});
+    const kind = control['kind'];
+    const value = control['value'];
+    if (kind === 'toggle' && typeof value === 'boolean') {
+        return { kind, value };
+    }
+    if (kind === 'text' && typeof value === 'string') {
+        return buildTextControl(value, control);
+    }
+    if (kind === 'select' && typeof value === 'string') {
+        return buildSelectControl(pluginId, value, control);
+    }
+    if (kind === 'slider' && typeof value === 'number') {
+        return buildSliderControl(value, control);
+    }
+    throw new Error(`Sandbox plugin "${pluginId}": a settings control must be toggle/text/select/slider with a matching default 'value'.`);
+}
+function sanitizeRow(pluginId, raw) {
+    const row = (raw ?? {});
+    if (typeof row['id'] !== 'string' || row['id'].length === 0) {
+        throw new Error(`Sandbox plugin "${pluginId}": every settings row needs a non-empty 'id'.`);
+    }
+    if (typeof row['label'] !== 'string' || row['label'].length === 0) {
+        throw new Error(`Sandbox plugin "${pluginId}": every settings row needs a non-empty 'label'.`);
+    }
+    return {
+        id: row['id'],
+        label: row['label'],
+        description: typeof row['description'] === 'string' ? row['description'] : undefined,
+        control: sanitizeControl(pluginId, row['control']),
+    };
+}
+function sanitizeRpcSettingsSection(pluginId, section) {
+    const raw = (section ?? {});
+    if (typeof raw['id'] !== 'string' || raw['id'].length === 0) {
+        throw new Error(`Sandbox plugin "${pluginId}": registerSettingsSection requires a non-empty 'id'.`);
+    }
+    if (typeof raw['title'] !== 'string' || raw['title'].length === 0) {
+        throw new Error(`Sandbox plugin "${pluginId}": registerSettingsSection requires a non-empty 'title'.`);
+    }
+    if (!Array.isArray(raw['rows']) || raw['rows'].length === 0) {
+        throw new Error(`Sandbox plugin "${pluginId}": registerSettingsSection requires at least one row.`);
+    }
+    return {
+        id: raw['id'],
+        title: raw['title'],
+        order: typeof raw['order'] === 'number' ? raw['order'] : undefined,
+        rows: raw['rows'].map((row) => sanitizeRow(pluginId, row)),
+    };
+}
+function defaultsOf(wire) {
+    const defaults = {};
+    for (const row of wire.rows) {
+        defaults[row.id] = row.control.value;
+    }
+    return defaults;
+}
+function typedOverlay(defaults, raw) {
+    if (!raw) {
+        return defaults;
+    }
+    try {
+        const parsed = JSON.parse(raw);
+        if (typeof parsed !== 'object' || parsed === null) {
+            return defaults;
+        }
+        const merged = { ...defaults };
+        for (const [key, value] of Object.entries(parsed)) {
+            if (Object.hasOwn(defaults, key) && typeof value === typeof defaults[key]) {
+                merged[key] = value;
+            }
+        }
+        return merged;
+    }
+    catch {
+        return defaults;
+    }
+}
+function buildFrameSection(deps) {
+    const { pluginId, wire, group, store, sync, notify } = deps;
+    const key = `lw.plugin-settings:${pluginId}:${wire.id}`;
+    const defaults = defaultsOf(wire);
+    const values = signal(typedOverlay(defaults, store.peek?.(key)), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "values" }] : /* istanbul ignore next */ []));
+    const applyStored = (raw) => {
+        values.set(typedOverlay(defaults, raw));
+        notify(wire.id, values());
+    };
+    if (store.peek) {
+        notify(wire.id, values());
+    }
+    else {
+        hydrateAsync(store, key, applyStored);
+    }
+    const disposeSync = sync.register('settings', key, applyStored);
+    const set = (rowId, value) => {
+        values.update((current) => ({ ...current, [rowId]: value }));
+        void store.set(key, JSON.stringify(values()));
+        notify(wire.id, values());
+    };
+    const section = {
+        id: `${pluginId}.${wire.id}`,
+        title: wire.title,
+        group,
+        order: wire.order,
+        rows: wire.rows.map((row) => ({
+            id: `${pluginId}.${wire.id}.${row.id}`,
+            label: row.label,
+            description: row.description,
+            control: hostControl(row, values, set),
+        })),
+    };
+    return { section, disposeSync };
+}
+function hostControl(row, values, set) {
+    const control = row.control;
+    switch (control.kind) {
+        case 'toggle': {
+            return {
+                kind: 'toggle',
+                value: () => values()[row.id] === true,
+                set: (value) => set(row.id, value),
+            };
+        }
+        case 'text': {
+            return {
+                kind: 'text',
+                inputType: control.inputType,
+                placeholder: control.placeholder,
+                value: () => String(values()[row.id] ?? ''),
+                set: (value) => set(row.id, value),
+            };
+        }
+        case 'select': {
+            return {
+                kind: 'select',
+                options: control.options,
+                value: () => String(values()[row.id] ?? control.value),
+                set: (value) => set(row.id, value),
+            };
+        }
+        case 'slider': {
+            return {
+                kind: 'slider',
+                min: control.min,
+                max: control.max,
+                step: control.step,
+                value: () => Number(values()[row.id] ?? control.value),
+                set: (value) => set(row.id, value),
+            };
+        }
+    }
+}
+
+function frameRpcMethods(deps) {
+    const { pluginId, ctx, origins, watched } = deps;
+    return reportingRefusals({
+        registerSurface: (surface) => {
+            ctx.registerSurface(sanitizeRpcSurface(pluginId, surface, origins));
+        },
+        registerMenuItem: (item) => {
+            ctx.registerMenuItem(sanitizeRpcMenuItem(item));
+        },
+        registerSettingsSection: (section) => {
+            const built = buildFrameSection({
+                pluginId,
+                wire: sanitizeRpcSettingsSection(pluginId, section),
+                group: deps.install.isInstalled(pluginId)
+                    ? 'settings.group.community'
+                    : 'settings.group.plugins',
+                store: deps.store,
+                sync: deps.sync,
+                notify: (sectionId, values) => deps.notify((remote) => remote.settingsChanged(sectionId, values)),
+            });
+            deps.syncCleanups.push(built.disposeSync);
+            ctx.registerSettingsSection(built.section);
+        },
+        navigateContent: (path) => ctx.navigateContent(path),
+        openContentTab: (input) => {
+            const sanitized = sanitizeRpcTabInput(input);
+            ctx.openContentTab({
+                ...sanitized,
+                onClose: () => deps.notify((remote) => remote.contentTabClosed(sanitized.path)),
+            });
+        },
+        keepContentTab: (path) => ctx.keepContentTab(path),
+        pinContentTab: (path) => ctx.pinContentTab(path),
+        unpinContentTab: (path) => ctx.unpinContentTab(path),
+        closeContentTab: (path) => ctx.closeContentTab(path),
+        revealSurface: (id) => ctx.revealSurface(id),
+        invokeCommand: (id, args) => invokeRpcCommand(ctx, id, args),
+        invocableCommands: () => ctx.invocableCommands(),
+        toast: (input) => ctx.ui.toast(sanitizeRpcToastInput(input)),
+        stateWatch: (key) => deps.watchState(key),
+        stateSet: (key, value) => watched.get(key)?.handle.set(value),
+        stateClear: (key) => watched.get(key)?.handle.clear(),
+        stateUnwatch: (key) => {
+            watched.get(key)?.stop();
+            watched.delete(key);
+        },
+    }, deps.reportRefusal);
+}
+function reportingRefusals(methods, report) {
+    const reported = Object.entries(methods).map(([name, method]) => [
+        name,
+        (...args) => {
+            try {
+                return method(...args);
+            }
+            catch (error) {
+                report(error);
+                throw error;
+            }
+        },
+    ]);
+    return Object.fromEntries(reported);
+}
+
 /**
  * Second {@link PluginRuntime} implementation:
  * runs each plugin in an isolated `<iframe sandbox="allow-scripts">` and hands it `ctx` over **Penpal**
@@ -16290,9 +16550,13 @@ class FramePluginRuntime {
         this.instances.delete(id);
         instance.connection.destroy();
         instance.frame.remove();
-        instance.watched.forEach((entry) => entry.stop());
+        for (const entry of instance.watched.values()) {
+            entry.stop();
+        }
         instance.ctx.disposeAll();
-        instance.syncCleanups.forEach((cleanup) => cleanup());
+        for (const cleanup of instance.syncCleanups) {
+            cleanup();
+        }
         this.grants.unregister(id);
         this.isolation.unregister(id);
     }
@@ -16304,7 +16568,7 @@ class FramePluginRuntime {
         }
     }
     reconcile(disabled, installed, deployed) {
-        const runnable = this.runnablePlugins(installed, deployed);
+        const runnable = runnablePlugins(this.plugins, installed, deployed, this.catalogCap);
         for (const plugin of runnable) {
             this.enablement.register(plugin.id, plugin.name ?? plugin.id);
             const enabled = plugin.provided === true || !disabled.has(plugin.id);
@@ -16322,34 +16586,6 @@ class FramePluginRuntime {
         }
         this.dropUninstalled(runnable);
     }
-    runnablePlugins(installed, deployed) {
-        const claimed = new Set(this.plugins.map((plugin) => plugin.id));
-        const provided = new Set(deployed.map((plugin) => plugin.id));
-        const fromCatalog = [];
-        for (const plugin of [...deployed, ...installed]) {
-            if (claimed.has(plugin.id)) {
-                continue;
-            }
-            const asked = plugin.level ?? DEFAULT_ISOLATION_LEVEL;
-            if (exceedsLevel(asked, this.catalogCap)) {
-                console.error(`Plugin "${plugin.id}" asks to run ${asked}, which this catalog may not confer ` +
-                    `(its cap is ${this.catalogCap}). It is not started.`);
-                continue;
-            }
-            claimed.add(plugin.id);
-            fromCatalog.push({
-                id: plugin.id,
-                entryUrl: plugin.entryUrl,
-                capabilities: plugin.capabilities,
-                name: plugin.name,
-                granted: plugin.capabilities ?? [],
-                version: plugin.version,
-                level: asked,
-                provided: provided.has(plugin.id) || undefined,
-            });
-        }
-        return [...this.plugins, ...fromCatalog];
-    }
     dropUninstalled(runnable) {
         const known = new Set(runnable.map((plugin) => plugin.id));
         for (const id of this.instances.keys()) {
@@ -16373,7 +16609,19 @@ class FramePluginRuntime {
         const watched = new Map();
         const connection = connect({
             messenger,
-            methods: this.reportingRefusals(this.rpcMethods(plugin.id, ctx, syncCleanups, watched, plugin.origins)),
+            methods: frameRpcMethods({
+                pluginId: plugin.id,
+                ctx,
+                origins: plugin.origins,
+                install: this.install,
+                store: this.store,
+                sync: this.sync,
+                syncCleanups,
+                watched,
+                watchState: (key) => this.watchState(plugin.id, ctx, watched, key),
+                notify: (send) => this.notify(plugin.id, send),
+                reportRefusal: (error) => this.refusals.report(error),
+            }),
         });
         this.instances.set(plugin.id, {
             ctx,
@@ -16384,10 +16632,11 @@ class FramePluginRuntime {
             watched,
         });
         connection.promise.catch((error) => {
-            if (this.instances.has(plugin.id)) {
-                console.error(`Sandbox plugin "${plugin.id}" failed to connect`, error);
-                this.deactivate(plugin.id);
+            if (!this.instances.has(plugin.id)) {
+                return;
             }
+            console.error(`Sandbox plugin "${plugin.id}" failed to connect`, error);
+            this.deactivate(plugin.id);
         });
     }
     createFrame(entryUrl, level) {
@@ -16398,71 +16647,9 @@ class FramePluginRuntime {
         frame.setAttribute('aria-hidden', 'true');
         frame.style.display = 'none';
         frame.src = entryUrl;
-        document.body.appendChild(frame);
+        document.body.append(frame);
         return frame;
     }
-    reportingRefusals(methods) {
-        const reported = Object.entries(methods).map(([name, method]) => [
-            name,
-            (...args) => {
-                try {
-                    return method(...args);
-                }
-                catch (error) {
-                    this.refusals.report(error);
-                    throw error;
-                }
-            },
-        ]);
-        return Object.fromEntries(reported);
-    }
-    rpcMethods(pluginId, ctx, syncCleanups, watched, origins) {
-        return {
-            registerSurface: (surface) => {
-                ctx.registerSurface(sanitizeRpcSurface(pluginId, surface, origins));
-            },
-            registerMenuItem: (item) => {
-                ctx.registerMenuItem(sanitizeRpcMenuItem(item));
-            },
-            registerSettingsSection: (section) => {
-                const built = buildFrameSection({
-                    pluginId,
-                    wire: sanitizeRpcSettingsSection(pluginId, section),
-                    group: this.install.isInstalled(pluginId)
-                        ? 'settings.group.community'
-                        : 'settings.group.plugins',
-                    store: this.store,
-                    sync: this.sync,
-                    notify: (sectionId, values) => this.notifySettings(pluginId, sectionId, values),
-                });
-                syncCleanups.push(built.disposeSync);
-                ctx.registerSettingsSection(built.section);
-            },
-            navigateContent: (path) => ctx.navigateContent(path),
-            openContentTab: (input) => {
-                const sanitized = sanitizeRpcTabInput(input);
-                ctx.openContentTab({
-                    ...sanitized,
-                    onClose: () => this.notifyTabClosed(pluginId, sanitized.path),
-                });
-            },
-            keepContentTab: (path) => ctx.keepContentTab(path),
-            pinContentTab: (path) => ctx.pinContentTab(path),
-            unpinContentTab: (path) => ctx.unpinContentTab(path),
-            closeContentTab: (path) => ctx.closeContentTab(path),
-            revealSurface: (id) => ctx.revealSurface(id),
-            invokeCommand: (id, args) => invokeRpcCommand(ctx, id, args),
-            invocableCommands: () => ctx.invocableCommands(),
-            toast: (input) => ctx.ui.toast(sanitizeRpcToastInput(input)),
-            stateWatch: (key) => this.watchState(pluginId, ctx, watched, key),
-            stateSet: (key, value) => watched.get(key)?.handle.set(value),
-            stateClear: (key) => watched.get(key)?.handle.clear(),
-            stateUnwatch: (key) => {
-                watched.get(key)?.stop();
-                watched.delete(key);
-            },
-        };
-    }
     watchState(pluginId, ctx, watched, key) {
         if (watched.has(key)) {
             return;
@@ -16471,7 +16658,7 @@ class FramePluginRuntime {
         const ref = effect(() => {
             const value = handle.value();
             const loaded = handle.loaded();
-            untracked(() => this.notifyState(pluginId, key, value, loaded));
+            untracked(() => this.notify(pluginId, (remote) => remote.stateChanged(key, value, loaded)));
         }, { ...(ngDevMode ? { debugName: "ref" } : /* istanbul ignore next */ {}), injector: this.injector });
         watched.set(key, {
             handle,
@@ -16481,32 +16668,12 @@ class FramePluginRuntime {
             },
         });
     }
-    notifyState(pluginId, key, value, loaded) {
-        const instance = this.instances.get(pluginId);
-        if (!instance) {
-            return;
-        }
-        void instance.connection.promise
-            .then((remote) => remote.stateChanged(key, value, loaded))
-            .catch(() => undefined);
-    }
-    notifyTabClosed(pluginId, path) {
+    notify(pluginId, send) {
         const instance = this.instances.get(pluginId);
         if (!instance) {
             return;
         }
-        void instance.connection.promise
-            .then((remote) => remote.contentTabClosed(path))
-            .catch(() => undefined);
-    }
-    notifySettings(pluginId, sectionId, values) {
-        const instance = this.instances.get(pluginId);
-        if (!instance) {
-            return;
-        }
-        void instance.connection.promise
-            .then((remote) => remote.settingsChanged(sectionId, values))
-            .catch(() => undefined);
+        void instance.connection.promise.then(send).catch(() => undefined);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: FramePluginRuntime, deps: [], target: i0.ɵɵFactoryTarget.Service });
     static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.0", ngImport: i0, type: FramePluginRuntime });
@@ -16650,12 +16817,12 @@ function availableUpdate(installed, entry) {
     return isNewerVersion(entry.version, installed.version) ? entry : undefined;
 }
 function addedCapabilities(entry, installed) {
-    const consented = new Set(installed.capabilities ?? []);
+    const consented = new Set(installed.capabilities);
     return (entry.capabilities ?? []).filter((capability) => !consented.has(capability));
 }
 
 async function confirmUpdate(deps, entry) {
-    const installed = deps.installs.find(entry.id);
+    const installed = deps.installs.byId(entry.id);
     if (!installed) {
         return;
     }
@@ -16821,7 +16988,7 @@ class PluginStoreDetail {
     transloco = inject(TranslocoService);
     readme = signal(undefined, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "readme" }] : /* istanbul ignore next */ []));
-    update = computed(() => availableUpdate(this.installs.find(this.entry().id), this.entry()), /* @ts-ignore */
+    update = computed(() => availableUpdate(this.installs.byId(this.entry().id), this.entry()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "update" }] : /* istanbul ignore next */ []));
     constructor() {
         effect(() => {
@@ -16907,7 +17074,7 @@ class PluginStoreDialog {
     ...(ngDevMode ? [{ debugName: "selectedId" }] : /* istanbul ignore next */ []));
     filtered = computed(() => {
         const list = (this.entries() ?? []).filter((entry) => matchesQuery([entry.name, entry.author, entry.category, entry.description], this.query()));
-        return list.sort((a, b) => (b.downloads ?? 0) - (a.downloads ?? 0) || a.name.localeCompare(b.name));
+        return list.toSorted((a, b) => (b.downloads ?? 0) - (a.downloads ?? 0) || a.name.localeCompare(b.name));
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "filtered" }] : /* istanbul ignore next */ []));
     selected = computed(() => this.filtered().find((entry) => entry.id === this.selectedId()), /* @ts-ignore */
@@ -16919,7 +17086,7 @@ class PluginStoreDialog {
         void confirmInstall(this.consentDeps, entry);
     }
     hasUpdate(entry) {
-        return availableUpdate(this.installs.find(entry.id), entry) !== undefined;
+        return availableUpdate(this.installs.byId(entry.id), entry) !== undefined;
     }
     requestUpdate(entry) {
         void confirmUpdate(this.consentDeps, entry);