@mastra/playground-ui 14.0.0 → 15.0.0

package/CHANGELOG.md

@@ -1,5 +1,43 @@
 # @mastra/playground-ui
 
+## 15.0.0
+
+### Minor Changes
+
+- Update peer dependencies to match core package version bump (1.5.0) ([#13323](https://github.com/mastra-ai/mastra/pull/13323))
+
+### Patch Changes
+
+- Target type and target ID fields in the experiment dialog are now searchable dropdowns. Scorers can be selected via a multi-select dropdown. All three dropdowns share a consistent searchable style and visual behavior. ([#13463](https://github.com/mastra-ai/mastra/pull/13463))
+
+- Show completion result UI for supervisor pattern delegations. Previously, completion check results were only displayed when `metadata.mode === 'network'`. Now they display for any response that includes `completionResult` metadata, supporting the new supervisor pattern. ([#13323](https://github.com/mastra-ai/mastra/pull/13323))
+
+- Updated dependencies [[`df170fd`](https://github.com/mastra-ai/mastra/commit/df170fd139b55f845bfd2de8488b16435bd3d0da), [`ae55343`](https://github.com/mastra-ai/mastra/commit/ae5534397fc006fd6eef3e4f80c235bcdc9289ef), [`c290cec`](https://github.com/mastra-ai/mastra/commit/c290cec5bf9107225de42942b56b487107aa9dce), [`f03e794`](https://github.com/mastra-ai/mastra/commit/f03e794630f812b56e95aad54f7b1993dc003add), [`aa4a5ae`](https://github.com/mastra-ai/mastra/commit/aa4a5aedb80d8d6837bab8cbb2e301215d1ba3e9), [`de3f584`](https://github.com/mastra-ai/mastra/commit/de3f58408752a8d80a295275c7f23fc306cf7f4f), [`d3fb010`](https://github.com/mastra-ai/mastra/commit/d3fb010c98f575f1c0614452667396e2653815f6), [`702ee1c`](https://github.com/mastra-ai/mastra/commit/702ee1c41be67cc532b4dbe89bcb62143508f6f0), [`f495051`](https://github.com/mastra-ai/mastra/commit/f495051eb6496a720f637fc85b6d69941c12554c), [`b8f636a`](https://github.com/mastra-ai/mastra/commit/b8f636a83c5260a9817eec97c202b7ca7d613524), [`e622f1d`](https://github.com/mastra-ai/mastra/commit/e622f1d3ab346a8e6aca6d1fe2eac99bd961e50b), [`8d14a59`](https://github.com/mastra-ai/mastra/commit/8d14a591d46fbbbe81baa33c9c267d596f790329), [`114e7c1`](https://github.com/mastra-ai/mastra/commit/114e7c146ac682925f0fb37376c1be70e5d6e6e5), [`861f111`](https://github.com/mastra-ai/mastra/commit/861f11189211b20ddb70d8df81a6b901fc78d11e), [`00f43e8`](https://github.com/mastra-ai/mastra/commit/00f43e8e97a80c82b27d5bd30494f10a715a1df9), [`1b6f651`](https://github.com/mastra-ai/mastra/commit/1b6f65127d4a0d6c38d0a1055cb84527db529d6b), [`96a1702`](https://github.com/mastra-ai/mastra/commit/96a1702ce362c50dda20c8b4a228b4ad1a36a17a), [`cb9f921`](https://github.com/mastra-ai/mastra/commit/cb9f921320913975657abb1404855d8c510f7ac5), [`114e7c1`](https://github.com/mastra-ai/mastra/commit/114e7c146ac682925f0fb37376c1be70e5d6e6e5), [`114e7c1`](https://github.com/mastra-ai/mastra/commit/114e7c146ac682925f0fb37376c1be70e5d6e6e5), [`114e7c1`](https://github.com/mastra-ai/mastra/commit/114e7c146ac682925f0fb37376c1be70e5d6e6e5), [`1b6f651`](https://github.com/mastra-ai/mastra/commit/1b6f65127d4a0d6c38d0a1055cb84527db529d6b), [`72df4a8`](https://github.com/mastra-ai/mastra/commit/72df4a8f9bf1a20cfd3d9006a4fdb597ad56d10a)]:
+  - @mastra/core@1.8.0
+  - @mastra/ai-sdk@1.1.0
+  - @mastra/schema-compat@1.1.3
+  - @mastra/react@0.2.7
+  - @mastra/client-js@1.7.1
+
+## 15.0.0-alpha.0
+
+### Minor Changes
+
+- Update peer dependencies to match core package version bump (1.5.0) ([#13323](https://github.com/mastra-ai/mastra/pull/13323))
+
+### Patch Changes
+
+- Target type and target ID fields in the experiment dialog are now searchable dropdowns. Scorers can be selected via a multi-select dropdown. All three dropdowns share a consistent searchable style and visual behavior. ([#13463](https://github.com/mastra-ai/mastra/pull/13463))
+
+- Show completion result UI for supervisor pattern delegations. Previously, completion check results were only displayed when `metadata.mode === 'network'`. Now they display for any response that includes `completionResult` metadata, supporting the new supervisor pattern. ([#13323](https://github.com/mastra-ai/mastra/pull/13323))
+
+- Updated dependencies [[`df170fd`](https://github.com/mastra-ai/mastra/commit/df170fd139b55f845bfd2de8488b16435bd3d0da), [`ae55343`](https://github.com/mastra-ai/mastra/commit/ae5534397fc006fd6eef3e4f80c235bcdc9289ef), [`c290cec`](https://github.com/mastra-ai/mastra/commit/c290cec5bf9107225de42942b56b487107aa9dce), [`f03e794`](https://github.com/mastra-ai/mastra/commit/f03e794630f812b56e95aad54f7b1993dc003add), [`aa4a5ae`](https://github.com/mastra-ai/mastra/commit/aa4a5aedb80d8d6837bab8cbb2e301215d1ba3e9), [`de3f584`](https://github.com/mastra-ai/mastra/commit/de3f58408752a8d80a295275c7f23fc306cf7f4f), [`d3fb010`](https://github.com/mastra-ai/mastra/commit/d3fb010c98f575f1c0614452667396e2653815f6), [`702ee1c`](https://github.com/mastra-ai/mastra/commit/702ee1c41be67cc532b4dbe89bcb62143508f6f0), [`f495051`](https://github.com/mastra-ai/mastra/commit/f495051eb6496a720f637fc85b6d69941c12554c), [`b8f636a`](https://github.com/mastra-ai/mastra/commit/b8f636a83c5260a9817eec97c202b7ca7d613524), [`e622f1d`](https://github.com/mastra-ai/mastra/commit/e622f1d3ab346a8e6aca6d1fe2eac99bd961e50b), [`8d14a59`](https://github.com/mastra-ai/mastra/commit/8d14a591d46fbbbe81baa33c9c267d596f790329), [`114e7c1`](https://github.com/mastra-ai/mastra/commit/114e7c146ac682925f0fb37376c1be70e5d6e6e5), [`861f111`](https://github.com/mastra-ai/mastra/commit/861f11189211b20ddb70d8df81a6b901fc78d11e), [`00f43e8`](https://github.com/mastra-ai/mastra/commit/00f43e8e97a80c82b27d5bd30494f10a715a1df9), [`1b6f651`](https://github.com/mastra-ai/mastra/commit/1b6f65127d4a0d6c38d0a1055cb84527db529d6b), [`96a1702`](https://github.com/mastra-ai/mastra/commit/96a1702ce362c50dda20c8b4a228b4ad1a36a17a), [`cb9f921`](https://github.com/mastra-ai/mastra/commit/cb9f921320913975657abb1404855d8c510f7ac5), [`114e7c1`](https://github.com/mastra-ai/mastra/commit/114e7c146ac682925f0fb37376c1be70e5d6e6e5), [`114e7c1`](https://github.com/mastra-ai/mastra/commit/114e7c146ac682925f0fb37376c1be70e5d6e6e5), [`114e7c1`](https://github.com/mastra-ai/mastra/commit/114e7c146ac682925f0fb37376c1be70e5d6e6e5), [`1b6f651`](https://github.com/mastra-ai/mastra/commit/1b6f65127d4a0d6c38d0a1055cb84527db529d6b), [`72df4a8`](https://github.com/mastra-ai/mastra/commit/72df4a8f9bf1a20cfd3d9006a4fdb597ad56d10a)]:
+  - @mastra/core@1.8.0-alpha.0
+  - @mastra/ai-sdk@1.1.0-alpha.0
+  - @mastra/schema-compat@1.1.3-alpha.0
+  - @mastra/react@0.2.7-alpha.0
+  - @mastra/client-js@1.7.1-alpha.0
+
 ## 14.0.0
 
 ### Minor Changes

package/dist/index.cjs.js

@@ -4720,7 +4720,8 @@ const ErrorAwareText = () => {
       /* @__PURE__ */ jsxRuntime.jsx(AlertDescription, { as: "p", children: text })
     ] });
   }
-  if (metadata?.mode === "network" && metadata?.completionResult) {
+  const taskCompleteResult = metadata?.completionResult;
+  if (taskCompleteResult) {
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 space-y-2", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("button", { onClick: () => setCollapsedCompletionCheck((s) => !s), className: "flex items-center gap-2", children: [
         /* @__PURE__ */ jsxRuntime.jsx(Icon, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUpIcon, { className: cn("transition-all", collapsedCompletionCheck ? "rotate-90" : "rotate-180") }) }),
@@ -4730,7 +4731,7 @@ const ErrorAwareText = () => {
         ] })
       ] }),
       !collapsedCompletionCheck && /* @__PURE__ */ jsxRuntime.jsxs(Alert, { variant: "info", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(AlertTitle, { as: "h5", children: metadata.completionResult?.passed ? "Complete" : "Not Complete" }),
+        /* @__PURE__ */ jsxRuntime.jsx(AlertTitle, { as: "h5", children: taskCompleteResult?.passed ? "Complete" : "Not Complete" }),
         /* @__PURE__ */ jsxRuntime.jsx(MarkdownText, {})
       ] })
     ] });
@@ -13722,12 +13723,12 @@ const AssistantMessage = ({ hasModelList }) => {
   const data = react.useMessage();
   const messageId = data.id;
   const isNotAssistantTextResponse = data.content.every(
-    ({ type, metadata }) => type === "tool-call" || type === "reasoning" || type === "text" && metadata?.mode === "network" && metadata?.completionResult
+    ({ type, metadata }) => type === "tool-call" || type === "reasoning" || type === "text" && (metadata?.completionResult || metadata?.isTaskCompleteResult)
   );
   const modelMetadata = data.metadata?.custom?.modelMetadata;
   const showModelUsed = hasModelList && modelMetadata;
   return /* @__PURE__ */ jsxRuntime.jsxs(react.MessagePrimitive.Root, { className: "max-w-full", "data-message-id": messageId, "data-message-index": data.index, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-neutral6 text-ui-lg leading-ui-lg", style: { paddingTop: "0.5rem" }, children: /* @__PURE__ */ jsxRuntime.jsx(
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-neutral6 text-ui-lg leading-ui-lg pt-2", children: /* @__PURE__ */ jsxRuntime.jsx(
       react.MessagePrimitive.Parts,
       {
         components: {
@@ -18437,7 +18438,7 @@ const EmptyAgentsTable = ({ onCreateClick }) => /* @__PURE__ */ jsxRuntime.jsx("
           size: "lg",
           variant: "outline",
           as: "a",
-          href: "https://mastra.ai/docs/agents",
+          href: "https://mastra.ai/docs/agents/overview",
           target: "_blank",
           rel: "noopener noreferrer",
           children: [
@@ -38657,7 +38658,7 @@ const targetTypeOptions = [
   { value: "workflow", label: "Workflow" },
   { value: "scorer", label: "Scorer" }
 ];
-function TargetSelector({ targetType, setTargetType, targetId, setTargetId }) {
+function TargetSelector({ targetType, setTargetType, targetId, setTargetId, container }) {
   const { data: agents, isLoading: agentsLoading } = useAgents();
   const { data: workflows, isLoading: workflowsLoading } = useWorkflows();
   const { data: scorers, isLoading: scorersLoading } = useScorers();
@@ -38678,85 +38679,70 @@ function TargetSelector({ targetType, setTargetType, targetId, setTargetId }) {
   };
   const targetLabel = targetType === "agent" ? "Agent" : targetType === "workflow" ? "Workflow" : "Scorer";
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      SelectField$1,
-      {
-        label: "Target Type",
-        name: "target-type",
-        value: targetType,
-        onValueChange: handleTypeChange,
-        options: targetTypeOptions,
-        placeholder: "Select target type",
-        variant: "experimental",
-        size: "default"
-      }
-    ),
-    targetType && (isTargetsLoading ? /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-10 w-full" }) : /* @__PURE__ */ jsxRuntime.jsx(
-      SelectField$1,
-      {
-        label: targetLabel,
-        name: "target-id",
-        value: targetId,
-        onValueChange: setTargetId,
-        options: targetOptions,
-        placeholder: `Select ${targetType}`,
-        variant: "experimental",
-        size: "default"
-      }
-    ))
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Label, { children: "Target Type" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Combobox,
+        {
+          options: targetTypeOptions,
+          value: targetType,
+          onValueChange: handleTypeChange,
+          placeholder: "Select target type",
+          searchPlaceholder: "Search types...",
+          emptyText: "No types available",
+          container
+        }
+      )
+    ] }),
+    targetType && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Label, { children: targetLabel }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Combobox,
+        {
+          options: targetOptions,
+          value: targetId,
+          onValueChange: setTargetId,
+          placeholder: `Select ${targetType}`,
+          searchPlaceholder: "Search...",
+          emptyText: "No targets available",
+          disabled: isTargetsLoading,
+          container
+        }
+      )
+    ] })
   ] });
 }
 
-function ScorerSelector({ selectedScorers, setSelectedScorers, disabled = false }) {
+function ScorerSelector({
+  selectedScorers,
+  setSelectedScorers,
+  disabled = false,
+  container
+}) {
   const { data: scorers, isLoading } = useScorers();
-  const scorersList = Object.entries(scorers ?? {}).map(([id, scorer]) => ({
-    id,
-    name: scorer.scorer?.config?.name ?? id,
-    description: scorer.scorer?.config?.description
-  }));
-  const handleScorerToggle = (scorerId) => {
-    if (selectedScorers.includes(scorerId)) {
-      setSelectedScorers(selectedScorers.filter((id) => id !== scorerId));
-    } else {
-      setSelectedScorers([...selectedScorers, scorerId]);
-    }
-  };
-  if (isLoading) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Label, { children: "Scorers (Optional)" }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2", children: Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-6 w-full" }, index)) })
-    ] });
-  }
-  if (scorersList.length === 0) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Label, { children: "Scorers (Optional)" }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-ui-sm text-neutral3", children: "No scorers configured. Scorers can be added to evaluate the run results." })
-    ] });
-  }
+  const options = React.useMemo(() => {
+    if (!scorers) return [];
+    return Object.entries(scorers).map(([id, scorer]) => ({
+      value: id,
+      label: scorer.scorer?.config?.name || id,
+      description: scorer.scorer?.config?.description || ""
+    }));
+  }, [scorers]);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-2", children: [
     /* @__PURE__ */ jsxRuntime.jsx(Label, { children: "Scorers (Optional)" }),
-    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-ui-sm text-neutral3 mb-2", children: "Select scorers to evaluate the run results." }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-3 max-h-48 overflow-y-auto", children: scorersList.map((scorer) => /* @__PURE__ */ jsxRuntime.jsxs(
-      "label",
+    /* @__PURE__ */ jsxRuntime.jsx(
+      MultiCombobox,
       {
-        className: "flex items-start gap-3 cursor-pointer hover:bg-surface3 rounded-md p-2 -m-2 transition-colors",
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            Checkbox,
-            {
-              checked: selectedScorers.includes(scorer.id),
-              onCheckedChange: () => handleScorerToggle(scorer.id),
-              disabled
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-0.5", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-ui-sm text-neutral5", children: scorer.name }),
-            scorer.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-ui-xs text-neutral3", children: scorer.description })
-          ] })
-        ]
-      },
-      scorer.id
-    )) })
+        options,
+        value: selectedScorers,
+        onValueChange: setSelectedScorers,
+        placeholder: "Select scorers...",
+        searchPlaceholder: "Search scorers...",
+        emptyText: "No scorers available",
+        disabled: disabled || isLoading,
+        container
+      }
+    )
   ] });
 }
 
@@ -38767,6 +38753,7 @@ function ExperimentTriggerDialog({
   onOpenChange,
   onSuccess
 }) {
+  const contentRef = React.useRef(null);
   const [targetType, setTargetType] = React.useState("");
   const [targetId, setTargetId] = React.useState("");
   const [selectedScorers, setSelectedScorers] = React.useState([]);
@@ -38802,7 +38789,7 @@ function ExperimentTriggerDialog({
       setSelectedScorers([]);
     }
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { children: [
+  return /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { ref: contentRef, children: [
     /* @__PURE__ */ jsxRuntime.jsxs(DialogHeader, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { children: "Run Experiment" }),
       /* @__PURE__ */ jsxRuntime.jsx(DialogDescription, { children: version ? `Execute items from ${dateFns.format(new Date(version), "MMM d, yyyy")} version against a target.` : "Execute all items in this dataset against a target." })
@@ -38814,7 +38801,8 @@ function ExperimentTriggerDialog({
           targetType,
           setTargetType,
           targetId,
-          setTargetId
+          setTargetId,
+          container: contentRef
         }
       ),
       targetType && targetType !== "scorer" && /* @__PURE__ */ jsxRuntime.jsx(
@@ -38822,7 +38810,8 @@ function ExperimentTriggerDialog({
         {
           selectedScorers,
           setSelectedScorers,
-          disabled: isRunning
+          disabled: isRunning,
+          container: contentRef
         }
       )
     ] }),