better-svelte-email 0.0.1 → 0.0.3

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 +8 -38
  2. package/package.json +50 -44
package/README.md CHANGED
@@ -1,13 +1,14 @@
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
+ [![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)
4
+ [![npm version](https://img.shields.io/npm/v/better-svelte-email.svg?logo=npm)](https://www.npmjs.com/package/better-svelte-email)
5
+ [![GitHub stars](https://img.shields.io/github/stars/Konixy/better-svelte-email?style=default&logo=github)](https://github.com/Konixy/better-svelte-email/stargazers)
5
6
 
6
- A Svelte 5 preprocessor that transforms Tailwind CSS classes in email components to inline styles with responsive media query support.
7
+ A Svelte preprocessor that transforms Tailwind CSS classes in email components to inline styles with responsive media query support.
7
8
 
8
9
  ## Features
9
10
 
10
- ✨ **Stable & Future-Proof** - Uses Svelte 5's public preprocessor API
11
+ ✨ **Stable & Future-Proof** - Uses Svelte's public preprocessor API
11
12
  🎨 **Tailwind CSS Support** - Transforms Tailwind classes to inline styles for email clients
12
13
  📱 **Responsive Emails** - Preserves responsive classes (`sm:`, `md:`, `lg:`) as media queries
13
14
  ⚡ **Build-Time Transformation** - Zero runtime overhead
@@ -95,7 +96,6 @@ export async function POST({ request }) {
95
96
  const { name, email } = await request.json();
96
97
 
97
98
  // Render email (preprocessor already ran at build time!)
98
- // In Svelte 5, pass props directly to render
99
99
  const result = render(WelcomeEmail, { props: { name } });
100
100
 
101
101
  // Send email using your preferred service (Resend, SendGrid, etc.)
@@ -321,10 +321,10 @@ npm run test:coverage
321
321
 
322
322
  ### Type errors
323
323
 
324
- Make sure you have the latest version of Svelte 5:
324
+ Make sure you have the latest version of Svelte (requires 5.14.3 or higher):
325
325
 
326
326
  ```bash
327
- npm install svelte@^5.0.0
327
+ npm install svelte@latest
328
328
  ```
329
329
 
330
330
  ## Contributing
@@ -337,37 +337,7 @@ MIT
337
337
 
338
338
  ## Author
339
339
 
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).
340
+ Konixy
371
341
 
372
342
  ## Development
373
343
 
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.3",
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,30 @@
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
+ "import": "./dist/preprocessor/index.js",
50
+ "default": "./dist/preprocessor/index.js"
51
+ },
52
+ "./preprocessor": {
53
+ "types": "./dist/preprocessor/index.d.ts",
54
+ "import": "./dist/preprocessor/index.js",
55
+ "default": "./dist/preprocessor/index.js"
56
+ },
57
+ "./components/*": {
58
+ "types": "./dist/components/*.svelte.d.ts",
59
+ "svelte": "./dist/components/*.svelte"
60
+ },
61
+ "./package.json": "./package.json"
62
+ },
63
+ "description": "A Svelte 5 preprocessor that transforms Tailwind CSS classes in email components to inline styles with responsive media query support",
64
+ "files": [
65
+ "dist",
66
+ "!dist/**/*.test.*",
67
+ "!dist/**/*.spec.*"
68
+ ],
85
69
  "keywords": [
86
70
  "svelte",
87
71
  "svelte5",
@@ -93,5 +77,27 @@
93
77
  "responsive-email",
94
78
  "email-templates",
95
79
  "svelte-preprocessor"
96
- ]
80
+ ],
81
+ "license": "MIT",
82
+ "scripts": {
83
+ "dev": "vite dev",
84
+ "build": "vite build && npm run prepack",
85
+ "preview": "vite preview",
86
+ "prepare": "svelte-kit sync || echo ''",
87
+ "prepack": "svelte-kit sync && svelte-package && publint",
88
+ "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
89
+ "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
90
+ "format": "prettier --write .",
91
+ "lint": "prettier --check . && eslint .",
92
+ "test": "vitest run",
93
+ "test:watch": "vitest",
94
+ "test:ui": "vitest --ui",
95
+ "test:coverage": "vitest run --coverage"
96
+ },
97
+ "sideEffects": [
98
+ "**/*.css"
99
+ ],
100
+ "svelte": "./dist/index.js",
101
+ "type": "module",
102
+ "types": "./dist/index.d.ts"
97
103
  }