mayank99
commented
1 year ago Could you add some info in readme how to run these? It's kinda obvious but it's nice to have some info for users or new team members who is not familiar with this environment.
Updated the contributing guide. It mentions the dev server and ports. I didn't add any READMEs to individual workspaces because i thought that would kinda become hidden and too many files to maintain.
This PR adds examples for nextjs and astro to showcase the ability to SSR our ThemeProvider, as well as allow easily testing things. The nextjs example uses
next-transpile-modulesto resolve css imports within components (this is a limitation in nextjs). The astro example doesn't hydrate theThemeProvider(noclient:*) because hydrating it results in an extra<body>tag being added. I think this is a bug in astro.yarn buildwill build these playgrounds (as well as the existing vite one) so we can be sure that our package will continue to work with these frameworks in every future release. Currently these examples only contain aButtonandThemeProvider. We could add more things in the future.Other interesting notes:
playgrounds/folder.configs. Every playground should be self-contained so that it can be opened in stackblitz/codesandbox through url. See https://github.com/iTwin/iTwinUI-react/issues/948#issuecomment-1329478969 for more context.configsso that it can be shared bywebsiteandastro-playground.yarn dev. Auto-opening every dev server is an annoying experience, so they will now need to be manually opened. Storybook and website will still auto-open. The urls/ports will be as follows (incrementing from 1700 which i picked randomly), assuming they are available:http://localhost:1700http://localhost:1701http://localhost:1702http://localhost:1703http://localhost:6006(storybook default)