@mattfooosk/taste-react

The Taste runtime — <ThemeAdminProvider>, <SectionRegistryProvider>, <TasteAdmin /> drawer, and <TasteSection> wrappers. Ship the Taste admin drawer inside your app; let your users adjust the theme, add sections, and edit content live.

Status: 0.1.0-alpha.0 — SCAFFOLD ONLY, not yet published. This package's src/ is currently a barrel export with no code. Phase 2 (planned) copies the four runtime files from site/src/ here and rewrites imports. Phase 3 publishes to npm. Until phase 3, follow the file-drop install path in docs/TASTE_ADMIN.md.

Part of the Taste product. Separate from the @mattfooosk/taste CLI — the CLI installs the agent pack + a theme spec into your repo; this package is the customer runtime layer.

What this package will ship (once phase 2 lands)

• ThemeAdminProvider — runtime state for the admin panel. One provider, one state object, one localStorage key. Every knob routes through here.
• SectionRegistryProvider — data-driven page composition. routes[<path>] = SectionInstance[] is the source of truth for what renders in what order.
• TasteAdmin — the drawer UI. Right-side slide-in with Theme + Sections tabs, tier-gated controls.
• TasteSection / TastePage — per-slot or per-route wrappers you use in your page code.
• Sub-export: @mattfooosk/taste-react/sections-library — 8 library section templates (headline, quote-band, feature-tile, etc.) with editable props. Split into a subpath so a customer who wants only the providers + drawer doesn't ship the templates.

Peer dependencies

| Package | Range | Why | |---|---|---| | react | ^18.0.0 || ^19.0.0 | Provider + hook API. | | react-dom | ^18.0.0 || ^19.0.0 | Same. | | react-router-dom | ^6.0.0 || ^7.0.0 | TasteAdmin uses useLocation for route-scoped section registry. Non-router apps (Next.js app router, TanStack Router) are a v0.2 followup — will inject the current-route hook as a prop. |

The install path we're building toward

Phase 3 install (once taste init scaffolds the wiring):

npx @mattfooosk/taste init

...will:

1. Install @mattfooosk/taste-react as a dependency.
2. Scaffold the wire-up code into your app root (a <ThemeAdminProvider> + <SectionRegistryProvider> wrapping your router).
3. Scaffold a <TasteAdmin upgradeHref="/pricing" /> mount at the same root.
4. Register the theme you picked in the wizard.

Today (file-drop) that's a manual copy from site/src/. See docs/TASTE_ADMIN.md.

Phase 2 checklist (planned — do not run yet)

• [ ] Copy site/src/lib/theme-admin.tsx → packages/taste-react/src/lib/theme-admin.tsx.
• [ ] Copy site/src/lib/section-registry.tsx → packages/taste-react/src/lib/section-registry.tsx.
• [ ] Copy site/src/components/admin/TasteAdmin.tsx → packages/taste-react/src/components/TasteAdmin.tsx.
• [ ] Copy site/src/components/TasteSection.tsx → packages/taste-react/src/components/TasteSection.tsx.
• [ ] Copy site/src/components/sections-library/ → packages/taste-react/src/sections-library/.
• [ ] Rewrite @/lib/* and @/components/* imports to relative paths.
• [ ] Populate src/index.ts barrel with the public exports.
• [ ] Populate src/sections-library/index.tsx barrel with LIBRARY, templateFor, LibrarySectionRenderer, FieldSchema.
• [ ] Site repo: swap import { … } from "@/lib/theme-admin" for import { … } from "@mattfooosk/taste-react". Do this via a workspace symlink first (npm install @mattfooosk/taste-react in site pointing at ../packages/taste-react), then delete the site-side copies.
• [ ] Add workspaces: ["cli", "packages/*"] to root package.json at the same time as the site swap.
• [ ] Verify site still builds + runs end-to-end (all 12 routes, admin drawer opens, reorder works).

Phase 3 checklist (planned — after Matt's review of phases 1 + 2)

• [ ] npm publish from packages/taste-react/. Bump version from 0.1.0-alpha.0 to 0.1.0 first.
• [ ] cli/src/commands/init.ts — add a step that runs npm install @mattfooosk/taste-react in the customer's repo and scaffolds the wire-up code into their app root.
• [ ] docs/TASTE_ADMIN.md — replace the "file-drop from site repo" section with npm install @mattfooosk/taste-react + the minimal wire-up example.
• [ ] Root README.md line about "runtime provider files are file-drop today" — swap to describe the npm install path.

Why extract at all

VP-Arch flagged this as SEVERE in TODO.md: "two products in one repo." The CLI's install path claims to wire the runtime layer; the runtime layer only exists as hand-copyable files in a separate marketing-site repo. A customer who runs npx @mattfooosk/taste init gets agents + a theme spec, but has to manually copy 5 files from a different repo to actually use the admin drawer that the docs advertise. Extraction closes that gap for real.

License

FSL-1.1-Apache-2.0 — same as the rest of the Taste repo.