@wordpress/block-library 9.15.0 → 9.16.0

package/src/site-logo/editor.scss

@@ -108,17 +108,16 @@
 	}
 }
 
-.block-library-site-logo__inspector-upload-container {
+.block-library-site-logo__inspector-media-replace-container {
+	// Ensure the dropzone is positioned to the size of the item.
 	position: relative;
+
 	// Since there is no option to skip rendering the drag'n'drop icon in drop
 	// zone, we hide it for now.
 	.components-drop-zone__content-icon {
 		display: none;
 	}
-}
 
-.block-library-site-logo__inspector-upload-container,
-.block-library-site-logo__inspector-media-replace-container {
 	button.components-button {
 		color: $gray-900;
 		box-shadow: inset 0 0 0 1px $gray-400;
@@ -144,9 +143,7 @@
 		text-align: start;
 		text-align-last: center;
 	}
-}
 
-.block-library-site-logo__inspector-media-replace-container {
 	.components-dropdown {
 		display: block;
 	}

package/src/social-link/index.php

@@ -42,9 +42,9 @@ function render_block_core_social_link( $attributes, $content, $block ) {
 
 	/**
 	 * Prepend URL with https:// if it doesn't appear to contain a scheme
-	 * and it's not a relative link starting with //.
+	 * and it's not a relative link or a fragment.
 	 */
-	if ( ! parse_url( $url, PHP_URL_SCHEME ) && ! str_starts_with( $url, '//' ) ) {
+	if ( ! parse_url( $url, PHP_URL_SCHEME ) && ! str_starts_with( $url, '//' ) && ! str_starts_with( $url, '#' ) ) {
 		$url = 'https://' . $url;
 	}
 

package/src/social-links/edit.js

@@ -269,6 +269,7 @@ export function SocialLinksEdit( props ) {
 										isShownByDefault: true,
 										resetAllFilter,
 										enableAlpha: true,
+										clearable: true,
 									},
 								] }
 								panelId={ clientId }

package/src/social-links/style.scss

@@ -70,8 +70,9 @@
 .wp-block-social-link {
 	display: block;
 	border-radius: 9999px; // This makes it pill-shaped instead of oval, in cases where the image fed is not perfectly sized.
-	transition: transform 0.1s ease;
-	@include reduce-motion("transition");
+	@media not (prefers-reduced-motion) {
+		transition: transform 0.1s ease;
+	}
 
 	// Dimensions.
 	height: auto;
@@ -80,7 +81,6 @@
 		align-items: center;
 		display: flex;
 		line-height: 0;
-		transition: transform 0.1s ease;
 	}
 
 	&:hover {

package/src/table-of-contents/edit.js

@@ -10,11 +10,12 @@ import {
 } from '@wordpress/block-editor';
 import { createBlock } from '@wordpress/blocks';
 import {
-	PanelBody,
 	Placeholder,
 	ToggleControl,
 	ToolbarButton,
 	ToolbarGroup,
+	__experimentalToolsPanel as ToolsPanel,
+	__experimentalToolsPanelItem as ToolsPanelItem,
 } from '@wordpress/components';
 import { useDispatch, useSelect } from '@wordpress/data';
 import { renderToString } from '@wordpress/element';
@@ -29,6 +30,7 @@ import { tableOfContents as icon } from '@wordpress/icons';
 import TableOfContentsList from './list';
 import { linearToNestedHeadingList } from './utils';
 import { useObserveHeadings } from './hooks';
+import { useToolsPanelDropdownMenuProps } from '../utils/hooks';
 
 /** @typedef {import('./utils').HeadingData} HeadingData */
 
@@ -79,7 +81,7 @@ export default function TableOfContentsEdit( {
 	);
 
 	const { replaceBlocks } = useDispatch( blockEditorStore );
-
+	const dropdownMenuProps = useToolsPanelDropdownMenuProps();
 	const headingTree = linearToNestedHeadingList( headings );
 
 	const toolbarControls = canInsertList && (
@@ -108,25 +110,42 @@ export default function TableOfContentsEdit( {
 
 	const inspectorControls = (
 		<InspectorControls>
-			<PanelBody title={ __( 'Settings' ) }>
-				<ToggleControl
-					__nextHasNoMarginBottom
+			<ToolsPanel
+				label={ __( 'Settings' ) }
+				resetAll={ () => {
+					setAttributes( {
+						onlyIncludeCurrentPage: false,
+					} );
+				} }
+				dropdownMenuProps={ dropdownMenuProps }
+			>
+				<ToolsPanelItem
+					hasValue={ () => !! onlyIncludeCurrentPage }
 					label={ __( 'Only include current page' ) }
-					checked={ onlyIncludeCurrentPage }
-					onChange={ ( value ) =>
-						setAttributes( { onlyIncludeCurrentPage: value } )
-					}
-					help={
-						onlyIncludeCurrentPage
-							? __(
-									'Only including headings from the current page (if the post is paginated).'
-							  )
-							: __(
-									'Include headings from all pages (if the post is paginated).'
-							  )
+					onDeselect={ () =>
+						setAttributes( { onlyIncludeCurrentPage: false } )
 					}
-				/>
-			</PanelBody>
+					isShownByDefault
+				>
+					<ToggleControl
+						__nextHasNoMarginBottom
+						label={ __( 'Only include current page' ) }
+						checked={ onlyIncludeCurrentPage }
+						onChange={ ( value ) =>
+							setAttributes( { onlyIncludeCurrentPage: value } )
+						}
+						help={
+							onlyIncludeCurrentPage
+								? __(
+										'Only including headings from the current page (if the post is paginated).'
+								  )
+								: __(
+										'Include headings from all pages (if the post is paginated).'
+								  )
+						}
+					/>
+				</ToolsPanelItem>
+			</ToolsPanel>
 		</InspectorControls>
 	);
 

package/src/video/edit.native.js

@@ -72,7 +72,7 @@ class VideoEdit extends Component {
 			this.finishMediaUploadWithFailure.bind( this );
 		this.updateMediaProgress = this.updateMediaProgress.bind( this );
 		this.onVideoPressed = this.onVideoPressed.bind( this );
-		this.onVideoContanerLayout = this.onVideoContanerLayout.bind( this );
+		this.onVideoContainerLayout = this.onVideoContainerLayout.bind( this );
 		this.onFocusCaption = this.onFocusCaption.bind( this );
 	}
 
@@ -179,7 +179,7 @@ class VideoEdit extends Component {
 		}
 	}
 
-	onVideoContanerLayout( event ) {
+	onVideoContainerLayout( event ) {
 		const { width } = event.nativeEvent.layout;
 		const height = width / VIDEO_ASPECT_RATIO;
 		if ( height !== this.state.videoContainerHeight ) {
@@ -321,7 +321,7 @@ class VideoEdit extends Component {
 
 							return (
 								<View
-									onLayout={ this.onVideoContanerLayout }
+									onLayout={ this.onVideoContainerLayout }
 									style={ containerStyle }
 								>
 									{ showVideo && (

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

@@ -15,12 +15,12 @@ const initialHtml = `
 <figure class="wp-block-video"><video controls src="https://i.cloudup.com/YtZFJbuQCE.mov"></video><figcaption class="wp-element-caption">Cloudup video</figcaption></figure>
 <!-- /wp:video -->`;
 
-const tranformsWithInnerBlocks = [ 'Columns', 'Group' ];
+const transformsWithInnerBlocks = [ 'Columns', 'Group' ];
 const nonMediaTransforms = [ 'File' ];
 const blockTransforms = [
 	'Cover',
 	'Media & Text',
-	...tranformsWithInnerBlocks,
+	...transformsWithInnerBlocks,
 	...nonMediaTransforms,
 ];
 
@@ -31,7 +31,8 @@ describe( `${ block } block transforms`, () => {
 		const screen = await initializeEditor( { initialHtml } );
 		const newBlock = await transformBlock( screen, block, blockTransform, {
 			isMediaBlock: ! nonMediaTransforms.includes( blockTransform ),
-			hasInnerBlocks: tranformsWithInnerBlocks.includes( blockTransform ),
+			hasInnerBlocks:
+				transformsWithInnerBlocks.includes( blockTransform ),
 		} );
 		expect( newBlock ).toBeVisible();
 		expect( getEditorHtml() ).toMatchSnapshot();