From 1d41af86c3a373958ce19dcc6f3d87df773e111b Mon Sep 17 00:00:00 2001
From: Marcus Quinn <6428977+marcusquinn@users.noreply.github.com>
Date: Mon, 16 Mar 2026 23:08:09 +0000
Subject: [PATCH] fix: add dialog semantics and accessible close button to
 update source modal (#58)

Addresses PR #18 review feedback (issue #22):
- Add role="dialog", aria-modal="true", aria-labelledby to modal container
- Add tabindex="-1" to make modal keyboard-focusable
- Add unique id to <h2> heading for aria-labelledby reference
- Replace <span class="wpst-modal-close"> with <button type="button"> and aria-label

Fixes #22
---
 admin/templates/modal.php | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/admin/templates/modal.php b/admin/templates/modal.php
index 7fbfd78..4d153ef 100644
--- a/admin/templates/modal.php
+++ b/admin/templates/modal.php
@@ -12,11 +12,22 @@ if ( ! defined( 'ABSPATH' ) ) {
 ?>
 
 <!-- Update Source Modal -->
-<div id="wpst-update-source-modal" class="wpst-modal" role="dialog" aria-modal="true" aria-labelledby="wpst-modal-title">
+<div
+    id="wpst-update-source-modal"
+    class="wpst-modal"
+    role="dialog"
+    aria-modal="true"
+    aria-labelledby="wpst-update-source-modal-title"
+    tabindex="-1"
+>
     <div class="wpst-modal-content">
         <div class="wpst-modal-header">
-            <h2 id="wpst-modal-title" class="wpst-modal-title"><?php esc_html_e( 'Select Update Source', 'wp-plugin-starter-template' ); ?></h2>
-            <button type="button" class="wpst-modal-close" aria-label="<?php esc_attr_e( 'Close', 'wp-plugin-starter-template' ); ?>">&times;</button>
+            <h2 id="wpst-update-source-modal-title" class="wpst-modal-title"><?php esc_html_e( 'Select Update Source', 'wp-plugin-starter-template' ); ?></h2>
+            <button
+                type="button"
+                class="wpst-modal-close"
+                aria-label="<?php esc_attr_e( 'Close dialog', 'wp-plugin-starter-template' ); ?>"
+            >&times;</button>
         </div>
         
         <div class="wpst-modal-body">