Desired behavior: When a user drags an item from a list, that item disappears from the list.
Observed behavior: When a user drags an item from a list, that item animates and "returns" to the list.
I understand how to change the state to actually remove that element from the list. What I don't understand is how to remove that animated "return" of the item that appears regardless.
Thanks @alexreardon!
Seconded. I have investigated several drag and drop libraries and the only thing blocking me from using this one is it forces a UX decision on me - the smooth animation of a dropped item returning to the list. Please accept that not everyone agrees with you that that is the optimal UX for drag and drop, and allow us to configure it. Some of us believe that a pretty but time-consuming animation following a user action is disconcerting for users and want a user experience that does not mentally interrupt the user's own flow. For our own application, this is backed up by actual user feedback. There are many alternatives, such as showing a colored or clone-and-expand "pulse" on top of the instantly-appearing dropped item, but that should be up to the consumer. We would like to get away from our rather buggy drag-and-drop implementation and this would be a great replacement, otherwise.
As mentioned in #216 skipping animations and cloning goes against the core principle of physicality that this library is going for. We are spending a lot of time ensuring that each interaction has some physical metaphor. We are very upfront that this library is not for everyone and has some strong UX opinions in order to achieve a more physical drag and drop. A big part of this is no instant movement
It is a fairly standard drag and drop pattern for things to disappear and reappear in response to the users drag. For a more natural drag we animate the movement of items as they need to move out of the way while dragging to more clearly show a drags effect. We also animate the drop of an item so that it animates into its new home position. At no point is an item instantly moved anywhere — regardless of whether it is dragging or not.
Regarding input blocking the user, please refer to this section of the docs
react-beautiful-dnd works really hard to avoid as many periods of non-interactivity as possible. The user should feel like they are in control of the interface and not waiting for an animation to finish before they can continue to interact with the interface. However, there is a balance that needs to be made between correctness and power in order to make everybody's lives more sane.
There are a few minor exceptions to that which you can read at that link.
We are extremely upfront about the philosophy of physicality. If this does not line up with your specific needs then you are welcome to use a more generic drag and drop library such as react-dnd
Most helpful comment
Seconded. I have investigated several drag and drop libraries and the only thing blocking me from using this one is it forces a UX decision on me - the smooth animation of a dropped item returning to the list. Please accept that not everyone agrees with you that that is the optimal UX for drag and drop, and allow us to configure it. Some of us believe that a pretty but time-consuming animation following a user action is disconcerting for users and want a user experience that does not mentally interrupt the user's own flow. For our own application, this is backed up by actual user feedback. There are many alternatives, such as showing a colored or clone-and-expand "pulse" on top of the instantly-appearing dropped item, but that should be up to the consumer. We would like to get away from our rather buggy drag-and-drop implementation and this would be a great replacement, otherwise.