nested Selects React

A react component to manage nested <select> tags.

install with npm:

npm i nested-selects-react

install with yarn:

yarn add nested-selects-react

in case you want to use it fast

import React, { useState } from 'react';
import { NestedSelects, Select, Option, MakeVisible } from 'nested-selects-react';

function MyForm(){
    const [ state, setState ] = useState({ 
        nestedSelectsValues: null 
    // to get the <Select>'s data
    const getValues = data => setState({ ...state, nestedSelectsValues: data });

    const handleSubmit = ev => {

        <form onSubmit={() => false}>
            {/* nested-selects-react code */}
            <NestedSelects getvalues={getValues}>
                {/* first principal select */}
                <Select name="first-select" label="first select">
                    <Option value="sel1-option1">sel1 option 1</Option>
                    <Option value="sel1-option2">sel1 option 2</Option>
                {/* second principal select */}
                <Select name="second-select" label="first select">
                    <Option value="sel2-option1">sel2 option 1</Option>
                    {/* trigger option */}
                    <Option value="sel2-option2">
                        sel2 option 2 trigger
                            <Select name="sub-select" label="Wow! check this out, a sub select!">
                                <Option value="sub-sel-option1">option 1</Option>
                                <Option value="sub-sel-option1">option 2</Option>
            <button type="button" onClick={handleSubmit}>save</button>

export default MyForm;

nested-selects-react comes without styles.
If you want to add styles please check docs. it's very easy