@assistant-ui/react 0.1.9 → 0.1.11
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/README.md +2 -0
- package/dist/{ThreadActions-DqqhRbf1.d.mts → ThreadActions-BLcKtagX.d.mts} +1 -0
- package/dist/{ThreadActions-DqqhRbf1.d.ts → ThreadActions-BLcKtagX.d.ts} +1 -0
- package/dist/{chunk-7O2URLFI.mjs → chunk-KUACYNLE.mjs} +22 -22
- package/dist/chunk-KUACYNLE.mjs.map +1 -0
- package/dist/experimental.d.mts +3 -3
- package/dist/experimental.d.ts +3 -3
- package/dist/experimental.js +7 -7
- package/dist/experimental.js.map +1 -1
- package/dist/experimental.mjs +1 -1
- package/dist/experimental.mjs.map +1 -1
- package/dist/index.d.mts +81 -44
- package/dist/index.d.ts +81 -44
- package/dist/index.js +625 -482
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +528 -405
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -1
- package/dist/chunk-7O2URLFI.mjs.map +0 -1
package/dist/index.js
CHANGED
@@ -38,19 +38,33 @@ __export(src_exports, {
|
|
38
38
|
INTERNAL: () => internal_exports,
|
39
39
|
MessagePrimitive: () => message_exports,
|
40
40
|
ThreadPrimitive: () => thread_exports,
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
41
|
+
useActionBarCopy: () => useActionBarCopy,
|
42
|
+
useActionBarEdit: () => useActionBarEdit,
|
43
|
+
useActionBarReload: () => useActionBarReload,
|
44
|
+
useBranchPickerCount: () => useBranchPickerCount,
|
45
|
+
useBranchPickerNext: () => useBranchPickerNext,
|
46
|
+
useBranchPickerNumber: () => useBranchPickerNumber,
|
47
|
+
useBranchPickerPrevious: () => useBranchPickerPrevious,
|
48
|
+
useComposerCancel: () => useComposerCancel,
|
49
|
+
useComposerIf: () => useComposerIf,
|
50
|
+
useComposerSend: () => useComposerSend,
|
51
|
+
useContentPartDisplay: () => useContentPartDisplay,
|
52
|
+
useContentPartImage: () => useContentPartImage,
|
53
|
+
useContentPartInProgressIndicator: () => useContentPartInProgressIndicator,
|
54
|
+
useContentPartText: () => useContentPartText,
|
45
55
|
useLocalRuntime: () => useLocalRuntime,
|
46
|
-
|
56
|
+
useMessageIf: () => useMessageIf,
|
57
|
+
useThreadEmpty: () => useThreadEmpty,
|
58
|
+
useThreadIf: () => useThreadIf,
|
59
|
+
useThreadScrollToBottom: () => useThreadScrollToBottom,
|
60
|
+
useThreadSuggestion: () => useThreadSuggestion
|
47
61
|
});
|
48
62
|
module.exports = __toCommonJS(src_exports);
|
49
63
|
|
50
|
-
// src/
|
64
|
+
// src/primitive-hooks/actionBar/useActionBarCopy.tsx
|
51
65
|
var import_react4 = require("react");
|
52
66
|
|
53
|
-
// src/context/MessageContext.ts
|
67
|
+
// src/context/react/MessageContext.ts
|
54
68
|
var import_react = require("react");
|
55
69
|
var MessageContext = (0, import_react.createContext)(null);
|
56
70
|
var useMessageContext = () => {
|
@@ -96,36 +110,54 @@ var getMessageText = (message) => {
|
|
96
110
|
return textParts.map((part) => part.text).join("\n\n");
|
97
111
|
};
|
98
112
|
|
99
|
-
// src/
|
100
|
-
var
|
101
|
-
|
113
|
+
// src/primitive-hooks/actionBar/useActionBarCopy.tsx
|
114
|
+
var useActionBarCopy = ({
|
115
|
+
copiedDuration = 3e3
|
116
|
+
} = {}) => {
|
117
|
+
const { useMessage, useMessageUtils, useEditComposer } = useMessageContext();
|
102
118
|
const hasCopyableContent = useCombinedStore(
|
103
|
-
[useMessage,
|
119
|
+
[useMessage, useEditComposer],
|
104
120
|
(m, c) => {
|
105
|
-
return c.isEditing
|
121
|
+
return !c.isEditing && m.message.content.some((c2) => c2.type === "text");
|
106
122
|
}
|
107
123
|
);
|
108
124
|
const callback = (0, import_react4.useCallback)(() => {
|
109
125
|
const { message } = useMessage.getState();
|
110
126
|
const { setIsCopied } = useMessageUtils.getState();
|
111
|
-
const { isEditing, value: composerValue } =
|
127
|
+
const { isEditing, value: composerValue } = useEditComposer.getState();
|
112
128
|
const valueToCopy = isEditing ? composerValue : getMessageText(message);
|
113
129
|
navigator.clipboard.writeText(valueToCopy);
|
114
130
|
setIsCopied(true);
|
115
131
|
setTimeout(() => setIsCopied(false), copiedDuration);
|
116
|
-
}, [useMessage, useMessageUtils,
|
132
|
+
}, [useMessage, useMessageUtils, useEditComposer, copiedDuration]);
|
117
133
|
if (!hasCopyableContent) return null;
|
118
134
|
return callback;
|
119
135
|
};
|
120
136
|
|
121
|
-
// src/
|
122
|
-
var import_react6 = require("react");
|
123
|
-
|
124
|
-
// src/context/ThreadContext.ts
|
137
|
+
// src/primitive-hooks/actionBar/useActionBarEdit.tsx
|
125
138
|
var import_react5 = require("react");
|
126
|
-
var
|
139
|
+
var useActionBarEdit = () => {
|
140
|
+
const { useMessage, useEditComposer } = useMessageContext();
|
141
|
+
const disabled = useCombinedStore(
|
142
|
+
[useMessage, useEditComposer],
|
143
|
+
(m, c) => m.message.role !== "user" || c.isEditing
|
144
|
+
);
|
145
|
+
const callback = (0, import_react5.useCallback)(() => {
|
146
|
+
const { edit } = useEditComposer.getState();
|
147
|
+
edit();
|
148
|
+
}, [useEditComposer]);
|
149
|
+
if (disabled) return null;
|
150
|
+
return callback;
|
151
|
+
};
|
152
|
+
|
153
|
+
// src/primitive-hooks/actionBar/useActionBarReload.tsx
|
154
|
+
var import_react7 = require("react");
|
155
|
+
|
156
|
+
// src/context/react/ThreadContext.ts
|
157
|
+
var import_react6 = require("react");
|
158
|
+
var ThreadContext = (0, import_react6.createContext)(null);
|
127
159
|
var useThreadContext = () => {
|
128
|
-
const context = (0,
|
160
|
+
const context = (0, import_react6.useContext)(ThreadContext);
|
129
161
|
if (!context)
|
130
162
|
throw new Error(
|
131
163
|
"This component must be used within an AssistantRuntimeProvider."
|
@@ -133,15 +165,15 @@ var useThreadContext = () => {
|
|
133
165
|
return context;
|
134
166
|
};
|
135
167
|
|
136
|
-
// src/
|
137
|
-
var
|
168
|
+
// src/primitive-hooks/actionBar/useActionBarReload.tsx
|
169
|
+
var useActionBarReload = () => {
|
138
170
|
const { useThread, useThreadActions, useViewport } = useThreadContext();
|
139
171
|
const { useMessage } = useMessageContext();
|
140
172
|
const disabled = useCombinedStore(
|
141
173
|
[useThread, useMessage],
|
142
174
|
(t, m) => t.isRunning || m.message.role !== "assistant"
|
143
175
|
);
|
144
|
-
const callback = (0,
|
176
|
+
const callback = (0, import_react7.useCallback)(() => {
|
145
177
|
const { parentId } = useMessage.getState();
|
146
178
|
useThreadActions.getState().startRun(parentId);
|
147
179
|
useViewport.getState().scrollToBottom();
|
@@ -150,29 +182,20 @@ var useReloadMessage = () => {
|
|
150
182
|
return callback;
|
151
183
|
};
|
152
184
|
|
153
|
-
// src/
|
154
|
-
var
|
155
|
-
|
156
|
-
const
|
157
|
-
|
158
|
-
[useMessage, useComposer],
|
159
|
-
(m, c) => m.message.role !== "user" || c.isEditing
|
160
|
-
);
|
161
|
-
const callback = (0, import_react7.useCallback)(() => {
|
162
|
-
const { edit } = useComposer.getState();
|
163
|
-
edit();
|
164
|
-
}, [useComposer]);
|
165
|
-
if (disabled) return null;
|
166
|
-
return callback;
|
185
|
+
// src/primitive-hooks/branchPicker/useBranchPickerCount.tsx
|
186
|
+
var useBranchPickerCount = () => {
|
187
|
+
const { useMessage } = useMessageContext();
|
188
|
+
const branchCount = useMessage((s) => s.branches.length);
|
189
|
+
return branchCount;
|
167
190
|
};
|
168
191
|
|
169
|
-
// src/
|
192
|
+
// src/primitive-hooks/branchPicker/useBranchPickerNext.tsx
|
170
193
|
var import_react8 = require("react");
|
171
|
-
var
|
194
|
+
var useBranchPickerNext = () => {
|
172
195
|
const { useThreadActions } = useThreadContext();
|
173
|
-
const { useMessage,
|
196
|
+
const { useMessage, useEditComposer } = useMessageContext();
|
174
197
|
const disabled = useCombinedStore(
|
175
|
-
[useMessage,
|
198
|
+
[useMessage, useEditComposer],
|
176
199
|
(m, c) => c.isEditing || m.branches.indexOf(m.message.id) + 1 >= m.branches.length
|
177
200
|
);
|
178
201
|
const callback = (0, import_react8.useCallback)(() => {
|
@@ -183,13 +206,20 @@ var useGoToNextBranch = () => {
|
|
183
206
|
return callback;
|
184
207
|
};
|
185
208
|
|
186
|
-
// src/
|
209
|
+
// src/primitive-hooks/branchPicker/useBranchPickerNumber.tsx
|
210
|
+
var useBranchPickerNumber = () => {
|
211
|
+
const { useMessage } = useMessageContext();
|
212
|
+
const branchIdx = useMessage((s) => s.branches.indexOf(s.message.id));
|
213
|
+
return branchIdx + 1;
|
214
|
+
};
|
215
|
+
|
216
|
+
// src/primitive-hooks/branchPicker/useBranchPickerPrevious.tsx
|
187
217
|
var import_react9 = require("react");
|
188
|
-
var
|
218
|
+
var useBranchPickerPrevious = () => {
|
189
219
|
const { useThreadActions } = useThreadContext();
|
190
|
-
const { useMessage,
|
220
|
+
const { useMessage, useEditComposer } = useMessageContext();
|
191
221
|
const disabled = useCombinedStore(
|
192
|
-
[useMessage,
|
222
|
+
[useMessage, useEditComposer],
|
193
223
|
(m, c) => c.isEditing || m.branches.indexOf(m.message.id) <= 0
|
194
224
|
);
|
195
225
|
const callback = (0, import_react9.useCallback)(() => {
|
@@ -200,6 +230,206 @@ var useGoToPreviousBranch = () => {
|
|
200
230
|
return callback;
|
201
231
|
};
|
202
232
|
|
233
|
+
// src/primitive-hooks/composer/useComposerCancel.tsx
|
234
|
+
var import_react13 = require("react");
|
235
|
+
|
236
|
+
// src/context/react/AssistantContext.ts
|
237
|
+
var import_react10 = require("react");
|
238
|
+
var AssistantContext = (0, import_react10.createContext)(
|
239
|
+
null
|
240
|
+
);
|
241
|
+
var useAssistantContext = () => {
|
242
|
+
const context = (0, import_react10.useContext)(AssistantContext);
|
243
|
+
if (!context)
|
244
|
+
throw new Error(
|
245
|
+
"This component must be used within an AssistantRuntimeProvider."
|
246
|
+
);
|
247
|
+
return context;
|
248
|
+
};
|
249
|
+
|
250
|
+
// src/context/react/ComposerContext.ts
|
251
|
+
var import_react11 = require("react");
|
252
|
+
var useComposerContext = () => {
|
253
|
+
const { useComposer } = useThreadContext();
|
254
|
+
const { useEditComposer } = (0, import_react11.useContext)(MessageContext) ?? {};
|
255
|
+
return (0, import_react11.useMemo)(
|
256
|
+
() => ({
|
257
|
+
useComposer: useEditComposer ?? useComposer,
|
258
|
+
type: useEditComposer ? "edit" : "new"
|
259
|
+
}),
|
260
|
+
[useEditComposer, useComposer]
|
261
|
+
);
|
262
|
+
};
|
263
|
+
|
264
|
+
// src/context/react/ContentPartContext.ts
|
265
|
+
var import_react12 = require("react");
|
266
|
+
var ContentPartContext = (0, import_react12.createContext)(
|
267
|
+
null
|
268
|
+
);
|
269
|
+
var useContentPartContext = () => {
|
270
|
+
const context = (0, import_react12.useContext)(ContentPartContext);
|
271
|
+
if (!context)
|
272
|
+
throw new Error(
|
273
|
+
"This component can only be used inside a component passed to <MessagePrimitive.Content components={...} >."
|
274
|
+
);
|
275
|
+
return context;
|
276
|
+
};
|
277
|
+
|
278
|
+
// src/primitive-hooks/composer/useComposerCancel.tsx
|
279
|
+
var useComposerCancel = () => {
|
280
|
+
const { useComposer } = useComposerContext();
|
281
|
+
const disabled = useComposer((c) => !c.isEditing);
|
282
|
+
const callback = (0, import_react13.useCallback)(() => {
|
283
|
+
const { cancel } = useComposer.getState();
|
284
|
+
cancel();
|
285
|
+
}, [useComposer]);
|
286
|
+
if (disabled) return null;
|
287
|
+
return callback;
|
288
|
+
};
|
289
|
+
|
290
|
+
// src/primitive-hooks/composer/useComposerIf.tsx
|
291
|
+
var useComposerIf = (props) => {
|
292
|
+
const { useComposer } = useComposerContext();
|
293
|
+
return useComposer((composer) => {
|
294
|
+
if (props.editing === true && !composer.isEditing) return false;
|
295
|
+
if (props.editing === false && composer.isEditing) return false;
|
296
|
+
return true;
|
297
|
+
});
|
298
|
+
};
|
299
|
+
|
300
|
+
// src/primitive-hooks/composer/useComposerSend.tsx
|
301
|
+
var import_react14 = require("react");
|
302
|
+
var useComposerSend = () => {
|
303
|
+
const { useViewport } = useThreadContext();
|
304
|
+
const { useComposer } = useComposerContext();
|
305
|
+
const disabled = useComposer((c) => !c.isEditing || c.value.length === 0);
|
306
|
+
const callback = (0, import_react14.useCallback)(() => {
|
307
|
+
const composerState = useComposer.getState();
|
308
|
+
if (!composerState.isEditing) return;
|
309
|
+
composerState.send();
|
310
|
+
useViewport.getState().scrollToBottom();
|
311
|
+
}, [useComposer, useViewport]);
|
312
|
+
if (disabled) return null;
|
313
|
+
return callback;
|
314
|
+
};
|
315
|
+
|
316
|
+
// src/primitive-hooks/contentPart/useContentPartDisplay.tsx
|
317
|
+
var useContentPartDisplay = () => {
|
318
|
+
const { useContentPart } = useContentPartContext();
|
319
|
+
const display = useContentPart((c) => {
|
320
|
+
if (c.part.type !== "ui")
|
321
|
+
throw new Error(
|
322
|
+
"This component can only be used inside ui content parts."
|
323
|
+
);
|
324
|
+
return c.part.display;
|
325
|
+
});
|
326
|
+
return display;
|
327
|
+
};
|
328
|
+
|
329
|
+
// src/primitive-hooks/contentPart/useContentPartImage.tsx
|
330
|
+
var useContentPartImage = () => {
|
331
|
+
const { useContentPart } = useContentPartContext();
|
332
|
+
const image = useContentPart((c) => {
|
333
|
+
if (c.part.type !== "image")
|
334
|
+
throw new Error(
|
335
|
+
"ContentPartImage can only be used inside image content parts."
|
336
|
+
);
|
337
|
+
return c.part.image;
|
338
|
+
});
|
339
|
+
return image;
|
340
|
+
};
|
341
|
+
|
342
|
+
// src/primitive-hooks/contentPart/useContentPartInProgressIndicator.tsx
|
343
|
+
var useContentPartInProgressIndicator = () => {
|
344
|
+
const { useMessageUtils } = useMessageContext();
|
345
|
+
const { useContentPart } = useContentPartContext();
|
346
|
+
const indicator = useCombinedStore(
|
347
|
+
[useMessageUtils, useContentPart],
|
348
|
+
(m, c) => c.status === "in_progress" ? m.inProgressIndicator : null
|
349
|
+
);
|
350
|
+
return indicator;
|
351
|
+
};
|
352
|
+
|
353
|
+
// src/primitive-hooks/contentPart/useContentPartText.tsx
|
354
|
+
var useContentPartText = () => {
|
355
|
+
const { useContentPart } = useContentPartContext();
|
356
|
+
const text = useContentPart((c) => {
|
357
|
+
if (c.part.type !== "text")
|
358
|
+
throw new Error(
|
359
|
+
"ContentPartText can only be used inside text content parts."
|
360
|
+
);
|
361
|
+
return c.part.text;
|
362
|
+
});
|
363
|
+
return text;
|
364
|
+
};
|
365
|
+
|
366
|
+
// src/primitive-hooks/message/useMessageIf.tsx
|
367
|
+
var useMessageIf = (props) => {
|
368
|
+
const { useMessage, useMessageUtils } = useMessageContext();
|
369
|
+
return useCombinedStore(
|
370
|
+
[useMessage, useMessageUtils],
|
371
|
+
({ message, branches, isLast }, { isCopied, isHovering }) => {
|
372
|
+
if (props.hasBranches === true && branches.length < 2) return false;
|
373
|
+
if (props.user && message.role !== "user") return false;
|
374
|
+
if (props.assistant && message.role !== "assistant") return false;
|
375
|
+
if (props.lastOrHover === true && !isHovering && !isLast) return false;
|
376
|
+
if (props.copied === true && !isCopied) return false;
|
377
|
+
if (props.copied === false && isCopied) return false;
|
378
|
+
return true;
|
379
|
+
}
|
380
|
+
);
|
381
|
+
};
|
382
|
+
|
383
|
+
// src/primitive-hooks/thread/useThreadIf.tsx
|
384
|
+
var useThreadIf = (props) => {
|
385
|
+
const { useThread } = useThreadContext();
|
386
|
+
return useThread((thread) => {
|
387
|
+
if (props.empty === true && thread.messages.length !== 0) return false;
|
388
|
+
if (props.empty === false && thread.messages.length === 0) return false;
|
389
|
+
if (props.running === true && !thread.isRunning) return false;
|
390
|
+
if (props.running === false && thread.isRunning) return false;
|
391
|
+
return true;
|
392
|
+
});
|
393
|
+
};
|
394
|
+
|
395
|
+
// src/primitive-hooks/thread/useThreadEmpty.tsx
|
396
|
+
var useThreadEmpty = () => {
|
397
|
+
return useThreadIf({ empty: true });
|
398
|
+
};
|
399
|
+
|
400
|
+
// src/primitive-hooks/thread/useThreadScrollToBottom.tsx
|
401
|
+
var import_react15 = require("react");
|
402
|
+
var useThreadScrollToBottom = () => {
|
403
|
+
const { useViewport } = useThreadContext();
|
404
|
+
const isAtBottom = useViewport((s) => s.isAtBottom);
|
405
|
+
const handleScrollToBottom = (0, import_react15.useCallback)(() => {
|
406
|
+
const { scrollToBottom } = useViewport.getState();
|
407
|
+
scrollToBottom();
|
408
|
+
}, [useViewport]);
|
409
|
+
if (isAtBottom) return null;
|
410
|
+
return handleScrollToBottom;
|
411
|
+
};
|
412
|
+
|
413
|
+
// src/primitive-hooks/thread/useThreadSuggestion.tsx
|
414
|
+
var import_react16 = require("react");
|
415
|
+
var useThreadSuggestion = ({
|
416
|
+
prompt,
|
417
|
+
autoSend
|
418
|
+
}) => {
|
419
|
+
const { useThread, useComposer } = useThreadContext();
|
420
|
+
const disabled = useThread((t) => t.isRunning);
|
421
|
+
const callback = (0, import_react16.useCallback)(() => {
|
422
|
+
const thread = useThread.getState();
|
423
|
+
const composer = useComposer.getState();
|
424
|
+
composer.setValue(prompt);
|
425
|
+
if (autoSend && !thread.isRunning) {
|
426
|
+
composer.send();
|
427
|
+
}
|
428
|
+
}, [useThread, useComposer, prompt, autoSend]);
|
429
|
+
if (disabled) return null;
|
430
|
+
return callback;
|
431
|
+
};
|
432
|
+
|
203
433
|
// src/primitives/thread/index.ts
|
204
434
|
var thread_exports = {};
|
205
435
|
__export(thread_exports, {
|
@@ -214,159 +444,181 @@ __export(thread_exports, {
|
|
214
444
|
|
215
445
|
// src/primitives/thread/ThreadRoot.tsx
|
216
446
|
var import_react_primitive = require("@radix-ui/react-primitive");
|
217
|
-
var
|
447
|
+
var import_react17 = require("react");
|
218
448
|
var import_jsx_runtime = require("react/jsx-runtime");
|
219
|
-
var ThreadRoot = (0,
|
449
|
+
var ThreadRoot = (0, import_react17.forwardRef)(
|
220
450
|
(props, ref) => {
|
221
451
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_primitive.Primitive.div, { ...props, ref });
|
222
452
|
}
|
223
453
|
);
|
224
454
|
ThreadRoot.displayName = "ThreadRoot";
|
225
455
|
|
226
|
-
// src/primitives/thread/
|
227
|
-
var
|
228
|
-
const
|
229
|
-
return
|
230
|
-
if (props.empty === true && thread.messages.length !== 0) return false;
|
231
|
-
if (props.empty === false && thread.messages.length === 0) return false;
|
232
|
-
if (props.running === true && !thread.isRunning) return false;
|
233
|
-
if (props.running === false && thread.isRunning) return false;
|
234
|
-
return true;
|
235
|
-
});
|
456
|
+
// src/primitives/thread/ThreadEmpty.tsx
|
457
|
+
var ThreadEmpty = ({ children }) => {
|
458
|
+
const empty = useThreadEmpty();
|
459
|
+
return empty ? children : null;
|
236
460
|
};
|
461
|
+
|
462
|
+
// src/primitives/thread/ThreadIf.tsx
|
237
463
|
var ThreadIf = ({ children, ...query }) => {
|
238
464
|
const result = useThreadIf(query);
|
239
465
|
return result ? children : null;
|
240
466
|
};
|
241
467
|
|
242
|
-
// src/primitives/thread/ThreadEmpty.tsx
|
243
|
-
var import_jsx_runtime2 = require("react/jsx-runtime");
|
244
|
-
var ThreadEmpty = ({ children }) => {
|
245
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ThreadIf, { empty: true, children });
|
246
|
-
};
|
247
|
-
|
248
468
|
// src/primitives/thread/ThreadViewport.tsx
|
249
|
-
var
|
250
|
-
var import_react_compose_refs = require("@radix-ui/react-compose-refs");
|
469
|
+
var import_react_compose_refs2 = require("@radix-ui/react-compose-refs");
|
251
470
|
var import_react_primitive2 = require("@radix-ui/react-primitive");
|
252
|
-
var
|
471
|
+
var import_react22 = require("react");
|
472
|
+
|
473
|
+
// src/primitive-hooks/thread/useThreadViewportAutoScroll.tsx
|
474
|
+
var import_react_compose_refs = require("@radix-ui/react-compose-refs");
|
475
|
+
var import_react21 = require("react");
|
253
476
|
|
254
477
|
// src/utils/hooks/useOnResizeContent.tsx
|
255
478
|
var import_react_use_callback_ref = require("@radix-ui/react-use-callback-ref");
|
256
|
-
var
|
257
|
-
|
479
|
+
var import_react19 = require("react");
|
480
|
+
|
481
|
+
// src/utils/hooks/useManagedRef.ts
|
482
|
+
var import_react18 = require("react");
|
483
|
+
var useManagedRef = (callback) => {
|
484
|
+
const cleanupRef = (0, import_react18.useRef)();
|
485
|
+
const ref = (0, import_react18.useCallback)(
|
486
|
+
(el) => {
|
487
|
+
if (cleanupRef.current) {
|
488
|
+
cleanupRef.current();
|
489
|
+
}
|
490
|
+
if (el) {
|
491
|
+
cleanupRef.current = callback(el);
|
492
|
+
}
|
493
|
+
},
|
494
|
+
[callback]
|
495
|
+
);
|
496
|
+
return ref;
|
497
|
+
};
|
498
|
+
|
499
|
+
// src/utils/hooks/useOnResizeContent.tsx
|
500
|
+
var useOnResizeContent = (callback) => {
|
258
501
|
const callbackRef = (0, import_react_use_callback_ref.useCallbackRef)(callback);
|
259
|
-
const
|
260
|
-
|
261
|
-
|
262
|
-
|
263
|
-
|
264
|
-
|
265
|
-
|
266
|
-
|
267
|
-
|
268
|
-
|
269
|
-
|
502
|
+
const refCallback = (0, import_react19.useCallback)(
|
503
|
+
(el) => {
|
504
|
+
const resizeObserver = new ResizeObserver(() => {
|
505
|
+
callbackRef();
|
506
|
+
});
|
507
|
+
const mutationObserver = new MutationObserver((mutations) => {
|
508
|
+
for (const mutation of mutations) {
|
509
|
+
for (const node of mutation.addedNodes) {
|
510
|
+
if (node instanceof Element) {
|
511
|
+
resizeObserver.observe(node);
|
512
|
+
}
|
270
513
|
}
|
271
|
-
|
272
|
-
|
273
|
-
|
274
|
-
|
514
|
+
for (const node of mutation.removedNodes) {
|
515
|
+
if (node instanceof Element) {
|
516
|
+
resizeObserver.unobserve(node);
|
517
|
+
}
|
275
518
|
}
|
276
519
|
}
|
520
|
+
callbackRef();
|
521
|
+
});
|
522
|
+
resizeObserver.observe(el);
|
523
|
+
mutationObserver.observe(el, { childList: true });
|
524
|
+
for (const child of el.children) {
|
525
|
+
resizeObserver.observe(child);
|
277
526
|
}
|
278
|
-
|
279
|
-
|
280
|
-
|
281
|
-
|
282
|
-
|
283
|
-
|
284
|
-
|
285
|
-
|
286
|
-
resizeObserver.disconnect();
|
287
|
-
mutationObserver.disconnect();
|
288
|
-
};
|
289
|
-
}, [el, callbackRef]);
|
527
|
+
return () => {
|
528
|
+
resizeObserver.disconnect();
|
529
|
+
mutationObserver.disconnect();
|
530
|
+
};
|
531
|
+
},
|
532
|
+
[callbackRef]
|
533
|
+
);
|
534
|
+
return useManagedRef(refCallback);
|
290
535
|
};
|
291
536
|
|
292
537
|
// src/utils/hooks/useOnScrollToBottom.tsx
|
293
538
|
var import_react_use_callback_ref2 = require("@radix-ui/react-use-callback-ref");
|
294
|
-
var
|
539
|
+
var import_react20 = require("react");
|
295
540
|
var useOnScrollToBottom = (callback) => {
|
296
541
|
const callbackRef = (0, import_react_use_callback_ref2.useCallbackRef)(callback);
|
297
542
|
const { useViewport } = useThreadContext();
|
298
|
-
(0,
|
543
|
+
(0, import_react20.useEffect)(() => {
|
299
544
|
return useViewport.getState().onScrollToBottom(() => {
|
300
545
|
callbackRef();
|
301
546
|
});
|
302
547
|
}, [useViewport, callbackRef]);
|
303
548
|
};
|
304
549
|
|
305
|
-
// src/
|
306
|
-
var
|
307
|
-
|
308
|
-
|
309
|
-
const divRef = (0,
|
310
|
-
const ref = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, divRef);
|
550
|
+
// src/primitive-hooks/thread/useThreadViewportAutoScroll.tsx
|
551
|
+
var useThreadViewportAutoScroll = ({
|
552
|
+
autoScroll = true
|
553
|
+
}) => {
|
554
|
+
const divRef = (0, import_react21.useRef)(null);
|
311
555
|
const { useViewport } = useThreadContext();
|
312
|
-
const firstRenderRef = (0,
|
313
|
-
const
|
314
|
-
const
|
556
|
+
const firstRenderRef = (0, import_react21.useRef)(true);
|
557
|
+
const lastScrollTop = (0, import_react21.useRef)(0);
|
558
|
+
const isScrollingToBottomRef = (0, import_react21.useRef)(false);
|
315
559
|
const scrollToBottom = () => {
|
316
|
-
const div =
|
560
|
+
const div = divRef.current;
|
317
561
|
if (!div || !autoScroll) return;
|
318
562
|
const behavior = firstRenderRef.current ? "instant" : "auto";
|
319
563
|
firstRenderRef.current = false;
|
320
564
|
isScrollingToBottomRef.current = true;
|
321
|
-
div.
|
565
|
+
div.scrollTo({ top: div.scrollHeight, behavior });
|
322
566
|
};
|
323
|
-
useOnResizeContent(divRef, () => {
|
324
|
-
if (!isScrollingToBottomRef.current && !useViewport.getState().isAtBottom) {
|
325
|
-
handleScroll();
|
326
|
-
} else {
|
327
|
-
scrollToBottom();
|
328
|
-
}
|
329
|
-
});
|
330
|
-
useOnScrollToBottom(() => {
|
331
|
-
scrollToBottom();
|
332
|
-
});
|
333
567
|
const handleScroll = () => {
|
334
568
|
const div = divRef.current;
|
335
569
|
if (!div) return;
|
336
570
|
const isAtBottom = useViewport.getState().isAtBottom;
|
337
571
|
const newIsAtBottom = div.scrollHeight - div.scrollTop <= div.clientHeight;
|
338
572
|
if (!newIsAtBottom && lastScrollTop.current < div.scrollTop) {
|
339
|
-
} else
|
340
|
-
isScrollingToBottomRef.current =
|
341
|
-
|
342
|
-
|
343
|
-
|
573
|
+
} else {
|
574
|
+
isScrollingToBottomRef.current = newIsAtBottom;
|
575
|
+
if (newIsAtBottom !== isAtBottom) {
|
576
|
+
useViewport.setState({
|
577
|
+
isAtBottom: newIsAtBottom
|
578
|
+
});
|
579
|
+
}
|
344
580
|
}
|
345
581
|
lastScrollTop.current = div.scrollTop;
|
346
582
|
};
|
347
|
-
|
348
|
-
|
349
|
-
|
350
|
-
|
351
|
-
|
352
|
-
ref,
|
353
|
-
children: [
|
354
|
-
children,
|
355
|
-
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { ref: messagesEndRef })
|
356
|
-
]
|
583
|
+
const resizeRef = useOnResizeContent(() => {
|
584
|
+
if (!isScrollingToBottomRef.current && !useViewport.getState().isAtBottom && !firstRenderRef.current) {
|
585
|
+
handleScroll();
|
586
|
+
} else {
|
587
|
+
scrollToBottom();
|
357
588
|
}
|
358
|
-
);
|
589
|
+
});
|
590
|
+
const scrollRef = useManagedRef((el) => {
|
591
|
+
el.addEventListener("scroll", handleScroll);
|
592
|
+
return () => {
|
593
|
+
el.removeEventListener("scroll", handleScroll);
|
594
|
+
};
|
595
|
+
});
|
596
|
+
const autoScrollRef = (0, import_react_compose_refs.useComposedRefs)(resizeRef, scrollRef, divRef);
|
597
|
+
useOnScrollToBottom(() => {
|
598
|
+
scrollToBottom();
|
599
|
+
});
|
600
|
+
return autoScrollRef;
|
601
|
+
};
|
602
|
+
|
603
|
+
// src/primitives/thread/ThreadViewport.tsx
|
604
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
605
|
+
var ThreadViewport = (0, import_react22.forwardRef)(({ autoScroll, onScroll, children, ...rest }, forwardedRef) => {
|
606
|
+
const autoScrollRef = useThreadViewportAutoScroll({
|
607
|
+
autoScroll
|
608
|
+
});
|
609
|
+
const ref = (0, import_react_compose_refs2.useComposedRefs)(forwardedRef, autoScrollRef);
|
610
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_primitive2.Primitive.div, { ...rest, ref, children });
|
359
611
|
});
|
360
612
|
ThreadViewport.displayName = "ThreadViewport";
|
361
613
|
|
362
614
|
// src/primitives/thread/ThreadMessages.tsx
|
363
|
-
var
|
615
|
+
var import_react24 = require("react");
|
364
616
|
|
365
617
|
// src/context/providers/MessageProvider.tsx
|
366
|
-
var
|
618
|
+
var import_react23 = require("react");
|
367
619
|
var import_zustand3 = require("zustand");
|
368
620
|
|
369
|
-
// src/context/stores/
|
621
|
+
// src/context/stores/EditComposer.ts
|
370
622
|
var import_zustand = require("zustand");
|
371
623
|
|
372
624
|
// src/context/stores/BaseComposer.ts
|
@@ -377,7 +629,7 @@ var makeBaseComposer = (set) => ({
|
|
377
629
|
}
|
378
630
|
});
|
379
631
|
|
380
|
-
// src/context/stores/
|
632
|
+
// src/context/stores/EditComposer.ts
|
381
633
|
var makeEditComposerStore = ({
|
382
634
|
onEdit,
|
383
635
|
onSend
|
@@ -418,7 +670,7 @@ var makeMessageUtilsStore = () => (0, import_zustand2.create)((set) => ({
|
|
418
670
|
}));
|
419
671
|
|
420
672
|
// src/context/providers/MessageProvider.tsx
|
421
|
-
var
|
673
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
422
674
|
var getIsLast = (thread, message) => {
|
423
675
|
return thread.messages[thread.messages.length - 1]?.id === message.id;
|
424
676
|
};
|
@@ -440,10 +692,10 @@ var syncMessage = (thread, getBranches, useMessage, messageIndex) => {
|
|
440
692
|
};
|
441
693
|
var useMessageContext2 = (messageIndex) => {
|
442
694
|
const { useThread, useThreadActions } = useThreadContext();
|
443
|
-
const [context] = (0,
|
695
|
+
const [context] = (0, import_react23.useState)(() => {
|
444
696
|
const useMessage = (0, import_zustand3.create)(() => ({}));
|
445
697
|
const useMessageUtils = makeMessageUtilsStore();
|
446
|
-
const
|
698
|
+
const useEditComposer = makeEditComposerStore({
|
447
699
|
onEdit: () => {
|
448
700
|
const message = useMessage.getState().message;
|
449
701
|
if (message.role !== "user")
|
@@ -464,6 +716,7 @@ var useMessageContext2 = (messageIndex) => {
|
|
464
716
|
);
|
465
717
|
useThreadActions.getState().append({
|
466
718
|
parentId,
|
719
|
+
role: "user",
|
467
720
|
content: [{ type: "text", text }, ...nonTextParts]
|
468
721
|
});
|
469
722
|
}
|
@@ -474,9 +727,9 @@ var useMessageContext2 = (messageIndex) => {
|
|
474
727
|
useMessage,
|
475
728
|
messageIndex
|
476
729
|
);
|
477
|
-
return { useMessage, useMessageUtils,
|
730
|
+
return { useMessage, useMessageUtils, useEditComposer };
|
478
731
|
});
|
479
|
-
(0,
|
732
|
+
(0, import_react23.useEffect)(() => {
|
480
733
|
return useThread.subscribe((thread) => {
|
481
734
|
syncMessage(
|
482
735
|
thread,
|
@@ -485,68 +738,31 @@ var useMessageContext2 = (messageIndex) => {
|
|
485
738
|
messageIndex
|
486
739
|
);
|
487
740
|
});
|
488
|
-
}, [useThread, useThreadActions, context, messageIndex]);
|
489
|
-
return context;
|
490
|
-
};
|
491
|
-
var MessageProvider = ({
|
492
|
-
messageIndex,
|
493
|
-
children
|
494
|
-
}) => {
|
495
|
-
const context = useMessageContext2(messageIndex);
|
496
|
-
return /* @__PURE__ */ (0,
|
497
|
-
};
|
498
|
-
|
499
|
-
// src/context/ComposerContext.ts
|
500
|
-
var import_react15 = require("react");
|
501
|
-
var useComposerContext = () => {
|
502
|
-
const { useComposer } = useThreadContext();
|
503
|
-
const { useComposer: useEditComposer } = (0, import_react15.useContext)(MessageContext) ?? {};
|
504
|
-
return (0, import_react15.useMemo)(
|
505
|
-
() => ({
|
506
|
-
useComposer: useEditComposer ?? useComposer,
|
507
|
-
type: useEditComposer ? "edit" : "new"
|
508
|
-
}),
|
509
|
-
[useEditComposer, useComposer]
|
510
|
-
);
|
741
|
+
}, [useThread, useThreadActions, context, messageIndex]);
|
742
|
+
return context;
|
743
|
+
};
|
744
|
+
var MessageProvider = ({
|
745
|
+
messageIndex,
|
746
|
+
children
|
747
|
+
}) => {
|
748
|
+
const context = useMessageContext2(messageIndex);
|
749
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(MessageContext.Provider, { value: context, children });
|
511
750
|
};
|
512
751
|
|
513
752
|
// src/primitives/composer/ComposerIf.tsx
|
514
|
-
var useComposerIf = (props) => {
|
515
|
-
const { useComposer } = useComposerContext();
|
516
|
-
return useComposer((composer) => {
|
517
|
-
if (props.editing === true && !composer.isEditing) return false;
|
518
|
-
if (props.editing === false && composer.isEditing) return false;
|
519
|
-
return true;
|
520
|
-
});
|
521
|
-
};
|
522
753
|
var ComposerIf = ({ children, ...query }) => {
|
523
754
|
const result = useComposerIf(query);
|
524
755
|
return result ? children : null;
|
525
756
|
};
|
526
757
|
|
527
758
|
// src/primitives/message/MessageIf.tsx
|
528
|
-
var useMessageIf = (props) => {
|
529
|
-
const { useMessage, useMessageUtils } = useMessageContext();
|
530
|
-
return useCombinedStore(
|
531
|
-
[useMessage, useMessageUtils],
|
532
|
-
({ message, branches, isLast }, { isCopied, isHovering }) => {
|
533
|
-
if (props.hasBranches === true && branches.length < 2) return false;
|
534
|
-
if (props.user && message.role !== "user") return false;
|
535
|
-
if (props.assistant && message.role !== "assistant") return false;
|
536
|
-
if (props.lastOrHover === true && !isHovering && !isLast) return false;
|
537
|
-
if (props.copied === true && !isCopied) return false;
|
538
|
-
if (props.copied === false && isCopied) return false;
|
539
|
-
return true;
|
540
|
-
}
|
541
|
-
);
|
542
|
-
};
|
543
759
|
var MessageIf = ({ children, ...query }) => {
|
544
760
|
const result = useMessageIf(query);
|
545
761
|
return result ? children : null;
|
546
762
|
};
|
547
763
|
|
548
764
|
// src/primitives/thread/ThreadMessages.tsx
|
549
|
-
var
|
765
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
550
766
|
var getComponents = (components) => {
|
551
767
|
return {
|
552
768
|
EditComposer: components.EditComposer ?? components.UserMessage ?? components.Message,
|
@@ -559,15 +775,15 @@ var ThreadMessageImpl = ({
|
|
559
775
|
components
|
560
776
|
}) => {
|
561
777
|
const { UserMessage, EditComposer, AssistantMessage } = getComponents(components);
|
562
|
-
return /* @__PURE__ */ (0,
|
563
|
-
/* @__PURE__ */ (0,
|
564
|
-
/* @__PURE__ */ (0,
|
565
|
-
/* @__PURE__ */ (0,
|
778
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(MessageProvider, { messageIndex, children: [
|
779
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(MessageIf, { user: true, children: [
|
780
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ComposerIf, { editing: false, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(UserMessage, {}) }),
|
781
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ComposerIf, { editing: true, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(EditComposer, {}) })
|
566
782
|
] }),
|
567
|
-
/* @__PURE__ */ (0,
|
783
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(MessageIf, { assistant: true, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AssistantMessage, {}) })
|
568
784
|
] });
|
569
785
|
};
|
570
|
-
var ThreadMessage = (0,
|
786
|
+
var ThreadMessage = (0, import_react24.memo)(
|
571
787
|
ThreadMessageImpl,
|
572
788
|
(prev, next) => prev.messageIndex === next.messageIndex && prev.components.UserMessage === next.components.UserMessage && prev.components.EditComposer === next.components.EditComposer && prev.components.AssistantMessage === next.components.AssistantMessage
|
573
789
|
);
|
@@ -577,7 +793,7 @@ var ThreadMessages = ({ components }) => {
|
|
577
793
|
if (messagesLength === 0) return null;
|
578
794
|
return new Array(messagesLength).fill(null).map((_, idx) => {
|
579
795
|
const messageIndex = idx;
|
580
|
-
return /* @__PURE__ */ (0,
|
796
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
581
797
|
ThreadMessage,
|
582
798
|
{
|
583
799
|
messageIndex,
|
@@ -588,56 +804,42 @@ var ThreadMessages = ({ components }) => {
|
|
588
804
|
});
|
589
805
|
};
|
590
806
|
|
591
|
-
// src/
|
592
|
-
var
|
807
|
+
// src/utils/createActionButton.tsx
|
808
|
+
var import_primitive = require("@radix-ui/primitive");
|
593
809
|
var import_react_primitive3 = require("@radix-ui/react-primitive");
|
594
|
-
var
|
595
|
-
var
|
596
|
-
var
|
597
|
-
const
|
598
|
-
|
599
|
-
|
600
|
-
|
601
|
-
|
602
|
-
|
603
|
-
|
604
|
-
|
605
|
-
|
606
|
-
|
607
|
-
|
608
|
-
|
609
|
-
|
610
|
-
|
611
|
-
});
|
612
|
-
|
810
|
+
var import_react25 = require("react");
|
811
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
812
|
+
var createActionButton = (displayName, useActionButton) => {
|
813
|
+
const ActionButton = (0, import_react25.forwardRef)((props, forwardedRef) => {
|
814
|
+
const callback = useActionButton(props);
|
815
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
816
|
+
import_react_primitive3.Primitive.button,
|
817
|
+
{
|
818
|
+
type: "button",
|
819
|
+
disabled: !callback,
|
820
|
+
...props,
|
821
|
+
ref: forwardedRef,
|
822
|
+
onClick: (0, import_primitive.composeEventHandlers)(props.onClick, () => {
|
823
|
+
callback?.();
|
824
|
+
})
|
825
|
+
}
|
826
|
+
);
|
827
|
+
});
|
828
|
+
ActionButton.displayName = displayName;
|
829
|
+
return ActionButton;
|
830
|
+
};
|
831
|
+
|
832
|
+
// src/primitives/thread/ThreadScrollToBottom.tsx
|
833
|
+
var ThreadScrollToBottom = createActionButton(
|
834
|
+
"ThreadScrollToBottom",
|
835
|
+
useThreadScrollToBottom
|
836
|
+
);
|
613
837
|
|
614
838
|
// src/primitives/thread/ThreadSuggestion.tsx
|
615
|
-
var
|
616
|
-
|
617
|
-
|
618
|
-
|
619
|
-
var ThreadSuggestion = (0, import_react18.forwardRef)(({ onClick, prompt, method, autoSend: send, ...rest }, ref) => {
|
620
|
-
const { useThread, useComposer } = useThreadContext();
|
621
|
-
const isDisabled = useThread((t) => t.isRunning);
|
622
|
-
const handleApplySuggestion = () => {
|
623
|
-
const thread = useThread.getState();
|
624
|
-
const composer = useComposer.getState();
|
625
|
-
composer.setValue(prompt);
|
626
|
-
if (send && !thread.isRunning) {
|
627
|
-
composer.send();
|
628
|
-
}
|
629
|
-
};
|
630
|
-
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
631
|
-
import_react_primitive4.Primitive.button,
|
632
|
-
{
|
633
|
-
...rest,
|
634
|
-
disabled: isDisabled,
|
635
|
-
ref,
|
636
|
-
onClick: (0, import_primitive3.composeEventHandlers)(onClick, handleApplySuggestion)
|
637
|
-
}
|
638
|
-
);
|
639
|
-
});
|
640
|
-
ThreadSuggestion.displayName = "ThreadSuggestion";
|
839
|
+
var ThreadSuggestion = createActionButton(
|
840
|
+
"ThreadSuggestion",
|
841
|
+
useThreadSuggestion
|
842
|
+
);
|
641
843
|
|
642
844
|
// src/primitives/composer/index.ts
|
643
845
|
var composer_exports = {};
|
@@ -650,30 +852,24 @@ __export(composer_exports, {
|
|
650
852
|
});
|
651
853
|
|
652
854
|
// src/primitives/composer/ComposerRoot.tsx
|
653
|
-
var
|
654
|
-
var
|
655
|
-
var
|
656
|
-
var
|
657
|
-
var
|
658
|
-
var ComposerRoot = (0, import_react19.forwardRef)(
|
855
|
+
var import_primitive2 = require("@radix-ui/primitive");
|
856
|
+
var import_react_primitive4 = require("@radix-ui/react-primitive");
|
857
|
+
var import_react26 = require("react");
|
858
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
859
|
+
var ComposerRoot = (0, import_react26.forwardRef)(
|
659
860
|
({ onSubmit, ...rest }, forwardedRef) => {
|
660
|
-
const
|
661
|
-
const { useComposer } = useComposerContext();
|
662
|
-
const formRef = (0, import_react19.useRef)(null);
|
663
|
-
const ref = (0, import_react_compose_refs2.useComposedRefs)(forwardedRef, formRef);
|
861
|
+
const send = useComposerSend();
|
664
862
|
const handleSubmit = (e) => {
|
665
|
-
|
666
|
-
if (!composerState.isEditing) return;
|
863
|
+
if (!send) return;
|
667
864
|
e.preventDefault();
|
668
|
-
|
669
|
-
useViewport.getState().scrollToBottom();
|
865
|
+
send();
|
670
866
|
};
|
671
|
-
return /* @__PURE__ */ (0,
|
672
|
-
|
867
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
868
|
+
import_react_primitive4.Primitive.form,
|
673
869
|
{
|
674
870
|
...rest,
|
675
|
-
ref,
|
676
|
-
onSubmit: (0,
|
871
|
+
ref: forwardedRef,
|
872
|
+
onSubmit: (0, import_primitive2.composeEventHandlers)(onSubmit, handleSubmit)
|
677
873
|
}
|
678
874
|
);
|
679
875
|
}
|
@@ -681,13 +877,14 @@ var ComposerRoot = (0, import_react19.forwardRef)(
|
|
681
877
|
ComposerRoot.displayName = "ComposerRoot";
|
682
878
|
|
683
879
|
// src/primitives/composer/ComposerInput.tsx
|
684
|
-
var
|
880
|
+
var import_primitive3 = require("@radix-ui/primitive");
|
685
881
|
var import_react_compose_refs3 = require("@radix-ui/react-compose-refs");
|
686
882
|
var import_react_slot = require("@radix-ui/react-slot");
|
687
|
-
var
|
883
|
+
var import_react27 = require("react");
|
688
884
|
var import_react_textarea_autosize = __toESM(require("react-textarea-autosize"));
|
689
|
-
var
|
690
|
-
var
|
885
|
+
var import_react_use_escape_keydown = require("@radix-ui/react-use-escape-keydown");
|
886
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
887
|
+
var ComposerInput = (0, import_react27.forwardRef)(
|
691
888
|
({ autoFocus = false, asChild, disabled, onChange, onKeyDown, ...rest }, forwardedRef) => {
|
692
889
|
const { useThread } = useThreadContext();
|
693
890
|
const { useComposer, type } = useComposerContext();
|
@@ -696,16 +893,17 @@ var ComposerInput = (0, import_react20.forwardRef)(
|
|
696
893
|
return c.value;
|
697
894
|
});
|
698
895
|
const Component = asChild ? import_react_slot.Slot : import_react_textarea_autosize.default;
|
699
|
-
const textareaRef = (0,
|
896
|
+
const textareaRef = (0, import_react27.useRef)(null);
|
700
897
|
const ref = (0, import_react_compose_refs3.useComposedRefs)(forwardedRef, textareaRef);
|
898
|
+
(0, import_react_use_escape_keydown.useEscapeKeydown)((e) => {
|
899
|
+
const composer = useComposer.getState();
|
900
|
+
if (composer.cancel()) {
|
901
|
+
e.preventDefault();
|
902
|
+
}
|
903
|
+
});
|
701
904
|
const handleKeyPress = (e) => {
|
702
905
|
if (disabled) return;
|
703
|
-
if (e.key === "
|
704
|
-
const composer = useComposer.getState();
|
705
|
-
if (composer.cancel()) {
|
706
|
-
e.preventDefault();
|
707
|
-
}
|
708
|
-
} else if (e.key === "Enter" && e.shiftKey === false) {
|
906
|
+
if (e.key === "Enter" && e.shiftKey === false) {
|
709
907
|
const isRunning = useThread.getState().isRunning;
|
710
908
|
if (!isRunning) {
|
711
909
|
e.preventDefault();
|
@@ -714,23 +912,22 @@ var ComposerInput = (0, import_react20.forwardRef)(
|
|
714
912
|
}
|
715
913
|
};
|
716
914
|
const autoFocusEnabled = autoFocus && !disabled;
|
717
|
-
const focus = (0,
|
915
|
+
const focus = (0, import_react27.useCallback)(() => {
|
718
916
|
const textarea = textareaRef.current;
|
719
917
|
if (!textarea || !autoFocusEnabled) return;
|
720
|
-
console.log("focus");
|
721
918
|
textarea.focus();
|
722
919
|
textarea.setSelectionRange(
|
723
920
|
textareaRef.current.value.length,
|
724
921
|
textareaRef.current.value.length
|
725
922
|
);
|
726
923
|
}, [autoFocusEnabled]);
|
727
|
-
(0,
|
924
|
+
(0, import_react27.useEffect)(() => focus(), [focus]);
|
728
925
|
useOnScrollToBottom(() => {
|
729
926
|
if (type === "new") {
|
730
927
|
focus();
|
731
928
|
}
|
732
929
|
});
|
733
|
-
return /* @__PURE__ */ (0,
|
930
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
734
931
|
Component,
|
735
932
|
{
|
736
933
|
value,
|
@@ -738,12 +935,12 @@ var ComposerInput = (0, import_react20.forwardRef)(
|
|
738
935
|
ref,
|
739
936
|
autoFocus,
|
740
937
|
disabled,
|
741
|
-
onChange: (0,
|
938
|
+
onChange: (0, import_primitive3.composeEventHandlers)(onChange, (e) => {
|
742
939
|
const composerState = useComposer.getState();
|
743
940
|
if (!composerState.isEditing) return;
|
744
941
|
return composerState.setValue(e.target.value);
|
745
942
|
}),
|
746
|
-
onKeyDown: (0,
|
943
|
+
onKeyDown: (0, import_primitive3.composeEventHandlers)(onKeyDown, handleKeyPress)
|
747
944
|
}
|
748
945
|
);
|
749
946
|
}
|
@@ -751,15 +948,15 @@ var ComposerInput = (0, import_react20.forwardRef)(
|
|
751
948
|
ComposerInput.displayName = "ComposerInput";
|
752
949
|
|
753
950
|
// src/primitives/composer/ComposerSend.tsx
|
754
|
-
var
|
755
|
-
var
|
756
|
-
var
|
757
|
-
var ComposerSend = (0,
|
951
|
+
var import_react28 = require("react");
|
952
|
+
var import_react_primitive5 = require("@radix-ui/react-primitive");
|
953
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
954
|
+
var ComposerSend = (0, import_react28.forwardRef)(
|
758
955
|
({ disabled, ...rest }, ref) => {
|
759
956
|
const { useComposer } = useComposerContext();
|
760
957
|
const hasValue = useComposer((c) => c.isEditing && c.value.length > 0);
|
761
|
-
return /* @__PURE__ */ (0,
|
762
|
-
|
958
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
959
|
+
import_react_primitive5.Primitive.button,
|
763
960
|
{
|
764
961
|
type: "submit",
|
765
962
|
...rest,
|
@@ -772,26 +969,10 @@ var ComposerSend = (0, import_react21.forwardRef)(
|
|
772
969
|
ComposerSend.displayName = "ComposerSend";
|
773
970
|
|
774
971
|
// src/primitives/composer/ComposerCancel.tsx
|
775
|
-
var
|
776
|
-
|
777
|
-
|
778
|
-
|
779
|
-
var ComposerCancel = (0, import_react22.forwardRef)(({ onClick, ...rest }, ref) => {
|
780
|
-
const { useComposer } = useComposerContext();
|
781
|
-
const handleCancel = () => {
|
782
|
-
useComposer.getState().cancel();
|
783
|
-
};
|
784
|
-
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
785
|
-
import_react_primitive7.Primitive.button,
|
786
|
-
{
|
787
|
-
type: "button",
|
788
|
-
...rest,
|
789
|
-
ref,
|
790
|
-
onClick: (0, import_primitive6.composeEventHandlers)(onClick, handleCancel)
|
791
|
-
}
|
792
|
-
);
|
793
|
-
});
|
794
|
-
ComposerCancel.displayName = "ComposerCancel";
|
972
|
+
var ComposerCancel = createActionButton(
|
973
|
+
"ComposerCancel",
|
974
|
+
useComposerCancel
|
975
|
+
);
|
795
976
|
|
796
977
|
// src/primitives/message/index.ts
|
797
978
|
var message_exports = {};
|
@@ -803,11 +984,11 @@ __export(message_exports, {
|
|
803
984
|
});
|
804
985
|
|
805
986
|
// src/primitives/message/MessageRoot.tsx
|
806
|
-
var
|
807
|
-
var
|
808
|
-
var
|
809
|
-
var
|
810
|
-
var MessageRoot = (0,
|
987
|
+
var import_primitive4 = require("@radix-ui/primitive");
|
988
|
+
var import_react_primitive6 = require("@radix-ui/react-primitive");
|
989
|
+
var import_react29 = require("react");
|
990
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
991
|
+
var MessageRoot = (0, import_react29.forwardRef)(
|
811
992
|
({ onMouseEnter, onMouseLeave, ...rest }, ref) => {
|
812
993
|
const { useMessageUtils } = useMessageContext();
|
813
994
|
const setIsHovering = useMessageUtils((s) => s.setIsHovering);
|
@@ -817,13 +998,13 @@ var MessageRoot = (0, import_react23.forwardRef)(
|
|
817
998
|
const handleMouseLeave = () => {
|
818
999
|
setIsHovering(false);
|
819
1000
|
};
|
820
|
-
return /* @__PURE__ */ (0,
|
821
|
-
|
1001
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
1002
|
+
import_react_primitive6.Primitive.div,
|
822
1003
|
{
|
823
1004
|
...rest,
|
824
1005
|
ref,
|
825
|
-
onMouseEnter: (0,
|
826
|
-
onMouseLeave: (0,
|
1006
|
+
onMouseEnter: (0, import_primitive4.composeEventHandlers)(onMouseEnter, handleMouseEnter),
|
1007
|
+
onMouseLeave: (0, import_primitive4.composeEventHandlers)(onMouseLeave, handleMouseLeave)
|
827
1008
|
}
|
828
1009
|
);
|
829
1010
|
}
|
@@ -831,40 +1012,12 @@ var MessageRoot = (0, import_react23.forwardRef)(
|
|
831
1012
|
MessageRoot.displayName = "MessageRoot";
|
832
1013
|
|
833
1014
|
// src/primitives/message/MessageContent.tsx
|
834
|
-
var
|
835
|
-
|
836
|
-
// src/context/AssistantContext.ts
|
837
|
-
var import_react24 = require("react");
|
838
|
-
var AssistantContext = (0, import_react24.createContext)(
|
839
|
-
null
|
840
|
-
);
|
841
|
-
var useAssistantContext = () => {
|
842
|
-
const context = (0, import_react24.useContext)(AssistantContext);
|
843
|
-
if (!context)
|
844
|
-
throw new Error(
|
845
|
-
"This component must be used within an AssistantRuntimeProvider."
|
846
|
-
);
|
847
|
-
return context;
|
848
|
-
};
|
849
|
-
|
850
|
-
// src/context/ContentPartContext.ts
|
851
|
-
var import_react25 = require("react");
|
852
|
-
var ContentPartContext = (0, import_react25.createContext)(
|
853
|
-
null
|
854
|
-
);
|
855
|
-
var useContentPartContext = () => {
|
856
|
-
const context = (0, import_react25.useContext)(ContentPartContext);
|
857
|
-
if (!context)
|
858
|
-
throw new Error(
|
859
|
-
"This component can only be used inside a component passed to <MessagePrimitive.Content components={...} >."
|
860
|
-
);
|
861
|
-
return context;
|
862
|
-
};
|
1015
|
+
var import_react32 = require("react");
|
863
1016
|
|
864
1017
|
// src/context/providers/ContentPartProvider.tsx
|
865
|
-
var
|
1018
|
+
var import_react30 = require("react");
|
866
1019
|
var import_zustand4 = require("zustand");
|
867
|
-
var
|
1020
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
868
1021
|
var syncContentPart = ({ message }, useContentPart, partIndex) => {
|
869
1022
|
const part = message.content[partIndex];
|
870
1023
|
if (!part) return;
|
@@ -881,14 +1034,14 @@ var syncContentPart = ({ message }, useContentPart, partIndex) => {
|
|
881
1034
|
};
|
882
1035
|
var useContentPartContext2 = (partIndex) => {
|
883
1036
|
const { useMessage } = useMessageContext();
|
884
|
-
const [context] = (0,
|
1037
|
+
const [context] = (0, import_react30.useState)(() => {
|
885
1038
|
const useContentPart = (0, import_zustand4.create)(
|
886
1039
|
() => ({})
|
887
1040
|
);
|
888
1041
|
syncContentPart(useMessage.getState(), useContentPart, partIndex);
|
889
1042
|
return { useContentPart };
|
890
1043
|
});
|
891
|
-
(0,
|
1044
|
+
(0, import_react30.useEffect)(() => {
|
892
1045
|
syncContentPart(useMessage.getState(), context.useContentPart, partIndex);
|
893
1046
|
return useMessage.subscribe((message) => {
|
894
1047
|
syncContentPart(message, context.useContentPart, partIndex);
|
@@ -901,65 +1054,46 @@ var ContentPartProvider = ({
|
|
901
1054
|
children
|
902
1055
|
}) => {
|
903
1056
|
const context = useContentPartContext2(partIndex);
|
904
|
-
return /* @__PURE__ */ (0,
|
1057
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ContentPartContext.Provider, { value: context, children });
|
905
1058
|
};
|
906
1059
|
|
907
1060
|
// src/primitives/contentPart/ContentPartDisplay.tsx
|
908
1061
|
var ContentPartDisplay = () => {
|
909
|
-
const
|
910
|
-
const display = useContentPart((c) => {
|
911
|
-
if (c.part.type !== "ui")
|
912
|
-
throw new Error(
|
913
|
-
"ContentPartDisplay can only be used inside ui content parts."
|
914
|
-
);
|
915
|
-
return c.part.display;
|
916
|
-
});
|
1062
|
+
const display = useContentPartDisplay();
|
917
1063
|
return display ?? null;
|
918
1064
|
};
|
919
1065
|
|
920
1066
|
// src/primitives/contentPart/ContentPartInProgressIndicator.tsx
|
921
1067
|
var ContentPartInProgressIndicator = () => {
|
922
|
-
const
|
923
|
-
const { useContentPart } = useContentPartContext();
|
924
|
-
const indicator = useCombinedStore(
|
925
|
-
[useMessageUtils, useContentPart],
|
926
|
-
(m, c) => c.status === "in_progress" ? m.inProgressIndicator : null
|
927
|
-
);
|
1068
|
+
const indicator = useContentPartInProgressIndicator();
|
928
1069
|
return indicator;
|
929
1070
|
};
|
930
1071
|
|
931
1072
|
// src/primitives/contentPart/ContentPartText.tsx
|
932
|
-
var
|
933
|
-
var
|
934
|
-
var
|
935
|
-
var ContentPartText = (0,
|
936
|
-
const
|
937
|
-
|
938
|
-
if (c.part.type !== "text")
|
939
|
-
throw new Error(
|
940
|
-
"ContentPartText can only be used inside text content parts."
|
941
|
-
);
|
942
|
-
return c.part.text;
|
943
|
-
});
|
944
|
-
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_primitive9.Primitive.span, { ...props, ref: forwardedRef, children: text });
|
1073
|
+
var import_react_primitive7 = require("@radix-ui/react-primitive");
|
1074
|
+
var import_react31 = require("react");
|
1075
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
1076
|
+
var ContentPartText = (0, import_react31.forwardRef)((props, forwardedRef) => {
|
1077
|
+
const text = useContentPartText();
|
1078
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_primitive7.Primitive.span, { ...props, ref: forwardedRef, children: text });
|
945
1079
|
});
|
946
1080
|
ContentPartText.displayName = "ContentPartText";
|
947
1081
|
|
948
1082
|
// src/primitives/message/MessageContent.tsx
|
949
|
-
var
|
1083
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
950
1084
|
var defaultComponents = {
|
951
|
-
Text: () => /* @__PURE__ */ (0,
|
952
|
-
/* @__PURE__ */ (0,
|
953
|
-
/* @__PURE__ */ (0,
|
1085
|
+
Text: () => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
|
1086
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ContentPartText, {}),
|
1087
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ContentPartInProgressIndicator, {})
|
954
1088
|
] }),
|
955
1089
|
Image: () => null,
|
956
|
-
UI: () => /* @__PURE__ */ (0,
|
1090
|
+
UI: () => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ContentPartDisplay, {}),
|
957
1091
|
tools: {
|
958
1092
|
Fallback: (props) => {
|
959
1093
|
const { useToolUIs } = useAssistantContext();
|
960
1094
|
const Render = useToolUIs((s) => s.getToolUI(props.part.toolName));
|
961
1095
|
if (!Render) return null;
|
962
|
-
return /* @__PURE__ */ (0,
|
1096
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Render, { ...props });
|
963
1097
|
}
|
964
1098
|
}
|
965
1099
|
};
|
@@ -978,15 +1112,15 @@ var MessageContentPartComponent = ({
|
|
978
1112
|
const type = part.type;
|
979
1113
|
switch (type) {
|
980
1114
|
case "text":
|
981
|
-
return /* @__PURE__ */ (0,
|
1115
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Text, { part, status });
|
982
1116
|
case "image":
|
983
|
-
return /* @__PURE__ */ (0,
|
1117
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Image, { part, status });
|
984
1118
|
case "ui":
|
985
|
-
return /* @__PURE__ */ (0,
|
1119
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(UI, { part, status });
|
986
1120
|
case "tool-call": {
|
987
1121
|
const Tool = by_name[part.toolName] || Fallback;
|
988
1122
|
const addResult = (result) => addToolResult(part.toolCallId, result);
|
989
|
-
return /* @__PURE__ */ (0,
|
1123
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Tool, { part, status, addResult });
|
990
1124
|
}
|
991
1125
|
default:
|
992
1126
|
throw new Error(`Unknown content part type: ${type}`);
|
@@ -996,9 +1130,9 @@ var MessageContentPartImpl = ({
|
|
996
1130
|
partIndex,
|
997
1131
|
components
|
998
1132
|
}) => {
|
999
|
-
return /* @__PURE__ */ (0,
|
1133
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ContentPartProvider, { partIndex, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MessageContentPartComponent, { components }) });
|
1000
1134
|
};
|
1001
|
-
var MessageContentPart = (0,
|
1135
|
+
var MessageContentPart = (0, import_react32.memo)(
|
1002
1136
|
MessageContentPartImpl,
|
1003
1137
|
(prev, next) => prev.partIndex === next.partIndex && prev.components?.Text === next.components?.Text && prev.components?.Image === next.components?.Image && prev.components?.UI === next.components?.UI && prev.components?.tools === next.components?.tools
|
1004
1138
|
);
|
@@ -1007,7 +1141,7 @@ var MessageContent = ({ components }) => {
|
|
1007
1141
|
const contentLength = useMessage((s) => s.message.content.length);
|
1008
1142
|
return new Array(contentLength).fill(null).map((_, idx) => {
|
1009
1143
|
const partIndex = idx;
|
1010
|
-
return /* @__PURE__ */ (0,
|
1144
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
1011
1145
|
MessageContentPart,
|
1012
1146
|
{
|
1013
1147
|
partIndex,
|
@@ -1019,13 +1153,13 @@ var MessageContent = ({ components }) => {
|
|
1019
1153
|
};
|
1020
1154
|
|
1021
1155
|
// src/primitives/message/MessageInProgress.tsx
|
1022
|
-
var
|
1023
|
-
var
|
1024
|
-
var
|
1025
|
-
var MessageInProgress = (0,
|
1156
|
+
var import_react_primitive8 = require("@radix-ui/react-primitive");
|
1157
|
+
var import_react33 = require("react");
|
1158
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
1159
|
+
var MessageInProgress = (0, import_react33.forwardRef)((props, ref) => {
|
1026
1160
|
const { useMessageUtils } = useMessageContext();
|
1027
|
-
(0,
|
1028
|
-
useMessageUtils.getState().setInProgressIndicator(/* @__PURE__ */ (0,
|
1161
|
+
(0, import_react33.useMemo)(() => {
|
1162
|
+
useMessageUtils.getState().setInProgressIndicator(/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_primitive8.Primitive.span, { ...props, ref }));
|
1029
1163
|
}, [useMessageUtils, props, ref]);
|
1030
1164
|
return null;
|
1031
1165
|
});
|
@@ -1041,57 +1175,38 @@ __export(branchPicker_exports, {
|
|
1041
1175
|
Root: () => BranchPickerRoot
|
1042
1176
|
});
|
1043
1177
|
|
1044
|
-
// src/utils/createActionButton.tsx
|
1045
|
-
var import_primitive8 = require("@radix-ui/primitive");
|
1046
|
-
var import_react_primitive11 = require("@radix-ui/react-primitive");
|
1047
|
-
var import_react30 = require("react");
|
1048
|
-
var import_jsx_runtime17 = require("react/jsx-runtime");
|
1049
|
-
var createActionButton = (useActionButton) => {
|
1050
|
-
const ActionButton = (0, import_react30.forwardRef)((props, forwardedRef) => {
|
1051
|
-
const onClick = useActionButton(props);
|
1052
|
-
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
1053
|
-
import_react_primitive11.Primitive.button,
|
1054
|
-
{
|
1055
|
-
type: "button",
|
1056
|
-
disabled: !onClick,
|
1057
|
-
...props,
|
1058
|
-
ref: forwardedRef,
|
1059
|
-
onClick: (0, import_primitive8.composeEventHandlers)(props.onClick, onClick ?? void 0)
|
1060
|
-
}
|
1061
|
-
);
|
1062
|
-
});
|
1063
|
-
ActionButton.displayName = "ActionButton";
|
1064
|
-
return ActionButton;
|
1065
|
-
};
|
1066
|
-
|
1067
1178
|
// src/primitives/branchPicker/BranchPickerNext.tsx
|
1068
|
-
var BranchPickerNext = createActionButton(
|
1179
|
+
var BranchPickerNext = createActionButton(
|
1180
|
+
"BranchPickerNext",
|
1181
|
+
useBranchPickerNext
|
1182
|
+
);
|
1069
1183
|
|
1070
1184
|
// src/primitives/branchPicker/BranchPickerPrevious.tsx
|
1071
|
-
var BranchPickerPrevious = createActionButton(
|
1185
|
+
var BranchPickerPrevious = createActionButton(
|
1186
|
+
"BranchPickerPrevious",
|
1187
|
+
useBranchPickerPrevious
|
1188
|
+
);
|
1072
1189
|
|
1073
1190
|
// src/primitives/branchPicker/BranchPickerCount.tsx
|
1074
|
-
var
|
1191
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
1075
1192
|
var BranchPickerCount = () => {
|
1076
|
-
const
|
1077
|
-
|
1078
|
-
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_jsx_runtime18.Fragment, { children: branchCount });
|
1193
|
+
const branchCount = useBranchPickerCount();
|
1194
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_jsx_runtime14.Fragment, { children: branchCount });
|
1079
1195
|
};
|
1080
1196
|
|
1081
1197
|
// src/primitives/branchPicker/BranchPickerNumber.tsx
|
1082
|
-
var
|
1198
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
1083
1199
|
var BranchPickerNumber = () => {
|
1084
|
-
const
|
1085
|
-
|
1086
|
-
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_jsx_runtime19.Fragment, { children: branchIdx + 1 });
|
1200
|
+
const branchNumber = useBranchPickerNumber();
|
1201
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_jsx_runtime15.Fragment, { children: branchNumber });
|
1087
1202
|
};
|
1088
1203
|
|
1089
1204
|
// src/primitives/branchPicker/BranchPickerRoot.tsx
|
1090
|
-
var
|
1091
|
-
var
|
1092
|
-
var
|
1093
|
-
var BranchPickerRoot = (0,
|
1094
|
-
return /* @__PURE__ */ (0,
|
1205
|
+
var import_react_primitive9 = require("@radix-ui/react-primitive");
|
1206
|
+
var import_react34 = require("react");
|
1207
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
1208
|
+
var BranchPickerRoot = (0, import_react34.forwardRef)(({ hideWhenSingleBranch, ...rest }, ref) => {
|
1209
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(MessageIf, { hasBranches: hideWhenSingleBranch ? true : void 0, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_primitive9.Primitive.div, { ...rest, ref }) });
|
1095
1210
|
});
|
1096
1211
|
BranchPickerRoot.displayName = "BranchPickerRoot";
|
1097
1212
|
|
@@ -1105,13 +1220,17 @@ __export(actionBar_exports, {
|
|
1105
1220
|
});
|
1106
1221
|
|
1107
1222
|
// src/primitives/actionBar/ActionBarRoot.tsx
|
1108
|
-
var
|
1109
|
-
var
|
1110
|
-
var
|
1111
|
-
var
|
1223
|
+
var import_react_primitive10 = require("@radix-ui/react-primitive");
|
1224
|
+
var import_react35 = require("react");
|
1225
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
1226
|
+
var useActionBarFloatStatus = ({
|
1227
|
+
hideWhenRunning,
|
1228
|
+
autohide,
|
1229
|
+
autohideFloat
|
1230
|
+
}) => {
|
1112
1231
|
const { useThread } = useThreadContext();
|
1113
1232
|
const { useMessage, useMessageUtils } = useMessageContext();
|
1114
|
-
|
1233
|
+
return useCombinedStore(
|
1115
1234
|
[useThread, useMessage, useMessageUtils],
|
1116
1235
|
(t, m, mu) => {
|
1117
1236
|
if (hideWhenRunning && t.isRunning) return "hidden" /* Hidden */;
|
@@ -1123,9 +1242,16 @@ var ActionBarRoot = (0, import_react32.forwardRef)(({ hideWhenRunning, autohide,
|
|
1123
1242
|
return "normal" /* Normal */;
|
1124
1243
|
}
|
1125
1244
|
);
|
1245
|
+
};
|
1246
|
+
var ActionBarRoot = (0, import_react35.forwardRef)(({ hideWhenRunning, autohide, autohideFloat, ...rest }, ref) => {
|
1247
|
+
const hideAndfloatStatus = useActionBarFloatStatus({
|
1248
|
+
hideWhenRunning,
|
1249
|
+
autohide,
|
1250
|
+
autohideFloat
|
1251
|
+
});
|
1126
1252
|
if (hideAndfloatStatus === "hidden" /* Hidden */) return null;
|
1127
|
-
return /* @__PURE__ */ (0,
|
1128
|
-
|
1253
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
1254
|
+
import_react_primitive10.Primitive.div,
|
1129
1255
|
{
|
1130
1256
|
...hideAndfloatStatus === "floating" /* Floating */ ? { "data-floating": "true" } : null,
|
1131
1257
|
...rest,
|
@@ -1136,13 +1262,22 @@ var ActionBarRoot = (0, import_react32.forwardRef)(({ hideWhenRunning, autohide,
|
|
1136
1262
|
ActionBarRoot.displayName = "ActionBarRoot";
|
1137
1263
|
|
1138
1264
|
// src/primitives/actionBar/ActionBarCopy.tsx
|
1139
|
-
var ActionBarCopy = createActionButton(
|
1265
|
+
var ActionBarCopy = createActionButton(
|
1266
|
+
"ActionBarCopy",
|
1267
|
+
useActionBarCopy
|
1268
|
+
);
|
1140
1269
|
|
1141
1270
|
// src/primitives/actionBar/ActionBarReload.tsx
|
1142
|
-
var ActionBarReload = createActionButton(
|
1271
|
+
var ActionBarReload = createActionButton(
|
1272
|
+
"ActionBarReload",
|
1273
|
+
useActionBarReload
|
1274
|
+
);
|
1143
1275
|
|
1144
1276
|
// src/primitives/actionBar/ActionBarEdit.tsx
|
1145
|
-
var ActionBarEdit = createActionButton(
|
1277
|
+
var ActionBarEdit = createActionButton(
|
1278
|
+
"ActionBarEdit",
|
1279
|
+
useActionBarEdit
|
1280
|
+
);
|
1146
1281
|
|
1147
1282
|
// src/primitives/contentPart/index.ts
|
1148
1283
|
var contentPart_exports = {};
|
@@ -1154,24 +1289,17 @@ __export(contentPart_exports, {
|
|
1154
1289
|
});
|
1155
1290
|
|
1156
1291
|
// src/primitives/contentPart/ContentPartImage.tsx
|
1157
|
-
var
|
1158
|
-
var
|
1159
|
-
var
|
1160
|
-
var ContentPartImage = (0,
|
1161
|
-
const
|
1162
|
-
|
1163
|
-
if (c.part.type !== "image")
|
1164
|
-
throw new Error(
|
1165
|
-
"ContentPartImage can only be used inside image content parts."
|
1166
|
-
);
|
1167
|
-
return c.part.image;
|
1168
|
-
});
|
1169
|
-
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_primitive14.Primitive.img, { src: image, ...props, ref: forwardedRef });
|
1292
|
+
var import_react_primitive11 = require("@radix-ui/react-primitive");
|
1293
|
+
var import_react36 = require("react");
|
1294
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
1295
|
+
var ContentPartImage = (0, import_react36.forwardRef)((props, forwardedRef) => {
|
1296
|
+
const image = useContentPartImage();
|
1297
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_primitive11.Primitive.img, { src: image, ...props, ref: forwardedRef });
|
1170
1298
|
});
|
1171
1299
|
ContentPartImage.displayName = "ContentPartImage";
|
1172
1300
|
|
1173
1301
|
// src/runtime/local/useLocalRuntime.tsx
|
1174
|
-
var
|
1302
|
+
var import_react37 = require("react");
|
1175
1303
|
|
1176
1304
|
// src/utils/ModelConfigTypes.ts
|
1177
1305
|
var mergeModelConfigs = (configSet) => {
|
@@ -1457,18 +1585,18 @@ var LocalRuntime = class {
|
|
1457
1585
|
|
1458
1586
|
// src/runtime/local/useLocalRuntime.tsx
|
1459
1587
|
var useLocalRuntime = (adapter) => {
|
1460
|
-
const [runtime] = (0,
|
1461
|
-
(0,
|
1588
|
+
const [runtime] = (0, import_react37.useState)(() => new LocalRuntime(adapter));
|
1589
|
+
(0, import_react37.useInsertionEffect)(() => {
|
1462
1590
|
runtime.adapter = adapter;
|
1463
1591
|
});
|
1464
1592
|
return runtime;
|
1465
1593
|
};
|
1466
1594
|
|
1467
1595
|
// src/context/providers/AssistantRuntimeProvider.tsx
|
1468
|
-
var
|
1596
|
+
var import_react40 = require("react");
|
1469
1597
|
|
1470
1598
|
// src/context/providers/AssistantProvider.tsx
|
1471
|
-
var
|
1599
|
+
var import_react39 = require("react");
|
1472
1600
|
|
1473
1601
|
// src/context/stores/AssistantModelConfig.ts
|
1474
1602
|
var import_zustand5 = require("zustand");
|
@@ -1533,7 +1661,7 @@ var makeAssistantToolUIsStore = () => (0, import_zustand6.create)((set) => {
|
|
1533
1661
|
});
|
1534
1662
|
|
1535
1663
|
// src/context/providers/ThreadProvider.tsx
|
1536
|
-
var
|
1664
|
+
var import_react38 = require("react");
|
1537
1665
|
|
1538
1666
|
// src/context/stores/Composer.ts
|
1539
1667
|
var import_zustand7 = require("zustand");
|
@@ -1546,6 +1674,7 @@ var makeComposerStore = (useThread, useThreadActions) => (0, import_zustand7.cre
|
|
1546
1674
|
setValue("");
|
1547
1675
|
useThreadActions.getState().append({
|
1548
1676
|
parentId: useThread.getState().messages.at(-1)?.id ?? null,
|
1677
|
+
role: "user",
|
1549
1678
|
content: [{ type: "text", text: value }]
|
1550
1679
|
});
|
1551
1680
|
},
|
@@ -1603,16 +1732,16 @@ var makeThreadActionStore = (runtimeRef) => {
|
|
1603
1732
|
};
|
1604
1733
|
|
1605
1734
|
// src/context/providers/ThreadProvider.tsx
|
1606
|
-
var
|
1735
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
1607
1736
|
var ThreadProvider = ({
|
1608
1737
|
children,
|
1609
1738
|
runtime
|
1610
1739
|
}) => {
|
1611
|
-
const runtimeRef = (0,
|
1612
|
-
(0,
|
1740
|
+
const runtimeRef = (0, import_react38.useRef)(runtime);
|
1741
|
+
(0, import_react38.useInsertionEffect)(() => {
|
1613
1742
|
runtimeRef.current = runtime;
|
1614
1743
|
});
|
1615
|
-
const [context] = (0,
|
1744
|
+
const [context] = (0, import_react38.useState)(() => {
|
1616
1745
|
const useThread = makeThreadStore(runtimeRef);
|
1617
1746
|
const useThreadActions = makeThreadActionStore(runtimeRef);
|
1618
1747
|
const useViewport = makeThreadViewportStore();
|
@@ -1624,7 +1753,7 @@ var ThreadProvider = ({
|
|
1624
1753
|
useViewport
|
1625
1754
|
};
|
1626
1755
|
});
|
1627
|
-
(0,
|
1756
|
+
(0, import_react38.useEffect)(() => {
|
1628
1757
|
const onRuntimeUpdate = () => {
|
1629
1758
|
context.useThread.setState(
|
1630
1759
|
Object.freeze({
|
@@ -1638,37 +1767,37 @@ var ThreadProvider = ({
|
|
1638
1767
|
return runtime.subscribe(onRuntimeUpdate);
|
1639
1768
|
}, [context, runtime]);
|
1640
1769
|
const RuntimeSynchronizer = runtime.unstable_synchronizer;
|
1641
|
-
return /* @__PURE__ */ (0,
|
1642
|
-
RuntimeSynchronizer && /* @__PURE__ */ (0,
|
1770
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(ThreadContext.Provider, { value: context, children: [
|
1771
|
+
RuntimeSynchronizer && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(RuntimeSynchronizer, {}),
|
1643
1772
|
children
|
1644
1773
|
] });
|
1645
1774
|
};
|
1646
1775
|
|
1647
1776
|
// src/context/providers/AssistantProvider.tsx
|
1648
|
-
var
|
1777
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
1649
1778
|
var AssistantProvider = ({ children, runtime }) => {
|
1650
|
-
const runtimeRef = (0,
|
1651
|
-
(0,
|
1779
|
+
const runtimeRef = (0, import_react39.useRef)(runtime);
|
1780
|
+
(0, import_react39.useInsertionEffect)(() => {
|
1652
1781
|
runtimeRef.current = runtime;
|
1653
1782
|
});
|
1654
|
-
const [context] = (0,
|
1783
|
+
const [context] = (0, import_react39.useState)(() => {
|
1655
1784
|
const useModelConfig = makeAssistantModelConfigStore();
|
1656
1785
|
const useToolUIs = makeAssistantToolUIsStore();
|
1657
1786
|
return { useModelConfig, useToolUIs };
|
1658
1787
|
});
|
1659
1788
|
const getModelCOnfig = context.useModelConfig((c) => c.getModelConfig);
|
1660
|
-
(0,
|
1789
|
+
(0, import_react39.useEffect)(() => {
|
1661
1790
|
return runtime.registerModelConfigProvider(getModelCOnfig);
|
1662
1791
|
}, [runtime, getModelCOnfig]);
|
1663
|
-
return /* @__PURE__ */ (0,
|
1792
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(AssistantContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ThreadProvider, { runtime, children }) });
|
1664
1793
|
};
|
1665
1794
|
|
1666
1795
|
// src/context/providers/AssistantRuntimeProvider.tsx
|
1667
|
-
var
|
1796
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
1668
1797
|
var AssistantRuntimeProviderImpl = ({ children, runtime }) => {
|
1669
|
-
return /* @__PURE__ */ (0,
|
1798
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(AssistantProvider, { runtime, children });
|
1670
1799
|
};
|
1671
|
-
var AssistantRuntimeProvider = (0,
|
1800
|
+
var AssistantRuntimeProvider = (0, import_react40.memo)(AssistantRuntimeProviderImpl);
|
1672
1801
|
|
1673
1802
|
// src/internal.ts
|
1674
1803
|
var internal_exports = {};
|
@@ -1686,11 +1815,25 @@ __export(internal_exports, {
|
|
1686
1815
|
INTERNAL,
|
1687
1816
|
MessagePrimitive,
|
1688
1817
|
ThreadPrimitive,
|
1689
|
-
|
1690
|
-
|
1691
|
-
|
1692
|
-
|
1818
|
+
useActionBarCopy,
|
1819
|
+
useActionBarEdit,
|
1820
|
+
useActionBarReload,
|
1821
|
+
useBranchPickerCount,
|
1822
|
+
useBranchPickerNext,
|
1823
|
+
useBranchPickerNumber,
|
1824
|
+
useBranchPickerPrevious,
|
1825
|
+
useComposerCancel,
|
1826
|
+
useComposerIf,
|
1827
|
+
useComposerSend,
|
1828
|
+
useContentPartDisplay,
|
1829
|
+
useContentPartImage,
|
1830
|
+
useContentPartInProgressIndicator,
|
1831
|
+
useContentPartText,
|
1693
1832
|
useLocalRuntime,
|
1694
|
-
|
1833
|
+
useMessageIf,
|
1834
|
+
useThreadEmpty,
|
1835
|
+
useThreadIf,
|
1836
|
+
useThreadScrollToBottom,
|
1837
|
+
useThreadSuggestion
|
1695
1838
|
});
|
1696
1839
|
//# sourceMappingURL=index.js.map
|