gatsby-plugin-material-ui/gatsby-ssr.js

Gatsby plugin for Material-UI with built-in server-side rendering support

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.replaceRenderer = void 0;

var React = _interopRequireWildcard(require("react"));

var _react2 = require("@emotion/react");

var _createInstance = _interopRequireDefault(require("@emotion/server/create-instance"));

var _server = require("react-dom/server");

var _materialUiPluginCacheEndpoint = _interopRequireDefault(require("material-ui-plugin-cache-endpoint"));

var _getEmotionCache = _interopRequireDefault(require("./get-emotion-cache"));

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }

var replaceRenderer = function replaceRenderer(_ref) {
  var bodyComponent = _ref.bodyComponent,
      setHeadComponents = _ref.setHeadComponents,
      replaceBodyHTMLString = _ref.replaceBodyHTMLString;
  var cache = (0, _getEmotionCache.default)(_materialUiPluginCacheEndpoint.default);

  var _createEmotionServer = (0, _createInstance.default)(cache),
      extractCriticalToChunks = _createEmotionServer.extractCriticalToChunks;

  var emotionStyles = extractCriticalToChunks((0, _server.renderToString)( /*#__PURE__*/React.createElement(_react2.CacheProvider, {
    value: cache
  }, bodyComponent)));
  setHeadComponents(emotionStyles.styles.map(function (style) {
    return /*#__PURE__*/React.createElement("style", {
      "data-emotion": style.key + " " + style.ids.join(" "),
      key: style.key,
      dangerouslySetInnerHTML: {
        __html: style.css
      }
    });
  })); // render the result from `extractCritical`

  replaceBodyHTMLString(emotionStyles.html);
};

exports.replaceRenderer = replaceRenderer;