synapse-react-client
Version:
[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie
97 lines (96 loc) • 2.32 kB
JavaScript
import { jsxs as o, jsx as t, Fragment as g } from "react/jsx-runtime";
import d, { RequirementItemStatus as p } from "../AccessApprovalCheckMark.js";
import { Box as n, Button as u, styled as s } from "@mui/material";
const c = s(n, {
label: "RequirementContainer"
})({
display: "grid",
gridTemplateRows: "50px auto auto",
gridTemplateColumns: "30px auto",
columnGap: "20px",
alignItems: "center",
margin: "1rem 0 2rem"
}), x = s(n, {
label: "InlineButtonContainer"
})(({ theme: r }) => ({
display: "flex",
gap: r.spacing(2),
margin: `${r.spacing(1)} 0`
}));
function f(r) {
const { actions: e, status: i, children: m } = r;
return /* @__PURE__ */ o(c, { "data-testid": "RequirementItem", children: [
/* @__PURE__ */ t(
d,
{
status: i,
sx: {
gridRow: "1 / span 1",
gridColumn: "1 / span 1",
margin: "auto"
}
}
),
/* @__PURE__ */ t(
n,
{
sx: {
gridColumn: "2 / span 1",
gridRow: "1 / span 2",
alignSelf: "start",
mt: "12px"
},
children: m
}
),
e && !!e.length && /* @__PURE__ */ o(g, { children: [
/* @__PURE__ */ t(
n,
{
sx: {
gridColumnStart: 1,
gridRow: "2 / span 1",
width: "1px",
height: "100%",
backgroundColor: "grey.400",
margin: "auto"
}
}
),
/* @__PURE__ */ t(
n,
{
sx: (a) => ({
gridColumnStart: 1,
gridRow: "3 / span 1",
width: "50%",
height: "60%",
borderLeft: `1px solid ${a.palette.grey[400]}`,
borderBottom: `1px solid ${a.palette.grey[400]}`,
marginLeft: "auto",
marginBottom: "auto",
marginRight: "0"
})
}
)
] }),
e && !!e.length && /* @__PURE__ */ t(
x,
{
sx: { gridColumnStart: 2, gridRow: "3 / span 1", mt: 2 },
children: e.map((a, l) => /* @__PURE__ */ t(
u,
{
disabled: i === p.LOADING,
...a
},
l
))
}
)
] });
}
export {
f as default
};
//# sourceMappingURL=RequirementItem.js.map