Lingua Time Date and Time Picker

To add the Lingua Time Date and Time Picker component to your project, use the shadcn CLI to pull the component directly from the remote registry using the following command:

pnpx shadcn@canary add https://raw.githubusercontent.com/nainglinnkhant/lingua-time/refs/heads/main/public/r/lingua-time.json

If you are contributing to the project or running it locally for development, use bun to manage dependencies and start the development server:

1. Install dependencies: bun i
2. Start the dev server: bun dev

The DateTimePicker component is designed to work seamlessly with react-hook-form. When integrating it into a form, pass the following props to connect it to the form state:

• name: The name of the field in the form.
• dateTime: The current value of the date/time.
• setDateTime: The callback function to update the value (typically onChange).
• onBlur: The blur handler for form validation/tracking.
• disabled: Boolean to disable the picker.
• autoComplete: Set to "off" to prevent browser interference.
• aria-describedby: Accessibility attribute (can be passed as undefined).

<DateTimePicker
  name={name}
  dateTime={value}
  setDateTime={onChange}
  onBlur={onBlur}
  disabled={disabled}
  autoComplete="off"
  aria-describedby={undefined}
/>