Datetime Picker Ref

1"use client";
2import React, { useRef, useState } from "react";
3import { Button } from "@/components/ui/button";
4import {
5  DateTimePicker,
6  DateTimePickerRef,
7} from "@/components/ui/datetime-picker";
8 
9const DatetimePickerRef = () => {
10  const [date, setDate] = useState<Date | undefined>(undefined);
11  const ref = useRef<DateTimePickerRef>(null);
12 
13  return (
14    <div className="w-72 space-y-3">
15      <Button
16        onClick={() => {
17          alert(JSON.stringify(ref.current?.value?.toLocaleString()));
18          /** following are the ref operations which is equivalent to button. */
19          // ref.current?.focus();
20          // ref.current?.blur();
21          // ...
22        }}
23      >
24        alert ref value
25      </Button>
26      <DateTimePicker ref={ref} value={date} onChange={setDate} />
27    </div>
28  );
29};
30 
31export default DatetimePickerRef;