Can't attach event handlers in tab title

[sebakerckhof]

Describe the bug

I'm trying to add an additional clickable icon in the tab name (similar to the close icon, but for a different action). I tried by just passing a <button onClick={eventHandler}>Click me</button> as tab name directly or via renderValues.content / renderValues.leading / renderValues.buttons in the onRenderTab callback. The button is displayed, but the click handler is not called, when inspecting there's a 'noop' click handler instead.

Your Example Website or App

https://jsfiddle.net/sebakerckhof/d6guxL0q/7/

Steps to Reproduce the Bug or Issue

Add a clickable target in the tab name and try clicking on it.

Expected behavior

Click handler is called

Operating System

Ubuntu 22.04

Browser Type?

Chrome

Browser Version

111.0.5563.64

Screenshots or Videos

Additional context

No response

[lceric]

<div onClick={eventHandler} onMouseDown={(e)=> e.stopPropagation()} ></div>