synapse-react-client
Version:
[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie
50 lines (49 loc) • 1.83 kB
JavaScript
import { jsxs as r, jsx as i } from "react/jsx-runtime";
import { Skeleton as e, styled as p, Paper as h, Box as a, Typography as d } from "@mui/material";
import x from "../../Icon/Icon.js";
const o = p(h, {
label: "ActionRequiredCardContainer"
})(({ theme: n }) => ({
padding: `${n.spacing(2.5)} ${n.spacing(4)}`,
display: "grid",
alignItems: "center",
gridTemplateColumns: "160px auto 200px",
gap: n.spacing(4),
[n.breakpoints.down("sm")]: {
gridTemplateColumns: "1fr"
// Single column layout for mobile
}
}));
function C(n) {
if (n.isLoading)
return /* @__PURE__ */ i(u, {});
const { title: l, description: c, iconType: s, count: t, actionNode: g } = n;
return /* @__PURE__ */ r(o, { children: [
/* @__PURE__ */ i(a, { sx: { textAlign: "center", minWidth: "100px" }, children: /* @__PURE__ */ i(x, { type: s }) }),
/* @__PURE__ */ r(a, { sx: { flexGrow: 1 }, children: [
/* @__PURE__ */ i(d, { variant: "headline3", sx: { mb: 1 }, children: l }),
t && /* @__PURE__ */ r(d, { variant: "smallText1", sx: { my: 1, color: "grey.700" }, children: [
t,
" File",
t != 1 ? "s" : ""
] }),
/* @__PURE__ */ i(d, { variant: "smallText1", children: c })
] }),
/* @__PURE__ */ i(a, { sx: { textAlign: "center", marginLeft: "auto" }, children: g })
] });
}
function u() {
return /* @__PURE__ */ r(o, { children: [
/* @__PURE__ */ i(e, { variant: "rectangular", width: 136, height: 74 }),
/* @__PURE__ */ r("div", { children: [
/* @__PURE__ */ i(e, { width: 250 }),
/* @__PURE__ */ i(e, { width: 100 })
] }),
/* @__PURE__ */ i(e, { variant: "rectangular", width: 160, height: 33 })
] });
}
export {
C as ActionRequiredCard,
u as LoadingActionRequiredCard
};
//# sourceMappingURL=ActionRequiredCard.js.map