import { jsxs as h, jsx as d } from "react/jsx-runtime";
/* empty css                     */
import { pubSubService as l, PUB_SUB_EVENTS as m } from "./index-pub-sub.js";
import { useGetModals as y } from "./index-use-get-modals.js";
import { useRef as b, useEffect as c } from "react";
import { useModalContext as S } from "./index-ModalContext.js";
import { ModalService as v } from "./index-ModalService.js";
import { ModalTransition as i } from "./index-ModalTransition.js";
const B = () => {
  const {
    modalRootState: p,
    addModal: s,
    removeModal: a
  } = S(), t = b([]), {
    growModals: e,
    slideModals: r,
    popModals: n
  } = y(p);
  return c(() => {
    t.current.forEach((o) => o == null ? void 0 : o.unsubscribe()), t.current = [];
    const u = l.$sub(m.reactModalOpen, ({
      modalId: o,
      animation: M
    }) => {
      const g = v.getModalComponent(o);
      s(o, M, g);
    }), f = l.$sub(m.reactModalClose, ({
      modalId: o
    }) => {
      a(o);
    });
    return t.current = [u, f], () => {
      t.current.forEach((o) => o == null ? void 0 : o.unsubscribe()), t.current = [];
    };
  }, [s, a]), c(() => {
    (e || r || n) && (e.length ?? 0) + (r.length ?? 0) + (n.length ?? 0) >= 1 ? (document.body.style.marginRight = `${window.innerWidth - document.body.offsetWidth}px`, document.body.style.overflow = "hidden") : (document.body.style.marginRight = "", document.body.style.overflow = "");
  }, [e, r, n]), h("div", {
    "data-testid": "modal-root",
    id: "modals-storage",
    children: [d(i, {
      modalsList: r,
      animation: "slide"
    }), d(i, {
      modalsList: e,
      animation: "grow"
    }), d(i, {
      modalsList: n,
      animation: "pop"
    })]
  });
};
export {
  B as ModalRoot
};
