@navikt/ds-react/cjs/date/datepicker/hooks/useRangeDatepicker.d.ts

React components from the Norwegian Labour and Welfare Administration.

import React from "react";
import { DateInputProps } from "../../Date.Input";
import { DateRange } from "../../Date.typeutils";
import { DatePickerProps } from "../DatePicker";
import { DateValidationT, UseDatepickerOptions } from "./useDatepicker";
export type RangeValidationT = {
    from: DateValidationT;
    to: DateValidationT & {
        isBeforeFrom?: boolean;
    };
};
export interface UseRangeDatepickerOptions extends Omit<UseDatepickerOptions, "defaultSelected" | "onDateChange" | "onValidate"> {
    /**
     * The initially selected DateRange
     */
    defaultSelected?: DateRange;
    /**
     * Callback for changed state
     */
    onRangeChange?: (val?: DateRange) => void;
    /**
     * validation-callback
     */
    onValidate?: (val: RangeValidationT) => void;
}
interface UseRangeDatepickerValue {
    /**
     * Use: <DatePicker {...datepickerProps}/>
     */
    datepickerProps: DatePickerProps;
    /**
     * Use: <DatePicker.Input label="from" {...fromInputProps}/>
     */
    fromInputProps: Pick<DateInputProps, "onChange" | "onFocus" | "onBlur" | "value"> & {
        /**
         * @private
         */
        setAnchorRef: React.Dispatch<React.SetStateAction<HTMLButtonElement | null>>;
    };
    /**
     * Use: <DatePicker.Input label="to" {...toInputProps}/>
     */
    toInputProps: Pick<DateInputProps, "onChange" | "onFocus" | "onBlur" | "value"> & {
        /**
         * @private
         */
        setAnchorRef?: React.Dispatch<React.SetStateAction<HTMLButtonElement | null>>;
    };
    /**
     * Resets all states (callback)
     */
    reset: () => void;
    /**
     * Currently selected DateRange
     * Up to user to validate values
     */
    selectedRange?: DateRange;
    /**
     * Manually override currently selected day
     */
    setSelected: (date?: DateRange) => void;
}
/**
 *
 * @see 🏷️ {@link UseRangeDatepickerOptions}
 * @see 🏷️ {@link UseRangeDatepickerValue}
 * @see 🏷️ {@link RangeValidationT}
 * @example
 * const { datepickerProps, fromInputProps, toInputProps } = useRangeDatepicker({
 *   fromDate: new Date("Aug 23 2019"),
 *   onRangeChange: console.log,
 *   onValidate: console.log,
 * });
 */
export declare const useRangeDatepicker: (opt?: UseRangeDatepickerOptions) => UseRangeDatepickerValue;
export {};