block-editor

The problem is that calling wp.data.select triggers a fetch and the data takes some time to be available. Until that happens the value returned is an empty array. My suggestion here is to use wp.data.useSelect, which is a React hook made specifically for this, so the component re-renders when there is a change in the … Read more

UrlInput uses LinkControl internally, but neither have been built with the sidebar in mind, they’re to be used inside popover components that appear inline such as when a toolbar button is clicked. They aren’t intended to appear directly in toolbars either. Most if not all input components can’t be shown in the toolbar, with the … Read more

You need to call savePost after calling editPost. Referring to the source’s way of handling it:https://github.com/WordPress/gutenberg/blob/trunk/packages/editor/src/components/post-visibility/index.js it shows savePost being called right after changing the visibility. In practice: import { PluginPostStatusInfo } from ‘@wordpress/edit-post’; import { __ } from ‘@wordpress/i18n’; import { registerPlugin } from ‘@wordpress/plugins’; import { ToggleControl } from ‘@wordpress/components’; import { useSelect, … Read more

<RichText> has a property, isSelected. When isSelected is true, the controls show. By default isSelected is representative of the current block being selected. from the docs isSelected: Boolean Optional. Whether to show the input is selected or not in order to show the formatting controls. By default it renders the controls when the block is … Read more

Although I’m unsure on how to achieve this in php, within javascript you can change the category by hooking into the blocks.registerBlockType hook. Here is a small example how it would work, although I’d recommend using lodash to deepClone the settings object to keep everything immutable. const rearrangeBlockCategories = { ‘core/table’: ‘common’, }; wp.hooks.addFilter(‘blocks.registerBlockType’, ‘[namespace]’, … Read more

All datas seems to be stored in JS objects, and not in HTML-DOM. We can use: wp.data.select(“core”).getXXXXXXXXXXXX() wp.data.select(“core/editor”).getXXXXXXXXXXXX() … There are many areas too, you can list them with: console.log(wp.blocks.getBlockTypes());

After trial and error, I’ve figured out a way. It may not be perfect but it works for every circumstance I’ve tried. We need to use the wp.data.select function, and select the ‘core/block-editor’, and finally use the getSelectionStart() function. That will tell us if the current block has selectable text, and if so, where our … Read more

Change column width value from string to number, like this array(‘core/column’, array(‘width’ => 33.33)

Without the root id the block is looked for at the top-level1. Something like this seems to work: useSelect(select => { const editor = select(‘core/block-editor’) const rootId = editor.getBlockRootClientId(blockId) return editor.getBlockIndex(blockId, rootId) }, [blockId]) [1] https://github.com/WordPress/gutenberg/blob/v9.9.3/packages/block-editor/src/store/selectors.js#L945