@wordpress/block-editor 15.8.1-next.dc3f6d3c1.0 → 15.9.1-next.8b30e05b0.0

package/build-style/content-rtl.css

@@ -279,6 +279,9 @@ _::-webkit-full-page-media, _:future, :root [data-has-multi-selection=true] .blo
 .block-editor-block-list__layout .block-editor-block-list__block[draggable=true], .block-editor-block-list__layout .block-editor-block-list__block[data-draggable=true] {
   cursor: grab;
 }
+.block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected {
+  cursor: default;
+}
 .block-editor-block-list__layout .block-editor-block-list__block[contenteditable],
 .block-editor-block-list__layout .block-editor-block-list__block [contenteditable] {
   cursor: text;

package/build-style/content.css

@@ -279,6 +279,9 @@ _::-webkit-full-page-media, _:future, :root [data-has-multi-selection=true] .blo
 .block-editor-block-list__layout .block-editor-block-list__block[draggable=true], .block-editor-block-list__layout .block-editor-block-list__block[data-draggable=true] {
   cursor: grab;
 }
+.block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected {
+  cursor: default;
+}
 .block-editor-block-list__layout .block-editor-block-list__block[contenteditable],
 .block-editor-block-list__layout .block-editor-block-list__block [contenteditable] {
   cursor: text;

package/build-style/style-rtl.css

@@ -531,6 +531,10 @@ iframe[name=editor-canvas] {
   right: 50%;
 }
 
+.block-editor-block-tools--is-dragging > .popover-slot {
+  display: none;
+}
+
 .block-editor-block-lock-modal {
   z-index: 1000001;
 }
@@ -1735,7 +1739,7 @@ block-editor-content-only-controls__media-thumbnail {
 }
 
 .block-editor-content-only-controls__screen.components-navigator-screen {
-  padding: 8px 0 0 0;
+  padding: 8px 0 16px 0;
 }
 .block-editor-content-only-controls__screen {
   border-top: 1px solid #e0e0e0;
@@ -1755,6 +1759,15 @@ block-editor-content-only-controls__media-thumbnail {
   width: 100%;
 }
 
+.block-editor-content-only-controls__fields-container {
+  padding: 0 16px;
+}
+
+.block-editor-content-only-controls__fields-header {
+  padding: 8px 0;
+  margin-bottom: 4px;
+}
+
 .block-editor-date-format-picker {
   margin: 0 0 16px;
   padding: 0;
@@ -1788,10 +1801,6 @@ block-editor-content-only-controls__media-thumbnail {
   text-transform: capitalize;
 }
 
-.block-editor-font-family-control:not(.is-next-has-no-margin-bottom) {
-  margin-bottom: 8px;
-}
-
 .block-editor-global-styles__toggle-icon {
   fill: currentColor;
 }

package/build-style/style.css

@@ -531,6 +531,10 @@ iframe[name=editor-canvas] {
   left: 50%;
 }
 
+.block-editor-block-tools--is-dragging > .popover-slot {
+  display: none;
+}
+
 .block-editor-block-lock-modal {
   z-index: 1000001;
 }
@@ -1735,7 +1739,7 @@ block-editor-content-only-controls__media-thumbnail {
 }
 
 .block-editor-content-only-controls__screen.components-navigator-screen {
-  padding: 8px 0 0 0;
+  padding: 8px 0 16px 0;
 }
 .block-editor-content-only-controls__screen {
   border-top: 1px solid #e0e0e0;
@@ -1755,6 +1759,15 @@ block-editor-content-only-controls__media-thumbnail {
   width: 100%;
 }
 
+.block-editor-content-only-controls__fields-container {
+  padding: 0 16px;
+}
+
+.block-editor-content-only-controls__fields-header {
+  padding: 8px 0;
+  margin-bottom: 4px;
+}
+
 .block-editor-date-format-picker {
   margin: 0 0 16px;
   padding: 0;
@@ -1788,10 +1801,6 @@ block-editor-content-only-controls__media-thumbnail {
   text-transform: capitalize;
 }
 
-.block-editor-font-family-control:not(.is-next-has-no-margin-bottom) {
-  margin-bottom: 8px;
-}
-
 .block-editor-global-styles__toggle-icon {
   fill: currentColor;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-editor",
-	"version": "15.8.1-next.dc3f6d3c1.0",
+	"version": "15.9.1-next.8b30e05b0.0",
 	"description": "Generic block editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -55,41 +55,42 @@
 		"@emotion/react": "^11.7.1",
 		"@emotion/styled": "^11.6.0",
 		"@react-spring/web": "^9.4.5",
-		"@wordpress/a11y": "^4.35.1-next.dc3f6d3c1.0",
-		"@wordpress/api-fetch": "^7.35.1-next.dc3f6d3c1.0",
-		"@wordpress/base-styles": "^6.11.1-next.dc3f6d3c1.0",
-		"@wordpress/blob": "^4.35.1-next.dc3f6d3c1.0",
-		"@wordpress/block-serialization-default-parser": "^5.35.1-next.dc3f6d3c1.0",
-		"@wordpress/blocks": "^15.8.1-next.dc3f6d3c1.0",
-		"@wordpress/commands": "^1.35.1-next.dc3f6d3c1.0",
-		"@wordpress/components": "^30.8.2-next.dc3f6d3c1.0",
-		"@wordpress/compose": "^7.35.1-next.dc3f6d3c1.0",
-		"@wordpress/data": "^10.35.1-next.dc3f6d3c1.0",
-		"@wordpress/date": "^5.35.1-next.dc3f6d3c1.0",
-		"@wordpress/deprecated": "^4.35.1-next.dc3f6d3c1.0",
-		"@wordpress/dom": "^4.35.1-next.dc3f6d3c1.0",
-		"@wordpress/element": "^6.35.1-next.dc3f6d3c1.0",
-		"@wordpress/escape-html": "^3.35.1-next.dc3f6d3c1.0",
-		"@wordpress/global-styles-engine": "^1.2.1-next.dc3f6d3c1.0",
-		"@wordpress/hooks": "^4.35.1-next.dc3f6d3c1.0",
-		"@wordpress/html-entities": "^4.35.1-next.dc3f6d3c1.0",
-		"@wordpress/i18n": "^6.8.1-next.dc3f6d3c1.0",
-		"@wordpress/icons": "^11.2.1-next.dc3f6d3c1.0",
-		"@wordpress/interactivity": "^6.35.1-next.dc3f6d3c1.0",
-		"@wordpress/is-shallow-equal": "^5.35.1-next.dc3f6d3c1.0",
-		"@wordpress/keyboard-shortcuts": "^5.35.1-next.dc3f6d3c1.0",
-		"@wordpress/keycodes": "^4.35.1-next.dc3f6d3c1.0",
-		"@wordpress/notices": "^5.35.1-next.dc3f6d3c1.0",
-		"@wordpress/preferences": "^4.35.1-next.dc3f6d3c1.0",
-		"@wordpress/priority-queue": "^3.35.1-next.dc3f6d3c1.0",
-		"@wordpress/private-apis": "^1.35.1-next.dc3f6d3c1.0",
-		"@wordpress/rich-text": "^7.35.1-next.dc3f6d3c1.0",
-		"@wordpress/style-engine": "^2.35.1-next.dc3f6d3c1.0",
-		"@wordpress/token-list": "^3.35.1-next.dc3f6d3c1.0",
-		"@wordpress/upload-media": "^0.20.1-next.dc3f6d3c1.0",
-		"@wordpress/url": "^4.35.1-next.dc3f6d3c1.0",
-		"@wordpress/warning": "^3.35.1-next.dc3f6d3c1.0",
-		"@wordpress/wordcount": "^4.35.1-next.dc3f6d3c1.0",
+		"@wordpress/a11y": "^4.36.1-next.8b30e05b0.0",
+		"@wordpress/api-fetch": "^7.36.1-next.8b30e05b0.0",
+		"@wordpress/base-styles": "^6.12.1-next.8b30e05b0.0",
+		"@wordpress/blob": "^4.36.1-next.8b30e05b0.0",
+		"@wordpress/block-serialization-default-parser": "^5.36.1-next.8b30e05b0.0",
+		"@wordpress/blocks": "^15.9.1-next.8b30e05b0.0",
+		"@wordpress/commands": "^1.36.1-next.8b30e05b0.0",
+		"@wordpress/components": "^30.9.1-next.8b30e05b0.0",
+		"@wordpress/compose": "^7.36.1-next.8b30e05b0.0",
+		"@wordpress/data": "^10.36.1-next.8b30e05b0.0",
+		"@wordpress/dataviews": "^11.0.1-next.8b30e05b0.0",
+		"@wordpress/date": "^5.36.1-next.8b30e05b0.0",
+		"@wordpress/deprecated": "^4.36.1-next.8b30e05b0.0",
+		"@wordpress/dom": "^4.36.1-next.8b30e05b0.0",
+		"@wordpress/element": "^6.36.1-next.8b30e05b0.0",
+		"@wordpress/escape-html": "^3.36.1-next.8b30e05b0.0",
+		"@wordpress/global-styles-engine": "^1.3.1-next.8b30e05b0.0",
+		"@wordpress/hooks": "^4.36.1-next.8b30e05b0.0",
+		"@wordpress/html-entities": "^4.36.1-next.8b30e05b0.0",
+		"@wordpress/i18n": "^6.9.1-next.8b30e05b0.0",
+		"@wordpress/icons": "^11.3.1-next.8b30e05b0.0",
+		"@wordpress/interactivity": "^6.36.1-next.8b30e05b0.0",
+		"@wordpress/is-shallow-equal": "^5.36.1-next.8b30e05b0.0",
+		"@wordpress/keyboard-shortcuts": "^5.36.1-next.8b30e05b0.0",
+		"@wordpress/keycodes": "^4.36.1-next.8b30e05b0.0",
+		"@wordpress/notices": "^5.36.1-next.8b30e05b0.0",
+		"@wordpress/preferences": "^4.36.1-next.8b30e05b0.0",
+		"@wordpress/priority-queue": "^3.36.1-next.8b30e05b0.0",
+		"@wordpress/private-apis": "^1.36.1-next.8b30e05b0.0",
+		"@wordpress/rich-text": "^7.36.1-next.8b30e05b0.0",
+		"@wordpress/style-engine": "^2.36.1-next.8b30e05b0.0",
+		"@wordpress/token-list": "^3.36.1-next.8b30e05b0.0",
+		"@wordpress/upload-media": "^0.21.1-next.8b30e05b0.0",
+		"@wordpress/url": "^4.36.1-next.8b30e05b0.0",
+		"@wordpress/warning": "^3.36.1-next.8b30e05b0.0",
+		"@wordpress/wordcount": "^4.36.1-next.8b30e05b0.0",
 		"change-case": "^4.1.2",
 		"clsx": "^2.1.1",
 		"colord": "^2.7.0",
@@ -112,5 +113,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "f73b5e69b34fbaccfb8c47783f4f993059ff1a41"
+	"gitHead": "2466f6bc223f8be98c55e1ac7270e8c3e413eaaf"
 }

package/src/components/block-list/content.scss

@@ -222,6 +222,11 @@ _::-webkit-full-page-media, _:future, :root [data-has-multi-selection="true"] .b
 		cursor: grab;
 	}
 
+	// Dragging multi selected blocks is not supported yet.
+	&.is-multi-selected {
+		cursor: default;
+	}
+
 	&[contenteditable],
 	[contenteditable] {
 		cursor: text;

package/src/components/block-list/index.js

@@ -226,6 +226,8 @@ function Items( {
 				rootClientId === selectedBlockClientId
 			);
 
+			const templateLock = getTemplateLock( rootClientId );
+
 			return {
 				order: _order,
 				selectedBlocks: selectedBlockClientIds,
@@ -238,7 +240,7 @@ function Items( {
 							rootClientId
 						) ) &&
 					getBlockEditingMode( rootClientId ) !== 'disabled' &&
-					! getTemplateLock( rootClientId ) &&
+					( ! templateLock || templateLock === 'contentOnly' ) &&
 					hasAppender &&
 					! _isZoomOut() &&
 					( hasCustomAppender ||

package/src/components/block-list/use-block-props/use-selected-block-event-handlers.js

@@ -25,15 +25,20 @@ function isColorTransparent( color ) {
  * @param {string} clientId Block client ID.
  */
 export function useEventHandlers( { clientId, isSelected } ) {
-	const { getBlockRootClientId, isZoomOut, hasMultiSelection } = unlock(
-		useSelect( blockEditorStore )
-	);
+	const {
+		getBlockRootClientId,
+		isZoomOut,
+		hasMultiSelection,
+		isSectionBlock,
+		editedContentOnlySection,
+	} = unlock( useSelect( blockEditorStore ) );
 	const {
 		insertAfterBlock,
 		removeBlock,
 		resetZoomLevel,
 		startDraggingBlocks,
 		stopDraggingBlocks,
+		editContentOnlySection,
 	} = unlock( useDispatch( blockEditorStore ) );
 
 	return useRefEffect(
@@ -282,9 +287,32 @@ export function useEventHandlers( { clientId, isSelected } ) {
 			node.addEventListener( 'keydown', onKeyDown );
 			node.addEventListener( 'dragstart', onDragStart );
 
+			/**
+			 * Handles double-click events on section blocks to edit content only section.
+			 *
+			 * @param {MouseEvent} event Double-click event.
+			 */
+			function onDoubleClick( event ) {
+				const isSection = isSectionBlock( clientId );
+				const isAlreadyEditing = editedContentOnlySection === clientId;
+
+				if ( isSection && ! isAlreadyEditing ) {
+					event.preventDefault();
+					editContentOnlySection( clientId );
+				}
+			}
+
+			// Only add double-click listener if experimental flag is enabled
+			if ( window?.__experimentalContentOnlyPatternInsertion ) {
+				node.addEventListener( 'dblclick', onDoubleClick );
+			}
+
 			return () => {
 				node.removeEventListener( 'keydown', onKeyDown );
 				node.removeEventListener( 'dragstart', onDragStart );
+				if ( window?.__experimentalContentOnlyPatternInsertion ) {
+					node.removeEventListener( 'dblclick', onDoubleClick );
+				}
 			};
 		},
 		[
@@ -298,6 +326,9 @@ export function useEventHandlers( { clientId, isSelected } ) {
 			hasMultiSelection,
 			startDraggingBlocks,
 			stopDraggingBlocks,
+			isSectionBlock,
+			editedContentOnlySection,
+			editContentOnlySection,
 		]
 	);
 }

package/src/components/block-lock/modal.js

@@ -42,7 +42,8 @@ function getTemplateLockValue( lock ) {
 
 export default function BlockLockModal( { clientId, onClose } ) {
 	const [ lock, setLock ] = useState( { move: false, remove: false } );
-	const { canEdit, canMove, canRemove } = useBlockLock( clientId );
+	const { isEditLocked, isMoveLocked, isRemoveLocked } =
+		useBlockLock( clientId );
 	const { allowsEditLocking, templateLock, hasTemplateLock } = useSelect(
 		( select ) => {
 			const { getBlockName, getBlockAttributes } =
@@ -66,11 +67,11 @@ export default function BlockLockModal( { clientId, onClose } ) {
 
 	useEffect( () => {
 		setLock( {
-			move: ! canMove,
-			remove: ! canRemove,
-			...( allowsEditLocking ? { edit: ! canEdit } : {} ),
+			move: isMoveLocked,
+			remove: isRemoveLocked,
+			...( allowsEditLocking ? { edit: isEditLocked } : {} ),
 		} );
-	}, [ canEdit, canMove, canRemove, allowsEditLocking ] );
+	}, [ isEditLocked, isMoveLocked, isRemoveLocked, allowsEditLocking ] );
 
 	const isAllChecked = Object.values( lock ).every( Boolean );
 	const isMixed = Object.values( lock ).some( Boolean ) && ! isAllChecked;

package/src/components/block-lock/use-block-lock.js

@@ -7,6 +7,7 @@ import { useSelect } from '@wordpress/data';
  * Internal dependencies
  */
 import { store as blockEditorStore } from '../../store';
+import { unlock } from '../../lock-unlock';
 
 /**
  * Return details about the block lock status.
@@ -19,25 +20,20 @@ export default function useBlockLock( clientId ) {
 	return useSelect(
 		( select ) => {
 			const {
-				canEditBlock,
-				canMoveBlock,
-				canRemoveBlock,
 				canLockBlockType,
 				getBlockName,
-				getTemplateLock,
-			} = select( blockEditorStore );
-
-			const canEdit = canEditBlock( clientId );
-			const canMove = canMoveBlock( clientId );
-			const canRemove = canRemoveBlock( clientId );
+				isEditLockedBlock,
+				isMoveLockedBlock,
+				isRemoveLockedBlock,
+				isLockedBlock,
+			} = unlock( select( blockEditorStore ) );
 
 			return {
-				canEdit,
-				canMove,
-				canRemove,
+				isEditLocked: isEditLockedBlock( clientId ),
+				isMoveLocked: isMoveLockedBlock( clientId ),
+				isRemoveLocked: isRemoveLockedBlock( clientId ),
 				canLock: canLockBlockType( getBlockName( clientId ) ),
-				isContentLocked: getTemplateLock( clientId ) === 'contentOnly',
-				isLocked: ! canEdit || ! canMove || ! canRemove,
+				isLocked: isLockedBlock( clientId ),
 			};
 		},
 		[ clientId ]

package/src/components/block-patterns-list/stories/{index.story.js → index.story.jsx}

@@ -2,6 +2,7 @@
  * External dependencies
  */
 import blockLibraryStyles from '!!raw-loader!../../../../../block-library/build-style/style.css';
+import { fn } from '@storybook/test';
 
 /**
  * Internal dependencies
@@ -32,6 +33,8 @@ export const Default = {
 		isDraggable: false,
 		label: 'Block patterns story',
 		showTitlesAsTooltip: false,
+		onClickPattern: fn(),
+		onHover: fn(),
 	},
 	argTypes: {
 		blockPatterns: { description: 'The patterns to render.' },
@@ -58,7 +61,6 @@ export const Default = {
 		},
 	},
 	parameters: {
-		actions: { argTypesRegex: '^on.*' },
 		controls: { expanded: true },
 	},
 };

package/src/components/block-settings-menu-controls/index.js

@@ -50,7 +50,7 @@ const BlockSettingsMenuControlsSlot = ( { fillProps, clientIds = null } ) => {
 				canToggleSelectedBlocksVisibility: getBlocksByClientId(
 					ids
 				).every( ( block ) =>
-					hasBlockSupport( block.name, 'blockVisibility', true )
+					hasBlockSupport( block.name, 'visibility', true )
 				),
 			};
 		},

package/src/components/block-tools/index.js

@@ -1,3 +1,8 @@
+/**
+ * External dependencies
+ */
+import clsx from 'clsx';
+
 /**
  * WordPress dependencies
  */
@@ -219,7 +224,7 @@ export default function BlockTools( {
 				const canToggleBlockVisibility = blocks.every( ( block ) =>
 					hasBlockSupport(
 						getBlockName( block.clientId ),
-						'blockVisibility',
+						'visibility',
 						true
 					)
 				);
@@ -262,7 +267,15 @@ export default function BlockTools( {
 
 	return (
 		// eslint-disable-next-line jsx-a11y/no-static-element-interactions
-		<div { ...props } onKeyDown={ onKeyDown }>
+		<div
+			{ ...props }
+			onKeyDown={ onKeyDown }
+			// Popover slots cannot be unmounted during dragging because the
+			// will just be rendered in a fallback popover slot instead.
+			className={ clsx( props.className, {
+				'block-editor-block-tools--is-dragging': isDragging,
+			} ) }
+		>
 			<InsertionPointOpenRef.Provider value={ useRef( false ) }>
 				{ ! isTyping && ! isZoomOutMode && (
 					<InsertionPoint

package/src/components/block-tools/style.scss

@@ -206,3 +206,7 @@
 	top: 50%;
 	left: 50%;
 }
+
+.block-editor-block-tools--is-dragging > .popover-slot {
+	display: none;
+}

package/src/components/block-visibility/toolbar.js

@@ -25,7 +25,7 @@ export default function BlockVisibilityToolbar( { clientIds } ) {
 				canToggleBlockVisibility: _blocks.every( ( { clientId } ) =>
 					hasBlockSupport(
 						getBlockName( clientId ),
-						'blockVisibility',
+						'visibility',
 						true
 					)
 				),

package/src/components/content-only-controls/fields-dropdown-menu.js

@@ -0,0 +1,53 @@
+/**
+ * WordPress dependencies
+ */
+import { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';
+import { moreVertical, check } from '@wordpress/icons';
+import { __ } from '@wordpress/i18n';
+
+/**
+ * Internal dependencies
+ */
+import { useInspectorPopoverPlacement } from './use-inspector-popover-placement';
+
+export default function FieldsDropdownMenu( {
+	fields,
+	visibleFields,
+	onToggleField,
+} ) {
+	const { popoverProps } = useInspectorPopoverPlacement();
+
+	if ( ! fields || fields.length === 0 ) {
+		return null;
+	}
+
+	return (
+		<DropdownMenu
+			icon={ moreVertical }
+			label={ __( 'Options' ) }
+			popoverProps={ popoverProps }
+		>
+			{ ( { onClose } ) => (
+				<MenuGroup label={ __( 'Show / Hide' ) }>
+					{ fields.map( ( field ) => {
+						const isVisible = visibleFields.includes( field.id );
+						return (
+							<MenuItem
+								key={ field.id }
+								isSelected={ isVisible }
+								onClick={ () => {
+									onToggleField( field.id );
+									onClose();
+								} }
+								role="menuitemcheckbox"
+								icon={ isVisible ? check : null }
+							>
+								{ field.label }
+							</MenuItem>
+						);
+					} ) }
+				</MenuGroup>
+			) }
+		</DropdownMenu>
+	);
+}