Rename Accordions block to Accordion

docs/reference-guides/core-blocks.md

@@ -8,50 +8,50 @@ This page lists the blocks included in the block-library package.
 
 <!-- START TOKEN Autogenerated - DO NOT EDIT -->
 
-## Accordion Header
+## Accordion
 
-Accordion header. ([Source](https://github.com/WordPress/gutenberg/tree/trunk/packages/block-library/src/accordion-header))
+Displays a group of accordion headers and associated expandable content. ([Source](https://github.com/WordPress/gutenberg/tree/trunk/packages/block-library/src/accordion))
 
--	**Name:** core/accordion-header
+-	**Name:** core/accordion
 -	**Experimental:** true
 -	**Category:** design
--	**Parent:** core/accordion-item
--	**Supports:** anchor, border, color (background, gradient, text), interactivity, shadow, spacing (margin, padding), typography (fontSize, textAlign), ~~align~~
--	**Attributes:** iconPosition, level, levelOptions, openByDefault, showIcon, textAlignment, title
+-	**Allowed Blocks:** core/accordion-content
+-	**Supports:** align (full, wide), background (backgroundImage, backgroundSize), color (background, gradient, text), interactivity, layout, shadow, spacing (blockGap, margin, padding), ~~html~~
+-	**Attributes:** allowedBlocks, autoclose, iconPosition, showIcon
 
-## Accordion
+## Accordion Content
 
-A single accordion that displays a header and expandable content. ([Source](https://github.com/WordPress/gutenberg/tree/trunk/packages/block-library/src/accordion-item))
+Displays a section of content in an accordion, including a header and expandable content. ([Source](https://github.com/WordPress/gutenberg/tree/trunk/packages/block-library/src/accordion-content))
 
--	**Name:** core/accordion-item
+-	**Name:** core/accordion-content
 -	**Experimental:** true
 -	**Category:** design
--	**Parent:** core/accordions
+-	**Parent:** core/accordion
 -	**Allowed Blocks:** core/accordion-header, core/accordion-panel
 -	**Supports:** align (full, wide), color (background, gradient, text), interactivity, shadow, spacing (blockGap, margin)
 -	**Attributes:** openByDefault
 
-## Accordion Panel
+## Accordion Header
 
-Accordion Panel ([Source](https://github.com/WordPress/gutenberg/tree/trunk/packages/block-library/src/accordion-panel))
+Displays an accordion header. ([Source](https://github.com/WordPress/gutenberg/tree/trunk/packages/block-library/src/accordion-header))
 
--	**Name:** core/accordion-panel
+-	**Name:** core/accordion-header
 -	**Experimental:** true
 -	**Category:** design
--	**Parent:** core/accordion-item
--	**Supports:** border, color (background, gradient, text), interactivity, shadow, spacing (blockGap, margin, padding), typography (fontSize, lineHeight)
--	**Attributes:** allowedBlocks, isSelected, openByDefault, templateLock
+-	**Parent:** core/accordion-content
+-	**Supports:** anchor, border, color (background, gradient, text), interactivity, shadow, spacing (margin, padding), typography (fontSize, textAlign), ~~align~~
+-	**Attributes:** iconPosition, level, levelOptions, openByDefault, showIcon, textAlignment, title
 
-## Accordions
+## Accordion Panel
 
-A group of Accordion headers and associated expandable content. ([Source](https://github.com/WordPress/gutenberg/tree/trunk/packages/block-library/src/accordions))
+Displays an accordion panel. ([Source](https://github.com/WordPress/gutenberg/tree/trunk/packages/block-library/src/accordion-panel))
 
--	**Name:** core/accordions
+-	**Name:** core/accordion-panel
 -	**Experimental:** true
 -	**Category:** design
--	**Allowed Blocks:** core/accordion-item
--	**Supports:** align (full, wide), background (backgroundImage, backgroundSize), color (background, gradient, text), interactivity, layout, shadow, spacing (blockGap, margin, padding), ~~html~~
--	**Attributes:** allowedBlocks, autoclose, iconPosition, showIcon
+-	**Parent:** core/accordion-content
+-	**Supports:** border, color (background, gradient, text), interactivity, shadow, spacing (blockGap, margin, padding), typography (fontSize, lineHeight)
+-	**Attributes:** allowedBlocks, isSelected, openByDefault, templateLock
 
 ## Archives
 

lib/blocks.php

@@ -46,8 +46,8 @@ function gutenberg_reregister_core_block_types() {
 				'embed',
 			),
 			'block_names'   => array(
-				'accordion-item.php'               => 'core/accordion-item',
-				'accordions.php'                   => 'core/accordions',
+				'accordion-content.php'            => 'core/accordion-content',
+				'accordion.php'                    => 'core/accordion',
 				'archives.php'                     => 'core/archives',
 				'avatar.php'                       => 'core/avatar',
 				'block.php'                        => 'core/block',

packages/block-library/package.json

@@ -27,7 +27,7 @@
 	"react-native": "src/index",
 	"wpScript": true,
 	"wpScriptModuleExports": {
-		"./accordions/view": "./build-module/accordions/view.js",
+		"./accordion/view": "./build-module/accordion/view.js",
 		"./file/view": "./build-module/file/view.js",
 		"./form/view": "./build-module/form/view.js",
 		"./image/view": "./build-module/image/view.js",

packages/block-library/src/accordion-item/block.json → packages/block-library/src/accordion-content/block.json

@@ -1,14 +1,14 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
 	"apiVersion": 3,
-	"name": "core/accordion-item",
+	"name": "core/accordion-content",
 	"version": "0.1.0",
-	"title": "Accordion",
+	"title": "Accordion Content",
 	"category": "design",
-	"description": "A single accordion that displays a header and expandable content.",
+	"description": "Displays a section of content in an accordion, including a header and expandable content.",
 	"example": {},
 	"__experimental": true,
-	"parent": [ "core/accordions" ],
+	"parent": [ "core/accordion" ],
 	"allowedBlocks": [ "core/accordion-header", "core/accordion-panel" ],
 	"supports": {
 		"align": [ "wide", "full" ],

packages/block-library/src/accordion-item/index.php → packages/block-library/src/accordion-content/index.php

@@ -1,7 +1,7 @@
 <?php
 
 /**
- * Server-side rendering of the `core/accordion-item` block.
+ * Server-side rendering of the `core/accordion-content` block.
  *
  * @package WordPress
  * @since 6.6.0
@@ -11,13 +11,13 @@
  *
  * @return string Returns the updated markup.
  */
-function block_core_accordion_item_render( $attributes, $content ) {
+function block_core_accordion_content_render( $attributes, $content ) {
 	if ( ! $content ) {
 		return $content;
 	}
 
 	$p         = new WP_HTML_Tag_Processor( $content );
-	$unique_id = wp_unique_id( 'accordion-item-' );
+	$unique_id = wp_unique_id( 'accordion-content-' );
 
 	// Initialize the state of the item on the server using a closure,
 	// since we need to get derived state based on the current context.
@@ -31,13 +31,13 @@ function block_core_accordion_item_render( $attributes, $content ) {
 		)
 	);
 
-	if ( $p->next_tag( array( 'class_name' => 'wp-block-accordion-item' ) ) ) {
+	if ( $p->next_tag( array( 'class_name' => 'wp-block-accordion-content' ) ) ) {
 		$open_by_default = $attributes['openByDefault'] ? 'true' : 'false';
 		$p->set_attribute( 'data-wp-context', '{ "id": "' . $unique_id . '", "openByDefault": ' . $open_by_default . ' }' );
 		$p->set_attribute( 'data-wp-class--is-open', 'state.isOpen' );
 		$p->set_attribute( 'data-wp-init', 'callbacks.initIsOpen' );
 
-		if ( $p->next_tag( array( 'class_name' => 'accordion-item__toggle' ) ) ) {
+		if ( $p->next_tag( array( 'class_name' => 'accordion-content__toggle' ) ) ) {
 			$p->set_attribute( 'data-wp-on--click', 'actions.toggle' );
 			$p->set_attribute( 'id', $unique_id );
 			$p->set_attribute( 'aria-controls', $unique_id . '-panel' );
@@ -58,16 +58,16 @@ function block_core_accordion_item_render( $attributes, $content ) {
 }
 
 /**
- * Registers the `core/accordion-item` block on server.
+ * Registers the `core/accordion-content` block on server.
  *
  * @since 6.6.0
  */
-function register_block_core_accordion_item() {
+function register_block_core_accordion_content() {
 	register_block_type_from_metadata(
-		__DIR__ . '/accordion-item',
+		__DIR__ . '/accordion-content',
 		array(
-			'render_callback' => 'block_core_accordion_item_render',
+			'render_callback' => 'block_core_accordion_content_render',
 		)
 	);
 }
-add_action( 'init', 'register_block_core_accordion_item' );
+add_action( 'init', 'register_block_core_accordion_content' );

packages/block-library/src/accordion-header/block.json

@@ -5,10 +5,10 @@
 	"version": "0.1.0",
 	"title": "Accordion Header",
 	"category": "design",
-	"description": "Accordion header.",
+	"description": "Displays an accordion header.",
 	"example": {},
 	"__experimental": true,
-	"parent": [ "core/accordion-item" ],
+	"parent": [ "core/accordion-content" ],
 	"usesContext": [
 		"core/accordion-icon-position",
 		"core/accordion-show-icon"

packages/block-library/src/accordion-header/edit.js

@@ -21,7 +21,7 @@ import { ToolbarGroup } from '@wordpress/components';
 /**
  * Internal dependencies
  */
-import { plus } from '../accordion-item/icons';
+import { plus } from '../accordion-content/icons';
 
 const ICONS = {
 	plus,
@@ -73,7 +73,7 @@ export default function Edit( { attributes, setAttributes, context } ) {
 					blockProps.className,
 					colorProps.className,
 					borderProps.className,
-					'accordion-item__heading',
+					'accordion-content__heading',
 					{
 						[ `has-custom-font-size` ]: blockProps.style.fontSize,
 						[ `icon-position-left` ]: iconPosition === 'left',
@@ -87,7 +87,7 @@ export default function Edit( { attributes, setAttributes, context } ) {
 				} }
 			>
 				<button
-					className={ clsx( 'accordion-item__toggle' ) }
+					className={ clsx( 'accordion-content__toggle' ) }
 					style={ {
 						...spacingProps.style,
 					} }
@@ -109,9 +109,12 @@ export default function Edit( { attributes, setAttributes, context } ) {
 					/>
 					{ shouldShowIcon && (
 						<span
-							className={ clsx( `accordion-item__toggle-icon`, {
-								'has-icon-plus': true,
-							} ) }
+							className={ clsx(
+								`accordion-content__toggle-icon`,
+								{
+									'has-icon-plus': true,
+								}
+							) }
 							style={ {
 								// TO-DO: make this configurable
 								width: `1.2em`,

packages/block-library/src/accordion-header/save.js

@@ -16,7 +16,7 @@ import {
 /**
  * Internal dependencies
  */
-import { plus } from '../accordion-item/icons';
+import { plus } from '../accordion-content/icons';
 
 const ICONS = {
 	plus,
@@ -41,7 +41,7 @@ export default function save( { attributes } ) {
 				blockProps.className,
 				colorProps.className,
 				borderProps.className,
-				'accordion-item__heading',
+				'accordion-content__heading',
 				{
 					[ `has-custom-font-size` ]: blockProps?.style?.fontSize,
 					[ `icon-position-left` ]: iconPosition === 'left',
@@ -55,14 +55,14 @@ export default function save( { attributes } ) {
 			} }
 		>
 			<button
-				className={ clsx( 'accordion-item__toggle' ) }
+				className={ clsx( 'accordion-content__toggle' ) }
 				style={ {
 					...spacingProps.style,
 				} }
 			>
 				<RichText.Content tagName="span" value={ title } />
 				<span
-					className={ clsx( `accordion-item__toggle-icon`, {
+					className={ clsx( `accordion-content__toggle-icon`, {
 						'has-icon-plus': showIcon,
 					} ) }
 					style={ {

packages/block-library/src/accordion-panel/block.json

@@ -5,10 +5,10 @@
 	"version": "0.1.0",
 	"title": "Accordion Panel",
 	"category": "design",
-	"description": "Accordion Panel",
+	"description": "Displays an accordion panel.",
 	"example": {},
 	"__experimental": true,
-	"parent": [ "core/accordion-item" ],
+	"parent": [ "core/accordion-content" ],
 	"supports": {
 		"color": {
 			"background": true,

packages/block-library/src/accordions/block.json → packages/block-library/src/accordion/block.json

@@ -1,10 +1,10 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
 	"apiVersion": 3,
-	"name": "core/accordions",
-	"title": "Accordions",
+	"name": "core/accordion",
+	"title": "Accordion",
 	"category": "design",
-	"description": "A group of Accordion headers and associated expandable content.",
+	"description": "Displays a group of accordion headers and associated expandable content.",
 	"example": {},
 	"__experimental": true,
 	"supports": {
@@ -63,7 +63,7 @@
 		"core/accordion-icon-position": "iconPosition",
 		"core/accordion-show-icon": "showIcon"
 	},
-	"allowedBlocks": [ "core/accordion-item" ],
+	"allowedBlocks": [ "core/accordion-content" ],
 	"textdomain": "default",
-	"style": "wp-block-accordions"
+	"style": "wp-block-accordion"
 }

packages/block-library/src/accordions/edit.js → packages/block-library/src/accordion/edit.js

@@ -20,7 +20,7 @@ import {
  */
 import { useToolsPanelDropdownMenuProps } from '../utils/hooks';
 
-const ACCORDION_BLOCK_NAME = 'core/accordion-item';
+const ACCORDION_BLOCK_NAME = 'core/accordion-content';
 const ACCORDION_BLOCK = {
 	name: ACCORDION_BLOCK_NAME,
 };

packages/block-library/src/accordions/index.php → packages/block-library/src/accordion/index.php

@@ -1,6 +1,6 @@
 <?php
 /**
- * Server-side rendering of the `core/accordions` block.
+ * Server-side rendering of the `core/accordion` block.
  *
  * @package WordPress
  * @since 6.6.0
@@ -10,31 +10,31 @@
  *
  * @return string Returns the updated markup.
  */
-function render_block_core_accordions( $attributes, $content ) {
+function render_block_core_accordion( $attributes, $content ) {
 	if ( ! $content ) {
 		return $content;
 	}
 
 	$suffix = wp_scripts_get_suffix();
 	if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) {
-		$module_url = gutenberg_url( '/build-module/block-library/accordions/view.min.js' );
+		$module_url = gutenberg_url( '/build-module/block-library/accordion/view.min.js' );
 	}
 
 	wp_register_script_module(
-		'@wordpress/block-library/accordions',
-		isset( $module_url ) ? $module_url : includes_url( "blocks/accordions/view{$suffix}.js" ),
+		'@wordpress/block-library/accordion',
+		isset( $module_url ) ? $module_url : includes_url( "blocks/accordion/view{$suffix}.js" ),
 		array( '@wordpress/interactivity' ),
 		defined( 'GUTENBERG_VERSION' ) ? GUTENBERG_VERSION : get_bloginfo( 'version' )
 	);
 
-	wp_enqueue_script_module( '@wordpress/block-library/accordions' );
+	wp_enqueue_script_module( '@wordpress/block-library/accordion' );
 
 	$p             = new WP_HTML_Tag_Processor( $content );
 	$autoclose     = $attributes['autoclose'] ? 'true' : 'false';
 	$icon          = $attributes['icon'] ?? 'plus';
 	$icon_position = $attributes['iconPosition'] ?? 'right';
 
-	if ( $p->next_tag( array( 'class_name' => 'wp-block-accordions' ) ) ) {
+	if ( $p->next_tag( array( 'class_name' => 'wp-block-accordion' ) ) ) {
 		$p->set_attribute( 'data-wp-interactive', 'core/accordion' );
 		$p->set_attribute( 'data-wp-context', '{ "autoclose": ' . $autoclose . ', "isOpen": [], "icon": "' . $icon . '", "iconPosition": "' . $icon_position . '" }' );
 
@@ -46,16 +46,16 @@ function render_block_core_accordions( $attributes, $content ) {
 }
 
 /**
- * Registers the `core/accordions` block on server.
+ * Registers the `core/accordion` block on server.
  *
  * @since 6.6.0
  */
-function register_block_core_accordions() {
+function register_block_core_accordion() {
 	register_block_type_from_metadata(
-		__DIR__ . '/accordions',
+		__DIR__ . '/accordion',
 		array(
-			'render_callback' => 'render_block_core_accordions',
+			'render_callback' => 'render_block_core_accordion',
 		)
 	);
 }
-add_action( 'init', 'register_block_core_accordions' );
+add_action( 'init', 'register_block_core_accordion' );