[TreeView] Add inline node name editing

[bharatkashyap]

Summary 💡

A tree item would be able to be renamed inline, through a double-click-to-edit workflow (possibly).

Examples 🌈

• Toolpad

https://github.com/mui/mui-x/assets/19550456/3916df8d-e440-4242-b06b-ddbe4bffcb5d

• https://www.treejs.cn/v3/demo.php#_304
• https://developer.mescius.com/wijmo/demos/Nav/TreeView/Nodes/Editing/react
• https://ej2.syncfusion.com/documentation/treeview/node-editing

[flaviendelangle]

I'm wondering if editing is compatible with the current DOM API (passing the children as components instead of passing a prop with an array of objects like the rows on the datagrid. But we will probably have the same problem with virtualization anyway.

So the first step is probably to change the API to something like <TreeView items={[...]} /> Which is a MASSIVE breaking change and will reduce a lot the customizability of the component...

[oliviertassinari]

@bharatkashyap Do you need this feature to be built-in or where you looking for an example. I wonder if an example could be simple enough for developers.

[bharatkashyap]

@bharatkashyap Do you need this feature to be built-in or where you looking for an example. I wonder if an example could be simple enough for developers.

Agree, perhaps an example is sufficient enough instead of supporting APIs to do this out of the box

[flaviendelangle]

We discussed this with Jose yesterday We will try to do a recipe first and we'll see if it's viable :+1: