Merge pull request #9 from timarney/master

issue # 7 - Repeat Field inside editor

.gitignore

@@ -1,2 +1,3 @@
 dist
-node_modules
+node_modules
+.DS_Store

controls/src/repeat/index.js

@@ -5,6 +5,7 @@ const { Button } = wp.components;
 export default class Repeat extends React.Component {
   constructor({ attribute, attributes }) {
     super();
+    this.add = this.add.bind(this);
     this.update = this.update.bind(this);
     this.delete = this.delete.bind(this);
 
@@ -21,6 +22,13 @@ export default class Repeat extends React.Component {
     return null;
   }
 
+  add() {
+    let { attribute, attributes, setAttributes } = this.props;
+    let items =
+        attributes && attributes[attribute] ? attributes[attribute] : [];
+    setAttributes({ [attribute]: [...items, {}] })
+  }
+
   update(name, value, tabId, onChange) {
     let { attribute, attributes } = this.props;
 
@@ -104,9 +112,15 @@ export default class Repeat extends React.Component {
             {max > items || !max ? (
               <Button
                 isPrimary
-                onClick={() => this.setState({ items: items + 1 })}
+                onClick={() => {
+                    this.setState(function (prevState, props) {
+                        return { items: prevState.items + 1 }
+                    }, () => {
+                        this.props.setAttributes && this.add();
+                    })
+                }}
               >
-                {addNew}
+              {addNew}
               </Button>
             ) : null}
           </div>

plugin/src/notes-block/block.js

@@ -0,0 +1,14 @@
+import Save from './save';
+
+const Block = {
+    title: 'Notes',
+    icon: 'edit',
+    category: 'common',
+    attributes: {
+        notes: {
+            type: 'array',
+            default: [{ title: "My First Item" }],
+        },
+    },
+    save: Save
+};

plugin/src/notes-block/edit.js

@@ -0,0 +1,19 @@
+
+import { Input, Repeat } from 'gutenblock-controls';
+
+const Edit = ({ attributes, setAttributes }) => {
+  return (
+    <div>
+      <Repeat
+        attributes={attributes}
+        onChange={(name, value) => setAttributes({ [name]: value })}
+        setAttributes={setAttributes}
+        title="Notes"
+        max="50"
+        addNew="Add Item" attribute="notes"
+      >
+        <Input name="title" />
+      </Repeat>
+    </div>
+  )
+};

plugin/src/notes-block/save.js

@@ -0,0 +1,10 @@
+export default ({ attributes }) => <div>
+    <h1>Notes:</h1>
+    <ul>
+        {attributes.notes.map(note => {
+            return (
+                <li> {note.title}</li>
+            )
+        })}
+    </ul>
+</div>;