Редактор блоков теперь в iframe в WordPress 6.3 (и другие мелкие изменения)

Ниже вы найдете разные заметки об изменениях в редакторе блоков в WordPress 6.3

Редактор записей будет открываться в iframe

Начиная с WordPress 6.3, редактор записей будет открываться в iframe, если все зарегистрированные блоки поддерживают версию Block API 3 или выше. Поддержка версии 3 означает, что блок должен работать внутри iframe, хотя если не все блоки поддерживают эту версию, блок может быть отрендерен и вне iframe.

Следует отметить, что Редактор сайта и Редактор шаблонов страниц всегда работали в iframe, как и предпросмотр блоков и паттернов, и будут продолжать работать так вне зависимости от версии Block API.

Чтобы упростить внедрение, все ассеты (стили и скрипты), добавленные через PHP-хук enqueue_block_assets, теперь также будут подключаться для iframe. Подробнее см. #48286.

Также следует учитывать, что enqueue_block_editor_assets не должен использоваться для подключения стилей для контента редактора. Используйте enqueue_block_assets. Если не хотите, чтобы стили грузились на фронтенде — оберните их в is_admin().

Для обратной совместимости стили, добавленные через enqueue_block_editor_assets, будут клонироваться, если содержат селекторы .editor-styles-wrapper, .wp-block или .wp-block-*, но при этом будет выведено предупреждение. Лучше использовать enqueue_block_assets, block.json, theme.json или add_editor_style() в зависимости от контекста.

Разработчикам плагинов рекомендуется адаптировать блоки к iframe-методу и поддерживать версию 3. В будущем редактор контента будет загружаться в iframe независимо от версии API.

Больше информации:

Типы публикации для пакетов плагинов

Для TypeScript-разработчиков добавлены типы для некоторых пакетов WordPress, что улучшает подсказки в редакторе и предупреждения компилятора. Типы генерируются на основе JSDoc без необходимости полной миграции кода.

Используются для:

Крупные пакеты вроде blocks, editor и block-editor всё ещё в процессе.

Перетаскивание изображений из вставщика в блок изображения

Обновлён onDragStart проп компонента <Draggable> — теперь коллбэк вызывается синхронно, вместо setTimeout(onDragStart, 0).

Если нужно оставить старое поведение:

-onDragStart={ () => { doSomething(); } }
+onDragStart={ () => { setTimeout( doSomething, 0 ); } }

Подробнее: #49673.

Новый слот в сайдбаре шаблонов редактора сайта

Добавлен слот PluginTemplateSettingPanel, позволяющий расширять сайдбар шаблонов. Пример:

import { MyTemplateSettingTest } from '@wordpress/edit-site';
const MyTemplateSettingTest = () => (
	<PluginTemplateSettingPanel>
		<p>Hello, World!</p>
	</PluginTemplateSettingPanel>
);

Подробнее: #50257.

Новый API преобразования ungroup

Блоки теперь могут указывать transforms.ungroup, чтобы указать, как они разбиваются на отдельные блоки. Это не обязательно должны быть стандартные групповые блоки.

Пример:

export const settings = {
	title: 'My grouping Block Title',
	description: 'My grouping block description',
	transforms: {
		ungroup: ( attributes, innerBlocks ) =>
			innerBlocks.flatMap( ( innerBlock ) => innerBlock.innerBlocks ),
	},
};

Подробнее: #50385.

Преобразования вариаций блока в переключателе блока

Вариации с scope: transform теперь отображаются приоритетно в меню переключателя блоков. Поведение в инспекторе блока не изменилось.

Подробнее: #50139.

Приоритет блоков во вставщике

Добавлен параметр prioritizedInserterBlocks для компонента InnerBlocks через опции useInnerBlocksProps. Позволяет указать, какие блоки отображать первыми.

Пример:

useInnerBlocksProps( containerProps, {
	prioritizedInserterBlocks: [ 'core/navigation-link', 'core/navigation-link/page' ]
} );

Подробнее: #50510.

Переименование переиспользуемых блоков в Паттерны

Reusable blocks теперь называются Patterns. Поведение core/block не изменилось. Контент сохраняется в CPT wp_block и синхронизируется между экземплярами.

Теперь есть два типа паттернов:

  • synced — как старые reusable blocks
  • unsynced — ведут себя как обычные паттерны темы/плагина

Для хранения статуса используется поле postmeta wp_pattern_sync_status. В REST API отображается как entity.wp_sync_status.

Единственное возможное влияние — если плагины ориентировались на текст "Reusable block(s)" в UI. Теперь он заменён на "Pattern".

Паттерны в модалке создания шаблона

В WP 6.3 модалка создания шаблона теперь показывает подходящие паттерны, если они указали templateTypes.

Пример для 404 шаблона:

register_block_pattern(
	'my-patterns/404-template',
	array(
		'title'         => __( 'New 404 pattern', 'gutenberg' ),
		'templateTypes' => array( '404' ),
		'content'       => '<!-- wp:paragraph {"align":"center","fontSize":"x-large"} -->
			<p class="has-text-align-center has-x-large-font-size">404</p>
			<!-- /wp:paragraph -->',
	)
);

--

Источник: https://make.wordpress.org/core/2023/07/18/miscellaneous-editor-changes-in-wordpress-6-3/