DatePicker

The DatePicker component from Superset's UI library.

Live Example

Loading component...

Try It

Edit the code below to experiment with the component:

Live Editor

function Demo() {
  return (
    <DatePicker
      placeholder="Select date"
      format="YYYY-MM-DD hh:mm a"
      showNow
      showTime={{ format: 'hh:mm a', needConfirm: false }}
    />
  );
}

Result

Loading...

Props

Prop	Type	Default	Description
placeholder	string	"Select date"	-
showNow	boolean	true	Show "Now" button to select current date and time.
allowClear	boolean	false	-
autoFocus	boolean	true	-
disabled	boolean	false	-
format	string	"YYYY-MM-DD hh:mm a"	-
inputReadOnly	boolean	false	-
picker	string	"date"	-
placement	string	"bottomLeft"	-
size	string	"middle"	-
showTime	any	{"format":"hh:mm a","needConfirm":false}	-

Import

import { DatePicker } from '@superset/components';

---

Improve this page

This documentation is auto-generated from the component's Storybook story. Help improve it by editing the story file.