UIDateTimePicker
Create a simple input with time-picker functionality.
Since: 6.5.0 (6.4.0)
placeholder
string
Required - The text of the date picker placeholder if no date is selected
keepPlaceholderInValue
boolean
false
If set to true date picker value will be displayed together with placeholder, ex: "From 2020-01-01"
disabled
boolean
false
Set to true to disable input
size
string
"normal"
Input size presentation. Supports small|normal|large
modalSize
string
Adjusts the size of modal calendar, default size is large. "small", or "large"
type
string
Style for the input.
value
string
Required - The date and time to present in the input, should be in YYYY-MM-DD HH:mm format (2020-04-23 12:00), if empty string, value will be set to "now"
onChange
function
Required - Callback for when the input is changed, callback will be called with one argument, the new value in YYYY-MM-DD HH:mm format
Example
import {UIDateTimePicker} from 'writer'
render($$) {
    return $$('div').append(
        $$(UIDateTimePicker, {
            placeholder: 'Pick a date',
            keepPlaceholderInValue: false,
            disabled: false,
            value: this.state.myDateTimeValue,
            onChange: (newDateTime) => {
                this.extendState({ myDateTimeValue: newDateTime })
            },
        }).ref('myDateTimeValue')
    )
}Was this helpful?
