@wordpress/block-library 10.1.0 → 10.2.0

package/src/tab-panels/edit.js

@@ -12,8 +12,7 @@ import { __ } from '@wordpress/i18n';
 /**
  * Internal dependencies
  */
-import AddTabToolbarControl from '../tab-panel/add-tab-toolbar-control';
-import RemoveTabToolbarControl from '../tab-panel/remove-tab-toolbar-control';
+import TabToolbarControls from '../tabs/tab-toolbar-controls';
 
 /**
  * Initial template applied only when the block is first inserted (i.e. when
@@ -43,8 +42,7 @@ export default function Edit( { clientId } ) {
 
 	return (
 		<>
-			<AddTabToolbarControl tabsClientId={ tabsClientId } />
-			<RemoveTabToolbarControl tabsClientId={ tabsClientId } />
+			<TabToolbarControls tabsClientId={ tabsClientId } />
 			<div { ...innerBlocksProps } />
 		</>
 	);

package/src/table-of-contents/edit.js

@@ -190,7 +190,6 @@ export default function TableOfContentsEdit( {
 					isShownByDefault
 				>
 					<SelectControl
-						__next40pxDefaultSize
 						label={ __( 'Include headings down to level' ) }
 						value={ maxLevel || '' }
 						options={ [

package/src/tabs/README.md

@@ -1,8 +1,6 @@
 # Tabs
 
 <!-- START TOKEN(Autogenerated block API docs) -->
-<div class="callout callout-warning">This block is <strong>experimental</strong> and may change or be removed without notice.</div>
-
 Display content in a tabbed interface to help users navigate detailed content with ease.
 
 - **Name:** `core/tabs`
@@ -54,18 +52,29 @@ _Defined via the [`usesContext` and `providesContext`](https://developer.wordpre
 - `core/tabs-list`
 - `core/tabs-id`
 
-**Provides context:**
-
-- `core/tabs-activeTabIndex` → attribute `activeTabIndex`
-- `core/tabs-editorActiveTabIndex` → attribute `editorActiveTabIndex`
-
 ## Block Markup
 
 This is a [**hybrid block**](https://developer.wordpress.org/block-editor/getting-started/fundamentals/static-dynamic-rendering/). It saves static markup that the server may enhance during rendering.
 
 ```html
-<!-- wp:tabs {"activeTabIndex":0} -->
-<!-- Content... -->
+<!-- wp:tabs -->
+<div class="wp-block-tabs"><!-- wp:tab-list -->
+<div role="tablist" class="wp-block-tab-list"><button type="button" role="tab">Tab 1</button><button type="button" role="tab">Tab 2</button></div>
+<!-- /wp:tab-list -->
+
+<!-- wp:tab-panels -->
+<div class="wp-block-tab-panels"><!-- wp:tab-panel {"label":"Tab 1"} -->
+<section role="tabpanel" tabindex="0" class="wp-block-tab-panel"><!-- wp:paragraph -->
+<p>Panel 1</p>
+<!-- /wp:paragraph --></section>
+<!-- /wp:tab-panel -->
+
+<!-- wp:tab-panel {"label":"Tab 2"} -->
+<section role="tabpanel" tabindex="0" class="wp-block-tab-panel"><!-- wp:paragraph -->
+<p>Panel 2</p>
+<!-- /wp:paragraph --></section>
+<!-- /wp:tab-panel --></div>
+<!-- /wp:tab-panels --></div>
 <!-- /wp:tabs -->
 ```
 

package/src/tabs/block.json

@@ -1,6 +1,5 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"__experimental": true,
 	"apiVersion": 3,
 	"name": "core/tabs",
 	"title": "Tabs",
@@ -44,10 +43,6 @@
 			"__experimentalFontFamily": true
 		}
 	},
-	"providesContext": {
-		"core/tabs-activeTabIndex": "activeTabIndex",
-		"core/tabs-editorActiveTabIndex": "editorActiveTabIndex"
-	},
 	"usesContext": [ "core/tabs-list", "core/tabs-id" ],
 	"style": "wp-block-tabs",
 	"viewScriptModule": "@wordpress/block-library/tabs/view"

package/src/tabs/edit.js

@@ -1,23 +1,14 @@
 /**
  * WordPress dependencies
  */
-import {
-	useBlockProps,
-	useInnerBlocksProps,
-	BlockContextProvider,
-	store as blockEditorStore,
-} from '@wordpress/block-editor';
-import { useSelect } from '@wordpress/data';
-import { useMemo } from '@wordpress/element';
+import { useBlockProps, useInnerBlocksProps } from '@wordpress/block-editor';
 
 /**
  * Internal dependencies
  */
-import Controls from './controls';
+import TabToolbarControls from './tab-toolbar-controls';
 import useTabListItemsSync from './use-tab-list-items-sync';
 
-const EMPTY_ARRAY = [];
-
 /**
  * Only the two structural child blocks are specified here — without inner
  * block entries for core/tab-list or core/tab-panels.
@@ -32,54 +23,8 @@ const EMPTY_ARRAY = [];
  */
 const TABS_TEMPLATE = [ [ 'core/tab-list' ], [ 'core/tab-panels' ] ];
 
-function Edit( { clientId, attributes } ) {
-	const { anchor, activeTabIndex, editorActiveTabIndex } = attributes;
-
-	const { tabPanels, tabListClientId } = useSelect(
-		( select ) => {
-			const { getBlocks } = select( blockEditorStore );
-			const innerBlocks = getBlocks( clientId );
-
-			const tabPanelsBlock = innerBlocks.find(
-				( block ) => block.name === 'core/tab-panels'
-			);
-			const tabList = innerBlocks.find(
-				( block ) => block.name === 'core/tab-list'
-			);
-
-			return {
-				tabPanels: tabPanelsBlock?.innerBlocks ?? EMPTY_ARRAY,
-				tabListClientId: tabList?.clientId ?? null,
-			};
-		},
-		[ clientId ]
-	);
-
-	useTabListItemsSync( { tabPanels, tabListClientId } );
-
-	/**
-	 * Memoize context value to prevent unnecessary re-renders.
-	 */
-	const contextValue = useMemo( () => {
-		/**
-		 * Compute tabs list from innerblocks to provide via context.
-		 * This traverses the tab-panels block to find all tab-panel blocks
-		 * and extracts their label and anchor for the tab-list to consume.
-		 */
-		const tabList = tabPanels.map( ( tab, index ) => ( {
-			id: tab.attributes.anchor || `tab-${ index }`,
-			label: tab.attributes.label || '',
-			clientId: tab.clientId,
-			index,
-		} ) );
-
-		return {
-			'core/tabs-list': tabList,
-			'core/tabs-id': anchor,
-			'core/tabs-activeTabIndex': activeTabIndex,
-			'core/tabs-editorActiveTabIndex': editorActiveTabIndex,
-		};
-	}, [ tabPanels, anchor, activeTabIndex, editorActiveTabIndex ] );
+function Edit( { clientId } ) {
+	useTabListItemsSync( clientId );
 
 	const blockProps = useBlockProps();
 
@@ -91,12 +36,10 @@ function Edit( { clientId, attributes } ) {
 	} );
 
 	return (
-		<BlockContextProvider value={ contextValue }>
-			<div { ...innerBlockProps }>
-				<Controls clientId={ clientId } />
-				{ innerBlockProps.children }
-			</div>
-		</BlockContextProvider>
+		<div { ...innerBlockProps }>
+			<TabToolbarControls tabsClientId={ clientId } />
+			{ innerBlockProps.children }
+		</div>
 	);
 }
 

package/src/tabs/tab-toolbar-controls.js

@@ -0,0 +1,58 @@
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import {
+	BlockControls,
+	store as blockEditorStore,
+} from '@wordpress/block-editor';
+import { ToolbarGroup, ToolbarButton } from '@wordpress/components';
+import { useSelect } from '@wordpress/data';
+
+/**
+ * Internal dependencies
+ */
+import useTabActions from './use-tab-actions';
+
+/**
+ * "Add tab" and "Remove tab" buttons in the block toolbar for the tabs block.
+ * Inserts or removes a core/tab-panel. The tab-list items attribute is kept
+ * in sync automatically via useTabListItemsSync.
+ *
+ * @param {Object} props
+ * @param {string} props.tabsClientId The client ID of the parent tabs block.
+ * @return {React.JSX.Element} The toolbar control element.
+ */
+export default function TabToolbarControls( { tabsClientId } ) {
+	const { insertTab, removeTab } = useTabActions( tabsClientId );
+	const isRemoveDisabled = useSelect(
+		( select ) => {
+			if ( ! tabsClientId ) {
+				return true;
+			}
+			const tabPanels = select( blockEditorStore )
+				.getBlocks( tabsClientId )
+				.find( ( block ) => block.name === 'core/tab-panels' );
+			return ( tabPanels?.innerBlocks.length ?? 0 ) <= 1;
+		},
+		[ tabsClientId ]
+	);
+
+	return (
+		<BlockControls group="other">
+			<ToolbarGroup>
+				<ToolbarButton
+					className="components-toolbar__control"
+					onClick={ () => insertTab() }
+					text={ __( 'Add tab' ) }
+				/>
+				<ToolbarButton
+					className="components-toolbar__control"
+					onClick={ () => removeTab() }
+					text={ __( 'Remove tab' ) }
+					disabled={ isRemoveDisabled }
+				/>
+			</ToolbarGroup>
+		</BlockControls>
+	);
+}

package/src/tabs/use-tab-actions.js

@@ -0,0 +1,102 @@
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { createBlock } from '@wordpress/blocks';
+import { store as blockEditorStore } from '@wordpress/block-editor';
+import { useDispatch, useRegistry } from '@wordpress/data';
+
+/**
+ * Provides callbacks to insert and remove tabs for a tabs block.
+ *
+ * The hook intentionally avoids subscribing to the store: all data is derived
+ * lazily inside the callbacks via `registry.select`, so consumers don't
+ * re-render when the tab structure changes.
+ *
+ * @param {string|null} tabsClientId The client ID of the parent tabs block.
+ * @return {{ insertTab: Function, removeTab: Function }} Tab action callbacks.
+ */
+export default function useTabActions( tabsClientId ) {
+	const registry = useRegistry();
+	const {
+		insertBlock,
+		removeBlock,
+		updateBlockAttributes,
+		__unstableMarkNextChangeAsNotPersistent,
+	} = useDispatch( blockEditorStore );
+
+	// Derive the current tabs state at call time without subscribing.
+	const getTabsState = () => {
+		const { getBlocks, getBlockAttributes } =
+			registry.select( blockEditorStore );
+
+		const tabsAttributes = tabsClientId
+			? getBlockAttributes( tabsClientId )
+			: undefined;
+		const tabPanels = tabsClientId
+			? getBlocks( tabsClientId ).find(
+					( block ) => block.name === 'core/tab-panels'
+			  )
+			: undefined;
+
+		return {
+			tabPanelsClientId: tabPanels?.clientId ?? null,
+			tabPanelBlocks: tabPanels?.innerBlocks ?? [],
+			activeIndex:
+				tabsAttributes?.editorActiveTabIndex ??
+				tabsAttributes?.activeTabIndex ??
+				0,
+		};
+	};
+
+	// Insert a new tab and make it active. Defaults to appending at the end.
+	const insertTab = ( atIndex ) => {
+		const { tabPanelsClientId, tabPanelBlocks } = getTabsState();
+		if ( ! tabPanelsClientId ) {
+			return;
+		}
+
+		const newIndex = atIndex ?? tabPanelBlocks.length;
+		insertBlock(
+			createBlock( 'core/tab-panel', { label: __( 'Tab' ) } ),
+			newIndex,
+			tabPanelsClientId,
+			false
+		);
+
+		// Switch editor active tab to the new tab.
+		__unstableMarkNextChangeAsNotPersistent();
+		updateBlockAttributes( tabsClientId, {
+			editorActiveTabIndex: newIndex,
+		} );
+	};
+
+	// Remove a tab and move the active tab to an adjacent one. Defaults to the
+	// currently active tab.
+	const removeTab = ( atIndex ) => {
+		const { tabPanelBlocks, activeIndex } = getTabsState();
+		const tabCount = tabPanelBlocks.length;
+		if ( tabCount <= 1 ) {
+			return;
+		}
+
+		const removeIndex = atIndex ?? activeIndex;
+		const target = tabPanelBlocks[ removeIndex ];
+		if ( ! target ) {
+			return;
+		}
+
+		// Calculate new active index after removal.
+		const newActiveIndex =
+			removeIndex >= tabCount - 1 ? tabCount - 2 : removeIndex;
+
+		// Switch editor to the adjacent tab and remove the current one.
+		__unstableMarkNextChangeAsNotPersistent();
+		updateBlockAttributes( tabsClientId, {
+			editorActiveTabIndex: newActiveIndex,
+		} );
+		removeBlock( target.clientId, false );
+	};
+
+	return { insertTab, removeTab };
+}

package/src/tabs/use-tab-list-items-sync.js

@@ -2,8 +2,10 @@
  * WordPress dependencies
  */
 import { store as blockEditorStore } from '@wordpress/block-editor';
-import { useDispatch } from '@wordpress/data';
-import { useEffect, useRef } from '@wordpress/element';
+import { useDispatch, useSelect } from '@wordpress/data';
+import { useEffect } from '@wordpress/element';
+
+const EMPTY_ARRAY = [];
 
 /**
  * Keep the tab-list block's `tabs` attribute in sync with the tab-panel blocks.
@@ -12,15 +14,32 @@ import { useEffect, useRef } from '@wordpress/element';
  * label edit), this hook updates the `tabs` attribute on the core/tab-list
  * block so that save.js can render the correct buttons.
  *
- * @param {Object}      props
- * @param {Array}       props.tabPanels       Raw core/tab-panel block objects.
- * @param {string|null} props.tabListClientId Client ID of the core/tab-list block.
+ * @param {string} tabsClientId Client ID of the core/tabs block.
  */
-export default function useTabListItemsSync( { tabPanels, tabListClientId } ) {
+export default function useTabListItemsSync( tabsClientId ) {
+	const { tabPanels, tabListClientId } = useSelect(
+		( select ) => {
+			const { getBlocks } = select( blockEditorStore );
+			const innerBlocks = getBlocks( tabsClientId );
+
+			const tabPanelsBlock = innerBlocks.find(
+				( block ) => block.name === 'core/tab-panels'
+			);
+			const tabList = innerBlocks.find(
+				( block ) => block.name === 'core/tab-list'
+			);
+
+			return {
+				tabPanels: tabPanelsBlock?.innerBlocks ?? EMPTY_ARRAY,
+				tabListClientId: tabList?.clientId ?? null,
+			};
+		},
+		[ tabsClientId ]
+	);
+
 	const { updateBlockAttributes, __unstableMarkNextChangeAsNotPersistent } =
 		useDispatch( blockEditorStore );
-
-	const prevTabsRef = useRef( null );
+	const { getBlockAttributes } = useSelect( blockEditorStore );
 
 	useEffect( () => {
 		if ( ! tabListClientId ) {
@@ -31,18 +50,18 @@ export default function useTabListItemsSync( { tabPanels, tabListClientId } ) {
 			label: tab.attributes.label || '',
 		} ) );
 
-		// Only update if tabs actually changed to avoid unnecessary re-renders.
-		const serialized = JSON.stringify( newTabs );
-		if ( serialized === prevTabsRef.current ) {
+		// Skip the update when the stored tabs already match the derived ones.
+		const currentTabs = getBlockAttributes( tabListClientId )?.tabs ?? [];
+		if ( JSON.stringify( newTabs ) === JSON.stringify( currentTabs ) ) {
 			return;
 		}
-		prevTabsRef.current = serialized;
 
 		__unstableMarkNextChangeAsNotPersistent();
 		updateBlockAttributes( tabListClientId, { tabs: newTabs } );
 	}, [
 		tabPanels,
 		tabListClientId,
+		getBlockAttributes,
 		updateBlockAttributes,
 		__unstableMarkNextChangeAsNotPersistent,
 	] );

package/src/tag-cloud/edit.js

@@ -139,7 +139,6 @@ function TagCloudEdit( { attributes, setAttributes, name } ) {
 					isShownByDefault
 				>
 					<SelectControl
-						__next40pxDefaultSize
 						label={ __( 'Taxonomy' ) }
 						options={ getTaxonomyOptions() }
 						value={ taxonomy }
@@ -175,7 +174,6 @@ function TagCloudEdit( { attributes, setAttributes, name } ) {
 								units={ units }
 								min={ MIN_FONT_SIZE }
 								max={ MAX_FONT_SIZE }
-								size="__unstable-large"
 							/>
 						</FlexItem>
 						<FlexItem isBlock>
@@ -191,7 +189,6 @@ function TagCloudEdit( { attributes, setAttributes, name } ) {
 								units={ units }
 								min={ MIN_FONT_SIZE }
 								max={ MAX_FONT_SIZE }
-								size="__unstable-large"
 							/>
 						</FlexItem>
 					</Flex>
@@ -203,7 +200,6 @@ function TagCloudEdit( { attributes, setAttributes, name } ) {
 					isShownByDefault
 				>
 					<RangeControl
-						__next40pxDefaultSize
 						label={ __( 'Number of tags' ) }
 						value={ numberOfTags }
 						onChange={ ( value ) =>

package/src/tag-cloud/index.php

@@ -16,7 +16,7 @@
  */
 function render_block_core_tag_cloud( $attributes ) {
 	$smallest_font_size = $attributes['smallestFontSize'];
-	$unit               = ( preg_match( '/^[0-9.]+(?P<unit>[a-z%]+)$/i', $smallest_font_size, $m ) ? $m['unit'] : 'pt' );
+	$unit               = preg_match( '/^[0-9.]+(?P<unit>[a-z%]+)$/i', $smallest_font_size, $m ) ? $m['unit'] : 'pt';
 
 	$args      = array(
 		'echo'       => false,

package/src/template-part/edit/advanced-controls.js

@@ -65,7 +65,6 @@ export function TemplatePartAdvancedControls( {
 						onFocus={ ( event ) => event.target.select() }
 					/>
 					<SelectControl
-						__next40pxDefaultSize
 						label={ __( 'Area' ) }
 						labelPosition="top"
 						options={ areaOptions }

package/src/template-part/edit/import-controls.js

@@ -147,7 +147,6 @@ export function TemplatePartImportControls( { area, setAttributes } ) {
 						options={ options }
 						onChange={ ( value ) => setSelectedSidebar( value ) }
 						disabled={ ! options.length }
-						__next40pxDefaultSize
 					/>
 				</FlexBlock>
 				<FlexItem

package/src/template-part/index.php

@@ -150,22 +150,7 @@ function render_block_core_template_part( $attributes ) {
 	}
 
 	// Run through the actions that are typically taken on the_content.
-	$content                       = shortcode_unautop( $content );
-	$content                       = do_shortcode( $content );
-	$seen_ids[ $template_part_id ] = true;
-	$content                       = do_blocks( $content );
-	unset( $seen_ids[ $template_part_id ] );
-	$content = wptexturize( $content );
-	$content = convert_smilies( $content );
-	$content = wp_filter_content_tags( $content, "template_part_{$area}" );
-
-	/**
-	 * Handle embeds for block template parts.
-	 *
-	 * @global WP_Embed $wp_embed WordPress Embed object.
-	 */
-	global $wp_embed;
-	$content = $wp_embed->autoembed( $content );
+	$content = _wp_apply_block_content_filters( $content, "template_part_{$area}", $seen_ids, $template_part_id );
 
 	if ( empty( $attributes['tagName'] ) || tag_escape( $attributes['tagName'] ) !== $attributes['tagName'] ) {
 		$area_tag = 'div';

package/src/term-name/README.md

@@ -15,7 +15,6 @@ _Defined via the [`attributes`](https://developer.wordpress.org/block-editor/ref
 
 | Attribute | [Type](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-attributes/#type-validation) | [Default](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-attributes/#default-value) | Description |
 |-----------|------|---------|-------------|
-| `textAlign` | `string` | — | — |
 | `level` | `number` | `0` | — |
 | `isLink` | `boolean` | `false` | — |
 | `levelOptions` | `array` | — | — |
@@ -35,6 +34,7 @@ _Defined via the [`supports`](https://developer.wordpress.org/block-editor/refer
 - [`typography`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#typography):
   - [`fontSize`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#typography-fontsize): `true`
   - [`lineHeight`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#typography-lineheight): `true`
+  - [`textAlign`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#typography-textalign): `true`
 - [`interactivity`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#interactivity):
   - `clientNavigation`: `true`
 

package/src/term-name/block.json

@@ -9,9 +9,6 @@
 	"textdomain": "default",
 	"usesContext": [ "termId", "taxonomy" ],
 	"attributes": {
-		"textAlign": {
-			"type": "string"
-		},
 		"level": {
 			"type": "number",
 			"default": 0
@@ -43,6 +40,7 @@
 		"typography": {
 			"fontSize": true,
 			"lineHeight": true,
+			"textAlign": true,
 			"__experimentalFontFamily": true,
 			"__experimentalFontWeight": true,
 			"__experimentalFontStyle": true,

package/src/term-name/deprecated.js

@@ -0,0 +1,74 @@
+/**
+ * Internal dependencies
+ */
+import migrateTextAlign from '../utils/migrate-text-align';
+
+const v1 = {
+	attributes: {
+		textAlign: {
+			type: 'string',
+		},
+		level: {
+			type: 'number',
+			default: 0,
+		},
+		isLink: {
+			type: 'boolean',
+			default: false,
+		},
+		levelOptions: {
+			type: 'array',
+		},
+	},
+	supports: {
+		anchor: true,
+		align: [ 'wide', 'full' ],
+		html: false,
+		color: {
+			gradients: true,
+			link: true,
+			__experimentalDefaultControls: {
+				background: true,
+				text: true,
+				link: true,
+			},
+		},
+		spacing: {
+			padding: true,
+		},
+		typography: {
+			fontSize: true,
+			lineHeight: true,
+			__experimentalFontFamily: true,
+			__experimentalFontWeight: true,
+			__experimentalFontStyle: true,
+			__experimentalTextTransform: true,
+			__experimentalTextDecoration: true,
+			__experimentalLetterSpacing: true,
+			__experimentalDefaultControls: {
+				fontSize: true,
+			},
+		},
+		interactivity: {
+			clientNavigation: true,
+		},
+		__experimentalBorder: {
+			radius: true,
+			color: true,
+			width: true,
+			style: true,
+			__experimentalDefaultControls: {
+				color: true,
+				width: true,
+				style: true,
+			},
+		},
+	},
+	migrate: migrateTextAlign,
+	isEligible( attributes ) {
+		return !! attributes.textAlign;
+	},
+	save: () => null,
+};
+
+export default [ v1 ];

package/src/term-name/edit.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import clsx from 'clsx';
-
 /**
  * WordPress dependencies
  */
@@ -10,7 +5,6 @@ import { __ } from '@wordpress/i18n';
 import {
 	useBlockProps,
 	BlockControls,
-	AlignmentControl,
 	InspectorControls,
 	HeadingLevelDropdown,
 } from '@wordpress/block-editor';
@@ -32,18 +26,14 @@ export default function TermNameEdit( {
 	setAttributes,
 	context: { termId, taxonomy },
 } ) {
-	const { textAlign, level = 0, isLink, levelOptions } = attributes;
+	const { level = 0, isLink, levelOptions } = attributes;
 	const { term } = useTermName( termId, taxonomy );
 
 	const termName = term?.name
 		? decodeEntities( term.name )
 		: __( 'Term Name' );
 
-	const blockProps = useBlockProps( {
-		className: clsx( {
-			[ `has-text-align-${ textAlign }` ]: textAlign,
-		} ),
-	} );
+	const blockProps = useBlockProps();
 
 	const dropdownMenuProps = useToolsPanelDropdownMenuProps();
 
@@ -71,12 +61,6 @@ export default function TermNameEdit( {
 						setAttributes( { level: newLevel } );
 					} }
 				/>
-				<AlignmentControl
-					value={ textAlign }
-					onChange={ ( nextAlign ) => {
-						setAttributes( { textAlign: nextAlign } );
-					} }
-				/>
 			</BlockControls>
 			<InspectorControls>
 				<ToolsPanel