パンくずBreadcrumb
Experimental

階層リンクで現在のリソースへのパスを表示します。

状態とバリエーション

先頭の階層をアイコンだけで示す場合は aria-label で意味を補います。

階層が長い場合は中間を省略し、先頭・現在地・直近の階層を残します。

BreadcrumbSeparator に任意のノードを渡すと、山括弧以外の区切り記号にできます。

標準装備ではなく、ページのタイトルや説明を HoverCard で合成するバリエーションです。タップでも概要を開き、カード内のボタンで遷移を確認できます。

表は横にスクロールできます

プロパティ	型	初期値	説明
href	string	-	リンク先 URL。
asChild	boolean	false	子要素をリンクとして描画するか。

表は横にスクロールできます

プロパティ	型	初期値	説明
children	ReactNode	-	現在ページとして表示する内容。

表は横にスクロールできます

プロパティ	型	初期値	説明
label	string	"More"	スクリーンリーダー向けの省略ラベル。