@modern-js/runtime 1.3.4-alpha.0 → 1.4.0

package/dist/js/treeshaking/router/runtime/utils.js

@@ -0,0 +1,106 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["Component"];
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import React from 'react';
+import { Route, matchPath } from 'react-router-dom';
+import { DefaultNotFound } from "./DefaultNotFound";
+import { jsx as _jsx } from "react/jsx-runtime";
+export function renderRoutes(routesConfig) {
+  var extraProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
+  var Layout = function Layout(_ref) {
+    var Component = _ref.Component,
+        props = _objectWithoutProperties(_ref, _excluded);
+
+    var GlobalLayout = routesConfig === null || routesConfig === void 0 ? void 0 : routesConfig.globalApp;
+
+    if (!GlobalLayout) {
+      return /*#__PURE__*/_jsx(Component, _objectSpread({}, props));
+    }
+
+    return /*#__PURE__*/_jsx(GlobalLayout, _objectSpread({
+      Component: Component
+    }, props));
+  };
+
+  var findMatchedRoute = function findMatchedRoute(pathname) {
+    var _routesConfig$routes;
+
+    return routesConfig === null || routesConfig === void 0 ? void 0 : (_routesConfig$routes = routesConfig.routes) === null || _routesConfig$routes === void 0 ? void 0 : _routesConfig$routes.find(function (route) {
+      var info = matchPath(pathname, {
+        path: route.path,
+        exact: route.exact,
+        sensitive: route.sensitive
+      });
+      return Boolean(info);
+    });
+  };
+
+  return /*#__PURE__*/_jsx(Route, {
+    path: "/",
+    render: function render(props) {
+      var matchedRoute = findMatchedRoute(props.location.pathname);
+
+      if (!matchedRoute) {
+        return /*#__PURE__*/_jsx(DefaultNotFound, {});
+      }
+
+      return /*#__PURE__*/_jsx(Route, {
+        path: matchedRoute.path,
+        exact: matchedRoute.exact,
+        sensitive: matchedRoute.sensitive,
+        render: function render(routeProps) {
+          return /*#__PURE__*/_jsx(Layout, _objectSpread(_objectSpread({
+            Component: matchedRoute.component
+          }, routeProps), extraProps));
+        }
+      });
+    }
+  });
+}
+export function getLocation(serverContext) {
+  var _ref2 = (serverContext === null || serverContext === void 0 ? void 0 : serverContext.request) || {},
+      pathname = _ref2.pathname,
+      url = _ref2.url;
+
+  var cleanUrl = url.replace('http://', '').replace('https://', '');
+  var index = (cleanUrl || '').indexOf(pathname);
+
+  if (index === -1) {
+    return pathname;
+  }
+
+  return cleanUrl.substring(index);
+}
+export var urlJoin = function urlJoin() {
+  var separator = '/';
+  var replace = new RegExp("".concat(separator, "{1,}"), 'g');
+
+  for (var _len = arguments.length, parts = new Array(_len), _key = 0; _key < _len; _key++) {
+    parts[_key] = arguments[_key];
+  }
+
+  return standardSlash(parts.join(separator).replace(replace, separator));
+};
+export function standardSlash(str) {
+  var addr = str;
+
+  if (!addr || typeof addr !== 'string') {
+    return addr;
+  }
+
+  if (addr.startsWith('.')) {
+    addr = addr.slice(1);
+  }
+
+  if (!addr.startsWith('/')) {
+    addr = "/".concat(addr);
+  }
+
+  if (addr.endsWith('/') && addr !== '/') {
+    addr = addr.slice(0, addr.length - 1);
+  }
+
+  return addr;
+}

package/dist/js/treeshaking/ssr/cli/index.js

@@ -0,0 +1,113 @@
+import path from 'path';
+import { getEntryOptions, SERVER_RENDER_FUNCTION_NAME, LOADABLE_STATS_FILE, isUseSSRBundle, createRuntimeExportsUtils, isSingleEntry } from '@modern-js/utils';
+var PLUGIN_IDENTIFIER = 'ssr';
+export default (function () {
+  return {
+    name: '@modern-js/plugin-ssr',
+    required: ['@modern-js/runtime'],
+    setup: function setup(api) {
+      var ssrConfigMap = new Map();
+      var pluginsExportsUtils;
+      var ssrModulePath = path.resolve(__dirname, '../');
+      return {
+        config: function config() {
+          var appContext = api.useAppContext();
+          pluginsExportsUtils = createRuntimeExportsUtils(appContext.internalDirectory, 'plugins');
+          return {
+            source: {
+              alias: {
+                '@modern-js/runtime/plugins': pluginsExportsUtils.getPath()
+              }
+            },
+            tools: {
+              webpackChain: function webpackChain(chain, _ref) {
+                var name = _ref.name,
+                    CHAIN_ID = _ref.CHAIN_ID;
+                var userConfig = api.useResolvedConfigContext();
+
+                if (isUseSSRBundle(userConfig) && name !== 'server') {
+                  // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires
+                  var LoadableWebpackPlugin = require('@modern-js/webpack/@loadable/webpack-plugin');
+
+                  chain.plugin(CHAIN_ID.PLUGIN.LOADABLE).use(LoadableWebpackPlugin, [{
+                    filename: LOADABLE_STATS_FILE
+                  }]);
+                }
+              },
+              babel: function babel(config) {
+                var userConfig = api.useResolvedConfigContext();
+
+                if (isUseSSRBundle(userConfig)) {
+                  config.plugins.push(require.resolve('@loadable/babel-plugin'));
+                }
+              }
+            }
+          };
+        },
+        modifyEntryImports: function modifyEntryImports(_ref2) {
+          var entrypoint = _ref2.entrypoint,
+              imports = _ref2.imports;
+          var entryName = entrypoint.entryName;
+          var userConfig = api.useResolvedConfigContext();
+
+          var _api$useAppContext = api.useAppContext(),
+              packageName = _api$useAppContext.packageName,
+              entrypoints = _api$useAppContext.entrypoints;
+
+          pluginsExportsUtils.addExport("export { default as ssr } from '".concat(ssrModulePath, "'")); // if use ssg then set ssr config to true
+
+          var ssrConfig = getEntryOptions(entryName, userConfig.server.ssr, userConfig.server.ssrByEntries, packageName);
+          var ssgConfig = userConfig.output.ssg;
+          var useSSG = isSingleEntry(entrypoints) ? Boolean(ssgConfig) : ssgConfig === true || typeof (ssgConfig === null || ssgConfig === void 0 ? void 0 : ssgConfig[0]) === 'function' || Boolean(ssgConfig === null || ssgConfig === void 0 ? void 0 : ssgConfig[entryName]);
+          ssrConfigMap.set(entryName, ssrConfig || useSSG);
+
+          if (ssrConfig || useSSG) {
+            imports.push({
+              value: '@modern-js/runtime/plugins',
+              specifiers: [{
+                imported: PLUGIN_IDENTIFIER
+              }]
+            });
+          }
+
+          return {
+            entrypoint: entrypoint,
+            imports: imports
+          };
+        },
+        modifyEntryRuntimePlugins: function modifyEntryRuntimePlugins(_ref3) {
+          var entrypoint = _ref3.entrypoint,
+              plugins = _ref3.plugins;
+
+          if (ssrConfigMap.get(entrypoint.entryName)) {
+            plugins.push({
+              name: PLUGIN_IDENTIFIER,
+              options: ssrConfigMap.get(entrypoint.entryName)
+            });
+          }
+
+          return {
+            entrypoint: entrypoint,
+            plugins: plugins
+          };
+        },
+        modifyEntryExport: function modifyEntryExport(_ref4) {
+          var entrypoint = _ref4.entrypoint,
+              exportStatement = _ref4.exportStatement;
+
+          if (ssrConfigMap.get(entrypoint.entryName)) {
+            return {
+              entrypoint: entrypoint,
+              exportStatement: ["export function ".concat(SERVER_RENDER_FUNCTION_NAME, "(context) {\n              return bootstrap(AppWrapper, context)\n            }"), exportStatement].join('\n')
+            };
+          }
+
+          return {
+            entrypoint: entrypoint,
+            exportStatement: exportStatement
+          };
+        }
+      };
+    }
+  };
+});

package/dist/js/treeshaking/ssr/index.js

@@ -0,0 +1,129 @@
+import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import ReactDOM from 'react-dom';
+import { loadableReady } from '@loadable/component';
+import { RenderLevel } from "./serverRender/type";
+import { formatClient, mockResponse } from "./utils";
+import { jsx as _jsx } from "react/jsx-runtime";
+
+var ssr = function ssr() {
+  return {
+    name: '@modern-js/plugin-ssr',
+    setup: function setup() {
+      var mockResp = mockResponse();
+      return {
+        client: function () {
+          var _client = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(_ref) {
+            var _window, _window$_SSR_DATA;
+
+            var App, context, rootElement, renderLevel, _prefetch, _ref2;
+
+            return _regeneratorRuntime().wrap(function _callee$(_context) {
+              while (1) {
+                switch (_context.prev = _context.next) {
+                  case 0:
+                    App = _ref.App, context = _ref.context, rootElement = _ref.rootElement;
+                    renderLevel = (_window = window) === null || _window === void 0 ? void 0 : (_window$_SSR_DATA = _window._SSR_DATA) === null || _window$_SSR_DATA === void 0 ? void 0 : _window$_SSR_DATA.renderLevel;
+
+                    if (!(renderLevel === RenderLevel.CLIENT_RENDER)) {
+                      _context.next = 8;
+                      break;
+                    }
+
+                    _context.next = 5;
+                    return App === null || App === void 0 ? void 0 : (_prefetch = (_ref2 = App).prefetch) === null || _prefetch === void 0 ? void 0 : _prefetch.call(_ref2, context);
+
+                  case 5:
+                    ReactDOM.render( /*#__PURE__*/_jsx(App, {
+                      context: context
+                    }), rootElement);
+                    _context.next = 9;
+                    break;
+
+                  case 8:
+                    if (renderLevel === RenderLevel.SERVER_RENDER) {
+                      loadableReady(function () {
+                        var hydrateContext = _objectSpread(_objectSpread({}, context), {}, {
+                          _hydration: true
+                        });
+
+                        ReactDOM.hydrate( /*#__PURE__*/_jsx(App, {
+                          context: hydrateContext
+                        }), rootElement, function () {
+                          // won't cause component re-render because context's reference identity doesn't change
+                          delete hydrateContext._hydration;
+                        });
+                      });
+                    } else {
+                      // unknown renderlevel or renderlevel is server prefetch.
+                      ReactDOM.render( /*#__PURE__*/_jsx(App, {
+                        context: context
+                      }), rootElement);
+                    }
+
+                  case 9:
+                  case "end":
+                    return _context.stop();
+                }
+              }
+            }, _callee);
+          }));
+
+          function client(_x) {
+            return _client.apply(this, arguments);
+          }
+
+          return client;
+        }(),
+        init: function init(_ref3, next) {
+          var _window2, _window2$_SSR_DATA, _window2$_SSR_DATA$co;
+
+          var context = _ref3.context;
+          var request = (_window2 = window) === null || _window2 === void 0 ? void 0 : (_window2$_SSR_DATA = _window2._SSR_DATA) === null || _window2$_SSR_DATA === void 0 ? void 0 : (_window2$_SSR_DATA$co = _window2$_SSR_DATA.context) === null || _window2$_SSR_DATA$co === void 0 ? void 0 : _window2$_SSR_DATA$co.request;
+
+          if (!request) {
+            return next({
+              context: context
+            });
+          }
+
+          context.ssrContext.response = mockResp;
+          context.ssrContext.request = formatClient(request);
+          return next({
+            context: context
+          });
+        },
+        pickContext: function pickContext(_ref4, next) {
+          var _window3, _window3$_SSR_DATA, _window3$_SSR_DATA$co;
+
+          var context = _ref4.context,
+              pickedContext = _ref4.pickedContext;
+          var request = (_window3 = window) === null || _window3 === void 0 ? void 0 : (_window3$_SSR_DATA = _window3._SSR_DATA) === null || _window3$_SSR_DATA === void 0 ? void 0 : (_window3$_SSR_DATA$co = _window3$_SSR_DATA.context) === null || _window3$_SSR_DATA$co === void 0 ? void 0 : _window3$_SSR_DATA$co.request;
+          var initialData = context.initialData;
+
+          if (!request) {
+            return next({
+              context: context,
+              pickedContext: _objectSpread(_objectSpread({}, pickedContext), {}, {
+                initialData: initialData
+              })
+            });
+          }
+
+          return next({
+            context: context,
+            pickedContext: _objectSpread(_objectSpread({}, pickedContext), {}, {
+              initialData: initialData,
+              request: request,
+              response: mockResp
+            })
+          });
+        }
+      };
+    }
+  };
+};
+
+export default ssr;
+export * from "./react";

package/dist/js/treeshaking/ssr/index.node.js

@@ -0,0 +1,100 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+
+/* eslint-disable @typescript-eslint/no-var-requires */
+
+/* eslint-disable @typescript-eslint/no-require-imports */
+import path from 'path';
+import { registerPrefetch } from '@modern-js/runtime-core';
+import { isBrowser } from "../common";
+import prefetch from "./prefetch";
+import { formatServer } from "./utils";
+var registeredApps = new WeakSet();
+
+var plugin = function plugin() {
+  return {
+    name: '@modern-js/plugin-ssr',
+    setup: function setup() {
+      return {
+        server: function () {
+          var _server = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(_ref) {
+            var App, context, html;
+            return _regeneratorRuntime().wrap(function _callee$(_context2) {
+              while (1) {
+                switch (_context2.prev = _context2.next) {
+                  case 0:
+                    App = _ref.App, context = _ref.context;
+
+                    if (!registeredApps.has(App)) {
+                      registerPrefetch(App, function (_context) {
+                        return prefetch(App, _context);
+                      });
+                      registeredApps.add(App);
+                    }
+
+                    if (isBrowser()) {
+                      _context2.next = 7;
+                      break;
+                    }
+
+                    _context2.next = 5;
+                    return require("./serverRender").render(context, (context === null || context === void 0 ? void 0 : context.ssrContext.distDir) || path.join(process.cwd(), 'dist'), App);
+
+                  case 5:
+                    html = _context2.sent;
+                    return _context2.abrupt("return", html);
+
+                  case 7:
+                    return _context2.abrupt("return", null);
+
+                  case 8:
+                  case "end":
+                    return _context2.stop();
+                }
+              }
+            }, _callee);
+          }));
+
+          function server(_x) {
+            return _server.apply(this, arguments);
+          }
+
+          return server;
+        }(),
+        init: function init(_ref2, next) {
+          var context = _ref2.context;
+          var request = context.ssrContext.request;
+          context.ssrContext.request = formatServer(request);
+          return next({
+            context: context
+          });
+        },
+        pickContext: function pickContext(_ref3, next) {
+          var context = _ref3.context,
+              pickedContext = _ref3.pickedContext;
+
+          var _context$ssrContext = context === null || context === void 0 ? void 0 : context.ssrContext,
+              request = _context$ssrContext.request,
+              response = _context$ssrContext.response;
+
+          var initialData = context.initialData;
+          return next({
+            context: context,
+            pickedContext: _objectSpread(_objectSpread({}, pickedContext), {}, {
+              initialData: initialData,
+              request: request,
+              response: response
+            })
+          });
+        }
+      };
+    }
+  };
+};
+
+export default plugin;
+export * from "./react";
+/* eslint-enable @typescript-eslint/no-require-imports */
+
+/* eslint-enable @typescript-eslint/no-var-requires */

package/dist/js/treeshaking/ssr/prefetch.js

@@ -0,0 +1,97 @@
+import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import path from 'path';
+import fs from 'fs';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { run } from '@modern-js/utils/ssr';
+import { LOADABLE_STATS_FILE } from '@modern-js/utils/constants';
+import { ChunkExtractor } from '@loadable/server'; // todo: SSRContext
+
+import { jsx as _jsx } from "react/jsx-runtime";
+
+var prefetch = /*#__PURE__*/function () {
+  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(App, context) {
+    return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+      while (1) {
+        switch (_context2.prev = _context2.next) {
+          case 0:
+            return _context2.abrupt("return", run(context.ssrContext.request.headers, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+              var _context$store;
+
+              var ssrContext, loadablefile, extractor, loadersData;
+              return _regeneratorRuntime().wrap(function _callee$(_context) {
+                while (1) {
+                  switch (_context.prev = _context.next) {
+                    case 0:
+                      ssrContext = context.ssrContext;
+                      loadablefile = path.resolve(ssrContext.distDir, LOADABLE_STATS_FILE);
+
+                      if (fs.existsSync(loadablefile)) {
+                        extractor = new ChunkExtractor({
+                          statsFile: path.resolve(ssrContext.distDir, LOADABLE_STATS_FILE),
+                          entrypoints: [ssrContext.entryName].filter(Boolean)
+                        });
+                        renderToStaticMarkup(extractor.collectChunks( /*#__PURE__*/_jsx(App, {
+                          context: context
+                        })));
+                      } else {
+                        renderToStaticMarkup( /*#__PURE__*/_jsx(App, {
+                          context: context
+                        }));
+                      }
+
+                      if (context.loaderManager.hasPendingLoaders()) {
+                        _context.next = 5;
+                        break;
+                      }
+
+                      return _context.abrupt("return", {
+                        initialData: context.initialData,
+                        i18nData: context.__i18nData__
+                      });
+
+                    case 5:
+                      _context.next = 7;
+                      return context.loaderManager.awaitPendingLoaders();
+
+                    case 7:
+                      loadersData = _context.sent;
+                      Object.keys(loadersData).forEach(function (id) {
+                        var data = loadersData[id];
+
+                        if (data._error) {
+                          ssrContext.logger.error('App Prefetch Loader', data._error);
+                          ssrContext.metrics.emitCounter('app.prefetch.loader.error', 1);
+                          delete data._error;
+                        }
+                      });
+                      return _context.abrupt("return", {
+                        loadersData: loadersData,
+                        initialData: context.initialData,
+                        i18nData: context.__i18nData__,
+                        // todo: move to plugin state
+                        storeState: context === null || context === void 0 ? void 0 : (_context$store = context.store) === null || _context$store === void 0 ? void 0 : _context$store.getState()
+                      });
+
+                    case 10:
+                    case "end":
+                      return _context.stop();
+                  }
+                }
+              }, _callee);
+            }))));
+
+          case 1:
+          case "end":
+            return _context2.stop();
+        }
+      }
+    }, _callee2);
+  }));
+
+  return function prefetch(_x, _x2) {
+    return _ref.apply(this, arguments);
+  };
+}();
+
+export default prefetch;

package/dist/js/treeshaking/ssr/react/index.js

@@ -0,0 +1,2 @@
+export { PreRender } from "./prerender";
+export { NoSSR } from "./nossr";

package/dist/js/treeshaking/ssr/react/nossr/index.js

@@ -0,0 +1,16 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import React, { useEffect, useState } from 'react';
+var csr = false;
+export var NoSSR = function NoSSR(props) {
+  var _useState = useState(csr),
+      _useState2 = _slicedToArray(_useState, 2),
+      isMounted = _useState2[0],
+      setMounted = _useState2[1];
+
+  useEffect(function () {
+    csr = true;
+    setMounted(true);
+  });
+  var children = props.children;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, isMounted ? children : null);
+};

package/dist/js/treeshaking/ssr/react/prerender/index.js

@@ -0,0 +1,119 @@
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import withSideEffect from 'react-side-effect';
+import React, { createElement } from 'react';
+import { getOutermostProperty, aggKeysFromPropsList, exist, aggMatchesFromPropsList } from "./util";
+var PROP_NAMES = {
+  INTERVAL: 'interval',
+  STALE_LIMIT: 'staleLimit',
+  LEVEL: 'level',
+  INCLUDES: 'includes',
+  EXCLUDES: 'excludes',
+  FALLBACK: 'fallback',
+  MATCHES: 'matches'
+};
+
+var handleClientStateChange = function handleClientStateChange() {// not used
+};
+
+var mapStateOnServer = function mapStateOnServer(reduceProps) {
+  var defaultProps = {
+    interval: 10,
+    staleLimit: false,
+    level: 0,
+    includes: null,
+    excludes: null,
+    fallback: false,
+    matches: null
+  };
+  return Object.keys(defaultProps).reduce(function (props, key) {
+    var propKey = key;
+    var reduceProp = reduceProps[propKey];
+    var nextProps = props;
+
+    if (exist(reduceProp)) {
+      nextProps = _objectSpread(_objectSpread({}, props), {}, _defineProperty({}, propKey, reduceProp));
+    }
+
+    return nextProps;
+  }, defaultProps);
+};
+
+var reducePropsToState = function reducePropsToState(propsList) {
+  var reduceProps = {
+    interval: getOutermostProperty(propsList, PROP_NAMES.INTERVAL),
+    staleLimit: getOutermostProperty(propsList, PROP_NAMES.STALE_LIMIT),
+    level: getOutermostProperty(propsList, PROP_NAMES.LEVEL),
+    includes: aggKeysFromPropsList(propsList, PROP_NAMES.INCLUDES),
+    excludes: aggKeysFromPropsList(propsList, PROP_NAMES.EXCLUDES),
+    fallback: getOutermostProperty(propsList, PROP_NAMES.FALLBACK),
+    matches: aggMatchesFromPropsList(propsList, PROP_NAMES.MATCHES)
+  };
+  return reduceProps;
+};
+
+function factory(Component) {
+  var Spr = /*#__PURE__*/function (_React$Component) {
+    _inherits(Spr, _React$Component);
+
+    var _super = _createSuper(Spr);
+
+    function Spr() {
+      _classCallCheck(this, Spr);
+
+      return _super.apply(this, arguments);
+    }
+
+    _createClass(Spr, [{
+      key: "verify",
+      value: function verify() {
+        return true;
+      }
+    }, {
+      key: "render",
+      value: function render() {
+        var newProps = _objectSpread({}, this.props);
+
+        var validate = this.verify();
+
+        if (!validate) {
+          throw new Error('invalid props, check usage');
+        }
+
+        return /*#__PURE__*/createElement(Component, _objectSpread({}, newProps));
+      }
+    }], [{
+      key: "canUseDOM",
+      get: function get() {
+        return Component.canUseDOM;
+      },
+      set: function set(canUseDOM) {
+        Component.canUseDOM = canUseDOM;
+      }
+    }]);
+
+    return Spr;
+  }(React.Component);
+
+  _defineProperty(Spr, "peek", Component.peek);
+
+  _defineProperty(Spr, "rewind", Component.rewind);
+
+  _defineProperty(Spr, "config", function () {
+    var mappedState = Component.rewind();
+    return mappedState;
+  });
+
+  return Spr;
+}
+
+var NullComponent = function NullComponent() {
+  return null;
+};
+
+var SprSideEffects = withSideEffect(reducePropsToState, handleClientStateChange, mapStateOnServer)(NullComponent);
+export var PreRender = factory(SprSideEffects);