+
@@ -54,4 +54,4 @@ function BlockPatternPicker( {
);
}
-export default BlockPatternPicker;
+export default BlockVariationPicker;
diff --git a/packages/block-editor/src/components/block-pattern-picker/style.scss b/packages/block-editor/src/components/block-variation-picker/style.scss
similarity index 81%
rename from packages/block-editor/src/components/block-pattern-picker/style.scss
rename to packages/block-editor/src/components/block-variation-picker/style.scss
index feaca246095fb..63460d6fcfe98 100644
--- a/packages/block-editor/src/components/block-pattern-picker/style.scss
+++ b/packages/block-editor/src/components/block-variation-picker/style.scss
@@ -1,4 +1,4 @@
-.block-editor-block-pattern-picker {
+.block-editor-block-variation-picker {
.components-placeholder__instructions {
// Defer to vertical margins applied by template picker options.
margin-bottom: 0;
@@ -10,14 +10,14 @@
flex-direction: column;
}
- &.has-many-patterns .components-placeholder__fieldset {
+ &.has-many-variations .components-placeholder__fieldset {
// Allow options to occupy a greater amount of the available space if
// many options exist.
max-width: 90%;
}
}
-.block-editor-block-pattern-picker__patterns.block-editor-block-pattern-picker__patterns {
+.block-editor-block-variation-picker__variations.block-editor-block-variation-picker__variations {
display: flex;
justify-content: flex-start;
flex-direction: row;
@@ -34,12 +34,12 @@
max-width: 100px;
}
- .block-editor-block-pattern-picker__pattern {
+ .block-editor-block-variation-picker__variation {
padding: $grid-size;
}
}
-.block-editor-block-pattern-picker__pattern {
+.block-editor-block-variation-picker__variation {
width: 100%;
&.components-button.has-icon {
diff --git a/packages/block-editor/src/components/index.js b/packages/block-editor/src/components/index.js
index 48e8559d7990b..b5039d38b4649 100644
--- a/packages/block-editor/src/components/index.js
+++ b/packages/block-editor/src/components/index.js
@@ -15,7 +15,7 @@ export { default as BlockFormatControls } from './block-format-controls';
export { default as BlockIcon } from './block-icon';
export { default as BlockNavigationDropdown } from './block-navigation/dropdown';
export { default as __experimentalBlockNavigationList } from './block-navigation/list';
-export { default as __experimentalBlockPatternPicker } from './block-pattern-picker';
+export { default as __experimentalBlockVariationPicker } from './block-variation-picker';
export { default as BlockVerticalAlignmentToolbar } from './block-vertical-alignment-toolbar';
export { default as ButtonBlockerAppender } from './button-block-appender';
export { default as ColorPalette } from './color-palette';
diff --git a/packages/block-editor/src/components/inserter/index.js b/packages/block-editor/src/components/inserter/index.js
index 1fe3b55f11b81..d5d506eeef9ca 100644
--- a/packages/block-editor/src/components/inserter/index.js
+++ b/packages/block-editor/src/components/inserter/index.js
@@ -137,7 +137,7 @@ export default compose( [
const { getBlockRootClientId, hasInserterItems, __experimentalGetAllowedBlocks } = select(
'core/block-editor'
);
- const { __experimentalGetBlockPatterns: getBlockPatterns } = select( 'core/blocks' );
+ const { __experimentalGetBlockVariations: getBlockVariations } = select( 'core/blocks' );
rootClientId = rootClientId || getBlockRootClientId( clientId ) || undefined;
@@ -145,7 +145,7 @@ export default compose( [
const hasSingleBlockType =
size( allowedBlocks ) === 1 &&
- size( getBlockPatterns( allowedBlocks[ 0 ].name, 'inserter' ) ) === 0;
+ size( getBlockVariations( allowedBlocks[ 0 ].name, 'inserter' ) ) === 0;
let allowedBlockType = false;
if ( hasSingleBlockType ) {
diff --git a/packages/block-editor/src/components/inserter/search-items.js b/packages/block-editor/src/components/inserter/search-items.js
index 0b3264410011e..636eac3ae9798 100644
--- a/packages/block-editor/src/components/inserter/search-items.js
+++ b/packages/block-editor/src/components/inserter/search-items.js
@@ -53,7 +53,7 @@ export const searchItems = ( items, categories, collections, searchTerm ) => {
}
return items
- .filter( ( { name, title, category, keywords = [], patterns = [] } ) => {
+ .filter( ( { name, title, category, keywords = [], variations = [] } ) => {
let unmatchedTerms = removeMatchingTerms( normalizedSearchTerms, title );
if ( unmatchedTerms.length === 0 ) {
@@ -82,33 +82,33 @@ export const searchItems = ( items, categories, collections, searchTerm ) => {
unmatchedTerms = removeMatchingTerms(
unmatchedTerms,
- patterns.map( ( pattern ) => pattern.title ).join( ' ' )
+ variations.map( ( variation ) => variation.title ).join( ' ' )
);
return unmatchedTerms.length === 0;
} )
.map( ( item ) => {
- if ( isEmpty( item.patterns ) ) {
+ if ( isEmpty( item.variations ) ) {
return item;
}
- const matchedPatterns = item.patterns.filter( ( pattern ) => {
+ const matchedVariations = item.variations.filter( ( variation ) => {
return (
intersectionWith(
normalizedSearchTerms,
- normalizeSearchTerm( pattern.title ),
+ normalizeSearchTerm( variation.title ),
( termToMatch, labelTerm ) => labelTerm.includes( termToMatch )
).length > 0
);
} );
- // When no partterns matched, fallback to all patterns.
- if ( isEmpty( matchedPatterns ) ) {
+ // When no partterns matched, fallback to all variations.
+ if ( isEmpty( matchedVariations ) ) {
return item;
}
return {
...item,
- patterns: matchedPatterns,
+ variations: matchedVariations,
};
} );
};
diff --git a/packages/block-editor/src/components/inserter/test/fixtures/index.js b/packages/block-editor/src/components/inserter/test/fixtures/index.js
index e9df0a3dbc75e..d3b46654736c9 100644
--- a/packages/block-editor/src/components/inserter/test/fixtures/index.js
+++ b/packages/block-editor/src/components/inserter/test/fixtures/index.js
@@ -24,26 +24,26 @@ export const textItem = {
utility: 1,
};
-export const withPatternsItem = {
- id: 'core/block-with-patterns',
- name: 'core/block-with-patterns',
+export const withVariationsItem = {
+ id: 'core/block-with-variations',
+ name: 'core/block-with-variations',
initialAttributes: {},
- title: 'With Patterns',
+ title: 'With Variations',
category: 'widgets',
isDisabled: false,
utility: 0,
- patterns: [
+ variations: [
{
- name: 'pattern-one',
- title: 'Pattern One',
+ name: 'variation-one',
+ title: 'Variation One',
},
{
- name: 'pattern-two',
- title: 'Pattern Two',
+ name: 'variation-two',
+ title: 'Variation Two',
},
{
- name: 'pattern-three',
- title: 'Pattern Three',
+ name: 'variation-three',
+ title: 'Variation Three',
},
],
};
@@ -111,7 +111,7 @@ export const reusableItem = {
export default [
textItem,
- withPatternsItem,
+ withVariationsItem,
advancedTextItem,
someOtherItem,
moreItem,
diff --git a/packages/block-editor/src/components/inserter/test/search-items.js b/packages/block-editor/src/components/inserter/test/search-items.js
index cbedd580b10a5..d5068f87fcc53 100644
--- a/packages/block-editor/src/components/inserter/test/search-items.js
+++ b/packages/block-editor/src/components/inserter/test/search-items.js
@@ -71,19 +71,19 @@ describe( 'searchItems', () => {
] );
} );
- it( 'should match words using also patterns and return all matched patterns', () => {
- const filteredItems = searchItems( items, categories, collections, 'pattern' );
+ it( 'should match words using also variations and return all matched variations', () => {
+ const filteredItems = searchItems( items, categories, collections, 'variation' );
expect( filteredItems ).toHaveLength( 1 );
- expect( filteredItems[ 0 ].patterns ).toHaveLength( 3 );
+ expect( filteredItems[ 0 ].variations ).toHaveLength( 3 );
} );
- it( 'should match words using also patterns and filter out unmatched patterns', () => {
- const filteredItems = searchItems( items, categories, collections, 'patterns two three' );
+ it( 'should match words using also variations and filter out unmatched variations', () => {
+ const filteredItems = searchItems( items, categories, collections, 'variations two three' );
expect( filteredItems ).toHaveLength( 1 );
- expect( filteredItems[ 0 ].patterns ).toHaveLength( 2 );
- expect( filteredItems[ 0 ].patterns[ 0 ].title ).toBe( 'Pattern Two' );
- expect( filteredItems[ 0 ].patterns[ 1 ].title ).toBe( 'Pattern Three' );
+ expect( filteredItems[ 0 ].variations ).toHaveLength( 2 );
+ expect( filteredItems[ 0 ].variations[ 0 ].title ).toBe( 'Variation Two' );
+ expect( filteredItems[ 0 ].variations[ 1 ].title ).toBe( 'Variation Three' );
} );
} );
diff --git a/packages/block-editor/src/store/selectors.js b/packages/block-editor/src/store/selectors.js
index fda8b2a117578..f6d6281c56ecb 100644
--- a/packages/block-editor/src/store/selectors.js
+++ b/packages/block-editor/src/store/selectors.js
@@ -1227,7 +1227,7 @@ export const getInserterItems = createSelector(
const isContextual = isArray( blockType.parent );
const { time, count = 0 } = getInsertUsage( state, id ) || {};
- const inserterPatterns = blockType.patterns.filter(
+ const inserterVariations = blockType.variations.filter(
( { scope } ) => ! scope || scope.includes( 'inserter' )
);
@@ -1240,7 +1240,7 @@ export const getInserterItems = createSelector(
icon: blockType.icon,
category: blockType.category,
keywords: blockType.keywords,
- patterns: inserterPatterns,
+ variations: inserterVariations,
example: blockType.example,
isDisabled,
utility: calculateUtility( blockType.category, count, isContextual ),
diff --git a/packages/block-editor/src/store/test/selectors.js b/packages/block-editor/src/store/test/selectors.js
index 8faaa591edd38..2e5141ab698d2 100644
--- a/packages/block-editor/src/store/test/selectors.js
+++ b/packages/block-editor/src/store/test/selectors.js
@@ -2015,7 +2015,7 @@ describe( 'selectors', () => {
},
category: 'formatting',
keywords: [ 'testing' ],
- patterns: [],
+ variations: [],
isDisabled: false,
utility: 0,
frecency: 0,
diff --git a/packages/block-editor/src/style.scss b/packages/block-editor/src/style.scss
index b1e2406d94cc0..d170399ed8af6 100644
--- a/packages/block-editor/src/style.scss
+++ b/packages/block-editor/src/style.scss
@@ -8,13 +8,13 @@
@import "./components/block-mobile-toolbar/style.scss";
@import "./components/block-mover/style.scss";
@import "./components/block-navigation/style.scss";
-@import "./components/block-pattern-picker/style.scss";
@import "./components/block-preview/style.scss";
@import "./components/block-settings-menu/style.scss";
@import "./components/block-styles/style.scss";
@import "./components/block-switcher/style.scss";
@import "./components/block-toolbar/style.scss";
@import "./components/block-types-list/style.scss";
+@import "./components/block-variation-picker/style.scss";
@import "./components/button-block-appender/style.scss";
@import "./components/colors-gradients/style.scss";
@import "./components/contrast-checker/style.scss";
diff --git a/packages/block-library/src/columns/edit.js b/packages/block-library/src/columns/edit.js
index c5dd3d806e21a..5cdb7e315b307 100644
--- a/packages/block-library/src/columns/edit.js
+++ b/packages/block-library/src/columns/edit.js
@@ -14,7 +14,7 @@ import {
InnerBlocks,
BlockControls,
BlockVerticalAlignmentToolbar,
- __experimentalBlockPatternPicker,
+ __experimentalBlockVariationPicker,
__experimentalUseColors,
} from '@wordpress/block-editor';
import { withDispatch, useDispatch, useSelect } from '@wordpress/data';
@@ -184,19 +184,19 @@ const createBlocksFromInnerBlocksTemplate = ( innerBlocksTemplate ) => {
const ColumnsEdit = ( props ) => {
const { clientId, name } = props;
- const { blockType, defaultPattern, hasInnerBlocks, patterns } = useSelect(
+ const { blockType, defaultVariation, hasInnerBlocks, variations } = useSelect(
( select ) => {
const {
- __experimentalGetBlockPatterns,
+ __experimentalGetBlockVariations,
getBlockType,
- __experimentalGetDefaultBlockPattern,
+ __experimentalGetDefaultBlockVariation,
} = select( 'core/blocks' );
return {
blockType: getBlockType( name ),
- defaultPattern: __experimentalGetDefaultBlockPattern( name, 'block' ),
+ defaultVariation: __experimentalGetDefaultBlockVariation( name, 'block' ),
hasInnerBlocks: select( 'core/block-editor' ).getBlocks( clientId ).length > 0,
- patterns: __experimentalGetBlockPatterns( name, 'block' ),
+ variations: __experimentalGetBlockVariations( name, 'block' ),
};
},
[ clientId, name ]
@@ -209,18 +209,18 @@ const ColumnsEdit = ( props ) => {
}
return (
- <__experimentalBlockPatternPicker
+ <__experimentalBlockVariationPicker
icon={ get( blockType, [ 'icon', 'src' ] ) }
label={ get( blockType, [ 'title' ] ) }
- patterns={ patterns }
- onSelect={ ( nextPattern = defaultPattern ) => {
- if ( nextPattern.attributes ) {
- props.setAttributes( nextPattern.attributes );
+ variations={ variations }
+ onSelect={ ( nextVariation = defaultVariation ) => {
+ if ( nextVariation.attributes ) {
+ props.setAttributes( nextVariation.attributes );
}
- if ( nextPattern.innerBlocks ) {
+ if ( nextVariation.innerBlocks ) {
replaceInnerBlocks(
props.clientId,
- createBlocksFromInnerBlocksTemplate( nextPattern.innerBlocks )
+ createBlocksFromInnerBlocksTemplate( nextVariation.innerBlocks )
);
}
} }
diff --git a/packages/block-library/src/columns/index.js b/packages/block-library/src/columns/index.js
index e813611d92ba6..9e3d3fb190398 100644
--- a/packages/block-library/src/columns/index.js
+++ b/packages/block-library/src/columns/index.js
@@ -10,8 +10,8 @@ import { columns as icon } from '@wordpress/icons';
import deprecated from './deprecated';
import edit from './edit';
import metadata from './block.json';
-import patterns from './patterns';
import save from './save';
+import variations from './variations';
const { name } = metadata;
@@ -27,7 +27,7 @@ export const settings = {
align: [ 'wide', 'full' ],
html: false,
},
- patterns,
+ variations,
example: {
innerBlocks: [
{
diff --git a/packages/block-library/src/columns/patterns.js b/packages/block-library/src/columns/variations.js
similarity index 94%
rename from packages/block-library/src/columns/patterns.js
rename to packages/block-library/src/columns/variations.js
index 0b924068012cc..16c0de911de51 100644
--- a/packages/block-library/src/columns/patterns.js
+++ b/packages/block-library/src/columns/variations.js
@@ -4,12 +4,14 @@
import { Path, SVG } from '@wordpress/components';
import { __ } from '@wordpress/i18n';
+/** @typedef {import('@wordpress/blocks').WPBlockVariation} WPBlockVariation */
+
/**
* Template option choices for predefined columns layouts.
*
- * @type {WPBlockPattern[]}
+ * @type {WPBlockVariation[]}
*/
-const patterns = [
+const variations = [
{
name: 'two-columns-equal',
title: __( 'Two columns; equal split' ),
@@ -96,4 +98,4 @@ const patterns = [
},
];
-export default patterns;
+export default variations;
diff --git a/packages/blocks/src/api/index.js b/packages/blocks/src/api/index.js
index 59c7a564db54e..0526521f3a1ef 100644
--- a/packages/blocks/src/api/index.js
+++ b/packages/blocks/src/api/index.js
@@ -42,8 +42,8 @@ export {
unstable__bootstrapServerSideBlockDefinitions, // eslint-disable-line camelcase
registerBlockStyle,
unregisterBlockStyle,
- __experimentalRegisterBlockPattern,
- __experimentalUnregisterBlockPattern,
+ __experimentalRegisterBlockVariation,
+ __experimentalUnregisterBlockVariation,
} from './registration';
export {
isUnmodifiedDefaultBlock,
diff --git a/packages/blocks/src/api/registration.js b/packages/blocks/src/api/registration.js
index 22c512d0518d7..ed7823e39137b 100644
--- a/packages/blocks/src/api/registration.js
+++ b/packages/blocks/src/api/registration.js
@@ -58,31 +58,31 @@ import { DEPRECATED_ENTRY_KEYS } from './constants';
*/
/**
- * Named block pattern scopes.
+ * Named block variation scopes.
*
- * @typedef {'block'|'inserter'} WPBlockPatternScope
+ * @typedef {'block'|'inserter'} WPBlockVariationScope
*/
/**
- * An object describing a pattern defined for the block type.
+ * An object describing a variation defined for the block type.
*
- * @typedef {Object} WPBlockPattern
+ * @typedef {Object} WPBlockVariation
*
- * @property {string} name The unique and machine-readable name.
- * @property {string} title A human-readable pattern title.
- * @property {string} description A detailed pattern description.
- * @property {WPIcon} [icon] An icon helping to visualize the pattern.
- * @property {boolean} [isDefault] Indicates whether the current pattern is
- * the default one. Defaults to `false`.
- * @property {Object} [attributes] Values which override block attributes.
- * @property {Array[]} [innerBlocks] Initial configuration of nested blocks.
- * @property {Object} [example] Example provides structured data for
- * the block preview. You can set to
- * `undefined` to disable the preview shown
- * for the block type.
- * @property {WPBlockPatternScope[]} [scope] The list of scopes where the pattern
- * is applicable. When not provided, it
- * assumes all available scopes.
+ * @property {string} name The unique and machine-readable name.
+ * @property {string} title A human-readable variation title.
+ * @property {string} description A detailed variation description.
+ * @property {WPIcon} [icon] An icon helping to visualize the variation.
+ * @property {boolean} [isDefault] Indicates whether the current variation is
+ * the default one. Defaults to `false`.
+ * @property {Object} [attributes] Values which override block attributes.
+ * @property {Array[]} [innerBlocks] Initial configuration of nested blocks.
+ * @property {Object} [example] Example provides structured data for
+ * the block preview. You can set to
+ * `undefined` to disable the preview shown
+ * for the block type.
+ * @property {WPBlockVariationScope[]} [scope] The list of scopes where the variation
+ * is applicable. When not provided, it
+ * assumes all available scopes.
*/
/**
@@ -90,26 +90,26 @@ import { DEPRECATED_ENTRY_KEYS } from './constants';
*
* @typedef {Object} WPBlock
*
- * @property {string} name Block type's namespaced name.
- * @property {string} title Human-readable block type label.
- * @property {string} description A detailed block type description.
- * @property {string} category Block type category classification,
- * used in search interfaces to arrange
- * block types by category.
- * @property {WPBlockTypeIcon} [icon] Block type icon.
- * @property {string[]} [keywords] Additional keywords to produce block
- * type as result in search interfaces.
- * @property {Object} [attributes] Block type attributes.
- * @property {WPComponent} [save] Optional component describing
- * serialized markup structure of a
- * block type.
- * @property {WPComponent} edit Component rendering an element to
- * manipulate the attributes of a block
- * in the context of an editor.
- * @property {WPBlockPattern[]} [patterns] The list of block patterns.
- * @property {Object} [example] Example provides structured data for
- * the block preview. When not defined
- * then no preview is shown.
+ * @property {string} name Block type's namespaced name.
+ * @property {string} title Human-readable block type label.
+ * @property {string} description A detailed block type description.
+ * @property {string} category Block type category classification,
+ * used in search interfaces to arrange
+ * block types by category.
+ * @property {WPBlockTypeIcon} [icon] Block type icon.
+ * @property {string[]} [keywords] Additional keywords to produce block
+ * type as result in search interfaces.
+ * @property {Object} [attributes] Block type attributes.
+ * @property {WPComponent} [save] Optional component describing
+ * serialized markup structure of a
+ * block type.
+ * @property {WPComponent} edit Component rendering an element to
+ * manipulate the attributes of a block
+ * in the context of an editor.
+ * @property {WPBlockVariation[]} [variations] The list of block variations.
+ * @property {Object} [example] Example provides structured data for
+ * the block preview. When not defined
+ * then no preview is shown.
*/
/**
@@ -474,21 +474,21 @@ export const unregisterBlockStyle = ( blockName, styleVariationName ) => {
};
/**
- * Registers a new block pattern for the given block.
+ * Registers a new block variation for the given block.
*
- * @param {string} blockName Name of the block (example: “core/columns”).
- * @param {WPBlockPattern} pattern Object describing a block pattern.
+ * @param {string} blockName Name of the block (example: “core/columns”).
+ * @param {WPBlockVariation} variation Object describing a block variation.
*/
-export const __experimentalRegisterBlockPattern = ( blockName, pattern ) => {
- dispatch( 'core/blocks' ).__experimentalAddBlockPatterns( blockName, pattern );
+export const __experimentalRegisterBlockVariation = ( blockName, variation ) => {
+ dispatch( 'core/blocks' ).__experimentalAddBlockVariations( blockName, variation );
};
/**
- * Unregisters a block pattern defined for the given block.
+ * Unregisters a block variation defined for the given block.
*
- * @param {string} blockName Name of the block (example: “core/columns”).
- * @param {string} patternName Name of the pattern defined for the block.
+ * @param {string} blockName Name of the block (example: “core/columns”).
+ * @param {string} variationName Name of the variation defined for the block.
*/
-export const __experimentalUnregisterBlockPattern = ( blockName, patternName ) => {
- dispatch( 'core/blocks' ).__experimentalRemoveBlockPatterns( blockName, patternName );
+export const __experimentalUnregisterBlockVariation = ( blockName, variationName ) => {
+ dispatch( 'core/blocks' ).__experimentalRemoveBlockVariations( blockName, variationName );
};
diff --git a/packages/blocks/src/api/test/registration.js b/packages/blocks/src/api/test/registration.js
index 8854b280d06ec..c1d68fe7f9541 100644
--- a/packages/blocks/src/api/test/registration.js
+++ b/packages/blocks/src/api/test/registration.js
@@ -526,7 +526,7 @@ describe( 'blocks', () => {
},
attributes: {},
keywords: [],
- patterns: [],
+ variations: [],
},
] );
const oldBlock = unregisterBlockType( 'core/test-block' );
@@ -666,7 +666,7 @@ describe( 'blocks', () => {
},
attributes: {},
keywords: [],
- patterns: [],
+ variations: [],
},
{
name: 'core/test-block-with-settings',
@@ -679,7 +679,7 @@ describe( 'blocks', () => {
},
attributes: {},
keywords: [],
- patterns: [],
+ variations: [],
},
] );
} );
diff --git a/packages/blocks/src/store/actions.js b/packages/blocks/src/store/actions.js
index 6d8521f5f8eee..212745b891855 100644
--- a/packages/blocks/src/store/actions.js
+++ b/packages/blocks/src/store/actions.js
@@ -64,33 +64,33 @@ export function removeBlockStyles( blockName, styleNames ) {
}
/**
- * Returns an action object used in signalling that new block patterns have been added.
+ * Returns an action object used in signalling that new block variations have been added.
*
- * @param {string} blockName Block name.
- * @param {WPBlockPattern|WPBlockPattern[]} patterns Block patterns.
+ * @param {string} blockName Block name.
+ * @param {WPBlockVariation|WPBlockVariation[]} variations Block variations.
*
* @return {Object} Action object.
*/
-export function __experimentalAddBlockPatterns( blockName, patterns ) {
+export function __experimentalAddBlockVariations( blockName, variations ) {
return {
- type: 'ADD_BLOCK_PATTERNS',
- patterns: castArray( patterns ),
+ type: 'ADD_BLOCK_VARIATIONS',
+ variations: castArray( variations ),
blockName,
};
}
/**
- * Returns an action object used in signalling that block patterns have been removed.
+ * Returns an action object used in signalling that block variations have been removed.
*
- * @param {string} blockName Block name.
- * @param {string|string[]} patternNames Block pattern names.
+ * @param {string} blockName Block name.
+ * @param {string|string[]} variationNames Block variation names.
*
* @return {Object} Action object.
*/
-export function __experimentalRemoveBlockPatterns( blockName, patternNames ) {
+export function __experimentalRemoveBlockVariations( blockName, variationNames ) {
return {
- type: 'REMOVE_BLOCK_PATTERNS',
- patternNames: castArray( patternNames ),
+ type: 'REMOVE_BLOCK_VARIATIONS',
+ variationNames: castArray( variationNames ),
blockName,
};
}
diff --git a/packages/blocks/src/store/reducer.js b/packages/blocks/src/store/reducer.js
index 66b9660182966..bc1b4291451af 100644
--- a/packages/blocks/src/store/reducer.js
+++ b/packages/blocks/src/store/reducer.js
@@ -88,39 +88,39 @@ export function blockStyles( state = {}, action ) {
}
/**
- * Reducer managing the block patterns.
+ * Reducer managing the block variations.
*
* @param {Object} state Current state.
* @param {Object} action Dispatched action.
*
* @return {Object} Updated state.
*/
-export function blockPatterns( state = {}, action ) {
+export function blockVariations( state = {}, action ) {
switch ( action.type ) {
case 'ADD_BLOCK_TYPES':
return {
...state,
...mapValues( keyBy( action.blockTypes, 'name' ), ( blockType ) => {
return uniqBy(
- [ ...get( blockType, [ 'patterns' ], [] ), ...get( state, [ blockType.name ], [] ) ],
- ( pattern ) => pattern.name
+ [ ...get( blockType, [ 'variations' ], [] ), ...get( state, [ blockType.name ], [] ) ],
+ ( variation ) => variation.name
);
} ),
};
- case 'ADD_BLOCK_PATTERNS':
+ case 'ADD_BLOCK_VARIATIONS':
return {
...state,
[ action.blockName ]: uniqBy(
- [ ...get( state, [ action.blockName ], [] ), ...action.patterns ],
- ( pattern ) => pattern.name
+ [ ...get( state, [ action.blockName ], [] ), ...action.variations ],
+ ( variation ) => variation.name
),
};
- case 'REMOVE_BLOCK_PATTERNS':
+ case 'REMOVE_BLOCK_VARIATIONS':
return {
...state,
[ action.blockName ]: filter(
get( state, [ action.blockName ], [] ),
- ( pattern ) => action.patternNames.indexOf( pattern.name ) === -1
+ ( variation ) => action.variationNames.indexOf( variation.name ) === -1
),
};
}
@@ -213,7 +213,7 @@ export function collections( state = {}, action ) {
export default combineReducers( {
blockTypes,
blockStyles,
- blockPatterns,
+ blockVariations,
defaultBlockName,
freeformFallbackBlockName,
unregisteredFallbackBlockName,
diff --git a/packages/blocks/src/store/selectors.js b/packages/blocks/src/store/selectors.js
index cf63698cb2dc2..792f85c8ce18a 100644
--- a/packages/blocks/src/store/selectors.js
+++ b/packages/blocks/src/store/selectors.js
@@ -4,7 +4,7 @@
import createSelector from 'rememo';
import { deburr, filter, findLast, first, flow, get, includes, map, some } from 'lodash';
-/** @typedef {import('../api/registration').WPBlockPatternScope} WPBlockPatternScope */
+/** @typedef {import('../api/registration').WPBlockVariationScope} WPBlockVariationScope */
/**
* Given a block name or block type object, returns the corresponding
@@ -30,11 +30,11 @@ export const getBlockTypes = createSelector(
return Object.values( state.blockTypes ).map( ( blockType ) => {
return {
...blockType,
- patterns: __experimentalGetBlockPatterns( state, blockType.name ),
+ variations: __experimentalGetBlockVariations( state, blockType.name ),
};
} );
},
- ( state ) => [ state.blockTypes, state.blockPatterns ]
+ ( state ) => [ state.blockTypes, state.blockVariations ]
);
/**
@@ -62,40 +62,40 @@ export function getBlockStyles( state, name ) {
}
/**
- * Returns block patterns by block name.
+ * Returns block variations by block name.
*
- * @param {Object} state Data state.
- * @param {string} blockName Block type name.
- * @param {WPBlockPatternScope} [scope] Block pattern scope name.
+ * @param {Object} state Data state.
+ * @param {string} blockName Block type name.
+ * @param {WPBlockVariationScope} [scope] Block variation scope name.
*
- * @return {(WPBlockPattern[]|void)} Block patterns.
+ * @return {(WPBlockVariation[]|void)} Block variations.
*/
-export function __experimentalGetBlockPatterns( state, blockName, scope ) {
- const patterns = state.blockPatterns[ blockName ];
- if ( ! patterns || ! scope ) {
- return patterns;
+export function __experimentalGetBlockVariations( state, blockName, scope ) {
+ const variations = state.blockVariations[ blockName ];
+ if ( ! variations || ! scope ) {
+ return variations;
}
- return patterns.filter( ( pattern ) => {
- return ! pattern.scope || pattern.scope.includes( scope );
+ return variations.filter( ( variation ) => {
+ return ! variation.scope || variation.scope.includes( scope );
} );
}
/**
- * Returns the default block pattern for the given block type.
- * When there are multiple patterns annotated as the default one,
+ * Returns the default block variation for the given block type.
+ * When there are multiple variations annotated as the default one,
* the last added item is picked. This simplifies registering overrides.
- * When there is no default pattern set, it returns the first item.
+ * When there is no default variation set, it returns the first item.
*
- * @param {Object} state Data state.
- * @param {string} blockName Block type name.
- * @param {WPBlockPatternScope} [scope] Block pattern scope name.
+ * @param {Object} state Data state.
+ * @param {string} blockName Block type name.
+ * @param {WPBlockVariationScope} [scope] Block variation scope name.
*
- * @return {?WPBlockPattern} The default block pattern.
+ * @return {?WPBlockVariation} The default block variation.
*/
-export function __experimentalGetDefaultBlockPattern( state, blockName, scope ) {
- const patterns = __experimentalGetBlockPatterns( state, blockName, scope );
+export function __experimentalGetDefaultBlockVariation( state, blockName, scope ) {
+ const variations = __experimentalGetBlockVariations( state, blockName, scope );
- return findLast( patterns, 'isDefault' ) || first( patterns );
+ return findLast( variations, 'isDefault' ) || first( variations );
}
/**
diff --git a/packages/blocks/src/store/test/actions.js b/packages/blocks/src/store/test/actions.js
index 1632e7e14e17e..ee1c5ac603e51 100644
--- a/packages/blocks/src/store/test/actions.js
+++ b/packages/blocks/src/store/test/actions.js
@@ -1,34 +1,34 @@
/**
* Internal dependencies
*/
-import { __experimentalAddBlockPatterns, __experimentalRemoveBlockPatterns } from '../actions';
+import { __experimentalAddBlockVariations, __experimentalRemoveBlockVariations } from '../actions';
describe( 'actions', () => {
- describe( 'addBlockPatterns', () => {
+ describe( 'addBlockVariations', () => {
const blockName = 'block/name';
- const patternName = 'my-pattern';
+ const variationName = 'my-variation';
- it( 'should return the ADD_BLOCK_PATTERNS action', () => {
- const pattern = {
- name: patternName,
- title: 'My Pattern',
+ it( 'should return the ADD_BLOCK_VARIATIONS action', () => {
+ const variation = {
+ name: variationName,
+ title: 'My Variation',
attributes: {
example: 'foo',
},
};
- const result = __experimentalAddBlockPatterns( blockName, pattern );
+ const result = __experimentalAddBlockVariations( blockName, variation );
expect( result ).toEqual( {
- type: 'ADD_BLOCK_PATTERNS',
- patterns: [ pattern ],
+ type: 'ADD_BLOCK_VARIATIONS',
+ variations: [ variation ],
blockName,
} );
} );
- it( 'should return the REMOVE_BLOCK_PATTERNS action', () => {
- const result = __experimentalRemoveBlockPatterns( blockName, patternName );
+ it( 'should return the REMOVE_BLOCK_VARIATIONS action', () => {
+ const result = __experimentalRemoveBlockVariations( blockName, variationName );
expect( result ).toEqual( {
- type: 'REMOVE_BLOCK_PATTERNS',
- patternNames: [ patternName ],
+ type: 'REMOVE_BLOCK_VARIATIONS',
+ variationNames: [ variationName ],
blockName,
} );
} );
diff --git a/packages/blocks/src/store/test/reducer.js b/packages/blocks/src/store/test/reducer.js
index e52b2824e225c..c2355de38efd0 100644
--- a/packages/blocks/src/store/test/reducer.js
+++ b/packages/blocks/src/store/test/reducer.js
@@ -7,12 +7,12 @@ import deepFreeze from 'deep-freeze';
* Internal dependencies
*/
import {
- __experimentalAddBlockPatterns,
+ __experimentalAddBlockVariations,
addBlockTypes,
- __experimentalRemoveBlockPatterns,
+ __experimentalRemoveBlockVariations,
} from '../actions';
import {
- blockPatterns,
+ blockVariations,
blockStyles,
blockTypes,
categories,
@@ -127,85 +127,85 @@ describe( 'blockStyles', () => {
} );
} );
-describe( 'blockPatterns', () => {
+describe( 'blockVariations', () => {
const blockName = 'block/name';
- const blockPatternName = 'pattern-name';
- const blockPattern = {
- name: blockPatternName,
- label: 'My pattern',
+ const blockVariationName = 'variation-name';
+ const blockVariation = {
+ name: blockVariationName,
+ label: 'My variation',
};
- const secondBlockPatternName = 'second-pattern-name';
- const secondBlockPattern = {
- name: secondBlockPatternName,
- label: 'My Second Pattern',
+ const secondBlockVariationName = 'second-variation-name';
+ const secondBlockVariation = {
+ name: secondBlockVariationName,
+ label: 'My Second Variation',
};
it( 'should return an empty object as default state', () => {
- const state = blockPatterns( undefined, {} );
+ const state = blockVariations( undefined, {} );
expect( state ).toEqual( {} );
} );
- it( 'should add a new block pattern when no pattern register', () => {
+ it( 'should add a new block variation when no variation register', () => {
const initialState = deepFreeze( {} );
- const state = blockPatterns(
+ const state = blockVariations(
initialState,
- __experimentalAddBlockPatterns( blockName, blockPattern )
+ __experimentalAddBlockVariations( blockName, blockVariation )
);
expect( state ).toEqual( {
- [ blockName ]: [ blockPattern ],
+ [ blockName ]: [ blockVariation ],
} );
} );
- it( 'should add another pattern when a block pattern already present for the block', () => {
+ it( 'should add another variation when a block variation already present for the block', () => {
const initialState = deepFreeze( {
- [ blockName ]: [ blockPattern ],
+ [ blockName ]: [ blockVariation ],
} );
- const state = blockPatterns(
+ const state = blockVariations(
initialState,
- __experimentalAddBlockPatterns( blockName, secondBlockPattern )
+ __experimentalAddBlockVariations( blockName, secondBlockVariation )
);
expect( state ).toEqual( {
- [ blockName ]: [ blockPattern, secondBlockPattern ],
+ [ blockName ]: [ blockVariation, secondBlockVariation ],
} );
} );
- it( 'should prepend block patterns added when adding a block', () => {
+ it( 'should prepend block variations added when adding a block', () => {
const initialState = deepFreeze( {
- [ blockName ]: [ secondBlockPattern ],
+ [ blockName ]: [ secondBlockVariation ],
} );
- const state = blockPatterns(
+ const state = blockVariations(
initialState,
addBlockTypes( {
name: blockName,
- patterns: [ blockPattern ],
+ variations: [ blockVariation ],
} )
);
expect( state ).toEqual( {
- [ blockName ]: [ blockPattern, secondBlockPattern ],
+ [ blockName ]: [ blockVariation, secondBlockVariation ],
} );
} );
- it( 'should remove a block pattern', () => {
+ it( 'should remove a block variation', () => {
const initialState = deepFreeze( {
- [ blockName ]: [ blockPattern, secondBlockPattern ],
+ [ blockName ]: [ blockVariation, secondBlockVariation ],
} );
- const state = blockPatterns(
+ const state = blockVariations(
initialState,
- __experimentalRemoveBlockPatterns( blockName, blockPatternName )
+ __experimentalRemoveBlockVariations( blockName, blockVariationName )
);
expect( state ).toEqual( {
- [ blockName ]: [ secondBlockPattern ],
+ [ blockName ]: [ secondBlockVariation ],
} );
} );
} );
diff --git a/packages/blocks/src/store/test/selectors.js b/packages/blocks/src/store/test/selectors.js
index a7833648bda51..fbe568162c18d 100644
--- a/packages/blocks/src/store/test/selectors.js
+++ b/packages/blocks/src/store/test/selectors.js
@@ -8,7 +8,7 @@ import deepFreeze from 'deep-freeze';
*/
import {
getChildBlockNames,
- __experimentalGetDefaultBlockPattern,
+ __experimentalGetDefaultBlockVariation,
getGroupingBlockName,
isMatchingSearchTerm,
} from '../selectors';
@@ -145,73 +145,73 @@ describe( 'selectors', () => {
} );
} );
- describe( '__experimentalGetDefaultBlockPattern', () => {
+ describe( '__experimentalGetDefaultBlockVariation', () => {
const blockName = 'block/name';
- const createBlockPatternsState = ( patterns ) => {
+ const createBlockVariationsState = ( variations ) => {
return deepFreeze( {
- blockPatterns: {
- [ blockName ]: patterns,
+ blockVariations: {
+ [ blockName ]: variations,
},
} );
};
- const firstBlockPattern = {
- name: 'first-block-pattern',
+ const firstBlockVariation = {
+ name: 'first-block-variation',
};
- const secondBlockPattern = {
- name: 'second-block-pattern',
+ const secondBlockVariation = {
+ name: 'second-block-variation',
};
- const thirdBlockPattern = {
- name: 'third-block-pattern',
+ const thirdBlockVariation = {
+ name: 'third-block-variation',
};
- it( 'should return the default pattern when set', () => {
- const defaultBlockPattern = {
- ...secondBlockPattern,
+ it( 'should return the default variation when set', () => {
+ const defaultBlockVariation = {
+ ...secondBlockVariation,
isDefault: true,
};
- const state = createBlockPatternsState( [
- firstBlockPattern,
- defaultBlockPattern,
- thirdBlockPattern,
+ const state = createBlockVariationsState( [
+ firstBlockVariation,
+ defaultBlockVariation,
+ thirdBlockVariation,
] );
- const result = __experimentalGetDefaultBlockPattern( state, blockName );
+ const result = __experimentalGetDefaultBlockVariation( state, blockName );
- expect( result ).toEqual( defaultBlockPattern );
+ expect( result ).toEqual( defaultBlockVariation );
} );
- it( 'should return the last pattern when multiple default patterns added', () => {
- const defaultBlockPattern = {
- ...thirdBlockPattern,
+ it( 'should return the last variation when multiple default variations added', () => {
+ const defaultBlockVariation = {
+ ...thirdBlockVariation,
isDefault: true,
};
- const state = createBlockPatternsState( [
+ const state = createBlockVariationsState( [
{
- ...firstBlockPattern,
+ ...firstBlockVariation,
isDefault: true,
},
{
- ...secondBlockPattern,
+ ...secondBlockVariation,
isDefault: true,
},
- defaultBlockPattern,
+ defaultBlockVariation,
] );
- const result = __experimentalGetDefaultBlockPattern( state, blockName );
+ const result = __experimentalGetDefaultBlockVariation( state, blockName );
- expect( result ).toEqual( defaultBlockPattern );
+ expect( result ).toEqual( defaultBlockVariation );
} );
- it( 'should return the first pattern when no default pattern set', () => {
- const state = createBlockPatternsState( [
- firstBlockPattern,
- secondBlockPattern,
- thirdBlockPattern,
+ it( 'should return the first variation when no default variation set', () => {
+ const state = createBlockVariationsState( [
+ firstBlockVariation,
+ secondBlockVariation,
+ thirdBlockVariation,
] );
- const result = __experimentalGetDefaultBlockPattern( state, blockName );
+ const result = __experimentalGetDefaultBlockVariation( state, blockName );
- expect( result ).toEqual( firstBlockPattern );
+ expect( result ).toEqual( firstBlockVariation );
} );
} );