Anatomy of a theme

A Mero CMS theme is a standard Next.js project plus a theme.json manifest. The manifest declares which sections the theme provides; the admin reads it to render the right edit form for each section.

Directory layout

my-theme/
├── package.json
├── theme.json
├── public/         # static assets (logos, characters, screenshots)
└── src/
    ├── app/        # Next.js App Router pages
    ├── components/
    │   ├── sections/  # one component per section variant
    │   └── ui/        # shared UI primitives
    └── lib/
        └── api.ts  # CMS client (provided by mero-cms-sdk)

Required exports

Each section component must export a default React component AND a typed Data interface that matches the field schema in theme.json.