@anoki/fse-ui/dist/index.es174.js

FSE UI components library

import { j as a } from "./index.es278.js";
import './components/ui/InfoPopup/InfoPopup.css';/* empty css            */
import { clsx as t } from "./index.es280.js";
import { Root as c, Trigger as g, Content as f, Close as j } from "./index.es463.js";
import { Button as d } from "./index.es464.js";
import { Info as u } from "./index.es171.js";
import { Close as N } from "./index.es80.js";
const W = ({
  title: e = "Info",
  description: l,
  width: s = "15.5rem",
  className: i = "",
  positionPopUp: n = "right",
  onClickCloseBtn: o,
  isOpen: p,
  ariaLabel: m,
  children: x
}) => /* @__PURE__ */ a.jsxs(
  c,
  {
    defaultOpen: !1,
    open: p,
    onOpenChange: o,
    modal: !1,
    children: [
      /* @__PURE__ */ a.jsx(g, { className: "position-relative", onClick: (r) => r.stopPropagation(), children: /* @__PURE__ */ a.jsx(
        d,
        {
          className: "ui-popup-trigger-button",
          "aria-label": m || e,
          title: m || e,
          children: /* @__PURE__ */ a.jsx(u, { color: "primary" })
        }
      ) }),
      /* @__PURE__ */ a.jsxs(
        f,
        {
          className: t(i, "dialog"),
          side: n,
          tabIndex: -1,
          width: {
            initial: s,
            sm: s,
            xs: s,
            lg: s,
            md: s,
            xl: s
          },
          maxWidth: {
            initial: s,
            sm: s,
            xs: s,
            lg: s,
            md: s,
            xl: s
          },
          minWidth: {
            initial: s,
            sm: s,
            xs: s,
            lg: s,
            md: s,
            xl: s
          },
          style: { width: s },
          children: [
            /* @__PURE__ */ a.jsxs("div", { className: "header", children: [
              /* @__PURE__ */ a.jsx("h1", { id: "dialog-title", className: "title", children: e }),
              /* @__PURE__ */ a.jsx(
                j,
                {
                  className: "closeButton",
                  "aria-label": "Close dialog",
                  onClick: (r) => {
                    r.stopPropagation(), o == null || o();
                  },
                  children: /* @__PURE__ */ a.jsx(N, { className: "closeIcon", width: 34, height: 34 })
                }
              )
            ] }),
            l && /* @__PURE__ */ a.jsx("div", { id: "dialog-description", className: "content", children: l }),
            x
          ]
        }
      )
    ]
  }
);
export {
  W as InfoPopup
};
//# sourceMappingURL=index.es174.js.map