aria-ease 2.8.0 → 2.8.2

package/dist/src/block/index.js

@@ -1,7 +1,6 @@
-import { handleKeyPress } from '../chunk-DF4OR64G.js';
+import { handleKeyPress } from '../chunk-TBJ6MIC7.js';
 
 // src/block/src/makeBlockAccessible/makeBlockAccessible.ts
-var eventListenersMap = /* @__PURE__ */ new Map();
 function makeBlockAccessible(blockId, blockItemsClass) {
   const blockDiv = document.querySelector(`#${blockId}`);
   if (!blockDiv) {
@@ -9,12 +8,20 @@ function makeBlockAccessible(blockId, blockItemsClass) {
     return { cleanup: () => {
     } };
   }
-  const blockItems = blockDiv.querySelectorAll(`.${blockItemsClass}`);
+  let cachedItems = null;
+  function getItems() {
+    if (!cachedItems) {
+      cachedItems = blockDiv.querySelectorAll(`.${blockItemsClass}`);
+    }
+    return cachedItems;
+  }
+  const blockItems = getItems();
   if (!blockItems || blockItems.length === 0) {
     console.error(`[aria-ease] Element with class="${blockItemsClass}" not found. Make sure the block items exist before calling makeBlockAccessible.`);
     return { cleanup: () => {
     } };
   }
+  const eventListenersMap = /* @__PURE__ */ new Map();
   blockItems.forEach((blockItem) => {
     if (!eventListenersMap.has(blockItem)) {
       const handler = (event) => {
@@ -35,9 +42,10 @@ function makeBlockAccessible(blockId, blockItemsClass) {
       }
     });
   }
-  return { cleanup };
+  function refresh() {
+    cachedItems = null;
+  }
+  return { cleanup, refresh };
 }
 
 export { makeBlockAccessible };
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map

package/dist/src/checkbox/index.cjs

@@ -32,5 +32,3 @@ function updateCheckboxAriaAttributes(checkboxId, checkboxesClass, checkboxState
 }
 
 exports.updateCheckboxAriaAttributes = updateCheckboxAriaAttributes;
-//# sourceMappingURL=index.cjs.map
-//# sourceMappingURL=index.cjs.map

package/dist/src/checkbox/index.d.cts

@@ -1,4 +1,4 @@
-import { C as CheckboxStates } from '../Types.d-BbztRe-S.cjs';
+import { C as CheckboxStates } from '../Types.d-w1KLKLcA.cjs';
 
 /**
  * Adds screen reader accessibility to multiple checkboxes. Updates the aria attributes of the checkboxes. Checkbox elements must possess the following aria attributes; aria-checked and aria-label.

package/dist/src/checkbox/index.d.ts

@@ -1,4 +1,4 @@
-import { C as CheckboxStates } from '../Types.d-BbztRe-S.js';
+import { C as CheckboxStates } from '../Types.d-w1KLKLcA.js';
 
 /**
  * Adds screen reader accessibility to multiple checkboxes. Updates the aria attributes of the checkboxes. Checkbox elements must possess the following aria attributes; aria-checked and aria-label.

package/dist/src/checkbox/index.js

@@ -30,5 +30,3 @@ function updateCheckboxAriaAttributes(checkboxId, checkboxesClass, checkboxState
 }
 
 export { updateCheckboxAriaAttributes };
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map

package/dist/src/{chunk-DF4OR64G.js → chunk-TBJ6MIC7.js}

@@ -119,5 +119,3 @@ function handleKeyPress(event, elementItems, elementItemIndex, menuElementDiv, t
 }
 
 export { handleKeyPress };
-//# sourceMappingURL=chunk-DF4OR64G.js.map
-//# sourceMappingURL=chunk-DF4OR64G.js.map

package/dist/src/menu/index.cjs

@@ -138,7 +138,14 @@ function makeMenuAccessible({ menuId, menuItemsClass, triggerId }) {
     }, cleanup: () => {
     } };
   }
-  const handlerMap = /* @__PURE__ */ new Map();
+  if (!/^[\w-]+$/.test(menuId)) {
+    console.error("[aria-ease] Invalid menuId: must be alphanumeric");
+    return { openMenu: () => {
+    }, closeMenu: () => {
+    }, cleanup: () => {
+    } };
+  }
+  const handlerMap = /* @__PURE__ */ new WeakMap();
   const submenuInstances = /* @__PURE__ */ new Map();
   let cachedItems = null;
   let filteredItems = null;
@@ -257,7 +264,7 @@ function makeMenuAccessible({ menuId, menuItemsClass, triggerId }) {
     setAria(true);
     const items = getFilteredItems();
     addListeners();
-    if (items.length > 0) {
+    if (items && items.length > 0) {
       items[0].focus();
     }
   }
@@ -282,5 +289,3 @@ function makeMenuAccessible({ menuId, menuItemsClass, triggerId }) {
 }
 
 exports.makeMenuAccessible = makeMenuAccessible;
-//# sourceMappingURL=index.cjs.map
-//# sourceMappingURL=index.cjs.map

package/dist/src/menu/index.d.cts

@@ -1,23 +1,16 @@
+import { a as AccessibilityInstance } from '../Types.d-w1KLKLcA.cjs';
+
 /**
   * Adds keyboard interaction to toggle menu. The menu traps focus and can be interacted with using the keyboard. The first interactive item of the menu has focus when menu open.
   * @param {string} menuId - The id of the menu.
   * @param {string} menuItemsClass - The class of the items that are children of the menu.
   * @param {string} triggerId - The id of the button that triggers the menu.
 */
+
 declare function makeMenuAccessible({ menuId, menuItemsClass, triggerId }: {
     menuId: string;
     menuItemsClass: string;
     triggerId: string;
-}): {
-    openMenu: () => void;
-    closeMenu: () => void;
-    cleanup: () => void;
-    refresh?: undefined;
-} | {
-    openMenu: () => void;
-    closeMenu: () => void;
-    cleanup: () => void;
-    refresh: () => void;
-};
+}): AccessibilityInstance;
 
 export { makeMenuAccessible };

package/dist/src/menu/index.d.ts

@@ -1,23 +1,16 @@
+import { a as AccessibilityInstance } from '../Types.d-w1KLKLcA.js';
+
 /**
   * Adds keyboard interaction to toggle menu. The menu traps focus and can be interacted with using the keyboard. The first interactive item of the menu has focus when menu open.
   * @param {string} menuId - The id of the menu.
   * @param {string} menuItemsClass - The class of the items that are children of the menu.
   * @param {string} triggerId - The id of the button that triggers the menu.
 */
+
 declare function makeMenuAccessible({ menuId, menuItemsClass, triggerId }: {
     menuId: string;
     menuItemsClass: string;
     triggerId: string;
-}): {
-    openMenu: () => void;
-    closeMenu: () => void;
-    cleanup: () => void;
-    refresh?: undefined;
-} | {
-    openMenu: () => void;
-    closeMenu: () => void;
-    cleanup: () => void;
-    refresh: () => void;
-};
+}): AccessibilityInstance;
 
 export { makeMenuAccessible };

package/dist/src/menu/index.js

@@ -1,4 +1,4 @@
-import { handleKeyPress } from '../chunk-DF4OR64G.js';
+import { handleKeyPress } from '../chunk-TBJ6MIC7.js';
 
 // src/menu/src/makeMenuAccessible/makeMenuAccessible.ts
 function makeMenuAccessible({ menuId, menuItemsClass, triggerId }) {
@@ -18,7 +18,14 @@ function makeMenuAccessible({ menuId, menuItemsClass, triggerId }) {
     }, cleanup: () => {
     } };
   }
-  const handlerMap = /* @__PURE__ */ new Map();
+  if (!/^[\w-]+$/.test(menuId)) {
+    console.error("[aria-ease] Invalid menuId: must be alphanumeric");
+    return { openMenu: () => {
+    }, closeMenu: () => {
+    }, cleanup: () => {
+    } };
+  }
+  const handlerMap = /* @__PURE__ */ new WeakMap();
   const submenuInstances = /* @__PURE__ */ new Map();
   let cachedItems = null;
   let filteredItems = null;
@@ -137,7 +144,7 @@ function makeMenuAccessible({ menuId, menuItemsClass, triggerId }) {
     setAria(true);
     const items = getFilteredItems();
     addListeners();
-    if (items.length > 0) {
+    if (items && items.length > 0) {
       items[0].focus();
     }
   }
@@ -162,5 +169,3 @@ function makeMenuAccessible({ menuId, menuItemsClass, triggerId }) {
 }
 
 export { makeMenuAccessible };
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map

package/dist/src/radio/index.cjs

@@ -31,5 +31,3 @@ function updateRadioAriaAttributes(radioId, radiosClass, radioStates, currentPre
 }
 
 exports.updateRadioAriaAttributes = updateRadioAriaAttributes;
-//# sourceMappingURL=index.cjs.map
-//# sourceMappingURL=index.cjs.map

package/dist/src/radio/index.d.cts

@@ -1,4 +1,4 @@
-import { R as RadioStates } from '../Types.d-BbztRe-S.cjs';
+import { R as RadioStates } from '../Types.d-w1KLKLcA.cjs';
 
 /**
  * Adds screen reader accessibility to multiple radio buttons. Updates the aria attributes of the radio buttons. Radio elements must possess the following aria attributes; aria-checked and aria-label.

package/dist/src/radio/index.d.ts

@@ -1,4 +1,4 @@
-import { R as RadioStates } from '../Types.d-BbztRe-S.js';
+import { R as RadioStates } from '../Types.d-w1KLKLcA.js';
 
 /**
  * Adds screen reader accessibility to multiple radio buttons. Updates the aria attributes of the radio buttons. Radio elements must possess the following aria attributes; aria-checked and aria-label.

package/dist/src/radio/index.js

@@ -29,5 +29,3 @@ function updateRadioAriaAttributes(radioId, radiosClass, radioStates, currentPre
 }
 
 export { updateRadioAriaAttributes };
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map

package/dist/src/toggle/index.cjs

@@ -28,5 +28,3 @@ function updateToggleAriaAttribute(toggleId, togglesClass, toggleStates, current
 }
 
 exports.updateToggleAriaAttribute = updateToggleAriaAttribute;
-//# sourceMappingURL=index.cjs.map
-//# sourceMappingURL=index.cjs.map

package/dist/src/toggle/index.d.cts

@@ -1,4 +1,4 @@
-import { T as ToggleStates } from '../Types.d-BbztRe-S.cjs';
+import { T as ToggleStates } from '../Types.d-w1KLKLcA.cjs';
 
 /**
  * Adds screen reader accessibility to toggle buttons. Updates the aria attributes of the toggle buttons. Button must be a semantic button element or a non-semantic element with a role of button, and possess the aria-pressed attribute.

package/dist/src/toggle/index.d.ts

@@ -1,4 +1,4 @@
-import { T as ToggleStates } from '../Types.d-BbztRe-S.js';
+import { T as ToggleStates } from '../Types.d-w1KLKLcA.js';
 
 /**
  * Adds screen reader accessibility to toggle buttons. Updates the aria attributes of the toggle buttons. Button must be a semantic button element or a non-semantic element with a role of button, and possess the aria-pressed attribute.

package/dist/src/toggle/index.js

@@ -26,5 +26,3 @@ function updateToggleAriaAttribute(toggleId, togglesClass, toggleStates, current
 }
 
 export { updateToggleAriaAttribute };
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map

package/dist/src/utils/test/{chunk-UAS6V5MH.js → chunk-SSBW5VAA.js}

@@ -199,5 +199,3 @@ ${"\u2550".repeat(60)}`);
 };
 
 export { ContractReporter, __commonJS, __toESM, contract_default };
-//# sourceMappingURL=chunk-UAS6V5MH.js.map
-//# sourceMappingURL=chunk-UAS6V5MH.js.map

package/dist/src/utils/test/{contractTestRunnerPlaywright-IBC4FHWK.js → contractTestRunnerPlaywright-I36Y2NHA.js}

@@ -1,4 +1,4 @@
-import { ContractReporter, contract_default } from './chunk-UAS6V5MH.js';
+import { ContractReporter, contract_default } from './chunk-SSBW5VAA.js';
 import { chromium } from 'playwright';
 import { readFileSync } from 'fs';
 
@@ -247,5 +247,3 @@ async function runContractTestsPlaywright(componentName, url) {
 }
 
 export { runContractTestsPlaywright };
-//# sourceMappingURL=contractTestRunnerPlaywright-IBC4FHWK.js.map
-//# sourceMappingURL=contractTestRunnerPlaywright-IBC4FHWK.js.map

package/dist/src/utils/test/contractTestRunnerPlaywright-YNHMLHQ2.js

@@ -0,0 +1,249 @@
+import { ContractReporter, contract_default } from './chunk-SSBW5VAA.js';
+import { chromium } from 'playwright';
+import { readFileSync } from 'fs';
+
+async function runContractTestsPlaywright(componentName, url) {
+  const reporter = new ContractReporter(true);
+  const contractTyped = contract_default;
+  const contractPath = contractTyped[componentName]?.path;
+  if (!contractPath) {
+    throw new Error(`Contract path not found for component: ${componentName}`);
+  }
+  const resolvedPath = new URL(contractPath, import.meta.url).pathname;
+  const contractData = readFileSync(resolvedPath, "utf-8");
+  const componentContract = JSON.parse(contractData);
+  const totalTests = componentContract.static[0].assertions.length + componentContract.dynamic.length;
+  reporter.start(componentName, totalTests);
+  const failures = [];
+  const passes = [];
+  let browser = null;
+  try {
+    browser = await chromium.launch({ headless: true });
+    const context = await browser.newContext();
+    const page = await context.newPage();
+    await page.goto(url, { waitUntil: "networkidle" });
+    await page.waitForSelector(componentContract.selectors.trigger, { timeout: 3e4 });
+    async function resolveRelativeTarget(selector, relative) {
+      const items = await page.locator(selector).all();
+      switch (relative) {
+        case "first":
+          return items[0];
+        case "second":
+          return items[1];
+        case "last":
+          return items[items.length - 1];
+        case "next": {
+          const currentIndex = await page.evaluate(([sel]) => {
+            const items2 = Array.from(document.querySelectorAll(sel));
+            return items2.indexOf(document.activeElement);
+          }, [selector]);
+          const nextIndex = (currentIndex + 1) % items.length;
+          return items[nextIndex];
+        }
+        case "previous": {
+          const currentIndex = await page.evaluate(([sel]) => {
+            const items2 = Array.from(document.querySelectorAll(sel));
+            return items2.indexOf(document.activeElement);
+          }, [selector]);
+          const prevIndex = (currentIndex - 1 + items.length) % items.length;
+          return items[prevIndex];
+        }
+        default:
+          return null;
+      }
+    }
+    for (const test of componentContract.static[0]?.assertions || []) {
+      if (test.target === "relative") continue;
+      const targetSelector = componentContract.selectors[test.target];
+      if (!targetSelector) {
+        failures.push(`Selector for target ${test.target} not found.`);
+        continue;
+      }
+      const target = page.locator(targetSelector).first();
+      const exists = await target.count() > 0;
+      if (!exists) {
+        failures.push(`Target ${test.target} not found.`);
+        continue;
+      }
+      if (!test.expectedValue) {
+        const attributes = test.attribute.split(" | ");
+        let hasAny = false;
+        for (const attr of attributes) {
+          const value = await target.getAttribute(attr.trim());
+          if (value !== null) {
+            hasAny = true;
+            break;
+          }
+        }
+        if (!hasAny) {
+          failures.push(test.failureMessage + ` None of the attributes "${test.attribute}" are present.`);
+        } else {
+          passes.push(`At least one of the attributes "${test.attribute}" exists on the element.`);
+        }
+      } else {
+        const attributeValue = await target.getAttribute(test.attribute);
+        const expectedValues = test.expectedValue.split(" | ");
+        if (!attributeValue || !expectedValues.includes(attributeValue)) {
+          failures.push(test.failureMessage + ` Attribute value does not match expected value. Expected: ${test.expectedValue}, Found: ${attributeValue}`);
+        } else {
+          passes.push(`Attribute value matches expected value. Expected: ${test.expectedValue}, Found: ${attributeValue}`);
+        }
+      }
+    }
+    for (const dynamicTest of componentContract.dynamic || []) {
+      const { action, assertions } = dynamicTest;
+      const failuresBeforeTest = failures.length;
+      const containerElement = page.locator(componentContract.selectors.container).first();
+      const triggerElement = page.locator(componentContract.selectors.trigger).first();
+      const isContainerVisible = await containerElement.isVisible();
+      if (isContainerVisible) {
+        await triggerElement.click();
+        await page.waitForTimeout(50);
+      }
+      for (const act of action) {
+        if (act.type === "click") {
+          if (act.target === "document") {
+            await page.mouse.click(10, 10);
+          } else {
+            const actionSelector = componentContract.selectors[act.target];
+            if (!actionSelector) {
+              failures.push(`Selector for action target ${act.target} not found.`);
+              continue;
+            }
+            await page.locator(actionSelector).first().click();
+            await page.waitForTimeout(200);
+          }
+        }
+        if (act.type === "keypress" && act.key) {
+          const keyMap = {
+            "Space": "Space",
+            "Enter": "Enter",
+            "Escape": "Escape",
+            "Arrow Up": "ArrowUp",
+            "Arrow Down": "ArrowDown",
+            "Arrow Left": "ArrowLeft",
+            "Arrow Right": "ArrowRight",
+            "Home": "Home",
+            "End": "End",
+            "Tab": "Tab"
+          };
+          let keyValue = keyMap[act.key] || act.key;
+          if (keyValue === "Space") {
+            keyValue = " ";
+          } else if (keyValue.includes(" ")) {
+            keyValue = keyValue.replace(/ /g, "");
+          }
+          if (act.target === "focusable" && ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", "Escape"].includes(keyValue)) {
+            await page.waitForTimeout(100);
+            await page.keyboard.press(keyValue);
+            await page.waitForTimeout(50);
+          } else {
+            const keypressSelector = componentContract.selectors[act.target];
+            if (!keypressSelector) {
+              failures.push(`Selector for keypress target ${act.target} not found.`);
+              continue;
+            }
+            const target = page.locator(keypressSelector).first();
+            await target.press(keyValue);
+          }
+        }
+        await page.waitForTimeout(100);
+      }
+      for (const assertion of assertions) {
+        let target;
+        if (assertion.target === "relative") {
+          const relativeSelector = componentContract.selectors.relative;
+          if (!relativeSelector) {
+            failures.push("Relative selector is not defined in the contract.");
+            continue;
+          }
+          if (!assertion.expectedValue) {
+            failures.push("Expected value for relative target is not defined.");
+            continue;
+          }
+          target = await resolveRelativeTarget(relativeSelector, assertion.expectedValue);
+        } else {
+          const assertionSelector = componentContract.selectors[assertion.target];
+          if (!assertionSelector) {
+            failures.push(`Selector for assertion target ${assertion.target} not found.`);
+            continue;
+          }
+          target = page.locator(assertionSelector).first();
+        }
+        if (!target) {
+          failures.push(`Target ${assertion.target} not found.`);
+          continue;
+        }
+        if (assertion.assertion === "toBeVisible") {
+          const isVisible = await target.isVisible();
+          if (isVisible) {
+            passes.push(`${assertion.target} is visible as expected. Test: "${dynamicTest.description}".`);
+          } else {
+            failures.push(`${assertion.failureMessage}`);
+          }
+        }
+        if (assertion.assertion === "notToBeVisible") {
+          const isVisible = await target.isVisible();
+          if (!isVisible) {
+            passes.push(`${assertion.target} is not visible as expected. Test: "${dynamicTest.description}".`);
+          } else {
+            failures.push(assertion.failureMessage + ` ${assertion.target} is still visible.`);
+          }
+        }
+        if (assertion.assertion === "toHaveAttribute" && assertion.attribute && assertion.expectedValue) {
+          const attributeValue = await target.getAttribute(assertion.attribute);
+          if (attributeValue === assertion.expectedValue) {
+            passes.push(`${assertion.target} has expected "${assertion.attribute}". Test: "${dynamicTest.description}".`);
+          } else {
+            failures.push(assertion.failureMessage + ` ${assertion.target} "${assertion.attribute}" should be "${assertion.expectedValue}", found "${attributeValue}".`);
+          }
+        }
+        if (assertion.assertion === "toHaveFocus") {
+          const hasFocus = await target.evaluate((el) => el === document.activeElement);
+          if (hasFocus) {
+            passes.push(`${assertion.target} has focus as expected. Test: "${dynamicTest.description}".`);
+          } else {
+            failures.push(`${assertion.failureMessage}`);
+          }
+        }
+        if (assertion.assertion === "toHaveRole" && assertion.expectedValue) {
+          const roleValue = await target.getAttribute("role");
+          if (roleValue === assertion.expectedValue) {
+            passes.push(`${assertion.target} has role "${assertion.expectedValue}". Test: "${dynamicTest.description}".`);
+          } else {
+            failures.push(assertion.failureMessage + ` Expected role "${assertion.expectedValue}", found "${roleValue}".`);
+          }
+        }
+      }
+      const failuresAfterTest = failures.length;
+      const testPassed = failuresAfterTest === failuresBeforeTest;
+      const failureMessage = testPassed ? void 0 : failures[failures.length - 1];
+      reporter.reportTest(dynamicTest, testPassed ? "pass" : "fail", failureMessage);
+    }
+    const staticPassed = componentContract.static[0].assertions.length;
+    const staticFailed = 0;
+    reporter.reportStatic(staticPassed, staticFailed);
+    reporter.summary(failures);
+  } catch (error) {
+    if (error instanceof Error) {
+      if (error.message.includes("Executable doesn't exist")) {
+        console.error("\n\u274C Playwright browsers not found!\n");
+        console.log("\u{1F4E6} Run: npx playwright install chromium\n");
+        failures.push("Playwright browser not installed. Run: npx playwright install chromium");
+      } else if (error.message.includes("net::ERR_CONNECTION_REFUSED")) {
+        console.error("\n\u274C Cannot connect to dev server!\n");
+        console.log(`   Make sure your dev server is running at ${url}
+`);
+        failures.push(`Dev server not running at ${url}`);
+      } else {
+        console.error("\u274C Playwright test error:", error.message);
+        failures.push(`Test error: ${error.message}`);
+      }
+    }
+  } finally {
+    if (browser) await browser.close();
+  }
+  return { passes, failures };
+}
+
+export { runContractTestsPlaywright };