Breadcrumbs
Breadcrumbs display the current page or context within the site, allowing them to navigate different levels of the hierarchy.
On this page
Description
Use Breadcrumbs
to display page hierarchy.
Known issues
Responsiveness
Breadcrumbs
is not optimized for responsive designs.
Accessibility
Breadcrumbs
renders a list of links within a nav
element and has an implicit landmark role of navigation
.
By default, the component labels the nav
element with "Breadcrumbs" which helps distinguish the type of navigation.
Additionally, the component will always render the last link, which should represent the current page, with an aria-current="page"
attribute.
For more information on the breadcrumbs pattern implemented by this component, see WAI-ARIA 1.1 Breadcrumb.
Arguments
Name | Type | Default | Description |
---|---|---|---|
system_arguments | Hash | N/A |
Examples
Slots
items
Name | Type | Default | Description |
---|---|---|---|
href | String | N/A | The URL to link to. |
system_arguments | Hash | N/A |
Breadcrumbs::Item
This component is part of Primer::Beta::Breadcrumbs
and should not be
used as a standalone component.
Methods
selected
Returns the value of attribute selected.
selected=(value)
Sets the attribute selected
Parameters
Name | Type | Default | Description |
---|---|---|---|
value |
| N/A | the value to set the attribute selected to. |
href
Returns the value of attribute href.
href=(value)
Sets the attribute href
Parameters
Name | Type | Default | Description |
---|---|---|---|
value |
| N/A | the value to set the attribute href to. |