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

FSE UI components library

import { j as e } from "./index.es278.js";
import './components/ui/CardClinicalAction/CardClinicalAction.css';/* empty css            */
import { clsx as m } from "./index.es280.js";
import { useState as E, useMemo as I } from "react";
import { ExternalLink as R } from "./index.es128.js";
import { Button as p } from "./index.es36.js";
import { Row as M } from "./index.es219.js";
const O = {
  default: "#6C757D",
  warning: "#DC3545",
  success: "#28A745",
  error: "#DC3545"
}, K = ({
  title: t,
  subtitle: n,
  information: x = [],
  statusLabel: l,
  statusVariant: u = "default",
  buttonLabel: f,
  buttonVariant: j = "secondary",
  onButtonClick: s,
  toggleOnButton: a = !1,
  toggleLabels: c = { open: "Open detail", close: "Close detail" },
  isOpen: w,
  deleteLabel: h,
  onDelete: N,
  deleteButtonPosition: v = "right",
  externalLink: r,
  asLink: g = "a",
  className: y = "",
  classNameTitle: b = "fw-semibold fs-6 md-fs-5 text-slate-20"
}) => {
  const C = O[u], $ = g, [D, S] = E(!1), d = a ? w ?? D : !0, o = I(() => a ? d ? c.close : c.open : f, [f, d, c, a]), z = () => {
    if (a) {
      s == null || s(), S((i) => !i);
      return;
    }
    s == null || s();
  };
  return /* @__PURE__ */ e.jsxs(
    "div",
    {
      className: m(
        "rounded shadow w-full card-clinical-action-container",
        y
      ),
      children: [
        /* @__PURE__ */ e.jsxs("div", { className: "ui-clinical-action-content p-x24", children: [
          /* @__PURE__ */ e.jsxs("div", { className: "ui-action-header", children: [
            /* @__PURE__ */ e.jsxs("div", { className: "clinical-action-info d-flex align-items-center gap-x16", children: [
              /* @__PURE__ */ e.jsx(
                "h2",
                {
                  className: m(b),
                  title: t,
                  style: { minWidth: "300px", flexShrink: 0 },
                  children: t
                }
              ),
              x.length > 0 && /* @__PURE__ */ e.jsx("div", { className: "ui-information-row d-flex gap-x16", children: x.map((i, A) => /* @__PURE__ */ e.jsxs("div", { className: "ui-info-item", children: [
                /* @__PURE__ */ e.jsxs("span", { className: "fs-custom fw-bold text-slate-28", children: [
                  i.label,
                  ":"
                ] }),
                /* @__PURE__ */ e.jsx("span", { className: "fs-custom fw-regular text-slate-28", children: i.value })
              ] }, A)) })
            ] }),
            n && /* @__PURE__ */ e.jsx(
              "p",
              {
                className: "fs-7 md-fs-6 text-muted fw-regular",
                title: n,
                children: n
              }
            )
          ] }),
          /* @__PURE__ */ e.jsxs("div", { className: "ui-action-footer", children: [
            l && /* @__PURE__ */ e.jsx(
              "div",
              {
                className: "fs-7 fw-bold text-white rounded py-x4 px-x16",
                style: {
                  width: "max-content",
                  backgroundColor: C
                },
                role: "status",
                "aria-label": `Stato: ${l}`,
                children: l
              }
            ),
            r ? /* @__PURE__ */ e.jsxs(
              $,
              {
                href: r.href,
                target: "_blank",
                rel: "noopener noreferrer",
                className: "d-flex align-items-center gap-x8 text-decoration-none text-primary fw-bold fs-6",
                "aria-label": `${r.title} (si apre in una nuova finestra)`,
                children: [
                  r.title,
                  /* @__PURE__ */ e.jsx(
                    R,
                    {
                      width: 20,
                      height: 20,
                      color: "primary",
                      "aria-hidden": "true"
                    }
                  )
                ]
              }
            ) : o && /* @__PURE__ */ e.jsx(
              p,
              {
                variant: j,
                size: "3",
                onClick: z,
                "aria-label": `${o} ${t}`,
                children: o
              }
            )
          ] })
        ] }),
        d && h && /* @__PURE__ */ e.jsx(
          M,
          {
            className: m(
              "align-items-center px-x24 w-full bg-lightblue-a03 py-x16",
              v === "right" ? "justify-content-end" : "justify-content-start"
            ),
            children: /* @__PURE__ */ e.jsx(
              p,
              {
                variant: "secondary",
                size: "3",
                variantBg: "bg-lightblue-a03",
                onClick: N,
                children: h
              }
            )
          }
        )
      ]
    }
  );
};
export {
  K as CardClinicalAction
};
//# sourceMappingURL=index.es43.js.map