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

FSE UI components library

import { j as a } from "./index.es237.js";
import './components/ui/InfoPopup/InfoPopup.css';/* empty css            */
import { clsx as c } from "./index.es238.js";
import { Root as t, Trigger as g, Content as f, Close as j } from "./index.es416.js";
import { Button as d } from "./index.es417.js";
import { Info as u } from "./index.es208.js";
import { Close as N } from "./index.es179.js";
const W = ({
  title: o = "Info",
  description: r,
  width: s = "15.5rem",
  className: m = "",
  positionPopUp: i = "right",
  onClickCloseBtn: e,
  isOpen: n,
  ariaLabel: l,
  children: x
}) => /* @__PURE__ */ a.jsxs(
  t,
  {
    defaultOpen: !1,
    open: n,
    onOpenChange: e,
    modal: !1,
    children: [
      /* @__PURE__ */ a.jsx(g, { className: "position-relative", children: /* @__PURE__ */ a.jsx(
        d,
        {
          className: "ui-popup-trigger-button",
          "aria-label": l || o,
          title: l || o,
          children: /* @__PURE__ */ a.jsx(u, { color: "primary" })
        }
      ) }),
      /* @__PURE__ */ a.jsxs(
        f,
        {
          className: c(m, "dialog"),
          side: i,
          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: o }),
              /* @__PURE__ */ a.jsx(
                j,
                {
                  className: "closeButton",
                  "aria-label": "Close dialog",
                  onClick: (p) => {
                    p.stopPropagation(), e == null || e();
                  },
                  children: /* @__PURE__ */ a.jsx(N, { className: "closeIcon", width: 34, height: 34 })
                }
              )
            ] }),
            r && /* @__PURE__ */ a.jsx("div", { id: "dialog-description", className: "content", children: r }),
            x
          ]
        }
      )
    ]
  }
);
export {
  W as InfoPopup
};
//# sourceMappingURL=index.es103.js.map