Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .plugin-data
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
{
"version": "1.0.4",
"version": "1.0.5",
"slug": "blockparty-modal"
}
5 changes: 5 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -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/)
Expand Down Expand Up @@ -271,6 +272,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.

Expand Down
4 changes: 2 additions & 2 deletions blockparty-modal.php
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand All @@ -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__ ) );

Expand Down
8 changes: 6 additions & 2 deletions blueprint.json
Original file line number Diff line number Diff line change
@@ -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"
Expand All @@ -16,13 +16,17 @@
"pluginData": {
"resource": "git:directory",
"url": "https://github.com/BeAPI/blockparty-modal",
"ref": "1.0.4",
"ref": "1.0.5",
"refType": "tag"
},
"options": {
"activate": true,
"targetFolderName": "blockparty-modal"
}
},
{
"step": "runPHP",
"code": "<?php require_once 'wordpress/wp-load.php'; $page_content = '<?php require_once 'wordpress/wp-load.php'; $page_content = '<!-- wp:buttons -->\n<div class=\"wp-block-buttons\"><!-- wp:button {\"linkedModalId\":\"m-e16de3fe79f9\"} -->\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\">Open my modal window</a></div>\n<!-- /wp:button --></div>\n<!-- /wp:buttons -->\n\n<!-- wp:blockparty/modal {\"title\":\"My Modal\",\"modalId\":\"m-e16de3fe79f9\",\"displayIconOnly\":true,\"style\":{\"spacing\":{\"padding\":{\"top\":\"var:preset|spacing|40\",\"bottom\":\"var:preset|spacing|40\",\"left\":\"var:preset|spacing|40\",\"right\":\"var:preset|spacing|40\"}}}} -->\n<dialog class=\"wp-block-blockparty-modal\" style=\"padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\" id=\"modal-m-e16de3fe79f9\" aria-modal=\"true\" closedby=\"any\"><div class=\"wp-block-blockparty-modal__header\"><h2 class=\"wp-block-blockparty-modal__title\">My Modal</h2></div><div class=\"wp-block-blockparty-modal__content\"><!-- wp:paragraph -->\n<p>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).</p>\n<!-- /wp:paragraph --></div><button type=\"button\" class=\"wp-block-blockparty-modal__close-button\"><span class=\"sr-only\">Close this dialog window</span><svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" width=\"24\" height=\"24\" aria-hidden=\"true\"><path d=\"m13.06 12 6.47-6.47-1.06-1.06L12 10.94 5.53 4.47 4.47 5.53 10.94 12l-6.47 6.47 1.06 1.06L12 13.06l6.47 6.47 1.06-1.06L13.06 12Z\"></path></svg></button></dialog>\n<!-- /wp:blockparty/modal -->'; $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; ?>"
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Duplicated PHP code in blueprint runPHP step

High Severity

The code field in the runPHP step contains the entire PHP snippet duplicated — the full script is nested inside itself as the value of $page_content. The outer copy opens a single-quoted string ($page_content = '<?php require_once ') which is immediately terminated by the unescaped single quote before wordpress in the inner copy, causing a PHP parse error. The WordPress Playground blueprint will fail to create the demo page.

Fix in Cursor Fix in Web

}
]
}
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -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",
Expand Down
4 changes: 4 additions & 0 deletions readme.txt
Original file line number Diff line number Diff line change
Expand Up @@ -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.

Expand Down
53 changes: 42 additions & 11 deletions src/blockparty-modal/block.json
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand All @@ -31,7 +59,10 @@
"background": true,
"text": true
},
"spacing": { "padding": true, "blockGap": true },
"spacing": {
"padding": true,
"blockGap": true
},
"html": false
},
"textdomain": "blockparty-modal",
Expand Down
74 changes: 74 additions & 0 deletions src/blockparty-modal/deprecated.js
Original file line number Diff line number Diff line change
@@ -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 (
<dialog
{ ...useBlockProps.save( customProps ) }
id={ dialogId }
aria-modal="true"
// eslint-disable-next-line react/no-unknown-property
closedBy={ closedBy }
>
<div className="wp-block-blockparty-modal__header">
<RichText.Content
className="wp-block-blockparty-modal__title"
tagName={ `h${ String( HeadingTag ) }` }
value={ title }
/>
</div>
<div className="wp-block-blockparty-modal__content">
<InnerBlocks.Content />
</div>
{ enableCloseButton && closedBy !== 'none' && (
<button
type="button"
className="wp-block-blockparty-modal__close-button"
>
<span className={ displayIconOnly ? 'sr-only' : '' }>
{ __( 'Close this dialog window', 'blockparty-modal' ) }
</span>
<Icon icon={ close } />
</button>
) }
</dialog>
);
}

export default [
{
save: saveV1CloseLabelSrOnly,
},
];
8 changes: 7 additions & 1 deletion src/blockparty-modal/edit.js
Original file line number Diff line number Diff line change
Expand Up @@ -209,7 +209,13 @@ export default function Edit( { clientId, attributes, setAttributes } ) {
type="button"
className="wp-block-blockparty-modal__close-button"
>
<span className={ displayIconOnly ? 'sr-only' : '' }>
<span
className={
displayIconOnly
? 'screen-reader-text sr-only'
: ''
}
>
{ __(
'Close this dialog window',
'blockparty-modal'
Expand Down
2 changes: 2 additions & 0 deletions src/blockparty-modal/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -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 {
Expand All @@ -31,6 +32,7 @@ registerBlockType( metadata.name, {
icon: modal,
edit: Edit,
save,
deprecated,
} );

/**
Expand Down
6 changes: 5 additions & 1 deletion src/blockparty-modal/save.js
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,11 @@ export default function save( { attributes } ) {
type="button"
className="wp-block-blockparty-modal__close-button"
>
<span className={ displayIconOnly ? 'sr-only' : '' }>
<span
className={
displayIconOnly ? 'screen-reader-text sr-only' : ''
}
>
{ __( 'Close this dialog window', 'blockparty-modal' ) }
</span>
<Icon icon={ close } />
Expand Down
Loading