[feature] Possibility to create the clone manually (and prevent cloning if not necessary)

[hugomallet]

Hi,

I have web components that I want to sort. But my web components expect a few parameters in constructors. But when I drag one, the element is cloned so I have an error due to missing constructor parameters. By the way, could we prevent the cloning of the element ?

It would be useful if we could create the clone on our own (so that we could possibly pass some additional parameters to the constructor)

[owen-m1]

Currently its not possible

[MarkChrisLevy]

@owen-m1 I just created a PR #2058 that adds custom clone option.

[ThetripGr]

Any examples anywhere ? I do not understand how to use this custom cloning event

[MarkChrisLevy]

Add clone prop in options, it must a be a function that returns cloned node:

clone: function (/** HTMLElement */elToClone) {
	return elToClone.cloneNode(true);
}

[ThetripGr]

Thanks for the answer , but even something as simple as this does not seem to work

	new Sortable( retailList, {
		group: {
			name: 'shared',
			pull: 'clone',
			put: false // Do not allow items to be put into this list
		},
		ghostClass: 'blue-background-class',
		animation: 150,
		sort: false,
		clone: function ( elToClone ) {
			const clone = elToClone.cloneNode( true )
			console.log( clone )
			clone.classList.add( "test" )
			return clone;
		},
	} );

i want to move items from one list to another but i would like to customize the cloned element. The above isn't even showing the console and just returns the original clone (seemingly). Is there something I am missing?