overscroll-none.js

import { define } from 'wicked-elements'

define('[data-component~="overscroll-none"]', {
  init () {
    
  },
  connected () {
    if (!CSS.supports('overscroll-behavior', 'none')) {
      this.wheelingTimeout = false
      this.lock = this.lock.bind(this)
      this.unlock = this.unlock.bind(this)
      this.lockOnce = this.lockOnce.bind(this)
      this.element.addEventListener('wheel', this.lockOnce)
      this.element.addEventListener('mouseenter', this.lock)
      this.element.addEventListener('mouseleave', this.unlock)
    }
  },
  disconnected () {
    if (!CSS.supports('overscroll-behavior', 'none')) {
      this.element.removeEventListener('wheel', this.lockOnce)
      this.element.removeEventListener('mouseenter', this.lock)
      this.element.removeEventListener('mouseleave', this.unlock)
    }
  },
  lockOnce () {
    document.documentElement.style.overflow = 'hidden'
    this.element.removeEventListener('wheel', this.lockOnce)
  },
  lock () {
    document.documentElement.style.overflow = 'hidden'
  },
  unlock () {
    document.documentElement.style.overflow = 'auto'
  }
})