tdesign-react/cjs/dialog/hooks/useLockStyle.js

TDesign Component for React

/**
 * tdesign v1.16.2
 * (c) 2025 tdesign
 * @license MIT
 */

'use strict';

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

var React = require('react');
var getScrollbarWidth = require('../../_chunks/dep-18fff345.js');
var hooks_useLayoutEffect = require('../../hooks/useLayoutEffect.js');
require('../../_chunks/dep-779273e7.js');
require('../../_chunks/dep-a7fe58de.js');
require('../../_chunks/dep-737b8bd8.js');
require('../../_chunks/dep-40583e7c.js');
require('../../_chunks/dep-bb3e9667.js');
require('../../_chunks/dep-4ce0670e.js');
require('../../_chunks/dep-b325182b.js');
require('../../_chunks/dep-3448f35f.js');
require('../../_chunks/dep-b304bc94.js');
require('../../_chunks/dep-bdafd287.js');
require('../../_chunks/dep-e0735b5f.js');

var key = 1;
function useDialogLockStyle(_ref) {
  var preventScrollThrough = _ref.preventScrollThrough,
    visible = _ref.visible,
    mode = _ref.mode,
    showInAttachedElement = _ref.showInAttachedElement;
  var lockStyleRef = React.useRef(null);
  var timerRef = React.useRef(null);
  var clearStyleFunc = React.useCallback(function () {
    clearTimeout(timerRef.current);
    timerRef.current = setTimeout(function () {
      var _lockStyleRef$current, _lockStyleRef$current2;
      (_lockStyleRef$current = lockStyleRef.current) === null || _lockStyleRef$current === void 0 || (_lockStyleRef$current = _lockStyleRef$current.parentNode) === null || _lockStyleRef$current === void 0 || (_lockStyleRef$current2 = _lockStyleRef$current.removeChild) === null || _lockStyleRef$current2 === void 0 || _lockStyleRef$current2.call(_lockStyleRef$current, lockStyleRef.current);
    }, 150);
  }, []);
  hooks_useLayoutEffect["default"](function () {
    if (typeof document === "undefined" || !visible) return;
    if (!lockStyleRef.current) {
      lockStyleRef.current = document.createElement("style");
    }
    var hasScrollBar = document.documentElement.scrollHeight > document.documentElement.clientHeight;
    var scrollbarWidth = hasScrollBar ? getScrollbarWidth.getScrollbarWidth() : 0;
    lockStyleRef.current.dataset.id = "td_dialog_".concat(+new Date(), "_").concat(key += 1);
    lockStyleRef.current.innerHTML = "\n      html body {\n        overflow-y: hidden;\n        width: calc(100% - ".concat(scrollbarWidth, "px);\n      }\n    ");
    return clearStyleFunc;
  }, [visible, clearStyleFunc]);
  hooks_useLayoutEffect["default"](function () {
    if (typeof document === "undefined") return;
    if (mode !== "modal" || !preventScrollThrough || showInAttachedElement) return;
    if (visible) {
      document.head.appendChild(lockStyleRef.current);
    } else {
      clearStyleFunc();
    }
  }, [preventScrollThrough, visible, mode, showInAttachedElement, clearStyleFunc]);
}

exports["default"] = useDialogLockStyle;
//# sourceMappingURL=useLockStyle.js.map