prep build 01/29

docs/getting-started/tutorial.md

@@ -715,7 +715,7 @@ Compare this to a statically rendered block like the Paragraph block.
 
 The HTML of the paragraph is stored in post content and saved in the database.
 
-You can learn more about dynamic and static rendering in the [Fundamentals documentation](https://developer.wordpress.org/block-editor/getting-started/fundamentals/). While most blocks are either dynamically or statically rendered, you can build a block that utilizes both methods.
+You can learn more about dynamic and static rendering in the [Fundamentals documentation](https://developer.wordpress.org/block-editor/getting-started/fundamentals/static-dynamic-rendering/). While most blocks are either dynamically or statically rendered, you can build a block that utilizes both methods.
 
 ### Why add static rendering?
 

packages/block-editor/src/components/block-inspector/index.js

@@ -56,9 +56,11 @@ function BlockInspectorLockedBlocks( { topLevelLockedBlock } ) {
 			/>
 			<BlockVariationTransforms blockClientId={ topLevelLockedBlock } />
 			<BlockInfo.Slot />
-			<PanelBody title={ __( 'Content' ) }>
-				<BlockQuickNavigation clientIds={ contentClientIds } />
-			</PanelBody>
+			{ contentClientIds.length > 0 && (
+				<PanelBody title={ __( 'Content' ) }>
+					<BlockQuickNavigation clientIds={ contentClientIds } />
+				</PanelBody>
+			) }
 		</div>
 	);
 }

packages/block-editor/src/components/block-list/block.js

@@ -555,7 +555,7 @@ function BlockListBlockProvider( props ) {
 			const typing = isTyping();
 			const hasLightBlockWrapper = blockType?.apiVersion > 1;
 			const movingClientId = hasBlockMovingClientId();
-
+			const blockEditingMode = getBlockEditingMode( clientId );
 			return {
 				mode: getBlockMode( clientId ),
 				isSelectionEnabled: isSelectionEnabled(),
@@ -574,7 +574,7 @@ function BlockListBlockProvider( props ) {
 				themeSupportsLayout: supportsLayout,
 				isTemporarilyEditingAsBlocks:
 					__unstableGetTemporarilyEditingAsBlocks() === clientId,
-				blockEditingMode: getBlockEditingMode( clientId ),
+				blockEditingMode,
 				mayDisplayControls:
 					_isSelected ||
 					( isFirstMultiSelectedBlock( clientId ) &&
@@ -590,7 +590,9 @@ function BlockListBlockProvider( props ) {
 				index: getBlockIndex( clientId ),
 				blockApiVersion: blockType?.apiVersion || 1,
 				blockTitle: match?.title || blockType?.title,
-				isSubtreeDisabled: isBlockSubtreeDisabled( clientId ),
+				isSubtreeDisabled:
+					blockEditingMode === 'disabled' &&
+					isBlockSubtreeDisabled( clientId ),
 				isOutlineEnabled: outlineMode,
 				hasOverlay: __unstableHasActiveBlockOverlayActive( clientId ),
 				initialPosition:
@@ -614,8 +616,7 @@ function BlockListBlockProvider( props ) {
 						getBlockName( movingClientId ),
 						getBlockRootClientId( clientId )
 					),
-				isEditingDisabled:
-					getBlockEditingMode( clientId ) === 'disabled',
+				isEditingDisabled: blockEditingMode === 'disabled',
 				className: hasLightBlockWrapper
 					? attributes.className
 					: undefined,

packages/block-editor/src/components/inner-blocks/index.js

@@ -71,7 +71,6 @@ function UncontrolledInnerBlocks( props ) {
 		layout,
 		name,
 		blockType,
-		innerBlocks,
 		parentLock,
 	} = props;
 
@@ -92,7 +91,6 @@ function UncontrolledInnerBlocks( props ) {
 
 	useInnerBlockTemplateSync(
 		clientId,
-		innerBlocks,
 		template,
 		templateLock,
 		templateInsertUpdatesSelection
@@ -193,7 +191,6 @@ export function useInnerBlocksProps( props = {}, options = {} ) {
 		hasOverlay,
 		name,
 		blockType,
-		innerBlocks,
 		parentLock,
 		parentClientId,
 		isDropZoneDisabled,
@@ -208,7 +205,6 @@ export function useInnerBlocksProps( props = {}, options = {} ) {
 				isBlockSelected,
 				hasSelectedInnerBlock,
 				__unstableGetEditorMode,
-				getBlocks,
 				getTemplateLock,
 				getBlockRootClientId,
 				__unstableIsWithinBlockOverlay,
@@ -234,7 +230,6 @@ export function useInnerBlocksProps( props = {}, options = {} ) {
 					enableClickThrough,
 				name: blockName,
 				blockType: getBlockType( blockName ),
-				innerBlocks: getBlocks( clientId ),
 				parentLock: getTemplateLock( _parentClientId ),
 				parentClientId: _parentClientId,
 				isDropZoneDisabled:
@@ -263,7 +258,6 @@ export function useInnerBlocksProps( props = {}, options = {} ) {
 		layout,
 		name,
 		blockType,
-		innerBlocks,
 		parentLock,
 		...options,
 	};

packages/block-editor/src/components/inner-blocks/index.native.js

@@ -105,17 +105,12 @@ function UncontrolledInnerBlocks( props ) {
 
 	const context = useBlockContext( clientId );
 
-	const { nestingLevel, innerBlocks, parentLock } = useSelect(
+	const { nestingLevel, parentLock } = useSelect(
 		( select ) => {
-			const {
-				getBlockParents,
-				getBlocks,
-				getTemplateLock,
-				getBlockRootClientId,
-			} = select( blockEditorStore );
+			const { getBlockParents, getTemplateLock, getBlockRootClientId } =
+				select( blockEditorStore );
 			return {
 				nestingLevel: getBlockParents( clientId )?.length,
-				innerBlocks: getBlocks( clientId ),
 				parentLock: getTemplateLock( getBlockRootClientId( clientId ) ),
 			};
 		},
@@ -139,7 +134,6 @@ function UncontrolledInnerBlocks( props ) {
 
 	useInnerBlockTemplateSync(
 		clientId,
-		innerBlocks,
 		template,
 		templateLock,
 		templateInsertUpdatesSelection

packages/block-editor/src/components/inner-blocks/use-inner-block-template-sync.js

@@ -23,7 +23,6 @@ import { store as blockEditorStore } from '../../store';
  * then we replace the inner blocks with the correct value after synchronizing it with the template.
  *
  * @param {string}  clientId                       The block client ID.
- * @param {Array}   innerBlocks
  * @param {Object}  template                       The template to match.
  * @param {string}  templateLock                   The template lock state for the inner blocks. For
  *                                                 example, if the template lock is set to "all",
@@ -37,7 +36,6 @@ import { store as blockEditorStore } from '../../store';
  */
 export default function useInnerBlockTemplateSync(
 	clientId,
-	innerBlocks,
 	template,
 	templateLock,
 	templateInsertUpdatesSelection
@@ -112,5 +110,5 @@ export default function useInnerBlockTemplateSync(
 		return () => {
 			isCancelled = true;
 		};
-	}, [ innerBlocks, template, templateLock, clientId ] );
+	}, [ template, templateLock, clientId ] );
 }

packages/block-editor/src/hooks/index.js

@@ -71,7 +71,7 @@ createBlockSaveFilter( [
 export { useCustomSides } from './dimensions';
 export { useLayoutClasses, useLayoutStyles } from './layout';
 export { getBorderClassesAndStyles, useBorderProps } from './use-border-props';
-export { getShadowClassesAndStyles, useShadowProps } from './use-shadow-props';
+export { getShadowClassesAndStyles } from './use-shadow-props';
 export { getColorClassesAndStyles, useColorProps } from './use-color-props';
 export { getSpacingClassesAndStyles } from './use-spacing-props';
 export { getTypographyClassesAndStyles } from './use-typography-props';

packages/block-editor/src/hooks/index.native.js

@@ -28,7 +28,7 @@ createBlockSaveFilter( [
 ] );
 
 export { getBorderClassesAndStyles, useBorderProps } from './use-border-props';
-export { getShadowClassesAndStyles, useShadowProps } from './use-shadow-props';
+export { getShadowClassesAndStyles } from './use-shadow-props';
 export { getColorClassesAndStyles, useColorProps } from './use-color-props';
 export { getSpacingClassesAndStyles } from './use-spacing-props';
 export { useCachedTruthy } from './use-cached-truthy';

packages/block-editor/src/hooks/use-shadow-props.js

@@ -18,20 +18,6 @@ export function getShadowClassesAndStyles( attributes ) {
 	const shadow = attributes.style?.shadow || '';
 
 	return {
-		className: undefined,
 		style: getInlineStyles( { shadow } ),
 	};
 }
-
-/**
- * Derives the shadow related props for a block from its shadow block support
- * attributes.
- *
- * @param {Object} attributes Block attributes.
- *
- * @return {Object} ClassName & style props from shadow block support.
- */
-export function useShadowProps( attributes ) {
-	const shadowProps = getShadowClassesAndStyles( attributes );
-	return shadowProps;
-}

packages/block-editor/src/index.js

@@ -12,7 +12,6 @@ export {
 	getSpacingClassesAndStyles as __experimentalGetSpacingClassesAndStyles,
 	getGapCSSValue as __experimentalGetGapCSSValue,
 	getShadowClassesAndStyles as __experimentalGetShadowClassesAndStyles,
-	useShadowProps as __experimentalUseShadowProps,
 	useCachedTruthy,
 } from './hooks';
 export * from './components';

packages/block-editor/src/store/private-selectors.js

@@ -45,13 +45,13 @@ export function getLastInsertedBlocksClientIds( state ) {
 }
 
 /**
- * Returns true if the block with the given client ID and all of its descendants
+ * Returns true if all of the descendants of a block with the given client ID
  * have an editing mode of 'disabled', or false otherwise.
  *
  * @param {Object} state    Global application state.
  * @param {string} clientId The block client ID.
  *
- * @return {boolean} Whether the block and its descendants are disabled.
+ * @return {boolean} Whether the block descendants are disabled.
  */
 export const isBlockSubtreeDisabled = createSelector(
 	( state, clientId ) => {
@@ -63,10 +63,7 @@ export const isBlockSubtreeDisabled = createSelector(
 				)
 			);
 		};
-		return (
-			getBlockEditingMode( state, clientId ) === 'disabled' &&
-			getBlockOrder( state, clientId ).every( isChildSubtreeDisabled )
-		);
+		return getBlockOrder( state, clientId ).every( isChildSubtreeDisabled );
 	},
 	( state ) => [
 		state.blocks.parents,

packages/block-library/src/button/edit.js

@@ -33,7 +33,7 @@ import {
 	__experimentalUseBorderProps as useBorderProps,
 	__experimentalUseColorProps as useColorProps,
 	__experimentalGetSpacingClassesAndStyles as useSpacingProps,
-	__experimentalUseShadowProps as useShadowProps,
+	__experimentalGetShadowClassesAndStyles as useShadowProps,
 	__experimentalLinkControl as LinkControl,
 	__experimentalGetElementClassName,
 	store as blockEditorStore,

packages/block-library/src/image/edit.js

@@ -94,7 +94,7 @@ function hasSize( image, size ) {
 export function ImageEdit( {
 	attributes,
 	setAttributes,
-	isSelected,
+	isSelected: isSingleSelected,
 	className,
 	insertBlocksAfter,
 	onReplace,
@@ -142,14 +142,7 @@ export function ImageEdit( {
 	}, [ align ] );
 
 	const ref = useRef();
-	const { imageDefaultSize, mediaUpload } = useSelect( ( select ) => {
-		const { getSettings } = select( blockEditorStore );
-		const settings = getSettings();
-		return {
-			imageDefaultSize: settings.imageDefaultSize,
-			mediaUpload: settings.mediaUpload,
-		};
-	}, [] );
+	const { getSettings } = useSelect( blockEditorStore );
 	const blockEditingMode = useBlockEditingMode();
 
 	const { createErrorNotice } = useDispatch( noticesStore );
@@ -183,6 +176,8 @@ export function ImageEdit( {
 
 		setTemporaryURL();
 
+		const { imageDefaultSize } = getSettings();
+
 		// Try to use the previous selected image size if its available
 		// otherwise try the default image size or fallback to "full"
 		let newSize = 'full';
@@ -265,7 +260,7 @@ export function ImageEdit( {
 			setAttributes( {
 				url: newURL,
 				id: undefined,
-				sizeSlug: imageDefaultSize,
+				sizeSlug: getSettings().imageDefaultSize,
 			} );
 		}
 	}
@@ -281,6 +276,10 @@ export function ImageEdit( {
 		const file = getBlobByURL( url );
 
 		if ( file ) {
+			const { mediaUpload } = getSettings();
+			if ( ! mediaUpload ) {
+				return;
+			}
 			mediaUpload( {
 				filesList: [ file ],
 				onFileChange: ( [ img ] ) => {
@@ -336,7 +335,7 @@ export function ImageEdit( {
 	// Much of this description is duplicated from MediaPlaceholder.
 	const { lockUrlControls = false } = useSelect(
 		( select ) => {
-			if ( ! isSelected ) {
+			if ( ! isSingleSelected ) {
 				return {};
 			}
 
@@ -352,14 +351,14 @@ export function ImageEdit( {
 					)?.lockAttributesEditing === true,
 			};
 		},
-		[ isSelected ]
+		[ isSingleSelected ]
 	);
 	const placeholder = ( content ) => {
 		return (
 			<Placeholder
 				className={ classnames( 'block-editor-media-placeholder', {
 					[ borderProps.className ]:
-						!! borderProps.className && ! isSelected,
+						!! borderProps.className && ! isSingleSelected,
 				} ) }
 				withIllustration={ true }
 				icon={ lockUrlControls ? pluginsIcon : icon }
@@ -400,7 +399,7 @@ export function ImageEdit( {
 				temporaryURL={ temporaryURL }
 				attributes={ attributes }
 				setAttributes={ setAttributes }
-				isSelected={ isSelected }
+				isSingleSelected={ isSingleSelected }
 				insertBlocksAfter={ insertBlocksAfter }
 				onReplace={ onReplace }
 				onSelectImage={ onSelectImage }