@wordpress/editor 12.8.0 → 12.11.0

package/src/components/post-title/index.native.js

@@ -169,19 +169,15 @@ class PostTitle extends Component {
 
 export default compose(
 	withSelect( ( select ) => {
-		const { isPostTitleSelected, getEditedPostAttribute } = select(
-			editorStore
-		);
-		const {
-			getSelectedBlockClientId,
-			getBlockRootClientId,
-			getSettings,
-		} = select( blockEditorStore );
+		const { isPostTitleSelected, getEditedPostAttribute } =
+			select( editorStore );
+		const { getSelectedBlockClientId, getBlockRootClientId, getSettings } =
+			select( blockEditorStore );
 
 		const selectedId = getSelectedBlockClientId();
 		const selectionIsNested = !! getBlockRootClientId( selectedId );
-		const globalStyles = getSettings()?.__experimentalGlobalStylesBaseStyles
-			?.color;
+		const globalStyles =
+			getSettings()?.__experimentalGlobalStylesBaseStyles?.color;
 
 		return {
 			postType: getEditedPostAttribute( 'type' ),
@@ -192,13 +188,11 @@ export default compose(
 		};
 	} ),
 	withDispatch( ( dispatch ) => {
-		const { undo, redo, togglePostTitleSelection } = dispatch(
-			editorStore
-		);
+		const { undo, redo, togglePostTitleSelection } =
+			dispatch( editorStore );
 
-		const { clearSelectedBlock, insertDefaultBlock } = dispatch(
-			blockEditorStore
-		);
+		const { clearSelectedBlock, insertDefaultBlock } =
+			dispatch( blockEditorStore );
 
 		return {
 			onEnterPress() {

package/src/components/post-title/style.scss

@@ -2,7 +2,7 @@
 	position: relative;
 
 	&.is-focus-mode {
-		opacity: 0.5;
+		opacity: 0.2;
 		transition: opacity 0.1s linear;
 		@include reduce-motion("transition");
 

package/src/components/post-trash/check.js

@@ -18,9 +18,8 @@ function PostTrashCheck( { isNew, postId, canUserDelete, children } ) {
 }
 
 export default withSelect( ( select ) => {
-	const { isEditedPostNew, getCurrentPostId, getCurrentPostType } = select(
-		editorStore
-	);
+	const { isEditedPostNew, getCurrentPostId, getCurrentPostType } =
+		select( editorStore );
 	const { getPostType, canUser } = select( coreStore );
 	const postId = getCurrentPostId();
 	const postType = getPostType( getCurrentPostType() );

package/src/components/post-visibility/index.js

@@ -6,11 +6,10 @@ import { useState } from '@wordpress/element';
 import {
 	VisuallyHidden,
 	__experimentalConfirmDialog as ConfirmDialog,
-	Button,
 } from '@wordpress/components';
 import { useInstanceId } from '@wordpress/compose';
 import { useSelect, useDispatch } from '@wordpress/data';
-import { close as closeIcon } from '@wordpress/icons';
+import { __experimentalInspectorPopoverHeader as InspectorPopoverHeader } from '@wordpress/block-editor';
 
 /**
  * Internal dependencies
@@ -30,9 +29,8 @@ export default function PostVisibility( { onClose } ) {
 	const { editPost, savePost } = useDispatch( editorStore );
 
 	const [ hasPassword, setHasPassword ] = useState( !! password );
-	const [ showPrivateConfirmDialog, setShowPrivateConfirmDialog ] = useState(
-		false
-	);
+	const [ showPrivateConfirmDialog, setShowPrivateConfirmDialog ] =
+		useState( false );
 
 	const setPublic = () => {
 		editPost( {
@@ -70,20 +68,16 @@ export default function PostVisibility( { onClose } ) {
 	};
 
 	return (
-		<>
-			<Button
-				className="editor-post-visibility__close"
-				isSmall
-				icon={ closeIcon }
-				onClick={ onClose }
+		<div className="editor-post-visibility">
+			<InspectorPopoverHeader
+				title={ __( 'Visibility' ) }
+				help={ __( 'Control how this post is viewed.' ) }
+				onClose={ onClose }
 			/>
 			<fieldset className="editor-post-visibility__fieldset">
-				<legend className="editor-post-visibility__legend">
+				<VisuallyHidden as="legend">
 					{ __( 'Visibility' ) }
-				</legend>
-				<p className="editor-post-visibility__description">
-					{ __( 'Control how this post is viewed.' ) }
-				</p>
+				</VisuallyHidden>
 				<PostVisibilityChoice
 					instanceId={ instanceId }
 					value="public"
@@ -134,7 +128,7 @@ export default function PostVisibility( { onClose } ) {
 			>
 				{ __( 'Would you like to privately publish this post now?' ) }
 			</ConfirmDialog>
-		</>
+		</div>
 	);
 }
 

package/src/components/post-visibility/style.scss

@@ -1,21 +1,4 @@
-.editor-post-visibility__close {
-	position: absolute;
-	right: $grid-unit-20;
-	top: $grid-unit-20;
-}
-
 .editor-post-visibility__fieldset {
-	padding: $grid-unit-10;
-
-	.editor-post-visibility__legend {
-		font-weight: 600;
-		padding: 1em 0 0 0;
-	}
-
-	.editor-post-visibility__description {
-		margin-top: 0.5em;
-	}
-
 	.editor-post-visibility__radio[type="radio"] {
 		@include radio-control;
 		margin-top: 2px;

package/src/components/provider/index.js

@@ -34,9 +34,8 @@ function EditorProvider( {
 		return { postId: post.id, postType: post.type };
 	}, [ post.id, post.type ] );
 	const { selection, isReady } = useSelect( ( select ) => {
-		const { getEditorSelection, __unstableIsEditorReady } = select(
-			editorStore
-		);
+		const { getEditorSelection, __unstableIsEditorReady } =
+			select( editorStore );
 		return {
 			isReady: __unstableIsEditorReady(),
 			selection: getEditorSelection(),

package/src/components/provider/index.native.js

@@ -130,9 +130,8 @@ class NativeEditorProvider extends Component {
 				const blockName = 'core/' + payload.mediaType;
 				const newBlock = createBlock( blockName, {
 					id: payload.mediaId,
-					[ payload.mediaType === 'image'
-						? 'url'
-						: 'src' ]: payload.mediaUrl,
+					[ payload.mediaType === 'image' ? 'url' : 'src' ]:
+						payload.mediaUrl,
 				} );
 
 				const indexAfterSelected = this.props.selectedBlockIndex + 1;
@@ -143,14 +142,16 @@ class NativeEditorProvider extends Component {
 			}
 		);
 
-		this.subscriptionParentUpdateEditorSettings = subscribeUpdateEditorSettings(
-			( { galleryWithImageBlocks, ...editorSettings } ) => {
-				if ( typeof galleryWithImageBlocks === 'boolean' ) {
-					window.wp.galleryBlockV2Enabled = galleryWithImageBlocks;
+		this.subscriptionParentUpdateEditorSettings =
+			subscribeUpdateEditorSettings(
+				( { galleryWithImageBlocks, ...editorSettings } ) => {
+					if ( typeof galleryWithImageBlocks === 'boolean' ) {
+						window.wp.galleryBlockV2Enabled =
+							galleryWithImageBlocks;
+					}
+					updateSettings( this.getThemeColors( editorSettings ) );
 				}
-				updateSettings( this.getThemeColors( editorSettings ) );
-			}
-		);
+			);
 
 		this.subscriptionParentUpdateCapabilities = subscribeUpdateCapabilities(
 			( payload ) => {
@@ -318,13 +319,7 @@ class NativeEditorProvider extends Component {
 	}
 
 	render() {
-		const {
-			children,
-			post, // eslint-disable-line no-unused-vars
-			capabilities,
-			settings,
-			...props
-		} = this.props;
+		const { children, post, capabilities, settings, ...props } = this.props;
 		const editorSettings = this.getEditorSettings( settings, capabilities );
 
 		return (

package/src/components/provider/use-block-editor-settings.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { pick, defaultTo, unionBy } from 'lodash';
+import { pick, unionBy } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -52,10 +52,7 @@ function useBlockEditorSettings( settings, hasTemplate ) {
 						{ per_page: -1 }
 				  )
 				: [], // Reusable blocks are fetched in the native version of this hook.
-			hasUploadPermissions: defaultTo(
-				canUser( 'create', 'media' ),
-				true
-			),
+			hasUploadPermissions: canUser( 'create', 'media' ) ?? true,
 			userCanCreatePages: canUser( 'create', 'pages' ),
 			pageOnFront: siteSettings?.page_on_front,
 		};
@@ -71,9 +68,8 @@ function useBlockEditorSettings( settings, hasTemplate ) {
 	const { restBlockPatterns, restBlockPatternCategories } = useSelect(
 		( select ) => ( {
 			restBlockPatterns: select( coreStore ).getBlockPatterns(),
-			restBlockPatternCategories: select(
-				coreStore
-			).getBlockPatternCategories(),
+			restBlockPatternCategories:
+				select( coreStore ).getBlockPatternCategories(),
 		} ),
 		[]
 	);

package/src/components/template-validation-notice/index.js

@@ -53,9 +53,8 @@ export default compose( [
 		isValid: select( blockEditorStore ).isValidTemplate(),
 	} ) ),
 	withDispatch( ( dispatch ) => {
-		const { setTemplateValidity, synchronizeTemplate } = dispatch(
-			blockEditorStore
-		);
+		const { setTemplateValidity, synchronizeTemplate } =
+			dispatch( blockEditorStore );
 		return {
 			resetTemplateValidity: () => setTemplateValidity( true ),
 			synchronizeTemplate,

package/src/components/theme-support-check/index.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { castArray, includes, isArray, get, some } from 'lodash';
+import { castArray, includes, get, some } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -26,7 +26,7 @@ export function ThemeSupportCheck( {
 		// In the latter case, we need to verify `postType` exists
 		// within `supported`. If `postType` isn't passed, then the check
 		// should fail.
-		if ( 'post-thumbnails' === key && isArray( supported ) ) {
+		if ( 'post-thumbnails' === key && Array.isArray( supported ) ) {
 			return includes( supported, postType );
 		}
 		return supported;

package/src/hooks/custom-sources-backwards-compatibility.js

@@ -42,55 +42,56 @@ import { store as editorStore } from '../store';
  */
 const createWithMetaAttributeSource = ( metaAttributes ) =>
 	createHigherOrderComponent(
-		( BlockEdit ) => ( { attributes, setAttributes, ...props } ) => {
-			const postType = useSelect(
-				( select ) => select( editorStore ).getCurrentPostType(),
-				[]
-			);
-			const [ meta, setMeta ] = useEntityProp(
-				'postType',
-				postType,
-				'meta'
-			);
+		( BlockEdit ) =>
+			( { attributes, setAttributes, ...props } ) => {
+				const postType = useSelect(
+					( select ) => select( editorStore ).getCurrentPostType(),
+					[]
+				);
+				const [ meta, setMeta ] = useEntityProp(
+					'postType',
+					postType,
+					'meta'
+				);
 
-			const mergedAttributes = useMemo(
-				() => ( {
-					...attributes,
-					...mapValues(
-						metaAttributes,
-						( metaKey ) => meta[ metaKey ]
-					),
-				} ),
-				[ attributes, meta ]
-			);
+				const mergedAttributes = useMemo(
+					() => ( {
+						...attributes,
+						...mapValues(
+							metaAttributes,
+							( metaKey ) => meta[ metaKey ]
+						),
+					} ),
+					[ attributes, meta ]
+				);
 
-			return (
-				<BlockEdit
-					attributes={ mergedAttributes }
-					setAttributes={ ( nextAttributes ) => {
-						const nextMeta = mapKeys(
-							// Filter to intersection of keys between the updated
-							// attributes and those with an associated meta key.
-							pickBy(
-								nextAttributes,
-								( value, key ) => metaAttributes[ key ]
-							),
+				return (
+					<BlockEdit
+						attributes={ mergedAttributes }
+						setAttributes={ ( nextAttributes ) => {
+							const nextMeta = mapKeys(
+								// Filter to intersection of keys between the updated
+								// attributes and those with an associated meta key.
+								pickBy(
+									nextAttributes,
+									( value, key ) => metaAttributes[ key ]
+								),
 
-							// Rename the keys to the expected meta key name.
-							( value, attributeKey ) =>
-								metaAttributes[ attributeKey ]
-						);
+								// Rename the keys to the expected meta key name.
+								( value, attributeKey ) =>
+									metaAttributes[ attributeKey ]
+							);
 
-						if ( ! isEmpty( nextMeta ) ) {
-							setMeta( nextMeta );
-						}
+							if ( ! isEmpty( nextMeta ) ) {
+								setMeta( nextMeta );
+							}
 
-						setAttributes( nextAttributes );
-					} }
-					{ ...props }
-				/>
-			);
-		},
+							setAttributes( nextAttributes );
+						} }
+						{ ...props }
+					/>
+				);
+			},
 		'withMetaAttributeSource'
 	);