React MultiSelect Dropdown component with search functionality

Hey everyone! :wave:

I’m excited to introduce @alaminrifat/react-multiselect-dropdown, a customizable React MultiSelect Dropdown with built-in TypeScript support and search functionality!

:sparkles: Features:

  • Multi-select with ease.
  • Built-in search functionality for large datasets.
  • Fully customizable and TypeScript-ready.

Preview

1.Search

2.Select Multiple data

npm install react-multiselect-search
import { MultiSelectDropdown } from "@alaminrifat/react-multiselect-dropdown";

const options = [
  { id: 1, label: "Option 1" },
  { id: 2, label: "Option 2" },
  { id: 3, label: "Option 3" }
  { id: 4, label: "Option 4" }
  { id: 5, label: "Option 5" }
  { id: 6, label: "Option 6" }
];

function App() {
  const [selected, setSelected] = useState([]);
  const [search, setSearch] = useState("");

  return (
    <MultiSelectDropdown
      options={options}
      selected={selected}
      search={search}
      onSearchChange={setSearch}
      onSelectedChange={setSelected}
    />
  );
}

Props:

Prop Type Description
options Option[] Array of options to display
selected Option[] Array of selected options
search string Search input value
onSearchChange (search: string) => void Search change handler
onSelectedChange (selected: Option[]) => void Selection change handler
1 Like