From ee407a447c76a9e4bc08b74fe4108b449db7e2d7 Mon Sep 17 00:00:00 2001 From: mricoul Date: Thu, 26 Mar 2026 15:13:57 +0100 Subject: [PATCH 1/4] fix(modal): add screen-reader-text class to close button Adds the standard WordPress `screen-reader-text` class alongside `sr-only` to ensure the close button label is correctly hidden visually while remaining accessible to screen readers when the "display icon only" option is active. --- src/blockparty-modal/edit.js | 8 +++++++- src/blockparty-modal/save.js | 6 +++++- 2 files changed, 12 insertions(+), 2 deletions(-) diff --git a/src/blockparty-modal/edit.js b/src/blockparty-modal/edit.js index 90c72e5..aab2bf6 100644 --- a/src/blockparty-modal/edit.js +++ b/src/blockparty-modal/edit.js @@ -209,7 +209,13 @@ export default function Edit( { clientId, attributes, setAttributes } ) { type="button" className="wp-block-blockparty-modal__close-button" > - + { __( 'Close this dialog window', 'blockparty-modal' diff --git a/src/blockparty-modal/save.js b/src/blockparty-modal/save.js index aba72eb..326fc1f 100644 --- a/src/blockparty-modal/save.js +++ b/src/blockparty-modal/save.js @@ -68,7 +68,11 @@ export default function save( { attributes } ) { type="button" className="wp-block-blockparty-modal__close-button" > - + { __( 'Close this dialog window', 'blockparty-modal' ) } From e3ea80c407fdc3470cdf940237bac95687e16c84 Mon Sep 17 00:00:00 2001 From: mricoul Date: Thu, 26 Mar 2026 15:14:13 +0100 Subject: [PATCH 2/4] chore(blueprint): setup demo page and update landing page Adds a PHP step to the blueprint that automatically creates a sample page showcasing the Blockparty Modal block. Updates the landing page configuration to direct users to the editor for this newly created post instead of a blank new post. --- README.md | 1 + blueprint.json | 6 +++++- 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 41bcc26..eeeebed 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,7 @@ # Blockparty — Modal [![Test with WordPress Playground](https://img.shields.io/badge/Test%20with-WordPress%20Playground-0073aa?style=for-the-badge&logo=wordpress&logoColor=white)](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/beapi/blockparty-modal/refs/heads/main/blueprint.json) + [![License: GPL v2](https://img.shields.io/badge/License-GPL%20v2-blue.svg)](https://www.gnu.org/licenses/gpl-2.0) [![WordPress: 6.8+](https://img.shields.io/badge/WordPress-6.8+-green.svg)](https://wordpress.org/) [![PHP: 8.1+](https://img.shields.io/badge/PHP-8.1+-purple.svg)](https://php.net/) diff --git a/blueprint.json b/blueprint.json index 35831f6..4ac5102 100644 --- a/blueprint.json +++ b/blueprint.json @@ -1,6 +1,6 @@ { "$schema": "https://playground.wordpress.net/blueprint-schema.json", - "landingPage": "/wp-admin/post-new.php", + "landingPage": "/wp-admin/post.php?post=4&action=edit", "preferredVersions": { "php": "8.1", "wp": "latest" @@ -23,6 +23,10 @@ "activate": true, "targetFolderName": "blockparty-modal" } + }, + { + "step": "runPHP", + "code": "\n
\n
Open my modal window
\n
\n\n\n\n

My Modal

\n

Blockparty Modal is a WordPress plugin that lets you add accessible modal dialogs to your content via the Gutenberg block editor. You define the modal content and behaviour in the editor; on the frontend, the modal is shown when the user activates a linked trigger (such as a button block).

\n
\n'; $page_id = wp_insert_post(array('post_title' => 'Blockparty Modal', 'post_content' => $page_content, 'post_status' => 'publish', 'post_type' => 'page')); echo 'Page created with ID: ' . $page_id; ?>'; $page_id = wp_insert_post(array('post_title' => 'Blockparty Modal', 'post_content' => $page_content, 'post_status' => 'publish', 'post_type' => 'page')); echo 'Page created with ID: ' . $page_id; ?>" } ] } From d869de1b5172a7d858b4e3e237b0e7b44e3df9f8 Mon Sep 17 00:00:00 2001 From: mricoul Date: Thu, 26 Mar 2026 15:17:26 +0100 Subject: [PATCH 3/4] chore: releases version 1.0.5 --- .plugin-data | 2 +- README.md | 4 +++ blockparty-modal.php | 4 +-- blueprint.json | 2 +- package.json | 2 +- readme.txt | 4 +++ src/blockparty-modal/block.json | 53 ++++++++++++++++++++++++++------- 7 files changed, 55 insertions(+), 16 deletions(-) diff --git a/.plugin-data b/.plugin-data index af27360..467792b 100644 --- a/.plugin-data +++ b/.plugin-data @@ -1,4 +1,4 @@ { - "version": "1.0.4", + "version": "1.0.5", "slug": "blockparty-modal" } diff --git a/README.md b/README.md index 41bcc26..b2dc550 100644 --- a/README.md +++ b/README.md @@ -271,6 +271,10 @@ This plugin is distributed under the GPL-2.0-or-later license. See the [LICENSE] See [readme.txt](readme.txt) for the full version history. Recent highlights: +- **1.0.5** + - Add `blueprint.json` to test the plugin on WordPress Playground. + - Add `screen-reader-text` class to close button element when display icon only is selected. + - **1.0.4** - Filter `blockparty_modal_inner_allowed_blocks` to control allowed blocks in the modal. diff --git a/blockparty-modal.php b/blockparty-modal.php index 05873fe..f6a0b06 100644 --- a/blockparty-modal.php +++ b/blockparty-modal.php @@ -2,7 +2,7 @@ /** * Plugin Name: Blockparty Modal * Description: Modal block for WordPress editor. - * Version: 1.0.4 + * Version: 1.0.5 * Requires at least: 6.8 * Requires PHP: 8.1 * Author: Be API Technical Team @@ -19,7 +19,7 @@ exit; // Exit if accessed directly. } -define( 'BLOCKPARTY_MODAL_VERSION', '1.0.4' ); +define( 'BLOCKPARTY_MODAL_VERSION', '1.0.5' ); define( 'BLOCKPARTY_MODAL_URL', plugin_dir_url( __FILE__ ) ); define( 'BLOCKPARTY_MODAL_DIR', plugin_dir_path( __FILE__ ) ); diff --git a/blueprint.json b/blueprint.json index 35831f6..b3b41a2 100644 --- a/blueprint.json +++ b/blueprint.json @@ -16,7 +16,7 @@ "pluginData": { "resource": "git:directory", "url": "https://github.com/BeAPI/blockparty-modal", - "ref": "1.0.4", + "ref": "1.0.5", "refType": "tag" }, "options": { diff --git a/package.json b/package.json index 08e2eb4..fbb2ec2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "blockparty-modal", - "version": "1.0.4", + "version": "1.0.5", "description": "Add a modal block to the WordPress editor.", "author": "Be API", "license": "GPL-2.0-or-later", diff --git a/readme.txt b/readme.txt index 4085afc..20cf8bf 100644 --- a/readme.txt +++ b/readme.txt @@ -45,6 +45,10 @@ directory take precedence. For example, `/assets/screenshot-1.png` would win ove == Changelog == += 1.0.5 = +* Add `blueprint.json` to test the plugin on WordPress Playground. +* Add `screen-reader-text` class to close button element when display icon only is selected. + = 1.0.4 = * Filter `blockparty_modal_inner_allowed_blocks` to control allowed blocks in the modal. diff --git a/src/blockparty-modal/block.json b/src/blockparty-modal/block.json index 8f1ddfc..9b0b3a8 100644 --- a/src/blockparty-modal/block.json +++ b/src/blockparty-modal/block.json @@ -2,27 +2,55 @@ "$schema": "https://schemas.wp.org/trunk/block.json", "apiVersion": 3, "name": "blockparty/modal", - "version": "1.0.4", + "version": "1.0.5", "title": "Modal", "category": "widgets", "description": "Insert a modal dialog that opens on trigger. Configure content and behaviour in the editor; the modal is displayed on the frontend when activated.", "attributes": { - "headingLevel": { "type": "number", "default": 2 }, - "title": { "type": "string", "default": "" }, - "content": { "type": "string", "default": "" }, - "modalId": { "type": "string", "default": "" }, + "headingLevel": { + "type": "number", + "default": 2 + }, + "title": { + "type": "string", + "default": "" + }, + "content": { + "type": "string", + "default": "" + }, + "modalId": { + "type": "string", + "default": "" + }, "closedBy": { "type": "string", "default": "any", - "enum": [ "any", "closerequest", "none" ] + "enum": [ + "any", + "closerequest", + "none" + ] + }, + "enableCloseButton": { + "type": "boolean", + "default": true }, - "enableCloseButton": { "type": "boolean", "default": true }, - "displayIconOnly": { "type": "boolean", "default": false }, - "preventScroll": { "type": "boolean", "default": false } + "displayIconOnly": { + "type": "boolean", + "default": false + }, + "preventScroll": { + "type": "boolean", + "default": false + } }, "example": {}, "supports": { - "align": [ "wide", "full" ], + "align": [ + "wide", + "full" + ], "dimensions": { "height": true, "minHeight": true @@ -31,7 +59,10 @@ "background": true, "text": true }, - "spacing": { "padding": true, "blockGap": true }, + "spacing": { + "padding": true, + "blockGap": true + }, "html": false }, "textdomain": "blockparty-modal", From 7113d8544e932b10cfa5e527197e995a8158bb28 Mon Sep 17 00:00:00 2001 From: mricoul Date: Thu, 26 Mar 2026 15:26:41 +0100 Subject: [PATCH 4/4] fix(modal): add deprecation for v1.0.4 markup changes Ensures existing block content remains valid by providing a fallback for the markup used before the `screen-reader-text` class was added to the close button label. --- src/blockparty-modal/deprecated.js | 74 ++++++++++++++++++++++++++++++ src/blockparty-modal/index.js | 2 + 2 files changed, 76 insertions(+) create mode 100644 src/blockparty-modal/deprecated.js diff --git a/src/blockparty-modal/deprecated.js b/src/blockparty-modal/deprecated.js new file mode 100644 index 0000000..a44d79d --- /dev/null +++ b/src/blockparty-modal/deprecated.js @@ -0,0 +1,74 @@ +/** + * Prior save output for validation of existing post content. + * + * @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-deprecation/ + */ +import { __ } from '@wordpress/i18n'; +import { useBlockProps, InnerBlocks, RichText } from '@wordpress/block-editor'; +import { Icon, close } from '@wordpress/icons'; + +const MODAL_ID_PREFIX = 'modal-'; + +/** + * Save markup before `screen-reader-text` was added to the close label span (v1.0.4+). + * + * @param {Object} props Block props. + * @param {Object} props.attributes Block attributes. + * @return {JSX.Element} Element to render. + */ +function saveV1CloseLabelSrOnly( { attributes } ) { + const { + closedBy, + displayIconOnly, + enableCloseButton, + headingLevel: HeadingTag, + modalId, + preventScroll, + title, + } = attributes; + + const dialogId = modalId ? MODAL_ID_PREFIX + modalId : undefined; + const customProps = {}; + + if ( preventScroll ) { + customProps.className = 'wp-block-blockparty-modal--prevent-scroll'; + } + + return ( + +
+ +
+
+ +
+ { enableCloseButton && closedBy !== 'none' && ( + + ) } + + ); +} + +export default [ + { + save: saveV1CloseLabelSrOnly, + }, +]; diff --git a/src/blockparty-modal/index.js b/src/blockparty-modal/index.js index d17d1a6..691889d 100644 --- a/src/blockparty-modal/index.js +++ b/src/blockparty-modal/index.js @@ -18,6 +18,7 @@ import './style.scss'; import Edit from './edit'; import save from './save'; +import deprecated from './deprecated'; import metadata from './block.json'; import { @@ -31,6 +32,7 @@ registerBlockType( metadata.name, { icon: modal, edit: Edit, save, + deprecated, } ); /**