import * as React from "react";
import { type DateRange, type DayPickerProps, type Matcher } from "react-day-picker";
import type { SortDirection } from "./sort-column-item";
export type DatePickerMode = "single" | "range";
export interface DatePickerBaseProps {
    /** Placeholder text when no date is selected */
    placeholder?: string;
    /** Format function for displaying the date */
    formatDate?: (date: Date) => string;
    /** Whether the picker is disabled */
    disabled?: boolean;
    /** Additional class name for the trigger button */
    className?: string;
    /** Number of months to display */
    numberOfMonths?: 1 | 2;
    /** Minimum selectable date */
    fromDate?: Date;
    /** Maximum selectable date */
    toDate?: Date;
    /** Locale for formatting */
    locale?: DayPickerProps["locale"];
    /** Label text displayed above the picker */
    label?: string;
    /** Error message displayed below the picker */
    error?: string;
    /** When true, renders red error border */
    invalid?: boolean;
}
export interface SingleDatePickerProps extends DatePickerBaseProps {
    mode: "single";
    value?: Date;
    onChange?: (date: Date | undefined) => void;
}
export interface RangeDatePickerProps extends DatePickerBaseProps {
    mode: "range";
    value?: DateRange;
    onChange?: (range: DateRange | undefined) => void;
}
export type DatePickerProps = SingleDatePickerProps | RangeDatePickerProps;
export interface DatePickerCalendarProps {
    mode: DatePickerMode;
    selected: Date | DateRange | undefined;
    onSelect: (value: Date | DateRange | undefined) => void;
    numberOfMonths?: 1 | 2;
    fromDate?: Date;
    toDate?: Date;
    locale?: DayPickerProps["locale"];
    /**
     * When true the calendar fills its container width and day cells flex to
     * fit (instead of the fixed 40px cells). Used by DateFilterMenu so the grid
     * lines up with the surrounding controls per the Figma filter-menu.
     */
    fluid?: boolean;
    /**
     * The calendar ALONE — the Figma `Date Picker` component as drawn, with no
     * card surface and no outer inset: the nav header flush to both edges, 8px,
     * then a full-bleed grid. Seven columns divide the container, so the
     * cells are as wide as the host makes them.
     *
     * FIXED 272px tall at every one of those widths (8 + the 48px icon-button
     * header + a 24px weekday strip + six 32px rows; 268 on a phone, where the
     * DS icon button is 44), which is the design's own contract — the
     * component is drawn 240 tall at 340, 282 and 240 wide. Height that ignored
     * the width is what lets a host place it in a card that states a height, and
     * keeps a phone-width month from becoming a 356px band.
     *
     * The DAY inside each cell stays square, so the selection and today's tint
     * read as rounded squares rather than as pills stretched across a wide
     * cell.
     *
     * For hosts that place the calendar inside a panel they already own — the
     * meeting scheduler — where the standalone card chrome reads as a card
     * inside a card and its 16px inset fights the panel's own 24px one. The
     * popover and filter-menu keep the surface; nothing about the type, colours
     * or day states changes between the two.
     */
    bare?: boolean;
    /**
     * Days to disable ON TOP of the `fromDate`/`toDate` bounds — a matcher, so a
     * host can disable by predicate. "Inside the allowed window" and "actually
     * selectable" are different questions, and only the host can answer the
     * second (the meeting scheduler greys out days with no bookable slot).
     */
    disabledDays?: Matcher | Matcher[];
    /**
     * Controlled visible month; pair with `onMonthChange`. Omit both and the
     * calendar owns its month, which is the right default — a host needs these
     * only when paging is ALSO a data event, e.g. the scheduler refetches
     * availability per month and would otherwise show an unpopulated month.
     */
    month?: Date;
    onMonthChange?: (month: Date) => void;
}
/**
 * The calendar surface behind every date control in the design system —
 * `DatePicker`'s popover and `DateFilterMenu` — exported so a host that needs
 * an always-visible day grid renders THIS one. A second hand-styled day grid
 * is how the two drift apart.
 */
export declare function DatePickerCalendar({ mode, selected, onSelect, numberOfMonths, fromDate, toDate, locale, fluid, bare, disabledDays: extraDisabledDays, month: monthProp, onMonthChange, }: DatePickerCalendarProps): React.JSX.Element;
export declare function DatePicker(props: DatePickerProps): React.JSX.Element;
export interface DatePickerInputProps extends DatePickerBaseProps {
    mode?: "single";
    value?: Date;
    onChange?: (date: Date | undefined) => void;
    /** Show time selector next to date */
    showTime?: boolean;
    /** Use 24-hour format instead of 12-hour */
    use24HourFormat?: boolean;
}
export declare function DatePickerInput({ placeholder, formatDate, disabled, className, numberOfMonths, fromDate, toDate, locale, value, onChange, showTime, use24HourFormat, label, error, invalid, }: DatePickerInputProps): React.JSX.Element;
export interface DatePickerInputSimpleProps extends DatePickerBaseProps {
    mode?: "single";
    value?: Date;
    onChange?: (date: Date | undefined) => void;
    /** Show time selector next to date */
    showTime?: boolean;
    /** Time interval in minutes (default: 30) */
    timeInterval?: number;
    /** Use 24-hour format instead of 12-hour */
    use24HourFormat?: boolean;
}
export declare function DatePickerInputSimple({ placeholder, formatDate, disabled, className, numberOfMonths, fromDate, toDate, locale, value, onChange, showTime, timeInterval, use24HourFormat, label, error, invalid, }: DatePickerInputSimpleProps): React.JSX.Element;
export interface DateFilterPanelProps {
    /** Selection mode for the calendar. Defaults to "range". */
    mode?: DatePickerMode;
    /** Current sort direction shown in the select. */
    sort: SortDirection;
    onSortChange: (sort: SortDirection) => void;
    /** Current calendar selection. */
    selected: Date | DateRange | undefined;
    onSelect: (value: Date | DateRange | undefined) => void;
    /** Minimum selectable date. */
    fromDate?: Date;
    /** Maximum selectable date. */
    toDate?: Date;
    /** Locale for the calendar. */
    locale?: DayPickerProps["locale"];
    /** Label for the ascending sort option. */
    ascLabel?: string;
    /** Label for the descending sort option. */
    descLabel?: string;
    className?: string;
}
/**
 * DateFilterPanel — the controlled sort-direction select + fluid calendar
 * block shared by DateFilterMenu (popover) and FilterModal (mobile "Sort and
 * Filter"). Owns no state: the consumer drafts and commits the values.
 */
export declare function DateFilterPanel({ mode, sort, onSortChange, selected, onSelect, fromDate, toDate, locale, ascLabel, descLabel, className, }: DateFilterPanelProps): React.JSX.Element;
export interface DateFilterResult {
    /** Selected sort direction */
    sort: SortDirection;
    /** Selected single date (mode === "single") */
    date?: Date;
    /** Selected date range (mode === "range") */
    range?: DateRange;
}
export interface DateFilterMenuProps {
    /** Selection mode for the calendar. Defaults to "range". */
    mode?: DatePickerMode;
    /** Current (applied) sort direction. Defaults to "desc". */
    sort?: SortDirection;
    /** Baseline sort direction — Reset restores it, and a draft that differs
     *  from it counts as an active change (shows Reset). Defaults to "desc". */
    defaultSort?: SortDirection;
    /** Current (applied) single date — used when mode === "single". */
    date?: Date;
    /** Current (applied) range — used when mode === "range". */
    range?: DateRange;
    /** Fired when the user presses Apply with the drafted selection. Also fired
     *  by Reset with a cleared selection so the consumer refetches unfiltered data. */
    onApply?: (result: DateFilterResult) => void;
    /** Fired when the menu closes (Close button, outside click, Esc). */
    onClose?: () => void;
    /** Custom trigger element (rendered via Radix `asChild` — must accept a ref,
     *  e.g. a native button). Defaults to the outline calendar icon Button. */
    trigger?: React.ReactNode;
    /** Disable the trigger. */
    disabled?: boolean;
    /** Minimum selectable date. */
    fromDate?: Date;
    /** Maximum selectable date. */
    toDate?: Date;
    /** Locale for the calendar. */
    locale?: DayPickerProps["locale"];
    /** Popover alignment relative to the trigger. */
    align?: "start" | "center" | "end";
    /** Label for the ascending sort option. */
    ascLabel?: string;
    /** Label for the descending sort option. */
    descLabel?: string;
    /** Additional class name for the trigger button. */
    className?: string;
    /** Accessible label for the trigger. */
    "aria-label"?: string;
}
/**
 * DateFilterMenu — a calendar-icon-triggered popover combining a sort-direction
 * selector and a date / date-range calendar, with Close/Reset and Apply actions.
 * The sort and date selection are drafted internally and committed via
 * `onApply`. While a date is selected, Close is replaced by Reset, which
 * clears and commits the empty selection (fires `onApply`) so the consumer
 * drops the filter.
 */
export declare function DateFilterMenu({ mode, sort, defaultSort, date, range, onApply, onClose, trigger, disabled, fromDate, toDate, locale, align, ascLabel, descLabel, className, "aria-label": ariaLabel, }: DateFilterMenuProps): React.JSX.Element;
export { type DateRange };
//# sourceMappingURL=date-picker.d.ts.map