@anoki/fse-marche-ui/dist/index.es66.js

FSE UI components library

import { j as r } from "./index.es137.js";
import { useRef as c, useEffect as f } from "react";
import { clsx as l } from "./index.es139.js";
import './components/ui/InfoPopup/InfoPopup.css';/* empty css            */
import { Close as p } from "./index.es79.js";
const E = ({
  title: n = "Info",
  description: s,
  isOpen: t = !1,
  onClickCloseBtn: e,
  className: m = ""
}) => {
  const i = c(null), o = c(null);
  return f(() => {
    var d;
    const a = (u) => {
      u.key === "Escape" && t && (e == null || e());
    };
    return t ? (o.current = document.activeElement, (d = i.current) == null || d.focus(), document.addEventListener("keydown", a)) : o.current && o.current.focus(), () => {
      document.removeEventListener("keydown", a);
    };
  }, [t, e]), t ? /* @__PURE__ */ r.jsx(
    "div",
    {
      className: l("popupContainer", t ? "open" : "close", m),
      onClick: (a) => {
        a.stopPropagation();
      },
      children: /* @__PURE__ */ r.jsxs(
        "div",
        {
          ref: i,
          role: "dialog",
          "aria-modal": "true",
          "aria-labelledby": "dialog-title",
          "aria-describedby": "dialog-description",
          className: l("dialog"),
          tabIndex: -1,
          children: [
            /* @__PURE__ */ r.jsxs("div", { className: "header", children: [
              /* @__PURE__ */ r.jsx("h3", { id: "dialog-title", className: "title", children: n }),
              /* @__PURE__ */ r.jsx(
                "button",
                {
                  onClick: (a) => {
                    a.stopPropagation(), e == null || e();
                  },
                  className: "closeButton",
                  "aria-label": "Close dialog",
                  children: /* @__PURE__ */ r.jsx(p, { className: "closeIcon" })
                }
              )
            ] }),
            s && /* @__PURE__ */ r.jsx("div", { id: "dialog-description", className: "content", children: s })
          ]
        }
      )
    }
  ) : null;
};
export {
  E as InfoPopup
};
//# sourceMappingURL=index.es66.js.map