How to Enable Renaming with custom renderItem and renderItemTitle

[doming-dev]

It seems like renaming is disabled or doesn't work when you create your own renderItem / renderItemTitle function. Are we supposed to implement the renaming feature entirely when I provide a renderItemTitle function?

[lukasbach]

You might want to make sure to set the interactive in a tree item render method only to a button when it is not in a renaming state, if you are not already doing that. I noticed that was the issue in the docs for custom render methods, I fixed that there. If that is not working for you, please send me your implementation of your render methods, so I can see what is going wrong.

renderItem={({ title, arrow, depth, context, children }) => {
  const InteractiveComponent = context.isRenaming ? 'div' : 'button';
  return (
    <>
      <li
        {...context.itemContainerWithChildrenProps}
      >
        <InteractiveComponent
          {...context.itemContainerWithoutChildrenProps}
          {...context.interactiveElementProps}
        >
          { arrow }
          { title }
        </InteractiveComponent>
      </li>
      {children}
    </>
  );
}}

[doming-dev]

Yes, that was it. I added that to my implementation, and renaming is working properly now.
Thank you for the response!