@workerdeck/ui 2.15.0 → 3.1.0

package/src/components/terminal/scrubber.tsx

@@ -1,110 +1,15 @@
-import { useEffect, useLayoutEffect, useMemo, useRef, useState, type ReactNode } from 'react'
+import { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'
 import { useStickToBottomContext } from 'use-stick-to-bottom'
 import type { PermissionRequest } from '@workerdeck/protocol'
 import type { TranscriptItem } from '@workerdeck/react'
-import { formatCost, formatDuration, toolInputPreview } from '../../lib/format.ts'
-import { parentOf } from './blocks.ts'
+import { approvalCluster, buildMarks, clusterMarks, MIN_MARK, nearestMember, type Cluster, type Mark } from '../agent/scrubber-marks.ts'
+import { peekContent, TERMINAL_PEEK } from '../agent/scrubber-peek.tsx'
 import { TerminalSurface } from './surface.tsx'
 
-type Lane = 'l' | 'r' | 'f'
-type MarkKind = 'user' | 'subagent' | 'shell' | 'turn' | 'turnFailed' | 'toolFailed' | 'error' | 'approval' | 'recap' | 'bookmark'
-
-type Mark = {
-  kind: MarkKind
-  itemIndex: number
-  rowIndex: number
-  turnIndex?: number
-}
-
-type Cluster = { lane: Lane; kind: MarkKind; y: number; h: number; marks: { mark: Mark; y: number }[] }
-
-function nearestMember(cluster: Cluster, y: number): Mark | undefined {
-  let best: { mark: Mark; y: number } | undefined
-  for (const member of cluster.marks) {
-    if (!best || Math.abs(member.y - y) < Math.abs(best.y - y)) {
-      best = member
-    }
-  }
-  return best?.mark
-}
-
-const LANE: Record<MarkKind, Lane> = {
-  user: 'l',
-  subagent: 'l',
-  shell: 'l',
-  turn: 'r',
-  turnFailed: 'r',
-  toolFailed: 'r',
-  error: 'r',
-  approval: 'f',
-  recap: 'f',
-  bookmark: 'f',
-}
-
-const LOUDNESS: Record<MarkKind, number> = {
-  approval: 7,
-  error: 6,
-  turnFailed: 5,
-  toolFailed: 4,
-  user: 3,
-  turn: 2,
-  bookmark: 1,
-  subagent: 1,
-  shell: 1,
-  recap: 0,
-}
-
-const KIND_NAME: Record<MarkKind, string> = {
-  user: 'you',
-  subagent: 'sub-agent',
-  shell: 'shell',
-  turn: 'response · turn end',
-  turnFailed: 'turn failed',
-  toolFailed: 'tool failed',
-  error: 'error',
-  approval: 'pending approval',
-  recap: 'catch-up boundary',
-  bookmark: 'bookmark',
-}
-
-const MIN_MARK = 2
-
 export function railScale(railH: number, totalSize: number, viewportH: number): number {
   return totalSize > 0 ? railH / Math.max(totalSize, viewportH) : 0
 }
 
-type Segment = { response?: number; turn?: number; failed?: boolean }
-
-function doneLine(turn: Extract<TranscriptItem, { kind: 'turn_result' }>): string {
-  return `${turn.isError ? turn.subtype : 'done'} · ${formatDuration(turn.durationMs)} · ${formatCost(turn.totalCostUsd)}`
-}
-
-function excerpt(item: TranscriptItem): string {
-  switch (item.kind) {
-    case 'user':
-    case 'assistant_text':
-    case 'thinking':
-    case 'notice': {
-      return item.text
-    }
-    case 'shell': {
-      return item.shell.command
-    }
-    case 'tool_call': {
-      return `${item.name}(${toolInputPreview(item.input)})`
-    }
-    case 'turn_result': {
-      return doneLine(item)
-    }
-    case 'file_delivered': {
-      return item.path
-    }
-    default: {
-      return ''
-    }
-  }
-}
-
 export interface TerminalScrubberProps {
   items: readonly TranscriptItem[]
   pendingApprovals: readonly PermissionRequest[]
@@ -139,189 +44,28 @@ export function buildClusters(props: TerminalScrubberProps, railH: number): Clus
     totalSize,
     viewportH,
   } = props
-  const marks: Mark[] = []
-  const subagentParents = new Set<string>()
-  for (const item of items) {
-    const parent = parentOf(item)
-    if (parent !== undefined) {
-      subagentParents.add(parent)
-    }
-  }
-  const rowOutcome = new Map<number, number>()
-  items.forEach((item, index) => {
-    if (item.kind !== 'tool_call' || parentOf(item) !== frameParentId) {
-      return
-    }
-    rowOutcome.set(rowIndexFor(index), index)
-  })
-  let segment: Segment = {}
-  const closeSegment = () => {
-    const anchor = segment.response ?? segment.turn
-    if (anchor !== undefined) {
-      marks.push({
-        kind: segment.failed ? 'turnFailed' : 'turn',
-        itemIndex: anchor,
-        rowIndex: rowIndexFor(anchor),
-        turnIndex: segment.turn,
-      })
-    }
-    segment = {}
-  }
-  items.forEach((item, index) => {
-    if (item.kind === 'tool_call' && subagentParents.has(item.id)) {
-      marks.push({ kind: 'subagent', itemIndex: index, rowIndex: rowIndexFor(index) })
-    }
-    if (item.kind === 'user' && parentOf(item) === frameParentId) {
-      closeSegment()
-      marks.push({ kind: 'user', itemIndex: index, rowIndex: rowIndexFor(index) })
-    } else if (item.kind === 'turn_result') {
-      segment.turn = index
-      segment.failed = item.isError
-      closeSegment()
-    } else if (item.kind === 'notice' && item.level === 'error') {
-      marks.push({ kind: 'error', itemIndex: index, rowIndex: rowIndexFor(index) })
-    } else if (item.kind === 'shell') {
-      marks.push({ kind: 'shell', itemIndex: index, rowIndex: rowIndexFor(index) })
-    } else if (
-      item.kind === 'tool_call' &&
-      (item.status === 'failed' || item.result?.isError === true) &&
-      rowOutcome.get(rowIndexFor(index)) === index
-    ) {
-      marks.push({ kind: 'toolFailed', itemIndex: index, rowIndex: rowIndexFor(index) })
-    } else if (item.kind === 'assistant_text' && parentOf(item) === frameParentId) {
-      if (frameParentId !== undefined) {
-        marks.push({ kind: 'turn', itemIndex: index, rowIndex: rowIndexFor(index) })
-        return
-      }
-      segment.response = index
-    }
-  })
-  closeSegment()
-  for (const index of bookmarks) {
-    if (index >= 0 && index < items.length) {
-      marks.push({ kind: 'bookmark', itemIndex: index, rowIndex: rowIndexFor(index) })
-    }
-  }
+  const marks: Mark[] = buildMarks(items, { frameParentId, bookmarks, rowIndexFor }).map((mark) => ({
+    ...mark,
+    rowIndex: rowIndexFor(mark.itemIndex),
+  }))
   if (recapRow) {
     marks.push({ kind: 'recap', itemIndex: -1, rowIndex: recapRow.rowIndex })
   }
-
   const scale = railScale(railH, totalSize, viewportH)
-  const lanes = new Map<Lane, { mark: Mark; y: number; h: number }[]>()
-  for (const mark of marks) {
+  const clusters = clusterMarks(marks, (mark) => {
+    const rowIndex = mark.rowIndex ?? rowIndexFor(mark.itemIndex)
     const within = mark.itemIndex >= 0 ? positionInRow?.(mark.itemIndex) : undefined
-    const rowH = sizeOfRow(mark.rowIndex)
+    const rowH = sizeOfRow(rowIndex)
     const h = within ? MIN_MARK : Math.max(MIN_MARK, Math.round(rowH * scale))
-    const y = Math.min(
-      Math.max(0, railH - h),
-      Math.round((offsetOfRow(mark.rowIndex) + (within ? (within.ordinal / within.count) * rowH : 0)) * scale),
-    )
-    const lane = LANE[mark.kind]
-    const list = lanes.get(lane) ?? []
-    list.push({ mark, y, h })
-    lanes.set(lane, list)
-  }
-  const clusters: Cluster[] = []
-  for (const [lane, list] of lanes) {
-    list.sort((a, b) => a.y - b.y)
-    let current: Cluster | null = null
-    for (const { mark, y, h } of list) {
-      if (current && y <= current.y + current.h + 1) {
-        current.h = Math.max(current.h, y + h - current.y)
-        if (LOUDNESS[mark.kind] > LOUDNESS[current.kind]) {
-          current.kind = mark.kind
-        }
-        current.marks.push({ mark, y })
-      } else {
-        current = { lane, kind: mark.kind, y, h, marks: [{ mark, y }] }
-        clusters.push(current)
-      }
-    }
-  }
+    const offset = offsetOfRow(rowIndex) + (within ? (within.ordinal / within.count) * rowH : 0)
+    return { y: Math.min(Math.max(0, railH - h), Math.round(offset * scale)), h }
+  })
   if (pendingApprovals.length > 0) {
-    clusters.push({
-      lane: LANE.approval,
-      kind: 'approval',
-      y: Math.max(0, railH - MIN_MARK),
-      h: MIN_MARK,
-      marks: [],
-    })
+    clusters.push(approvalCluster(railH))
   }
   return clusters
 }
 
-function peekContent(cluster: Cluster, first: Mark | undefined, { items, pendingApprovals, recapRow }: TerminalScrubberProps): ReactNode {
-  const more = cluster.marks.length > 1 ? ` · ${cluster.marks.length} marks` : ''
-  let body: ReactNode = null
-  if (cluster.kind === 'approval') {
-    const request = pendingApprovals[0]
-    body = request ? (
-      <>
-        <div data-tone="bright">{request.title ?? 'Permission required'}</div>
-        <div className="term-scrub-ex" data-tone="fg">
-          {`${request.displayName ?? request.toolName}(${toolInputPreview(request.input)})`}
-        </div>
-      </>
-    ) : null
-  } else if (cluster.kind === 'recap' && !first) {
-    body = <div data-tone="faint">※ {recapRow?.label}</div>
-  } else if (first) {
-    const item = items[first.itemIndex]
-    if (first.kind === 'recap') {
-      body = <div data-tone="faint">※ {recapRow?.label}</div>
-    } else if (first.kind === 'turn' || first.kind === 'turnFailed') {
-      const turn = first.turnIndex === undefined ? undefined : items[first.turnIndex]
-      body = (
-        <>
-          {item?.kind === 'assistant_text' ? (
-            <div className="term-scrub-ex" data-tone="fg">
-              <span data-tone="dim">● </span>
-              {item.text}
-            </div>
-          ) : null}
-          {turn?.kind === 'turn_result' ? (
-            <>
-              <div data-tone={turn.isError ? 'red' : 'faint'}>{doneLine(turn)}</div>
-              {turn.errors?.map((message, index) => (
-                <div key={index} data-tone="red">
-                  {message}
-                </div>
-              ))}
-            </>
-          ) : null}
-        </>
-      )
-    } else if (item) {
-      const failure =
-        first.kind === 'toolFailed' && item.kind === 'tool_call'
-          ? item.result?.text.split('\n').find((line) => line.trim() !== '')
-          : undefined
-      body = (
-        <>
-          <div className="term-scrub-ex" data-tone={first.kind === 'error' || first.kind === 'toolFailed' ? 'red' : 'fg'}>
-            {first.kind === 'user' ? <span data-tone="dim">{'❯ '}</span> : null}
-            {excerpt(item)}
-          </div>
-          {failure ? (
-            <div className="term-scrub-ex" data-tone="red">
-              {failure}
-            </div>
-          ) : null}
-        </>
-      )
-    }
-  }
-  return (
-    <>
-      <div data-tone="faint">
-        {KIND_NAME[first?.kind ?? cluster.kind]}
-        {more}
-      </div>
-      {body}
-    </>
-  )
-}
-
 export function TerminalScrubber(props: TerminalScrubberProps) {
   const { scrollOffset, viewportH, totalSize, onJumpToRow, interactive, fontSize, lineHeight } = props
   const stick = useStickToBottomContext()
@@ -420,7 +164,7 @@ export function TerminalScrubber(props: TerminalScrubberProps) {
     }
     const mark = nearestMember(cluster, railY(clientY))
     if (mark) {
-      onJumpToRow(mark.rowIndex)
+      onJumpToRow(mark.rowIndex ?? props.rowIndexFor(mark.itemIndex))
     }
   }
 
@@ -515,7 +259,16 @@ export function TerminalScrubber(props: TerminalScrubberProps) {
         ))}
         {peek ? (
           <div ref={peekRef} className="term-scrub-peek" style={{ top: peek.y }}>
-            {peekContent(peek.cluster, peek.mark, props)}
+            {peekContent(
+              {
+                cluster: peek.cluster,
+                first: peek.mark,
+                items: props.items,
+                pendingApprovals: props.pendingApprovals,
+                recapLabel: props.recapRow?.label,
+              },
+              TERMINAL_PEEK,
+            )}
           </div>
         ) : null}
       </div>

package/src/components/terminal/shell-row.ts

@@ -1,4 +1,4 @@
-import type { ShellInfo } from '@workerdeck/protocol'
+import { SHELL_INTERACTIVE_NOTE, type ShellInfo } from '@workerdeck/protocol'
 import type { ShellItem } from '@workerdeck/react'
 
 export const SHELL_GLYPH = '$'
@@ -9,6 +9,17 @@ export const SHELL_EXPAND_CHARS = 100_000
 
 export const SHELL_MISSING = 'output expired or not tracked by this gateway'
 
+export const SHELL_AGENT_WRITE_NOTE = 'agent may type'
+
+// Only a running shell the user started takes a grant: the agent already drives its own.
+export function shellGrantable(shell: ShellInfo): boolean {
+  return shell.status === 'running' && shell.owner === 'user'
+}
+
+export function shellAgentWriteLabel(shell: ShellInfo): string {
+  return shell.agentWrite === true ? 'Revoke the agent’s access to this shell' : 'Let the agent type into this shell'
+}
+
 export function shellInfoLabel(shell: ShellInfo): string {
   return shell.label || shell.command.split('\n')[0] || ''
 }
@@ -31,7 +42,7 @@ export function shellInfoFailed(shell: ShellInfo): boolean {
 
 export function shellInfoStatusText(shell: ShellInfo): string {
   if (shell.status === 'running') {
-    return 'running'
+    return shell.agentWrite === true ? `running · ${SHELL_AGENT_WRITE_NOTE}` : 'running'
   }
   if (typeof shell.exitCode === 'number') {
     return shell.exitCode === 0 ? 'exit 0' : `exit ${shell.exitCode}`
@@ -68,7 +79,7 @@ export function shellHeaderText(item: ShellItem): string {
 
 export function shellBodyLines(item: ShellItem, open: boolean): string[] {
   const source = open && item.expanded !== undefined ? item.expanded : item.text
-  if (source === '') {
+  if (source === '' || item.shell.interactive) {
     return []
   }
   const lines = source.split('\n')
@@ -89,6 +100,9 @@ export function shellBodyLines(item: ShellItem, open: boolean): string[] {
 
 // The footer is the row's one affordance line: what expanding will fetch, what it clipped, or why it cannot.
 export function shellFooterText(item: ShellItem, open: boolean, shown: number): string | undefined {
+  if (item.shell.interactive) {
+    return SHELL_INTERACTIVE_NOTE
+  }
   if (item.missing) {
     return SHELL_MISSING
   }

package/src/components/ui/Popover.tsx

@@ -0,0 +1,29 @@
+import { type FunctionComponent } from 'react'
+import { Popover as PopoverPrimitive } from '@base-ui/react/popover'
+import { cn } from '../../lib/utils.ts'
+import { PortalScope } from './PortalScope.tsx'
+
+export const Popover = PopoverPrimitive.Root
+export const PopoverTrigger = PopoverPrimitive.Trigger
+
+export const PopoverContent: FunctionComponent<
+  PopoverPrimitive.Popup.Props & Pick<PopoverPrimitive.Positioner.Props, 'align' | 'side' | 'sideOffset'>
+> = ({ className, align = 'end', side = 'bottom', sideOffset = 6, ...props }) => (
+  <PopoverPrimitive.Portal>
+    <PortalScope>
+      <PopoverPrimitive.Positioner align={align} side={side} sideOffset={sideOffset} className="isolate z-80 outline-none">
+        <PopoverPrimitive.Popup
+          data-slot="popover-content"
+          className={cn(
+            'rounded-md border border-border bg-surface p-2 text-fg-1 shadow-(--shadow-lg) outline-none',
+            'transition-[opacity,transform] duration-(--motion-base)',
+            'data-starting-style:scale-95 data-starting-style:opacity-0',
+            'data-ending-style:scale-95 data-ending-style:opacity-0',
+            className,
+          )}
+          {...props}
+        />
+      </PopoverPrimitive.Positioner>
+    </PortalScope>
+  </PopoverPrimitive.Portal>
+)

package/src/components/ui/Select.tsx

@@ -68,3 +68,28 @@ export const SelectItem: FunctionComponent<SelectPrimitive.Item.Props> = ({ clas
     </SelectPrimitive.ItemIndicator>
   </SelectPrimitive.Item>
 )
+
+export interface OptionSelectProps<T extends string> {
+  label: string
+  value: T
+  options: readonly { value: T; label: string }[]
+  onChange: (value: T) => void
+  className?: string
+}
+
+export function OptionSelect<T extends string>({ label, value, options, onChange, className }: OptionSelectProps<T>) {
+  return (
+    <Select value={value} onValueChange={(next) => onChange(next as T)}>
+      <SelectTrigger aria-label={label} className={className}>
+        <SelectValue>{options.find((o) => o.value === value)?.label ?? label}</SelectValue>
+      </SelectTrigger>
+      <SelectContent>
+        {options.map((option) => (
+          <SelectItem key={option.value} value={option.value}>
+            <SelectItemText>{option.label}</SelectItemText>
+          </SelectItem>
+        ))}
+      </SelectContent>
+    </Select>
+  )
+}

package/src/index.ts

@@ -3,7 +3,16 @@ export { Badge, badgeVariants, type BadgeProps } from './components/ui/Badge.tsx
 export { Card, CardContent, CardHeader, CardTitle } from './components/ui/Card.tsx'
 export { Input } from './components/ui/Input.tsx'
 export { Textarea } from './components/ui/Textarea.tsx'
-export { Select, SelectContent, SelectItem, SelectItemText, SelectTrigger, SelectValue } from './components/ui/Select.tsx'
+export {
+  OptionSelect,
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectItemText,
+  SelectTrigger,
+  SelectValue,
+  type OptionSelectProps,
+} from './components/ui/Select.tsx'
 export {
   AlertDialog,
   AlertDialogClose,
@@ -13,6 +22,7 @@ export {
   AlertDialogTrigger,
 } from './components/ui/AlertDialog.tsx'
 export { Menu, MenuContent, MenuItem, MenuSeparator, MenuTrigger } from './components/ui/Menu.tsx'
+export { Popover, PopoverContent, PopoverTrigger } from './components/ui/Popover.tsx'
 export { Dialog, DialogBody, DialogClose, DialogContent, DialogHeader, DialogRow, DialogTrigger } from './components/ui/Dialog.tsx'
 export { Tip, TooltipContent, TooltipProvider } from './components/ui/Tooltip.tsx'
 export { Toaster, toast } from './components/ui/Sonner.tsx'
@@ -51,16 +61,23 @@ export {
   type SessionVitals,
   type TerminalMetrics,
 } from './components/agent/SessionPanel.tsx'
-export { Transcript, type TranscriptProps } from './components/agent/Transcript.tsx'
+export { TerminalTranscript, Transcript, type TerminalTranscriptProps, type TranscriptProps } from './components/agent/Transcript.tsx'
 export { TerminalSurface, type TerminalSurfaceProps } from './components/terminal/surface.tsx'
-export { TerminalTranscript, TerminalItemView, type TerminalTranscriptProps } from './components/terminal/TerminalTranscript.tsx'
+export { TerminalItemView } from './components/terminal/TerminalTranscript.tsx'
 export { TerminalStatusLine, type TerminalStatusLineProps } from './components/terminal/StatusLine.tsx'
 export { TerminalPermissionPrompt, type TerminalPermissionPromptProps } from './components/terminal/PermissionPrompt.tsx'
 export { TerminalQuestionPrompt, type TerminalQuestionPromptProps } from './components/terminal/QuestionPrompt.tsx'
 export { TerminalDiff, previewPatch } from './components/terminal/diff.tsx'
 export { TerminalMarkdown, type TerminalMarkdownProps } from './components/terminal/markdown.tsx'
 export { Band, Blank, Ink, Row, type RowProps, type Tone } from './components/terminal/row.tsx'
-export { CopyAction, WithActions, useAffordances, type TerminalAffordances } from './components/terminal/affordances.tsx'
+export {
+  AgentWriteIcon,
+  CopyAction,
+  WithActions,
+  useAffordances,
+  type ActionPlacement,
+  type TerminalAffordances,
+} from './components/terminal/affordances.tsx'
 export { FileLinkProvider, useFileLinks, type FileLinkHandle, type FileLinkOpener } from './components/terminal/file-link.tsx'
 export { parseFileLink, type FileLink } from './lib/file-link.ts'
 export { matchPath, type PathHit, type PathMatch } from './lib/path-match.ts'
@@ -68,11 +85,8 @@ export { usePathLinks, resolveAgainstCwd } from './components/agent/use-path-lin
 export { Conversation, ConversationContent, ConversationScrollButton, type ConversationProps } from './components/agent/Conversation.tsx'
 export { Message, MessageContent, type MessageProps } from './components/agent/Message.tsx'
 export {
-  TranscriptDensityProvider,
   TranscriptVariantProvider,
-  useTranscriptDensity,
   useTranscriptVariant,
-  type TranscriptDensity,
   type TranscriptFont,
   type TranscriptVariant,
 } from './components/agent/transcript-variant.tsx'
@@ -81,6 +95,14 @@ export { Reasoning, type ReasoningProps } from './components/agent/Reasoning.tsx
 export { Loader } from './components/agent/Loader.tsx'
 export { ToolCallCard, type ToolCallCardProps, type ToolCallItem } from './components/agent/ToolCallCard.tsx'
 export { ToolTitleProvider, useToolTitle } from './components/agent/tool-titles.tsx'
+export {
+  ImageViewer,
+  ImageViewerProvider,
+  ViewableImage,
+  useOpenImage,
+  type OpenImage,
+  type ViewedImage,
+} from './components/agent/image-viewer.tsx'
 export { FileCard, type FileCardProps, type FileDeliveredItem } from './components/agent/FileCard.tsx'
 export { PermissionPrompt, type PermissionPromptProps } from './components/agent/PermissionPrompt.tsx'
 export {
@@ -111,21 +133,49 @@ export {
   type PermissionModeSelectProps,
 } from './components/agent/PermissionModeSelect.tsx'
 export { StatusBar, type StatusBarProps } from './components/agent/StatusBar.tsx'
-export { ContextDialog, type ContextDialogProps } from './components/agent/ContextDialog.tsx'
+export { ContextDialog, ContextPanel, type ContextDialogProps, type ContextPanelProps } from './components/agent/ContextDialog.tsx'
 export { UsageDialog, type UsageDialogProps } from './components/agent/UsageDialog.tsx'
 export { TaskList, type TaskListProps } from './components/agent/TaskList.tsx'
 export { TasksDialog, type TasksDialogProps } from './components/agent/TasksDialog.tsx'
 export { UsageMeters, useMinuteClock } from './components/agent/UsageMeters.tsx'
-export { SessionInfoDialog, type SessionInfoDialogProps } from './components/agent/SessionInfoDialog.tsx'
-export { McpDialog, type McpDialogProps } from './components/agent/McpDialog.tsx'
+export {
+  SessionInfoDialog,
+  SessionInfoPanel,
+  type SessionInfoDialogProps,
+  type SessionInfoPanelProps,
+} from './components/agent/SessionInfoDialog.tsx'
+export {
+  McpDialog,
+  McpPanel,
+  McpPanelActions,
+  useMcpPanel,
+  type McpDialogProps,
+  type McpPanelModel,
+  type McpPanelProps,
+} from './components/agent/McpDialog.tsx'
 export { SkillsDialog, type SkillsDialogProps } from './components/agent/SkillsDialog.tsx'
 export { HostFilesDialog, type HostFilesDialogProps } from './components/agent/HostFilesDialog.tsx'
 export { SessionList, SessionListItem, type SessionListItemProps, type SessionListProps } from './components/agent/SessionList.tsx'
-export { SessionBrowser, rowShapeClass, type SessionBrowserProps } from './components/agent/SessionBrowser.tsx'
+export { SessionBrowser, SessionSearch, rowShapeClass, type SessionBrowserProps } from './components/agent/SessionBrowser.tsx'
+export {
+  STEP_DISPLAY_OPTIONS,
+  SessionFilters,
+  SessionFiltersButton,
+  StepDisplayControl,
+  type SessionFiltersButtonProps,
+  type SessionFiltersProps,
+} from './components/agent/SessionFilters.tsx'
 export { SessionItem, type SelectModifiers, type SessionItemProps } from './components/agent/SessionItem.tsx'
 export { SessionStatusIcon } from './components/agent/SessionStatusIcon.tsx'
 export { EngineIcon, engineMark, vendorMarkClass, vendorTextClass } from './components/agent/EngineIcon.tsx'
-export { type ShellStepOptions, type Step, type StepKind, StepRow, sessionSteps } from './components/agent/SessionSteps.tsx'
+export {
+  type ShellStepOptions,
+  type Step,
+  type StepKind,
+  type TaskStepOptions,
+  StepRow,
+  sessionSteps,
+} from './components/agent/SessionSteps.tsx'
 export {
   SUBAGENT_DISPLAY_META,
   SUBAGENT_DISPLAY_ORDER,
@@ -138,8 +188,11 @@ export { ShellStrip, type ShellStripProps } from './components/agent/ShellStrip.
 export { useShellFrame, type ShellFrame, type ShellFrameOptions } from './components/agent/use-shell-frame.ts'
 export { ShellActionsProvider, useShellActions, type ShellActions } from './components/agent/shell-actions.tsx'
 export {
+  SHELL_AGENT_WRITE_NOTE,
   SHELL_GLYPH,
   SHELL_KILL_GLYPH,
+  shellAgentWriteLabel,
+  shellGrantable,
   shellInfoFailed,
   shellInfoLabel,
   shellInfoStatusText,

package/src/lib/file-link.ts

@@ -1,3 +1,5 @@
+import { resolvePosix } from '@workerdeck/protocol'
+
 export type FileLink = {
   path: string
   line?: number
@@ -45,7 +47,7 @@ export function parseFileLink(href: string | undefined, cwd: string | undefined)
     return undefined
   }
 
-  const path = target.startsWith('/') ? normalize(target) : cwd ? normalize(`${cwd}/${target}`) : undefined
+  const path = resolvePosix(target, cwd)
   return path ? { path, ...(line === undefined ? {} : { line }) } : undefined
 }
 
@@ -53,18 +55,3 @@ function readLine(value: string | undefined): number | undefined {
   const parsed = value === undefined ? Number.NaN : Number(value)
   return Number.isInteger(parsed) && parsed > 0 ? parsed : undefined
 }
-
-function normalize(path: string): string {
-  const out: string[] = []
-  for (const part of path.split('/')) {
-    if (part === '' || part === '.') {
-      continue
-    }
-    if (part === '..') {
-      out.pop()
-      continue
-    }
-    out.push(part)
-  }
-  return `/${out.join('/')}`
-}