[EuiSelectable] Prevent onFocus from negating selection

[thompsongl]

Summary

Fixes #4147, in which a click event on an unfocused EuiSelectable would prevent the intended option click and instead scroll to the currently selected option (i.e., two clicks were required because the first was captured by onFocus).

The fix is to look for click events on the element that watches for onFocus and prevent the handler from running. The subsequent events triggered by the option selection will correctly place focus inside the list and allow for keyboard navigation. Keyboard navigation is otherwise unaffected.

Repro:

1. Go the Single Selection example.
2. Check the last item.
3. Click away from the list (outside the component)
4. Click the first item in the list.
5. The first item should be selected.
6. Repeat with the Popover example.

Checklist

- [ ] Check against all themes for compatibility in both light and dark modes
- [ ] Checked in mobile

• Checked in Chrome, Safari, Edge, and Firefox

- [ ] Props have proper autodocs and playground toggles
- [ ] Added documentation
- [ ] Checked Code Sandbox works for the any docs examples
- [ ] Added or updated jest tests

• Checked for breaking changes and labeled appropriately
• Checked for accessibility including keyboard-only and screenreader modes
• A changelog entry exists and is marked appropriately
• Revert 2fbc966

[kibanamachine]

Preview documentation changes for this PR: https://eui.elastic.co/pr_5117/

[chandlerprall]

Change LGTM, pulled & tried my hardest to break this locally.

We've dealt with differentiating the tab-vs-click focus response a few times, perhaps we should look at a more formal way to detect & handle them.

[thompsongl]

perhaps we should look at a more formal way to detect & handle them

That's a good point. I'm going to merge this as-is, but keep this in mind as I continue my spike on EuiSelectable things.

[cchaos]

😬 I think you forgot to revert the Revert me

[thompsongl]

Sure did 🤦

#5123