Navigation

SidebarButton

One row inside a sidebar: icon, label, active state.

Importimport { SidebarButton } from "@/components/layout";
Sourcesrc/components/layout/SidebarButton

One row in a sidebar. active marks the current destination — exactly one row in a nav should have it.

Default

Props

SidebarButton

PropTypeDefaultDescription
labelReactNodeRequired. The row's text — this is a prop, not children.
activebooleanfalseMarks the current destination.
iconReactNodeLeading icon, sized 16.
hrefstringRenders a link instead of a button; external URLs are detected.
rightSlotReactNodeTrailing content — a count, a badge.
disabledbooleanfalseRenders the row unavailable.
comingSoonbooleanfalseUnavailable, but styled as not-yet rather than disabled.
ariaCurrent"page" | "step" | "location" | "date" | "time" | booleanSets `aria-current` for the active destination.
target / relAnchorHTMLAttributesForwarded when `href` is set.