DatePicker API Overview
Initialization
import { DatePicker } from "@svar-ui/react-core";
// minimal configuration for initialization
<DatePicker />
tip
- Visit the Features Guide to learn more about the control's functionality.
- Explore the samples to visualize the available features.
DatePicker Properties
align | Optional. Defines how the calendar dropdown is aligned horizontally relative to the input field |
buttons | Optional. Shows/hides the Today and Clear buttons in the lower part of the drop-down calendar |
clear | Optional. Adds the Clear button into a date picker input |
css | Optional. Changes the position of the icon in the input |
disabled | Optional. Defines whether a date picker is disabled |
editable | Optional. Defines whether a date picker is editable or sets a custom format for editing a date |
error | Optional. Defines whether error styling is applied to a date picker |
format | Optional. Sets the date format for a date picker input |
id | optional. Sets an HTML id for a date picker |
placeholder | Optional. Sets a text for the input's placeholder |
title | Optional. Sets a tooltip text with additional info about the control |
value | Optional. Sets the value of a date picker |
width | Optional. Sets the width of a popup with a calendar |
DatePicker Events
change | Optional. Fires when a new date is selected in a date picker |