@wowyuarm/dsh-agent-team 0.1.0 → 0.1.2

package/packages/client-agent-team/lib/types/client/TeamChannelsPanel.js

@@ -2,6 +2,9 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Button, IconEditOutline16, IconPlusOutline16, Input, Modal, Tooltip } from '@deepseek-ai/dsh-client-ui-primitives';
 import { TeamPresenceDot } from "./TeamPresenceDot.js";
+import { MultiMenuField } from "./multi-menu-field.js";
+import { SortableRow, useSidebarRowDrag } from "./sidebar-drag.js";
+import { moveSidebarItem, useSidebarOrder } from "./sidebar-order.js";
 import { TeamRowMenu } from "./TeamRowMenu.js";
 import { TeamSidebarSection } from "./TeamSidebarSection.js";
 import { useChannelMembership } from "./team-membership.js";
@@ -21,6 +24,18 @@ export function TeamChannelsPanel(props) {
     const [pendingCreate, setPendingCreate] = useState();
     const previousCreatingKey = useRef(creatingAgents.map(request => request.requestId).join(','));
     const triggerRef = useRef(null);
+    // Row order is this browser's presentation preference; the drag commits
+    // through the single shared mutation below.
+    const channelRefs = useMemo(() => view?.channels.map(channel => channel.channelRef) ?? [], [view]);
+    const orderedChannelRefs = useSidebarOrder(workspaceId, 'channels', channelRefs);
+    const orderedChannels = useMemo(() => {
+        const byRef = new Map((view?.channels ?? []).map(channel => [channel.channelRef, channel]));
+        return orderedChannelRefs.map(channelRef => byRef.get(channelRef)).filter(channel => channel !== undefined);
+    }, [orderedChannelRefs, view]);
+    const applyMove = (movedRef, targetRef, marker) => {
+        void moveSidebarItem(workspaceId, 'channels', orderedChannelRefs, movedRef, targetRef, marker);
+    };
+    const drag = useSidebarRowDrag({ refs: orderedChannelRefs, onCommit: applyMove });
     const refresh = useCallback(async () => {
         setLoading(true);
         const [channelResult, memberResult] = await Promise.all([
@@ -76,7 +91,7 @@ export function TeamChannelsPanel(props) {
     };
     const submit = async (event) => {
         event.preventDefault();
-        if (mutating || name.trim() === '' || description.trim() === '')
+        if (mutating || name.trim() === '')
             return;
         const payload = { workspaceId, name: name.trim(), description: description.trim(), memberIds: [...selected] };
         const samePending = pendingCreate !== undefined && pendingCreate.workspaceId === payload.workspaceId
@@ -110,23 +125,27 @@ export function TeamChannelsPanel(props) {
             setMutating(false);
         }
     };
-    return (_jsxs("div", { className: css.panel, children: [_jsx(Modal, { open: formOpen, onClose: closeForm, title: t('addChannel'), closeLabel: t('close'), contentClassName: createCss.dialogContent, footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", disabled: mutating, onClick: closeForm, children: t('cancel') }), _jsx(Button, { type: "submit", form: "team-channel-create-form", variant: "primary", disabled: mutating || name.trim() === '' || description.trim() === '', children: mutating ? t('creatingChannel') : t('createChannel') })] }), children: _jsxs("form", { id: "team-channel-create-form", className: createCss.form, onSubmit: event => { void submit(event); }, children: [_jsxs("label", { className: createCss.field, children: [_jsx("span", { children: t('channelName') }), _jsx(Input, { className: createCss.input, value: name, disabled: mutating, autoFocus: true, onChange: event => { setName(event.target.value); setPendingCreate(undefined); } })] }), _jsxs("label", { className: createCss.field, children: [_jsx("span", { children: t('channelDescription') }), _jsx(Input, { className: createCss.input, value: description, disabled: mutating, onChange: event => { setDescription(event.target.value); setPendingCreate(undefined); } })] }), _jsxs("fieldset", { className: createCss.memberPicker, disabled: mutating, children: [_jsx("legend", { children: t('initialMembers') }), creatingAgents.map(request => (_jsxs("label", { className: createCss.memberOption, children: [_jsx("input", { type: "checkbox", disabled: true, "aria-describedby": `creating-member-reason-${request.requestId}` }), _jsx("span", { className: createCss.unavailableDot, "aria-hidden": "true" }), _jsx("span", { children: request.handle }), _jsx("small", { id: `creating-member-reason-${request.requestId}`, children: t('memberCreatingReason') })] }, request.requestId))), members.map(status => {
-                                    const disabled = status.presence === 'unavailable';
-                                    const reasonId = `initial-member-reason-${status.member.memberId}`;
-                                    return (_jsxs("label", { className: createCss.memberOption, children: [_jsx("input", { type: "checkbox", disabled: disabled, "aria-describedby": disabled ? reasonId : undefined, checked: selected.has(status.member.memberId), onChange: event => {
-                                                    setSelected(current => {
-                                                        const next = new Set(current);
-                                                        if (event.target.checked)
-                                                            next.add(status.member.memberId);
-                                                        else
-                                                            next.delete(status.member.memberId);
-                                                        return next;
-                                                    });
-                                                    setPendingCreate(undefined);
-                                                } }), _jsx(TeamPresenceDot, { status: status, t: t }), _jsx("span", { children: status.member.handle }), disabled && _jsx("small", { id: reasonId, children: t('memberUnavailableReason') })] }, status.member.memberId));
-                                })] }), error !== undefined && _jsx("p", { className: createCss.error, role: "alert", children: error })] }) }), _jsxs(TeamSidebarSection, { title: t('channels'), actions: (_jsx(Tooltip, { label: t('addChannel'), delayMs: 500, children: _jsx("button", { ref: triggerRef, type: "button", className: css.iconButton, "aria-label": t('addChannel'), onClick: () => { setError(undefined); setFormOpen(true); }, children: _jsx(IconPlusOutline16, { size: 14 }) }) })), children: [loading && view === undefined && _jsx("p", { className: css.emptyState, children: t('loadingChannels') }), !loading && (view?.channels.length ?? 0) === 0 && _jsx("p", { className: css.emptyState, children: t('emptyChannels') }), _jsx("div", { className: css.channelList, children: view?.channels.map(channel => {
+    return (_jsxs("div", { className: css.panel, children: [_jsx(Modal, { open: formOpen, onClose: closeForm, title: t('addChannel'), closeLabel: t('close'), contentClassName: createCss.dialogContent, footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", disabled: mutating, onClick: closeForm, children: t('cancel') }), _jsx(Button, { type: "submit", form: "team-channel-create-form", variant: "primary", disabled: mutating || name.trim() === '', children: mutating ? t('creatingChannel') : t('createChannel') })] }), children: _jsxs("form", { id: "team-channel-create-form", className: createCss.form, onSubmit: event => { void submit(event); }, children: [_jsxs("label", { className: createCss.field, children: [_jsx("span", { children: t('channelName') }), _jsx(Input, { className: createCss.input, value: name, disabled: mutating, autoFocus: true, onChange: event => { setName(event.target.value); setPendingCreate(undefined); } })] }), _jsxs("label", { className: createCss.field, children: [_jsxs("span", { children: [t('channelDescription'), t('optionalSuffix')] }), _jsx(Input, { className: createCss.input, value: description, placeholder: t('agentDescriptionPlaceholder'), disabled: mutating, onChange: event => { setDescription(event.target.value); setPendingCreate(undefined); } })] }), _jsx(MultiMenuField, { label: t('initialMembers'), disabled: mutating, options: [
+                                ...creatingAgents.map(request => ({ id: request.requestId, label: request.handle, disabled: true, hint: t('memberCreatingReason') })),
+                                ...members.map(status => ({
+                                    id: status.member.memberId,
+                                    label: status.member.handle,
+                                    ...(status.presence === 'unavailable' ? { disabled: true, hint: t('memberUnavailableReason') } : {}),
+                                    icon: _jsx(TeamPresenceDot, { status: status, t: t }),
+                                })),
+                            ], selected: [...selected], onToggle: id => {
+                                setSelected(current => {
+                                    const next = new Set(current);
+                                    if (next.has(id))
+                                        next.delete(id);
+                                    else
+                                        next.add(id);
+                                    return next;
+                                });
+                                setPendingCreate(undefined);
+                            }, triggerEmptyLabel: t('membersPickerEmpty'), formatCount: count => t('membersPickerCount', { count }) }), error !== undefined && _jsx("p", { className: createCss.error, role: "alert", children: error })] }) }), _jsxs(TeamSidebarSection, { title: t('channels'), actions: (_jsx(Tooltip, { label: t('addChannel'), delayMs: 500, children: _jsx("button", { ref: triggerRef, type: "button", className: css.iconButton, "aria-label": t('addChannel'), onClick: () => { setError(undefined); setFormOpen(true); }, children: _jsx(IconPlusOutline16, { size: 14 }) }) })), children: [loading && view === undefined && _jsx("p", { className: css.emptyState, children: t('loadingChannels') }), !loading && (view?.channels.length ?? 0) === 0 && _jsx("p", { className: css.emptyState, children: t('emptyChannels') }), _jsx("div", { className: css.channelList, children: orderedChannels.map(channel => {
                             const joined = membership.get(channel.channelRef) ?? new Set();
-                            return (_jsx(ChannelRow, { channel: channel, members: members, joinedIds: joined, selected: selectedChannelRef === channel.channelRef, updateChannel: updateChannel, joinChannel: props.joinChannel, removeChannelMember: props.removeChannelMember, onCommitted: () => { void refresh(); }, selectChannel: selectChannel, t: t }, channel.channelRef));
+                            return (_jsx(SortableRow, { drag: drag, orderKey: channel.channelRef, children: _jsx(ChannelRow, { channel: channel, members: members, joinedIds: joined, selected: selectedChannelRef === channel.channelRef, updateChannel: updateChannel, joinChannel: props.joinChannel, removeChannelMember: props.removeChannelMember, onCommitted: () => { void refresh(); }, selectChannel: selectChannel, t: t }) }, channel.channelRef));
                         }) })] }), !formOpen && error !== undefined && _jsx("p", { className: css.error, role: "alert", children: error })] }));
 }
 /**
@@ -154,7 +173,7 @@ function ChannelEditorDialog({ channel, members, joinedIds, updateChannel, joinC
         event.preventDefault();
         const normalizedName = name.trim();
         const normalizedDescription = description.trim();
-        if (saving || !dirty || normalizedName === '' || normalizedDescription === '')
+        if (saving || !dirty || normalizedName === '')
             return;
         const samePending = pendingRequest.current !== undefined && pendingRequest.current.channelRef === channel.channelRef
             && pendingRequest.current.name === normalizedName && pendingRequest.current.description === normalizedDescription;
@@ -186,7 +205,7 @@ function ChannelEditorDialog({ channel, members, joinedIds, updateChannel, joinC
             setSaving(false);
         }
     };
-    return (_jsx(Modal, { open: true, onClose: onClose, title: t('editChannel'), description: `# ${channel.name}`, closeLabel: t('close'), contentClassName: createCss.dialogContent, footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", disabled: saving, onClick: onClose, children: t('cancel') }), _jsx(Button, { type: "submit", form: "team-channel-edit-form", variant: "primary", disabled: saving || !dirty || name.trim() === '' || description.trim() === '', children: saving ? t('editSaving') : t('editSave') })] }), children: _jsxs("form", { id: "team-channel-edit-form", className: createCss.form, onSubmit: event => { void submit(event); }, children: [_jsxs("label", { className: createCss.field, children: [_jsx("span", { children: t('channelName') }), _jsx(Input, { className: createCss.input, value: name, onChange: event => { setName(event.target.value); pendingRequest.current = undefined; }, disabled: saving, autoFocus: true })] }), _jsxs("label", { className: createCss.field, children: [_jsx("span", { children: t('channelDescription') }), _jsx(Input, { className: createCss.input, value: description, onChange: event => { setDescription(event.target.value); pendingRequest.current = undefined; }, disabled: saving })] }), _jsxs("fieldset", { className: createCss.memberPicker, disabled: saving, children: [_jsx("legend", { children: t('channelMembersSection') }), members.map(status => {
+    return (_jsx(Modal, { open: true, onClose: onClose, title: t('editChannel'), description: `# ${channel.name}`, closeLabel: t('close'), contentClassName: createCss.dialogContent, footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", disabled: saving, onClick: onClose, children: t('cancel') }), _jsx(Button, { type: "submit", form: "team-channel-edit-form", variant: "primary", disabled: saving || !dirty || name.trim() === '', children: saving ? t('editSaving') : t('editSave') })] }), children: _jsxs("form", { id: "team-channel-edit-form", className: createCss.form, onSubmit: event => { void submit(event); }, children: [_jsxs("label", { className: createCss.field, children: [_jsx("span", { children: t('channelName') }), _jsx(Input, { className: createCss.input, value: name, onChange: event => { setName(event.target.value); pendingRequest.current = undefined; }, disabled: saving, autoFocus: true })] }), _jsxs("label", { className: createCss.field, children: [_jsxs("span", { children: [t('channelDescription'), t('optionalSuffix')] }), _jsx(Input, { className: createCss.input, value: description, placeholder: t('agentDescriptionPlaceholder'), onChange: event => { setDescription(event.target.value); pendingRequest.current = undefined; }, disabled: saving })] }), _jsxs("fieldset", { className: createCss.memberPicker, disabled: saving, children: [_jsx("legend", { children: t('channelMembersSection') }), members.map(status => {
                             const joined = joinedIds.has(status.member.memberId);
                             const rowPending = membership.pending.has(status.member.memberId);
                             const disabled = rowPending || (!joined && status.presence === 'unavailable');

package/packages/client-agent-team/lib/types/client/TeamComposer.d.ts

@@ -1,6 +1,6 @@
 import type { AgentTeamClientMemberStatus, AgentTeamMemberId } from '@wowyuarm/dsh-agent-team/types';
 import type { TeamConversationProps } from './slots.ts';
-export declare function TeamComposer({ members, recipients, draft, pending, confirmation, error, onDraftChange, onRecipientsChange, onSubmit, t }: {
+export declare function TeamComposer({ members, recipients, draft, pending, confirmation, error, onDraftChange, onRecipientsChange, onSubmit, pendingFiles, onFilesChange, t }: {
     readonly members: readonly AgentTeamClientMemberStatus[];
     readonly recipients: ReadonlySet<AgentTeamMemberId>;
     readonly draft: string;
@@ -10,6 +10,9 @@ export declare function TeamComposer({ members, recipients, draft, pending, conf
     readonly onDraftChange: (draft: string) => void;
     readonly onRecipientsChange: (recipients: ReadonlySet<AgentTeamMemberId>) => void;
     readonly onSubmit: () => void;
+    /** Upload-capable surfaces pass this to enable the "+" file picker; the reply path omits it. */
+    readonly pendingFiles?: readonly File[];
+    readonly onFilesChange?: (files: readonly File[]) => void;
     readonly t: TeamConversationProps['t'];
 }): import("react").JSX.Element;
 //# sourceMappingURL=TeamComposer.d.ts.map

package/packages/client-agent-team/lib/types/client/TeamComposer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TeamComposer.d.ts","sourceRoot":"","sources":["../../../src/client/TeamComposer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,2BAA2B,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAEpG,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAoCvD,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,aAAa,EAAE,kBAAkB,EAAE,QAAQ,EAAE,CAAC,EAAE,EAAE;IACzI,QAAQ,CAAC,OAAO,EAAE,SAAS,2BAA2B,EAAE,CAAA;IACxD,QAAQ,CAAC,UAAU,EAAE,WAAW,CAAC,iBAAiB,CAAC,CAAA;IACnD,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAA;IAC9B,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/C,QAAQ,CAAC,kBAAkB,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAA;IACjF,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,CAAA;IAC7B,QAAQ,CAAC,CAAC,EAAE,qBAAqB,CAAC,GAAG,CAAC,CAAA;CACvC,+BAkKA"}
+{"version":3,"file":"TeamComposer.d.ts","sourceRoot":"","sources":["../../../src/client/TeamComposer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,2BAA2B,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAEpG,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAkDvD,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,aAAa,EAAE,kBAAkB,EAAE,QAAQ,EAAE,YAAY,EAAE,aAAa,EAAE,CAAC,EAAE,EAAE;IACtK,QAAQ,CAAC,OAAO,EAAE,SAAS,2BAA2B,EAAE,CAAA;IACxD,QAAQ,CAAC,UAAU,EAAE,WAAW,CAAC,iBAAiB,CAAC,CAAA;IACnD,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAA;IAC9B,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/C,QAAQ,CAAC,kBAAkB,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAA;IACjF,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,CAAA;IAC7B,gGAAgG;IAChG,QAAQ,CAAC,YAAY,CAAC,EAAE,SAAS,IAAI,EAAE,CAAA;IACvC,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,IAAI,EAAE,KAAK,IAAI,CAAA;IACzD,QAAQ,CAAC,CAAC,EAAE,qBAAqB,CAAC,GAAG,CAAC,CAAA;CACvC,+BAiOA"}

package/packages/client-agent-team/lib/types/client/TeamComposer.js

@@ -1,8 +1,9 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useLayoutEffect, useRef, useState } from 'react';
-import { IconSendOutline16, useAnchoredMaxHeight, useDismissOnOutsidePointer } from '@deepseek-ai/dsh-client-ui-primitives';
+import { IconPlusOutline16, IconSendOutline16, useAnchoredMaxHeight, useDismissOnOutsidePointer } from '@deepseek-ai/dsh-client-ui-primitives';
 import { TeamPresenceDot } from "./TeamPresenceDot.js";
 import css from './composer.module.css';
+import { formatByteSize } from "./attachment-preview.js";
 function findMention(draft, caret) {
     const beforeCaret = draft.slice(0, caret);
     if (beforeCaret.length === 0 || /\s/u.test(beforeCaret.at(-1) ?? ''))
@@ -29,8 +30,21 @@ function mentionCandidates(members, query) {
         && status.member.state !== 'inactive'
         && status.member.handle.toLocaleLowerCase().startsWith(normalized));
 }
-export function TeamComposer({ members, recipients, draft, pending, confirmation, error, onDraftChange, onRecipientsChange, onSubmit, t }) {
+/** One object URL per draft file; revoked when the draft is removed. */
+const draftPreviewUrls = new WeakMap();
+function draftPreviewUrl(file) {
+    if (!file.type.startsWith('image/'))
+        return undefined;
+    let url = draftPreviewUrls.get(file);
+    if (url === undefined) {
+        url = URL.createObjectURL(file);
+        draftPreviewUrls.set(file, url);
+    }
+    return url;
+}
+export function TeamComposer({ members, recipients, draft, pending, confirmation, error, onDraftChange, onRecipientsChange, onSubmit, pendingFiles, onFilesChange, t }) {
     const inputRef = useRef(null);
+    const fileInputRef = useRef(null);
     const rootRef = useRef(null);
     const menuRef = useRef(null);
     const composingRef = useRef(false);
@@ -57,6 +71,22 @@ export function TeamComposer({ members, recipients, draft, pending, confirmation
         }
         setHighlight(current => Math.min(current, candidates.length - 1));
     }, [mention, candidates.length]);
+    // Match the resident DSH composer without stealing a later user choice: Team
+    // data can load after navigation, so a dialog or another control may already
+    // own focus by the time this composer appears.
+    useEffect(() => {
+        const active = document.activeElement;
+        if (active !== document.body && active?.closest('[aria-current="page"]') === null)
+            return;
+        inputRef.current?.focus({ preventScroll: true });
+    }, []);
+    // Confirmation settles after a read-only submission span. Restore focus in
+    // case the browser moved it so the second Enter can confirm immediately.
+    useEffect(() => {
+        if (confirmation === undefined || pending)
+            return;
+        inputRef.current?.focus({ preventScroll: true });
+    }, [confirmation, pending]);
     const pruneRecipients = (nextDraft) => {
         const knownMembers = new Map(members.map(status => [status.member.memberId, status.member]));
         const next = new Set([...recipients].filter(memberId => {
@@ -66,6 +96,15 @@ export function TeamComposer({ members, recipients, draft, pending, confirmation
         if (next.size !== recipients.size)
             onRecipientsChange(next);
     };
+    // Restored drafts may carry recipients that no longer match the text (or
+    // unknown Members); converge on mount and on every state change so the
+    // cached entry never stays stale — the same rule user edits already apply.
+    // An unloaded roster must never judge recipients unknown.
+    useEffect(() => {
+        if (members.length === 0)
+            return;
+        pruneRecipients(draft);
+    }, [draft, recipients, members]);
     const updateMention = (nextDraft, caret) => {
         const match = findMention(nextDraft, caret);
         setMention(match);
@@ -133,6 +172,7 @@ export function TeamComposer({ members, recipients, draft, pending, confirmation
             onSubmit();
     };
     return _jsxs("form", { ref: rootRef, className: css.root, onSubmit: event => {
+            console.log('DBG composer submit pending=%s draft=%j', pending, draft);
             event.preventDefault();
             if (!pending && draft.trim() !== '')
                 onSubmit();
@@ -140,5 +180,22 @@ export function TeamComposer({ members, recipients, draft, pending, confirmation
                                     const optionId = `${listId}-${status.member.memberId}`;
                                     const selected = index === highlight;
                                     return _jsxs("button", { id: optionId, type: "button", role: "option", "aria-selected": selected, className: css.mentionOption, onMouseDown: event => { event.preventDefault(); }, onClick: () => { selectMention(status); }, children: [_jsx(TeamPresenceDot, { status: status, t: t }), _jsxs("span", { className: css.mentionName, children: ["@", status.member.handle] }), _jsx("span", { className: css.mentionDescription, children: status.member.description })] }, status.member.memberId);
-                                }) }), _jsx("textarea", { ref: inputRef, "aria-label": t('messageDraft'), "aria-autocomplete": "list", "aria-controls": menuOpen ? listId : undefined, "aria-activedescendant": menuOpen && activeCandidate !== undefined ? `${listId}-${activeCandidate.member.memberId}` : undefined, "aria-expanded": menuOpen, value: draft, disabled: pending, placeholder: t('messagePlaceholder'), rows: 1, onChange: onChange, onKeyDown: onKeyDown, onSelect: event => { updateMention(event.currentTarget.value, event.currentTarget.selectionStart ?? event.currentTarget.value.length); }, onCompositionStart: () => { composingRef.current = true; }, onCompositionEnd: () => { setTimeout(() => { composingRef.current = false; }, 10); } })] }), recipients.size > 0 && _jsx("p", { className: css.notifyRow, "data-team-notify": true, children: t('composerNotify', { ids: [...recipients].sort().map(memberId => `@${members.find(candidate => candidate.member.memberId === memberId)?.member.handle ?? memberId}`).join(', ') }) }), _jsx("div", { className: css.toolbar, children: _jsx("button", { type: "submit", className: css.sendButton, "aria-label": pending ? t('sendingMessage') : t('sendMessage'), disabled: pending || draft.trim() === '', children: _jsx(IconSendOutline16, { size: 16 }) }) })] }), error !== undefined && _jsx("p", { className: css.error, role: "alert", children: error })] });
+                                }) }), _jsx("textarea", { ref: inputRef, "aria-label": t('messageDraft'), "aria-autocomplete": "list", "aria-controls": menuOpen ? listId : undefined, "aria-activedescendant": menuOpen && activeCandidate !== undefined ? `${listId}-${activeCandidate.member.memberId}` : undefined, "aria-expanded": menuOpen, value: draft, readOnly: pending, placeholder: t('messagePlaceholder'), rows: 1, onChange: onChange, onKeyDown: onKeyDown, onSelect: event => { updateMention(event.currentTarget.value, event.currentTarget.selectionStart ?? event.currentTarget.value.length); }, onCompositionStart: () => { composingRef.current = true; }, onCompositionEnd: () => { setTimeout(() => { composingRef.current = false; }, 10); } })] }), recipients.size > 0 && _jsx("p", { className: css.notifyRow, "data-team-notify": true, children: t('composerNotify', { ids: [...recipients].sort().map(memberId => `@${members.find(candidate => candidate.member.memberId === memberId)?.member.handle ?? memberId}`).join(', ') }) }), onFilesChange !== undefined && pendingFiles !== undefined && pendingFiles.length > 0 && (_jsx("ul", { className: css.fileChips, "aria-label": t('attachFiles'), children: pendingFiles.map((file, index) => {
+                            const previewUrl = draftPreviewUrl(file);
+                            return _jsxs("li", { className: `${css.fileChip} ${previewUrl !== undefined ? css.imageChip : ''}`, children: [previewUrl !== undefined && _jsx("img", { src: previewUrl, alt: "", className: css.imageChipPreview }), _jsxs("span", { className: css.fileChipName, title: file.name, children: [file.name, _jsx("span", { className: css.fileChipSize, children: formatByteSize(file.size) })] }), _jsx("button", { type: "button", className: css.fileChipRemove, "aria-label": t('removeFile', { name: file.name }), disabled: pending, onClick: () => {
+                                            const url = draftPreviewUrls.get(file);
+                                            if (url !== undefined)
+                                                URL.revokeObjectURL(url);
+                                            onFilesChange(pendingFiles.filter((_, candidate) => candidate !== index));
+                                        }, children: "\u00D7" })] }, `${file.name}-${index}`);
+                        }) })), _jsxs("div", { className: css.toolbar, children: [onFilesChange !== undefined && (_jsxs(_Fragment, { children: [_jsx("input", { ref: fileInputRef, type: "file", multiple: true, className: css.fileInput, "aria-hidden": "true", tabIndex: -1, onChange: event => {
+                                            const chosen = [...event.target.files ?? []];
+                                            if (chosen.length > 0 && pendingFiles !== undefined)
+                                                onFilesChange([...pendingFiles, ...chosen]);
+                                            event.target.value = '';
+                                        } }), _jsx("button", { type: "button", className: css.attachButton, "aria-label": t('attachFiles'), title: t('attachFiles'), disabled: pending, onClick: () => { fileInputRef.current?.click(); }, children: _jsx(IconPlusOutline16, { size: 14 }) })] })), _jsx("button", { type: "submit", className: css.sendButton, "aria-label": pending ? t('sendingMessage') : t('sendMessage'), disabled: pending || draft.trim() === '', onMouseDown: event => {
+                                    // Keep the composer focused when the send control is clicked.
+                                    event.preventDefault();
+                                    inputRef.current?.focus({ preventScroll: true });
+                                }, children: _jsx(IconSendOutline16, { size: 16 }) })] })] }), error !== undefined && _jsx("p", { className: css.error, role: "alert", children: error })] });
 }

package/packages/client-agent-team/lib/types/client/TeamConversation.d.ts

@@ -1,3 +1,3 @@
 import type { TeamConversationProps } from './slots.ts';
-export declare function TeamConversation({ t, useWorkspaces, navigation, loadChannels, readThread, loadThreadHistory, subscribeChanges, loadMembers, sendMessage, joinChannel, removeChannelMember, reply, changeTask, selectThread, backToWorkspace, backToChannels }: TeamConversationProps): import("react").JSX.Element;
+export declare function TeamConversation({ t, useWorkspaces, navigation, drafts, putAttachment, getAttachment, loadChannels, readThread, loadThreadHistory, subscribeChanges, loadMembers, sendMessage, joinChannel, removeChannelMember, reply, changeTask, selectThread, selectChannel, backToWorkspace, backToChannels, resolveTaskRefs }: TeamConversationProps): import("react").JSX.Element;
 //# sourceMappingURL=TeamConversation.d.ts.map

package/packages/client-agent-team/lib/types/client/TeamConversation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TeamConversation.d.ts","sourceRoot":"","sources":["../../../src/client/TeamConversation.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAKvD,wBAAgB,gBAAgB,CAAC,EAAE,CAAC,EAAE,aAAa,EAAE,UAAU,EAAE,YAAY,EAAE,UAAU,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,mBAAmB,EAAE,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,EAAE,qBAAqB,+BAoBpR"}
+{"version":3,"file":"TeamConversation.d.ts","sourceRoot":"","sources":["../../../src/client/TeamConversation.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAKvD,wBAAgB,gBAAgB,CAAC,EAAE,CAAC,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,YAAY,EAAE,UAAU,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,mBAAmB,EAAE,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,cAAc,EAAE,eAAe,EAAE,EAAE,qBAAqB,+BAoB1V"}

package/packages/client-agent-team/lib/types/client/TeamConversation.js

@@ -3,15 +3,15 @@ import { useSyncExternalStore } from 'react';
 import { TeamChannelPage } from "./TeamChannelPage.js";
 import { TeamThreadPage } from "./TeamThreadPage.js";
 import css from './conversation.module.css';
-export function TeamConversation({ t, useWorkspaces, navigation, loadChannels, readThread, loadThreadHistory, subscribeChanges, loadMembers, sendMessage, joinChannel, removeChannelMember, reply, changeTask, selectThread, backToWorkspace, backToChannels }) {
+export function TeamConversation({ t, useWorkspaces, navigation, drafts, putAttachment, getAttachment, loadChannels, readThread, loadThreadHistory, subscribeChanges, loadMembers, sendMessage, joinChannel, removeChannelMember, reply, changeTask, selectThread, selectChannel, backToWorkspace, backToChannels, resolveTaskRefs }) {
     const navigationState = useSyncExternalStore(navigation.subscribe, navigation.getSnapshot, navigation.getSnapshot);
     const workspaces = useWorkspaces(state => state.items);
     const current = workspaces.find(workspace => workspace.workspaceId === navigationState.workspaceId);
     if (current !== undefined && navigationState.taskRef !== undefined && navigationState.threadRef !== undefined) {
-        return _jsx(TeamThreadPage, { workspaceId: current.workspaceId, taskRef: navigationState.taskRef, threadRef: navigationState.threadRef, backToWorkspace: backToWorkspace, ...(navigationState.channelRef === undefined ? {} : { channelRef: navigationState.channelRef }), ...(navigationState.taskNumber === undefined ? {} : { taskNumber: navigationState.taskNumber }), readThread: readThread, loadChannels: loadChannels, loadThreadHistory: loadThreadHistory, subscribeChanges: subscribeChanges, loadMembers: loadMembers, reply: reply, changeTask: changeTask, t: t }, navigationState.threadRef);
+        return _jsx(TeamThreadPage, { workspaceId: current.workspaceId, putAttachment: putAttachment, taskRef: navigationState.taskRef, threadRef: navigationState.threadRef, backToWorkspace: backToWorkspace, selectChannel: selectChannel, selectThread: selectThread, resolveTaskRefs: resolveTaskRefs, ...(navigationState.channelRef === undefined ? {} : { channelRef: navigationState.channelRef }), ...(navigationState.taskNumber === undefined ? {} : { taskNumber: navigationState.taskNumber }), drafts: drafts, getAttachment: getAttachment, readThread: readThread, loadChannels: loadChannels, loadThreadHistory: loadThreadHistory, subscribeChanges: subscribeChanges, loadMembers: loadMembers, reply: reply, changeTask: changeTask, t: t }, navigationState.threadRef);
     }
     if (current !== undefined && navigationState.channelRef !== undefined) {
-        return _jsx(TeamChannelPage, { workspaceId: current.workspaceId, channelRef: navigationState.channelRef, loadChannels: loadChannels, subscribeChanges: subscribeChanges, loadMembers: loadMembers, sendMessage: sendMessage, joinChannel: joinChannel, removeChannelMember: removeChannelMember, selectThread: selectThread, backToChannels: backToChannels, t: t }, navigationState.channelRef);
+        return _jsx(TeamChannelPage, { workspaceId: current.workspaceId, channelRef: navigationState.channelRef, drafts: drafts, putAttachment: putAttachment, getAttachment: getAttachment, loadChannels: loadChannels, subscribeChanges: subscribeChanges, loadMembers: loadMembers, sendMessage: sendMessage, joinChannel: joinChannel, removeChannelMember: removeChannelMember, selectThread: selectThread, selectChannel: selectChannel, backToChannels: backToChannels, resolveTaskRefs: resolveTaskRefs, t: t }, navigationState.channelRef);
     }
     const welcome = current === undefined
         ? { eyebrow: t('teamMode'), title: t('team'), body: t('empty') }

package/packages/client-agent-team/lib/types/client/TeamMessage.d.ts

@@ -1,5 +1,7 @@
 import { type ReactNode } from 'react';
-import type { AgentTeamMemberId } from '@wowyuarm/dsh-agent-team/types';
+import type { AgentTeamMemberId, AgentTeamMessageAttachment, AgentTeamTaskRef } from '@wowyuarm/dsh-agent-team/types';
+import type { TeamConversationProps } from './slots.ts';
+import { type ResolvedTaskRef } from './task-refs.ts';
 export interface TeamMessageProps {
     readonly senderName: string;
     readonly memberId: AgentTeamMemberId;
@@ -12,8 +14,16 @@ export interface TeamMessageProps {
     readonly senderTitle?: string;
     /** Continuation of one same-sender run: suppress repeated identity chrome. */
     readonly grouped?: boolean;
+    readonly attachments?: readonly AgentTeamMessageAttachment[] | undefined;
+    /** Cache readback for thumbnails; absent on surfaces without the remotes. */
+    readonly loadAttachment?: TeamConversationProps['getAttachment'] | undefined;
+    readonly t?: TeamConversationProps['t'] | undefined;
+    /** Resolve a branded ref found in the body; absent surfaces render refs as plain text. */
+    readonly onOpenRef?: ((ref: string) => void) | undefined;
+    /** Host lookup turning task refs into human-facing numbers; absent keeps raw refs. */
+    readonly onResolveTaskRefs?: ((taskRefs: readonly AgentTeamTaskRef[]) => Promise<readonly ResolvedTaskRef[]>) | undefined;
     readonly children?: ReactNode;
 }
 /** One chat message row with identity chrome and sender-appropriate rendering. */
-export declare function TeamMessage({ senderName, memberId, human, body, occurredAt, mentionNames, senderTitle, grouped, children }: TeamMessageProps): import("react").JSX.Element;
+export declare function TeamMessage({ senderName, memberId, human, body, occurredAt, mentionNames, senderTitle, grouped, attachments, loadAttachment, t, onOpenRef, onResolveTaskRefs, children }: TeamMessageProps): import("react").JSX.Element;
 //# sourceMappingURL=TeamMessage.d.ts.map

package/packages/client-agent-team/lib/types/client/TeamMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TeamMessage.d.ts","sourceRoot":"","sources":["../../../src/client/TeamMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAEpE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAIvE,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,QAAQ,EAAE,iBAAiB,CAAA;IACpC,wEAAwE;IACxE,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAA;IACvB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAA;IAC5B,uFAAuF;IACvF,QAAQ,CAAC,YAAY,CAAC,EAAE,SAAS,MAAM,EAAE,CAAA;IACzC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;IAC7B,8EAA8E;IAC9E,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;CAC9B;AAED,kFAAkF;AAClF,wBAAgB,WAAW,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,gBAAgB,+BAsC5I"}
+{"version":3,"file":"TeamMessage.d.ts","sourceRoot":"","sources":["../../../src/client/TeamMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA2F,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAE/H,OAAO,KAAK,EAAE,iBAAiB,EAAE,0BAA0B,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAA;AACrH,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAEvD,OAAO,EAA4E,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAI/H,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,QAAQ,EAAE,iBAAiB,CAAA;IACpC,wEAAwE;IACxE,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAA;IACvB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAA;IAC5B,uFAAuF;IACvF,QAAQ,CAAC,YAAY,CAAC,EAAE,SAAS,MAAM,EAAE,CAAA;IACzC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;IAC7B,8EAA8E;IAC9E,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,CAAC,WAAW,CAAC,EAAE,SAAS,0BAA0B,EAAE,GAAG,SAAS,CAAA;IACxE,6EAA6E;IAC7E,QAAQ,CAAC,cAAc,CAAC,EAAE,qBAAqB,CAAC,eAAe,CAAC,GAAG,SAAS,CAAA;IAC5E,QAAQ,CAAC,CAAC,CAAC,EAAE,qBAAqB,CAAC,GAAG,CAAC,GAAG,SAAS,CAAA;IACnD,0FAA0F;IAC1F,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,CAAA;IACxD,sFAAsF;IACtF,QAAQ,CAAC,iBAAiB,CAAC,EAAE,CAAC,CAAC,QAAQ,EAAE,SAAS,gBAAgB,EAAE,KAAK,OAAO,CAAC,SAAS,eAAe,EAAE,CAAC,CAAC,GAAG,SAAS,CAAA;IACzH,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;CAC9B;AAED,kFAAkF;AAClF,wBAAgB,WAAW,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,WAAW,EAAE,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,CAAC,EAAE,SAAS,EAAE,iBAAiB,EAAE,QAAQ,EAAE,EAAE,gBAAgB,+BAkG1M"}

package/packages/client-agent-team/lib/types/client/TeamMessage.js

@@ -1,24 +1,162 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment } from 'react';
-import { MarkdownText, MessageText } from '@deepseek-ai/dsh-client-ui-primitives';
-import { formatMessageTime, isPlainTextBody, memberHue, splitMentionNames } from "./team-formatters.js";
+import { Fragment, useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
+import { MarkdownText, MessageText, Modal } from '@deepseek-ai/dsh-client-ui-primitives';
+import { cachedAttachmentDataUrl, formatByteSize, loadAttachmentDataUrl } from "./attachment-preview.js";
+import { cachedResolvedTaskRef, resolveUnknownTaskRefs, useResolvedTaskRefVersion } from "./task-refs.js";
+import { formatMessageTime, isPlainTextBody, memberHue, splitBrandedRefs, splitMentionNames, stripAttachmentLines } from "./team-formatters.js";
 import css from './conversation.module.css';
 /** One chat message row with identity chrome and sender-appropriate rendering. */
-export function TeamMessage({ senderName, memberId, human, body, occurredAt, mentionNames, senderTitle, grouped, children }) {
+export function TeamMessage({ senderName, memberId, human, body, occurredAt, mentionNames, senderTitle, grouped, attachments, loadAttachment, t, onOpenRef, onResolveTaskRefs, children }) {
     const avatarStyle = human ? undefined : { '--team-avatar-hue': memberHue(memberId) };
-    // Literal bodies carry the chips inline — Human input always, and plain-
-    // prose Agent bodies where literal rendering loses nothing. Rich Markdown
-    // Agent bodies fall back to the trailing chip row: the Markdown primitive
-    // renders block-level documents, so chips cannot interleave mid-paragraph.
-    const inline = (human || isPlainTextBody(body)) && mentionNames !== undefined && mentionNames.length > 0
-        ? splitMentionNames(body, mentionNames)
+    // Literal bodies carry mention chips inline — Human input always, and
+    // plain-prose Agent bodies where literal rendering loses nothing. Rich
+    // Markdown keeps unmatched structured mentions in the trailing row.
+    // The stored body carries machine-facing `[attachment] <path>` prompt lines;
+    // humans see the attachment strip rendered from the message metadata instead.
+    const displayBody = stripAttachmentLines(body) === '' ? body : stripAttachmentLines(body);
+    const inline = (human || isPlainTextBody(displayBody)) && mentionNames !== undefined && mentionNames.length > 0
+        ? splitMentionNames(displayBody, mentionNames)
         : undefined;
     const fallbackNames = inline === undefined ? (mentionNames ?? []) : inline.unmatched;
+    const richAgentBody = !human && !isPlainTextBody(displayBody);
+    // Non-Task branded refs retain the legacy fallback row. Task refs instead
+    // stay at their authored prose position; unresolved refs remain literal.
+    const fallbackRefs = richAgentBody && onOpenRef !== undefined
+        ? splitBrandedRefs(displayBody).filter(segment => segment.ref !== undefined && !segment.ref.startsWith('task:')).map(segment => segment.ref)
+        : [];
+    // Resolved refs re-label once the Host lookup lands; the version token
+    // refreshes literal links and rendered Markdown prose.
+    const refVersion = useResolvedTaskRefVersion();
+    const bodyTaskRefs = onOpenRef === undefined || richAgentBody ? [] : splitBrandedRefs(displayBody)
+        .filter(segment => segment.ref !== undefined && segment.ref.startsWith('task:'))
+        .map(segment => segment.ref);
+    const bodyTaskRefKey = bodyTaskRefs.join(',');
+    useEffect(() => {
+        if (onResolveTaskRefs === undefined || bodyTaskRefKey === '')
+            return;
+        void resolveUnknownTaskRefs(bodyTaskRefs, onResolveTaskRefs);
+    }, [onResolveTaskRefs, bodyTaskRefKey, refVersion]);
+    const taskLabel = useCallback((taskNumber) => t?.('taskLabel', { number: taskNumber }) ?? `Task #${taskNumber}`, [t]);
+    const markdownRef = useRef(null);
+    useLayoutEffect(() => {
+        const root = markdownRef.current;
+        if (!richAgentBody || root === null || onOpenRef === undefined)
+            return;
+        const textNodes = markdownProseTextNodes(root);
+        const taskRefs = [...new Set(textNodes.flatMap(node => splitBrandedRefs(node.data)
+                .filter(segment => segment.ref?.startsWith('task:') === true)
+                .map(segment => segment.ref)))];
+        if (onResolveTaskRefs !== undefined && taskRefs.length > 0)
+            void resolveUnknownTaskRefs(taskRefs, onResolveTaskRefs);
+        for (const node of textNodes)
+            renderResolvedMarkdownTaskRefs(node, taskLabel);
+        for (const button of root.querySelectorAll('button[data-task-ref]')) {
+            const taskRef = button.dataset.taskRef;
+            const hit = taskRef === undefined ? undefined : cachedResolvedTaskRef(taskRef);
+            if (taskRef !== undefined && hit !== undefined)
+                button.textContent = taskLabel(hit.taskNumber);
+        }
+    }, [richAgentBody, onOpenRef, onResolveTaskRefs, refVersion, taskLabel]);
+    useEffect(() => {
+        const root = markdownRef.current;
+        if (!richAgentBody || root === null || onOpenRef === undefined)
+            return;
+        const openTask = (event) => {
+            const target = event.target;
+            if (!(target instanceof Element))
+                return;
+            const button = target.closest('button[data-task-ref]');
+            if (button === null || !root.contains(button))
+                return;
+            const taskRef = button instanceof HTMLElement ? button.dataset.taskRef : undefined;
+            if (taskRef !== undefined)
+                onOpenRef(taskRef);
+        };
+        root.addEventListener('click', openTask);
+        return () => { root.removeEventListener('click', openTask); };
+    }, [richAgentBody, onOpenRef]);
     return (_jsxs("article", { className: css.messageRow, "data-human": human || undefined, "data-grouped": grouped || undefined, children: [_jsx("div", { className: css.messageIdentity, style: avatarStyle, "aria-hidden": "true", children: senderName.replace('@', '').slice(0, 1).toUpperCase() }), _jsxs("div", { className: css.messageBody, children: [!grouped && (_jsxs("div", { className: css.nameRow, children: [_jsx("strong", { ...(senderTitle === undefined ? {} : { title: senderTitle }), children: senderName }), occurredAt !== undefined && _jsx("span", { className: css.messageTime, children: formatMessageTime(occurredAt) })] })), inline !== undefined
                         ? _jsx("div", { className: css.messageText, children: inline.segments.map((segment, index) => segment.mention
                                 ? _jsx("span", { className: css.mention, children: segment.text }, index)
-                                : _jsx(Fragment, { children: segment.text }, index)) })
-                        : human
-                            ? _jsx("div", { className: css.messageText, children: _jsx(MessageText, { text: body }) })
-                            : _jsx("div", { className: css.messageMarkdown, children: _jsx(MarkdownText, { text: body }) }), fallbackNames.length > 0 && (_jsx("div", { className: css.mentionsRow, children: fallbackNames.map(name => _jsxs("span", { className: css.mention, children: ["@", name] }, name)) })), children] })] }));
+                                : _jsx(Fragment, { children: renderRefs(segment.text, onOpenRef, taskLabel) }, index)) })
+                        : human || (onOpenRef !== undefined && isPlainTextBody(displayBody) && splitBrandedRefs(displayBody).some(segment => segment.ref !== undefined))
+                            ? _jsx("div", { className: css.messageText, children: onOpenRef === undefined ? _jsx(MessageText, { text: displayBody }) : renderRefs(displayBody, onOpenRef, taskLabel) })
+                            : _jsx("div", { ref: markdownRef, className: css.messageMarkdown, children: _jsx(MarkdownText, { text: displayBody }, `${displayBody}:${onOpenRef === undefined ? 'literal' : 'refs'}`) }), (fallbackNames.length > 0 || fallbackRefs.length > 0) && (_jsxs("div", { className: css.mentionsRow, children: [fallbackNames.map(name => _jsxs("span", { className: css.mention, children: ["@", name] }, name)), fallbackRefs.map(ref => {
+                                const resolved = cachedResolvedTaskRef(ref);
+                                const label = resolved !== undefined && ref.startsWith('task:') ? taskLabel(resolved.taskNumber) : ref;
+                                return _jsx("button", { type: "button", className: css.refLink, title: ref, onClick: () => { onOpenRef(ref); }, children: label }, ref);
+                            })] })), attachments !== undefined && attachments.length > 0 && _jsx(TeamAttachmentStrip, { attachments: attachments, ...(loadAttachment === undefined ? {} : { loadAttachment }), ...(t === undefined ? {} : { t }) }), children] })] }));
+}
+/** Text nodes that Markdown rendered as prose rather than code or a link. */
+function markdownProseTextNodes(root) {
+    const nodes = [];
+    const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT);
+    for (let node = walker.nextNode(); node !== null; node = walker.nextNode()) {
+        const parent = node.parentElement;
+        if (parent !== null && parent.closest('code, pre, a, button') === null)
+            nodes.push(node);
+    }
+    return nodes;
+}
+/** Replace resolved refs in one prose text node without changing Markdown structure. */
+function renderResolvedMarkdownTaskRefs(node, taskLabel) {
+    const segments = splitBrandedRefs(node.data);
+    if (!segments.some(segment => segment.ref?.startsWith('task:') === true && cachedResolvedTaskRef(segment.ref) !== undefined))
+        return;
+    const fragment = document.createDocumentFragment();
+    for (const segment of segments) {
+        const taskRef = segment.ref?.startsWith('task:') === true ? segment.ref : undefined;
+        if (taskRef === undefined) {
+            fragment.append(segment.text);
+            continue;
+        }
+        const resolved = cachedResolvedTaskRef(taskRef);
+        if (resolved === undefined) {
+            fragment.append(segment.text);
+            continue;
+        }
+        const button = document.createElement('button');
+        button.type = 'button';
+        if (css.refLink !== undefined)
+            button.className = css.refLink;
+        button.dataset.taskRef = taskRef;
+        button.title = taskRef;
+        button.textContent = taskLabel(resolved.taskNumber);
+        fragment.append(button);
+    }
+    node.replaceWith(fragment);
+}
+/** Render one literal text run, linkifying branded refs when navigation is available. */
+function renderRefs(text, onOpenRef, taskLabel) {
+    if (onOpenRef === undefined)
+        return text;
+    return splitBrandedRefs(text).map((segment, index) => {
+        if (segment.ref === undefined)
+            return _jsx(Fragment, { children: segment.text }, index);
+        const resolved = cachedResolvedTaskRef(segment.ref);
+        const label = resolved !== undefined && segment.ref.startsWith('task:') ? taskLabel(resolved.taskNumber) : segment.ref;
+        return _jsx("button", { type: "button", className: css.refLink, title: segment.ref, onClick: () => { onOpenRef(segment.ref); }, children: label }, index);
+    });
+}
+/** One message's attachment strip: image thumbnails with a large view, or name chips when bytes are gone. */
+function TeamAttachmentStrip({ attachments, loadAttachment, t }) {
+    const [zoomed, setZoomed] = useState();
+    return _jsxs("div", { className: css.attachmentStrip, children: [attachments.map(attachment => _jsx(TeamAttachment, { attachment: attachment, ...(loadAttachment === undefined ? {} : { loadAttachment }), ...(t === undefined ? {} : { t }), onZoom: setZoomed }, attachment.attachmentId)), zoomed !== undefined && _jsx(Modal, { open: true, ...(css.attachmentModal === undefined ? {} : { className: css.attachmentModal }), title: zoomed.name, onClose: () => { setZoomed(undefined); }, children: _jsx("img", { className: css.attachmentZoom, src: cachedAttachmentDataUrl(zoomed.attachmentId) ?? undefined, alt: zoomed.name }) })] });
+}
+function TeamAttachment({ attachment, loadAttachment, t, onZoom }) {
+    const wantsPreview = loadAttachment !== undefined && attachment.mediaType.startsWith('image/');
+    const [dataUrl, setDataUrl] = useState(wantsPreview ? cachedAttachmentDataUrl(attachment.attachmentId) : null);
+    useEffect(() => {
+        if (!wantsPreview || dataUrl !== undefined)
+            return;
+        let mounted = true;
+        void loadAttachmentDataUrl(loadAttachment, attachment).then(url => { if (mounted)
+            setDataUrl(url); });
+        return () => { mounted = false; };
+    }, [wantsPreview, dataUrl, loadAttachment, attachment]);
+    const expired = t?.('attachmentExpired') ?? 'File no longer cached';
+    if (wantsPreview && dataUrl !== null) {
+        return _jsx("button", { type: "button", className: css.attachmentThumb, "aria-label": t?.('viewImage', { name: attachment.name }) ?? attachment.name, title: attachment.name, onClick: () => { onZoom(attachment); }, children: _jsx("img", { src: dataUrl, alt: attachment.name }) });
+    }
+    return _jsxs("span", { className: css.attachmentChip, title: wantsPreview ? expired : `${attachment.name} · ${formatByteSize(attachment.byteSize)}`, children: [_jsx("span", { className: css.attachmentChipName, children: attachment.name }), _jsx("span", { className: css.attachmentChipSize, children: wantsPreview ? expired : formatByteSize(attachment.byteSize) })] });
 }

package/packages/client-agent-team/lib/types/client/TeamRunDivider.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Explicit boundary between two same-sender Messages of one run separated by
+ * a real waiting gap: the hairline restores the block boundary that grouping
+ * removed, and the label below it restores the instant that the suppressed
+ * identity chrome would have shown.
+ */
+export declare function TeamRunDivider({ occurredAt }: {
+    readonly occurredAt: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=TeamRunDivider.d.ts.map

package/packages/client-agent-team/lib/types/client/TeamRunDivider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TeamRunDivider.d.ts","sourceRoot":"","sources":["../../../src/client/TeamRunDivider.tsx"],"names":[],"mappings":"AAGA;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,EAAE,UAAU,EAAE,EAAE;IAAE,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;CAAE,+BAM7E"}

package/packages/client-agent-team/lib/types/client/TeamRunDivider.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { formatMessageTime } from "./team-formatters.js";
+import css from './conversation.module.css';
+/**
+ * Explicit boundary between two same-sender Messages of one run separated by
+ * a real waiting gap: the hairline restores the block boundary that grouping
+ * removed, and the label below it restores the instant that the suppressed
+ * identity chrome would have shown.
+ */
+export function TeamRunDivider({ occurredAt }) {
+    return (_jsx("div", { className: css.runDivider, role: "separator", children: _jsx("time", { dateTime: occurredAt, children: formatMessageTime(occurredAt) }) }));
+}

package/packages/client-agent-team/lib/types/client/TeamThreadPage.d.ts

@@ -1,6 +1,7 @@
 import type { AgentTeamChannelRef, AgentTeamTaskRef, AgentTeamThreadRef } from '@wowyuarm/dsh-agent-team/types';
 import type { WorkspaceId } from '@deepseek-ai/dsh-client-runtime/client';
 import type { TeamConversationProps } from './slots.ts';
+import type { TeamDraftStore } from './drafts.ts';
 interface TeamThreadPageProps {
     readonly workspaceId: WorkspaceId;
     readonly channelRef?: AgentTeamChannelRef;
@@ -13,8 +14,14 @@ interface TeamThreadPageProps {
     readonly loadThreadHistory: TeamConversationProps['loadThreadHistory'];
     readonly subscribeChanges: TeamConversationProps['subscribeChanges'];
     readonly loadMembers: TeamConversationProps['loadMembers'];
+    readonly drafts: TeamDraftStore;
+    readonly getAttachment: TeamConversationProps['getAttachment'];
     readonly reply: TeamConversationProps['reply'];
     readonly changeTask: TeamConversationProps['changeTask'];
+    readonly putAttachment: TeamConversationProps['putAttachment'];
+    readonly selectChannel: TeamConversationProps['selectChannel'];
+    readonly selectThread: TeamConversationProps['selectThread'];
+    readonly resolveTaskRefs: TeamConversationProps['resolveTaskRefs'];
     readonly t: TeamConversationProps['t'];
 }
 export declare function TeamThreadPage(props: TeamThreadPageProps): import("react").JSX.Element;

package/packages/client-agent-team/lib/types/client/TeamThreadPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TeamThreadPage.d.ts","sourceRoot":"","sources":["../../../src/client/TeamThreadPage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,mBAAmB,EAInB,gBAAgB,EAGhB,kBAAkB,EAEnB,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAA;AAEzE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAUvD,UAAU,mBAAmB;IAC3B,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAA;IACjC,QAAQ,CAAC,UAAU,CAAC,EAAE,mBAAmB,CAAA;IACzC,QAAQ,CAAC,OAAO,EAAE,gBAAgB,CAAA;IAClC,QAAQ,CAAC,SAAS,EAAE,kBAAkB,CAAA;IACtC,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAA;IAC5B,QAAQ,CAAC,eAAe,EAAE,qBAAqB,CAAC,iBAAiB,CAAC,CAAA;IAClE,QAAQ,CAAC,YAAY,EAAE,qBAAqB,CAAC,cAAc,CAAC,CAAA;IAC5D,QAAQ,CAAC,UAAU,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IACxD,QAAQ,CAAC,iBAAiB,EAAE,qBAAqB,CAAC,mBAAmB,CAAC,CAAA;IACtE,QAAQ,CAAC,gBAAgB,EAAE,qBAAqB,CAAC,kBAAkB,CAAC,CAAA;IACpE,QAAQ,CAAC,WAAW,EAAE,qBAAqB,CAAC,aAAa,CAAC,CAAA;IAC1D,QAAQ,CAAC,KAAK,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAA;IAC9C,QAAQ,CAAC,UAAU,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IACxD,QAAQ,CAAC,CAAC,EAAE,qBAAqB,CAAC,GAAG,CAAC,CAAA;CACvC;AA8BD,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,+BA8dxD"}
+{"version":3,"file":"TeamThreadPage.d.ts","sourceRoot":"","sources":["../../../src/client/TeamThreadPage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAGV,mBAAmB,EAInB,gBAAgB,EAGhB,kBAAkB,EAEnB,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAA;AAEzE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AACvD,OAAO,KAAK,EAAgB,cAAc,EAAE,MAAM,aAAa,CAAA;AAa/D,UAAU,mBAAmB;IAC3B,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAA;IACjC,QAAQ,CAAC,UAAU,CAAC,EAAE,mBAAmB,CAAA;IACzC,QAAQ,CAAC,OAAO,EAAE,gBAAgB,CAAA;IAClC,QAAQ,CAAC,SAAS,EAAE,kBAAkB,CAAA;IACtC,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAA;IAC5B,QAAQ,CAAC,eAAe,EAAE,qBAAqB,CAAC,iBAAiB,CAAC,CAAA;IAClE,QAAQ,CAAC,YAAY,EAAE,qBAAqB,CAAC,cAAc,CAAC,CAAA;IAC5D,QAAQ,CAAC,UAAU,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IACxD,QAAQ,CAAC,iBAAiB,EAAE,qBAAqB,CAAC,mBAAmB,CAAC,CAAA;IACtE,QAAQ,CAAC,gBAAgB,EAAE,qBAAqB,CAAC,kBAAkB,CAAC,CAAA;IACpE,QAAQ,CAAC,WAAW,EAAE,qBAAqB,CAAC,aAAa,CAAC,CAAA;IAC1D,QAAQ,CAAC,MAAM,EAAE,cAAc,CAAA;IAC/B,QAAQ,CAAC,aAAa,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAA;IAC9D,QAAQ,CAAC,KAAK,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAA;IAC9C,QAAQ,CAAC,UAAU,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IACxD,QAAQ,CAAC,aAAa,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAA;IAC9D,QAAQ,CAAC,aAAa,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAA;IAC9D,QAAQ,CAAC,YAAY,EAAE,qBAAqB,CAAC,cAAc,CAAC,CAAA;IAC5D,QAAQ,CAAC,eAAe,EAAE,qBAAqB,CAAC,iBAAiB,CAAC,CAAA;IAClE,QAAQ,CAAC,CAAC,EAAE,qBAAqB,CAAC,GAAG,CAAC,CAAA;CACvC;AA8BD,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,+BAgkBxD"}