Accessible ordered navigation with native label glyphs.
Preview
Example source could not be loaded: breadcrumb-example. Reload this page to retry.Usage
Breadcrumb provides a nav labelled Breadcrumb and BreadcrumbList an ordered list. BreadcrumbLink supports render composition for a router anchor. BreadcrumbPage is an aria-disabled current-page span with role="link". It supplies location semantics without an active destination.
Composition
Keep separators outside BreadcrumbItem. BreadcrumbEllipsis is presentation-only and its More text is hidden too; use a labelled Button or menu trigger for interactive overflow. The ordered path and focus ring are web adaptations around native label glyphs.
Installation
Component source
This is the component implementation. Its supporting styles, helpers and resources are also required. See complete manual installation.
"use client";
import * as React from "react";
import { MinecraftProse } from "./minecraft-prose";
import { minecraftClasses as cn, minecraftStyle } from "./minecraft-render";
import type { MinecraftPolymorphicProps } from "./minecraft-render";
import "./minecraft-breadcrumb.css";
interface BreadcrumbScaleStyle extends React.CSSProperties {
"--mc-scale": number;Interactive playground
Tab to a link, then press Enter