From cd466b176faabb6d344fcc05115cf5bcea3fe202 Mon Sep 17 00:00:00 2001
From: APPLE <apple@APPLEs-MacBook-Pro-4.local>
Date: Wed, 7 Mar 2018 12:38:27 +1000
Subject: [PATCH] Added inspector component for feature list - working to add
 alignment toolbar

---
 src/blocks/features-list/index.js     | 35 ++++++-------------
 src/blocks/features-list/inspector.js | 50 +++++++++++++++++++++++++++
 src/blocks/section/index.js           |  1 -
 3 files changed, 60 insertions(+), 26 deletions(-)
 create mode 100644 src/blocks/features-list/inspector.js

diff --git a/src/blocks/features-list/index.js b/src/blocks/features-list/index.js
index 8415d3c..937e230 100644
--- a/src/blocks/features-list/index.js
+++ b/src/blocks/features-list/index.js
@@ -4,6 +4,7 @@
  * A simple block to show a feature
  */
 import icons from "../icons";
+import Inspector from './inspector';
 /**
  * Internal block libraries
  */
@@ -15,16 +16,12 @@ const {
 	MediaUpload,
 	BlockControls,
 	InnerBlocks,
-	InspectorControls
 } = wp.blocks; // Import registerBlockType() from wp.blocks as well as Editable so we can use TinyMCE
 const {
 	Button,
 	Toolbar,
 	Tooltip,
-	Dashicon,
-	PanelBody,
-	PanelRow,
-	TextControl
+	Dashicon
 } = wp.components;
 /**
  * Register: aa Gutenberg Block.
@@ -133,24 +130,12 @@ registerBlockType("cgb/block-feature", {
 
 		return [
 			!!props.focus && (
-				<InspectorControls key="inspector">
-					<PanelBody title={__("Link Options")}>
-						<PanelRow>
-							<TextControl
-								label={__("Link URL")}
-								value={props.attributes.link}
-								onChange={onChangeLink}
-							/>
-						</PanelRow>
-						<PanelRow>
-							<TextControl
-								label={__("Link Text")}
-								value={props.attributes.buttonText}
-								onChange={onChangeButtonText}
-							/>
-						</PanelRow>
-					</PanelBody>
-				</InspectorControls>
+				<Inspector
+					{ ...{ 
+						onChangeLink, 
+						onChangeButtonText, 
+					...props } }
+				/>
 			),
 			<div className={props.className}>
 				<div className="feature__img mb1">
@@ -183,7 +168,7 @@ registerBlockType("cgb/block-feature", {
 						</div>
 					)}
 				</div>
-				<div className="feature__content text-center">
+				<div className="feature__content">
 					<Editable
 						tagName="h3"
 						placeholder={__("Feature title")}
@@ -223,7 +208,7 @@ registerBlockType("cgb/block-feature", {
 					alt={props.attributes.imgAlt}
 				/>
 
-				<div className="feature__content center-xs">
+				<div className="feature__content">
 					<h3 className="feature__title">{props.attributes.title}</h3>
 					<div className="feature__description">
 						{props.attributes.description}
diff --git a/src/blocks/features-list/inspector.js b/src/blocks/features-list/inspector.js
new file mode 100644
index 0000000..e8f5470
--- /dev/null
+++ b/src/blocks/features-list/inspector.js
@@ -0,0 +1,50 @@
+/**
+ * Internal block libraries
+ */
+const { __ } = wp.i18n;
+const { Component } = wp.element;
+const {
+  InspectorControls,
+  BlockDescription,
+} = wp.blocks;
+const {
+  Toolbar,
+  Button,
+  PanelBody,
+  PanelRow,
+  TextControl
+} = wp.components;
+
+/**
+ * Create an Inspector Controls wrapper Component
+ */
+export default class Inspector extends Component {
+
+  constructor( props ) {
+    super( ...arguments );
+  }
+
+  render() {
+    return (
+        <InspectorControls key="inspector">
+            <PanelBody title={__("Link Options")}>
+                <PanelRow>
+                    <TextControl
+                        label={__("Link URL")}
+                        value={this.props.attributes.link}
+                        onChange={this.props.onChangeLink}
+                    />
+                </PanelRow>
+                <PanelRow>
+                    <TextControl
+                        label={__("Link Text")}
+                        value={this.props.attributes.buttonText}
+                        onChange={this.onChangeButtonText}
+                    />
+                </PanelRow>
+            </PanelBody>
+        </InspectorControls>
+    );
+  }
+
+}
\ No newline at end of file
diff --git a/src/blocks/section/index.js b/src/blocks/section/index.js
index e225f80..e5c2eaa 100644
--- a/src/blocks/section/index.js
+++ b/src/blocks/section/index.js
@@ -138,7 +138,6 @@ registerBlockType("cgb/block-section", {
 
 	getEditWrapperProps(attributes) {
 		const { alignment } = attributes;
-		console.log(validAlignments);
 
 		if (-1 !== validAlignments.indexOf(alignment)) {
 			return { "data-align": alignment };