@wordpress/block-library 8.14.0 → 8.16.0

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

@@ -20,6 +20,15 @@ exports[`Search Block renders block with button inside option 1`] = `
       }
     >
       <RCTAztecView
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": undefined,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
         accessible={true}
         activeFormats={[]}
         blockType={
@@ -52,6 +61,7 @@ exports[`Search Block renders block with button inside option 1`] = `
         onStartShouldSetResponder={[Function]}
         placeholder="Add label…"
         placeholderTextColor="gray"
+        selectionColor="black"
         style={
           {
             "backgroundColor": undefined,
@@ -135,6 +145,15 @@ exports[`Search Block renders block with button inside option 1`] = `
           }
         >
           <RCTAztecView
+            accessibilityState={
+              {
+                "busy": undefined,
+                "checked": undefined,
+                "disabled": undefined,
+                "expanded": undefined,
+                "selected": undefined,
+              }
+            }
             accessible={true}
             activeFormats={[]}
             blockType={
@@ -168,6 +187,7 @@ exports[`Search Block renders block with button inside option 1`] = `
             onStartShouldSetResponder={[Function]}
             placeholder=""
             placeholderTextColor="gray"
+            selectionColor="black"
             style={
               {
                 "backgroundColor": undefined,
@@ -214,6 +234,15 @@ exports[`Search Block renders block with icon button option matches snapshot 1`]
       }
     >
       <RCTAztecView
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": undefined,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
         accessible={true}
         activeFormats={[]}
         blockType={
@@ -246,6 +275,7 @@ exports[`Search Block renders block with icon button option matches snapshot 1`]
         onStartShouldSetResponder={[Function]}
         placeholder="Add label…"
         placeholderTextColor="gray"
+        selectionColor="black"
         style={
           {
             "backgroundColor": undefined,
@@ -399,6 +429,15 @@ exports[`Search Block renders block with label hidden matches snapshot 1`] = `
           }
         >
           <RCTAztecView
+            accessibilityState={
+              {
+                "busy": undefined,
+                "checked": undefined,
+                "disabled": undefined,
+                "expanded": undefined,
+                "selected": undefined,
+              }
+            }
             accessible={true}
             activeFormats={[]}
             blockType={
@@ -432,6 +471,7 @@ exports[`Search Block renders block with label hidden matches snapshot 1`] = `
             onStartShouldSetResponder={[Function]}
             placeholder=""
             placeholderTextColor="gray"
+            selectionColor="black"
             style={
               {
                 "backgroundColor": undefined,
@@ -478,6 +518,15 @@ exports[`Search Block renders with default configuration matches snapshot 1`] =
       }
     >
       <RCTAztecView
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": undefined,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
         accessible={true}
         activeFormats={[]}
         blockType={
@@ -510,6 +559,7 @@ exports[`Search Block renders with default configuration matches snapshot 1`] =
         onStartShouldSetResponder={[Function]}
         placeholder="Add label…"
         placeholderTextColor="gray"
+        selectionColor="black"
         style={
           {
             "backgroundColor": undefined,
@@ -593,6 +643,15 @@ exports[`Search Block renders with default configuration matches snapshot 1`] =
           }
         >
           <RCTAztecView
+            accessibilityState={
+              {
+                "busy": undefined,
+                "checked": undefined,
+                "disabled": undefined,
+                "expanded": undefined,
+                "selected": undefined,
+              }
+            }
             accessible={true}
             activeFormats={[]}
             blockType={
@@ -626,6 +685,7 @@ exports[`Search Block renders with default configuration matches snapshot 1`] =
             onStartShouldSetResponder={[Function]}
             placeholder=""
             placeholderTextColor="gray"
+            selectionColor="black"
             style={
               {
                 "backgroundColor": undefined,
@@ -672,6 +732,15 @@ exports[`Search Block renders with no-button option matches snapshot 1`] = `
       }
     >
       <RCTAztecView
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": undefined,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
         accessible={true}
         activeFormats={[]}
         blockType={
@@ -704,6 +773,7 @@ exports[`Search Block renders with no-button option matches snapshot 1`] = `
         onStartShouldSetResponder={[Function]}
         placeholder="Add label…"
         placeholderTextColor="gray"
+        selectionColor="black"
         style={
           {
             "backgroundColor": undefined,

package/src/search/view.js

@@ -1,68 +1,172 @@
-window.addEventListener( 'DOMContentLoaded', () => {
-	const hiddenClass = 'wp-block-search__searchfield-hidden';
-
-	Array.from(
-		document.getElementsByClassName(
-			'wp-block-search__button-behavior-expand'
-		)
-	).forEach( ( block ) => {
-		const searchField = block.querySelector( '.wp-block-search__input' );
-		const searchButton = block.querySelector( '.wp-block-search__button' );
-		const searchLabel = block.querySelector( '.wp-block-search__label' );
-		const ariaLabel = searchButton.getAttribute( 'aria-label' );
-		const id = searchField.getAttribute( 'id' );
-
-		const toggleSearchField = ( showSearchField ) => {
-			if ( showSearchField ) {
-				searchField.removeAttribute( 'aria-hidden' );
-				searchField.removeAttribute( 'tabindex' );
-				searchButton.removeAttribute( 'aria-expanded' );
-				searchButton.removeAttribute( 'aria-controls' );
-				searchButton.setAttribute( 'type', 'submit' );
-				searchButton.setAttribute( 'aria-label', 'Submit Search' );
-
-				return block.classList.remove( hiddenClass );
-			}
-
-			searchButton.removeAttribute( 'type' );
-			searchField.setAttribute( 'aria-hidden', 'true' );
-			searchField.setAttribute( 'tabindex', '-1' );
-			searchButton.setAttribute( 'aria-expanded', 'false' );
-			searchButton.setAttribute( 'aria-controls', id );
-			searchButton.setAttribute( 'aria-label', ariaLabel );
-			return block.classList.add( hiddenClass );
-		};
-
-		const hideSearchField = ( e ) => {
-			if ( ! e.target.closest( '.wp-block-search' ) ) {
-				return toggleSearchField( false );
-			}
-
-			if ( e.key === 'Escape' ) {
-				searchButton.focus();
-				return toggleSearchField( false );
-			}
-		};
-
-		const handleButtonClick = ( e ) => {
-			if ( block.classList.contains( hiddenClass ) ) {
-				e.preventDefault();
-				searchField.focus();
-				toggleSearchField( true );
-			}
-		};
-
-		searchButton.removeAttribute( 'type' );
-		searchField.addEventListener( 'keydown', ( e ) => {
-			hideSearchField( e );
-		} );
-		searchButton.addEventListener( 'click', handleButtonClick );
-		searchButton.addEventListener( 'keydown', ( e ) => {
-			hideSearchField( e );
-		} );
-		if ( searchLabel ) {
-			searchLabel.addEventListener( 'click', handleButtonClick );
-		}
-		document.body.addEventListener( 'click', hideSearchField );
+/*eslint-env browser*/
+
+/** @type {?HTMLFormElement} */
+let expandedSearchBlock = null;
+
+const hiddenClass = 'wp-block-search__searchfield-hidden';
+
+/**
+ * Toggles aria-label with data-toggled-aria-label.
+ *
+ * @param {HTMLElement} element
+ */
+function toggleAriaLabel( element ) {
+	if ( ! ( 'toggledAriaLabel' in element.dataset ) ) {
+		throw new Error( 'Element lacks toggledAriaLabel in dataset.' );
+	}
+
+	const ariaLabel = element.dataset.toggledAriaLabel;
+	element.dataset.toggledAriaLabel = element.ariaLabel;
+	element.ariaLabel = ariaLabel;
+}
+
+/**
+ * Gets search input.
+ *
+ * @param {HTMLFormElement} block Search block.
+ * @return {HTMLInputElement} Search input.
+ */
+function getSearchInput( block ) {
+	return block.querySelector( '.wp-block-search__input' );
+}
+
+/**
+ * Gets search button.
+ *
+ * @param {HTMLFormElement} block Search block.
+ * @return {HTMLButtonElement} Search button.
+ */
+function getSearchButton( block ) {
+	return block.querySelector( '.wp-block-search__button' );
+}
+
+/**
+ * Handles keydown event to collapse an expanded Search block (when pressing Escape key).
+ *
+ * @param {KeyboardEvent} event
+ */
+function handleKeydownEvent( event ) {
+	if ( ! expandedSearchBlock ) {
+		// In case the event listener wasn't removed in time.
+		return;
+	}
+
+	if ( event.key === 'Escape' ) {
+		const block = expandedSearchBlock; // This is nullified by collapseExpandedSearchBlock().
+		collapseExpandedSearchBlock();
+		getSearchButton( block ).focus();
+	}
+}
+
+/**
+ * Handles keyup event to collapse an expanded Search block (e.g. when tabbing out of expanded Search block).
+ *
+ * @param {KeyboardEvent} event
+ */
+function handleKeyupEvent( event ) {
+	if ( ! expandedSearchBlock ) {
+		// In case the event listener wasn't removed in time.
+		return;
+	}
+
+	if ( event.target.closest( '.wp-block-search' ) !== expandedSearchBlock ) {
+		collapseExpandedSearchBlock();
+	}
+}
+
+/**
+ * Expands search block.
+ *
+ * Inverse of what is done in collapseExpandedSearchBlock().
+ *
+ * @param {HTMLFormElement} block Search block.
+ */
+function expandSearchBlock( block ) {
+	// Make sure only one is open at a time.
+	if ( expandedSearchBlock ) {
+		collapseExpandedSearchBlock();
+	}
+
+	const searchField = getSearchInput( block );
+	const searchButton = getSearchButton( block );
+
+	searchButton.type = 'submit';
+	searchField.ariaHidden = 'false';
+	searchField.tabIndex = 0;
+	searchButton.ariaExpanded = 'true';
+	searchButton.removeAttribute( 'aria-controls' ); // Note: Seemingly not reflected with searchButton.ariaControls.
+	toggleAriaLabel( searchButton );
+	block.classList.remove( hiddenClass );
+
+	searchField.focus(); // Note that Chrome seems to do this automatically.
+
+	// The following two must be inverse of what is done in collapseExpandedSearchBlock().
+	document.addEventListener( 'keydown', handleKeydownEvent, {
+		passive: true,
+	} );
+	document.addEventListener( 'keyup', handleKeyupEvent, {
+		passive: true,
+	} );
+
+	expandedSearchBlock = block;
+}
+
+/**
+ * Collapses the expanded search block.
+ *
+ * Inverse of what is done in expandSearchBlock().
+ */
+function collapseExpandedSearchBlock() {
+	if ( ! expandedSearchBlock ) {
+		throw new Error( 'Expected expandedSearchBlock to be defined.' );
+	}
+	const block = expandedSearchBlock;
+	const searchField = getSearchInput( block );
+	const searchButton = getSearchButton( block );
+
+	searchButton.type = 'button';
+	searchField.ariaHidden = 'true';
+	searchField.tabIndex = -1;
+	searchButton.ariaExpanded = 'false';
+	searchButton.setAttribute( 'aria-controls', searchField.id ); // Note: Seemingly not reflected with searchButton.ariaControls.
+	toggleAriaLabel( searchButton );
+	block.classList.add( hiddenClass );
+
+	// The following two must be inverse of what is done in expandSearchBlock().
+	document.removeEventListener( 'keydown', handleKeydownEvent, {
+		passive: true,
 	} );
-} );
+	document.removeEventListener( 'keyup', handleKeyupEvent, {
+		passive: true,
+	} );
+
+	expandedSearchBlock = null;
+}
+
+// Listen for click events anywhere on the document so this script can be loaded asynchronously in the head.
+document.addEventListener(
+	'click',
+	( event ) => {
+		// Get the ancestor expandable Search block of the clicked element.
+		const block = event.target.closest(
+			'.wp-block-search__button-behavior-expand'
+		);
+
+		/*
+		 * If there is already an expanded search block and either the current click was not for a Search block or it was
+		 * for another block, then collapse the currently-expanded block.
+		 */
+		if ( expandedSearchBlock && block !== expandedSearchBlock ) {
+			collapseExpandedSearchBlock();
+		}
+
+		// If the click was on or inside a collapsed Search block, expand it.
+		if (
+			block instanceof HTMLFormElement &&
+			block.classList.contains( hiddenClass )
+		) {
+			expandSearchBlock( block );
+		}
+	},
+	{ passive: true }
+);

package/src/site-logo/edit.js

@@ -293,6 +293,7 @@ const SiteLogo = ( {
 				<PanelBody title={ __( 'Settings' ) }>
 					<RangeControl
 						__nextHasNoMarginBottom
+						__next40pxDefaultSize
 						label={ __( 'Image width' ) }
 						onChange={ ( newWidth ) =>
 							setAttributes( { width: newWidth } )

package/src/social-link/icons/index.js

@@ -31,6 +31,7 @@ export * from './snapchat';
 export * from './soundcloud';
 export * from './spotify';
 export * from './telegram';
+export * from './threads';
 export * from './tiktok';
 export * from './tumblr';
 export * from './twitch';

package/src/social-link/icons/threads.js

@@ -0,0 +1,10 @@
+/**
+ * WordPress dependencies
+ */
+import { Path, SVG } from '@wordpress/primitives';
+
+export const ThreadsIcon = () => (
+	<SVG width="24" height="24" viewBox="0 0 24 24" version="1.1">
+		<Path d="M16.3 11.3c-.1 0-.2-.1-.2-.1-.1-2.6-1.5-4-3.9-4-1.4 0-2.6.6-3.3 1.7l1.3.9c.5-.8 1.4-1 2-1 .8 0 1.4.2 1.7.7.3.3.5.8.5 1.3-.7-.1-1.4-.2-2.2-.1-2.2.1-3.7 1.4-3.6 3.2 0 .9.5 1.7 1.3 2.2.7.4 1.5.6 2.4.6 1.2-.1 2.1-.5 2.7-1.3.5-.6.8-1.4.9-2.4.6.3 1 .8 1.2 1.3.4.9.4 2.4-.8 3.6-1.1 1.1-2.3 1.5-4.3 1.5-2.1 0-3.8-.7-4.8-2S5.7 14.3 5.7 12c0-2.3.5-4.1 1.5-5.4 1.1-1.3 2.7-2 4.8-2 2.2 0 3.8.7 4.9 2 .5.7.9 1.5 1.2 2.5l1.5-.4c-.3-1.2-.8-2.2-1.5-3.1-1.3-1.7-3.3-2.6-6-2.6-2.6 0-4.7.9-6 2.6C4.9 7.2 4.3 9.3 4.3 12s.6 4.8 1.9 6.4c1.4 1.7 3.4 2.6 6 2.6 2.3 0 4-.6 5.3-2 1.8-1.8 1.7-4 1.1-5.4-.4-.9-1.2-1.7-2.3-2.3zm-4 3.8c-1 .1-2-.4-2-1.3 0-.7.5-1.5 2.1-1.6h.5c.6 0 1.1.1 1.6.2-.2 2.3-1.3 2.7-2.2 2.7z" />
+	</SVG>
+);

package/src/social-link/index.php

@@ -258,6 +258,10 @@ function block_core_social_link_services( $service = '', $field = '' ) {
 			'name' => 'Telegram',
 			'icon' => '<svg width="24" height="24" viewBox="0 0 128 128" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M28.9700376,63.3244248 C47.6273373,55.1957357 60.0684594,49.8368063 66.2934036,47.2476366 C84.0668845,39.855031 87.7600616,38.5708563 90.1672227,38.528 C90.6966555,38.5191258 91.8804274,38.6503351 92.6472251,39.2725385 C93.294694,39.7979149 93.4728387,40.5076237 93.5580865,41.0057381 C93.6433345,41.5038525 93.7494885,42.63857 93.6651041,43.5252052 C92.7019529,53.6451182 88.5344133,78.2034783 86.4142057,89.5379542 C85.5170662,94.3339958 83.750571,95.9420841 82.0403991,96.0994568 C78.3237996,96.4414641 75.5015827,93.6432685 71.9018743,91.2836143 C66.2690414,87.5912212 63.0868492,85.2926952 57.6192095,81.6896017 C51.3004058,77.5256038 55.3966232,75.2369981 58.9976911,71.4967761 C59.9401076,70.5179421 76.3155302,55.6232293 76.6324771,54.2720454 C76.6721165,54.1030573 76.7089039,53.4731496 76.3346867,53.1405352 C75.9604695,52.8079208 75.4081573,52.921662 75.0095933,53.0121213 C74.444641,53.1403447 65.4461175,59.0880351 48.0140228,70.8551922 C45.4598218,72.6091037 43.1463059,73.4636682 41.0734751,73.4188859 C38.7883453,73.3695169 34.3926725,72.1268388 31.1249416,71.0646282 C27.1169366,69.7617838 23.931454,69.0729605 24.208838,66.8603276 C24.3533167,65.7078514 25.9403832,64.5292172 28.9700376,63.3244248 Z" /></svg>',
 		),
+		'threads'       => array(
+			'name' => 'Threads',
+			'icon' => '<svg width="24" height="24" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M16.3 11.3c-.1 0-.2-.1-.2-.1-.1-2.6-1.5-4-3.9-4-1.4 0-2.6.6-3.3 1.7l1.3.9c.5-.8 1.4-1 2-1 .8 0 1.4.2 1.7.7.3.3.5.8.5 1.3-.7-.1-1.4-.2-2.2-.1-2.2.1-3.7 1.4-3.6 3.2 0 .9.5 1.7 1.3 2.2.7.4 1.5.6 2.4.6 1.2-.1 2.1-.5 2.7-1.3.5-.6.8-1.4.9-2.4.6.3 1 .8 1.2 1.3.4.9.4 2.4-.8 3.6-1.1 1.1-2.3 1.5-4.3 1.5-2.1 0-3.8-.7-4.8-2S5.7 14.3 5.7 12c0-2.3.5-4.1 1.5-5.4 1.1-1.3 2.7-2 4.8-2 2.2 0 3.8.7 4.9 2 .5.7.9 1.5 1.2 2.5l1.5-.4c-.3-1.2-.8-2.2-1.5-3.1-1.3-1.7-3.3-2.6-6-2.6-2.6 0-4.7.9-6 2.6C4.9 7.2 4.3 9.3 4.3 12s.6 4.8 1.9 6.4c1.4 1.7 3.4 2.6 6 2.6 2.3 0 4-.6 5.3-2 1.8-1.8 1.7-4 1.1-5.4-.4-.9-1.2-1.7-2.3-2.3zm-4 3.8c-1 .1-2-.4-2-1.3 0-.7.5-1.5 2.1-1.6h.5c.6 0 1.1.1 1.6.2-.2 2.3-1.3 2.7-2.2 2.7z"/></svg>',
+		),
 		'tiktok'        => array(
 			'name' => 'TikTok',
 			'icon' => '<svg width="24" height="24" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M16.708 0.027c1.745-0.027 3.48-0.011 5.213-0.027 0.105 2.041 0.839 4.12 2.333 5.563 1.491 1.479 3.6 2.156 5.652 2.385v5.369c-1.923-0.063-3.855-0.463-5.6-1.291-0.76-0.344-1.468-0.787-2.161-1.24-0.009 3.896 0.016 7.787-0.025 11.667-0.104 1.864-0.719 3.719-1.803 5.255-1.744 2.557-4.771 4.224-7.88 4.276-1.907 0.109-3.812-0.411-5.437-1.369-2.693-1.588-4.588-4.495-4.864-7.615-0.032-0.667-0.043-1.333-0.016-1.984 0.24-2.537 1.495-4.964 3.443-6.615 2.208-1.923 5.301-2.839 8.197-2.297 0.027 1.975-0.052 3.948-0.052 5.923-1.323-0.428-2.869-0.308-4.025 0.495-0.844 0.547-1.485 1.385-1.819 2.333-0.276 0.676-0.197 1.427-0.181 2.145 0.317 2.188 2.421 4.027 4.667 3.828 1.489-0.016 2.916-0.88 3.692-2.145 0.251-0.443 0.532-0.896 0.547-1.417 0.131-2.385 0.079-4.76 0.095-7.145 0.011-5.375-0.016-10.735 0.025-16.093z" /></svg>',

package/src/social-link/socials-with-bg.scss

@@ -154,6 +154,11 @@
 	color: #fff;
 }
 
+.wp-social-link-threads {
+	background-color: #000;
+	color: #fff;
+}
+
 .wp-social-link-tiktok {
 	background-color: #000;
 	color: #fff;

package/src/social-link/socials-without-bg.scss

@@ -119,6 +119,10 @@
 	color: #2aabee;
 }
 
+.wp-social-link-threads {
+	color: #000;
+}
+
 .wp-social-link-tiktok {
 	color: #000;
 }

package/src/social-link/variations.js

@@ -35,6 +35,7 @@ import {
 	SoundCloudIcon,
 	SpotifyIcon,
 	TelegramIcon,
+	ThreadsIcon,
 	TiktokIcon,
 	TumblrIcon,
 	TwitchIcon,
@@ -255,6 +256,12 @@ const variations = [
 		title: 'Telegram',
 		icon: TelegramIcon,
 	},
+	{
+		name: 'threads',
+		attributes: { service: 'threads' },
+		title: 'Threads',
+		icon: ThreadsIcon,
+	},
 	{
 		name: 'tiktok',
 		attributes: { service: 'tiktok' },

package/src/tag-cloud/edit.js

@@ -122,6 +122,7 @@ function TagCloudEdit( { attributes, setAttributes, taxonomies } ) {
 				/>
 				<RangeControl
 					__nextHasNoMarginBottom
+					__next40pxDefaultSize
 					label={ __( 'Number of tags' ) }
 					value={ numberOfTags }
 					onChange={ ( value ) =>

package/src/template-part/edit/import-controls.js

@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { __, sprintf } from '@wordpress/i18n';
+import { __, _x, sprintf } from '@wordpress/i18n';
 import { useMemo, useState } from '@wordpress/element';
 import { useDispatch, useSelect, useRegistry } from '@wordpress/data';
 import {
@@ -163,7 +163,7 @@ export function TemplatePartImportControls( { area, setAttributes } ) {
 						isBusy={ isBusy }
 						aria-disabled={ isBusy || ! selectedSidebar }
 					>
-						{ __( 'Import' ) }
+						{ _x( 'Import', 'button label' ) }
 					</Button>
 				</FlexItem>
 			</HStack>

package/src/template-part/edit/index.js

@@ -77,7 +77,7 @@ export default function TemplatePartEdit( {
 				area: _area,
 			};
 		},
-		[ templatePartId, clientId ]
+		[ templatePartId, attributes.area, clientId ]
 	);
 	const { templateParts } = useAlternativeTemplateParts(
 		area,

package/src/template-part/index.php

@@ -18,12 +18,11 @@ function render_block_core_template_part( $attributes ) {
 	$template_part_id = null;
 	$content          = null;
 	$area             = WP_TEMPLATE_PART_AREA_UNCATEGORIZED;
-	$stylesheet       = get_stylesheet();
 
 	if (
 		isset( $attributes['slug'] ) &&
 		isset( $attributes['theme'] ) &&
-		$stylesheet === $attributes['theme']
+		get_stylesheet() === $attributes['theme']
 	) {
 		$template_part_id    = $attributes['theme'] . '//' . $attributes['slug'];
 		$template_part_query = new WP_Query(
@@ -64,23 +63,15 @@ function render_block_core_template_part( $attributes ) {
 			 */
 			do_action( 'render_block_core_template_part_post', $template_part_id, $attributes, $template_part_post, $content );
 		} else {
+			$template_part_file_path = '';
 			// Else, if the template part was provided by the active theme,
 			// render the corresponding file content.
 			if ( 0 === validate_file( $attributes['slug'] ) ) {
-				$themes   = array( $stylesheet );
-				$template = get_template();
-				if ( $stylesheet !== $template ) {
-					$themes[] = $template;
-				}
+				$block_template = get_block_file_template( $template_part_id, 'wp_template_part' );
 
-				foreach ( $themes as $theme ) {
-					$theme_folders           = get_block_theme_folders( $theme );
-					$template_part_file_path = get_theme_file_path( '/' . $theme_folders['wp_template_part'] . '/' . $attributes['slug'] . '.html' );
-					if ( file_exists( $template_part_file_path ) ) {
-						$content = (string) file_get_contents( $template_part_file_path );
-						$content = '' !== $content ? _inject_theme_attribute_in_block_template_content( $content ) : '';
-						break;
-					}
+				$content = $block_template->content;
+				if ( isset( $block_template->area ) ) {
+					$area = $block_template->area;
 				}
 			}
 
@@ -256,7 +247,7 @@ function build_template_part_block_instance_variations() {
 				'area'  => $template_part->area,
 			),
 			'scope'       => array( 'inserter' ),
-			'icon'        => $icon_by_area[ $template_part->area ],
+			'icon'        => isset( $icon_by_area[ $template_part->area ] ) ? $icon_by_area[ $template_part->area ] : null,
 			'example'     => array(
 				'attributes' => array(
 					'slug'  => $template_part->slug,

package/src/text-columns/edit.js

@@ -35,6 +35,7 @@ export default function TextColumnsEdit( { attributes, setAttributes } ) {
 				<PanelBody>
 					<RangeControl
 						__nextHasNoMarginBottom
+						__next40pxDefaultSize
 						label={ __( 'Columns' ) }
 						value={ columns }
 						onChange={ ( value ) =>

package/src/video/style.scss

@@ -3,6 +3,7 @@
 	box-sizing: border-box;
 	video {
 		width: 100%;
+		vertical-align: middle;
 	}
 
 	@supports (position: sticky) {

package/build/gallery/shared-icon.native.js

@@ -1,38 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.sharedIcon = void 0;
-
-var _element = require("@wordpress/element");
-
-var _components = require("@wordpress/components");
-
-var _compose = require("@wordpress/compose");
-
-var _icons = require("@wordpress/icons");
-
-var _styles = _interopRequireDefault(require("./styles.scss"));
-
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-const IconWithColorScheme = (0, _compose.withPreferredColorScheme)(({
-  getStylesFromColorScheme
-}) => {
-  const colorSchemeStyles = getStylesFromColorScheme(_styles.default.icon, _styles.default.iconDark);
-  return (0, _element.createElement)(_components.Icon, {
-    icon: _icons.gallery,
-    ...colorSchemeStyles
-  });
-});
-const sharedIcon = (0, _element.createElement)(IconWithColorScheme, null);
-exports.sharedIcon = sharedIcon;
-//# sourceMappingURL=shared-icon.native.js.map

package/build/gallery/shared-icon.native.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/block-library/src/gallery/shared-icon.native.js"],"names":["IconWithColorScheme","getStylesFromColorScheme","colorSchemeStyles","styles","icon","iconDark","sharedIcon"],"mappings":";;;;;;;;;;;AAGA;;AACA;;AACA;;AAKA;;AAVA;AACA;AACA;;AAKA;AACA;AACA;AAGA,MAAMA,mBAAmB,GAAG,uCAC3B,CAAE;AAAEC,EAAAA;AAAF,CAAF,KAAoC;AACnC,QAAMC,iBAAiB,GAAGD,wBAAwB,CACjDE,gBAAOC,IAD0C,EAEjDD,gBAAOE,QAF0C,CAAlD;AAIA,SAAO,4BAAC,gBAAD;AAAM,IAAA,IAAI,EAAGD,cAAb;AAAA,OAAyBF;AAAzB,IAAP;AACA,CAP0B,CAA5B;AAUO,MAAMI,UAAU,GAAG,4BAAC,mBAAD,OAAnB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { Icon } from '@wordpress/components';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { gallery as icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport styles from './styles.scss';\n\nconst IconWithColorScheme = withPreferredColorScheme(\n\t( { getStylesFromColorScheme } ) => {\n\t\tconst colorSchemeStyles = getStylesFromColorScheme(\n\t\t\tstyles.icon,\n\t\t\tstyles.iconDark\n\t\t);\n\t\treturn <Icon icon={ icon } { ...colorSchemeStyles } />;\n\t}\n);\n\nexport const sharedIcon = <IconWithColorScheme />;\n"]}