Table(react-aria-components): `[data-hovered]` does not work for `<Row/>`

[jaknas]

🐛 Bug Report

Documentation mentions [data-hovered] selector for <Row/>. In reality, it does not work (the data attribute is not applied)

🤔 Expected Behavior

data-hovered attribute should be applied when row is hovered

😯 Current Behavior

data-hovered is not applied

💻 Code Sample

https://codesandbox.io/s/objective-field-7mq4g6?file=/src/App.js

in the example, I used data-focus-visible which works as expected when row is focused. data-hovered is also used, but styles are not applied when row is hovered with a mouse pointer.

[devongovett]

I believe the hover state only applies when the row is actually interactive, e.g. selectable or actionable. If you add selectionMode or onAction props to your sandbox I do see the hover state. I think this was intentional so users could know when a row is pressable. You could always use the regular CSS :hover pseudo I guess. Not sure how we'd make this behavior changeable otherwise.

[jaknas]

I believe the hover state only applies when the row is actually interactive, e.g. selectable or actionable. If you add selectionMode or onAction props to your sandbox I do see the hover state. I think this was intentional so users could know when a row is pressable. You could always use the regular CSS :hover pseudo I guess. Not sure how we'd make this behavior changeable otherwise.

Ah! Got it. That makes sense, thank you. In that case, I'd maybe suggest mentioning in the docs. It might save some time for others in future.

[Ecksters]

It's particularly troublesome when using the tailwind-css-react-aria-components plugin without a prefix, as it overrides the default tailwind hover selector, but doesn't work due to the data-rac being present but the data-hovered never being added unless you have a selectionMode other than none.