Repository: lingui/js-lingui
Pull request #1258 (2022-06-22 09:33:08)

fix: Add extra package.json under `/esm`

Add `package.json` with `{"type": "module"}` under `/esm`.

Fixes https://github.com/lingui/js-lingui/issues/1254

vercel[bot]: **The latest updates on your projects**. Learn more about [Vercel for Git ↗︎](https://vercel.link/github-learn-more)

| Name | Status | Preview | Updated |
| :--- | :----- | :------ | :------ |
| **js-lingui** | 🔄 Building ([Inspect](https://vercel.com/tricoder42/js-lingui/CStesC4bShYB3RRoep5Beb29QHgB)) |  | Jun 22, 2022 at 9:33AM (UTC) |



Patch:
diff --git a/packages/core/npm/esm/dev.js b/packages/core/npm/esm/dev.js
index 988a5a2f..c65bea8c 100644
--- a/packages/core/npm/esm/dev.js
+++ b/packages/core/npm/esm/dev.js
@@ -3,14 +3,14 @@ import {
   setupI18n as setupI18nProd,
   formats as formatsProd,
   I18n as I18nProd
-} from './dev.production.min';
+} from './dev.production.min.js';
 
 import {
   i18n as i18nDev,
   setupI18n as setupI18nDev,
   formats as formatsDev,
   I18n as I18nDev
-} from './dev.development';
+} from './dev.development.js';
 
 export const i18n = process.env.NODE_ENV === 'production' ? i18nProd : i18nDev;
 export const setupI18n = process.env.NODE_ENV === 'production' ? setupI18nProd : setupI18nDev;
diff --git a/packages/core/npm/esm/index.js b/packages/core/npm/esm/index.js
index 01cf71e7..2acbaf22 100644
--- a/packages/core/npm/esm/index.js
+++ b/packages/core/npm/esm/index.js
@@ -3,14 +3,14 @@ import {
     setupI18n as setupI18nProd,
     formats as formatsProd,
     I18n as I18nProd
-} from './core.production.min';
+} from './core.production.min.js';
 
 import {
     i18n as i18nDev,
     setupI18n as setupI18nDev,
     formats as formatsDev,
     I18n as I18nDev
-} from './core.development';
+} from './core.development.js';
 
 export const i18n = process.env.NODE_ENV === 'production' ? i18nProd : i18nDev;
 export const setupI18n = process.env.NODE_ENV === 'production' ? setupI18nProd : setupI18nDev;
diff --git a/packages/core/npm/esm/package.json b/packages/core/npm/esm/package.json
new file mode 100644
index 00000000..3dbc1ca5
--- /dev/null
+++ b/packages/core/npm/esm/package.json
@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}
diff --git a/packages/detect-locale/npm/esm/package.json b/packages/detect-locale/npm/esm/package.json
new file mode 100644
index 00000000..3dbc1ca5
--- /dev/null
+++ b/packages/detect-locale/npm/esm/package.json
@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}
diff --git a/packages/macro/src/macroJsx.ts b/packages/macro/src/macroJsx.ts
index bddd6547..4d60d95a 100644
--- a/packages/macro/src/macroJsx.ts
+++ b/packages/macro/src/macroJsx.ts
@@ -52,17 +52,10 @@ export default class MacroJSX {
   }
 
   safeJsxAttribute = (name: string, value: string) => {
-    // Quoted JSX attributes use XML-style escapes instead of JavaScript-style escapes.
-    // This means that <Trans id="Say \"hi\"!" /> is invalid, but <Trans id={"Say \"hi\"!"} /> is valid.
-
-    // We could consider removing this condition and always wrap in a jsxExpressionContainer.
-    const attributeValue = value.includes('"')
-      ? this.types.jsxExpressionContainer(this.types.stringLiteral(value))
-      : this.types.stringLiteral(value)
-
+    // This handles quoted JSX attributes and html entities.
     return this.types.jsxAttribute(
       this.types.jsxIdentifier(name),
-      attributeValue
+      this.types.jsxExpressionContainer(this.types.stringLiteral(value))
     )
   }
 
diff --git a/packages/react/npm/esm/package.json b/packages/react/npm/esm/package.json
new file mode 100644
index 00000000..3dbc1ca5
--- /dev/null
+++ b/packages/react/npm/esm/package.json
@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}


Test patch:
diff --git a/packages/macro/test/fixtures/jsx-plural-select-nested.expected.js b/packages/macro/test/fixtures/jsx-plural-select-nested.expected.js
index b884f6d3..fd19a6c2 100644
--- a/packages/macro/test/fixtures/jsx-plural-select-nested.expected.js
+++ b/packages/macro/test/fixtures/jsx-plural-select-nested.expected.js
@@ -1,5 +1,5 @@
 import { Trans } from "@lingui/react";
-<Trans id="{genderOfHost, select, female {{numGuests, plural, offset:1 =0 {{host} does not give a party.} =1 {{host} invites {guest} to her party.} =2 {{host} invites {guest} and one other person to her party.} other {{host} invites {guest} and # other people to her party.}}} male {{numGuests, plural, offset:1 =0 {{host} does not give a party.} =1 {{host} invites {guest} to his party.} =2 {{host} invites {guest} and one other person to his party.} other {{host} invites {guest} and # other people to his party.}}} other {{numGuests, plural, offset:1 =0 {{host} does not give a party.} =1 {{host} invites {guest} to their party.} =2 {{host} invites {guest} and one other person to their party.} other {{host} invites {guest} and # other people to their party.}}}}" values={{
+<Trans id={"{genderOfHost, select, female {{numGuests, plural, offset:1 =0 {{host} does not give a party.} =1 {{host} invites {guest} to her party.} =2 {{host} invites {guest} and one other person to her party.} other {{host} invites {guest} and # other people to her party.}}} male {{numGuests, plural, offset:1 =0 {{host} does not give a party.} =1 {{host} invites {guest} to his party.} =2 {{host} invites {guest} and one other person to his party.} other {{host} invites {guest} and # other people to his party.}}} other {{numGuests, plural, offset:1 =0 {{host} does not give a party.} =1 {{host} invites {guest} to their party.} =2 {{host} invites {guest} and one other person to their party.} other {{host} invites {guest} and # other people to their party.}}}}"} values={{
   genderOfHost: genderOfHost,
   numGuests: numGuests,
   host: host,
diff --git a/packages/macro/test/jsx-plural.ts b/packages/macro/test/jsx-plural.ts
index 739ad0c4..714a0dbf 100644
--- a/packages/macro/test/jsx-plural.ts
+++ b/packages/macro/test/jsx-plural.ts
@@ -12,7 +12,10 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="{count, plural, offset:1 =0 {Zero items} few {{count} items} other {<0>A lot of them</0>}}" values={{
+        <Trans id={
+          "{count, plural, offset:1 =0 {Zero items} few {{count} items} other {<0>A lot of them</0>}}"
+         }
+         values={{
           count: count
         }} components={{
           0: <a href="/more" />
@@ -38,7 +41,10 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="{count, plural, one {<0>#</0> slot added} other {<1>#</1> slots added}}" values={{
+        <Trans id={
+          "{count, plural, one {<0>#</0> slot added} other {<1>#</1> slots added}}"
+        }
+        values={{
           count: count
         }} components={{
           0: <strong />,
@@ -61,7 +67,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans render="strong" id="msg.plural" message="{count, plural, offset:1 =0 {Zero items} few {{count} items} other {<0>A lot of them</0>}}" values={{
+        <Trans render="strong" id="msg.plural" message={"{count, plural, offset:1 =0 {Zero items} few {{count} items} other {<0>A lot of them</0>}}"} values={{
           count: count
         }} components={{
           0: <a href="/more" />
@@ -84,7 +90,10 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="inner-id-removed" message="Looking for {0, plural, offset:1 =0 {zero items} few {{1} items {2}} other {<0>a lot of them</0>}}" values={{
+        <Trans id="inner-id-removed" message={
+            "Looking for {0, plural, offset:1 =0 {zero items} few {{1} items {2}} other {<0>a lot of them</0>}}"
+         }
+         values={{
           0: items.length,
           1: items.length,
           2: 42
diff --git a/packages/macro/test/jsx-select.ts b/packages/macro/test/jsx-select.ts
index 0ef906ff..07f114c9 100644
--- a/packages/macro/test/jsx-select.ts
+++ b/packages/macro/test/jsx-select.ts
@@ -11,7 +11,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="{count, select, male {He} female {She} other {<0>Other</0>}}" values={{
+        <Trans id={"{count, select, male {He} female {She} other {<0>Other</0>}}"} values={{
           count: count
         }} components={{
           0: <strong />
@@ -32,7 +32,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans render="strong" id="msg.select" message="{0, select, male {He} female {She} other {<0>Other</0>}}" values={{
+        <Trans render="strong" id="msg.select" message={"{0, select, male {He} female {She} other {<0>Other</0>}}"} values={{
           0: user.gender
         }} components={{
           0: <strong />
diff --git a/packages/macro/test/jsx-selectOrdinal.ts b/packages/macro/test/jsx-selectOrdinal.ts
index a89f21c4..e3f84606 100644
--- a/packages/macro/test/jsx-selectOrdinal.ts
+++ b/packages/macro/test/jsx-selectOrdinal.ts
@@ -13,7 +13,10 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="This is my {count, selectordinal, one {#st} two {#nd} other {<0>#rd</0>}} cat." values={{
+        <Trans id={
+          "This is my {count, selectordinal, one {#st} two {#nd} other {<0>#rd</0>}} cat."
+         }
+         values={{
           count: count
         }} components={{
           0: <strong />
@@ -34,7 +37,10 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="This is my {0, selectordinal, one {#st} two {#nd} other {<0>#rd</0>}} cat." values={{
+        <Trans id={
+          "This is my {0, selectordinal, one {#st} two {#nd} other {<0>#rd</0>}} cat."
+         }
+         values={{
           0: user.numCats
         }} components={{
           0: <strong />
diff --git a/packages/macro/test/jsx-trans.ts b/packages/macro/test/jsx-trans.ts
index 950f9fc4..97e70493 100644
--- a/packages/macro/test/jsx-trans.ts
+++ b/packages/macro/test/jsx-trans.ts
@@ -7,7 +7,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="Hello World" />;
+        <Trans id={"Hello World"} />;
       `,
   },
   {
@@ -18,7 +18,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="Hello World" />;
+        <Trans id={"Hello World"} />;
       `,
   },
   {
@@ -29,7 +29,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="msg.hello" message="Hello World" />;
+        <Trans id="msg.hello" message={"Hello World"} />;
       `,
   },
   {
@@ -40,7 +40,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="msg.hello" message="Hello World" />;
+        <Trans id="msg.hello" message={"Hello World"} />;
       `,
   },
   {
@@ -51,7 +51,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="msg.hello" message="Hello World" />;
+        <Trans id="msg.hello" message={"Hello World"} />;
       `,
   },
   {
@@ -73,7 +73,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="Hi {yourName}, my name is {myName}" values={{
+        <Trans id={"Hi {yourName}, my name is {myName}"} values={{
           yourName: yourName,
           myName: myName,
         }} />;
@@ -87,7 +87,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="{duplicate} variable {duplicate}" values={{
+        <Trans id={"{duplicate} variable {duplicate}"} values={{
           duplicate: duplicate
         }} />;
       `,
@@ -105,6 +105,23 @@ export default [
         <Trans id="custom-id" message={'Speak "friend"!'} />;
       `,
   },
+  {
+    name: "HTML attributes are handled",
+    input: `
+        import { Trans } from '@lingui/macro';
+        <Trans>
+          <Text>This should work &nbsp;</Text>
+        </Trans>;
+      `,
+    expected: `
+        import { Trans } from "@lingui/react";
+        <Trans id={"<0>This should work \\xA0</0>"}
+           components={{
+             0: <Text />,
+           }}
+        />;
+      `,
+  },
   {
     name: "Template literals as children",
     input: `
@@ -113,7 +130,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="How much is {expression}? {count}" values={{
+        <Trans id={"How much is {expression}? {count}"} values={{
           expression: expression,
           count: count
         }} />;
@@ -127,7 +144,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="hello {count, plural, one {world} other {worlds}}" />;
+        <Trans id={"hello {count, plural, one {world} other {worlds}}"} />;
       `,
   },
   {
@@ -145,7 +162,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="Property {0}, function {1}, array {2}, constant {3}, object {4}, everything {5}" values={{
+        <Trans id={"Property {0}, function {1}, array {2}, constant {3}, object {4}, everything {5}"} values={{
           0: props.name,
           1: random(),
           2: array[index],
@@ -169,7 +186,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="Hello <0>World!</0><1/><2>My name is <3> <4>{name}</4></3></2>" values={{
+        <Trans id={"Hello <0>World!</0><1/><2>My name is <3> <4>{name}</4></3></2>"} values={{
           name: name
         }} components={{
           0: <strong />,
@@ -188,7 +205,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="<0>Component inside expression container</0>" components={{
+        <Trans id={"<0>Component inside expression container</0>"} components={{
           0: <span />
         }} />;
       `,
@@ -201,7 +218,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="<0/>" components={{
+        <Trans id={"<0/>"} components={{
           0: <br />
         }} />;
       `,
@@ -222,7 +239,7 @@ export default [
     production: true,
     input: `
         import { Trans } from '@lingui/macro';
-        <Trans id="msg.hello" comment="Hello World">Hello World</Trans> 
+        <Trans id="msg.hello" comment="Hello World">Hello World</Trans>
       `,
     expected: `
         import { Trans } from "@lingui/react";
@@ -255,7 +272,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="Strip whitespace around arguments: '{name}'" values={{
+        <Trans id={"Strip whitespace around arguments: '{name}'"} values={{
           name: name
         }} />;
       `,
@@ -272,7 +289,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="Strip whitespace around tags, but keep <0>forced spaces</0>!" components={{
+        <Trans id={"Strip whitespace around tags, but keep <0>forced spaces</0>!"} components={{
           0: <strong />
         }} />;
       `,
@@ -288,7 +305,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="Keep forced\\n newlines!" />;
+        <Trans id={"Keep forced\\n newlines!"} />;
       `,
   },
   {
@@ -303,7 +320,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="Keep multiple\\n forced\\n newlines!" />;
+        <Trans id={"Keep multiple\\n forced\\n newlines!"} />;
       `,
   },
   {
@@ -314,7 +331,7 @@ export default [
     expected: `
         import { Trans } from "@lingui/react";
         import { i18n } from "@lingui/core";
-        <Trans id="Read <0>more</0>" components={{
+        <Trans id={"Read <0>more</0>"} components={{
           0: <a href="/more" title={
             /*i18n*/
             i18n._("Full content of {articleName}", {
@@ -350,7 +367,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="Hello  World" />;
+        <Trans id={"Hello  World"} />;
       `,
   },
   {
@@ -361,7 +378,7 @@ export default [
       `,
     expected: `
         import { Trans } from "@lingui/react";
-        <Trans id="&" />;
+        <Trans id={"&"} />;
       `,
   },
 ]