tdesign-mobile-vue/lib/hooks/useLockScroll.js

tdesign-mobile-vue

/**
 * tdesign v1.7.0
 * (c) 2024 TDesign Group
 * @license MIT
 */

import { onMounted, nextTick, onActivated, onDeactivated, onBeforeUnmount, watch } from 'vue';
import { useTouch } from '../_util/useTouch.js';
import getScrollParent from '../_util/getScrollParent.js';
import { supportsPassive } from '../_util/supportsPassive.js';
import '../shared/util.js';
import '@babel/runtime/helpers/slicedToArray';
import 'lodash/isNumber';
import '../config.js';

var totalLockCount = /* @__PURE__ */new Map();
var mounted = null;
function useLockScroll(rootRef, shouldLock, componentName) {
  var touch = useTouch();
  var BODY_LOCK_CLASS = "".concat(componentName, "--lock");
  var onTouchMove = function onTouchMove(event) {
    touch.move(event);
    var direction = touch.deltaY.value > 0 ? "10" : "01";
    var el = getScrollParent(event.target, rootRef.value);
    if (!el) return;
    var scrollHeight = el.scrollHeight,
      offsetHeight = el.offsetHeight,
      scrollTop = el.scrollTop;
    var status = "11";
    if (scrollTop === 0) {
      status = offsetHeight >= scrollHeight ? "00" : "01";
    } else if (scrollTop + offsetHeight >= scrollHeight) {
      status = "10";
    }
    if (status !== "11" && touch.isVertical() && !(parseInt(status, 2) & parseInt(direction, 2))) {
      if (event.cancelable) {
        event.preventDefault();
      }
    }
  };
  var lock = function lock() {
    var _totalLockCount$get;
    document.addEventListener("touchstart", touch.start);
    document.addEventListener("touchmove", onTouchMove, supportsPassive.value ? {
      passive: false
    } : false);
    if (!totalLockCount.get(BODY_LOCK_CLASS)) {
      document.body.classList.add(BODY_LOCK_CLASS);
    }
    totalLockCount.set(BODY_LOCK_CLASS, ((_totalLockCount$get = totalLockCount.get(BODY_LOCK_CLASS)) !== null && _totalLockCount$get !== void 0 ? _totalLockCount$get : 0) + 1);
  };
  var unlock = function unlock() {
    var sum = Array.from(totalLockCount.values()).reduce(function (acc, val) {
      return acc + val;
    }, 0);
    if (sum) {
      var _totalLockCount$get2;
      document.removeEventListener("touchstart", touch.start);
      document.removeEventListener("touchmove", onTouchMove);
      totalLockCount.set(BODY_LOCK_CLASS, Math.max(((_totalLockCount$get2 = totalLockCount.get(BODY_LOCK_CLASS)) !== null && _totalLockCount$get2 !== void 0 ? _totalLockCount$get2 : 0) - 1, 0));
      if (!totalLockCount.get(BODY_LOCK_CLASS)) {
        document.body.classList.remove(BODY_LOCK_CLASS);
      }
    }
  };
  var init = function init() {
    return shouldLock() && lock();
  };
  var destroy = function destroy() {
    return shouldLock() && unlock();
  };
  onMounted(function () {
    init();
    nextTick(function () {
      mounted = true;
    });
  });
  onActivated(function () {
    if (mounted) {
      init();
    }
  });
  onDeactivated(destroy);
  onBeforeUnmount(destroy);
  watch(shouldLock, function (value) {
    value ? lock() : unlock();
  });
}

export { useLockScroll };
//# sourceMappingURL=useLockScroll.js.map