收口创作类型弹层卡片组件
创作类型弹层玩法卡片改用 PlatformSubpanel 按钮壳 补充开放卡和忙碌禁用态测试断言 补充 PlatformUiKit 收口文档和 Hermes 决策记录
This commit is contained in:
@@ -68,11 +68,55 @@ test('dispatches wooden fish creation type selection', () => {
|
||||
/>,
|
||||
);
|
||||
|
||||
fireEvent.click(screen.getByRole('button', { name: /敲木鱼/u }));
|
||||
const woodenFishCard = screen.getByRole('button', { name: /敲木鱼/u });
|
||||
|
||||
expect(woodenFishCard.className).toContain('platform-subpanel');
|
||||
expect(woodenFishCard.className).toContain(
|
||||
'platform-creation-reference-card',
|
||||
);
|
||||
expect(woodenFishCard.className).toContain('platform-interactive-card');
|
||||
expect(woodenFishCard.getAttribute('type')).toBe('button');
|
||||
|
||||
fireEvent.click(woodenFishCard);
|
||||
|
||||
expect(onSelectWoodenFish).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
test('disables open creation type card while busy', () => {
|
||||
const onSelectWoodenFish = vi.fn();
|
||||
|
||||
render(
|
||||
<PlatformEntryCreationTypeModal
|
||||
isOpen
|
||||
isBusy
|
||||
entryConfig={entryConfig}
|
||||
creationTypes={derivePlatformCreationTypes(entryConfig.creationTypes)}
|
||||
onClose={() => {}}
|
||||
onSelectRpg={() => {}}
|
||||
onSelectBigFish={() => {}}
|
||||
onSelectMatch3D={() => {}}
|
||||
onSelectSquareHole={() => {}}
|
||||
onSelectJumpHop={() => {}}
|
||||
onSelectWoodenFish={onSelectWoodenFish}
|
||||
onSelectPuzzle={() => {}}
|
||||
onSelectCreativeAgent={() => {}}
|
||||
onSelectBarkBattle={() => {}}
|
||||
onSelectVisualNovel={() => {}}
|
||||
onSelectBabyObjectMatch={() => {}}
|
||||
/>,
|
||||
);
|
||||
|
||||
const woodenFishCard = screen.getByRole('button', { name: /敲木鱼/u });
|
||||
|
||||
expect((woodenFishCard as HTMLButtonElement).disabled).toBe(true);
|
||||
expect(woodenFishCard.className).toContain('platform-subpanel');
|
||||
expect(woodenFishCard.className).toContain('opacity-70');
|
||||
|
||||
fireEvent.click(woodenFishCard);
|
||||
|
||||
expect(onSelectWoodenFish).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
test('renders locked creation type badge with PlatformPillBadge', () => {
|
||||
const onSelectWoodenFish = vi.fn();
|
||||
const woodenFishEntry = entryConfig.creationTypes[0]!;
|
||||
|
||||
@@ -3,6 +3,7 @@ import { ArrowRight, LockKeyhole } from 'lucide-react';
|
||||
import type { CreationEntryConfig } from '../../services/creationEntryConfigService';
|
||||
import { PlatformIconBadge } from '../common/PlatformIconBadge';
|
||||
import { PlatformPillBadge } from '../common/PlatformPillBadge';
|
||||
import { PlatformSubpanel } from '../common/PlatformSubpanel';
|
||||
import { UnifiedModal } from '../common/UnifiedModal';
|
||||
import {
|
||||
getVisiblePlatformCreationTypes,
|
||||
@@ -38,11 +39,16 @@ function CreationTypeCard(props: {
|
||||
const lockedBadge = item.badge.trim() || '暂未开放';
|
||||
|
||||
return (
|
||||
<button
|
||||
<PlatformSubpanel
|
||||
as="button"
|
||||
type="button"
|
||||
surface="platform"
|
||||
radius="xl"
|
||||
padding="none"
|
||||
interactive={!item.locked}
|
||||
disabled={disabled}
|
||||
onClick={onSelect}
|
||||
className={`platform-creation-reference-card platform-interactive-card relative flex min-h-[10rem] flex-col overflow-hidden rounded-[1.65rem] border p-0 text-left ${
|
||||
className={`platform-creation-reference-card platform-interactive-card relative flex min-h-[10rem] flex-col overflow-hidden border text-left ${
|
||||
item.locked
|
||||
? 'cursor-not-allowed border-[var(--platform-subpanel-border)] bg-[var(--platform-subpanel-fill)] text-white'
|
||||
: 'border-[var(--platform-cool-border)] bg-white text-white'
|
||||
@@ -94,7 +100,7 @@ function CreationTypeCard(props: {
|
||||
{item.subtitle}
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</PlatformSubpanel>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user