BreadcrumbSeparatorDemo() — ui Function Reference

Architecture documentation for the BreadcrumbSeparatorDemo() function in breadcrumb-separator.tsx from the ui codebase.

Function tsx DocumentationAtlas Changelog

Entity Profile

DocumentationAtlas→ Changelog→ BreadcrumbSeparatorDemo() — ui Function Reference

Dependency Diagram

graph TD
  2de92a09_7c2f_99ed_203e_032205b24bb3["BreadcrumbSeparatorDemo()"]
  49378685_50c6_9256_f622_bae251dc0198["breadcrumb-separator.tsx"]
  2de92a09_7c2f_99ed_203e_032205b24bb3 -->|defined in| 49378685_50c6_9256_f622_bae251dc0198
  style 2de92a09_7c2f_99ed_203e_032205b24bb3 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/radix/breadcrumb-separator.tsx lines 12–38

export function BreadcrumbSeparatorDemo() {
  return (
    <Breadcrumb>
      <BreadcrumbList>
        <BreadcrumbItem>
          <BreadcrumbLink asChild>
            <Link href="/">Home</Link>
          </BreadcrumbLink>
        </BreadcrumbItem>
        <BreadcrumbSeparator>
          <DotIcon />
        </BreadcrumbSeparator>
        <BreadcrumbItem>
          <BreadcrumbLink asChild>
            <Link href="/components">Components</Link>
          </BreadcrumbLink>
        </BreadcrumbItem>
        <BreadcrumbSeparator>
          <DotIcon />
        </BreadcrumbSeparator>
        <BreadcrumbItem>
          <BreadcrumbPage>Breadcrumb</BreadcrumbPage>
        </BreadcrumbItem>
      </BreadcrumbList>
    </Breadcrumb>
  )
}