@copilotkit/react-ui 1.3.16-mme-lgc-langgraph-package.11 → 1.3.16-mme-revert-rxjs-changes.10

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 +35 -119
  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,124 +1,40 @@
1
1
  # ui
2
2
 
3
- ## 1.3.16-mme-lgc-langgraph-package.11
4
-
5
- ### Patch Changes
6
-
7
- - Add CopilotKitState
8
- - Updated dependencies
9
- - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.11
10
- - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.11
11
- - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.11
12
-
13
- ## 1.3.16-mme-lgc-langgraph-package.10
14
-
15
- ### Patch Changes
16
-
17
- - Fix langchain path
18
- - Updated dependencies
19
- - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.10
20
- - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.10
21
- - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.10
22
-
23
- ## 1.3.16-mme-lgc-langgraph-package.9
24
-
25
- ### Patch Changes
26
-
27
- - update entry
28
- - Updated dependencies
29
- - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.9
30
- - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.9
31
- - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.9
32
-
33
- ## 1.3.16-mme-lgc-langgraph-package.8
34
-
35
- ### Patch Changes
36
-
37
- - update entry
38
- - Updated dependencies
39
- - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.8
40
- - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.8
41
- - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.8
42
-
43
- ## 1.3.16-mme-lgc-langgraph-package.7
44
-
45
- ### Patch Changes
46
-
47
- - update entry in tsup config
48
- - Updated dependencies
49
- - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.7
50
- - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.7
51
- - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.7
52
-
53
- ## 1.3.16-mme-lgc-langgraph-package.6
54
-
55
- ### Patch Changes
56
-
57
- - Update exports
58
- - Updated dependencies
59
- - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.6
60
- - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.6
61
- - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.6
62
-
63
- ## 1.3.16-mme-lgc-langgraph-package.5
64
-
65
- ### Patch Changes
66
-
67
- - update tsup config
68
- - Updated dependencies
69
- - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.5
70
- - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.5
71
- - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.5
72
-
73
- ## 1.3.16-mme-lgc-langgraph-package.4
74
-
75
- ### Patch Changes
76
-
77
- - Update exports
78
- - Updated dependencies
79
- - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.4
80
- - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.4
81
- - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.4
82
-
83
- ## 1.3.16-mme-lgc-langgraph-package.3
84
-
85
- ### Patch Changes
86
-
87
- - export langchain module
88
- - Updated dependencies
89
- - @copilotkit/runtime-client-gql@1.3.16-mme-lgc-langgraph-package.3
90
- - @copilotkit/react-core@1.3.16-mme-lgc-langgraph-package.3
91
- - @copilotkit/shared@1.3.16-mme-lgc-langgraph-package.3
92
-
93
- ## 1.3.16-mme-sdk-js.2
94
-
95
- ### Patch Changes
96
-
97
- - Ensure intermediate state config is sent as snake case
98
- - Updated dependencies
99
- - @copilotkit/runtime-client-gql@1.3.16-mme-sdk-js.2
100
- - @copilotkit/react-core@1.3.16-mme-sdk-js.2
101
- - @copilotkit/shared@1.3.16-mme-sdk-js.2
102
-
103
- ## 1.3.16-mme-sdk-js.1
104
-
105
- ### Patch Changes
106
-
107
- - Update lockfile
108
- - Updated dependencies
109
- - @copilotkit/runtime-client-gql@1.3.16-mme-sdk-js.1
110
- - @copilotkit/react-core@1.3.16-mme-sdk-js.1
111
- - @copilotkit/shared@1.3.16-mme-sdk-js.1
112
-
113
- ## 1.3.16-mme-sdk-js.0
114
-
115
- ### Patch Changes
116
-
117
- - Export LangGraph functions
118
- - Updated dependencies
119
- - @copilotkit/react-core@1.3.16-mme-sdk-js.0
120
- - @copilotkit/runtime-client-gql@1.3.16-mme-sdk-js.0
121
- - @copilotkit/shared@1.3.16-mme-sdk-js.0
3
+ ## 1.3.16-mme-revert-rxjs-changes.10
4
+
5
+ ### Patch Changes
6
+
7
+ - f6fab28: update tsup config
8
+ - f6fab28: update entry
9
+ - f6fab28: export langchain module
10
+ - 8a77944: Improve LangSmith support
11
+ - f6fab28: Ensure intermediate state config is sent as snake case
12
+ - f6fab28: update entry in tsup config
13
+ - 8a77944: Ensure the last message is sent to LangSmith
14
+ - Revert rxjs changes
15
+ - f6fab28: update entry
16
+ - f6fab28: Update exports
17
+ - f6fab28: Update exports
18
+ - 332d744: Add support for Azure OpenAI
19
+ - f6fab28: Export LangGraph functions
20
+ - f6fab28: Update lockfile
21
+ - Updated dependencies [f6fab28]
22
+ - Updated dependencies [f6fab28]
23
+ - Updated dependencies [f6fab28]
24
+ - Updated dependencies [8a77944]
25
+ - Updated dependencies [f6fab28]
26
+ - Updated dependencies [f6fab28]
27
+ - Updated dependencies [8a77944]
28
+ - Updated dependencies
29
+ - Updated dependencies [f6fab28]
30
+ - Updated dependencies [f6fab28]
31
+ - Updated dependencies [f6fab28]
32
+ - Updated dependencies [332d744]
33
+ - Updated dependencies [f6fab28]
34
+ - Updated dependencies [f6fab28]
35
+ - @copilotkit/runtime-client-gql@1.3.16-mme-revert-rxjs-changes.10
36
+ - @copilotkit/react-core@1.3.16-mme-revert-rxjs-changes.10
37
+ - @copilotkit/shared@1.3.16-mme-revert-rxjs-changes.10
122
38
 
123
39
  ## 1.3.15
124
40
 
@@ -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":";;;;;AAAA,SAAgB,WAAW,SAAS,cAAc;AAGlD;AAAA,EAGE;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AAoCH,SAMQ,KANR;AAlCG,IAAM,WAAW,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAqB;AACnB,QAAM,UAAU,eAAe;AAC/B,QAAM,kBAAkB;AAAA,IACtB,MAAM,oBAAoB,QAAQ,OAAO,OAAO;AAAA,IAChD,CAAC,QAAQ,OAAO,OAAO;AAAA,EACzB;AACA,aAAW,CAAC,GAAG,iBAAiB,GAAG,QAAQ;AAE3C,QAAM,gBAAwC,CAAC;AAE/C,WAAS,IAAI,GAAG,IAAI,SAAS,QAAQ,KAAK;AACxC,QAAI,SAAS,CAAC,EAAE,yBAAyB,GAAG;AAC1C,YAAM,KAAK,SAAS,CAAC,EAAE;AACvB,YAAM,gBAA2C,SAAS;AAAA,QACxD,CAAC,YAAY,QAAQ,gBAAgB,KAAK,QAAQ,sBAAsB;AAAA,MAC1E;AAEA,UAAI,eAAe;AACjB,sBAAc,EAAE,IAAI,cAAc,aAAa,cAAc,UAAU,EAAE;AAAA,MAC3E;AAAA,IACF;AAAA,EACF;AAEA,QAAM,EAAE,gBAAgB,qBAAqB,IAAI,kBAAkB,QAAQ;AAE3E,SACE,qBAAC,SAAI,WAAU,sBAAqB,KAAK,sBACtC;AAAA,aAAS,IAAI,CAAC,SAAS,UAAU;AAChC,YAAM,mBAAmB,UAAU,SAAS,SAAS;AAErD,UAAI,QAAQ,cAAc,GAAG;AAC3B,eACE;AAAA,UAAC;AAAA;AAAA,YAEC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,UAJK;AAAA,QAKP;AAAA,MAEJ,WAAW,QAAQ,yBAAyB,GAAG;AAC7C,eACE;AAAA,UAAC;AAAA;AAAA,YAEC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,cAAc,cAAc,QAAQ,EAAE;AAAA;AAAA,UALjC;AAAA,QAMP;AAAA,MAEJ,WAAW,QAAQ,oBAAoB,GAAG;AACxC,eACE;AAAA,UAAC;AAAA;AAAA,YAEC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,UAJK;AAAA,QAKP;AAAA,MAEJ,WAAW,QAAQ,gBAAgB,GAAG;AACpC,eACE;AAAA,UAAC;AAAA;AAAA,YAEC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,UAJK;AAAA,QAKP;AAAA,MAEJ;AAAA,IACF,CAAC;AAAA,IACD,oBAAC,YAAO,KAAK,gBAAiB,UAAS;AAAA,KACzC;AAEJ;AAEA,SAAS,oBAAoB,SAAwC;AACnE,MAAI,eAAyB,CAAC;AAC9B,MAAI,SAAS;AACX,QAAI,MAAM,QAAQ,OAAO,GAAG;AAC1B,mBAAa,KAAK,GAAG,OAAO;AAAA,IAC9B,OAAO;AACL,mBAAa,KAAK,OAAO;AAAA,IAC3B;AAAA,EACF;AAEA,SAAO,aAAa;AAAA,IAClB,CAAC,YACC,IAAI,YAAY;AAAA,MACd,MAAM,KAAK;AAAA,MACX,SAAS;AAAA,IACX,CAAC;AAAA,EACL;AACF;AACO,SAAS,kBAAkB,UAAiB;AACjD,QAAM,iBAAiB,OAAuB,IAAI;AAClD,QAAM,uBAAuB,OAA8B,IAAI;AAC/D,QAAM,0BAA0B,OAAO,KAAK;AAC5C,QAAM,oBAAoB,OAAO,KAAK;AAEtC,QAAM,iBAAiB,MAAM;AAC3B,QAAI,eAAe,SAAS;AAC1B,8BAAwB,UAAU;AAClC,qBAAe,QAAQ,eAAe;AAAA,QACpC,UAAU;AAAA,MACZ,CAAC;AAAA,IACH;AAAA,EACF;AAEA,QAAM,eAAe,MAAM;AACzB,QAAI,wBAAwB,SAAS;AACnC,8BAAwB,UAAU;AAClC;AAAA,IACF;AAEA,QAAI,qBAAqB,SAAS;AAChC,YAAM,EAAE,WAAW,cAAc,aAAa,IAAI,qBAAqB;AACvE,wBAAkB,UAAU,YAAY,eAAe;AAAA,IACzD;AAAA,EACF;AAEA,YAAU,MAAM;AACd,UAAM,YAAY,qBAAqB;AACvC,QAAI,WAAW;AACb,gBAAU,iBAAiB,UAAU,YAAY;AAAA,IACnD;AACA,WAAO,MAAM;AACX,UAAI,WAAW;AACb,kBAAU,oBAAoB,UAAU,YAAY;AAAA,MACtD;AAAA,IACF;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,UAAM,YAAY,qBAAqB;AACvC,QAAI,CAAC,WAAW;AACd;AAAA,IACF;AAEA,UAAM,mBAAmB,IAAI,iBAAiB,MAAM;AAClD,UAAI,CAAC,kBAAkB,SAAS;AAC9B,uBAAe;AAAA,MACjB;AAAA,IACF,CAAC;AAED,qBAAiB,QAAQ,WAAW;AAAA,MAClC,WAAW;AAAA,MACX,SAAS;AAAA,MACT,eAAe;AAAA,IACjB,CAAC;AAED,WAAO,MAAM;AACX,uBAAiB,WAAW;AAAA,IAC9B;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,sBAAkB,UAAU;AAC5B,mBAAe;AAAA,EACjB,GAAG,CAAC,SAAS,OAAO,CAAC,MAAM,EAAE,cAAc,KAAK,EAAE,SAAS,KAAK,IAAI,EAAE,MAAM,CAAC;AAE7E,SAAO,EAAE,gBAAgB,qBAAqB;AAChD;","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");