Merge pull request #9 from sarahcssiqueira/develop

Block Z - structure & .vscode settings

.vscode/settings.json

@@ -0,0 +1,4 @@
+{
+    "phpCodeSniffer.standard":	"Automatic",
+    "phpCodeSniffer.exec.osx":"./vendor/bin/phpcs"
+}

blocks/block-z/block.json

@@ -0,0 +1,21 @@
+{
+  "$schema": "https://schemas.wp.org/trunk/block.json",
+  "apiVersion": 2,
+  "title": "Block Z",
+  "name": "wxyz-blocks/block-z",
+  "description": "Block Z",
+  "version": "1.0.0-beta",
+  "category": "wxyz-blocks",
+  "icon": "slides",
+  "supports": {
+    "html": true
+  },
+  "attributes": {
+    "exampleAttribute": {
+      "type": "string"
+    }
+  },
+  "keywords": ["basic", "model"],
+  "editorScript": "file:./build/index.js",
+  "editorStyle": "file:./src/style.css"
+}

blocks/block-z/build/index.asset.php

@@ -0,0 +1 @@
+<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => 'f3fa4bc34a3507c47b38');

blocks/block-z/src/edit.js

@@ -0,0 +1,26 @@
+import React from "react";
+import { __ } from "@wordpress/i18n";
+import { useBlockProps } from "@wordpress/block-editor";
+
+function Edit(props) {
+  function setExampleAttribute(e) {
+    props.setAttributes({ exampleAttribute: e.target.value });
+  }
+
+  return (
+    <div {...useBlockProps()}>
+      <div>
+        <h4>Block Z</h4>
+        <p>Insert the attribute value below</p>
+        <input
+          type="text"
+          value={props.attributes.exampleAttribute}
+          onChange={setExampleAttribute}
+          placeholder="Attribute value that will be displayed in the frontend"
+        />
+      </div>
+    </div>
+  );
+}
+
+export default Edit;

blocks/block-z/src/index.js

@@ -0,0 +1,10 @@
+import { registerBlockType } from "@wordpress/blocks";
+
+import Edit from "./edit";
+import Save from "./save";
+import metadata from "../block.json";
+
+registerBlockType(metadata, {
+  edit: Edit,
+  save: Save,
+});

blocks/block-z/src/save.js

@@ -0,0 +1,12 @@
+import { __ } from "@wordpress/i18n";
+import { useBlockProps } from "@wordpress/block-editor";
+
+function Save(props) {
+  return (
+    <p {...useBlockProps.save()}>
+      {__(<div>{props.attributes.exampleAttribute}</div>)}
+    </p>
+  );
+}
+
+export default Save;

inc/class-block-z.php

@@ -0,0 +1,47 @@
+<?php
+/**
+ * Block Z
+ *
+ * @package wxyzblocks
+ */
+
+namespace WXYZBlocks\Inc;
+
+/**
+ * Block Y
+ */
+class BlockZ {
+
+
+	/**
+	 * Constructor for handle WordPress Hooks
+	 */
+	public function __construct() {
+		add_action( 'init', [ $this, 'block_z_register' ] );
+		add_action( 'enqueue_block_editor_assets', [ $this, 'block_z_enqueues' ] );
+	}
+
+	/**
+	 * Register Block
+	 */
+	public function block_z_register() {
+		register_block_type( __DIR__ );
+	}
+
+	/**
+	 * Enqueues
+	 */
+	public function block_z_enqueues() {
+		wp_enqueue_script(
+			'block-z',
+			plugin_dir_url( __FILE__ ) . '../blocks/block-z/build/index.js',
+			[ 'wp-blocks', 'wp-i18n', 'wp-editor' ]
+		);
+
+		wp_enqueue_style(
+			'block-z',
+			plugin_dir_url( __FILE__ ) . '..style/style.css',
+			[],
+		);
+	}
+}

package.json

@@ -8,12 +8,14 @@
   "scripts": {
     "start": "wp-scripts start",
     "build": "wp-scripts build",
+    "start:block-w": "wp-scripts start ./blocks/block-w/src/index.js --output-path=./blocks/block-w/build",
+    "build:block-w": "wp-scripts build ./blocks/block-w/src/index.js --output-path=./blocks/block-w/build",
     "start:block-x": "wp-scripts start ./blocks/block-x/src/index.js --output-path=./blocks/block-x/build",
     "build:block-x": "wp-scripts build ./blocks/block-x/src/index.js --output-path=./blocks/block-x/build",
     "start:block-y": "wp-scripts start ./blocks/block-y/src/index.js --output-path=./blocks/block-y/build",
     "build:block-y": "wp-scripts build ./blocks/block-y/src/index.js --output-path=./blocks/block-y/build",
-    "start:block-w": "wp-scripts start ./blocks/block-w/src/index.js --output-path=./blocks/block-w/build",
-    "build:block-w": "wp-scripts build ./blocks/block-w/src/index.js --output-path=./blocks/block-w/build"
+    "start:block-z": "wp-scripts start ./blocks/block-z/src/index.js --output-path=./blocks/block-z/build",
+    "build:block-z": "wp-scripts build ./blocks/block-z/src/index.js --output-path=./blocks/block-z/build"
   },
   "repository": {
     "type": "git",

wxyz-blocks.php

@@ -39,3 +39,10 @@
 require_once __DIR__ . '/inc/class-block-w.php';
 use WXYZBlocks\Inc\BlockW;
 new BlockW();
+
+/**
+ * Block Z
+ */
+require_once __DIR__ . '/inc/class-block-z.php';
+use WXYZBlocks\Inc\BlockZ;
+new BlockZ();