@vtex/admin-ui/dist/calendar/calendar-state.d.ts

> VTEX admin component library

import type { Dispatch, SetStateAction } from 'react';
import type { DateObject } from './utils';
import type { InputState } from '../types';
export declare function useCalendarState(props?: CalendarInitialState): CalendarStateReturn;
export interface CalendarState {
    minDateValue: Date;
    maxDateValue: Date;
    /**
     * Id for the Calendar Header
     */
    calendarId: string | undefined;
    /**
     * Selected Date value
     */
    dateValue: Date;
    /**
     * Month of the current date value
     */
    month: number;
    /**
     * Year of the current date value
     */
    year: number;
    /**
     * Start of the week for the current date value
     */
    weekStart: number;
    /**
     * Generated week days for CalendarWeekTitle based on weekStart
     */
    weekDays: Array<{
        title: string;
        abbr: string;
    }>;
    /**
     * Generated days in the current month
     */
    daysInMonth: Date[][];
    /**
     * `true` if the calendar is disabled
     */
    isDisabled: boolean;
    /**
     * `true` if the calendar is focused
     */
    isFocused: boolean;
    /**
     * `true` if the calendar is only readonly
     */
    isReadOnly: boolean;
    /**
     * Month of the current Date
     */
    currentMonth: Date;
    /**
     * Date value that is currently focused
     */
    focusedDate: Date;
    /**
     * Informs if the given date is within the min & max date.
     */
    isInvalidDateRange: (value: Date) => boolean;
}
export interface CalendarActions {
    /**
     * Sets `isFocused`
     */
    setFocused: Dispatch<SetStateAction<boolean>>;
    /**
     * Sets `currentMonth`
     */
    setCurrentMonth: Dispatch<SetStateAction<Date>>;
    /**
     *  Sets `focusedDate`
     */
    setFocusedDate: Dispatch<SetStateAction<Date>>;
    /**
     * Sets `dateValue`
     */
    setDateValue: (value: Date) => void;
    /**
     * Focus the cell of the specified date
     */
    focusCell: (value: Date) => void;
    /**
     * Focus the cell next to the current date
     */
    focusNextDay: () => void;
    /**
     * Focus the cell prev to the current date
     */
    focusPreviousDay: () => void;
    /**
     * Focus the cell one week next to the current date
     */
    focusNextWeek: () => void;
    /**
     * Focus the cell one week prev to the current date
     */
    focusPreviousWeek: () => void;
    /**
     * Focus the cell one month next to the current date
     */
    focusNextMonth: () => void;
    /**
     * Focus the cell one month prev to the current date
     */
    focusPreviousMonth: () => void;
    /**
     * Focus the cell of the first day of the month
     */
    focusStartOfMonth: () => void;
    /**
     * Focus the cell of the last day of the month
     */
    focusEndOfMonth: () => void;
    /**
     * Focus the cell of the date one year from the current date
     */
    focusNextYear: () => void;
    /**
     * Focus the cell of the date one year before the current date
     */
    focusPreviousYear: () => void;
    /**
     * Selects the `focusedDate`
     */
    selectFocusedDate: () => void;
    /**
     * sets `dateValue`
     */
    selectDate: (value: Date) => void;
}
export interface RangeValueMinMax {
    /** The lowest date allowed. */
    minValue?: DateObject;
    /** The highest date allowed. */
    maxValue?: DateObject;
}
export interface CalendarInitialState extends RangeValueMinMax, InputState {
    /** Id for the calendar grid */
    id?: string;
    /** The current date (controlled). */
    value?: DateObject;
    /** The default date (uncontrolled). */
    defaultValue?: DateObject;
    /** Handler that is called when the date changes. */
    onChange?: (value: DateObject) => void;
    /** Whether the element should receive focus on render. */
    autoFocus?: boolean;
}
export declare type CalendarStateReturn = CalendarState & CalendarActions;