aria-ease 1.1.7 → 1.1.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aria-ease",
-  "version": "1.1.7",
+  "version": "1.1.9",
   "description": "Out of the box utility accessibility package to develop production ready applications.",
   "main": "index.js",
   "scripts": {

package/src/menu/makeMenuAccessible.js

@@ -3,7 +3,7 @@
  * @param {string} menuId The id of the menu
  * @param {string} menuItemClass The class of the items that are children of the menu
 */
-var eventListenersAdded = false;
+var eventListenersAdded = new Set();
 export function makeMenuAccessible(menuId, menuItemClass) {
     var menuDiv = document.querySelector("#".concat(menuId));
     var menuItems = menuDiv.querySelectorAll(".".concat(menuItemClass));
@@ -11,13 +11,12 @@ export function makeMenuAccessible(menuId, menuItemClass) {
     var triggerButton = document.querySelector("#".concat(triggerId));
     menuItems.item(0).focus();
     menuItems.forEach(function (menuItem, menuItemIndex) {
-        if (!eventListenersAdded) {
+        if (!eventListenersAdded.has(menuItem)) {
+            eventListenersAdded.add(menuItem);
             menuItem.addEventListener('keydown', function (event) { return handleKeyPress(event, menuItems, menuItemIndex); });
-            eventListenersAdded = true;
         }
     });
     function handleKeyPress(event, menuItems, menuItemIndex) {
-        event.preventDefault();
         switch (event.key) {
             case 'ArrowUp':
             case 'ArrowLeft':

package/src/menu/makeMenuAccessible.ts

@@ -6,8 +6,7 @@
 
 import { HTMLElement, NodeListOfHTMLElement } from '../../Types'
 
-
-let eventListenersAdded: boolean = false
+let eventListenersAdded: Set<HTMLElement> = new Set();
 
 export function makeMenuAccessible(menuId: string, menuItemClass: string): void {
     const menuDiv: HTMLElement = document.querySelector(`#${menuId}`) as HTMLElement
@@ -18,14 +17,13 @@ export function makeMenuAccessible(menuId: string, menuItemClass: string): void
 
     menuItems.item(0).focus();
     menuItems.forEach((menuItem: HTMLElement, menuItemIndex: number): void => {
-        if(!eventListenersAdded) {
+        if (!eventListenersAdded.has(menuItem)) {
+            eventListenersAdded.add(menuItem);
             menuItem.addEventListener('keydown', (event: KeyboardEvent): void => handleKeyPress(event, menuItems, menuItemIndex))
-            eventListenersAdded = true
         }
     })
 
     function handleKeyPress(event: KeyboardEvent, menuItems: NodeListOfHTMLElement, menuItemIndex: number): void {
-        event.preventDefault()
         switch(event.key) {
             case 'ArrowUp':
             case 'ArrowLeft':

package/src/tab/makeTabAccessible.js

@@ -3,18 +3,17 @@
  * @param {string} tabId The id of the tab
  * @param {string} tabItemClass The class of the items that are children of the tab
 */
-var eventListenersAdded = false;
+var eventListenersAdded = new Set();
 export function makeTabAccessible(tabId, tabItemClass) {
     var tabDiv = document.querySelector("#".concat(tabId));
     var tabItems = tabDiv.querySelectorAll(".".concat(tabItemClass));
     tabItems.forEach(function (tabItem, tabItemIndex) {
-        if (!eventListenersAdded) {
+        if (!eventListenersAdded.has(tabItem)) {
+            eventListenersAdded.add(tabItem);
             tabItem.addEventListener('keydown', function (event) { return handleKeyPress(event, tabItems, tabItemIndex); });
-            eventListenersAdded = true;
         }
     });
     function handleKeyPress(event, tabItems, tabItemIndex) {
-        event.preventDefault();
         switch (event.key) {
             case 'ArrowUp':
             case 'ArrowLeft':

package/src/tab/makeTabAccessible.ts

@@ -6,22 +6,20 @@
 
 import { HTMLElement, NodeListOfHTMLElement } from "../../Types"
 
-
-let eventListenersAdded: boolean = false  
+let eventListenersAdded: Set<HTMLElement> = new Set();
 
 export function makeTabAccessible(tabId: string, tabItemClass: string): void {
     const tabDiv: HTMLElement = document.querySelector(`#${tabId}`) as HTMLElement
     const tabItems: NodeListOfHTMLElement = tabDiv.querySelectorAll(`.${tabItemClass}`)
 
     tabItems.forEach((tabItem: HTMLElement, tabItemIndex: number): void => {
-        if(!eventListenersAdded) {
-            tabItem.addEventListener('keydown', (event: KeyboardEvent) => handleKeyPress(event, tabItems, tabItemIndex))
-            eventListenersAdded = true
-        } 
-    })
+        if (!eventListenersAdded.has(tabItem)) {
+          eventListenersAdded.add(tabItem);
+          tabItem.addEventListener('keydown', (event: KeyboardEvent) => handleKeyPress(event, tabItems, tabItemIndex));
+        }
+      });
 
     function handleKeyPress(event: KeyboardEvent, tabItems: NodeListOfHTMLElement, tabItemIndex: number): void {
-        event.preventDefault()
         switch(event.key) {
             case 'ArrowUp':
             case 'ArrowLeft':