@wordpress/block-library 9.4.0 → 9.6.0

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

@@ -34,10 +34,13 @@
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
 /**
- * Dimensions.
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
  */
 /**
- * Shadows.
+ * Dimensions.
  */
 /**
  * Editor widths.

package/build-style/verse/style.css

@@ -34,10 +34,13 @@
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
 /**
- * Dimensions.
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
  */
 /**
- * Shadows.
+ * Dimensions.
  */
 /**
  * Editor widths.

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

@@ -34,10 +34,13 @@
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
 /**
- * Dimensions.
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
  */
 /**
- * Shadows.
+ * Dimensions.
  */
 /**
  * Editor widths.
@@ -126,9 +129,6 @@
   margin-right: -9px;
 }
 
-.editor-video-poster-control .components-base-control__label {
-  display: block;
-}
 .editor-video-poster-control .components-button {
   margin-left: 8px;
 }

package/build-style/video/editor.css

@@ -34,10 +34,13 @@
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
 /**
- * Dimensions.
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
  */
 /**
- * Shadows.
+ * Dimensions.
  */
 /**
  * Editor widths.
@@ -126,9 +129,6 @@
   margin-left: -9px;
 }
 
-.editor-video-poster-control .components-base-control__label {
-  display: block;
-}
 .editor-video-poster-control .components-button {
   margin-right: 8px;
 }

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

@@ -34,10 +34,13 @@
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
 /**
- * Dimensions.
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
  */
 /**
- * Shadows.
+ * Dimensions.
  */
 /**
  * Editor widths.

package/build-style/video/style.css

@@ -34,10 +34,13 @@
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
 /**
- * Dimensions.
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
  */
 /**
- * Shadows.
+ * Dimensions.
  */
 /**
  * Editor widths.

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

@@ -34,10 +34,13 @@
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
 /**
- * Dimensions.
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
  */
 /**
- * Shadows.
+ * Dimensions.
  */
 /**
  * Editor widths.

package/build-style/video/theme.css

@@ -34,10 +34,13 @@
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
 /**
- * Dimensions.
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
  */
 /**
- * Shadows.
+ * Dimensions.
  */
 /**
  * Editor widths.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-library",
-	"version": "9.4.0",
+	"version": "9.6.0",
 	"description": "Block library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -32,39 +32,39 @@
 	],
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^4.4.0",
-		"@wordpress/api-fetch": "^7.4.0",
-		"@wordpress/autop": "^4.4.0",
-		"@wordpress/blob": "^4.4.0",
-		"@wordpress/block-editor": "^13.4.0",
-		"@wordpress/blocks": "^13.4.0",
-		"@wordpress/components": "^28.4.0",
-		"@wordpress/compose": "^7.4.0",
-		"@wordpress/core-data": "^7.4.0",
-		"@wordpress/data": "^10.4.0",
-		"@wordpress/date": "^5.4.0",
-		"@wordpress/deprecated": "^4.4.0",
-		"@wordpress/dom": "^4.4.0",
-		"@wordpress/element": "^6.4.0",
-		"@wordpress/escape-html": "^3.4.0",
-		"@wordpress/hooks": "^4.4.0",
-		"@wordpress/html-entities": "^4.4.0",
-		"@wordpress/i18n": "^5.4.0",
-		"@wordpress/icons": "^10.4.0",
-		"@wordpress/interactivity": "^6.4.0",
-		"@wordpress/interactivity-router": "^2.4.0",
-		"@wordpress/keyboard-shortcuts": "^5.4.0",
-		"@wordpress/keycodes": "^4.4.0",
-		"@wordpress/notices": "^5.4.0",
-		"@wordpress/patterns": "^2.4.0",
-		"@wordpress/primitives": "^4.4.0",
-		"@wordpress/private-apis": "^1.4.0",
-		"@wordpress/reusable-blocks": "^5.4.0",
-		"@wordpress/rich-text": "^7.4.0",
-		"@wordpress/server-side-render": "^5.4.0",
-		"@wordpress/url": "^4.4.0",
-		"@wordpress/viewport": "^6.4.0",
-		"@wordpress/wordcount": "^4.4.0",
+		"@wordpress/a11y": "^4.6.0",
+		"@wordpress/api-fetch": "^7.6.0",
+		"@wordpress/autop": "^4.6.0",
+		"@wordpress/blob": "^4.6.0",
+		"@wordpress/block-editor": "^14.1.0",
+		"@wordpress/blocks": "^13.6.0",
+		"@wordpress/components": "^28.6.0",
+		"@wordpress/compose": "^7.6.0",
+		"@wordpress/core-data": "^7.6.0",
+		"@wordpress/data": "^10.6.0",
+		"@wordpress/date": "^5.6.0",
+		"@wordpress/deprecated": "^4.6.0",
+		"@wordpress/dom": "^4.6.0",
+		"@wordpress/element": "^6.6.0",
+		"@wordpress/escape-html": "^3.6.0",
+		"@wordpress/hooks": "^4.6.0",
+		"@wordpress/html-entities": "^4.6.0",
+		"@wordpress/i18n": "^5.6.0",
+		"@wordpress/icons": "^10.6.0",
+		"@wordpress/interactivity": "^6.6.0",
+		"@wordpress/interactivity-router": "^2.6.0",
+		"@wordpress/keyboard-shortcuts": "^5.6.0",
+		"@wordpress/keycodes": "^4.6.0",
+		"@wordpress/notices": "^5.6.0",
+		"@wordpress/patterns": "^2.6.0",
+		"@wordpress/primitives": "^4.6.0",
+		"@wordpress/private-apis": "^1.6.0",
+		"@wordpress/reusable-blocks": "^5.6.0",
+		"@wordpress/rich-text": "^7.6.0",
+		"@wordpress/server-side-render": "^5.6.0",
+		"@wordpress/url": "^4.6.0",
+		"@wordpress/viewport": "^6.6.0",
+		"@wordpress/wordcount": "^4.6.0",
 		"change-case": "^4.1.2",
 		"clsx": "^2.1.1",
 		"colord": "^2.7.0",
@@ -82,5 +82,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "363edb39b8dda8727f652e42cbb8497732693ed2"
+	"gitHead": "ab9564947967bb3f00343130954b9efacba6cdd7"
 }

package/src/archives/edit.js

@@ -51,6 +51,7 @@ export default function ArchivesEdit( { attributes, setAttributes } ) {
 						}
 					/>
 					<SelectControl
+						__next40pxDefaultSize
 						__nextHasNoMarginBottom
 						label={ __( 'Group by:' ) }
 						options={ [

package/src/audio/edit.js

@@ -174,6 +174,7 @@ function AudioEdit( {
 						checked={ loop }
 					/>
 					<SelectControl
+						__next40pxDefaultSize
 						__nextHasNoMarginBottom
 						label={ _x( 'Preload', 'noun; Audio block parameter' ) }
 						value={ preload || '' }
@@ -197,9 +198,9 @@ function AudioEdit( {
 			</InspectorControls>
 			<figure { ...blockProps }>
 				{ /*
-					Disable the audio tag if the block is not selected
-					so the user clicking on it won't play the
-					file or change the position slider when the controls are enabled.
+				Disable the audio tag if the block is not selected
+				so the user clicking on it won't play the
+				file or change the position slider when the controls are enabled.
 				*/ }
 				<Disabled isDisabled={ ! isSingleSelected }>
 					<audio controls="controls" src={ src ?? temporaryURL } />

package/src/avatar/edit.js

@@ -58,6 +58,7 @@ const AvatarInspectorControls = ( {
 			/>
 			{ attributes.isLink && (
 				<ToggleControl
+					__nextHasNoMarginBottom
 					label={ __( 'Open in new tab' ) }
 					onChange={ ( value ) =>
 						setAttributes( {

package/src/avatar/user-control.js

@@ -33,6 +33,7 @@ function UserControl( { value, onChange } ) {
 
 	return (
 		<ComboboxControl
+			__next40pxDefaultSize
 			__nextHasNoMarginBottom
 			label={ __( 'User' ) }
 			help={ __(

package/src/button/edit.js

@@ -380,6 +380,7 @@ function ButtonEdit( props ) {
 			<InspectorControls group="advanced">
 				{ isLinkTag && (
 					<TextControl
+						__next40pxDefaultSize
 						__nextHasNoMarginBottom
 						label={ __( 'Link rel' ) }
 						value={ rel || '' }

package/src/button/index.php

@@ -17,20 +17,7 @@
  * @return string The block content.
  */
 function render_block_core_button( $attributes, $content ) {
-	/*
-	 * The current Gutenberg plugin supports WordPress 6.4, but the next_token()
-	 * method does not exist in WordPress 6.4. Therefore, if Gutenberg is used
-	 * as a plugin, use the Gutenberg class that has the `next_token()` method.
-	 *
-	 * TODO: After the Gutenberg plugin drops support for WordPress 6.4, this
-	 * conditional statement will be removed and the core class `WP_HTML_Tag_Processor`
-	 * should be used.
-	 */
-	if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN && class_exists( 'Gutenberg_HTML_Tag_Processor_6_7' ) ) {
-		$p = new Gutenberg_HTML_Tag_Processor_6_7( $content );
-	} else {
-		$p = new WP_HTML_Tag_Processor( $content );
-	}
+	$p = new WP_HTML_Tag_Processor( $content );
 
 	/*
 	 * The button block can render an `<a>` or `<button>` and also has a

package/src/categories/block.json

@@ -62,6 +62,18 @@
 		},
 		"interactivity": {
 			"clientNavigation": true
+		},
+		"__experimentalBorder": {
+			"radius": true,
+			"color": true,
+			"width": true,
+			"style": true,
+			"__experimentalDefaultControls": {
+				"radius": true,
+				"color": true,
+				"width": true,
+				"style": true
+			}
 		}
 	},
 	"editorStyle": "wp-block-categories-editor",

package/src/column/block.json

@@ -48,10 +48,12 @@
 		},
 		"__experimentalBorder": {
 			"color": true,
+			"radius": true,
 			"style": true,
 			"width": true,
 			"__experimentalDefaultControls": {
 				"color": true,
+				"radius": true,
 				"style": true,
 				"width": true
 			}

package/src/column/edit.js

@@ -33,8 +33,8 @@ function ColumnInspectorControls( { width, setAttributes } ) {
 		<PanelBody title={ __( 'Settings' ) }>
 			<UnitControl
 				label={ __( 'Width' ) }
-				labelPosition="edge"
-				__unstableInputWidth="80px"
+				__unstableInputWidth="calc(50% - 8px)"
+				__next40pxDefaultSize
 				value={ width || '' }
 				onChange={ ( nextWidth ) => {
 					nextWidth = 0 > parseFloat( nextWidth ) ? '0' : nextWidth;

package/src/comment-author-name/block.json

@@ -51,6 +51,19 @@
 		},
 		"interactivity": {
 			"clientNavigation": true
+		},
+		"__experimentalBorder": {
+			"radius": true,
+			"color": true,
+			"width": true,
+			"style": true,
+			"__experimentalDefaultControls": {
+				"radius": true,
+				"color": true,
+				"width": true,
+				"style": true
+			}
 		}
-	}
+	},
+	"style": "wp-block-comment-author-name"
 }

package/src/comment-author-name/style.scss

@@ -0,0 +1,4 @@
+.wp-block-comment-author-name {
+	// This block has customizable padding, border-box makes that more predictable.
+	box-sizing: border-box;
+}

package/src/comment-content/block.json

@@ -35,6 +35,18 @@
 				"fontSize": true
 			}
 		},
+		"__experimentalBorder": {
+			"radius": true,
+			"color": true,
+			"width": true,
+			"style": true,
+			"__experimentalDefaultControls": {
+				"radius": true,
+				"color": true,
+				"width": true,
+				"style": true
+			}
+		},
 		"spacing": {
 			"padding": [ "horizontal", "vertical" ],
 			"__experimentalDefaultControls": {
@@ -42,5 +54,6 @@
 			}
 		},
 		"html": false
-	}
+	},
+	"style": "wp-block-comment-content"
 }

package/src/comment-content/style.scss

@@ -3,3 +3,8 @@
 	font-size: 0.875em;
 	line-height: 1.5;
 }
+
+.wp-block-comment-content {
+	// This block has customizable padding, border-box makes that more predictable.
+	box-sizing: border-box;
+}

package/src/comment-date/block.json

@@ -47,6 +47,19 @@
 		},
 		"interactivity": {
 			"clientNavigation": true
+		},
+		"__experimentalBorder": {
+			"radius": true,
+			"color": true,
+			"width": true,
+			"style": true,
+			"__experimentalDefaultControls": {
+				"radius": true,
+				"color": true,
+				"width": true,
+				"style": true
+			}
 		}
-	}
+	},
+	"style": "wp-block-comment-date"
 }

package/src/comment-date/style.scss

@@ -0,0 +1,4 @@
+.wp-block-comment-date {
+	// This block has customizable padding, border-box makes that more predictable.
+	box-sizing: border-box;
+}

package/src/comment-template/block.json

@@ -31,6 +31,18 @@
 		},
 		"interactivity": {
 			"clientNavigation": true
+		},
+		"__experimentalBorder": {
+			"radius": true,
+			"color": true,
+			"width": true,
+			"style": true,
+			"__experimentalDefaultControls": {
+				"radius": true,
+				"color": true,
+				"width": true,
+				"style": true
+			}
 		}
 	},
 	"style": "wp-block-comment-template"

package/src/comments-pagination/comments-pagination-arrow-controls.js

@@ -10,6 +10,7 @@ import {
 export function CommentsPaginationArrowControls( { value, onChange } ) {
 	return (
 		<ToggleGroupControl
+			__next40pxDefaultSize
 			__nextHasNoMarginBottom
 			label={ __( 'Arrow' ) }
 			value={ value }

package/src/comments-title/block.json

@@ -23,6 +23,9 @@
 		"level": {
 			"type": "number",
 			"default": 2
+		},
+		"levelOptions": {
+			"type": "array"
 		}
 	},
 	"supports": {

package/src/comments-title/edit.js

@@ -23,7 +23,13 @@ import apiFetch from '@wordpress/api-fetch';
 import { addQueryArgs } from '@wordpress/url';
 
 export default function Edit( {
-	attributes: { textAlign, showPostTitle, showCommentsCount, level },
+	attributes: {
+		textAlign,
+		showPostTitle,
+		showCommentsCount,
+		level,
+		levelOptions,
+	},
 	setAttributes,
 	context: { postType, postId },
 } ) {
@@ -95,6 +101,7 @@ export default function Edit( {
 			/>
 			<HeadingLevelDropdown
 				value={ level }
+				options={ levelOptions }
 				onChange={ ( newLevel ) =>
 					setAttributes( { level: newLevel } )
 				}

package/src/cover/edit/inspector-controls.js

@@ -188,7 +188,6 @@ export default function CoverInspectorControls( {
 						{ showFocalPointPicker && (
 							<FocalPointPicker
 								__nextHasNoMarginBottom
-								__next40pxDefaultSize
 								label={ __( 'Focal point' ) }
 								url={ url }
 								value={ focalPoint }

package/src/details/edit.js

@@ -48,6 +48,7 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) {
 			<InspectorControls>
 				<PanelBody title={ __( 'Settings' ) }>
 					<ToggleControl
+						__nextHasNoMarginBottom
 						label={ __( 'Open by default' ) }
 						checked={ showContent }
 						onChange={ () =>

package/src/editor.scss

@@ -31,6 +31,7 @@
 @import "./nextpage/editor.scss";
 @import "./page-list/editor.scss";
 @import "./paragraph/editor.scss";
+@import "./post-author/editor.scss";
 @import "./post-excerpt/editor.scss";
 @import "./pullquote/editor.scss";
 @import "./rss/editor.scss";
@@ -44,6 +45,7 @@
 @import "./social-links/editor.scss";
 @import "./spacer/editor.scss";
 @import "./table/editor.scss";
+@import "./tag-cloud/editor.scss";
 @import "./template-part/editor.scss";
 @import "./text-columns/editor.scss";
 @import "./video/editor.scss";

package/src/embed/edit.js

@@ -14,6 +14,7 @@ import { embedContentIcon } from './icons';
 import EmbedLoading from './embed-loading';
 import EmbedPlaceholder from './embed-placeholder';
 import EmbedPreview from './embed-preview';
+import { Caption } from '../utils/caption';
 
 /**
  * External dependencies
@@ -225,7 +226,7 @@ const EmbedEdit = ( props ) => {
 					} }
 					value={ url }
 					cannotEmbed={ cannotEmbed }
-					onChange={ ( event ) => setURL( event.target.value ) }
+					onChange={ ( value ) => setURL( value ) }
 					fallback={ () => fallback( url, onReplace ) }
 					tryAgain={ () => {
 						invalidateResolution( 'getEmbedPreview', [ url ] );
@@ -277,6 +278,14 @@ const EmbedEdit = ( props ) => {
 					label={ label }
 					insertBlocksAfter={ insertBlocksAfter }
 				/>
+				<Caption
+					attributes={ attributes }
+					setAttributes={ setAttributes }
+					isSelected={ isSelected }
+					insertBlocksAfter={ insertBlocksAfter }
+					label={ __( 'Embed caption text' ) }
+					showToolbarButton={ isSelected }
+				/>
 			</View>
 		</>
 	);

package/src/embed/editor.scss

@@ -12,6 +12,10 @@
 		justify-content: center;
 	}
 
+	.wp-block-embed__placeholder-input {
+		flex: 1 1 auto;
+	}
+
 	// Stops long URLs from breaking out of the no preview available screen
 	.components-placeholder__error {
 		word-break: break-word;

package/src/embed/embed-placeholder.js

@@ -8,6 +8,7 @@ import {
 	ExternalLink,
 	__experimentalHStack as HStack,
 	__experimentalVStack as VStack,
+	__experimentalInputControl as InputControl,
 } from '@wordpress/components';
 import { BlockIcon } from '@wordpress/block-editor';
 
@@ -31,15 +32,17 @@ const EmbedPlaceholder = ( {
 			) }
 		>
 			<form onSubmit={ onSubmit }>
-				<input
+				<InputControl
+					__next40pxDefaultSize
 					type="url"
 					value={ value || '' }
-					className="components-placeholder__input"
-					aria-label={ label }
+					className="wp-block-embed__placeholder-input"
+					label={ label }
+					hideLabelFromVision
 					placeholder={ __( 'Enter URL to embed here…' ) }
 					onChange={ onChange }
 				/>
-				<Button variant="primary" type="submit">
+				<Button __next40pxDefaultSize variant="primary" type="submit">
 					{ _x( 'Embed', 'button label' ) }
 				</Button>
 			</form>