8edeb37417575cdfc0f27fa66c423467be8dd68cb890845d3572d29a4868bcdc9d3813c9dfbd2bf78f22a2f244fc7376e09a27772218619bdde2519454979d 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. import { triggerEvent } from '../../../../utils/dom/aria.mjs';
  2. import { EVENT_CODE } from '../../../../constants/aria.mjs';
  3. class SubMenu {
  4. constructor(parent, domNode) {
  5. this.parent = parent;
  6. this.domNode = domNode;
  7. this.subIndex = 0;
  8. this.subIndex = 0;
  9. this.init();
  10. }
  11. init() {
  12. this.subMenuItems = this.domNode.querySelectorAll("li");
  13. this.addListeners();
  14. }
  15. gotoSubIndex(idx) {
  16. if (idx === this.subMenuItems.length) {
  17. idx = 0;
  18. } else if (idx < 0) {
  19. idx = this.subMenuItems.length - 1;
  20. }
  21. this.subMenuItems[idx].focus();
  22. this.subIndex = idx;
  23. }
  24. addListeners() {
  25. const parentNode = this.parent.domNode;
  26. Array.prototype.forEach.call(this.subMenuItems, (el) => {
  27. el.addEventListener("keydown", (event) => {
  28. let prevDef = false;
  29. switch (event.code) {
  30. case EVENT_CODE.down: {
  31. this.gotoSubIndex(this.subIndex + 1);
  32. prevDef = true;
  33. break;
  34. }
  35. case EVENT_CODE.up: {
  36. this.gotoSubIndex(this.subIndex - 1);
  37. prevDef = true;
  38. break;
  39. }
  40. case EVENT_CODE.tab: {
  41. triggerEvent(parentNode, "mouseleave");
  42. break;
  43. }
  44. case EVENT_CODE.enter:
  45. case EVENT_CODE.numpadEnter:
  46. case EVENT_CODE.space: {
  47. prevDef = true;
  48. event.currentTarget.click();
  49. break;
  50. }
  51. }
  52. if (prevDef) {
  53. event.preventDefault();
  54. event.stopPropagation();
  55. }
  56. return false;
  57. });
  58. });
  59. }
  60. }
  61. export { SubMenu as default };
  62. //# sourceMappingURL=submenu.mjs.map