@mastra/playground-ui 7.0.0-beta.24 → 7.0.0-beta.25

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, ShieldAlert, ChevronDown, ChevronRight, RefreshCw, Tag, InfoIcon as InfoIcon$1, AlertCircle, TriangleAlert, ChevronUpIcon, CheckCircleIcon, X, Share2, Check, Clock as Clock$1, PlayCircle, Workflow, Layers, List, CalendarClock, Timer, CornerDownRight, GitBranch, Repeat, Repeat1, Network, TriangleAlertIcon, XIcon, CalendarIcon, CircleAlertIcon, 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, ArrowRight, ArrowLeft, BrainIcon, AudioLinesIcon, StopCircleIcon, FileText, CircleXIcon, Link, CloudUpload, Mic, ArrowUp, SaveIcon, Info, ExternalLink, ArrowLeftIcon, ArrowRightIcon, ChevronsRightIcon, AlignLeftIcon, AlignJustifyIcon, ArrowUpIcon, ArrowDownIcon, ChevronRightIcon, GaugeIcon, ChevronsLeftRightEllipsisIcon, CalculatorIcon, HashIcon, FileInputIcon, FileOutputIcon, ReceiptText, RotateCcw, GripVertical, RefreshCcwIcon, AlertTriangleIcon, Copy, 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, PanelRightIcon, KeyboardIcon, CircleSlash, Trash, Link2, MoveRight } from 'lucide-react';
+import { CheckIcon as CheckIcon$1, CopyIcon, ShieldAlert, ChevronDown, ChevronRight, RefreshCw, Tag, InfoIcon as InfoIcon$1, AlertCircle, TriangleAlert, ChevronUpIcon, CheckCircleIcon, X, Share2, Check, Clock as Clock$1, PlayCircle, Workflow, Layers, List, CalendarClock, Timer, CornerDownRight, GitBranch, Repeat, Repeat1, Network, TriangleAlertIcon, XIcon, CalendarIcon, CircleAlertIcon, Braces, ChevronDownIcon, Brackets, PlusIcon, TrashIcon, Plus, Loader2, Circle, EyeOffIcon, EyeIcon, PauseIcon, HourglassIcon, CircleDashed, Footprints, CircleCheck, CircleX, Minus, Maximize, AlertCircleIcon, CirclePause, StopCircle, SearchIcon, Cpu, ChevronsUpDown, Search, ArrowRight, ArrowLeft, BrainIcon, AudioLinesIcon, StopCircleIcon, FileText, CircleXIcon, Link, CloudUpload, Mic, ArrowUp, SaveIcon, Info, ExternalLink, ArrowLeftIcon, ArrowRightIcon, ChevronsRightIcon, AlignLeftIcon, AlignJustifyIcon, ArrowUpIcon, ArrowDownIcon, ChevronRightIcon, GaugeIcon, ChevronsLeftRightEllipsisIcon, CalculatorIcon, HashIcon, FileInputIcon, FileOutputIcon, ReceiptText, RotateCcw, GripVertical, RefreshCcwIcon, AlertTriangleIcon, Copy, 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, PanelRightIcon, KeyboardIcon, CircleSlash, Trash, Link2, MoveRight } 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, useEffectEvent, Suspense, useLayoutEffect } from 'react';
 import { S as Shadows, G as Glows, B as BorderColors, C as Colors, a as Sizes, F as FontSizes, L as LineHeights, b as BorderRadius, c as Spacings } from './spacings-Ddc7umGk.js';
@@ -4306,6 +4306,36 @@ const AgentNetworkCoinIcon = (props) => /* @__PURE__ */ jsxs("svg", { width: "12
   ) }) })
 ] });
 
+function ProcessorIcon(props) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("rect", { width: "16", height: "16", x: "4", y: "4", rx: "2" }),
+        /* @__PURE__ */ jsx("rect", { width: "6", height: "6", x: "9", y: "9", rx: "1" }),
+        /* @__PURE__ */ jsx("path", { d: "M15 2v2" }),
+        /* @__PURE__ */ jsx("path", { d: "M15 20v2" }),
+        /* @__PURE__ */ jsx("path", { d: "M2 15h2" }),
+        /* @__PURE__ */ jsx("path", { d: "M2 9h2" }),
+        /* @__PURE__ */ jsx("path", { d: "M20 15h2" }),
+        /* @__PURE__ */ jsx("path", { d: "M20 9h2" }),
+        /* @__PURE__ */ jsx("path", { d: "M9 2v2" }),
+        /* @__PURE__ */ jsx("path", { d: "M9 20v2" })
+      ]
+    }
+  );
+}
+
 const variantClasses$1 = {
   warning: "bg-accent6Darker border-accent6/30 text-accent6",
   destructive: "bg-accent2Darker border-accent2/30 text-accent2",
@@ -4726,6 +4756,8 @@ function ToolCallProvider({
   children,
   approveToolcall,
   declineToolcall,
+  approveToolcallGenerate,
+  declineToolcallGenerate,
   approveNetworkToolcall,
   declineNetworkToolcall,
   isRunning,
@@ -4738,6 +4770,8 @@ function ToolCallProvider({
       value: {
         approveToolcall,
         declineToolcall,
+        approveToolcallGenerate,
+        declineToolcallGenerate,
         approveNetworkToolcall,
         declineNetworkToolcall,
         isRunning,
@@ -4761,11 +4795,14 @@ const ToolApprovalButtons = ({
   toolCallId,
   toolApprovalMetadata,
   toolName,
-  isNetwork
+  isNetwork,
+  isGenerateMode
 }) => {
   const {
     approveToolcall,
     declineToolcall,
+    approveToolcallGenerate,
+    declineToolcallGenerate,
     isRunning,
     toolCallApprovals,
     approveNetworkToolcall,
@@ -4775,6 +4812,8 @@ const ToolApprovalButtons = ({
   const handleApprove = () => {
     if (isNetwork) {
       approveNetworkToolcall(toolName, toolApprovalMetadata?.runId);
+    } else if (isGenerateMode) {
+      approveToolcallGenerate(toolCallId);
     } else {
       approveToolcall(toolCallId);
     }
@@ -4782,6 +4821,8 @@ const ToolApprovalButtons = ({
   const handleDecline = () => {
     if (isNetwork) {
       declineNetworkToolcall(toolName, toolApprovalMetadata?.runId);
+    } else if (isGenerateMode) {
+      declineToolcallGenerate(toolCallId);
     } else {
       declineToolcall(toolCallId);
     }
@@ -4883,7 +4924,8 @@ const ToolBadge = ({
             toolCallId,
             toolApprovalMetadata,
             toolName,
-            isNetwork
+            isNetwork,
+            isGenerateMode: metadata?.mode === "generate"
           }
         )
       ] })
@@ -4961,7 +5003,10 @@ const useWorkflows = () => {
   const { requestContext } = usePlaygroundStore();
   return useQuery({
     queryKey: ["workflows", requestContext],
-    queryFn: () => client.listWorkflows(requestContext)
+    queryFn: async () => {
+      const workflows = await client.listWorkflows(requestContext);
+      return Object.fromEntries(Object.entries(workflows).filter(([_, workflow]) => !workflow.isProcessorWorkflow));
+    }
   });
 };
 
@@ -8137,9 +8182,10 @@ const WorkflowInputData = ({
   isSubmitLoading,
   submitButtonLabel,
   onSubmit,
-  children
+  children,
+  isProcessorWorkflow
 }) => {
-  const [type, setType] = useState("form");
+  const [type, setType] = useState(isProcessorWorkflow ? "simple" : "form");
   return /* @__PURE__ */ jsxs("div", { children: [
     /* @__PURE__ */ jsx(
       RadioGroup,
@@ -8149,6 +8195,10 @@ const WorkflowInputData = ({
         onValueChange: (value) => setType(value),
         className: "pb-4",
         children: /* @__PURE__ */ jsxs("div", { className: "flex flex-row gap-4", children: [
+          isProcessorWorkflow && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ jsx(RadioGroupItem, { value: "simple", id: "simple" }),
+            /* @__PURE__ */ jsx(Label, { htmlFor: "simple", className: "!text-neutral3 text-ui-sm", children: "Simple" })
+          ] }),
           /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
             /* @__PURE__ */ jsx(RadioGroupItem, { value: "form", id: "form" }),
             /* @__PURE__ */ jsx(Label, { htmlFor: "form", className: "!text-neutral3 text-ui-sm", children: "Form" })
@@ -8166,7 +8216,18 @@ const WorkflowInputData = ({
         className: cn({
           "opacity-50 pointer-events-none": isSubmitLoading
         }),
-        children: type === "form" ? /* @__PURE__ */ jsx(
+        children: type === "simple" && isProcessorWorkflow ? /* @__PURE__ */ jsx(
+          SimpleProcessorInput,
+          {
+            schema,
+            defaultValues,
+            isSubmitLoading,
+            submitButtonLabel,
+            onSubmit,
+            withoutSubmit,
+            children
+          }
+        ) : type === "form" ? /* @__PURE__ */ jsx(
           DynamicForm,
           {
             schema,
@@ -8235,6 +8296,87 @@ const JSONInput = ({
     withoutSubmit ? null : /* @__PURE__ */ jsx(Button, { variant: "light", onClick: handleSubmit, className: "w-full", size: "lg", children: isSubmitLoading ? /* @__PURE__ */ jsx(Loader2, { className: "animate-spin" }) : submitButtonLabel })
   ] });
 };
+const PROCESSOR_PHASES = [
+  { value: "input", label: "Input - Process input messages before LLM" },
+  { value: "inputStep", label: "Input Step - Process at each agentic loop step" },
+  { value: "outputStream", label: "Output Stream - Process streaming chunks" },
+  { value: "outputResult", label: "Output Result - Process complete output" },
+  { value: "outputStep", label: "Output Step - Process after each LLM response" }
+];
+const SimpleProcessorInput = ({
+  schema,
+  defaultValues,
+  isSubmitLoading,
+  submitButtonLabel,
+  onSubmit,
+  withoutSubmit,
+  children
+}) => {
+  const [message, setMessage] = useState("Hello, this is a test message.");
+  const [phase, setPhase] = useState("input");
+  const [errors, setErrors] = useState([]);
+  const handleSubmit = () => {
+    setErrors([]);
+    const isOutputPhase = phase === "outputStep" || phase === "outputResult";
+    const messageRole = isOutputPhase ? "assistant" : "user";
+    const data = {
+      messages: [
+        {
+          id: crypto.randomUUID(),
+          role: messageRole,
+          createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+          content: {
+            format: 2,
+            parts: [{ type: "text", text: message }]
+          }
+        }
+      ],
+      phase
+    };
+    try {
+      const result = schema.safeParse(data);
+      if (!result.success) {
+        setErrors(result.error.issues.map((e) => `[${e.path.join(".")}] ${e.message}`));
+      } else {
+        onSubmit(result.data);
+      }
+    } catch (e) {
+      setErrors(["Error processing input"]);
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+    errors.length > 0 && /* @__PURE__ */ jsxs("div", { className: "border border-accent2 rounded-lg p-2", children: [
+      /* @__PURE__ */ jsxs(Txt, { as: "p", variant: "ui-md", className: "text-accent2 font-semibold", children: [
+        errors.length,
+        " errors found"
+      ] }),
+      /* @__PURE__ */ jsx("ul", { className: "list-disc list-inside", children: errors.map((error, idx) => /* @__PURE__ */ jsx("li", { className: "text-ui-sm text-accent2", children: error }, idx)) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx(Txt, { as: "label", variant: "ui-sm", className: "text-neutral3", children: "Phase" }),
+      /* @__PURE__ */ jsxs(Select, { value: phase, onValueChange: setPhase, children: [
+        /* @__PURE__ */ jsx(SelectTrigger, { className: "w-full", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select phase" }) }),
+        /* @__PURE__ */ jsx(SelectContent, { children: PROCESSOR_PHASES.map((p) => /* @__PURE__ */ jsx(SelectItem, { value: p.value, children: p.value }, p.value)) })
+      ] }),
+      /* @__PURE__ */ jsx(Txt, { variant: "ui-xs", className: "text-icon4", children: PROCESSOR_PHASES.find((p) => p.value === phase)?.label })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx(Txt, { as: "label", variant: "ui-sm", className: "text-neutral3", children: "Test Message" }),
+      /* @__PURE__ */ jsx(
+        "textarea",
+        {
+          value: message,
+          onChange: (e) => setMessage(e.target.value),
+          placeholder: "Enter a test message...",
+          rows: 4,
+          className: "w-full bg-transparent border border-border1 rounded-md p-3 text-ui-sm text-neutral6 placeholder:text-neutral3 focus:outline-none focus:ring-2 focus:ring-accent1"
+        }
+      )
+    ] }),
+    children,
+    withoutSubmit ? null : /* @__PURE__ */ jsx(Button, { variant: "light", onClick: handleSubmit, className: "w-full", size: "lg", children: isSubmitLoading ? /* @__PURE__ */ jsx(Loader2, { className: "animate-spin" }) : submitButtonLabel })
+  ] });
+};
 
 const formatJSON = async (code) => {
   const formatted = await prettier.format(code, {
@@ -9615,7 +9757,8 @@ function WorkflowTrigger({
             setPayload(data);
             handleExecuteWorkflow(data);
           },
-          withoutSubmit: !!paramsRunId
+          withoutSubmit: !!paramsRunId,
+          isProcessorWorkflow: workflow?.isProcessorWorkflow
         }
       ) : !!paramsRunId ? null : /* @__PURE__ */ jsx(
         Button,
@@ -10046,6 +10189,8 @@ const LinkComponentContext = createContext({
     networkThreadLink: () => "",
     scorerLink: () => "",
     toolLink: () => "",
+    processorsLink: () => "",
+    processorLink: () => "",
     mcpServerLink: () => "",
     mcpServerToolLink: () => "",
     workflowRunLink: () => ""
@@ -10062,7 +10207,7 @@ const useLinkComponent = () => {
   return ctx;
 };
 
-const columns$4 = [
+const columns$5 = [
   {
     id: "name",
     header: "Name",
@@ -10072,10 +10217,7 @@ const columns$4 = [
       return /* @__PURE__ */ jsx(
         EntryCell,
         {
-          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" })
-          ] }),
+          name: /* @__PURE__ */ jsx(Link, { href: paths.workflowLink(row.original.id), children: row.original.name }),
           description: workflow.description,
           meta: void 0
         }
@@ -10188,7 +10330,7 @@ function WorkflowTable({ workflows, isLoading }) {
   }, [workflows]);
   const table = useReactTable({
     data: workflowData,
-    columns: columns$4,
+    columns: columns$5,
     getCoreRowModel: getCoreRowModel()
   });
   const ths = table.getHeaderGroups()[0];
@@ -11081,7 +11223,8 @@ const WorkflowBadge = ({
             toolCallId,
             toolApprovalMetadata,
             toolName,
-            isNetwork
+            isNetwork,
+            isGenerateMode: metadata?.mode === "generate"
           }
         )
       ]
@@ -11185,7 +11328,8 @@ const AgentBadge = ({
             toolCallId,
             toolApprovalMetadata,
             toolName,
-            isNetwork
+            isNetwork,
+            isGenerateMode: metadata?.mode === "generate"
           }
         )
       ]
@@ -11253,8 +11397,8 @@ const ToolFallbackInner = ({ toolName, result, args, metadata, toolCallId, ...pr
   const isNetwork = metadata?.mode === "network";
   const agentToolName = toolName.startsWith("agent-") ? toolName.substring("agent-".length) : toolName;
   const workflowToolName = toolName.startsWith("workflow-") ? toolName.substring("workflow-".length) : toolName;
-  const requireApprovalMetadata = (metadata?.mode === "stream" || metadata?.mode === "network") && metadata?.requireApprovalMetadata;
-  const suspendedTools = (metadata?.mode === "stream" || metadata?.mode === "network") && metadata?.suspendedTools;
+  const requireApprovalMetadata = (metadata?.mode === "stream" || metadata?.mode === "network" || metadata?.mode === "generate") && metadata?.requireApprovalMetadata;
+  const suspendedTools = (metadata?.mode === "stream" || metadata?.mode === "network" || metadata?.mode === "generate") && metadata?.suspendedTools;
   const toolApprovalMetadata = requireApprovalMetadata ? requireApprovalMetadata?.[toolName] ?? requireApprovalMetadata?.[toolCallId] : void 0;
   const suspendedToolMetadata = suspendedTools ? suspendedTools?.[toolName] : void 0;
   const toolCalled = metadata?.mode === "network" && metadata?.hasMoreMessages ? true : void 0;
@@ -13000,6 +13144,8 @@ function MastraRuntimeProvider({
     setMessages,
     approveToolCall,
     declineToolCall,
+    approveToolCallGenerate,
+    declineToolCallGenerate,
     toolCallApprovals,
     approveNetworkToolCall,
     declineNetworkToolCall,
@@ -13451,6 +13597,8 @@ function MastraRuntimeProvider({
     {
       approveToolcall: approveToolCall,
       declineToolcall: declineToolCall,
+      approveToolcallGenerate: approveToolCallGenerate,
+      declineToolcallGenerate: declineToolCallGenerate,
       isRunning: isRunningStream,
       toolCallApprovals,
       approveNetworkToolcall: approveNetworkToolCall,
@@ -14054,7 +14202,7 @@ const AgentSettings = ({ agentId }) => {
   ] });
 };
 
-const NameCell$3 = ({ row }) => {
+const NameCell$4 = ({ row }) => {
   const { Link, paths } = useLinkComponent();
   return /* @__PURE__ */ jsx(
     EntryCell,
@@ -14064,11 +14212,11 @@ const NameCell$3 = ({ row }) => {
     }
   );
 };
-const columns$3 = [
+const columns$4 = [
   {
     header: "Name",
     accessorKey: "name",
-    cell: NameCell$3
+    cell: NameCell$4
   },
   {
     header: "Model",
@@ -14110,7 +14258,9 @@ const columns$3 = [
       const agentsCount = Object.keys(agent.agents || {}).length;
       const toolsCount = Object.keys(agent.tools || {}).length;
       const workflowsCount = Object.keys(agent.workflows || {}).length;
-      return /* @__PURE__ */ jsx(Cell, { children: /* @__PURE__ */ jsxs("span", { className: "flex flex-row gap-2 w-full items-center", children: [
+      const inputProcessorsCount = (agent.inputProcessors || []).length;
+      const outputProcessorsCount = (agent.outputProcessors || []).length;
+      return /* @__PURE__ */ jsx(Cell, { children: /* @__PURE__ */ jsxs("span", { className: "flex flex-row gap-2 w-full items-center flex-wrap", children: [
         /* @__PURE__ */ jsxs(Badge, { variant: "default", icon: /* @__PURE__ */ jsx(AgentIcon, { className: "text-accent1" }), children: [
           agentsCount,
           " agent",
@@ -14125,6 +14275,22 @@ const columns$3 = [
           workflowsCount,
           " workflow",
           workflowsCount > 1 ? "s" : ""
+        ] }),
+        (inputProcessorsCount > 0 || outputProcessorsCount > 0) && /* @__PURE__ */ jsxs(Tooltip, { children: [
+          /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Badge, { variant: "default", icon: /* @__PURE__ */ jsx(ProcessorIcon, { className: "text-accent4" }) }) }),
+          /* @__PURE__ */ jsxs(TooltipContent, { className: "flex flex-col gap-1", children: [
+            /* @__PURE__ */ jsx(
+              "a",
+              {
+                href: "https://mastra.ai/docs/agents/processors",
+                target: "_blank",
+                rel: "noopener noreferrer",
+                className: "text-accent1 hover:underline",
+                children: "Processors"
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "text-icon3", children: [inputProcessorsCount > 0 && "input", outputProcessorsCount > 0 && "output"].filter(Boolean).join(", ") })
+          ] })
         ] })
       ] }) });
     }
@@ -14137,7 +14303,7 @@ function AgentsTable({ agents, isLoading }) {
   const projectData = useMemo(() => Object.values(agents), [agents]);
   const table = useReactTable({
     data: projectData,
-    columns: columns$3,
+    columns: columns$4,
     getCoreRowModel: getCoreRowModel()
   });
   const ths = table.getHeaderGroups()[0];
@@ -15183,7 +15349,7 @@ function ScorerCombobox({
   );
 }
 
-const NameCell$2 = ({ row }) => {
+const NameCell$3 = ({ row }) => {
   const { Link, paths } = useLinkComponent();
   const scorer = row.original;
   return /* @__PURE__ */ jsx(
@@ -15194,11 +15360,11 @@ const NameCell$2 = ({ row }) => {
     }
   );
 };
-const columns$2 = [
+const columns$3 = [
   {
     header: "Name",
     accessorKey: "name",
-    cell: NameCell$2
+    cell: NameCell$3
   }
 ];
 
@@ -15217,7 +15383,7 @@ function ScorersTable({ scorers, isLoading }) {
   );
   const table = useReactTable({
     data: scorersData,
-    columns: columns$2,
+    columns: columns$3,
     getCoreRowModel: getCoreRowModel()
   });
   const ths = table.getHeaderGroups()[0];
@@ -16157,6 +16323,8 @@ const AgentMetadata = ({ agentId }) => {
   const tools = Object.keys(agentTools).map((key) => agentTools[key]);
   const agentWorkflows = agent.workflows ?? {};
   const workflows = Object.keys(agentWorkflows).map((key) => ({ id: key, ...agentWorkflows[key] }));
+  const inputProcessors = agent.inputProcessors ?? [];
+  const outputProcessors = agent.outputProcessors ?? [];
   return /* @__PURE__ */ jsxs(AgentMetadataWrapper, { children: [
     agent?.description && /* @__PURE__ */ jsx(AgentMetadataSection, { title: "Description", children: /* @__PURE__ */ jsx("p", { className: "text-sm text-neutral6", children: agent.description }) }),
     agent.modelList ? /* @__PURE__ */ jsx(AgentMetadataSection, { title: "Models", children: /* @__PURE__ */ jsx(
@@ -16250,6 +16418,17 @@ const AgentMetadata = ({ agentId }) => {
         children: /* @__PURE__ */ jsx(AgentMetadataWorkflowList, { workflows })
       }
     ),
+    (inputProcessors.length > 0 || outputProcessors.length > 0) && /* @__PURE__ */ jsx(
+      AgentMetadataSection,
+      {
+        title: "Processors",
+        hint: {
+          link: "https://mastra.ai/docs/agents/processors",
+          title: "Processors documentation"
+        },
+        children: /* @__PURE__ */ jsx(AgentMetadataCombinedProcessorList, { inputProcessors, outputProcessors })
+      }
+    ),
     /* @__PURE__ */ jsx(AgentMetadataSection, { title: "Scorers", children: /* @__PURE__ */ jsx(AgentMetadataScorerList, { entityId: agent.name, entityType: "AGENT" }) }),
     /* @__PURE__ */ jsx(AgentMetadataSection, { title: "System Prompt", children: /* @__PURE__ */ jsx(PromptEnhancer, { agentId }) })
   ] });
@@ -16286,6 +16465,21 @@ const AgentMetadataScorerList = ({ entityId, entityType }) => {
   }
   return /* @__PURE__ */ jsx(AgentMetadataList, { children: scorerList.map((scorer) => /* @__PURE__ */ jsx(AgentMetadataListItem, { children: /* @__PURE__ */ jsx(Link, { href: paths.scorerLink(scorer.id), "data-testid": "scorer-badge", children: /* @__PURE__ */ jsx(Badge, { icon: /* @__PURE__ */ jsx(GaugeIcon, { className: "text-neutral3" }), children: scorer.scorer.config.name }) }) }, scorer.id)) });
 };
+const AgentMetadataCombinedProcessorList = ({
+  inputProcessors,
+  outputProcessors
+}) => {
+  const { Link, paths } = useLinkComponent();
+  if (inputProcessors.length === 0 && outputProcessors.length === 0) {
+    return /* @__PURE__ */ jsx(AgentMetadataListEmpty, { children: "No processors" });
+  }
+  const inputProcessorId = inputProcessors[0]?.id;
+  const outputProcessorId = outputProcessors[0]?.id;
+  return /* @__PURE__ */ jsxs(AgentMetadataList, { children: [
+    inputProcessors.length > 0 && inputProcessorId && /* @__PURE__ */ jsx(AgentMetadataListItem, { children: /* @__PURE__ */ jsx(Link, { href: `${paths.workflowLink(inputProcessorId)}/graph`, "data-testid": "processor-badge", children: /* @__PURE__ */ jsx(Badge, { icon: /* @__PURE__ */ jsx(ProcessorIcon, { className: "text-accent4" }), children: "input" }) }) }),
+    outputProcessors.length > 0 && outputProcessorId && /* @__PURE__ */ jsx(AgentMetadataListItem, { children: /* @__PURE__ */ jsx(Link, { href: `${paths.workflowLink(outputProcessorId)}/graph`, "data-testid": "processor-badge", children: /* @__PURE__ */ jsx(Badge, { icon: /* @__PURE__ */ jsx(ProcessorIcon, { className: "text-accent5" }), children: "output" }) }) })
+  ] });
+};
 
 const AgentEntityHeader = ({ agentId }) => {
   const { data: agent, isLoading } = useAgent(agentId);
@@ -17485,6 +17679,320 @@ const AgentLayout = ({ agentId, children, leftSlot, rightSlot }) => {
   ] });
 };
 
+const NameCell$2 = ({ row }) => {
+  const { Link, paths } = useLinkComponent();
+  const processor = row.original;
+  return /* @__PURE__ */ jsx(
+    EntryCell,
+    {
+      name: /* @__PURE__ */ jsx(Link, { className: "w-full space-y-0", href: paths.processorLink(processor.id), children: processor.name || processor.id }),
+      description: processor.description
+    }
+  );
+};
+const PhasesCell = ({ row }) => {
+  const processor = row.original;
+  const phases = processor.phases || [];
+  const phaseLabels = {
+    input: "Input",
+    inputStep: "Input Step",
+    outputStream: "Output Stream",
+    outputResult: "Output Result",
+    outputStep: "Output Step"
+  };
+  return /* @__PURE__ */ jsx(Cell, { children: /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1", children: phases.map((phase) => /* @__PURE__ */ jsx(Badge, { variant: "default", children: phaseLabels[phase] || phase }, phase)) }) });
+};
+const AgentsCell = ({ row }) => {
+  const processor = row.original;
+  const agentsCount = processor.agentIds?.length || 0;
+  return /* @__PURE__ */ jsx(Cell, { children: /* @__PURE__ */ jsxs(Badge, { variant: "default", icon: /* @__PURE__ */ jsx(AgentIcon, { className: "text-accent1" }), children: [
+    agentsCount,
+    " agent",
+    agentsCount !== 1 ? "s" : ""
+  ] }) });
+};
+const columns$2 = [
+  {
+    header: "Name",
+    accessorKey: "name",
+    cell: NameCell$2
+  },
+  {
+    header: "Phases",
+    accessorKey: "phases",
+    cell: PhasesCell
+  },
+  {
+    header: "Used by",
+    accessorKey: "agentIds",
+    cell: AgentsCell
+  }
+];
+
+function ProcessorTable({ processors, isLoading }) {
+  const [search, setSearch] = useState("");
+  const { navigate, paths } = useLinkComponent();
+  const processorData = useMemo(() => {
+    return Object.values(processors ?? {}).filter((p) => p.phases && p.phases.length > 0);
+  }, [processors]);
+  const table = useReactTable({
+    data: processorData,
+    columns: columns$2,
+    getCoreRowModel: getCoreRowModel()
+  });
+  const ths = table.getHeaderGroups()[0];
+  const rows = table.getRowModel().rows.concat();
+  if (rows.length === 0 && !isLoading) {
+    return /* @__PURE__ */ jsx(EmptyProcessorsTable, {});
+  }
+  const filteredRows = rows.filter((row) => {
+    const id = row.original.id.toLowerCase();
+    const name = (row.original.name || "").toLowerCase();
+    const searchLower = search.toLowerCase();
+    return id.includes(searchLower) || name.includes(searchLower);
+  });
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(SearchbarWrapper, { children: /* @__PURE__ */ jsx(Searchbar, { onSearch: setSearch, label: "Search processors", placeholder: "Search processors" }) }),
+    isLoading ? /* @__PURE__ */ jsx(ProcessorTableSkeleton, {}) : /* @__PURE__ */ jsx(ScrollableContainer, { children: /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsxs(Table, { children: [
+      /* @__PURE__ */ jsx(Thead, { className: "sticky top-0", children: ths.headers.map((header) => /* @__PURE__ */ jsx(Th, { style: { width: header.column.getSize() ?? "auto" }, children: flexRender(header.column.columnDef.header, header.getContext()) }, header.id)) }),
+      /* @__PURE__ */ jsx(Tbody, { children: filteredRows.map((row) => {
+        return /* @__PURE__ */ jsx(
+          Row,
+          {
+            onClick: () => {
+              if (row.original.isWorkflow) {
+                navigate(paths.workflowLink(row.original.id) + "/graph");
+              } else {
+                navigate(paths.processorLink(row.original.id));
+              }
+            },
+            children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx(React__default.Fragment, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))
+          },
+          row.id
+        );
+      }) })
+    ] }) }) })
+  ] });
+}
+const ProcessorTableSkeleton = () => /* @__PURE__ */ jsxs(Table, { children: [
+  /* @__PURE__ */ jsxs(Thead, { children: [
+    /* @__PURE__ */ jsx(Th, { children: "Name" }),
+    /* @__PURE__ */ jsx(Th, { children: "Phases" }),
+    /* @__PURE__ */ jsx(Th, { children: "Used by" })
+  ] }),
+  /* @__PURE__ */ jsx(Tbody, { children: Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ jsxs(Row, { children: [
+    /* @__PURE__ */ jsx(Cell, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-1/2" }) }),
+    /* @__PURE__ */ jsx(Cell, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-1/2" }) }),
+    /* @__PURE__ */ jsx(Cell, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-1/2" }) })
+  ] }, index)) })
+] });
+const EmptyProcessorsTable = () => /* @__PURE__ */ jsx("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ jsx(
+  EmptyState,
+  {
+    iconSlot: /* @__PURE__ */ jsx(Cpu, {}),
+    titleSlot: "Configure Processors",
+    descriptionSlot: "No processors are configured yet. Add input or output processors to your agents to transform messages.",
+    actionSlot: /* @__PURE__ */ jsxs(
+      Button,
+      {
+        size: "lg",
+        className: "w-full",
+        variant: "light",
+        as: "a",
+        href: "https://mastra.ai/en/docs/processors",
+        target: "_blank",
+        children: [
+          /* @__PURE__ */ jsx(Icon, { children: /* @__PURE__ */ jsx(Cpu, {}) }),
+          "Docs"
+        ]
+      }
+    )
+  }
+) });
+
+const useProcessors = () => {
+  const { requestContext } = usePlaygroundStore();
+  const client = useMastraClient();
+  return useQuery({
+    queryKey: ["processors"],
+    queryFn: () => client.listProcessors(requestContext)
+  });
+};
+const useProcessor = (processorId, options) => {
+  const client = useMastraClient();
+  const { requestContext } = usePlaygroundStore();
+  return useQuery({
+    queryKey: ["processor", processorId],
+    queryFn: () => client.getProcessor(processorId).details(requestContext),
+    enabled: options?.enabled !== false && !!processorId
+  });
+};
+const useExecuteProcessor = () => {
+  const client = useMastraClient();
+  const { requestContext } = usePlaygroundStore();
+  return useMutation({
+    mutationFn: async ({
+      processorId,
+      phase,
+      messages,
+      agentId
+    }) => {
+      return client.getProcessor(processorId).execute({
+        phase,
+        messages,
+        agentId,
+        requestContext
+      });
+    }
+  });
+};
+
+const PHASE_LABELS = {
+  input: "Input - Process input messages before LLM (once at start)",
+  inputStep: "Input Step - Process at each agentic loop step",
+  outputStream: "Output Stream - Process streaming chunks",
+  outputResult: "Output Result - Process complete output after streaming",
+  outputStep: "Output Step - Process after each LLM response (before tools)"
+};
+function ProcessorPanel({ processorId }) {
+  const { data: processor, isLoading, error } = useProcessor(processorId);
+  useEffect(() => {
+    if (error) {
+      const errorMessage = error instanceof Error ? error.message : "Failed to load processor";
+      toast.error(`Error loading processor: ${errorMessage}`);
+    }
+  }, [error]);
+  if (isLoading) {
+    return /* @__PURE__ */ jsxs("div", { className: "p-6", children: [
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-48 mb-4" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-32 w-full" })
+    ] });
+  }
+  if (error) return null;
+  if (!processor)
+    return /* @__PURE__ */ jsx("div", { className: "py-12 text-center px-6", children: /* @__PURE__ */ jsx(Txt, { variant: "header-md", className: "text-neutral3", children: "Processor not found" }) });
+  return /* @__PURE__ */ jsx(ProcessorDetailPanel, { processor });
+}
+function ProcessorDetailPanel({ processor }) {
+  const theme = useCodemirrorTheme$1();
+  const formId = useId();
+  const [selectedPhase, setSelectedPhase] = useState(processor.phases[0] || "input");
+  const [selectedAgentId, setSelectedAgentId] = useState(processor.configurations[0]?.agentId || "");
+  const [testMessage, setTestMessage] = useState("Hello, this is a test message.");
+  const [result, setResult] = useState(null);
+  const [errorString, setErrorString] = useState();
+  const executeProcessor = useExecuteProcessor();
+  const handleExecute = async () => {
+    setErrorString(void 0);
+    setResult(null);
+    const isOutputPhase = selectedPhase === "outputStep" || selectedPhase === "outputResult";
+    const messageRole = isOutputPhase ? "assistant" : "user";
+    const messages = [
+      {
+        id: crypto.randomUUID(),
+        role: messageRole,
+        createdAt: /* @__PURE__ */ new Date(),
+        content: {
+          format: 2,
+          parts: [{ type: "text", text: testMessage }]
+        }
+      }
+    ];
+    try {
+      const response = await executeProcessor.mutateAsync({
+        processorId: processor.id,
+        phase: selectedPhase,
+        messages,
+        agentId: selectedAgentId || void 0
+      });
+      setResult(response);
+      if (!response.success && response.error) {
+        setErrorString(response.error);
+      }
+    } catch (error) {
+      setErrorString(error.message || "An error occurred");
+    }
+  };
+  const resultCode = result ? JSON.stringify(result, null, 2) : "{}";
+  return /* @__PURE__ */ jsxs(MainContentContent, { hasLeftServiceColumn: true, className: "relative", children: [
+    /* @__PURE__ */ jsxs("div", { className: "bg-surface2 border-r border-border1 w-[22rem] overflow-y-auto", children: [
+      /* @__PURE__ */ jsx(ProcessorInformation, { processor }),
+      /* @__PURE__ */ jsxs("div", { className: "p-5 space-y-5", children: [
+        /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx(Txt, { as: "label", variant: "ui-sm", className: "text-icon3", children: "Phase" }),
+          /* @__PURE__ */ jsxs(Select, { value: selectedPhase, onValueChange: (v) => setSelectedPhase(v), children: [
+            /* @__PURE__ */ jsx(SelectTrigger, { className: "w-full", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select phase" }) }),
+            /* @__PURE__ */ jsx(SelectContent, { children: processor.phases.map((phase) => /* @__PURE__ */ jsx(SelectItem, { value: phase, children: phase }, phase)) })
+          ] }),
+          /* @__PURE__ */ jsx(Txt, { variant: "ui-xs", className: "text-icon4", children: PHASE_LABELS[selectedPhase] })
+        ] }),
+        processor.configurations.length > 1 && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx(Txt, { as: "label", variant: "ui-sm", className: "text-icon3", children: "Agent Configuration" }),
+          /* @__PURE__ */ jsxs(Select, { value: selectedAgentId, onValueChange: setSelectedAgentId, children: [
+            /* @__PURE__ */ jsx(SelectTrigger, { className: "w-full", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select agent" }) }),
+            /* @__PURE__ */ jsx(SelectContent, { children: processor.configurations.map((config) => /* @__PURE__ */ jsxs(SelectItem, { value: config.agentId, children: [
+              config.agentName,
+              " (",
+              config.type,
+              ")"
+            ] }, config.agentId)) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx(Txt, { as: "label", htmlFor: formId, variant: "ui-sm", className: "text-icon3", children: "Test Message" }),
+          /* @__PURE__ */ jsx(
+            "textarea",
+            {
+              id: formId,
+              value: testMessage,
+              onChange: (e) => setTestMessage(e.target.value),
+              placeholder: "Enter a test message...",
+              rows: 4,
+              className: "w-full bg-transparent border border-border1 rounded-md p-3 text-ui-sm text-neutral6 placeholder:text-neutral3 focus:outline-none focus:ring-2 focus:ring-accent1"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            onClick: handleExecute,
+            disabled: executeProcessor.isPending || selectedPhase === "outputStream",
+            className: "w-full",
+            children: executeProcessor.isPending ? "Running..." : "Run Processor"
+          }
+        ),
+        selectedPhase === "outputStream" && /* @__PURE__ */ jsx(Txt, { variant: "ui-xs", className: "text-accent6", children: "Output Stream phase cannot be executed directly. Use streaming instead." }),
+        result && /* @__PURE__ */ jsxs("div", { className: "space-y-2 pt-4 border-t border-border1", children: [
+          /* @__PURE__ */ jsx(Txt, { variant: "ui-sm", className: "text-icon3", children: "Status" }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx(Badge, { variant: result.success ? "success" : "error", children: result.success ? "Success" : "Failed" }),
+            result.tripwire?.triggered && /* @__PURE__ */ jsx(Badge, { variant: "info", children: "Tripwire Triggered" })
+          ] }),
+          result.tripwire?.triggered && result.tripwire.reason && /* @__PURE__ */ jsxs("div", { className: "mt-2 p-3 bg-accent6Dark rounded-md border border-accent6/20", children: [
+            /* @__PURE__ */ jsx(Txt, { variant: "ui-sm", className: "text-accent6 font-medium", children: "Tripwire Reason" }),
+            /* @__PURE__ */ jsx(Txt, { variant: "ui-sm", className: "text-icon3 mt-1", children: result.tripwire.reason })
+          ] })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 z-10", children: /* @__PURE__ */ jsx(CopyButton, { content: resultCode, tooltip: "Copy JSON result to clipboard" }) }),
+    /* @__PURE__ */ jsx("div", { className: "p-5 h-full relative overflow-x-auto overflow-y-auto", children: /* @__PURE__ */ jsx(CodeMirror, { value: errorString || resultCode, editable: true, theme, extensions: [jsonLanguage] }) })
+  ] });
+}
+function ProcessorInformation({ processor }) {
+  return /* @__PURE__ */ jsxs("div", { className: "px-5 pt-5 pb-4 border-b border-border1", children: [
+    /* @__PURE__ */ jsx(Txt, { variant: "header-md", className: "text-icon1 mb-2", children: processor.name || processor.id }),
+    processor.name && processor.name !== processor.id && /* @__PURE__ */ jsx(Txt, { variant: "ui-sm", className: "text-icon4 mb-3", children: processor.id }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1 mt-3", children: processor.phases.map((phase) => /* @__PURE__ */ jsx(Badge, { variant: "default", children: phase }, phase)) }),
+    /* @__PURE__ */ jsx("div", { className: "mt-3", children: /* @__PURE__ */ jsxs(Txt, { variant: "ui-xs", className: "text-icon4", children: [
+      "Attached to ",
+      processor.configurations.length,
+      " agent",
+      processor.configurations.length !== 1 ? "s" : ""
+    ] }) })
+  ] });
+}
+
 const NameCell$1 = ({ row }) => {
   const { Link, paths } = useLinkComponent();
   const tool = row.original;
@@ -21589,5 +22097,5 @@ const useMastraPlatform = () => {
   return { isMastraPlatform, mastraPlatformEndpoint };
 };
 
-export { AgentChat, AgentCoinIcon, AgentCombobox, AgentEntityHeader, AgentIcon, AgentInformation, AgentInformationLayout, AgentInformationTabLayout, AgentLayout, AgentMemory, AgentMetadata, AgentMetadataList, AgentMetadataListEmpty, AgentMetadataListItem, AgentMetadataNetworkList, AgentMetadataScorerList, AgentMetadataSection, AgentMetadataToolList, AgentMetadataWorkflowList, AgentMetadataWrapper, AgentNetworkCoinIcon, AgentPromptExperimentProvider, AgentSettings, AgentSettingsContext, AgentSettingsProvider, AgentToolPanel, AgentsTable, AiIcon, Alert, AlertDescription, AlertDialog, AlertTitle, ApiIcon, AutoForm, Avatar, Badge, BranchIcon, Breadcrumb, Button, ButtonsGroup, Cell, ChatThreads, CheckIcon, Checkbox, ChevronIcon, CodeEditor, Collapsible, CollapsibleContent, CollapsibleTrigger, CombinedButtons, Combobox, CommitIcon, CopyButton, CrossIcon, Crumb, DatePicker, DateTimeCell, DateTimePicker, DateTimePickerContent, DbIcon, DebugIcon, DefaultTrigger, DeploymentIcon, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DividerIcon, DocsIcon, DynamicForm, ElementSelect, EmptyState, Entity, EntityContent, EntityDescription, EntityHeader, EntityIcon, EntityName, Entry, EntryCell, EntryList, EntryListSkeleton, EnvIcon, FiltersIcon, FolderIcon, GithubCoinIcon, GithubIcon, GoogleIcon, Header, HeaderAction, HeaderGroup, HeaderTitle, HomeIcon, Icon, InfoIcon, Input, InputField, JudgeIcon, Kbd, KeyValueList, Label, LatencyIcon, LinkComponentProvider, LogoWithoutText, LogsIcon, MCPDetail, MCPServerCombobox, MCPTable, MCPToolPanel, MainContentContent, MainContentLayout, MainSidebar, MainSidebarProvider, MarkdownRenderer, MastraPackagesInfo, MastraVersionFooter, McpCoinIcon, McpServerIcon, MemoryIcon, MemorySearch, Notification, OpenAIIcon, PageHeader, PlaygroundConfigGuard, PlaygroundQueryClient, Popover, PopoverContent, PopoverTrigger, ProcessStepList, ProcessStepListItem, ProcessStepProgressBar, PromptIcon, RadioGroup, RadioGroupItem, RepoIcon, RequestContext, RequestContextWrapper, Row, ScoreDialog, ScorerCombobox, ScorersTable, ScoresList, ScoresTools, ScrollArea, ScrollBar, SearchField, Searchbar, SearchbarWrapper, Section, Sections, Select, SelectContent, SelectField$1 as SelectField, SelectGroup, SelectItem, SelectTrigger, SelectValue, SettingsIcon, ShadcnAutoFormFieldComponents, SideDialog, Skeleton, SlashIcon, Slider, SpanScoreList, SpanScoring, SpanTabs, Spinner, StudioConfigContext, StudioConfigForm, StudioConfigProvider, Switch, Tab, TabContent, TabList, Table, Tabs, Tbody, TemplateFailure, TemplateForm, TemplateInfo, TemplateInstallation, TemplateSuccess, TemplatesList, TemplatesTools, TextAndIcon, Th, Thead, ThreadDeleteButton, ThreadInputProvider, ThreadItem, ThreadLink, ThreadList, Threads, TimePicker, ToolCoinIcon, ToolCombobox, ToolFallback, ToolIconMap, ToolInformation, ToolPanel, ToolTable, ToolsIcon, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TraceDialog, TraceIcon, TraceTimeline, TraceTimelineSpan, TraceTimelineTools, TracesList, TracesTools, TracingSettingsContext, TracingSettingsProvider, TsIcon, Txt, TxtCell, VariablesIcon, WorkflowCoinIcon, WorkflowCombobox, WorkflowGraph, WorkflowIcon, WorkflowInformation, WorkflowLayout, WorkflowRunContext, WorkflowRunDetail, WorkflowRunList, WorkflowRunProvider, WorkflowStepDetailContext, WorkflowStepDetailProvider, WorkflowTable, WorkflowTrigger, WorkingMemoryContext, WorkingMemoryProvider, buttonVariants, cn, convertWorkflowRunStateToStreamResult, extractPrompt, fieldConfig, formatHierarchicalSpans, getColumnTemplate, getMainContentContentClassName, getShortId, getSpanTypeUi, getStatusIcon, getToNextEntryFn, getToPreviousEntryFn, highlight, inputVariants, parseError, providerMapToIcon, removeEmptyValues, resolveSerializedZodOutput, scoresListColumns, spanTypePrefixes, toast, traceScoresListColumns, tracesListColumns, useAgent, useAgentInformationSettings, useAgentInformationTab, useAgentPromptExperiment, useAgentSettings, useAgents, useCancelWorkflowRun, useCloneThread, useCodemirrorTheme$1 as useCodemirrorTheme, useCurrentRun, useDeleteThread, useDeleteWorkflowRun, useExecuteAgentTool, useExecuteMCPTool, useExecuteTool, useExecuteWorkflow, useInView, useLinkComponent, useMCPServerTool, useMCPServerTools, useMCPServers, useMainSidebar, useMastraPackages, useMastraPlatform, useMemory, useMemoryConfig, useMemorySearch, usePackageUpdates, usePlaygroundStore, useReorderModelList, useResetAgentModel, useScorer, useScorers, useScoresByScorerId, useSpeechRecognition, useStreamWorkflow, useStudioConfig, useThreadInput, useThreads, useTool, useTools, useTraceSpanScores, useTracingSettings, useUpdateAgentModel, useUpdateModelInModelList, useWorkflow, useWorkflowRun, useWorkflowRuns, useWorkflowStepDetail, useWorkflows, useWorkingMemory };
+export { AgentChat, AgentCoinIcon, AgentCombobox, AgentEntityHeader, AgentIcon, AgentInformation, AgentInformationLayout, AgentInformationTabLayout, AgentLayout, AgentMemory, AgentMetadata, AgentMetadataCombinedProcessorList, AgentMetadataList, AgentMetadataListEmpty, AgentMetadataListItem, AgentMetadataNetworkList, AgentMetadataScorerList, AgentMetadataSection, AgentMetadataToolList, AgentMetadataWorkflowList, AgentMetadataWrapper, AgentNetworkCoinIcon, AgentPromptExperimentProvider, AgentSettings, AgentSettingsContext, AgentSettingsProvider, AgentToolPanel, AgentsTable, AiIcon, Alert, AlertDescription, AlertDialog, AlertTitle, ApiIcon, AutoForm, Avatar, Badge, BranchIcon, Breadcrumb, Button, ButtonsGroup, Cell, ChatThreads, CheckIcon, Checkbox, ChevronIcon, CodeEditor, Collapsible, CollapsibleContent, CollapsibleTrigger, CombinedButtons, Combobox, CommitIcon, CopyButton, CrossIcon, Crumb, DatePicker, DateTimeCell, DateTimePicker, DateTimePickerContent, DbIcon, DebugIcon, DefaultTrigger, DeploymentIcon, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DividerIcon, DocsIcon, DynamicForm, ElementSelect, EmptyState, Entity, EntityContent, EntityDescription, EntityHeader, EntityIcon, EntityName, Entry, EntryCell, EntryList, EntryListSkeleton, EnvIcon, FiltersIcon, FolderIcon, GithubCoinIcon, GithubIcon, GoogleIcon, Header, HeaderAction, HeaderGroup, HeaderTitle, HomeIcon, Icon, InfoIcon, Input, InputField, JudgeIcon, Kbd, KeyValueList, Label, LatencyIcon, LinkComponentProvider, LogoWithoutText, LogsIcon, MCPDetail, MCPServerCombobox, MCPTable, MCPToolPanel, MainContentContent, MainContentLayout, MainSidebar, MainSidebarProvider, MarkdownRenderer, MastraPackagesInfo, MastraVersionFooter, McpCoinIcon, McpServerIcon, MemoryIcon, MemorySearch, Notification, OpenAIIcon, PageHeader, PlaygroundConfigGuard, PlaygroundQueryClient, Popover, PopoverContent, PopoverTrigger, ProcessStepList, ProcessStepListItem, ProcessStepProgressBar, ProcessorIcon, ProcessorPanel, ProcessorTable, PromptIcon, RadioGroup, RadioGroupItem, RepoIcon, RequestContext, RequestContextWrapper, Row, ScoreDialog, ScorerCombobox, ScorersTable, ScoresList, ScoresTools, ScrollArea, ScrollBar, SearchField, Searchbar, SearchbarWrapper, Section, Sections, Select, SelectContent, SelectField$1 as SelectField, SelectGroup, SelectItem, SelectTrigger, SelectValue, SettingsIcon, ShadcnAutoFormFieldComponents, SideDialog, Skeleton, SlashIcon, Slider, SpanScoreList, SpanScoring, SpanTabs, Spinner, StudioConfigContext, StudioConfigForm, StudioConfigProvider, Switch, Tab, TabContent, TabList, Table, Tabs, Tbody, TemplateFailure, TemplateForm, TemplateInfo, TemplateInstallation, TemplateSuccess, TemplatesList, TemplatesTools, TextAndIcon, Th, Thead, ThreadDeleteButton, ThreadInputProvider, ThreadItem, ThreadLink, ThreadList, Threads, TimePicker, ToolCoinIcon, ToolCombobox, ToolFallback, ToolIconMap, ToolInformation, ToolPanel, ToolTable, ToolsIcon, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TraceDialog, TraceIcon, TraceTimeline, TraceTimelineSpan, TraceTimelineTools, TracesList, TracesTools, TracingSettingsContext, TracingSettingsProvider, TsIcon, Txt, TxtCell, VariablesIcon, WorkflowCoinIcon, WorkflowCombobox, WorkflowGraph, WorkflowIcon, WorkflowInformation, WorkflowLayout, WorkflowRunContext, WorkflowRunDetail, WorkflowRunList, WorkflowRunProvider, WorkflowStepDetailContext, WorkflowStepDetailProvider, WorkflowTable, WorkflowTrigger, WorkingMemoryContext, WorkingMemoryProvider, buttonVariants, cn, columns$2 as columns, convertWorkflowRunStateToStreamResult, extractPrompt, fieldConfig, formatHierarchicalSpans, getColumnTemplate, getMainContentContentClassName, getShortId, getSpanTypeUi, getStatusIcon, getToNextEntryFn, getToPreviousEntryFn, highlight, inputVariants, parseError, providerMapToIcon, removeEmptyValues, resolveSerializedZodOutput, scoresListColumns, spanTypePrefixes, toast, traceScoresListColumns, tracesListColumns, useAgent, useAgentInformationSettings, useAgentInformationTab, useAgentPromptExperiment, useAgentSettings, useAgents, useCancelWorkflowRun, useCloneThread, useCodemirrorTheme$1 as useCodemirrorTheme, useCurrentRun, useDeleteThread, useDeleteWorkflowRun, useExecuteAgentTool, useExecuteMCPTool, useExecuteProcessor, useExecuteTool, useExecuteWorkflow, useInView, useLinkComponent, useMCPServerTool, useMCPServerTools, useMCPServers, useMainSidebar, useMastraPackages, useMastraPlatform, useMemory, useMemoryConfig, useMemorySearch, usePackageUpdates, usePlaygroundStore, useProcessor, useProcessors, useReorderModelList, useResetAgentModel, useScorer, useScorers, useScoresByScorerId, useSpeechRecognition, useStreamWorkflow, useStudioConfig, useThreadInput, useThreads, useTool, useTools, useTraceSpanScores, useTracingSettings, useUpdateAgentModel, useUpdateModelInModelList, useWorkflow, useWorkflowRun, useWorkflowRuns, useWorkflowStepDetail, useWorkflows, useWorkingMemory };
 //# sourceMappingURL=index.es.js.map