⬅️ Back to Table of Contents

📄 directive.ts

📊 Analysis Summary

Metric	Count
🔧 Functions	2
📦 Imports	5
📊 Variables & Constants	4
📑 Type Aliases	1

📚 Table of Contents

• Imports
• Variables & Constants
• Functions
• Type Aliases

🛠️ File Location:

📂 packages/core/onClickOutside/directive.ts

📦 Imports

Name	Source
Fn	@vueuse/shared
ObjectDirective	vue
OnClickOutsideHandler	./index
OnClickOutsideOptions	./index
onClickOutside	./index

---

Variables & Constants

Name	Type	Kind	Value	Exported
stopClickOutsideMap	WeakMap<HTMLElement, any>	const	new WeakMap<HTMLElement, StopHandle>()	✗
capture	boolean	const	!binding.modifiers.bubble	✗
stop	StopHandle	let/var	*not shown*	✗
vOnClickOutside	`ObjectDirective<
HTMLElement,
OnClickOutsideHandler	[(evt: any) => void, Omit]
>| const |{
mounted(el, binding) {
const capture = !binding.modifiers.bubble
let stop: StopHandle
if (typeof binding.value === 'function') {
stop = onClickOutside(el, binding.value, { capture })
}
else {
const [handler, options] = binding.value
stop = onClickOutside(el, handler, Object.assign({ capture }, options))
}
stopClickOutsideMap.set(el, stop)
},
unmounted(el) {
const stop = stopClickOutsideMap.get(el)
if (stop && typeof stop === 'function') {
stop()
}
else {
stop?.stop()
}
stopClickOutsideMap.delete(el)
},
}`	✓

---

Functions

mounted(el: any, binding: any): void

Code

mounted(el, binding) {
    const capture = !binding.modifiers.bubble
    let stop: StopHandle
    if (typeof binding.value === 'function') {
      stop = onClickOutside(el, binding.value, { capture })
    }
    else {
      const [handler, options] = binding.value
      stop = onClickOutside(el, handler, Object.assign({ capture }, options))
    }
    stopClickOutsideMap.set(el, stop)
  }

• Parameters:
• el: any
• binding: any
• Return Type: void
• Calls:
• onClickOutside (from ./index)
• Object.assign
• stopClickOutsideMap.set

unmounted(el: any): void

Code

unmounted(el) {
    const stop = stopClickOutsideMap.get(el)
    if (stop && typeof stop === 'function') {
      stop()
    }
    else {
      stop?.stop()
    }
    stopClickOutsideMap.delete(el)
  }

• Parameters:
• el: any
• Return Type: void
• Calls:
• stopClickOutsideMap.get
• stop
• stop?.stop
• stopClickOutsideMap.delete

---

Type Aliases

StopHandle

type StopHandle = Fn | { stop: Fn, cancel: Fn, trigger: (event: Event) => void };

---