Breadcrumb
Breadcrumb displays one segment of the navigation path in the application and is a descendant of the Breadcrumbs element. It can also display an icon.
Note
For more information on using Breadcrumbs, navigate to the [Breadcrumbs] element documentation(./breadcrumbs).
When to use
Use wje-breadcrumb when the user needs to navigate the application or transition between states/screens.
When not to use
Do not use multiple parallel navigation patterns that compete with each other.
Accessibility
Provide clear active/selected states, predictable tab order, and naming of controls.
Recommended practices
- Keep the URL and UI state in sync to make the navigation reproducible.
- Use consistent terminology for items across menus, breadcrumb and tabs.
- For deep structures, add auxiliary context (breadcrumb, title, icons).
Attributes and properties
collapsed
| Popis | Určuje, či je komponent zbalený. |
| Atribút | collapsed |
| Typ | boolean |
| Predvolené | - |
last
| Popis | Riadi správanie voľby last v komponente. |
| Atribút | last |
| Typ | any |
| Predvolené | - |
showCollapsedIndicator
| Popis | Riadi správanie voľby show-collapsed-indicator v komponente. |
| Atribút | show-collapsed-indicator |
| Typ | any |
| Predvolené | - |
Events
Pre tento komponent nie sú dostupné žiadne udalosti.
Methods
getBreadcrumbs
| Popis | Vráti breadcrumbs z aktuálneho stavu komponentu. |
| Signatúra | () => Element |
CSS shadow parts
| Názov | Popis |
|---|---|
native | Štýluje koreňovú shadow časť komponentu. |
separator | Štýluje shadow časť separator. |
CSS custom variables
| Názov | Popis |
|---|---|
--wje-breadcrumb-a | Vlastná CSS premenná na štýlovanie komponentu (a). |
--wje-breadcrumb-a-hover | Vlastná CSS premenná na štýlovanie komponentu (a hover). |
Slots
| Názov | Popis |
|---|---|
default | Predvolený slot pre hlavný obsah komponentu. |
start | Slot pre obsah zobrazený pred hlavným obsahom. |
end | Slot pre obsah zobrazený za hlavným obsahom. |
separator | Slot pre vlastný oddeľovač medzi položkami. |