react-native-bouncy-checkbox-group
TypeScript icon, indicating that this package has built-in type declarations

0.1.1 • Public • Published

React Native Bouncy Checkbox Group

Battle Tested ✅

React Native Bouncy Checkbox Group

npm version npm Platform - Android and iOS License: MIT styled with prettier

React Native Bouncy Checkbox Group

Installation

Add the dependency:

npm i react-native-bouncy-checkbox-group

Peer Dependencies

IMPORTANT! You need install them
"react-native-bouncy-checkbox": ">= 2.1.5"

Usage

Import

import BouncyCheckboxGroup, {
  ICheckboxButton,
} from "react-native-bouncy-checkbox-group";

Fundamental Usage

<BouncyCheckboxGroup
  data={staticData}
  onChange={(selectedItem: ICheckboxButton) => {
    console.log("SelectedItem: ", JSON.stringify(selectedItem));
  }}
/>

Vertical Usage

<BouncyCheckboxGroup
  data={verticalStaticData}
  style={{ flexDirection: "column" }}
  onChange={(selectedItem: ICheckboxButton) => {
    console.log("SelectedItem: ", JSON.stringify(selectedItem));
  }}
/>

Data Format

You MUST follow this data format as ICheckboxButton

[
  {
    id: 0,
  },
  {
    id: 1,
  },
  {
    id: 2,
  },
  {
    id: 3,
  },
];

Example Project 😍

You can checkout the example project 🥰

Simply run

  • npm i
  • react-native run-ios/android

should work of the example project.

Configuration - Props

Fundamentals

Property Type Default Description
data ICheckboxButton[] undefined set the checkboxes as a data
onChange function undefined set your own logic when the group of checkbox is selected
checkboxProps IBouncyCheckboxProps undefined default props for all checkboxes

Customization (Optionals)

React Native Bouncy Checkbox Customizations

You can use all of the customiztion options from the rn bouncy checkbox. You NEED to add the styling and props into the data. Therefore, you can customize each of the checkboxes easily.

Future Plans

  • [x] LICENSE
  • [ ] Write an article about the lib on Medium

Author

FreakyCoder, kurayogun@gmail.com

License

React Native Bouncy Checkbox Group is available under the MIT license. See the LICENSE file for more info.

Package Sidebar

Install

npm i react-native-bouncy-checkbox-group

Weekly Downloads

216

Version

0.1.1

License

MIT

Unpacked Size

109 kB

Total Files

20

Last publish

Collaborators

  • freakycoder