⬅️ Back to Table of Contents

📄 directive.ts

📊 Analysis Summary

Metric	Count
🔧 Functions	1
📦 Imports	4
📊 Variables & Constants	1
🟢 Vue Composition API	1

📚 Table of Contents

• Imports
• Variables & Constants
• Vue Composition API
• Functions

🛠️ File Location:

📂 packages/core/useScrollLock/directive.ts

📦 Imports

Name	Source
FunctionDirective	vue
shallowRef	vue
watch	vue
useScrollLock	./index

---

Variables & Constants

Name	Type	Kind	Value	Exported
isMounted	boolean	let/var	false	✗

---

Vue Composition API

Name	Type	Reactive Variables	Composables
watch	watch	none	none

---

Functions

`onScrollLock(): FunctionDirective<

HTMLElement, boolean

`

Code

function onScrollLock(): FunctionDirective<
  HTMLElement,
  boolean
> {
  let isMounted = false
  const state = shallowRef(false)
  return (el, binding) => {
    state.value = binding.value
    if (isMounted)
      return
    isMounted = true
    const isLocked = useScrollLock(el, binding.value)
    watch(state, v => isLocked.value = v)
  }
}

• Return Type: `FunctionDirective< HTMLElement, boolean

  `

• Calls:
• shallowRef (from vue)
• useScrollLock (from ./index)
• watch (from vue)

---