Composing Multiple Hooks
Combine multiple hooks to create powerful abstractions.
Basic Composition
Section titled “Basic Composition”export function withGameState(scene: Phaser.Scene) { const player = withPlayer(scene); const inventory = withInventory(scene); const quests = withQuests(scene);
return { player, inventory, quests };}
// Usageconst game = withGameState(this);game.player.takeDamage(10);game.inventory.addItem('sword');game.quests.complete('tutorial');Computed from Multiple Sources
Section titled “Computed from Multiple Sources”export function withCombatStats(scene: Phaser.Scene) { const player = withPlayer(scene); const equipment = withEquipment(scene);
return { totalAttack: () => { const p = player.get(); const eq = equipment.get(); return p.baseAttack + eq.weapon.attack + eq.armor.bonus; },
totalDefense: () => { const p = player.get(); const eq = equipment.get(); return p.baseDefense + eq.armor.defense + eq.shield.block; },
canEquip: (item: Item) => { const p = player.get(); return p.level >= item.requiredLevel; } };}Coordinated Updates
Section titled “Coordinated Updates”export function withGameActions(scene: Phaser.Scene) { const player = withPlayer(scene); const enemies = withEnemies(scene); const ui = withUI(scene);
return { attack: (enemyId: string) => { const damage = calculateDamage(player.get(), enemies.getEnemy(enemyId)); enemies.damageEnemy(enemyId, damage); ui.showDamageNumber(enemyId, damage); player.gainExp(10); },
usePotion: () => { const inventory = withInventory(scene); if (inventory.hasItem('potion')) { inventory.removeItem('potion'); player.heal(50); ui.showHealEffect(); } } };}Global + Local Composition
Section titled “Global + Local Composition”export function withGame(scene: Phaser.Scene) { // Global state (persists across scenes) const settings = withSettings(scene); const progress = withGameProgress(scene);
// Local state (scene-specific) const player = withPlayer(scene); const level = withLevel(scene);
return { settings, progress, player, level,
// Coordinated methods completeLevel: (score: number) => { progress.unlockLevel(level.get().number + 1); progress.setHighScore(level.get().number, score); progress.patch({ currentLevel: level.get().number + 1 });
// Navigate to next level scene.scene.start('LevelSelectScene'); } };}