react-spectrum icon indicating copy to clipboard operation
react-spectrum copied to clipboard

ListBox onAction breaks selection

Open ArrayKnight opened this issue 1 year ago • 5 comments

Provide a general summary of the issue here

Not sure if this is intended and undocumented or a bug

If you add an event listener to the onAction prop on the ListBox component, the standard selection behavior ceases to function

Maybe the expectation is that if you're listening to onAction you're handling all selection state externally(?)

I discovered this when implementing a story for the component and binding all event handler props to actions (logs)

🤔 Expected Behavior?

Either document this as expected behavior or allow for onAction to be listened to without breaking internal selection state management

😯 Current Behavior

Binding onAction causes presses to not update selection state

💁 Possible Solution

No response

🔦 Context

No response

🖥️ Steps to Reproduce

https://codesandbox.io/p/sandbox/amazing-solomon-ypvhz7

Version

1.2.1

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

Mac

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

ArrayKnight avatar Jun 06 '24 23:06 ArrayKnight

Looks like we left out the onAction documentation for ListBox https://react-spectrum.adobe.com/react-aria/GridList.html#row-actions

What you want though is https://react-spectrum.adobe.com/react-aria/ListBox.html#selection-behavior to set this to "Replace" Then the default interaction will be selection and a double click will trigger the action, as it mentions in the GridList docs I linked to.

Otherwise, you need to provide a control to trigger selection on individual rows.

snowystinger avatar Jun 07 '24 03:06 snowystinger

Hi! I'm facing a similar issue. I raised this as an issue and was recommended to use onAction. However, I’ve noticed that the onSelectionChange callback only fires when I hold down the option, which is not the behavior I’m expecting. Has anyone else encountered this problem? I’d appreciate any suggestions or alternative solutions.

elianarlivingston avatar Oct 16 '24 17:10 elianarlivingston

@elianarlivingston was my previous comment able to explain it?

This issue is just open to add docs now

snowystinger avatar Oct 16 '24 19:10 snowystinger

Hello, @snowystinger

Thank you for the previous clarification. I still have a couple of questions regarding the implementation of the useListBox hook, specifically about the behavior of the onAction and onSelectionChange functions.

I've noticed that when selecting an item, both functions execute correctly: onAction is invoked when an element is selected, and onSelectionChange updates the selection state. However, when deselecting an item, onAction does not execute, while onSelectionChange does get triggered to reflect the change in selection.

Is this behavior expected? I would like to understand why onAction does not get activated during deselection and if there is a recommended way to handle the logic associated with deselection in this context.

I appreciate your help and guidance.

Best regards

elianarlivingston avatar Oct 17 '24 12:10 elianarlivingston

Can you provide a codesandbox demonstrating the issue? It will make figuring out what's going on much easier.

snowystinger avatar Oct 17 '24 19:10 snowystinger