@copilotkit/react-core 1.56.4-canary.1777538870 → 1.56.4-canary.1777659843

package/dist/{copilotkit-tb4zqaMK.cjs → copilotkit-Bn7CCpNA.cjs}

@@ -6218,55 +6218,40 @@ const LastUserMessageContext = react.default.createContext({
 
 //#endregion
 //#region src/v2/hooks/use-pin-to-send.ts
-function usePinToSend({ scrollRef, contentRef, spacerRef, topOffset = 16 }) {
+function usePinToSend({ scrollRef, contentRef, topOffset = 16 }) {
 	const { id, sendNonce } = (0, react.useContext)(LastUserMessageContext);
 	const lastNonceRef = (0, react.useRef)(-1);
-	const currentSpacerHeightRef = (0, react.useRef)(0);
 	(0, react.useEffect)(() => {
 		if (sendNonce === lastNonceRef.current) return;
 		lastNonceRef.current = sendNonce;
 		if (!id) return;
 		const scrollEl = scrollRef.current;
 		const contentEl = contentRef.current;
-		const spacerEl = spacerRef.current;
-		if (!scrollEl || !contentEl || !spacerEl) return;
+		if (!scrollEl || !contentEl) return;
 		const escaped = typeof CSS !== "undefined" && CSS.escape ? CSS.escape(id) : id.replace(/[!"#$%&'()*+,./:;<=>?@[\\\]^`{|}~]/g, "\\$&");
 		const targetEl = contentEl.querySelector(`[data-message-id="${escaped}"]`);
 		if (!targetEl) return;
 		const viewportHeight = scrollEl.clientHeight;
-		const userMessageHeight = targetEl.getBoundingClientRect().height;
 		const paddingTop = parseFloat(getComputedStyle(targetEl).paddingTop) || 0;
-		const bubbleHeight = Math.max(0, userMessageHeight - paddingTop);
-		const spacerHeight = Math.max(0, viewportHeight - bubbleHeight - topOffset);
-		spacerEl.style.height = `${spacerHeight}px`;
-		currentSpacerHeightRef.current = spacerHeight;
+		const userMsgOffsetInScroll = computeOffsetTop(targetEl, scrollEl);
+		const requiredScrollHeight = userMsgOffsetInScroll + paddingTop + viewportHeight - topOffset;
+		contentEl.style.minHeight = `${Math.max(0, requiredScrollHeight)}px`;
 		const raf = requestAnimationFrame(() => {
-			const targetTop = computeOffsetTop(targetEl, scrollEl) + paddingTop - topOffset;
+			const targetTop = userMsgOffsetInScroll + paddingTop - topOffset;
 			scrollEl.scrollTo({
 				top: Math.max(0, targetTop),
 				behavior: "smooth"
 			});
 		});
-		const ro = new ResizeObserver(() => {
-			if (!contentEl || !spacerEl || !scrollEl) return;
-			const consumedBelow = contentEl.getBoundingClientRect().height - computeOffsetTop(targetEl, contentEl) - userMessageHeight;
-			const remaining = Math.max(0, spacerHeight - consumedBelow);
-			if (remaining < currentSpacerHeightRef.current) {
-				spacerEl.style.height = `${remaining}px`;
-				currentSpacerHeightRef.current = remaining;
-			}
-		});
-		ro.observe(contentEl);
 		return () => {
 			cancelAnimationFrame(raf);
-			ro.disconnect();
+			contentEl.style.minHeight = "";
 		};
 	}, [
 		id,
 		sendNonce,
 		scrollRef,
 		contentRef,
-		spacerRef,
 		topOffset
 	]);
 }
@@ -6480,11 +6465,9 @@ function CopilotChatView({ messageView, input, scrollView, suggestionView, welco
 		});
 	};
 	const PinToSendScrollContainer = ({ children, scrollRef, contentRef, scrollToBottom, scrollToBottomButton, feather, inputContainerHeight, isResizing, nonAutoScrollEl, nonAutoScrollRefCallback, showScrollButton, className, ...props }) => {
-		const spacerRef = (0, react.useRef)(null);
 		usePinToSend({
 			scrollRef,
 			contentRef,
-			spacerRef,
 			topOffset: 16
 		});
 		const BoundFeather = renderSlot(feather, CopilotChatView.Feather, {});
@@ -6493,23 +6476,16 @@ function CopilotChatView({ messageView, input, scrollView, suggestionView, welco
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: cn("cpk:h-full cpk:max-h-full cpk:flex cpk:flex-col cpk:min-h-0 cpk:relative", className),
 				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 						ref: nonAutoScrollRefCallback,
 						className: "cpk:flex-1 cpk:min-h-0 cpk:overflow-y-auto cpk:overflow-x-hidden",
 						...props,
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 							ref: contentRef,
+							"data-pin-to-send-content": true,
 							className: "cpk:px-4 cpk:sm:px-0 cpk:[div[data-sidebar-chat]_&]:px-8 cpk:[div[data-popup-chat]_&]:px-6",
 							children
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-							ref: spacerRef,
-							"data-pin-to-send-spacer": true,
-							"aria-hidden": "true",
-							style: {
-								height: 0,
-								flex: "0 0 auto"
-							}
-						})]
+						})
 					}),
 					BoundFeather,
 					showScrollButton && !isResizing && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -10202,4 +10178,4 @@ Object.defineProperty(exports, 'useToast', {
     return useToast;
   }
 });
-//# sourceMappingURL=copilotkit-tb4zqaMK.cjs.map
+//# sourceMappingURL=copilotkit-Bn7CCpNA.cjs.map