@mcp-b/react-components 0.6.5 → 0.7.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 (91) hide show
  1. package/dist/AgentChat-403mckDG.d.ts +101 -0
  2. package/dist/BrowserLiveView-ZktFZiMD.d.ts +47 -0
  3. package/dist/BrowserReplay-6G-mnwcn.d.ts +40 -0
  4. package/dist/{CodeBlock-BK0sOAbV.js → CodeBlock-D9koxDA7.js} +1 -1
  5. package/dist/{FileTree-BWQZ0FSi.js → FileTree-BdK93Uuu.js} +1 -1
  6. package/dist/ModelSelector-MQvK-pNb.js +306 -0
  7. package/dist/PromptInput-D6-G24p7.d.ts +528 -0
  8. package/dist/ThinkChatActivity-CeHzk6-K.d.ts +73 -0
  9. package/dist/ThinkChatContext-CC94HL4u.d.ts +28 -0
  10. package/dist/ThinkChatToolParts-DnUiZgCC.d.ts +83 -0
  11. package/dist/components/Activity.js +1 -1
  12. package/dist/components/AgentChat.d.ts +1 -103
  13. package/dist/components/AgentChat.js +77 -58
  14. package/dist/components/AgentConnection.d.ts +43 -2
  15. package/dist/components/AgentConnection.js +154 -3
  16. package/dist/components/Artifact.js +1 -1
  17. package/dist/components/BrowserLiveView.d.ts +1 -46
  18. package/dist/components/BrowserLiveView.js +1 -1
  19. package/dist/components/BrowserReplay.d.ts +1 -39
  20. package/dist/components/BrowserReplay.js +1 -1
  21. package/dist/components/ChainOfThought.d.ts +1 -1
  22. package/dist/components/ChainOfThought.js +1 -1
  23. package/dist/components/ChatGptSignInScreen.d.ts +38 -0
  24. package/dist/components/ChatGptSignInScreen.js +201 -0
  25. package/dist/components/CodeBlock.js +1 -1
  26. package/dist/components/Commit.js +1 -1
  27. package/dist/components/Context.d.ts +6 -10
  28. package/dist/components/Context.js +4 -2
  29. package/dist/components/ContextMenu.js +1 -1
  30. package/dist/components/Conversation.d.ts +28 -28
  31. package/dist/components/Conversation.js +36 -55
  32. package/dist/components/Dialog.js +1 -1
  33. package/dist/components/EnvironmentVariables.js +1 -1
  34. package/dist/components/FileTree.js +1 -1
  35. package/dist/components/Marker.d.ts +57 -0
  36. package/dist/components/Marker.js +89 -0
  37. package/dist/components/McpServerPicker.js +1 -1
  38. package/dist/components/Menubar.js +1 -1
  39. package/dist/components/Message.js +1 -1
  40. package/dist/components/MessageScroller.d.ts +52 -0
  41. package/dist/components/MessageScroller.js +62 -0
  42. package/dist/components/ModelSelector.js +1 -305
  43. package/dist/components/NavigationMenu.js +1 -1
  44. package/dist/components/PromptInput.d.ts +2 -534
  45. package/dist/components/PromptInput.js +18 -12
  46. package/dist/components/Queue.js +1 -1
  47. package/dist/components/Reasoning.js +1 -1
  48. package/dist/components/Select.js +1 -1
  49. package/dist/components/Sources.js +1 -1
  50. package/dist/components/Stepper.js +1 -1
  51. package/dist/components/Task.js +1 -1
  52. package/dist/components/Terminal.js +2 -2
  53. package/dist/components/TestResults.js +1 -1
  54. package/dist/components/ThinkChat.d.ts +23 -80
  55. package/dist/components/ThinkChat.js +60 -857
  56. package/dist/components/ThinkChatActivity.d.ts +3 -0
  57. package/dist/components/ThinkChatActivity.js +429 -0
  58. package/dist/components/ThinkChatContext.d.ts +2 -0
  59. package/dist/components/ThinkChatContext.js +10 -0
  60. package/dist/components/ThinkChatToolPanels.d.ts +39 -0
  61. package/dist/components/ThinkChatToolPanels.js +355 -0
  62. package/dist/components/ThinkChatToolParts.d.ts +2 -0
  63. package/dist/components/ThinkChatToolParts.js +66 -0
  64. package/dist/components/ThinkFullApp.d.ts +23 -0
  65. package/dist/components/ThinkFullApp.js +175 -0
  66. package/dist/components/WebPreview.js +1 -1
  67. package/dist/components/WorkspaceExplorer.d.ts +1 -1
  68. package/dist/components/WorkspaceExplorer.js +3 -3
  69. package/dist/components/icons.d.ts +2 -2
  70. package/dist/components/icons.js +2 -2
  71. package/dist/components/useStickToBottom.d.ts +5 -2
  72. package/dist/components/useStickToBottom.js +5 -2
  73. package/dist/{copy-button-CB2MWcau.js → copy-button-TVhDAroI.js} +1 -1
  74. package/dist/{icons-BCNawx-T.js → icons-BAlTbWWP.js} +27 -1
  75. package/dist/{icons-BYpJY6L2.d.ts → icons-BRI54ATJ.d.ts} +2 -1
  76. package/dist/styles/agent-chat.css +15 -3
  77. package/dist/styles/agent-connection.css +33 -4
  78. package/dist/styles/chatgpt-sign-in-screen.css +224 -0
  79. package/dist/styles/code-block.css +6 -4
  80. package/dist/styles/conversation.css +10 -0
  81. package/dist/styles/index.css +4 -0
  82. package/dist/styles/marker.css +95 -0
  83. package/dist/styles/message-scroller.css +113 -0
  84. package/dist/styles/message.css +2 -1
  85. package/dist/styles/prompt-input.css +1 -0
  86. package/dist/styles/scrollbars.css +10 -2
  87. package/dist/styles/streamdown.css +2 -0
  88. package/dist/styles/think-full-app.css +318 -0
  89. package/dist/utils/mcp-server-catalog.d.ts +23 -1
  90. package/dist/utils/mcp-server-catalog.js +27 -1
  91. package/package.json +3 -2
@@ -0,0 +1,528 @@
1
+ import { A as SelectTriggerProps, M as SelectValueProps, S as SelectProps, f as SelectOption, j as SelectValue, r as SelectContentProps, s as SelectItemProps, t as Select } from "./Select-CRsKCJ9x.js";
2
+ import { c as ComboboxGroup, d as ComboboxLabel, f as ComboboxList, g as ComboboxTrigger, h as ComboboxSeparator, l as ComboboxInput, m as ComboboxPositioner, p as ComboboxPopup, s as ComboboxEmpty, t as Combobox, u as ComboboxItem } from "./Combobox-D9anamNr.js";
3
+ import { h as MenuItemProps, l as MenuContentProps, w as MenuProps } from "./Menu-B5vDqZe_.js";
4
+ import { c as TabsList, n as TabPanel, t as Tab } from "./Tabs-D9EAq09D.js";
5
+ import { r as ButtonProps } from "./Button-Ct5I6aTu.js";
6
+ import * as React from "react";
7
+ import { ChatAddToolApproveResponseFunction, ChatStatus, DynamicToolUIPart, FileUIPart, ToolUIPart, UIMessage } from "ai";
8
+ import { PendingApproval } from "@cloudflare/think";
9
+
10
+ //#region src/components/PromptInput.d.ts
11
+ interface PromptInputReferencedSource {
12
+ id?: string;
13
+ title?: string;
14
+ url?: string;
15
+ [key: string]: unknown;
16
+ }
17
+ /** The payload produced when the prompt input is submitted. */
18
+ interface PromptInputMessage {
19
+ text: string;
20
+ files: FileUIPart[];
21
+ }
22
+ interface AttachmentsContext {
23
+ files: Array<FileUIPart & {
24
+ id: string;
25
+ }>;
26
+ add: (files: File[] | FileList) => void;
27
+ remove: (id: string) => void;
28
+ clear: () => void;
29
+ openFileDialog: () => void;
30
+ fileInputRef: React.RefObject<HTMLInputElement | null>;
31
+ }
32
+ interface TextInputContext {
33
+ value: string;
34
+ setInput: (value: string) => void;
35
+ clear: () => void;
36
+ }
37
+ interface PromptInputControllerProps {
38
+ textInput: TextInputContext;
39
+ attachments: AttachmentsContext;
40
+ __registerFileInput: (ref: React.RefObject<HTMLInputElement | null>, open: () => void) => void;
41
+ }
42
+ interface ReferencedSourcesContext {
43
+ sources: Array<PromptInputReferencedSource & {
44
+ id: string;
45
+ }>;
46
+ add: (sources: PromptInputReferencedSource[] | PromptInputReferencedSource) => void;
47
+ remove: (id: string) => void;
48
+ clear: () => void;
49
+ }
50
+ declare function usePromptInputController(): PromptInputControllerProps;
51
+ declare function useProviderAttachments(): AttachmentsContext;
52
+ declare function usePromptInputAttachments(): AttachmentsContext;
53
+ declare function usePromptInputReferencedSources(): ReferencedSourcesContext;
54
+ interface PromptInputProviderProps extends React.PropsWithChildren {
55
+ initialInput?: string;
56
+ }
57
+ declare function PromptInputProvider({
58
+ initialInput,
59
+ children
60
+ }: PromptInputProviderProps): React.JSX.Element;
61
+ interface PromptInputProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>, "onSubmit" | "onError"> {
62
+ /** Accepted file MIME types/extensions, passed to the hidden file input. */
63
+ accept?: string;
64
+ /** Allows multiple files in a single file picker/drop action. */
65
+ multiple?: boolean;
66
+ /** Listen for file drops on the whole document instead of only the form. */
67
+ globalDrop?: boolean;
68
+ /** Clears the hidden file input when attachments are cleared. */
69
+ syncHiddenInput?: boolean;
70
+ /** Maximum number of attached files. */
71
+ maxFiles?: number;
72
+ /** Maximum accepted file size in bytes. */
73
+ maxFileSize?: number;
74
+ /** Called when file validation rejects an attachment. */
75
+ onError?: (error: {
76
+ code: "max_files" | "max_file_size" | "accept";
77
+ message: string;
78
+ }) => void;
79
+ /** Called with the trimmed message text and files when the form is submitted. */
80
+ onSubmit?: (message: PromptInputMessage, event: React.FormEvent<HTMLFormElement>) => void | Promise<void>;
81
+ }
82
+ /**
83
+ * Chat-style composer form. Wraps a textarea and footer controls, with
84
+ * Enter-to-submit semantics, auto-resizing behavior, and optional attachments.
85
+ * Adapted from Vercel AI Elements and restyled with Sigvelo CSS tokens.
86
+ *
87
+ * Use for assistant/chat submit forms. Do not use it as a generic textarea or
88
+ * non-chat form. Sigvelo changes: uses shared Menu, Select, Combobox, Tabs,
89
+ * Button, and Tooltip components; maps styles to CSS tokens; adds local
90
+ * attachment and referenced-source helpers.
91
+ *
92
+ * The form handles Enter-to-submit while multiline editing remains in the
93
+ * textarea. Attachment controls need accessible labels through their buttons
94
+ * and menus. Add new shared tools here when multiple apps need them.
95
+ *
96
+ * @example
97
+ * ```tsx
98
+ * <PromptInput onSubmit={({ text, files }) => sendMessage({ text, files })}>
99
+ * <PromptInputBody>
100
+ * <PromptInputTextarea placeholder="Ask Sigvelo..." />
101
+ * </PromptInputBody>
102
+ * <PromptInputFooter>
103
+ * <PromptInputTools>
104
+ * <PromptInputActionAddAttachments />
105
+ * </PromptInputTools>
106
+ * <PromptInputSubmit status="ready" />
107
+ * </PromptInputFooter>
108
+ * </PromptInput>
109
+ * ```
110
+ *
111
+ * @see {@link https://elements.ai-sdk.dev/components/prompt-input | AI Elements Prompt Input}
112
+ */
113
+ declare function PromptInput({
114
+ className,
115
+ accept,
116
+ multiple,
117
+ globalDrop,
118
+ syncHiddenInput,
119
+ maxFiles,
120
+ maxFileSize,
121
+ onError,
122
+ onSubmit,
123
+ children,
124
+ id,
125
+ ref,
126
+ ...props
127
+ }: PromptInputProps & {
128
+ ref?: React.Ref<HTMLFormElement>;
129
+ }): React.JSX.Element;
130
+ interface PromptInputHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}
131
+ declare function PromptInputHeader({
132
+ className,
133
+ children,
134
+ ref,
135
+ ...props
136
+ }: PromptInputHeaderProps & {
137
+ ref?: React.Ref<HTMLDivElement>;
138
+ }): React.JSX.Element;
139
+ interface PromptInputAttachmentProps extends React.HTMLAttributes<HTMLDivElement> {
140
+ /** The pending attachment — the AI SDK `file` part plus the local list id. */
141
+ file: FileUIPart & {
142
+ id: string;
143
+ };
144
+ }
145
+ /**
146
+ * One pending attachment chip: image files show a thumbnail, everything else
147
+ * a file icon and name. The corner button removes it from the pending list.
148
+ */
149
+ declare function PromptInputAttachment({
150
+ file,
151
+ className,
152
+ ref,
153
+ ...props
154
+ }: PromptInputAttachmentProps & {
155
+ ref?: React.Ref<HTMLDivElement>;
156
+ }): React.JSX.Element;
157
+ interface PromptInputAttachmentsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children"> {
158
+ /** Override chip rendering per attachment. */
159
+ children?: (file: FileUIPart & {
160
+ id: string;
161
+ }) => React.ReactNode;
162
+ }
163
+ /**
164
+ * The pending-attachment chip row. Renders nothing while the list is empty,
165
+ * so it can sit in the composer unconditionally — files added via the file
166
+ * dialog, paste, or drop appear here until submit sends and clears them.
167
+ */
168
+ declare function PromptInputAttachments({
169
+ className,
170
+ children,
171
+ ref,
172
+ ...props
173
+ }: PromptInputAttachmentsProps & {
174
+ ref?: React.Ref<HTMLDivElement>;
175
+ }): React.JSX.Element | null;
176
+ interface PromptInputBodyProps extends React.HTMLAttributes<HTMLDivElement> {}
177
+ declare function PromptInputBody({
178
+ className,
179
+ children,
180
+ ref,
181
+ ...props
182
+ }: PromptInputBodyProps & {
183
+ ref?: React.Ref<HTMLDivElement>;
184
+ }): React.JSX.Element;
185
+ interface PromptInputFooterProps extends React.HTMLAttributes<HTMLDivElement> {}
186
+ declare function PromptInputFooter({
187
+ className,
188
+ children,
189
+ ref,
190
+ ...props
191
+ }: PromptInputFooterProps & {
192
+ ref?: React.Ref<HTMLDivElement>;
193
+ }): React.JSX.Element;
194
+ interface PromptInputToolsProps extends React.HTMLAttributes<HTMLDivElement> {}
195
+ declare function PromptInputTools({
196
+ className,
197
+ children,
198
+ ref,
199
+ ...props
200
+ }: PromptInputToolsProps & {
201
+ ref?: React.Ref<HTMLDivElement>;
202
+ }): React.JSX.Element;
203
+ interface PromptInputTextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
204
+ minHeight?: number;
205
+ maxHeight?: number;
206
+ }
207
+ declare function PromptInputTextarea({
208
+ className,
209
+ placeholder,
210
+ rows,
211
+ minHeight,
212
+ maxHeight,
213
+ onChange,
214
+ onCompositionEnd,
215
+ onCompositionStart,
216
+ onKeyDown,
217
+ onInput,
218
+ onPaste,
219
+ ref,
220
+ ...props
221
+ }: PromptInputTextareaProps & {
222
+ ref?: React.Ref<HTMLTextAreaElement>;
223
+ }): React.JSX.Element;
224
+ type TooltipSide = "top" | "right" | "bottom" | "left";
225
+ type PromptInputButtonTooltip = string | {
226
+ content: React.ReactNode;
227
+ shortcut?: string;
228
+ side?: TooltipSide;
229
+ };
230
+ type PromptInputTooltipConfig = Exclude<PromptInputButtonTooltip, string>;
231
+ interface PromptInputButtonProps extends Omit<ButtonProps, "children" | "className"> {
232
+ className?: string;
233
+ tooltip?: PromptInputButtonTooltip;
234
+ children?: React.ReactNode;
235
+ }
236
+ declare function PromptInputButton({
237
+ className,
238
+ tooltip,
239
+ variant,
240
+ color,
241
+ size,
242
+ children,
243
+ "aria-label": ariaLabel,
244
+ ref,
245
+ ...props
246
+ }: PromptInputButtonProps & {
247
+ ref?: React.Ref<HTMLButtonElement>;
248
+ }): React.JSX.Element;
249
+ type PromptInputActionMenuProps = MenuProps;
250
+ declare function PromptInputActionMenu(props: PromptInputActionMenuProps): React.JSX.Element;
251
+ type PromptInputActionMenuTriggerProps = PromptInputButtonProps;
252
+ declare function PromptInputActionMenuTrigger({
253
+ className,
254
+ children,
255
+ ...props
256
+ }: PromptInputActionMenuTriggerProps): React.JSX.Element;
257
+ type PromptInputActionMenuContentProps = MenuContentProps;
258
+ declare function PromptInputActionMenuContent({
259
+ className,
260
+ children,
261
+ ...props
262
+ }: PromptInputActionMenuContentProps): React.JSX.Element;
263
+ type PromptInputActionMenuItemProps = MenuItemProps;
264
+ declare function PromptInputActionMenuItem({
265
+ className,
266
+ ...props
267
+ }: PromptInputActionMenuItemProps): React.JSX.Element;
268
+ interface PromptInputActionAddAttachmentsProps extends PromptInputActionMenuItemProps {
269
+ label?: string;
270
+ }
271
+ declare function PromptInputActionAddAttachments({
272
+ label,
273
+ onClick,
274
+ children,
275
+ ...props
276
+ }: PromptInputActionAddAttachmentsProps): React.JSX.Element;
277
+ interface PromptInputActionAddScreenshotProps extends PromptInputActionMenuItemProps {
278
+ label?: string;
279
+ }
280
+ declare function PromptInputActionAddScreenshot({
281
+ label,
282
+ onClick,
283
+ children,
284
+ ...props
285
+ }: PromptInputActionAddScreenshotProps): React.JSX.Element;
286
+ /** How the agent's approval requests are handled. */
287
+ type PermissionMode = "ask" | "bypass";
288
+ interface PromptInputPermissionSelectorProps {
289
+ /** Current mode. `"ask"` surfaces approvals in the composer; `"bypass"` auto-approves. */
290
+ value: PermissionMode;
291
+ onValueChange: (mode: PermissionMode) => void;
292
+ /** Overrides the menu's header question. */
293
+ question?: string;
294
+ }
295
+ /**
296
+ * Footer control for choosing how approval requests are handled — ask each
297
+ * time, or bypass. Purely a picker: the auto-approve behavior lives with
298
+ * whoever owns the approvals (`AgentChat` wires both ends).
299
+ */
300
+ declare function PromptInputPermissionSelector({
301
+ value,
302
+ onValueChange,
303
+ question
304
+ }: PromptInputPermissionSelectorProps): React.JSX.Element;
305
+ interface PromptInputSubmitProps extends Omit<ButtonProps, "children" | "className" | "type"> {
306
+ className?: string;
307
+ status?: ChatStatus;
308
+ onStop?: () => void;
309
+ children?: React.ReactNode;
310
+ label?: string;
311
+ }
312
+ declare function PromptInputSubmit({
313
+ className,
314
+ status,
315
+ onStop,
316
+ variant,
317
+ color,
318
+ size,
319
+ onClick,
320
+ children,
321
+ label,
322
+ ref,
323
+ ...props
324
+ }: PromptInputSubmitProps & {
325
+ ref?: React.Ref<HTMLButtonElement>;
326
+ }): React.JSX.Element;
327
+ /**
328
+ * Resolve Think execution approvals that do not use the AI SDK
329
+ * `approval-requested` part: paused codemode executions and durable-pause
330
+ * approvals from `pendingApprovals()`. Wire to the Think agent's
331
+ * client-callable RPCs:
332
+ *
333
+ * ```tsx
334
+ * executionApprovals={{
335
+ * approve: (id) => agent.stub.approveExecution(id),
336
+ * reject: (id, reason) => agent.stub.rejectExecution(id, reason),
337
+ * }}
338
+ * ```
339
+ *
340
+ * On approve, upstream resumes or runs the parked execution and auto-continues
341
+ * the chat. Both RPCs are idempotent, so a stale click resolves to "already
342
+ * handled".
343
+ */
344
+ interface ExecutionApprovals {
345
+ approve: (executionId: string) => unknown;
346
+ reject: (executionId: string, reason?: string) => unknown;
347
+ }
348
+ /** The id a response must carry: the approval id, or the paused run's executionId. */
349
+ declare function getApprovalRequestId(part: ToolUIPart | DynamicToolUIPart): string | undefined;
350
+ /** Component-local identity: paused executions can ask for multiple approvals. */
351
+ declare function getApprovalStateKey(part: ToolUIPart | DynamicToolUIPart): string | undefined;
352
+ interface PendingToolApproval<MessageT extends UIMessage = UIMessage> {
353
+ message: MessageT;
354
+ messageIndex: number;
355
+ part: ToolUIPart | DynamicToolUIPart;
356
+ partIndex: number;
357
+ }
358
+ /** Derives pending tool approvals straight from the messages — no app-owned shapes. */
359
+ declare function getPendingToolApprovals<MessageT extends UIMessage>(messages: readonly MessageT[], {
360
+ pausedExecutions
361
+ }?: {
362
+ pausedExecutions?: boolean;
363
+ }): Array<PendingToolApproval<MessageT>>;
364
+ interface PromptInputApprovalProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "part"> {
365
+ /**
366
+ * The `approval-requested` tool part — or a paused codemode execution —
367
+ * passed whole. Renders nothing for other states.
368
+ */
369
+ part?: ToolUIPart | DynamicToolUIPart;
370
+ /** A Think `pendingApprovals()` entry for durable parked action approvals. */
371
+ approval?: PendingApproval;
372
+ /** Pass `addToolApprovalResponse` from `useAgentChat`/`useChat` directly. */
373
+ onRespond?: ChatAddToolApproveResponseFunction;
374
+ /** Resolves Think execution approvals instead of `onRespond`. See {@link ExecutionApprovals}. */
375
+ executionApprovals?: ExecutionApprovals;
376
+ /**
377
+ * Renders a Skip action that dismisses the confirmation without responding —
378
+ * the approval stays pending upstream.
379
+ */
380
+ onSkip?: () => void;
381
+ /** Overrides the default "Do you want to allow…" question. */
382
+ question?: React.ReactNode;
383
+ /** Total pending approvals, for the "1 of N" hint. */
384
+ count?: number;
385
+ }
386
+ /**
387
+ * The composer's approval state: when a tool call awaits human approval the
388
+ * prompt input area becomes the confirmation. "Yes" approves on click; typing
389
+ * in the "No, and tell the agent what to do differently" row selects deny and
390
+ * sends the text as the native approval `reason`. Submit (or Enter) sends the
391
+ * current selection — approve by default.
392
+ */
393
+ declare function PromptInputApproval({
394
+ part,
395
+ approval: durableApproval,
396
+ onRespond,
397
+ executionApprovals,
398
+ onSkip,
399
+ question,
400
+ count,
401
+ className,
402
+ ref,
403
+ ...props
404
+ }: PromptInputApprovalProps & {
405
+ ref?: React.Ref<HTMLDivElement>;
406
+ }): React.JSX.Element | null;
407
+ type PromptInputSelectProps = SelectProps;
408
+ declare const PromptInputSelect: typeof Select;
409
+ type PromptInputSelectTriggerProps = SelectTriggerProps;
410
+ declare function PromptInputSelectTrigger(props: PromptInputSelectTriggerProps): React.JSX.Element;
411
+ type PromptInputSelectContentProps = SelectContentProps;
412
+ declare function PromptInputSelectContent(props: PromptInputSelectContentProps): React.JSX.Element;
413
+ type PromptInputSelectItemProps = SelectItemProps;
414
+ declare const PromptInputSelectItem: typeof SelectOption;
415
+ type PromptInputSelectValueProps = SelectValueProps;
416
+ declare const PromptInputSelectValue: typeof SelectValue;
417
+ interface PromptInputHoverCardProps extends React.HTMLAttributes<HTMLDivElement> {
418
+ openDelay?: number;
419
+ closeDelay?: number;
420
+ }
421
+ declare function PromptInputHoverCard({
422
+ openDelay,
423
+ closeDelay,
424
+ className,
425
+ children,
426
+ ref,
427
+ ...props
428
+ }: PromptInputHoverCardProps & {
429
+ ref?: React.Ref<HTMLDivElement>;
430
+ }): React.JSX.Element;
431
+ interface PromptInputHoverCardTriggerProps extends React.HTMLAttributes<HTMLSpanElement> {}
432
+ declare function PromptInputHoverCardTrigger({
433
+ className,
434
+ ref,
435
+ ...props
436
+ }: PromptInputHoverCardTriggerProps & {
437
+ ref?: React.Ref<HTMLSpanElement>;
438
+ }): React.JSX.Element;
439
+ interface PromptInputHoverCardContentProps extends React.HTMLAttributes<HTMLDivElement> {}
440
+ declare function PromptInputHoverCardContent({
441
+ className,
442
+ ref,
443
+ ...props
444
+ }: PromptInputHoverCardContentProps & {
445
+ ref?: React.Ref<HTMLDivElement>;
446
+ }): React.JSX.Element | null;
447
+ type PromptInputTabsListProps = React.ComponentPropsWithoutRef<typeof TabsList>;
448
+ declare const PromptInputTabsList: typeof TabsList;
449
+ type PromptInputTabProps = React.ComponentPropsWithoutRef<typeof Tab>;
450
+ declare const PromptInputTab: typeof Tab;
451
+ type PromptInputTabBodyProps = React.ComponentPropsWithoutRef<typeof TabPanel>;
452
+ declare const PromptInputTabBody: typeof TabPanel;
453
+ interface PromptInputTabLabelProps extends React.HTMLAttributes<HTMLHeadingElement> {}
454
+ declare function PromptInputTabLabel({
455
+ className,
456
+ ref,
457
+ ...props
458
+ }: PromptInputTabLabelProps & {
459
+ ref?: React.Ref<HTMLHeadingElement>;
460
+ }): React.JSX.Element;
461
+ interface PromptInputTabItemProps extends React.HTMLAttributes<HTMLDivElement> {}
462
+ declare function PromptInputTabItem({
463
+ className,
464
+ ref,
465
+ ...props
466
+ }: PromptInputTabItemProps & {
467
+ ref?: React.Ref<HTMLDivElement>;
468
+ }): React.JSX.Element;
469
+ type PromptInputCommandProps = React.ComponentPropsWithoutRef<typeof Combobox>;
470
+ declare const PromptInputCommand: typeof import("@base-ui/react").ComboboxRoot & {
471
+ Root: typeof import("@base-ui/react").ComboboxRoot;
472
+ Input: typeof ComboboxInput;
473
+ Trigger: typeof ComboboxTrigger;
474
+ Clear: ({
475
+ className,
476
+ ref,
477
+ ...props
478
+ }: Omit<React.ComponentPropsWithRef<typeof import("@base-ui/react").ComboboxClear>, "className"> & {
479
+ className?: string;
480
+ } & {
481
+ ref?: React.Ref<HTMLButtonElement>;
482
+ }) => React.JSX.Element;
483
+ Portal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").AutocompletePortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
484
+ Positioner: typeof ComboboxPositioner;
485
+ Popup: typeof ComboboxPopup;
486
+ Content: typeof ComboboxPopup;
487
+ List: typeof ComboboxList;
488
+ Item: typeof ComboboxItem;
489
+ ItemIndicator: ({
490
+ className,
491
+ ref,
492
+ ...props
493
+ }: Omit<React.ComponentPropsWithRef<typeof import("@base-ui/react").ComboboxItemIndicator>, "className"> & {
494
+ className?: string;
495
+ } & {
496
+ ref?: React.Ref<HTMLSpanElement>;
497
+ }) => React.JSX.Element;
498
+ Empty: typeof ComboboxEmpty;
499
+ Group: typeof ComboboxGroup;
500
+ GroupLabel: typeof ComboboxLabel;
501
+ Label: typeof ComboboxLabel;
502
+ Value: typeof import("@base-ui/react").ComboboxValue;
503
+ Chips: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ComboboxChipsProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
504
+ Chip: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ComboboxChipProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
505
+ ChipsInput: typeof ComboboxInput;
506
+ Collection: typeof import("@base-ui/react").ComboboxCollection;
507
+ Separator: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").SeparatorProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
508
+ };
509
+ type PromptInputCommandInputProps = React.ComponentPropsWithoutRef<typeof ComboboxInput>;
510
+ declare const PromptInputCommandInput: typeof ComboboxInput;
511
+ interface PromptInputCommandListProps extends React.HTMLAttributes<HTMLDivElement> {}
512
+ declare function PromptInputCommandList({
513
+ className,
514
+ ref,
515
+ ...props
516
+ }: PromptInputCommandListProps & {
517
+ ref?: React.Ref<HTMLDivElement>;
518
+ }): React.JSX.Element;
519
+ type PromptInputCommandEmptyProps = React.ComponentPropsWithoutRef<typeof ComboboxEmpty>;
520
+ declare const PromptInputCommandEmpty: typeof ComboboxEmpty;
521
+ type PromptInputCommandGroupProps = React.ComponentPropsWithoutRef<typeof ComboboxGroup>;
522
+ declare const PromptInputCommandGroup: typeof ComboboxGroup;
523
+ type PromptInputCommandItemProps = React.ComponentPropsWithoutRef<typeof ComboboxItem>;
524
+ declare const PromptInputCommandItem: typeof ComboboxItem;
525
+ type PromptInputCommandSeparatorProps = React.ComponentPropsWithoutRef<typeof ComboboxSeparator>;
526
+ declare const PromptInputCommandSeparator: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").SeparatorProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
527
+ //#endregion
528
+ export { PromptInputHoverCardTriggerProps as $, PromptInputCommandEmpty as A, PromptInputTextareaProps as At, PromptInputCommandProps as B, usePromptInputAttachments as Bt, PromptInputAttachmentsProps as C, PromptInputTabItemProps as Ct, PromptInputButtonProps as D, PromptInputTabsList as Dt, PromptInputButton as E, PromptInputTabProps as Et, PromptInputCommandInputProps as F, TextInputContext as Ft, PromptInputFooterProps as G, PromptInputCommandSeparatorProps as H, usePromptInputReferencedSources as Ht, PromptInputCommandItem as I, TooltipSide as It, PromptInputHoverCard as J, PromptInputHeader as K, PromptInputCommandItemProps as L, getApprovalRequestId as Lt, PromptInputCommandGroup as M, PromptInputToolsProps as Mt, PromptInputCommandGroupProps as N, PromptInputTooltipConfig as Nt, PromptInputButtonTooltip as O, PromptInputTabsListProps as Ot, PromptInputCommandInput as P, ReferencedSourcesContext as Pt, PromptInputHoverCardTrigger as Q, PromptInputCommandList as R, getApprovalStateKey as Rt, PromptInputAttachments as S, PromptInputTabItem as St, PromptInputBodyProps as T, PromptInputTabLabelProps as Tt, PromptInputControllerProps as U, useProviderAttachments as Ut, PromptInputCommandSeparator as V, usePromptInputController as Vt, PromptInputFooter as W, PromptInputHoverCardContentProps as X, PromptInputHoverCardContent as Y, PromptInputHoverCardProps as Z, PromptInputActionMenuTriggerProps as _, PromptInputSubmit as _t, PromptInput as a, PromptInputProviderProps as at, PromptInputAttachment as b, PromptInputTabBody as bt, PromptInputActionAddScreenshot as c, PromptInputSelectContent as ct, PromptInputActionMenuContent as d, PromptInputSelectItemProps as dt, PromptInputMessage as et, PromptInputActionMenuContentProps as f, PromptInputSelectProps as ft, PromptInputActionMenuTrigger as g, PromptInputSelectValueProps as gt, PromptInputActionMenuProps as h, PromptInputSelectValue as ht, PermissionMode as i, PromptInputProvider as it, PromptInputCommandEmptyProps as j, PromptInputTools as jt, PromptInputCommand as k, PromptInputTextarea as kt, PromptInputActionAddScreenshotProps as l, PromptInputSelectContentProps as lt, PromptInputActionMenuItemProps as m, PromptInputSelectTriggerProps as mt, ExecutionApprovals as n, PromptInputPermissionSelectorProps as nt, PromptInputActionAddAttachments as o, PromptInputReferencedSource as ot, PromptInputActionMenuItem as p, PromptInputSelectTrigger as pt, PromptInputHeaderProps as q, PendingToolApproval as r, PromptInputProps as rt, PromptInputActionAddAttachmentsProps as s, PromptInputSelect as st, AttachmentsContext as t, PromptInputPermissionSelector as tt, PromptInputActionMenu as u, PromptInputSelectItem as ut, PromptInputApproval as v, PromptInputSubmitProps as vt, PromptInputBody as w, PromptInputTabLabel as wt, PromptInputAttachmentProps as x, PromptInputTabBodyProps as xt, PromptInputApprovalProps as y, PromptInputTab as yt, PromptInputCommandListProps as z, getPendingToolApprovals as zt };
@@ -0,0 +1,73 @@
1
+ import { a as AgentChatRenderPartContext, r as AgentChatProps } from "./AgentChat-403mckDG.js";
2
+ import { s as ThinkChatPart } from "./ThinkChatToolParts-DnUiZgCC.js";
3
+ import * as React from "react";
4
+ import { DynamicToolUIPart, ToolUIPart, UIMessage } from "ai";
5
+
6
+ //#region src/components/ThinkChatActivity.d.ts
7
+ /**
8
+ * Bespoke rendering for one tool inside the activity log. Both hooks fall
9
+ * through to the built-in families when they return `undefined`, so an
10
+ * override can adjust just the label or just the panel.
11
+ */
12
+ interface ThinkChatToolRenderer {
13
+ /** One-line step label. `null` hides the step from the log. */
14
+ describe?: (part: ToolUIPart | DynamicToolUIPart) => string | null | undefined;
15
+ /** Expanded detail under the step. `null` keeps the step a plain row. */
16
+ panel?: (part: ToolUIPart | DynamicToolUIPart) => React.ReactNode;
17
+ }
18
+ type ThinkChatToolRenderers = Record<string, ThinkChatToolRenderer>;
19
+ interface ThinkChatActivityRendererOptions {
20
+ /**
21
+ * Tool names to keep out of activity folding entirely — the run splits
22
+ * around them and they fall through to your own renderPart / AgentChat's
23
+ * generic standalone activity row. For tools that should stay in the log
24
+ * with custom UI, use `toolRenderers` instead.
25
+ */
26
+ excludeTools?: readonly string[];
27
+ /** Per-tool label/panel overrides inside the activity log, keyed by tool name. */
28
+ toolRenderers?: ThinkChatToolRenderers;
29
+ }
30
+ /**
31
+ * One-line natural-language label for an activity part ("Ran vp test",
32
+ * "Fetched developers.cloudflare.com/agents/"); `null` for boundaries that
33
+ * aren't steps (step-start). Exported so a custom `renderPart` can reuse the
34
+ * built-in labels for tools it doesn't override.
35
+ */
36
+ declare function describeThinkChatActivityPart(part: ThinkChatPart, toolRenderers?: ThinkChatToolRenderers): string | null;
37
+ interface ThinkChatActivityProps {
38
+ /** Render with the log expanded. */
39
+ defaultOpen?: boolean;
40
+ parts: readonly ThinkChatPart[];
41
+ /** Defaults to deriving from part states (reasoning streaming, tool awaiting output). */
42
+ isStreaming?: boolean;
43
+ /** Per-tool label/panel overrides, keyed by tool name. */
44
+ toolRenderers?: ThinkChatToolRenderers;
45
+ }
46
+ /**
47
+ * One run of agent work as a collapsed Activity block: while streaming the
48
+ * label shimmers with the live step; settled, it becomes a short summary
49
+ * ("Thought, read 2 files and ran a command") over an expandable step log
50
+ * with per-tool panels. Normally reached through `ThinkChat.Messages`;
51
+ * exported for apps that lay out messages themselves.
52
+ */
53
+ declare function ThinkChatActivity({
54
+ parts,
55
+ defaultOpen,
56
+ isStreaming,
57
+ toolRenderers
58
+ }: ThinkChatActivityProps): React.JSX.Element | null;
59
+ /**
60
+ * Builds a renderPart handler that folds every run of consecutive activity
61
+ * parts (reasoning + tool calls) into one collapsed Activity box. Everything
62
+ * is derived from the UIMessage stream: part order, tool states, reasoning
63
+ * state. Excluded tools split the run and return undefined so your own
64
+ * renderPart (or AgentChat's generic activity row) takes over for them.
65
+ */
66
+ declare function createThinkChatActivityRenderer({
67
+ excludeTools,
68
+ toolRenderers
69
+ }?: ThinkChatActivityRendererOptions): NonNullable<AgentChatProps["renderPart"]>;
70
+ /** Default activity renderer — `createThinkChatActivityRenderer()` with no overrides. */
71
+ declare const renderThinkChatActivityPart: (context: AgentChatRenderPartContext<UIMessage<unknown, import("ai").UIDataTypes, import("ai").UITools>>) => React.ReactNode | undefined;
72
+ //#endregion
73
+ export { ThinkChatToolRenderers as a, renderThinkChatActivityPart as c, ThinkChatToolRenderer as i, ThinkChatActivityProps as n, createThinkChatActivityRenderer as o, ThinkChatActivityRendererOptions as r, describeThinkChatActivityPart as s, ThinkChatActivity as t };
@@ -0,0 +1,28 @@
1
+ import * as React from "react";
2
+ import { UIMessage } from "ai";
3
+ import { useAgentChat } from "@cloudflare/think/react";
4
+
5
+ //#region src/components/ThinkChatContext.d.ts
6
+ type ThinkChatValue = ReturnType<typeof useAgentChat<unknown, UIMessage>>;
7
+ declare const ThinkChatContext: React.Context<(Omit<import("@ai-sdk/react").UseChatHelpers<UIMessage<unknown, import("ai").UIDataTypes, import("ai").UITools>>, "addToolOutput"> & {
8
+ clearHistory: () => void;
9
+ addToolOutput: (opts: {
10
+ toolCallId: string;
11
+ toolName?: string;
12
+ output?: unknown;
13
+ state?: "output-available" | "output-error";
14
+ errorText?: string;
15
+ }) => void;
16
+ isServerStreaming: boolean;
17
+ isStreaming: boolean;
18
+ isRecovering: boolean;
19
+ isToolContinuation: boolean;
20
+ connectionError: (Error & {
21
+ code: number;
22
+ reason: string;
23
+ wasClean: boolean;
24
+ }) | null;
25
+ }) | null>;
26
+ declare function useThinkChatContext(component: string): ThinkChatValue;
27
+ //#endregion
28
+ export { ThinkChatValue as n, useThinkChatContext as r, ThinkChatContext as t };