import tw, { styled } from "twin.macro";
import "styled-components/macro";

import Input, { useField } from "@shared/nej-react-components/Parts/Input";

export default function DateField(props) {
  
  const [{onChange, value, ...field}, meta, helpers] = useField(props);

  let realDate = (typeof(value) === "string" ? new Date(Date.parse(value)) : value);
  if(typeof(realDate) != "object")
    realDate = null;
  //check if its ivnalid, if so make it null
  if(isNaN(realDate))
    realDate = null;

  const {value: _x, onChange: _y, ...restProps} = props;

  return <Input type="date" 
    value={realDate?.toISOString().slice(0,10)} 
    onChange={(e)=>onChange(new Date(e.target.value))} {...field}  {...restProps} />;
}