复用平台文本域收口生成提示词

编辑器画布内生成输入框和修改图片弹窗提示词改为复用 PlatformTextField。

删除编辑器按 textarea 标签选择器维护基础输入 chrome 的做法，仅保留局部尺寸与样式覆盖。

补充测试覆盖生成提示词共享文本域样式，并更新 TRACKING。

TRACKING.md

@@ -99,3 +99,4 @@
 - 2026-06-14 组件复用修正：编辑器生成输入框的提交按钮改为复用 `PlatformActionButton`，仅保留生成器局部尺寸和 Lovart 式浅灰覆盖，不再直接维护原生 submit 按钮基础 chrome；验证命令：`npm run test -- src/components/image-editor/ImageCanvasEditorView.test.tsx src/components/common/PlatformActionButton.test.tsx`、`npm run typecheck`。
 - 2026-06-14 组件复用修正：编辑器生成输入框的“参考图”按钮改为复用 `PlatformIconButton variant="surfaceFloating"`，用 children 承载短标签，仅保留生成器局部尺寸和浅灰覆盖；验证命令：`npm run test -- src/components/image-editor/ImageCanvasEditorView.test.tsx src/components/common/PlatformIconButton.test.tsx`、`npm run typecheck`。
 - 2026-06-14 组件复用修正：编辑器生成图右上角元数据角标改为复用 `PlatformIconButton asChild="spanButton"`，保留嵌套在图层按钮内的合法 DOM 结构，同时把 Enter / Space 键盘触发和 `darkMini` chrome 收口到共享组件；验证命令：`npm run test -- src/components/common/PlatformIconButton.test.tsx src/components/image-editor/ImageCanvasEditorView.test.tsx`、`npm run typecheck`。
+- 2026-06-14 组件复用修正：编辑器画布内生成输入框和“修改图片”弹窗提示词改为复用 `PlatformTextField variant="textarea"`，删除编辑器里按标签选择器手写 textarea 基础输入 chrome 的做法，仅保留生成器局部尺寸和 Lovart 式覆盖；验证命令：`npm run test -- src/components/image-editor/ImageCanvasEditorView.test.tsx src/components/common/PlatformTextField.test.tsx`、`npm run typecheck`。

src/components/image-editor/ImageCanvasEditorView.test.tsx

@@ -737,6 +737,11 @@ describe('ImageCanvasEditorView', () => {
     expect(
       within(generateDialog).getByRole('button', { name: '添加参考图' }).className,
     ).toContain('image-canvas-editor__generation-ref');
+    const generatePrompt = screen.getByLabelText('生成提示词');
+    expect(generatePrompt.className).toContain('platform-text-field');
+    expect(generatePrompt.className).toContain(
+      'image-canvas-editor__generation-prompt',
+    );
     expect(within(generateDialog).getByRole('button', { name: '生成比例 1:1 2k 1张' })).toBeTruthy();
     expect(within(generateDialog).getByRole('button', { name: '生成模型 GPT Image' })).toBeTruthy();
     expect(within(generateDialog).getByRole('button', { name: '生成' }).className).toContain(
@@ -1077,7 +1082,10 @@ describe('ImageCanvasEditorView', () => {
     fireEvent.click(screen.getByRole('button', { name: '修改图片' }));
     const editDialog = screen.getByRole('dialog', { name: '修改图片' });
     expect(editDialog).toBeTruthy();
-    fireEvent.change(screen.getByLabelText('生成提示词'), {
+    const editPrompt = screen.getByLabelText('生成提示词');
+    expect(editPrompt.className).toContain('platform-text-field');
+    expect(editPrompt.className).toContain('image-canvas-editor__generate-prompt');
+    fireEvent.change(editPrompt, {
       target: { value: '把画面改成黄昏光线' },
     });
     fireEvent.click(screen.getByRole('button', { name: '修改' }));

src/components/image-editor/ImageCanvasEditorView.tsx

@@ -71,6 +71,7 @@ import {
 } from '../common/PlatformFloatingMenu';
 import { PlatformIconButton } from '../common/PlatformIconButton';
 import { PlatformStatusMessage } from '../common/PlatformStatusMessage';
+import { PlatformTextField } from '../common/PlatformTextField';
 import { UnifiedModal } from '../common/UnifiedModal';
 
 type EditorAsset = {
@@ -2786,11 +2787,15 @@ export function ImageCanvasEditorView() {
               >
                 <span>参考图</span>
               </PlatformIconButton>
-              <textarea
+              <PlatformTextField
+                variant="textarea"
                 aria-label="生成提示词"
                 value={generateDialog.prompt}
                 disabled={generateDialog.status === 'generating'}
                 placeholder="今天我们要创作什么"
+                size="sm"
+                density="compact"
+                className="image-canvas-editor__generation-prompt"
                 onChange={(event) =>
                   setGenerateDialog((currentDialog) =>
                     currentDialog
@@ -2934,10 +2939,14 @@ export function ImageCanvasEditorView() {
             }}
           >
             <div className="image-canvas-editor__generate-body">
-              <textarea
+              <PlatformTextField
+                variant="textarea"
                 aria-label="生成提示词"
                 value={generateDialog.prompt}
                 disabled={generateDialog.status === 'generating'}
+                size="sm"
+                density="roomy"
+                className="image-canvas-editor__generate-prompt"
                 placeholder={
                   generateDialog.mode === 'edit'
                     ? '描述你想如何修改这张图片'

src/index.css

@@ -4066,7 +4066,7 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
   margin-top: -0.4rem;
 }
 
-.image-canvas-editor__generation-composer textarea {
+.image-canvas-editor__generation-prompt {
   min-height: 5.8rem;
   resize: none;
   border: 0;
@@ -4079,7 +4079,7 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
   outline: none;
 }
 
-.image-canvas-editor__generation-composer textarea::placeholder {
+.image-canvas-editor__generation-prompt::placeholder {
   color: #b5b5b5;
 }
 
@@ -4202,7 +4202,7 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
   padding: 0.85rem;
 }
 
-.image-canvas-editor__generate-body textarea {
+.image-canvas-editor__generate-prompt {
   min-height: 7rem;
   resize: vertical;
   border: 1px solid #d9dee8;
@@ -4216,7 +4216,7 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
   outline: none;
 }
 
-.image-canvas-editor__generate-body textarea:focus {
+.image-canvas-editor__generate-prompt:focus {
   border-color: #38bdf8;
   background: #ffffff;
   box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.18);