@mastra/playground-ui 7.0.0-beta.10 → 7.0.0-beta.11

package/dist/index.es.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useAssistantState, useMessage, MessagePrimitive, ActionBarPrimitive, useComposerRuntime, useAttachment, ComposerPrimitive, AttachmentPrimitive, useComposer, ThreadPrimitive, CompositeAttachmentAdapter, SimpleImageAttachmentAdapter, SimpleTextAttachmentAdapter, WebSpeechSynthesisAdapter, useExternalStoreRuntime, AssistantRuntimeProvider } from '@assistant-ui/react';
-import { CheckIcon as CheckIcon$1, CopyIcon, InfoIcon as InfoIcon$1, AlertCircle, TriangleAlert, ChevronUpIcon, X, Share2, Check, PlayCircle, Workflow, Layers, List, Clock as Clock$1, CalendarClock, Timer, CornerDownRight, GitBranch, RefreshCw, Repeat, Repeat1, Network, CalendarIcon, ChevronDown, Braces, ChevronDownIcon, Brackets, PlusIcon, TrashIcon, Plus, Loader2, Circle, EyeOffIcon, EyeIcon, PauseIcon, HourglassIcon, CircleDashed, Footprints, CircleCheck, CircleX, Minus, Maximize, AlertCircleIcon, CirclePause, StopCircle, SearchIcon, ChevronsUpDown, Search, BrainIcon, AudioLinesIcon, StopCircleIcon, FileText, CircleXIcon, Link, CloudUpload, Mic, ArrowUp, SaveIcon, ExternalLink, XIcon, TriangleAlertIcon, ChevronRightIcon, ArrowLeftIcon, ArrowRightIcon, ChevronsRightIcon, AlignLeftIcon, AlignJustifyIcon, ArrowUpIcon, ArrowDownIcon, CircleAlertIcon, PanelRightIcon, KeyboardIcon, GaugeIcon, ChevronsLeftRightEllipsisIcon, CalculatorIcon, HashIcon, FileInputIcon, FileOutputIcon, ReceiptText, Info, RotateCcw, GripVertical, RefreshCcwIcon, AlertTriangleIcon, ChevronRight, NetworkIcon, WorkflowIcon as WorkflowIcon$1, PackageIcon, GitBranchIcon, PackageOpenIcon, OctagonXIcon, FrownIcon, CircleChevronUpIcon, CircleChevronDownIcon, FileIcon, ChevronsUpIcon, ChevronsDownIcon, TimerIcon, ChevronsLeftRightIcon, ChevronFirstIcon, ChevronLastIcon, CircleDashedIcon, ArrowRightToLineIcon, CoinsIcon, BracesIcon, CircleGaugeIcon, PanelTopIcon, ListTreeIcon, PanelLeftIcon, CircleSlash, Trash, Link2 } from 'lucide-react';
+import { CheckIcon as CheckIcon$1, CopyIcon, ShieldAlert, ChevronDown, ChevronRight, RefreshCw, Tag, InfoIcon as InfoIcon$1, AlertCircle, TriangleAlert, ChevronUpIcon, X, Share2, Check, PlayCircle, Workflow, Layers, List, Clock as Clock$1, CalendarClock, Timer, CornerDownRight, GitBranch, Repeat, Repeat1, Network, CalendarIcon, Braces, ChevronDownIcon, Brackets, PlusIcon, TrashIcon, Plus, Loader2, Circle, EyeOffIcon, EyeIcon, PauseIcon, HourglassIcon, CircleDashed, Footprints, CircleCheck, CircleX, Minus, Maximize, AlertCircleIcon, CirclePause, StopCircle, Cpu, SearchIcon, ChevronsUpDown, Search, BrainIcon, AudioLinesIcon, StopCircleIcon, FileText, CircleXIcon, Link, CloudUpload, Mic, ArrowUp, SaveIcon, ExternalLink, XIcon, TriangleAlertIcon, ChevronRightIcon, ArrowLeftIcon, ArrowRightIcon, ChevronsRightIcon, AlignLeftIcon, AlignJustifyIcon, ArrowUpIcon, ArrowDownIcon, CircleAlertIcon, PanelRightIcon, KeyboardIcon, GaugeIcon, ChevronsLeftRightEllipsisIcon, CalculatorIcon, HashIcon, FileInputIcon, FileOutputIcon, ReceiptText, Info, RotateCcw, GripVertical, RefreshCcwIcon, AlertTriangleIcon, NetworkIcon, WorkflowIcon as WorkflowIcon$1, PackageIcon, GitBranchIcon, PackageOpenIcon, OctagonXIcon, FrownIcon, CircleChevronUpIcon, CircleChevronDownIcon, FileIcon, ChevronsUpIcon, ChevronsDownIcon, TimerIcon, ChevronsLeftRightIcon, ChevronFirstIcon, ChevronLastIcon, CircleDashedIcon, ArrowRightToLineIcon, CoinsIcon, BracesIcon, CircleGaugeIcon, PanelTopIcon, ListTreeIcon, PanelLeftIcon, CircleSlash, Trash, Link2 } from 'lucide-react';
 import * as React from 'react';
 import React__default, { forwardRef, memo, useState, useEffect, useRef, useCallback, useMemo, createContext, useContext, Fragment as Fragment$1, useId, Suspense, useLayoutEffect } from 'react';
 import { Slot } from '@radix-ui/react-slot';
@@ -3430,6 +3430,55 @@ const defaultComponents = unstable_memoizeMarkdownComponents({
   img: ImageWithFallback
 });
 
+const TripwireNotice = ({ reason, tripwire }) => {
+  const [isExpanded, setIsExpanded] = useState(false);
+  const hasMetadata = tripwire && (tripwire.retry !== void 0 || tripwire.tripwirePayload || tripwire.processorId);
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-amber-500/30 bg-amber-950/20 overflow-hidden", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4", children: [
+      /* @__PURE__ */ jsx(ShieldAlert, { className: "w-5 h-5 text-amber-400 mt-0.5 flex-shrink-0" }),
+      /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-amber-200 mb-1", children: "Content Blocked" }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-amber-300/90", children: reason })
+      ] })
+    ] }),
+    hasMetadata && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs(
+        "button",
+        {
+          onClick: () => setIsExpanded(!isExpanded),
+          className: "w-full flex items-center gap-2 px-4 py-2 text-xs text-amber-400/70 hover:text-amber-400 hover:bg-amber-900/20 transition-colors border-t border-amber-500/20",
+          children: [
+            isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "w-3.5 h-3.5" }),
+            /* @__PURE__ */ jsx("span", { children: "Details" })
+          ]
+        }
+      ),
+      isExpanded && /* @__PURE__ */ jsxs("div", { className: "px-4 pb-4 space-y-3 border-t border-amber-500/20 bg-amber-950/10", children: [
+        tripwire.retry !== void 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 pt-3", children: [
+          /* @__PURE__ */ jsx(RefreshCw, { className: "w-3.5 h-3.5 text-amber-400/60" }),
+          /* @__PURE__ */ jsxs("span", { className: "text-xs text-amber-300/70", children: [
+            "Retry:",
+            " ",
+            tripwire.retry ? /* @__PURE__ */ jsx("span", { className: "text-green-400", children: "Allowed" }) : /* @__PURE__ */ jsx("span", { className: "text-red-400", children: "Not allowed" })
+          ] })
+        ] }),
+        tripwire.processorId && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(Tag, { className: "w-3.5 h-3.5 text-amber-400/60" }),
+          /* @__PURE__ */ jsxs("span", { className: "text-xs text-amber-300/70", children: [
+            "Processor:",
+            " ",
+            /* @__PURE__ */ jsx("code", { className: "px-1.5 py-0.5 rounded bg-amber-900/30 text-amber-200 font-mono", children: tripwire.processorId })
+          ] })
+        ] }),
+        tripwire.tripwirePayload !== void 0 && tripwire.tripwirePayload !== null && /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-amber-400/60 mb-1.5", children: "Metadata:" }),
+          /* @__PURE__ */ jsx("pre", { className: "text-xs text-amber-200/80 bg-amber-900/30 rounded p-2 overflow-x-auto font-mono", children: String(JSON.stringify(tripwire.tripwirePayload, null, 2)) })
+        ] })
+      ] })
+    ] })
+  ] });
+};
+
 const AgentIcon = (props) => /* @__PURE__ */ jsxs("svg", { width: "17", height: "16", viewBox: "0 0 17 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
   /* @__PURE__ */ jsx(
     "path",
@@ -4220,6 +4269,9 @@ const ErrorAwareText = () => {
   const part = useAssistantState(({ part: part2 }) => part2);
   const text = part.text || "";
   const metadata = part.metadata || {};
+  if (metadata?.status === "tripwire") {
+    return /* @__PURE__ */ jsx(TripwireNotice, { reason: text, tripwire: metadata.tripwire });
+  }
   if (metadata?.status === "warning") {
     return /* @__PURE__ */ jsxs(Alert$1, { variant: "warning", children: [
       /* @__PURE__ */ jsx(AlertTitle$1, { as: "h5", children: "Warning" }),
@@ -4652,6 +4704,7 @@ function convertWorkflowRunStateToStreamResult(runState) {
   Object.entries(context).forEach(([stepId, stepResult]) => {
     if (stepId !== "input" && "status" in stepResult) {
       const result = stepResult;
+      const hasTripwire = result.status === "failed" && result.tripwire !== void 0;
       steps[stepId] = {
         status: result.status,
         output: "output" in result ? result.output : void 0,
@@ -4659,7 +4712,9 @@ function convertWorkflowRunStateToStreamResult(runState) {
         suspendPayload: "suspendPayload" in result ? result.suspendPayload : void 0,
         suspendOutput: "suspendOutput" in result ? result.suspendOutput : void 0,
         resumePayload: "resumePayload" in result ? result.resumePayload : void 0,
-        error: "error" in result ? result.error : void 0,
+        // Don't include error when tripwire is present - tripwire takes precedence
+        error: hasTripwire ? void 0 : "error" in result ? result.error : void 0,
+        tripwire: hasTripwire ? result.tripwire : void 0,
         startedAt: "startedAt" in result ? result.startedAt : Date.now(),
         endedAt: "endedAt" in result ? result.endedAt : void 0,
         suspendedAt: "suspendedAt" in result ? result.suspendedAt : void 0,
@@ -4684,7 +4739,15 @@ function convertWorkflowRunStateToStreamResult(runState) {
     status: runState.status,
     ...runState.status === "success" ? { result: runState.result } : {},
     ...runState.status === "failed" ? { error: runState.error } : {},
-    ...runState.status === "suspended" ? { suspended: suspendedStepIds, suspendPayload } : {}
+    ...runState.status === "suspended" ? { suspended: suspendedStepIds, suspendPayload } : {},
+    ...runState.status === "tripwire" && runState.tripwire ? {
+      tripwire: {
+        reason: runState.tripwire.reason,
+        retry: runState.tripwire.retry,
+        metadata: runState.tripwire.metadata,
+        processorId: runState.tripwire.processorId
+      }
+    } : {}
   };
 }
 
@@ -6117,10 +6180,13 @@ const useCurrentRun = () => {
   const context = useContext(WorkflowRunContext);
   const workflowCurrentSteps = context.result?.steps ?? {};
   const steps = Object.entries(workflowCurrentSteps).reduce((acc, [key, value]) => {
+    const hasTripwire = "tripwire" in value && value.tripwire;
     return {
       ...acc,
       [key]: {
-        error: "error" in value ? value.error : void 0,
+        // Don't include error when tripwire is present - tripwire takes precedence
+        error: hasTripwire ? void 0 : "error" in value ? value.error : void 0,
+        tripwire: hasTripwire ? value.tripwire : void 0,
         startedAt: value.startedAt,
         endedAt: "endedAt" in value ? value.endedAt : void 0,
         status: value.status,
@@ -7169,12 +7235,23 @@ function inferFieldType(schema, fieldConfig) {
   if (schema instanceof z.ZodDiscriminatedUnion) {
     return "discriminated-union";
   }
+  if (schema instanceof z.ZodLiteral) {
+    const v4Values = schema._zod?.def?.values;
+    const v3Value = schema._def?.value;
+    const literalValue = v4Values !== void 0 ? Array.isArray(v4Values) ? v4Values[0] : v4Values : v3Value;
+    if (typeof literalValue === "number") return "number";
+    if (typeof literalValue === "boolean") return "boolean";
+    return "string";
+  }
   return "string";
 }
 
 function getDefaultValueInZodStack(schema) {
   if (schema instanceof z$2.core.$ZodDefault) {
     return schema._zod.def.defaultValue;
+  } else if (schema instanceof z$2.core.$ZodLiteral) {
+    const values = schema._zod.def.values;
+    return Array.isArray(values) ? values[0] : values;
   } else if ("innerType" in schema._zod.def) {
     return getDefaultValueInZodStack(schema._zod.def.innerType);
   } else if ("shape" in schema._zod.def) {
@@ -7791,6 +7868,7 @@ const WorkflowStepActionBar = ({
   resumeData,
   suspendOutput,
   error,
+  tripwire,
   mapConfig,
   stepName,
   stepId,
@@ -7802,19 +7880,21 @@ const WorkflowStepActionBar = ({
   const [isOutputOpen, setIsOutputOpen] = useState(false);
   const [isResumeDataOpen, setIsResumeDataOpen] = useState(false);
   const [isErrorOpen, setIsErrorOpen] = useState(false);
+  const [isTripwireOpen, setIsTripwireOpen] = useState(false);
   const [isMapConfigOpen, setIsMapConfigOpen] = useState(false);
   const [isTimeTravelOpen, setIsTimeTravelOpen] = useState(false);
   const { withoutTimeTravel } = useContext(WorkflowRunContext);
   const dialogContentClass = "bg-surface2 rounded-lg border-sm border-border1 max-w-4xl w-full px-0";
   const dialogTitleClass = "border-b-sm border-border1 pb-4 px-6";
   const showTimeTravel = !withoutTimeTravel && stepKey && !mapConfig;
-  return /* @__PURE__ */ jsx(Fragment, { children: (input || output || error || mapConfig || resumeData || onShowNestedGraph || showTimeTravel) && /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(Fragment, { children: (input || output || error || tripwire || mapConfig || resumeData || onShowNestedGraph || showTimeTravel) && /* @__PURE__ */ jsxs(
     "div",
     {
       className: cn(
         "flex flex-wrap items-center bg-surface4 border-t-sm border-border1 px-2 py-1 gap-2 rounded-b-lg",
         status === "success" && "bg-accent1Dark",
         status === "failed" && "bg-accent2Dark",
+        status === "tripwire" && "bg-amber-900/40 border-amber-500/20",
         status === "suspended" && "bg-accent3Dark",
         status === "waiting" && "bg-accent5Dark",
         status === "running" && "bg-accent6Dark"
@@ -7883,6 +7963,26 @@ const WorkflowStepActionBar = ({
             ] }),
             /* @__PURE__ */ jsx("div", { className: "px-4 overflow-hidden", children: /* @__PURE__ */ jsx(CodeDialogContent, { data: error }) })
           ] }) })
+        ] }),
+        tripwire && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Button$1, { onClick: () => setIsTripwireOpen(true), className: "text-amber-400 hover:text-amber-300", children: "Tripwire" }),
+          /* @__PURE__ */ jsx(Dialog, { open: isTripwireOpen, onOpenChange: setIsTripwireOpen, children: /* @__PURE__ */ jsxs(DialogContent, { className: dialogContentClass, children: [
+            /* @__PURE__ */ jsxs(DialogTitle, { className: dialogTitleClass, children: [
+              stepName,
+              " tripwire"
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "px-4 overflow-hidden", children: /* @__PURE__ */ jsx(
+              CodeDialogContent,
+              {
+                data: {
+                  reason: tripwire.reason,
+                  retry: tripwire.retry,
+                  metadata: tripwire.metadata,
+                  processorId: tripwire.processorId
+                }
+              }
+            ) })
+          ] }) })
         ] })
       ]
     }
@@ -7898,6 +7998,8 @@ function WorkflowConditionNode({ data }) {
   const { steps } = useCurrentRun();
   const previousStep = steps[previousStepId];
   const nextStep = steps[nextStepId];
+  const isPreviousTripwire = previousStep?.status === "failed" && previousStep?.tripwire !== void 0;
+  const previousDisplayStatus = isPreviousTripwire ? "tripwire" : previousStep?.status;
   const { icon: IconComponent, color } = getConditionIconAndColor(type);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     !withoutTopHandle && /* @__PURE__ */ jsx(Handle, { type: "target", position: Position.Top, style: { visibility: "hidden" } }),
@@ -7905,12 +8007,13 @@ function WorkflowConditionNode({ data }) {
       "div",
       {
         "data-workflow-node": true,
-        "data-workflow-step-status": previousStep?.status,
+        "data-workflow-step-status": previousDisplayStatus,
         "data-testid": "workflow-condition-node",
         className: cn(
           "bg-surface3 rounded-lg w-[300px] border-sm border-border1",
-          previousStep?.status === "success" && nextStep && "bg-accent1Darker",
-          previousStep?.status === "failed" && nextStep && "bg-accent2Darker",
+          previousDisplayStatus === "success" && nextStep && "bg-accent1Darker",
+          previousDisplayStatus === "failed" && nextStep && "bg-accent2Darker",
+          previousDisplayStatus === "tripwire" && nextStep && "bg-amber-950/40 border-amber-500/30",
           !previousStep && Boolean(nextStep?.status) && "bg-accent1Darker"
         ),
         children: [
@@ -7964,8 +8067,9 @@ function WorkflowConditionNode({ data }) {
                         className: cn(
                           "relative font-mono p-3 w-full cursor-pointer rounded-lg text-xs !bg-surface4 overflow-scroll",
                           className,
-                          previousStep?.status === "success" && nextStep && "!bg-accent1Dark",
-                          previousStep?.status === "failed" && nextStep && "!bg-accent2Dark"
+                          previousDisplayStatus === "success" && nextStep && "!bg-accent1Dark",
+                          previousDisplayStatus === "failed" && nextStep && "!bg-accent2Dark",
+                          previousDisplayStatus === "tripwire" && nextStep && "!bg-amber-900/40"
                         ),
                         onClick: () => setOpenDialog(true),
                         style,
@@ -8021,7 +8125,8 @@ function WorkflowConditionNode({ data }) {
               stepName: nextStepId,
               input: previousStep?.output,
               mapConfig: data.mapConfig,
-              status: nextStep ? previousStep?.status : void 0
+              tripwire: isPreviousTripwire ? previousStep?.tripwire : void 0,
+              status: nextStep ? previousDisplayStatus : void 0
             }
           )
         ]
@@ -8067,6 +8172,8 @@ function WorkflowDefaultNode({ data, parentWorkflowName }) {
   } = data;
   const stepKey = parentWorkflowName ? `${parentWorkflowName}.${stepId || label}` : stepId || label;
   const step = steps[stepKey];
+  const isTripwire = step?.status === "failed" && step?.tripwire !== void 0;
+  const displayStatus = isTripwire ? "tripwire" : step?.status;
   const { isSleepNode, isForEachNode, isMapNode, hasSpecialBadge } = getNodeBadgeInfo({
     duration,
     date,
@@ -8081,16 +8188,17 @@ function WorkflowDefaultNode({ data, parentWorkflowName }) {
       "div",
       {
         "data-workflow-node": true,
-        "data-workflow-step-status": step?.status ?? "idle",
+        "data-workflow-step-status": displayStatus ?? "idle",
         "data-testid": "workflow-default-node",
         className: cn(
           "bg-surface3 rounded-lg w-[274px] border-sm border-border1",
           hasSpecialBadge ? "pt-0" : "pt-2",
-          step?.status === "success" && "bg-accent1Darker",
-          step?.status === "failed" && "bg-accent2Darker",
-          step?.status === "suspended" && "bg-accent3Darker",
-          step?.status === "waiting" && "bg-accent5Darker",
-          step?.status === "running" && "bg-accent6Darker"
+          displayStatus === "success" && "bg-accent1Darker",
+          displayStatus === "failed" && "bg-accent2Darker",
+          displayStatus === "tripwire" && "bg-amber-950/40 border-amber-500/30",
+          displayStatus === "suspended" && "bg-accent3Darker",
+          displayStatus === "waiting" && "bg-accent5Darker",
+          displayStatus === "running" && "bg-accent6Darker"
         ),
         children: [
           hasSpecialBadge && /* @__PURE__ */ jsxs("div", { className: "px-3 pt-2 pb-1 flex gap-1.5 flex-wrap", children: [
@@ -8108,11 +8216,12 @@ function WorkflowDefaultNode({ data, parentWorkflowName }) {
           ] }),
           /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-2 px-3", !description && "pb-2"), children: [
             /* @__PURE__ */ jsxs(Icon, { children: [
-              step?.status === "failed" && /* @__PURE__ */ jsx(CrossIcon, { className: "text-accent2" }),
-              step?.status === "success" && /* @__PURE__ */ jsx(CheckIcon, { className: "text-accent1" }),
-              step?.status === "suspended" && /* @__PURE__ */ jsx(PauseIcon, { className: "text-accent3" }),
-              step?.status === "waiting" && /* @__PURE__ */ jsx(HourglassIcon, { className: "text-accent5" }),
-              step?.status === "running" && /* @__PURE__ */ jsx(Loader2, { className: "text-accent6 animate-spin" }),
+              displayStatus === "tripwire" && /* @__PURE__ */ jsx(ShieldAlert, { className: "text-amber-400" }),
+              displayStatus === "failed" && /* @__PURE__ */ jsx(CrossIcon, { className: "text-accent2" }),
+              displayStatus === "success" && /* @__PURE__ */ jsx(CheckIcon, { className: "text-accent1" }),
+              displayStatus === "suspended" && /* @__PURE__ */ jsx(PauseIcon, { className: "text-accent3" }),
+              displayStatus === "waiting" && /* @__PURE__ */ jsx(HourglassIcon, { className: "text-accent5" }),
+              displayStatus === "running" && /* @__PURE__ */ jsx(Loader2, { className: "text-accent6 animate-spin" }),
               !step && /* @__PURE__ */ jsx(CircleDashed, { className: "text-icon2" })
             ] }),
             /* @__PURE__ */ jsxs(Txt, { variant: "ui-lg", className: "text-icon6 font-medium inline-flex items-center gap-1 justify-between w-full", children: [
@@ -8142,9 +8251,10 @@ function WorkflowDefaultNode({ data, parentWorkflowName }) {
               resumeData: step?.resumeData,
               output: step?.output,
               suspendOutput: step?.suspendOutput,
-              error: step?.error,
+              error: isTripwire ? void 0 : step?.error,
+              tripwire: isTripwire ? step?.tripwire : void 0,
               mapConfig,
-              status: step?.status,
+              status: displayStatus,
               stepKey
             }
           )
@@ -8396,6 +8506,8 @@ function WorkflowNestedNode({ data, parentWorkflowName }) {
   const fullLabel = parentWorkflowName ? `${parentWorkflowName}.${label}` : label;
   const stepKey = parentWorkflowName ? `${parentWorkflowName}.${stepId || label}` : stepId || label;
   const step = steps[stepKey];
+  const isTripwire = step?.status === "failed" && step?.tripwire !== void 0;
+  const displayStatus = isTripwire ? "tripwire" : step?.status;
   const { isForEachNode, isMapNode, isNestedWorkflow, hasSpecialBadge } = getNodeBadgeInfo({
     isForEach,
     mapConfig,
@@ -8410,15 +8522,16 @@ function WorkflowNestedNode({ data, parentWorkflowName }) {
       {
         "data-testid": "workflow-nested-node",
         "data-workflow-node": true,
-        "data-workflow-step-status": step?.status,
+        "data-workflow-step-status": displayStatus,
         className: cn(
           "bg-surface3 rounded-lg w-[274px] border-sm border-border1",
           hasSpecialBadge ? "pt-0" : "pt-2",
-          step?.status === "success" && "bg-accent1Darker",
-          step?.status === "failed" && "bg-accent2Darker",
-          step?.status === "suspended" && "bg-accent3Darker",
-          step?.status === "waiting" && "bg-accent5Darker",
-          step?.status === "running" && "bg-accent6Darker"
+          displayStatus === "success" && "bg-accent1Darker",
+          displayStatus === "failed" && "bg-accent2Darker",
+          displayStatus === "tripwire" && "bg-amber-950/40 border-amber-500/30",
+          displayStatus === "suspended" && "bg-accent3Darker",
+          displayStatus === "waiting" && "bg-accent5Darker",
+          displayStatus === "running" && "bg-accent6Darker"
         ),
         children: [
           hasSpecialBadge && /* @__PURE__ */ jsxs("div", { className: "px-3 pt-2 pb-1 flex gap-1.5 flex-wrap", children: [
@@ -8430,11 +8543,12 @@ function WorkflowNestedNode({ data, parentWorkflowName }) {
           ] }),
           /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-2 px-3", !description && "pb-2"), children: [
             /* @__PURE__ */ jsxs(Icon, { children: [
-              step?.status === "failed" && /* @__PURE__ */ jsx(CrossIcon, { className: "text-accent2" }),
-              step?.status === "success" && /* @__PURE__ */ jsx(CheckIcon, { className: "text-accent1" }),
-              step?.status === "suspended" && /* @__PURE__ */ jsx(PauseIcon, { className: "text-accent3" }),
-              step?.status === "waiting" && /* @__PURE__ */ jsx(HourglassIcon, { className: "text-accent5" }),
-              step?.status === "running" && /* @__PURE__ */ jsx(Loader2, { className: "text-accent6 animate-spin" }),
+              displayStatus === "failed" && /* @__PURE__ */ jsx(CrossIcon, { className: "text-accent2" }),
+              displayStatus === "success" && /* @__PURE__ */ jsx(CheckIcon, { className: "text-accent1" }),
+              displayStatus === "tripwire" && /* @__PURE__ */ jsx(ShieldAlert, { className: "text-amber-400" }),
+              displayStatus === "suspended" && /* @__PURE__ */ jsx(PauseIcon, { className: "text-accent3" }),
+              displayStatus === "waiting" && /* @__PURE__ */ jsx(HourglassIcon, { className: "text-accent5" }),
+              displayStatus === "running" && /* @__PURE__ */ jsx(Loader2, { className: "text-accent6 animate-spin" }),
               !step && /* @__PURE__ */ jsx(CircleDashed, { className: "text-icon2" })
             ] }),
             /* @__PURE__ */ jsxs(Txt, { variant: "ui-lg", className: "text-icon6 font-medium inline-flex items-center gap-1 justify-between w-full", children: [
@@ -8454,9 +8568,10 @@ function WorkflowNestedNode({ data, parentWorkflowName }) {
               output: step?.output,
               suspendOutput: step?.suspendOutput,
               error: step?.error,
+              tripwire: isTripwire ? step?.tripwire : void 0,
               mapConfig,
               onShowNestedGraph: () => showNestedGraph({ label, fullStep: fullLabel, stepGraph }),
-              status: step?.status,
+              status: displayStatus,
               stepKey
             }
           )
@@ -8562,7 +8677,12 @@ const WorkflowCard = ({ header, children, footer }) => {
   ] });
 };
 
-const WorkflowStatus = ({ stepId, status, result }) => {
+const WorkflowStatus = ({ stepId, status, result, tripwire }) => {
+  const [isTripwireExpanded, setIsTripwireExpanded] = useState(false);
+  const isTripwire = status === "tripwire";
+  const hasTripwireMetadata = Boolean(
+    tripwire && (tripwire.retry !== void 0 || tripwire.metadata !== void 0 || tripwire.processorId !== void 0)
+  );
   return /* @__PURE__ */ jsx(
     WorkflowCard,
     {
@@ -8570,19 +8690,74 @@ const WorkflowStatus = ({ stepId, status, result }) => {
         /* @__PURE__ */ jsxs(Icon, { children: [
           status === "success" && /* @__PURE__ */ jsx(CheckIcon, { className: "text-accent1" }),
           status === "failed" && /* @__PURE__ */ jsx(CrossIcon, { className: "text-accent2" }),
+          status === "tripwire" && /* @__PURE__ */ jsx(ShieldAlert, { className: "text-amber-400" }),
           status === "suspended" && /* @__PURE__ */ jsx(CirclePause, { className: "text-accent3" }),
           status === "waiting" && /* @__PURE__ */ jsx(HourglassIcon, { className: "text-accent5" }),
           status === "running" && /* @__PURE__ */ jsx(Loader2, { className: "text-accent6 animate-spin" })
         ] }),
         /* @__PURE__ */ jsx(Txt, { as: "span", variant: "ui-lg", className: "text-icon6 font-medium", children: stepId.charAt(0).toUpperCase() + stepId.slice(1) })
       ] }),
-      children: /* @__PURE__ */ jsxs("div", { className: "rounded-md bg-surface4 p-1 font-mono relative", children: [
+      children: isTripwire && tripwire ? /* @__PURE__ */ jsx(
+        TripwireDetails,
+        {
+          tripwire,
+          isExpanded: isTripwireExpanded,
+          onToggleExpand: () => setIsTripwireExpanded(!isTripwireExpanded),
+          hasMetadata: hasTripwireMetadata
+        }
+      ) : /* @__PURE__ */ jsxs("div", { className: "rounded-md bg-surface4 p-1 font-mono relative", children: [
         /* @__PURE__ */ jsx(CopyButton, { content: JSON.stringify(result, null, 2), className: "absolute top-2 right-2 z-10" }),
         /* @__PURE__ */ jsx(SyntaxHighlighter$1, { data: result })
       ] })
     }
   );
 };
+const TripwireDetails = ({ tripwire, isExpanded, onToggleExpand, hasMetadata }) => {
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-amber-500/30 bg-amber-950/20 overflow-hidden", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4", children: [
+      /* @__PURE__ */ jsx(ShieldAlert, { className: "w-5 h-5 text-amber-400 mt-0.5 flex-shrink-0" }),
+      /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-amber-200 mb-1", children: "Content Blocked" }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-amber-300/90", children: tripwire.reason || "Tripwire triggered" })
+      ] })
+    ] }),
+    hasMetadata && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs(
+        "button",
+        {
+          onClick: onToggleExpand,
+          className: "w-full flex items-center gap-2 px-4 py-2 text-xs text-amber-400/70 hover:text-amber-400 hover:bg-amber-900/20 transition-colors border-t border-amber-500/20",
+          children: [
+            isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "w-3.5 h-3.5" }),
+            /* @__PURE__ */ jsx("span", { children: "Details" })
+          ]
+        }
+      ),
+      isExpanded && /* @__PURE__ */ jsxs("div", { className: "px-4 pb-4 space-y-3 border-t border-amber-500/20 bg-amber-950/10", children: [
+        tripwire.retry !== void 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 pt-3", children: [
+          /* @__PURE__ */ jsx(RefreshCw, { className: "w-3.5 h-3.5 text-amber-400/60" }),
+          /* @__PURE__ */ jsxs("span", { className: "text-xs text-amber-300/70", children: [
+            "Retry:",
+            " ",
+            tripwire.retry ? /* @__PURE__ */ jsx("span", { className: "text-green-400", children: "Allowed" }) : /* @__PURE__ */ jsx("span", { className: "text-red-400", children: "Not allowed" })
+          ] })
+        ] }),
+        tripwire.processorId && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(Tag, { className: "w-3.5 h-3.5 text-amber-400/60" }),
+          /* @__PURE__ */ jsxs("span", { className: "text-xs text-amber-300/70", children: [
+            "Processor:",
+            " ",
+            /* @__PURE__ */ jsx("code", { className: "px-1.5 py-0.5 rounded bg-amber-900/30 text-amber-200 font-mono", children: tripwire.processorId })
+          ] })
+        ] }),
+        tripwire.metadata !== void 0 && tripwire.metadata !== null && /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-amber-400/60 mb-1.5", children: "Metadata:" }),
+          /* @__PURE__ */ jsx("pre", { className: "text-xs text-amber-200/80 bg-amber-900/30 rounded p-2 overflow-x-auto font-mono", children: String(JSON.stringify(tripwire.metadata, null, 2)) })
+        ] })
+      ] })
+    ] })
+  ] });
+};
 
 const isObjectEmpty = (objectName) => {
   return objectName && Object.keys(objectName).length === 0 && objectName.constructor === Object;
@@ -8675,7 +8850,7 @@ function WorkflowTrigger({
   const zodInputSchema = triggerSchema ? resolveSerializedZodOutput(jsonSchemaToZod(parse(triggerSchema))) : null;
   const workflowActivePaths = streamResultToUse?.steps ?? {};
   const hasWorkflowActivePaths = Object.values(workflowActivePaths).length > 0;
-  const doneStatuses = ["success", "failed", "canceled"];
+  const doneStatuses = ["success", "failed", "canceled", "tripwire"];
   return /* @__PURE__ */ jsxs("div", { className: "h-full pt-3 pb-12 overflow-y-auto", children: [
     /* @__PURE__ */ jsxs("div", { className: "space-y-4 px-5 pb-5 border-b-sm border-border1", children: [
       isSuspendedSteps && isStreamingWorkflow && /* @__PURE__ */ jsxs("div", { className: "py-2 px-5 flex items-center gap-2 bg-surface5 -mx-5 -mt-5 border-b-sm border-border1", children: [
@@ -8765,12 +8940,20 @@ function WorkflowTrigger({
             if (step.status === "success") {
               output = step.output;
             }
+            const tripwireInfo = step.status === "failed" && step.tripwire ? step.tripwire : streamResultToUse?.status === "tripwire" ? {
+              reason: streamResultToUse?.tripwire?.reason,
+              retry: streamResultToUse?.tripwire?.retry,
+              metadata: streamResultToUse?.tripwire?.metadata,
+              processorId: streamResultToUse?.tripwire?.processorId
+            } : void 0;
+            const displayStatus = step.status === "failed" && step.tripwire ? "tripwire" : status;
             return /* @__PURE__ */ jsx(
               WorkflowStatus,
               {
                 stepId,
-                status,
-                result: output ?? suspendOutput ?? {}
+                status: displayStatus,
+                result: output ?? suspendOutput ?? {},
+                tripwire: tripwireInfo
               },
               stepId
             );
@@ -9119,10 +9302,14 @@ const columns$4 = [
     header: "Name",
     cell: ({ row }) => {
       const { Link, paths } = useLinkComponent();
+      const workflow = row.original;
       return /* @__PURE__ */ jsx(
         EntryCell,
         {
-          name: /* @__PURE__ */ jsx(Link, { href: paths.workflowLink(row.original.id), children: row.original.name }),
+          name: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx(Link, { href: paths.workflowLink(row.original.id), children: row.original.name }),
+            workflow.isProcessorWorkflow && /* @__PURE__ */ jsx(Badge, { icon: /* @__PURE__ */ jsx(Cpu, { className: "h-3 w-3" }), className: "!h-badge-sm bg-violet-500/20 text-violet-400", children: "Processor" })
+          ] }),
           description: void 0,
           meta: void 0
         }
@@ -9346,7 +9533,7 @@ const Tab$1 = ({ children, value, onClick }) => {
   );
 };
 const TabContent$1 = ({ children, value }) => {
-  return /* @__PURE__ */ jsx(TabsContent, { value, className: "h-full overflow-hidden flex flex-col", children });
+  return /* @__PURE__ */ jsx(TabsContent, { value, className: "h-full overflow-auto flex flex-col", children });
 };
 
 const TracingRunOptions = () => {
@@ -9425,7 +9612,8 @@ function WorkflowInformation({ workflowId, initialRunId }) {
         stepsCount,
         " step",
         stepsCount > 1 ? "s" : ""
-      ] })
+      ] }),
+      workflow?.isProcessorWorkflow && /* @__PURE__ */ jsx(Badge, { icon: /* @__PURE__ */ jsx(Cpu, { className: "h-3 w-3" }), className: "bg-violet-500/20 text-violet-400", children: "Processor" })
     ] }) }),
     /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-hidden border-t-sm border-border1 flex flex-col", children: /* @__PURE__ */ jsxs(PlaygroundTabs, { defaultTab: "current-run", value: tab, onValueChange: setTab, children: [
       /* @__PURE__ */ jsxs(TabList$1, { children: [