@copilotz/chat-ui 0.6.6 → 0.6.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +496 -373
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +40 -24
- package/dist/index.d.ts +40 -24
- package/dist/index.js +408 -271
- package/dist/index.js.map +1 -1
- package/dist/styles.css +6 -0
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -40,7 +40,7 @@ __export(index_exports, {
|
|
|
40
40
|
module.exports = __toCommonJS(index_exports);
|
|
41
41
|
|
|
42
42
|
// src/components/chat/ChatUI.tsx
|
|
43
|
-
var
|
|
43
|
+
var import_react10 = require("react");
|
|
44
44
|
var import_react_virtual = require("@tanstack/react-virtual");
|
|
45
45
|
|
|
46
46
|
// src/config/chatConfig.ts
|
|
@@ -1165,7 +1165,7 @@ var Message = (0, import_react2.memo)(({
|
|
|
1165
1165
|
}, arePropsEqual);
|
|
1166
1166
|
|
|
1167
1167
|
// src/components/chat/Sidebar.tsx
|
|
1168
|
-
var
|
|
1168
|
+
var import_react4 = require("react");
|
|
1169
1169
|
|
|
1170
1170
|
// src/components/ui/input.tsx
|
|
1171
1171
|
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
@@ -2194,6 +2194,7 @@ function DropdownMenuSeparator({
|
|
|
2194
2194
|
var import_lucide_react8 = require("lucide-react");
|
|
2195
2195
|
|
|
2196
2196
|
// src/components/chat/UserMenu.tsx
|
|
2197
|
+
var import_react3 = __toESM(require("react"), 1);
|
|
2197
2198
|
var import_lucide_react7 = require("lucide-react");
|
|
2198
2199
|
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
2199
2200
|
var getInitials = (name, email) => {
|
|
@@ -2215,6 +2216,7 @@ var UserMenu = ({
|
|
|
2215
2216
|
callbacks,
|
|
2216
2217
|
currentTheme = "system",
|
|
2217
2218
|
showThemeOptions = true,
|
|
2219
|
+
sections = [],
|
|
2218
2220
|
additionalItems
|
|
2219
2221
|
}) => {
|
|
2220
2222
|
const { isMobile } = useSidebar();
|
|
@@ -2278,6 +2280,27 @@ var UserMenu = ({
|
|
|
2278
2280
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { children: labels.settings })
|
|
2279
2281
|
] }),
|
|
2280
2282
|
additionalItems,
|
|
2283
|
+
sections.map((section) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_react3.default.Fragment, { children: [
|
|
2284
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(DropdownMenuSeparator, {}),
|
|
2285
|
+
section.label && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(DropdownMenuLabel, { className: "px-2 py-2", children: section.label }),
|
|
2286
|
+
section.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
2287
|
+
DropdownMenuItem,
|
|
2288
|
+
{
|
|
2289
|
+
onClick: item.onSelect,
|
|
2290
|
+
disabled: item.disabled,
|
|
2291
|
+
className: [
|
|
2292
|
+
item.checked ? "bg-accent/60" : "",
|
|
2293
|
+
item.variant === "destructive" ? "text-destructive focus:text-destructive focus:bg-destructive/10" : ""
|
|
2294
|
+
].filter(Boolean).join(" "),
|
|
2295
|
+
children: [
|
|
2296
|
+
item.icon && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "mr-2 h-4 w-4 shrink-0", children: item.icon }),
|
|
2297
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "flex-1", children: item.label }),
|
|
2298
|
+
item.checked && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react7.Check, { className: "ml-2 h-4 w-4 text-primary" })
|
|
2299
|
+
]
|
|
2300
|
+
},
|
|
2301
|
+
item.id
|
|
2302
|
+
))
|
|
2303
|
+
] }, section.id)),
|
|
2281
2304
|
showThemeOptions && callbacks?.onThemeChange && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
|
|
2282
2305
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(DropdownMenuSeparator, {}),
|
|
2283
2306
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
@@ -2337,8 +2360,8 @@ var UserMenu = ({
|
|
|
2337
2360
|
// src/components/chat/Sidebar.tsx
|
|
2338
2361
|
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
2339
2362
|
var CreateThreadDialog = ({ config, onCreateThread, trigger }) => {
|
|
2340
|
-
const [title, setTitle] = (0,
|
|
2341
|
-
const [isOpen, setIsOpen] = (0,
|
|
2363
|
+
const [title, setTitle] = (0, import_react4.useState)("");
|
|
2364
|
+
const [isOpen, setIsOpen] = (0, import_react4.useState)(false);
|
|
2342
2365
|
const handleCreate = () => {
|
|
2343
2366
|
onCreateThread(title.trim() || void 0);
|
|
2344
2367
|
setTitle("");
|
|
@@ -2389,17 +2412,18 @@ var Sidebar2 = ({
|
|
|
2389
2412
|
userMenuCallbacks,
|
|
2390
2413
|
currentTheme,
|
|
2391
2414
|
showThemeOptions = true,
|
|
2415
|
+
userMenuSections,
|
|
2392
2416
|
userMenuAdditionalItems,
|
|
2393
2417
|
...props
|
|
2394
2418
|
}) => {
|
|
2395
|
-
const [searchQuery, setSearchQuery] = (0,
|
|
2396
|
-
const [showArchived, setShowArchived] = (0,
|
|
2397
|
-
const [deleteThreadId, setDeleteThreadId] = (0,
|
|
2398
|
-
const [editingThreadId, setEditingThreadId] = (0,
|
|
2399
|
-
const [editTitle, setEditTitle] = (0,
|
|
2400
|
-
const inputRef = (0,
|
|
2419
|
+
const [searchQuery, setSearchQuery] = (0, import_react4.useState)("");
|
|
2420
|
+
const [showArchived, setShowArchived] = (0, import_react4.useState)(false);
|
|
2421
|
+
const [deleteThreadId, setDeleteThreadId] = (0, import_react4.useState)(null);
|
|
2422
|
+
const [editingThreadId, setEditingThreadId] = (0, import_react4.useState)(null);
|
|
2423
|
+
const [editTitle, setEditTitle] = (0, import_react4.useState)("");
|
|
2424
|
+
const inputRef = (0, import_react4.useRef)(null);
|
|
2401
2425
|
const { setOpen } = useSidebar();
|
|
2402
|
-
(0,
|
|
2426
|
+
(0, import_react4.useEffect)(() => {
|
|
2403
2427
|
if (editingThreadId && inputRef.current) {
|
|
2404
2428
|
inputRef.current.focus();
|
|
2405
2429
|
inputRef.current.select();
|
|
@@ -2407,7 +2431,9 @@ var Sidebar2 = ({
|
|
|
2407
2431
|
}, [editingThreadId]);
|
|
2408
2432
|
const filteredThreads = threads.filter((thread) => {
|
|
2409
2433
|
const title = (thread.title ?? "").toString();
|
|
2410
|
-
const matchesSearch = title.toLowerCase().includes(
|
|
2434
|
+
const matchesSearch = title.toLowerCase().includes(
|
|
2435
|
+
searchQuery.toLowerCase()
|
|
2436
|
+
);
|
|
2411
2437
|
const matchesArchiveFilter = showArchived || !thread.isArchived;
|
|
2412
2438
|
return matchesSearch && matchesArchiveFilter;
|
|
2413
2439
|
});
|
|
@@ -2531,8 +2557,12 @@ var Sidebar2 = ({
|
|
|
2531
2557
|
value: editTitle,
|
|
2532
2558
|
onChange: (e) => setEditTitle(e.target.value),
|
|
2533
2559
|
onKeyDown: (e) => {
|
|
2534
|
-
if (e.key === "Enter")
|
|
2535
|
-
|
|
2560
|
+
if (e.key === "Enter") {
|
|
2561
|
+
saveEdit();
|
|
2562
|
+
}
|
|
2563
|
+
if (e.key === "Escape") {
|
|
2564
|
+
cancelEdit();
|
|
2565
|
+
}
|
|
2536
2566
|
},
|
|
2537
2567
|
onBlur: saveEdit,
|
|
2538
2568
|
className: "h-7 text-sm"
|
|
@@ -2555,28 +2585,48 @@ var Sidebar2 = ({
|
|
|
2555
2585
|
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.MoreHorizontal, {}),
|
|
2556
2586
|
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "sr-only", children: "More" })
|
|
2557
2587
|
] }) }),
|
|
2558
|
-
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
2559
|
-
|
|
2560
|
-
|
|
2561
|
-
|
|
2562
|
-
|
|
2563
|
-
|
|
2564
|
-
|
|
2565
|
-
|
|
2566
|
-
|
|
2567
|
-
|
|
2568
|
-
|
|
2569
|
-
|
|
2570
|
-
|
|
2571
|
-
|
|
2572
|
-
|
|
2573
|
-
|
|
2574
|
-
|
|
2575
|
-
|
|
2576
|
-
|
|
2577
|
-
|
|
2578
|
-
|
|
2579
|
-
|
|
2588
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
2589
|
+
DropdownMenuContent,
|
|
2590
|
+
{
|
|
2591
|
+
className: "w-48",
|
|
2592
|
+
side: "right",
|
|
2593
|
+
align: "start",
|
|
2594
|
+
children: [
|
|
2595
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
2596
|
+
DropdownMenuItem,
|
|
2597
|
+
{
|
|
2598
|
+
onClick: () => startEditing(thread),
|
|
2599
|
+
children: [
|
|
2600
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.Edit2, { className: "mr-2 h-4 w-4" }),
|
|
2601
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { children: config.labels?.renameThread || "Rename" })
|
|
2602
|
+
]
|
|
2603
|
+
}
|
|
2604
|
+
),
|
|
2605
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
2606
|
+
DropdownMenuItem,
|
|
2607
|
+
{
|
|
2608
|
+
onClick: () => onArchiveThread?.(thread.id),
|
|
2609
|
+
children: [
|
|
2610
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.Archive, { className: "mr-2 h-4 w-4" }),
|
|
2611
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { children: thread.isArchived ? config.labels?.unarchiveThread || "Unarchive" : config.labels?.archiveThread || "Archive" })
|
|
2612
|
+
]
|
|
2613
|
+
}
|
|
2614
|
+
),
|
|
2615
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(DropdownMenuSeparator, {}),
|
|
2616
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
2617
|
+
DropdownMenuItem,
|
|
2618
|
+
{
|
|
2619
|
+
onClick: () => setDeleteThreadId(thread.id),
|
|
2620
|
+
className: "text-destructive focus:text-destructive",
|
|
2621
|
+
children: [
|
|
2622
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.Trash2, { className: "mr-2 h-4 w-4" }),
|
|
2623
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { children: config.labels?.deleteThread || "Delete" })
|
|
2624
|
+
]
|
|
2625
|
+
}
|
|
2626
|
+
)
|
|
2627
|
+
]
|
|
2628
|
+
}
|
|
2629
|
+
)
|
|
2580
2630
|
] })
|
|
2581
2631
|
] }, thread.id)) }) })
|
|
2582
2632
|
] }, group))
|
|
@@ -2589,39 +2639,47 @@ var Sidebar2 = ({
|
|
|
2589
2639
|
callbacks: userMenuCallbacks,
|
|
2590
2640
|
currentTheme,
|
|
2591
2641
|
showThemeOptions,
|
|
2642
|
+
sections: userMenuSections,
|
|
2592
2643
|
additionalItems: userMenuAdditionalItems
|
|
2593
2644
|
}
|
|
2594
2645
|
) }),
|
|
2595
2646
|
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SidebarRail, {}),
|
|
2596
|
-
deleteThreadId && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
2597
|
-
|
|
2598
|
-
|
|
2599
|
-
|
|
2600
|
-
|
|
2601
|
-
|
|
2602
|
-
|
|
2603
|
-
|
|
2604
|
-
|
|
2605
|
-
|
|
2606
|
-
|
|
2607
|
-
|
|
2608
|
-
|
|
2609
|
-
|
|
2610
|
-
|
|
2611
|
-
|
|
2612
|
-
|
|
2647
|
+
deleteThreadId && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
2648
|
+
AlertDialog,
|
|
2649
|
+
{
|
|
2650
|
+
open: !!deleteThreadId,
|
|
2651
|
+
onOpenChange: () => setDeleteThreadId(null),
|
|
2652
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(AlertDialogContent, { children: [
|
|
2653
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(AlertDialogHeader, { children: [
|
|
2654
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlertDialogTitle, { children: config.labels?.deleteConfirmTitle || "Delete Conversation" }),
|
|
2655
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlertDialogDescription, { children: config.labels?.deleteConfirmDescription || "Are you sure you want to delete this conversation? This action cannot be undone." })
|
|
2656
|
+
] }),
|
|
2657
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(AlertDialogFooter, { children: [
|
|
2658
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AlertDialogCancel, { children: config.labels?.cancel || "Cancel" }),
|
|
2659
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
2660
|
+
AlertDialogAction,
|
|
2661
|
+
{
|
|
2662
|
+
onClick: () => deleteThreadId && handleDeleteThread(deleteThreadId),
|
|
2663
|
+
className: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
|
|
2664
|
+
children: config.labels?.deleteThread || "Delete"
|
|
2665
|
+
}
|
|
2666
|
+
)
|
|
2667
|
+
] })
|
|
2668
|
+
] })
|
|
2669
|
+
}
|
|
2670
|
+
)
|
|
2613
2671
|
] });
|
|
2614
2672
|
};
|
|
2615
2673
|
|
|
2616
2674
|
// src/components/chat/ChatHeader.tsx
|
|
2617
|
-
var
|
|
2675
|
+
var import_react6 = __toESM(require("react"), 1);
|
|
2618
2676
|
var import_lucide_react10 = require("lucide-react");
|
|
2619
2677
|
|
|
2620
2678
|
// src/components/chat/AgentSelectors.tsx
|
|
2621
|
-
var
|
|
2679
|
+
var import_react5 = require("react");
|
|
2622
2680
|
var import_lucide_react9 = require("lucide-react");
|
|
2623
2681
|
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
2624
|
-
var ParticipantsSelector = (0,
|
|
2682
|
+
var ParticipantsSelector = (0, import_react5.memo)(({
|
|
2625
2683
|
agents,
|
|
2626
2684
|
participantIds,
|
|
2627
2685
|
onParticipantsChange,
|
|
@@ -2629,8 +2687,8 @@ var ParticipantsSelector = (0, import_react4.memo)(({
|
|
|
2629
2687
|
maxVisible = 3,
|
|
2630
2688
|
disabled = false
|
|
2631
2689
|
}) => {
|
|
2632
|
-
const agentsWithColors = (0,
|
|
2633
|
-
const selectedAgents = (0,
|
|
2690
|
+
const agentsWithColors = (0, import_react5.useMemo)(() => assignAgentColors(agents), [agents]);
|
|
2691
|
+
const selectedAgents = (0, import_react5.useMemo)(
|
|
2634
2692
|
() => agentsWithColors.filter((a) => participantIds.includes(a.id)),
|
|
2635
2693
|
[agentsWithColors, participantIds]
|
|
2636
2694
|
);
|
|
@@ -2719,7 +2777,7 @@ var ParticipantsSelector = (0, import_react4.memo)(({
|
|
|
2719
2777
|
] });
|
|
2720
2778
|
});
|
|
2721
2779
|
ParticipantsSelector.displayName = "ParticipantsSelector";
|
|
2722
|
-
var TargetAgentSelector = (0,
|
|
2780
|
+
var TargetAgentSelector = (0, import_react5.memo)(({
|
|
2723
2781
|
agents,
|
|
2724
2782
|
targetAgentId,
|
|
2725
2783
|
onTargetChange,
|
|
@@ -2727,8 +2785,8 @@ var TargetAgentSelector = (0, import_react4.memo)(({
|
|
|
2727
2785
|
placeholder = "Select agent",
|
|
2728
2786
|
disabled = false
|
|
2729
2787
|
}) => {
|
|
2730
|
-
const agentsWithColors = (0,
|
|
2731
|
-
const selectedAgent = (0,
|
|
2788
|
+
const agentsWithColors = (0, import_react5.useMemo)(() => assignAgentColors(agents), [agents]);
|
|
2789
|
+
const selectedAgent = (0, import_react5.useMemo)(
|
|
2732
2790
|
() => agentsWithColors.find((a) => a.id === targetAgentId),
|
|
2733
2791
|
[agentsWithColors, targetAgentId]
|
|
2734
2792
|
);
|
|
@@ -2797,7 +2855,7 @@ var TargetAgentSelector = (0, import_react4.memo)(({
|
|
|
2797
2855
|
] });
|
|
2798
2856
|
});
|
|
2799
2857
|
TargetAgentSelector.displayName = "TargetAgentSelector";
|
|
2800
|
-
var AgentBadge = (0,
|
|
2858
|
+
var AgentBadge = (0, import_react5.memo)(({
|
|
2801
2859
|
agent,
|
|
2802
2860
|
onRemove,
|
|
2803
2861
|
showRemove = false,
|
|
@@ -2866,11 +2924,11 @@ var ChatHeader = ({
|
|
|
2866
2924
|
onParticipantsChange,
|
|
2867
2925
|
className = ""
|
|
2868
2926
|
}) => {
|
|
2869
|
-
const [isDarkMode, setIsDarkMode] =
|
|
2927
|
+
const [isDarkMode, setIsDarkMode] = import_react6.default.useState(() => {
|
|
2870
2928
|
if (typeof window === "undefined") return false;
|
|
2871
2929
|
return document.documentElement.classList.contains("dark");
|
|
2872
2930
|
});
|
|
2873
|
-
|
|
2931
|
+
import_react6.default.useEffect(() => {
|
|
2874
2932
|
const observer = new MutationObserver(() => {
|
|
2875
2933
|
setIsDarkMode(document.documentElement.classList.contains("dark"));
|
|
2876
2934
|
});
|
|
@@ -3044,18 +3102,18 @@ var ChatHeader = ({
|
|
|
3044
3102
|
};
|
|
3045
3103
|
|
|
3046
3104
|
// src/components/chat/ChatInput.tsx
|
|
3047
|
-
var
|
|
3105
|
+
var import_react8 = __toESM(require("react"), 1);
|
|
3048
3106
|
|
|
3049
3107
|
// src/components/chat/UserContext.tsx
|
|
3050
|
-
var
|
|
3108
|
+
var import_react7 = require("react");
|
|
3051
3109
|
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
3052
|
-
var Ctx = (0,
|
|
3110
|
+
var Ctx = (0, import_react7.createContext)(void 0);
|
|
3053
3111
|
var ChatUserContextProvider = ({ children, initial }) => {
|
|
3054
|
-
const [ctx, setCtx] = (0,
|
|
3112
|
+
const [ctx, setCtx] = (0, import_react7.useState)(() => ({
|
|
3055
3113
|
updatedAt: Date.now(),
|
|
3056
3114
|
...initial ?? {}
|
|
3057
3115
|
}));
|
|
3058
|
-
(0,
|
|
3116
|
+
(0, import_react7.useEffect)(() => {
|
|
3059
3117
|
if (!initial) return;
|
|
3060
3118
|
setCtx((prev) => {
|
|
3061
3119
|
const keys = Object.keys(initial);
|
|
@@ -3064,13 +3122,13 @@ var ChatUserContextProvider = ({ children, initial }) => {
|
|
|
3064
3122
|
return { ...prev, ...initial, updatedAt: Date.now() };
|
|
3065
3123
|
});
|
|
3066
3124
|
}, [initial]);
|
|
3067
|
-
const setPartial = (0,
|
|
3125
|
+
const setPartial = (0, import_react7.useCallback)((next) => {
|
|
3068
3126
|
setCtx((prev) => {
|
|
3069
3127
|
const partial = typeof next === "function" ? next(prev) : next;
|
|
3070
3128
|
return { ...prev, ...partial, updatedAt: Date.now() };
|
|
3071
3129
|
});
|
|
3072
3130
|
}, []);
|
|
3073
|
-
const value = (0,
|
|
3131
|
+
const value = (0, import_react7.useMemo)(() => ({
|
|
3074
3132
|
context: ctx,
|
|
3075
3133
|
setContext: setPartial,
|
|
3076
3134
|
resetContext: () => setCtx({ updatedAt: Date.now() })
|
|
@@ -3078,7 +3136,7 @@ var ChatUserContextProvider = ({ children, initial }) => {
|
|
|
3078
3136
|
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Ctx.Provider, { value, children });
|
|
3079
3137
|
};
|
|
3080
3138
|
function useChatUserContext() {
|
|
3081
|
-
const v = (0,
|
|
3139
|
+
const v = (0, import_react7.useContext)(Ctx);
|
|
3082
3140
|
if (!v) throw new Error("useChatUserContext must be used within ChatUserContextProvider");
|
|
3083
3141
|
return v;
|
|
3084
3142
|
}
|
|
@@ -3662,7 +3720,7 @@ function resolveTargetFromMentions(value, agents) {
|
|
|
3662
3720
|
}
|
|
3663
3721
|
return null;
|
|
3664
3722
|
}
|
|
3665
|
-
var FileUploadItem = (0,
|
|
3723
|
+
var FileUploadItem = (0, import_react8.memo)(function FileUploadItem2({ file, progress, onCancel }) {
|
|
3666
3724
|
const guessTypeFromName = (name) => {
|
|
3667
3725
|
const ext = (name || "").split(".").pop()?.toLowerCase();
|
|
3668
3726
|
switch (ext) {
|
|
@@ -3721,11 +3779,11 @@ var FileUploadItem = (0, import_react7.memo)(function FileUploadItem2({ file, pr
|
|
|
3721
3779
|
)
|
|
3722
3780
|
] }) }) });
|
|
3723
3781
|
});
|
|
3724
|
-
var AttachmentPreview = (0,
|
|
3725
|
-
const [isPlaying, setIsPlaying] = (0,
|
|
3726
|
-
const [audioPlaybackSrc, setAudioPlaybackSrc] = (0,
|
|
3727
|
-
const audioRef = (0,
|
|
3728
|
-
(0,
|
|
3782
|
+
var AttachmentPreview = (0, import_react8.memo)(function AttachmentPreview2({ attachment, onRemove }) {
|
|
3783
|
+
const [isPlaying, setIsPlaying] = (0, import_react8.useState)(false);
|
|
3784
|
+
const [audioPlaybackSrc, setAudioPlaybackSrc] = (0, import_react8.useState)(attachment.dataUrl);
|
|
3785
|
+
const audioRef = (0, import_react8.useRef)(null);
|
|
3786
|
+
(0, import_react8.useEffect)(() => {
|
|
3729
3787
|
if (attachment.kind !== "audio" || !attachment.dataUrl.startsWith("data:")) {
|
|
3730
3788
|
setAudioPlaybackSrc(attachment.dataUrl);
|
|
3731
3789
|
return;
|
|
@@ -3850,7 +3908,7 @@ var resolveVoiceErrorMessage = (error, config) => {
|
|
|
3850
3908
|
};
|
|
3851
3909
|
var clearVoiceTranscript = () => ({});
|
|
3852
3910
|
var resolveVoiceSegmentDuration = (segment) => segment.attachment.durationMs ?? 0;
|
|
3853
|
-
var ChatInput = (0,
|
|
3911
|
+
var ChatInput = (0, import_react8.memo)(function ChatInput2({
|
|
3854
3912
|
value,
|
|
3855
3913
|
onChange,
|
|
3856
3914
|
onSubmit,
|
|
@@ -3879,27 +3937,27 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
3879
3937
|
const voiceTranscriptMode = config?.voiceCompose?.transcriptMode ?? "final-only";
|
|
3880
3938
|
const voiceMaxRecordingMs = config?.voiceCompose?.maxRecordingMs;
|
|
3881
3939
|
const { setContext } = useChatUserContext();
|
|
3882
|
-
const [uploadProgress, setUploadProgress] = (0,
|
|
3883
|
-
const [isVoiceComposerOpen, setIsVoiceComposerOpen] = (0,
|
|
3940
|
+
const [uploadProgress, setUploadProgress] = (0, import_react8.useState)(/* @__PURE__ */ new Map());
|
|
3941
|
+
const [isVoiceComposerOpen, setIsVoiceComposerOpen] = (0, import_react8.useState)(
|
|
3884
3942
|
() => enableAudioRecording && voiceDefaultMode === "voice"
|
|
3885
3943
|
);
|
|
3886
|
-
const [voiceState, setVoiceState] = (0,
|
|
3887
|
-
const [voiceDraft, setVoiceDraft] = (0,
|
|
3888
|
-
const [voiceTranscript, setVoiceTranscript] = (0,
|
|
3889
|
-
const [voiceDurationMs, setVoiceDurationMs] = (0,
|
|
3890
|
-
const [voiceAudioLevel, setVoiceAudioLevel] = (0,
|
|
3891
|
-
const [voiceCountdownMs, setVoiceCountdownMs] = (0,
|
|
3892
|
-
const [isVoiceAutoSendActive, setIsVoiceAutoSendActive] = (0,
|
|
3893
|
-
const [voiceError, setVoiceError] = (0,
|
|
3894
|
-
const [activeMention, setActiveMention] = (0,
|
|
3895
|
-
const [activeMentionIndex, setActiveMentionIndex] = (0,
|
|
3896
|
-
const textareaRef = (0,
|
|
3897
|
-
const fileInputRef = (0,
|
|
3898
|
-
const voiceProviderRef = (0,
|
|
3899
|
-
const voiceDraftRef = (0,
|
|
3900
|
-
const voiceAppendBaseRef = (0,
|
|
3901
|
-
const voiceAppendBaseDurationRef = (0,
|
|
3902
|
-
const filteredMentionAgents =
|
|
3944
|
+
const [voiceState, setVoiceState] = (0, import_react8.useState)("idle");
|
|
3945
|
+
const [voiceDraft, setVoiceDraft] = (0, import_react8.useState)(null);
|
|
3946
|
+
const [voiceTranscript, setVoiceTranscript] = (0, import_react8.useState)(clearVoiceTranscript);
|
|
3947
|
+
const [voiceDurationMs, setVoiceDurationMs] = (0, import_react8.useState)(0);
|
|
3948
|
+
const [voiceAudioLevel, setVoiceAudioLevel] = (0, import_react8.useState)(0);
|
|
3949
|
+
const [voiceCountdownMs, setVoiceCountdownMs] = (0, import_react8.useState)(0);
|
|
3950
|
+
const [isVoiceAutoSendActive, setIsVoiceAutoSendActive] = (0, import_react8.useState)(false);
|
|
3951
|
+
const [voiceError, setVoiceError] = (0, import_react8.useState)(null);
|
|
3952
|
+
const [activeMention, setActiveMention] = (0, import_react8.useState)(null);
|
|
3953
|
+
const [activeMentionIndex, setActiveMentionIndex] = (0, import_react8.useState)(0);
|
|
3954
|
+
const textareaRef = (0, import_react8.useRef)(null);
|
|
3955
|
+
const fileInputRef = (0, import_react8.useRef)(null);
|
|
3956
|
+
const voiceProviderRef = (0, import_react8.useRef)(null);
|
|
3957
|
+
const voiceDraftRef = (0, import_react8.useRef)(null);
|
|
3958
|
+
const voiceAppendBaseRef = (0, import_react8.useRef)(null);
|
|
3959
|
+
const voiceAppendBaseDurationRef = (0, import_react8.useRef)(0);
|
|
3960
|
+
const filteredMentionAgents = import_react8.default.useMemo(() => {
|
|
3903
3961
|
if (!activeMention || mentionAgents.length === 0) return [];
|
|
3904
3962
|
const query = activeMention.query.trim().toLowerCase();
|
|
3905
3963
|
const rank = (agent) => {
|
|
@@ -3917,7 +3975,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
3917
3975
|
}).slice(0, 6);
|
|
3918
3976
|
}, [activeMention, mentionAgents]);
|
|
3919
3977
|
const isMentionMenuOpen = filteredMentionAgents.length > 0;
|
|
3920
|
-
const syncMentionState = (0,
|
|
3978
|
+
const syncMentionState = (0, import_react8.useCallback)((nextValue, nextCaret) => {
|
|
3921
3979
|
const caret = typeof nextCaret === "number" ? nextCaret : textareaRef.current?.selectionStart ?? nextValue.length;
|
|
3922
3980
|
const nextMatch = getActiveMentionMatch(nextValue, caret);
|
|
3923
3981
|
setActiveMention((prev) => {
|
|
@@ -3928,7 +3986,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
3928
3986
|
});
|
|
3929
3987
|
setActiveMentionIndex(0);
|
|
3930
3988
|
}, []);
|
|
3931
|
-
(0,
|
|
3989
|
+
(0, import_react8.useEffect)(() => {
|
|
3932
3990
|
return () => {
|
|
3933
3991
|
if (voiceProviderRef.current) {
|
|
3934
3992
|
void voiceProviderRef.current.destroy();
|
|
@@ -3936,10 +3994,10 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
3936
3994
|
}
|
|
3937
3995
|
};
|
|
3938
3996
|
}, []);
|
|
3939
|
-
(0,
|
|
3997
|
+
(0, import_react8.useEffect)(() => {
|
|
3940
3998
|
voiceDraftRef.current = voiceDraft;
|
|
3941
3999
|
}, [voiceDraft]);
|
|
3942
|
-
(0,
|
|
4000
|
+
(0, import_react8.useEffect)(() => {
|
|
3943
4001
|
if (!isMentionMenuOpen) {
|
|
3944
4002
|
setActiveMentionIndex(0);
|
|
3945
4003
|
return;
|
|
@@ -3948,7 +4006,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
3948
4006
|
(prev) => prev >= filteredMentionAgents.length ? 0 : prev
|
|
3949
4007
|
);
|
|
3950
4008
|
}, [filteredMentionAgents.length, isMentionMenuOpen]);
|
|
3951
|
-
const selectMentionAgent = (0,
|
|
4009
|
+
const selectMentionAgent = (0, import_react8.useCallback)((agent) => {
|
|
3952
4010
|
if (!activeMention) return;
|
|
3953
4011
|
const replacement = `@${agent.name} `;
|
|
3954
4012
|
const nextValue = value.slice(0, activeMention.start) + replacement + value.slice(activeMention.end);
|
|
@@ -4086,7 +4144,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4086
4144
|
}
|
|
4087
4145
|
e.target.value = "";
|
|
4088
4146
|
};
|
|
4089
|
-
const handleDrop = (0,
|
|
4147
|
+
const handleDrop = (0, import_react8.useCallback)(async (e) => {
|
|
4090
4148
|
e.preventDefault();
|
|
4091
4149
|
if (!enableFileUpload) return;
|
|
4092
4150
|
const files = Array.from(e.dataTransfer.files);
|
|
@@ -4099,10 +4157,10 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4099
4157
|
}
|
|
4100
4158
|
}
|
|
4101
4159
|
}, [attachments, enableFileUpload, maxAttachments, onAttachmentsChange]);
|
|
4102
|
-
const handleDragOver = (0,
|
|
4160
|
+
const handleDragOver = (0, import_react8.useCallback)((e) => {
|
|
4103
4161
|
e.preventDefault();
|
|
4104
4162
|
}, []);
|
|
4105
|
-
const resetVoiceComposerState = (0,
|
|
4163
|
+
const resetVoiceComposerState = (0, import_react8.useCallback)((nextState = "idle") => {
|
|
4106
4164
|
setVoiceState(nextState);
|
|
4107
4165
|
setVoiceDraft(null);
|
|
4108
4166
|
voiceDraftRef.current = null;
|
|
@@ -4115,11 +4173,11 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4115
4173
|
setIsVoiceAutoSendActive(false);
|
|
4116
4174
|
setVoiceError(null);
|
|
4117
4175
|
}, []);
|
|
4118
|
-
const armVoiceDraftForAppend = (0,
|
|
4176
|
+
const armVoiceDraftForAppend = (0, import_react8.useCallback)((segment) => {
|
|
4119
4177
|
voiceAppendBaseRef.current = segment;
|
|
4120
4178
|
voiceAppendBaseDurationRef.current = segment ? resolveVoiceSegmentDuration(segment) : 0;
|
|
4121
4179
|
}, []);
|
|
4122
|
-
const handleVoiceProviderStateChange = (0,
|
|
4180
|
+
const handleVoiceProviderStateChange = (0, import_react8.useCallback)((nextState) => {
|
|
4123
4181
|
if (voiceReviewMode === "armed" && (nextState === "waiting_for_speech" || nextState === "listening")) {
|
|
4124
4182
|
const currentDraft = voiceDraftRef.current;
|
|
4125
4183
|
if (currentDraft) {
|
|
@@ -4132,7 +4190,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4132
4190
|
}
|
|
4133
4191
|
setVoiceState(nextState);
|
|
4134
4192
|
}, [armVoiceDraftForAppend, voiceAutoSendDelayMs, voiceReviewMode]);
|
|
4135
|
-
const ensureVoiceProvider = (0,
|
|
4193
|
+
const ensureVoiceProvider = (0, import_react8.useCallback)(async () => {
|
|
4136
4194
|
if (voiceProviderRef.current) {
|
|
4137
4195
|
return voiceProviderRef.current;
|
|
4138
4196
|
}
|
|
@@ -4219,7 +4277,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4219
4277
|
voiceProviderRef.current = provider;
|
|
4220
4278
|
return provider;
|
|
4221
4279
|
}, [armVoiceDraftForAppend, config, handleVoiceProviderStateChange, voiceAutoSendDelayMs, voiceMaxRecordingMs, voiceReviewMode]);
|
|
4222
|
-
const closeVoiceComposer = (0,
|
|
4280
|
+
const closeVoiceComposer = (0, import_react8.useCallback)(async () => {
|
|
4223
4281
|
voiceAppendBaseRef.current = null;
|
|
4224
4282
|
voiceAppendBaseDurationRef.current = 0;
|
|
4225
4283
|
setIsVoiceComposerOpen(false);
|
|
@@ -4235,7 +4293,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4235
4293
|
await voiceProviderRef.current.cancel();
|
|
4236
4294
|
}
|
|
4237
4295
|
}, []);
|
|
4238
|
-
const startVoiceCapture = (0,
|
|
4296
|
+
const startVoiceCapture = (0, import_react8.useCallback)(async (appendToDraft = false) => {
|
|
4239
4297
|
if (disabled || isGenerating) {
|
|
4240
4298
|
return;
|
|
4241
4299
|
}
|
|
@@ -4284,7 +4342,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4284
4342
|
setVoiceState("error");
|
|
4285
4343
|
}
|
|
4286
4344
|
}, [disabled, isGenerating, ensureVoiceProvider, config]);
|
|
4287
|
-
const stopVoiceCapture = (0,
|
|
4345
|
+
const stopVoiceCapture = (0, import_react8.useCallback)(async () => {
|
|
4288
4346
|
if (!voiceProviderRef.current) return;
|
|
4289
4347
|
try {
|
|
4290
4348
|
await voiceProviderRef.current.stop();
|
|
@@ -4293,7 +4351,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4293
4351
|
setVoiceState("error");
|
|
4294
4352
|
}
|
|
4295
4353
|
}, [config]);
|
|
4296
|
-
const cancelVoiceCapture = (0,
|
|
4354
|
+
const cancelVoiceCapture = (0, import_react8.useCallback)(async () => {
|
|
4297
4355
|
voiceAppendBaseRef.current = null;
|
|
4298
4356
|
voiceAppendBaseDurationRef.current = 0;
|
|
4299
4357
|
if (voiceProviderRef.current) {
|
|
@@ -4301,7 +4359,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4301
4359
|
}
|
|
4302
4360
|
resetVoiceComposerState("idle");
|
|
4303
4361
|
}, [resetVoiceComposerState]);
|
|
4304
|
-
const finalizeVoiceComposerAfterSend = (0,
|
|
4362
|
+
const finalizeVoiceComposerAfterSend = (0, import_react8.useCallback)(() => {
|
|
4305
4363
|
if (voicePersistComposer) {
|
|
4306
4364
|
resetVoiceComposerState("idle");
|
|
4307
4365
|
setIsVoiceComposerOpen(true);
|
|
@@ -4309,7 +4367,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4309
4367
|
}
|
|
4310
4368
|
void closeVoiceComposer();
|
|
4311
4369
|
}, [voicePersistComposer, resetVoiceComposerState, closeVoiceComposer]);
|
|
4312
|
-
const sendVoiceDraft = (0,
|
|
4370
|
+
const sendVoiceDraft = (0, import_react8.useCallback)(() => {
|
|
4313
4371
|
void (async () => {
|
|
4314
4372
|
if (!voiceDraft || disabled || isGenerating) {
|
|
4315
4373
|
return;
|
|
@@ -4335,7 +4393,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4335
4393
|
onAttachmentsChange,
|
|
4336
4394
|
finalizeVoiceComposerAfterSend
|
|
4337
4395
|
]);
|
|
4338
|
-
const cancelVoiceAutoSend = (0,
|
|
4396
|
+
const cancelVoiceAutoSend = (0, import_react8.useCallback)(() => {
|
|
4339
4397
|
void (async () => {
|
|
4340
4398
|
if (voiceReviewMode === "armed" && voiceProviderRef.current) {
|
|
4341
4399
|
await voiceProviderRef.current.cancel();
|
|
@@ -4347,7 +4405,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4347
4405
|
setVoiceCountdownMs(0);
|
|
4348
4406
|
setIsVoiceAutoSendActive(false);
|
|
4349
4407
|
}, [armVoiceDraftForAppend, voiceReviewMode]);
|
|
4350
|
-
const pauseVoiceReview = (0,
|
|
4408
|
+
const pauseVoiceReview = (0, import_react8.useCallback)(async () => {
|
|
4351
4409
|
if (voiceState === "listening") {
|
|
4352
4410
|
await stopVoiceCapture();
|
|
4353
4411
|
return;
|
|
@@ -4359,7 +4417,7 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4359
4417
|
setVoiceAudioLevel(0);
|
|
4360
4418
|
setVoiceState("review");
|
|
4361
4419
|
}, [armVoiceDraftForAppend, stopVoiceCapture, voiceReviewMode, voiceState]);
|
|
4362
|
-
(0,
|
|
4420
|
+
(0, import_react8.useEffect)(() => {
|
|
4363
4421
|
if (!voiceDraft || voiceAutoSendDelayMs <= 0 || !isVoiceAutoSendActive) {
|
|
4364
4422
|
return;
|
|
4365
4423
|
}
|
|
@@ -4596,13 +4654,13 @@ var ChatInput = (0, import_react7.memo)(function ChatInput2({
|
|
|
4596
4654
|
});
|
|
4597
4655
|
|
|
4598
4656
|
// src/components/chat/UserProfile.tsx
|
|
4599
|
-
var
|
|
4657
|
+
var import_react9 = require("react");
|
|
4600
4658
|
|
|
4601
4659
|
// src/components/ui/scroll-area.tsx
|
|
4602
|
-
var
|
|
4660
|
+
var React14 = __toESM(require("react"), 1);
|
|
4603
4661
|
var ScrollAreaPrimitive = __toESM(require("@radix-ui/react-scroll-area"), 1);
|
|
4604
4662
|
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
4605
|
-
var ScrollArea =
|
|
4663
|
+
var ScrollArea = React14.forwardRef(({ className, children, viewportClassName, onScroll, onScrollCapture, ...props }, ref) => {
|
|
4606
4664
|
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
4607
4665
|
ScrollAreaPrimitive.Root,
|
|
4608
4666
|
{
|
|
@@ -4770,10 +4828,10 @@ var UserProfile = ({
|
|
|
4770
4828
|
onDeleteMemory,
|
|
4771
4829
|
className
|
|
4772
4830
|
}) => {
|
|
4773
|
-
const [newMemoryContent, setNewMemoryContent] = (0,
|
|
4774
|
-
const [isAddingMemory, setIsAddingMemory] = (0,
|
|
4775
|
-
const [editingMemoryId, setEditingMemoryId] = (0,
|
|
4776
|
-
const [editingMemoryContent, setEditingMemoryContent] = (0,
|
|
4831
|
+
const [newMemoryContent, setNewMemoryContent] = (0, import_react9.useState)("");
|
|
4832
|
+
const [isAddingMemory, setIsAddingMemory] = (0, import_react9.useState)(false);
|
|
4833
|
+
const [editingMemoryId, setEditingMemoryId] = (0, import_react9.useState)(null);
|
|
4834
|
+
const [editingMemoryContent, setEditingMemoryContent] = (0, import_react9.useState)("");
|
|
4777
4835
|
const handleAddMemory = () => {
|
|
4778
4836
|
if (newMemoryContent.trim() && onAddMemory) {
|
|
4779
4837
|
onAddMemory(newMemoryContent.trim(), "other");
|
|
@@ -5049,7 +5107,9 @@ function getMessageSpeakerKey(message) {
|
|
|
5049
5107
|
}
|
|
5050
5108
|
function getAssistantSpeakerTokens(message) {
|
|
5051
5109
|
if (!message || message.role !== "assistant") return [];
|
|
5052
|
-
const rawTokens = [message.senderAgentId, message.senderName].filter(
|
|
5110
|
+
const rawTokens = [message.senderAgentId, message.senderName].filter(
|
|
5111
|
+
(value) => typeof value === "string" && value.trim().length > 0
|
|
5112
|
+
).map((value) => value.trim().toLowerCase());
|
|
5053
5113
|
if (rawTokens.length > 0) {
|
|
5054
5114
|
return Array.from(new Set(rawTokens));
|
|
5055
5115
|
}
|
|
@@ -5083,7 +5143,9 @@ var mergeReasoning = (activities) => {
|
|
|
5083
5143
|
return segments.filter((segment, index) => index === 0 || segment !== segments[index - 1]).join("\n\n");
|
|
5084
5144
|
};
|
|
5085
5145
|
var mergeGroupActivity = (messages) => {
|
|
5086
|
-
const activities = messages.map((message) => message.activity).filter(
|
|
5146
|
+
const activities = messages.map((message) => message.activity).filter(
|
|
5147
|
+
(activity) => Boolean(activity)
|
|
5148
|
+
);
|
|
5087
5149
|
if (activities.length === 0) return void 0;
|
|
5088
5150
|
const lastActivity = activities[activities.length - 1];
|
|
5089
5151
|
const mergedReasoning = mergeReasoning(activities);
|
|
@@ -5147,6 +5209,7 @@ var ChatUI = ({
|
|
|
5147
5209
|
currentThreadId = null,
|
|
5148
5210
|
config: userConfig,
|
|
5149
5211
|
sidebar: _sidebar,
|
|
5212
|
+
userMenuSections,
|
|
5150
5213
|
userMenuAdditionalItems,
|
|
5151
5214
|
isGenerating = false,
|
|
5152
5215
|
isMessagesLoading = false,
|
|
@@ -5172,12 +5235,12 @@ var ChatUI = ({
|
|
|
5172
5235
|
initialInput,
|
|
5173
5236
|
onInitialInputConsumed
|
|
5174
5237
|
}) => {
|
|
5175
|
-
const config = (0,
|
|
5238
|
+
const config = (0, import_react10.useMemo)(
|
|
5176
5239
|
() => mergeConfig(defaultChatConfig, userConfig),
|
|
5177
5240
|
[userConfig]
|
|
5178
5241
|
);
|
|
5179
|
-
const [isMobile, setIsMobile] = (0,
|
|
5180
|
-
const [isUserProfileOpen, setIsUserProfileOpen] = (0,
|
|
5242
|
+
const [isMobile, setIsMobile] = (0, import_react10.useState)(false);
|
|
5243
|
+
const [isUserProfileOpen, setIsUserProfileOpen] = (0, import_react10.useState)(false);
|
|
5181
5244
|
let userContext;
|
|
5182
5245
|
try {
|
|
5183
5246
|
const contextValue = useChatUserContext();
|
|
@@ -5191,10 +5254,10 @@ var ChatUI = ({
|
|
|
5191
5254
|
}
|
|
5192
5255
|
return false;
|
|
5193
5256
|
};
|
|
5194
|
-
const [inputValue, setInputValue] = (0,
|
|
5195
|
-
const [attachments, setAttachments] = (0,
|
|
5196
|
-
const [expandedMessageIds, setExpandedMessageIds] = (0,
|
|
5197
|
-
const [state, setState] = (0,
|
|
5257
|
+
const [inputValue, setInputValue] = (0, import_react10.useState)("");
|
|
5258
|
+
const [attachments, setAttachments] = (0, import_react10.useState)([]);
|
|
5259
|
+
const [expandedMessageIds, setExpandedMessageIds] = (0, import_react10.useState)({});
|
|
5260
|
+
const [state, setState] = (0, import_react10.useState)({
|
|
5198
5261
|
isRecording: false,
|
|
5199
5262
|
selectedThreadId: currentThreadId,
|
|
5200
5263
|
isAtBottom: true,
|
|
@@ -5206,43 +5269,45 @@ var ChatUI = ({
|
|
|
5206
5269
|
isSidebarCollapsed: false
|
|
5207
5270
|
// No longer used for main sidebar
|
|
5208
5271
|
});
|
|
5209
|
-
(0,
|
|
5272
|
+
(0, import_react10.useEffect)(() => {
|
|
5210
5273
|
if (currentThreadId !== state.selectedThreadId) {
|
|
5211
5274
|
setState((prev) => ({ ...prev, selectedThreadId: currentThreadId }));
|
|
5212
5275
|
}
|
|
5213
5276
|
}, [currentThreadId]);
|
|
5214
|
-
const initialInputApplied = (0,
|
|
5215
|
-
const initialInputConsumedRef = (0,
|
|
5216
|
-
(0,
|
|
5277
|
+
const initialInputApplied = (0, import_react10.useRef)(false);
|
|
5278
|
+
const initialInputConsumedRef = (0, import_react10.useRef)(false);
|
|
5279
|
+
(0, import_react10.useEffect)(() => {
|
|
5217
5280
|
if (initialInput && !initialInputApplied.current) {
|
|
5218
5281
|
setInputValue(initialInput);
|
|
5219
5282
|
initialInputApplied.current = true;
|
|
5220
5283
|
}
|
|
5221
5284
|
}, [initialInput]);
|
|
5222
|
-
const scrollAreaRef = (0,
|
|
5223
|
-
const prependSnapshotRef = (0,
|
|
5224
|
-
const stateRef = (0,
|
|
5225
|
-
const inputValueRef = (0,
|
|
5226
|
-
const attachmentsRef = (0,
|
|
5227
|
-
(0,
|
|
5285
|
+
const scrollAreaRef = (0, import_react10.useRef)(null);
|
|
5286
|
+
const prependSnapshotRef = (0, import_react10.useRef)(null);
|
|
5287
|
+
const stateRef = (0, import_react10.useRef)(state);
|
|
5288
|
+
const inputValueRef = (0, import_react10.useRef)(inputValue);
|
|
5289
|
+
const attachmentsRef = (0, import_react10.useRef)(attachments);
|
|
5290
|
+
(0, import_react10.useEffect)(() => {
|
|
5228
5291
|
stateRef.current = state;
|
|
5229
5292
|
}, [state]);
|
|
5230
|
-
(0,
|
|
5293
|
+
(0, import_react10.useEffect)(() => {
|
|
5231
5294
|
inputValueRef.current = inputValue;
|
|
5232
5295
|
}, [inputValue]);
|
|
5233
|
-
(0,
|
|
5296
|
+
(0, import_react10.useEffect)(() => {
|
|
5234
5297
|
attachmentsRef.current = attachments;
|
|
5235
5298
|
}, [attachments]);
|
|
5236
|
-
const [isCustomMounted, setIsCustomMounted] = (0,
|
|
5237
|
-
const [isCustomVisible, setIsCustomVisible] = (0,
|
|
5238
|
-
const groupedMessages = (0,
|
|
5299
|
+
const [isCustomMounted, setIsCustomMounted] = (0, import_react10.useState)(false);
|
|
5300
|
+
const [isCustomVisible, setIsCustomVisible] = (0, import_react10.useState)(false);
|
|
5301
|
+
const groupedMessages = (0, import_react10.useMemo)(() => groupMessagesForRender(messages), [
|
|
5302
|
+
messages
|
|
5303
|
+
]);
|
|
5239
5304
|
const virtualizer = (0, import_react_virtual.useVirtualizer)({
|
|
5240
5305
|
count: groupedMessages.length,
|
|
5241
5306
|
getScrollElement: () => scrollAreaRef.current,
|
|
5242
5307
|
estimateSize: () => 100,
|
|
5243
5308
|
overscan: 5
|
|
5244
5309
|
});
|
|
5245
|
-
const createStateCallback = (0,
|
|
5310
|
+
const createStateCallback = (0, import_react10.useCallback)(
|
|
5246
5311
|
(setter) => ({
|
|
5247
5312
|
setState: (newState) => setter?.(newState),
|
|
5248
5313
|
getState: () => ({
|
|
@@ -5254,7 +5319,7 @@ var ChatUI = ({
|
|
|
5254
5319
|
[]
|
|
5255
5320
|
// No dependencies - uses refs for latest state
|
|
5256
5321
|
);
|
|
5257
|
-
(0,
|
|
5322
|
+
(0, import_react10.useEffect)(() => {
|
|
5258
5323
|
const checkMobile = () => {
|
|
5259
5324
|
setIsMobile(globalThis.innerWidth < 1024);
|
|
5260
5325
|
};
|
|
@@ -5262,7 +5327,7 @@ var ChatUI = ({
|
|
|
5262
5327
|
globalThis.addEventListener("resize", checkMobile);
|
|
5263
5328
|
return () => globalThis.removeEventListener("resize", checkMobile);
|
|
5264
5329
|
}, []);
|
|
5265
|
-
(0,
|
|
5330
|
+
(0, import_react10.useEffect)(() => {
|
|
5266
5331
|
if (!isMobile || !config.customComponent?.component) return;
|
|
5267
5332
|
if (state.showSidebar) {
|
|
5268
5333
|
setIsCustomMounted(true);
|
|
@@ -5273,8 +5338,8 @@ var ChatUI = ({
|
|
|
5273
5338
|
return () => clearTimeout(t);
|
|
5274
5339
|
}
|
|
5275
5340
|
}, [state.showSidebar, isMobile, config.customComponent]);
|
|
5276
|
-
const prevMessageCountRef = (0,
|
|
5277
|
-
(0,
|
|
5341
|
+
const prevMessageCountRef = (0, import_react10.useRef)(0);
|
|
5342
|
+
(0, import_react10.useEffect)(() => {
|
|
5278
5343
|
if (groupedMessages.length === 0) {
|
|
5279
5344
|
prevMessageCountRef.current = 0;
|
|
5280
5345
|
return;
|
|
@@ -5288,7 +5353,9 @@ var ChatUI = ({
|
|
|
5288
5353
|
if (wasEmpty) {
|
|
5289
5354
|
requestAnimationFrame(() => {
|
|
5290
5355
|
requestAnimationFrame(() => {
|
|
5291
|
-
virtualizer.scrollToIndex(groupedMessages.length - 1, {
|
|
5356
|
+
virtualizer.scrollToIndex(groupedMessages.length - 1, {
|
|
5357
|
+
align: "end"
|
|
5358
|
+
});
|
|
5292
5359
|
});
|
|
5293
5360
|
});
|
|
5294
5361
|
return;
|
|
@@ -5304,13 +5371,13 @@ var ChatUI = ({
|
|
|
5304
5371
|
}
|
|
5305
5372
|
});
|
|
5306
5373
|
}, [groupedMessages, state.isAtBottom, virtualizer]);
|
|
5307
|
-
(0,
|
|
5374
|
+
(0, import_react10.useEffect)(() => {
|
|
5308
5375
|
virtualizer.measure();
|
|
5309
5376
|
}, [expandedMessageIds, virtualizer]);
|
|
5310
|
-
(0,
|
|
5377
|
+
(0, import_react10.useEffect)(() => {
|
|
5311
5378
|
prependSnapshotRef.current = null;
|
|
5312
5379
|
}, [currentThreadId]);
|
|
5313
|
-
(0,
|
|
5380
|
+
(0, import_react10.useEffect)(() => {
|
|
5314
5381
|
const snapshot = prependSnapshotRef.current;
|
|
5315
5382
|
if (!snapshot) return;
|
|
5316
5383
|
if (groupedMessages.length <= snapshot.messageCount) {
|
|
@@ -5336,7 +5403,7 @@ var ChatUI = ({
|
|
|
5336
5403
|
});
|
|
5337
5404
|
});
|
|
5338
5405
|
}, [groupedMessages, isLoadingOlderMessages, virtualizer]);
|
|
5339
|
-
const requestOlderMessages = (0,
|
|
5406
|
+
const requestOlderMessages = (0, import_react10.useCallback)(() => {
|
|
5340
5407
|
if (!onLoadOlderMessages || !hasMoreMessagesBefore || isLoadingOlderMessages) return;
|
|
5341
5408
|
const viewport = scrollAreaRef.current;
|
|
5342
5409
|
prependSnapshotRef.current = viewport ? {
|
|
@@ -5346,12 +5413,19 @@ var ChatUI = ({
|
|
|
5346
5413
|
messageCount: groupedMessages.length
|
|
5347
5414
|
} : null;
|
|
5348
5415
|
onLoadOlderMessages();
|
|
5349
|
-
}, [
|
|
5350
|
-
|
|
5416
|
+
}, [
|
|
5417
|
+
groupedMessages,
|
|
5418
|
+
hasMoreMessagesBefore,
|
|
5419
|
+
isLoadingOlderMessages,
|
|
5420
|
+
onLoadOlderMessages
|
|
5421
|
+
]);
|
|
5422
|
+
(0, import_react10.useEffect)(() => {
|
|
5351
5423
|
const validMessageIds = new Set(groupedMessages.map((group) => group.id));
|
|
5352
5424
|
setExpandedMessageIds((prev) => {
|
|
5353
5425
|
const activeIds = Object.keys(prev);
|
|
5354
|
-
const staleIds = activeIds.filter(
|
|
5426
|
+
const staleIds = activeIds.filter(
|
|
5427
|
+
(messageId) => !validMessageIds.has(messageId)
|
|
5428
|
+
);
|
|
5355
5429
|
if (staleIds.length === 0) {
|
|
5356
5430
|
return prev;
|
|
5357
5431
|
}
|
|
@@ -5362,7 +5436,7 @@ var ChatUI = ({
|
|
|
5362
5436
|
return next;
|
|
5363
5437
|
});
|
|
5364
5438
|
}, [groupedMessages]);
|
|
5365
|
-
const handleScroll = (0,
|
|
5439
|
+
const handleScroll = (0, import_react10.useCallback)((e) => {
|
|
5366
5440
|
const { scrollTop, scrollHeight, clientHeight } = e.currentTarget;
|
|
5367
5441
|
const isAtBottom = scrollHeight - scrollTop - clientHeight < 50;
|
|
5368
5442
|
const isNearTop = scrollTop < 120;
|
|
@@ -5374,9 +5448,13 @@ var ChatUI = ({
|
|
|
5374
5448
|
return { ...prev, isAtBottom };
|
|
5375
5449
|
});
|
|
5376
5450
|
}, [hasMoreMessagesBefore, isLoadingOlderMessages, requestOlderMessages]);
|
|
5377
|
-
const handleSendMessage = (0,
|
|
5451
|
+
const handleSendMessage = (0, import_react10.useCallback)((content, messageAttachments = []) => {
|
|
5378
5452
|
if (!content.trim() && messageAttachments.length === 0) return;
|
|
5379
|
-
callbacks.onSendMessage?.(
|
|
5453
|
+
callbacks.onSendMessage?.(
|
|
5454
|
+
content,
|
|
5455
|
+
messageAttachments,
|
|
5456
|
+
createStateCallback()
|
|
5457
|
+
);
|
|
5380
5458
|
if (initialInputApplied.current && !initialInputConsumedRef.current) {
|
|
5381
5459
|
initialInputConsumedRef.current = true;
|
|
5382
5460
|
onInitialInputConsumed?.();
|
|
@@ -5384,11 +5462,15 @@ var ChatUI = ({
|
|
|
5384
5462
|
setInputValue("");
|
|
5385
5463
|
setAttachments([]);
|
|
5386
5464
|
}, [callbacks, createStateCallback, onInitialInputConsumed]);
|
|
5387
|
-
const handleMessageAction = (0,
|
|
5465
|
+
const handleMessageAction = (0, import_react10.useCallback)((event) => {
|
|
5388
5466
|
const { action, messageId, content } = event;
|
|
5389
5467
|
switch (action) {
|
|
5390
5468
|
case "copy":
|
|
5391
|
-
callbacks.onCopyMessage?.(
|
|
5469
|
+
callbacks.onCopyMessage?.(
|
|
5470
|
+
messageId,
|
|
5471
|
+
content || "",
|
|
5472
|
+
createStateCallback()
|
|
5473
|
+
);
|
|
5392
5474
|
break;
|
|
5393
5475
|
case "edit":
|
|
5394
5476
|
if (content) {
|
|
@@ -5403,7 +5485,7 @@ var ChatUI = ({
|
|
|
5403
5485
|
break;
|
|
5404
5486
|
}
|
|
5405
5487
|
}, [callbacks, createStateCallback]);
|
|
5406
|
-
const handleToggleMessageExpansion = (0,
|
|
5488
|
+
const handleToggleMessageExpansion = (0, import_react10.useCallback)((messageId) => {
|
|
5407
5489
|
setExpandedMessageIds((prev) => {
|
|
5408
5490
|
if (prev[messageId]) {
|
|
5409
5491
|
const next = { ...prev };
|
|
@@ -5416,44 +5498,52 @@ var ChatUI = ({
|
|
|
5416
5498
|
};
|
|
5417
5499
|
});
|
|
5418
5500
|
}, []);
|
|
5419
|
-
const handleCreateThread = (0,
|
|
5501
|
+
const handleCreateThread = (0, import_react10.useCallback)((title) => {
|
|
5420
5502
|
callbacks.onCreateThread?.(title, createStateCallback());
|
|
5421
5503
|
}, [callbacks, createStateCallback]);
|
|
5422
|
-
const handleSelectThread = (0,
|
|
5504
|
+
const handleSelectThread = (0, import_react10.useCallback)((threadId) => {
|
|
5423
5505
|
callbacks.onSelectThread?.(threadId, createStateCallback());
|
|
5424
5506
|
}, [callbacks, createStateCallback]);
|
|
5425
|
-
const handleRenameThread = (0,
|
|
5426
|
-
|
|
5427
|
-
|
|
5428
|
-
|
|
5507
|
+
const handleRenameThread = (0, import_react10.useCallback)(
|
|
5508
|
+
(threadId, newTitle) => {
|
|
5509
|
+
callbacks.onRenameThread?.(threadId, newTitle, createStateCallback());
|
|
5510
|
+
},
|
|
5511
|
+
[callbacks, createStateCallback]
|
|
5512
|
+
);
|
|
5513
|
+
const handleDeleteThread = (0, import_react10.useCallback)((threadId) => {
|
|
5429
5514
|
callbacks.onDeleteThread?.(threadId, createStateCallback());
|
|
5430
5515
|
}, [callbacks, createStateCallback]);
|
|
5431
|
-
const handleArchiveThread = (0,
|
|
5516
|
+
const handleArchiveThread = (0, import_react10.useCallback)((threadId) => {
|
|
5432
5517
|
callbacks.onArchiveThread?.(threadId, createStateCallback());
|
|
5433
5518
|
}, [callbacks, createStateCallback]);
|
|
5434
|
-
const closeSidebar = (0,
|
|
5519
|
+
const closeSidebar = (0, import_react10.useCallback)(() => {
|
|
5435
5520
|
setState((prev) => ({ ...prev, showSidebar: false }));
|
|
5436
5521
|
}, []);
|
|
5437
|
-
const handleCustomComponentToggle = (0,
|
|
5522
|
+
const handleCustomComponentToggle = (0, import_react10.useCallback)(() => {
|
|
5438
5523
|
setState((prev) => ({ ...prev, showSidebar: !prev.showSidebar }));
|
|
5439
5524
|
}, []);
|
|
5440
|
-
const sidebarUser = (0,
|
|
5525
|
+
const sidebarUser = (0, import_react10.useMemo)(() => user ? {
|
|
5441
5526
|
id: user.id,
|
|
5442
5527
|
name: user.name,
|
|
5443
5528
|
email: user.email,
|
|
5444
5529
|
avatar: user.avatar
|
|
5445
5530
|
} : null, [user?.id, user?.name, user?.email, user?.avatar]);
|
|
5446
|
-
const handleViewProfile = (0,
|
|
5531
|
+
const handleViewProfile = (0, import_react10.useCallback)(() => {
|
|
5447
5532
|
setIsUserProfileOpen(true);
|
|
5448
5533
|
callbacks.onViewProfile?.();
|
|
5449
5534
|
}, [callbacks.onViewProfile]);
|
|
5450
|
-
const sidebarUserMenuCallbacks = (0,
|
|
5535
|
+
const sidebarUserMenuCallbacks = (0, import_react10.useMemo)(() => ({
|
|
5451
5536
|
onViewProfile: handleViewProfile,
|
|
5452
5537
|
onOpenSettings: callbacks.onOpenSettings,
|
|
5453
5538
|
onThemeChange: callbacks.onThemeChange,
|
|
5454
5539
|
onLogout: callbacks.onLogout
|
|
5455
|
-
}), [
|
|
5456
|
-
|
|
5540
|
+
}), [
|
|
5541
|
+
handleViewProfile,
|
|
5542
|
+
callbacks.onOpenSettings,
|
|
5543
|
+
callbacks.onThemeChange,
|
|
5544
|
+
callbacks.onLogout
|
|
5545
|
+
]);
|
|
5546
|
+
const renderCustomComponent = (0, import_react10.useCallback)(() => {
|
|
5457
5547
|
const component = config?.customComponent?.component;
|
|
5458
5548
|
if (!component) return null;
|
|
5459
5549
|
if (typeof component === "function") {
|
|
@@ -5493,19 +5583,25 @@ var ChatUI = ({
|
|
|
5493
5583
|
const items = messageSuggestions?.[messageId];
|
|
5494
5584
|
if (!items || items.length === 0) return null;
|
|
5495
5585
|
const inlineSuggestionOffsetClass = config.ui.showAvatars ? config.ui.compactMode ? "ml-9" : "ml-11" : "";
|
|
5496
|
-
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5497
|
-
"
|
|
5586
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5587
|
+
"div",
|
|
5498
5588
|
{
|
|
5499
|
-
|
|
5500
|
-
|
|
5501
|
-
|
|
5502
|
-
|
|
5503
|
-
|
|
5504
|
-
|
|
5505
|
-
|
|
5506
|
-
|
|
5507
|
-
|
|
5508
|
-
|
|
5589
|
+
className: `flex flex-wrap gap-2 mt-2 ${inlineSuggestionOffsetClass}`,
|
|
5590
|
+
children: items.map((suggestion, index) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
5591
|
+
"button",
|
|
5592
|
+
{
|
|
5593
|
+
type: "button",
|
|
5594
|
+
onClick: () => handleSendMessage(suggestion),
|
|
5595
|
+
className: "group inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-full border border-border bg-background hover:bg-accent hover:border-accent-foreground/20 transition-all duration-150 text-foreground/80 hover:text-foreground",
|
|
5596
|
+
children: [
|
|
5597
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react14.Sparkles, { className: "h-3 w-3 text-primary opacity-70 group-hover:opacity-100" }),
|
|
5598
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "max-w-[200px] truncate", children: suggestion })
|
|
5599
|
+
]
|
|
5600
|
+
},
|
|
5601
|
+
`${messageId}-suggestion-${index}`
|
|
5602
|
+
))
|
|
5603
|
+
}
|
|
5604
|
+
);
|
|
5509
5605
|
};
|
|
5510
5606
|
const renderMessageLoadingSkeleton = () => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "space-y-6 py-2", children: [0, 1, 2, 3].map((index) => {
|
|
5511
5607
|
const isUserRow = index % 2 === 1;
|
|
@@ -5527,7 +5623,7 @@ var ChatUI = ({
|
|
|
5527
5623
|
);
|
|
5528
5624
|
}) });
|
|
5529
5625
|
const isMultiAgentMode = config.agentSelector?.mode === "multi";
|
|
5530
|
-
const messageProps = (0,
|
|
5626
|
+
const messageProps = (0, import_react10.useMemo)(() => ({
|
|
5531
5627
|
userAvatar: user?.avatar,
|
|
5532
5628
|
userName: user?.name,
|
|
5533
5629
|
assistantAvatar: assistant?.avatar,
|
|
@@ -5580,202 +5676,229 @@ var ChatUI = ({
|
|
|
5580
5676
|
const shouldShowAgentSelector = Boolean(
|
|
5581
5677
|
config.agentSelector?.enabled && agentOptions.length > 0 && (!config.agentSelector?.hideIfSingle || agentOptions.length > 1) && (isMultiAgentMode ? onParticipantsChange : onSelectAgent)
|
|
5582
5678
|
);
|
|
5583
|
-
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(SidebarProvider, { defaultOpen: true, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
5584
|
-
|
|
5585
|
-
|
|
5586
|
-
{
|
|
5587
|
-
|
|
5588
|
-
|
|
5589
|
-
|
|
5590
|
-
|
|
5591
|
-
|
|
5592
|
-
|
|
5593
|
-
|
|
5594
|
-
|
|
5595
|
-
|
|
5596
|
-
|
|
5597
|
-
|
|
5598
|
-
|
|
5599
|
-
|
|
5600
|
-
|
|
5601
|
-
|
|
5602
|
-
|
|
5603
|
-
|
|
5604
|
-
|
|
5605
|
-
|
|
5606
|
-
|
|
5607
|
-
|
|
5608
|
-
isMobile,
|
|
5609
|
-
onCustomComponentToggle: handleCustomComponentToggle,
|
|
5610
|
-
onNewThread: handleCreateThread,
|
|
5611
|
-
showCustomComponentButton: !!config?.customComponent?.component,
|
|
5612
|
-
showAgentSelector: shouldShowAgentSelector,
|
|
5613
|
-
isMultiAgentMode,
|
|
5614
|
-
agentOptions,
|
|
5615
|
-
selectedAgentId,
|
|
5616
|
-
onSelectAgent,
|
|
5617
|
-
participantIds,
|
|
5618
|
-
onParticipantsChange
|
|
5619
|
-
}
|
|
5620
|
-
),
|
|
5621
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex flex-1 flex-row min-h-0 overflow-hidden", children: [
|
|
5622
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex-1 flex flex-col min-h-0", children: [
|
|
5679
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(SidebarProvider, { defaultOpen: true, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
5680
|
+
"div",
|
|
5681
|
+
{
|
|
5682
|
+
className: `flex h-[100svh] md:h-screen bg-background w-full overflow-hidden ${className}`,
|
|
5683
|
+
children: [
|
|
5684
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5685
|
+
Sidebar2,
|
|
5686
|
+
{
|
|
5687
|
+
threads,
|
|
5688
|
+
currentThreadId: state.selectedThreadId,
|
|
5689
|
+
config,
|
|
5690
|
+
onCreateThread: handleCreateThread,
|
|
5691
|
+
onSelectThread: handleSelectThread,
|
|
5692
|
+
onRenameThread: handleRenameThread,
|
|
5693
|
+
onDeleteThread: handleDeleteThread,
|
|
5694
|
+
onArchiveThread: handleArchiveThread,
|
|
5695
|
+
user: sidebarUser,
|
|
5696
|
+
userMenuCallbacks: sidebarUserMenuCallbacks,
|
|
5697
|
+
currentTheme: config.ui.theme === "auto" ? "system" : config.ui.theme,
|
|
5698
|
+
showThemeOptions: !!callbacks.onThemeChange,
|
|
5699
|
+
userMenuSections,
|
|
5700
|
+
userMenuAdditionalItems
|
|
5701
|
+
}
|
|
5702
|
+
),
|
|
5703
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(SidebarInset, { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex flex-col h-full min-h-0", children: [
|
|
5623
5704
|
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5624
|
-
|
|
5705
|
+
ChatHeader,
|
|
5625
5706
|
{
|
|
5626
|
-
|
|
5627
|
-
|
|
5628
|
-
|
|
5629
|
-
|
|
5630
|
-
|
|
5631
|
-
|
|
5632
|
-
|
|
5633
|
-
|
|
5707
|
+
config,
|
|
5708
|
+
currentThreadTitle: threads.find(
|
|
5709
|
+
(t) => t.id === state.selectedThreadId
|
|
5710
|
+
)?.title,
|
|
5711
|
+
isMobile,
|
|
5712
|
+
onCustomComponentToggle: handleCustomComponentToggle,
|
|
5713
|
+
onNewThread: handleCreateThread,
|
|
5714
|
+
showCustomComponentButton: !!config?.customComponent?.component,
|
|
5715
|
+
showAgentSelector: shouldShowAgentSelector,
|
|
5716
|
+
isMultiAgentMode,
|
|
5717
|
+
agentOptions,
|
|
5718
|
+
selectedAgentId,
|
|
5719
|
+
onSelectAgent,
|
|
5720
|
+
participantIds,
|
|
5721
|
+
onParticipantsChange
|
|
5722
|
+
}
|
|
5723
|
+
),
|
|
5724
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex flex-1 flex-row min-h-0 overflow-hidden", children: [
|
|
5725
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex-1 flex flex-col min-h-0", children: [
|
|
5726
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5727
|
+
ScrollArea,
|
|
5728
|
+
{
|
|
5729
|
+
ref: scrollAreaRef,
|
|
5730
|
+
className: "flex-1 min-h-0",
|
|
5731
|
+
viewportClassName: "p-4 overscroll-contain",
|
|
5732
|
+
onScrollCapture: handleScroll,
|
|
5733
|
+
style: { contain: "strict" },
|
|
5734
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "max-w-4xl mx-auto pb-4", children: [
|
|
5735
|
+
groupedMessages.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex justify-center py-2", children: isLoadingOlderMessages ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "text-xs text-muted-foreground", children: config.labels.loadingOlderMessages }) : hasMoreMessagesBefore ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5736
|
+
"button",
|
|
5737
|
+
{
|
|
5738
|
+
type: "button",
|
|
5739
|
+
onClick: requestOlderMessages,
|
|
5740
|
+
className: "text-xs text-muted-foreground transition-colors hover:text-foreground",
|
|
5741
|
+
children: config.labels.loadOlderMessages
|
|
5742
|
+
}
|
|
5743
|
+
) : null }),
|
|
5744
|
+
isMessagesLoading ? renderMessageLoadingSkeleton() : groupedMessages.length === 0 ? renderSuggestions() : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5745
|
+
"div",
|
|
5746
|
+
{
|
|
5747
|
+
style: {
|
|
5748
|
+
height: `${virtualizer.getTotalSize()}px`,
|
|
5749
|
+
width: "100%",
|
|
5750
|
+
position: "relative"
|
|
5751
|
+
},
|
|
5752
|
+
children: virtualizer.getVirtualItems().map((virtualRow) => {
|
|
5753
|
+
const group = groupedMessages[virtualRow.index];
|
|
5754
|
+
const message = group.message;
|
|
5755
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5756
|
+
"div",
|
|
5757
|
+
{
|
|
5758
|
+
"data-index": virtualRow.index,
|
|
5759
|
+
ref: virtualizer.measureElement,
|
|
5760
|
+
style: {
|
|
5761
|
+
position: "absolute",
|
|
5762
|
+
top: 0,
|
|
5763
|
+
left: 0,
|
|
5764
|
+
width: "100%",
|
|
5765
|
+
transform: `translateY(${virtualRow.start}px)`
|
|
5766
|
+
},
|
|
5767
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
5768
|
+
"div",
|
|
5769
|
+
{
|
|
5770
|
+
className: virtualRow.index === 0 ? "" : "pt-4",
|
|
5771
|
+
children: [
|
|
5772
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5773
|
+
Message,
|
|
5774
|
+
{
|
|
5775
|
+
message,
|
|
5776
|
+
...messageProps,
|
|
5777
|
+
isExpanded: Boolean(
|
|
5778
|
+
expandedMessageIds[message.id]
|
|
5779
|
+
)
|
|
5780
|
+
}
|
|
5781
|
+
),
|
|
5782
|
+
message.role === "assistant" && renderInlineSuggestions(
|
|
5783
|
+
group.suggestionMessageId
|
|
5784
|
+
)
|
|
5785
|
+
]
|
|
5786
|
+
}
|
|
5787
|
+
)
|
|
5788
|
+
},
|
|
5789
|
+
group.id
|
|
5790
|
+
);
|
|
5791
|
+
})
|
|
5792
|
+
}
|
|
5793
|
+
)
|
|
5794
|
+
] })
|
|
5795
|
+
}
|
|
5796
|
+
),
|
|
5797
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "bg-background pb-[env(safe-area-inset-bottom)]", children: [
|
|
5798
|
+
isMultiAgentMode && shouldShowAgentSelector && onTargetAgentChange && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "px-4 pt-1", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5799
|
+
TargetAgentSelector,
|
|
5634
5800
|
{
|
|
5635
|
-
|
|
5636
|
-
|
|
5637
|
-
|
|
5638
|
-
|
|
5801
|
+
agents: participantIds && participantIds.length > 0 ? agentOptions.filter(
|
|
5802
|
+
(a) => participantIds.includes(a.id)
|
|
5803
|
+
) : agentOptions,
|
|
5804
|
+
targetAgentId,
|
|
5805
|
+
onTargetChange: onTargetAgentChange,
|
|
5806
|
+
placeholder: config.agentSelector?.label || "Select agent",
|
|
5807
|
+
disabled: isGenerating
|
|
5639
5808
|
}
|
|
5640
|
-
)
|
|
5641
|
-
|
|
5642
|
-
|
|
5809
|
+
) }),
|
|
5810
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5811
|
+
ChatInput,
|
|
5643
5812
|
{
|
|
5644
|
-
|
|
5645
|
-
|
|
5646
|
-
|
|
5647
|
-
|
|
5813
|
+
value: inputValue,
|
|
5814
|
+
onChange: (value) => {
|
|
5815
|
+
setInputValue(value);
|
|
5816
|
+
if (initialInputApplied.current && !initialInputConsumedRef.current) {
|
|
5817
|
+
initialInputConsumedRef.current = true;
|
|
5818
|
+
onInitialInputConsumed?.();
|
|
5819
|
+
}
|
|
5648
5820
|
},
|
|
5649
|
-
|
|
5650
|
-
|
|
5651
|
-
|
|
5652
|
-
|
|
5653
|
-
|
|
5654
|
-
|
|
5655
|
-
|
|
5656
|
-
|
|
5657
|
-
|
|
5658
|
-
|
|
5659
|
-
|
|
5660
|
-
|
|
5661
|
-
|
|
5662
|
-
|
|
5663
|
-
|
|
5664
|
-
|
|
5665
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5666
|
-
Message,
|
|
5667
|
-
{
|
|
5668
|
-
message,
|
|
5669
|
-
...messageProps,
|
|
5670
|
-
isExpanded: Boolean(expandedMessageIds[message.id])
|
|
5671
|
-
}
|
|
5672
|
-
),
|
|
5673
|
-
message.role === "assistant" && renderInlineSuggestions(group.suggestionMessageId)
|
|
5674
|
-
] })
|
|
5675
|
-
},
|
|
5676
|
-
group.id
|
|
5677
|
-
);
|
|
5678
|
-
})
|
|
5821
|
+
onSubmit: handleSendMessage,
|
|
5822
|
+
attachments,
|
|
5823
|
+
onAttachmentsChange: setAttachments,
|
|
5824
|
+
placeholder: config.labels.inputPlaceholder,
|
|
5825
|
+
disabled: false,
|
|
5826
|
+
isGenerating,
|
|
5827
|
+
onStopGeneration: callbacks.onStopGeneration,
|
|
5828
|
+
enableFileUpload: config.features.enableFileUpload,
|
|
5829
|
+
enableAudioRecording: config.features.enableAudioRecording,
|
|
5830
|
+
maxAttachments: config.features.maxAttachments,
|
|
5831
|
+
maxFileSize: config.features.maxFileSize,
|
|
5832
|
+
config,
|
|
5833
|
+
mentionAgents: participantIds && participantIds.length > 0 ? agentOptions.filter(
|
|
5834
|
+
(a) => participantIds.includes(a.id)
|
|
5835
|
+
) : agentOptions,
|
|
5836
|
+
onTargetAgentChange
|
|
5679
5837
|
}
|
|
5680
5838
|
)
|
|
5681
5839
|
] })
|
|
5682
|
-
}
|
|
5683
|
-
|
|
5684
|
-
|
|
5685
|
-
isMultiAgentMode && shouldShowAgentSelector && onTargetAgentChange && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "px-4 pt-1", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5686
|
-
TargetAgentSelector,
|
|
5687
|
-
{
|
|
5688
|
-
agents: participantIds && participantIds.length > 0 ? agentOptions.filter((a) => participantIds.includes(a.id)) : agentOptions,
|
|
5689
|
-
targetAgentId,
|
|
5690
|
-
onTargetChange: onTargetAgentChange,
|
|
5691
|
-
placeholder: config.agentSelector?.label || "Select agent",
|
|
5692
|
-
disabled: isGenerating
|
|
5693
|
-
}
|
|
5694
|
-
) }),
|
|
5695
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5696
|
-
ChatInput,
|
|
5840
|
+
] }),
|
|
5841
|
+
config?.customComponent?.component && !isMobile && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5842
|
+
"div",
|
|
5697
5843
|
{
|
|
5698
|
-
|
|
5699
|
-
|
|
5700
|
-
|
|
5701
|
-
if (initialInputApplied.current && !initialInputConsumedRef.current) {
|
|
5702
|
-
initialInputConsumedRef.current = true;
|
|
5703
|
-
onInitialInputConsumed?.();
|
|
5704
|
-
}
|
|
5844
|
+
className: "h-full transition-all duration-300 ease-in-out overflow-hidden",
|
|
5845
|
+
style: {
|
|
5846
|
+
width: state.showSidebar ? config.customComponent.panelWidth ?? 320 : 0
|
|
5705
5847
|
},
|
|
5706
|
-
|
|
5707
|
-
|
|
5708
|
-
|
|
5709
|
-
|
|
5710
|
-
|
|
5711
|
-
|
|
5712
|
-
|
|
5713
|
-
|
|
5714
|
-
|
|
5715
|
-
|
|
5716
|
-
maxFileSize: config.features.maxFileSize,
|
|
5717
|
-
config,
|
|
5718
|
-
mentionAgents: participantIds && participantIds.length > 0 ? agentOptions.filter((a) => participantIds.includes(a.id)) : agentOptions,
|
|
5719
|
-
onTargetAgentChange
|
|
5848
|
+
children: state.showSidebar && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5849
|
+
"div",
|
|
5850
|
+
{
|
|
5851
|
+
className: "h-full overflow-hidden border-l bg-background animate-in slide-in-from-right-4 duration-300",
|
|
5852
|
+
style: {
|
|
5853
|
+
width: config.customComponent.panelWidth ?? 320
|
|
5854
|
+
},
|
|
5855
|
+
children: renderCustomComponent()
|
|
5856
|
+
}
|
|
5857
|
+
)
|
|
5720
5858
|
}
|
|
5721
5859
|
)
|
|
5722
5860
|
] })
|
|
5861
|
+
] }) }),
|
|
5862
|
+
isCustomMounted && config.customComponent?.component && isMobile && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "fixed inset-0 z-50", children: [
|
|
5863
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5864
|
+
"div",
|
|
5865
|
+
{
|
|
5866
|
+
className: `absolute inset-0 bg-background/80 backdrop-blur-sm transition-opacity duration-200 ease-out ${isCustomVisible ? "opacity-100" : "opacity-0"}`,
|
|
5867
|
+
style: { willChange: "opacity" },
|
|
5868
|
+
onClick: closeSidebar
|
|
5869
|
+
}
|
|
5870
|
+
),
|
|
5871
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5872
|
+
"div",
|
|
5873
|
+
{
|
|
5874
|
+
className: `absolute top-0 right-0 h-full w-full bg-background transform-gpu transition-transform duration-200 ease-out ${isCustomVisible ? "translate-x-0" : "translate-x-full"}`,
|
|
5875
|
+
style: { willChange: "transform" },
|
|
5876
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "h-full overflow-hidden", children: renderCustomComponent() })
|
|
5877
|
+
}
|
|
5878
|
+
)
|
|
5723
5879
|
] }),
|
|
5724
|
-
|
|
5725
|
-
|
|
5880
|
+
isUserProfileOpen && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5881
|
+
UserProfile,
|
|
5726
5882
|
{
|
|
5727
|
-
|
|
5728
|
-
|
|
5729
|
-
|
|
5730
|
-
|
|
5731
|
-
|
|
5732
|
-
|
|
5733
|
-
|
|
5734
|
-
|
|
5735
|
-
|
|
5736
|
-
|
|
5883
|
+
isOpen: isUserProfileOpen,
|
|
5884
|
+
onClose: () => setIsUserProfileOpen(false),
|
|
5885
|
+
user: user ? {
|
|
5886
|
+
id: user.id,
|
|
5887
|
+
name: user.name,
|
|
5888
|
+
email: user.email,
|
|
5889
|
+
avatar: user.avatar
|
|
5890
|
+
} : null,
|
|
5891
|
+
customFields: userContext?.customFields,
|
|
5892
|
+
memories: userContext?.memories?.items,
|
|
5893
|
+
onLogout: callbacks.onLogout,
|
|
5894
|
+
onAddMemory,
|
|
5895
|
+
onUpdateMemory,
|
|
5896
|
+
onDeleteMemory
|
|
5737
5897
|
}
|
|
5738
5898
|
)
|
|
5739
|
-
]
|
|
5740
|
-
|
|
5741
|
-
|
|
5742
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5743
|
-
"div",
|
|
5744
|
-
{
|
|
5745
|
-
className: `absolute inset-0 bg-background/80 backdrop-blur-sm transition-opacity duration-200 ease-out ${isCustomVisible ? "opacity-100" : "opacity-0"}`,
|
|
5746
|
-
style: { willChange: "opacity" },
|
|
5747
|
-
onClick: closeSidebar
|
|
5748
|
-
}
|
|
5749
|
-
),
|
|
5750
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5751
|
-
"div",
|
|
5752
|
-
{
|
|
5753
|
-
className: `absolute top-0 right-0 h-full w-full bg-background transform-gpu transition-transform duration-200 ease-out ${isCustomVisible ? "translate-x-0" : "translate-x-full"}`,
|
|
5754
|
-
style: { willChange: "transform" },
|
|
5755
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "h-full overflow-hidden", children: renderCustomComponent() })
|
|
5756
|
-
}
|
|
5757
|
-
)
|
|
5758
|
-
] }),
|
|
5759
|
-
isUserProfileOpen && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
5760
|
-
UserProfile,
|
|
5761
|
-
{
|
|
5762
|
-
isOpen: isUserProfileOpen,
|
|
5763
|
-
onClose: () => setIsUserProfileOpen(false),
|
|
5764
|
-
user: user ? {
|
|
5765
|
-
id: user.id,
|
|
5766
|
-
name: user.name,
|
|
5767
|
-
email: user.email,
|
|
5768
|
-
avatar: user.avatar
|
|
5769
|
-
} : null,
|
|
5770
|
-
customFields: userContext?.customFields,
|
|
5771
|
-
memories: userContext?.memories?.items,
|
|
5772
|
-
onLogout: callbacks.onLogout,
|
|
5773
|
-
onAddMemory,
|
|
5774
|
-
onUpdateMemory,
|
|
5775
|
-
onDeleteMemory
|
|
5776
|
-
}
|
|
5777
|
-
)
|
|
5778
|
-
] }) }) });
|
|
5899
|
+
]
|
|
5900
|
+
}
|
|
5901
|
+
) }) });
|
|
5779
5902
|
};
|
|
5780
5903
|
// Annotate the CommonJS export names for ESM import in node:
|
|
5781
5904
|
0 && (module.exports = {
|