From 9a879c8634ec9145efc0ef1743d3a6092b90f140 Mon Sep 17 00:00:00 2001 From: Brijesh Bittu Date: Fri, 30 Aug 2024 13:25:05 +0530 Subject: [PATCH 1/5] [plugin] Fix bug related to path separator on Windows (#218) --- packages/pigment-css-unplugin/src/index.ts | 9 ++++++--- .../pigment-css-vite-plugin/src/vite-plugin.ts | 14 ++++++++------ 2 files changed, 14 insertions(+), 9 deletions(-) diff --git a/packages/pigment-css-unplugin/src/index.ts b/packages/pigment-css-unplugin/src/index.ts index 62a6effe..6ae7addc 100644 --- a/packages/pigment-css-unplugin/src/index.ts +++ b/packages/pigment-css-unplugin/src/index.ts @@ -218,8 +218,11 @@ export const plugin = createUnplugin((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 +317,7 @@ export const plugin = createUnplugin((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__'), }), )}`; diff --git a/packages/pigment-css-vite-plugin/src/vite-plugin.ts b/packages/pigment-css-vite-plugin/src/vite-plugin.ts index af388815..02580197 100644 --- a/packages/pigment-css-vite-plugin/src/vite-plugin.ts +++ b/packages/pigment-css-vite-plugin/src/vite-plugin.ts @@ -132,17 +132,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 +153,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 +284,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) { From 9632ec5152bb74fd09c82e4b771a6d8a49e8a639 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Mon, 2 Sep 2024 11:14:13 +0200 Subject: [PATCH 2/5] [core] Fix CI with fake docs (#222) --- netlify.toml | 5 +++-- package.json | 1 + 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/netlify.toml b/netlify.toml index 6745d886..9ccef458 100644 --- a/netlify.toml +++ b/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" diff --git a/package.json b/package.json index 28dd9c2c..c24d14c4 100644 --- a/package.json +++ b/package.json @@ -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", From 8ef7edd71f6f3fbc0632810392d5f4a8f27f6938 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Mon, 2 Sep 2024 14:19:01 +0200 Subject: [PATCH 3/5] [core] Pin GitHub action dependency (#221) --- .github/workflows/ci.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 4d885bf9..982b617a 100644 --- a/.github/workflows/ci.yml +++ b/.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: From 4703cccdd38df1962106aca97889e42d449bc949 Mon Sep 17 00:00:00 2001 From: Rom Grk Date: Tue, 3 Sep 2024 09:25:50 -0400 Subject: [PATCH 4/5] fix: styled-engine new internals (#220) --- packages/pigment-css-react/.gitignore | 1 + packages/pigment-css-react/package.json | 10 ++++++++++ packages/pigment-css-react/src/internal/index.ts | 1 + .../src/internal/styledEngineMockup.ts | 13 +++++++++++++ packages/pigment-css-react/tsup.config.ts | 5 +++++ packages/pigment-css-unplugin/src/index.ts | 9 ++------- packages/pigment-css-vite-plugin/src/vite-plugin.ts | 9 ++------- 7 files changed, 34 insertions(+), 14 deletions(-) create mode 100644 packages/pigment-css-react/src/internal/index.ts create mode 100644 packages/pigment-css-react/src/internal/styledEngineMockup.ts diff --git a/packages/pigment-css-react/.gitignore b/packages/pigment-css-react/.gitignore index ce226001..03064a98 100644 --- a/packages/pigment-css-react/.gitignore +++ b/packages/pigment-css-react/.gitignore @@ -1,3 +1,4 @@ /processors/ /utils/ +/internal/ LICENSE diff --git a/packages/pigment-css-react/package.json b/packages/pigment-css-react/package.json index 04ee7b14..fabce2d6 100644 --- a/packages/pigment-css-react/package.json +++ b/packages/pigment-css-react/package.json @@ -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" }, diff --git a/packages/pigment-css-react/src/internal/index.ts b/packages/pigment-css-react/src/internal/index.ts new file mode 100644 index 00000000..48d5801c --- /dev/null +++ b/packages/pigment-css-react/src/internal/index.ts @@ -0,0 +1 @@ +export { default as styledEngineMockup } from './styledEngineMockup'; diff --git a/packages/pigment-css-react/src/internal/styledEngineMockup.ts b/packages/pigment-css-react/src/internal/styledEngineMockup.ts new file mode 100644 index 00000000..29dce93b --- /dev/null +++ b/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: () => '', +}; diff --git a/packages/pigment-css-react/tsup.config.ts b/packages/pigment-css-react/tsup.config.ts index 897964a6..5beec78f 100644 --- a/packages/pigment-css-react/tsup.config.ts +++ b/packages/pigment-css-react/tsup.config.ts @@ -50,4 +50,9 @@ export default defineConfig([ ], outDir: 'utils', }, + { + ...baseConfig, + entry: ['./src/internal/index.ts'], + outDir: 'internal', + }, ]); diff --git a/packages/pigment-css-unplugin/src/index.ts b/packages/pigment-css-unplugin/src/index.ts index 6ae7addc..9bc83051 100644 --- a/packages/pigment-css-unplugin/src/index.ts +++ b/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) 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); }; diff --git a/packages/pigment-css-vite-plugin/src/vite-plugin.ts b/packages/pigment-css-vite-plugin/src/vite-plugin.ts index 02580197..7e063284 100644 --- a/packages/pigment-css-vite-plugin/src/vite-plugin.ts +++ b/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) 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); }; From 445c9ceb7246a45664e8bc78e18cc2aff6f4ae9e Mon Sep 17 00:00:00 2001 From: Brijesh Bittu Date: Wed, 4 Sep 2024 13:51:56 +0530 Subject: [PATCH 5/5] v0.0.22 (#224) Co-authored-by: Marija Najdova --- CHANGELOG.md | 25 +++++++++++++++++++ package.json | 2 +- .../pigment-css-nextjs-plugin/package.json | 2 +- packages/pigment-css-react/package.json | 2 +- packages/pigment-css-unplugin/package.json | 2 +- packages/pigment-css-vite-plugin/package.json | 2 +- 6 files changed, 30 insertions(+), 5 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index f52c1894..c1924f31 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,30 @@ # [Versions](https://mui.com/versions/) +## 0.0.22 + + + +_Sep 3, 2024_ + +A big thanks to the 3 contributors who made this release possible. + +### `@pigment-css/vite-plugin@0.0.22` + +- ​Fix bug related to path separator on Windows (#218) @brijeshb42 +- ​Fix styled-engine new internals (#220) @romgrk + +### `@pigment-css/unplugin@0.0.22` + +- ​Fix bug related to path separator on Windows (#218) @brijeshb42 +- ​Fix styled-engine new internals (#220) @romgrk + +### Core + +- ​[core] Pin GitHub action dependency (#221) @oliviertassinari +- ​[core] Fix CI with fake docs (#222) @oliviertassinari + +All contributors of this release in alphabetical order: @brijeshb42, @oliviertassinari, @romgrk + ## 0.0.21 diff --git a/package.json b/package.json index c24d14c4..26089de2 100644 --- a/package.json +++ b/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", diff --git a/packages/pigment-css-nextjs-plugin/package.json b/packages/pigment-css-nextjs-plugin/package.json index 4bc5930c..646f5141 100644 --- a/packages/pigment-css-nextjs-plugin/package.json +++ b/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", diff --git a/packages/pigment-css-react/package.json b/packages/pigment-css-react/package.json index fabce2d6..10f3874c 100644 --- a/packages/pigment-css-react/package.json +++ b/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", diff --git a/packages/pigment-css-unplugin/package.json b/packages/pigment-css-unplugin/package.json index 291ee246..c6657f5f 100644 --- a/packages/pigment-css-unplugin/package.json +++ b/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", diff --git a/packages/pigment-css-vite-plugin/package.json b/packages/pigment-css-vite-plugin/package.json index c33e7717..6e49969c 100644 --- a/packages/pigment-css-vite-plugin/package.json +++ b/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",