fix(e2e): update packLocalPackage for new dist layout

- Add rollup.config.cjs to style-types (consistent with core/react/shadow-dom)
- Update style-types exports to use index.esm.js/index.cjs.js pattern
- Fix packLocalPackage to copy package.json into dist with rewritten paths

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: layershifter

e2e/utils/src/packLocalPackage.ts

@@ -4,20 +4,37 @@ import * as logSymbols from 'log-symbols';
 
 import { sh } from './sh';
 
+/**
+ * Rewrites paths in package.json to be relative to the dist directory.
+ * e.g. "./dist/index.esm.js" becomes "./index.esm.js"
+ */
+function rewritePackageJsonForDist(packageJsonContent: string): string {
+  return packageJsonContent.replace(/"\.\/(dist)\//g, '"./');
+}
+
 export async function packLocalPackage(rootDir: string, tempDir: string, packageName: string) {
-  const packagePath = path.resolve(rootDir, 'packages', packageName.split('/')[1], 'dist');
-  const packagePathExists = !!(await fs.promises.stat(packagePath).catch(() => false));
+  const packagePath = path.resolve(rootDir, 'packages', packageName.split('/')[1]);
+  const distPath = path.resolve(packagePath, 'dist');
+  const distPathExists = !!(await fs.promises.stat(distPath).catch(() => false));
 
-  if (!packagePathExists) {
-    throw new Error(`A directory with artifacts (${packagePath}) does not exist`);
+  if (!distPathExists) {
+    throw new Error(`A directory with artifacts (${distPath}) does not exist`);
   }
 
+  // Copy package.json into dist with paths rewritten to be relative to dist.
+  // The old @nx/rollup:rollup executor did this automatically; with plain rollup we do it manually.
+  const packageJsonContent = await fs.promises.readFile(path.resolve(packagePath, 'package.json'), 'utf-8');
+  await fs.promises.writeFile(path.resolve(distPath, 'package.json'), rewritePackageJsonForDist(packageJsonContent));
+
   // Use `npm pack` because `yarn pack` incorrectly calculates the included files when the
   // files to include/exclude are specified by .npmignore rather than package.json `files`.
   // (--quiet outputs only the .tgz filename, not all the included files)
-  const packFile = (await sh(`npm pack --quiet ${packagePath}`, tempDir, true)).trim();
+  const packFile = (await sh(`npm pack --quiet ${distPath}`, tempDir, true)).trim();
   console.log(logSymbols.success, `Package "${packageName}" was packed`);
 
+  // Clean up the temporary package.json in dist
+  await fs.promises.unlink(path.resolve(distPath, 'package.json'));
+
   return {
     packageName,
     file: packFile,

packages/style-types/package.json

@@ -16,7 +16,9 @@
     ".": {
       "@griffel/source": "./src/index.ts",
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.js"
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js",
+      "default": "./dist/index.esm.js"
     }
   },
   "types": "./dist/index.d.ts",

packages/style-types/rollup.config.cjs

@@ -0,0 +1,14 @@
+const { withNx } = require('@nx/rollup/with-nx');
+const getRollupOptions = require('../../tools/getRollupOptions');
+
+module.exports = getRollupOptions(
+  withNx({
+    main: './src/index.ts',
+    outputPath: './dist',
+    tsConfig: './tsconfig.lib.json',
+    compiler: 'babel',
+    format: ['esm', 'cjs'],
+    external: ['tslib'],
+    sourceMap: true,
+  }),
+);

packages/webpack-plugin/package.json

@@ -23,8 +23,8 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@griffel/transform": "^1.2.0",
     "@griffel/core": "^1.20.0",
+    "@griffel/transform": "^1.2.0",
     "enhanced-resolve": "^5.15.0",
     "oxc-resolver": "^11.19.1",
     "stylis": "^4.2.0"