import { CustomDateDisableFunction, DateRange } from '../../DateRangePicker/types'; import { PickerGranularity } from './granularity'; /** * The month and year selection surfaces behind `granularity="month"` and * `granularity="year"`. * * Note on the brief this was built from: the repo had **no** existing month or * year grid to promote. `CalendarGrid` is a continuously scrolling, virtualised * list of months whose month headers are static text with no click target, and * the only month/year *selection* UI anywhere was `ScrollablePicker`, a * mobile-only scroll wheel. So this grid is new — but it is not a fork: every * cell's state and styling comes from `calculateDayCellProps`, the same * function that styles `CalendarGrid`'s day cells, fed period-start dates. A * selected month therefore renders with the identical pill, an interior month * of a range with the identical range fill, and the current month with the * identical today dot. * * Day granularity never reaches this file. */ export type MonthYearGridProps = { /** `'month'` renders 12 month cells plus year navigation; `'year'` a year grid. */ granularity: Exclude; /** * The draft selection. Both ends are collapsed onto their period starts * before matching, so a month range committed as 1 Sep → 30 Sep still * highlights September as a single cell. */ selectedRange: DateRange | undefined; /** Receives the first day of the clicked period, at local midnight. */ onSelect: (periodStart: Date) => void; today: Date; /** * Range mode draws start/end caps and an interior fill; otherwise a single * selected cell is drawn as a pill. */ isRange?: boolean; /** * Bounds are compared at period resolution, so a `minDate` of 15 Sep leaves * September selectable in month mode — the useful reading for billing * periods, where the month containing the boundary is still a valid month. */ minDate?: Date; maxDate?: Date; timezone?: string; disableFutureDates?: boolean; disablePastDates?: boolean; hideFutureDates?: boolean; hidePastDates?: boolean; /** Called with the period's first day, not with every day inside it. */ customDisableDates?: CustomDateDisableFunction; /** Bumped by the pickers on close so the view re-derives from the selection. */ resetScrollPosition?: number; maxYearOffset?: number; }; declare const MonthYearGrid: { ({ granularity, selectedRange, onSelect, today, isRange, minDate, maxDate, timezone, disableFutureDates, disablePastDates, hideFutureDates, hidePastDates, customDisableDates, resetScrollPosition, maxYearOffset, }: MonthYearGridProps): import("react/jsx-runtime").JSX.Element; displayName: string; }; export default MonthYearGrid;