Skip to content

KaterinaLupacheva/react-button-group

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

@ramonak/react-button-group

React ButtonGroup component with the selection (active button) functionality

NPM JavaScript Style Guidenpm bundle sizeGitHubnpm


demo


Install

npm install --save @ramonak/react-button-group

Usage

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}
          />
}

Props

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

License

MIT © KaterinaLupacheva

About

React ButtonGroup component with the selection (active button) functionality.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published