@y14e/menu 1.5.0 → 1.5.1

package/README.md

@@ -10,16 +10,16 @@ npm i @y14e/menu
 
 ```ts
 // npm
-import Menu from '@y14e/menu@1.5.0';
+import Menu from '@y14e/menu@1.5.1';
 // with middleware
-import Menu, { flip, offset, shift } from '@y14e/menu@1.5.0';
+import Menu, { flip, offset, shift } from '@y14e/menu@1.5.1';
 
 // CDNs
-import Menu from 'https://esm.sh/@y14e/menu@1.5.0';
+import Menu from 'https://esm.sh/@y14e/menu@1.5.1';
 // or
-import Menu from 'https://cdn.jsdelivr.net/npm/@y14e/menu@1.5.0/+esm';
+import Menu from 'https://cdn.jsdelivr.net/npm/@y14e/menu@1.5.1/+esm';
 // or
-import Menu from 'https://esm.unpkg.com/@y14e/menu@1.5.0';
+import Menu from 'https://esm.unpkg.com/@y14e/menu@1.5.1';
 ```
 
 ## Usage

package/dist/index.cjs

@@ -2718,8 +2718,8 @@ var Menu = class _Menu {
     }
     this.#initialize();
   }
-  open(focusLastItem = false) {
-    this.#toggle(true, focusLastItem);
+  open(_initialFocus = "first") {
+    this.#toggle(true, { initialFocus: _initialFocus });
   }
   close() {
     this.#toggle(false);
@@ -2919,7 +2919,7 @@ var Menu = class _Menu {
     }
     event.preventDefault();
     event.stopPropagation();
-    this.open(key === "ArrowUp");
+    this.open(key === "ArrowDown" ? "first" : "last");
   };
   #onListKeyDown = (event) => {
     const { shiftKey, key } = event;
@@ -3000,7 +3000,7 @@ var Menu = class _Menu {
       i.setAttribute("aria-checked", String(i === item));
     });
   };
-  #toggle(isOpen, isFocusLastItem = false) {
+  #toggle(isOpen, options = {}) {
     if (this.#triggerElement?.ariaExpanded === String(isOpen)) {
       return;
     }
@@ -3025,7 +3025,8 @@ var Menu = class _Menu {
       style.setProperty("display", "block");
       style.setProperty("opacity", "0");
       this.#triggerElement && this.#updatePopover();
-      this.#itemElements.filter(isFocusable3).at(isFocusLastItem ? -1 : 0)?.focus();
+      const { initialFocus = "first" } = options;
+      this.#itemElements.filter(isFocusable3).at(initialFocus === "first" ? 0 : -1)?.focus();
     } else {
       this.#clearSubmenuTimer();
       this.#focusTrigger();
@@ -3101,7 +3102,7 @@ var Menu = class _Menu {
     );
   }
   #containsRoot(element) {
-    return this.#rootElement.contains(element) || this.#listElement?.contains(element);
+    return this.#rootElement.contains(element) || !!this.#listElement?.contains(element);
   }
   #focusTrigger() {
     const active = getActiveElement4();
@@ -3264,7 +3265,7 @@ function isFocusable3(element) {
  * WAI-ARIA compliant menu (menu button) pattern implementation in TypeScript.
  * Supports checkbox item, radio item, and infinitely nested menus.
  *
- * @version 1.5.0
+ * @version 1.5.1
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/dist/index.d.cts

@@ -6,7 +6,7 @@ export { flip, offset, shift } from '@floating-ui/dom';
  * WAI-ARIA compliant menu (menu button) pattern implementation in TypeScript.
  * Supports checkbox item, radio item, and infinitely nested menus.
  *
- * @version 1.5.0
+ * @version 1.5.1
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane
@@ -51,7 +51,11 @@ declare class Menu {
      * @internal Internal constructor
      */
     constructor(root: HTMLElement, options?: MenuOptions, _internal?: InternalOptions);
-    open(focusLastItem?: boolean): void;
+    open(): void;
+    /**
+     * @internal Internal open
+     */
+    open(_initialFocus?: 'first' | 'last'): void;
     close(): void;
     destroy(force?: boolean): Promise<void>;
 }

package/dist/index.d.ts

@@ -6,7 +6,7 @@ export { flip, offset, shift } from '@floating-ui/dom';
  * WAI-ARIA compliant menu (menu button) pattern implementation in TypeScript.
  * Supports checkbox item, radio item, and infinitely nested menus.
  *
- * @version 1.5.0
+ * @version 1.5.1
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane
@@ -51,7 +51,11 @@ declare class Menu {
      * @internal Internal constructor
      */
     constructor(root: HTMLElement, options?: MenuOptions, _internal?: InternalOptions);
-    open(focusLastItem?: boolean): void;
+    open(): void;
+    /**
+     * @internal Internal open
+     */
+    open(_initialFocus?: 'first' | 'last'): void;
     close(): void;
     destroy(force?: boolean): Promise<void>;
 }

package/dist/index.js

@@ -2714,8 +2714,8 @@ var Menu = class _Menu {
     }
     this.#initialize();
   }
-  open(focusLastItem = false) {
-    this.#toggle(true, focusLastItem);
+  open(_initialFocus = "first") {
+    this.#toggle(true, { initialFocus: _initialFocus });
   }
   close() {
     this.#toggle(false);
@@ -2915,7 +2915,7 @@ var Menu = class _Menu {
     }
     event.preventDefault();
     event.stopPropagation();
-    this.open(key === "ArrowUp");
+    this.open(key === "ArrowDown" ? "first" : "last");
   };
   #onListKeyDown = (event) => {
     const { shiftKey, key } = event;
@@ -2996,7 +2996,7 @@ var Menu = class _Menu {
       i.setAttribute("aria-checked", String(i === item));
     });
   };
-  #toggle(isOpen, isFocusLastItem = false) {
+  #toggle(isOpen, options = {}) {
     if (this.#triggerElement?.ariaExpanded === String(isOpen)) {
       return;
     }
@@ -3021,7 +3021,8 @@ var Menu = class _Menu {
       style.setProperty("display", "block");
       style.setProperty("opacity", "0");
       this.#triggerElement && this.#updatePopover();
-      this.#itemElements.filter(isFocusable3).at(isFocusLastItem ? -1 : 0)?.focus();
+      const { initialFocus = "first" } = options;
+      this.#itemElements.filter(isFocusable3).at(initialFocus === "first" ? 0 : -1)?.focus();
     } else {
       this.#clearSubmenuTimer();
       this.#focusTrigger();
@@ -3097,7 +3098,7 @@ var Menu = class _Menu {
     );
   }
   #containsRoot(element) {
-    return this.#rootElement.contains(element) || this.#listElement?.contains(element);
+    return this.#rootElement.contains(element) || !!this.#listElement?.contains(element);
   }
   #focusTrigger() {
     const active = getActiveElement4();
@@ -3260,7 +3261,7 @@ function isFocusable3(element) {
  * WAI-ARIA compliant menu (menu button) pattern implementation in TypeScript.
  * Supports checkbox item, radio item, and infinitely nested menus.
  *
- * @version 1.5.0
+ * @version 1.5.1
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@y14e/menu",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "WAI-ARIA compliant menu (menu button) pattern implementation in TypeScript",
   "type": "module",
   "main": "./dist/index.cjs",