@mastra/playground-ui 59.0.0 → 60.0.0-alpha.1

package/dist/domains/workflows/workflow/workflow-steps-status.cjs.js

@@ -0,0 +1,52 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const domains_workflows_workflow_workflowStatus = require('./workflow-status.cjs.js');
+const Txt = require('../../../Txt-DPmEpNbp.cjs');
+
+function WorkflowStepsStatus({ steps, workflowResult }) {
+  const filteredSteps = Object.entries(steps).filter(([key, _]) => key !== "input" && !key.endsWith(".input"));
+  if (filteredSteps.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 border-t border-border pt-5", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { variant: "meta", tone: "muted", children: "Status" }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4", children: filteredSteps.map(([stepId, step]) => {
+      const { status } = step;
+      let output = void 0;
+      let suspendOutput = void 0;
+      let error = void 0;
+      if (step.status === "suspended") {
+        suspendOutput = step.suspendOutput;
+      }
+      if (step.status === "success") {
+        output = step.output;
+      }
+      if (step.status === "failed") {
+        error = step.error;
+      }
+      const tripwireInfo = step.status === "failed" && step.tripwire ? step.tripwire : workflowResult?.status === "tripwire" ? {
+        reason: workflowResult?.tripwire?.reason,
+        retry: workflowResult?.tripwire?.retry,
+        metadata: workflowResult?.tripwire?.metadata,
+        processorId: workflowResult?.tripwire?.processorId
+      } : void 0;
+      const displayStatus = step.status === "failed" && step.tripwire ? "tripwire" : status;
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        domains_workflows_workflow_workflowStatus.WorkflowStatus,
+        {
+          stepId,
+          status: displayStatus,
+          result: output ?? suspendOutput ?? error ?? {},
+          tripwire: tripwireInfo
+        },
+        stepId
+      );
+    }) })
+  ] });
+}
+
+exports.WorkflowStepsStatus = WorkflowStepsStatus;
+//# sourceMappingURL=workflow-steps-status.cjs.js.map

package/dist/domains/workflows/workflow/workflow-steps-status.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"workflow-steps-status.cjs.js","sources":["../../../../src/domains/workflows/workflow/workflow-steps-status.tsx"],"sourcesContent":["import type { WorkflowRunStreamResult } from '../context/workflow-run-context';\nimport { WorkflowStatus } from './workflow-status';\nimport { Txt } from '@/ds/components/Txt';\n\ninterface StepResult {\n  status: string;\n  output?: unknown;\n  suspendOutput?: unknown;\n  error?: unknown;\n  tripwire?: {\n    reason?: string;\n    retry?: boolean;\n    metadata?: unknown;\n    processorId?: string;\n  };\n  suspendPayload?: unknown;\n}\n\nexport interface WorkflowStepsStatusProps {\n  steps: Record<string, StepResult>;\n  workflowResult?: WorkflowRunStreamResult | null;\n}\n\nexport function WorkflowStepsStatus({ steps, workflowResult }: WorkflowStepsStatusProps) {\n  const filteredSteps = Object.entries(steps).filter(([key, _]) => key !== 'input' && !key.endsWith('.input'));\n\n  if (filteredSteps.length === 0) {\n    return null;\n  }\n\n  return (\n    <div className=\"flex flex-col gap-2 border-t border-border pt-5\">\n      <Txt variant=\"meta\" tone=\"muted\">\n        Status\n      </Txt>\n      <div className=\"flex flex-col gap-4\">\n        {filteredSteps.map(([stepId, step]) => {\n          const { status } = step;\n          let output = undefined;\n          let suspendOutput = undefined;\n          let error = undefined;\n\n          if (step.status === 'suspended') {\n            suspendOutput = step.suspendOutput;\n          }\n          if (step.status === 'success') {\n            output = step.output;\n          }\n          if (step.status === 'failed') {\n            error = step.error;\n          }\n\n          // Build tripwire info from step or workflow-level result\n          // TripwireData is aligned with core schema: { reason, retry?, metadata?, processorId? }\n          const tripwireInfo =\n            step.status === 'failed' && step.tripwire\n              ? step.tripwire\n              : workflowResult?.status === 'tripwire'\n                ? {\n                    reason: workflowResult?.tripwire?.reason,\n                    retry: workflowResult?.tripwire?.retry,\n                    metadata: workflowResult?.tripwire?.metadata,\n                    processorId: workflowResult?.tripwire?.processorId,\n                  }\n                : undefined;\n\n          // Show tripwire status for failed steps with tripwire info\n          const displayStatus = step.status === 'failed' && step.tripwire ? 'tripwire' : status;\n\n          return (\n            <WorkflowStatus\n              key={stepId}\n              stepId={stepId}\n              status={displayStatus}\n              result={(output ?? suspendOutput ?? error ?? {}) as Record<string, unknown>}\n              tripwire={tripwireInfo}\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n"],"names":["jsxs","jsx","Txt","WorkflowStatus"],"mappings":";;;;;;;;AAuBO,SAAS,mBAAA,CAAoB,EAAE,KAAA,EAAO,cAAA,EAAe,EAA6B;AACvF,EAAA,MAAM,gBAAgB,MAAA,CAAO,OAAA,CAAQ,KAAK,CAAA,CAAE,OAAO,CAAC,CAAC,GAAA,EAAK,CAAC,MAAM,GAAA,KAAQ,OAAA,IAAW,CAAC,GAAA,CAAI,QAAA,CAAS,QAAQ,CAAC,CAAA;AAE3G,EAAA,IAAI,aAAA,CAAc,WAAW,CAAA,EAAG;AAC9B,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACEA,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iDAAA,EACb,QAAA,EAAA;AAAA,oBAAAC,cAAA,CAACC,OAAA,EAAA,EAAI,OAAA,EAAQ,MAAA,EAAO,IAAA,EAAK,SAAQ,QAAA,EAAA,QAAA,EAEjC,CAAA;AAAA,oBACAD,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qBAAA,EACZ,QAAA,EAAA,aAAA,CAAc,IAAI,CAAC,CAAC,MAAA,EAAQ,IAAI,CAAA,KAAM;AACrC,MAAA,MAAM,EAAE,QAAO,GAAI,IAAA;AACnB,MAAA,IAAI,MAAA,GAAS,MAAA;AACb,MAAA,IAAI,aAAA,GAAgB,MAAA;AACpB,MAAA,IAAI,KAAA,GAAQ,MAAA;AAEZ,MAAA,IAAI,IAAA,CAAK,WAAW,WAAA,EAAa;AAC/B,QAAA,aAAA,GAAgB,IAAA,CAAK,aAAA;AAAA,MACvB;AACA,MAAA,IAAI,IAAA,CAAK,WAAW,SAAA,EAAW;AAC7B,QAAA,MAAA,GAAS,IAAA,CAAK,MAAA;AAAA,MAChB;AACA,MAAA,IAAI,IAAA,CAAK,WAAW,QAAA,EAAU;AAC5B,QAAA,KAAA,GAAQ,IAAA,CAAK,KAAA;AAAA,MACf;AAIA,MAAA,MAAM,YAAA,GACJ,IAAA,CAAK,MAAA,KAAW,QAAA,IAAY,IAAA,CAAK,WAC7B,IAAA,CAAK,QAAA,GACL,cAAA,EAAgB,MAAA,KAAW,UAAA,GACzB;AAAA,QACE,MAAA,EAAQ,gBAAgB,QAAA,EAAU,MAAA;AAAA,QAClC,KAAA,EAAO,gBAAgB,QAAA,EAAU,KAAA;AAAA,QACjC,QAAA,EAAU,gBAAgB,QAAA,EAAU,QAAA;AAAA,QACpC,WAAA,EAAa,gBAAgB,QAAA,EAAU;AAAA,OACzC,GACA,MAAA;AAGR,MAAA,MAAM,gBAAgB,IAAA,CAAK,MAAA,KAAW,QAAA,IAAY,IAAA,CAAK,WAAW,UAAA,GAAa,MAAA;AAE/E,MAAA,uBACEA,cAAA;AAAA,QAACE,wDAAA;AAAA,QAAA;AAAA,UAEC,MAAA;AAAA,UACA,MAAA,EAAQ,aAAA;AAAA,UACR,MAAA,EAAS,MAAA,IAAU,aAAA,IAAiB,KAAA,IAAS,EAAC;AAAA,UAC9C,QAAA,EAAU;AAAA,SAAA;AAAA,QAJL;AAAA,OAKP;AAAA,IAEJ,CAAC,CAAA,EACH;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/domains/workflows/workflow/workflow-steps-status.d.ts

@@ -0,0 +1,2 @@
+export * from '../../../src/domains/workflows/workflow/workflow-steps-status'
+export {}

package/dist/domains/workflows/workflow/workflow-steps-status.es.js

@@ -0,0 +1,48 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { WorkflowStatus } from './workflow-status.es.js';
+import { T as Txt } from '../../../Txt-BP1SRHmL.js';
+
+function WorkflowStepsStatus({ steps, workflowResult }) {
+  const filteredSteps = Object.entries(steps).filter(([key, _]) => key !== "input" && !key.endsWith(".input"));
+  if (filteredSteps.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 border-t border-border pt-5", children: [
+    /* @__PURE__ */ jsx(Txt, { variant: "meta", tone: "muted", children: "Status" }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4", children: filteredSteps.map(([stepId, step]) => {
+      const { status } = step;
+      let output = void 0;
+      let suspendOutput = void 0;
+      let error = void 0;
+      if (step.status === "suspended") {
+        suspendOutput = step.suspendOutput;
+      }
+      if (step.status === "success") {
+        output = step.output;
+      }
+      if (step.status === "failed") {
+        error = step.error;
+      }
+      const tripwireInfo = step.status === "failed" && step.tripwire ? step.tripwire : workflowResult?.status === "tripwire" ? {
+        reason: workflowResult?.tripwire?.reason,
+        retry: workflowResult?.tripwire?.retry,
+        metadata: workflowResult?.tripwire?.metadata,
+        processorId: workflowResult?.tripwire?.processorId
+      } : void 0;
+      const displayStatus = step.status === "failed" && step.tripwire ? "tripwire" : status;
+      return /* @__PURE__ */ jsx(
+        WorkflowStatus,
+        {
+          stepId,
+          status: displayStatus,
+          result: output ?? suspendOutput ?? error ?? {},
+          tripwire: tripwireInfo
+        },
+        stepId
+      );
+    }) })
+  ] });
+}
+
+export { WorkflowStepsStatus };
+//# sourceMappingURL=workflow-steps-status.es.js.map

package/dist/domains/workflows/workflow/workflow-steps-status.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"workflow-steps-status.es.js","sources":["../../../../src/domains/workflows/workflow/workflow-steps-status.tsx"],"sourcesContent":["import type { WorkflowRunStreamResult } from '../context/workflow-run-context';\nimport { WorkflowStatus } from './workflow-status';\nimport { Txt } from '@/ds/components/Txt';\n\ninterface StepResult {\n  status: string;\n  output?: unknown;\n  suspendOutput?: unknown;\n  error?: unknown;\n  tripwire?: {\n    reason?: string;\n    retry?: boolean;\n    metadata?: unknown;\n    processorId?: string;\n  };\n  suspendPayload?: unknown;\n}\n\nexport interface WorkflowStepsStatusProps {\n  steps: Record<string, StepResult>;\n  workflowResult?: WorkflowRunStreamResult | null;\n}\n\nexport function WorkflowStepsStatus({ steps, workflowResult }: WorkflowStepsStatusProps) {\n  const filteredSteps = Object.entries(steps).filter(([key, _]) => key !== 'input' && !key.endsWith('.input'));\n\n  if (filteredSteps.length === 0) {\n    return null;\n  }\n\n  return (\n    <div className=\"flex flex-col gap-2 border-t border-border pt-5\">\n      <Txt variant=\"meta\" tone=\"muted\">\n        Status\n      </Txt>\n      <div className=\"flex flex-col gap-4\">\n        {filteredSteps.map(([stepId, step]) => {\n          const { status } = step;\n          let output = undefined;\n          let suspendOutput = undefined;\n          let error = undefined;\n\n          if (step.status === 'suspended') {\n            suspendOutput = step.suspendOutput;\n          }\n          if (step.status === 'success') {\n            output = step.output;\n          }\n          if (step.status === 'failed') {\n            error = step.error;\n          }\n\n          // Build tripwire info from step or workflow-level result\n          // TripwireData is aligned with core schema: { reason, retry?, metadata?, processorId? }\n          const tripwireInfo =\n            step.status === 'failed' && step.tripwire\n              ? step.tripwire\n              : workflowResult?.status === 'tripwire'\n                ? {\n                    reason: workflowResult?.tripwire?.reason,\n                    retry: workflowResult?.tripwire?.retry,\n                    metadata: workflowResult?.tripwire?.metadata,\n                    processorId: workflowResult?.tripwire?.processorId,\n                  }\n                : undefined;\n\n          // Show tripwire status for failed steps with tripwire info\n          const displayStatus = step.status === 'failed' && step.tripwire ? 'tripwire' : status;\n\n          return (\n            <WorkflowStatus\n              key={stepId}\n              stepId={stepId}\n              status={displayStatus}\n              result={(output ?? suspendOutput ?? error ?? {}) as Record<string, unknown>}\n              tripwire={tripwireInfo}\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AAuBO,SAAS,mBAAA,CAAoB,EAAE,KAAA,EAAO,cAAA,EAAe,EAA6B;AACvF,EAAA,MAAM,gBAAgB,MAAA,CAAO,OAAA,CAAQ,KAAK,CAAA,CAAE,OAAO,CAAC,CAAC,GAAA,EAAK,CAAC,MAAM,GAAA,KAAQ,OAAA,IAAW,CAAC,GAAA,CAAI,QAAA,CAAS,QAAQ,CAAC,CAAA;AAE3G,EAAA,IAAI,aAAA,CAAc,WAAW,CAAA,EAAG;AAC9B,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iDAAA,EACb,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,GAAA,EAAA,EAAI,OAAA,EAAQ,MAAA,EAAO,IAAA,EAAK,SAAQ,QAAA,EAAA,QAAA,EAEjC,CAAA;AAAA,oBACA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qBAAA,EACZ,QAAA,EAAA,aAAA,CAAc,IAAI,CAAC,CAAC,MAAA,EAAQ,IAAI,CAAA,KAAM;AACrC,MAAA,MAAM,EAAE,QAAO,GAAI,IAAA;AACnB,MAAA,IAAI,MAAA,GAAS,MAAA;AACb,MAAA,IAAI,aAAA,GAAgB,MAAA;AACpB,MAAA,IAAI,KAAA,GAAQ,MAAA;AAEZ,MAAA,IAAI,IAAA,CAAK,WAAW,WAAA,EAAa;AAC/B,QAAA,aAAA,GAAgB,IAAA,CAAK,aAAA;AAAA,MACvB;AACA,MAAA,IAAI,IAAA,CAAK,WAAW,SAAA,EAAW;AAC7B,QAAA,MAAA,GAAS,IAAA,CAAK,MAAA;AAAA,MAChB;AACA,MAAA,IAAI,IAAA,CAAK,WAAW,QAAA,EAAU;AAC5B,QAAA,KAAA,GAAQ,IAAA,CAAK,KAAA;AAAA,MACf;AAIA,MAAA,MAAM,YAAA,GACJ,IAAA,CAAK,MAAA,KAAW,QAAA,IAAY,IAAA,CAAK,WAC7B,IAAA,CAAK,QAAA,GACL,cAAA,EAAgB,MAAA,KAAW,UAAA,GACzB;AAAA,QACE,MAAA,EAAQ,gBAAgB,QAAA,EAAU,MAAA;AAAA,QAClC,KAAA,EAAO,gBAAgB,QAAA,EAAU,KAAA;AAAA,QACjC,QAAA,EAAU,gBAAgB,QAAA,EAAU,QAAA;AAAA,QACpC,WAAA,EAAa,gBAAgB,QAAA,EAAU;AAAA,OACzC,GACA,MAAA;AAGR,MAAA,MAAM,gBAAgB,IAAA,CAAK,MAAA,KAAW,QAAA,IAAY,IAAA,CAAK,WAAW,UAAA,GAAa,MAAA;AAE/E,MAAA,uBACE,GAAA;AAAA,QAAC,cAAA;AAAA,QAAA;AAAA,UAEC,MAAA;AAAA,UACA,MAAA,EAAQ,aAAA;AAAA,UACR,MAAA,EAAS,MAAA,IAAU,aAAA,IAAiB,KAAA,IAAS,EAAC;AAAA,UAC9C,QAAA,EAAU;AAAA,SAAA;AAAA,QAJL;AAAA,OAKP;AAAA,IAEJ,CAAC,CAAA,EACH;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/domains/workflows/workflow/workflow-suspended-overlay.cjs.js

@@ -0,0 +1,38 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const domains_workflows_context_workflowRunContext = require('../context/workflow-run-context.cjs.js');
+const domains_workflows_workflow_useWorkflowTrigger = require('./use-workflow-trigger.cjs.js');
+const domains_workflows_workflow_workflowSuspendedSteps = require('./workflow-suspended-steps.cjs.js');
+
+function WorkflowSuspendedOverlay({ hidden, requestContext, canResume }) {
+  const { result, workflow, runId, isStreamingWorkflow } = React.useContext(domains_workflows_context_workflowRunContext.WorkflowRunContext);
+  const suspendedSteps = domains_workflows_workflow_useWorkflowTrigger.useSuspendedSteps(result, runId);
+  const onResume = domains_workflows_workflow_useWorkflowTrigger.useResumeWorkflow(requestContext);
+  const waitsForHumanInput = result?.status === "suspended" && suspendedSteps.length > 0 && !isStreamingWorkflow;
+  if (!workflow || !waitsForHumanInput || !canResume) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      hidden,
+      "data-testid": "workflow-suspended-overlay",
+      className: "pointer-events-none absolute top-12 right-2 z-30 w-95 max-w-[calc(100%-16px)] animate-in duration-300 fade-in-0 slide-in-from-top-2 motion-reduce:animate-none",
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        domains_workflows_workflow_workflowSuspendedSteps.WorkflowSuspendedSteps,
+        {
+          suspendedSteps,
+          workflow,
+          isStreaming: isStreamingWorkflow,
+          onResume
+        }
+      )
+    },
+    runId
+  );
+}
+
+exports.WorkflowSuspendedOverlay = WorkflowSuspendedOverlay;
+//# sourceMappingURL=workflow-suspended-overlay.cjs.js.map

package/dist/domains/workflows/workflow/workflow-suspended-overlay.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"workflow-suspended-overlay.cjs.js","sources":["../../../../src/domains/workflows/workflow/workflow-suspended-overlay.tsx"],"sourcesContent":["import { useContext } from 'react';\n\nimport { WorkflowRunContext } from '../context/workflow-run-context';\nimport { useResumeWorkflow, useSuspendedSteps } from './use-workflow-trigger';\nimport { WorkflowSuspendedSteps } from './workflow-suspended-steps';\n\nexport interface WorkflowSuspendedOverlayProps {\n  hidden?: boolean;\n  requestContext: Record<string, any>;\n  canResume: boolean;\n}\n\nexport function WorkflowSuspendedOverlay({ hidden, requestContext, canResume }: WorkflowSuspendedOverlayProps) {\n  const { result, workflow, runId, isStreamingWorkflow } = useContext(WorkflowRunContext);\n  const suspendedSteps = useSuspendedSteps(result, runId);\n  const onResume = useResumeWorkflow(requestContext);\n\n  const waitsForHumanInput = result?.status === 'suspended' && suspendedSteps.length > 0 && !isStreamingWorkflow;\n  if (!workflow || !waitsForHumanInput || !canResume) return null;\n\n  return (\n    <div\n      key={runId}\n      hidden={hidden}\n      data-testid=\"workflow-suspended-overlay\"\n      className=\"pointer-events-none absolute top-12 right-2 z-30 w-95 max-w-[calc(100%-16px)] animate-in duration-300 fade-in-0 slide-in-from-top-2 motion-reduce:animate-none\"\n    >\n      <WorkflowSuspendedSteps\n        suspendedSteps={suspendedSteps}\n        workflow={workflow}\n        isStreaming={isStreamingWorkflow}\n        onResume={onResume}\n      />\n    </div>\n  );\n}\n"],"names":["useContext","WorkflowRunContext","useSuspendedSteps","useResumeWorkflow","jsx","WorkflowSuspendedSteps"],"mappings":";;;;;;;;;;AAYO,SAAS,wBAAA,CAAyB,EAAE,MAAA,EAAQ,cAAA,EAAgB,WAAU,EAAkC;AAC7G,EAAA,MAAM,EAAE,MAAA,EAAQ,QAAA,EAAU,OAAO,mBAAA,EAAoB,GAAIA,iBAAWC,+DAAkB,CAAA;AACtF,EAAA,MAAM,cAAA,GAAiBC,+DAAA,CAAkB,MAAA,EAAQ,KAAK,CAAA;AACtD,EAAA,MAAM,QAAA,GAAWC,gEAAkB,cAAc,CAAA;AAEjD,EAAA,MAAM,qBAAqB,MAAA,EAAQ,MAAA,KAAW,eAAe,cAAA,CAAe,MAAA,GAAS,KAAK,CAAC,mBAAA;AAC3F,EAAA,IAAI,CAAC,QAAA,IAAY,CAAC,kBAAA,IAAsB,CAAC,WAAW,OAAO,IAAA;AAE3D,EAAA,uBACEC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MAEC,MAAA;AAAA,MACA,aAAA,EAAY,4BAAA;AAAA,MACZ,SAAA,EAAU,gKAAA;AAAA,MAEV,QAAA,kBAAAA,cAAA;AAAA,QAACC,wEAAA;AAAA,QAAA;AAAA,UACC,cAAA;AAAA,UACA,QAAA;AAAA,UACA,WAAA,EAAa,mBAAA;AAAA,UACb;AAAA;AAAA;AACF,KAAA;AAAA,IAVK;AAAA,GAWP;AAEJ;;;;"}

package/dist/domains/workflows/workflow/workflow-suspended-overlay.d.ts

@@ -0,0 +1,2 @@
+export * from '../../../src/domains/workflows/workflow/workflow-suspended-overlay'
+export {}

package/dist/domains/workflows/workflow/workflow-suspended-overlay.es.js

@@ -0,0 +1,34 @@
+import { jsx } from 'react/jsx-runtime';
+import { useContext } from 'react';
+import { WorkflowRunContext } from '../context/workflow-run-context.es.js';
+import { useSuspendedSteps, useResumeWorkflow } from './use-workflow-trigger.es.js';
+import { WorkflowSuspendedSteps } from './workflow-suspended-steps.es.js';
+
+function WorkflowSuspendedOverlay({ hidden, requestContext, canResume }) {
+  const { result, workflow, runId, isStreamingWorkflow } = useContext(WorkflowRunContext);
+  const suspendedSteps = useSuspendedSteps(result, runId);
+  const onResume = useResumeWorkflow(requestContext);
+  const waitsForHumanInput = result?.status === "suspended" && suspendedSteps.length > 0 && !isStreamingWorkflow;
+  if (!workflow || !waitsForHumanInput || !canResume) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      hidden,
+      "data-testid": "workflow-suspended-overlay",
+      className: "pointer-events-none absolute top-12 right-2 z-30 w-95 max-w-[calc(100%-16px)] animate-in duration-300 fade-in-0 slide-in-from-top-2 motion-reduce:animate-none",
+      children: /* @__PURE__ */ jsx(
+        WorkflowSuspendedSteps,
+        {
+          suspendedSteps,
+          workflow,
+          isStreaming: isStreamingWorkflow,
+          onResume
+        }
+      )
+    },
+    runId
+  );
+}
+
+export { WorkflowSuspendedOverlay };
+//# sourceMappingURL=workflow-suspended-overlay.es.js.map

package/dist/domains/workflows/workflow/workflow-suspended-overlay.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"workflow-suspended-overlay.es.js","sources":["../../../../src/domains/workflows/workflow/workflow-suspended-overlay.tsx"],"sourcesContent":["import { useContext } from 'react';\n\nimport { WorkflowRunContext } from '../context/workflow-run-context';\nimport { useResumeWorkflow, useSuspendedSteps } from './use-workflow-trigger';\nimport { WorkflowSuspendedSteps } from './workflow-suspended-steps';\n\nexport interface WorkflowSuspendedOverlayProps {\n  hidden?: boolean;\n  requestContext: Record<string, any>;\n  canResume: boolean;\n}\n\nexport function WorkflowSuspendedOverlay({ hidden, requestContext, canResume }: WorkflowSuspendedOverlayProps) {\n  const { result, workflow, runId, isStreamingWorkflow } = useContext(WorkflowRunContext);\n  const suspendedSteps = useSuspendedSteps(result, runId);\n  const onResume = useResumeWorkflow(requestContext);\n\n  const waitsForHumanInput = result?.status === 'suspended' && suspendedSteps.length > 0 && !isStreamingWorkflow;\n  if (!workflow || !waitsForHumanInput || !canResume) return null;\n\n  return (\n    <div\n      key={runId}\n      hidden={hidden}\n      data-testid=\"workflow-suspended-overlay\"\n      className=\"pointer-events-none absolute top-12 right-2 z-30 w-95 max-w-[calc(100%-16px)] animate-in duration-300 fade-in-0 slide-in-from-top-2 motion-reduce:animate-none\"\n    >\n      <WorkflowSuspendedSteps\n        suspendedSteps={suspendedSteps}\n        workflow={workflow}\n        isStreaming={isStreamingWorkflow}\n        onResume={onResume}\n      />\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAYO,SAAS,wBAAA,CAAyB,EAAE,MAAA,EAAQ,cAAA,EAAgB,WAAU,EAAkC;AAC7G,EAAA,MAAM,EAAE,MAAA,EAAQ,QAAA,EAAU,OAAO,mBAAA,EAAoB,GAAI,WAAW,kBAAkB,CAAA;AACtF,EAAA,MAAM,cAAA,GAAiB,iBAAA,CAAkB,MAAA,EAAQ,KAAK,CAAA;AACtD,EAAA,MAAM,QAAA,GAAW,kBAAkB,cAAc,CAAA;AAEjD,EAAA,MAAM,qBAAqB,MAAA,EAAQ,MAAA,KAAW,eAAe,cAAA,CAAe,MAAA,GAAS,KAAK,CAAC,mBAAA;AAC3F,EAAA,IAAI,CAAC,QAAA,IAAY,CAAC,kBAAA,IAAsB,CAAC,WAAW,OAAO,IAAA;AAE3D,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MAEC,MAAA;AAAA,MACA,aAAA,EAAY,4BAAA;AAAA,MACZ,SAAA,EAAU,gKAAA;AAAA,MAEV,QAAA,kBAAA,GAAA;AAAA,QAAC,sBAAA;AAAA,QAAA;AAAA,UACC,cAAA;AAAA,UACA,QAAA;AAAA,UACA,WAAA,EAAa,mBAAA;AAAA,UACb;AAAA;AAAA;AACF,KAAA;AAAA,IAVK;AAAA,GAWP;AAEJ;;;;"}

package/dist/domains/workflows/workflow/workflow-suspended-steps.cjs.js

@@ -0,0 +1,169 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const lucideReact = require('lucide-react');
+const React = require('react');
+const superjson = require('superjson');
+const zod = require('zod');
+const domains_workflows_components_workflowLayout = require('../components/workflow-layout.cjs.js');
+const domains_workflows_workflow_workflowInputData = require('./workflow-input-data.cjs.js');
+const activity = require('../../../activity-BYMLNb0G.cjs');
+const Badge = require('../../../Badge-DFNxcz-r.cjs');
+const codeEditor = require('../../../code-editor-BYGlHRhb.cjs');
+const collapsible = require('../../../collapsible-BFSJouuI.cjs');
+const Txt = require('../../../Txt-DPmEpNbp.cjs');
+const icons_Icon = require('../../../icons/Icon.cjs.js');
+const primitives_raisedSurface = require('../../../primitives/raised-surface.cjs.js');
+const lib_form_jsonSchemaToZodRuntime = require('../../../lib/form/json-schema-to-zod-runtime.cjs.js');
+const utils_cn = require('../../../cn-DG0X1KEP.cjs');
+const toast = require('../../../toast-nm-fM7BR.cjs');
+
+const suspendedWickStyle = { "--belt-hue": "var(--warning1)" };
+function formatPayloadSize(payload) {
+  const size = new Blob([JSON.stringify(payload ?? null)]).size;
+  if (size < 1024) {
+    return `${size} B`;
+  }
+  return `${(size / 1024).toFixed(1)} KB`;
+}
+function getPayloadLabel(payload, fallback) {
+  if (payload && typeof payload === "object" && !Array.isArray(payload)) {
+    const keys = Object.keys(payload);
+    const [onlyKey] = keys;
+    if (keys.length === 1 && onlyKey) {
+      return onlyKey;
+    }
+  }
+  return fallback;
+}
+function WorkflowSuspendedSteps({
+  suspendedSteps,
+  workflow,
+  isStreaming,
+  onResume
+}) {
+  if (isStreaming || suspendedSteps.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "section",
+    {
+      className: utils_cn.cn(domains_workflows_components_workflowLayout.panelSurfaceStyle, "pointer-events-auto relative isolate"),
+      "data-testid": "workflow-suspended-steps",
+      "aria-label": "Step suspended",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-h-[calc(100cqh-64px)] overflow-y-auto overscroll-contain rounded-[inherit]", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-3 border-b border-border/50 bg-background px-5 py-4", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(Txt.Txt, { as: "h2", variant: "column", tone: "ink", className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(icons_Icon.Icon, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CirclePause, {}) }),
+              "Step suspended"
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(Badge.Badge, { variant: "orange", emphasis: "muted", children: "Needs input" })
+          ] }),
+          suspendedSteps.map((step) => {
+            const stepDefinition = workflow.allSteps[step.stepId];
+            if (!stepDefinition || stepDefinition.isWorkflow) return null;
+            const stepSchema = stepDefinition?.resumeSchema ? lib_form_jsonSchemaToZodRuntime.jsonSchemaToZodRuntime(superjson.parse(stepDefinition.resumeSchema)) : zod.z.record(zod.z.string(), zod.z.any());
+            return /* @__PURE__ */ jsxRuntime.jsx(
+              SuspendedStepCard,
+              {
+                step,
+                stepSchema,
+                description: stepDefinition.description,
+                onResume
+              },
+              `${step.runId}-${step.stepId}`
+            );
+          })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(activity.ActivityWick, { status: "ready", label: "Needs input", className: "before:hidden", style: suspendedWickStyle })
+      ]
+    }
+  );
+}
+function SuspendedStepCard({ step, stepSchema, description, onResume }) {
+  const [isPayloadOpen, setIsPayloadOpen] = React.useState(false);
+  const [isResuming, setIsResuming] = React.useState(false);
+  const resumeWithResponse = async (resumeData) => {
+    setIsResuming(true);
+    try {
+      await onResume({ stepId: step.stepId.split("."), runId: step.runId, resumeData });
+    } catch (error) {
+      toast.toast.error(error instanceof Error ? error.message : "Error resuming workflow");
+    } finally {
+      setIsResuming(false);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-5 p-5 [&+&]:border-t [&+&]:border-border/50", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { as: "p", variant: "subheading", tone: "ink", className: "break-words", children: step.stepId }),
+      description && /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { as: "p", variant: "caption", tone: "muted", children: description })
+    ] }),
+    step.suspendPayload !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(Txt.Txt, { as: "p", variant: "caption", tone: "muted", className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(icons_Icon.Icon, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoveDownLeft, {}) }),
+        "The step is asking"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(collapsible.Collapsible, { open: isPayloadOpen, onOpenChange: setIsPayloadOpen, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          collapsible.CollapsibleTrigger,
+          {
+            className: utils_cn.cn(
+              primitives_raisedSurface.raisedSurfaceStyle,
+              "flex w-full items-center justify-between gap-2 rounded-lg px-3 py-2.5"
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 items-center gap-2", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(icons_Icon.Icon, { children: /* @__PURE__ */ jsxRuntime.jsx(
+                  lucideReact.ChevronRight,
+                  {
+                    className: utils_cn.cn("text-muted-foreground transition-transform", {
+                      "rotate-90 transform": isPayloadOpen
+                    })
+                  }
+                ) }),
+                /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { as: "span", variant: "body", tone: "ink", className: "truncate", children: getPayloadLabel(step.suspendPayload, step.stepId) })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { as: "span", variant: "caption", tone: "muted", className: "shrink-0", children: formatPayloadSize(step.suspendPayload) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(collapsible.CollapsibleContent, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "suspended-payload", className: "pt-2", children: /* @__PURE__ */ jsxRuntime.jsx(
+          codeEditor.CodeEditor,
+          {
+            value: JSON.stringify(step.suspendPayload, null, 2),
+            editable: false,
+            className: "w-full overflow-x-auto p-2",
+            showCopyButton: false
+          }
+        ) }) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(Txt.Txt, { as: "p", variant: "caption", tone: "muted", className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(icons_Icon.Icon, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoveUpRight, {}) }),
+        "Your response"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "-mx-5", children: /* @__PURE__ */ jsxRuntime.jsx(
+        domains_workflows_workflow_workflowInputData.WorkflowInputData,
+        {
+          schema: stepSchema,
+          isSubmitLoading: isResuming,
+          submitButtonLabel: "Resume",
+          submitButtonVariant: "primary",
+          submitButtonIcon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Play, {}),
+          submitButtonFullWidth: true,
+          collapsible: false,
+          hideHeading: true,
+          hideInputTypeLabel: true,
+          onSubmit: resumeWithResponse
+        }
+      ) })
+    ] })
+  ] });
+}
+
+exports.WorkflowSuspendedSteps = WorkflowSuspendedSteps;
+//# sourceMappingURL=workflow-suspended-steps.cjs.js.map

package/dist/domains/workflows/workflow/workflow-suspended-steps.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"workflow-suspended-steps.cjs.js","sources":["../../../../src/domains/workflows/workflow/workflow-suspended-steps.tsx"],"sourcesContent":["import type { GetWorkflowResponse } from '@mastra/client-js';\nimport { ChevronRight, CirclePause, MoveDownLeft, MoveUpRight, Play } from 'lucide-react';\nimport { useState } from 'react';\nimport type { CSSProperties } from 'react';\nimport { parse } from 'superjson';\nimport { z } from 'zod';\nimport { panelSurfaceStyle } from '../components/workflow-layout';\nimport type { SuspendedStep } from './use-workflow-trigger';\nimport { WorkflowInputData } from './workflow-input-data';\nimport { ActivityWick } from '@/ds/components/Activity';\nimport { Badge } from '@/ds/components/Badge';\nimport { CodeEditor } from '@/ds/components/CodeEditor';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/ds/components/Collapsible';\nimport { Txt } from '@/ds/components/Txt';\nimport { Icon } from '@/ds/icons/Icon';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { jsonSchemaToZodRuntime } from '@/lib/form/json-schema-to-zod-runtime';\nimport { cn } from '@/utils/cn';\nimport { toast } from '@/utils/toast';\n\nconst suspendedWickStyle: CSSProperties & { '--belt-hue': string } = { '--belt-hue': 'var(--warning1)' };\n\nexport interface ResumeStepParams {\n  stepId: string | string[];\n  runId: string;\n  resumeData: Record<string, unknown>;\n}\n\nexport interface WorkflowSuspendedStepsProps {\n  suspendedSteps: SuspendedStep[];\n  workflow: GetWorkflowResponse;\n  isStreaming: boolean;\n  onResume: (step: ResumeStepParams) => Promise<void>;\n}\n\nfunction formatPayloadSize(payload: unknown): string {\n  const size = new Blob([JSON.stringify(payload ?? null)]).size;\n  if (size < 1024) {\n    return `${size} B`;\n  }\n  return `${(size / 1024).toFixed(1)} KB`;\n}\n\nfunction getPayloadLabel(payload: unknown, fallback: string): string {\n  if (payload && typeof payload === 'object' && !Array.isArray(payload)) {\n    const keys = Object.keys(payload);\n    const [onlyKey] = keys;\n    if (keys.length === 1 && onlyKey) {\n      return onlyKey;\n    }\n  }\n  return fallback;\n}\n\nexport function WorkflowSuspendedSteps({\n  suspendedSteps,\n  workflow,\n  isStreaming,\n  onResume,\n}: WorkflowSuspendedStepsProps) {\n  if (isStreaming || suspendedSteps.length === 0) {\n    return null;\n  }\n\n  return (\n    <section\n      className={cn(panelSurfaceStyle, 'pointer-events-auto relative isolate')}\n      data-testid=\"workflow-suspended-steps\"\n      aria-label=\"Step suspended\"\n    >\n      <div className=\"max-h-[calc(100cqh-64px)] overflow-y-auto overscroll-contain rounded-[inherit]\">\n        <div className=\"flex items-center justify-between gap-3 border-b border-border/50 bg-background px-5 py-4\">\n          <Txt as=\"h2\" variant=\"column\" tone=\"ink\" className=\"flex items-center gap-2\">\n            <Icon>\n              <CirclePause />\n            </Icon>\n            Step suspended\n          </Txt>\n          <Badge variant=\"orange\" emphasis=\"muted\">\n            Needs input\n          </Badge>\n        </div>\n\n        {suspendedSteps.map(step => {\n          const stepDefinition = workflow.allSteps[step.stepId];\n          if (!stepDefinition || stepDefinition.isWorkflow) return null;\n\n          const stepSchema = stepDefinition?.resumeSchema\n            ? jsonSchemaToZodRuntime(parse(stepDefinition.resumeSchema))\n            : z.record(z.string(), z.any());\n\n          return (\n            <SuspendedStepCard\n              key={`${step.runId}-${step.stepId}`}\n              step={step}\n              stepSchema={stepSchema}\n              description={stepDefinition.description}\n              onResume={onResume}\n            />\n          );\n        })}\n      </div>\n      <ActivityWick status=\"ready\" label=\"Needs input\" className=\"before:hidden\" style={suspendedWickStyle} />\n    </section>\n  );\n}\n\ninterface SuspendedStepCardProps {\n  step: SuspendedStep;\n  stepSchema: z.ZodSchema;\n  description?: string;\n  onResume: WorkflowSuspendedStepsProps['onResume'];\n}\n\nfunction SuspendedStepCard({ step, stepSchema, description, onResume }: SuspendedStepCardProps) {\n  const [isPayloadOpen, setIsPayloadOpen] = useState(false);\n  const [isResuming, setIsResuming] = useState(false);\n\n  const resumeWithResponse = async (resumeData: Record<string, unknown>) => {\n    setIsResuming(true);\n    try {\n      await onResume({ stepId: step.stepId.split('.'), runId: step.runId, resumeData });\n    } catch (error) {\n      toast.error(error instanceof Error ? error.message : 'Error resuming workflow');\n    } finally {\n      setIsResuming(false);\n    }\n  };\n\n  return (\n    <div className=\"space-y-5 p-5 [&+&]:border-t [&+&]:border-border/50\">\n      <div className=\"space-y-2\">\n        <Txt as=\"p\" variant=\"subheading\" tone=\"ink\" className=\"break-words\">\n          {step.stepId}\n        </Txt>\n        {description && (\n          <Txt as=\"p\" variant=\"caption\" tone=\"muted\">\n            {description}\n          </Txt>\n        )}\n      </div>\n\n      {step.suspendPayload !== undefined && (\n        <div className=\"space-y-2\">\n          <Txt as=\"p\" variant=\"caption\" tone=\"muted\" className=\"flex items-center gap-2\">\n            <Icon>\n              <MoveDownLeft />\n            </Icon>\n            The step is asking\n          </Txt>\n\n          <Collapsible open={isPayloadOpen} onOpenChange={setIsPayloadOpen}>\n            <CollapsibleTrigger\n              className={cn(\n                raisedSurfaceStyle,\n                'flex w-full items-center justify-between gap-2 rounded-lg px-3 py-2.5',\n              )}\n            >\n              <span className=\"flex min-w-0 items-center gap-2\">\n                <Icon>\n                  <ChevronRight\n                    className={cn('text-muted-foreground transition-transform', {\n                      'rotate-90 transform': isPayloadOpen,\n                    })}\n                  />\n                </Icon>\n                <Txt as=\"span\" variant=\"body\" tone=\"ink\" className=\"truncate\">\n                  {getPayloadLabel(step.suspendPayload, step.stepId)}\n                </Txt>\n              </span>\n              <Txt as=\"span\" variant=\"caption\" tone=\"muted\" className=\"shrink-0\">\n                {formatPayloadSize(step.suspendPayload)}\n              </Txt>\n            </CollapsibleTrigger>\n            <CollapsibleContent>\n              <div data-testid=\"suspended-payload\" className=\"pt-2\">\n                <CodeEditor\n                  value={JSON.stringify(step.suspendPayload, null, 2)}\n                  editable={false}\n                  className=\"w-full overflow-x-auto p-2\"\n                  showCopyButton={false}\n                />\n              </div>\n            </CollapsibleContent>\n          </Collapsible>\n        </div>\n      )}\n\n      <div className=\"space-y-3\">\n        <Txt as=\"p\" variant=\"caption\" tone=\"muted\" className=\"flex items-center gap-2\">\n          <Icon>\n            <MoveUpRight />\n          </Icon>\n          Your response\n        </Txt>\n\n        <div className=\"-mx-5\">\n          <WorkflowInputData\n            schema={stepSchema}\n            isSubmitLoading={isResuming}\n            submitButtonLabel=\"Resume\"\n            submitButtonVariant=\"primary\"\n            submitButtonIcon={<Play />}\n            submitButtonFullWidth\n            collapsible={false}\n            hideHeading\n            hideInputTypeLabel\n            onSubmit={resumeWithResponse}\n          />\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["jsxs","cn","panelSurfaceStyle","Txt","jsx","Icon","CirclePause","Badge","jsonSchemaToZodRuntime","parse","z","ActivityWick","useState","toast","MoveDownLeft","Collapsible","CollapsibleTrigger","raisedSurfaceStyle","ChevronRight","CollapsibleContent","CodeEditor","MoveUpRight","WorkflowInputData","Play"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAoBA,MAAM,kBAAA,GAA+D,EAAE,YAAA,EAAc,iBAAA,EAAkB;AAevG,SAAS,kBAAkB,OAAA,EAA0B;AACnD,EAAA,MAAM,IAAA,GAAO,IAAI,IAAA,CAAK,CAAC,IAAA,CAAK,UAAU,OAAA,IAAW,IAAI,CAAC,CAAC,CAAA,CAAE,IAAA;AACzD,EAAA,IAAI,OAAO,IAAA,EAAM;AACf,IAAA,OAAO,GAAG,IAAI,CAAA,EAAA,CAAA;AAAA,EAChB;AACA,EAAA,OAAO,CAAA,EAAA,CAAI,IAAA,GAAO,IAAA,EAAM,OAAA,CAAQ,CAAC,CAAC,CAAA,GAAA,CAAA;AACpC;AAEA,SAAS,eAAA,CAAgB,SAAkB,QAAA,EAA0B;AACnE,EAAA,IAAI,OAAA,IAAW,OAAO,OAAA,KAAY,QAAA,IAAY,CAAC,KAAA,CAAM,OAAA,CAAQ,OAAO,CAAA,EAAG;AACrE,IAAA,MAAM,IAAA,GAAO,MAAA,CAAO,IAAA,CAAK,OAAO,CAAA;AAChC,IAAA,MAAM,CAAC,OAAO,CAAA,GAAI,IAAA;AAClB,IAAA,IAAI,IAAA,CAAK,MAAA,KAAW,CAAA,IAAK,OAAA,EAAS;AAChC,MAAA,OAAO,OAAA;AAAA,IACT;AAAA,EACF;AACA,EAAA,OAAO,QAAA;AACT;AAEO,SAAS,sBAAA,CAAuB;AAAA,EACrC,cAAA;AAAA,EACA,QAAA;AAAA,EACA,WAAA;AAAA,EACA;AACF,CAAA,EAAgC;AAC9B,EAAA,IAAI,WAAA,IAAe,cAAA,CAAe,MAAA,KAAW,CAAA,EAAG;AAC9C,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACEA,eAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,WAAA,CAAGC,6DAAA,EAAmB,sCAAsC,CAAA;AAAA,MACvE,aAAA,EAAY,0BAAA;AAAA,MACZ,YAAA,EAAW,gBAAA;AAAA,MAEX,QAAA,EAAA;AAAA,wBAAAF,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,gFAAA,EACb,QAAA,EAAA;AAAA,0BAAAA,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,2FAAA,EACb,QAAA,EAAA;AAAA,4BAAAA,eAAA,CAACG,OAAA,EAAA,EAAI,IAAG,IAAA,EAAK,OAAA,EAAQ,UAAS,IAAA,EAAK,KAAA,EAAM,WAAU,yBAAA,EACjD,QAAA,EAAA;AAAA,8BAAAC,cAAA,CAACC,eAAA,EAAA,EACC,QAAA,kBAAAD,cAAA,CAACE,uBAAA,EAAA,EAAY,CAAA,EACf,CAAA;AAAA,cAAO;AAAA,aAAA,EAET,CAAA;AAAA,2CACCC,WAAA,EAAA,EAAM,OAAA,EAAQ,QAAA,EAAS,QAAA,EAAS,SAAQ,QAAA,EAAA,aAAA,EAEzC;AAAA,WAAA,EACF,CAAA;AAAA,UAEC,cAAA,CAAe,IAAI,CAAA,IAAA,KAAQ;AAC1B,YAAA,MAAM,cAAA,GAAiB,QAAA,CAAS,QAAA,CAAS,IAAA,CAAK,MAAM,CAAA;AACpD,YAAA,IAAI,CAAC,cAAA,IAAkB,cAAA,CAAe,UAAA,EAAY,OAAO,IAAA;AAEzD,YAAA,MAAM,aAAa,cAAA,EAAgB,YAAA,GAC/BC,sDAAA,CAAuBC,eAAA,CAAM,eAAe,YAAY,CAAC,CAAA,GACzDC,KAAA,CAAE,OAAOA,KAAA,CAAE,MAAA,EAAO,EAAGA,KAAA,CAAE,KAAK,CAAA;AAEhC,YAAA,uBACEN,cAAA;AAAA,cAAC,iBAAA;AAAA,cAAA;AAAA,gBAEC,IAAA;AAAA,gBACA,UAAA;AAAA,gBACA,aAAa,cAAA,CAAe,WAAA;AAAA,gBAC5B;AAAA,eAAA;AAAA,cAJK,CAAA,EAAG,IAAA,CAAK,KAAK,CAAA,CAAA,EAAI,KAAK,MAAM,CAAA;AAAA,aAKnC;AAAA,UAEJ,CAAC;AAAA,SAAA,EACH,CAAA;AAAA,wBACAA,cAAA,CAACO,yBAAa,MAAA,EAAO,OAAA,EAAQ,OAAM,aAAA,EAAc,SAAA,EAAU,eAAA,EAAgB,KAAA,EAAO,kBAAA,EAAoB;AAAA;AAAA;AAAA,GACxG;AAEJ;AASA,SAAS,kBAAkB,EAAE,IAAA,EAAM,UAAA,EAAY,WAAA,EAAa,UAAS,EAA2B;AAC9F,EAAA,MAAM,CAAC,aAAA,EAAe,gBAAgB,CAAA,GAAIC,eAAS,KAAK,CAAA;AACxD,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAIA,eAAS,KAAK,CAAA;AAElD,EAAA,MAAM,kBAAA,GAAqB,OAAO,UAAA,KAAwC;AACxE,IAAA,aAAA,CAAc,IAAI,CAAA;AAClB,IAAA,IAAI;AACF,MAAA,MAAM,QAAA,CAAS,EAAE,MAAA,EAAQ,IAAA,CAAK,MAAA,CAAO,KAAA,CAAM,GAAG,CAAA,EAAG,KAAA,EAAO,IAAA,CAAK,KAAA,EAAO,UAAA,EAAY,CAAA;AAAA,IAClF,SAAS,KAAA,EAAO;AACd,MAAAC,WAAA,CAAM,KAAA,CAAM,KAAA,YAAiB,KAAA,GAAQ,KAAA,CAAM,UAAU,yBAAyB,CAAA;AAAA,IAChF,CAAA,SAAE;AACA,MAAA,aAAA,CAAc,KAAK,CAAA;AAAA,IACrB;AAAA,EACF,CAAA;AAEA,EAAA,uBACEb,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qDAAA,EACb,QAAA,EAAA;AAAA,oBAAAA,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,WAAA,EACb,QAAA,EAAA;AAAA,sBAAAI,cAAA,CAACD,OAAA,EAAA,EAAI,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,YAAA,EAAa,MAAK,KAAA,EAAM,SAAA,EAAU,aAAA,EACnD,QAAA,EAAA,IAAA,CAAK,MAAA,EACR,CAAA;AAAA,MACC,WAAA,mCACEA,OAAA,EAAA,EAAI,EAAA,EAAG,KAAI,OAAA,EAAQ,SAAA,EAAU,IAAA,EAAK,OAAA,EAChC,QAAA,EAAA,WAAA,EACH;AAAA,KAAA,EAEJ,CAAA;AAAA,IAEC,KAAK,cAAA,KAAmB,MAAA,oBACvBH,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,WAAA,EACb,QAAA,EAAA;AAAA,sBAAAA,eAAA,CAACG,OAAA,EAAA,EAAI,IAAG,GAAA,EAAI,OAAA,EAAQ,WAAU,IAAA,EAAK,OAAA,EAAQ,WAAU,yBAAA,EACnD,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAACC,eAAA,EAAA,EACC,QAAA,kBAAAD,cAAA,CAACU,wBAAA,EAAA,EAAa,CAAA,EAChB,CAAA;AAAA,QAAO;AAAA,OAAA,EAET,CAAA;AAAA,sBAEAd,eAAA,CAACe,uBAAA,EAAA,EAAY,IAAA,EAAM,aAAA,EAAe,cAAc,gBAAA,EAC9C,QAAA,EAAA;AAAA,wBAAAf,eAAA;AAAA,UAACgB,8BAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAWf,WAAA;AAAA,cACTgB,2CAAA;AAAA,cACA;AAAA,aACF;AAAA,YAEA,QAAA,EAAA;AAAA,8BAAAjB,eAAA,CAAC,MAAA,EAAA,EAAK,WAAU,iCAAA,EACd,QAAA,EAAA;AAAA,gCAAAI,cAAA,CAACC,eAAA,EAAA,EACC,QAAA,kBAAAD,cAAA;AAAA,kBAACc,wBAAA;AAAA,kBAAA;AAAA,oBACC,SAAA,EAAWjB,YAAG,4CAAA,EAA8C;AAAA,sBAC1D,qBAAA,EAAuB;AAAA,qBACxB;AAAA;AAAA,iBACH,EACF,CAAA;AAAA,gCACAG,cAAA,CAACD,OAAA,EAAA,EAAI,EAAA,EAAG,MAAA,EAAO,SAAQ,MAAA,EAAO,IAAA,EAAK,KAAA,EAAM,SAAA,EAAU,YAChD,QAAA,EAAA,eAAA,CAAgB,IAAA,CAAK,cAAA,EAAgB,IAAA,CAAK,MAAM,CAAA,EACnD;AAAA,eAAA,EACF,CAAA;AAAA,8BACAC,cAAA,CAACD,OAAA,EAAA,EAAI,EAAA,EAAG,MAAA,EAAO,OAAA,EAAQ,SAAA,EAAU,IAAA,EAAK,OAAA,EAAQ,SAAA,EAAU,UAAA,EACrD,QAAA,EAAA,iBAAA,CAAkB,IAAA,CAAK,cAAc,CAAA,EACxC;AAAA;AAAA;AAAA,SACF;AAAA,uCACCgB,8BAAA,EAAA,EACC,QAAA,kBAAAf,cAAA,CAAC,SAAI,aAAA,EAAY,mBAAA,EAAoB,WAAU,MAAA,EAC7C,QAAA,kBAAAA,cAAA;AAAA,UAACgB,qBAAA;AAAA,UAAA;AAAA,YACC,OAAO,IAAA,CAAK,SAAA,CAAU,IAAA,CAAK,cAAA,EAAgB,MAAM,CAAC,CAAA;AAAA,YAClD,QAAA,EAAU,KAAA;AAAA,YACV,SAAA,EAAU,4BAAA;AAAA,YACV,cAAA,EAAgB;AAAA;AAAA,WAEpB,CAAA,EACF;AAAA,OAAA,EACF;AAAA,KAAA,EACF,CAAA;AAAA,oBAGFpB,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,WAAA,EACb,QAAA,EAAA;AAAA,sBAAAA,eAAA,CAACG,OAAA,EAAA,EAAI,IAAG,GAAA,EAAI,OAAA,EAAQ,WAAU,IAAA,EAAK,OAAA,EAAQ,WAAU,yBAAA,EACnD,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAACC,eAAA,EAAA,EACC,QAAA,kBAAAD,cAAA,CAACiB,uBAAA,EAAA,EAAY,CAAA,EACf,CAAA;AAAA,QAAO;AAAA,OAAA,EAET,CAAA;AAAA,sBAEAjB,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,OAAA,EACb,QAAA,kBAAAA,cAAA;AAAA,QAACkB,8DAAA;AAAA,QAAA;AAAA,UACC,MAAA,EAAQ,UAAA;AAAA,UACR,eAAA,EAAiB,UAAA;AAAA,UACjB,iBAAA,EAAkB,QAAA;AAAA,UAClB,mBAAA,EAAoB,SAAA;AAAA,UACpB,gBAAA,iCAAmBC,gBAAA,EAAA,EAAK,CAAA;AAAA,UACxB,qBAAA,EAAqB,IAAA;AAAA,UACrB,WAAA,EAAa,KAAA;AAAA,UACb,WAAA,EAAW,IAAA;AAAA,UACX,kBAAA,EAAkB,IAAA;AAAA,UAClB,QAAA,EAAU;AAAA;AAAA,OACZ,EACF;AAAA,KAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/domains/workflows/workflow/workflow-suspended-steps.d.ts

@@ -0,0 +1,2 @@
+export * from '../../../src/domains/workflows/workflow/workflow-suspended-steps'
+export {}

package/dist/domains/workflows/workflow/workflow-suspended-steps.es.js

@@ -0,0 +1,165 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { CirclePause, MoveDownLeft, ChevronRight, MoveUpRight, Play } from 'lucide-react';
+import { useState } from 'react';
+import { parse } from 'superjson';
+import { z } from 'zod';
+import { panelSurfaceStyle } from '../components/workflow-layout.es.js';
+import { WorkflowInputData } from './workflow-input-data.es.js';
+import { a as ActivityWick } from '../../../activity-B8TfxRNU.js';
+import { B as Badge } from '../../../Badge-Bzn8Z-_I.js';
+import { C as CodeEditor } from '../../../code-editor-DMNGyqvg.js';
+import { C as Collapsible, b as CollapsibleTrigger, a as CollapsibleContent } from '../../../collapsible-DhhP5p1j.js';
+import { T as Txt } from '../../../Txt-BP1SRHmL.js';
+import { Icon } from '../../../icons/Icon.es.js';
+import { raisedSurfaceStyle } from '../../../primitives/raised-surface.es.js';
+import { jsonSchemaToZodRuntime } from '../../../lib/form/json-schema-to-zod-runtime.es.js';
+import { c as cn } from '../../../cn-65Adrsfj.js';
+import { t as toast } from '../../../toast-c5kCpyWt.js';
+
+const suspendedWickStyle = { "--belt-hue": "var(--warning1)" };
+function formatPayloadSize(payload) {
+  const size = new Blob([JSON.stringify(payload ?? null)]).size;
+  if (size < 1024) {
+    return `${size} B`;
+  }
+  return `${(size / 1024).toFixed(1)} KB`;
+}
+function getPayloadLabel(payload, fallback) {
+  if (payload && typeof payload === "object" && !Array.isArray(payload)) {
+    const keys = Object.keys(payload);
+    const [onlyKey] = keys;
+    if (keys.length === 1 && onlyKey) {
+      return onlyKey;
+    }
+  }
+  return fallback;
+}
+function WorkflowSuspendedSteps({
+  suspendedSteps,
+  workflow,
+  isStreaming,
+  onResume
+}) {
+  if (isStreaming || suspendedSteps.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className: cn(panelSurfaceStyle, "pointer-events-auto relative isolate"),
+      "data-testid": "workflow-suspended-steps",
+      "aria-label": "Step suspended",
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "max-h-[calc(100cqh-64px)] overflow-y-auto overscroll-contain rounded-[inherit]", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 border-b border-border/50 bg-background px-5 py-4", children: [
+            /* @__PURE__ */ jsxs(Txt, { as: "h2", variant: "column", tone: "ink", className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx(Icon, { children: /* @__PURE__ */ jsx(CirclePause, {}) }),
+              "Step suspended"
+            ] }),
+            /* @__PURE__ */ jsx(Badge, { variant: "orange", emphasis: "muted", children: "Needs input" })
+          ] }),
+          suspendedSteps.map((step) => {
+            const stepDefinition = workflow.allSteps[step.stepId];
+            if (!stepDefinition || stepDefinition.isWorkflow) return null;
+            const stepSchema = stepDefinition?.resumeSchema ? jsonSchemaToZodRuntime(parse(stepDefinition.resumeSchema)) : z.record(z.string(), z.any());
+            return /* @__PURE__ */ jsx(
+              SuspendedStepCard,
+              {
+                step,
+                stepSchema,
+                description: stepDefinition.description,
+                onResume
+              },
+              `${step.runId}-${step.stepId}`
+            );
+          })
+        ] }),
+        /* @__PURE__ */ jsx(ActivityWick, { status: "ready", label: "Needs input", className: "before:hidden", style: suspendedWickStyle })
+      ]
+    }
+  );
+}
+function SuspendedStepCard({ step, stepSchema, description, onResume }) {
+  const [isPayloadOpen, setIsPayloadOpen] = useState(false);
+  const [isResuming, setIsResuming] = useState(false);
+  const resumeWithResponse = async (resumeData) => {
+    setIsResuming(true);
+    try {
+      await onResume({ stepId: step.stepId.split("."), runId: step.runId, resumeData });
+    } catch (error) {
+      toast.error(error instanceof Error ? error.message : "Error resuming workflow");
+    } finally {
+      setIsResuming(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-5 p-5 [&+&]:border-t [&+&]:border-border/50", children: [
+    /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx(Txt, { as: "p", variant: "subheading", tone: "ink", className: "break-words", children: step.stepId }),
+      description && /* @__PURE__ */ jsx(Txt, { as: "p", variant: "caption", tone: "muted", children: description })
+    ] }),
+    step.suspendPayload !== void 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsxs(Txt, { as: "p", variant: "caption", tone: "muted", className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(Icon, { children: /* @__PURE__ */ jsx(MoveDownLeft, {}) }),
+        "The step is asking"
+      ] }),
+      /* @__PURE__ */ jsxs(Collapsible, { open: isPayloadOpen, onOpenChange: setIsPayloadOpen, children: [
+        /* @__PURE__ */ jsxs(
+          CollapsibleTrigger,
+          {
+            className: cn(
+              raisedSurfaceStyle,
+              "flex w-full items-center justify-between gap-2 rounded-lg px-3 py-2.5"
+            ),
+            children: [
+              /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-2", children: [
+                /* @__PURE__ */ jsx(Icon, { children: /* @__PURE__ */ jsx(
+                  ChevronRight,
+                  {
+                    className: cn("text-muted-foreground transition-transform", {
+                      "rotate-90 transform": isPayloadOpen
+                    })
+                  }
+                ) }),
+                /* @__PURE__ */ jsx(Txt, { as: "span", variant: "body", tone: "ink", className: "truncate", children: getPayloadLabel(step.suspendPayload, step.stepId) })
+              ] }),
+              /* @__PURE__ */ jsx(Txt, { as: "span", variant: "caption", tone: "muted", className: "shrink-0", children: formatPayloadSize(step.suspendPayload) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx("div", { "data-testid": "suspended-payload", className: "pt-2", children: /* @__PURE__ */ jsx(
+          CodeEditor,
+          {
+            value: JSON.stringify(step.suspendPayload, null, 2),
+            editable: false,
+            className: "w-full overflow-x-auto p-2",
+            showCopyButton: false
+          }
+        ) }) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsxs(Txt, { as: "p", variant: "caption", tone: "muted", className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(Icon, { children: /* @__PURE__ */ jsx(MoveUpRight, {}) }),
+        "Your response"
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "-mx-5", children: /* @__PURE__ */ jsx(
+        WorkflowInputData,
+        {
+          schema: stepSchema,
+          isSubmitLoading: isResuming,
+          submitButtonLabel: "Resume",
+          submitButtonVariant: "primary",
+          submitButtonIcon: /* @__PURE__ */ jsx(Play, {}),
+          submitButtonFullWidth: true,
+          collapsible: false,
+          hideHeading: true,
+          hideInputTypeLabel: true,
+          onSubmit: resumeWithResponse
+        }
+      ) })
+    ] })
+  ] });
+}
+
+export { WorkflowSuspendedSteps };
+//# sourceMappingURL=workflow-suspended-steps.es.js.map

package/dist/domains/workflows/workflow/workflow-suspended-steps.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"workflow-suspended-steps.es.js","sources":["../../../../src/domains/workflows/workflow/workflow-suspended-steps.tsx"],"sourcesContent":["import type { GetWorkflowResponse } from '@mastra/client-js';\nimport { ChevronRight, CirclePause, MoveDownLeft, MoveUpRight, Play } from 'lucide-react';\nimport { useState } from 'react';\nimport type { CSSProperties } from 'react';\nimport { parse } from 'superjson';\nimport { z } from 'zod';\nimport { panelSurfaceStyle } from '../components/workflow-layout';\nimport type { SuspendedStep } from './use-workflow-trigger';\nimport { WorkflowInputData } from './workflow-input-data';\nimport { ActivityWick } from '@/ds/components/Activity';\nimport { Badge } from '@/ds/components/Badge';\nimport { CodeEditor } from '@/ds/components/CodeEditor';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/ds/components/Collapsible';\nimport { Txt } from '@/ds/components/Txt';\nimport { Icon } from '@/ds/icons/Icon';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { jsonSchemaToZodRuntime } from '@/lib/form/json-schema-to-zod-runtime';\nimport { cn } from '@/utils/cn';\nimport { toast } from '@/utils/toast';\n\nconst suspendedWickStyle: CSSProperties & { '--belt-hue': string } = { '--belt-hue': 'var(--warning1)' };\n\nexport interface ResumeStepParams {\n  stepId: string | string[];\n  runId: string;\n  resumeData: Record<string, unknown>;\n}\n\nexport interface WorkflowSuspendedStepsProps {\n  suspendedSteps: SuspendedStep[];\n  workflow: GetWorkflowResponse;\n  isStreaming: boolean;\n  onResume: (step: ResumeStepParams) => Promise<void>;\n}\n\nfunction formatPayloadSize(payload: unknown): string {\n  const size = new Blob([JSON.stringify(payload ?? null)]).size;\n  if (size < 1024) {\n    return `${size} B`;\n  }\n  return `${(size / 1024).toFixed(1)} KB`;\n}\n\nfunction getPayloadLabel(payload: unknown, fallback: string): string {\n  if (payload && typeof payload === 'object' && !Array.isArray(payload)) {\n    const keys = Object.keys(payload);\n    const [onlyKey] = keys;\n    if (keys.length === 1 && onlyKey) {\n      return onlyKey;\n    }\n  }\n  return fallback;\n}\n\nexport function WorkflowSuspendedSteps({\n  suspendedSteps,\n  workflow,\n  isStreaming,\n  onResume,\n}: WorkflowSuspendedStepsProps) {\n  if (isStreaming || suspendedSteps.length === 0) {\n    return null;\n  }\n\n  return (\n    <section\n      className={cn(panelSurfaceStyle, 'pointer-events-auto relative isolate')}\n      data-testid=\"workflow-suspended-steps\"\n      aria-label=\"Step suspended\"\n    >\n      <div className=\"max-h-[calc(100cqh-64px)] overflow-y-auto overscroll-contain rounded-[inherit]\">\n        <div className=\"flex items-center justify-between gap-3 border-b border-border/50 bg-background px-5 py-4\">\n          <Txt as=\"h2\" variant=\"column\" tone=\"ink\" className=\"flex items-center gap-2\">\n            <Icon>\n              <CirclePause />\n            </Icon>\n            Step suspended\n          </Txt>\n          <Badge variant=\"orange\" emphasis=\"muted\">\n            Needs input\n          </Badge>\n        </div>\n\n        {suspendedSteps.map(step => {\n          const stepDefinition = workflow.allSteps[step.stepId];\n          if (!stepDefinition || stepDefinition.isWorkflow) return null;\n\n          const stepSchema = stepDefinition?.resumeSchema\n            ? jsonSchemaToZodRuntime(parse(stepDefinition.resumeSchema))\n            : z.record(z.string(), z.any());\n\n          return (\n            <SuspendedStepCard\n              key={`${step.runId}-${step.stepId}`}\n              step={step}\n              stepSchema={stepSchema}\n              description={stepDefinition.description}\n              onResume={onResume}\n            />\n          );\n        })}\n      </div>\n      <ActivityWick status=\"ready\" label=\"Needs input\" className=\"before:hidden\" style={suspendedWickStyle} />\n    </section>\n  );\n}\n\ninterface SuspendedStepCardProps {\n  step: SuspendedStep;\n  stepSchema: z.ZodSchema;\n  description?: string;\n  onResume: WorkflowSuspendedStepsProps['onResume'];\n}\n\nfunction SuspendedStepCard({ step, stepSchema, description, onResume }: SuspendedStepCardProps) {\n  const [isPayloadOpen, setIsPayloadOpen] = useState(false);\n  const [isResuming, setIsResuming] = useState(false);\n\n  const resumeWithResponse = async (resumeData: Record<string, unknown>) => {\n    setIsResuming(true);\n    try {\n      await onResume({ stepId: step.stepId.split('.'), runId: step.runId, resumeData });\n    } catch (error) {\n      toast.error(error instanceof Error ? error.message : 'Error resuming workflow');\n    } finally {\n      setIsResuming(false);\n    }\n  };\n\n  return (\n    <div className=\"space-y-5 p-5 [&+&]:border-t [&+&]:border-border/50\">\n      <div className=\"space-y-2\">\n        <Txt as=\"p\" variant=\"subheading\" tone=\"ink\" className=\"break-words\">\n          {step.stepId}\n        </Txt>\n        {description && (\n          <Txt as=\"p\" variant=\"caption\" tone=\"muted\">\n            {description}\n          </Txt>\n        )}\n      </div>\n\n      {step.suspendPayload !== undefined && (\n        <div className=\"space-y-2\">\n          <Txt as=\"p\" variant=\"caption\" tone=\"muted\" className=\"flex items-center gap-2\">\n            <Icon>\n              <MoveDownLeft />\n            </Icon>\n            The step is asking\n          </Txt>\n\n          <Collapsible open={isPayloadOpen} onOpenChange={setIsPayloadOpen}>\n            <CollapsibleTrigger\n              className={cn(\n                raisedSurfaceStyle,\n                'flex w-full items-center justify-between gap-2 rounded-lg px-3 py-2.5',\n              )}\n            >\n              <span className=\"flex min-w-0 items-center gap-2\">\n                <Icon>\n                  <ChevronRight\n                    className={cn('text-muted-foreground transition-transform', {\n                      'rotate-90 transform': isPayloadOpen,\n                    })}\n                  />\n                </Icon>\n                <Txt as=\"span\" variant=\"body\" tone=\"ink\" className=\"truncate\">\n                  {getPayloadLabel(step.suspendPayload, step.stepId)}\n                </Txt>\n              </span>\n              <Txt as=\"span\" variant=\"caption\" tone=\"muted\" className=\"shrink-0\">\n                {formatPayloadSize(step.suspendPayload)}\n              </Txt>\n            </CollapsibleTrigger>\n            <CollapsibleContent>\n              <div data-testid=\"suspended-payload\" className=\"pt-2\">\n                <CodeEditor\n                  value={JSON.stringify(step.suspendPayload, null, 2)}\n                  editable={false}\n                  className=\"w-full overflow-x-auto p-2\"\n                  showCopyButton={false}\n                />\n              </div>\n            </CollapsibleContent>\n          </Collapsible>\n        </div>\n      )}\n\n      <div className=\"space-y-3\">\n        <Txt as=\"p\" variant=\"caption\" tone=\"muted\" className=\"flex items-center gap-2\">\n          <Icon>\n            <MoveUpRight />\n          </Icon>\n          Your response\n        </Txt>\n\n        <div className=\"-mx-5\">\n          <WorkflowInputData\n            schema={stepSchema}\n            isSubmitLoading={isResuming}\n            submitButtonLabel=\"Resume\"\n            submitButtonVariant=\"primary\"\n            submitButtonIcon={<Play />}\n            submitButtonFullWidth\n            collapsible={false}\n            hideHeading\n            hideInputTypeLabel\n            onSubmit={resumeWithResponse}\n          />\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAoBA,MAAM,kBAAA,GAA+D,EAAE,YAAA,EAAc,iBAAA,EAAkB;AAevG,SAAS,kBAAkB,OAAA,EAA0B;AACnD,EAAA,MAAM,IAAA,GAAO,IAAI,IAAA,CAAK,CAAC,IAAA,CAAK,UAAU,OAAA,IAAW,IAAI,CAAC,CAAC,CAAA,CAAE,IAAA;AACzD,EAAA,IAAI,OAAO,IAAA,EAAM;AACf,IAAA,OAAO,GAAG,IAAI,CAAA,EAAA,CAAA;AAAA,EAChB;AACA,EAAA,OAAO,CAAA,EAAA,CAAI,IAAA,GAAO,IAAA,EAAM,OAAA,CAAQ,CAAC,CAAC,CAAA,GAAA,CAAA;AACpC;AAEA,SAAS,eAAA,CAAgB,SAAkB,QAAA,EAA0B;AACnE,EAAA,IAAI,OAAA,IAAW,OAAO,OAAA,KAAY,QAAA,IAAY,CAAC,KAAA,CAAM,OAAA,CAAQ,OAAO,CAAA,EAAG;AACrE,IAAA,MAAM,IAAA,GAAO,MAAA,CAAO,IAAA,CAAK,OAAO,CAAA;AAChC,IAAA,MAAM,CAAC,OAAO,CAAA,GAAI,IAAA;AAClB,IAAA,IAAI,IAAA,CAAK,MAAA,KAAW,CAAA,IAAK,OAAA,EAAS;AAChC,MAAA,OAAO,OAAA;AAAA,IACT;AAAA,EACF;AACA,EAAA,OAAO,QAAA;AACT;AAEO,SAAS,sBAAA,CAAuB;AAAA,EACrC,cAAA;AAAA,EACA,QAAA;AAAA,EACA,WAAA;AAAA,EACA;AACF,CAAA,EAAgC;AAC9B,EAAA,IAAI,WAAA,IAAe,cAAA,CAAe,MAAA,KAAW,CAAA,EAAG;AAC9C,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA,CAAG,iBAAA,EAAmB,sCAAsC,CAAA;AAAA,MACvE,aAAA,EAAY,0BAAA;AAAA,MACZ,YAAA,EAAW,gBAAA;AAAA,MAEX,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,gFAAA,EACb,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,2FAAA,EACb,QAAA,EAAA;AAAA,4BAAA,IAAA,CAAC,GAAA,EAAA,EAAI,IAAG,IAAA,EAAK,OAAA,EAAQ,UAAS,IAAA,EAAK,KAAA,EAAM,WAAU,yBAAA,EACjD,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,IAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,WAAA,EAAA,EAAY,CAAA,EACf,CAAA;AAAA,cAAO;AAAA,aAAA,EAET,CAAA;AAAA,gCACC,KAAA,EAAA,EAAM,OAAA,EAAQ,QAAA,EAAS,QAAA,EAAS,SAAQ,QAAA,EAAA,aAAA,EAEzC;AAAA,WAAA,EACF,CAAA;AAAA,UAEC,cAAA,CAAe,IAAI,CAAA,IAAA,KAAQ;AAC1B,YAAA,MAAM,cAAA,GAAiB,QAAA,CAAS,QAAA,CAAS,IAAA,CAAK,MAAM,CAAA;AACpD,YAAA,IAAI,CAAC,cAAA,IAAkB,cAAA,CAAe,UAAA,EAAY,OAAO,IAAA;AAEzD,YAAA,MAAM,aAAa,cAAA,EAAgB,YAAA,GAC/B,sBAAA,CAAuB,KAAA,CAAM,eAAe,YAAY,CAAC,CAAA,GACzD,CAAA,CAAE,OAAO,CAAA,CAAE,MAAA,EAAO,EAAG,CAAA,CAAE,KAAK,CAAA;AAEhC,YAAA,uBACE,GAAA;AAAA,cAAC,iBAAA;AAAA,cAAA;AAAA,gBAEC,IAAA;AAAA,gBACA,UAAA;AAAA,gBACA,aAAa,cAAA,CAAe,WAAA;AAAA,gBAC5B;AAAA,eAAA;AAAA,cAJK,CAAA,EAAG,IAAA,CAAK,KAAK,CAAA,CAAA,EAAI,KAAK,MAAM,CAAA;AAAA,aAKnC;AAAA,UAEJ,CAAC;AAAA,SAAA,EACH,CAAA;AAAA,wBACA,GAAA,CAAC,gBAAa,MAAA,EAAO,OAAA,EAAQ,OAAM,aAAA,EAAc,SAAA,EAAU,eAAA,EAAgB,KAAA,EAAO,kBAAA,EAAoB;AAAA;AAAA;AAAA,GACxG;AAEJ;AASA,SAAS,kBAAkB,EAAE,IAAA,EAAM,UAAA,EAAY,WAAA,EAAa,UAAS,EAA2B;AAC9F,EAAA,MAAM,CAAC,aAAA,EAAe,gBAAgB,CAAA,GAAI,SAAS,KAAK,CAAA;AACxD,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,SAAS,KAAK,CAAA;AAElD,EAAA,MAAM,kBAAA,GAAqB,OAAO,UAAA,KAAwC;AACxE,IAAA,aAAA,CAAc,IAAI,CAAA;AAClB,IAAA,IAAI;AACF,MAAA,MAAM,QAAA,CAAS,EAAE,MAAA,EAAQ,IAAA,CAAK,MAAA,CAAO,KAAA,CAAM,GAAG,CAAA,EAAG,KAAA,EAAO,IAAA,CAAK,KAAA,EAAO,UAAA,EAAY,CAAA;AAAA,IAClF,SAAS,KAAA,EAAO;AACd,MAAA,KAAA,CAAM,KAAA,CAAM,KAAA,YAAiB,KAAA,GAAQ,KAAA,CAAM,UAAU,yBAAyB,CAAA;AAAA,IAChF,CAAA,SAAE;AACA,MAAA,aAAA,CAAc,KAAK,CAAA;AAAA,IACrB;AAAA,EACF,CAAA;AAEA,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qDAAA,EACb,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,WAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,GAAA,EAAA,EAAI,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,YAAA,EAAa,MAAK,KAAA,EAAM,SAAA,EAAU,aAAA,EACnD,QAAA,EAAA,IAAA,CAAK,MAAA,EACR,CAAA;AAAA,MACC,WAAA,wBACE,GAAA,EAAA,EAAI,EAAA,EAAG,KAAI,OAAA,EAAQ,SAAA,EAAU,IAAA,EAAK,OAAA,EAChC,QAAA,EAAA,WAAA,EACH;AAAA,KAAA,EAEJ,CAAA;AAAA,IAEC,KAAK,cAAA,KAAmB,MAAA,oBACvB,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,WAAA,EACb,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,GAAA,EAAA,EAAI,IAAG,GAAA,EAAI,OAAA,EAAQ,WAAU,IAAA,EAAK,OAAA,EAAQ,WAAU,yBAAA,EACnD,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,IAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,YAAA,EAAA,EAAa,CAAA,EAChB,CAAA;AAAA,QAAO;AAAA,OAAA,EAET,CAAA;AAAA,sBAEA,IAAA,CAAC,WAAA,EAAA,EAAY,IAAA,EAAM,aAAA,EAAe,cAAc,gBAAA,EAC9C,QAAA,EAAA;AAAA,wBAAA,IAAA;AAAA,UAAC,kBAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,EAAA;AAAA,cACT,kBAAA;AAAA,cACA;AAAA,aACF;AAAA,YAEA,QAAA,EAAA;AAAA,8BAAA,IAAA,CAAC,MAAA,EAAA,EAAK,WAAU,iCAAA,EACd,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,IAAA,EAAA,EACC,QAAA,kBAAA,GAAA;AAAA,kBAAC,YAAA;AAAA,kBAAA;AAAA,oBACC,SAAA,EAAW,GAAG,4CAAA,EAA8C;AAAA,sBAC1D,qBAAA,EAAuB;AAAA,qBACxB;AAAA;AAAA,iBACH,EACF,CAAA;AAAA,gCACA,GAAA,CAAC,GAAA,EAAA,EAAI,EAAA,EAAG,MAAA,EAAO,SAAQ,MAAA,EAAO,IAAA,EAAK,KAAA,EAAM,SAAA,EAAU,YAChD,QAAA,EAAA,eAAA,CAAgB,IAAA,CAAK,cAAA,EAAgB,IAAA,CAAK,MAAM,CAAA,EACnD;AAAA,eAAA,EACF,CAAA;AAAA,8BACA,GAAA,CAAC,GAAA,EAAA,EAAI,EAAA,EAAG,MAAA,EAAO,OAAA,EAAQ,SAAA,EAAU,IAAA,EAAK,OAAA,EAAQ,SAAA,EAAU,UAAA,EACrD,QAAA,EAAA,iBAAA,CAAkB,IAAA,CAAK,cAAc,CAAA,EACxC;AAAA;AAAA;AAAA,SACF;AAAA,4BACC,kBAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,SAAI,aAAA,EAAY,mBAAA,EAAoB,WAAU,MAAA,EAC7C,QAAA,kBAAA,GAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,OAAO,IAAA,CAAK,SAAA,CAAU,IAAA,CAAK,cAAA,EAAgB,MAAM,CAAC,CAAA;AAAA,YAClD,QAAA,EAAU,KAAA;AAAA,YACV,SAAA,EAAU,4BAAA;AAAA,YACV,cAAA,EAAgB;AAAA;AAAA,WAEpB,CAAA,EACF;AAAA,OAAA,EACF;AAAA,KAAA,EACF,CAAA;AAAA,oBAGF,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,WAAA,EACb,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,GAAA,EAAA,EAAI,IAAG,GAAA,EAAI,OAAA,EAAQ,WAAU,IAAA,EAAK,OAAA,EAAQ,WAAU,yBAAA,EACnD,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,IAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,WAAA,EAAA,EAAY,CAAA,EACf,CAAA;AAAA,QAAO;AAAA,OAAA,EAET,CAAA;AAAA,sBAEA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,OAAA,EACb,QAAA,kBAAA,GAAA;AAAA,QAAC,iBAAA;AAAA,QAAA;AAAA,UACC,MAAA,EAAQ,UAAA;AAAA,UACR,eAAA,EAAiB,UAAA;AAAA,UACjB,iBAAA,EAAkB,QAAA;AAAA,UAClB,mBAAA,EAAoB,SAAA;AAAA,UACpB,gBAAA,sBAAmB,IAAA,EAAA,EAAK,CAAA;AAAA,UACxB,qBAAA,EAAqB,IAAA;AAAA,UACrB,WAAA,EAAa,KAAA;AAAA,UACb,WAAA,EAAW,IAAA;AAAA,UACX,kBAAA,EAAkB,IAAA;AAAA,UAClB,QAAA,EAAU;AAAA;AAAA,OACZ,EACF;AAAA,KAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}