Add keep css class option #854
Conversation
- Resetting them when dropping element
| @@ -482,6 +482,10 @@ export default function sortable (sortableElements, options: configuration|objec | |||
| dragging.style.display = dragging.oldDisplay | |||
| delete dragging.oldDisplay | |||
| } | |||
| // We need to reset placeholder if any css class were added. | |||
| options.keepCssClass.forEach(className => { | |||
| store(sortableElement).placeholder.classList.remove(className) | |||
There was a problem hiding this comment.
This can be done in one step https://developer.mozilla.org/en-US/docs/Web/API/DOMTokenList/remove sot that all classes are provided at once.
I think this should work: remove(...options.keepCssClass)
| @@ -552,6 +556,13 @@ export default function sortable (sortableElements, options: configuration|objec | |||
| store(sortableElement).placeholder.style.height = draggingHeight + 'px' | |||
| store(sortableElement).placeholder.style.width = draggingWidth + 'px' | |||
| } | |||
| // Keep some CSS class fo the dragged element, to keep style. | |||
| @@ -552,6 +556,13 @@ export default function sortable (sortableElements, options: configuration|objec | |||
| store(sortableElement).placeholder.style.height = draggingHeight + 'px' | |||
| store(sortableElement).placeholder.style.width = draggingWidth + 'px' | |||
| } | |||
| // Keep some CSS class fo the dragged element, to keep style. | |||
| // Usefull if sortable elements have different dimensions according class. | |||
| options.keepCssClass.forEach(className => { | |||
There was a problem hiding this comment.
I think from a performance point of view you should first get the elements you want to add. Maybe use filter to get the elements that are in both arrays.
Afterwards just like with remove, you can add all at once. DOM interactions are often expensive.
add(...comparedArray)
There was a problem hiding this comment.
Sorry you lost me in the first sentence.
Second sentence nice did't know that too.
| @@ -1,7 +1,8 @@ | |||
| interface configuration { | |||
| items?: string, | |||
| handle?: string, | |||
| forcePlaceholderSize?:boolean; | |||
| forcePlaceholderSize?: boolean, | |||
| keepCssClass?: Array<string>, | |||
There was a problem hiding this comment.
Let's rename this to keepClassesForPlaceholder.
|
Hey @heyyo-droid thank you for the PR. I left a few comments. I am thinking if it may make more sense to have an initialize placeholder function that the user can define. We would add a What do you think? |
Allow to keep some css class from dragged element and apply them to placehoder.