React Downshift library issue

Question

I built a multi select component using the Downshift library. I use useSelect hook. Everything works fine, but there is a small issue that I am not sure if it's a Downshift internal issue or I am doing something wrong.

The issue is when I use checkboxes with element inside of the list item.

<ul {...getMenuProps()}>
        {isOpen &&
          options.map((item, index) => (
            <li key={index} {...getItemProps({ item, index })}>
              <label>
                {/* This label causing menu to close when clicked on it */}
                <input type="checkbox" />
                {item.label}
              </label>
            </li>
          ))}
</ul>

When you click on the checkbox itself all is working fine (menu stays open) but if you click on the label, it triggers the MenuBlur event and closes the menu. Which is not correct, because always want the menu open if you use multi select, until you click away or focus some other element that is outside of the menu.

Whole reproduction can be found here:

https://codesandbox.io/s/crimson-microservice-b5io0j?file=/src/App.js:2956-3363