Initial Commit

openspec/changes/enterprise-gaming-react-controller/proposal.md

@@ -0,0 +1,74 @@
+# OpenSpec Change: enterprise-gaming-react-controller
+
+- **Change ID**: enterprise-gaming-react-controller
+- **Package**: `@suaveplan/react-controller`
+- **Category**: gaming/react
+- **Target path**: `gaming/react/react-controller`
+- **Status**: PROPOSED
+- **Date**: 2026-04-24
+- **Reference spec**: `/mnt/s/web/suaveplan/enterprise/react-controller.md`
+
+---
+
+## Summary
+
+Deliver `@suaveplan/react-controller` on the genesis branch from scratch at enterprise quality. The package is the React touch/mouse game-controller kit. It composes a `Document` root (window-level event manager), a `VirtualJoystick` component (on-screen analog stick), and `ActionButton` components for on-screen digital inputs — all wired to `@suaveplan/controller`'s virtual adapter. A `useController()` hook exposes action states via `useSyncExternalStore`. Genesis adds Storybook stories for mobile/desktop layouts, Vitest DOM tests, and 100% coverage.
+
+---
+
+## Current-state audit (genesis)
+
+Package does not exist on genesis yet — fresh build.
+
+---
+
+## Available workspace deps on genesis
+
+| Package | Role |
+|---|---|
+| `@suaveplan/controller` (`workspace:^`) | Virtual adapter, `ControllerManager` |
+| `react` (`catalog:react`) | React 18 |
+
+---
+
+## Public API surface
+
+```ts
+function useController(manager: ControllerManager): ControllerState
+interface ControllerState {
+  isPressed(action: string): boolean
+  getAxis(action: string): number
+}
+
+// Components
+function ControllerDocument(props: ControllerDocumentProps): JSX.Element   // root keyboard/mouse listener
+function VirtualJoystick(props: VirtualJoystickProps): JSX.Element         // touch joystick
+function ActionButton(props: ActionButtonProps): JSX.Element               // digital button
+function DPad(props: DPadProps): JSX.Element                               // 4-way dpad
+```
+
+---
+
+## File layout
+
+```text
+gaming/react/react-controller/
+  package.json
+  tsconfig.json
+  vitest.config.ts
+  src/
+    index.ts
+    types/common.ts + md
+    hooks/use-controller.ts + md + test
+    components/
+      controller-document/ (tsx + md + test + stories + index)
+      virtual-joystick/ (tsx + md + test + stories + index)
+      action-button/ (tsx + md + test + stories + index)
+      d-pad/ (tsx + md + test + stories + index)
+```
+
+---
+
+## Impact
+
+**Downstream**: `@suaveplan/r3f-controller` combines this with R3F camera control. Prerequisites: `@suaveplan/controller`, react.

openspec/changes/enterprise-gaming-react-controller/tasks.md

@@ -0,0 +1,34 @@
+# Tasks: enterprise-gaming-react-controller
+
+## 0. Pre-flight (non-negotiable)
+
+- [ ] 0.1 Confirm clean working tree (`git status` reports nothing) and no in-flight worktrees with uncommitted work (`git worktree list` then `git status` in each)
+- [ ] 0.2 If any worktrees exist under `.claude/worktrees/`, account for each one: still-active agent, work-pending-merge, or stale-and-prune. Stale worktrees MUST be removed (`git worktree remove`) before opening a new one — code that has been lost twice on main is the failure mode this guards against.
+- [ ] 0.3 Confirm the package set in `MANIFEST.md` matches `find packages -maxdepth 3 -name package.json` count. Drift here means a prior change archived without regenerating the manifest.
+
+## Phase 1 — Scaffold
+
+- [ ] Create `gaming/react/react-controller/` (`@suaveplan/react-controller`, `0.1.0`, `sideEffects: false`)
+
+## Phase 2 — Types
+
+- [ ] `src/types/common.ts` + `common.md`
+
+## Phase 3 — `useController` hook
+
+- [ ] `useSyncExternalStore` wrapping virtual adapter snapshot
+- [ ] Tests + docs
+
+## Phase 4 — Components
+
+- [ ] `ControllerDocument` — window-level keyboard/mouse event wiring to virtual adapter
+- [ ] `VirtualJoystick` — touch-start/move/end → axis values
+- [ ] `ActionButton` — pointer-down/up → digital press
+- [ ] `DPad` — 4-direction → 2 axis actions
+- [ ] Tests + Storybook stories for each
+
+## Phase 5 — Pre-publish gate
+
+- [ ] `bunx turbo lint typecheck test --filter=@suaveplan/react-controller` green
+- [ ] 100% coverage
+- [ ] Publish: `bun scripts/publish.ts --package @suaveplan/react-controller`