introducing block editor adjustement script

block_editor_adjustments.js

@@ -0,0 +1,80 @@
+// Register our property at core/heading
+wp.hooks.addFilter(
+	"blocks.registerBlockType",
+	"homegrade-blocks/block_editor_adjustments", // our custom namespace
+	function (settings, name) {
+		if (name !== "core/button") {
+			// skip other core blocks
+			return settings;
+		}
+		settings.attributes = Object.assign(settings.attributes, {
+			buttonVariant: {
+				type: "boolean",
+				default: false,
+			},
+		});
+		return settings;
+	}
+);
+// Display the custom ToggleControl for every header; toggle the custom property
+
+wp.hooks.addFilter(
+	"editor.BlockEdit",
+	"homegrade-blocks/block_editor_adjustments",
+	wp.compose.createHigherOrderComponent(function (BlockEdit) {
+		return function (props) {
+			if (props.name !== "core/button") {
+				// skip other core blocks
+				return wp.element.createElement(BlockEdit, props);
+			}
+
+			console.log("here are the props", props);
+
+			return wp.element.createElement(
+				wp.element.Fragment,
+				{},
+				wp.element.createElement(
+					wp.blockEditor.InspectorControls,
+					{},
+					wp.element.createElement(
+						wp.components.PanelBody,
+						{},
+						wp.element.createElement(
+							wp.components.ToggleControl,
+
+							{
+								label: "Show in Table of Contents",
+								checked: props.attributes.buttonVariant,
+								onChange: (value) => {
+									props.setAttributes({
+										buttonVariant: value,
+									});
+								},
+							}
+						)
+					)
+				),
+				wp.element.createElement(BlockEdit, props)
+			);
+		};
+	})
+);
+
+// Convert the custom property value into CSS class name on every save
+
+wp.hooks.addFilter(
+	"blocks.getSaveContent.extraProps",
+	"homegrade-blocks/block_editor_adjustments",
+	function (extraProps, blockType, attributes) {
+		if (blockType.name !== "core/button") {
+			// skip other core blocks
+			return extraProps;
+		}
+		if (attributes.buttonVariant) {
+			console.log(extraProps.className + " extra-props-de-antoine");
+			extraProps.className = extraProps.className + " lol " + " extra-props-de-antoine";
+		}
+
+		return extraProps;
+	}
+);