@copilotkit/react-ui 1.4.0-pre-1-4-0-alpha.10 → 1.4.0-pre-1-4-0.14

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 (39) hide show
  1. package/CHANGELOG.md +190 -26
  2. package/dist/{chunk-QK6XA3PL.mjs → chunk-H5CXJBR5.mjs} +3 -3
  3. package/dist/{chunk-TEZWY2BL.mjs → chunk-M2NVAJQA.mjs} +2 -2
  4. package/dist/{chunk-C5KOJ3IH.mjs → chunk-ORHE7FYT.mjs} +2 -2
  5. package/dist/{chunk-OJ5NVSTU.mjs → chunk-PY7YBFPA.mjs} +2 -2
  6. package/dist/{chunk-CPMIEVKK.mjs → chunk-RKPANT3F.mjs} +65 -15
  7. package/dist/chunk-RKPANT3F.mjs.map +1 -0
  8. package/dist/components/chat/Chat.js +62 -13
  9. package/dist/components/chat/Chat.js.map +1 -1
  10. package/dist/components/chat/Chat.mjs +2 -2
  11. package/dist/components/chat/Messages.d.ts +6 -1
  12. package/dist/components/chat/Messages.js +66 -15
  13. package/dist/components/chat/Messages.js.map +1 -1
  14. package/dist/components/chat/Messages.mjs +5 -3
  15. package/dist/components/chat/Modal.js +62 -13
  16. package/dist/components/chat/Modal.js.map +1 -1
  17. package/dist/components/chat/Modal.mjs +3 -3
  18. package/dist/components/chat/Popup.js +62 -13
  19. package/dist/components/chat/Popup.js.map +1 -1
  20. package/dist/components/chat/Popup.mjs +4 -4
  21. package/dist/components/chat/Sidebar.js +62 -13
  22. package/dist/components/chat/Sidebar.js.map +1 -1
  23. package/dist/components/chat/Sidebar.mjs +4 -4
  24. package/dist/components/chat/index.js +62 -13
  25. package/dist/components/chat/index.js.map +1 -1
  26. package/dist/components/chat/index.mjs +5 -5
  27. package/dist/components/index.js +62 -13
  28. package/dist/components/index.js.map +1 -1
  29. package/dist/components/index.mjs +5 -5
  30. package/dist/index.js +62 -13
  31. package/dist/index.js.map +1 -1
  32. package/dist/index.mjs +5 -5
  33. package/package.json +7 -7
  34. package/src/components/chat/Messages.tsx +72 -15
  35. package/dist/chunk-CPMIEVKK.mjs.map +0 -1
  36. /package/dist/{chunk-QK6XA3PL.mjs.map → chunk-H5CXJBR5.mjs.map} +0 -0
  37. /package/dist/{chunk-TEZWY2BL.mjs.map → chunk-M2NVAJQA.mjs.map} +0 -0
  38. /package/dist/{chunk-C5KOJ3IH.mjs.map → chunk-ORHE7FYT.mjs.map} +0 -0
  39. /package/dist/{chunk-OJ5NVSTU.mjs.map → chunk-PY7YBFPA.mjs.map} +0 -0
package/CHANGELOG.md CHANGED
@@ -1,43 +1,207 @@
1
1
  # ui
2
2
 
3
- ## 1.4.0-pre-1-4-0-alpha.10
3
+ ## 1.4.0-pre-1-4-0.14
4
4
 
5
5
  ### Minor Changes
6
6
 
7
- - pre-release test
7
+ - lgc & lgjs alpha release
8
8
 
9
9
  ### Patch Changes
10
10
 
11
- - f6fab28: update tsup config
12
- - f6fab28: update entry
13
- - f6fab28: export langchain module
11
+ - a5efccd: Revert rxjs changes
12
+ - Updated dependencies [a5efccd]
13
+ - Updated dependencies
14
+ - @copilotkit/react-core@1.4.0-pre-1-4-0.14
15
+ - @copilotkit/runtime-client-gql@1.4.0-pre-1-4-0.14
16
+ - @copilotkit/shared@1.4.0-pre-1-4-0.14
17
+
18
+ ## 1.4.0-pre-1-4-0.13
19
+
20
+ ### Minor Changes
21
+
22
+ - lgc & lgjs alpha
23
+
24
+ ### Patch Changes
25
+
26
+ - Updated dependencies
27
+ - @copilotkit/runtime-client-gql@1.4.0-pre-1-4-0.13
28
+ - @copilotkit/react-core@1.4.0-pre-1-4-0.13
29
+ - @copilotkit/shared@1.4.0-pre-1-4-0.13
30
+
31
+ ## 1.4.0-pre-1-4-0.12
32
+
33
+ ### Minor Changes
34
+
35
+ - c6b489d: LangGraph Platform and LangGraph JS support
36
+ - 7cc6cc8: LangGraph Cloud and LangGraphJS alpha release
37
+ - prerelease lgc and lgjs
38
+ - Add LangGraph Platform and LangGraph JS support
39
+ - b318b18: Add LangGraph Cloud support
40
+
41
+ ### Patch Changes
42
+
43
+ - 9ea9db1: update tsup config
44
+ - d52c1f9: update entry
45
+ - e71d469: export langchain module
14
46
  - 8a77944: Improve LangSmith support
15
- - f6fab28: Ensure intermediate state config is sent as snake case
16
- - f6fab28: update entry in tsup config
47
+ - 3caa5d5: Ensure intermediate state config is sent as snake case
48
+ - cf3a787: update entry in tsup config
17
49
  - 8a77944: Ensure the last message is sent to LangSmith
18
- - f6fab28: update entry
19
- - f6fab28: Update exports
20
- - f6fab28: Update exports
50
+ - 264a693: update entry
51
+ - dd99f00: Update exports
52
+ - a28fb90: Update exports
21
53
  - 332d744: Add support for Azure OpenAI
22
- - f6fab28: Export LangGraph functions
23
- - f6fab28: Update lockfile
24
- - Updated dependencies [f6fab28]
25
- - Updated dependencies
26
- - Updated dependencies [f6fab28]
27
- - Updated dependencies [f6fab28]
54
+ - 1f8032e: Export LangGraph functions
55
+ - c3576f6: Update lockfile
56
+ - Updated dependencies [9ea9db1]
57
+ - Updated dependencies [d52c1f9]
58
+ - Updated dependencies [c6b489d]
59
+ - Updated dependencies [7cc6cc8]
60
+ - Updated dependencies [e71d469]
28
61
  - Updated dependencies [8a77944]
29
- - Updated dependencies [f6fab28]
30
- - Updated dependencies [f6fab28]
62
+ - Updated dependencies [3caa5d5]
63
+ - Updated dependencies [cf3a787]
64
+ - Updated dependencies
65
+ - Updated dependencies
31
66
  - Updated dependencies [8a77944]
32
- - Updated dependencies [f6fab28]
33
- - Updated dependencies [f6fab28]
34
- - Updated dependencies [f6fab28]
67
+ - Updated dependencies [264a693]
68
+ - Updated dependencies [dd99f00]
69
+ - Updated dependencies [a28fb90]
35
70
  - Updated dependencies [332d744]
36
- - Updated dependencies [f6fab28]
37
- - Updated dependencies [f6fab28]
38
- - @copilotkit/runtime-client-gql@1.4.0-pre-1-4-0-alpha.10
39
- - @copilotkit/react-core@1.4.0-pre-1-4-0-alpha.10
40
- - @copilotkit/shared@1.4.0-pre-1-4-0-alpha.10
71
+ - Updated dependencies [b318b18]
72
+ - Updated dependencies [1f8032e]
73
+ - Updated dependencies [c3576f6]
74
+ - @copilotkit/runtime-client-gql@1.4.0-pre-1-4-0.12
75
+ - @copilotkit/react-core@1.4.0-pre-1-4-0.12
76
+ - @copilotkit/shared@1.4.0-pre-1-4-0.12
77
+
78
+ ## 1.4.0-pre-1-4-0.11
79
+
80
+ ### Minor Changes
81
+
82
+ - LangGraph Platform and LangGraph JS support
83
+
84
+ ### Patch Changes
85
+
86
+ - Updated dependencies
87
+ - @copilotkit/runtime-client-gql@1.4.0-pre-1-4-0.11
88
+ - @copilotkit/react-core@1.4.0-pre-1-4-0.11
89
+ - @copilotkit/shared@1.4.0-pre-1-4-0.11
90
+
91
+ ## 1.4.0-pre-1-4-0.10
92
+
93
+ ### Minor Changes
94
+
95
+ - LangGraph Cloud and LangGraphJS alpha release
96
+ - b318b18: Add LangGraph Cloud support
97
+
98
+ ### Patch Changes
99
+
100
+ - Updated dependencies
101
+ - Updated dependencies [b318b18]
102
+ - @copilotkit/runtime-client-gql@1.4.0-pre-1-4-0.10
103
+ - @copilotkit/react-core@1.4.0-pre-1-4-0.10
104
+ - @copilotkit/shared@1.4.0-pre-1-4-0.10
105
+
106
+ ## 1.3.16-mme-lgc-langgraph-package.9
107
+
108
+ ### Patch Changes
109
+
110
+ - update entry
111
+ - Updated dependencies
112
+ - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.9
113
+ - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.9
114
+ - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.9
115
+
116
+ ## 1.3.16-mme-lgc-langgraph-package.8
117
+
118
+ ### Patch Changes
119
+
120
+ - update entry
121
+ - Updated dependencies
122
+ - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.8
123
+ - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.8
124
+ - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.8
125
+
126
+ ## 1.3.16-mme-lgc-langgraph-package.7
127
+
128
+ ### Patch Changes
129
+
130
+ - update entry in tsup config
131
+ - Updated dependencies
132
+ - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.7
133
+ - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.7
134
+ - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.7
135
+
136
+ ## 1.3.16-mme-lgc-langgraph-package.6
137
+
138
+ ### Patch Changes
139
+
140
+ - Update exports
141
+ - Updated dependencies
142
+ - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.6
143
+ - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.6
144
+ - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.6
145
+
146
+ ## 1.3.16-mme-lgc-langgraph-package.5
147
+
148
+ ### Patch Changes
149
+
150
+ - update tsup config
151
+ - Updated dependencies
152
+ - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.5
153
+ - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.5
154
+ - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.5
155
+
156
+ ## 1.3.16-mme-lgc-langgraph-package.4
157
+
158
+ ### Patch Changes
159
+
160
+ - Update exports
161
+ - Updated dependencies
162
+ - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.4
163
+ - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.4
164
+ - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.4
165
+
166
+ ## 1.3.16-mme-lgc-langgraph-package.3
167
+
168
+ ### Patch Changes
169
+
170
+ - export langchain module
171
+ - Updated dependencies
172
+ - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.3
173
+ - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.3
174
+ - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.3
175
+
176
+ ## 1.3.16-mme-sdk-js.2
177
+
178
+ ### Patch Changes
179
+
180
+ - Ensure intermediate state config is sent as snake case
181
+ - Updated dependencies
182
+ - @copilotkit/runtime-client-gql@1.3.16-mme-sdk-js.2
183
+ - @copilotkit/react-core@1.3.16-mme-sdk-js.2
184
+ - @copilotkit/shared@1.3.16-mme-sdk-js.2
185
+
186
+ ## 1.3.16-mme-sdk-js.1
187
+
188
+ ### Patch Changes
189
+
190
+ - Update lockfile
191
+ - Updated dependencies
192
+ - @copilotkit/runtime-client-gql@1.3.16-mme-sdk-js.1
193
+ - @copilotkit/react-core@1.3.16-mme-sdk-js.1
194
+ - @copilotkit/shared@1.3.16-mme-sdk-js.1
195
+
196
+ ## 1.3.16-mme-sdk-js.0
197
+
198
+ ### Patch Changes
199
+
200
+ - Export LangGraph functions
201
+ - Updated dependencies
202
+ - @copilotkit/react-core@1.3.16-mme-sdk-js.0
203
+ - @copilotkit/runtime-client-gql@1.3.16-mme-sdk-js.0
204
+ - @copilotkit/shared@1.3.16-mme-sdk-js.0
41
205
 
42
206
  ## 1.3.15
43
207
 
@@ -9,13 +9,13 @@ import {
9
9
  } from "./chunk-RQNJNK2W.mjs";
10
10
  import {
11
11
  CopilotChat
12
- } from "./chunk-C5KOJ3IH.mjs";
12
+ } from "./chunk-ORHE7FYT.mjs";
13
13
  import {
14
14
  Input
15
15
  } from "./chunk-4LUMV4YO.mjs";
16
16
  import {
17
17
  Messages
18
- } from "./chunk-CPMIEVKK.mjs";
18
+ } from "./chunk-RKPANT3F.mjs";
19
19
  import {
20
20
  ResponseButton
21
21
  } from "./chunk-3XAXY2Z3.mjs";
@@ -88,4 +88,4 @@ var CopilotModal = ({
88
88
  export {
89
89
  CopilotModal
90
90
  };
91
- //# sourceMappingURL=chunk-QK6XA3PL.mjs.map
91
+ //# sourceMappingURL=chunk-H5CXJBR5.mjs.map
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  CopilotModal
3
- } from "./chunk-QK6XA3PL.mjs";
3
+ } from "./chunk-H5CXJBR5.mjs";
4
4
  import {
5
5
  __spreadProps,
6
6
  __spreadValues
@@ -27,4 +27,4 @@ function CopilotSidebar(props) {
27
27
  export {
28
28
  CopilotSidebar
29
29
  };
30
- //# sourceMappingURL=chunk-TEZWY2BL.mjs.map
30
+ //# sourceMappingURL=chunk-M2NVAJQA.mjs.map
@@ -22,7 +22,7 @@ import {
22
22
  } from "./chunk-4LUMV4YO.mjs";
23
23
  import {
24
24
  Messages
25
- } from "./chunk-CPMIEVKK.mjs";
25
+ } from "./chunk-RKPANT3F.mjs";
26
26
  import {
27
27
  ResponseButton
28
28
  } from "./chunk-3XAXY2Z3.mjs";
@@ -198,4 +198,4 @@ export {
198
198
  WrappedCopilotChat,
199
199
  useCopilotChatLogic
200
200
  };
201
- //# sourceMappingURL=chunk-C5KOJ3IH.mjs.map
201
+ //# sourceMappingURL=chunk-ORHE7FYT.mjs.map
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  CopilotModal
3
- } from "./chunk-QK6XA3PL.mjs";
3
+ } from "./chunk-H5CXJBR5.mjs";
4
4
  import {
5
5
  __spreadProps,
6
6
  __spreadValues
@@ -18,4 +18,4 @@ function CopilotPopup(props) {
18
18
  export {
19
19
  CopilotPopup
20
20
  };
21
- //# sourceMappingURL=chunk-OJ5NVSTU.mjs.map
21
+ //# sourceMappingURL=chunk-PY7YBFPA.mjs.map
@@ -3,7 +3,7 @@ import {
3
3
  } from "./chunk-CBBFRI3Q.mjs";
4
4
 
5
5
  // src/components/chat/Messages.tsx
6
- import React, { useEffect, useMemo } from "react";
6
+ import { useEffect, useMemo, useRef } from "react";
7
7
  import {
8
8
  ResultMessage,
9
9
  TextMessage,
@@ -37,18 +37,8 @@ var Messages = ({
37
37
  }
38
38
  }
39
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: [
40
+ const { messagesEndRef, messagesContainerRef } = useScrollToBottom(messages);
41
+ return /* @__PURE__ */ jsxs("div", { className: "copilotKitMessages", ref: messagesContainerRef, children: [
52
42
  messages.map((message, index) => {
53
43
  const isCurrentMessage = index === messages.length - 1;
54
44
  if (message.isTextMessage()) {
@@ -117,8 +107,68 @@ function makeInitialMessages(initial) {
117
107
  })
118
108
  );
119
109
  }
110
+ function useScrollToBottom(messages) {
111
+ const messagesEndRef = useRef(null);
112
+ const messagesContainerRef = useRef(null);
113
+ const isProgrammaticScrollRef = useRef(false);
114
+ const isUserScrollUpRef = useRef(false);
115
+ const scrollToBottom = () => {
116
+ if (messagesEndRef.current) {
117
+ isProgrammaticScrollRef.current = true;
118
+ messagesEndRef.current.scrollIntoView({
119
+ behavior: "auto"
120
+ });
121
+ }
122
+ };
123
+ const handleScroll = () => {
124
+ if (isProgrammaticScrollRef.current) {
125
+ isProgrammaticScrollRef.current = false;
126
+ return;
127
+ }
128
+ if (messagesContainerRef.current) {
129
+ const { scrollTop, scrollHeight, clientHeight } = messagesContainerRef.current;
130
+ isUserScrollUpRef.current = scrollTop + clientHeight < scrollHeight;
131
+ }
132
+ };
133
+ useEffect(() => {
134
+ const container = messagesContainerRef.current;
135
+ if (container) {
136
+ container.addEventListener("scroll", handleScroll);
137
+ }
138
+ return () => {
139
+ if (container) {
140
+ container.removeEventListener("scroll", handleScroll);
141
+ }
142
+ };
143
+ }, []);
144
+ useEffect(() => {
145
+ const container = messagesContainerRef.current;
146
+ if (!container) {
147
+ return;
148
+ }
149
+ const mutationObserver = new MutationObserver(() => {
150
+ if (!isUserScrollUpRef.current) {
151
+ scrollToBottom();
152
+ }
153
+ });
154
+ mutationObserver.observe(container, {
155
+ childList: true,
156
+ subtree: true,
157
+ characterData: true
158
+ });
159
+ return () => {
160
+ mutationObserver.disconnect();
161
+ };
162
+ }, []);
163
+ useEffect(() => {
164
+ isUserScrollUpRef.current = false;
165
+ scrollToBottom();
166
+ }, [messages.filter((m) => m.isTextMessage() && m.role === Role.User).length]);
167
+ return { messagesEndRef, messagesContainerRef };
168
+ }
120
169
 
121
170
  export {
122
- Messages
171
+ Messages,
172
+ useScrollToBottom
123
173
  };
124
- //# sourceMappingURL=chunk-CPMIEVKK.mjs.map
174
+ //# sourceMappingURL=chunk-RKPANT3F.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/chat/Messages.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef } 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, messagesContainerRef } = useScrollToBottom(messages);\n\n return (\n <div className=\"copilotKitMessages\" ref={messagesContainerRef}>\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}\nexport function useScrollToBottom(messages: any[]) {\n const messagesEndRef = useRef<HTMLDivElement>(null);\n const messagesContainerRef = useRef<HTMLDivElement | null>(null);\n const isProgrammaticScrollRef = useRef(false);\n const isUserScrollUpRef = useRef(false);\n\n const scrollToBottom = () => {\n if (messagesEndRef.current) {\n isProgrammaticScrollRef.current = true;\n messagesEndRef.current.scrollIntoView({\n behavior: \"auto\",\n });\n }\n };\n\n const handleScroll = () => {\n if (isProgrammaticScrollRef.current) {\n isProgrammaticScrollRef.current = false;\n return;\n }\n\n if (messagesContainerRef.current) {\n const { scrollTop, scrollHeight, clientHeight } = messagesContainerRef.current;\n isUserScrollUpRef.current = scrollTop + clientHeight < scrollHeight;\n }\n };\n\n useEffect(() => {\n const container = messagesContainerRef.current;\n if (container) {\n container.addEventListener(\"scroll\", handleScroll);\n }\n return () => {\n if (container) {\n container.removeEventListener(\"scroll\", handleScroll);\n }\n };\n }, []);\n\n useEffect(() => {\n const container = messagesContainerRef.current;\n if (!container) {\n return;\n }\n\n const mutationObserver = new MutationObserver(() => {\n if (!isUserScrollUpRef.current) {\n scrollToBottom();\n }\n });\n\n mutationObserver.observe(container, {\n childList: true,\n subtree: true,\n characterData: true,\n });\n\n return () => {\n mutationObserver.disconnect();\n };\n }, []);\n\n useEffect(() => {\n isUserScrollUpRef.current = false;\n scrollToBottom();\n }, [messages.filter((m) => m.isTextMessage() && m.role === Role.User).length]);\n\n return { messagesEndRef, messagesContainerRef };\n}\n"],"mappings":"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","names":[]}
@@ -388,7 +388,7 @@ var ChatContextProvider = ({
388
388
  };
389
389
 
390
390
  // src/components/chat/Messages.tsx
391
- var import_react2 = __toESM(require("react"));
391
+ var import_react2 = require("react");
392
392
  var import_runtime_client_gql = require("@copilotkit/runtime-client-gql");
393
393
  var import_jsx_runtime3 = require("react/jsx-runtime");
394
394
  var Messages = ({
@@ -418,18 +418,8 @@ var Messages = ({
418
418
  }
419
419
  }
420
420
  }
421
- const messagesEndRef = import_react2.default.useRef(null);
422
- const scrollToBottom = () => {
423
- if (messagesEndRef.current) {
424
- messagesEndRef.current.scrollIntoView({
425
- behavior: "auto"
426
- });
427
- }
428
- };
429
- (0, import_react2.useEffect)(() => {
430
- scrollToBottom();
431
- }, [messages]);
432
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "copilotKitMessages", children: [
421
+ const { messagesEndRef, messagesContainerRef } = useScrollToBottom(messages);
422
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "copilotKitMessages", ref: messagesContainerRef, children: [
433
423
  messages.map((message, index) => {
434
424
  const isCurrentMessage = index === messages.length - 1;
435
425
  if (message.isTextMessage()) {
@@ -498,6 +488,65 @@ function makeInitialMessages(initial) {
498
488
  })
499
489
  );
500
490
  }
491
+ function useScrollToBottom(messages) {
492
+ const messagesEndRef = (0, import_react2.useRef)(null);
493
+ const messagesContainerRef = (0, import_react2.useRef)(null);
494
+ const isProgrammaticScrollRef = (0, import_react2.useRef)(false);
495
+ const isUserScrollUpRef = (0, import_react2.useRef)(false);
496
+ const scrollToBottom = () => {
497
+ if (messagesEndRef.current) {
498
+ isProgrammaticScrollRef.current = true;
499
+ messagesEndRef.current.scrollIntoView({
500
+ behavior: "auto"
501
+ });
502
+ }
503
+ };
504
+ const handleScroll = () => {
505
+ if (isProgrammaticScrollRef.current) {
506
+ isProgrammaticScrollRef.current = false;
507
+ return;
508
+ }
509
+ if (messagesContainerRef.current) {
510
+ const { scrollTop, scrollHeight, clientHeight } = messagesContainerRef.current;
511
+ isUserScrollUpRef.current = scrollTop + clientHeight < scrollHeight;
512
+ }
513
+ };
514
+ (0, import_react2.useEffect)(() => {
515
+ const container = messagesContainerRef.current;
516
+ if (container) {
517
+ container.addEventListener("scroll", handleScroll);
518
+ }
519
+ return () => {
520
+ if (container) {
521
+ container.removeEventListener("scroll", handleScroll);
522
+ }
523
+ };
524
+ }, []);
525
+ (0, import_react2.useEffect)(() => {
526
+ const container = messagesContainerRef.current;
527
+ if (!container) {
528
+ return;
529
+ }
530
+ const mutationObserver = new MutationObserver(() => {
531
+ if (!isUserScrollUpRef.current) {
532
+ scrollToBottom();
533
+ }
534
+ });
535
+ mutationObserver.observe(container, {
536
+ childList: true,
537
+ subtree: true,
538
+ characterData: true
539
+ });
540
+ return () => {
541
+ mutationObserver.disconnect();
542
+ };
543
+ }, []);
544
+ (0, import_react2.useEffect)(() => {
545
+ isUserScrollUpRef.current = false;
546
+ scrollToBottom();
547
+ }, [messages.filter((m) => m.isTextMessage() && m.role === import_runtime_client_gql.Role.User).length]);
548
+ return { messagesEndRef, messagesContainerRef };
549
+ }
501
550
 
502
551
  // src/components/chat/Input.tsx
503
552
  var import_react5 = require("react");