@wordpress/block-library 8.15.0 → 8.16.0

package/build-style/style.css

@@ -2860,10 +2860,11 @@ p.has-background {
 }
 
 .wp-block-preformatted {
+  box-sizing: border-box;
   white-space: pre-wrap;
 }
 
-.wp-block-preformatted.has-background {
+:where(.wp-block-preformatted.has-background) {
   padding: 1.25em 2.375em;
 }
 
@@ -3441,6 +3442,10 @@ ul.wp-block-rss.is-grid li {
   background-color: #2aabee;
   color: #fff;
 }
+.wp-block-social-links:not(.is-style-logos-only) .wp-social-link-threads {
+  background-color: #000;
+  color: #fff;
+}
 .wp-block-social-links:not(.is-style-logos-only) .wp-social-link-tiktok {
   background-color: #000;
   color: #fff;
@@ -3583,6 +3588,9 @@ ul.wp-block-rss.is-grid li {
 .wp-block-social-links.is-style-logos-only .wp-social-link-telegram {
   color: #2aabee;
 }
+.wp-block-social-links.is-style-logos-only .wp-social-link-threads {
+  color: #000;
+}
 .wp-block-social-links.is-style-logos-only .wp-social-link-tiktok {
   color: #000;
 }
@@ -3844,6 +3852,7 @@ pre.wp-block-verse {
 }
 .wp-block-video video {
   width: 100%;
+  vertical-align: middle;
 }
 @supports (position: sticky) {
   .wp-block-video [poster] {

package/build-style/video/style-rtl.css

@@ -91,6 +91,7 @@
 }
 .wp-block-video video {
   width: 100%;
+  vertical-align: middle;
 }
 @supports (position: sticky) {
   .wp-block-video [poster] {

package/build-style/video/style.css

@@ -91,6 +91,7 @@
 }
 .wp-block-video video {
   width: 100%;
+  vertical-align: middle;
 }
 @supports (position: sticky) {
   .wp-block-video [poster] {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-library",
-	"version": "8.15.0",
+	"version": "8.16.0",
 	"description": "Block library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -31,36 +31,36 @@
 	],
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^3.38.0",
-		"@wordpress/api-fetch": "^6.35.0",
-		"@wordpress/autop": "^3.38.0",
-		"@wordpress/blob": "^3.38.0",
-		"@wordpress/block-editor": "^12.6.0",
-		"@wordpress/blocks": "^12.15.0",
-		"@wordpress/components": "^25.4.0",
-		"@wordpress/compose": "^6.15.0",
-		"@wordpress/core-data": "^6.15.0",
-		"@wordpress/data": "^9.8.0",
-		"@wordpress/date": "^4.38.0",
-		"@wordpress/deprecated": "^3.38.0",
-		"@wordpress/dom": "^3.38.0",
-		"@wordpress/element": "^5.15.0",
-		"@wordpress/escape-html": "^2.38.0",
-		"@wordpress/hooks": "^3.38.0",
-		"@wordpress/html-entities": "^3.38.0",
-		"@wordpress/i18n": "^4.38.0",
-		"@wordpress/icons": "^9.29.0",
-		"@wordpress/interactivity": "^1.2.0",
-		"@wordpress/keycodes": "^3.38.0",
-		"@wordpress/notices": "^4.6.0",
-		"@wordpress/primitives": "^3.36.0",
-		"@wordpress/private-apis": "^0.20.0",
-		"@wordpress/reusable-blocks": "^4.15.0",
-		"@wordpress/rich-text": "^6.15.0",
-		"@wordpress/server-side-render": "^4.15.0",
-		"@wordpress/url": "^3.39.0",
-		"@wordpress/viewport": "^5.15.0",
-		"@wordpress/wordcount": "^3.38.0",
+		"@wordpress/a11y": "^3.39.0",
+		"@wordpress/api-fetch": "^6.36.0",
+		"@wordpress/autop": "^3.39.0",
+		"@wordpress/blob": "^3.39.0",
+		"@wordpress/block-editor": "^12.7.0",
+		"@wordpress/blocks": "^12.16.0",
+		"@wordpress/components": "^25.5.0",
+		"@wordpress/compose": "^6.16.0",
+		"@wordpress/core-data": "^6.16.0",
+		"@wordpress/data": "^9.9.0",
+		"@wordpress/date": "^4.39.0",
+		"@wordpress/deprecated": "^3.39.0",
+		"@wordpress/dom": "^3.39.0",
+		"@wordpress/element": "^5.16.0",
+		"@wordpress/escape-html": "^2.39.0",
+		"@wordpress/hooks": "^3.39.0",
+		"@wordpress/html-entities": "^3.39.0",
+		"@wordpress/i18n": "^4.39.0",
+		"@wordpress/icons": "^9.30.0",
+		"@wordpress/interactivity": "^2.0.0",
+		"@wordpress/keycodes": "^3.39.0",
+		"@wordpress/notices": "^4.7.0",
+		"@wordpress/primitives": "^3.37.0",
+		"@wordpress/private-apis": "^0.21.0",
+		"@wordpress/reusable-blocks": "^4.16.0",
+		"@wordpress/rich-text": "^6.16.0",
+		"@wordpress/server-side-render": "^4.16.0",
+		"@wordpress/url": "^3.40.0",
+		"@wordpress/viewport": "^5.16.0",
+		"@wordpress/wordcount": "^3.39.0",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
 		"colord": "^2.7.0",
@@ -79,5 +79,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "6f14d11ed4cb59df110a28ebaa23ecba95eb673a"
+	"gitHead": "b898cf1dc8e70841d1647ea0994ac6278acc18a7"
 }

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

@@ -4,7 +4,11 @@ exports[`Audio block renders audio block error state without crashing 1`] = `
 <View
   accessibilityState={
     {
+      "busy": undefined,
+      "checked": undefined,
       "disabled": true,
+      "expanded": undefined,
+      "selected": undefined,
     }
   }
   accessible={true}
@@ -38,7 +42,11 @@ exports[`Audio block renders audio block error state without crashing 1`] = `
     <View
       accessibilityState={
         {
+          "busy": undefined,
+          "checked": undefined,
           "disabled": true,
+          "expanded": undefined,
+          "selected": undefined,
         }
       }
       accessible={true}
@@ -126,6 +134,15 @@ exports[`Audio block renders audio block error state without crashing 1`] = `
         }
       >
         <RCTAztecView
+          accessibilityState={
+            {
+              "busy": undefined,
+              "checked": undefined,
+              "disabled": undefined,
+              "expanded": undefined,
+              "selected": undefined,
+            }
+          }
           accessible={true}
           activeFormats={[]}
           blockType={
@@ -189,7 +206,11 @@ exports[`Audio block renders audio file without crashing 1`] = `
 <View
   accessibilityState={
     {
+      "busy": undefined,
+      "checked": undefined,
       "disabled": true,
+      "expanded": undefined,
+      "selected": undefined,
     }
   }
   accessible={true}
@@ -223,7 +244,11 @@ exports[`Audio block renders audio file without crashing 1`] = `
     <View
       accessibilityState={
         {
+          "busy": undefined,
+          "checked": undefined,
           "disabled": true,
+          "expanded": undefined,
+          "selected": undefined,
         }
       }
       accessible={true}
@@ -274,6 +299,15 @@ exports[`Audio block renders audio file without crashing 1`] = `
         accessibilityHint="Double tap to listen the audio file"
         accessibilityLabel="Audio Player"
         accessibilityRole="button"
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": undefined,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
         accessible={true}
         focusable={true}
         onClick={[Function]}
@@ -326,6 +360,15 @@ exports[`Audio block renders audio file without crashing 1`] = `
         }
       >
         <RCTAztecView
+          accessibilityState={
+            {
+              "busy": undefined,
+              "checked": undefined,
+              "disabled": undefined,
+              "expanded": undefined,
+              "selected": undefined,
+            }
+          }
           accessible={true}
           activeFormats={[]}
           blockType={
@@ -440,6 +483,23 @@ exports[`Audio block renders placeholder without crashing 1`] = `
         accessibilityHint="Double tap to select an audio file"
         accessibilityLabel="Audio block. Empty"
         accessibilityRole="button"
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": undefined,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
+        accessibilityValue={
+          {
+            "max": undefined,
+            "min": undefined,
+            "now": undefined,
+            "text": undefined,
+          }
+        }
         accessible={true}
         collapsable={false}
         focusable={true}

package/src/avatar/block.json

@@ -48,6 +48,9 @@
 			"__experimentalDuotone": "img"
 		}
 	},
+	"selectors": {
+		"border": ".wp-block-avatar img"
+	},
 	"editorStyle": "wp-block-avatar-editor",
 	"style": "wp-block-avatar"
 }

package/src/block/edit.js

@@ -1,7 +1,6 @@
 /**
  * WordPress dependencies
  */
-import { useDispatch, useSelect } from '@wordpress/data';
 import {
 	useEntityBlockEditor,
 	useEntityProp,
@@ -10,8 +9,6 @@ import {
 import {
 	Placeholder,
 	Spinner,
-	ToolbarGroup,
-	ToolbarButton,
 	TextControl,
 	PanelBody,
 } from '@wordpress/components';
@@ -21,16 +18,12 @@ import {
 	__experimentalRecursionProvider as RecursionProvider,
 	__experimentalUseHasRecursion as useHasRecursion,
 	InnerBlocks,
-	BlockControls,
 	InspectorControls,
 	useBlockProps,
 	Warning,
-	store as blockEditorStore,
 } from '@wordpress/block-editor';
-import { store as reusableBlocksStore } from '@wordpress/reusable-blocks';
-import { ungroup } from '@wordpress/icons';
 
-export default function ReusableBlockEdit( { attributes: { ref }, clientId } ) {
+export default function ReusableBlockEdit( { attributes: { ref } } ) {
 	const hasAlreadyRendered = useHasRecursion( ref );
 	const { record, hasResolved } = useEntityRecord(
 		'postType',
@@ -39,21 +32,6 @@ export default function ReusableBlockEdit( { attributes: { ref }, clientId } ) {
 	);
 	const isMissing = hasResolved && ! record;
 
-	const { canRemove, innerBlockCount } = useSelect(
-		( select ) => {
-			const { canRemoveBlock, getBlockCount } =
-				select( blockEditorStore );
-			return {
-				canRemove: canRemoveBlock( clientId ),
-				innerBlockCount: getBlockCount( clientId ),
-			};
-		},
-		[ clientId ]
-	);
-
-	const { __experimentalConvertBlockToStatic: convertBlockToStatic } =
-		useDispatch( reusableBlocksStore );
-
 	const [ blocks, onInput, onChange ] = useEntityBlockEditor(
 		'postType',
 		'wp_block',
@@ -112,22 +90,6 @@ export default function ReusableBlockEdit( { attributes: { ref }, clientId } ) {
 
 	return (
 		<RecursionProvider uniqueId={ ref }>
-			{ canRemove && (
-				<BlockControls>
-					<ToolbarGroup>
-						<ToolbarButton
-							onClick={ () => convertBlockToStatic( clientId ) }
-							label={
-								innerBlockCount > 1
-									? __( 'Detach patterns' )
-									: __( 'Detach pattern' )
-							}
-							icon={ ungroup }
-							showTooltip
-						/>
-					</ToolbarGroup>
-				</BlockControls>
-			) }
 			<InspectorControls>
 				<PanelBody>
 					<TextControl

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

@@ -324,6 +324,10 @@ describe( 'Buttons block', () => {
 
 			// Tap one color
 			fireEvent.press( screen.getByLabelText( 'Pale pink' ) );
+			// TODO(jest-console): Fix the warning and remove the expect below.
+			expect( console ).toHaveWarnedWith(
+				`Non-serializable values were found in the navigation state. Check:\n\nColor > params.onColorChange (Function)\n\nThis can break usage such as persisting and restoring state. This might happen if you passed non-serializable values such as function, class instances etc. in params. If you need to use components with callbacks in your options, you can use 'navigation.setOptions' instead. See https://reactnavigation.org/docs/troubleshooting#i-get-the-warning-non-serializable-values-were-found-in-the-navigation-state for more details.`
+			);
 
 			// Dismiss the Block Settings modal.
 			fireEvent( blockSettingsModal, 'backdropPress' );

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

@@ -2,6 +2,7 @@
  * External dependencies
  */
 import {
+	act,
 	addBlock,
 	fireEvent,
 	getEditorHtml,
@@ -290,6 +291,10 @@ describe( 'Columns block', () => {
 		// Get the first column
 		const firstColumnBlock = await getBlock( screen, 'Column' );
 		fireEvent.press( firstColumnBlock );
+		// Inner blocks batch store updates with microtasks.
+		// To avoid `act` warnings, we let queued microtasks to be executed.
+		// Reference: https://t.ly/b95nA
+		await act( async () => {} );
 
 		// Open vertical alignment menu
 		fireEvent.press( verticalAlignmentButton );

package/src/comment-template/index.php

@@ -8,6 +8,8 @@
 /**
  * Function that recursively renders a list of nested comments.
  *
+ * @since 6.3.0 Changed render_block_context priority to `1`.
+ *
  * @global int $comment_depth
  *
  * @param WP_Comment[] $comments        The array of comments.

package/src/cover/block.json

@@ -111,7 +111,8 @@
 			"heading": true,
 			"text": true,
 			"background": false,
-			"__experimentalSkipSerialization": [ "gradients" ]
+			"__experimentalSkipSerialization": [ "gradients" ],
+			"enableContrastChecker": false
 		},
 		"typography": {
 			"fontSize": true,

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

@@ -220,6 +220,10 @@ describe( 'when an image is attached', () => {
 			'52'
 		);
 		fireEvent.press( screen.getByLabelText( 'Apply' ) );
+		// TODO(jest-console): Fix the warning and remove the expect below.
+		expect( console ).toHaveWarnedWith(
+			`Non-serializable values were found in the navigation state. Check:\n\nFocalPoint > params.onFocalPointChange (Function)\n\nThis can break usage such as persisting and restoring state. This might happen if you passed non-serializable values such as function, class instances etc. in params. If you need to use components with callbacks in your options, you can use 'navigation.setOptions' instead. See https://reactnavigation.org/docs/troubleshooting#i-get-the-warning-non-serializable-values-were-found-in-the-navigation-state for more details.`
+		);
 
 		expect( setAttributes ).toHaveBeenCalledWith(
 			expect.objectContaining( {
@@ -377,6 +381,10 @@ describe( 'color settings', () => {
 		// Find the selected color.
 		const colorPaletteButton = await screen.findByTestId( COLOR_PINK );
 		expect( colorPaletteButton ).toBeDefined();
+		// TODO(jest-console): Fix the warning and remove the expect below.
+		expect( console ).toHaveWarnedWith(
+			`Non-serializable values were found in the navigation state. Check:\n\nColor > params.onColorChange (Function)\n\nThis can break usage such as persisting and restoring state. This might happen if you passed non-serializable values such as function, class instances etc. in params. If you need to use components with callbacks in your options, you can use 'navigation.setOptions' instead. See https://reactnavigation.org/docs/troubleshooting#i-get-the-warning-non-serializable-values-were-found-in-the-navigation-state for more details.`
+		);
 
 		// Select another color.
 		const newColorButton = await screen.findByTestId( COLOR_RED );

package/src/embed/test/index.native.js

@@ -898,6 +898,10 @@ describe( 'Embed block', () => {
 
 			// Select create embed option.
 			fireEvent.press( editor.getByText( 'Create embed' ) );
+			expect( console ).toHaveLoggedWith(
+				'Processed HTML piece:\n\n',
+				`<p>${ expectedURL }</p>`
+			);
 
 			// Get the created embed block.
 			const [ embedBlock ] = await editor.findAllByLabelText(
@@ -942,6 +946,10 @@ describe( 'Embed block', () => {
 
 			// Select create link option.
 			fireEvent.press( editor.getByText( 'Create link' ) );
+			expect( console ).toHaveLoggedWith(
+				'Processed HTML piece:\n\n',
+				`<p>${ expectedURL }</p>`
+			);
 
 			// Get the link text.
 			const linkText = await editor.findByDisplayValue(

package/src/file/index.php

@@ -24,7 +24,7 @@ if ( gutenberg_should_block_use_interactivity_api( 'core/file' ) ) {
 }
 
 /**
- * When the `core/file` block is rendering, check if we need to enqueue the `'wp-block-file-view` script.
+ * When the `core/file` block is rendering, check if we need to enqueue the `wp-block-file-view` script.
  *
  * @param array    $attributes The block attributes.
  * @param string   $content    The block content.

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

@@ -22,7 +22,11 @@ exports[`File block renders file error state without crashing 1`] = `
   <View
     accessibilityState={
       {
+        "busy": undefined,
+        "checked": undefined,
         "disabled": false,
+        "expanded": undefined,
+        "selected": undefined,
       }
     }
     accessible={false}
@@ -61,6 +65,15 @@ exports[`File block renders file error state without crashing 1`] = `
         }
       >
         <RCTAztecView
+          accessibilityState={
+            {
+              "busy": undefined,
+              "checked": undefined,
+              "disabled": undefined,
+              "expanded": undefined,
+              "selected": undefined,
+            }
+          }
           accessible={true}
           activeFormats={[]}
           blockType={
@@ -167,6 +180,15 @@ exports[`File block renders file error state without crashing 1`] = `
         }
       >
         <RCTAztecView
+          accessibilityState={
+            {
+              "busy": undefined,
+              "checked": undefined,
+              "disabled": undefined,
+              "expanded": undefined,
+              "selected": undefined,
+            }
+          }
           accessible={true}
           activeFormats={[]}
           blockType={
@@ -251,7 +273,11 @@ exports[`File block renders file without crashing 1`] = `
   <View
     accessibilityState={
       {
+        "busy": undefined,
+        "checked": undefined,
         "disabled": false,
+        "expanded": undefined,
+        "selected": undefined,
       }
     }
     accessible={false}
@@ -290,6 +316,15 @@ exports[`File block renders file without crashing 1`] = `
         }
       >
         <RCTAztecView
+          accessibilityState={
+            {
+              "busy": undefined,
+              "checked": undefined,
+              "disabled": undefined,
+              "expanded": undefined,
+              "selected": undefined,
+            }
+          }
           accessible={true}
           activeFormats={[]}
           blockType={
@@ -370,6 +405,15 @@ exports[`File block renders file without crashing 1`] = `
         }
       >
         <RCTAztecView
+          accessibilityState={
+            {
+              "busy": undefined,
+              "checked": undefined,
+              "disabled": undefined,
+              "expanded": undefined,
+              "selected": undefined,
+            }
+          }
           accessible={true}
           activeFormats={[]}
           blockType={
@@ -486,6 +530,23 @@ exports[`File block renders placeholder without crashing 1`] = `
       accessibilityHint="Double tap to select"
       accessibilityLabel="File block. Empty"
       accessibilityRole="button"
+      accessibilityState={
+        {
+          "busy": undefined,
+          "checked": undefined,
+          "disabled": undefined,
+          "expanded": undefined,
+          "selected": undefined,
+        }
+      }
+      accessibilityValue={
+        {
+          "max": undefined,
+          "min": undefined,
+          "now": undefined,
+          "text": undefined,
+        }
+      }
       accessible={true}
       collapsable={false}
       focusable={true}

package/src/footnotes/block.json

@@ -9,9 +9,52 @@
 	"textdomain": "default",
 	"usesContext": [ "postId", "postType" ],
 	"supports": {
+		"__experimentalBorder": {
+			"radius": true,
+			"color": true,
+			"width": true,
+			"style": true,
+			"__experimentalDefaultControls": {
+				"radius": false,
+				"color": false,
+				"width": false,
+				"style": false
+			}
+		},
+		"color": {
+			"background": true,
+			"link": true,
+			"text": true,
+			"__experimentalDefaultControls": {
+				"link": true,
+				"text": true
+			}
+		},
 		"html": false,
 		"multiple": false,
-		"reusable": false
+		"reusable": false,
+		"spacing": {
+			"margin": true,
+			"padding": true,
+			"__experimentalDefaultControls": {
+				"margin": false,
+				"padding": false
+			}
+		},
+		"typography": {
+			"fontSize": true,
+			"lineHeight": true,
+			"__experimentalFontFamily": true,
+			"__experimentalTextDecoration": true,
+			"__experimentalFontStyle": true,
+			"__experimentalFontWeight": true,
+			"__experimentalLetterSpacing": true,
+			"__experimentalTextTransform": true,
+			"__experimentalWritingMode": true,
+			"__experimentalDefaultControls": {
+				"fontSize": true
+			}
+		}
 	},
 	"style": "wp-block-footnotes"
 }

package/src/footnotes/edit.js

@@ -17,6 +17,18 @@ export default function FootnotesEdit( { context: { postType, postId } } ) {
 	const footnotes = meta?.footnotes ? JSON.parse( meta.footnotes ) : [];
 	const blockProps = useBlockProps();
 
+	if ( postType !== 'post' && postType !== 'page' ) {
+		return (
+			<div { ...blockProps }>
+				<Placeholder
+					icon={ <BlockIcon icon={ icon } /> }
+					label={ __( 'Footnotes' ) }
+					// To do: add instructions. We can't add new string in RC.
+				/>
+			</div>
+		);
+	}
+
 	if ( ! footnotes.length ) {
 		return (
 			<div { ...blockProps }>