[FEATURE] design-sync is React-only: add support for Svelte / non-React design systems
What's missing
The design-sync skill (v2.1.193) can only import React component libraries. Both source shapes render previews as React functions loaded from window.<Global> and emit .jsx preview cards, and the storybook shape's SKILL.md states "Requires React 18+" outright. There is no path for a design system written in another framework.
Impact
I tried syncing a SvelteKit design system (Svelte 5, shadcn-svelte + bits-ui, Storybook via @storybook/addon-svelte-csf). The skill correctly detects Storybook and stories, but the compiled Svelte components can never render in Claude Design's React runtime, so the whole high-fidelity import path is unavailable. shadcn-svelte is a common, well-defined target, so this is not a niche stack.
What I'd like
Some way to import a non-React design system. Options, roughly in order of effort:
- A Svelte renderer for the preview/runtime layer (mount compiled Svelte components instead of React).
- A documented framework-agnostic import that captures tokens, typography, and component previews without requiring a React runtime.
- At minimum, the skill should detect a non-React stack early and say so clearly, instead of proceeding as if React is implied.
Environment
design-sync skill 2.1.193, Claude Code on Linux. Source repo is Svelte 5 + SvelteKit, no React dependency.