chore(release): 4.4.0 [skip ci]

## [4.4.0](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.3.1...v4.4.0) (2025-10-16)

### Features

* **complement-race:** add mini app navigation bar ([ed0ef2d](ed0ef2d3b8))

CHANGELOG.md

@@ -1,3 +1,10 @@
+## [4.4.0](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.3.1...v4.4.0) (2025-10-16)
+
+
+### Features
+
+* **complement-race:** add mini app navigation bar ([ed0ef2d](https://github.com/antialias/soroban-abacus-flashcards/commit/ed0ef2d3b87324470d06b3246652967544caec26))
+
 ## [4.3.1](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.3.0...v4.3.1) (2025-10-16)
 
 

apps/web/src/arcade-games/complement-race/components/GameComponent.tsx

@@ -0,0 +1,59 @@
+/**
+ * Complement Race Game Component with Navigation
+ * Wraps the existing ComplementRaceGame with PageWithNav for arcade play
+ */
+
+'use client'
+
+import { useRouter } from 'next/navigation'
+import { PageWithNav } from '@/components/PageWithNav'
+import { ComplementRaceGame } from '@/app/arcade/complement-race/components/ComplementRaceGame'
+import { useComplementRace } from '../Provider'
+
+export function GameComponent() {
+  const router = useRouter()
+  const { state, exitSession, goToSetup } = useComplementRace()
+
+  // Get display name based on style
+  const getNavTitle = () => {
+    switch (state.style) {
+      case 'sprint':
+        return 'Steam Sprint'
+      case 'survival':
+        return 'Endless Circuit'
+      case 'practice':
+      default:
+        return 'Complement Race'
+    }
+  }
+
+  // Get emoji based on style
+  const getNavEmoji = () => {
+    switch (state.style) {
+      case 'sprint':
+        return '🚂'
+      case 'survival':
+        return '♾️'
+      case 'practice':
+      default:
+        return '🏁'
+    }
+  }
+
+  return (
+    <PageWithNav
+      navTitle={getNavTitle()}
+      navEmoji={getNavEmoji()}
+      emphasizePlayerSelection={state.gamePhase === 'controls'}
+      onExitSession={() => {
+        exitSession()
+        router.push('/arcade')
+      }}
+      onNewGame={() => {
+        goToSetup()
+      }}
+    >
+      <ComplementRaceGame />
+    </PageWithNav>
+  )
+}

apps/web/src/arcade-games/complement-race/index.tsx

@@ -7,7 +7,7 @@ import { defineGame } from '@/lib/arcade/game-sdk'
 import type { GameManifest } from '@/lib/arcade/game-sdk'
 import { complementRaceValidator } from './Validator'
 import { ComplementRaceProvider } from './Provider'
-import { ComplementRaceGame } from '@/app/arcade/complement-race/components/ComplementRaceGame'
+import { GameComponent } from './components/GameComponent'
 import type { ComplementRaceConfig, ComplementRaceState, ComplementRaceMove } from './types'
 
 // Game manifest
@@ -69,7 +69,7 @@ export const complementRaceGame = defineGame<
 >({
   manifest,
   Provider: ComplementRaceProvider,
-  GameComponent: ComplementRaceGame,
+  GameComponent,
   validator: complementRaceValidator,
   defaultConfig,
   validateConfig: validateComplementRaceConfig,

package.json

@@ -1,6 +1,6 @@
 {
   "name": "soroban-monorepo",
-  "version": "4.3.1",
+  "version": "4.4.0",
   "private": true,
   "description": "Beautiful Soroban Flashcard Generator - Monorepo",
   "workspaces": [