UNPKG

@mui/material

Version:

React components that implement Google's Material Design.

113 lines (111 loc) 5.31 kB
"use strict"; 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;