@wordpress/block-editor 12.3.0 → 12.3.2

package/src/store/selectors.js

@@ -187,16 +187,27 @@ export function getBlocks( state, rootClientId ) {
  * Returns a stripped down block object containing only its client ID,
  * and its inner blocks' client IDs.
  *
+ * @deprecated
+ *
  * @param {Object} state    Editor state.
  * @param {string} clientId Client ID of the block to get.
  *
  * @return {Object} Client IDs of the post blocks.
  */
 export const __unstableGetClientIdWithClientIdsTree = createSelector(
-	( state, clientId ) => ( {
-		clientId,
-		innerBlocks: __unstableGetClientIdsTree( state, clientId ),
-	} ),
+	( state, clientId ) => {
+		deprecated(
+			"wp.data.select( 'core/block-editor' ).__unstableGetClientIdWithClientIdsTree",
+			{
+				since: '6.3',
+				version: '6.5',
+			}
+		);
+		return {
+			clientId,
+			innerBlocks: __unstableGetClientIdsTree( state, clientId ),
+		};
+	},
 	( state ) => [ state.blocks.order ]
 );
 
@@ -205,16 +216,26 @@ export const __unstableGetClientIdWithClientIdsTree = createSelector(
  * given root, consisting of stripped down block objects containing only
  * their client IDs, and their inner blocks' client IDs.
  *
+ * @deprecated
+ *
  * @param {Object}  state        Editor state.
  * @param {?string} rootClientId Optional root client ID of block list.
  *
  * @return {Object[]} Client IDs of the post blocks.
  */
 export const __unstableGetClientIdsTree = createSelector(
-	( state, rootClientId = '' ) =>
-		getBlockOrder( state, rootClientId ).map( ( clientId ) =>
+	( state, rootClientId = '' ) => {
+		deprecated(
+			"wp.data.select( 'core/block-editor' ).__unstableGetClientIdsTree",
+			{
+				since: '6.3',
+				version: '6.5',
+			}
+		);
+		return getBlockOrder( state, rootClientId ).map( ( clientId ) =>
 			__unstableGetClientIdWithClientIdsTree( state, clientId )
-		),
+		);
+	},
 	( state ) => [ state.blocks.order ]
 );
 
@@ -303,10 +324,13 @@ export const __experimentalGetGlobalBlocksByName = createSelector(
 		if ( ! blockName ) {
 			return EMPTY_ARRAY;
 		}
+		const blockNames = Array.isArray( blockName )
+			? blockName
+			: [ blockName ];
 		const clientIds = getClientIdsWithDescendants( state );
 		const foundBlocks = clientIds.filter( ( clientId ) => {
 			const block = state.blocks.byClientId.get( clientId );
-			return block.name === blockName;
+			return blockNames.includes( block.name );
 		} );
 		return foundBlocks.length > 0 ? foundBlocks : EMPTY_ARRAY;
 	},
@@ -536,18 +560,10 @@ export const getBlockParents = createSelector(
 export const getBlockParentsByBlockName = createSelector(
 	( state, clientId, blockName, ascending = false ) => {
 		const parents = getBlockParents( state, clientId, ascending );
-		return parents
-			.map( ( id ) => ( {
-				id,
-				name: getBlockName( state, id ),
-			} ) )
-			.filter( ( { name } ) => {
-				if ( Array.isArray( blockName ) ) {
-					return blockName.includes( name );
-				}
-				return name === blockName;
-			} )
-			.map( ( { id } ) => id );
+		const hasName = Array.isArray( blockName )
+			? ( name ) => blockName.includes( name )
+			: ( name ) => blockName === name;
+		return parents.filter( ( id ) => hasName( getBlockName( state, id ) ) );
 	},
 	( state ) => [ state.blocks.parents ]
 );
@@ -1672,16 +1688,14 @@ export function canRemoveBlock( state, clientId, rootClientId = null ) {
 	if ( attributes === null ) {
 		return true;
 	}
-	if ( attributes.lock?.remove ) {
-		return false;
+	if ( attributes.lock?.remove !== undefined ) {
+		return ! attributes.lock.remove;
 	}
 	if ( getTemplateLock( state, rootClientId ) ) {
 		return false;
 	}
-	if ( getBlockEditingMode( state, rootClientId ) === 'disabled' ) {
-		return false;
-	}
-	return true;
+
+	return getBlockEditingMode( state, rootClientId ) !== 'disabled';
 }
 
 /**
@@ -1711,18 +1725,16 @@ export function canRemoveBlocks( state, clientIds, rootClientId = null ) {
 export function canMoveBlock( state, clientId, rootClientId = null ) {
 	const attributes = getBlockAttributes( state, clientId );
 	if ( attributes === null ) {
-		return;
+		return true;
 	}
-	if ( attributes.lock?.move ) {
-		return false;
+	if ( attributes.lock?.move !== undefined ) {
+		return ! attributes.lock.move;
 	}
 	if ( getTemplateLock( state, rootClientId ) === 'all' ) {
 		return false;
 	}
-	if ( getBlockEditingMode( state, rootClientId ) === 'disabled' ) {
-		return false;
-	}
-	return true;
+
+	return getBlockEditingMode( state, rootClientId ) !== 'disabled';
 }
 
 /**
@@ -1933,6 +1945,7 @@ const buildBlockTypeItem =
  *
  * @param    {Object}   state             Editor state.
  * @param    {?string}  rootClientId      Optional root client ID of block list.
+ * @param    {?string}  syncStatus        Optional sync status to filter pattern blocks by.
  *
  * @return {WPEditorInserterItem[]} Items that appear in inserter.
  *
@@ -1949,7 +1962,7 @@ const buildBlockTypeItem =
  * @property {number}   frecency          Heuristic that combines frequency and recency.
  */
 export const getInserterItems = createSelector(
-	( state, rootClientId = null ) => {
+	( state, rootClientId = null, syncStatus ) => {
 		const buildBlockTypeInserterItem = buildBlockTypeItem( state, {
 			buildScope: 'inserter',
 		} );
@@ -2014,6 +2027,7 @@ export const getInserterItems = createSelector(
 				isDisabled: false,
 				utility: 1, // Deprecated.
 				frecency,
+				content: reusableBlock.content.raw,
 			};
 		};
 
@@ -2028,7 +2042,14 @@ export const getInserterItems = createSelector(
 			'core/block',
 			rootClientId
 		)
-			? getReusableBlocks( state ).map( buildReusableBlockInserterItem )
+			? getReusableBlocks( state )
+					.filter(
+						( reusableBlock ) =>
+							syncStatus === reusableBlock.meta?.sync_status ||
+							( ! syncStatus &&
+								reusableBlock.meta?.sync_status === '' )
+					)
+					.map( buildReusableBlockInserterItem )
 			: [];
 
 		const items = blockTypeInserterItems.reduce( ( accumulator, item ) => {
@@ -2816,10 +2837,11 @@ export function __unstableGetTemporarilyEditingAsBlocks( state ) {
 }
 
 export function __unstableHasActiveBlockOverlayActive( state, clientId ) {
-	// Prevent overlay on disabled blocks. It's redundant since disabled blocks
-	// can't be selected, and prevents non-disabled nested blocks from being
-	// selected.
-	if ( getBlockEditingMode( state, clientId ) === 'disabled' ) {
+	// Prevent overlay on blocks with a non-default editing mode. If the mdoe is
+	// 'disabled' then the overlay is redundant since the block can't be
+	// selected. If the mode is 'contentOnly' then the overlay is redundant
+	// since there will be no controls to interact with once selected.
+	if ( getBlockEditingMode( state, clientId ) !== 'default' ) {
 		return false;
 	}
 

package/src/store/test/private-selectors.js

@@ -11,6 +11,8 @@ import {
 	getLastInsertedBlocksClientIds,
 	getBlockEditingMode,
 	isBlockSubtreeDisabled,
+	getListViewClientIdsTree,
+	getEnabledBlockParents,
 } from '../private-selectors';
 
 jest.mock( '@wordpress/data/src/select', () => ( {
@@ -74,7 +76,13 @@ describe( 'private selectors', () => {
 					[ 'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c', {} ], // | |  Paragraph
 				] ),
 				order: new Map( [
-					[ '', [ '6cf70164-9097-4460-bcbf-200560546988' ] ],
+					[
+						'',
+						[
+							'6cf70164-9097-4460-bcbf-200560546988',
+							'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+						],
+					],
 					[ '6cf70164-9097-4460-bcbf-200560546988', [] ],
 					[
 						'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
@@ -382,4 +390,264 @@ describe( 'private selectors', () => {
 			} );
 		} );
 	} );
+
+	describe( 'getListViewClientIdsTree', () => {
+		const baseState = {
+			settings: {},
+			blocks: {
+				byClientId: new Map( [
+					[ '6cf70164-9097-4460-bcbf-200560546988', {} ], // Header
+					[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', {} ], // Group
+					[ 'b26fc763-417d-4f01-b81c-2ec61e14a972', {} ], // |  Post Title
+					[ '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f', {} ], // |  Post Content
+					[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', {} ], // | |  Paragraph
+					[ 'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c', {} ], // | |  Paragraph
+				] ),
+				order: new Map( [
+					[
+						'',
+						[
+							'6cf70164-9097-4460-bcbf-200560546988',
+							'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+						],
+					],
+					[ '6cf70164-9097-4460-bcbf-200560546988', [] ],
+					[
+						'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+						[
+							'b26fc763-417d-4f01-b81c-2ec61e14a972',
+							'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+						],
+					],
+					[ 'b26fc763-417d-4f01-b81c-2ec61e14a972', [] ],
+					[
+						'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+						[
+							'b3247f75-fd94-4fef-97f9-5bfd162cc416',
+							'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+						],
+					],
+					[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', [] ],
+					[ 'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c', [] ],
+				] ),
+				parents: new Map( [
+					[ '6cf70164-9097-4460-bcbf-200560546988', '' ],
+					[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', '' ],
+					[
+						'b26fc763-417d-4f01-b81c-2ec61e14a972',
+						'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+					],
+					[
+						'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+						'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+					],
+					[
+						'b3247f75-fd94-4fef-97f9-5bfd162cc416',
+						'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+					],
+					[
+						'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+						'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+					],
+				] ),
+			},
+			blockListSettings: {
+				'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337': {},
+				'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f': {},
+			},
+		};
+
+		it( 'should return tree containing only clientId and innerBlocks', () => {
+			const state = {
+				...baseState,
+				blockEditingModes: new Map( [] ),
+			};
+			expect( getListViewClientIdsTree( state ) ).toEqual( [
+				{
+					clientId: '6cf70164-9097-4460-bcbf-200560546988',
+					innerBlocks: [],
+				},
+				{
+					clientId: 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+					innerBlocks: [
+						{
+							clientId: 'b26fc763-417d-4f01-b81c-2ec61e14a972',
+							innerBlocks: [],
+						},
+						{
+							clientId: '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+							innerBlocks: [
+								{
+									clientId:
+										'b3247f75-fd94-4fef-97f9-5bfd162cc416',
+									innerBlocks: [],
+								},
+								{
+									clientId:
+										'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+									innerBlocks: [],
+								},
+							],
+						},
+					],
+				},
+			] );
+		} );
+
+		it( 'should return a subtree when rootBlockClientId is given', () => {
+			const state = {
+				...baseState,
+				blockEditingModes: new Map( [] ),
+			};
+			expect(
+				getListViewClientIdsTree(
+					state,
+					'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
+				)
+			).toEqual( [
+				{
+					clientId: 'b26fc763-417d-4f01-b81c-2ec61e14a972',
+					innerBlocks: [],
+				},
+				{
+					clientId: '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+					innerBlocks: [
+						{
+							clientId: 'b3247f75-fd94-4fef-97f9-5bfd162cc416',
+							innerBlocks: [],
+						},
+						{
+							clientId: 'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+							innerBlocks: [],
+						},
+					],
+				},
+			] );
+		} );
+
+		it( 'should filter out disabled blocks', () => {
+			const state = {
+				...baseState,
+				blockEditingModes: new Map( [
+					[ '', 'disabled' ],
+					[ 'b26fc763-417d-4f01-b81c-2ec61e14a972', 'contentOnly' ],
+					[ '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f', 'contentOnly' ],
+				] ),
+			};
+			expect( getListViewClientIdsTree( state ) ).toEqual( [
+				{
+					clientId: 'b26fc763-417d-4f01-b81c-2ec61e14a972',
+					innerBlocks: [],
+				},
+				{
+					clientId: '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+					innerBlocks: [
+						{
+							clientId: 'b3247f75-fd94-4fef-97f9-5bfd162cc416',
+							innerBlocks: [],
+						},
+						{
+							clientId: 'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+							innerBlocks: [],
+						},
+					],
+				},
+			] );
+		} );
+	} );
+
+	describe( 'getEnabledBlockParents', () => {
+		it( 'should return an empty array if block is at the root', () => {
+			const state = {
+				settings: {},
+				blocks: {
+					parents: new Map( [
+						[ '6cf70164-9097-4460-bcbf-200560546988', '' ],
+					] ),
+				},
+				blockEditingModes: new Map(),
+			};
+			expect(
+				getEnabledBlockParents(
+					state,
+					'6cf70164-9097-4460-bcbf-200560546988'
+				)
+			).toEqual( [] );
+		} );
+
+		it( 'should return non-disabled parents', () => {
+			const state = {
+				settings: {},
+				blocks: {
+					parents: new Map( [
+						[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', '' ],
+						[
+							'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+							'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+						],
+						[
+							'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+							'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+						],
+						[
+							'4c2b7140-fffd-44b4-b2a7-820c670a6514',
+							'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+						],
+					] ),
+				},
+				blockEditingModes: new Map( [
+					[ '', 'disabled' ],
+					[ '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f', 'default' ],
+				] ),
+				blockListSettings: {},
+			};
+			expect(
+				getEnabledBlockParents(
+					state,
+					'4c2b7140-fffd-44b4-b2a7-820c670a6514'
+				)
+			).toEqual( [
+				'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+				'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+			] );
+		} );
+
+		it( 'should order from bottom to top if ascending is true', () => {
+			const state = {
+				settings: {},
+				blocks: {
+					parents: new Map( [
+						[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', '' ],
+						[
+							'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+							'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+						],
+						[
+							'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+							'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+						],
+						[
+							'4c2b7140-fffd-44b4-b2a7-820c670a6514',
+							'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+						],
+					] ),
+				},
+				blockEditingModes: new Map( [
+					[ '', 'disabled' ],
+					[ '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f', 'default' ],
+				] ),
+				blockListSettings: {},
+			};
+			expect(
+				getEnabledBlockParents(
+					state,
+					'4c2b7140-fffd-44b4-b2a7-820c670a6514',
+					true
+				)
+			).toEqual( [
+				'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+				'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+			] );
+		} );
+	} );
 } );

package/src/store/test/selectors.js

@@ -3326,36 +3326,36 @@ describe( 'selectors', () => {
 				( item ) => item.id === 'core/test-block-a'
 			);
 			expect( testBlockAItem ).toEqual( {
+				category: 'design',
+				description: undefined,
+				example: undefined,
+				frecency: 0,
+				icon: { src: 'test' },
 				id: 'core/test-block-a',
-				name: 'core/test-block-a',
 				initialAttributes: {},
-				title: 'Test Block A',
-				icon: {
-					src: 'test',
-				},
-				category: 'design',
-				keywords: [ 'testing' ],
-				variations: [],
 				isDisabled: false,
+				keywords: [ 'testing' ],
+				name: 'core/test-block-a',
+				title: 'Test Block A',
 				utility: 1,
-				frecency: 0,
+				variations: [],
 			} );
 			const reusableBlockItem = items.find(
 				( item ) => item.id === 'core/block/1'
 			);
 			expect( reusableBlockItem ).toEqual( {
+				category: 'reusable',
+				content: '<!-- /wp:test-block-a -->',
+				frecency: 0,
+				icon: { src: 'test' },
 				id: 'core/block/1',
-				name: 'core/block',
 				initialAttributes: { ref: 1 },
-				title: 'Reusable Block 1',
-				icon: {
-					src: 'test',
-				},
-				category: 'reusable',
-				keywords: [],
 				isDisabled: false,
+				keywords: [],
+				name: 'core/block',
+				syncStatus: undefined,
+				title: 'Reusable Block 1',
 				utility: 1,
-				frecency: 0,
 			} );
 		} );
 
@@ -4734,6 +4734,7 @@ describe( '__unstableGetClientIdWithClientIdsTree', () => {
 				{ clientId: 'baz', innerBlocks: [] },
 			],
 		} );
+		expect( console ).toHaveWarned();
 	} );
 } );
 describe( '__unstableGetClientIdsTree', () => {

package/src/utils/object.js

@@ -1,3 +1,8 @@
+/**
+ * External dependencies
+ */
+import { paramCase } from 'change-case';
+
 /**
  * Converts a path to an array of its fragments.
  * Supports strings, numbers and arrays:
@@ -19,6 +24,36 @@ function normalizePath( path ) {
 	return [ path ];
 }
 
+/**
+ * Converts any string to kebab case.
+ * Backwards compatible with Lodash's `_.kebabCase()`.
+ * Backwards compatible with `_wp_to_kebab_case()`.
+ *
+ * @see https://lodash.com/docs/4.17.15#kebabCase
+ * @see https://developer.wordpress.org/reference/functions/_wp_to_kebab_case/
+ *
+ * @param {string} str String to convert.
+ * @return {string} Kebab-cased string
+ */
+export function kebabCase( str ) {
+	let input = str;
+	if ( typeof str !== 'string' ) {
+		input = str?.toString?.() ?? '';
+	}
+
+	// See https://github.com/lodash/lodash/blob/b185fcee26b2133bd071f4aaca14b455c2ed1008/lodash.js#L4970
+	input = input.replace( /['\u2019]/, '' );
+
+	return paramCase( input, {
+		splitRegexp: [
+			/(?!(?:1ST|2ND|3RD|[4-9]TH)(?![a-z]))([a-z0-9])([A-Z])/g, // fooBar => foo-bar, 3Bar => 3-bar
+			/(?!(?:1st|2nd|3rd|[4-9]th)(?![a-z]))([0-9])([a-z])/g, // 3bar => 3-bar
+			/([A-Za-z])([0-9])/g, // Foo3 => foo-3, foo3 => foo-3
+			/([A-Z])([A-Z][a-z])/g, // FOOBar => foo-bar
+		],
+	} );
+}
+
 /**
  * Clones an object.
  * Non-object values are returned unchanged.

package/src/utils/test/object.js

@@ -1,7 +1,102 @@
 /**
  * Internal dependencies
  */
-import { setImmutably } from '../object';
+import { kebabCase, setImmutably } from '../object';
+
+describe( 'kebabCase', () => {
+	it( 'separates lowercase letters, followed by uppercase letters', () => {
+		expect( kebabCase( 'fooBar' ) ).toEqual( 'foo-bar' );
+	} );
+
+	it( 'separates numbers, followed by uppercase letters', () => {
+		expect( kebabCase( '123FOO' ) ).toEqual( '123-foo' );
+	} );
+
+	it( 'separates numbers, followed by lowercase characters', () => {
+		expect( kebabCase( '123bar' ) ).toEqual( '123-bar' );
+	} );
+
+	it( 'separates uppercase letters, followed by numbers', () => {
+		expect( kebabCase( 'FOO123' ) ).toEqual( 'foo-123' );
+	} );
+
+	it( 'separates lowercase letters, followed by numbers', () => {
+		expect( kebabCase( 'foo123' ) ).toEqual( 'foo-123' );
+	} );
+
+	it( 'separates uppercase groups from capitalized groups', () => {
+		expect( kebabCase( 'FOOBar' ) ).toEqual( 'foo-bar' );
+	} );
+
+	it( 'removes any non-dash special characters', () => {
+		expect(
+			kebabCase( 'foo±§!@#$%^&*()-_=+/?.>,<\\|{}[]`~\'";:bar' )
+		).toEqual( 'foo-bar' );
+	} );
+
+	it( 'removes any spacing characters', () => {
+		expect( kebabCase( ' foo \t \n \r \f \v bar ' ) ).toEqual( 'foo-bar' );
+	} );
+
+	it( 'groups multiple dashes into a single one', () => {
+		expect( kebabCase( 'foo---bar' ) ).toEqual( 'foo-bar' );
+	} );
+
+	it( 'returns an empty string unchanged', () => {
+		expect( kebabCase( '' ) ).toEqual( '' );
+	} );
+
+	it( 'returns an existing kebab case string unchanged', () => {
+		expect( kebabCase( 'foo-123-bar' ) ).toEqual( 'foo-123-bar' );
+	} );
+
+	it( 'returns an empty string if any nullish type is passed', () => {
+		expect( kebabCase( undefined ) ).toEqual( '' );
+		expect( kebabCase( null ) ).toEqual( '' );
+	} );
+
+	it( 'converts any unexpected non-nullish type to a string', () => {
+		expect( kebabCase( 12345 ) ).toEqual( '12345' );
+		expect( kebabCase( [] ) ).toEqual( '' );
+		expect( kebabCase( {} ) ).toEqual( 'object-object' );
+	} );
+
+	/**
+	 * Should cover all test cases of `_wp_to_kebab_case()`.
+	 *
+	 * @see https://developer.wordpress.org/reference/functions/_wp_to_kebab_case/
+	 * @see https://github.com/WordPress/wordpress-develop/blob/76376fdbc3dc0b3261de377dffc350677345e7ba/tests/phpunit/tests/functions/wpToKebabCase.php#L35-L62
+	 */
+	it.each( [
+		[ 'white', 'white' ],
+		[ 'white+black', 'white-black' ],
+		[ 'white:black', 'white-black' ],
+		[ 'white*black', 'white-black' ],
+		[ 'white.black', 'white-black' ],
+		[ 'white black', 'white-black' ],
+		[ 'white	black', 'white-black' ],
+		[ 'white-to-black', 'white-to-black' ],
+		[ 'white2white', 'white-2-white' ],
+		[ 'white2nd', 'white-2nd' ],
+		[ 'white2ndcolor', 'white-2-ndcolor' ],
+		[ 'white2ndColor', 'white-2nd-color' ],
+		[ 'white2nd_color', 'white-2nd-color' ],
+		[ 'white23color', 'white-23-color' ],
+		[ 'white23', 'white-23' ],
+		[ '23color', '23-color' ],
+		[ 'white4th', 'white-4th' ],
+		[ 'font2xl', 'font-2-xl' ],
+		[ 'whiteToWhite', 'white-to-white' ],
+		[ 'whiteTOwhite', 'white-t-owhite' ],
+		[ 'WHITEtoWHITE', 'whit-eto-white' ],
+		[ 42, '42' ],
+		[ "i've done", 'ive-done' ],
+		[ '#ffffff', 'ffffff' ],
+		[ '$ffffff', 'ffffff' ],
+	] )( 'converts %s properly to %s', ( input, expected ) => {
+		expect( kebabCase( input ) ).toEqual( expected );
+	} );
+} );
 
 describe( 'setImmutably', () => {
 	describe( 'handling falsy values properly', () => {