Add option for reverting DOM modifications #2195
Open
+135
−17
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This option allows to use Sortable.js with any framework that handles the DOM manipulation by state (React, Vue, Svelte...). Toggling the option 'revertDOM' to 'true' will let you handle your own state manipulation by the Sortable events (onAdd, onSort...). Now the events also receive the Sortable object, allowing access to the 'to' and 'from' group names and other properties.
This PR mainly solves: #546 #1931 #1856 #1874
And probably solves: #2024 #837 #781
I get it...
I get that the main purpose of Sortable.js is for DOM manipulation (addressed on mostly all issues tagged). However I enjoy a lot the workflow using Sortable and as far I can see a lot of people opening similar issues too.
So this is an attempt to implement the feature in a little less hacky way (or as hacky but built in the library) to unlock the usability of Sortable in this kind of data/state driven frameworks without framework-targeted alternatives.
This is not fully tested
I only tested slightly in Svelte and with MultiDrag Plugin. I would love the community to test on its own use cases and suggest changes. Mainly create a discussion beyond just saying Sortable is not meant for this.
Thanks a lot for maintaining Sortable alive! I will post a Svelte example in the first comment.
Known issues