From 1a8dec7c69103dc302241d3270792ebbe53da063 Mon Sep 17 00:00:00 2001
From: Niloy Sikdar <niloysikdar30@gmail.com>
Date: Sun, 7 Aug 2022 01:44:35 +0530
Subject: [PATCH] feat(example): add example for ESM

Add an example inside the example directory to show the example of how to use the package with the
ECMAScript modules standard for the Node.js environment (i.e. import/export syntax)

Resolves #72

Signed-off-by: Niloy Sikdar <niloysikdar30@gmail.com>
---
 example/fixup.sh                  |  7 ++++
 example/generate-esm/index.js     | 10 +++++-
 example/generate-esm/package.json |  2 +-
 example/package.json              |  5 +--
 example/tsconfig.json             | 34 +++++++++++-------
 example/yarn.lock                 | 58 ++++++++++++++++++++++++-------
 6 files changed, 87 insertions(+), 29 deletions(-)
 create mode 100644 example/fixup.sh

diff --git a/example/fixup.sh b/example/fixup.sh
new file mode 100644
index 0000000..fd01b74
--- /dev/null
+++ b/example/fixup.sh
@@ -0,0 +1,7 @@
+cat >lib/esm/package.json <<!EOF
+{
+    "type": "module"
+}
+!EOF
+
+echo "Fixup done."
\ No newline at end of file
diff --git a/example/generate-esm/index.js b/example/generate-esm/index.js
index d5979ce..2106bca 100644
--- a/example/generate-esm/index.js
+++ b/example/generate-esm/index.js
@@ -1 +1,9 @@
-console.log('This will be used with ECMAScript Modules');
+import { generateEmail, generateTextEmail } from '@leopardslab/react-email';
+
+import { HelloEmail } from '../lib/esm';
+
+const htmlEmail = generateEmail(HelloEmail({ name: 'John' }));
+console.log(`HTML email: ${htmlEmail}`);
+
+const textEmail = generateTextEmail(HelloEmail({ name: 'John' }));
+console.log(`Text email: ${textEmail}`);
diff --git a/example/generate-esm/package.json b/example/generate-esm/package.json
index 83835f3..309cace 100644
--- a/example/generate-esm/package.json
+++ b/example/generate-esm/package.json
@@ -5,6 +5,6 @@
   "type": "module",
   "main": "index.js",
   "scripts": {
-    "generate": "node index.js"
+    "generate": "node --experimental-specifier-resolution=node index.js"
   }
 }
diff --git a/example/package.json b/example/package.json
index ca47c12..5423b68 100644
--- a/example/package.json
+++ b/example/package.json
@@ -4,9 +4,10 @@
   "license": "MIT",
   "scripts": {
     "prepare": "yarn build",
-    "build": "rm -rf lib && yarn build:esm && yarn build:cjs",
+    "build": "rm -rf lib && yarn build:esm && yarn build:cjs && yarn fixup",
     "build:esm": "tsc -p tsconfig.json",
-    "build:cjs": "tsc -p tsconfig.json --module commonjs --outDir lib/cjs --target es2015"
+    "build:cjs": "tsc -p tsconfig.json --module commonjs --outDir lib/cjs --target es2015",
+    "fixup": "chmod u+rx ./fixup.sh && ./fixup.sh"
   },
   "dependencies": {
     "@leopardslab/react-email": "file:leopardslab-react-email-1.7.0.tgz"
diff --git a/example/tsconfig.json b/example/tsconfig.json
index dbcccc2..0a937dd 100644
--- a/example/tsconfig.json
+++ b/example/tsconfig.json
@@ -1,21 +1,29 @@
 {
   "compilerOptions": {
-    "outDir": "lib/esm",
-    "module": "ESNext",
     "target": "ESNext",
-    "lib": ["ES6", "DOM", "ESNext"],
-    "jsx": "react-jsx",
-    "declaration": true,
+    "module": "ESNext",
     "moduleResolution": "node",
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
+    "declaration": true,
+    "strict": true,
+    "noImplicitAny": true /* Raise error on expressions and declarations with an implied 'any' type. */,
+    "strictNullChecks": true /* Enable strict null checks. */,
+    "strictFunctionTypes": true /* Enable strict checking of function types. */,
+    "noUnusedLocals": true /* Report errors on unused locals. */,
+    "noUnusedParameters": true /* Report errors on unused parameters. */,
+    "noImplicitReturns": true /* Report error when not all code paths in function return a value. */,
+    "noFallthroughCasesInSwitch": true /* Report errors for fallthrough cases in switch statement. */,
+    "importHelpers": true,
+    "skipLibCheck": true,
     "esModuleInterop": true,
-    "noImplicitReturns": true,
-    "noImplicitThis": true,
-    "noImplicitAny": true,
-    "strictNullChecks": true,
-    "suppressImplicitAnyIndexErrors": true,
-    "allowSyntheticDefaultImports": true
+    "allowSyntheticDefaultImports": true,
+    "experimentalDecorators": true,
+    "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */,
+    "baseUrl": "src",
+    "rootDir": "src",
+    "outDir": "./lib/esm",
+    "lib": ["ESNext", "DOM"],
+    "jsx": "react-jsx",
+    "pretty": true
   },
   "include": ["src/**/*"],
   "exclude": ["node_modules", "lib"]
diff --git a/example/yarn.lock b/example/yarn.lock
index e805200..2ad5178 100644
--- a/example/yarn.lock
+++ b/example/yarn.lock
@@ -3,18 +3,52 @@
 
 
 "@leopardslab/react-email@file:leopardslab-react-email-1.7.0.tgz":
-  version "1.7.0"
-  resolved "file:leopardslab-react-email-1.7.0.tgz"
-  integrity sha512-sQbKH/PeRRDlozw133EM7IfaqQdtVIWCygQ52TO2QJONdtwWlwNq+IH8J3d07NMRuSwLPJwQP8yjDkJnk3dbiQ==
+  "integrity" "sha512-BGxNV7Qmfo20TbCQdakvEQEORP5ORuEXYiaUvuykZxzYt8aL6gImff2HIJu7AEpIGo84BE21NQ0cq1HZDwYV/A=="
+  "resolved" "file:leopardslab-react-email-1.7.0.tgz"
+  "version" "1.7.0"
   dependencies:
-    textversionjs "^1.1.3"
+    "textversionjs" "^1.1.3"
 
-textversionjs@^1.1.3:
-  version "1.1.3"
-  resolved "https://registry.npmjs.org/textversionjs/-/textversionjs-1.1.3.tgz"
-  integrity sha512-yZbBK7+1KRkgTJFOeIkCbQSZ+jR9ojDO/KrUKN3xEA6hA/DCMJ+aMWqjZ0rpxBJDjesbP795P5NEw+j3NnWJtA==
+"js-tokens@^3.0.0 || ^4.0.0":
+  "integrity" "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
+  "resolved" "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz"
+  "version" "4.0.0"
 
-typescript@^4.7.4:
-  version "4.7.4"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.7.4.tgz#1a88596d1cf47d59507a1bcdfb5b9dfe4d488235"
-  integrity sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==
+"loose-envify@^1.1.0":
+  "integrity" "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q=="
+  "resolved" "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz"
+  "version" "1.4.0"
+  dependencies:
+    "js-tokens" "^3.0.0 || ^4.0.0"
+
+"react-dom@>=16.8":
+  "integrity" "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g=="
+  "resolved" "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz"
+  "version" "18.2.0"
+  dependencies:
+    "loose-envify" "^1.1.0"
+    "scheduler" "^0.23.0"
+
+"react@^18.2.0", "react@>=16.8":
+  "integrity" "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ=="
+  "resolved" "https://registry.npmjs.org/react/-/react-18.2.0.tgz"
+  "version" "18.2.0"
+  dependencies:
+    "loose-envify" "^1.1.0"
+
+"scheduler@^0.23.0":
+  "integrity" "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw=="
+  "resolved" "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz"
+  "version" "0.23.0"
+  dependencies:
+    "loose-envify" "^1.1.0"
+
+"textversionjs@^1.1.3":
+  "integrity" "sha512-yZbBK7+1KRkgTJFOeIkCbQSZ+jR9ojDO/KrUKN3xEA6hA/DCMJ+aMWqjZ0rpxBJDjesbP795P5NEw+j3NnWJtA=="
+  "resolved" "https://registry.npmjs.org/textversionjs/-/textversionjs-1.1.3.tgz"
+  "version" "1.1.3"
+
+"typescript@^4.7.4":
+  "integrity" "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ=="
+  "resolved" "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz"
+  "version" "4.7.4"