[elonehoo]

Summary

• Add a header layer control (next to Version / Framework) to switch Destyler (headless primitives) and Destyler UI (@destyler-ui/{vue,react,solid,svelte} compound components).
• Default remains Destyler. Layer changes replace editor files and fully reload the iframe while keeping the current framework; framework changes keep the current layer. Reset returns to Vue + Destyler + the checkbox demo.
• Destyler UI checkbox demos follow Vue anatomy (Control before Label, SVG check indicator). Import maps scan @destyler-ui/ like destyler packages and pin destyler-ui to latest so headless version pins stay intact.

Test plan

• Open playground on next preview: default Vue headless checkbox still works.
• Switch to Destyler UI: editor loads UI templates, iframe reloads, checkbox is visible with check SVG (not lucide / not “x”).
• Switch framework while on Destyler UI: UI templates load for that framework; Control still precedes Label.
• Switch back to Destyler: original headless templates restore.
• Pin a destyler version on headless mode, then switch to Destyler UI: UI still loads from esm.sh/@destyler-ui/... (unpinned latest).
• Share URL on Destyler UI includes layer: destyler-ui; old hashes without layer stay headless.
• Reset returns Vue + Destyler (headless) checkbox demo.
• Confirm there is no component-name dropdown from closed PR feat: add destyler component switcher #5.

---

^{Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.}

[github-actions]

🧹 PR Preview has been removed

The Zeabur preview service for this PR has been deleted.

• Closed: 2026-09-14T10:40:22.342Z
• GitHub Actions