prep build 10/24

bph · Oct 24, 2023 · babd233 · babd233
2 parents f3ced36 + ccd87c4
commit babd233
Show file tree

Hide file tree

Showing 47 changed files with 827 additions and 1,999 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/base-styles/_mixins.scss b/packages/base-styles/_mixins.scss
@@ -64,7 +64,7 @@
  */
 
 @mixin block-toolbar-button-style__focus() {
-	box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 4px $white;
+	box-shadow: inset 0 0 0 $border-width var(--wp-components-color-background, $white), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
 
 	// Windows High Contrast mode will show this outline, but not the box-shadow.
 	outline: 2px solid transparent;

diff --git a/packages/block-editor/README.md b/packages/block-editor/README.md
@@ -789,13 +789,23 @@ Applies a series of CSS rule transforms to wrap selectors inside a given class a
 
 _Parameters_
 
--   _styles_ `Object|Array`: CSS rules.
--   _wrapperClassName_ `string`: Wrapper Class Name.
+-   _styles_ `EditorStyle[]`: CSS rules.
+-   _wrapperSelector_ `string`: Wrapper selector.
 
 _Returns_
 
 -   `Array`: converted rules.
 
+_Type Definition_
+
+-   _EditorStyle_ `Object`
+
+_Properties_
+
+-   _css_ `string`: the CSS block(s), as a single string.
+-   _baseURL_ `?string`: the base URL to be used as the reference when rewritting urls.
+-   _ignoredSelectors_ `?string[]`: the selectors not to wrap.
+
 ### Typewriter
 
 Ensures that the text selection keeps the same vertical distance from the viewport during keyboard events within this component. The vertical distance can vary. It is the last clicked or scrolled to position.

diff --git a/packages/block-editor/package.json b/packages/block-editor/package.json
@@ -71,13 +71,14 @@
 		"diff": "^4.0.2",
 		"dom-scroll-into-view": "^1.2.1",
 		"fast-deep-equal": "^3.1.3",
-		"inherits": "^2.0.3",
 		"memize": "^2.1.0",
+		"postcss": "^8.4.21",
+		"postcss-prefixwrap": "^1.41.0",
+		"postcss-urlrebase": "^1.0.0",
 		"react-autosize-textarea": "^7.1.0",
 		"react-easy-crop": "^4.5.1",
 		"rememo": "^4.0.2",
-		"remove-accents": "^0.5.0",
-		"traverse": "^0.6.6"
+		"remove-accents": "^0.5.0"
 	},
 	"peerDependencies": {
 		"react": "^18.0.0",

diff --git a/packages/block-editor/src/components/block-styles/style.scss b/packages/block-editor/src/components/block-styles/style.scss
@@ -58,7 +58,7 @@
 
 		&:focus,
 		&.is-active:focus {
-			box-shadow: inset 0 0 0 $border-width var(--wp-components-color-background, #fff), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
+			@include block-toolbar-button-style__focus();
 		}
 	}
 

diff --git a/packages/block-editor/src/utils/test/__snapshots__/transform-styles.js.snap b/packages/block-editor/src/utils/test/__snapshots__/transform-styles.js.snap
@@ -0,0 +1,103 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`transformStyles URL rewrite should not replace absolute paths 1`] = `
+[
+  "h1 { background: url(/images/test.png); }",
+]
+`;
+
+exports[`transformStyles URL rewrite should not replace remote paths 1`] = `
+[
+  "h1 { background: url(http://wp.org/images/test.png); }",
+]
+`;
+
+exports[`transformStyles URL rewrite should replace complex relative paths 1`] = `
+[
+  "h1 { background: url(http://wp-site.local/themes/gut/images/test.png); }",
+]
+`;
+
+exports[`transformStyles URL rewrite should rewrite relative paths 1`] = `
+[
+  "h1 { background: url(http://wp-site.local/themes/gut/css/images/test.png); }",
+]
+`;
+
+exports[`transformStyles selector wrap should ignore font-face selectors 1`] = `
+[
+  "
+			@font-face {
+				font-family: myFirstFont;
+				src: url(sansation_light.woff);
+			}",
+]
+`;
+
+exports[`transformStyles selector wrap should ignore keyframes 1`] = `
+[
+  "
+			@keyframes edit-post__fade-in-animation {
+				from {
+					opacity: 0;
+				}
+			}",
+]
+`;
+
+exports[`transformStyles selector wrap should ignore selectors 1`] = `
+[
+  ".my-namespace h1, body { color: red; }",
+]
+`;
+
+exports[`transformStyles selector wrap should not double wrap selectors 1`] = `
+[
+  " .my-namespace h1, .my-namespace .red { color: red; }",
+]
+`;
+
+exports[`transformStyles selector wrap should replace :root selectors 1`] = `
+[
+  "
+			.my-namespace {
+				--my-color: #ff0000;
+			}",
+]
+`;
+
+exports[`transformStyles selector wrap should replace root tags 1`] = `
+[
+  ".my-namespace, .my-namespace h1 { color: red; }",
+]
+`;
+
+exports[`transformStyles selector wrap should wrap multiple selectors 1`] = `
+[
+  ".my-namespace h1, .my-namespace h2 { color: red; }",
+]
+`;
+
+exports[`transformStyles selector wrap should wrap regular selectors 1`] = `
+[
+  ".my-namespace h1 { color: red; }",
+]
+`;
+
+exports[`transformStyles selector wrap should wrap selectors inside container queries 1`] = `
+[
+  "
+			@container (width > 400px) {
+				  .my-namespace h1 { color: red; }
+			}",
+]
+`;
+
+exports[`transformStyles should not break with data urls 1`] = `
+[
+  ".wp-block-group {
+			background-image: url("data:image/svg+xml,%3Csvg%3E.b%7Bclip-path:url(test);%7D%3C/svg%3E");
+			color: red !important;
+		  }",
+]
+`;