1 | 'use client';
|
2 |
|
3 | import * as React from 'react';
|
4 | import PropTypes from 'prop-types';
|
5 | import { exactProp, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
|
6 | import { jsx as _jsx } from "react/jsx-runtime";
|
7 | /**
|
8 | * NoSsr purposely removes components from the subject of Server Side Rendering (SSR).
|
9 | *
|
10 | * This component can be useful in a variety of situations:
|
11 | *
|
12 | * * Escape hatch for broken dependencies not supporting SSR.
|
13 | * * Improve the time-to-first paint on the client by only rendering above the fold.
|
14 | * * Reduce the rendering time on the server.
|
15 | * * Under too heavy server load, you can turn on service degradation.
|
16 | *
|
17 | * Demos:
|
18 | *
|
19 | * - [No SSR](https://mui.com/material-ui/react-no-ssr/)
|
20 | *
|
21 | * API:
|
22 | *
|
23 | * - [NoSsr API](https://mui.com/material-ui/api/no-ssr/)
|
24 | */
|
25 | function NoSsr(props) {
|
26 | const {
|
27 | children,
|
28 | defer = false,
|
29 | fallback = null
|
30 | } = props;
|
31 | const [mountedState, setMountedState] = React.useState(false);
|
32 | useEnhancedEffect(() => {
|
33 | if (!defer) {
|
34 | setMountedState(true);
|
35 | }
|
36 | }, [defer]);
|
37 | React.useEffect(() => {
|
38 | if (defer) {
|
39 | setMountedState(true);
|
40 | }
|
41 | }, [defer]);
|
42 |
|
43 | // We need the Fragment here to force react-docgen to recognise NoSsr as a component.
|
44 | return /*#__PURE__*/_jsx(React.Fragment, {
|
45 | children: mountedState ? children : fallback
|
46 | });
|
47 | }
|
48 | process.env.NODE_ENV !== "production" ? NoSsr.propTypes /* remove-proptypes */ = {
|
49 | // ┌────────────────────────────── Warning ──────────────────────────────┐
|
50 | // │ These PropTypes are generated from the TypeScript type definitions. │
|
51 | // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
|
52 | // └─────────────────────────────────────────────────────────────────────┘
|
53 | /**
|
54 | * You can wrap a node.
|
55 | */
|
56 | children: PropTypes.node,
|
57 | /**
|
58 | * If `true`, the component will not only prevent server-side rendering.
|
59 | * It will also defer the rendering of the children into a different screen frame.
|
60 | * @default false
|
61 | */
|
62 | defer: PropTypes.bool,
|
63 | /**
|
64 | * The fallback content to display.
|
65 | * @default null
|
66 | */
|
67 | fallback: PropTypes.node
|
68 | } : void 0;
|
69 | if (process.env.NODE_ENV !== 'production') {
|
70 | // eslint-disable-next-line
|
71 | NoSsr['propTypes' + ''] = exactProp(NoSsr.propTypes);
|
72 | }
|
73 | export default NoSsr; |
\ | No newline at end of file |