@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.
- package/dist/AgentChat-403mckDG.d.ts +101 -0
- package/dist/BrowserLiveView-ZktFZiMD.d.ts +47 -0
- package/dist/BrowserReplay-6G-mnwcn.d.ts +40 -0
- package/dist/{CodeBlock-BK0sOAbV.js → CodeBlock-D9koxDA7.js} +1 -1
- package/dist/{FileTree-BWQZ0FSi.js → FileTree-BdK93Uuu.js} +1 -1
- package/dist/ModelSelector-MQvK-pNb.js +306 -0
- package/dist/PromptInput-D6-G24p7.d.ts +528 -0
- package/dist/ThinkChatActivity-CeHzk6-K.d.ts +73 -0
- package/dist/ThinkChatContext-CC94HL4u.d.ts +28 -0
- package/dist/ThinkChatToolParts-DnUiZgCC.d.ts +83 -0
- package/dist/components/Activity.js +1 -1
- package/dist/components/AgentChat.d.ts +1 -103
- package/dist/components/AgentChat.js +77 -58
- package/dist/components/AgentConnection.d.ts +43 -2
- package/dist/components/AgentConnection.js +154 -3
- package/dist/components/Artifact.js +1 -1
- package/dist/components/BrowserLiveView.d.ts +1 -46
- package/dist/components/BrowserLiveView.js +1 -1
- package/dist/components/BrowserReplay.d.ts +1 -39
- package/dist/components/BrowserReplay.js +1 -1
- package/dist/components/ChainOfThought.d.ts +1 -1
- package/dist/components/ChainOfThought.js +1 -1
- package/dist/components/ChatGptSignInScreen.d.ts +38 -0
- package/dist/components/ChatGptSignInScreen.js +201 -0
- package/dist/components/CodeBlock.js +1 -1
- package/dist/components/Commit.js +1 -1
- package/dist/components/Context.d.ts +6 -10
- package/dist/components/Context.js +4 -2
- package/dist/components/ContextMenu.js +1 -1
- package/dist/components/Conversation.d.ts +28 -28
- package/dist/components/Conversation.js +36 -55
- package/dist/components/Dialog.js +1 -1
- package/dist/components/EnvironmentVariables.js +1 -1
- package/dist/components/FileTree.js +1 -1
- package/dist/components/Marker.d.ts +57 -0
- package/dist/components/Marker.js +89 -0
- package/dist/components/McpServerPicker.js +1 -1
- package/dist/components/Menubar.js +1 -1
- package/dist/components/Message.js +1 -1
- package/dist/components/MessageScroller.d.ts +52 -0
- package/dist/components/MessageScroller.js +62 -0
- package/dist/components/ModelSelector.js +1 -305
- package/dist/components/NavigationMenu.js +1 -1
- package/dist/components/PromptInput.d.ts +2 -534
- package/dist/components/PromptInput.js +18 -12
- package/dist/components/Queue.js +1 -1
- package/dist/components/Reasoning.js +1 -1
- package/dist/components/Select.js +1 -1
- package/dist/components/Sources.js +1 -1
- package/dist/components/Stepper.js +1 -1
- package/dist/components/Task.js +1 -1
- package/dist/components/Terminal.js +2 -2
- package/dist/components/TestResults.js +1 -1
- package/dist/components/ThinkChat.d.ts +23 -80
- package/dist/components/ThinkChat.js +60 -857
- package/dist/components/ThinkChatActivity.d.ts +3 -0
- package/dist/components/ThinkChatActivity.js +429 -0
- package/dist/components/ThinkChatContext.d.ts +2 -0
- package/dist/components/ThinkChatContext.js +10 -0
- package/dist/components/ThinkChatToolPanels.d.ts +39 -0
- package/dist/components/ThinkChatToolPanels.js +355 -0
- package/dist/components/ThinkChatToolParts.d.ts +2 -0
- package/dist/components/ThinkChatToolParts.js +66 -0
- package/dist/components/ThinkFullApp.d.ts +23 -0
- package/dist/components/ThinkFullApp.js +175 -0
- package/dist/components/WebPreview.js +1 -1
- package/dist/components/WorkspaceExplorer.d.ts +1 -1
- package/dist/components/WorkspaceExplorer.js +3 -3
- package/dist/components/icons.d.ts +2 -2
- package/dist/components/icons.js +2 -2
- package/dist/components/useStickToBottom.d.ts +5 -2
- package/dist/components/useStickToBottom.js +5 -2
- package/dist/{copy-button-CB2MWcau.js → copy-button-TVhDAroI.js} +1 -1
- package/dist/{icons-BCNawx-T.js → icons-BAlTbWWP.js} +27 -1
- package/dist/{icons-BYpJY6L2.d.ts → icons-BRI54ATJ.d.ts} +2 -1
- package/dist/styles/agent-chat.css +15 -3
- package/dist/styles/agent-connection.css +33 -4
- package/dist/styles/chatgpt-sign-in-screen.css +224 -0
- package/dist/styles/code-block.css +6 -4
- package/dist/styles/conversation.css +10 -0
- package/dist/styles/index.css +4 -0
- package/dist/styles/marker.css +95 -0
- package/dist/styles/message-scroller.css +113 -0
- package/dist/styles/message.css +2 -1
- package/dist/styles/prompt-input.css +1 -0
- package/dist/styles/scrollbars.css +10 -2
- package/dist/styles/streamdown.css +2 -0
- package/dist/styles/think-full-app.css +318 -0
- package/dist/utils/mcp-server-catalog.d.ts +23 -1
- package/dist/utils/mcp-server-catalog.js +27 -1
- 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 };
|