Merge branch 'master' of https://github.com/mui/pigment-css into igno…

…re-null

.github/workflows/ci.yml

@@ -30,7 +30,7 @@ jobs:
           # fetch all tags which are required for `pnpm release:changelog`
           fetch-depth: 0
       - name: Set up pnpm
-        uses: pnpm/action-setup@v4
+        uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0
       - name: Use Node.js 18.x
         uses: actions/setup-node@60edb5dd545a775178f52524783378180af0d1f8 # v4.0.2
         with:

CHANGELOG.md

@@ -1,5 +1,30 @@
 # [Versions](https://mui.com/versions/)
 
+## 0.0.22
+
+<!-- generated comparing v0.0.21..master -->
+
+_Sep 3, 2024_
+
+A big thanks to the 3 contributors who made this release possible.
+
+### `@pigment-css/[email protected]`
+
+- &#8203;<!-- 1 -->Fix bug related to path separator on Windows (#218) @brijeshb42
+- &#8203;<!-- 4 -->Fix styled-engine new internals (#220) @romgrk
+
+### `@pigment-css/[email protected]`
+
+- &#8203;<!-- 1 -->Fix bug related to path separator on Windows (#218) @brijeshb42
+- &#8203;<!-- 4 -->Fix styled-engine new internals (#220) @romgrk
+
+### Core
+
+- &#8203;<!-- 3 -->[core] Pin GitHub action dependency (#221) @oliviertassinari
+- &#8203;<!-- 2 -->[core] Fix CI with fake docs (#222) @oliviertassinari
+
+All contributors of this release in alphabetical order: @brijeshb42, @oliviertassinari, @romgrk
+
 ## 0.0.21
 
 <!-- generated comparing v0.0.20..master -->

netlify.toml

@@ -11,5 +11,6 @@
   NODE_VERSION = "18"
   PNPM_FLAGS = "--shamefully-hoist"
 
-[[plugins]]
-  package = "./packages/netlify-plugin-cache-docs"
+# TODO uncomment once we have a docs website.
+# [[plugins]]
+#  package = "./packages/netlify-plugin-cache-docs"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pigment-css/monorepo",
-  "version": "0.0.21",
+  "version": "0.0.22",
   "private": true,
   "scripts": {
     "preinstall": "npx only-allow pnpm",
@@ -15,6 +15,7 @@
     "release:publish": "pnpm publish --recursive --tag latest",
     "release:publish:dry-run": "pnpm publish --recursive --tag latest --registry=\"http://localhost:4873/\"",
     "release:tag": "node scripts/releaseTag.mjs",
+    "docs:build": "rm -rf docs && mkdir -p docs/export && touch docs/export/index.html",
     "extract-error-codes": "cross-env MUI_EXTRACT_ERROR_CODES=true lerna run --concurrency 8 build:modern",
     "install:codesandbox": "pnpm install --no-frozen-lockfile",
     "jsonlint": "node ./scripts/jsonlint.mjs",

packages/pigment-css-nextjs-plugin/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pigment-css/nextjs-plugin",
-  "version": "0.0.21",
+  "version": "0.0.22",
   "main": "build/index.js",
   "module": "build/index.mjs",
   "types": "build/index.d.ts",

packages/pigment-css-react/.gitignore

@@ -1,3 +1,4 @@
 /processors/
 /utils/
+/internal/
 LICENSE

packages/pigment-css-react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pigment-css/react",
-  "version": "0.0.21",
+  "version": "0.0.22",
   "main": "build/index.js",
   "module": "build/index.mjs",
   "types": "build/index.d.ts",
@@ -98,6 +98,7 @@
     "processors",
     "theme",
     "utils",
+    "internal",
     "package.json",
     "styles.css",
     "LICENSE"
@@ -132,6 +133,15 @@
       "require": "./utils/index.js",
       "default": "./utils/index.js"
     },
+    "./internal": {
+      "types": "./internal/index.d.ts",
+      "import": {
+        "types": "./internal/index.d.mts",
+        "default": "./internal/index.mjs"
+      },
+      "require": "./internal/index.js",
+      "default": "./internal/index.js"
+    },
     "./exports/*": {
       "default": "./exports/*.js"
     },

packages/pigment-css-react/src/internal/index.ts

@@ -0,0 +1 @@
+export { default as styledEngineMockup } from './styledEngineMockup';

packages/pigment-css-react/src/internal/styledEngineMockup.ts

@@ -0,0 +1,13 @@
+/*
+ * Replicates `@mui/styled-engine` internals for the plugins to swap the runtime.
+ */
+
+export default {
+  __esModule: true,
+  default: () => () => () => null,
+  internal_mutateStyles: () => {},
+  internal_processStyles: () => {},
+  internal_serializeStyles: (x: any) => x,
+  keyframes: () => '',
+  css: () => '',
+};

packages/pigment-css-react/tsup.config.ts

@@ -50,4 +50,9 @@ export default defineConfig([
     ],
     outDir: 'utils',
   },
+  {
+    ...baseConfig,
+    entry: ['./src/internal/index.ts'],
+    outDir: 'internal',
+  },
 ]);

packages/pigment-css-unplugin/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pigment-css/unplugin",
-  "version": "0.0.21",
+  "version": "0.0.22",
   "main": "build/index.js",
   "module": "build/index.mjs",
   "types": "build/index.d.ts",

packages/pigment-css-unplugin/src/index.ts

@@ -25,6 +25,7 @@ import {
   type PluginCustomOptions,
 } from '@pigment-css/react/utils';
 import type { ResolvePluginInstance } from 'webpack';
+import { styledEngineMockup } from '@pigment-css/react/internal';
 
 import { handleUrlReplacement, type AsyncResolver } from './utils';
 
@@ -87,13 +88,7 @@ const addMaterialUIOverriedContext = (originalContext: Record<string, unknown>)
   const originalRequire = originalContext.require as (id: string) => any;
   const newRequire = (id: string) => {
     if (id === '@mui/styled-engine' || id === '@mui/styled-engine-sc') {
-      return {
-        __esModule: true,
-        default: () => () => () => null,
-        internal_processStyles: () => {},
-        keyframes: () => '',
-        css: () => '',
-      };
+      return styledEngineMockup;
     }
     return originalRequire(id);
   };
@@ -218,8 +213,11 @@ export const plugin = createUnplugin<PigmentOptions, true>((options) => {
       compiler.options.resolve.plugins = compiler.options.resolve.plugins || [];
       compiler.options.resolve.plugins.push(resolverPlugin);
     },
-    async transform(code, filePath) {
-      const [id] = filePath.split('?');
+    async transform(code, url) {
+      const [filePath] = url.split('?');
+      // Converts path separator as per platform, even on Windows, path segments have `/` instead of the usual `\`,
+      // so this function replaces such path separators.
+      const id = path.normalize(filePath);
       const transformServices = {
         options: {
           filename: id,
@@ -314,7 +312,7 @@ export const plugin = createUnplugin<PigmentOptions, true>((options) => {
         if (isNext) {
           const data = `${meta.placeholderCssFile}?${encodeURIComponent(
             JSON.stringify({
-              filename: id.split('/').pop(),
+              filename: id.split(path.sep).pop(),
               source: cssText.replaceAll('!important', '__IMP__'),
             }),
           )}`;

packages/pigment-css-vite-plugin/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pigment-css/vite-plugin",
-  "version": "0.0.21",
+  "version": "0.0.22",
   "main": "build/index.js",
   "module": "build/index.mjs",
   "types": "build/index.d.ts",

packages/pigment-css-vite-plugin/src/vite-plugin.ts

@@ -21,6 +21,7 @@ import {
   type IFileReporterOptions,
 } from '@wyw-in-js/transform';
 import { matchAdapterPath, type PluginCustomOptions } from '@pigment-css/react/utils';
+import { styledEngineMockup } from '@pigment-css/react/internal';
 
 export type VitePluginOptions = {
   debug?: IFileReporterOptions | false | null | undefined;
@@ -45,13 +46,7 @@ const addMaterialUIOverriedContext = (originalContext: Record<string, unknown>)
   const originalRequire = originalContext.require as (id: string) => any;
   const newRequire = (id: string) => {
     if (id === '@mui/styled-engine' || id === '@mui/styled-engine-sc') {
-      return {
-        __esModule: true,
-        default: () => () => () => null,
-        internal_processStyles: () => {},
-        keyframes: () => '',
-        css: () => '',
-      };
+      return styledEngineMockup;
     }
     return originalRequire(id);
   };
@@ -132,17 +127,19 @@ export default function wywVitePlugin({
         .filter((m): m is ModuleNode => !!m);
     },
     async transform(code, url) {
-      const [id] = url.split('?', 1);
-
+      const [filePath] = url.split('?', 1);
+      // Converts path separator as per platform, even on Windows, path segments have `/` instead of the usual `\`,
+      // so this function replaces such path separators.
+      const id = path.normalize(filePath);
       // Main modification starts
       if (id in cssLookup) {
         return null;
       }
 
-      let shouldReturn = url.includes('node_modules');
+      let shouldReturn = id.includes('node_modules');
 
       if (shouldReturn) {
-        shouldReturn = !transformLibraries.some((libName: string) => url.includes(libName));
+        shouldReturn = !transformLibraries.some((libName: string) => id.includes(libName));
       }
 
       if (shouldReturn) {
@@ -151,7 +148,7 @@ export default function wywVitePlugin({
       // Main modification end
 
       // Do not transform ignored and generated files
-      if (!filter(url)) {
+      if (!filter(id)) {
         return null;
       }
 
@@ -282,7 +279,7 @@ export default function wywVitePlugin({
 
         for (let i = 0, end = dependencies.length; i < end; i += 1) {
           // eslint-disable-next-line no-await-in-loop
-          const depModule = await this.resolve(dependencies[i], url, {
+          const depModule = await this.resolve(dependencies[i], id, {
             isEntry: false,
           });
           if (depModule) {