@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 870 B
JavaScript
"use strict";var i=require("react/jsx-runtime"),e=require("@mui/material"),s=require("merge-sx"),n=require("../../WebCore/Surface/Surface.js");module.exports=({children:r,headContent:t,sx:c,...a})=>{const d=e.useTheme();return i.jsxs(n,{...a,sx:s.mergeSx(c,{mx:[d.spacing(d.custom.margin.md),0],width:1,maxWidth:[512]}),children:[t&&i.jsx(e.Box,{sx:{width:"100%",borderTopLeftRadius:"inherit",borderTopRightRadius:"inherit",pt:d.spacing(d.custom.margin.md),px:d.spacing(d.custom.margin.md)},children:t}),i.jsx(e.Box,{sx:{width:"100%",display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center",pt:t?[d.spacing(d.custom.margin.md)]:[d.spacing(d.custom.padding.lg),d.spacing(d.custom.padding.xl)],px:[d.spacing(d.custom.padding.lg),d.spacing(d.custom.padding.xl)],pb:[d.spacing(d.custom.padding.lg),d.spacing(d.custom.padding.xl)]},children:r})]})};