@mastra/playground-ui 6.4.1 → 6.5.0-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/CHANGELOG.md +36 -0
  2. package/dist/index.cjs.js +639 -1074
  3. package/dist/index.cjs.js.map +1 -1
  4. package/dist/index.es.js +633 -1071
  5. package/dist/index.es.js.map +1 -1
  6. package/dist/src/components/assistant-ui/messages/assistant-message.d.ts +1 -3
  7. package/dist/src/components/assistant-ui/thread.d.ts +1 -3
  8. package/dist/src/components/assistant-ui/tools/badges/agent-badge.d.ts +5 -8
  9. package/dist/src/components/assistant-ui/tools/badges/tool-badge.d.ts +3 -5
  10. package/dist/src/components/assistant-ui/tools/badges/workflow-badge.d.ts +3 -5
  11. package/dist/src/components/assistant-ui/tools/tool-fallback.d.ts +6 -2
  12. package/dist/src/components/ui/elements/entry-list/entry-list-entries-skeleton.d.ts +6 -0
  13. package/dist/src/components/ui/elements/entry-list/entry-list-entries.d.ts +6 -0
  14. package/dist/src/components/ui/elements/entry-list/entry-list-entry-col.d.ts +7 -0
  15. package/dist/src/components/ui/elements/entry-list/entry-list-entry.d.ts +11 -0
  16. package/dist/src/components/ui/elements/entry-list/entry-list-header.d.ts +6 -0
  17. package/dist/src/components/ui/elements/entry-list/entry-list-message.d.ts +8 -0
  18. package/dist/src/components/ui/elements/entry-list/entry-list-next-page-loading.d.ts +9 -0
  19. package/dist/src/components/ui/elements/entry-list/entry-list-pagination.d.ts +8 -0
  20. package/dist/src/components/ui/elements/entry-list/entry-list-root.d.ts +6 -0
  21. package/dist/src/components/ui/elements/entry-list/entry-list-skeleton.d.ts +2 -0
  22. package/dist/src/components/ui/elements/entry-list/entry-list-trim.d.ts +6 -0
  23. package/dist/src/components/ui/elements/entry-list/entry-list.d.ts +20 -18
  24. package/dist/src/components/ui/elements/entry-list/helpers.d.ts +10 -0
  25. package/dist/src/components/ui/elements/entry-list/index.d.ts +3 -4
  26. package/dist/src/components/ui/elements/entry-list/shared.d.ts +1 -5
  27. package/dist/src/components/ui/elements/entry-list/types.d.ts +5 -0
  28. package/dist/src/components/ui/elements/headers/page-header.d.ts +2 -2
  29. package/dist/src/domains/agents/components/agent-chat.d.ts +1 -1
  30. package/dist/src/domains/agents/index.d.ts +1 -0
  31. package/dist/src/domains/agents/utils/extractPrompt.d.ts +2 -0
  32. package/dist/src/domains/observability/components/index.d.ts +1 -0
  33. package/dist/src/domains/observability/components/traces-list.d.ts +18 -0
  34. package/dist/src/domains/scores/components/scores-list.d.ts +21 -0
  35. package/dist/src/domains/scores/index.d.ts +1 -0
  36. package/dist/src/services/mastra-runtime-provider.d.ts +1 -1
  37. package/dist/src/types.d.ts +3 -1
  38. package/package.json +7 -7
  39. package/dist/src/components/ui/elements/entry-list/entry-list-cell.d.ts +0 -7
  40. package/dist/src/components/ui/elements/entry-list/entry-list-item.d.ts +0 -9
  41. package/dist/src/components/ui/elements/entry-list/entry-list-page-header.d.ts +0 -8
  42. package/dist/src/services/agent-network-message.d.ts +0 -2
  43. package/dist/src/services/stream-chunk-message.d.ts +0 -32
  44. package/dist/src/services/vnext-message-provider.d.ts +0 -10
package/dist/index.es.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
2
  import { useMessagePart, useMessage, MessagePrimitive, ActionBarPrimitive, useAttachment, AttachmentPrimitive, useComposerRuntime, ComposerPrimitive, useComposer, ThreadPrimitive, CompositeAttachmentAdapter, SimpleImageAttachmentAdapter, SimpleTextAttachmentAdapter, WebSpeechSynthesisAdapter, useExternalStoreRuntime, AssistantRuntimeProvider } from '@assistant-ui/react';
3
- import { CheckIcon as CheckIcon$1, CopyIcon, AlertCircle, Check, Copy, ChevronUpIcon, X, Share2, Braces, Loader2, Network, ChevronDown, PauseIcon, HourglassIcon, CircleDashed, Footprints, CircleCheck, CircleX, Minus, Plus, Maximize, Workflow, AlertCircleIcon, ChevronDownIcon, CirclePause, CalendarIcon, Brackets, PlusIcon, TrashIcon, Circle, StopCircle, SearchIcon, BrainIcon, TriangleAlert, AudioLinesIcon, StopCircleIcon, FileText, CircleXIcon, Link, CloudUpload, Mic, ArrowUp, Search, RefreshCcwIcon, ChevronRight, SortAsc, SortDesc, SaveIcon, RefreshCw, ExternalLink, InfoIcon as InfoIcon$1, TriangleAlertIcon, ChevronRightIcon, ArrowLeftIcon, ArrowRightIcon, XIcon, ChevronsRightIcon, ArrowUpIcon, ArrowDownIcon, AlignLeftIcon, AlignJustifyIcon, CircleAlertIcon, GaugeIcon, HashIcon, Info, GripVertical, AlertTriangleIcon, NetworkIcon, WorkflowIcon as WorkflowIcon$1, PackageIcon, GitBranchIcon, PackageOpenIcon, OctagonXIcon, FrownIcon, ChevronUp, ChevronsLeftRight, TimerIcon, ChevronsLeftRightIcon, ChevronFirstIcon, ChevronLastIcon, ListTreeIcon, ArrowRightToLineIcon, CoinsIcon, EyeIcon, ChevronsLeftRightEllipsisIcon, PanelTopIcon, PanelLeftIcon, CircleSlash, Clock as Clock$1 } from 'lucide-react';
3
+ import { CheckIcon as CheckIcon$1, CopyIcon, AlertCircle, TriangleAlert, Check, Copy, ChevronUpIcon, X, Share2, Braces, Loader2, Network, ChevronDown, PauseIcon, HourglassIcon, CircleDashed, Footprints, CircleCheck, CircleX, Minus, Plus, Maximize, Workflow, AlertCircleIcon, ChevronDownIcon, CirclePause, CalendarIcon, Brackets, PlusIcon, TrashIcon, Circle, StopCircle, SearchIcon, BrainIcon, AudioLinesIcon, StopCircleIcon, FileText, CircleXIcon, Link, CloudUpload, Mic, ArrowUp, Search, RefreshCcwIcon, ChevronRight, SortAsc, SortDesc, SaveIcon, RefreshCw, ExternalLink, InfoIcon as InfoIcon$1, TriangleAlertIcon, ChevronRightIcon, ArrowLeftIcon, ArrowRightIcon, XIcon, ChevronsRightIcon, ArrowUpIcon, ArrowDownIcon, AlignLeftIcon, AlignJustifyIcon, CircleAlertIcon, GaugeIcon, HashIcon, Info, RotateCcw, GripVertical, AlertTriangleIcon, NetworkIcon, WorkflowIcon as WorkflowIcon$1, PackageIcon, GitBranchIcon, PackageOpenIcon, OctagonXIcon, FrownIcon, ChevronUp, ChevronsLeftRight, TimerIcon, ChevronsLeftRightIcon, ChevronFirstIcon, ChevronLastIcon, ListTreeIcon, ArrowRightToLineIcon, CoinsIcon, EyeIcon, ChevronsLeftRightEllipsisIcon, PanelTopIcon, PanelLeftIcon, CircleSlash, Clock as Clock$1 } from 'lucide-react';
4
4
  import * as React from 'react';
5
- import React__default, { forwardRef, memo, useState, useEffect, useRef, useCallback, useMemo, createContext, useContext, Fragment as Fragment$1, useId, isValidElement } from 'react';
5
+ import React__default, { forwardRef, memo, useState, useEffect, useRef, useCallback, useMemo, createContext, useContext, Fragment as Fragment$1, useId } from 'react';
6
6
  import { Slot } from '@radix-ui/react-slot';
7
7
  import * as TooltipPrimitive from '@radix-ui/react-tooltip';
8
8
  import { TooltipProvider as TooltipProvider$1 } from '@radix-ui/react-tooltip';
@@ -37,7 +37,7 @@ import { create } from 'zustand';
37
37
  import { persist } from 'zustand/middleware';
38
38
  import { AutoForm as AutoForm$1, buildZodFieldConfig } from '@autoform/react';
39
39
  import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
40
- import { format, isValid, formatDistanceToNow, formatDate } from 'date-fns';
40
+ import { format, isValid, formatDistanceToNow, formatDate, isToday } from 'date-fns';
41
41
  import { useDebouncedCallback } from 'use-debounce';
42
42
  import { DayPicker } from 'react-day-picker';
43
43
  import * as PopoverPrimitive from '@radix-ui/react-popover';
@@ -47,7 +47,7 @@ import * as LabelPrimitive from '@radix-ui/react-label';
47
47
  import { ZodProvider, getFieldConfigInZodStack, getDefaultValueInZodStack } from '@autoform/zod/v4';
48
48
  import { z as z$1 } from 'zod/v3';
49
49
  import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
50
- import { useMastraClient, mapWorkflowStreamChunkToWatchResult, useChat, toAssistantUIMessage } from '@mastra/react';
50
+ import { useMastraClient, useChat, toAssistantUIMessage } from '@mastra/react';
51
51
  import { useQuery, useMutation, QueryClient, QueryClientProvider } from '@tanstack/react-query';
52
52
  import './index.css';export * from '@tanstack/react-query';
53
53
  import { useReactTable, getCoreRowModel, flexRender } from '@tanstack/react-table';
@@ -3414,42 +3414,6 @@ const defaultComponents = unstable_memoizeMarkdownComponents({
3414
3414
  img: ImageWithFallback
3415
3415
  });
3416
3416
 
3417
- const ErrorAwareText = () => {
3418
- const part = useMessagePart();
3419
- const text = part.text || "";
3420
- try {
3421
- const trimmedText = text.trim();
3422
- if (trimmedText.startsWith("__ERROR__:")) {
3423
- const errorMessage = trimmedText.substring("__ERROR__:".length);
3424
- return /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4 rounded-lg bg-red-50 dark:bg-red-950/20 border border-red-200 dark:border-red-900/50", children: [
3425
- /* @__PURE__ */ jsx(AlertCircle, { className: "w-5 h-5 text-red-500 dark:text-red-400 mt-0.5 flex-shrink-0" }),
3426
- /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
3427
- /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-red-800 dark:text-red-200 mb-1", children: "Error" }),
3428
- /* @__PURE__ */ jsx("p", { className: "text-sm text-red-700 dark:text-red-300", children: errorMessage })
3429
- ] })
3430
- ] });
3431
- } else if (trimmedText.startsWith("Error:")) {
3432
- const errorMessage = trimmedText.substring("Error:".length).trim();
3433
- return /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4 rounded-lg bg-red-50 dark:bg-red-950/20 border border-red-200 dark:border-red-900/50", children: [
3434
- /* @__PURE__ */ jsx(AlertCircle, { className: "w-5 h-5 text-red-500 dark:text-red-400 mt-0.5 flex-shrink-0" }),
3435
- /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
3436
- /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-red-800 dark:text-red-200 mb-1", children: "Error" }),
3437
- /* @__PURE__ */ jsx("p", { className: "text-sm text-red-700 dark:text-red-300", children: errorMessage })
3438
- ] })
3439
- ] });
3440
- }
3441
- return /* @__PURE__ */ jsx(MarkdownText, {});
3442
- } catch (error) {
3443
- return /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4 rounded-lg bg-red-50 dark:bg-red-950/20 border border-red-200 dark:border-red-900/50", children: [
3444
- /* @__PURE__ */ jsx(AlertCircle, { className: "w-5 h-5 text-red-500 dark:text-red-400 mt-0.5 flex-shrink-0" }),
3445
- /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
3446
- /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-red-800 dark:text-red-200 mb-1", children: "Error" }),
3447
- /* @__PURE__ */ jsx("p", { className: "text-sm text-red-700 dark:text-red-300", children: String(text) })
3448
- ] })
3449
- ] });
3450
- }
3451
- };
3452
-
3453
3417
  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: [
3454
3418
  /* @__PURE__ */ jsx(
3455
3419
  "path",
@@ -4242,6 +4206,91 @@ const AgentNetworkCoinIcon = (props) => /* @__PURE__ */ jsxs("svg", { width: "12
4242
4206
  ) }) })
4243
4207
  ] });
4244
4208
 
4209
+ const variants = {
4210
+ "header-md": "text-header-md leading-header-md",
4211
+ "ui-lg": "text-ui-lg leading-ui-lg",
4212
+ "ui-md": "text-ui-md leading-ui-md",
4213
+ "ui-sm": "text-ui-sm leading-ui-sm",
4214
+ "ui-xs": "text-ui-xs leading-ui-xs"
4215
+ };
4216
+ const fonts = {
4217
+ mono: "font-mono"
4218
+ };
4219
+ const Txt = ({ as: Root = "p", className, variant = "ui-md", font, ...props }) => {
4220
+ return /* @__PURE__ */ jsx(Root, { className: clsx(variants[variant], font && fonts[font], className), ...props });
4221
+ };
4222
+
4223
+ const variantClasses$3 = {
4224
+ warning: "bg-yellow-900/20 border-sm border-yellow-200 text-yellow-200",
4225
+ destructive: "bg-red-900/20 border-sm border-red-200 text-red-200"
4226
+ };
4227
+ const variantIcons = {
4228
+ warning: TriangleAlert,
4229
+ destructive: AlertCircle
4230
+ };
4231
+ const Alert$1 = ({ children, variant = "destructive" }) => {
4232
+ const Ico = variantIcons[variant];
4233
+ return /* @__PURE__ */ jsx("div", { className: clsx(variantClasses$3[variant], "p-2 rounded-md"), children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2", children: [
4234
+ /* @__PURE__ */ jsx(Icon, { className: "mt-0.5", children: /* @__PURE__ */ jsx(Ico, {}) }),
4235
+ /* @__PURE__ */ jsx("div", { children })
4236
+ ] }) });
4237
+ };
4238
+ const AlertTitle$1 = ({ children, as: As = "h5" }) => {
4239
+ return /* @__PURE__ */ jsx(Txt, { as: As, variant: "ui-md", className: "font-semibold", children });
4240
+ };
4241
+ const AlertDescription$1 = ({ children, as: As = "p" }) => {
4242
+ return /* @__PURE__ */ jsx(Txt, { as: As, variant: "ui-sm", children });
4243
+ };
4244
+
4245
+ const ErrorAwareText = () => {
4246
+ const part = useMessagePart();
4247
+ const text = part.text || "";
4248
+ const metadata = part.metadata || {};
4249
+ if (metadata?.status === "warning") {
4250
+ return /* @__PURE__ */ jsxs(Alert$1, { variant: "warning", children: [
4251
+ /* @__PURE__ */ jsx(AlertTitle$1, { as: "h5", children: "Warning" }),
4252
+ /* @__PURE__ */ jsx(AlertDescription$1, { as: "p", children: text })
4253
+ ] });
4254
+ }
4255
+ if (metadata?.status === "error") {
4256
+ return /* @__PURE__ */ jsxs(Alert$1, { variant: "destructive", children: [
4257
+ /* @__PURE__ */ jsx(AlertTitle$1, { as: "h5", children: "Error" }),
4258
+ /* @__PURE__ */ jsx(AlertDescription$1, { as: "p", children: text })
4259
+ ] });
4260
+ }
4261
+ try {
4262
+ const trimmedText = text.trim();
4263
+ if (trimmedText.startsWith("__ERROR__:")) {
4264
+ const errorMessage = trimmedText.substring("__ERROR__:".length);
4265
+ return /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4 rounded-lg bg-red-50 dark:bg-red-950/20 border border-red-200 dark:border-red-900/50", children: [
4266
+ /* @__PURE__ */ jsx(AlertCircle, { className: "w-5 h-5 text-red-500 dark:text-red-400 mt-0.5 flex-shrink-0" }),
4267
+ /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
4268
+ /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-red-800 dark:text-red-200 mb-1", children: "Error" }),
4269
+ /* @__PURE__ */ jsx("p", { className: "text-sm text-red-700 dark:text-red-300", children: errorMessage })
4270
+ ] })
4271
+ ] });
4272
+ } else if (trimmedText.startsWith("Error:")) {
4273
+ const errorMessage = trimmedText.substring("Error:".length).trim();
4274
+ return /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4 rounded-lg bg-red-50 dark:bg-red-950/20 border border-red-200 dark:border-red-900/50", children: [
4275
+ /* @__PURE__ */ jsx(AlertCircle, { className: "w-5 h-5 text-red-500 dark:text-red-400 mt-0.5 flex-shrink-0" }),
4276
+ /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
4277
+ /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-red-800 dark:text-red-200 mb-1", children: "Error" }),
4278
+ /* @__PURE__ */ jsx("p", { className: "text-sm text-red-700 dark:text-red-300", children: errorMessage })
4279
+ ] })
4280
+ ] });
4281
+ }
4282
+ return /* @__PURE__ */ jsx(MarkdownText, {});
4283
+ } catch (error) {
4284
+ return /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4 rounded-lg bg-red-50 dark:bg-red-950/20 border border-red-200 dark:border-red-900/50", children: [
4285
+ /* @__PURE__ */ jsx(AlertCircle, { className: "w-5 h-5 text-red-500 dark:text-red-400 mt-0.5 flex-shrink-0" }),
4286
+ /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
4287
+ /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-red-800 dark:text-red-200 mb-1", children: "Error" }),
4288
+ /* @__PURE__ */ jsx("p", { className: "text-sm text-red-700 dark:text-red-300", children: String(text) })
4289
+ ] })
4290
+ ] });
4291
+ }
4292
+ };
4293
+
4245
4294
  function useCopyToClipboard({ text, copyMessage = "Copied to clipboard!" }) {
4246
4295
  const [isCopied, setIsCopied] = useState(false);
4247
4296
  const timeoutRef = useRef(null);
@@ -4307,12 +4356,12 @@ const SyntaxHighlighter$2 = ({
4307
4356
  const formattedCode = JSON.stringify(data, null, 2);
4308
4357
  const theme = useCodemirrorTheme$2();
4309
4358
  return /* @__PURE__ */ jsxs("div", { className: clsx("rounded-md bg-surface4 p-1 font-mono relative", className), children: [
4310
- /* @__PURE__ */ jsx(CopyButton, { content: formattedCode, className: "absolute top-2 right-2 z-[9999]" }),
4359
+ /* @__PURE__ */ jsx(CopyButton, { content: formattedCode, className: "absolute top-2 right-2 z-20" }),
4311
4360
  /* @__PURE__ */ jsx(CodeMirror, { value: formattedCode, theme, extensions: [jsonLanguage] })
4312
4361
  ] });
4313
4362
  };
4314
4363
 
4315
- const variantClasses$3 = {
4364
+ const variantClasses$2 = {
4316
4365
  default: "text-icon3",
4317
4366
  success: "text-accent1",
4318
4367
  error: "text-accent2",
@@ -4325,12 +4374,12 @@ const Badge$1 = ({ icon, variant = "default", className, children, ...props }) =
4325
4374
  className: clsx(
4326
4375
  "font-mono bg-surface4 text-ui-sm gap-md h-badge-default inline-flex items-center rounded-md shrink-0",
4327
4376
  icon ? "pl-md pr-1.5" : "px-1.5",
4328
- icon || variant === "default" ? "text-icon5" : variantClasses$3[variant],
4377
+ icon || variant === "default" ? "text-icon5" : variantClasses$2[variant],
4329
4378
  className
4330
4379
  ),
4331
4380
  ...props,
4332
4381
  children: [
4333
- icon && /* @__PURE__ */ jsx("span", { className: variantClasses$3[variant], children: /* @__PURE__ */ jsx(Icon, { children: icon }) }),
4382
+ icon && /* @__PURE__ */ jsx("span", { className: variantClasses$2[variant], children: /* @__PURE__ */ jsx(Icon, { children: icon }) }),
4334
4383
  children
4335
4384
  ]
4336
4385
  }
@@ -4417,20 +4466,6 @@ DialogTitle.displayName = DialogPrimitive.Title.displayName;
4417
4466
  const DialogDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Description, { ref, className: cn("text-sm text-muted-foreground", className), ...props }));
4418
4467
  DialogDescription.displayName = DialogPrimitive.Description.displayName;
4419
4468
 
4420
- const variants = {
4421
- "header-md": "text-header-md leading-header-md",
4422
- "ui-lg": "text-ui-lg leading-ui-lg",
4423
- "ui-md": "text-ui-md leading-ui-md",
4424
- "ui-sm": "text-ui-sm leading-ui-sm",
4425
- "ui-xs": "text-ui-xs leading-ui-xs"
4426
- };
4427
- const fonts = {
4428
- mono: "font-mono"
4429
- };
4430
- const Txt = ({ as: Root = "p", className, variant = "ui-md", font, ...props }) => {
4431
- return /* @__PURE__ */ jsx(Root, { className: clsx(variants[variant], font && fonts[font], className), ...props });
4432
- };
4433
-
4434
4469
  const NetworkChoiceMetadata = ({ selectionReason, open, onOpenChange, input }) => {
4435
4470
  let inputSlot = null;
4436
4471
  if (input) {
@@ -4476,7 +4511,7 @@ const NetworkChoiceMetadataDialogTrigger = ({
4476
4511
  ] });
4477
4512
  };
4478
4513
 
4479
- const ToolBadge = ({ toolName, args, result, networkMetadata, toolOutput }) => {
4514
+ const ToolBadge = ({ toolName, args, result, metadata, toolOutput }) => {
4480
4515
  let argSlot = null;
4481
4516
  try {
4482
4517
  const { __mastraMetadata: _, ...formattedArgs } = typeof args === "object" ? args : JSON.parse(args);
@@ -4485,16 +4520,18 @@ const ToolBadge = ({ toolName, args, result, networkMetadata, toolOutput }) => {
4485
4520
  argSlot = /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap", children: args });
4486
4521
  }
4487
4522
  let resultSlot = typeof result === "string" ? /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap bg-surface4 p-4 rounded-md", children: result }) : /* @__PURE__ */ jsx(SyntaxHighlighter$2, { data: result });
4523
+ const selectionReason = metadata?.mode === "network" ? metadata.selectionReason : void 0;
4524
+ const agentNetworkInput = metadata?.mode === "network" ? metadata.agentInput : void 0;
4488
4525
  return /* @__PURE__ */ jsx(
4489
4526
  BadgeWrapper,
4490
4527
  {
4491
4528
  icon: /* @__PURE__ */ jsx(ToolsIcon, { className: "text-[#ECB047]" }),
4492
4529
  title: toolName,
4493
- extraInfo: networkMetadata && /* @__PURE__ */ jsx(
4530
+ extraInfo: metadata?.mode === "network" && /* @__PURE__ */ jsx(
4494
4531
  NetworkChoiceMetadataDialogTrigger,
4495
4532
  {
4496
- selectionReason: networkMetadata?.selectionReason || "",
4497
- input: networkMetadata?.input
4533
+ selectionReason: selectionReason || "",
4534
+ input: agentNetworkInput
4498
4535
  }
4499
4536
  ),
4500
4537
  children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
@@ -5100,7 +5137,7 @@ const sizeClasses = {
5100
5137
  md: "h-button-md gap-md",
5101
5138
  lg: "h-button-lg gap-lg"
5102
5139
  };
5103
- const variantClasses$2 = {
5140
+ const variantClasses$1 = {
5104
5141
  default: "bg-surface2 hover:bg-surface4 text-icon3 hover:text-icon6",
5105
5142
  light: "bg-surface3 hover:bg-surface5 text-icon6"
5106
5143
  };
@@ -5111,7 +5148,7 @@ const Button$1 = ({ className, as, size = "md", variant = "default", ...props })
5111
5148
  {
5112
5149
  className: clsx(
5113
5150
  "bg-surface2 border-sm border-border1 px-lg text-ui-md inline-flex items-center justify-center rounded-md border",
5114
- variantClasses$2[variant],
5151
+ variantClasses$1[variant],
5115
5152
  sizeClasses[size],
5116
5153
  className,
5117
5154
  {
@@ -6070,20 +6107,20 @@ const alertVariants = cva(
6070
6107
  }
6071
6108
  }
6072
6109
  );
6073
- const Alert$1 = React.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, role: "alert", className: cn(alertVariants({ variant }), className), ...props }));
6074
- Alert$1.displayName = "Alert";
6075
- const AlertTitle$1 = React.forwardRef(
6110
+ const Alert = React.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, role: "alert", className: cn(alertVariants({ variant }), className), ...props }));
6111
+ Alert.displayName = "Alert";
6112
+ const AlertTitle = React.forwardRef(
6076
6113
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("h5", { ref, className: cn("mb-1 font-medium leading-none tracking-tight", className), ...props })
6077
6114
  );
6078
- AlertTitle$1.displayName = "AlertTitle";
6079
- const AlertDescription$1 = React.forwardRef(
6115
+ AlertTitle.displayName = "AlertTitle";
6116
+ const AlertDescription = React.forwardRef(
6080
6117
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("text-sm [&_p]:leading-relaxed", className), ...props })
6081
6118
  );
6082
- AlertDescription$1.displayName = "AlertDescription";
6119
+ AlertDescription.displayName = "AlertDescription";
6083
6120
 
6084
- const ErrorMessage = ({ error }) => /* @__PURE__ */ jsxs(Alert$1, { variant: "destructive", children: [
6121
+ const ErrorMessage = ({ error }) => /* @__PURE__ */ jsxs(Alert, { variant: "destructive", children: [
6085
6122
  /* @__PURE__ */ jsx(AlertCircle, { className: "h-4 w-4" }),
6086
- /* @__PURE__ */ jsx(AlertTitle$1, { children: error })
6123
+ /* @__PURE__ */ jsx(AlertTitle, { children: error })
6087
6124
  ] });
6088
6125
 
6089
6126
  const SubmitButton = ({ children }) => /* @__PURE__ */ jsx(Button$2, { type: "submit", children });
@@ -7700,24 +7737,26 @@ const EmptyWorkflowsTable = () => /* @__PURE__ */ jsx("div", { className: "flex
7700
7737
  }
7701
7738
  ) });
7702
7739
 
7703
- const WorkflowBadge = ({ workflow, runId, workflowId, isStreaming, networkMetadata }) => {
7740
+ const WorkflowBadge = ({ workflow, runId, workflowId, isStreaming, metadata }) => {
7704
7741
  const { data: runs, isLoading: isRunsLoading } = useWorkflowRuns(workflowId, {
7705
7742
  enabled: Boolean(runId) && !isStreaming
7706
7743
  });
7707
7744
  const run = runs?.runs.find((run2) => run2.runId === runId);
7708
7745
  const isLoading = isRunsLoading || !run;
7709
7746
  const snapshot = typeof run?.snapshot === "object" ? run?.snapshot : void 0;
7747
+ const selectionReason = metadata?.mode === "network" ? metadata.selectionReason : void 0;
7748
+ const agentNetworkInput = metadata?.mode === "network" ? metadata.agentInput : void 0;
7710
7749
  return /* @__PURE__ */ jsxs(
7711
7750
  BadgeWrapper,
7712
7751
  {
7713
7752
  icon: /* @__PURE__ */ jsx(WorkflowIcon, { className: "text-accent3" }),
7714
7753
  title: workflow.name,
7715
7754
  initialCollapsed: false,
7716
- extraInfo: networkMetadata && /* @__PURE__ */ jsx(
7755
+ extraInfo: metadata?.mode === "network" && /* @__PURE__ */ jsx(
7717
7756
  NetworkChoiceMetadataDialogTrigger,
7718
7757
  {
7719
- selectionReason: networkMetadata?.selectionReason || "",
7720
- input: networkMetadata?.input
7758
+ selectionReason: selectionReason ?? "",
7759
+ input: agentNetworkInput
7721
7760
  }
7722
7761
  ),
7723
7762
  children: [
@@ -7769,18 +7808,20 @@ const LoadingBadge = () => {
7769
7808
  );
7770
7809
  };
7771
7810
 
7772
- const AgentBadge = ({ agentId, messages = [], networkMetadata }) => {
7811
+ const AgentBadge = ({ agentId, messages = [], metadata }) => {
7812
+ const selectionReason = metadata?.mode === "network" ? metadata.selectionReason : void 0;
7813
+ const agentNetworkInput = metadata?.mode === "network" ? metadata.agentInput : void 0;
7773
7814
  return /* @__PURE__ */ jsx(
7774
7815
  BadgeWrapper,
7775
7816
  {
7776
7817
  icon: /* @__PURE__ */ jsx(AgentIcon, { className: "text-accent1" }),
7777
7818
  title: agentId,
7778
7819
  initialCollapsed: false,
7779
- extraInfo: networkMetadata && /* @__PURE__ */ jsx(
7820
+ extraInfo: metadata?.mode === "network" && /* @__PURE__ */ jsx(
7780
7821
  NetworkChoiceMetadataDialogTrigger,
7781
7822
  {
7782
- selectionReason: networkMetadata?.selectionReason || "",
7783
- input: networkMetadata?.input
7823
+ selectionReason: selectionReason ?? "",
7824
+ input: agentNetworkInput
7784
7825
  }
7785
7826
  ),
7786
7827
  children: messages.map((message, index) => {
@@ -7799,6 +7840,9 @@ const AgentBadge = ({ agentId, messages = [], networkMetadata }) => {
7799
7840
  type: "tool-call",
7800
7841
  toolCallId: message.toolCallId,
7801
7842
  addResult: () => {
7843
+ },
7844
+ metadata: {
7845
+ mode: "stream"
7802
7846
  }
7803
7847
  }
7804
7848
  ) }, index);
@@ -7810,30 +7854,25 @@ const AgentBadge = ({ agentId, messages = [], networkMetadata }) => {
7810
7854
  const ToolFallback = ({ toolName, result, args, ...props }) => {
7811
7855
  return /* @__PURE__ */ jsx(WorkflowRunProvider, { children: /* @__PURE__ */ jsx(ToolFallbackInner, { toolName, result, args, ...props }) });
7812
7856
  };
7813
- const ToolFallbackInner = ({ toolName, result, args }) => {
7814
- useWorkflowStream(args.__mastraMetadata?.workflowFullState);
7857
+ const ToolFallbackInner = ({ toolName, result, args, metadata, ...props }) => {
7858
+ useWorkflowStream(result);
7815
7859
  const { data: workflow, isLoading } = useWorkflow(toolName);
7816
- const isAgent = args.__mastraMetadata?.from === "AGENT";
7860
+ const isAgent = metadata?.mode === "network" && metadata.from === "AGENT";
7817
7861
  if (isAgent) {
7818
- return /* @__PURE__ */ jsx(
7819
- AgentBadge,
7820
- {
7821
- agentId: toolName,
7822
- messages: args?.__mastraMetadata?.messages,
7823
- networkMetadata: args?.__mastraMetadata?.networkMetadata
7824
- }
7825
- );
7862
+ const messages = result?.childMessages ?? [];
7863
+ return /* @__PURE__ */ jsx(AgentBadge, { agentId: toolName, messages, metadata });
7826
7864
  }
7827
7865
  if (isLoading) return /* @__PURE__ */ jsx(LoadingBadge, {});
7828
7866
  if (workflow) {
7867
+ const isStreaming = metadata?.mode === "stream" || metadata?.mode === "network";
7829
7868
  return /* @__PURE__ */ jsx(
7830
7869
  WorkflowBadge,
7831
7870
  {
7832
7871
  workflowId: toolName,
7833
7872
  workflow,
7834
- isStreaming: args.__mastraMetadata?.isStreaming,
7873
+ isStreaming,
7835
7874
  runId: result?.runId,
7836
- networkMetadata: args?.__mastraMetadata?.networkMetadata
7875
+ metadata
7837
7876
  }
7838
7877
  );
7839
7878
  }
@@ -7843,8 +7882,8 @@ const ToolFallbackInner = ({ toolName, result, args }) => {
7843
7882
  toolName,
7844
7883
  args,
7845
7884
  result,
7846
- toolOutput: args?.__mastraMetadata?.toolOutput || [],
7847
- networkMetadata: args?.__mastraMetadata?.networkMetadata
7885
+ toolOutput: result?.toolOutput || [],
7886
+ metadata
7848
7887
  }
7849
7888
  );
7850
7889
  };
@@ -8409,32 +8448,23 @@ const ProviderLogo = ({ providerId, className = "", size = 20 }) => {
8409
8448
  );
8410
8449
  };
8411
8450
 
8412
- const statusClasses = {
8413
- warning: "bg-yellow-900/20 border-sm border-yellow-200 text-yellow-200 rounded-lg px-4 py-2 flex gap-4 items-center",
8414
- default: ""
8415
- };
8416
- const AssistantMessage = ({ ToolFallback: ToolFallbackCustom, hasModelList }) => {
8451
+ const AssistantMessage = ({ hasModelList }) => {
8417
8452
  const data = useMessage();
8418
8453
  const messageId = data.id;
8419
8454
  const isToolCallAndOrReasoning = data.content.every(({ type }) => type === "tool-call" || type === "reasoning");
8420
8455
  const modelMetadata = data.metadata?.custom?.modelMetadata;
8421
- const messageStatus = data.metadata?.custom?.status;
8422
- const statusClass = statusClasses[messageStatus || "default"];
8423
8456
  const showModelUsed = hasModelList && modelMetadata;
8424
8457
  return /* @__PURE__ */ jsxs(MessagePrimitive.Root, { className: "max-w-full", "data-message-id": messageId, children: [
8425
- /* @__PURE__ */ jsxs("div", { className: clsx("text-icon6 text-ui-lg leading-ui-lg", statusClass), children: [
8426
- messageStatus === "warning" && /* @__PURE__ */ jsx(Icon, { size: "lg", children: /* @__PURE__ */ jsx(TriangleAlert, {}) }),
8427
- /* @__PURE__ */ jsx(
8428
- MessagePrimitive.Parts,
8429
- {
8430
- components: {
8431
- Text: ErrorAwareText,
8432
- tools: { Fallback: ToolFallbackCustom || ToolFallback },
8433
- Reasoning
8434
- }
8458
+ /* @__PURE__ */ jsx("div", { className: "text-icon6 text-ui-lg leading-ui-lg", children: /* @__PURE__ */ jsx(
8459
+ MessagePrimitive.Parts,
8460
+ {
8461
+ components: {
8462
+ Text: ErrorAwareText,
8463
+ tools: { Fallback: ToolFallback },
8464
+ Reasoning
8435
8465
  }
8436
- )
8437
- ] }),
8466
+ }
8467
+ ) }),
8438
8468
  !isToolCallAndOrReasoning && /* @__PURE__ */ jsxs("div", { className: cn("h-6 pt-4 flex gap-2 items-center", { "pb-1": showModelUsed }), children: [
8439
8469
  showModelUsed && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
8440
8470
  /* @__PURE__ */ jsx(ProviderLogo, { providerId: modelMetadata.modelProvider, size: 14 }),
@@ -9031,11 +9061,11 @@ const useThreadInput = () => {
9031
9061
  return useContext(ThreadInputContext);
9032
9062
  };
9033
9063
 
9034
- const Thread = ({ ToolFallback, agentName, agentId, hasMemory, hasModelList }) => {
9064
+ const Thread = ({ agentName, agentId, hasMemory, hasModelList }) => {
9035
9065
  const areaRef = useRef(null);
9036
9066
  useAutoscroll(areaRef, { enabled: true });
9037
9067
  const WrappedAssistantMessage = (props) => {
9038
- return /* @__PURE__ */ jsx(AssistantMessage, { ...props, ToolFallback, hasModelList });
9068
+ return /* @__PURE__ */ jsx(AssistantMessage, { ...props, hasModelList });
9039
9069
  };
9040
9070
  return /* @__PURE__ */ jsxs(ThreadWrapper, { children: [
9041
9071
  /* @__PURE__ */ jsxs(ThreadPrimitive.Viewport, { ref: areaRef, autoScroll: false, className: "overflow-y-scroll scroll-smooth h-full", children: [
@@ -9411,645 +9441,72 @@ const useAdapters = (agentId) => {
9411
9441
  };
9412
9442
  };
9413
9443
 
9414
- const handleNetworkMessageFromMemory = (content) => {
9415
- if (content.primitiveType === "workflow") {
9416
- return {
9417
- role: "assistant",
9418
- content: [
9419
- {
9420
- type: "tool-call",
9421
- toolCallId: content.finalResult.runId,
9422
- toolName: content.primitiveId,
9423
- result: { runId: content.finalResult.runId },
9424
- args: {
9425
- __mastraMetadata: {
9426
- from: "WORKFLOW",
9427
- networkMetadata: {
9428
- selectionReason: content?.selectionReason,
9429
- input: content?.input
9430
- }
9431
- }
9432
- }
9433
- }
9434
- ]
9435
- };
9444
+ const handleFinishReason = (finishReason) => {
9445
+ switch (finishReason) {
9446
+ case "tool-calls":
9447
+ throw new Error("Stream finished with reason tool-calls, try increasing maxSteps");
9436
9448
  }
9437
- if (content.primitiveType === "agent") {
9438
- const badgeMessages = [];
9439
- let toolCalls = {};
9440
- const messages = content.finalResult.messages.slice(1);
9441
- for (const message of messages) {
9442
- if (typeof message.content === "string") {
9443
- badgeMessages.push({
9444
- type: "text",
9445
- content: message.content
9446
- });
9447
- continue;
9448
- }
9449
- for (const part of message.content) {
9450
- if (part.type === "text") {
9451
- badgeMessages.push({
9452
- type: "text",
9453
- content: part.content
9454
- });
9455
- } else if (part.type === "tool-result") {
9456
- badgeMessages.push({
9457
- type: "tool",
9458
- toolName: part.toolName,
9459
- toolOutput: part.result,
9460
- // tool output
9461
- toolCallId: part.toolCallId,
9462
- args: toolCalls?.[part.toolCallId]?.args || {}
9463
- });
9464
- } else if (part.type === "tool-call") {
9465
- toolCalls[part.toolCallId] = part;
9466
- }
9449
+ };
9450
+ const convertToAIAttachments = async (attachments) => {
9451
+ const promises = (attachments ?? []).filter((attachment) => attachment.type === "image" || attachment.type === "document").map(async (attachment) => {
9452
+ const isFileFromURL = attachment.name.startsWith("https://");
9453
+ if (attachment.type === "document") {
9454
+ if (attachment.contentType === "application/pdf") {
9455
+ const pdfText = attachment.content?.[0]?.text || "";
9456
+ return {
9457
+ role: "user",
9458
+ content: [
9459
+ {
9460
+ type: "file",
9461
+ data: isFileFromURL ? attachment.name : `data:application/pdf;base64,${pdfText}`,
9462
+ mimeType: attachment.contentType,
9463
+ filename: attachment.name
9464
+ }
9465
+ ]
9466
+ };
9467
9467
  }
9468
+ return {
9469
+ role: "user",
9470
+ // @ts-expect-error - TODO: fix this type issue somehow
9471
+ content: attachment.content[0]?.text || ""
9472
+ };
9468
9473
  }
9469
9474
  return {
9470
- role: "assistant",
9471
- content: [
9472
- {
9473
- type: "tool-call",
9474
- toolCallId: content.finalResult.runId,
9475
- toolName: content.primitiveId,
9476
- result: { runId: content.finalResult.runId },
9477
- args: {
9478
- __mastraMetadata: {
9479
- from: "AGENT",
9480
- networkMetadata: {
9481
- selectionReason: content?.selectionReason || "",
9482
- input: content?.input || ""
9483
- },
9484
- messages: badgeMessages
9485
- }
9486
- }
9487
- }
9488
- ]
9489
- };
9490
- }
9491
- if (content.primitiveType === "tool") {
9492
- return {
9493
- role: "assistant",
9475
+ role: "user",
9494
9476
  content: [
9495
9477
  {
9496
- type: "tool-call",
9497
- toolCallId: content.finalResult.toolCallId,
9498
- toolName: content.primitiveId,
9499
- result: content.finalResult.result,
9500
- args: {
9501
- ...content?.input,
9502
- __mastraMetadata: {
9503
- networkMetadata: {
9504
- selectionReason: content?.selectionReason || "",
9505
- input: content?.input || ""
9506
- }
9507
- }
9508
- }
9478
+ type: "image",
9479
+ image: isFileFromURL ? attachment.name : await fileToBase64(attachment.file),
9480
+ mimeType: attachment.file.type
9509
9481
  }
9510
9482
  ]
9511
9483
  };
9512
- }
9513
- return { role: "assistant", content: [{ type: "text", text: "Unknown response" }] };
9484
+ });
9485
+ return Promise.all(promises);
9514
9486
  };
9515
-
9516
- const handleStreamChunk = ({ chunk, conversation }) => {
9517
- switch (chunk.type) {
9518
- case "tripwire": {
9519
- return [
9520
- ...conversation,
9521
- {
9522
- role: "assistant",
9523
- metadata: {
9524
- custom: {
9525
- status: "warning"
9526
- }
9527
- },
9528
- content: [
9529
- {
9530
- type: "text",
9531
- text: chunk.payload.tripwireReason
9532
- }
9533
- ]
9534
- }
9535
- ];
9536
- }
9537
- case "start": {
9538
- const newMessage = {
9539
- role: "assistant",
9540
- content: []
9541
- };
9542
- return [...conversation, newMessage];
9543
- }
9544
- case "text-start":
9545
- case "text-delta": {
9546
- const lastMessage = conversation[conversation.length - 1];
9547
- if (!lastMessage) return conversation;
9548
- if (lastMessage.role === "assistant" && typeof lastMessage.content !== `string` && (!lastMessage.content || lastMessage.content.length === 0 || lastMessage.content[lastMessage.content.length - 1]?.type !== `text`)) {
9549
- return [
9550
- ...conversation.slice(0, -1),
9551
- {
9552
- ...lastMessage,
9553
- content: [...lastMessage.content || [], { type: "text", text: "" }]
9554
- }
9555
- ];
9556
- }
9557
- if (chunk.type === `text-start`) return conversation;
9558
- if (typeof lastMessage.content === `string`) {
9559
- return [
9560
- ...conversation.slice(0, -1),
9561
- {
9562
- ...lastMessage,
9563
- content: lastMessage.content + chunk.payload.text
9564
- }
9565
- ];
9487
+ const initializeMessageState = (initialMessages) => {
9488
+ const convertedMessages = initialMessages?.map((message) => {
9489
+ const attachmentsAsContentParts = (message.experimental_attachments || []).map((image) => ({
9490
+ type: image.contentType.startsWith(`image/`) ? "image" : image.contentType.startsWith(`audio/`) ? "audio" : "file",
9491
+ mimeType: image.contentType,
9492
+ image: image.url
9493
+ }));
9494
+ const formattedParts = (message.parts || []).map((part) => {
9495
+ if (part.type === "reasoning") {
9496
+ return {
9497
+ type: "reasoning",
9498
+ text: part.reasoning || part?.details?.filter((detail) => detail.type === "text")?.map((detail) => detail.text).join(" ")
9499
+ };
9566
9500
  }
9567
- const lastPart = lastMessage.content?.[lastMessage.content.length - 1];
9568
- if (!lastPart || lastPart.type !== `text`) return conversation;
9569
- return [
9570
- ...conversation.slice(0, -1),
9571
- {
9572
- ...lastMessage,
9573
- content: [...lastMessage.content.slice(0, -1), { ...lastPart, text: lastPart.text + chunk.payload.text }]
9574
- }
9575
- ];
9576
- }
9577
- case "tool-output": {
9578
- if (chunk.payload.output?.type.startsWith("workflow-")) {
9579
- return handleWorkflowChunk({
9580
- workflowChunk: chunk.payload.output,
9581
- conversation,
9582
- entityName: chunk.payload.toolName
9583
- });
9584
- }
9585
- const lastMessage = conversation[conversation.length - 1];
9586
- if (lastMessage && lastMessage.role === "assistant" && Array.isArray(lastMessage.content)) {
9587
- const updatedContent = lastMessage.content.map((part) => {
9588
- if (typeof part === "object" && part.type === "tool-call" && part.toolCallId === chunk.payload.toolCallId) {
9589
- const existingToolOutput = part.args?.__mastraMetadata?.toolOutput || [];
9590
- return {
9591
- ...part,
9592
- args: {
9593
- ...part.args,
9594
- __mastraMetadata: {
9595
- ...part.args?.__mastraMetadata,
9596
- toolOutput: [...existingToolOutput, chunk?.payload?.output]
9597
- }
9598
- }
9599
- };
9600
- }
9601
- return part;
9602
- });
9603
- const updatedMessage = {
9604
- ...lastMessage,
9605
- content: updatedContent
9606
- };
9607
- return [...conversation.slice(0, -1), updatedMessage];
9608
- }
9609
- return [...conversation];
9610
- }
9611
- case "tool-call": {
9612
- const lastMessage = conversation[conversation.length - 1];
9613
- if (lastMessage && lastMessage.role === "assistant") {
9614
- const updatedMessage = {
9615
- ...lastMessage,
9616
- content: Array.isArray(lastMessage.content) ? [
9617
- ...lastMessage.content,
9618
- {
9619
- type: "tool-call",
9620
- toolCallId: chunk.payload.toolCallId,
9621
- toolName: chunk.payload.toolName,
9622
- args: {
9623
- ...chunk.payload.args,
9624
- __mastraMetadata: {
9625
- ...chunk.payload.args?.__mastraMetadata,
9626
- isStreaming: true
9627
- }
9628
- }
9629
- }
9630
- ] : [
9631
- ...typeof lastMessage.content === "string" ? [{ type: "text", text: lastMessage.content }] : [],
9632
- {
9633
- type: "tool-call",
9634
- toolCallId: chunk.payload.toolCallId,
9635
- toolName: chunk.payload.toolName,
9636
- args: {
9637
- ...chunk.payload.args,
9638
- __mastraMetadata: {
9639
- ...chunk.payload.args?.__mastraMetadata,
9640
- isStreaming: true
9641
- }
9642
- }
9643
- }
9644
- ]
9645
- };
9646
- return [...conversation.slice(0, -1), updatedMessage];
9647
- }
9648
- const newMessage = {
9649
- role: "assistant",
9650
- content: [
9651
- {
9652
- type: "tool-call",
9653
- toolCallId: chunk.payload.toolCallId,
9654
- toolName: chunk.payload.toolName,
9655
- args: {
9656
- ...chunk.payload.args,
9657
- __mastraMetadata: {
9658
- ...chunk.payload.args?.__mastraMetadata,
9659
- isStreaming: true
9660
- }
9661
- }
9662
- }
9663
- ]
9664
- };
9665
- return [...conversation, newMessage];
9666
- }
9667
- case "tool-result": {
9668
- const lastMessage = conversation[conversation.length - 1];
9669
- if (lastMessage && lastMessage.role === "assistant" && Array.isArray(lastMessage.content)) {
9670
- const updatedContent = lastMessage.content.map((part) => {
9671
- if (typeof part === "object" && part.type === "tool-call" && part.toolCallId === chunk.payload.toolCallId) {
9672
- return {
9673
- ...part,
9674
- result: chunk.payload.result
9675
- };
9676
- }
9677
- return part;
9678
- });
9679
- const updatedMessage = {
9680
- ...lastMessage,
9681
- content: updatedContent
9682
- };
9683
- return [...conversation.slice(0, -1), updatedMessage];
9684
- }
9685
- return [...conversation];
9686
- }
9687
- case "error": {
9688
- if (typeof chunk.payload.error === "string") {
9689
- const errorMessage = {
9690
- role: "assistant",
9691
- content: `Error: ${chunk.payload.error}`
9692
- };
9693
- return [...conversation, errorMessage];
9694
- }
9695
- return [...conversation];
9696
- }
9697
- case "finish": {
9698
- const lastMessage = conversation[conversation.length - 1];
9699
- handleFinishReason$1(chunk.payload.stepResult.reason);
9700
- if (lastMessage && lastMessage.role === "assistant") {
9701
- const updatedMessage = {
9702
- ...lastMessage,
9703
- metadata: {
9704
- custom: {
9705
- modelMetadata: chunk.payload.metadata.modelMetadata
9706
- }
9707
- }
9708
- };
9709
- return [...conversation.slice(0, -1), updatedMessage];
9710
- }
9711
- return [...conversation];
9712
- }
9713
- case "reasoning-delta": {
9714
- const lastMessage = conversation[conversation.length - 1];
9715
- if (lastMessage && lastMessage.role === "assistant" && Array.isArray(lastMessage.content)) {
9716
- const updatedContent = lastMessage.content.map((part) => {
9717
- if (typeof part === "object" && part.type === "reasoning") {
9718
- return {
9719
- ...part,
9720
- text: part.text + chunk.payload.text
9721
- };
9722
- }
9723
- return part;
9724
- });
9725
- const updatedMessage = {
9726
- ...lastMessage,
9727
- content: updatedContent
9728
- };
9729
- return [...conversation.slice(0, -1), updatedMessage];
9730
- }
9731
- const newMessage = {
9732
- role: "assistant",
9733
- content: [
9734
- {
9735
- type: "reasoning",
9736
- text: chunk.payload.text
9737
- }
9738
- ]
9739
- };
9740
- return [...conversation, newMessage];
9741
- }
9742
- default:
9743
- return [...conversation];
9744
- }
9745
- };
9746
- const handleFinishReason$1 = (finishReason) => {
9747
- switch (finishReason) {
9748
- case "tool-calls":
9749
- throw new Error("Stream finished with reason tool-calls, try increasing maxSteps");
9750
- }
9751
- };
9752
- const handleWorkflowChunk = ({
9753
- workflowChunk,
9754
- conversation,
9755
- entityName
9756
- }) => {
9757
- const lastMessage = conversation[conversation.length - 1];
9758
- const contentArray = Array.isArray(lastMessage.content) ? lastMessage.content : [{ type: "text", text: lastMessage.content }];
9759
- const newMessage = {
9760
- ...lastMessage,
9761
- content: contentArray.map((part) => {
9762
- if (part.type === "tool-call") {
9763
- return {
9764
- ...part,
9765
- toolName: part?.entityName || entityName,
9766
- args: {
9767
- ...part.args,
9768
- __mastraMetadata: {
9769
- ...part.args?.__mastraMetadata,
9770
- workflowFullState: mapWorkflowStreamChunkToWatchResult(
9771
- part.args?.__mastraMetadata?.workflowFullState || {},
9772
- workflowChunk
9773
- ),
9774
- isStreaming: true
9775
- }
9776
- }
9777
- };
9778
- }
9779
- return part;
9780
- })
9781
- };
9782
- return [...conversation.slice(0, -1), newMessage];
9783
- };
9784
- const handleAgentChunk = ({
9785
- agentChunk,
9786
- conversation,
9787
- entityName
9788
- }) => {
9789
- switch (agentChunk.type) {
9790
- case "tool-result": {
9791
- const lastMessage = conversation[conversation.length - 1];
9792
- const contentArray = Array.isArray(lastMessage.content) ? lastMessage.content : [{ type: "text", text: lastMessage.content }];
9793
- const newMessage = {
9794
- ...lastMessage,
9795
- content: contentArray.map((part) => {
9796
- if (part.type === "tool-call") {
9797
- const messages = part.args?.__mastraMetadata?.messages || [];
9798
- const next = {
9799
- ...part,
9800
- toolName: part?.entityName || entityName,
9801
- args: {
9802
- ...part.args,
9803
- __mastraMetadata: {
9804
- ...part.args?.__mastraMetadata,
9805
- isStreaming: true,
9806
- messages: [
9807
- ...messages.slice(0, -1),
9808
- {
9809
- ...messages[messages.length - 1],
9810
- type: "tool",
9811
- toolName: agentChunk.payload.toolName,
9812
- args: agentChunk.payload.args,
9813
- toolOutput: agentChunk.payload.result
9814
- }
9815
- ]
9816
- }
9817
- }
9818
- };
9819
- return next;
9820
- }
9821
- return part;
9822
- })
9823
- };
9824
- return [...conversation.slice(0, -1), newMessage];
9825
- }
9826
- case "tool-call": {
9827
- const lastMessage = conversation[conversation.length - 1];
9828
- const contentArray = Array.isArray(lastMessage.content) ? lastMessage.content : [{ type: "text", text: lastMessage.content }];
9829
- const newMessage = {
9830
- ...lastMessage,
9831
- content: contentArray.map((part) => {
9832
- if (part.type === "tool-call") {
9833
- const messages = part.args?.__mastraMetadata?.messages || [];
9834
- const next = {
9835
- ...part,
9836
- toolName: part?.entityName || entityName,
9837
- args: {
9838
- ...part.args,
9839
- __mastraMetadata: {
9840
- ...part.args?.__mastraMetadata,
9841
- isStreaming: true,
9842
- messages: [
9843
- ...messages,
9844
- {
9845
- type: "tool",
9846
- toolCallId: agentChunk.payload.toolCallId,
9847
- toolName: agentChunk.payload.toolName,
9848
- args: {
9849
- ...agentChunk.payload.args,
9850
- __mastraMetadata: {
9851
- ...agentChunk.payload.args?.__mastraMetadata,
9852
- isStreaming: true
9853
- }
9854
- }
9855
- }
9856
- ]
9857
- }
9858
- }
9859
- };
9860
- return next;
9861
- }
9862
- return part;
9863
- })
9864
- };
9865
- return [...conversation.slice(0, -1), newMessage];
9866
- }
9867
- case "text-delta": {
9868
- const lastMessage = conversation[conversation.length - 1];
9869
- const contentArray = Array.isArray(lastMessage.content) ? lastMessage.content : [{ type: "text", text: lastMessage.content }];
9870
- const newMessage = {
9871
- ...lastMessage,
9872
- content: contentArray.map((part) => {
9873
- if (part.type === "tool-call") {
9874
- const messages = part.args?.__mastraMetadata?.messages || [];
9875
- const lastMastraMessage = messages[messages.length - 1];
9876
- const nextMessages = lastMastraMessage?.type === "text" ? [
9877
- ...messages.slice(0, -1),
9878
- { type: "text", content: (lastMastraMessage?.content || "") + agentChunk.payload.text }
9879
- ] : [...messages, { type: "text", content: agentChunk.payload.text }];
9880
- return {
9881
- ...part,
9882
- toolName: part?.entityName || entityName,
9883
- args: {
9884
- ...part.args,
9885
- __mastraMetadata: {
9886
- ...part.args?.__mastraMetadata,
9887
- isStreaming: true,
9888
- messages: nextMessages
9889
- }
9890
- }
9891
- };
9892
- }
9893
- return part;
9894
- })
9895
- };
9896
- return [...conversation.slice(0, -1), newMessage];
9897
- }
9898
- case "tool-output": {
9899
- if (!agentChunk.payload.output.type.startsWith("workflow-")) return [...conversation];
9900
- const lastMessage = conversation[conversation.length - 1];
9901
- const contentArray = Array.isArray(lastMessage.content) ? lastMessage.content : [{ type: "text", text: lastMessage.content }];
9902
- const newMessage = {
9903
- ...lastMessage,
9904
- content: contentArray.map((part) => {
9905
- if (part.type === "tool-call") {
9906
- const messages = part.args?.__mastraMetadata?.messages || [];
9907
- const lastMastraMessage = messages[messages.length - 1];
9908
- const nextMessages = lastMastraMessage?.type === "tool" ? [
9909
- ...messages.slice(0, -1),
9910
- {
9911
- ...lastMastraMessage,
9912
- args: {
9913
- ...agentChunk.payload.args,
9914
- __mastraMetadata: {
9915
- ...agentChunk.payload.args?.__mastraMetadata,
9916
- workflowFullState: mapWorkflowStreamChunkToWatchResult(
9917
- lastMastraMessage.args?.__mastraMetadata?.workflowFullState || {},
9918
- agentChunk.payload.output
9919
- ),
9920
- isStreaming: true
9921
- }
9922
- }
9923
- }
9924
- ] : messages;
9925
- return {
9926
- ...part,
9927
- toolName: part?.entityName || entityName,
9928
- args: {
9929
- ...part.args,
9930
- __mastraMetadata: {
9931
- ...part.args?.__mastraMetadata,
9932
- isStreaming: true,
9933
- messages: nextMessages
9934
- }
9935
- }
9936
- };
9937
- }
9938
- return part;
9939
- })
9940
- };
9941
- return [...conversation.slice(0, -1), newMessage];
9942
- }
9943
- default:
9944
- case "agent-execution-end":
9945
- return [...conversation];
9946
- }
9947
- };
9948
- const createRootToolAssistantMessage = ({
9949
- chunk,
9950
- entityName,
9951
- conversation,
9952
- runId,
9953
- from,
9954
- networkMetadata
9955
- }) => {
9956
- if (!entityName || !runId) return [...conversation];
9957
- const newMessage = {
9958
- role: "assistant",
9959
- content: [
9960
- {
9961
- type: "tool-call",
9962
- toolCallId: runId,
9963
- toolName: entityName,
9964
- args: {
9965
- ...chunk?.payload?.args,
9966
- __mastraMetadata: {
9967
- from,
9968
- networkMetadata,
9969
- ...chunk.payload.args?.__mastraMetadata,
9970
- isStreaming: true
9971
- }
9972
- }
9973
- }
9974
- ]
9975
- };
9976
- return [...conversation, newMessage];
9977
- };
9978
-
9979
- const handleFinishReason = (finishReason) => {
9980
- switch (finishReason) {
9981
- case "tool-calls":
9982
- throw new Error("Stream finished with reason tool-calls, try increasing maxSteps");
9983
- }
9984
- };
9985
- const convertToAIAttachments = async (attachments) => {
9986
- const promises = (attachments ?? []).filter((attachment) => attachment.type === "image" || attachment.type === "document").map(async (attachment) => {
9987
- const isFileFromURL = attachment.name.startsWith("https://");
9988
- if (attachment.type === "document") {
9989
- if (attachment.contentType === "application/pdf") {
9990
- const pdfText = attachment.content?.[0]?.text || "";
9991
- return {
9992
- role: "user",
9993
- content: [
9994
- {
9995
- type: "file",
9996
- data: isFileFromURL ? attachment.name : `data:application/pdf;base64,${pdfText}`,
9997
- mimeType: attachment.contentType,
9998
- filename: attachment.name
9999
- }
10000
- ]
10001
- };
10002
- }
10003
- return {
10004
- role: "user",
10005
- // @ts-expect-error - TODO: fix this type issue somehow
10006
- content: attachment.content[0]?.text || ""
10007
- };
10008
- }
10009
- return {
10010
- role: "user",
10011
- content: [
10012
- {
10013
- type: "image",
10014
- image: isFileFromURL ? attachment.name : await fileToBase64(attachment.file),
10015
- mimeType: attachment.file.type
10016
- }
10017
- ]
10018
- };
10019
- });
10020
- return Promise.all(promises);
10021
- };
10022
- const initializeMessageState = (initialMessages) => {
10023
- const convertedMessages = initialMessages?.map((message) => {
10024
- let content;
10025
- try {
10026
- content = JSON.parse(message.content);
10027
- if (content.isNetwork) {
10028
- return handleNetworkMessageFromMemory(content);
10029
- }
10030
- } catch (e) {
10031
- }
10032
- const attachmentsAsContentParts = (message.experimental_attachments || []).map((image) => ({
10033
- type: image.contentType.startsWith(`image/`) ? "image" : image.contentType.startsWith(`audio/`) ? "audio" : "file",
10034
- mimeType: image.contentType,
10035
- image: image.url
10036
- }));
10037
- const formattedParts = (message.parts || []).map((part) => {
10038
- if (part.type === "reasoning") {
10039
- return {
10040
- type: "reasoning",
10041
- text: part.reasoning || part?.details?.filter((detail) => detail.type === "text")?.map((detail) => detail.text).join(" ")
10042
- };
10043
- }
10044
- if (part.type === "tool-invocation") {
10045
- if (part.toolInvocation.state === "result") {
10046
- return {
10047
- type: "tool-call",
10048
- toolCallId: part.toolInvocation.toolCallId,
10049
- toolName: part.toolInvocation.toolName,
10050
- args: part.toolInvocation.args,
10051
- result: part.toolInvocation.result
10052
- };
9501
+ if (part.type === "tool-invocation") {
9502
+ if (part.toolInvocation.state === "result") {
9503
+ return {
9504
+ type: "tool-call",
9505
+ toolCallId: part.toolInvocation.toolCallId,
9506
+ toolName: part.toolInvocation.toolName,
9507
+ args: part.toolInvocation.args,
9508
+ result: part.toolInvocation.result
9509
+ };
10053
9510
  }
10054
9511
  }
10055
9512
  if (part.type === "file") {
@@ -10077,6 +9534,7 @@ function MastraRuntimeProvider({
10077
9534
  children,
10078
9535
  agentId,
10079
9536
  initialMessages,
9537
+ initialLegacyMessages,
10080
9538
  memory,
10081
9539
  threadId,
10082
9540
  refreshThreadList,
@@ -10084,9 +9542,10 @@ function MastraRuntimeProvider({
10084
9542
  runtimeContext,
10085
9543
  modelVersion
10086
9544
  }) {
10087
- const initializeMessages = () => memory ? initializeMessageState(initialMessages || []) : [];
10088
9545
  const [isLegacyRunning, setIsLegacyRunning] = useState(false);
10089
- const [legacyMessages, setLegacyMessages] = useState(initializeMessages());
9546
+ const [legacyMessages, setLegacyMessages] = useState(
9547
+ () => memory ? initializeMessageState(initialLegacyMessages || []) : []
9548
+ );
10090
9549
  const {
10091
9550
  setMessages,
10092
9551
  messages,
@@ -10097,7 +9556,7 @@ function MastraRuntimeProvider({
10097
9556
  isRunning: isRunningStream
10098
9557
  } = useChat({
10099
9558
  agentId,
10100
- initializeMessages
9559
+ initializeMessages: () => initialMessages || []
10101
9560
  });
10102
9561
  const { refetch: refreshWorkingMemory } = useWorkingMemory();
10103
9562
  const abortControllerRef = useRef(null);
@@ -10130,7 +9589,8 @@ function MastraRuntimeProvider({
10130
9589
  topP,
10131
9590
  maxTokens,
10132
9591
  instructions,
10133
- providerOptions
9592
+ providerOptions,
9593
+ maxSteps
10134
9594
  };
10135
9595
  const baseClient = useMastraClient();
10136
9596
  const isVNext = modelVersion === "v2";
@@ -10139,7 +9599,7 @@ function MastraRuntimeProvider({
10139
9599
  const attachments = await convertToAIAttachments(message.attachments);
10140
9600
  const input = message.content[0].text;
10141
9601
  if (isVNext) {
10142
- setMessages((s) => [...s, { role: "user", content: input, attachments: message.attachments }]);
9602
+ setMessages((s) => [...s, { role: "user", parts: [{ type: "text", text: input }] }]);
10143
9603
  } else {
10144
9604
  setLegacyMessages((s) => [...s, { role: "user", content: input, attachments: message.attachments }]);
10145
9605
  }
@@ -10153,7 +9613,6 @@ function MastraRuntimeProvider({
10153
9613
  try {
10154
9614
  if (isVNext) {
10155
9615
  if (chatWithNetwork) {
10156
- let currentEntityId;
10157
9616
  await network({
10158
9617
  coreUserMessages: [
10159
9618
  {
@@ -10166,73 +9625,9 @@ function MastraRuntimeProvider({
10166
9625
  threadId,
10167
9626
  modelSettings: modelSettingsArgs,
10168
9627
  signal: controller.signal,
10169
- onNetworkChunk: (chunk, conversation) => {
10170
- if (chunk.type.startsWith("agent-execution-event-")) {
10171
- const agentChunk = chunk.payload;
10172
- if (!currentEntityId) return conversation;
10173
- return handleAgentChunk({ agentChunk, conversation, entityName: currentEntityId });
10174
- } else if (chunk.type === "tool-execution-start") {
10175
- const { args: argsData } = chunk.payload;
10176
- const nestedArgs = argsData.args || {};
10177
- const mastraMetadata = argsData.__mastraMetadata || {};
10178
- const selectionReason = argsData.selectionReason || "";
10179
- return handleStreamChunk({
10180
- chunk: {
10181
- ...chunk,
10182
- type: "tool-call",
10183
- payload: {
10184
- ...chunk.payload,
10185
- toolCallId: argsData.toolCallId || "unknown",
10186
- toolName: argsData.toolName || "unknown",
10187
- args: {
10188
- ...nestedArgs,
10189
- __mastraMetadata: {
10190
- ...mastraMetadata,
10191
- networkMetadata: {
10192
- selectionReason,
10193
- input: nestedArgs
10194
- }
10195
- }
10196
- }
10197
- }
10198
- },
10199
- conversation
10200
- });
10201
- } else if (chunk.type === "tool-execution-end") {
10202
- const next = handleStreamChunk({
10203
- chunk: { ...chunk, type: "tool-result" },
10204
- conversation
10205
- });
10206
- if (chunk.payload?.toolName === "updateWorkingMemory" && typeof chunk.payload.result === "object" && "success" in chunk.payload.result && chunk.payload.result?.success) {
10207
- refreshWorkingMemory?.();
10208
- }
10209
- return next;
10210
- } else if (chunk.type.startsWith("workflow-execution-event-")) {
10211
- const workflowChunk = chunk.payload;
10212
- if (!currentEntityId) return conversation;
10213
- return handleWorkflowChunk({ workflowChunk, conversation, entityName: currentEntityId });
10214
- } else if (chunk.type === "workflow-execution-start" || chunk.type === "agent-execution-start") {
10215
- currentEntityId = chunk.payload?.args?.primitiveId;
10216
- const runId = chunk.payload.runId;
10217
- if (!currentEntityId || !runId) return conversation;
10218
- return createRootToolAssistantMessage({
10219
- entityName: currentEntityId,
10220
- conversation,
10221
- runId,
10222
- chunk,
10223
- from: chunk.type === "agent-execution-start" ? "AGENT" : "WORKFLOW",
10224
- networkMetadata: {
10225
- selectionReason: chunk?.payload?.args?.selectionReason || "",
10226
- input: chunk?.payload?.args?.prompt
10227
- }
10228
- });
10229
- } else if (chunk.type === "network-execution-event-step-finish") {
10230
- return [
10231
- ...conversation,
10232
- { role: "assistant", content: [{ type: "text", text: chunk?.payload?.result || "" }] }
10233
- ];
10234
- } else {
10235
- return handleStreamChunk({ chunk, conversation });
9628
+ onNetworkChunk: async (chunk) => {
9629
+ if (chunk.type === "tool-execution-end" && chunk.payload?.toolName === "updateWorkingMemory" && typeof chunk.payload.result === "object" && "success" in chunk.payload.result && chunk.payload.result?.success) {
9630
+ refreshWorkingMemory?.();
10236
9631
  }
10237
9632
  }
10238
9633
  });
@@ -10249,18 +9644,7 @@ function MastraRuntimeProvider({
10249
9644
  runtimeContext: runtimeContextInstance,
10250
9645
  threadId,
10251
9646
  modelSettings: modelSettingsArgs,
10252
- signal: controller.signal,
10253
- onFinish: ({ messages: messages2, tripwireReason }) => {
10254
- const next = messages2.length > 0 ? messages2.map((message2) => toAssistantUIMessage(message2)) : [];
10255
- if (tripwireReason) {
10256
- next.push({
10257
- role: "assistant",
10258
- content: [{ type: "text", text: tripwireReason }],
10259
- metadata: { custom: { status: "warning" } }
10260
- });
10261
- }
10262
- return next;
10263
- }
9647
+ signal: controller.signal
10264
9648
  });
10265
9649
  return;
10266
9650
  } else {
@@ -10275,12 +9659,10 @@ function MastraRuntimeProvider({
10275
9659
  runtimeContext: runtimeContextInstance,
10276
9660
  threadId,
10277
9661
  modelSettings: modelSettingsArgs,
10278
- onChunk: (chunk, conversation) => {
10279
- const next = handleStreamChunk({ chunk, conversation });
9662
+ onChunk: async (chunk) => {
10280
9663
  if (chunk.type === "tool-result" && chunk.payload?.toolName === "updateWorkingMemory" && typeof chunk.payload.result === "object" && "success" in chunk.payload.result && chunk.payload.result?.success) {
10281
9664
  refreshWorkingMemory?.();
10282
9665
  }
10283
- return next;
10284
9666
  },
10285
9667
  signal: controller.signal
10286
9668
  });
@@ -10575,7 +9957,7 @@ function MastraRuntimeProvider({
10575
9957
  if (isVNext) {
10576
9958
  setMessages((currentConversation) => [
10577
9959
  ...currentConversation,
10578
- { role: "assistant", content: [{ type: "text", text: `${error}` }] }
9960
+ { role: "assistant", parts: [{ type: "text", text: `${error}` }] }
10579
9961
  ]);
10580
9962
  } else {
10581
9963
  setLegacyMessages((currentConversation) => [
@@ -10596,20 +9978,17 @@ function MastraRuntimeProvider({
10596
9978
  }
10597
9979
  };
10598
9980
  const { adapters, isReady } = useAdapters(agentId);
9981
+ const vnextmessages = messages.map(toAssistantUIMessage);
10599
9982
  const runtime = useExternalStoreRuntime({
10600
9983
  isRunning: isLegacyRunning || isRunningStream,
10601
- messages: isVNext ? messages : legacyMessages,
9984
+ messages: isVNext ? vnextmessages : legacyMessages,
10602
9985
  convertMessage: (x) => x,
10603
9986
  onNew,
10604
9987
  onCancel,
10605
9988
  adapters: isReady ? adapters : void 0
10606
9989
  });
10607
9990
  if (!isReady) return null;
10608
- return /* @__PURE__ */ jsxs(AssistantRuntimeProvider, { runtime, children: [
10609
- " ",
10610
- children,
10611
- " "
10612
- ] });
9991
+ return /* @__PURE__ */ jsx(AssistantRuntimeProvider, { runtime, children });
10613
9992
  }
10614
9993
 
10615
9994
  const defaultSettings = {
@@ -10677,6 +10056,7 @@ const AgentChat = ({
10677
10056
  agentName,
10678
10057
  threadId,
10679
10058
  initialMessages,
10059
+ initialLegacyMessages,
10680
10060
  memory,
10681
10061
  refreshThreadList,
10682
10062
  modelVersion,
@@ -10692,6 +10072,7 @@ const AgentChat = ({
10692
10072
  modelVersion,
10693
10073
  threadId,
10694
10074
  initialMessages,
10075
+ initialLegacyMessages,
10695
10076
  memory,
10696
10077
  refreshThreadList,
10697
10078
  settings,
@@ -11450,13 +10831,35 @@ const AgentSettings = ({ modelVersion, hasMemory = false, hasSubAgents = false }
11450
10831
  ] });
11451
10832
  };
11452
10833
 
10834
+ const resolveInstructionPart = (part) => {
10835
+ if (typeof part === "string") {
10836
+ return part.trim();
10837
+ }
10838
+ return part.text?.trim() || "";
10839
+ };
10840
+ const extractPrompt = (instructions) => {
10841
+ if (typeof instructions === "string") {
10842
+ return instructions.trim();
10843
+ }
10844
+ if (typeof instructions === "object" && "content" in instructions) {
10845
+ if (Array.isArray(instructions.content)) {
10846
+ return instructions.content.map(resolveInstructionPart).join("\n\n").trim();
10847
+ }
10848
+ return instructions.content.trim();
10849
+ }
10850
+ if (Array.isArray(instructions)) {
10851
+ return instructions.map(extractPrompt).join("\n\n").trim();
10852
+ }
10853
+ return "";
10854
+ };
10855
+
11453
10856
  const NameCell$3 = ({ row }) => {
11454
10857
  const { Link, paths } = useLinkComponent();
11455
10858
  return /* @__PURE__ */ jsx(
11456
10859
  EntryCell,
11457
10860
  {
11458
10861
  name: /* @__PURE__ */ jsx(Link, { className: "w-full space-y-0", href: paths.agentLink(row.original.id), children: row.original.name }),
11459
- description: row.original.instructions
10862
+ description: extractPrompt(row.original.instructions)
11460
10863
  }
11461
10864
  );
11462
10865
  };
@@ -12175,36 +11578,8 @@ function RelationWrapper({ description, children }) {
12175
11578
  ] }) : children;
12176
11579
  }
12177
11580
 
12178
- function EntryListTextCell({ children, isLoading }) {
12179
- const [randomWidth, setRandomWidth] = useState(void 0);
12180
- useEffect(() => {
12181
- setRandomWidth(Math.floor(Math.random() * (90 - 50 + 1)) + 50);
12182
- }, []);
12183
- if (!randomWidth) return null;
12184
- return /* @__PURE__ */ jsx("div", { className: "text-icon4 text-[0.875rem] truncate ", children: isLoading ? /* @__PURE__ */ jsx(
12185
- "div",
12186
- {
12187
- className: "bg-surface4 rounded-md animate-pulse text-transparent h-[1rem] select-none",
12188
- style: { width: `${randomWidth}%` }
12189
- }
12190
- ) : children });
12191
- }
12192
- function EntryListStatusCell({ status }) {
12193
- return /* @__PURE__ */ jsxs("div", { className: cn("flex justify-center items-center w-full relative"), children: [
12194
- status ? /* @__PURE__ */ jsx(
12195
- "div",
12196
- {
12197
- className: cn("w-[0.6rem] h-[0.6rem] rounded-full", {
12198
- "bg-green-600": status === "success",
12199
- "bg-red-700": status === "failed"
12200
- })
12201
- }
12202
- ) : /* @__PURE__ */ jsx("div", { className: "text-icon2 text-[0.75rem] leading-none", children: "-" }),
12203
- /* @__PURE__ */ jsxs(VisuallyHidden$1, { children: [
12204
- "Status: ",
12205
- status ? status : "not provided"
12206
- ] })
12207
- ] });
11581
+ function EntryListRoot({ children }) {
11582
+ return /* @__PURE__ */ jsx("div", { className: "grid mb-[3rem]", children });
12208
11583
  }
12209
11584
 
12210
11585
  function getColumnTemplate(columns) {
@@ -12216,33 +11591,53 @@ function getColumnTemplate(columns) {
12216
11591
  }).join(" ");
12217
11592
  }
12218
11593
 
12219
- function EntryListItem({
12220
- item,
12221
- selectedItemId,
12222
- onClick,
12223
- children,
12224
- columns,
12225
- isLoading
12226
- }) {
12227
- const isSelected = selectedItemId === item.id;
11594
+ function EntryListHeader({ columns }) {
11595
+ return /* @__PURE__ */ jsx("div", { className: cn("sticky top-0 bg-surface4 z-[1] rounded-t-lg px-[1.5rem]"), children: /* @__PURE__ */ jsx(
11596
+ "div",
11597
+ {
11598
+ className: cn("grid gap-[1.5rem] text-left uppercase py-[.75rem] text-icon3 text-[0.75rem]"),
11599
+ style: { gridTemplateColumns: getColumnTemplate(columns) },
11600
+ children: columns?.map((col) => /* @__PURE__ */ jsx("span", { children: col.label || col.name }, col.name))
11601
+ }
11602
+ ) });
11603
+ }
11604
+
11605
+ function EntryListEntries({ children }) {
11606
+ return /* @__PURE__ */ jsx("ul", { className: "grid bg-surface3 overflow-y-auto", children });
11607
+ }
11608
+
11609
+ function EntryListTrim({ children }) {
11610
+ return /* @__PURE__ */ jsx("div", { className: cn("rounded-lg border border-border1 overflow-clip"), children });
11611
+ }
11612
+
11613
+ function EntryListEntry({ entry, isSelected, onClick, children, columns }) {
12228
11614
  const handleClick = () => {
12229
- return onClick && onClick(item?.id);
11615
+ onClick?.(entry?.id);
12230
11616
  };
12231
11617
  return /* @__PURE__ */ jsx(
12232
11618
  "li",
12233
11619
  {
12234
- className: cn("border-b text-[#ccc] border-border1 last:border-b-0 text-[0.875rem]", {
12235
- "bg-surface5": isSelected
12236
- }),
11620
+ className: cn(
11621
+ "border-t text-[#ccc] border-border1 last:border-b-0 text-[0.875rem]",
11622
+ "[&:last-child>button]:rounded-b-lg",
11623
+ {
11624
+ "bg-surface5": isSelected
11625
+ }
11626
+ ),
12237
11627
  children: /* @__PURE__ */ jsx(
12238
11628
  "button",
12239
11629
  {
12240
11630
  onClick: handleClick,
12241
- className: cn("grid w-full px-[1.5rem] gap-[2rem] text-left items-center min-h-[3rem]", {
12242
- "hover:bg-surface5": !isLoading
12243
- }),
11631
+ className: cn(
11632
+ "grid w-full px-[1.5rem] gap-[1.5rem] text-left items-center min-h-[3rem]",
11633
+ "focus-visible:outline-none focus-visible:shadow-[inset_0_0_0_1px_rgba(24,251,111,.75)]",
11634
+ {
11635
+ // hover effect only not for skeleton and selected
11636
+ "hover:bg-surface4": entry && !isSelected
11637
+ }
11638
+ ),
12244
11639
  style: { gridTemplateColumns: getColumnTemplate(columns) },
12245
- disabled: isLoading,
11640
+ disabled: !entry,
12246
11641
  children
12247
11642
  }
12248
11643
  )
@@ -12250,152 +11645,155 @@ function EntryListItem({
12250
11645
  );
12251
11646
  }
12252
11647
 
12253
- function EntryList({
12254
- items: dataItems,
12255
- selectedItemId,
12256
- onItemClick,
11648
+ function EntryListMessage({ children, message, className, type }) {
11649
+ if (!children && !message) {
11650
+ return null;
11651
+ }
11652
+ return /* @__PURE__ */ jsx("div", { className: cn("grid border-t border-border1", className), children: message ? /* @__PURE__ */ jsxs(
11653
+ "p",
11654
+ {
11655
+ className: cn(
11656
+ "text-icon3 text-[0.875rem] text-center grid p-[2rem] justify-center justify-items-center gap-[.5rem]",
11657
+ "[&>svg]:w-[1.5em] [&>svg]:h-[1.5em] [&>svg]:opacity-75",
11658
+ {
11659
+ "[&>svg]:text-red-500": type === "error"
11660
+ }
11661
+ ),
11662
+ children: [
11663
+ type === "error" ? /* @__PURE__ */ jsx(TriangleAlertIcon, {}) : /* @__PURE__ */ jsx(InfoIcon$1, {}),
11664
+ " ",
11665
+ message
11666
+ ]
11667
+ }
11668
+ ) : children });
11669
+ }
11670
+
11671
+ function EntryListNextPageLoading({
12257
11672
  isLoading,
12258
- isLoadingNextPage,
12259
- total,
12260
- page,
12261
11673
  hasMore,
12262
- onNextPage,
12263
- onPrevPage,
12264
- perPage,
12265
- columns,
12266
- searchTerm,
12267
11674
  setEndOfListElement,
12268
- errorMsg
11675
+ loadingText = "Loading more data...",
11676
+ noMoreDataText = "No more data to load"
12269
11677
  }) {
12270
- const loadingItems = Array.from({ length: 3 }).map((_, index) => {
12271
- return {
12272
- id: `loading-${index + 1}`,
12273
- ...(columns || []).reduce(
12274
- (acc, col) => {
12275
- acc[col.name] = `...`;
12276
- return acc;
12277
- },
12278
- {}
12279
- )
12280
- };
12281
- });
12282
- const items = isLoading ? loadingItems : dataItems;
12283
- return /* @__PURE__ */ jsxs("div", { className: "grid mb-[3rem]", children: [
12284
- /* @__PURE__ */ jsx("div", { className: cn("sticky top-0 bg-surface4 z-[1] rounded-t-lg border border-border1 px-[1.5rem]"), children: /* @__PURE__ */ jsx(
11678
+ if (!setEndOfListElement) {
11679
+ return null;
11680
+ }
11681
+ return /* @__PURE__ */ jsxs("div", { ref: setEndOfListElement, className: "text-[0.875rem] text-icon3 opacity-50 flex mt-[2rem] justify-center", children: [
11682
+ isLoading && loadingText,
11683
+ !hasMore && !isLoading && noMoreDataText
11684
+ ] });
11685
+ }
11686
+
11687
+ function EntryListPagination({ currentPage, hasMore, onNextPage, onPrevPage }) {
11688
+ const showNavigation = typeof currentPage === "number" && currentPage > 0 || hasMore;
11689
+ return /* @__PURE__ */ jsxs("div", { className: cn("flex pt-[1.5rem] items-center justify-center text-icon3 text-[0.875rem] gap-[2rem] "), children: [
11690
+ /* @__PURE__ */ jsxs("span", { children: [
11691
+ "Page ",
11692
+ /* @__PURE__ */ jsx("b", { children: currentPage ? currentPage + 1 : "1" })
11693
+ ] }),
11694
+ showNavigation && /* @__PURE__ */ jsxs(
12285
11695
  "div",
12286
- {
12287
- className: cn("grid gap-[2rem] text-left uppercase py-[.75rem] text-icon3 text-[0.75rem]"),
12288
- style: { gridTemplateColumns: getColumnTemplate(columns) },
12289
- children: columns?.map((col) => /* @__PURE__ */ jsx("span", { children: col.label || col.name }, col.name))
12290
- }
12291
- ) }),
12292
- errorMsg && !isLoading && /* @__PURE__ */ jsx("div", { className: "grid border border-border1 border-t-0 bg-surface3 rounded-xl rounded-t-none", children: /* @__PURE__ */ jsxs(
12293
- "p",
12294
11696
  {
12295
11697
  className: cn(
12296
- "text-[0.875rem] text-center items-center flex justify-center p-[2.5rem] gap-[1rem] text-icon3",
12297
- "[&>svg]:w-[1.5em]",
12298
- "[&>svg]:h-[1.5em]",
12299
- "[&>svg]:text-red-500"
11698
+ "flex gap-[1rem]",
11699
+ "[&>button]:flex [&>button]:items-center [&>button]:gap-[0.5rem] [&>button]:text-icon4 [&>button:hover]:text-icon5 [&>button]:transition-colors [&>button]:border [&>button]:border-border1 [&>button]:p-[0.25rem] [&>button]:px-[0.5rem] [&>button]:rounded-md",
11700
+ "[&_svg]:w-[1em] [&_svg]:h-[1em] [&_svg]:text-icon3"
12300
11701
  ),
12301
11702
  children: [
12302
- /* @__PURE__ */ jsx(TriangleAlertIcon, {}),
12303
- " ",
12304
- errorMsg || "Something went wrong while fetching the data."
11703
+ typeof currentPage === "number" && currentPage > 0 && /* @__PURE__ */ jsxs("button", { onClick: onPrevPage, children: [
11704
+ /* @__PURE__ */ jsx(ArrowLeftIcon, {}),
11705
+ "Previous"
11706
+ ] }),
11707
+ hasMore && /* @__PURE__ */ jsxs("button", { onClick: onNextPage, children: [
11708
+ "Next",
11709
+ /* @__PURE__ */ jsx(ArrowRightIcon, {})
11710
+ ] })
12305
11711
  ]
12306
11712
  }
12307
- ) }),
12308
- !isLoading && !errorMsg && items?.length === 0 && /* @__PURE__ */ jsx("div", { className: "grid border border-border1 border-t-0 bg-surface3 rounded-xl rounded-t-none", children: /* @__PURE__ */ jsx("p", { className: "text-icon3 text-[0.875rem] text-center h-[3.5rem] items-center flex justify-center", children: searchTerm ? `No results found for "${searchTerm}"` : "No entries found" }) }),
12309
- !errorMsg && items?.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
12310
- /* @__PURE__ */ jsx("ul", { className: "grid border border-border1 border-t-0 bg-surface3 rounded-xl rounded-t-none overflow-y-auto", children: items.map((item) => {
12311
- return /* @__PURE__ */ jsx(
12312
- EntryListItem,
12313
- {
12314
- item,
12315
- selectedItemId,
12316
- onClick: isLoading ? void 0 : onItemClick,
12317
- columns,
12318
- isLoading,
12319
- children: (columns || []).map((col, index) => {
12320
- const isValidReactElement = isValidElement(item?.[col.name]);
12321
- const key = `${index}-${item.id}`;
12322
- return isValidReactElement ? /* @__PURE__ */ jsx(React__default.Fragment, { children: item?.[col.name] }, key) : /* @__PURE__ */ jsx(EntryListTextCell, { isLoading, children: item?.[col.name] }, key);
12323
- })
12324
- },
12325
- item.id
12326
- );
12327
- }) }),
12328
- setEndOfListElement && /* @__PURE__ */ jsxs(
12329
- "div",
12330
- {
12331
- ref: setEndOfListElement,
12332
- className: "text-[0.875rem] text-icon3 opacity-50 flex mt-[2rem] justify-center",
12333
- children: [
12334
- isLoadingNextPage && "Loading...",
12335
- !hasMore && !isLoadingNextPage && !isLoading && "No more data to load"
12336
- ]
12337
- }
12338
- ),
12339
- typeof page === "number" && typeof perPage === "number" && typeof total === "number" && /* @__PURE__ */ jsxs("div", { className: cn("flex pt-[1.5rem] items-center justify-center text-icon3 text-[0.875rem] gap-[2rem]"), children: [
12340
- /* @__PURE__ */ jsxs("span", { children: [
12341
- "Page ",
12342
- page ? page + 1 : "1"
12343
- ] }),
12344
- /* @__PURE__ */ jsxs(
12345
- "div",
12346
- {
12347
- className: cn(
12348
- "flex gap-[1rem]",
12349
- "[&>button]:flex [&>button]:items-center [&>button]:gap-[0.5rem] [&>button]:text-icon4 [&>button:hover]:text-icon5 [&>button]:transition-colors [&>button]:border [&>button]:border-border1 [&>button]:p-[0.25rem] [&>button]:px-[0.5rem] [&>button]:rounded-md",
12350
- " [&_svg]:w-[1em] [&_svg]:h-[1em] [&_svg]:text-icon3"
12351
- ),
12352
- children: [
12353
- typeof page === "number" && page > 0 && /* @__PURE__ */ jsxs("button", { onClick: onPrevPage, disabled: page === 0, children: [
12354
- /* @__PURE__ */ jsx(ArrowLeftIcon, {}),
12355
- "Previous"
12356
- ] }),
12357
- hasMore && /* @__PURE__ */ jsxs("button", { onClick: onNextPage, disabled: !hasMore, children: [
12358
- "Next",
12359
- /* @__PURE__ */ jsx(ArrowRightIcon, {})
12360
- ] })
12361
- ]
12362
- }
12363
- )
12364
- ] })
11713
+ )
11714
+ ] });
11715
+ }
11716
+
11717
+ function EntryListEntryTextCol({ children, isLoading }) {
11718
+ return /* @__PURE__ */ jsx("div", { className: "text-icon4 text-[0.875rem] truncate ", children: isLoading ? /* @__PURE__ */ jsx("div", { className: "bg-surface4 rounded-md animate-pulse text-transparent h-[1rem] select-none" }) : children });
11719
+ }
11720
+ function EntryListEntryStatusCol({ status }) {
11721
+ return /* @__PURE__ */ jsxs("div", { className: cn("flex justify-center items-center w-full relative"), children: [
11722
+ status ? /* @__PURE__ */ jsx(
11723
+ "div",
11724
+ {
11725
+ className: cn("w-[0.6rem] h-[0.6rem] rounded-full", {
11726
+ "bg-green-600": status === "success",
11727
+ "bg-red-700": status === "failed"
11728
+ })
11729
+ }
11730
+ ) : /* @__PURE__ */ jsx("div", { className: "text-icon2 text-[0.75rem] leading-none", children: "-" }),
11731
+ /* @__PURE__ */ jsxs(VisuallyHidden$1, { children: [
11732
+ "Status: ",
11733
+ status ? status : "not provided"
12365
11734
  ] })
12366
11735
  ] });
12367
11736
  }
12368
11737
 
12369
- function EntryListToolbar({ children, className }) {
12370
- return /* @__PURE__ */ jsx(
12371
- "div",
12372
- {
12373
- className: cn("flex justify-between bg-surface4 z-[1] mt-[1rem] mb-[1rem] rounded-lg px-[1.5rem] ", className),
12374
- children
12375
- }
12376
- );
11738
+ const EntryList = Object.assign(EntryListRoot, {
11739
+ Header: EntryListHeader,
11740
+ Trim: EntryListTrim,
11741
+ Entries: EntryListEntries,
11742
+ Entry: EntryListEntry,
11743
+ Message: EntryListMessage,
11744
+ NextPageLoading: EntryListNextPageLoading,
11745
+ Pagination: EntryListPagination,
11746
+ EntryText: EntryListEntryTextCol,
11747
+ EntryStatus: EntryListEntryStatusCol
11748
+ });
11749
+
11750
+ const widths = ["75%", "50%", "65%", "90%", "60%", "80%"];
11751
+ function EntryListEntriesSkeleton({ columns, numberOfRows = 3 }) {
11752
+ const getPseudoRandomWidth = (rowIdx, colIdx) => {
11753
+ const index = (rowIdx + colIdx + (columns?.length || 0) + (numberOfRows || 0)) % widths.length;
11754
+ return widths[index];
11755
+ };
11756
+ return /* @__PURE__ */ jsx(EntryListEntries, { children: Array.from({ length: numberOfRows }).map((_, rowIdx) => /* @__PURE__ */ jsx(EntryListEntry, { columns, children: (columns || []).map((col, colIdx) => {
11757
+ const key = `${col.name}-${colIdx}`;
11758
+ return /* @__PURE__ */ jsx(
11759
+ "div",
11760
+ {
11761
+ className: "bg-surface4 rounded-md animate-pulse text-transparent h-[1rem] select-none",
11762
+ style: { width: `${getPseudoRandomWidth(rowIdx, colIdx)}` }
11763
+ },
11764
+ key
11765
+ );
11766
+ }) }, rowIdx)) });
12377
11767
  }
12378
11768
 
12379
- function EntryListPageHeader({ title, description, icon, children }) {
12380
- return /* @__PURE__ */ jsxs(
12381
- "div",
12382
- {
12383
- className: cn(
12384
- "grid z-[1] top-0 gap-y-[0.5rem] text-icon4 bg-surface2 py-[3rem]",
12385
- "3xl:h-full 3xl:content-start 3xl:grid-rows-[auto_1fr] h-full 3xl:overflow-y-auto"
12386
- ),
12387
- children: [
12388
- /* @__PURE__ */ jsxs("div", { className: "grid gap-[1rem] w", children: [
12389
- /* @__PURE__ */ jsxs("div", { className: cn("flex gap-[.75em] items-center", "[&>svg]:w-[1.1em] [&>svg]:h-[1.1em] [&>svg]:text-icon4"), children: [
12390
- icon,
12391
- /* @__PURE__ */ jsx("h1", { className: "text-icon6 text-[1.25rem]", children: title })
12392
- ] }),
12393
- /* @__PURE__ */ jsx("p", { className: "m-0 text-[0.875rem]", children: description })
12394
- ] }),
12395
- children
12396
- ]
12397
- }
12398
- );
11769
+ function EntryListSkeleton({ columns, numberOfRows }) {
11770
+ return /* @__PURE__ */ jsx(EntryList, { children: /* @__PURE__ */ jsxs(EntryListTrim, { children: [
11771
+ /* @__PURE__ */ jsx(EntryListHeader, { columns }),
11772
+ /* @__PURE__ */ jsx(EntryListEntriesSkeleton, { columns, numberOfRows })
11773
+ ] }) });
11774
+ }
11775
+
11776
+ function getToNextEntryFn({ entries, id, update }) {
11777
+ const currentIndex = entries.findIndex((entry) => entry.id === id);
11778
+ const thereIsNextItem = currentIndex < entries.length - 1;
11779
+ if (thereIsNextItem) {
11780
+ return () => {
11781
+ const nextItem = entries[currentIndex + 1];
11782
+ update(nextItem.id);
11783
+ };
11784
+ }
11785
+ return void 0;
11786
+ }
11787
+ function getToPreviousEntryFn({ entries, id, update }) {
11788
+ const currentIndex = entries.findIndex((entry) => entry.id === id);
11789
+ const thereIsPreviousItem = currentIndex > 0;
11790
+ if (thereIsPreviousItem) {
11791
+ return () => {
11792
+ const previousItem = entries[currentIndex - 1];
11793
+ update(previousItem.id);
11794
+ };
11795
+ }
11796
+ return void 0;
12399
11797
  }
12400
11798
 
12401
11799
  function SideDialog({
@@ -12687,26 +12085,36 @@ function EntityMainHeader({
12687
12085
  }
12688
12086
 
12689
12087
  function PageHeader({ title, description, icon, className }) {
12690
- return /* @__PURE__ */ jsxs(
12691
- "header",
12692
- {
12693
- className: cn(
12694
- "grid gap-[.5rem] pt-[2rem] pb-[2rem]",
12695
- "[&>h1]:text-icon6 [&>h1]:text-[1.25rem] [&>h1]:font-normal [&>h1]:flex [&>h1]:items-center [&>h1]:gap-[0.5rem]",
12696
- "[&_svg]:w-[1.4rem] [&_svg]:h-[1.4rem] [&_svg]:text-icon3",
12697
- "[&>p]:text-icon4 [&>p]:text-[0.875rem] [&>p]:m-0",
12698
- className
12699
- ),
12700
- children: [
12701
- /* @__PURE__ */ jsxs("h1", { children: [
12088
+ const titleIsLoading = title === "loading";
12089
+ const descriptionIsLoading = description === "loading";
12090
+ return /* @__PURE__ */ jsxs("header", { className: cn("grid gap-[.5rem] pt-[2rem] pb-[2rem]", className), children: [
12091
+ /* @__PURE__ */ jsx(
12092
+ "h1",
12093
+ {
12094
+ className: cn(
12095
+ "text-icon6 text-[1.25rem] font-normal flex items-center gap-[0.5rem]",
12096
+ "[&>svg]:w-[1.4rem] [&>svg]:h-[1.4rem] [&>svg]:text-icon3",
12097
+ {
12098
+ "bg-surface4 w-[15rem] max-w-[50%] rounded-md animate-pulse": titleIsLoading
12099
+ }
12100
+ ),
12101
+ children: titleIsLoading ? /* @__PURE__ */ jsx(Fragment, { children: " " }) : /* @__PURE__ */ jsxs(Fragment, { children: [
12702
12102
  icon && icon,
12703
12103
  " ",
12704
12104
  title
12705
- ] }),
12706
- description && /* @__PURE__ */ jsx("p", { children: description })
12707
- ]
12708
- }
12709
- );
12105
+ ] })
12106
+ }
12107
+ ),
12108
+ description && /* @__PURE__ */ jsx(
12109
+ "p",
12110
+ {
12111
+ className: cn("text-icon4 text-[0.875rem] m-0", {
12112
+ "bg-surface4 w-[40rem] max-w-[80%] rounded-md animate-pulse": descriptionIsLoading
12113
+ }),
12114
+ children: descriptionIsLoading ? /* @__PURE__ */ jsx(Fragment, { children: " " }) : description
12115
+ }
12116
+ )
12117
+ ] });
12710
12118
  }
12711
12119
 
12712
12120
  function DatePicker({ className, classNames, showOutsideDays = true, ...props }) {
@@ -13070,6 +12478,77 @@ function getShortId(id) {
13070
12478
  return id.slice(0, 8);
13071
12479
  }
13072
12480
 
12481
+ const scoresListColumns = [
12482
+ { name: "date", label: "Date", size: "4.5rem" },
12483
+ { name: "time", label: "Time", size: "6.5rem" },
12484
+ { name: "input", label: "Input", size: "1fr" },
12485
+ { name: "entityId", label: "Entity", size: "10rem" },
12486
+ { name: "score", label: "Score", size: "3rem" }
12487
+ ];
12488
+ function ScoresList({
12489
+ scores,
12490
+ pagination,
12491
+ onScoreClick,
12492
+ onPageChange,
12493
+ errorMsg,
12494
+ selectedScoreId
12495
+ }) {
12496
+ if (!scores) {
12497
+ return null;
12498
+ }
12499
+ const scoresHasMore = pagination?.hasMore;
12500
+ const handleNextPage = () => {
12501
+ if (scoresHasMore) {
12502
+ onPageChange?.(pagination.page + 1);
12503
+ }
12504
+ };
12505
+ const handlePrevPage = () => {
12506
+ if (pagination?.page && pagination.page > 0) {
12507
+ onPageChange?.(pagination.page - 1);
12508
+ }
12509
+ };
12510
+ return /* @__PURE__ */ jsxs(EntryList, { children: [
12511
+ /* @__PURE__ */ jsxs(EntryList.Trim, { children: [
12512
+ /* @__PURE__ */ jsx(EntryList.Header, { columns: scoresListColumns }),
12513
+ errorMsg ? /* @__PURE__ */ jsx(EntryList.Message, { message: errorMsg, type: "error" }) : /* @__PURE__ */ jsx(Fragment, { children: scores.length > 0 ? /* @__PURE__ */ jsx(EntryList.Entries, { children: scores.map((score) => {
12514
+ const createdAtDate = new Date(score.createdAt);
12515
+ const isTodayDate = isToday(createdAtDate);
12516
+ const entry = {
12517
+ id: score.id,
12518
+ date: isTodayDate ? "Today" : format(createdAtDate, "MMM dd"),
12519
+ time: format(createdAtDate, "h:mm:ss aaa"),
12520
+ input: JSON.stringify(score?.input),
12521
+ entityId: score.entityId,
12522
+ score: score.score
12523
+ };
12524
+ return /* @__PURE__ */ jsx(
12525
+ EntryList.Entry,
12526
+ {
12527
+ entry,
12528
+ isSelected: selectedScoreId === score.id,
12529
+ columns: scoresListColumns,
12530
+ onClick: onScoreClick,
12531
+ children: scoresListColumns.map((col, index) => {
12532
+ const key = `${index}-${score.id}`;
12533
+ return /* @__PURE__ */ jsx(EntryList.EntryText, { children: entry?.[col.name] }, key);
12534
+ })
12535
+ },
12536
+ entry.id
12537
+ );
12538
+ }) }) : /* @__PURE__ */ jsx(EntryList.Message, { message: "No scores for this scorer yet" }) })
12539
+ ] }),
12540
+ /* @__PURE__ */ jsx(
12541
+ EntryList.Pagination,
12542
+ {
12543
+ currentPage: pagination?.page || 0,
12544
+ onNextPage: handleNextPage,
12545
+ onPrevPage: handlePrevPage,
12546
+ hasMore: scoresHasMore
12547
+ }
12548
+ )
12549
+ ] });
12550
+ }
12551
+
13073
12552
  function ScoreDialog({
13074
12553
  scorer,
13075
12554
  score,
@@ -13334,34 +12813,14 @@ const EmptyScorersTable = () => /* @__PURE__ */ jsx("div", { className: "flex h-
13334
12813
  }
13335
12814
  ) });
13336
12815
 
13337
- const variantClasses$1 = {
13338
- warning: "bg-yellow-900/20 border-sm border-yellow-200 text-yellow-200",
13339
- destructive: "bg-red-900/20 border-sm border-red-200 text-red-200"
13340
- };
13341
- const variantIcons = {
13342
- warning: TriangleAlert,
13343
- destructive: AlertCircle
13344
- };
13345
- const Alert = ({ children, variant = "destructive" }) => {
13346
- const Ico = variantIcons[variant];
13347
- return /* @__PURE__ */ jsx("div", { className: clsx(variantClasses$1[variant], "p-2 rounded-md"), children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2", children: [
13348
- /* @__PURE__ */ jsx(Icon, { className: "mt-0.5", children: /* @__PURE__ */ jsx(Ico, {}) }),
13349
- /* @__PURE__ */ jsx("div", { children })
13350
- ] }) });
13351
- };
13352
- const AlertTitle = ({ children, as: As = "h5" }) => {
13353
- return /* @__PURE__ */ jsx(Txt, { as: As, variant: "ui-md", className: "font-semibold", children });
13354
- };
13355
- const AlertDescription = ({ children, as: As = "p" }) => {
13356
- return /* @__PURE__ */ jsx(Txt, { as: As, variant: "ui-sm", children });
13357
- };
13358
-
13359
12816
  const AgentMetadataModelSwitcher = ({
13360
12817
  defaultProvider,
13361
12818
  defaultModel,
13362
12819
  updateModel,
13363
12820
  apiUrl = "/api/agents/providers"
13364
12821
  }) => {
12822
+ const [originalProvider] = useState(defaultProvider);
12823
+ const [originalModel] = useState(defaultModel);
13365
12824
  const [selectedModel, setSelectedModel] = useState(defaultModel);
13366
12825
  const [showModelSuggestions, setShowModelSuggestions] = useState(false);
13367
12826
  const [selectedProvider, setSelectedProvider] = useState(defaultProvider || "");
@@ -13492,15 +12951,15 @@ const AgentMetadataModelSwitcher = ({
13492
12951
  if (modelInputRef.current === document.activeElement || providerInputRef.current === document.activeElement || showProviderSuggestions || showModelSuggestions) {
13493
12952
  return;
13494
12953
  }
13495
- const providerChanged = currentModelProvider && currentModelProvider !== defaultProvider;
12954
+ const providerChanged = currentModelProvider && currentModelProvider !== originalProvider;
13496
12955
  const modelEmpty = !selectedModel || selectedModel === "";
13497
12956
  if (providerChanged && modelEmpty) {
13498
- setSelectedProvider(cleanProviderId(defaultProvider));
13499
- setSelectedModel(defaultModel);
13500
- if (defaultProvider && defaultModel) {
12957
+ setSelectedProvider(cleanProviderId(originalProvider));
12958
+ setSelectedModel(originalModel);
12959
+ if (originalProvider && originalModel) {
13501
12960
  updateModel({
13502
- provider: defaultProvider,
13503
- modelId: defaultModel
12961
+ provider: originalProvider,
12962
+ modelId: originalModel
13504
12963
  }).catch((error) => {
13505
12964
  console.error("Failed to reset model:", error);
13506
12965
  });
@@ -13515,8 +12974,8 @@ const AgentMetadataModelSwitcher = ({
13515
12974
  registerResetFn,
13516
12975
  currentModelProvider,
13517
12976
  selectedModel,
13518
- defaultProvider,
13519
- defaultModel,
12977
+ originalProvider,
12978
+ originalModel,
13520
12979
  updateModel,
13521
12980
  showProviderSuggestions,
13522
12981
  showModelSuggestions
@@ -13527,6 +12986,27 @@ const AgentMetadataModelSwitcher = ({
13527
12986
  /* @__PURE__ */ jsx("span", { className: "text-sm text-gray-500", children: "Loading providers..." })
13528
12987
  ] });
13529
12988
  }
12989
+ const handleReset = async () => {
12990
+ setSelectedProvider(cleanProviderId(originalProvider));
12991
+ setSelectedModel(originalModel);
12992
+ setProviderSearch("");
12993
+ setModelSearch("");
12994
+ setIsSearchingProvider(false);
12995
+ setIsSearchingModel(false);
12996
+ setShowProviderSuggestions(false);
12997
+ setShowModelSuggestions(false);
12998
+ try {
12999
+ setLoading(true);
13000
+ await updateModel({
13001
+ provider: originalProvider,
13002
+ modelId: originalModel
13003
+ });
13004
+ } catch (error) {
13005
+ console.error("Failed to reset model:", error);
13006
+ } finally {
13007
+ setLoading(false);
13008
+ }
13009
+ };
13530
13010
  return /* @__PURE__ */ jsxs(Fragment, { children: [
13531
13011
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col xl:flex-row items-stretch xl:items-center gap-2 w-full", children: [
13532
13012
  /* @__PURE__ */ jsxs(
@@ -13869,14 +13349,26 @@ const AgentMetadataModelSwitcher = ({
13869
13349
  )
13870
13350
  ]
13871
13351
  }
13352
+ ),
13353
+ /* @__PURE__ */ jsx(
13354
+ Button$1,
13355
+ {
13356
+ variant: "light",
13357
+ size: "md",
13358
+ onClick: handleReset,
13359
+ disabled: loading,
13360
+ className: "flex items-center gap-1.5 text-xs whitespace-nowrap !border-0",
13361
+ title: "Reset to original model",
13362
+ children: /* @__PURE__ */ jsx(RotateCcw, { className: "w-3.5 h-3.5" })
13363
+ }
13872
13364
  )
13873
13365
  ] }),
13874
13366
  (() => {
13875
13367
  const currentProvider = providers.find((p) => p.id === currentModelProvider);
13876
13368
  if (currentProvider && !currentProvider.connected) {
13877
- return /* @__PURE__ */ jsx("div", { className: "pt-2 p-2", children: /* @__PURE__ */ jsxs(Alert, { variant: "warning", children: [
13878
- /* @__PURE__ */ jsx(AlertTitle, { as: "h5", children: "Provider not connected" }),
13879
- /* @__PURE__ */ jsxs(AlertDescription, { as: "p", children: [
13369
+ return /* @__PURE__ */ jsx("div", { className: "pt-2 p-2", children: /* @__PURE__ */ jsxs(Alert$1, { variant: "warning", children: [
13370
+ /* @__PURE__ */ jsx(AlertTitle$1, { as: "h5", children: "Provider not connected" }),
13371
+ /* @__PURE__ */ jsxs(AlertDescription$1, { as: "p", children: [
13880
13372
  "Set the",
13881
13373
  " ",
13882
13374
  /* @__PURE__ */ jsx("code", { className: "px-1 py-0.5 bg-yellow-100 dark:bg-yellow-900/50 rounded", children: Array.isArray(currentProvider.envVar) ? currentProvider.envVar.join(", ") : currentProvider.envVar }),
@@ -14050,7 +13542,7 @@ const AgentMetadata = ({
14050
13542
  {
14051
13543
  title: "Model",
14052
13544
  hint: modelVersion === "v2" ? void 0 : {
14053
- link: "https://mastra.ai/en/reference/agents/migration-guide",
13545
+ link: "https://mastra.ai/guides/migrations/vnext-to-standard-apis",
14054
13546
  title: "You are using a legacy v1 model",
14055
13547
  icon: /* @__PURE__ */ jsx(AlertTriangleIcon, { fontSize: 14, className: "mb-0.5" })
14056
13548
  },
@@ -14073,9 +13565,9 @@ const AgentMetadata = ({
14073
13565
  link: "https://mastra.ai/en/docs/agents/agent-memory",
14074
13566
  title: "Agent Memory documentation"
14075
13567
  },
14076
- children: hasMemoryEnabled ? /* @__PURE__ */ jsx(Badge$1, { icon: /* @__PURE__ */ jsx(MemoryIcon, {}), variant: "success", className: "font-medium", children: "On" }) : /* @__PURE__ */ jsxs(Alert, { variant: "warning", children: [
14077
- /* @__PURE__ */ jsx(AlertTitle, { as: "h5", children: "Memory not enabled" }),
14078
- /* @__PURE__ */ jsxs(AlertDescription, { as: "p", children: [
13568
+ children: hasMemoryEnabled ? /* @__PURE__ */ jsx(Badge$1, { icon: /* @__PURE__ */ jsx(MemoryIcon, {}), variant: "success", className: "font-medium", children: "On" }) : /* @__PURE__ */ jsxs(Alert$1, { variant: "warning", children: [
13569
+ /* @__PURE__ */ jsx(AlertTitle$1, { as: "h5", children: "Memory not enabled" }),
13570
+ /* @__PURE__ */ jsxs(AlertDescription$1, { as: "p", children: [
14079
13571
  "Thread messages will not be stored. To activate memory, see the",
14080
13572
  " ",
14081
13573
  /* @__PURE__ */ jsx(
@@ -17075,6 +16567,76 @@ function TracesTools({
17075
16567
  ] });
17076
16568
  }
17077
16569
 
16570
+ const tracesListColumns = [
16571
+ { name: "shortId", label: "ID", size: "6rem" },
16572
+ { name: "date", label: "Date", size: "4.5rem" },
16573
+ { name: "time", label: "Time", size: "6.5rem" },
16574
+ { name: "name", label: "Name", size: "1fr" },
16575
+ { name: "entityId", label: "Entity", size: "10rem" },
16576
+ { name: "status", label: "Status", size: "3rem" }
16577
+ ];
16578
+ function TracesList({
16579
+ traces,
16580
+ selectedTraceId,
16581
+ onTraceClick,
16582
+ errorMsg,
16583
+ setEndOfListElement,
16584
+ filtersApplied,
16585
+ isFetchingNextPage,
16586
+ hasNextPage
16587
+ }) {
16588
+ if (!traces) {
16589
+ return null;
16590
+ }
16591
+ return /* @__PURE__ */ jsxs(EntryList, { children: [
16592
+ /* @__PURE__ */ jsxs(EntryList.Trim, { children: [
16593
+ /* @__PURE__ */ jsx(EntryList.Header, { columns: tracesListColumns }),
16594
+ errorMsg ? /* @__PURE__ */ jsx(EntryList.Message, { message: errorMsg, type: "error" }) : /* @__PURE__ */ jsx(Fragment, { children: traces.length > 0 ? /* @__PURE__ */ jsx(EntryList.Entries, { children: traces.map((trace) => {
16595
+ const createdAtDate = new Date(trace.createdAt);
16596
+ const isTodayDate = isToday(createdAtDate);
16597
+ const entry = {
16598
+ id: trace.traceId,
16599
+ shortId: getShortId(trace?.traceId) || "n/a",
16600
+ date: isTodayDate ? "Today" : format(createdAtDate, "MMM dd"),
16601
+ time: format(createdAtDate, "h:mm:ss aaa"),
16602
+ name: trace?.name,
16603
+ entityId: trace?.attributes?.agentId || trace?.attributes?.workflowId,
16604
+ status: trace?.attributes?.status
16605
+ };
16606
+ return /* @__PURE__ */ jsx(
16607
+ EntryList.Entry,
16608
+ {
16609
+ entry,
16610
+ isSelected: selectedTraceId === trace.traceId,
16611
+ columns: tracesListColumns,
16612
+ onClick: onTraceClick,
16613
+ children: tracesListColumns.map((col, index) => {
16614
+ const key = `${index}-${trace.traceId}`;
16615
+ return col.name === "status" ? /* @__PURE__ */ jsx(EntryList.EntryStatus, { status: entry?.[col.name] }, key) : /* @__PURE__ */ jsx(EntryList.EntryText, { children: entry?.[col.name] }, key);
16616
+ })
16617
+ },
16618
+ entry.id
16619
+ );
16620
+ }) }) : /* @__PURE__ */ jsx(
16621
+ EntryList.Message,
16622
+ {
16623
+ message: filtersApplied ? "No traces found for applied filters" : "No traces found yet"
16624
+ }
16625
+ ) })
16626
+ ] }),
16627
+ /* @__PURE__ */ jsx(
16628
+ EntryList.NextPageLoading,
16629
+ {
16630
+ setEndOfListElement,
16631
+ loadingText: "Loading more traces...",
16632
+ noMoreDataText: "All traces loaded",
16633
+ isLoading: isFetchingNextPage,
16634
+ hasMore: hasNextPage
16635
+ }
16636
+ )
16637
+ ] });
16638
+ }
16639
+
17078
16640
  function MainContentLayout({
17079
16641
  children,
17080
16642
  className,
@@ -17822,5 +17384,5 @@ const WorkflowRunStatusBadge = ({ status }) => {
17822
17384
  return /* @__PURE__ */ jsx(Badge$1, { variant: "default", children: status });
17823
17385
  };
17824
17386
 
17825
- export { AgentChat, AgentCoinIcon, AgentEntityHeader, AgentEvals, AgentIcon, AgentMetadata, AgentMetadataList, AgentMetadataListEmpty, AgentMetadataListItem, AgentMetadataNetworkList, AgentMetadataPrompt, AgentMetadataScorerList, AgentMetadataSection, AgentMetadataToolList, AgentMetadataWorkflowList, AgentMetadataWrapper, AgentNetworkCoinIcon, AgentSettings, AgentSettingsContext, AgentSettingsProvider, AgentsTable, AiIcon, Alert, AlertDescription, AlertDialog, AlertTitle, ApiIcon, Badge$1 as Badge, BranchIcon, Breadcrumb, Button$1 as Button, Cell, ChatThreads, CheckIcon, ChevronIcon, Collapsible, CollapsibleContent, CollapsibleTrigger, CommitIcon, CrossIcon, Crumb, DarkLogo, DateTimeCell, DateTimePicker, DateTimePickerContent, DbIcon, DebugIcon, DefaultTrigger, DeploymentIcon, DividerIcon, DocsIcon, DynamicForm, EmptyState, Entity, EntityContent, EntityDescription, EntityHeader, EntityIcon, EntityMainHeader, EntityName, Entry, EntryCell, EntryList, EntryListItem, EntryListPageHeader, EntryListStatusCell, EntryListTextCell, EntryListToolbar, EnvIcon, EvaluatorCoinIcon, FiltersIcon, FolderIcon, FormActions, GithubCoinIcon, GithubIcon, GoogleIcon, Header, HeaderAction, HeaderGroup, HeaderTitle, HomeIcon, Icon, InfoIcon, InputField, JudgeIcon, Kbd, KeyValueList, LatencyIcon, LinkComponentProvider, LogsIcon, MCPTable, MainContentContent, MainContentLayout, MastraResizablePanel, McpCoinIcon, McpServerIcon, MemoryIcon, MemorySearch, ModelResetProvider, OpenAIIcon, PageHeader, PlaygroundQueryClient, PlaygroundTabs, PromptIcon, RadioGroup, RadioGroupField, RadioGroupItem, RepoIcon, Row, RuntimeContext, RuntimeContextWrapper, ScoreDialog, ScoreIcon, ScorersTable, ScoresTools, SearchField, Searchbar, SearchbarWrapper, SelectField, SettingsIcon, SideDialog, SideDialogCodeSection, SideDialogContent, SideDialogFooter, SideDialogFooterGroup, SideDialogHeader, SideDialogHeading, SideDialogKeyValueList, SideDialogSection, SideDialogTop, SlashIcon, SliderField, Tab, TabContent, TabList, Table$1 as Table, Tbody, TemplateFailure, TemplateForm, TemplateInfo, TemplateInstallation, TemplateSuccess, TemplatesList, TemplatesTools, TextAndIcon, TextareaField, Th, Thead, ThreadDeleteButton, ThreadInputProvider, ThreadItem, ThreadLink, ThreadList, Threads, ToolCoinIcon, ToolFallback, ToolTable, ToolsIcon, TraceDialog, TraceIcon, TraceTimeline, TraceTimelineLegend, TraceTimelineSpan, TracesTools, TracesView, TracesViewSkeleton, TsIcon, Txt, TxtCell, UnitCell, VariablesIcon, WorkflowCoinIcon, WorkflowGraph, WorkflowIcon, WorkflowRunContext, WorkflowRunDetail, WorkflowRunList, WorkflowRunProvider, WorkflowTable, WorkflowTrigger, WorkingMemoryContext, WorkingMemoryProvider, allowedAiSpanAttributes, cleanString, convertWorkflowRunStateToStreamResult, formatDuration, formatHierarchicalSpans, formatOtelTimestamp, formatOtelTimestamp2, getColumnTemplate, getShortId, getSpanTypeUi, parseError, providerMapToIcon, spanTypePrefixes, transformKey, useAgentSettings, useCurrentRun, useInView, useLinkComponent, useMCPServerTools, useModelReset, usePlaygroundStore, usePolling, useScorer, useScorers, useScoresByEntityId, useScoresByScorerId, useSpeechRecognition, useThreadInput, useWorkflow, useWorkflowRuns, useWorkingMemory };
17387
+ export { AgentChat, AgentCoinIcon, AgentEntityHeader, AgentEvals, AgentIcon, AgentMetadata, AgentMetadataList, AgentMetadataListEmpty, AgentMetadataListItem, AgentMetadataNetworkList, AgentMetadataPrompt, AgentMetadataScorerList, AgentMetadataSection, AgentMetadataToolList, AgentMetadataWorkflowList, AgentMetadataWrapper, AgentNetworkCoinIcon, AgentSettings, AgentSettingsContext, AgentSettingsProvider, AgentsTable, AiIcon, Alert$1 as Alert, AlertDescription$1 as AlertDescription, AlertDialog, AlertTitle$1 as AlertTitle, ApiIcon, Badge$1 as Badge, BranchIcon, Breadcrumb, Button$1 as Button, Cell, ChatThreads, CheckIcon, ChevronIcon, Collapsible, CollapsibleContent, CollapsibleTrigger, CommitIcon, CrossIcon, Crumb, DarkLogo, DateTimeCell, DateTimePicker, DateTimePickerContent, DbIcon, DebugIcon, DefaultTrigger, DeploymentIcon, DividerIcon, DocsIcon, DynamicForm, EmptyState, Entity, EntityContent, EntityDescription, EntityHeader, EntityIcon, EntityMainHeader, EntityName, Entry, EntryCell, EntryList, EntryListSkeleton, EnvIcon, EvaluatorCoinIcon, FiltersIcon, FolderIcon, FormActions, GithubCoinIcon, GithubIcon, GoogleIcon, Header, HeaderAction, HeaderGroup, HeaderTitle, HomeIcon, Icon, InfoIcon, InputField, JudgeIcon, Kbd, KeyValueList, LatencyIcon, LinkComponentProvider, LogsIcon, MCPTable, MainContentContent, MainContentLayout, MastraResizablePanel, McpCoinIcon, McpServerIcon, MemoryIcon, MemorySearch, ModelResetProvider, OpenAIIcon, PageHeader, PlaygroundQueryClient, PlaygroundTabs, PromptIcon, RadioGroup, RadioGroupField, RadioGroupItem, RepoIcon, Row, RuntimeContext, RuntimeContextWrapper, ScoreDialog, ScoreIcon, ScorersTable, ScoresList, ScoresTools, SearchField, Searchbar, SearchbarWrapper, SelectField, SettingsIcon, SideDialog, SideDialogCodeSection, SideDialogContent, SideDialogFooter, SideDialogFooterGroup, SideDialogHeader, SideDialogHeading, SideDialogKeyValueList, SideDialogSection, SideDialogTop, SlashIcon, SliderField, Tab, TabContent, TabList, Table$1 as Table, Tbody, TemplateFailure, TemplateForm, TemplateInfo, TemplateInstallation, TemplateSuccess, TemplatesList, TemplatesTools, TextAndIcon, TextareaField, Th, Thead, ThreadDeleteButton, ThreadInputProvider, ThreadItem, ThreadLink, ThreadList, Threads, ToolCoinIcon, ToolFallback, ToolTable, ToolsIcon, TraceDialog, TraceIcon, TraceTimeline, TraceTimelineLegend, TraceTimelineSpan, TracesList, TracesTools, TracesView, TracesViewSkeleton, TsIcon, Txt, TxtCell, UnitCell, VariablesIcon, WorkflowCoinIcon, WorkflowGraph, WorkflowIcon, WorkflowRunContext, WorkflowRunDetail, WorkflowRunList, WorkflowRunProvider, WorkflowTable, WorkflowTrigger, WorkingMemoryContext, WorkingMemoryProvider, allowedAiSpanAttributes, cleanString, convertWorkflowRunStateToStreamResult, extractPrompt, formatDuration, formatHierarchicalSpans, formatOtelTimestamp, formatOtelTimestamp2, getColumnTemplate, getShortId, getSpanTypeUi, getToNextEntryFn, getToPreviousEntryFn, parseError, providerMapToIcon, scoresListColumns, spanTypePrefixes, tracesListColumns, transformKey, useAgentSettings, useCurrentRun, useInView, useLinkComponent, useMCPServerTools, useModelReset, usePlaygroundStore, usePolling, useScorer, useScorers, useScoresByEntityId, useScoresByScorerId, useSpeechRecognition, useThreadInput, useWorkflow, useWorkflowRuns, useWorkingMemory };
17826
17388
  //# sourceMappingURL=index.es.js.map