Date Picker
InputWeb + NativeMITCalendar-based date picker with input field and range selection support.
bun add @otfdashkit/ui
Preview
Date PickerInput
Loading Storybook preview…
Code
@otfdashkit/uiimport React, { useState } from 'react'
import { Field, DatePicker } from '@otfdashkit/ui'
function DatePickerDemo() {
const [date, setDate] = useState<Date | undefined>()
return (
<div className="max-w-xs">
<Field label="Appointment date">
<DatePicker value={date} onChange={setDate} placeholder="Select a date" />
</Field>
</div>
)
}
export function Example() {
return (
<DatePickerDemo />
)
}
Free with the SDK. This component ships in @otfdashkit/ui under the MIT license.
Props
Props declared in the DatePicker source. Inherited HTML attributes are not listed.
| Prop | Type | Default | Description |
|---|---|---|---|
| className | string | ||
| disabled | boolean | ||
| onChange | (date: Date) => void | ||
| placeholder | string | 'Pick a date' | |
| value | Date |