better-svelte-email 0.0.1 → 0.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +7 -38
  2. package/package.json +44 -44
package/README.md CHANGED
@@ -1,13 +1,13 @@
1
1
  # better-svelte-email
2
2
 
3
- [![CI](https://github.com/YOUR_USERNAME/better-svelte-email/actions/workflows/ci.yml/badge.svg)](https://github.com/YOUR_USERNAME/better-svelte-email/actions/workflows/ci.yml)
4
- [![Tests](https://github.com/YOUR_USERNAME/better-svelte-email/actions/workflows/release.yml/badge.svg)](https://github.com/YOUR_USERNAME/better-svelte-email/actions/workflows/release.yml)
3
+ [![CI](https://github.com/Konixy/better-svelte-email/actions/workflows/ci.yml/badge.svg)](https://github.com/Konixy/better-svelte-email/actions/workflows/ci.yml)
4
+ [![Tests](https://github.com/Konixy/better-svelte-email/actions/workflows/release.yml/badge.svg)](https://github.com/Konixy/better-svelte-email/actions/workflows/release.yml)
5
5
 
6
- A Svelte 5 preprocessor that transforms Tailwind CSS classes in email components to inline styles with responsive media query support.
6
+ A Svelte preprocessor that transforms Tailwind CSS classes in email components to inline styles with responsive media query support.
7
7
 
8
8
  ## Features
9
9
 
10
- ✨ **Stable & Future-Proof** - Uses Svelte 5's public preprocessor API
10
+ ✨ **Stable & Future-Proof** - Uses Svelte's public preprocessor API
11
11
  🎨 **Tailwind CSS Support** - Transforms Tailwind classes to inline styles for email clients
12
12
  📱 **Responsive Emails** - Preserves responsive classes (`sm:`, `md:`, `lg:`) as media queries
13
13
  ⚡ **Build-Time Transformation** - Zero runtime overhead
@@ -95,7 +95,6 @@ export async function POST({ request }) {
95
95
  const { name, email } = await request.json();
96
96
 
97
97
  // Render email (preprocessor already ran at build time!)
98
- // In Svelte 5, pass props directly to render
99
98
  const result = render(WelcomeEmail, { props: { name } });
100
99
 
101
100
  // Send email using your preferred service (Resend, SendGrid, etc.)
@@ -321,10 +320,10 @@ npm run test:coverage
321
320
 
322
321
  ### Type errors
323
322
 
324
- Make sure you have the latest version of Svelte 5:
323
+ Make sure you have the latest version of Svelte (requires 5.14.3 or higher):
325
324
 
326
325
  ```bash
327
- npm install svelte@^5.0.0
326
+ npm install svelte@latest
328
327
  ```
329
328
 
330
329
  ## Contributing
@@ -337,37 +336,7 @@ MIT
337
336
 
338
337
  ## Author
339
338
 
340
- Anatole
341
-
342
- ## Svelte 5 Syntax
343
-
344
- This library requires **Svelte 5** and uses modern Svelte 5 syntax. Key differences from Svelte 4:
345
-
346
- ### Props Declaration
347
-
348
- ```svelte
349
- <!-- Svelte 5 (Correct) -->
350
- <script>
351
- let { name = 'User', email } = $props();
352
- </script>
353
-
354
- <!-- Svelte 4 (Old - Don't use) -->
355
- <script>
356
- export let name = 'User';
357
- export let email;
358
- </script>
359
- ```
360
-
361
- ### Server Rendering
362
-
363
- ```typescript
364
- // Svelte 5
365
- import { render } from 'svelte/server';
366
- const result = render(Component, { props: { name } });
367
- const html = result.body;
368
- ```
369
-
370
- For a complete guide on Svelte 5 syntax, see [SVELTE5_MIGRATION.md](./SVELTE5_MIGRATION.md).
339
+ Konixy
371
340
 
372
341
  ## Development
373
342
 
package/package.json CHANGED
@@ -1,57 +1,16 @@
1
1
  {
2
2
  "name": "better-svelte-email",
3
- "version": "0.0.1",
4
- "description": "A Svelte 5 preprocessor that transforms Tailwind CSS classes in email components to inline styles with responsive media query support",
3
+ "version": "0.0.2",
5
4
  "author": "Anatole",
6
- "license": "MIT",
7
5
  "repository": {
8
6
  "type": "git",
9
7
  "url": "git+https://github.com/Konixy/better-svelte-email.git"
10
8
  },
11
- "scripts": {
12
- "dev": "vite dev",
13
- "build": "vite build && npm run prepack",
14
- "preview": "vite preview",
15
- "prepare": "svelte-kit sync || echo ''",
16
- "prepack": "svelte-kit sync && svelte-package && publint",
17
- "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
18
- "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
19
- "format": "prettier --write .",
20
- "lint": "prettier --check . && eslint .",
21
- "test": "vitest run",
22
- "test:watch": "vitest",
23
- "test:ui": "vitest --ui",
24
- "test:coverage": "vitest run --coverage"
25
- },
26
- "files": [
27
- "dist",
28
- "!dist/**/*.test.*",
29
- "!dist/**/*.spec.*"
30
- ],
31
- "sideEffects": [
32
- "**/*.css"
33
- ],
34
- "svelte": "./dist/index.js",
35
- "types": "./dist/index.d.ts",
36
- "type": "module",
37
- "exports": {
38
- ".": {
39
- "types": "./dist/index.d.ts",
40
- "svelte": "./dist/index.js",
41
- "default": "./dist/index.js"
42
- },
43
- "./preprocessor": {
44
- "types": "./dist/preprocessor/index.d.ts",
45
- "import": "./dist/preprocessor/index.js",
46
- "default": "./dist/preprocessor/index.js"
47
- }
48
- },
49
9
  "peerDependencies": {
50
- "svelte": "^5.0.0"
10
+ "svelte": "^5.14.3"
51
11
  },
52
12
  "dependencies": {
53
13
  "magic-string": "^0.30.19",
54
- "resend": "^6.1.2",
55
14
  "tw-to-css": "^0.0.12"
56
15
  },
57
16
  "devDependencies": {
@@ -73,6 +32,7 @@
73
32
  "prettier-plugin-svelte": "^3.4.0",
74
33
  "prettier-plugin-tailwindcss": "^0.6.14",
75
34
  "publint": "^0.3.13",
35
+ "resend": "^6.1.2",
76
36
  "svelte": "^5.39.8",
77
37
  "svelte-check": "^4.3.2",
78
38
  "tailwindcss": "^4.1.14",
@@ -82,6 +42,24 @@
82
42
  "vitest": "^3.2.4",
83
43
  "vitest-browser-svelte": "^1.1.0"
84
44
  },
45
+ "exports": {
46
+ ".": {
47
+ "types": "./dist/index.d.ts",
48
+ "svelte": "./dist/index.js",
49
+ "default": "./dist/index.js"
50
+ },
51
+ "./preprocessor": {
52
+ "types": "./dist/preprocessor/index.d.ts",
53
+ "import": "./dist/preprocessor/index.js",
54
+ "default": "./dist/preprocessor/index.js"
55
+ }
56
+ },
57
+ "description": "A Svelte 5 preprocessor that transforms Tailwind CSS classes in email components to inline styles with responsive media query support",
58
+ "files": [
59
+ "dist",
60
+ "!dist/**/*.test.*",
61
+ "!dist/**/*.spec.*"
62
+ ],
85
63
  "keywords": [
86
64
  "svelte",
87
65
  "svelte5",
@@ -93,5 +71,27 @@
93
71
  "responsive-email",
94
72
  "email-templates",
95
73
  "svelte-preprocessor"
96
- ]
74
+ ],
75
+ "license": "MIT",
76
+ "scripts": {
77
+ "dev": "vite dev",
78
+ "build": "vite build && npm run prepack",
79
+ "preview": "vite preview",
80
+ "prepare": "svelte-kit sync || echo ''",
81
+ "prepack": "svelte-kit sync && svelte-package && publint",
82
+ "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
83
+ "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
84
+ "format": "prettier --write .",
85
+ "lint": "prettier --check . && eslint .",
86
+ "test": "vitest run",
87
+ "test:watch": "vitest",
88
+ "test:ui": "vitest --ui",
89
+ "test:coverage": "vitest run --coverage"
90
+ },
91
+ "sideEffects": [
92
+ "**/*.css"
93
+ ],
94
+ "svelte": "./dist/index.js",
95
+ "type": "module",
96
+ "types": "./dist/index.d.ts"
97
97
  }