commit | author | age
|
92485e
|
1 |
// Type definitions for react-datetime |
IV |
2 |
// Project: https://github.com/YouCanBookMe/react-datetime |
|
3 |
// Definitions by: Ivan Verevkin <vereva@x-root.org> |
|
4 |
|
a20f58
|
5 |
// These are the typings for Typescript 1.8 |
b46c6e
|
6 |
// for Typescript 2.0+ see DateTime.d.ts |
a20f58
|
7 |
|
92485e
|
8 |
//// <reference path="../moment/moment-node.d.ts" /> |
IV |
9 |
|
|
10 |
declare module ReactDatetime { |
|
11 |
import React = __React; |
|
12 |
// import * as moment from 'moment'; |
|
13 |
|
|
14 |
export interface DatetimepickerProps { |
|
15 |
/* |
|
16 |
Represents the selected date by the component, in order to use it as a controlled component. |
|
17 |
This prop is parsed by moment.js, so it is possible to use a date string or a moment.js date. |
|
18 |
*/ |
fe4c5c
|
19 |
value?: Date; |
92485e
|
20 |
/* |
IV |
21 |
Represents the selected date for the component to use it as a uncontrolled component. |
|
22 |
This prop is parsed by moment.js, so it is possible to use a date string or a moment.js date. |
|
23 |
*/ |
fe4c5c
|
24 |
defaultValue?: Date; |
92485e
|
25 |
/* |
c276ec
|
26 |
Represents the month which is viewed on opening the calendar when there is no selected date. |
SVT |
27 |
This prop is parsed by Moment.js, so it is possible to use a date `string` or a `moment` object. |
|
28 |
*/ |
|
29 |
viewDate?: Date; |
|
30 |
/* |
92485e
|
31 |
Defines the format for the date. It accepts any moment.js date format. |
IV |
32 |
If true the date will be displayed using the defaults for the current locale. |
|
33 |
If false the datepicker is disabled and the component can be used as timepicker. |
|
34 |
*/ |
|
35 |
dateFormat?: boolean|string; |
|
36 |
/* |
|
37 |
Defines the format for the time. It accepts any moment.js time format. |
|
38 |
If true the time will be displayed using the defaults for the current locale. |
|
39 |
If false the timepicker is disabled and the component can be used as datepicker. |
|
40 |
*/ |
|
41 |
timeFormat?: boolean|string; |
|
42 |
/* |
c5845c
|
43 |
Whether to show an input field to edit the date manually. |
92485e
|
44 |
*/ |
IV |
45 |
input?: boolean; |
|
46 |
/* |
c5845c
|
47 |
Whether to open or close the picker. If not set react-datetime will open the |
92485e
|
48 |
datepicker on input focus and close it on click outside. |
IV |
49 |
*/ |
|
50 |
open?: boolean; |
|
51 |
/* |
|
52 |
Manually set the locale for the react-datetime instance. |
|
53 |
Moment.js locale needs to be loaded to be used, see i18n docs. |
|
54 |
*/ |
|
55 |
locale?: string; |
|
56 |
/* |
049c33
|
57 |
Whether to interpret input times as UTC or the user's local timezone. |
TS |
58 |
*/ |
|
59 |
utc?: boolean; |
|
60 |
/* |
fe4c5c
|
61 |
Callback trigger when the date changes. The callback receives the selected `moment` object as |
MV |
62 |
only parameter, if the date in the input is valid. If the date in the input is not valid, the |
|
63 |
callback receives the value of the input (a string). |
92485e
|
64 |
*/ |
fe4c5c
|
65 |
onChange?: (momentOrInputString: string|any) => void; |
92485e
|
66 |
/* |
IV |
67 |
Callback trigger for when the user opens the datepicker. |
|
68 |
*/ |
fe4c5c
|
69 |
onFocus?: () => void; |
92485e
|
70 |
/* |
IV |
71 |
Callback trigger for when the user clicks outside of the input, simulating a regular onBlur. |
fe4c5c
|
72 |
The callback receives the selected `moment` object as only parameter, if the date in the input |
MV |
73 |
is valid. If the date in the input is not valid, the callback receives the value of the |
|
74 |
input (a string). |
92485e
|
75 |
*/ |
fe4c5c
|
76 |
onBlur?: (momentOrInputString : string|any) => void; |
92485e
|
77 |
/* |
b8d07e
|
78 |
Callback trigger when the view mode changes. The callback receives the selected view mode |
SE |
79 |
string ('years', 'months', 'days', 'time') as only parameter. |
|
80 |
*/ |
|
81 |
onViewModeChange?: (viewMode: string) => void; |
|
82 |
/* |
92485e
|
83 |
The default view to display when the picker is shown. ('years', 'months', 'days', 'time') |
IV |
84 |
*/ |
|
85 |
viewMode?: string|number; |
|
86 |
/* |
|
87 |
Extra class names for the component markup. |
|
88 |
*/ |
|
89 |
className?: string; |
|
90 |
/* |
|
91 |
Defines additional attributes for the input element of the component. |
|
92 |
*/ |
|
93 |
inputProps?: Object; |
|
94 |
/* |
b6f2dd
|
95 |
Replace the rendering of the input element. The accepted function has openCalendar |
DF |
96 |
(a function which opens the calendar) and the default calculated props for the input. |
|
97 |
Must return a React component or null. |
|
98 |
*/ |
|
99 |
renderInput?: (props: Object, openCalendar: Function) => React.Component<any, any>; |
|
100 |
/* |
92485e
|
101 |
Define the dates that can be selected. The function receives (currentDate, selectedDate) |
IV |
102 |
and should return a true or false whether the currentDate is valid or not. See selectable dates. |
|
103 |
*/ |
fe4c5c
|
104 |
isValidDate?: (currentDate: any, selectedDate: any) => boolean; |
92485e
|
105 |
/* |
IV |
106 |
Customize the way that the days are shown in the day picker. The accepted function has |
|
107 |
the selectedDate, the current date and the default calculated props for the cell, |
|
108 |
and must return a React component. See appearance customization |
|
109 |
*/ |
fe4c5c
|
110 |
renderDay?: (props: any, currentDate: any, selectedDate: any) => React.Component<any, any>; |
92485e
|
111 |
/* |
IV |
112 |
Customize the way that the months are shown in the month picker. |
|
113 |
The accepted function has the selectedDate, the current date and the default calculated |
|
114 |
props for the cell, the month and the year to be shown, and must return a |
|
115 |
React component. See appearance customization |
|
116 |
*/ |
fe4c5c
|
117 |
renderMonth?: (props: any, month: number, year: number, selectedDate: any) => React.Component<any, any>; |
92485e
|
118 |
/* |
IV |
119 |
Customize the way that the years are shown in the year picker. |
|
120 |
The accepted function has the selectedDate, the current date and the default calculated |
|
121 |
props for the cell, the year to be shown, and must return a React component. |
|
122 |
See appearance customization |
|
123 |
*/ |
fe4c5c
|
124 |
renderYear?: (props: any, year: number, selectedDate: any) => React.Component<any, any>; |
92485e
|
125 |
/* |
IV |
126 |
Whether to use moment's strict parsing when parsing input. |
|
127 |
*/ |
|
128 |
strictParsing?: boolean; |
|
129 |
/* |
|
130 |
When true, once the day has been selected, the react-datetime will be automatically closed. |
|
131 |
*/ |
|
132 |
closeOnSelect?: boolean; |
fe4c5c
|
133 |
/* |
MV |
134 |
Allow to add some constraints to the time selector. It accepts an object with the format |
|
135 |
{hours:{ min: 9, max: 15, step:2}} so the hours can't be lower than 9 or higher than 15, and |
|
136 |
it will change adding or subtracting 2 hours everytime the buttons are clicked. The constraints |
|
137 |
can be added to the hours, minutes, seconds and milliseconds. |
|
138 |
*/ |
049c33
|
139 |
timeConstraints?: Object; |
fe4c5c
|
140 |
/* |
MV |
141 |
When true, keep the picker open when click event is triggered outside of component. When false, |
|
142 |
close it. |
|
143 |
*/ |
|
144 |
disableOnClickOutside?: boolean; |
92485e
|
145 |
} |
IV |
146 |
|
|
147 |
interface DatetimeComponent extends React.ComponentClass<DatetimepickerProps> { |
|
148 |
} |
|
149 |
} |
|
150 |
|
|
151 |
declare module "react-datetime" { |
|
152 |
var ReactDatetime: ReactDatetime.DatetimeComponent; |
|
153 |
export = ReactDatetime; |
|
154 |
} |