[Feature request/use case] Add API for getting a node's DOM node for complex customizations (like closing tab on middle click)

[thesophiaxu]

Basically title.

I am able to get it working using a hack: (node: TabNode, renderValues: any) => { setTitleOnRenderTab(model); const nodeId = node.getId(); renderValues.buttons.push(<div id={"tabId"+nodeId}></div>); setTimeout(() => { const el = document.getElementById('tabId'+nodeId); if (el && el.parentElement && node.isEnableClose()) { el.parentElement.addEventListener("mousedown", (event) => { console.log(event); if (typeof event === 'object') { switch (event.button) { case 1: model.doAction(Actions.deleteTab(nodeId)) break; default: break; } } }) } }, 0) }

Caveat: this wastes a rendering cycle and pollutes the global namespace - so I'd like to see an official API for getting DOM nodes, but even if there isn't, this issue can document this use case for others.

[sekanbas]

In the current version, this feature can be adapted

/**
 * @type {import('flexlayout-react').NodeMouseEvent}
 */
const onAuxMouseClick = (node, event) => {
	if (event.button === 1 && node.getType() === 'tab' && node.isEnableClose()) {
		model.doAction(Actions.deleteTab(node.getId()));
	}
};