Skip to main content

react-native-element-dropdown, maintained.

A drop-in fork of react-native-element-dropdown. Bugs get fixed, the toolchain stays current, and every release is signed. Change two lines and keep shipping.

Get startedGitHub

Install

npm install @carlos3g/element-dropdown

Migrate in two lines

- import { Dropdown } from 'react-native-element-dropdown';
+ import { Dropdown } from '@carlos3g/element-dropdown';

What you get

Active maintenance

Upstream bugs get triaged and fixed in every release. The roadmap is public and the changelog is honest.

Drop-in migration

Public API unchanged from react-native-element-dropdown@2.12.x. No native rebuild, no config changes, no peer-dep drift.

Signed releases

Every version is published via npm Trusted Publishing with provenance attestation. Anyone can verify the tarball came from this repository's CI.

Why this fork

The original package is unmaintained — a large open-issue backlog, plus clean community pull requests sitting untouched for years. If you're already on react-native-element-dropdown, you've likely hit one of these:

  • Invariant Violation: scrollToIndex out of range when searching long lists
  • The list flashes at the wrong position for a frame when you reopen it
  • IDropdownRef / IMultiSelectRef aren't importable when you build for web or Expo
  • Every item has a non-overridable padding: 17 — itemContainerStyle can't shrink it
  • MultiSelect trigger uses placeholderStyle even after you've selected something

Fixed — along with plenty more. See the full context and the release notes.

Demo

React Native Dropdown component demo — single-select with searchReact Native MultiSelect component demo — multi-select with chip row

Quick example

import { useState } from 'react';
import { Dropdown } from '@carlos3g/element-dropdown';

const data = [
  { label: 'Apple', value: 'apple' },
  { label: 'Banana', value: 'banana' },
];

export function FruitPicker() {
  const [value, setValue] = useState(null);
  return (
    <Dropdown
      data={data}
      labelField="label"
      valueField="value"
      placeholder="Pick a fruit"
      value={value}
      onChange={(item) => setValue(item.value)}
    />
  );
}

Need more? Head to Quick start.

Ready to drop it in?

Read the docsMigration guide