@mastra/playground-ui 6.2.1 → 6.2.2-alpha.2

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 (18) hide show
  1. package/CHANGELOG.md +42 -0
  2. package/dist/index.cjs.js +110 -73
  3. package/dist/index.cjs.js.map +1 -1
  4. package/dist/index.es.js +110 -73
  5. package/dist/index.es.js.map +1 -1
  6. package/dist/src/components/assistant-ui/tools/badges/tool-badge.d.ts +4 -1
  7. package/dist/src/components/ui/syntax-highlighter.d.ts +2 -2
  8. package/dist/src/domains/agents/components/agent-metadata/agent-metadata.d.ts +7 -19
  9. package/dist/src/domains/agents/components/agent-table/agent-table.d.ts +1 -2
  10. package/dist/src/domains/agents/components/chat-threads.d.ts +3 -3
  11. package/dist/src/domains/networks/components/network-table/network-table.d.ts +1 -2
  12. package/dist/src/domains/observability/components/helpers.d.ts +1 -1
  13. package/dist/src/domains/observability/components/trace-dialog.d.ts +1 -3
  14. package/dist/src/domains/scores/components/scorers-table/scorers-table.d.ts +1 -2
  15. package/dist/src/domains/tools/components/tool-list.d.ts +1 -3
  16. package/dist/src/domains/workflows/components/workflow-table/workflow-table.d.ts +1 -2
  17. package/dist/src/lib/framework.d.ts +18 -1
  18. package/package.json +9 -10
package/dist/src/components/assistant-ui/tools/badges/tool-badge.d.ts CHANGED
@@ -6,5 +6,8 @@ export interface ToolBadgeProps {
6
6
  input?: string | Record<string, unknown>;
7
7
  selectionReason?: string;
8
8
  };
9
+ toolOutput: Array<{
10
+ toolId: string;
11
+ }>;
9
12
  }
10
- export declare const ToolBadge: ({ toolName, args, result, networkMetadata }: ToolBadgeProps) => import("react/jsx-runtime").JSX.Element;
13
+ export declare const ToolBadge: ({ toolName, args, result, networkMetadata, toolOutput }: ToolBadgeProps) => import("react/jsx-runtime").JSX.Element;
package/dist/src/components/ui/syntax-highlighter.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  export declare const useCodemirrorTheme: () => import('@uiw/react-codemirror').Extension;
2
- export declare const SyntaxHighlighter: ({ data, className }: {
3
- data: Record<string, unknown>;
2
+ export declare const SyntaxHighlighter: ({ data, className, }: {
3
+ data: Record<string, unknown> | Array<Record<string, unknown>>;
4
4
  className?: string;
5
5
  }) => import("react/jsx-runtime").JSX.Element;
6
6
  export declare function highlight(code: string, language: string): Promise<import('shiki').ThemedToken[][] | null>;
package/dist/src/domains/agents/components/agent-metadata/agent-metadata.d.ts CHANGED
@@ -2,16 +2,10 @@ import { GetAgentResponse, GetToolResponse, GetWorkflowResponse } from '@mastra/
2
2
  import { ReactNode } from '../../../../../node_modules/@types/react';
3
3
  import { AgentMetadataModelSwitcherProps } from './agent-metadata-model-switcher';
4
4
  export interface AgentMetadataProps {
5
+ agentId: string;
5
6
  agent: GetAgentResponse;
6
7
  promptSlot: ReactNode;
7
8
  hasMemoryEnabled: boolean;
8
- computeAgentLink: (agent: {
9
- id: string;
10
- name: string;
11
- }) => string;
12
- computeToolLink: (tool: GetToolResponse) => string;
13
- computeWorkflowLink: (workflowId: string, workflow: GetWorkflowResponse) => string;
14
- computeScorerLink: (scorerId: string) => string;
15
9
  modelProviders: string[];
16
10
  updateModel: AgentMetadataModelSwitcherProps['updateModel'];
17
11
  }
@@ -20,29 +14,23 @@ export interface AgentMetadataNetworkListProps {
20
14
  id: string;
21
15
  name: string;
22
16
  }[];
23
- computeAgentLink: (agent: {
24
- id: string;
25
- name: string;
26
- }) => string;
27
17
  }
28
- export declare const AgentMetadataNetworkList: ({ agents, computeAgentLink }: AgentMetadataNetworkListProps) => import("react/jsx-runtime").JSX.Element;
29
- export declare const AgentMetadata: ({ agent, promptSlot, hasMemoryEnabled, computeAgentLink, computeToolLink, computeWorkflowLink, computeScorerLink, updateModel, modelProviders, }: AgentMetadataProps) => import("react/jsx-runtime").JSX.Element;
18
+ export declare const AgentMetadataNetworkList: ({ agents }: AgentMetadataNetworkListProps) => import("react/jsx-runtime").JSX.Element;
19
+ export declare const AgentMetadata: ({ agentId, agent, promptSlot, hasMemoryEnabled, updateModel, modelProviders, }: AgentMetadataProps) => import("react/jsx-runtime").JSX.Element;
30
20
  export interface AgentMetadataToolListProps {
31
21
  tools: GetToolResponse[];
32
- computeToolLink: (tool: GetToolResponse) => string;
22
+ agentId: string;
33
23
  }
34
- export declare const AgentMetadataToolList: ({ tools, computeToolLink }: AgentMetadataToolListProps) => import("react/jsx-runtime").JSX.Element;
24
+ export declare const AgentMetadataToolList: ({ tools, agentId }: AgentMetadataToolListProps) => import("react/jsx-runtime").JSX.Element;
35
25
  export interface AgentMetadataWorkflowListProps {
36
26
  workflows: Array<{
37
27
  id: string;
38
28
  } & GetWorkflowResponse>;
39
- computeWorkflowLink: (workflowId: string, workflow: GetWorkflowResponse) => string;
40
29
  }
41
- export declare const AgentMetadataWorkflowList: ({ workflows, computeWorkflowLink }: AgentMetadataWorkflowListProps) => import("react/jsx-runtime").JSX.Element;
30
+ export declare const AgentMetadataWorkflowList: ({ workflows }: AgentMetadataWorkflowListProps) => import("react/jsx-runtime").JSX.Element;
42
31
  interface AgentMetadataScorerListProps {
43
- computeScorerLink: (scorerId: string) => string;
44
32
  entityId: string;
45
33
  entityType: string;
46
34
  }
47
- export declare const AgentMetadataScorerList: ({ entityId, entityType, computeScorerLink }: AgentMetadataScorerListProps) => import("react/jsx-runtime").JSX.Element;
35
+ export declare const AgentMetadataScorerList: ({ entityId, entityType }: AgentMetadataScorerListProps) => import("react/jsx-runtime").JSX.Element;
48
36
  export {};
package/dist/src/domains/agents/components/agent-table/agent-table.d.ts CHANGED
@@ -2,8 +2,7 @@ import { GetAgentResponse } from '@mastra/client-js';
2
2
  export interface AgentsTableProps {
3
3
  agents: Record<string, GetAgentResponse>;
4
4
  isLoading: boolean;
5
- computeLink: (agentId: string) => string;
6
5
  }
7
- export declare function AgentsTable({ agents, isLoading, computeLink }: AgentsTableProps): import("react/jsx-runtime").JSX.Element;
6
+ export declare function AgentsTable({ agents, isLoading }: AgentsTableProps): import("react/jsx-runtime").JSX.Element;
8
7
  export declare const AgentsTableSkeleton: () => import("react/jsx-runtime").JSX.Element;
9
8
  export declare const EmptyAgentsTable: () => import("react/jsx-runtime").JSX.Element;
package/dist/src/domains/agents/components/chat-threads.d.ts CHANGED
@@ -1,10 +1,10 @@
1
1
  import { StorageThreadType } from '@mastra/core/memory';
2
2
  export interface ChatThreadsProps {
3
- computeNewThreadLink: () => string;
4
- computeThreadLink: (threadId: string) => string;
5
3
  threads: StorageThreadType[];
6
4
  isLoading: boolean;
7
5
  threadId: string;
8
6
  onDelete: (threadId: string) => void;
7
+ resourceId: string;
8
+ resourceType: 'agent' | 'network';
9
9
  }
10
- export declare const ChatThreads: ({ computeNewThreadLink, computeThreadLink, threads, isLoading, threadId, onDelete, }: ChatThreadsProps) => import("react/jsx-runtime").JSX.Element;
10
+ export declare const ChatThreads: ({ threads, isLoading, threadId, onDelete, resourceId, resourceType }: ChatThreadsProps) => import("react/jsx-runtime").JSX.Element;
package/dist/src/domains/networks/components/network-table/network-table.d.ts CHANGED
@@ -2,8 +2,7 @@ import { GetVNextNetworkResponse } from '@mastra/client-js';
2
2
  export interface NetworkTableProps {
3
3
  networks: GetVNextNetworkResponse[];
4
4
  isLoading: boolean;
5
- computeLink: (networkId: string) => string;
6
5
  }
7
- export declare const NetworkTable: ({ networks, isLoading, computeLink }: NetworkTableProps) => import("react/jsx-runtime").JSX.Element;
6
+ export declare const NetworkTable: ({ networks, isLoading }: NetworkTableProps) => import("react/jsx-runtime").JSX.Element;
8
7
  export declare const NetworkTableEmpty: () => import("react/jsx-runtime").JSX.Element;
9
8
  export declare const NetworkTableSkeleton: () => import("react/jsx-runtime").JSX.Element;
package/dist/src/domains/observability/components/helpers.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { AISpanRecord } from '@mastra/core';
2
- export declare function getTraceInfo(trace: AISpanRecord | undefined, computeAgentsLink?: () => string, computeWorkflowsLink?: () => string): {
2
+ export declare function useTraceInfo(trace: AISpanRecord | undefined): {
3
3
  key: string;
4
4
  label: string;
5
5
  value: any;
package/dist/src/domains/observability/components/trace-dialog.d.ts CHANGED
@@ -8,8 +8,6 @@ type TraceDialogProps = {
8
8
  onNext?: () => void;
9
9
  onPrevious?: () => void;
10
10
  isLoadingSpans?: boolean;
11
- computeAgentsLink?: () => string;
12
- computeWorkflowsLink?: () => string;
13
11
  };
14
- export declare function TraceDialog({ traceId, traceSpans, traceDetails, isOpen, onClose, onNext, onPrevious, isLoadingSpans, computeAgentsLink, computeWorkflowsLink, }: TraceDialogProps): import("react/jsx-runtime").JSX.Element;
12
+ export declare function TraceDialog({ traceId, traceSpans, traceDetails, isOpen, onClose, onNext, onPrevious, isLoadingSpans, }: TraceDialogProps): import("react/jsx-runtime").JSX.Element;
15
13
  export {};
package/dist/src/domains/scores/components/scorers-table/scorers-table.d.ts CHANGED
@@ -2,8 +2,7 @@ import { GetScorerResponse } from '@mastra/client-js';
2
2
  export interface ScorersTableProps {
3
3
  scorers: Record<string, GetScorerResponse>;
4
4
  isLoading: boolean;
5
- computeScorerLink: (scorerId: string) => string;
6
5
  }
7
- export declare function ScorersTable({ scorers, isLoading, computeScorerLink }: ScorersTableProps): import("react/jsx-runtime").JSX.Element;
6
+ export declare function ScorersTable({ scorers, isLoading }: ScorersTableProps): import("react/jsx-runtime").JSX.Element;
8
7
  export declare const ScorersTableSkeleton: () => import("react/jsx-runtime").JSX.Element;
9
8
  export declare const EmptyScorersTable: () => import("react/jsx-runtime").JSX.Element;
package/dist/src/domains/tools/components/tool-list.d.ts CHANGED
@@ -3,9 +3,7 @@ export interface ToolListProps {
3
3
  isLoading: boolean;
4
4
  tools: Record<string, GetToolResponse>;
5
5
  agents: Record<string, GetAgentResponse>;
6
- computeLink: (toolId: string, agentId?: string) => string;
7
- computeAgentLink: (toolId: string, agentId: string) => string;
8
6
  }
9
- export declare const ToolList: ({ tools, agents, isLoading, computeLink, computeAgentLink }: ToolListProps) => import("react/jsx-runtime").JSX.Element;
7
+ export declare const ToolList: ({ tools, agents, isLoading }: ToolListProps) => import("react/jsx-runtime").JSX.Element;
10
8
  export declare const ToolListSkeleton: () => import("react/jsx-runtime").JSX.Element;
11
9
  export declare const ToolListEmpty: () => import("react/jsx-runtime").JSX.Element;
package/dist/src/domains/workflows/components/workflow-table/workflow-table.d.ts CHANGED
@@ -3,8 +3,7 @@ export interface WorkflowTableProps {
3
3
  workflows?: Record<string, GetWorkflowResponse>;
4
4
  legacyWorkflows?: Record<string, GetLegacyWorkflowResponse>;
5
5
  isLoading: boolean;
6
- computeLink: (agentId: string) => string;
7
6
  }
8
- export declare function WorkflowTable({ workflows, legacyWorkflows, isLoading, computeLink }: WorkflowTableProps): import("react/jsx-runtime").JSX.Element;
7
+ export declare function WorkflowTable({ workflows, legacyWorkflows, isLoading }: WorkflowTableProps): import("react/jsx-runtime").JSX.Element;
9
8
  export declare const WorkflowTableSkeleton: () => import("react/jsx-runtime").JSX.Element;
10
9
  export declare const EmptyWorkflowsTable: () => import("react/jsx-runtime").JSX.Element;
package/dist/src/lib/framework.d.ts CHANGED
@@ -1,13 +1,30 @@
1
1
  import { AnchorHTMLAttributes, ForwardRefExoticComponent, RefAttributes } from '../../node_modules/@types/react';
2
2
  export type LinkComponentProps = AnchorHTMLAttributes<HTMLAnchorElement>;
3
3
  export type LinkComponent = ForwardRefExoticComponent<LinkComponentProps & RefAttributes<HTMLAnchorElement>>;
4
+ type LinkComponentPaths = {
5
+ agentLink: (agentId: string) => string;
6
+ agentsLink: () => string;
7
+ agentToolLink: (agentId: string, toolId: string) => string;
8
+ agentThreadLink: (agentId: string, threadId: string) => string;
9
+ agentNewThreadLink: (agentId: string) => string;
10
+ workflowsLink: () => string;
11
+ workflowLink: (workflowId: string) => string;
12
+ networkLink: (networkId: string) => string;
13
+ networkNewThreadLink: (networkId: string) => string;
14
+ networkThreadLink: (networkId: string, threadId: string) => string;
15
+ scorerLink: (scorerId: string) => string;
16
+ toolLink: (toolId: string) => string;
17
+ };
4
18
  export interface LinkComponentProviderProps {
5
19
  children: React.ReactNode;
6
20
  Link: LinkComponent;
7
21
  navigate: (path: string) => void;
22
+ paths: LinkComponentPaths;
8
23
  }
9
- export declare const LinkComponentProvider: ({ children, Link, navigate }: LinkComponentProviderProps) => import("react/jsx-runtime").JSX.Element;
24
+ export declare const LinkComponentProvider: ({ children, Link, navigate, paths }: LinkComponentProviderProps) => import("react/jsx-runtime").JSX.Element;
10
25
  export declare const useLinkComponent: () => {
11
26
  Link: LinkComponent;
12
27
  navigate: (path: string) => void;
28
+ paths: LinkComponentPaths;
13
29
  };
30
+ export {};
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@mastra/playground-ui",
3
3
  "type": "module",
4
- "version": "6.2.1",
4
+ "version": "6.2.2-alpha.2",
5
5
  "description": "Mastra Playground components",
6
6
  "main": "dist/index.umd.js",
7
7
  "module": "dist/index.es.js",
@@ -73,11 +73,11 @@
73
73
  "@types/react-syntax-highlighter": "^15.5.13",
74
74
  "@uiw/codemirror-theme-dracula": "^4.23.14",
75
75
  "@uiw/react-codemirror": "^4.23.14",
76
- "@xyflow/react": "^12.8.4",
76
+ "@xyflow/react": "^12.8.5",
77
77
  "cmdk": "^1.1.1",
78
78
  "date-fns": "^4.1.0",
79
79
  "json-schema-to-zod": "^2.6.1",
80
- "motion": "^12.23.12",
80
+ "motion": "^12.23.13",
81
81
  "prettier": "^3.6.2",
82
82
  "prism-react-renderer": "^2.4.1",
83
83
  "react-code-block": "1.1.3",
@@ -93,16 +93,15 @@
93
93
  "shiki": "^1.29.2",
94
94
  "sonner": "^2.0.5",
95
95
  "superjson": "^2.2.2",
96
- "swr": "^2.3.6",
97
96
  "tailwindcss-animate": "^1.0.7",
98
97
  "unified": "^11.0.5",
99
98
  "use-debounce": "^10.0.6",
100
- "zod": "^4.1.5",
99
+ "zod": "^4.1.9",
101
100
  "zustand": "^5.0.8",
102
- "@mastra/client-js": "^0.13.1"
101
+ "@mastra/client-js": "^0.13.2-alpha.2"
103
102
  },
104
103
  "peerDependencies": {
105
- "@mastra/core": ">=0.17.0-0 <0.18.0-0",
104
+ "@mastra/core": ">=0.18.0-0 <0.19.0-0",
106
105
  "lucide-react": "^0.474.0",
107
106
  "react": ">=19.0.0",
108
107
  "react-dom": ">=19.0.0",
@@ -110,7 +109,7 @@
110
109
  },
111
110
  "devDependencies": {
112
111
  "@storybook/addon-docs": "^9.1.5",
113
- "@storybook/react-vite": "^9.1.5",
112
+ "@storybook/react-vite": "^9.1.6",
114
113
  "@types/node": "^20.19.0",
115
114
  "@types/react": "^19.1.9",
116
115
  "@types/react-dom": "^19.1.7",
@@ -120,14 +119,14 @@
120
119
  "clsx": "^2.1.1",
121
120
  "postcss": "^8.5.6",
122
121
  "rollup-plugin-node-externals": "^8.0.1",
123
- "storybook": "^9.1.5",
122
+ "storybook": "^9.1.6",
124
123
  "tailwind-merge": "^3.3.1",
125
124
  "tailwindcss": "^3.4.17",
126
125
  "typescript": "^5.8.3",
127
126
  "vite": "^6.3.6",
128
127
  "vite-plugin-dts": "^4.5.4",
129
128
  "vite-plugin-lib-inject-css": "^2.2.2",
130
- "@mastra/core": "0.17.1"
129
+ "@mastra/core": "0.18.0-alpha.2"
131
130
  },
132
131
  "homepage": "https://mastra.ai",
133
132
  "repository": {