Design System

Component usage guide template

Browse Components

rhf

RHF Time Picker

React Hook Form wrapper cho Time Picker với hỗ trợ validation và error handling tích hợp.

1. Import
Import the RHF Time Picker component from the design system.
import { RHFTimePicker } from "@/design-system/components/rhf";
2. Props
RHF Time Picker component props.
PropTypeDefault
controlControl<T>--
namePath<T>--
labelstring--
showSecondsbooleantrue
classNamestring--
wrapperClassNamestring--
requiredbooleanfalse
3. Usages
Các pattern và cấu hình RHFTimePicker phổ biến.
09:30:00
import { RHFTimePicker } from "@/design-system/components/rhf";
import { useForm } from "react-hook-form";

function Example() {
  const { control } = useForm({
    defaultValues: {
      time: "09:30:00",
    },
  });

  return (
    <RHFTimePicker
      control={control}
      name="time"
      label="Time"
    />
  );
}