Dhali Modal

A three-block modal component: a wrapper, a clickable trigger, and the popup window content — each independently styleable and each able to contain any other blocks.

Managed centrally by Dhali Extension Manager, which installs and activates this plugin on a site from this repo directly. It's also a fully standalone, valid WordPress plugin — you can install it manually the normal way if you ever need to.

What it does

Registers three related blocks from one plugin:

• dhali-modal/modal ("Modal") — the outer wrapper block. Supports wide/full alignment.
• dhali-modal/trigger ("Modal Trigger") — only insertable inside a Modal block. The clickable element that opens it. Put anything inside it — text, an icon, an image. Attributes: tagName (default button), ariaLabel, width, height.
• dhali-modal/window ("Modal Window") — only insertable inside a Modal block. The popup content itself — video embeds, headings, buttons, images, whatever you nest inside it. Attributes: closeButtonLabel (default Close), modalSize (default medium), animation (default fade), overlayOpacity (default 70).

Because Trigger and Window both declare "parent": ["dhali-modal/modal"] in their block.json, the editor only lets you insert them inside a Modal block — you can't add a stray Trigger or Window on its own.

Toggling this one extension on or off controls all three blocks together — there's no way to enable just the trigger without the window, since they're registered from the same plugin file. If you ever need them independently toggleable, they'd need to be split into separate plugin repos.

Requirements

• WordPress 6.8+
• PHP 7.4+

Usage

1. Insert a "Modal" block.
2. Inside it, add a "Modal Trigger" block and put whatever content you want clickable inside that (text, an Icon block, an image).
3. Also inside the Modal block, add a "Modal Window" block and put the popup's actual content inside that.
4. Adjust size, animation, overlay opacity, and the close button label from the Modal Window block's settings panel.

Development

Scaffolded with @wordpress/create-block (multi-block setup). Source lives in src/, compiled output in build/ — both are committed to this repo, since Dhali Extension Manager installs directly from the repo's files and does not run a build step of its own.

npm install
npm start     # dev build with watch
npm run build # production build — run this before committing

If you edit anything in src/, always run npm run build and commit the updated build/ output in the same commit — otherwise the site installs whatever build/ last had, not your source changes.

Keeping this updated on sites where it's already installed

This plugin should carry its own update-checker (includes/dhali-plugin-updater.php) and an Update URI: header pointing at this repo, the same way Dhali Copyright does — confirmed working there as of 0.2.0. If this repo doesn't have that wired up yet, copy the pattern from Dhali-Copyright: the header line, the require_once/init() call, and the updater class file itself.

Once wired up: bump Version:, push to master, done — sites already running this plugin will see a normal "Update available" notice without any manual redeploy.