Adding a side view to the editor

Suppose that I have some react widget that produces a preview/diagram/whatever based on the contents of some source file. Is it possible to inject this widget into the same tab as an editor, achieving an effect similar to the comparison editor, only now the right side is my react widget? I can already open my widget in its own tab as a standalone view in the IDE, but this is not quite what I’m looking for.

I think what you are looking for is like something in the same vein as the preview contribution of Theia. E.g. opening a preview for a markdown file will open it to the right of the original file and split the editor.

For this behavior, you need to pass the mode: 'open-to-right' property of the WidgetOptions to the widget manager when opening the new widget like in here. You also need to pass your reference widget, for it to correctly open beside that.

Alternatively you could always ignore Theia’s builtin stuff and instead handle the preview/whatever inside your react component, but I imagine you don’t want to go that route.