@mastra/playground-ui 61.0.0-alpha.6 → 61.0.0

package/dist/{span-payload-primitives-0b_ow5Rt.cjs → span-payload-primitives-DIyQNNw0.cjs}

@@ -4,9 +4,10 @@ const jsxRuntime = require('react/jsx-runtime');
 const lucideReact = require('lucide-react');
 const domains_traces_components_spanPayload_spanPayloadJson = require('./domains/traces/components/span-payload/span-payload-json.cjs.js');
 const collapsible = require('./collapsible-jfzzU7Gp.cjs');
-const markdownRenderer = require('./markdown-renderer-BCeiKCA4.cjs');
+const markdownRenderer = require('./markdown-renderer-4P5RZjlT.cjs');
+const Txt = require('./Txt-DFPibRb3.cjs');
 const domains_chat_components_badgeWrapper = require('./domains/chat/components/badge-wrapper.cjs.js');
-const activity = require('./activity-ClKZR5_o.cjs');
+const activity = require('./activity-C3F5Z6U2.cjs');
 const toolPresentation = require('./tool-presentation-WLS6d1ws.cjs');
 
 const isRecord = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
@@ -40,7 +41,7 @@ function SpanPayloadTool({ value, showLabel = true }) {
 }
 
 function SpanPayloadLabel({ children }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-meta tracking-widest text-placeholder uppercase", children });
+  return /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { as: "span", variant: "meta", tone: "faint", className: "block uppercase", children });
 }
 function SpanPayloadField({ label, children }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-slot": "span-payload-field", className: "flex flex-col gap-1.5", children: [
@@ -49,7 +50,7 @@ function SpanPayloadField({ label, children }) {
   ] });
 }
 function SpanPayloadMarkdown({ children }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "span-payload-markdown", className: "text-body text-foreground", children: /* @__PURE__ */ jsxRuntime.jsx(markdownRenderer.MarkdownRenderer, { children }) });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "span-payload-markdown", className: "text-foreground", children: /* @__PURE__ */ jsxRuntime.jsx(markdownRenderer.MarkdownRenderer, { children }) });
 }
 function SpanPayloadCollapsible({
   label,
@@ -57,7 +58,7 @@ function SpanPayloadCollapsible({
   defaultOpen = false
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(collapsible.Collapsible, { defaultOpen, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(collapsible.CollapsibleTrigger, { className: "flex items-center gap-1 text-meta tracking-widest text-placeholder uppercase [&>svg]:size-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(collapsible.CollapsibleTrigger, { className: "flex items-center gap-1 text-meta text-placeholder uppercase [&>svg]:size-3", children: [
       /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRightIcon, {}),
       label
     ] }),
@@ -74,4 +75,4 @@ exports.SpanPayloadLabel = SpanPayloadLabel;
 exports.SpanPayloadMarkdown = SpanPayloadMarkdown;
 exports.SpanPayloadTool = SpanPayloadTool;
 exports.SpanPayloadToolCalls = SpanPayloadToolCalls;
-//# sourceMappingURL=span-payload-primitives-0b_ow5Rt.cjs.map
+//# sourceMappingURL=span-payload-primitives-DIyQNNw0.cjs.map

package/dist/span-payload-primitives-DIyQNNw0.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"span-payload-primitives-DIyQNNw0.cjs","sources":["../src/domains/traces/components/span-payload/span-payload-tool.tsx","../src/domains/traces/components/span-payload/span-payload-primitives.tsx"],"sourcesContent":["import { SpanPayloadJson } from './span-payload-json';\nimport { SpanPayloadField, SpanPayloadLabel } from './span-payload-primitives';\nimport { BadgeWrapper } from '@/domains/chat/components/badge-wrapper';\nimport { ActivityHeadline } from '@/ds/components/ai/activity';\nimport { presentTool } from '@/ds/components/ai/tool-call/tool-presentation';\n\nconst isRecord = (value: unknown): value is Record<string, unknown> =>\n  typeof value === 'object' && value !== null && !Array.isArray(value);\n\nexport function SpanPayloadTool({ value, showLabel = true }: { value: unknown; showLabel?: boolean }) {\n  if (!isRecord(value)) return <SpanPayloadJson value={value} />;\n  const call = value.type === 'tool-invocation' ? value.toolInvocation : value;\n  if (!isRecord(call) || typeof call.toolName !== 'string' || !call.toolName) {\n    return <SpanPayloadJson value={value} />;\n  }\n  const input = 'args' in call ? call.args : call.input;\n  const output = 'result' in call ? call.result : call.output;\n  const error = call.isError === true || call.state === 'output-error';\n  const errorText = typeof call.errorText === 'string' ? call.errorText : undefined;\n  const { icon: ToolIcon, label, detail, description } = presentTool(call.toolName, input);\n  const hasBody = input !== undefined || output !== undefined || errorText !== undefined;\n  return (\n    <div data-slot=\"span-payload-tool\" className=\"flex flex-col gap-2\">\n      {showLabel && <SpanPayloadLabel>{value.type === 'tool-result' ? 'Tool result' : 'Tool call'}</SpanPayloadLabel>}\n      <BadgeWrapper\n        status={error ? 'error' : 'idle'}\n        header={\n          <ActivityHeadline icon={<ToolIcon aria-hidden />} label={label} detail={detail} description={description} />\n        }\n      >\n        {hasBody && (\n          <div className=\"flex flex-col gap-3\">\n            {input !== undefined && (\n              <SpanPayloadField label=\"Arguments\">\n                <SpanPayloadJson value={input} />\n              </SpanPayloadField>\n            )}\n            {output !== undefined && (\n              <SpanPayloadField label=\"Result\">\n                <SpanPayloadJson value={output} />\n              </SpanPayloadField>\n            )}\n            {errorText !== undefined && (\n              <SpanPayloadField label=\"Error\">\n                <SpanPayloadJson value={errorText} />\n              </SpanPayloadField>\n            )}\n          </div>\n        )}\n      </BadgeWrapper>\n    </div>\n  );\n}\n","import { ChevronRightIcon } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport { SpanPayloadTool } from './span-payload-tool';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/ds/components/Collapsible';\nimport { MarkdownRenderer } from '@/ds/components/MarkdownRenderer';\nimport { Txt } from '@/ds/components/Txt';\n\n/** Small-caps label above a field of a rich payload. */\nexport function SpanPayloadLabel({ children }: { children: ReactNode }) {\n  return (\n    <Txt as=\"span\" variant=\"meta\" tone=\"faint\" className=\"block uppercase\">\n      {children}\n    </Txt>\n  );\n}\n\nexport function SpanPayloadField({ label, children }: { label: ReactNode; children: ReactNode }) {\n  return (\n    <div data-slot=\"span-payload-field\" className=\"flex flex-col gap-1.5\">\n      <SpanPayloadLabel>{label}</SpanPayloadLabel>\n      {children}\n    </div>\n  );\n}\n\nexport function SpanPayloadMarkdown({ children }: { children: string }) {\n  return (\n    <div data-slot=\"span-payload-markdown\" className=\"text-foreground\">\n      <MarkdownRenderer>{children}</MarkdownRenderer>\n    </div>\n  );\n}\n\n/** A collapsed block for secondary data (reasoning, steps, warnings…). */\nexport function SpanPayloadCollapsible({\n  label,\n  children,\n  defaultOpen = false,\n}: {\n  label: ReactNode;\n  children: ReactNode;\n  defaultOpen?: boolean;\n}) {\n  return (\n    <Collapsible defaultOpen={defaultOpen}>\n      <CollapsibleTrigger className=\"flex items-center gap-1 text-meta text-placeholder uppercase [&>svg]:size-3\">\n        <ChevronRightIcon />\n        {label}\n      </CollapsibleTrigger>\n      <CollapsibleContent className=\"pt-1.5\">{children}</CollapsibleContent>\n    </Collapsible>\n  );\n}\n\n/** Tool calls as core records them: `{ toolName, args | input }` when they have that shape, JSON otherwise. */\nexport function SpanPayloadToolCalls({ toolCalls }: { toolCalls: unknown[] }) {\n  return (\n    <ul data-slot=\"span-payload-tool-calls\" className=\"flex flex-col gap-2\">\n      {toolCalls.map((call, index) => (\n        <li key={index}>\n          <SpanPayloadTool value={call} showLabel={false} />\n        </li>\n      ))}\n    </ul>\n  );\n}\n"],"names":["jsx","SpanPayloadJson","presentTool","jsxs","BadgeWrapper","ActivityHeadline","Txt","MarkdownRenderer","Collapsible","CollapsibleTrigger","ChevronRightIcon","CollapsibleContent"],"mappings":"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"}

package/dist/src/domains/chat/attachments/composer-attachment-context.d.ts

@@ -0,0 +1 @@
+export declare const ComposerAttachmentContext: import('react').Context<string | undefined>;

package/dist/src/domains/chat/attachments/composer-attachment-entry.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+/** Preview content shares the composer's filename without duplicating it in each adapter. */
+export declare function ComposerAttachmentEntry({ children, name, variant, }: {
+    children: ReactNode;
+    name?: string;
+    variant?: 'image' | 'icon';
+}): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | import("react").JSX.Element | null | undefined;

package/dist/src/domains/chat/attachments/composer-attachment.d.ts

@@ -3,6 +3,7 @@ export interface ComposerAttachmentProps {
     name: string;
     children: ReactNode;
     onRemove: () => void;
+    /** Inline entries allow a little more width for long filenames. */
     variant?: 'thumbnail' | 'inline';
 }
 export declare function ComposerAttachment({ name, children, onRemove, variant }: ComposerAttachmentProps): import("react").JSX.Element;

package/dist/src/domains/chat/components/badge-wrapper.d.ts

@@ -7,11 +7,14 @@ export interface BadgeWrapperProps {
     collapsible?: boolean;
     /** Salient argument shown next to the title: path, command, pattern… */
     detail?: string;
+    /** Model-written intent; replaces title and detail in the line when present. */
+    description?: string;
     /** Interactive trailing extras (dialog triggers), kept outside the collapse trigger. */
     extraInfo?: React.ReactNode;
-    /** Replaces the assembled icon/title/detail line — the tool path passes its presented headline. */
+    /** Replaces the assembled icon/title/detail line. */
     header?: React.ReactNode;
+    badges?: React.ReactNode;
     status?: ActivityStatus;
     'data-testid'?: string;
 }
-export declare const BadgeWrapper: ({ children, initialCollapsed, icon, title, detail, collapsible, extraInfo, header: headerOverride, status, "data-testid": dataTestId, }: BadgeWrapperProps) => import("react").JSX.Element;
+export declare const BadgeWrapper: ({ children, initialCollapsed, icon, title, detail, description, collapsible, extraInfo, header: headerOverride, badges, status, "data-testid": dataTestId, }: BadgeWrapperProps) => import("react").JSX.Element;

package/dist/src/domains/chat/context/tool-call-context.d.ts

@@ -23,4 +23,5 @@ interface ToolCallProviderProps extends ToolCallContextValue {
 }
 export declare function ToolCallProvider({ children, approveToolcall, declineToolcall, approveToolcallGenerate, declineToolcallGenerate, approveNetworkToolcall, declineNetworkToolcall, isRunning, toolCallApprovals, networkToolCallApprovals, }: ToolCallProviderProps): import("react").JSX.Element;
 export declare function useToolCall(): ToolCallContextValue;
+export declare function useOptionalToolCall(): ToolCallContextValue | undefined;
 export {};

package/dist/src/domains/chat/stories/composer-attachments.stories.d.ts

@@ -14,5 +14,8 @@ declare const meta: {
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Images: Story;
+export declare const WithAttachmentsAndActions: Story;
 export declare const MixedFiles: Story;
+export declare const AllFileTypes: Story;
 export declare const PreviewAndRemove: Story;
+export declare const KeyboardRemove: Story;

package/dist/src/domains/chat/tools/badges/agent-badge-wrapper.d.ts

@@ -1,6 +1,6 @@
 import { AgentMessage } from './agent-badge';
 import { MessageMetadata } from '../..';
-import { ToolApprovalButtonsProps } from './tool-approval-buttons';
+import { ToolApprovalRequest } from './tool-approval-badge';
 import { ActivityStatus } from '../../../../ds/components/ai/activity';
 interface SubAgentToolResult {
     toolName: string;
@@ -8,7 +8,7 @@ interface SubAgentToolResult {
     result: any;
     args: any;
 }
-interface AgentBadgeWrapperProps extends Omit<ToolApprovalButtonsProps, 'toolCalled'> {
+interface AgentBadgeWrapperProps extends Omit<ToolApprovalRequest, 'toolCalled'> {
     agentId: string;
     result?: {
         childMessages?: AgentMessage[];

package/dist/src/domains/chat/tools/badges/agent-badge.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
 import { MessageMetadata } from '../..';
-import { ToolApprovalButtonsProps } from './tool-approval-buttons';
+import { ToolApprovalRequest } from './tool-approval-badge';
 import { ActivityStatus } from '../../../../ds/components/ai/activity';
 type TextMessage = {
     type: 'text';
@@ -15,7 +15,7 @@ type ToolMessage = {
     result?: any;
 };
 export type AgentMessage = TextMessage | ToolMessage;
-export interface AgentBadgeProps extends Omit<ToolApprovalButtonsProps, 'toolCalled'> {
+export interface AgentBadgeProps extends Omit<ToolApprovalRequest, 'toolCalled'> {
     agentId: string;
     messages: AgentMessage[];
     metadata?: MessageMetadata;

package/dist/src/domains/chat/tools/badges/awaits-tool-approval.d.ts

@@ -1,4 +1,4 @@
-import { ToolApprovalButtonsProps } from './tool-approval-buttons';
-type ToolApprovalState = Pick<ToolApprovalButtonsProps, 'toolApprovalMetadata' | 'toolCalled'>;
+import { ToolApprovalRequest } from './tool-approval-badge';
+type ToolApprovalState = Pick<ToolApprovalRequest, 'toolApprovalMetadata' | 'toolCalled'>;
 export declare function awaitsToolApproval({ toolApprovalMetadata, toolCalled }: ToolApprovalState): boolean;
 export {};

package/dist/src/domains/chat/tools/badges/code-mode-badge.d.ts

@@ -1,7 +1,7 @@
 import { MessageMetadata } from '../../messages/message-metadata';
 import { CodeModeResult } from '../code-mode';
-import { ToolApprovalButtonsProps } from './tool-approval-buttons';
-export interface CodeModeBadgeProps extends Omit<ToolApprovalButtonsProps, 'toolCalled'> {
+import { ToolApprovalRequest } from './tool-approval-badge';
+export interface CodeModeBadgeProps extends Omit<ToolApprovalRequest, 'toolCalled'> {
     toolName: string;
     code: string;
     result?: CodeModeResult;

package/dist/src/domains/chat/tools/badges/file-tree-badge.d.ts

@@ -1,8 +1,8 @@
 import { DataMessagePart } from '../tool-card';
 import { MessageMetadata } from '../..';
-import { ToolApprovalButtonsProps } from './tool-approval-buttons';
+import { ToolApprovalRequest } from './tool-approval-badge';
 import { ActivityStatus } from '../../../../ds/components/ai/activity';
-export interface FileTreeBadgeProps extends Omit<ToolApprovalButtonsProps, 'toolCalled'> {
+export interface FileTreeBadgeProps extends Omit<ToolApprovalRequest, 'toolCalled'> {
     toolName: string;
     args: Record<string, unknown> | string;
     result: unknown;

package/dist/src/domains/chat/tools/badges/sandbox-execution-badge.d.ts

@@ -1,8 +1,8 @@
 import { DataMessagePart } from '../tool-card';
 import { MessageMetadata } from '../..';
-import { ToolApprovalButtonsProps } from './tool-approval-buttons';
+import { ToolApprovalRequest } from './tool-approval-badge';
 import { ActivityStatus } from '../../../../ds/components/ai/activity';
-export interface SandboxExecutionBadgeProps extends Omit<ToolApprovalButtonsProps, 'toolCalled'> {
+export interface SandboxExecutionBadgeProps extends Omit<ToolApprovalRequest, 'toolCalled'> {
     toolName: string;
     args: Record<string, unknown> | string;
     result: unknown;

package/dist/src/domains/chat/tools/badges/tool-approval-badge.d.ts

@@ -0,0 +1,19 @@
+import { BadgeWrapperProps } from '../../components/badge-wrapper';
+export interface ToolApprovalRequest {
+    toolCallId: string;
+    toolName: string;
+    toolCalled: boolean;
+    toolApprovalMetadata: {
+        toolCallId: string;
+        toolName: string;
+        args: Record<string, any>;
+        runId?: string;
+    } | undefined;
+    isNetwork: boolean;
+    isGenerateMode?: boolean;
+}
+type ToolApprovalBadgeProps = BadgeWrapperProps & {
+    approval: ToolApprovalRequest;
+};
+export declare function ToolApprovalBadge({ approval: request, children, collapsible, ...props }: ToolApprovalBadgeProps): import("react").JSX.Element;
+export {};

package/dist/src/domains/chat/tools/badges/tool-badge.d.ts

@@ -1,7 +1,7 @@
 import { MessageMetadata } from '../..';
-import { ToolApprovalButtonsProps } from './tool-approval-buttons';
+import { ToolApprovalRequest } from './tool-approval-badge';
 import { ActivityStatus } from '../../../../ds/components/ai/activity';
-export interface ToolBadgeProps extends Omit<ToolApprovalButtonsProps, 'toolCalled'> {
+export interface ToolBadgeProps extends Omit<ToolApprovalRequest, 'toolCalled'> {
     toolName: string;
     args: Record<string, unknown> | string;
     result: any;

package/dist/src/domains/chat/tools/badges/workflow-badge.d.ts

@@ -1,7 +1,7 @@
 import { MessageMetadata } from '../..';
-import { ToolApprovalButtonsProps } from './tool-approval-buttons';
+import { ToolApprovalRequest } from './tool-approval-badge';
 import { WorkflowRunStreamResult } from '../../../workflows/context/workflow-run-context';
-export interface WorkflowBadgeProps extends Omit<ToolApprovalButtonsProps, 'toolCalled'> {
+export interface WorkflowBadgeProps extends Omit<ToolApprovalRequest, 'toolCalled'> {
     workflowId: string;
     result?: any;
     isStreaming?: boolean;

package/dist/src/domains/traces/components/trace-data-panel-view.d.ts

@@ -34,6 +34,8 @@ export interface TraceDataPanelViewProps {
     depth?: DataPanelProps['depth'];
     /** Rendered inside the drawer above the trace header (e.g. inbox feedback context). */
     headerSlot?: ReactNode;
+    /** Integration-specific actions shown alongside the standard trace controls. */
+    headerActionsSlot?: ReactNode;
     /** Accessible drawer name; defaults to the trace id. */
     title?: string;
     placement: TraceDataPanelPlacement;
@@ -105,4 +107,4 @@ export interface TraceDataPanelViewProps {
      */
     spanPanelSlot?: ReactNode;
 }
-export declare function TraceDataPanelView({ traceId, spans, isLoading, onClose, onSpanSelect, onEvaluateTrace, onSaveAsDatasetItem, onAddTraceMocksToItem, initialSpanId, onPrevious, onNext, size, depth, headerSlot, title, placement, LinkComponent, traceHref, entityHref, usage, anchorSpanId, showUnavailableFeaturesMsg, scoresTabSlot, scoresTabBadge, feedbackTabSlot, feedbackTabBadge, featuredSpanIds, messagesPanelSlot, sideHeaderActions, sideView: controlledSideView, onSideViewChange, spanView: controlledSpanView, onSpanViewChange, spanPanelSlot, }: TraceDataPanelViewProps): import("react").JSX.Element;
+export declare function TraceDataPanelView({ traceId, spans, isLoading, onClose, onSpanSelect, onEvaluateTrace, onSaveAsDatasetItem, onAddTraceMocksToItem, initialSpanId, onPrevious, onNext, size, depth, headerSlot, headerActionsSlot, title, placement, LinkComponent, traceHref, entityHref, usage, anchorSpanId, showUnavailableFeaturesMsg, scoresTabSlot, scoresTabBadge, feedbackTabSlot, feedbackTabBadge, featuredSpanIds, messagesPanelSlot, sideHeaderActions, sideView: controlledSideView, onSideViewChange, spanView: controlledSpanView, onSpanViewChange, spanPanelSlot, }: TraceDataPanelViewProps): import("react").JSX.Element;

package/dist/src/domains/traces/components/trace-data-panel-view.stories.d.ts

@@ -24,6 +24,7 @@ declare const meta: {
         size?: "md" | "full" | "half" | "wide" | undefined;
         depth?: 3 | 1 | 2 | undefined;
         headerSlot?: import('react').ReactNode;
+        headerActionsSlot?: import('react').ReactNode;
         title?: string | undefined;
         placement: import('./trace-data-panel-view').TraceDataPanelPlacement;
         timelineChartWidth?: "wide" | "default" | undefined;

package/dist/src/domains/traces/components/trace-span-panel.d.ts

@@ -47,6 +47,8 @@ export interface TraceSpanPanelProps {
     depth?: TraceDataPanelViewProps['depth'];
     /** Rendered inside the drawer above the trace header (e.g. feedback context). */
     headerSlot?: ReactNode;
+    /** Integration actions displayed alongside the trace controls. */
+    headerActionsSlot?: ReactNode;
     /** Accessible drawer name; defaults to the trace id. */
     title?: string;
     showUnavailableFeaturesMsg?: TraceDataPanelViewProps['showUnavailableFeaturesMsg'];
@@ -62,5 +64,5 @@ export interface TraceSpanPanelProps {
  * Encapsulates the span-detail fetch and prev/next span navigation that the traces page
  * and the agent chat traces aside used to duplicate.
  */
-export declare function TraceSpanPanel({ traceId, spans, isLoadingSpans, selectedSpanId, onSpanSelect, onClose, anchorSpanId, initialSpanId, onPrevious, onNext, onSaveAsDatasetItem, onAddTraceMocksToItem, feedbackTabBadge, feedbackTabSlot, showPartialThread, featuredSpanIds, onHighlightSpans, isFullThreadOpen, onFullThreadOpenChange, withQueryTrace, withFeedback, onOpenScore, scoresTabBadge, scoresTabSlot, usage, traceHref, size, depth, headerSlot, title, showUnavailableFeaturesMsg, spanView, onSpanViewChange, spanActiveTab, onSpanTabChange, spanFeedbackTabBadge, spanFeedbackTabSlot, }: TraceSpanPanelProps): import("react").JSX.Element;
+export declare function TraceSpanPanel({ traceId, spans, isLoadingSpans, selectedSpanId, onSpanSelect, onClose, anchorSpanId, initialSpanId, onPrevious, onNext, onSaveAsDatasetItem, onAddTraceMocksToItem, feedbackTabBadge, feedbackTabSlot, showPartialThread, featuredSpanIds, onHighlightSpans, isFullThreadOpen, onFullThreadOpenChange, withQueryTrace, withFeedback, onOpenScore, scoresTabBadge, scoresTabSlot, usage, traceHref, size, depth, headerSlot, headerActionsSlot, title, showUnavailableFeaturesMsg, spanView, onSpanViewChange, spanActiveTab, onSpanTabChange, spanFeedbackTabBadge, spanFeedbackTabSlot, }: TraceSpanPanelProps): import("react").JSX.Element;
 export {};

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

@@ -4,11 +4,14 @@ import { VariantProps } from 'class-variance-authority';
 import { HTMLAttributes } from 'react';
 import { JsonSchema } from '../../../lib/json-schema';
 export type CodeEditorLanguage = 'json' | 'markdown';
-export declare const useCodemirrorTheme: () => Extension;
+type CodeEditorFont = 'body' | 'mono';
+export declare const useCodemirrorTheme: (font?: CodeEditorFont) => Extension;
 declare const codeEditorVariants: (props?: ({
     variant?: "default" | "embedded" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type CodeEditorProps = {
+    /** Prose editors can opt into the body face; code stays monospace by default. */
+    font?: CodeEditorFont;
     data?: Record<string, unknown> | Array<Record<string, unknown>>;
     value?: string;
     onChange?: (value: string) => void;
@@ -28,6 +31,8 @@ export type CodeEditorProps = {
     editable?: boolean;
 } & VariantProps<typeof codeEditorVariants> & Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;
 export declare const CodeEditor: import('react').ForwardRefExoticComponent<{
+    /** Prose editors can opt into the body face; code stays monospace by default. */
+    font?: CodeEditorFont;
     data?: Record<string, unknown> | Array<Record<string, unknown>>;
     value?: string;
     onChange?: (value: string) => void;

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

@@ -16,3 +16,4 @@ export declare const WithoutLineWrapping: Story;
 export declare const MarkdownWithVariables: Story;
 export declare const MarkdownWithoutVariables: Story;
 export declare const MarkdownWithAutocomplete: Story;
+export declare const Prose: Story;

package/dist/src/ds/components/Composer/composer.stories.d.ts

@@ -4,7 +4,6 @@ declare const meta: Meta<typeof Composer>;
 export default meta;
 type Story = StoryObj<typeof Composer>;
 export declare const Empty: Story;
-export declare const WithAttachmentsAndActions: Story;
 export declare const DisabledAndRunning: Story;
 export declare const RingIdle: Story;
 export declare const RingBusy: Story;

package/dist/src/ds/components/DataList/data-list-group.d.ts

@@ -0,0 +1,4 @@
+import { ComponentPropsWithoutRef } from 'react';
+export type DataListGroupProps = ComponentPropsWithoutRef<'section'>;
+/** Rows sharing the list's columns; the hover lights them only while the pointer is on or between them. */
+export declare const DataListGroup: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import('react').RefAttributes<HTMLElement>>;

package/dist/src/ds/components/DataList/data-list-skeleton.d.ts

@@ -5,6 +5,15 @@ export type DataListSkeletonProps = {
     fit?: DataListFit;
     variant?: DataListVariant;
 };
+export type DataListSkeletonRowsProps = {
+    columnCount: number;
+    numberOfRows?: number;
+};
+/**
+ * Placeholder rows only, for lists that keep their real root and header while
+ * loading (e.g. virtualized lists that must keep the same scroll container).
+ */
+export declare function DataListSkeletonRows({ columnCount, numberOfRows }: DataListSkeletonRowsProps): import("react").JSX.Element[];
 /**
  * Loading placeholder mirroring the real list: same root, a sticky header
  * band with one placeholder label per column, then rows of placeholder cells.

package/dist/src/ds/components/DataList/data-list.d.ts

@@ -51,6 +51,7 @@ export declare const DataList: typeof DataListRoot & {
     SelectCell: typeof DataListSelectCell;
     TopSelectCell: typeof DataListTopSelectCell;
     NoMatch: typeof DataListNoMatch;
+    Group: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import('react').RefAttributes<HTMLElement>>;
     Subheader: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
     SubHeading: typeof DataListSubHeading;
     Spacer: typeof DataListSpacer;

package/dist/src/ds/components/DataList/data-list.stories.d.ts

@@ -24,5 +24,6 @@ export declare const Loading: Story;
 export declare const StickyOverflow: Story;
 export declare const WithPagination: Story;
 export declare const WithSubheaders: Story;
+export declare const WithGroups: Story;
 /** Roving focus with ArrowUp, ArrowDown, Home, End, PageUp and PageDown. */
 export declare const KeyboardNavigation: Story;

package/dist/src/ds/components/Sidebar/footer/sidebar-footer-meta.d.ts

@@ -0,0 +1,7 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+export type SidebarFooterMetaProps = ComponentPropsWithoutRef<'div'> & {
+    action?: ReactNode;
+};
+export declare const SidebarFooterMeta: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    action?: ReactNode;
+} & import('react').RefAttributes<HTMLDivElement>>;

package/dist/src/ds/components/Sidebar/footer/sidebar-footer.d.ts

@@ -0,0 +1,3 @@
+import { ComponentPropsWithoutRef } from 'react';
+export type SidebarFooterProps = ComponentPropsWithoutRef<'footer'>;
+export declare function SidebarFooter({ className, children, ...props }: SidebarFooterProps): import("react").JSX.Element;

package/dist/src/ds/components/Sidebar/footer/sidebar-meter.d.ts

@@ -0,0 +1,24 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { SidebarState } from '../root/sidebar-context';
+import { LinkComponent } from '../../../types/link-component';
+export type SidebarMeterTone = 'neutral' | 'warning' | 'danger';
+interface SidebarMeterBaseProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children'> {
+    label: ReactNode;
+    value: ReactNode;
+    status?: ReactNode;
+    tone?: SidebarMeterTone;
+    icon?: ReactNode;
+    action?: ReactNode;
+    LinkComponent?: LinkComponent;
+    state?: SidebarState;
+}
+type SidebarMeterLinkProps = {
+    href: string;
+    linkLabel: string;
+} | {
+    href?: never;
+    linkLabel?: never;
+};
+export type SidebarMeterProps = SidebarMeterBaseProps & SidebarMeterLinkProps;
+export declare const SidebarMeter: import('react').ForwardRefExoticComponent<SidebarMeterProps & import('react').RefAttributes<HTMLDivElement>>;
+export {};

package/dist/src/ds/components/Sidebar/header/sidebar-brand.d.ts

@@ -0,0 +1,6 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+export type SidebarBrandProps = Omit<ComponentPropsWithoutRef<'div'>, 'title'> & {
+    logo?: ReactNode;
+    title: ReactNode;
+};
+export declare function SidebarBrand({ logo, title, className, ...props }: SidebarBrandProps): import("react").JSX.Element;

package/dist/src/ds/components/Sidebar/header/sidebar-command-header.d.ts

@@ -0,0 +1,3 @@
+import { ComponentPropsWithoutRef } from 'react';
+export type SidebarCommandHeaderProps = ComponentPropsWithoutRef<'header'>;
+export declare const SidebarCommandHeader: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import('react').RefAttributes<HTMLElement>>;

package/dist/src/ds/components/Sidebar/header/sidebar-header.d.ts

@@ -0,0 +1,6 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+export type SidebarHeaderProps = ComponentPropsWithoutRef<'header'> & {
+    collapsedLogo?: ReactNode;
+    actions?: ReactNode;
+};
+export declare function SidebarHeader({ className, children, collapsedLogo, actions, ...props }: SidebarHeaderProps): import("react").JSX.Element;

package/dist/src/ds/components/Sidebar/header/sidebar-search-trigger.d.ts

@@ -0,0 +1,7 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+export type SidebarSearchTriggerProps = ComponentPropsWithoutRef<'button'> & {
+    shortcut?: ReactNode;
+};
+export declare const SidebarSearchTrigger: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    shortcut?: ReactNode;
+} & import('react').RefAttributes<HTMLButtonElement>>;

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

@@ -0,0 +1,20 @@
+export { Sidebar } from './sidebar';
+export { SidebarBrand, type SidebarBrandProps } from './header/sidebar-brand';
+export { SidebarCommandHeader, type SidebarCommandHeaderProps } from './header/sidebar-command-header';
+export { SidebarFooter, type SidebarFooterProps } from './footer/sidebar-footer';
+export { SidebarFooterMeta, type SidebarFooterMetaProps } from './footer/sidebar-footer-meta';
+export { SidebarHeader, type SidebarHeaderProps } from './header/sidebar-header';
+export { SidebarMeter, type SidebarMeterProps, type SidebarMeterTone } from './footer/sidebar-meter';
+export { SidebarNav, type SidebarNavProps } from './nav/sidebar-nav';
+export { SidebarNavHeader, type SidebarNavHeaderProps } from './nav/sidebar-nav-header';
+export { SidebarNavLink, type SidebarLink, type SidebarNavLinkProps } from './nav/sidebar-nav-link';
+export { navItemClasses, type SidebarNavItemSize } from './nav/sidebar-nav-item-classes';
+export { getIsLinkActive } from './nav/sidebar-link-active';
+export { SidebarNavStack, type SidebarNavStackProps, type SidebarNavStackRootViewProps, type SidebarNavStackViewProps, } from './nav-stack/sidebar-nav-stack';
+export { useMaybeSidebar, useMaybeSidebarState, useMobileDrawer, useSidebar, type MobileDrawerContextValue, type SidebarState, type SidebarStateContextValue, } from './root/sidebar-context';
+export { SidebarMobileTrigger, type SidebarMobileTriggerProps } from './root/sidebar-mobile-trigger';
+export { SidebarProvider, type SidebarProviderProps } from './root/sidebar-provider';
+export { SidebarRoot, type SidebarRootProps } from './root/sidebar-root';
+export { SidebarTrigger, type SidebarTriggerProps } from './root/sidebar-trigger';
+export { SidebarSearchTrigger, type SidebarSearchTriggerProps } from './header/sidebar-search-trigger';
+export { SidebarSections, type SidebarSection, type SidebarSectionsProps } from './sections/sidebar-sections';

package/dist/src/ds/components/{MainSidebar/main-sidebar-link-active.d.ts → Sidebar/nav/sidebar-link-active.d.ts}

@@ -1,7 +1,7 @@
-import { NavLink } from './main-sidebar-nav-link';
+import { SidebarLink } from './sidebar-nav-link';
 /**
  * Strict active-path match with sibling-exclusion.
  * - `pathname === link.url` or starts with `link.url + '/'`
  * - Not active if any sibling link has a longer matching url (prevents `/a` lighting while `/a/b` matches).
  */
-export declare function getIsLinkActive(link: NavLink, pathname: string, siblings?: NavLink[]): boolean;
+export declare function getIsLinkActive(link: SidebarLink, pathname: string, siblings?: SidebarLink[]): boolean;

package/dist/src/ds/components/Sidebar/nav/sidebar-nav-header.d.ts

@@ -0,0 +1,13 @@
+import { ComponentPropsWithoutRef } from 'react';
+import { SidebarState } from '../root/sidebar-context';
+import { LinkComponent } from '../../../types/link-component';
+export type SidebarNavHeaderProps = Omit<ComponentPropsWithoutRef<'header'>, 'children'> & {
+    children?: React.ReactNode;
+    icon?: React.ReactNode;
+    action?: React.ReactNode;
+    state?: SidebarState;
+    href?: string;
+    isActive?: boolean;
+    LinkComponent?: LinkComponent;
+};
+export declare function SidebarNavHeader({ children, icon, action, className, state: stateProp, href, isActive, LinkComponent: LinkProp, ...props }: SidebarNavHeaderProps): import("react").JSX.Element;

package/dist/src/ds/components/{MainSidebar/main-sidebar-nav-item-classes.d.ts → Sidebar/nav/sidebar-nav-item-classes.d.ts}

@@ -3,7 +3,7 @@ declare const navItemVariants: (props?: ({
     size?: "sm" | "md" | "lg" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 type NavItemVariantProps = VariantProps<typeof navItemVariants>;
-export type MainSidebarNavItemSize = NonNullable<NavItemVariantProps['size']>;
+export type SidebarNavItemSize = NonNullable<NavItemVariantProps['size']>;
 type NavRowSurfaceOptions = {
     isActive?: boolean;
     isFeatured?: boolean;
@@ -11,7 +11,7 @@ type NavRowSurfaceOptions = {
 type NavItemLayoutOptions = {
     isCollapsed?: boolean;
     level?: number;
-    size?: MainSidebarNavItemSize;
+    size?: SidebarNavItemSize;
 };
 type ItemStyleOptions = NavRowSurfaceOptions & NavItemLayoutOptions;
 export declare const navRowSurfaceClasses: ({ isActive, isFeatured }: NavRowSurfaceOptions) => string;

package/dist/src/ds/components/{MainSidebar/main-sidebar-nav-label.d.ts → Sidebar/nav/sidebar-nav-label.d.ts}

@@ -1,11 +1,11 @@
 import { ComponentPropsWithoutRef } from 'react';
-import { SidebarState } from './main-sidebar-context';
-export type MainSidebarNavLabelProps = ComponentPropsWithoutRef<'span'> & {
+import { SidebarState } from '../root/sidebar-context';
+export type SidebarNavLabelProps = ComponentPropsWithoutRef<'span'> & {
     /** Override sidebar state. Defaults to context, then `'default'`. */
     state?: SidebarState;
 };
 /**
- * Label slot for `MainSidebar.NavLink` rows.
+ * Label slot for `Sidebar.NavLink` rows.
  *
  * Auto-hides via `VisuallyHidden` when the sidebar is collapsed (icon-only row),
  * so screen readers still announce the label without it leaking outside the
@@ -15,4 +15,4 @@ export type MainSidebarNavLabelProps = ComponentPropsWithoutRef<'span'> & {
  * `link={...}` path wraps the name internally, but custom elements bring their
  * own children, so the label needs to opt into the collapse-aware rendering.
  */
-export declare function MainSidebarNavLabel({ children, className, state: stateProp, ...rest }: MainSidebarNavLabelProps): import("react").JSX.Element;
+export declare function SidebarNavLabel({ children, className, state: stateProp, ...rest }: SidebarNavLabelProps): import("react").JSX.Element;

package/dist/src/ds/components/{MainSidebar/main-sidebar-nav-link.d.ts → Sidebar/nav/sidebar-nav-link.d.ts}

@@ -1,12 +1,12 @@
 import { default as React, ComponentProps } from 'react';
-import { SidebarState } from './main-sidebar-context';
-import { MainSidebarNavItemSize } from './main-sidebar-nav-item-classes';
-import { LinkComponent } from '../../types/link-component';
-export type NavLink = {
+import { SidebarState } from '../root/sidebar-context';
+import { SidebarNavItemSize } from './sidebar-nav-item-classes';
+import { LinkComponent } from '../../../types/link-component';
+export type SidebarLink = {
     name: string;
     url: string;
     icon?: React.ReactNode;
-    children?: NavLink[];
+    children?: SidebarLink[];
     isActive?: boolean;
     variant?: 'default' | 'featured';
     tooltipMsg?: string;
@@ -14,12 +14,12 @@ export type NavLink = {
     /** @deprecated Prefer nested `children`; accepted for callers still rendering manual sublinks. */
     indent?: boolean;
 };
-export type MainSidebarNavLinkProps = Omit<ComponentProps<'li'>, 'children'> & {
-    link?: NavLink;
+export type SidebarNavLinkProps = Omit<ComponentProps<'li'>, 'children'> & {
+    link?: SidebarLink;
     isActive?: boolean;
     state?: SidebarState;
     children?: React.ReactNode;
-    size?: MainSidebarNavItemSize;
+    size?: SidebarNavItemSize;
     render?: React.ReactElement<SlottedNavChildProps>;
     action?: React.ReactNode;
     LinkComponent?: LinkComponent;
@@ -41,5 +41,5 @@ type SlottedNavChildProps = {
     children?: React.ReactNode;
     'aria-current'?: 'page';
 };
-export declare function MainSidebarNavLink({ link, state: stateProp, children, isActive, size, render, action, className, LinkComponent: LinkProp, level: levelProp, subItems, asChild, ...props }: MainSidebarNavLinkProps): React.JSX.Element;
+export declare function SidebarNavLink({ link, state: stateProp, children, isActive, size, render, action, className, LinkComponent: LinkProp, level: levelProp, subItems, asChild, ...props }: SidebarNavLinkProps): React.JSX.Element;
 export {};

package/dist/src/ds/components/Sidebar/nav/sidebar-nav-list.d.ts

@@ -0,0 +1,3 @@
+import { ComponentPropsWithoutRef } from 'react';
+export type SidebarNavListProps = ComponentPropsWithoutRef<'ul'>;
+export declare function SidebarNavList({ className, children, ...props }: SidebarNavListProps): import("react").JSX.Element;

package/dist/src/ds/components/Sidebar/nav/sidebar-nav-section.d.ts

@@ -0,0 +1,3 @@
+import { ComponentPropsWithoutRef } from 'react';
+export type SidebarNavSectionProps = ComponentPropsWithoutRef<'section'>;
+export declare function SidebarNavSection({ className, children, ...props }: SidebarNavSectionProps): import("react").JSX.Element;

package/dist/src/ds/components/Sidebar/nav/sidebar-nav-separator.d.ts

@@ -0,0 +1,3 @@
+import { ComponentPropsWithoutRef } from 'react';
+export type SidebarNavSeparatorProps = ComponentPropsWithoutRef<'div'>;
+export declare function SidebarNavSeparator({ className, ...props }: SidebarNavSeparatorProps): import("react").JSX.Element;

package/dist/src/ds/components/Sidebar/nav/sidebar-nav.d.ts

@@ -0,0 +1,3 @@
+import { ComponentPropsWithoutRef } from 'react';
+export type SidebarNavProps = ComponentPropsWithoutRef<'nav'>;
+export declare function SidebarNav({ 'aria-label': ariaLabel, children, className, ...props }: SidebarNavProps): import("react").JSX.Element;

package/dist/src/ds/components/Sidebar/nav-stack/sidebar-nav-stack-context.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+export type SidebarNavStackContextValue = {
+    activeValue: string;
+    rootValue: string;
+    closeView: (returnFocusRef?: React.RefObject<HTMLElement | null>) => void;
+};
+export declare const SidebarNavStackContext: React.Context<SidebarNavStackContextValue | undefined>;
+export declare function useSidebarNavStack(): SidebarNavStackContextValue;