55cba1495f
Advance the wizard immediately when selecting game type, break rule, race-to quick picks, and completed break-order choices for a consistent tap-first flow. Made-with: Cursor
New Game Wizard (@lib/features/new-game)
Composable building blocks for the multi-step "start a new game" workflow.
Exports
PlayerNameStep– Configurable player name capture step with history + quick picks.GameTypeStep– Game type selector.RaceToStep– Numeric race-to chooser with infinity support.BreakRuleStep,BreakOrderStep– Break configuration helpers.PlayerSelectModal– Modal surface for long player lists.
All exports are surfaced via @lib/features/new-game.
Props & Contracts
- Steps expect pure callbacks (
onNext,onCancel) and derive their own UI state. - Player history arrays control quick-pick ordering. Empty arrays fall back gracefully.
- Styling is shared via
NewGame.module.cssto keep a consistent visual language.
Integrating the Wizard
import { PlayerNameStep } from '@lib/features/new-game';
import { useNewGameWizard } from '@lib/state';
const wizard = useNewGameWizard();
return (
<>
{wizard.newGameStep === 'player1' && (
<PlayerNameStep
stepNumber={1}
title="Name Spieler 1"
label="Spieler 1"
placeholder="Name Spieler 1"
inputId="player1-input"
playerInputClassName={styles['player1-input']}
playerNameHistory={playerHistory}
onNext={(name) => {
wizard.updateGameData({ player1: name });
wizard.nextStep('player2');
}}
onCancel={wizard.resetWizard}
required
requiredErrorMessage="Bitte Namen für Spieler 1 eingeben"
enterKeyHint="next"
showMorePlayersModal
/>
)}
{/* render subsequent steps analogously */}
</>
);