@brillout/docpress 0.10.0 → 0.10.1

package/Layout.tsx

@@ -13,7 +13,7 @@ import { EditPageNote } from './components/EditPageNote'
 import { parseTitle } from './parseTitle'
 import { usePageContext, usePageContext2 } from './renderer/usePageContext'
 import { NavSecondaryContent } from './NavSecondaryContent'
-import { closeMenuModalWithDelay, openMenuModal, toggleMenuModal } from './MenuModal/toggleMenuModal'
+import { closeMenuOnMouseLeave, openMenuModal, toggleMenuModal } from './MenuModal/toggleMenuModal'
 import { MenuModal } from './MenuModal'
 import { autoScrollNav_SSR } from './autoScrollNav'
 import { SearchLink } from './docsearch/SearchLink'
@@ -563,7 +563,7 @@ function MenuToggle({ menuId, ...props }: PropsDiv & { menuId: number }) {
       }}
       onMouseLeave={() => {
         if (onMouseIgnore) return
-        closeMenuModalWithDelay()
+        closeMenuOnMouseLeave()
       }}
       onTouchStart={() => {
         onMouseIgnore = setTimeout(() => {

package/MenuModal/toggleMenuModal.ts

@@ -1,7 +1,8 @@
 export { toggleMenuModal }
 export { openMenuModal }
+export { keepMenuModalOpen }
 export { closeMenuModal }
-export { closeMenuModalWithDelay }
+export { closeMenuOnMouseLeave }
 export { addListenerOpenMenuModal }
 
 import { containerQueryMobileLayout } from '../Layout'
@@ -10,8 +11,14 @@ import { isBrowser } from '../utils/isBrowser'
 
 initScrollListener()
 
-function openMenuModal(menuNavigationId?: number) {
-  if (openIsForbidden) return
+function keepMenuModalOpen() {
+  if (keepOpenIsDisabled) return
+  open()
+}
+function openMenuModal(menuNavigationId: number) {
+  open(menuNavigationId)
+}
+function open(menuNavigationId?: number) {
   if (menuModalLock) {
     if (menuNavigationId === undefined) {
       clearTimeout(menuModalLock?.timeout)
@@ -40,14 +47,14 @@ function addListenerOpenMenuModal(cb: () => void) {
 function closeMenuModal() {
   document.documentElement.classList.remove('menu-modal-show')
 }
-let openIsForbidden: true | undefined
-function closeMenuModalAndBlock() {
+let keepOpenIsDisabled: true | undefined
+function closeAndForbidKeepOpen() {
   if (!document.documentElement.classList.contains('menu-modal-show')) return
-  openIsForbidden = true
+  keepOpenIsDisabled = true
   closeMenuModal()
   setTimeout(() => {
-    openIsForbidden = undefined
-  }, 430)
+    keepOpenIsDisabled = undefined
+  }, 500)
 }
 
 let menuModalLock:
@@ -57,7 +64,7 @@ let menuModalLock:
       timeout: NodeJS.Timeout
     }
   | undefined
-function closeMenuModalWithDelay() {
+function closeMenuOnMouseLeave() {
   const currentModalId = getCurrentMenuId()
   if (currentModalId === null) return
   const timeout = setTimeout(() => {
@@ -65,7 +72,7 @@ function closeMenuModalWithDelay() {
     menuModalLock = undefined
     if (idNext === idCurrent) return
     if (idNext === undefined) {
-      closeMenuModal()
+      closeAndForbidKeepOpen()
     } else {
       openMenuModal(idNext)
     }
@@ -87,18 +94,11 @@ function getCurrentMenuId(): null | number {
 
 function initScrollListener() {
   if (!isBrowser()) return
-  window.addEventListener('scroll', closeMenuModalAndBlock, { passive: true })
-  window.addEventListener(
-    'mousemove',
-    () => {
-      openIsForbidden = undefined
-    },
-    { passive: true },
-  )
+  window.addEventListener('scroll', closeAndForbidKeepOpen, { passive: true })
 }
 
 function toggleMenuModal(menuId: number) {
-  openIsForbidden = undefined
+  keepOpenIsDisabled = undefined
   const { classList } = document.documentElement
   if (classList.contains('menu-modal-show') && classList.contains(`menu-modal-show-${menuId}`)) {
     closeMenuModal()

package/MenuModal.tsx

@@ -7,7 +7,7 @@ import { blockMargin, containerQueryMobileLayout, containerQueryMobileMenu } fro
 import { NavSecondaryContent } from './NavSecondaryContent'
 import { Style } from './utils/Style'
 import { NavigationWithColumnLayout } from './MenuModal/NavigationWithColumnLayout'
-import { addListenerOpenMenuModal, closeMenuModal, openMenuModal } from './MenuModal/toggleMenuModal'
+import { addListenerOpenMenuModal, closeMenuModal, keepMenuModalOpen } from './MenuModal/toggleMenuModal'
 
 function MenuModal({ isTopNav }: { isTopNav: boolean }) {
   const ref = useRef<HTMLDivElement>(null)
@@ -43,7 +43,7 @@ function MenuModal({ isTopNav }: { isTopNav: boolean }) {
           height,
         }}
         ref={ref}
-        onMouseOver={() => openMenuModal()}
+        onMouseOver={() => keepMenuModalOpen()}
         onMouseLeave={closeMenuModal}
       >
         <div

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brillout/docpress",
-  "version": "0.10.0",
+  "version": "0.10.1",
   "type": "module",
   "dependencies": {
     "@brillout/picocolors": "^1.0.10",