UNPKG

@material-ui/core

Version:

React components that implement Google's Material Design.

65 lines (56 loc) 2.16 kB
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray"; import React from 'react'; import PropTypes from 'prop-types'; import { exactProp } from '@material-ui/utils'; var useEnhancedEffect = typeof window !== 'undefined' && process.env.NODE_ENV !== 'test' ? React.useLayoutEffect : React.useEffect; /** * NoSsr purposely removes components from the subject of Server Side Rendering (SSR). * * This component can be useful in a variety of situations: * - Escape hatch for broken dependencies not supporting SSR. * - Improve the time-to-first paint on the client by only rendering above the fold. * - Reduce the rendering time on the server. * - Under too heavy server load, you can turn on service degradation. */ function NoSsr(props) { var children = props.children, _props$defer = props.defer, defer = _props$defer === void 0 ? false : _props$defer, _props$fallback = props.fallback, fallback = _props$fallback === void 0 ? null : _props$fallback; var _React$useState = React.useState(false), _React$useState2 = _slicedToArray(_React$useState, 2), mountedState = _React$useState2[0], setMountedState = _React$useState2[1]; useEnhancedEffect(function () { if (!defer) { setMountedState(true); } }, [defer]); React.useEffect(function () { if (defer) { setMountedState(true); } }, [defer]); // We need the Fragment here to force react-docgen to recognise NoSsr as a component. return React.createElement(React.Fragment, null, mountedState ? children : fallback); } process.env.NODE_ENV !== "production" ? NoSsr.propTypes = { /** * You can wrap a node. */ children: PropTypes.node.isRequired, /** * If `true`, the component will not only prevent server-side rendering. * It will also defer the rendering of the children into a different screen frame. */ defer: PropTypes.bool, /** * The fallback content to display. */ fallback: PropTypes.node } : void 0; if (process.env.NODE_ENV !== 'production') { // eslint-disable-next-line NoSsr['propTypes' + ''] = exactProp(NoSsr.propTypes); } export default NoSsr;