@copilotkit/react-ui

Version:

github.com/CopilotKit/CopilotKit

CopilotKit/CopilotKit

1 lines • 9.66 kB

Source Map (JSON)

View Raw

{"version":3,"sources":["../src/components/chat/Modal.tsx"],"sourcesContent":["import React, { useMemo, useCallback, useEffect, useRef } from \"react\";\nimport { ChatContextProvider, useChatContext } from \"./ChatContext\";\nimport { ButtonProps, HeaderProps, WindowProps, CopilotObservabilityHooks } from \"./props\";\nimport { Window as DefaultWindow } from \"./Window\";\nimport { Button as DefaultButton } from \"./Button\";\nimport { Header as DefaultHeader } from \"./Header\";\nimport { Messages as DefaultMessages } from \"./Messages\";\nimport { Input as DefaultInput } from \"./Input\";\nimport { CopilotChat, CopilotChatProps } from \"./Chat\";\nimport { AssistantMessage as DefaultAssistantMessage } from \"./messages/AssistantMessage\";\nimport { UserMessage as DefaultUserMessage } from \"./messages/UserMessage\";\nimport { useCopilotContext } from \"@copilotkit/react-core\";\nimport {\n CopilotKitError,\n CopilotKitErrorCode,\n Severity,\n ErrorVisibility,\n styledConsole,\n} from \"@copilotkit/shared\";\n\nexport interface CopilotModalProps extends CopilotChatProps {\n /**\n * Whether the chat window should be open by default.\n * @default false\n */\n defaultOpen?: boolean;\n\n /**\n * If the chat window should close when the user clicks outside of it.\n * @default true\n */\n clickOutsideToClose?: boolean;\n\n /**\n * If the chat window should close when the user hits the Escape key.\n * @default true\n */\n hitEscapeToClose?: boolean;\n\n /**\n * The shortcut key to open the chat window.\n * Uses Command-[shortcut] on a Mac and Ctrl-[shortcut] on Windows.\n * @default '/'\n */\n shortcut?: string;\n\n /**\n * A callback that gets called when the chat window opens or closes.\n */\n onSetOpen?: (open: boolean) => void;\n\n /**\n * A custom Window component to use instead of the default.\n */\n Window?: React.ComponentType<WindowProps>;\n\n /**\n * A custom Button component to use instead of the default.\n */\n Button?: React.ComponentType<ButtonProps>;\n\n /**\n * A custom Header component to use instead of the default.\n */\n Header?: React.ComponentType<HeaderProps>;\n}\n\n// Inner component that has access to the Copilot context\nconst CopilotModalInner = ({\n observabilityHooks,\n onSetOpen,\n clickOutsideToClose,\n hitEscapeToClose,\n shortcut,\n className,\n children,\n Window,\n Button,\n Header,\n ...chatProps\n}: Omit<CopilotModalProps, \"icons\" | \"labels\" | \"defaultOpen\"> & {\n Window: React.ComponentType<WindowProps>;\n Button: React.ComponentType<ButtonProps>;\n Header: React.ComponentType<HeaderProps>;\n clickOutsideToClose: boolean;\n hitEscapeToClose: boolean;\n shortcut: string;\n}) => {\n const { copilotApiConfig, setBannerError } = useCopilotContext();\n\n // Destructure stable values to avoid object reference changes\n const { publicApiKey } = copilotApiConfig;\n\n // Helper function to trigger event hooks only if publicApiKey is provided\n const triggerObservabilityHook = useCallback(\n (hookName: keyof CopilotObservabilityHooks, ...args: any[]) => {\n if (publicApiKey && observabilityHooks?.[hookName]) {\n (observabilityHooks[hookName] as any)(...args);\n }\n if (observabilityHooks?.[hookName] && !publicApiKey) {\n setBannerError(\n new CopilotKitError({\n message: \"observabilityHooks requires a publicApiKey to function.\",\n code: CopilotKitErrorCode.MISSING_PUBLIC_API_KEY_ERROR,\n severity: Severity.CRITICAL,\n visibility: ErrorVisibility.BANNER,\n }),\n );\n styledConsole.publicApiKeyRequired(\"observabilityHooks\");\n }\n },\n [publicApiKey, observabilityHooks, setBannerError],\n );\n\n const { open } = useChatContext();\n const prevOpen = useRef(open);\n\n // Monitor open state changes and trigger event hooks\n useEffect(() => {\n if (prevOpen.current !== open) {\n onSetOpen?.(open);\n\n // Trigger chat minimize/expand events\n if (open) {\n triggerObservabilityHook(\"onChatExpanded\");\n } else {\n triggerObservabilityHook(\"onChatMinimized\");\n }\n prevOpen.current = open;\n }\n }, [open, onSetOpen, triggerObservabilityHook]);\n\n const memoizedHeader = useMemo(() => <Header />, [Header]);\n const memoizedChildren = useMemo(() => children, [children]);\n\n return (\n <>\n {memoizedChildren}\n <div className={className}>\n <Button></Button>\n <Window\n clickOutsideToClose={clickOutsideToClose}\n shortcut={shortcut}\n hitEscapeToClose={hitEscapeToClose}\n >\n {memoizedHeader}\n <CopilotChat {...chatProps} observabilityHooks={observabilityHooks} />\n </Window>\n </div>\n </>\n );\n};\n\nexport const CopilotModal = ({\n instructions,\n defaultOpen = false,\n clickOutsideToClose = true,\n hitEscapeToClose = true,\n onSetOpen,\n onSubmitMessage,\n onStopGeneration,\n onReloadMessages,\n shortcut = \"/\",\n icons,\n labels,\n makeSystemMessage,\n onInProgress,\n Window = DefaultWindow,\n Button = DefaultButton,\n Header = DefaultHeader,\n Messages = DefaultMessages,\n Input = DefaultInput,\n AssistantMessage = DefaultAssistantMessage,\n UserMessage = DefaultUserMessage,\n onThumbsUp,\n onThumbsDown,\n onCopy,\n onRegenerate,\n markdownTagRenderers,\n className,\n children,\n observabilityHooks,\n ...props\n}: CopilotModalProps) => {\n const [openState, setOpenState] = React.useState(defaultOpen);\n\n return (\n <ChatContextProvider icons={icons} labels={labels} open={openState} setOpen={setOpenState}>\n <CopilotModalInner\n observabilityHooks={observabilityHooks}\n onSetOpen={onSetOpen}\n clickOutsideToClose={clickOutsideToClose ?? true}\n hitEscapeToClose={hitEscapeToClose ?? true}\n shortcut={shortcut ?? \"/\"}\n className={className}\n Window={Window}\n Button={Button}\n Header={Header}\n instructions={instructions}\n onSubmitMessage={onSubmitMessage}\n onStopGeneration={onStopGeneration}\n onReloadMessages={onReloadMessages}\n makeSystemMessage={makeSystemMessage}\n onInProgress={onInProgress}\n Messages={Messages}\n Input={Input}\n AssistantMessage={AssistantMessage}\n UserMessage={UserMessage}\n onThumbsUp={onThumbsUp}\n onThumbsDown={onThumbsDown}\n onCopy={onCopy}\n onRegenerate={onRegenerate}\n markdownTagRenderers={markdownTagRenderers}\n {...props}\n >\n {children}\n </CopilotModalInner>\n </ChatContextProvider>\n );\n};\n"],"mappings":"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","names":["Window","Button","Header","Messages","Input","AssistantMessage","UserMessage"]}