Spaces:
Sleeping
Sleeping
File size: 6,326 Bytes
56fda74 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 |
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _extends from "@babel/runtime/helpers/esm/extends";
import * as React from 'react';
import PropTypes from 'prop-types';
import clsx from 'clsx';
import generateUtilityClass from '@mui/utils/generateUtilityClass';
import composeClasses from '@mui/utils/composeClasses';
import capitalize from '@mui/utils/capitalize';
import useThemePropsSystem from '../useThemeProps';
import systemStyled from '../styled';
import createTheme from '../createTheme';
import { jsx as _jsx } from "react/jsx-runtime";
var defaultTheme = createTheme();
var defaultCreateStyledComponent = systemStyled('div', {
name: 'MuiContainer',
slot: 'Root',
overridesResolver: function overridesResolver(props, styles) {
var ownerState = props.ownerState;
return [styles.root, styles["maxWidth".concat(capitalize(String(ownerState.maxWidth)))], ownerState.fixed && styles.fixed, ownerState.disableGutters && styles.disableGutters];
}
});
var useThemePropsDefault = function useThemePropsDefault(inProps) {
return useThemePropsSystem({
props: inProps,
name: 'MuiContainer',
defaultTheme: defaultTheme
});
};
var useUtilityClasses = function useUtilityClasses(ownerState, componentName) {
var getContainerUtilityClass = function getContainerUtilityClass(slot) {
return generateUtilityClass(componentName, slot);
};
var classes = ownerState.classes,
fixed = ownerState.fixed,
disableGutters = ownerState.disableGutters,
maxWidth = ownerState.maxWidth;
var slots = {
root: ['root', maxWidth && "maxWidth".concat(capitalize(String(maxWidth))), fixed && 'fixed', disableGutters && 'disableGutters']
};
return composeClasses(slots, getContainerUtilityClass, classes);
};
export default function createContainer() {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var _options$createStyled = options.createStyledComponent,
createStyledComponent = _options$createStyled === void 0 ? defaultCreateStyledComponent : _options$createStyled,
_options$useThemeProp = options.useThemeProps,
useThemeProps = _options$useThemeProp === void 0 ? useThemePropsDefault : _options$useThemeProp,
_options$componentNam = options.componentName,
componentName = _options$componentNam === void 0 ? 'MuiContainer' : _options$componentNam;
var ContainerRoot = createStyledComponent(function (_ref) {
var theme = _ref.theme,
ownerState = _ref.ownerState;
return _extends({
width: '100%',
marginLeft: 'auto',
boxSizing: 'border-box',
marginRight: 'auto',
display: 'block'
}, !ownerState.disableGutters && _defineProperty({
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(2)
}, theme.breakpoints.up('sm'), {
paddingLeft: theme.spacing(3),
paddingRight: theme.spacing(3)
}));
}, function (_ref3) {
var theme = _ref3.theme,
ownerState = _ref3.ownerState;
return ownerState.fixed && Object.keys(theme.breakpoints.values).reduce(function (acc, breakpointValueKey) {
var breakpoint = breakpointValueKey;
var value = theme.breakpoints.values[breakpoint];
if (value !== 0) {
// @ts-ignore
acc[theme.breakpoints.up(breakpoint)] = {
maxWidth: "".concat(value).concat(theme.breakpoints.unit)
};
}
return acc;
}, {});
}, function (_ref4) {
var theme = _ref4.theme,
ownerState = _ref4.ownerState;
return _extends({}, ownerState.maxWidth === 'xs' && _defineProperty({}, theme.breakpoints.up('xs'), {
// @ts-ignore module augmentation fails if custom breakpoints are used
maxWidth: Math.max(theme.breakpoints.values.xs, 444)
}), ownerState.maxWidth &&
// @ts-ignore module augmentation fails if custom breakpoints are used
ownerState.maxWidth !== 'xs' && _defineProperty({}, theme.breakpoints.up(ownerState.maxWidth), {
// @ts-ignore module augmentation fails if custom breakpoints are used
maxWidth: "".concat(theme.breakpoints.values[ownerState.maxWidth]).concat(theme.breakpoints.unit)
}));
});
var Container = /*#__PURE__*/React.forwardRef(function Container(inProps, ref) {
var props = useThemeProps(inProps);
var className = props.className,
_props$component = props.component,
component = _props$component === void 0 ? 'div' : _props$component,
_props$disableGutters = props.disableGutters,
disableGutters = _props$disableGutters === void 0 ? false : _props$disableGutters,
_props$fixed = props.fixed,
fixed = _props$fixed === void 0 ? false : _props$fixed,
_props$maxWidth = props.maxWidth,
maxWidth = _props$maxWidth === void 0 ? 'lg' : _props$maxWidth,
classesProp = props.classes,
other = _objectWithoutProperties(props, ["className", "component", "disableGutters", "fixed", "maxWidth", "classes"]);
var ownerState = _extends({}, props, {
component: component,
disableGutters: disableGutters,
fixed: fixed,
maxWidth: maxWidth
});
// @ts-ignore module augmentation fails if custom breakpoints are used
var classes = useUtilityClasses(ownerState, componentName);
return (
/*#__PURE__*/
// @ts-ignore theme is injected by the styled util
_jsx(ContainerRoot, _extends({
as: component
// @ts-ignore module augmentation fails if custom breakpoints are used
,
ownerState: ownerState,
className: clsx(classes.root, className),
ref: ref
}, other))
);
});
process.env.NODE_ENV !== "production" ? Container.propTypes /* remove-proptypes */ = {
children: PropTypes.node,
classes: PropTypes.object,
className: PropTypes.string,
component: PropTypes.elementType,
disableGutters: PropTypes.bool,
fixed: PropTypes.bool,
maxWidth: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl', false]), PropTypes.string]),
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
} : void 0;
return Container;
} |