feat(canvas): enhance prompt editing with live synchronization and expanded editor functionality

CHANGELOG.md

@@ -2,7 +2,7 @@
 
 ## Unreleased
 
-+ [新增] 画布节点提示词输入支持弹窗放大编辑，长提示词和多行内容可在更大空间内修改。
++ [新增] 画布节点提示词输入支持弹窗放大编辑，长提示词和多行内容可在更大空间内修改并实时同步。
 + [修复] 已有图片或文本节点的编辑提示词在关闭输入面板后继续保留，不再因点击画布空白处丢失。
 + [修复] 选择模式下点击画布空白处会同步收起节点顶部工具条和下方输入面板。
 + [新增] 配置页新增本地存储面板，可查看 Infinite Canvas 的 IndexedDB、站点配额和各对象仓库占用情况。

docs/content/docs/progress/pending-test.mdx

@@ -10,7 +10,7 @@ The current release needs manual verification in these areas:
 - Canvas navigation: the bottom toolbar should switch between Select and Move modes and reflect the active mode with its icon; Select should draw a clearly spaced dashed range whose dash length, gap, and stroke width remain visually constant at every zoom level, while Move should pan from either the background or a node. Clicking blank canvas space in either mode should deselect the current node and close its top toolbar and lower prompt panel. Holding Control or Space should temporarily invert the active tool without changing the toolbar mode: Select becomes Move, and Move becomes range selection. After clicking any canvas-page button, pressing Space should only invert the tool and must not trigger that button again. Middle-button panning and additive node selection with Shift/Cmd should continue to work, while Space remains available inside text inputs and editable content.
 - English and Simplified Chinese switching across navigation, settings, titles, descriptions, Ant Design components, and persisted preferences.
 - Global Dropdown, Menu, Select, Cascader, and TreeSelect popup backgrounds, hover states, and selected states in both light and dark themes.
-- Canvas node resize stability, prompt scrolling, generated-prompt restoration, edit-prompt persistence after closing an existing image or text node panel, expanded prompt editing with save/cancel behavior and `@` references, image editing, drag-and-drop references, and generation configuration.
+- Canvas node resize stability, prompt scrolling, generated-prompt restoration, edit-prompt persistence after closing an existing image or text node panel, expanded prompt editing with live synchronization and `@` references, image editing, drag-and-drop references, and generation configuration.
 - Canvas side panel: clicking an element row should smoothly center and select its node without zooming above 100%; image elements with content should still open the large preview without triggering canvas focus.
 - Multi-image canvas generation: starting N images should immediately create one image node with N expandable slots and one incoming connection; each empty slot should independently show generating or failure while requests are running, every slot with image content should always display that image, and the first successful image should appear as the primary image immediately. The collapsed state should use a compact stack with at most three closely spaced backplates and a clearly legible count control; clicking the control should hide the floating toolbar and expand the slots upward and to the right. Every completed secondary image should keep a clearly legible primary-image action visible in both themes, and clicking the empty canvas should collapse the group.
 - Multi-image primary selection: choosing another primary image should preserve the node center and current maximum edge while adapting to the new image ratio; free-resize nodes should keep their exact dimensions, and the viewport zoom indicator must not change.

web/src/components/canvas/canvas-node-prompt-panel.tsx

@@ -41,7 +41,6 @@ export function CanvasNodePromptPanel({ node, isRunning, onPromptChange, onConfi
     const hasImageContent = node.type === CanvasNodeType.Image && Boolean(node.metadata?.content);
     const isEditingExistingContent = hasTextContent || hasImageContent;
     const [prompt, setPrompt] = useState(node.metadata?.composerContent ?? node.metadata?.prompt ?? "");
-    const [expandedPrompt, setExpandedPrompt] = useState("");
     const [expanded, setExpanded] = useState(false);
 
     // Restore prompts only when switching nodes; preserve the current input after generation on the same node.
@@ -63,15 +62,9 @@ export function CanvasNodePromptPanel({ node, isRunning, onPromptChange, onConfi
     };
 
     const openExpandedEditor = () => {
-        setExpandedPrompt(prompt);
         setExpanded(true);
     };
 
-    const saveExpandedPrompt = () => {
-        updatePrompt(expandedPrompt);
-        setExpanded(false);
-    };
-
     return (
         <div
             data-canvas-no-zoom
@@ -147,12 +140,12 @@ export function CanvasNodePromptPanel({ node, isRunning, onPromptChange, onConfi
                     </span>
                 </Button>
             </div>
-            <Modal title={t("canvas.promptPanel.editorTitle")} open={expanded} centered width={760} okText={t("common.done")} cancelText={t("common.cancel")} onOk={saveExpandedPrompt} onCancel={() => setExpanded(false)} destroyOnHidden>
+            <Modal title={t("canvas.promptPanel.editorTitle")} open={expanded} centered width={760} footer={null} onCancel={() => setExpanded(false)} destroyOnHidden>
                 <div data-canvas-no-zoom className="pt-2" onWheelCapture={(event) => event.stopPropagation()}>
                     <CanvasPromptChipInput
-                        value={expandedPrompt}
+                        value={prompt}
                         references={mentionReferences}
-                        onChange={setExpandedPrompt}
+                        onChange={updatePrompt}
                         className="thin-scrollbar h-[52dvh] min-h-80 w-full cursor-text overflow-y-auto rounded-xl border p-4 text-[15px] leading-6 outline-none"
                         style={{ background: "transparent", borderColor: theme.toolbar.border, color: theme.node.text }}
                         placeholder={t(`canvas.promptPanel.${mode === "image" && hasImageContent ? "editImage" : mode === "text" && hasTextContent ? "editText" : mode}`)}