dropdown-react library

A simple customizable react dropdown component.

Installation

npm install @dratatin/dropdown-react or yarn add @dratatin/dropdown-react

Usage

import React from 'react';
import ReactDOM from 'react-dom/client';
import { Dropdown } from "@dratatin/dropdown-react";

const MyComponent = () => {
  return (
    <div>
      <Dropdown
        options={["option1", "option2", "option3", "option4", "option5"]}
      />
    </div>
  )
};

Props

Label	Type	Required	Default
options	string[ ]	Yes	N/A
value	string	No	options[0]
setValue	callback()	No	N/A
name	string	No	"basic"
className	string	No	N/A
labelledby	string	No	N/A

Features

• Personalize the style of the dropdown with your className or overwrite style on the current className

.className{} /*-----container-----*/

.className__btn{}
.className__btn__value{}
.className__btn__icon{}

.className__list{}
.className__list__item{}
.className__list__item__content{}

• Manage dropdown value with (value and setValue props)

const MyComponent = () => {
  const options = ["option1", "option2", "option3", "option4", "option5"]
  const [selected, setSelected] = useState(options[0])
  return (
    <div>
      <Dropdown
        options={datas}
        value={selected}
        setValue={(value) => setSelected(value)}
      />
    </div>
  )
};