Class Button

src/Button.js:9–65

requireCss('buttons');

class Button extends Component {
  constructor (props) {
    super(props);
    this.state = {
      disabled: props.disabled,
      show: null
    };
    this.handleClick = this.handleClick.bind(this);
  }

  componentWillReceiveProps(nextProps) {
    if (nextProps.disabled !== this.props.disabled) {
      this.setState({ disabled: nextProps.disabled });
    }
  }

  disable(elem) {
    this.setState({ disabled: true, show: elem });
  }

  enable(elem) {
    this.setState({ disabled: false, show: elem });
  }

  handleClick() {
    if (this.props.onClick) {
      this.props.onClick();
    }
    if (this.props.once) {
      this.disable();
    }
  }

  render() {
    let status = this.props.status;
    if (status) {
      status = `rct-button-${status}`;
    }

    const className = classnames(
      this.props.className,
      getGrid(this.props.grid),
      'rct-button',
      status
    );

    return (
      <button onClick={this.handleClick}
        style={this.props.style}
        disabled={this.state.disabled}
        className={className}
        type={this.props.type || 'button'}>
        { this.state.show || this.props.children }
      </button>
    );
  }
}