diff --git a/README.txt b/README.txt
index b609212..a34d781 100644
--- a/README.txt
+++ b/README.txt
@@ -4,7 +4,7 @@ Donate link: https://tri.be
Tags: blocks, editor, alignment
Requires at least: 6.0
Tested up to: 6.2
-Stable tag: 1.0.5
+Stable tag: 1.0.6
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
@@ -21,6 +21,9 @@ The plugin runs off of an `_experimentalLayout` attribute in `theme.json` that a
== Changelog ==
+= 1.0.6 =
+* Fixes an issue where blocks could get a class of `alignfalse` when selecting the "None" alignment in the toolbar.
+
= 1.0.5 =
* Use `enqueue_block_editor_assets` instead of `admin_enqueue_scripts` to prevent dependency errors
diff --git a/admin/js/block-editor-custom-alignments-admin.js b/admin/js/block-editor-custom-alignments-admin.js
index ca64f69..c4fb375 100644
--- a/admin/js/block-editor-custom-alignments-admin.js
+++ b/admin/js/block-editor-custom-alignments-admin.js
@@ -270,7 +270,7 @@
const allowedAlignControls = [];
for ( const alignment of combinedAlignments ) {
- let { name, slug, icon, width, textdomain } = alignment;
+ const { name, slug, icon, width, textdomain } = alignment;
// check if this alignment is the currently selected alignment for the block and grab the icon for the active one
if (
@@ -331,9 +331,13 @@
title: controlTitle,
icon: blockAlignIcon( icon ),
onClick: () => {
- if ( slug === 'none' ) {
- // Because we don't want a "alignnone" classname in our block
- slug = false;
+ // Change the current ToolbarDropdownMenu icon if the block align has been changed
+ const alignToolbarButton = document.querySelector(
+ '[aria-label="Align"]'
+ );
+
+ if ( alignToolbarButton ) {
+ alignToolbarButton.innerHTML = ``;
}
// set classes on the block depending on if a class is already set on the block
@@ -342,8 +346,10 @@
if (
currentClass !== undefined &&
- currentClass.includes( ' ' )
+ currentClass.includes( ' ' ) &&
+ currentClass.includes( 'align' )
) {
+ // if we have multiple classes set on the element
const classArray = currentClass.split( ' ' );
classArray.forEach( ( singleClass, index ) => {
@@ -353,24 +359,42 @@
} );
updatedClass = classArray.join( ' ' );
- } else {
+ } else if (
+ currentClass !== undefined &&
+ currentClass !== '' &&
+ currentClass.includes( 'align' )
+ ) {
+ // if we only have one class set on the element and the class is "align..."
+ updatedClass = `align${ slug }`;
+ } else if (
+ currentClass !== undefined &&
+ currentClass !== '' &&
+ ! currentClass.includes( 'align' )
+ ) {
+ // if we only have one class set on the element and the class isn't "align..."
+ updatedClass = currentClass + ` align${ slug }`;
+ } else if (
+ currentClass === undefined ||
+ currentClass === ''
+ ) {
+ // if we have no classes set on the element
updatedClass = `align${ slug }`;
+ } else {
+ updatedClass = '';
+ }
+
+ // if our updated class includes alignnone, remove it
+ if ( updatedClass.includes( 'alignnone' ) ) {
+ updatedClass = updatedClass
+ .replace( 'alignnone', '' )
+ .trim();
}
// Change the block align attribute
props.setAttributes( {
- align: slug === undefined ? 'none' : slug,
+ align: slug,
className: updatedClass,
} );
-
- // Change the current ToolbarDropdownMenu icon if the block align has been changed
- const alignToolbarButton = document.querySelector(
- '[aria-label="Align"]'
- );
-
- if ( alignToolbarButton ) {
- alignToolbarButton.innerHTML = ``;
- }
},
};
diff --git a/block-editor-custom-alignments.php b/block-editor-custom-alignments.php
index 7781241..8fe7c52 100644
--- a/block-editor-custom-alignments.php
+++ b/block-editor-custom-alignments.php
@@ -13,7 +13,7 @@
* Plugin Name: Block Editor Custom Alignments
* Plugin URI: https://https://github.com/moderntribe/block-editor-custom-alignments
* Description: Allows developers to add custom alignments to `theme.json` for use in the block editor.
- * Version: 1.0.5
+ * Version: 1.0.6
* Author: Modern Tribe
* Author URI: https://tri.be
* License: GPL-2.0+
@@ -54,7 +54,7 @@ class Block_Editor_Custom_Alignments {
public function __construct() {
global $pagenow;
- $this->version = '1.0.5';
+ $this->version = '1.0.6';
$this->name = 'block-editor-custom-alignments';
$this->base_url = trailingslashit( plugin_dir_url( __FILE__ ) );
$this->theme_json = $this->block_editor_custom_alignments_theme_json();
@@ -155,7 +155,13 @@ private function block_editor_custom_alignments_theme_json(): object {
return new \stdClass();
}
- return json_decode( $theme_json );
+ $json_theme_json = json_decode( $theme_json );
+
+ if ( ! $json_theme_json ) {
+ return new \stdClass();
+ }
+
+ return $json_theme_json;
}
}
diff --git a/package.json b/package.json
index 2ed8dd0..f8f89bf 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "block-editor-custom-alignments",
- "version": "1.0.5",
+ "version": "1.0.6",
"description": "Allows developers to add custom alignments to `theme.json` for use in the block editor.",
"author": "Modern Tribe ",
"license": "GPL-2.0-or-later",