From d7ecc8bc46990529cf2f61b7c67f37ec53703f0e Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Fri, 27 Nov 2020 16:41:18 +0000
Subject: [PATCH 1/9] Verse Block: Adds support for custom padding

---
 .../designers-developers/developers/themes/theme-json.md | 1 +
 packages/block-library/src/verse/block.json              | 9 +++++++++
 packages/block-library/src/verse/editor.scss             | 1 -
 3 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/docs/designers-developers/developers/themes/theme-json.md b/docs/designers-developers/developers/themes/theme-json.md
index b66cd3d621439..9225a9ec22371 100644
--- a/docs/designers-developers/developers/themes/theme-json.md
+++ b/docs/designers-developers/developers/themes/theme-json.md
@@ -344,6 +344,7 @@ These are the current color properties supported by blocks:
 | --- | --- |
 | Cover | Yes |
 | Group | Yes |
+| Verse | Yes |
 
 #### Typography Properties
 
diff --git a/packages/block-library/src/verse/block.json b/packages/block-library/src/verse/block.json
index be3cb69adf0bf..a21c79c2aa314 100644
--- a/packages/block-library/src/verse/block.json
+++ b/packages/block-library/src/verse/block.json
@@ -10,6 +10,15 @@
 			"default": "",
 			"__unstablePreserveWhiteSpace": true
 		},
+		"style": {
+			"default": {
+				"spacing": {
+					"padding": {
+						"default": 20
+					}
+				}
+			}
+		},
 		"textAlign": {
 			"type": "string"
 		}
diff --git a/packages/block-library/src/verse/editor.scss b/packages/block-library/src/verse/editor.scss
index f863f5e2556f7..30e577fbae1ca 100644
--- a/packages/block-library/src/verse/editor.scss
+++ b/packages/block-library/src/verse/editor.scss
@@ -1,4 +1,3 @@
 pre.wp-block-verse {
 	color: $gray-900;
-	padding: 1em;
 }

From 11db1605f39407d088efd2d6ca95056bba37a79a Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Mon, 30 Nov 2020 13:04:17 +0000
Subject: [PATCH 2/9] regenerate fixtures

---
 packages/e2e-tests/fixtures/blocks/core__verse.json | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/e2e-tests/fixtures/blocks/core__verse.json b/packages/e2e-tests/fixtures/blocks/core__verse.json
index 5c6e3d83e6516..a1de145d0b3a1 100644
--- a/packages/e2e-tests/fixtures/blocks/core__verse.json
+++ b/packages/e2e-tests/fixtures/blocks/core__verse.json
@@ -4,7 +4,14 @@
         "name": "core/verse",
         "isValid": true,
         "attributes": {
-            "content": "A <em>verse</em>…<br>And more!"
+            "content": "A <em>verse</em>…<br>And more!",
+            "style": {
+                "spacing": {
+                    "padding": {
+                        "default": 20
+                    }
+                }
+            }
         },
         "innerBlocks": [],
         "originalContent": "<pre class=\"wp-block-verse\">A <em>verse</em>…<br>And more!</pre>"

From cff0222f107a88c168f432475c5a63034cb312ce Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Thu, 3 Dec 2020 17:40:39 +0000
Subject: [PATCH 3/9] Update packages/block-library/src/verse/block.json
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: O André <nosolosw@users.noreply.github.com>
---
 packages/block-library/src/verse/block.json | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/block-library/src/verse/block.json b/packages/block-library/src/verse/block.json
index a21c79c2aa314..6878ba8a7e74e 100644
--- a/packages/block-library/src/verse/block.json
+++ b/packages/block-library/src/verse/block.json
@@ -14,7 +14,10 @@
 			"default": {
 				"spacing": {
 					"padding": {
-						"default": 20
+						"top": 20,
+						"right": 20,
+						"bottom": 20,
+						"left": 20
 					}
 				}
 			}

From dd5a27a80c486670af0464216e86c0106995cacf Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Thu, 3 Dec 2020 17:40:47 +0000
Subject: [PATCH 4/9] Update
 packages/e2e-tests/fixtures/blocks/core__verse.json
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: O André <nosolosw@users.noreply.github.com>
---
 packages/e2e-tests/fixtures/blocks/core__verse.json | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/e2e-tests/fixtures/blocks/core__verse.json b/packages/e2e-tests/fixtures/blocks/core__verse.json
index a1de145d0b3a1..64719d54a04d8 100644
--- a/packages/e2e-tests/fixtures/blocks/core__verse.json
+++ b/packages/e2e-tests/fixtures/blocks/core__verse.json
@@ -8,7 +8,10 @@
             "style": {
                 "spacing": {
                     "padding": {
-                        "default": 20
+						"top": 20,
+						"right": 20,
+						"bottom": 20,
+						"left": 20
                     }
                 }
             }

From 89bf22c45623234ad0c833d77fd7d8d136d3c9ba Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Fri, 4 Dec 2020 13:41:35 +0000
Subject: [PATCH 5/9] change formatting on the verse block fixture

---
 packages/e2e-tests/fixtures/blocks/core__verse.json | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/e2e-tests/fixtures/blocks/core__verse.json b/packages/e2e-tests/fixtures/blocks/core__verse.json
index 64719d54a04d8..6415609238acb 100644
--- a/packages/e2e-tests/fixtures/blocks/core__verse.json
+++ b/packages/e2e-tests/fixtures/blocks/core__verse.json
@@ -8,10 +8,10 @@
             "style": {
                 "spacing": {
                     "padding": {
-						"top": 20,
-						"right": 20,
-						"bottom": 20,
-						"left": 20
+                        "top": 20,
+                        "right": 20,
+                        "bottom": 20,
+                        "left": 20
                     }
                 }
             }

From d7e11d6a11fb3f921f9436a3e882763a8a449a8f Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Fri, 4 Dec 2020 18:29:17 +0000
Subject: [PATCH 6/9] regenerate fixtures

---
 packages/e2e-tests/fixtures/blocks/core__verse.html         | 6 +++---
 packages/e2e-tests/fixtures/blocks/core__verse.json         | 2 +-
 packages/e2e-tests/fixtures/blocks/core__verse.parsed.json  | 4 ++--
 .../e2e-tests/fixtures/blocks/core__verse.serialized.html   | 2 +-
 4 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/e2e-tests/fixtures/blocks/core__verse.html b/packages/e2e-tests/fixtures/blocks/core__verse.html
index 0e6904a898ead..356fdcc7acf82 100644
--- a/packages/e2e-tests/fixtures/blocks/core__verse.html
+++ b/packages/e2e-tests/fixtures/blocks/core__verse.html
@@ -1,3 +1,3 @@
-<!-- wp:core/verse -->
-<pre class="wp-block-verse">A <em>verse</em>…<br>And more!</pre>
-<!-- /wp:core/verse -->
+<!-- wp:verse -->
+<pre class="wp-block-verse" style="padding-bottom:20px;padding-left:20px;padding-right:20px;padding-top:20px">A <em>verse</em>…<br>And more!</pre>
+<!-- /wp:verse -->
diff --git a/packages/e2e-tests/fixtures/blocks/core__verse.json b/packages/e2e-tests/fixtures/blocks/core__verse.json
index 6415609238acb..a3a1b520bef85 100644
--- a/packages/e2e-tests/fixtures/blocks/core__verse.json
+++ b/packages/e2e-tests/fixtures/blocks/core__verse.json
@@ -17,6 +17,6 @@
             }
         },
         "innerBlocks": [],
-        "originalContent": "<pre class=\"wp-block-verse\">A <em>verse</em>…<br>And more!</pre>"
+        "originalContent": "<pre class=\"wp-block-verse\" style=\"padding-bottom:20px;padding-left:20px;padding-right:20px;padding-top:20px\">A <em>verse</em>…<br>And more!</pre>"
     }
 ]
diff --git a/packages/e2e-tests/fixtures/blocks/core__verse.parsed.json b/packages/e2e-tests/fixtures/blocks/core__verse.parsed.json
index 2fbff3b1b326e..d48a00c57513a 100644
--- a/packages/e2e-tests/fixtures/blocks/core__verse.parsed.json
+++ b/packages/e2e-tests/fixtures/blocks/core__verse.parsed.json
@@ -3,9 +3,9 @@
         "blockName": "core/verse",
         "attrs": {},
         "innerBlocks": [],
-        "innerHTML": "\n<pre class=\"wp-block-verse\">A <em>verse</em>…<br>And more!</pre>\n",
+        "innerHTML": "\n<pre class=\"wp-block-verse\" style=\"padding-bottom:20px;padding-left:20px;padding-right:20px;padding-top:20px\">A <em>verse</em>…<br>And more!</pre>\n",
         "innerContent": [
-            "\n<pre class=\"wp-block-verse\">A <em>verse</em>…<br>And more!</pre>\n"
+            "\n<pre class=\"wp-block-verse\" style=\"padding-bottom:20px;padding-left:20px;padding-right:20px;padding-top:20px\">A <em>verse</em>…<br>And more!</pre>\n"
         ]
     },
     {
diff --git a/packages/e2e-tests/fixtures/blocks/core__verse.serialized.html b/packages/e2e-tests/fixtures/blocks/core__verse.serialized.html
index a601b259912a8..356fdcc7acf82 100644
--- a/packages/e2e-tests/fixtures/blocks/core__verse.serialized.html
+++ b/packages/e2e-tests/fixtures/blocks/core__verse.serialized.html
@@ -1,3 +1,3 @@
 <!-- wp:verse -->
-<pre class="wp-block-verse">A <em>verse</em>…<br>And more!</pre>
+<pre class="wp-block-verse" style="padding-bottom:20px;padding-left:20px;padding-right:20px;padding-top:20px">A <em>verse</em>…<br>And more!</pre>
 <!-- /wp:verse -->

From 7621a5afbdd8e1ecf13724301be4ae590753b96e Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Tue, 8 Dec 2020 18:48:23 +0000
Subject: [PATCH 7/9] Reset block spacing back to the default value rather than
 removing it

---
 packages/block-editor/src/hooks/padding.js   | 12 +++++++++++-
 packages/block-library/src/verse/edit.js     |  6 ++++++
 packages/components/src/box-control/index.js |  3 ++-
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/packages/block-editor/src/hooks/padding.js b/packages/block-editor/src/hooks/padding.js
index 4f2d5ea51754c..dcfd7352f1da3 100644
--- a/packages/block-editor/src/hooks/padding.js
+++ b/packages/block-editor/src/hooks/padding.js
@@ -3,7 +3,7 @@
  */
 import { __ } from '@wordpress/i18n';
 import { Platform } from '@wordpress/element';
-import { getBlockSupport } from '@wordpress/blocks';
+import { getBlockSupport, getBlockType } from '@wordpress/blocks';
 import { __experimentalBoxControl as BoxControl } from '@wordpress/components';
 
 /**
@@ -69,6 +69,15 @@ export function PaddingEdit( props ) {
 		} );
 	};
 
+	const onReset = () => {
+		const blockType = getBlockType( blockName );
+		const defaultSettings = blockType?.attributes?.style?.default;
+
+		setAttributes( {
+			style: cleanEmptyObject( defaultSettings ),
+		} );
+	};
+
 	return Platform.select( {
 		web: (
 			<>
@@ -76,6 +85,7 @@ export function PaddingEdit( props ) {
 					values={ style?.spacing?.padding }
 					onChange={ onChange }
 					onChangeShowVisualizer={ onChangeShowVisualizer }
+					onReset={ onReset }
 					label={ __( 'Padding' ) }
 					units={ units }
 				/>
diff --git a/packages/block-library/src/verse/edit.js b/packages/block-library/src/verse/edit.js
index a8031e0b0756e..a267394de2588 100644
--- a/packages/block-library/src/verse/edit.js
+++ b/packages/block-library/src/verse/edit.js
@@ -13,6 +13,8 @@ import {
 	AlignmentToolbar,
 	useBlockProps,
 } from '@wordpress/block-editor';
+import { __experimentalBoxControl as BoxControl } from '@wordpress/components';
+const { __Visualizer: BoxControlVisualizer } = BoxControl;
 
 export default function VerseEdit( {
 	attributes,
@@ -36,6 +38,10 @@ export default function VerseEdit( {
 					} }
 				/>
 			</BlockControls>
+			<BoxControlVisualizer
+				values={ attributes.style?.spacing?.padding }
+				showValues={ attributes.style?.visualizers?.padding }
+			/>
 			<RichText
 				tagName="pre"
 				identifier="content"
diff --git a/packages/components/src/box-control/index.js b/packages/components/src/box-control/index.js
index 4291c756a9aeb..bc7d2e7930faf 100644
--- a/packages/components/src/box-control/index.js
+++ b/packages/components/src/box-control/index.js
@@ -48,6 +48,7 @@ export default function BoxControl( {
 	inputProps = defaultInputProps,
 	onChange = noop,
 	onChangeShowVisualizer = noop,
+	onReset = noop,
 	label = __( 'Box Control' ),
 	values: valuesProp,
 	units,
@@ -94,7 +95,7 @@ export default function BoxControl( {
 	const handleOnReset = () => {
 		const initialValues = DEFAULT_VALUES;
 
-		onChange( initialValues );
+		onReset();
 		setValues( initialValues );
 		setIsDirty( false );
 	};

From 56b42ac416747a4e13ad0775962065444491dab4 Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Tue, 15 Dec 2020 13:21:59 +0000
Subject: [PATCH 8/9] Change the default value for padding to 1em

---
 packages/block-library/src/verse/block.json  | 13 ++++++++-----
 packages/components/src/box-control/utils.js |  2 +-
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/packages/block-library/src/verse/block.json b/packages/block-library/src/verse/block.json
index 6878ba8a7e74e..e5cee0faa45f2 100644
--- a/packages/block-library/src/verse/block.json
+++ b/packages/block-library/src/verse/block.json
@@ -14,10 +14,10 @@
 			"default": {
 				"spacing": {
 					"padding": {
-						"top": 20,
-						"right": 20,
-						"bottom": 20,
-						"left": 20
+						"top": "1em",
+						"right": "1em",
+						"bottom": "1em",
+						"left": "1em"
 					}
 				}
 			}
@@ -29,7 +29,10 @@
 	"supports": {
 		"anchor": true,
 		"__experimentalFontFamily": true,
-		"fontSize": true
+		"fontSize": true,
+		"spacing": {
+			"padding": true
+		}
 	},
 	"style": "wp-block-verse",
 	"editorStyle": "wp-block-verse-editor"
diff --git a/packages/components/src/box-control/utils.js b/packages/components/src/box-control/utils.js
index 63051c3ea0823..a7e8d7f5310f1 100644
--- a/packages/components/src/box-control/utils.js
+++ b/packages/components/src/box-control/utils.js
@@ -60,7 +60,7 @@ function mode( arr ) {
  * @return {string} A value + unit for the 'all' input.
  */
 export function getAllValue( values = {} ) {
-	const parsedValues = Object.values( values ).map( parseUnit );
+	const parsedValues = Object.values( values ).map( value => parseUnit( value ) );
 
 	const allValues = parsedValues.map( ( value ) => value[ 0 ] );
 	const allUnits = parsedValues.map( ( value ) => value[ 1 ] );

From cdc5dfe73688ff0adc5f43de8fb5dcf87441bafd Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Tue, 15 Dec 2020 14:38:18 +0000
Subject: [PATCH 9/9] Call onChange if onReset isn't defined

---
 packages/block-editor/src/hooks/padding.js   | 9 +++++++--
 packages/components/src/box-control/index.js | 6 ++++--
 packages/components/src/box-control/utils.js | 4 +++-
 3 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/packages/block-editor/src/hooks/padding.js b/packages/block-editor/src/hooks/padding.js
index dcfd7352f1da3..a41d04187e7a5 100644
--- a/packages/block-editor/src/hooks/padding.js
+++ b/packages/block-editor/src/hooks/padding.js
@@ -69,13 +69,18 @@ export function PaddingEdit( props ) {
 		} );
 	};
 
-	const onReset = () => {
+	const onReset = ( initialValues ) => {
 		const blockType = getBlockType( blockName );
-		const defaultSettings = blockType?.attributes?.style?.default;
+		let defaultSettings = blockType?.attributes?.style?.default;
+		if ( ! defaultSettings ) {
+			defaultSettings = initialValues;
+		}
 
 		setAttributes( {
 			style: cleanEmptyObject( defaultSettings ),
 		} );
+
+		return true;
 	};
 
 	return Platform.select( {
diff --git a/packages/components/src/box-control/index.js b/packages/components/src/box-control/index.js
index bc7d2e7930faf..a7b67a8c9e2d0 100644
--- a/packages/components/src/box-control/index.js
+++ b/packages/components/src/box-control/index.js
@@ -94,8 +94,10 @@ export default function BoxControl( {
 
 	const handleOnReset = () => {
 		const initialValues = DEFAULT_VALUES;
-
-		onReset();
+		const success = onReset( initialValues );
+		if ( ! success ) {
+			onChange( initialValues );
+		}
 		setValues( initialValues );
 		setIsDirty( false );
 	};
diff --git a/packages/components/src/box-control/utils.js b/packages/components/src/box-control/utils.js
index a7e8d7f5310f1..c2bd4baddd215 100644
--- a/packages/components/src/box-control/utils.js
+++ b/packages/components/src/box-control/utils.js
@@ -60,7 +60,9 @@ function mode( arr ) {
  * @return {string} A value + unit for the 'all' input.
  */
 export function getAllValue( values = {} ) {
-	const parsedValues = Object.values( values ).map( value => parseUnit( value ) );
+	const parsedValues = Object.values( values ).map( ( value ) =>
+		parseUnit( value )
+	);
 
 	const allValues = parsedValues.map( ( value ) => value[ 0 ] );
 	const allUnits = parsedValues.map( ( value ) => value[ 1 ] );