Loading...
Loading...
Build breadcrumb navigation with ShadBreadcrumb, ShadBreadcrumbLink, ShadBreadcrumbDropdown, custom separator. Use when showing navigation path, hierarchy of links, or dropdown breadcrumb in a Flutter shadcn_ui app.
npx skill4agent add serverpod/skills-registry shadcn_ui-breadcrumbShadBreadcrumbShadBreadcrumbLinkShadBreadcrumbDropdownTextShadBreadcrumb(
children: [
ShadBreadcrumbLink(
onPressed: () => print('Navigating to Home'),
child: const Text('Home'),
),
ShadBreadcrumbDropdown(
items: [
ShadBreadcrumbDropMenuItem(
onPressed: () => print('Navigating to Documentation'),
child: const Text('Documentation'),
),
ShadBreadcrumbDropMenuItem(
onPressed: () => print('Navigating to Themes'),
child: const Text('Themes'),
),
],
showDropdownArrow: false,
child: ShadBreadcrumbEllipsis(),
),
Text('Components'),
Text('Breadcrumb'),
],
)>separatorShadBreadcrumb(
separator: const Icon(LucideIcons.slash),
children: [
ShadBreadcrumbLink(onPressed: () {}, child: const Text('Home')),
ShadBreadcrumbLink(onPressed: () {}, child: const Text('Components')),
Text('Breadcrumb'),
],
)ShadBreadcrumbDropdownitemsShadBreadcrumbDropMenuItemchildShadBreadcrumbEllipsis()