Merge pull request #293 from 10up/develop

Release

components/repeater/index.js

@@ -42,7 +42,9 @@ export const AttributeRepeater = ({ children, attribute, addButton, allowReorder
 		};
 	});
 
-	defaultRepeaterData[0].id = uuid();
+	if ( defaultRepeaterData.length ) {
+		defaultRepeaterData[0].id = uuid();
+	}
 
 	const handleOnChange = (value) => {
 		updateBlockAttributes(clientId, { [attribute]: value });
@@ -114,7 +116,7 @@ export const AbstractRepeater = ({
 		const defaultValueCopy = JSON.parse(JSON.stringify(defaultValue));
 
 		if (!defaultValue.length) {
-			defaultValueCopy.push([]);
+			defaultValueCopy.push({});
 		}
 
 		defaultValueCopy[0].id = uuid();

components/repeater/readme.md

@@ -11,15 +11,33 @@ A Repeater component that allows you to add repeater fields.
 
 The type definition of the attribute needs to be set as an array and the name of the attribute should be passed to the `attribute` prop of the `Repeater` component.
 
+For example, if a repeater item unit is a group field containing a text field and a checkbox field, the attribute would be defined in `block.json` as:
+
+```json
+"attributes": {
+    "repeaterFieldData": {
+        "type": "array",
+        "default": [
+            {
+                "text": "",
+                "checked": false
+            }
+        ],
+    }
+}
+```
+
+**Note:** You should not provide an `id` to the repeater item unit. The Repeater component will automatically generate an `id` for each item.
+
 ```js
 import { Repeater } from '@10up/block-components';
 
 export function BlockEdit(props) {
     const { attributes } = props;
-    const { items } = attributes;
+    const { repeaterFieldData } = attributes;
 
     return (
-        <Repeater attribute="items">
+        <Repeater attribute="repeaterFieldData">
             {( item, index, setItem, removeItem ) => (
                 <>
                     <TextControl key={index} value={item} onChange={(value) => setItem(value)} />