import * as React from 'react';
import { createInput } from '..';
import './index.less';

interface ITextAreaProps extends React.HTMLProps<HTMLTextAreaElement> {
    value?: string,
    className?: string,
    onChange?: (event: React.ChangeEvent<HTMLTextAreaElement>) => void,
    onFocus?: (event: React.FocusEvent<HTMLTextAreaElement>) => void,
    onBlur?: (event: React.FocusEvent<HTMLTextAreaElement>) => void,
}

const TextAreaInput = ({ value, className, onChange, onFocus, onBlur, ...rest }: ITextAreaProps) => (
    <textarea
        {...rest}
        value={value}
        onChange={onChange}
        onFocus={onFocus}
        onBlur={onBlur}
        className={`text-area ${className}`}
    />
);

TextAreaInput.defaultProps = {
    className: '',
};

export const TextArea = createInput(TextAreaInput);