feat!: libraries only export (valid) ES modules (#405)

The ES module exports are now actually valid (they lacked the `.js`
extension required to point to real paths in some of the packages).
To avoid having to change all import paths in the TypeScript code
itself, we use `esnext/bundler` instead of `nodenext/nodenext`
module resolution. While the latter was slightly simpler as it
did not need e.g. esbuild, the `topbar` code was already quite
large, so it was easier to switch to bundler (and then do that
for all packages so they are aligned).

BREAKING:
- libraries are now only exported as (native) ES modules
  NOTE: Fluent UI packages are still missing extensions for most ES
  module imports, which is upsetting Node.js, cfr [this issue](microsoft/fluentui#30634)
  This means that for testing, you will need to (partially) bundle these.
  With vitest, you can do this by providing packages to be optimized:
  ```
  test: {
    deps: { optimizer: { web: {
        enabled: true,
        include: [<package-name>, ...],
    }}},
  },
  ```
- generated tokens are not included in the repo, you need to run
  the `fluent-theme-tokens` command which comes with the
  `@axiscommunications/fluent-theme` package to generate them

TLDR:
- all packages are of type "module" and use the "export" field
- TypeScript is updated to v5 which supports "bundler" resolution
  and that is used throughout
- type declarations are built with tsc using tsconfig.build.json
  which excludes any test sources (if present)
- bundles are produced using esbuild CLI (no config file), which fixes
  some packages that did not have proper extensions as ES modules.
  NOTE: these are not minifed bundles as in `.min.js` as we don't directly use
  modules in production yet)
- ts-node is removed as it's no longer up-to-date and cannot handle ES
  modules properly connected to unresolved issues. Scripts use JS for
  now (until e.g. Node.js allows running TS directly).
- lodash was removed (instead of replacing with lodash-es)
- vitest + coverage was updated to v3, vite to v6

Author: steabert

.github/dependabot.yml

@@ -11,10 +11,10 @@ updates:
           - "minor"
           - "patch"
         patterns:
+          - "*esbuild*"
           - "*vite*"
           - "*biome*"
           - "depcheck"
-          - "ts-node"
           - "typescript"
       fluent:
         update-types:

.github/workflows/deploy.yml

@@ -21,7 +21,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 22
 
       - name: Install dependencies
         run: |

.github/workflows/publish.yml

@@ -24,7 +24,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: "18"
+          node-version: 22
           registry-url: "https://npm.pkg.github.com"
           scope: "@axiscommunications"
 

.github/workflows/verify-icons.yml

@@ -20,7 +20,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 22
 
       - name: Install dependencies
         run: |

.github/workflows/verify-illustrations.yml

@@ -20,7 +20,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 22
 
       - name: Install dependencies
         run: |

.github/workflows/verify-page.yml

@@ -21,7 +21,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 22
 
       - name: Install dependencies
         run: |

.github/workflows/verify-tokens.yml

@@ -20,16 +20,17 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 22
 
       - name: Install dependencies
         run: |
           corepack enable
           corepack prepare --activate
           pnpm install --frozen-lockfile
 
+      - name: Build theme library and token generator
+        run: pnpm --filter @axiscommunications/fluent-theme build
+
       - name: Transform Fluent Theme to JSON, builds tokens for platforms
-        run: pnpm --filter @axiscommunications/fluent-theme tokens:runall
+        run: pnpm --filter @axiscommunications/fluent-theme tokens
 
-      - name: Build theme
-        run: pnpm --filter @axiscommunications/fluent-theme build

.github/workflows/verify.yml

@@ -20,7 +20,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 22
 
       - name: Install dependencies
         run: |

components/empty-view/package.json

@@ -20,26 +20,29 @@
   "files": ["lib"],
   "scripts": {
     "prebuild": "pnpm run -C ../../illustrations build",
-    "build": "pnpm prebuild && tsc",
+    "build": "pnpm prebuild && pnpm build:types && pnpm build:esm",
+    "build:esm": "esbuild --format=esm --bundle --sourcemap --packages=external --outdir=lib src/index.ts",
+    "build:types": "tsc -p tsconfig.build.json",
     "check:unused-deps": "depcheck . --config=depcheck.yml",
     "lint": "tsc --noEmit && biome check"
   },
+  "dependencies": {
+    "@axiscommunications/fluent-hooks": "workspace: *",
+    "@axiscommunications/fluent-illustrations": "workspace:*"
+  },
   "devDependencies": {
     "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",
+    "esbuild": "^0.25.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "typescript": "^4.5.5"
+    "typescript": "^5.8.2"
   },
   "peerDependencies": {
     "@fluentui/react-components": "^9.58.2",
     "react": ">=16.8.0 <19.0.0",
     "react-dom": ">=16.8.0 <19.0.0"
   },
-  "dependencies": {
-    "@axiscommunications/fluent-hooks": "workspace: *",
-    "@axiscommunications/fluent-illustrations": "workspace:*"
-  },
   "publishConfig": {
     "registry": "https://npm.pkg.github.com/"
   }

components/empty-view/tsconfig.build.json

@@ -0,0 +1,8 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "noEmit": false,
+    "emitDeclarationOnly": true,
+    "outDir": "lib"
+  }
+}