Component

Stories

A reference of every section, block, and primitive in this project.

Sections

Full page regions driven by CMS data. Each section maps to a componentType and renders via sectionMap.

hero

Hero

Full-bleed opening section with optional background image, overlay, heading, subheading, and a single CTA link.

cardGrid

Card Grid

Responsive grid of Card blocks. Column count is controlled via the cols={[sm, tablet, desktop]} prop — defaults to [1, 2, 3].

accordion

Accordion

Collapsible FAQ-style list of AccordionItem blocks. Each item manages its own open state.

tabs

Tabs

Tabbed content panel. Active tab is persisted in URL search params — bookmarkable and refresh-safe.

Blocks

Terminal components rendered inside sections. Consumed via blockMap — never exposed directly in the CMS.

card

Card

Content tile with optional image, pill, and link. Link placement can wrap the entire card or render at the bottom.

accordionItem

Accordion Item

Collapsible row with a heading trigger and text content. Manages its own open/closed state.

Primitives

Low-level UI building blocks — typography, controls, layout. Used inside sections and blocks, never directly by the CMS.

Heading

Heading

Typographic hierarchy across four variants — hero, display, section, and card. Renders any heading tag via the `as` prop.

Pill

Pill

Inline badge for status, category, or metadata. Renders as a plain span or an anchor when `href` is set.

Link

Link

Styled anchor for inline CTAs. Auto-detects internal paths (React Router Link) vs external URLs (native anchor with target blank).

Action

Action

Polymorphic button/link/navlink with five style variants and three sizes. External URLs auto-append an arrow-up-right icon.

Tabs

Tabs

Controlled tab bar primitive. Used in StoryRow chrome and as the base for the Tabs section.

Dialog

Dialog

Modal dialog supporting both uncontrolled (trigger prop) and controlled (open + onClose) modes.

Grid

Grid

Responsive CSS grid with a cols={[sm, tablet, desktop]} prop. Each value sets grid-cols at that breakpoint — 1–12 columns, all breakpoints optional.

Row

Row

Full-width section wrapper with optional container constraint and light/dark background variants. No background inherits the system default.