@open-mercato/core 0.7.1-develop.7193.1.910a5b0a1e → 0.7.1-develop.7195.1.b5efd1d51a

package/dist/modules/workflows/components/portal/PortalTaskForm.js

@@ -0,0 +1,196 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { Input } from "@open-mercato/ui/primitives/input";
+import { Textarea } from "@open-mercato/ui/primitives/textarea";
+import { Checkbox } from "@open-mercato/ui/primitives/checkbox";
+import { Label } from "@open-mercato/ui/primitives/label";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from "@open-mercato/ui/primitives/select";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { normalizeTaskFormSchema, readRequiredFormFields } from "../../lib/task-form-schema.js";
+import { resolveTaskForm } from "../../lib/task-form-registry.js";
+function RequiredMark({ required }) {
+  const t = useT();
+  if (!required) return null;
+  return /* @__PURE__ */ jsx("span", { className: "ml-1 text-status-error-text", "aria-label": t("workflows.portal.tasks.form.required", "Required"), children: "*" });
+}
+function PortalTaskForm(props) {
+  const t = useT();
+  const {
+    taskId,
+    taskName,
+    formSchema,
+    formKey,
+    entityBindings,
+    decisions,
+    values,
+    comments,
+    submitting,
+    onFieldChange,
+    onValuesChange,
+    onCommentsChange,
+    onSubmit
+  } = props;
+  const schema = React.useMemo(() => normalizeTaskFormSchema(formSchema), [formSchema]);
+  const required = React.useMemo(() => readRequiredFormFields(formSchema), [formSchema]);
+  const resolution = React.useMemo(() => resolveTaskForm(formKey), [formKey]);
+  const handleSubmit = React.useCallback(
+    (event) => {
+      event.preventDefault();
+      if (decisions.length === 0) onSubmit();
+    },
+    [decisions.length, onSubmit]
+  );
+  const renderField = (name, field) => {
+    const label = field.title || name;
+    const isRequired = required.includes(name);
+    const raw = values[name];
+    const options = Array.isArray(field.enum) ? field.enum : null;
+    if (options?.length) {
+      return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsxs(Label, { htmlFor: name, children: [
+          label,
+          /* @__PURE__ */ jsx(RequiredMark, { required: isRequired })
+        ] }),
+        /* @__PURE__ */ jsxs(
+          Select,
+          {
+            value: typeof raw === "string" ? raw : "",
+            onValueChange: (value) => onFieldChange(name, value),
+            disabled: submitting,
+            children: [
+              /* @__PURE__ */ jsx(SelectTrigger, { id: name, className: "w-full", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: t("workflows.portal.tasks.form.select", "Select\u2026") }) }),
+              /* @__PURE__ */ jsx(SelectContent, { children: options.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: String(option), children: String(option) }, String(option))) })
+            ]
+          }
+        ),
+        field.description ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: field.description }) : null
+      ] }, name);
+    }
+    if (field.type === "boolean") {
+      return /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+        /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            id: name,
+            checked: raw === true,
+            onCheckedChange: (checked) => onFieldChange(name, checked === true),
+            disabled: submitting,
+            className: "mt-0.5"
+          }
+        ),
+        /* @__PURE__ */ jsxs(Label, { htmlFor: name, className: "font-normal", children: [
+          label,
+          /* @__PURE__ */ jsx(RequiredMark, { required: isRequired }),
+          field.description ? /* @__PURE__ */ jsx("span", { className: "mt-0.5 block text-sm text-muted-foreground", children: field.description }) : null
+        ] })
+      ] }, name);
+    }
+    const isLongText = field.type === "string" && (field.description ?? "").length > 0 && !field.format;
+    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsxs(Label, { htmlFor: name, children: [
+        label,
+        /* @__PURE__ */ jsx(RequiredMark, { required: isRequired })
+      ] }),
+      isLongText ? /* @__PURE__ */ jsx(
+        Textarea,
+        {
+          id: name,
+          value: typeof raw === "boolean" ? "" : raw ?? "",
+          onChange: (event) => onFieldChange(name, event.target.value),
+          disabled: submitting,
+          rows: 4
+        }
+      ) : /* @__PURE__ */ jsx(
+        Input,
+        {
+          id: name,
+          type: field.type === "number" || field.type === "integer" ? "number" : "text",
+          value: typeof raw === "boolean" ? "" : raw ?? "",
+          onChange: (event) => onFieldChange(
+            name,
+            field.type === "number" || field.type === "integer" ? Number(event.target.value) : event.target.value
+          ),
+          disabled: submitting
+        }
+      ),
+      field.description && !isLongText ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: field.description }) : null
+    ] }, name);
+  };
+  const properties = schema?.properties ?? {};
+  const fieldNames = Object.keys(properties);
+  return /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-6", children: [
+    resolution.kind === "missing" ? (
+      // The author asked for a renderer nobody loaded. Falling back silently
+      // would render a form that is not the one they designed, and the person
+      // who can notice is the one looking at the screen — so say it out loud.
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          role: "status",
+          className: "rounded-lg border border-status-warning-border bg-status-warning-bg p-4 text-sm text-status-warning-text",
+          children: t(
+            "workflows.portal.tasks.form.rendererMissing",
+            'This task asks for the "{formKey}" form, which is not available here. The standard form is shown instead.',
+            { formKey: resolution.formKey }
+          )
+        }
+      )
+    ) : null,
+    resolution.kind === "registered" ? /* @__PURE__ */ jsx(
+      resolution.entry.Renderer,
+      {
+        context: {
+          taskId,
+          taskName,
+          formKey: resolution.entry.formKey,
+          formSchema,
+          entityBindings,
+          decisions: decisions.map((decision) => ({ id: decision.id })),
+          values,
+          disabled: submitting
+        },
+        onChange: (next) => onValuesChange(next)
+      }
+    ) : /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-5", children: fieldNames.length > 0 ? fieldNames.map((name) => renderField(name, properties[name])) : /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t(
+      "workflows.portal.tasks.form.noFields",
+      "This task has nothing to fill in \u2014 confirm it below when you are done."
+    ) }) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsx(Label, { htmlFor: "portal-task-comments", children: t("workflows.portal.tasks.form.comments", "Comments") }),
+      /* @__PURE__ */ jsx(
+        Textarea,
+        {
+          id: "portal-task-comments",
+          value: comments,
+          onChange: (event) => onCommentsChange(event.target.value),
+          disabled: submitting,
+          rows: 3,
+          placeholder: t("workflows.portal.tasks.form.commentsPlaceholder", "Anything to add? (optional)")
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2 sm:flex-row sm:flex-wrap", children: decisions.length > 0 ? decisions.map((decision) => /* @__PURE__ */ jsx(
+      Button,
+      {
+        type: "button",
+        disabled: submitting,
+        onClick: () => onSubmit(decision.id),
+        className: "w-full sm:w-auto",
+        children: decision.label
+      },
+      decision.id
+    )) : /* @__PURE__ */ jsx(Button, { type: "submit", disabled: submitting, className: "w-full sm:w-auto", children: submitting ? t("workflows.portal.tasks.form.submitting", "Submitting\u2026") : t("workflows.portal.tasks.form.submit", "Complete task") }) })
+  ] });
+}
+export {
+  PortalTaskForm
+};
+//# sourceMappingURL=PortalTaskForm.js.map

package/dist/modules/workflows/components/portal/PortalTaskForm.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/workflows/components/portal/PortalTaskForm.tsx"],
+  "sourcesContent": ["'use client'\n\n/**\n * The portal's task form.\n *\n * `components/mobile/MobileTaskForm.tsx` is the LAYOUT reference \u2014 it is a\n * backoffice component, it takes a backoffice `UserTaskResponse` and renders\n * backoffice chrome, so it is read and not imported. What is shared is the part\n * that must not diverge: the schema normalizer (`lib/task-form-schema.ts`) and\n * the external renderer registry (`lib/task-form-registry.ts`), so a form\n * authored once renders the same fields on both surfaces.\n *\n * Mobile-first: one column, full-width controls, stacked actions; the two-column\n * arrangement is the `sm:` enhancement, not the base.\n */\n\nimport * as React from 'react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Input } from '@open-mercato/ui/primitives/input'\nimport { Textarea } from '@open-mercato/ui/primitives/textarea'\nimport { Checkbox } from '@open-mercato/ui/primitives/checkbox'\nimport { Label } from '@open-mercato/ui/primitives/label'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@open-mercato/ui/primitives/select'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { normalizeTaskFormSchema, readRequiredFormFields } from '../../lib/task-form-schema'\nimport { resolveTaskForm } from '../../lib/task-form-registry'\nimport type { JsonSchemaField } from '../../data/types'\n\nexport type PortalTaskFormValue = string | number | boolean\n\nexport type PortalTaskDecision = { id: string; label: string }\n\nexport type PortalTaskFormProps = {\n  taskId: string\n  taskName: string\n  formSchema: unknown\n  formKey: string | null\n  entityBindings: unknown[] | null\n  decisions: PortalTaskDecision[]\n  values: Record<string, PortalTaskFormValue>\n  comments: string\n  submitting: boolean\n  onFieldChange: (name: string, value: PortalTaskFormValue) => void\n  onValuesChange: (values: Record<string, PortalTaskFormValue>) => void\n  onCommentsChange: (value: string) => void\n  onSubmit: (decisionId?: string) => void\n}\n\nfunction RequiredMark({ required }: { required: boolean }) {\n  const t = useT()\n  if (!required) return null\n  return (\n    <span className=\"ml-1 text-status-error-text\" aria-label={t('workflows.portal.tasks.form.required', 'Required')}>\n      *\n    </span>\n  )\n}\n\nexport function PortalTaskForm(props: PortalTaskFormProps) {\n  const t = useT()\n  const {\n    taskId,\n    taskName,\n    formSchema,\n    formKey,\n    entityBindings,\n    decisions,\n    values,\n    comments,\n    submitting,\n    onFieldChange,\n    onValuesChange,\n    onCommentsChange,\n    onSubmit,\n  } = props\n\n  const schema = React.useMemo(() => normalizeTaskFormSchema(formSchema), [formSchema])\n  const required = React.useMemo(() => readRequiredFormFields(formSchema), [formSchema])\n  const resolution = React.useMemo(() => resolveTaskForm(formKey), [formKey])\n\n  const handleSubmit = React.useCallback(\n    (event: React.FormEvent) => {\n      event.preventDefault()\n      // A step that offers named outcomes must not also offer an unnamed one, or\n      // the recorded decision becomes optional.\n      if (decisions.length === 0) onSubmit()\n    },\n    [decisions.length, onSubmit],\n  )\n\n  const renderField = (name: string, field: JsonSchemaField) => {\n    const label = field.title || name\n    const isRequired = required.includes(name)\n    const raw = values[name]\n    const options = Array.isArray(field.enum) ? field.enum : null\n\n    if (options?.length) {\n      return (\n        <div key={name} className=\"flex flex-col gap-2\">\n          <Label htmlFor={name}>\n            {label}\n            <RequiredMark required={isRequired} />\n          </Label>\n          <Select\n            value={typeof raw === 'string' ? raw : ''}\n            onValueChange={(value) => onFieldChange(name, value)}\n            disabled={submitting}\n          >\n            <SelectTrigger id={name} className=\"w-full\">\n              <SelectValue placeholder={t('workflows.portal.tasks.form.select', 'Select\u2026')} />\n            </SelectTrigger>\n            <SelectContent>\n              {options.map((option) => (\n                <SelectItem key={String(option)} value={String(option)}>\n                  {String(option)}\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </Select>\n          {field.description ? (\n            <p className=\"text-sm text-muted-foreground\">{field.description}</p>\n          ) : null}\n        </div>\n      )\n    }\n\n    if (field.type === 'boolean') {\n      return (\n        <div key={name} className=\"flex items-start gap-3\">\n          <Checkbox\n            id={name}\n            checked={raw === true}\n            onCheckedChange={(checked) => onFieldChange(name, checked === true)}\n            disabled={submitting}\n            className=\"mt-0.5\"\n          />\n          <Label htmlFor={name} className=\"font-normal\">\n            {label}\n            <RequiredMark required={isRequired} />\n            {field.description ? (\n              <span className=\"mt-0.5 block text-sm text-muted-foreground\">{field.description}</span>\n            ) : null}\n          </Label>\n        </div>\n      )\n    }\n\n    const isLongText = field.type === 'string' && (field.description ?? '').length > 0 && !field.format\n\n    return (\n      <div key={name} className=\"flex flex-col gap-2\">\n        <Label htmlFor={name}>\n          {label}\n          <RequiredMark required={isRequired} />\n        </Label>\n        {isLongText ? (\n          <Textarea\n            id={name}\n            value={typeof raw === 'boolean' ? '' : (raw ?? '')}\n            onChange={(event) => onFieldChange(name, event.target.value)}\n            disabled={submitting}\n            rows={4}\n          />\n        ) : (\n          <Input\n            id={name}\n            type={field.type === 'number' || field.type === 'integer' ? 'number' : 'text'}\n            value={typeof raw === 'boolean' ? '' : (raw ?? '')}\n            onChange={(event) =>\n              onFieldChange(\n                name,\n                field.type === 'number' || field.type === 'integer'\n                  ? Number(event.target.value)\n                  : event.target.value,\n              )\n            }\n            disabled={submitting}\n          />\n        )}\n        {field.description && !isLongText ? (\n          <p className=\"text-sm text-muted-foreground\">{field.description}</p>\n        ) : null}\n      </div>\n    )\n  }\n\n  const properties = schema?.properties ?? {}\n  const fieldNames = Object.keys(properties)\n\n  return (\n    <form onSubmit={handleSubmit} className=\"flex flex-col gap-6\">\n      {resolution.kind === 'missing' ? (\n        // The author asked for a renderer nobody loaded. Falling back silently\n        // would render a form that is not the one they designed, and the person\n        // who can notice is the one looking at the screen \u2014 so say it out loud.\n        <div\n          role=\"status\"\n          className=\"rounded-lg border border-status-warning-border bg-status-warning-bg p-4 text-sm text-status-warning-text\"\n        >\n          {t(\n            'workflows.portal.tasks.form.rendererMissing',\n            'This task asks for the \"{formKey}\" form, which is not available here. The standard form is shown instead.',\n            { formKey: resolution.formKey },\n          )}\n        </div>\n      ) : null}\n\n      {resolution.kind === 'registered' ? (\n        <resolution.entry.Renderer\n          context={{\n            taskId,\n            taskName,\n            formKey: resolution.entry.formKey,\n            formSchema,\n            entityBindings,\n            decisions: decisions.map((decision) => ({ id: decision.id })),\n            values,\n            disabled: submitting,\n          }}\n          onChange={(next) => onValuesChange(next as Record<string, PortalTaskFormValue>)}\n        />\n      ) : (\n        <div className=\"flex flex-col gap-5\">\n          {fieldNames.length > 0 ? (\n            fieldNames.map((name) => renderField(name, properties[name] as JsonSchemaField))\n          ) : (\n            <p className=\"text-sm text-muted-foreground\">\n              {t(\n                'workflows.portal.tasks.form.noFields',\n                'This task has nothing to fill in \u2014 confirm it below when you are done.',\n              )}\n            </p>\n          )}\n        </div>\n      )}\n\n      <div className=\"flex flex-col gap-2\">\n        <Label htmlFor=\"portal-task-comments\">\n          {t('workflows.portal.tasks.form.comments', 'Comments')}\n        </Label>\n        <Textarea\n          id=\"portal-task-comments\"\n          value={comments}\n          onChange={(event) => onCommentsChange(event.target.value)}\n          disabled={submitting}\n          rows={3}\n          placeholder={t('workflows.portal.tasks.form.commentsPlaceholder', 'Anything to add? (optional)')}\n        />\n      </div>\n\n      <div className=\"flex flex-col gap-2 sm:flex-row sm:flex-wrap\">\n        {decisions.length > 0 ? (\n          decisions.map((decision) => (\n            <Button\n              key={decision.id}\n              type=\"button\"\n              disabled={submitting}\n              onClick={() => onSubmit(decision.id)}\n              className=\"w-full sm:w-auto\"\n            >\n              {decision.label}\n            </Button>\n          ))\n        ) : (\n          <Button type=\"submit\" disabled={submitting} className=\"w-full sm:w-auto\">\n            {submitting\n              ? t('workflows.portal.tasks.form.submitting', 'Submitting\u2026')\n              : t('workflows.portal.tasks.form.submit', 'Complete task')}\n          </Button>\n        )}\n      </div>\n    </form>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/modules/workflows/components/run/AgentActivityPanel.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { Badge } from "@open-mercato/ui/primitives/badge";
+import { useLiveAgentActions } from "./useLiveAgentActions.js";
+function AgentActivityPanel({ instanceId, enabled = true }) {
+  const t = useT();
+  const actions = useLiveAgentActions({ instanceId, enabled });
+  if (actions.length === 0) return null;
+  return /* @__PURE__ */ jsxs("section", { className: "rounded-md border border-border p-3", "aria-live": "polite", children: [
+    /* @__PURE__ */ jsx("h3", { className: "text-sm font-medium text-foreground", children: t("run.agentActivity.title") }),
+    /* @__PURE__ */ jsx("p", { className: "mt-0.5 text-xs text-muted-foreground", children: t("run.agentActivity.subtitle") }),
+    /* @__PURE__ */ jsx("ul", { className: "mt-2 space-y-1", children: actions.map((action) => /* @__PURE__ */ jsxs("li", { className: "flex items-center gap-2 text-sm", children: [
+      /* @__PURE__ */ jsx(Badge, { size: "sm", children: action.kind === "tool_call" ? t("run.agentActivity.toolCall") : t("run.agentActivity.step") }),
+      /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: action.name ?? `${t("run.agentActivity.step")} ${action.stepIndex + 1}` })
+    ] }, action.key)) })
+  ] });
+}
+export {
+  AgentActivityPanel
+};
+//# sourceMappingURL=AgentActivityPanel.js.map

package/dist/modules/workflows/components/run/AgentActivityPanel.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/workflows/components/run/AgentActivityPanel.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { Badge } from '@open-mercato/ui/primitives/badge'\nimport { useLiveAgentActions } from './useLiveAgentActions'\n\n/**\n * Live \"Agent activity\" section for the run detail (workflows spec Phase 2).\n *\n * Renders the append-only stream of agent actions (steps + tool calls) from\n * `useLiveAgentActions` while an INVOKE_AGENT step runs. Ephemeral by design:\n * it shows nothing until the first action arrives and keeps nothing after the\n * run \u2014 so it renders `null` when idle and is safe to always mount. No token\n * text (the tool loop uses `generateText`, which does not stream tokens).\n */\nexport type AgentActivityPanelProps = {\n  instanceId?: string | null\n  enabled?: boolean\n}\n\nexport function AgentActivityPanel({ instanceId, enabled = true }: AgentActivityPanelProps) {\n  const t = useT()\n  const actions = useLiveAgentActions({ instanceId, enabled })\n\n  if (actions.length === 0) return null\n\n  return (\n    <section className=\"rounded-md border border-border p-3\" aria-live=\"polite\">\n      <h3 className=\"text-sm font-medium text-foreground\">{t('run.agentActivity.title')}</h3>\n      <p className=\"mt-0.5 text-xs text-muted-foreground\">{t('run.agentActivity.subtitle')}</p>\n      <ul className=\"mt-2 space-y-1\">\n        {actions.map((action) => (\n          <li key={action.key} className=\"flex items-center gap-2 text-sm\">\n            <Badge size=\"sm\">\n              {action.kind === 'tool_call'\n                ? t('run.agentActivity.toolCall')\n                : t('run.agentActivity.step')}\n            </Badge>\n            <span className=\"text-muted-foreground\">\n              {action.name ?? `${t('run.agentActivity.step')} ${action.stepIndex + 1}`}\n            </span>\n          </li>\n        ))}\n      </ul>\n    </section>\n  )\n}\n"],
+  "mappings": ";AA6BM,cAII,YAJJ;AA1BN,SAAS,YAAY;AACrB,SAAS,aAAa;AACtB,SAAS,2BAA2B;AAgB7B,SAAS,mBAAmB,EAAE,YAAY,UAAU,KAAK,GAA4B;AAC1F,QAAM,IAAI,KAAK;AACf,QAAM,UAAU,oBAAoB,EAAE,YAAY,QAAQ,CAAC;AAE3D,MAAI,QAAQ,WAAW,EAAG,QAAO;AAEjC,SACE,qBAAC,aAAQ,WAAU,uCAAsC,aAAU,UACjE;AAAA,wBAAC,QAAG,WAAU,uCAAuC,YAAE,yBAAyB,GAAE;AAAA,IAClF,oBAAC,OAAE,WAAU,wCAAwC,YAAE,4BAA4B,GAAE;AAAA,IACrF,oBAAC,QAAG,WAAU,kBACX,kBAAQ,IAAI,CAAC,WACZ,qBAAC,QAAoB,WAAU,mCAC7B;AAAA,0BAAC,SAAM,MAAK,MACT,iBAAO,SAAS,cACb,EAAE,4BAA4B,IAC9B,EAAE,wBAAwB,GAChC;AAAA,MACA,oBAAC,UAAK,WAAU,yBACb,iBAAO,QAAQ,GAAG,EAAE,wBAAwB,CAAC,IAAI,OAAO,YAAY,CAAC,IACxE;AAAA,SARO,OAAO,GAShB,CACD,GACH;AAAA,KACF;AAEJ;",
+  "names": []
+}

package/dist/modules/workflows/components/run/RerunStepDialog.js

@@ -0,0 +1,106 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import {
+  Drawer,
+  DrawerBody,
+  DrawerContent,
+  DrawerDescription,
+  DrawerFooter,
+  DrawerHeader,
+  DrawerTitle
+} from "@open-mercato/ui/primitives/drawer";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { Textarea } from "@open-mercato/ui/primitives/textarea";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+function RerunStepDialog({
+  open,
+  onOpenChange,
+  stepId,
+  stepLabel,
+  isSubmitting = false,
+  onConfirm
+}) {
+  const t = useT();
+  const [patchText, setPatchText] = React.useState("");
+  const [parseError, setParseError] = React.useState(null);
+  React.useEffect(() => {
+    if (!open) {
+      setPatchText("");
+      setParseError(null);
+    }
+  }, [open]);
+  const submit = React.useCallback(() => {
+    const trimmed = patchText.trim();
+    if (!trimmed) {
+      setParseError(null);
+      onConfirm(void 0);
+      return;
+    }
+    try {
+      const parsed = JSON.parse(trimmed);
+      if (!parsed || typeof parsed !== "object" || Array.isArray(parsed)) {
+        setParseError(
+          t("workflows.rerunStep.patchNotAnObject", "The context patch must be a JSON object.")
+        );
+        return;
+      }
+      setParseError(null);
+      onConfirm(parsed);
+    } catch {
+      setParseError(t("workflows.rerunStep.patchInvalid", "The context patch is not valid JSON."));
+    }
+  }, [patchText, onConfirm, t]);
+  return /* @__PURE__ */ jsx(Drawer, { open, onOpenChange, children: /* @__PURE__ */ jsxs(
+    DrawerContent,
+    {
+      "data-testid": "workflow-rerun-step-drawer",
+      onKeyDown: (event) => {
+        if ((event.metaKey || event.ctrlKey) && event.key === "Enter") {
+          event.preventDefault();
+          submit();
+        }
+      },
+      closeAriaLabel: t("workflows.rerunStep.close", "Close rerun panel"),
+      children: [
+        /* @__PURE__ */ jsxs(DrawerHeader, { children: [
+          /* @__PURE__ */ jsx(DrawerTitle, { children: t("workflows.rerunStep.title", "Rerun from this step") }),
+          /* @__PURE__ */ jsx(DrawerDescription, { children: t(
+            "workflows.rerunStep.description",
+            "The run continues from {step}. The previous attempt is kept in the history, and the rerun is recorded in the audit log.",
+            { step: stepLabel || stepId || "" }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsxs(DrawerBody, { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx("label", { className: "text-sm font-medium text-foreground", htmlFor: "workflow-rerun-context-patch", children: t("workflows.rerunStep.patchLabel", "Context patch (optional JSON)") }),
+          /* @__PURE__ */ jsx(
+            Textarea,
+            {
+              id: "workflow-rerun-context-patch",
+              value: patchText,
+              onChange: (event) => setPatchText(event.target.value),
+              rows: 6,
+              className: "font-mono text-xs",
+              placeholder: '{\n  "amount": 250\n}'
+            }
+          ),
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: t(
+            "workflows.rerunStep.patchHint",
+            "Merged over the run context. Only the keys you provide change."
+          ) }),
+          parseError ? /* @__PURE__ */ jsx("p", { className: "text-xs text-status-error-text", children: parseError }) : null
+        ] }),
+        /* @__PURE__ */ jsxs(DrawerFooter, { children: [
+          /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", onClick: () => onOpenChange(false), disabled: isSubmitting, children: t("common.cancel") }),
+          /* @__PURE__ */ jsx(Button, { type: "button", onClick: submit, disabled: isSubmitting || !stepId, children: t("workflows.rerunStep.confirm", "Rerun step") })
+        ] })
+      ]
+    }
+  ) });
+}
+var RerunStepDialog_default = RerunStepDialog;
+export {
+  RerunStepDialog,
+  RerunStepDialog_default as default
+};
+//# sourceMappingURL=RerunStepDialog.js.map

package/dist/modules/workflows/components/run/RerunStepDialog.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/workflows/components/run/RerunStepDialog.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport {\n  Drawer,\n  DrawerBody,\n  DrawerContent,\n  DrawerDescription,\n  DrawerFooter,\n  DrawerHeader,\n  DrawerTitle,\n} from '@open-mercato/ui/primitives/drawer'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Textarea } from '@open-mercato/ui/primitives/textarea'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\n\nexport type RerunStepDialogProps = {\n  open: boolean\n  onOpenChange: (open: boolean) => void\n  stepId: string | null\n  stepLabel?: string | null\n  isSubmitting?: boolean\n  /** Resolves once the rerun has been requested; the host closes the dialog. */\n  onConfirm: (contextPatch: Record<string, unknown> | undefined) => void\n}\n\n/**\n * Rerun-from-step confirmation (spec \u00A78.4: \"optionally with edited context\").\n *\n * The patch is authored as JSON and MERGED over the run context \u2014 only the keys\n * present are changed, and the `STEP_RERUN` event records exactly which ones\n * moved. Parsing happens here so an unparseable patch never reaches the API as\n * a silently-dropped edit.\n */\nexport function RerunStepDialog({\n  open,\n  onOpenChange,\n  stepId,\n  stepLabel,\n  isSubmitting = false,\n  onConfirm,\n}: RerunStepDialogProps) {\n  const t = useT()\n  const [patchText, setPatchText] = React.useState('')\n  const [parseError, setParseError] = React.useState<string | null>(null)\n\n  React.useEffect(() => {\n    if (!open) {\n      setPatchText('')\n      setParseError(null)\n    }\n  }, [open])\n\n  const submit = React.useCallback(() => {\n    const trimmed = patchText.trim()\n    if (!trimmed) {\n      setParseError(null)\n      onConfirm(undefined)\n      return\n    }\n    try {\n      const parsed = JSON.parse(trimmed)\n      if (!parsed || typeof parsed !== 'object' || Array.isArray(parsed)) {\n        setParseError(\n          t('workflows.rerunStep.patchNotAnObject', 'The context patch must be a JSON object.')\n        )\n        return\n      }\n      setParseError(null)\n      onConfirm(parsed as Record<string, unknown>)\n    } catch {\n      setParseError(t('workflows.rerunStep.patchInvalid', 'The context patch is not valid JSON.'))\n    }\n  }, [patchText, onConfirm, t])\n\n  return (\n    <Drawer open={open} onOpenChange={onOpenChange}>\n      <DrawerContent\n        data-testid=\"workflow-rerun-step-drawer\"\n        onKeyDown={(event) => {\n          if ((event.metaKey || event.ctrlKey) && event.key === 'Enter') {\n            event.preventDefault()\n            submit()\n          }\n        }}\n        closeAriaLabel={t('workflows.rerunStep.close', 'Close rerun panel')}\n      >\n        <DrawerHeader>\n          <DrawerTitle>{t('workflows.rerunStep.title', 'Rerun from this step')}</DrawerTitle>\n          <DrawerDescription>\n            {t(\n              'workflows.rerunStep.description',\n              'The run continues from {step}. The previous attempt is kept in the history, and the rerun is recorded in the audit log.',\n              { step: stepLabel || stepId || '' }\n            )}\n          </DrawerDescription>\n        </DrawerHeader>\n\n        <DrawerBody className=\"space-y-2\">\n          <label className=\"text-sm font-medium text-foreground\" htmlFor=\"workflow-rerun-context-patch\">\n            {t('workflows.rerunStep.patchLabel', 'Context patch (optional JSON)')}\n          </label>\n          <Textarea\n            id=\"workflow-rerun-context-patch\"\n            value={patchText}\n            onChange={(event) => setPatchText(event.target.value)}\n            rows={6}\n            className=\"font-mono text-xs\"\n            placeholder={'{\\n  \"amount\": 250\\n}'}\n          />\n          <p className=\"text-xs text-muted-foreground\">\n            {t(\n              'workflows.rerunStep.patchHint',\n              'Merged over the run context. Only the keys you provide change.'\n            )}\n          </p>\n          {parseError ? <p className=\"text-xs text-status-error-text\">{parseError}</p> : null}\n        </DrawerBody>\n\n        <DrawerFooter>\n          <Button type=\"button\" variant=\"outline\" onClick={() => onOpenChange(false)} disabled={isSubmitting}>\n            {t('common.cancel')}\n          </Button>\n          <Button type=\"button\" onClick={submit} disabled={isSubmitting || !stepId}>\n            {t('workflows.rerunStep.confirm', 'Rerun step')}\n          </Button>\n        </DrawerFooter>\n      </DrawerContent>\n    </Drawer>\n  )\n}\n\nexport default RerunStepDialog\n"],
+  "mappings": ";AAuFQ,SACE,KADF;AArFR,YAAY,WAAW;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,cAAc;AACvB,SAAS,gBAAgB;AACzB,SAAS,YAAY;AAoBd,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf;AACF,GAAyB;AACvB,QAAM,IAAI,KAAK;AACf,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,EAAE;AACnD,QAAM,CAAC,YAAY,aAAa,IAAI,MAAM,SAAwB,IAAI;AAEtE,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,MAAM;AACT,mBAAa,EAAE;AACf,oBAAc,IAAI;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,SAAS,MAAM,YAAY,MAAM;AACrC,UAAM,UAAU,UAAU,KAAK;AAC/B,QAAI,CAAC,SAAS;AACZ,oBAAc,IAAI;AAClB,gBAAU,MAAS;AACnB;AAAA,IACF;AACA,QAAI;AACF,YAAM,SAAS,KAAK,MAAM,OAAO;AACjC,UAAI,CAAC,UAAU,OAAO,WAAW,YAAY,MAAM,QAAQ,MAAM,GAAG;AAClE;AAAA,UACE,EAAE,wCAAwC,0CAA0C;AAAA,QACtF;AACA;AAAA,MACF;AACA,oBAAc,IAAI;AAClB,gBAAU,MAAiC;AAAA,IAC7C,QAAQ;AACN,oBAAc,EAAE,oCAAoC,sCAAsC,CAAC;AAAA,IAC7F;AAAA,EACF,GAAG,CAAC,WAAW,WAAW,CAAC,CAAC;AAE5B,SACE,oBAAC,UAAO,MAAY,cAClB;AAAA,IAAC;AAAA;AAAA,MACC,eAAY;AAAA,MACZ,WAAW,CAAC,UAAU;AACpB,aAAK,MAAM,WAAW,MAAM,YAAY,MAAM,QAAQ,SAAS;AAC7D,gBAAM,eAAe;AACrB,iBAAO;AAAA,QACT;AAAA,MACF;AAAA,MACA,gBAAgB,EAAE,6BAA6B,mBAAmB;AAAA,MAElE;AAAA,6BAAC,gBACC;AAAA,8BAAC,eAAa,YAAE,6BAA6B,sBAAsB,GAAE;AAAA,UACrE,oBAAC,qBACE;AAAA,YACC;AAAA,YACA;AAAA,YACA,EAAE,MAAM,aAAa,UAAU,GAAG;AAAA,UACpC,GACF;AAAA,WACF;AAAA,QAEA,qBAAC,cAAW,WAAU,aACpB;AAAA,8BAAC,WAAM,WAAU,uCAAsC,SAAQ,gCAC5D,YAAE,kCAAkC,+BAA+B,GACtE;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,IAAG;AAAA,cACH,OAAO;AAAA,cACP,UAAU,CAAC,UAAU,aAAa,MAAM,OAAO,KAAK;AAAA,cACpD,MAAM;AAAA,cACN,WAAU;AAAA,cACV,aAAa;AAAA;AAAA,UACf;AAAA,UACA,oBAAC,OAAE,WAAU,iCACV;AAAA,YACC;AAAA,YACA;AAAA,UACF,GACF;AAAA,UACC,aAAa,oBAAC,OAAE,WAAU,kCAAkC,sBAAW,IAAO;AAAA,WACjF;AAAA,QAEA,qBAAC,gBACC;AAAA,8BAAC,UAAO,MAAK,UAAS,SAAQ,WAAU,SAAS,MAAM,aAAa,KAAK,GAAG,UAAU,cACnF,YAAE,eAAe,GACpB;AAAA,UACA,oBAAC,UAAO,MAAK,UAAS,SAAS,QAAQ,UAAU,gBAAgB,CAAC,QAC/D,YAAE,+BAA+B,YAAY,GAChD;AAAA,WACF;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;AAEA,IAAO,0BAAQ;",
+  "names": []
+}

package/dist/modules/workflows/components/run/RunEventBadge.js

@@ -0,0 +1,30 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { classifyRunEventType } from "../../lib/run-event-tone.js";
+const TONE_CLASSES = {
+  success: "bg-status-success-bg text-status-success-text",
+  error: "bg-status-error-bg text-status-error-text",
+  warning: "bg-status-warning-bg text-status-warning-text",
+  info: "bg-status-info-bg text-status-info-text",
+  neutral: "bg-status-neutral-bg text-status-neutral-text"
+};
+function runEventBadgeClass(eventType) {
+  return TONE_CLASSES[classifyRunEventType(eventType)];
+}
+function RunEventBadge({ eventType, className = "" }) {
+  const t = useT();
+  const tone = classifyRunEventType(eventType);
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: `inline-flex items-center rounded px-2 py-0.5 text-xs font-medium ${TONE_CLASSES[tone]} ${className}`,
+      children: t(`workflows.events.types.${eventType}`, eventType)
+    }
+  );
+}
+export {
+  RunEventBadge,
+  runEventBadgeClass
+};
+//# sourceMappingURL=RunEventBadge.js.map

package/dist/modules/workflows/components/run/RunEventBadge.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/workflows/components/run/RunEventBadge.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { classifyRunEventType, type RunEventTone } from '../../lib/run-event-tone'\n\nconst TONE_CLASSES: Record<RunEventTone, string> = {\n  success: 'bg-status-success-bg text-status-success-text',\n  error: 'bg-status-error-bg text-status-error-text',\n  warning: 'bg-status-warning-bg text-status-warning-text',\n  info: 'bg-status-info-bg text-status-info-text',\n  neutral: 'bg-status-neutral-bg text-status-neutral-text',\n}\n\n/**\n * Class-only form, for the mobile overview which takes a class callback rather\n * than a component. Same classification, so the two never disagree.\n */\nexport function runEventBadgeClass(eventType: string): string {\n  return TONE_CLASSES[classifyRunEventType(eventType)]\n}\n\n/**\n * The event type IS the label, so this badge is never colour-only by\n * construction \u2014 the tone only reinforces text the reader can already see.\n */\nexport function RunEventBadge({ eventType, className = '' }: { eventType: string; className?: string }) {\n  const t = useT()\n  const tone = classifyRunEventType(eventType)\n  return (\n    <span\n      className={`inline-flex items-center rounded px-2 py-0.5 text-xs font-medium ${TONE_CLASSES[tone]} ${className}`}\n    >\n      {t(`workflows.events.types.${eventType}`, eventType)}\n    </span>\n  )\n}\n"],
+  "mappings": ";AA8BI;AA3BJ,SAAS,YAAY;AACrB,SAAS,4BAA+C;AAExD,MAAM,eAA6C;AAAA,EACjD,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,MAAM;AAAA,EACN,SAAS;AACX;AAMO,SAAS,mBAAmB,WAA2B;AAC5D,SAAO,aAAa,qBAAqB,SAAS,CAAC;AACrD;AAMO,SAAS,cAAc,EAAE,WAAW,YAAY,GAAG,GAA8C;AACtG,QAAM,IAAI,KAAK;AACf,QAAM,OAAO,qBAAqB,SAAS;AAC3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,oEAAoE,aAAa,IAAI,CAAC,IAAI,SAAS;AAAA,MAE7G,YAAE,0BAA0B,SAAS,IAAI,SAAS;AAAA;AAAA,EACrD;AAEJ;",
+  "names": []
+}

package/dist/modules/workflows/components/run/RunGantt.js

@@ -0,0 +1,130 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { STATUS_COLORS } from "../../lib/status-colors.js";
+import { formatDurationMs } from "../../lib/run-duration.js";
+import { buildRunGantt } from "../../lib/run-gantt.js";
+import { stepStatusLabelKey } from "./RunStatusBadge.js";
+const BAR_TONES = {
+  completed: "completed",
+  active: "in_progress",
+  failed: "failed",
+  skipped: "pending",
+  paused: "paused",
+  pending: "not_started"
+};
+const LANE_HEIGHT_CLASS = "h-8";
+function BarRow({
+  bar,
+  label,
+  selected,
+  onSelect
+}) {
+  const colors = STATUS_COLORS[BAR_TONES[bar.status]];
+  const widthPercent = Math.max(bar.widthRatio * 100, 0.6);
+  const offsetPercent = Math.min(bar.offsetRatio * 100, 100 - widthPercent);
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick: onSelect,
+      title: label,
+      "aria-label": label,
+      className: `relative block w-full ${LANE_HEIGHT_CLASS} rounded ${selected ? "ring-2 ring-primary" : ""} focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary`,
+      children: /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: `absolute top-1/2 flex -translate-y-1/2 items-center justify-start overflow-hidden rounded border px-1 ${colors.bg} ${colors.border} h-5`,
+          style: { left: `${offsetPercent}%`, width: `${widthPercent}%` },
+          children: bar.spansCollapsedWait ? (
+            // Never colour-only: a collapsed bar carries its own hatch pattern.
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                "aria-hidden": "true",
+                className: "absolute inset-0 opacity-40",
+                style: {
+                  backgroundImage: "repeating-linear-gradient(45deg, currentColor 0, currentColor 2px, transparent 2px, transparent 6px)"
+                }
+              }
+            )
+          ) : null
+        }
+      )
+    }
+  );
+}
+function RunGantt({
+  stepInstances,
+  instanceStartedAt,
+  instanceCompletedAt,
+  now,
+  onSelectStep,
+  selectedStepId
+}) {
+  const t = useT();
+  const model = React.useMemo(
+    () => buildRunGantt({ stepInstances, instanceStartedAt, instanceCompletedAt, now }),
+    [stepInstances, instanceStartedAt, instanceCompletedAt, now]
+  );
+  if (model.bars.length === 0) {
+    return /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("workflows.instances.run.gantt.empty", "No step executions have been recorded for this run yet.") });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-baseline gap-x-4 gap-y-1 text-xs text-muted-foreground", children: [
+      /* @__PURE__ */ jsxs("span", { children: [
+        t("workflows.instances.run.gantt.span", "Wall-clock span"),
+        ": ",
+        formatDurationMs(model.totalDurationMs)
+      ] }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        t("workflows.instances.run.gantt.steps", "Step executions"),
+        ": ",
+        model.bars.length
+      ] }),
+      model.collapsedDurationMs > 0 ? /* @__PURE__ */ jsx("span", { className: "text-status-warning-text", children: t("workflows.instances.run.gantt.collapsed", "Waiting time collapsed: {duration}", {
+        duration: formatDurationMs(model.collapsedDurationMs)
+      }) }) : null
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsx("div", { style: { minWidth: "40rem" }, children: model.bars.map((bar) => {
+      const durationLabel = formatDurationMs(bar.durationMs);
+      const statusKey = stepStatusLabelKey(bar.status);
+      const statusLabel = t(statusKey.key, statusKey.fallback);
+      const label = t(
+        "workflows.instances.run.gantt.barLabel",
+        "{step} \u2014 {status}, {duration}",
+        { step: bar.stepName, status: statusLabel, duration: durationLabel }
+      );
+      return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 border-b border-border/60 py-0.5 last:border-b-0", children: [
+        /* @__PURE__ */ jsxs("div", { className: "w-48 shrink-0 truncate text-xs", title: bar.stepName, children: [
+          /* @__PURE__ */ jsx("span", { className: "text-foreground", children: bar.stepName }),
+          bar.branchInstanceId ? /* @__PURE__ */ jsx("span", { className: "ml-1 text-muted-foreground", children: t("workflows.instances.run.gantt.lane", "lane {lane}", { lane: String(bar.lane + 1) }) }) : null
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsx(
+          BarRow,
+          {
+            bar,
+            label,
+            selected: selectedStepId === bar.stepId,
+            onSelect: onSelectStep ? () => onSelectStep(bar.stepId) : void 0
+          }
+        ) }),
+        /* @__PURE__ */ jsxs("div", { className: "w-24 shrink-0 text-right text-xs tabular-nums text-muted-foreground", children: [
+          durationLabel,
+          bar.running ? /* @__PURE__ */ jsx("span", { className: "ml-1 text-status-info-text", children: t("workflows.instances.run.gantt.running", "(running)") }) : null
+        ] })
+      ] }, bar.key);
+    }) }) }),
+    model.collapsedSegments.length > 0 ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: t(
+      "workflows.instances.run.gantt.collapsedHint",
+      "Hatched bars span a collapsed waiting period. Durations shown are always the real elapsed time."
+    ) }) : null
+  ] });
+}
+var RunGantt_default = RunGantt;
+export {
+  RunGantt,
+  RunGantt_default as default
+};
+//# sourceMappingURL=RunGantt.js.map

package/dist/modules/workflows/components/run/RunGantt.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/workflows/components/run/RunGantt.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { STATUS_COLORS, type WorkflowStatus, type StepRunStatus } from '../../lib/status-colors'\nimport { formatDurationMs } from '../../lib/run-duration'\nimport { buildRunGantt, type GanttBar } from '../../lib/run-gantt'\nimport { stepStatusLabelKey } from './RunStatusBadge'\nimport type { RunStepInstanceInput } from '../../lib/run-execution'\n\nconst BAR_TONES: Record<StepRunStatus, WorkflowStatus> = {\n  completed: 'completed',\n  active: 'in_progress',\n  failed: 'failed',\n  skipped: 'pending',\n  paused: 'paused',\n  pending: 'not_started',\n}\n\nconst LANE_HEIGHT_CLASS = 'h-8'\n\nexport type RunGanttProps = {\n  stepInstances: readonly RunStepInstanceInput[]\n  instanceStartedAt?: string | Date | null\n  instanceCompletedAt?: string | Date | null\n  /** Injected by tests for determinism; production reads the clock. */\n  now?: number\n  onSelectStep?: (stepId: string) => void\n  selectedStepId?: string | null\n}\n\nfunction BarRow({\n  bar,\n  label,\n  selected,\n  onSelect,\n}: {\n  bar: GanttBar\n  label: string\n  selected: boolean\n  onSelect?: () => void\n}) {\n  const colors = STATUS_COLORS[BAR_TONES[bar.status]]\n  // A zero-width bar is a real measurement (a step that took under a\n  // millisecond), not missing data \u2014 give it a visible minimum so it does not\n  // disappear from the chart it is meant to explain.\n  const widthPercent = Math.max(bar.widthRatio * 100, 0.6)\n  const offsetPercent = Math.min(bar.offsetRatio * 100, 100 - widthPercent)\n\n  return (\n    <button\n      type=\"button\"\n      onClick={onSelect}\n      title={label}\n      aria-label={label}\n      className={`relative block w-full ${LANE_HEIGHT_CLASS} rounded ${\n        selected ? 'ring-2 ring-primary' : ''\n      } focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary`}\n    >\n      <span\n        className={`absolute top-1/2 flex -translate-y-1/2 items-center justify-start overflow-hidden rounded border px-1 ${colors.bg} ${colors.border} h-5`}\n        style={{ left: `${offsetPercent}%`, width: `${widthPercent}%` }}\n      >\n        {bar.spansCollapsedWait ? (\n          // Never colour-only: a collapsed bar carries its own hatch pattern.\n          <span\n            aria-hidden=\"true\"\n            className=\"absolute inset-0 opacity-40\"\n            style={{\n              backgroundImage:\n                'repeating-linear-gradient(45deg, currentColor 0, currentColor 2px, transparent 2px, transparent 6px)',\n            }}\n          />\n        ) : null}\n      </span>\n    </button>\n  )\n}\n\n/**\n * Clock-time Gantt for one run (spec \u00A78.3). The axis is piecewise-linear \u2014\n * see `lib/run-gantt.ts` for why \u2014 and every bar keeps its TRUE duration in\n * its label, so the compression never becomes a reported number.\n */\nexport function RunGantt({\n  stepInstances,\n  instanceStartedAt,\n  instanceCompletedAt,\n  now,\n  onSelectStep,\n  selectedStepId,\n}: RunGanttProps) {\n  const t = useT()\n  const model = React.useMemo(\n    () => buildRunGantt({ stepInstances, instanceStartedAt, instanceCompletedAt, now }),\n    [stepInstances, instanceStartedAt, instanceCompletedAt, now]\n  )\n\n  if (model.bars.length === 0) {\n    return (\n      <p className=\"text-sm text-muted-foreground\">\n        {t('workflows.instances.run.gantt.empty', 'No step executions have been recorded for this run yet.')}\n      </p>\n    )\n  }\n\n  return (\n    <div className=\"space-y-3\">\n      <div className=\"flex flex-wrap items-baseline gap-x-4 gap-y-1 text-xs text-muted-foreground\">\n        <span>\n          {t('workflows.instances.run.gantt.span', 'Wall-clock span')}: {formatDurationMs(model.totalDurationMs)}\n        </span>\n        <span>\n          {t('workflows.instances.run.gantt.steps', 'Step executions')}: {model.bars.length}\n        </span>\n        {model.collapsedDurationMs > 0 ? (\n          <span className=\"text-status-warning-text\">\n            {t('workflows.instances.run.gantt.collapsed', 'Waiting time collapsed: {duration}', {\n              duration: formatDurationMs(model.collapsedDurationMs),\n            })}\n          </span>\n        ) : null}\n      </div>\n\n      <div className=\"overflow-x-auto\">\n        <div style={{ minWidth: '40rem' }}>\n          {model.bars.map((bar) => {\n            const durationLabel = formatDurationMs(bar.durationMs)\n            const statusKey = stepStatusLabelKey(bar.status)\n            const statusLabel = t(statusKey.key, statusKey.fallback)\n            const label = t(\n              'workflows.instances.run.gantt.barLabel',\n              '{step} \u2014 {status}, {duration}',\n              { step: bar.stepName, status: statusLabel, duration: durationLabel }\n            )\n            return (\n              <div key={bar.key} className=\"flex items-center gap-3 border-b border-border/60 py-0.5 last:border-b-0\">\n                <div className=\"w-48 shrink-0 truncate text-xs\" title={bar.stepName}>\n                  <span className=\"text-foreground\">{bar.stepName}</span>\n                  {bar.branchInstanceId ? (\n                    <span className=\"ml-1 text-muted-foreground\">\n                      {t('workflows.instances.run.gantt.lane', 'lane {lane}', { lane: String(bar.lane + 1) })}\n                    </span>\n                  ) : null}\n                </div>\n                <div className=\"min-w-0 flex-1\">\n                  <BarRow\n                    bar={bar}\n                    label={label}\n                    selected={selectedStepId === bar.stepId}\n                    onSelect={onSelectStep ? () => onSelectStep(bar.stepId) : undefined}\n                  />\n                </div>\n                <div className=\"w-24 shrink-0 text-right text-xs tabular-nums text-muted-foreground\">\n                  {durationLabel}\n                  {bar.running ? (\n                    <span className=\"ml-1 text-status-info-text\">\n                      {t('workflows.instances.run.gantt.running', '(running)')}\n                    </span>\n                  ) : null}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n\n      {model.collapsedSegments.length > 0 ? (\n        <p className=\"text-xs text-muted-foreground\">\n          {t(\n            'workflows.instances.run.gantt.collapsedHint',\n            'Hatched bars span a collapsed waiting period. Durations shown are always the real elapsed time.'\n          )}\n        </p>\n      ) : null}\n    </div>\n  )\n}\n\nexport default RunGantt\n"],
+  "mappings": "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",
+  "names": []
+}