import { O as r, h as d } from "./FetchConfigsUtils-476a602b.mjs";
import { S as n } from "./SSRHelper-8eb361ff.mjs";
import i from "classnames";
import t, { Component as m } from "react";
import c from "react-dom";
import { X as p } from "react-feather";
const g = "dialogBody _dialogBody_8a574", u = "dialogFooter _dialogFooter_da83a", s = {
  dialogBody: g,
  dialogFooter: u
};
function h(o) {
  if (n.isSSR())
    return null;
  const e = o ? "editorDialogWrapper" : "dialogWrapper";
  let a = document.getElementById(e);
  return a || (a = document.createElement("div"), a.id = e, o ? E(a) : document.body.appendChild(a)), a;
}
function E(o) {
  const e = document.getElementById(d);
  e && e.appendChild(o);
}
const N = (o) => /* @__PURE__ */ t.createElement("div", { className: i(s.dialogBody, o.className) }, o.children), R = (o) => /* @__PURE__ */ t.createElement("div", { className: i(s.dialogFooter, o.className) }, o.children);
class O extends m {
  constructor(e) {
    super(e), this.modalRoot = h(this.props.isPreviewMode), this.modalContainer = n.isSSR() ? null : document.createElement("div");
  }
  componentDidMount() {
    !this.modalRoot || !this.modalContainer || this.modalRoot.appendChild(this.modalContainer);
  }
  componentWillUnmount() {
    !this.modalRoot || !this.modalContainer || this.modalRoot.removeChild(this.modalContainer);
  }
  renderDialog() {
    const { title: e = "", className: a = "", onClose: l = null } = this.props;
    return /* @__PURE__ */ t.createElement("section", { className: i("dialog", a, r.BODY_FONT) }, e && /* @__PURE__ */ t.createElement("div", { className: "dialogHeader" }, /* @__PURE__ */ t.createElement("h2", { className: i("titleContainer", r.TITLE_FONT) }, e), !!l && /* @__PURE__ */ t.createElement("div", { className: "closeButtonContainer", style: { color: "rgb(var(--od-rgba-secondary)" } }, /* @__PURE__ */ t.createElement(
      "button",
      {
        onClick: () => {
          l && l();
        }
      },
      /* @__PURE__ */ t.createElement(p, null)
    ))), this.props.children);
  }
  renderDialogOverlay() {
    const { isOpen: e } = this.props;
    return e ? /* @__PURE__ */ t.createElement("div", { className: "dialogOverlay editorDialogOverlay" }, this.renderDialog()) : null;
  }
  render() {
    var e;
    return this.props.isPreviewMode && ((e = this.props.className) != null && e.includes("paymentStatusDialog")) ? this.renderDialogOverlay() : this.modalContainer ? c.createPortal(this.renderDialogOverlay(), this.modalContainer) : /* @__PURE__ */ t.createElement("div", null);
  }
}
export {
  O as D,
  N as a,
  R as b
};
