@truefoundry/agent-ui-sdk 0.0.4 → 0.0.6
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 +35 -1
- package/dist/index.d.ts +6 -14
- package/dist/index.js +150 -213
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +8 -7
package/dist/index.js
CHANGED
|
@@ -84,9 +84,9 @@ import {
|
|
|
84
84
|
|
|
85
85
|
// src/theme/defaultSlots.ts
|
|
86
86
|
import {
|
|
87
|
-
Accordion as
|
|
88
|
-
AccordionDetails as
|
|
89
|
-
AccordionSummary as
|
|
87
|
+
Accordion as Accordion2,
|
|
88
|
+
AccordionDetails as AccordionDetails2,
|
|
89
|
+
AccordionSummary as AccordionSummary2
|
|
90
90
|
} from "tfy-web-components/components/atoms/Accordion";
|
|
91
91
|
import Button2 from "tfy-web-components/components/atoms/Button";
|
|
92
92
|
import IconButton4 from "tfy-web-components/components/atoms/IconButton";
|
|
@@ -122,6 +122,15 @@ function ReasoningCard(props) {
|
|
|
122
122
|
return /* @__PURE__ */ jsx9(TfyReasoningCard, { ...props });
|
|
123
123
|
}
|
|
124
124
|
|
|
125
|
+
// src/atoms/adapters/AgentStepsCardAdapter.tsx
|
|
126
|
+
import {
|
|
127
|
+
AgentStepsCard as TfyAgentStepsCard
|
|
128
|
+
} from "tfy-web-components/components/molecules/agent-chat";
|
|
129
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
130
|
+
function AgentStepsCard(props) {
|
|
131
|
+
return /* @__PURE__ */ jsx10(TfyAgentStepsCard, { ...props });
|
|
132
|
+
}
|
|
133
|
+
|
|
125
134
|
// src/atoms/primitives/Avatar.tsx
|
|
126
135
|
import "react";
|
|
127
136
|
import TfyAvatar, {
|
|
@@ -137,12 +146,12 @@ function cn(...inputs) {
|
|
|
137
146
|
}
|
|
138
147
|
|
|
139
148
|
// src/atoms/primitives/Avatar.tsx
|
|
140
|
-
import { jsx as
|
|
149
|
+
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
141
150
|
var AvatarRoot = TfyAvatar;
|
|
142
151
|
var AvatarImagePrimitive = TfyAvatarImage;
|
|
143
152
|
var AvatarFallbackPrimitive = TfyAvatarFallback;
|
|
144
153
|
function Avatar({ className, size = "default", ...props }) {
|
|
145
|
-
return /* @__PURE__ */
|
|
154
|
+
return /* @__PURE__ */ jsx11(
|
|
146
155
|
AvatarRoot,
|
|
147
156
|
{
|
|
148
157
|
"data-slot": "avatar",
|
|
@@ -154,15 +163,15 @@ function Avatar({ className, size = "default", ...props }) {
|
|
|
154
163
|
);
|
|
155
164
|
}
|
|
156
165
|
function AvatarImage({ className, ...props }) {
|
|
157
|
-
return /* @__PURE__ */
|
|
166
|
+
return /* @__PURE__ */ jsx11(AvatarImagePrimitive, { "data-slot": "avatar-image", className: cn(className), ...props });
|
|
158
167
|
}
|
|
159
168
|
function AvatarFallback({ className, ...props }) {
|
|
160
|
-
return /* @__PURE__ */
|
|
169
|
+
return /* @__PURE__ */ jsx11(AvatarFallbackPrimitive, { "data-slot": "avatar-fallback", className: cn(className), ...props });
|
|
161
170
|
}
|
|
162
171
|
|
|
163
172
|
// src/atoms/UserMessageBubble.tsx
|
|
164
173
|
import { UserMessage } from "tfy-web-components/components/molecules/agent-chat";
|
|
165
|
-
import { jsx as
|
|
174
|
+
import { jsx as jsx12, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
166
175
|
function UserMessageBubble({ text, attachments, editAction, className }) {
|
|
167
176
|
return /* @__PURE__ */ jsxs3(
|
|
168
177
|
"div",
|
|
@@ -171,7 +180,7 @@ function UserMessageBubble({ text, attachments, editAction, className }) {
|
|
|
171
180
|
className: cn("fade-in slide-in-from-bottom-1 animate-in duration-150", className),
|
|
172
181
|
children: [
|
|
173
182
|
attachments,
|
|
174
|
-
/* @__PURE__ */
|
|
183
|
+
/* @__PURE__ */ jsx12(UserMessage, { text, editAction })
|
|
175
184
|
]
|
|
176
185
|
}
|
|
177
186
|
);
|
|
@@ -180,9 +189,9 @@ function UserMessageBubble({ text, attachments, editAction, className }) {
|
|
|
180
189
|
// src/atoms/UserMessageEdit.tsx
|
|
181
190
|
import { forwardRef } from "react";
|
|
182
191
|
import TfyUserMessageEdit from "tfy-web-components/components/molecules/agent-chat/UserMessageEdit";
|
|
183
|
-
import { jsx as
|
|
192
|
+
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
184
193
|
var UserMessageEdit = forwardRef(function UserMessageEdit2({ timestamp, attachments, input, footer, className, ...rest }, ref) {
|
|
185
|
-
return /* @__PURE__ */
|
|
194
|
+
return /* @__PURE__ */ jsx13(
|
|
186
195
|
TfyUserMessageEdit,
|
|
187
196
|
{
|
|
188
197
|
ref,
|
|
@@ -201,10 +210,10 @@ var UserMessageEdit = forwardRef(function UserMessageEdit2({ timestamp, attachme
|
|
|
201
210
|
import {
|
|
202
211
|
ToolCallCard as TfyToolCallCard
|
|
203
212
|
} from "tfy-web-components/components/molecules/agent-chat";
|
|
204
|
-
import { jsx as
|
|
213
|
+
import { jsx as jsx14 } from "react/jsx-runtime";
|
|
205
214
|
function ToolCallCard(props) {
|
|
206
215
|
const { mcpServerName, ...tfyProps } = props;
|
|
207
|
-
return /* @__PURE__ */
|
|
216
|
+
return /* @__PURE__ */ jsx14(
|
|
208
217
|
TfyToolCallCard,
|
|
209
218
|
{
|
|
210
219
|
...tfyProps,
|
|
@@ -217,14 +226,14 @@ function ToolCallCard(props) {
|
|
|
217
226
|
import {
|
|
218
227
|
ToolCallContentBlock as TfyToolCallContentBlock
|
|
219
228
|
} from "tfy-web-components/components/molecules/agent-chat";
|
|
220
|
-
import { jsx as
|
|
229
|
+
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
221
230
|
function ToolCallContentBlock(props) {
|
|
222
|
-
return /* @__PURE__ */
|
|
231
|
+
return /* @__PURE__ */ jsx15(TfyToolCallContentBlock, { ...props });
|
|
223
232
|
}
|
|
224
233
|
|
|
225
234
|
// src/atoms/SubAgentCard.tsx
|
|
226
235
|
import { SubAgentCard as TfySubAgentCard } from "tfy-web-components/components/molecules/agent-chat";
|
|
227
|
-
import { jsx as
|
|
236
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
228
237
|
function SubAgentCard({
|
|
229
238
|
agentName,
|
|
230
239
|
instruction,
|
|
@@ -237,7 +246,7 @@ function SubAgentCard({
|
|
|
237
246
|
className
|
|
238
247
|
}) {
|
|
239
248
|
const Markdown2 = useSlot("Markdown");
|
|
240
|
-
return /* @__PURE__ */
|
|
249
|
+
return /* @__PURE__ */ jsx16(
|
|
241
250
|
TfySubAgentCard,
|
|
242
251
|
{
|
|
243
252
|
agentName,
|
|
@@ -247,7 +256,7 @@ function SubAgentCard({
|
|
|
247
256
|
expanded,
|
|
248
257
|
onToggle,
|
|
249
258
|
durationText,
|
|
250
|
-
renderInstruction: (content) => /* @__PURE__ */
|
|
259
|
+
renderInstruction: (content) => /* @__PURE__ */ jsx16(Markdown2, { content }),
|
|
251
260
|
className: cn("aui-sub-agent-card", className),
|
|
252
261
|
children
|
|
253
262
|
}
|
|
@@ -259,7 +268,7 @@ import {
|
|
|
259
268
|
SandboxToolCall,
|
|
260
269
|
ToolCallCard as TfyToolCallCard2
|
|
261
270
|
} from "tfy-web-components/components/molecules/agent-chat";
|
|
262
|
-
import { jsx as
|
|
271
|
+
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
263
272
|
function SandboxToolCallCard({
|
|
264
273
|
name,
|
|
265
274
|
intent,
|
|
@@ -278,7 +287,7 @@ function SandboxToolCallCard({
|
|
|
278
287
|
className
|
|
279
288
|
}) {
|
|
280
289
|
const awaiting = status === "running";
|
|
281
|
-
const sandboxContent = /* @__PURE__ */
|
|
290
|
+
const sandboxContent = /* @__PURE__ */ jsx17(
|
|
282
291
|
SandboxToolCall,
|
|
283
292
|
{
|
|
284
293
|
command,
|
|
@@ -291,7 +300,7 @@ function SandboxToolCallCard({
|
|
|
291
300
|
onViewModeChange
|
|
292
301
|
}
|
|
293
302
|
);
|
|
294
|
-
return /* @__PURE__ */
|
|
303
|
+
return /* @__PURE__ */ jsx17(
|
|
295
304
|
TfyToolCallCard2,
|
|
296
305
|
{
|
|
297
306
|
toolName: intent || name,
|
|
@@ -312,9 +321,9 @@ function SandboxToolCallCard({
|
|
|
312
321
|
import {
|
|
313
322
|
ToolApprovalBlock
|
|
314
323
|
} from "tfy-web-components/components/molecules/agent-chat";
|
|
315
|
-
import { jsx as
|
|
324
|
+
import { jsx as jsx18 } from "react/jsx-runtime";
|
|
316
325
|
function ToolApprovalBar({ className, ...props }) {
|
|
317
|
-
return /* @__PURE__ */
|
|
326
|
+
return /* @__PURE__ */ jsx18(
|
|
318
327
|
ToolApprovalBlock,
|
|
319
328
|
{
|
|
320
329
|
...props,
|
|
@@ -326,7 +335,7 @@ function ToolApprovalBar({ className, ...props }) {
|
|
|
326
335
|
// src/atoms/ToolGroupCard.tsx
|
|
327
336
|
import { ChevronDownIcon, LoaderIcon } from "lucide-react";
|
|
328
337
|
import { Accordion, AccordionDetails, AccordionSummary } from "tfy-web-components/components/atoms/Accordion";
|
|
329
|
-
import { jsx as
|
|
338
|
+
import { jsx as jsx19, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
330
339
|
function ToolGroupCard({
|
|
331
340
|
toolCallCount,
|
|
332
341
|
expanded,
|
|
@@ -346,7 +355,7 @@ function ToolGroupCard({
|
|
|
346
355
|
className: cn("aui-tool-group-card group/tool-group w-full", className),
|
|
347
356
|
sx: { margin: 0, border: "none", boxShadow: "none" },
|
|
348
357
|
children: [
|
|
349
|
-
/* @__PURE__ */
|
|
358
|
+
/* @__PURE__ */ jsx19(
|
|
350
359
|
AccordionSummary,
|
|
351
360
|
{
|
|
352
361
|
hideIcon: true,
|
|
@@ -359,9 +368,9 @@ function ToolGroupCard({
|
|
|
359
368
|
"& .MuiAccordionSummary-content": { margin: 0, width: "100%" }
|
|
360
369
|
},
|
|
361
370
|
children: /* @__PURE__ */ jsxs4("div", { className: "text-muted-foreground hover:text-foreground flex origin-left items-center gap-2 py-1.5 text-sm transition-[color,scale] active:scale-[0.98]", children: [
|
|
362
|
-
active && /* @__PURE__ */
|
|
363
|
-
/* @__PURE__ */
|
|
364
|
-
/* @__PURE__ */
|
|
371
|
+
active && /* @__PURE__ */ jsx19(LoaderIcon, { className: "size-3 shrink-0 animate-spin [animation-duration:0.6s]" }),
|
|
372
|
+
/* @__PURE__ */ jsx19("span", { className: "text-xs font-medium", children: label }),
|
|
373
|
+
/* @__PURE__ */ jsx19(
|
|
365
374
|
ChevronDownIcon,
|
|
366
375
|
{
|
|
367
376
|
className: cn(
|
|
@@ -373,76 +382,7 @@ function ToolGroupCard({
|
|
|
373
382
|
] })
|
|
374
383
|
}
|
|
375
384
|
),
|
|
376
|
-
/* @__PURE__ */
|
|
377
|
-
]
|
|
378
|
-
}
|
|
379
|
-
);
|
|
380
|
-
}
|
|
381
|
-
|
|
382
|
-
// src/atoms/AgentStepsCard.tsx
|
|
383
|
-
import { LoaderIcon as LoaderIcon2 } from "lucide-react";
|
|
384
|
-
import { Accordion as Accordion2, AccordionDetails as AccordionDetails2, AccordionSummary as AccordionSummary2 } from "tfy-web-components/components/atoms/Accordion";
|
|
385
|
-
import IconProvider from "tfy-web-components/components/atoms/IconProvider";
|
|
386
|
-
import { jsx as jsx19, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
387
|
-
function AgentStepsCard({
|
|
388
|
-
toolCount,
|
|
389
|
-
thinkingCount,
|
|
390
|
-
expanded,
|
|
391
|
-
active = false,
|
|
392
|
-
onToggle,
|
|
393
|
-
children,
|
|
394
|
-
className
|
|
395
|
-
}) {
|
|
396
|
-
const toolLabel = `${toolCount} tool ${toolCount === 1 ? "call" : "calls"}`;
|
|
397
|
-
const thinkingLabel = thinkingCount > 0 ? ` \xB7 ${thinkingCount} thought${thinkingCount === 1 ? "" : "s"}` : "";
|
|
398
|
-
return /* @__PURE__ */ jsxs5(
|
|
399
|
-
Accordion2,
|
|
400
|
-
{
|
|
401
|
-
"data-slot": "agent-steps-card",
|
|
402
|
-
expanded,
|
|
403
|
-
onChange: () => onToggle(),
|
|
404
|
-
background: "transparent",
|
|
405
|
-
className: cn("aui-agent-steps-card rounded-lg border border-border/50 bg-secondary/20", className),
|
|
406
|
-
sx: { margin: 0, boxShadow: "none" },
|
|
407
|
-
children: [
|
|
408
|
-
/* @__PURE__ */ jsx19(
|
|
409
|
-
AccordionSummary2,
|
|
410
|
-
{
|
|
411
|
-
hideIcon: true,
|
|
412
|
-
disableRipple: true,
|
|
413
|
-
sx: {
|
|
414
|
-
padding: 0,
|
|
415
|
-
minHeight: 0,
|
|
416
|
-
"&.Mui-expanded": { minHeight: 0 },
|
|
417
|
-
"& .MuiAccordionSummary-content": { margin: 0, width: "100%" }
|
|
418
|
-
},
|
|
419
|
-
children: /* @__PURE__ */ jsxs5(
|
|
420
|
-
"button",
|
|
421
|
-
{
|
|
422
|
-
type: "button",
|
|
423
|
-
className: "flex w-full items-center gap-2 rounded-t-lg py-2 px-2.5 text-left text-xs transition-colors hover:bg-secondary/40",
|
|
424
|
-
children: [
|
|
425
|
-
/* @__PURE__ */ jsx19(
|
|
426
|
-
IconProvider,
|
|
427
|
-
{
|
|
428
|
-
icon: expanded ? "chevron-down" : "chevron-right",
|
|
429
|
-
size: 0.75,
|
|
430
|
-
className: "shrink-0 text-muted-foreground"
|
|
431
|
-
}
|
|
432
|
-
),
|
|
433
|
-
/* @__PURE__ */ jsx19("span", { className: "font-semibold text-foreground/90", children: "Agent steps" }),
|
|
434
|
-
/* @__PURE__ */ jsxs5("span", { className: "text-muted-foreground", children: [
|
|
435
|
-
"\xB7 ",
|
|
436
|
-
toolLabel,
|
|
437
|
-
thinkingLabel
|
|
438
|
-
] }),
|
|
439
|
-
active && /* @__PURE__ */ jsx19(LoaderIcon2, { className: "ml-auto size-3 shrink-0 animate-spin text-primary" })
|
|
440
|
-
]
|
|
441
|
-
}
|
|
442
|
-
)
|
|
443
|
-
}
|
|
444
|
-
),
|
|
445
|
-
/* @__PURE__ */ jsx19(AccordionDetails2, { sx: { padding: 0 }, children: /* @__PURE__ */ jsx19("div", { className: "space-y-3 border-t border-border/50 px-1.5 py-1.5 pt-3", children }) })
|
|
385
|
+
/* @__PURE__ */ jsx19(AccordionDetails, { sx: { padding: 0 }, children: /* @__PURE__ */ jsx19("div", { className: "mt-1 flex flex-col gap-2 text-foreground", children }) })
|
|
446
386
|
]
|
|
447
387
|
}
|
|
448
388
|
);
|
|
@@ -450,9 +390,9 @@ function AgentStepsCard({
|
|
|
450
390
|
|
|
451
391
|
// src/atoms/Skeletons.tsx
|
|
452
392
|
import Skeleton from "tfy-web-components/components/atoms/Skeleton";
|
|
453
|
-
import { jsx as jsx20, jsxs as
|
|
393
|
+
import { jsx as jsx20, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
454
394
|
function MessageListSkeleton({ className }) {
|
|
455
|
-
return /* @__PURE__ */
|
|
395
|
+
return /* @__PURE__ */ jsxs5(
|
|
456
396
|
"div",
|
|
457
397
|
{
|
|
458
398
|
role: "status",
|
|
@@ -461,7 +401,7 @@ function MessageListSkeleton({ className }) {
|
|
|
461
401
|
className: cn("mb-14 flex flex-col gap-y-6", className),
|
|
462
402
|
children: [
|
|
463
403
|
/* @__PURE__ */ jsx20("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx20(Skeleton, { className: "h-10 w-[min(85%,20rem)] rounded-xl" }) }),
|
|
464
|
-
/* @__PURE__ */
|
|
404
|
+
/* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2 px-2", children: [
|
|
465
405
|
/* @__PURE__ */ jsx20(Skeleton, { className: "h-4 w-full max-w-md" }),
|
|
466
406
|
/* @__PURE__ */ jsx20(Skeleton, { className: "h-4 w-full max-w-sm" }),
|
|
467
407
|
/* @__PURE__ */ jsx20(Skeleton, { className: "h-4 w-2/3 max-w-xs" })
|
|
@@ -472,7 +412,7 @@ function MessageListSkeleton({ className }) {
|
|
|
472
412
|
}
|
|
473
413
|
|
|
474
414
|
// src/atoms/ComposerShell.tsx
|
|
475
|
-
import { jsx as jsx21, jsxs as
|
|
415
|
+
import { jsx as jsx21, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
476
416
|
function ComposerShell({
|
|
477
417
|
value,
|
|
478
418
|
placeholder,
|
|
@@ -491,7 +431,7 @@ function ComposerShell({
|
|
|
491
431
|
const ComposerLeftSection2 = useSlot("ComposerLeftSection");
|
|
492
432
|
const ComposerRightSection2 = useSlot("ComposerRightSection");
|
|
493
433
|
const ComposerSendButton2 = useSlot("ComposerSendButton");
|
|
494
|
-
return /* @__PURE__ */
|
|
434
|
+
return /* @__PURE__ */ jsxs6(
|
|
495
435
|
"div",
|
|
496
436
|
{
|
|
497
437
|
"data-slot": "aui_composer-shell",
|
|
@@ -519,8 +459,8 @@ function ComposerShell({
|
|
|
519
459
|
className: "placeholder:text-muted-foreground/80 max-h-32 min-h-10 w-full resize-none rounded-lg bg-transparent px-2.5 py-1 text-base outline-none"
|
|
520
460
|
}
|
|
521
461
|
),
|
|
522
|
-
/* @__PURE__ */
|
|
523
|
-
/* @__PURE__ */
|
|
462
|
+
/* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-between px-1", children: [
|
|
463
|
+
/* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
|
|
524
464
|
/* @__PURE__ */ jsx21(
|
|
525
465
|
ComposerLeftSection2,
|
|
526
466
|
{
|
|
@@ -531,8 +471,8 @@ function ComposerShell({
|
|
|
531
471
|
),
|
|
532
472
|
connectorStatusLabel && /* @__PURE__ */ jsx21("span", { className: "text-muted-foreground text-xs", children: connectorStatusLabel })
|
|
533
473
|
] }),
|
|
534
|
-
/* @__PURE__ */
|
|
535
|
-
modelLabel && /* @__PURE__ */
|
|
474
|
+
/* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
|
|
475
|
+
modelLabel && /* @__PURE__ */ jsxs6("span", { className: "bg-muted text-muted-foreground flex items-center gap-1 rounded-full px-2 py-0.5 text-xs", children: [
|
|
536
476
|
modelIcon,
|
|
537
477
|
modelLabel
|
|
538
478
|
] }),
|
|
@@ -556,7 +496,7 @@ function ComposerShell({
|
|
|
556
496
|
|
|
557
497
|
// src/atoms/ComposerSections.tsx
|
|
558
498
|
import Spinner from "tfy-web-components/components/atoms/Spinner";
|
|
559
|
-
import { Fragment, jsx as jsx22, jsxs as
|
|
499
|
+
import { Fragment, jsx as jsx22, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
560
500
|
function ComposerLeftSection({ onAttach }) {
|
|
561
501
|
const IconButton5 = useSlot("IconButton");
|
|
562
502
|
if (!onAttach) return null;
|
|
@@ -578,7 +518,7 @@ function ComposerSendButton({
|
|
|
578
518
|
{
|
|
579
519
|
disabled: !onCancel,
|
|
580
520
|
onClick: onCancel,
|
|
581
|
-
text: /* @__PURE__ */
|
|
521
|
+
text: /* @__PURE__ */ jsxs7(Fragment, { children: [
|
|
582
522
|
/* @__PURE__ */ jsx22(Spinner, { small: true }),
|
|
583
523
|
"Cancel"
|
|
584
524
|
] })
|
|
@@ -606,7 +546,7 @@ import { FileTextIcon } from "lucide-react";
|
|
|
606
546
|
var USER_MESSAGE_ATTACHMENT_PREVIEW_REM = 12;
|
|
607
547
|
|
|
608
548
|
// src/atoms/AttachmentCard.tsx
|
|
609
|
-
import { jsx as jsx23, jsxs as
|
|
549
|
+
import { jsx as jsx23, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
610
550
|
function AttachmentCard({
|
|
611
551
|
name,
|
|
612
552
|
previewSrc,
|
|
@@ -636,7 +576,7 @@ function AttachmentCard({
|
|
|
636
576
|
}
|
|
637
577
|
);
|
|
638
578
|
}
|
|
639
|
-
return /* @__PURE__ */
|
|
579
|
+
return /* @__PURE__ */ jsxs8(
|
|
640
580
|
"div",
|
|
641
581
|
{
|
|
642
582
|
"data-slot": "aui_attachment-chip",
|
|
@@ -646,7 +586,7 @@ function AttachmentCard({
|
|
|
646
586
|
className
|
|
647
587
|
),
|
|
648
588
|
children: [
|
|
649
|
-
/* @__PURE__ */ jsx23("div", { className: "bg-background flex size-7 shrink-0 items-center justify-center overflow-hidden rounded-md border", children: isImage && previewSrc ? /* @__PURE__ */
|
|
589
|
+
/* @__PURE__ */ jsx23("div", { className: "bg-background flex size-7 shrink-0 items-center justify-center overflow-hidden rounded-md border", children: isImage && previewSrc ? /* @__PURE__ */ jsxs8(Avatar2, { className: "size-7 rounded-none", children: [
|
|
650
590
|
/* @__PURE__ */ jsx23(AvatarImage2, { src: previewSrc, alt: name, className: "object-cover" }),
|
|
651
591
|
/* @__PURE__ */ jsx23(AvatarFallback2, { children: /* @__PURE__ */ jsx23(FileTextIcon, { className: "text-muted-foreground size-4" }) })
|
|
652
592
|
] }) : /* @__PURE__ */ jsx23(FileTextIcon, { className: "text-muted-foreground size-4" }) }),
|
|
@@ -683,12 +623,12 @@ function AttachmentPickerButton(props) {
|
|
|
683
623
|
// src/atoms/AttachmentPreviewDialog.tsx
|
|
684
624
|
import { useState } from "react";
|
|
685
625
|
import Modal from "tfy-web-components/components/atoms/Modal";
|
|
686
|
-
import { Fragment as Fragment2, jsx as jsx25, jsxs as
|
|
626
|
+
import { Fragment as Fragment2, jsx as jsx25, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
687
627
|
function AttachmentPreviewDialog({ previewSrc, children }) {
|
|
688
628
|
const IconButton5 = useSlot("IconButton");
|
|
689
629
|
const [open, setOpen] = useState(false);
|
|
690
630
|
if (!previewSrc) return /* @__PURE__ */ jsx25(Fragment2, { children });
|
|
691
|
-
return /* @__PURE__ */
|
|
631
|
+
return /* @__PURE__ */ jsxs9(Fragment2, { children: [
|
|
692
632
|
/* @__PURE__ */ jsx25(
|
|
693
633
|
"div",
|
|
694
634
|
{
|
|
@@ -705,7 +645,7 @@ function AttachmentPreviewDialog({ previewSrc, children }) {
|
|
|
705
645
|
children
|
|
706
646
|
}
|
|
707
647
|
),
|
|
708
|
-
/* @__PURE__ */ jsx25(Modal, { open, onClose: () => setOpen(false), children: /* @__PURE__ */
|
|
648
|
+
/* @__PURE__ */ jsx25(Modal, { open, onClose: () => setOpen(false), children: /* @__PURE__ */ jsxs9("div", { className: "bg-popover fixed top-1/2 left-1/2 z-50 w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 rounded-xl p-2 outline-none sm:max-w-3xl", children: [
|
|
709
649
|
/* @__PURE__ */ jsx25("span", { className: "absolute top-2 right-2 z-10 inline-flex", children: /* @__PURE__ */ jsx25(IconButton5, { icon: "xmark", tooltip: "Close", onClick: () => setOpen(false) }) }),
|
|
710
650
|
/* @__PURE__ */ jsx25("div", { className: "bg-background relative mx-auto flex max-h-[80dvh] w-full items-center justify-center overflow-hidden", children: /* @__PURE__ */ jsx25(
|
|
711
651
|
"img",
|
|
@@ -751,12 +691,12 @@ var ScrollToBottomButton = forwardRef2(
|
|
|
751
691
|
ScrollToBottomButton.displayName = "ScrollToBottomButton";
|
|
752
692
|
|
|
753
693
|
// src/atoms/ThreadListRow.tsx
|
|
754
|
-
import
|
|
694
|
+
import IconProvider from "tfy-web-components/components/atoms/IconProvider";
|
|
755
695
|
import IconButton3 from "tfy-web-components/components/atoms/IconButton";
|
|
756
696
|
import DropdownMenu from "tfy-web-components/components/molecules/DropdownMenu";
|
|
757
|
-
import { jsx as jsx27, jsxs as
|
|
697
|
+
import { jsx as jsx27, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
758
698
|
function ThreadListRow({ title, active, onSelect, onArchive, onDelete, className }) {
|
|
759
|
-
return /* @__PURE__ */
|
|
699
|
+
return /* @__PURE__ */ jsxs10(
|
|
760
700
|
"div",
|
|
761
701
|
{
|
|
762
702
|
"data-slot": "aui_thread-list-item",
|
|
@@ -776,7 +716,7 @@ function ThreadListRow({ title, active, onSelect, onArchive, onDelete, className
|
|
|
776
716
|
children: /* @__PURE__ */ jsx27("span", { className: "min-w-0 flex-1 truncate", children: title })
|
|
777
717
|
}
|
|
778
718
|
),
|
|
779
|
-
(onArchive || onDelete) && /* @__PURE__ */ jsx27("div", { className: "absolute end-1.5 top-1/2 inline-flex -translate-y-1/2 opacity-0 group-hover:opacity-100", children: /* @__PURE__ */
|
|
719
|
+
(onArchive || onDelete) && /* @__PURE__ */ jsx27("div", { className: "absolute end-1.5 top-1/2 inline-flex -translate-y-1/2 opacity-0 group-hover:opacity-100", children: /* @__PURE__ */ jsxs10(
|
|
780
720
|
DropdownMenu,
|
|
781
721
|
{
|
|
782
722
|
trigger: /* @__PURE__ */ jsx27(
|
|
@@ -790,12 +730,12 @@ function ThreadListRow({ title, active, onSelect, onArchive, onDelete, className
|
|
|
790
730
|
side: "right",
|
|
791
731
|
align: "start",
|
|
792
732
|
children: [
|
|
793
|
-
onArchive && /* @__PURE__ */
|
|
794
|
-
/* @__PURE__ */ jsx27(
|
|
733
|
+
onArchive && /* @__PURE__ */ jsxs10(DropdownMenu.Item, { onClick: onArchive, children: [
|
|
734
|
+
/* @__PURE__ */ jsx27(IconProvider, { icon: "box-archive", size: 0.75 }),
|
|
795
735
|
"Archive"
|
|
796
736
|
] }),
|
|
797
|
-
onDelete && /* @__PURE__ */
|
|
798
|
-
/* @__PURE__ */ jsx27(
|
|
737
|
+
onDelete && /* @__PURE__ */ jsxs10(DropdownMenu.Item, { onClick: onDelete, className: "text-destructive hover:bg-destructive/10", children: [
|
|
738
|
+
/* @__PURE__ */ jsx27(IconProvider, { icon: "trash", size: 0.75 }),
|
|
799
739
|
"Delete"
|
|
800
740
|
] })
|
|
801
741
|
]
|
|
@@ -809,7 +749,7 @@ function ThreadListRow({ title, active, onSelect, onArchive, onDelete, className
|
|
|
809
749
|
// src/atoms/ThreadListMisc.tsx
|
|
810
750
|
import Button from "tfy-web-components/components/atoms/Button";
|
|
811
751
|
import Skeleton2 from "tfy-web-components/components/atoms/Skeleton";
|
|
812
|
-
import { jsx as jsx28, jsxs as
|
|
752
|
+
import { jsx as jsx28, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
813
753
|
function ThreadListNewButton({ className, ...rest }) {
|
|
814
754
|
return /* @__PURE__ */ jsx28(
|
|
815
755
|
Button.Ghost,
|
|
@@ -829,18 +769,18 @@ function ThreadListEmptyState({ message = "No threads yet", className }) {
|
|
|
829
769
|
return /* @__PURE__ */ jsx28("div", { className: cn("text-muted-foreground flex flex-1 items-center justify-center px-4 text-center text-sm", className), children: message });
|
|
830
770
|
}
|
|
831
771
|
function ThreadListShell({ header, children, className }) {
|
|
832
|
-
return /* @__PURE__ */
|
|
772
|
+
return /* @__PURE__ */ jsxs11("div", { className: cn("font-sans-flex flex min-h-0 flex-1 flex-col gap-1 overflow-hidden p-3", className), children: [
|
|
833
773
|
header,
|
|
834
774
|
/* @__PURE__ */ jsx28("div", { className: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto pb-1", children })
|
|
835
775
|
] });
|
|
836
776
|
}
|
|
837
777
|
|
|
838
778
|
// src/atoms/MessageActionBar.tsx
|
|
839
|
-
import { jsx as jsx29, jsxs as
|
|
779
|
+
import { jsx as jsx29, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
840
780
|
function MessageActionBar({ isCopied, onCopy, className }) {
|
|
841
781
|
const MessageTimestamp2 = useSlot("MessageTimestamp");
|
|
842
782
|
const IconButton5 = useSlot("IconButton");
|
|
843
|
-
return /* @__PURE__ */
|
|
783
|
+
return /* @__PURE__ */ jsxs12(
|
|
844
784
|
"div",
|
|
845
785
|
{
|
|
846
786
|
className: cn(
|
|
@@ -1009,24 +949,18 @@ function MessageTimestamp({ className }) {
|
|
|
1009
949
|
}
|
|
1010
950
|
|
|
1011
951
|
// src/atoms/UserMessageActionBar.tsx
|
|
1012
|
-
import { ActionBarPrimitive,
|
|
952
|
+
import { ActionBarPrimitive, useAui } from "@assistant-ui/react";
|
|
1013
953
|
import { useActionBarCopy, useActionBarEdit } from "@assistant-ui/core/react";
|
|
1014
|
-
import {
|
|
1015
|
-
import { jsx as jsx36, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1016
|
-
function parseTurnIdFromMessageId(messageId) {
|
|
1017
|
-
return messageId.replace(/-user$/, "");
|
|
1018
|
-
}
|
|
954
|
+
import { jsx as jsx36, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1019
955
|
function UserMessageActionBar({ className }) {
|
|
1020
956
|
const IconButton5 = useSlot("IconButton");
|
|
1021
957
|
const MessageTimestamp2 = useSlot("MessageTimestamp");
|
|
1022
|
-
const
|
|
1023
|
-
const turnId = parseTurnIdFromMessageId(messageId);
|
|
1024
|
-
const resetFromTurn = useTrueFoundryResetFromTurn();
|
|
958
|
+
const aui = useAui();
|
|
1025
959
|
const { edit, disabled: editDisabled } = useActionBarEdit();
|
|
1026
960
|
const { copy, isCopied } = useActionBarCopy({
|
|
1027
961
|
copyToClipboard: (text) => navigator.clipboard.writeText(text)
|
|
1028
962
|
});
|
|
1029
|
-
return /* @__PURE__ */
|
|
963
|
+
return /* @__PURE__ */ jsxs13(
|
|
1030
964
|
ActionBarPrimitive.Root,
|
|
1031
965
|
{
|
|
1032
966
|
hideWhenRunning: true,
|
|
@@ -1040,7 +974,10 @@ function UserMessageActionBar({ className }) {
|
|
|
1040
974
|
{
|
|
1041
975
|
icon: "rotate-right",
|
|
1042
976
|
tooltip: "Try again",
|
|
1043
|
-
onClick: () =>
|
|
977
|
+
onClick: () => {
|
|
978
|
+
aui.message().composer().beginEdit();
|
|
979
|
+
aui.message().composer().send({ startRun: true });
|
|
980
|
+
}
|
|
1044
981
|
}
|
|
1045
982
|
),
|
|
1046
983
|
/* @__PURE__ */ jsx36(
|
|
@@ -1147,10 +1084,10 @@ function WelcomeScreen({ heading = "How can I help you today?", className }) {
|
|
|
1147
1084
|
|
|
1148
1085
|
// src/atoms/Toast.tsx
|
|
1149
1086
|
import { XIcon } from "lucide-react";
|
|
1150
|
-
import { jsx as jsx39, jsxs as
|
|
1087
|
+
import { jsx as jsx39, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1151
1088
|
function Toast({ title, description, open, onOpenChange, className }) {
|
|
1152
1089
|
if (!open) return null;
|
|
1153
|
-
return /* @__PURE__ */
|
|
1090
|
+
return /* @__PURE__ */ jsxs14(
|
|
1154
1091
|
"div",
|
|
1155
1092
|
{
|
|
1156
1093
|
className: cn(
|
|
@@ -1159,11 +1096,11 @@ function Toast({ title, description, open, onOpenChange, className }) {
|
|
|
1159
1096
|
className
|
|
1160
1097
|
),
|
|
1161
1098
|
children: [
|
|
1162
|
-
/* @__PURE__ */
|
|
1099
|
+
/* @__PURE__ */ jsxs14("div", { className: "grid min-h-0 min-w-0 flex-1 gap-1 overflow-y-auto pe-6", children: [
|
|
1163
1100
|
/* @__PURE__ */ jsx39("div", { className: "text-sm leading-none font-semibold", children: title }),
|
|
1164
1101
|
/* @__PURE__ */ jsx39("div", { className: "font-mono text-sm break-words whitespace-pre-wrap", children: description })
|
|
1165
1102
|
] }),
|
|
1166
|
-
/* @__PURE__ */
|
|
1103
|
+
/* @__PURE__ */ jsxs14(
|
|
1167
1104
|
"button",
|
|
1168
1105
|
{
|
|
1169
1106
|
onClick: () => onOpenChange(false),
|
|
@@ -1190,9 +1127,9 @@ var defaultSlots = {
|
|
|
1190
1127
|
LightTooltip,
|
|
1191
1128
|
Modal: Modal2,
|
|
1192
1129
|
Dialog,
|
|
1193
|
-
Accordion:
|
|
1194
|
-
AccordionSummary:
|
|
1195
|
-
AccordionDetails:
|
|
1130
|
+
Accordion: Accordion2,
|
|
1131
|
+
AccordionSummary: AccordionSummary2,
|
|
1132
|
+
AccordionDetails: AccordionDetails2,
|
|
1196
1133
|
Skeleton: Skeleton3,
|
|
1197
1134
|
ReasoningCard,
|
|
1198
1135
|
AskUserPrompt,
|
|
@@ -1344,16 +1281,16 @@ import { LightTooltip as LightTooltip2 } from "tfy-web-components/components/ato
|
|
|
1344
1281
|
import { default as default4 } from "tfy-web-components/components/atoms/Modal";
|
|
1345
1282
|
import { default as default5 } from "tfy-web-components/components/molecules/Dialog";
|
|
1346
1283
|
import {
|
|
1347
|
-
Accordion as
|
|
1348
|
-
AccordionSummary as
|
|
1349
|
-
AccordionDetails as
|
|
1284
|
+
Accordion as Accordion3,
|
|
1285
|
+
AccordionSummary as AccordionSummary3,
|
|
1286
|
+
AccordionDetails as AccordionDetails3
|
|
1350
1287
|
} from "tfy-web-components/components/atoms/Accordion";
|
|
1351
1288
|
import { default as default6 } from "tfy-web-components/components/atoms/Skeleton";
|
|
1352
1289
|
|
|
1353
1290
|
// src/containers/ThreadContainer.tsx
|
|
1354
1291
|
import { useEffect as useEffect6 } from "react";
|
|
1355
1292
|
import { preloadMarkdownOpenUI } from "tfy-web-components/components/molecules/Markdown";
|
|
1356
|
-
import { ThreadPrimitive, useAuiState as
|
|
1293
|
+
import { ThreadPrimitive, useAuiState as useAuiState10 } from "@assistant-ui/react";
|
|
1357
1294
|
|
|
1358
1295
|
// src/hooks/useComposerBusyState.ts
|
|
1359
1296
|
import { useThreadIsRunning } from "@assistant-ui/core/react";
|
|
@@ -1399,7 +1336,7 @@ function useComposerBusyState() {
|
|
|
1399
1336
|
}
|
|
1400
1337
|
|
|
1401
1338
|
// src/containers/AssistantMessageContainer.tsx
|
|
1402
|
-
import { MessagePrimitive as MessagePrimitive2, useAuiState as
|
|
1339
|
+
import { MessagePrimitive as MessagePrimitive2, useAuiState as useAuiState5 } from "@assistant-ui/react";
|
|
1403
1340
|
import { useActionBarCopy as useActionBarCopy2, useMessageError, useThreadIsRunning as useThreadIsRunning2 } from "@assistant-ui/core/react";
|
|
1404
1341
|
|
|
1405
1342
|
// src/utils/computeAgentStepsSplit.ts
|
|
@@ -1446,13 +1383,13 @@ function computeAgentStepsSplit(parts, isRunning) {
|
|
|
1446
1383
|
|
|
1447
1384
|
// src/containers/AssistantTextContainer.tsx
|
|
1448
1385
|
import { useCallback as useCallback3 } from "react";
|
|
1449
|
-
import { useAuiState as
|
|
1386
|
+
import { useAuiState as useAuiState2 } from "@assistant-ui/react";
|
|
1450
1387
|
import { useTrueFoundryDownloadSandboxFile } from "@truefoundry/assistant-ui-runtime";
|
|
1451
1388
|
|
|
1452
1389
|
// src/containers/ErrorToasterContainer.tsx
|
|
1453
1390
|
import { createContext as createContext4, useCallback as useCallback2, useContext as useContext4, useMemo as useMemo2, useState as useState3 } from "react";
|
|
1454
1391
|
import { TrueFoundryGatewayError } from "truefoundry-gateway-sdk";
|
|
1455
|
-
import { jsx as jsx41, jsxs as
|
|
1392
|
+
import { jsx as jsx41, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1456
1393
|
var ErrorToasterContext = createContext4(null);
|
|
1457
1394
|
function formatErrorBody(body) {
|
|
1458
1395
|
if (body == null) return void 0;
|
|
@@ -1485,7 +1422,7 @@ function ErrorToasterProvider({ children }) {
|
|
|
1485
1422
|
setOpen(true);
|
|
1486
1423
|
}, []);
|
|
1487
1424
|
const value = useMemo2(() => ({ showError }), [showError]);
|
|
1488
|
-
return /* @__PURE__ */
|
|
1425
|
+
return /* @__PURE__ */ jsxs15(ErrorToasterContext.Provider, { value, children: [
|
|
1489
1426
|
children,
|
|
1490
1427
|
/* @__PURE__ */ jsx41(ToastStack2, { children: toast != null && /* @__PURE__ */ jsx41(Toast2, { title: toast.title, description: toast.description, open, onOpenChange: setOpen }) })
|
|
1491
1428
|
] });
|
|
@@ -1519,10 +1456,10 @@ function AssistantTextContainer() {
|
|
|
1519
1456
|
const Markdown2 = useSlot("Markdown");
|
|
1520
1457
|
const downloadSandboxFile = useTrueFoundryDownloadSandboxFile();
|
|
1521
1458
|
const errorToaster = useErrorToasterOptional();
|
|
1522
|
-
const text =
|
|
1459
|
+
const text = useAuiState2(
|
|
1523
1460
|
(s) => s.part.type === "text" || s.part.type === "reasoning" ? s.part.text : ""
|
|
1524
1461
|
);
|
|
1525
|
-
const isStreaming =
|
|
1462
|
+
const isStreaming = useAuiState2((s) => {
|
|
1526
1463
|
if (s.message.status?.type !== "running") return false;
|
|
1527
1464
|
const lastIndex = s.message.parts.length - 1;
|
|
1528
1465
|
if (lastIndex < 0) return false;
|
|
@@ -1543,13 +1480,13 @@ function AssistantTextContainer() {
|
|
|
1543
1480
|
}
|
|
1544
1481
|
|
|
1545
1482
|
// src/containers/MessageImageContainer.tsx
|
|
1546
|
-
import { useAuiState as
|
|
1483
|
+
import { useAuiState as useAuiState3 } from "@assistant-ui/react";
|
|
1547
1484
|
import { jsx as jsx43 } from "react/jsx-runtime";
|
|
1548
1485
|
function MessageImageContainer() {
|
|
1549
1486
|
const AttachmentCard2 = useSlot("AttachmentCard");
|
|
1550
1487
|
const AttachmentPreviewDialog2 = useSlot("AttachmentPreviewDialog");
|
|
1551
|
-
const image =
|
|
1552
|
-
const filename =
|
|
1488
|
+
const image = useAuiState3((s) => s.part.type === "image" ? s.part.image : "");
|
|
1489
|
+
const filename = useAuiState3(
|
|
1553
1490
|
(s) => s.part.type === "image" ? s.part.filename : void 0
|
|
1554
1491
|
);
|
|
1555
1492
|
if (!image) {
|
|
@@ -1570,14 +1507,14 @@ function MessageImageContainer() {
|
|
|
1570
1507
|
|
|
1571
1508
|
// src/containers/ReasoningContainer.tsx
|
|
1572
1509
|
import { useCallback as useCallback4, useRef, useState as useState4 } from "react";
|
|
1573
|
-
import { useAuiState as
|
|
1510
|
+
import { useAuiState as useAuiState4 } from "@assistant-ui/react";
|
|
1574
1511
|
import { jsx as jsx44 } from "react/jsx-runtime";
|
|
1575
1512
|
function ReasoningContainer({ group }) {
|
|
1576
1513
|
const ReasoningCard2 = useSlot("ReasoningCard");
|
|
1577
|
-
const content =
|
|
1514
|
+
const content = useAuiState4(
|
|
1578
1515
|
(s) => group.indices.map((i) => s.message.parts[i]).filter((p) => p != null && p.type === "reasoning").map((p) => p.text ?? "").join("")
|
|
1579
1516
|
);
|
|
1580
|
-
const streaming =
|
|
1517
|
+
const streaming = useAuiState4((s) => {
|
|
1581
1518
|
if (s.message.status?.type !== "running") return false;
|
|
1582
1519
|
const lastIndex = s.message.parts.length - 1;
|
|
1583
1520
|
if (lastIndex < 0) return false;
|
|
@@ -1611,7 +1548,7 @@ function ReasoningContainer({ group }) {
|
|
|
1611
1548
|
const reasoningTimeText = null;
|
|
1612
1549
|
const previewText = content.replace(/\s+/g, " ").trim();
|
|
1613
1550
|
const isShortText = !streaming && content.length > 0 && !isMultiLine;
|
|
1614
|
-
const headingText =
|
|
1551
|
+
const headingText = "Reasoning";
|
|
1615
1552
|
return /* @__PURE__ */ jsx44(
|
|
1616
1553
|
ReasoningCard2,
|
|
1617
1554
|
{
|
|
@@ -2278,7 +2215,7 @@ function AssistantMessageContainer() {
|
|
|
2278
2215
|
const { copy, isCopied } = useActionBarCopy2({
|
|
2279
2216
|
copyToClipboard: (text) => navigator.clipboard.writeText(text)
|
|
2280
2217
|
});
|
|
2281
|
-
const parts =
|
|
2218
|
+
const parts = useAuiState5((s) => s.message.parts);
|
|
2282
2219
|
const { cutIndex, hasFinal, toolCount, thinkingCount } = computeAgentStepsSplit(parts, isRunning);
|
|
2283
2220
|
const groupBy = (part, _context) => {
|
|
2284
2221
|
const index = parts.findIndex((p) => p === part);
|
|
@@ -2384,16 +2321,16 @@ function HistoryLoaderContainer() {
|
|
|
2384
2321
|
import {
|
|
2385
2322
|
ComposerPrimitive as ComposerPrimitive2,
|
|
2386
2323
|
MessagePrimitive as MessagePrimitive4,
|
|
2387
|
-
useAuiState as
|
|
2324
|
+
useAuiState as useAuiState8
|
|
2388
2325
|
} from "@assistant-ui/react";
|
|
2389
2326
|
import { useComposerCancel, useComposerSend, useThreadIsRunning as useThreadIsRunning3 } from "@assistant-ui/core/react";
|
|
2390
2327
|
|
|
2391
2328
|
// src/containers/AttachmentsContainer.tsx
|
|
2392
|
-
import { ComposerPrimitive, MessagePrimitive as MessagePrimitive3, useAui, useAuiState as
|
|
2329
|
+
import { ComposerPrimitive, MessagePrimitive as MessagePrimitive3, useAui as useAui2, useAuiState as useAuiState7 } from "@assistant-ui/react";
|
|
2393
2330
|
|
|
2394
2331
|
// src/containers/useAttachmentPreviewSrc.ts
|
|
2395
2332
|
import { useEffect as useEffect5, useState as useState11 } from "react";
|
|
2396
|
-
import { useAuiState as
|
|
2333
|
+
import { useAuiState as useAuiState6 } from "@assistant-ui/react";
|
|
2397
2334
|
function isImageAttachment(type, contentType) {
|
|
2398
2335
|
return type === "image" || (contentType?.startsWith("image/") ?? false);
|
|
2399
2336
|
}
|
|
@@ -2411,10 +2348,10 @@ function useFileObjectUrl(file) {
|
|
|
2411
2348
|
return src;
|
|
2412
2349
|
}
|
|
2413
2350
|
function useAttachmentPreviewSrc() {
|
|
2414
|
-
const type =
|
|
2415
|
-
const contentType =
|
|
2416
|
-
const file =
|
|
2417
|
-
const contentSrc =
|
|
2351
|
+
const type = useAuiState6((s) => s.attachment.type);
|
|
2352
|
+
const contentType = useAuiState6((s) => s.attachment.contentType);
|
|
2353
|
+
const file = useAuiState6((s) => "file" in s.attachment ? s.attachment.file : void 0);
|
|
2354
|
+
const contentSrc = useAuiState6((s) => {
|
|
2418
2355
|
if (!isImageAttachment(s.attachment.type, s.attachment.contentType)) return void 0;
|
|
2419
2356
|
const imagePart = s.attachment.content?.find((part) => part.type === "image");
|
|
2420
2357
|
if (imagePart?.type === "image" && imagePart.image) return imagePart.image;
|
|
@@ -2431,10 +2368,10 @@ import { jsx as jsx52 } from "react/jsx-runtime";
|
|
|
2431
2368
|
function ComposerAttachmentItem() {
|
|
2432
2369
|
const AttachmentCard2 = useSlot("AttachmentCard");
|
|
2433
2370
|
const AttachmentPreviewDialog2 = useSlot("AttachmentPreviewDialog");
|
|
2434
|
-
const aui =
|
|
2435
|
-
const name =
|
|
2436
|
-
const contentType =
|
|
2437
|
-
const type =
|
|
2371
|
+
const aui = useAui2();
|
|
2372
|
+
const name = useAuiState7((s) => s.attachment.name);
|
|
2373
|
+
const contentType = useAuiState7((s) => s.attachment.contentType);
|
|
2374
|
+
const type = useAuiState7((s) => s.attachment.type);
|
|
2438
2375
|
const isImage = isImageAttachment(type, contentType);
|
|
2439
2376
|
const previewSrc = useAttachmentPreviewSrc();
|
|
2440
2377
|
return /* @__PURE__ */ jsx52(AttachmentPreviewDialog2, { previewSrc, children: /* @__PURE__ */ jsx52(
|
|
@@ -2452,9 +2389,9 @@ function ComposerAttachmentItem() {
|
|
|
2452
2389
|
function MessageAttachmentItem() {
|
|
2453
2390
|
const AttachmentCard2 = useSlot("AttachmentCard");
|
|
2454
2391
|
const AttachmentPreviewDialog2 = useSlot("AttachmentPreviewDialog");
|
|
2455
|
-
const name =
|
|
2456
|
-
const contentType =
|
|
2457
|
-
const type =
|
|
2392
|
+
const name = useAuiState7((s) => s.attachment.name);
|
|
2393
|
+
const contentType = useAuiState7((s) => s.attachment.contentType);
|
|
2394
|
+
const type = useAuiState7((s) => s.attachment.type);
|
|
2458
2395
|
const isImage = isImageAttachment(type, contentType);
|
|
2459
2396
|
const previewSrc = useAttachmentPreviewSrc();
|
|
2460
2397
|
const card = /* @__PURE__ */ jsx52(
|
|
@@ -2485,9 +2422,9 @@ function ComposerAttachmentPickerContainer() {
|
|
|
2485
2422
|
}
|
|
2486
2423
|
|
|
2487
2424
|
// src/containers/UserEditComposerContainer.tsx
|
|
2488
|
-
import { jsx as jsx53, jsxs as
|
|
2425
|
+
import { jsx as jsx53, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2489
2426
|
function ReadOnlyMessageAttachments() {
|
|
2490
|
-
const hasAttachments =
|
|
2427
|
+
const hasAttachments = useAuiState8(
|
|
2491
2428
|
(s) => (s.message.attachments?.length ?? 0) > 0
|
|
2492
2429
|
);
|
|
2493
2430
|
if (!hasAttachments) {
|
|
@@ -2519,7 +2456,7 @@ function UserEditComposerContainer() {
|
|
|
2519
2456
|
className: "max-h-32 min-h-10 w-full resize-none border-none bg-transparent p-0 text-base leading-[1.34] outline-none focus:shadow-none"
|
|
2520
2457
|
}
|
|
2521
2458
|
) }),
|
|
2522
|
-
footer: /* @__PURE__ */
|
|
2459
|
+
footer: /* @__PURE__ */ jsxs16("div", { className: "flex items-center justify-end gap-2", children: [
|
|
2523
2460
|
/* @__PURE__ */ jsx53(
|
|
2524
2461
|
Button4.Secondary,
|
|
2525
2462
|
{
|
|
@@ -2546,14 +2483,14 @@ function UserEditComposerContainer() {
|
|
|
2546
2483
|
}
|
|
2547
2484
|
|
|
2548
2485
|
// src/containers/UserMessageContainer.tsx
|
|
2549
|
-
import { MessagePrimitive as MessagePrimitive5, useAuiState as
|
|
2486
|
+
import { MessagePrimitive as MessagePrimitive5, useAuiState as useAuiState9 } from "@assistant-ui/react";
|
|
2550
2487
|
import { useThreadIsRunning as useThreadIsRunning4 } from "@assistant-ui/core/react";
|
|
2551
2488
|
import { jsx as jsx54 } from "react/jsx-runtime";
|
|
2552
2489
|
function UserMessageContainer() {
|
|
2553
2490
|
const UserMessageBubble2 = useSlot("UserMessageBubble");
|
|
2554
2491
|
const UserMessageActionBar2 = useSlot("UserMessageActionBar");
|
|
2555
2492
|
const isRunning = useThreadIsRunning4();
|
|
2556
|
-
const text =
|
|
2493
|
+
const text = useAuiState9(
|
|
2557
2494
|
(s) => s.message.content.filter((part) => part.type === "text").map((part) => part.text).join("\n")
|
|
2558
2495
|
);
|
|
2559
2496
|
return /* @__PURE__ */ jsx54(MessagePrimitive5.Root, { "data-role": "user", children: /* @__PURE__ */ jsx54(
|
|
@@ -2567,10 +2504,10 @@ function UserMessageContainer() {
|
|
|
2567
2504
|
}
|
|
2568
2505
|
|
|
2569
2506
|
// src/containers/ThreadContainer.tsx
|
|
2570
|
-
import { Fragment as Fragment3, jsx as jsx55, jsxs as
|
|
2507
|
+
import { Fragment as Fragment3, jsx as jsx55, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2571
2508
|
var isNewChatView = (s) => s.thread.messages.length === 0 && (!s.thread.isLoading || s.threads.isLoading);
|
|
2572
2509
|
function ThreadMessage({ isEditing }) {
|
|
2573
|
-
const role =
|
|
2510
|
+
const role = useAuiState10((s) => s.message.role);
|
|
2574
2511
|
if (role === "user") {
|
|
2575
2512
|
if (isEditing) {
|
|
2576
2513
|
return /* @__PURE__ */ jsx55(UserEditComposerContainer, {});
|
|
@@ -2590,12 +2527,12 @@ function ThreadContainer({ composer }) {
|
|
|
2590
2527
|
const WelcomeScreen2 = useSlot("WelcomeScreen");
|
|
2591
2528
|
const MessageListSkeleton2 = useSlot("MessageListSkeleton");
|
|
2592
2529
|
const ScrollToBottomButton2 = useSlot("ScrollToBottomButton");
|
|
2593
|
-
const isEmpty =
|
|
2594
|
-
const isLoading =
|
|
2595
|
-
return /* @__PURE__ */ jsx55(ComposerBusyProvider, { children: /* @__PURE__ */ jsx55(ThreadPrimitive.Root, { asChild: true, children: /* @__PURE__ */
|
|
2596
|
-
/* @__PURE__ */ jsx55(ThreadPrimitive.Viewport, { asChild: true, turnAnchor: "top", autoScroll: true, children: /* @__PURE__ */
|
|
2530
|
+
const isEmpty = useAuiState10(isNewChatView);
|
|
2531
|
+
const isLoading = useAuiState10((s) => s.thread.isLoading);
|
|
2532
|
+
return /* @__PURE__ */ jsx55(ComposerBusyProvider, { children: /* @__PURE__ */ jsx55(ThreadPrimitive.Root, { asChild: true, children: /* @__PURE__ */ jsxs17(ThreadRootShell2, { children: [
|
|
2533
|
+
/* @__PURE__ */ jsx55(ThreadPrimitive.Viewport, { asChild: true, turnAnchor: "top", autoScroll: true, children: /* @__PURE__ */ jsxs17(ThreadViewportShell2, { isEmpty, children: [
|
|
2597
2534
|
isEmpty && /* @__PURE__ */ jsx55(WelcomeScreen2, {}),
|
|
2598
|
-
isLoading ? /* @__PURE__ */ jsx55(MessageListSkeleton2, {}) : /* @__PURE__ */
|
|
2535
|
+
isLoading ? /* @__PURE__ */ jsx55(MessageListSkeleton2, {}) : /* @__PURE__ */ jsxs17(Fragment3, { children: [
|
|
2599
2536
|
/* @__PURE__ */ jsx55(HistoryLoaderContainer, {}),
|
|
2600
2537
|
/* @__PURE__ */ jsx55(MessageGroup2, { children: /* @__PURE__ */ jsx55(ThreadPrimitive.Messages, { children: ({ message }) => /* @__PURE__ */ jsx55(
|
|
2601
2538
|
ThreadMessage,
|
|
@@ -2605,7 +2542,7 @@ function ThreadContainer({ composer }) {
|
|
|
2605
2542
|
) }) })
|
|
2606
2543
|
] })
|
|
2607
2544
|
] }) }),
|
|
2608
|
-
!isLoading && /* @__PURE__ */
|
|
2545
|
+
!isLoading && /* @__PURE__ */ jsxs17(ThreadComposerAreaShell2, { isEmpty, children: [
|
|
2609
2546
|
!isEmpty && /* @__PURE__ */ jsx55(ThreadPrimitive.ScrollToBottom, { asChild: true, children: /* @__PURE__ */ jsx55(ScrollToBottomButton2, {}) }),
|
|
2610
2547
|
composer
|
|
2611
2548
|
] })
|
|
@@ -2614,7 +2551,7 @@ function ThreadContainer({ composer }) {
|
|
|
2614
2551
|
|
|
2615
2552
|
// src/containers/ToolGroupContainer.tsx
|
|
2616
2553
|
import { useState as useState12 } from "react";
|
|
2617
|
-
import { useAuiState as
|
|
2554
|
+
import { useAuiState as useAuiState11 } from "@assistant-ui/react";
|
|
2618
2555
|
import { jsx as jsx56 } from "react/jsx-runtime";
|
|
2619
2556
|
function ToolGroupContainer({
|
|
2620
2557
|
children,
|
|
@@ -2622,7 +2559,7 @@ function ToolGroupContainer({
|
|
|
2622
2559
|
}) {
|
|
2623
2560
|
const ToolGroupCard2 = useSlot("ToolGroupCard");
|
|
2624
2561
|
const toolCallCount = group.indices.length;
|
|
2625
|
-
const active =
|
|
2562
|
+
const active = useAuiState11((s) => {
|
|
2626
2563
|
if (s.message.status?.type !== "running") return false;
|
|
2627
2564
|
const lastIndex = s.message.parts.length - 1;
|
|
2628
2565
|
if (lastIndex < 0) return false;
|
|
@@ -2650,11 +2587,11 @@ function ToolGroupContainer({
|
|
|
2650
2587
|
|
|
2651
2588
|
// src/containers/ComposerContainer.tsx
|
|
2652
2589
|
import { useRef as useRef5 } from "react";
|
|
2653
|
-
import { useAui as
|
|
2590
|
+
import { useAui as useAui3, useAuiState as useAuiState13 } from "@assistant-ui/react";
|
|
2654
2591
|
import { useTrueFoundryCancel } from "@truefoundry/assistant-ui-runtime";
|
|
2655
2592
|
|
|
2656
2593
|
// src/hooks/useComposerPauseView.ts
|
|
2657
|
-
import { useAuiState as
|
|
2594
|
+
import { useAuiState as useAuiState12 } from "@assistant-ui/react";
|
|
2658
2595
|
import { useTrueFoundryToolResponses } from "@truefoundry/assistant-ui-runtime";
|
|
2659
2596
|
function threadHasPendingMcpAuth(s) {
|
|
2660
2597
|
const messages = s.thread.messages;
|
|
@@ -2664,7 +2601,7 @@ function threadHasPendingMcpAuth(s) {
|
|
|
2664
2601
|
return last.metadata?.custom?.pendingMcpAuth === true;
|
|
2665
2602
|
}
|
|
2666
2603
|
function useComposerPauseView() {
|
|
2667
|
-
const mcpPending =
|
|
2604
|
+
const mcpPending = useAuiState12(threadHasPendingMcpAuth);
|
|
2668
2605
|
const { pending: toolResponsesPending } = useTrueFoundryToolResponses();
|
|
2669
2606
|
if (mcpPending) {
|
|
2670
2607
|
return { kind: "mcp" };
|
|
@@ -2794,13 +2731,13 @@ function McpAuthContainer() {
|
|
|
2794
2731
|
}
|
|
2795
2732
|
|
|
2796
2733
|
// src/containers/ComposerContainer.tsx
|
|
2797
|
-
import { Fragment as Fragment4, jsx as jsx59, jsxs as
|
|
2734
|
+
import { Fragment as Fragment4, jsx as jsx59, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
2798
2735
|
function ComposerContainer({
|
|
2799
2736
|
placeholder = "Ask anything... (Shift+Enter for new line)"
|
|
2800
2737
|
}) {
|
|
2801
2738
|
const ComposerShell2 = useSlot("ComposerShell");
|
|
2802
|
-
const aui =
|
|
2803
|
-
const text =
|
|
2739
|
+
const aui = useAui3();
|
|
2740
|
+
const text = useAuiState13((s) => s.composer.text);
|
|
2804
2741
|
const { isBusy, send, resetBusy } = useComposerBusyState();
|
|
2805
2742
|
const pauseView = useComposerPauseView();
|
|
2806
2743
|
const cancel = useTrueFoundryCancel();
|
|
@@ -2811,7 +2748,7 @@ function ComposerContainer({
|
|
|
2811
2748
|
if (pauseView.kind === "ask-user") {
|
|
2812
2749
|
return /* @__PURE__ */ jsx59(AskUserContainer, {});
|
|
2813
2750
|
}
|
|
2814
|
-
return /* @__PURE__ */
|
|
2751
|
+
return /* @__PURE__ */ jsxs18(Fragment4, { children: [
|
|
2815
2752
|
/* @__PURE__ */ jsx59(
|
|
2816
2753
|
"input",
|
|
2817
2754
|
{
|
|
@@ -2851,22 +2788,22 @@ function ComposerContainer({
|
|
|
2851
2788
|
}
|
|
2852
2789
|
|
|
2853
2790
|
// src/containers/ThreadListContainer.tsx
|
|
2854
|
-
import { useAui as
|
|
2791
|
+
import { useAui as useAui4, useAuiState as useAuiState14 } from "@assistant-ui/react";
|
|
2855
2792
|
import { useEffect as useEffect8, useRef as useRef6 } from "react";
|
|
2856
|
-
import { Fragment as Fragment5, jsx as jsx60, jsxs as
|
|
2793
|
+
import { Fragment as Fragment5, jsx as jsx60, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
2857
2794
|
function ThreadListContainer() {
|
|
2858
2795
|
const ThreadListShell2 = useSlot("ThreadListShell");
|
|
2859
2796
|
const ThreadListNewButton2 = useSlot("ThreadListNewButton");
|
|
2860
2797
|
const ThreadListRow2 = useSlot("ThreadListRow");
|
|
2861
2798
|
const ThreadListRowSkeleton2 = useSlot("ThreadListRowSkeleton");
|
|
2862
2799
|
const ThreadListEmptyState2 = useSlot("ThreadListEmptyState");
|
|
2863
|
-
const aui =
|
|
2864
|
-
const isLoading =
|
|
2865
|
-
const isLoadingMore =
|
|
2866
|
-
const hasMore =
|
|
2867
|
-
const threadIds =
|
|
2868
|
-
const threadItems =
|
|
2869
|
-
const mainThreadId =
|
|
2800
|
+
const aui = useAui4();
|
|
2801
|
+
const isLoading = useAuiState14((s) => s.threads.isLoading);
|
|
2802
|
+
const isLoadingMore = useAuiState14((s) => s.threads.isLoadingMore);
|
|
2803
|
+
const hasMore = useAuiState14((s) => s.threads.hasMore);
|
|
2804
|
+
const threadIds = useAuiState14((s) => s.threads.threadIds);
|
|
2805
|
+
const threadItems = useAuiState14((s) => s.threads.threadItems);
|
|
2806
|
+
const mainThreadId = useAuiState14((s) => s.threads.mainThreadId);
|
|
2870
2807
|
const sentinelRef = useRef6(null);
|
|
2871
2808
|
useEffect8(() => {
|
|
2872
2809
|
const node = sentinelRef.current;
|
|
@@ -2880,7 +2817,7 @@ function ThreadListContainer() {
|
|
|
2880
2817
|
return () => observer.disconnect();
|
|
2881
2818
|
}, [aui, hasMore, isLoadingMore]);
|
|
2882
2819
|
const itemsById = new Map(threadItems.map((item) => [item.id, item]));
|
|
2883
|
-
return /* @__PURE__ */
|
|
2820
|
+
return /* @__PURE__ */ jsxs19(ThreadListShell2, { header: /* @__PURE__ */ jsx60(ThreadListNewButton2, { onClick: () => aui.threads().switchToNewThread() }), children: [
|
|
2884
2821
|
isLoading ? /* @__PURE__ */ jsx60(ThreadListRowSkeleton2, {}) : threadIds.length === 0 ? /* @__PURE__ */ jsx60(ThreadListEmptyState2, {}) : threadIds.map((id) => {
|
|
2885
2822
|
const item = itemsById.get(id);
|
|
2886
2823
|
return /* @__PURE__ */ jsx60(
|
|
@@ -2895,7 +2832,7 @@ function ThreadListContainer() {
|
|
|
2895
2832
|
id
|
|
2896
2833
|
);
|
|
2897
2834
|
}),
|
|
2898
|
-
!isLoading && hasMore && /* @__PURE__ */
|
|
2835
|
+
!isLoading && hasMore && /* @__PURE__ */ jsxs19(Fragment5, { children: [
|
|
2899
2836
|
isLoadingMore && /* @__PURE__ */ jsx60(ThreadListRowSkeleton2, { count: 1 }),
|
|
2900
2837
|
/* @__PURE__ */ jsx60("div", { ref: sentinelRef, "aria-hidden": true })
|
|
2901
2838
|
] })
|
|
@@ -2908,9 +2845,9 @@ function Thread() {
|
|
|
2908
2845
|
return /* @__PURE__ */ jsx61(ThreadContainer, { composer: /* @__PURE__ */ jsx61(ComposerContainer, {}) });
|
|
2909
2846
|
}
|
|
2910
2847
|
export {
|
|
2911
|
-
|
|
2912
|
-
|
|
2913
|
-
|
|
2848
|
+
Accordion3 as Accordion,
|
|
2849
|
+
AccordionDetails3 as AccordionDetails,
|
|
2850
|
+
AccordionSummary3 as AccordionSummary,
|
|
2914
2851
|
AgentStepsCard,
|
|
2915
2852
|
AgentStepsContainer,
|
|
2916
2853
|
AskUserContainer,
|