A section heading answers three questions in one block: what this region is, what it is for, and what a
reader can do about it. `SectionHeading` states all three, and leaves the action row to
[`ActionGroup`](/components/layouts/action-group) or to a single control.

```tsx
import { SectionHeading } from "asheeui/section-kit";

<SectionHeading
  eyebrow="Training"
  title="This week"
  description="Steps and active minutes, day by day."
  actions={<Button variant="ghost">See progress</Button>}
/>;
```

## The heading and the id

`titleAs` decides the element on the web — `h2` by default, `h1` when the section is the page's main
heading. `titleId` names it so a section's `aria-labelledby` can point at it. On a device the role is
carried by `accessibilityRole`, and both ids warn once because a device has no document to address.

## Props

```props SectionHeading
```