mui-downshift

mui-downshift copied to clipboard

When using touch input on the paginated loading story example, clicking "Load more items" closes the menu but still loads more items.

It's been difficult to get using a Portal with touch input correct...

For clicks, we initially would use onMouseUp={e => e.stopPropagation() on the react-popper instance to work around the issue, but this didn't work for touch.

I found using downshiftProps.getMenuProps(...) worked on Portal when using react-portal, but this broke when we switched to using Material-UI's Popper (which uses a Portal internally). Adding a div within the Popper appears to fix selecting items on touch/mobile except for the case of the "Load more items" case. I tried adding a e.stopPropagation() to the ListItem's onClick in the paginated story, but it would still trigger the outer click.

Need to think some more on this one...

See #46, but I just tested removing { suppressRefError: true } and added disablePortal to Popper, but the issue still remains.