Initial Commit

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

@@ -0,0 +1,75 @@
+# OpenSpec Change: enterprise-gaming-react-crafting
+
+- **Change ID**: enterprise-gaming-react-crafting
+- **Package**: `@suaveplan/react-crafting`
+- **Category**: gaming/react
+- **Target path**: `gaming/react/react-crafting`
+- **Status**: PROPOSED
+- **Date**: 2026-04-24
+- **Reference spec**: `/mnt/s/web/suaveplan/enterprise/react-crafting.md`
+
+---
+
+## Summary
+
+Deliver `@suaveplan/react-crafting` on the genesis branch from scratch at enterprise quality. The package is the headless React layer around `@suaveplan/crafting`. A `CraftingUIManager` wraps a `CraftingStation` and `RecipeRegistry`; `useCrafting()` provides state via `useSyncExternalStore`; components render the recipe browser (filtered list with ingredient requirements), the crafting queue (active jobs with progress bars), and the output result notification. Genesis adds Storybook stories, 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/crafting` (`workspace:^`) | `CraftingStation`, `RecipeRegistry` |
+| `@suaveplan/events` (`workspace:^`) | Craft event subscriptions |
+| `react` (`catalog:react`) | React 18 |
+
+---
+
+## Public API surface
+
+```ts
+function createCraftingUIManager(station: CraftingStation, registry: RecipeRegistry): CraftingUIManager
+function useCrafting(): CraftingUIState
+
+// Components
+function RecipeBrowser(props: RecipeBrowserProps): JSX.Element
+function RecipeCard(props: RecipeCardProps): JSX.Element
+function CraftQueue(props: CraftQueueProps): JSX.Element
+function CraftProgress(props: CraftProgressProps): JSX.Element
+function CraftResult(props: CraftResultProps): JSX.Element
+```
+
+---
+
+## File layout
+
+```text
+gaming/react/react-crafting/
+  package.json
+  tsconfig.json
+  vitest.config.ts
+  src/
+    index.ts
+    types/common.ts + md
+    state/crafting-ui-manager.ts + md + test
+    hooks/use-crafting.ts + md + test
+    components/
+      recipe-browser/ (tsx + md + test + stories + index)
+      recipe-card/ (tsx + md + test + stories + index)
+      craft-queue/ (tsx + md + test + stories + index)
+      craft-progress/ (tsx + md + test + stories + index)
+      craft-result/ (tsx + md + test + stories + index)
+```
+
+---
+
+## Impact
+
+**Downstream**: game apps show crafting UI in station interaction panel. Prerequisites: `@suaveplan/crafting`, `@suaveplan/events`, react.

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

@@ -0,0 +1,36 @@
+# Tasks: enterprise-gaming-react-crafting
+
+## 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-crafting/` (`@suaveplan/react-crafting`, `0.1.0`, `sideEffects: false`)
+
+## Phase 2 — Types
+
+- [ ] `src/types/common.ts` + `common.md`
+
+## Phase 3 — UI manager + hook
+
+- [ ] `CraftingUIManager` wraps station + registry; exposes recipe list, queue, can-craft status
+- [ ] `useCrafting` via `useSyncExternalStore`
+- [ ] Tests + docs for both
+
+## Phase 4 — Components
+
+- [ ] `RecipeBrowser` — filterable list of recipes with affordability indicators
+- [ ] `RecipeCard` — ingredient list, output preview, craft button
+- [ ] `CraftQueue` — list of active jobs
+- [ ] `CraftProgress` — animated progress bar for one job
+- [ ] `CraftResult` — output item notification toast
+- [ ] Tests + Storybook stories for each
+
+## Phase 5 — Pre-publish gate
+
+- [ ] `bunx turbo lint typecheck test --filter=@suaveplan/react-crafting` green
+- [ ] 100% coverage
+- [ ] Publish: `bun scripts/publish.ts --package @suaveplan/react-crafting`