@wordpress/block-library 8.11.0 → 8.12.1

package/build-style/term-description/style-rtl.css

@@ -0,0 +1,97 @@
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Colors
+ */
+/**
+ * Breakpoints & Media Queries
+ */
+/**
+ * SCSS Variables.
+ *
+ * Please use variables from this sheet to ensure consistency across the UI.
+ * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
+ * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Colors
+ */
+/**
+ * Fonts & basic variables.
+ */
+/**
+ * Grid System.
+ * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
+ */
+/**
+ * Dimensions.
+ */
+/**
+ * Shadows.
+ */
+/**
+ * Editor widths.
+ */
+/**
+ * Block & Editor UI.
+ */
+/**
+ * Block paddings.
+ */
+/**
+ * React Native specific.
+ * These variables do not appear to be used anywhere else.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Long content fade mixin
+ *
+ * Creates a fading overlay to signify that the content is longer
+ * than the space allows.
+ */
+/**
+ * Breakpoint mixins
+ */
+/**
+ * Focus styles.
+ */
+/**
+ * Applies editor left position to the selector passed as argument
+ */
+/**
+ * Styles that are reused verbatim in a few places
+ */
+/**
+ * Allows users to opt-out of animations via OS-level preferences.
+ */
+/**
+ * Reset default styles for JavaScript UI based pages.
+ * This is a WP-admin agnostic reset
+ */
+/**
+ * Reset the WP Admin page styles for Gutenberg-like pages.
+ */
+:where(.wp-block-term-description) {
+  margin-top: var(--wp--style--block-gap);
+  margin-bottom: var(--wp--style--block-gap);
+}
+
+.wp-block-term-description p {
+  margin-top: 0;
+  margin-bottom: 0;
+}

package/build-style/term-description/style.css

@@ -0,0 +1,97 @@
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Colors
+ */
+/**
+ * Breakpoints & Media Queries
+ */
+/**
+ * SCSS Variables.
+ *
+ * Please use variables from this sheet to ensure consistency across the UI.
+ * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
+ * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Colors
+ */
+/**
+ * Fonts & basic variables.
+ */
+/**
+ * Grid System.
+ * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
+ */
+/**
+ * Dimensions.
+ */
+/**
+ * Shadows.
+ */
+/**
+ * Editor widths.
+ */
+/**
+ * Block & Editor UI.
+ */
+/**
+ * Block paddings.
+ */
+/**
+ * React Native specific.
+ * These variables do not appear to be used anywhere else.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Long content fade mixin
+ *
+ * Creates a fading overlay to signify that the content is longer
+ * than the space allows.
+ */
+/**
+ * Breakpoint mixins
+ */
+/**
+ * Focus styles.
+ */
+/**
+ * Applies editor left position to the selector passed as argument
+ */
+/**
+ * Styles that are reused verbatim in a few places
+ */
+/**
+ * Allows users to opt-out of animations via OS-level preferences.
+ */
+/**
+ * Reset default styles for JavaScript UI based pages.
+ * This is a WP-admin agnostic reset
+ */
+/**
+ * Reset the WP Admin page styles for Gutenberg-like pages.
+ */
+:where(.wp-block-term-description) {
+  margin-top: var(--wp--style--block-gap);
+  margin-bottom: var(--wp--style--block-gap);
+}
+
+.wp-block-term-description p {
+  margin-top: 0;
+  margin-bottom: 0;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-library",
-	"version": "8.11.0",
+	"version": "8.12.1",
 	"description": "Block library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -33,35 +33,35 @@
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
 		"@preact/signals": "^1.1.3",
-		"@wordpress/a11y": "^3.34.0",
-		"@wordpress/api-fetch": "^6.31.0",
-		"@wordpress/autop": "^3.34.0",
-		"@wordpress/blob": "^3.34.0",
-		"@wordpress/block-editor": "^12.2.0",
-		"@wordpress/blocks": "^12.11.0",
-		"@wordpress/components": "^25.0.0",
-		"@wordpress/compose": "^6.11.0",
-		"@wordpress/core-data": "^6.11.0",
-		"@wordpress/data": "^9.4.0",
-		"@wordpress/date": "^4.34.0",
-		"@wordpress/deprecated": "^3.34.0",
-		"@wordpress/dom": "^3.34.0",
-		"@wordpress/element": "^5.11.0",
-		"@wordpress/escape-html": "^2.34.0",
-		"@wordpress/hooks": "^3.34.0",
-		"@wordpress/html-entities": "^3.34.0",
-		"@wordpress/i18n": "^4.34.0",
-		"@wordpress/icons": "^9.25.0",
-		"@wordpress/keycodes": "^3.34.0",
-		"@wordpress/notices": "^4.2.0",
-		"@wordpress/primitives": "^3.32.0",
-		"@wordpress/private-apis": "^0.16.0",
-		"@wordpress/reusable-blocks": "^4.11.0",
-		"@wordpress/rich-text": "^6.11.0",
-		"@wordpress/server-side-render": "^4.11.0",
-		"@wordpress/url": "^3.35.0",
-		"@wordpress/viewport": "^5.11.0",
-		"@wordpress/wordcount": "^3.34.0",
+		"@wordpress/a11y": "^3.35.1",
+		"@wordpress/api-fetch": "^6.32.1",
+		"@wordpress/autop": "^3.35.1",
+		"@wordpress/blob": "^3.35.1",
+		"@wordpress/block-editor": "^12.3.1",
+		"@wordpress/blocks": "^12.12.1",
+		"@wordpress/components": "^25.1.1",
+		"@wordpress/compose": "^6.12.1",
+		"@wordpress/core-data": "^6.12.1",
+		"@wordpress/data": "^9.5.1",
+		"@wordpress/date": "^4.35.1",
+		"@wordpress/deprecated": "^3.35.1",
+		"@wordpress/dom": "^3.35.1",
+		"@wordpress/element": "^5.12.1",
+		"@wordpress/escape-html": "^2.35.1",
+		"@wordpress/hooks": "^3.35.1",
+		"@wordpress/html-entities": "^3.35.1",
+		"@wordpress/i18n": "^4.35.1",
+		"@wordpress/icons": "^9.26.1",
+		"@wordpress/keycodes": "^3.35.1",
+		"@wordpress/notices": "^4.3.1",
+		"@wordpress/primitives": "^3.33.1",
+		"@wordpress/private-apis": "^0.17.1",
+		"@wordpress/reusable-blocks": "^4.12.1",
+		"@wordpress/rich-text": "^6.12.1",
+		"@wordpress/server-side-render": "^4.12.1",
+		"@wordpress/url": "^3.36.1",
+		"@wordpress/viewport": "^5.12.1",
+		"@wordpress/wordcount": "^3.35.1",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
 		"colord": "^2.7.0",
@@ -73,7 +73,8 @@
 		"memize": "^2.1.0",
 		"micromodal": "^0.4.10",
 		"preact": "^10.13.2",
-		"remove-accents": "^0.4.2"
+		"remove-accents": "^0.4.2",
+		"uuid": "^8.3.0"
 	},
 	"peerDependencies": {
 		"react": "^18.0.0",
@@ -82,5 +83,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "c7c79cb11b677adcbf06cf5f8cfb6c5ec1699f19"
+	"gitHead": "ce5639111c30763dbdf07f40eeb136ea6030ecf1"
 }

package/src/archives/block.json

@@ -1,6 +1,6 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "core/archives",
 	"title": "Archives",
 	"category": "widgets",
@@ -26,7 +26,6 @@
 	},
 	"supports": {
 		"align": true,
-		"anchor": true,
 		"html": false,
 		"spacing": {
 			"margin": true,

package/src/audio/block.json

@@ -1,6 +1,6 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "core/audio",
 	"title": "Audio",
 	"category": "media",

package/src/avatar/block.json

@@ -1,6 +1,6 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "core/avatar",
 	"title": "Avatar",
 	"category": "theme",
@@ -25,7 +25,6 @@
 	},
 	"usesContext": [ "postType", "postId", "commentId" ],
 	"supports": {
-		"anchor": true,
 		"html": false,
 		"align": true,
 		"alignWide": false,

package/src/avatar/style.scss

@@ -1,6 +1,7 @@
 .wp-block-avatar {
 	// This block has customizable padding, border-box makes that more predictable.
 	box-sizing: border-box;
+	line-height: 0;
 	img {
 		box-sizing: border-box;
 	}

package/src/block/block.json

@@ -1,8 +1,8 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "core/block",
-	"title": "Reusable block",
+	"title": "Pattern",
 	"category": "reusable",
 	"description": "Create and save content to reuse across your site. Update the block, and the changes apply everywhere it’s used.",
 	"textdomain": "default",

package/src/block/edit.js

@@ -59,6 +59,7 @@ export default function ReusableBlockEdit( { attributes: { ref }, clientId } ) {
 		'wp_block',
 		{ id: ref }
 	);
+
 	const [ title, setTitle ] = useEntityProp(
 		'postType',
 		'wp_block',

package/src/block/test/__snapshots__/transforms.native.js.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Reusable block block transforms to Columns block 1`] = `
+exports[`Pattern block transforms to Columns block 1`] = `
 "<!-- wp:columns -->
 <div class="wp-block-columns"><!-- wp:column {"width":"100%"} -->
 <div class="wp-block-column" style="flex-basis:100%"><!-- wp:block {"ref":130} /--></div>
@@ -8,7 +8,7 @@ exports[`Reusable block block transforms to Columns block 1`] = `
 <!-- /wp:columns -->"
 `;
 
-exports[`Reusable block block transforms to Group block 1`] = `
+exports[`Pattern block transforms to Group block 1`] = `
 "<!-- wp:group {"layout":{"type":"constrained"}} -->
 <div class="wp-block-group"><!-- wp:block {"ref":130} /--></div>
 <!-- /wp:group -->"

package/src/block/test/edit.native.js

@@ -114,7 +114,7 @@ describe( 'Reusable block', () => {
 
 		// Get the reusable block.
 		const [ reusableBlock ] = await screen.findAllByLabelText(
-			/Reusable block Block\. Row 1/
+			/Pattern Block\. Row 1/
 		);
 
 		expect( reusableBlock ).toBeDefined();
@@ -131,7 +131,7 @@ describe( 'Reusable block', () => {
 		} );
 
 		const [ reusableBlock ] = await screen.findAllByLabelText(
-			/Reusable block Block\. Row 1/
+			/Pattern Block\. Row 1/
 		);
 
 		const blockDeleted = within( reusableBlock ).getByText(
@@ -142,9 +142,7 @@ describe( 'Reusable block', () => {
 		expect( blockDeleted ).toBeDefined();
 	} );
 
-	// Skipped until `pointerEvents: 'none'` no longer erroneously prevents
-	// triggering `onLayout*` on the element: https://github.com/callstack/react-native-testing-library/issues/897.
-	it.skip( 'renders block content', async () => {
+	it( 'renders block content', async () => {
 		// We have to use different ids because entities are cached in memory.
 		const id = 4;
 		const initialHtml = `<!-- wp:block {"ref":${ id }} /-->`;
@@ -163,8 +161,8 @@ describe( 'Reusable block', () => {
 			initialHtml,
 		} );
 
-		const [ reusableBlock ] = await screen.findByLabelText(
-			/Reusable block Block\. Row 1/
+		const reusableBlock = await screen.findByLabelText(
+			/Pattern Block\. Row 1/
 		);
 
 		const innerBlockListWrapper = await within(

package/src/block/test/transforms.native.js

@@ -9,7 +9,7 @@ import {
 	getBlockTransformOptions,
 } from 'test/helpers';
 
-const block = 'Reusable block';
+const block = 'Pattern';
 const initialHtml = `
 <!-- wp:block {"ref":130} /-->`;
 

package/src/button/block.json

@@ -1,6 +1,6 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "core/button",
 	"title": "Button",
 	"category": "design",

package/src/buttons/block.json

@@ -1,6 +1,6 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "core/buttons",
 	"title": "Buttons",
 	"category": "design",
@@ -32,7 +32,7 @@
 				"fontSize": true
 			}
 		},
-		"__experimentalLayout": {
+		"layout": {
 			"allowSwitching": false,
 			"allowInheriting": false,
 			"default": {

package/src/buttons/edit.native.js

@@ -28,6 +28,10 @@ const ALLOWED_BLOCKS = [ buttonBlockName ];
 
 const layoutProp = { type: 'default', alignments: [] };
 
+const POPOVER_PROPS = {
+	placement: 'bottom-start',
+};
+
 export default function ButtonsEdit( {
 	attributes: { layout, align },
 	clientId,
@@ -41,7 +45,7 @@ export default function ButtonsEdit( {
 	const { marginLeft: spacing } = styles.spacing;
 
 	// Extract attributes from block layout
-	const layoutBlockSupport = getBlockSupport( name, '__experimentalLayout' );
+	const layoutBlockSupport = getBlockSupport( name, 'layout' );
 	const defaultBlockLayout = layoutBlockSupport?.default;
 	const usedLayout = layout || defaultBlockLayout || {};
 	const { justifyContent } = usedLayout;
@@ -137,10 +141,7 @@ export default function ButtonsEdit( {
 								},
 							} )
 						}
-						popoverProps={ {
-							position: 'bottom right',
-							variant: 'toolbar',
-						} }
+						popoverProps={ POPOVER_PROPS }
 					/>
 				</BlockControls>
 			) }
@@ -167,7 +168,7 @@ export default function ButtonsEdit( {
 				parentWidth={ maxWidth } // This value controls the width of that the buttons are able to expand to.
 				marginHorizontal={ spacing }
 				marginVertical={ spacing }
-				__experimentalLayout={ layoutProp }
+				layout={ layoutProp }
 				templateInsertUpdatesSelection
 				blockWidth={ blockWidth }
 			/>

package/src/buttons/test/__snapshots__/edit.native.js.snap

@@ -71,3 +71,9 @@ exports[`Buttons block when a button is shown removing button along with buttons
 <p></p>
 <!-- /wp:paragraph -->"
 `;
+
+exports[`Buttons block when a button is shown removing button along with buttons block removes the button and buttons block when deleting the block using the delete (backspace) key 1`] = `
+"<!-- wp:paragraph -->
+<p></p>
+<!-- /wp:paragraph -->"
+`;

package/src/buttons/test/edit.native.js

@@ -18,6 +18,7 @@ import {
  */
 import { getBlockTypes, unregisterBlockType } from '@wordpress/blocks';
 import { registerCoreBlocks } from '@wordpress/block-library';
+import { BACKSPACE } from '@wordpress/keycodes';
 
 const BUTTONS_HTML = `<!-- wp:buttons -->
 <div class="wp-block-buttons"><!-- wp:button /--></div>
@@ -80,7 +81,8 @@ describe( 'Buttons block', () => {
 			);
 
 			const incrementButton = await within( radiusStepper ).findByTestId(
-				'Increment'
+				'Increment',
+				{ hidden: true }
 			);
 			fireEvent( incrementButton, 'onPressIn' );
 
@@ -180,7 +182,7 @@ describe( 'Buttons block', () => {
 			expect( addBlockHerePlaceholders.length ).toBe( 0 );
 
 			// Add a new Button block
-			fireEvent.press( await screen.findByText( 'Button' ) );
+			fireEvent.press( within( blockList ).getByText( 'Button' ) );
 
 			// Get new button
 			const secondButtonBlock = await getBlock( screen, 'Button', {
@@ -232,6 +234,32 @@ describe( 'Buttons block', () => {
 
 				expect( getEditorHtml() ).toMatchSnapshot();
 			} );
+
+			it( 'removes the button and buttons block when deleting the block using the delete (backspace) key', async () => {
+				const screen = await initializeEditor( {
+					initialHtml: BUTTONS_HTML,
+				} );
+
+				// Get block
+				const buttonsBlock = await getBlock( screen, 'Buttons' );
+				triggerBlockListLayout( buttonsBlock );
+
+				// Get inner button block
+				const buttonBlock = await getBlock( screen, 'Button' );
+				fireEvent.press( buttonBlock );
+
+				const buttonInput =
+					within( buttonBlock ).getByLabelText( 'Text input. Empty' );
+
+				// Delete block
+				fireEvent( buttonInput, 'onKeyDown', {
+					nativeEvent: {},
+					preventDefault() {},
+					keyCode: BACKSPACE,
+				} );
+
+				expect( getEditorHtml() ).toMatchSnapshot();
+			} );
 		} );
 	} );
 

package/src/calendar/block.json

@@ -1,6 +1,6 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "core/calendar",
 	"title": "Calendar",
 	"category": "widgets",
@@ -17,7 +17,6 @@
 	},
 	"supports": {
 		"align": true,
-		"anchor": true,
 		"color": {
 			"link": true,
 			"__experimentalSkipSerialization": [ "text", "background" ],

package/src/categories/block.json

@@ -1,6 +1,6 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "core/categories",
 	"title": "Categories List",
 	"category": "widgets",
@@ -30,7 +30,6 @@
 	},
 	"supports": {
 		"align": true,
-		"anchor": true,
 		"html": false,
 		"spacing": {
 			"margin": true,

package/src/code/block.json

@@ -1,6 +1,6 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "core/code",
 	"title": "Code",
 	"category": "text",

package/src/column/block.json

@@ -1,6 +1,6 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "core/column",
 	"title": "Column",
 	"category": "design",
@@ -65,6 +65,6 @@
 				"fontSize": true
 			}
 		},
-		"__experimentalLayout": true
+		"layout": true
 	}
 }

package/src/columns/block.json

@@ -1,6 +1,6 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "core/columns",
 	"title": "Columns",
 	"category": "design",
@@ -43,7 +43,7 @@
 				"blockGap": true
 			}
 		},
-		"__experimentalLayout": {
+		"layout": {
 			"allowSwitching": false,
 			"allowInheriting": false,
 			"allowEditing": false,