Link option for group block

blocks.php

<?php
add_action( 'render_block', [ $this, 'render_link_toolbar' ], 5, 2 );

/**
 * Block link.
 *
 * @param mixed $block_content The block content.
 * @param array $block The block data.
 *
 * @return mixed Returns the new block content.
 */
public function render_link_toolbar( $block_content, $block ) {
  if ( isset( $block['blockName'] ) && ( in_array( $block['blockName'], [ 'core/group', 'core/column', 'core/cover' ] ) ) ) {
    $attributes = $block['attrs'];

    $block_name = explode( '/', $block['blockName'] );

    if ( isset( $attributes['linkUrl'] ) && ! empty( $attributes['linkUrl'] ) ) {
      $linked = '<a href="' . esc_attr( $attributes['linkUrl'] ) . '" class="wp-block-' . esc_attr( $block_name[1] ) . '__link"';

      if ( isset( $attributes['linkOpensInNewTab'] ) && $attributes['linkOpensInNewTab'] ) {
        $linked .= ' target="_blank"';
      }

      $linked .= '></a>';

      $reg   = '~(.*)</div>~su';
      $subst = '${1}' . $linked . '</div>';

      $block_content = preg_replace( $reg, $subst, $block_content );
    }
  }

  return $block_content;
}

core-group.scss

.wp-block-group {
	position: relative;

	// Pseudo link element.
	&__link {
		inset: 0;
		max-width: unset !important;
		position: absolute;
		z-index: 5;
	}
}

link.js

import { createHigherOrderComponent } from '@wordpress/compose';
import { BlockControls } from '@wordpress/block-editor';
import { addFilter } from '@wordpress/hooks';
import { assign, merge } from 'lodash';
import { Fragment } from '@wordpress/element';

import { LinkToolbar } from '@humanmade/block-editor-components';

const supportedBlocks = ['core/cover', 'core/group', 'core/column'];

/*
    This modifies the block settings for the core/columns block
    We enable support for className and define two additional state
    attributes that will be used in the InspectorControls
*/
function addAttributes(settings, name) {
	if (!supportedBlocks.includes(name)) {
		return settings;
	}
	return assign({}, settings, {
		attributes: merge(settings.attributes, {
			linkUrl: { type: 'string', default: '' },
			linkOpensInNewTab: { type: 'boolean', default: false },
		}),
	});
}

/*
    This adds a slider to the Inspector Controls for the core/columns block
    and tracks the state / updates the block when changed
*/
const addBlockControls = createHigherOrderComponent((BlockEdit) => {
	return (props) => {
		const {
			attributes: { linkUrl, linkOpensInNewTab },
			setAttributes,
			name,
		} = props;

		if (!supportedBlocks.includes(name)) {
			return <BlockEdit {...props} />;
		}

		return (
			<Fragment>
				<BlockEdit {...props} />
				<BlockControls>
					<LinkToolbar
						opensInNewTab={linkOpensInNewTab}
						url={linkUrl}
						onChange={({ opensInNewTab, url }) => {
							setAttributes({
								linkOpensInNewTab: opensInNewTab,
								linkUrl: url,
							});
						}}
					/>
				</BlockControls>
			</Fragment>
		);
	};
}, 'withBlockControls');

addFilter(
	'blocks.registerBlockType',
	'pulsar/link-extension/add-attributes',
	addAttributes
);

addFilter(
	'editor.BlockEdit',
	'pulsar/link-extension/add-toolbar-controls',
	addBlockControls
);