Tree component that supports draggable children

[endigo9740]

Discussed in #2173

^{Originally posted by mmailaender October 23, 2023}
We have a use case where we need to reorder a tree component. For that, it would help us a lot if the Tree Component would offer a draggable functionality like Atlassian or Ant offers in React.

[endigo9740]

@mmailaender I've migrated this Discussion to an Issue so it can be tagged as a feature request for review.

@Mahmoud-zino currently builds and maintains this feature. I'll let him weight in on the request and my requirements described below. Just FYI we're currently trying to reach a stability point with this feature, so we may have to draw a line when it comes to feature support sooner or later. The goal with most Skeleton features is ease of use, not complexity or power.

Per the requirements -

What I'd suggest is we find a way to handle this either with Svelte itself, or with the use of some kind of OPTIONAL third party tool. Shopify provides an interesting tool for this: https://shopify.github.io/draggable/. We are very adverse to adding new dependencies alongside the core library itself. In fact, we'll be separating the few features that do require third party dependencies in the future (code blocks and popups). If we decide to support this request, and a third party decency is required, we may need to consider spinning this feature out of the core as well.

[Mahmoud-zino]

@mmailaender
We're currently encountering some challenges with the reactivity flow in the tree-view component. I believe that introducing a major addition to the component at this time might exacerbate these issues.

Nevertheless, we're optimistic that svelte-5 will address most of the flow-related inconveniences. Therefore, I recommend postponing the implementation of this feature until we have svelte-5 available.

Additionally, we've had conversations about a universal drag-and-drop solution that could be applied to various skeleton components. This makes the tree-view a strong contender for testing and refining such a system 😉.

[Rar9]

Please also look at this library
https://github.com/isaacHagoel/svelte-dnd-action

[endigo9740]

In an effort to prepare for Skeleton v3, we're consolidate some related issues down to a single ticket. This will ensure that we can see the full context of requests when the time comes to refactor and update this feature going forward. If you wish to add additional feedback or suggestions, please so here:

• NEXT: Tree View #2358