Merge pull request #74 from INN/72-visual-fixes

Wrap the always-visible textControl in a PanelBody so that it has the correct padding

Author: benlk

js/block.js

@@ -20,6 +20,7 @@
 	 * Text tools
 	 */
 	var TextControl = wp.components.TextControl;
+	var PanelBody = wp.components.PanelBody;
 
 	/**
 	 * The sidebar controls I think?
@@ -121,20 +122,19 @@
 						onChange: ( value ) => { props.setAttributes( { src: value } ); },
 					} )
 				),
-				/*
-				 * InspectorControls lets you add controls to the Block sidebar. In this case,
-				 * we're adding a TextControl, which lets us edit the 'foo' attribute (which
-				 * we defined in the PHP). The onChange property is a little bit of magic to tell
-				 * the block editor to update the value of our 'foo' property, and to re-render
-				 * the block.
-				 */
 				el( InspectorControls, {},
-					el( TextControl, {
-						label: __( 'Pym.js Child URL' ),
-						value: props.attributes.src,
-						placeholder: __( 'What is the URL of your Pym.js child page?' ),
-						onChange: ( value ) => { props.setAttributes( { src: value } ); },
-					} ),
+					el(
+						PanelBody, // inserting a PanelBody here for the presentational classes, so that it matches the display of InspectorAdvancedControls children
+						{
+							initialOpen: true,
+						},
+						el( TextControl, {
+							label: __( 'Pym.js Child URL' ),
+							value: props.attributes.src,
+							placeholder: __( 'What is the URL of your Pym.js child page?' ),
+							onChange: ( value ) => { props.setAttributes( { src: value } ); },
+						} )
+					)
 				),
 				el( InspectorAdvancedControls, {},
 					el( TextControl, {

readme.txt

@@ -4,7 +4,7 @@ Donate link: https://inn.org/donate
 Tags: shortcode, iframe, javascript, embeds, responsive, pym, NPR
 Requires at least: 3.0.1
 Requires PHP: 5.3
-Tested up to: 5.3.2
+Tested up to: 5.4
 Stable tag: 1.3.2.3
 License: GPLv2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
@@ -50,6 +50,10 @@ Mobile view of the WordPress post with the NPR embed using Pym.js Shortcode:
 
 == Changelog ==
 
+= [next] =
+
+- Fixes a presentational error in the Pym.js Embeds Block's block inspector control within the editor. PR [#74](https://github.com/INN/pym-shortcode/pull/74) for issue [#72](https://github.com/INN/pym-shortcode/issues/72).
+
 = 1.3.2.3 =
 
 New features: