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
  }