LineOne's breadcrumb: the links to the pages above the current one, then the current page.
<.breadcrumb>
<:item navigate={~p"/"}>Home</:item>
<:item navigate={~p"/elements"}>Elements</:item>
<:item>Breadcrumb</:item>
</.breadcrumb>An item with href, navigate or patch is a link; one with phx-click is a button that
looks like a link, so a crumb can navigate through a server event; the others are plain text
(the current page is the last one). Any other attribute of the item (phx-target,
phx-value-*, id, data-*, aria-*) is passed on to the link or button.
<.breadcrumb>
<:item :for={folder <- @path} phx-click="open_folder" phx-value-id={folder.id}>
{folder.name}
</:item>
</.breadcrumb>The separator is LineOne's chevron unless a :separator is given:
<.breadcrumb variant="bordered">
<:separator><span class="text-xs font-light">/</span></:separator>
<:item href="/"><svg>…</svg></:item>
<:item>Calendar</:item>
</.breadcrumb>Summary
Functions
Renders a breadcrumb trail; the last :item is the current page.
Functions
Renders a breadcrumb trail; the last :item is the current page.
<.breadcrumb>
<:item navigate={~p"/"}>Home</:item>
<:item>Settings</:item>
</.breadcrumb>Attributes
variant(:string) -bordereddraws a rounded border around each link. Defaults to"plain". Must be one of"plain", or"bordered".label(:string) - Thearia-labelof the navigation. Defaults to"Breadcrumb".class(:any) - Defaults tonil.- Global attributes are accepted.
Slots
item(required) - A step of the trail. Accepts attributes:href(:string)navigate(:string)patch(:string)class(:any)phx-click(:any) - Makes the item a button that sends this event or runs thisJS.phx-target(:any)phx-value-id(:any)id(:string)
separator- What goes between two steps, LineOne's chevron by default.