jpmorganchase / mosaic

https://mosaic-mosaic-dev-team.vercel.app
https://mosaic-mosaic-dev-team.vercel.app
Apache License 2.0
21 stars 20 forks source link

Sandpack for examples #323

Open DavieReid opened 1 year ago

DavieReid commented 1 year ago

We are beginning to add code examples to the mosaic docs now and these examples would be much clearer if the markdown and rendered preview were accessible on the page.

The new React doc use sandpack for this so that might be a good starting point.

lilyvc commented 1 year ago

I've investigated this and found an issue with Sandpack not displaying a Next.js example within our site or a basic Next.js site.

I created a basic Next.js site with two Sandpack components, one using vanilla JS and the other using the Next.js Sandpack template. While the vanilla JS component works, the Next.js Sandpack template throws an error, as do other node templates.

You can find the basic example here https://codesandbox.io/p/sandbox/sandpack-nextjs-inside-nextjs-h27gql?file=%2Fpages%2Findex.tsx%3A14%2C1

origami-z commented 1 year ago

https://sandpack.codesandbox.io/docs/guides/ssr ?