Date Picker
Selected
"2026-02-02T19:37:25.448Z"
ISO Date with time set
2026-02-02T19:37:25.448Z
Local date with time set
2/2/2026, 7:37:25 PM
Timezone
UTC 0 minutes in UTC
import { Container } from '@/components/container'
import type { DocumentedProperty } from '@/models/system'
import { DatePicker } from '@creation-ui/react'
import { useState, type FC } from 'react'
export const DatePickerExample = () => {
const [selectedDate, setSelectedDate] = useState<Date | null>(null)
const handleDateChange = (date: any) => {
setSelectedDate(date)
}
return (
<Container variant='column'>
<DatePicker value={selectedDate} onChange={handleDateChange} />
<CurrentDate date={selectedDate} />
</Container>
)
}
Component API
| Prop | Default | Description |
value | — | Date | null | undefinedDate selected in calendar |
onChange | — | (date: Date | null | undefined) => voidCallback function when date is selected |
Rest of the props is the same as in Input props and controls the Input element.
Last updated on