From 0290bc6dd55364a126c339d687e5bb8e63fe396a Mon Sep 17 00:00:00 2001
From: Alan Bridgeman <a.bridgeman@hotmail.com>
Date: Wed, 8 Jul 2026 21:04:07 -0500
Subject: [PATCH] Continuing to work on dropdown

---
 src/components/dropdown/dropdown.ejs | 4 ++--
 src/components/dropdown/dropdown.mjs | 4 +++-
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/dropdown/dropdown.ejs b/src/components/dropdown/dropdown.ejs
index de075e4..6b8e7e4 100644
--- a/src/components/dropdown/dropdown.ejs
+++ b/src/components/dropdown/dropdown.ejs
@@ -55,7 +55,7 @@
             <% } %>
         <!-- END: Scripts -->
         
-        <div role="button" class="dropdown-trigger<%= typeof triggerStyleClasses !== 'undefined' ? ' ' + triggerStyleClasses.join(' ') : '' %>" tabindex="0" aria-expanded="false" aria-controls="<%= typeof menuId !== 'undefined' ? menuId : 'dropdown-menu' %>" aria-haspopup="true" popovertarget="<%= typeof menuId !== 'undefined' ? menuId : 'dropdown-menu' %>">
+        <button role="button" class="dropdown-trigger<%= typeof triggerStyleClasses !== 'undefined' ? ' ' + triggerStyleClasses.join(' ') : '' %>" tabindex="0" aria-expanded="false" aria-controls="<%= typeof menuId !== 'undefined' ? menuId : 'dropdown-menu' %>" aria-haspopup="true" popovertarget="<%= typeof menuId !== 'undefined' ? menuId : 'dropdown-menu' %>">
             <slot name="dropdown-trigger"></slot>
             
             <% 
@@ -75,7 +75,7 @@
                 <%# <i class="fas fa-chevron-down" aria-hidden="true"></i> %>
                 <%- chevronSvg %>
             <% } %>
-        </div>
+        </button>
         <div id="<%= typeof menuId !== 'undefined' ? menuId : 'dropdown-menu' %>" class="dropdown-menu<%= typeof menuStyleClasses !== 'undefined' ? ' ' + menuStyleClasses.join(' ') : '' %>"<%# hidden%> popover>
             <slot name="dropdown-menu"></slot>
         </div>
diff --git a/src/components/dropdown/dropdown.mjs b/src/components/dropdown/dropdown.mjs
index 1336823..7efbfdb 100644
--- a/src/components/dropdown/dropdown.mjs
+++ b/src/components/dropdown/dropdown.mjs
@@ -41,6 +41,8 @@ export class Dropdown extends ComposableElement {
 
         event.preventDefault();
 
+        console.log(`Dropdown keydown: ${event.key}`);
+
         const focusableItems = Array.from(this.querySelectorAll('li'));
 
         if (focusableItems.length === 0) {
@@ -146,7 +148,7 @@ export class Dropdown extends ComposableElement {
         shadow.appendChild(cssAnchorPolyfill);
 
         // Create the trigger div for the dropdown component
-        const dropdownTriggerDiv = document.createElement('div');
+        const dropdownTriggerDiv = document.createElement('button');
         dropdownTriggerDiv.role = 'button';
         dropdownTriggerDiv.tabIndex = 0;
         dropdownTriggerDiv.setAttribute('aria-expanded', 'false');