move setting to post-template

WordPress · Jun 12, 2023 · 26724dd · 26724dd
1 parent 3381999
commit 26724dd
Show file tree

Hide file tree

Showing 5 changed files with 40 additions and 33 deletions.
diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md
@@ -62,7 +62,7 @@ Prompt visitors to take action with a group of button-style links. ([Source](htt
 -	**Name:** core/buttons
 -	**Category:** design
 -	**Supports:** align (full, wide), anchor, spacing (blockGap, margin), typography (fontSize, lineHeight), ~~html~~
--	**Attributes:**
+-	**Attributes:** 
 
 ## Calendar
 
@@ -173,7 +173,7 @@ Contains the block elements used to display a comment, like the title, date, aut
 -	**Category:** design
 -	**Parent:** core/comments
 -	**Supports:** align, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
--	**Attributes:**
+-	**Attributes:** 
 
 ## Comments
 
@@ -212,7 +212,7 @@ Displays a list of page numbers for comments pagination. ([Source](https://githu
 -	**Category:** theme
 -	**Parent:** core/comments-pagination
 -	**Supports:** color (background, gradients, ~~text~~), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
--	**Attributes:**
+-	**Attributes:** 
 
 ## Comments Previous Page
 
@@ -443,7 +443,7 @@ Separate your content into a multi-page experience. ([Source](https://github.com
 -	**Category:** design
 -	**Parent:** core/post-content
 -	**Supports:** ~~className~~, ~~customClassName~~, ~~html~~
--	**Attributes:**
+-	**Attributes:** 
 
 ## Page List
 
@@ -555,7 +555,7 @@ Displays the contents of a post or page. ([Source](https://github.com/WordPress/
 -	**Name:** core/post-content
 -	**Category:** theme
 -	**Supports:** align (full, wide), dimensions (minHeight), typography (fontSize, lineHeight), ~~html~~
--	**Attributes:**
+-	**Attributes:** 
 
 ## Post Date
 
@@ -601,7 +601,7 @@ Contains the block elements used to render a post, like the title, date, feature
 -	**Category:** theme
 -	**Parent:** core/query
 -	**Supports:** align (full, wide), color (background, gradients, link, text), spacing (blockGap), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
--	**Attributes:**
+-	**Attributes:** tagName
 
 ## Post Terms
 
@@ -666,7 +666,7 @@ Contains the block elements used to render content when no query results are fou
 -	**Category:** theme
 -	**Parent:** core/query
 -	**Supports:** align, color (background, gradients, link, text), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
--	**Attributes:**
+-	**Attributes:** 
 
 ## Pagination
 
@@ -696,7 +696,7 @@ Displays a list of page numbers for pagination ([Source](https://github.com/Word
 -	**Category:** theme
 -	**Parent:** core/query-pagination
 -	**Supports:** color (background, gradients, ~~text~~), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
--	**Attributes:**
+-	**Attributes:** 
 
 ## Previous Page
 

diff --git a/packages/block-library/src/post-template/block.json b/packages/block-library/src/post-template/block.json
@@ -12,10 +12,16 @@
 		"query",
 		"queryContext",
 		"displayLayout",
-		"postsTagName",
+		"tagName",
 		"templateSlug",
 		"previewPostType"
 	],
+	"attributes": {
+		"tagName": {
+			"type": "string",
+			"default": "ul"
+		}
+	},
 	"supports": {
 		"reusable": false,
 		"html": false,

diff --git a/packages/block-library/src/post-template/edit.js b/packages/block-library/src/post-template/edit.js
@@ -10,14 +10,17 @@ import { memo, useMemo, useState } from '@wordpress/element';
 import { useSelect } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import {
+	BlockControls,
 	BlockContextProvider,
+	InspectorControls,
 	__experimentalUseBlockPreview as useBlockPreview,
 	useBlockProps,
 	useInnerBlocksProps,
 	store as blockEditorStore,
 } from '@wordpress/block-editor';
-import { Spinner } from '@wordpress/components';
+import { SelectControl, Spinner, ToolbarGroup } from '@wordpress/components';
 import { store as coreStore } from '@wordpress/core-data';
+import { list, grid } from '@wordpress/icons';
 
 const TEMPLATE = [
 	[ 'core/post-title' ],
@@ -71,6 +74,7 @@ function PostTemplateBlockPreview( {
 const MemoizedPostTemplateBlockPreview = memo( PostTemplateBlockPreview );
 
 export default function PostTemplateEdit( {
+	setAttributes,
 	clientId,
 	context: {
 		query: {
@@ -98,7 +102,7 @@ export default function PostTemplateEdit( {
 		templateSlug,
 		previewPostType,
 	},
-	attributes: { layout, postsTagName: PostsTagName = 'ul' },
+	attributes: { layout, tagName: TagName = 'ul' },
 	__unstableLayoutClassNames,
 } ) {
 	const { type: layoutType, columnCount = 3 } = layout || {};
@@ -271,8 +275,22 @@ export default function PostTemplateEdit( {
 			<BlockControls>
 				<ToolbarGroup controls={ displayLayoutControls } />
 			</BlockControls>
+			<InspectorControls group="advanced">
+				<SelectControl
+					__nextHasNoMarginBottom
+					label={ __( 'Posts HTML element' ) }
+					options={ [
+						{ label: __( 'Default (<ul>)' ), value: 'ul' },
+						{ label: '<div>', value: 'div' },
+					] }
+					value={ TagName }
+					onChange={ ( value ) =>
+						setAttributes( { tagName: value } )
+					}
+				/>
+			</InspectorControls>
 
-			<PostsTagName { ...blockProps }>
+			<TagName { ...blockProps }>
 				{ blockContexts &&
 					blockContexts.map( ( blockContext ) => (
 						<BlockContextProvider
@@ -283,9 +301,7 @@ export default function PostTemplateEdit( {
 							( activeBlockContextId ||
 								blockContexts[ 0 ]?.postId ) ? (
 								<PostTemplateInnerBlocks
-									tagName={
-										PostsTagName === 'ul' ? 'li' : 'div'
-									}
+									tagName={ TagName === 'ul' ? 'li' : 'div' }
 								/>
 							) : null }
 							<MemoizedPostTemplateBlockPreview
@@ -299,11 +315,11 @@ export default function PostTemplateEdit( {
 									( activeBlockContextId ||
 										blockContexts[ 0 ]?.postId )
 								}
-								tagName={ PostsTagName === 'ul' ? 'li' : 'div' }
+								tagName={ TagName === 'ul' ? 'li' : 'div' }
 							/>
 						</BlockContextProvider>
 					) ) }
-			</PostsTagName>
+			</TagName>
 		</>
 	);
 }
diff --git a/packages/block-library/src/post-template/index.php b/packages/block-library/src/post-template/index.php
@@ -77,7 +77,7 @@ function render_block_core_post_template( $attributes, $content, $block ) {
 		$classnames .= ' ' . sanitize_title( 'columns-' . $attributes['layout']['columnCount'] );
 	}
 
-	$wrapper_tag_name   = isset( $block->context['postsTagName'] ) ? $block->context['postsTagName'] : 'ul';
+	$wrapper_tag_name   = isset( $attributes['tagName'] ) ? $attributes['tagName'] : 'ul';
 	$item_tag_name      = 'ul' === $wrapper_tag_name ? 'li' : 'div';
 	$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => trim( $classnames ) ) );
 

diff --git a/packages/block-library/src/query/edit/query-content.js b/packages/block-library/src/query/edit/query-content.js
@@ -35,7 +35,6 @@ export default function QueryContent( {
 		query,
 		displayLayout,
 		tagName: TagName = 'div',
-		postsTagName: PostsTagName = 'ul',
 	} = attributes;
 	const { __unstableMarkNextChangeAsNotPersistent } =
 		useDispatch( blockEditorStore );
@@ -84,7 +83,6 @@ export default function QueryContent( {
 		setAttributes( {
 			displayLayout: { ...displayLayout, ...newDisplayLayout },
 		} );
-
 	const htmlElementMessages = {
 		main: __(
 			'The <main> element should be used for the primary content of your document only. '
@@ -128,19 +126,6 @@ export default function QueryContent( {
 					}
 					help={ htmlElementMessages[ TagName ] }
 				/>
-
-				<SelectControl
-					__nextHasNoMarginBottom
-					label={ __( 'Posts HTML element' ) }
-					options={ [
-						{ label: __( 'Default (<ul>)' ), value: 'ul' },
-						{ label: '<div>', value: 'div' },
-					] }
-					value={ PostsTagName }
-					onChange={ ( value ) =>
-						setAttributes( { postsTagName: value } )
-					}
-				/>
 			</InspectorControls>
 			<TagName { ...innerBlocksProps } />
 		</>