| commit | author | age | ||
| 752fa8 | 1 | import * as React from "react"; |
| KJ | 2 | import { Moment } from "moment"; |
| 3 | import * as ReactDatetime from "react-datetime"; | |
| a20f58 | 4 | |
| AS | 5 | /* |
| 6 | Test the datetime picker. | |
| 7 | */ | |
| 8 | ||
| 9 | const TEST_BASIC_USAGE: JSX.Element = <ReactDatetime />; | |
| 10 | ||
| 11 | /* | |
| 12 | Test date properties | |
| 13 | */ | |
| 14 | ||
| 15 | const TEST_DATE_PROPS_FOR_VALUE: JSX.Element = <ReactDatetime | |
| 16 | value={ new Date() } | |
| 17 | />; | |
| 18 | ||
| 19 | const TEST_DATE_PROPS_FOR_DEFAULT_VALUE: JSX.Element = <ReactDatetime | |
| 20 | defaultValue={ new Date() } | |
| 21 | />; | |
| 22 | ||
| 23 | /* | |
| 24 | Test formats | |
| 25 | */ | |
| 26 | ||
| 27 | const TEST_FORMAT_PROPS_AS_STRINGS: JSX.Element = <ReactDatetime | |
| 28 | dateFormat='mm/dd/yyyy' | |
| 29 | timeFormat='hh:mm:ss' | |
| 30 | />; | |
| 31 | ||
| 32 | const TEST_FORMAT_PROPS_AS_BOOLEANS: JSX.Element = <ReactDatetime | |
| 33 | dateFormat={ false } | |
| 34 | timeFormat={ false } | |
| 35 | />; | |
| 36 | ||
| 37 | /* | |
| 38 | Test boolean options | |
| 39 | */ | |
| 40 | ||
| 41 | const TEST_BOOLEAN_PROPS: JSX.Element = <ReactDatetime | |
| 42 | input={ false } | |
| 43 | open={ false } | |
| 44 | strictParsing={ false } | |
| 45 | closeOnSelect={ false } | |
| 46 | disableOnClickOutside={ false } | |
| 47 | utc={ false } | |
| 48 | />; | |
| 49 | ||
| 50 | /* | |
| 51 | Test locale options | |
| 52 | */ | |
| 53 | ||
| 54 | const TEST_LOCALE_PROPS: JSX.Element = <ReactDatetime | |
| 55 | locale='en-us' | |
| 56 | />; | |
| 57 | ||
| 58 | /* | |
| 59 | Test input props | |
| 60 | */ | |
| 61 | ||
| 62 | const TEST_INPUT_PROPS: JSX.Element = <ReactDatetime | |
| 63 | inputProps={ | |
| 64 | { | |
| 65 | 'placeholder': 'mm/dd/yyyy' | |
| 66 | } | |
| 67 | } | |
| 68 | />; | |
| 69 | ||
| 70 | /* | |
| 71 | Test Event handlers | |
| 72 | */ | |
| 73 | ||
| 74 | const TEST_EVENT_HANDLERS_WITH_STRINGS: JSX.Element = <ReactDatetime | |
| 75 | onChange={ | |
| 76 | (momentOrInputString:string) => {} | |
| 77 | } | |
| 78 | onFocus={ | |
| 79 | () => {} | |
| 80 | } | |
| 81 | onBlur={ | |
| 82 | (momentOrInputString:string) => {} | |
| 83 | } | |
| 84 | />; | |
| 85 | ||
| 86 | const TEST_EVENT_HANDLERS_WITH_MOMENT: JSX.Element = <ReactDatetime | |
| 87 | onChange={ | |
| 88 | (momentOrInputString:Moment) => {} | |
| 89 | } | |
| 90 | onBlur={ | |
| 91 | (momentOrInputString:Moment) => {} | |
| 92 | } | |
| 93 | />; | |
| 94 | ||
| 95 | /* | |
| 96 | Test view mode and className | |
| 97 | */ | |
| 98 | ||
| 99 | const TEST_VIEW_MODE_AND_CLASS_PROPS: JSX.Element = <ReactDatetime | |
| 100 | viewMode='days' | |
| 101 | className='rdt' | |
| 102 | />; | |
| 103 | ||
| 104 | /* | |
| 105 | Test date validator | |
| 106 | */ | |
| 107 | ||
| 108 | const TEST_DATE_VALIDATOR_PROP: JSX.Element = <ReactDatetime | |
| 109 | isValidDate={ (currentDate:any, selectedDate:any) => { | |
| 110 | return true; | |
| 111 | } } | |
| 112 | />; | |
| 113 | ||
| 114 | /* | |
| 115 | Test customizable components | |
| 116 | */ | |
| 117 | ||
| 118 | const TEST_CUSTOMIZABLE_COMPONENT_PROPS: JSX.Element = <ReactDatetime | |
| 752fa8 | 119 | renderDay={ (props: any, currentDate: any, selectedDate: any) => { |
| a20f58 | 120 | return <td {...props}>{ '0' + currentDate.date() }</td>; |
| AS | 121 | } } |
| 752fa8 | 122 | renderMonth={ (props: any, month: any, year: any, selectedDate: any) => { |
| a20f58 | 123 | return <td {...props}>{ month }</td>; |
| AS | 124 | } } |
| 752fa8 | 125 | renderYear={ (props: any, year: any, selectedDate: any) => { |
| a20f58 | 126 | return <td {...props}>{ year % 100 }</td>; |
| AS | 127 | } } |
| 128 | />; | |
| 129 | ||
| 130 | /* | |
| 131 | Test time constraints. | |
| 132 | */ | |
| 133 | ||
| 134 | const TEST_BASIC_TIME_CONSTRAINTS: JSX.Element = <ReactDatetime | |
| 135 | timeConstraints={ {} } | |
| 136 | />; | |
| 137 | ||
| 138 | const TEST_TIME_CONSTRAINTS_WITH_ONE: JSX.Element = <ReactDatetime | |
| 139 | timeConstraints={ { | |
| 140 | 'hours': { | |
| 141 | 'min': 0, | |
| 142 | 'max': 23, | |
| 143 | 'step': 1 | |
| 144 | } | |
| 145 | } } | |
| 146 | />; | |
| 147 | ||
| 148 | const TEST_TIME_CONSTRAINTS_WITH_ALL: JSX.Element = <ReactDatetime | |
| 149 | timeConstraints={ { | |
| 150 | 'hours': { | |
| 151 | 'min': 0, | |
| 152 | 'max': 23, | |
| 153 | 'step': 1 | |
| 154 | }, | |
| 155 | 'minutes': { | |
| 156 | 'min': 0, | |
| 157 | 'max': 59, | |
| 158 | 'step': 1 | |
| 159 | }, | |
| 160 | 'seconds': { | |
| 161 | 'min': 0, | |
| 162 | 'max': 59, | |
| 163 | 'step': 1, | |
| 164 | }, | |
| 165 | 'milliseconds': { | |
| 166 | 'min': 0, | |
| 167 | 'max': 999, | |
| 168 | 'step': 1 | |
| 169 | } | |
| 170 | } } | |
| 171 | />; | |
