diff --git a/lib/blocks.php b/lib/blocks.php
index b92a656513714b..68950a66b94fa7 100644
--- a/lib/blocks.php
+++ b/lib/blocks.php
@@ -33,6 +33,7 @@ function gutenberg_reregister_core_block_types() {
'missing',
'more',
'navigation-link',
+ 'navigation-link-list',
'nextpage',
'paragraph',
'preformatted',
@@ -61,6 +62,7 @@ function gutenberg_reregister_core_block_types() {
'navigation.php' => 'core/navigation',
'navigation-link.php' => 'core/navigation-link',
'home-link.php' => 'core/home-link',
+ 'navigation-link-list.php' => 'core/navigation-link-list',
'rss.php' => 'core/rss',
'search.php' => 'core/search',
'shortcode.php' => 'core/shortcode',
diff --git a/packages/block-library/src/index.js b/packages/block-library/src/index.js
index a4ec8243c4e74c..5961016bdcf515 100644
--- a/packages/block-library/src/index.js
+++ b/packages/block-library/src/index.js
@@ -35,6 +35,7 @@ import * as html from './html';
import * as mediaText from './media-text';
import * as navigation from './navigation';
import * as navigationLink from './navigation-link';
+import * as navigationLinkList from './navigation-link-list';
import * as homeLink from './home-link';
import * as latestComments from './latest-comments';
import * as latestPosts from './latest-posts';
@@ -234,6 +235,7 @@ export const __experimentalRegisterExperimentalCoreBlocks =
[
navigation,
navigationLink,
+ navigationLinkList,
homeLink,
// Register Legacy Widget block.
diff --git a/packages/block-library/src/navigation-link-list/block.json b/packages/block-library/src/navigation-link-list/block.json
new file mode 100644
index 00000000000000..b2003841b9880e
--- /dev/null
+++ b/packages/block-library/src/navigation-link-list/block.json
@@ -0,0 +1,12 @@
+{
+ "apiVersion": 2,
+ "name": "core/navigation-link-list",
+ "category": "design",
+ "parent": [ "core/navigation" ],
+ "supports": {
+ "reusable": false,
+ "html": false
+ },
+ "editorStyle": "wp-block-navigation-link-list-editor",
+ "style": "wp-block-navigation-link-list"
+}
diff --git a/packages/block-library/src/navigation-link-list/edit.js b/packages/block-library/src/navigation-link-list/edit.js
new file mode 100644
index 00000000000000..4f476fbb65ad56
--- /dev/null
+++ b/packages/block-library/src/navigation-link-list/edit.js
@@ -0,0 +1,68 @@
+/**
+ * WordPress dependencies
+ */
+import {
+ InnerBlocks,
+ BlockControls,
+ InspectorControls,
+ useBlockProps,
+ __experimentalUseInnerBlocksProps as useInnerBlocksProps,
+ store as blockEditorStore,
+} from '@wordpress/block-editor';
+import { useSelect } from '@wordpress/data';
+
+const ALLOWED_BLOCKS = [ 'core/navigation-link', 'core/spacer' ];
+
+export default function NavigationLinksEdit( { clientId, isSelected } ) {
+ const {
+ isImmediateParentOfSelectedBlock,
+ selectedBlockHasDescendants,
+ } = useSelect(
+ ( select ) => {
+ const {
+ getClientIdsOfDescendants,
+ hasSelectedInnerBlock,
+ getSelectedBlockClientId,
+ } = select( blockEditorStore );
+ const selectedBlockId = getSelectedBlockClientId();
+ return {
+ isImmediateParentOfSelectedBlock: hasSelectedInnerBlock(
+ clientId,
+ false
+ ),
+ selectedBlockHasDescendants: !! getClientIdsOfDescendants( [
+ selectedBlockId,
+ ] )?.length,
+ };
+ },
+ [ clientId ]
+ );
+
+ const blockProps = useBlockProps( {
+ className: 'wp-block-navigation__container',
+ } );
+
+ const innerBlocksProps = useInnerBlocksProps( blockProps, {
+ allowedBlocks: ALLOWED_BLOCKS,
+ renderAppender:
+ ( isImmediateParentOfSelectedBlock &&
+ ! selectedBlockHasDescendants ) ||
+ isSelected
+ ? InnerBlocks.DefaultAppender
+ : false,
+ __experimentalAppenderTagName: 'li',
+ __experimentalCaptureToolbars: true,
+ __experimentalLayout: {
+ type: 'default',
+ alignments: [],
+ },
+ } );
+
+ return (
+ <>
+
+
+
+ >
+ );
+}
diff --git a/packages/block-library/src/navigation-link-list/index.js b/packages/block-library/src/navigation-link-list/index.js
new file mode 100644
index 00000000000000..0e8d1cba6e1fde
--- /dev/null
+++ b/packages/block-library/src/navigation-link-list/index.js
@@ -0,0 +1,30 @@
+/**
+ * WordPress dependencies
+ */
+import { __, _x } from '@wordpress/i18n';
+import { customLink as linkIcon } from '@wordpress/icons';
+
+/**
+ * Internal dependencies
+ */
+import metadata from './block.json';
+import edit from './edit';
+import save from './save';
+
+const { name } = metadata;
+
+export { metadata, name };
+
+export const settings = {
+ title: _x( 'List of links', 'block title' ),
+
+ icon: linkIcon,
+
+ description: __( 'Add a list of links to your navigation.' ),
+
+ keywords: [ __( 'links' ) ],
+
+ edit,
+
+ save,
+};
diff --git a/packages/block-library/src/navigation-link-list/index.php b/packages/block-library/src/navigation-link-list/index.php
new file mode 100644
index 00000000000000..d42167b4bfb2b0
--- /dev/null
+++ b/packages/block-library/src/navigation-link-list/index.php
@@ -0,0 +1,38 @@
+inner_blocks ) ) {
+ return '';
+ }
+
+ $inner_blocks_html = '';
+ foreach ( $block->inner_blocks as $inner_block ) {
+ $inner_blocks_html .= $inner_block->render();
+ }
+
+ return sprintf('', $inner_blocks_html);
+}
+
+/**
+ * Register the navigation link list block.
+ *
+ * @uses render_block_core_navigation_link_list()
+ * @throws WP_Error An WP_Error exception parsing the block definition.
+ */
+function register_block_core_navigation_link_list() {
+ register_block_type_from_metadata(
+ __DIR__ . '/navigation-link-list',
+ array(
+ 'render_callback' => 'render_block_core_navigation_link_list',
+ )
+ );
+}
+
+add_action( 'init', 'register_block_core_navigation_link_list' );
\ No newline at end of file
diff --git a/packages/block-library/src/navigation-link-list/save.js b/packages/block-library/src/navigation-link-list/save.js
new file mode 100644
index 00000000000000..17571d8f30d2de
--- /dev/null
+++ b/packages/block-library/src/navigation-link-list/save.js
@@ -0,0 +1,8 @@
+/**
+ * WordPress dependencies
+ */
+import { InnerBlocks } from '@wordpress/block-editor';
+
+export default function save() {
+ return ;
+}
diff --git a/packages/block-library/src/navigation-link/block.json b/packages/block-library/src/navigation-link/block.json
index efcc6810705506..e7d587d55ad7b4 100644
--- a/packages/block-library/src/navigation-link/block.json
+++ b/packages/block-library/src/navigation-link/block.json
@@ -3,9 +3,7 @@
"name": "core/navigation-link",
"title": "Custom Link",
"category": "design",
- "parent": [
- "core/navigation"
- ],
+ "parent": [ "core/navigation-link-list" ],
"description": "Add a page, link, or another item to your navigation.",
"textdomain": "default",
"attributes": {
diff --git a/packages/block-library/src/navigation/edit.js b/packages/block-library/src/navigation/edit.js
index 99adf28132389b..68225d4a04954c 100644
--- a/packages/block-library/src/navigation/edit.js
+++ b/packages/block-library/src/navigation/edit.js
@@ -31,7 +31,7 @@ import PlaceholderPreview from './placeholder-preview';
import ResponsiveWrapper from './responsive-wrapper';
const ALLOWED_BLOCKS = [
- 'core/navigation-link',
+ 'core/navigation-link-list',
'core/search',
'core/social-links',
'core/page-list',
@@ -78,29 +78,24 @@ function Navigation( {
clientId
);
- const innerBlocksProps = useInnerBlocksProps(
- {
- className: 'wp-block-navigation__container',
- },
- {
- allowedBlocks: ALLOWED_BLOCKS,
- orientation: attributes.orientation || 'horizontal',
- renderAppender:
- ( isImmediateParentOfSelectedBlock &&
- ! selectedBlockHasDescendants ) ||
- isSelected
- ? InnerBlocks.DefaultAppender
- : false,
- __experimentalAppenderTagName: 'li',
- __experimentalCaptureToolbars: true,
- // Template lock set to false here so that the Nav
- // Block on the experimental menus screen does not
- // inherit templateLock={ 'all' }.
- templateLock: false,
- __experimentalLayout: LAYOUT,
- placeholder: ,
- }
- );
+ const innerBlocksProps = useInnerBlocksProps( blockProps, {
+ allowedBlocks: ALLOWED_BLOCKS,
+ orientation: attributes.orientation || 'horizontal',
+ renderAppender:
+ ( isImmediateParentOfSelectedBlock &&
+ ! selectedBlockHasDescendants ) ||
+ isSelected
+ ? InnerBlocks.DefaultAppender
+ : false,
+ __experimentalAppenderTagName: 'li',
+ __experimentalCaptureToolbars: true,
+ // Template lock set to false here so that the Nav
+ // Block on the experimental menus screen does not
+ // inherit templateLock={ 'all' }.
+ templateLock: false,
+ __experimentalLayout: LAYOUT,
+ placeholder: ,
+ } );
if ( isPlaceholderShown ) {
return (
@@ -166,7 +161,7 @@ function Navigation( {
) }
-