@forgeax/interface 0.4.1

package/dist/package/browser/components/Bus/BusAdminPanel.js

@@ -0,0 +1,1385 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// P2.6d — Bus admin panel: full visibility into what the bus actually loaded.
+// Top-level mode, mounted by MainArea when store.mode === 'bus'. Lists every
+// plugin returned by GET /api/extensions/list, grouped by `kind`, with one row per
+// plugin: id / displayName.zh / version / extension info (icon + panelSize +
+// position) when applicable, plus an experimental flag chip.
+//
+// P2.6e — adds a filter bar above the groups: one colored chip per kind (with
+// count) acting as a toggle (first click solos that kind, repeat-click brings
+// "all on" back), and a substring search input matching id + displayName.
+// Reset button collapses both back to the initial "show everything" state.
+//
+// P2.6f — row click expands an inline detail panel: chevron column toggles
+// between ▸ (collapsed) and ▾ (expanded); expanded rows insert a colSpan row
+// below with full zh + en descriptions (no line-clamp), the canonical manifest
+// id rendered as plugins-dir hint, full extension manifest dump, and a note
+// about provides[]/broken[] still being P3 territory. Expanded ids persist
+// across filter/search changes so the player can "search → expand → narrow
+// further" without losing place.
+//
+// P2.6g — when the slim shape exposes `provides.{skills,tools,events,
+// cliProvider}` (server side projects file-path-stripped subsets), render a
+// "provides" section in the detail row: skills → `id · trigger` rows, tools
+// → `id [exposedToAI]` rows, events → `name` rows, cliProvider → models +
+// 5 boolean capability chips. The note about provides[] no longer being
+// exposed now applies only to broken[].
+//
+// P4.34 — for the agent KindSection, render a violet (#c4a3ff — agent
+// tribe color matching ts-agent / cp-agent / tb-agent family) health LED
+// between .ba-kind-count and .ba-kind-desc, reading `N reg · M/K run`.
+// Driven by polling listExtensions('agent') + dashApi.daemons.list() in
+// lockstep every 10s; tone is ok (≥1 daemon running) / warn (registered
+// but 0 running) / down (registered = 0 or fetch failed) / loading. This
+// is the 3rd Bus admin section LED (after cli-provider P4.14 +
+// extension P4.33), bringing section LED coverage to 3/5 kinds.
+//
+// P3.21 — for the cli-provider KindSection only, render a sticky compact
+// capability matrix between the kind header and the table. 4 cli × 5
+// capability grid (streaming/thinking/toolCalls/subAgents/sessions) lets the
+// player compare row-by-row without expanding every detail row. Column
+// headers carry per-cap coverage badges ("4/4 ●"), row headers carry the cli
+// displayName + provider id mono code. ●=on (#d4ff48 lime · sky-blue fill on
+// header) / ○=off (dim gray). When all caps for all cli are on, the bottom
+// summary turns lime "5 cap · 100% coverage"; partial coverage shifts to
+// amber for visual alarm. This is the first matrix-style data viz in the
+// Bus panel (provides block is per-cli vertical) — 4×5 dense grid is a new
+// visual primitive for the panel.
+//
+// P4.38 — Bus kind mini-dashboard (ba-mini-dashboard). Inserted just under the
+// `.ba-head` title row (above `.ba-ui-surfaces` and `.ba-filterbar`) so the
+// player landing on ⌘3 Bus admin sees a one-row, zero-scroll snapshot of all
+// 6 bus kinds before any group rolls into view: 6 colored mini-LED pills
+// (extension lime · agent violet · cli-provider sky-blue / amber when not all
+// ok · model-binding teal · skill gold · tool orange) each reading `<dot>
+// <KIND> <ok/total>`. Tones reuse the 6 section-LED snapshots already polled
+// at panel level (cliProv / pageSurfaces / agentSnap / mbSnap / skillSnap /
+// toolSnap from P4.14/33/34/35/36/37) — no new endpoint, no extra poll, no
+// new store key. Click a pill → solo that kind (same semantics as ba-chip
+// solo: first click solos, repeat click resets to all); also fires
+// setPendingSidebarKindFlash(kind) so the Sidebar BUS KINDS chip flashes in
+// sympathy (P3.38 reverse-echo channel). Hover title surfaces the same
+// multi-line breakdown each section LED already exposes, so the player can
+// read "which extension panels are mounted / which providers are healthy /
+// which agent daemons are running / which skills/tools are experimental"
+// without scrolling to that section's header. Completes the BusAdminPanel
+// section-LED 6/6 collection (P4.14 → P4.37 across 23 phases) by giving
+// those LEDs a unified header dashboard surface.
+//
+// P4.40 — Bus kind mini-dashboard tail "aggregate summary pill"
+// (`.ba-md-summary`). Sits to the right of the 6 LEDs and reads the same
+// `leds` descriptor list to bucket each LED into one of four tones:
+// `loading / ok / warn / down`. Renders `N ✓ · M ⚠ · K ✗` (loading-only
+// state falls back to `…`) with the same per-tone color grammar the 6 LEDs
+// already use (ok lime · warn amber · down red), and gives the player a
+// 0-scroll, no-hover answer to "how is the bus overall?" without having to
+// scan all 6 LEDs. Outer ring color reflects the worst tone present —
+// down > warn > loading > ok — so degraded bus state visually alarms.
+// Click → resetFilters() (clears kind solo + clears the search query), so
+// the pill also doubles as a one-tap "back to everything" escape hatch
+// after the player has soloed a kind via any of the 6 LEDs / ba-chip /
+// Sidebar BUS KINDS / TabStrip ts-*-chip / TopBar tb-* / PreviewToolbar
+// pt-* / ChatPanel cp-* deep-links. When `enabledKinds` is non-null (i.e.
+// player currently has at least one kind soloed), the trailing arrow
+// glyph swaps `↺ → ⤺` to signal "this click will UNDO that filter" rather
+// than just refresh. 0 server / 0 store / 0 marketplace changes · 0 new
+// endpoint · 0 new poll — fully derived from the 6 snapshots already at
+// panel scope (cliProv / pageSurfaces / agentSnap / mbSnap / skillSnap /
+// toolSnap).
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { createIntervalTaskLifecycle, createRestartableTimeoutTaskLifecycle, } from '@forgeax/app-shell/react';
+import { useTranslation } from '../../i18n';
+import { extensionManifestSourceLabel, listExtensions, pickLang } from '../../lib/extension-api';
+import { dashApi } from '../../lib/dashboard-api';
+import { emitDeepLink, useDeepLink } from '../../lib/deep-link-bus';
+import { openExtensionPage } from '../../core/page-navigation';
+import { CapabilityOverview } from './CapabilityOverview';
+import './BusAdminPanel.css';
+// Static vendor → cli-provider id map used by the model-binding section LED.
+// Kept inline (not exported) because the mapping is a UI-side rendering hint,
+// not a runtime contract. New vendors fall through to providerId=null which
+// the LED reports as "unmapped" without claiming health.
+const VENDOR_TO_PROVIDER = {
+    anthropic: 'claude-code',
+    openai: 'codex',
+    cursor: 'cursor-agent',
+    forgeax: 'forgeax',
+};
+// Stable kind ordering — extension first (the player's most-edited surface),
+// then agent (next most-touched), then everything else alphabetical. Unknown
+// kinds bucket to the end via the +1000 fallback.
+const KIND_ORDER = {
+    extension: 10,
+    agent: 20,
+    'cli-provider': 30,
+    'model-binding': 40,
+    skill: 50,
+    tool: 60,
+};
+function groupByKind(items) {
+    const m = new Map();
+    for (const it of items) {
+        const list = m.get(it.kind) ?? [];
+        list.push(it);
+        m.set(it.kind, list);
+    }
+    const groups = [];
+    for (const [kind, list] of m) {
+        list.sort((a, b) => a.id.localeCompare(b.id));
+        groups.push({ kind, items: list });
+    }
+    groups.sort((a, b) => {
+        const oa = KIND_ORDER[a.kind] ?? 1000;
+        const ob = KIND_ORDER[b.kind] ?? 1000;
+        if (oa !== ob)
+            return oa - ob;
+        return a.kind.localeCompare(b.kind);
+    });
+    return groups;
+}
+// P2.6e — substring match against id + displayName.zh + displayName.en. Case
+// insensitive, '' = match all. Keeps the table dense so the player can type
+// 'wb' to see extensions, 'cli' to see cli-providers, 'anim' to jump to one.
+function matchesQuery(p, q) {
+    if (!q)
+        return true;
+    const hay = [
+        p.id,
+        pickLang(p.displayName, 'zh', ''),
+        pickLang(p.displayName, 'en', ''),
+    ]
+        .join(' ')
+        .toLowerCase();
+    return hay.includes(q.toLowerCase());
+}
+export function BusAdminPanel() {
+    const { t } = useTranslation();
+    const [items, setItems] = useState([]);
+    const [loading, setLoading] = useState(true);
+    const [err, setErr] = useState(null);
+    const [refreshTs, setRefreshTs] = useState(Date.now());
+    const [query, setQuery] = useState('');
+    // null = "all kinds on"; Set = explicit kinds enabled. Toggling the first
+    // chip switches into explicit mode with that single kind enabled (single
+    // click = focus that kind), then further clicks add/remove.
+    const [enabledKinds, setEnabledKinds] = useState(null);
+    // P2.6f — which plugin ids are currently expanded. Persisted across filter
+    // changes (re-typing search shouldn't collapse what you opened). Refresh
+    // (re-fetch) clears it so stale rows can't linger expanded.
+    const [expandedIds, setExpandedIds] = useState(new Set());
+    // P-UI-SURFACES — read-only view of /api/bus/ui/surfaces. The P9 dual-modality
+    // work has the server registering UI surfaces (host.sidebar + plugin-layer
+    // surfaces like character-forge.editor) with `actions[]` exposed to AI. No
+    // existing panel surfaces this registry, so the player can't see what AI
+    // can actually drive at runtime. We render a compact strip between the head
+    // and the kind filter bar listing each surface + its action count.
+    const [uiSurfaces, setUiSurfaces] = useState(null);
+    // P4.14 — cli-provider health snapshot. Inlines the same 10s poll that
+    // TopBar tb-providers and PreviewToolbar pt-prov already run; the LED ends
+    // up in the cli-provider KindSection header so the player reading the bus
+    // panel sees the same ok/warn/down signal without leaving the section.
+    const [cliProv, setCliProv] = useState({
+        tone: 'loading',
+        ok: 0,
+        total: 0,
+        rows: [],
+    });
+    // P4.33 — extension section LED snapshot. Refilled by polling
+    // /api/bus/ui/surfaces every 10s; the `total` field is overlaid with the
+    // current `group.items.length` of the extension section at render time, so
+    // the header always reads `mounted/total` against the live registry rather
+    // than a snapshot total taken once at fetch time.
+    const [pageSurfaces, setPageSurfaces] = useState({
+        tone: 'loading',
+        mounted: 0,
+        total: 0,
+        mountedPageIds: new Set(),
+    });
+    // P4.34 — agent section LED snapshot. After daemon retirement, only the
+    // registered plugin count drives this LED. Tone: ok (violet) when ≥1
+    // agent plugin is registered, down (red) on fetch failure or 0 plugins.
+    const [agentSnap, setAgentSnap] = useState({
+        tone: 'loading',
+        registered: 0,
+        agentIds: [],
+    });
+    // P4.35 — model-binding section LED snapshot. Refilled by polling 2 endpoints
+    // in lockstep every 10s: listExtensions('model-binding') gives the registered
+    // bindings + vendor/channel/models; dashApi.providers() gives per-provider
+    // health.ok. We join via VENDOR_TO_PROVIDER (anthropic → claude-code etc).
+    // Tone classification mirrors P4.34 agent: live ≥ 1 ⇒ ok-teal; registered ≥ 1
+    // but live = 0 ⇒ warn-amber (registry has bindings but no underlying CLI is
+    // healthy); registered = 0 or fetch failure ⇒ down-red.
+    const [mbSnap, setMbSnap] = useState({
+        tone: 'loading',
+        registered: 0,
+        live: 0,
+        bindings: [],
+    });
+    // P4.36 — skill section LED snapshot. Refilled by polling
+    // listExtensions('skill') every 10s. Unlike mb/agent this LED has no
+    // second channel — "ready" is derived intra-plugin from skills.length≥1;
+    // "experimental" from manifest experimental:true. Lockstep cadence with
+    // the other 4 LEDs so all 5 visibly update in the same tick.
+    const [skillSnap, setSkillSnap] = useState({
+        tone: 'loading',
+        registered: 0,
+        ready: 0,
+        experimental: 0,
+        skills: [],
+    });
+    // P4.37 — tool section LED snapshot. Same shape as skillSnap (single
+    // channel — tool plugins have no per-binding runtime health). Refilled by
+    // polling listExtensions('tool') every 10s, lockstep with the other 5
+    // section LEDs so 6/6 LEDs visibly update in the same tick.
+    const [toolSnap, setToolSnap] = useState({
+        tone: 'loading',
+        registered: 0,
+        ready: 0,
+        exposedAi: 0,
+        experimental: 0,
+        tools: [],
+    });
+    // P3.57 — roving tabindex focus head for the `.ba-chips` filter row.
+    // Arrow keys move this index; Enter/Space (button native) toggle the kind.
+    // We pick manual-activate (not auto) because chip click has filter side
+    // effect (would surprise keyboard scrubbing). Mirrors P3.50 footer chip
+    // manual-Enter mode rather than P3.51/53/54 auto-activate.
+    const [chipFocusIdx, setChipFocusIdx] = useState(0);
+    const chipRefs = useRef([]);
+    // P3.58 — roving tabindex focus head for the table rows (`.ba-table tr`).
+    // Flat ordering across all KindSection tables — player presses ↑/↓ to walk
+    // the 19 plugins as one stream, transparently crossing kind-section
+    // boundaries. Enter/Space toggles expand. Manual-activate (Enter required)
+    // — arrow keys only move focus, never toggle, because expand mutates
+    // expandedIds + fires P3.40 ChatPanel TabStrip flash (side effects).
+    const [focusedRowId, setFocusedRowId] = useState(null);
+    // P2.7f — deep-link target from Sidebar's ExtensionPlaceholder "在 Bus 详情
+    //查看 →" button. Consumed once on mount + whenever it flips non-null, then
+    // cleared so a back-and-forth between Sidebar/Bus tab doesn't re-expand
+    // (player may have manually collapsed it since).
+    // R5/P2 — deep-links moved off the interface store onto the bus (retain semantics).
+    const [pendingBusExpandId, clearBusExpandId] = useDeepLink('bus:expand-plugin');
+    // P3.37 — sister deep-link to bus:expand-plugin: Sidebar BUS KINDS footer
+    // chips emit this + setMode('bus'); consume it here once items have loaded by
+    // soloing that kind in the filter row (enabledKinds = {kind}), then clear.
+    const [pendingBusKindFilter, clearBusKindFilter] = useDeepLink('bus:filter-kind');
+    const rowRefs = useRef(new Map());
+    useEffect(() => {
+        let cancel = false;
+        setLoading(true);
+        listExtensions()
+            .then((r) => {
+            if (cancel)
+                return;
+            setItems(r.items);
+            setErr(null);
+        })
+            .catch((e) => {
+            if (cancel)
+                return;
+            setErr(e.message);
+        })
+            .finally(() => {
+            if (!cancel)
+                setLoading(false);
+        });
+        return () => {
+            cancel = true;
+        };
+    }, [refreshTs]);
+    // P2.6f — clear expanded rows whenever the player explicitly refreshes; a
+    // re-fetch may renumber/replace rows so leaving stale expansion is confusing.
+    useEffect(() => {
+        setExpandedIds(new Set());
+    }, [refreshTs]);
+    // P-UI-SURFACES — fetch /api/bus/ui/surfaces. Independent endpoint from the
+    // plugin list. Null until first fetch resolves; [] when endpoint is 404
+    // (server hasn't shipped P9 yet); populated rows otherwise. Silent failure
+    // — the strip just stays hidden, the rest of the panel keeps working.
+    useEffect(() => {
+        let cancel = false;
+        fetch('/api/bus/ui/surfaces')
+            .then((r) => (r.ok ? r.json() : { count: 0, items: [] }))
+            .then((j) => {
+            if (cancel)
+                return;
+            setUiSurfaces(j.items ?? []);
+        })
+            .catch(() => {
+            if (!cancel)
+                setUiSurfaces([]);
+        });
+        return () => {
+            cancel = true;
+        };
+    }, [refreshTs]);
+    // P4.14 — poll /api/cli-providers for the cli-provider section LED.
+    useEffect(() => {
+        let cancelled = false;
+        const tick = async () => {
+            try {
+                const r = await dashApi.providers();
+                if (cancelled)
+                    return;
+                const rows = r.providers ?? [];
+                const ok = rows.filter((p) => p.health?.ok).length;
+                const total = rows.length;
+                const tone = total === 0 ? 'down' : ok === total ? 'ok' : ok === 0 ? 'down' : 'warn';
+                setCliProv({ tone, ok, total, rows });
+            }
+            catch {
+                if (!cancelled)
+                    setCliProv({ tone: 'down', ok: 0, total: 0, rows: [] });
+            }
+        };
+        void tick();
+        const poll = createIntervalTaskLifecycle({
+            task: () => { void tick(); },
+            intervalMs: 10_000,
+        });
+        poll.start();
+        return () => {
+            cancelled = true;
+            poll.dispose();
+        };
+    }, [refreshTs]);
+    // P4.33 — poll /api/bus/ui/surfaces for the extension section LED. Counts
+    // plugin-layer surfaces (layer === 'plugin'); each surface id `<pageId>.<x>`
+    // contributes its `pageId` prefix. `mountedPageIds` is the join key against the
+    // extension KindSection items array at render time. Tone classification
+    // happens in KindSection (needs the live total from `group.items.length`).
+    useEffect(() => {
+        let cancelled = false;
+        const tick = async () => {
+            try {
+                const r = await fetch('/api/bus/ui/surfaces');
+                if (!r.ok)
+                    throw new Error(`HTTP ${r.status}`);
+                const body = (await r.json());
+                if (cancelled)
+                    return;
+                const mounted = new Set();
+                for (const s of body.items ?? []) {
+                    if (s.layer !== 'plugin')
+                        continue;
+                    const dot = s.id.indexOf('.');
+                    const pageId = dot > 0 ? s.id.slice(0, dot) : s.id;
+                    if (pageId)
+                        mounted.add(pageId);
+                }
+                setPageSurfaces({
+                    tone: 'loading', // tone reclassified in KindSection vs live total
+                    mounted: mounted.size,
+                    total: 0,
+                    mountedPageIds: mounted,
+                });
+            }
+            catch {
+                if (!cancelled)
+                    setPageSurfaces({ tone: 'down', mounted: 0, total: 0, mountedPageIds: new Set() });
+            }
+        };
+        void tick();
+        const poll = createIntervalTaskLifecycle({
+            task: () => { void tick(); },
+            intervalMs: 10_000,
+        });
+        poll.start();
+        return () => {
+            cancelled = true;
+            poll.dispose();
+        };
+    }, [refreshTs]);
+    // P4.34 — poll registered agent plugins for the agent section LED.
+    // Daemon channel deleted (R3 — no more daemon processes); tone reads
+    // only `registered ≥ 1` now.
+    useEffect(() => {
+        let cancelled = false;
+        const tick = async () => {
+            try {
+                const plugins = await listExtensions('agent');
+                if (cancelled)
+                    return;
+                const agentIds = plugins.items.map((p) => p.id);
+                const tone = agentIds.length === 0 ? 'down' : 'ok';
+                setAgentSnap({
+                    tone,
+                    registered: agentIds.length,
+                    agentIds,
+                });
+            }
+            catch {
+                if (!cancelled)
+                    setAgentSnap({
+                        tone: 'down',
+                        registered: 0,
+                        agentIds: [],
+                    });
+            }
+        };
+        void tick();
+        const poll = createIntervalTaskLifecycle({
+            task: () => { void tick(); },
+            intervalMs: 10_000,
+        });
+        poll.start();
+        return () => {
+            cancelled = true;
+            poll.dispose();
+        };
+    }, [refreshTs]);
+    // P4.35 — poll registered model-binding plugins + cli-provider health in
+    // lockstep for the model-binding section LED. Mirrors P4.34 agent poll
+    // shape: a single Promise.all keeps the snapshot atomic; either fetch
+    // failure ⇒ tone='down'. Join key is VENDOR_TO_PROVIDER[binding.vendor];
+    // unmapped vendors render as `live=false` but still count toward registered.
+    useEffect(() => {
+        let cancelled = false;
+        const tick = async () => {
+            try {
+                const [plugins, providers] = await Promise.all([
+                    listExtensions('model-binding'),
+                    dashApi.providers(),
+                ]);
+                if (cancelled)
+                    return;
+                const provRows = providers.providers ?? [];
+                const healthById = new Map();
+                for (const p of provRows) {
+                    healthById.set(p.id, { ok: !!p.health?.ok, detail: p.health?.detail });
+                }
+                const bindings = plugins.items.map((p) => {
+                    const vendor = p.modelBinding?.vendor ?? '';
+                    const channel = p.modelBinding?.channel ?? '';
+                    const providerId = vendor ? (VENDOR_TO_PROVIDER[vendor] ?? null) : null;
+                    const h = providerId ? healthById.get(providerId) : undefined;
+                    return {
+                        id: p.id,
+                        vendor,
+                        channel,
+                        providerId,
+                        healthy: !!h?.ok,
+                        detail: h?.detail,
+                    };
+                });
+                const live = bindings.filter((b) => b.healthy).length;
+                const tone = bindings.length === 0 ? 'down' : live >= 1 ? 'ok' : 'warn';
+                setMbSnap({ tone, registered: bindings.length, live, bindings });
+            }
+            catch {
+                if (!cancelled)
+                    setMbSnap({ tone: 'down', registered: 0, live: 0, bindings: [] });
+            }
+        };
+        void tick();
+        const poll = createIntervalTaskLifecycle({
+            task: () => { void tick(); },
+            intervalMs: 10_000,
+        });
+        poll.start();
+        return () => {
+            cancelled = true;
+            poll.dispose();
+        };
+    }, [refreshTs]);
+    // P4.36 — poll registered skill plugins every 10s for the skill section
+    // LED. Single-channel (no cli-provider / daemon join — skills have no
+    // runtime health channel today), but classifies each plugin into
+    // ready/experimental buckets so tone amber surfaces "registry has skill
+    // plugins but they're all placeholders" without forcing the player to
+    // open each row to read the experimental flag.
+    useEffect(() => {
+        let cancelled = false;
+        const tick = async () => {
+            try {
+                const r = await listExtensions('skill');
+                if (cancelled)
+                    return;
+                const skills = r.items.map((p) => {
+                    const triggers = (p.skills ?? []).map((s) => s.trigger);
+                    return {
+                        id: p.id,
+                        triggers,
+                        experimental: p.experimental === true,
+                        ready: triggers.length >= 1,
+                    };
+                });
+                const registered = skills.length;
+                const ready = skills.filter((s) => s.ready).length;
+                const experimental = skills.filter((s) => s.experimental).length;
+                const tone = registered === 0
+                    ? 'down'
+                    : ready < registered || experimental === registered
+                        ? 'warn'
+                        : 'ok';
+                setSkillSnap({ tone, registered, ready, experimental, skills });
+            }
+            catch {
+                if (!cancelled)
+                    setSkillSnap({
+                        tone: 'down',
+                        registered: 0,
+                        ready: 0,
+                        experimental: 0,
+                        skills: [],
+                    });
+            }
+        };
+        void tick();
+        const poll = createIntervalTaskLifecycle({
+            task: () => { void tick(); },
+            intervalMs: 10_000,
+        });
+        poll.start();
+        return () => {
+            cancelled = true;
+            poll.dispose();
+        };
+    }, [refreshTs]);
+    // P4.37 — poll registered tool plugins every 10s for the tool section LED.
+    // Mirrors P4.36 skill poll shape: single-channel (no provider join · tools
+    // have no per-binding runtime health today), but classifies each plugin
+    // into ready/experimental + counts AI-exposed tools so tone amber surfaces
+    // "registry has tools but they're all experimental placeholders" without
+    // forcing the player to open each row to read the experimental flag.
+    useEffect(() => {
+        let cancelled = false;
+        const tick = async () => {
+            try {
+                const r = await listExtensions('tool');
+                if (cancelled)
+                    return;
+                const tools = r.items.map((p) => {
+                    const toolList = p.tools ?? [];
+                    const eventList = p.events ?? [];
+                    const aiExposed = toolList.filter((t) => t.exposedToAI !== false).length;
+                    return {
+                        id: p.id,
+                        toolIds: toolList.map((t) => t.id),
+                        eventNames: eventList.map((e) => e.name),
+                        aiExposed,
+                        experimental: p.experimental === true,
+                        ready: toolList.length >= 1,
+                    };
+                });
+                const registered = tools.length;
+                const ready = tools.filter((t) => t.ready).length;
+                const exposedAi = tools.reduce((n, t) => n + t.aiExposed, 0);
+                const experimental = tools.filter((t) => t.experimental).length;
+                const tone = registered === 0
+                    ? 'down'
+                    : ready < registered || experimental === registered
+                        ? 'warn'
+                        : 'ok';
+                setToolSnap({ tone, registered, ready, exposedAi, experimental, tools });
+            }
+            catch {
+                if (!cancelled)
+                    setToolSnap({
+                        tone: 'down',
+                        registered: 0,
+                        ready: 0,
+                        exposedAi: 0,
+                        experimental: 0,
+                        tools: [],
+                    });
+            }
+        };
+        void tick();
+        const poll = createIntervalTaskLifecycle({
+            task: () => { void tick(); },
+            intervalMs: 10_000,
+        });
+        poll.start();
+        return () => {
+            cancelled = true;
+            poll.dispose();
+        };
+    }, [refreshTs]);
+    // P2.7f — apply deep-link request once items have loaded.
+    // so the expand attempt waits for the fetch to resolve (otherwise we'd open
+    // an id that isn't in the table yet, and the scroll target ref wouldn't exist).
+    useEffect(() => {
+        if (!pendingBusExpandId)
+            return;
+        if (items.length === 0)
+            return;
+        const target = pendingBusExpandId;
+        setExpandedIds((prev) => {
+            const next = new Set(prev);
+            next.add(target);
+            return next;
+        });
+        // Defer scroll one frame so the new row + detail row render before we
+        // measure their position.
+        requestAnimationFrame(() => {
+            const row = rowRefs.current.get(target);
+            if (row) {
+                row.scrollIntoView({ behavior: 'smooth', block: 'center' });
+            }
+        });
+        clearBusExpandId();
+    }, [pendingBusExpandId, items.length, clearBusExpandId]);
+    // P3.37 — consume Sidebar footer chip click. Wait until items load so the
+    // kind set is non-empty (and the chip filter row is mounted). Soloing a kind
+    // mirrors what clicking a chip in the local filter row would do — so the
+    // player lands in the same state, with one kind visible across all groups.
+    useEffect(() => {
+        if (!pendingBusKindFilter)
+            return;
+        if (items.length === 0)
+            return;
+        const target = pendingBusKindFilter;
+        setEnabledKinds(new Set([target]));
+        clearBusKindFilter();
+    }, [pendingBusKindFilter, items.length, clearBusKindFilter]);
+    const toggleExpand = (id) => {
+        // P3.40 — fire the ChatPanel TabStrip bus-chip flash on every toggle
+        // (expand AND collapse). Both directions are "I just touched a bus row";
+        // TabStrip dedupes via its own timer reset, so spam-clicking the same row
+        // doesn't compound — each click starts a fresh 0.8s pulse from peak.
+        emitDeepLink('chat:flash-bus-chip', id);
+        setExpandedIds((prev) => {
+            const next = new Set(prev);
+            if (next.has(id))
+                next.delete(id);
+            else
+                next.add(id);
+            return next;
+        });
+    };
+    const allGroups = useMemo(() => groupByKind(items), [items]);
+    // Kind chip metadata is derived from the unfiltered groups so the chip row
+    // remains stable as the user types / toggles — counts always reflect "what
+    // bus actually loaded", not "what's currently visible".
+    const kindStats = useMemo(() => allGroups.map((g) => ({ kind: g.kind, count: g.items.length })), [allGroups]);
+    const groups = useMemo(() => {
+        return allGroups
+            .filter((g) => enabledKinds === null || enabledKinds.has(g.kind))
+            .map((g) => ({ kind: g.kind, items: g.items.filter((p) => matchesQuery(p, query)) }))
+            .filter((g) => g.items.length > 0);
+    }, [allGroups, query, enabledKinds]);
+    const visibleCount = useMemo(() => groups.reduce((sum, g) => sum + g.items.length, 0), [groups]);
+    const filtered = enabledKinds !== null || query.length > 0;
+    // P3.58 — flat ordering of currently-visible plugin ids across all kind
+    // sections. Crucial that this is derived from `groups` (filtered view), not
+    // `allGroups`, so ↑↓ only walks rows the player can actually see.
+    const orderedRowIds = useMemo(() => groups.flatMap((g) => g.items.map((p) => p.id)), [groups]);
+    // P3.58 — keep focused row valid as filter/search/refresh churn the visible
+    // set. If the previously-focused id was filtered out (or items just loaded),
+    // snap to the first visible row so Tab-into-table lands somewhere sensible.
+    useEffect(() => {
+        if (orderedRowIds.length === 0) {
+            if (focusedRowId !== null)
+                setFocusedRowId(null);
+            return;
+        }
+        if (focusedRowId === null || !orderedRowIds.includes(focusedRowId)) {
+            setFocusedRowId(orderedRowIds[0]);
+        }
+    }, [orderedRowIds, focusedRowId]);
+    // P3.58 — moveRowFocus is bound per-row in ExtensionRow.onKeyDown. Cycles via
+    // mod-N so ↓ from last wraps to first and ↑ from first wraps to last.
+    const moveRowFocus = (currentId, key) => {
+        const n = orderedRowIds.length;
+        if (n === 0)
+            return;
+        const idx = orderedRowIds.indexOf(currentId);
+        if (idx < 0)
+            return;
+        let next = idx;
+        if (key === 'ArrowDown' || key === 'ArrowRight')
+            next = (idx + 1) % n;
+        else if (key === 'ArrowUp' || key === 'ArrowLeft')
+            next = (idx - 1 + n) % n;
+        else if (key === 'Home')
+            next = 0;
+        else if (key === 'End')
+            next = n - 1;
+        else
+            return;
+        const nextId = orderedRowIds[next];
+        setFocusedRowId(nextId);
+        requestAnimationFrame(() => {
+            rowRefs.current.get(nextId)?.focus();
+        });
+    };
+    const toggleKind = (kind) => {
+        // P3.38 — fire the reverse deep-link on every click (not just on solo-in),
+        // because the player's mental model is "I touched THIS kind, confirm it
+        // over in the Sidebar". Sidebar will reset its own timer if the same chip
+        // is clicked rapidly, so spamming doesn't break the animation.
+        emitDeepLink('sidebar:flash-kind', kind);
+        setEnabledKinds((prev) => {
+            // First click from "all on" → solo that kind (most common UX: "show me
+            // just extension"). Re-click solo'd kind → back to "all on".
+            if (prev === null)
+                return new Set([kind]);
+            const next = new Set(prev);
+            if (next.has(kind))
+                next.delete(kind);
+            else
+                next.add(kind);
+            // If user toggled all kinds back on, snap to null sentinel so the chip
+            // row renders the same as initial mount.
+            if (next.size === kindStats.length)
+                return null;
+            // If user turned every chip off, also snap back to null — empty filter
+            // is confusing ("nothing to show"); treat it as "reset".
+            if (next.size === 0)
+                return null;
+            return next;
+        });
+    };
+    const resetFilters = () => {
+        setEnabledKinds(null);
+        setQuery('');
+    };
+    // P4.39 — derive 4-state tone (loading / ok / warn / down) per kind at panel
+    // scope so both the mini-dashboard (P4.38 ba-mini-dashboard) and the kind
+    // filter chip row (`.ba-chip`) can read from one source of truth. Same logic
+    // the IIFE already uses for the mini-dashboard: extension gets re-derived off
+    // mounted-vs-registered (panel-scope pageSurfaces.tone stays 'loading' by
+    // design); the other five mirror their snapshot.tone directly. Players see
+    // the chip dot + the dashboard LED light up in the same 10s tick.
+    const kindTones = (() => {
+        const pageRegistered = allGroups.find((g) => g.kind === 'extension')?.items.length ?? 0;
+        const pageTone = pageSurfaces.tone === 'down'
+            ? 'down'
+            : pageRegistered === 0
+                ? 'down'
+                : pageSurfaces.mounted >= 1
+                    ? 'ok'
+                    : 'warn';
+        return {
+            extension: pageTone,
+            agent: agentSnap.tone,
+            'cli-provider': cliProv.tone,
+            'model-binding': mbSnap.tone,
+            skill: skillSnap.tone,
+            tool: toolSnap.tone,
+        };
+    })();
+    return (_jsxs("div", { className: "bus-admin", "data-presentation": "full", children: [_jsxs("div", { className: "ba-head", children: [_jsxs("div", { className: "ba-title", children: [_jsx("span", { className: "ba-title-text", children: t('bus.title') }), _jsx("span", { className: "ba-title-meta", children: loading
+                                    ? t('common.loading')
+                                    : filtered
+                                        ? `${visibleCount} / ${items.length} plugin · ${groups.length} kind`
+                                        : `${items.length} plugin · ${allGroups.length} kind` })] }), _jsxs("button", { className: "ba-refresh", onClick: () => setRefreshTs(Date.now()), title: t('bus.refreshTitle'), children: ["\u21BB ", t('bus.refresh')] })] }), !loading && items.length > 0 && (() => {
+                // P4.38 — mini-dashboard row. Builds one descriptor per kind reading
+                // the 6 snapshots already populated at panel scope. Order matches
+                // KIND_ORDER (extension → agent → cli-provider → model-binding →
+                // skill → tool) so it lines up with the section sequence below.
+                // Page tone reclass — panel-level pageSurfaces.tone stays 'loading'
+                // by design (KindSection re-derives against live group total), so the
+                // mini-dashboard recomputes here off mounted vs registered counts:
+                //   fetch failed → down · registered=0 → down · mounted≥1 → ok ·
+                //   registered≥1 but mounted=0 → warn (lazy-load state, no tab opened
+                //   yet). Brief first-paint flash shows warn (mounted=0) before the
+                //   first poll completes — acceptable, since the section LED has the
+                //   same property.
+                const pageRegistered = allGroups.find((g) => g.kind === 'extension')?.items.length ?? 0;
+                const pageTone = pageSurfaces.tone === 'down'
+                    ? 'down'
+                    : pageRegistered === 0
+                        ? 'down'
+                        : pageSurfaces.mounted >= 1
+                            ? 'ok'
+                            : 'warn';
+                const pageCount = `${pageSurfaces.mounted}/${Math.max(pageSurfaces.mounted, pageRegistered)}`;
+                const pageTitle = pageTone === 'down' && pageSurfaces.tone === 'down'
+                    ? 'Page — fetch failed (/api/bus/ui/surfaces)'
+                    : `Page — ${pageSurfaces.mounted}/${Math.max(pageSurfaces.mounted, pageRegistered)} panels mounted · ${pageRegistered} registered · ${t('bus.mdFocusKind', { kind: 'extension' })}`;
+                const agentCount = agentSnap.tone === 'loading'
+                    ? '…'
+                    : `${agentSnap.registered}`;
+                const agentTitle = agentSnap.tone === 'loading'
+                    ? 'Agent — checking /api/extensions/list?kind=agent …'
+                    : `Agent — ${agentSnap.registered} plugin${agentSnap.registered === 1 ? '' : 's'} registered · ${t('bus.mdFocusKind', { kind: 'agent' })}`;
+                const provCount = cliProv.tone === 'loading' ? '…/…' : `${cliProv.ok}/${cliProv.total}`;
+                const provTitle = cliProv.tone === 'loading'
+                    ? 'CLI Providers — checking /api/cli-providers …'
+                    : `CLI Providers — ${cliProv.ok}/${cliProv.total} healthy · ${t('bus.mdFocusKind', { kind: 'cli-provider' })}`;
+                const mbCount = mbSnap.tone === 'loading' ? '…/…' : `${mbSnap.live}/${mbSnap.registered}`;
+                const mbTitle = mbSnap.tone === 'loading'
+                    ? 'Model Binding — checking …'
+                    : `Model Binding — ${mbSnap.live}/${mbSnap.registered} live · ${t('bus.mdFocusKind', { kind: 'model-binding' })}`;
+                const skillCount = skillSnap.tone === 'loading' ? '…/…' : `${skillSnap.ready}/${skillSnap.registered}`;
+                const skillTitle = skillSnap.tone === 'loading'
+                    ? 'Skill — checking …'
+                    : `Skill — ${skillSnap.ready}/${skillSnap.registered} ready · ${skillSnap.experimental} experimental · ${t('bus.mdFocusKind', { kind: 'skill' })}`;
+                const toolCount = toolSnap.tone === 'loading' ? '…/…' : `${toolSnap.ready}/${toolSnap.registered}`;
+                const toolTitle = toolSnap.tone === 'loading'
+                    ? 'Tool — checking …'
+                    : `Tool — ${toolSnap.ready}/${toolSnap.registered} ready · ${toolSnap.experimental} experimental · ${t('bus.mdFocusKind', { kind: 'tool' })}`;
+                const leds = [
+                    { kind: 'extension', label: 'PAGE', tone: pageTone, count: pageCount, title: pageTitle, aria: `Page ${pageSurfaces.mounted} of ${Math.max(pageSurfaces.mounted, pageRegistered)} panels mounted` },
+                    { kind: 'agent', label: 'AGENT', tone: agentSnap.tone, count: agentCount, title: agentTitle, aria: `Agent ${agentSnap.registered} plugins registered` },
+                    { kind: 'cli-provider', label: 'PROV', tone: cliProv.tone, count: provCount, title: provTitle, aria: `CLI Providers ${cliProv.ok} of ${cliProv.total} healthy` },
+                    { kind: 'model-binding', label: 'MB', tone: mbSnap.tone, count: mbCount, title: mbTitle, aria: `Model Binding ${mbSnap.live} of ${mbSnap.registered} live` },
+                    { kind: 'skill', label: 'SKILL', tone: skillSnap.tone, count: skillCount, title: skillTitle, aria: `Skill ${skillSnap.ready} of ${skillSnap.registered} ready` },
+                    { kind: 'tool', label: 'TOOL', tone: toolSnap.tone, count: toolCount, title: toolTitle, aria: `Tool ${toolSnap.ready} of ${toolSnap.registered} ready` },
+                ];
+                return (_jsxs("div", { className: "ba-mini-dashboard", role: "toolbar", "aria-label": "Bus kind health overview", children: [_jsx("span", { className: "ba-md-label", "aria-hidden": true, children: t('bus.healthOverview') }), leds.map((led) => {
+                            const soloed = enabledKinds !== null && enabledKinds.size === 1 && enabledKinds.has(led.kind);
+                            return (_jsxs("button", { type: "button", className: `ba-md-led ba-md-k-${led.kind} is-${led.tone}${soloed ? ' is-soloed' : ''}`, title: led.title, "aria-label": led.aria, "aria-pressed": soloed, onClick: () => {
+                                    emitDeepLink('sidebar:flash-kind', led.kind);
+                                    setEnabledKinds((prev) => prev !== null && prev.size === 1 && prev.has(led.kind)
+                                        ? null
+                                        : new Set([led.kind]));
+                                }, children: [_jsx("span", { className: "ba-md-dot", "aria-hidden": true }), _jsx("span", { className: "ba-md-kind", children: led.label }), _jsx("span", { className: "ba-md-count", children: led.count })] }, led.kind));
+                        }), (() => {
+                            // P4.40 — aggregate health summary pill at the tail of the
+                            // mini-dashboard. Counts the four tone buckets across the 6
+                            // kinds (loading / ok / warn / down) and renders `N ✓ · M ⚠ · K ✗`
+                            // with same color grammar as the LEDs. Outer ring color reflects
+                            // worst-state: any down → red, else any warn → amber, else any
+                            // loading → dim, else lime. Click → resetFilters() (clear kind
+                            // solo + clear query) so the pill doubles as a one-tap "show
+                            // everything" escape hatch when players have soloed a kind. When
+                            // all 6 are loading, hides ✓/⚠/✗ counts and shows `…` instead.
+                            //
+                            // P4.42 — prepend a `.ba-md-sum-total` cell `Σ{items.length}`
+                            // before the tone cells. Reads the total registered plugin
+                            // count straight off `items` (already in scope, same number the
+                            // panel header `Plugins {items.length}` reads), then a vertical
+                            // separator `.ba-md-sum-vsep` cleanly splits the «total» band
+                            // from the «tone bucket» band. Player gets a single hop
+                            // «Σ20 · 2·4·0 · ↺» summary in the bus dashboard head: 20
+                            // plugins total, split across 2 ok / 4 warn / 0 down kinds, ↺
+                            // to reset filters. The Σ cell uses neutral 0.72 white (same
+                            // as base pill foreground) so it doesn't compete with the
+                            // colored tone cells visually — it's a quiet «context tag»,
+                            // not a 4th tone bucket.
+                            let okN = 0, warnN = 0, downN = 0, loadingN = 0;
+                            for (const led of leds) {
+                                if (led.tone === 'ok')
+                                    okN++;
+                                else if (led.tone === 'warn')
+                                    warnN++;
+                                else if (led.tone === 'down')
+                                    downN++;
+                                else
+                                    loadingN++;
+                            }
+                            const worst = downN > 0 ? 'down' : warnN > 0 ? 'warn' : loadingN === leds.length ? 'loading' : 'ok';
+                            const hasSolo = enabledKinds !== null && enabledKinds.size < leds.length;
+                            const totalExtensions = items.length;
+                            const ariaLbl = loadingN === leds.length
+                                ? `Bus kind health — loading · ${totalExtensions} plugins total`
+                                : `Bus kind health — ${totalExtensions} plugins total · ${okN} ok, ${warnN} warn, ${downN} down of ${leds.length} kinds`;
+                            const titleStr = loadingN === leds.length
+                                ? `Σ ${totalExtensions} plugin · ${t('bus.mdSummaryLoading')}`
+                                : `Σ ${totalExtensions} plugin ${t('bus.registered')} · ${okN}/${leds.length} kind ok · ${warnN} warn · ${downN} down · ${t('bus.mdClearFilter')}`;
+                            return (_jsxs("button", { type: "button", className: `ba-md-summary is-${worst}${hasSolo ? ' has-solo' : ''}`, title: titleStr, "aria-label": ariaLbl, onClick: () => resetFilters(), children: [_jsxs("span", { className: "ba-md-sum-cell ba-md-sum-total", "aria-hidden": true, children: [_jsx("span", { className: "ba-md-sum-sigma", children: "\u03A3" }), totalExtensions] }), _jsx("span", { className: "ba-md-sum-vsep", "aria-hidden": true }), loadingN === leds.length ? (_jsx("span", { className: "ba-md-sum-loading", children: "\u2026" })) : (_jsxs(_Fragment, { children: [_jsxs("span", { className: "ba-md-sum-cell ba-md-sum-ok", "aria-hidden": true, children: [_jsx("span", { className: "ba-md-sum-dot" }), okN] }), _jsx("span", { className: "ba-md-sum-sep", "aria-hidden": true, children: "\u00B7" }), _jsxs("span", { className: "ba-md-sum-cell ba-md-sum-warn", "aria-hidden": true, children: [_jsx("span", { className: "ba-md-sum-dot" }), warnN] }), _jsx("span", { className: "ba-md-sum-sep", "aria-hidden": true, children: "\u00B7" }), _jsxs("span", { className: "ba-md-sum-cell ba-md-sum-down", "aria-hidden": true, children: [_jsx("span", { className: "ba-md-sum-dot" }), downN] })] })), _jsx("span", { className: "ba-md-sum-arrow", "aria-hidden": true, children: hasSolo ? '⤺' : '↺' })] }));
+                        })()] }));
+            })(), uiSurfaces && uiSurfaces.length > 0 && (_jsxs("div", { className: "ba-ui-surfaces", "aria-label": "UI surfaces registered with bus.ui", children: [_jsxs("div", { className: "ba-uis-head", children: [_jsx("span", { className: "ba-uis-dot", "aria-hidden": true }), _jsx("span", { className: "ba-uis-label", children: "UI Surfaces" }), _jsx("span", { className: "ba-uis-count", title: "surfaces currently registered with bus.ui", children: uiSurfaces.length }), _jsxs("span", { className: "ba-uis-sub", children: ["registered \u00B7", ' ', uiSurfaces.reduce((n, s) => n + (s.exposedToAI ? s.actions.filter((a) => a.exposedToAI !== false).length : 0), 0), ' ', "actions exposed to AI \u00B7 ", _jsx("code", { children: "/api/bus/ui/surfaces" })] })] }), _jsx("div", { className: "ba-uis-row", children: uiSurfaces.map((s) => {
+                            const aiActions = s.exposedToAI
+                                ? s.actions.filter((a) => a.exposedToAI !== false).length
+                                : 0;
+                            const totalActions = s.actions.length;
+                            return (_jsxs("div", { className: `ba-uis-chip layer-${s.layer}${s.exposedToAI ? '' : ' is-dim'}`, title: `${s.layer} surface · ${totalActions} action${totalActions === 1 ? '' : 's'} · ${aiActions} exposed to AI${s.extensionId ? ` · plugin: ${s.extensionId}` : ''}`, children: [_jsx("span", { className: "ba-uis-layer", children: s.layer }), _jsx("span", { className: "ba-uis-id", children: s.id }), _jsxs("span", { className: "ba-uis-actions", children: [_jsx("span", { className: "ba-uis-ai", children: aiActions }), _jsx("span", { className: "ba-uis-sep", children: "/" }), _jsx("span", { className: "ba-uis-total", children: totalActions }), _jsx("span", { className: "ba-uis-actions-lbl", children: "actions" })] })] }, s.id));
+                        }) })] })), _jsx(CapabilityOverview, { refreshKey: refreshTs }), !loading && items.length > 0 && (_jsxs("div", { className: "ba-filterbar", children: [_jsxs("div", { className: "ba-chips", role: "tablist", "aria-orientation": "horizontal", "aria-label": t('bus.filterByKind'), children: [_jsx("span", { className: "ba-kbd", "aria-hidden": "true", title: t('bus.kbdNavChips'), children: "\u2190\u2192" }), kindStats.map((k, i) => {
+                                const active = enabledKinds === null || enabledKinds.has(k.kind);
+                                return (_jsxs("button", { ref: (el) => {
+                                        chipRefs.current[i] = el;
+                                    }, type: "button", role: "tab", "aria-selected": active, tabIndex: i === chipFocusIdx ? 0 : -1, className: `ba-chip k-${k.kind} ${active ? 'is-on' : 'is-off'}`, onClick: () => {
+                                        setChipFocusIdx(i);
+                                        toggleKind(k.kind);
+                                    }, onKeyDown: (e) => {
+                                        const n = kindStats.length;
+                                        if (n === 0)
+                                            return;
+                                        let next = i;
+                                        if (e.key === 'ArrowRight' || e.key === 'ArrowDown') {
+                                            next = (i + 1) % n;
+                                        }
+                                        else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') {
+                                            next = (i - 1 + n) % n;
+                                        }
+                                        else if (e.key === 'Home') {
+                                            next = 0;
+                                        }
+                                        else if (e.key === 'End') {
+                                            next = n - 1;
+                                        }
+                                        else {
+                                            return;
+                                        }
+                                        e.preventDefault();
+                                        setChipFocusIdx(next);
+                                        requestAnimationFrame(() => {
+                                            chipRefs.current[next]?.focus();
+                                        });
+                                    }, title: (enabledKinds === null
+                                        ? t('bus.chipSolo', { kind: k.kind, count: k.count })
+                                        : active
+                                            ? t('bus.chipHide', { kind: k.kind })
+                                            : t('bus.chipShow', { kind: k.kind })) +
+                                        ' · ' +
+                                        t('bus.chipToggleHint'), children: [_jsx("span", { className: `ba-chip-dot is-${kindTones[k.kind] ?? 'loading'}`, "aria-hidden": "true" }), _jsx("span", { className: "ba-chip-name", children: k.kind }), _jsx("span", { className: "ba-chip-count", children: k.count })] }, k.kind));
+                            })] }), _jsx("input", { type: "text", className: "ba-search", placeholder: t('bus.searchPlaceholder'), value: query, onChange: (e) => setQuery(e.target.value), spellCheck: false }), filtered && (_jsxs("button", { type: "button", className: "ba-reset", onClick: resetFilters, title: t('bus.resetTitle'), children: ["\u2715 ", t('bus.reset')] }))] })), err && (_jsx("div", { className: "ba-error", children: t('bus.requestFailed', { err }) })), !err && !loading && items.length === 0 && (_jsx("div", { className: "ba-empty", children: t('bus.emptyNoExtensions') })), !err && !loading && items.length > 0 && groups.length === 0 && (_jsx("div", { className: "ba-empty", children: t('bus.emptyNoMatch') })), !loading && orderedRowIds.length > 0 && (_jsxs("div", { className: "ba-row-kbd-bar", "aria-hidden": "true", children: [_jsx("span", { className: "ba-kbd", title: t('bus.rowKbdTitle'), children: "\u2191\u2193" }), _jsx("span", { className: "ba-row-kbd-label", children: t('bus.rowKbdLabel', { n: orderedRowIds.length }) })] })), !loading && items.length > 0 && (_jsxs("div", { className: "ba-glyph-legend", "data-legend": "kind-alphabet", style: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    gap: 12,
+                    padding: '4px 12px 8px',
+                    fontSize: 10,
+                    fontFamily: 'var(--mono, var(--font-mono))',
+                    color: 'rgba(220,228,235,0.55)',
+                    letterSpacing: 0.4,
+                    flexWrap: 'wrap',
+                }, children: [_jsx("span", { style: {
+                            color: 'rgba(255,255,255,0.30)',
+                            fontSize: 9,
+                            textTransform: 'uppercase',
+                            letterSpacing: 0.7,
+                            fontWeight: 600,
+                        }, children: "kind glyph alphabet" }), [
+                        { g: '▦', c: 'rgba(212,255,72,0.95)', n: 'extension' },
+                        { g: '◆', c: 'rgba(196,163,255,0.95)', n: 'agent' },
+                        { g: '⌘', c: 'rgba(125,211,252,0.95)', n: 'cli-provider' },
+                        { g: '◈', c: 'rgba(123,231,196,0.95)', n: 'model-binding' },
+                        { g: '★', c: 'rgba(255,200,120,0.95)', n: 'skill' },
+                        { g: '✦', c: 'rgba(255,140,66,0.95)', n: 'tool' },
+                    ].map((e) => (_jsxs("span", { "data-kind": e.n, style: { display: 'inline-flex', alignItems: 'baseline', gap: 4 }, title: `${e.g} = ${e.n}`, children: [_jsx("span", { "aria-hidden": true, style: { color: e.c, fontWeight: 700, fontSize: 13, lineHeight: 1 }, children: e.g }), _jsx("span", { style: { color: 'rgba(220,228,235,0.78)' }, children: e.n })] }, e.n)))] })), _jsx("div", { className: "ba-groups", children: groups.map((g) => (_jsx(KindSection, { group: g, expandedIds: expandedIds, onToggle: toggleExpand, rowRefs: rowRefs, onFlashKind: (k) => emitDeepLink('sidebar:flash-kind', k), onSoloKind: (k) => setEnabledKinds(new Set([k])), focusedRowId: focusedRowId, onSetFocusedRowId: setFocusedRowId, onMoveRowFocus: moveRowFocus, cliProv: cliProv, pageSurfaces: pageSurfaces, agentSnap: agentSnap, mbSnap: mbSnap, skillSnap: skillSnap, toolSnap: toolSnap }, g.kind))) }), _jsxs("div", { className: "ba-footnote", children: [t('bus.footnoteSource'), _jsx("code", { children: "GET /api/extensions/list" }), " \u00B7 slim shape \u00B7 provides.", '{', "extension / modelBinding / skills / tools / events / cliProvider", '}', " ", t('bus.footnoteExpanded'), " \u00B7 ", t('bus.footnoteBroken'), " \u00B7", ' ', t('bus.footnoteRowHint')] })] }));
+}
+function KindSection({ group, expandedIds, onToggle, rowRefs, onFlashKind, onSoloKind, focusedRowId, onSetFocusedRowId, onMoveRowFocus, cliProv, pageSurfaces, agentSnap, mbSnap, skillSnap, toolSnap, }) {
+    const { t } = useTranslation();
+    const showProvLed = group.kind === 'cli-provider';
+    const provTitle = showProvLed
+        ? cliProv.tone === 'loading'
+            ? 'CLI Providers — checking /api/cli-providers …'
+            : cliProv.total === 0
+                ? 'CLI Providers — none registered'
+                : [
+                    `CLI Providers — ${cliProv.ok}/${cliProv.total} ok`,
+                    ...cliProv.rows.map((p) => `${p.health?.ok ? '✓' : '✗'} ${p.id}${p.health?.detail ? ' — ' + p.health.detail : ''}`),
+                ].join('\n')
+        : undefined;
+    const provDisplay = showProvLed
+        ? cliProv.tone === 'loading'
+            ? '…/…'
+            : `${cliProv.ok}/${cliProv.total} ok`
+        : '';
+    // P4.33 — extension section LED. Mirrors the cli-provider LED above but
+    // joins the polled /api/bus/ui/surfaces mountedPageIds set against the live
+    // extension plugin list (`group.items`). The total `M` is always derived
+    // from `group.items.length` so the LED count tracks live bus registry, not
+    // the snapshot taken at fetch time. Tone: ok (lime) when ≥1 wb panel is
+    // mounted, warn (amber) when 0 mounted with ≥1 registered, down (red)
+    // when the fetch failed (state.tone === 'down'), loading otherwise.
+    const showPageLed = group.items.some((item) => (item.contributes?.pages?.length ?? 0) > 0);
+    const pageTotal = showPageLed ? group.items.length : 0;
+    const pageMounted = showPageLed
+        ? group.items.reduce((n, p) => {
+            const pageId = p.contributes?.pages?.[0]?.id;
+            return pageId && pageSurfaces.mountedPageIds.has(pageId) ? n + 1 : n;
+        }, 0)
+        : 0;
+    const pageTone = !showPageLed
+        ? 'loading'
+        : pageSurfaces.tone === 'down'
+            ? 'down'
+            : pageSurfaces.tone === 'loading' && pageSurfaces.mountedPageIds.size === 0
+                ? 'loading'
+                : pageMounted >= 1
+                    ? 'ok'
+                    : pageTotal > 0
+                        ? 'warn'
+                        : 'loading';
+    const pageTitle = showPageLed
+        ? pageTone === 'loading'
+            ? 'Page — checking /api/bus/ui/surfaces …'
+            : pageTone === 'down'
+                ? 'Page — /api/bus/ui/surfaces fetch failed'
+                : [
+                    `Page — ${pageMounted}/${pageTotal} panel surfaces mounted`,
+                    ...group.items.map((p) => {
+                        const pageId = p.contributes?.pages?.[0]?.id ?? '?';
+                        const live = pageSurfaces.mountedPageIds.has(pageId);
+                        return `${live ? '✓' : '·'} ${pageId}  (${p.id})`;
+                    }),
+                ].join('\n')
+        : undefined;
+    const pageDisplay = showPageLed
+        ? pageTone === 'loading'
+            ? '…/…'
+            : `${pageMounted}/${pageTotal} mounted`
+        : '';
+    // P4.34 — agent section LED. After daemon retirement (R3), driven only by
+    // listExtensions('agent') every 10s. Tone is `agentSnap.tone` (ok-violet
+    // when ≥1 plugin registered, down-red on 0 or fetch failure).
+    const showAgentLed = group.kind === 'agent';
+    const agentTitle = showAgentLed
+        ? agentSnap.tone === 'loading'
+            ? 'Agent — checking /api/extensions/list?kind=agent …'
+            : agentSnap.tone === 'down' && agentSnap.registered === 0
+                ? 'Agent — bus fetch failed or no agent plugins registered'
+                : [
+                    `Agent — ${agentSnap.registered} plugin${agentSnap.registered === 1 ? '' : 's'} registered`,
+                    ...agentSnap.agentIds.map((id) => `✓ ${id}`),
+                ].join('\n')
+        : undefined;
+    const agentDisplay = showAgentLed
+        ? agentSnap.tone === 'loading'
+            ? '…'
+            : `${agentSnap.registered} reg`
+        : '';
+    // P4.35 — model-binding section LED. Driven by parent BusAdminPanel polling
+    // listExtensions('model-binding') + dashApi.providers() in lockstep. Tone /
+    // counts read directly from mbSnap (computed at fetch time via the
+    // vendor→provider map join). Tooltip lists each binding's vendor/channel +
+    // mapped provider + health detail so the player can see *why* a binding is
+    // warn (e.g. "anthropic→claude-code: cli not installed").
+    const showMbLed = group.kind === 'model-binding';
+    const mbTitle = showMbLed
+        ? mbSnap.tone === 'loading'
+            ? 'Model Binding — checking /api/extensions/list?kind=model-binding + /api/cli-providers …'
+            : mbSnap.tone === 'down' && mbSnap.registered === 0
+                ? 'Model Binding — none registered (or bus/cli-providers fetch failed)'
+                : [
+                    `Model Binding — ${mbSnap.registered} registered · ${mbSnap.live}/${mbSnap.registered} live`,
+                    ...mbSnap.bindings.map((b) => {
+                        const mark = b.healthy ? '✓' : b.providerId ? '·' : '?';
+                        const route = b.providerId
+                            ? `${b.vendor}→${b.providerId}`
+                            : `${b.vendor}→(unmapped)`;
+                        const tail = b.healthy
+                            ? ' [live]'
+                            : b.providerId
+                                ? ` [down${b.detail ? ' — ' + b.detail : ''}]`
+                                : ' [no provider mapping]';
+                        return `${mark} ${b.id}  (${route}/${b.channel || '?'})${tail}`;
+                    }),
+                ].join('\n')
+        : undefined;
+    const mbDisplay = showMbLed
+        ? mbSnap.tone === 'loading'
+            ? '…/…'
+            : `${mbSnap.live}/${mbSnap.registered} live`
+        : '';
+    // P4.36 — skill section LED. Single-channel poll (listExtensions('skill'))
+    // exposed via parent BusAdminPanel as skillSnap. Tooltip lists each skill
+    // plugin's id + its registered trigger(s) + a [stable]/[experimental]/
+    // [no triggers] tail so the player can see *why* a tone is warn (today
+    // typically "1 experimental" because the lone skill plugin is the
+    // make-game-design placeholder marked experimental:true) without
+    // expanding the row.
+    const showSkillLed = group.kind === 'skill';
+    const skillTitle = showSkillLed
+        ? skillSnap.tone === 'loading'
+            ? 'Skill — checking /api/extensions/list?kind=skill …'
+            : skillSnap.tone === 'down' && skillSnap.registered === 0
+                ? 'Skill — none registered (or bus fetch failed)'
+                : [
+                    `Skill — ${skillSnap.registered} registered · ${skillSnap.ready}/${skillSnap.registered} ready · ${skillSnap.experimental} experimental`,
+                    ...skillSnap.skills.map((s) => {
+                        const mark = !s.ready ? '✗' : s.experimental ? '⚠' : '✓';
+                        const trig = s.triggers.length > 0 ? s.triggers.join(' ') : '(no triggers)';
+                        const tail = !s.ready
+                            ? ' [no triggers]'
+                            : s.experimental
+                                ? ' [experimental]'
+                                : ' [stable]';
+                        return `${mark} ${s.id}  (${trig})${tail}`;
+                    }),
+                ].join('\n')
+        : undefined;
+    const skillDisplay = showSkillLed
+        ? skillSnap.tone === 'loading'
+            ? '…/…'
+            : `${skillSnap.ready}/${skillSnap.registered} ready`
+        : '';
+    // P4.37 — tool section LED. Single-channel poll exposed via parent
+    // BusAdminPanel as toolSnap. Tooltip lists each tool plugin's id, its
+    // registered tool ids (e.g. `balance:resim`), event names emitted, and a
+    // [stable]/[experimental]/[no tools] tail so the player can see *why* the
+    // tone is warn (today typically "1 experimental" because the lone tool
+    // plugin tool-balance-resim is the placeholder marked experimental:true)
+    // without expanding the row. Closes the BusAdminPanel section-LED grid
+    // at 6/6.
+    const showToolLed = group.kind === 'tool';
+    const toolTitle = showToolLed
+        ? toolSnap.tone === 'loading'
+            ? 'Tool — checking /api/extensions/list?kind=tool …'
+            : toolSnap.tone === 'down' && toolSnap.registered === 0
+                ? 'Tool — none registered (or bus fetch failed)'
+                : [
+                    `Tool — ${toolSnap.registered} registered · ${toolSnap.ready}/${toolSnap.registered} ready · ${toolSnap.exposedAi} AI-exposed · ${toolSnap.experimental} experimental`,
+                    ...toolSnap.tools.map((t) => {
+                        const mark = !t.ready ? '✗' : t.experimental ? '⚠' : '✓';
+                        const ids = t.toolIds.length > 0 ? t.toolIds.join(' ') : '(no tools)';
+                        const evtTail = t.eventNames.length > 0 ? ` · emits: ${t.eventNames.join(' ')}` : '';
+                        const tail = !t.ready
+                            ? ' [no tools]'
+                            : t.experimental
+                                ? ' [experimental]'
+                                : ' [stable]';
+                        return `${mark} ${t.id}  (${ids})${evtTail}${tail}`;
+                    }),
+                ].join('\n')
+        : undefined;
+    const toolDisplay = showToolLed
+        ? toolSnap.tone === 'loading'
+            ? '…/…'
+            : `${toolSnap.ready}/${toolSnap.registered} ready`
+        : '';
+    return (_jsxs("section", { className: "ba-kind", children: [_jsxs("header", { className: "ba-kind-head", children: [_jsx("button", { type: "button", className: `ba-kind-tag k-${group.kind} is-link`, onClick: () => onFlashKind(group.kind), title: t('bus.kindTagFlashTitle', { kind: group.kind }), children: group.kind }), _jsx("span", { className: "ba-kind-count", children: group.items.length }), showProvLed && (_jsxs("span", { className: `ba-kind-prov-led is-${cliProv.tone}`, title: provTitle, "aria-label": `CLI Providers ${cliProv.ok} of ${cliProv.total} ok`, children: [_jsx("span", { className: "ba-kind-prov-dot", "aria-hidden": true }), _jsx("span", { className: "ba-kind-prov-count", children: provDisplay })] })), showPageLed && (_jsxs("span", { className: `ba-kind-page-led is-${pageTone}`, title: pageTitle, "aria-label": `Page panels ${pageMounted} of ${pageTotal} mounted`, children: [_jsx("span", { className: "ba-kind-page-dot", "aria-hidden": true }), _jsx("span", { className: "ba-kind-page-count", children: pageDisplay })] })), showAgentLed && (_jsxs("span", { className: `ba-kind-agent-led is-${agentSnap.tone}`, title: agentTitle, "aria-label": `Agent — ${agentSnap.registered} plugin${agentSnap.registered === 1 ? '' : 's'} registered`, children: [_jsx("span", { className: "ba-kind-agent-dot", "aria-hidden": true }), _jsx("span", { className: "ba-kind-agent-count", children: agentDisplay })] })), showMbLed && (_jsxs("span", { className: `ba-kind-mb-led is-${mbSnap.tone}`, title: mbTitle, "aria-label": `Model Binding — ${mbSnap.live} of ${mbSnap.registered} bindings live`, children: [_jsx("span", { className: "ba-kind-mb-dot", "aria-hidden": true }), _jsx("span", { className: "ba-kind-mb-count", children: mbDisplay })] })), showSkillLed && (_jsxs("span", { className: `ba-kind-skill-led is-${skillSnap.tone}`, title: skillTitle, "aria-label": `Skill — ${skillSnap.ready} of ${skillSnap.registered} ready, ${skillSnap.experimental} experimental`, children: [_jsx("span", { className: "ba-kind-skill-dot", "aria-hidden": true }), _jsx("span", { className: "ba-kind-skill-count", children: skillDisplay })] })), showToolLed && (_jsxs("span", { className: `ba-kind-tool-led is-${toolSnap.tone}`, title: toolTitle, "aria-label": `Tool — ${toolSnap.ready} of ${toolSnap.registered} ready, ${toolSnap.exposedAi} AI-exposed, ${toolSnap.experimental} experimental`, children: [_jsx("span", { className: "ba-kind-tool-dot", "aria-hidden": true }), _jsx("span", { className: "ba-kind-tool-count", children: toolDisplay })] })), _jsx("span", { className: "ba-kind-desc", children: kindDescription(group.kind, t) })] }), group.kind === 'cli-provider' && _jsx(CliCapabilityMatrix, { items: group.items }), _jsxs("table", { className: "ba-table", children: [_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { className: "c-chev", "aria-label": t('bus.expand') }), _jsx("th", { className: "c-id", children: "id" }), _jsx("th", { className: "c-name", children: "displayName.zh" }), _jsxs("th", { className: "c-ver", children: ["version", _jsxs("span", { className: "ba-th-sub", title: t('bus.versionThSub'), "aria-hidden": true, children: ["0.0.x \u00B7 placeholder \u2194 0.1+ \u00B7 ", _jsx("em", { children: "bumped" })] })] }), _jsx("th", { className: "c-page", children: "extension" }), _jsx("th", { className: "c-flags", children: "flags" })] }) }), _jsx("tbody", { children: group.items.map((p) => (_jsx(ExtensionRow, { p: p, expanded: expandedIds.has(p.id), onToggle: onToggle, rowRefs: rowRefs, focused: focusedRowId === p.id, onSetFocusedRowId: onSetFocusedRowId, onMoveRowFocus: onMoveRowFocus, onSoloKind: onSoloKind }, p.id))) })] })] }));
+}
+function ExtensionRow({ p, expanded, onToggle, rowRefs, focused, onSetFocusedRowId, onMoveRowFocus, onSoloKind, }) {
+    const { t } = useTranslation();
+    // Agent 行用统一命名「中文职能·英文名」；其它插件仍用 displayName。
+    const nameZh = p.naming?.title || pickLang(p.displayName, 'zh', p.id);
+    const descZh = pickLang(p.description, 'zh', '');
+    const descEn = pickLang(p.description, 'en', '');
+    const page = p.contributes?.pages?.[0];
+    // P4.63 — lift the P4.62 cell-level verBumped derivation to row scope so the
+    // bumped purple language can be expressed at row depth too (whole-row tint +
+    // left frame edge), giving Page tile-frame parity inside Bus admin.
+    const ver = p.version ?? '0.0.0';
+    const verBumped = !/^0\.0\./.test(ver);
+    const handleClick = () => {
+        // P3.58 — mouse click syncs the keyboard focus head so Tab-back into the
+        // table later lands on the row the player last interacted with.
+        onSetFocusedRowId(p.id);
+        onToggle(p.id);
+    };
+    const rowClass = [
+        p.experimental ? 'is-experimental' : '',
+        expanded ? 'is-expanded' : '',
+        verBumped ? 'is-bumped' : '',
+        'is-clickable',
+    ]
+        .filter(Boolean)
+        .join(' ');
+    const setRowRef = (el) => {
+        if (el)
+            rowRefs.current.set(p.id, el);
+        else
+            rowRefs.current.delete(p.id);
+    };
+    return (_jsxs(_Fragment, { children: [_jsxs("tr", { ref: setRowRef, className: rowClass, onClick: handleClick, role: "button", "aria-expanded": expanded, tabIndex: focused ? 0 : -1, onKeyDown: (e) => {
+                    if (e.key === 'ArrowUp' ||
+                        e.key === 'ArrowDown' ||
+                        e.key === 'ArrowLeft' ||
+                        e.key === 'ArrowRight' ||
+                        e.key === 'Home' ||
+                        e.key === 'End') {
+                        e.preventDefault();
+                        onMoveRowFocus(p.id, e.key);
+                    }
+                    else if (e.key === 'Enter' || e.key === ' ') {
+                        e.preventDefault();
+                        onToggle(p.id);
+                    }
+                }, title: expanded ? t('bus.rowTitleCollapse') : t('bus.rowTitleExpand'), children: [_jsx("td", { className: "c-chev", children: _jsx("span", { className: `ba-chev ${expanded ? 'is-open' : ''}`, "aria-hidden": true, children: expanded ? '▾' : '▸' }) }), _jsx("td", { className: "c-id", children: _jsx("code", { children: p.id }) }), _jsxs("td", { className: "c-name", children: [_jsx("div", { className: "ba-name-zh", children: nameZh }), descZh && (_jsx("div", { className: "ba-desc-zh", title: descZh, children: descZh }))] }), _jsx("td", { className: "c-ver", children: verBumped ? (_jsx("span", { className: "ba-ver-pill bumped", title: t('bus.verBumpedTitle', { ver }), "aria-label": `${ver} bumped`, children: ver })) : (_jsx("span", { className: "ba-ver-pill", children: ver })) }), _jsx("td", { className: "c-page", children: page ? (_jsxs("div", { className: "ba-page-info", children: [_jsx("span", { className: "ba-page-icon", children: page.icon ?? '·' }), _jsx("span", { className: "ba-page-id", children: page.id }), _jsx("span", { className: "ba-page-pill", children: page.cardinality })] })) : (_jsx("span", { className: "ba-dim", children: "\u2014" })) }), _jsx("td", { className: "c-flags", children: p.experimental && _jsx("span", { className: "ba-flag-pill exp", children: "experimental" }) })] }), expanded && (_jsx("tr", { className: "ba-detail-row", children: _jsx("td", { colSpan: 6, children: _jsx(ExtensionDetail, { p: p, descZh: descZh, descEn: descEn, onSoloKind: onSoloKind }) }) }))] }));
+}
+function ExtensionDetail({ p, descZh, descEn, onSoloKind, }) {
+    const { t } = useTranslation();
+    const page = p.contributes?.pages?.[0];
+    // P3.33 — reverse deep-link wiring. kind=agent rows offer "← 在 Sidebar 高亮"
+    // (sets store.pendingSidebarFocusExtensionId → AgentsPanel scrolls + flashes the
+    // matching card). kind=extension rows offer "← 打开 extension-* tab" (setMode
+    // Page rows open the extension-owned Page through the shell port.
+    // Together with P3.32's forward AgentsPanel pill + P2.7f's extension-tab "在 Bus
+    // 详情查看 →" button, this completes the Sidebar ⇄ Bus admin round-trip.
+    // R5/P2 — reverse deep-links now emit bus intents (their consumers —
+    // AgentsPanel scroll / Sidebar kind-flash — were lost in R4 and are re-added
+    // in P4/P6 in the right app; publishing is harmless while unsubscribed).
+    const onBackToSidebar = () => {
+        emitDeepLink('sidebar:focus-plugin', p.id);
+        // Stay on the bus tab — Sidebar is always visible. Player sees flash in
+        // the Sidebar without losing the BusAdminPanel context they came from.
+    };
+    const onOpenPage = () => {
+        void openExtensionPage(p.id);
+    };
+    const onFlashKindFooter = () => {
+        emitDeepLink('sidebar:flash-kind', p.kind);
+        // Stay on bus tab — Sidebar BUS KINDS footer is always rendered, so the
+        // 1.5s pulse is visible in the player's peripheral vision (left edge).
+    };
+    const hasAgentLink = p.kind === 'agent';
+    const hasPageLink = (p.contributes?.pages?.length ?? 0) > 0;
+    const hasKindLink = !hasAgentLink && !hasPageLink;
+    // Runtime origin descriptor: npm package identity or a browser-safe mutable
+    // origin path. Never synthesize a Marketplace implementation path from id.
+    const manifestHint = extensionManifestSourceLabel(p);
+    const extensionRootHint = manifestHint.replace(/\/forgeax-extension\.json$/, '');
+    // P4.95 — manifest hint pill becomes click-to-copy. Parallel move to P4.94
+    // (entry.frontend lime pill → deep-link button): the cyan manifest path was
+    // information-only for 4 weeks; now one click copies it to the clipboard so
+    // the player can paste it into a terminal / editor without retyping. A
+    // transient "✓ 已复制" hint span fades in for ~1.4s right after click as
+    // tactile confirmation, then fades back to invisible (display:none would
+    // jolt the grid; opacity transition keeps the cell layout stable).
+    const [copiedAt, setCopiedAt] = useState(null);
+    // P4.97 — version cell joins manifest as click-to-copy. Separate state slot
+    // so the manifest copy flash and the version copy flash don't accidentally
+    // sympathy-trigger each other when player clicks both in quick succession;
+    // each cell has its own ✓ 已复制 hint.
+    const [versionCopiedAt, setVersionCopiedAt] = useState(null);
+    const copiedResetTaskRef = useRef(null);
+    const versionCopiedResetTaskRef = useRef(null);
+    useEffect(() => {
+        const copiedTask = createRestartableTimeoutTaskLifecycle({
+            delayMs: 1400,
+            task: () => setCopiedAt(null),
+        });
+        const versionCopiedTask = createRestartableTimeoutTaskLifecycle({
+            delayMs: 1400,
+            task: () => setVersionCopiedAt(null),
+        });
+        copiedResetTaskRef.current = copiedTask;
+        versionCopiedResetTaskRef.current = versionCopiedTask;
+        return () => {
+            copiedResetTaskRef.current = null;
+            versionCopiedResetTaskRef.current = null;
+            copiedTask.dispose();
+            versionCopiedTask.dispose();
+        };
+    }, []);
+    const copyToClipboard = (text, onDone) => {
+        try {
+            if (navigator.clipboard?.writeText) {
+                navigator.clipboard.writeText(text).then(onDone).catch(onDone);
+            }
+            else {
+                const ta = document.createElement('textarea');
+                ta.value = text;
+                ta.style.position = 'fixed';
+                ta.style.opacity = '0';
+                document.body.appendChild(ta);
+                ta.select();
+                try {
+                    document.execCommand('copy');
+                }
+                catch { }
+                document.body.removeChild(ta);
+                onDone();
+            }
+        }
+        catch {
+            onDone();
+        }
+    };
+    const onCopyManifest = (e) => {
+        e.stopPropagation();
+        copyToClipboard(manifestHint, () => {
+            setCopiedAt(Date.now());
+            copiedResetTaskRef.current?.schedule();
+        });
+    };
+    const onCopyVersion = (e) => {
+        e.stopPropagation();
+        copyToClipboard(p.version ?? '0.0.0', () => {
+            setVersionCopiedAt(Date.now());
+            versionCopiedResetTaskRef.current?.schedule();
+        });
+    };
+    const copyFlashOn = copiedAt !== null;
+    const versionCopyFlashOn = versionCopiedAt !== null;
+    return (_jsxs("div", { className: "ba-detail", children: [descZh && (_jsxs("div", { className: "ba-detail-block", children: [_jsx("div", { className: "ba-detail-label", children: "description.zh" }), _jsx("div", { className: "ba-detail-body", children: descZh })] })), descEn && (_jsxs("div", { className: "ba-detail-block", children: [_jsx("div", { className: "ba-detail-label", children: "description.en" }), _jsx("div", { className: "ba-detail-body ba-detail-en", children: descEn })] })), _jsxs("div", { className: "ba-detail-grid", children: [_jsxs("div", { className: "ba-detail-cell", children: [_jsxs("div", { className: "ba-detail-label", children: ["manifest", _jsxs("span", { className: `ba-detail-copy-flash${copyFlashOn ? ' on' : ''}`, "aria-live": "polite", children: ["\u2713 ", t('bus.copied')] })] }), _jsx("button", { type: "button", className: `ba-detail-code ba-detail-manifest-link${copyFlashOn ? ' copied' : ''}`, onClick: onCopyManifest, title: copyFlashOn ? t('bus.manifestCopiedTitle') : t('bus.manifestCopyTitle'), children: manifestHint })] }), _jsxs("div", { className: "ba-detail-cell", children: [_jsx("div", { className: "ba-detail-label", children: "kind" }), _jsx("button", { type: "button", className: `ba-kind-tag k-${p.kind} is-link ba-detail-kind-link`, onClick: (e) => {
+                                    e.stopPropagation();
+                                    onSoloKind(p.kind);
+                                }, title: t('bus.detailKindSoloTitle', { kind: p.kind }), "aria-label": `solo filter kind ${p.kind}`, children: p.kind })] }), _jsxs("div", { className: "ba-detail-cell", children: [_jsxs("div", { className: "ba-detail-label", children: ["version", _jsxs("span", { className: `ba-detail-copy-flash${versionCopyFlashOn ? ' on' : ''}`, "aria-live": "polite", children: ["\u2713 ", t('bus.copied')] })] }), _jsx("button", { type: "button", className: `ba-detail-code ba-detail-version-link${versionCopyFlashOn ? ' copied' : ''}`, onClick: onCopyVersion, title: versionCopyFlashOn ? t('bus.versionCopiedTitle') : t('bus.versionCopyTitle'), children: p.version })] }), p.entry?.frontend && (_jsxs("div", { className: "ba-detail-cell", children: [_jsx("div", { className: "ba-detail-label", title: t('bus.uiFrontendTitle'), children: "ui (frontend)" }), page ? (_jsx("button", { type: "button", className: "ba-detail-code ba-detail-entry ba-detail-entry-link", onClick: (e) => { e.stopPropagation(); onOpenPage(); }, title: t('bus.entryOpenPageTitle', { pageId: page.id, path: `${extensionRootHint}/${p.entry.frontend.replace(/^\.\//, '')}` }), children: p.entry.frontend })) : (_jsx("code", { className: "ba-detail-code ba-detail-entry", title: `${extensionRootHint}/${p.entry.frontend.replace(/^\.\//, '')}`, children: p.entry.frontend }))] })), page && (_jsxs("div", { className: "ba-detail-cell ba-detail-cell-wide", children: [_jsx("div", { className: "ba-detail-label", children: "page contribution" }), _jsxs("div", { className: "ba-page-info", children: [_jsx("span", { className: "ba-page-icon", children: page.icon ?? '·' }), _jsx("code", { className: "ba-detail-code", children: page.id }), _jsx("span", { className: "ba-page-pill", children: page.cardinality })] })] }))] }), _jsx(ProvidesDetail, { p: p }), _jsxs("div", { className: "ba-backlinks", children: [hasAgentLink && (_jsxs("button", { type: "button", className: "ba-backlink ba-backlink-agent", onClick: onBackToSidebar, title: t('bus.backlinkAgentTitle', { id: p.id }), children: ["\u2190 ", t('bus.backlinkAgent')] })), hasPageLink && (_jsxs("button", { type: "button", className: "ba-backlink ba-backlink-page", onClick: onOpenPage, title: t('bus.backlinkPageTitle', { pageId: page?.id ?? p.id }), children: ["\u2190 ", t('bus.backlinkPage')] })), hasKindLink && (_jsxs("button", { type: "button", className: `ba-backlink ba-backlink-kind k-${p.kind}`, onClick: onFlashKindFooter, title: t('bus.backlinkKindTitle', { kind: p.kind }), children: [_jsx("span", { className: "ba-backlink-kind-dot", "aria-hidden": true, children: "\u25CF" }), "\u2190 ", t('bus.backlinkKind'), " \u00B7 ", p.kind] }))] }), _jsx("div", { className: "ba-detail-note", children: t('bus.detailNoteBroken') })] }));
+}
+// P2.6g — render the slim provides.{skills,tools,events,cliProvider} subsets
+// the server projects (file paths + runner cmd/args + httpAdapter.auth all
+// stripped). Returns null when the plugin advertises none of these — keeps
+// the detail row visually identical for plugins where only extension /
+// modelBinding apply (those have their own dedicated cells / strips upstream).
+function ProvidesDetail({ p }) {
+    const { t } = useTranslation();
+    const cp = p.cliProvider;
+    const skills = p.skills ?? [];
+    const tools = p.tools ?? [];
+    const events = p.events ?? [];
+    const cliCount = cp ? 1 : 0;
+    const tally = [
+        { kind: 'cli-provider', label: 'cli', count: cliCount, aiTitle: t('bus.tallyCliTitle') },
+        { kind: 'skill', label: 'skill', count: skills.length, aiTitle: t('bus.tallySkillTitle') },
+        { kind: 'tool', label: 'tool', count: tools.length, aiTitle: t('bus.tallyToolTitle') },
+        { kind: 'event', label: 'event', count: events.length, aiTitle: t('bus.tallyEventTitle') },
+    ];
+    const totalProvides = cliCount + skills.length + tools.length + events.length;
+    return (_jsxs("div", { className: "ba-provides", children: [_jsx("div", { className: "ba-provides-label", children: "provides" }), _jsxs("div", { className: "ba-provides-body", children: [_jsxs("div", { className: `ba-prov-tally${totalProvides === 0 ? ' empty' : ''}`, title: totalProvides === 0
+                            ? t('bus.provTallyEmptyTitle')
+                            : t('bus.provTallyTitle', { n: totalProvides }), children: [tally.map((t) => (_jsxs("span", { className: `ba-prov-tally-pill k-${t.kind}${t.count === 0 ? ' dim' : ''}`, title: t.aiTitle, children: [_jsx("span", { className: "ba-prov-tally-label", children: t.label }), _jsx("b", { className: "ba-prov-tally-count", children: t.count })] }, t.kind))), totalProvides === 0 && (_jsx("span", { className: "ba-prov-tally-note", children: t('bus.provTallyNote') }))] }), cp && (_jsxs("div", { className: "ba-prov-block ba-prov-cli", children: [_jsxs("div", { className: "ba-prov-head", children: [_jsx("span", { className: "ba-prov-tag k-cli-provider", children: "cliProvider" }), _jsx("code", { className: "ba-prov-id", children: cp.id }), _jsx("span", { className: "ba-prov-display", children: cp.displayName })] }), cp.models && cp.models.length > 0 && (_jsxs("div", { className: "ba-prov-row", children: [_jsx("span", { className: "ba-prov-rowlabel", children: "models" }), _jsx("div", { className: "ba-prov-pills", children: cp.models.map((m) => (_jsx("code", { className: "ba-prov-pill ba-prov-model", children: m }, m))) })] })), _jsxs("div", { className: "ba-prov-row", children: [_jsx("span", { className: "ba-prov-rowlabel", children: "capabilities" }), _jsx("div", { className: "ba-prov-pills", children: capabilityChips(cp.capabilities) })] })] })), skills.length > 0 && (_jsxs("div", { className: "ba-prov-block ba-prov-skills", children: [_jsxs("div", { className: "ba-prov-head", children: [_jsx("span", { className: "ba-prov-tag k-skill", children: "skills" }), _jsx("span", { className: "ba-prov-count", children: skills.length })] }), _jsx("ul", { className: "ba-prov-list", children: skills.map((s) => (_jsxs("li", { children: [_jsx("code", { className: "ba-prov-pill ba-prov-skill-id", children: s.id }), _jsx("span", { className: "ba-prov-sep", children: "\u00B7" }), _jsx("code", { className: "ba-prov-pill ba-prov-trigger", children: s.trigger })] }, s.id))) })] })), tools.length > 0 && (_jsxs("div", { className: "ba-prov-block ba-prov-tools", children: [_jsxs("div", { className: "ba-prov-head", children: [_jsx("span", { className: "ba-prov-tag k-tool", children: "tools" }), _jsx("span", { className: "ba-prov-count", children: tools.length })] }), _jsx("ul", { className: "ba-prov-list", children: tools.map((tool) => (_jsxs("li", { children: [_jsx("code", { className: "ba-prov-pill ba-prov-tool-id", children: tool.id }), tool.exposedToAI && (_jsx("span", { className: "ba-prov-flag", title: t('bus.provAiFlagTitle'), children: "AI" }))] }, tool.id))) })] })), events.length > 0 && (_jsxs("div", { className: "ba-prov-block ba-prov-events", children: [_jsxs("div", { className: "ba-prov-head", children: [_jsx("span", { className: "ba-prov-tag k-event", children: "events" }), _jsx("span", { className: "ba-prov-count", children: events.length })] }), _jsx("ul", { className: "ba-prov-list", children: events.map((e) => (_jsx("li", { children: _jsx("code", { className: "ba-prov-pill ba-prov-event-name", children: e.name }) }, e.name))) })] }))] })] }));
+}
+function capabilityChips(caps) {
+    // 5 fixed keys per CliProviderCapability.capabilities in
+    // packages/server/src/bus/types/registry.ts — pre-rendered in a stable order
+    // so the player can compare two cli-providers row-by-row.
+    const order = [
+        'streaming',
+        'thinking',
+        'toolCalls',
+        'subAgents',
+        'sessions',
+    ];
+    return order.map((k) => (_jsxs("span", { className: `ba-prov-cap ${caps[k] ? 'is-on' : 'is-off'}`, title: caps[k] ? `${k}=true` : `${k}=false`, children: [_jsx("span", { className: "ba-prov-cap-dot", "aria-hidden": true, children: caps[k] ? '●' : '○' }), k] }, k)));
+}
+// P3.21 — 5 capability keys, stable order matches the order in ProvidesDetail
+// `capabilityChips()` above so a player who learns the column order in either
+// surface reads the other at a glance. Short labels keep the compact matrix
+// dense (each cell ~26px tall) — full title in tooltip.
+const CLI_CAP_KEYS = ['streaming', 'thinking', 'toolCalls', 'subAgents', 'sessions'];
+const CLI_CAP_SHORT = {
+    streaming: 'stream',
+    thinking: 'think',
+    toolCalls: 'tools',
+    subAgents: 'sub-ag',
+    sessions: 'sess',
+};
+function CliCapabilityMatrix({ items }) {
+    // Defensive: only rows that actually expose cliProvider make it into the
+    // matrix. Server never emits cli-provider kind without cliProvider, but the
+    // filter keeps the matrix correct if that ever drifts.
+    const rows = items.filter((p) => !!p.cliProvider);
+    if (rows.length === 0)
+        return null;
+    const colTotals = CLI_CAP_KEYS.map((k) => rows.filter((r) => r.cliProvider.capabilities[k]).length);
+    const totalCells = rows.length * CLI_CAP_KEYS.length;
+    const onCells = colTotals.reduce((a, b) => a + b, 0);
+    const fullCoverage = onCells === totalCells;
+    const coveragePct = totalCells === 0 ? 0 : Math.round((onCells / totalCells) * 100);
+    return (_jsxs("div", { className: "ba-cli-matrix", children: [_jsxs("div", { className: "ba-cli-matrix-head", children: [_jsx("span", { className: "ba-cli-matrix-label", children: "capability matrix" }), _jsxs("span", { className: "ba-cli-matrix-meta", children: [rows.length, " cli \u00B7 ", CLI_CAP_KEYS.length, " cap"] })] }), _jsxs("table", { className: "ba-cli-matrix-table", children: [_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { className: "ba-cli-matrix-corner", "aria-label": "cli provider name" }), CLI_CAP_KEYS.map((k, i) => {
+                                    const total = colTotals[i];
+                                    const full = total === rows.length;
+                                    return (_jsxs("th", { className: "ba-cli-matrix-th", title: k, children: [_jsx("span", { className: "ba-cli-matrix-th-name", children: CLI_CAP_SHORT[k] }), _jsxs("span", { className: `ba-cli-matrix-coverage ${full ? 'is-full' : 'is-partial'}`, title: `${total} / ${rows.length} cli support ${k}`, children: [total, "/", rows.length] })] }, k));
+                                })] }) }), _jsx("tbody", { children: rows.map((p) => {
+                            const cp = p.cliProvider;
+                            const dn = pickLang(p.displayName, 'zh', cp.displayName);
+                            return (_jsxs("tr", { children: [_jsxs("td", { className: "ba-cli-matrix-rowname", children: [_jsx("span", { className: "ba-cli-matrix-rowname-zh", children: dn }), _jsx("code", { className: "ba-cli-matrix-rowname-id", title: p.id, children: shortCliId(p.id) })] }), CLI_CAP_KEYS.map((k) => {
+                                        const on = cp.capabilities[k];
+                                        return (_jsx("td", { className: `ba-cli-matrix-cell ${on ? 'is-on' : 'is-off'}`, title: `${dn} · ${k} = ${on}`, children: _jsx("span", { className: "ba-cli-matrix-dot", "aria-hidden": true, children: on ? '●' : '○' }) }, k));
+                                    })] }, p.id));
+                        }) })] }), _jsxs("div", { className: `ba-cli-matrix-summary ${fullCoverage ? 'is-full' : 'is-partial'}`, title: `${onCells} of ${totalCells} capability cells active`, children: [_jsx("span", { className: "ba-cli-matrix-summary-dot", "aria-hidden": true, children: fullCoverage ? '●' : '◐' }), _jsx("span", { className: "ba-cli-matrix-summary-text", children: fullCoverage
+                            ? `${rows.length} cli × ${CLI_CAP_KEYS.length} cap · 100% coverage`
+                            : `${onCells} / ${totalCells} cap on · ${coveragePct}% coverage` })] })] }));
+}
+// Strip @forgeax-plugin/cli- prefix so row labels stay narrow (one of
+// "claude-code" / "codex" / "cursor-agent" / "forgeax") and the dense matrix
+// can fit on a typical viewport without truncation.
+function shortCliId(id) {
+    return id.replace(/^@forgeax-plugin\/cli-/, '').replace(/^@forgeax-plugin\//, '');
+}
+function kindDescription(kind, t) {
+    switch (kind) {
+        case 'extension':
+            return t('bus.kindDescExtension');
+        case 'agent':
+            return t('bus.kindDescAgent');
+        case 'cli-provider':
+            return t('bus.kindDescCliProvider');
+        case 'model-binding':
+            return t('bus.kindDescModelBinding');
+        case 'skill':
+            return t('bus.kindDescSkill');
+        case 'tool':
+            return t('bus.kindDescTool');
+        default:
+            return t('bus.kindDescUnknown');
+    }
+}