Functional component

ButtonComponent.js

import React from 'react';

function ButtonComponent( {
    buttonName = 'click me',
    backgroundColor = 'purple',
    color = 'white',
    padding = '1rem',
    borderRadius = '4px'
}) {
    return (
        <button style={{ backgroundColor, color, padding, borderRadius}}>
            { buttonName }
        </button>
    );
}

export default ButtonComponent;

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import ButtonComponent from './components/ButtonComponent';

ReactDOM.render(
    <ButtonComponent buttonName="Search" padding="1rem 1.25rem" />,
    document.querySelector( "#root" )
);