adding nested blocks using inner block

assets/build/assets.php

@@ -1 +1 @@
-<?php return array('js/main.js' => array('dependencies' => array('wp-polyfill'), 'version' => '4d1ec442c34233d2338a'), 'js/single.js' => array('dependencies' => array('wp-polyfill'), 'version' => 'cf309fb462d151e0903f'), 'js/editor.js' => array('dependencies' => array('wp-polyfill'), 'version' => '20e59da245b068507d19'), 'js/blocks.js' => array('dependencies' => array('lodash', 'react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-i18n', 'wp-polyfill'), 'version' => 'e700597aa4ab30101b1c'));
+<?php return array('js/main.js' => array('dependencies' => array('wp-polyfill'), 'version' => '4d1ec442c34233d2338a'), 'js/single.js' => array('dependencies' => array('wp-polyfill'), 'version' => 'cf309fb462d151e0903f'), 'js/editor.js' => array('dependencies' => array('wp-polyfill'), 'version' => '20e59da245b068507d19'), 'js/blocks.js' => array('dependencies' => array('lodash', 'react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-i18n', 'wp-polyfill'), 'version' => 'fd74a072c000809e4cac'));

assets/src/js/gutenberg/blocks/dos-and-donts/edit.js

@@ -0,0 +1,37 @@
+/**
+ * WordPress Dependencies.
+ */
+import { InnerBlocks } from '@wordpress/block-editor';
+import { blockColumns } from './templates';
+
+const INNER_BLOCKS_TEMPLATE = [
+	[
+		'core/group',
+		{
+			className: 'nintynine-dos-and-donts__group',
+			backgroundColor: 'pale-cyan-blue',
+		},
+		blockColumns,
+	],
+];
+
+const ALLOWED_BLOCKS = [ 'core/group' ];
+
+/**
+ * Edit function.
+ *
+ * @return {Object} Content.
+ */
+const Edit = () => {
+	return (
+		<div className="nintynine-dos-and-donts">
+			<InnerBlocks
+				template={ INNER_BLOCKS_TEMPLATE }
+				allowedBlocks={ ALLOWED_BLOCKS }
+				templateLock={ true }
+			/>
+		</div>
+	);
+};
+
+export default Edit;

assets/src/js/gutenberg/blocks/dos-and-donts/index.js

@@ -0,0 +1,65 @@
+/**
+ * Do's and don'ts block.
+ *
+ * @package
+ */
+
+/**
+ * Internal dependencies.
+ */
+import Edit from './edit';
+
+/**
+ * WordPress Dependencies.
+ */
+import { __ } from '@wordpress/i18n';
+import { registerBlockType } from '@wordpress/blocks';
+import { InnerBlocks } from '@wordpress/block-editor';
+
+/**
+ * Register block type.
+ */
+registerBlockType( 'nintynine-blocks/dos-and-donts', {
+	/**
+	 * Block title.
+	 *
+	 * @type {string}
+	 */
+	title: __( "Dos and dont's", 'nintynine' ),
+
+	/**
+	 * Block icon.
+	 *
+	 * @type {string}
+	 */
+	icon: 'editor-table',
+
+	/**
+	 * Block description.
+	 *
+	 * @type {string}
+	 */
+	description: __( 'Add headings and text', 'nintynine' ),
+
+	/**
+	 * Block category.
+	 *
+	 * @type {string}
+	 */
+	category: 'nintynine',
+
+	edit: Edit,
+
+	/**
+	 * Save
+	 *
+	 * @return {Object} Save content.
+	 */
+	save() {
+		return (
+			<div className="nintynine-dos-and-donts">
+				<InnerBlocks.Content />
+			</div>
+		);
+	},
+} );

assets/src/js/gutenberg/blocks/dos-and-donts/templates.js

@@ -0,0 +1,42 @@
+/**
+ *  Get Block Column.
+ *
+ * @param {String} optionVal Option
+ * @param {String} colClassName ClassName
+ * @param {String} heading Heading
+ * @return {Array} Block column.
+ */
+const getBlockColumn = ( optionVal, colClassName, heading ) => {
+	return [
+		'core/column',
+		{ className: colClassName },
+		[
+			[
+				'nintynine-blocks/nintynine-heading-icon',
+				{
+					className: 'nintynine-dos-and-donts__heading',
+					option: optionVal,
+					content: `<strong><span>${ heading }</span></strong>`,
+				},
+			],
+			[ 'core/list', { className: 'nintynine-dos-and-donts__list' } ],
+		],
+	];
+};
+
+export const blockColumns = [
+	[
+		'core/columns',
+		{
+			className: 'nintynine-dos-and-donts__cols',
+		},
+		[
+			getBlockColumn( 'dos', 'nintynine-dos-and-donts__col-one', 'Dos' ),
+			getBlockColumn(
+				'donts',
+				'nintynine-dos-and-donts__col-two',
+				"Dont's"
+			),
+		],
+	],
+];

assets/src/sass/blocks.scss

@@ -1,6 +1,6 @@
 @import "0-settings/colors";
 // Blocks.
 @import "7-blocks/heading-with-icon";
-/*@import "7-blocks/dos-and-donts";
-@import "7-blocks/quote";
+@import "7-blocks/dos-and-donts";
+/*@import "7-blocks/quote";
 @import "7-blocks/button";*/

functions.php

@@ -42,8 +42,9 @@
 
 require_once NINTYNINE_DIR_PATH . '/inc/helpers/autoloader.php';
 require_once NINTYNINE_DIR_PATH . '/inc/helpers/template-tags.php';
+
 function nintynine_get_theme_instance() {
-\NINTYNINE_THEME\Inc\NINTYNINE_THEME::get_instance();
+   \NINTYNINE_THEME\Inc\NINTYNINE_THEME::get_instance();
 }
 
 nintynine_get_theme_instance();