Gutenbergカスタムブロックその2

<?php
/*
Plugin Name: Gutenberg Custom Block Sample02
Plugin URI:
Description:
Version: 1.0.0
Author: ETERNITY DESIGN
Author URI: https://eternitydesign.net/
*/

defined( 'ABSPATH' ) || exit;


function gutenberg_sample02_register_block() {

	if(!function_exists( 'register_block_type' ) ) {
		// Gutenbergがアクティブでない場合
		return;
	}

	// block.jsをロードするように
	wp_register_script(
		'gutenberg-custom-block-sample02',
		plugins_url('block.js', __FILE__),
		array('wp-blocks', 'wp-element'),
		filemtime( plugin_dir_path( __FILE__ ) . 'block.js')
	);

	// カスタムブロックの登録
	register_block_type('ed-gutenberg-samples/sample02', array(
		'script' => 'gutenberg-custom-block-sample02',
	));

}
add_action('init', 'gutenberg_sample02_register_block');

?>

(function(blocks, element) {

	var el = element.createElement;

	blocks.registerBlockType('ed-gutenberg-samples/sample02', {
		title: 'サンプル02',

		// https://developer.wordpress.org/resource/dashicons/#tagcloud
		icon: 'universal-access-alt',

		// common, formatting, layout, widgets, embed
		category: 'layout',

		attributes: {
			content: {
				type: 'array',
				source: 'children',
				selector: 'p',
			},
		},

		edit: function(props) {
			var content = props.attributes.content;

			function onChangeContent( newContent ) {
				props.setAttributes({
					content: newContent
				});
			}

			return el(
				wp.editor.RichText,
				{
					tagName: 'p',
					className: props.className,
					onChange: onChangeContent,
					value: content,
				}
			);
		},

		save: function(props) {
			return el(
				wp.editor.RichText.Content,
				{
					tagName: 'p',
					value: props.attributes.content,
				}
			);
		}

	} );
}(
	window.wp.blocks,
	window.wp.element
));