Feature request: Possibility to render multiple editors on a page

[JeroenReumkens]

If I understand the code correctly, it's currently only possible to render one editor on the page if you're using lazy/hydrate.
Would be great if we could pass a selector to these functions, plus unique workspaces to each of them.

Something like this would already be sufficient I think:

const el = document.getElementById('my-editor');
const workspace = new Workspace(...);

hydrate({
  element: el,
  workspace
});

Why I want this?

I'm running my own course platform, and on these pages there's potentially multiple exercises, each running their own playground.

--

Thanks for making this library! So far it looks super useful. I'm already trying to implement it in my platform, although I'm not sure if that's a wise decision while it is still in early development 😁

[ije]

i have the plan to add multiple workspaces support:

<monaco-editor workspace="workspace-1"></monaco-editor>
<monaco-editor workspace="workspace-2"></monaco-editor>

const workspace1 = new Workspace( { name: "workspace-1" } );
const workspace2 = new Workspace( { name: "workspace-2" } );

hydrate({
  workspaces: [workspace1, workspace2]
});

[JeroenReumkens]

Nice! That would totally work for me.

Would slightly complicate it a bit for me because I render the playground components as mdx components. Meaning I run the Monaco code inside each component (Astro).

Having 1 hydrate call would be a bit more effort since I need to get all playgrounds from the mdx data and hydrate on page level. Could definitely work though, but might be a good use case to keep in mind.

[ije]

do you use SSR mode with Astro?

[JeroenReumkens]

Yes. Although only ran it locally for now, not built and deployed to vercel yet. So unsure if there's any hurdles there still.

Feel free to reach out on X if you'd like more info: https://x.com/jeroenreumkens

[JeroenReumkens]

@ije Just finished the implementation and deployed it to a test env. Seems to work great combining Astro SSR + Vercel deployments.

Was struggling a bit yesterday with configuring custom themes, but I guess that was user error. I'll explore that a bit more later today.

Please let me know once you've implemented the multiple workspaces, after that I feel this is production ready for me 🤯 All is working very well. Also happy to give a hand where possible.

[PaperPrototype]

What’s the progress on this?