@mastra/playground-ui 7.0.0-beta.19 → 7.0.0-beta.20

package/dist/src/components/assistant-ui/tooltip-icon-button.d.ts

@@ -1,14 +1,9 @@
-import { ButtonProps } from '../ui/button';
+import { ButtonProps } from '../../ds/components/Button/Button';
 export type TooltipIconButtonProps = ButtonProps & {
     tooltip: string;
     side?: 'top' | 'bottom' | 'left' | 'right';
 };
-export declare const TooltipIconButton: import('../../../node_modules/@types/react').ForwardRefExoticComponent<import('../../../node_modules/@types/react').ButtonHTMLAttributes<HTMLButtonElement> & import('class-variance-authority').VariantProps<(props?: ({
-    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
-    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string> & {
-    asChild?: boolean;
-} & {
+export declare const TooltipIconButton: import('../../../node_modules/@types/react').ForwardRefExoticComponent<ButtonProps & {
     tooltip: string;
     side?: "top" | "bottom" | "left" | "right";
 } & import('../../../node_modules/@types/react').RefAttributes<HTMLButtonElement>>;

package/dist/src/components/ui/combobox.d.ts

@@ -1,4 +1,4 @@
-import { ButtonProps } from './button';
+import { ButtonProps as DSButtonProps } from '../../ds/components/Button/Button';
 export type ComboboxOption = {
     label: string;
     value: string;
@@ -12,6 +12,6 @@ export type ComboboxProps = {
     emptyText?: string;
     className?: string;
     disabled?: boolean;
-    variant?: ButtonProps['variant'];
+    variant?: DSButtonProps['variant'];
 };
 export declare function Combobox({ options, value, onValueChange, placeholder, searchPlaceholder, emptyText, className, disabled, variant, }: ComboboxProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/ui/elements/buttons/index.d.ts

@@ -1,2 +1 @@
-export * from './button';
 export * from './combined-buttons';

package/dist/src/components/ui/elements/tabs/index.d.ts

@@ -1 +1,4 @@
-export * from './tabs';
+export { Tabs } from './tabs-root';
+export { TabList } from './tabs-list';
+export { Tab } from './tabs-tab';
+export { TabContent } from './tabs-content';

package/dist/src/components/ui/elements/tabs/tabs-root.d.ts

@@ -5,5 +5,5 @@ type TabsRootProps<T extends string> = {
     onValueChange?: (value: T) => void;
     className?: string;
 };
-export declare const TabsRoot: <T extends string>({ children, defaultTab, value, onValueChange, className, }: TabsRootProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const Tabs: <T extends string>({ children, defaultTab, value, onValueChange, className }: TabsRootProps<T>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/components/ui/elements/tabs/tabs-tab.d.ts

@@ -2,7 +2,8 @@ type TabProps = {
     children: React.ReactNode;
     value: string;
     onClick?: () => void;
+    onClose?: () => void;
     className?: string;
 };
-export declare const Tab: ({ children, value, onClick, className }: TabProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Tab: ({ children, value, onClick, onClose, className }: TabProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/components/ui/input.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 declare const inputVariants: (props?: ({
     variant?: "default" | "unstyled" | "filled" | null | undefined;
-    customSize?: "default" | "sm" | "lg" | null | undefined;
+    customSize?: "lg" | "default" | "sm" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>, VariantProps<typeof inputVariants> {
     testId?: string;

package/dist/src/components/ui/text.d.ts

@@ -1,8 +1,8 @@
 import { VariantProps } from 'class-variance-authority';
 import { default as React } from '../../../node_modules/@types/react';
 declare const textVariants: (props?: ({
-    variant?: "secondary" | "primary" | null | undefined;
-    size?: "default" | "sm" | "lg" | "md" | "xs" | "xl" | "2xl" | null | undefined;
+    variant?: "primary" | "secondary" | null | undefined;
+    size?: "md" | "lg" | "default" | "sm" | "xs" | "xl" | "2xl" | null | undefined;
     weight?: "bold" | "medium" | "normal" | "semibold" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface TextProps extends React.HTMLAttributes<HTMLParagraphElement | HTMLSpanElement | HTMLDivElement>, VariantProps<typeof textVariants> {

package/dist/src/domains/memory/hooks/use-memory.d.ts

@@ -22,3 +22,8 @@ export declare const useMemorySearch: ({ agentId, resourceId, threadId, }: {
     searchQuery: string;
     memoryConfig?: MemorySearchParams;
 }, unknown>;
+export declare const useCloneThread: () => import('@tanstack/react-query').UseMutationResult<import('@mastra/client-js').CloneMemoryThreadResponse, Error, {
+    threadId: string;
+    agentId: string;
+    title?: string;
+}, unknown>;

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

@@ -22,16 +22,16 @@ export declare const useTraceSpanScores: ({ traceId, spanId, page }: useTraceSpa
         scorerId: string;
         entityId: string;
         input?: unknown;
+        threadId?: string | undefined;
+        resourceId?: string | undefined;
+        metadata?: Record<string, unknown> | undefined;
         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;

package/dist/src/domains/templates/template-form.d.ts

@@ -12,6 +12,7 @@ type TemplateFormProps = {
     handleInstallTemplate: () => void;
     handleVariableChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
     isLoadingEnvVars?: boolean;
+    isInstalling?: boolean;
     defaultModelProvider?: string;
     defaultModelId?: string;
     onModelUpdate?: (params: {
@@ -21,5 +22,5 @@ type TemplateFormProps = {
         message: string;
     }>;
 };
-export declare function TemplateForm({ providerOptions, selectedProvider, onProviderChange, variables, errors, handleInstallTemplate, handleVariableChange, isLoadingEnvVars, defaultModelProvider, defaultModelId, onModelUpdate, }: TemplateFormProps): import("react/jsx-runtime").JSX.Element;
+export declare function TemplateForm({ providerOptions, selectedProvider, onProviderChange, variables, errors, handleInstallTemplate, handleVariableChange, isLoadingEnvVars, isInstalling, defaultModelProvider, defaultModelId, onModelUpdate, }: TemplateFormProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -28,6 +28,7 @@ export declare const useStreamWorkflow: ({ debugMode }: {
         workflowId: string;
         runId: string;
         inputData: Record<string, unknown>;
+        initialState?: Record<string, unknown>;
         requestContext: Record<string, unknown>;
         perStep?: boolean;
     }, unknown>;

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

@@ -13,10 +13,11 @@ export interface WorkflowTriggerProps {
         runId: string;
     }>;
     isStreamingWorkflow: boolean;
-    streamWorkflow: ({ workflowId, runId, inputData, requestContext, perStep, }: {
+    streamWorkflow: ({ workflowId, runId, inputData, initialState, requestContext, perStep, }: {
         workflowId: string;
         runId: string;
         inputData: Record<string, unknown>;
+        initialState?: Record<string, unknown>;
         requestContext: Record<string, unknown>;
         perStep?: boolean;
     }) => Promise<void>;

package/dist/src/ds/components/Avatar/Avatar.d.ts

@@ -1,5 +1,7 @@
-export interface AvatarProps {
+export type AvatarSize = 'sm' | 'md' | 'lg';
+export type AvatarProps = {
     src?: string;
     name: string;
-}
-export declare const Avatar: ({ src, name }: AvatarProps) => import("react/jsx-runtime").JSX.Element;
+    size?: AvatarSize;
+};
+export declare const Avatar: ({ src, name, size }: AvatarProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/ds/components/Button/Button.d.ts

@@ -7,8 +7,12 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
     prefetch?: boolean | null;
     children: React.ReactNode;
     size?: 'md' | 'lg';
-    variant?: 'default' | 'light';
+    variant?: 'default' | 'light' | 'outline' | 'ghost';
     target?: string;
     type?: 'button' | 'submit' | 'reset';
 }
-export declare const Button: ({ className, as, size, variant, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare function buttonVariants(options?: {
+    variant?: ButtonProps['variant'];
+    size?: ButtonProps['size'];
+}): string;
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/src/ds/components/CodeEditor/code-editor.d.ts

@@ -0,0 +1,12 @@
+import { HTMLAttributes } from '../../../../node_modules/@types/react';
+import { Extension } from '@codemirror/state';
+export declare const useCodemirrorTheme: () => Extension;
+export type CodeEditorProps = {
+    data?: Record<string, unknown> | Array<Record<string, unknown>>;
+    value?: string;
+    onChange?: (value: string) => void;
+    showCopyButton?: boolean;
+    className?: string;
+} & Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;
+export declare const CodeEditor: ({ data, value, onChange, showCopyButton, className, ...props }: CodeEditorProps) => import("react/jsx-runtime").JSX.Element;
+export declare function highlight(code: string, language: string): Promise<import('shiki').ThemedToken[][] | null>;

package/dist/src/ds/components/CodeEditor/index.d.ts

@@ -0,0 +1 @@
+export * from './code-editor';

package/dist/src/ds/tokens/sizes.d.ts

@@ -9,6 +9,8 @@ export declare const Sizes: {
     'table-row': string;
     'table-row-small': string;
     'badge-default': string;
-    'avatar-default': string;
+    'avatar-sm': string;
+    'avatar-md': string;
+    'avatar-lg': string;
     'dropdown-max-height': string;
 };

package/dist/src/hooks/use-workflow-runs.d.ts

@@ -217,7 +217,7 @@ export declare const useWorkflowRuns: (workflowId: string, { enabled }?: {
     fetchStatus: import('@tanstack/react-query').FetchStatus;
     promise: Promise<import('@mastra/core/storage').WorkflowRun[]>;
 };
-export declare const useWorkflowRunExecutionResult: (workflowId: string, runId: string, refetchInterval?: number) => import('@tanstack/react-query').UseQueryResult<Partial<import('@mastra/core/workflows').WorkflowState>, Error>;
+export declare const useWorkflowRun: (workflowId: string, runId: string, refetchInterval?: number) => import('@tanstack/react-query').UseQueryResult<import('@mastra/core/workflows').WorkflowState, Error>;
 export declare const useDeleteWorkflowRun: (workflowId: string) => import('@tanstack/react-query').UseMutationResult<{
     message: string;
 }, Error, {

package/dist/src/index.d.ts

@@ -9,8 +9,6 @@ export * from './components/ui/containers';
 export * from './components/ui/elements';
 export * from './components/threads';
 export * from './components/ui/entity-header';
-export * from './components/ui/playground-tabs';
-export * from './components/ui/elements';
 export * from './types';
 export * from './ds/components/Badge/index';
 export * from './ds/components/Button/index';

package/dist/tokens.cjs.js

@@ -45,7 +45,9 @@ const Sizes = {
   "table-row": "44px",
   "table-row-small": "32px",
   "badge-default": "20px",
-  "avatar-default": "24px",
+  "avatar-sm": "24px",
+  "avatar-md": "32px",
+  "avatar-lg": "40px",
   "dropdown-max-height": "300px"
 };
 

package/dist/tokens.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.cjs.js","sources":["../src/ds/tokens/borders.ts","../src/ds/tokens/fonts.ts","../src/ds/tokens/sizes.ts","../src/ds/tokens/spacings.ts"],"sourcesContent":["export const BorderWidth = {\n  sm: '0.5px',\n};\n\nexport const BorderRadius = {\n  none: '0px',\n  sm: '2px',\n  md: '4px',\n  lg: '6px',\n};\n","export const FontSizes = {\n  'header-md': '1rem', // 16px\n  'ui-lg': '0.813rem', // 13px\n  'ui-md': '0.75rem', // 12px\n  'ui-sm': '0.688rem', // 11px\n  'ui-xs': '0.625rem', // 10px\n};\n\nexport const LineHeights = {\n  'header-md': '125%',\n  'ui-lg': '153.846%',\n  'ui-md': '166.667%',\n  'ui-sm': '181.818%',\n  'ui-xs': '200%',\n};\n","export const Sizes = {\n  'icon-default': '16px',\n  'icon-lg': '20px',\n  'icon-sm': '12px',\n  'button-md': '24px',\n  'button-lg': '40px',\n  'header-default': '40px',\n  'table-header': '28px',\n  'table-row': '44px',\n  'table-row-small': '32px',\n  'badge-default': '20px',\n  'avatar-default': '24px',\n  'dropdown-max-height': '300px',\n};\n","export const Spacings = {\n  sm: '2px',\n  md: '4px',\n  lg: '8px',\n};\n"],"names":[],"mappings":";;;;;;AAAO,MAAM,WAAA,GAAc;AAAA,EACzB,EAAA,EAAI;AACN;AAEO,MAAM,YAAA,GAAe;AAAA,EAC1B,IAAA,EAAM,KAAA;AAAA,EACN,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI;AACN;;ACTO,MAAM,SAAA,GAAY;AAAA,EACvB,WAAA,EAAa,MAAA;AAAA;AAAA,EACb,OAAA,EAAS,UAAA;AAAA;AAAA,EACT,OAAA,EAAS,SAAA;AAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA;AAAA,EACT,OAAA,EAAS;AAAA;AACX;AAEO,MAAM,WAAA,GAAc;AAAA,EACzB,WAAA,EAAa,MAAA;AAAA,EACb,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS;AACX;;ACdO,MAAM,KAAA,GAAQ;AAAA,EACnB,cAAA,EAAgB,MAAA;AAAA,EAChB,SAAA,EAAW,MAAA;AAAA,EACX,SAAA,EAAW,MAAA;AAAA,EACX,WAAA,EAAa,MAAA;AAAA,EACb,WAAA,EAAa,MAAA;AAAA,EACb,gBAAA,EAAkB,MAAA;AAAA,EAClB,cAAA,EAAgB,MAAA;AAAA,EAChB,WAAA,EAAa,MAAA;AAAA,EACb,iBAAA,EAAmB,MAAA;AAAA,EACnB,eAAA,EAAiB,MAAA;AAAA,EACjB,gBAAA,EAAkB,MAAA;AAAA,EAClB,qBAAA,EAAuB;AACzB;;ACbO,MAAM,QAAA,GAAW;AAAA,EACtB,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI;AACN;;;;;;;;;;;;"}
+{"version":3,"file":"tokens.cjs.js","sources":["../src/ds/tokens/borders.ts","../src/ds/tokens/fonts.ts","../src/ds/tokens/sizes.ts","../src/ds/tokens/spacings.ts"],"sourcesContent":["export const BorderWidth = {\n  sm: '0.5px',\n};\n\nexport const BorderRadius = {\n  none: '0px',\n  sm: '2px',\n  md: '4px',\n  lg: '6px',\n};\n","export const FontSizes = {\n  'header-md': '1rem', // 16px\n  'ui-lg': '0.813rem', // 13px\n  'ui-md': '0.75rem', // 12px\n  'ui-sm': '0.688rem', // 11px\n  'ui-xs': '0.625rem', // 10px\n};\n\nexport const LineHeights = {\n  'header-md': '125%',\n  'ui-lg': '153.846%',\n  'ui-md': '166.667%',\n  'ui-sm': '181.818%',\n  'ui-xs': '200%',\n};\n","export const Sizes = {\n  'icon-default': '16px',\n  'icon-lg': '20px',\n  'icon-sm': '12px',\n  'button-md': '24px',\n  'button-lg': '40px',\n  'header-default': '40px',\n  'table-header': '28px',\n  'table-row': '44px',\n  'table-row-small': '32px',\n  'badge-default': '20px',\n  'avatar-sm': '24px',\n  'avatar-md': '32px',\n  'avatar-lg': '40px',\n  'dropdown-max-height': '300px',\n};\n","export const Spacings = {\n  sm: '2px',\n  md: '4px',\n  lg: '8px',\n};\n"],"names":[],"mappings":";;;;;;AAAO,MAAM,WAAA,GAAc;AAAA,EACzB,EAAA,EAAI;AACN;AAEO,MAAM,YAAA,GAAe;AAAA,EAC1B,IAAA,EAAM,KAAA;AAAA,EACN,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI;AACN;;ACTO,MAAM,SAAA,GAAY;AAAA,EACvB,WAAA,EAAa,MAAA;AAAA;AAAA,EACb,OAAA,EAAS,UAAA;AAAA;AAAA,EACT,OAAA,EAAS,SAAA;AAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA;AAAA,EACT,OAAA,EAAS;AAAA;AACX;AAEO,MAAM,WAAA,GAAc;AAAA,EACzB,WAAA,EAAa,MAAA;AAAA,EACb,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS;AACX;;ACdO,MAAM,KAAA,GAAQ;AAAA,EACnB,cAAA,EAAgB,MAAA;AAAA,EAChB,SAAA,EAAW,MAAA;AAAA,EACX,SAAA,EAAW,MAAA;AAAA,EACX,WAAA,EAAa,MAAA;AAAA,EACb,WAAA,EAAa,MAAA;AAAA,EACb,gBAAA,EAAkB,MAAA;AAAA,EAClB,cAAA,EAAgB,MAAA;AAAA,EAChB,WAAA,EAAa,MAAA;AAAA,EACb,iBAAA,EAAmB,MAAA;AAAA,EACnB,eAAA,EAAiB,MAAA;AAAA,EACjB,WAAA,EAAa,MAAA;AAAA,EACb,WAAA,EAAa,MAAA;AAAA,EACb,WAAA,EAAa,MAAA;AAAA,EACb,qBAAA,EAAuB;AACzB;;ACfO,MAAM,QAAA,GAAW;AAAA,EACtB,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI;AACN;;;;;;;;;;;;"}

package/dist/tokens.es.js

@@ -41,7 +41,9 @@ const Sizes = {
   "table-row": "44px",
   "table-row-small": "32px",
   "badge-default": "20px",
-  "avatar-default": "24px",
+  "avatar-sm": "24px",
+  "avatar-md": "32px",
+  "avatar-lg": "40px",
   "dropdown-max-height": "300px"
 };
 

package/dist/tokens.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.es.js","sources":["../src/ds/tokens/borders.ts","../src/ds/tokens/fonts.ts","../src/ds/tokens/sizes.ts","../src/ds/tokens/spacings.ts"],"sourcesContent":["export const BorderWidth = {\n  sm: '0.5px',\n};\n\nexport const BorderRadius = {\n  none: '0px',\n  sm: '2px',\n  md: '4px',\n  lg: '6px',\n};\n","export const FontSizes = {\n  'header-md': '1rem', // 16px\n  'ui-lg': '0.813rem', // 13px\n  'ui-md': '0.75rem', // 12px\n  'ui-sm': '0.688rem', // 11px\n  'ui-xs': '0.625rem', // 10px\n};\n\nexport const LineHeights = {\n  'header-md': '125%',\n  'ui-lg': '153.846%',\n  'ui-md': '166.667%',\n  'ui-sm': '181.818%',\n  'ui-xs': '200%',\n};\n","export const Sizes = {\n  'icon-default': '16px',\n  'icon-lg': '20px',\n  'icon-sm': '12px',\n  'button-md': '24px',\n  'button-lg': '40px',\n  'header-default': '40px',\n  'table-header': '28px',\n  'table-row': '44px',\n  'table-row-small': '32px',\n  'badge-default': '20px',\n  'avatar-default': '24px',\n  'dropdown-max-height': '300px',\n};\n","export const Spacings = {\n  sm: '2px',\n  md: '4px',\n  lg: '8px',\n};\n"],"names":[],"mappings":";;AAAO,MAAM,WAAA,GAAc;AAAA,EACzB,EAAA,EAAI;AACN;AAEO,MAAM,YAAA,GAAe;AAAA,EAC1B,IAAA,EAAM,KAAA;AAAA,EACN,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI;AACN;;ACTO,MAAM,SAAA,GAAY;AAAA,EACvB,WAAA,EAAa,MAAA;AAAA;AAAA,EACb,OAAA,EAAS,UAAA;AAAA;AAAA,EACT,OAAA,EAAS,SAAA;AAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA;AAAA,EACT,OAAA,EAAS;AAAA;AACX;AAEO,MAAM,WAAA,GAAc;AAAA,EACzB,WAAA,EAAa,MAAA;AAAA,EACb,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS;AACX;;ACdO,MAAM,KAAA,GAAQ;AAAA,EACnB,cAAA,EAAgB,MAAA;AAAA,EAChB,SAAA,EAAW,MAAA;AAAA,EACX,SAAA,EAAW,MAAA;AAAA,EACX,WAAA,EAAa,MAAA;AAAA,EACb,WAAA,EAAa,MAAA;AAAA,EACb,gBAAA,EAAkB,MAAA;AAAA,EAClB,cAAA,EAAgB,MAAA;AAAA,EAChB,WAAA,EAAa,MAAA;AAAA,EACb,iBAAA,EAAmB,MAAA;AAAA,EACnB,eAAA,EAAiB,MAAA;AAAA,EACjB,gBAAA,EAAkB,MAAA;AAAA,EAClB,qBAAA,EAAuB;AACzB;;ACbO,MAAM,QAAA,GAAW;AAAA,EACtB,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI;AACN;;;;"}
+{"version":3,"file":"tokens.es.js","sources":["../src/ds/tokens/borders.ts","../src/ds/tokens/fonts.ts","../src/ds/tokens/sizes.ts","../src/ds/tokens/spacings.ts"],"sourcesContent":["export const BorderWidth = {\n  sm: '0.5px',\n};\n\nexport const BorderRadius = {\n  none: '0px',\n  sm: '2px',\n  md: '4px',\n  lg: '6px',\n};\n","export const FontSizes = {\n  'header-md': '1rem', // 16px\n  'ui-lg': '0.813rem', // 13px\n  'ui-md': '0.75rem', // 12px\n  'ui-sm': '0.688rem', // 11px\n  'ui-xs': '0.625rem', // 10px\n};\n\nexport const LineHeights = {\n  'header-md': '125%',\n  'ui-lg': '153.846%',\n  'ui-md': '166.667%',\n  'ui-sm': '181.818%',\n  'ui-xs': '200%',\n};\n","export const Sizes = {\n  'icon-default': '16px',\n  'icon-lg': '20px',\n  'icon-sm': '12px',\n  'button-md': '24px',\n  'button-lg': '40px',\n  'header-default': '40px',\n  'table-header': '28px',\n  'table-row': '44px',\n  'table-row-small': '32px',\n  'badge-default': '20px',\n  'avatar-sm': '24px',\n  'avatar-md': '32px',\n  'avatar-lg': '40px',\n  'dropdown-max-height': '300px',\n};\n","export const Spacings = {\n  sm: '2px',\n  md: '4px',\n  lg: '8px',\n};\n"],"names":[],"mappings":";;AAAO,MAAM,WAAA,GAAc;AAAA,EACzB,EAAA,EAAI;AACN;AAEO,MAAM,YAAA,GAAe;AAAA,EAC1B,IAAA,EAAM,KAAA;AAAA,EACN,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI;AACN;;ACTO,MAAM,SAAA,GAAY;AAAA,EACvB,WAAA,EAAa,MAAA;AAAA;AAAA,EACb,OAAA,EAAS,UAAA;AAAA;AAAA,EACT,OAAA,EAAS,SAAA;AAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA;AAAA,EACT,OAAA,EAAS;AAAA;AACX;AAEO,MAAM,WAAA,GAAc;AAAA,EACzB,WAAA,EAAa,MAAA;AAAA,EACb,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS,UAAA;AAAA,EACT,OAAA,EAAS;AACX;;ACdO,MAAM,KAAA,GAAQ;AAAA,EACnB,cAAA,EAAgB,MAAA;AAAA,EAChB,SAAA,EAAW,MAAA;AAAA,EACX,SAAA,EAAW,MAAA;AAAA,EACX,WAAA,EAAa,MAAA;AAAA,EACb,WAAA,EAAa,MAAA;AAAA,EACb,gBAAA,EAAkB,MAAA;AAAA,EAClB,cAAA,EAAgB,MAAA;AAAA,EAChB,WAAA,EAAa,MAAA;AAAA,EACb,iBAAA,EAAmB,MAAA;AAAA,EACnB,eAAA,EAAiB,MAAA;AAAA,EACjB,WAAA,EAAa,MAAA;AAAA,EACb,WAAA,EAAa,MAAA;AAAA,EACb,WAAA,EAAa,MAAA;AAAA,EACb,qBAAA,EAAuB;AACzB;;ACfO,MAAM,QAAA,GAAW;AAAA,EACtB,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI;AACN;;;;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mastra/playground-ui",
   "type": "module",
-  "version": "7.0.0-beta.19",
+  "version": "7.0.0-beta.20",
   "description": "Mastra Playground components",
   "main": "dist/index.umd.js",
   "module": "dist/index.es.js",
@@ -37,7 +37,6 @@
   "author": "Mastra",
   "license": "Apache-2.0",
   "dependencies": {
-    "@ai-sdk/ui-utils": "^1.2.11",
     "@assistant-ui/react": "^0.11.47",
     "@assistant-ui/react-markdown": "^0.11.6",
     "@assistant-ui/react-syntax-highlighter": "^0.11.6",
@@ -57,11 +56,9 @@
     "@lezer/highlight": "^1.2.3",
     "@lukeed/uuid": "^2.0.1",
     "@radix-ui/react-alert-dialog": "^1.1.14",
-    "@radix-ui/react-avatar": "^1.1.10",
     "@radix-ui/react-checkbox": "^1.3.2",
     "@radix-ui/react-collapsible": "^1.1.11",
     "@radix-ui/react-dialog": "^1.1.14",
-    "@radix-ui/react-dropdown-menu": "^2.1.16",
     "@radix-ui/react-hover-card": "^1.1.14",
     "@radix-ui/react-label": "^2.1.7",
     "@radix-ui/react-popover": "^1.1.14",
@@ -69,10 +66,8 @@
     "@radix-ui/react-scroll-area": "^1.2.9",
     "@radix-ui/react-select": "^2.2.5",
     "@radix-ui/react-slider": "^1.3.5",
-    "@radix-ui/react-slot": "^1.2.3",
     "@radix-ui/react-switch": "^1.2.5",
     "@radix-ui/react-tabs": "^1.1.12",
-    "@radix-ui/react-toggle": "^1.1.9",
     "@radix-ui/react-tooltip": "^1.2.7",
     "@radix-ui/react-visually-hidden": "^1.2.3",
     "@tanstack/react-table": "^8.21.3",
@@ -81,9 +76,7 @@
     "@uiw/codemirror-theme-github": "^4.25.3",
     "@uiw/react-codemirror": "^4.23.14",
     "@xyflow/react": "^12.9.3",
-    "cmdk": "^1.1.1",
     "date-fns": "^4.1.0",
-    "motion": "^12.23.22",
     "prettier": "^3.6.2",
     "prism-react-renderer": "^2.4.1",
     "react-code-block": "1.1.3",
@@ -92,19 +85,15 @@
     "react-markdown": "^9.1.0",
     "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",
     "tailwindcss-animate": "^1.0.7",
-    "unified": "^11.0.5",
     "use-debounce": "^10.0.6",
     "zod": "^4.1.12",
-    "zustand": "^5.0.8"
+    "zustand": "^5.0.9"
   },
   "peerDependencies": {
     "@mastra/core": ">=1.0.0-0 <2.0.0-0",
@@ -113,9 +102,9 @@
     "react": ">=19.0.0",
     "react-dom": ">=19.0.0",
     "tailwindcss": "^3.0.0",
-    "@mastra/ai-sdk": "^1.0.0-beta.12",
-    "@mastra/client-js": "^1.0.0-beta.19",
-    "@mastra/react": "0.1.0-beta.19",
+    "@mastra/ai-sdk": "^1.0.0-beta.13",
+    "@mastra/react": "0.1.0-beta.20",
+    "@mastra/client-js": "^1.0.0-beta.20",
     "@mastra/schema-compat": "1.0.0-beta.5"
   },
   "devDependencies": {
@@ -127,8 +116,7 @@
     "@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",
+    "@vitejs/plugin-react": "^5.1.2",
     "@vitest/ui": "4.0.12",
     "autoprefixer": "^10.4.22",
     "class-variance-authority": "^0.7.1",
@@ -138,16 +126,16 @@
     "storybook": "^9.1.10",
     "tailwind-merge": "^3.3.1",
     "tailwindcss": "^3.4.18",
-    "typescript": "^5.8.3",
+    "typescript": "^5.9.3",
     "vite": "^7.1.9",
     "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.12",
-    "@mastra/react": "0.1.0-beta.19",
-    "@mastra/client-js": "^1.0.0-beta.19",
-    "@mastra/schema-compat": "1.0.0-beta.5",
-    "@mastra/core": "1.0.0-beta.19"
+    "vitest": "4.0.16",
+    "@mastra/ai-sdk": "^1.0.0-beta.13",
+    "@mastra/core": "1.0.0-beta.20",
+    "@mastra/react": "0.1.0-beta.20",
+    "@mastra/client-js": "^1.0.0-beta.20",
+    "@mastra/schema-compat": "1.0.0-beta.5"
   },
   "homepage": "https://mastra.ai",
   "repository": {

package/dist/src/components/assistant-ui/syntax-highlighter.d.ts

@@ -1 +0,0 @@
-export declare const SyntaxHighlighter: import('../../../node_modules/@types/react').FC<import('@assistant-ui/react-markdown').SyntaxHighlighterProps>;

package/dist/src/components/syntax-highlighter.d.ts

@@ -1,5 +0,0 @@
-import { Extension } from '@codemirror/state';
-export declare const useCodemirrorTheme: () => Extension;
-export declare const SyntaxHighlighter: ({ data }: {
-    data: Record<string, unknown>;
-}) => import("react/jsx-runtime").JSX.Element;

package/dist/src/components/ui/avatar.d.ts

@@ -1,6 +0,0 @@
-import * as AvatarPrimitive from '@radix-ui/react-avatar';
-import * as React from 'react';
-declare const Avatar: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
-declare const AvatarImage: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React.RefAttributes<HTMLImageElement>, "ref"> & React.RefAttributes<HTMLImageElement>>;
-declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
-export { Avatar, AvatarImage, AvatarFallback };

package/dist/src/components/ui/badge.d.ts

@@ -1,9 +0,0 @@
-import { VariantProps } from 'class-variance-authority';
-import * as React from 'react';
-declare const badgeVariants: (props?: ({
-    variant?: "default" | "destructive" | "outline" | "secondary" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
-}
-declare function Badge({ className, variant, ...props }: BadgeProps): import("react/jsx-runtime").JSX.Element;
-export { Badge, badgeVariants };

package/dist/src/components/ui/button.d.ts

@@ -1,16 +0,0 @@
-import { VariantProps } from 'class-variance-authority';
-import * as React from 'react';
-declare const buttonVariants: (props?: ({
-    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
-    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<typeof buttonVariants> & {
-    asChild?: boolean;
-};
-declare const Button: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<(props?: ({
-    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
-    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string> & {
-    asChild?: boolean;
-} & React.RefAttributes<HTMLButtonElement>>;
-export { Button, buttonVariants };

package/dist/src/components/ui/calendar.d.ts

@@ -1,8 +0,0 @@
-import { DayPicker } from 'react-day-picker';
-import * as React from 'react';
-export type CalendarProps = React.ComponentProps<typeof DayPicker>;
-declare function Calendar({ className, classNames, showOutsideDays, ...props }: CalendarProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Calendar {
-    var displayName: string;
-}
-export { Calendar };

package/dist/src/components/ui/card.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-declare const Card: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-declare const CardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-declare const CardContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };

package/dist/src/components/ui/command.d.ts

@@ -1,78 +0,0 @@
-import * as React from 'react';
-declare const Command: React.ForwardRefExoticComponent<Omit<{
-    children?: React.ReactNode;
-} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-    ref?: React.Ref<HTMLDivElement>;
-} & {
-    asChild?: boolean;
-}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-    label?: string;
-    shouldFilter?: boolean;
-    filter?: (value: string, search: string, keywords?: string[]) => number;
-    defaultValue?: string;
-    value?: string;
-    onValueChange?: (value: string) => void;
-    loop?: boolean;
-    disablePointerSelection?: boolean;
-    vimBindings?: boolean;
-} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const CommandInput: React.ForwardRefExoticComponent<Omit<Omit<Pick<Pick<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof React.InputHTMLAttributes<HTMLInputElement>> & {
-    ref?: React.Ref<HTMLInputElement>;
-} & {
-    asChild?: boolean;
-}, "asChild" | "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "type" | "value" | "onChange"> & {
-    value?: string;
-    onValueChange?: (search: string) => void;
-} & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
-declare const CommandList: React.ForwardRefExoticComponent<Omit<{
-    children?: React.ReactNode;
-} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-    ref?: React.Ref<HTMLDivElement>;
-} & {
-    asChild?: boolean;
-}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-    label?: string;
-} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const CommandEmpty: React.ForwardRefExoticComponent<Omit<{
-    children?: React.ReactNode;
-} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-    ref?: React.Ref<HTMLDivElement>;
-} & {
-    asChild?: boolean;
-}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const CommandGroup: React.ForwardRefExoticComponent<Omit<{
-    children?: React.ReactNode;
-} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-    ref?: React.Ref<HTMLDivElement>;
-} & {
-    asChild?: boolean;
-}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "value" | "heading"> & {
-    heading?: React.ReactNode;
-    value?: string;
-    forceMount?: boolean;
-} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const CommandSeparator: React.ForwardRefExoticComponent<Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-    ref?: React.Ref<HTMLDivElement>;
-} & {
-    asChild?: boolean;
-}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-    alwaysRender?: boolean;
-} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const CommandItem: React.ForwardRefExoticComponent<Omit<{
-    children?: React.ReactNode;
-} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-    ref?: React.Ref<HTMLDivElement>;
-} & {
-    asChild?: boolean;
-}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "disabled" | "value" | "onSelect"> & {
-    disabled?: boolean;
-    onSelect?: (value: string) => void;
-    value?: string;
-    keywords?: string[];
-    forceMount?: boolean;
-} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const CommandShortcut: {
-    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, };

package/dist/src/components/ui/date-picker.d.ts

@@ -1,23 +0,0 @@
-import { DayPickerSingleProps } from 'react-day-picker';
-import * as React from 'react';
-type CommonProps = Omit<DayPickerSingleProps, 'mode' | 'selected' | 'onSelect'> & {
-    value: Date | undefined | null;
-    setValue: (date: Date | undefined | null) => void;
-    clearable?: boolean;
-};
-export type DatePickerProps = (CommonProps & {
-    children?: never;
-    className?: string;
-    placeholder?: string;
-}) | (CommonProps & {
-    children: React.ReactNode;
-    className?: never;
-    placeholder?: string;
-});
-export declare const DatePicker: React.FC<DatePickerProps>;
-export declare const DatePickerOnly: ({ value, setValue, setOpenPopover, clearable, placeholder, className, ...props }: CommonProps & {
-    setOpenPopover?: (open: boolean) => void;
-    placeholder?: string;
-    className?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/src/components/ui/elements/buttons/button.d.ts

@@ -1,8 +0,0 @@
-import { default as React } from '../../../../../node_modules/@types/react';
-export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    className?: string;
-    children: React.ReactNode;
-    variant?: 'primary' | 'outline' | 'ghost';
-    isFaded?: boolean;
-}
-export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/src/components/ui/elements/tabs/tabs.d.ts

@@ -1,24 +0,0 @@
-export declare const Tabs: (<T extends string>({ children, defaultTab, value, onValueChange, className, }: {
-    children: React.ReactNode;
-    defaultTab: T;
-    value?: T | undefined;
-    onValueChange?: ((value: T) => void) | undefined;
-    className?: string;
-}) => import("react/jsx-runtime").JSX.Element) & {
-    List: ({ children, variant, className }: {
-        children: React.ReactNode;
-        className?: string;
-        variant?: "default" | "buttons";
-    }) => import("react/jsx-runtime").JSX.Element;
-    Tab: ({ children, value, onClick, className }: {
-        children: React.ReactNode;
-        value: string;
-        onClick?: () => void;
-        className?: string;
-    }) => import("react/jsx-runtime").JSX.Element;
-    Content: ({ children, value, className }: {
-        children: React.ReactNode;
-        value: string;
-        className?: string;
-    }) => import("react/jsx-runtime").JSX.Element;
-};