[TreeView] Support item reordering using drag and drop

[flaviendelangle]

Doc preview
Closes #9686

Requirements for this PR

• [TreeView] Set focus on the focused Tree Item instead of the Tree View #12226
• [TreeView] Create pro package #12240
• [TreeView] Create RichTreeViewPro component #12610
• [TreeView] Allow to define indentation at the item level #13126
• [TreeView] Allow to customize the indentation of nested items #13225
• [TreeView] Add getItemTree and getItemOrderedChildrenIds methods to the public API #13804
• [TreeView] Allow the plugins to enrich the props passed to the item slots #13953
• [TreeView] Add new utility function isEventTargetInDescendants #13982

Basic example

1. Enable the indentationAtItemLevel experimental feature (see [TreeView] Allow to define indentation at the item level #13126)
2. Pass the itemsReordering prop and the itemsReordering experimental feature

<RichTreeViewPro
    items={ITEMS}
    itemsReordering
    experimentalFeatures={{ indentationAtItemLevel: true, itemsReordering: true }}
/>

Current status

• Support on TreeItem
• Support on TreeItem2
• Write doc
• Write tests

[mui-bot]

Deploy preview: https://deploy-preview-12213--material-ui-x.netlify.app/

Updated pages:

• docs/data/tree-view/rich-tree-view/ordering/ordering.md
• docs/data/tree-view/rich-tree-view/items/items.md

Generated by 🚫 dangerJS against 39cacc4

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[noraleonte]

Congrats on this huge effort! 🎉 It's looking great! 🔥

[LukasTy]

Firstly, I'm very sorry for a late review. 🙈

Congrats on such an awesome feature and superb implementation, great job! 👍 💯

A few comments:

• I believe that clicking Esc should cancel the dragging and releasing the mouse afterwards should not finish it.
• It would be nice to avoid the animation of the dragging item returning (floating) to the original place before finishing the dragging action.

[flaviendelangle]

I opened a PR for the env check because it's trivial to fix and doing it before the release is better

For the rest we can do a follow up

I believe that clicking Esc should cancel the dragging and releasing the mouse afterwards should not finish it.

Fully agree, I'll fix that

It would be nice to avoid the animation of the dragging item returning (floating) to the original place before finishing the dragging action.

Could you record your screen with this behavior visible to be sure I'm understand what you are referring to?

[LukasTy]

I believe that clicking Esc should cancel the dragging and releasing the mouse afterwards should not finish it.

Fully agree, I'll fix that

Makes sense. 👌

Could you record your screen with this behavior visible to be sure I'm understand what you are referring to?

Screen.Recording.2024-08-01.at.16.54.00.mov

I'm circling over the somewhat strange behavior—resembling a canceled drag. 🙈