# UIDatePicker

Create a simple input with date-picker functionality.

**Since**: 6.5.0 (6.1.0)

| Name                   | Type       | Default    | Description                                                                                                                                   |
| ---------------------- | ---------- | ---------- | --------------------------------------------------------------------------------------------------------------------------------------------- |
| placeholder            | `string`   |            | **Required** - The text of the placeholder if no date is selected                                                                             |
| value                  | `string`   |            | **Required** - The date to present in the input, should be in `YYYY-MM-DD` format (2019-11-01), if empty string, value will be set to "today" |
| 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.                                                                                                                          |
| disabled               | `boolean`  | `false`    | Set to true to disable input                                                                                                                  |
| keepPlaceholderInValue | `boolean`  | `false`    |                                                                                                                                               |
| min                    | `number`   |            | Min value for range. `YYYY-MM-DD` format                                                                                                      |
| max                    | `number`   |            | Max value for range. `YYYY-MM-DD` format                                                                                                      |
| onChange               | `function` |            | Callback for when the input is changed, callback will be called with one argument, the new value in `YYYY-MM-DD` format                       |

### Example

```js
import {UIDatePicker} from 'writer'

render($$) {
    return $$('div').append(
        $$(UIDatePicker, {
            value: '2019-11-01',
            modalSize: 'small',
            onChange: (newValue) => {
                this.extendState({ inputDateValue: newValue })
            },
        }).ref('myInputDateValue')
    )
}
```