fix(toolbar): Remount toolbar rather than block it

[msfstef]

Instead of guarding against remounting the toolbar, clean it up by removing the whole shadow dom root and remount it.

Main modification required was to deep clone the style from the template rather than just import it.

Alternative fix to #1280

[thruflo]

Thanks for this — if it works fine, I think this is a better approach.

[samwillis]

@msfstef as you mentioned over here: #1280 (comment)

I think this results in the toolbars state being reset if the React component where the toolbar is injected re-renders. If they are injecting from their top level component and edit the file then the state of the toolbar is lost. I don't think that's good DX/UX.

I would continue to argue that that addToolbar should be idempotent, it adds it the first time and is ignored after. This is for use in development, it's not part of a react app.

[msfstef]

@thruflo @samwillis ping to get this either merged or closed, just needs a decision.

I'm happy to make it remount the toolbar, gives it a nice "reset" based idempotency rather than a "check" based one (every addToolbar will clear any existing toolbar and add one, always) at the cost of potentially having a jarring toolbar reset while being used, but I'm not particularly invested in either choice.

[samwillis]

@msfstef lets merge this as it, if users complain about UX then we come back to it.

[samwillis]

👍