diff --git a/apps/web/src/components/chat/ChatComposer.tsx b/apps/web/src/components/chat/ChatComposer.tsx index cfdb03d0f05c..4a92c9efa881 100644 --- a/apps/web/src/components/chat/ChatComposer.tsx +++ b/apps/web/src/components/chat/ChatComposer.tsx @@ -5220,6 +5220,19 @@ export const ChatComposer = memo(function ChatComposer(props: ChatComposerProps) useLayoutEffect(() => { onRestingChange(isComposerResting); }, [isComposerResting, onRestingChange]); + // The resting footer floats over the prompt row, so the row reserves its + // measured width. Wide actions like the compact-before-send chip vary too much for a fixed inset. + const [restingActionsElement, setRestingActionsElement] = useState(null); + const [restingActionsWidth, setRestingActionsWidth] = useState(null); + useLayoutEffect(() => { + if (!isComposerResting || !restingActionsElement) return; + const measure = () => setRestingActionsWidth(restingActionsElement.offsetWidth); + measure(); + if (typeof ResizeObserver === "undefined") return; + const observer = new ResizeObserver(measure); + observer.observe(restingActionsElement); + return () => observer.disconnect(); + }, [isComposerResting, restingActionsElement]); const restingImagePreviewCounts = getRestingComposerImagePreviewCounts( standaloneComposerImages.length, ); @@ -7376,17 +7389,12 @@ export const ChatComposer = memo(function ChatComposer(props: ChatComposerProps) )}
{previewFile ? (