docs(svelte): add svelte generation

README.md

@@ -19,11 +19,11 @@ All major frameworks are supported.
     color: white;
 
     /* 👇 Define component's props directly in your CSS */
-    &[data-variant="primary"] {
+    &[data-variant='primary'] {
       background: blue;
     }
 
-    &[data-variant="secondary"] {
+    &[data-variant='secondary'] {
       background: gray;
     }
   }
@@ -54,7 +54,7 @@ export const App = () => (
 )
 ```
 
-MistCSS can generate ⚛️ __React__,  💚 __Vue__, 🚀 __Astro__ and 🔥 __Hono__ components. You can use 🍃 __Tailwind CSS__ to style them.
+MistCSS can generate ⚛️ **React**, 💚 **Vue**, 🚀 **Astro**, 🧠**Svelte** and 🔥 **Hono** components. You can use 🍃 **Tailwind CSS** to style them.
 
 ## Documentation
 
@@ -66,6 +66,7 @@ https://typicode.github.io/mistcss
 - [Remix](https://remix.run/)
 - [React](https://react.dev/)
 - [Vue](https://vuejs.org)
+- [Svelte](https://svelte.dev/)
 - [Astro](https://astro.build/)
 - [Hono](https://hono.dev/)
 - [Tailwind CSS](https://tailwindcss.com/)

docs/src/content/docs/integration/frameworks.mdx

@@ -16,6 +16,12 @@ mistcss ./components --target=react
 mistcss ./components --target=vue
 ```
 
+## Svelte
+
+```sh
+mistcss ./components --target=svelte
+```
+
 ## Astro
 
 ```sh

docs/src/content/docs/intro.mdx

@@ -20,8 +20,9 @@ Supports:
 - [Remix](https://remix.run/)
 - [React](https://react.dev/)
 - [Vue](https://vuejs.org)
+- [Svelte](https://svelte.dev/)
 - [Astro](https://astro.build/)
 - [Hono](https://hono.dev/)
 - [Tailwind CSS](https://tailwindcss.com/)
 
-__Bonus__: if you need to switch from one framework to another, you won't have to rewrite your components. Simply change MistCSS compilation target.
+__Bonus__: if you need to switch from one framework to another, you won't have to rewrite your components. Simply change MistCSS compilation target.