Merge branch 'fix/sidebar-block-rendering' into develop

washingtonstateuniversity · May 25, 2022 · 16b7910 · 16b7910
2 parents 826175d + 4d7ca2d
commit 16b7910
Show file tree

Hide file tree

Showing 7 changed files with 18 additions and 24 deletions.
diff --git a/src/blocks/sidebar/block.json b/src/blocks/sidebar/block.json
@@ -1,10 +1,19 @@
 {
+	"$schema": "https://schemas.wp.org/trunk/block.json",
 	"apiVersion": 2,
 	"name": "hrswp/sidebar",
+	"title": "Sidebar",
 	"category": "layout",
+	"description": "Display content in a sidebar-style layout (two-thirds and one-third).",
+	"keywords": [ "sidebar", "columns" ],
+	"textdomain": "default",
 	"supports": {
 		"align": true
 	},
+	"styles": [
+		{ "name": "sidebar-right", "label": "Right", "isDefault": true },
+		{ "name": "sidebar-left", "label": "Left" }
+	],
 	"editorScript": "hrswp_blocks_script",
 	"editorStyle": "hrswp_blocks_editor_style",
 	"style": "hrswp_blocks_style"

diff --git a/src/blocks/sidebar/edit.js b/src/blocks/sidebar/edit.js
@@ -1,8 +1,8 @@
 /**
  * WordPress dependencies
  */
-const { __ } = wp.i18n;
-const { useInnerBlocksProps, useBlockProps } = wp.blockEditor;
+import { __ } from '@wordpress/i18n';
+import { useInnerBlocksProps, useBlockProps } from '@wordpress/block-editor';
 
 /**
  * The block template.

diff --git a/src/blocks/sidebar/editor.css b/src/blocks/sidebar/editor.css
@@ -1,4 +1,3 @@
-/* stylelint-disable selector-class-pattern */
 .wp-block-hrswp-sidebar .wp-block {
 	max-width: none;
 	margin-left: 0;
@@ -15,6 +14,10 @@
 
 @media (min-width: 600px) {
 
+	.wp-block-hrswp-sidebar {
+		gap: 2rem;
+	}
+
 	.wp-block-hrswp-sidebar.wp-block-columns > .block-editor-inner-blocks > .block-editor-block-list__layout {
 		display: flex;
 	}
@@ -36,4 +39,3 @@
 	}
 
 }
-/* stylelint-enable selector-class-pattern */
diff --git a/src/blocks/sidebar/icon.js b/src/blocks/sidebar/icon.js
@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-const { Path, SVG } = wp.components;
+import { Path, SVG } from '@wordpress/components';
 
 export default (
 	<SVG viewBox="468 268 24 24" xmlns="http://www.w3.org/2000/svg">

diff --git a/src/blocks/sidebar/index.js b/src/blocks/sidebar/index.js
@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-const { __, _x } = wp.i18n;
+import { __ } from '@wordpress/i18n';
 
 /**
  * Internal dependencies
@@ -17,12 +17,7 @@ const { name } = metadata;
 export { metadata, name };
 
 export const settings = {
-	title: _x( 'Sidebar', 'block title' ),
 	icon,
-	description: __(
-		'Display content in a sidebar-style layout (two-thirds and one-third).'
-	),
-	keywords: [ __( 'sidebar' ), __( 'columns' ) ],
 	example: {
 		innerBlocks: [
 			{
@@ -76,17 +71,6 @@ export const settings = {
 			},
 		],
 	},
-	styles: [
-		{
-			name: 'sidebar-right',
-			label: _x( 'Sidebar on right', 'block style' ),
-			isDefault: true,
-		},
-		{
-			name: 'sidebar-left',
-			label: _x( 'Sidebar on left', 'block style' ),
-		},
-	],
 	transforms,
 	edit,
 	save,

diff --git a/src/blocks/sidebar/save.js b/src/blocks/sidebar/save.js
@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-const { useBlockProps, useInnerBlocksProps } = wp.blockEditor;
+import { useBlockProps, useInnerBlocksProps } from '@wordpress/block-editor';
 
 export default function save() {
 	const blockProps = useBlockProps.save();

diff --git a/src/blocks/sidebar/style.css b/src/blocks/sidebar/style.css
@@ -5,7 +5,6 @@
 	/* Responsiveness: Allow wrapping on mobile. */
 	flex-wrap: wrap;
 
-
 	/**
 	 * All Columns Alignment
 	 */
-Original file line number
+Diff line change
@@ Expand Up / @@ -5,7 +5,6 @@ @@
     	/* Responsiveness: Allow wrapping on mobile. */
     	flex-wrap: wrap;
     	/**
     	 * All Columns Alignment
     	 */
@@ Expand Down @@