Skip to content

Instantly share code, notes, and snippets.

View Mamaduka's full-sized avatar

George Mamadashvili Mamaduka

View GitHub Profile
/**
* WordPress dependencies
*/
import { registerPlugin } from '@wordpress/plugins';
import { PluginDocumentSettingPanel } from '@wordpress/edit-post';
import { TextControl } from '@wordpress/components';
import { useEntityProp } from '@wordpress/core-data';
function SocialSettings() {
const [ links, setLinks ] = useEntityProp( 'root', 'site', 'social_links' );
/**
* WordPress dependencies
*/
import { createPortal, useEffect, useState } from '@wordpress/element';
import { registerPlugin } from '@wordpress/plugins';
import { Button } from '@wordpress/components';
function MyToolbarButton() {
// Lazy and one time initializations, also gives us a stable reference.
const [ container ] = useState( () => {
<?php
// See: https://developer.wordpress.org/reference/classes/wp_block_editor_context/.
add_filter( 'block_editor_settings_all', function( $settings, $context ) {
// Curated blocks for the Widgets Editor.
if ( isset( $context->name ) && 'core/edit-widgets' === $context->name ) {
$settings['allowedBlockTypes'] = [ 'core/cover', 'core/heading', 'core/image', 'core/paragraph' ];
}
// Disable block locking controls in Site Editor.
registerBlockSupport( 'core/align', {
isSupported( blockType ) {
return hasBlockSupport( blockType, 'align' );
},
blockSettings( settings ) {
// Allow blocks to specify their own attribute definition with default values if needed.
if ( 'type' in ( settings.attributes?.align ?? {} ) ) {
return settings;
}

Disclaimer: The document is based on the proposed API by @ellatrix and @gziolo. See #48809.

Summary

Introduce a new API, registerBlockSupport, for describing the behavior and rendering of block features that utilize support properties.

Problem

As the block editor started absorbing the complexities of block features like color, fonts, and dimension controls, it became apparent that the current method of integrating UI controls is not very sustainable and may sometimes hinder performance.

/**
* Not a final name, could be `registerDocumentSettingPanel` or `registerDocumentSettingsControl`.
*
* Internally this method would be similar to `registerBlockType`:
* 1. Handles validations.
* 2. Dispatches and action to the store to register the document settings. Probably the `core/editor` store.
*/
function registerDocumentSetting( name, args ) {}
function unregisterDocumentSetting( name ) {}
<?php
/**
* Title: Content-only Test
* Slug: prefix/content-only-test
*/
?>
<!-- wp:group {"templateLock": "contentOnly", "align":"wide","layout":{"type":"constrained","wideSize":"2000px"}} -->
<div class="wp-block-group alignwide"><!-- wp:columns -->
<div class="wp-block-columns"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:image {"id":231,"sizeSlug":"large","linkDestination":"none"} -->
const el = wp.element.createElement;
const registerPlugin = wp.plugins.registerPlugin;
const { PluginPostStatusInfo, PostTrashCheck, PostTrash } = wp.editor;
function ReturnOfTheTrashButton() {
return el(
PluginPostStatusInfo,
{},
el( PostTrashCheck, {}, el( PostTrash ) )
);