import { CSSProperties } from "react";
/**
* The UI elements composing DayPicker. These elements are mapped to
* {@link CustomComponents}, the {@link ClassNames} and the {@link Styles} used by
* DayPicker.
*
* Some of these elements are extended by flags and modifiers.
*/
export declare enum UI {
/** The previous button in the navigation. */
ButtonPrevious = "button_previous",
/** The next button the navigation. */
ButtonNext = "button_next",
/** The root component displaying the months and the navigation bar. */
Root = "root",
/** The Chevron SVG element used by navigation buttons and dropdowns. */
Chevron = "chevron",
/**
* The grid cell with the day's date. Extended by {@link DayFlag} and
* {@link SelectionFlag}.
*/
Day = "day",
/** The button containing the formatted day's date, inside the grid cell. */
DayButton = "day_button",
/** The caption label of the month (when not showing the dropdown navigation). */
CaptionLabel = "caption_label",
/** The container of the dropdown navigation (when enabled). */
Dropdowns = "dropdowns",
/** The dropdown element to select for years and months. */
Dropdown = "dropdown",
/** The container element of the dropdown. */
DropdownRoot = "dropdown_root",
/** The root element of the footer. */
Footer = "footer",
/** The month grid. */
MonthGrid = "month_grid",
/** Contains the dropdown navigation or the caption label. */
MonthCaption = "month_caption",
/** The dropdown with the months. */
MonthsDropdown = "months_dropdown",
/** Wrapper of the month grid. */
Month = "month",
/** The container of the displayed months. */
Months = "months",
/** The navigation bar with the previous and next buttons. */
Nav = "nav",
/** The row containing the week. */
Week = "week",
/** The group of row weeks in a month (`tbody`). */
Weeks = "weeks",
/** The column header with the weekday. */
Weekday = "weekday",
/** The row grouping the weekdays in the column headers. */
Weekdays = "weekdays",
/** The cell containing the week number. */
WeekNumber = "week_number",
/** The cell header of the week numbers column. */
WeekNumberHeader = "week_number_header",
/** The dropdown with the years. */
YearsDropdown = "years_dropdown"
}
/** The flags for the {@link UI.Day}. */
export declare enum DayFlag {
/** The day is disabled. */
disabled = "disabled",
/** The day is hidden. */
hidden = "hidden",
/** The day is outside the current month. */
outside = "outside",
/** The day is focused. */
focused = "focused",
/** The day is today. */
today = "today"
}
/**
* The state that can be applied to the {@link UI.Day} element when in selection
* mode.
*/
export declare enum SelectionState {
/** The day is at the end of a selected range. */
range_end = "range_end",
/** The day is at the middle of a selected range. */
range_middle = "range_middle",
/** The day is at the start of a selected range. */
range_start = "range_start",
/** The day is selected. */
selected = "selected"
}
/**
* Deprecated UI elements and flags.
*
* These elements were used in previous version of DayPicker and are kept here
* to help the transition to the new {@link UI | UI elements}.
*
* ```diff
*
* ```
*
* @deprecated
* @since 9.0.1
* @see https://daypicker.dev/upgrading
* @see https://daypicker.dev/docs/styling
*/
export type DeprecatedUI = {
/**
* This element was applied to the style of any button in DayPicker and it is
* replaced by {@link UI.ButtonPrevious} and {@link UI.ButtonNext}.
*
* @deprecated
*/
button: T;
/**
* This element was resetting the style of any button in DayPicker and it is
* replaced by {@link UI.ButtonPrevious} and {@link UI.ButtonNext}.
*
* @deprecated
*/
button_reset: T;
/**
* This element has been renamed to {@link UI.MonthCaption}.
*
* @deprecated
*/
caption: T;
/**
* This element has been removed. Captions are styled via
* {@link UI.MonthCaption}.
*
* @deprecated
*/
caption_between: T;
/**
* This element has been renamed to {@link UI.Dropdowns}.
*
* @deprecated
*/
caption_dropdowns: T;
/**
* This element has been removed. Captions are styled via
* {@link UI.MonthCaption}.
*
* @deprecated
*/
caption_end: T;
/**
* This element has been removed.
*
* @deprecated
*/
caption_start: T;
/**
* This element has been renamed to {@link UI.Day}.
*
* @deprecated
*/
cell: T;
/**
* This element has been renamed to {@link DayFlag.disabled}.
*
* @deprecated
*/
day_disabled: T;
/**
* This element has been renamed to {@link DayFlag.hidden}.
*
* @deprecated
*/
day_hidden: T;
/**
* This element has been renamed to {@link DayFlag.outside}.
*
* @deprecated
*/
day_outside: T;
/**
* This element has been renamed to {@link SelectionState.range_end}.
*
* @deprecated
*/
day_range_end: T;
/**
* This element has been renamed to {@link SelectionState.range_middle}.
*
* @deprecated
*/
day_range_middle: T;
/**
* This element has been renamed to {@link SelectionState.range_start}.
*
* @deprecated
*/
day_range_start: T;
/**
* This element has been renamed to {@link SelectionState.selected}.
*
* @deprecated
*/
day_selected: T;
/**
* This element has been renamed to {@link DayFlag.today}.
*
* @deprecated
*/
day_today: T;
/**
* This element has been removed. The dropdown icon is now {@link UI.Chevron}
* inside a {@link UI.CaptionLabel}.
*
* @deprecated
*/
dropdown_icon: T;
/**
* This element has been renamed to {@link UI.MonthsDropdown}.
*
* @deprecated
*/
dropdown_month: T;
/**
* This element has been renamed to {@link UI.YearsDropdown}.
*
* @deprecated
*/
dropdown_year: T;
/**
* This element has been removed.
*
* @deprecated
*/
head: T;
/**
* This element has been renamed to {@link UI.Weekday}.
*
* @deprecated
*/
head_cell: T;
/**
* This element has been renamed to {@link UI.Weekdays}.
*
* @deprecated
*/
head_row: T;
/**
* This flag has been removed. Use `data-multiple-months` in your CSS
* selectors.
*
* @deprecated
*/
multiple_months: T;
/**
* This element has been removed. To style the navigation buttons, use
* {@link UI.ButtonPrevious} and {@link UI.ButtonNext}.
*
* @deprecated
*/
nav_button: T;
/**
* This element has been renamed to {@link UI.ButtonNext}.
*
* @deprecated
*/
nav_button_next: T;
/**
* This element has been renamed to {@link UI.ButtonPrevious}.
*
* @deprecated
*/
nav_button_previous: T;
/**
* This element has been removed. The dropdown icon is now {@link UI.Chevron}
* inside a {@link UI.ButtonNext} or a {@link UI.ButtonPrevious}.
*
* @deprecated
*/
nav_icon: T;
/**
* This element has been renamed to {@link UI.Week}.
*
* @deprecated
*/
row: T;
/**
* This element has been renamed to {@link UI.MonthGrid}.
*
* @deprecated
*/
table: T;
/**
* This element has been renamed to {@link UI.Weeks}.
*
* @deprecated
*/
tbody: T;
/**
* This element has been removed. The {@link UI.Footer} is now a single element
* below the months.
*
* @deprecated
*/
tfoot: T;
/**
* This flag has been removed. There are no "visually hidden" elements in
* DayPicker 9.
*
* @deprecated
*/
vhidden: T;
/**
* This element has been renamed. Use {@link UI.WeekNumber} instead.
*
* @deprecated
*/
weeknumber: T;
/**
* This flag has been removed. Use `data-week-numbers` in your CSS.
*
* @deprecated
*/
with_weeknumber: T;
};