@kortix/ui 0.14.7 → 0.14.9

package/dist/session/turn/channel-brand.d.ts

@@ -10,13 +10,18 @@ import type { ChannelPlatform } from './channel-message.js';
  * The hues are the platforms' own brand colors, not themeable tokens — which
  * is why they live here as named constants rather than as classes. Slack has
  * none to tint a label with: its mark is four colors and its wordmark is the
- * text color, black or white. It was Material pink (#E91E63).
+ * text color, black or white. It was Material pink (#E91E63). Email is no
+ * brand: its envelope and its label take the text color too.
  */
 export declare const CHANNEL_BRAND_COLOR: Record<ChannelPlatform, string | undefined>;
-/** The platform's own mark, in its brand colors. */
+/**
+ * The platform's own mark, in its brand colors. Email draws the envelope an
+ * email session wears in the sidebar. A platform this build does not know (a
+ * newer `@kortix/shared`) draws a neutral chat glyph, never another brand.
+ */
 export declare function ChannelBrandMark({ platform, className, }: {
     platform: ChannelPlatform;
     className?: string;
 }): import("react").JSX.Element;
-/** The platform's display name; only Teams has a catalog string (its full name). */
+/** The platform's display name: Teams (its full name) and Email have catalog strings, the brands are their own words. */
 export declare function channelPlatformLabel(platform: ChannelPlatform, tI18nComplete: UiTranslator): string;

package/dist/session/turn/channel-brand.js

@@ -1,5 +1,7 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
+import { ChatCircleIcon } from '@phosphor-icons/react';
+import { Email } from '../../internal/icons/email.js';
 import { MicrosoftTeams } from '../../internal/icons/microsoft-teams.js';
 import { Slack } from '../../internal/icons/slack.js';
 /**
@@ -12,23 +14,37 @@ import { Slack } from '../../internal/icons/slack.js';
  * The hues are the platforms' own brand colors, not themeable tokens — which
  * is why they live here as named constants rather than as classes. Slack has
  * none to tint a label with: its mark is four colors and its wordmark is the
- * text color, black or white. It was Material pink (#E91E63).
+ * text color, black or white. It was Material pink (#E91E63). Email is no
+ * brand: its envelope and its label take the text color too.
  */
 export const CHANNEL_BRAND_COLOR = {
     Telegram: '#29B6F6',
     Slack: undefined,
     Teams: '#5B5FC7',
+    Email: undefined,
 };
 const TELEGRAM_PATH = 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm4.64 6.8c-.15 1.58-.8 5.42-1.13 7.19-.14.75-.42 1-.68 1.03-.58.05-1.02-.38-1.58-.75-.88-.58-1.38-.94-2.23-1.5-.99-.65-.35-1.01.22-1.59.15-.15 2.71-2.48 2.76-2.69a.2.2 0 00-.05-.18c-.06-.05-.14-.03-.21-.02-.09.02-1.49.95-4.22 2.79-.4.27-.76.41-1.08.4-.36-.01-1.04-.2-1.55-.37-.63-.2-1.12-.31-1.08-.66.02-.18.27-.36.74-.55 2.92-1.27 4.86-2.11 5.83-2.51 2.78-1.16 3.35-1.36 3.73-1.36.08 0 .27.02.39.12.1.08.13.19.14.27-.01.06.01.24 0 .38z';
-/** The platform's own mark, in its brand colors. */
+/**
+ * The platform's own mark, in its brand colors. Email draws the envelope an
+ * email session wears in the sidebar. A platform this build does not know (a
+ * newer `@kortix/shared`) draws a neutral chat glyph, never another brand.
+ */
 export function ChannelBrandMark({ platform, className = 'size-3.5 shrink-0', }) {
     if (platform === 'Teams')
         return _jsx(MicrosoftTeams, { className: className });
     if (platform === 'Slack')
         return _jsx(Slack, { className: className });
+    if (platform === 'Email')
+        return _jsx(Email, { className: className });
+    if (platform !== 'Telegram')
+        return _jsx(ChatCircleIcon, { className: className, "aria-hidden": "true" });
     return (_jsx("svg", { className: className, viewBox: "0 0 24 24", fill: CHANNEL_BRAND_COLOR.Telegram, "aria-hidden": "true", children: _jsx("path", { d: TELEGRAM_PATH }) }));
 }
-/** The platform's display name; only Teams has a catalog string (its full name). */
+/** The platform's display name: Teams (its full name) and Email have catalog strings, the brands are their own words. */
 export function channelPlatformLabel(platform, tI18nComplete) {
-    return platform === 'Teams' ? tI18nComplete.raw('texta7b52b269a23') : platform;
+    if (platform === 'Teams')
+        return tI18nComplete.raw('texta7b52b269a23');
+    if (platform === 'Email')
+        return tI18nComplete.raw('text969ccbd3cf63');
+    return platform;
 }

package/dist/session/turn/message-author-label.js

@@ -9,6 +9,7 @@ import { useTranslations } from '../../i18n/index.js';
 import { useProjectSessionHref } from '../../internal/lib/navigation/session-href.js';
 import { CheckIcon } from '@phosphor-icons/react';
 import { KortixLogo } from '../../primitives/kortix-logo.js';
+import { AgentMark } from '../../internal/components/agent-mark.js';
 import { SourceCard, SourcePill } from './source-pill.js';
 /** The sending session's name, as a link to it when the project route resolves. */
 function SenderName({ sessionId, name }) {
@@ -23,7 +24,7 @@ export function MessageAuthorLabel({ author }) {
     if (author.kind === 'session') {
         return _jsx(SessionAuthorLabel, { author: author });
     }
-    return (_jsxs("span", { className: "text-muted-foreground flex items-center gap-1.5 text-xs font-medium", "data-testid": "message-author", children: [_jsx(UserAvatar, { email: author.email ?? '', name: author.name, size: "xs" }), author.name] }));
+    return (_jsxs("span", { className: "text-muted-foreground flex items-center gap-1.5 text-xs font-medium", "data-testid": "message-author", children: [_jsx(UserAvatar, { email: author.email ?? '', name: author.name, hint: author.name, size: "xs" }), author.name] }));
 }
 /**
  * A prompt another Kortix session sent (`kortix sessions new`, a coordinator,
@@ -43,7 +44,10 @@ function SessionAuthorLabel({ author }) {
                     label: tI18nComplete('text6959b4159575'),
                     value: _jsx(SenderName, { sessionId: author.session_id, name: sessionName }),
                 },
-                { label: tI18nComplete('text11b39c93777e'), value: author.agent },
+                {
+                    label: tI18nComplete('text11b39c93777e'),
+                    value: author.agent ? (_jsxs("span", { className: "inline-flex items-center gap-1.5", children: [_jsx(AgentMark, { slug: author.agent }), author.agent] })) : null,
+                },
                 {
                     label: tI18nComplete('textcb9ac5c561da'),
                     value: author.session_id ? _jsx(CopySessionId, { sessionId: author.session_id }) : null,

package/dist/session/turn/message-author.d.ts

@@ -44,4 +44,12 @@ export declare function stoppedByName(data: SessionMessageAuthors | undefined, m
 export declare function awaitsAgent(prompt: {
     no_reply?: boolean;
 }): boolean;
+/**
+ * The user messages the viewer may edit and rewind to: their own, with no
+ * other person's message after it (a rewind deletes everything after the
+ * target). An agent's message, or one with no recorded author, belongs to the
+ * thread's starter and never blocks a later rewind. The server applies the same
+ * rule (`rewind-authority.ts`). Null with no viewer id: nothing to filter on.
+ */
+export declare function rewindableMessageIds(messageIds: readonly string[], authors: ReadonlyMap<string, SessionMessageAuthor>, viewerId: string | undefined, starterId: string | null | undefined): Set<string> | null;
 export {};

package/dist/session/turn/message-author.js

@@ -73,3 +73,27 @@ export function stoppedByName(data, messageId, viewerId) {
 export function awaitsAgent(prompt) {
     return !prompt.no_reply;
 }
+/**
+ * The user messages the viewer may edit and rewind to: their own, with no
+ * other person's message after it (a rewind deletes everything after the
+ * target). An agent's message, or one with no recorded author, belongs to the
+ * thread's starter and never blocks a later rewind. The server applies the same
+ * rule (`rewind-authority.ts`). Null with no viewer id: nothing to filter on.
+ */
+export function rewindableMessageIds(messageIds, authors, viewerId, starterId) {
+    if (viewerId === undefined)
+        return null;
+    const allowed = new Set();
+    for (let i = messageIds.length - 1; i >= 0; i--) {
+        const author = authors.get(messageIds[i]);
+        if (author?.kind === 'member') {
+            if (author.user_id !== viewerId)
+                break;
+            allowed.add(messageIds[i]);
+        }
+        else if (!starterId || starterId === viewerId) {
+            allowed.add(messageIds[i]);
+        }
+    }
+    return allowed;
+}

package/dist/session/turn/message-row.d.ts

@@ -0,0 +1,52 @@
+import type { ReactNode } from 'react';
+/**
+ * A message body's type: the app's default `text-sm` at 500. A row's markdown
+ * answer is set to `text-sm` too (`MessageRow`'s body), so a prompt, its answer
+ * and the channel row of the same prompt read at one size and weight. The 600
+ * name above it, at the same size, carries the row's hierarchy.
+ */
+export declare const MESSAGE_TEXT_CLASS = "text-foreground text-sm leading-relaxed font-medium";
+/**
+ * One message in a channel or a thread: the author's 36px avatar in a fixed
+ * gutter, the name and the time on one baseline, the body under them. The
+ * channel timeline and the thread panel draw every row with it, so a reply
+ * reads the same as the message it answers.
+ *
+ * A `compact` row continues the author's previous message: no avatar, no
+ * name. Its time shows in the gutter on hover, inside the gutter's own width,
+ * so it never touches the body.
+ *
+ * The hover fill is instant: a dense list re-hovers too often to animate.
+ */
+export declare function MessageRow({ avatar, name, time, compact, selected, toolbar, className, children, }: {
+    /** The 36px avatar: `UserAvatar size="lg"` for a person, `EntityAvatar size="lg"` for an agent. */
+    avatar?: ReactNode;
+    name?: ReactNode;
+    /** `label` beside the name; `gutter` (a shorter form) in a compact row's gutter; `title`, the full date, in the hover hint. */
+    time?: {
+        iso: string;
+        label: string;
+        gutter?: string;
+        title: string;
+    } | null;
+    compact?: boolean;
+    selected?: boolean;
+    /** The row's actions, floating at its top-right on hover or keyboard focus. */
+    toolbar?: ReactNode;
+    className?: string;
+    children?: ReactNode;
+}): import("react").JSX.Element;
+/**
+ * The floating action group at a row's top-right. Transparent, not unmounted,
+ * so Tab reaches its buttons and their focus reveals it. `p-[2px]`: the group
+ * is `rounded-lg` (10px), so 2px of inset gives the `rounded-md` (8px)
+ * buttons concentric corners. Its buttons are `icon-sm` (h-7), so the group is
+ * ~32px tall; `-top-3.5` sits it on the row's top edge, half above it.
+ *
+ * A thread's first message is the one row whose overhang is cut off (its turn
+ * paints with `content-visibility: auto`, which clips to the turn): that row
+ * moves the group inside with `[&_[data-slot=row-toolbar]]:top-0.5`.
+ */
+export declare function RowToolbar({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;

package/dist/session/turn/message-row.js

@@ -0,0 +1,44 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../../lib/utils.js';
+import Hint from '../../primitives/hint.js';
+/**
+ * A message body's type: the app's default `text-sm` at 500. A row's markdown
+ * answer is set to `text-sm` too (`MessageRow`'s body), so a prompt, its answer
+ * and the channel row of the same prompt read at one size and weight. The 600
+ * name above it, at the same size, carries the row's hierarchy.
+ */
+export const MESSAGE_TEXT_CLASS = 'text-foreground text-sm leading-relaxed font-medium';
+/**
+ * One message in a channel or a thread: the author's 36px avatar in a fixed
+ * gutter, the name and the time on one baseline, the body under them. The
+ * channel timeline and the thread panel draw every row with it, so a reply
+ * reads the same as the message it answers.
+ *
+ * A `compact` row continues the author's previous message: no avatar, no
+ * name. Its time shows in the gutter on hover, inside the gutter's own width,
+ * so it never touches the body.
+ *
+ * The hover fill is instant: a dense list re-hovers too often to animate.
+ */
+export function MessageRow({ avatar, name, time, compact = false, selected = false, toolbar, className, children, }) {
+    return (_jsxs("div", { "data-slot": "message-row", className: cn('group/message hover:bg-hover relative flex gap-2 px-5', 
+        // Baseline: a compact row's gutter time sits on the body's first line.
+        compact ? 'items-baseline py-0.5' : 'items-start pt-2 pb-1.5', selected && 'bg-active hover:bg-active', className), children: [_jsx("div", { className: "w-10 shrink-0 [&_[data-slot=avatar]]:rounded-md [&_[data-slot=avatar]]:after:hidden", children: compact ? (time ? (_jsx(Hint, { label: time.title, side: "top", sideOffset: 6, children: _jsx("time", { dateTime: time.iso, className: "text-muted-foreground invisible block cursor-default text-right text-xs font-normal whitespace-nowrap tabular-nums group-focus-within/message:visible group-hover/message:visible", children: time.gutter ?? time.label }) })) : null) : (avatar) }), _jsxs("div", { className: "min-w-0 flex-1 [&_.kortix-markdown]:text-sm", children: [compact ? null : (_jsxs("div", { className: "flex min-w-0 items-baseline gap-2", children: [_jsx("span", { className: "text-foreground truncate text-sm font-semibold", children: name }), time ? (
+                            // The full date in the app's tooltip, not the browser's `title`.
+                            _jsx(Hint, { label: time.title, side: "top", sideOffset: 6, children: _jsx("time", { dateTime: time.iso, className: "text-muted-foreground shrink-0 cursor-default text-xs font-normal tabular-nums", children: time.label }) })) : null] })), children] }), toolbar ? _jsx(RowToolbar, { children: toolbar }) : null] }));
+}
+/**
+ * The floating action group at a row's top-right. Transparent, not unmounted,
+ * so Tab reaches its buttons and their focus reveals it. `p-[2px]`: the group
+ * is `rounded-lg` (10px), so 2px of inset gives the `rounded-md` (8px)
+ * buttons concentric corners. Its buttons are `icon-sm` (h-7), so the group is
+ * ~32px tall; `-top-3.5` sits it on the row's top edge, half above it.
+ *
+ * A thread's first message is the one row whose overhang is cut off (its turn
+ * paints with `content-visibility: auto`, which clips to the turn): that row
+ * moves the group inside with `[&_[data-slot=row-toolbar]]:top-0.5`.
+ */
+export function RowToolbar({ children }) {
+    return (_jsx("div", { "data-slot": "row-toolbar", className: "bg-popover pointer-events-none absolute -top-3.5 right-5 z-10 flex items-center rounded-lg border p-[2px] opacity-0 shadow-md group-focus-within/message:pointer-events-auto group-focus-within/message:opacity-100 group-hover/message:pointer-events-auto group-hover/message:opacity-100 has-[[data-state=open]]:pointer-events-auto has-[[data-state=open]]:opacity-100", children: children }));
+}

package/dist/session/turn/plan-anchor.d.ts

@@ -20,13 +20,14 @@
  * is live, and `chatPlanAnchorId` turns this whole module off for the other.
  * See `action-panel/easy/plan-card.tsx`.
  *
- * No React import. Every rule here is unit-tested in plan-anchor.test.ts.
+ * No React import.
  */
 import { type SessionLogTurn } from '@kortix/sdk';
 /**
  * A tool call that writes the plan. The runtime emits more than one spelling
  * (`todowrite`, `todo_write`); `toolKind` owns them. The todo READ shares the
  * kind and never renders (`shouldShowToolPart`), so it is not a plan write.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export declare function isPlanWriteTool(tool: string): boolean;
 /**
@@ -80,6 +81,7 @@ export interface PlanSurfaceState {
      *  whether the panel is OPEN deliberately does not enter into it. */
     isMobile: boolean;
 }
+/** @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode. */
 export declare function planBelongsToChat(state: PlanSurfaceState): boolean;
 /**
  * The anchor the CHAT should use — which is "none" unless the chat is the
@@ -88,5 +90,6 @@ export declare function planBelongsToChat(state: PlanSurfaceState): boolean;
  * The gate wraps the lookup rather than sitting beside it: returning `null` (which matches no message id) means every `ownsPlan`
  * downstream, including the user bubble's own column cap, falls out of ONE
  * decision instead of two that can disagree.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export declare function chatPlanAnchorId(turns: ReadonlyArray<Pick<SessionLogTurn, 'id' | 'plan'>> | null | undefined, chatOwnsPlan: boolean): string | null;

package/dist/session/turn/plan-anchor.js

@@ -20,13 +20,14 @@
  * is live, and `chatPlanAnchorId` turns this whole module off for the other.
  * See `action-panel/easy/plan-card.tsx`.
  *
- * No React import. Every rule here is unit-tested in plan-anchor.test.ts.
+ * No React import.
  */
 import { shouldShowToolPart, toolKind } from '@kortix/sdk';
 /**
  * A tool call that writes the plan. The runtime emits more than one spelling
  * (`todowrite`, `todo_write`); `toolKind` owns them. The todo READ shares the
  * kind and never renders (`shouldShowToolPart`), so it is not a plan write.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export function isPlanWriteTool(tool) {
     return toolKind(tool) === 'todowrite' && shouldShowToolPart({ tool });
@@ -41,6 +42,7 @@ export function isPlanWriteTool(tool) {
 export function planAnchorMessageId(turns) {
     return turns.find((turn) => turn.plan)?.id ?? null;
 }
+/** @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode. */
 export function planBelongsToChat(state) {
     return state.isMobile;
 }
@@ -51,6 +53,7 @@ export function planBelongsToChat(state) {
  * The gate wraps the lookup rather than sitting beside it: returning `null` (which matches no message id) means every `ownsPlan`
  * downstream, including the user bubble's own column cap, falls out of ONE
  * decision instead of two that can disagree.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export function chatPlanAnchorId(turns, chatOwnsPlan) {
     if (!chatOwnsPlan || !turns)

package/dist/session/turn/plan-card.d.ts

@@ -28,6 +28,7 @@ export declare function planRingState(done: number, total: number, running: bool
  * ticks are precise but need counting, a pie is instant but coarse. Together
  * the glyph answers "roughly how far?" at a glance and "exactly how far?" on a
  * second look — at 18px, where a single encoding would have to pick one.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export declare function PlanRing({ done, total, running, className, }: {
     done: number;
@@ -43,8 +44,10 @@ export declare function PlanRing({ done, total, running, className, }: {
  * when a plan sits under it, and `ownsPlan` alone is not that answer: the anchor
  * falls back to the last turn when no turn ever wrote todos, so a session with
  * zero todos still nominates an owner.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export declare function useHasPlan(sessionId: string): boolean;
+/** @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode. */
 export declare function planSummary(todos: ReadonlyArray<{
     status: string;
     content: string;
@@ -71,6 +74,7 @@ export declare function planSummary(todos: ReadonlyArray<{
  * Filtering AFTER `keyTodos` is deliberate. Keying first means the surviving
  * rows keep the keys they had while the running row was present, so React's
  * state stays attached to a row as the agent advances past it.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export declare function planListTodos(keyed: ReadonlyArray<{
     todo: TodoItem;
@@ -84,11 +88,13 @@ export declare function planListTodos(keyed: ReadonlyArray<{
  * repeats a line often enough ("Run the tests" twice) that keying on it alone
  * collides. An occurrence counter disambiguates the repeat, which keeps React's
  * state attached to the row rather than to its position.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export declare function keyTodos(todos: ReadonlyArray<TodoItem>): Array<{
     todo: TodoItem;
     key: string;
 }>;
+/** @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode. */
 export declare function PlanCard({ sessionId }: {
     sessionId: string;
 }): import("react").JSX.Element | null;
@@ -103,6 +109,7 @@ export declare function PlanCard({ sessionId }: {
  *
  * Takes rows already keyed and filtered (`planListTodos(keyTodos(todos))`) —
  * the caller decides what the list is; this decides what it looks like.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export declare function PlanSteps({ rows, className, }: {
     rows: ReadonlyArray<{

package/dist/session/turn/plan-card.js

@@ -200,6 +200,7 @@ const RING_TONE = {
  * ticks are precise but need counting, a pie is instant but coarse. Together
  * the glyph answers "roughly how far?" at a glance and "exactly how far?" on a
  * second look — at 18px, where a single encoding would have to pick one.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export function PlanRing({ done, total, running, className, }) {
     const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
@@ -221,11 +222,13 @@ export function PlanRing({ done, total, running, className, }) {
  * when a plan sits under it, and `ownsPlan` alone is not that answer: the anchor
  * falls back to the last turn when no turn ever wrote todos, so a session with
  * zero todos still nominates an owner.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export function useHasPlan(sessionId) {
     const { data } = useRuntimeSessionTodo(sessionId);
     return parseTodos(data).length > 0;
 }
+/** @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode. */
 export function planSummary(todos) {
     const total = todos.length;
     const done = todos.filter((todo) => todo.status === 'completed').length;
@@ -255,6 +258,7 @@ export function planSummary(todos) {
  * Filtering AFTER `keyTodos` is deliberate. Keying first means the surviving
  * rows keep the keys they had while the running row was present, so React's
  * state stays attached to a row as the agent advances past it.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export function planListTodos(keyed) {
     return keyed.filter(({ todo }) => todo.status !== 'in_progress');
@@ -264,6 +268,7 @@ export function planListTodos(keyed) {
  * repeats a line often enough ("Run the tests" twice) that keying on it alone
  * collides. An occurrence counter disambiguates the repeat, which keeps React's
  * state attached to the row rather than to its position.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export function keyTodos(todos) {
     const seen = new Map();
@@ -273,6 +278,7 @@ export function keyTodos(todos) {
         return { todo, key: n === 0 ? todo.content : `${todo.content}#${n}` };
     });
 }
+/** @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode. */
 export function PlanCard({ sessionId }) {
     const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
     const { data } = useRuntimeSessionTodo(sessionId);
@@ -306,6 +312,7 @@ export function PlanCard({ sessionId }) {
  *
  * Takes rows already keyed and filtered (`planListTodos(keyTodos(todos))`) —
  * the caller decides what the list is; this decides what it looks like.
+ * @deprecated Renders an OpenCode-only tool or todo list in an OpenCode session (pi has none). OpenCode is sunset (2026-10-23): no new code; delete with OpenCode.
  */
 export function PlanSteps({ rows, className, }) {
     return (

package/dist/session/turn/user-message.d.ts

@@ -248,7 +248,13 @@ export declare function UserMessageBubble({ canExpand, expanded, onToggle, fullW
  * Shared with `OptimisticTurn` so the pending turn and the server turn cannot
  * drift — the same reason `MessageAttachments` is shared.
  */
-export declare function UserMessageActions({ timestamp, copyText, messageId, rewindPromptText, onRewind, rewindDisabled, deliveryStatus, }: {
+export declare function UserMessageActions({ timestamp, copyText, messageId, rewindPromptText, onRewind, rewindDisabled, deliveryStatus, toolbar, }: {
+    /**
+     * A message row (`TranscriptRowsContext`): the row's header shows the time,
+     * so the buttons float in its toolbar and only the delivery status stays in
+     * the flow.
+     */
+    toolbar?: boolean;
     /** Epoch milliseconds, or `null` when the backend never stamped one. */
     timestamp: number | null;
     /** Omitted when there is nothing to copy — the row then carries meta alone

package/dist/session/turn/user-message.js

@@ -6,13 +6,15 @@ import { getFileCategory } from '../../files/viewer/preview-policy.js';
 import { uiRoutes } from '../../lib/routes.js';
 import { MessageSenderAbove } from '../participants/session-participants.js';
 import { MessageAuthorLabel } from './message-author-label.js';
+import { MESSAGE_TEXT_CLASS, RowToolbar } from './message-row.js';
+import { TranscriptRowsContext } from '../thread/transcript-rows.js';
 import { errorToast } from '../../primitives/toast.js';
 import { fetchSessionAttachment, isSessionAttachmentRef, } from '@kortix/sdk';
 /** Moved from session-chat.tsx (`UserMessageRow`) so the turn module owns the
  *  user-message card. Full-width card, no reference chips. */
 import { useTranslations } from '../../i18n/index.js';
 import { expandPastedContent, neutralizePastedTags, sanitizePromptUploadFilename, serializePromptWithPastes, splitPastedContent, } from '../../_vendor/kortix-shared.js';
-import { useEffect, useMemo, useRef, useState } from 'react';
+import { useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { PencilSimpleIcon, AlarmIcon, ChatsTeardropIcon, LightningIcon, } from '@phosphor-icons/react';
 import { CopyButton } from '../../markdown/copy-button.js';
 import { HoverPrefetchLink } from '../../internal/components/hover-prefetch-link.js';
@@ -672,7 +674,7 @@ export function UserMessageBubble({ canExpand, expanded, onToggle, fullWidth, te
  * Shared with `OptimisticTurn` so the pending turn and the server turn cannot
  * drift — the same reason `MessageAttachments` is shared.
  */
-export function UserMessageActions({ timestamp, copyText, messageId, rewindPromptText, onRewind, rewindDisabled, deliveryStatus, }) {
+export function UserMessageActions({ timestamp, copyText, messageId, rewindPromptText, onRewind, rewindDisabled, deliveryStatus, toolbar = false, }) {
     const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
     // Copy stays available while the agent is busy / rewind is locked.
     // Only edit-from-here is gated — hiding the whole bar was wrong.
@@ -681,6 +683,15 @@ export function UserMessageActions({ timestamp, copyText, messageId, rewindPromp
     // Nothing to say and nothing to do — don't leave an empty row behind.
     if (!hasMeta && !copyText && !deliveryStatus)
         return null;
+    const buttons = copyText ? (_jsxs("div", { className: "flex shrink-0 items-center gap-0.5", children: [canRewind && (_jsx(Hint, { label: tI18nComplete.raw('textc72e5d059e24'), side: "top", align: "center", children: _jsx(Button, { type: "button", variant: "ghost", size: toolbar ? 'icon-sm' : 'icon-xs', 
+                    // 24px visible, 40px target — grown with a pseudo-element so the
+                    // dense action row keeps its rhythm.
+                    className: toolbar ? undefined : 'hit-area-2', "aria-label": tI18nComplete.raw('text673d6a594efa'), onClick: () => onRewind?.(messageId, rewindPromptText ?? ''), children: _jsx(PencilSimpleIcon, { weight: "regular", className: cn('text-foreground', toolbar ? 'size-3.5' : 'size-4') }) }) })), _jsx(CopyButton, { code: copyText, size: toolbar ? 'md' : 'sm', 
+                // In a row's toolbar every glyph is 14px (`size-3.5`), the channel row's too.
+                className: toolbar ? 'focus-visible:ring-ring focus-visible:ring-2 [&_svg]:size-3.5!' : undefined, hintSide: "top", label: tI18nComplete.raw('texte21f935f11d7') })] })) : null;
+    if (toolbar) {
+        return (_jsxs(_Fragment, { children: [deliveryStatus, buttons ? _jsx(RowToolbar, { children: buttons }) : null] }));
+    }
     return (
     // The fade sits on the ROW, so the timestamp and the buttons reveal
     // together as one object rather than a label with controls growing out of
@@ -710,10 +721,7 @@ export function UserMessageActions({ timestamp, copyText, messageId, rewindPromp
                 // counterpart. The two `opacity-100` variants it sits beside
                 // agree with it, so no ordering assumption is being made and the
                 // desktop string is unchanged.
-                'opacity-0 group-hover/turn:opacity-100 focus-within:opacity-100 max-md:opacity-100'), children: [hasMeta && (_jsx(InlineMeta, { children: timestamp !== null && _jsx(MessageTimeLabel, { timestamp: timestamp }) })), copyText && (_jsxs("div", { className: "flex shrink-0 items-center gap-0.5", children: [canRewind && (_jsx(Hint, { label: tI18nComplete.raw('textc72e5d059e24'), side: "top", align: "center", children: _jsx(Button, { type: "button", variant: "ghost", size: "icon-xs", 
-                                    // 24px visible, 40px target — grown with a pseudo-element so the
-                                    // dense action row keeps its rhythm.
-                                    className: "hit-area-2", "aria-label": tI18nComplete.raw('text673d6a594efa'), onClick: () => onRewind?.(messageId, rewindPromptText ?? ''), children: _jsx(PencilSimpleIcon, { weight: "regular", className: "text-foreground size-4" }) }) })), _jsx(CopyButton, { code: copyText, size: "sm", hintSide: "top", label: tI18nComplete.raw('texte21f935f11d7') })] }))] }), deliveryStatus] }));
+                'opacity-0 group-hover/turn:opacity-100 focus-within:opacity-100 max-md:opacity-100'), children: [hasMeta && (_jsx(InlineMeta, { children: timestamp !== null && _jsx(MessageTimeLabel, { timestamp: timestamp }) })), buttons] }), deliveryStatus] }));
 }
 // ============================================================================
 // Inline edit-from-here editor
@@ -908,7 +916,8 @@ export function UserMessage({ message, author, showAuthor, agentNames, commandIn
     // `copyText` is gated on `onRewind` to keep the buttons exactly as they were:
     // a read-only turn shows no controls. The row itself still renders, because
     // the timestamp is meta, not a control, and should not vanish with them.
-    const actions = (_jsx(UserMessageActions, { timestamp: Number.isFinite(createdAt) && createdAt > 0 ? createdAt : null, copyText: copyText && onRewind ? copyText : undefined, messageId: message.message_id, rewindPromptText: rewindPromptText, onRewind: onRewind, rewindDisabled: rewindDisabled, deliveryStatus: deliveryStatus }));
+    const rows = useContext(TranscriptRowsContext) !== null;
+    const actions = (_jsx(UserMessageActions, { toolbar: rows, timestamp: Number.isFinite(createdAt) && createdAt > 0 ? createdAt : null, copyText: copyText && onRewind ? copyText : undefined, messageId: message.message_id, rewindPromptText: rewindPromptText, onRewind: onRewind, rewindDisabled: rewindDisabled, deliveryStatus: deliveryStatus }));
     const [expanded, setExpanded] = useState(false);
     const [canExpand, setCanExpand] = useState(false);
     const textRef = useRef(null);
@@ -1074,6 +1083,11 @@ export function UserMessage({ message, author, showAuthor, agentNames, commandIn
     // branch returned before the main path — silently dropped the message's
     // attachments. A command is now just a message whose first token is a chip,
     // so it falls through to the one bubble below.
+    // A message row: the row draws the author and the time, so the message is
+    // its text, left-aligned and unboxed, with its files under it.
+    if (rows) {
+        return (_jsxs("div", { className: "flex w-full min-w-0 flex-col items-start gap-1.5", children: [(bodyText || quotedPieces || effectiveCommandInfo) && (_jsx("div", { className: cn(MESSAGE_TEXT_CLASS, 'w-full min-w-0 whitespace-pre-wrap wrap-anywhere select-text'), children: quotedPieces ? (_jsx(QuotedMessageBody, { pieces: quotedPieces, renderText: renderQuotedRun })) : (_jsxs(_Fragment, { children: [commandLead, renderSegments(segments)] })) })), (allAttachments.length > 0 || uploadStatus?.state === 'failed') && (_jsx(MessageAttachments, { attachments: allAttachments, status: uploadStatus, onOpenPastedContent: onOpenPastedContent })), systemNotifications.length > 0 && !effectiveCommandInfo && (_jsx("div", { className: "flex w-full flex-col gap-1.5", children: withContentKeys(systemNotifications, (n) => `mixed-${n.tag}`).map(({ key, item }) => (_jsx(SystemNotificationCard, { notification: item }, key))) })), actions] }));
+    }
     return (
     // The whole message is ONE right-aligned column capped at 80%, so the
     // bubble, its attachments and its actions all hang off the same rail and