docs(breadcrumb): improve docs

This commit is contained in:
Eric Liu 2025-04-20 14:48:57 -07:00
commit dcd09e9996

View file

@ -14,6 +14,8 @@ components: ["Breadcrumb", "BreadcrumbItem"]
## Default
Display a hierarchical navigation trail with slashes between items. Mark the current page with `isCurrentPage`.
<Breadcrumb>
<BreadcrumbItem href="/">Dashboard</BreadcrumbItem>
<BreadcrumbItem href="/reports">Annual reports</BreadcrumbItem>
@ -22,6 +24,8 @@ components: ["Breadcrumb", "BreadcrumbItem"]
## No trailing slash
Remove the trailing slash from the last breadcrumb item using `noTrailingSlash`.
<Breadcrumb noTrailingSlash>
<BreadcrumbItem href="/">Home</BreadcrumbItem>
<BreadcrumbItem href="/profile" isCurrentPage>Profile</BreadcrumbItem>
@ -29,6 +33,8 @@ components: ["Breadcrumb", "BreadcrumbItem"]
## Overflow menu
Add an `OverflowMenu` to handle long breadcrumb trails. Use `OverflowMenuItem` components for menu options.
<Breadcrumb>
<BreadcrumbItem href="/">Home</BreadcrumbItem>
<BreadcrumbItem href="/api">API documentation</BreadcrumbItem>
@ -47,4 +53,6 @@ components: ["Breadcrumb", "BreadcrumbItem"]
## Skeleton
Display a loading state with `skeleton` prop. Use `count` to specify the number of items.
<Breadcrumb noTrailingSlash skeleton count={3} />