@cecigiu2b/dropdown-menu-react NPM

Getting Started with Dropdown Menu

Module for generating a component select with a options list from an array.

Installation

Using npm :

npm i @cecigiu2b/dropdown-menu-react

Required

React

TypeScript

a file dropdown-menu-react.d.ts is available in the module. configuration is required in the file tsconfig.json.

Props required

Props	Types
name	string
options	Array
getValue	SetStateAction

props options must be array type of string or array of object with a key "name" The prop getValue returns the value of the option chosen by the user.

Style

You can style your component by adding :

customClassSelect prop (select element)
customClassOption prop (option elements)

See in the example above

Exemple

In the project directory, you can run:

import { DropdownMenu } from '@cecigiu2b/dropdown-menu'
import { useState } from 'React'

const departements = [
  "Sales",
  "Marketing",
  "Engineering",
  "Human Resources",
  "Legal",
];

const states = [
  {
    name: "Alabama",
    abbreviation: "AL",
  },

  {
    name: "American Samoa",
    abbreviation: "AS",
  },
  {
    name: "Arizona",
    abbreviation: "AZ",
  },
  {
    name: "Arkansas",
    abbreviation: "AR",
  },
]

const [valueSelect, setValueSelect] = useState(null)

const Form = () => {
   return (
    <div>
      <form>
        <DropdownMenu
          name="departements"
          options={departements}
          customClassSelect="dropdownSelect"
          customClassOption="dropdownOption"
          getValue={setValueSelect}
        />
        <DropdownMenu name="states" options={states} />
      </form>
    </div>
  );
};
export default Form;