[Dialog/Select] Selection mode is active after choosing an item in Select in Firefox

[alexandre-lim]

Bug report

Current Behavior

Following this discussion #1484 (reply in thread).

Using Dialog 0.1.8-rc.47 and Select 0.1.2-rc.49 in Firefox 101.0.1, after choosing an item in Select, selection mode is activated and text content in Dialog is highlighted on hover.

Expected behavior

After choosing an item in Select component, text in Dialog is not highlighted on hover.

Reproducible example

CodeSandbox Template

Choose option 1 from the select and hover on the text Very basic modal, it will be on selection mode and highlight the text.

[selfish]

Seeing the same behavior with Dropdown after close

[yotamZaken]

I've been having the same problem using Dialog version 0.1.7 and Select version 0.1.1..
After the Select (drop-down) closes - the mouse cursor remains on selection mode and needs another mouse click to break free.

[llStaraill]

After being puzzled by this for quite a while, I realized that the example implementation adds a style to the SelectItem, which my project was missing. This fixed the bug for me.

.select__item { user-select: none; }

[benoitgrelard]

I can confirm the solution provided by @llStaraill fixes the issue with Firefox. @andy-hook perhaps we should consider this a functional style (especially given native menus don't allow you to select item text anyway and the action is on pointerup).

[andy-hook]

perhaps we should consider this a functional style (especially given native menus don't allow you to select item text anyway and the action is on pointerup).

I agree

[eiiot]

+1