@wordpress/edit-site 5.28.2 → 5.28.4

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/edit-site",
-	"version": "5.28.2",
+	"version": "5.28.4",
 	"description": "Edit Site Page module for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -30,42 +30,42 @@
 		"@wordpress/a11y": "^3.51.1",
 		"@wordpress/api-fetch": "^6.48.1",
 		"@wordpress/blob": "^3.51.1",
-		"@wordpress/block-editor": "^12.19.2",
-		"@wordpress/block-library": "^8.28.2",
-		"@wordpress/blocks": "^12.28.2",
-		"@wordpress/commands": "^0.22.2",
-		"@wordpress/components": "^26.0.2",
+		"@wordpress/block-editor": "^12.19.4",
+		"@wordpress/block-library": "^8.28.4",
+		"@wordpress/blocks": "^12.28.4",
+		"@wordpress/commands": "^0.22.3",
+		"@wordpress/components": "^26.0.3",
 		"@wordpress/compose": "^6.28.1",
-		"@wordpress/core-commands": "^0.20.2",
-		"@wordpress/core-data": "^6.28.2",
+		"@wordpress/core-commands": "^0.20.4",
+		"@wordpress/core-data": "^6.28.4",
 		"@wordpress/data": "^9.21.1",
-		"@wordpress/dataviews": "^0.5.2",
+		"@wordpress/dataviews": "^0.5.4",
 		"@wordpress/date": "^4.51.1",
 		"@wordpress/deprecated": "^3.51.1",
 		"@wordpress/dom": "^3.51.1",
-		"@wordpress/editor": "^13.28.2",
+		"@wordpress/editor": "^13.28.4",
 		"@wordpress/element": "^5.28.1",
 		"@wordpress/escape-html": "^2.51.1",
 		"@wordpress/hooks": "^3.51.1",
 		"@wordpress/html-entities": "^3.51.1",
 		"@wordpress/i18n": "^4.51.1",
-		"@wordpress/icons": "^9.42.1",
-		"@wordpress/interface": "^5.28.2",
+		"@wordpress/icons": "^9.42.2",
+		"@wordpress/interface": "^5.28.3",
 		"@wordpress/keyboard-shortcuts": "^4.28.1",
 		"@wordpress/keycodes": "^3.51.1",
 		"@wordpress/media-utils": "^4.42.1",
 		"@wordpress/notices": "^4.19.1",
-		"@wordpress/patterns": "^1.12.2",
-		"@wordpress/plugins": "^6.19.2",
-		"@wordpress/preferences": "^3.28.2",
+		"@wordpress/patterns": "^1.12.4",
+		"@wordpress/plugins": "^6.19.3",
+		"@wordpress/preferences": "^3.28.3",
 		"@wordpress/primitives": "^3.49.1",
 		"@wordpress/private-apis": "^0.33.1",
-		"@wordpress/reusable-blocks": "^4.28.2",
+		"@wordpress/reusable-blocks": "^4.28.4",
 		"@wordpress/router": "^0.20.1",
 		"@wordpress/style-engine": "^1.34.1",
 		"@wordpress/url": "^3.52.1",
 		"@wordpress/viewport": "^5.28.1",
-		"@wordpress/widgets": "^3.28.2",
+		"@wordpress/widgets": "^3.28.4",
 		"@wordpress/wordcount": "^3.51.1",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
@@ -85,5 +85,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "730beb7fd33d3382d6032c3f33e451625a0fcf36"
+	"gitHead": "864c1c553cb284def3bd5c907998da45f5c143ea"
 }

package/src/components/add-new-pattern/index.js

@@ -25,10 +25,11 @@ import {
 	PATTERN_DEFAULT_CATEGORY,
 	TEMPLATE_PART_POST_TYPE,
 } from '../../utils/constants';
-import usePatternCategories from '../sidebar-navigation-screen-patterns/use-pattern-categories';
 
 const { useHistory, useLocation } = unlock( routerPrivateApis );
-const { CreatePatternModal } = unlock( editPatternsPrivateApis );
+const { CreatePatternModal, useAddPatternCategory } = unlock(
+	editPatternsPrivateApis
+);
 
 export default function AddNewPattern() {
 	const history = useHistory();
@@ -43,7 +44,6 @@ export default function AddNewPattern() {
 	const { createSuccessNotice, createErrorNotice } =
 		useDispatch( noticesStore );
 	const patternUploadInputRef = useRef();
-	const { patternCategories } = usePatternCategories();
 
 	function handleCreatePattern( { pattern, categoryId } ) {
 		setShowPatternModal( false );
@@ -97,6 +97,7 @@ export default function AddNewPattern() {
 		title: __( 'Import pattern from JSON' ),
 	} );
 
+	const { categoryMap, findOrCreateTerm } = useAddPatternCategory();
 	return (
 		<>
 			<DropdownMenu
@@ -132,12 +133,23 @@ export default function AddNewPattern() {
 					const file = event.target.files?.[ 0 ];
 					if ( ! file ) return;
 					try {
-						const currentCategoryId =
-							params.categoryType !== TEMPLATE_PART_POST_TYPE &&
-							patternCategories.find(
-								( category ) =>
-									category.name === params.categoryId
-							)?.id;
+						let currentCategoryId;
+						// When we're not handling template parts, we should
+						// add or create the proper pattern category.
+						if ( params.categoryType !== TEMPLATE_PART_POST_TYPE ) {
+							const currentCategory = categoryMap
+								.values()
+								.find(
+									( term ) => term.name === params.categoryId
+								);
+							if ( !! currentCategory ) {
+								currentCategoryId =
+									currentCategory.id ||
+									( await findOrCreateTerm(
+										currentCategory.label
+									) );
+							}
+						}
 						const pattern = await createPatternFromFile(
 							file,
 							currentCategoryId
@@ -146,8 +158,12 @@ export default function AddNewPattern() {
 						);
 
 						// Navigate to the All patterns category for the newly created pattern
-						// if we're not on that page already.
-						if ( ! currentCategoryId ) {
+						// if we're not on that page already and if we're not in the `my-patterns`
+						// category.
+						if (
+							! currentCategoryId &&
+							params.categoryId !== 'my-patterns'
+						) {
 							history.push( {
 								path: `/patterns`,
 								categoryType: PATTERN_TYPES.theme,

package/src/components/editor/index.js

@@ -263,6 +263,7 @@ export default function Editor( { isLoading } ) {
 								( shouldShowListView && <ListViewSidebar /> ) )
 						}
 						sidebar={
+							! isDistractionFree &&
 							isEditMode &&
 							isRightSidebarOpen && (
 								<>

package/src/components/global-styles/block-preview-panel.js

@@ -28,7 +28,7 @@ const BlockPreviewPanel = ( { name, variation = '' } ) => {
 	}, [ name, blockExample, variation ] );
 
 	const viewportWidth = blockExample?.viewportWidth ?? null;
-	const previewHeight = '150px';
+	const previewHeight = 150;
 
 	if ( ! blockExample ) {
 		return null;
@@ -48,7 +48,7 @@ const BlockPreviewPanel = ( { name, variation = '' } ) => {
 						{
 							css: `
 								body{
-									min-height:${ previewHeight };
+									min-height:${ previewHeight }px;
 									display:flex;align-items:center;justify-content:center;
 								}
 							`,

package/src/components/global-styles/font-library-modal/collection-font-variant.js

@@ -11,7 +11,7 @@ import {
  * Internal dependencies
  */
 import { getFontFaceVariantName } from './utils';
-import FontFaceDemo from './font-demo';
+import FontDemo from './font-demo';
 import { unlock } from '../../../lock-unlock';
 
 function CollectionFontVariant( {
@@ -35,7 +35,7 @@ function CollectionFontVariant( {
 	);
 
 	return (
-		<div className="font-library-modal__library-font-variant">
+		<div className="font-library-modal__font-card">
 			<Flex justify="flex-start" align="center" gap="1rem">
 				<CheckboxControl
 					checked={ selected }
@@ -44,8 +44,8 @@ function CollectionFontVariant( {
 					id={ checkboxId }
 				/>
 				<label htmlFor={ checkboxId }>
-					<FontFaceDemo
-						fontFace={ face }
+					<FontDemo
+						font={ face }
 						text={ displayName }
 						onClick={ handleToggleActivation }
 					/>

package/src/components/global-styles/font-library-modal/font-card.js

@@ -3,6 +3,7 @@
  */
 import { _n, sprintf } from '@wordpress/i18n';
 import {
+	__experimentalUseNavigator as useNavigator,
 	__experimentalText as Text,
 	Button,
 	Flex,
@@ -14,46 +15,30 @@ import {
  * Internal dependencies
  */
 import FontDemo from './font-demo';
-import { getFamilyPreviewStyle } from './utils/preview-styles';
 import { chevronRight } from '@wordpress/icons';
 
-function FontCard( { font, onClick, variantsText } ) {
-	const fakeFontFace = {
-		fontStyle: 'normal',
-		fontWeight: '400',
-		fontFamily: font.fontFamily,
-		fake: true,
-	};
-
-	const displayFontFace =
-		font.fontFace && font.fontFace.length
-			? font?.fontFace?.find(
-					( face ) =>
-						face.fontStyle === 'normal' && face.fontWeight === '400'
-			  ) || font.fontFace[ 0 ]
-			: fakeFontFace;
-
-	const demoStyle = getFamilyPreviewStyle( font );
-
+function FontCard( { font, onClick, variantsText, navigatorPath } ) {
 	const variantsCount = font.fontFace?.length || 1;
 
 	const style = {
 		cursor: !! onClick ? 'pointer' : 'default',
 	};
 
+	const navigator = useNavigator();
+
 	return (
 		<Button
-			onClick={ onClick }
+			onClick={ () => {
+				onClick();
+				if ( navigatorPath ) {
+					navigator.goTo( navigatorPath );
+				}
+			} }
 			style={ style }
 			className="font-library-modal__font-card"
 		>
 			<Flex justify="space-between" wrap={ false }>
-				<FontDemo
-					customPreviewUrl={ font.preview }
-					fontFace={ displayFontFace }
-					text={ font.name }
-					style={ demoStyle }
-				/>
+				<FontDemo font={ font } />
 				<Flex justify="flex-end">
 					<FlexItem>
 						<Text className="font-library-modal__font-card__count">