import { IReactComponent } from '@wowpic/xform-types';
import { DatePicker } from 'antd';
import React, { FunctionComponent, useCallback } from 'react';
import { getMomentTime } from '../utils';

const AntdMonthPicker = DatePicker.MonthPicker;

const MonthPicker: FunctionComponent<IReactComponent> = ({
    value: originValue,
    onChange,
    ...props
}) => {
    const value: any = getMomentTime(originValue);
    const onValueChange = useCallback(
        (v) => onChange(+v),
        [onChange]
    );
    return (
        <AntdMonthPicker value={value} onChange={onValueChange} {...props} />
    );
};

export default MonthPicker;
