@copilotkit/react-ui 1.3.7-fix-chat-interactions-rerenders.0 → 1.3.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/CHANGELOG.md +5 -5
- package/dist/{chunk-CTPEKUNX.mjs → chunk-4FIGRRFS.mjs} +5 -7
- package/dist/chunk-4FIGRRFS.mjs.map +1 -0
- package/dist/{chunk-FUCEBN2P.mjs → chunk-6VYMULPK.mjs} +4 -4
- package/dist/{chunk-LGS6B47Q.mjs → chunk-7YQICPBC.mjs} +8 -8
- package/dist/{chunk-RF3KLUPD.mjs → chunk-AAY3WWWC.mjs} +2 -3
- package/dist/chunk-AAY3WWWC.mjs.map +1 -0
- package/dist/{chunk-HBZPOT37.mjs → chunk-BNCTYKEP.mjs} +2 -2
- package/dist/{chunk-GOTHQ665.mjs → chunk-DP5YVGNX.mjs} +2 -3
- package/dist/chunk-DP5YVGNX.mjs.map +1 -0
- package/dist/{chunk-PJNNEX4L.mjs → chunk-JQOSF44H.mjs} +2 -2
- package/dist/{chunk-QI3OM75G.mjs → chunk-RS6UPR5N.mjs} +2 -2
- package/dist/{chunk-YH2STM73.mjs → chunk-RWT7WRG2.mjs} +3 -3
- package/dist/chunk-RWT7WRG2.mjs.map +1 -0
- package/dist/{chunk-5DT3MDBZ.mjs → chunk-S5MBUNGN.mjs} +2 -3
- package/dist/{chunk-5DT3MDBZ.mjs.map → chunk-S5MBUNGN.mjs.map} +1 -1
- package/dist/{chunk-GDNJRSD4.mjs → chunk-SHTMRY45.mjs} +8 -10
- package/dist/chunk-SHTMRY45.mjs.map +1 -0
- package/dist/{chunk-CPWFYV3U.mjs → chunk-TYYJR3LE.mjs} +2 -2
- package/dist/{chunk-MA5B5ELM.mjs → chunk-WHSD7DBC.mjs} +2 -3
- package/dist/chunk-WHSD7DBC.mjs.map +1 -0
- package/dist/components/chat/Chat.js +22 -30
- package/dist/components/chat/Chat.js.map +1 -1
- package/dist/components/chat/Chat.mjs +10 -10
- package/dist/components/chat/Input.js +1 -2
- package/dist/components/chat/Input.js.map +1 -1
- package/dist/components/chat/Input.mjs +2 -2
- package/dist/components/chat/Messages.js +6 -6
- package/dist/components/chat/Messages.js.map +1 -1
- package/dist/components/chat/Messages.mjs +1 -1
- package/dist/components/chat/Modal.js +22 -30
- package/dist/components/chat/Modal.js.map +1 -1
- package/dist/components/chat/Modal.mjs +11 -11
- package/dist/components/chat/Popup.js +22 -30
- package/dist/components/chat/Popup.js.map +1 -1
- package/dist/components/chat/Popup.mjs +12 -12
- package/dist/components/chat/Sidebar.js +22 -30
- package/dist/components/chat/Sidebar.js.map +1 -1
- package/dist/components/chat/Sidebar.mjs +12 -12
- package/dist/components/chat/index.js +22 -30
- package/dist/components/chat/index.js.map +1 -1
- package/dist/components/chat/index.mjs +13 -13
- package/dist/components/chat/messages/RenderActionExecutionMessage.js +1 -1
- package/dist/components/chat/messages/RenderActionExecutionMessage.js.map +1 -1
- package/dist/components/chat/messages/RenderActionExecutionMessage.mjs +1 -1
- package/dist/components/chat/messages/RenderAgentStateMessage.js +1 -2
- package/dist/components/chat/messages/RenderAgentStateMessage.js.map +1 -1
- package/dist/components/chat/messages/RenderAgentStateMessage.mjs +1 -1
- package/dist/components/chat/messages/RenderResultMessage.js +1 -2
- package/dist/components/chat/messages/RenderResultMessage.js.map +1 -1
- package/dist/components/chat/messages/RenderResultMessage.mjs +1 -1
- package/dist/components/chat/messages/RenderTextMessage.js +1 -2
- package/dist/components/chat/messages/RenderTextMessage.js.map +1 -1
- package/dist/components/chat/messages/RenderTextMessage.mjs +1 -1
- package/dist/components/dev-console/console.js +4 -6
- package/dist/components/dev-console/console.js.map +1 -1
- package/dist/components/dev-console/console.mjs +2 -2
- package/dist/components/dev-console/index.js +4 -6
- package/dist/components/dev-console/index.js.map +1 -1
- package/dist/components/dev-console/index.mjs +2 -2
- package/dist/components/dev-console/utils.js +4 -6
- package/dist/components/dev-console/utils.js.map +1 -1
- package/dist/components/dev-console/utils.mjs +1 -1
- package/dist/components/index.js +22 -30
- package/dist/components/index.js.map +1 -1
- package/dist/components/index.mjs +13 -13
- package/dist/hooks/use-push-to-talk.js +1 -2
- package/dist/hooks/use-push-to-talk.js.map +1 -1
- package/dist/hooks/use-push-to-talk.mjs +1 -1
- package/dist/index.js +22 -30
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +13 -13
- package/package.json +8 -8
- package/src/components/chat/Messages.tsx +6 -6
- package/src/components/chat/messages/RenderActionExecutionMessage.tsx +1 -1
- package/src/components/chat/messages/RenderAgentStateMessage.tsx +1 -1
- package/src/components/chat/messages/RenderResultMessage.tsx +1 -1
- package/src/components/chat/messages/RenderTextMessage.tsx +1 -1
- package/src/components/dev-console/utils.ts +4 -4
- package/src/hooks/use-push-to-talk.tsx +1 -1
- package/dist/chunk-CTPEKUNX.mjs.map +0 -1
- package/dist/chunk-GDNJRSD4.mjs.map +0 -1
- package/dist/chunk-GOTHQ665.mjs.map +0 -1
- package/dist/chunk-MA5B5ELM.mjs.map +0 -1
- package/dist/chunk-RF3KLUPD.mjs.map +0 -1
- package/dist/chunk-YH2STM73.mjs.map +0 -1
- /package/dist/{chunk-FUCEBN2P.mjs.map → chunk-6VYMULPK.mjs.map} +0 -0
- /package/dist/{chunk-LGS6B47Q.mjs.map → chunk-7YQICPBC.mjs.map} +0 -0
- /package/dist/{chunk-HBZPOT37.mjs.map → chunk-BNCTYKEP.mjs.map} +0 -0
- /package/dist/{chunk-PJNNEX4L.mjs.map → chunk-JQOSF44H.mjs.map} +0 -0
- /package/dist/{chunk-QI3OM75G.mjs.map → chunk-RS6UPR5N.mjs.map} +0 -0
- /package/dist/{chunk-CPWFYV3U.mjs.map → chunk-TYYJR3LE.mjs.map} +0 -0
|
@@ -2,26 +2,26 @@ import {
|
|
|
2
2
|
CopilotChat,
|
|
3
3
|
WrappedCopilotChat,
|
|
4
4
|
useCopilotChatLogic
|
|
5
|
-
} from "../../chunk-
|
|
5
|
+
} from "../../chunk-7YQICPBC.mjs";
|
|
6
6
|
import "../../chunk-V7W6IM2V.mjs";
|
|
7
|
-
import "../../chunk-
|
|
8
|
-
import "../../chunk-
|
|
9
|
-
import "../../chunk-
|
|
10
|
-
import "../../chunk-
|
|
7
|
+
import "../../chunk-RWT7WRG2.mjs";
|
|
8
|
+
import "../../chunk-AAY3WWWC.mjs";
|
|
9
|
+
import "../../chunk-DP5YVGNX.mjs";
|
|
10
|
+
import "../../chunk-WHSD7DBC.mjs";
|
|
11
11
|
import "../../chunk-KFQYJ5R5.mjs";
|
|
12
|
-
import "../../chunk-
|
|
13
|
-
import "../../chunk-
|
|
12
|
+
import "../../chunk-RS6UPR5N.mjs";
|
|
13
|
+
import "../../chunk-4FIGRRFS.mjs";
|
|
14
14
|
import "../../chunk-OTPAZXVR.mjs";
|
|
15
|
-
import "../../chunk-
|
|
15
|
+
import "../../chunk-BNCTYKEP.mjs";
|
|
16
16
|
import "../../chunk-YQFVRDNC.mjs";
|
|
17
17
|
import "../../chunk-YQ3D5IQV.mjs";
|
|
18
|
-
import "../../chunk-
|
|
18
|
+
import "../../chunk-SHTMRY45.mjs";
|
|
19
19
|
import "../../chunk-XSUSSWDS.mjs";
|
|
20
20
|
import "../../chunk-BJPGMY3I.mjs";
|
|
21
21
|
import "../../chunk-UPTB2MVO.mjs";
|
|
22
22
|
import "../../chunk-FZC7X5PK.mjs";
|
|
23
23
|
import "../../chunk-54JAUBUJ.mjs";
|
|
24
|
-
import "../../chunk-
|
|
24
|
+
import "../../chunk-S5MBUNGN.mjs";
|
|
25
25
|
import "../../chunk-MRXNTQOX.mjs";
|
|
26
26
|
export {
|
|
27
27
|
CopilotChat,
|
|
@@ -134,7 +134,6 @@ var Textarea_default = AutoResizingTextarea;
|
|
|
134
134
|
|
|
135
135
|
// src/hooks/use-push-to-talk.tsx
|
|
136
136
|
var import_react_core = require("@copilotkit/react-core");
|
|
137
|
-
var import_runtime_client_gql = require("@copilotkit/runtime-client-gql");
|
|
138
137
|
var import_react3 = require("react");
|
|
139
138
|
var startRecording = (mediaStreamRef, mediaRecorderRef, audioContextRef, recordedChunks, onStop) => __async(void 0, null, function* () {
|
|
140
139
|
if (!mediaStreamRef.current || !audioContextRef.current) {
|
|
@@ -227,7 +226,7 @@ var usePushToTalk = ({
|
|
|
227
226
|
(message) => message.id === startReadingFromMessageId
|
|
228
227
|
);
|
|
229
228
|
const messagesAfterLast = context.messages.slice(lastMessageIndex + 1).filter(
|
|
230
|
-
(message) => message
|
|
229
|
+
(message) => message.isTextMessage() && message.role === "assistant"
|
|
231
230
|
);
|
|
232
231
|
const text = messagesAfterLast.map((message) => message.content).join("\n");
|
|
233
232
|
playAudioResponse(text, context.copilotApiConfig.textToSpeechUrl, audioContextRef.current);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/chat/Input.tsx","../../../src/components/chat/ChatContext.tsx","../../../src/components/chat/Textarea.tsx","../../../src/hooks/use-push-to-talk.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport { InputProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\nimport AutoResizingTextarea from \"./Textarea\";\nimport { usePushToTalk } from \"../../hooks/use-push-to-talk\";\nimport { useCopilotContext } from \"@copilotkit/react-core\";\n\nexport const Input = ({ inProgress, onSend, isVisible = false }: InputProps) => {\n const context = useChatContext();\n const copilotContext = useCopilotContext();\n\n const pushToTalkConfigured =\n copilotContext.copilotApiConfig.textToSpeechUrl !== undefined &&\n copilotContext.copilotApiConfig.transcribeAudioUrl !== undefined;\n\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n const handleDivClick = (event: React.MouseEvent<HTMLDivElement>) => {\n // Check if the clicked element is not the textarea itself\n if (event.target !== event.currentTarget) return;\n\n textareaRef.current?.focus();\n };\n\n const [text, setText] = useState(\"\");\n const send = () => {\n if (inProgress) return;\n onSend(text);\n setText(\"\");\n\n textareaRef.current?.focus();\n };\n\n useEffect(() => {\n if (isVisible) {\n textareaRef.current?.focus();\n }\n }, [isVisible]);\n\n const { pushToTalkState, setPushToTalkState } = usePushToTalk({\n sendFunction: onSend,\n inProgress,\n });\n\n const sendIcon =\n inProgress || pushToTalkState === \"transcribing\"\n ? context.icons.activityIcon\n : context.icons.sendIcon;\n const showPushToTalk =\n pushToTalkConfigured &&\n (pushToTalkState === \"idle\" || pushToTalkState === \"recording\") &&\n !inProgress;\n const sendDisabled = inProgress || text.length === 0 || pushToTalkState !== \"idle\";\n\n return (\n <div className=\"copilotKitInput\" onClick={handleDivClick}>\n <AutoResizingTextarea\n ref={textareaRef}\n placeholder={context.labels.placeholder}\n autoFocus={true}\n maxRows={5}\n value={text}\n onChange={(event) => setText(event.target.value)}\n onKeyDown={(event) => {\n if (event.key === \"Enter\" && !event.shiftKey) {\n event.preventDefault();\n send();\n }\n }}\n />\n <div className=\"copilotKitInputControls\">\n {showPushToTalk && (\n <button\n onClick={() =>\n setPushToTalkState(pushToTalkState === \"idle\" ? \"recording\" : \"transcribing\")\n }\n className={pushToTalkState === \"recording\" ? \"copilotKitPushToTalkRecording\" : \"\"}\n >\n {context.icons.pushToTalkIcon}\n </button>\n )}\n <button disabled={sendDisabled} onClick={send}>\n {sendIcon}\n </button>\n </div>\n </div>\n );\n};\n","import React, { useMemo, useState } from \"react\";\nimport * as DefaultIcons from \"./Icons\";\n\n/**\n * Icons for CopilotChat component.\n */\nexport interface CopilotChatIcons {\n /**\n * The icon to use for the open chat button.\n * @default <OpenIcon />\n */\n openIcon?: React.ReactNode;\n\n /**\n * The icon to use for the close chat button.\n * @default <CloseIcon />\n */\n closeIcon?: React.ReactNode;\n\n /**\n * The icon to use for the close chat button in the header.\n * @default <HeaderCloseIcon />\n */\n headerCloseIcon?: React.ReactNode;\n\n /**\n * The icon to use for the send button.\n * @default <SendIcon />\n */\n sendIcon?: React.ReactNode;\n\n /**\n * The icon to use for the activity indicator.\n * @default <ActivityIcon />\n */\n activityIcon?: React.ReactNode;\n\n /**\n * The icon to use for the spinner.\n * @default <SpinnerIcon />\n */\n spinnerIcon?: React.ReactNode;\n\n /**\n * The icon to use for the stop button.\n * @default <StopIcon />\n */\n stopIcon?: React.ReactNode;\n\n /**\n * The icon to use for the regenerate button.\n * @default <RegenerateIcon />\n */\n regenerateIcon?: React.ReactNode;\n\n /**\n * The icons to use for push to talk.\n * @default <PushToTalkIcon />\n */\n\n pushToTalkIcon?: React.ReactNode;\n}\n\n/**\n * Labels for CopilotChat component.\n */\nexport interface CopilotChatLabels {\n /**\n * The initial message(s) to display in the chat window.\n */\n initial?: string | string[];\n\n /**\n * The title to display in the header.\n * @default \"CopilotKit\"\n */\n title?: string;\n\n /**\n * The placeholder to display in the input.\n * @default \"Type a message...\"\n */\n placeholder?: string;\n\n /**\n * The message to display when an error occurs.\n * @default \"❌ An error occurred. Please try again.\"\n */\n error?: string;\n\n /**\n * The label to display on the stop button.\n * @default \"Stop generating\"\n */\n stopGenerating?: string;\n\n /**\n * The label to display on the regenerate button.\n * @default \"Regenerate response\"\n */\n regenerateResponse?: string;\n}\n\ninterface ChatContext {\n labels: Required<CopilotChatLabels>;\n icons: Required<CopilotChatIcons>;\n open: boolean;\n setOpen: (open: boolean) => void;\n}\n\nexport const ChatContext = React.createContext<ChatContext | undefined>(undefined);\n\nexport function useChatContext(): ChatContext {\n const context = React.useContext(ChatContext);\n if (context === undefined) {\n throw new Error(\n \"Context not found. Did you forget to wrap your app in a <ChatContextProvider> component?\",\n );\n }\n return context;\n}\n\ninterface ChatContextProps {\n // temperature?: number;\n // instructions?: string;\n // maxFeedback?: number;\n labels?: CopilotChatLabels;\n icons?: CopilotChatIcons;\n children?: React.ReactNode;\n open: boolean;\n setOpen: (open: boolean) => void;\n}\n\nexport const ChatContextProvider = ({\n // temperature,\n // instructions,\n // maxFeedback,\n labels,\n icons,\n children,\n open,\n setOpen,\n}: ChatContextProps) => {\n const context = {\n labels: {\n ...{\n initial: \"\",\n title: \"CopilotKit\",\n placeholder: \"Type a message...\",\n error: \"❌ An error occurred. Please try again.\",\n stopGenerating: \"Stop generating\",\n regenerateResponse: \"Regenerate response\",\n },\n ...labels,\n },\n\n icons: {\n ...{\n openIcon: DefaultIcons.OpenIcon,\n closeIcon: DefaultIcons.CloseIcon,\n headerCloseIcon: DefaultIcons.HeaderCloseIcon,\n sendIcon: DefaultIcons.SendIcon,\n activityIcon: DefaultIcons.ActivityIcon,\n spinnerIcon: DefaultIcons.SpinnerIcon,\n stopIcon: DefaultIcons.StopIcon,\n regenerateIcon: DefaultIcons.RegenerateIcon,\n pushToTalkIcon: DefaultIcons.PushToTalkIcon,\n },\n ...icons,\n },\n open,\n setOpen,\n };\n return <ChatContext.Provider value={context}>{children}</ChatContext.Provider>;\n};\n","import React, { useState, useRef, useEffect, forwardRef, useImperativeHandle } from \"react\";\n\ninterface AutoResizingTextareaProps {\n maxRows?: number;\n placeholder?: string;\n value: string;\n onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n onKeyDown?: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n autoFocus?: boolean;\n}\n\nconst AutoResizingTextarea = forwardRef<HTMLTextAreaElement, AutoResizingTextareaProps>(\n ({ maxRows = 1, placeholder, value, onChange, onKeyDown, autoFocus }, ref) => {\n const internalTextareaRef = useRef<HTMLTextAreaElement>(null);\n const [maxHeight, setMaxHeight] = useState<number>(0);\n\n useImperativeHandle(ref, () => internalTextareaRef.current as HTMLTextAreaElement);\n\n useEffect(() => {\n const calculateMaxHeight = () => {\n const textarea = internalTextareaRef.current;\n if (textarea) {\n textarea.style.height = \"auto\";\n const singleRowHeight = textarea.scrollHeight;\n setMaxHeight(singleRowHeight * maxRows);\n if (autoFocus) {\n textarea.focus();\n }\n }\n };\n\n calculateMaxHeight();\n }, [maxRows]);\n\n useEffect(() => {\n const textarea = internalTextareaRef.current;\n if (textarea) {\n textarea.style.height = \"auto\";\n textarea.style.height = `${Math.min(textarea.scrollHeight, maxHeight)}px`;\n }\n }, [value, maxHeight]);\n\n return (\n <textarea\n ref={internalTextareaRef}\n value={value}\n onChange={onChange}\n onKeyDown={onKeyDown}\n placeholder={placeholder}\n style={{\n overflow: \"auto\",\n resize: \"none\",\n maxHeight: `${maxHeight}px`,\n }}\n rows={1}\n />\n );\n },\n);\n\nexport default AutoResizingTextarea;\n","import { useCopilotContext, useCopilotMessagesContext } from \"@copilotkit/react-core\";\nimport { Message, TextMessage } from \"@copilotkit/runtime-client-gql\";\nimport { MutableRefObject, useEffect, useRef, useState } from \"react\";\n\nexport const checkMicrophonePermission = async () => {\n try {\n const permissionStatus = await navigator.permissions.query({\n name: \"microphone\" as PermissionName,\n });\n if (permissionStatus.state === \"granted\") {\n return true;\n } else {\n return false;\n }\n } catch (err) {\n console.error(\"Error checking microphone permission\", err);\n }\n};\n\nexport const requestMicAndPlaybackPermission = async () => {\n try {\n const stream = await navigator.mediaDevices.getUserMedia({ audio: true });\n const audioContext = new window.AudioContext();\n await audioContext.resume();\n return { stream, audioContext };\n } catch (err) {\n console.error(\"Error requesting microphone and playback permissions\", err);\n return null;\n }\n};\n\nconst startRecording = async (\n mediaStreamRef: MutableRefObject<MediaStream | null>,\n mediaRecorderRef: MutableRefObject<MediaRecorder | null>,\n audioContextRef: MutableRefObject<AudioContext | null>,\n recordedChunks: Blob[],\n onStop: () => void,\n) => {\n if (!mediaStreamRef.current || !audioContextRef.current) {\n mediaStreamRef.current = await navigator.mediaDevices.getUserMedia({ audio: true });\n audioContextRef.current = new window.AudioContext();\n await audioContextRef.current.resume();\n }\n\n mediaRecorderRef.current = new MediaRecorder(mediaStreamRef.current!);\n mediaRecorderRef.current.start(1000);\n mediaRecorderRef.current.ondataavailable = (event) => {\n recordedChunks.push(event.data);\n };\n mediaRecorderRef.current.onstop = onStop;\n};\n\nconst stopRecording = (mediaRecorderRef: MutableRefObject<MediaRecorder | null>) => {\n if (mediaRecorderRef.current && mediaRecorderRef.current.state !== \"inactive\") {\n mediaRecorderRef.current.stop();\n }\n};\n\nconst transcribeAudio = async (recordedChunks: Blob[], transcribeAudioUrl: string) => {\n const completeBlob = new Blob(recordedChunks, { type: \"audio/mp4\" });\n const formData = new FormData();\n formData.append(\"file\", completeBlob, \"recording.mp4\");\n\n const response = await fetch(transcribeAudioUrl, {\n method: \"POST\",\n body: formData,\n });\n\n if (!response.ok) {\n throw new Error(`Error: ${response.statusText}`);\n }\n\n const transcription = await response.json();\n return transcription.text;\n};\n\nconst playAudioResponse = (text: string, textToSpeechUrl: string, audioContext: AudioContext) => {\n const encodedText = encodeURIComponent(text);\n const url = `${textToSpeechUrl}?text=${encodedText}`;\n\n fetch(url)\n .then((response) => response.arrayBuffer())\n .then((arrayBuffer) => audioContext.decodeAudioData(arrayBuffer))\n .then((audioBuffer) => {\n const source = audioContext.createBufferSource();\n source.buffer = audioBuffer;\n source.connect(audioContext.destination);\n source.start(0);\n })\n .catch((error) => {\n console.error(\"Error with decoding audio data\", error);\n });\n};\n\nexport type PushToTalkState = \"idle\" | \"recording\" | \"transcribing\";\n\nexport type SendFunction = (text: string) => Promise<Message>;\n\nexport const usePushToTalk = ({\n sendFunction,\n inProgress,\n}: {\n sendFunction: SendFunction;\n inProgress: boolean;\n}) => {\n const [pushToTalkState, setPushToTalkState] = useState<PushToTalkState>(\"idle\");\n const mediaStreamRef = useRef<MediaStream | null>(null);\n const audioContextRef = useRef<AudioContext | null>(null);\n const mediaRecorderRef = useRef<MediaRecorder | null>(null);\n const recordedChunks = useRef<Blob[]>([]);\n const generalContext = useCopilotContext();\n const messagesContext = useCopilotMessagesContext();\n const context = { ...generalContext, ...messagesContext };\n const [startReadingFromMessageId, setStartReadingFromMessageId] = useState<string | null>(null);\n\n useEffect(() => {\n if (pushToTalkState === \"recording\") {\n startRecording(\n mediaStreamRef,\n mediaRecorderRef,\n audioContextRef,\n recordedChunks.current,\n () => {\n setPushToTalkState(\"transcribing\");\n },\n );\n } else {\n stopRecording(mediaRecorderRef);\n if (pushToTalkState === \"transcribing\") {\n transcribeAudio(recordedChunks.current, context.copilotApiConfig.transcribeAudioUrl!).then(\n async (transcription) => {\n recordedChunks.current = [];\n setPushToTalkState(\"idle\");\n const message = await sendFunction(transcription);\n setStartReadingFromMessageId(message.id);\n },\n );\n }\n }\n\n return () => {\n stopRecording(mediaRecorderRef);\n };\n }, [pushToTalkState]);\n\n useEffect(() => {\n if (inProgress === false && startReadingFromMessageId) {\n const lastMessageIndex = context.messages.findIndex(\n (message) => message.id === startReadingFromMessageId,\n );\n\n const messagesAfterLast = context.messages\n .slice(lastMessageIndex + 1)\n .filter(\n (message) => message instanceof TextMessage && message.role === \"assistant\",\n ) as TextMessage[];\n\n const text = messagesAfterLast.map((message) => message.content).join(\"\\n\");\n playAudioResponse(text, context.copilotApiConfig.textToSpeechUrl!, audioContextRef.current!);\n\n setStartReadingFromMessageId(null);\n }\n }, [startReadingFromMessageId, inProgress]);\n\n return { pushToTalkState, setPushToTalkState };\n};\n"],"mappings":"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","names":["import_react","React","import_react","import_jsx_runtime","import_react","import_react_core","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/chat/Input.tsx","../../../src/components/chat/ChatContext.tsx","../../../src/components/chat/Textarea.tsx","../../../src/hooks/use-push-to-talk.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport { InputProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\nimport AutoResizingTextarea from \"./Textarea\";\nimport { usePushToTalk } from \"../../hooks/use-push-to-talk\";\nimport { useCopilotContext } from \"@copilotkit/react-core\";\n\nexport const Input = ({ inProgress, onSend, isVisible = false }: InputProps) => {\n const context = useChatContext();\n const copilotContext = useCopilotContext();\n\n const pushToTalkConfigured =\n copilotContext.copilotApiConfig.textToSpeechUrl !== undefined &&\n copilotContext.copilotApiConfig.transcribeAudioUrl !== undefined;\n\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n const handleDivClick = (event: React.MouseEvent<HTMLDivElement>) => {\n // Check if the clicked element is not the textarea itself\n if (event.target !== event.currentTarget) return;\n\n textareaRef.current?.focus();\n };\n\n const [text, setText] = useState(\"\");\n const send = () => {\n if (inProgress) return;\n onSend(text);\n setText(\"\");\n\n textareaRef.current?.focus();\n };\n\n useEffect(() => {\n if (isVisible) {\n textareaRef.current?.focus();\n }\n }, [isVisible]);\n\n const { pushToTalkState, setPushToTalkState } = usePushToTalk({\n sendFunction: onSend,\n inProgress,\n });\n\n const sendIcon =\n inProgress || pushToTalkState === \"transcribing\"\n ? context.icons.activityIcon\n : context.icons.sendIcon;\n const showPushToTalk =\n pushToTalkConfigured &&\n (pushToTalkState === \"idle\" || pushToTalkState === \"recording\") &&\n !inProgress;\n const sendDisabled = inProgress || text.length === 0 || pushToTalkState !== \"idle\";\n\n return (\n <div className=\"copilotKitInput\" onClick={handleDivClick}>\n <AutoResizingTextarea\n ref={textareaRef}\n placeholder={context.labels.placeholder}\n autoFocus={true}\n maxRows={5}\n value={text}\n onChange={(event) => setText(event.target.value)}\n onKeyDown={(event) => {\n if (event.key === \"Enter\" && !event.shiftKey) {\n event.preventDefault();\n send();\n }\n }}\n />\n <div className=\"copilotKitInputControls\">\n {showPushToTalk && (\n <button\n onClick={() =>\n setPushToTalkState(pushToTalkState === \"idle\" ? \"recording\" : \"transcribing\")\n }\n className={pushToTalkState === \"recording\" ? \"copilotKitPushToTalkRecording\" : \"\"}\n >\n {context.icons.pushToTalkIcon}\n </button>\n )}\n <button disabled={sendDisabled} onClick={send}>\n {sendIcon}\n </button>\n </div>\n </div>\n );\n};\n","import React, { useMemo, useState } from \"react\";\nimport * as DefaultIcons from \"./Icons\";\n\n/**\n * Icons for CopilotChat component.\n */\nexport interface CopilotChatIcons {\n /**\n * The icon to use for the open chat button.\n * @default <OpenIcon />\n */\n openIcon?: React.ReactNode;\n\n /**\n * The icon to use for the close chat button.\n * @default <CloseIcon />\n */\n closeIcon?: React.ReactNode;\n\n /**\n * The icon to use for the close chat button in the header.\n * @default <HeaderCloseIcon />\n */\n headerCloseIcon?: React.ReactNode;\n\n /**\n * The icon to use for the send button.\n * @default <SendIcon />\n */\n sendIcon?: React.ReactNode;\n\n /**\n * The icon to use for the activity indicator.\n * @default <ActivityIcon />\n */\n activityIcon?: React.ReactNode;\n\n /**\n * The icon to use for the spinner.\n * @default <SpinnerIcon />\n */\n spinnerIcon?: React.ReactNode;\n\n /**\n * The icon to use for the stop button.\n * @default <StopIcon />\n */\n stopIcon?: React.ReactNode;\n\n /**\n * The icon to use for the regenerate button.\n * @default <RegenerateIcon />\n */\n regenerateIcon?: React.ReactNode;\n\n /**\n * The icons to use for push to talk.\n * @default <PushToTalkIcon />\n */\n\n pushToTalkIcon?: React.ReactNode;\n}\n\n/**\n * Labels for CopilotChat component.\n */\nexport interface CopilotChatLabels {\n /**\n * The initial message(s) to display in the chat window.\n */\n initial?: string | string[];\n\n /**\n * The title to display in the header.\n * @default \"CopilotKit\"\n */\n title?: string;\n\n /**\n * The placeholder to display in the input.\n * @default \"Type a message...\"\n */\n placeholder?: string;\n\n /**\n * The message to display when an error occurs.\n * @default \"❌ An error occurred. Please try again.\"\n */\n error?: string;\n\n /**\n * The label to display on the stop button.\n * @default \"Stop generating\"\n */\n stopGenerating?: string;\n\n /**\n * The label to display on the regenerate button.\n * @default \"Regenerate response\"\n */\n regenerateResponse?: string;\n}\n\ninterface ChatContext {\n labels: Required<CopilotChatLabels>;\n icons: Required<CopilotChatIcons>;\n open: boolean;\n setOpen: (open: boolean) => void;\n}\n\nexport const ChatContext = React.createContext<ChatContext | undefined>(undefined);\n\nexport function useChatContext(): ChatContext {\n const context = React.useContext(ChatContext);\n if (context === undefined) {\n throw new Error(\n \"Context not found. Did you forget to wrap your app in a <ChatContextProvider> component?\",\n );\n }\n return context;\n}\n\ninterface ChatContextProps {\n // temperature?: number;\n // instructions?: string;\n // maxFeedback?: number;\n labels?: CopilotChatLabels;\n icons?: CopilotChatIcons;\n children?: React.ReactNode;\n open: boolean;\n setOpen: (open: boolean) => void;\n}\n\nexport const ChatContextProvider = ({\n // temperature,\n // instructions,\n // maxFeedback,\n labels,\n icons,\n children,\n open,\n setOpen,\n}: ChatContextProps) => {\n const context = {\n labels: {\n ...{\n initial: \"\",\n title: \"CopilotKit\",\n placeholder: \"Type a message...\",\n error: \"❌ An error occurred. Please try again.\",\n stopGenerating: \"Stop generating\",\n regenerateResponse: \"Regenerate response\",\n },\n ...labels,\n },\n\n icons: {\n ...{\n openIcon: DefaultIcons.OpenIcon,\n closeIcon: DefaultIcons.CloseIcon,\n headerCloseIcon: DefaultIcons.HeaderCloseIcon,\n sendIcon: DefaultIcons.SendIcon,\n activityIcon: DefaultIcons.ActivityIcon,\n spinnerIcon: DefaultIcons.SpinnerIcon,\n stopIcon: DefaultIcons.StopIcon,\n regenerateIcon: DefaultIcons.RegenerateIcon,\n pushToTalkIcon: DefaultIcons.PushToTalkIcon,\n },\n ...icons,\n },\n open,\n setOpen,\n };\n return <ChatContext.Provider value={context}>{children}</ChatContext.Provider>;\n};\n","import React, { useState, useRef, useEffect, forwardRef, useImperativeHandle } from \"react\";\n\ninterface AutoResizingTextareaProps {\n maxRows?: number;\n placeholder?: string;\n value: string;\n onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n onKeyDown?: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n autoFocus?: boolean;\n}\n\nconst AutoResizingTextarea = forwardRef<HTMLTextAreaElement, AutoResizingTextareaProps>(\n ({ maxRows = 1, placeholder, value, onChange, onKeyDown, autoFocus }, ref) => {\n const internalTextareaRef = useRef<HTMLTextAreaElement>(null);\n const [maxHeight, setMaxHeight] = useState<number>(0);\n\n useImperativeHandle(ref, () => internalTextareaRef.current as HTMLTextAreaElement);\n\n useEffect(() => {\n const calculateMaxHeight = () => {\n const textarea = internalTextareaRef.current;\n if (textarea) {\n textarea.style.height = \"auto\";\n const singleRowHeight = textarea.scrollHeight;\n setMaxHeight(singleRowHeight * maxRows);\n if (autoFocus) {\n textarea.focus();\n }\n }\n };\n\n calculateMaxHeight();\n }, [maxRows]);\n\n useEffect(() => {\n const textarea = internalTextareaRef.current;\n if (textarea) {\n textarea.style.height = \"auto\";\n textarea.style.height = `${Math.min(textarea.scrollHeight, maxHeight)}px`;\n }\n }, [value, maxHeight]);\n\n return (\n <textarea\n ref={internalTextareaRef}\n value={value}\n onChange={onChange}\n onKeyDown={onKeyDown}\n placeholder={placeholder}\n style={{\n overflow: \"auto\",\n resize: \"none\",\n maxHeight: `${maxHeight}px`,\n }}\n rows={1}\n />\n );\n },\n);\n\nexport default AutoResizingTextarea;\n","import { useCopilotContext, useCopilotMessagesContext } from \"@copilotkit/react-core\";\nimport { Message, TextMessage } from \"@copilotkit/runtime-client-gql\";\nimport { MutableRefObject, useEffect, useRef, useState } from \"react\";\n\nexport const checkMicrophonePermission = async () => {\n try {\n const permissionStatus = await navigator.permissions.query({\n name: \"microphone\" as PermissionName,\n });\n if (permissionStatus.state === \"granted\") {\n return true;\n } else {\n return false;\n }\n } catch (err) {\n console.error(\"Error checking microphone permission\", err);\n }\n};\n\nexport const requestMicAndPlaybackPermission = async () => {\n try {\n const stream = await navigator.mediaDevices.getUserMedia({ audio: true });\n const audioContext = new window.AudioContext();\n await audioContext.resume();\n return { stream, audioContext };\n } catch (err) {\n console.error(\"Error requesting microphone and playback permissions\", err);\n return null;\n }\n};\n\nconst startRecording = async (\n mediaStreamRef: MutableRefObject<MediaStream | null>,\n mediaRecorderRef: MutableRefObject<MediaRecorder | null>,\n audioContextRef: MutableRefObject<AudioContext | null>,\n recordedChunks: Blob[],\n onStop: () => void,\n) => {\n if (!mediaStreamRef.current || !audioContextRef.current) {\n mediaStreamRef.current = await navigator.mediaDevices.getUserMedia({ audio: true });\n audioContextRef.current = new window.AudioContext();\n await audioContextRef.current.resume();\n }\n\n mediaRecorderRef.current = new MediaRecorder(mediaStreamRef.current!);\n mediaRecorderRef.current.start(1000);\n mediaRecorderRef.current.ondataavailable = (event) => {\n recordedChunks.push(event.data);\n };\n mediaRecorderRef.current.onstop = onStop;\n};\n\nconst stopRecording = (mediaRecorderRef: MutableRefObject<MediaRecorder | null>) => {\n if (mediaRecorderRef.current && mediaRecorderRef.current.state !== \"inactive\") {\n mediaRecorderRef.current.stop();\n }\n};\n\nconst transcribeAudio = async (recordedChunks: Blob[], transcribeAudioUrl: string) => {\n const completeBlob = new Blob(recordedChunks, { type: \"audio/mp4\" });\n const formData = new FormData();\n formData.append(\"file\", completeBlob, \"recording.mp4\");\n\n const response = await fetch(transcribeAudioUrl, {\n method: \"POST\",\n body: formData,\n });\n\n if (!response.ok) {\n throw new Error(`Error: ${response.statusText}`);\n }\n\n const transcription = await response.json();\n return transcription.text;\n};\n\nconst playAudioResponse = (text: string, textToSpeechUrl: string, audioContext: AudioContext) => {\n const encodedText = encodeURIComponent(text);\n const url = `${textToSpeechUrl}?text=${encodedText}`;\n\n fetch(url)\n .then((response) => response.arrayBuffer())\n .then((arrayBuffer) => audioContext.decodeAudioData(arrayBuffer))\n .then((audioBuffer) => {\n const source = audioContext.createBufferSource();\n source.buffer = audioBuffer;\n source.connect(audioContext.destination);\n source.start(0);\n })\n .catch((error) => {\n console.error(\"Error with decoding audio data\", error);\n });\n};\n\nexport type PushToTalkState = \"idle\" | \"recording\" | \"transcribing\";\n\nexport type SendFunction = (text: string) => Promise<Message>;\n\nexport const usePushToTalk = ({\n sendFunction,\n inProgress,\n}: {\n sendFunction: SendFunction;\n inProgress: boolean;\n}) => {\n const [pushToTalkState, setPushToTalkState] = useState<PushToTalkState>(\"idle\");\n const mediaStreamRef = useRef<MediaStream | null>(null);\n const audioContextRef = useRef<AudioContext | null>(null);\n const mediaRecorderRef = useRef<MediaRecorder | null>(null);\n const recordedChunks = useRef<Blob[]>([]);\n const generalContext = useCopilotContext();\n const messagesContext = useCopilotMessagesContext();\n const context = { ...generalContext, ...messagesContext };\n const [startReadingFromMessageId, setStartReadingFromMessageId] = useState<string | null>(null);\n\n useEffect(() => {\n if (pushToTalkState === \"recording\") {\n startRecording(\n mediaStreamRef,\n mediaRecorderRef,\n audioContextRef,\n recordedChunks.current,\n () => {\n setPushToTalkState(\"transcribing\");\n },\n );\n } else {\n stopRecording(mediaRecorderRef);\n if (pushToTalkState === \"transcribing\") {\n transcribeAudio(recordedChunks.current, context.copilotApiConfig.transcribeAudioUrl!).then(\n async (transcription) => {\n recordedChunks.current = [];\n setPushToTalkState(\"idle\");\n const message = await sendFunction(transcription);\n setStartReadingFromMessageId(message.id);\n },\n );\n }\n }\n\n return () => {\n stopRecording(mediaRecorderRef);\n };\n }, [pushToTalkState]);\n\n useEffect(() => {\n if (inProgress === false && startReadingFromMessageId) {\n const lastMessageIndex = context.messages.findIndex(\n (message) => message.id === startReadingFromMessageId,\n );\n\n const messagesAfterLast = context.messages\n .slice(lastMessageIndex + 1)\n .filter(\n (message) => message.isTextMessage() && message.role === \"assistant\",\n ) as TextMessage[];\n\n const text = messagesAfterLast.map((message) => message.content).join(\"\\n\");\n playAudioResponse(text, context.copilotApiConfig.textToSpeechUrl!, audioContextRef.current!);\n\n setStartReadingFromMessageId(null);\n }\n }, [startReadingFromMessageId, inProgress]);\n\n return { pushToTalkState, setPushToTalkState };\n};\n"],"mappings":"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","names":["import_react","React","import_react","import_jsx_runtime","import_react","import_react_core","import_jsx_runtime"]}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import {
|
|
2
2
|
Input
|
|
3
|
-
} from "../../chunk-
|
|
3
|
+
} from "../../chunk-BNCTYKEP.mjs";
|
|
4
4
|
import "../../chunk-YQFVRDNC.mjs";
|
|
5
5
|
import "../../chunk-BJPGMY3I.mjs";
|
|
6
6
|
import "../../chunk-FZC7X5PK.mjs";
|
|
7
|
-
import "../../chunk-
|
|
7
|
+
import "../../chunk-S5MBUNGN.mjs";
|
|
8
8
|
import "../../chunk-MRXNTQOX.mjs";
|
|
9
9
|
export {
|
|
10
10
|
Input
|
|
@@ -69,10 +69,10 @@ var Messages = ({
|
|
|
69
69
|
messages = [...initialMessages, ...messages];
|
|
70
70
|
const actionResults = {};
|
|
71
71
|
for (let i = 0; i < messages.length; i++) {
|
|
72
|
-
if (messages[i]
|
|
72
|
+
if (messages[i].isActionExecutionMessage()) {
|
|
73
73
|
const id = messages[i].id;
|
|
74
74
|
const resultMessage = messages.find(
|
|
75
|
-
(message) => message
|
|
75
|
+
(message) => message.isResultMessage() && message.actionExecutionId === id
|
|
76
76
|
);
|
|
77
77
|
if (resultMessage) {
|
|
78
78
|
actionResults[id] = import_runtime_client_gql.ResultMessage.decodeResult(resultMessage.result || "");
|
|
@@ -93,7 +93,7 @@ var Messages = ({
|
|
|
93
93
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "copilotKitMessages", children: [
|
|
94
94
|
messages.map((message, index) => {
|
|
95
95
|
const isCurrentMessage = index === messages.length - 1;
|
|
96
|
-
if (message
|
|
96
|
+
if (message.isTextMessage()) {
|
|
97
97
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
98
98
|
RenderTextMessage,
|
|
99
99
|
{
|
|
@@ -104,7 +104,7 @@ var Messages = ({
|
|
|
104
104
|
},
|
|
105
105
|
index
|
|
106
106
|
);
|
|
107
|
-
} else if (message
|
|
107
|
+
} else if (message.isActionExecutionMessage()) {
|
|
108
108
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
109
109
|
RenderActionExecutionMessage,
|
|
110
110
|
{
|
|
@@ -116,7 +116,7 @@ var Messages = ({
|
|
|
116
116
|
},
|
|
117
117
|
index
|
|
118
118
|
);
|
|
119
|
-
} else if (message
|
|
119
|
+
} else if (message.isAgentStateMessage()) {
|
|
120
120
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
121
121
|
RenderAgentStateMessage,
|
|
122
122
|
{
|
|
@@ -127,7 +127,7 @@ var Messages = ({
|
|
|
127
127
|
},
|
|
128
128
|
index
|
|
129
129
|
);
|
|
130
|
-
} else if (message
|
|
130
|
+
} else if (message.isResultMessage()) {
|
|
131
131
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
132
132
|
RenderResultMessage,
|
|
133
133
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/chat/Messages.tsx","../../../src/components/chat/ChatContext.tsx"],"sourcesContent":["import React, { useEffect, useMemo } from \"react\";\nimport { MessagesProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\nimport {\n ActionExecutionMessage,\n Message,\n ResultMessage,\n TextMessage,\n Role,\n AgentStateMessage,\n} from \"@copilotkit/runtime-client-gql\";\n\nexport const Messages = ({\n messages,\n inProgress,\n children,\n RenderTextMessage,\n RenderActionExecutionMessage,\n RenderAgentStateMessage,\n RenderResultMessage,\n}: MessagesProps) => {\n const context = useChatContext();\n const initialMessages = useMemo(\n () => makeInitialMessages(context.labels.initial),\n [context.labels.initial],\n );\n messages = [...initialMessages, ...messages];\n\n const actionResults: Record<string, string> = {};\n\n for (let i = 0; i < messages.length; i++) {\n if (messages[i]
|
|
1
|
+
{"version":3,"sources":["../../../src/components/chat/Messages.tsx","../../../src/components/chat/ChatContext.tsx"],"sourcesContent":["import React, { useEffect, useMemo } from \"react\";\nimport { MessagesProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\nimport {\n ActionExecutionMessage,\n Message,\n ResultMessage,\n TextMessage,\n Role,\n AgentStateMessage,\n} from \"@copilotkit/runtime-client-gql\";\n\nexport const Messages = ({\n messages,\n inProgress,\n children,\n RenderTextMessage,\n RenderActionExecutionMessage,\n RenderAgentStateMessage,\n RenderResultMessage,\n}: MessagesProps) => {\n const context = useChatContext();\n const initialMessages = useMemo(\n () => makeInitialMessages(context.labels.initial),\n [context.labels.initial],\n );\n messages = [...initialMessages, ...messages];\n\n const actionResults: Record<string, string> = {};\n\n for (let i = 0; i < messages.length; i++) {\n if (messages[i].isActionExecutionMessage()) {\n const id = messages[i].id;\n const resultMessage: ResultMessage | undefined = messages.find(\n (message) => message.isResultMessage() && message.actionExecutionId === id,\n ) as ResultMessage | undefined;\n\n if (resultMessage) {\n actionResults[id] = ResultMessage.decodeResult(resultMessage.result || \"\");\n }\n }\n }\n\n const messagesEndRef = React.useRef<HTMLDivElement>(null);\n\n const scrollToBottom = () => {\n if (messagesEndRef.current) {\n messagesEndRef.current.scrollIntoView({\n behavior: \"auto\",\n });\n }\n };\n\n useEffect(() => {\n scrollToBottom();\n }, [messages]);\n\n return (\n <div className=\"copilotKitMessages\">\n {messages.map((message, index) => {\n const isCurrentMessage = index === messages.length - 1;\n\n if (message.isTextMessage()) {\n return (\n <RenderTextMessage\n key={index}\n message={message}\n inProgress={inProgress}\n index={index}\n isCurrentMessage={isCurrentMessage}\n />\n );\n } else if (message.isActionExecutionMessage()) {\n return (\n <RenderActionExecutionMessage\n key={index}\n message={message}\n inProgress={inProgress}\n index={index}\n isCurrentMessage={isCurrentMessage}\n actionResult={actionResults[message.id]}\n />\n );\n } else if (message.isAgentStateMessage()) {\n return (\n <RenderAgentStateMessage\n key={index}\n message={message}\n inProgress={inProgress}\n index={index}\n isCurrentMessage={isCurrentMessage}\n />\n );\n } else if (message.isResultMessage()) {\n return (\n <RenderResultMessage\n key={index}\n message={message}\n inProgress={inProgress}\n index={index}\n isCurrentMessage={isCurrentMessage}\n />\n );\n }\n })}\n <footer ref={messagesEndRef}>{children}</footer>\n </div>\n );\n};\n\nfunction makeInitialMessages(initial?: string | string[]): Message[] {\n let initialArray: string[] = [];\n if (initial) {\n if (Array.isArray(initial)) {\n initialArray.push(...initial);\n } else {\n initialArray.push(initial);\n }\n }\n\n return initialArray.map(\n (message) =>\n new TextMessage({\n role: Role.Assistant,\n content: message,\n }),\n );\n}\n","import React, { useMemo, useState } from \"react\";\nimport * as DefaultIcons from \"./Icons\";\n\n/**\n * Icons for CopilotChat component.\n */\nexport interface CopilotChatIcons {\n /**\n * The icon to use for the open chat button.\n * @default <OpenIcon />\n */\n openIcon?: React.ReactNode;\n\n /**\n * The icon to use for the close chat button.\n * @default <CloseIcon />\n */\n closeIcon?: React.ReactNode;\n\n /**\n * The icon to use for the close chat button in the header.\n * @default <HeaderCloseIcon />\n */\n headerCloseIcon?: React.ReactNode;\n\n /**\n * The icon to use for the send button.\n * @default <SendIcon />\n */\n sendIcon?: React.ReactNode;\n\n /**\n * The icon to use for the activity indicator.\n * @default <ActivityIcon />\n */\n activityIcon?: React.ReactNode;\n\n /**\n * The icon to use for the spinner.\n * @default <SpinnerIcon />\n */\n spinnerIcon?: React.ReactNode;\n\n /**\n * The icon to use for the stop button.\n * @default <StopIcon />\n */\n stopIcon?: React.ReactNode;\n\n /**\n * The icon to use for the regenerate button.\n * @default <RegenerateIcon />\n */\n regenerateIcon?: React.ReactNode;\n\n /**\n * The icons to use for push to talk.\n * @default <PushToTalkIcon />\n */\n\n pushToTalkIcon?: React.ReactNode;\n}\n\n/**\n * Labels for CopilotChat component.\n */\nexport interface CopilotChatLabels {\n /**\n * The initial message(s) to display in the chat window.\n */\n initial?: string | string[];\n\n /**\n * The title to display in the header.\n * @default \"CopilotKit\"\n */\n title?: string;\n\n /**\n * The placeholder to display in the input.\n * @default \"Type a message...\"\n */\n placeholder?: string;\n\n /**\n * The message to display when an error occurs.\n * @default \"❌ An error occurred. Please try again.\"\n */\n error?: string;\n\n /**\n * The label to display on the stop button.\n * @default \"Stop generating\"\n */\n stopGenerating?: string;\n\n /**\n * The label to display on the regenerate button.\n * @default \"Regenerate response\"\n */\n regenerateResponse?: string;\n}\n\ninterface ChatContext {\n labels: Required<CopilotChatLabels>;\n icons: Required<CopilotChatIcons>;\n open: boolean;\n setOpen: (open: boolean) => void;\n}\n\nexport const ChatContext = React.createContext<ChatContext | undefined>(undefined);\n\nexport function useChatContext(): ChatContext {\n const context = React.useContext(ChatContext);\n if (context === undefined) {\n throw new Error(\n \"Context not found. Did you forget to wrap your app in a <ChatContextProvider> component?\",\n );\n }\n return context;\n}\n\ninterface ChatContextProps {\n // temperature?: number;\n // instructions?: string;\n // maxFeedback?: number;\n labels?: CopilotChatLabels;\n icons?: CopilotChatIcons;\n children?: React.ReactNode;\n open: boolean;\n setOpen: (open: boolean) => void;\n}\n\nexport const ChatContextProvider = ({\n // temperature,\n // instructions,\n // maxFeedback,\n labels,\n icons,\n children,\n open,\n setOpen,\n}: ChatContextProps) => {\n const context = {\n labels: {\n ...{\n initial: \"\",\n title: \"CopilotKit\",\n placeholder: \"Type a message...\",\n error: \"❌ An error occurred. Please try again.\",\n stopGenerating: \"Stop generating\",\n regenerateResponse: \"Regenerate response\",\n },\n ...labels,\n },\n\n icons: {\n ...{\n openIcon: DefaultIcons.OpenIcon,\n closeIcon: DefaultIcons.CloseIcon,\n headerCloseIcon: DefaultIcons.HeaderCloseIcon,\n sendIcon: DefaultIcons.SendIcon,\n activityIcon: DefaultIcons.ActivityIcon,\n spinnerIcon: DefaultIcons.SpinnerIcon,\n stopIcon: DefaultIcons.StopIcon,\n regenerateIcon: DefaultIcons.RegenerateIcon,\n pushToTalkIcon: DefaultIcons.PushToTalkIcon,\n },\n ...icons,\n },\n open,\n setOpen,\n };\n return <ChatContext.Provider value={context}>{children}</ChatContext.Provider>;\n};\n"],"mappings":"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","names":["import_react","React","import_jsx_runtime","React"]}
|
|
@@ -533,10 +533,10 @@ var Messages = ({
|
|
|
533
533
|
messages = [...initialMessages, ...messages];
|
|
534
534
|
const actionResults = {};
|
|
535
535
|
for (let i = 0; i < messages.length; i++) {
|
|
536
|
-
if (messages[i]
|
|
536
|
+
if (messages[i].isActionExecutionMessage()) {
|
|
537
537
|
const id = messages[i].id;
|
|
538
538
|
const resultMessage = messages.find(
|
|
539
|
-
(message) => message
|
|
539
|
+
(message) => message.isResultMessage() && message.actionExecutionId === id
|
|
540
540
|
);
|
|
541
541
|
if (resultMessage) {
|
|
542
542
|
actionResults[id] = import_runtime_client_gql.ResultMessage.decodeResult(resultMessage.result || "");
|
|
@@ -557,7 +557,7 @@ var Messages = ({
|
|
|
557
557
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "copilotKitMessages", children: [
|
|
558
558
|
messages.map((message, index) => {
|
|
559
559
|
const isCurrentMessage = index === messages.length - 1;
|
|
560
|
-
if (message
|
|
560
|
+
if (message.isTextMessage()) {
|
|
561
561
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
562
562
|
RenderTextMessage2,
|
|
563
563
|
{
|
|
@@ -568,7 +568,7 @@ var Messages = ({
|
|
|
568
568
|
},
|
|
569
569
|
index
|
|
570
570
|
);
|
|
571
|
-
} else if (message
|
|
571
|
+
} else if (message.isActionExecutionMessage()) {
|
|
572
572
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
573
573
|
RenderActionExecutionMessage2,
|
|
574
574
|
{
|
|
@@ -580,7 +580,7 @@ var Messages = ({
|
|
|
580
580
|
},
|
|
581
581
|
index
|
|
582
582
|
);
|
|
583
|
-
} else if (message
|
|
583
|
+
} else if (message.isAgentStateMessage()) {
|
|
584
584
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
585
585
|
RenderAgentStateMessage2,
|
|
586
586
|
{
|
|
@@ -591,7 +591,7 @@ var Messages = ({
|
|
|
591
591
|
},
|
|
592
592
|
index
|
|
593
593
|
);
|
|
594
|
-
} else if (message
|
|
594
|
+
} else if (message.isResultMessage()) {
|
|
595
595
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
596
596
|
RenderResultMessage2,
|
|
597
597
|
{
|
|
@@ -678,7 +678,6 @@ var Textarea_default = AutoResizingTextarea;
|
|
|
678
678
|
|
|
679
679
|
// src/hooks/use-push-to-talk.tsx
|
|
680
680
|
var import_react_core = require("@copilotkit/react-core");
|
|
681
|
-
var import_runtime_client_gql2 = require("@copilotkit/runtime-client-gql");
|
|
682
681
|
var import_react5 = require("react");
|
|
683
682
|
var startRecording = (mediaStreamRef, mediaRecorderRef, audioContextRef, recordedChunks, onStop) => __async(void 0, null, function* () {
|
|
684
683
|
if (!mediaStreamRef.current || !audioContextRef.current) {
|
|
@@ -771,7 +770,7 @@ var usePushToTalk = ({
|
|
|
771
770
|
(message) => message.id === startReadingFromMessageId
|
|
772
771
|
);
|
|
773
772
|
const messagesAfterLast = context.messages.slice(lastMessageIndex + 1).filter(
|
|
774
|
-
(message) => message
|
|
773
|
+
(message) => message.isTextMessage() && message.role === "assistant"
|
|
775
774
|
);
|
|
776
775
|
const text = messagesAfterLast.map((message) => message.content).join("\n");
|
|
777
776
|
playAudioResponse(text, context.copilotApiConfig.textToSpeechUrl, audioContextRef.current);
|
|
@@ -859,9 +858,6 @@ var ResponseButton = ({ onClick, inProgress }) => {
|
|
|
859
858
|
] });
|
|
860
859
|
};
|
|
861
860
|
|
|
862
|
-
// src/components/chat/messages/RenderTextMessage.tsx
|
|
863
|
-
var import_runtime_client_gql3 = require("@copilotkit/runtime-client-gql");
|
|
864
|
-
|
|
865
861
|
// src/components/chat/Markdown.tsx
|
|
866
862
|
var import_react8 = require("react");
|
|
867
863
|
var import_react_markdown = __toESM(require("react-markdown"));
|
|
@@ -1335,7 +1331,7 @@ var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
|
1335
1331
|
function RenderTextMessage(props) {
|
|
1336
1332
|
const { message, inProgress, index, isCurrentMessage } = props;
|
|
1337
1333
|
const { icons } = useChatContext();
|
|
1338
|
-
if (message
|
|
1334
|
+
if (message.isTextMessage()) {
|
|
1339
1335
|
if (message.role === "user") {
|
|
1340
1336
|
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "copilotKitMessage copilotKitUserMessage", children: message.content }, index);
|
|
1341
1337
|
} else if (message.role == "assistant") {
|
|
@@ -1345,14 +1341,14 @@ function RenderTextMessage(props) {
|
|
|
1345
1341
|
}
|
|
1346
1342
|
|
|
1347
1343
|
// src/components/chat/messages/RenderActionExecutionMessage.tsx
|
|
1348
|
-
var
|
|
1344
|
+
var import_runtime_client_gql2 = require("@copilotkit/runtime-client-gql");
|
|
1349
1345
|
var import_react_core3 = require("@copilotkit/react-core");
|
|
1350
1346
|
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
1351
1347
|
function RenderActionExecutionMessage(props) {
|
|
1352
1348
|
const { message, inProgress, index, isCurrentMessage, actionResult } = props;
|
|
1353
1349
|
const { chatComponentsCache } = (0, import_react_core3.useCopilotContext)();
|
|
1354
1350
|
const { icons } = useChatContext();
|
|
1355
|
-
if (message
|
|
1351
|
+
if (message.isActionExecutionMessage()) {
|
|
1356
1352
|
if (chatComponentsCache.current !== null && chatComponentsCache.current.actions[message.name]) {
|
|
1357
1353
|
const render = chatComponentsCache.current.actions[message.name];
|
|
1358
1354
|
if (typeof render === "string") {
|
|
@@ -1370,7 +1366,7 @@ function RenderActionExecutionMessage(props) {
|
|
|
1370
1366
|
let status = "inProgress";
|
|
1371
1367
|
if (actionResult !== void 0) {
|
|
1372
1368
|
status = "complete";
|
|
1373
|
-
} else if (message.status.code !==
|
|
1369
|
+
} else if (message.status.code !== import_runtime_client_gql2.MessageStatusCode.Pending) {
|
|
1374
1370
|
status = "executing";
|
|
1375
1371
|
}
|
|
1376
1372
|
try {
|
|
@@ -1413,25 +1409,23 @@ function RenderActionExecutionMessage(props) {
|
|
|
1413
1409
|
}
|
|
1414
1410
|
|
|
1415
1411
|
// src/components/chat/messages/RenderResultMessage.tsx
|
|
1416
|
-
var import_runtime_client_gql5 = require("@copilotkit/runtime-client-gql");
|
|
1417
1412
|
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
1418
1413
|
function RenderResultMessage(props) {
|
|
1419
1414
|
const { message, inProgress, index, isCurrentMessage } = props;
|
|
1420
1415
|
const { icons } = useChatContext();
|
|
1421
|
-
if (message
|
|
1416
|
+
if (message.isResultMessage() && inProgress && isCurrentMessage) {
|
|
1422
1417
|
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: icons.spinnerIcon }, index);
|
|
1423
1418
|
}
|
|
1424
1419
|
}
|
|
1425
1420
|
|
|
1426
1421
|
// src/components/chat/messages/RenderAgentStateMessage.tsx
|
|
1427
|
-
var import_runtime_client_gql6 = require("@copilotkit/runtime-client-gql");
|
|
1428
1422
|
var import_react_core4 = require("@copilotkit/react-core");
|
|
1429
1423
|
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
1430
1424
|
function RenderAgentStateMessage(props) {
|
|
1431
1425
|
const { message, inProgress, index, isCurrentMessage } = props;
|
|
1432
1426
|
const { chatComponentsCache } = (0, import_react_core4.useCopilotContext)();
|
|
1433
1427
|
const { icons } = useChatContext();
|
|
1434
|
-
if (message
|
|
1428
|
+
if (message.isAgentStateMessage()) {
|
|
1435
1429
|
let render;
|
|
1436
1430
|
if (chatComponentsCache.current !== null) {
|
|
1437
1431
|
render = chatComponentsCache.current.coAgentStateRenders[`${message.agentName}-${message.nodeName}`] || chatComponentsCache.current.coAgentStateRenders[`${message.agentName}-global`];
|
|
@@ -1484,7 +1478,7 @@ function RenderAgentStateMessage(props) {
|
|
|
1484
1478
|
// src/components/chat/Suggestion.tsx
|
|
1485
1479
|
var import_react_core5 = require("@copilotkit/react-core");
|
|
1486
1480
|
var import_shared = require("@copilotkit/shared");
|
|
1487
|
-
var
|
|
1481
|
+
var import_runtime_client_gql3 = require("@copilotkit/runtime-client-gql");
|
|
1488
1482
|
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
1489
1483
|
function Suggestion({ title, message, onClick, partial, className }) {
|
|
1490
1484
|
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
@@ -1520,7 +1514,7 @@ var reloadSuggestions = (context, chatSuggestionConfiguration, setCurrentSuggest
|
|
|
1520
1514
|
context,
|
|
1521
1515
|
instructions: "Suggest what the user could say next. Provide clear, highly relevant suggestions. Do not literally suggest function calls. " + config.instructions + "\n\n" + numOfSuggestionsInstructions,
|
|
1522
1516
|
data: "Available tools: " + tools + "\n\n",
|
|
1523
|
-
requestType:
|
|
1517
|
+
requestType: import_runtime_client_gql3.CopilotRequestType.Task,
|
|
1524
1518
|
parameters: [
|
|
1525
1519
|
{
|
|
1526
1520
|
name: "suggestions",
|
|
@@ -1576,13 +1570,11 @@ var reloadSuggestions = (context, chatSuggestionConfiguration, setCurrentSuggest
|
|
|
1576
1570
|
// src/components/chat/Chat.tsx
|
|
1577
1571
|
var import_react11 = __toESM(require("react"));
|
|
1578
1572
|
var import_react_core8 = require("@copilotkit/react-core");
|
|
1579
|
-
var
|
|
1573
|
+
var import_runtime_client_gql4 = require("@copilotkit/runtime-client-gql");
|
|
1580
1574
|
var import_shared3 = require("@copilotkit/shared");
|
|
1581
1575
|
|
|
1582
1576
|
// src/components/dev-console/utils.ts
|
|
1583
1577
|
var import_react_core6 = require("@copilotkit/react-core");
|
|
1584
|
-
var import_runtime_client_gql8 = require("@copilotkit/runtime-client-gql");
|
|
1585
|
-
var import_runtime_client_gql9 = require("@copilotkit/runtime-client-gql");
|
|
1586
1578
|
function shouldShowDevConsole(showDevConsole) {
|
|
1587
1579
|
if (typeof showDevConsole === "boolean") {
|
|
1588
1580
|
return showDevConsole;
|
|
@@ -1672,7 +1664,7 @@ function logMessages(context) {
|
|
|
1672
1664
|
return;
|
|
1673
1665
|
}
|
|
1674
1666
|
const tableData = context.messages.map((message) => {
|
|
1675
|
-
if (message
|
|
1667
|
+
if (message.isTextMessage()) {
|
|
1676
1668
|
return {
|
|
1677
1669
|
id: message.id,
|
|
1678
1670
|
type: "TextMessage",
|
|
@@ -1681,7 +1673,7 @@ function logMessages(context) {
|
|
|
1681
1673
|
scope: void 0,
|
|
1682
1674
|
content: message.content
|
|
1683
1675
|
};
|
|
1684
|
-
} else if (message
|
|
1676
|
+
} else if (message.isActionExecutionMessage()) {
|
|
1685
1677
|
return {
|
|
1686
1678
|
id: message.id,
|
|
1687
1679
|
type: "ActionExecutionMessage",
|
|
@@ -1690,7 +1682,7 @@ function logMessages(context) {
|
|
|
1690
1682
|
scope: message.scope,
|
|
1691
1683
|
content: message.arguments
|
|
1692
1684
|
};
|
|
1693
|
-
} else if (message
|
|
1685
|
+
} else if (message.isResultMessage()) {
|
|
1694
1686
|
return {
|
|
1695
1687
|
id: message.id,
|
|
1696
1688
|
type: "ResultMessage",
|
|
@@ -1699,7 +1691,7 @@ function logMessages(context) {
|
|
|
1699
1691
|
scope: message.actionExecutionId,
|
|
1700
1692
|
content: message.result
|
|
1701
1693
|
};
|
|
1702
|
-
} else if (message
|
|
1694
|
+
} else if (message.isAgentStateMessage()) {
|
|
1703
1695
|
return {
|
|
1704
1696
|
id: message.id,
|
|
1705
1697
|
type: `AgentStateMessage (running: ${message.running})`,
|
|
@@ -2130,9 +2122,9 @@ var useCopilotChatLogic = (makeSystemMessage, onInProgress, onSubmitMessage) =>
|
|
|
2130
2122
|
const sendMessage = (messageContent) => __async(void 0, null, function* () {
|
|
2131
2123
|
abortSuggestions();
|
|
2132
2124
|
setCurrentSuggestions([]);
|
|
2133
|
-
const message = new
|
|
2125
|
+
const message = new import_runtime_client_gql4.TextMessage({
|
|
2134
2126
|
content: messageContent,
|
|
2135
|
-
role:
|
|
2127
|
+
role: import_runtime_client_gql4.Role.User
|
|
2136
2128
|
});
|
|
2137
2129
|
if (onSubmitMessage) {
|
|
2138
2130
|
try {
|