@apteva/apteva-kit 0.1.9 → 0.1.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +8 -2
- package/dist/index.d.ts +8 -2
- package/dist/index.js +437 -113
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +592 -268
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +2 -2
package/dist/index.mjs
CHANGED
|
@@ -564,11 +564,149 @@ function Widgets({
|
|
|
564
564
|
return /* @__PURE__ */ jsx5("div", { className: cn(layoutClasses[layout], spacingClasses[spacing], className), children: widgets.map((widget) => /* @__PURE__ */ jsx5(WidgetRenderer, { widget, onAction }, widget.id)) });
|
|
565
565
|
}
|
|
566
566
|
|
|
567
|
-
// src/components/Chat/
|
|
567
|
+
// src/components/Chat/MarkdownContent.tsx
|
|
568
568
|
import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
569
|
+
function parseInlineMarkdown(text, keyPrefix = "") {
|
|
570
|
+
const result = [];
|
|
571
|
+
const boldRegex = /(\*\*|__)(.+?)\1/g;
|
|
572
|
+
let lastIndex = 0;
|
|
573
|
+
let match;
|
|
574
|
+
let key = 0;
|
|
575
|
+
while ((match = boldRegex.exec(text)) !== null) {
|
|
576
|
+
if (match.index > lastIndex) {
|
|
577
|
+
result.push(text.slice(lastIndex, match.index));
|
|
578
|
+
}
|
|
579
|
+
result.push(/* @__PURE__ */ jsx6("strong", { children: match[2] }, `${keyPrefix}b${key++}`));
|
|
580
|
+
lastIndex = match.index + match[0].length;
|
|
581
|
+
}
|
|
582
|
+
if (lastIndex < text.length) {
|
|
583
|
+
result.push(text.slice(lastIndex));
|
|
584
|
+
}
|
|
585
|
+
return result.length > 0 ? result : [text];
|
|
586
|
+
}
|
|
587
|
+
function parseMarkdown(content) {
|
|
588
|
+
const lines = content.split("\n");
|
|
589
|
+
const result = [];
|
|
590
|
+
let key = 0;
|
|
591
|
+
let i = 0;
|
|
592
|
+
while (i < lines.length) {
|
|
593
|
+
const line = lines[i];
|
|
594
|
+
const h2Match = line.match(/^##\s+(.*)$/);
|
|
595
|
+
if (h2Match) {
|
|
596
|
+
result.push(
|
|
597
|
+
/* @__PURE__ */ jsx6("h2", { className: "apteva-md-h2", children: parseInlineMarkdown(h2Match[1], `${key}`) }, `h2${key++}`)
|
|
598
|
+
);
|
|
599
|
+
i++;
|
|
600
|
+
continue;
|
|
601
|
+
}
|
|
602
|
+
const h3Match = line.match(/^###\s+(.*)$/);
|
|
603
|
+
if (h3Match) {
|
|
604
|
+
result.push(
|
|
605
|
+
/* @__PURE__ */ jsx6("h3", { className: "apteva-md-h3", children: parseInlineMarkdown(h3Match[1], `${key}`) }, `h3${key++}`)
|
|
606
|
+
);
|
|
607
|
+
i++;
|
|
608
|
+
continue;
|
|
609
|
+
}
|
|
610
|
+
const ulMatch = line.match(/^(\s*)([-*+])\s+(.*)$/);
|
|
611
|
+
if (ulMatch) {
|
|
612
|
+
const listItems = [];
|
|
613
|
+
const indent = ulMatch[1].length;
|
|
614
|
+
while (i < lines.length) {
|
|
615
|
+
const itemMatch = lines[i].match(/^(\s*)([-*+])\s+(.*)$/);
|
|
616
|
+
if (itemMatch && itemMatch[1].length === indent) {
|
|
617
|
+
listItems.push(
|
|
618
|
+
/* @__PURE__ */ jsx6("li", { className: "apteva-md-li", children: parseInlineMarkdown(itemMatch[3], `${key}`) }, `li${key++}`)
|
|
619
|
+
);
|
|
620
|
+
i++;
|
|
621
|
+
} else {
|
|
622
|
+
break;
|
|
623
|
+
}
|
|
624
|
+
}
|
|
625
|
+
result.push(
|
|
626
|
+
/* @__PURE__ */ jsx6("ul", { className: "apteva-md-ul", children: listItems }, `ul${key++}`)
|
|
627
|
+
);
|
|
628
|
+
continue;
|
|
629
|
+
}
|
|
630
|
+
const olMatch = line.match(/^(\s*)(\d+)\.\s+(.*)$/);
|
|
631
|
+
if (olMatch) {
|
|
632
|
+
const listItems = [];
|
|
633
|
+
const indent = olMatch[1].length;
|
|
634
|
+
while (i < lines.length) {
|
|
635
|
+
const itemMatch = lines[i].match(/^(\s*)(\d+)\.\s+(.*)$/);
|
|
636
|
+
if (itemMatch && itemMatch[1].length === indent) {
|
|
637
|
+
listItems.push(
|
|
638
|
+
/* @__PURE__ */ jsx6("li", { className: "apteva-md-li", children: parseInlineMarkdown(itemMatch[3], `${key}`) }, `li${key++}`)
|
|
639
|
+
);
|
|
640
|
+
i++;
|
|
641
|
+
} else {
|
|
642
|
+
break;
|
|
643
|
+
}
|
|
644
|
+
}
|
|
645
|
+
result.push(
|
|
646
|
+
/* @__PURE__ */ jsx6("ol", { className: "apteva-md-ol", children: listItems }, `ol${key++}`)
|
|
647
|
+
);
|
|
648
|
+
continue;
|
|
649
|
+
}
|
|
650
|
+
if (line === "") {
|
|
651
|
+
result.push(/* @__PURE__ */ jsx6("br", {}, `br${key++}`));
|
|
652
|
+
} else {
|
|
653
|
+
result.push(
|
|
654
|
+
/* @__PURE__ */ jsxs4("span", { children: [
|
|
655
|
+
parseInlineMarkdown(line, `${key}`),
|
|
656
|
+
i < lines.length - 1 ? "\n" : ""
|
|
657
|
+
] }, `p${key++}`)
|
|
658
|
+
);
|
|
659
|
+
}
|
|
660
|
+
i++;
|
|
661
|
+
}
|
|
662
|
+
return result;
|
|
663
|
+
}
|
|
664
|
+
function MarkdownContent({ content, className = "" }) {
|
|
665
|
+
return /* @__PURE__ */ jsx6("div", { className: `apteva-md ${className}`, children: parseMarkdown(content) });
|
|
666
|
+
}
|
|
667
|
+
|
|
668
|
+
// src/components/Chat/ToolCall.tsx
|
|
669
|
+
import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
670
|
+
function ToolCall({ name, status }) {
|
|
671
|
+
return /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2 py-2 px-3 my-2 rounded-lg bg-gray-100 dark:bg-gray-800 border border-gray-200 dark:border-gray-700 text-sm", children: [
|
|
672
|
+
status === "running" && /* @__PURE__ */ jsx7("div", { className: "w-2 h-2 rounded-full bg-blue-500 animate-pulse" }),
|
|
673
|
+
status === "completed" && /* @__PURE__ */ jsx7("div", { className: "w-2 h-2 rounded-full bg-green-500" }),
|
|
674
|
+
status === "error" && /* @__PURE__ */ jsx7("div", { className: "w-2 h-2 rounded-full bg-red-500" }),
|
|
675
|
+
/* @__PURE__ */ jsx7("span", { className: "text-gray-700 dark:text-gray-300 font-mono", children: name }),
|
|
676
|
+
status === "running" && /* @__PURE__ */ jsx7("span", { className: "text-gray-500 dark:text-gray-400 ml-auto", children: "Running..." }),
|
|
677
|
+
status === "completed" && /* @__PURE__ */ jsx7("span", { className: "text-green-600 dark:text-green-400 ml-auto", children: "Completed" }),
|
|
678
|
+
status === "error" && /* @__PURE__ */ jsx7("span", { className: "text-red-600 dark:text-red-400 ml-auto", children: "Error" })
|
|
679
|
+
] });
|
|
680
|
+
}
|
|
681
|
+
|
|
682
|
+
// src/components/Chat/Message.tsx
|
|
683
|
+
import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
569
684
|
function Message({ message, onAction }) {
|
|
570
685
|
const isUser = message.role === "user";
|
|
571
|
-
|
|
686
|
+
const contentSegments = message.metadata?.content_segments;
|
|
687
|
+
const renderContent = () => {
|
|
688
|
+
if (isUser) {
|
|
689
|
+
return /* @__PURE__ */ jsx8("div", { className: "whitespace-pre-wrap !text-sm leading-relaxed", children: message.content });
|
|
690
|
+
}
|
|
691
|
+
if (contentSegments && contentSegments.length > 0) {
|
|
692
|
+
return /* @__PURE__ */ jsx8("div", { children: contentSegments.map((segment, index) => {
|
|
693
|
+
if (segment.type === "text") {
|
|
694
|
+
return segment.content ? /* @__PURE__ */ jsx8(MarkdownContent, { content: segment.content }, `text-${index}`) : null;
|
|
695
|
+
} else if (segment.type === "tool") {
|
|
696
|
+
return /* @__PURE__ */ jsx8("div", { className: "my-2", children: /* @__PURE__ */ jsx8(
|
|
697
|
+
ToolCall,
|
|
698
|
+
{
|
|
699
|
+
name: segment.name,
|
|
700
|
+
status: segment.result !== void 0 ? "completed" : "running"
|
|
701
|
+
}
|
|
702
|
+
) }, segment.id);
|
|
703
|
+
}
|
|
704
|
+
return null;
|
|
705
|
+
}) });
|
|
706
|
+
}
|
|
707
|
+
return /* @__PURE__ */ jsx8(MarkdownContent, { content: message.content });
|
|
708
|
+
};
|
|
709
|
+
return /* @__PURE__ */ jsxs6(
|
|
572
710
|
"div",
|
|
573
711
|
{
|
|
574
712
|
className: cn(
|
|
@@ -576,16 +714,16 @@ function Message({ message, onAction }) {
|
|
|
576
714
|
isUser ? "px-4 py-2.5 rounded-xl bg-gray-100 dark:bg-gray-800 !text-gray-900 dark:!text-gray-100 ml-auto" : "!text-gray-900 dark:!text-gray-100"
|
|
577
715
|
),
|
|
578
716
|
children: [
|
|
579
|
-
|
|
580
|
-
message.widgets && message.widgets.length > 0 && /* @__PURE__ */
|
|
581
|
-
/* @__PURE__ */
|
|
717
|
+
renderContent(),
|
|
718
|
+
message.widgets && message.widgets.length > 0 && /* @__PURE__ */ jsx8("div", { className: cn(isUser ? "mt-3" : "mt-2"), children: /* @__PURE__ */ jsx8(Widgets, { widgets: message.widgets, onAction, layout: "stack" }) }),
|
|
719
|
+
/* @__PURE__ */ jsx8("div", { className: cn("!text-xs opacity-70", isUser ? "mt-1.5 !text-gray-500 dark:!text-gray-400" : "mt-1 !text-gray-500 dark:!text-gray-400"), suppressHydrationWarning: true, children: message.timestamp.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) })
|
|
582
720
|
]
|
|
583
721
|
}
|
|
584
722
|
);
|
|
585
723
|
}
|
|
586
724
|
|
|
587
725
|
// src/components/Chat/MessageList.tsx
|
|
588
|
-
import { jsx as
|
|
726
|
+
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
589
727
|
function MessageList({ messages, onAction }) {
|
|
590
728
|
const listRef = useRef(null);
|
|
591
729
|
useEffect2(() => {
|
|
@@ -593,15 +731,15 @@ function MessageList({ messages, onAction }) {
|
|
|
593
731
|
listRef.current.scrollTop = listRef.current.scrollHeight;
|
|
594
732
|
}
|
|
595
733
|
}, [messages]);
|
|
596
|
-
return /* @__PURE__ */
|
|
597
|
-
/* @__PURE__ */
|
|
598
|
-
/* @__PURE__ */
|
|
599
|
-
] }) }) : messages.map((message) => /* @__PURE__ */
|
|
734
|
+
return /* @__PURE__ */ jsx9("div", { ref: listRef, className: "flex-1 overflow-y-auto px-4 py-4 space-y-3 apteva-scrollbar-hidden", children: messages.length === 0 ? /* @__PURE__ */ jsx9("div", { className: "flex items-center justify-center h-full !text-gray-500 dark:!text-gray-400", children: /* @__PURE__ */ jsxs7("div", { className: "text-center space-y-2", children: [
|
|
735
|
+
/* @__PURE__ */ jsx9("div", { className: "text-4xl", children: "\u{1F4AC}" }),
|
|
736
|
+
/* @__PURE__ */ jsx9("p", { children: "No messages yet. Start a conversation!" })
|
|
737
|
+
] }) }) : messages.map((message) => /* @__PURE__ */ jsx9(Message, { message, onAction }, message.id)) });
|
|
600
738
|
}
|
|
601
739
|
|
|
602
740
|
// src/components/Chat/Composer.tsx
|
|
603
741
|
import { useState, useRef as useRef2 } from "react";
|
|
604
|
-
import { Fragment, jsx as
|
|
742
|
+
import { Fragment, jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
605
743
|
function Composer({ onSendMessage, placeholder = "Type a message...", disabled = false, onFileUpload }) {
|
|
606
744
|
const [text, setText] = useState("");
|
|
607
745
|
const [showMenu, setShowMenu] = useState(false);
|
|
@@ -633,32 +771,32 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
633
771
|
setShowMenu(false);
|
|
634
772
|
}
|
|
635
773
|
};
|
|
636
|
-
return /* @__PURE__ */
|
|
637
|
-
showMenu && /* @__PURE__ */
|
|
638
|
-
/* @__PURE__ */
|
|
639
|
-
/* @__PURE__ */
|
|
774
|
+
return /* @__PURE__ */ jsxs8("div", { className: "px-4 py-3 bg-white dark:bg-gray-900 relative", children: [
|
|
775
|
+
showMenu && /* @__PURE__ */ jsxs8(Fragment, { children: [
|
|
776
|
+
/* @__PURE__ */ jsx10("div", { className: "fixed inset-0 z-10", onClick: () => setShowMenu(false) }),
|
|
777
|
+
/* @__PURE__ */ jsx10("div", { className: "absolute bottom-full left-4 mb-2 bg-gray-800 dark:bg-gray-700 rounded-xl shadow-lg overflow-hidden z-20 min-w-[240px]", children: /* @__PURE__ */ jsxs8(
|
|
640
778
|
"button",
|
|
641
779
|
{
|
|
642
780
|
onClick: () => fileInputRef.current?.click(),
|
|
643
781
|
className: "w-full flex items-center gap-3 px-4 py-3 hover:bg-gray-700 dark:hover:bg-gray-600 transition-colors !text-white text-left",
|
|
644
782
|
children: [
|
|
645
|
-
/* @__PURE__ */
|
|
646
|
-
/* @__PURE__ */
|
|
783
|
+
/* @__PURE__ */ jsx10("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx10("path", { d: "M10.5 3.5L5.5 8.5C4.67157 9.32843 4.67157 10.6716 5.5 11.5C6.32843 12.3284 7.67157 12.3284 8.5 11.5L14.5 5.5C15.8807 4.11929 15.8807 1.88071 14.5 0.5C13.1193 -0.880711 10.8807 -0.880711 9.5 0.5L3.5 6.5C1.56846 8.43154 1.56846 11.5685 3.5 13.5C5.43154 15.4315 8.56846 15.4315 10.5 13.5L15.5 8.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(2, 3)" }) }),
|
|
784
|
+
/* @__PURE__ */ jsx10("span", { className: "!text-sm font-medium", children: "Add photos & files" })
|
|
647
785
|
]
|
|
648
786
|
}
|
|
649
787
|
) })
|
|
650
788
|
] }),
|
|
651
|
-
/* @__PURE__ */
|
|
652
|
-
/* @__PURE__ */
|
|
789
|
+
/* @__PURE__ */ jsxs8("div", { className: "relative border-2 border-gray-300 dark:border-gray-700 rounded-xl bg-white dark:bg-gray-900 transition-all duration-300 flex items-center px-3 py-2 gap-3", children: [
|
|
790
|
+
/* @__PURE__ */ jsx10(
|
|
653
791
|
"button",
|
|
654
792
|
{
|
|
655
793
|
onClick: () => setShowMenu(!showMenu),
|
|
656
794
|
className: "w-8 h-8 rounded-lg flex items-center justify-center transition-all flex-shrink-0 !text-gray-700 dark:!text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800",
|
|
657
795
|
title: "More options",
|
|
658
|
-
children: /* @__PURE__ */
|
|
796
|
+
children: /* @__PURE__ */ jsx10("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx10("path", { d: "M10 5v10M5 10h10", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
659
797
|
}
|
|
660
798
|
),
|
|
661
|
-
/* @__PURE__ */
|
|
799
|
+
/* @__PURE__ */ jsx10(
|
|
662
800
|
"textarea",
|
|
663
801
|
{
|
|
664
802
|
ref: textareaRef,
|
|
@@ -672,18 +810,18 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
672
810
|
style: { maxHeight: "120px" }
|
|
673
811
|
}
|
|
674
812
|
),
|
|
675
|
-
/* @__PURE__ */
|
|
813
|
+
/* @__PURE__ */ jsx10(
|
|
676
814
|
"button",
|
|
677
815
|
{
|
|
678
816
|
onClick: handleSend,
|
|
679
817
|
disabled: !text.trim() || disabled,
|
|
680
818
|
className: "w-8 h-8 rounded-lg flex items-center justify-center font-bold transition-all flex-shrink-0 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 !text-gray-700 dark:!text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 disabled:opacity-30 disabled:cursor-not-allowed !text-lg",
|
|
681
819
|
title: "Send message",
|
|
682
|
-
children: /* @__PURE__ */
|
|
820
|
+
children: /* @__PURE__ */ jsx10("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx10("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
683
821
|
}
|
|
684
822
|
)
|
|
685
823
|
] }),
|
|
686
|
-
/* @__PURE__ */
|
|
824
|
+
/* @__PURE__ */ jsx10(
|
|
687
825
|
"input",
|
|
688
826
|
{
|
|
689
827
|
ref: fileInputRef,
|
|
@@ -697,66 +835,6 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
697
835
|
] });
|
|
698
836
|
}
|
|
699
837
|
|
|
700
|
-
// src/components/Chat/Chat.tsx
|
|
701
|
-
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
702
|
-
function Chat({
|
|
703
|
-
agentId,
|
|
704
|
-
threadId,
|
|
705
|
-
initialMessages = [],
|
|
706
|
-
context,
|
|
707
|
-
onThreadChange,
|
|
708
|
-
onMessageSent,
|
|
709
|
-
onAction,
|
|
710
|
-
onFileUpload,
|
|
711
|
-
placeholder = "Type a message...",
|
|
712
|
-
showHeader = true,
|
|
713
|
-
headerTitle = "Chat",
|
|
714
|
-
className
|
|
715
|
-
}) {
|
|
716
|
-
const [messages, setMessages] = useState2(initialMessages.length > 0 ? initialMessages : mockMessages);
|
|
717
|
-
const [isLoading, setIsLoading] = useState2(false);
|
|
718
|
-
useEffect3(() => {
|
|
719
|
-
if (threadId) {
|
|
720
|
-
console.log("Loading thread:", threadId);
|
|
721
|
-
onThreadChange?.(threadId);
|
|
722
|
-
}
|
|
723
|
-
}, [threadId, onThreadChange]);
|
|
724
|
-
const handleSendMessage = async (text) => {
|
|
725
|
-
const userMessage = {
|
|
726
|
-
id: `msg-${Date.now()}`,
|
|
727
|
-
role: "user",
|
|
728
|
-
content: text,
|
|
729
|
-
timestamp: /* @__PURE__ */ new Date()
|
|
730
|
-
};
|
|
731
|
-
setMessages((prev) => [...prev, userMessage]);
|
|
732
|
-
onMessageSent?.(userMessage);
|
|
733
|
-
setIsLoading(true);
|
|
734
|
-
try {
|
|
735
|
-
const response = await generateMockResponse(1e3);
|
|
736
|
-
setMessages((prev) => [...prev, response]);
|
|
737
|
-
} catch (error) {
|
|
738
|
-
console.error("Error generating response:", error);
|
|
739
|
-
} finally {
|
|
740
|
-
setIsLoading(false);
|
|
741
|
-
}
|
|
742
|
-
};
|
|
743
|
-
return /* @__PURE__ */ jsxs7("div", { className: cn("flex flex-col h-full bg-white dark:bg-gray-900", className), children: [
|
|
744
|
-
showHeader && /* @__PURE__ */ jsxs7("div", { className: "px-4 py-3 bg-white dark:bg-gray-900", children: [
|
|
745
|
-
/* @__PURE__ */ jsx9("h2", { className: "!text-lg font-semibold !text-gray-900 dark:!text-white", children: headerTitle }),
|
|
746
|
-
/* @__PURE__ */ jsxs7("p", { className: "!text-xs !text-gray-500 dark:!text-gray-400", children: [
|
|
747
|
-
"Agent: ",
|
|
748
|
-
agentId
|
|
749
|
-
] })
|
|
750
|
-
] }),
|
|
751
|
-
/* @__PURE__ */ jsx9(MessageList, { messages, onAction }),
|
|
752
|
-
isLoading && /* @__PURE__ */ jsx9("div", { className: "px-4 py-2 !text-sm !text-gray-500 dark:!text-gray-400 italic", children: "AI is thinking..." }),
|
|
753
|
-
/* @__PURE__ */ jsx9(Composer, { onSendMessage: handleSendMessage, placeholder, disabled: isLoading, onFileUpload })
|
|
754
|
-
] });
|
|
755
|
-
}
|
|
756
|
-
|
|
757
|
-
// src/components/Command/Command.tsx
|
|
758
|
-
import React, { useState as useState3, useEffect as useEffect4 } from "react";
|
|
759
|
-
|
|
760
838
|
// src/lib/apteva-client.ts
|
|
761
839
|
var DEFAULT_API_URL = "http://localhost:3000/agents";
|
|
762
840
|
var DEFAULT_API_KEY = "agt_894abd5966bc9f1e9f8f17f2a6f6b5e0";
|
|
@@ -868,15 +946,9 @@ var AptevaClient = class {
|
|
|
868
946
|
if (chunk.thread_id) {
|
|
869
947
|
threadId = chunk.thread_id;
|
|
870
948
|
}
|
|
871
|
-
|
|
872
|
-
onChunk({ type: "token", content: chunk.content });
|
|
873
|
-
} else if (chunk.type === "widget" && chunk.widget) {
|
|
874
|
-
onChunk({ type: "widget", widget: chunk.widget });
|
|
875
|
-
} else if (chunk.type === "complete") {
|
|
876
|
-
onChunk({ type: "complete", thread_id: threadId });
|
|
877
|
-
}
|
|
949
|
+
onChunk(chunk);
|
|
878
950
|
} catch (e) {
|
|
879
|
-
console.warn("Failed to parse SSE data:", data);
|
|
951
|
+
console.warn("[AptevaClient] Failed to parse SSE data:", data);
|
|
880
952
|
}
|
|
881
953
|
}
|
|
882
954
|
}
|
|
@@ -927,8 +999,260 @@ var AptevaClient = class {
|
|
|
927
999
|
};
|
|
928
1000
|
var aptevaClient = new AptevaClient();
|
|
929
1001
|
|
|
1002
|
+
// src/components/Chat/Chat.tsx
|
|
1003
|
+
import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1004
|
+
function Chat({
|
|
1005
|
+
agentId,
|
|
1006
|
+
threadId,
|
|
1007
|
+
initialMessages = [],
|
|
1008
|
+
context,
|
|
1009
|
+
apiUrl,
|
|
1010
|
+
apiKey,
|
|
1011
|
+
useMock = false,
|
|
1012
|
+
onThreadChange,
|
|
1013
|
+
onMessageSent,
|
|
1014
|
+
onAction,
|
|
1015
|
+
onFileUpload,
|
|
1016
|
+
placeholder = "Type a message...",
|
|
1017
|
+
showHeader = true,
|
|
1018
|
+
headerTitle = "Chat",
|
|
1019
|
+
className
|
|
1020
|
+
}) {
|
|
1021
|
+
const [messages, setMessages] = useState2(initialMessages);
|
|
1022
|
+
const [isLoading, setIsLoading] = useState2(false);
|
|
1023
|
+
const [currentThreadId, setCurrentThreadId] = useState2(threadId || null);
|
|
1024
|
+
useEffect3(() => {
|
|
1025
|
+
if (apiUrl || apiKey) {
|
|
1026
|
+
aptevaClient.configure({
|
|
1027
|
+
...apiUrl && { apiUrl },
|
|
1028
|
+
...apiKey && { apiKey }
|
|
1029
|
+
});
|
|
1030
|
+
}
|
|
1031
|
+
}, [apiUrl, apiKey]);
|
|
1032
|
+
useEffect3(() => {
|
|
1033
|
+
if (threadId) {
|
|
1034
|
+
console.log("Loading thread:", threadId);
|
|
1035
|
+
onThreadChange?.(threadId);
|
|
1036
|
+
}
|
|
1037
|
+
}, [threadId, onThreadChange]);
|
|
1038
|
+
const handleSendMessage = async (text) => {
|
|
1039
|
+
const userMessage = {
|
|
1040
|
+
id: `msg-${Date.now()}`,
|
|
1041
|
+
role: "user",
|
|
1042
|
+
content: text,
|
|
1043
|
+
timestamp: /* @__PURE__ */ new Date()
|
|
1044
|
+
};
|
|
1045
|
+
setMessages((prev) => [...prev, userMessage]);
|
|
1046
|
+
onMessageSent?.(userMessage);
|
|
1047
|
+
setIsLoading(true);
|
|
1048
|
+
try {
|
|
1049
|
+
if (useMock) {
|
|
1050
|
+
const response = await generateMockResponse(1e3);
|
|
1051
|
+
setMessages((prev) => [...prev, response]);
|
|
1052
|
+
} else {
|
|
1053
|
+
let contentSegments = [];
|
|
1054
|
+
let currentTextBuffer = "";
|
|
1055
|
+
let accumulatedWidgets = [];
|
|
1056
|
+
let responseThreadId = currentThreadId;
|
|
1057
|
+
let toolInputBuffer = "";
|
|
1058
|
+
const updateMessage = () => {
|
|
1059
|
+
const segments = [...contentSegments];
|
|
1060
|
+
if (currentTextBuffer) {
|
|
1061
|
+
const lastSegment = segments[segments.length - 1];
|
|
1062
|
+
if (lastSegment && lastSegment.type === "text") {
|
|
1063
|
+
lastSegment.content = currentTextBuffer;
|
|
1064
|
+
} else {
|
|
1065
|
+
segments.push({ type: "text", content: currentTextBuffer });
|
|
1066
|
+
}
|
|
1067
|
+
}
|
|
1068
|
+
setMessages((prev) => {
|
|
1069
|
+
const lastMessage = prev[prev.length - 1];
|
|
1070
|
+
if (lastMessage && lastMessage.role === "assistant") {
|
|
1071
|
+
return [
|
|
1072
|
+
...prev.slice(0, -1),
|
|
1073
|
+
{
|
|
1074
|
+
...lastMessage,
|
|
1075
|
+
content: currentTextBuffer,
|
|
1076
|
+
widgets: accumulatedWidgets.length > 0 ? accumulatedWidgets : void 0,
|
|
1077
|
+
metadata: {
|
|
1078
|
+
...lastMessage.metadata,
|
|
1079
|
+
content_segments: segments
|
|
1080
|
+
}
|
|
1081
|
+
}
|
|
1082
|
+
];
|
|
1083
|
+
} else {
|
|
1084
|
+
return [
|
|
1085
|
+
...prev,
|
|
1086
|
+
{
|
|
1087
|
+
id: `msg-${Date.now()}-streaming`,
|
|
1088
|
+
role: "assistant",
|
|
1089
|
+
content: currentTextBuffer,
|
|
1090
|
+
widgets: accumulatedWidgets.length > 0 ? accumulatedWidgets : void 0,
|
|
1091
|
+
timestamp: /* @__PURE__ */ new Date(),
|
|
1092
|
+
metadata: {
|
|
1093
|
+
content_segments: segments
|
|
1094
|
+
}
|
|
1095
|
+
}
|
|
1096
|
+
];
|
|
1097
|
+
}
|
|
1098
|
+
});
|
|
1099
|
+
};
|
|
1100
|
+
await aptevaClient.chatStream(
|
|
1101
|
+
{
|
|
1102
|
+
agent_id: agentId,
|
|
1103
|
+
message: text,
|
|
1104
|
+
stream: true,
|
|
1105
|
+
...currentThreadId && { thread_id: currentThreadId },
|
|
1106
|
+
...context && { system: context }
|
|
1107
|
+
},
|
|
1108
|
+
(chunk) => {
|
|
1109
|
+
switch (chunk.type) {
|
|
1110
|
+
case "start":
|
|
1111
|
+
break;
|
|
1112
|
+
case "thread_id":
|
|
1113
|
+
if (chunk.thread_id) {
|
|
1114
|
+
responseThreadId = chunk.thread_id;
|
|
1115
|
+
if (!currentThreadId) {
|
|
1116
|
+
setCurrentThreadId(chunk.thread_id);
|
|
1117
|
+
onThreadChange?.(chunk.thread_id);
|
|
1118
|
+
}
|
|
1119
|
+
}
|
|
1120
|
+
break;
|
|
1121
|
+
case "content":
|
|
1122
|
+
case "token":
|
|
1123
|
+
if (chunk.content) {
|
|
1124
|
+
currentTextBuffer += chunk.content;
|
|
1125
|
+
updateMessage();
|
|
1126
|
+
}
|
|
1127
|
+
break;
|
|
1128
|
+
case "tool_call":
|
|
1129
|
+
if (chunk.tool_id && chunk.tool_name) {
|
|
1130
|
+
if (currentTextBuffer) {
|
|
1131
|
+
contentSegments.push({ type: "text", content: currentTextBuffer });
|
|
1132
|
+
currentTextBuffer = "";
|
|
1133
|
+
}
|
|
1134
|
+
contentSegments.push({
|
|
1135
|
+
type: "tool",
|
|
1136
|
+
id: chunk.tool_id,
|
|
1137
|
+
name: chunk.tool_name
|
|
1138
|
+
});
|
|
1139
|
+
toolInputBuffer = "";
|
|
1140
|
+
updateMessage();
|
|
1141
|
+
}
|
|
1142
|
+
break;
|
|
1143
|
+
case "tool_input_delta":
|
|
1144
|
+
if (chunk.tool_id && chunk.content) {
|
|
1145
|
+
toolInputBuffer += chunk.content;
|
|
1146
|
+
}
|
|
1147
|
+
break;
|
|
1148
|
+
case "tool_use":
|
|
1149
|
+
toolInputBuffer = "";
|
|
1150
|
+
break;
|
|
1151
|
+
case "tool_result":
|
|
1152
|
+
if (chunk.tool_id) {
|
|
1153
|
+
const toolSegment = contentSegments.find(
|
|
1154
|
+
(s) => s.type === "tool" && s.id === chunk.tool_id
|
|
1155
|
+
);
|
|
1156
|
+
if (toolSegment) {
|
|
1157
|
+
toolSegment.result = chunk.content;
|
|
1158
|
+
}
|
|
1159
|
+
updateMessage();
|
|
1160
|
+
}
|
|
1161
|
+
break;
|
|
1162
|
+
case "widget":
|
|
1163
|
+
if (chunk.widget) {
|
|
1164
|
+
accumulatedWidgets.push(chunk.widget);
|
|
1165
|
+
updateMessage();
|
|
1166
|
+
}
|
|
1167
|
+
break;
|
|
1168
|
+
case "stop":
|
|
1169
|
+
break;
|
|
1170
|
+
case "complete":
|
|
1171
|
+
break;
|
|
1172
|
+
case "error":
|
|
1173
|
+
throw new Error(chunk.message || "Stream error");
|
|
1174
|
+
default:
|
|
1175
|
+
break;
|
|
1176
|
+
}
|
|
1177
|
+
},
|
|
1178
|
+
(threadId2) => {
|
|
1179
|
+
if (currentTextBuffer) {
|
|
1180
|
+
const lastSegment = contentSegments[contentSegments.length - 1];
|
|
1181
|
+
if (lastSegment && lastSegment.type === "text") {
|
|
1182
|
+
lastSegment.content = currentTextBuffer;
|
|
1183
|
+
} else {
|
|
1184
|
+
contentSegments.push({ type: "text", content: currentTextBuffer });
|
|
1185
|
+
}
|
|
1186
|
+
}
|
|
1187
|
+
setMessages((prev) => {
|
|
1188
|
+
const lastMessage = prev[prev.length - 1];
|
|
1189
|
+
if (lastMessage && lastMessage.role === "assistant") {
|
|
1190
|
+
return [
|
|
1191
|
+
...prev.slice(0, -1),
|
|
1192
|
+
{
|
|
1193
|
+
...lastMessage,
|
|
1194
|
+
id: `msg-${Date.now()}`,
|
|
1195
|
+
content: currentTextBuffer || "Response received",
|
|
1196
|
+
widgets: accumulatedWidgets.length > 0 ? accumulatedWidgets : void 0,
|
|
1197
|
+
metadata: {
|
|
1198
|
+
thread_id: threadId2,
|
|
1199
|
+
content_segments: contentSegments
|
|
1200
|
+
}
|
|
1201
|
+
}
|
|
1202
|
+
];
|
|
1203
|
+
}
|
|
1204
|
+
return prev;
|
|
1205
|
+
});
|
|
1206
|
+
if (threadId2 && threadId2 !== currentThreadId) {
|
|
1207
|
+
setCurrentThreadId(threadId2);
|
|
1208
|
+
onThreadChange?.(threadId2);
|
|
1209
|
+
}
|
|
1210
|
+
setIsLoading(false);
|
|
1211
|
+
},
|
|
1212
|
+
(error) => {
|
|
1213
|
+
const errorMessage = {
|
|
1214
|
+
id: `msg-${Date.now()}-error`,
|
|
1215
|
+
role: "assistant",
|
|
1216
|
+
content: `Error: ${error.message}`,
|
|
1217
|
+
timestamp: /* @__PURE__ */ new Date(),
|
|
1218
|
+
metadata: { error: true }
|
|
1219
|
+
};
|
|
1220
|
+
setMessages((prev) => {
|
|
1221
|
+
const lastMessage = prev[prev.length - 1];
|
|
1222
|
+
if (lastMessage && lastMessage.id.includes("streaming")) {
|
|
1223
|
+
return [...prev.slice(0, -1), errorMessage];
|
|
1224
|
+
}
|
|
1225
|
+
return [...prev, errorMessage];
|
|
1226
|
+
});
|
|
1227
|
+
setIsLoading(false);
|
|
1228
|
+
}
|
|
1229
|
+
);
|
|
1230
|
+
}
|
|
1231
|
+
} catch (error) {
|
|
1232
|
+
console.error("Chat error:", error);
|
|
1233
|
+
const errorMessage = {
|
|
1234
|
+
id: `msg-${Date.now()}-error`,
|
|
1235
|
+
role: "assistant",
|
|
1236
|
+
content: error instanceof Error ? `Error: ${error.message}` : "An error occurred",
|
|
1237
|
+
timestamp: /* @__PURE__ */ new Date(),
|
|
1238
|
+
metadata: { error: true }
|
|
1239
|
+
};
|
|
1240
|
+
setMessages((prev) => [...prev, errorMessage]);
|
|
1241
|
+
} finally {
|
|
1242
|
+
setIsLoading(false);
|
|
1243
|
+
}
|
|
1244
|
+
};
|
|
1245
|
+
return /* @__PURE__ */ jsxs9("div", { className: cn("flex flex-col h-full bg-white dark:bg-gray-900", className), children: [
|
|
1246
|
+
showHeader && /* @__PURE__ */ jsx11("div", { className: "px-4 py-3 bg-white dark:bg-gray-900", children: /* @__PURE__ */ jsx11("h2", { className: "!text-lg font-semibold !text-gray-900 dark:!text-white", children: headerTitle }) }),
|
|
1247
|
+
/* @__PURE__ */ jsx11(MessageList, { messages, onAction }),
|
|
1248
|
+
isLoading && /* @__PURE__ */ jsx11("div", { className: "px-4 py-2 !text-sm !text-gray-500 dark:!text-gray-400 italic", children: "AI is thinking..." }),
|
|
1249
|
+
/* @__PURE__ */ jsx11(Composer, { onSendMessage: handleSendMessage, placeholder, disabled: isLoading, onFileUpload })
|
|
1250
|
+
] });
|
|
1251
|
+
}
|
|
1252
|
+
|
|
930
1253
|
// src/components/Command/Command.tsx
|
|
931
|
-
import {
|
|
1254
|
+
import React, { useState as useState3, useEffect as useEffect4 } from "react";
|
|
1255
|
+
import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
932
1256
|
function Command({
|
|
933
1257
|
agentId,
|
|
934
1258
|
command: initialCommand,
|
|
@@ -1378,7 +1702,7 @@ ${planToExecute}`;
|
|
|
1378
1702
|
setUploadedFiles((prev) => prev.filter((_, i) => i !== index));
|
|
1379
1703
|
};
|
|
1380
1704
|
const isCompact = variant === "compact";
|
|
1381
|
-
return /* @__PURE__ */
|
|
1705
|
+
return /* @__PURE__ */ jsxs10(
|
|
1382
1706
|
"div",
|
|
1383
1707
|
{
|
|
1384
1708
|
className: cn(
|
|
@@ -1393,9 +1717,9 @@ ${planToExecute}`;
|
|
|
1393
1717
|
),
|
|
1394
1718
|
style: { minHeight: isCompact ? "auto" : "180px" },
|
|
1395
1719
|
children: [
|
|
1396
|
-
/* @__PURE__ */
|
|
1397
|
-
state === "idle" && allowInput && !isCompact && /* @__PURE__ */
|
|
1398
|
-
/* @__PURE__ */
|
|
1720
|
+
/* @__PURE__ */ jsxs10("div", { className: cn("flex-1 flex", isCompact ? "flex-row items-center p-3 gap-3" : "flex-col p-4"), children: [
|
|
1721
|
+
state === "idle" && allowInput && !isCompact && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
1722
|
+
/* @__PURE__ */ jsx12(
|
|
1399
1723
|
"textarea",
|
|
1400
1724
|
{
|
|
1401
1725
|
value: command,
|
|
@@ -1411,42 +1735,42 @@ ${planToExecute}`;
|
|
|
1411
1735
|
rows: 6
|
|
1412
1736
|
}
|
|
1413
1737
|
),
|
|
1414
|
-
uploadedFiles.length > 0 && /* @__PURE__ */
|
|
1415
|
-
file.type === "image" ? /* @__PURE__ */
|
|
1738
|
+
uploadedFiles.length > 0 && /* @__PURE__ */ jsx12("div", { className: "flex flex-wrap gap-2 mt-2", children: uploadedFiles.map((file, index) => /* @__PURE__ */ jsxs10("div", { className: "relative group", children: [
|
|
1739
|
+
file.type === "image" ? /* @__PURE__ */ jsx12(
|
|
1416
1740
|
"img",
|
|
1417
1741
|
{
|
|
1418
1742
|
src: file.preview,
|
|
1419
1743
|
alt: file.name,
|
|
1420
1744
|
className: "w-20 h-20 object-cover rounded-lg border-2 border-gray-300 dark:border-gray-600"
|
|
1421
1745
|
}
|
|
1422
|
-
) : /* @__PURE__ */
|
|
1423
|
-
/* @__PURE__ */
|
|
1424
|
-
/* @__PURE__ */
|
|
1746
|
+
) : /* @__PURE__ */ jsxs10("div", { className: "w-20 h-20 flex flex-col items-center justify-center rounded-lg border-2 border-gray-300 dark:border-gray-600 bg-gray-50 dark:bg-gray-800", children: [
|
|
1747
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-8 h-8 text-gray-500 dark:text-gray-400", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx12("path", { fillRule: "evenodd", d: "M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z", clipRule: "evenodd" }) }),
|
|
1748
|
+
/* @__PURE__ */ jsx12("span", { className: "text-[8px] text-gray-500 dark:text-gray-400 mt-1 px-1 truncate max-w-full", children: file.name.length > 12 ? file.name.slice(0, 12) + "..." : file.name })
|
|
1425
1749
|
] }),
|
|
1426
|
-
/* @__PURE__ */
|
|
1750
|
+
/* @__PURE__ */ jsx12(
|
|
1427
1751
|
"button",
|
|
1428
1752
|
{
|
|
1429
1753
|
onClick: () => removeFile(index),
|
|
1430
1754
|
className: "absolute -top-2 -right-2 w-6 h-6 bg-red-500 hover:bg-red-600 text-white rounded-full flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity",
|
|
1431
1755
|
title: `Remove ${file.type}`,
|
|
1432
|
-
children: /* @__PURE__ */
|
|
1756
|
+
children: /* @__PURE__ */ jsx12("svg", { className: "w-4 h-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
1433
1757
|
}
|
|
1434
1758
|
)
|
|
1435
1759
|
] }, index)) })
|
|
1436
1760
|
] }),
|
|
1437
|
-
state === "idle" && allowInput && isCompact && /* @__PURE__ */
|
|
1438
|
-
/* @__PURE__ */
|
|
1439
|
-
enableFileUpload && /* @__PURE__ */
|
|
1761
|
+
state === "idle" && allowInput && isCompact && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
1762
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-0.5 flex-shrink-0", children: [
|
|
1763
|
+
enableFileUpload && /* @__PURE__ */ jsx12(
|
|
1440
1764
|
"button",
|
|
1441
1765
|
{
|
|
1442
1766
|
onClick: () => fileInputRef.current?.click(),
|
|
1443
1767
|
className: "w-8 h-8 rounded-lg flex items-center justify-center transition-all flex-shrink-0 !text-gray-500 dark:!text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-800",
|
|
1444
1768
|
title: "Attach file",
|
|
1445
|
-
children: /* @__PURE__ */
|
|
1769
|
+
children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8.4 2.8L4.4 6.8C3.736 7.464 3.736 8.536 4.4 9.2C5.064 9.864 6.136 9.864 6.8 9.2L11.6 4.4C12.704 3.296 12.704 1.504 11.6 0.4C10.496 -0.704 8.704 -0.704 7.6 0.4L2.8 5.2C1.256 6.744 1.256 9.256 2.8 10.8C4.344 12.344 6.856 12.344 8.4 10.8L12.4 6.8", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(1.6, 2.4)" }) })
|
|
1446
1770
|
}
|
|
1447
1771
|
),
|
|
1448
|
-
planMode && /* @__PURE__ */
|
|
1449
|
-
/* @__PURE__ */
|
|
1772
|
+
planMode && /* @__PURE__ */ jsxs10("div", { className: "relative settings-menu-container", children: [
|
|
1773
|
+
/* @__PURE__ */ jsx12(
|
|
1450
1774
|
"button",
|
|
1451
1775
|
{
|
|
1452
1776
|
onClick: () => setShowSettingsMenu(!showSettingsMenu),
|
|
@@ -1455,28 +1779,28 @@ ${planToExecute}`;
|
|
|
1455
1779
|
internalPlanMode ? "!text-blue-600 dark:!text-blue-400" : "!text-gray-500 dark:!text-gray-500"
|
|
1456
1780
|
),
|
|
1457
1781
|
title: "Settings",
|
|
1458
|
-
children: /* @__PURE__ */
|
|
1459
|
-
/* @__PURE__ */
|
|
1460
|
-
/* @__PURE__ */
|
|
1461
|
-
/* @__PURE__ */
|
|
1462
|
-
/* @__PURE__ */
|
|
1463
|
-
/* @__PURE__ */
|
|
1464
|
-
/* @__PURE__ */
|
|
1465
|
-
/* @__PURE__ */
|
|
1466
|
-
/* @__PURE__ */
|
|
1467
|
-
/* @__PURE__ */
|
|
1782
|
+
children: /* @__PURE__ */ jsxs10("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
1783
|
+
/* @__PURE__ */ jsx12("line", { x1: "4", y1: "21", x2: "4", y2: "14" }),
|
|
1784
|
+
/* @__PURE__ */ jsx12("line", { x1: "4", y1: "10", x2: "4", y2: "3" }),
|
|
1785
|
+
/* @__PURE__ */ jsx12("line", { x1: "12", y1: "21", x2: "12", y2: "12" }),
|
|
1786
|
+
/* @__PURE__ */ jsx12("line", { x1: "12", y1: "8", x2: "12", y2: "3" }),
|
|
1787
|
+
/* @__PURE__ */ jsx12("line", { x1: "20", y1: "21", x2: "20", y2: "16" }),
|
|
1788
|
+
/* @__PURE__ */ jsx12("line", { x1: "20", y1: "12", x2: "20", y2: "3" }),
|
|
1789
|
+
/* @__PURE__ */ jsx12("line", { x1: "1", y1: "14", x2: "7", y2: "14" }),
|
|
1790
|
+
/* @__PURE__ */ jsx12("line", { x1: "9", y1: "8", x2: "15", y2: "8" }),
|
|
1791
|
+
/* @__PURE__ */ jsx12("line", { x1: "17", y1: "16", x2: "23", y2: "16" })
|
|
1468
1792
|
] })
|
|
1469
1793
|
}
|
|
1470
1794
|
),
|
|
1471
|
-
showSettingsMenu && /* @__PURE__ */
|
|
1472
|
-
/* @__PURE__ */
|
|
1473
|
-
/* @__PURE__ */
|
|
1474
|
-
/* @__PURE__ */
|
|
1475
|
-
/* @__PURE__ */
|
|
1476
|
-
/* @__PURE__ */
|
|
1795
|
+
showSettingsMenu && /* @__PURE__ */ jsx12("div", { className: "absolute top-10 left-0 z-50 w-56 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-lg p-2.5 settings-menu-container", children: /* @__PURE__ */ jsxs10("label", { className: "flex items-center justify-between cursor-pointer group", children: [
|
|
1796
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
|
|
1797
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-3.5 h-3.5 text-gray-500 dark:text-gray-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
1798
|
+
/* @__PURE__ */ jsxs10("div", { children: [
|
|
1799
|
+
/* @__PURE__ */ jsx12("div", { className: "text-xs font-medium text-gray-700 dark:text-gray-300", children: "Plan Mode" }),
|
|
1800
|
+
/* @__PURE__ */ jsx12("div", { className: "text-[10px] text-gray-500 dark:text-gray-400", children: "Review first" })
|
|
1477
1801
|
] })
|
|
1478
1802
|
] }),
|
|
1479
|
-
/* @__PURE__ */
|
|
1803
|
+
/* @__PURE__ */ jsx12(
|
|
1480
1804
|
"button",
|
|
1481
1805
|
{
|
|
1482
1806
|
onClick: (e) => {
|
|
@@ -1488,7 +1812,7 @@ ${planToExecute}`;
|
|
|
1488
1812
|
internalPlanMode ? "bg-blue-600" : "bg-gray-300 dark:bg-gray-600"
|
|
1489
1813
|
),
|
|
1490
1814
|
type: "button",
|
|
1491
|
-
children: /* @__PURE__ */
|
|
1815
|
+
children: /* @__PURE__ */ jsx12(
|
|
1492
1816
|
"span",
|
|
1493
1817
|
{
|
|
1494
1818
|
className: cn(
|
|
@@ -1502,26 +1826,26 @@ ${planToExecute}`;
|
|
|
1502
1826
|
] }) })
|
|
1503
1827
|
] })
|
|
1504
1828
|
] }),
|
|
1505
|
-
uploadedFiles.length > 0 && /* @__PURE__ */
|
|
1506
|
-
file.type === "image" ? /* @__PURE__ */
|
|
1829
|
+
uploadedFiles.length > 0 && /* @__PURE__ */ jsx12("div", { className: "flex gap-1 flex-shrink-0", children: uploadedFiles.map((file, index) => /* @__PURE__ */ jsxs10("div", { className: "relative group", children: [
|
|
1830
|
+
file.type === "image" ? /* @__PURE__ */ jsx12(
|
|
1507
1831
|
"img",
|
|
1508
1832
|
{
|
|
1509
1833
|
src: file.preview,
|
|
1510
1834
|
alt: file.name,
|
|
1511
1835
|
className: "w-8 h-8 object-cover rounded border border-gray-300 dark:border-gray-600"
|
|
1512
1836
|
}
|
|
1513
|
-
) : /* @__PURE__ */
|
|
1514
|
-
/* @__PURE__ */
|
|
1837
|
+
) : /* @__PURE__ */ jsx12("div", { className: "w-8 h-8 flex items-center justify-center rounded border border-gray-300 dark:border-gray-600 bg-gray-50 dark:bg-gray-800", title: file.name, children: /* @__PURE__ */ jsx12("svg", { className: "w-4 h-4 text-gray-500 dark:text-gray-400", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx12("path", { fillRule: "evenodd", d: "M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z", clipRule: "evenodd" }) }) }),
|
|
1838
|
+
/* @__PURE__ */ jsx12(
|
|
1515
1839
|
"button",
|
|
1516
1840
|
{
|
|
1517
1841
|
onClick: () => removeFile(index),
|
|
1518
1842
|
className: "absolute -top-1 -right-1 w-4 h-4 bg-red-500 hover:bg-red-600 text-white rounded-full flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity",
|
|
1519
1843
|
title: "Remove",
|
|
1520
|
-
children: /* @__PURE__ */
|
|
1844
|
+
children: /* @__PURE__ */ jsx12("svg", { className: "w-2.5 h-2.5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 3, children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) })
|
|
1521
1845
|
}
|
|
1522
1846
|
)
|
|
1523
1847
|
] }, index)) }),
|
|
1524
|
-
/* @__PURE__ */
|
|
1848
|
+
/* @__PURE__ */ jsx12(
|
|
1525
1849
|
"input",
|
|
1526
1850
|
{
|
|
1527
1851
|
type: "text",
|
|
@@ -1537,7 +1861,7 @@ ${planToExecute}`;
|
|
|
1537
1861
|
className: "flex-1 bg-transparent border-none focus:outline-none !text-gray-900 dark:!text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 py-1"
|
|
1538
1862
|
}
|
|
1539
1863
|
),
|
|
1540
|
-
/* @__PURE__ */
|
|
1864
|
+
/* @__PURE__ */ jsx12(
|
|
1541
1865
|
"button",
|
|
1542
1866
|
{
|
|
1543
1867
|
onClick: () => executeCommand(),
|
|
@@ -1553,33 +1877,33 @@ ${planToExecute}`;
|
|
|
1553
1877
|
!command.trim() && "border-gray-200 dark:border-gray-700 !text-gray-400 dark:!text-gray-600"
|
|
1554
1878
|
),
|
|
1555
1879
|
title: "Execute",
|
|
1556
|
-
children: /* @__PURE__ */
|
|
1880
|
+
children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
1557
1881
|
}
|
|
1558
1882
|
)
|
|
1559
1883
|
] }),
|
|
1560
|
-
state === "loading" && !isCompact && /* @__PURE__ */
|
|
1561
|
-
/* @__PURE__ */
|
|
1562
|
-
/* @__PURE__ */
|
|
1563
|
-
showProgress && /* @__PURE__ */
|
|
1564
|
-
/* @__PURE__ */
|
|
1884
|
+
state === "loading" && !isCompact && /* @__PURE__ */ jsxs10("div", { className: "flex-1 flex flex-col items-center justify-center space-y-4 py-8", children: [
|
|
1885
|
+
/* @__PURE__ */ jsx12("div", { className: "w-6 h-6 border-2 border-gray-300 border-t-blue-500 rounded-full animate-spin" }),
|
|
1886
|
+
/* @__PURE__ */ jsx12("div", { className: "text-gray-600 dark:text-gray-400 text-sm text-center max-w-md", children: enableStreaming && streamedContent ? streamedContent : loadingText }),
|
|
1887
|
+
showProgress && /* @__PURE__ */ jsxs10("div", { className: "w-full max-w-sm", children: [
|
|
1888
|
+
/* @__PURE__ */ jsx12("div", { className: "w-full bg-gray-200 dark:bg-gray-700 rounded-full h-1.5", children: /* @__PURE__ */ jsx12(
|
|
1565
1889
|
"div",
|
|
1566
1890
|
{
|
|
1567
1891
|
className: "bg-blue-500 h-1.5 rounded-full transition-all duration-300",
|
|
1568
1892
|
style: { width: `${progress}%` }
|
|
1569
1893
|
}
|
|
1570
1894
|
) }),
|
|
1571
|
-
/* @__PURE__ */
|
|
1895
|
+
/* @__PURE__ */ jsxs10("p", { className: "text-xs text-gray-500 mt-2 text-center", children: [
|
|
1572
1896
|
progress,
|
|
1573
1897
|
"%"
|
|
1574
1898
|
] })
|
|
1575
1899
|
] })
|
|
1576
1900
|
] }),
|
|
1577
|
-
state === "loading" && isCompact && /* @__PURE__ */
|
|
1578
|
-
/* @__PURE__ */
|
|
1579
|
-
/* @__PURE__ */
|
|
1580
|
-
/* @__PURE__ */
|
|
1901
|
+
state === "loading" && isCompact && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
1902
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex-1 flex items-center gap-3 py-1", children: [
|
|
1903
|
+
/* @__PURE__ */ jsx12("div", { className: "w-4 h-4 border-2 border-gray-300 border-t-blue-500 rounded-full animate-spin" }),
|
|
1904
|
+
/* @__PURE__ */ jsx12("div", { className: "text-gray-600 dark:text-gray-400 text-sm truncate", children: enableStreaming && streamedContent ? streamedContent : loadingText })
|
|
1581
1905
|
] }),
|
|
1582
|
-
/* @__PURE__ */
|
|
1906
|
+
/* @__PURE__ */ jsx12(
|
|
1583
1907
|
"button",
|
|
1584
1908
|
{
|
|
1585
1909
|
disabled: true,
|
|
@@ -1591,20 +1915,20 @@ ${planToExecute}`;
|
|
|
1591
1915
|
"!text-lg",
|
|
1592
1916
|
"opacity-30 cursor-not-allowed"
|
|
1593
1917
|
),
|
|
1594
|
-
children: /* @__PURE__ */
|
|
1918
|
+
children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
1595
1919
|
}
|
|
1596
1920
|
)
|
|
1597
1921
|
] }),
|
|
1598
|
-
state === "plan-pending" && !isCompact && /* @__PURE__ */
|
|
1599
|
-
/* @__PURE__ */
|
|
1600
|
-
/* @__PURE__ */
|
|
1601
|
-
/* @__PURE__ */
|
|
1602
|
-
/* @__PURE__ */
|
|
1603
|
-
/* @__PURE__ */
|
|
1922
|
+
state === "plan-pending" && !isCompact && /* @__PURE__ */ jsx12("div", { className: "flex-1 flex flex-col", children: /* @__PURE__ */ jsxs10("div", { className: "mb-4 p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg", children: [
|
|
1923
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-start gap-2 mb-3", children: [
|
|
1924
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-5 h-5 text-blue-600 dark:text-blue-400 mt-0.5 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
1925
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex-1", children: [
|
|
1926
|
+
/* @__PURE__ */ jsx12("h3", { className: "text-sm font-semibold text-blue-800 dark:text-blue-300 mb-1", children: "Proposed Plan" }),
|
|
1927
|
+
/* @__PURE__ */ jsx12("div", { className: "text-blue-700 dark:text-blue-300 text-sm whitespace-pre-line leading-relaxed", children: plan })
|
|
1604
1928
|
] })
|
|
1605
1929
|
] }),
|
|
1606
|
-
/* @__PURE__ */
|
|
1607
|
-
/* @__PURE__ */
|
|
1930
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex gap-2 mt-4", children: [
|
|
1931
|
+
/* @__PURE__ */ jsx12(
|
|
1608
1932
|
"button",
|
|
1609
1933
|
{
|
|
1610
1934
|
onClick: approvePlan,
|
|
@@ -1612,7 +1936,7 @@ ${planToExecute}`;
|
|
|
1612
1936
|
children: "Approve & Execute"
|
|
1613
1937
|
}
|
|
1614
1938
|
),
|
|
1615
|
-
/* @__PURE__ */
|
|
1939
|
+
/* @__PURE__ */ jsx12(
|
|
1616
1940
|
"button",
|
|
1617
1941
|
{
|
|
1618
1942
|
onClick: rejectPlan,
|
|
@@ -1622,20 +1946,20 @@ ${planToExecute}`;
|
|
|
1622
1946
|
)
|
|
1623
1947
|
] })
|
|
1624
1948
|
] }) }),
|
|
1625
|
-
state === "plan-pending" && isCompact && /* @__PURE__ */
|
|
1626
|
-
/* @__PURE__ */
|
|
1949
|
+
state === "plan-pending" && isCompact && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
1950
|
+
/* @__PURE__ */ jsxs10(
|
|
1627
1951
|
"button",
|
|
1628
1952
|
{
|
|
1629
1953
|
onClick: () => setShowPlanDetails(true),
|
|
1630
1954
|
className: "flex-1 flex items-center gap-2 px-3 py-2 bg-blue-50 dark:bg-blue-900/30 hover:bg-blue-100 dark:hover:bg-blue-900/40 border border-blue-200 dark:border-blue-800 rounded-lg transition-colors",
|
|
1631
1955
|
children: [
|
|
1632
|
-
/* @__PURE__ */
|
|
1633
|
-
/* @__PURE__ */
|
|
1956
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-4 h-4 text-blue-600 dark:text-blue-400 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
1957
|
+
/* @__PURE__ */ jsx12("span", { className: "text-sm font-medium text-blue-700 dark:text-blue-300 truncate flex-1", children: "View Execution Plan" })
|
|
1634
1958
|
]
|
|
1635
1959
|
}
|
|
1636
1960
|
),
|
|
1637
|
-
/* @__PURE__ */
|
|
1638
|
-
/* @__PURE__ */
|
|
1961
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex gap-2 flex-shrink-0", children: [
|
|
1962
|
+
/* @__PURE__ */ jsx12(
|
|
1639
1963
|
"button",
|
|
1640
1964
|
{
|
|
1641
1965
|
onClick: approvePlan,
|
|
@@ -1643,7 +1967,7 @@ ${planToExecute}`;
|
|
|
1643
1967
|
children: "Approve"
|
|
1644
1968
|
}
|
|
1645
1969
|
),
|
|
1646
|
-
/* @__PURE__ */
|
|
1970
|
+
/* @__PURE__ */ jsx12(
|
|
1647
1971
|
"button",
|
|
1648
1972
|
{
|
|
1649
1973
|
onClick: rejectPlan,
|
|
@@ -1653,15 +1977,15 @@ ${planToExecute}`;
|
|
|
1653
1977
|
)
|
|
1654
1978
|
] })
|
|
1655
1979
|
] }),
|
|
1656
|
-
state === "error" && /* @__PURE__ */
|
|
1657
|
-
/* @__PURE__ */
|
|
1658
|
-
/* @__PURE__ */
|
|
1659
|
-
/* @__PURE__ */
|
|
1660
|
-
/* @__PURE__ */
|
|
1661
|
-
/* @__PURE__ */
|
|
1980
|
+
state === "error" && /* @__PURE__ */ jsxs10("div", { className: "flex-1 flex flex-col", children: [
|
|
1981
|
+
/* @__PURE__ */ jsx12("div", { className: "mb-4 p-3 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg", children: /* @__PURE__ */ jsxs10("div", { className: "flex items-start gap-2", children: [
|
|
1982
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-5 h-5 text-red-600 mt-0.5 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
|
|
1983
|
+
/* @__PURE__ */ jsxs10("div", { children: [
|
|
1984
|
+
/* @__PURE__ */ jsx12("h3", { className: "text-sm font-semibold text-red-800 dark:text-red-400", children: "Error" }),
|
|
1985
|
+
/* @__PURE__ */ jsx12("p", { className: "text-red-700 dark:text-red-300 text-sm mt-1", children: error?.message })
|
|
1662
1986
|
] })
|
|
1663
1987
|
] }) }),
|
|
1664
|
-
allowInput && /* @__PURE__ */
|
|
1988
|
+
allowInput && /* @__PURE__ */ jsx12(
|
|
1665
1989
|
"textarea",
|
|
1666
1990
|
{
|
|
1667
1991
|
value: command,
|
|
@@ -1678,16 +2002,16 @@ ${planToExecute}`;
|
|
|
1678
2002
|
}
|
|
1679
2003
|
)
|
|
1680
2004
|
] }),
|
|
1681
|
-
state === "success" && result && !isCompact && /* @__PURE__ */
|
|
1682
|
-
/* @__PURE__ */
|
|
1683
|
-
/* @__PURE__ */
|
|
1684
|
-
/* @__PURE__ */
|
|
1685
|
-
/* @__PURE__ */
|
|
1686
|
-
/* @__PURE__ */
|
|
2005
|
+
state === "success" && result && !isCompact && /* @__PURE__ */ jsx12("div", { className: "flex-1 overflow-auto", children: resultRenderer ? resultRenderer(result.data) : /* @__PURE__ */ jsxs10("div", { className: "space-y-4", children: [
|
|
2006
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-start gap-3 p-3 bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800 rounded-lg", children: [
|
|
2007
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-5 h-5 text-green-600 mt-0.5 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
|
|
2008
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex-1", children: [
|
|
2009
|
+
/* @__PURE__ */ jsx12("h3", { className: "text-sm font-semibold text-green-800 dark:text-green-400 mb-1", children: "Success" }),
|
|
2010
|
+
/* @__PURE__ */ jsx12("p", { className: "text-green-700 dark:text-green-300 text-sm", children: "Command executed successfully" })
|
|
1687
2011
|
] })
|
|
1688
2012
|
] }),
|
|
1689
|
-
result.data?.summary && /* @__PURE__ */
|
|
1690
|
-
result.widgets && result.widgets.length > 0 && /* @__PURE__ */
|
|
2013
|
+
result.data?.summary && /* @__PURE__ */ jsx12("div", { className: "text-gray-700 dark:text-gray-300 text-sm leading-relaxed whitespace-pre-line", children: result.data.summary }),
|
|
2014
|
+
result.widgets && result.widgets.length > 0 && /* @__PURE__ */ jsx12("div", { className: "space-y-3", children: result.widgets.map((widget) => /* @__PURE__ */ jsx12(
|
|
1691
2015
|
WidgetRenderer,
|
|
1692
2016
|
{
|
|
1693
2017
|
widget,
|
|
@@ -1696,8 +2020,8 @@ ${planToExecute}`;
|
|
|
1696
2020
|
widget.id
|
|
1697
2021
|
)) })
|
|
1698
2022
|
] }) }),
|
|
1699
|
-
state === "success" && result && isCompact && /* @__PURE__ */
|
|
1700
|
-
/* @__PURE__ */
|
|
2023
|
+
state === "success" && result && isCompact && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
2024
|
+
/* @__PURE__ */ jsxs10(
|
|
1701
2025
|
"div",
|
|
1702
2026
|
{
|
|
1703
2027
|
className: "flex-1 flex items-center gap-2 py-1 cursor-text min-w-0",
|
|
@@ -1706,12 +2030,12 @@ ${planToExecute}`;
|
|
|
1706
2030
|
setResult(null);
|
|
1707
2031
|
},
|
|
1708
2032
|
children: [
|
|
1709
|
-
/* @__PURE__ */
|
|
1710
|
-
/* @__PURE__ */
|
|
2033
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-4 h-4 text-green-600 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
|
|
2034
|
+
/* @__PURE__ */ jsx12("div", { className: "text-green-700 dark:text-green-300 text-sm truncate flex-1 min-w-0", children: resultRenderer ? resultRenderer(result.data) : result.message || "Command executed successfully" })
|
|
1711
2035
|
]
|
|
1712
2036
|
}
|
|
1713
2037
|
),
|
|
1714
|
-
/* @__PURE__ */
|
|
2038
|
+
/* @__PURE__ */ jsx12(
|
|
1715
2039
|
"button",
|
|
1716
2040
|
{
|
|
1717
2041
|
onClick: () => {
|
|
@@ -1727,24 +2051,24 @@ ${planToExecute}`;
|
|
|
1727
2051
|
"!text-lg"
|
|
1728
2052
|
),
|
|
1729
2053
|
title: "New command",
|
|
1730
|
-
children: /* @__PURE__ */
|
|
2054
|
+
children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
1731
2055
|
}
|
|
1732
2056
|
)
|
|
1733
2057
|
] })
|
|
1734
2058
|
] }),
|
|
1735
|
-
!isCompact && /* @__PURE__ */
|
|
1736
|
-
/* @__PURE__ */
|
|
1737
|
-
enableFileUpload && /* @__PURE__ */
|
|
2059
|
+
!isCompact && /* @__PURE__ */ jsxs10("div", { className: "p-3 flex items-center justify-between gap-2", children: [
|
|
2060
|
+
/* @__PURE__ */ jsx12("div", { className: "flex items-center gap-1", children: state === "idle" && allowInput && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
2061
|
+
enableFileUpload && /* @__PURE__ */ jsx12(
|
|
1738
2062
|
"button",
|
|
1739
2063
|
{
|
|
1740
2064
|
onClick: () => fileInputRef.current?.click(),
|
|
1741
2065
|
className: "w-8 h-8 rounded-lg flex items-center justify-center transition-all flex-shrink-0 !text-gray-500 dark:!text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-800",
|
|
1742
2066
|
title: "Attach file",
|
|
1743
|
-
children: /* @__PURE__ */
|
|
2067
|
+
children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8.4 2.8L4.4 6.8C3.736 7.464 3.736 8.536 4.4 9.2C5.064 9.864 6.136 9.864 6.8 9.2L11.6 4.4C12.704 3.296 12.704 1.504 11.6 0.4C10.496 -0.704 8.704 -0.704 7.6 0.4L2.8 5.2C1.256 6.744 1.256 9.256 2.8 10.8C4.344 12.344 6.856 12.344 8.4 10.8L12.4 6.8", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(1.6, 2.4)" }) })
|
|
1744
2068
|
}
|
|
1745
2069
|
),
|
|
1746
|
-
planMode && /* @__PURE__ */
|
|
1747
|
-
/* @__PURE__ */
|
|
2070
|
+
planMode && /* @__PURE__ */ jsxs10("div", { className: "relative settings-menu-container", children: [
|
|
2071
|
+
/* @__PURE__ */ jsx12(
|
|
1748
2072
|
"button",
|
|
1749
2073
|
{
|
|
1750
2074
|
onClick: () => setShowSettingsMenu(!showSettingsMenu),
|
|
@@ -1753,28 +2077,28 @@ ${planToExecute}`;
|
|
|
1753
2077
|
internalPlanMode ? "!text-blue-600 dark:!text-blue-400" : "!text-gray-500 dark:!text-gray-500"
|
|
1754
2078
|
),
|
|
1755
2079
|
title: "Settings",
|
|
1756
|
-
children: /* @__PURE__ */
|
|
1757
|
-
/* @__PURE__ */
|
|
1758
|
-
/* @__PURE__ */
|
|
1759
|
-
/* @__PURE__ */
|
|
1760
|
-
/* @__PURE__ */
|
|
1761
|
-
/* @__PURE__ */
|
|
1762
|
-
/* @__PURE__ */
|
|
1763
|
-
/* @__PURE__ */
|
|
1764
|
-
/* @__PURE__ */
|
|
1765
|
-
/* @__PURE__ */
|
|
2080
|
+
children: /* @__PURE__ */ jsxs10("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
2081
|
+
/* @__PURE__ */ jsx12("line", { x1: "4", y1: "21", x2: "4", y2: "14" }),
|
|
2082
|
+
/* @__PURE__ */ jsx12("line", { x1: "4", y1: "10", x2: "4", y2: "3" }),
|
|
2083
|
+
/* @__PURE__ */ jsx12("line", { x1: "12", y1: "21", x2: "12", y2: "12" }),
|
|
2084
|
+
/* @__PURE__ */ jsx12("line", { x1: "12", y1: "8", x2: "12", y2: "3" }),
|
|
2085
|
+
/* @__PURE__ */ jsx12("line", { x1: "20", y1: "21", x2: "20", y2: "16" }),
|
|
2086
|
+
/* @__PURE__ */ jsx12("line", { x1: "20", y1: "12", x2: "20", y2: "3" }),
|
|
2087
|
+
/* @__PURE__ */ jsx12("line", { x1: "1", y1: "14", x2: "7", y2: "14" }),
|
|
2088
|
+
/* @__PURE__ */ jsx12("line", { x1: "9", y1: "8", x2: "15", y2: "8" }),
|
|
2089
|
+
/* @__PURE__ */ jsx12("line", { x1: "17", y1: "16", x2: "23", y2: "16" })
|
|
1766
2090
|
] })
|
|
1767
2091
|
}
|
|
1768
2092
|
),
|
|
1769
|
-
showSettingsMenu && /* @__PURE__ */
|
|
1770
|
-
/* @__PURE__ */
|
|
1771
|
-
/* @__PURE__ */
|
|
1772
|
-
/* @__PURE__ */
|
|
1773
|
-
/* @__PURE__ */
|
|
1774
|
-
/* @__PURE__ */
|
|
2093
|
+
showSettingsMenu && /* @__PURE__ */ jsx12("div", { className: "absolute top-10 left-0 z-50 w-64 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-lg p-3 settings-menu-container", children: /* @__PURE__ */ jsxs10("label", { className: "flex items-center justify-between cursor-pointer group", children: [
|
|
2094
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
|
|
2095
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-4 h-4 text-gray-500 dark:text-gray-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
2096
|
+
/* @__PURE__ */ jsxs10("div", { children: [
|
|
2097
|
+
/* @__PURE__ */ jsx12("div", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: "Plan Mode" }),
|
|
2098
|
+
/* @__PURE__ */ jsx12("div", { className: "text-xs text-gray-500 dark:text-gray-400", children: "Review before executing" })
|
|
1775
2099
|
] })
|
|
1776
2100
|
] }),
|
|
1777
|
-
/* @__PURE__ */
|
|
2101
|
+
/* @__PURE__ */ jsx12(
|
|
1778
2102
|
"button",
|
|
1779
2103
|
{
|
|
1780
2104
|
onClick: (e) => {
|
|
@@ -1786,7 +2110,7 @@ ${planToExecute}`;
|
|
|
1786
2110
|
internalPlanMode ? "bg-blue-600" : "bg-gray-300 dark:bg-gray-600"
|
|
1787
2111
|
),
|
|
1788
2112
|
type: "button",
|
|
1789
|
-
children: /* @__PURE__ */
|
|
2113
|
+
children: /* @__PURE__ */ jsx12(
|
|
1790
2114
|
"span",
|
|
1791
2115
|
{
|
|
1792
2116
|
className: cn(
|
|
@@ -1800,9 +2124,9 @@ ${planToExecute}`;
|
|
|
1800
2124
|
] }) })
|
|
1801
2125
|
] })
|
|
1802
2126
|
] }) }),
|
|
1803
|
-
!(state === "idle" && allowInput) && /* @__PURE__ */
|
|
1804
|
-
/* @__PURE__ */
|
|
1805
|
-
(state === "success" || state === "error") && allowInput && /* @__PURE__ */
|
|
2127
|
+
!(state === "idle" && allowInput) && /* @__PURE__ */ jsx12("div", {}),
|
|
2128
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
|
|
2129
|
+
(state === "success" || state === "error") && allowInput && /* @__PURE__ */ jsx12(
|
|
1806
2130
|
"button",
|
|
1807
2131
|
{
|
|
1808
2132
|
onClick: resetCommand,
|
|
@@ -1810,7 +2134,7 @@ ${planToExecute}`;
|
|
|
1810
2134
|
children: "Reset"
|
|
1811
2135
|
}
|
|
1812
2136
|
),
|
|
1813
|
-
(state === "idle" || state === "error") && /* @__PURE__ */
|
|
2137
|
+
(state === "idle" || state === "error") && /* @__PURE__ */ jsx12(
|
|
1814
2138
|
"button",
|
|
1815
2139
|
{
|
|
1816
2140
|
onClick: () => executeCommand(),
|
|
@@ -1826,29 +2150,29 @@ ${planToExecute}`;
|
|
|
1826
2150
|
!command.trim() && "border-gray-200 dark:border-gray-700 !text-gray-400 dark:!text-gray-600"
|
|
1827
2151
|
),
|
|
1828
2152
|
title: state === "error" ? "Retry" : "Execute",
|
|
1829
|
-
children: state === "error" ? /* @__PURE__ */
|
|
2153
|
+
children: state === "error" ? /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M13 8C13 10.7614 10.7614 13 8 13C5.23858 13 3 10.7614 3 8C3 5.23858 5.23858 3 8 3C9.65685 3 11.1257 3.82818 12 5.09091M12 3V5.09091M12 5.09091H9.81818", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) : /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
1830
2154
|
}
|
|
1831
2155
|
)
|
|
1832
2156
|
] })
|
|
1833
2157
|
] }),
|
|
1834
|
-
showPlanDetails && isCompact && state === "plan-pending" && /* @__PURE__ */
|
|
1835
|
-
/* @__PURE__ */
|
|
1836
|
-
/* @__PURE__ */
|
|
1837
|
-
/* @__PURE__ */
|
|
1838
|
-
/* @__PURE__ */
|
|
2158
|
+
showPlanDetails && isCompact && state === "plan-pending" && /* @__PURE__ */ jsx12("div", { className: "fixed inset-0 bg-black/50 flex items-center justify-center z-50 p-4", onClick: () => setShowPlanDetails(false), children: /* @__PURE__ */ jsxs10("div", { className: "bg-white dark:bg-gray-900 rounded-2xl shadow-2xl max-w-2xl w-full max-h-[80vh] overflow-hidden", onClick: (e) => e.stopPropagation(), children: [
|
|
2159
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between p-6 border-b border-gray-200 dark:border-gray-700", children: [
|
|
2160
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-3", children: [
|
|
2161
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-6 h-6 text-blue-600 dark:text-blue-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
2162
|
+
/* @__PURE__ */ jsx12("h2", { className: "text-xl font-semibold text-gray-900 dark:text-white", children: "Proposed Execution Plan" })
|
|
1839
2163
|
] }),
|
|
1840
|
-
/* @__PURE__ */
|
|
2164
|
+
/* @__PURE__ */ jsx12(
|
|
1841
2165
|
"button",
|
|
1842
2166
|
{
|
|
1843
2167
|
onClick: () => setShowPlanDetails(false),
|
|
1844
2168
|
className: "text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 transition-colors",
|
|
1845
|
-
children: /* @__PURE__ */
|
|
2169
|
+
children: /* @__PURE__ */ jsx12("svg", { className: "w-6 h-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
1846
2170
|
}
|
|
1847
2171
|
)
|
|
1848
2172
|
] }),
|
|
1849
|
-
/* @__PURE__ */
|
|
1850
|
-
/* @__PURE__ */
|
|
1851
|
-
/* @__PURE__ */
|
|
2173
|
+
/* @__PURE__ */ jsx12("div", { className: "p-6 overflow-y-auto max-h-[calc(80vh-180px)]", children: /* @__PURE__ */ jsx12("div", { className: "prose prose-sm dark:prose-invert max-w-none", children: /* @__PURE__ */ jsx12("div", { className: "text-gray-700 dark:text-gray-300 whitespace-pre-line leading-relaxed", children: plan }) }) }),
|
|
2174
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-end gap-3 p-6 border-t border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-800/50", children: [
|
|
2175
|
+
/* @__PURE__ */ jsx12(
|
|
1852
2176
|
"button",
|
|
1853
2177
|
{
|
|
1854
2178
|
onClick: rejectPlan,
|
|
@@ -1856,7 +2180,7 @@ ${planToExecute}`;
|
|
|
1856
2180
|
children: "Modify Command"
|
|
1857
2181
|
}
|
|
1858
2182
|
),
|
|
1859
|
-
/* @__PURE__ */
|
|
2183
|
+
/* @__PURE__ */ jsx12(
|
|
1860
2184
|
"button",
|
|
1861
2185
|
{
|
|
1862
2186
|
onClick: approvePlan,
|
|
@@ -1866,7 +2190,7 @@ ${planToExecute}`;
|
|
|
1866
2190
|
)
|
|
1867
2191
|
] })
|
|
1868
2192
|
] }) }),
|
|
1869
|
-
/* @__PURE__ */
|
|
2193
|
+
/* @__PURE__ */ jsx12(
|
|
1870
2194
|
"input",
|
|
1871
2195
|
{
|
|
1872
2196
|
ref: fileInputRef,
|
|
@@ -1877,7 +2201,7 @@ ${planToExecute}`;
|
|
|
1877
2201
|
accept: "image/*,application/pdf,.doc,.docx,.txt"
|
|
1878
2202
|
}
|
|
1879
2203
|
),
|
|
1880
|
-
/* @__PURE__ */
|
|
2204
|
+
/* @__PURE__ */ jsx12("style", { dangerouslySetInnerHTML: {
|
|
1881
2205
|
__html: `
|
|
1882
2206
|
@keyframes pulse-border {
|
|
1883
2207
|
0%, 100% {
|
|
@@ -1899,7 +2223,7 @@ ${planToExecute}`;
|
|
|
1899
2223
|
|
|
1900
2224
|
// src/components/Prompt/Prompt.tsx
|
|
1901
2225
|
import { useState as useState4 } from "react";
|
|
1902
|
-
import { jsx as
|
|
2226
|
+
import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1903
2227
|
function Prompt({
|
|
1904
2228
|
agentId,
|
|
1905
2229
|
placeholder = "Enter your prompt...",
|
|
@@ -1961,9 +2285,9 @@ function Prompt({
|
|
|
1961
2285
|
handleSubmit();
|
|
1962
2286
|
}
|
|
1963
2287
|
};
|
|
1964
|
-
return /* @__PURE__ */
|
|
1965
|
-
/* @__PURE__ */
|
|
1966
|
-
/* @__PURE__ */
|
|
2288
|
+
return /* @__PURE__ */ jsxs11("div", { className: cn("space-y-2", className), children: [
|
|
2289
|
+
/* @__PURE__ */ jsxs11("div", { className: "flex gap-2", children: [
|
|
2290
|
+
/* @__PURE__ */ jsx13(
|
|
1967
2291
|
"input",
|
|
1968
2292
|
{
|
|
1969
2293
|
type: "text",
|
|
@@ -1976,7 +2300,7 @@ function Prompt({
|
|
|
1976
2300
|
className: "flex-1 px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-apteva-500 dark:bg-gray-800 dark:border-gray-600 dark:text-white"
|
|
1977
2301
|
}
|
|
1978
2302
|
),
|
|
1979
|
-
submitOn === "button" && /* @__PURE__ */
|
|
2303
|
+
submitOn === "button" && /* @__PURE__ */ jsx13(
|
|
1980
2304
|
"button",
|
|
1981
2305
|
{
|
|
1982
2306
|
onClick: handleSubmit,
|
|
@@ -1986,13 +2310,13 @@ function Prompt({
|
|
|
1986
2310
|
}
|
|
1987
2311
|
)
|
|
1988
2312
|
] }),
|
|
1989
|
-
maxLength && /* @__PURE__ */
|
|
2313
|
+
maxLength && /* @__PURE__ */ jsxs11("p", { className: "text-xs text-gray-500", children: [
|
|
1990
2314
|
value.length,
|
|
1991
2315
|
" / ",
|
|
1992
2316
|
maxLength,
|
|
1993
2317
|
" characters"
|
|
1994
2318
|
] }),
|
|
1995
|
-
showSuggestions && !value && /* @__PURE__ */
|
|
2319
|
+
showSuggestions && !value && /* @__PURE__ */ jsx13("div", { className: "flex flex-wrap gap-2", children: suggestions.map((suggestion, idx) => /* @__PURE__ */ jsx13(
|
|
1996
2320
|
"button",
|
|
1997
2321
|
{
|
|
1998
2322
|
onClick: () => setValue(suggestion),
|
|
@@ -2001,16 +2325,16 @@ function Prompt({
|
|
|
2001
2325
|
},
|
|
2002
2326
|
idx
|
|
2003
2327
|
)) }),
|
|
2004
|
-
isLoading && /* @__PURE__ */
|
|
2005
|
-
/* @__PURE__ */
|
|
2006
|
-
/* @__PURE__ */
|
|
2328
|
+
isLoading && /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 text-sm text-gray-500", children: [
|
|
2329
|
+
/* @__PURE__ */ jsx13("div", { className: "w-4 h-4 border-2 border-apteva-500 border-t-transparent rounded-full animate-spin" }),
|
|
2330
|
+
/* @__PURE__ */ jsx13("span", { children: "AI is processing your request..." })
|
|
2007
2331
|
] })
|
|
2008
2332
|
] });
|
|
2009
2333
|
}
|
|
2010
2334
|
|
|
2011
2335
|
// src/components/Stream/Stream.tsx
|
|
2012
2336
|
import { useState as useState5, useEffect as useEffect5 } from "react";
|
|
2013
|
-
import { jsx as
|
|
2337
|
+
import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
2014
2338
|
function Stream({
|
|
2015
2339
|
agentId,
|
|
2016
2340
|
prompt,
|
|
@@ -2090,7 +2414,7 @@ function Stream({
|
|
|
2090
2414
|
plain: "text-gray-900 dark:text-gray-100"
|
|
2091
2415
|
};
|
|
2092
2416
|
if (!isStreaming && !isComplete) {
|
|
2093
|
-
return /* @__PURE__ */
|
|
2417
|
+
return /* @__PURE__ */ jsx14("div", { className: cn("p-4", className), children: /* @__PURE__ */ jsx14(
|
|
2094
2418
|
"button",
|
|
2095
2419
|
{
|
|
2096
2420
|
onClick: startStreaming,
|
|
@@ -2099,9 +2423,9 @@ function Stream({
|
|
|
2099
2423
|
}
|
|
2100
2424
|
) });
|
|
2101
2425
|
}
|
|
2102
|
-
return /* @__PURE__ */
|
|
2426
|
+
return /* @__PURE__ */ jsxs12("div", { className: cn(variantClasses[variant], className), children: [
|
|
2103
2427
|
text,
|
|
2104
|
-
isStreaming && showCursor && /* @__PURE__ */
|
|
2428
|
+
isStreaming && showCursor && /* @__PURE__ */ jsx14("span", { className: "apteva-stream-cursor" })
|
|
2105
2429
|
] });
|
|
2106
2430
|
}
|
|
2107
2431
|
|
|
@@ -2109,9 +2433,9 @@ function Stream({
|
|
|
2109
2433
|
import { useState as useState6 } from "react";
|
|
2110
2434
|
|
|
2111
2435
|
// src/components/Threads/ThreadItem.tsx
|
|
2112
|
-
import { jsx as
|
|
2436
|
+
import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
2113
2437
|
function ThreadItem({ thread, isActive = false, onSelect, onDelete }) {
|
|
2114
|
-
return /* @__PURE__ */
|
|
2438
|
+
return /* @__PURE__ */ jsxs13(
|
|
2115
2439
|
"div",
|
|
2116
2440
|
{
|
|
2117
2441
|
className: cn("apteva-thread-item", {
|
|
@@ -2119,19 +2443,19 @@ function ThreadItem({ thread, isActive = false, onSelect, onDelete }) {
|
|
|
2119
2443
|
}),
|
|
2120
2444
|
onClick: onSelect,
|
|
2121
2445
|
children: [
|
|
2122
|
-
/* @__PURE__ */
|
|
2123
|
-
/* @__PURE__ */
|
|
2124
|
-
thread.preview && /* @__PURE__ */
|
|
2125
|
-
/* @__PURE__ */
|
|
2126
|
-
/* @__PURE__ */
|
|
2446
|
+
/* @__PURE__ */ jsxs13("div", { className: "flex-1 min-w-0", children: [
|
|
2447
|
+
/* @__PURE__ */ jsx15("h4", { className: "font-semibold text-gray-900 dark:text-white truncate", children: thread.title }),
|
|
2448
|
+
thread.preview && /* @__PURE__ */ jsx15("p", { className: "text-sm text-gray-600 dark:text-gray-400 truncate", children: thread.preview }),
|
|
2449
|
+
/* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2 mt-1 text-xs text-gray-500", children: [
|
|
2450
|
+
/* @__PURE__ */ jsxs13("span", { children: [
|
|
2127
2451
|
thread.messageCount,
|
|
2128
2452
|
" messages"
|
|
2129
2453
|
] }),
|
|
2130
|
-
/* @__PURE__ */
|
|
2131
|
-
/* @__PURE__ */
|
|
2454
|
+
/* @__PURE__ */ jsx15("span", { children: "\u2022" }),
|
|
2455
|
+
/* @__PURE__ */ jsx15("span", { children: formatRelativeTime(thread.updatedAt) })
|
|
2132
2456
|
] })
|
|
2133
2457
|
] }),
|
|
2134
|
-
onDelete && /* @__PURE__ */
|
|
2458
|
+
onDelete && /* @__PURE__ */ jsx15(
|
|
2135
2459
|
"button",
|
|
2136
2460
|
{
|
|
2137
2461
|
onClick: (e) => {
|
|
@@ -2161,7 +2485,7 @@ function formatRelativeTime(date) {
|
|
|
2161
2485
|
}
|
|
2162
2486
|
|
|
2163
2487
|
// src/components/Threads/ThreadList.tsx
|
|
2164
|
-
import { jsx as
|
|
2488
|
+
import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
2165
2489
|
function ThreadList({
|
|
2166
2490
|
threads,
|
|
2167
2491
|
currentThreadId,
|
|
@@ -2175,8 +2499,8 @@ function ThreadList({
|
|
|
2175
2499
|
(thread) => thread.title.toLowerCase().includes(searchQuery.toLowerCase()) || thread.preview?.toLowerCase().includes(searchQuery.toLowerCase())
|
|
2176
2500
|
);
|
|
2177
2501
|
const groupedThreads = groupBy === "date" ? groupThreadsByDate(filteredThreads) : { All: filteredThreads };
|
|
2178
|
-
return /* @__PURE__ */
|
|
2179
|
-
showSearch && /* @__PURE__ */
|
|
2502
|
+
return /* @__PURE__ */ jsxs14("div", { className: "flex flex-col h-full", children: [
|
|
2503
|
+
showSearch && /* @__PURE__ */ jsx16("div", { className: "p-3 border-b border-gray-200 dark:border-gray-700", children: /* @__PURE__ */ jsx16(
|
|
2180
2504
|
"input",
|
|
2181
2505
|
{
|
|
2182
2506
|
type: "text",
|
|
@@ -2186,10 +2510,10 @@ function ThreadList({
|
|
|
2186
2510
|
className: "w-full px-3 py-2 text-sm border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-apteva-500 dark:bg-gray-800 dark:border-gray-600 dark:text-white"
|
|
2187
2511
|
}
|
|
2188
2512
|
) }),
|
|
2189
|
-
/* @__PURE__ */
|
|
2190
|
-
Object.entries(groupedThreads).map(([group, groupThreads]) => /* @__PURE__ */
|
|
2191
|
-
groupBy !== "none" && /* @__PURE__ */
|
|
2192
|
-
groupThreads.map((thread) => /* @__PURE__ */
|
|
2513
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex-1 overflow-y-auto", children: [
|
|
2514
|
+
Object.entries(groupedThreads).map(([group, groupThreads]) => /* @__PURE__ */ jsxs14("div", { children: [
|
|
2515
|
+
groupBy !== "none" && /* @__PURE__ */ jsx16("div", { className: "px-3 py-2 text-xs font-semibold text-gray-500 uppercase", children: group }),
|
|
2516
|
+
groupThreads.map((thread) => /* @__PURE__ */ jsx16(
|
|
2193
2517
|
ThreadItem,
|
|
2194
2518
|
{
|
|
2195
2519
|
thread,
|
|
@@ -2200,9 +2524,9 @@ function ThreadList({
|
|
|
2200
2524
|
thread.id
|
|
2201
2525
|
))
|
|
2202
2526
|
] }, group)),
|
|
2203
|
-
filteredThreads.length === 0 && /* @__PURE__ */
|
|
2204
|
-
/* @__PURE__ */
|
|
2205
|
-
/* @__PURE__ */
|
|
2527
|
+
filteredThreads.length === 0 && /* @__PURE__ */ jsxs14("div", { className: "p-8 text-center text-gray-500", children: [
|
|
2528
|
+
/* @__PURE__ */ jsx16("div", { className: "text-4xl mb-2", children: "\u{1F4AC}" }),
|
|
2529
|
+
/* @__PURE__ */ jsx16("p", { children: "No conversations found" })
|
|
2206
2530
|
] })
|
|
2207
2531
|
] })
|
|
2208
2532
|
] });
|
|
@@ -2234,7 +2558,7 @@ function groupThreadsByDate(threads) {
|
|
|
2234
2558
|
}
|
|
2235
2559
|
|
|
2236
2560
|
// src/components/Threads/Threads.tsx
|
|
2237
|
-
import { jsx as
|
|
2561
|
+
import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
2238
2562
|
function Threads({
|
|
2239
2563
|
threads,
|
|
2240
2564
|
currentThreadId,
|
|
@@ -2253,8 +2577,8 @@ function Threads({
|
|
|
2253
2577
|
tabs: "flex gap-2 border-b border-gray-200 dark:border-gray-700 overflow-x-auto"
|
|
2254
2578
|
};
|
|
2255
2579
|
if (variant === "tabs") {
|
|
2256
|
-
return /* @__PURE__ */
|
|
2257
|
-
threads.slice(0, 5).map((thread) => /* @__PURE__ */
|
|
2580
|
+
return /* @__PURE__ */ jsxs15("div", { className: cn(variantClasses[variant], className), children: [
|
|
2581
|
+
threads.slice(0, 5).map((thread) => /* @__PURE__ */ jsx17(
|
|
2258
2582
|
"button",
|
|
2259
2583
|
{
|
|
2260
2584
|
onClick: () => onThreadSelect?.(thread.id),
|
|
@@ -2266,7 +2590,7 @@ function Threads({
|
|
|
2266
2590
|
},
|
|
2267
2591
|
thread.id
|
|
2268
2592
|
)),
|
|
2269
|
-
showNewButton && onNewThread && /* @__PURE__ */
|
|
2593
|
+
showNewButton && onNewThread && /* @__PURE__ */ jsx17(
|
|
2270
2594
|
"button",
|
|
2271
2595
|
{
|
|
2272
2596
|
onClick: onNewThread,
|
|
@@ -2276,8 +2600,8 @@ function Threads({
|
|
|
2276
2600
|
)
|
|
2277
2601
|
] });
|
|
2278
2602
|
}
|
|
2279
|
-
return /* @__PURE__ */
|
|
2280
|
-
showNewButton && onNewThread && /* @__PURE__ */
|
|
2603
|
+
return /* @__PURE__ */ jsxs15("div", { className: cn(variantClasses[variant], "flex flex-col", className), children: [
|
|
2604
|
+
showNewButton && onNewThread && /* @__PURE__ */ jsx17("div", { className: "p-3 border-b border-gray-200 dark:border-gray-700", children: /* @__PURE__ */ jsx17(
|
|
2281
2605
|
"button",
|
|
2282
2606
|
{
|
|
2283
2607
|
onClick: onNewThread,
|
|
@@ -2285,7 +2609,7 @@ function Threads({
|
|
|
2285
2609
|
children: "+ New Conversation"
|
|
2286
2610
|
}
|
|
2287
2611
|
) }),
|
|
2288
|
-
/* @__PURE__ */
|
|
2612
|
+
/* @__PURE__ */ jsx17(
|
|
2289
2613
|
ThreadList,
|
|
2290
2614
|
{
|
|
2291
2615
|
threads,
|