Aura
/
aura-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: correct antd TextAreaRef type import

main
sp mac bookpro 2605 2026-06-07 20:40:15 +08:00
parent 26d2c930b5
commit 332464bd35
1 changed files with 7 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/pages/chat/components/ChatInput.tsx
View File

@ -1,5 +1,6 @@
import { ArrowUpOutlined, BookOutlined, CloseOutlined, DownOutlined, PaperClipOutlined } from '@ant-design/icons';
import { Button, Image as AntImage, Input, Select, Tag, Tooltip, Upload, Popover } from 'antd';
import type { TextAreaRef } from 'antd/es/input/TextArea';
import type { ChatAttachment } from '../../../api';
import type { Agent } from '../../../api/agents';
import { HistoryIcon, NewChatIcon } from '../../../components/icons';
@ -49,7 +50,7 @@ export default function ChatInput(props: {
const [showMentionPopover, setShowMentionPopover] = useState(false);
const [mentionQuery, setMentionQuery] = useState('');
const [mentionPos, setMentionPos] = useState<{ top: number; left: number } | null>(null);
const inputRef = useRef<HTMLTextAreaElement>(null);
const inputRef = useRef<TextAreaRef>(null);
// 检测 @ 触发提及选择
const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
@ -74,13 +75,13 @@ export default function ChatInput(props: {
console.log('[@mention] matched @ at position:', { atIndex, query });
if (!query.includes(' ')) {
setMentionQuery(query);
// 计算位置 - 使用 inputRef 获取最新 DOM 位置
// 计算位置 - Ant Design Input.TextArea 需要从 resizableTextArea 获取实际 DOM
requestAnimationFrame(() => {
if (!(inputRef.current instanceof HTMLTextAreaElement)) {
console.log('[@mention] inputRef.current is not textarea:', inputRef.current);
const textarea = inputRef.current?.resizableTextArea?.textArea;
if (!textarea) {
console.log('[@mention] cannot get textarea DOM from inputRef:', inputRef.current);
return;
}
const textarea = inputRef.current;
const rect = textarea.getBoundingClientRect();
console.log('[@mention] textarea rect:', rect);
setMentionPos({ top: rect.bottom, left: rect.left + 10 });
@ -100,7 +101,7 @@ export default function ChatInput(props: {
console.log('[@mention] filtered:', { mentionQuery, count: filteredAgents.length, agents: filteredAgents.map(a => a.name) });
const handleSelectAgent = (agent: Agent) => {
const textarea = inputRef.current;
const textarea = inputRef.current?.resizableTextArea?.textArea;
if (!textarea) return;
const value = input;