@malette/agent-sdk 0.1.3-beta.5 → 0.1.3-beta.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +1485 -665
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +913 -95
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -4,11 +4,11 @@ var Cookies2 = require('js-cookie');
|
|
|
4
4
|
var OSS = require('ali-oss');
|
|
5
5
|
var zustand = require('zustand');
|
|
6
6
|
var middleware = require('zustand/middleware');
|
|
7
|
-
var
|
|
7
|
+
var React16 = require('react');
|
|
8
8
|
var lucideReact = require('lucide-react');
|
|
9
9
|
var ReactMarkdown = require('react-markdown');
|
|
10
10
|
var jsxRuntime = require('react/jsx-runtime');
|
|
11
|
-
require('react-dom');
|
|
11
|
+
var ReactDOM = require('react-dom');
|
|
12
12
|
var shallow = require('zustand/react/shallow');
|
|
13
13
|
var DialogPrimitive = require('@radix-ui/react-dialog');
|
|
14
14
|
var reactSlot = require('@radix-ui/react-slot');
|
|
@@ -37,8 +37,9 @@ function _interopNamespace(e) {
|
|
|
37
37
|
|
|
38
38
|
var Cookies2__default = /*#__PURE__*/_interopDefault(Cookies2);
|
|
39
39
|
var OSS__default = /*#__PURE__*/_interopDefault(OSS);
|
|
40
|
-
var
|
|
40
|
+
var React16__namespace = /*#__PURE__*/_interopNamespace(React16);
|
|
41
41
|
var ReactMarkdown__default = /*#__PURE__*/_interopDefault(ReactMarkdown);
|
|
42
|
+
var ReactDOM__default = /*#__PURE__*/_interopDefault(ReactDOM);
|
|
42
43
|
var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
|
|
43
44
|
var ScrollAreaPrimitive__namespace = /*#__PURE__*/_interopNamespace(ScrollAreaPrimitive);
|
|
44
45
|
|
|
@@ -1053,6 +1054,7 @@ var useAgentStore = zustand.create()(
|
|
|
1053
1054
|
tools: [],
|
|
1054
1055
|
skills: [],
|
|
1055
1056
|
subAgentConfigs: [],
|
|
1057
|
+
mainAgentPublicId: "",
|
|
1056
1058
|
mainAgentName: "",
|
|
1057
1059
|
artifacts: {},
|
|
1058
1060
|
artifactOrder: [],
|
|
@@ -1063,6 +1065,7 @@ var useAgentStore = zustand.create()(
|
|
|
1063
1065
|
setSkills: (skills) => set({ skills }, false, "setSkills"),
|
|
1064
1066
|
setShowItemTime: (showItemTime) => set({ showItemTime }, false, "setShowItemTime"),
|
|
1065
1067
|
setSubAgentConfigs: (subAgentConfigs) => set({ subAgentConfigs }, false, "setSubAgentConfigs"),
|
|
1068
|
+
setMainAgentPublicId: (mainAgentPublicId) => set({ mainAgentPublicId }, false, "setMainAgentPublicId"),
|
|
1066
1069
|
setMainAgentName: (mainAgentName) => set({ mainAgentName }, false, "setMainAgentName"),
|
|
1067
1070
|
setMainAgentIcon: (mainAgentIcon) => set({ mainAgentIcon }, false, "setMainAgentIcon"),
|
|
1068
1071
|
addSession: (session) => set(
|
|
@@ -5208,7 +5211,7 @@ function remarkGfm(options) {
|
|
|
5208
5211
|
toMarkdownExtensions.push(gfmToMarkdown(settings));
|
|
5209
5212
|
}
|
|
5210
5213
|
|
|
5211
|
-
// node_modules/clsx/dist/clsx.mjs
|
|
5214
|
+
// ../../node_modules/clsx/dist/clsx.mjs
|
|
5212
5215
|
function r(e) {
|
|
5213
5216
|
var t, f, n = "";
|
|
5214
5217
|
if ("string" == typeof e || "number" == typeof e) n += e;
|
|
@@ -7759,7 +7762,7 @@ var resolveAssetForDisplay = async (asset, config) => {
|
|
|
7759
7762
|
}
|
|
7760
7763
|
return null;
|
|
7761
7764
|
};
|
|
7762
|
-
var ComponentContext =
|
|
7765
|
+
var ComponentContext = React16.createContext(void 0);
|
|
7763
7766
|
var ComponentProvider = ({
|
|
7764
7767
|
components = {},
|
|
7765
7768
|
children
|
|
@@ -7767,7 +7770,7 @@ var ComponentProvider = ({
|
|
|
7767
7770
|
return /* @__PURE__ */ jsxRuntime.jsx(ComponentContext.Provider, { value: components, children });
|
|
7768
7771
|
};
|
|
7769
7772
|
var useComponents = () => {
|
|
7770
|
-
const context =
|
|
7773
|
+
const context = React16.useContext(ComponentContext);
|
|
7771
7774
|
if (!context) {
|
|
7772
7775
|
return {};
|
|
7773
7776
|
}
|
|
@@ -7778,14 +7781,14 @@ function useComponent(componentName) {
|
|
|
7778
7781
|
return components[componentName];
|
|
7779
7782
|
}
|
|
7780
7783
|
var imageLoadedCache = /* @__PURE__ */ new Map();
|
|
7781
|
-
var MessageImageInternal =
|
|
7784
|
+
var MessageImageInternal = React16.memo(function MessageImageInternal2({ src, alt, className }) {
|
|
7782
7785
|
const cachedStatus = imageLoadedCache.get(src);
|
|
7783
|
-
const [loaded, setLoaded] =
|
|
7784
|
-
const [error, setError] =
|
|
7785
|
-
const imgRef =
|
|
7786
|
-
const [previewUrl, setPreviewUrl] =
|
|
7786
|
+
const [loaded, setLoaded] = React16.useState(cachedStatus === "loaded");
|
|
7787
|
+
const [error, setError] = React16.useState(cachedStatus === "error");
|
|
7788
|
+
const imgRef = React16__namespace.default.useRef(null);
|
|
7789
|
+
const [previewUrl, setPreviewUrl] = React16.useState(null);
|
|
7787
7790
|
const ImagePreviewComp = useComponent("ImagePreview") || ImagePreviewInternal;
|
|
7788
|
-
|
|
7791
|
+
React16.useEffect(() => {
|
|
7789
7792
|
const status = imageLoadedCache.get(src);
|
|
7790
7793
|
if (status === "loaded") {
|
|
7791
7794
|
setLoaded(true);
|
|
@@ -7799,7 +7802,7 @@ var MessageImageInternal = React24.memo(function MessageImageInternal2({ src, al
|
|
|
7799
7802
|
setError(false);
|
|
7800
7803
|
}
|
|
7801
7804
|
}, [src]);
|
|
7802
|
-
|
|
7805
|
+
React16.useEffect(() => {
|
|
7803
7806
|
const img = imgRef.current;
|
|
7804
7807
|
if (!img) return;
|
|
7805
7808
|
if (img.complete && img.naturalWidth > 0) {
|
|
@@ -7849,20 +7852,20 @@ var MessageImageInternal = React24.memo(function MessageImageInternal2({ src, al
|
|
|
7849
7852
|
)
|
|
7850
7853
|
] });
|
|
7851
7854
|
});
|
|
7852
|
-
var MessageVideoInternal =
|
|
7853
|
-
const videoRef =
|
|
7854
|
-
const canvasRef =
|
|
7855
|
-
const [posterUrl, setPosterUrl] =
|
|
7856
|
-
const [isHovering, setIsHovering] =
|
|
7857
|
-
const [isPlaying, setIsPlaying] =
|
|
7858
|
-
const [isMuted, setIsMuted] =
|
|
7859
|
-
const [duration, setDuration] =
|
|
7860
|
-
const [currentTime, setCurrentTime] =
|
|
7861
|
-
const [isFullPlaying, setIsFullPlaying] =
|
|
7862
|
-
const hoverTimerRef =
|
|
7855
|
+
var MessageVideoInternal = React16.memo(function MessageVideoInternal2({ src, className }) {
|
|
7856
|
+
const videoRef = React16__namespace.default.useRef(null);
|
|
7857
|
+
const canvasRef = React16__namespace.default.useRef(null);
|
|
7858
|
+
const [posterUrl, setPosterUrl] = React16.useState(null);
|
|
7859
|
+
const [isHovering, setIsHovering] = React16.useState(false);
|
|
7860
|
+
const [isPlaying, setIsPlaying] = React16.useState(false);
|
|
7861
|
+
const [isMuted, setIsMuted] = React16.useState(true);
|
|
7862
|
+
const [duration, setDuration] = React16.useState(0);
|
|
7863
|
+
const [currentTime, setCurrentTime] = React16.useState(0);
|
|
7864
|
+
const [isFullPlaying, setIsFullPlaying] = React16.useState(false);
|
|
7865
|
+
const hoverTimerRef = React16__namespace.default.useRef(null);
|
|
7863
7866
|
const VideoPreviewComp = useComponent("VideoPreview") || VideoPreviewInternal;
|
|
7864
|
-
const [showPreview, setShowPreview] =
|
|
7865
|
-
|
|
7867
|
+
const [showPreview, setShowPreview] = React16.useState(false);
|
|
7868
|
+
React16.useEffect(() => {
|
|
7866
7869
|
const video = document.createElement("video");
|
|
7867
7870
|
video.crossOrigin = "anonymous";
|
|
7868
7871
|
video.preload = "metadata";
|
|
@@ -8119,12 +8122,12 @@ var MessageVideoInternal = React24.memo(function MessageVideoInternal2({ src, cl
|
|
|
8119
8122
|
)
|
|
8120
8123
|
] });
|
|
8121
8124
|
});
|
|
8122
|
-
var ImagePreviewInternal =
|
|
8125
|
+
var ImagePreviewInternal = React16.memo(function ImagePreviewInternal2({
|
|
8123
8126
|
src,
|
|
8124
8127
|
alt,
|
|
8125
8128
|
onClose
|
|
8126
8129
|
}) {
|
|
8127
|
-
|
|
8130
|
+
React16.useEffect(() => {
|
|
8128
8131
|
const handleKeyDown = (e) => {
|
|
8129
8132
|
if (e.key === "Escape") {
|
|
8130
8133
|
onClose();
|
|
@@ -8177,11 +8180,11 @@ var ImagePreviewInternal = React24.memo(function ImagePreviewInternal2({
|
|
|
8177
8180
|
}
|
|
8178
8181
|
);
|
|
8179
8182
|
});
|
|
8180
|
-
var VideoPreviewInternal =
|
|
8183
|
+
var VideoPreviewInternal = React16.memo(function VideoPreviewInternal2({
|
|
8181
8184
|
src,
|
|
8182
8185
|
onClose
|
|
8183
8186
|
}) {
|
|
8184
|
-
|
|
8187
|
+
React16.useEffect(() => {
|
|
8185
8188
|
const handleKeyDown = (e) => {
|
|
8186
8189
|
if (e.key === "Escape") {
|
|
8187
8190
|
onClose();
|
|
@@ -8218,7 +8221,7 @@ var VideoPreviewInternal = React24.memo(function VideoPreviewInternal2({
|
|
|
8218
8221
|
);
|
|
8219
8222
|
});
|
|
8220
8223
|
var mediaResolveCache = /* @__PURE__ */ new Map();
|
|
8221
|
-
var ResolvedMarkdownMedia =
|
|
8224
|
+
var ResolvedMarkdownMedia = React16.memo(function ResolvedMarkdownMedia2({
|
|
8222
8225
|
src,
|
|
8223
8226
|
alt,
|
|
8224
8227
|
skipImages,
|
|
@@ -8226,8 +8229,8 @@ var ResolvedMarkdownMedia = React24.memo(function ResolvedMarkdownMedia2({
|
|
|
8226
8229
|
}) {
|
|
8227
8230
|
const cacheKey = src || "";
|
|
8228
8231
|
const cachedMedia = mediaResolveCache.get(cacheKey);
|
|
8229
|
-
const [media, setMedia] =
|
|
8230
|
-
|
|
8232
|
+
const [media, setMedia] = React16.useState(cachedMedia ?? null);
|
|
8233
|
+
React16.useEffect(() => {
|
|
8231
8234
|
let active = true;
|
|
8232
8235
|
const load = async () => {
|
|
8233
8236
|
if (!src) {
|
|
@@ -8465,8 +8468,8 @@ function getToolCallStatus(tc) {
|
|
|
8465
8468
|
if (tc.error) return "failed";
|
|
8466
8469
|
return "success";
|
|
8467
8470
|
}
|
|
8468
|
-
var CodeBlock =
|
|
8469
|
-
const [copied, setCopied] =
|
|
8471
|
+
var CodeBlock = React16.memo(function CodeBlock2({ children, className }) {
|
|
8472
|
+
const [copied, setCopied] = React16.useState(false);
|
|
8470
8473
|
const language = className?.replace("language-", "") || "text";
|
|
8471
8474
|
const handleCopy = async () => {
|
|
8472
8475
|
await navigator.clipboard.writeText(children);
|
|
@@ -8491,7 +8494,7 @@ var CodeBlock = React24.memo(function CodeBlock2({ children, className }) {
|
|
|
8491
8494
|
/* @__PURE__ */ jsxRuntime.jsx("pre", { className: "p-4 overflow-x-auto text-sm whitespace-pre-wrap break-all", children: /* @__PURE__ */ jsxRuntime.jsx("code", { className: `${className} text-zinc-300`, children }) })
|
|
8492
8495
|
] });
|
|
8493
8496
|
});
|
|
8494
|
-
var MarkdownContent =
|
|
8497
|
+
var MarkdownContent = React16.memo(function MarkdownContent2({ content, skipImages = false, config, variant = "default" }) {
|
|
8495
8498
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
8496
8499
|
ReactMarkdown__default.default,
|
|
8497
8500
|
{
|
|
@@ -8705,17 +8708,17 @@ var contentTypeConfig = {
|
|
|
8705
8708
|
bgColor: "bg-zinc-500/10"
|
|
8706
8709
|
}
|
|
8707
8710
|
};
|
|
8708
|
-
var ContentPreviewCard =
|
|
8711
|
+
var ContentPreviewCard = React16.memo(function ContentPreviewCard2({
|
|
8709
8712
|
parsed,
|
|
8710
8713
|
index = 0,
|
|
8711
8714
|
config,
|
|
8712
8715
|
onOpenArtifact
|
|
8713
8716
|
}) {
|
|
8714
|
-
const [isModalOpen, setIsModalOpen] =
|
|
8715
|
-
const [copied, setCopied] =
|
|
8717
|
+
const [isModalOpen, setIsModalOpen] = React16.useState(false);
|
|
8718
|
+
const [copied, setCopied] = React16.useState(false);
|
|
8716
8719
|
const typeConfig = contentTypeConfig[parsed.type];
|
|
8717
8720
|
const Icon = typeConfig.icon;
|
|
8718
|
-
const handleCopy =
|
|
8721
|
+
const handleCopy = React16.useCallback(async (e) => {
|
|
8719
8722
|
e.stopPropagation();
|
|
8720
8723
|
try {
|
|
8721
8724
|
await navigator.clipboard.writeText(parsed.content);
|
|
@@ -8724,7 +8727,7 @@ var ContentPreviewCard = React24.memo(function ContentPreviewCard2({
|
|
|
8724
8727
|
} catch {
|
|
8725
8728
|
}
|
|
8726
8729
|
}, [parsed.content]);
|
|
8727
|
-
const handleOpenPreview =
|
|
8730
|
+
const handleOpenPreview = React16.useCallback(() => {
|
|
8728
8731
|
console.log("[ContentPreviewCard] Open preview:", onOpenArtifact);
|
|
8729
8732
|
if (onOpenArtifact) {
|
|
8730
8733
|
onOpenArtifact({
|
|
@@ -8737,10 +8740,10 @@ var ContentPreviewCard = React24.memo(function ContentPreviewCard2({
|
|
|
8737
8740
|
setIsModalOpen(true);
|
|
8738
8741
|
}
|
|
8739
8742
|
}, [onOpenArtifact, parsed]);
|
|
8740
|
-
const handleCloseModal =
|
|
8743
|
+
const handleCloseModal = React16.useCallback(() => {
|
|
8741
8744
|
setIsModalOpen(false);
|
|
8742
8745
|
}, []);
|
|
8743
|
-
const preview =
|
|
8746
|
+
const preview = React16.useMemo(() => {
|
|
8744
8747
|
const content = parsed.content;
|
|
8745
8748
|
if (parsed.type === "html") {
|
|
8746
8749
|
const title = parsed.title || "HTML Document";
|
|
@@ -8848,15 +8851,15 @@ var ContentPreviewCard = React24.memo(function ContentPreviewCard2({
|
|
|
8848
8851
|
)
|
|
8849
8852
|
] });
|
|
8850
8853
|
});
|
|
8851
|
-
var ContentPreviewModal =
|
|
8854
|
+
var ContentPreviewModal = React16.memo(function ContentPreviewModal2({
|
|
8852
8855
|
parsed,
|
|
8853
8856
|
onClose,
|
|
8854
8857
|
config
|
|
8855
8858
|
}) {
|
|
8856
|
-
const [viewMode, setViewMode] =
|
|
8857
|
-
const [copied, setCopied] =
|
|
8859
|
+
const [viewMode, setViewMode] = React16.useState("preview");
|
|
8860
|
+
const [copied, setCopied] = React16.useState(false);
|
|
8858
8861
|
const typeConfig = contentTypeConfig[parsed.type];
|
|
8859
|
-
const handleCopy =
|
|
8862
|
+
const handleCopy = React16.useCallback(async () => {
|
|
8860
8863
|
try {
|
|
8861
8864
|
await navigator.clipboard.writeText(parsed.content);
|
|
8862
8865
|
setCopied(true);
|
|
@@ -8864,13 +8867,13 @@ var ContentPreviewModal = React24.memo(function ContentPreviewModal2({
|
|
|
8864
8867
|
} catch {
|
|
8865
8868
|
}
|
|
8866
8869
|
}, [parsed.content]);
|
|
8867
|
-
|
|
8870
|
+
React16__namespace.default.useEffect(() => {
|
|
8868
8871
|
document.body.style.overflow = "hidden";
|
|
8869
8872
|
return () => {
|
|
8870
8873
|
document.body.style.overflow = "";
|
|
8871
8874
|
};
|
|
8872
8875
|
}, []);
|
|
8873
|
-
|
|
8876
|
+
React16__namespace.default.useEffect(() => {
|
|
8874
8877
|
const handleKeyDown = (e) => {
|
|
8875
8878
|
if (e.key === "Escape") {
|
|
8876
8879
|
onClose();
|
|
@@ -8956,7 +8959,7 @@ var ContentPreviewModal = React24.memo(function ContentPreviewModal2({
|
|
|
8956
8959
|
}
|
|
8957
8960
|
);
|
|
8958
8961
|
});
|
|
8959
|
-
var ContentPreviewRenderer =
|
|
8962
|
+
var ContentPreviewRenderer = React16.memo(function ContentPreviewRenderer2({
|
|
8960
8963
|
parsed,
|
|
8961
8964
|
config
|
|
8962
8965
|
}) {
|
|
@@ -8968,14 +8971,14 @@ var ContentPreviewRenderer = React24.memo(function ContentPreviewRenderer2({
|
|
|
8968
8971
|
}
|
|
8969
8972
|
return /* @__PURE__ */ jsxRuntime.jsx(SourceCodeViewer, { content: parsed.content, language: parsed.language || parsed.type });
|
|
8970
8973
|
});
|
|
8971
|
-
var HtmlPreview =
|
|
8972
|
-
const iframeRef =
|
|
8973
|
-
const [scale, setScale] =
|
|
8974
|
-
const blobUrl =
|
|
8974
|
+
var HtmlPreview = React16.memo(function HtmlPreview2({ content }) {
|
|
8975
|
+
const iframeRef = React16__namespace.default.useRef(null);
|
|
8976
|
+
const [scale, setScale] = React16.useState(0.5);
|
|
8977
|
+
const blobUrl = React16.useMemo(() => {
|
|
8975
8978
|
const blob = new Blob([content], { type: "text/html" });
|
|
8976
8979
|
return URL.createObjectURL(blob);
|
|
8977
8980
|
}, [content]);
|
|
8978
|
-
|
|
8981
|
+
React16__namespace.default.useEffect(() => {
|
|
8979
8982
|
return () => {
|
|
8980
8983
|
URL.revokeObjectURL(blobUrl);
|
|
8981
8984
|
};
|
|
@@ -9037,7 +9040,7 @@ var HtmlPreview = React24.memo(function HtmlPreview2({ content }) {
|
|
|
9037
9040
|
) })
|
|
9038
9041
|
] });
|
|
9039
9042
|
});
|
|
9040
|
-
var SourceCodeViewer =
|
|
9043
|
+
var SourceCodeViewer = React16.memo(function SourceCodeViewer2({
|
|
9041
9044
|
content,
|
|
9042
9045
|
language
|
|
9043
9046
|
}) {
|
|
@@ -9047,12 +9050,12 @@ var SourceCodeViewer = React24.memo(function SourceCodeViewer2({
|
|
|
9047
9050
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-300 whitespace-pre-wrap break-all", children: line || " " })
|
|
9048
9051
|
] }, i)) }) }) });
|
|
9049
9052
|
});
|
|
9050
|
-
|
|
9053
|
+
React16.memo(function CustomResponseRenderer2({
|
|
9051
9054
|
result,
|
|
9052
9055
|
config,
|
|
9053
9056
|
onOpenArtifact
|
|
9054
9057
|
}) {
|
|
9055
|
-
const parsedContents =
|
|
9058
|
+
const parsedContents = React16.useMemo(() => extractCustomResponses(result), [result]);
|
|
9056
9059
|
if (parsedContents.length === 0) {
|
|
9057
9060
|
return null;
|
|
9058
9061
|
}
|
|
@@ -10150,15 +10153,15 @@ async function fetchBackendExtraData(localMessageId, backendMessageId, updateMes
|
|
|
10150
10153
|
}
|
|
10151
10154
|
}
|
|
10152
10155
|
function useSSE(options) {
|
|
10153
|
-
const abortControllerRef =
|
|
10154
|
-
const currentMessageIdRef =
|
|
10155
|
-
const [isConnected, setIsConnected] =
|
|
10156
|
-
const heartbeatTimeoutRef =
|
|
10157
|
-
const reconnectAttemptsRef =
|
|
10158
|
-
const lastActivityTimeRef =
|
|
10159
|
-
const isReconnectingRef =
|
|
10160
|
-
const currentSessionIdRef =
|
|
10161
|
-
const currentLocalMessageIdRef =
|
|
10156
|
+
const abortControllerRef = React16.useRef(null);
|
|
10157
|
+
const currentMessageIdRef = React16.useRef(null);
|
|
10158
|
+
const [isConnected, setIsConnected] = React16.useState(false);
|
|
10159
|
+
const heartbeatTimeoutRef = React16.useRef(null);
|
|
10160
|
+
const reconnectAttemptsRef = React16.useRef(0);
|
|
10161
|
+
const lastActivityTimeRef = React16.useRef(Date.now());
|
|
10162
|
+
const isReconnectingRef = React16.useRef(false);
|
|
10163
|
+
const currentSessionIdRef = React16.useRef(null);
|
|
10164
|
+
const currentLocalMessageIdRef = React16.useRef(null);
|
|
10162
10165
|
const {
|
|
10163
10166
|
addMessage,
|
|
10164
10167
|
updateMessage,
|
|
@@ -10196,13 +10199,13 @@ function useSSE(options) {
|
|
|
10196
10199
|
setOrchestrating,
|
|
10197
10200
|
clearMultiAgentState
|
|
10198
10201
|
} = useAgentStore();
|
|
10199
|
-
const clearHeartbeatTimeout =
|
|
10202
|
+
const clearHeartbeatTimeout = React16.useCallback(() => {
|
|
10200
10203
|
if (heartbeatTimeoutRef.current) {
|
|
10201
10204
|
clearTimeout(heartbeatTimeoutRef.current);
|
|
10202
10205
|
heartbeatTimeoutRef.current = null;
|
|
10203
10206
|
}
|
|
10204
10207
|
}, []);
|
|
10205
|
-
const resetHeartbeatTimeout =
|
|
10208
|
+
const resetHeartbeatTimeout = React16.useCallback((onTimeout) => {
|
|
10206
10209
|
lastActivityTimeRef.current = Date.now();
|
|
10207
10210
|
clearHeartbeatTimeout();
|
|
10208
10211
|
heartbeatTimeoutRef.current = setTimeout(() => {
|
|
@@ -10210,17 +10213,17 @@ function useSSE(options) {
|
|
|
10210
10213
|
onTimeout();
|
|
10211
10214
|
}, SSE_HEARTBEAT_TIMEOUT);
|
|
10212
10215
|
}, [clearHeartbeatTimeout]);
|
|
10213
|
-
const getReconnectDelay =
|
|
10216
|
+
const getReconnectDelay = React16.useCallback(() => {
|
|
10214
10217
|
const attempt = reconnectAttemptsRef.current;
|
|
10215
10218
|
const delay = RECONNECT_BASE_DELAY * Math.pow(2, attempt);
|
|
10216
10219
|
return Math.min(delay, 8e3);
|
|
10217
10220
|
}, []);
|
|
10218
|
-
|
|
10221
|
+
React16.useEffect(() => {
|
|
10219
10222
|
return () => {
|
|
10220
10223
|
clearHeartbeatTimeout();
|
|
10221
10224
|
};
|
|
10222
10225
|
}, [clearHeartbeatTimeout]);
|
|
10223
|
-
const handleFinalEvent =
|
|
10226
|
+
const handleFinalEvent = React16.useCallback(async (data, localMessageId) => {
|
|
10224
10227
|
setIsStreaming(false);
|
|
10225
10228
|
setIsThinking(false);
|
|
10226
10229
|
clearStreamingContent();
|
|
@@ -10299,7 +10302,7 @@ function useSSE(options) {
|
|
|
10299
10302
|
upsertArtifact,
|
|
10300
10303
|
options
|
|
10301
10304
|
]);
|
|
10302
|
-
const persistPartialExtraData =
|
|
10305
|
+
const persistPartialExtraData = React16.useCallback((localMessageId) => {
|
|
10303
10306
|
const state = useAgentStore.getState();
|
|
10304
10307
|
const currentThoughts = state.chatUI.currentThoughts;
|
|
10305
10308
|
const pendingToolCalls = state.chatUI.pendingToolCalls;
|
|
@@ -10316,13 +10319,13 @@ function useSSE(options) {
|
|
|
10316
10319
|
}
|
|
10317
10320
|
});
|
|
10318
10321
|
}, [updateMessage]);
|
|
10319
|
-
const normalizeToolCalls2 =
|
|
10322
|
+
const normalizeToolCalls2 = React16.useCallback((toolCalls) => {
|
|
10320
10323
|
return normalizeToolCallsData(toolCalls, generateId);
|
|
10321
10324
|
}, []);
|
|
10322
|
-
const buildTerminalExtraData =
|
|
10325
|
+
const buildTerminalExtraData = React16.useCallback((toolCallStatus) => {
|
|
10323
10326
|
return buildTerminalExtraDataFromState(useAgentStore.getState(), toolCallStatus);
|
|
10324
10327
|
}, []);
|
|
10325
|
-
const handlePlanEvent =
|
|
10328
|
+
const handlePlanEvent = React16.useCallback(createPlanEventHandler({
|
|
10326
10329
|
setIsThinking,
|
|
10327
10330
|
setIsStreaming,
|
|
10328
10331
|
appendStreamingContent,
|
|
@@ -10348,7 +10351,7 @@ function useSSE(options) {
|
|
|
10348
10351
|
clearPlanState,
|
|
10349
10352
|
options
|
|
10350
10353
|
]);
|
|
10351
|
-
const handleThoughtEvent =
|
|
10354
|
+
const handleThoughtEvent = React16.useCallback(createThoughtEventHandler({
|
|
10352
10355
|
onThought: options?.onThought,
|
|
10353
10356
|
onFrontendToolCall: options?.onFrontendToolCall,
|
|
10354
10357
|
onComponentPending: options?.onComponentPending,
|
|
@@ -10419,7 +10422,7 @@ function useSSE(options) {
|
|
|
10419
10422
|
handleFinalEvent,
|
|
10420
10423
|
handlePlanEvent
|
|
10421
10424
|
]);
|
|
10422
|
-
const processSSEStream =
|
|
10425
|
+
const processSSEStream = React16.useCallback(async (response, localMessageId, onMessageStart) => {
|
|
10423
10426
|
const reader = response.body?.getReader();
|
|
10424
10427
|
const decoder = new TextDecoder();
|
|
10425
10428
|
let buffer = "";
|
|
@@ -10523,7 +10526,7 @@ function useSSE(options) {
|
|
|
10523
10526
|
}
|
|
10524
10527
|
}
|
|
10525
10528
|
}, [handleThoughtEvent, resetHeartbeatTimeout, clearHeartbeatTimeout, getReconnectDelay, setChatError]);
|
|
10526
|
-
const sendMessage =
|
|
10529
|
+
const sendMessage = React16.useCallback(async (sessionId, content, sendOptions) => {
|
|
10527
10530
|
abortControllerRef.current?.abort();
|
|
10528
10531
|
abortControllerRef.current = new AbortController();
|
|
10529
10532
|
clearThoughts();
|
|
@@ -10669,7 +10672,7 @@ function useSSE(options) {
|
|
|
10669
10672
|
options,
|
|
10670
10673
|
persistPartialExtraData
|
|
10671
10674
|
]);
|
|
10672
|
-
const reconnect =
|
|
10675
|
+
const reconnect = React16.useCallback(async (messageId) => {
|
|
10673
10676
|
abortControllerRef.current?.abort();
|
|
10674
10677
|
abortControllerRef.current = new AbortController();
|
|
10675
10678
|
clearThoughts();
|
|
@@ -10704,7 +10707,7 @@ function useSSE(options) {
|
|
|
10704
10707
|
currentMessageIdRef.current = null;
|
|
10705
10708
|
}
|
|
10706
10709
|
}, [clearThoughts, clearStreamingContent, clearPendingToolCalls, addPendingToolCall, setIsThinking, setIsStreaming, processSSEStream, options]);
|
|
10707
|
-
const abort =
|
|
10710
|
+
const abort = React16.useCallback(async () => {
|
|
10708
10711
|
clearHeartbeatTimeout();
|
|
10709
10712
|
reconnectAttemptsRef.current = 0;
|
|
10710
10713
|
isReconnectingRef.current = false;
|
|
@@ -10754,9 +10757,9 @@ function useCanvasBridge(options = {}) {
|
|
|
10754
10757
|
onArtifactSelected,
|
|
10755
10758
|
onArtifactContentChanged
|
|
10756
10759
|
} = options;
|
|
10757
|
-
const optionsRef =
|
|
10760
|
+
const optionsRef = React16.useRef(options);
|
|
10758
10761
|
optionsRef.current = options;
|
|
10759
|
-
const postToCanvas =
|
|
10762
|
+
const postToCanvas = React16.useCallback((type, payload) => {
|
|
10760
10763
|
const iframe = canvasIframeRef?.current;
|
|
10761
10764
|
if (!iframe?.contentWindow) {
|
|
10762
10765
|
console.warn("[CanvasBridge] Canvas iframe not available");
|
|
@@ -10773,7 +10776,7 @@ function useCanvasBridge(options = {}) {
|
|
|
10773
10776
|
iframe.contentWindow.postMessage(envelope, targetOrigin);
|
|
10774
10777
|
console.log("[CanvasBridge] Sent:", type, payload.artifactId || payload.artifact?.id);
|
|
10775
10778
|
}, [canvasIframeRef, targetOrigin]);
|
|
10776
|
-
|
|
10779
|
+
React16.useEffect(() => {
|
|
10777
10780
|
if (!enabled) return;
|
|
10778
10781
|
const handleMessage = (event) => {
|
|
10779
10782
|
if (targetOrigin !== "*" && event.origin !== targetOrigin) return;
|
|
@@ -10807,19 +10810,19 @@ function useCanvasBridge(options = {}) {
|
|
|
10807
10810
|
window.addEventListener("message", handleMessage);
|
|
10808
10811
|
return () => window.removeEventListener("message", handleMessage);
|
|
10809
10812
|
}, [enabled, targetOrigin]);
|
|
10810
|
-
const notifyArtifactCreated =
|
|
10813
|
+
const notifyArtifactCreated = React16.useCallback((artifact) => {
|
|
10811
10814
|
if (!enabled) return;
|
|
10812
10815
|
postToCanvas("artifact_created", { artifact });
|
|
10813
10816
|
}, [enabled, postToCanvas]);
|
|
10814
|
-
const notifyArtifactUpdated =
|
|
10817
|
+
const notifyArtifactUpdated = React16.useCallback((artifact) => {
|
|
10815
10818
|
if (!enabled) return;
|
|
10816
10819
|
postToCanvas("artifact_updated", { artifact });
|
|
10817
10820
|
}, [enabled, postToCanvas]);
|
|
10818
|
-
const notifyArtifactDeleted =
|
|
10821
|
+
const notifyArtifactDeleted = React16.useCallback((artifactId) => {
|
|
10819
10822
|
if (!enabled) return;
|
|
10820
10823
|
postToCanvas("artifact_deleted", { artifactId });
|
|
10821
10824
|
}, [enabled, postToCanvas]);
|
|
10822
|
-
const syncAllArtifacts =
|
|
10825
|
+
const syncAllArtifacts = React16.useCallback(() => {
|
|
10823
10826
|
if (!enabled) return;
|
|
10824
10827
|
const artifacts = Object.values(useAgentStore.getState().artifacts);
|
|
10825
10828
|
postToCanvas("artifacts_sync", { artifacts });
|
|
@@ -11655,12 +11658,12 @@ function highlightJson(content) {
|
|
|
11655
11658
|
}
|
|
11656
11659
|
return tokens;
|
|
11657
11660
|
}
|
|
11658
|
-
var StreamingJsonDisplay =
|
|
11661
|
+
var StreamingJsonDisplay = React16.memo(function StreamingJsonDisplay2({
|
|
11659
11662
|
content,
|
|
11660
11663
|
className
|
|
11661
11664
|
}) {
|
|
11662
|
-
const jsonContent =
|
|
11663
|
-
const formattedContent =
|
|
11665
|
+
const jsonContent = React16.useMemo(() => extractJsonContent(content), [content]);
|
|
11666
|
+
const formattedContent = React16.useMemo(() => {
|
|
11664
11667
|
try {
|
|
11665
11668
|
const parsed = JSON.parse(jsonContent);
|
|
11666
11669
|
return JSON.stringify(parsed, null, 2);
|
|
@@ -11668,7 +11671,7 @@ var StreamingJsonDisplay = React24.memo(function StreamingJsonDisplay2({
|
|
|
11668
11671
|
return formatPartialJson(jsonContent);
|
|
11669
11672
|
}
|
|
11670
11673
|
}, [jsonContent]);
|
|
11671
|
-
const highlightedTokens =
|
|
11674
|
+
const highlightedTokens = React16.useMemo(() => {
|
|
11672
11675
|
return highlightJson(formattedContent);
|
|
11673
11676
|
}, [formattedContent]);
|
|
11674
11677
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(
|
|
@@ -11784,7 +11787,7 @@ var collectMediaAssetsFromResult = (result) => {
|
|
|
11784
11787
|
}
|
|
11785
11788
|
return assets;
|
|
11786
11789
|
};
|
|
11787
|
-
var PlanMarkdownContent =
|
|
11790
|
+
var PlanMarkdownContent = React16.memo(function PlanMarkdownContent2({
|
|
11788
11791
|
content,
|
|
11789
11792
|
className = ""
|
|
11790
11793
|
}) {
|
|
@@ -11841,12 +11844,12 @@ var PlanMarkdownContent = React24.memo(function PlanMarkdownContent2({
|
|
|
11841
11844
|
}
|
|
11842
11845
|
) });
|
|
11843
11846
|
});
|
|
11844
|
-
var ImagePreviewModal =
|
|
11847
|
+
var ImagePreviewModal = React16.memo(function ImagePreviewModal2({
|
|
11845
11848
|
src,
|
|
11846
11849
|
onClose,
|
|
11847
11850
|
config
|
|
11848
11851
|
}) {
|
|
11849
|
-
|
|
11852
|
+
React16.useEffect(() => {
|
|
11850
11853
|
const handleKeyDown = (e) => {
|
|
11851
11854
|
if (e.key === "Escape") onClose();
|
|
11852
11855
|
};
|
|
@@ -11905,22 +11908,22 @@ var ImagePreviewModal = React24.memo(function ImagePreviewModal2({
|
|
|
11905
11908
|
}
|
|
11906
11909
|
);
|
|
11907
11910
|
});
|
|
11908
|
-
var StepResultRenderer =
|
|
11911
|
+
var StepResultRenderer = React16.memo(function StepResultRenderer2({
|
|
11909
11912
|
result,
|
|
11910
11913
|
stepType,
|
|
11911
11914
|
toolInput,
|
|
11912
11915
|
stepStatus,
|
|
11913
11916
|
config
|
|
11914
11917
|
}) {
|
|
11915
|
-
const [showDetails, setShowDetails] =
|
|
11916
|
-
const [showPlannedParams, setShowPlannedParams] =
|
|
11917
|
-
const [copied, setCopied] =
|
|
11918
|
-
const [previewImage, setPreviewImage] =
|
|
11919
|
-
const [imgLoaded, setImgLoaded] =
|
|
11920
|
-
const [imgError, setImgError] =
|
|
11921
|
-
const [media, setMedia] =
|
|
11922
|
-
const text3 =
|
|
11923
|
-
|
|
11918
|
+
const [showDetails, setShowDetails] = React16.useState(false);
|
|
11919
|
+
const [showPlannedParams, setShowPlannedParams] = React16.useState(false);
|
|
11920
|
+
const [copied, setCopied] = React16.useState(false);
|
|
11921
|
+
const [previewImage, setPreviewImage] = React16.useState(null);
|
|
11922
|
+
const [imgLoaded, setImgLoaded] = React16.useState({});
|
|
11923
|
+
const [imgError, setImgError] = React16.useState({});
|
|
11924
|
+
const [media, setMedia] = React16.useState([]);
|
|
11925
|
+
const text3 = React16.useMemo(() => extractTextContent(result), [result]);
|
|
11926
|
+
React16.useEffect(() => {
|
|
11924
11927
|
let active = true;
|
|
11925
11928
|
const loadMedia = async () => {
|
|
11926
11929
|
const assets = collectMediaAssetsFromResult(result);
|
|
@@ -11950,11 +11953,11 @@ var StepResultRenderer = React24.memo(function StepResultRenderer2({
|
|
|
11950
11953
|
}, [result, config]);
|
|
11951
11954
|
const isToolCall = stepType === "TOOL_CALL";
|
|
11952
11955
|
const isCompleted = stepStatus === "COMPLETED";
|
|
11953
|
-
const actualParams =
|
|
11956
|
+
const actualParams = React16.useMemo(() => {
|
|
11954
11957
|
if (!result || typeof result !== "object") return null;
|
|
11955
11958
|
return result.actualArguments || result.executedArguments || result.input || null;
|
|
11956
11959
|
}, [result]);
|
|
11957
|
-
const paramsChanged =
|
|
11960
|
+
const paramsChanged = React16.useMemo(() => {
|
|
11958
11961
|
if (!toolInput || !actualParams) return false;
|
|
11959
11962
|
return JSON.stringify(toolInput) !== JSON.stringify(actualParams);
|
|
11960
11963
|
}, [toolInput, actualParams]);
|
|
@@ -12088,7 +12091,7 @@ var StepResultRenderer = React24.memo(function StepResultRenderer2({
|
|
|
12088
12091
|
] })
|
|
12089
12092
|
] });
|
|
12090
12093
|
});
|
|
12091
|
-
var StepItem =
|
|
12094
|
+
var StepItem = React16.memo(function StepItem2({
|
|
12092
12095
|
step,
|
|
12093
12096
|
index,
|
|
12094
12097
|
isWaitingInput,
|
|
@@ -12096,8 +12099,8 @@ var StepItem = React24.memo(function StepItem2({
|
|
|
12096
12099
|
streamingContent,
|
|
12097
12100
|
onHumanInput
|
|
12098
12101
|
}) {
|
|
12099
|
-
const [inputValue, setInputValue] =
|
|
12100
|
-
const [submitting, setSubmitting] =
|
|
12102
|
+
const [inputValue, setInputValue] = React16.useState("");
|
|
12103
|
+
const [submitting, setSubmitting] = React16.useState(false);
|
|
12101
12104
|
const style = getStepStatusStyle(step.status);
|
|
12102
12105
|
const isRunning = step.status === "RUNNING" || isCurrentStep && step.status !== "COMPLETED" && step.status !== "FAILED";
|
|
12103
12106
|
const handleSubmit = async () => {
|
|
@@ -12107,7 +12110,7 @@ var StepItem = React24.memo(function StepItem2({
|
|
|
12107
12110
|
setSubmitting(false);
|
|
12108
12111
|
setInputValue("");
|
|
12109
12112
|
};
|
|
12110
|
-
const executionTime =
|
|
12113
|
+
const executionTime = React16.useMemo(() => {
|
|
12111
12114
|
const s = step;
|
|
12112
12115
|
if (s.startTime && s.endTime) {
|
|
12113
12116
|
const duration = s.endTime - s.startTime;
|
|
@@ -12205,7 +12208,7 @@ var StepItem = React24.memo(function StepItem2({
|
|
|
12205
12208
|
] }) })
|
|
12206
12209
|
] });
|
|
12207
12210
|
});
|
|
12208
|
-
var PlanCard =
|
|
12211
|
+
var PlanCard = React16.memo(function PlanCard2({
|
|
12209
12212
|
plan = {},
|
|
12210
12213
|
isProcessing = false,
|
|
12211
12214
|
waitingStepId,
|
|
@@ -12220,10 +12223,10 @@ var PlanCard = React24.memo(function PlanCard2({
|
|
|
12220
12223
|
onSkip,
|
|
12221
12224
|
onCancel
|
|
12222
12225
|
}) {
|
|
12223
|
-
const [expanded, setExpanded] =
|
|
12226
|
+
const [expanded, setExpanded] = React16.useState(true);
|
|
12224
12227
|
const rawSteps = Array.isArray(plan?.steps) ? plan?.steps : plan?.steps?.steps || [];
|
|
12225
12228
|
const validSteps = rawSteps.filter((step) => step && step.type && !("$ref" in step)) || [];
|
|
12226
|
-
|
|
12229
|
+
React16.useEffect(() => {
|
|
12227
12230
|
console.log("[PlanCard] ===== \u6570\u636E\u8BCA\u65AD =====");
|
|
12228
12231
|
console.log("[PlanCard] plan.status:", plan.status);
|
|
12229
12232
|
console.log("[PlanCard] \u540E\u7AEF completedSteps:", plan.completedSteps, "(\u6CE8\u610F: \u540E\u7AEF\u6709bug\uFF0C\u53EF\u80FD\u591A1)");
|
|
@@ -12239,7 +12242,7 @@ var PlanCard = React24.memo(function PlanCard2({
|
|
|
12239
12242
|
const isPaused = plan.status === "PAUSED";
|
|
12240
12243
|
const isCancelled = plan.status === "CANCELLED";
|
|
12241
12244
|
const hasError = isPaused && !!plan.errorMessage;
|
|
12242
|
-
|
|
12245
|
+
React16.useMemo(() => {
|
|
12243
12246
|
if (hasError) {
|
|
12244
12247
|
const failedIndex = plan.failedStepIndex;
|
|
12245
12248
|
if (failedIndex !== void 0 && failedIndex >= 0) {
|
|
@@ -12249,21 +12252,21 @@ var PlanCard = React24.memo(function PlanCard2({
|
|
|
12249
12252
|
}
|
|
12250
12253
|
return null;
|
|
12251
12254
|
}, [hasError, plan, validSteps]);
|
|
12252
|
-
const completedCount =
|
|
12255
|
+
const completedCount = React16.useMemo(() => {
|
|
12253
12256
|
const count = validSteps.filter((s) => {
|
|
12254
12257
|
const status = (s.status || "").toUpperCase();
|
|
12255
12258
|
return status === "COMPLETED" || status === "SUCCESS" || status === "DONE";
|
|
12256
12259
|
}).length;
|
|
12257
12260
|
return Math.min(count, validSteps.length);
|
|
12258
12261
|
}, [validSteps]);
|
|
12259
|
-
const allStepsCompleted =
|
|
12262
|
+
const allStepsCompleted = React16.useMemo(() => {
|
|
12260
12263
|
if (validSteps.length === 0) return false;
|
|
12261
12264
|
return validSteps.every((s) => {
|
|
12262
12265
|
const status = (s.status || "").toUpperCase();
|
|
12263
12266
|
return status === "COMPLETED" || status === "SKIPPED" || status === "SUCCESS" || status === "DONE";
|
|
12264
12267
|
});
|
|
12265
12268
|
}, [validSteps]);
|
|
12266
|
-
const waitingStep =
|
|
12269
|
+
const waitingStep = React16.useMemo(() => {
|
|
12267
12270
|
if (waitingStepId) {
|
|
12268
12271
|
return validSteps.find((s) => {
|
|
12269
12272
|
const stepId = s.publicId || s.id;
|
|
@@ -12275,7 +12278,7 @@ var PlanCard = React24.memo(function PlanCard2({
|
|
|
12275
12278
|
}
|
|
12276
12279
|
return null;
|
|
12277
12280
|
}, [waitingStepId, validSteps, isExecuting]);
|
|
12278
|
-
const isIntelligentSummary =
|
|
12281
|
+
const isIntelligentSummary = React16.useMemo(() => {
|
|
12279
12282
|
if (!plan.summary) return false;
|
|
12280
12283
|
return !isMechanicalSummary(plan.summary);
|
|
12281
12284
|
}, [plan.summary]);
|
|
@@ -12525,7 +12528,7 @@ function MessageTimeline({
|
|
|
12525
12528
|
renderParallel
|
|
12526
12529
|
}) {
|
|
12527
12530
|
if (!items || items.length === 0) return null;
|
|
12528
|
-
const thoughtItems =
|
|
12531
|
+
const thoughtItems = React16.useMemo(() => items.filter((item) => item.kind === "thought"), [items]);
|
|
12529
12532
|
let thoughtIndex = 0;
|
|
12530
12533
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: className || "mt-3 space-y-3 w-full", children: items.map((item) => {
|
|
12531
12534
|
if (item.kind === "thought") {
|
|
@@ -12659,7 +12662,7 @@ function getDisplayName(key) {
|
|
|
12659
12662
|
if (PARAM_NAMES[key]) return PARAM_NAMES[key];
|
|
12660
12663
|
return key.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/_/g, " ");
|
|
12661
12664
|
}
|
|
12662
|
-
var ParamRow =
|
|
12665
|
+
var ParamRow = React16.memo(function ParamRow2({
|
|
12663
12666
|
name,
|
|
12664
12667
|
value,
|
|
12665
12668
|
isExpanded,
|
|
@@ -12691,8 +12694,8 @@ var ParamRow = React24.memo(function ParamRow2({
|
|
|
12691
12694
|
] }) : value })
|
|
12692
12695
|
] });
|
|
12693
12696
|
});
|
|
12694
|
-
var JsonView =
|
|
12695
|
-
const [copied, setCopied] =
|
|
12697
|
+
var JsonView = React16.memo(function JsonView2({ data }) {
|
|
12698
|
+
const [copied, setCopied] = React16.useState(false);
|
|
12696
12699
|
const json = JSON.stringify(data, null, 2);
|
|
12697
12700
|
const handleCopy = async () => {
|
|
12698
12701
|
await navigator.clipboard.writeText(json);
|
|
@@ -12719,10 +12722,10 @@ function ParameterDisplay({
|
|
|
12719
12722
|
compact = false,
|
|
12720
12723
|
maxCompactItems = 3
|
|
12721
12724
|
}) {
|
|
12722
|
-
const [showJson, setShowJson] =
|
|
12723
|
-
const [expandedTech, setExpandedTech] =
|
|
12724
|
-
const [expandedValues, setExpandedValues] =
|
|
12725
|
-
const { mainParams, techParams } =
|
|
12725
|
+
const [showJson, setShowJson] = React16.useState(false);
|
|
12726
|
+
const [expandedTech, setExpandedTech] = React16.useState(defaultExpanded);
|
|
12727
|
+
const [expandedValues, setExpandedValues] = React16.useState(/* @__PURE__ */ new Set());
|
|
12728
|
+
const { mainParams, techParams } = React16.useMemo(() => {
|
|
12726
12729
|
if (!parameters || typeof parameters !== "object") {
|
|
12727
12730
|
return { mainParams: [], techParams: [] };
|
|
12728
12731
|
}
|
|
@@ -12839,7 +12842,7 @@ function ParameterDisplay({
|
|
|
12839
12842
|
}
|
|
12840
12843
|
function ToolConfirmCard({ toolCall, compact = false }) {
|
|
12841
12844
|
const { removePendingToolCall, updatePendingToolCall, updateMessage, messages, tools } = useAgentStore();
|
|
12842
|
-
const updateToolCallInMessage =
|
|
12845
|
+
const updateToolCallInMessage = React16.useCallback((toolCallId, newStatus) => {
|
|
12843
12846
|
const msg = messages.find((m) => {
|
|
12844
12847
|
const tcs = m.extraData?.tool_calls || [];
|
|
12845
12848
|
return tcs.some((tc) => tc.id === toolCallId);
|
|
@@ -12853,18 +12856,18 @@ function ToolConfirmCard({ toolCall, compact = false }) {
|
|
|
12853
12856
|
});
|
|
12854
12857
|
}
|
|
12855
12858
|
}, [messages, updateMessage]);
|
|
12856
|
-
const [expanded, setExpanded] =
|
|
12857
|
-
const [isEditing, setIsEditing] =
|
|
12858
|
-
const [editedArguments, setEditedArguments] =
|
|
12859
|
-
const [loading, setLoading] =
|
|
12860
|
-
const [error, setError] =
|
|
12861
|
-
const toolDisplayName =
|
|
12859
|
+
const [expanded, setExpanded] = React16.useState(false);
|
|
12860
|
+
const [isEditing, setIsEditing] = React16.useState(false);
|
|
12861
|
+
const [editedArguments, setEditedArguments] = React16.useState("");
|
|
12862
|
+
const [loading, setLoading] = React16.useState(null);
|
|
12863
|
+
const [error, setError] = React16.useState("");
|
|
12864
|
+
const toolDisplayName = React16.useMemo(() => {
|
|
12862
12865
|
const toolName = tools?.find((t) => t.name === toolCall.name)?.displayName;
|
|
12863
12866
|
if (toolName) return toolName;
|
|
12864
12867
|
if (toolCall.displayName) return toolCall.displayName;
|
|
12865
12868
|
return toolCall.name.replace(/^comfy_/, "").replace(/_/g, " ").replace(/\b\w/g, (l) => l.toUpperCase());
|
|
12866
12869
|
}, [toolCall]);
|
|
12867
|
-
const toolDescription =
|
|
12870
|
+
const toolDescription = React16.useMemo(() => {
|
|
12868
12871
|
return generateToolCallDescription(toolCall.name, toolCall.arguments || {});
|
|
12869
12872
|
}, [toolCall.name, toolCall.arguments]);
|
|
12870
12873
|
const hasParams = Object.keys(toolCall.arguments || {}).length > 0;
|
|
@@ -13099,8 +13102,8 @@ function ToolConfirmCard({ toolCall, compact = false }) {
|
|
|
13099
13102
|
] })
|
|
13100
13103
|
] });
|
|
13101
13104
|
}
|
|
13102
|
-
var JsonValue =
|
|
13103
|
-
const [collapsed, setCollapsed] =
|
|
13105
|
+
var JsonValue = React16.memo(function JsonValue2({ value, depth = 0, isLast = true }) {
|
|
13106
|
+
const [collapsed, setCollapsed] = React16.useState(depth > 1);
|
|
13104
13107
|
const indent2 = depth * 16;
|
|
13105
13108
|
if (value === null) {
|
|
13106
13109
|
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-500", children: "null" });
|
|
@@ -13228,13 +13231,13 @@ var JsonValue = React24.memo(function JsonValue2({ value, depth = 0, isLast = tr
|
|
|
13228
13231
|
}
|
|
13229
13232
|
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-400", children: String(value) });
|
|
13230
13233
|
});
|
|
13231
|
-
var ElegantJsonRenderer =
|
|
13234
|
+
var ElegantJsonRenderer = React16.memo(function ElegantJsonRenderer2({
|
|
13232
13235
|
data,
|
|
13233
13236
|
title,
|
|
13234
13237
|
defaultExpanded = false
|
|
13235
13238
|
}) {
|
|
13236
|
-
const [expanded, setExpanded] =
|
|
13237
|
-
const [copied, setCopied] =
|
|
13239
|
+
const [expanded, setExpanded] = React16.useState(defaultExpanded);
|
|
13240
|
+
const [copied, setCopied] = React16.useState(false);
|
|
13238
13241
|
const handleCopy = async (e) => {
|
|
13239
13242
|
e.stopPropagation();
|
|
13240
13243
|
try {
|
|
@@ -13281,15 +13284,15 @@ var ElegantJsonRenderer = React24.memo(function ElegantJsonRenderer2({
|
|
|
13281
13284
|
expanded && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-3 bg-zinc-900/30 text-xs font-mono overflow-x-auto max-h-80 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(JsonValue, { value: data, depth: 0 }) })
|
|
13282
13285
|
] });
|
|
13283
13286
|
});
|
|
13284
|
-
var ToolResultRenderer =
|
|
13287
|
+
var ToolResultRenderer = React16.memo(function ToolResultRenderer2({
|
|
13285
13288
|
result,
|
|
13286
13289
|
mediaUrls,
|
|
13287
13290
|
config,
|
|
13288
13291
|
toolCallData,
|
|
13289
13292
|
onOpenArtifact
|
|
13290
13293
|
}) {
|
|
13291
|
-
const [imgLoaded, setImgLoaded] =
|
|
13292
|
-
const [previewUrl, setPreviewUrl] =
|
|
13294
|
+
const [imgLoaded, setImgLoaded] = React16.useState({});
|
|
13295
|
+
const [previewUrl, setPreviewUrl] = React16.useState(null);
|
|
13293
13296
|
const extracted = extractCustomResponses(result);
|
|
13294
13297
|
const customResult = extracted?.map?.((data, index) => {
|
|
13295
13298
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -13307,9 +13310,9 @@ var ToolResultRenderer = React24.memo(function ToolResultRenderer2({
|
|
|
13307
13310
|
const imageUrls = mediaUrls.filter((m) => !m.isVideo);
|
|
13308
13311
|
const videoUrls = mediaUrls.filter((m) => m.isVideo);
|
|
13309
13312
|
const hasMedia = imageUrls.length > 0 || videoUrls.length > 0;
|
|
13310
|
-
const customResponses =
|
|
13313
|
+
const customResponses = React16.useMemo(() => extractCustomResponses(result), [result]);
|
|
13311
13314
|
const hasCustomResponses = customResponses.length > 0;
|
|
13312
|
-
const filteredResult =
|
|
13315
|
+
const filteredResult = React16.useMemo(() => {
|
|
13313
13316
|
if (!result || typeof result !== "object") return result;
|
|
13314
13317
|
const mediaUrlSet = new Set(mediaUrls.map((m) => m.url));
|
|
13315
13318
|
mediaUrls.forEach((m) => {
|
|
@@ -13525,7 +13528,7 @@ var collectMediaAssetsFromResult2 = (result) => {
|
|
|
13525
13528
|
return assets;
|
|
13526
13529
|
};
|
|
13527
13530
|
var INTERNAL_SYSTEM_TOOLS = ["load_skill", "switch_skill", "unload_skill", "call_agent"];
|
|
13528
|
-
var SkillLoadCard =
|
|
13531
|
+
var SkillLoadCard = React16.memo(function SkillLoadCard2({ toolCall }) {
|
|
13529
13532
|
const status = getToolCallStatus(toolCall);
|
|
13530
13533
|
const isPending = status === "pending" || status === "confirmed";
|
|
13531
13534
|
const isSuccess = status === "success";
|
|
@@ -13538,13 +13541,13 @@ var SkillLoadCard = React24.memo(function SkillLoadCard2({ toolCall }) {
|
|
|
13538
13541
|
isSuccess && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-500", children: "\u6280\u80FD" })
|
|
13539
13542
|
] });
|
|
13540
13543
|
});
|
|
13541
|
-
var ToolCallCard =
|
|
13544
|
+
var ToolCallCard = React16.memo(function ToolCallCard2({
|
|
13542
13545
|
toolCall,
|
|
13543
13546
|
config,
|
|
13544
13547
|
onOpenArtifact
|
|
13545
13548
|
}) {
|
|
13546
|
-
const [headerExpanded, setHeaderExpanded] =
|
|
13547
|
-
const [mediaUrls, setMediaUrls] =
|
|
13549
|
+
const [headerExpanded, setHeaderExpanded] = React16.useState(false);
|
|
13550
|
+
const [mediaUrls, setMediaUrls] = React16.useState([]);
|
|
13548
13551
|
const status = getToolCallStatus(toolCall);
|
|
13549
13552
|
const isPending = status === "pending" || status === "confirmed";
|
|
13550
13553
|
const isSuccess = status === "success";
|
|
@@ -13564,7 +13567,7 @@ var ToolCallCard = React24.memo(function ToolCallCard2({
|
|
|
13564
13567
|
if (toolCall.name === "call_agent") return null;
|
|
13565
13568
|
return /* @__PURE__ */ jsxRuntime.jsx(SkillLoadCard, { toolCall });
|
|
13566
13569
|
}
|
|
13567
|
-
|
|
13570
|
+
React16.useEffect(() => {
|
|
13568
13571
|
if (status === "waiting_confirmation") {
|
|
13569
13572
|
setMediaUrls([]);
|
|
13570
13573
|
return;
|
|
@@ -13643,7 +13646,7 @@ var ToolCallCard = React24.memo(function ToolCallCard2({
|
|
|
13643
13646
|
] })
|
|
13644
13647
|
] });
|
|
13645
13648
|
});
|
|
13646
|
-
var StreamingToolCard =
|
|
13649
|
+
var StreamingToolCard = React16.memo(function StreamingToolCard2({ toolCall }) {
|
|
13647
13650
|
const status = getToolCallStatus(toolCall);
|
|
13648
13651
|
if (status === "waiting_confirmation") {
|
|
13649
13652
|
const toolCallForCard = {
|
|
@@ -13670,15 +13673,15 @@ var StreamingToolCard = React24.memo(function StreamingToolCard2({ toolCall }) {
|
|
|
13670
13673
|
toolCall.gmtCreate && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-zinc-500 mt-1", children: new Date(toolCall.gmtCreate).toLocaleTimeString("zh-CN", { hour: "2-digit", minute: "2-digit", second: "2-digit" }) })
|
|
13671
13674
|
] });
|
|
13672
13675
|
});
|
|
13673
|
-
var ComponentPendingCard =
|
|
13676
|
+
var ComponentPendingCard = React16.memo(function ComponentPendingCard2({
|
|
13674
13677
|
component,
|
|
13675
13678
|
onResolved
|
|
13676
13679
|
}) {
|
|
13677
13680
|
const { showItemTime } = useAgentStore();
|
|
13678
|
-
const [loading, setLoading] =
|
|
13679
|
-
const [error, setError] =
|
|
13680
|
-
const [collapsed, setCollapsed] =
|
|
13681
|
-
const [jsonValue, setJsonValue] =
|
|
13681
|
+
const [loading, setLoading] = React16.useState(null);
|
|
13682
|
+
const [error, setError] = React16.useState("");
|
|
13683
|
+
const [collapsed, setCollapsed] = React16.useState(false);
|
|
13684
|
+
const [jsonValue, setJsonValue] = React16.useState(() => {
|
|
13682
13685
|
const initialPayload = component.props || component.content || {};
|
|
13683
13686
|
return typeof initialPayload === "string" ? initialPayload : JSON.stringify(initialPayload, null, 2);
|
|
13684
13687
|
});
|
|
@@ -13687,7 +13690,7 @@ var ComponentPendingCard = React24.memo(function ComponentPendingCard2({
|
|
|
13687
13690
|
const components = useComponents();
|
|
13688
13691
|
const registry = components.ComponentRegistry || {};
|
|
13689
13692
|
const normalizeName = (value) => (value || "").toLowerCase().replace(/[^a-z0-9]/g, "");
|
|
13690
|
-
const registryMap =
|
|
13693
|
+
const registryMap = React16.useMemo(() => {
|
|
13691
13694
|
const map3 = /* @__PURE__ */ new Map();
|
|
13692
13695
|
Object.entries(registry).forEach(([key, Comp]) => {
|
|
13693
13696
|
map3.set(key, Comp);
|
|
@@ -13706,7 +13709,7 @@ var ComponentPendingCard = React24.memo(function ComponentPendingCard2({
|
|
|
13706
13709
|
}
|
|
13707
13710
|
return void 0;
|
|
13708
13711
|
})();
|
|
13709
|
-
const resolvedProps =
|
|
13712
|
+
const resolvedProps = React16.useMemo(() => {
|
|
13710
13713
|
const raw = component.props ?? component.content ?? {};
|
|
13711
13714
|
if (typeof raw === "string") {
|
|
13712
13715
|
try {
|
|
@@ -13725,8 +13728,8 @@ var ComponentPendingCard = React24.memo(function ComponentPendingCard2({
|
|
|
13725
13728
|
}, [component]);
|
|
13726
13729
|
console.log("Resolved Props:", resolvedProps);
|
|
13727
13730
|
console.log("Component gmtCreate:", component.gmtCreate, typeof component.gmtCreate);
|
|
13728
|
-
const [localConfirmed, setLocalConfirmed] =
|
|
13729
|
-
const [localCancelled, setLocalCancelled] =
|
|
13731
|
+
const [localConfirmed, setLocalConfirmed] = React16.useState(false);
|
|
13732
|
+
const [localCancelled, setLocalCancelled] = React16.useState(false);
|
|
13730
13733
|
const isActionDisabled = isReadonly || localConfirmed || localCancelled;
|
|
13731
13734
|
const handleConfirm = async () => {
|
|
13732
13735
|
if (isActionDisabled) return;
|
|
@@ -13773,7 +13776,7 @@ var ComponentPendingCard = React24.memo(function ComponentPendingCard2({
|
|
|
13773
13776
|
setLoading(null);
|
|
13774
13777
|
}
|
|
13775
13778
|
};
|
|
13776
|
-
|
|
13779
|
+
React16.useEffect(() => {
|
|
13777
13780
|
const initialPayload = component.props || component.content || {};
|
|
13778
13781
|
setJsonValue(typeof initialPayload === "string" ? initialPayload : JSON.stringify(initialPayload, null, 2));
|
|
13779
13782
|
if (statusUpper === "SUBMITTED" || statusUpper === "CONFIRMED" || statusUpper === "COMPLETED" || statusUpper === "DONE") {
|
|
@@ -13842,8 +13845,8 @@ function extractHtmlTitleSimple(html2) {
|
|
|
13842
13845
|
if (h1Match) return h1Match[1].trim();
|
|
13843
13846
|
return void 0;
|
|
13844
13847
|
}
|
|
13845
|
-
var ThoughtTimelineCard =
|
|
13846
|
-
const [expanded, setExpanded] =
|
|
13848
|
+
var ThoughtTimelineCard = React16.memo(function ThoughtTimelineCard2({ thought, config, isLoading = false, skipImages = false }) {
|
|
13849
|
+
const [expanded, setExpanded] = React16.useState(true);
|
|
13847
13850
|
const { showItemTime } = useAgentStore();
|
|
13848
13851
|
const thoughtType = thought?.type || "";
|
|
13849
13852
|
const excludedTypes = [
|
|
@@ -13866,9 +13869,9 @@ var ThoughtTimelineCard = React24.memo(function ThoughtTimelineCard2({ thought,
|
|
|
13866
13869
|
return null;
|
|
13867
13870
|
}
|
|
13868
13871
|
if (thought?.raw && Array.isArray(thought.raw)) {
|
|
13869
|
-
const hasConfirmationEvent = thought.raw.some((
|
|
13870
|
-
const type =
|
|
13871
|
-
return excludedTypes.includes(type) ||
|
|
13872
|
+
const hasConfirmationEvent = thought.raw.some((r2) => {
|
|
13873
|
+
const type = r2?.type || "";
|
|
13874
|
+
return excludedTypes.includes(type) || r2?.content && (r2.content.includes('"type":"tool_confirmed"') || r2.content.includes('"type":"component_submitted"') || r2.content.includes("\u7528\u6237\u786E\u8BA4\u6267\u884C\u5DE5\u5177\u8C03\u7528"));
|
|
13872
13875
|
});
|
|
13873
13876
|
if (hasConfirmationEvent) {
|
|
13874
13877
|
return null;
|
|
@@ -13878,8 +13881,8 @@ var ThoughtTimelineCard = React24.memo(function ThoughtTimelineCard2({ thought,
|
|
|
13878
13881
|
const withoutJsonImages = removeJsonImageUrls(withoutTags);
|
|
13879
13882
|
const cleaned = sanitizeMarkdownContent(parseThinkingContent(withoutJsonImages));
|
|
13880
13883
|
if (!cleaned || !cleaned.trim()) return null;
|
|
13881
|
-
const lineCount =
|
|
13882
|
-
|
|
13884
|
+
const lineCount = React16.useMemo(() => cleaned.split("\n").length, [cleaned]);
|
|
13885
|
+
React16__namespace.default.useEffect(() => {
|
|
13883
13886
|
if (isLoading) {
|
|
13884
13887
|
setExpanded(true);
|
|
13885
13888
|
} else {
|
|
@@ -14051,7 +14054,7 @@ function AgentIdentity({ agentId, agentName, agentIcon }) {
|
|
|
14051
14054
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-zinc-300", children: agentName })
|
|
14052
14055
|
] });
|
|
14053
14056
|
}
|
|
14054
|
-
var HandoffDivider =
|
|
14057
|
+
var HandoffDivider = React16.memo(function HandoffDivider2({
|
|
14055
14058
|
data
|
|
14056
14059
|
}) {
|
|
14057
14060
|
const { agentId, agentName, agentIcon, type, duration, nextAgentName, nextAgentId } = data;
|
|
@@ -14295,8 +14298,8 @@ function getStatusConfig(status, retryCount) {
|
|
|
14295
14298
|
};
|
|
14296
14299
|
}
|
|
14297
14300
|
}
|
|
14298
|
-
var ToolCallMiniCard =
|
|
14299
|
-
const [expanded, setExpanded] =
|
|
14301
|
+
var ToolCallMiniCard = React16.memo(function ToolCallMiniCard2({ toolCall }) {
|
|
14302
|
+
const [expanded, setExpanded] = React16.useState(false);
|
|
14300
14303
|
const statusLower = (toolCall.status || "pending").toLowerCase();
|
|
14301
14304
|
const isPending = statusLower === "pending" || statusLower === "executing";
|
|
14302
14305
|
const isSuccess = statusLower === "completed";
|
|
@@ -14367,30 +14370,30 @@ var ToolCallMiniCard = React24.memo(function ToolCallMiniCard2({ toolCall }) {
|
|
|
14367
14370
|
] })
|
|
14368
14371
|
] });
|
|
14369
14372
|
});
|
|
14370
|
-
var SubAgentPanelCard =
|
|
14373
|
+
var SubAgentPanelCard = React16.memo(function SubAgentPanelCard2({
|
|
14371
14374
|
panel,
|
|
14372
14375
|
onToggleExpand,
|
|
14373
14376
|
isStreaming
|
|
14374
14377
|
}) {
|
|
14375
|
-
const [localExpanded, setLocalExpanded] =
|
|
14378
|
+
const [localExpanded, setLocalExpanded] = React16.useState(panel.isExpanded);
|
|
14376
14379
|
const isExpanded = onToggleExpand ? panel.isExpanded : localExpanded;
|
|
14377
14380
|
const statusConfig = getStatusConfig(panel.status, panel.retryCount);
|
|
14378
|
-
const handleToggle =
|
|
14381
|
+
const handleToggle = React16.useCallback(() => {
|
|
14379
14382
|
if (onToggleExpand) {
|
|
14380
14383
|
onToggleExpand();
|
|
14381
14384
|
} else {
|
|
14382
14385
|
setLocalExpanded((prev) => !prev);
|
|
14383
14386
|
}
|
|
14384
14387
|
}, [onToggleExpand]);
|
|
14385
|
-
const filteredThoughts =
|
|
14388
|
+
const filteredThoughts = React16.useMemo(
|
|
14386
14389
|
() => panel.thoughts.filter((t) => !META_EVENT_TYPES.has(t.type)),
|
|
14387
14390
|
[panel.thoughts]
|
|
14388
14391
|
);
|
|
14389
|
-
const thinkingContent =
|
|
14392
|
+
const thinkingContent = React16.useMemo(
|
|
14390
14393
|
() => extractThinkingFromThoughts(filteredThoughts),
|
|
14391
14394
|
[filteredThoughts]
|
|
14392
14395
|
);
|
|
14393
|
-
const toolCalls =
|
|
14396
|
+
const toolCalls = React16.useMemo(
|
|
14394
14397
|
() => extractToolCallsFromThoughts(filteredThoughts),
|
|
14395
14398
|
[filteredThoughts]
|
|
14396
14399
|
);
|
|
@@ -14471,7 +14474,7 @@ var SubAgentPanelCard = React24.memo(function SubAgentPanelCard2({
|
|
|
14471
14474
|
] })
|
|
14472
14475
|
] });
|
|
14473
14476
|
});
|
|
14474
|
-
var ParallelAgentContainer =
|
|
14477
|
+
var ParallelAgentContainer = React16.memo(function ParallelAgentContainer2({
|
|
14475
14478
|
panels,
|
|
14476
14479
|
parallelSummary,
|
|
14477
14480
|
isStreaming,
|
|
@@ -14522,7 +14525,7 @@ var ParallelAgentContainer = React24.memo(function ParallelAgentContainer2({
|
|
|
14522
14525
|
] }) })
|
|
14523
14526
|
] });
|
|
14524
14527
|
});
|
|
14525
|
-
var MultiAgentThoughts =
|
|
14528
|
+
var MultiAgentThoughts = React16.memo(function MultiAgentThoughts2({
|
|
14526
14529
|
thoughts,
|
|
14527
14530
|
isStreaming,
|
|
14528
14531
|
useStorePanels
|
|
@@ -14533,13 +14536,13 @@ var MultiAgentThoughts = React24.memo(function MultiAgentThoughts2({
|
|
|
14533
14536
|
const toggleSubAgentExpanded = useAgentStore((state) => state.toggleSubAgentExpanded);
|
|
14534
14537
|
const storeHasPanels = Object.keys(storePanels).length > 0;
|
|
14535
14538
|
const shouldUseStore = useStorePanels !== void 0 ? useStorePanels : storeHasPanels;
|
|
14536
|
-
const thoughtBasedPanels =
|
|
14539
|
+
const thoughtBasedPanels = React16.useMemo(() => {
|
|
14537
14540
|
if (shouldUseStore) return {};
|
|
14538
14541
|
return buildPanelsFromThoughts(thoughts);
|
|
14539
14542
|
}, [shouldUseStore, thoughts]);
|
|
14540
14543
|
const activePanels = shouldUseStore ? storePanels : thoughtBasedPanels;
|
|
14541
|
-
const panelList =
|
|
14542
|
-
const handleToggleExpand =
|
|
14544
|
+
const panelList = React16.useMemo(() => Object.values(activePanels), [activePanels]);
|
|
14545
|
+
const handleToggleExpand = React16.useCallback((agentId) => {
|
|
14543
14546
|
if (shouldUseStore) {
|
|
14544
14547
|
toggleSubAgentExpanded(agentId);
|
|
14545
14548
|
}
|
|
@@ -14570,14 +14573,14 @@ var MultiAgentThoughts = React24.memo(function MultiAgentThoughts2({
|
|
|
14570
14573
|
)) });
|
|
14571
14574
|
});
|
|
14572
14575
|
var MultiAgentThoughts_default = MultiAgentThoughts;
|
|
14573
|
-
var ParallelTimelineBlock =
|
|
14576
|
+
var ParallelTimelineBlock = React16.memo(function ParallelTimelineBlock2({
|
|
14574
14577
|
data
|
|
14575
14578
|
}) {
|
|
14576
14579
|
const { thoughts, isStreaming } = data;
|
|
14577
14580
|
const subAgents = useAgentStore((state) => state.subAgents);
|
|
14578
14581
|
const subAgentPanels = useAgentStore((state) => state.multiAgent.subAgentPanels);
|
|
14579
14582
|
const subAgentConfigs = useAgentStore((state) => state.subAgentConfigs);
|
|
14580
|
-
const panels =
|
|
14583
|
+
const panels = React16.useMemo(() => {
|
|
14581
14584
|
const resolveAgentName = (agentId, fallbackName) => {
|
|
14582
14585
|
const fromConfig = subAgentConfigs.find((c) => c.publicId === agentId);
|
|
14583
14586
|
if (fromConfig?.name) return fromConfig.name;
|
|
@@ -14616,7 +14619,7 @@ function useMessageContent({
|
|
|
14616
14619
|
isUser,
|
|
14617
14620
|
hasToolCallImages
|
|
14618
14621
|
}) {
|
|
14619
|
-
const displayContent =
|
|
14622
|
+
const displayContent = React16.useMemo(() => {
|
|
14620
14623
|
const isInvalidContent = (content2) => {
|
|
14621
14624
|
if (!content2) return true;
|
|
14622
14625
|
if (typeof content2 !== "string") return false;
|
|
@@ -14669,7 +14672,7 @@ function useMessageContent({
|
|
|
14669
14672
|
}
|
|
14670
14673
|
return typeof content === "string" ? content : String(content ?? "");
|
|
14671
14674
|
}, [isStreaming, streamingContent, message]);
|
|
14672
|
-
const markdownMedia =
|
|
14675
|
+
const markdownMedia = React16.useMemo(() => {
|
|
14673
14676
|
if (!isUser || !displayContent) {
|
|
14674
14677
|
return { media: [], content: displayContent };
|
|
14675
14678
|
}
|
|
@@ -14684,7 +14687,7 @@ function useMessageContent({
|
|
|
14684
14687
|
const cleaned = displayContent.replace(mediaRegex, "").replace(/\n{3,}/g, "\n\n").trim();
|
|
14685
14688
|
return { media, content: cleaned };
|
|
14686
14689
|
}, [displayContent, isUser]);
|
|
14687
|
-
const effectiveDisplayContent =
|
|
14690
|
+
const effectiveDisplayContent = React16.useMemo(() => {
|
|
14688
14691
|
const baseContent = isUser ? markdownMedia.content || "" : displayContent || "";
|
|
14689
14692
|
if (!baseContent) return "";
|
|
14690
14693
|
if (isUser) return baseContent;
|
|
@@ -14696,7 +14699,7 @@ function useMessageContent({
|
|
|
14696
14699
|
}
|
|
14697
14700
|
return baseContent;
|
|
14698
14701
|
}, [displayContent, hasToolCallImages, isUser, markdownMedia.content]);
|
|
14699
|
-
const sanitizedDisplayContent =
|
|
14702
|
+
const sanitizedDisplayContent = React16.useMemo(
|
|
14700
14703
|
() => sanitizeMarkdownContent(effectiveDisplayContent),
|
|
14701
14704
|
[effectiveDisplayContent]
|
|
14702
14705
|
);
|
|
@@ -14747,7 +14750,7 @@ function useToolCalls({
|
|
|
14747
14750
|
thoughts,
|
|
14748
14751
|
pendingToolCalls = []
|
|
14749
14752
|
}) {
|
|
14750
|
-
const toolCalls =
|
|
14753
|
+
const toolCalls = React16.useMemo(() => {
|
|
14751
14754
|
const toolCallMap = /* @__PURE__ */ new Map();
|
|
14752
14755
|
const normalizeId = (value) => {
|
|
14753
14756
|
if (value === void 0 || value === null) return "";
|
|
@@ -14875,7 +14878,7 @@ function useToolCalls({
|
|
|
14875
14878
|
});
|
|
14876
14879
|
return toolCalls2;
|
|
14877
14880
|
}, [message, isStreaming, thoughts, pendingToolCalls]);
|
|
14878
|
-
const dedupedToolCalls =
|
|
14881
|
+
const dedupedToolCalls = React16.useMemo(() => {
|
|
14879
14882
|
if (!toolCalls || toolCalls.length === 0) return [];
|
|
14880
14883
|
const uniqueCalls = toolCalls.reduce((acc, tc) => {
|
|
14881
14884
|
const id = String(tc.id);
|
|
@@ -14900,9 +14903,9 @@ function useComponents2({
|
|
|
14900
14903
|
thoughts,
|
|
14901
14904
|
isStreaming
|
|
14902
14905
|
}) {
|
|
14903
|
-
const [componentDetailMap, setComponentDetailMap] =
|
|
14904
|
-
const componentDetailRequestedRef =
|
|
14905
|
-
const componentsToRender =
|
|
14906
|
+
const [componentDetailMap, setComponentDetailMap] = React16.useState({});
|
|
14907
|
+
const componentDetailRequestedRef = React16.useRef(/* @__PURE__ */ new Set());
|
|
14908
|
+
const componentsToRender = React16.useMemo(() => {
|
|
14906
14909
|
const extraComponents = message.extraData?.components || [];
|
|
14907
14910
|
const backendId = message.metadata?.backendId;
|
|
14908
14911
|
const messageStatus = (message.status || "").toUpperCase();
|
|
@@ -15015,7 +15018,7 @@ function useComponents2({
|
|
|
15015
15018
|
}
|
|
15016
15019
|
return enrichedPendingComponents.filter((c) => c.messageId === backendId);
|
|
15017
15020
|
}, [message, pendingComponents, pendingComponentsSessionId, thoughts, isStreaming]);
|
|
15018
|
-
|
|
15021
|
+
React16.useEffect(() => {
|
|
15019
15022
|
if (!componentsToRender || componentsToRender.length === 0) return;
|
|
15020
15023
|
componentsToRender.forEach((component) => {
|
|
15021
15024
|
if (!component?.id) return;
|
|
@@ -15042,7 +15045,7 @@ function useComponents2({
|
|
|
15042
15045
|
});
|
|
15043
15046
|
});
|
|
15044
15047
|
}, [componentsToRender]);
|
|
15045
|
-
const effectiveComponents =
|
|
15048
|
+
const effectiveComponents = React16.useMemo(() => {
|
|
15046
15049
|
if (!componentsToRender || componentsToRender.length === 0) return [];
|
|
15047
15050
|
return componentsToRender.map((component) => {
|
|
15048
15051
|
const detail = componentDetailMap[component.id];
|
|
@@ -15059,7 +15062,7 @@ function useComponents2({
|
|
|
15059
15062
|
return { effectiveComponents };
|
|
15060
15063
|
}
|
|
15061
15064
|
function usePlanState({ message, thoughts }) {
|
|
15062
|
-
const planFromThoughts =
|
|
15065
|
+
const planFromThoughts = React16.useMemo(() => {
|
|
15063
15066
|
const extraPlan = message.extraData?.plan;
|
|
15064
15067
|
if (extraPlan && extraPlan.steps && Array.isArray(extraPlan.steps) && extraPlan.steps.length > 0) {
|
|
15065
15068
|
return null;
|
|
@@ -15136,10 +15139,10 @@ function usePlanState({ message, thoughts }) {
|
|
|
15136
15139
|
return plan;
|
|
15137
15140
|
}, [message, thoughts]);
|
|
15138
15141
|
const effectivePlan = message.extraData?.plan || planFromThoughts;
|
|
15139
|
-
const [fullPlan, setFullPlan] =
|
|
15140
|
-
const [planLoading, setPlanLoading] =
|
|
15141
|
-
const [loadedPlanId, setLoadedPlanId] =
|
|
15142
|
-
|
|
15142
|
+
const [fullPlan, setFullPlan] = React16.useState(null);
|
|
15143
|
+
const [planLoading, setPlanLoading] = React16.useState(false);
|
|
15144
|
+
const [loadedPlanId, setLoadedPlanId] = React16.useState(null);
|
|
15145
|
+
React16.useEffect(() => {
|
|
15143
15146
|
if (!effectivePlan) {
|
|
15144
15147
|
setFullPlan(null);
|
|
15145
15148
|
setLoadedPlanId(null);
|
|
@@ -15193,7 +15196,7 @@ var COMPONENT_TAGS_TO_STRIP2 = [
|
|
|
15193
15196
|
"ComponentPreview"
|
|
15194
15197
|
];
|
|
15195
15198
|
function useThinkingContent({ message, thoughts, isStreaming, messageContent }) {
|
|
15196
|
-
return
|
|
15199
|
+
return React16.useMemo(() => {
|
|
15197
15200
|
const historyThoughts = message.extraData?.thoughts || [];
|
|
15198
15201
|
const allThoughts = thoughts && thoughts.length > 0 ? thoughts : historyThoughts;
|
|
15199
15202
|
const hasSubAgents = allThoughts.some((t) => t.agent_id || t.agentId || t.agent_name || t.agentName);
|
|
@@ -15378,9 +15381,10 @@ function useTimelineItems({
|
|
|
15378
15381
|
const subAgents = useAgentStore((state) => state.subAgents);
|
|
15379
15382
|
const subAgentPanels = useAgentStore((state) => state.multiAgent.subAgentPanels);
|
|
15380
15383
|
const subAgentConfigs = useAgentStore((state) => state.subAgentConfigs);
|
|
15384
|
+
const mainAgentPublicId = useAgentStore((state) => state.mainAgentPublicId);
|
|
15381
15385
|
const mainAgentName = useAgentStore((state) => state.mainAgentName);
|
|
15382
15386
|
const mainAgentIcon = useAgentStore((state) => state.mainAgentIcon);
|
|
15383
|
-
return
|
|
15387
|
+
return React16.useMemo(() => {
|
|
15384
15388
|
if (isUser) return [];
|
|
15385
15389
|
const resolveAgentName = (agentId, fallbackName) => {
|
|
15386
15390
|
if (!agentId) return mainAgentName || "Assistant";
|
|
@@ -15398,7 +15402,9 @@ function useTimelineItems({
|
|
|
15398
15402
|
return fromConfig?.icon || fromConfig?.avatar;
|
|
15399
15403
|
};
|
|
15400
15404
|
const normalizeAgentId = (rawAgentId) => {
|
|
15401
|
-
|
|
15405
|
+
if (!rawAgentId) return null;
|
|
15406
|
+
if (mainAgentPublicId && rawAgentId === mainAgentPublicId) return null;
|
|
15407
|
+
return rawAgentId;
|
|
15402
15408
|
};
|
|
15403
15409
|
const extra = message.extraData || {};
|
|
15404
15410
|
const extraToolCalls = extra.tool_calls || [];
|
|
@@ -15784,7 +15790,7 @@ ${m.content}`;
|
|
|
15784
15790
|
return true;
|
|
15785
15791
|
});
|
|
15786
15792
|
return filtered.map((item, index) => ({ ...item, id: `${item.kind}-${item.id}-${index}` }));
|
|
15787
|
-
}, [message, isUser, toolCalls, components, plan, thoughts, includeThoughts, includeMessage, messageContent, messageTs, thoughtMergeWindowMs, subAgents, subAgentPanels, subAgentConfigs, mainAgentName, mainAgentIcon]);
|
|
15793
|
+
}, [message, isUser, toolCalls, components, plan, thoughts, includeThoughts, includeMessage, messageContent, messageTs, thoughtMergeWindowMs, subAgents, subAgentPanels, subAgentConfigs, mainAgentPublicId, mainAgentName, mainAgentIcon]);
|
|
15788
15794
|
}
|
|
15789
15795
|
function __insertCSS(code3) {
|
|
15790
15796
|
if (typeof document == "undefined") return;
|
|
@@ -15794,7 +15800,111 @@ function __insertCSS(code3) {
|
|
|
15794
15800
|
head.appendChild(style);
|
|
15795
15801
|
style.styleSheet ? style.styleSheet.cssText = code3 : style.appendChild(document.createTextNode(code3));
|
|
15796
15802
|
}
|
|
15797
|
-
|
|
15803
|
+
var getAsset = (type) => {
|
|
15804
|
+
switch (type) {
|
|
15805
|
+
case "success":
|
|
15806
|
+
return SuccessIcon;
|
|
15807
|
+
case "info":
|
|
15808
|
+
return InfoIcon;
|
|
15809
|
+
case "warning":
|
|
15810
|
+
return WarningIcon;
|
|
15811
|
+
case "error":
|
|
15812
|
+
return ErrorIcon;
|
|
15813
|
+
default:
|
|
15814
|
+
return null;
|
|
15815
|
+
}
|
|
15816
|
+
};
|
|
15817
|
+
var bars = Array(12).fill(0);
|
|
15818
|
+
var Loader = ({ visible, className }) => {
|
|
15819
|
+
return /* @__PURE__ */ React16__namespace.default.createElement("div", {
|
|
15820
|
+
className: [
|
|
15821
|
+
"sonner-loading-wrapper",
|
|
15822
|
+
className
|
|
15823
|
+
].filter(Boolean).join(" "),
|
|
15824
|
+
"data-visible": visible
|
|
15825
|
+
}, /* @__PURE__ */ React16__namespace.default.createElement("div", {
|
|
15826
|
+
className: "sonner-spinner"
|
|
15827
|
+
}, bars.map((_, i) => /* @__PURE__ */ React16__namespace.default.createElement("div", {
|
|
15828
|
+
className: "sonner-loading-bar",
|
|
15829
|
+
key: `spinner-bar-${i}`
|
|
15830
|
+
}))));
|
|
15831
|
+
};
|
|
15832
|
+
var SuccessIcon = /* @__PURE__ */ React16__namespace.default.createElement("svg", {
|
|
15833
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
15834
|
+
viewBox: "0 0 20 20",
|
|
15835
|
+
fill: "currentColor",
|
|
15836
|
+
height: "20",
|
|
15837
|
+
width: "20"
|
|
15838
|
+
}, /* @__PURE__ */ React16__namespace.default.createElement("path", {
|
|
15839
|
+
fillRule: "evenodd",
|
|
15840
|
+
d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z",
|
|
15841
|
+
clipRule: "evenodd"
|
|
15842
|
+
}));
|
|
15843
|
+
var WarningIcon = /* @__PURE__ */ React16__namespace.default.createElement("svg", {
|
|
15844
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
15845
|
+
viewBox: "0 0 24 24",
|
|
15846
|
+
fill: "currentColor",
|
|
15847
|
+
height: "20",
|
|
15848
|
+
width: "20"
|
|
15849
|
+
}, /* @__PURE__ */ React16__namespace.default.createElement("path", {
|
|
15850
|
+
fillRule: "evenodd",
|
|
15851
|
+
d: "M9.401 3.003c1.155-2 4.043-2 5.197 0l7.355 12.748c1.154 2-.29 4.5-2.599 4.5H4.645c-2.309 0-3.752-2.5-2.598-4.5L9.4 3.003zM12 8.25a.75.75 0 01.75.75v3.75a.75.75 0 01-1.5 0V9a.75.75 0 01.75-.75zm0 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z",
|
|
15852
|
+
clipRule: "evenodd"
|
|
15853
|
+
}));
|
|
15854
|
+
var InfoIcon = /* @__PURE__ */ React16__namespace.default.createElement("svg", {
|
|
15855
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
15856
|
+
viewBox: "0 0 20 20",
|
|
15857
|
+
fill: "currentColor",
|
|
15858
|
+
height: "20",
|
|
15859
|
+
width: "20"
|
|
15860
|
+
}, /* @__PURE__ */ React16__namespace.default.createElement("path", {
|
|
15861
|
+
fillRule: "evenodd",
|
|
15862
|
+
d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a.75.75 0 000 1.5h.253a.25.25 0 01.244.304l-.459 2.066A1.75 1.75 0 0010.747 15H11a.75.75 0 000-1.5h-.253a.25.25 0 01-.244-.304l.459-2.066A1.75 1.75 0 009.253 9H9z",
|
|
15863
|
+
clipRule: "evenodd"
|
|
15864
|
+
}));
|
|
15865
|
+
var ErrorIcon = /* @__PURE__ */ React16__namespace.default.createElement("svg", {
|
|
15866
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
15867
|
+
viewBox: "0 0 20 20",
|
|
15868
|
+
fill: "currentColor",
|
|
15869
|
+
height: "20",
|
|
15870
|
+
width: "20"
|
|
15871
|
+
}, /* @__PURE__ */ React16__namespace.default.createElement("path", {
|
|
15872
|
+
fillRule: "evenodd",
|
|
15873
|
+
d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z",
|
|
15874
|
+
clipRule: "evenodd"
|
|
15875
|
+
}));
|
|
15876
|
+
var CloseIcon = /* @__PURE__ */ React16__namespace.default.createElement("svg", {
|
|
15877
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
15878
|
+
width: "12",
|
|
15879
|
+
height: "12",
|
|
15880
|
+
viewBox: "0 0 24 24",
|
|
15881
|
+
fill: "none",
|
|
15882
|
+
stroke: "currentColor",
|
|
15883
|
+
strokeWidth: "1.5",
|
|
15884
|
+
strokeLinecap: "round",
|
|
15885
|
+
strokeLinejoin: "round"
|
|
15886
|
+
}, /* @__PURE__ */ React16__namespace.default.createElement("line", {
|
|
15887
|
+
x1: "18",
|
|
15888
|
+
y1: "6",
|
|
15889
|
+
x2: "6",
|
|
15890
|
+
y2: "18"
|
|
15891
|
+
}), /* @__PURE__ */ React16__namespace.default.createElement("line", {
|
|
15892
|
+
x1: "6",
|
|
15893
|
+
y1: "6",
|
|
15894
|
+
x2: "18",
|
|
15895
|
+
y2: "18"
|
|
15896
|
+
}));
|
|
15897
|
+
var useIsDocumentHidden = () => {
|
|
15898
|
+
const [isDocumentHidden, setIsDocumentHidden] = React16__namespace.default.useState(document.hidden);
|
|
15899
|
+
React16__namespace.default.useEffect(() => {
|
|
15900
|
+
const callback = () => {
|
|
15901
|
+
setIsDocumentHidden(document.hidden);
|
|
15902
|
+
};
|
|
15903
|
+
document.addEventListener("visibilitychange", callback);
|
|
15904
|
+
return () => window.removeEventListener("visibilitychange", callback);
|
|
15905
|
+
}, []);
|
|
15906
|
+
return isDocumentHidden;
|
|
15907
|
+
};
|
|
15798
15908
|
var toastsCounter = 1;
|
|
15799
15909
|
var Observer = class {
|
|
15800
15910
|
constructor() {
|
|
@@ -15935,7 +16045,7 @@ var Observer = class {
|
|
|
15935
16045
|
"resolve",
|
|
15936
16046
|
response
|
|
15937
16047
|
];
|
|
15938
|
-
const isReactElementResponse =
|
|
16048
|
+
const isReactElementResponse = React16__namespace.default.isValidElement(response);
|
|
15939
16049
|
if (isReactElementResponse) {
|
|
15940
16050
|
shouldDismiss = false;
|
|
15941
16051
|
this.create({
|
|
@@ -15947,7 +16057,7 @@ var Observer = class {
|
|
|
15947
16057
|
shouldDismiss = false;
|
|
15948
16058
|
const promiseData = typeof data.error === "function" ? await data.error(`HTTP error! status: ${response.status}`) : data.error;
|
|
15949
16059
|
const description = typeof data.description === "function" ? await data.description(`HTTP error! status: ${response.status}`) : data.description;
|
|
15950
|
-
const isExtendedResult = typeof promiseData === "object" && !
|
|
16060
|
+
const isExtendedResult = typeof promiseData === "object" && !React16__namespace.default.isValidElement(promiseData);
|
|
15951
16061
|
const toastSettings = isExtendedResult ? promiseData : {
|
|
15952
16062
|
message: promiseData
|
|
15953
16063
|
};
|
|
@@ -15961,7 +16071,7 @@ var Observer = class {
|
|
|
15961
16071
|
shouldDismiss = false;
|
|
15962
16072
|
const promiseData = typeof data.error === "function" ? await data.error(response) : data.error;
|
|
15963
16073
|
const description = typeof data.description === "function" ? await data.description(response) : data.description;
|
|
15964
|
-
const isExtendedResult = typeof promiseData === "object" && !
|
|
16074
|
+
const isExtendedResult = typeof promiseData === "object" && !React16__namespace.default.isValidElement(promiseData);
|
|
15965
16075
|
const toastSettings = isExtendedResult ? promiseData : {
|
|
15966
16076
|
message: promiseData
|
|
15967
16077
|
};
|
|
@@ -15975,7 +16085,7 @@ var Observer = class {
|
|
|
15975
16085
|
shouldDismiss = false;
|
|
15976
16086
|
const promiseData = typeof data.success === "function" ? await data.success(response) : data.success;
|
|
15977
16087
|
const description = typeof data.description === "function" ? await data.description(response) : data.description;
|
|
15978
|
-
const isExtendedResult = typeof promiseData === "object" && !
|
|
16088
|
+
const isExtendedResult = typeof promiseData === "object" && !React16__namespace.default.isValidElement(promiseData);
|
|
15979
16089
|
const toastSettings = isExtendedResult ? promiseData : {
|
|
15980
16090
|
message: promiseData
|
|
15981
16091
|
};
|
|
@@ -15995,7 +16105,7 @@ var Observer = class {
|
|
|
15995
16105
|
shouldDismiss = false;
|
|
15996
16106
|
const promiseData = typeof data.error === "function" ? await data.error(error) : data.error;
|
|
15997
16107
|
const description = typeof data.description === "function" ? await data.description(error) : data.description;
|
|
15998
|
-
const isExtendedResult = typeof promiseData === "object" && !
|
|
16108
|
+
const isExtendedResult = typeof promiseData === "object" && !React16__namespace.default.isValidElement(promiseData);
|
|
15999
16109
|
const toastSettings = isExtendedResult ? promiseData : {
|
|
16000
16110
|
message: promiseData
|
|
16001
16111
|
};
|
|
@@ -16024,10 +16134,10 @@ var Observer = class {
|
|
|
16024
16134
|
});
|
|
16025
16135
|
}
|
|
16026
16136
|
};
|
|
16027
|
-
this.custom = (
|
|
16137
|
+
this.custom = (jsx63, data) => {
|
|
16028
16138
|
const id = (data == null ? void 0 : data.id) || toastsCounter++;
|
|
16029
16139
|
this.create({
|
|
16030
|
-
jsx:
|
|
16140
|
+
jsx: jsx63(id),
|
|
16031
16141
|
id,
|
|
16032
16142
|
...data
|
|
16033
16143
|
});
|
|
@@ -16072,20 +16182,710 @@ var toast = Object.assign(basicToast, {
|
|
|
16072
16182
|
getToasts
|
|
16073
16183
|
});
|
|
16074
16184
|
__insertCSS("[data-sonner-toaster][dir=ltr],html[dir=ltr]{--toast-icon-margin-start:-3px;--toast-icon-margin-end:4px;--toast-svg-margin-start:-1px;--toast-svg-margin-end:0px;--toast-button-margin-start:auto;--toast-button-margin-end:0;--toast-close-button-start:0;--toast-close-button-end:unset;--toast-close-button-transform:translate(-35%, -35%)}[data-sonner-toaster][dir=rtl],html[dir=rtl]{--toast-icon-margin-start:4px;--toast-icon-margin-end:-3px;--toast-svg-margin-start:0px;--toast-svg-margin-end:-1px;--toast-button-margin-start:0;--toast-button-margin-end:auto;--toast-close-button-start:unset;--toast-close-button-end:0;--toast-close-button-transform:translate(35%, -35%)}[data-sonner-toaster]{position:fixed;width:var(--width);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;--gray1:hsl(0, 0%, 99%);--gray2:hsl(0, 0%, 97.3%);--gray3:hsl(0, 0%, 95.1%);--gray4:hsl(0, 0%, 93%);--gray5:hsl(0, 0%, 90.9%);--gray6:hsl(0, 0%, 88.7%);--gray7:hsl(0, 0%, 85.8%);--gray8:hsl(0, 0%, 78%);--gray9:hsl(0, 0%, 56.1%);--gray10:hsl(0, 0%, 52.3%);--gray11:hsl(0, 0%, 43.5%);--gray12:hsl(0, 0%, 9%);--border-radius:8px;box-sizing:border-box;padding:0;margin:0;list-style:none;outline:0;z-index:999999999;transition:transform .4s ease}@media (hover:none) and (pointer:coarse){[data-sonner-toaster][data-lifted=true]{transform:none}}[data-sonner-toaster][data-x-position=right]{right:var(--offset-right)}[data-sonner-toaster][data-x-position=left]{left:var(--offset-left)}[data-sonner-toaster][data-x-position=center]{left:50%;transform:translateX(-50%)}[data-sonner-toaster][data-y-position=top]{top:var(--offset-top)}[data-sonner-toaster][data-y-position=bottom]{bottom:var(--offset-bottom)}[data-sonner-toast]{--y:translateY(100%);--lift-amount:calc(var(--lift) * var(--gap));z-index:var(--z-index);position:absolute;opacity:0;transform:var(--y);touch-action:none;transition:transform .4s,opacity .4s,height .4s,box-shadow .2s;box-sizing:border-box;outline:0;overflow-wrap:anywhere}[data-sonner-toast][data-styled=true]{padding:16px;background:var(--normal-bg);border:1px solid var(--normal-border);color:var(--normal-text);border-radius:var(--border-radius);box-shadow:0 4px 12px rgba(0,0,0,.1);width:var(--width);font-size:13px;display:flex;align-items:center;gap:6px}[data-sonner-toast]:focus-visible{box-shadow:0 4px 12px rgba(0,0,0,.1),0 0 0 2px rgba(0,0,0,.2)}[data-sonner-toast][data-y-position=top]{top:0;--y:translateY(-100%);--lift:1;--lift-amount:calc(1 * var(--gap))}[data-sonner-toast][data-y-position=bottom]{bottom:0;--y:translateY(100%);--lift:-1;--lift-amount:calc(var(--lift) * var(--gap))}[data-sonner-toast][data-styled=true] [data-description]{font-weight:400;line-height:1.4;color:#3f3f3f}[data-rich-colors=true][data-sonner-toast][data-styled=true] [data-description]{color:inherit}[data-sonner-toaster][data-sonner-theme=dark] [data-description]{color:#e8e8e8}[data-sonner-toast][data-styled=true] [data-title]{font-weight:500;line-height:1.5;color:inherit}[data-sonner-toast][data-styled=true] [data-icon]{display:flex;height:16px;width:16px;position:relative;justify-content:flex-start;align-items:center;flex-shrink:0;margin-left:var(--toast-icon-margin-start);margin-right:var(--toast-icon-margin-end)}[data-sonner-toast][data-promise=true] [data-icon]>svg{opacity:0;transform:scale(.8);transform-origin:center;animation:sonner-fade-in .3s ease forwards}[data-sonner-toast][data-styled=true] [data-icon]>*{flex-shrink:0}[data-sonner-toast][data-styled=true] [data-icon] svg{margin-left:var(--toast-svg-margin-start);margin-right:var(--toast-svg-margin-end)}[data-sonner-toast][data-styled=true] [data-content]{display:flex;flex-direction:column;gap:2px}[data-sonner-toast][data-styled=true] [data-button]{border-radius:4px;padding-left:8px;padding-right:8px;height:24px;font-size:12px;color:var(--normal-bg);background:var(--normal-text);margin-left:var(--toast-button-margin-start);margin-right:var(--toast-button-margin-end);border:none;font-weight:500;cursor:pointer;outline:0;display:flex;align-items:center;flex-shrink:0;transition:opacity .4s,box-shadow .2s}[data-sonner-toast][data-styled=true] [data-button]:focus-visible{box-shadow:0 0 0 2px rgba(0,0,0,.4)}[data-sonner-toast][data-styled=true] [data-button]:first-of-type{margin-left:var(--toast-button-margin-start);margin-right:var(--toast-button-margin-end)}[data-sonner-toast][data-styled=true] [data-cancel]{color:var(--normal-text);background:rgba(0,0,0,.08)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-styled=true] [data-cancel]{background:rgba(255,255,255,.3)}[data-sonner-toast][data-styled=true] [data-close-button]{position:absolute;left:var(--toast-close-button-start);right:var(--toast-close-button-end);top:0;height:20px;width:20px;display:flex;justify-content:center;align-items:center;padding:0;color:var(--gray12);background:var(--normal-bg);border:1px solid var(--gray4);transform:var(--toast-close-button-transform);border-radius:50%;cursor:pointer;z-index:1;transition:opacity .1s,background .2s,border-color .2s}[data-sonner-toast][data-styled=true] [data-close-button]:focus-visible{box-shadow:0 4px 12px rgba(0,0,0,.1),0 0 0 2px rgba(0,0,0,.2)}[data-sonner-toast][data-styled=true] [data-disabled=true]{cursor:not-allowed}[data-sonner-toast][data-styled=true]:hover [data-close-button]:hover{background:var(--gray2);border-color:var(--gray5)}[data-sonner-toast][data-swiping=true]::before{content:'';position:absolute;left:-100%;right:-100%;height:100%;z-index:-1}[data-sonner-toast][data-y-position=top][data-swiping=true]::before{bottom:50%;transform:scaleY(3) translateY(50%)}[data-sonner-toast][data-y-position=bottom][data-swiping=true]::before{top:50%;transform:scaleY(3) translateY(-50%)}[data-sonner-toast][data-swiping=false][data-removed=true]::before{content:'';position:absolute;inset:0;transform:scaleY(2)}[data-sonner-toast][data-expanded=true]::after{content:'';position:absolute;left:0;height:calc(var(--gap) + 1px);bottom:100%;width:100%}[data-sonner-toast][data-mounted=true]{--y:translateY(0);opacity:1}[data-sonner-toast][data-expanded=false][data-front=false]{--scale:var(--toasts-before) * 0.05 + 1;--y:translateY(calc(var(--lift-amount) * var(--toasts-before))) scale(calc(-1 * var(--scale)));height:var(--front-toast-height)}[data-sonner-toast]>*{transition:opacity .4s}[data-sonner-toast][data-x-position=right]{right:0}[data-sonner-toast][data-x-position=left]{left:0}[data-sonner-toast][data-expanded=false][data-front=false][data-styled=true]>*{opacity:0}[data-sonner-toast][data-visible=false]{opacity:0;pointer-events:none}[data-sonner-toast][data-mounted=true][data-expanded=true]{--y:translateY(calc(var(--lift) * var(--offset)));height:var(--initial-height)}[data-sonner-toast][data-removed=true][data-front=true][data-swipe-out=false]{--y:translateY(calc(var(--lift) * -100%));opacity:0}[data-sonner-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=true]{--y:translateY(calc(var(--lift) * var(--offset) + var(--lift) * -100%));opacity:0}[data-sonner-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=false]{--y:translateY(40%);opacity:0;transition:transform .5s,opacity .2s}[data-sonner-toast][data-removed=true][data-front=false]::before{height:calc(var(--initial-height) + 20%)}[data-sonner-toast][data-swiping=true]{transform:var(--y) translateY(var(--swipe-amount-y,0)) translateX(var(--swipe-amount-x,0));transition:none}[data-sonner-toast][data-swiped=true]{user-select:none}[data-sonner-toast][data-swipe-out=true][data-y-position=bottom],[data-sonner-toast][data-swipe-out=true][data-y-position=top]{animation-duration:.2s;animation-timing-function:ease-out;animation-fill-mode:forwards}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=left]{animation-name:swipe-out-left}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=right]{animation-name:swipe-out-right}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=up]{animation-name:swipe-out-up}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=down]{animation-name:swipe-out-down}@keyframes swipe-out-left{from{transform:var(--y) translateX(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translateX(calc(var(--swipe-amount-x) - 100%));opacity:0}}@keyframes swipe-out-right{from{transform:var(--y) translateX(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translateX(calc(var(--swipe-amount-x) + 100%));opacity:0}}@keyframes swipe-out-up{from{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) - 100%));opacity:0}}@keyframes swipe-out-down{from{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) + 100%));opacity:0}}@media (max-width:600px){[data-sonner-toaster]{position:fixed;right:var(--mobile-offset-right);left:var(--mobile-offset-left);width:100%}[data-sonner-toaster][dir=rtl]{left:calc(var(--mobile-offset-left) * -1)}[data-sonner-toaster] [data-sonner-toast]{left:0;right:0;width:calc(100% - var(--mobile-offset-left) * 2)}[data-sonner-toaster][data-x-position=left]{left:var(--mobile-offset-left)}[data-sonner-toaster][data-y-position=bottom]{bottom:var(--mobile-offset-bottom)}[data-sonner-toaster][data-y-position=top]{top:var(--mobile-offset-top)}[data-sonner-toaster][data-x-position=center]{left:var(--mobile-offset-left);right:var(--mobile-offset-right);transform:none}}[data-sonner-toaster][data-sonner-theme=light]{--normal-bg:#fff;--normal-border:var(--gray4);--normal-text:var(--gray12);--success-bg:hsl(143, 85%, 96%);--success-border:hsl(145, 92%, 87%);--success-text:hsl(140, 100%, 27%);--info-bg:hsl(208, 100%, 97%);--info-border:hsl(221, 91%, 93%);--info-text:hsl(210, 92%, 45%);--warning-bg:hsl(49, 100%, 97%);--warning-border:hsl(49, 91%, 84%);--warning-text:hsl(31, 92%, 45%);--error-bg:hsl(359, 100%, 97%);--error-border:hsl(359, 100%, 94%);--error-text:hsl(360, 100%, 45%)}[data-sonner-toaster][data-sonner-theme=light] [data-sonner-toast][data-invert=true]{--normal-bg:#000;--normal-border:hsl(0, 0%, 20%);--normal-text:var(--gray1)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-invert=true]{--normal-bg:#fff;--normal-border:var(--gray3);--normal-text:var(--gray12)}[data-sonner-toaster][data-sonner-theme=dark]{--normal-bg:#000;--normal-bg-hover:hsl(0, 0%, 12%);--normal-border:hsl(0, 0%, 20%);--normal-border-hover:hsl(0, 0%, 25%);--normal-text:var(--gray1);--success-bg:hsl(150, 100%, 6%);--success-border:hsl(147, 100%, 12%);--success-text:hsl(150, 86%, 65%);--info-bg:hsl(215, 100%, 6%);--info-border:hsl(223, 43%, 17%);--info-text:hsl(216, 87%, 65%);--warning-bg:hsl(64, 100%, 6%);--warning-border:hsl(60, 100%, 9%);--warning-text:hsl(46, 87%, 65%);--error-bg:hsl(358, 76%, 10%);--error-border:hsl(357, 89%, 16%);--error-text:hsl(358, 100%, 81%)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]{background:var(--normal-bg);border-color:var(--normal-border);color:var(--normal-text)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]:hover{background:var(--normal-bg-hover);border-color:var(--normal-border-hover)}[data-rich-colors=true][data-sonner-toast][data-type=success]{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}[data-rich-colors=true][data-sonner-toast][data-type=success] [data-close-button]{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}[data-rich-colors=true][data-sonner-toast][data-type=info]{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}[data-rich-colors=true][data-sonner-toast][data-type=info] [data-close-button]{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}[data-rich-colors=true][data-sonner-toast][data-type=warning]{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}[data-rich-colors=true][data-sonner-toast][data-type=warning] [data-close-button]{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}[data-rich-colors=true][data-sonner-toast][data-type=error]{background:var(--error-bg);border-color:var(--error-border);color:var(--error-text)}[data-rich-colors=true][data-sonner-toast][data-type=error] [data-close-button]{background:var(--error-bg);border-color:var(--error-border);color:var(--error-text)}.sonner-loading-wrapper{--size:16px;height:var(--size);width:var(--size);position:absolute;inset:0;z-index:10}.sonner-loading-wrapper[data-visible=false]{transform-origin:center;animation:sonner-fade-out .2s ease forwards}.sonner-spinner{position:relative;top:50%;left:50%;height:var(--size);width:var(--size)}.sonner-loading-bar{animation:sonner-spin 1.2s linear infinite;background:var(--gray11);border-radius:6px;height:8%;left:-10%;position:absolute;top:-3.9%;width:24%}.sonner-loading-bar:first-child{animation-delay:-1.2s;transform:rotate(.0001deg) translate(146%)}.sonner-loading-bar:nth-child(2){animation-delay:-1.1s;transform:rotate(30deg) translate(146%)}.sonner-loading-bar:nth-child(3){animation-delay:-1s;transform:rotate(60deg) translate(146%)}.sonner-loading-bar:nth-child(4){animation-delay:-.9s;transform:rotate(90deg) translate(146%)}.sonner-loading-bar:nth-child(5){animation-delay:-.8s;transform:rotate(120deg) translate(146%)}.sonner-loading-bar:nth-child(6){animation-delay:-.7s;transform:rotate(150deg) translate(146%)}.sonner-loading-bar:nth-child(7){animation-delay:-.6s;transform:rotate(180deg) translate(146%)}.sonner-loading-bar:nth-child(8){animation-delay:-.5s;transform:rotate(210deg) translate(146%)}.sonner-loading-bar:nth-child(9){animation-delay:-.4s;transform:rotate(240deg) translate(146%)}.sonner-loading-bar:nth-child(10){animation-delay:-.3s;transform:rotate(270deg) translate(146%)}.sonner-loading-bar:nth-child(11){animation-delay:-.2s;transform:rotate(300deg) translate(146%)}.sonner-loading-bar:nth-child(12){animation-delay:-.1s;transform:rotate(330deg) translate(146%)}@keyframes sonner-fade-in{0%{opacity:0;transform:scale(.8)}100%{opacity:1;transform:scale(1)}}@keyframes sonner-fade-out{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.8)}}@keyframes sonner-spin{0%{opacity:1}100%{opacity:.15}}@media (prefers-reduced-motion){.sonner-loading-bar,[data-sonner-toast],[data-sonner-toast]>*{transition:none!important;animation:none!important}}.sonner-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transform-origin:center;transition:opacity .2s,transform .2s}.sonner-loader[data-visible=false]{opacity:0;transform:scale(.8) translate(-50%,-50%)}");
|
|
16075
|
-
|
|
16185
|
+
function isAction(action) {
|
|
16186
|
+
return action.label !== void 0;
|
|
16187
|
+
}
|
|
16188
|
+
var VISIBLE_TOASTS_AMOUNT = 3;
|
|
16189
|
+
var VIEWPORT_OFFSET = "24px";
|
|
16190
|
+
var MOBILE_VIEWPORT_OFFSET = "16px";
|
|
16191
|
+
var TOAST_LIFETIME = 4e3;
|
|
16192
|
+
var TOAST_WIDTH = 356;
|
|
16193
|
+
var GAP = 14;
|
|
16194
|
+
var SWIPE_THRESHOLD = 45;
|
|
16195
|
+
var TIME_BEFORE_UNMOUNT = 200;
|
|
16196
|
+
function cn2(...classes) {
|
|
16197
|
+
return classes.filter(Boolean).join(" ");
|
|
16198
|
+
}
|
|
16199
|
+
function getDefaultSwipeDirections(position) {
|
|
16200
|
+
const [y, x] = position.split("-");
|
|
16201
|
+
const directions = [];
|
|
16202
|
+
if (y) {
|
|
16203
|
+
directions.push(y);
|
|
16204
|
+
}
|
|
16205
|
+
if (x) {
|
|
16206
|
+
directions.push(x);
|
|
16207
|
+
}
|
|
16208
|
+
return directions;
|
|
16209
|
+
}
|
|
16210
|
+
var Toast = (props) => {
|
|
16211
|
+
var _toast_classNames, _toast_classNames1, _toast_classNames2, _toast_classNames3, _toast_classNames4, _toast_classNames5, _toast_classNames6, _toast_classNames7, _toast_classNames8;
|
|
16212
|
+
const { invert: ToasterInvert, toast: toast2, unstyled, interacting, setHeights, visibleToasts, heights, index, toasts, expanded, removeToast, defaultRichColors, closeButton: closeButtonFromToaster, style, cancelButtonStyle, actionButtonStyle, className = "", descriptionClassName = "", duration: durationFromToaster, position, gap, expandByDefault, classNames, icons, closeButtonAriaLabel = "Close toast" } = props;
|
|
16213
|
+
const [swipeDirection, setSwipeDirection] = React16__namespace.default.useState(null);
|
|
16214
|
+
const [swipeOutDirection, setSwipeOutDirection] = React16__namespace.default.useState(null);
|
|
16215
|
+
const [mounted, setMounted] = React16__namespace.default.useState(false);
|
|
16216
|
+
const [removed, setRemoved] = React16__namespace.default.useState(false);
|
|
16217
|
+
const [swiping, setSwiping] = React16__namespace.default.useState(false);
|
|
16218
|
+
const [swipeOut, setSwipeOut] = React16__namespace.default.useState(false);
|
|
16219
|
+
const [isSwiped, setIsSwiped] = React16__namespace.default.useState(false);
|
|
16220
|
+
const [offsetBeforeRemove, setOffsetBeforeRemove] = React16__namespace.default.useState(0);
|
|
16221
|
+
const [initialHeight, setInitialHeight] = React16__namespace.default.useState(0);
|
|
16222
|
+
const remainingTime = React16__namespace.default.useRef(toast2.duration || durationFromToaster || TOAST_LIFETIME);
|
|
16223
|
+
const dragStartTime = React16__namespace.default.useRef(null);
|
|
16224
|
+
const toastRef = React16__namespace.default.useRef(null);
|
|
16225
|
+
const isFront = index === 0;
|
|
16226
|
+
const isVisible = index + 1 <= visibleToasts;
|
|
16227
|
+
const toastType = toast2.type;
|
|
16228
|
+
const dismissible = toast2.dismissible !== false;
|
|
16229
|
+
const toastClassname = toast2.className || "";
|
|
16230
|
+
const toastDescriptionClassname = toast2.descriptionClassName || "";
|
|
16231
|
+
const heightIndex = React16__namespace.default.useMemo(() => heights.findIndex((height) => height.toastId === toast2.id) || 0, [
|
|
16232
|
+
heights,
|
|
16233
|
+
toast2.id
|
|
16234
|
+
]);
|
|
16235
|
+
const closeButton = React16__namespace.default.useMemo(() => {
|
|
16236
|
+
var _toast_closeButton;
|
|
16237
|
+
return (_toast_closeButton = toast2.closeButton) != null ? _toast_closeButton : closeButtonFromToaster;
|
|
16238
|
+
}, [
|
|
16239
|
+
toast2.closeButton,
|
|
16240
|
+
closeButtonFromToaster
|
|
16241
|
+
]);
|
|
16242
|
+
const duration = React16__namespace.default.useMemo(() => toast2.duration || durationFromToaster || TOAST_LIFETIME, [
|
|
16243
|
+
toast2.duration,
|
|
16244
|
+
durationFromToaster
|
|
16245
|
+
]);
|
|
16246
|
+
const closeTimerStartTimeRef = React16__namespace.default.useRef(0);
|
|
16247
|
+
const offset = React16__namespace.default.useRef(0);
|
|
16248
|
+
const lastCloseTimerStartTimeRef = React16__namespace.default.useRef(0);
|
|
16249
|
+
const pointerStartRef = React16__namespace.default.useRef(null);
|
|
16250
|
+
const [y, x] = position.split("-");
|
|
16251
|
+
const toastsHeightBefore = React16__namespace.default.useMemo(() => {
|
|
16252
|
+
return heights.reduce((prev, curr, reducerIndex) => {
|
|
16253
|
+
if (reducerIndex >= heightIndex) {
|
|
16254
|
+
return prev;
|
|
16255
|
+
}
|
|
16256
|
+
return prev + curr.height;
|
|
16257
|
+
}, 0);
|
|
16258
|
+
}, [
|
|
16259
|
+
heights,
|
|
16260
|
+
heightIndex
|
|
16261
|
+
]);
|
|
16262
|
+
const isDocumentHidden = useIsDocumentHidden();
|
|
16263
|
+
const invert = toast2.invert || ToasterInvert;
|
|
16264
|
+
const disabled = toastType === "loading";
|
|
16265
|
+
offset.current = React16__namespace.default.useMemo(() => heightIndex * gap + toastsHeightBefore, [
|
|
16266
|
+
heightIndex,
|
|
16267
|
+
toastsHeightBefore
|
|
16268
|
+
]);
|
|
16269
|
+
React16__namespace.default.useEffect(() => {
|
|
16270
|
+
remainingTime.current = duration;
|
|
16271
|
+
}, [
|
|
16272
|
+
duration
|
|
16273
|
+
]);
|
|
16274
|
+
React16__namespace.default.useEffect(() => {
|
|
16275
|
+
setMounted(true);
|
|
16276
|
+
}, []);
|
|
16277
|
+
React16__namespace.default.useEffect(() => {
|
|
16278
|
+
const toastNode = toastRef.current;
|
|
16279
|
+
if (toastNode) {
|
|
16280
|
+
const height = toastNode.getBoundingClientRect().height;
|
|
16281
|
+
setInitialHeight(height);
|
|
16282
|
+
setHeights((h) => [
|
|
16283
|
+
{
|
|
16284
|
+
toastId: toast2.id,
|
|
16285
|
+
height,
|
|
16286
|
+
position: toast2.position
|
|
16287
|
+
},
|
|
16288
|
+
...h
|
|
16289
|
+
]);
|
|
16290
|
+
return () => setHeights((h) => h.filter((height2) => height2.toastId !== toast2.id));
|
|
16291
|
+
}
|
|
16292
|
+
}, [
|
|
16293
|
+
setHeights,
|
|
16294
|
+
toast2.id
|
|
16295
|
+
]);
|
|
16296
|
+
React16__namespace.default.useLayoutEffect(() => {
|
|
16297
|
+
if (!mounted) return;
|
|
16298
|
+
const toastNode = toastRef.current;
|
|
16299
|
+
const originalHeight = toastNode.style.height;
|
|
16300
|
+
toastNode.style.height = "auto";
|
|
16301
|
+
const newHeight = toastNode.getBoundingClientRect().height;
|
|
16302
|
+
toastNode.style.height = originalHeight;
|
|
16303
|
+
setInitialHeight(newHeight);
|
|
16304
|
+
setHeights((heights2) => {
|
|
16305
|
+
const alreadyExists = heights2.find((height) => height.toastId === toast2.id);
|
|
16306
|
+
if (!alreadyExists) {
|
|
16307
|
+
return [
|
|
16308
|
+
{
|
|
16309
|
+
toastId: toast2.id,
|
|
16310
|
+
height: newHeight,
|
|
16311
|
+
position: toast2.position
|
|
16312
|
+
},
|
|
16313
|
+
...heights2
|
|
16314
|
+
];
|
|
16315
|
+
} else {
|
|
16316
|
+
return heights2.map((height) => height.toastId === toast2.id ? {
|
|
16317
|
+
...height,
|
|
16318
|
+
height: newHeight
|
|
16319
|
+
} : height);
|
|
16320
|
+
}
|
|
16321
|
+
});
|
|
16322
|
+
}, [
|
|
16323
|
+
mounted,
|
|
16324
|
+
toast2.title,
|
|
16325
|
+
toast2.description,
|
|
16326
|
+
setHeights,
|
|
16327
|
+
toast2.id,
|
|
16328
|
+
toast2.jsx,
|
|
16329
|
+
toast2.action,
|
|
16330
|
+
toast2.cancel
|
|
16331
|
+
]);
|
|
16332
|
+
const deleteToast = React16__namespace.default.useCallback(() => {
|
|
16333
|
+
setRemoved(true);
|
|
16334
|
+
setOffsetBeforeRemove(offset.current);
|
|
16335
|
+
setHeights((h) => h.filter((height) => height.toastId !== toast2.id));
|
|
16336
|
+
setTimeout(() => {
|
|
16337
|
+
removeToast(toast2);
|
|
16338
|
+
}, TIME_BEFORE_UNMOUNT);
|
|
16339
|
+
}, [
|
|
16340
|
+
toast2,
|
|
16341
|
+
removeToast,
|
|
16342
|
+
setHeights,
|
|
16343
|
+
offset
|
|
16344
|
+
]);
|
|
16345
|
+
React16__namespace.default.useEffect(() => {
|
|
16346
|
+
if (toast2.promise && toastType === "loading" || toast2.duration === Infinity || toast2.type === "loading") return;
|
|
16347
|
+
let timeoutId;
|
|
16348
|
+
const pauseTimer = () => {
|
|
16349
|
+
if (lastCloseTimerStartTimeRef.current < closeTimerStartTimeRef.current) {
|
|
16350
|
+
const elapsedTime = (/* @__PURE__ */ new Date()).getTime() - closeTimerStartTimeRef.current;
|
|
16351
|
+
remainingTime.current = remainingTime.current - elapsedTime;
|
|
16352
|
+
}
|
|
16353
|
+
lastCloseTimerStartTimeRef.current = (/* @__PURE__ */ new Date()).getTime();
|
|
16354
|
+
};
|
|
16355
|
+
const startTimer = () => {
|
|
16356
|
+
if (remainingTime.current === Infinity) return;
|
|
16357
|
+
closeTimerStartTimeRef.current = (/* @__PURE__ */ new Date()).getTime();
|
|
16358
|
+
timeoutId = setTimeout(() => {
|
|
16359
|
+
toast2.onAutoClose == null ? void 0 : toast2.onAutoClose.call(toast2, toast2);
|
|
16360
|
+
deleteToast();
|
|
16361
|
+
}, remainingTime.current);
|
|
16362
|
+
};
|
|
16363
|
+
if (expanded || interacting || isDocumentHidden) {
|
|
16364
|
+
pauseTimer();
|
|
16365
|
+
} else {
|
|
16366
|
+
startTimer();
|
|
16367
|
+
}
|
|
16368
|
+
return () => clearTimeout(timeoutId);
|
|
16369
|
+
}, [
|
|
16370
|
+
expanded,
|
|
16371
|
+
interacting,
|
|
16372
|
+
toast2,
|
|
16373
|
+
toastType,
|
|
16374
|
+
isDocumentHidden,
|
|
16375
|
+
deleteToast
|
|
16376
|
+
]);
|
|
16377
|
+
React16__namespace.default.useEffect(() => {
|
|
16378
|
+
if (toast2.delete) {
|
|
16379
|
+
deleteToast();
|
|
16380
|
+
toast2.onDismiss == null ? void 0 : toast2.onDismiss.call(toast2, toast2);
|
|
16381
|
+
}
|
|
16382
|
+
}, [
|
|
16383
|
+
deleteToast,
|
|
16384
|
+
toast2.delete
|
|
16385
|
+
]);
|
|
16386
|
+
function getLoadingIcon() {
|
|
16387
|
+
var _toast_classNames9;
|
|
16388
|
+
if (icons == null ? void 0 : icons.loading) {
|
|
16389
|
+
var _toast_classNames12;
|
|
16390
|
+
return /* @__PURE__ */ React16__namespace.default.createElement("div", {
|
|
16391
|
+
className: cn2(classNames == null ? void 0 : classNames.loader, toast2 == null ? void 0 : (_toast_classNames12 = toast2.classNames) == null ? void 0 : _toast_classNames12.loader, "sonner-loader"),
|
|
16392
|
+
"data-visible": toastType === "loading"
|
|
16393
|
+
}, icons.loading);
|
|
16394
|
+
}
|
|
16395
|
+
return /* @__PURE__ */ React16__namespace.default.createElement(Loader, {
|
|
16396
|
+
className: cn2(classNames == null ? void 0 : classNames.loader, toast2 == null ? void 0 : (_toast_classNames9 = toast2.classNames) == null ? void 0 : _toast_classNames9.loader),
|
|
16397
|
+
visible: toastType === "loading"
|
|
16398
|
+
});
|
|
16399
|
+
}
|
|
16400
|
+
const icon = toast2.icon || (icons == null ? void 0 : icons[toastType]) || getAsset(toastType);
|
|
16401
|
+
var _toast_richColors, _icons_close;
|
|
16402
|
+
return /* @__PURE__ */ React16__namespace.default.createElement("li", {
|
|
16403
|
+
tabIndex: 0,
|
|
16404
|
+
ref: toastRef,
|
|
16405
|
+
className: cn2(className, toastClassname, classNames == null ? void 0 : classNames.toast, toast2 == null ? void 0 : (_toast_classNames = toast2.classNames) == null ? void 0 : _toast_classNames.toast, classNames == null ? void 0 : classNames.default, classNames == null ? void 0 : classNames[toastType], toast2 == null ? void 0 : (_toast_classNames1 = toast2.classNames) == null ? void 0 : _toast_classNames1[toastType]),
|
|
16406
|
+
"data-sonner-toast": "",
|
|
16407
|
+
"data-rich-colors": (_toast_richColors = toast2.richColors) != null ? _toast_richColors : defaultRichColors,
|
|
16408
|
+
"data-styled": !Boolean(toast2.jsx || toast2.unstyled || unstyled),
|
|
16409
|
+
"data-mounted": mounted,
|
|
16410
|
+
"data-promise": Boolean(toast2.promise),
|
|
16411
|
+
"data-swiped": isSwiped,
|
|
16412
|
+
"data-removed": removed,
|
|
16413
|
+
"data-visible": isVisible,
|
|
16414
|
+
"data-y-position": y,
|
|
16415
|
+
"data-x-position": x,
|
|
16416
|
+
"data-index": index,
|
|
16417
|
+
"data-front": isFront,
|
|
16418
|
+
"data-swiping": swiping,
|
|
16419
|
+
"data-dismissible": dismissible,
|
|
16420
|
+
"data-type": toastType,
|
|
16421
|
+
"data-invert": invert,
|
|
16422
|
+
"data-swipe-out": swipeOut,
|
|
16423
|
+
"data-swipe-direction": swipeOutDirection,
|
|
16424
|
+
"data-expanded": Boolean(expanded || expandByDefault && mounted),
|
|
16425
|
+
"data-testid": toast2.testId,
|
|
16426
|
+
style: {
|
|
16427
|
+
"--index": index,
|
|
16428
|
+
"--toasts-before": index,
|
|
16429
|
+
"--z-index": toasts.length - index,
|
|
16430
|
+
"--offset": `${removed ? offsetBeforeRemove : offset.current}px`,
|
|
16431
|
+
"--initial-height": expandByDefault ? "auto" : `${initialHeight}px`,
|
|
16432
|
+
...style,
|
|
16433
|
+
...toast2.style
|
|
16434
|
+
},
|
|
16435
|
+
onDragEnd: () => {
|
|
16436
|
+
setSwiping(false);
|
|
16437
|
+
setSwipeDirection(null);
|
|
16438
|
+
pointerStartRef.current = null;
|
|
16439
|
+
},
|
|
16440
|
+
onPointerDown: (event) => {
|
|
16441
|
+
if (event.button === 2) return;
|
|
16442
|
+
if (disabled || !dismissible) return;
|
|
16443
|
+
dragStartTime.current = /* @__PURE__ */ new Date();
|
|
16444
|
+
setOffsetBeforeRemove(offset.current);
|
|
16445
|
+
event.target.setPointerCapture(event.pointerId);
|
|
16446
|
+
if (event.target.tagName === "BUTTON") return;
|
|
16447
|
+
setSwiping(true);
|
|
16448
|
+
pointerStartRef.current = {
|
|
16449
|
+
x: event.clientX,
|
|
16450
|
+
y: event.clientY
|
|
16451
|
+
};
|
|
16452
|
+
},
|
|
16453
|
+
onPointerUp: () => {
|
|
16454
|
+
var _toastRef_current, _toastRef_current1, _dragStartTime_current;
|
|
16455
|
+
if (swipeOut || !dismissible) return;
|
|
16456
|
+
pointerStartRef.current = null;
|
|
16457
|
+
const swipeAmountX = Number(((_toastRef_current = toastRef.current) == null ? void 0 : _toastRef_current.style.getPropertyValue("--swipe-amount-x").replace("px", "")) || 0);
|
|
16458
|
+
const swipeAmountY = Number(((_toastRef_current1 = toastRef.current) == null ? void 0 : _toastRef_current1.style.getPropertyValue("--swipe-amount-y").replace("px", "")) || 0);
|
|
16459
|
+
const timeTaken = (/* @__PURE__ */ new Date()).getTime() - ((_dragStartTime_current = dragStartTime.current) == null ? void 0 : _dragStartTime_current.getTime());
|
|
16460
|
+
const swipeAmount = swipeDirection === "x" ? swipeAmountX : swipeAmountY;
|
|
16461
|
+
const velocity = Math.abs(swipeAmount) / timeTaken;
|
|
16462
|
+
if (Math.abs(swipeAmount) >= SWIPE_THRESHOLD || velocity > 0.11) {
|
|
16463
|
+
setOffsetBeforeRemove(offset.current);
|
|
16464
|
+
toast2.onDismiss == null ? void 0 : toast2.onDismiss.call(toast2, toast2);
|
|
16465
|
+
if (swipeDirection === "x") {
|
|
16466
|
+
setSwipeOutDirection(swipeAmountX > 0 ? "right" : "left");
|
|
16467
|
+
} else {
|
|
16468
|
+
setSwipeOutDirection(swipeAmountY > 0 ? "down" : "up");
|
|
16469
|
+
}
|
|
16470
|
+
deleteToast();
|
|
16471
|
+
setSwipeOut(true);
|
|
16472
|
+
return;
|
|
16473
|
+
} else {
|
|
16474
|
+
var _toastRef_current2, _toastRef_current3;
|
|
16475
|
+
(_toastRef_current2 = toastRef.current) == null ? void 0 : _toastRef_current2.style.setProperty("--swipe-amount-x", `0px`);
|
|
16476
|
+
(_toastRef_current3 = toastRef.current) == null ? void 0 : _toastRef_current3.style.setProperty("--swipe-amount-y", `0px`);
|
|
16477
|
+
}
|
|
16478
|
+
setIsSwiped(false);
|
|
16479
|
+
setSwiping(false);
|
|
16480
|
+
setSwipeDirection(null);
|
|
16481
|
+
},
|
|
16482
|
+
onPointerMove: (event) => {
|
|
16483
|
+
var _window_getSelection, _toastRef_current, _toastRef_current1;
|
|
16484
|
+
if (!pointerStartRef.current || !dismissible) return;
|
|
16485
|
+
const isHighlighted = ((_window_getSelection = window.getSelection()) == null ? void 0 : _window_getSelection.toString().length) > 0;
|
|
16486
|
+
if (isHighlighted) return;
|
|
16487
|
+
const yDelta = event.clientY - pointerStartRef.current.y;
|
|
16488
|
+
const xDelta = event.clientX - pointerStartRef.current.x;
|
|
16489
|
+
var _props_swipeDirections;
|
|
16490
|
+
const swipeDirections = (_props_swipeDirections = props.swipeDirections) != null ? _props_swipeDirections : getDefaultSwipeDirections(position);
|
|
16491
|
+
if (!swipeDirection && (Math.abs(xDelta) > 1 || Math.abs(yDelta) > 1)) {
|
|
16492
|
+
setSwipeDirection(Math.abs(xDelta) > Math.abs(yDelta) ? "x" : "y");
|
|
16493
|
+
}
|
|
16494
|
+
let swipeAmount = {
|
|
16495
|
+
x: 0,
|
|
16496
|
+
y: 0
|
|
16497
|
+
};
|
|
16498
|
+
const getDampening = (delta) => {
|
|
16499
|
+
const factor = Math.abs(delta) / 20;
|
|
16500
|
+
return 1 / (1.5 + factor);
|
|
16501
|
+
};
|
|
16502
|
+
if (swipeDirection === "y") {
|
|
16503
|
+
if (swipeDirections.includes("top") || swipeDirections.includes("bottom")) {
|
|
16504
|
+
if (swipeDirections.includes("top") && yDelta < 0 || swipeDirections.includes("bottom") && yDelta > 0) {
|
|
16505
|
+
swipeAmount.y = yDelta;
|
|
16506
|
+
} else {
|
|
16507
|
+
const dampenedDelta = yDelta * getDampening(yDelta);
|
|
16508
|
+
swipeAmount.y = Math.abs(dampenedDelta) < Math.abs(yDelta) ? dampenedDelta : yDelta;
|
|
16509
|
+
}
|
|
16510
|
+
}
|
|
16511
|
+
} else if (swipeDirection === "x") {
|
|
16512
|
+
if (swipeDirections.includes("left") || swipeDirections.includes("right")) {
|
|
16513
|
+
if (swipeDirections.includes("left") && xDelta < 0 || swipeDirections.includes("right") && xDelta > 0) {
|
|
16514
|
+
swipeAmount.x = xDelta;
|
|
16515
|
+
} else {
|
|
16516
|
+
const dampenedDelta = xDelta * getDampening(xDelta);
|
|
16517
|
+
swipeAmount.x = Math.abs(dampenedDelta) < Math.abs(xDelta) ? dampenedDelta : xDelta;
|
|
16518
|
+
}
|
|
16519
|
+
}
|
|
16520
|
+
}
|
|
16521
|
+
if (Math.abs(swipeAmount.x) > 0 || Math.abs(swipeAmount.y) > 0) {
|
|
16522
|
+
setIsSwiped(true);
|
|
16523
|
+
}
|
|
16524
|
+
(_toastRef_current = toastRef.current) == null ? void 0 : _toastRef_current.style.setProperty("--swipe-amount-x", `${swipeAmount.x}px`);
|
|
16525
|
+
(_toastRef_current1 = toastRef.current) == null ? void 0 : _toastRef_current1.style.setProperty("--swipe-amount-y", `${swipeAmount.y}px`);
|
|
16526
|
+
}
|
|
16527
|
+
}, closeButton && !toast2.jsx && toastType !== "loading" ? /* @__PURE__ */ React16__namespace.default.createElement("button", {
|
|
16528
|
+
"aria-label": closeButtonAriaLabel,
|
|
16529
|
+
"data-disabled": disabled,
|
|
16530
|
+
"data-close-button": true,
|
|
16531
|
+
onClick: disabled || !dismissible ? () => {
|
|
16532
|
+
} : () => {
|
|
16533
|
+
deleteToast();
|
|
16534
|
+
toast2.onDismiss == null ? void 0 : toast2.onDismiss.call(toast2, toast2);
|
|
16535
|
+
},
|
|
16536
|
+
className: cn2(classNames == null ? void 0 : classNames.closeButton, toast2 == null ? void 0 : (_toast_classNames2 = toast2.classNames) == null ? void 0 : _toast_classNames2.closeButton)
|
|
16537
|
+
}, (_icons_close = icons == null ? void 0 : icons.close) != null ? _icons_close : CloseIcon) : null, (toastType || toast2.icon || toast2.promise) && toast2.icon !== null && ((icons == null ? void 0 : icons[toastType]) !== null || toast2.icon) ? /* @__PURE__ */ React16__namespace.default.createElement("div", {
|
|
16538
|
+
"data-icon": "",
|
|
16539
|
+
className: cn2(classNames == null ? void 0 : classNames.icon, toast2 == null ? void 0 : (_toast_classNames3 = toast2.classNames) == null ? void 0 : _toast_classNames3.icon)
|
|
16540
|
+
}, toast2.promise || toast2.type === "loading" && !toast2.icon ? toast2.icon || getLoadingIcon() : null, toast2.type !== "loading" ? icon : null) : null, /* @__PURE__ */ React16__namespace.default.createElement("div", {
|
|
16541
|
+
"data-content": "",
|
|
16542
|
+
className: cn2(classNames == null ? void 0 : classNames.content, toast2 == null ? void 0 : (_toast_classNames4 = toast2.classNames) == null ? void 0 : _toast_classNames4.content)
|
|
16543
|
+
}, /* @__PURE__ */ React16__namespace.default.createElement("div", {
|
|
16544
|
+
"data-title": "",
|
|
16545
|
+
className: cn2(classNames == null ? void 0 : classNames.title, toast2 == null ? void 0 : (_toast_classNames5 = toast2.classNames) == null ? void 0 : _toast_classNames5.title)
|
|
16546
|
+
}, toast2.jsx ? toast2.jsx : typeof toast2.title === "function" ? toast2.title() : toast2.title), toast2.description ? /* @__PURE__ */ React16__namespace.default.createElement("div", {
|
|
16547
|
+
"data-description": "",
|
|
16548
|
+
className: cn2(descriptionClassName, toastDescriptionClassname, classNames == null ? void 0 : classNames.description, toast2 == null ? void 0 : (_toast_classNames6 = toast2.classNames) == null ? void 0 : _toast_classNames6.description)
|
|
16549
|
+
}, typeof toast2.description === "function" ? toast2.description() : toast2.description) : null), /* @__PURE__ */ React16__namespace.default.isValidElement(toast2.cancel) ? toast2.cancel : toast2.cancel && isAction(toast2.cancel) ? /* @__PURE__ */ React16__namespace.default.createElement("button", {
|
|
16550
|
+
"data-button": true,
|
|
16551
|
+
"data-cancel": true,
|
|
16552
|
+
style: toast2.cancelButtonStyle || cancelButtonStyle,
|
|
16553
|
+
onClick: (event) => {
|
|
16554
|
+
if (!isAction(toast2.cancel)) return;
|
|
16555
|
+
if (!dismissible) return;
|
|
16556
|
+
toast2.cancel.onClick == null ? void 0 : toast2.cancel.onClick.call(toast2.cancel, event);
|
|
16557
|
+
deleteToast();
|
|
16558
|
+
},
|
|
16559
|
+
className: cn2(classNames == null ? void 0 : classNames.cancelButton, toast2 == null ? void 0 : (_toast_classNames7 = toast2.classNames) == null ? void 0 : _toast_classNames7.cancelButton)
|
|
16560
|
+
}, toast2.cancel.label) : null, /* @__PURE__ */ React16__namespace.default.isValidElement(toast2.action) ? toast2.action : toast2.action && isAction(toast2.action) ? /* @__PURE__ */ React16__namespace.default.createElement("button", {
|
|
16561
|
+
"data-button": true,
|
|
16562
|
+
"data-action": true,
|
|
16563
|
+
style: toast2.actionButtonStyle || actionButtonStyle,
|
|
16564
|
+
onClick: (event) => {
|
|
16565
|
+
if (!isAction(toast2.action)) return;
|
|
16566
|
+
toast2.action.onClick == null ? void 0 : toast2.action.onClick.call(toast2.action, event);
|
|
16567
|
+
if (event.defaultPrevented) return;
|
|
16568
|
+
deleteToast();
|
|
16569
|
+
},
|
|
16570
|
+
className: cn2(classNames == null ? void 0 : classNames.actionButton, toast2 == null ? void 0 : (_toast_classNames8 = toast2.classNames) == null ? void 0 : _toast_classNames8.actionButton)
|
|
16571
|
+
}, toast2.action.label) : null);
|
|
16572
|
+
};
|
|
16573
|
+
function getDocumentDirection() {
|
|
16574
|
+
if (typeof window === "undefined") return "ltr";
|
|
16575
|
+
if (typeof document === "undefined") return "ltr";
|
|
16576
|
+
const dirAttribute = document.documentElement.getAttribute("dir");
|
|
16577
|
+
if (dirAttribute === "auto" || !dirAttribute) {
|
|
16578
|
+
return window.getComputedStyle(document.documentElement).direction;
|
|
16579
|
+
}
|
|
16580
|
+
return dirAttribute;
|
|
16581
|
+
}
|
|
16582
|
+
function assignOffset(defaultOffset, mobileOffset) {
|
|
16583
|
+
const styles = {};
|
|
16584
|
+
[
|
|
16585
|
+
defaultOffset,
|
|
16586
|
+
mobileOffset
|
|
16587
|
+
].forEach((offset, index) => {
|
|
16588
|
+
const isMobile = index === 1;
|
|
16589
|
+
const prefix = isMobile ? "--mobile-offset" : "--offset";
|
|
16590
|
+
const defaultValue = isMobile ? MOBILE_VIEWPORT_OFFSET : VIEWPORT_OFFSET;
|
|
16591
|
+
function assignAll(offset2) {
|
|
16592
|
+
[
|
|
16593
|
+
"top",
|
|
16594
|
+
"right",
|
|
16595
|
+
"bottom",
|
|
16596
|
+
"left"
|
|
16597
|
+
].forEach((key) => {
|
|
16598
|
+
styles[`${prefix}-${key}`] = typeof offset2 === "number" ? `${offset2}px` : offset2;
|
|
16599
|
+
});
|
|
16600
|
+
}
|
|
16601
|
+
if (typeof offset === "number" || typeof offset === "string") {
|
|
16602
|
+
assignAll(offset);
|
|
16603
|
+
} else if (typeof offset === "object") {
|
|
16604
|
+
[
|
|
16605
|
+
"top",
|
|
16606
|
+
"right",
|
|
16607
|
+
"bottom",
|
|
16608
|
+
"left"
|
|
16609
|
+
].forEach((key) => {
|
|
16610
|
+
if (offset[key] === void 0) {
|
|
16611
|
+
styles[`${prefix}-${key}`] = defaultValue;
|
|
16612
|
+
} else {
|
|
16613
|
+
styles[`${prefix}-${key}`] = typeof offset[key] === "number" ? `${offset[key]}px` : offset[key];
|
|
16614
|
+
}
|
|
16615
|
+
});
|
|
16616
|
+
} else {
|
|
16617
|
+
assignAll(defaultValue);
|
|
16618
|
+
}
|
|
16619
|
+
});
|
|
16620
|
+
return styles;
|
|
16621
|
+
}
|
|
16622
|
+
var Toaster = /* @__PURE__ */ React16__namespace.default.forwardRef(function Toaster2(props, ref) {
|
|
16623
|
+
const { id, invert, position = "bottom-right", hotkey = [
|
|
16624
|
+
"altKey",
|
|
16625
|
+
"KeyT"
|
|
16626
|
+
], expand, closeButton, className, offset, mobileOffset, theme = "light", richColors, duration, style, visibleToasts = VISIBLE_TOASTS_AMOUNT, toastOptions, dir = getDocumentDirection(), gap = GAP, icons, containerAriaLabel = "Notifications" } = props;
|
|
16627
|
+
const [toasts, setToasts] = React16__namespace.default.useState([]);
|
|
16628
|
+
const filteredToasts = React16__namespace.default.useMemo(() => {
|
|
16629
|
+
if (id) {
|
|
16630
|
+
return toasts.filter((toast2) => toast2.toasterId === id);
|
|
16631
|
+
}
|
|
16632
|
+
return toasts.filter((toast2) => !toast2.toasterId);
|
|
16633
|
+
}, [
|
|
16634
|
+
toasts,
|
|
16635
|
+
id
|
|
16636
|
+
]);
|
|
16637
|
+
const possiblePositions = React16__namespace.default.useMemo(() => {
|
|
16638
|
+
return Array.from(new Set([
|
|
16639
|
+
position
|
|
16640
|
+
].concat(filteredToasts.filter((toast2) => toast2.position).map((toast2) => toast2.position))));
|
|
16641
|
+
}, [
|
|
16642
|
+
filteredToasts,
|
|
16643
|
+
position
|
|
16644
|
+
]);
|
|
16645
|
+
const [heights, setHeights] = React16__namespace.default.useState([]);
|
|
16646
|
+
const [expanded, setExpanded] = React16__namespace.default.useState(false);
|
|
16647
|
+
const [interacting, setInteracting] = React16__namespace.default.useState(false);
|
|
16648
|
+
const [actualTheme, setActualTheme] = React16__namespace.default.useState(theme !== "system" ? theme : typeof window !== "undefined" ? window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light" : "light");
|
|
16649
|
+
const listRef = React16__namespace.default.useRef(null);
|
|
16650
|
+
const hotkeyLabel = hotkey.join("+").replace(/Key/g, "").replace(/Digit/g, "");
|
|
16651
|
+
const lastFocusedElementRef = React16__namespace.default.useRef(null);
|
|
16652
|
+
const isFocusWithinRef = React16__namespace.default.useRef(false);
|
|
16653
|
+
const removeToast = React16__namespace.default.useCallback((toastToRemove) => {
|
|
16654
|
+
setToasts((toasts2) => {
|
|
16655
|
+
var _toasts_find;
|
|
16656
|
+
if (!((_toasts_find = toasts2.find((toast2) => toast2.id === toastToRemove.id)) == null ? void 0 : _toasts_find.delete)) {
|
|
16657
|
+
ToastState.dismiss(toastToRemove.id);
|
|
16658
|
+
}
|
|
16659
|
+
return toasts2.filter(({ id: id2 }) => id2 !== toastToRemove.id);
|
|
16660
|
+
});
|
|
16661
|
+
}, []);
|
|
16662
|
+
React16__namespace.default.useEffect(() => {
|
|
16663
|
+
return ToastState.subscribe((toast2) => {
|
|
16664
|
+
if (toast2.dismiss) {
|
|
16665
|
+
requestAnimationFrame(() => {
|
|
16666
|
+
setToasts((toasts2) => toasts2.map((t) => t.id === toast2.id ? {
|
|
16667
|
+
...t,
|
|
16668
|
+
delete: true
|
|
16669
|
+
} : t));
|
|
16670
|
+
});
|
|
16671
|
+
return;
|
|
16672
|
+
}
|
|
16673
|
+
setTimeout(() => {
|
|
16674
|
+
ReactDOM__default.default.flushSync(() => {
|
|
16675
|
+
setToasts((toasts2) => {
|
|
16676
|
+
const indexOfExistingToast = toasts2.findIndex((t) => t.id === toast2.id);
|
|
16677
|
+
if (indexOfExistingToast !== -1) {
|
|
16678
|
+
return [
|
|
16679
|
+
...toasts2.slice(0, indexOfExistingToast),
|
|
16680
|
+
{
|
|
16681
|
+
...toasts2[indexOfExistingToast],
|
|
16682
|
+
...toast2
|
|
16683
|
+
},
|
|
16684
|
+
...toasts2.slice(indexOfExistingToast + 1)
|
|
16685
|
+
];
|
|
16686
|
+
}
|
|
16687
|
+
return [
|
|
16688
|
+
toast2,
|
|
16689
|
+
...toasts2
|
|
16690
|
+
];
|
|
16691
|
+
});
|
|
16692
|
+
});
|
|
16693
|
+
});
|
|
16694
|
+
});
|
|
16695
|
+
}, [
|
|
16696
|
+
toasts
|
|
16697
|
+
]);
|
|
16698
|
+
React16__namespace.default.useEffect(() => {
|
|
16699
|
+
if (theme !== "system") {
|
|
16700
|
+
setActualTheme(theme);
|
|
16701
|
+
return;
|
|
16702
|
+
}
|
|
16703
|
+
if (theme === "system") {
|
|
16704
|
+
if (window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) {
|
|
16705
|
+
setActualTheme("dark");
|
|
16706
|
+
} else {
|
|
16707
|
+
setActualTheme("light");
|
|
16708
|
+
}
|
|
16709
|
+
}
|
|
16710
|
+
if (typeof window === "undefined") return;
|
|
16711
|
+
const darkMediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
|
|
16712
|
+
try {
|
|
16713
|
+
darkMediaQuery.addEventListener("change", ({ matches }) => {
|
|
16714
|
+
if (matches) {
|
|
16715
|
+
setActualTheme("dark");
|
|
16716
|
+
} else {
|
|
16717
|
+
setActualTheme("light");
|
|
16718
|
+
}
|
|
16719
|
+
});
|
|
16720
|
+
} catch (error) {
|
|
16721
|
+
darkMediaQuery.addListener(({ matches }) => {
|
|
16722
|
+
try {
|
|
16723
|
+
if (matches) {
|
|
16724
|
+
setActualTheme("dark");
|
|
16725
|
+
} else {
|
|
16726
|
+
setActualTheme("light");
|
|
16727
|
+
}
|
|
16728
|
+
} catch (e) {
|
|
16729
|
+
console.error(e);
|
|
16730
|
+
}
|
|
16731
|
+
});
|
|
16732
|
+
}
|
|
16733
|
+
}, [
|
|
16734
|
+
theme
|
|
16735
|
+
]);
|
|
16736
|
+
React16__namespace.default.useEffect(() => {
|
|
16737
|
+
if (toasts.length <= 1) {
|
|
16738
|
+
setExpanded(false);
|
|
16739
|
+
}
|
|
16740
|
+
}, [
|
|
16741
|
+
toasts
|
|
16742
|
+
]);
|
|
16743
|
+
React16__namespace.default.useEffect(() => {
|
|
16744
|
+
const handleKeyDown = (event) => {
|
|
16745
|
+
var _listRef_current;
|
|
16746
|
+
const isHotkeyPressed = hotkey.every((key) => event[key] || event.code === key);
|
|
16747
|
+
if (isHotkeyPressed) {
|
|
16748
|
+
var _listRef_current1;
|
|
16749
|
+
setExpanded(true);
|
|
16750
|
+
(_listRef_current1 = listRef.current) == null ? void 0 : _listRef_current1.focus();
|
|
16751
|
+
}
|
|
16752
|
+
if (event.code === "Escape" && (document.activeElement === listRef.current || ((_listRef_current = listRef.current) == null ? void 0 : _listRef_current.contains(document.activeElement)))) {
|
|
16753
|
+
setExpanded(false);
|
|
16754
|
+
}
|
|
16755
|
+
};
|
|
16756
|
+
document.addEventListener("keydown", handleKeyDown);
|
|
16757
|
+
return () => document.removeEventListener("keydown", handleKeyDown);
|
|
16758
|
+
}, [
|
|
16759
|
+
hotkey
|
|
16760
|
+
]);
|
|
16761
|
+
React16__namespace.default.useEffect(() => {
|
|
16762
|
+
if (listRef.current) {
|
|
16763
|
+
return () => {
|
|
16764
|
+
if (lastFocusedElementRef.current) {
|
|
16765
|
+
lastFocusedElementRef.current.focus({
|
|
16766
|
+
preventScroll: true
|
|
16767
|
+
});
|
|
16768
|
+
lastFocusedElementRef.current = null;
|
|
16769
|
+
isFocusWithinRef.current = false;
|
|
16770
|
+
}
|
|
16771
|
+
};
|
|
16772
|
+
}
|
|
16773
|
+
}, [
|
|
16774
|
+
listRef.current
|
|
16775
|
+
]);
|
|
16776
|
+
return (
|
|
16777
|
+
// Remove item from normal navigation flow, only available via hotkey
|
|
16778
|
+
/* @__PURE__ */ React16__namespace.default.createElement("section", {
|
|
16779
|
+
ref,
|
|
16780
|
+
"aria-label": `${containerAriaLabel} ${hotkeyLabel}`,
|
|
16781
|
+
tabIndex: -1,
|
|
16782
|
+
"aria-live": "polite",
|
|
16783
|
+
"aria-relevant": "additions text",
|
|
16784
|
+
"aria-atomic": "false",
|
|
16785
|
+
suppressHydrationWarning: true
|
|
16786
|
+
}, possiblePositions.map((position2, index) => {
|
|
16787
|
+
var _heights_;
|
|
16788
|
+
const [y, x] = position2.split("-");
|
|
16789
|
+
if (!filteredToasts.length) return null;
|
|
16790
|
+
return /* @__PURE__ */ React16__namespace.default.createElement("ol", {
|
|
16791
|
+
key: position2,
|
|
16792
|
+
dir: dir === "auto" ? getDocumentDirection() : dir,
|
|
16793
|
+
tabIndex: -1,
|
|
16794
|
+
ref: listRef,
|
|
16795
|
+
className,
|
|
16796
|
+
"data-sonner-toaster": true,
|
|
16797
|
+
"data-sonner-theme": actualTheme,
|
|
16798
|
+
"data-y-position": y,
|
|
16799
|
+
"data-x-position": x,
|
|
16800
|
+
style: {
|
|
16801
|
+
"--front-toast-height": `${((_heights_ = heights[0]) == null ? void 0 : _heights_.height) || 0}px`,
|
|
16802
|
+
"--width": `${TOAST_WIDTH}px`,
|
|
16803
|
+
"--gap": `${gap}px`,
|
|
16804
|
+
...style,
|
|
16805
|
+
...assignOffset(offset, mobileOffset)
|
|
16806
|
+
},
|
|
16807
|
+
onBlur: (event) => {
|
|
16808
|
+
if (isFocusWithinRef.current && !event.currentTarget.contains(event.relatedTarget)) {
|
|
16809
|
+
isFocusWithinRef.current = false;
|
|
16810
|
+
if (lastFocusedElementRef.current) {
|
|
16811
|
+
lastFocusedElementRef.current.focus({
|
|
16812
|
+
preventScroll: true
|
|
16813
|
+
});
|
|
16814
|
+
lastFocusedElementRef.current = null;
|
|
16815
|
+
}
|
|
16816
|
+
}
|
|
16817
|
+
},
|
|
16818
|
+
onFocus: (event) => {
|
|
16819
|
+
const isNotDismissible = event.target instanceof HTMLElement && event.target.dataset.dismissible === "false";
|
|
16820
|
+
if (isNotDismissible) return;
|
|
16821
|
+
if (!isFocusWithinRef.current) {
|
|
16822
|
+
isFocusWithinRef.current = true;
|
|
16823
|
+
lastFocusedElementRef.current = event.relatedTarget;
|
|
16824
|
+
}
|
|
16825
|
+
},
|
|
16826
|
+
onMouseEnter: () => setExpanded(true),
|
|
16827
|
+
onMouseMove: () => setExpanded(true),
|
|
16828
|
+
onMouseLeave: () => {
|
|
16829
|
+
if (!interacting) {
|
|
16830
|
+
setExpanded(false);
|
|
16831
|
+
}
|
|
16832
|
+
},
|
|
16833
|
+
onDragEnd: () => setExpanded(false),
|
|
16834
|
+
onPointerDown: (event) => {
|
|
16835
|
+
const isNotDismissible = event.target instanceof HTMLElement && event.target.dataset.dismissible === "false";
|
|
16836
|
+
if (isNotDismissible) return;
|
|
16837
|
+
setInteracting(true);
|
|
16838
|
+
},
|
|
16839
|
+
onPointerUp: () => setInteracting(false)
|
|
16840
|
+
}, filteredToasts.filter((toast2) => !toast2.position && index === 0 || toast2.position === position2).map((toast2, index2) => {
|
|
16841
|
+
var _toastOptions_duration, _toastOptions_closeButton;
|
|
16842
|
+
return /* @__PURE__ */ React16__namespace.default.createElement(Toast, {
|
|
16843
|
+
key: toast2.id,
|
|
16844
|
+
icons,
|
|
16845
|
+
index: index2,
|
|
16846
|
+
toast: toast2,
|
|
16847
|
+
defaultRichColors: richColors,
|
|
16848
|
+
duration: (_toastOptions_duration = toastOptions == null ? void 0 : toastOptions.duration) != null ? _toastOptions_duration : duration,
|
|
16849
|
+
className: toastOptions == null ? void 0 : toastOptions.className,
|
|
16850
|
+
descriptionClassName: toastOptions == null ? void 0 : toastOptions.descriptionClassName,
|
|
16851
|
+
invert,
|
|
16852
|
+
visibleToasts,
|
|
16853
|
+
closeButton: (_toastOptions_closeButton = toastOptions == null ? void 0 : toastOptions.closeButton) != null ? _toastOptions_closeButton : closeButton,
|
|
16854
|
+
interacting,
|
|
16855
|
+
position: position2,
|
|
16856
|
+
style: toastOptions == null ? void 0 : toastOptions.style,
|
|
16857
|
+
unstyled: toastOptions == null ? void 0 : toastOptions.unstyled,
|
|
16858
|
+
classNames: toastOptions == null ? void 0 : toastOptions.classNames,
|
|
16859
|
+
cancelButtonStyle: toastOptions == null ? void 0 : toastOptions.cancelButtonStyle,
|
|
16860
|
+
actionButtonStyle: toastOptions == null ? void 0 : toastOptions.actionButtonStyle,
|
|
16861
|
+
closeButtonAriaLabel: toastOptions == null ? void 0 : toastOptions.closeButtonAriaLabel,
|
|
16862
|
+
removeToast,
|
|
16863
|
+
toasts: filteredToasts.filter((t) => t.position == toast2.position),
|
|
16864
|
+
heights: heights.filter((h) => h.position == toast2.position),
|
|
16865
|
+
setHeights,
|
|
16866
|
+
expandByDefault: expand,
|
|
16867
|
+
gap,
|
|
16868
|
+
expanded,
|
|
16869
|
+
swipeDirections: props.swipeDirections
|
|
16870
|
+
});
|
|
16871
|
+
}));
|
|
16872
|
+
}))
|
|
16873
|
+
);
|
|
16874
|
+
});
|
|
16875
|
+
var TTSButton = React16.memo(function TTSButton2({
|
|
16076
16876
|
text: text3,
|
|
16077
16877
|
onActiveChange,
|
|
16078
16878
|
className
|
|
16079
16879
|
}) {
|
|
16080
|
-
const [state, setState] =
|
|
16081
|
-
const [progress, setProgress] =
|
|
16082
|
-
const audioRef =
|
|
16083
|
-
const progressIntervalRef =
|
|
16084
|
-
|
|
16880
|
+
const [state, setState] = React16.useState("idle");
|
|
16881
|
+
const [progress, setProgress] = React16.useState(0);
|
|
16882
|
+
const audioRef = React16.useRef(null);
|
|
16883
|
+
const progressIntervalRef = React16.useRef(null);
|
|
16884
|
+
React16.useEffect(() => {
|
|
16085
16885
|
const active = state !== "idle" && state !== "error";
|
|
16086
16886
|
onActiveChange?.(active);
|
|
16087
16887
|
}, [state, onActiveChange]);
|
|
16088
|
-
const cleanup =
|
|
16888
|
+
const cleanup = React16.useCallback(() => {
|
|
16089
16889
|
if (progressIntervalRef.current) {
|
|
16090
16890
|
clearInterval(progressIntervalRef.current);
|
|
16091
16891
|
progressIntervalRef.current = null;
|
|
@@ -16097,8 +16897,8 @@ var TTSButton = React24.memo(function TTSButton2({
|
|
|
16097
16897
|
}
|
|
16098
16898
|
setProgress(0);
|
|
16099
16899
|
}, []);
|
|
16100
|
-
|
|
16101
|
-
const startProgressTracking =
|
|
16900
|
+
React16.useEffect(() => cleanup, [cleanup]);
|
|
16901
|
+
const startProgressTracking = React16.useCallback((audio) => {
|
|
16102
16902
|
if (progressIntervalRef.current) {
|
|
16103
16903
|
clearInterval(progressIntervalRef.current);
|
|
16104
16904
|
}
|
|
@@ -16108,7 +16908,7 @@ var TTSButton = React24.memo(function TTSButton2({
|
|
|
16108
16908
|
}
|
|
16109
16909
|
}, 100);
|
|
16110
16910
|
}, []);
|
|
16111
|
-
const handleClick =
|
|
16911
|
+
const handleClick = React16.useCallback(async () => {
|
|
16112
16912
|
if (state === "playing") {
|
|
16113
16913
|
audioRef.current?.pause();
|
|
16114
16914
|
if (progressIntervalRef.current) {
|
|
@@ -16156,7 +16956,7 @@ var TTSButton = React24.memo(function TTSButton2({
|
|
|
16156
16956
|
setTimeout(() => setState("idle"), 2e3);
|
|
16157
16957
|
}
|
|
16158
16958
|
}, [state, text3, cleanup, startProgressTracking]);
|
|
16159
|
-
const handleStop =
|
|
16959
|
+
const handleStop = React16.useCallback((e) => {
|
|
16160
16960
|
e.stopPropagation();
|
|
16161
16961
|
if (state === "playing" || state === "paused") {
|
|
16162
16962
|
cleanup();
|
|
@@ -16220,13 +17020,13 @@ var TTSButton = React24.memo(function TTSButton2({
|
|
|
16220
17020
|
}
|
|
16221
17021
|
) });
|
|
16222
17022
|
});
|
|
16223
|
-
var ThoughtBlockItem =
|
|
17023
|
+
var ThoughtBlockItem = React16.memo(function ThoughtBlockItem2({
|
|
16224
17024
|
content,
|
|
16225
17025
|
config,
|
|
16226
17026
|
skipImages = false
|
|
16227
17027
|
}) {
|
|
16228
|
-
const [expanded, setExpanded] =
|
|
16229
|
-
const lineCount =
|
|
17028
|
+
const [expanded, setExpanded] = React16.useState(false);
|
|
17029
|
+
const lineCount = React16.useMemo(() => content.split("\n").length, [content]);
|
|
16230
17030
|
const shouldToggle = lineCount > 2 || content.length > 120;
|
|
16231
17031
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
|
|
16232
17032
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -16250,7 +17050,7 @@ var ThoughtBlockItem = React24.memo(function ThoughtBlockItem2({
|
|
|
16250
17050
|
)
|
|
16251
17051
|
] });
|
|
16252
17052
|
});
|
|
16253
|
-
var MessageBubble =
|
|
17053
|
+
var MessageBubble = React16.memo(function MessageBubble2({
|
|
16254
17054
|
message,
|
|
16255
17055
|
isStreaming = false,
|
|
16256
17056
|
streamingContent,
|
|
@@ -16278,12 +17078,12 @@ var MessageBubble = React24.memo(function MessageBubble2({
|
|
|
16278
17078
|
const MessageImageComp = useComponent("MessageImage") || MessageImageInternal;
|
|
16279
17079
|
const MessageVideoComp = useComponent("MessageVideo") || MessageVideoInternal;
|
|
16280
17080
|
const ImagePreviewComp = useComponent("ImagePreview") || ImagePreviewInternal;
|
|
16281
|
-
const [copied, setCopied] =
|
|
16282
|
-
const [showThoughts, setShowThoughts] =
|
|
16283
|
-
const [showDeleteConfirm, setShowDeleteConfirm] =
|
|
16284
|
-
const [isDeleting, setIsDeleting] =
|
|
16285
|
-
const [previewMedia, setPreviewMedia] =
|
|
16286
|
-
const [ttsActive, setTtsActive] =
|
|
17081
|
+
const [copied, setCopied] = React16.useState(false);
|
|
17082
|
+
const [showThoughts, setShowThoughts] = React16.useState(false);
|
|
17083
|
+
const [showDeleteConfirm, setShowDeleteConfirm] = React16.useState(false);
|
|
17084
|
+
const [isDeleting, setIsDeleting] = React16.useState(false);
|
|
17085
|
+
const [previewMedia, setPreviewMedia] = React16.useState(null);
|
|
17086
|
+
const [ttsActive, setTtsActive] = React16.useState(false);
|
|
16287
17087
|
const pendingComponents = useAgentStore((state) => state.chatUI.pendingComponents);
|
|
16288
17088
|
const pendingComponentsSessionId = useAgentStore((state) => state.chatUI.pendingComponentsSessionId);
|
|
16289
17089
|
const isUser = message.role === "user";
|
|
@@ -16296,7 +17096,7 @@ var MessageBubble = React24.memo(function MessageBubble2({
|
|
|
16296
17096
|
thoughts,
|
|
16297
17097
|
pendingToolCalls
|
|
16298
17098
|
});
|
|
16299
|
-
const hasToolCallImages =
|
|
17099
|
+
const hasToolCallImages = React16.useMemo(() => {
|
|
16300
17100
|
return toolCalls.some((tc) => {
|
|
16301
17101
|
if (tc.result?.works?.some((w) => w.fileUrl || w.fileId)) return true;
|
|
16302
17102
|
if (tc.result?.outputs?.images) return true;
|
|
@@ -16310,13 +17110,13 @@ var MessageBubble = React24.memo(function MessageBubble2({
|
|
|
16310
17110
|
isUser,
|
|
16311
17111
|
hasToolCallImages
|
|
16312
17112
|
});
|
|
16313
|
-
const handleCopy =
|
|
17113
|
+
const handleCopy = React16.useCallback(async () => {
|
|
16314
17114
|
if (!displayContent) return;
|
|
16315
17115
|
await navigator.clipboard.writeText(displayContent);
|
|
16316
17116
|
setCopied(true);
|
|
16317
17117
|
setTimeout(() => setCopied(false), 2e3);
|
|
16318
17118
|
}, [displayContent]);
|
|
16319
|
-
const handleDelete2 =
|
|
17119
|
+
const handleDelete2 = React16.useCallback(async () => {
|
|
16320
17120
|
if (!onDelete || !message.messageId) return;
|
|
16321
17121
|
setIsDeleting(true);
|
|
16322
17122
|
try {
|
|
@@ -16328,7 +17128,7 @@ var MessageBubble = React24.memo(function MessageBubble2({
|
|
|
16328
17128
|
setIsDeleting(false);
|
|
16329
17129
|
}
|
|
16330
17130
|
}, [onDelete, message.messageId]);
|
|
16331
|
-
const attachments =
|
|
17131
|
+
const attachments = React16.useMemo(() => {
|
|
16332
17132
|
const rawAttachments = message.attachments || message.extraData?.attachments || [];
|
|
16333
17133
|
const assetStrategy = config?.asset;
|
|
16334
17134
|
const processedAttachments = rawAttachments.map((att) => {
|
|
@@ -16363,8 +17163,8 @@ var MessageBubble = React24.memo(function MessageBubble2({
|
|
|
16363
17163
|
thoughts,
|
|
16364
17164
|
isStreaming
|
|
16365
17165
|
});
|
|
16366
|
-
const [stickyComponents, setStickyComponents] =
|
|
16367
|
-
const mergedComponents =
|
|
17166
|
+
const [stickyComponents, setStickyComponents] = React16.useState([]);
|
|
17167
|
+
const mergedComponents = React16.useMemo(() => {
|
|
16368
17168
|
const map3 = /* @__PURE__ */ new Map();
|
|
16369
17169
|
effectiveComponents.forEach((c) => {
|
|
16370
17170
|
if (c?.id) map3.set(String(c.id), c);
|
|
@@ -16388,7 +17188,7 @@ var MessageBubble = React24.memo(function MessageBubble2({
|
|
|
16388
17188
|
const hasAttachmentOnly = isUser && attachments.length > 0 && !hasValidContent;
|
|
16389
17189
|
const showThoughtsInTimeline = (config?.chatLayout?.showThoughtsInTimeline ?? true) && !hasPlan;
|
|
16390
17190
|
const includeMessageInTimeline = !isUser && showThoughtsInTimeline && !isStreaming && !!sanitizedDisplayContent;
|
|
16391
|
-
const messageArtifactParsed =
|
|
17191
|
+
const messageArtifactParsed = React16.useMemo(() => {
|
|
16392
17192
|
if (!message.content || isUser || isStreaming) return null;
|
|
16393
17193
|
const rawContent = typeof message.content === "string" ? message.content : "";
|
|
16394
17194
|
if (!rawContent.trim()) return null;
|
|
@@ -16842,13 +17642,13 @@ var MessageBubble = React24.memo(function MessageBubble2({
|
|
|
16842
17642
|
] });
|
|
16843
17643
|
});
|
|
16844
17644
|
var MessageBubble_default = MessageBubble;
|
|
16845
|
-
var EmptyState =
|
|
17645
|
+
var EmptyState = React16.memo(function EmptyState2() {
|
|
16846
17646
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
|
|
16847
17647
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-12 h-12 rounded-xl bg-zinc-800/50 flex items-center justify-center mx-auto mb-3", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Sparkles, { size: 24, className: "text-zinc-600" }) }),
|
|
16848
17648
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-zinc-600 text-sm", children: "\u5F00\u59CB\u5BF9\u8BDD\u5427" })
|
|
16849
17649
|
] }) });
|
|
16850
17650
|
});
|
|
16851
|
-
var LoadingState =
|
|
17651
|
+
var LoadingState = React16.memo(function LoadingState2() {
|
|
16852
17652
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 flex items-center justify-center h-full", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "animate-spin rounded-full h-6 w-6 border-b-2 border-[#d8ff00]" }) }) });
|
|
16853
17653
|
});
|
|
16854
17654
|
function ChatWindow({
|
|
@@ -16884,42 +17684,42 @@ function ChatWindow({
|
|
|
16884
17684
|
currentThoughtsSessionId: state.chatUI.currentThoughtsSessionId
|
|
16885
17685
|
}))
|
|
16886
17686
|
);
|
|
16887
|
-
const sessionPendingToolCalls =
|
|
17687
|
+
const sessionPendingToolCalls = React16.useMemo(
|
|
16888
17688
|
() => pendingToolCallsSessionId === sessionId ? pendingToolCalls : [],
|
|
16889
17689
|
[pendingToolCalls, pendingToolCallsSessionId, sessionId]
|
|
16890
17690
|
);
|
|
16891
|
-
const sessionCurrentThoughts =
|
|
17691
|
+
const sessionCurrentThoughts = React16.useMemo(
|
|
16892
17692
|
() => currentThoughtsSessionId === sessionId ? currentThoughts : [],
|
|
16893
17693
|
[currentThoughts, currentThoughtsSessionId, sessionId]
|
|
16894
17694
|
);
|
|
16895
17695
|
const isCurrentSessionStreaming = streamingSessionId === sessionId;
|
|
16896
|
-
const containerRef =
|
|
16897
|
-
const messagesEndRef =
|
|
16898
|
-
const [showScrollButton, setShowScrollButton] =
|
|
16899
|
-
const sessionMessages =
|
|
17696
|
+
const containerRef = React16.useRef(null);
|
|
17697
|
+
const messagesEndRef = React16.useRef(null);
|
|
17698
|
+
const [showScrollButton, setShowScrollButton] = React16.useState(false);
|
|
17699
|
+
const sessionMessages = React16.useMemo(
|
|
16900
17700
|
() => messages.filter((m) => m.sessionId === sessionId),
|
|
16901
17701
|
[messages, sessionId]
|
|
16902
17702
|
);
|
|
16903
|
-
const streamingMessage =
|
|
17703
|
+
const streamingMessage = React16.useMemo(
|
|
16904
17704
|
() => sessionMessages.find((m) => m.status === "streaming"),
|
|
16905
17705
|
[sessionMessages]
|
|
16906
17706
|
);
|
|
16907
|
-
const shouldAutoScrollRef =
|
|
16908
|
-
const isNearBottom =
|
|
17707
|
+
const shouldAutoScrollRef = React16.useRef(true);
|
|
17708
|
+
const isNearBottom = React16.useCallback((threshold = 150) => {
|
|
16909
17709
|
const container = containerRef.current;
|
|
16910
17710
|
if (!container) return true;
|
|
16911
17711
|
const { scrollTop, scrollHeight, clientHeight } = container;
|
|
16912
17712
|
return scrollHeight - scrollTop - clientHeight < threshold;
|
|
16913
17713
|
}, []);
|
|
16914
|
-
const scrollToBottom =
|
|
17714
|
+
const scrollToBottom = React16.useCallback((behavior = "smooth") => {
|
|
16915
17715
|
messagesEndRef.current?.scrollIntoView({ behavior, block: "end" });
|
|
16916
17716
|
}, []);
|
|
16917
|
-
const autoScrollIfNeeded =
|
|
17717
|
+
const autoScrollIfNeeded = React16.useCallback(() => {
|
|
16918
17718
|
if (shouldAutoScrollRef.current) {
|
|
16919
17719
|
scrollToBottom("smooth");
|
|
16920
17720
|
}
|
|
16921
17721
|
}, [scrollToBottom]);
|
|
16922
|
-
const getScrollMetrics =
|
|
17722
|
+
const getScrollMetrics = React16.useCallback(() => {
|
|
16923
17723
|
const container = containerRef.current;
|
|
16924
17724
|
if (container && container.scrollHeight - container.clientHeight > 1) {
|
|
16925
17725
|
return {
|
|
@@ -16935,7 +17735,7 @@ function ChatWindow({
|
|
|
16935
17735
|
clientHeight: doc.clientHeight
|
|
16936
17736
|
};
|
|
16937
17737
|
}, []);
|
|
16938
|
-
const updateScrollState =
|
|
17738
|
+
const updateScrollState = React16.useCallback(() => {
|
|
16939
17739
|
const { scrollTop, scrollHeight, clientHeight } = getScrollMetrics();
|
|
16940
17740
|
const distanceFromBottom = scrollHeight - scrollTop - clientHeight;
|
|
16941
17741
|
setShowScrollButton(distanceFromBottom > 200);
|
|
@@ -16943,8 +17743,8 @@ function ChatWindow({
|
|
|
16943
17743
|
shouldAutoScrollRef.current = true;
|
|
16944
17744
|
}
|
|
16945
17745
|
}, [getScrollMetrics]);
|
|
16946
|
-
const lastScrollTopRef =
|
|
16947
|
-
|
|
17746
|
+
const lastScrollTopRef = React16.useRef(0);
|
|
17747
|
+
React16.useEffect(() => {
|
|
16948
17748
|
const handleScroll = () => {
|
|
16949
17749
|
const container2 = containerRef.current;
|
|
16950
17750
|
if (!container2) return;
|
|
@@ -16999,14 +17799,14 @@ function ChatWindow({
|
|
|
16999
17799
|
window.removeEventListener("wheel", handleWheel);
|
|
17000
17800
|
};
|
|
17001
17801
|
}, [isNearBottom, updateScrollState]);
|
|
17002
|
-
|
|
17802
|
+
React16.useEffect(() => {
|
|
17003
17803
|
if (!loading && sessionMessages.length > 0) {
|
|
17004
17804
|
shouldAutoScrollRef.current = true;
|
|
17005
17805
|
scrollToBottom("instant");
|
|
17006
17806
|
}
|
|
17007
17807
|
}, [loading, sessionId, scrollToBottom]);
|
|
17008
|
-
const prevMessageCountRef =
|
|
17009
|
-
|
|
17808
|
+
const prevMessageCountRef = React16.useRef(sessionMessages.length);
|
|
17809
|
+
React16.useEffect(() => {
|
|
17010
17810
|
const prevCount = prevMessageCountRef.current;
|
|
17011
17811
|
const currentCount = sessionMessages.length;
|
|
17012
17812
|
prevMessageCountRef.current = currentCount;
|
|
@@ -17021,17 +17821,17 @@ function ChatWindow({
|
|
|
17021
17821
|
}
|
|
17022
17822
|
updateScrollState();
|
|
17023
17823
|
}, [sessionMessages.length, sessionMessages, scrollToBottom, autoScrollIfNeeded, updateScrollState]);
|
|
17024
|
-
|
|
17824
|
+
React16.useEffect(() => {
|
|
17025
17825
|
if (streamingContent) {
|
|
17026
17826
|
autoScrollIfNeeded();
|
|
17027
17827
|
}
|
|
17028
17828
|
}, [streamingContent, autoScrollIfNeeded]);
|
|
17029
|
-
|
|
17829
|
+
React16.useEffect(() => {
|
|
17030
17830
|
if (isThinking && isCurrentSessionStreaming && sessionCurrentThoughts.length > 0) {
|
|
17031
17831
|
autoScrollIfNeeded();
|
|
17032
17832
|
}
|
|
17033
17833
|
}, [isThinking, isCurrentSessionStreaming, sessionCurrentThoughts.length, autoScrollIfNeeded]);
|
|
17034
|
-
|
|
17834
|
+
React16.useEffect(() => {
|
|
17035
17835
|
if (!isCurrentSessionStreaming) return;
|
|
17036
17836
|
if (sessionPendingToolCalls.length > 0) {
|
|
17037
17837
|
setTimeout(() => autoScrollIfNeeded(), 50);
|
|
@@ -17114,10 +17914,10 @@ function ChatWindow({
|
|
|
17114
17914
|
chatError && /* @__PURE__ */ jsxRuntime.jsx(ChatErrorBanner, { error: chatError })
|
|
17115
17915
|
] });
|
|
17116
17916
|
}
|
|
17117
|
-
var ChatErrorBanner =
|
|
17118
|
-
const [visible, setVisible] =
|
|
17917
|
+
var ChatErrorBanner = React16.memo(function ChatErrorBanner2({ error }) {
|
|
17918
|
+
const [visible, setVisible] = React16.useState(true);
|
|
17119
17919
|
const { setChatError } = useAgentStore();
|
|
17120
|
-
|
|
17920
|
+
React16.useEffect(() => {
|
|
17121
17921
|
const timer = setTimeout(() => {
|
|
17122
17922
|
setVisible(false);
|
|
17123
17923
|
setChatError(void 0);
|
|
@@ -17140,10 +17940,10 @@ var ChatErrorBanner = React24.memo(function ChatErrorBanner2({ error }) {
|
|
|
17140
17940
|
)
|
|
17141
17941
|
] }) });
|
|
17142
17942
|
});
|
|
17143
|
-
var ChatWindow_default =
|
|
17144
|
-
var MessageImage =
|
|
17145
|
-
const [loaded, setLoaded] =
|
|
17146
|
-
const [error, setError] =
|
|
17943
|
+
var ChatWindow_default = React16.memo(ChatWindow);
|
|
17944
|
+
var MessageImage = React16.memo(function MessageImage2({ src, alt }) {
|
|
17945
|
+
const [loaded, setLoaded] = React16.useState(false);
|
|
17946
|
+
const [error, setError] = React16.useState(false);
|
|
17147
17947
|
if (error) {
|
|
17148
17948
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 p-3 bg-zinc-800/50 rounded-lg text-zinc-500 text-sm", children: [
|
|
17149
17949
|
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.ImageIcon, { size: 16 }),
|
|
@@ -17165,7 +17965,7 @@ var MessageImage = React24.memo(function MessageImage2({ src, alt }) {
|
|
|
17165
17965
|
)
|
|
17166
17966
|
] });
|
|
17167
17967
|
});
|
|
17168
|
-
var MessageVideo =
|
|
17968
|
+
var MessageVideo = React16.memo(function MessageVideo2({ src }) {
|
|
17169
17969
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "my-2 relative rounded-lg overflow-hidden bg-zinc-900 border border-zinc-800", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
17170
17970
|
"video",
|
|
17171
17971
|
{
|
|
@@ -17177,12 +17977,12 @@ var MessageVideo = React24.memo(function MessageVideo2({ src }) {
|
|
|
17177
17977
|
}
|
|
17178
17978
|
) });
|
|
17179
17979
|
});
|
|
17180
|
-
var ImagePreview =
|
|
17980
|
+
var ImagePreview = React16.memo(function ImagePreview2({
|
|
17181
17981
|
src,
|
|
17182
17982
|
alt,
|
|
17183
17983
|
onClose
|
|
17184
17984
|
}) {
|
|
17185
|
-
|
|
17985
|
+
React16.useEffect(() => {
|
|
17186
17986
|
const handleKeyDown = (e) => {
|
|
17187
17987
|
if (e.key === "Escape") {
|
|
17188
17988
|
onClose();
|
|
@@ -17191,7 +17991,7 @@ var ImagePreview = React24.memo(function ImagePreview2({
|
|
|
17191
17991
|
window.addEventListener("keydown", handleKeyDown);
|
|
17192
17992
|
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
17193
17993
|
}, [onClose]);
|
|
17194
|
-
const handleDownload =
|
|
17994
|
+
const handleDownload = React16.useCallback((e) => {
|
|
17195
17995
|
e.stopPropagation();
|
|
17196
17996
|
const link2 = document.createElement("a");
|
|
17197
17997
|
link2.href = src;
|
|
@@ -17356,7 +18156,7 @@ function CompactThinking({ thoughts }) {
|
|
|
17356
18156
|
] });
|
|
17357
18157
|
}
|
|
17358
18158
|
function ToolCallCard3({ toolCall }) {
|
|
17359
|
-
const [showDetails, setShowDetails] =
|
|
18159
|
+
const [showDetails, setShowDetails] = React16.useState(false);
|
|
17360
18160
|
const isPending = !toolCall.result && toolCall.status !== "completed";
|
|
17361
18161
|
toolCall.status === "completed" || toolCall.result;
|
|
17362
18162
|
const toolName = toolCall.displayName || toolCall.name?.replace("comfy_", "Workflow ") || "Tool";
|
|
@@ -17431,7 +18231,7 @@ function FullThinking({ thoughts }) {
|
|
|
17431
18231
|
] });
|
|
17432
18232
|
}
|
|
17433
18233
|
function ThinkingProcess({ thoughts, collapsed = false, compact = false }) {
|
|
17434
|
-
const [expanded, setExpanded] =
|
|
18234
|
+
const [expanded, setExpanded] = React16.useState(!collapsed);
|
|
17435
18235
|
if (thoughts.length === 0) return null;
|
|
17436
18236
|
if (compact) {
|
|
17437
18237
|
return /* @__PURE__ */ jsxRuntime.jsx(CompactThinking, { thoughts });
|
|
@@ -17464,14 +18264,14 @@ function ThinkingProcess({ thoughts, collapsed = false, compact = false }) {
|
|
|
17464
18264
|
}
|
|
17465
18265
|
function ToolConfirmDialog({ toolCall }) {
|
|
17466
18266
|
const { removePendingToolCall } = useAgentStore();
|
|
17467
|
-
const [isEditing, setIsEditing] =
|
|
17468
|
-
const [editedArguments, setEditedArguments] =
|
|
18267
|
+
const [isEditing, setIsEditing] = React16.useState(false);
|
|
18268
|
+
const [editedArguments, setEditedArguments] = React16.useState(
|
|
17469
18269
|
JSON.stringify(toolCall.arguments, null, 2)
|
|
17470
18270
|
);
|
|
17471
|
-
const [rejectReason, setRejectReason] =
|
|
17472
|
-
const [loading, setLoading] =
|
|
17473
|
-
const [showRejectInput, setShowRejectInput] =
|
|
17474
|
-
const [error, setError] =
|
|
18271
|
+
const [rejectReason, setRejectReason] = React16.useState("");
|
|
18272
|
+
const [loading, setLoading] = React16.useState(false);
|
|
18273
|
+
const [showRejectInput, setShowRejectInput] = React16.useState(false);
|
|
18274
|
+
const [error, setError] = React16.useState("");
|
|
17475
18275
|
const handleConfirm = async () => {
|
|
17476
18276
|
setLoading(true);
|
|
17477
18277
|
setError("");
|
|
@@ -17632,7 +18432,7 @@ function ToolConfirmDialog({ toolCall }) {
|
|
|
17632
18432
|
}
|
|
17633
18433
|
var Dialog = DialogPrimitive__namespace.Root;
|
|
17634
18434
|
var DialogPortal = DialogPrimitive__namespace.Portal;
|
|
17635
|
-
var DialogOverlay =
|
|
18435
|
+
var DialogOverlay = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
17636
18436
|
DialogPrimitive__namespace.Overlay,
|
|
17637
18437
|
{
|
|
17638
18438
|
ref,
|
|
@@ -17644,7 +18444,7 @@ var DialogOverlay = React24__namespace.forwardRef(({ className, ...props }, ref)
|
|
|
17644
18444
|
}
|
|
17645
18445
|
));
|
|
17646
18446
|
DialogOverlay.displayName = DialogPrimitive__namespace.Overlay.displayName;
|
|
17647
|
-
var DialogContent =
|
|
18447
|
+
var DialogContent = React16__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
|
|
17648
18448
|
/* @__PURE__ */ jsxRuntime.jsx(DialogOverlay, {}),
|
|
17649
18449
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
17650
18450
|
DialogPrimitive__namespace.Content,
|
|
@@ -17694,7 +18494,7 @@ var DialogFooter = ({
|
|
|
17694
18494
|
}
|
|
17695
18495
|
);
|
|
17696
18496
|
DialogFooter.displayName = "DialogFooter";
|
|
17697
|
-
var DialogTitle =
|
|
18497
|
+
var DialogTitle = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
17698
18498
|
DialogPrimitive__namespace.Title,
|
|
17699
18499
|
{
|
|
17700
18500
|
ref,
|
|
@@ -17706,7 +18506,7 @@ var DialogTitle = React24__namespace.forwardRef(({ className, ...props }, ref) =
|
|
|
17706
18506
|
}
|
|
17707
18507
|
));
|
|
17708
18508
|
DialogTitle.displayName = DialogPrimitive__namespace.Title.displayName;
|
|
17709
|
-
var DialogDescription =
|
|
18509
|
+
var DialogDescription = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
17710
18510
|
DialogPrimitive__namespace.Description,
|
|
17711
18511
|
{
|
|
17712
18512
|
ref,
|
|
@@ -17716,24 +18516,9 @@ var DialogDescription = React24__namespace.forwardRef(({ className, ...props },
|
|
|
17716
18516
|
));
|
|
17717
18517
|
DialogDescription.displayName = DialogPrimitive__namespace.Description.displayName;
|
|
17718
18518
|
|
|
17719
|
-
// ../../node_modules/clsx/dist/clsx.mjs
|
|
17720
|
-
function r2(e) {
|
|
17721
|
-
var t, f, n = "";
|
|
17722
|
-
if ("string" == typeof e || "number" == typeof e) n += e;
|
|
17723
|
-
else if ("object" == typeof e) if (Array.isArray(e)) {
|
|
17724
|
-
var o = e.length;
|
|
17725
|
-
for (t = 0; t < o; t++) e[t] && (f = r2(e[t])) && (n && (n += " "), n += f);
|
|
17726
|
-
} else for (f in e) e[f] && (n && (n += " "), n += f);
|
|
17727
|
-
return n;
|
|
17728
|
-
}
|
|
17729
|
-
function clsx2() {
|
|
17730
|
-
for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r2(e)) && (n && (n += " "), n += t);
|
|
17731
|
-
return n;
|
|
17732
|
-
}
|
|
17733
|
-
|
|
17734
18519
|
// ../../node_modules/class-variance-authority/dist/index.mjs
|
|
17735
18520
|
var falsyToString = (value) => typeof value === "boolean" ? `${value}` : value === 0 ? "0" : value;
|
|
17736
|
-
var cx =
|
|
18521
|
+
var cx = clsx;
|
|
17737
18522
|
var cva = (base, config) => (props) => {
|
|
17738
18523
|
var _config_compoundVariants;
|
|
17739
18524
|
if ((config === null || config === void 0 ? void 0 : config.variants) == null) return cx(base, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);
|
|
@@ -17797,7 +18582,7 @@ var buttonVariants = cva(
|
|
|
17797
18582
|
}
|
|
17798
18583
|
}
|
|
17799
18584
|
);
|
|
17800
|
-
var Button =
|
|
18585
|
+
var Button = React16__namespace.forwardRef(
|
|
17801
18586
|
({ className, variant, size, asChild = false, ...props }, ref) => {
|
|
17802
18587
|
const Comp = asChild ? reactSlot.Slot : "button";
|
|
17803
18588
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -17814,7 +18599,7 @@ Button.displayName = "Button";
|
|
|
17814
18599
|
var Badge = ({ children, className }) => {
|
|
17815
18600
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("inline-flex items-center rounded-md bg-muted px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2", className), children });
|
|
17816
18601
|
};
|
|
17817
|
-
var Card =
|
|
18602
|
+
var Card = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
17818
18603
|
"div",
|
|
17819
18604
|
{
|
|
17820
18605
|
ref,
|
|
@@ -17826,7 +18611,7 @@ var Card = React24__namespace.forwardRef(({ className, ...props }, ref) => /* @_
|
|
|
17826
18611
|
}
|
|
17827
18612
|
));
|
|
17828
18613
|
Card.displayName = "Card";
|
|
17829
|
-
var CardHeader =
|
|
18614
|
+
var CardHeader = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
17830
18615
|
"div",
|
|
17831
18616
|
{
|
|
17832
18617
|
ref,
|
|
@@ -17835,7 +18620,7 @@ var CardHeader = React24__namespace.forwardRef(({ className, ...props }, ref) =>
|
|
|
17835
18620
|
}
|
|
17836
18621
|
));
|
|
17837
18622
|
CardHeader.displayName = "CardHeader";
|
|
17838
|
-
var CardTitle =
|
|
18623
|
+
var CardTitle = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
17839
18624
|
"h3",
|
|
17840
18625
|
{
|
|
17841
18626
|
ref,
|
|
@@ -17847,7 +18632,7 @@ var CardTitle = React24__namespace.forwardRef(({ className, ...props }, ref) =>
|
|
|
17847
18632
|
}
|
|
17848
18633
|
));
|
|
17849
18634
|
CardTitle.displayName = "CardTitle";
|
|
17850
|
-
var CardDescription =
|
|
18635
|
+
var CardDescription = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
17851
18636
|
"p",
|
|
17852
18637
|
{
|
|
17853
18638
|
ref,
|
|
@@ -17856,9 +18641,9 @@ var CardDescription = React24__namespace.forwardRef(({ className, ...props }, re
|
|
|
17856
18641
|
}
|
|
17857
18642
|
));
|
|
17858
18643
|
CardDescription.displayName = "CardDescription";
|
|
17859
|
-
var CardContent =
|
|
18644
|
+
var CardContent = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
|
|
17860
18645
|
CardContent.displayName = "CardContent";
|
|
17861
|
-
var CardFooter =
|
|
18646
|
+
var CardFooter = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
17862
18647
|
"div",
|
|
17863
18648
|
{
|
|
17864
18649
|
ref,
|
|
@@ -17880,7 +18665,7 @@ var Separator = ({ className, orientation = "horizontal", decorative = true }) =
|
|
|
17880
18665
|
}
|
|
17881
18666
|
);
|
|
17882
18667
|
};
|
|
17883
|
-
var ScrollArea =
|
|
18668
|
+
var ScrollArea = React16__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
17884
18669
|
ScrollAreaPrimitive__namespace.Root,
|
|
17885
18670
|
{
|
|
17886
18671
|
ref,
|
|
@@ -17894,7 +18679,7 @@ var ScrollArea = React24__namespace.forwardRef(({ className, children, ...props
|
|
|
17894
18679
|
}
|
|
17895
18680
|
));
|
|
17896
18681
|
ScrollArea.displayName = ScrollAreaPrimitive__namespace.Root.displayName;
|
|
17897
|
-
var ScrollBar =
|
|
18682
|
+
var ScrollBar = React16__namespace.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
17898
18683
|
ScrollAreaPrimitive__namespace.ScrollAreaScrollbar,
|
|
17899
18684
|
{
|
|
17900
18685
|
ref,
|
|
@@ -18188,7 +18973,7 @@ var PlanProgressPanel = ({
|
|
|
18188
18973
|
] });
|
|
18189
18974
|
};
|
|
18190
18975
|
var PlanProgressPanel_default = PlanProgressPanel;
|
|
18191
|
-
var Textarea =
|
|
18976
|
+
var Textarea = React16__namespace.forwardRef(
|
|
18192
18977
|
({ className, theme, ...props }, ref) => {
|
|
18193
18978
|
const themeClass = theme === "dark" ? "bg-gray-800 text-white" : "bg-white text-black";
|
|
18194
18979
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -18212,8 +18997,8 @@ var HumanInputDialog = ({
|
|
|
18212
18997
|
onSubmit,
|
|
18213
18998
|
onCancel
|
|
18214
18999
|
}) => {
|
|
18215
|
-
const [input, setInput] =
|
|
18216
|
-
const [error, setError] =
|
|
19000
|
+
const [input, setInput] = React16.useState("");
|
|
19001
|
+
const [error, setError] = React16.useState(null);
|
|
18217
19002
|
const handleSubmit = () => {
|
|
18218
19003
|
if (!input.trim()) {
|
|
18219
19004
|
setError("\u8BF7\u8F93\u5165\u5185\u5BB9");
|
|
@@ -18314,22 +19099,22 @@ var HumanInputDialog = ({
|
|
|
18314
19099
|
};
|
|
18315
19100
|
var HumanInputDialog_default = HumanInputDialog;
|
|
18316
19101
|
function ShareModal({ sessionId, sessionTitle, isOpen, onClose }) {
|
|
18317
|
-
const [loading, setLoading] =
|
|
18318
|
-
const [creating, setCreating] =
|
|
18319
|
-
const [shares, setShares] =
|
|
18320
|
-
const [copied, setCopied] =
|
|
18321
|
-
const [showCreateForm, setShowCreateForm] =
|
|
18322
|
-
const [title, setTitle] =
|
|
18323
|
-
const [hasPassword, setHasPassword] =
|
|
18324
|
-
const [password, setPassword] =
|
|
18325
|
-
const [expireDays, setExpireDays] =
|
|
18326
|
-
const [editingShare, setEditingShare] =
|
|
18327
|
-
const [editTitle, setEditTitle] =
|
|
18328
|
-
const [editHasPassword, setEditHasPassword] =
|
|
18329
|
-
const [editPassword, setEditPassword] =
|
|
18330
|
-
const [editEnabled, setEditEnabled] =
|
|
18331
|
-
const [updating, setUpdating] =
|
|
18332
|
-
|
|
19102
|
+
const [loading, setLoading] = React16.useState(true);
|
|
19103
|
+
const [creating, setCreating] = React16.useState(false);
|
|
19104
|
+
const [shares, setShares] = React16.useState([]);
|
|
19105
|
+
const [copied, setCopied] = React16.useState(null);
|
|
19106
|
+
const [showCreateForm, setShowCreateForm] = React16.useState(false);
|
|
19107
|
+
const [title, setTitle] = React16.useState("");
|
|
19108
|
+
const [hasPassword, setHasPassword] = React16.useState(false);
|
|
19109
|
+
const [password, setPassword] = React16.useState("");
|
|
19110
|
+
const [expireDays, setExpireDays] = React16.useState(30);
|
|
19111
|
+
const [editingShare, setEditingShare] = React16.useState(null);
|
|
19112
|
+
const [editTitle, setEditTitle] = React16.useState("");
|
|
19113
|
+
const [editHasPassword, setEditHasPassword] = React16.useState(false);
|
|
19114
|
+
const [editPassword, setEditPassword] = React16.useState("");
|
|
19115
|
+
const [editEnabled, setEditEnabled] = React16.useState(true);
|
|
19116
|
+
const [updating, setUpdating] = React16.useState(false);
|
|
19117
|
+
React16.useEffect(() => {
|
|
18333
19118
|
if (!isOpen || !sessionId) return;
|
|
18334
19119
|
async function loadShares() {
|
|
18335
19120
|
try {
|
|
@@ -18733,17 +19518,17 @@ var SaveTemplateDialog = ({
|
|
|
18733
19518
|
onCancel,
|
|
18734
19519
|
isSaving = false
|
|
18735
19520
|
}) => {
|
|
18736
|
-
const [name, setName] =
|
|
18737
|
-
const [description, setDescription] =
|
|
18738
|
-
const [content, setContent] =
|
|
18739
|
-
const [category, setCategory] =
|
|
18740
|
-
const [visibility, setVisibility] =
|
|
18741
|
-
const [variables, setVariables] =
|
|
18742
|
-
const [error, setError] =
|
|
18743
|
-
|
|
19521
|
+
const [name, setName] = React16.useState("");
|
|
19522
|
+
const [description, setDescription] = React16.useState("");
|
|
19523
|
+
const [content, setContent] = React16.useState(originalContent);
|
|
19524
|
+
const [category, setCategory] = React16.useState("\u5176\u4ED6");
|
|
19525
|
+
const [visibility, setVisibility] = React16.useState("PRIVATE");
|
|
19526
|
+
const [variables, setVariables] = React16.useState([]);
|
|
19527
|
+
const [error, setError] = React16.useState(null);
|
|
19528
|
+
React16.useEffect(() => {
|
|
18744
19529
|
setContent(originalContent);
|
|
18745
19530
|
}, [originalContent]);
|
|
18746
|
-
|
|
19531
|
+
React16.useEffect(() => {
|
|
18747
19532
|
const detectedVars = extractVariables(content);
|
|
18748
19533
|
setVariables(detectedVars);
|
|
18749
19534
|
}, [content]);
|
|
@@ -18936,8 +19721,8 @@ var UpdateTemplateDialog = ({
|
|
|
18936
19721
|
onCancel,
|
|
18937
19722
|
isUpdating = false
|
|
18938
19723
|
}) => {
|
|
18939
|
-
const [changeDescription, setChangeDescription] =
|
|
18940
|
-
const [error, setError] =
|
|
19724
|
+
const [changeDescription, setChangeDescription] = React16.useState("");
|
|
19725
|
+
const [error, setError] = React16.useState(null);
|
|
18941
19726
|
const handleUpdate = () => {
|
|
18942
19727
|
if (!changeDescription.trim()) {
|
|
18943
19728
|
setError("\u8BF7\u8F93\u5165\u53D8\u66F4\u8BF4\u660E");
|
|
@@ -19076,7 +19861,7 @@ var TemplateSourceBadge = ({
|
|
|
19076
19861
|
onUpdateTemplate,
|
|
19077
19862
|
onSaveAsNewTemplate
|
|
19078
19863
|
}) => {
|
|
19079
|
-
const [isExpanded, setIsExpanded] =
|
|
19864
|
+
const [isExpanded, setIsExpanded] = React16.useState(false);
|
|
19080
19865
|
if (!template) return null;
|
|
19081
19866
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2", children: [
|
|
19082
19867
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -19133,12 +19918,12 @@ var TemplateSourceBadge = ({
|
|
|
19133
19918
|
};
|
|
19134
19919
|
var TemplateSourceBadge_default = TemplateSourceBadge;
|
|
19135
19920
|
var TemplateSelector = ({ isOpen, onClose, onSelectTemplate }) => {
|
|
19136
|
-
const [activeTab, setActiveTab] =
|
|
19137
|
-
const [searchKeyword, setSearchKeyword] =
|
|
19138
|
-
const [selectedCategory, setSelectedCategory] =
|
|
19139
|
-
const [loading, setLoading] =
|
|
19140
|
-
const [templates, setTemplates] =
|
|
19141
|
-
const [categories, setCategories] =
|
|
19921
|
+
const [activeTab, setActiveTab] = React16.useState("recent");
|
|
19922
|
+
const [searchKeyword, setSearchKeyword] = React16.useState("");
|
|
19923
|
+
const [selectedCategory, setSelectedCategory] = React16.useState("");
|
|
19924
|
+
const [loading, setLoading] = React16.useState(false);
|
|
19925
|
+
const [templates, setTemplates] = React16.useState([]);
|
|
19926
|
+
const [categories, setCategories] = React16.useState([]);
|
|
19142
19927
|
const loadTemplates = async () => {
|
|
19143
19928
|
try {
|
|
19144
19929
|
setLoading(true);
|
|
@@ -19193,14 +19978,14 @@ var TemplateSelector = ({ isOpen, onClose, onSelectTemplate }) => {
|
|
|
19193
19978
|
setLoading(false);
|
|
19194
19979
|
}
|
|
19195
19980
|
};
|
|
19196
|
-
|
|
19981
|
+
React16.useEffect(() => {
|
|
19197
19982
|
if (isOpen) {
|
|
19198
19983
|
setSearchKeyword("");
|
|
19199
19984
|
setSelectedCategory("");
|
|
19200
19985
|
loadTemplates();
|
|
19201
19986
|
}
|
|
19202
19987
|
}, [isOpen, activeTab]);
|
|
19203
|
-
|
|
19988
|
+
React16.useEffect(() => {
|
|
19204
19989
|
const timer = setTimeout(() => {
|
|
19205
19990
|
if (searchKeyword.trim()) {
|
|
19206
19991
|
searchTemplates();
|
|
@@ -19349,11 +20134,11 @@ var TemplateVariableDialog = ({
|
|
|
19349
20134
|
onSend,
|
|
19350
20135
|
onClose
|
|
19351
20136
|
}) => {
|
|
19352
|
-
const [formValues, setFormValues] =
|
|
19353
|
-
const [formErrors, setFormErrors] =
|
|
19354
|
-
const [isSending, setIsSending] =
|
|
19355
|
-
const [showPreview, setShowPreview] =
|
|
19356
|
-
|
|
20137
|
+
const [formValues, setFormValues] = React16.useState({});
|
|
20138
|
+
const [formErrors, setFormErrors] = React16.useState({});
|
|
20139
|
+
const [isSending, setIsSending] = React16.useState(false);
|
|
20140
|
+
const [showPreview, setShowPreview] = React16.useState(true);
|
|
20141
|
+
React16.useEffect(() => {
|
|
19357
20142
|
if (template && template.variables) {
|
|
19358
20143
|
const initialValues = {};
|
|
19359
20144
|
template.variables.forEach((variable) => {
|
|
@@ -19896,12 +20681,12 @@ var useVoiceRecognition = (config = {}) => {
|
|
|
19896
20681
|
engine = "webspeech",
|
|
19897
20682
|
customProvider: customProvider2
|
|
19898
20683
|
} = config;
|
|
19899
|
-
const [status, setStatus] =
|
|
19900
|
-
const [result, setResult] =
|
|
19901
|
-
const [error, setError] =
|
|
19902
|
-
const [isSupported, setIsSupported] =
|
|
19903
|
-
const providerRef =
|
|
19904
|
-
|
|
20684
|
+
const [status, setStatus] = React16.useState("idle");
|
|
20685
|
+
const [result, setResult] = React16.useState(null);
|
|
20686
|
+
const [error, setError] = React16.useState(null);
|
|
20687
|
+
const [isSupported, setIsSupported] = React16.useState(true);
|
|
20688
|
+
const providerRef = React16.useRef(null);
|
|
20689
|
+
React16.useEffect(() => {
|
|
19905
20690
|
if (engine === "webspeech") {
|
|
19906
20691
|
providerRef.current = createWebSpeechProvider(config);
|
|
19907
20692
|
} else if (engine === "custom" && customProvider2) {
|
|
@@ -19925,7 +20710,7 @@ var useVoiceRecognition = (config = {}) => {
|
|
|
19925
20710
|
providerRef.current = null;
|
|
19926
20711
|
};
|
|
19927
20712
|
}, [engine, customProvider2, config.language, config.maxDuration, config.autoStopSilence]);
|
|
19928
|
-
const startRecording =
|
|
20713
|
+
const startRecording = React16.useCallback(async () => {
|
|
19929
20714
|
setError(null);
|
|
19930
20715
|
setResult(null);
|
|
19931
20716
|
setStatus("requesting");
|
|
@@ -19940,7 +20725,7 @@ var useVoiceRecognition = (config = {}) => {
|
|
|
19940
20725
|
setStatus("error");
|
|
19941
20726
|
}
|
|
19942
20727
|
}, []);
|
|
19943
|
-
const stopRecording =
|
|
20728
|
+
const stopRecording = React16.useCallback(() => {
|
|
19944
20729
|
providerRef.current?.stop();
|
|
19945
20730
|
}, []);
|
|
19946
20731
|
return {
|
|
@@ -19958,14 +20743,14 @@ var VoiceWaveform = ({
|
|
|
19958
20743
|
className = "",
|
|
19959
20744
|
color: color2 = "#d8ff00"
|
|
19960
20745
|
}) => {
|
|
19961
|
-
const canvasRef =
|
|
19962
|
-
const animationRef =
|
|
19963
|
-
const audioContextRef =
|
|
19964
|
-
const analyserRef =
|
|
19965
|
-
const dataArrayRef =
|
|
19966
|
-
const sourceRef =
|
|
19967
|
-
const streamRef =
|
|
19968
|
-
const draw =
|
|
20746
|
+
const canvasRef = React16.useRef(null);
|
|
20747
|
+
const animationRef = React16.useRef();
|
|
20748
|
+
const audioContextRef = React16.useRef(null);
|
|
20749
|
+
const analyserRef = React16.useRef(null);
|
|
20750
|
+
const dataArrayRef = React16.useRef(null);
|
|
20751
|
+
const sourceRef = React16.useRef(null);
|
|
20752
|
+
const streamRef = React16.useRef(null);
|
|
20753
|
+
const draw = React16.useCallback(() => {
|
|
19969
20754
|
const canvas = canvasRef.current;
|
|
19970
20755
|
const ctx = canvas?.getContext("2d");
|
|
19971
20756
|
const analyser = analyserRef.current;
|
|
@@ -20013,7 +20798,7 @@ var VoiceWaveform = ({
|
|
|
20013
20798
|
}
|
|
20014
20799
|
animationRef.current = requestAnimationFrame(draw);
|
|
20015
20800
|
}, [color2]);
|
|
20016
|
-
|
|
20801
|
+
React16.useEffect(() => {
|
|
20017
20802
|
if (!isRecording) {
|
|
20018
20803
|
if (animationRef.current) {
|
|
20019
20804
|
cancelAnimationFrame(animationRef.current);
|
|
@@ -20085,10 +20870,10 @@ var VoiceInput = ({
|
|
|
20085
20870
|
className = ""
|
|
20086
20871
|
}) => {
|
|
20087
20872
|
const { enabled = true } = config;
|
|
20088
|
-
const resultHandledRef =
|
|
20089
|
-
const lastResultRef =
|
|
20090
|
-
const [isExpanded, setIsExpanded] =
|
|
20091
|
-
const [showResult, setShowResult] =
|
|
20873
|
+
const resultHandledRef = React16.useRef(false);
|
|
20874
|
+
const lastResultRef = React16.useRef(null);
|
|
20875
|
+
const [isExpanded, setIsExpanded] = React16.useState(false);
|
|
20876
|
+
const [showResult, setShowResult] = React16.useState(false);
|
|
20092
20877
|
const {
|
|
20093
20878
|
status,
|
|
20094
20879
|
result,
|
|
@@ -20102,34 +20887,34 @@ var VoiceInput = ({
|
|
|
20102
20887
|
const isRecognizing = status === "recognizing";
|
|
20103
20888
|
const isCompleted = status === "completed";
|
|
20104
20889
|
const hasError = status === "error";
|
|
20105
|
-
const handleStart =
|
|
20890
|
+
const handleStart = React16.useCallback(async () => {
|
|
20106
20891
|
if (!isSupported || disabled) return;
|
|
20107
20892
|
resultHandledRef.current = false;
|
|
20108
20893
|
setIsExpanded(true);
|
|
20109
20894
|
await startRecording();
|
|
20110
20895
|
}, [isSupported, disabled, startRecording]);
|
|
20111
|
-
const handleStop =
|
|
20896
|
+
const handleStop = React16.useCallback(() => {
|
|
20112
20897
|
stopRecording();
|
|
20113
20898
|
}, [stopRecording]);
|
|
20114
|
-
const handleConfirm =
|
|
20899
|
+
const handleConfirm = React16.useCallback((text3) => {
|
|
20115
20900
|
onResult(text3);
|
|
20116
20901
|
setIsExpanded(false);
|
|
20117
20902
|
setShowResult(false);
|
|
20118
20903
|
lastResultRef.current = null;
|
|
20119
20904
|
}, [onResult]);
|
|
20120
|
-
const handleCancel =
|
|
20905
|
+
const handleCancel = React16.useCallback(() => {
|
|
20121
20906
|
stopRecording();
|
|
20122
20907
|
setIsExpanded(false);
|
|
20123
20908
|
setShowResult(false);
|
|
20124
20909
|
resultHandledRef.current = false;
|
|
20125
20910
|
lastResultRef.current = null;
|
|
20126
20911
|
}, [stopRecording]);
|
|
20127
|
-
|
|
20912
|
+
React16.useEffect(() => {
|
|
20128
20913
|
if (result?.text) {
|
|
20129
20914
|
lastResultRef.current = result;
|
|
20130
20915
|
}
|
|
20131
20916
|
}, [result]);
|
|
20132
|
-
|
|
20917
|
+
React16.useEffect(() => {
|
|
20133
20918
|
if (isCompleted && !resultHandledRef.current) {
|
|
20134
20919
|
resultHandledRef.current = true;
|
|
20135
20920
|
const finalText = lastResultRef.current?.text || result?.text;
|
|
@@ -20146,14 +20931,14 @@ var VoiceInput = ({
|
|
|
20146
20931
|
}
|
|
20147
20932
|
}
|
|
20148
20933
|
}, [isCompleted, result, config.autoConfirm, handleConfirm]);
|
|
20149
|
-
|
|
20934
|
+
React16.useEffect(() => {
|
|
20150
20935
|
if (isRecording) {
|
|
20151
20936
|
resultHandledRef.current = false;
|
|
20152
20937
|
lastResultRef.current = null;
|
|
20153
20938
|
setShowResult(false);
|
|
20154
20939
|
}
|
|
20155
20940
|
}, [isRecording]);
|
|
20156
|
-
|
|
20941
|
+
React16.useEffect(() => {
|
|
20157
20942
|
if (error && onError) {
|
|
20158
20943
|
onError(error);
|
|
20159
20944
|
setTimeout(() => {
|
|
@@ -20256,9 +21041,9 @@ var VoiceButton = ({
|
|
|
20256
21041
|
onStart,
|
|
20257
21042
|
onStop
|
|
20258
21043
|
}) => {
|
|
20259
|
-
const buttonRef =
|
|
21044
|
+
const buttonRef = React16.useRef(null);
|
|
20260
21045
|
const isTouchDevice = typeof window !== "undefined" && ("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
20261
|
-
const handleClick =
|
|
21046
|
+
const handleClick = React16.useCallback(() => {
|
|
20262
21047
|
if (disabled) return;
|
|
20263
21048
|
if (isRecording) {
|
|
20264
21049
|
onStop();
|
|
@@ -20266,10 +21051,10 @@ var VoiceButton = ({
|
|
|
20266
21051
|
onStart();
|
|
20267
21052
|
}
|
|
20268
21053
|
}, [disabled, isRecording, onStart, onStop]);
|
|
20269
|
-
const pressTimerRef =
|
|
20270
|
-
const longPressRef =
|
|
21054
|
+
const pressTimerRef = React16.useRef(null);
|
|
21055
|
+
const longPressRef = React16.useRef(false);
|
|
20271
21056
|
const LONG_PRESS_DURATION = 300;
|
|
20272
|
-
const handleTouchStart =
|
|
21057
|
+
const handleTouchStart = React16.useCallback((e) => {
|
|
20273
21058
|
e.preventDefault();
|
|
20274
21059
|
if (disabled) return;
|
|
20275
21060
|
longPressRef.current = false;
|
|
@@ -20278,7 +21063,7 @@ var VoiceButton = ({
|
|
|
20278
21063
|
onStart();
|
|
20279
21064
|
}, LONG_PRESS_DURATION);
|
|
20280
21065
|
}, [disabled, onStart]);
|
|
20281
|
-
const handleTouchEnd =
|
|
21066
|
+
const handleTouchEnd = React16.useCallback((e) => {
|
|
20282
21067
|
e.preventDefault();
|
|
20283
21068
|
if (pressTimerRef.current) {
|
|
20284
21069
|
clearTimeout(pressTimerRef.current);
|
|
@@ -20332,12 +21117,12 @@ var VoiceRecordingModal = ({
|
|
|
20332
21117
|
const isRecognizing = status === "recognizing";
|
|
20333
21118
|
const isCompleted = status === "completed";
|
|
20334
21119
|
const hasError = status === "error";
|
|
20335
|
-
const hasConfirmedRef =
|
|
20336
|
-
const onConfirmRef =
|
|
20337
|
-
|
|
21120
|
+
const hasConfirmedRef = React16.useRef(false);
|
|
21121
|
+
const onConfirmRef = React16.useRef(onConfirm);
|
|
21122
|
+
React16.useEffect(() => {
|
|
20338
21123
|
onConfirmRef.current = onConfirm;
|
|
20339
21124
|
}, [onConfirm]);
|
|
20340
|
-
|
|
21125
|
+
React16.useEffect(() => {
|
|
20341
21126
|
if (isCompleted && result?.isFinal && result.text && !hasConfirmedRef.current) {
|
|
20342
21127
|
hasConfirmedRef.current = true;
|
|
20343
21128
|
const timer = setTimeout(() => {
|
|
@@ -20346,7 +21131,7 @@ var VoiceRecordingModal = ({
|
|
|
20346
21131
|
return () => clearTimeout(timer);
|
|
20347
21132
|
}
|
|
20348
21133
|
}, [isCompleted, result]);
|
|
20349
|
-
|
|
21134
|
+
React16.useEffect(() => {
|
|
20350
21135
|
if (!visible) {
|
|
20351
21136
|
hasConfirmedRef.current = false;
|
|
20352
21137
|
}
|
|
@@ -20477,8 +21262,8 @@ var VoiceInputButton = ({
|
|
|
20477
21262
|
style
|
|
20478
21263
|
}) => {
|
|
20479
21264
|
const { enabled = true } = config;
|
|
20480
|
-
const [modalVisible, setModalVisible] =
|
|
20481
|
-
const [hasPermission, setHasPermission] =
|
|
21265
|
+
const [modalVisible, setModalVisible] = React16.useState(false);
|
|
21266
|
+
const [hasPermission, setHasPermission] = React16.useState(null);
|
|
20482
21267
|
const {
|
|
20483
21268
|
status,
|
|
20484
21269
|
result,
|
|
@@ -20487,7 +21272,7 @@ var VoiceInputButton = ({
|
|
|
20487
21272
|
startRecording,
|
|
20488
21273
|
stopRecording
|
|
20489
21274
|
} = useVoiceRecognition(config);
|
|
20490
|
-
|
|
21275
|
+
React16.useEffect(() => {
|
|
20491
21276
|
if (typeof navigator === "undefined") return;
|
|
20492
21277
|
navigator.permissions?.query({ name: "microphone" }).then((permissionStatus) => {
|
|
20493
21278
|
setHasPermission(permissionStatus.state === "granted");
|
|
@@ -20497,7 +21282,7 @@ var VoiceInputButton = ({
|
|
|
20497
21282
|
}).catch(() => {
|
|
20498
21283
|
});
|
|
20499
21284
|
}, []);
|
|
20500
|
-
const handleOpenModal =
|
|
21285
|
+
const handleOpenModal = React16.useCallback(() => {
|
|
20501
21286
|
if (!isSupported) {
|
|
20502
21287
|
onError?.({
|
|
20503
21288
|
code: "NOT_SUPPORTED",
|
|
@@ -20508,17 +21293,17 @@ var VoiceInputButton = ({
|
|
|
20508
21293
|
}
|
|
20509
21294
|
setModalVisible(true);
|
|
20510
21295
|
}, [isSupported, onError]);
|
|
20511
|
-
const handleCloseModal =
|
|
21296
|
+
const handleCloseModal = React16.useCallback(() => {
|
|
20512
21297
|
if (status === "recording") {
|
|
20513
21298
|
stopRecording();
|
|
20514
21299
|
}
|
|
20515
21300
|
setModalVisible(false);
|
|
20516
21301
|
}, [status, stopRecording]);
|
|
20517
|
-
const handleConfirm =
|
|
21302
|
+
const handleConfirm = React16.useCallback((text3) => {
|
|
20518
21303
|
onResult(text3);
|
|
20519
21304
|
setModalVisible(false);
|
|
20520
21305
|
}, [onResult]);
|
|
20521
|
-
|
|
21306
|
+
React16.useEffect(() => {
|
|
20522
21307
|
if (error && onError) {
|
|
20523
21308
|
onError(error);
|
|
20524
21309
|
}
|
|
@@ -20562,14 +21347,14 @@ var VoiceInputButton = ({
|
|
|
20562
21347
|
};
|
|
20563
21348
|
|
|
20564
21349
|
// src/utils/cn.ts
|
|
20565
|
-
function
|
|
21350
|
+
function cn3(...inputs) {
|
|
20566
21351
|
return twMerge(clsx(inputs));
|
|
20567
21352
|
}
|
|
20568
21353
|
function useResizablePanel(defaultWidth, minWidth, maxWidth, onWidthChange) {
|
|
20569
|
-
const [width, setWidth] =
|
|
20570
|
-
const [isResizing, setIsResizing] =
|
|
20571
|
-
const containerRef =
|
|
20572
|
-
const startResize =
|
|
21354
|
+
const [width, setWidth] = React16.useState(defaultWidth);
|
|
21355
|
+
const [isResizing, setIsResizing] = React16.useState(false);
|
|
21356
|
+
const containerRef = React16.useRef(null);
|
|
21357
|
+
const startResize = React16.useCallback((e) => {
|
|
20573
21358
|
e.preventDefault();
|
|
20574
21359
|
setIsResizing(true);
|
|
20575
21360
|
const startX = e.clientX;
|
|
@@ -20595,7 +21380,7 @@ function useResizablePanel(defaultWidth, minWidth, maxWidth, onWidthChange) {
|
|
|
20595
21380
|
}, [width, minWidth, maxWidth, onWidthChange]);
|
|
20596
21381
|
return { width, isResizing, startResize, containerRef };
|
|
20597
21382
|
}
|
|
20598
|
-
var SidePanel =
|
|
21383
|
+
var SidePanel = React16.memo(function SidePanel2({
|
|
20599
21384
|
isOpen,
|
|
20600
21385
|
onClose,
|
|
20601
21386
|
title,
|
|
@@ -20618,7 +21403,7 @@ var SidePanel = React24.memo(function SidePanel2({
|
|
|
20618
21403
|
minWidth,
|
|
20619
21404
|
maxWidth
|
|
20620
21405
|
);
|
|
20621
|
-
|
|
21406
|
+
React16.useEffect(() => {
|
|
20622
21407
|
const handleKeyDown = (e) => {
|
|
20623
21408
|
if (e.key === "Escape" && isOpen) {
|
|
20624
21409
|
onClose();
|
|
@@ -20627,7 +21412,7 @@ var SidePanel = React24.memo(function SidePanel2({
|
|
|
20627
21412
|
window.addEventListener("keydown", handleKeyDown);
|
|
20628
21413
|
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
20629
21414
|
}, [isOpen, onClose]);
|
|
20630
|
-
|
|
21415
|
+
React16.useEffect(() => {
|
|
20631
21416
|
if (isOpen) {
|
|
20632
21417
|
const originalOverflow = document.body.style.overflow;
|
|
20633
21418
|
document.body.style.overflow = "hidden";
|
|
@@ -20649,7 +21434,7 @@ var SidePanel = React24.memo(function SidePanel2({
|
|
|
20649
21434
|
"div",
|
|
20650
21435
|
{
|
|
20651
21436
|
ref: containerRef,
|
|
20652
|
-
className:
|
|
21437
|
+
className: cn3(
|
|
20653
21438
|
"fixed right-0 top-0 h-full z-50 flex flex-col",
|
|
20654
21439
|
"bg-zinc-950 border-l border-zinc-800/50",
|
|
20655
21440
|
"shadow-2xl shadow-black/50",
|
|
@@ -20664,7 +21449,7 @@ var SidePanel = React24.memo(function SidePanel2({
|
|
|
20664
21449
|
resizable && !isFullscreen && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
20665
21450
|
"div",
|
|
20666
21451
|
{
|
|
20667
|
-
className:
|
|
21452
|
+
className: cn3(
|
|
20668
21453
|
"absolute left-0 top-0 bottom-0 w-4 -translate-x-1/2",
|
|
20669
21454
|
"cursor-col-resize z-10 flex items-center justify-center",
|
|
20670
21455
|
"group hover:bg-zinc-800/50 transition-colors",
|
|
@@ -20672,7 +21457,7 @@ var SidePanel = React24.memo(function SidePanel2({
|
|
|
20672
21457
|
),
|
|
20673
21458
|
onMouseDown: startResize,
|
|
20674
21459
|
children: [
|
|
20675
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className:
|
|
21460
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: cn3(
|
|
20676
21461
|
"w-1 h-12 rounded-full bg-zinc-700",
|
|
20677
21462
|
"group-hover:bg-zinc-500 transition-colors",
|
|
20678
21463
|
isResizing && "bg-zinc-400"
|
|
@@ -20681,7 +21466,7 @@ var SidePanel = React24.memo(function SidePanel2({
|
|
|
20681
21466
|
lucideReact.GripVertical,
|
|
20682
21467
|
{
|
|
20683
21468
|
size: 14,
|
|
20684
|
-
className:
|
|
21469
|
+
className: cn3(
|
|
20685
21470
|
"absolute text-zinc-600 opacity-0",
|
|
20686
21471
|
"group-hover:opacity-100 transition-opacity",
|
|
20687
21472
|
isResizing && "opacity-100 text-zinc-400"
|
|
@@ -20718,7 +21503,7 @@ var SidePanel = React24.memo(function SidePanel2({
|
|
|
20718
21503
|
)
|
|
20719
21504
|
] })
|
|
20720
21505
|
] }),
|
|
20721
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className:
|
|
21506
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: cn3(
|
|
20722
21507
|
"flex-1 overflow-hidden flex flex-col",
|
|
20723
21508
|
contentClassName
|
|
20724
21509
|
), children }),
|
|
@@ -20729,7 +21514,7 @@ var SidePanel = React24.memo(function SidePanel2({
|
|
|
20729
21514
|
isResizing && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed inset-0 z-[60]" })
|
|
20730
21515
|
] });
|
|
20731
21516
|
});
|
|
20732
|
-
var ViewTabs =
|
|
21517
|
+
var ViewTabs = React16.memo(function ViewTabs2({
|
|
20733
21518
|
activeView,
|
|
20734
21519
|
onViewChange,
|
|
20735
21520
|
views
|
|
@@ -20738,7 +21523,7 @@ var ViewTabs = React24.memo(function ViewTabs2({
|
|
|
20738
21523
|
"button",
|
|
20739
21524
|
{
|
|
20740
21525
|
onClick: () => onViewChange(view.id),
|
|
20741
|
-
className:
|
|
21526
|
+
className: cn3(
|
|
20742
21527
|
"flex items-center gap-1.5 px-3 py-1.5 text-xs rounded-md transition-colors",
|
|
20743
21528
|
activeView === view.id ? "bg-zinc-700 text-zinc-200" : "text-zinc-400 hover:text-zinc-300"
|
|
20744
21529
|
),
|
|
@@ -20750,7 +21535,7 @@ var ViewTabs = React24.memo(function ViewTabs2({
|
|
|
20750
21535
|
view.id
|
|
20751
21536
|
)) });
|
|
20752
21537
|
});
|
|
20753
|
-
var ToolbarButton =
|
|
21538
|
+
var ToolbarButton = React16.memo(function ToolbarButton2({
|
|
20754
21539
|
onClick,
|
|
20755
21540
|
title,
|
|
20756
21541
|
children,
|
|
@@ -20761,7 +21546,7 @@ var ToolbarButton = React24.memo(function ToolbarButton2({
|
|
|
20761
21546
|
{
|
|
20762
21547
|
onClick,
|
|
20763
21548
|
title,
|
|
20764
|
-
className:
|
|
21549
|
+
className: cn3(
|
|
20765
21550
|
"p-2 rounded-lg hover:bg-zinc-800/50 text-zinc-400 hover:text-zinc-200 transition-colors",
|
|
20766
21551
|
className
|
|
20767
21552
|
),
|
|
@@ -20819,14 +21604,14 @@ var artifactTypeConfig = {
|
|
|
20819
21604
|
bgColor: "bg-pink-500/10"
|
|
20820
21605
|
}
|
|
20821
21606
|
};
|
|
20822
|
-
var CodeBlock3 =
|
|
21607
|
+
var CodeBlock3 = React16.memo(function CodeBlock4({
|
|
20823
21608
|
code: code3,
|
|
20824
21609
|
language,
|
|
20825
21610
|
showLineNumbers = true
|
|
20826
21611
|
}) {
|
|
20827
21612
|
const lines = code3.split("\n");
|
|
20828
|
-
const [copied, setCopied] =
|
|
20829
|
-
const handleCopy =
|
|
21613
|
+
const [copied, setCopied] = React16.useState(false);
|
|
21614
|
+
const handleCopy = React16.useCallback(async () => {
|
|
20830
21615
|
try {
|
|
20831
21616
|
await navigator.clipboard.writeText(code3);
|
|
20832
21617
|
setCopied(true);
|
|
@@ -20861,14 +21646,14 @@ var CodeBlock3 = React24.memo(function CodeBlock4({
|
|
|
20861
21646
|
] }, i)) }) }) })
|
|
20862
21647
|
] });
|
|
20863
21648
|
});
|
|
20864
|
-
var HtmlPreview3 =
|
|
20865
|
-
const [scale, setScale] =
|
|
20866
|
-
const [deviceMode, setDeviceMode] =
|
|
20867
|
-
const [isLoading, setIsLoading] =
|
|
20868
|
-
const [iframeHeight, setIframeHeight] =
|
|
20869
|
-
const iframeRef =
|
|
20870
|
-
const containerRef =
|
|
20871
|
-
const blobUrl =
|
|
21649
|
+
var HtmlPreview3 = React16.memo(function HtmlPreview4({ content }) {
|
|
21650
|
+
const [scale, setScale] = React16.useState(1);
|
|
21651
|
+
const [deviceMode, setDeviceMode] = React16.useState("responsive");
|
|
21652
|
+
const [isLoading, setIsLoading] = React16.useState(true);
|
|
21653
|
+
const [iframeHeight, setIframeHeight] = React16.useState(600);
|
|
21654
|
+
const iframeRef = React16.useRef(null);
|
|
21655
|
+
const containerRef = React16.useRef(null);
|
|
21656
|
+
const blobUrl = React16.useMemo(() => {
|
|
20872
21657
|
const styleInjection = `
|
|
20873
21658
|
<style>
|
|
20874
21659
|
html, body {
|
|
@@ -20896,7 +21681,7 @@ var HtmlPreview3 = React24.memo(function HtmlPreview4({ content }) {
|
|
|
20896
21681
|
const blob = new Blob([modifiedContent], { type: "text/html" });
|
|
20897
21682
|
return URL.createObjectURL(blob);
|
|
20898
21683
|
}, [content]);
|
|
20899
|
-
|
|
21684
|
+
React16.useEffect(() => {
|
|
20900
21685
|
return () => {
|
|
20901
21686
|
URL.revokeObjectURL(blobUrl);
|
|
20902
21687
|
};
|
|
@@ -20908,7 +21693,7 @@ var HtmlPreview3 = React24.memo(function HtmlPreview4({ content }) {
|
|
|
20908
21693
|
responsive: { width: "100%", height: 600, icon: lucideReact.Maximize2, label: "Responsive" }
|
|
20909
21694
|
};
|
|
20910
21695
|
const currentDevice = deviceConfig[deviceMode];
|
|
20911
|
-
const adjustIframeHeight =
|
|
21696
|
+
const adjustIframeHeight = React16.useCallback(() => {
|
|
20912
21697
|
if (deviceMode === "responsive" && containerRef.current) {
|
|
20913
21698
|
const containerHeight = containerRef.current.clientHeight - 32;
|
|
20914
21699
|
setIframeHeight(Math.max(containerHeight, 400));
|
|
@@ -20916,12 +21701,12 @@ var HtmlPreview3 = React24.memo(function HtmlPreview4({ content }) {
|
|
|
20916
21701
|
setIframeHeight(currentDevice.height);
|
|
20917
21702
|
}
|
|
20918
21703
|
}, [deviceMode, currentDevice.height]);
|
|
20919
|
-
|
|
21704
|
+
React16.useEffect(() => {
|
|
20920
21705
|
adjustIframeHeight();
|
|
20921
21706
|
window.addEventListener("resize", adjustIframeHeight);
|
|
20922
21707
|
return () => window.removeEventListener("resize", adjustIframeHeight);
|
|
20923
21708
|
}, [adjustIframeHeight]);
|
|
20924
|
-
const handleIframeLoad =
|
|
21709
|
+
const handleIframeLoad = React16.useCallback(() => {
|
|
20925
21710
|
setIsLoading(false);
|
|
20926
21711
|
try {
|
|
20927
21712
|
const iframe = iframeRef.current;
|
|
@@ -20942,13 +21727,13 @@ var HtmlPreview3 = React24.memo(function HtmlPreview4({ content }) {
|
|
|
20942
21727
|
} catch {
|
|
20943
21728
|
}
|
|
20944
21729
|
}, [deviceMode]);
|
|
20945
|
-
const handleRefresh =
|
|
21730
|
+
const handleRefresh = React16.useCallback(() => {
|
|
20946
21731
|
setIsLoading(true);
|
|
20947
21732
|
if (iframeRef.current) {
|
|
20948
21733
|
iframeRef.current.src = blobUrl;
|
|
20949
21734
|
}
|
|
20950
21735
|
}, [blobUrl]);
|
|
20951
|
-
const handleDownload =
|
|
21736
|
+
const handleDownload = React16.useCallback(() => {
|
|
20952
21737
|
const link2 = document.createElement("a");
|
|
20953
21738
|
link2.href = blobUrl;
|
|
20954
21739
|
link2.download = `artifact-${Date.now()}.html`;
|
|
@@ -20956,7 +21741,7 @@ var HtmlPreview3 = React24.memo(function HtmlPreview4({ content }) {
|
|
|
20956
21741
|
link2.click();
|
|
20957
21742
|
document.body.removeChild(link2);
|
|
20958
21743
|
}, [blobUrl]);
|
|
20959
|
-
const handleOpenNewTab =
|
|
21744
|
+
const handleOpenNewTab = React16.useCallback(() => {
|
|
20960
21745
|
window.open(blobUrl, "_blank");
|
|
20961
21746
|
}, [blobUrl]);
|
|
20962
21747
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "h-full flex flex-col bg-zinc-950 agent-sdk-light:bg-white", children: [
|
|
@@ -20970,7 +21755,7 @@ var HtmlPreview3 = React24.memo(function HtmlPreview4({ content }) {
|
|
|
20970
21755
|
setDeviceMode(mode);
|
|
20971
21756
|
setScale(1);
|
|
20972
21757
|
},
|
|
20973
|
-
className:
|
|
21758
|
+
className: cn3(
|
|
20974
21759
|
"flex items-center gap-1.5 px-2.5 py-1.5 text-xs rounded-md transition-all",
|
|
20975
21760
|
deviceMode === mode ? "bg-zinc-700 text-zinc-200 agent-sdk-light:bg-zinc-200 agent-sdk-light:text-zinc-900" : "text-zinc-500 agent-sdk-light:text-zinc-600 hover:text-zinc-300 agent-sdk-light:hover:text-zinc-900 hover:bg-zinc-800/50 agent-sdk-light:hover:bg-zinc-200/50"
|
|
20976
21761
|
),
|
|
@@ -20989,7 +21774,7 @@ var HtmlPreview3 = React24.memo(function HtmlPreview4({ content }) {
|
|
|
20989
21774
|
"button",
|
|
20990
21775
|
{
|
|
20991
21776
|
onClick: () => setScale(s),
|
|
20992
|
-
className:
|
|
21777
|
+
className: cn3(
|
|
20993
21778
|
"px-2 py-1 text-[10px] rounded transition-colors",
|
|
20994
21779
|
scale === s ? "bg-zinc-700 text-zinc-200 agent-sdk-light:bg-zinc-300 agent-sdk-light:text-zinc-900" : "text-zinc-500 agent-sdk-light:text-zinc-600 hover:text-zinc-300 agent-sdk-light:hover:text-zinc-900"
|
|
20995
21780
|
),
|
|
@@ -21041,7 +21826,7 @@ var HtmlPreview3 = React24.memo(function HtmlPreview4({ content }) {
|
|
|
21041
21826
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
21042
21827
|
"div",
|
|
21043
21828
|
{
|
|
21044
|
-
className:
|
|
21829
|
+
className: cn3(
|
|
21045
21830
|
"bg-white rounded-lg shadow-2xl overflow-hidden transition-all duration-300 relative",
|
|
21046
21831
|
deviceMode !== "responsive" && "border-4 border-zinc-800 agent-sdk-light:border-zinc-300 rounded-xl"
|
|
21047
21832
|
),
|
|
@@ -21077,21 +21862,21 @@ var HtmlPreview3 = React24.memo(function HtmlPreview4({ content }) {
|
|
|
21077
21862
|
)
|
|
21078
21863
|
] });
|
|
21079
21864
|
});
|
|
21080
|
-
var MarkdownPreview =
|
|
21865
|
+
var MarkdownPreview = React16.memo(function MarkdownPreview2({
|
|
21081
21866
|
content,
|
|
21082
21867
|
config
|
|
21083
21868
|
}) {
|
|
21084
21869
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full overflow-auto bg-zinc-950 agent-sdk-light:bg-white", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-3xl mx-auto p-8", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "prose prose-invert prose-zinc agent-sdk-light:prose max-w-none", children: /* @__PURE__ */ jsxRuntime.jsx(MarkdownContent, { content, config }) }) }) });
|
|
21085
21870
|
});
|
|
21086
|
-
|
|
21087
|
-
const parsedData =
|
|
21871
|
+
React16.memo(function JsonPreview2({ content }) {
|
|
21872
|
+
const parsedData = React16.useMemo(() => {
|
|
21088
21873
|
try {
|
|
21089
21874
|
return JSON.parse(content);
|
|
21090
21875
|
} catch {
|
|
21091
21876
|
return null;
|
|
21092
21877
|
}
|
|
21093
21878
|
}, [content]);
|
|
21094
|
-
const formattedJson =
|
|
21879
|
+
const formattedJson = React16.useMemo(() => {
|
|
21095
21880
|
if (parsedData === null) return content;
|
|
21096
21881
|
try {
|
|
21097
21882
|
return JSON.stringify(parsedData, null, 2);
|
|
@@ -21107,13 +21892,13 @@ React24.memo(function JsonPreview2({ content }) {
|
|
|
21107
21892
|
}
|
|
21108
21893
|
return /* @__PURE__ */ jsxRuntime.jsx(CodeBlock3, { code: formattedJson, language: "json" });
|
|
21109
21894
|
});
|
|
21110
|
-
var CodeEditor =
|
|
21895
|
+
var CodeEditor = React16.memo(function CodeEditor2({
|
|
21111
21896
|
code: code3,
|
|
21112
21897
|
language,
|
|
21113
21898
|
onChange
|
|
21114
21899
|
}) {
|
|
21115
|
-
const textareaRef =
|
|
21116
|
-
const handleKeyDown =
|
|
21900
|
+
const textareaRef = React16.useRef(null);
|
|
21901
|
+
const handleKeyDown = React16.useCallback((e) => {
|
|
21117
21902
|
if (e.key === "Tab") {
|
|
21118
21903
|
e.preventDefault();
|
|
21119
21904
|
const textarea = e.currentTarget;
|
|
@@ -21150,10 +21935,10 @@ var CodeEditor = React24.memo(function CodeEditor2({
|
|
|
21150
21935
|
});
|
|
21151
21936
|
function useResolvedMediaUrl(content, options) {
|
|
21152
21937
|
const { fileId, type = "image", config } = options || {};
|
|
21153
|
-
const [resolvedUrl, setResolvedUrl] =
|
|
21154
|
-
const [resolvedHdUrl, setResolvedHdUrl] =
|
|
21155
|
-
const [isLoading, setIsLoading] =
|
|
21156
|
-
|
|
21938
|
+
const [resolvedUrl, setResolvedUrl] = React16.useState(content);
|
|
21939
|
+
const [resolvedHdUrl, setResolvedHdUrl] = React16.useState(content);
|
|
21940
|
+
const [isLoading, setIsLoading] = React16.useState(true);
|
|
21941
|
+
React16.useEffect(() => {
|
|
21157
21942
|
let active = true;
|
|
21158
21943
|
setIsLoading(true);
|
|
21159
21944
|
const resolve = async () => {
|
|
@@ -21191,8 +21976,8 @@ function useResolvedMediaUrl(content, options) {
|
|
|
21191
21976
|
}
|
|
21192
21977
|
function useResolvedThumbnailUrl(content, options) {
|
|
21193
21978
|
const { fileId, type = "image", config, enabled = true } = options || {};
|
|
21194
|
-
const [url, setUrl] =
|
|
21195
|
-
|
|
21979
|
+
const [url, setUrl] = React16.useState(null);
|
|
21980
|
+
React16.useEffect(() => {
|
|
21196
21981
|
if (!enabled || !content) {
|
|
21197
21982
|
setUrl(null);
|
|
21198
21983
|
return;
|
|
@@ -21224,15 +22009,15 @@ function useResolvedThumbnailUrl(content, options) {
|
|
|
21224
22009
|
}, [content, fileId, type, config, enabled]);
|
|
21225
22010
|
return url;
|
|
21226
22011
|
}
|
|
21227
|
-
var ImageArtifactPreview =
|
|
22012
|
+
var ImageArtifactPreview = React16.memo(function ImageArtifactPreview2({
|
|
21228
22013
|
content,
|
|
21229
22014
|
metadata,
|
|
21230
22015
|
config
|
|
21231
22016
|
}) {
|
|
21232
|
-
const [isZoomed, setIsZoomed] =
|
|
21233
|
-
const [showInfo, setShowInfo] =
|
|
21234
|
-
const [imgNaturalSize, setImgNaturalSize] =
|
|
21235
|
-
const [copied, setCopied] =
|
|
22017
|
+
const [isZoomed, setIsZoomed] = React16.useState(false);
|
|
22018
|
+
const [showInfo, setShowInfo] = React16.useState(true);
|
|
22019
|
+
const [imgNaturalSize, setImgNaturalSize] = React16.useState(null);
|
|
22020
|
+
const [copied, setCopied] = React16.useState(null);
|
|
21236
22021
|
const { hdUrl: resolvedHdUrl } = useResolvedMediaUrl(content, {
|
|
21237
22022
|
fileId: metadata?.fileId,
|
|
21238
22023
|
type: "image",
|
|
@@ -21241,7 +22026,7 @@ var ImageArtifactPreview = React24.memo(function ImageArtifactPreview2({
|
|
|
21241
22026
|
const generationParams = metadata?.generationParams;
|
|
21242
22027
|
const toolName = metadata?.toolName;
|
|
21243
22028
|
const relation = metadata?.relation;
|
|
21244
|
-
const handleCopy =
|
|
22029
|
+
const handleCopy = React16.useCallback(async (text3, label) => {
|
|
21245
22030
|
try {
|
|
21246
22031
|
await navigator.clipboard.writeText(text3);
|
|
21247
22032
|
setCopied(label);
|
|
@@ -21249,7 +22034,7 @@ var ImageArtifactPreview = React24.memo(function ImageArtifactPreview2({
|
|
|
21249
22034
|
} catch {
|
|
21250
22035
|
}
|
|
21251
22036
|
}, []);
|
|
21252
|
-
const handleDownload =
|
|
22037
|
+
const handleDownload = React16.useCallback(() => {
|
|
21253
22038
|
const link2 = document.createElement("a");
|
|
21254
22039
|
link2.href = resolvedHdUrl;
|
|
21255
22040
|
link2.download = `generated-${Date.now()}.png`;
|
|
@@ -21287,7 +22072,7 @@ var ImageArtifactPreview = React24.memo(function ImageArtifactPreview2({
|
|
|
21287
22072
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
21288
22073
|
"div",
|
|
21289
22074
|
{
|
|
21290
|
-
className:
|
|
22075
|
+
className: cn3(
|
|
21291
22076
|
"relative transition-transform duration-300 cursor-zoom-in z-10",
|
|
21292
22077
|
isZoomed && "cursor-zoom-out scale-[2] z-50"
|
|
21293
22078
|
),
|
|
@@ -21312,7 +22097,7 @@ var ImageArtifactPreview = React24.memo(function ImageArtifactPreview2({
|
|
|
21312
22097
|
"button",
|
|
21313
22098
|
{
|
|
21314
22099
|
onClick: () => setShowInfo((prev) => !prev),
|
|
21315
|
-
className:
|
|
22100
|
+
className: cn3(
|
|
21316
22101
|
"p-2 rounded-lg backdrop-blur-sm transition-colors",
|
|
21317
22102
|
showInfo ? "bg-[#d8ff00]/20 text-[#d8ff00]" : "bg-black/30 text-white/70 hover:text-white hover:bg-black/50"
|
|
21318
22103
|
),
|
|
@@ -21404,7 +22189,7 @@ var ImageArtifactPreview = React24.memo(function ImageArtifactPreview2({
|
|
|
21404
22189
|
] }) })
|
|
21405
22190
|
] });
|
|
21406
22191
|
});
|
|
21407
|
-
var VideoArtifactPreview =
|
|
22192
|
+
var VideoArtifactPreview = React16.memo(function VideoArtifactPreview2({
|
|
21408
22193
|
content,
|
|
21409
22194
|
metadata,
|
|
21410
22195
|
config
|
|
@@ -21414,20 +22199,20 @@ var VideoArtifactPreview = React24.memo(function VideoArtifactPreview2({
|
|
|
21414
22199
|
type: "video",
|
|
21415
22200
|
config
|
|
21416
22201
|
});
|
|
21417
|
-
const videoRef =
|
|
21418
|
-
const progressRef =
|
|
21419
|
-
const [isPlaying, setIsPlaying] =
|
|
21420
|
-
const [isMuted, setIsMuted] =
|
|
21421
|
-
const [duration, setDuration] =
|
|
21422
|
-
const [currentTime, setCurrentTime] =
|
|
21423
|
-
const [volume, setVolume] =
|
|
21424
|
-
const [isLoaded, setIsLoaded] =
|
|
21425
|
-
const [showVolumeSlider, setShowVolumeSlider] =
|
|
21426
|
-
const [posterUrl, setPosterUrl] =
|
|
21427
|
-
const [isDraggingProgress, setIsDraggingProgress] =
|
|
22202
|
+
const videoRef = React16.useRef(null);
|
|
22203
|
+
const progressRef = React16.useRef(null);
|
|
22204
|
+
const [isPlaying, setIsPlaying] = React16.useState(false);
|
|
22205
|
+
const [isMuted, setIsMuted] = React16.useState(false);
|
|
22206
|
+
const [duration, setDuration] = React16.useState(0);
|
|
22207
|
+
const [currentTime, setCurrentTime] = React16.useState(0);
|
|
22208
|
+
const [volume, setVolume] = React16.useState(1);
|
|
22209
|
+
const [isLoaded, setIsLoaded] = React16.useState(false);
|
|
22210
|
+
const [showVolumeSlider, setShowVolumeSlider] = React16.useState(false);
|
|
22211
|
+
const [posterUrl, setPosterUrl] = React16.useState(null);
|
|
22212
|
+
const [isDraggingProgress, setIsDraggingProgress] = React16.useState(false);
|
|
21428
22213
|
const generationParams = metadata?.generationParams;
|
|
21429
22214
|
const toolName = metadata?.toolName;
|
|
21430
|
-
|
|
22215
|
+
React16.useEffect(() => {
|
|
21431
22216
|
const video = document.createElement("video");
|
|
21432
22217
|
video.crossOrigin = "anonymous";
|
|
21433
22218
|
video.preload = "metadata";
|
|
@@ -21468,7 +22253,7 @@ var VideoArtifactPreview = React24.memo(function VideoArtifactPreview2({
|
|
|
21468
22253
|
setCurrentTime(videoRef.current.currentTime);
|
|
21469
22254
|
}
|
|
21470
22255
|
};
|
|
21471
|
-
const togglePlay =
|
|
22256
|
+
const togglePlay = React16.useCallback(() => {
|
|
21472
22257
|
const video = videoRef.current;
|
|
21473
22258
|
if (!video) return;
|
|
21474
22259
|
if (isPlaying) {
|
|
@@ -21479,14 +22264,14 @@ var VideoArtifactPreview = React24.memo(function VideoArtifactPreview2({
|
|
|
21479
22264
|
});
|
|
21480
22265
|
}
|
|
21481
22266
|
}, [isPlaying]);
|
|
21482
|
-
const toggleMute =
|
|
22267
|
+
const toggleMute = React16.useCallback(() => {
|
|
21483
22268
|
const video = videoRef.current;
|
|
21484
22269
|
if (video) {
|
|
21485
22270
|
video.muted = !isMuted;
|
|
21486
22271
|
setIsMuted(!isMuted);
|
|
21487
22272
|
}
|
|
21488
22273
|
}, [isMuted]);
|
|
21489
|
-
const handleVolumeChange =
|
|
22274
|
+
const handleVolumeChange = React16.useCallback((e) => {
|
|
21490
22275
|
const newVolume = parseFloat(e.target.value);
|
|
21491
22276
|
setVolume(newVolume);
|
|
21492
22277
|
if (videoRef.current) {
|
|
@@ -21500,7 +22285,7 @@ var VideoArtifactPreview = React24.memo(function VideoArtifactPreview2({
|
|
|
21500
22285
|
}
|
|
21501
22286
|
}
|
|
21502
22287
|
}, [isMuted]);
|
|
21503
|
-
const handleProgressClick =
|
|
22288
|
+
const handleProgressClick = React16.useCallback((e) => {
|
|
21504
22289
|
const video = videoRef.current;
|
|
21505
22290
|
const bar = progressRef.current;
|
|
21506
22291
|
if (!video || !bar || !duration) return;
|
|
@@ -21509,7 +22294,7 @@ var VideoArtifactPreview = React24.memo(function VideoArtifactPreview2({
|
|
|
21509
22294
|
video.currentTime = ratio * duration;
|
|
21510
22295
|
setCurrentTime(ratio * duration);
|
|
21511
22296
|
}, [duration]);
|
|
21512
|
-
const handleProgressDrag =
|
|
22297
|
+
const handleProgressDrag = React16.useCallback((e) => {
|
|
21513
22298
|
if (!isDraggingProgress) return;
|
|
21514
22299
|
const bar = progressRef.current;
|
|
21515
22300
|
if (!bar || !duration) return;
|
|
@@ -21517,13 +22302,13 @@ var VideoArtifactPreview = React24.memo(function VideoArtifactPreview2({
|
|
|
21517
22302
|
const ratio = Math.max(0, Math.min(1, (e.clientX - rect.left) / rect.width));
|
|
21518
22303
|
setCurrentTime(ratio * duration);
|
|
21519
22304
|
}, [isDraggingProgress, duration]);
|
|
21520
|
-
const handleProgressDragEnd =
|
|
22305
|
+
const handleProgressDragEnd = React16.useCallback(() => {
|
|
21521
22306
|
if (isDraggingProgress && videoRef.current) {
|
|
21522
22307
|
videoRef.current.currentTime = currentTime;
|
|
21523
22308
|
}
|
|
21524
22309
|
setIsDraggingProgress(false);
|
|
21525
22310
|
}, [isDraggingProgress, currentTime]);
|
|
21526
|
-
|
|
22311
|
+
React16.useEffect(() => {
|
|
21527
22312
|
if (!isDraggingProgress) return;
|
|
21528
22313
|
const handleMouseUp = () => handleProgressDragEnd();
|
|
21529
22314
|
const handleMouseMove = (e) => {
|
|
@@ -21540,7 +22325,7 @@ var VideoArtifactPreview = React24.memo(function VideoArtifactPreview2({
|
|
|
21540
22325
|
window.removeEventListener("mousemove", handleMouseMove);
|
|
21541
22326
|
};
|
|
21542
22327
|
}, [isDraggingProgress, duration, handleProgressDragEnd]);
|
|
21543
|
-
const handleDownload =
|
|
22328
|
+
const handleDownload = React16.useCallback(() => {
|
|
21544
22329
|
const link2 = document.createElement("a");
|
|
21545
22330
|
link2.href = resolvedUrl;
|
|
21546
22331
|
link2.download = `video-${Date.now()}.mp4`;
|
|
@@ -21576,7 +22361,7 @@ var VideoArtifactPreview = React24.memo(function VideoArtifactPreview2({
|
|
|
21576
22361
|
onTimeUpdate: handleTimeUpdate,
|
|
21577
22362
|
onEnded: () => setIsPlaying(false),
|
|
21578
22363
|
onClick: togglePlay,
|
|
21579
|
-
className:
|
|
22364
|
+
className: cn3(
|
|
21580
22365
|
"max-w-full max-h-full object-contain cursor-pointer",
|
|
21581
22366
|
!isPlaying && posterUrl && !currentTime && "opacity-0"
|
|
21582
22367
|
)
|
|
@@ -21587,7 +22372,7 @@ var VideoArtifactPreview = React24.memo(function VideoArtifactPreview2({
|
|
|
21587
22372
|
{
|
|
21588
22373
|
className: "absolute inset-0 z-[2] flex items-center justify-center cursor-pointer",
|
|
21589
22374
|
onClick: togglePlay,
|
|
21590
|
-
children: /* @__PURE__ */ jsxRuntime.jsx("div", { className:
|
|
22375
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn3(
|
|
21591
22376
|
"w-16 h-16 rounded-full bg-white/15 backdrop-blur-md",
|
|
21592
22377
|
"flex items-center justify-center",
|
|
21593
22378
|
"transition-all duration-200",
|
|
@@ -21596,7 +22381,7 @@ var VideoArtifactPreview = React24.memo(function VideoArtifactPreview2({
|
|
|
21596
22381
|
), children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "26", height: "26", viewBox: "0 0 24 24", fill: "white", className: "ml-1", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8 5v14l11-7z" }) }) })
|
|
21597
22382
|
}
|
|
21598
22383
|
),
|
|
21599
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className:
|
|
22384
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn3(
|
|
21600
22385
|
"absolute bottom-0 left-0 right-0 z-[3]",
|
|
21601
22386
|
"bg-gradient-to-t from-black/90 via-black/50 to-transparent",
|
|
21602
22387
|
"px-4 pb-3 pt-10",
|
|
@@ -21865,7 +22650,7 @@ ${codeContent.trim()}
|
|
|
21865
22650
|
rows.push(cells);
|
|
21866
22651
|
});
|
|
21867
22652
|
if (rows.length === 0) return "";
|
|
21868
|
-
const colCount = Math.max(...rows.map((
|
|
22653
|
+
const colCount = Math.max(...rows.map((r2) => r2.length));
|
|
21869
22654
|
const colWidths = Array(colCount).fill(3);
|
|
21870
22655
|
rows.forEach((row) => {
|
|
21871
22656
|
row.forEach((cell, i) => {
|
|
@@ -21893,20 +22678,20 @@ ${codeContent.trim()}
|
|
|
21893
22678
|
});
|
|
21894
22679
|
return lines.join("").replace(/\n{3,}/g, "\n\n").trim() + "\n";
|
|
21895
22680
|
}
|
|
21896
|
-
var MarkdownEditor =
|
|
22681
|
+
var MarkdownEditor = React16.memo(function MarkdownEditor2({
|
|
21897
22682
|
content,
|
|
21898
22683
|
onChange,
|
|
21899
22684
|
config
|
|
21900
22685
|
}) {
|
|
21901
|
-
const editorRef =
|
|
21902
|
-
const textareaRef =
|
|
21903
|
-
const [isSourceMode, setIsSourceMode] =
|
|
21904
|
-
const isInternalUpdate =
|
|
21905
|
-
const lastMarkdownRef =
|
|
21906
|
-
const contentToHtml =
|
|
22686
|
+
const editorRef = React16.useRef(null);
|
|
22687
|
+
const textareaRef = React16.useRef(null);
|
|
22688
|
+
const [isSourceMode, setIsSourceMode] = React16.useState(false);
|
|
22689
|
+
const isInternalUpdate = React16.useRef(false);
|
|
22690
|
+
const lastMarkdownRef = React16.useRef(content);
|
|
22691
|
+
const contentToHtml = React16.useCallback((markdown) => {
|
|
21907
22692
|
return marked.marked.parse(markdown, { breaks: true, gfm: true });
|
|
21908
22693
|
}, []);
|
|
21909
|
-
|
|
22694
|
+
React16.useEffect(() => {
|
|
21910
22695
|
if (isSourceMode) return;
|
|
21911
22696
|
if (isInternalUpdate.current) {
|
|
21912
22697
|
isInternalUpdate.current = false;
|
|
@@ -21918,31 +22703,31 @@ var MarkdownEditor = React24.memo(function MarkdownEditor2({
|
|
|
21918
22703
|
lastMarkdownRef.current = content;
|
|
21919
22704
|
}
|
|
21920
22705
|
}, [content, isSourceMode, contentToHtml]);
|
|
21921
|
-
|
|
22706
|
+
React16.useEffect(() => {
|
|
21922
22707
|
if (editorRef.current && !isSourceMode) {
|
|
21923
22708
|
const html2 = contentToHtml(content);
|
|
21924
22709
|
editorRef.current.innerHTML = html2;
|
|
21925
22710
|
}
|
|
21926
22711
|
}, []);
|
|
21927
|
-
const handleInput =
|
|
22712
|
+
const handleInput = React16.useCallback(() => {
|
|
21928
22713
|
if (!editorRef.current) return;
|
|
21929
22714
|
const markdown = htmlToMarkdown(editorRef.current);
|
|
21930
22715
|
lastMarkdownRef.current = markdown;
|
|
21931
22716
|
isInternalUpdate.current = true;
|
|
21932
22717
|
onChange(markdown);
|
|
21933
22718
|
}, [onChange]);
|
|
21934
|
-
const execCommand =
|
|
22719
|
+
const execCommand = React16.useCallback((command, value) => {
|
|
21935
22720
|
editorRef.current?.focus();
|
|
21936
22721
|
document.execCommand(command, false, value);
|
|
21937
22722
|
requestAnimationFrame(() => handleInput());
|
|
21938
22723
|
}, [handleInput]);
|
|
21939
|
-
const formatBlock =
|
|
22724
|
+
const formatBlock = React16.useCallback((tag) => {
|
|
21940
22725
|
execCommand("formatBlock", tag);
|
|
21941
22726
|
}, [execCommand]);
|
|
21942
|
-
const insertHorizontalRule =
|
|
22727
|
+
const insertHorizontalRule = React16.useCallback(() => {
|
|
21943
22728
|
execCommand("insertHorizontalRule");
|
|
21944
22729
|
}, [execCommand]);
|
|
21945
|
-
const insertLink =
|
|
22730
|
+
const insertLink = React16.useCallback(() => {
|
|
21946
22731
|
const selection = window.getSelection();
|
|
21947
22732
|
const selectedText = selection?.toString() || "\u94FE\u63A5\u6587\u672C";
|
|
21948
22733
|
const url = prompt("\u8BF7\u8F93\u5165\u94FE\u63A5\u5730\u5740:", "https://");
|
|
@@ -21962,13 +22747,13 @@ var MarkdownEditor = React24.memo(function MarkdownEditor2({
|
|
|
21962
22747
|
requestAnimationFrame(() => handleInput());
|
|
21963
22748
|
}
|
|
21964
22749
|
}, [handleInput]);
|
|
21965
|
-
const insertImage =
|
|
22750
|
+
const insertImage = React16.useCallback(() => {
|
|
21966
22751
|
const url = prompt("\u8BF7\u8F93\u5165\u56FE\u7247\u5730\u5740:", "https://");
|
|
21967
22752
|
if (url) {
|
|
21968
22753
|
execCommand("insertImage", url);
|
|
21969
22754
|
}
|
|
21970
22755
|
}, [execCommand]);
|
|
21971
|
-
const insertCodeBlock =
|
|
22756
|
+
const insertCodeBlock = React16.useCallback(() => {
|
|
21972
22757
|
const editor = editorRef.current;
|
|
21973
22758
|
if (!editor) return;
|
|
21974
22759
|
const selection = window.getSelection();
|
|
@@ -21990,7 +22775,7 @@ var MarkdownEditor = React24.memo(function MarkdownEditor2({
|
|
|
21990
22775
|
}
|
|
21991
22776
|
requestAnimationFrame(() => handleInput());
|
|
21992
22777
|
}, [handleInput]);
|
|
21993
|
-
const handleKeyDown =
|
|
22778
|
+
const handleKeyDown = React16.useCallback((e) => {
|
|
21994
22779
|
const isMod = e.metaKey || e.ctrlKey;
|
|
21995
22780
|
if (isMod && e.key === "b") {
|
|
21996
22781
|
e.preventDefault();
|
|
@@ -22013,7 +22798,7 @@ var MarkdownEditor = React24.memo(function MarkdownEditor2({
|
|
|
22013
22798
|
execCommand("insertHTML", " ");
|
|
22014
22799
|
}
|
|
22015
22800
|
}, [execCommand]);
|
|
22016
|
-
const handleSourceKeyDown =
|
|
22801
|
+
const handleSourceKeyDown = React16.useCallback((e) => {
|
|
22017
22802
|
if (e.key === "Tab") {
|
|
22018
22803
|
e.preventDefault();
|
|
22019
22804
|
const textarea = e.currentTarget;
|
|
@@ -22026,7 +22811,7 @@ var MarkdownEditor = React24.memo(function MarkdownEditor2({
|
|
|
22026
22811
|
});
|
|
22027
22812
|
}
|
|
22028
22813
|
}, [content, onChange]);
|
|
22029
|
-
const toggleSourceMode =
|
|
22814
|
+
const toggleSourceMode = React16.useCallback(() => {
|
|
22030
22815
|
if (isSourceMode) {
|
|
22031
22816
|
setIsSourceMode(false);
|
|
22032
22817
|
requestAnimationFrame(() => {
|
|
@@ -22046,7 +22831,7 @@ var MarkdownEditor = React24.memo(function MarkdownEditor2({
|
|
|
22046
22831
|
setIsSourceMode(true);
|
|
22047
22832
|
}
|
|
22048
22833
|
}, [isSourceMode, content, contentToHtml, onChange]);
|
|
22049
|
-
const toolbarGroups =
|
|
22834
|
+
const toolbarGroups = React16.useMemo(() => [
|
|
22050
22835
|
{
|
|
22051
22836
|
items: [
|
|
22052
22837
|
{ icon: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-bold text-[11px]", children: "B" }), label: "\u52A0\u7C97 (\u2318B)", onClick: () => execCommand("bold") },
|
|
@@ -22089,7 +22874,7 @@ var MarkdownEditor = React24.memo(function MarkdownEditor2({
|
|
|
22089
22874
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[11px] text-[#d8ff00] font-medium whitespace-nowrap", children: isSourceMode ? "Markdown \u6E90\u7801" : "\u5BCC\u6587\u672C\u7F16\u8F91" })
|
|
22090
22875
|
] }),
|
|
22091
22876
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4 w-px bg-zinc-700/50 agent-sdk-light:bg-zinc-300 mx-1" }),
|
|
22092
|
-
!isSourceMode && toolbarGroups.map((group, groupIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
22877
|
+
!isSourceMode && toolbarGroups.map((group, groupIndex) => /* @__PURE__ */ jsxRuntime.jsxs(React16__namespace.default.Fragment, { children: [
|
|
22093
22878
|
group.items.map((action, actionIndex) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
22094
22879
|
"button",
|
|
22095
22880
|
{
|
|
@@ -22107,7 +22892,7 @@ var MarkdownEditor = React24.memo(function MarkdownEditor2({
|
|
|
22107
22892
|
"button",
|
|
22108
22893
|
{
|
|
22109
22894
|
onClick: toggleSourceMode,
|
|
22110
|
-
className:
|
|
22895
|
+
className: cn3(
|
|
22111
22896
|
"p-1.5 flex items-center gap-1 text-[11px] rounded transition-colors whitespace-nowrap",
|
|
22112
22897
|
isSourceMode ? "bg-[#d8ff00]/10 text-[#d8ff00]" : "text-zinc-400 agent-sdk-light:text-zinc-600 hover:text-zinc-100 agent-sdk-light:hover:text-zinc-900 hover:bg-zinc-700/50 agent-sdk-light:hover:bg-zinc-200"
|
|
22113
22898
|
),
|
|
@@ -22154,7 +22939,7 @@ var MarkdownEditor = React24.memo(function MarkdownEditor2({
|
|
|
22154
22939
|
) })
|
|
22155
22940
|
] });
|
|
22156
22941
|
});
|
|
22157
|
-
var ArtifactThumbnail =
|
|
22942
|
+
var ArtifactThumbnail = React16.memo(function ArtifactThumbnail2({
|
|
22158
22943
|
artifact,
|
|
22159
22944
|
config
|
|
22160
22945
|
}) {
|
|
@@ -22181,9 +22966,9 @@ var ArtifactThumbnail = React24.memo(function ArtifactThumbnail2({
|
|
|
22181
22966
|
}
|
|
22182
22967
|
);
|
|
22183
22968
|
}
|
|
22184
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { className:
|
|
22969
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn3("w-6 h-6 rounded flex items-center justify-center flex-shrink-0", typeConf.bgColor), children: /* @__PURE__ */ jsxRuntime.jsx(TypeIcon, { size: 12, className: typeConf.color }) });
|
|
22185
22970
|
});
|
|
22186
|
-
var ArtifactTabs =
|
|
22971
|
+
var ArtifactTabs = React16.memo(function ArtifactTabs2({
|
|
22187
22972
|
artifacts,
|
|
22188
22973
|
activeId,
|
|
22189
22974
|
onSwitch,
|
|
@@ -22191,19 +22976,19 @@ var ArtifactTabs = React24.memo(function ArtifactTabs2({
|
|
|
22191
22976
|
onReorder,
|
|
22192
22977
|
config
|
|
22193
22978
|
}) {
|
|
22194
|
-
const scrollContainerRef =
|
|
22195
|
-
const [canScrollLeft, setCanScrollLeft] =
|
|
22196
|
-
const [canScrollRight, setCanScrollRight] =
|
|
22197
|
-
const [showAllPanel, setShowAllPanel] =
|
|
22198
|
-
const allPanelRef =
|
|
22199
|
-
const [dragState, setDragState] =
|
|
22200
|
-
const checkScrollState =
|
|
22979
|
+
const scrollContainerRef = React16.useRef(null);
|
|
22980
|
+
const [canScrollLeft, setCanScrollLeft] = React16.useState(false);
|
|
22981
|
+
const [canScrollRight, setCanScrollRight] = React16.useState(false);
|
|
22982
|
+
const [showAllPanel, setShowAllPanel] = React16.useState(false);
|
|
22983
|
+
const allPanelRef = React16.useRef(null);
|
|
22984
|
+
const [dragState, setDragState] = React16.useState({ draggingId: null, dragOverId: null, dragStartX: 0, isDragging: false });
|
|
22985
|
+
const checkScrollState = React16.useCallback(() => {
|
|
22201
22986
|
const container = scrollContainerRef.current;
|
|
22202
22987
|
if (!container) return;
|
|
22203
22988
|
setCanScrollLeft(container.scrollLeft > 2);
|
|
22204
22989
|
setCanScrollRight(container.scrollLeft < container.scrollWidth - container.clientWidth - 2);
|
|
22205
22990
|
}, []);
|
|
22206
|
-
|
|
22991
|
+
React16.useEffect(() => {
|
|
22207
22992
|
checkScrollState();
|
|
22208
22993
|
const container = scrollContainerRef.current;
|
|
22209
22994
|
if (!container) return;
|
|
@@ -22215,7 +23000,7 @@ var ArtifactTabs = React24.memo(function ArtifactTabs2({
|
|
|
22215
23000
|
resizeObserver.disconnect();
|
|
22216
23001
|
};
|
|
22217
23002
|
}, [checkScrollState, artifacts.length]);
|
|
22218
|
-
|
|
23003
|
+
React16.useEffect(() => {
|
|
22219
23004
|
if (!showAllPanel) return;
|
|
22220
23005
|
const handleClickOutside = (e) => {
|
|
22221
23006
|
if (allPanelRef.current && !allPanelRef.current.contains(e.target)) {
|
|
@@ -22225,7 +23010,7 @@ var ArtifactTabs = React24.memo(function ArtifactTabs2({
|
|
|
22225
23010
|
document.addEventListener("mousedown", handleClickOutside);
|
|
22226
23011
|
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
22227
23012
|
}, [showAllPanel]);
|
|
22228
|
-
const scrollBy =
|
|
23013
|
+
const scrollBy = React16.useCallback((direction) => {
|
|
22229
23014
|
const container = scrollContainerRef.current;
|
|
22230
23015
|
if (!container) return;
|
|
22231
23016
|
const scrollAmount = 200;
|
|
@@ -22234,20 +23019,20 @@ var ArtifactTabs = React24.memo(function ArtifactTabs2({
|
|
|
22234
23019
|
behavior: "smooth"
|
|
22235
23020
|
});
|
|
22236
23021
|
}, []);
|
|
22237
|
-
const handleDragStart =
|
|
23022
|
+
const handleDragStart = React16.useCallback((e, artifactId) => {
|
|
22238
23023
|
e.dataTransfer.effectAllowed = "move";
|
|
22239
23024
|
e.dataTransfer.setData("text/plain", artifactId);
|
|
22240
23025
|
setDragState((prev) => ({ ...prev, draggingId: artifactId, dragStartX: e.clientX, isDragging: true }));
|
|
22241
23026
|
}, []);
|
|
22242
|
-
const handleDragOver =
|
|
23027
|
+
const handleDragOver = React16.useCallback((e, artifactId) => {
|
|
22243
23028
|
e.preventDefault();
|
|
22244
23029
|
e.dataTransfer.dropEffect = "move";
|
|
22245
23030
|
setDragState((prev) => ({ ...prev, dragOverId: artifactId }));
|
|
22246
23031
|
}, []);
|
|
22247
|
-
const handleDragEnd =
|
|
23032
|
+
const handleDragEnd = React16.useCallback(() => {
|
|
22248
23033
|
setDragState({ draggingId: null, dragOverId: null, dragStartX: 0, isDragging: false });
|
|
22249
23034
|
}, []);
|
|
22250
|
-
const handleDrop =
|
|
23035
|
+
const handleDrop = React16.useCallback((e, targetId) => {
|
|
22251
23036
|
e.preventDefault();
|
|
22252
23037
|
const sourceId = e.dataTransfer.getData("text/plain");
|
|
22253
23038
|
if (!sourceId || sourceId === targetId || !onReorder) {
|
|
@@ -22261,7 +23046,7 @@ var ArtifactTabs = React24.memo(function ArtifactTabs2({
|
|
|
22261
23046
|
}
|
|
22262
23047
|
handleDragEnd();
|
|
22263
23048
|
}, [artifacts, onReorder, handleDragEnd]);
|
|
22264
|
-
const handleCloseTab =
|
|
23049
|
+
const handleCloseTab = React16.useCallback((e, artifactId) => {
|
|
22265
23050
|
e.stopPropagation();
|
|
22266
23051
|
if (!onClose) return;
|
|
22267
23052
|
if (artifactId === activeId && artifacts.length > 1) {
|
|
@@ -22304,7 +23089,7 @@ var ArtifactTabs = React24.memo(function ArtifactTabs2({
|
|
|
22304
23089
|
onDragEnd: handleDragEnd,
|
|
22305
23090
|
onDrop: (e) => handleDrop(e, artifact.id),
|
|
22306
23091
|
onClick: () => onSwitch(artifact.id),
|
|
22307
|
-
className:
|
|
23092
|
+
className: cn3(
|
|
22308
23093
|
"group/tab flex items-center gap-1 pl-2.5 pr-1 py-1 text-xs rounded-md transition-all whitespace-nowrap flex-shrink-0 cursor-pointer select-none",
|
|
22309
23094
|
isActive ? "bg-zinc-800 text-zinc-100 agent-sdk-light:bg-zinc-200 agent-sdk-light:text-zinc-900" : "text-zinc-500 agent-sdk-light:text-zinc-600 hover:text-zinc-300 agent-sdk-light:hover:text-zinc-900 hover:bg-zinc-800/50 agent-sdk-light:hover:bg-zinc-200/50",
|
|
22310
23095
|
isDragging && "opacity-40",
|
|
@@ -22313,13 +23098,13 @@ var ArtifactTabs = React24.memo(function ArtifactTabs2({
|
|
|
22313
23098
|
),
|
|
22314
23099
|
title: artifact.title,
|
|
22315
23100
|
children: [
|
|
22316
|
-
/* @__PURE__ */ jsxRuntime.jsx(TypeIcon, { size: 12, className:
|
|
23101
|
+
/* @__PURE__ */ jsxRuntime.jsx(TypeIcon, { size: 12, className: cn3("flex-shrink-0", isActive ? typeConf.color : "") }),
|
|
22317
23102
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-w-[120px] truncate", children: artifact.title }),
|
|
22318
23103
|
onClose && /* @__PURE__ */ jsxRuntime.jsx(
|
|
22319
23104
|
"button",
|
|
22320
23105
|
{
|
|
22321
23106
|
onClick: (e) => handleCloseTab(e, artifact.id),
|
|
22322
|
-
className:
|
|
23107
|
+
className: cn3(
|
|
22323
23108
|
"ml-0.5 p-0.5 rounded transition-colors flex-shrink-0",
|
|
22324
23109
|
isActive ? "text-zinc-400 hover:text-zinc-100 hover:bg-zinc-700" : "text-transparent group-hover/tab:text-zinc-500 hover:!text-zinc-300 hover:!bg-zinc-700"
|
|
22325
23110
|
),
|
|
@@ -22347,7 +23132,7 @@ var ArtifactTabs = React24.memo(function ArtifactTabs2({
|
|
|
22347
23132
|
"button",
|
|
22348
23133
|
{
|
|
22349
23134
|
onClick: () => setShowAllPanel((prev) => !prev),
|
|
22350
|
-
className:
|
|
23135
|
+
className: cn3(
|
|
22351
23136
|
"p-1.5 mr-1 text-zinc-500 hover:text-zinc-300 hover:bg-zinc-800/50 rounded transition-colors",
|
|
22352
23137
|
showAllPanel && "bg-zinc-800 text-zinc-300"
|
|
22353
23138
|
),
|
|
@@ -22372,7 +23157,7 @@ var ArtifactTabs = React24.memo(function ArtifactTabs2({
|
|
|
22372
23157
|
onSwitch(artifact.id);
|
|
22373
23158
|
setShowAllPanel(false);
|
|
22374
23159
|
},
|
|
22375
|
-
className:
|
|
23160
|
+
className: cn3(
|
|
22376
23161
|
"flex items-center gap-2.5 px-2.5 py-2 text-xs rounded-md transition-all w-full text-left",
|
|
22377
23162
|
isActive ? "bg-zinc-800 text-zinc-100 agent-sdk-light:bg-zinc-100 agent-sdk-light:text-zinc-900" : "text-zinc-400 agent-sdk-light:text-zinc-600 hover:text-zinc-200 agent-sdk-light:hover:text-zinc-900 hover:bg-zinc-800/50 agent-sdk-light:hover:bg-zinc-100"
|
|
22378
23163
|
),
|
|
@@ -22406,7 +23191,7 @@ var ArtifactTabs = React24.memo(function ArtifactTabs2({
|
|
|
22406
23191
|
] })
|
|
22407
23192
|
] });
|
|
22408
23193
|
});
|
|
22409
|
-
var ArtifactViewer =
|
|
23194
|
+
var ArtifactViewer = React16.memo(function ArtifactViewer2({
|
|
22410
23195
|
artifact,
|
|
22411
23196
|
isOpen,
|
|
22412
23197
|
onClose,
|
|
@@ -22423,12 +23208,12 @@ var ArtifactViewer = React24.memo(function ArtifactViewer2({
|
|
|
22423
23208
|
onContentChange,
|
|
22424
23209
|
onSave
|
|
22425
23210
|
}) {
|
|
22426
|
-
const [viewMode, setViewMode] =
|
|
22427
|
-
const [isEditing, setIsEditing] =
|
|
22428
|
-
const [editContent, setEditContent] =
|
|
22429
|
-
const [undoStack, setUndoStack] =
|
|
22430
|
-
const [redoStack, setRedoStack] =
|
|
22431
|
-
|
|
23211
|
+
const [viewMode, setViewMode] = React16.useState(defaultView);
|
|
23212
|
+
const [isEditing, setIsEditing] = React16.useState(false);
|
|
23213
|
+
const [editContent, setEditContent] = React16.useState("");
|
|
23214
|
+
const [undoStack, setUndoStack] = React16.useState([]);
|
|
23215
|
+
const [redoStack, setRedoStack] = React16.useState([]);
|
|
23216
|
+
React16.useEffect(() => {
|
|
22432
23217
|
if (artifact) {
|
|
22433
23218
|
if (artifact.type === "html" || artifact.type === "markdown" || artifact.type === "svg") {
|
|
22434
23219
|
setViewMode("preview");
|
|
@@ -22441,7 +23226,7 @@ var ArtifactViewer = React24.memo(function ArtifactViewer2({
|
|
|
22441
23226
|
setRedoStack([]);
|
|
22442
23227
|
}
|
|
22443
23228
|
}, [artifact?.id]);
|
|
22444
|
-
|
|
23229
|
+
React16.useEffect(() => {
|
|
22445
23230
|
if (artifact && !isEditing) {
|
|
22446
23231
|
setEditContent(artifact.content);
|
|
22447
23232
|
}
|
|
@@ -22716,7 +23501,7 @@ function InformationSupplement({
|
|
|
22716
23501
|
referenceImage,
|
|
22717
23502
|
qrCode
|
|
22718
23503
|
}) {
|
|
22719
|
-
const [open, setOpen] =
|
|
23504
|
+
const [open, setOpen] = React16__namespace.default.useState(!confirmed);
|
|
22720
23505
|
const resolvedMain = main_image || mainImage;
|
|
22721
23506
|
const resolvedRef = reference_image || referenceImage;
|
|
22722
23507
|
const resolvedQr = qrcode || qrCode;
|
|
@@ -22764,8 +23549,8 @@ function InformationSupplement({
|
|
|
22764
23549
|
] });
|
|
22765
23550
|
}
|
|
22766
23551
|
function BriefReview({ content, confirmed }) {
|
|
22767
|
-
const [open, setOpen] =
|
|
22768
|
-
const sanitizedContent =
|
|
23552
|
+
const [open, setOpen] = React16.useState(!confirmed);
|
|
23553
|
+
const sanitizedContent = React16.useMemo(() => sanitizeMarkdownContent(content || ""), [content]);
|
|
22769
23554
|
if (!sanitizedContent) {
|
|
22770
23555
|
return null;
|
|
22771
23556
|
}
|
|
@@ -22797,8 +23582,8 @@ function SessionItem({
|
|
|
22797
23582
|
onReplay,
|
|
22798
23583
|
onShare
|
|
22799
23584
|
}) {
|
|
22800
|
-
const [editing, setEditing] =
|
|
22801
|
-
const [title, setTitle] =
|
|
23585
|
+
const [editing, setEditing] = React16.useState(false);
|
|
23586
|
+
const [title, setTitle] = React16.useState("");
|
|
22802
23587
|
const startEdit = (e) => {
|
|
22803
23588
|
e.stopPropagation();
|
|
22804
23589
|
setTitle(session.title || "\u65B0\u5BF9\u8BDD");
|
|
@@ -22873,7 +23658,7 @@ function Sidebar({
|
|
|
22873
23658
|
collapsed,
|
|
22874
23659
|
onToggle
|
|
22875
23660
|
}) {
|
|
22876
|
-
const [search, setSearch] =
|
|
23661
|
+
const [search, setSearch] = React16.useState("");
|
|
22877
23662
|
const filtered = sessions.filter(
|
|
22878
23663
|
(s) => !search || (s.title || "").toLowerCase().includes(search.toLowerCase())
|
|
22879
23664
|
);
|
|
@@ -22948,7 +23733,7 @@ function Sidebar({
|
|
|
22948
23733
|
] });
|
|
22949
23734
|
}
|
|
22950
23735
|
function WelcomePage({ agentName, welcomeMessage, tools, onNew, onPrompt }) {
|
|
22951
|
-
const quickPrompts =
|
|
23736
|
+
const quickPrompts = React16__namespace.default.useMemo(() => {
|
|
22952
23737
|
const prompts = [];
|
|
22953
23738
|
const hasImageTool = tools?.some(
|
|
22954
23739
|
(t) => t.name?.toLowerCase().includes("image") || t.name?.toLowerCase().includes("\u56FE\u7247") || t.type === "COMFY_APP"
|
|
@@ -23036,8 +23821,8 @@ function ChatInputArea({
|
|
|
23036
23821
|
onDetachArtifact,
|
|
23037
23822
|
onOpenTemplates
|
|
23038
23823
|
}) {
|
|
23039
|
-
const textareaRef =
|
|
23040
|
-
const fileInputRef =
|
|
23824
|
+
const textareaRef = React16.useRef(null);
|
|
23825
|
+
const fileInputRef = React16.useRef(null);
|
|
23041
23826
|
const removeImage = (index) => {
|
|
23042
23827
|
setImages((prev) => {
|
|
23043
23828
|
const newImages = [...prev];
|
|
@@ -23267,13 +24052,13 @@ function ChatInputArea({
|
|
|
23267
24052
|
] })
|
|
23268
24053
|
] }) });
|
|
23269
24054
|
}
|
|
23270
|
-
var DragHandle =
|
|
24055
|
+
var DragHandle = React16__namespace.default.memo(function DragHandle2({
|
|
23271
24056
|
artifactPanelWidth,
|
|
23272
24057
|
isDragging,
|
|
23273
24058
|
onMouseDown
|
|
23274
24059
|
}) {
|
|
23275
|
-
const [isHovered, setIsHovered] =
|
|
23276
|
-
|
|
24060
|
+
const [isHovered, setIsHovered] = React16.useState(false);
|
|
24061
|
+
React16.useEffect(() => {
|
|
23277
24062
|
if (isHovered || isDragging) {
|
|
23278
24063
|
document.body.style.cursor = "col-resize";
|
|
23279
24064
|
} else {
|
|
@@ -23294,7 +24079,7 @@ var DragHandle = React24__namespace.default.memo(function DragHandle2({
|
|
|
23294
24079
|
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
23295
24080
|
"div",
|
|
23296
24081
|
{
|
|
23297
|
-
className:
|
|
24082
|
+
className: cn3(
|
|
23298
24083
|
"absolute left-1/2 top-0 bottom-0 -translate-x-1/2",
|
|
23299
24084
|
"transition-all duration-100"
|
|
23300
24085
|
),
|
|
@@ -23317,7 +24102,7 @@ var artifactTypeIconMap = {
|
|
|
23317
24102
|
image: lucideReact.FileImage,
|
|
23318
24103
|
video: lucideReact.Video
|
|
23319
24104
|
};
|
|
23320
|
-
var ArtifactBarItemThumbnail =
|
|
24105
|
+
var ArtifactBarItemThumbnail = React16.memo(function ArtifactBarItemThumbnail2({
|
|
23321
24106
|
artifact,
|
|
23322
24107
|
config
|
|
23323
24108
|
}) {
|
|
@@ -23345,7 +24130,7 @@ var ArtifactBarItemThumbnail = React24.memo(function ArtifactBarItemThumbnail2({
|
|
|
23345
24130
|
}
|
|
23346
24131
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-lg bg-zinc-800/50 agent-sdk-light:bg-zinc-100 flex items-center justify-center flex-shrink-0 border border-zinc-700/30 agent-sdk-light:border-zinc-300", children: /* @__PURE__ */ jsxRuntime.jsx(TypeIcon, { size: 18, className: "text-zinc-400 agent-sdk-light:text-zinc-500" }) });
|
|
23347
24132
|
});
|
|
23348
|
-
var ArtifactBarMiniThumbnail =
|
|
24133
|
+
var ArtifactBarMiniThumbnail = React16.memo(function ArtifactBarMiniThumbnail2({
|
|
23349
24134
|
artifact,
|
|
23350
24135
|
config
|
|
23351
24136
|
}) {
|
|
@@ -23373,14 +24158,14 @@ var ArtifactBarMiniThumbnail = React24.memo(function ArtifactBarMiniThumbnail2({
|
|
|
23373
24158
|
}
|
|
23374
24159
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-6 h-6 rounded border border-zinc-700 agent-sdk-light:border-zinc-300 bg-zinc-800 agent-sdk-light:bg-zinc-200 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(TypeIcon, { size: 10, className: "text-zinc-400" }) });
|
|
23375
24160
|
});
|
|
23376
|
-
var ArtifactBar =
|
|
24161
|
+
var ArtifactBar = React16__namespace.default.memo(function ArtifactBar2({
|
|
23377
24162
|
artifacts,
|
|
23378
24163
|
onOpenArtifact,
|
|
23379
24164
|
config
|
|
23380
24165
|
}) {
|
|
23381
|
-
const [expanded, setExpanded] =
|
|
23382
|
-
const barRef =
|
|
23383
|
-
|
|
24166
|
+
const [expanded, setExpanded] = React16.useState(false);
|
|
24167
|
+
const barRef = React16.useRef(null);
|
|
24168
|
+
React16.useEffect(() => {
|
|
23384
24169
|
if (!expanded) return;
|
|
23385
24170
|
const handleClickOutside = (e) => {
|
|
23386
24171
|
if (barRef.current && !barRef.current.contains(e.target)) {
|
|
@@ -23480,7 +24265,7 @@ var ArtifactBar = React24__namespace.default.memo(function ArtifactBar2({
|
|
|
23480
24265
|
artifacts.length - 4
|
|
23481
24266
|
] }) })
|
|
23482
24267
|
] }),
|
|
23483
|
-
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { size: 14, className:
|
|
24268
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { size: 14, className: cn3(
|
|
23484
24269
|
"text-zinc-500 transition-transform flex-shrink-0",
|
|
23485
24270
|
expanded && "rotate-180"
|
|
23486
24271
|
) })
|
|
@@ -23502,12 +24287,12 @@ function useArtifactPanel({ currentSessionId }) {
|
|
|
23502
24287
|
reorderArtifacts,
|
|
23503
24288
|
updateArtifactContent
|
|
23504
24289
|
} = useAgentStore();
|
|
23505
|
-
const [isArtifactFullscreen, setIsArtifactFullscreen] =
|
|
23506
|
-
const [artifactPanelWidth, setArtifactPanelWidth] =
|
|
23507
|
-
const [isDragging, setIsDragging] =
|
|
23508
|
-
const dragStartRef =
|
|
23509
|
-
const containerRef =
|
|
23510
|
-
const artifactList =
|
|
24290
|
+
const [isArtifactFullscreen, setIsArtifactFullscreen] = React16.useState(false);
|
|
24291
|
+
const [artifactPanelWidth, setArtifactPanelWidth] = React16.useState(50);
|
|
24292
|
+
const [isDragging, setIsDragging] = React16.useState(false);
|
|
24293
|
+
const dragStartRef = React16.useRef(null);
|
|
24294
|
+
const containerRef = React16.useRef(null);
|
|
24295
|
+
const artifactList = React16__namespace.default.useMemo(() => {
|
|
23511
24296
|
const ordered = artifactOrder.map((id) => artifacts[id]).filter(Boolean);
|
|
23512
24297
|
const unordered = Object.values(artifacts).filter(
|
|
23513
24298
|
(a) => !artifactOrder.includes(a.id)
|
|
@@ -23515,7 +24300,7 @@ function useArtifactPanel({ currentSessionId }) {
|
|
|
23515
24300
|
return [...ordered, ...unordered];
|
|
23516
24301
|
}, [artifacts, artifactOrder]);
|
|
23517
24302
|
const activeArtifact = activeArtifactId ? artifacts[activeArtifactId] ?? null : null;
|
|
23518
|
-
const handleDragMouseDown =
|
|
24303
|
+
const handleDragMouseDown = React16.useCallback((e) => {
|
|
23519
24304
|
e.preventDefault();
|
|
23520
24305
|
e.stopPropagation();
|
|
23521
24306
|
dragStartRef.current = {
|
|
@@ -23526,7 +24311,7 @@ function useArtifactPanel({ currentSessionId }) {
|
|
|
23526
24311
|
document.body.style.cursor = "col-resize";
|
|
23527
24312
|
document.body.style.userSelect = "none";
|
|
23528
24313
|
}, [artifactPanelWidth]);
|
|
23529
|
-
|
|
24314
|
+
React16.useEffect(() => {
|
|
23530
24315
|
if (!isDragging) return;
|
|
23531
24316
|
const handleMouseMove = (e) => {
|
|
23532
24317
|
if (!dragStartRef.current || !containerRef.current) return;
|
|
@@ -23557,7 +24342,7 @@ function useArtifactPanel({ currentSessionId }) {
|
|
|
23557
24342
|
document.body.style.userSelect = "";
|
|
23558
24343
|
};
|
|
23559
24344
|
}, [isDragging]);
|
|
23560
|
-
const handleOpenArtifact =
|
|
24345
|
+
const handleOpenArtifact = React16.useCallback((data) => {
|
|
23561
24346
|
const currentArtifact = activeArtifactId ? artifacts[activeArtifactId] : null;
|
|
23562
24347
|
if (currentArtifact && currentArtifact.currentContent === data.content && currentArtifact.type === data.type) {
|
|
23563
24348
|
setActiveArtifact(null);
|
|
@@ -23587,11 +24372,11 @@ function useArtifactPanel({ currentSessionId }) {
|
|
|
23587
24372
|
setActiveArtifact(newArtifactEntry.id);
|
|
23588
24373
|
}
|
|
23589
24374
|
}, [activeArtifactId, artifacts, currentSessionId, upsertArtifact, setActiveArtifact]);
|
|
23590
|
-
const handleCloseArtifact =
|
|
24375
|
+
const handleCloseArtifact = React16.useCallback(() => {
|
|
23591
24376
|
setActiveArtifact(null);
|
|
23592
24377
|
setIsArtifactFullscreen(false);
|
|
23593
24378
|
}, [setActiveArtifact]);
|
|
23594
|
-
|
|
24379
|
+
React16.useEffect(() => {
|
|
23595
24380
|
const handleKeyDown = (e) => {
|
|
23596
24381
|
if (e.key === "Escape" && activeArtifactId) {
|
|
23597
24382
|
if (isArtifactFullscreen) {
|
|
@@ -23604,7 +24389,7 @@ function useArtifactPanel({ currentSessionId }) {
|
|
|
23604
24389
|
document.addEventListener("keydown", handleKeyDown);
|
|
23605
24390
|
return () => document.removeEventListener("keydown", handleKeyDown);
|
|
23606
24391
|
}, [activeArtifactId, isArtifactFullscreen, setActiveArtifact]);
|
|
23607
|
-
const handleToggleArtifactFullscreen =
|
|
24392
|
+
const handleToggleArtifactFullscreen = React16.useCallback(() => {
|
|
23608
24393
|
setIsArtifactFullscreen((prev) => !prev);
|
|
23609
24394
|
}, []);
|
|
23610
24395
|
return {
|
|
@@ -23821,8 +24606,8 @@ function useSessionManager({
|
|
|
23821
24606
|
onSessionIdChange,
|
|
23822
24607
|
reconnect
|
|
23823
24608
|
}) {
|
|
23824
|
-
const [loading, setLoading] =
|
|
23825
|
-
const [messagesLoading, setMessagesLoading] =
|
|
24609
|
+
const [loading, setLoading] = React16.useState(true);
|
|
24610
|
+
const [messagesLoading, setMessagesLoading] = React16.useState(false);
|
|
23826
24611
|
const {
|
|
23827
24612
|
sessions,
|
|
23828
24613
|
setSessions,
|
|
@@ -23835,7 +24620,11 @@ function useSessionManager({
|
|
|
23835
24620
|
upsertArtifact,
|
|
23836
24621
|
setMessages
|
|
23837
24622
|
} = useAgentStore();
|
|
23838
|
-
|
|
24623
|
+
React16.useEffect(() => {
|
|
24624
|
+
setCurrentSession(null);
|
|
24625
|
+
setMessages([]);
|
|
24626
|
+
clearArtifacts();
|
|
24627
|
+
setLoading(true);
|
|
23839
24628
|
sessionService.list({ projectId, agentId, pageSize: 100 }).then(async (res) => {
|
|
23840
24629
|
if (res.success && res.data) {
|
|
23841
24630
|
const list2 = res.data.list.map((s) => ({
|
|
@@ -23845,8 +24634,8 @@ function useSessionManager({
|
|
|
23845
24634
|
setSessions(list2);
|
|
23846
24635
|
}
|
|
23847
24636
|
}).finally(() => setLoading(false));
|
|
23848
|
-
}, [projectId, agentId, setSessions]);
|
|
23849
|
-
const loadMessages =
|
|
24637
|
+
}, [projectId, agentId, setSessions, setCurrentSession, setMessages, clearArtifacts]);
|
|
24638
|
+
const loadMessages = React16.useCallback(async (sessionId) => {
|
|
23850
24639
|
const res = await sessionService.getMessages(sessionId, { pageNo: 1, pageSize: 100 });
|
|
23851
24640
|
if (res.success && res.data?.list) {
|
|
23852
24641
|
const msgs = res.data.list.map((m) => {
|
|
@@ -23887,16 +24676,17 @@ function useSessionManager({
|
|
|
23887
24676
|
}
|
|
23888
24677
|
}
|
|
23889
24678
|
}, [setMessages, reconnect]);
|
|
23890
|
-
const handleNew =
|
|
24679
|
+
const handleNew = React16.useCallback(async () => {
|
|
23891
24680
|
const s = await createAndStartSession(projectId, agentId, "\u65B0\u5BF9\u8BDD");
|
|
23892
24681
|
if (s?.sessionId) {
|
|
23893
24682
|
addSession(s);
|
|
23894
24683
|
setCurrentSession(s);
|
|
24684
|
+
onSessionIdChange?.(s.sessionId);
|
|
23895
24685
|
setMessages([]);
|
|
23896
24686
|
clearArtifacts();
|
|
23897
24687
|
}
|
|
23898
|
-
}, [projectId, agentId, addSession, setCurrentSession, setMessages, clearArtifacts]);
|
|
23899
|
-
const handleSelect =
|
|
24688
|
+
}, [projectId, agentId, addSession, setCurrentSession, onSessionIdChange, setMessages, clearArtifacts]);
|
|
24689
|
+
const handleSelect = React16.useCallback(async (s) => {
|
|
23900
24690
|
setCurrentSession(s);
|
|
23901
24691
|
onSessionIdChange?.(s.sessionId);
|
|
23902
24692
|
setMessages([]);
|
|
@@ -23923,7 +24713,7 @@ function useSessionManager({
|
|
|
23923
24713
|
}
|
|
23924
24714
|
setMessagesLoading(false);
|
|
23925
24715
|
}, [setCurrentSession, onSessionIdChange, setMessages, clearArtifacts, setArtifacts, loadMessages, upsertArtifact]);
|
|
23926
|
-
const handleDelete2 =
|
|
24716
|
+
const handleDelete2 = React16.useCallback((id) => {
|
|
23927
24717
|
toast("\u5220\u9664\u6B64\u5BF9\u8BDD\uFF1F", {
|
|
23928
24718
|
action: {
|
|
23929
24719
|
label: "\u786E\u8BA4\u5220\u9664",
|
|
@@ -23948,7 +24738,7 @@ function useSessionManager({
|
|
|
23948
24738
|
}
|
|
23949
24739
|
});
|
|
23950
24740
|
}, [currentSession, sessions, removeSession, setCurrentSession]);
|
|
23951
|
-
const handleRename =
|
|
24741
|
+
const handleRename = React16.useCallback(async (id, title) => {
|
|
23952
24742
|
const res = await sessionService.updateTitle(id, title);
|
|
23953
24743
|
if (res.success) {
|
|
23954
24744
|
useAgentStore.getState().updateSession(id, { title });
|
|
@@ -23976,14 +24766,14 @@ function useMessageSender({
|
|
|
23976
24766
|
activeArtifactId,
|
|
23977
24767
|
artifacts
|
|
23978
24768
|
}) {
|
|
23979
|
-
const [input, setInput] =
|
|
23980
|
-
const [images, setImages] =
|
|
23981
|
-
const [isSending, setIsSending] =
|
|
23982
|
-
const textareaRef =
|
|
23983
|
-
const fileInputRef =
|
|
23984
|
-
const lastUserMessageRef =
|
|
24769
|
+
const [input, setInput] = React16.useState("");
|
|
24770
|
+
const [images, setImages] = React16.useState([]);
|
|
24771
|
+
const [isSending, setIsSending] = React16.useState(false);
|
|
24772
|
+
const textareaRef = React16.useRef(null);
|
|
24773
|
+
const fileInputRef = React16.useRef(null);
|
|
24774
|
+
const lastUserMessageRef = React16.useRef("");
|
|
23985
24775
|
const { addMessage, updateMessage } = useAgentStore();
|
|
23986
|
-
const handleSend =
|
|
24776
|
+
const handleSend = React16.useCallback(async () => {
|
|
23987
24777
|
if (!input.trim() && images.length === 0) return;
|
|
23988
24778
|
if (!currentSessionId) return;
|
|
23989
24779
|
if (isSending) return;
|
|
@@ -24092,13 +24882,13 @@ function useMessageSender({
|
|
|
24092
24882
|
setIsSending(false);
|
|
24093
24883
|
}
|
|
24094
24884
|
}, [input, images, currentSessionId, sendMessage, config, activeArtifactId, artifacts, isSending, addMessage, updateMessage]);
|
|
24095
|
-
const sendTextMessage =
|
|
24885
|
+
const sendTextMessage = React16.useCallback(async (content) => {
|
|
24096
24886
|
if (!content.trim()) return;
|
|
24097
24887
|
if (!currentSessionId) return;
|
|
24098
24888
|
lastUserMessageRef.current = content.trim();
|
|
24099
24889
|
await sendMessage(currentSessionId, content.trim());
|
|
24100
24890
|
}, [currentSessionId, sendMessage]);
|
|
24101
|
-
const addAssetsWithPreview =
|
|
24891
|
+
const addAssetsWithPreview = React16.useCallback(async (assets) => {
|
|
24102
24892
|
const previews = await Promise.all(
|
|
24103
24893
|
assets.map(async (asset) => {
|
|
24104
24894
|
if (asset.file instanceof File) {
|
|
@@ -24194,15 +24984,15 @@ function useTemplateManager({
|
|
|
24194
24984
|
onTemplateSend,
|
|
24195
24985
|
setInput
|
|
24196
24986
|
} = {}) {
|
|
24197
|
-
const [showTemplateSelector, setShowTemplateSelector] =
|
|
24198
|
-
const [selectedTemplate, setSelectedTemplate] =
|
|
24199
|
-
const [showSaveTemplate, setShowSaveTemplate] =
|
|
24200
|
-
const [saveTemplateContent, setSaveTemplateContent] =
|
|
24201
|
-
const [isSavingTemplate, setIsSavingTemplate] =
|
|
24202
|
-
const handleOpenTemplates =
|
|
24987
|
+
const [showTemplateSelector, setShowTemplateSelector] = React16.useState(false);
|
|
24988
|
+
const [selectedTemplate, setSelectedTemplate] = React16.useState(null);
|
|
24989
|
+
const [showSaveTemplate, setShowSaveTemplate] = React16.useState(false);
|
|
24990
|
+
const [saveTemplateContent, setSaveTemplateContent] = React16.useState("");
|
|
24991
|
+
const [isSavingTemplate, setIsSavingTemplate] = React16.useState(false);
|
|
24992
|
+
const handleOpenTemplates = React16.useCallback(() => {
|
|
24203
24993
|
setShowTemplateSelector(true);
|
|
24204
24994
|
}, []);
|
|
24205
|
-
const handleSelectTemplate =
|
|
24995
|
+
const handleSelectTemplate = React16.useCallback((template) => {
|
|
24206
24996
|
setShowTemplateSelector(false);
|
|
24207
24997
|
if (template.variables && template.variables.length > 0) {
|
|
24208
24998
|
setSelectedTemplate(template);
|
|
@@ -24210,15 +25000,15 @@ function useTemplateManager({
|
|
|
24210
25000
|
setInput?.(template.content);
|
|
24211
25001
|
}
|
|
24212
25002
|
}, [setInput]);
|
|
24213
|
-
const handleTemplateSend =
|
|
25003
|
+
const handleTemplateSend = React16.useCallback((content) => {
|
|
24214
25004
|
setSelectedTemplate(null);
|
|
24215
25005
|
onTemplateSend?.(content);
|
|
24216
25006
|
}, [onTemplateSend]);
|
|
24217
|
-
const handleSaveAsTemplate =
|
|
25007
|
+
const handleSaveAsTemplate = React16.useCallback((content) => {
|
|
24218
25008
|
setSaveTemplateContent(content);
|
|
24219
25009
|
setShowSaveTemplate(true);
|
|
24220
25010
|
}, []);
|
|
24221
|
-
const handleSaveTemplate =
|
|
25011
|
+
const handleSaveTemplate = React16.useCallback(async (templateData) => {
|
|
24222
25012
|
setIsSavingTemplate(true);
|
|
24223
25013
|
try {
|
|
24224
25014
|
await templateService.create(templateData);
|
|
@@ -24231,7 +25021,7 @@ function useTemplateManager({
|
|
|
24231
25021
|
setIsSavingTemplate(false);
|
|
24232
25022
|
}
|
|
24233
25023
|
}, []);
|
|
24234
|
-
const handleCancelSaveTemplate =
|
|
25024
|
+
const handleCancelSaveTemplate = React16.useCallback(() => {
|
|
24235
25025
|
setShowSaveTemplate(false);
|
|
24236
25026
|
setSaveTemplateContent("");
|
|
24237
25027
|
}, []);
|
|
@@ -24251,13 +25041,13 @@ function useTemplateManager({
|
|
|
24251
25041
|
};
|
|
24252
25042
|
}
|
|
24253
25043
|
function usePlanMode() {
|
|
24254
|
-
const [planProcessing, setPlanProcessing] =
|
|
25044
|
+
const [planProcessing, setPlanProcessing] = React16.useState(false);
|
|
24255
25045
|
const currentPlan = useAgentStore((state) => state.chatUI.currentPlan);
|
|
24256
25046
|
const waitingStepId = useAgentStore((state) => state.chatUI.waitingStepId);
|
|
24257
25047
|
const setShowPlanConfirmDialog = useAgentStore((state) => state.setShowPlanConfirmDialog);
|
|
24258
25048
|
const setShowHumanInputDialog = useAgentStore((state) => state.setShowHumanInputDialog);
|
|
24259
25049
|
const clearPlanState = useAgentStore((state) => state.clearPlanState);
|
|
24260
|
-
const handlePlanConfirm =
|
|
25050
|
+
const handlePlanConfirm = React16.useCallback(async () => {
|
|
24261
25051
|
if (!currentPlan?.publicId) return;
|
|
24262
25052
|
setPlanProcessing(true);
|
|
24263
25053
|
try {
|
|
@@ -24270,7 +25060,7 @@ function usePlanMode() {
|
|
|
24270
25060
|
setPlanProcessing(false);
|
|
24271
25061
|
}
|
|
24272
25062
|
}, [currentPlan, setShowPlanConfirmDialog]);
|
|
24273
|
-
const handlePlanReject =
|
|
25063
|
+
const handlePlanReject = React16.useCallback(async () => {
|
|
24274
25064
|
if (!currentPlan?.publicId) return;
|
|
24275
25065
|
setPlanProcessing(true);
|
|
24276
25066
|
try {
|
|
@@ -24284,7 +25074,7 @@ function usePlanMode() {
|
|
|
24284
25074
|
setPlanProcessing(false);
|
|
24285
25075
|
}
|
|
24286
25076
|
}, [currentPlan, clearPlanState]);
|
|
24287
|
-
const handlePlanPause =
|
|
25077
|
+
const handlePlanPause = React16.useCallback(async () => {
|
|
24288
25078
|
if (!currentPlan?.publicId) return;
|
|
24289
25079
|
try {
|
|
24290
25080
|
await planService.pause(currentPlan.publicId);
|
|
@@ -24293,7 +25083,7 @@ function usePlanMode() {
|
|
|
24293
25083
|
toast.error("\u6682\u505C\u8BA1\u5212\u5931\u8D25");
|
|
24294
25084
|
}
|
|
24295
25085
|
}, [currentPlan]);
|
|
24296
|
-
const handlePlanResume =
|
|
25086
|
+
const handlePlanResume = React16.useCallback(async () => {
|
|
24297
25087
|
if (!currentPlan?.publicId) return;
|
|
24298
25088
|
try {
|
|
24299
25089
|
await planService.resume(currentPlan.publicId);
|
|
@@ -24302,7 +25092,7 @@ function usePlanMode() {
|
|
|
24302
25092
|
toast.error("\u6062\u590D\u8BA1\u5212\u5931\u8D25");
|
|
24303
25093
|
}
|
|
24304
25094
|
}, [currentPlan]);
|
|
24305
|
-
const handlePlanCancel =
|
|
25095
|
+
const handlePlanCancel = React16.useCallback(async () => {
|
|
24306
25096
|
if (!currentPlan?.publicId) return;
|
|
24307
25097
|
try {
|
|
24308
25098
|
await planService.cancel(currentPlan.publicId);
|
|
@@ -24312,7 +25102,7 @@ function usePlanMode() {
|
|
|
24312
25102
|
toast.error("\u53D6\u6D88\u8BA1\u5212\u5931\u8D25");
|
|
24313
25103
|
}
|
|
24314
25104
|
}, [currentPlan, clearPlanState]);
|
|
24315
|
-
const handlePlanRetry =
|
|
25105
|
+
const handlePlanRetry = React16.useCallback(async () => {
|
|
24316
25106
|
if (!currentPlan?.publicId) return;
|
|
24317
25107
|
setPlanProcessing(true);
|
|
24318
25108
|
try {
|
|
@@ -24325,7 +25115,7 @@ function usePlanMode() {
|
|
|
24325
25115
|
setPlanProcessing(false);
|
|
24326
25116
|
}
|
|
24327
25117
|
}, [currentPlan]);
|
|
24328
|
-
const handlePlanSkip =
|
|
25118
|
+
const handlePlanSkip = React16.useCallback(async () => {
|
|
24329
25119
|
if (!currentPlan?.publicId) return;
|
|
24330
25120
|
setPlanProcessing(true);
|
|
24331
25121
|
try {
|
|
@@ -24338,7 +25128,7 @@ function usePlanMode() {
|
|
|
24338
25128
|
setPlanProcessing(false);
|
|
24339
25129
|
}
|
|
24340
25130
|
}, [currentPlan]);
|
|
24341
|
-
const handleHumanInput =
|
|
25131
|
+
const handleHumanInput = React16.useCallback(async (stepId, input) => {
|
|
24342
25132
|
if (!stepId || !currentPlan?.publicId) return;
|
|
24343
25133
|
try {
|
|
24344
25134
|
await planService.provideHumanInput(currentPlan.publicId, stepId, { input });
|
|
@@ -24362,7 +25152,7 @@ function usePlanMode() {
|
|
|
24362
25152
|
handleHumanInput
|
|
24363
25153
|
};
|
|
24364
25154
|
}
|
|
24365
|
-
var AgentChat =
|
|
25155
|
+
var AgentChat = React16__namespace.default.forwardRef(({
|
|
24366
25156
|
agentId,
|
|
24367
25157
|
projectId,
|
|
24368
25158
|
agentName,
|
|
@@ -24390,7 +25180,7 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24390
25180
|
const showSidebar = !embedded && !hideSidebar;
|
|
24391
25181
|
const showHeader = !embedded && !hideHeader;
|
|
24392
25182
|
const outerComponents = useComponents();
|
|
24393
|
-
const mergedComponents =
|
|
25183
|
+
const mergedComponents = React16__namespace.default.useMemo(() => {
|
|
24394
25184
|
const configComponents = config?.components || {};
|
|
24395
25185
|
const mergedRegistry = {
|
|
24396
25186
|
InformationSupplement,
|
|
@@ -24410,15 +25200,16 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24410
25200
|
setSkills,
|
|
24411
25201
|
setShowItemTime,
|
|
24412
25202
|
setSubAgentConfigs,
|
|
25203
|
+
setMainAgentPublicId,
|
|
24413
25204
|
setMainAgentName,
|
|
24414
25205
|
setMainAgentIcon,
|
|
24415
25206
|
setSubAgents
|
|
24416
25207
|
} = useAgentStore();
|
|
24417
|
-
const [mobileOpen, setMobileOpen] =
|
|
24418
|
-
const [collapsed, setCollapsed] =
|
|
24419
|
-
const [shareModalOpen, setShareModalOpen] =
|
|
24420
|
-
const [shareSession, setShareSession] =
|
|
24421
|
-
const [selectedTemplate, setSelectedTemplate] =
|
|
25208
|
+
const [mobileOpen, setMobileOpen] = React16.useState(false);
|
|
25209
|
+
const [collapsed, setCollapsed] = React16.useState(false);
|
|
25210
|
+
const [shareModalOpen, setShareModalOpen] = React16.useState(false);
|
|
25211
|
+
const [shareSession, setShareSession] = React16.useState(null);
|
|
25212
|
+
const [selectedTemplate, setSelectedTemplate] = React16.useState(null);
|
|
24422
25213
|
const {
|
|
24423
25214
|
artifactList,
|
|
24424
25215
|
activeArtifact,
|
|
@@ -24435,8 +25226,8 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24435
25226
|
reorderArtifacts,
|
|
24436
25227
|
updateArtifactContent
|
|
24437
25228
|
} = useArtifactPanel({ currentSessionId: useAgentStore((state) => state.currentSession?.sessionId) });
|
|
24438
|
-
const reconnectRef =
|
|
24439
|
-
const reconnectWrapper =
|
|
25229
|
+
const reconnectRef = React16.useRef(null);
|
|
25230
|
+
const reconnectWrapper = React16.useCallback(async (messageId) => {
|
|
24440
25231
|
if (reconnectRef.current) {
|
|
24441
25232
|
await reconnectRef.current(messageId);
|
|
24442
25233
|
}
|
|
@@ -24482,14 +25273,14 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24482
25273
|
}
|
|
24483
25274
|
}
|
|
24484
25275
|
});
|
|
24485
|
-
|
|
25276
|
+
React16.useEffect(() => {
|
|
24486
25277
|
reconnectRef.current = reconnect;
|
|
24487
25278
|
}, [reconnect]);
|
|
24488
25279
|
const isStreaming = useAgentStore((state) => state.chatUI.isStreaming);
|
|
24489
25280
|
const streamingSessionId = useAgentStore((state) => state.chatUI.streamingSessionId);
|
|
24490
25281
|
const isCurrentSessionStreaming = isStreaming && streamingSessionId === currentSession?.sessionId;
|
|
24491
25282
|
const messages = useAgentStore((state) => state.messages);
|
|
24492
|
-
const hasWaitingToolConfirmation =
|
|
25283
|
+
const hasWaitingToolConfirmation = React16.useMemo(() => {
|
|
24493
25284
|
if (!currentSession?.sessionId) return false;
|
|
24494
25285
|
return messages.some((m) => {
|
|
24495
25286
|
if (m.sessionId !== currentSession.sessionId) return false;
|
|
@@ -24545,10 +25336,10 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24545
25336
|
handlePlanSkip,
|
|
24546
25337
|
handleHumanInput
|
|
24547
25338
|
} = usePlanMode();
|
|
24548
|
-
|
|
25339
|
+
React16.useEffect(() => {
|
|
24549
25340
|
setShowItemTime(showItemTime);
|
|
24550
25341
|
}, [showItemTime]);
|
|
24551
|
-
|
|
25342
|
+
React16.useEffect(() => {
|
|
24552
25343
|
agentToolService.list(agentId).then((res) => {
|
|
24553
25344
|
res?.data?.length && setTools(res.data);
|
|
24554
25345
|
});
|
|
@@ -24558,6 +25349,7 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24558
25349
|
agentService.get(agentId).then((res) => {
|
|
24559
25350
|
if (res.success && res.data) {
|
|
24560
25351
|
const agentData = res.data;
|
|
25352
|
+
if (agentData.publicId) setMainAgentPublicId(agentData.publicId);
|
|
24561
25353
|
if (agentData.name) setMainAgentName(agentData.name);
|
|
24562
25354
|
if (agentData.icon) setMainAgentIcon(agentData.icon);
|
|
24563
25355
|
const subConfigs = agentData.multiAgentConfig?.subAgentConfigs;
|
|
@@ -24572,7 +25364,7 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24572
25364
|
}
|
|
24573
25365
|
});
|
|
24574
25366
|
}, [agentId]);
|
|
24575
|
-
|
|
25367
|
+
React16.useEffect(() => {
|
|
24576
25368
|
if (initialSessionId && sessions.length > 0) {
|
|
24577
25369
|
const session = sessions.find((s) => s.sessionId === initialSessionId);
|
|
24578
25370
|
if (session) {
|
|
@@ -24580,7 +25372,7 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24580
25372
|
}
|
|
24581
25373
|
}
|
|
24582
25374
|
}, [initialSessionId, sessions]);
|
|
24583
|
-
const handleDeleteMessage =
|
|
25375
|
+
const handleDeleteMessage = React16.useCallback(async (messageId) => {
|
|
24584
25376
|
try {
|
|
24585
25377
|
const { messages: messages2, updateMessage } = useAgentStore.getState();
|
|
24586
25378
|
const target = messages2.find((m) => m.messageId === messageId);
|
|
@@ -24604,7 +25396,7 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24604
25396
|
return false;
|
|
24605
25397
|
}
|
|
24606
25398
|
}, []);
|
|
24607
|
-
const handleAbortMessage =
|
|
25399
|
+
const handleAbortMessage = React16.useCallback(async (messageId) => {
|
|
24608
25400
|
const { messages: messages2, updateMessage, clearPendingToolCalls, clearPendingFrontendToolCalls, clearPendingComponents } = useAgentStore.getState();
|
|
24609
25401
|
const target = messages2.find((m) => m.messageId === messageId);
|
|
24610
25402
|
const activeStreaming = messages2.find((m) => m.status === "streaming");
|
|
@@ -24642,7 +25434,7 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24642
25434
|
}
|
|
24643
25435
|
}
|
|
24644
25436
|
}, [abort, messageService]);
|
|
24645
|
-
const handleStop =
|
|
25437
|
+
const handleStop = React16.useCallback(() => {
|
|
24646
25438
|
const storeState = useAgentStore.getState();
|
|
24647
25439
|
const streamingMsg = storeState.messages.find((m) => m.status === "streaming");
|
|
24648
25440
|
if (streamingMsg) {
|
|
@@ -24659,7 +25451,7 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24659
25451
|
}
|
|
24660
25452
|
abort();
|
|
24661
25453
|
}, [handleAbortMessage, abort]);
|
|
24662
|
-
|
|
25454
|
+
React16.useImperativeHandle(ref, () => ({
|
|
24663
25455
|
sendTextMessage,
|
|
24664
25456
|
abortStreaming: async () => abort()
|
|
24665
25457
|
}), [sendTextMessage, abort]);
|
|
@@ -24739,7 +25531,7 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24739
25531
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
24740
25532
|
"div",
|
|
24741
25533
|
{
|
|
24742
|
-
className:
|
|
25534
|
+
className: cn3(
|
|
24743
25535
|
"flex flex-col min-h-0 overflow-hidden",
|
|
24744
25536
|
!isDragging && "transition-[width,opacity,transform] duration-300 ease-out",
|
|
24745
25537
|
isArtifactFullscreen ? "w-0 min-w-0 opacity-0 -translate-x-4" : currentArtifact ? "min-w-[350px]" : "w-full"
|
|
@@ -24830,7 +25622,7 @@ var AgentChat = React24__namespace.default.forwardRef(({
|
|
|
24830
25622
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
24831
25623
|
"div",
|
|
24832
25624
|
{
|
|
24833
|
-
className:
|
|
25625
|
+
className: cn3(
|
|
24834
25626
|
"flex-shrink-0 overflow-hidden h-full relative",
|
|
24835
25627
|
!isDragging && "transition-[width,opacity] duration-300 ease-out",
|
|
24836
25628
|
currentArtifact ? isArtifactFullscreen ? "w-full min-w-0 border-l-0" : "min-w-[400px]" : "w-0 min-w-0 opacity-0"
|
|
@@ -24970,26 +25762,26 @@ var SPEED_OPTIONS = [
|
|
|
24970
25762
|
{ value: 20, label: "20x" }
|
|
24971
25763
|
];
|
|
24972
25764
|
function ShareReplayPage({ shareId, onNavigateBack }) {
|
|
24973
|
-
const [pageState, setPageState] =
|
|
24974
|
-
const [error, setError] =
|
|
24975
|
-
const [password, setPassword] =
|
|
24976
|
-
const [verifying, setVerifying] =
|
|
24977
|
-
const [shareToken, setShareToken] =
|
|
24978
|
-
const [sharedData, setSharedData] =
|
|
24979
|
-
const [allMessages, setAllMessages] =
|
|
24980
|
-
const [playState, setPlayState] =
|
|
24981
|
-
const [currentIndex, setCurrentIndex] =
|
|
24982
|
-
const [displayedMessages, setDisplayedMessages] =
|
|
24983
|
-
const [speed, setSpeed] =
|
|
24984
|
-
const [isTyping, setIsTyping] =
|
|
24985
|
-
const [typingContent, setTypingContent] =
|
|
24986
|
-
const timerRef =
|
|
24987
|
-
const messagesEndRef =
|
|
24988
|
-
const playStateRef =
|
|
24989
|
-
const currentIndexRef =
|
|
24990
|
-
const isTypingRef =
|
|
24991
|
-
const typingStartTimeRef =
|
|
24992
|
-
const typingMessage =
|
|
25765
|
+
const [pageState, setPageState] = React16.useState("loading");
|
|
25766
|
+
const [error, setError] = React16.useState(null);
|
|
25767
|
+
const [password, setPassword] = React16.useState("");
|
|
25768
|
+
const [verifying, setVerifying] = React16.useState(false);
|
|
25769
|
+
const [shareToken, setShareToken] = React16.useState(null);
|
|
25770
|
+
const [sharedData, setSharedData] = React16.useState(null);
|
|
25771
|
+
const [allMessages, setAllMessages] = React16.useState([]);
|
|
25772
|
+
const [playState, setPlayState] = React16.useState("idle");
|
|
25773
|
+
const [currentIndex, setCurrentIndex] = React16.useState(0);
|
|
25774
|
+
const [displayedMessages, setDisplayedMessages] = React16.useState([]);
|
|
25775
|
+
const [speed, setSpeed] = React16.useState(2);
|
|
25776
|
+
const [isTyping, setIsTyping] = React16.useState(false);
|
|
25777
|
+
const [typingContent, setTypingContent] = React16.useState("");
|
|
25778
|
+
const timerRef = React16.useRef(null);
|
|
25779
|
+
const messagesEndRef = React16.useRef(null);
|
|
25780
|
+
const playStateRef = React16.useRef("idle");
|
|
25781
|
+
const currentIndexRef = React16.useRef(0);
|
|
25782
|
+
const isTypingRef = React16.useRef(false);
|
|
25783
|
+
const typingStartTimeRef = React16.useRef("");
|
|
25784
|
+
const typingMessage = React16.useMemo(() => {
|
|
24993
25785
|
const sessionIdValue = sharedData?.session?.sessionId || shareId;
|
|
24994
25786
|
if (!sessionIdValue) return null;
|
|
24995
25787
|
return {
|
|
@@ -25002,7 +25794,7 @@ function ShareReplayPage({ shareId, onNavigateBack }) {
|
|
|
25002
25794
|
};
|
|
25003
25795
|
}, [sharedData?.session?.sessionId, shareId]);
|
|
25004
25796
|
const getTokenStorageKey = (id) => `share_token_${id}`;
|
|
25005
|
-
|
|
25797
|
+
React16.useEffect(() => {
|
|
25006
25798
|
async function checkShare() {
|
|
25007
25799
|
if (!shareId) {
|
|
25008
25800
|
setError("\u5206\u4EAB ID \u65E0\u6548");
|
|
@@ -25069,29 +25861,29 @@ function ShareReplayPage({ shareId, onNavigateBack }) {
|
|
|
25069
25861
|
setVerifying(false);
|
|
25070
25862
|
}
|
|
25071
25863
|
};
|
|
25072
|
-
const scrollToBottom =
|
|
25864
|
+
const scrollToBottom = React16.useCallback(() => {
|
|
25073
25865
|
messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
|
|
25074
25866
|
}, []);
|
|
25075
|
-
|
|
25867
|
+
React16.useEffect(() => {
|
|
25076
25868
|
scrollToBottom();
|
|
25077
25869
|
}, [displayedMessages, typingContent, scrollToBottom]);
|
|
25078
|
-
|
|
25870
|
+
React16.useEffect(() => {
|
|
25079
25871
|
return () => {
|
|
25080
25872
|
if (timerRef.current) {
|
|
25081
25873
|
clearTimeout(timerRef.current);
|
|
25082
25874
|
}
|
|
25083
25875
|
};
|
|
25084
25876
|
}, []);
|
|
25085
|
-
|
|
25877
|
+
React16.useEffect(() => {
|
|
25086
25878
|
playStateRef.current = playState;
|
|
25087
25879
|
}, [playState]);
|
|
25088
|
-
|
|
25880
|
+
React16.useEffect(() => {
|
|
25089
25881
|
currentIndexRef.current = currentIndex;
|
|
25090
25882
|
}, [currentIndex]);
|
|
25091
|
-
|
|
25883
|
+
React16.useEffect(() => {
|
|
25092
25884
|
isTypingRef.current = isTyping;
|
|
25093
25885
|
}, [isTyping]);
|
|
25094
|
-
const scheduleNext =
|
|
25886
|
+
const scheduleNext = React16.useCallback(() => {
|
|
25095
25887
|
if (playStateRef.current !== "playing") return;
|
|
25096
25888
|
const idx = currentIndexRef.current;
|
|
25097
25889
|
if (idx >= allMessages.length) {
|
|
@@ -25141,7 +25933,7 @@ function ShareReplayPage({ shareId, onNavigateBack }) {
|
|
|
25141
25933
|
};
|
|
25142
25934
|
typeChar();
|
|
25143
25935
|
}, [allMessages, speed]);
|
|
25144
|
-
const handlePlay =
|
|
25936
|
+
const handlePlay = React16.useCallback(() => {
|
|
25145
25937
|
if (timerRef.current) {
|
|
25146
25938
|
clearTimeout(timerRef.current);
|
|
25147
25939
|
}
|
|
@@ -25171,14 +25963,14 @@ function ShareReplayPage({ shareId, onNavigateBack }) {
|
|
|
25171
25963
|
scheduleNext();
|
|
25172
25964
|
}, 100);
|
|
25173
25965
|
}, [playState, allMessages, scheduleNext]);
|
|
25174
|
-
const handlePause =
|
|
25966
|
+
const handlePause = React16.useCallback(() => {
|
|
25175
25967
|
if (timerRef.current) {
|
|
25176
25968
|
clearTimeout(timerRef.current);
|
|
25177
25969
|
}
|
|
25178
25970
|
setPlayState("paused");
|
|
25179
25971
|
playStateRef.current = "paused";
|
|
25180
25972
|
}, []);
|
|
25181
|
-
const handleReset =
|
|
25973
|
+
const handleReset = React16.useCallback(() => {
|
|
25182
25974
|
if (timerRef.current) {
|
|
25183
25975
|
clearTimeout(timerRef.current);
|
|
25184
25976
|
}
|
|
@@ -25191,7 +25983,7 @@ function ShareReplayPage({ shareId, onNavigateBack }) {
|
|
|
25191
25983
|
isTypingRef.current = false;
|
|
25192
25984
|
setTypingContent("");
|
|
25193
25985
|
}, []);
|
|
25194
|
-
const handleSkip =
|
|
25986
|
+
const handleSkip = React16.useCallback(() => {
|
|
25195
25987
|
if (timerRef.current) {
|
|
25196
25988
|
clearTimeout(timerRef.current);
|
|
25197
25989
|
}
|
|
@@ -25209,12 +26001,12 @@ function ShareReplayPage({ shareId, onNavigateBack }) {
|
|
|
25209
26001
|
}
|
|
25210
26002
|
}
|
|
25211
26003
|
}, [allMessages, scheduleNext]);
|
|
25212
|
-
const handleShare =
|
|
26004
|
+
const handleShare = React16.useCallback(() => {
|
|
25213
26005
|
const url = window.location.href;
|
|
25214
26006
|
navigator.clipboard.writeText(url);
|
|
25215
26007
|
toast.success("\u94FE\u63A5\u5DF2\u590D\u5236\u5230\u526A\u8D34\u677F");
|
|
25216
26008
|
}, []);
|
|
25217
|
-
const handleShowAll =
|
|
26009
|
+
const handleShowAll = React16.useCallback(() => {
|
|
25218
26010
|
if (timerRef.current) {
|
|
25219
26011
|
clearTimeout(timerRef.current);
|
|
25220
26012
|
}
|
|
@@ -25402,8 +26194,36 @@ function ShareReplayPage({ shareId, onNavigateBack }) {
|
|
|
25402
26194
|
] }) })
|
|
25403
26195
|
] });
|
|
25404
26196
|
}
|
|
26197
|
+
var AgentSDKProvider = ({
|
|
26198
|
+
children,
|
|
26199
|
+
toasterOptions,
|
|
26200
|
+
components
|
|
26201
|
+
}) => {
|
|
26202
|
+
const defaultToastOptions = {
|
|
26203
|
+
position: "top-center",
|
|
26204
|
+
toastOptions: {
|
|
26205
|
+
style: {
|
|
26206
|
+
background: "#27272a",
|
|
26207
|
+
border: "1px solid #3f3f46",
|
|
26208
|
+
color: "#fff"
|
|
26209
|
+
}
|
|
26210
|
+
}
|
|
26211
|
+
};
|
|
26212
|
+
const mergedOptions = toasterOptions ? { ...defaultToastOptions, ...toasterOptions } : defaultToastOptions;
|
|
26213
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(ComponentProvider, { components, children: [
|
|
26214
|
+
children,
|
|
26215
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
26216
|
+
Toaster,
|
|
26217
|
+
{
|
|
26218
|
+
position: mergedOptions.position,
|
|
26219
|
+
toastOptions: mergedOptions.toastOptions
|
|
26220
|
+
}
|
|
26221
|
+
)
|
|
26222
|
+
] });
|
|
26223
|
+
};
|
|
25405
26224
|
|
|
25406
26225
|
exports.AgentChat = AgentChat_default;
|
|
26226
|
+
exports.AgentSDKProvider = AgentSDKProvider;
|
|
25407
26227
|
exports.ChatWindow = ChatWindow_default;
|
|
25408
26228
|
exports.ComponentProvider = ComponentProvider;
|
|
25409
26229
|
exports.HumanInputDialog = HumanInputDialog_default;
|