@mastra/playground-ui 7.0.0-beta.14 → 7.0.0-beta.15

package/dist/src/components/ui/containers/MainContent.d.ts

@@ -11,3 +11,10 @@ export declare function MainContentContent({ children, className, isCentered, is
     isDivided?: boolean;
     hasLeftServiceColumn?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
+export type GetMainContentContentClassNameArgs = {
+    isCentered: boolean;
+    isDivided: boolean;
+    hasLeftServiceColumn: boolean;
+    className?: string;
+};
+export declare const getMainContentContentClassName: ({ isCentered, isDivided, hasLeftServiceColumn, className, }: GetMainContentContentClassNameArgs) => string;

package/dist/src/domains/agents/components/agent-layout.d.ts

@@ -0,0 +1,7 @@
+export interface AgentLayoutProps {
+    agentId: string;
+    children: React.ReactNode;
+    leftSlot?: React.ReactNode;
+    rightSlot?: React.ReactNode;
+}
+export declare const AgentLayout: ({ agentId, children, leftSlot, rightSlot }: AgentLayoutProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/domains/agents/index.d.ts

@@ -16,3 +16,4 @@ export * from './components/AgentToolPanel';
 export * from './components/agent-information/agent-information';
 export * from './components/agent-entity-header';
 export * from './components/agent-information/agent-memory';
+export * from './components/agent-layout';

package/dist/src/domains/configuration/components/mastra-version-footer.d.ts

@@ -0,0 +1,17 @@
+import { PackageUpdateInfo } from '../hooks/use-package-updates';
+export interface MastraVersionFooterProps {
+    collapsed?: boolean;
+}
+type PackageManager = 'pnpm' | 'npm' | 'yarn' | 'bun';
+export declare const MastraVersionFooter: ({ collapsed }: MastraVersionFooterProps) => import("react/jsx-runtime").JSX.Element | null;
+export interface PackagesModalContentProps {
+    packages: PackageUpdateInfo[];
+    isLoadingUpdates: boolean;
+    outdatedCount: number;
+    deprecatedCount: number;
+    updateCommand: string | null;
+    packageManager: PackageManager;
+    onPackageManagerChange: (pm: PackageManager) => void;
+}
+export declare const MastraPackagesInfo: ({ collapsed }: MastraVersionFooterProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/src/domains/configuration/hooks/use-mastra-packages.d.ts

@@ -0,0 +1 @@
+export declare const useMastraPackages: () => import('@tanstack/react-query').UseQueryResult<import('@mastra/client-js').GetSystemPackagesResponse, Error>;

package/dist/src/domains/configuration/hooks/use-package-updates.d.ts

@@ -0,0 +1,18 @@
+export interface PackageInfo {
+    name: string;
+    version: string;
+}
+export interface PackageUpdateInfo extends PackageInfo {
+    latestVersion: string | null;
+    isOutdated: boolean;
+    isDeprecated: boolean;
+    prereleaseTag: string | null;
+    targetPrereleaseTag: string | null;
+    deprecationMessage?: string;
+}
+export declare function usePackageUpdates(packages: PackageInfo[]): {
+    packages: PackageUpdateInfo[];
+    isLoading: boolean;
+    outdatedCount: number;
+    deprecatedCount: number;
+};

package/dist/src/domains/configuration/index.d.ts

@@ -1,4 +1,7 @@
 export * from './context/studio-config-context';
 export * from './components/studio-config-form';
+export * from './components/mastra-version-footer';
 export * from './types';
 export * from './components/playground-config-guard';
+export * from './hooks/use-mastra-packages';
+export * from './hooks/use-package-updates';

package/dist/src/domains/observability/components/helpers.d.ts

@@ -1,9 +1,17 @@
 import { SpanRecord } from '@mastra/core/storage';
-export declare function useTraceInfo(trace: SpanRecord | undefined): {
+export declare function useTraceInfo(trace: SpanRecord | undefined): ({
     key: string;
     label: string;
-    value: any;
-}[];
+    value: {
+        id: string;
+        name: string;
+        path: string | undefined;
+    }[];
+} | {
+    key: string;
+    label: string;
+    value: string;
+})[];
 type getSpanInfoProps = {
     span: SpanRecord | undefined;
 };

package/dist/src/domains/observability/components/span-dialog.d.ts

@@ -1,6 +1,7 @@
 import { KeyValueListItemData } from '../../../components/ui/elements';
 import { SpanRecord } from '@mastra/core/storage';
-import { ListScoresResponse, GetScorerResponse } from '@mastra/client-js';
+import { ListScoresResponse } from '@mastra/core/evals';
+import { GetScorerResponse } from '@mastra/client-js';
 type SpanDialogProps = {
     trace: SpanRecord;
     span?: SpanRecord;

package/dist/src/domains/observability/components/span-score-list.d.ts

@@ -1,4 +1,4 @@
-import { ListScoresResponse } from '@mastra/client-js';
+import { ListScoresResponse } from '@mastra/core/evals';
 export declare const traceScoresListColumns: {
     name: string;
     label: string;

package/dist/src/domains/observability/components/span-tabs.d.ts

@@ -1,5 +1,6 @@
 import { KeyValueListItemData } from '../../../index';
-import { ListScoresResponse, GetScorerResponse } from '@mastra/client-js';
+import { ListScoresResponse } from '@mastra/core/evals';
+import { GetScorerResponse } from '@mastra/client-js';
 import { SpanRecord } from '@mastra/core/storage';
 type SpanTabsProps = {
     trace?: SpanRecord;

package/dist/src/domains/observability/components/trace-span-usage.d.ts

@@ -14,7 +14,7 @@ type LegacyTokenUsage = {
     completionTokens: number;
     totalTokens: number;
 };
-type TokenUsage = V5TokenUsage | LegacyTokenUsage;
+export type TokenUsage = V5TokenUsage | LegacyTokenUsage;
 type TraceSpanUsageProps = {
     traceUsage?: TokenUsage;
     traceSpans?: SpanRecord[];

package/dist/src/domains/observability/components/traces-list.d.ts

@@ -4,7 +4,7 @@ export declare const tracesListColumns: {
     label: string;
     size: string;
 }[];
-type Trace = Pick<SpanRecord, 'traceId' | 'name'> & {
+type Trace = Pick<SpanRecord, 'traceId' | 'name' | 'entityType' | 'entityId' | 'entityName'> & {
     attributes?: Record<string, any> | null;
     createdAt: Date | string;
 };

package/dist/src/domains/observability/context/tracing-settings-context.d.ts

@@ -7,6 +7,7 @@ export type TracingSettingsContextType = {
     setSettings: (settings: TracingSettings) => void;
     resetAll: () => void;
     settings?: TracingSettings;
+    entityType?: 'workflow' | 'agent';
 };
 export declare const TracingSettingsContext: import('../../../../node_modules/@types/react').Context<TracingSettingsContextType>;
 export interface TracingSettingsProviderProps {

package/dist/src/domains/observability/hooks/use-tracing-settings-state.d.ts

@@ -7,4 +7,5 @@ export declare function useTracingSettingsState({ entityId, entityType }: Tracin
     settings: TracingSettings | undefined;
     setSettings: (settingsValue: TracingSettings) => void;
     resetAll: () => void;
+    entityType: "workflow" | "agent";
 };

package/dist/src/domains/scores/components/score-dialog.d.ts

@@ -1,7 +1,7 @@
 import { SideDialogRootProps } from '../../../components/ui/elements';
-import { ClientScoreRowData } from '@mastra/client-js';
+import { ScoreRowData } from '@mastra/core/evals';
 type ScoreDialogProps = {
-    score?: ClientScoreRowData;
+    score?: ScoreRowData;
     scorerName?: string;
     isOpen: boolean;
     onClose: () => void;

package/dist/src/domains/scores/hooks/use-trace-span-scores.d.ts

@@ -3,5 +3,45 @@ type useTraceSpanScoresProps = {
     spanId?: string;
     page?: number;
 };
-export declare const useTraceSpanScores: ({ traceId, spanId, page }: useTraceSpanScoresProps) => import('@tanstack/react-query').UseQueryResult<import('@mastra/client-js').ListScoresResponse, Error>;
+export declare const useTraceSpanScores: ({ traceId, spanId, page }: useTraceSpanScoresProps) => import('@tanstack/react-query').UseQueryResult<{
+    pagination: {
+        total: number;
+        hasMore: boolean;
+        page: number;
+        perPage: number | false;
+    };
+    scores: {
+        runId: string;
+        source: "LIVE" | "TEST";
+        id: string;
+        createdAt: Date;
+        updatedAt: Date | null;
+        scorer: Record<string, unknown>;
+        entity: Record<string, unknown>;
+        score: number;
+        scorerId: string;
+        entityId: string;
+        input?: unknown;
+        output?: unknown;
+        additionalContext?: Record<string, unknown> | undefined;
+        requestContext?: Record<string, unknown> | undefined;
+        metadata?: Record<string, unknown> | undefined;
+        entityType?: string | undefined;
+        structuredOutput?: boolean | undefined;
+        traceId?: string | undefined;
+        spanId?: string | undefined;
+        resourceId?: string | undefined;
+        threadId?: string | undefined;
+        extractStepResult?: Record<string, unknown> | undefined;
+        extractPrompt?: string | undefined;
+        analyzeStepResult?: Record<string, unknown> | undefined;
+        analyzePrompt?: string | undefined;
+        reason?: string | undefined;
+        reasonPrompt?: string | undefined;
+        preprocessStepResult?: Record<string, unknown> | undefined;
+        preprocessPrompt?: string | undefined;
+        generateScorePrompt?: string | undefined;
+        generateReasonPrompt?: string | undefined;
+    }[];
+}, Error>;
 export {};

package/dist/src/domains/workflows/components/workflow-layout.d.ts

@@ -0,0 +1,7 @@
+export interface WorkflowLayoutProps {
+    workflowId: string;
+    children: React.ReactNode;
+    leftSlot?: React.ReactNode;
+    rightSlot?: React.ReactNode;
+}
+export declare const WorkflowLayout: ({ workflowId, children, leftSlot, rightSlot }: WorkflowLayoutProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/domains/workflows/context/workflow-run-context.d.ts

@@ -22,11 +22,13 @@ type WorkflowRunContextType = {
     timeTravelWorkflowStream: (params: {
         workflowId: string;
         requestContext: Record<string, unknown>;
-        runId: string;
+        runId?: string;
     } & Omit<TimeTravelParams, 'requestContext'>) => Promise<void>;
     runSnapshot?: WorkflowRunState;
     isLoadingRunExecutionResult?: boolean;
     withoutTimeTravel?: boolean;
+    debugMode: boolean;
+    setDebugMode: Dispatch<SetStateAction<boolean>>;
 } & Omit<WorkflowTriggerProps, 'paramsRunId' | 'setRunId' | 'observeWorkflowStream'>;
 export declare const WorkflowRunContext: import('../../../../node_modules/@types/react').Context<WorkflowRunContextType>;
 export declare function WorkflowRunProvider({ children, snapshot, workflowId, initialRunId, withoutTimeTravel, }: {

package/dist/src/domains/workflows/hooks/use-workflows-actions.d.ts

@@ -21,12 +21,15 @@ export declare const useExecuteWorkflow: () => {
     }, unknown>;
 };
 type WorkflowStreamResult = CoreWorkflowStreamResult<any, any, any, any>;
-export declare const useStreamWorkflow: () => {
+export declare const useStreamWorkflow: ({ debugMode }: {
+    debugMode: boolean;
+}) => {
     streamWorkflow: import('@tanstack/react-query').UseMutationResult<void, Error, {
         workflowId: string;
         runId: string;
         inputData: Record<string, unknown>;
         requestContext: Record<string, unknown>;
+        perStep?: boolean;
     }, unknown>;
     streamResult: WorkflowStreamResult;
     isStreaming: boolean;
@@ -42,9 +45,10 @@ export declare const useStreamWorkflow: () => {
         runId: string;
         resumeData: Record<string, unknown>;
         requestContext: Record<string, unknown>;
+        perStep?: boolean;
     }, unknown>;
     timeTravelWorkflowStream: import('@tanstack/react-query').UseMutationResult<void, Error, {
-        runId: string;
+        runId?: string;
         workflowId: string;
         requestContext: Record<string, unknown>;
     } & Omit<TimeTravelParams, "requestContext">, unknown>;

package/dist/src/domains/workflows/index.d.ts

@@ -9,3 +9,4 @@ export * from './components/workflow-information';
 export * from './components/workflow-combobox';
 export * from './utils';
 export * from './hooks';
+export * from './components/workflow-layout';

package/dist/src/domains/workflows/workflow/workflow-default-node.d.ts

@@ -14,5 +14,6 @@ export type DefaultNode = Node<{
 }, 'default-node'>;
 export interface WorkflowDefaultNodeProps {
     parentWorkflowName?: string;
+    stepsFlow: Record<string, string[]>;
 }
-export declare function WorkflowDefaultNode({ data, parentWorkflowName }: NodeProps<DefaultNode> & WorkflowDefaultNodeProps): import("react/jsx-runtime").JSX.Element;
+export declare function WorkflowDefaultNode({ data, parentWorkflowName, stepsFlow, }: NodeProps<DefaultNode> & WorkflowDefaultNodeProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/domains/workflows/workflow/workflow-nested-node.d.ts

@@ -14,5 +14,6 @@ export type NestedNode = Node<{
 }, 'nested-node'>;
 export interface WorkflowNestedNodeProps {
     parentWorkflowName?: string;
+    stepsFlow: Record<string, string[]>;
 }
-export declare function WorkflowNestedNode({ data, parentWorkflowName }: NodeProps<NestedNode> & WorkflowNestedNodeProps): import("react/jsx-runtime").JSX.Element;
+export declare function WorkflowNestedNode({ data, parentWorkflowName, stepsFlow, }: NodeProps<NestedNode> & WorkflowNestedNodeProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/domains/workflows/workflow/workflow-run-options.d.ts

@@ -0,0 +1 @@
+export declare const WorkflowRunOptions: () => import("react/jsx-runtime").JSX.Element;

package/dist/src/domains/workflows/workflow/workflow-step-action-bar.d.ts

@@ -1,4 +1,5 @@
 import { TripwireData } from '../context/use-current-run';
+import { WorkflowRunStatus } from '@mastra/core/workflows';
 export interface WorkflowStepActionBarProps {
     input?: any;
     output?: any;
@@ -10,7 +11,8 @@ export interface WorkflowStepActionBarProps {
     stepId?: string;
     mapConfig?: string;
     onShowNestedGraph?: () => void;
-    status?: 'running' | 'success' | 'failed' | 'suspended' | 'waiting' | 'tripwire';
+    status?: WorkflowRunStatus;
     stepKey?: string;
+    stepsFlow?: Record<string, string[]>;
 }
-export declare const WorkflowStepActionBar: ({ input, output, resumeData, suspendOutput, error, tripwire, mapConfig, stepName, stepId, onShowNestedGraph, status, stepKey, }: WorkflowStepActionBarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const WorkflowStepActionBar: ({ input, output, resumeData, suspendOutput, error, tripwire, mapConfig, stepName, stepId, onShowNestedGraph, status, stepKey, stepsFlow, }: WorkflowStepActionBarProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/domains/workflows/workflow/workflow-time-travel-form.d.ts

@@ -1,5 +1,9 @@
 export type WorkflowTimeTravelFormProps = {
     stepKey: string;
     closeModal: () => void;
+    isPerStepRun?: boolean;
+    isContinueRun?: boolean;
+    buttonText?: string;
+    inputData?: unknown;
 };
-export declare const WorkflowTimeTravelForm: ({ stepKey, closeModal }: WorkflowTimeTravelFormProps) => import("react/jsx-runtime").JSX.Element;
+export declare const WorkflowTimeTravelForm: ({ stepKey, closeModal, isPerStepRun, isContinueRun, buttonText, inputData, }: WorkflowTimeTravelFormProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/domains/workflows/workflow/workflow-trigger.d.ts

@@ -13,22 +13,24 @@ export interface WorkflowTriggerProps {
         runId: string;
     }>;
     isStreamingWorkflow: boolean;
-    streamWorkflow: ({ workflowId, runId, inputData, requestContext, }: {
+    streamWorkflow: ({ workflowId, runId, inputData, requestContext, perStep, }: {
         workflowId: string;
         runId: string;
         inputData: Record<string, unknown>;
         requestContext: Record<string, unknown>;
+        perStep?: boolean;
     }) => Promise<void>;
     observeWorkflowStream?: ({ workflowId, runId }: {
         workflowId: string;
         runId: string;
     }) => void;
-    resumeWorkflow: ({ workflowId, step, runId, resumeData, requestContext, }: {
+    resumeWorkflow: ({ workflowId, step, runId, resumeData, requestContext, perStep, }: {
         workflowId: string;
         step: string | string[];
         runId: string;
         resumeData: Record<string, unknown>;
         requestContext: Record<string, unknown>;
+        perStep?: boolean;
     }) => Promise<void>;
     streamResult: WorkflowRunStreamResult | null;
     isCancellingWorkflowRun: boolean;

package/dist/src/lib/resize/collapsible-panel.d.ts

@@ -0,0 +1,5 @@
+import { PanelProps } from 'react-resizable-panels';
+export interface CollapsiblePanelProps extends PanelProps {
+    direction: 'left' | 'right';
+}
+export declare const CollapsiblePanel: ({ collapsedSize, children, direction, ...props }: CollapsiblePanelProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/lib/resize/separator.d.ts

@@ -0,0 +1 @@
+export declare const PanelSeparator: () => import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mastra/playground-ui",
   "type": "module",
-  "version": "7.0.0-beta.14",
+  "version": "7.0.0-beta.15",
   "description": "Mastra Playground components",
   "main": "dist/index.umd.js",
   "module": "dist/index.es.js",
@@ -90,12 +90,13 @@
     "react-day-picker": "^8.10.1",
     "react-hook-form": "^7.59.0",
     "react-markdown": "^9.1.0",
-    "react-resizable-panels": "^2.1.9",
+    "react-resizable-panels": "^4.0.15",
     "react-syntax-highlighter": "^15.6.6",
     "rehype-stringify": "^10.0.1",
     "remark-gfm": "^4.0.1",
     "remark-parse": "^11.0.0",
     "remark-rehype": "^11.1.2",
+    "semver": "^7.7.2",
     "shiki": "^1.29.2",
     "sonner": "^2.0.5",
     "superjson": "^2.2.2",
@@ -112,10 +113,10 @@
     "react": ">=19.0.0",
     "react-dom": ">=19.0.0",
     "tailwindcss": "^3.0.0",
-    "@mastra/ai-sdk": "^1.0.0-beta.10",
-    "@mastra/react": "0.1.0-beta.14",
-    "@mastra/client-js": "^1.0.0-beta.14",
-    "@mastra/schema-compat": "1.0.0-beta.3"
+    "@mastra/client-js": "^1.0.0-beta.15",
+    "@mastra/schema-compat": "1.0.0-beta.3",
+    "@mastra/react": "0.1.0-beta.15",
+    "@mastra/ai-sdk": "^1.0.0-beta.11"
   },
   "devDependencies": {
     "@storybook/addon-docs": "^9.1.16",
@@ -124,6 +125,7 @@
     "@types/node": "22.13.17",
     "@types/react": "^19.1.9",
     "@types/react-dom": "^19.1.7",
+    "@types/semver": "^7.7.1",
     "@vitejs/plugin-react": "^5.0.4",
     "@vitest/coverage-v8": "4.0.12",
     "@vitest/ui": "4.0.12",
@@ -140,11 +142,11 @@
     "vite-plugin-dts": "^4.5.4",
     "vite-plugin-lib-inject-css": "^2.2.2",
     "vitest": "4.0.12",
-    "@mastra/ai-sdk": "^1.0.0-beta.10",
-    "@mastra/client-js": "^1.0.0-beta.14",
-    "@mastra/core": "1.0.0-beta.14",
-    "@mastra/schema-compat": "1.0.0-beta.3",
-    "@mastra/react": "0.1.0-beta.14"
+    "@mastra/ai-sdk": "^1.0.0-beta.11",
+    "@mastra/core": "1.0.0-beta.15",
+    "@mastra/react": "0.1.0-beta.15",
+    "@mastra/client-js": "^1.0.0-beta.15",
+    "@mastra/schema-compat": "1.0.0-beta.3"
   },
   "homepage": "https://mastra.ai",
   "repository": {