Noora.Breadcrumbs
(noora v0.76.0)
Copy Markdown
Renders a breadcrumbs component with.
Example
<.breadcrumbs style="slash">
<.breadcrumb id="home" label="Home" />
<.breadcrumb id="products" label="Products" />
<.breadcrumb id="category" label="Electronics" />
</.breadcrumbs>
Summary
Functions
Attributes
id(:string) (required) - Unique identifier for the breadcrumb component.label(:string) (required) - Main text displayed in the breadcrumb trigger.on_open_change(:string) - Event handler for when the breadcrumb opens. Defaults tonil.on_highlight_change(:string) - Event handler for when the highlighted option changes. Defaults tonil.on_select(:string) - Event handler for when an option is selected. Defaults tonil.on_escape_key_down(:string) - Event handler for when the escape key is pressed. Defaults tonil.on_pointer_down_outside(:string) - Event handler for when the pointer is pressed outside the breadcrumb. Defaults tonil.on_focus_outside(:string) - Function called when the focus is moved outside the component. Defaults tonil.on_interact_outside(:string) - Function called when an interaction happens outside the component. Defaults tonil.show_avatar(:boolean) - Whether to show the avatar. Defaults tofalse.avatar_color(:string) - Color of the avatar when avatar is shown. Defaults to"pink". Must be one of"gray","red","orange","yellow","azure","blue","purple", or"pink".badge_label(:string) - Label for the badge displayed next to the breadcrumb label. Defaults tonil.badge_color(:string) - Color of the badge. Defaults to"neutral". Must be one of"neutral","destructive","warning","attention","success","information","focus","primary", or"secondary".- Global attributes are accepted.
Slots
icon- Breadcrumb icon.inner_block- Content to be rendered inside the breadcrumb menu.
Attributes
id(:string)label(:string) (required) - Text displayed as the main content of the item.value(:string) (required) - Value associated with the breadcrumb item.selected(:boolean) - Whether the item is selected. Defaults tofalse.href(:string) - Standard URL for navigation. Defaults tonil.show_avatar(:boolean) - Whether to show the avatar. Defaults tofalse.icon(:string) - Icon to display. Overridesshow_avatar. Defaults tonil.avatar_color(:string) - Color of the avatar when avatar is shown. Defaults to"pink". Must be one of"gray","red","orange","yellow","azure","blue","purple", or"pink".badge_label(:string) - Label for the badge displayed next to the item label. Defaults tonil.badge_color(:string) - Color of the badge. Defaults to"neutral". Must be one of"neutral","destructive","warning","attention","success","information","focus","primary", or"secondary".
Attributes
style(:string) - The separator style between breadcrumbs. Defaults to"slash". Must be one of"slash", or"arrow".- Global attributes are accepted. Additional HTML attributes.
Slots
inner_block- Breadcrumb items to be rendered.