@truefoundry/agent-ui-sdk 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/README.md +634 -0
  2. package/dist/index.d.ts +718 -0
  3. package/dist/index.js +2736 -0
  4. package/dist/index.js.map +1 -0
  5. package/package.json +83 -0
  6. package/src/atoms/AskUserPrompt.tsx +102 -0
  7. package/src/atoms/AttachmentCard.tsx +92 -0
  8. package/src/atoms/AttachmentPickerButton.tsx +19 -0
  9. package/src/atoms/AttachmentPreviewDialog.tsx +34 -0
  10. package/src/atoms/BranchIndicator.tsx +41 -0
  11. package/src/atoms/CodeBlockHeader.tsx +44 -0
  12. package/src/atoms/ComposerShell.tsx +112 -0
  13. package/src/atoms/Markdown.test.tsx +28 -0
  14. package/src/atoms/Markdown.tsx +288 -0
  15. package/src/atoms/McpAuthPrompt.tsx +60 -0
  16. package/src/atoms/MessageActionBar.tsx +60 -0
  17. package/src/atoms/MessageBubble.tsx +80 -0
  18. package/src/atoms/MessageErrorBanner.tsx +26 -0
  19. package/src/atoms/MessageIndicator.tsx +23 -0
  20. package/src/atoms/OpenUIBlock.test.tsx +37 -0
  21. package/src/atoms/OpenUIBlock.tsx +50 -0
  22. package/src/atoms/ReasoningCard.tsx +52 -0
  23. package/src/atoms/SandboxArtifactList.tsx +63 -0
  24. package/src/atoms/ScrollToBottomButton.tsx +34 -0
  25. package/src/atoms/Skeletons.tsx +32 -0
  26. package/src/atoms/ThreadListMisc.tsx +76 -0
  27. package/src/atoms/ThreadListRow.tsx +81 -0
  28. package/src/atoms/ThreadShell.tsx +93 -0
  29. package/src/atoms/Toast.tsx +60 -0
  30. package/src/atoms/ToolApprovalBar.tsx +92 -0
  31. package/src/atoms/ToolCallCard.tsx +186 -0
  32. package/src/atoms/ToolGroupCard.tsx +52 -0
  33. package/src/atoms/UserMessageActionBar.tsx +62 -0
  34. package/src/atoms/WelcomeScreen.tsx +22 -0
  35. package/src/atoms/lib/cn.ts +6 -0
  36. package/src/atoms/primitives/Avatar.tsx +57 -0
  37. package/src/atoms/primitives/Button.tsx +73 -0
  38. package/src/atoms/primitives/Collapsible.tsx +32 -0
  39. package/src/atoms/primitives/Dialog.tsx +152 -0
  40. package/src/atoms/primitives/IconButton.tsx +43 -0
  41. package/src/atoms/primitives/Skeleton.tsx +17 -0
  42. package/src/atoms/primitives/Tooltip.tsx +58 -0
  43. package/src/containers/AskUserContainer.tsx +49 -0
  44. package/src/containers/AssistantMessageContainer.test.tsx +56 -0
  45. package/src/containers/AssistantMessageContainer.tsx +128 -0
  46. package/src/containers/AssistantTextContainer.test.tsx +111 -0
  47. package/src/containers/AssistantTextContainer.tsx +54 -0
  48. package/src/containers/AttachmentsContainer.tsx +83 -0
  49. package/src/containers/ComposerContainer.tsx +66 -0
  50. package/src/containers/ErrorToasterContainer.tsx +76 -0
  51. package/src/containers/McpAuthContainer.test.tsx +100 -0
  52. package/src/containers/McpAuthContainer.tsx +22 -0
  53. package/src/containers/MessageImageContainer.tsx +37 -0
  54. package/src/containers/ReasoningContainer.tsx +32 -0
  55. package/src/containers/RuntimeHarness.tsx +39 -0
  56. package/src/containers/Thread.tsx +9 -0
  57. package/src/containers/ThreadContainer.test.tsx +52 -0
  58. package/src/containers/ThreadContainer.tsx +87 -0
  59. package/src/containers/ThreadListContainer.tsx +63 -0
  60. package/src/containers/ToolCallContainer.test.tsx +135 -0
  61. package/src/containers/ToolCallContainer.tsx +167 -0
  62. package/src/containers/ToolGroupContainer.test.tsx +56 -0
  63. package/src/containers/ToolGroupContainer.tsx +24 -0
  64. package/src/containers/UserEditComposerContainer.test.tsx +52 -0
  65. package/src/containers/UserEditComposerContainer.tsx +86 -0
  66. package/src/containers/UserMessageContainer.test.tsx +99 -0
  67. package/src/containers/UserMessageContainer.tsx +26 -0
  68. package/src/containers/nestedApprovalBridge.ts +20 -0
  69. package/src/containers/useAttachmentPreviewSrc.ts +42 -0
  70. package/src/hooks/useComposerBusyState.test.ts +78 -0
  71. package/src/hooks/useComposerBusyState.ts +69 -0
  72. package/src/index.ts +193 -0
  73. package/src/openui.css +3 -0
  74. package/src/testSetup.ts +42 -0
  75. package/src/theme/SlotsProvider.test.tsx +64 -0
  76. package/src/theme/SlotsProvider.tsx +41 -0
  77. package/src/theme/defaultSlots.ts +131 -0
  78. package/src/theme/tokens.ts +98 -0
  79. package/src/theme/useClassDarkMode.ts +24 -0
@@ -0,0 +1,718 @@
1
+ import * as react from 'react';
2
+ import { ReactNode, ComponentProps, ComponentPropsWithRef, PropsWithChildren } from 'react';
3
+ import * as class_variance_authority_types from 'class-variance-authority/types';
4
+ import { VariantProps } from 'class-variance-authority';
5
+ import { Avatar as Avatar$1, Tooltip as Tooltip$1, Dialog as Dialog$1, Collapsible as Collapsible$1 } from 'radix-ui';
6
+ import { ToolCallMessagePartComponent, MessagePrimitive } from '@assistant-ui/react';
7
+
8
+ /**
9
+ * Registry of atom-name -> atom-implementation. Empty by default; each atom module
10
+ * augments this interface via `declare module "../theme/SlotsProvider"` when it is
11
+ * introduced, so adding an atom never requires editing this file or any container.
12
+ */
13
+ interface AtomSlots {
14
+ }
15
+ type SlotOverrides = Partial<AtomSlots>;
16
+ /**
17
+ * Wrap a subtree to override one or more atoms with a different design system.
18
+ * Containers never reference concrete atoms directly -- they resolve everything
19
+ * through `useSlot`, so this is the only thing a design-system swap has to touch.
20
+ */
21
+ declare function SlotsProvider({ overrides, children, }: {
22
+ overrides?: SlotOverrides;
23
+ children: ReactNode;
24
+ }): react.JSX.Element;
25
+ /** Resolves the atom implementation registered for `name` -- default unless overridden. */
26
+ declare function useSlot<K extends keyof AtomSlots>(name: K): AtomSlots[K];
27
+
28
+ /**
29
+ * This SDK's default atom implementations, keyed by slot name. Populated
30
+ * incrementally as atoms are added under `src/atoms/**`; each atom module
31
+ * augments `AtomSlots` and this object gains the matching entry in the same
32
+ * milestone.
33
+ */
34
+ declare const defaultSlots: AtomSlots;
35
+
36
+ /**
37
+ * Semantic color roles. Atoms reference these instead of raw hex/HSL values so a
38
+ * future design-system swap only has to repoint the token values, not the atoms.
39
+ */
40
+ type ColorToken = "background" | "foreground" | "muted" | "mutedForeground" | "border" | "primary" | "primaryForeground" | "destructive" | "destructiveForeground" | "accent" | "accentForeground";
41
+ type RadiusToken = "none" | "sm" | "md" | "lg" | "full";
42
+ type SpacingToken = "none" | "xs" | "sm" | "md" | "lg" | "xl";
43
+ type TypeRoleToken = "body" | "bodySmall" | "label" | "heading" | "code" | "caption";
44
+ interface TypeRoleValue {
45
+ fontSize: string;
46
+ lineHeight: string;
47
+ fontWeight: string | number;
48
+ }
49
+ interface DesignTokens {
50
+ colors: Record<ColorToken, string>;
51
+ radii: Record<RadiusToken, string>;
52
+ spacing: Record<SpacingToken, string>;
53
+ typography: Record<TypeRoleToken, TypeRoleValue>;
54
+ }
55
+ /**
56
+ * Values reference the CSS custom properties already emitted by the shadcn/Tailwind
57
+ * theme in the ported reference app, so default atoms render identically to today
58
+ * without requiring every atom to be rewritten to consume tokens in this pass.
59
+ */
60
+ declare const defaultTokens: DesignTokens;
61
+ declare function TokensProvider({ tokens, children, }: {
62
+ tokens: DesignTokens;
63
+ children: ReactNode;
64
+ }): react.FunctionComponentElement<react.ProviderProps<DesignTokens>>;
65
+ /** Atoms may call this for theme-driven values; it is not an assistant-ui/runtime hook. */
66
+ declare function useTokens(): DesignTokens;
67
+
68
+ declare const buttonVariants: (props?: ({
69
+ variant?: "default" | "link" | "outline" | "secondary" | "ghost" | "destructive" | null | undefined;
70
+ size?: "default" | "sm" | "lg" | "xs" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
71
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
72
+ type ButtonProps = ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
73
+ asChild?: boolean;
74
+ };
75
+ declare function Button({ className, variant, size, asChild, ...props }: ButtonProps): react.JSX.Element;
76
+ declare module "../../theme/SlotsProvider.js" {
77
+ interface AtomSlots {
78
+ Button: typeof Button;
79
+ }
80
+ }
81
+
82
+ type IconButtonProps = ComponentPropsWithRef<typeof Button> & {
83
+ tooltip: string;
84
+ side?: "top" | "bottom" | "left" | "right";
85
+ };
86
+ declare const IconButton: react.ForwardRefExoticComponent<Omit<IconButtonProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
87
+ declare module "../../theme/SlotsProvider.js" {
88
+ interface AtomSlots {
89
+ IconButton: typeof IconButton;
90
+ }
91
+ }
92
+
93
+ type AvatarProps = ComponentProps<typeof Avatar$1.Root> & {
94
+ size?: "default" | "sm" | "lg";
95
+ };
96
+ declare function Avatar({ className, size, ...props }: AvatarProps): react.JSX.Element;
97
+ type AvatarImageProps = ComponentProps<typeof Avatar$1.Image>;
98
+ declare function AvatarImage({ className, ...props }: AvatarImageProps): react.JSX.Element;
99
+ type AvatarFallbackProps = ComponentProps<typeof Avatar$1.Fallback>;
100
+ declare function AvatarFallback({ className, ...props }: AvatarFallbackProps): react.JSX.Element;
101
+ declare module "../../theme/SlotsProvider.js" {
102
+ interface AtomSlots {
103
+ Avatar: typeof Avatar;
104
+ AvatarImage: typeof AvatarImage;
105
+ AvatarFallback: typeof AvatarFallback;
106
+ }
107
+ }
108
+
109
+ type TooltipProviderProps = ComponentProps<typeof Tooltip$1.Provider>;
110
+ declare function TooltipProvider({ delayDuration, ...props }: TooltipProviderProps): react.JSX.Element;
111
+ type TooltipProps = ComponentProps<typeof Tooltip$1.Root>;
112
+ declare function Tooltip(props: TooltipProps): react.JSX.Element;
113
+ type TooltipTriggerProps = ComponentProps<typeof Tooltip$1.Trigger>;
114
+ declare function TooltipTrigger(props: TooltipTriggerProps): react.JSX.Element;
115
+ type TooltipContentProps = ComponentProps<typeof Tooltip$1.Content>;
116
+ declare function TooltipContent({ className, sideOffset, children, ...props }: TooltipContentProps): react.JSX.Element;
117
+ declare module "../../theme/SlotsProvider.js" {
118
+ interface AtomSlots {
119
+ TooltipProvider: typeof TooltipProvider;
120
+ Tooltip: typeof Tooltip;
121
+ TooltipTrigger: typeof TooltipTrigger;
122
+ TooltipContent: typeof TooltipContent;
123
+ }
124
+ }
125
+
126
+ type DialogProps = ComponentProps<typeof Dialog$1.Root>;
127
+ declare function Dialog(props: DialogProps): react.JSX.Element;
128
+ type DialogTriggerProps = ComponentProps<typeof Dialog$1.Trigger>;
129
+ declare function DialogTrigger(props: DialogTriggerProps): react.JSX.Element;
130
+ type DialogPortalProps = ComponentProps<typeof Dialog$1.Portal>;
131
+ declare function DialogPortal(props: DialogPortalProps): react.JSX.Element;
132
+ type DialogCloseProps = ComponentProps<typeof Dialog$1.Close>;
133
+ declare function DialogClose(props: DialogCloseProps): react.JSX.Element;
134
+ type DialogOverlayProps = ComponentProps<typeof Dialog$1.Overlay>;
135
+ declare function DialogOverlay({ className, ...props }: DialogOverlayProps): react.JSX.Element;
136
+ type DialogContentProps = ComponentProps<typeof Dialog$1.Content> & {
137
+ showCloseButton?: boolean;
138
+ };
139
+ declare function DialogContent({ className, children, showCloseButton, ...props }: DialogContentProps): react.JSX.Element;
140
+ type DialogHeaderProps = ComponentProps<"div">;
141
+ declare function DialogHeader({ className, ...props }: DialogHeaderProps): react.JSX.Element;
142
+ type DialogFooterProps = ComponentProps<"div"> & {
143
+ showCloseButton?: boolean;
144
+ };
145
+ declare function DialogFooter({ className, showCloseButton, children, ...props }: DialogFooterProps): react.JSX.Element;
146
+ type DialogTitleProps = ComponentProps<typeof Dialog$1.Title>;
147
+ declare function DialogTitle({ className, ...props }: DialogTitleProps): react.JSX.Element;
148
+ type DialogDescriptionProps = ComponentProps<typeof Dialog$1.Description>;
149
+ declare function DialogDescription({ className, ...props }: DialogDescriptionProps): react.JSX.Element;
150
+ declare module "../../theme/SlotsProvider.js" {
151
+ interface AtomSlots {
152
+ Dialog: typeof Dialog;
153
+ DialogTrigger: typeof DialogTrigger;
154
+ DialogPortal: typeof DialogPortal;
155
+ DialogClose: typeof DialogClose;
156
+ DialogOverlay: typeof DialogOverlay;
157
+ DialogContent: typeof DialogContent;
158
+ DialogHeader: typeof DialogHeader;
159
+ DialogFooter: typeof DialogFooter;
160
+ DialogTitle: typeof DialogTitle;
161
+ DialogDescription: typeof DialogDescription;
162
+ }
163
+ }
164
+
165
+ type CollapsibleProps = ComponentProps<typeof Collapsible$1.Root>;
166
+ declare function Collapsible(props: CollapsibleProps): react.JSX.Element;
167
+ type CollapsibleTriggerProps = ComponentProps<typeof Collapsible$1.CollapsibleTrigger>;
168
+ declare function CollapsibleTrigger(props: CollapsibleTriggerProps): react.JSX.Element;
169
+ type CollapsibleContentProps = ComponentProps<typeof Collapsible$1.CollapsibleContent>;
170
+ declare function CollapsibleContent(props: CollapsibleContentProps): react.JSX.Element;
171
+ declare module "../../theme/SlotsProvider.js" {
172
+ interface AtomSlots {
173
+ Collapsible: typeof Collapsible;
174
+ CollapsibleTrigger: typeof CollapsibleTrigger;
175
+ CollapsibleContent: typeof CollapsibleContent;
176
+ }
177
+ }
178
+
179
+ type SkeletonProps = ComponentProps<"div">;
180
+ declare function Skeleton({ className, ...props }: SkeletonProps): react.JSX.Element;
181
+ declare module "../../theme/SlotsProvider.js" {
182
+ interface AtomSlots {
183
+ Skeleton: typeof Skeleton;
184
+ }
185
+ }
186
+
187
+ type MarkdownProps = {
188
+ content: string;
189
+ className?: string;
190
+ isStreaming?: boolean;
191
+ onDownloadArtifact?: (path: string) => void | Promise<unknown>;
192
+ };
193
+ declare function Markdown({ content, className, isStreaming, onDownloadArtifact }: MarkdownProps): react.JSX.Element;
194
+ declare module "../theme/SlotsProvider.js" {
195
+ interface AtomSlots {
196
+ Markdown: typeof Markdown;
197
+ }
198
+ }
199
+
200
+ type ThemeMode = "light" | "dark";
201
+
202
+ type OpenUIBlockProps = {
203
+ source: string;
204
+ isStreaming?: boolean;
205
+ className?: string;
206
+ /** Override light/dark mode. Defaults to syncing with a `.dark` class on `<html>`. */
207
+ mode?: ThemeMode;
208
+ };
209
+ /** Renders an OpenUI Lang fenced code block (```openui ... ```). */
210
+ declare const OpenUIBlock: react.NamedExoticComponent<OpenUIBlockProps>;
211
+ declare module "../theme/SlotsProvider.js" {
212
+ interface AtomSlots {
213
+ OpenUIBlock: typeof OpenUIBlock;
214
+ }
215
+ }
216
+
217
+ type SandboxArtifactLink = {
218
+ label: string;
219
+ path: string;
220
+ };
221
+ type SandboxArtifactListProps = {
222
+ artifacts: SandboxArtifactLink[];
223
+ onDownload?: (path: string) => void | Promise<unknown>;
224
+ className?: string;
225
+ };
226
+ declare function SandboxArtifactList({ artifacts, onDownload, className }: SandboxArtifactListProps): react.JSX.Element;
227
+ declare module "../theme/SlotsProvider.js" {
228
+ interface AtomSlots {
229
+ SandboxArtifactList: typeof SandboxArtifactList;
230
+ }
231
+ }
232
+
233
+ type CodeBlockHeaderProps = {
234
+ language: string;
235
+ code: string;
236
+ };
237
+ declare function CodeBlockHeader({ language, code }: CodeBlockHeaderProps): react.JSX.Element;
238
+ declare module "../theme/SlotsProvider.js" {
239
+ interface AtomSlots {
240
+ CodeBlockHeader: typeof CodeBlockHeader;
241
+ }
242
+ }
243
+
244
+ type AssistantMessageBubbleProps = {
245
+ variant: "assistant";
246
+ children: ReactNode;
247
+ error?: ReactNode;
248
+ branchIndicator?: ReactNode;
249
+ actionBar?: ReactNode;
250
+ className?: string;
251
+ };
252
+ type UserMessageBubbleProps = {
253
+ variant: "user";
254
+ children: ReactNode;
255
+ attachments?: ReactNode;
256
+ branchIndicator?: ReactNode;
257
+ actionBar?: ReactNode;
258
+ className?: string;
259
+ };
260
+ type MessageBubbleProps = AssistantMessageBubbleProps | UserMessageBubbleProps;
261
+ declare function MessageBubble(props: MessageBubbleProps): react.JSX.Element;
262
+ declare module "../theme/SlotsProvider.js" {
263
+ interface AtomSlots {
264
+ MessageBubble: typeof MessageBubble;
265
+ }
266
+ }
267
+
268
+ type MessageErrorBannerProps = {
269
+ message: string;
270
+ className?: string;
271
+ };
272
+ declare function MessageErrorBanner({ message, className }: MessageErrorBannerProps): react.JSX.Element;
273
+ declare module "../theme/SlotsProvider.js" {
274
+ interface AtomSlots {
275
+ MessageErrorBanner: typeof MessageErrorBanner;
276
+ }
277
+ }
278
+
279
+ type MessageActionBarProps = {
280
+ isCopied: boolean;
281
+ onCopy: () => void;
282
+ onExportMarkdown: () => void;
283
+ className?: string;
284
+ };
285
+ declare function MessageActionBar({ isCopied, onCopy, onExportMarkdown, className }: MessageActionBarProps): react.JSX.Element;
286
+ declare module "../theme/SlotsProvider.js" {
287
+ interface AtomSlots {
288
+ MessageActionBar: typeof MessageActionBar;
289
+ }
290
+ }
291
+
292
+ type UserMessageActionBarProps = {
293
+ className?: string;
294
+ };
295
+ declare function UserMessageActionBar({ className }: UserMessageActionBarProps): react.JSX.Element;
296
+ declare module "../theme/SlotsProvider.js" {
297
+ interface AtomSlots {
298
+ UserMessageActionBar: typeof UserMessageActionBar;
299
+ }
300
+ }
301
+
302
+ type BranchIndicatorProps = {
303
+ index: number;
304
+ count: number;
305
+ onPrevious: () => void;
306
+ onNext: () => void;
307
+ className?: string;
308
+ };
309
+ declare function BranchIndicator({ index, count, onPrevious, onNext, className }: BranchIndicatorProps): react.JSX.Element | null;
310
+ declare module "../theme/SlotsProvider.js" {
311
+ interface AtomSlots {
312
+ BranchIndicator: typeof BranchIndicator;
313
+ }
314
+ }
315
+
316
+ type MessageIndicatorProps = {
317
+ className?: string;
318
+ };
319
+ declare function MessageIndicator({ className }: MessageIndicatorProps): react.JSX.Element;
320
+ declare module "../theme/SlotsProvider.js" {
321
+ interface AtomSlots {
322
+ MessageIndicator: typeof MessageIndicator;
323
+ }
324
+ }
325
+
326
+ type WelcomeScreenProps = {
327
+ heading?: string;
328
+ className?: string;
329
+ };
330
+ declare function WelcomeScreen({ heading, className }: WelcomeScreenProps): react.JSX.Element;
331
+ declare module "../theme/SlotsProvider.js" {
332
+ interface AtomSlots {
333
+ WelcomeScreen: typeof WelcomeScreen;
334
+ }
335
+ }
336
+
337
+ type MessageListSkeletonProps = {
338
+ className?: string;
339
+ };
340
+ declare function MessageListSkeleton({ className }: MessageListSkeletonProps): react.JSX.Element;
341
+ declare module "../theme/SlotsProvider.js" {
342
+ interface AtomSlots {
343
+ MessageListSkeleton: typeof MessageListSkeleton;
344
+ }
345
+ }
346
+
347
+ type ScrollToBottomButtonProps = Omit<IconButtonProps, "tooltip" | "children">;
348
+ declare const ScrollToBottomButton: react.ForwardRefExoticComponent<Omit<ScrollToBottomButtonProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
349
+ declare module "../theme/SlotsProvider.js" {
350
+ interface AtomSlots {
351
+ ScrollToBottomButton: typeof ScrollToBottomButton;
352
+ }
353
+ }
354
+
355
+ type ThreadRootShellProps = ComponentPropsWithRef<"div">;
356
+ declare const ThreadRootShell: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
357
+ type ThreadViewportShellProps = ComponentPropsWithRef<"div"> & {
358
+ isEmpty?: boolean;
359
+ };
360
+ declare const ThreadViewportShell: react.ForwardRefExoticComponent<Omit<ThreadViewportShellProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
361
+ type ThreadComposerAreaShellProps = ComponentPropsWithRef<"div"> & {
362
+ isEmpty?: boolean;
363
+ };
364
+ declare const ThreadComposerAreaShell: react.ForwardRefExoticComponent<Omit<ThreadComposerAreaShellProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
365
+ type MessageGroupProps = ComponentPropsWithRef<"div">;
366
+ declare const MessageGroup: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
367
+ declare module "../theme/SlotsProvider.js" {
368
+ interface AtomSlots {
369
+ ThreadRootShell: typeof ThreadRootShell;
370
+ ThreadViewportShell: typeof ThreadViewportShell;
371
+ ThreadComposerAreaShell: typeof ThreadComposerAreaShell;
372
+ MessageGroup: typeof MessageGroup;
373
+ }
374
+ }
375
+
376
+ type ToolCallStatus = "running" | "success" | "error";
377
+ type ToolCallCardBaseProps = {
378
+ variant: "tool" | "sub-agent" | "mcp-listing";
379
+ name: string;
380
+ status: ToolCallStatus;
381
+ expanded: boolean;
382
+ onToggle: () => void;
383
+ /** Not in the Section 6 screenshot contract; ported from the reference's live per-call timer. */
384
+ durationText?: string;
385
+ className?: string;
386
+ };
387
+ type ToolCallCardToolProps = ToolCallCardBaseProps & {
388
+ variant: "tool";
389
+ argsText?: string;
390
+ result?: string;
391
+ isError?: boolean;
392
+ /**
393
+ * Extends the Section 6 contract: renders the pending tool-approval / ask-user
394
+ * UI when this call requires action. The reference screenshots didn't include
395
+ * an in-flight approval state, so this slot was inferred rather than observed.
396
+ */
397
+ approvalSlot?: ReactNode;
398
+ };
399
+ type ToolCallCardSubAgentProps = ToolCallCardBaseProps & {
400
+ variant: "sub-agent";
401
+ agentName: string;
402
+ instruction: string;
403
+ stepCount: number;
404
+ children?: ReactNode;
405
+ };
406
+ type ToolCallCardMcpProps = ToolCallCardBaseProps & {
407
+ variant: "mcp-listing";
408
+ serverName: string;
409
+ description: string;
410
+ argsText: string;
411
+ resultText: string;
412
+ };
413
+ type ToolCallCardProps = ToolCallCardToolProps | ToolCallCardSubAgentProps | ToolCallCardMcpProps;
414
+ declare function ToolCallCard(props: ToolCallCardProps): react.JSX.Element;
415
+ declare module "../theme/SlotsProvider.js" {
416
+ interface AtomSlots {
417
+ ToolCallCard: typeof ToolCallCard;
418
+ }
419
+ }
420
+
421
+ type ToolApprovalOption = {
422
+ id: string;
423
+ label: string;
424
+ isAllow: boolean;
425
+ grants?: readonly string[];
426
+ confirm?: {
427
+ title?: string;
428
+ description?: string;
429
+ };
430
+ };
431
+ type ToolApprovalBarProps = {
432
+ options: ToolApprovalOption[];
433
+ onSelectOption: (optionId: string) => void;
434
+ className?: string;
435
+ };
436
+ declare function ToolApprovalBar({ options, onSelectOption, className }: ToolApprovalBarProps): react.JSX.Element;
437
+ declare module "../theme/SlotsProvider.js" {
438
+ interface AtomSlots {
439
+ ToolApprovalBar: typeof ToolApprovalBar;
440
+ }
441
+ }
442
+
443
+ type ToolGroupCardProps = {
444
+ toolCallCount: number;
445
+ expanded: boolean;
446
+ active?: boolean;
447
+ onToggle: () => void;
448
+ children: ReactNode;
449
+ className?: string;
450
+ };
451
+ declare function ToolGroupCard({ toolCallCount, expanded, active, onToggle, children, className, }: ToolGroupCardProps): react.JSX.Element;
452
+ declare module "../theme/SlotsProvider.js" {
453
+ interface AtomSlots {
454
+ ToolGroupCard: typeof ToolGroupCard;
455
+ }
456
+ }
457
+
458
+ type ReasoningCardProps = {
459
+ streaming: boolean;
460
+ expanded: boolean;
461
+ onToggle: () => void;
462
+ children: ReactNode;
463
+ className?: string;
464
+ };
465
+ declare function ReasoningCard({ streaming, expanded, onToggle, children, className }: ReasoningCardProps): react.JSX.Element;
466
+ declare module "../theme/SlotsProvider.js" {
467
+ interface AtomSlots {
468
+ ReasoningCard: typeof ReasoningCard;
469
+ }
470
+ }
471
+
472
+ type ComposerShellProps = {
473
+ value: string;
474
+ placeholder: string;
475
+ disabled: boolean;
476
+ isRunning?: boolean;
477
+ attachments?: ReactNode;
478
+ modelLabel?: string;
479
+ modelIcon?: ReactNode;
480
+ connectorStatusLabel?: string;
481
+ onValueChange: (value: string) => void;
482
+ onSubmit: () => void;
483
+ onCancel?: () => void;
484
+ onAttach?: () => void;
485
+ className?: string;
486
+ };
487
+ declare function ComposerShell({ value, placeholder, disabled, isRunning, attachments, modelLabel, modelIcon, connectorStatusLabel, onValueChange, onSubmit, onCancel, onAttach, className, }: ComposerShellProps): react.JSX.Element;
488
+ declare module "../theme/SlotsProvider.js" {
489
+ interface AtomSlots {
490
+ ComposerShell: typeof ComposerShell;
491
+ }
492
+ }
493
+
494
+ type AskUserOption = {
495
+ id: string;
496
+ label: string;
497
+ };
498
+ type AskUserPromptProps = {
499
+ question: string;
500
+ options: AskUserOption[];
501
+ allowOther: boolean;
502
+ selectedOptionId?: string;
503
+ otherValue: string;
504
+ disabled: boolean;
505
+ onSelectOption: (optionId: string) => void;
506
+ onOtherValueChange: (value: string) => void;
507
+ onSubmit: () => void;
508
+ className?: string;
509
+ };
510
+ declare function AskUserPrompt({ question, options, allowOther, selectedOptionId, otherValue, disabled, onSelectOption, onOtherValueChange, onSubmit, className, }: AskUserPromptProps): react.JSX.Element;
511
+ declare module "../theme/SlotsProvider.js" {
512
+ interface AtomSlots {
513
+ AskUserPrompt: typeof AskUserPrompt;
514
+ }
515
+ }
516
+
517
+ type McpAuthServer = {
518
+ id: string;
519
+ name: string;
520
+ authUrl: string;
521
+ };
522
+ type McpAuthPromptProps = {
523
+ servers: McpAuthServer[];
524
+ disabled: boolean;
525
+ onContinue: () => void;
526
+ className?: string;
527
+ };
528
+ declare function McpAuthPrompt({ servers, disabled, onContinue, className }: McpAuthPromptProps): react.JSX.Element;
529
+ declare module "../theme/SlotsProvider.js" {
530
+ interface AtomSlots {
531
+ McpAuthPrompt: typeof McpAuthPrompt;
532
+ }
533
+ }
534
+
535
+ type AttachmentCardSize = "chip" | "preview";
536
+ /** Fixed preview bounds for attachments rendered in user message bubbles. */
537
+ declare const USER_MESSAGE_ATTACHMENT_PREVIEW_REM = 12;
538
+ type AttachmentCardProps = {
539
+ name: string;
540
+ contentType?: string;
541
+ previewSrc?: string;
542
+ isImage?: boolean;
543
+ size?: AttachmentCardSize;
544
+ /** When set, constrains image preview and file chip width to this rem size. */
545
+ previewRem?: number;
546
+ onRemove?: () => void;
547
+ className?: string;
548
+ };
549
+ declare function AttachmentCard({ name, previewSrc, isImage, size, previewRem, onRemove, className, }: AttachmentCardProps): react.JSX.Element;
550
+ declare module "../theme/SlotsProvider.js" {
551
+ interface AtomSlots {
552
+ AttachmentCard: typeof AttachmentCard;
553
+ }
554
+ }
555
+
556
+ type AttachmentPreviewDialogProps = {
557
+ previewSrc?: string;
558
+ children: ReactNode;
559
+ };
560
+ declare function AttachmentPreviewDialog({ previewSrc, children }: AttachmentPreviewDialogProps): react.JSX.Element;
561
+ declare module "../theme/SlotsProvider.js" {
562
+ interface AtomSlots {
563
+ AttachmentPreviewDialog: typeof AttachmentPreviewDialog;
564
+ }
565
+ }
566
+
567
+ type AttachmentPickerButtonProps = Omit<IconButtonProps, "tooltip" | "children">;
568
+ declare function AttachmentPickerButton(props: AttachmentPickerButtonProps): react.JSX.Element;
569
+ declare module "../theme/SlotsProvider.js" {
570
+ interface AtomSlots {
571
+ AttachmentPickerButton: typeof AttachmentPickerButton;
572
+ }
573
+ }
574
+
575
+ type ThreadListRowProps = {
576
+ title: string;
577
+ active: boolean;
578
+ onSelect: () => void;
579
+ onArchive?: () => void;
580
+ onDelete?: () => void;
581
+ className?: string;
582
+ };
583
+ declare function ThreadListRow({ title, active, onSelect, onArchive, onDelete, className }: ThreadListRowProps): react.JSX.Element;
584
+ declare module "../theme/SlotsProvider.js" {
585
+ interface AtomSlots {
586
+ ThreadListRow: typeof ThreadListRow;
587
+ }
588
+ }
589
+
590
+ type ThreadListNewButtonProps = Omit<ButtonProps, "children">;
591
+ declare function ThreadListNewButton({ className, ...rest }: ThreadListNewButtonProps): react.JSX.Element;
592
+ type ThreadListRowSkeletonProps = {
593
+ count?: number;
594
+ className?: string;
595
+ };
596
+ declare function ThreadListRowSkeleton({ count, className }: ThreadListRowSkeletonProps): react.JSX.Element;
597
+ type ThreadListEmptyStateProps = {
598
+ message?: string;
599
+ className?: string;
600
+ };
601
+ declare function ThreadListEmptyState({ message, className }: ThreadListEmptyStateProps): react.JSX.Element;
602
+ type ThreadListShellProps = {
603
+ header: ReactNode;
604
+ children: ReactNode;
605
+ className?: string;
606
+ };
607
+ declare function ThreadListShell({ header, children, className }: ThreadListShellProps): react.JSX.Element;
608
+ declare module "../theme/SlotsProvider.js" {
609
+ interface AtomSlots {
610
+ ThreadListNewButton: typeof ThreadListNewButton;
611
+ ThreadListRowSkeleton: typeof ThreadListRowSkeleton;
612
+ ThreadListEmptyState: typeof ThreadListEmptyState;
613
+ ThreadListShell: typeof ThreadListShell;
614
+ }
615
+ }
616
+
617
+ type ToastProps = {
618
+ title: string;
619
+ description: string;
620
+ open: boolean;
621
+ onOpenChange: (open: boolean) => void;
622
+ className?: string;
623
+ };
624
+ declare function Toast({ title, description, open, onOpenChange, className }: ToastProps): react.JSX.Element;
625
+ type ToastStackProps = {
626
+ children: ReactNode;
627
+ duration?: number;
628
+ };
629
+ declare function ToastStack({ children, duration }: ToastStackProps): react.JSX.Element;
630
+ declare module "../theme/SlotsProvider.js" {
631
+ interface AtomSlots {
632
+ Toast: typeof Toast;
633
+ ToastStack: typeof ToastStack;
634
+ }
635
+ }
636
+
637
+ type ThreadContainerProps = {
638
+ /**
639
+ * Rendered in the bottom composer area. Left undefined until
640
+ * `ComposerContainer` exists (milestone 6); the public `<Thread/>` export
641
+ * wires the two together once it does.
642
+ */
643
+ composer?: ReactNode;
644
+ };
645
+ declare function ThreadContainer({ composer }: ThreadContainerProps): react.JSX.Element;
646
+
647
+ declare function AssistantMessageContainer(): react.JSX.Element;
648
+
649
+ declare function UserMessageContainer(): react.JSX.Element;
650
+
651
+ declare function UserEditComposerContainer(): react.JSX.Element;
652
+
653
+ declare function AssistantTextContainer(): react.JSX.Element;
654
+
655
+ declare const ToolCallContainer: ToolCallMessagePartComponent;
656
+
657
+ type ThreadGroupPart = MessagePrimitive.GroupedParts.GroupPart;
658
+ declare function ToolGroupContainer({ group, children }: PropsWithChildren<{
659
+ group: ThreadGroupPart;
660
+ }>): react.JSX.Element;
661
+
662
+ declare function ReasoningContainer({ group, children }: PropsWithChildren<{
663
+ group: ThreadGroupPart;
664
+ }>): react.JSX.Element;
665
+
666
+ declare function ComposerContainer(): react.JSX.Element;
667
+
668
+ type ComposerBusyState = {
669
+ /** True while submitting or while the turn stream is active. */
670
+ isBusy: boolean;
671
+ isRunning: boolean;
672
+ isSubmitting: boolean;
673
+ send: (sendFn: () => void | Promise<void>) => void;
674
+ resetBusy: () => void;
675
+ };
676
+ declare function ComposerBusyProvider({ children }: {
677
+ children: ReactNode;
678
+ }): react.FunctionComponentElement<react.ProviderProps<ComposerBusyState | null>>;
679
+ /**
680
+ * Optimistic composer busy state shared across the thread. `useThreadIsRunning()`
681
+ * only becomes true once the turn stream starts; this hook flips to busy
682
+ * immediately on submit so the send button shows loading before session setup /
683
+ * turn API work finishes.
684
+ *
685
+ * Must be used within `<ComposerBusyProvider>` (wired by default in `<Thread />`).
686
+ */
687
+ declare function useComposerBusyState(): ComposerBusyState;
688
+
689
+ declare function AskUserContainer(): react.JSX.Element | null;
690
+
691
+ declare function McpAuthContainer(): react.JSX.Element | null;
692
+
693
+ declare function ComposerAttachmentsContainer(): react.JSX.Element;
694
+ declare function MessageAttachmentsContainer(): react.JSX.Element;
695
+ declare function ComposerAttachmentPickerContainer(): react.JSX.Element;
696
+
697
+ /**
698
+ * Simplified relative to the reference: renders threads in a single flat list
699
+ * rather than grouping them by Today/Yesterday/Earlier. Archive/Delete are
700
+ * wired but no-op against the current thread-list adapter (documented in the
701
+ * runtime README's unsupported-features table).
702
+ */
703
+ declare function ThreadListContainer(): react.JSX.Element;
704
+
705
+ type ErrorToasterContextValue = {
706
+ showError: (error: unknown) => void;
707
+ };
708
+ declare function ErrorToasterProvider({ children }: {
709
+ children: ReactNode;
710
+ }): react.JSX.Element;
711
+ declare function useErrorToaster(): ErrorToasterContextValue;
712
+ /** Same as `useErrorToaster`, but returns `null` instead of throwing outside `ErrorToasterProvider`. */
713
+ declare function useErrorToasterOptional(): ErrorToasterContextValue | null;
714
+
715
+ /** The full assembled thread view: message list + composer. */
716
+ declare function Thread(): react.JSX.Element;
717
+
718
+ export { AskUserContainer, type AskUserOption, AskUserPrompt, type AskUserPromptProps, type AssistantMessageBubbleProps, AssistantMessageContainer, AssistantTextContainer, type AtomSlots, AttachmentCard, type AttachmentCardProps, type AttachmentCardSize, AttachmentPickerButton, type AttachmentPickerButtonProps, AttachmentPreviewDialog, type AttachmentPreviewDialogProps, Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarImageProps, type AvatarProps, BranchIndicator, type BranchIndicatorProps, Button, type ButtonProps, CodeBlockHeader, type CodeBlockHeaderProps, Collapsible, CollapsibleContent, type CollapsibleContentProps, type CollapsibleProps, CollapsibleTrigger, type CollapsibleTriggerProps, type ColorToken, ComposerAttachmentPickerContainer, ComposerAttachmentsContainer, ComposerBusyProvider, type ComposerBusyState, ComposerContainer, ComposerShell, type ComposerShellProps, type DesignTokens, Dialog, DialogClose, type DialogCloseProps, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogOverlay, type DialogOverlayProps, DialogPortal, type DialogPortalProps, type DialogProps, DialogTitle, type DialogTitleProps, DialogTrigger, type DialogTriggerProps, ErrorToasterProvider, IconButton, type IconButtonProps, Markdown, type MarkdownProps, McpAuthContainer, McpAuthPrompt, type McpAuthPromptProps, type McpAuthServer, MessageActionBar, type MessageActionBarProps, MessageAttachmentsContainer, MessageBubble, type MessageBubbleProps, MessageErrorBanner, type MessageErrorBannerProps, MessageGroup, type MessageGroupProps, MessageIndicator, type MessageIndicatorProps, MessageListSkeleton, type MessageListSkeletonProps, OpenUIBlock, type OpenUIBlockProps, type RadiusToken, ReasoningCard, type ReasoningCardProps, ReasoningContainer, type SandboxArtifactLink, SandboxArtifactList, type SandboxArtifactListProps, ScrollToBottomButton, type ScrollToBottomButtonProps, Skeleton, type SkeletonProps, type SlotOverrides, SlotsProvider, type SpacingToken, Thread, ThreadComposerAreaShell, type ThreadComposerAreaShellProps, ThreadContainer, type ThreadContainerProps, type ThreadGroupPart, ThreadListContainer, ThreadListEmptyState, type ThreadListEmptyStateProps, ThreadListNewButton, type ThreadListNewButtonProps, ThreadListRow, type ThreadListRowProps, ThreadListRowSkeleton, type ThreadListRowSkeletonProps, ThreadListShell, type ThreadListShellProps, ThreadRootShell, type ThreadRootShellProps, ThreadViewportShell, type ThreadViewportShellProps, Toast, type ToastProps, ToastStack, type ToastStackProps, TokensProvider, ToolApprovalBar, type ToolApprovalBarProps, type ToolApprovalOption, ToolCallCard, type ToolCallCardMcpProps, type ToolCallCardProps, type ToolCallCardSubAgentProps, type ToolCallCardToolProps, ToolCallContainer, type ToolCallStatus, ToolGroupCard, type ToolGroupCardProps, ToolGroupContainer, Tooltip, TooltipContent, type TooltipContentProps, type TooltipProps, TooltipProvider, type TooltipProviderProps, TooltipTrigger, type TooltipTriggerProps, type TypeRoleToken, type TypeRoleValue, USER_MESSAGE_ATTACHMENT_PREVIEW_REM, UserEditComposerContainer, UserMessageActionBar, type UserMessageActionBarProps, type UserMessageBubbleProps, UserMessageContainer, WelcomeScreen, type WelcomeScreenProps, buttonVariants, defaultSlots, defaultTokens, useComposerBusyState, useErrorToaster, useErrorToasterOptional, useSlot, useTokens };