Section Header
SectionHeader
A title row with an optional "view all" link and separator line. Eliminates repetitive layout boilerplate in content-heavy screens like dashboards and e-commerce listings.
Basic
A simple title with the default separator line below.
Recent Orders
Content here…
With View All
Provide OnViewAll to render a button on the right. ViewAllText adds optional label text next to the chevron.
Featured Products
Products grid here…
Chevron Only
Omit ViewAllText to show just the chevron icon — useful when space is limited.
Trending Now
Content here…
No Separator
ShowSeparator=false removes the divider line for a more compact look.
Popular
Content here…
Custom Title Content
TitleContent replaces the plain title text with any render fragment — icons, badges, or multi-line headings.
Hot Deals
NEW
NEW
Deals content here…
In Context
Multiple SectionHeaders composing a typical mobile screen layout.
Continue Shopping
Recommended For You
Categories
Electronics
Clothing
Books
API Reference
SectionHeader parameters.
| Prop | Type | Default | Description |
|---|---|---|---|
| Title | string? | — | Section title text. Ignored when TitleContent is provided. |
| TitleContent | RenderFragment? | — | Custom title fragment — takes precedence over Title. |
| OnViewAll | EventCallback | — | Callback for the "view all" button. Button only renders when provided. |
| ViewAllText | string? | — | Text shown next to the chevron. Omit for icon-only button. |
| ViewAllLabel | string | "View all" | Accessible aria-label for the "view all" button. |
| ShowSeparator | bool | true | Show a separator line below the title row. |
| Class | string? | — | Additional CSS classes on the outer wrapper. |