feat: add aiming expiration delay

Akryum · Mar 23, 2022 · 01ef6f8 · towry · Nov 7, 2023 · towry
1 parent f06366c
commit 01ef6f8
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 0 deletions.
diff --git a/packages/docs/src/guide/component.md b/packages/docs/src/guide/component.md
@@ -278,6 +278,8 @@ Floating Vue will automatically fix the [diagonal submenu problem](https://www.g
   <img alt="popper aim debug example" src="./popper-aim.png" class="border border-gray-200 rounded">
 </div>
 
+After a one second delay, the lock applied because of aiming will expire.
+
 ## Disable popper
 
 Disabling a popper will prevent it from being shown.

diff --git a/packages/floating-vue/src/components/Popper.ts b/packages/floating-vue/src/components/Popper.ts
@@ -392,6 +392,10 @@ export default () => ({
 
       this.$_pendingHide = false
       if (force || !this.disabled) {
+        if (this.parentPopper?.lockedChild === this) {
+          this.parentPopper.lockedChild = null
+        }
+
         this.$_scheduleShow(event, skipDelay)
         this.$emit('show')
 
@@ -417,6 +421,13 @@ export default () => ({
       if (this.$_isAimingPopper()) {
         if (this.parentPopper) {
           this.parentPopper.lockedChild = this
+          clearTimeout(this.parentPopper.lockedChildTimer)
+          this.parentPopper.lockedChildTimer = setTimeout(() => {
+            if (this.parentPopper.lockedChild === this) {
+              this.parentPopper.lockedChild.hide({ skipDelay })
+              this.parentPopper.lockedChild = null
+            }
+          }, 1000)
         }
         return
       }