DatePicker
A date field with a month calendar popover — Attio's date-cell editor.
The date editor behind Attio's date fields: an outlined trigger showing the value that opens a month calendar (weekday row, day grid, today outline, selected day brand-filled, month navigation). It composes Popover for the surface.
Preview
Usage
import { DatePicker } from "crisp";
const [date, setDate] = useState<Date | null>(null);
<DatePicker value={date} onChange={setDate} aria-label="Founded" />;API
| Prop | Type | Default | Description |
|---|---|---|---|
value | Date | null | — | Controlled value (omit to self-manage). |
defaultValue | Date | null | — | Initial value when uncontrolled. |
onChange | (date: Date) => void | — | Fires when a day is picked. |
placeholder | string | "Set date…" | Trigger label when empty. |
format | (date: Date) => string | Mon D, YYYY | Formats the trigger label. |