@bigfishtv/cockpit/src/components/button/Button.js

import PropTypes from 'prop-types'
import React, { Component } from 'react'
import classnames from 'classnames'

import Icon from '../Icon'

/**
 * Dumb button component, applies turret classes and spreads rest of props
 */
export default class Button extends Component {
	static propTypes = {
		/** Size of button: xsmall, small, medium, large, xlarge */
		size: PropTypes.string,
		/** Button's text, will use children instead if provided */
		text: PropTypes.node,
		/** Outputs custom button class e.g 'primary' = 'button-primary' */
		style: PropTypes.string,
		/** Button type i.e. 'button' or 'submit' */
		type: PropTypes.oneOf(['button', 'submit', 'reset']),
		/** String referencing icon name to include in button */
		icon: PropTypes.string,
		/** Click callback */
		onClick: PropTypes.func,
	}

	static defaultProps = {
		size: 'medium',
		text: 'Button',
		style: 'default',
		type: 'button',
		icon: null,
		onClick: () => {},
	}

	render() {
		const { size, style, icon, text, children, invalid, formValue, ...buttonProps } = this.props
		const buttonClass = classnames('button', size && 'button-' + size, style && 'button-' + style, style)
		return (
			<button {...buttonProps} className={buttonClass}>
				{icon && <Icon name={icon} size={18} />}
				<span>{children || text}</span>
			</button>
		)
	}
}