# Generic

Generic is a flexible section that can display icon, preHeading, heading, postHeading, visual, body, links, and additional copy in a single column. Use when no more specific component type fits, or for one-off layouts.

## What it looks like

- **Default:** Single column with optional icon, preHeading (p2), heading (h1), postHeading (p2), visual, body (rtf-standard), links row, and additional copy. Section can have backgroundColour and textColour applied to the full section. Link button colour is white on dark backgrounds, otherwise dark.
- **No visual:** Same layout without the visual block; copy and links only.

## Typography

- **Heading:** Typography class `h1` from sizingInformation. Semantic level: first block on page → `<h1>`, otherwise `<h2>`.
- **Pre-heading and post-heading:** Typography class `p2` (from sizingInformation.p).
- **Body and additional copy:** Rich text with class `rtf-standard`.

## Colours

**How colours are applied:** `backgroundColour` and `textColour` are applied to the **entire section** via the Section wrapper. Link button colour switches to white when the background is dark (from palette).

**Valid `backgroundColour` values:** Bright Blue, Dark, Gray 1, Gray 2, Green, Inactive Gray, Light Blue, Light Orange, Light Purple, Light, Orange, Primary Blue, Purple, Secondary Blue, White, Yellow.

**Valid `textColour` values:** Bright Blue, Dark, Orange, Primary Blue, Purple, Secondary Blue, White.

## Used fields

| Field | Type | Effect when set | Effect when empty/removed |
|-------|------|-----------------|---------------------------|
| `preHeading` | Symbol | Eyebrow above heading (p2) | No preHeading |
| `heading` | Symbol | Main title (h1) | No heading |
| `postHeading` | Symbol | Subtitle below heading (p2) | No postHeading |
| `body` | RichText | Body copy (rtf-standard) | No body |
| `visual` | EntryLink | Image or video in flow | No visual block |
| `links` | Array | Buttons/links row (button colour from background) | No links |
| `additionalCopy` | RichText | Extra copy below links (rtf-standard) | No additional copy |
| `icon` | AssetLink | Icon image above preHeading | No icon |
| `anchor` | Symbol | HTML `id` for linking | No anchor |
| `cmsLabel` | Symbol | Internal label | No visible effect |
| `backgroundColour` | Symbol | Section background | Default background |

## Behaviour

- **Position (index):** Heading semantic level follows index (first block → h1, else h2). Typography uses sizingInformation.h1 and sizingInformation.p.
- **Links:** Rendered as a row; button colour is white on dark backgrounds, otherwise dark.
- **Section:** Full-width section; content in single column (col-span-full).

## Impact of content changes

| Change | Result |
|--------|--------|
| Add/remove icon, preHeading, heading, postHeading | Each block appears or disappears in order |
| Add/remove visual | Visual block appears or disappears |
| Add/remove body or additionalCopy | Rich text block appears or disappears |
| Add/remove links | Link row appears or disappears; button colour follows background |
| Set backgroundColour / textColour | Section colours and link button colour update |

## Screenshots to capture

Recommended variants: default, no-visual, no-links, dark-background, minimal.
