@rocket.chat/fuselage-toastbar/dist/cjs/ToastBarPortal.js

Fuselage ToastBar component

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = require("react");
const react_dom_1 = require("react-dom");
const ensureAnchorElement = (id) => {
    const existingAnchor = document.getElementById(id);
    if (existingAnchor)
        return existingAnchor;
    const newAnchor = document.createElement('div');
    newAnchor.id = id;
    document.body.appendChild(newAnchor);
    return newAnchor;
};
const getAnchorRefCount = (anchorElement) => {
    const { refCount } = anchorElement.dataset;
    if (refCount)
        return parseInt(refCount, 10);
    return 0;
};
const setAnchorRefCount = (anchorElement, refCount) => {
    anchorElement.dataset['refCount'] = String(refCount);
};
const refAnchorElement = (anchorElement) => {
    setAnchorRefCount(anchorElement, getAnchorRefCount(anchorElement) + 1);
    if (anchorElement.parentElement !== document.body) {
        document.body.appendChild(anchorElement);
    }
};
const unrefAnchorElement = (anchorElement) => {
    const refCount = getAnchorRefCount(anchorElement) - 1;
    setAnchorRefCount(anchorElement, refCount);
    if (refCount <= 0) {
        document.body.removeChild(anchorElement);
    }
};
const ToastBarPortal = ({ children }) => {
    const toastBarRoot = ensureAnchorElement('toastBarRoot');
    (0, react_1.useLayoutEffect)(() => {
        refAnchorElement(toastBarRoot);
        return () => {
            unrefAnchorElement(toastBarRoot);
        };
    }, [toastBarRoot]);
    return (0, react_dom_1.createPortal)(children, toastBarRoot);
};
exports.default = (0, react_1.memo)(ToastBarPortal);
//# sourceMappingURL=ToastBarPortal.js.map