# OpenSpec Change: enterprise-gaming-r3f-minimap

- **Change ID**: enterprise-gaming-r3f-minimap
- **Package**: `@suaveplan/r3f-minimap`
- **Category**: gaming/gameplay
- **Target path**: `gaming/gameplay/r3f-minimap`
- **Status**: PROPOSED
- **Date**: 2026-04-24

---

## Summary

Deliver `@suaveplan/r3f-minimap` on the genesis branch from scratch at enterprise quality. The package renders a real-time minimap inside React Three Fiber using an offscreen orthographic camera rendering to a `WebGLRenderTarget`: `MinimapCamera` drives the render target, `MinimapRenderer` composites the texture onto a `<Html>` or `<Plane>` overlay, `EntityMarkers` places icons/dots for tracked entities, `FogOfWarLayer` masks unexplored areas with a canvas-painted alpha texture, and `useMinimapRegion` exposes world-to-map coordinate conversion. Genesis adds 100% coverage and Storybook stories.

---

## Available workspace deps

`@suaveplan/error`, `@suaveplan/types`, `@suaveplan/events`, react, `@react-three/fiber`, `@react-three/drei`, three.

---

## Public API surface

```ts
interface MinimapOptions {
  worldSize: number      // world units covered
  resolution: number     // render target px
  rotation?: number      // map rotation offset
  zoom?: number
}

function MinimapProvider(props: MinimapProviderProps): JSX.Element
function MinimapRenderer(props: MinimapRendererProps): JSX.Element
// size (CSS px), border, shape: 'circle' | 'square'

function EntityMarkers(props: EntityMarkersProps): JSX.Element
// entities: TrackedEntity[], iconMap

function FogOfWarLayer(props: FogOfWarLayerProps): JSX.Element
// revealRadius, color, opacity

function useMinimapRegion(): MinimapRegionContext
// worldToMap(v3): Vector2, mapToWorld(v2): Vector3, revealAt(v3, radius)
```

---

## File layout

```text
gaming/gameplay/r3f-minimap/
  package.json / tsconfig.json / vitest.config.ts
  src/
    index.ts / error-codes.ts
    types/common.ts + md
    context/minimap-provider.tsx + md + test
    hooks/use-minimap-region.ts + md + test
    components/
      MinimapRenderer/ (tsx + md + test + stories + index)
      EntityMarkers/ (tsx + md + test + stories + index)
      FogOfWarLayer/ (tsx + md + test + stories + index)
  tests/integration.test.ts
```