Keyboard selection is rudely interrupted and overridden by auto-complete mouse-enter actions.

• downshift version: 1.16.0
• node version: 8.5.0
• npm (or yarn) version: yarn 1.0.2

Description

In any downshift configuration (at least thus far in my experience), the mouse position will fire (and select whatever is underneath it) immediately after an arrow-selecting and shift-arrow-paging event.

Replication

1. Navigate to any example: http://downshift.netlify.com/?selectedKind=Examples&selectedStory=basic&full=0&down=1&left=1&panelRight=0
2. Open the menu by changing the input
3. Make sure there are multiple “pages” of options.
4. Place your cursor over the first option in the list
5. Using the down-arrow on your keyboard, navigate down the list
6. As soon as your arrow-down action selects an option beyond the visible set (either by arrowing-down on the last option, or shift-arrowing-down to change the whole page) the option underneath the cursor position will subsequently be selected.

Expected

I would expect the cursor to not activate an option while using arrow navigation, unless of course, the cursor is moved.

[ibrahima]

My 2c, I think part of the naming confusion is because it’s not an arrow button, but an arrow key. Button makes web developers think of <button> I think 😛.

isArrowKeyPressed?

[kentcdodds]

Hmmm… the isArrowButtonClicked name just isn’t working for me… But feel free to open a PR and we can talk about it there.

Also, I wonder whether pointer-events could help us here.