@uimkit/uikit-react/dist/cjs/components/Popup/index.js

<img style="width:64px" src="https://mgmt.uimkit.chat/media/img/avatar.png"/>

'use strict';

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

var React = require('react');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);

function Popup(props) {
    var show = props.show, close = props.close, children = props.children, className = props.className, root = props.root, handleVisible = props.handleVisible;
    var popup = React.useRef();
    var _a = React.useState(false), isSetPos = _a[0], setIsSetPos = _a[1];
    React.useLayoutEffect(function () {
        var _a, _b;
        if (show) {
            window.addEventListener('mouseup', close, false);
            (_a = popup === null || popup === void 0 ? void 0 : popup.current) === null || _a === void 0 ? void 0 : _a.addEventListener('mouseup', stopImmediatePropagation);
        }
        else {
            window.removeEventListener('mouseup', close, false);
            (_b = popup === null || popup === void 0 ? void 0 : popup.current) === null || _b === void 0 ? void 0 : _b.removeEventListener('mouseup', stopImmediatePropagation);
        }
        return function () {
            var _a;
            window.removeEventListener('mouseup', close, false);
            (_a = popup === null || popup === void 0 ? void 0 : popup.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('mouseup', stopImmediatePropagation);
        };
    }, [show]);
    React.useLayoutEffect(function () {
        var io = new IntersectionObserver(function (_a) {
            var change = _a[0];
            var boundingClientRect = change.boundingClientRect, rootBounds = change.rootBounds, intersectionRatio = change.intersectionRatio;
            if (handleVisible && intersectionRatio < 1) {
                handleVisible({
                    left: (boundingClientRect.left - boundingClientRect.width) < rootBounds.left,
                    top: (boundingClientRect.bottom + boundingClientRect.height) < rootBounds.bottom,
                });
            }
            setIsSetPos(true);
        }, {
            root: root,
            threshold: [1],
        });
        if (popup && show) {
            io.observe(popup === null || popup === void 0 ? void 0 : popup.current);
        }
        return function () {
            io.disconnect();
            setIsSetPos(false);
        };
    }, [popup, show]);
    var stopImmediatePropagation = function (e) {
        e.stopPropagation();
    };
    return show && (React__default["default"].createElement("div", { role: "button", tabIndex: 0, className: "popup ".concat(className, " ").concat(isSetPos && 'popup-show'), ref: popup }, children));
}

exports.Popup = Popup;
//# sourceMappingURL=index.js.map