top menu removed jquery

_dev/js/theme/components/useTopMenu.js

@@ -0,0 +1,46 @@
+import useEvent from './event/useEvent';
+
+const useTopMenu = (selector) => {
+  const { on, off } = useEvent();
+  const menuElement = document.querySelector(selector);
+  const DOM_SELECTORS = {
+    SUB_ELEMENTS: '.main-menu__item--top',
+    SUB_MENU: '.main-menu__sub',
+  };
+  const ITEM_ACTIVE = 'main-menu__item--active';
+
+
+  const toggleSubMenu = (e) => {
+    const { currentTarget } = e;
+    const { SUB_MENU } = DOM_SELECTORS;
+    const expanded = currentTarget.getAttribute('aria-expanded');
+    const isExpanded = expanded && expanded.toLowerCase() === 'true';
+    const subMenu = currentTarget.querySelector(SUB_MENU);
+
+    currentTarget.classList.toggle(ITEM_ACTIVE);
+
+    if (subMenu) {
+      currentTarget.setAttribute('aria-expanded', !isExpanded);
+
+      subMenu.setAttribute('aria-hidden', isExpanded);
+      subMenu.setAttribute('aria-expanded', !isExpanded);
+
+    }
+  }
+
+  const init = () => {
+    debugger
+    const { SUB_ELEMENTS } = DOM_SELECTORS;
+
+    off(menuElement, 'mouseenter', SUB_ELEMENTS, toggleSubMenu);
+    off(menuElement, 'mouseleave', SUB_ELEMENTS, toggleSubMenu);
+    on(menuElement, 'mouseenter', SUB_ELEMENTS, toggleSubMenu);
+    on(menuElement, 'mouseleave', SUB_ELEMENTS, toggleSubMenu);
+  }
+
+  return {
+    init
+  }
+}
+
+export default useTopMenu;

_dev/js/theme/index.js

@@ -5,16 +5,14 @@ import EventEmitter from 'events';
 import '@js/theme/core';
 
 import '@js/theme/vendors/bootstrap/bootstrap-imports';
-import 'bootstrap-touchspin';
-import 'jquery-hoverintent';
 import '@js/theme/components/dynamic-bootstrap-components';
 import bsCustomFileInput from 'bs-custom-file-input';
 import '@js/theme/components/sliders';
 import '@js/theme/components/responsive';
 import '@js/theme/components/customer';
 import '@js/theme/components/quickview';
 import '@js/theme/components/product';
-import '@js/theme/components/cart/block-cart';
+import useTopMenu from './components/useTopMenu';
 /* eslint-enable */
 
 import prestashop from 'prestashop';
@@ -26,7 +24,6 @@ for (const i in EventEmitter.prototype) {
 }
 import usePasswordPolicy from '@js/theme/components/password/usePasswordPolicy';
 import Form from '@js/theme/components/form';
-import TopMenu from '@js/theme/components/TopMenu';
 import PageLazyLoad from '@js/theme/components/Lazyload';
 import PageLoader from '@js/theme/components/PageLoader';
 import useStickyElement from '@js/theme/components/useStickyElement';
@@ -61,14 +58,14 @@ function initStickyHeader() {
 }
 
 $(() => {
+  const { init: initTopMenu } = useTopMenu('.js-main-menu');
+
   initStickyHeader();
   accLinksTriggerActive();
   Form.init();
   bsCustomFileInput.init();
-  const topMenu = new TopMenu('#_desktop_top_menu .js-main-menu');
   usePasswordPolicy('.field-password-policy');
-
-  topMenu.init();
+  initTopMenu();
 
   $('.js-select-link').on('change', ({ target }) => {
     window.location.href = $(target).val();