@copilotkit/react-ui 1.56.0 → 1.56.2-canary.pin-to-send

package/dist/index.umd.js

@@ -789,10 +789,11 @@ rehype_raw = __toESM(rehype_raw);
 			});
 		};
 		(0, react.useEffect)(() => {
+			if (!showDevConsole) return;
 			if (dontRunTwiceInDevMode.current === true) return;
 			dontRunTwiceInDevMode.current = true;
 			checkForUpdates();
-		}, []);
+		}, [showDevConsole]);
 		if (!showDevConsole) return null;
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			ref: consoleRef,
@@ -1394,17 +1395,25 @@ rehype_raw = __toESM(rehype_raw);
 			children
 		})
 	};
-	const MemoizedReactMarkdown = (0, react.memo)(react_markdown.default, (prevProps, nextProps) => prevProps.children === nextProps.children && prevProps.components === nextProps.components);
-	const Markdown = ({ content, components }) => {
+	const MemoizedReactMarkdown = (0, react.memo)(react_markdown.default);
+	const Markdown = ({ content, components, remarkPlugins, rehypePlugins, ...rest }) => {
+		const mergedComponents = (0, react.useMemo)(() => ({
+			...defaultComponents,
+			...components
+		}), [components]);
+		const mergedRemarkPlugins = (0, react.useMemo)(() => [
+			remark_gfm.default,
+			[remark_math.default, { singleDollarTextMath: false }],
+			...remarkPlugins !== null && remarkPlugins !== void 0 ? remarkPlugins : []
+		], [remarkPlugins]);
+		const mergedRehypePlugins = (0, react.useMemo)(() => [rehype_raw.default, ...rehypePlugins !== null && rehypePlugins !== void 0 ? rehypePlugins : []], [rehypePlugins]);
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			className: "copilotKitMarkdown",
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MemoizedReactMarkdown, {
-				components: (0, react.useMemo)(() => ({
-					...defaultComponents,
-					...components
-				}), [components]),
-				remarkPlugins: [remark_gfm.default, [remark_math.default, { singleDollarTextMath: false }]],
-				rehypePlugins: [rehype_raw.default],
+				...rest,
+				components: mergedComponents,
+				remarkPlugins: mergedRemarkPlugins,
+				rehypePlugins: mergedRehypePlugins,
 				children: content
 			})
 		});
@@ -1653,7 +1662,7 @@ rehype_raw = __toESM(rehype_raw);
 //#endregion
 //#region src/components/chat/Messages.tsx
 	const Messages = ({ inProgress, children, RenderMessage, AssistantMessage, UserMessage, ErrorMessage, ImageRenderer, onRegenerate, onCopy, onThumbsUp, onThumbsDown, messageFeedback, markdownTagRenderers, chatError, RenderTextMessage, RenderActionExecutionMessage, RenderAgentStateMessage, RenderResultMessage, RenderImageMessage }) => {
-		var _messages;
+		var _messages, _messages2;
 		const { labels, icons } = useChatContext();
 		const { messages: visibleMessages, interrupt } = (0, _copilotkit_react_core.useCopilotChatInternal)();
 		const messages = [...(0, react.useMemo)(() => makeInitialMessages(labels.initial), [labels.initial]), ...visibleMessages];
@@ -1704,7 +1713,7 @@ rehype_raw = __toESM(rehype_raw);
 							markdownTagRenderers
 						}, index);
 					}),
-					((_messages = messages[messages.length - 1]) === null || _messages === void 0 ? void 0 : _messages.role) === "user" && inProgress && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoadingIcon, {}),
+					inProgress && (((_messages = messages[messages.length - 1]) === null || _messages === void 0 ? void 0 : _messages.role) === "user" || ((_messages2 = messages[messages.length - 1]) === null || _messages2 === void 0 ? void 0 : _messages2.role) === "tool") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoadingIcon, {}),
 					interrupt,
 					chatError && ErrorMessage && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ErrorMessage, {
 						error: chatError,
@@ -1843,13 +1852,18 @@ rehype_raw = __toESM(rehype_raw);
 		};
 		mediaRecorderRef.current.onstop = onStop;
 	};
-	const stopRecording = (mediaRecorderRef) => {
+	const stopRecording = (mediaRecorderRef, mediaStreamRef) => {
 		if (mediaRecorderRef.current && mediaRecorderRef.current.state !== "inactive") mediaRecorderRef.current.stop();
+		if (mediaStreamRef === null || mediaStreamRef === void 0 ? void 0 : mediaStreamRef.current) {
+			mediaStreamRef.current.getTracks().forEach((track) => track.stop());
+			mediaStreamRef.current = null;
+		}
 	};
-	const transcribeAudio = async (recordedChunks, transcribeAudioUrl) => {
-		const completeBlob = new Blob(recordedChunks, { type: "audio/mp4" });
+	const transcribeAudio = async (recordedChunks, transcribeAudioUrl, mediaType = "audio/mp4") => {
+		const extension = mediaType.split("/")[1] || "mp4";
+		const completeBlob = new Blob(recordedChunks, { type: mediaType });
 		const formData = new FormData();
-		formData.append("file", completeBlob, "recording.mp4");
+		formData.append("file", completeBlob, `recording.${extension}`);
 		const response = await fetch(transcribeAudioUrl, {
 			method: "POST",
 			body: formData
@@ -1868,7 +1882,7 @@ rehype_raw = __toESM(rehype_raw);
 			console.error("Error with decoding audio data", error);
 		});
 	};
-	const usePushToTalk = ({ sendFunction, inProgress }) => {
+	const usePushToTalk = ({ sendFunction, inProgress, mediaType = "audio/mp4" }) => {
 		const [pushToTalkState, setPushToTalkState] = (0, react.useState)("idle");
 		const mediaStreamRef = (0, react.useRef)(null);
 		const audioContextRef = (0, react.useRef)(null);
@@ -1886,15 +1900,16 @@ rehype_raw = __toESM(rehype_raw);
 				setPushToTalkState("transcribing");
 			});
 			else {
-				stopRecording(mediaRecorderRef);
-				if (pushToTalkState === "transcribing") transcribeAudio(recordedChunks.current, context.copilotApiConfig.transcribeAudioUrl).then(async (transcription) => {
+				stopRecording(mediaRecorderRef, mediaStreamRef);
+				if (pushToTalkState === "transcribing") transcribeAudio(recordedChunks.current, context.copilotApiConfig.transcribeAudioUrl, mediaType).then(async (transcription) => {
 					recordedChunks.current = [];
 					setPushToTalkState("idle");
-					setStartReadingFromMessageId((await sendFunction(transcription)).id);
+					const message = await sendFunction(transcription);
+					if (message) setStartReadingFromMessageId(message.id);
 				});
 			}
 			return () => {
-				stopRecording(mediaRecorderRef);
+				stopRecording(mediaRecorderRef, mediaStreamRef);
 			};
 		}, [pushToTalkState]);
 		(0, react.useEffect)(() => {
@@ -2990,6 +3005,7 @@ rehype_raw = __toESM(rehype_raw);
 exports.AssistantMessage = AssistantMessage;
 exports.CopilotChat = CopilotChat;
 exports.CopilotDevConsole = CopilotDevConsole;
+exports.CopilotModal = CopilotModal;
 exports.CopilotPopup = CopilotPopup;
 exports.CopilotSidebar = CopilotSidebar;
 exports.ImageRenderer = ImageRenderer;