@copilotkit/react-ui 1.3.0 → 1.3.1

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.
Files changed (203) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/chunk-54JAUBUJ.mjs +26 -0
  3. package/dist/chunk-54JAUBUJ.mjs.map +1 -0
  4. package/dist/chunk-5HHVL5WK.mjs +29 -0
  5. package/dist/chunk-5HHVL5WK.mjs.map +1 -0
  6. package/dist/chunk-B2KQEX2R.mjs +91 -0
  7. package/dist/chunk-B2KQEX2R.mjs.map +1 -0
  8. package/dist/chunk-BJPGMY3I.mjs +70 -0
  9. package/dist/chunk-BJPGMY3I.mjs.map +1 -0
  10. package/dist/chunk-EFZPSZWO.mjs +1 -0
  11. package/dist/chunk-EFZPSZWO.mjs.map +1 -0
  12. package/dist/chunk-FL4ETWFB.mjs +21 -0
  13. package/dist/chunk-FL4ETWFB.mjs.map +1 -0
  14. package/dist/chunk-FLV3J3VX.mjs +18 -0
  15. package/dist/chunk-FLV3J3VX.mjs.map +1 -0
  16. package/dist/chunk-FO7Z5LAL.mjs +118 -0
  17. package/dist/chunk-FO7Z5LAL.mjs.map +1 -0
  18. package/dist/chunk-FOZVHL73.mjs +171 -0
  19. package/dist/chunk-FOZVHL73.mjs.map +1 -0
  20. package/dist/chunk-FZC7X5PK.mjs +262 -0
  21. package/dist/chunk-FZC7X5PK.mjs.map +1 -0
  22. package/dist/chunk-H7TM5JE6.mjs +146 -0
  23. package/dist/chunk-H7TM5JE6.mjs.map +1 -0
  24. package/dist/chunk-HR36Y2FQ.mjs +167 -0
  25. package/dist/chunk-HR36Y2FQ.mjs.map +1 -0
  26. package/dist/chunk-I4QG2ZZU.mjs +220 -0
  27. package/dist/chunk-I4QG2ZZU.mjs.map +1 -0
  28. package/dist/chunk-IU3WTXLQ.mjs +1 -0
  29. package/dist/chunk-IU3WTXLQ.mjs.map +1 -0
  30. package/dist/chunk-JD7BAH7U.mjs +1 -0
  31. package/dist/chunk-JD7BAH7U.mjs.map +1 -0
  32. package/dist/chunk-MRFF7GSQ.mjs +1 -0
  33. package/dist/chunk-MRFF7GSQ.mjs.map +1 -0
  34. package/dist/chunk-MRXNTQOX.mjs +59 -0
  35. package/dist/chunk-MRXNTQOX.mjs.map +1 -0
  36. package/dist/chunk-OTPAZXVR.mjs +92 -0
  37. package/dist/chunk-OTPAZXVR.mjs.map +1 -0
  38. package/dist/chunk-QOEAEMUQ.mjs +30 -0
  39. package/dist/chunk-QOEAEMUQ.mjs.map +1 -0
  40. package/dist/chunk-T26KLXLH.mjs +1 -0
  41. package/dist/chunk-T26KLXLH.mjs.map +1 -0
  42. package/dist/chunk-U6J5DGOE.mjs +83 -0
  43. package/dist/chunk-U6J5DGOE.mjs.map +1 -0
  44. package/dist/chunk-UPTB2MVO.mjs +395 -0
  45. package/dist/chunk-UPTB2MVO.mjs.map +1 -0
  46. package/dist/chunk-V7W6IM2V.mjs +1 -0
  47. package/dist/chunk-V7W6IM2V.mjs.map +1 -0
  48. package/dist/chunk-VOBX4JOA.mjs +138 -0
  49. package/dist/chunk-VOBX4JOA.mjs.map +1 -0
  50. package/dist/chunk-WB3YULQ4.mjs +1 -0
  51. package/dist/chunk-WB3YULQ4.mjs.map +1 -0
  52. package/dist/chunk-WCPLXRZX.mjs +106 -0
  53. package/dist/chunk-WCPLXRZX.mjs.map +1 -0
  54. package/dist/chunk-XSUSSWDS.mjs +18 -0
  55. package/dist/chunk-XSUSSWDS.mjs.map +1 -0
  56. package/dist/chunk-YOH25I6N.mjs +25 -0
  57. package/dist/chunk-YOH25I6N.mjs.map +1 -0
  58. package/dist/chunk-YQ3D5IQV.mjs +75 -0
  59. package/dist/chunk-YQ3D5IQV.mjs.map +1 -0
  60. package/dist/chunk-YQFVRDNC.mjs +53 -0
  61. package/dist/chunk-YQFVRDNC.mjs.map +1 -0
  62. package/dist/components/chat/Button.js.map +1 -1
  63. package/dist/components/chat/Button.mjs +6 -30
  64. package/dist/components/chat/Button.mjs.map +1 -1
  65. package/dist/components/chat/Chat.d.ts +1 -1
  66. package/dist/components/chat/Chat.js +6 -3
  67. package/dist/components/chat/Chat.js.map +1 -1
  68. package/dist/components/chat/Chat.mjs +20 -1851
  69. package/dist/components/chat/Chat.mjs.map +1 -1
  70. package/dist/components/chat/ChatContext.d.ts +1 -1
  71. package/dist/components/chat/ChatContext.mjs +7 -228
  72. package/dist/components/chat/ChatContext.mjs.map +1 -1
  73. package/dist/components/chat/CodeBlock.js +2 -1
  74. package/dist/components/chat/CodeBlock.js.map +1 -1
  75. package/dist/components/chat/CodeBlock.mjs +8 -482
  76. package/dist/components/chat/CodeBlock.mjs.map +1 -1
  77. package/dist/components/chat/Header.mjs +6 -23
  78. package/dist/components/chat/Header.mjs.map +1 -1
  79. package/dist/components/chat/Icons.mjs +16 -271
  80. package/dist/components/chat/Icons.mjs.map +1 -1
  81. package/dist/components/chat/Input.js +4 -2
  82. package/dist/components/chat/Input.js.map +1 -1
  83. package/dist/components/chat/Input.mjs +8 -255
  84. package/dist/components/chat/Input.mjs.map +1 -1
  85. package/dist/components/chat/Markdown.js +2 -1
  86. package/dist/components/chat/Markdown.js.map +1 -1
  87. package/dist/components/chat/Markdown.mjs +7 -546
  88. package/dist/components/chat/Markdown.mjs.map +1 -1
  89. package/dist/components/chat/Messages.js +2 -1
  90. package/dist/components/chat/Messages.js.map +1 -1
  91. package/dist/components/chat/Messages.mjs +8 -723
  92. package/dist/components/chat/Messages.mjs.map +1 -1
  93. package/dist/components/chat/Modal.d.ts +1 -1
  94. package/dist/components/chat/Modal.js +6 -3
  95. package/dist/components/chat/Modal.js.map +1 -1
  96. package/dist/components/chat/Modal.mjs +22 -2052
  97. package/dist/components/chat/Modal.mjs.map +1 -1
  98. package/dist/components/chat/Popup.js +6 -3
  99. package/dist/components/chat/Popup.js.map +1 -1
  100. package/dist/components/chat/Popup.mjs +23 -2061
  101. package/dist/components/chat/Popup.mjs.map +1 -1
  102. package/dist/components/chat/Response.mjs +6 -23
  103. package/dist/components/chat/Response.mjs.map +1 -1
  104. package/dist/components/chat/Sidebar.js +6 -3
  105. package/dist/components/chat/Sidebar.js.map +1 -1
  106. package/dist/components/chat/Sidebar.mjs +23 -2072
  107. package/dist/components/chat/Sidebar.mjs.map +1 -1
  108. package/dist/components/chat/Suggestion.js.map +1 -1
  109. package/dist/components/chat/Suggestion.mjs +5 -152
  110. package/dist/components/chat/Suggestion.mjs.map +1 -1
  111. package/dist/components/chat/Textarea.js.map +1 -1
  112. package/dist/components/chat/Textarea.mjs +4 -48
  113. package/dist/components/chat/Textarea.mjs.map +1 -1
  114. package/dist/components/chat/Window.js.map +1 -1
  115. package/dist/components/chat/Window.mjs +6 -125
  116. package/dist/components/chat/Window.mjs.map +1 -1
  117. package/dist/components/chat/index.js +6 -3
  118. package/dist/components/chat/index.js.map +1 -1
  119. package/dist/components/chat/index.mjs +31 -2078
  120. package/dist/components/chat/index.mjs.map +1 -1
  121. package/dist/components/chat/props.d.ts +1 -1
  122. package/dist/components/chat/props.mjs +1 -0
  123. package/dist/components/dev-console/console.js.map +1 -1
  124. package/dist/components/dev-console/console.mjs +8 -478
  125. package/dist/components/dev-console/console.mjs.map +1 -1
  126. package/dist/components/dev-console/icons.mjs +8 -83
  127. package/dist/components/dev-console/icons.mjs.map +1 -1
  128. package/dist/components/dev-console/index.js.map +1 -1
  129. package/dist/components/dev-console/index.mjs +10 -476
  130. package/dist/components/dev-console/index.mjs.map +1 -1
  131. package/dist/components/dev-console/types.d.ts +1 -1
  132. package/dist/components/dev-console/utils.js.map +1 -1
  133. package/dist/components/dev-console/utils.mjs +8 -154
  134. package/dist/components/dev-console/utils.mjs.map +1 -1
  135. package/dist/components/index.js +6 -3
  136. package/dist/components/index.js.map +1 -1
  137. package/dist/components/index.mjs +32 -2078
  138. package/dist/components/index.mjs.map +1 -1
  139. package/dist/context/index.d.ts +1 -1
  140. package/dist/context/index.mjs +1 -0
  141. package/dist/hooks/index.mjs +5 -24
  142. package/dist/hooks/index.mjs.map +1 -1
  143. package/dist/hooks/use-copilot-chat-suggestions.mjs +4 -24
  144. package/dist/hooks/use-copilot-chat-suggestions.mjs.map +1 -1
  145. package/dist/hooks/use-copy-to-clipboard.d.ts +1 -1
  146. package/dist/hooks/use-copy-to-clipboard.mjs +4 -21
  147. package/dist/hooks/use-copy-to-clipboard.mjs.map +1 -1
  148. package/dist/hooks/use-push-to-talk.d.ts +1 -1
  149. package/dist/hooks/use-push-to-talk.js.map +1 -1
  150. package/dist/hooks/use-push-to-talk.mjs +6 -148
  151. package/dist/hooks/use-push-to-talk.mjs.map +1 -1
  152. package/dist/index.css +747 -1
  153. package/dist/index.css.map +1 -0
  154. package/dist/index.js +6 -10
  155. package/dist/index.js.map +1 -1
  156. package/dist/index.mjs +38 -2110
  157. package/dist/index.mjs.map +1 -1
  158. package/dist/lib/utils.mjs +3 -20
  159. package/dist/lib/utils.mjs.map +1 -1
  160. package/dist/lib/utils.test.d.ts +1 -1
  161. package/dist/types/css.d.ts +1 -1
  162. package/dist/types/index.mjs +1 -0
  163. package/dist/types/suggestions.d.ts +1 -1
  164. package/package.json +11 -19
  165. package/src/components/chat/Chat.tsx +4 -1
  166. package/src/components/chat/Popup.tsx +4 -1
  167. package/src/components/chat/Sidebar.tsx +3 -1
  168. package/tsup.config.ts +15 -59
  169. package/dist/components/chat/Button.d.mts +0 -7
  170. package/dist/components/chat/Chat.d.mts +0 -87
  171. package/dist/components/chat/ChatContext.d.mts +0 -105
  172. package/dist/components/chat/CodeBlock.d.mts +0 -14
  173. package/dist/components/chat/Header.d.mts +0 -7
  174. package/dist/components/chat/Icons.d.mts +0 -18
  175. package/dist/components/chat/Input.d.mts +0 -7
  176. package/dist/components/chat/Markdown.d.mts +0 -8
  177. package/dist/components/chat/Messages.d.mts +0 -7
  178. package/dist/components/chat/Modal.d.mts +0 -51
  179. package/dist/components/chat/Popup.d.mts +0 -13
  180. package/dist/components/chat/Response.d.mts +0 -7
  181. package/dist/components/chat/Sidebar.d.mts +0 -13
  182. package/dist/components/chat/Suggestion.d.mts +0 -14
  183. package/dist/components/chat/Textarea.d.mts +0 -13
  184. package/dist/components/chat/Window.d.mts +0 -7
  185. package/dist/components/chat/index.d.mts +0 -11
  186. package/dist/components/chat/props.d.mts +0 -35
  187. package/dist/components/dev-console/console.d.mts +0 -10
  188. package/dist/components/dev-console/icons.d.mts +0 -9
  189. package/dist/components/dev-console/index.d.mts +0 -5
  190. package/dist/components/dev-console/types.d.mts +0 -9
  191. package/dist/components/dev-console/utils.d.mts +0 -10
  192. package/dist/components/index.d.mts +0 -11
  193. package/dist/context/index.d.mts +0 -2
  194. package/dist/hooks/index.d.mts +0 -1
  195. package/dist/hooks/use-copilot-chat-suggestions.d.mts +0 -83
  196. package/dist/hooks/use-copy-to-clipboard.d.mts +0 -9
  197. package/dist/hooks/use-push-to-talk.d.mts +0 -19
  198. package/dist/index.d.mts +0 -13
  199. package/dist/lib/utils.d.mts +0 -4
  200. package/dist/lib/utils.test.d.mts +0 -2
  201. package/dist/types/css.d.mts +0 -16
  202. package/dist/types/index.d.mts +0 -2
  203. package/dist/types/suggestions.d.mts +0 -8
package/CHANGELOG.md CHANGED
@@ -1,5 +1,15 @@
1
1
  # ui
2
2
 
3
+ ## 1.3.1
4
+
5
+ ### Patch Changes
6
+
7
+ - Revert CSS injection
8
+ - Updated dependencies
9
+ - @copilotkit/react-core@1.3.1
10
+ - @copilotkit/runtime-client-gql@1.3.1
11
+ - @copilotkit/shared@1.3.1
12
+
3
13
  ## 1.3.0
4
14
 
5
15
  ### Minor Changes
@@ -0,0 +1,26 @@
1
+ // src/hooks/use-copy-to-clipboard.tsx
2
+ import * as React from "react";
3
+ function useCopyToClipboard({ timeout = 2e3 }) {
4
+ const [isCopied, setIsCopied] = React.useState(false);
5
+ const copyToClipboard = (value) => {
6
+ var _a;
7
+ if (typeof window === "undefined" || !((_a = navigator.clipboard) == null ? void 0 : _a.writeText)) {
8
+ return;
9
+ }
10
+ if (!value) {
11
+ return;
12
+ }
13
+ navigator.clipboard.writeText(value).then(() => {
14
+ setIsCopied(true);
15
+ setTimeout(() => {
16
+ setIsCopied(false);
17
+ }, timeout);
18
+ });
19
+ };
20
+ return { isCopied, copyToClipboard };
21
+ }
22
+
23
+ export {
24
+ useCopyToClipboard
25
+ };
26
+ //# sourceMappingURL=chunk-54JAUBUJ.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/hooks/use-copy-to-clipboard.tsx"],"sourcesContent":["import * as React from \"react\";\n\nexport interface useCopyToClipboardProps {\n timeout?: number;\n}\n\nexport function useCopyToClipboard({ timeout = 2000 }: useCopyToClipboardProps) {\n const [isCopied, setIsCopied] = React.useState<Boolean>(false);\n\n const copyToClipboard = (value: string) => {\n if (typeof window === \"undefined\" || !navigator.clipboard?.writeText) {\n return;\n }\n\n if (!value) {\n return;\n }\n\n navigator.clipboard.writeText(value).then(() => {\n setIsCopied(true);\n\n setTimeout(() => {\n setIsCopied(false);\n }, timeout);\n });\n };\n\n return { isCopied, copyToClipboard };\n}\n"],"mappings":";AAAA,YAAY,WAAW;AAMhB,SAAS,mBAAmB,EAAE,UAAU,IAAK,GAA4B;AAC9E,QAAM,CAAC,UAAU,WAAW,IAAU,eAAkB,KAAK;AAE7D,QAAM,kBAAkB,CAAC,UAAkB;AAT7C;AAUI,QAAI,OAAO,WAAW,eAAe,GAAC,eAAU,cAAV,mBAAqB,YAAW;AACpE;AAAA,IACF;AAEA,QAAI,CAAC,OAAO;AACV;AAAA,IACF;AAEA,cAAU,UAAU,UAAU,KAAK,EAAE,KAAK,MAAM;AAC9C,kBAAY,IAAI;AAEhB,iBAAW,MAAM;AACf,oBAAY,KAAK;AAAA,MACnB,GAAG,OAAO;AAAA,IACZ,CAAC;AAAA,EACH;AAEA,SAAO,EAAE,UAAU,gBAAgB;AACrC;","names":[]}
@@ -0,0 +1,29 @@
1
+ // src/hooks/use-copilot-chat-suggestions.tsx
2
+ import { useEffect } from "react";
3
+ import { useCopilotContext } from "@copilotkit/react-core";
4
+ import { randomId } from "@copilotkit/shared";
5
+ function useCopilotChatSuggestions({
6
+ instructions,
7
+ className,
8
+ minSuggestions = 1,
9
+ maxSuggestions = 3
10
+ }, dependencies = []) {
11
+ const context = useCopilotContext();
12
+ useEffect(() => {
13
+ const id = randomId();
14
+ context.addChatSuggestionConfiguration(id, {
15
+ instructions,
16
+ minSuggestions,
17
+ maxSuggestions,
18
+ className
19
+ });
20
+ return () => {
21
+ context.removeChatSuggestionConfiguration(id);
22
+ };
23
+ }, dependencies);
24
+ }
25
+
26
+ export {
27
+ useCopilotChatSuggestions
28
+ };
29
+ //# sourceMappingURL=chunk-5HHVL5WK.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/hooks/use-copilot-chat-suggestions.tsx"],"sourcesContent":["/**\n * <Callout type=\"warning\">\n * useCopilotChatSuggestions is experimental. The interface is not final and\n * can change without notice.\n * </Callout>\n *\n * `useCopilotReadable` is a React hook that provides app-state and other information\n * to the Copilot. Optionally, the hook can also handle hierarchical state within your\n * application, passing these parent-child relationships to the Copilot.\n *\n * <br/>\n * <img src=\"/images/use-copilot-chat-suggestions/use-copilot-chat-suggestions.gif\" width=\"500\" />\n *\n * ## Usage\n *\n * ### Install Dependencies\n *\n * This component is part of the [@copilotkit/react-ui](https://npmjs.com/package/@copilotkit/react-ui) package.\n *\n * ```shell npm2yarn \\\"@copilotkit/react-ui\"\\\n * npm install @copilotkit/react-core @copilotkit/react-ui\n * ```\n *\n * ### Simple Usage\n *\n * ```tsx\n * import { useCopilotChatSuggestions } from \"@copilotkit/react-ui\";\n *\n * export function MyComponent() {\n * const [employees, setEmployees] = useState([]);\n *\n * useCopilotChatSuggestions({\n * instructions: `The following employees are on duty: ${JSON.stringify(employees)}`,\n * });\n * }\n * ```\n *\n * ### Dependency Management\n *\n * ```tsx\n * import { useCopilotChatSuggestions } from \"@copilotkit/react-ui\";\n *\n * export function MyComponent() {\n * useCopilotChatSuggestions(\n * {\n * instructions: \"Suggest the most relevant next actions.\",\n * },\n * [appState],\n * );\n * }\n * ```\n *\n * In the example above, the suggestions are generated based on the given instructions.\n * The hook monitors `appState`, and updates suggestions accordingly whenever it changes.\n *\n * ### Behavior and Lifecycle\n *\n * The hook registers the configuration with the chat context upon component mount and\n * removes it on unmount, ensuring a clean and efficient lifecycle management.\n */\n\nimport { useEffect } from \"react\";\nimport { useCopilotContext } from \"@copilotkit/react-core\";\nimport { randomId } from \"@copilotkit/shared\";\n\ninterface UseCopilotChatSuggestionsConfiguration {\n /**\n * A prompt or instructions for the GPT to generate suggestions.\n */\n instructions: string;\n /**\n * The minimum number of suggestions to generate. Defaults to `1`.\n * @default 1\n */\n minSuggestions?: number;\n /**\n * The maximum number of suggestions to generate. Defaults to `3`.\n * @default 1\n */\n maxSuggestions?: number;\n /**\n * An optional class name to apply to the suggestions.\n */\n className?: string;\n}\n\nexport function useCopilotChatSuggestions(\n {\n instructions,\n className,\n minSuggestions = 1,\n maxSuggestions = 3,\n }: UseCopilotChatSuggestionsConfiguration,\n dependencies: any[] = [],\n) {\n const context = useCopilotContext();\n\n useEffect(() => {\n const id = randomId();\n\n context.addChatSuggestionConfiguration(id, {\n instructions,\n minSuggestions,\n maxSuggestions,\n className,\n });\n\n return () => {\n context.removeChatSuggestionConfiguration(id);\n };\n }, dependencies);\n}\n"],"mappings":";AA6DA,SAAS,iBAAiB;AAC1B,SAAS,yBAAyB;AAClC,SAAS,gBAAgB;AAuBlB,SAAS,0BACd;AAAA,EACE;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB,iBAAiB;AACnB,GACA,eAAsB,CAAC,GACvB;AACA,QAAM,UAAU,kBAAkB;AAElC,YAAU,MAAM;AACd,UAAM,KAAK,SAAS;AAEpB,YAAQ,+BAA+B,IAAI;AAAA,MACzC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAED,WAAO,MAAM;AACX,cAAQ,kCAAkC,EAAE;AAAA,IAC9C;AAAA,EACF,GAAG,YAAY;AACjB;","names":[]}
@@ -0,0 +1,91 @@
1
+ import {
2
+ Window
3
+ } from "./chunk-FO7Z5LAL.mjs";
4
+ import {
5
+ Header
6
+ } from "./chunk-FLV3J3VX.mjs";
7
+ import {
8
+ Button
9
+ } from "./chunk-YOH25I6N.mjs";
10
+ import {
11
+ CopilotChat
12
+ } from "./chunk-HR36Y2FQ.mjs";
13
+ import {
14
+ Input
15
+ } from "./chunk-U6J5DGOE.mjs";
16
+ import {
17
+ Messages
18
+ } from "./chunk-FOZVHL73.mjs";
19
+ import {
20
+ ResponseButton
21
+ } from "./chunk-XSUSSWDS.mjs";
22
+ import {
23
+ ChatContextProvider
24
+ } from "./chunk-BJPGMY3I.mjs";
25
+
26
+ // src/components/chat/Modal.tsx
27
+ import React from "react";
28
+ import { jsx, jsxs } from "react/jsx-runtime";
29
+ var CopilotModal = ({
30
+ instructions,
31
+ defaultOpen = false,
32
+ clickOutsideToClose = true,
33
+ hitEscapeToClose = true,
34
+ onSetOpen,
35
+ onSubmitMessage,
36
+ shortcut = "/",
37
+ icons,
38
+ labels,
39
+ makeSystemMessage,
40
+ showResponseButton = true,
41
+ onInProgress,
42
+ Window: Window2 = Window,
43
+ Button: Button2 = Button,
44
+ Header: Header2 = Header,
45
+ Messages: Messages2 = Messages,
46
+ Input: Input2 = Input,
47
+ ResponseButton: ResponseButton2 = ResponseButton,
48
+ className,
49
+ children
50
+ }) => {
51
+ const [openState, setOpenState] = React.useState(defaultOpen);
52
+ const setOpen = (open) => {
53
+ onSetOpen == null ? void 0 : onSetOpen(open);
54
+ setOpenState(open);
55
+ };
56
+ return /* @__PURE__ */ jsxs(ChatContextProvider, { icons, labels, open: openState, setOpen, children: [
57
+ children,
58
+ /* @__PURE__ */ jsxs("div", { className, children: [
59
+ /* @__PURE__ */ jsx(Button2, {}),
60
+ /* @__PURE__ */ jsxs(
61
+ Window2,
62
+ {
63
+ clickOutsideToClose,
64
+ shortcut,
65
+ hitEscapeToClose,
66
+ children: [
67
+ /* @__PURE__ */ jsx(Header2, {}),
68
+ /* @__PURE__ */ jsx(
69
+ CopilotChat,
70
+ {
71
+ instructions,
72
+ onSubmitMessage,
73
+ makeSystemMessage,
74
+ showResponseButton,
75
+ onInProgress,
76
+ Messages: Messages2,
77
+ Input: Input2,
78
+ ResponseButton: ResponseButton2
79
+ }
80
+ )
81
+ ]
82
+ }
83
+ )
84
+ ] })
85
+ ] });
86
+ };
87
+
88
+ export {
89
+ CopilotModal
90
+ };
91
+ //# sourceMappingURL=chunk-B2KQEX2R.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/chat/Modal.tsx"],"sourcesContent":["import React from \"react\";\nimport { ChatContextProvider } from \"./ChatContext\";\nimport { ButtonProps, HeaderProps, WindowProps } 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 { ResponseButton as DefaultResponseButton } from \"./Response\";\nimport { CopilotChat, CopilotChatProps } from \"./Chat\";\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\nexport const CopilotModal = ({\n instructions,\n defaultOpen = false,\n clickOutsideToClose = true,\n hitEscapeToClose = true,\n onSetOpen,\n onSubmitMessage,\n shortcut = \"/\",\n icons,\n labels,\n makeSystemMessage,\n showResponseButton = true,\n onInProgress,\n Window = DefaultWindow,\n Button = DefaultButton,\n Header = DefaultHeader,\n Messages = DefaultMessages,\n Input = DefaultInput,\n ResponseButton = DefaultResponseButton,\n className,\n children,\n}: CopilotModalProps) => {\n const [openState, setOpenState] = React.useState(defaultOpen);\n\n const setOpen = (open: boolean) => {\n onSetOpen?.(open);\n setOpenState(open);\n };\n\n return (\n <ChatContextProvider icons={icons} labels={labels} open={openState} setOpen={setOpen}>\n {children}\n <div className={className}>\n <Button></Button>\n <Window\n clickOutsideToClose={clickOutsideToClose}\n shortcut={shortcut}\n hitEscapeToClose={hitEscapeToClose}\n >\n <Header />\n <CopilotChat\n instructions={instructions}\n onSubmitMessage={onSubmitMessage}\n makeSystemMessage={makeSystemMessage}\n showResponseButton={showResponseButton}\n onInProgress={onInProgress}\n Messages={Messages}\n Input={Input}\n ResponseButton={ResponseButton}\n />\n </Window>\n </div>\n </ChatContextProvider>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,WAAW;AA2FV,cACA,YADA;AAjCD,IAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA,cAAc;AAAA,EACd,sBAAsB;AAAA,EACtB,mBAAmB;AAAA,EACnB;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA,qBAAqB;AAAA,EACrB;AAAA,EACA,QAAAA,UAAS;AAAA,EACT,QAAAC,UAAS;AAAA,EACT,QAAAC,UAAS;AAAA,EACT,UAAAC,YAAW;AAAA,EACX,OAAAC,SAAQ;AAAA,EACR,gBAAAC,kBAAiB;AAAA,EACjB;AAAA,EACA;AACF,MAAyB;AACvB,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,WAAW;AAE5D,QAAM,UAAU,CAAC,SAAkB;AACjC,2CAAY;AACZ,iBAAa,IAAI;AAAA,EACnB;AAEA,SACE,qBAAC,uBAAoB,OAAc,QAAgB,MAAM,WAAW,SACjE;AAAA;AAAA,IACD,qBAAC,SAAI,WACH;AAAA,0BAACJ,SAAA,EAAO;AAAA,MACR;AAAA,QAACD;AAAA,QAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UAEA;AAAA,gCAACE,SAAA,EAAO;AAAA,YACR;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA,UAAUC;AAAA,gBACV,OAAOC;AAAA,gBACP,gBAAgBC;AAAA;AAAA,YAClB;AAAA;AAAA;AAAA,MACF;AAAA,OACF;AAAA,KACF;AAEJ;","names":["Window","Button","Header","Messages","Input","ResponseButton"]}
@@ -0,0 +1,70 @@
1
+ import {
2
+ ActivityIcon,
3
+ CloseIcon,
4
+ HeaderCloseIcon,
5
+ OpenIcon,
6
+ PushToTalkIcon,
7
+ RegenerateIcon,
8
+ SendIcon,
9
+ SpinnerIcon,
10
+ StopIcon
11
+ } from "./chunk-FZC7X5PK.mjs";
12
+ import {
13
+ __spreadValues
14
+ } from "./chunk-MRXNTQOX.mjs";
15
+
16
+ // src/components/chat/ChatContext.tsx
17
+ import React from "react";
18
+ import { jsx } from "react/jsx-runtime";
19
+ var ChatContext = React.createContext(void 0);
20
+ function useChatContext() {
21
+ const context = React.useContext(ChatContext);
22
+ if (context === void 0) {
23
+ throw new Error(
24
+ "Context not found. Did you forget to wrap your app in a <ChatContextProvider> component?"
25
+ );
26
+ }
27
+ return context;
28
+ }
29
+ var ChatContextProvider = ({
30
+ // temperature,
31
+ // instructions,
32
+ // maxFeedback,
33
+ labels,
34
+ icons,
35
+ children,
36
+ open,
37
+ setOpen
38
+ }) => {
39
+ const context = {
40
+ labels: __spreadValues(__spreadValues({}, {
41
+ initial: "",
42
+ title: "CopilotKit",
43
+ placeholder: "Type a message...",
44
+ error: "\u274C An error occurred. Please try again.",
45
+ stopGenerating: "Stop generating",
46
+ regenerateResponse: "Regenerate response"
47
+ }), labels),
48
+ icons: __spreadValues(__spreadValues({}, {
49
+ openIcon: OpenIcon,
50
+ closeIcon: CloseIcon,
51
+ headerCloseIcon: HeaderCloseIcon,
52
+ sendIcon: SendIcon,
53
+ activityIcon: ActivityIcon,
54
+ spinnerIcon: SpinnerIcon,
55
+ stopIcon: StopIcon,
56
+ regenerateIcon: RegenerateIcon,
57
+ pushToTalkIcon: PushToTalkIcon
58
+ }), icons),
59
+ open,
60
+ setOpen
61
+ };
62
+ return /* @__PURE__ */ jsx(ChatContext.Provider, { value: context, children });
63
+ };
64
+
65
+ export {
66
+ ChatContext,
67
+ useChatContext,
68
+ ChatContextProvider
69
+ };
70
+ //# sourceMappingURL=chunk-BJPGMY3I.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/chat/ChatContext.tsx"],"sourcesContent":["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":";;;;;;;;;;;;;;;;AAAA,OAAO,WAAkC;AA6KhC;AA/DF,IAAM,cAAc,MAAM,cAAuC,MAAS;AAE1E,SAAS,iBAA8B;AAC5C,QAAM,UAAU,MAAM,WAAW,WAAW;AAC5C,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAaO,IAAM,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA,EAIlC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAwB;AACtB,QAAM,UAAU;AAAA,IACd,QAAQ,kCACH;AAAA,MACD,SAAS;AAAA,MACT,OAAO;AAAA,MACP,aAAa;AAAA,MACb,OAAO;AAAA,MACP,gBAAgB;AAAA,MAChB,oBAAoB;AAAA,IACtB,IACG;AAAA,IAGL,OAAO,kCACF;AAAA,MACD,UAAuB;AAAA,MACvB,WAAwB;AAAA,MACxB,iBAA8B;AAAA,MAC9B,UAAuB;AAAA,MACvB,cAA2B;AAAA,MAC3B,aAA0B;AAAA,MAC1B,UAAuB;AAAA,MACvB,gBAA6B;AAAA,MAC7B,gBAA6B;AAAA,IAC/B,IACG;AAAA,IAEL;AAAA,IACA;AAAA,EACF;AACA,SAAO,oBAAC,YAAY,UAAZ,EAAqB,OAAO,SAAU,UAAS;AACzD;","names":[]}
@@ -0,0 +1 @@
1
+ //# sourceMappingURL=chunk-EFZPSZWO.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
@@ -0,0 +1,21 @@
1
+ import {
2
+ CopilotModal
3
+ } from "./chunk-B2KQEX2R.mjs";
4
+ import {
5
+ __spreadProps,
6
+ __spreadValues
7
+ } from "./chunk-MRXNTQOX.mjs";
8
+
9
+ // src/components/chat/Popup.tsx
10
+ import { jsx } from "react/jsx-runtime";
11
+ function CopilotPopup(props) {
12
+ props = __spreadProps(__spreadValues({}, props), {
13
+ className: props.className ? props.className + " copilotKitPopup" : "copilotKitPopup"
14
+ });
15
+ return /* @__PURE__ */ jsx(CopilotModal, __spreadProps(__spreadValues({}, props), { children: props.children }));
16
+ }
17
+
18
+ export {
19
+ CopilotPopup
20
+ };
21
+ //# sourceMappingURL=chunk-FL4ETWFB.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/chat/Popup.tsx"],"sourcesContent":["/**\n * <br/>\n * <img src=\"/images/CopilotPopup.gif\" width=\"500\" />\n *\n * A chatbot popup component for the CopilotKit framework. The component allows for a high degree\n * of customization through various props and custom CSS.\n *\n * See [CopilotSidebar](/reference/components/CopilotSidebar) for a sidebar version of this component.\n *\n * ## Install Dependencies\n *\n * This component is part of the [@copilotkit/react-ui](https://npmjs.com/package/@copilotkit/react-ui) package.\n *\n * ```shell npm2yarn \\\"@copilotkit/react-ui\"\\\n * npm install @copilotkit/react-core @copilotkit/react-ui\n * ```\n * ## Usage\n *\n * ```tsx\n * import { CopilotPopup } from \"@copilotkit/react-ui\";\n * import \"@copilotkit/react-ui/styles.css\";\n *\n * <CopilotPopup\n * labels={{\n * title: \"Your Assistant\",\n * initial: \"Hi! 👋 How can I assist you today?\",\n * }}\n * />\n * ```\n *\n * ### Look & Feel\n *\n * By default, CopilotKit components do not have any styles. You can import CopilotKit's stylesheet at the root of your project:\n * ```tsx fileName=\"YourRootComponent.tsx\" {2}\n * ...\n * import \"@copilotkit/react-ui/styles.css\";\n *\n * export function YourRootComponent() {\n * return (\n * <CopilotKit>\n * ...\n * </CopilotKit>\n * );\n * }\n * ```\n * For more information about how to customize the styles, check out the [Customize Look & Feel](/concepts/customize-look-and-feel) guide.\n */\n\nimport { CopilotModal, CopilotModalProps } from \"./Modal\";\n\nexport function CopilotPopup(props: CopilotModalProps) {\n props = {\n ...props,\n className: props.className ? props.className + \" copilotKitPopup\" : \"copilotKitPopup\",\n };\n return <CopilotModal {...props}>{props.children}</CopilotModal>;\n}\n"],"mappings":";;;;;;;;;AAuDS;AALF,SAAS,aAAa,OAA0B;AACrD,UAAQ,iCACH,QADG;AAAA,IAEN,WAAW,MAAM,YAAY,MAAM,YAAY,qBAAqB;AAAA,EACtE;AACA,SAAO,oBAAC,+CAAiB,QAAjB,EAAyB,gBAAM,WAAS;AAClD;","names":[]}
@@ -0,0 +1,18 @@
1
+ import {
2
+ useChatContext
3
+ } from "./chunk-BJPGMY3I.mjs";
4
+
5
+ // src/components/chat/Header.tsx
6
+ import { jsx, jsxs } from "react/jsx-runtime";
7
+ var Header = ({}) => {
8
+ const { setOpen, icons, labels } = useChatContext();
9
+ return /* @__PURE__ */ jsxs("div", { className: "copilotKitHeader", children: [
10
+ /* @__PURE__ */ jsx("div", { children: labels.title }),
11
+ /* @__PURE__ */ jsx("button", { onClick: () => setOpen(false), "aria-label": "Close", children: icons.headerCloseIcon })
12
+ ] });
13
+ };
14
+
15
+ export {
16
+ Header
17
+ };
18
+ //# sourceMappingURL=chunk-FLV3J3VX.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/chat/Header.tsx"],"sourcesContent":["import { HeaderProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\n\nexport const Header = ({}: HeaderProps) => {\n const { setOpen, icons, labels } = useChatContext();\n\n return (\n <div className=\"copilotKitHeader\">\n <div>{labels.title}</div>\n <button onClick={() => setOpen(false)} aria-label=\"Close\">\n {icons.headerCloseIcon}\n </button>\n </div>\n );\n};\n"],"mappings":";;;;;AAOI,SACE,KADF;AAJG,IAAM,SAAS,CAAC,CAAC,MAAmB;AACzC,QAAM,EAAE,SAAS,OAAO,OAAO,IAAI,eAAe;AAElD,SACE,qBAAC,SAAI,WAAU,oBACb;AAAA,wBAAC,SAAK,iBAAO,OAAM;AAAA,IACnB,oBAAC,YAAO,SAAS,MAAM,QAAQ,KAAK,GAAG,cAAW,SAC/C,gBAAM,iBACT;AAAA,KACF;AAEJ;","names":[]}
@@ -0,0 +1,118 @@
1
+ import {
2
+ useChatContext
3
+ } from "./chunk-BJPGMY3I.mjs";
4
+
5
+ // src/components/chat/Window.tsx
6
+ import React, { useCallback, useEffect } from "react";
7
+ import { jsx } from "react/jsx-runtime";
8
+ var Window = ({
9
+ children,
10
+ clickOutsideToClose,
11
+ shortcut,
12
+ hitEscapeToClose
13
+ }) => {
14
+ const windowRef = React.useRef(null);
15
+ const { open, setOpen } = useChatContext();
16
+ const handleClickOutside = useCallback(
17
+ (event) => {
18
+ var _a;
19
+ if (!clickOutsideToClose) {
20
+ return;
21
+ }
22
+ const parentElement = (_a = windowRef.current) == null ? void 0 : _a.parentElement;
23
+ let className = "";
24
+ if (event.target instanceof HTMLElement) {
25
+ className = event.target.className;
26
+ }
27
+ if (open && parentElement && !parentElement.contains(event.target) && // prevent closing the window when clicking on the debug menu
28
+ !className.includes("copilotKitDebugMenu")) {
29
+ setOpen(false);
30
+ }
31
+ },
32
+ [clickOutsideToClose, open, setOpen]
33
+ );
34
+ const handleKeyDown = useCallback(
35
+ (event) => {
36
+ var _a;
37
+ const target = event.target;
38
+ const isInput = target.tagName === "INPUT" || target.tagName === "SELECT" || target.tagName === "TEXTAREA" || target.isContentEditable;
39
+ const isDescendantOfWrapper = (_a = windowRef.current) == null ? void 0 : _a.contains(target);
40
+ if (open && event.key === "Escape" && (!isInput || isDescendantOfWrapper) && hitEscapeToClose) {
41
+ setOpen(false);
42
+ } else if (event.key === shortcut && (isMacOS() && event.metaKey || !isMacOS() && event.ctrlKey) && (!isInput || isDescendantOfWrapper)) {
43
+ setOpen(!open);
44
+ }
45
+ },
46
+ [hitEscapeToClose, shortcut, open, setOpen]
47
+ );
48
+ const adjustForMobile = useCallback(() => {
49
+ const copilotKitWindow = windowRef.current;
50
+ const vv = window.visualViewport;
51
+ if (!copilotKitWindow || !vv) {
52
+ return;
53
+ }
54
+ if (window.innerWidth < 640 && open) {
55
+ copilotKitWindow.style.height = `${vv.height}px`;
56
+ copilotKitWindow.style.left = `${vv.offsetLeft}px`;
57
+ copilotKitWindow.style.top = `${vv.offsetTop}px`;
58
+ document.body.style.position = "fixed";
59
+ document.body.style.width = "100%";
60
+ document.body.style.height = `${window.innerHeight}px`;
61
+ document.body.style.overflow = "hidden";
62
+ document.body.style.touchAction = "none";
63
+ document.body.addEventListener("touchmove", preventScroll, {
64
+ passive: false
65
+ });
66
+ } else {
67
+ copilotKitWindow.style.height = "";
68
+ copilotKitWindow.style.left = "";
69
+ copilotKitWindow.style.top = "";
70
+ document.body.style.position = "";
71
+ document.body.style.height = "";
72
+ document.body.style.width = "";
73
+ document.body.style.overflow = "";
74
+ document.body.style.top = "";
75
+ document.body.style.touchAction = "";
76
+ document.body.removeEventListener("touchmove", preventScroll);
77
+ }
78
+ }, [open]);
79
+ useEffect(() => {
80
+ document.addEventListener("mousedown", handleClickOutside);
81
+ document.addEventListener("keydown", handleKeyDown);
82
+ if (window.visualViewport) {
83
+ window.visualViewport.addEventListener("resize", adjustForMobile);
84
+ adjustForMobile();
85
+ }
86
+ return () => {
87
+ document.removeEventListener("mousedown", handleClickOutside);
88
+ document.removeEventListener("keydown", handleKeyDown);
89
+ if (window.visualViewport) {
90
+ window.visualViewport.removeEventListener("resize", adjustForMobile);
91
+ }
92
+ };
93
+ }, [adjustForMobile, handleClickOutside, handleKeyDown]);
94
+ return /* @__PURE__ */ jsx("div", { className: `copilotKitWindow${open ? " open" : ""}`, ref: windowRef, children });
95
+ };
96
+ var preventScroll = (event) => {
97
+ let targetElement = event.target;
98
+ const hasParentWithClass = (element, className) => {
99
+ while (element && element !== document.body) {
100
+ if (element.classList.contains(className)) {
101
+ return true;
102
+ }
103
+ element = element.parentElement;
104
+ }
105
+ return false;
106
+ };
107
+ if (!hasParentWithClass(targetElement, "copilotKitMessages")) {
108
+ event.preventDefault();
109
+ }
110
+ };
111
+ function isMacOS() {
112
+ return /Mac|iMac|Macintosh/i.test(navigator.userAgent);
113
+ }
114
+
115
+ export {
116
+ Window
117
+ };
118
+ //# sourceMappingURL=chunk-FO7Z5LAL.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/chat/Window.tsx"],"sourcesContent":["import React, { useCallback, useEffect } from \"react\";\nimport { WindowProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\n\nexport const Window = ({\n children,\n clickOutsideToClose,\n shortcut,\n hitEscapeToClose,\n}: WindowProps) => {\n const windowRef = React.useRef<HTMLDivElement>(null);\n\n const { open, setOpen } = useChatContext();\n\n const handleClickOutside = useCallback(\n (event: MouseEvent) => {\n if (!clickOutsideToClose) {\n return;\n }\n\n const parentElement = windowRef.current?.parentElement;\n\n let className = \"\";\n if (event.target instanceof HTMLElement) {\n className = event.target.className;\n }\n\n if (\n open &&\n parentElement &&\n !parentElement.contains(event.target as any) &&\n // prevent closing the window when clicking on the debug menu\n !className.includes(\"copilotKitDebugMenu\")\n ) {\n setOpen(false);\n }\n },\n [clickOutsideToClose, open, setOpen],\n );\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n const target = event.target as HTMLElement;\n const isInput =\n target.tagName === \"INPUT\" ||\n target.tagName === \"SELECT\" ||\n target.tagName === \"TEXTAREA\" ||\n target.isContentEditable;\n\n const isDescendantOfWrapper = windowRef.current?.contains(target);\n\n if (\n open &&\n event.key === \"Escape\" &&\n (!isInput || isDescendantOfWrapper) &&\n hitEscapeToClose\n ) {\n setOpen(false);\n } else if (\n event.key === shortcut &&\n ((isMacOS() && event.metaKey) || (!isMacOS() && event.ctrlKey)) &&\n (!isInput || isDescendantOfWrapper)\n ) {\n setOpen(!open);\n }\n },\n [hitEscapeToClose, shortcut, open, setOpen],\n );\n\n const adjustForMobile = useCallback(() => {\n const copilotKitWindow = windowRef.current;\n const vv = window.visualViewport;\n if (!copilotKitWindow || !vv) {\n return;\n }\n\n if (window.innerWidth < 640 && open) {\n copilotKitWindow.style.height = `${vv.height}px`;\n copilotKitWindow.style.left = `${vv.offsetLeft}px`;\n copilotKitWindow.style.top = `${vv.offsetTop}px`;\n\n document.body.style.position = \"fixed\";\n document.body.style.width = \"100%\";\n document.body.style.height = `${window.innerHeight}px`;\n document.body.style.overflow = \"hidden\";\n document.body.style.touchAction = \"none\";\n\n // Prevent scrolling on iOS\n document.body.addEventListener(\"touchmove\", preventScroll, {\n passive: false,\n });\n } else {\n copilotKitWindow.style.height = \"\";\n copilotKitWindow.style.left = \"\";\n copilotKitWindow.style.top = \"\";\n document.body.style.position = \"\";\n document.body.style.height = \"\";\n document.body.style.width = \"\";\n document.body.style.overflow = \"\";\n document.body.style.top = \"\";\n document.body.style.touchAction = \"\";\n\n document.body.removeEventListener(\"touchmove\", preventScroll);\n }\n }, [open]);\n\n useEffect(() => {\n document.addEventListener(\"mousedown\", handleClickOutside);\n document.addEventListener(\"keydown\", handleKeyDown);\n if (window.visualViewport) {\n window.visualViewport.addEventListener(\"resize\", adjustForMobile);\n adjustForMobile();\n }\n\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n document.removeEventListener(\"keydown\", handleKeyDown);\n if (window.visualViewport) {\n window.visualViewport.removeEventListener(\"resize\", adjustForMobile);\n }\n };\n }, [adjustForMobile, handleClickOutside, handleKeyDown]);\n\n return (\n <div className={`copilotKitWindow${open ? \" open\" : \"\"}`} ref={windowRef}>\n {children}\n </div>\n );\n};\n\nconst preventScroll = (event: TouchEvent): void => {\n let targetElement = event.target as Element;\n\n // Function to check if the target has the parent with a given class\n const hasParentWithClass = (element: Element, className: string): boolean => {\n while (element && element !== document.body) {\n if (element.classList.contains(className)) {\n return true;\n }\n element = element.parentElement!;\n }\n return false;\n };\n\n // Check if the target of the touch event is inside an element with the 'copilotKitMessages' class\n if (!hasParentWithClass(targetElement, \"copilotKitMessages\")) {\n event.preventDefault();\n }\n};\n\nfunction isMacOS() {\n return /Mac|iMac|Macintosh/i.test(navigator.userAgent);\n}\n"],"mappings":"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","names":[]}
@@ -0,0 +1,171 @@
1
+ import {
2
+ Markdown
3
+ } from "./chunk-YQ3D5IQV.mjs";
4
+ import {
5
+ useChatContext
6
+ } from "./chunk-BJPGMY3I.mjs";
7
+
8
+ // src/components/chat/Messages.tsx
9
+ import React, { useEffect, useMemo } from "react";
10
+ import { useCopilotContext } from "@copilotkit/react-core";
11
+ import {
12
+ MessageStatusCode,
13
+ ActionExecutionMessage,
14
+ ResultMessage,
15
+ TextMessage,
16
+ Role,
17
+ AgentStateMessage
18
+ } from "@copilotkit/runtime-client-gql";
19
+ import { jsx, jsxs } from "react/jsx-runtime";
20
+ var Messages = ({ messages, inProgress, children }) => {
21
+ const { chatComponentsCache } = useCopilotContext();
22
+ const context = useChatContext();
23
+ const initialMessages = useMemo(
24
+ () => makeInitialMessages(context.labels.initial),
25
+ [context.labels.initial]
26
+ );
27
+ messages = [...initialMessages, ...messages];
28
+ const functionResults = {};
29
+ for (let i = 0; i < messages.length; i++) {
30
+ if (messages[i] instanceof ActionExecutionMessage) {
31
+ const id = messages[i].id;
32
+ const resultMessage = messages.find(
33
+ (message) => message instanceof ResultMessage && message.actionExecutionId === id
34
+ );
35
+ if (resultMessage) {
36
+ functionResults[id] = ResultMessage.decodeResult(resultMessage.result || "");
37
+ }
38
+ }
39
+ }
40
+ const messagesEndRef = React.useRef(null);
41
+ const scrollToBottom = () => {
42
+ if (messagesEndRef.current) {
43
+ messagesEndRef.current.scrollIntoView({
44
+ behavior: "auto"
45
+ });
46
+ }
47
+ };
48
+ useEffect(() => {
49
+ scrollToBottom();
50
+ }, [messages]);
51
+ return /* @__PURE__ */ jsxs("div", { className: "copilotKitMessages", children: [
52
+ messages.map((message, index) => {
53
+ const isCurrentMessage = index === messages.length - 1;
54
+ if (message instanceof TextMessage && message.role === "user") {
55
+ return /* @__PURE__ */ jsx("div", { className: "copilotKitMessage copilotKitUserMessage", children: message.content }, index);
56
+ } else if (message instanceof TextMessage && message.role == "assistant") {
57
+ return /* @__PURE__ */ jsx("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: isCurrentMessage && inProgress && !message.content ? context.icons.spinnerIcon : /* @__PURE__ */ jsx(Markdown, { content: message.content }) }, index);
58
+ } else if (message instanceof ActionExecutionMessage) {
59
+ if (chatComponentsCache.current !== null && chatComponentsCache.current.actions[message.name]) {
60
+ const render = chatComponentsCache.current.actions[message.name];
61
+ if (typeof render === "string") {
62
+ if (isCurrentMessage && inProgress) {
63
+ return /* @__PURE__ */ jsxs("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: [
64
+ context.icons.spinnerIcon,
65
+ " ",
66
+ /* @__PURE__ */ jsx("span", { className: "inProgressLabel", children: render })
67
+ ] }, index);
68
+ } else {
69
+ return null;
70
+ }
71
+ } else {
72
+ const args = message.arguments;
73
+ let status = "inProgress";
74
+ if (functionResults[message.id] !== void 0) {
75
+ status = "complete";
76
+ } else if (message.status.code !== MessageStatusCode.Pending) {
77
+ status = "executing";
78
+ }
79
+ const toRender = render({
80
+ status,
81
+ args,
82
+ result: functionResults[message.id]
83
+ });
84
+ if (!toRender && status === "complete") {
85
+ return null;
86
+ }
87
+ if (typeof toRender === "string") {
88
+ return /* @__PURE__ */ jsxs("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: [
89
+ isCurrentMessage && inProgress && context.icons.spinnerIcon,
90
+ " ",
91
+ toRender
92
+ ] }, index);
93
+ } else {
94
+ return /* @__PURE__ */ jsx("div", { className: "copilotKitCustomAssistantMessage", children: toRender }, index);
95
+ }
96
+ }
97
+ } else if (!inProgress || !isCurrentMessage) {
98
+ return null;
99
+ } else {
100
+ return /* @__PURE__ */ jsx("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: context.icons.spinnerIcon }, index);
101
+ }
102
+ } else if (message instanceof AgentStateMessage) {
103
+ let render;
104
+ if (chatComponentsCache.current !== null) {
105
+ render = chatComponentsCache.current.coagentActions[`${message.agentName}-${message.nodeName}`] || chatComponentsCache.current.coagentActions[`${message.agentName}-global`];
106
+ }
107
+ if (render) {
108
+ if (typeof render === "string") {
109
+ if (isCurrentMessage && inProgress) {
110
+ return /* @__PURE__ */ jsxs("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: [
111
+ context.icons.spinnerIcon,
112
+ " ",
113
+ /* @__PURE__ */ jsx("span", { className: "inProgressLabel", children: render })
114
+ ] }, index);
115
+ } else {
116
+ return null;
117
+ }
118
+ } else {
119
+ const state = message.state;
120
+ let status = message.active ? "inProgress" : "complete";
121
+ const toRender = render({
122
+ status,
123
+ state,
124
+ nodeName: message.nodeName
125
+ });
126
+ if (!toRender && status === "complete") {
127
+ return null;
128
+ }
129
+ if (typeof toRender === "string") {
130
+ return /* @__PURE__ */ jsxs("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: [
131
+ isCurrentMessage && inProgress && context.icons.spinnerIcon,
132
+ " ",
133
+ toRender
134
+ ] }, index);
135
+ } else {
136
+ return /* @__PURE__ */ jsx("div", { className: "copilotKitCustomAssistantMessage", children: toRender }, index);
137
+ }
138
+ }
139
+ } else if (!inProgress || !isCurrentMessage) {
140
+ return null;
141
+ } else {
142
+ return /* @__PURE__ */ jsx("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: context.icons.spinnerIcon }, index);
143
+ }
144
+ } else if (message instanceof ResultMessage && inProgress && isCurrentMessage) {
145
+ return /* @__PURE__ */ jsx("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: context.icons.spinnerIcon }, index);
146
+ }
147
+ }),
148
+ /* @__PURE__ */ jsx("footer", { ref: messagesEndRef, children })
149
+ ] });
150
+ };
151
+ function makeInitialMessages(initial) {
152
+ let initialArray = [];
153
+ if (initial) {
154
+ if (Array.isArray(initial)) {
155
+ initialArray.push(...initial);
156
+ } else {
157
+ initialArray.push(initial);
158
+ }
159
+ }
160
+ return initialArray.map(
161
+ (message) => new TextMessage({
162
+ role: Role.Assistant,
163
+ content: message
164
+ })
165
+ );
166
+ }
167
+
168
+ export {
169
+ Messages
170
+ };
171
+ //# sourceMappingURL=chunk-FOZVHL73.mjs.map