Date Field

DateField is an input-based date control from @hoag/ui/common/data-input/dates/date-field.

Installation

pnpm --filter @hoag/ui build

Usage

import { DateField } from "@hoag/ui/date-field";
 
<DateField
  label="Ngày sinh"
  placeholder="dd/MM/yyyy"
  strictValidation
  onChange={(date) => console.log(date)}
/>;

Examples

Basic

<DateField placeholder="dd/MM/yyyy" />

With constraints

<DateField
  minDate={new Date(2000, 0, 1)}
  maxDate={new Date(2030, 11, 31)}
  strictValidation
/>

API Reference

Prop	Type	Description
`value`	`Date \| string \| null`	Controlled date value.
`onChange`	`(date: Date \| null) => void`	Callback when parsed date changes.
`strictValidation`	`boolean`	Enable strict dd/MM/yyyy validation.
`minDate` / `maxDate`	`Date`	Min/max date boundaries.

Date Picker Date Time Picker