Year grid with decade navigation for archive filters and historical ranges.
YearPicker renders a 12-cell grid of consecutive years with decade-step navigation. Use it for archive filters or financial-year selectors where day or month precision isn't needed.
Selecting a cell emits a numeric year.
<YearPicker aria-label="Reporting year" defaultValue={2026} />import { YearPicker } from "@froggdesign/enter-ui-react";YearPicker is a role="group" containing button cells. Each cell uses aria-pressed to indicate selection; navigation buttons have explicit aria-labels.
value / defaultValue: numeric year.onValueChange(value): fires when a year is committed.min / max: numeric bounds; out-of-range cells are disabled.Every exported component accepts className when it renders an element. EnterUI styles use .eui-* classes and --eui-* variables mapped from FroggDesign theme tokens.