reachat 3.0.0 → 3.1.0
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/{CSVFileRenderer-C2tuexJf.js → CSVFileRenderer-C2E4Xnkz.js} +2 -2
- package/dist/{CSVFileRenderer-C2tuexJf.js.map → CSVFileRenderer-C2E4Xnkz.js.map} +1 -1
- package/dist/{DefaultFileRenderer-CJ3jwiQa.js → DefaultFileRenderer-Day12qYs.js} +2 -2
- package/dist/{DefaultFileRenderer-CJ3jwiQa.js.map → DefaultFileRenderer-Day12qYs.js.map} +1 -1
- package/dist/docs.json +16 -16
- package/dist/{index-8tlsyFe-.js → index-CZSBRZbI.js} +70 -99
- package/dist/index-CZSBRZbI.js.map +1 -0
- package/dist/index.css +75 -1077
- package/dist/index.js +1 -1
- package/dist/index.umd.cjs +69 -98
- package/dist/index.umd.cjs.map +1 -1
- package/dist/stories/Changelog.mdx +1 -1
- package/dist/stories/Intro.mdx +1 -1
- package/package.json +24 -25
- package/dist/index-8tlsyFe-.js.map +0 -1
|
@@ -65,10 +65,7 @@ const FileInput = ({
|
|
|
65
65
|
variant: "text",
|
|
66
66
|
disabled: isLoading || disabled,
|
|
67
67
|
className: cn(theme.input.upload),
|
|
68
|
-
onClick: () =>
|
|
69
|
-
var _a;
|
|
70
|
-
return (_a = fileInputRef.current) == null ? void 0 : _a.click();
|
|
71
|
-
},
|
|
68
|
+
onClick: () => fileInputRef.current?.click(),
|
|
72
69
|
children: attachIcon
|
|
73
70
|
}
|
|
74
71
|
)
|
|
@@ -323,18 +320,16 @@ const chatTheme = {
|
|
|
323
320
|
const POPUP_STYLE = { zIndex: 9999 };
|
|
324
321
|
const MentionList = forwardRef(
|
|
325
322
|
({ items, command, triggerChar, config, query }, ref) => {
|
|
326
|
-
var _a;
|
|
327
323
|
const [selectedIndex, setSelectedIndex] = useState(0);
|
|
328
324
|
const itemRefs = useRef([]);
|
|
329
325
|
const { theme } = useContext(ChatContext);
|
|
330
|
-
const popupTheme =
|
|
326
|
+
const popupTheme = theme?.input?.popup || chatTheme.input.popup;
|
|
331
327
|
useEffect(() => {
|
|
332
328
|
setSelectedIndex(0);
|
|
333
329
|
}, [items]);
|
|
334
330
|
useEffect(() => {
|
|
335
|
-
var _a2;
|
|
336
331
|
if (itemRefs.current[selectedIndex]) {
|
|
337
|
-
|
|
332
|
+
itemRefs.current[selectedIndex]?.scrollIntoView({
|
|
338
333
|
block: "nearest",
|
|
339
334
|
behavior: "smooth"
|
|
340
335
|
});
|
|
@@ -465,10 +460,7 @@ function createSuggestionConfig(config, triggerChar, suggestionActiveRef) {
|
|
|
465
460
|
if (!query) return config.items.slice(0, config.maxResults || 10);
|
|
466
461
|
const lowerQuery = query.toLowerCase();
|
|
467
462
|
return config.items.filter(
|
|
468
|
-
(item) =>
|
|
469
|
-
var _a;
|
|
470
|
-
return item.label.toLowerCase().includes(lowerQuery) || ((_a = item.description) == null ? void 0 : _a.toLowerCase().includes(lowerQuery));
|
|
471
|
-
}
|
|
463
|
+
(item) => item.label.toLowerCase().includes(lowerQuery) || item.description?.toLowerCase().includes(lowerQuery)
|
|
472
464
|
).slice(0, config.maxResults || 10);
|
|
473
465
|
},
|
|
474
466
|
// Render callbacks for managing the popup lifecycle
|
|
@@ -495,7 +487,7 @@ function createSuggestionConfig(config, triggerChar, suggestionActiveRef) {
|
|
|
495
487
|
},
|
|
496
488
|
// Called when query or items change
|
|
497
489
|
onUpdate: (props) => {
|
|
498
|
-
component
|
|
490
|
+
component?.updateProps({
|
|
499
491
|
...props,
|
|
500
492
|
triggerChar,
|
|
501
493
|
config
|
|
@@ -503,25 +495,23 @@ function createSuggestionConfig(config, triggerChar, suggestionActiveRef) {
|
|
|
503
495
|
if (!props.clientRect) {
|
|
504
496
|
return;
|
|
505
497
|
}
|
|
506
|
-
if (component
|
|
498
|
+
if (component?.element) {
|
|
507
499
|
updatePopupPosition(props.editor, component.element);
|
|
508
500
|
}
|
|
509
501
|
},
|
|
510
502
|
// Handle keyboard navigation (Escape closes popup)
|
|
511
503
|
onKeyDown: (props) => {
|
|
512
|
-
var _a;
|
|
513
504
|
if (props.event.key === "Escape") {
|
|
514
|
-
component
|
|
505
|
+
component?.destroy();
|
|
515
506
|
return true;
|
|
516
507
|
}
|
|
517
|
-
return
|
|
508
|
+
return component?.ref?.onKeyDown(props) ?? false;
|
|
518
509
|
},
|
|
519
510
|
// Cleanup when suggestion is dismissed
|
|
520
511
|
onExit: () => {
|
|
521
|
-
var _a;
|
|
522
512
|
suggestionActiveRef.current = false;
|
|
523
|
-
|
|
524
|
-
component
|
|
513
|
+
component?.element?.remove();
|
|
514
|
+
component?.destroy();
|
|
525
515
|
}
|
|
526
516
|
};
|
|
527
517
|
}
|
|
@@ -541,12 +531,10 @@ const RichTextInput = forwardRef(
|
|
|
541
531
|
onSubmit,
|
|
542
532
|
onChange
|
|
543
533
|
}, ref) => {
|
|
544
|
-
var _a, _b, _c, _d;
|
|
545
534
|
const { theme } = useContext(ChatContext);
|
|
546
535
|
const containerRef = useRef(null);
|
|
547
536
|
const suggestionActiveRef = useRef(false);
|
|
548
537
|
const extensions = useMemo(() => {
|
|
549
|
-
var _a2, _b2, _c2, _d2, _e, _f, _g, _h;
|
|
550
538
|
const exts = [
|
|
551
539
|
Document,
|
|
552
540
|
Paragraph.configure({
|
|
@@ -565,7 +553,7 @@ const RichTextInput = forwardRef(
|
|
|
565
553
|
exts.push(
|
|
566
554
|
Mention.configure({
|
|
567
555
|
HTMLAttributes: {
|
|
568
|
-
class: cn(
|
|
556
|
+
class: cn(theme?.input?.tag?.base, theme?.input?.tag?.mention)
|
|
569
557
|
},
|
|
570
558
|
suggestion: createSuggestionConfig(
|
|
571
559
|
mentions,
|
|
@@ -581,7 +569,7 @@ const RichTextInput = forwardRef(
|
|
|
581
569
|
exts.push(
|
|
582
570
|
Mention.configure({
|
|
583
571
|
HTMLAttributes: {
|
|
584
|
-
class: cn(
|
|
572
|
+
class: cn(theme?.input?.tag?.base, theme?.input?.tag?.command)
|
|
585
573
|
},
|
|
586
574
|
suggestion: createSuggestionConfig(
|
|
587
575
|
commands,
|
|
@@ -602,13 +590,13 @@ const RichTextInput = forwardRef(
|
|
|
602
590
|
immediatelyRender: false,
|
|
603
591
|
onUpdate: ({ editor: editor2 }) => {
|
|
604
592
|
const text = editor2.getText();
|
|
605
|
-
onChange
|
|
593
|
+
onChange?.(text);
|
|
606
594
|
},
|
|
607
595
|
editorProps: {
|
|
608
596
|
attributes: {
|
|
609
597
|
class: cn(
|
|
610
|
-
|
|
611
|
-
|
|
598
|
+
theme?.input?.editor?.base,
|
|
599
|
+
theme?.input?.editor?.placeholder
|
|
612
600
|
),
|
|
613
601
|
style: `min-height: ${minHeight}px; max-height: ${maxHeight}px;`,
|
|
614
602
|
role: "textbox",
|
|
@@ -626,7 +614,7 @@ const RichTextInput = forwardRef(
|
|
|
626
614
|
if (text.trim() && onSubmit) {
|
|
627
615
|
event.preventDefault();
|
|
628
616
|
onSubmit(text);
|
|
629
|
-
editor
|
|
617
|
+
editor?.commands.clearContent();
|
|
630
618
|
return true;
|
|
631
619
|
}
|
|
632
620
|
}
|
|
@@ -643,16 +631,16 @@ const RichTextInput = forwardRef(
|
|
|
643
631
|
}, [editor, autoFocus]);
|
|
644
632
|
useImperativeHandle(ref, () => ({
|
|
645
633
|
focus: () => {
|
|
646
|
-
editor
|
|
634
|
+
editor?.commands.focus();
|
|
647
635
|
},
|
|
648
636
|
getValue: () => {
|
|
649
|
-
return
|
|
637
|
+
return editor?.getText() || "";
|
|
650
638
|
},
|
|
651
639
|
setValue: (newValue) => {
|
|
652
|
-
editor
|
|
640
|
+
editor?.commands.setContent(newValue ? `<p>${newValue}</p>` : "");
|
|
653
641
|
},
|
|
654
642
|
insertText: (text) => {
|
|
655
|
-
editor
|
|
643
|
+
editor?.commands.insertContent(text);
|
|
656
644
|
}
|
|
657
645
|
}));
|
|
658
646
|
return /* @__PURE__ */ jsx("div", { ref: containerRef, className: cn("relative w-full", className), children: /* @__PURE__ */ jsx(EditorContent, { editor }) });
|
|
@@ -686,43 +674,37 @@ const ChatInput = forwardRef(
|
|
|
686
674
|
const inputRef = useRef(null);
|
|
687
675
|
const containerRef = useRef(null);
|
|
688
676
|
useEffect(() => {
|
|
689
|
-
var _a;
|
|
690
677
|
if (autoFocus) {
|
|
691
|
-
|
|
678
|
+
inputRef.current?.focus();
|
|
692
679
|
}
|
|
693
680
|
}, [activeSessionId, autoFocus]);
|
|
694
681
|
useImperativeHandle(ref, () => ({
|
|
695
682
|
focus: () => {
|
|
696
|
-
|
|
697
|
-
(_a = inputRef.current) == null ? void 0 : _a.focus();
|
|
683
|
+
inputRef.current?.focus();
|
|
698
684
|
},
|
|
699
685
|
getValue: () => {
|
|
700
|
-
|
|
701
|
-
return ((_a = inputRef.current) == null ? void 0 : _a.getValue()) || "";
|
|
686
|
+
return inputRef.current?.getValue() || "";
|
|
702
687
|
},
|
|
703
688
|
setValue: (value) => {
|
|
704
|
-
var _a;
|
|
705
689
|
setMessage(value);
|
|
706
|
-
|
|
690
|
+
inputRef.current?.setValue(value);
|
|
707
691
|
},
|
|
708
692
|
insertText: (text) => {
|
|
709
|
-
|
|
710
|
-
(_a = inputRef.current) == null ? void 0 : _a.insertText(text);
|
|
693
|
+
inputRef.current?.insertText(text);
|
|
711
694
|
}
|
|
712
695
|
}));
|
|
713
696
|
const handleSendMessage = useCallback(() => {
|
|
714
|
-
|
|
715
|
-
const currentMessage = (_a = inputRef.current) == null ? void 0 : _a.getValue();
|
|
697
|
+
const currentMessage = inputRef.current?.getValue();
|
|
716
698
|
if (currentMessage.trim()) {
|
|
717
|
-
sendMessage
|
|
699
|
+
sendMessage?.(currentMessage);
|
|
718
700
|
setMessage("");
|
|
719
|
-
|
|
701
|
+
inputRef.current?.setValue("");
|
|
720
702
|
}
|
|
721
703
|
}, [sendMessage]);
|
|
722
704
|
const handleSubmit = useCallback(
|
|
723
705
|
(value) => {
|
|
724
706
|
if (value.trim()) {
|
|
725
|
-
sendMessage
|
|
707
|
+
sendMessage?.(value);
|
|
726
708
|
setMessage("");
|
|
727
709
|
}
|
|
728
710
|
},
|
|
@@ -733,8 +715,7 @@ const ChatInput = forwardRef(
|
|
|
733
715
|
}, []);
|
|
734
716
|
const handleFileUpload = useCallback(
|
|
735
717
|
(event) => {
|
|
736
|
-
|
|
737
|
-
const file = (_a = event.target.files) == null ? void 0 : _a[0];
|
|
718
|
+
const file = event.target.files?.[0];
|
|
738
719
|
if (file && fileUpload) {
|
|
739
720
|
fileUpload(file);
|
|
740
721
|
}
|
|
@@ -768,7 +749,7 @@ const ChatInput = forwardRef(
|
|
|
768
749
|
}
|
|
769
750
|
),
|
|
770
751
|
/* @__PURE__ */ jsxs("div", { className: cn(theme.input.actions.base), children: [
|
|
771
|
-
|
|
752
|
+
allowedFiles?.length > 0 && /* @__PURE__ */ jsx(
|
|
772
753
|
FileInput,
|
|
773
754
|
{
|
|
774
755
|
allowedFiles,
|
|
@@ -1878,7 +1859,7 @@ const CodeHighlighter = ({
|
|
|
1878
1859
|
toolbarClassName,
|
|
1879
1860
|
theme = dark
|
|
1880
1861
|
}) => {
|
|
1881
|
-
const match = language
|
|
1862
|
+
const match = language?.match(/language-(\w+)/);
|
|
1882
1863
|
const lang = match ? match[1] : "text";
|
|
1883
1864
|
const handleCopy = (text) => {
|
|
1884
1865
|
navigator.clipboard.writeText(text).then(() => {
|
|
@@ -1963,14 +1944,14 @@ const Markdown = ({
|
|
|
1963
1944
|
ol: (props) => /* @__PURE__ */ jsx("ol", { ...props, className: cn(theme.messages.message.markdown.ol) }),
|
|
1964
1945
|
// 'redact' is a custom element created by remarkRedact, not a standard
|
|
1965
1946
|
// HTML tag, so it falls outside react-markdown's Components type.
|
|
1966
|
-
redact: (props) => /* @__PURE__ */ jsx(
|
|
1947
|
+
redact: ((props) => /* @__PURE__ */ jsx(
|
|
1967
1948
|
Redact,
|
|
1968
1949
|
{
|
|
1969
1950
|
value: props["data-redact-value"] || props.children,
|
|
1970
1951
|
allowToggle: true,
|
|
1971
1952
|
tooltipText: `${props["data-redact-name"] || "Sensitive"} information - Click to toggle`
|
|
1972
1953
|
}
|
|
1973
|
-
)
|
|
1954
|
+
))
|
|
1974
1955
|
};
|
|
1975
1956
|
return {
|
|
1976
1957
|
...defaultComponents,
|
|
@@ -2179,8 +2160,8 @@ const commonRedactMatchers = [
|
|
|
2179
2160
|
bitcoinMatcher
|
|
2180
2161
|
];
|
|
2181
2162
|
const SvgFile = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 16, height: 16, viewBox: "0 0 16 16", fill: "currentColor", ...props }, /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2.7036 1.37034C3.04741 1.02653 3.51373 0.833374 3.99996 0.833374H9.33329H9.33331C9.47275 0.833374 9.59885 0.890449 9.68954 0.98251L13.6843 4.97722C13.7763 5.0679 13.8333 5.19398 13.8333 5.33337L13.8333 5.3379V13.3334C13.8333 13.8196 13.6401 14.2859 13.2963 14.6297C12.9525 14.9736 12.4862 15.1667 12 15.1667H3.99996C3.51373 15.1667 3.04741 14.9736 2.7036 14.6297C2.35978 14.2859 2.16663 13.8196 2.16663 13.3334V2.66671C2.16663 2.18048 2.35978 1.71416 2.7036 1.37034ZM3.99996 1.83337H8.83331V5.33337C8.83331 5.60952 9.05717 5.83337 9.33331 5.83337H12.8333V13.3334C12.8333 13.5544 12.7455 13.7663 12.5892 13.9226C12.4329 14.0789 12.221 14.1667 12 14.1667H3.99996C3.77895 14.1667 3.56698 14.0789 3.4107 13.9226C3.25442 13.7663 3.16663 13.5544 3.16663 13.3334V2.66671C3.16663 2.44569 3.25442 2.23373 3.4107 2.07745C3.56698 1.92117 3.77895 1.83337 3.99996 1.83337ZM9.83331 2.5405L12.1262 4.83337H9.83331V2.5405ZM5.33331 8.16663C5.05717 8.16663 4.83331 8.39048 4.83331 8.66663C4.83331 8.94277 5.05717 9.16663 5.33331 9.16663H10.6666C10.9428 9.16663 11.1666 8.94277 11.1666 8.66663C11.1666 8.39048 10.9428 8.16663 10.6666 8.16663H5.33331ZM4.83331 11.3334C4.83331 11.0572 5.05717 10.8334 5.33331 10.8334H10.6666C10.9428 10.8334 11.1666 11.0572 11.1666 11.3334C11.1666 11.6095 10.9428 11.8334 10.6666 11.8334H5.33331C5.05717 11.8334 4.83331 11.6095 4.83331 11.3334ZM5.33331 5.5C5.05717 5.5 4.83331 5.72386 4.83331 6C4.83331 6.27614 5.05717 6.5 5.33331 6.5H6.66665C6.94279 6.5 7.16665 6.27614 7.16665 6C7.16665 5.72386 6.94279 5.5 6.66665 5.5H5.33331Z" }));
|
|
2182
|
-
const DefaultFileRenderer = lazy(() => import("./DefaultFileRenderer-
|
|
2183
|
-
const CSVFileRenderer = lazy(() => import("./CSVFileRenderer-
|
|
2163
|
+
const DefaultFileRenderer = lazy(() => import("./DefaultFileRenderer-Day12qYs.js"));
|
|
2164
|
+
const CSVFileRenderer = lazy(() => import("./CSVFileRenderer-C2E4Xnkz.js"));
|
|
2184
2165
|
const ImageFileRenderer = lazy(() => import("./ImageFileRenderer-C8tVW3I8.js"));
|
|
2185
2166
|
const PDFFileRenderer = lazy(() => import("./PDFFileRenderer-DQdFS2l6.js"));
|
|
2186
2167
|
const FILE_TYPE_RENDERER_MAP = {
|
|
@@ -2197,7 +2178,7 @@ const MessageFile = ({
|
|
|
2197
2178
|
}) => {
|
|
2198
2179
|
const { theme } = useContext(ChatContext);
|
|
2199
2180
|
const FileRenderer = useMemo(() => {
|
|
2200
|
-
const Renderer = Object.keys(FILE_TYPE_RENDERER_MAP).find((key) => type
|
|
2181
|
+
const Renderer = Object.keys(FILE_TYPE_RENDERER_MAP).find((key) => type?.startsWith(key)) ?? "default";
|
|
2201
2182
|
return FILE_TYPE_RENDERER_MAP[Renderer] || DefaultFileRenderer;
|
|
2202
2183
|
}, [type]);
|
|
2203
2184
|
return /* @__PURE__ */ jsx(
|
|
@@ -2221,8 +2202,7 @@ const MessageFiles = memo(({ files, children }) => {
|
|
|
2221
2202
|
}
|
|
2222
2203
|
return files.reduce(
|
|
2223
2204
|
(acc, file) => {
|
|
2224
|
-
|
|
2225
|
-
if ((_a = file.type) == null ? void 0 : _a.startsWith("image/")) {
|
|
2205
|
+
if (file.type?.startsWith("image/")) {
|
|
2226
2206
|
acc.imageFiles.push(file);
|
|
2227
2207
|
} else {
|
|
2228
2208
|
acc.otherFiles.push(file);
|
|
@@ -2524,7 +2504,6 @@ const SessionMessages = ({
|
|
|
2524
2504
|
showMoreText = "Show more",
|
|
2525
2505
|
showScrollBottomButton = false
|
|
2526
2506
|
}) => {
|
|
2527
|
-
var _a, _b, _c, _d, _e, _f;
|
|
2528
2507
|
const { activeSession, theme } = useContext(ChatContext);
|
|
2529
2508
|
const contentRef = useRef(null);
|
|
2530
2509
|
const messagesRef = useRef(null);
|
|
@@ -2565,7 +2544,7 @@ const SessionMessages = ({
|
|
|
2565
2544
|
}
|
|
2566
2545
|
};
|
|
2567
2546
|
const reversedConvos = useMemo(
|
|
2568
|
-
() => [...
|
|
2547
|
+
() => [...activeSession?.conversations ?? []].reverse(),
|
|
2569
2548
|
[activeSession]
|
|
2570
2549
|
);
|
|
2571
2550
|
const { data, hasMore, showNext } = useInfinityList({
|
|
@@ -2573,7 +2552,7 @@ const SessionMessages = ({
|
|
|
2573
2552
|
size: limit
|
|
2574
2553
|
});
|
|
2575
2554
|
const reReversedConvo = useMemo(() => [...data].reverse(), [data]);
|
|
2576
|
-
const convosToRender = limit ? reReversedConvo : activeSession
|
|
2555
|
+
const convosToRender = limit ? reReversedConvo : activeSession?.conversations;
|
|
2577
2556
|
if (!activeSession) {
|
|
2578
2557
|
return /* @__PURE__ */ jsx(SessionEmpty, { children: newSessionContent });
|
|
2579
2558
|
}
|
|
@@ -2583,7 +2562,7 @@ const SessionMessages = ({
|
|
|
2583
2562
|
{
|
|
2584
2563
|
className: cn(theme.messages.content, "h-full"),
|
|
2585
2564
|
ref: contentRef,
|
|
2586
|
-
id: activeSession
|
|
2565
|
+
id: activeSession?.id,
|
|
2587
2566
|
children: [
|
|
2588
2567
|
hasMore && /* @__PURE__ */ jsx(
|
|
2589
2568
|
Button,
|
|
@@ -2617,7 +2596,7 @@ const SessionMessages = ({
|
|
|
2617
2596
|
conversation.id
|
|
2618
2597
|
))
|
|
2619
2598
|
},
|
|
2620
|
-
activeSession
|
|
2599
|
+
activeSession?.id
|
|
2621
2600
|
) })
|
|
2622
2601
|
]
|
|
2623
2602
|
}
|
|
@@ -2629,12 +2608,12 @@ const SessionMessages = ({
|
|
|
2629
2608
|
animate: { y: 0, opacity: 1 },
|
|
2630
2609
|
exit: { y: 100, opacity: 0 },
|
|
2631
2610
|
transition: { duration: 0.3, ease: "easeOut" },
|
|
2632
|
-
className:
|
|
2611
|
+
className: theme.messages?.message?.scrollToBottom?.container,
|
|
2633
2612
|
children: /* @__PURE__ */ jsx(
|
|
2634
2613
|
IconButton,
|
|
2635
2614
|
{
|
|
2636
2615
|
onClick: handleScrollToBottom,
|
|
2637
|
-
className:
|
|
2616
|
+
className: theme.messages?.message?.scrollToBottom?.button,
|
|
2638
2617
|
size: "sm",
|
|
2639
2618
|
children: /* @__PURE__ */ jsx(SvgArrowDown, {})
|
|
2640
2619
|
}
|
|
@@ -2705,20 +2684,20 @@ const Chat = ({
|
|
|
2705
2684
|
const handleSelectSession = useCallback(
|
|
2706
2685
|
(sessionId) => {
|
|
2707
2686
|
setInternalActiveSessionID(sessionId);
|
|
2708
|
-
onSelectSession
|
|
2687
|
+
onSelectSession?.(sessionId);
|
|
2709
2688
|
},
|
|
2710
2689
|
[onSelectSession]
|
|
2711
2690
|
);
|
|
2712
2691
|
const handleDeleteSession = useCallback(
|
|
2713
2692
|
(sessionId) => {
|
|
2714
2693
|
setInternalActiveSessionID(void 0);
|
|
2715
|
-
onDeleteSession
|
|
2694
|
+
onDeleteSession?.(sessionId);
|
|
2716
2695
|
},
|
|
2717
2696
|
[onDeleteSession]
|
|
2718
2697
|
);
|
|
2719
2698
|
const handleCreateNewSession = useCallback(() => {
|
|
2720
2699
|
setInternalActiveSessionID(void 0);
|
|
2721
|
-
onNewSession
|
|
2700
|
+
onNewSession?.();
|
|
2722
2701
|
}, [onNewSession]);
|
|
2723
2702
|
useHotkeys([
|
|
2724
2703
|
{
|
|
@@ -2811,7 +2790,7 @@ const SessionListItem = memo(
|
|
|
2811
2790
|
const { activeSessionId, selectSession, deleteSession, theme } = useContext(ChatContext);
|
|
2812
2791
|
const Comp = children ? Slot : ListItem;
|
|
2813
2792
|
const handleSelect = useCallback(() => {
|
|
2814
|
-
selectSession
|
|
2793
|
+
selectSession?.(session.id);
|
|
2815
2794
|
}, [selectSession, session.id]);
|
|
2816
2795
|
const handleDelete = useCallback(
|
|
2817
2796
|
(e) => {
|
|
@@ -2873,7 +2852,7 @@ const SessionsList = ({
|
|
|
2873
2852
|
}),
|
|
2874
2853
|
children: [
|
|
2875
2854
|
/* @__PURE__ */ jsx(List, { children }),
|
|
2876
|
-
templates && !activeSessionId && /* @__PURE__ */ jsx("div", { className: "mt-4", children: templates.map((template) => /* @__PURE__ */ jsx("div", { onClick: () => createSession
|
|
2855
|
+
templates && !activeSessionId && /* @__PURE__ */ jsx("div", { className: "mt-4", children: templates.map((template) => /* @__PURE__ */ jsx("div", { onClick: () => createSession?.(), children: /* @__PURE__ */ jsx(
|
|
2877
2856
|
SessionListItem,
|
|
2878
2857
|
{
|
|
2879
2858
|
session: {
|
|
@@ -2902,7 +2881,7 @@ const NewSessionButton = ({
|
|
|
2902
2881
|
fullWidth: true,
|
|
2903
2882
|
disableMargins: true,
|
|
2904
2883
|
color: "primary",
|
|
2905
|
-
|
|
2884
|
+
start: /* @__PURE__ */ jsx(SvgPlus, {}),
|
|
2906
2885
|
className: cn(theme.sessions.create),
|
|
2907
2886
|
disabled,
|
|
2908
2887
|
onClick: createSession,
|
|
@@ -3038,7 +3017,7 @@ const ChatSuggestion = ({
|
|
|
3038
3017
|
const { theme, disabled, isLoading } = useContext(ChatContext);
|
|
3039
3018
|
const handleClick = () => {
|
|
3040
3019
|
if (disabled || isLoading) return;
|
|
3041
|
-
onClick
|
|
3020
|
+
onClick?.(content);
|
|
3042
3021
|
};
|
|
3043
3022
|
return /* @__PURE__ */ jsx(
|
|
3044
3023
|
Button,
|
|
@@ -3291,8 +3270,7 @@ function parseSSELine(line) {
|
|
|
3291
3270
|
return null;
|
|
3292
3271
|
}
|
|
3293
3272
|
async function* parseSSE(response, signal) {
|
|
3294
|
-
|
|
3295
|
-
const reader = (_a = response.body) == null ? void 0 : _a.getReader();
|
|
3273
|
+
const reader = response.body?.getReader();
|
|
3296
3274
|
if (!reader) {
|
|
3297
3275
|
throw new Error("Response body is not readable");
|
|
3298
3276
|
}
|
|
@@ -3344,8 +3322,7 @@ function useAgUi({
|
|
|
3344
3322
|
onEventRef.current = onEvent;
|
|
3345
3323
|
useEffect(() => {
|
|
3346
3324
|
return () => {
|
|
3347
|
-
|
|
3348
|
-
(_a = abortRef.current) == null ? void 0 : _a.abort();
|
|
3325
|
+
abortRef.current?.abort();
|
|
3349
3326
|
};
|
|
3350
3327
|
}, []);
|
|
3351
3328
|
const selectSession = useCallback((sessionId) => {
|
|
@@ -3373,15 +3350,13 @@ function useAgUi({
|
|
|
3373
3350
|
setActiveSessionId(id);
|
|
3374
3351
|
}, []);
|
|
3375
3352
|
const stopMessage = useCallback(() => {
|
|
3376
|
-
|
|
3377
|
-
(_a = abortRef.current) == null ? void 0 : _a.abort();
|
|
3353
|
+
abortRef.current?.abort();
|
|
3378
3354
|
abortRef.current = null;
|
|
3379
3355
|
setIsLoading(false);
|
|
3380
3356
|
}, []);
|
|
3381
3357
|
const sendMessage = useCallback(
|
|
3382
3358
|
async (message) => {
|
|
3383
|
-
|
|
3384
|
-
(_a = abortRef.current) == null ? void 0 : _a.abort();
|
|
3359
|
+
abortRef.current?.abort();
|
|
3385
3360
|
const abortController = new AbortController();
|
|
3386
3361
|
abortRef.current = abortController;
|
|
3387
3362
|
let sessionId = activeSessionId;
|
|
@@ -3408,7 +3383,7 @@ function useAgUi({
|
|
|
3408
3383
|
);
|
|
3409
3384
|
setIsLoading(true);
|
|
3410
3385
|
const currentSession = [
|
|
3411
|
-
...
|
|
3386
|
+
...sessions.find((s) => s.id === sessionId)?.conversations ?? []
|
|
3412
3387
|
];
|
|
3413
3388
|
const historyMessages = sessionsToAgUiMessages({
|
|
3414
3389
|
conversations: currentSession
|
|
@@ -3456,11 +3431,11 @@ function useAgUi({
|
|
|
3456
3431
|
abortController.signal
|
|
3457
3432
|
)) {
|
|
3458
3433
|
if (eventOrError instanceof Error) {
|
|
3459
|
-
|
|
3434
|
+
onErrorRef.current?.(eventOrError);
|
|
3460
3435
|
continue;
|
|
3461
3436
|
}
|
|
3462
3437
|
const event = eventOrError;
|
|
3463
|
-
|
|
3438
|
+
onEventRef.current?.(event);
|
|
3464
3439
|
switch (event.type) {
|
|
3465
3440
|
case AgUiEventType.TEXT_MESSAGE_CONTENT: {
|
|
3466
3441
|
responseText += event.delta;
|
|
@@ -3505,7 +3480,7 @@ function useAgUi({
|
|
|
3505
3480
|
}
|
|
3506
3481
|
case AgUiEventType.RUN_ERROR: {
|
|
3507
3482
|
const err = new Error(event.message);
|
|
3508
|
-
|
|
3483
|
+
onErrorRef.current?.(err);
|
|
3509
3484
|
break;
|
|
3510
3485
|
}
|
|
3511
3486
|
case AgUiEventType.RUN_FINISHED: {
|
|
@@ -3518,7 +3493,7 @@ function useAgUi({
|
|
|
3518
3493
|
return;
|
|
3519
3494
|
}
|
|
3520
3495
|
const error = err instanceof Error ? err : new Error(String(err));
|
|
3521
|
-
|
|
3496
|
+
onErrorRef.current?.(error);
|
|
3522
3497
|
} finally {
|
|
3523
3498
|
if (abortRef.current === abortController) {
|
|
3524
3499
|
abortRef.current = null;
|
|
@@ -3652,7 +3627,6 @@ const ComponentRenderer = ({
|
|
|
3652
3627
|
definitions,
|
|
3653
3628
|
options
|
|
3654
3629
|
}) => {
|
|
3655
|
-
var _a, _b;
|
|
3656
3630
|
const { theme, sendMessage } = useContext(ChatContext);
|
|
3657
3631
|
const result = useMemo(
|
|
3658
3632
|
() => validateSpec(raw, definitions),
|
|
@@ -3660,7 +3634,7 @@ const ComponentRenderer = ({
|
|
|
3660
3634
|
);
|
|
3661
3635
|
if (!result.ok) {
|
|
3662
3636
|
const error = result.error;
|
|
3663
|
-
const custom =
|
|
3637
|
+
const custom = options?.onError?.(error);
|
|
3664
3638
|
if (custom !== void 0) {
|
|
3665
3639
|
return /* @__PURE__ */ jsx(Fragment, { children: custom });
|
|
3666
3640
|
}
|
|
@@ -3674,7 +3648,7 @@ const ComponentRenderer = ({
|
|
|
3674
3648
|
);
|
|
3675
3649
|
}
|
|
3676
3650
|
const specs = result.specs;
|
|
3677
|
-
return /* @__PURE__ */ jsx("div", { className:
|
|
3651
|
+
return /* @__PURE__ */ jsx("div", { className: theme.component?.base, children: specs.map((spec, index) => /* @__PURE__ */ jsx(
|
|
3678
3652
|
SpecRenderer,
|
|
3679
3653
|
{
|
|
3680
3654
|
spec,
|
|
@@ -3691,7 +3665,6 @@ const SpecRenderer = ({
|
|
|
3691
3665
|
options,
|
|
3692
3666
|
sendMessage
|
|
3693
3667
|
}) => {
|
|
3694
|
-
var _a, _b;
|
|
3695
3668
|
const definition = definitions[spec.type];
|
|
3696
3669
|
if (!definition) {
|
|
3697
3670
|
const error = {
|
|
@@ -3700,14 +3673,14 @@ const SpecRenderer = ({
|
|
|
3700
3673
|
raw: JSON.stringify(spec),
|
|
3701
3674
|
componentType: spec.type
|
|
3702
3675
|
};
|
|
3703
|
-
const custom =
|
|
3676
|
+
const custom = options?.onError?.(error);
|
|
3704
3677
|
if (custom !== void 0) {
|
|
3705
3678
|
return /* @__PURE__ */ jsx(Fragment, { children: custom });
|
|
3706
3679
|
}
|
|
3707
3680
|
return /* @__PURE__ */ jsx(ComponentError, { title: errorTitle(error.type), message: error.message });
|
|
3708
3681
|
}
|
|
3709
3682
|
const RenderedComponent = definition.component;
|
|
3710
|
-
const children =
|
|
3683
|
+
const children = spec.children?.map((child, index) => /* @__PURE__ */ jsx(
|
|
3711
3684
|
SpecRenderer,
|
|
3712
3685
|
{
|
|
3713
3686
|
spec: child,
|
|
@@ -3728,7 +3701,6 @@ class SpecErrorBoundary extends Component {
|
|
|
3728
3701
|
return { error };
|
|
3729
3702
|
}
|
|
3730
3703
|
render() {
|
|
3731
|
-
var _a;
|
|
3732
3704
|
if (this.state.error) {
|
|
3733
3705
|
const { spec, options } = this.props;
|
|
3734
3706
|
const catalogError = {
|
|
@@ -3737,7 +3709,7 @@ class SpecErrorBoundary extends Component {
|
|
|
3737
3709
|
raw: JSON.stringify(spec),
|
|
3738
3710
|
componentType: spec.type
|
|
3739
3711
|
};
|
|
3740
|
-
const custom =
|
|
3712
|
+
const custom = options?.onError?.(catalogError);
|
|
3741
3713
|
if (custom !== void 0) {
|
|
3742
3714
|
return /* @__PURE__ */ jsx(Fragment, { children: custom });
|
|
3743
3715
|
}
|
|
@@ -3798,14 +3770,13 @@ function getChildText(children) {
|
|
|
3798
3770
|
return "";
|
|
3799
3771
|
}
|
|
3800
3772
|
function createComponentPre(definitions, options) {
|
|
3801
|
-
const language =
|
|
3773
|
+
const language = options?.language ?? "component";
|
|
3802
3774
|
const className = `language-${language}`;
|
|
3803
3775
|
const ComponentPre = ({ children, ...props }) => {
|
|
3804
|
-
var _a, _b;
|
|
3805
3776
|
if (children && typeof children === "object" && "props" in children) {
|
|
3806
3777
|
const codeElement = children;
|
|
3807
|
-
if (
|
|
3808
|
-
const codeContent = getChildText(
|
|
3778
|
+
if (codeElement.props?.className === className) {
|
|
3779
|
+
const codeContent = getChildText(codeElement.props?.children);
|
|
3809
3780
|
if (codeContent) {
|
|
3810
3781
|
return /* @__PURE__ */ jsx(
|
|
3811
3782
|
ComponentRenderer,
|
|
@@ -3917,7 +3888,7 @@ Available components:
|
|
|
3917
3888
|
${componentDocs}`;
|
|
3918
3889
|
}
|
|
3919
3890
|
function componentCatalog(definitions, options) {
|
|
3920
|
-
const language =
|
|
3891
|
+
const language = options?.language ?? "component";
|
|
3921
3892
|
const plugin = remarkComponent.bind(void 0, {
|
|
3922
3893
|
language
|
|
3923
3894
|
});
|
|
@@ -4014,4 +3985,4 @@ export {
|
|
|
4014
3985
|
SessionMessage as y,
|
|
4015
3986
|
SessionMessagePanel as z
|
|
4016
3987
|
};
|
|
4017
|
-
//# sourceMappingURL=index-
|
|
3988
|
+
//# sourceMappingURL=index-CZSBRZbI.js.map
|