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

tdesign-mobile-vue

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

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
var _util_useTouch = require('../_util/useTouch.js');
var _util_getScrollParent = require('../_util/getScrollParent.js');
var _util_supportsPassive = require('../_util/supportsPassive.js');
require('../shared/util.js');
require('@babel/runtime/helpers/slicedToArray');
require('lodash/isNumber');
require('../config.js');

var totalLockCount = /* @__PURE__ */new Map();
var mounted = null;
function useLockScroll(rootRef, shouldLock, componentName) {
  var touch = _util_useTouch.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 = _util_getScrollParent["default"](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, _util_supportsPassive.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();
  };
  vue.onMounted(function () {
    init();
    vue.nextTick(function () {
      mounted = true;
    });
  });
  vue.onActivated(function () {
    if (mounted) {
      init();
    }
  });
  vue.onDeactivated(destroy);
  vue.onBeforeUnmount(destroy);
  vue.watch(shouldLock, function (value) {
    value ? lock() : unlock();
  });
}

exports.useLockScroll = useLockScroll;
//# sourceMappingURL=useLockScroll.js.map