From dfcdadc4f8dcb3d3ded7e0661c4890100d28c942 Mon Sep 17 00:00:00 2001
From: Vlad Rindevich <vladrin@vaadin.com>
Date: Mon, 31 Jan 2022 11:39:25 +0300
Subject: [PATCH 1/3] feat: add support for ESM

---
 karma.conf.js                        | 10 ++++--
 package.json                         | 10 +++++-
 plugins/rollup-plugin-inject-code.js | 29 ++++++++++-----
 rollup.config.js                     | 54 +++++++++++++++++++++-------
 4 files changed, 79 insertions(+), 24 deletions(-)

diff --git a/karma.conf.js b/karma.conf.js
index 303a4b9..3123682 100644
--- a/karma.conf.js
+++ b/karma.conf.js
@@ -165,9 +165,13 @@ module.exports = (config) => {
             }),
             coverage && rollupPluginInstrumentTsCode(),
             rollupPluginInjectCode({
-              'index.js': {
-                line: 3,
-                code: "    if ('adoptedStyleSheets' in document) { return; }\n",
+              insertions: {
+                'index.js': [
+                  {
+                    line: 3,
+                    code: "    if ('adoptedStyleSheets' in document) { return; }\n",
+                  },
+                ],
               },
             }),
           ].filter(Boolean),
diff --git a/package.json b/package.json
index e08cd43..90d457c 100644
--- a/package.json
+++ b/package.json
@@ -7,8 +7,16 @@
   "types": "dist/adoptedStyleSheets.d.ts",
   "files": [
     "dist/adoptedStyleSheets.js",
-    "dist/adoptedStyleSheets.d.ts"
+    "dist/adoptedStyleSheets.d.ts",
+    "dist/adoptedStyleSheets.mjs"
   ],
+  "exports": {
+    ".": {
+      "import": "dist/adoptedStyleSheets.mjs",
+      "require": "dist/adoptedStyleSheets.js",
+      "types": "dist/adoptedStyleSheets.d.ts"
+    }
+  },
   "engines": {
     "npm": ">=7"
   },
diff --git a/plugins/rollup-plugin-inject-code.js b/plugins/rollup-plugin-inject-code.js
index e1a7b88..83fa6a9 100644
--- a/plugins/rollup-plugin-inject-code.js
+++ b/plugins/rollup-plugin-inject-code.js
@@ -1,13 +1,26 @@
-module.exports = (options) => ({
+module.exports = ({insertions, lineProcessor = (line) => line}) => ({
   name: 'inject-code',
   async generateBundle(_, assets) {
-    for (const chunkName in options) {
+    Object.entries(insertions).forEach(([chunkName, chunkInsertions]) => {
       const chunk = assets[chunkName];
-      const {line, code} = options[chunkName];
 
-      const lines = chunk.code.split('\n');
-      lines.splice(line, 0, code);
-      chunk.code = lines.join('\n');
-    }
-  }
+      const lines = chunk.code.split('\n').map(lineProcessor);
+
+      for (const {line, code} of chunkInsertions) {
+        switch (line) {
+          case -Infinity:
+            lines.unshift(code);
+            break;
+          case Infinity:
+            lines.push(code);
+            break;
+          default:
+            lines.splice(line, 0, code);
+            break;
+        }
+
+        chunk.code = lines.join('\n');
+      }
+    });
+  },
 });
diff --git a/rollup.config.js b/rollup.config.js
index 54c2651..950e6e8 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -8,11 +8,48 @@ const extensions = ['.ts', '.js'];
 
 module.exports = {
   input: 'src/index.ts',
-  output: {
-    file: 'dist/adoptedStyleSheets.js',
-    format: 'iife',
-    name: 'adoptedStyleSheets',
-  },
+  output: [
+    {
+      file: 'dist/adoptedStyleSheets.js',
+      format: 'iife',
+      name: 'adoptedStyleSheets',
+      plugins: [
+        injectCode({
+          insertions: {
+            'adoptedStyleSheets.js': [
+              {
+                line: 3,
+                code: "    if (typeof document === 'undefined' || 'adoptedStyleSheets' in document) { return; }\n",
+              },
+            ],
+          },
+        }),
+      ],
+    },
+    {
+      file: 'dist/adoptedStyleSheets.mjs',
+      format: 'esm',
+      plugins: [
+        injectCode({
+          insertions: {
+            'adoptedStyleSheets.mjs': [
+              {
+                line: -Infinity,
+                code: "if (typeof document === 'undefined' || 'adoptedStyleSheets' in document) {\n",
+              },
+              {
+                line: Infinity,
+                code: '}',
+              },
+            ],
+          },
+          lineProcessor(line) {
+            return `    ${line}`;
+          },
+        }),
+      ],
+    },
+  ],
   plugins: [
     nodeResolve({
       extensions,
@@ -33,12 +70,5 @@ module.exports = {
         },
       ],
     }),
-    injectCode({
-      'adoptedStyleSheets.js': {
-        line: 3,
-        code:
-          "    if (typeof document === 'undefined' || 'adoptedStyleSheets' in document) { return; }\n",
-      },
-    }),
   ],
 };

From f4208ad92f5bcc00f9e1e3f5ebb6e0eba9a0d3fd Mon Sep 17 00:00:00 2001
From: Vlad Rindevich <vladrin@vaadin.com>
Date: Mon, 31 Jan 2022 13:38:42 +0300
Subject: [PATCH 2/3] fix: use .mjs for "module" field

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index feca317..b328885 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,7 @@
   "version": "3.0.6",
   "description": "Constructible style sheets/adopted style sheets polyfill",
   "main": "dist/adoptedStyleSheets.js",
-  "module": "dist/adoptedStyleSheets.js",
+  "module": "dist/adoptedStyleSheets.mjs",
   "types": "dist/adoptedStyleSheets.d.ts",
   "files": [
     "dist/adoptedStyleSheets.js",

From b4b294e064b2d2cc0fa18461fe0b7c3cd656d466 Mon Sep 17 00:00:00 2001
From: Vlad Rindevich <vladrin@vaadin.com>
Date: Mon, 31 Jan 2022 15:31:35 +0300
Subject: [PATCH 3/3] refactor: rename lineProcessor -> processLine

---
 plugins/rollup-plugin-inject-code.js | 4 ++--
 rollup.config.js                     | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/plugins/rollup-plugin-inject-code.js b/plugins/rollup-plugin-inject-code.js
index 83fa6a9..a3a137a 100644
--- a/plugins/rollup-plugin-inject-code.js
+++ b/plugins/rollup-plugin-inject-code.js
@@ -1,10 +1,10 @@
-module.exports = ({insertions, lineProcessor = (line) => line}) => ({
+module.exports = ({insertions, processLine = (line) => line}) => ({
   name: 'inject-code',
   async generateBundle(_, assets) {
     Object.entries(insertions).forEach(([chunkName, chunkInsertions]) => {
       const chunk = assets[chunkName];
 
-      const lines = chunk.code.split('\n').map(lineProcessor);
+      const lines = chunk.code.split('\n').map(processLine);
 
       for (const {line, code} of chunkInsertions) {
         switch (line) {
diff --git a/rollup.config.js b/rollup.config.js
index 950e6e8..60e68d3 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -43,7 +43,7 @@ module.exports = {
               },
             ],
           },
-          lineProcessor(line) {
+          processLine(line) {
             return `    ${line}`;
           },
         }),