React-select is a wonderful library that comes with great UI and user experience that lets you easily use a drop-down selector with a lot of different kinds of options ( for example multi-select, async options, etc…)

The problem I found is that you can’t use a “select all” option — because it does not exist.

In this article, I’ll show you how to add this option without mutating the library itself.

First of all, you need to install react-select:

$ npm install react-select

after you did so, you should import the library.

Follow the instructions:

1. import the library :

$ import Select from 'react-select'

2. create a JSX file or TSX file according to your project’s scheme ( in this article I’m using typescript so I’m using TSX) :

3. In the Select’s onChange function we want to validate the last option that was selected and calculate the next options:

If this article helped you, please recommend it to others by hitting the clap, and follow me on Medium for more articles and tips.