DocSpace-client/packages/components/date-picker
2023-04-07 17:44:11 +05:30
..
date-picker.stories_.js Web: Hide date-picker story 2023-03-16 18:22:43 +04:00
date-picker.test.js Web: Moved all clients app to packages directory 2022-07-22 22:01:25 +03:00
index.js Web: Components: DatePicker - descriptions changed 2023-04-07 17:44:11 +05:30
README.md unused value was removed 2023-03-08 23:07:25 +05:00
styled-date-picker.js Web: Moved all clients app to packages directory 2022-07-22 22:01:25 +03:00

DatePicker

Base DatePicker component

Usage

import DatePicker from "@docspace/components/date-picker";
<DatePicker
  onChange={(date) => {
    console.log("Selected date", date);
  }}
  selectedDate={new Date()}
  minDate={new Date("1970/01/01")}
  maxDate={new Date(new Date().getFullYear() + 1 + "/01/01")}
  isDisabled={false}
  isReadOnly={false}
  hasError={false}
  isOpen={false}
  locale="en"
/>

Properties

Props Type Required Values Default Description
calendarHeaderContent string - - - Calendar header content (calendar opened in aside)
className string - - - Accepts class
displayType oneOf - dropdown, aside, auto auto Calendar display type
hasError bool - - Set error date-input style
id string - - - Accepts id
isDisabled bool - - - Disabled react-calendar
isOpen bool - - Opens calendar
isReadOnly bool - - Set input type is read only
locale string - - User's browser settings Browser locale
maxDate date - - new Date("3000/01/01") Maximum date that the user can select.
minDate date - - new Date("1970/01/01") Minimum date that the user can select.
onChange func - - - Function called when the user select a day
initialDate date - - (today) Opened date value
scaled bool - - Selected calendar size
selectedDate date - - (today) Selected date value
style obj, array - - - Accepts css style
zIndex number - - 310 Calendar css z-index