fix(gropdown-content.templ): id and aria-labelledby

indaco · May 7, 2024 · c6f1348 · c6f1348
1 parent 027d65e
commit c6f1348
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 33 deletions.
diff --git a/gropdown-content.templ b/gropdown-content.templ
@@ -2,10 +2,8 @@ package gropdown
 
 templ Content() {
 	<ul
-		id={ menuId("dropdown.Button.Label") }
 		role="menu"
 		class="gdd_content"
-		aria-labelledby={ buttonId("dropdown.Button.Label") }
 		data-state="close"
 	>
 		{ children... }

diff --git a/gropdown-content_templ.go b/gropdown-content_templ.go
diff --git a/gropdown-js.templ b/gropdown-js.templ
@@ -452,6 +452,11 @@ script GropdownJS(configMap *ConfigMap) {
 
     const dropdownBtn = node.querySelector(".gdd_button")
     if (dropdownBtn != null && options?.enabled) {
+      const dropdownBtnLabel = dropdownBtn.getAttribute("aria-label").toLowerCase()
+      const menuNode = node.querySelector('[role="menu"]')
+      menuNode.setAttribute("id", `dropdown-menu-${dropdownBtnLabel}`)
+      menuNode.setAttribute("aria-labelledby", `dropdown-button-${dropdownBtnLabel}`)
+
       initialize()
       node.addEventListener('click', onButtonClick)
       node.addEventListener('keydown', onButtonKeydown)

diff --git a/gropdown-js_templ.go b/gropdown-js_templ.go