import React from "react";
import { DatePicker as BaseDatePicker } from "baseui/datepicker";

export interface DatePickerProps {
  children?: React.ReactNode;
  value: any[];
  onChange: (date: any) => void;
}

/**
 * This is the `<DatePicker>` component <br />
 *  Use this to gather date/time data from the user
 */
const DatePicker: React.FC<DatePickerProps> = (props) => {
  return (
    <BaseDatePicker
      {...props}
      formatString="dd/MM/yyyy"
      overrides={{
        Input: {
          props: {
            overrides: {
              Root: {
                style: () => ({
                  borderRadius: "4px",
                  borderColor: "#b3b5bd",
                }),
              },
              InputContainer: {
                style: () => ({
                  backgroundColor: "white",
                }),
              },
            },
          },
        },
      }}
    />
  );
};

export default DatePicker;