Two alternatives for wrapping a button element in a React component

buttons.jsx

// Option 1, more like HTML button
class PrimaryButton extends React.Component {
    render() {
        return (
          <button onClick={this.props.action}>{this.props.children}</button>
        );
    }
}

// Option 1 usage
<PrimaryButton action="saveUser">Save User</PrimaryButton>


// -------------------  VS. ------------------- 


// Option 2, all options specified as attributes
//           (seems like this is very common in the React community) 
class SecondaryButton extends React.Component {
    render() {
        return (
          <button onClick={this.props.action}>{this.props.text}</button>
        );
    }
}

// Option 2 usage
<SecondaryButton action="saveUser" text="Save User" />