@wordpress/edit-site 6.13.1-next.cd6172eb0.0 → 6.15.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/edit-site",
-	"version": "6.13.1-next.cd6172eb0.0",
+	"version": "6.15.0",
 	"description": "Edit Site Page module for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -30,45 +30,46 @@
 	"dependencies": {
 		"@babel/runtime": "7.25.7",
 		"@react-spring/web": "^9.4.5",
-		"@wordpress/a11y": "^4.13.1-next.cd6172eb0.0",
-		"@wordpress/api-fetch": "^7.13.1-next.cd6172eb0.0",
-		"@wordpress/blob": "^4.13.1-next.cd6172eb0.0",
-		"@wordpress/block-editor": "^14.8.1-next.cd6172eb0.0",
-		"@wordpress/block-library": "^9.13.1-next.cd6172eb0.0",
-		"@wordpress/blocks": "^14.2.1-next.cd6172eb0.0",
-		"@wordpress/commands": "^1.13.1-next.cd6172eb0.0",
-		"@wordpress/components": "*",
-		"@wordpress/compose": "^7.13.1-next.cd6172eb0.0",
-		"@wordpress/core-commands": "^1.13.1-next.cd6172eb0.0",
-		"@wordpress/core-data": "^7.13.1-next.cd6172eb0.0",
-		"@wordpress/data": "^10.13.1-next.cd6172eb0.0",
-		"@wordpress/dataviews": "^4.9.1-next.cd6172eb0.0",
-		"@wordpress/date": "^5.13.1-next.cd6172eb0.0",
-		"@wordpress/deprecated": "^4.13.1-next.cd6172eb0.0",
-		"@wordpress/dom": "^4.13.1-next.cd6172eb0.0",
-		"@wordpress/editor": "^14.13.1-next.cd6172eb0.0",
-		"@wordpress/element": "^6.13.1-next.cd6172eb0.0",
-		"@wordpress/escape-html": "^3.13.1-next.cd6172eb0.0",
-		"@wordpress/fields": "^0.5.1-next.cd6172eb0.0",
-		"@wordpress/hooks": "^4.13.1-next.cd6172eb0.0",
-		"@wordpress/html-entities": "^4.13.1-next.cd6172eb0.0",
-		"@wordpress/i18n": "^5.13.1-next.cd6172eb0.0",
-		"@wordpress/icons": "^10.13.1-next.cd6172eb0.0",
-		"@wordpress/keyboard-shortcuts": "^5.13.1-next.cd6172eb0.0",
-		"@wordpress/keycodes": "^4.13.1-next.cd6172eb0.0",
-		"@wordpress/notices": "^5.13.1-next.cd6172eb0.0",
-		"@wordpress/patterns": "^2.13.1-next.cd6172eb0.0",
-		"@wordpress/plugins": "^7.13.1-next.cd6172eb0.0",
-		"@wordpress/preferences": "^4.13.1-next.cd6172eb0.0",
-		"@wordpress/primitives": "^4.13.1-next.cd6172eb0.0",
-		"@wordpress/private-apis": "^1.13.1-next.cd6172eb0.0",
-		"@wordpress/reusable-blocks": "^5.13.1-next.cd6172eb0.0",
-		"@wordpress/router": "^1.13.1-next.cd6172eb0.0",
-		"@wordpress/style-engine": "^2.13.1-next.cd6172eb0.0",
-		"@wordpress/url": "^4.13.1-next.cd6172eb0.0",
-		"@wordpress/viewport": "^6.13.1-next.cd6172eb0.0",
-		"@wordpress/widgets": "^4.13.1-next.cd6172eb0.0",
-		"@wordpress/wordcount": "^4.13.1-next.cd6172eb0.0",
+		"@wordpress/a11y": "^4.15.0",
+		"@wordpress/api-fetch": "^7.15.0",
+		"@wordpress/blob": "^4.15.0",
+		"@wordpress/block-editor": "^14.10.0",
+		"@wordpress/block-library": "^9.15.0",
+		"@wordpress/blocks": "^14.4.0",
+		"@wordpress/commands": "^1.15.0",
+		"@wordpress/components": "^29.1.0",
+		"@wordpress/compose": "^7.15.0",
+		"@wordpress/core-commands": "^1.15.0",
+		"@wordpress/core-data": "^7.15.0",
+		"@wordpress/data": "^10.15.0",
+		"@wordpress/dataviews": "^4.11.0",
+		"@wordpress/date": "^5.15.0",
+		"@wordpress/deprecated": "^4.15.0",
+		"@wordpress/dom": "^4.15.0",
+		"@wordpress/editor": "^14.15.0",
+		"@wordpress/element": "^6.15.0",
+		"@wordpress/escape-html": "^3.15.0",
+		"@wordpress/fields": "^0.7.0",
+		"@wordpress/hooks": "^4.15.0",
+		"@wordpress/html-entities": "^4.15.0",
+		"@wordpress/i18n": "^5.15.0",
+		"@wordpress/icons": "^10.15.0",
+		"@wordpress/keyboard-shortcuts": "^5.15.0",
+		"@wordpress/keycodes": "^4.15.0",
+		"@wordpress/media-utils": "^5.15.0",
+		"@wordpress/notices": "^5.15.0",
+		"@wordpress/patterns": "^2.15.0",
+		"@wordpress/plugins": "^7.15.0",
+		"@wordpress/preferences": "^4.15.0",
+		"@wordpress/primitives": "^4.15.0",
+		"@wordpress/private-apis": "^1.15.0",
+		"@wordpress/reusable-blocks": "^5.15.0",
+		"@wordpress/router": "^1.15.0",
+		"@wordpress/style-engine": "^2.15.0",
+		"@wordpress/url": "^4.15.0",
+		"@wordpress/viewport": "^6.15.0",
+		"@wordpress/widgets": "^4.15.0",
+		"@wordpress/wordcount": "^4.15.0",
 		"change-case": "^4.1.2",
 		"clsx": "^2.1.1",
 		"colord": "^2.9.2",
@@ -83,5 +84,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "4cc93dc1781d8a7bc2bbde265913917920e2bd45"
+	"gitHead": "75a65eb8ffc168a92042544052f46d080a71ea45"
 }

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

@@ -25,7 +25,7 @@ import {
 	TEMPLATE_PART_POST_TYPE,
 } from '../../utils/constants';
 
-const { useHistory } = unlock( routerPrivateApis );
+const { useHistory, useLocation } = unlock( routerPrivateApis );
 const { CreatePatternModal, useAddPatternCategory } = unlock(
 	editPatternsPrivateApis
 );
@@ -33,6 +33,7 @@ const { CreateTemplatePartModal } = unlock( editorPrivateApis );
 
 export default function AddNewPattern() {
 	const history = useHistory();
+	const location = useLocation();
 	const [ showPatternModal, setShowPatternModal ] = useState( false );
 	const [ showTemplatePartModal, setShowTemplatePartModal ] =
 		useState( false );
@@ -159,13 +160,12 @@ export default function AddNewPattern() {
 						return;
 					}
 					try {
-						const {
-							params: { postType, categoryId },
-						} = history.getLocationWithParams();
 						let currentCategoryId;
 						// When we're not handling template parts, we should
 						// add or create the proper pattern category.
-						if ( postType !== TEMPLATE_PART_POST_TYPE ) {
+						if (
+							location.query.postType !== TEMPLATE_PART_POST_TYPE
+						) {
 							/*
 							 * categoryMap.values() returns an iterator.
 							 * Iterator.prototype.find() is not yet widely supported.
@@ -173,7 +173,10 @@ export default function AddNewPattern() {
 							 */
 							const currentCategory = Array.from(
 								categoryMap.values()
-							).find( ( term ) => term.name === categoryId );
+							).find(
+								( term ) =>
+									term.name === location.query.categoryId
+							);
 							if ( currentCategory ) {
 								currentCategoryId =
 									currentCategory.id ||
@@ -194,7 +197,7 @@ export default function AddNewPattern() {
 						// category.
 						if (
 							! currentCategoryId &&
-							categoryId !== 'my-patterns'
+							location.query.categoryId !== 'my-patterns'
 						) {
 							history.navigate(
 								`/pattern?categoryId=${ PATTERN_DEFAULT_CATEGORY }`

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

@@ -45,7 +45,7 @@ export default function AddNewPostModal( { postType, onSave, onClose } ) {
 				{
 					status: 'draft',
 					title,
-					slug: title || __( 'No title' ),
+					slug: title ?? undefined,
 					content:
 						!! postTypeObject.template &&
 						postTypeObject.template.length

package/src/components/canvas-loader/style.scss

@@ -9,9 +9,10 @@
 	align-items: center;
 	justify-content: center;
 
-	animation: 0.5s ease 0.2s edit-site-canvas-loader__fade-in-animation;
-	animation-fill-mode: forwards;
-	@include reduce-motion("animation");
+	@media not (prefers-reduced-motion) {
+		animation: 0.5s ease 0.2s edit-site-canvas-loader__fade-in-animation;
+		animation-fill-mode: forwards;
+	}
 
 	& > div {
 		width: 160px;

package/src/components/editor/index.js

@@ -20,7 +20,6 @@ import { privateApis as blockLibraryPrivateApis } from '@wordpress/block-library
 import { useCallback, useMemo } from '@wordpress/element';
 import { store as noticesStore } from '@wordpress/notices';
 import { privateApis as routerPrivateApis } from '@wordpress/router';
-import { store as preferencesStore } from '@wordpress/preferences';
 import { decodeEntities } from '@wordpress/html-entities';
 import { Icon, arrowUpLeft } from '@wordpress/icons';
 import { store as blockEditorStore } from '@wordpress/block-editor';
@@ -130,7 +129,6 @@ export default function EditSiteEditor( { isPostsList = false } ) {
 	const { postType, postId, context } = entity;
 	const {
 		supportsGlobalStyles,
-		showIconLabels,
 		editorCanvasView,
 		currentPostIsTrashed,
 		hasSiteIcon,
@@ -138,13 +136,11 @@ export default function EditSiteEditor( { isPostsList = false } ) {
 		const { getEditorCanvasContainerView } = unlock(
 			select( editSiteStore )
 		);
-		const { get } = select( preferencesStore );
 		const { getCurrentTheme, getEntityRecord } = select( coreDataStore );
 		const siteData = getEntityRecord( 'root', '__unstableBase', undefined );
 
 		return {
 			supportsGlobalStyles: getCurrentTheme()?.is_block_theme,
-			showIconLabels: get( 'core', 'showIconLabels' ),
 			editorCanvasView: getEditorCanvasContainerView(),
 			currentPostIsTrashed:
 				select( editorStore ).getCurrentPostAttribute( 'status' ) ===
@@ -267,9 +263,7 @@ export default function EditSiteEditor( { isPostsList = false } ) {
 					postId={ postWithTemplate ? context.postId : postId }
 					templateId={ postWithTemplate ? postId : undefined }
 					settings={ settings }
-					className={ clsx( 'edit-site-editor__editor-interface', {
-						'show-icon-labels': showIconLabels,
-					} ) }
+					className="edit-site-editor__editor-interface"
 					styles={ styles }
 					customSaveButton={
 						_isPreviewingTheme && <SaveButton size="compact" />

package/src/components/editor/style.scss

@@ -1,7 +1,9 @@
 .edit-site-editor__editor-interface {
 	opacity: 1;
-	transition: opacity 0.1s ease-out;
-	@include reduce-motion( "transition" );
+
+	@media not (prefers-reduced-motion) {
+		transition: opacity 0.1s ease-out;
+	}
 
 	&.is-loading {
 		opacity: 0;

package/src/components/editor-canvas-container/style.scss

@@ -1,6 +1,10 @@
 .edit-site-editor-canvas-container {
 	height: 100%;
 
+	// This is the gray background color that's applied behind "isolation mode".
+	// The color normally comes from .editor-visual-editor, but that class is missing here.
+	background-color: $gray-300;
+
 	// Controls height of editor and editor canvas container (style book, global styles revisions previews etc.)
 	iframe {
 		display: block;
@@ -22,7 +26,9 @@
 	position: absolute;
 	right: 0;
 	top: 0;
-	transition: all 0.3s; // Match .block-editor-iframe__body transition.
+	@media not (prefers-reduced-motion) {
+		transition: all 0.3s; // Match .block-editor-iframe__body transition.
+	}
 }
 
 .edit-site-editor-canvas-container__close-button {

package/src/components/global-styles/confirm-reset-shadow-dialog.js

@@ -0,0 +1,37 @@
+/**
+ * WordPress dependencies
+ */
+import { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';
+import { __ } from '@wordpress/i18n';
+
+function ConfirmResetShadowDialog( {
+	text,
+	confirmButtonText,
+	isOpen,
+	toggleOpen,
+	onConfirm,
+} ) {
+	const handleConfirm = async () => {
+		toggleOpen();
+		onConfirm();
+	};
+
+	const handleCancel = () => {
+		toggleOpen();
+	};
+
+	return (
+		<ConfirmDialog
+			isOpen={ isOpen }
+			cancelButtonText={ __( 'Cancel' ) }
+			confirmButtonText={ confirmButtonText }
+			onCancel={ handleCancel }
+			onConfirm={ handleConfirm }
+			size="medium"
+		>
+			{ text }
+		</ConfirmDialog>
+	);
+}
+
+export default ConfirmResetShadowDialog;

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

@@ -28,7 +28,7 @@ const DEFAULT_TAB = {
 
 const UPLOAD_TAB = {
 	id: 'upload-fonts',
-	title: __( 'Upload' ),
+	title: _x( 'Upload', 'noun' ),
 };
 
 const tabsFromCollections = ( collections ) =>

package/src/components/global-styles/font-library-modal/style.scss

@@ -129,8 +129,10 @@ $footer-height: 70px;
 	.font-library-modal__font-variant_demo-text {
 		white-space: nowrap;
 		flex-shrink: 0;
-		transition: opacity 0.3s ease-in-out;
-		@include reduce-motion( "transition" );
+
+		@media not (prefers-reduced-motion) {
+			transition: opacity 0.3s ease-in-out;
+		}
 	}
 }
 

package/src/components/global-styles/font-sizes/font-size.js

@@ -166,25 +166,34 @@ function FontSize() {
 								marginBottom={ 0 }
 								paddingX={ 4 }
 							>
-								<Menu
-									trigger={
-										<Button
-											size="small"
-											icon={ moreVertical }
-											label={ __( 'Font size options' ) }
-										/>
-									}
-								>
-									<Menu.Item onClick={ toggleRenameDialog }>
-										<Menu.ItemLabel>
-											{ __( 'Rename' ) }
-										</Menu.ItemLabel>
-									</Menu.Item>
-									<Menu.Item onClick={ toggleDeleteConfirm }>
-										<Menu.ItemLabel>
-											{ __( 'Delete' ) }
-										</Menu.ItemLabel>
-									</Menu.Item>
+								<Menu>
+									<Menu.TriggerButton
+										render={
+											<Button
+												size="small"
+												icon={ moreVertical }
+												label={ __(
+													'Font size options'
+												) }
+											/>
+										}
+									/>
+									<Menu.Popover>
+										<Menu.Item
+											onClick={ toggleRenameDialog }
+										>
+											<Menu.ItemLabel>
+												{ __( 'Rename' ) }
+											</Menu.ItemLabel>
+										</Menu.Item>
+										<Menu.Item
+											onClick={ toggleDeleteConfirm }
+										>
+											<Menu.ItemLabel>
+												{ __( 'Delete' ) }
+											</Menu.ItemLabel>
+										</Menu.Item>
+									</Menu.Popover>
 								</Menu>
 							</Spacer>
 						</FlexItem>

package/src/components/global-styles/font-sizes/font-sizes.js

@@ -11,7 +11,6 @@ import {
 	__experimentalVStack as VStack,
 	__experimentalHStack as HStack,
 	FlexItem,
-	FlexBlock,
 	Button,
 } from '@wordpress/components';
 import {
@@ -27,14 +26,15 @@ import { useState } from '@wordpress/element';
  * Internal dependencies
  */
 import { unlock } from '../../../lock-unlock';
-const { Menu } = unlock( componentsPrivateApis );
-const { useGlobalSetting } = unlock( blockEditorPrivateApis );
 import Subtitle from '../subtitle';
 import { NavigationButtonAsItem } from '../navigation-button';
 import { getNewIndexFromPresets } from '../utils';
 import ScreenHeader from '../header';
 import ConfirmResetFontSizesDialog from './confirm-reset-font-sizes-dialog';
 
+const { Menu } = unlock( componentsPrivateApis );
+const { useGlobalSetting } = unlock( blockEditorPrivateApis );
+
 function FontSizeGroup( {
 	label,
 	origin,
@@ -81,24 +81,31 @@ function FontSizeGroup( {
 							/>
 						) }
 						{ !! handleResetFontSizes && (
-							<Menu
-								trigger={
-									<Button
-										size="small"
-										icon={ moreVertical }
-										label={ __(
-											'Font size presets options'
-										) }
-									/>
-								}
-							>
-								<Menu.Item onClick={ toggleResetDialog }>
-									<Menu.ItemLabel>
-										{ origin === 'custom'
-											? __( 'Remove font size presets' )
-											: __( 'Reset font size presets' ) }
-									</Menu.ItemLabel>
-								</Menu.Item>
+							<Menu>
+								<Menu.TriggerButton
+									render={
+										<Button
+											size="small"
+											icon={ moreVertical }
+											label={ __(
+												'Font size presets options'
+											) }
+										/>
+									}
+								/>
+								<Menu.Popover>
+									<Menu.Item onClick={ toggleResetDialog }>
+										<Menu.ItemLabel>
+											{ origin === 'custom'
+												? __(
+														'Remove font size presets'
+												  )
+												: __(
+														'Reset font size presets'
+												  ) }
+										</Menu.ItemLabel>
+									</Menu.Item>
+								</Menu.Popover>
 							</Menu>
 						) }
 					</FlexItem>
@@ -111,23 +118,18 @@ function FontSizeGroup( {
 								key={ size.slug }
 								path={ `/typography/font-sizes/${ origin }/${ size.slug }` }
 							>
-								<HStack direction="row">
+								<HStack>
 									<FlexItem className="edit-site-font-size__item">
 										{ size.name }
 									</FlexItem>
-									<FlexItem>
-										<HStack justify="flex-end">
-											<FlexBlock className="edit-site-font-size__item edit-site-font-size__item-value">
-												{ size.size }
-											</FlexBlock>
-											<Icon
-												icon={
-													isRTL()
-														? chevronLeft
-														: chevronRight
-												}
-											/>
-										</HStack>
+									<FlexItem display="flex">
+										<Icon
+											icon={
+												isRTL()
+													? chevronLeft
+													: chevronRight
+											}
+										/>
 									</FlexItem>
 								</HStack>
 							</NavigationButtonAsItem>

package/src/components/global-styles/preview-colors.js

@@ -10,7 +10,7 @@ import {
  * Internal dependencies
  */
 import PresetColors from './preset-colors';
-import PreviewIframe from './preview-iframe';
+import PreviewWrapper from './preview-wrapper';
 
 const firstFrameVariants = {
 	start: {
@@ -25,7 +25,7 @@ const firstFrameVariants = {
 
 const StylesPreviewColors = ( { label, isFocused, withHoverView } ) => {
 	return (
-		<PreviewIframe
+		<PreviewWrapper
 			label={ label }
 			isFocused={ isFocused }
 			withHoverView={ withHoverView }
@@ -51,7 +51,7 @@ const StylesPreviewColors = ( { label, isFocused, withHoverView } ) => {
 					</HStack>
 				</motion.div>
 			) }
-		</PreviewIframe>
+		</PreviewWrapper>
 	);
 };
 

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

@@ -15,7 +15,7 @@ import { unlock } from '../../lock-unlock';
 import { useStylesPreviewColors } from './hooks';
 import TypographyExample from './typography-example';
 import HighlightedColors from './highlighted-colors';
-import PreviewIframe from './preview-iframe';
+import PreviewWrapper from './preview-wrapper';
 
 const { useGlobalStyle } = unlock( blockEditorPrivateApis );
 
@@ -67,7 +67,7 @@ const PreviewStyles = ( { label, isFocused, withHoverView, variation } ) => {
 	const { paletteColors } = useStylesPreviewColors();
 
 	return (
-		<PreviewIframe
+		<PreviewWrapper
 			label={ label }
 			isFocused={ isFocused }
 			withHoverView={ withHoverView }
@@ -178,7 +178,7 @@ const PreviewStyles = ( { label, isFocused, withHoverView, variation } ) => {
 					</VStack>
 				</motion.div>
 			) }
-		</PreviewIframe>
+		</PreviewWrapper>
 	);
 };
 

package/src/components/global-styles/preview-typography.js

@@ -7,11 +7,11 @@ import { __experimentalHStack as HStack } from '@wordpress/components';
  * Internal dependencies
  */
 import TypographyExample from './typography-example';
-import PreviewIframe from './preview-iframe';
+import PreviewWrapper from './preview-wrapper';
 
 const StylesPreviewTypography = ( { variation, isFocused, withHoverView } ) => {
 	return (
-		<PreviewIframe
+		<PreviewWrapper
 			label={ variation.title }
 			isFocused={ isFocused }
 			withHoverView={ withHoverView }
@@ -32,7 +32,7 @@ const StylesPreviewTypography = ( { variation, isFocused, withHoverView } ) => {
 					/>
 				</HStack>
 			) }
-		</PreviewIframe>
+		</PreviewWrapper>
 	);
 };