@mui/material
Version:
React components that implement Google's Material Design.
113 lines (111 loc) • 5.31 kB
JavaScript
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.styles = exports.html = exports.default = exports.body = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var React = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
var _GlobalStyles = _interopRequireDefault(require("../GlobalStyles"));
var _jsxRuntime = require("react/jsx-runtime");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
const html = (theme, enableColorScheme) => (0, _extends2.default)({
WebkitFontSmoothing: 'antialiased',
// Antialiasing.
MozOsxFontSmoothing: 'grayscale',
// Antialiasing.
// Change from `box-sizing: content-box` so that `width`
// is not affected by `padding` or `border`.
boxSizing: 'border-box',
// Fix font resize problem in iOS
WebkitTextSizeAdjust: '100%'
}, enableColorScheme && !theme.vars && {
colorScheme: theme.palette.mode
});
exports.html = html;
const body = theme => (0, _extends2.default)({
color: (theme.vars || theme).palette.text.primary
}, theme.typography.body1, {
backgroundColor: (theme.vars || theme).palette.background.default,
'@media print': {
// Save printer ink.
backgroundColor: (theme.vars || theme).palette.common.white
}
});
exports.body = body;
const styles = (theme, enableColorScheme = false) => {
var _theme$components, _theme$components$Mui;
const colorSchemeStyles = {};
if (enableColorScheme && theme.colorSchemes) {
Object.entries(theme.colorSchemes).forEach(([key, scheme]) => {
var _scheme$palette;
colorSchemeStyles[theme.getColorSchemeSelector(key).replace(/\s*&/, '')] = {
colorScheme: (_scheme$palette = scheme.palette) == null ? void 0 : _scheme$palette.mode
};
});
}
let defaultStyles = (0, _extends2.default)({
html: html(theme, enableColorScheme),
'*, *::before, *::after': {
boxSizing: 'inherit'
},
'strong, b': {
fontWeight: theme.typography.fontWeightBold
},
body: (0, _extends2.default)({
margin: 0
}, body(theme), {
// Add support for document.body.requestFullScreen().
// Other elements, if background transparent, are not supported.
'&::backdrop': {
backgroundColor: (theme.vars || theme).palette.background.default
}
})
}, colorSchemeStyles);
const themeOverrides = (_theme$components = theme.components) == null ? void 0 : (_theme$components$Mui = _theme$components.MuiCssBaseline) == null ? void 0 : _theme$components$Mui.styleOverrides;
if (themeOverrides) {
defaultStyles = [defaultStyles, themeOverrides];
}
return defaultStyles;
};
/**
* Kickstart an elegant, consistent, and simple baseline to build upon.
*/
exports.styles = styles;
function CssBaseline(inProps) {
const props = (0, _useThemeProps.default)({
props: inProps,
name: 'MuiCssBaseline'
});
const {
children,
enableColorScheme = false
} = props;
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_GlobalStyles.default, {
styles: theme => styles(theme, enableColorScheme)
}), children]
});
}
process.env.NODE_ENV !== "production" ? CssBaseline.propTypes /* remove-proptypes */ = {
// ----------------------------- Warning --------------------------------
// | These PropTypes are generated from the TypeScript type definitions |
// | To update them edit the d.ts file and run "yarn proptypes" |
// ----------------------------------------------------------------------
/**
* You can wrap a node.
*/
children: _propTypes.default.node,
/**
* Enable `color-scheme` CSS property to use `theme.palette.mode`.
* For more details, check out https://developer.mozilla.org/en-US/docs/Web/CSS/color-scheme
* For browser support, check out https://caniuse.com/?search=color-scheme
* @default false
*/
enableColorScheme: _propTypes.default.bool
} : void 0;
var _default = CssBaseline;
exports.default = _default;
;