Files
agentic-dev/docs/decisions/adr-005-atomic-design.md
Danijel Martinek f77e6ea881 chore(template): clean-slate template snapshot from bb4a0c7
Curated, product-agnostic snapshot of the post-story-04 tree: demo
content deleted, auth-only reference feature, web-next shell, all gates
green. Product-specific docs, ADRs 027-029, PRDs/epics/archive, editor
library traces, and product naming are curated out; generic template
repairs (coverage provider devDeps, root test:coverage script, live
lint fixes, root-only release-please) are kept. See TEMPLATE.md for
provenance, curation list, and usage.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_016j8z4VHjedXDTjEDNg7qHK
2026-07-12 20:40:54 +02:00

968 B

ADR-005: Atomic Design for UI Components

Status: Accepted

Context

Need a scalable component architecture for the shared UI package.

Decision

Atomic Design (atoms/molecules/organisms/templates) + shadcn/ui + Storybook.

Rationale

  • Clear hierarchy makes agents know exactly where to place new components
  • Import rules enforce composition direction (atoms never import molecules)
  • Co-located stories make components self-documenting
  • shadcn/ui provides excellent base atoms that map naturally to atomic levels
  • Storybook sidebar mirrors the hierarchy via story titles
  • Pages live in apps (not UI package) — they connect to real data

Update (2026-05-04)

Atomic Design now applies to @repo/core-ui/ only — generic primitives (atoms, molecules, generic organisms, templates). Feature-specific components (e.g., ArticleCard, HeaderNavMenu) live in the owning feature's ui/ folder per the vertical-feature architecture. See ADR-006.