React ButtonGroup component with the selection (active button) functionality
npm install --save @ramonak/react-button-group
import React from 'react'
import ButtonGroup from '@ramonak/react-button-group'
import '@ramonak/react-button-group/dist/index.css';
const Example = () => {
const handleClick = (e) => {
console.log(e.target.name);
};
return <ButtonGroup
buttons={['One', 'Two', 'Three', 'Four']}
onButtonClick={handleClick}
/>
}
Name | Type | Default | Description |
---|---|---|---|
buttons (required) |
Array of strings |
Labels of buttons. For buttons without labels pass an array with empty strings. | |
orientation |
string: horizontal, vertical |
horizontal |
Orientation of button group: vertical or horizontal display |
onButtonClick |
function |
Function that runs on a button click | |
containerClassName |
string |
Class name for custom styles of a wrapper div | |
buttonClassName |
string |
Class name for custom styles of a button inside a button group | |
activeButtonClassName |
string |
Class name for custom styles of an active (selected) button inside a button group |
MIT © KaterinaLupacheva