Hi!

I would like to render a react element beside the title of the tab for each tab in my tabbar. I have looked into extending the Renderer of the tab bar, but cannot see a way to render a React Node instead of a regular VirtualElement.

Ideally, it would be great to do something like:

class MyRenderer extends TabBar.Renderer {
    public renderIcon = (data: TabBar.IRenderData<any>): VirtualElement => {
        return <Icon icon={IconNames.HOME} />;
    }
}

but I figured since phosphor does not use the React virtualdom, perhaps something like

class MyRenderer extends TabBar.Renderer {
    public renderIcon = (data: TabBar.IRenderData<any>): VirtualElement => {
        return ReactDOM.render(<Icon icon={IconNames.HOME} />, data.node);
    }
}

May be possible. But then I realised that VirtualElements are not actual elements. Is there any way for renderIcon to create an actual HTMLElement, or more broadly to create a VirtualElement from a React node?