DatePicker

January 29, 2026 ยท View on GitHub

Base DatePicker component

Usage

import { DatePicker } from "@docspace/ui-kit";
<DatePicker
  onChange={(date) => {
    console.log("Selected date", date);
  }}
  date={new Date()}
  minDate={new Date("1970/01/01")}
  maxDate={new Date(new Date().getFullYear() + 1 + "/01/01")}
  locale="en"
/>

Properties

PropsTypeRequiredValuesDefaultDescription
selectDateTextstring---Select date text
classNamestring---Accepts class
initialDatedate, string---Default date
idstring---Accepts id
localestring--User's browser settingsBrowser locale
maxDatedate, string---Maximum date that the user can select.
minDatedate, string---Minimum date that the user can select.
onChangefunc---Function called when the user select a day
showCalendarIconbool---Shows calendar icon in selected item
outerDateobj---Allows to track date outside the component
openDatedate, string---Allows to set first shown date in calendar