@khorsheed/dsh-room 0.2.2 → 0.2.3

package/lib/types/client/RemoveMemberConfirm.js

@@ -0,0 +1,85 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The in-card removal confirmation: replaces the browser's native confirm
+ * with a layer anchored on the member's own card that states what removing
+ * THIS member will actually do — stop its running round, cancel its queued
+ * messages, tell whoever waits for its
+ * report — and then does exactly that (RoomService.removeMember). An idle
+ * member with nothing pending gets one sentence. The current coordinator
+ * cannot be removed: the layer says why and how instead of offering a
+ * button that would only fail. Esc and an outside click cancel; focus opens
+ * on 取消 so a stray Enter never removes anyone.
+ */
+import { useEffect, useRef, useState } from 'react';
+import css from './RemoveMemberConfirm.module.css';
+/**
+ * Read a removal's consequences from the room state the members tab holds.
+ * @param state - the replayed room state.
+ * @param member - the member about to be removed.
+ * @returns the impact summary.
+ */
+export function removalImpact(state, member) {
+    const run = state.runs.find(entry => entry.member === member.name && entry.state === 'running');
+    const id = member.id;
+    const open = (state.deliveries ?? []).filter(row => row.memberId === id && (row.status === 'queued' || row.status === 'running'));
+    const coordinator = state.coordinator === undefined
+        ? state.members.find(entry => entry.kind === 'main-agent')
+        : state.members.find(entry => entry.id === state.coordinator.memberId);
+    const waiting = new Set();
+    for (const row of open) {
+        const target = row.plan !== undefined ? coordinator : state.members.find(entry => entry.id !== undefined && entry.id === row.replyTo);
+        if (target !== undefined && target.name !== member.name)
+            waiting.add(target.name);
+    }
+    const current = open.find(row => row.status === 'running' && (run?.runId === undefined || row.id === run.runId));
+    return {
+        running: run === undefined ? undefined : (current?.text.trim().split('\n', 1)[0] ?? '').slice(0, 60),
+        queued: open.filter(row => row.status === 'queued').length,
+        waiting: [...waiting],
+    };
+}
+/** The confirmation layer. */
+export function RemoveMemberConfirm({ member, impact, coordinator, onConfirm, onCancel, t, }) {
+    const ref = useRef(null);
+    const [busy, setBusy] = useState(false);
+    useEffect(() => {
+        const onKey = (event) => { if (event.key === 'Escape')
+            onCancel(); };
+        const onDown = (event) => {
+            if (ref.current !== null && !ref.current.contains(event.target))
+                onCancel();
+        };
+        document.addEventListener('keydown', onKey);
+        document.addEventListener('mousedown', onDown);
+        return () => {
+            document.removeEventListener('keydown', onKey);
+            document.removeEventListener('mousedown', onDown);
+        };
+    }, [onCancel]);
+    const title = t('remove.title', { member: member.name });
+    if (coordinator) {
+        return (_jsxs("div", { ref: ref, className: css.layer, role: "dialog", "aria-label": title, children: [_jsx("p", { className: css.title, children: title }), _jsx("p", { className: css.body, children: t('remove.coordinator') }), _jsx("div", { className: css.actions, children: _jsx("button", { type: "button", className: css.secondary, autoFocus: true, onClick: onCancel, children: t('remove.ok') }) })] }));
+    }
+    const lines = [];
+    if (impact.running !== undefined) {
+        lines.push(impact.running === '' ? t('remove.running') : t('remove.runningTask', { task: impact.running }));
+    }
+    if (impact.queued > 0)
+        lines.push(t('remove.queued', { count: impact.queued }));
+    if (impact.waiting.length > 0)
+        lines.push(t('remove.waiting', { members: impact.waiting.join('、') }));
+    const confirm = async () => {
+        if (busy)
+            return;
+        setBusy(true);
+        try {
+            await onConfirm();
+        }
+        finally {
+            setBusy(false);
+        }
+    };
+    return (_jsxs("div", { ref: ref, className: css.layer, role: "dialog", "aria-label": title, children: [_jsx("p", { className: css.title, children: title }), lines.length === 0
+                ? _jsx("p", { className: css.body, children: t('remove.idle') })
+                : _jsx("ul", { className: css.list, children: lines.map((line, index) => _jsx("li", { children: line }, index)) }), _jsx("p", { className: css.note, children: t('remove.keep') }), _jsxs("div", { className: css.actions, children: [_jsx("button", { type: "button", className: css.secondary, autoFocus: true, onClick: onCancel, children: t('remove.cancel') }), _jsx("button", { type: "button", className: css.danger, disabled: busy, onClick: () => { void confirm(); }, children: impact.running !== undefined ? t('remove.stopAndRemove') : t('remove.confirm') })] })] }));
+}

package/lib/types/client/RoomApprovalView.d.ts

@@ -0,0 +1,11 @@
+/**
+ * A member's tool approval ('room-approval' keyed renderer): one line in the
+ * room's conversation — 「⚠ coco 要你确认：调用 video_render」 with the reason
+ * — and [允许一次] [拒绝] while it waits. The answer folds in place through the
+ * journal (allowed / rejected / cancelled when the call ended first).
+ */
+import { type ReactNode } from 'react';
+import type { RoomApprovalViewProps } from './slots.ts';
+/** The approval line. */
+export declare function RoomApprovalView({ node, answerApproval, t }: RoomApprovalViewProps): ReactNode;
+//# sourceMappingURL=RoomApprovalView.d.ts.map

package/lib/types/client/RoomApprovalView.js

@@ -0,0 +1,28 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * A member's tool approval ('room-approval' keyed renderer): one line in the
+ * room's conversation — 「⚠ coco 要你确认：调用 video_render」 with the reason
+ * — and [允许一次] [拒绝] while it waits. The answer folds in place through the
+ * journal (allowed / rejected / cancelled when the call ended first).
+ */
+import { useState } from 'react';
+import css from './RoomRelayView.module.css';
+/** The approval line. */
+export function RoomApprovalView({ node, answerApproval, t }) {
+    const data = node.data;
+    const [busy, setBusy] = useState(false);
+    const [error, setError] = useState(undefined);
+    const answer = async (outcome) => {
+        if (busy)
+            return;
+        setBusy(true);
+        try {
+            setError(await answerApproval(data.approvalId, outcome));
+        }
+        finally {
+            setBusy(false);
+        }
+    };
+    const pending = data.state === 'pending';
+    return (_jsxs("div", { className: css.row, "data-state": pending ? 'pending' : 'resolved', children: [_jsxs("span", { className: css.text, children: [t('approval.line', { member: data.member, tool: data.tool }), data.reason === undefined ? '' : `（${data.reason}）`, pending ? '' : ` ${t(`approval.state.${data.state}`)}`, error === undefined ? '' : ` ${error}`] }), pending && (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", className: css.action, disabled: busy, onClick: () => { void answer('allowed-once'); }, children: t('approval.allow') }), _jsx("button", { type: "button", className: css.action, disabled: busy, onClick: () => { void answer('rejected'); }, children: t('approval.reject') })] }))] }));
+}

package/lib/types/client/RoomComposer.d.ts

@@ -17,5 +17,5 @@ import type { RoomComposerMatch, RoomComposerProps } from './slots.ts';
  */
 export declare function selectRoomComposer(owner: ComposerChainProps, isRoomCached: (sessionId: SessionId) => boolean): RoomComposerMatch | null;
 /** The room composer takeover component. */
-export declare function RoomComposer({ sessionId, roomStore, submit, stop, addTask, closeTask, setGoal, planCommand, openPlanSession, openPlan, stopExecution, backgroundSessions, activeChildren, stopChild, reconcileDelivery, roomCwd, invite, listProviders, listNames, browseDirectory, modelSurface, renderHarnessModelPicker, roomChrome, modelDirectory, renderMemberConfiguration, renderMemberInbox, stopMember, useSession, useProjection, useInput, inputActions, t, }: RoomComposerProps): ReactNode;
+export declare function RoomComposer({ sessionId, roomStore, submit, stop, openTasks, taskTags, openPlanSession, reconcileDelivery, roomCwd, invite, listProviders, browseDirectory, modelSurface, renderHarnessModelPicker, modelDirectory, renderMemberConfiguration, renderMemberInbox, stopMember, openReference, listSessions, insertSessionReference, useSession, useProjection, useInput, inputActions, t, }: RoomComposerProps): ReactNode;
 //# sourceMappingURL=RoomComposer.d.ts.map

package/lib/types/client/RoomComposer.js

@@ -1,11 +1,13 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * Room composer: the `conversation.composer` chain takeover for room
  * sessions. Replaces the official input bar while the selector holds (the
  * official bar is display:none underneath), so it owns the whole interaction:
  * a textarea (Enter sends, Shift+Enter newlines), a send button, and the
- * @-completion menu listing ONLY existing roster members (pure addressing —
- * invitation lives in the members tab). Addressing is the union of two
+ * @ menu in two groups: this room's members (pure addressing — invitation
+ * lives in the members tab) and other sessions (the host's session-reference
+ * candidates; a pick inserts the host's own session chip, the mention the
+ * room's agent asks for help through — see at-menu.ts). Addressing is the union of two
  * channels: leading `@name` tokens (the host's parseMentions grammar,
  * stripped from the dispatched text) and the mention menu's picks (a pick
  * records explicit addressing wherever the `@name` sits in the sentence —
@@ -24,16 +26,20 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * share one draft — text typed during the first-pull election window
  * carries over, drafts persist across navigation, and external draft
  * writers (quote-anything's 引用到当前会话) land here with zero
- * room-specific code. A reference chip in the machine projects to its
- * clipboard text in this plain textarea, and editing flattens chips back
- * to text (`setDraft` semantics).
+ * room-specific code. Reference chips in the machine (a quote, any trigger
+ * source's pick) render as their own row above the textarea — label, click
+ * to preview through the chip's source, × to remove — and the textarea holds
+ * only the typed text around them; edits map back as detect-span
+ * replacements, so typing never flattens a chip (draft-chips.ts). A host
+ * without the machine's chip view or `insertText` keeps the old plain form:
+ * chips project to their clipboard text and editing flattens them.
  *
  * Taking over the chain inherits the official bar's environment duties (the
  * member-channel rule, local-agent 84a2ed0): a pending interaction yields (the
  * selector declines while `owner.pendingInteraction` is set, so the priority-1
  * ApprovalPanel elects), and everything the hidden fallback tree carried is
  * re-homed INTO this component — the main agent's turn Stop (the send circle
- * swaps while `running`), the dock capsules (RoomDockCapsules), the main
+ * swaps while `running`), the task capsule (RoomTaskCapsule), the main
  * agent's todo strip (RoomTodoStrip, the `todos` projection), the queued-
  * messages strip (RoomQueueStrip, the `inbox` projection — the 0.1.5 session
  * snapshot's queue on the old line), the session
@@ -42,18 +48,25 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * itself is single-owner and cannot be re-hosted, so the picker is our own
  * trigger on the same directory; a host without ui-model-selection gets no
  * picker).
+ *
+ * The task page's 「追问」 / 「＋ 新任务」 put a removable chip on the card
+ * (「任务 N」 / 「新任务」, the shared RoomTaskTags store) and focus the
+ * textarea; the next send carries it as postMessage's `task` and clears it.
+ * Removing the chip leaves the filing to dsh.
  */
 import { coordinatorMember } from '../journal.js';
 import { useEffect, useRef, useState, useSyncExternalStore, } from 'react';
+import { chipDetectIndex, draftSegments, freeText, planFreeEdit } from './draft-chips.js';
+import { detectOffset, memberMention, otherRows, rankByMatch, sessionMention, sessionTitle, shortTime } from './at-menu.js';
 import { memberColor } from './member-color.js';
 import { RoomStatsLine } from './RoomStatsLine.js';
-import { RoomDockCapsules } from './RoomDockCapsules.js';
+import { RoomTaskCapsule } from './RoomTaskCapsule.js';
 import { RoomTodoStrip } from './RoomTodoStrip.js';
-import { RoomActivityDock } from './RoomActivityDock.js';
 import { RoomQueueStrip } from './RoomQueueStrip.js';
-import { RoomRecoveryView } from './RoomRecoveryView.js';
 import { RoomModelPicker } from './RoomModelPicker.js';
+import { IconChevronRightOutlineMedium } from './icons.js';
 import css from './RoomComposer.module.css';
+const NO_TAGS = () => () => { };
 const EMPTY_LEGACY_QUEUE = [];
 const QUEUE_PREVIEW_CHARS = 200;
 /** The queue row's flat preview: attachment blocks dropped, the rest joined and whitespace-collapsed, 200 chars max (the official QueueDock's rule). */
@@ -98,13 +111,24 @@ export function selectRoomComposer(owner, isRoomCached) {
     const sessionId = owner.sessionId ?? owner.session?.sessionId;
     return sessionId !== undefined && isRoomCached(sessionId) ? { room: true } : null;
 }
+const NO_CHIPS = [];
 /** The room composer takeover component. */
-export function RoomComposer({ sessionId, roomStore, submit, stop, addTask, closeTask, setGoal, planCommand, openPlanSession, openPlan, stopExecution, backgroundSessions, activeChildren, stopChild, reconcileDelivery, roomCwd, invite, listProviders, listNames, browseDirectory, modelSurface, renderHarnessModelPicker, roomChrome, modelDirectory, renderMemberConfiguration, renderMemberInbox, stopMember, useSession, useProjection, useInput, inputActions, t, }) {
+export function RoomComposer({ sessionId, roomStore, submit, stop, openTasks, taskTags, openPlanSession, reconcileDelivery, roomCwd, invite, listProviders, browseDirectory, modelSurface, renderHarnessModelPicker, modelDirectory, renderMemberConfiguration, renderMemberInbox, stopMember, openReference, listSessions, insertSessionReference, useSession, useProjection, useInput, inputActions, t, }) {
     const state = useSyncExternalStore(roomStore.subscribe, () => roomStore.getCached(sessionId));
+    const tag = useSyncExternalStore(taskTags?.subscribe ?? NO_TAGS, () => taskTags?.get(sessionId));
     // The draft is the session's official input machine (the module header):
     // shared with the hidden fallback bar, persistent across navigation, and
     // writable by external drafters (quote) with zero room-specific code.
     const draft = useInput(input => input.draft);
+    // The machine's chips (absent before the occurrence view shipped) and the
+    // span-guarded text edit (absent on older faces): both present = chip mode.
+    const occurrences = useInput(input => input.occurrences);
+    const chipEdit = inputActions;
+    const chipMode = occurrences !== undefined && occurrences.length > 0
+        && chipEdit.insertText !== undefined && chipEdit.captureInsertion !== undefined;
+    const chips = chipMode ? occurrences : NO_CHIPS;
+    // What the textarea shows: the typed text around the chips.
+    const value = chipMode ? freeText(draft, chips) : draft;
     const [busy, setBusy] = useState(false);
     const [error, setError] = useState(null);
     const [mention, setMention] = useState(null);
@@ -112,10 +136,59 @@ export function RoomComposer({ sessionId, roomStore, submit, stop, addTask, clos
         `@name` sits (see the module header); cleared with the draft on send. */
     const [picked, setPicked] = useState([]);
     const areaRef = useRef(null);
+    // IME composition (the official ui-primitives observeComposition rule):
+    // Enter while composing, or the one that closes a composition (Safari
+    // fires compositionend before its keydown), commits the candidate — it
+    // never sends. keyCode 229 covers engines without isComposing.
+    const composing = useRef(false);
+    const justComposed = useRef(false);
     const members = state?.members ?? [];
-    const candidates = mention === null
-        ? []
-        : members.filter(member => member.name.startsWith(mention.query));
+    // The other-sessions group: the host's candidates for the open query (the
+    // recent list plus the query's own lookup, merged). A room starts folded;
+    // its arrow (or →) shows its members, and a typed query matches members by name.
+    const [sessionPool, setSessionPool] = useState([]);
+    const [expanded, setExpanded] = useState(new Set());
+    const toggleRoom = (id, open) => {
+        setExpanded((current) => {
+            const next = new Set(current);
+            if (open ?? !next.has(id))
+                next.add(id);
+            else
+                next.delete(id);
+            return next;
+        });
+    };
+    const query = mention?.query;
+    // The injected face is rebuilt on every render (and the room re-renders
+    // every second while anything runs): read it through a ref so only a new
+    // query cancels the lookup — keyed on the function, no lookup ever finished.
+    const listRef = useRef(listSessions);
+    listRef.current = listSessions;
+    const canList = listSessions !== undefined;
+    useEffect(() => {
+        const list = listRef.current;
+        if (query === undefined || list === undefined)
+            return;
+        const abort = new AbortController();
+        const timer = setTimeout(() => {
+            list(query, abort.signal).then((found) => { if (!abort.signal.aborted)
+                setSessionPool(found); }).catch(() => { });
+        }, query === '' ? 0 : 120);
+        return () => { clearTimeout(timer); abort.abort(); };
+    }, [query, canList]);
+    // Outside sessions kept on the member list sit in the members group.
+    const linked = state?.linked ?? [];
+    const excluded = new Set([
+        sessionId, ...linked.map(entry => entry.sessionId),
+        ...members.flatMap(member => member.childSessionId === undefined ? [] : [member.childSessionId]),
+    ]);
+    const memberRows = mention === null ? [] : [
+        ...rankByMatch(mention.query, members, member => member.name).map(member => ({ kind: 'member', member })),
+        ...rankByMatch(mention.query, linked, entry => entry.title)
+            .map(entry => ({ kind: 'session', candidate: { sessionId: entry.sessionId, label: entry.title, mention: sessionMention(entry.sessionId, entry.title), linked: true } })),
+    ];
+    const others = mention === null ? [] : otherRows(mention.query, sessionPool, excluded, expanded);
+    const candidates = [...memberRows, ...others];
     // The inherited environment state: the room's own main-agent turn flag
     // (drives the Send/Stop swap) and the still-queued inbox rows (the official
     // queue dock's data, re-homed as a read-only strip). alpha.2 moved the
@@ -135,29 +208,93 @@ export function RoomComposer({ sessionId, roomStore, submit, stop, addTask, clos
             .filter(row => row.placement === 'queued')
             .map(row => ({ id: String(row.id), preview: row.preview }))
         : nextTurn.map(row => ({ id: String(row.id), preview: previewOf(row.content) }));
+    // The coordinator's own room deliveries: a round a restart interrupted
+    // blocks the ones after it until the human reconciles or stops its task —
+    // say so, instead of a silent queue.
+    const coordinatorRows = (state?.deliveries ?? []).filter(row => row.memberId === coordinator?.id && (row.status === 'queued' || row.status === 'uncertain'));
+    const blocked = coordinatorRows.some(row => row.status === 'uncertain');
+    const coordinatorQueue = coordinatorRows.map(row => ({
+        id: row.id,
+        preview: row.status === 'uncertain' ? t('job.queueUncertain', { text: row.text }) : blocked ? t('job.queueBlocked', { text: row.text }) : row.text,
+    }));
     const resize = (area) => {
         area.style.height = 'auto';
         area.style.height = `${area.scrollHeight}px`;
     };
+    // A new tag (the task page's 追问 / 新任务) hands the textarea focus.
+    useEffect(() => {
+        if (tag !== undefined)
+            areaRef.current?.focus();
+    }, [tag?.revision]);
     // External draft writes (a quote insertion, the election window's
     // carry-over) never fire onChange — keep the height in sync with the draft.
     useEffect(() => {
         if (areaRef.current !== null)
             resize(areaRef.current);
     }, [draft]);
+    // Write the textarea's text back: chip mode maps the change onto the
+    // machine as span edits (each against the then-current revision, last
+    // first), so the chips survive; otherwise the whole draft is replaced.
+    const writeText = (next) => {
+        if (!chipMode) {
+            inputActions.setDraft(next);
+            return;
+        }
+        for (const edit of planFreeEdit(draft, chips, next)) {
+            const draftRev = chipEdit.captureInsertion().draftRev;
+            if (!chipEdit.insertText(edit.text, { start: edit.start, end: edit.end, draftRev }))
+                return;
+        }
+    };
+    // Remove one chip: delete its single detect placeholder.
+    const removeChip = (k) => {
+        const start = chipDetectIndex(draft, chips, k);
+        chipEdit.insertText?.('', { start, end: start + 1, draftRev: chipEdit.captureInsertion().draftRev });
+        areaRef.current?.focus();
+    };
     const onChange = (event) => {
-        const value = event.target.value;
-        inputActions.setDraft(value);
+        const next = event.target.value;
+        writeText(next);
         resize(event.target);
-        const active = detectMention(value, event.target.selectionStart ?? value.length);
+        const active = detectMention(next, event.target.selectionStart ?? next.length);
         setMention(active === null ? null : { ...active, index: 0 });
     };
+    // A session pick: the host's own session chip replaces the typed `@query`
+    // (detect coordinates: the chips before it each fold to one placeholder);
+    // a host without the insertion seam gets the mention as text.
+    const applySession = (candidate) => {
+        setExpanded(new Set());
+        if (mention === null)
+            return;
+        const caret = areaRef.current?.selectionStart ?? value.length;
+        setMention(null);
+        if (insertSessionReference !== undefined && chipEdit.captureInsertion !== undefined) {
+            const segments = chipMode ? draftSegments(draft, chips) : [value];
+            const span = { start: detectOffset(segments, mention.start), end: detectOffset(segments, caret), draftRev: chipEdit.captureInsertion().draftRev };
+            if (insertSessionReference(candidate, span)) {
+                requestAnimationFrame(() => areaRef.current?.focus());
+                return;
+            }
+        }
+        writeText(`${value.slice(0, mention.start)}${candidate.mention} ${value.slice(caret)}`);
+    };
+    const pick = (row) => {
+        if (row.kind === 'member')
+            applyMention(row.member.name);
+        else if (row.kind === 'session')
+            applySession(row.candidate);
+        else {
+            // A room's member: the room's own chip under a 「成员（房间）」 label.
+            const named = memberMention(row.candidate, row.member);
+            applySession({ ...row.candidate, mention: named.mention, displayTitle: named.label });
+        }
+    };
     const applyMention = (name) => {
         if (mention === null)
             return;
-        const caret = areaRef.current?.selectionStart ?? draft.length;
-        const next = `${draft.slice(0, mention.start)}@${name} ${draft.slice(caret)}`;
-        inputActions.setDraft(next);
+        const caret = areaRef.current?.selectionStart ?? value.length;
+        const next = `${value.slice(0, mention.start)}@${name} ${value.slice(caret)}`;
+        writeText(next);
         setMention(null);
         setPicked(picked.includes(name) ? picked : [...picked, name]);
         // The machine tracks no caret: restore it behind the spliced pick once
@@ -174,9 +311,11 @@ export function RoomComposer({ sessionId, roomStore, submit, stop, addTask, clos
         try {
             // Two-argument form while nothing was menu-picked: the injected face's
             // third parameter is the pick channel only.
-            const outcome = picked.length > 0
-                ? await submit(sessionId, text, picked)
-                : await submit(sessionId, text);
+            const outcome = tag !== undefined
+                ? await submit(sessionId, text, picked, tag.task)
+                : picked.length > 0
+                    ? await submit(sessionId, text, picked)
+                    : await submit(sessionId, text);
             if (!outcome.ok) {
                 setError(outcome.message);
                 return;
@@ -188,6 +327,7 @@ export function RoomComposer({ sessionId, roomStore, submit, stop, addTask, clos
             flushDraft?.();
             setMention(null);
             setPicked([]);
+            taskTags?.set(sessionId, undefined);
         }
         catch {
             setError(t('composer.error.generic'));
@@ -197,6 +337,11 @@ export function RoomComposer({ sessionId, roomStore, submit, stop, addTask, clos
         }
     };
     const onKeyDown = (event) => {
+        // oxlint-disable-next-line typescript/no-deprecated -- IME 229 covers engines without isComposing.
+        const ime = composing.current || justComposed.current || event.nativeEvent.isComposing || event.nativeEvent.keyCode === 229;
+        justComposed.current = false;
+        if (ime)
+            return;
         if (mention !== null) {
             if (event.key === 'Escape') {
                 event.preventDefault();
@@ -214,9 +359,18 @@ export function RoomComposer({ sessionId, roomStore, submit, stop, addTask, clos
                     setMention({ ...mention, index: (mention.index + candidates.length - 1) % candidates.length });
                     return;
                 }
+                const active = candidates[mention.index];
+                if ((event.key === 'ArrowRight' || event.key === 'ArrowLeft') && active.kind !== 'member' && (active.kind === 'roomMember' || active.candidate.room === true)) {
+                    event.preventDefault();
+                    toggleRoom(active.candidate.sessionId, event.key === 'ArrowRight');
+                    if (event.key === 'ArrowLeft' && active.kind === 'roomMember') {
+                        setMention({ ...mention, index: candidates.findIndex(row => row.kind === 'session' && row.candidate.sessionId === active.candidate.sessionId) });
+                    }
+                    return;
+                }
                 if (event.key === 'Enter' || event.key === 'Tab') {
                     event.preventDefault();
-                    applyMention(candidates[mention.index].name);
+                    pick(active);
                     return;
                 }
             }
@@ -226,11 +380,23 @@ export function RoomComposer({ sessionId, roomStore, submit, stop, addTask, clos
             void send();
         }
     };
-    return (_jsxs("div", { className: css.root, children: [_jsxs("div", { className: css.dock, children: [!external && useProjection !== undefined && _jsx(RoomTodoStrip, { useProjection: useProjection, t: t }), (state === undefined || (state.plan === undefined && (state.executions?.length ?? 0) === 0)) && _jsx(RoomDockCapsules, { sessionId: sessionId, roomStore: roomStore, addTask: addTask, closeTask: closeTask, setGoal: setGoal, formalPlans: planCommand !== undefined, roomCwd: roomCwd, invite: invite, listProviders: listProviders, listNames: listNames, browseDirectory: browseDirectory, modelSurface: modelSurface, renderHarnessModelPicker: renderHarnessModelPicker, roomChrome: roomChrome, t: t }), state !== undefined && reconcileDelivery !== undefined && _jsx(RoomRecoveryView, { deliveries: state.deliveries ?? [], members: state.members, reconcile: reconcileDelivery, openSession: openPlanSession, t: t }), _jsx(RoomQueueStrip, { items: [...external ? [] : queued, ...(state?.deliveries ?? []).filter(row => row.memberId === coordinator?.id && (row.status === 'queued' || row.status === 'uncertain')).map(row => ({ id: row.id, preview: row.status === 'uncertain' ? `${row.error ?? 'Outcome unknown'}: ${row.text}` : row.text }))], t: t }), state !== undefined && _jsx(RoomActivityDock, { sessionId: sessionId, state: state, backgroundSessions: backgroundSessions, activeChildren: activeChildren, stopChild: stopChild, openSession: openPlanSession, stopExecution: stopExecution, planCommand: planCommand, openPlan: openPlan, stopMember: stopMember, t: t }, sessionId)] }), error !== null && _jsx("div", { className: css.error, role: "alert", children: error }), external && coordinator.childSessionId !== undefined && renderMemberInbox?.(coordinator.childSessionId), _jsxs("div", { className: css.card, children: [_jsxs("div", { className: css.coordinator, children: [t('coordinator.label'), " \u00B7 ", coordinator?.name ?? 'dsh', external ? ` · ${coordinator.provider}` : ' · DSH'] }), mention !== null && candidates.length > 0 && (_jsx("ul", { className: css.menu, role: "listbox", "aria-label": "members", children: candidates.map((member, index) => (_jsx("li", { children: _jsxs("button", { type: "button", role: "option", "aria-selected": index === mention.index, className: index === mention.index ? css.itemActive : css.item, onMouseDown: (event) => {
-                                    event.preventDefault();
-                                    applyMention(member.name);
-                                }, children: [_jsx("span", { className: css.dot, style: { background: memberColor(member.name) }, "aria-hidden": true }), _jsx("span", { children: member.name }), _jsx("span", { className: css.hint, children: member.kind === 'main-agent' ? t('member.kind.main') : member.provider ?? '' })] }) }, member.name))) })), _jsx("textarea", { ref: areaRef, className: css.input, rows: 2, value: draft, placeholder: t('composer.placeholder'), onChange: onChange, onKeyDown: onKeyDown }), _jsxs("div", { className: css.row, children: [external && coordinator.childSessionId !== undefined && renderMemberConfiguration?.(coordinator.childSessionId), !external && modelDirectory !== undefined && (_jsx(RoomModelPicker, { directory: modelDirectory, onError: setError, t: t })), running && (_jsx("button", { type: "button", className: css.primary, "aria-label": t('composer.stop'), onMouseDown: (event) => { event.preventDefault(); }, onClick: () => { if (external)
+    return (_jsxs("div", { className: css.root, children: [_jsxs("div", { className: css.dock, children: [!external && useProjection !== undefined && _jsx(RoomTodoStrip, { useProjection: useProjection, t: t }), state !== undefined && _jsx(RoomTaskCapsule, { state: state, openTasks: openTasks, reconcileDelivery: reconcileDelivery, openPlanSession: openPlanSession, roomCwd: roomCwd, invite: invite, listProviders: () => listProviders(sessionId), browseDirectory: browseDirectory, modelSurface: modelSurface, renderHarnessModelPicker: renderHarnessModelPicker, t: t }), _jsx(RoomQueueStrip, { items: [...external ? [] : queued, ...coordinatorQueue], t: t })] }), error !== null && _jsx("div", { className: css.error, role: "alert", children: error }), external && coordinator.childSessionId !== undefined && renderMemberInbox?.(coordinator.childSessionId), _jsxs("div", { className: css.card, children: [_jsxs("div", { className: css.coordinator, style: { '--member-color': memberColor(coordinator?.name ?? 'dsh') }, children: [_jsx("span", { className: css.coordinatorDot, "aria-hidden": true }), _jsx("span", { className: css.coordinatorName, children: coordinator?.name ?? 'dsh' }), _jsxs("span", { children: ["\u00B7 ", t('coordinator.label'), " \u00B7 ", external ? coordinator.provider : 'DSH'] })] }), mention !== null && candidates.length > 0 && (_jsxs("ul", { className: css.menu, role: "listbox", "aria-label": t('composer.at.label'), children: [candidates.map((row, index) => (_jsxs("li", { children: [index === 0 && memberRows.length > 0 && others.length > 0 && _jsx("div", { className: css.menuGroup, children: t('composer.at.members') }), index === memberRows.length && (_jsx("div", { className: css.menuGroup, children: t(mention.query === '' ? 'composer.at.recent' : 'composer.at.sessions') })), _jsx("button", { type: "button", role: "option", "aria-selected": index === mention.index, className: index === mention.index ? css.itemActive : css.item, "data-kid": row.kind === 'roomMember' && row.nested === true ? '' : undefined, onMouseDown: (event) => {
+                                            event.preventDefault();
+                                            pick(row);
+                                        }, children: row.kind === 'roomMember'
+                                            ? _jsxs(_Fragment, { children: [_jsx("span", { className: css.dot, style: { background: memberColor(row.member.name) }, "aria-hidden": true }), _jsxs("span", { className: css.itemText, children: [row.member.name, row.nested !== true && _jsxs("span", { className: css.itemContext, children: [" \u00B7 ", sessionTitle(row.candidate)] })] }), _jsx("span", { className: css.hint, children: row.member.kind === 'main-agent' ? t('member.kind.main') : row.member.provider ?? '' })] })
+                                            : row.kind === 'member'
+                                                ? _jsxs(_Fragment, { children: [_jsx("span", { className: css.dot, style: { background: memberColor(row.member.name) }, "aria-hidden": true }), _jsx("span", { className: css.itemText, children: row.member.name }), _jsx("span", { className: css.hint, children: row.member.kind === 'main-agent' ? t('member.kind.main') : row.member.provider ?? '' })] })
+                                                : _jsxs(_Fragment, { children: [_jsx("span", { className: css.sessionMark, "aria-hidden": true, children: "@" }), _jsx("span", { className: css.itemText, children: sessionTitle(row.candidate) }), row.candidate.room === true && (row.candidate.members?.length ?? 0) > 0 && (_jsx("span", { role: "button", tabIndex: -1, className: css.expand, "data-open": expanded.has(row.candidate.sessionId) ? '' : undefined, "aria-label": t(expanded.has(row.candidate.sessionId) ? 'composer.at.collapse' : 'composer.at.expand'), onMouseDown: (event) => {
+                                                                event.preventDefault();
+                                                                event.stopPropagation();
+                                                                toggleRoom(row.candidate.sessionId);
+                                                            }, children: _jsx(IconChevronRightOutlineMedium, { size: 14 }) })), _jsx("span", { className: css.hint, children: row.candidate.linked === true
+                                                                ? t('team.external.linked')
+                                                                : row.candidate.room === true
+                                                                    ? t('composer.at.room')
+                                                                    : row.candidate.createdAt === undefined ? t('composer.at.session') : t('composer.at.sessionAt', { time: shortTime(row.candidate.createdAt, Date.now()) }) })] }) })] }, row.kind === 'member' ? `m:${row.member.name}` : row.kind === 'session' ? `s:${row.candidate.sessionId}` : `r:${row.candidate.sessionId}:${row.member.name}`))), mention.query === '' && others.length > 0 && _jsx("li", { className: css.menuMore, children: t('composer.at.more') })] })), tag !== undefined && (_jsx("div", { className: css.tagRow, children: _jsxs("span", { className: css.tag, "data-new": tag.task === 'new' ? '' : undefined, children: [tag.label, _jsx("button", { type: "button", className: css.tagRemove, "aria-label": t('job.tagRemove'), title: t('job.tagRemove'), onClick: () => { taskTags?.set(sessionId, undefined); }, children: "\u2715" })] }) })), chips.length > 0 && (_jsx("div", { className: css.chipRow, children: chips.map((chip, k) => (_jsxs("span", { className: css.chip, children: [_jsxs("button", { type: "button", className: css.chipLabel, title: chip.label, onClick: () => { openReference?.(chip.source, chip.ref); }, children: [_jsx("span", { "aria-hidden": true, className: css.chipAt, children: "@" }), _jsx("span", { className: css.chipText, children: chip.label })] }), _jsx("button", { type: "button", className: css.tagRemove, "aria-label": t('composer.chipRemove', { label: chip.label }), title: t('composer.chipRemove', { label: chip.label }), onMouseDown: (event) => { event.preventDefault(); }, onClick: () => { removeChip(k); }, children: "\u2715" })] }, chip.occurrenceId))) })), _jsx("textarea", { ref: areaRef, className: css.input, rows: 2, value: value, placeholder: tag === undefined ? t('composer.placeholder', { name: coordinator?.name ?? 'dsh' }) : tag.task === 'new' ? t('job.tagPlaceholderNew') : t('job.tagPlaceholder', { label: tag.label }), onChange: onChange, onKeyDown: onKeyDown, onCompositionStart: () => { composing.current = true; }, onCompositionEnd: () => { composing.current = false; justComposed.current = true; }, onKeyUp: () => { justComposed.current = false; }, onBlur: () => { composing.current = false; justComposed.current = false; } }), _jsxs("div", { className: css.row, children: [external && coordinator.childSessionId !== undefined && renderMemberConfiguration?.(coordinator.childSessionId), !external && modelDirectory !== undefined && (_jsx(RoomModelPicker, { directory: modelDirectory, onError: setError, t: t })), running && (_jsx("button", { type: "button", className: css.primary, "aria-label": t('composer.stop'), onMouseDown: (event) => { event.preventDefault(); }, onClick: () => { if (external)
                                     stopMember?.(coordinator.name);
                                 else
-                                    stop(); }, children: _jsx("svg", { viewBox: "0 0 16 16", width: "16", height: "16", "aria-hidden": true, children: _jsx("rect", { x: "3", y: "3", width: "10", height: "10", rx: "3", fill: "currentColor" }) }) })), _jsx("button", { type: "button", className: css.primary, "aria-label": t('composer.send'), disabled: busy || draft.trim() === '', onMouseDown: (event) => { event.preventDefault(); }, onClick: () => { void send(); }, children: _jsx("svg", { viewBox: "0 0 16 16", width: "16", height: "16", "aria-hidden": true, children: _jsx("path", { d: "M8.3125 0.980183C8.66767 1.0531 8.97902 1.20418 9.2627 1.43233C9.48724 1.61297 9.73029 1.85793 9.97949 2.10714L14.707 6.83468L13.293 8.24874L9 3.95577V15.0417H7V3.95577L2.70703 8.24874L1.29297 6.83468L6.02051 2.10714C6.26971 1.85793 6.51277 1.61297 6.7373 1.43233C6.97662 1.23986 7.28445 1.04402 7.6875 0.980183C7.8973 0.947006 8.1031 0.95516 8.3125 0.980183Z", fill: "currentColor" }) }) })] })] }), !external && useProjection !== undefined && _jsx(RoomStatsLine, { useProjection: useProjection, t: t })] }));
+                                    stop(); }, children: _jsx("svg", { viewBox: "0 0 16 16", width: "16", height: "16", "aria-hidden": true, children: _jsx("rect", { x: "3", y: "3", width: "10", height: "10", rx: "3", fill: "currentColor" }) }) })), _jsx("button", { type: "button", className: css.primary, "aria-label": t('composer.send'), disabled: busy || draft.trim() === '', onMouseDown: (event) => { event.preventDefault(); }, onClick: () => { void send(); }, children: _jsx("svg", { viewBox: "0 0 16 16", width: "16", height: "16", "aria-hidden": true, children: _jsx("path", { d: "M8.3125 0.980183C8.66767 1.0531 8.97902 1.20418 9.2627 1.43233C9.48724 1.61297 9.73029 1.85793 9.97949 2.10714L14.707 6.83468L13.293 8.24874L9 3.95577V15.0417H7V3.95577L2.70703 8.24874L1.29297 6.83468L6.02051 2.10714C6.26971 1.85793 6.51277 1.61297 6.7373 1.43233C6.97662 1.23986 7.28445 1.04402 7.6875 0.980183C7.8973 0.947006 8.1031 0.95516 8.3125 0.980183Z", fill: "currentColor" }) }) })] })] }), !external && useProjection !== undefined && _jsx(RoomStatsLine, { useProjection: useProjection, state: state, t: t })] }));
 }

package/lib/types/client/RoomDecisionView.d.ts

@@ -0,0 +1,22 @@
+/**
+ * One decision the room made on its own ('room-decision' keyed renderer): a
+ * single dim line in the room's conversation — the scenario's outcome, the
+ * rule that decided or the model's probability and latency, and 查看判断 for a
+ * decision that called the decision model (it opens Context Lens at that
+ * request). The row reads like the relay / approval status lines.
+ */
+import type { ReactNode } from 'react';
+import type { RoomDecisionEvent } from '../types.ts';
+import type { RoomDecisionViewProps } from './slots.ts';
+type Translate = RoomDecisionViewProps['t'];
+/**
+ * The line's text for one decision.
+ * @param decision - the recorded decision.
+ * @param t - the room translate.
+ * @returns the outcome sentence.
+ */
+export declare function decisionLine(decision: RoomDecisionEvent, t: Translate): string;
+/** The decision row. */
+export declare function RoomDecisionView({ node, openDecision, t }: RoomDecisionViewProps): ReactNode;
+export {};
+//# sourceMappingURL=RoomDecisionView.d.ts.map

package/lib/types/client/RoomDecisionView.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import css from './RoomRelayView.module.css';
+/**
+ * The line's text for one decision.
+ * @param decision - the recorded decision.
+ * @param t - the room translate.
+ * @returns the outcome sentence.
+ */
+export function decisionLine(decision, t) {
+    const failed = decision.call?.failure !== undefined;
+    if (decision.scenario === 'task-filing') {
+        if (decision.rule === 'unavailable')
+            return t(failed ? 'decision.filing.failed' : 'decision.filing.unavailable');
+        return decision.about.task === undefined
+            ? t('decision.filing.new')
+            : t('decision.filing.task', { number: decision.about.task.number, title: decision.about.task.title });
+    }
+    const from = decision.about.from ?? '';
+    const to = decision.about.to ?? '';
+    if (decision.rule === 'unavailable')
+        return t(failed ? 'decision.report.failed' : 'decision.report.unavailable', { from, to });
+    if (decision.rule !== undefined)
+        return t('decision.report.rule', { from, to, rule: t(`decision.rule.${decision.rule}`) });
+    return t(decision.outcome === 'later' ? 'decision.report.later' : 'decision.report.now', { from, to });
+}
+/** The decision row. */
+export function RoomDecisionView({ node, openDecision, t }) {
+    const decision = node.data.decision;
+    const call = decision.call;
+    const meta = [
+        ...decision.probability === undefined ? [] : [decision.probability.toFixed(2)],
+        ...call?.latencyMs === undefined ? [] : [`${(call.latencyMs / 1000).toFixed(1)}s`],
+    ].join(' · ');
+    return (_jsxs("div", { className: css.row, "data-decision": decision.scenario, children: [_jsx("span", { "aria-hidden": true, children: call?.failure !== undefined ? '⚠' : '🧭' }), _jsx("span", { className: css.text, children: decisionLine(decision, t) }), meta !== '' && _jsx("span", { children: meta }), call !== undefined && openDecision !== undefined && (_jsx("button", { type: "button", className: css.action, onClick: () => { openDecision(decision.id); }, children: t('decision.open') }))] }));
+}

package/lib/types/client/RoomHelpView.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Cross-session help, on both ends.
+ *
+ * - `room-help` (the asking room): one line per thread — who asked which
+ *   session, where it stands — that opens to the request and every message
+ *   on the thread (the helper's questions, its reply with the handoff, the
+ *   asker's follow-ups), plus a jump into the helper's session.
+ * - `room-help-request` (the helper's session): the request the room queued
+ *   there, as a card naming the asking room and member, with a jump back.
+ */
+import { type ReactNode } from 'react';
+import type { RoomHelpRequestViewProps, RoomHelpViewProps } from './slots.ts';
+/** The thread row in the asking room. */
+export declare function RoomHelpView({ node, sessionId, roomStore, openSession, linkSession, dismissNudge, t }: RoomHelpViewProps): ReactNode;
+/** The request card in the helper's session. */
+export declare function RoomHelpRequestView({ node, openSession, t }: RoomHelpRequestViewProps): ReactNode;
+//# sourceMappingURL=RoomHelpView.d.ts.map