@wulperstudio/cms
Version:
Wulper Studio Library Components CMS
76 lines • 2.98 kB
JavaScript
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
var _excluded = ["className", "sx"],
_excluded2 = ["className", "sx"],
_excluded3 = ["className", "sx"],
_excluded4 = ["className", "sx"];
import React from 'react';
import { Box, useMediaQuery, useTheme } from '@mui/material';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export var RootCmsLayout = function RootCmsLayout(_ref) {
var RootProps = _ref.RootProps,
content = _ref.content,
ContentProps = _ref.ContentProps,
contentLeft = _ref.contentLeft,
ContentLeftProps = _ref.ContentLeftProps,
contentRight = _ref.contentRight,
ContentRightProps = _ref.ContentRightProps;
var _useTheme = useTheme(),
breakpoints = _useTheme.breakpoints;
var bk = useMediaQuery(breakpoints.down('md'));
var _ref2 = RootProps || {},
classNameRoot = _ref2.className,
sxRoot = _ref2.sx,
rootProps = _objectWithoutProperties(_ref2, _excluded);
var _ref3 = ContentProps || {},
classNameContent = _ref3.className,
sxContent = _ref3.sx,
contentProps = _objectWithoutProperties(_ref3, _excluded2);
var _ref4 = ContentLeftProps || {},
classNameCLeft = _ref4.className,
sxCLeft = _ref4.sx,
cLeftProps = _objectWithoutProperties(_ref4, _excluded3);
var _ref5 = ContentRightProps || {},
classNameCRight = _ref5.className,
sxCRight = _ref5.sx,
cRightProps = _objectWithoutProperties(_ref5, _excluded4);
return /*#__PURE__*/_jsxs(Box, Object.assign({}, rootProps, {
className: "".concat(classNameRoot || '', " root__cms__layout"),
sx: Object.assign({
display: 'grid',
width: '100%',
height: '100%',
columnGap: 1.25
}, contentLeft && !bk && {
gridTemplateColumns: 'auto 1fr'
}, contentRight && !bk && {
gridTemplateColumns: '1fr auto'
}, contentLeft && contentRight && !bk && {
gridTemplateColumns: 'auto 1fr auto'
}, _defineProperty({}, breakpoints.down('md'), {
gridTemplateColumns: '1fr'
}), sxRoot),
children: [contentLeft && /*#__PURE__*/_jsx(Box, Object.assign({}, cLeftProps, {
className: "".concat(classNameCLeft || '', " content__left__cms__layout"),
sx: Object.assign({
height: '100%',
width: '100%'
}, sxCLeft),
children: contentLeft
})), /*#__PURE__*/_jsx(Box, Object.assign({}, contentProps, {
className: "".concat(classNameContent || '', " content__cms__layout"),
sx: Object.assign({
height: '100%',
width: '100%'
}, sxContent),
children: content
})), contentRight && /*#__PURE__*/_jsx(Box, Object.assign({}, cRightProps, {
className: "".concat(classNameCRight || '', " content__right__cms__layout"),
sx: Object.assign({
height: '100%',
width: '100%'
}, sxCRight),
children: contentRight
}))]
}));
};