@wordpress/editor 14.32.0 → 14.32.1-next.ff1cebbba.0

package/src/components/editor-notices/style.scss

@@ -1,3 +1,6 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 // Dismissible & non-dismissible notices.
 .components-editor-notices__dismissible,
 .components-editor-notices__pinned {

package/src/components/entities-saved-states/style.scss

@@ -1,3 +1,6 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 .entities-saved-states__panel-header {
 	box-sizing: border-box;
 	background: $white;

package/src/components/error-boundary/style.scss

@@ -1,3 +1,6 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-error-boundary {
 	font-family: $default-font;
 	margin: auto;

package/src/components/header/index.js

@@ -33,9 +33,6 @@ import {
 } from '../../store/constants';
 import { unlock } from '../../lock-unlock';
 
-const isBlockCommentExperimentEnabled =
-	window?.__experimentalEnableBlockComment;
-
 const toolbarVariations = {
 	distractionFreeDisabled: { y: '-50px' },
 	distractionFreeHover: { y: 0 },
@@ -197,11 +194,9 @@ function Header( {
 					/>
 				) }
 
-				{ isBlockCommentExperimentEnabled && (
-					<PostTypeSupportCheck supportKeys="editor.block-comments">
-						<CollabSidebar />
-					</PostTypeSupportCheck>
-				) }
+				<PostTypeSupportCheck supportKeys="editor.notes">
+					<CollabSidebar />
+				</PostTypeSupportCheck>
 
 				{ customSaveButton }
 				<MoreMenu />

package/src/components/header/style.scss

@@ -1,3 +1,9 @@
+@use "@wordpress/base-styles/breakpoints" as *;
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/mixins" as *;
+@use "@wordpress/base-styles/variables" as *;
+@use "@wordpress/base-styles/z-index" as *;
+
 .editor-header {
 	@include reset;
 	height: $header-height;

package/src/components/inserter-sidebar/style.scss

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/mixins" as *;
+
 .editor-inserter-sidebar {
 	@include reset;
 

package/src/components/keyboard-shortcut-help-modal/style.scss

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/colors" as *;
+
 .editor-keyboard-shortcut-help-modal {
 	&__section {
 		margin: 0 0 2rem 0;

package/src/components/list-view-sidebar/style.scss

@@ -1,3 +1,7 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/mixins" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-list-view-sidebar {
 	height: 100%;
 
@@ -52,4 +56,3 @@
 		color: $gray-700;
 	}
 }
-

package/src/components/page-attributes/style.scss

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-parent__panel,
 .editor-post-order__panel {
 	padding-top: $grid-unit-10;

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

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/z-index" as *;
+
 .editor-action-modal {
 	z-index: z-index(".editor-action-modal");
 }

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

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-author__panel {
 	padding-top: $grid-unit-10;
 }

package/src/components/post-card-panel/style.scss

@@ -1,3 +1,7 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/mixins" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-card-panel {
 	&__content {
 		flex-grow: 1;

package/src/components/post-content-information/style.scss

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/colors" as *;
+
 .editor-post-content-information {
 	color: $gray-700;
 	& .components-text {

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

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-discussion__panel-dialog .editor-post-discussion {
 	// sidebar width - popover padding - form margin
 	min-width: $sidebar-width - $grid-unit-20 - $grid-unit-20;

package/src/components/post-excerpt/panel.js

@@ -23,6 +23,7 @@ import PostExcerptCheck from './check';
 import PluginPostExcerpt from './plugin';
 import { TEMPLATE_ORIGINS } from '../../store/constants';
 import { store as editorStore } from '../../store';
+import { getTemplateInfo } from '../../utils/get-template-info';
 
 /**
  * Module Constants
@@ -109,7 +110,6 @@ function PrivateExcerpt() {
 				getCurrentPostId,
 				getEditedPostAttribute,
 				isEditorPanelEnabled,
-				__experimentalGetDefaultTemplateType,
 			} = select( editorStore );
 			const postType = getCurrentPostType();
 			const isTemplateOrTemplatePart = [
@@ -124,6 +124,7 @@ function PrivateExcerpt() {
 			const _usedAttribute = isTemplateOrTemplatePart
 				? 'description'
 				: 'excerpt';
+			const _excerpt = getEditedPostAttribute( _usedAttribute );
 			// We need to fetch the entity in this case to check if we'll allow editing.
 			const template =
 				isTemplateOrTemplatePart &&
@@ -132,17 +133,22 @@ function PrivateExcerpt() {
 					postType,
 					getCurrentPostId()
 				);
-			const fallback = isTemplateOrTemplatePart
-				? __experimentalGetDefaultTemplateType( template.slug )
-						.description
-				: undefined;
+			const fallback =
+				! _excerpt && isTemplateOrTemplatePart
+					? getTemplateInfo( {
+							template,
+							templateTypes:
+								select( coreStore ).getCurrentTheme()
+									?.default_template_types,
+					  } )?.description
+					: undefined;
 			// For post types that use excerpt as description, we do not abide
 			// by the `isEnabled` panel flag in order to render them as text.
 			const _shouldRender =
 				isEditorPanelEnabled( PANEL_NAME ) ||
 				_shouldBeUsedAsDescription;
 			return {
-				excerpt: getEditedPostAttribute( _usedAttribute ) ?? fallback,
+				excerpt: _excerpt ?? fallback,
 				shouldRender: _shouldRender,
 				shouldBeUsedAsDescription: _shouldBeUsedAsDescription,
 				// If we should render, allow editing for all post types that are not used as description.

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

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-excerpt__textarea {
 	width: 100%;
 	margin-bottom: 10px;

package/src/components/post-featured-image/style.scss

@@ -1,6 +1,13 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-featured-image {
 	padding: 0;
 
+	.hidden {
+		display: none;
+	}
+
 	.components-spinner {
 		position: absolute;
 		top: 50%;

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

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 [class].editor-post-format__suggestion {
 	margin: $grid-unit-05 0 0 0;
 }

package/src/components/post-last-edited-panel/style.scss

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/colors" as *;
+
 .editor-post-last-edited-panel {
 	color: $gray-700;
 	& .components-text {

package/src/components/post-last-revision/style.scss

@@ -1,3 +1,6 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-last-revision__title {
 	width: 100%;
 	font-weight: 500;

package/src/components/post-locked-modal/style.scss

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-locked-modal__buttons {
 	margin-top: $grid-unit-30;
 }

package/src/components/post-panel-row/style.scss

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-panel__row {
 	width: 100%;
 	min-height: $grid-unit-40;

package/src/components/post-panel-section/style.scss

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-panel__section {
 	padding: $grid-unit-20;
 }

package/src/components/post-publish-button/post-publish-button-or-toggle.js

@@ -35,7 +35,7 @@ export default function PostPublishButtonOrToggle( {
 			hasPublishAction:
 				!! select( editorStore ).getCurrentPost()?._links?.[
 					'wp:action-publish'
-				] ?? false,
+				],
 			isBeingScheduled:
 				select( editorStore ).isEditedPostBeingScheduled(),
 			isPending: select( editorStore ).isCurrentPostPending(),

package/src/components/post-publish-panel/style.scss

@@ -1,3 +1,8 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/mixins" as *;
+@use "@wordpress/base-styles/variables" as *;
+@use "@wordpress/base-styles/z-index" as *;
+
 .editor-post-publish-panel__content {
 	// Ensure the post-publish panel accounts for the header and footer height.
 	min-height: calc(100% - #{$header-height + 84px});

package/src/components/post-saved-state/style.scss

@@ -1,3 +1,7 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/mixins" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-saved-state {
 	display: flex;
 	align-items: center;

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

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-schedule__panel-dropdown {
 	width: 100%;
 }

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

@@ -1,3 +1,6 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-status {
 	max-width: 100%;
 

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

@@ -1,3 +1,6 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-sticky__checkbox-control {
 	border-top: $border-width solid $gray-200;
 	padding-top: $grid-unit-20;

package/src/components/post-sync-status/style.scss

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-sync-status__value {
 	// Match padding on tertiary buttons for alignment.
 	padding: $grid-unit-15 * 0.5 0 $grid-unit-15 * 0.5 $grid-unit-15;

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

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-taxonomies__hierarchical-terms-list {
 	max-height: 14em;
 	overflow: auto;

package/src/components/post-template/block-theme.js

@@ -31,10 +31,15 @@ export default function BlockThemeControl( { id } ) {
 		onNavigateToEntityRecord,
 		getEditorSettings,
 		hasGoBack,
+		hasSpecificTemplate,
 	} = useSelect( ( select ) => {
-		const { getRenderingMode, getEditorSettings: _getEditorSettings } =
-			unlock( select( editorStore ) );
+		const {
+			getRenderingMode,
+			getEditorSettings: _getEditorSettings,
+			getCurrentPost,
+		} = unlock( select( editorStore ) );
 		const editorSettings = _getEditorSettings();
+		const currentPost = getCurrentPost();
 		return {
 			isTemplateHidden: getRenderingMode() === 'post-only',
 			onNavigateToEntityRecord: editorSettings.onNavigateToEntityRecord,
@@ -42,6 +47,7 @@ export default function BlockThemeControl( { id } ) {
 			hasGoBack: editorSettings.hasOwnProperty(
 				'onNavigateToPreviousEntityRecord'
 			),
+			hasSpecificTemplate: !! currentPost.template,
 		};
 	}, [] );
 
@@ -52,6 +58,8 @@ export default function BlockThemeControl( { id } ) {
 		'wp_template',
 		id
 	);
+	const { getEntityRecord } = useSelect( coreStore );
+	const { editEntityRecord } = useDispatch( coreStore );
 	const { createSuccessNotice } = useDispatch( noticesStore );
 	const { setRenderingMode, setDefaultRenderingMode } = unlock(
 		useDispatch( editorStore )
@@ -126,11 +134,45 @@ export default function BlockThemeControl( { id } ) {
 						<MenuGroup>
 							{ canCreateTemplate && (
 								<MenuItem
-									onClick={ () => {
+									onClick={ async () => {
 										onNavigateToEntityRecord( {
 											postId: template.id,
 											postType: 'wp_template',
 										} );
+										// When editing a global template,
+										// activate the auto-draft. This is not
+										// immediately live (we're not saving
+										// site options), and when nothing is
+										// saved, the setting will be ignored.
+										// In the future, we should make the
+										// duplication explicit, so there
+										// wouldn't be an "edit" button for
+										// static theme templates.
+										if ( ! hasSpecificTemplate ) {
+											const activeTemplates =
+												await getEntityRecord(
+													'root',
+													'site'
+												).active_templates;
+											if (
+												activeTemplates[
+													template.slug
+												] !== template.id
+											) {
+												editEntityRecord(
+													'root',
+													'site',
+													undefined,
+													{
+														active_templates: {
+															...activeTemplates,
+															[ template.slug ]:
+																template.id,
+														},
+													}
+												);
+											}
+										}
 										onClose();
 										mayShowTemplateEditNotice();
 									} }

package/src/components/post-template/hooks.js

@@ -55,27 +55,54 @@ function useTemplates( postType ) {
 	// To do: create a new selector to checks if templates exist at all instead
 	// of and unbound request. In the modal, the user templates should be
 	// paginated and we should not make an unbound request.
-	const { staticTemplates, templates } = useSelect(
-		( select ) => {
-			return {
-				staticTemplates: select( coreStore ).getEntityRecords(
-					'postType',
-					'wp_registered_template',
-					{ per_page: -1, post_type: postType }
-				),
-				templates: select( coreStore ).getEntityRecords(
-					'postType',
-					'wp_template',
-					{ per_page: -1, post_type: postType }
-				),
-			};
-		},
-		[ postType ]
-	);
-	return useMemo(
-		() => [ ...( staticTemplates || [] ), ...( templates || [] ) ],
-		[ staticTemplates, templates ]
-	);
+	const { defaultTemplateTypes, registeredTemplates, userTemplates } =
+		useSelect(
+			( select ) => {
+				return {
+					defaultTemplateTypes:
+						select( coreStore ).getCurrentTheme()
+							?.default_template_types,
+					registeredTemplates: select( coreStore ).getEntityRecords(
+						'postType',
+						'wp_registered_template',
+						{
+							per_page: -1,
+							post_type: postType,
+						}
+					),
+					userTemplates: select( coreStore ).getEntityRecords(
+						'postType',
+						'wp_template',
+						{ per_page: -1, combinedTemplates: false }
+					),
+				};
+			},
+			[ postType ]
+		);
+
+	return useMemo( () => {
+		if (
+			! defaultTemplateTypes ||
+			! registeredTemplates ||
+			! userTemplates
+		) {
+			return [];
+		}
+		return [
+			...registeredTemplates,
+			...userTemplates.filter(
+				( template ) =>
+					// Only give "custom" templates as an option, which
+					// means the is_wp_suggestion meta field is not set and
+					// the slug is not found in the default template types.
+					// https://github.com/WordPress/wordpress-develop/blob/97382397b2bd7c85aef6d4cd1c10bafd397957fc/src/wp-includes/block-template-utils.php#L858-L867
+					! template.meta.is_wp_suggestion &&
+					! defaultTemplateTypes.find(
+						( type ) => type.slug === template.slug
+					)
+			),
+		];
+	}, [ registeredTemplates, userTemplates, defaultTemplateTypes ] );
 }
 
 export function useAvailableTemplates( postType ) {

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

@@ -1,3 +1,8 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/mixins" as *;
+@use "@wordpress/base-styles/variables" as *;
+@use "@wordpress/base-styles/z-index" as *;
+
 .editor-post-template__swap-template-modal {
 	z-index: z-index(".editor-post-template__swap-template-modal");
 

package/src/components/post-text-editor/style.scss

@@ -1,3 +1,7 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/mixins" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 textarea.editor-post-text-editor {
 	border: $border-width solid $gray-600;
 	border-radius: 0;

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

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 // Raw Text Variant
 .editor-post-title.is-raw-text {
 	margin-bottom: $grid-unit-30;

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

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-post-url__panel-dropdown {
 	width: 100%;
 }

package/src/components/posts-per-page/style.scss

@@ -1,3 +1,5 @@
+@use "@wordpress/base-styles/variables" as *;
+
 .editor-posts-per-page-dropdown__content .components-popover__content {
 	min-width: 320px;
 	padding: $grid-unit-20;

package/src/components/preferences-modal/index.js

@@ -18,7 +18,7 @@ import { store as interfaceStore } from '@wordpress/interface';
 import EnablePanelOption from './enable-panel';
 import EnablePluginDocumentSettingPanelOption from './enable-plugin-document-setting-panel';
 import EnablePublishSidebarOption from './enable-publish-sidebar';
-import BlockVisibility from './block-visibility';
+import BlockVisibility from '../block-visibility';
 import PostTaxonomies from '../post-taxonomies';
 import PostFeaturedImageCheck from '../post-featured-image/check';
 import PostExcerptCheck from '../post-excerpt/check';

package/src/components/provider/disable-non-page-content-blocks.js

@@ -16,12 +16,10 @@ import usePostContentBlocks from './use-post-content-blocks';
  */
 export default function DisableNonPageContentBlocks() {
 	const contentOnlyIds = usePostContentBlocks();
-	const { templateParts, isNavigationMode } = useSelect( ( select ) => {
-		const { getBlocksByName, isNavigationMode: _isNavigationMode } =
-			select( blockEditorStore );
+	const { templateParts } = useSelect( ( select ) => {
+		const { getBlocksByName } = select( blockEditorStore );
 		return {
 			templateParts: getBlocksByName( 'core/template-part' ),
-			isNavigationMode: _isNavigationMode(),
 		};
 	}, [] );
 	const disabledIds = useSelect(
@@ -79,23 +77,19 @@ export default function DisableNonPageContentBlocks() {
 			registry.dispatch( blockEditorStore );
 
 		registry.batch( () => {
-			if ( ! isNavigationMode ) {
-				for ( const clientId of templateParts ) {
-					setBlockEditingMode( clientId, 'contentOnly' );
-				}
+			for ( const clientId of templateParts ) {
+				setBlockEditingMode( clientId, 'contentOnly' );
 			}
 		} );
 
 		return () => {
 			registry.batch( () => {
-				if ( ! isNavigationMode ) {
-					for ( const clientId of templateParts ) {
-						unsetBlockEditingMode( clientId );
-					}
+				for ( const clientId of templateParts ) {
+					unsetBlockEditingMode( clientId );
 				}
 			} );
 		};
-	}, [ templateParts, isNavigationMode, registry ] );
+	}, [ templateParts, registry ] );
 
 	useEffect( () => {
 		const { setBlockEditingMode, unsetBlockEditingMode } =

package/src/components/provider/use-hide-blocks-from-inserter.js

@@ -3,11 +3,13 @@
  */
 import { useEffect } from '@wordpress/element';
 import { addFilter, removeFilter } from '@wordpress/hooks';
+import { useSelect } from '@wordpress/data';
+import { store as coreStore } from '@wordpress/core-data';
 
 // These post types are "structural" block lists.
-// We should be allowed to use
-// the post content and template parts blocks within them.
-const POST_TYPES_ALLOWING_POST_CONTENT_TEMPLATE_PART = [
+// We should be allowed to use the post content,
+// template parts and breadcrumbs blocks within them.
+const POST_TYPES_ALLOWING_POST_CONTENT_TEMPLATE_PART_BREADCRUMBS = [
 	'wp_block',
 	'wp_template',
 	'wp_template_part',
@@ -21,6 +23,10 @@ const POST_TYPES_ALLOWING_POST_CONTENT_TEMPLATE_PART = [
  * @param {string} mode     Rendering mode
  */
 export function useHideBlocksFromInserter( postType, mode ) {
+	const isHierarchicalPostType = useSelect(
+		( select ) => select( coreStore ).getPostType( postType )?.hierarchical,
+		[ postType ]
+	);
 	useEffect( () => {
 		/*
 		 * Prevent adding template part in the editor.
@@ -30,7 +36,7 @@ export function useHideBlocksFromInserter( postType, mode ) {
 			'removeTemplatePartsFromInserter',
 			( canInsert, blockType ) => {
 				if (
-					! POST_TYPES_ALLOWING_POST_CONTENT_TEMPLATE_PART.includes(
+					! POST_TYPES_ALLOWING_POST_CONTENT_TEMPLATE_PART_BREADCRUMBS.includes(
 						postType
 					) &&
 					blockType.name === 'core/template-part' &&
@@ -55,7 +61,7 @@ export function useHideBlocksFromInserter( postType, mode ) {
 				{ getBlockParentsByBlockName }
 			) => {
 				if (
-					! POST_TYPES_ALLOWING_POST_CONTENT_TEMPLATE_PART.includes(
+					! POST_TYPES_ALLOWING_POST_CONTENT_TEMPLATE_PART_BREADCRUMBS.includes(
 						postType
 					) &&
 					blockType.name === 'core/post-content'
@@ -69,6 +75,27 @@ export function useHideBlocksFromInserter( postType, mode ) {
 			}
 		);
 
+		/*
+		 * Prevent adding breadcrumbs block to non-hierarchical post types.
+		 */
+		addFilter(
+			'blockEditor.__unstableCanInsertBlockType',
+			'removeBreadcrumbsFromInserter',
+			( canInsert, blockType ) => {
+				if (
+					! POST_TYPES_ALLOWING_POST_CONTENT_TEMPLATE_PART_BREADCRUMBS.includes(
+						postType
+					) &&
+					! isHierarchicalPostType &&
+					blockType.name === 'core/breadcrumbs' &&
+					mode === 'post-only'
+				) {
+					return false;
+				}
+				return canInsert;
+			}
+		);
+
 		return () => {
 			removeFilter(
 				'blockEditor.__unstableCanInsertBlockType',
@@ -78,6 +105,10 @@ export function useHideBlocksFromInserter( postType, mode ) {
 				'blockEditor.__unstableCanInsertBlockType',
 				'removePostContentFromInserter'
 			);
+			removeFilter(
+				'blockEditor.__unstableCanInsertBlockType',
+				'removeBreadcrumbsFromInserter'
+			);
 		};
-	}, [ postType, mode ] );
+	}, [ postType, isHierarchicalPostType, mode ] );
 }