Unchecking an option returns the wrong object using through onChange method.

I have a simple use case where I have a few predefined options and an onchange method to handle the clicks. When I select the options everything works as expected, but unchecking gets messed up after I have checked more than two options. Unselecting any option results in the bottom-most checked option getting unchecked, instead of the option we clicked on.

Code:

const options=[
  {
    "label": "November 2019",
    "value": "November 2019"
  },
  {
    "label": "February 2020",
    "value": "February 2020"
  },
  {
    "label": "December 2019",
    "value": "December 2019"
  },
  {
    "label": "October 2018",
    "value": "October 2018"
  },
  {
    "label": "January 2020",
    "value": "January 2020"
  },
  {
    "label": "March 2020",
    "value": "March 2020"
  },
  {
    "label": "April 2020",
    "value": "April 2020"
  }
]

handleChange = (selected) => {
    console.log("++", selected);
    this.setState({ selectedOption: selected });
}

<CheckedSelect
                value={selectedOption}
                options={options}
                onChange={handleChange}
                placeholder={placeholder}
/>

thehyve / react-select-checked

Unchecking an option returns the wrong object using through onChange method. #28