From 0c4c5cf1cbac01cb462fd80cbdc81c356621d272 Mon Sep 17 00:00:00 2001
From: George Payne <georgepayne@hotmail.com>
Date: Mon, 15 Apr 2024 15:55:59 +0200
Subject: [PATCH] Standardize non-stencil build steps - use rollup for theme
 and router, so we have file extensions

---
 .changeset/famous-geckos-crash.md |  6 ++++++
 packages/router/package.json      |  8 +++++++-
 packages/router/rollup.config.js  | 21 +++++++++++++++++++++
 packages/router/tsconfig.json     | 10 ++++++----
 packages/theme/package.json       |  2 ++
 packages/theme/rollup.config.js   | 21 +++++++++++++++++++++
 packages/theme/tsconfig.json      |  4 +++-
 7 files changed, 66 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/famous-geckos-crash.md
 create mode 100644 packages/router/rollup.config.js
 create mode 100644 packages/theme/rollup.config.js

diff --git a/.changeset/famous-geckos-crash.md b/.changeset/famous-geckos-crash.md
new file mode 100644
index 00000000..918df9f8
--- /dev/null
+++ b/.changeset/famous-geckos-crash.md
@@ -0,0 +1,6 @@
+---
+'@eventstore-ui/router': patch
+'@eventstore-ui/theme': patch
+---
+
+Include file extensions in esm build
diff --git a/packages/router/package.json b/packages/router/package.json
index a32eea10..e4018f4f 100644
--- a/packages/router/package.json
+++ b/packages/router/package.json
@@ -4,6 +4,8 @@
     "description": "Router for Stencil",
     "license": "Apache-2.0",
     "main": "dist/index.js",
+    "module": "dist/index.mjs",
+    "types": "dist/index.d.ts",
     "files": [
         "dist/"
     ],
@@ -13,7 +15,11 @@
         "directory": "packages/router"
     },
     "scripts": {
-        "build": "tsc --outDir ./dist --declaration",
+        "build": "run-s \"build:*\"",
+        "build:clean": "rm -rf ./dist",
+        "build:ts": "tsc -p .",
+        "build:rollup": "rollup -c rollup.config.js",
+        "build:cleanup": "rm -rf ./build",
         "docs": "typedoc --logLevel Error --json ../../documentation/generated/router.typedoc.json",
         "test": "jest --testEnvironment jsdom --passWithNoTests",
         "lint": "yarn g:lint",
diff --git a/packages/router/rollup.config.js b/packages/router/rollup.config.js
new file mode 100644
index 00000000..b517a385
--- /dev/null
+++ b/packages/router/rollup.config.js
@@ -0,0 +1,21 @@
+import { dirname } from 'path';
+import pkg from './package.json';
+
+// eslint-disable-next-line no-restricted-syntax
+export default {
+    input: 'build/index.js',
+
+    output: [
+        {
+            format: 'cjs',
+            file: pkg.main,
+        },
+        {
+            format: 'esm',
+            dir: dirname(pkg.module),
+            preserveModules: true,
+            entryFileNames: '[name].mjs',
+        },
+    ],
+    external: ['@stencil/core'],
+};
diff --git a/packages/router/tsconfig.json b/packages/router/tsconfig.json
index 8d0c1352..245bd3e7 100644
--- a/packages/router/tsconfig.json
+++ b/packages/router/tsconfig.json
@@ -1,19 +1,21 @@
 {
     "compilerOptions": {
+        "strict": true,
         "allowSyntheticDefaultImports": true,
         "allowUnreachableCode": false,
-        "declaration": false,
+        "declaration": true,
         "experimentalDecorators": true,
         "lib": ["dom", "es2019"],
+        "outDir": "build",
+        "declarationDir": "dist",
         "moduleResolution": "node",
         "module": "esnext",
         "target": "es2017",
         "noUnusedLocals": true,
         "noUnusedParameters": true,
+        "verbatimModuleSyntax": true,
         "jsx": "react",
-        "jsxFactory": "h",
-        "strict": true,
-        "verbatimModuleSyntax": true
+        "jsxFactory": "h"
     },
     "typedocOptions": {
         "name": "@eventstore-ui/router",
diff --git a/packages/theme/package.json b/packages/theme/package.json
index 8890af4e..b3d0c492 100644
--- a/packages/theme/package.json
+++ b/packages/theme/package.json
@@ -3,6 +3,8 @@
     "version": "1.0.0",
     "description": "Themes and theming utilities for Event Store Design System",
     "main": "dist/index.js",
+    "module": "dist/index.mjs",
+    "types": "dist/index.d.ts",
     "repository": {
         "type": "git",
         "url": "git@github.com:EventStore/Design-System.git",
diff --git a/packages/theme/rollup.config.js b/packages/theme/rollup.config.js
new file mode 100644
index 00000000..b517a385
--- /dev/null
+++ b/packages/theme/rollup.config.js
@@ -0,0 +1,21 @@
+import { dirname } from 'path';
+import pkg from './package.json';
+
+// eslint-disable-next-line no-restricted-syntax
+export default {
+    input: 'build/index.js',
+
+    output: [
+        {
+            format: 'cjs',
+            file: pkg.main,
+        },
+        {
+            format: 'esm',
+            dir: dirname(pkg.module),
+            preserveModules: true,
+            entryFileNames: '[name].mjs',
+        },
+    ],
+    external: ['@stencil/core'],
+};
diff --git a/packages/theme/tsconfig.json b/packages/theme/tsconfig.json
index fb23cf01..ca24b251 100644
--- a/packages/theme/tsconfig.json
+++ b/packages/theme/tsconfig.json
@@ -3,9 +3,11 @@
         "strict": true,
         "allowSyntheticDefaultImports": true,
         "allowUnreachableCode": false,
-        "declaration": false,
+        "declaration": true,
         "experimentalDecorators": true,
         "lib": ["dom", "es2019"],
+        "outDir": "build",
+        "declarationDir": "dist",
         "moduleResolution": "node",
         "module": "esnext",
         "target": "es2017",