daniel543x/artcraft
1
0 Fork 0
mirror of https://github.com/storytold/artcraft.git synced 2026-11-15 06:12:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

prompt pasting works properly now (#765)

Browse Source
This commit is contained in:
BFlat authored and GitHub committed 2025-08-16 14:19:20 +07:00
1 parent 06e82eb9dc
commit c6c417bd38
5 files changed
+55 -16
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

frontend/libs/components/promptbox/src/lib/PromptBox2D.tsx
+10 -2
View File
@@ -301,8 +301,16 @@ export const PromptBox2D = ({
const handlePaste = (e: React.ClipboardEvent<HTMLTextAreaElement>) => {
e.preventDefault();
e.stopPropagation();
const pastedText = e.clipboardData.getData("text").trim();
setPrompt(pastedText);
const pastedText = e.clipboardData.getData("text");
const target = e.currentTarget;
const { selectionStart, selectionEnd, value } = target;
const next =
value.slice(0, selectionStart) + pastedText + value.slice(selectionEnd);
setPrompt(next);
requestAnimationFrame(() => {
const pos = selectionStart + pastedText.length;
textareaRef.current?.setSelectionRange(pos, pos);
});
};
const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
frontend/libs/components/promptbox/src/lib/PromptBox3D.tsx
+10 -2
View File
@@ -305,8 +305,16 @@ export const PromptBox3D = ({
const handlePaste = (e: React.ClipboardEvent<HTMLTextAreaElement>) => {
e.preventDefault();
e.stopPropagation();
const pastedText = e.clipboardData.getData("text").trim();
setPrompt(pastedText);
const pastedText = e.clipboardData.getData("text");
const target = e.currentTarget;
const { selectionStart, selectionEnd, value } = target;
const next =
value.slice(0, selectionStart) + pastedText + value.slice(selectionEnd);
setPrompt(next);
requestAnimationFrame(() => {
const pos = selectionStart + pastedText.length;
textareaRef.current?.setSelectionRange(pos, pos);
});
};
const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
frontend/libs/components/promptbox/src/lib/PromptBoxEdit.tsx
+15 -8
View File
@@ -5,7 +5,7 @@ import {
faMessageXmark,
faMousePointer,
faSparkles,
faSpinnerThird
faSpinnerThird,
} from "@fortawesome/pro-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { Button, ToggleButton } from "@storyteller/ui-button";
@@ -24,15 +24,13 @@ export const PromptBoxEdit = ({
onModeChange: onModeSelectionChange,
selectedMode,
onGenerateClick,
isDisabled
isDisabled,
}: PromptBoxEditProps) => {
const [prompt, setPrompt] = useState("");
const [useSystemPrompt, setUseSystemPrompt] = useState(true);
const textareaRef = useRef<HTMLTextAreaElement>(null);
useEffect(() => {
if (textareaRef.current) {
textareaRef.current.style.height = "auto";
@@ -43,8 +41,17 @@ export const PromptBoxEdit = ({
const handlePaste = (e: React.ClipboardEvent<HTMLTextAreaElement>) => {
e.preventDefault();
e.stopPropagation();
const pastedText = e.clipboardData.getData("text").trim();
setPrompt(pastedText);
const pastedText = e.clipboardData.getData("text");
const target = e.currentTarget;
const { selectionStart, selectionEnd, value } = target;
const next =
value.slice(0, selectionStart) + pastedText + value.slice(selectionEnd);
setPrompt(next);
// Restore caret after React updates the value
requestAnimationFrame(() => {
const pos = selectionStart + pastedText.length;
textareaRef.current?.setSelectionRange(pos, pos);
});
};
const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
@@ -97,8 +104,8 @@ export const PromptBoxEdit = ({
onChange={handleChange}
onPaste={handlePaste}
onKeyDown={handleKeyDown}
onFocus={() => { }}
onBlur={() => { }}
onFocus={() => {}}
onBlur={() => {}}
/>
</div>
<div className="mt-2 flex items-center justify-between gap-2">
frontend/libs/components/promptbox/src/lib/PromptBoxImage.tsx
+10 -2
View File
@@ -243,8 +243,16 @@ export const PromptBoxImage = ({
const handlePaste = (e: React.ClipboardEvent<HTMLTextAreaElement>) => {
e.preventDefault();
const pastedText = e.clipboardData.getData("text").trim();
setPrompt(pastedText);
const pastedText = e.clipboardData.getData("text");
const target = e.currentTarget;
const { selectionStart, selectionEnd, value } = target;
const next =
value.slice(0, selectionStart) + pastedText + value.slice(selectionEnd);
setPrompt(next);
requestAnimationFrame(() => {
const pos = selectionStart + pastedText.length;
textareaRef.current?.setSelectionRange(pos, pos);
});
};
const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
frontend/libs/components/promptbox/src/lib/PromptBoxVideo.tsx
+10 -2
View File
@@ -175,8 +175,16 @@ export const PromptBoxVideo = ({
const handlePaste = (e: React.ClipboardEvent<HTMLTextAreaElement>) => {
e.preventDefault();
const pastedText = e.clipboardData.getData("text").trim();
setPrompt(pastedText);
const pastedText = e.clipboardData.getData("text");
const target = e.currentTarget;
const { selectionStart, selectionEnd, value } = target;
const next =
value.slice(0, selectionStart) + pastedText + value.slice(selectionEnd);
setPrompt(next);
requestAnimationFrame(() => {
const pos = selectionStart + pastedText.length;
textareaRef.current?.setSelectionRange(pos, pos);
});
};
const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {