UNPKG

@anoki/fse-ui

Version:

FSE UI components library

156 lines (155 loc) 4.92 kB
import { j as a } from "./index.es237.js"; import './components/ui/CardClinicalData/CardClinicalData.css';/* empty css */ import { clsx as t } from "./index.es239.js"; import { useState as I, useEffect as C } from "react"; import { Row as o } from "./index.es116.js"; import { ArrowDown as h } from "./index.es165.js"; import { Button as B } from "./index.es32.js"; const G = ({ information: l = [], className: j = "", clinicalCode: m = "", isOpen: i, hideArrow: s = !1, onToggle: n, hasBorder: b = !0, clinicalLabel: x = "", label: r, classNameTitle: w = "fw-semibold fs-5 md-fs-4 text-color-darker", deleteLabel: u, onDelete: N, deleteButtonPosition: y = "right" }) => { const e = l.length > 0, [g, f] = I(!1); C(() => { i !== void 0 && f(i); }, [i]); const c = s ? !0 : i ?? g, p = e && !s, v = () => { !e || s || (n == null || n(), i === void 0 && f((d) => !d)); }; return /* @__PURE__ */ a.jsxs("div", { className: "rounded shadow w-full card-clinical-data-container", children: [ /* @__PURE__ */ a.jsx( "button", { className: t( c && b && "ui-has-border-bottom", "ui-btn-accordion-clinical-data", j ), type: "button", "aria-expanded": e && !s ? c : void 0, onClick: p ? v : void 0, disabled: !p, style: { cursor: s ? "default" : void 0 }, children: /* @__PURE__ */ a.jsxs("div", { className: "ui-header-content p-x24", children: [ /* @__PURE__ */ a.jsxs(o, { gap: "x24", alignItems: "center", className: "first-row", children: [ /* @__PURE__ */ a.jsxs("div", { className: "clinical-data-info", children: [ /* @__PURE__ */ a.jsx("h1", { className: t(w), title: m, children: m }), /* @__PURE__ */ a.jsx("span", { className: "ui-divider" }), /* @__PURE__ */ a.jsx( "p", { className: "fs-7 md-fs-6 text-muted fw-semibold", title: x, children: x } ) ] }), e && !s && /* @__PURE__ */ a.jsx( h, { color: "primary", className: t("ui-arrow-card-clinical-data mobile-arrow", { "ui-expanded-card-clinical-data": c }) } ) ] }), /* @__PURE__ */ a.jsxs( o, { gap: "x16", alignItems: "center", className: "ui-arrow-container desktop-row", children: [ r && /* @__PURE__ */ a.jsx( "div", { className: "fs-7 fw-bold bg-secondary text-white rounded py-x4 px-x16 desktop-label", style: { width: "max-content" }, children: r } ), e && !s && /* @__PURE__ */ a.jsx( h, { color: "primary", className: t("ui-arrow-card-clinical-data desktop-arrow", { "ui-expanded-card-clinical-data": c }) } ) ] } ), r && /* @__PURE__ */ a.jsx( "div", { className: "fs-7 fw-bold bg-secondary text-white rounded py-x4 px-x16 mobile-label", style: { width: "max-content" }, children: r } ) ] }) } ), c && e && /* @__PURE__ */ a.jsx( "dl", { className: t( "p-x24", l.length > 1 ? "ui-card-clinical-data" : "base-row py-x16" ), children: l.map(({ label: d, value: k }) => /* @__PURE__ */ a.jsxs("div", { children: [ /* @__PURE__ */ a.jsxs( "dt", { className: t( "fs-custom fw-bold text-slate-28", l.length === 1 && "me-x8 mb-0" ), children: [ d, ":" ] } ), /* @__PURE__ */ a.jsx("dd", { className: "fs-custom fw-regular text-slate-28 mb-0", children: k }) ] }, d)) } ), c && u && !s && /* @__PURE__ */ a.jsx( o, { className: t( "align-items-center px-x24 w-full bg-lightblue-a03 py-x16", y === "right" ? "justify-content-end" : "justify-content-start" ), children: /* @__PURE__ */ a.jsx( B, { variant: "secondary", size: "3", variantBg: "bg-lightblue-a03", onClick: N, children: u } ) } ) ] }); }; export { G as CardClinicalData }; //# sourceMappingURL=index.es37.js.map