react-hierarchy-checkbox

[![NPM version][npm-image]][npm-url] [![Build][github-build]][github-build-url] ![npm-typescript] [![License][github-license]][github-license-url]

This repo is the example of the how to use two level hierarchy of checkbox.

Installation:

npm install eact-hierarchy-checkbox --save-dev

or

yarn add -D eact-hierarchy-checkbox

Usage :

Add ReactHierarchyCheckbox to your component:

import React from 'react'
import ReactDOM from 'react-dom/client'
import { ReactHierarchyCheckbox } from 'react-hierarchy-checkbox'

const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement)
root.render(
    <React.StrictMode>
        <div>
            <h2>Checkbox</h2>
            <ReactHierarchyCheckbox items = 
                [
                    {
                        id: 1,
                        name: 'Root 1',
                        is_checked: true,
                        children: [
                            {
                                id: 2,
                                name: 'Child 1',
                                is_checked: false,
                                parent_id: 1,
                            },
                            {
                                id: 3,
                                name: 'Child 2',
                                is_checked: true,
                                parent_id: 1,
                            },
                        ],
                    },
                    {
                        id: 4,
                        name: 'Root 2',
                        is_checked: false,
                        children: [
                            {
                                id: 5,
                                name: 'Child 3',
                                is_checked: false,
                                parent_id: 4,
                            },
                        ],
                    },
                ] />
        </div>
    </React.StrictMode>,
)