抽取内联选项按钮原语

新增 PlatformInlineOptionButton,统一承接当前选项加下拉箭头的轻量按钮 chrome。

编辑器生成输入框的比例和模型按钮改为复用平台内联选项按钮。

补充原语测试和编辑器共享样式断言,并更新 TRACKING。
This commit is contained in:
2026-06-14 15:04:10 +08:00
parent 20826e2e60
commit d1f1cfdcca
6 changed files with 103 additions and 12 deletions
@@ -742,8 +742,16 @@ describe('ImageCanvasEditorView', () => {
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: '生成比例 1:1 2k 1张',
}).className,
).toContain('platform-inline-option-button');
expect(
within(generateDialog).getByRole('button', {
name: '生成模型 GPT Image',
}).className,
).toContain('platform-inline-option-button');
expect(within(generateDialog).getByRole('button', { name: '生成' }).className).toContain(
'platform-button',
);
@@ -70,6 +70,7 @@ import {
PlatformFloatingMenuItem,
} from '../common/PlatformFloatingMenu';
import { PlatformIconButton } from '../common/PlatformIconButton';
import { PlatformInlineOptionButton } from '../common/PlatformInlineOptionButton';
import { PlatformStatusMessage } from '../common/PlatformStatusMessage';
import { PlatformTextField } from '../common/PlatformTextField';
import { UnifiedModal } from '../common/UnifiedModal';
@@ -2816,26 +2817,24 @@ export function ImageCanvasEditorView() {
}
/>
<div className="image-canvas-editor__generation-composer-footer">
<button
type="button"
<PlatformInlineOptionButton
className="image-canvas-editor__generation-ratio"
aria-label="生成比例 1:1 2k 1张"
disabled={generateDialog.status === 'generating'}
onClick={() => triggerPlaceholderAction('生成参数')}
trailingIcon={<ChevronDown className="h-3 w-3" />}
>
· 1:1(2k) · 1
<ChevronDown className="h-3 w-3" />
</button>
<button
type="button"
</PlatformInlineOptionButton>
<PlatformInlineOptionButton
className="image-canvas-editor__generation-model"
aria-label="生成模型 GPT Image"
disabled={generateDialog.status === 'generating'}
onClick={() => triggerPlaceholderAction('模型选择')}
trailingIcon={<ChevronDown className="h-3 w-3" />}
>
GPT Im...
<ChevronDown className="h-3 w-3" />
</button>
</PlatformInlineOptionButton>
<PlatformActionButton
type="submit"
tone="secondary"