1 | import React, { Component, cloneElement } from "react";
|
2 | import Calendar from "./calendar";
|
3 | import CalendarIcon from "./calendar_icon";
|
4 | import { registerLocale, setDefaultLocale, getDefaultLocale, type HighlightDate, type HolidayItem } from "./date_utils";
|
5 | import PopperComponent from "./popper_component";
|
6 | import Portal from "./portal";
|
7 | import type { ClickOutsideHandler } from "./click_outside_wrapper";
|
8 | export { default as CalendarContainer } from "./calendar_container";
|
9 | export { registerLocale, setDefaultLocale, getDefaultLocale };
|
10 | export { ReactDatePickerCustomHeaderProps } from "./calendar";
|
11 | interface Holiday {
|
12 | date: string;
|
13 | holidayName: string;
|
14 | }
|
15 | type CalendarProps = React.ComponentPropsWithoutRef<typeof Calendar>;
|
16 | interface CalendarIconProps extends React.ComponentPropsWithoutRef<typeof CalendarIcon> {
|
17 | }
|
18 | interface PortalProps extends React.ComponentPropsWithoutRef<typeof Portal> {
|
19 | }
|
20 | interface PopperComponentProps extends React.ComponentPropsWithoutRef<typeof PopperComponent> {
|
21 | }
|
22 | type OmitUnion<T, K extends keyof any> = T extends any ? Omit<T, K> : never;
|
23 | export type DatePickerProps = OmitUnion<CalendarProps, "setOpen" | "dateFormat" | "preSelection" | "onSelect" | "onClickOutside" | "highlightDates" | "holidays" | "shouldFocusDayInline" | "outsideClickIgnoreClass" | "monthSelectedIn" | "onDropdownFocus" | "onTimeChange" | "className" | "container" | "handleOnKeyDown" | "handleOnDayKeyDown" | "isInputFocused" | "setPreSelection" | "selectsRange" | "selectsMultiple" | "dropdownMode"> & Pick<CalendarIconProps, "icon"> & OmitUnion<PortalProps, "children" | "portalId"> & OmitUnion<PopperComponentProps, "className" | "hidePopper" | "targetComponent" | "popperComponent" | "popperOnKeyDown" | "showArrow"> & {
|
24 | dateFormatCalendar?: CalendarProps["dateFormat"];
|
25 | calendarClassName?: CalendarProps["className"];
|
26 | calendarContainer?: CalendarProps["container"];
|
27 | dropdownMode?: CalendarProps["dropdownMode"];
|
28 | onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;
|
29 | popperClassName?: PopperComponentProps["className"];
|
30 | showPopperArrow?: PopperComponentProps["showArrow"];
|
31 | open?: boolean;
|
32 | disabled?: boolean;
|
33 | readOnly?: boolean;
|
34 | startOpen?: boolean;
|
35 | onFocus?: React.FocusEventHandler<HTMLElement>;
|
36 | onBlur?: React.FocusEventHandler<HTMLElement>;
|
37 | onClickOutside?: ClickOutsideHandler;
|
38 | onInputClick?: VoidFunction;
|
39 | preventOpenOnFocus?: boolean;
|
40 | closeOnScroll?: boolean | ((event: Event) => boolean);
|
41 | isClearable?: boolean;
|
42 | clearButtonTitle?: string;
|
43 | clearButtonClassName?: string;
|
44 | ariaLabelClose?: string;
|
45 | className?: string;
|
46 | customInput?: Parameters<typeof cloneElement>[0];
|
47 | dateFormat?: string | string[];
|
48 | showDateSelect?: boolean;
|
49 | highlightDates?: (Date | HighlightDate)[];
|
50 | onCalendarOpen?: VoidFunction;
|
51 | onCalendarClose?: VoidFunction;
|
52 | strictParsing?: boolean;
|
53 | swapRange?: boolean;
|
54 | onInputError?: (error: {
|
55 | code: 1;
|
56 | msg: string;
|
57 | }) => void;
|
58 | allowSameDay?: boolean;
|
59 | withPortal?: boolean;
|
60 | focusSelectedMonth?: boolean;
|
61 | showIcon?: boolean;
|
62 | calendarIconClassname?: never;
|
63 | calendarIconClassName?: string;
|
64 | toggleCalendarOnIconClick?: boolean;
|
65 | holidays?: Holiday[];
|
66 | startDate?: Date;
|
67 | selected?: Date | null;
|
68 | value?: string;
|
69 | customInputRef?: string;
|
70 | id?: string;
|
71 | name?: string;
|
72 | form?: string;
|
73 | autoFocus?: boolean;
|
74 | placeholderText?: string;
|
75 | autoComplete?: string;
|
76 | title?: string;
|
77 | required?: boolean;
|
78 | tabIndex?: number;
|
79 | ariaDescribedBy?: string;
|
80 | ariaInvalid?: string;
|
81 | ariaLabelledBy?: string;
|
82 | ariaRequired?: string;
|
83 | onChangeRaw?: (event?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
|
84 | onSelect?: (date: Date | null, event?: React.MouseEvent<HTMLElement, MouseEvent> | React.KeyboardEvent<HTMLElement>) => void;
|
85 | } & ({
|
86 | selectsRange?: never;
|
87 | selectsMultiple?: never;
|
88 | onChange?: (date: Date | null, event?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
|
89 | } | {
|
90 | selectsRange: true;
|
91 | selectsMultiple?: never;
|
92 | onChange?: (date: [Date | null, Date | null], event?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
|
93 | } | {
|
94 | selectsRange?: never;
|
95 | selectsMultiple: true;
|
96 | onChange?: (date: Date[] | null, event?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
|
97 | });
|
98 | interface DatePickerState {
|
99 | open: boolean;
|
100 | wasHidden: boolean;
|
101 | lastPreSelectChange?: typeof PRESELECT_CHANGE_VIA_INPUT | typeof PRESELECT_CHANGE_VIA_NAVIGATE;
|
102 | inputValue: string | null;
|
103 | preventFocus: boolean;
|
104 | preSelection?: CalendarProps["preSelection"];
|
105 | shouldFocusDayInline?: CalendarProps["shouldFocusDayInline"];
|
106 | monthSelectedIn?: CalendarProps["monthSelectedIn"];
|
107 | focused?: CalendarProps["isInputFocused"];
|
108 | highlightDates: Required<CalendarProps>["highlightDates"];
|
109 | isRenderAriaLiveMessage?: boolean;
|
110 | }
|
111 | export default class DatePicker extends Component<DatePickerProps, DatePickerState> {
|
112 | static get defaultProps(): {
|
113 | allowSameDay: boolean;
|
114 | dateFormat: string;
|
115 | dateFormatCalendar: string;
|
116 | disabled: boolean;
|
117 | disabledKeyboardNavigation: boolean;
|
118 | dropdownMode: "scroll";
|
119 | preventOpenOnFocus: boolean;
|
120 | monthsShown: number;
|
121 | readOnly: boolean;
|
122 | withPortal: boolean;
|
123 | selectsDisabledDaysInRange: boolean;
|
124 | shouldCloseOnSelect: boolean;
|
125 | showTimeSelect: boolean;
|
126 | showTimeInput: boolean;
|
127 | showPreviousMonths: boolean;
|
128 | showMonthYearPicker: boolean;
|
129 | showFullMonthYearPicker: boolean;
|
130 | showTwoColumnMonthYearPicker: boolean;
|
131 | showFourColumnMonthYearPicker: boolean;
|
132 | showYearPicker: boolean;
|
133 | showQuarterYearPicker: boolean;
|
134 | showWeekPicker: boolean;
|
135 | strictParsing: boolean;
|
136 | swapRange: boolean;
|
137 | timeIntervals: number;
|
138 | timeCaption: string;
|
139 | previousMonthAriaLabel: string;
|
140 | previousMonthButtonLabel: string;
|
141 | nextMonthAriaLabel: string;
|
142 | nextMonthButtonLabel: string;
|
143 | previousYearAriaLabel: string;
|
144 | previousYearButtonLabel: string;
|
145 | nextYearAriaLabel: string;
|
146 | nextYearButtonLabel: string;
|
147 | timeInputLabel: string;
|
148 | enableTabLoop: boolean;
|
149 | yearItemNumber: number;
|
150 | focusSelectedMonth: boolean;
|
151 | showPopperArrow: boolean;
|
152 | excludeScrollbar: boolean;
|
153 | customTimeInput: null;
|
154 | calendarStartDay: undefined;
|
155 | toggleCalendarOnIconClick: boolean;
|
156 | usePointerEvent: boolean;
|
157 | };
|
158 | constructor(props: DatePickerProps);
|
159 | componentDidMount(): void;
|
160 | componentDidUpdate(prevProps: DatePickerProps, prevState: DatePickerState): void;
|
161 | componentWillUnmount(): void;
|
162 | preventFocusTimeout: ReturnType<typeof setTimeout> | undefined;
|
163 | inputFocusTimeout: ReturnType<typeof setTimeout> | undefined;
|
164 | calendar: Calendar | null;
|
165 | input: HTMLElement | null;
|
166 | getPreSelection: () => Date;
|
167 | modifyHolidays: () => HolidayItem[] | undefined;
|
168 | calcInitialState: () => DatePickerState;
|
169 | resetHiddenStatus: () => void;
|
170 | setHiddenStatus: () => void;
|
171 | setHiddenStateOnVisibilityHidden: () => void;
|
172 | clearPreventFocusTimeout: () => void;
|
173 | setFocus: () => void;
|
174 | setBlur: () => void;
|
175 | setOpen: (open: boolean, skipSetBlur?: boolean) => void;
|
176 | inputOk: () => boolean;
|
177 | isCalendarOpen: () => boolean;
|
178 | handleFocus: (event: React.FocusEvent<HTMLElement>) => void;
|
179 | sendFocusBackToInput: () => void;
|
180 | cancelFocusInput: () => void;
|
181 | deferFocusInput: () => void;
|
182 | handleDropdownFocus: () => void;
|
183 | handleBlur: (event: React.FocusEvent<HTMLElement>) => void;
|
184 | handleCalendarClickOutside: (event: MouseEvent) => void;
|
185 | handleChange: (event?: React.MouseEvent<HTMLElement, MouseEvent> | React.KeyboardEvent<HTMLElement> | undefined) => void;
|
186 | handleSelect: (date: Date, event?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, monthSelectedIn?: number) => void;
|
187 | setSelected: (date: Date | null, event?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, keepInput?: boolean, monthSelectedIn?: number) => void;
|
188 | setPreSelection: (date?: Date | null) => void;
|
189 | toggleCalendar: () => void;
|
190 | handleTimeChange: (time: Date) => void;
|
191 | onInputClick: () => void;
|
192 | onInputKeyDown: (event: React.KeyboardEvent<HTMLElement>) => void;
|
193 | onPortalKeyDown: (event: React.KeyboardEvent<HTMLDivElement>) => void;
|
194 | onDayKeyDown: (event: React.KeyboardEvent<HTMLDivElement>) => void;
|
195 | onPopperKeyDown: (event: React.KeyboardEvent<HTMLDivElement>) => void;
|
196 | onClearClick: (event?: React.MouseEvent<HTMLButtonElement>) => void;
|
197 | clear: () => void;
|
198 | onScroll: (event: Event) => void;
|
199 | renderCalendar: () => React.JSX.Element | null;
|
200 | renderAriaLiveRegion: () => React.JSX.Element;
|
201 | renderDateInput: () => React.FunctionComponentElement<any>;
|
202 | renderClearButton: () => JSX.Element | null;
|
203 | renderInputContainer(): JSX.Element;
|
204 | render(): JSX.Element | null;
|
205 | }
|
206 | declare const PRESELECT_CHANGE_VIA_INPUT = "input";
|
207 | declare const PRESELECT_CHANGE_VIA_NAVIGATE = "navigate";
|