import React from 'react'
import {
    Label,
    Input,
    DateField
} from 'govuk-react';
// import styled from 'styled-components'
import { LabelEl } from '../reuseablestyles'

// const  handleChange = (event) => {
//     props.onChange(event.target.value);
// }

const DobEl = (props) => {

    const handleChange = (event) => {
        props.onChange(event);
    }

    const DateFieldComponent = () => {
        return (
            <DateField
                onChange={handleChange}
                inputNames={{
                    day: 'dayInputName',
                    month: 'monthInputName',
                    year: 'yearInputName',
                }}>
            </DateField>
        )
    }

    return (
        <div>
            <LabelEl>Date of birth</LabelEl>
            <DateFieldComponent />
        </div>
    );
}

export default DobEl;