# @s-ui/react-molecule-dropdown-list > `MoleculeDropdownList` is a composition of DropdownOptions Latest version **2.7.0** (published 2025-11-20) · MIT license · 0 weekly downloads ## Install ```sh npm install @s-ui/react-molecule-dropdown-list pnpm add @s-ui/react-molecule-dropdown-list yarn add @s-ui/react-molecule-dropdown-list bun add @s-ui/react-molecule-dropdown-list ``` ## Health **Score 45/100 (D)** — status: stable. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support. ## Facts | | | |---|---| | Version | 2.7.0 | | Published | 2025-11-20 | | First published | 2018-12-07 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 5 | | Unpacked size | 14.7 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 147 | | Maintainers | ivanmlaborda, salvador.juan, andresin87.adevinta, izeller, gfabregoadv, ignacio_navarro, oscar_ramirez, jordi.munoz, luis-garrido, jenifer.lopez, isabelgomez87, pa.chruscinski.ext, schibstedspain, belen.santos, xavi_ballestar, ferrangbtw, sabri-castelli, jamile.radloff, davidmartin2108, sergi.quintela, estefania_garcia, arnau.guell, ferran.simon, victor.perez.adevinta, mariapaula.forero.ext, oscar.gomez, david.nieto, oriol.puig, nacho_torrella, xavi.murcia, ignacio.rodriguez, francisco.ruiz.lloret, sziauberyte, andresadv, javiauso, alverd004, marian.lucaci, pablogs, sergiocollado, pablo.rey-adevinta, beatrizip, david.cuadrado.ext, giovanny.sayas.ext, patricio.sartore, azahara, sergio.escano, pol.valls, hpintos_adevinta, oscar-raig-adevinta, thomas.page.ext, sebastian.badea.adevinta, victoria.pasichnyk.ext, sendami.luque.ext, luz_adv, ruben-martin, emiliovz, arturo.vicente, diegomr, sergi.martinez.adevinta, guillemgc3, javiermiguel, atilioscolaroadv, florinz, denis_z, anya_ok, hector-prieto-moreno, mirceasima-adv | | Keywords | @s-ui, react, component, molecule, dropdownList | ## Links - npm: https://www.npmjs.com/package/@s-ui/react-molecule-dropdown-list - Repository: https://github.com/SUI-Components/sui-components - Homepage: https://sui-components.vercel.app/ - Issues: https://github.com/SUI-Components/sui-components/issues?q=is%3Aopen+label%3A%22Component%3A+dropdownList%22 - npm.io page: https://npm.io/package/@s-ui/react-molecule-dropdown-list ## Dependencies (5) - [lodash.isequal](https://npm.io/package/lodash.isequal.md) 4.5 - [@s-ui/react-hooks](https://npm.io/package/@s-ui/react-hooks.md) 1 - [@s-ui/react-atom-input](https://npm.io/package/@s-ui/react-atom-input.md) 5 - [@s-ui/react-primitive-injector](https://npm.io/package/@s-ui/react-primitive-injector.md) 1 - [@s-ui/react-molecule-dropdown-option](https://npm.io/package/@s-ui/react-molecule-dropdown-option.md) 2 ## Alternatives - [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads - [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads - [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads - [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads - [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads ## Recent versions - 2.7.0 (latest) — 2025-11-20 - 2.6.0 — 2025-08-07 - 2.5.0 — 2025-02-24 - 2.4.0 — 2024-07-25 - 2.3.0 — 2024-07-25 - 2.2.0 — 2023-01-04 - 2.1.0 — 2022-10-04 - 1.33.0 — 2022-10-03 - 1.32.0 — 2022-07-26 - 1.31.0 — 2022-07-21 - 1.30.0 — 2022-06-23 - 1.29.0 — 2022-05-24 - 1.28.0 — 2022-05-24 - 1.27.0 — 2022-05-23 - 1.26.0 — 2022-04-05 - … 25 more at https://npm.io/package/@s-ui/react-molecule-dropdown-list/versions ## README # MoleculeDropdownList `MoleculeDropdownList` is a composition of DropdownOptions [![documentation](https://img.shields.io/badge/read%20the%20doc-black?logo=readthedocs)](https://sui-components.vercel.app/workbench/molecule/dropdownList/) [![issue](https://img.shields.io/badge/report%20a%20bug-black?logo=openbugbounty&logoColor=red)](https://github.com/SUI-Components/sui-components/issues/new?&projects=4&template=bug-report.yml&assignees=&template=report-a-bug.yml&title=🪲+&labels=bug,component,molecule,dropdownList) [![npm](https://img.shields.io/npm/dt/%40s-ui/react-molecule-dropdown-list?logo=npm&labelColor=black)](https://www.npmjs.com/package/@s-ui/react-molecule-dropdown-list) [![Issues open](https://img.shields.io/github/issues-search/SUI-Components/sui-components?query=is%3Aopen%20label%3Acomponent%20label%3AdropdownList&logo=openbugbounty&logoColor=red&label=issues%20open&color=red)](https://github.com/SUI-Components/sui-components/issues?q=is%3Aopen+label%3Acomponent+label%3AdropdownList) [![NPM](https://img.shields.io/npm/l/%40s-ui%2Freact-molecule-dropdown-list)](https://github.com/SUI-Components/sui-components/blob/main/components/molecule/dropdownList/LICENSE.md) ## Installation ```sh $ npm install @s-ui/react-molecule-dropdown-list --save ``` ## Usage ```js import MoleculeDropdownList, { moleculeDropdownListSizes } from '@s-ui/react-molecule-dropdown-list' const countries = [ 'Canary Islands', 'Australia', 'Northern Mariana Islands', 'Equatorial Guinea' ] ``` ### Basic usage ```js {countries.map((option, index) => ( {option} ))} ``` ### Specifying size ```js {countries.map((option, index) => ( {option} ))} ``` ### With `checkbox` ```js {countries.map((option, index) => ( {option} ))} ``` ### Single & Multiple Handler Helpers The package also provides an easy handler configuration for single or multiple selection behaviors ```js import MoleculeDropdownList, { moleculeDropdownListSelectHandler } from '@s-ui/react-molecule-dropdown-list'; // Single console.log({value, selected}) }) } > {countries.map((option, index) => ( {option} ))} // Multiple console.log({value, selected}) }) } > {countries.map((option, index) => ( {option} ))} ``` > **Find full description and more examples in the [demo page](#).** --- _Source: https://npm.io/package/@s-ui/react-molecule-dropdown-list · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._