breadcrumb-ellipsis

PreviousNext
Docs
takiexample

Preview

Loading preview…
registry/new-york/examples/breadcrumb-ellipsis.tsx
import {
  Breadcrumb,
  BreadcrumbEllipsis,
  BreadcrumbLink,
  Breadcrumbs,
  BreadcrumbSeparator,
} from "@/registry/new-york/ui/breadcrumb"

export default function BreadcrumbCollapsed() {
  return (
    <Breadcrumbs>
      <Breadcrumb>
        <BreadcrumbLink href="/">Home</BreadcrumbLink>
        <BreadcrumbSeparator />
      </Breadcrumb>
      <Breadcrumb>
        <BreadcrumbEllipsis />
        <BreadcrumbSeparator />
      </Breadcrumb>
      <Breadcrumb>
        <BreadcrumbLink href="/docs/components">Components</BreadcrumbLink>
        <BreadcrumbSeparator />
      </Breadcrumb>
      <Breadcrumb>
        <BreadcrumbLink>Breadcrumb</BreadcrumbLink>
      </Breadcrumb>
    </Breadcrumbs>
  )
}

Installation

npx shadcn@latest add @taki/breadcrumb-ellipsis

Usage

import { BreadcrumbEllipsis } from "@/components/breadcrumb-ellipsis"
<BreadcrumbEllipsis />