react-complex-tree icon indicating copy to clipboard operation
react-complex-tree copied to clipboard

input in renderItemTitle can not work

Open chenyingkeai opened this issue 1 year ago • 1 comments

I want my controlled tree to show the input box in a certain situation and input can be made, but I found that when using the input in renderItemTitle, it can't even focus, here is a simple example, is there any way to solve it?thank you https://codesandbox.io/p/sandbox/react-complex-tree-playground-memo-demo-forked-9zpsmf

chenyingkeai avatar Dec 06 '24 03:12 chenyingkeai

Have a look at the default implementation of renderItem: https://github.com/lukasbach/react-complex-tree/blob/main/packages/core/src/renderers/createDefaultRenderers.tsx#L89

If an item is being renamed, the item is rendered as a div. Otherwise, it is rendered as button by default. By manually inserting an input within the item container which renders as button, the button claims all input events, and this will also create invalid semantic structure. You can probably get it to work by adjusting the renderItem method to make the content of the title not being rendered as part of a button element as long as it contains an input.

lukasbach avatar Dec 08 '24 12:12 lukasbach