[brenelz]

• I have read the Contribution guide
• This PR references an issue (except for typos, broken links, or other minor problems)

Description(required)

Work in progress. This tests whether the Solid 2 tutorial and playground can live in the docs, following the discussion about devagrawal09/solid-site#1.

The docs site runs on Solid 1.9, and the Solid 2 playground UI (solid-repl) is a Solid 2 component, so it cannot be imported directly. This PR embeds the hosted playground in an iframe instead. A new <Playground code={...} /> MDX component compresses the files into the playground's /#<lz-string tabs> URL and adds an import_map.json that pins solid-js@2.0.0-rc.18. The reactivity page uses it under "Try it: a shipping estimate", loading the LineItem starter from src/playgrounds/line-item.tsx with a ?raw import. That folder is excluded from tsc and ESLint because it holds Solid 2 code.

The deploy preview will show the playground's default counter rather than LineItem. The live playground.solidjs.com writes the hash files to localStorage after it has already loaded the scratchpad, then its autosave overwrites them. solidjs/solid-playground#201 reloads the scratchpad after a hash import, which fixes it. VITE_PLAYGROUND_URL lets a build point at another playground host until that is deployed.

Verified locally: built solid-playground#201 (2b803dd) and served it on port 4174, then ran VITE_PLAYGROUND_URL=http://127.0.0.1:4174/ pnpm build and served dist/. In Chromium, the embed loaded LineItem, fetched solid-js and @solidjs/web 2.0.0-rc.18 from esm.sh, and the preview updated on click. pnpm check:types, pnpm check:lint and Prettier pass. pnpm check:examples was not run because it needs a local Solid checkout.

Open:

• The docs content column is about 660px wide, and the playground switches to its single-pane mobile layout below 768px, so the preview is hidden. An embed mode in solid-playground is needed.
• The Solid version is hardcoded to 2.0.0-rc.18.

Related issues & labels

• Suggested label(s) (optional): documentation

🤖 Generated with Claude Code

[bolt-new-by-stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[netlify]

✅ Deploy Preview for solid-docs-v2 ready!

Name	Link
🔨 Latest commit	fcd0593
🔍 Latest deploy log	https://app.netlify.com/projects/solid-docs-v2/deploys/6adfcb945bbfd4aec856ce92
😎 Deploy Preview	https://deploy-preview-1669--solid-docs-v2.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[socket-security]

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	@​amoutonbrady/​lz-string@​0.2.0

View full report