Skip to content

Use Breadcrumb to display page hierarchy within a section of the site. All of the items in the breadcrumb "trail" are links except for the final item, which is a plain string indicating the current page.

Arguments

NameTypeDefaultDescription
system_argumentsHashN/ASystem arguments

Slots

Items

Note: if both href and selected: true are passed in, href will be ignored and the item will not be rendered as a link.

NameTypeDefaultDescription
hrefStringN/AThe URL to link to.
selectedBooleanN/AWhether or not the item is selected and not rendered as a link.
system_argumentsHashN/ASystem arguments

Examples

Basic

<%= render(Primer::BreadcrumbComponent.new) do |component| %>
<% component.item(href: "/") do %>Home<% end %>
<% component.item(href: "/about") do %>About<% end %>
<% component.item(selected: true) do %>Team<% end %>
<% end %>