fix(chat): keybinds and composer ui
parent
4a2578121a
commit
bd8a494cb2
|
|
@ -632,8 +632,24 @@ export default function ChatPage() {
|
||||||
onChange={(e) => setInput(e.target.value)}
|
onChange={(e) => setInput(e.target.value)}
|
||||||
placeholder="问我任何问题..."
|
placeholder="问我任何问题..."
|
||||||
autoSize={{ minRows: 3, maxRows: 10 }}
|
autoSize={{ minRows: 3, maxRows: 10 }}
|
||||||
onPressEnter={(e) => {
|
onKeyDown={(e) => {
|
||||||
if (!e.shiftKey) {
|
if (e.key !== 'Enter') return;
|
||||||
|
if ((e as any).isComposing) return;
|
||||||
|
|
||||||
|
if (e.metaKey || e.ctrlKey) {
|
||||||
|
e.preventDefault();
|
||||||
|
const el = e.currentTarget;
|
||||||
|
const start = el.selectionStart ?? input.length;
|
||||||
|
const end = el.selectionEnd ?? input.length;
|
||||||
|
const next = input.slice(0, start) + '\n' + input.slice(end);
|
||||||
|
setInput(next);
|
||||||
|
requestAnimationFrame(() => {
|
||||||
|
el.selectionStart = el.selectionEnd = start + 1;
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!e.shiftKey && !e.altKey) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
handleSend();
|
handleSend();
|
||||||
}
|
}
|
||||||
|
|
@ -655,6 +671,7 @@ export default function ChatPage() {
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<Upload
|
<Upload
|
||||||
|
className="chat-upload"
|
||||||
multiple
|
multiple
|
||||||
beforeUpload={(_f, files) => {
|
beforeUpload={(_f, files) => {
|
||||||
handleAttach(files as File[]);
|
handleAttach(files as File[]);
|
||||||
|
|
@ -663,9 +680,14 @@ export default function ChatPage() {
|
||||||
showUploadList={false}
|
showUploadList={false}
|
||||||
accept=".txt,.md,.markdown,.json,.csv,.pdf,.docx,.html,.htm,image/png,image/jpeg,image/webp,image/gif"
|
accept=".txt,.md,.markdown,.json,.csv,.pdf,.docx,.html,.htm,image/png,image/jpeg,image/webp,image/gif"
|
||||||
>
|
>
|
||||||
<Button type="text" icon={<PaperClipOutlined style={{ fontSize: 18 }} />} />
|
<Button type="text" className="chat-tool-button" icon={<PaperClipOutlined style={{ fontSize: 18 }} />} />
|
||||||
</Upload>
|
</Upload>
|
||||||
<Button type="text" icon={<BookOutlined style={{ fontSize: 18 }} />} onClick={() => setTplDrawerOpen(true)} />
|
<Button
|
||||||
|
type="text"
|
||||||
|
className="chat-tool-button"
|
||||||
|
icon={<BookOutlined style={{ fontSize: 18 }} />}
|
||||||
|
onClick={() => setTplDrawerOpen(true)}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{sending ? (
|
{sending ? (
|
||||||
|
|
|
||||||
|
|
@ -556,11 +556,6 @@ body {
|
||||||
box-shadow: var(--shadow-sm);
|
box-shadow: var(--shadow-sm);
|
||||||
}
|
}
|
||||||
|
|
||||||
.chat-input-card:focus-within {
|
|
||||||
border-color: var(--color-border-focus);
|
|
||||||
box-shadow: var(--shadow-focus);
|
|
||||||
}
|
|
||||||
|
|
||||||
.chat-input-stack {
|
.chat-input-stack {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
@ -614,6 +609,20 @@ body {
|
||||||
color: var(--color-text-tertiary);
|
color: var(--color-text-tertiary);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.chat-tool-button {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.chat-upload {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
display: inline-flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.chat-upload .ant-upload {
|
||||||
|
display: inline-flex;
|
||||||
|
}
|
||||||
|
|
||||||
.chat-send-button {
|
.chat-send-button {
|
||||||
width: 40px;
|
width: 40px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue