Use correct postcss-prefixwrap package

WordPress · Sep 26, 2023 · dddafc1 · dddafc1
1 parent 57a23a5
commit dddafc1
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 64 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/block-editor/package.json b/packages/block-editor/package.json
@@ -73,7 +73,7 @@
 		"dom-scroll-into-view": "^1.2.1",
 		"fast-deep-equal": "^3.1.3",
 		"postcss": "^8.4.21",
-		"postcss-editor-styles": "^0.3.0",
+		"postcss-prefixwrap": "^1.41.0",
 		"postcss-urlrebase": "^1.0.0",
 		"react-autosize-textarea": "^7.1.0",
 		"react-easy-crop": "^4.5.1",

diff --git a/packages/block-editor/src/utils/transform-styles/index.js b/packages/block-editor/src/utils/transform-styles/index.js
@@ -2,7 +2,7 @@
  * External dependencies
  */
 import postcss from 'postcss';
-import wrap from 'postcss-editor-styles';
+import wrap from 'postcss-prefixwrap';
 import rebaseUrl from 'postcss-urlrebase';
 
 /**
@@ -14,10 +14,15 @@ import rebaseUrl from 'postcss-urlrebase';
  */
 const transformStyles = ( styles, wrapperClassName = '' ) => {
 	return Object.values( styles ?? [] ).map( ( { css, baseURL } ) => {
-		return postcss( [
-			wrap( { scopeTo: wrapperClassName } ),
-			rebaseUrl( { rootUrl: baseURL } ),
-		] ).process( css, {} ).css; // use sync PostCSS API
+		return postcss(
+			[
+				wrapperClassName &&
+					wrap( `.${ wrapperClassName }`, {
+						prefixRootTags: true,
+					} ),
+				rebaseUrl( { rootUrl: baseURL } ),
+			].filter( Boolean )
+		).process( css, {} ).css; // use sync PostCSS API
 	} );
 };