@y14e/menu 1.5.5 → 1.5.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/README.md +5 -5
  2. package/dist/index.cjs +17 -33
  3. package/dist/index.d.cts +1 -1
  4. package/dist/index.d.ts +1 -1
  5. package/dist/index.js +17 -33
  6. package/package.json +1 -1
package/README.md CHANGED
@@ -10,16 +10,16 @@ npm i @y14e/menu
10
10
 
11
11
  ```ts
12
12
  // npm
13
- import Menu from '@y14e/menu@1.5.5';
13
+ import Menu from '@y14e/menu@1.5.6';
14
14
  // with middleware
15
- import Menu, { flip, offset, shift } from '@y14e/menu@1.5.5';
15
+ import Menu, { flip, offset, shift } from '@y14e/menu@1.5.6';
16
16
 
17
17
  // CDNs
18
- import Menu from 'https://esm.sh/@y14e/menu@1.5.5';
18
+ import Menu from 'https://esm.sh/@y14e/menu@1.5.6';
19
19
  // or
20
- import Menu from 'https://cdn.jsdelivr.net/npm/@y14e/menu@1.5.5/+esm';
20
+ import Menu from 'https://cdn.jsdelivr.net/npm/@y14e/menu@1.5.6/+esm';
21
21
  // or
22
- import Menu from 'https://esm.unpkg.com/@y14e/menu@1.5.5';
22
+ import Menu from 'https://esm.unpkg.com/@y14e/menu@1.5.6';
23
23
  ```
24
24
 
25
25
  ## Usage
package/dist/index.cjs CHANGED
@@ -2927,40 +2927,28 @@ var Menu = class _Menu {
2927
2927
  requestAnimationFrame(() => this.#focusTrigger());
2928
2928
  return;
2929
2929
  }
2930
- if (![
2931
- "Enter",
2932
- "Escape",
2933
- " ",
2934
- "ArrowLeft",
2935
- ...this.#isMenubar ? ["ArrowRight"] : []
2936
- ].includes(key)) {
2930
+ if (!["Enter", "Escape", " ", "ArrowLeft", "ArrowRight"].includes(key)) {
2937
2931
  return;
2938
2932
  }
2939
2933
  event.preventDefault();
2940
2934
  event.stopPropagation();
2935
+ if (key === "Escape" || key === "ArrowLeft" && this.#isSubmenu) {
2936
+ this.close();
2937
+ return;
2938
+ }
2941
2939
  const active = getActiveElement4();
2942
2940
  if (!(active instanceof HTMLElement)) {
2943
2941
  return;
2944
2942
  }
2945
2943
  switch (key) {
2946
- case "Tab":
2947
- case "Escape":
2948
- this.close();
2949
- return;
2950
- case "ArrowLeft":
2951
- if (this.#isMenubar) {
2952
- this.#closeAndMoveFocus("previous");
2953
- } else if (this.#isSubmenu && this.#triggerElement) {
2954
- this.close();
2955
- }
2956
- return;
2957
- case "ArrowRight":
2958
- this.#closeAndMoveFocus("next");
2959
- return;
2960
2944
  case "Enter":
2961
2945
  case " ":
2962
2946
  active.click();
2963
- return;
2947
+ break;
2948
+ case "ArrowLeft":
2949
+ case "ArrowRight":
2950
+ this.#dispatchTriggerKeyDown(key);
2951
+ break;
2964
2952
  }
2965
2953
  };
2966
2954
  #onItemPointerEnter = (event) => {
@@ -3090,19 +3078,15 @@ var Menu = class _Menu {
3090
3078
  this.#submenuTimer = void 0;
3091
3079
  }
3092
3080
  }
3093
- #closeAndMoveFocus(direction) {
3094
- this.close();
3095
- requestAnimationFrame(
3096
- () => this.#getTrigger()?.dispatchEvent(
3097
- new KeyboardEvent("keydown", {
3098
- key: direction === "previous" ? "ArrowLeft" : "ArrowRight"
3099
- })
3100
- )
3101
- );
3102
- }
3103
3081
  #containsRoot(element) {
3104
3082
  return this.#rootElement.contains(element) || !!this.#listElement?.contains(element);
3105
3083
  }
3084
+ #dispatchTriggerKeyDown(key) {
3085
+ this.#isMenubar && this.close();
3086
+ requestAnimationFrame(
3087
+ () => this.#getTrigger()?.dispatchEvent(new KeyboardEvent("keydown", { key }))
3088
+ );
3089
+ }
3106
3090
  #focusTrigger() {
3107
3091
  const active = getActiveElement4();
3108
3092
  if (!(active instanceof HTMLElement)) {
@@ -3266,7 +3250,7 @@ function isFocusable3(element) {
3266
3250
  * WAI-ARIA compliant menu (menu button) pattern implementation in TypeScript.
3267
3251
  * Supports checkbox item, radio item, and infinitely nested menus.
3268
3252
  *
3269
- * @version 1.5.5
3253
+ * @version 1.5.6
3270
3254
  * @author Yusuke Kamiyamane
3271
3255
  * @license MIT
3272
3256
  * @copyright Copyright (c) Yusuke Kamiyamane
package/dist/index.d.cts CHANGED
@@ -6,7 +6,7 @@ export { flip, offset, shift } from '@floating-ui/dom';
6
6
  * WAI-ARIA compliant menu (menu button) pattern implementation in TypeScript.
7
7
  * Supports checkbox item, radio item, and infinitely nested menus.
8
8
  *
9
- * @version 1.5.5
9
+ * @version 1.5.6
10
10
  * @author Yusuke Kamiyamane
11
11
  * @license MIT
12
12
  * @copyright Copyright (c) Yusuke Kamiyamane
package/dist/index.d.ts CHANGED
@@ -6,7 +6,7 @@ export { flip, offset, shift } from '@floating-ui/dom';
6
6
  * WAI-ARIA compliant menu (menu button) pattern implementation in TypeScript.
7
7
  * Supports checkbox item, radio item, and infinitely nested menus.
8
8
  *
9
- * @version 1.5.5
9
+ * @version 1.5.6
10
10
  * @author Yusuke Kamiyamane
11
11
  * @license MIT
12
12
  * @copyright Copyright (c) Yusuke Kamiyamane
package/dist/index.js CHANGED
@@ -2923,40 +2923,28 @@ var Menu = class _Menu {
2923
2923
  requestAnimationFrame(() => this.#focusTrigger());
2924
2924
  return;
2925
2925
  }
2926
- if (![
2927
- "Enter",
2928
- "Escape",
2929
- " ",
2930
- "ArrowLeft",
2931
- ...this.#isMenubar ? ["ArrowRight"] : []
2932
- ].includes(key)) {
2926
+ if (!["Enter", "Escape", " ", "ArrowLeft", "ArrowRight"].includes(key)) {
2933
2927
  return;
2934
2928
  }
2935
2929
  event.preventDefault();
2936
2930
  event.stopPropagation();
2931
+ if (key === "Escape" || key === "ArrowLeft" && this.#isSubmenu) {
2932
+ this.close();
2933
+ return;
2934
+ }
2937
2935
  const active = getActiveElement4();
2938
2936
  if (!(active instanceof HTMLElement)) {
2939
2937
  return;
2940
2938
  }
2941
2939
  switch (key) {
2942
- case "Tab":
2943
- case "Escape":
2944
- this.close();
2945
- return;
2946
- case "ArrowLeft":
2947
- if (this.#isMenubar) {
2948
- this.#closeAndMoveFocus("previous");
2949
- } else if (this.#isSubmenu && this.#triggerElement) {
2950
- this.close();
2951
- }
2952
- return;
2953
- case "ArrowRight":
2954
- this.#closeAndMoveFocus("next");
2955
- return;
2956
2940
  case "Enter":
2957
2941
  case " ":
2958
2942
  active.click();
2959
- return;
2943
+ break;
2944
+ case "ArrowLeft":
2945
+ case "ArrowRight":
2946
+ this.#dispatchTriggerKeyDown(key);
2947
+ break;
2960
2948
  }
2961
2949
  };
2962
2950
  #onItemPointerEnter = (event) => {
@@ -3086,19 +3074,15 @@ var Menu = class _Menu {
3086
3074
  this.#submenuTimer = void 0;
3087
3075
  }
3088
3076
  }
3089
- #closeAndMoveFocus(direction) {
3090
- this.close();
3091
- requestAnimationFrame(
3092
- () => this.#getTrigger()?.dispatchEvent(
3093
- new KeyboardEvent("keydown", {
3094
- key: direction === "previous" ? "ArrowLeft" : "ArrowRight"
3095
- })
3096
- )
3097
- );
3098
- }
3099
3077
  #containsRoot(element) {
3100
3078
  return this.#rootElement.contains(element) || !!this.#listElement?.contains(element);
3101
3079
  }
3080
+ #dispatchTriggerKeyDown(key) {
3081
+ this.#isMenubar && this.close();
3082
+ requestAnimationFrame(
3083
+ () => this.#getTrigger()?.dispatchEvent(new KeyboardEvent("keydown", { key }))
3084
+ );
3085
+ }
3102
3086
  #focusTrigger() {
3103
3087
  const active = getActiveElement4();
3104
3088
  if (!(active instanceof HTMLElement)) {
@@ -3262,7 +3246,7 @@ function isFocusable3(element) {
3262
3246
  * WAI-ARIA compliant menu (menu button) pattern implementation in TypeScript.
3263
3247
  * Supports checkbox item, radio item, and infinitely nested menus.
3264
3248
  *
3265
- * @version 1.5.5
3249
+ * @version 1.5.6
3266
3250
  * @author Yusuke Kamiyamane
3267
3251
  * @license MIT
3268
3252
  * @copyright Copyright (c) Yusuke Kamiyamane
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@y14e/menu",
3
- "version": "1.5.5",
3
+ "version": "1.5.6",
4
4
  "description": "WAI-ARIA compliant menu (menu button) pattern implementation in TypeScript",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",