// @flow

import React from 'react';
import classNames from 'classnames';

type ButtonTheme = {
    button: string,
    small: string,
    medium: string,
    large: string
};

type ButtonProps = {
    size: 'small' | 'medium' | 'large',
    children?: any,
    // Note that `theme` is required
    theme: ButtonTheme
};

const Button = (props: ButtonProps) => {
    const {
        size = 'large',
        children,
        theme
    } = props;

    const outputClassName = classNames(
        theme.button,
        theme[size]
    );
    return (
        <button className={outputClassName}>
            {children}
        </button>
    );
};

Button.displayName = 'Button';

export default Button;