1 | /// <reference types="react" />
|
2 | import PropTypes from 'prop-types';
|
3 | import { DateFormats } from './Localization';
|
4 | import { RenderDayProp } from './Month';
|
5 | import SlideTransitionGroup from './SlideTransitionGroup';
|
6 | import { WidgetHTMLProps, WidgetProps, InferFormat } from './shared';
|
7 | declare type Direction = 'DOWN' | 'UP' | 'LEFT' | 'RIGHT';
|
8 | declare type SlideDirection = 'bottom' | 'top' | 'left' | 'right';
|
9 | declare type View = 'month' | 'year' | 'decade' | 'century';
|
10 | export interface CalendarProps<TLocalizer = unknown> extends WidgetHTMLProps, WidgetProps {
|
11 | bordered?: boolean;
|
12 | views?: View[];
|
13 | disabled?: boolean;
|
14 | readOnly?: boolean;
|
15 | value?: Date | null;
|
16 | defaultValue?: Date;
|
17 | onChange?: (nextValue: Date) => void;
|
18 | min?: Date;
|
19 | max?: Date;
|
20 | view?: View;
|
21 | defaultView?: View;
|
22 | onViewChange?: (nextView: View) => void;
|
23 | currentDate?: Date;
|
24 | defaultCurrentDate?: Date;
|
25 | onCurrentDateChange?: (nextDate: Date) => void;
|
26 | onNavigate?: (date: Date, slideDirection: SlideDirection, nextView: View) => void;
|
27 | renderDay?: RenderDayProp;
|
28 | formats?: DateFormats<InferFormat<TLocalizer>>;
|
29 | messages?: {
|
30 | moveBack?: string;
|
31 | moveForward?: string;
|
32 | moveToday?: string;
|
33 | };
|
34 | }
|
35 | /**
|
36 | * @public
|
37 | */
|
38 | declare function Calendar({ id, autoFocus, bordered, views, tabIndex, disabled, readOnly, className, value, defaultValue, onChange, currentDate: pCurrentDate, defaultCurrentDate, onCurrentDateChange, min, max, view, defaultView, onViewChange, onKeyDown, onNavigate, renderDay, messages, formats, ...elementProps }: CalendarProps): JSX.Element;
|
39 | declare namespace Calendar {
|
40 | var displayName: string;
|
41 | var propTypes: {
|
42 | /**
|
43 | * @example ['disabled', ['new Date()']]
|
44 | */
|
45 | disabled: PropTypes.Requireable<boolean>;
|
46 | /**
|
47 | * @example ['readOnly', ['new Date()']]
|
48 | */
|
49 | readOnly: PropTypes.Requireable<boolean>;
|
50 | /**
|
51 | * @example ['onChangePicker', [ ['new Date()'] ]]
|
52 | */
|
53 | onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
54 | /**
|
55 | * The selected Date.
|
56 | *
|
57 | * ```tsx live
|
58 | * import { Calendar } from 'react-widgets';
|
59 | *
|
60 | * <Calendar value={new Date()} />
|
61 | * ```
|
62 | * @example false
|
63 | */
|
64 | value: PropTypes.Requireable<Date>;
|
65 | /**
|
66 | * The minimum date that the Calendar can navigate from.
|
67 | *
|
68 | * @example ['prop', ['min', 'new Date()']]
|
69 | */
|
70 | min: PropTypes.Requireable<Date>;
|
71 | /**
|
72 | * The maximum date that the Calendar can navigate to.
|
73 | *
|
74 | * @example ['prop', ['max', 'new Date()']]
|
75 | */
|
76 | max: PropTypes.Requireable<Date>;
|
77 | /**
|
78 | * Default current date at which the calendar opens. If none is provided, opens at today's date or the `value` date (if any).
|
79 | */
|
80 | currentDate: PropTypes.Requireable<Date>;
|
81 | /**
|
82 | * Change event Handler that is called when the currentDate is changed. The handler is called with the currentDate object.
|
83 | */
|
84 | onCurrentDateChange: PropTypes.Requireable<(...args: any[]) => any>;
|
85 | /** Specify the navigate into the past header icon */
|
86 | navigatePrevIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
87 | /** Specify the navigate into the future header icon */
|
88 | navigateNextIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
89 | /**
|
90 | * Controls the currently displayed calendar view. Use `defaultView` to set a unique starting view.
|
91 | *
|
92 | * @type {("month"|"year"|"decade"|"century")}
|
93 | * @controllable onViewChange
|
94 | */
|
95 | view(props: any, ...args: any[]): Error | null;
|
96 | /**
|
97 | * Defines a list of views the Calendar can traverse through, starting with the
|
98 | * first in the list to the last.
|
99 | *
|
100 | * @type array<"month"|"year"|"decade"|"century">
|
101 | */
|
102 | views: PropTypes.Requireable<(View | null | undefined)[]>;
|
103 | /**
|
104 | * A callback fired when the `view` changes.
|
105 | *
|
106 | * @controllable view
|
107 | */
|
108 | onViewChange: PropTypes.Requireable<(...args: any[]) => any>;
|
109 | /**
|
110 | * Callback fired when the Calendar navigates between views, or forward and backwards in time.
|
111 | *
|
112 | * @type function(date: ?Date, direction: string, view: string)
|
113 | */
|
114 | onNavigate: PropTypes.Requireable<(...args: any[]) => any>;
|
115 | culture: PropTypes.Requireable<string>;
|
116 | autoFocus: PropTypes.Requireable<boolean>;
|
117 | /**
|
118 | * Show or hide the Calendar footer.
|
119 | *
|
120 | * @example ['prop', ['footer', true]]
|
121 | */
|
122 | footer: PropTypes.Requireable<boolean>;
|
123 | /**
|
124 | * Provide a custom component to render the days of the month. The Component is provided the following props
|
125 | *
|
126 | * - `date`: a `Date` object for the day of the month to render
|
127 | * - `label`: a formatted `string` of the date to render. To adjust the format of the `label` string use the `dateFormat` prop, listed below.
|
128 | */
|
129 | renderDay: PropTypes.Requireable<(...args: any[]) => any>;
|
130 | formats: PropTypes.Requireable<PropTypes.InferProps<{
|
131 | /**
|
132 | * A formatter for the header button of the month view.
|
133 | *
|
134 | * @example ['dateFormat', ['headerFormat', "{ date: 'medium' }"]]
|
135 | */
|
136 | header: PropTypes.Requireable<any>;
|
137 | /**
|
138 | * A formatter for the Calendar footer, formats today's Date as a string.
|
139 | *
|
140 | * @example ['dateFormat', ['footerFormat', "{ date: 'medium' }", "date => 'Today is: ' + formatter(date)"]]
|
141 | */
|
142 | footer: PropTypes.Requireable<any>;
|
143 | /**
|
144 | * A formatter calendar days of the week, the default formats each day as a Narrow name: "Mo", "Tu", etc.
|
145 | *
|
146 | * @example ['prop', { day: "day => \n['🎉', 'M', 'T','W','Th', 'F', '🎉'][day.getDay()]" }]
|
147 | */
|
148 | day: PropTypes.Requireable<any>;
|
149 | /**
|
150 | * A formatter for day of the month
|
151 | *
|
152 | * @example ['prop', { date: "dt => String(dt.getDate())" }]
|
153 | */
|
154 | date: PropTypes.Requireable<any>;
|
155 | /**
|
156 | * A formatter for month name.
|
157 | *
|
158 | * @example ['dateFormat', ['monthFormat', "{ raw: 'MMMM' }", null, { defaultView: '"year"' }]]
|
159 | */
|
160 | month: PropTypes.Requireable<any>;
|
161 | /**
|
162 | * A formatter for month name.
|
163 | *
|
164 | * @example ['dateFormat', ['yearFormat', "{ raw: 'yy' }", null, { defaultView: '"decade"' }]]
|
165 | */
|
166 | year: PropTypes.Requireable<any>;
|
167 | /**
|
168 | * A formatter for decade, the default formats the first and last year of the decade like: 2000 - 2009.
|
169 | */
|
170 | decade: PropTypes.Requireable<any>;
|
171 | /**
|
172 | * A formatter for century, the default formats the first and last year of the century like: 1900 - 1999.
|
173 | */
|
174 | century: PropTypes.Requireable<any>;
|
175 | }>>;
|
176 | messages: PropTypes.Requireable<PropTypes.InferProps<{
|
177 | moveBack: PropTypes.Requireable<string>;
|
178 | moveForward: PropTypes.Requireable<string>;
|
179 | }>>;
|
180 | onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
181 | /** @ignore */
|
182 | tabIndex: PropTypes.Requireable<any>;
|
183 | };
|
184 | var Transition: typeof SlideTransitionGroup;
|
185 | var move: (date: Date, min: Date, max: Date, view: View, direction: Direction) => Date;
|
186 | }
|
187 | export default Calendar;
|
188 | //# sourceMappingURL=Calendar.d.ts.map |
\ | No newline at end of file |