@hoag/ui — UI components built with shadcn, Radix UI & Tailwind CSS
Components
Date Time Picker

Date Time Picker

DateTimePicker combines calendar date selection and time selection in one control.

Installation

pnpm --filter @hoag/ui build

Usage

import { DateTimePicker } from "@hoag/ui/date-time-picker";
 
<DateTimePicker value={new Date()} onChange={(date) => console.log(date)} />;

Examples

Basic

<DateTimePicker value={new Date()} />

12-hour mode

<DateTimePicker use12HourFormat value={new Date()} />

API Reference

PropTypeDescription
valueDate | string | numberCurrent date-time value.
onChange(date?: Date) => voidCallback when value changes.
use12HourFormatbooleanUse 12-hour time format.
disabledbooleanDisable the picker.