Add support for toggle block in core/navigation

build/toggle-block/index.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-i18n'), 'version' => '258f20c46a12ec82d3d1');
+<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-hooks', 'wp-i18n'), 'version' => '1b8472592ef953dd9320');

src/toggle-block/extend-navigation-block.js

@@ -0,0 +1,27 @@
+import { addFilter } from '@wordpress/hooks';
+
+/**
+ * Add the toggle block to the list of allowed blocks in the navigation block.
+ *
+ * @param {object} settings Settings for the navigation block.
+ * @param {string} name Name of the block.
+ * @returns {object} Settings for the navigation block.
+ */
+function addToggleBlockToNavigation(settings, name) {
+	if (name !== 'core/navigation') {
+		return settings;
+	}
+
+	const allowedBlocks = settings.allowedBlocks || [];
+
+	return {
+		...settings,
+		allowedBlocks: [...allowedBlocks, 'happyprime/toggle-block'],
+	};
+}
+
+addFilter(
+	'blocks.registerBlockType',
+	'happyprime/add-toggle-to-navigation',
+	addToggleBlockToNavigation
+);

src/toggle-block/index.js

@@ -4,13 +4,16 @@ import {
 	RichText,
 	useBlockProps,
 } from '@wordpress/block-editor';
-import { registerBlockType } from '@wordpress/blocks';
+import { createBlock, registerBlockType } from '@wordpress/blocks';
 import { PanelBody, TextControl } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 
 // Internal dependencies.
 import metadata from './block.json';
 
+// Extend the navigation block to allow the toggle block.
+import './extend-navigation-block';
+
 const Edit = (props) => {
 	const {
 		attributes: { bodyClass, buttonText, controlsId, labelText },
@@ -87,7 +90,41 @@ const Save = (props) => {
 	);
 };
 
+const Transforms = {
+	from: [
+		{
+			type: 'block',
+			blocks: ['core/navigation-link'],
+			transform: (attributes, innerBlocks) => {
+				return createBlock(
+					'happyprime/toggle-block',
+					{
+						buttonText: attributes.label || attributes.title || '',
+					},
+					innerBlocks
+				);
+			},
+		},
+	],
+	to: [
+		{
+			type: 'block',
+			blocks: ['core/navigation-link'],
+			transform: (attributes, innerBlocks) => {
+				return createBlock(
+					'core/navigation-link',
+					{
+						label: attributes.buttonText || '',
+						url: '#',
+					},
+					innerBlocks
+				);
+			},
+		},
+	],
+};
 registerBlockType(metadata, {
 	edit: Edit,
 	save: Save,
+	transforms: Transforms,
 });