Blocks: Update default block categories

docs/designers-developers/developers/data/data-core-blocks.md

@@ -83,7 +83,7 @@ _Parameters_
 
 _Returns_
 
-- `Array`: Categories list.
+- `Array<WPBlockCategory>`: Categories list.
 
 <a name="getChildBlockNames" href="#getChildBlockNames">#</a> **getChildBlockNames**
 

docs/designers-developers/developers/tutorials/block-tutorial/applying-styles-with-stylesheets.md

@@ -14,7 +14,7 @@ registerBlockType( 'gutenberg-examples/example-02-stylesheets', {
 
  icon: 'universal-access-alt',
 
- category: 'layout',
+ category: 'design',
 
  example: {},
 
@@ -35,7 +35,7 @@ registerBlockType( 'gutenberg-examples/example-02-stylesheets', {
  blocks.registerBlockType( 'gutenberg-examples/example-02-stylesheets', {
  title: 'Example: Stylesheets',
  icon: 'universal-access-alt',
- category: 'layout',
+ category: 'design',
  example: {},
  edit: function( props ) {
  return el(

docs/designers-developers/developers/tutorials/block-tutorial/block-controls-toolbar-and-sidebar.md

@@ -24,7 +24,7 @@ import {
 registerBlockType( 'gutenberg-examples/example-04-controls-esnext', {
  title: 'Example: Controls (esnext)',
  icon: 'universal-access-alt',
- category: 'layout',
+ category: 'design',
  attributes: {
  content: {
  type: 'array',
@@ -101,7 +101,7 @@ registerBlockType( 'gutenberg-examples/example-04-controls-esnext', {
  blocks.registerBlockType( 'gutenberg-examples/example-04-controls', {
  title: 'Example: Controls',
  icon: 'universal-access-alt',
- category: 'layout',
+ category: 'design',
 
  attributes: {
  content: {

docs/designers-developers/developers/tutorials/block-tutorial/introducing-attributes-and-editable-fields.md

@@ -61,7 +61,7 @@ import { RichText } from '@wordpress/block-editor';
 registerBlockType( 'gutenberg-examples/example-03-editable-esnext', {
  title: 'Example: Editable (esnext)',
  icon: 'universal-access-alt',
- category: 'layout',
+ category: 'design',
  attributes: {
  content: {
  type: 'array',
@@ -102,7 +102,7 @@ registerBlockType( 'gutenberg-examples/example-03-editable-esnext', {
  blocks.registerBlockType( 'gutenberg-examples/example-03-editable', {
  title: 'Example: Editable',
  icon: 'universal-access-alt',
- category: 'layout',
+ category: 'design',
 
  attributes: {
  content: {

docs/designers-developers/developers/tutorials/block-tutorial/nested-blocks-inner-blocks.md

@@ -15,7 +15,7 @@ Here is the basic InnerBlocks usage.
 
  blocks.registerBlockType( 'gutenberg-examples/example-06', {
  title: 'Example: Inner Blocks',
- category: 'layout',
+ category: 'design',
 
  edit: function( props ) {
  return el(

docs/designers-developers/developers/tutorials/block-tutorial/writing-your-first-block-type.md

@@ -61,7 +61,7 @@ const blockStyle = {
 registerBlockType( 'gutenberg-examples/example-01-basic-esnext', {
  title: 'Example: Basic (esnext)',
  icon: 'universal-access-alt',
- category: 'layout',
+ category: 'design',
  example: {},
  edit() {
  return <div style={ blockStyle }>Hello World, step 1 (from the editor).</div>;
@@ -85,7 +85,7 @@ registerBlockType( 'gutenberg-examples/example-01-basic-esnext', {
  blocks.registerBlockType( 'gutenberg-examples/example-01-basic', {
  title: 'Example: Basic',
  icon: 'universal-access-alt',
- category: 'layout',
+ category: 'design',
  example: {},
  edit: function() {
  return el(

docs/designers-developers/developers/tutorials/javascript/js-build-setup.md

@@ -107,7 +107,7 @@ import { registerBlockType } from '@wordpress/blocks';
 registerBlockType( 'myguten/test-block', {
  title: 'Basic Example',
  icon: 'smiley',
- category: 'layout',
+ category: 'design',
  edit: () => <div>Hola, mundo!</div>,
  save: () => <div>Hola, mundo!</div>,
 } );

docs/designers-developers/developers/tutorials/metabox/meta-block-3-add.md

@@ -21,7 +21,7 @@ Add this code to your JavaScript file (this tutorial will call the file `myguten
  registerBlockType( 'myguten/meta-block', {
  title: 'Meta Block',
  icon: 'smiley',
- category: 'common',
+ category: 'text',
 
  edit: function( props ) {
  var className = props.className;
@@ -82,7 +82,7 @@ import { useEntityProp } from '@wordpress/core-data';
 registerBlockType( 'myguten/meta-block', {
  title: 'Meta Block',
  icon: 'smiley',
- category: 'common',
+ category: 'text',
 
  edit( { className, setAttributes, attributes } ) {
  const postType = useSelect(

docs/rfc/block-registration.md

@@ -64,7 +64,7 @@ To register a new block type, start by creating a `block.json` file. This file:
 {
  "name": "my-plugin/notice",
  "title": "Notice",
- "category": "common",
+ "category": "text",
  "parent": [ "core/group" ],
  "icon": "star",
  "description": "Shows warning, error or success notices ...",
@@ -134,7 +134,7 @@ This is the display title for your block, which can be translated with our trans
 * Property: `category`
 
 ```json
-{ "category": "common" }
+{ "category": "text" }
 ```
 
 Blocks are grouped into categories to help users browse and discover them.
@@ -149,7 +149,7 @@ The core provided categories are:
 
 Plugins and Themes can also register [custom block categories](/docs/designers-developers/developers/filters/block-filters.md#managing-block-categories).
 
-An implementation should expect and tolerate unknown categories, providing some reasonable fallback behavior (e.g. a "common" category).
+An implementation should expect and tolerate unknown categories, providing some reasonable fallback behavior (e.g. a "text" category).
 
 ### Parent
 

lib/compat.php

@@ -168,6 +168,67 @@ function gutenberg_get_post_from_context() {
  return get_post();
 }
 
+/**
+ * Filters default block categories to substitute legacy category names with new
+ * block categories.
+ *
+ * This can be removed when plugin support requires WordPress 5.5.0+.
+ *
+ * @see https://core.trac.wordpress.org/ticket/50278
+ *
+ * @param array[] $default_categories Array of block categories.
+ *
+ * @return array[] Filtered block categories.
+ */
+function gutenberg_replace_default_block_categories( $default_categories ) {
+ $substitution = array(
+ 'common' => array(
+ 'slug' => 'text',
+ 'title' => __( 'Text', 'gutenberg' ),
+ 'icon' => null,
+ ),
+ 'formatting' => array(
+ 'slug' => 'media',
+ 'title' => __( 'Media', 'gutenberg' ),
+ 'icon' => null,
+ ),
+ 'layout' => array(
+ 'slug' => 'design',
+ 'title' => __( 'Design', 'gutenberg' ),
+ 'icon' => null,
+ ),
+ );
+
+ // Loop default categories to perform in-place substitution by legacy slug.
+ foreach ( $default_categories as $i => $default_category ) {
+ $slug = $default_category['slug'];
+ if ( isset( $substitution[ $slug ] ) ) {
+ $default_categories[ $i ] = $substitution[ $slug ];
+ unset( $substitution[ $slug ] );
+ }
+ }
+
+ /*
+ * At this point, `$substitution` should contain only the categories which
+ * could not be in-place substituted with a default category, likely in the
+ * case that core has since been updated to use the default categories.
+ * Check to verify they exist.
+ */
+ $default_category_slugs = wp_list_pluck( $default_categories, 'slug' );
+ foreach ( $substitution as $i => $substitute_category ) {
+ if ( in_array( $substitute_category['slug'], $default_category_slugs, true ) ) {
+ unset( $substitution[ $i ] );
+ }
+ }
+
+ /*
+ * Any substitutes remaining should be appended, as they are not yet
+ * assigned in the default categories array.
+ */
+ return array_merge( $default_categories, array_values( $substitution ) );
+}
+add_filter( 'block_categories', 'gutenberg_replace_default_block_categories' );
+
 /**
  * Shim that hooks into `pre_render_block` so as to override `render_block` with
  * a function that assigns block context.

packages/block-editor/src/autocompleters/test/block.js

@@ -73,14 +73,14 @@ describe( 'block', () => {
  name: 'core/foo',
  title: 'foo',
  keywords: [ 'foo-keyword-1', 'foo-keyword-2' ],
- category: 'formatting',
+ category: 'design',
  };
  const inserterItemWithTitleAndEmptyKeywords = {
  name: 'core/bar',
  title: 'bar',
  // Intentionally empty keyword list
  keywords: [],
- category: 'common',
+ category: 'text',
  };
  const inserterItemWithTitleAndUndefinedKeywords = {
  name: 'core/baz',
@@ -91,12 +91,12 @@ describe( 'block', () => {
 
  expect(
  blockCompleter.getOptionKeywords( inserterItemWithTitleAndKeywords )
- ).toEqual( [ 'formatting', 'foo-keyword-1', 'foo-keyword-2', 'foo' ] );
+ ).toEqual( [ 'design', 'foo-keyword-1', 'foo-keyword-2', 'foo' ] );
  expect(
  blockCompleter.getOptionKeywords(
  inserterItemWithTitleAndEmptyKeywords
  )
- ).toEqual( [ 'common', 'bar' ] );
+ ).toEqual( [ 'text', 'bar' ] );
  expect(
  blockCompleter.getOptionKeywords(
  inserterItemWithTitleAndUndefinedKeywords

packages/block-editor/src/components/block-edit/test/edit.js

@@ -36,7 +36,7 @@ describe( 'Edit', () => {
  const edit = () => <div />;
  registerBlockType( 'core/test-block', {
  save: noop,
- category: 'common',
+ category: 'text',
  title: 'block title',
  edit,
  } );
@@ -50,7 +50,7 @@ describe( 'Edit', () => {
  const save = () => <div />;
  registerBlockType( 'core/test-block', {
  save,
- category: 'common',
+ category: 'text',
  title: 'block title',
  } );
 
@@ -67,7 +67,7 @@ describe( 'Edit', () => {
  registerBlockType( 'core/test-block', {
  edit,
  save: noop,
- category: 'common',
+ category: 'text',
  title: 'block title',
  } );
 
@@ -84,7 +84,7 @@ describe( 'Edit', () => {
  it( 'should assign context', () => {
  const edit = ( { context } ) => context.value;
  registerBlockType( 'core/test-block', {
- category: 'common',
+ category: 'text',
  title: 'block title',
  context: [ 'value' ],
  edit,
@@ -104,7 +104,7 @@ describe( 'Edit', () => {
  it( 'should assign context', () => {
  const edit = ( { context } ) => context.value;
  registerBlockType( 'core/test-block', {
- category: 'common',
+ category: 'text',
  title: 'block title',
  context: [ 'value' ],
  supports: {

packages/block-editor/src/components/block-switcher/test/index.js

@@ -49,7 +49,7 @@ describe( 'BlockSwitcher', () => {
 
  beforeAll( () => {
  registerBlockType( 'core/heading', {
- category: 'common',
+ category: 'text',
  title: 'Heading',
  edit: () => {},
  save: () => {},
@@ -71,7 +71,7 @@ describe( 'BlockSwitcher', () => {
  } );
 
  registerBlockType( 'core/paragraph', {
- category: 'common',
+ category: 'text',
  title: 'Paragraph',
  edit: () => {},
  save: () => {},

packages/block-editor/src/components/inner-blocks/test/index.js

@@ -25,7 +25,7 @@ describe( 'InnerBlocks', () => {
 
  it( 'should return element as string, with inner blocks', () => {
  registerBlockType( 'core/fruit', {
- category: 'common',
+ category: 'text',
 
  title: 'fruit',
 
@@ -88,7 +88,7 @@ describe( 'InnerBlocks', () => {
  </p>
  );
  },
- category: 'common',
+ category: 'text',
  title: 'block title',
  };
  registerBlockType( 'core/test-block', blockType );