Full-page compositions showing how Eddie components come together.

Templates are complete page compositions that demonstrate how Eddie components, recipes, and layout patterns combine into real interfaces. They live in the packages/eddie-templates/ package.

Purpose

Templates serve three audiences:

  1. Designers — See how components compose into real interfaces
  2. Developers — Copy a template to bootstrap a new page
  3. AI assistants — Structured examples of Eddie APIs in context

Viewing Templates

Templates are rendered in Storybook under Templates with full documentation of which components each template uses and what layout patterns it demonstrates:

Browse Templates in Storybook →

Adding a Template

  1. Create templates/<product>/<template-name>/
  2. Add <template-name>.ts — extend LitElement, register with ed-t- prefix
  3. Add <template-name>.stories.ts — set title to Templates/<Product>/<Name>
  4. Import only Eddie components via @brad-frost-web/ package paths
  5. Use zero custom CSS — if something's missing, create a recipe