Implementation of Sortable Component

[aruldd-twilio]

We have a use case for Sortable Component, and we can see there is a "Drag and Drop Pattern" in the 12.12 release candidate.

We can take this component up as a part of flex development and contribute back to paste. We need the following clarity for estimating the effort required.

1. Can we do the implementation with a library dnd-kit or do we need to implement it from scratch?
2. Is there an RFC we can use to implement this ?

[SiTaggart]

Hi @aruldd-twilio

Glad to see you are interested in being an active part of Paste, unfortunately the Drag and Drop pattern is a lot less Engineering, and much more Design. The Pattern will more centered around design guidance, visual affordances, interaction design and accessibility. It won't actually ship a component.

It's pretty hard for us to ship a generic sortable component that is flexible to suit everyones needs. When you boil it down, it's no different to what a third party library would do for us at that point. Which is likely all we'd do, pick a library, wrap it, and export it.

The two libraries that we are going to recommend is React DnD, coupled with this React DnD Backend built by Discord. That will give you the best, accessible drag and drop user interaction right now.

You can use these in conjunction with Paste Styling Primitives like Box and Text to create your custom component.

What you have in the screenshot is likely a little too product specific and not something we'd add to the Library long term.

Sorry that response probably isn't what you were expecting, but hopefully pointing you int he direction of some good libraries should get you going towards building your product feature.