react-email 6.6.0 → 6.6.1

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 (8) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cli/index.mjs +2 -2
  3. package/dist/index.cjs +1 -1
  4. package/dist/index.mjs +1 -1
  5. package/package.json +3 -3
  6. package/src/components/markdown/markdown.spec.tsx +1 -1
  7. package/src/components/markdown/utils/parse-css-in-js-to-inline-css.spec.ts +42 -0
  8. package/src/components/markdown/utils/parse-css-in-js-to-inline-css.ts +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # react-email
2
2
 
3
+ ## 6.6.1
4
+
5
+ ### Patch Changes
6
+
7
+ - 21bac49: Fix `Markdown` corrupting double quotes in `markdownCustomStyles`. Inline style values containing a `"` (e.g. `fontFamily: '"Times New Roman", serif'`) were escaped to the apostrophe entity `'` instead of `"`, silently rewriting the quoted value. Double quotes are now escaped as `"`.
8
+ - Updated dependencies [60a5b09]
9
+ - @react-email/render@2.0.9
10
+
3
11
  ## 6.6.0
4
12
 
5
13
  ### Minor Changes
package/dist/cli/index.mjs CHANGED
@@ -6523,7 +6523,7 @@ const getEmailsDirectoryMetadata = async (absolutePathToEmailsDirectory, keepFil
6523
6523
  //#region package.json
6524
6524
  var package_default = {
6525
6525
  name: "react-email",
6526
- version: "6.6.0",
6526
+ version: "6.6.1",
6527
6527
  description: "A live preview of your emails right in your browser.",
6528
6528
  bin: { "email": "./dist/cli/index.mjs" },
6529
6529
  type: "module",
@@ -6562,7 +6562,7 @@ var package_default = {
6562
6562
  dependencies: {
6563
6563
  "@babel/parser": "catalog:",
6564
6564
  "@babel/traverse": "catalog:",
6565
- "@react-email/render": "workspace:>=2.0.8",
6565
+ "@react-email/render": "workspace:>=2.0.9",
6566
6566
  "chokidar": "^4.0.3",
6567
6567
  "commander": "catalog:",
6568
6568
  "conf": "^15.0.2",
package/dist/index.cjs CHANGED
@@ -17730,7 +17730,7 @@ function camelToKebabCase(str) {
17730
17730
  return str.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
17731
17731
  }
17732
17732
  function escapeQuotes(value) {
17733
- if (typeof value === "string" && value.includes("\"")) return value.replace(/"/g, "'");
17733
+ if (typeof value === "string" && value.includes("\"")) return value.replace(/"/g, """);
17734
17734
  return value;
17735
17735
  }
17736
17736
  function parseCssInJsToInlineCss(cssProperties) {
package/dist/index.mjs CHANGED
@@ -17709,7 +17709,7 @@ function camelToKebabCase(str) {
17709
17709
  return str.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
17710
17710
  }
17711
17711
  function escapeQuotes(value) {
17712
- if (typeof value === "string" && value.includes("\"")) return value.replace(/"/g, "'");
17712
+ if (typeof value === "string" && value.includes("\"")) return value.replace(/"/g, """);
17713
17713
  return value;
17714
17714
  }
17715
17715
  function parseCssInJsToInlineCss(cssProperties) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-email",
3
- "version": "6.6.0",
3
+ "version": "6.6.1",
4
4
  "description": "A live preview of your emails right in your browser.",
5
5
  "bin": {
6
6
  "email": "./dist/cli/index.mjs"
@@ -37,7 +37,7 @@
37
37
  "dependencies": {
38
38
  "@babel/parser": "7.27.0",
39
39
  "@babel/traverse": "7.27.0",
40
- "@react-email/render": ">=2.0.8",
40
+ "@react-email/render": ">=2.0.9",
41
41
  "chokidar": "^4.0.3",
42
42
  "commander": "^13.0.0",
43
43
  "conf": "^15.0.2",
@@ -74,7 +74,7 @@
74
74
  "tsx": "4.21.0",
75
75
  "typescript": "5.9.3",
76
76
  "yalc": "1.0.0-pre.53",
77
- "@react-email/render": "2.0.8"
77
+ "@react-email/render": "2.0.9"
78
78
  },
79
79
  "scripts": {
80
80
  "build": "tsdown",
package/src/components/markdown/markdown.spec.tsx CHANGED
@@ -116,7 +116,7 @@ console.log(\`Hello, $\{name}!\`);
116
116
  </Markdown>,
117
117
  );
118
118
  expect(actualOutput).toMatchInlineSnapshot(`
119
- "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><!--$--><div data-id="react-email-markdown"><p><strong style="font:700 23px / 32px &#x27;Roobert PRO&#x27;, system-ui, sans-serif;background:url(&#x27;path/to/image&#x27;)">This is sample bold text in markdown</strong> and <em style="font-style:italic">this is italic text</em></p>
119
+ "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><!--$--><div data-id="react-email-markdown"><p><strong style="font:700 23px / 32px &quot;Roobert PRO&quot;, system-ui, sans-serif;background:url(&quot;path/to/image&quot;)">This is sample bold text in markdown</strong> and <em style="font-style:italic">this is italic text</em></p>
120
120
  </div><!--/$-->"
121
121
  `);
122
122
  });
package/src/components/markdown/utils/parse-css-in-js-to-inline-css.spec.ts ADDED
@@ -0,0 +1,42 @@
1
+ import { parseCssInJsToInlineCss } from './parse-css-in-js-to-inline-css.js';
2
+
3
+ describe('parseCssInJsToInlineCss', () => {
4
+ it('returns an empty string for undefined styles', () => {
5
+ expect(parseCssInJsToInlineCss(undefined)).toBe('');
6
+ });
7
+
8
+ it('converts camelCase properties to kebab-case', () => {
9
+ expect(parseCssInJsToInlineCss({ fontFamily: 'serif' })).toBe(
10
+ 'font-family:serif',
11
+ );
12
+ });
13
+
14
+ it('appends px to numeric values of numerical properties', () => {
15
+ expect(parseCssInJsToInlineCss({ fontSize: 16 })).toBe('font-size:16px');
16
+ });
17
+
18
+ it('joins multiple declarations with a semicolon', () => {
19
+ expect(parseCssInJsToInlineCss({ color: 'red', fontSize: 16 })).toBe(
20
+ 'color:red;font-size:16px',
21
+ );
22
+ });
23
+
24
+ it('escapes double quotes so they do not break the style attribute', () => {
25
+ const result = parseCssInJsToInlineCss({
26
+ fontFamily: '"Times New Roman", serif',
27
+ });
28
+
29
+ expect(result).toBe('font-family:&quot;Times New Roman&quot;, serif');
30
+ expect(result).not.toContain('"');
31
+ });
32
+
33
+ it('does not corrupt double-quoted values into apostrophes', () => {
34
+ const result = parseCssInJsToInlineCss({
35
+ fontFamily: '"Times New Roman", serif',
36
+ });
37
+
38
+ // `&#x27;` is the apostrophe entity and would silently change the
39
+ // quoted font name; a double quote must be escaped as `&quot;`.
40
+ expect(result).not.toContain('&#x27;');
41
+ });
42
+ });
package/src/components/markdown/utils/parse-css-in-js-to-inline-css.ts CHANGED
@@ -4,7 +4,7 @@ function camelToKebabCase(str: string): string {
4
4
 
5
5
  function escapeQuotes(value: unknown) {
6
6
  if (typeof value === 'string' && value.includes('"')) {
7
- return value.replace(/"/g, '&#x27;');
7
+ return value.replace(/"/g, '&quot;');
8
8
  }
9
9
  return value;
10
10
  }