scrollLocker.js 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.default = void 0;
  7. var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
  8. var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
  9. var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
  10. var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
  11. var _getScrollBarSize = _interopRequireDefault(require("../getScrollBarSize"));
  12. var _setStyle = _interopRequireDefault(require("../setStyle"));
  13. var uuid = 0;
  14. var locks = [];
  15. var scrollingEffectClassName = 'ant-scrolling-effect';
  16. var scrollingEffectClassNameReg = new RegExp("".concat(scrollingEffectClassName), 'g');
  17. // https://github.com/ant-design/ant-design/issues/19340
  18. // https://github.com/ant-design/ant-design/issues/19332
  19. var cacheStyle = new Map();
  20. var ScrollLocker = exports.default = /*#__PURE__*/(0, _createClass2.default)(function ScrollLocker(_options) {
  21. var _this = this;
  22. (0, _classCallCheck2.default)(this, ScrollLocker);
  23. (0, _defineProperty2.default)(this, "lockTarget", void 0);
  24. (0, _defineProperty2.default)(this, "options", void 0);
  25. (0, _defineProperty2.default)(this, "getContainer", function () {
  26. var _this$options;
  27. return (_this$options = _this.options) === null || _this$options === void 0 ? void 0 : _this$options.container;
  28. });
  29. // if options change...
  30. (0, _defineProperty2.default)(this, "reLock", function (options) {
  31. var findLock = locks.find(function (_ref) {
  32. var target = _ref.target;
  33. return target === _this.lockTarget;
  34. });
  35. if (findLock) {
  36. _this.unLock();
  37. }
  38. _this.options = options;
  39. if (findLock) {
  40. findLock.options = options;
  41. _this.lock();
  42. }
  43. });
  44. (0, _defineProperty2.default)(this, "lock", function () {
  45. var _this$options3;
  46. // If lockTarget exist return
  47. if (locks.some(function (_ref2) {
  48. var target = _ref2.target;
  49. return target === _this.lockTarget;
  50. })) {
  51. return;
  52. }
  53. // If same container effect, return
  54. if (locks.some(function (_ref3) {
  55. var _this$options2;
  56. var options = _ref3.options;
  57. return (options === null || options === void 0 ? void 0 : options.container) === ((_this$options2 = _this.options) === null || _this$options2 === void 0 ? void 0 : _this$options2.container);
  58. })) {
  59. locks = [].concat((0, _toConsumableArray2.default)(locks), [{
  60. target: _this.lockTarget,
  61. options: _this.options
  62. }]);
  63. return;
  64. }
  65. var scrollBarSize = 0;
  66. var container = ((_this$options3 = _this.options) === null || _this$options3 === void 0 ? void 0 : _this$options3.container) || document.body;
  67. if (container === document.body && window.innerWidth - document.documentElement.clientWidth > 0 || container.scrollHeight > container.clientHeight) {
  68. if (getComputedStyle(container).overflow !== 'hidden') {
  69. scrollBarSize = (0, _getScrollBarSize.default)();
  70. }
  71. }
  72. var containerClassName = container.className;
  73. if (locks.filter(function (_ref4) {
  74. var _this$options4;
  75. var options = _ref4.options;
  76. return (options === null || options === void 0 ? void 0 : options.container) === ((_this$options4 = _this.options) === null || _this$options4 === void 0 ? void 0 : _this$options4.container);
  77. }).length === 0) {
  78. cacheStyle.set(container, (0, _setStyle.default)({
  79. width: scrollBarSize !== 0 ? "calc(100% - ".concat(scrollBarSize, "px)") : undefined,
  80. overflow: 'hidden',
  81. overflowX: 'hidden',
  82. overflowY: 'hidden'
  83. }, {
  84. element: container
  85. }));
  86. }
  87. // https://github.com/ant-design/ant-design/issues/19729
  88. if (!scrollingEffectClassNameReg.test(containerClassName)) {
  89. var addClassName = "".concat(containerClassName, " ").concat(scrollingEffectClassName);
  90. container.className = addClassName.trim();
  91. }
  92. locks = [].concat((0, _toConsumableArray2.default)(locks), [{
  93. target: _this.lockTarget,
  94. options: _this.options
  95. }]);
  96. });
  97. (0, _defineProperty2.default)(this, "unLock", function () {
  98. var _this$options5;
  99. var findLock = locks.find(function (_ref5) {
  100. var target = _ref5.target;
  101. return target === _this.lockTarget;
  102. });
  103. locks = locks.filter(function (_ref6) {
  104. var target = _ref6.target;
  105. return target !== _this.lockTarget;
  106. });
  107. if (!findLock || locks.some(function (_ref7) {
  108. var _findLock$options;
  109. var options = _ref7.options;
  110. return (options === null || options === void 0 ? void 0 : options.container) === ((_findLock$options = findLock.options) === null || _findLock$options === void 0 ? void 0 : _findLock$options.container);
  111. })) {
  112. return;
  113. }
  114. // Remove Effect
  115. var container = ((_this$options5 = _this.options) === null || _this$options5 === void 0 ? void 0 : _this$options5.container) || document.body;
  116. var containerClassName = container.className;
  117. if (!scrollingEffectClassNameReg.test(containerClassName)) return;
  118. (0, _setStyle.default)(cacheStyle.get(container), {
  119. element: container
  120. });
  121. cacheStyle.delete(container);
  122. container.className = container.className.replace(scrollingEffectClassNameReg, '').trim();
  123. });
  124. // eslint-disable-next-line no-plusplus
  125. this.lockTarget = uuid++;
  126. this.options = _options;
  127. });