Components
Breadcrumbs
Breadcrumbs
Where am I, and how do I get back up. Links from a plain list.
Links from a plain list
links take label and/or icon (the first crumb here is a home icon), to, and link_type (a / live_patch / live_redirect / button). The last crumb renders as the current page - strong text plus aria-current - and the nav carries an aria_label. separator="slash" swaps the chevrons.
<.breadcrumbs links={[
%{icon: "hero-home", to: "#", link_type: "button"},
%{label: "Projects", to: "#", link_type: "button"},
%{label: "petal_components", to: "#", link_type: "button"}
]} />
Properties
| Attribute | Type | Default | Description |
|---|---|---|---|
aria_label
|
string |
"Breadcrumbs"
|
ARIA label for the nav |
class
|
any |
nil
|
Parent div CSS class |
link_class
|
any |
nil
|
Link class CSS |
links
|
list |
[]
|
List of your links |
rest
|
global |
||
separator
|
string |
"slash"
|
one of: "slash", "chevron"
|
separator_class
|
any |
nil
|
Separator div CSS class |