Versionierte Hero-Section — Slots für Eyebrow, Title, Description, Actions.

Sections sind versioniert (hero-v1, später hero-v2, …) — bestehende Versionen werden nicht überschrieben.

Default (center)

Design System

Build once. Ship everywhere.

Markenneutrale Tokens und Primitives für Astro, Shopify und React-Consumer.

Get started Tokens

Align start

Left-aligned hero

Optional für Docs oder Landing-Subpages.

Usage

---
import Hero from '@addxion/components/sections/hero-v1/Hero';
import Button from '@addxion/components/Button';
---

<Hero>
  <span slot="eyebrow">Eyebrow</span>
  <span slot="title">Headline</span>
  <span slot="description">Supporting copy.</span>
  <div slot="actions">
    <Button>CTA</Button>
  </div>
</Hero>

Props

Prop	Typ	Default
`align`	`center` \| `start`	`center`
`class`	`string`	—

Slots

Slot	Pflicht	Beschreibung
`title`	ja	Headline (rendert `Heading` h1)
`eyebrow`	nein	Overline über der Headline
`description`	nein	Supporting copy (muted)
`actions`	nein	Button-Gruppe

Wann nutzen

Landing-Page Hero oben auf der Seite
Docs-Einstieg mit align="center"
Linksbündige Subpage mit align="start"

Wann nicht

Wiederholte Hero-Blöcke mitten auf der Seite
Bestehende hero-v1 in Shopify überschreiben (neue Version anlegen)
Einfache Card-Listen ohne Hero-Struktur

Anti-Patterns

hero-v1 nie in-place ändern, bei Breaking Changes hero-v2 anlegen
Keine Custom-Hero-Kopien ohne Versions-Suffix
Actions-Slot: Button nutzen, nicht rohe <a> ohne tw: Styles

Truths

ID	Wahrheit
T-NEON-SECTIONS	Versionierte Sections nicht in-place überschreiben
T-PKG-NEON	Consumer-Einstieg: @addxion/neon, nicht @addxion/core

Für Agents

Scope: Versionierte Section hero-v1 — nicht in-place überschreiben.

Neue Variante versionieren, nicht bestehende Section mutieren
Marketing-Consumer: addxion-com, süper

Hero v1