@mastra/playground-ui 60.0.0-alpha.8 → 60.0.0

package/dist/src/ds/components/TokenBudget/tones.d.ts

@@ -1,6 +1,6 @@
 export declare const toneClass: {
-    readonly messages: "text-blue-500";
-    readonly memory: "text-violet-500";
-    readonly warning: "text-warning1";
+    readonly messages: "text-chart-blue";
+    readonly memory: "text-chart-purple";
+    readonly warning: "text-warning-indicator";
 };
 export type TokenBudgetTone = keyof typeof toneClass;

package/dist/src/ds/components/Workflow/cards/workflow-card-badge-utils.d.ts

@@ -1,19 +1,19 @@
 import { LucideIcon } from 'lucide-react';
 export declare const BADGE_COLORS: {
-    readonly sleep: "#A855F7";
-    readonly forEach: "#F97316";
-    readonly map: "#F97316";
-    readonly parallel: "#3B82F6";
-    readonly suspend: "#EC4899";
-    readonly after: "#14B8A6";
-    readonly workflow: "#8B5CF6";
-    readonly when: "#ECB047";
-    readonly dountil: "#8B5CF6";
-    readonly dowhile: "#06B6D4";
-    readonly until: "#F59E0B";
-    readonly while: "#10B981";
-    readonly if: "#3B82F6";
-    readonly else: "#6B7280";
+    readonly sleep: "var(--badge-purple-indicator)";
+    readonly forEach: "var(--badge-orange-indicator)";
+    readonly map: "var(--badge-orange-indicator)";
+    readonly parallel: "var(--badge-blue-indicator)";
+    readonly suspend: "var(--badge-pink-indicator)";
+    readonly after: "var(--badge-cyan-indicator)";
+    readonly workflow: "var(--badge-purple-indicator)";
+    readonly when: "var(--badge-yellow-indicator)";
+    readonly dountil: "var(--badge-purple-indicator)";
+    readonly dowhile: "var(--badge-cyan-indicator)";
+    readonly until: "var(--badge-yellow-indicator)";
+    readonly while: "var(--badge-green-indicator)";
+    readonly if: "var(--badge-blue-indicator)";
+    readonly else: "var(--muted-foreground)";
 };
 export declare const BADGE_ICONS: {
     readonly sleep: react.ForwardRefExoticComponent<any>;

package/dist/src/ds/components/ai/activity/activity.d.ts

@@ -0,0 +1,53 @@
+import { ComponentProps, ReactNode } from 'react';
+import { Collapsible, CollapsibleContent } from '../../Collapsible';
+import { Txt } from '../../Txt';
+type ActivityStatus = 'idle' | 'running' | 'error';
+export interface ActivityProps extends Omit<ComponentProps<typeof Collapsible>, 'defaultOpen' | 'onOpenChange' | 'open'> {
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    foldable?: boolean;
+    status?: ActivityStatus;
+}
+export declare function Activity({ open: controlledOpen, defaultOpen, onOpenChange, foldable, status, className, children, ...props }: ActivityProps): import("react").JSX.Element;
+export declare const ActivityTrigger: ({ className, children, ...props }: ComponentProps<"div">) => import("react").JSX.Element;
+export declare const ActivityHeader: ({ className, children, ...props }: ComponentProps<"span">) => import("react").JSX.Element;
+export declare const ActivityLeading: ({ className, children, ...props }: ComponentProps<"span">) => import("react").JSX.Element | null;
+export declare const ActivityIcon: ({ className, ...props }: ComponentProps<"span">) => import("react").JSX.Element;
+export declare const ActivityLabel: ({ className, ...props }: ComponentProps<typeof Txt>) => import("react").JSX.Element;
+export interface ActivityDetailProps extends Omit<ComponentProps<typeof Txt>, 'font'> {
+    font?: 'mono' | 'sans';
+    wrap?: boolean;
+}
+export declare const ActivityDetail: ({ font, wrap, className, ...props }: ActivityDetailProps) => import("react").JSX.Element;
+export declare const ActivitySummary: ({ className, ...props }: ComponentProps<"span">) => import("react").JSX.Element;
+export interface ActivitySpacerProps extends ComponentProps<'span'> {
+    rule?: boolean;
+}
+export declare const ActivitySpacer: ({ rule, className, ...props }: ActivitySpacerProps) => import("react").JSX.Element;
+export declare const ActivityTrailing: ({ className, ...props }: ComponentProps<"span">) => import("react").JSX.Element;
+export declare const ActivityDisclosure: ({ className, children, ...props }: ComponentProps<"span">) => import("react").JSX.Element;
+export interface ActivityHeadlineProps extends Omit<ComponentProps<typeof ActivityHeader>, 'children'> {
+    leading?: ReactNode;
+    icon: ReactNode;
+    label: ReactNode;
+    detail?: string;
+    description?: string;
+    detailFont?: ActivityDetailProps['font'];
+    wrapDetail?: boolean;
+    badges?: ReactNode;
+}
+export declare const ActivityHeadline: ({ leading, icon, label, detail, description, detailFont, wrapDetail, badges, ...props }: ActivityHeadlineProps) => import("react").JSX.Element;
+export declare const ActivityContent: ({ className, children, ...props }: ComponentProps<typeof CollapsibleContent>) => import("react").JSX.Element;
+export interface ActivityItemProps extends Omit<ActivityProps, 'children' | 'open' | 'onOpenChange' | 'foldable'> {
+    icon: ReactNode;
+    label: string;
+    detail?: string;
+    detailFont?: ActivityDetailProps['font'];
+    badges?: ReactNode;
+    collapsible?: boolean;
+    children?: ReactNode;
+    'aria-label': string;
+}
+export declare function ActivityItem({ icon, label, detail, detailFont, badges, collapsible, children, ...props }: ActivityItemProps): import("react").JSX.Element;
+export type { ActivityStatus };

package/dist/src/ds/components/ai/activity/activity.stories.d.ts

@@ -0,0 +1,337 @@
+import { StoryObj } from '@storybook/react-vite';
+import { ActivityItem } from './activity';
+declare const meta: {
+    title: string;
+    component: typeof ActivityItem;
+    args: {
+        icon: import("react").JSX.Element;
+        label: string;
+        detail: string;
+        'aria-label': string;
+        children: import("react").JSX.Element;
+    };
+    argTypes: {
+        status: {
+            control: "inline-radio";
+            options: string[];
+        };
+        collapsible: {
+            control: "boolean";
+        };
+        icon: {
+            control: false;
+        };
+        children: {
+            control: false;
+        };
+    };
+    decorators: ((Story: import('storybook/internal/csf').PartialStoryFn<import('@storybook/react-vite').ReactRenderer, {
+        icon: import('react').ReactNode;
+        label: string;
+        detail?: string | undefined;
+        detailFont?: "mono" | "sans" | undefined;
+        badges?: import('react').ReactNode;
+        collapsible?: boolean | undefined;
+        children?: import('react').ReactNode;
+        'aria-label': string;
+        title?: string | undefined | undefined;
+        ref?: import('react').Ref<HTMLDivElement> | undefined;
+        suppressContentEditableWarning?: boolean | undefined | undefined;
+        suppressHydrationWarning?: boolean | undefined | undefined;
+        accessKey?: string | undefined | undefined;
+        autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
+        autoFocus?: boolean | undefined | undefined;
+        className?: string | ((state: import('@base-ui/react').CollapsibleRootState) => string | undefined) | undefined;
+        contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+        contextMenu?: string | undefined | undefined;
+        dir?: string | undefined | undefined;
+        draggable?: (boolean | "true" | "false") | undefined;
+        enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
+        hidden?: boolean | undefined | undefined;
+        id?: string | undefined | undefined;
+        lang?: string | undefined | undefined;
+        nonce?: string | undefined | undefined;
+        slot?: string | undefined | undefined;
+        spellCheck?: (boolean | "true" | "false") | undefined;
+        style?: import('react').CSSProperties | ((state: import('@base-ui/react').CollapsibleRootState) => React.CSSProperties | undefined) | undefined;
+        tabIndex?: number | undefined | undefined;
+        translate?: "yes" | "no" | undefined | undefined;
+        radioGroup?: string | undefined | undefined;
+        role?: import('react').AriaRole | undefined;
+        about?: string | undefined | undefined;
+        content?: string | undefined | undefined;
+        datatype?: string | undefined | undefined;
+        inlist?: any;
+        prefix?: string | undefined | undefined;
+        property?: string | undefined | undefined;
+        rel?: string | undefined | undefined;
+        resource?: string | undefined | undefined;
+        rev?: string | undefined | undefined;
+        typeof?: string | undefined | undefined;
+        vocab?: string | undefined | undefined;
+        autoCorrect?: string | undefined | undefined;
+        autoSave?: string | undefined | undefined;
+        itemProp?: string | undefined | undefined;
+        itemScope?: boolean | undefined | undefined;
+        itemType?: string | undefined | undefined;
+        itemID?: string | undefined | undefined;
+        itemRef?: string | undefined | undefined;
+        results?: number | undefined | undefined;
+        security?: string | undefined | undefined;
+        unselectable?: "on" | "off" | undefined | undefined;
+        popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
+        popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
+        popoverTarget?: string | undefined | undefined;
+        inert?: boolean | undefined | undefined;
+        inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
+        is?: string | undefined | undefined;
+        exportparts?: string | undefined | undefined;
+        part?: string | undefined | undefined;
+        "aria-activedescendant"?: string | undefined | undefined;
+        "aria-atomic"?: (boolean | "true" | "false") | undefined;
+        "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
+        "aria-braillelabel"?: string | undefined | undefined;
+        "aria-brailleroledescription"?: string | undefined | undefined;
+        "aria-busy"?: (boolean | "true" | "false") | undefined;
+        "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+        "aria-colcount"?: number | undefined | undefined;
+        "aria-colindex"?: number | undefined | undefined;
+        "aria-colindextext"?: string | undefined | undefined;
+        "aria-colspan"?: number | undefined | undefined;
+        "aria-controls"?: string | undefined | undefined;
+        "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
+        "aria-describedby"?: string | undefined | undefined;
+        "aria-description"?: string | undefined | undefined;
+        "aria-details"?: string | undefined | undefined;
+        "aria-disabled"?: (boolean | "true" | "false") | undefined;
+        "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
+        "aria-errormessage"?: string | undefined | undefined;
+        "aria-expanded"?: (boolean | "true" | "false") | undefined;
+        "aria-flowto"?: string | undefined | undefined;
+        "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+        "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
+        "aria-hidden"?: (boolean | "true" | "false") | undefined;
+        "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
+        "aria-keyshortcuts"?: string | undefined | undefined;
+        "aria-labelledby"?: string | undefined | undefined;
+        "aria-level"?: number | undefined | undefined;
+        "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
+        "aria-modal"?: (boolean | "true" | "false") | undefined;
+        "aria-multiline"?: (boolean | "true" | "false") | undefined;
+        "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+        "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
+        "aria-owns"?: string | undefined | undefined;
+        "aria-placeholder"?: string | undefined | undefined;
+        "aria-posinset"?: number | undefined | undefined;
+        "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+        "aria-readonly"?: (boolean | "true" | "false") | undefined;
+        "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
+        "aria-required"?: (boolean | "true" | "false") | undefined;
+        "aria-roledescription"?: string | undefined | undefined;
+        "aria-rowcount"?: number | undefined | undefined;
+        "aria-rowindex"?: number | undefined | undefined;
+        "aria-rowindextext"?: string | undefined | undefined;
+        "aria-rowspan"?: number | undefined | undefined;
+        "aria-selected"?: (boolean | "true" | "false") | undefined;
+        "aria-setsize"?: number | undefined | undefined;
+        "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
+        "aria-valuemax"?: number | undefined | undefined;
+        "aria-valuemin"?: number | undefined | undefined;
+        "aria-valuenow"?: number | undefined | undefined;
+        "aria-valuetext"?: string | undefined | undefined;
+        dangerouslySetInnerHTML?: {
+            __html: string | TrustedHTML;
+        } | undefined | undefined;
+        onCopy?: ((event: import('@base-ui/react').BaseUIEvent<import('react').ClipboardEvent<HTMLDivElement>>) => void) | undefined;
+        onCopyCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').ClipboardEvent<HTMLDivElement>>) => void) | undefined;
+        onCut?: ((event: import('@base-ui/react').BaseUIEvent<import('react').ClipboardEvent<HTMLDivElement>>) => void) | undefined;
+        onCutCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').ClipboardEvent<HTMLDivElement>>) => void) | undefined;
+        onPaste?: ((event: import('@base-ui/react').BaseUIEvent<import('react').ClipboardEvent<HTMLDivElement>>) => void) | undefined;
+        onPasteCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').ClipboardEvent<HTMLDivElement>>) => void) | undefined;
+        onCompositionEnd?: ((event: import('@base-ui/react').BaseUIEvent<import('react').CompositionEvent<HTMLDivElement>>) => void) | undefined;
+        onCompositionEndCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').CompositionEvent<HTMLDivElement>>) => void) | undefined;
+        onCompositionStart?: ((event: import('@base-ui/react').BaseUIEvent<import('react').CompositionEvent<HTMLDivElement>>) => void) | undefined;
+        onCompositionStartCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').CompositionEvent<HTMLDivElement>>) => void) | undefined;
+        onCompositionUpdate?: ((event: import('@base-ui/react').BaseUIEvent<import('react').CompositionEvent<HTMLDivElement>>) => void) | undefined;
+        onCompositionUpdateCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').CompositionEvent<HTMLDivElement>>) => void) | undefined;
+        onFocus?: ((event: import('@base-ui/react').BaseUIEvent<import('react').FocusEvent<HTMLDivElement, Element>>) => void) | undefined;
+        onFocusCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').FocusEvent<HTMLDivElement, Element>>) => void) | undefined;
+        onBlur?: ((event: import('@base-ui/react').BaseUIEvent<import('react').FocusEvent<HTMLDivElement, Element>>) => void) | undefined;
+        onBlurCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').FocusEvent<HTMLDivElement, Element>>) => void) | undefined;
+        onChange?: ((event: import('@base-ui/react').BaseUIEvent<import('react').ChangeEvent<HTMLDivElement, Element>>) => void) | undefined;
+        onChangeCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').ChangeEvent<HTMLDivElement, Element>>) => void) | undefined;
+        onBeforeInput?: ((event: import('@base-ui/react').BaseUIEvent<import('react').InputEvent<HTMLDivElement>>) => void) | undefined;
+        onBeforeInputCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').InputEvent<HTMLDivElement>>) => void) | undefined;
+        onInput?: ((event: import('@base-ui/react').BaseUIEvent<import('react').InputEvent<HTMLDivElement>>) => void) | undefined;
+        onInputCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').InputEvent<HTMLDivElement>>) => void) | undefined;
+        onReset?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onResetCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onSubmit?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SubmitEvent<HTMLDivElement>>) => void) | undefined;
+        onSubmitCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SubmitEvent<HTMLDivElement>>) => void) | undefined;
+        onInvalid?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onInvalidCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onLoad?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onLoadCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onError?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onErrorCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onKeyDown?: ((event: import('@base-ui/react').BaseUIEvent<import('react').KeyboardEvent<HTMLDivElement>>) => void) | undefined;
+        onKeyDownCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').KeyboardEvent<HTMLDivElement>>) => void) | undefined;
+        onKeyPress?: ((event: import('@base-ui/react').BaseUIEvent<import('react').KeyboardEvent<HTMLDivElement>>) => void) | undefined;
+        onKeyPressCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').KeyboardEvent<HTMLDivElement>>) => void) | undefined;
+        onKeyUp?: ((event: import('@base-ui/react').BaseUIEvent<import('react').KeyboardEvent<HTMLDivElement>>) => void) | undefined;
+        onKeyUpCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').KeyboardEvent<HTMLDivElement>>) => void) | undefined;
+        onAbort?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onAbortCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onCanPlay?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onCanPlayCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onCanPlayThrough?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onCanPlayThroughCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onDurationChange?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onDurationChangeCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onEmptied?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onEmptiedCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onEncrypted?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onEncryptedCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onEnded?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onEndedCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onLoadedData?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onLoadedDataCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onLoadedMetadata?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onLoadedMetadataCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onLoadStart?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onLoadStartCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onPause?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onPauseCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onPlay?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onPlayCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onPlaying?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onPlayingCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onProgress?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onProgressCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onRateChange?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onRateChangeCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onSeeked?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onSeekedCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onSeeking?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onSeekingCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onStalled?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onStalledCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onSuspend?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onSuspendCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onTimeUpdate?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onTimeUpdateCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onVolumeChange?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onVolumeChangeCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onWaiting?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onWaitingCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onAuxClick?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onAuxClickCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onClick?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onClickCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onContextMenu?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onContextMenuCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onDoubleClick?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onDoubleClickCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onDrag?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragEnd?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragEndCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragEnter?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragEnterCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragExit?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragExitCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragLeave?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragLeaveCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragOver?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragOverCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragStart?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDragStartCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDrop?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onDropCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').DragEvent<HTMLDivElement>>) => void) | undefined;
+        onMouseDown?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onMouseDownCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onMouseEnter?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onMouseLeave?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onMouseMove?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onMouseMoveCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onMouseOut?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onMouseOutCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onMouseOver?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onMouseOverCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onMouseUp?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onMouseUpCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').MouseEvent<HTMLDivElement, MouseEvent>>) => void) | undefined;
+        onSelect?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onSelectCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').SyntheticEvent<HTMLDivElement, Event>>) => void) | undefined;
+        onTouchCancel?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TouchEvent<HTMLDivElement>>) => void) | undefined;
+        onTouchCancelCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TouchEvent<HTMLDivElement>>) => void) | undefined;
+        onTouchEnd?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TouchEvent<HTMLDivElement>>) => void) | undefined;
+        onTouchEndCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TouchEvent<HTMLDivElement>>) => void) | undefined;
+        onTouchMove?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TouchEvent<HTMLDivElement>>) => void) | undefined;
+        onTouchMoveCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TouchEvent<HTMLDivElement>>) => void) | undefined;
+        onTouchStart?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TouchEvent<HTMLDivElement>>) => void) | undefined;
+        onTouchStartCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TouchEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerDown?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerDownCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerMove?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerMoveCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerUp?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerUpCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerCancel?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerCancelCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerEnter?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerLeave?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerOver?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerOverCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerOut?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onPointerOutCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onGotPointerCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onGotPointerCaptureCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onLostPointerCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onLostPointerCaptureCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').PointerEvent<HTMLDivElement>>) => void) | undefined;
+        onScroll?: ((event: import('@base-ui/react').BaseUIEvent<import('react').UIEvent<HTMLDivElement, UIEvent>>) => void) | undefined;
+        onScrollCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').UIEvent<HTMLDivElement, UIEvent>>) => void) | undefined;
+        onScrollEnd?: ((event: import('@base-ui/react').BaseUIEvent<import('react').UIEvent<HTMLDivElement, UIEvent>>) => void) | undefined;
+        onScrollEndCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').UIEvent<HTMLDivElement, UIEvent>>) => void) | undefined;
+        onWheel?: ((event: import('@base-ui/react').BaseUIEvent<import('react').WheelEvent<HTMLDivElement>>) => void) | undefined;
+        onWheelCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').WheelEvent<HTMLDivElement>>) => void) | undefined;
+        onAnimationStart?: ((event: import('@base-ui/react').BaseUIEvent<import('react').AnimationEvent<HTMLDivElement>>) => void) | undefined;
+        onAnimationStartCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').AnimationEvent<HTMLDivElement>>) => void) | undefined;
+        onAnimationEnd?: ((event: import('@base-ui/react').BaseUIEvent<import('react').AnimationEvent<HTMLDivElement>>) => void) | undefined;
+        onAnimationEndCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').AnimationEvent<HTMLDivElement>>) => void) | undefined;
+        onAnimationIteration?: ((event: import('@base-ui/react').BaseUIEvent<import('react').AnimationEvent<HTMLDivElement>>) => void) | undefined;
+        onAnimationIterationCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').AnimationEvent<HTMLDivElement>>) => void) | undefined;
+        onToggle?: ((event: import('@base-ui/react').BaseUIEvent<import('react').ToggleEvent<HTMLDivElement>>) => void) | undefined;
+        onBeforeToggle?: ((event: import('@base-ui/react').BaseUIEvent<import('react').ToggleEvent<HTMLDivElement>>) => void) | undefined;
+        onTransitionCancel?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TransitionEvent<HTMLDivElement>>) => void) | undefined;
+        onTransitionCancelCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TransitionEvent<HTMLDivElement>>) => void) | undefined;
+        onTransitionEnd?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TransitionEvent<HTMLDivElement>>) => void) | undefined;
+        onTransitionEndCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TransitionEvent<HTMLDivElement>>) => void) | undefined;
+        onTransitionRun?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TransitionEvent<HTMLDivElement>>) => void) | undefined;
+        onTransitionRunCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TransitionEvent<HTMLDivElement>>) => void) | undefined;
+        onTransitionStart?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TransitionEvent<HTMLDivElement>>) => void) | undefined;
+        onTransitionStartCapture?: ((event: import('@base-ui/react').BaseUIEvent<import('react').TransitionEvent<HTMLDivElement>>) => void) | undefined;
+        status?: import('./activity').ActivityStatus | undefined;
+        key?: import('react').Key | null | undefined;
+        disabled?: boolean | undefined | undefined;
+        render?: import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | import('@base-ui/react').ComponentRenderFn<import('@base-ui/react').HTMLProps, import('@base-ui/react').CollapsibleRootState> | undefined;
+        defaultOpen?: boolean | undefined;
+    }>) => import("react").JSX.Element)[];
+    parameters: {
+        layout: string;
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Folded: Story;
+export declare const Expanded: Story;
+export declare const WithoutBody: Story;
+export declare const Running: Story;
+export declare const Failed: Story;
+export declare const KeyboardDisclosure: Story;
+export declare const EveryKind: Story;
+export declare const ComposedAndControlled: Story;

package/dist/src/ds/components/ai/activity/index.d.ts

@@ -0,0 +1,5 @@
+export * from './activity';
+export * from './presets/notification-activity';
+export * from './presets/reasoning-activity';
+export * from './presets/reasoning-visibility';
+export * from './presets/signal-activity';

package/dist/src/ds/components/ai/activity/presets/message-preview.d.ts

@@ -0,0 +1,2 @@
+export declare function messagePreview(message: string): string;
+export declare function messagePreviewShowsAll(message: string): boolean;

package/dist/src/ds/components/ai/activity/presets/notification-activity.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+export interface NotificationActivityProps {
+    label: string;
+    message: string;
+    state?: string;
+    icon?: ReactNode;
+    priority?: string;
+    status?: string;
+    pending?: string;
+    link?: {
+        href: string;
+        label: string;
+    };
+    defaultOpen?: boolean;
+}
+export declare function NotificationActivity({ label, message, state, icon, priority, status, pending, link, defaultOpen, }: NotificationActivityProps): import("react").JSX.Element;

package/dist/src/ds/components/ai/activity/presets/presets.stories.d.ts

@@ -0,0 +1,40 @@
+import { StoryObj } from '@storybook/react-vite';
+import { SignalActivity } from './signal-activity';
+declare const meta: {
+    title: string;
+    component: typeof SignalActivity;
+    args: {
+        kind: "state";
+        label: string;
+        mode: string;
+        message: string;
+    };
+    argTypes: {
+        kind: {
+            control: "inline-radio";
+            options: string[];
+        };
+    };
+    decorators: ((Story: import('storybook/internal/csf').PartialStoryFn<import('@storybook/react-vite').ReactRenderer, {
+        kind: "state" | "reactive" | "reminder";
+        label: string;
+        message: string;
+        detail?: string | undefined;
+        mode?: string | undefined;
+        defaultOpen?: boolean | undefined;
+    }>) => import("react").JSX.Element)[];
+    parameters: {
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Signal: Story;
+export declare const SignalThatFitsItsLine: Story;
+export declare const NotificationPriorities: Story;
+export declare const Transcript: Story;
+export declare const NarrowNotifications: Story;

package/dist/src/ds/components/ai/activity/presets/reasoning-activity.d.ts

@@ -0,0 +1,5 @@
+import { ReasoningContent } from './reasoning-visibility';
+export interface ReasoningActivityProps extends ReasoningContent {
+    defaultOpen?: boolean;
+}
+export declare function ReasoningActivity({ defaultOpen, ...content }: ReasoningActivityProps): import("react").JSX.Element | null;

package/dist/src/ds/components/ai/activity/presets/reasoning-activity.stories.d.ts

@@ -0,0 +1,22 @@
+import { StoryObj } from '@storybook/react-vite';
+import { ReasoningActivity } from './reasoning-activity';
+declare const meta: {
+    title: string;
+    component: typeof ReasoningActivity;
+    parameters: {
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Reloaded: Story;
+export declare const Collapsed: Story;
+export declare const WaitingForText: Story;
+export declare const StreamingText: Story;
+export declare const Redacted: Story;
+export declare const EmptyCompleted: Story;
+export declare const Markdown: Story;

package/dist/src/ds/components/ai/activity/presets/reasoning-visibility.d.ts

@@ -0,0 +1,6 @@
+export interface ReasoningContent {
+    text: string;
+    redacted?: boolean;
+    streaming?: boolean;
+}
+export declare function hasVisibleReasoning({ text, redacted, streaming }: ReasoningContent): boolean;

package/dist/src/ds/components/ai/activity/presets/signal-activity.d.ts

@@ -0,0 +1,9 @@
+export interface SignalActivityProps {
+    kind: 'state' | 'reactive' | 'reminder';
+    label: string;
+    message: string;
+    detail?: string;
+    mode?: string;
+    defaultOpen?: boolean;
+}
+export declare function SignalActivity({ kind, label, message, detail, mode, defaultOpen }: SignalActivityProps): import("react").JSX.Element;

package/dist/src/ds/components/ai/plan/plan.d.ts

@@ -44,5 +44,5 @@ export type PlanControlsProps = ComponentProps<'div'>;
 export declare function PlanControls({ children, className, ...props }: PlanControlsProps): import("react").JSX.Element;
 export type PlanActionGroupProps = ComponentProps<'div'>;
 export declare function PlanActionGroup({ children, className, ...props }: PlanActionGroupProps): import("react").JSX.Element;
-export type PlanExpandButtonProps = Omit<ComponentProps<typeof Button>, 'aria-label' | 'children' | 'onClick' | 'size' | 'type' | 'variant'>;
-export declare function PlanExpandButton({ className, ...props }: PlanExpandButtonProps): import("react").JSX.Element | null;
+export type PlanExpandButtonProps = Omit<ComponentProps<typeof Button>, 'aria-label' | 'children' | 'onClick' | 'size' | 'type'>;
+export declare function PlanExpandButton({ className, variant, ...props }: PlanExpandButtonProps): import("react").JSX.Element | null;

package/dist/src/ds/components/ai/tool-call/index.d.ts

@@ -1,6 +1,6 @@
 export * from './ansi';
 export * from './group-consecutive';
-export * from './tool-call';
+export * from './tool-call-mono';
 export * from './tool-call-arguments';
 export * from './tool-call-edit';
 export * from './tool-call-group';

package/dist/src/ds/components/ai/tool-call/tool-call-arguments.d.ts

@@ -1,8 +1,5 @@
-export interface ToolCallArgumentsProps {
-    toolName: string;
-    args: unknown;
-    argsText?: string;
-    hideArguments?: boolean;
+import { ToolArgumentsInput } from './tool-presentation';
+export interface ToolCallArgumentsProps extends ToolArgumentsInput {
     'data-testid'?: string;
 }
-export declare function ToolCallArguments({ toolName, args, argsText, hideArguments, 'data-testid': testId, }: ToolCallArgumentsProps): import("react").JSX.Element | null;
+export declare function ToolCallArguments({ 'data-testid': testId, ...input }: ToolCallArgumentsProps): import("react").JSX.Element | null;