wuxu/codeg
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #6 from Jasion-han/fix/chat-input-toolbar-overlap

Browse Source 
fix(chat): prevent textarea scroll content under bottom toolbar
This commit is contained in:
XinTaoFei
2026-03-16 21:11:35 +08:00
committed by GitHub
parent 3ea78b1532 ffebe5bd45
commit c7e404ce3e
1 changed files with 12 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/components/chat/message-input.tsx
View File

@@ -1115,7 +1115,7 @@ export function MessageInput({
: hasResourceAttachments : hasResourceAttachments
? "pt-10" ? "pt-10"
: "pt-3" : "pt-3"
const bottomPaddingClass = "pb-10" const bottomPaddingClass = "pb-14"
const showDragActive = isDragActive && !disabled const showDragActive = isDragActive && !disabled
const selectorItems = ( const selectorItems = (
@@ -1239,7 +1239,14 @@ export function MessageInput({
{t("dropFilesToAttach")} {t("dropFilesToAttach")}
</div> </div>
)} )}
<div className="@container absolute left-2 right-24 bottom-2"> <div
className={cn(
"pointer-events-none absolute left-px right-12 bottom-px z-10 rounded-bl-xl bg-background",
"h-14"
)}
aria-hidden="true"
/>
<div className="@container absolute left-2 right-24 bottom-2 z-20">
<div className="flex items-center gap-1"> <div className="flex items-center gap-1">
<Button <Button
onClick={handlePickFiles} onClick={handlePickFiles}
@@ -1276,7 +1283,7 @@ export function MessageInput({
</div> </div>
</div> </div>
{isEditingQueueItem ? ( {isEditingQueueItem ? (
<div className="absolute right-2 bottom-2 flex items-center gap-1"> <div className="absolute right-2 bottom-2 z-20 flex items-center gap-1">
<Button <Button
onClick={onCancelQueueEdit} onClick={onCancelQueueEdit}
variant="ghost" variant="ghost"
@@ -1296,7 +1303,7 @@ export function MessageInput({
</Button> </Button>
</div> </div>
) : isPrompting && onCancel ? ( ) : isPrompting && onCancel ? (
<div className="absolute right-2 bottom-2 flex items-center gap-1"> <div className="absolute right-2 bottom-2 z-20 flex items-center gap-1">
<Button <Button
onClick={handleSend} onClick={handleSend}
disabled={!hasSendableContent} disabled={!hasSendableContent}
@@ -1351,7 +1358,7 @@ export function MessageInput({
onClick={handleSend} onClick={handleSend}
disabled={disabled || !hasSendableContent} disabled={disabled || !hasSendableContent}
size="icon" size="icon"
className="absolute right-2 bottom-2" className="absolute right-2 bottom-2 z-20"
title={t("send")} title={t("send")}
> >
<Send className="h-4 w-4" /> <Send className="h-4 w-4" />