GenarrativeAI/Genarrative
12
0
Fork 0
Code Issues 36 Pull Requests 7 Actions Packages Projects 1 Releases Wiki Activity

对齐规范固定参数禁用态样式

Browse Source 
生成规范固定参数复用可编辑面板参数胶囊按钮样式。

固定比例尺寸和模型按钮保持禁用不可点击且不弹出选项。

补充面板测试覆盖禁用态和不可展开行为。

更新编辑器 Lovart 面板与图片画布技术文档。
This commit is contained in:
包仲航
2026-06-18 18:51:53 +08:00
parent 9c7b3ad16d
commit eb855644d5
5 changed files with 59 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/image-editor/ImageCanvasSpecGenerationPanelView.test.tsx
+18 -8
View File
@@ -89,15 +89,25 @@ describe('ImageCanvasSpecGenerationPanelView', () => {
).toBe(true);
const submitButton = screen.getByRole('button', { name: '提交生成规范' });
expect(submitButton.textContent).toBe('生成5泥点');
expect(screen.getByLabelText('生成规范固定参数').textContent).toBe(
'16:92Kgpt-image-2',
const dimensionsButton = screen.getByRole('button', {
name: '生成图片尺寸 16:9 · 2K',
}) as HTMLButtonElement;
const modelButton = screen.getByRole('button', {
name: '生成图片模型 gpt-image-2',
}) as HTMLButtonElement;
expect(dimensionsButton.disabled).toBe(true);
expect(modelButton.disabled).toBe(true);
expect(dimensionsButton.className).toContain(
'image-canvas-editor__option-cluster--dimensions',
);
expect(
screen.queryByRole('button', { name: /生成图片尺寸/u }),
).toBeNull();
expect(
screen.queryByRole('button', { name: /生成图片模型/u }),
).toBeNull();
expect(modelButton.className).toContain(
'image-canvas-editor__option-cluster--model',
);
fireEvent.click(dimensionsButton);
fireEvent.click(modelButton);
expect(screen.queryByRole('menu', { name: '生成图片尺寸选项' })).toBeNull();
expect(screen.queryByRole('menu', { name: '生成图片模型选项' })).toBeNull();
});
it('renders UI design as a single borderless prompt below the first reference row', () => {
src/components/image-editor/ImageCanvasSpecGenerationPanelView.tsx
+27 -8
View File
@@ -1,4 +1,4 @@
import { ClipboardList, ImagePlus } from 'lucide-react';
import { ClipboardList, Cpu, ImagePlus } from 'lucide-react';
import {
type CSSProperties,
type Dispatch,
@@ -13,6 +13,7 @@ import {
PlatformFloatingMenu,
PlatformFloatingMenuItem,
} from '../common/PlatformFloatingMenu';
import { PlatformInlineOptionButton } from '../common/PlatformInlineOptionButton';
import { PlatformStatusMessage } from '../common/PlatformStatusMessage';
import {
PlatformSelectField,
@@ -357,13 +358,31 @@ export function ImageCanvasSpecGenerationPanelView({
/>
) : (
<>
<div
className="image-canvas-editor__readonly-generation-options"
aria-label="生成规范固定参数"
>
<span>{SPEC_GENERATION_ASPECT_RATIO}</span>
<span>{SPEC_GENERATION_IMAGE_SIZE}</span>
<span>{SPEC_GENERATION_MODEL}</span>
<div className="image-canvas-editor__option-popover-anchor image-canvas-editor__option-popover-anchor--dimensions image-canvas-editor__readonly-generation-option">
<PlatformInlineOptionButton
className="image-canvas-editor__option-cluster image-canvas-editor__option-cluster--dimensions"
aria-label={`生成图片尺寸 ${SPEC_GENERATION_ASPECT_RATIO} · ${SPEC_GENERATION_IMAGE_SIZE}`}
disabled
>
{SPEC_GENERATION_ASPECT_RATIO} · {SPEC_GENERATION_IMAGE_SIZE}
</PlatformInlineOptionButton>
</div>
<div className="image-canvas-editor__option-popover-anchor image-canvas-editor__option-popover-anchor--model image-canvas-editor__readonly-generation-option">
<PlatformInlineOptionButton
className="image-canvas-editor__option-cluster image-canvas-editor__option-cluster--model"
aria-label={`生成图片模型 ${SPEC_GENERATION_MODEL}`}
disabled
>
<span className="image-canvas-editor__model-trigger-label">
<span
className="image-canvas-editor__model-icon"
aria-hidden="true"
>
<Cpu />
</span>
<span>{SPEC_GENERATION_MODEL}</span>
</span>
</PlatformInlineOptionButton>
</div>
<PlatformActionButton
type="submit"