Datetime Picker and Time Input

1"use client";
2import React, { useState } from "react";
3import { DateTimePicker, TimePicker } from "@/components/ui/datetime-picker";
4 
5const DatePickerAndTimeInput = () => {
6  const [date, setDate] = useState<Date | undefined>(undefined);
7  const [time, setTime] = useState<Date | undefined>(undefined);
8 
9  return (
10    <div className="flex flex-col gap-3 md:flex-row md:gap-10">
11      <div className="w-72 space-y-2">
12        <p>Date Picker</p>
13        <DateTimePicker
14          granularity="day"
15          value={date}
16          onChange={setDate}
17          locale={undefined}
18          weekStartsOn={undefined}
19          showWeekNumber={undefined}
20          showOutsideDays={undefined}
21        />
22      </div>
23      <div className="w-72 space-y-2">
24        <p>Time Input</p>
25        <TimePicker date={time} onChange={setTime} />
26      </div>
27    </div>
28  );
29};
30 
31export default DatePickerAndTimeInput;