@arbidocs/blocks 0.4.122 → 0.4.123

package/dist/{chunk-AY32GGKU.js → chunk-MD7RVFKA.js}

@@ -1,276 +1,14 @@
 "use client";
 import { FoldSection } from './chunk-XD2M6LIG.js';
 import { UploadDropzone } from './chunk-EVUEIBNU.js';
-import { isTone, TONE_DOT, TONE_SURFACE, TONE_SOLID_BORDER, TONE_BORDER } from './chunk-AUS3KBHJ.js';
-import { useElementSize } from './chunk-HOXKR26S.js';
+import { workflowSteps, canAssign, nextAction, validateStep, assigneeName, runFieldsOf, failedUpstream, stepPhase, useElementSize, sendBackTargets, formatDate, shownValue, stepKindOf, stepLevels, waitingDocuments, stepDependencies, reviewInstructions, splitDocRef, isPersonStep, eventWaitingDocuments, waitingForDocumentsText, StepBadgeMark, StepChip, STEP_KIND_ICONS, DEFAULT_STEP_KIND_LABELS, composeStepPrompt, isRunFinished, runFields, isWorkflowScope } from './chunk-7HAM7Y5U.js';
+import { TONE_DOT, TONE_SURFACE, TONE_SOLID_BORDER, TONE_BORDER } from './chunk-AUS3KBHJ.js';
 import { testIdOr, prefixedTestId } from './chunk-7F6CBP3Z.js';
 import { useState, useRef, useEffect, useCallback, useMemo } from 'react';
-import { Check, Loader2, Hourglass, AlertTriangle, MinusCircle, UserRound, CornerUpLeft, ShieldCheck, MessageSquare, Clock, PenLine, X, ExternalLink, Mail, Table2, CheckCircle2, ArrowLeft, ArrowRight, RotateCw, GitBranch, ChevronLeft, ChevronRight, FileText, ArrowUpRight, BellRing, Flag, RotateCcw, Play, Disc, Phone, UserRoundCog, Sparkles, MessageSquareReply, Square, KeyRound, Lock } from 'lucide-react';
+import { Loader2, UserRound, CornerUpLeft, ShieldCheck, MessageSquare, Check, Hourglass, Clock, PenLine, X, ExternalLink, Mail, Table2, CheckCircle2, ArrowLeft, ArrowRight, RotateCw, GitBranch, AlertTriangle, ChevronLeft, ChevronRight, FileText, ArrowUpRight, BellRing, Flag, RotateCcw, Play, Disc, Phone, UserRoundCog, Sparkles, MessageSquareReply, Square, KeyRound, Lock } from 'lucide-react';
 import { cn, Popover, PopoverTrigger, PopoverContent, Button, Textarea, Card, Label, Input, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, Switch } from '@arbidocs/react/ui';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
-// src/agents/workflows/types.ts
-var EMPTY_WORKFLOW_SCOPE = { folders: [], labels: [] };
-
-// src/agents/workflows/workflow.ts
-var isWorkflowScope = (value) => typeof value === "object" && value !== null && Array.isArray(value.folders) && Array.isArray(value.labels);
-var isEmptyWorkflowScope = (scope) => scope.folders.length === 0 && scope.labels.length === 0 && !scope.documents?.length;
-var isFileField = (field) => field.type === "scope" || field.type === "documents";
-function emptyValue(field) {
-  switch (field.type) {
-    case "boolean":
-      return false;
-    case "scope":
-      return { folders: [], labels: [] };
-    case "documents":
-      return { folders: [], labels: [], documents: [] };
-    default:
-      return "";
-  }
-}
-function defaultInputs(workflow) {
-  const inputs = {};
-  for (const field of workflow.inputs) {
-    const d = field.default;
-    inputs[field.name] = d === void 0 ? emptyValue(field) : isWorkflowScope(d) ? { ...d } : d;
-  }
-  return inputs;
-}
-function validateInputs(workflow, inputs) {
-  const errors = {};
-  for (const field of workflow.inputs) {
-    const value = inputs[field.name];
-    if (field.type === "number") {
-      const blank = value === "" || value === void 0;
-      if (blank) {
-        if (field.required) errors[field.name] = "required";
-        continue;
-      }
-      const n = Number(value);
-      if (Number.isNaN(n)) errors[field.name] = "number";
-      else if (field.min !== void 0 && n < field.min) errors[field.name] = "min";
-      else if (field.max !== void 0 && n > field.max) errors[field.name] = "max";
-      continue;
-    }
-    if (!field.required) continue;
-    if (field.type === "documents") {
-      if (!isWorkflowScope(value) || !value.documents?.length) errors[field.name] = "required";
-      continue;
-    }
-    if (field.type === "boolean" || field.type === "scope") continue;
-    if (typeof value !== "string" || value.trim() === "") errors[field.name] = "required";
-  }
-  return errors;
-}
-function promptFieldName(workflow) {
-  return workflow.inputs.find((f) => !f.advanced && (f.type === "text" || f.type === "longtext"))?.name;
-}
-var quoteList = (names) => {
-  const quoted = names.map((n) => `"${n}"`);
-  return quoted.length <= 1 ? quoted[0] ?? "" : `${quoted.slice(0, -1).join(", ")} and ${quoted[quoted.length - 1]}`;
-};
-function fragment(field, value, ctx) {
-  switch (field.type) {
-    case "documents": {
-      const ids = isWorkflowScope(value) ? value.documents ?? [] : [];
-      const names = ids.flatMap((id) => {
-        const title = ctx?.documentTitles?.[id];
-        return title ? [title] : [];
-      });
-      return quoteList(names);
-    }
-    case "boolean":
-      return value ? field.trueText ?? "yes" : field.falseText ?? "no";
-    case "select": {
-      const option = field.options?.find((o) => o.value === value);
-      return option ? option.text ?? option.label : String(value ?? "");
-    }
-    case "scope":
-      return "";
-    default:
-      return typeof value === "string" ? value.trim() : String(value ?? "");
-  }
-}
-function composeWorkflowPrompt(workflow, inputs, ctx) {
-  if (workflow.run.kind !== "prompt") return "";
-  const byName = new Map(workflow.inputs.map((f) => [f.name, f]));
-  const template = workflow.run.promptTemplate;
-  let out = "";
-  let last = 0;
-  const append = (text, isValue) => {
-    let t = text;
-    if (!isValue) {
-      t = t.replace(/[ \t]{2,}/g, " ");
-      if (/[ \t]$/.test(out)) t = t.replace(/^[ \t]+/, "");
-    }
-    out += t;
-  };
-  for (const m of template.matchAll(/\{\{\s*([a-z][a-z0-9_]*)\s*\}\}/gi)) {
-    append(template.slice(last, m.index), false);
-    const field = byName.get(m[1]);
-    append(field ? fragment(field, inputs[m[1]], ctx) : "", true);
-    last = m.index + m[0].length;
-  }
-  append(template.slice(last), false);
-  return out.trim();
-}
-function buildLaunch(workflow, inputs, agentId) {
-  const scopeField = workflow.inputs.find(isFileField);
-  const raw = scopeField ? inputs[scopeField.name] : void 0;
-  const scope = isWorkflowScope(raw) ? raw : { ...EMPTY_WORKFLOW_SCOPE };
-  return { workflow, inputs, scope, agentId: agentId || workflow.defaultAgentId || void 0 };
-}
-function workflowAccepts(workflow) {
-  const kinds = /* @__PURE__ */ new Set();
-  for (const field of workflow.inputs) if (field.context) kinds.add(field.context);
-  return [...kinds];
-}
-function workflowsAccepting(workflows, supplied) {
-  return workflows.filter((w) => workflowAccepts(w).some((k) => supplied.includes(k)));
-}
-function workflowsForHost(workflows, host) {
-  return workflows.filter((w) => !w.host || w.host === host);
-}
-function inputsFromContext(workflow, context) {
-  const inputs = {};
-  for (const field of workflow.inputs) {
-    if (!field.context) continue;
-    if (field.context === "selection") {
-      if (context.selection) inputs[field.name] = context.selection;
-      continue;
-    }
-    const ids = field.context === "image" ? context.image ? [context.image] : [] : context.documents;
-    if (ids?.length && isFileField(field)) {
-      inputs[field.name] = { folders: [], labels: [], documents: ids.slice(0, field.max ?? 1) };
-    }
-  }
-  return inputs;
-}
-var SKILL_PROMPT_LABEL = "What should it work on?";
-var SKILL_PROMPT_FALLBACK_PLACEHOLDER = "Describe what you want";
-var plainHint = (hint) => hint.replace(/^[<[]\s*|\s*[>\]]$/g, "").trim();
-function skillToWorkflow(skill) {
-  const hint = plainHint((skill.arg_hint ?? "").trim());
-  const inputs = [
-    {
-      name: "args",
-      type: "longtext",
-      label: SKILL_PROMPT_LABEL,
-      placeholder: hint || SKILL_PROMPT_FALLBACK_PLACEHOLDER,
-      required: true
-    }
-  ];
-  return {
-    id: skill.slug,
-    skill: skill.slug,
-    title: skill.name || skill.slug,
-    description: skill.description ?? "",
-    inputs,
-    run: { kind: "prompt", promptTemplate: `/${skill.slug} {{args}}` },
-    landing: "chat",
-    schedulable: true
-  };
-}
-var FIELD_TYPES = [
-  "text",
-  "longtext",
-  "boolean",
-  "select",
-  "number",
-  "date",
-  "scope",
-  "documents"
-];
-var str = (v) => typeof v === "string" ? v : void 0;
-var num = (v) => typeof v === "number" ? v : void 0;
-var bool = (v) => typeof v === "boolean" ? v : void 0;
-function fieldFromFrontmatter(raw) {
-  if (typeof raw !== "object" || raw === null) return null;
-  const r = raw;
-  const name = str(r.name);
-  const type = FIELD_TYPES.find((t) => t === r.type);
-  if (!name || !/^[a-z][a-z0-9_]*$/.test(name) || !type) return null;
-  const options = Array.isArray(r.options) ? r.options.flatMap((o) => {
-    const ro = o;
-    const value = str(ro?.value);
-    const label = str(ro?.label);
-    return value && label ? [
-      {
-        value,
-        label,
-        description: str(ro.description),
-        text: str(ro.text),
-        icon: str(ro.icon),
-        tone: isTone(ro.tone) ? ro.tone : void 0
-      }
-    ] : [];
-  }) : void 0;
-  return {
-    name,
-    type,
-    label: str(r.label) ?? name,
-    description: str(r.description),
-    placeholder: str(r.placeholder),
-    required: bool(r.required),
-    default: r.default,
-    options,
-    min: num(r.min),
-    max: num(r.max),
-    trueText: str(r.true_text),
-    falseText: str(r.false_text),
-    advanced: bool(r.advanced),
-    accept: r.accept === "image" ? "image" : void 0,
-    context: r.context === "documents" || r.context === "selection" || r.context === "image" ? r.context : void 0,
-    by: Array.isArray(r.by) ? r.by.filter((b) => b === "folders" || b === "labels") : void 0
-  };
-}
-function workflowFromFrontmatter(id, frontmatter, body) {
-  const inputs = Array.isArray(frontmatter.inputs) ? frontmatter.inputs.flatMap((f) => {
-    const field = fieldFromFrontmatter(f);
-    return field ? [field] : [];
-  }) : [];
-  return {
-    id,
-    title: str(frontmatter.name) ?? id,
-    description: str(frontmatter.description) ?? "",
-    icon: str(frontmatter.icon),
-    inputs,
-    run: { kind: "prompt", promptTemplate: body.trim() },
-    landing: frontmatter.landing === "files" ? "files" : "chat",
-    requiresFiles: bool(frontmatter.requires_files),
-    schedulable: bool(frontmatter.schedulable) ?? true
-  };
-}
-function fieldToFrontmatter(field) {
-  return compact({
-    name: field.name,
-    type: field.type,
-    label: field.label,
-    description: field.description,
-    placeholder: field.placeholder,
-    required: field.required,
-    default: field.default,
-    options: field.options?.map(
-      (o) => compact({
-        value: o.value,
-        label: o.label,
-        description: o.description,
-        text: o.text,
-        icon: o.icon,
-        tone: o.tone
-      })
-    ),
-    min: field.min,
-    max: field.max,
-    true_text: field.trueText,
-    false_text: field.falseText,
-    advanced: field.advanced,
-    by: field.by,
-    accept: field.accept,
-    context: field.context
-  });
-}
-var compact = (o) => Object.fromEntries(Object.entries(o).filter(([, v]) => v !== void 0));
 var DEFAULT_SCHEMA_FORM_LABELS = {
   optional: "(optional)",
   advanced: "More options",
@@ -376,7 +114,7 @@ function FieldControl({
     case "select": {
       const options = field.options ?? [];
       if (options.length > 0 && options.length <= TILE_MAX) {
-        const compact3 = options.every((o) => !o.icon && !o.description);
+        const compact2 = options.every((o) => !o.icon && !o.description);
         return /* @__PURE__ */ jsx(
           "div",
           {
@@ -389,7 +127,7 @@ function FieldControl({
               {
                 option,
                 selected: value === option.value,
-                compact: compact3,
+                compact: compact2,
                 renderIcon,
                 testId: prefixedTestId(testId, option.value, {
                   testId: `workflow-field-${field.name}-${option.value}`
@@ -447,7 +185,7 @@ function FieldControl({
 function ChoiceTile({
   option,
   selected,
-  compact: compact3,
+  compact: compact2,
   renderIcon,
   testId,
   onSelect
@@ -465,7 +203,7 @@ function ChoiceTile({
       className: cn(
         // Sized to its label (flex-basis auto), growing to share the row, never wider than it.
         "flex max-w-full min-w-[min(4rem,100%)] flex-auto flex-col items-center justify-center gap-1.5 rounded-lg border text-center transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-        compact3 ? "min-h-9 px-3 py-1.5 pointer-coarse:min-h-11" : "min-h-24 p-3 pointer-coarse:min-h-28",
+        compact2 ? "min-h-9 px-3 py-1.5 pointer-coarse:min-h-11" : "min-h-24 p-3 pointer-coarse:min-h-28",
         tone ? selected ? cn(TONE_SURFACE[tone], TONE_SOLID_BORDER[tone]) : cn(TONE_BORDER[tone], "bg-card [&:hover]:bg-muted") : selected ? "border-primary bg-primary/10" : "border-border bg-card [&:hover]:border-primary [&:hover]:bg-muted"
       ),
       children: [
@@ -581,313 +319,6 @@ function SchemaForm({
   ] });
 }
 
-// src/agents/workflows/run.ts
-function workflowSteps(workflow) {
-  return workflow.run.kind === "steps" ? workflow.run.steps : [];
-}
-var isSteppedWorkflow = (workflow) => workflow.run.kind === "steps";
-function stepDependencies(steps, id) {
-  const i = steps.findIndex((s) => s.id === id);
-  if (i < 0) return [];
-  return steps[i].after ?? (i > 0 ? [steps[i - 1].id] : []);
-}
-function dependsOn(steps, a, b) {
-  const seen = /* @__PURE__ */ new Set();
-  const stack = [...stepDependencies(steps, a)];
-  while (stack.length) {
-    const id = stack.pop();
-    if (id === b) return true;
-    if (seen.has(id)) continue;
-    seen.add(id);
-    stack.push(...stepDependencies(steps, id));
-  }
-  return false;
-}
-function orderSteps(steps) {
-  const explicit = steps.map((s) => ({ ...s, after: stepDependencies(steps, s.id) }));
-  const known = new Set(explicit.map((s) => s.id));
-  const placed = /* @__PURE__ */ new Set();
-  const out = [];
-  let progress = true;
-  while (out.length < explicit.length && progress) {
-    progress = false;
-    for (const s of explicit) {
-      if (placed.has(s.id)) continue;
-      if (s.after.every((d) => placed.has(d) || !known.has(d))) {
-        out.push(s);
-        placed.add(s.id);
-        progress = true;
-        break;
-      }
-    }
-  }
-  return [...out, ...explicit.filter((s) => !placed.has(s.id))];
-}
-function validateWorkflowGraph(steps) {
-  const problems = [];
-  const ids = /* @__PURE__ */ new Set();
-  for (const s of steps) {
-    if (ids.has(s.id)) problems.push({ code: "duplicate", step: s.id });
-    ids.add(s.id);
-  }
-  steps.forEach((s, i) => {
-    for (const d of stepDependencies(steps, s.id)) {
-      if (!ids.has(d)) problems.push({ code: "unknown", step: s.id, dependency: d });
-      else if (d === s.id || dependsOn(steps, d, s.id)) problems.push({ code: "cycle", step: s.id });
-      else if (steps.findIndex((x) => x.id === d) > i)
-        problems.push({ code: "order", step: s.id, dependency: d });
-    }
-  });
-  return problems;
-}
-function stepLevels(steps) {
-  const depth = /* @__PURE__ */ new Map();
-  for (const s of steps) {
-    const deps = stepDependencies(steps, s.id).filter((d) => depth.has(d));
-    depth.set(s.id, deps.length ? Math.max(...deps.map((d) => depth.get(d))) + 1 : 0);
-  }
-  const levels = [];
-  for (const s of steps) (levels[depth.get(s.id)] ??= []).push(s);
-  return levels.filter(Boolean);
-}
-var STEP_EVENTS = {
-  step_started: "running",
-  step_waiting: "waiting",
-  step_done: "done",
-  step_skipped: "skipped",
-  step_failed: "failed"
-};
-var str2 = (v) => typeof v === "string" && v ? v : void 0;
-var ACTION_TYPES = ["sign", "email_draft", "tabular_review"];
-var asAction = (v) => ACTION_TYPES.includes(v) ? v : void 0;
-var asRecord = (v) => v && typeof v === "object" && !Array.isArray(v) ? v : void 0;
-var asStrings = (v) => Array.isArray(v) ? v.filter((x) => typeof x === "string") : void 0;
-function waitingDocuments(state) {
-  return state?.status === "waiting" ? asStrings(state.waiting?.documents) ?? [] : [];
-}
-function eventWaitingDocuments(detail) {
-  return asStrings(asRecord(detail?.waiting)?.documents);
-}
-function waitingForDocumentsText(count) {
-  return `Waiting for ${count} ${count === 1 ? "document" : "documents"} to finish processing`;
-}
-function reopenedBy(detail) {
-  const to = str2(detail.to);
-  return asStrings(detail.reopened) ?? (to ? [to] : []);
-}
-function stepStatesFromActivity(events) {
-  const states = {};
-  for (const e of events) {
-    const detail = e.detail ?? {};
-    const step = str2(detail.step);
-    if (!step) continue;
-    if (e.kind === "step_sent_back") {
-      const to = str2(detail.to);
-      for (const id of reopenedBy(detail))
-        states[id] = id === to ? {
-          status: "pending",
-          sentBack: true,
-          hasNote: typeof detail.note_encrypted === "string"
-        } : { status: "pending" };
-      continue;
-    }
-    if (e.kind === "step_ready") {
-      states[step] = { ...states[step] ?? { status: "pending" }, announcedTo: str2(detail.to) };
-      continue;
-    }
-    if (e.kind === "step_progress") {
-      const before2 = states[step];
-      const waiting2 = asRecord(detail.waiting);
-      if (before2?.status === "waiting" && waiting2) states[step] = { ...before2, waiting: waiting2 };
-      continue;
-    }
-    const status = STEP_EVENTS[e.kind];
-    if (!status) continue;
-    const before = states[step];
-    const responseId = str2(detail.response_id) ?? before?.responseId ?? null;
-    const startedAt = status === "running" ? e.created_at : before?.startedAt;
-    const action = asAction(detail.action) ?? before?.action;
-    const documents = asStrings(detail.documents) ?? before?.documents;
-    const waiting = status === "waiting" ? asRecord(detail.waiting) : void 0;
-    const output = status === "done" ? asRecord(detail.output) : void 0;
-    const approved = Array.isArray(detail.approved) ? detail.approved.filter(asRecord) : void 0;
-    const finished2 = status === "done" || status === "skipped" || status === "failed";
-    const declinedBy = str2(detail.declined_by);
-    const afterFailure = status === "skipped" && (before?.status === "failed" || !!before?.skippedAfterFailure);
-    states[step] = {
-      status,
-      responseId,
-      error: str2(detail.error) ?? (afterFailure ? before?.error ?? null : null),
-      ...afterFailure ? { skippedAfterFailure: true } : {},
-      ...startedAt ? { startedAt } : {},
-      ...action ? { action } : {},
-      ...documents?.length ? { documents } : {},
-      ...waiting ? { waiting } : {},
-      ...output ? { output } : {},
-      ...approved ? { approved } : {},
-      ...finished2 ? { by: e.actor_ext_id ?? null } : {},
-      ...finished2 && e.created_at ? { at: e.created_at } : {},
-      ...declinedBy ? { declinedBy } : {}
-    };
-  }
-  return states;
-}
-function stepFields(step) {
-  return step.kind === "form" ? step.inputs : step.kind === "review" ? step.fields ?? [] : [];
-}
-var runFieldsOf = (steps) => steps.flatMap(stepFields);
-function runFields(workflow) {
-  return [...workflow.inputs, ...workflowSteps(workflow).flatMap(stepFields)];
-}
-function initialRunInputs(workflow, inputs = {}) {
-  return { ...defaultInputs({ ...workflow, inputs: runFields(workflow) }), ...inputs };
-}
-var finished = (s) => s?.status === "done" || s?.status === "skipped";
-function stepPhase(steps, states, id) {
-  const s = states[id];
-  if (s && s.status !== "pending") return s.status;
-  return stepDependencies(steps, id).every((d) => finished(states[d])) ? "ready" : "blocked";
-}
-var isRunFinished = (steps, states) => steps.length > 0 && steps.every((s) => finished(states[s.id]));
-var isPersonStep = (step) => step.kind !== "agent" && step.kind !== "action";
-var isPersonAction = (step) => step.kind === "action" && (step.action.type === "sign" || step.action.type === "email_draft");
-var canAssign = (step) => isPersonStep(step) || isPersonAction(step);
-function nextAction(steps, states, current, { needsStart = false, canRetry = false } = {}) {
-  const i = steps.findIndex((s) => s.id === current);
-  const step = steps[i];
-  if (!step) return "wait";
-  const phase = stepPhase(steps, states, step.id);
-  if (phase === "blocked") return "wait";
-  const following = steps[i + 1];
-  const independentNext = !!following && !dependsOn(steps, following.id, step.id);
-  if (phase === "done" || phase === "skipped") {
-    if (following) return "move";
-    return isRunFinished(steps, states) ? "finish" : "wait";
-  }
-  if (isPersonStep(step)) return "complete";
-  if (phase === "waiting" && step.kind === "action" && step.action.type === "email_draft")
-    return "complete";
-  if (phase === "ready" && needsStart) return "start";
-  if (phase !== "failed") return independentNext ? "move" : "wait";
-  const waitedFor = steps.slice(i + 1).some((s) => dependsOn(steps, s.id, step.id));
-  if (!waitedFor && following) return "move";
-  return canRetry ? "retry" : "wait";
-}
-function failedUpstream(steps, states, id) {
-  return upstreamSteps(steps, id).flatMap((s) => {
-    const state = states[s.id];
-    return state && (state.status === "failed" || state.skippedAfterFailure) ? [{ step: s, state }] : [];
-  });
-}
-function validateStep(step, inputs) {
-  const fields = stepFields(step);
-  if (!fields.length) return {};
-  return validateInputs(
-    {
-      id: step.id,
-      title: step.title,
-      inputs: fields},
-    inputs
-  );
-}
-function upstreamSteps(steps, id) {
-  return steps.filter((s) => s.id !== id && dependsOn(steps, id, s.id));
-}
-function sendBackTargets(steps, states, id) {
-  return upstreamSteps(steps, id).filter((s) => ["done", "skipped", "failed"].includes(states[s.id]?.status ?? "pending")).reverse();
-}
-var isBlankRef = (ref) => "step" in ref ? !ref.step : "input" in ref ? !ref.input : !ref.id.trim();
-function stepConfigProblems(steps) {
-  const out = [];
-  for (const s of steps) {
-    if (s.kind === "action") {
-      const a = s.action;
-      if (a.type === "sign") {
-        if (!a.document || isBlankRef(a.document)) out.push({ step: s.id, missing: "document" });
-        if (!a.signers.length) out.push({ step: s.id, missing: "signers" });
-      } else if (a.type === "email_draft") {
-        if (!a.to.some((t) => t.trim())) out.push({ step: s.id, missing: "recipients" });
-      } else {
-        if (!a.tags.length) out.push({ step: s.id, missing: "tags" });
-        if (Array.isArray(a.documents) && !a.documents.length)
-          out.push({ step: s.id, missing: "documents" });
-      }
-    }
-    if (s.kind === "agent" && s.editDocument && isBlankRef(s.editDocument))
-      out.push({ step: s.id, missing: "document" });
-  }
-  return out;
-}
-function splitDocRef(ref) {
-  const m = /^(doc-[A-Za-z0-9]+)(?:@v(\d+))?$/.exec(ref);
-  return m ? { id: m[1], ...m[2] ? { version: Number(m[2]) } : {} } : { id: ref };
-}
-var DEFAULT_ASSIGNEE_WORDING = {
-  runOwner: "whoever started the run",
-  projectLead: "the project lead",
-  input: "the person in \u201C{field}\u201D"
-};
-function assigneeName(assignee, options = {}) {
-  const w = { ...DEFAULT_ASSIGNEE_WORDING, ...options.wording };
-  const name = (id) => options.nameOf?.(id) ?? id;
-  const told = options.announcedTo ? options.nameOf?.(options.announcedTo) : void 0;
-  if (told) return told;
-  if (!assignee) return void 0;
-  if ("user" in assignee) return name(assignee.user);
-  if ("input" in assignee) {
-    const value = options.inputs?.[assignee.input];
-    if (typeof value === "string" && value) return name(value);
-    const label = options.fields?.find((f) => f.name === assignee.input)?.label ?? assignee.input;
-    return w.input.replace("{field}", label);
-  }
-  if ("runOwner" in assignee) return w.runOwner;
-  return w.projectLead;
-}
-var asText = (value) => typeof value === "string" ? value.trim() : typeof value === "number" ? String(value) : "";
-function fillStepInputs(templates, inputs) {
-  const out = {};
-  for (const [name, template] of Object.entries(templates ?? {})) {
-    const bare = /^\{\{\s*([a-z][a-z0-9_]*)\s*\}\}$/i.exec(template);
-    if (bare) {
-      out[name] = inputs[bare[1]] ?? "";
-      continue;
-    }
-    out[name] = fillRunText(template, inputs);
-  }
-  return out;
-}
-function fillRunText(template, inputs) {
-  return template.replace(/\{\{([^}]*)\}\}/g, (_, expr) => {
-    for (const ref of expr.split("||")) {
-      const text = asText(inputs[ref.trim()]);
-      if (text) return text;
-    }
-    return "";
-  }).trim();
-}
-function runThreadTitle(workflow, inputs) {
-  const template = workflow.run.kind === "steps" ? workflow.run.threadTitle : void 0;
-  return template && fillRunText(template, inputs) || workflow.title;
-}
-function reviewInstructions(step, inputs) {
-  return step.instructions && fillRunText(step.instructions, inputs) || step.title;
-}
-function composeStepPrompt(workflow, step, runInputs, { resolveWorkflow, compose } = {}) {
-  if (step.workflow) {
-    const target = resolveWorkflow?.(step.workflow);
-    if (!target) return "";
-    const inputs = { ...defaultInputs(target), ...fillStepInputs(step.with, runInputs) };
-    return target.run.kind === "prompt" ? composeWorkflowPrompt(target, inputs) : compose?.(target.id, inputs, runInputs) ?? "";
-  }
-  if (step.run?.kind === "prompt") {
-    return composeWorkflowPrompt(
-      { ...workflow, inputs: runFields(workflow), run: step.run },
-      runInputs
-    );
-  }
-  return compose?.(step.id, runInputs, runInputs) ?? "";
-}
-
 // src/agents/workflows/planSteps.ts
 function toPlanAssignee(a) {
   if ("user" in a) return { user: a.user };
@@ -994,7 +425,7 @@ function toStepField(f) {
     ...f.max !== void 0 ? { max: f.max } : {}
   };
 }
-var compact2 = (o) => Object.fromEntries(Object.entries(o).filter(([, v]) => v !== void 0 && v !== ""));
+var compact = (o) => Object.fromEntries(Object.entries(o).filter(([, v]) => v !== void 0 && v !== ""));
 function placeholders(workflow) {
   return Object.fromEntries(runFields(workflow).map((f) => [f.name, `{{${f.name}}}`]));
 }
@@ -1010,7 +441,7 @@ function agentStep(workflow, step, options) {
 function toPlanSteps(workflow, options = {}) {
   const layout = workflow.run.kind === "steps" ? workflow.run.layout : void 0;
   return workflowSteps(workflow).map((step) => {
-    const ui = compact2({
+    const ui = compact({
       description: step.description,
       icon: step.icon,
       commit: step.commit,
@@ -1116,7 +547,7 @@ function layoutFromPlanSteps(steps) {
   });
   return entries.length ? Object.fromEntries(entries) : void 0;
 }
-var FIELD_TYPES2 = /* @__PURE__ */ new Set([
+var FIELD_TYPES = /* @__PURE__ */ new Set([
   "text",
   "longtext",
   "boolean",
@@ -1130,7 +561,7 @@ var FIELD_TYPES2 = /* @__PURE__ */ new Set([
 function fromStepField(f) {
   return {
     name: f.name,
-    type: FIELD_TYPES2.has(f.type) ? f.type : "text",
+    type: FIELD_TYPES.has(f.type) ? f.type : "text",
     label: f.label ?? f.name,
     ...f.required ? { required: true } : {},
     ...f.options?.length ? { options: f.options.map((o) => ({ value: o.value, label: o.label ?? o.value })) } : {},
@@ -1337,7 +768,7 @@ function useWorkflowView(options) {
 // src/agents/workflows/stepWindow.ts
 var LABEL_MAX_PX = 320;
 var CHAR_PX = 6.5;
-var LEVEL_CHROME_PX = 56;
+var LEVEL_CHROME_PX = 60;
 var GROUP_CHIP_PX = 32;
 function levelRoomPx(titles) {
   const label = Math.max(0, ...titles.map((t) => Math.min(LABEL_MAX_PX, t.length * CHAR_PX)));
@@ -1405,20 +836,12 @@ function stepWindow({
     total: all.length
   };
 }
-function PhaseMark({ phase, icon }) {
-  if (phase === "done") return /* @__PURE__ */ jsx(Check, { className: "size-3.5 shrink-0" });
-  if (phase === "running") return /* @__PURE__ */ jsx(Loader2, { className: "size-3.5 shrink-0 animate-spin" });
-  if (phase === "waiting") return /* @__PURE__ */ jsx(Hourglass, { className: "size-3.5 shrink-0" });
-  if (phase === "failed") return /* @__PURE__ */ jsx(AlertTriangle, { className: "size-3.5 shrink-0" });
-  if (phase === "skipped") return /* @__PURE__ */ jsx(MinusCircle, { className: "size-3.5 shrink-0" });
-  return icon ? /* @__PURE__ */ jsx("span", { className: "flex size-3.5 shrink-0 items-center justify-center [&_svg]:size-3.5", children: icon }) : /* @__PURE__ */ jsx("span", { className: "mx-1 size-1.5 shrink-0 rounded-full bg-current opacity-60" });
-}
 var DEFAULT_STEP_BAR_LABELS = {
   nav: "Workflow steps",
   back: "Earlier steps",
   forward: "Later steps",
-  hiddenBefore: "{count} earlier steps: show all steps",
-  hiddenAfter: "{count} later steps: show all steps",
+  hiddenBefore: "{count} earlier steps",
+  hiddenAfter: "{count} later steps",
   position: "Step {position} of {total}",
   parallel: "{count} more in parallel",
   inParallel: "In parallel",
@@ -1436,53 +859,27 @@ var DEFAULT_STEP_BAR_LABELS = {
     failed: "Failed"
   }
 };
-function stepPillTone(phase, current) {
-  if (current) return "border-primary bg-primary/10 text-primary font-semibold shadow-sm";
-  switch (phase) {
-    case "done":
-      return "border-emerald-600/30 text-emerald-700 dark:border-emerald-400/30 dark:text-emerald-400";
-    case "running":
-      return "border-primary/40 bg-primary/5 text-primary";
-    case "waiting":
-      return "border-amber-500/40 text-amber-700 dark:text-amber-300";
-    case "failed":
-      return "border-destructive/40 text-destructive";
-    case "skipped":
-      return "border-border text-muted-foreground line-through decoration-1";
-    case "ready":
-      return "border-border text-foreground";
-    default:
-      return "border-dashed border-border text-muted-foreground";
-  }
-}
-var PHASE_TEXT = {
-  done: "text-emerald-700 dark:text-emerald-400",
-  running: "text-primary",
-  waiting: "text-amber-700 dark:text-amber-300",
-  failed: "text-destructive",
-  skipped: "text-muted-foreground",
-  ready: "text-foreground",
-  blocked: "text-muted-foreground"
-};
-var STEP_PILL = "flex min-w-0 items-center gap-1.5 whitespace-nowrap rounded-full border px-2.5 py-1 text-xs font-medium transition-colors";
 var STEP_LABEL = "min-w-[2.5rem] truncate";
 var STEP_LABEL_MAX = "max-w-[20rem]";
-var STEP_LABEL_CURRENT = "min-w-[2.5rem] max-w-[26rem] whitespace-normal text-left text-balance line-clamp-2";
+var STEP_LABEL_CURRENT = "block min-w-[2.5rem] max-w-[26rem] truncate";
 var STEP_EXTRA = "min-w-[3rem] shrink-[1000000] truncate font-normal opacity-80";
 var fill = (template, values) => Object.entries(values).reduce((s, [k, v]) => s.replace(`{${k}}`, String(v)), template);
 var NARROW_PX = 560;
+var ARROWS_PX = 56;
+var HIDDEN_PX = 40;
 function StepBarFrame({
   levels,
   phaseOf,
   current,
   onSelect,
   renderStep,
-  noteOf,
   renderAfter,
   leading,
   trailing,
+  reservePx = {},
   isSelectable = () => true,
   icon,
+  kindOf = () => "adhoc",
   disabled,
   labels,
   tid,
@@ -1494,11 +891,29 @@ function StepBarFrame({
   const narrow = width > 0 && width < NARROW_PX;
   const [start, setStart] = useState(null);
   useEffect(() => setStart(null), [current]);
-  const wholeFits = width >= levels.reduce((sum, lv) => sum + levelRoomPx(lv.map((s) => s.title)), 0);
-  const span = narrow ? 2 : wholeFits ? levels.length : 3;
+  const roomOf = (lv) => levelRoomPx(lv.map((s) => s.title));
+  const fits = (k) => {
+    const w = stepWindow({ levels, phaseOf, current, start, span: k });
+    const reserve = (reservePx.always ?? 0) + (w.start === 0 ? reservePx.leading ?? 0 : 0) + (w.canForward ? 0 : reservePx.trailing ?? 0) + ARROWS_PX + (w.hiddenBefore ? HIDDEN_PX : 0) + (w.hiddenAfter ? HIDDEN_PX : 0);
+    return width - reserve >= w.visible.reduce((sum, lv) => sum + roomOf(lv.steps), 0);
+  };
+  let span = width > 0 ? 1 : 3;
+  if (!narrow && width > 0) {
+    for (let k = levels.length; k > 1; k--)
+      if (fits(k)) {
+        span = k;
+        break;
+      }
+  }
   const win = stepWindow({ levels, phaseOf, current, start, span });
   const [listOpen, setListOpen] = useState(null);
   const move = (to) => setStart(Math.max(0, Math.min(win.levels.length - 1, to)));
+  const keyMoved = useRef(false);
+  useEffect(() => {
+    if (!keyMoved.current) return;
+    keyMoved.current = false;
+    box.current?.querySelector("[data-role] button")?.focus();
+  }, [win.start]);
   const select = (id) => {
     setListOpen(null);
     setStart(null);
@@ -1509,6 +924,7 @@ function StepBarFrame({
     const to = e.key === "ArrowLeft" ? win.start - 1 : e.key === "ArrowRight" ? win.start + 1 : e.key === "Home" ? 0 : e.key === "End" ? win.levels.length : null;
     if (to === null) return;
     e.preventDefault();
+    keyMoved.current = true;
     move(to);
   };
   const row = (s, isCurrent) => {
@@ -1522,13 +938,25 @@ function StepBarFrame({
         onClick: () => select(s.id),
         "aria-current": isCurrent ? "step" : void 0,
         className: cn(
+          `wf-kind-${kindOf(s)}`,
           "flex w-full min-w-0 items-center gap-2 rounded-md px-2 py-1 text-left text-xs hover:bg-accent disabled:cursor-default disabled:hover:bg-transparent",
-          isCurrent && "bg-primary/10 font-semibold text-primary"
+          isCurrent && "bg-accent font-semibold"
         ),
         "data-phase": phase,
         "data-testid": tid(`list-step-${s.id}`),
         children: [
-          /* @__PURE__ */ jsx("span", { className: cn("flex shrink-0", !isCurrent && PHASE_TEXT[phase]), children: /* @__PURE__ */ jsx(PhaseMark, { phase, icon: icon?.(s) }) }),
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "wf-badge flex size-5 shrink-0 items-center justify-center rounded-md [&_svg]:size-3",
+                phase === "done" && "bg-[hsl(var(--wf-accent))] text-card",
+                phase === "blocked" && "opacity-60"
+              ),
+              "aria-hidden": true,
+              children: /* @__PURE__ */ jsx(StepBadgeMark, { phase, icon: icon?.(s) })
+            }
+          ),
           /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", title: s.title, children: s.title }),
           /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[10px] font-normal text-muted-foreground", children: l.phases[phase] })
         ]
@@ -1547,12 +975,14 @@ function StepBarFrame({
     el.focus();
     el.scrollIntoView?.({ block: "nearest" });
   };
-  const allSteps = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("p", { className: "px-2 py-1 text-[11px] font-medium text-muted-foreground", children: fill(l.position, { position: win.position, total: win.total }) }),
-    /* @__PURE__ */ jsx("ol", { children: win.levels.map((level) => /* @__PURE__ */ jsxs(
+  const stepList = (side) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("p", { className: "px-2 py-1 text-[11px] font-medium text-muted-foreground", children: side ? fill(side === "before" ? l.hiddenBefore : l.hiddenAfter, {
+      count: side === "before" ? win.hiddenBefore : win.hiddenAfter
+    }) : fill(l.position, { position: win.position, total: win.total }) }),
+    /* @__PURE__ */ jsx("ol", { children: (side === "before" ? win.levels.slice(0, win.start) : side === "after" ? win.levels.slice(win.end) : win.levels).map((level) => /* @__PURE__ */ jsxs(
       "li",
       {
-        className: cn(level.steps.length > 1 && "my-0.5 border-l-2 border-primary/30 pl-1"),
+        className: cn(level.steps.length > 1 && "my-0.5 border-l-2 border-border pl-1"),
         children: [
           level.steps.length > 1 && /* @__PURE__ */ jsx("p", { className: "px-2 text-[10px] uppercase tracking-wide text-muted-foreground", children: l.inParallel }),
           level.steps.map((s) => row(s, s.id === atId))
@@ -1584,7 +1014,7 @@ function StepBarFrame({
         className: "max-h-[min(24rem,70vh)] w-72 overflow-y-auto p-1",
         onOpenAutoFocus: focusCurrent,
         "data-testid": tid("all-steps"),
-        children: allSteps
+        children: stepList()
       }
     )
   ] }) : null : count > 0 ? /* @__PURE__ */ jsxs(Popover, { open: listOpen === side, onOpenChange: (o) => setListOpen(o ? side : null), children: [
@@ -1609,7 +1039,7 @@ function StepBarFrame({
         className: "max-h-[min(24rem,70vh)] w-80 overflow-y-auto p-1",
         onOpenAutoFocus: focusCurrent,
         "data-testid": tid("all-steps"),
-        children: allSteps
+        children: stepList(side)
       }
     )
   ] }) : null;
@@ -1631,33 +1061,17 @@ function StepBarFrame({
     );
   };
   const running = win.runningHidden;
-  const workingPill = (s) => /* @__PURE__ */ jsxs(
-    "button",
-    {
-      type: "button",
-      onClick: () => select(s.id),
-      className: "flex min-w-0 max-w-[14rem] shrink items-center gap-1.5 rounded-full border border-primary/40 bg-primary/5 px-2 py-1 text-xs text-primary hover:bg-primary/10",
-      title: fill(l.working, { title: s.title }),
-      "data-testid": tid(`working-${s.id}`),
-      children: [
-        /* @__PURE__ */ jsx(Loader2, { className: "size-3.5 shrink-0 animate-spin" }),
-        /* @__PURE__ */ jsx("span", { className: "truncate", children: fill(l.working, { title: s.title }) })
-      ]
-    },
-    s.id
-  );
-  const failedPill = (s) => /* @__PURE__ */ jsxs(
-    "button",
+  const outOfViewChip = (s, kind) => /* @__PURE__ */ jsx(
+    StepChip,
     {
-      type: "button",
+      kind: kindOf(s),
+      phase: kind === "working" ? "running" : "failed",
+      label: fill(l[kind], { title: s.title }),
+      labelClassName: narrow ? "sr-only" : "truncate",
       onClick: () => select(s.id),
-      className: "flex min-w-0 max-w-[14rem] shrink items-center gap-1.5 rounded-full border border-destructive/40 bg-destructive/5 px-2 py-1 text-xs text-destructive hover:bg-destructive/10",
-      title: fill(l.failedStep, { title: s.title }),
-      "data-testid": tid(`failed-${s.id}`),
-      children: [
-        /* @__PURE__ */ jsx(AlertTriangle, { className: "size-3.5 shrink-0" }),
-        /* @__PURE__ */ jsx("span", { className: "truncate", children: fill(l.failedStep, { title: s.title }) })
-      ]
+      className: "max-w-[14rem] shrink",
+      title: fill(l[kind], { title: s.title }),
+      "data-testid": tid(`${kind === "working" ? "working" : "failed"}-${s.id}`)
     },
     s.id
   );
@@ -1667,7 +1081,7 @@ function StepBarFrame({
       ref: box,
       "aria-label": l.nav,
       onKeyDown,
-      className: cn("flex min-w-0 items-center gap-1", narrow && "flex-wrap", className),
+      className: cn("flex min-w-0 items-center gap-1", className),
       "data-testid": tid("steps"),
       "data-narrow": narrow || void 0,
       children: [
@@ -1700,10 +1114,8 @@ function StepBarFrame({
                 "span",
                 {
                   "aria-hidden": true,
-                  className: cn(
-                    "h-px min-w-2 flex-1",
-                    level.steps.every((s) => ["done", "skipped"].includes(phaseOf(s.id))) ? "bg-emerald-600/40" : "bg-border"
-                  )
+                  className: cn("wf-link", `wf-kind-${kindOf(level.primary)}`),
+                  "data-done": level.steps.every((s) => ["done", "skipped"].includes(phaseOf(s.id))) || void 0
                 }
               )
             ]
@@ -1713,30 +1125,21 @@ function StepBarFrame({
         overflow("after", win.hiddenAfter),
         !win.canForward && trailing,
         arrow("forward"),
-        narrow && atId && noteOf?.(atId) && /* @__PURE__ */ jsx(
-          "p",
-          {
-            className: "min-w-0 basis-full truncate px-1 text-[11px] text-muted-foreground",
-            "data-testid": tid("note"),
-            children: noteOf(atId)
-          }
-        ),
         running.length > 0 && /* @__PURE__ */ jsxs(
           "div",
           {
-            className: cn(
-              "flex min-w-[6.5rem] shrink-[1000] items-center gap-1",
-              narrow && "basis-full"
-            ),
+            className: cn("flex shrink-[1000] items-center gap-1", !narrow && "min-w-[6.5rem]"),
             "data-testid": tid("working"),
             children: [
-              (running.length > 2 ? running.slice(0, 1) : running).map(workingPill),
+              (running.length > 2 ? running.slice(0, 1) : running).map(
+                (s) => outOfViewChip(s, "working")
+              ),
               running.length > 2 && /* @__PURE__ */ jsxs(Popover, { children: [
                 /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
                   "button",
                   {
                     type: "button",
-                    className: "flex shrink-0 items-center gap-1 rounded-full border border-primary/40 bg-primary/5 px-2 py-1 text-xs text-primary hover:bg-primary/10",
+                    className: "flex shrink-0 items-center gap-1 rounded-lg border border-border bg-card px-2 py-1 text-xs text-muted-foreground hover:text-foreground",
                     "data-testid": tid("working-more"),
                     children: [
                       /* @__PURE__ */ jsx(Loader2, { className: "size-3.5 animate-spin" }),
@@ -1752,12 +1155,9 @@ function StepBarFrame({
         win.failedHidden.length > 0 && /* @__PURE__ */ jsx(
           "div",
           {
-            className: cn(
-              "flex min-w-[6.5rem] shrink-[1000] items-center gap-1",
-              narrow && "basis-full"
-            ),
+            className: cn("flex shrink-[1000] items-center gap-1", !narrow && "min-w-[6.5rem]"),
             "data-testid": tid("failed"),
-            children: win.failedHidden.map(failedPill)
+            children: win.failedHidden.map((s) => outOfViewChip(s, "failedStep"))
           }
         )
       ]
@@ -1776,7 +1176,7 @@ function GroupChip({
       "button",
       {
         type: "button",
-        className: "shrink-0 rounded-full border border-border bg-muted px-1.5 py-0.5 text-[11px] font-medium tabular-nums text-muted-foreground hover:border-primary/40 hover:text-primary",
+        className: "shrink-0 rounded-md border border-border bg-card px-1.5 py-0.5 text-[11px] font-medium tabular-nums text-muted-foreground shadow-sm hover:text-foreground",
         "aria-label": label,
         title: label,
         "data-testid": tid(`group-${level.steps[0].id}`),
@@ -1834,10 +1234,6 @@ var DEFAULT_WORKFLOW_STEP_PARTS_LABELS = {
   redlineHint: "The edits are tracked changes: accept or reject each one in Word.",
   someone: "someone"
 };
-var formatDate = (iso) => {
-  const t = iso ? Date.parse(iso) : NaN;
-  return Number.isNaN(t) ? "" : new Date(t).toLocaleString(void 0, { dateStyle: "medium", timeStyle: "short" });
-};
 var docName = (ref, nameOfDoc) => {
   const { id, version } = splitDocRef(ref);
   const name = nameOfDoc?.(id) ?? id;
@@ -1994,13 +1390,6 @@ function SendBackControl({
     }
   );
 }
-var shownValue = (v, field, nameOf) => {
-  if (v === void 0 || v === null || v === "") return "\u2014";
-  if (typeof v === "boolean") return v ? "\u2713" : "\u2717";
-  if (field.type === "person" && typeof v === "string") return nameOf?.(v) ?? v;
-  if (field.type === "select") return field.options?.find((o) => o.value === v)?.label ?? String(v);
-  return typeof v === "object" ? JSON.stringify(v) : String(v);
-};
 function ApprovalEvidence({
   run,
   step,
@@ -2294,12 +1683,7 @@ function WorkflowStepBar({
   const done = { id: DONE, title: doneTitle };
   const phaseOf = (id) => id === DONE ? run.isComplete ? "done" : "blocked" : run.phaseOf(id);
   const current = run.isComplete ? DONE : run.current;
-  const waitingOf = (id) => {
-    if (id === DONE || !["ready", "waiting"].includes(phaseOf(id))) return void 0;
-    const assignee = run.assigneeOf(id);
-    return assignee ? l.waitingFor.replace("{name}", assignee) : void 0;
-  };
-  const pill = (s, narrow = false) => {
+  const pill = (s) => {
     const phase = phaseOf(s.id);
     const isCurrent = s.id === current;
     const assignee = ["ready", "waiting"].includes(phase) ? run.assigneeOf(s.id) : void 0;
@@ -2309,55 +1693,51 @@ function WorkflowStepBar({
     const title = [s.title, waiting, failure].filter(Boolean).join(" \xB7 ");
     const name = `${title} (${l.phases[phase]})`;
     if (s.id === DONE)
-      return /* @__PURE__ */ jsxs(
-        "span",
+      return /* @__PURE__ */ jsx(
+        StepChip,
         {
-          className: cn(STEP_PILL, stepPillTone(phase, isCurrent)),
-          "aria-current": isCurrent ? "step" : void 0,
+          inert: true,
+          kind: "start",
+          phase: run.isComplete ? "done" : "ready",
+          icon: doneIcon,
+          label: doneTitle,
+          labelClassName: cn(STEP_LABEL, STEP_LABEL_MAX),
+          current: isCurrent,
           "aria-label": name,
           title: doneTitle,
-          "data-phase": phase,
-          "data-testid": tid("step-done"),
-          children: [
-            /* @__PURE__ */ jsx(PhaseMark, { phase: run.isComplete ? "done" : "ready", icon: doneIcon }),
-            /* @__PURE__ */ jsx("span", { className: cn(STEP_LABEL, STEP_LABEL_MAX), children: doneTitle })
-          ]
+          "data-testid": tid("step-done")
         }
       );
-    return /* @__PURE__ */ jsxs(
-      "button",
+    const kind = stepKindOf(s);
+    const KindIcon = STEP_KIND_ICONS[kind];
+    return /* @__PURE__ */ jsx(
+      StepChip,
       {
-        type: "button",
+        kind,
+        phase,
+        icon: icon(s.icon) ?? /* @__PURE__ */ jsx(KindIcon, {}),
+        label: s.title,
+        current: isCurrent,
+        heading: DEFAULT_STEP_KIND_LABELS[kind],
+        labelClassName: isCurrent ? STEP_LABEL_CURRENT : cn(STEP_LABEL, STEP_LABEL_MAX),
+        labelTestId: tid(`step-${s.id}-label`),
         onClick: () => run.goTo(s.id),
         disabled: run.busy,
-        className: cn(STEP_PILL, stepPillTone(phase, isCurrent), "disabled:cursor-default"),
-        "aria-current": isCurrent ? "step" : void 0,
+        className: "disabled:cursor-default",
         "aria-label": name,
         title,
-        "data-phase": phase,
         "data-testid": tid(`step-${s.id}`),
-        children: [
-          /* @__PURE__ */ jsx(PhaseMark, { phase, icon: icon(s.icon) }),
-          /* @__PURE__ */ jsx(
-            "span",
-            {
-              className: isCurrent ? STEP_LABEL_CURRENT : cn(STEP_LABEL, STEP_LABEL_MAX),
-              "data-testid": tid(`step-${s.id}-label`),
-              children: s.title
-            }
-          ),
-          assignee && isCurrent && !narrow && /* @__PURE__ */ jsxs(
-            "span",
-            {
-              className: cn(STEP_EXTRA, "max-w-[12rem]"),
-              "data-testid": tid(`step-${s.id}-assignee`),
-              children: [
-                "\xB7 ",
-                waiting
-              ]
-            }
-          )
-        ]
+        children: assignee && isCurrent && /* @__PURE__ */ jsxs(
+          "span",
+          {
+            className: cn(STEP_EXTRA, "max-w-[12rem]"),
+            "data-testid": tid(`step-${s.id}-assignee`),
+            children: [
+              "\xB7 ",
+              waiting
+            ]
+          }
+        )
       }
     );
   };
@@ -2369,9 +1749,9 @@ function WorkflowStepBar({
       current,
       onSelect: (id) => id !== DONE && run.goTo(id),
       isSelectable: (id) => id !== DONE,
-      renderStep: (s, _level, _win, narrow) => pill(s, narrow),
-      noteOf: waitingOf,
+      renderStep: (s) => pill(s),
       icon: (s) => s.id === DONE ? doneIcon : icon(s.icon),
+      kindOf: (s) => s.id === DONE ? "start" : stepKindOf(s),
       disabled: run.busy,
       labels,
       tid,
@@ -2442,7 +1822,7 @@ function WorkflowRunner({
   actions,
   nameOfDoc,
   hideStepBar,
-  compact: compact3,
+  compact: compact2,
   labels,
   partsLabels,
   testIdPrefix = "workflow-run",
@@ -2450,7 +1830,7 @@ function WorkflowRunner({
 }) {
   const l = { ...DEFAULT_WORKFLOW_RUNNER_LABELS, ...labels };
   const pl = { ...DEFAULT_WORKFLOW_STEP_PARTS_LABELS, ...partsLabels };
-  const box = compact3 ? "p-4" : "max-w-2xl p-6";
+  const box = compact2 ? "p-4" : "max-w-2xl p-6";
   const { steps, step, isComplete, action } = run;
   const completion = workflow.run.kind === "steps" ? workflow.run.completion : void 0;
   const tid = (suffix) => `${testIdPrefix}-${suffix}`;
@@ -2464,7 +1844,7 @@ function WorkflowRunner({
   const uploadHold = step?.kind === "upload" && (sending > 0 || uploading || unsent > 0);
   const docsWait = !!step && waitingDocuments(run.stateOf(step.id)).length > 0;
   const nextLabel = sending ? sending === 1 ? l.uploadingFile : l.uploadingFiles.replace("{count}", String(sending)) : uploadHold && uploading ? l.uploadingAny : uploadHold ? unsent === 1 ? l.uploadFailed : l.uploadsFailed.replace("{count}", String(unsent)) : reading ? l.readingFiles.replace("{current}", String(Math.min(added.length - unread + 1, added.length))).replace("{count}", String(added.length)) : action === "start" ? l.start : action === "retry" ? l.retry : action === "finish" ? l.finish : action === "complete" && step?.kind === "review" ? l.approve : action === "complete" && step?.kind === "action" ? l.markSent : action === "wait" && (run.isRunning || run.busy || docsWait) ? l.working : (step && !run.isLocked(step.id) ? step.nextLabel : void 0) ?? l.next;
-  return /* @__PURE__ */ jsxs("div", { className: cn(compact3 ? "space-y-3" : "space-y-6", className), "data-testid": testIdPrefix, children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn(compact2 ? "space-y-3" : "space-y-6", className), "data-testid": testIdPrefix, children: [
     !hideStepBar && /* @__PURE__ */ jsx(
       WorkflowStepBar,
       {
@@ -2605,7 +1985,7 @@ function WorkflowRunner({
           renderAgentOutput,
           icon: icon(step.icon),
           renderStepNote,
-          compact: compact3,
+          compact: compact2,
           nameOfDoc,
           extra: /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsx(SentBackNote, { state: run.stateOf(step.id), l: pl, testId: tid(step.id) }),
@@ -2630,7 +2010,7 @@ function WorkflowRunner({
       {
         className: cn(
           "flex items-center justify-between border-t border-border pt-4",
-          compact3 && "flex-wrap gap-2 pt-3"
+          compact2 && "flex-wrap gap-2 pt-3"
         ),
         children: [
           /* @__PURE__ */ jsxs(
@@ -2650,7 +2030,7 @@ function WorkflowRunner({
           /* @__PURE__ */ jsxs(
             "div",
             {
-              className: cn("flex items-center gap-2", compact3 && "ml-auto flex-wrap justify-end"),
+              className: cn("flex items-center gap-2", compact2 && "ml-auto flex-wrap justify-end"),
               children: [
                 step && // A step that commits (creates the matter, starts the thread) is what the run stands on.
                 !step.commit && ["ready", "blocked", "failed"].includes(run.phaseOf(step.id)) && /* @__PURE__ */ jsx(
@@ -2810,7 +2190,7 @@ function AgentStepBody({
   icon,
   renderStepNote,
   extra,
-  compact: compact3,
+  compact: compact2,
   nameOfDoc,
   l,
   tid
@@ -2873,7 +2253,7 @@ function AgentStepBody({
     phase === "skipped" && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", "data-testid": tid(`${step.id}-skipped`), children: state?.skippedAfterFailure ? l.skippedAfterFailure.replace("{error}", state.error ? `: ${state.error}` : "") : l.skipped }),
     extra
   ] });
-  if (step.output === "artifact" && !compact3) {
+  if (step.output === "artifact" && !compact2) {
     return /* @__PURE__ */ jsxs(
       "div",
       {
@@ -2890,7 +2270,7 @@ function AgentStepBody({
       }
     );
   }
-  return /* @__PURE__ */ jsxs(Card, { className: cn("space-y-3", compact3 ? "p-4" : "p-6"), "data-testid": tid(step.id), children: [
+  return /* @__PURE__ */ jsxs(Card, { className: cn("space-y-3", compact2 ? "p-4" : "p-6"), "data-testid": tid(step.id), children: [
     header,
     status,
     renderAgentOutput(step, state),
@@ -3131,6 +2511,6 @@ function TaskActivityTimeline({
   }) });
 }
 
-export { ActionStepBody, ApprovalEvidence, AssigneeLine, DEFAULT_ASSIGNEE_WORDING, DEFAULT_SCHEMA_FORM_LABELS, DEFAULT_STEP_BAR_LABELS, DEFAULT_TASK_ACTIVITY_LABELS, DEFAULT_WORKFLOW_RUNNER_LABELS, DEFAULT_WORKFLOW_STEP_PARTS_LABELS, EMPTY_WORKFLOW_SCOPE, PhaseMark, SKILL_PROMPT_FALLBACK_PLACEHOLDER, SKILL_PROMPT_LABEL, STEP_EXTRA, STEP_LABEL, STEP_LABEL_CURRENT, STEP_LABEL_MAX, STEP_PILL, SchemaForm, SendBackControl, StepBarFrame, TaskActivityTimeline, WorkflowRunner, WorkflowStepBar, activeStepId, assigneeName, buildLaunch, canAssign, composeStepPrompt, composeWorkflowPrompt, defaultInputs, dependsOn, eventWaitingDocuments, fieldToFrontmatter, fillRunText, fillStepInputs, fromPlanAssignee, fromPlanDocumentRef, fromPlanSteps, initialRunInputs, inputsFromContext, isEmptyWorkflowScope, isIncompleteSignal, isPersonAction, isPersonStep, isRunFinished, isSteppedWorkflow, isWorkflowScope, layoutFromPlanSteps, nextAction, orderSteps, promptFieldName, reviewInstructions, runFields, runFieldsOf, runThreadTitle, sendBackTargets, skillToWorkflow, splitDocRef, stepConfigProblems, stepDependencies, stepFields, stepLevels, stepPhase, stepPillTone, stepStatesFromActivity, stepWindow, taskActivityHeadline, toPlanAssignee, toPlanDocumentRef, toPlanSteps, upstreamSteps, useWorkflowView, validateInputs, validateStep, validateWorkflowGraph, waitingDocuments, waitingForDocumentsText, workflowAccepts, workflowFromFrontmatter, workflowSteps, workflowsAccepting, workflowsForHost };
-//# sourceMappingURL=chunk-AY32GGKU.js.map
-//# sourceMappingURL=chunk-AY32GGKU.js.map
+export { ActionStepBody, ApprovalEvidence, AssigneeLine, DEFAULT_SCHEMA_FORM_LABELS, DEFAULT_STEP_BAR_LABELS, DEFAULT_TASK_ACTIVITY_LABELS, DEFAULT_WORKFLOW_RUNNER_LABELS, DEFAULT_WORKFLOW_STEP_PARTS_LABELS, STEP_LABEL, STEP_LABEL_CURRENT, STEP_LABEL_MAX, SchemaForm, SendBackControl, StepBarFrame, TaskActivityTimeline, WorkflowRunner, WorkflowStepBar, activeStepId, fromPlanAssignee, fromPlanDocumentRef, fromPlanSteps, isIncompleteSignal, layoutFromPlanSteps, stepWindow, taskActivityHeadline, toPlanAssignee, toPlanDocumentRef, toPlanSteps, useWorkflowView };
+//# sourceMappingURL=chunk-MD7RVFKA.js.map
+//# sourceMappingURL=chunk-MD7RVFKA.js.map