Merge branch 'trunk' of github.com:amitraj2203/gutenberg into fix/iss…

…ue-62040

packages/block-editor/src/components/inserter/library.js

@@ -7,7 +7,7 @@ import { forwardRef } from '@wordpress/element';
 /**
  * Internal dependencies
  */
-import InserterMenu from './menu';
+import { PrivateInserterMenu } from './menu';
 import { store as blockEditorStore } from '../../store';
 
 const noop = () => {};
@@ -23,7 +23,7 @@ function InserterLibrary(
 		__experimentalInitialTab,
 		__experimentalInitialCategory,
 		__experimentalFilterValue,
-		__experimentalOnPatternCategorySelection,
+		onPatternCategorySelection,
 		onSelect = noop,
 		shouldFocusBlock = false,
 		onClose,
@@ -43,7 +43,7 @@ function InserterLibrary(
 	);
 
 	return (
-		<InserterMenu
+		<PrivateInserterMenu
 			onSelect={ onSelect }
 			rootClientId={ destinationRootClientId }
 			clientId={ clientId }
@@ -52,9 +52,7 @@ function InserterLibrary(
 			showMostUsedBlocks={ showMostUsedBlocks }
 			__experimentalInsertionIndex={ __experimentalInsertionIndex }
 			__experimentalFilterValue={ __experimentalFilterValue }
-			__experimentalOnPatternCategorySelection={
-				__experimentalOnPatternCategorySelection
-			}
+			onPatternCategorySelection={ onPatternCategorySelection }
 			__experimentalInitialTab={ __experimentalInitialTab }
 			__experimentalInitialCategory={ __experimentalInitialCategory }
 			shouldFocusBlock={ shouldFocusBlock }
@@ -64,4 +62,16 @@ function InserterLibrary(
 	);
 }
 
-export default forwardRef( InserterLibrary );
+export const PrivateInserterLibrary = forwardRef( InserterLibrary );
+
+function PublicInserterLibrary( props, ref ) {
+	return (
+		<PrivateInserterLibrary
+			{ ...props }
+			onPatternCategorySelection={ undefined }
+			ref={ ref }
+		/>
+	);
+}
+
+export default forwardRef( PublicInserterLibrary );

packages/block-editor/src/components/inserter/menu.js

@@ -45,7 +45,7 @@ function InserterMenu(
 		showMostUsedBlocks,
 		__experimentalFilterValue = '',
 		shouldFocusBlock = true,
-		__experimentalOnPatternCategorySelection = NOOP,
+		onPatternCategorySelection,
 		onClose,
 		__experimentalInitialTab,
 		__experimentalInitialCategory,
@@ -128,9 +128,9 @@ function InserterMenu(
 		( patternCategory, filter ) => {
 			setSelectedPatternCategory( patternCategory );
 			setPatternFilter( filter );
-			__experimentalOnPatternCategorySelection();
+			onPatternCategorySelection?.();
 		},
-		[ setSelectedPatternCategory, __experimentalOnPatternCategorySelection ]
+		[ setSelectedPatternCategory, onPatternCategorySelection ]
 	);
 
 	const showPatternPanel =
@@ -341,4 +341,16 @@ function InserterMenu(
 	);
 }
 
-export default forwardRef( InserterMenu );
+export const PrivateInserterMenu = forwardRef( InserterMenu );
+
+function PublicInserterMenu( props, ref ) {
+	return (
+		<PrivateInserterMenu
+			{ ...props }
+			onPatternCategorySelection={ NOOP }
+			ref={ ref }
+		/>
+	);
+}
+
+export default forwardRef( PublicInserterMenu );

packages/block-editor/src/private-apis.js

@@ -40,6 +40,7 @@ import {
 import { requiresWrapperOnCopy } from './components/writing-flow/utils';
 import { PrivateRichText } from './components/rich-text/';
 import { PrivateBlockPopover } from './components/block-popover';
+import { PrivateInserterLibrary } from './components/inserter/library';
 
 /**
  * Private @wordpress/block-editor APIs.
@@ -78,6 +79,7 @@ lock( privateApis, {
 	selectBlockPatternsKey,
 	requiresWrapperOnCopy,
 	PrivateRichText,
+	PrivateInserterLibrary,
 	reusableBlocksSelectKey,
 	PrivateBlockPopover,
 } );

packages/blocks/package.json

@@ -33,7 +33,6 @@
 		"@wordpress/autop": "file:../autop",
 		"@wordpress/blob": "file:../blob",
 		"@wordpress/block-serialization-default-parser": "file:../block-serialization-default-parser",
-		"@wordpress/compose": "file:../compose",
 		"@wordpress/data": "file:../data",
 		"@wordpress/deprecated": "file:../deprecated",
 		"@wordpress/dom": "file:../dom",

packages/blocks/src/api/parser/get-block-attributes.js

@@ -7,7 +7,6 @@ import memoize from 'memize';
 /**
  * WordPress dependencies
  */
-import { pipe } from '@wordpress/compose';
 import { applyFilters } from '@wordpress/hooks';
 import { RichTextData } from '@wordpress/rich-text';
 
@@ -37,24 +36,8 @@ import { normalizeBlockType, getDefault } from '../utils';
  *
  * @return {Function} Enhanced hpq matcher.
  */
-export const toBooleanAttributeMatcher = ( matcher ) =>
-	pipe( [
-		matcher,
-		// Expected values from `attr( 'disabled' )`:
-		//
-		// <input>
-		// - Value:       `undefined`
-		// - Transformed: `false`
-		//
-		// <input disabled>
-		// - Value:       `''`
-		// - Transformed: `true`
-		//
-		// <input disabled="disabled">
-		// - Value:       `'disabled'`
-		// - Transformed: `true`
-		( value ) => value !== undefined,
-	] );
+export const toBooleanAttributeMatcher = ( matcher ) => ( value ) =>
+	matcher( value ) !== undefined;
 
 /**
  * Returns true if value is of the given JSON schema type, or false otherwise.
@@ -214,13 +197,13 @@ export function isValidByEnum( value, enumSet ) {
  */
 export const matcherFromSource = memoize( ( sourceConfig ) => {
 	switch ( sourceConfig.source ) {
-		case 'attribute':
+		case 'attribute': {
 			let matcher = attr( sourceConfig.selector, sourceConfig.attribute );
 			if ( sourceConfig.type === 'boolean' ) {
 				matcher = toBooleanAttributeMatcher( matcher );
 			}
-
 			return matcher;
+		}
 		case 'html':
 			return html( sourceConfig.selector, sourceConfig.multiline );
 		case 'text':
@@ -244,12 +227,10 @@ export const matcherFromSource = memoize( ( sourceConfig ) => {
 				)
 			);
 			return query( sourceConfig.selector, subMatchers );
-		case 'tag':
-			return pipe( [
-				prop( sourceConfig.selector, 'nodeName' ),
-				( nodeName ) =>
-					nodeName ? nodeName.toLowerCase() : undefined,
-			] );
+		case 'tag': {
+			const matcher = prop( sourceConfig.selector, 'nodeName' );
+			return ( domNode ) => matcher( domNode )?.toLowerCase();
+		}
 		default:
 			// eslint-disable-next-line no-console
 			console.error( `Unknown source type "${ sourceConfig.source }"` );

packages/blocks/src/store/selectors.js

@@ -6,7 +6,6 @@ import removeAccents from 'remove-accents';
 /**
  * WordPress dependencies
  */
-import { pipe } from '@wordpress/compose';
 import { createSelector } from '@wordpress/data';
 
 /**
@@ -645,6 +644,18 @@ export function hasBlockSupport( state, nameOrType, feature, defaultSupports ) {
 	return !! getBlockSupport( state, nameOrType, feature, defaultSupports );
 }
 
+/**
+ * Normalizes a search term string: removes accents, converts to lowercase, removes extra whitespace.
+ *
+ * @param {string|null|undefined} term Search term to normalize.
+ * @return {string} Normalized search term.
+ */
+function getNormalizedSearchTerm( term ) {
+	return removeAccents( term ?? '' )
+		.toLowerCase()
+		.trim();
+}
+
 /**
  * Returns true if the block type by the given name or object value matches a
  * search term, or false otherwise.
@@ -684,30 +695,12 @@ export function hasBlockSupport( state, nameOrType, feature, defaultSupports ) {
  *
  * @return {Object[]} Whether block type matches search term.
  */
-export function isMatchingSearchTerm( state, nameOrType, searchTerm ) {
+export function isMatchingSearchTerm( state, nameOrType, searchTerm = '' ) {
 	const blockType = getNormalizedBlockType( state, nameOrType );
-
-	const getNormalizedSearchTerm = pipe( [
-		// Disregard diacritics.
-		//  Input: "média"
-		( term ) => removeAccents( term ?? '' ),
-
-		// Lowercase.
-		//  Input: "MEDIA"
-		( term ) => term.toLowerCase(),
-
-		// Strip leading and trailing whitespace.
-		//  Input: " media "
-		( term ) => term.trim(),
-	] );
-
 	const normalizedSearchTerm = getNormalizedSearchTerm( searchTerm );
 
-	const isSearchMatch = pipe( [
-		getNormalizedSearchTerm,
-		( normalizedCandidate ) =>
-			normalizedCandidate.includes( normalizedSearchTerm ),
-	] );
+	const isSearchMatch = ( candidate ) =>
+		getNormalizedSearchTerm( candidate ).includes( normalizedSearchTerm );
 
 	return (
 		isSearchMatch( blockType.title ) ||

packages/dataviews/src/style.scss

@@ -119,7 +119,8 @@
 		th:first-child {
 			padding-left: $grid-unit-60;
 
-			.dataviews-view-table-header-button {
+			.dataviews-view-table-header-button,
+			.dataviews-view-table-header {
 				margin-left: - #{$grid-unit-10};
 			}
 		}
@@ -235,6 +236,10 @@
 		}
 	}
 
+	.dataviews-view-table-header {
+		padding-left: $grid-unit-05;
+	}
+
 	.dataviews-view-table__actions-column {
 		width: 1%;
 	}

packages/dataviews/src/view-table.tsx

@@ -15,7 +15,6 @@ import {
 	privateApis as componentsPrivateApis,
 	CheckboxControl,
 	Spinner,
-	VisuallyHidden,
 } from '@wordpress/components';
 import {
 	forwardRef,
@@ -549,9 +548,9 @@ function ViewTable< Item extends AnyItem >( {
 								data-field-id="actions"
 								className="dataviews-view-table__actions-column"
 							>
-								<VisuallyHidden>
+								<span className="dataviews-view-table-header">
 									{ __( 'Actions' ) }
-								</VisuallyHidden>
+								</span>
 							</th>
 						) }
 					</tr>

packages/edit-site/src/components/add-new-pattern/index.js

@@ -108,7 +108,11 @@ export default function AddNewPattern() {
 				<DropdownMenu
 					controls={ controls }
 					icon={ null }
-					toggleProps={ { variant: 'primary', showTooltip: false } }
+					toggleProps={ {
+						variant: 'primary',
+						showTooltip: false,
+						__next40pxDefaultSize: true,
+					} }
 					text={ addNewPatternLabel }
 					label={ addNewPatternLabel }
 				/>

packages/edit-site/src/components/add-new-template/index.js

@@ -354,6 +354,7 @@ function NewTemplate() {
 				variant="primary"
 				onClick={ () => setShowModal( true ) }
 				label={ postType.labels.add_new_item }
+				__next40pxDefaultSize
 			>
 				{ postType.labels.add_new_item }
 			</Button>

packages/edit-site/src/components/global-styles/font-families.js

@@ -7,7 +7,6 @@ import {
 	__experimentalVStack as VStack,
 	__experimentalHStack as HStack,
 	Button,
-	Tooltip,
 } from '@wordpress/components';
 import { settings } from '@wordpress/icons';
 import { useContext } from '@wordpress/element';
@@ -40,18 +39,12 @@ function FontFamilies() {
 			<VStack spacing={ 2 }>
 				<HStack justify="space-between">
 					<Subtitle level={ 3 }>{ __( 'Fonts' ) }</Subtitle>
-					<HStack justify="flex-end">
-						<Tooltip text={ __( 'Manage fonts' ) }>
-							<Button
-								onClick={ () =>
-									toggleModal( 'installed-fonts' )
-								}
-								aria-label={ __( 'Manage fonts' ) }
-								icon={ settings }
-								size="small"
-							/>
-						</Tooltip>
-					</HStack>
+					<Button
+						onClick={ () => toggleModal( 'installed-fonts' ) }
+						label={ __( 'Manage fonts' ) }
+						icon={ settings }
+						size="small"
+					/>
 				</HStack>
 				{ hasFonts ? (
 					<ItemGroup isBordered isSeparated>

packages/edit-site/src/components/layout/router.js

@@ -87,7 +87,7 @@ export default function useLayoutAreas() {
 			areas: {
 				sidebar: (
 					<SidebarNavigationScreen
-						title={ __( 'Manage pages' ) }
+						title={ __( 'Pages' ) }
 						backPath={ {} }
 						content={ <DataViewsSidebarContent /> }
 					/>

packages/edit-site/src/components/page-pages/index.js

@@ -498,7 +498,11 @@ export default function PagePages() {
 			actions={
 				addNewLabel && (
 					<>
-						<Button variant="primary" onClick={ openModal }>
+						<Button
+							variant="primary"
+							onClick={ openModal }
+							__next40pxDefaultSize
+						>
 							{ addNewLabel }
 						</Button>
 						{ showAddPageModal && (