From 5b6d8a1cf8928b0688880be63b44df08244bb592 Mon Sep 17 00:00:00 2001 From: Grzegorz Ziolkowski Date: Tue, 9 Feb 2021 20:29:31 +0100 Subject: [PATCH] Create Block: Add a way to provide a default value for attributes and supports --- .../create-block-tutorial-template/index.js | 10 ++++++++ .../templates/src/index.js.mustache | 24 ------------------- packages/create-block/CHANGELOG.md | 4 ++++ packages/create-block/README.md | 12 ++++++---- packages/create-block/lib/init-block-json.js | 11 +++++---- packages/create-block/lib/scaffold.js | 4 ++++ packages/create-block/lib/templates.js | 3 +++ .../templates/esnext/src/index.js.mustache | 8 ------- 8 files changed, 34 insertions(+), 42 deletions(-) diff --git a/packages/create-block-tutorial-template/index.js b/packages/create-block-tutorial-template/index.js index 1787b07707a880..c39d2eaae4f678 100644 --- a/packages/create-block-tutorial-template/index.js +++ b/packages/create-block-tutorial-template/index.js @@ -12,6 +12,16 @@ module.exports = { description: 'A Gutenberg block to show your pride! This block enables you to type text and style it with the color font Gilbert from Type with Pride.', dashicon: 'flag', + attributes: { + message: { + type: 'string', + source: 'text', + selector: 'div', + }, + }, + supports: { + html: false, + }, npmDependencies: [ '@wordpress/block-editor', '@wordpress/blocks', diff --git a/packages/create-block-tutorial-template/templates/src/index.js.mustache b/packages/create-block-tutorial-template/templates/src/index.js.mustache index 1d61faa8060057..ad697a563786b5 100644 --- a/packages/create-block-tutorial-template/templates/src/index.js.mustache +++ b/packages/create-block-tutorial-template/templates/src/index.js.mustache @@ -28,30 +28,6 @@ import save from './save'; * @see https://developer.wordpress.org/block-editor/developers/block-api/#registering-a-block */ registerBlockType( '{{namespace}}/{{slug}}', { - /** - * Attributes are the way a block stores data, they define how a block is parsed - * to extract data from the saved content. When the block loads it will look - * at the saved content for the block, look for the `div` tag, take the text portion, - * and store the content in an `attributes.message` variable. - * - * @see https://developer.wordpress.org/block-editor/developers/block-api/block-attributes/ - */ - attributes: { - message: { - type: 'string', - source: 'text', - selector: 'div', - }, - }, - - /** - * Optional block extended support features. - */ - supports: { - // Removes support for an HTML mode. - html: false, - }, - /** * Used to construct a preview for the block to be shown in the block inserter. */ diff --git a/packages/create-block/CHANGELOG.md b/packages/create-block/CHANGELOG.md index 5f67bc97057204..fb99759973b62e 100644 --- a/packages/create-block/CHANGELOG.md +++ b/packages/create-block/CHANGELOG.md @@ -2,6 +2,10 @@ ## Unreleased +### New Features + +- Add a way to provide a default value in the template for `attributes` and `supports` Block API fields ([#28883](https://github.com/WordPress/gutenberg/pull/28883)). + ### Enhancement - Block scaffolded with `esnext` template is now registered from `block.json` with the `register_block_type_from_metadata` helper ([#28883](https://github.com/WordPress/gutenberg/pull/28883)). diff --git a/packages/create-block/README.md b/packages/create-block/README.md index aedbc587d73554..ddd0241a652465 100644 --- a/packages/create-block/README.md +++ b/packages/create-block/README.md @@ -171,13 +171,15 @@ module.exports = { The following configurable variables are used with the template files. Template authors can change default values to use when users don't provide their data: -- `apiVersion` (default: `2`) +- `apiVersion` (default: `2`) - see https://make.wordpress.org/core/2020/11/18/block-api-version-2/. - `slug` (no default) - `namespace` (default: `'create-block'`) -- `title` (no default) -- `description` (no default) -- `dashicon` (no default) -- `category` (default: `'widgets'`) +- `title` (no default) - a display title for your block. +- `description` (no default) - a short description for your block. +- `dashicon` (no default) - an icon property thats makes it easier to identify a block, see https://developer.wordpress.org/resource/dashicons/. +- `category` (default: `'widgets'`) - blocks are grouped into categories to help users browse and discover them. The categories provided by core are `text`, `media`, `design`, `widgets`, and `embed`. +- `attributes` (no default) - see https://developer.wordpress.org/block-editor/developers/block-api/block-attributes/. +- `supports` (no default) - optional block extended support features, see https://developer.wordpress.org/block-editor/developers/block-api/block-supports/. - `author` (default: `'The WordPress Contributors'`) - `license` (default: `'GPL-2.0-or-later'`) - `licenseURI` (default: `'https://www.gnu.org/licenses/gpl-2.0.html'`) diff --git a/packages/create-block/lib/init-block-json.js b/packages/create-block/lib/init-block-json.js index 694414e73b547f..81f177290372b8 100644 --- a/packages/create-block/lib/init-block-json.js +++ b/packages/create-block/lib/init-block-json.js @@ -1,7 +1,7 @@ /** * External dependencies */ -const { omitBy } = require( 'lodash' ); +const { isEmpty, omitBy } = require( 'lodash' ); const { join } = require( 'path' ); const { writeFile } = require( 'fs' ).promises; @@ -17,6 +17,8 @@ module.exports = async ( { title, description, category, + attributes, + supports, dashicon, textdomain, editorScript, @@ -37,15 +39,14 @@ module.exports = async ( { category, icon: dashicon, description, + attributes, + supports, textdomain, - supports: { - html: false, - }, editorScript, editorStyle, style, }, - ( value ) => ! value + isEmpty ), null, '\t' diff --git a/packages/create-block/lib/scaffold.js b/packages/create-block/lib/scaffold.js index b51e17cd1af606..40dd41dfe3c6dc 100644 --- a/packages/create-block/lib/scaffold.js +++ b/packages/create-block/lib/scaffold.js @@ -26,6 +26,8 @@ module.exports = async ( description, dashicon, category, + attributes, + supports, author, license, licenseURI, @@ -55,6 +57,8 @@ module.exports = async ( description, dashicon, category, + attributes, + supports, version, author, license, diff --git a/packages/create-block/lib/templates.js b/packages/create-block/lib/templates.js index 000e20222ecee8..7947f798b7b7a1 100644 --- a/packages/create-block/lib/templates.js +++ b/packages/create-block/lib/templates.js @@ -39,6 +39,9 @@ const predefinedBlockTemplates = { description: 'Example block written with ESNext standard and JSX support – build step required.', dashicon: 'smiley', + supports: { + html: false, + }, npmDependencies: [ '@wordpress/block-editor', '@wordpress/blocks', diff --git a/packages/create-block/lib/templates/esnext/src/index.js.mustache b/packages/create-block/lib/templates/esnext/src/index.js.mustache index cf679fd21926bf..6b258d5b390c5f 100644 --- a/packages/create-block/lib/templates/esnext/src/index.js.mustache +++ b/packages/create-block/lib/templates/esnext/src/index.js.mustache @@ -26,14 +26,6 @@ import save from './save'; * @see https://developer.wordpress.org/block-editor/developers/block-api/#registering-a-block */ registerBlockType( '{{namespace}}/{{slug}}', { - /** - * Optional block extended support features. - */ - supports: { - // Removes support for an HTML mode. - html: false, - }, - /** * @see ./edit.js */