'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; } var React = require('react'); var React__default = _interopDefault(React); var shallowEqual = _interopDefault(require('shallowequal')); var levenshtein = _interopDefault(require('fast-levenshtein')); var ReactDOM = _interopDefault(require('react-dom')); var PropTypes = _interopDefault(require('prop-types')); var defaultPolyfill = require('react-lifecycles-compat'); var defaultPolyfill__default = _interopDefault(defaultPolyfill); var hoistNonReactStatic = _interopDefault(require('hoist-non-react-statics')); var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; var classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }; var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; var inherits = function (subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }; var possibleConstructorReturn = function (self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }; /* eslint-disable no-underscore-dangle */ var isCompositeComponent = function isCompositeComponent(type) { return typeof type === 'function'; }; var isReloadableComponent = function isReloadableComponent(type) { return typeof type === 'function' || (typeof type === 'undefined' ? 'undefined' : _typeof(type)) === 'object'; }; var getComponentDisplayName = function getComponentDisplayName(type) { var displayName = type.displayName || type.name; return displayName && displayName !== 'ReactComponent' ? displayName : 'Component'; }; var reactLifeCycleMountMethods = ['componentWillMount', 'componentDidMount']; function isReactClass(Component) { return !!(Component.prototype && (React__default.Component.prototype.isPrototypeOf(Component.prototype) || // react 14 support Component.prototype.isReactComponent || Component.prototype.componentWillMount || Component.prototype.componentWillUnmount || Component.prototype.componentDidMount || Component.prototype.componentDidUnmount || Component.prototype.render)); } function isReactClassInstance(Component) { return Component && isReactClass({ prototype: Object.getPrototypeOf(Component) }); } var getInternalInstance = function getInternalInstance(instance) { return instance._reactInternalFiber || // React 16 instance._reactInternalInstance || // React 15 null; }; var updateInstance = function updateInstance(instance) { var updater = instance.updater, forceUpdate = instance.forceUpdate; if (typeof forceUpdate === 'function') { instance.forceUpdate(); } else if (updater && typeof updater.enqueueForceUpdate === 'function') { updater.enqueueForceUpdate(instance); } }; var isFragmentNode = function isFragmentNode(_ref) { var type = _ref.type; return React__default.Fragment && type === React__default.Fragment; }; var ContextType = React__default.createContext ? React__default.createContext() : null; var ConsumerType = ContextType && ContextType.Consumer.$$typeof; var ProviderType = ContextType && ContextType.Provider.$$typeof; var MemoType = React__default.memo && React__default.memo(function () { return null; }).$$typeof; var LazyType = React__default.lazy && React__default.lazy(function () { return null; }).$$typeof; var ForwardType = React__default.forwardRef && React__default.forwardRef(function () { return null; }).$$typeof; var CONTEXT_CURRENT_VALUE = '_currentValue'; var isContextConsumer = function isContextConsumer(_ref2) { var type = _ref2.type; return type && (typeof type === 'undefined' ? 'undefined' : _typeof(type)) === 'object' && '$$typeof' in type && type.$$typeof === ConsumerType && ConsumerType; }; var isContextProvider = function isContextProvider(_ref3) { var type = _ref3.type; return type && (typeof type === 'undefined' ? 'undefined' : _typeof(type)) === 'object' && '$$typeof' in type && type.$$typeof === ProviderType && ProviderType; }; var isMemoType = function isMemoType(_ref4) { var type = _ref4.type; return type && (typeof type === 'undefined' ? 'undefined' : _typeof(type)) === 'object' && '$$typeof' in type && type.$$typeof === MemoType && MemoType; }; var isLazyType = function isLazyType(_ref5) { var type = _ref5.type; return type && (typeof type === 'undefined' ? 'undefined' : _typeof(type)) === 'object' && '$$typeof' in type && type.$$typeof === LazyType && LazyType; }; var isForwardType = function isForwardType(_ref6) { var type = _ref6.type; return type && (typeof type === 'undefined' ? 'undefined' : _typeof(type)) === 'object' && '$$typeof' in type && type.$$typeof === ForwardType && ForwardType; }; var isContextType = function isContextType(type) { return isContextConsumer(type) || isContextProvider(type); }; var getElementType = function getElementType(type) { var element = { type: type }; if (isContextConsumer(element)) { return 'Consumer'; } if (isContextProvider(element)) { return 'Provider'; } if (isLazyType(element)) { return 'Lazy'; } if (isMemoType(element)) { return 'Memo'; } if (isForwardType(element)) { return 'Forward'; } if (isReactClass(type)) { return 'Class'; } if (typeof element === 'function') { return 'FC'; } return 'unknown'; }; var getContextProvider = function getContextProvider(type) { return type && type._context; }; var configuration = { // Log level logLevel: 'error', // Allows using SFC without changes pureSFC: true, // keep render method unpatched, moving sideEffect to componentDidUpdate pureRender: true, // Allows SFC to be used, enables "intermediate" components used by Relay, should be disabled for Preact allowSFC: true, // Allow reload of effect hooks with non zero dependency list reloadHooks: true, // Allow reload of mount effect hooks - zero deps reloadLifeCycleHooks: false, // Enables hook reload on hook body change reloadHooksOnBodyChange: true, // Disable "hot-replacement-render" disableHotRenderer: false, // @private integratedComparator: false, // @private integratedResolver: false, // Disable "hot-replacement-render" when injection into react-dom is made disableHotRendererWhenInjected: true, // Controls `react-🔥-dom patch` notification showReactDomPatchNotification: true, // Hook on babel component register. onComponentRegister: false, // Hook on React renders for a first time component onComponentCreate: false, // flag to completely disable RHL for SFC. Probably don't use it without dom patch made. ignoreSFC: false, // ignoreSFC when injection into react-dom is made ignoreSFCWhenInjected: true, // flag to completely disable RHL for Components ignoreComponents: false, // default value for AppContainer errorOverlay errorReporter: undefined, // Global error overlay ErrorOverlay: undefined, // Actively track lazy loaded components trackTailUpdates: true, // react hot dom features enabled IS_REACT_MERGE_ENABLED: false }; var internalConfiguration = { // control proxy creation disableProxyCreation: false }; var setConfiguration = function setConfiguration(config) { // not using Object.assing for IE11 compliance for (var i in config) { if (config.hasOwnProperty(i)) { configuration[i] = config[i]; } } }; /* eslint-disable no-console */ var logger = { debug: function debug() { if (['debug'].indexOf(configuration.logLevel) !== -1) { var _console; (_console = console).debug.apply(_console, arguments); } }, log: function log() { if (['debug', 'log'].indexOf(configuration.logLevel) !== -1) { var _console2; (_console2 = console).log.apply(_console2, arguments); } }, warn: function warn() { if (['debug', 'log', 'warn'].indexOf(configuration.logLevel) !== -1) { var _console3; (_console3 = console).warn.apply(_console3, arguments); } }, error: function error() { if (['debug', 'log', 'warn', 'error'].indexOf(configuration.logLevel) !== -1) { var _console4; (_console4 = console).error.apply(_console4, arguments); } } }; /* eslint-disable no-eval, func-names */ function safeReactConstructor(Component, lastInstance) { try { if (lastInstance) { return new Component(lastInstance.props, lastInstance.context); } return new Component({}, {}); } catch (e) { // some components, like Redux connect could not be created without proper context } return null; } function isNativeFunction(fn) { return typeof fn === 'function' ? fn.toString().indexOf('[native code]') > 0 : false; } var identity = function identity(a) { return a; }; var indirectEval = eval; var doesSupportClasses = function () { try { indirectEval('class Test {}'); return true; } catch (e) { return false; } }(); var ES6ProxyComponentFactory = function ES6ProxyComponentFactory(InitialParent, postConstructionAction) { return indirectEval('\n(function(InitialParent, postConstructionAction) {\n return class ' + (InitialParent.name || 'HotComponent') + ' extends InitialParent {\n /*\n ! THIS IS NOT YOUR COMPONENT !\n ! THIS IS REACT-HOT-LOADER !\n \n this is a "' + InitialParent.name + '" component, patched by React-Hot-Loader\n Sorry, but the real class code was hidden behind this facade\n Please refer to https://github.com/gaearon/react-hot-loader for details...\n */ \n \n constructor(props, context) {\n super(props, context)\n postConstructionAction.call(this)\n }\n }\n})\n')(InitialParent, postConstructionAction); }; var ES5ProxyComponentFactory = function ES5ProxyComponentFactory(InitialParent, postConstructionAction) { function ProxyComponent(props, context) { InitialParent.call(this, props, context); postConstructionAction.call(this); } ProxyComponent.prototype = Object.create(InitialParent.prototype); Object.setPrototypeOf(ProxyComponent, InitialParent); return ProxyComponent; }; var proxyClassCreator = doesSupportClasses ? ES6ProxyComponentFactory : ES5ProxyComponentFactory; function getOwnKeys(target) { return [].concat(Object.getOwnPropertyNames(target), Object.getOwnPropertySymbols(target)); } function shallowStringsEqual(a, b) { for (var key in a) { if (String(a[key]) !== String(b[key])) { return false; } } return true; } function deepPrototypeUpdate(dest, source) { var deepDest = Object.getPrototypeOf(dest); var deepSrc = Object.getPrototypeOf(source); if (deepDest && deepSrc && deepSrc !== deepDest) { deepPrototypeUpdate(deepDest, deepSrc); } if (source.prototype && source.prototype !== dest.prototype) { dest.prototype = source.prototype; } } function safeDefineProperty(target, key, props) { try { Object.defineProperty(target, key, props); } catch (e) { logger.warn('Error while wrapping', key, ' -> ', e); } } var PREFIX = '__reactstandin__'; var PROXY_KEY = PREFIX + 'key'; var GENERATION = PREFIX + 'proxyGeneration'; var REGENERATE_METHOD = PREFIX + 'regenerateByEval'; var UNWRAP_PROXY = PREFIX + 'getCurrent'; var CACHED_RESULT = PREFIX + 'cachedResult'; var PROXY_IS_MOUNTED = PREFIX + 'isMounted'; var RENDERED_GENERATION = 'REACT_HOT_LOADER_RENDERED_GENERATION'; var RESERVED_STATICS = ['length', 'displayName', 'name', 'arguments', 'caller', 'prototype', 'toString', 'valueOf', 'isStatelessFunctionalProxy', PROXY_KEY, UNWRAP_PROXY]; function transferStaticProps(ProxyComponent, savedDescriptors, PreviousComponent, NextComponent) { Object.getOwnPropertyNames(ProxyComponent).forEach(function (key) { if (RESERVED_STATICS.indexOf(key) !== -1) { return; } var prevDescriptor = Object.getOwnPropertyDescriptor(ProxyComponent, key); var savedDescriptor = savedDescriptors[key]; if (!shallowEqual(prevDescriptor, savedDescriptor)) { safeDefineProperty(NextComponent, key, prevDescriptor); } }); // Copy newly defined static methods and properties Object.getOwnPropertyNames(NextComponent).forEach(function (key) { if (RESERVED_STATICS.indexOf(key) !== -1) { return; } var prevDescriptor = PreviousComponent && Object.getOwnPropertyDescriptor(ProxyComponent, key); var savedDescriptor = savedDescriptors[key]; // Skip redefined descriptors if (prevDescriptor && savedDescriptor && !shallowEqual(savedDescriptor, prevDescriptor)) { safeDefineProperty(NextComponent, key, prevDescriptor); return; } if (prevDescriptor && !savedDescriptor) { safeDefineProperty(ProxyComponent, key, prevDescriptor); return; } var nextDescriptor = _extends({}, Object.getOwnPropertyDescriptor(NextComponent, key), { configurable: true }); savedDescriptors[key] = nextDescriptor; safeDefineProperty(ProxyComponent, key, nextDescriptor); }); // Remove static methods and properties that are no longer defined Object.getOwnPropertyNames(ProxyComponent).forEach(function (key) { if (RESERVED_STATICS.indexOf(key) !== -1) { return; } // Skip statics that exist on the next class if (NextComponent.hasOwnProperty(key)) { return; } // Skip non-configurable statics var proxyDescriptor = Object.getOwnPropertyDescriptor(ProxyComponent, key); if (proxyDescriptor && !proxyDescriptor.configurable) { return; } var prevDescriptor = PreviousComponent && Object.getOwnPropertyDescriptor(PreviousComponent, key); var savedDescriptor = savedDescriptors[key]; // Skip redefined descriptors if (prevDescriptor && savedDescriptor && !shallowEqual(savedDescriptor, prevDescriptor)) { return; } safeDefineProperty(ProxyComponent, key, { value: undefined }); }); return savedDescriptors; } function mergeComponents(ProxyComponent, NextComponent, InitialComponent, lastInstance, injectedMembers) { var injectedCode = {}; try { var nextInstance = safeReactConstructor(NextComponent, lastInstance); try { // Bypass babel class inheritance checking deepPrototypeUpdate(InitialComponent, NextComponent); } catch (e) { // It was ES6 class } var proxyInstance = safeReactConstructor(ProxyComponent, lastInstance); if (!nextInstance || !proxyInstance) { return injectedCode; } var mergedAttrs = _extends({}, proxyInstance, nextInstance); var hasRegenerate = proxyInstance[REGENERATE_METHOD]; var ownKeys = getOwnKeys(Object.getPrototypeOf(ProxyComponent.prototype)); Object.keys(mergedAttrs).forEach(function (key) { if (key.indexOf(PREFIX) === 0) return; var nextAttr = nextInstance[key]; var prevAttr = proxyInstance[key]; if (nextAttr) { if (isNativeFunction(nextAttr) || isNativeFunction(prevAttr)) { // this is bound method var isSameArity = nextAttr.length === prevAttr.length; var existsInPrototype = ownKeys.indexOf(key) >= 0 || ProxyComponent.prototype[key]; if ((isSameArity || !prevAttr) && existsInPrototype) { if (hasRegenerate) { injectedCode[key] = 'Object.getPrototypeOf(this)[\'' + key + '\'].bind(this)'; } else { logger.warn('React Hot Loader:,', 'Non-controlled class', ProxyComponent.name, 'contains a new native or bound function ', key, nextAttr, '. Unable to reproduce'); } } else { logger.warn('React Hot Loader:', 'Updated class ', ProxyComponent.name, 'contains native or bound function ', key, nextAttr, '. Unable to reproduce, use arrow functions instead.', '(arity: ' + nextAttr.length + '/' + prevAttr.length + ', proto: ' + (existsInPrototype ? 'yes' : 'no')); } return; } var nextString = String(nextAttr); var injectedBefore = injectedMembers[key]; var isArrow = nextString.indexOf('=>') >= 0; var isFunction = nextString.indexOf('function') >= 0 || isArrow; var referToThis = nextString.indexOf('this') >= 0; if (nextString !== String(prevAttr) || injectedBefore && nextString !== String(injectedBefore) || isArrow && referToThis) { if (!hasRegenerate) { if (!isFunction) { // just copy prop over injectedCode[key] = nextAttr; } else { logger.warn('React Hot Loader:', ' Updated class ', ProxyComponent.name, 'had different code for', key, nextAttr, '. Unable to reproduce. Regeneration support needed.'); } } else { injectedCode[key] = nextAttr; } } } }); } catch (e) { logger.warn('React Hot Loader:', e); } return injectedCode; } function checkLifeCycleMethods(ProxyComponent, NextComponent) { try { var p1 = Object.getPrototypeOf(ProxyComponent.prototype); var p2 = NextComponent.prototype; reactLifeCycleMountMethods.forEach(function (key) { var d1 = Object.getOwnPropertyDescriptor(p1, key) || { value: p1[key] }; var d2 = Object.getOwnPropertyDescriptor(p2, key) || { value: p2[key] }; if (!shallowStringsEqual(d1, d2)) { logger.warn('React Hot Loader:', 'You did update', ProxyComponent.name, 's lifecycle method', key, '. Unable to repeat'); } }); } catch (e) { // Ignore errors } } function inject(target, currentGeneration, injectedMembers) { if (target[GENERATION] !== currentGeneration) { var hasRegenerate = !!target[REGENERATE_METHOD]; Object.keys(injectedMembers).forEach(function (key) { try { if (hasRegenerate) { var usedThis = String(injectedMembers[key]).match(/_this([\d]+)/gi) || []; target[REGENERATE_METHOD](key, '(function REACT_HOT_LOADER_SANDBOX () {\n var _this = this; // common babel transpile\n ' + usedThis.map(function (name) { return 'var ' + name + ' = this;'; }) + '\n\n return ' + injectedMembers[key] + ';\n }).call(this)'); } else { target[key] = injectedMembers[key]; } } catch (e) { logger.warn('React Hot Loader: Failed to regenerate method ', key, ' of class ', target); logger.warn('got error', e); } }); target[GENERATION] = currentGeneration; } } var has = Object.prototype.hasOwnProperty; var proxies = new WeakMap(); var resetClassProxies = function resetClassProxies() { proxies = new WeakMap(); }; var blackListedClassMembers = ['constructor', 'render', 'componentWillMount', 'componentDidMount', 'componentDidCatch', 'componentWillReceiveProps', 'componentWillUnmount', 'hotComponentRender', 'getInitialState', 'getDefaultProps']; var defaultRenderOptions = { componentWillRender: identity, componentDidUpdate: function componentDidUpdate(result) { return result; }, componentDidRender: function componentDidRender(result) { return result; } }; var filteredPrototypeMethods = function filteredPrototypeMethods(Proto) { return Object.getOwnPropertyNames(Proto).filter(function (prop) { var descriptor = Object.getOwnPropertyDescriptor(Proto, prop); return descriptor && prop.indexOf(PREFIX) !== 0 && blackListedClassMembers.indexOf(prop) < 0 && typeof descriptor.value === 'function'; }); }; var defineClassMember = function defineClassMember(Class, methodName, methodBody) { return safeDefineProperty(Class.prototype, methodName, { configurable: true, writable: true, enumerable: false, value: methodBody }); }; var defineClassMembers = function defineClassMembers(Class, methods) { return Object.keys(methods).forEach(function (methodName) { return defineClassMember(Class, methodName, methods[methodName]); }); }; var setSFPFlag = function setSFPFlag(component, flag) { return safeDefineProperty(component, 'isStatelessFunctionalProxy', { configurable: false, writable: false, enumerable: false, value: flag }); }; var copyMethodDescriptors = function copyMethodDescriptors(target, source) { if (source) { // it is possible to use `function-double` to construct an ideal clone, but does not make a sence var keys = Object.getOwnPropertyNames(source); keys.forEach(function (key) { return safeDefineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); safeDefineProperty(target, 'toString', { configurable: true, writable: false, enumerable: false, value: function toString() { return String(source); } }); } return target; }; var knownClassComponents = []; var forEachKnownClass = function forEachKnownClass(cb) { return knownClassComponents.forEach(cb); }; function createClassProxy(InitialComponent, proxyKey) { var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; var renderOptions = _extends({}, defaultRenderOptions, options); var proxyConfig = _extends({}, configuration, options.proxy); // Prevent double wrapping. // Given a proxy class, return the existing proxy managing it. var existingProxy = proxies.get(InitialComponent); if (existingProxy) { return existingProxy; } var CurrentComponent = void 0; var savedDescriptors = {}; var injectedMembers = {}; var proxyGeneration = 0; var classUpdatePostponed = null; var instancesCount = 0; var isFunctionalComponent = !isReactClass(InitialComponent); var lastInstance = null; function postConstructionAction() { this[GENERATION] = 0; lastInstance = this; // is there is an update pending if (classUpdatePostponed) { var callUpdate = classUpdatePostponed; classUpdatePostponed = null; callUpdate(); } // As long we can't override constructor // every class shall evolve from a base class inject(this, proxyGeneration, injectedMembers); } function proxiedUpdate() { if (this) { inject(this, proxyGeneration, injectedMembers); } } function lifeCycleWrapperFactory(wrapperName) { var sideEffect = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : identity; return copyMethodDescriptors(function wrappedMethod() { proxiedUpdate.call(this); sideEffect(this); for (var _len = arguments.length, rest = Array(_len), _key = 0; _key < _len; _key++) { rest[_key] = arguments[_key]; } return !isFunctionalComponent && CurrentComponent.prototype[wrapperName] && CurrentComponent.prototype[wrapperName].apply(this, rest); }, InitialComponent.prototype && InitialComponent.prototype[wrapperName]); } function methodWrapperFactory(wrapperName, realMethod) { return copyMethodDescriptors(function wrappedMethod() { for (var _len2 = arguments.length, rest = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { rest[_key2] = arguments[_key2]; } return realMethod.apply(this, rest); }, realMethod); } var fakeBasePrototype = function fakeBasePrototype(Proto) { return filteredPrototypeMethods(Proto).reduce(function (acc, key) { acc[key] = methodWrapperFactory(key, Proto[key]); return acc; }, {}); }; var componentDidMount = lifeCycleWrapperFactory('componentDidMount', function (target) { target[PROXY_IS_MOUNTED] = true; target[RENDERED_GENERATION] = get$1(); instancesCount++; }); var componentDidUpdate = lifeCycleWrapperFactory('componentDidUpdate', renderOptions.componentDidUpdate); var componentWillUnmount = lifeCycleWrapperFactory('componentWillUnmount', function (target) { target[PROXY_IS_MOUNTED] = false; instancesCount--; }); function hotComponentRender() { // repeating subrender call to keep RENDERED_GENERATION up to date renderOptions.componentWillRender(this); proxiedUpdate.call(this); var result = void 0; // We need to use hasOwnProperty here, as the cached result is a React node // and can be null or some other falsy value. if (has.call(this, CACHED_RESULT)) { result = this[CACHED_RESULT]; delete this[CACHED_RESULT]; } else if (isFunctionalComponent) { result = CurrentComponent(this.props, this.context); } else { var renderMethod = CurrentComponent.prototype.render || this.render; /* eslint-disable no-use-before-define */ if (renderMethod === proxiedRender) { throw new Error('React-Hot-Loader: you are trying to render Component without .render method'); } /* eslint-enable */ result = renderMethod.apply(this, // eslint-disable-next-line prefer-rest-params arguments); } return renderOptions.componentDidRender.call(this, result); } function hotComponentUpdate() { renderOptions.componentWillRender(this); proxiedUpdate.call(this); } function proxiedRender() { renderOptions.componentWillRender(this); for (var _len3 = arguments.length, args = Array(_len3), _key3 = 0; _key3 < _len3; _key3++) { args[_key3] = arguments[_key3]; } return hotComponentRender.call.apply(hotComponentRender, [this].concat(args)); } var defineProxyMethods = function defineProxyMethods(Proxy) { var Base = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; defineClassMembers(Proxy, _extends({}, fakeBasePrototype(Base), proxyConfig.pureRender ? {} : { render: proxiedRender }, { hotComponentRender: hotComponentRender, hotComponentUpdate: hotComponentUpdate, componentDidMount: componentDidMount, componentDidUpdate: componentDidUpdate, componentWillUnmount: componentWillUnmount })); }; var _ProxyFacade = void 0; var ProxyComponent = null; var proxy = void 0; if (!isFunctionalComponent) { // Component ProxyComponent = proxyClassCreator(InitialComponent, postConstructionAction); defineProxyMethods(ProxyComponent, InitialComponent.prototype); knownClassComponents.push(ProxyComponent); _ProxyFacade = ProxyComponent; } else if (!proxyConfig.allowSFC) { proxyConfig.pureRender = false; // SFC Converted to component. Does not support returning precreated instances from render. ProxyComponent = proxyClassCreator(React.Component, postConstructionAction); defineProxyMethods(ProxyComponent); _ProxyFacade = ProxyComponent; } else { // SFC // This function only gets called for the initial mount. The actual // rendered component instance will be the return value. // eslint-disable-next-line func-names _ProxyFacade = function ProxyFacade(props, context) { /* ! THIS IS NOT YOUR COMPONENT ! ! THIS IS REACT-HOT-LOADER ! And you are probably looking for a function component of yours It's hidden, but there is a way to fix this - just reconfigure your application a bit see https://github.com/gaearon/react-hot-loader/issues/1311 */ var result = CurrentComponent(props, context); // This is a Relay-style container constructor. We can't do the prototype- // style wrapping for this as we do elsewhere, so just we just pass it // through as-is. if (isReactClassInstance(result)) { ProxyComponent = null; // Relay lazily sets statics like getDerivedStateFromProps on initial // render in lazy construction, so we need to do the same here. transferStaticProps(_ProxyFacade, savedDescriptors, null, CurrentComponent); return result; } // simple SFC, could continue to be SFC if (proxyConfig.pureSFC) { if (!CurrentComponent.contextTypes) { if (!_ProxyFacade.isStatelessFunctionalProxy) { setSFPFlag(_ProxyFacade, true); } return renderOptions.componentDidRender(result); } } setSFPFlag(_ProxyFacade, false); proxyConfig.pureRender = false; // Otherwise, it's a normal functional component. Build the real proxy // and use it going forward. ProxyComponent = proxyClassCreator(React.Component, postConstructionAction); defineProxyMethods(ProxyComponent); var determinateResult = new ProxyComponent(props, context); // Cache the initial render result so we don't call the component function // a second time for the initial render. determinateResult[CACHED_RESULT] = result; return determinateResult; }; } function get$$1() { return _ProxyFacade; } function getCurrent() { return CurrentComponent; } safeDefineProperty(_ProxyFacade, UNWRAP_PROXY, { configurable: false, writable: false, enumerable: false, value: getCurrent }); safeDefineProperty(_ProxyFacade, PROXY_KEY, { configurable: false, writable: false, enumerable: false, value: proxyKey }); safeDefineProperty(_ProxyFacade, 'toString', { configurable: true, writable: false, enumerable: false, value: function toString() { return String(CurrentComponent); } }); function update(NextComponent) { if (typeof NextComponent !== 'function') { throw new Error('Expected a constructor.'); } if (NextComponent === CurrentComponent) { return false; } // Prevent proxy cycles var existingProxy = proxies.get(NextComponent); if (existingProxy) { return false; } isFunctionalComponent = !isReactClass(NextComponent); proxies.set(NextComponent, proxy); proxyGeneration++; // Save the next constructor so we call it var PreviousComponent = CurrentComponent; CurrentComponent = NextComponent; // Try to infer displayName var displayName = getComponentDisplayName(CurrentComponent); safeDefineProperty(_ProxyFacade, 'displayName', { configurable: true, writable: false, enumerable: true, value: displayName }); if (ProxyComponent) { safeDefineProperty(ProxyComponent, 'name', { value: displayName }); } savedDescriptors = transferStaticProps(_ProxyFacade, savedDescriptors, PreviousComponent, NextComponent); if (isFunctionalComponent || !ProxyComponent) ; else { var classHotReplacement = function classHotReplacement() { checkLifeCycleMethods(ProxyComponent, NextComponent); if (proxyGeneration > 1) { getElementCloseHook(ProxyComponent); filteredPrototypeMethods(ProxyComponent.prototype).forEach(function (methodName) { if (!has.call(NextComponent.prototype, methodName)) { delete ProxyComponent.prototype[methodName]; } }); } Object.setPrototypeOf(ProxyComponent.prototype, NextComponent.prototype); defineProxyMethods(ProxyComponent, NextComponent.prototype); if (proxyGeneration > 1) { injectedMembers = mergeComponents(ProxyComponent, NextComponent, InitialComponent, lastInstance, injectedMembers); getElementComparisonHook(ProxyComponent); } }; // Was constructed once if (instancesCount > 0) { classHotReplacement(); } else { classUpdatePostponed = classHotReplacement; } } return true; } update(InitialComponent); var dereference = function dereference() { proxies.delete(InitialComponent); proxies.delete(_ProxyFacade); proxies.delete(CurrentComponent); }; proxy = { get: get$$1, update: update, dereference: dereference, getCurrent: function getCurrent() { return CurrentComponent; } }; proxies.set(InitialComponent, proxy); proxies.set(_ProxyFacade, proxy); safeDefineProperty(proxy, UNWRAP_PROXY, { configurable: false, writable: false, enumerable: false, value: getCurrent }); return proxy; } // this counter tracks `register` invocations. // works good, but code splitting is breaking it var generation = 1; // these counters are aimed to mitigate the "first render" var hotComparisonCounter = 0; var hotComparisonRuns = 0; var hotReplacementGeneration = 0; var nullFunction = function nullFunction() { return {}; }; // these callbacks would be called on component update var onHotComparisonOpen = nullFunction; var onHotComparisonElement = nullFunction; var onHotComparisonClose = nullFunction; // inversion of control var setComparisonHooks = function setComparisonHooks(open, element, close) { onHotComparisonOpen = open; onHotComparisonElement = element; onHotComparisonClose = close; }; var getElementComparisonHook = function getElementComparisonHook(component) { return onHotComparisonElement(component); }; var getElementCloseHook = function getElementCloseHook(component) { return onHotComparisonClose(component); }; var hotComparisonOpen = function hotComparisonOpen() { return hotComparisonCounter > 0 && hotComparisonRuns > 0 && hotReplacementGeneration > 0; }; var openGeneration = function openGeneration() { return forEachKnownClass(onHotComparisonElement); }; var closeGeneration = function closeGeneration() { return forEachKnownClass(onHotComparisonClose); }; var incrementHot = function incrementHot() { if (!hotComparisonCounter) { openGeneration(); onHotComparisonOpen(); } hotComparisonCounter++; }; var decrementHot = function decrementHot() { hotComparisonCounter--; if (!hotComparisonCounter) { closeGeneration(); hotComparisonRuns++; } }; // TODO: shall it be called from incrementHotGeneration? var enterHotUpdate = function enterHotUpdate() { Promise.resolve(incrementHot()).then(function () { return setTimeout(decrementHot, 0); }); }; // TODO: deprecate? var increment = function increment() { enterHotUpdate(); return generation++; }; var get$1 = function get() { return generation; }; // These counters tracks HMR generations, and probably should be used instead of the old one var incrementHotGeneration = function incrementHotGeneration() { return hotReplacementGeneration++; }; var getHotGeneration = function getHotGeneration() { return hotReplacementGeneration; }; // some `empty` names, React can autoset display name to... var UNDEFINED_NAMES = { Unknown: true, Component: true }; var areNamesEqual = function areNamesEqual(a, b) { return a === b || UNDEFINED_NAMES[a] && UNDEFINED_NAMES[b]; }; var isFunctional = function isFunctional(fn) { return typeof fn === 'function'; }; var getTypeOf = function getTypeOf(type) { if (isReactClass(type)) return 'ReactComponent'; if (isFunctional(type)) return 'StatelessFunctional'; return 'Fragment'; // ? }; function clearStringFast(str) { return str.length < 12 ? str : (' ' + str).slice(1); } var haveTextSimilarity = function haveTextSimilarity(a, b) { return ( // equal or slight changed a === b || levenshtein.get(clearStringFast(a), clearStringFast(b)) < a.length * 0.2 ); }; var getBaseProto = function getBaseProto(source) { return source.prototype.hotComponentRender ? Object.getPrototypeOf(source.prototype) : source.prototype; }; var equalClasses = function equalClasses(a, b) { var prototypeA = getBaseProto(a); var prototypeB = getBaseProto(b); var hits = 0; var misses = 0; var comparisons = 0; Object.getOwnPropertyNames(prototypeA).forEach(function (key) { var descriptorA = Object.getOwnPropertyDescriptor(prototypeA, key); var valueA = descriptorA && (descriptorA.value || descriptorA.get || descriptorA.set); var descriptorB = Object.getOwnPropertyDescriptor(prototypeB, key); var valueB = descriptorB && (descriptorB.value || descriptorB.get || descriptorB.set); if (typeof valueA === 'function' && key !== 'constructor') { comparisons++; if (haveTextSimilarity(String(valueA), String(valueB))) { hits++; } else { misses++; if (key === 'render') { misses++; } } } }); // allow to add or remove one function return hits > 0 && misses <= 1 || comparisons === 0; }; var areSwappable = function areSwappable(a, b) { // both are registered components and have the same name if (getIdByType(b) && getIdByType(a) === getIdByType(b)) { return true; } if (getTypeOf(a) !== getTypeOf(b)) { return false; } if (isReactClass(a)) { return areNamesEqual(getComponentDisplayName(a), getComponentDisplayName(b)) && equalClasses(a, b); } if (isFunctional(a)) { var nameA = getComponentDisplayName(a); if (!areNamesEqual(nameA, getComponentDisplayName(b))) { return false; } return nameA !== 'Component' || haveTextSimilarity(String(a), String(b)); } return false; }; function merge() { var acc = {}; for (var _len = arguments.length, sources = Array(_len), _key = 0; _key < _len; _key++) { sources[_key] = arguments[_key]; } for (var _iterator = sources, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) { var _ref; if (_isArray) { if (_i >= _iterator.length) break; _ref = _iterator[_i++]; } else { _i = _iterator.next(); if (_i.done) break; _ref = _i.value; } var source = _ref; if (source instanceof Array) { if (!(acc instanceof Array)) { acc = []; } acc = [].concat(acc, source); } else if (source instanceof Object) { for (var _iterator2 = Object.keys(source), _isArray2 = Array.isArray(_iterator2), _i2 = 0, _iterator2 = _isArray2 ? _iterator2 : _iterator2[Symbol.iterator]();;) { var _babelHelpers$extends; var _ref2; if (_isArray2) { if (_i2 >= _iterator2.length) break; _ref2 = _iterator2[_i2++]; } else { _i2 = _iterator2.next(); if (_i2.done) break; _ref2 = _i2.value; } var key = _ref2; var value = source[key]; if (value instanceof Object && key in acc) { value = merge(acc[key], value); } acc = _extends({}, acc, (_babelHelpers$extends = {}, _babelHelpers$extends[key] = value, _babelHelpers$extends)); } } } return acc; } var signatures = void 0; var proxiesByID = void 0; var blackListedProxies = void 0; var registeredComponents = void 0; var idsByType = void 0; var elementCount = 0; var renderOptions = {}; var componentOptions = void 0; var generateTypeId = function generateTypeId() { return 'auto-' + elementCount++; }; var getIdByType = function getIdByType(type) { return idsByType.get(type); }; var isProxyType = function isProxyType(type) { return type[PROXY_KEY]; }; var getProxyById = function getProxyById(id) { return proxiesByID[id]; }; var getProxyByType = function getProxyByType(type) { return getProxyById(getIdByType(type)); }; var registerComponent = function registerComponent(type) { return registeredComponents.set(type, 1); }; var isRegisteredComponent = function isRegisteredComponent(type) { return registeredComponents.has(type); }; var setStandInOptions = function setStandInOptions(options) { renderOptions = options; }; var updateFunctionProxyById = function updateFunctionProxyById(id, type, updater) { // Remember the ID. idsByType.set(type, id); var proxy = proxiesByID[id]; if (!proxy) { proxiesByID[id] = type; } updater(proxiesByID[id], type); // proxiesByID[id] = type; // keep the first ref return proxiesByID[id]; }; var updateProxyById = function updateProxyById(id, type) { var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; if (!id) { return null; } // Remember the ID. idsByType.set(type, id); if (!proxiesByID[id]) { proxiesByID[id] = createClassProxy(type, id, merge({}, renderOptions, { proxy: componentOptions.get(type) || {} }, options)); } else if (proxiesByID[id].update(type)) { // proxy could be registered again only in case of HMR incrementHotGeneration(); } return proxiesByID[id]; }; var createProxyForType = function createProxyForType(type, options) { return getProxyByType(type) || updateProxyById(generateTypeId(), type, options); }; var isColdType = function isColdType(type) { return blackListedProxies.has(type); }; var isTypeBlacklisted = function isTypeBlacklisted(type) { return isColdType(type) || isCompositeComponent(type) && (configuration.ignoreSFC && !isReactClass(type) || configuration.ignoreComponents && isReactClass(type)); }; var blacklistByType = function blacklistByType(type) { return blackListedProxies.set(type, true); }; var setComponentOptions = function setComponentOptions(component, options) { return componentOptions.set(component, options); }; var addSignature = function addSignature(type, signature) { return signatures.set(type, signature); }; var getSignature = function getSignature(type) { return signatures.get(type); }; var resetProxies = function resetProxies() { proxiesByID = {}; idsByType = new WeakMap(); blackListedProxies = new WeakMap(); registeredComponents = new WeakMap(); componentOptions = new WeakMap(); signatures = new WeakMap(); resetClassProxies(); }; resetProxies(); var tune = { allowSFC: false }; var preactAdapter = function preactAdapter(instance, resolveType) { var oldHandler = instance.options.vnode; setConfiguration(tune); instance.options.vnode = function (vnode) { if (vnode.type) { vnode.type = resolveType(vnode.type); } else if (vnode.nodeName) { vnode.nodeName = resolveType(vnode.nodeName); } if (oldHandler) { oldHandler(vnode); } }; }; /* global document */ var lastError = []; var overlayStyle = { position: 'fixed', left: 0, top: 0, right: 0, backgroundColor: 'rgba(255,200,200,0.9)', color: '#000', fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif', fontSize: '12px', margin: 0, padding: '16px', maxHeight: '50%', overflow: 'auto', zIndex: 10000 }; var inlineErrorStyle = { backgroundColor: '#FEE' }; var liCounter = { position: 'absolute', left: '10px' }; var listStyle = {}; var EmptyErrorPlaceholder = function EmptyErrorPlaceholder(_ref) { var component = _ref.component; return React__default.createElement( 'span', { style: inlineErrorStyle, role: 'img', 'aria-label': 'Rect-Hot-Loader Error' }, '\u269B\uFE0F\uD83D\uDD25\uD83E\uDD15 (', component ? getComponentDisplayName(component.constructor || component) : 'Unknown location', ')', component && component.retryHotLoaderError && React__default.createElement( 'button', { onClick: function onClick() { return component.retryHotLoaderError(); }, title: 'Retry' }, '\u27F3' ) ); }; var errorHeader = function errorHeader(component, componentStack) { if (component || componentStack) { return React__default.createElement( 'span', null, '(', component ? getComponentDisplayName(component.constructor || component) : 'Unknown location', component && ', ', componentStack && componentStack.split('\n').filter(Boolean)[0], ')' ); } return null; }; var mapError = function mapError(_ref2) { var error = _ref2.error, errorInfo = _ref2.errorInfo, component = _ref2.component; if (!error) { error = { message: 'undefined error' }; } return React__default.createElement( React__default.Fragment, null, React__default.createElement( 'p', { style: { color: 'red' } }, errorHeader(component, errorInfo && errorInfo.componentStack), ' ', error.toString ? error.toString() : error && error.message || 'undefined error' ), errorInfo && errorInfo.componentStack ? React__default.createElement( 'div', null, React__default.createElement( 'div', null, 'Stack trace:' ), React__default.createElement( 'ul', { style: { color: 'red', marginTop: '10px' } }, error.stack.split('\n').slice(1, 2).map(function (line, i) { return React__default.createElement( 'li', { key: String(i) }, line ); }), React__default.createElement('hr', null), errorInfo.componentStack.split('\n').filter(Boolean).map(function (line, i) { return React__default.createElement( 'li', { key: String(i) }, line ); }) ) ) : error.stack && React__default.createElement( 'div', null, React__default.createElement( 'div', null, 'Stack trace:' ), React__default.createElement( 'ul', { style: { color: 'red', marginTop: '10px' } }, error.stack.split('\n').map(function (line, i) { return React__default.createElement( 'li', { key: String(i) }, line ); }) ) ) ); }; var ErrorOverlay = function (_React$Component) { inherits(ErrorOverlay, _React$Component); function ErrorOverlay() { var _temp, _this, _ret; classCallCheck(this, ErrorOverlay); for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } return _ret = (_temp = (_this = possibleConstructorReturn(this, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _this.state = { visible: true }, _this.toggle = function () { return _this.setState({ visible: !_this.state.visible }); }, _this.retry = function () { return _this.setState(function () { var errors = _this.props.errors; enterHotUpdate(); clearExceptions(); errors.map(function (_ref3) { var component = _ref3.component; return component; }).filter(Boolean).filter(function (_ref4) { var retryHotLoaderError = _ref4.retryHotLoaderError; return !!retryHotLoaderError; }).forEach(function (component) { return component.retryHotLoaderError(); }); return {}; }); }, _temp), possibleConstructorReturn(_this, _ret); } ErrorOverlay.prototype.render = function render() { var errors = this.props.errors; if (!errors.length) { return null; } var visible = this.state.visible; return React__default.createElement( 'div', { style: overlayStyle }, React__default.createElement( 'h2', { style: { margin: 0 } }, '\u269B\uFE0F\uD83D\uDD25\uD83D\uDE2D: hot update was not successful ', React__default.createElement( 'button', { onClick: this.toggle }, visible ? 'collapse' : 'expand' ), React__default.createElement( 'button', { onClick: this.retry }, 'Retry' ) ), visible && React__default.createElement( 'ul', { style: listStyle }, errors.map(function (err, i) { return React__default.createElement( 'li', { key: i }, React__default.createElement( 'span', { style: liCounter }, '(', i + 1, '/', errors.length, ')' ), mapError(err) ); }) ) ); }; return ErrorOverlay; }(React__default.Component); var initErrorOverlay = function initErrorOverlay() { if (typeof document === 'undefined' || !document.body) { return; } var div = document.querySelector('.react-hot-loader-error-overlay'); if (!div) { div = document.createElement('div'); div.className = 'react-hot-loader-error-overlay'; document.body.appendChild(div); } if (lastError.length) { var Overlay = configuration.ErrorOverlay || ErrorOverlay; ReactDOM.render(React__default.createElement(Overlay, { errors: lastError }), div); } else { div.parentNode.removeChild(div); } }; function clearExceptions() { if (lastError.length) { lastError = []; initErrorOverlay(); } } function logException(error, errorInfo, component) { // do not suppress error /* eslint-disable no-console */ console.error(error); /* eslint-enable */ lastError.push({ error: error, errorInfo: errorInfo, component: component }); initErrorOverlay(); } /* eslint-disable no-underscore-dangle */ var hotRenderWithHooks = ReactDOM.hotRenderWithHooks || function (fiber, render) { return render(); }; function pushStack(stack, node) { stack.type = node.type; stack.elementType = node.elementType || node.type; stack.children = []; stack.instance = typeof node.type === 'function' ? node.stateNode : stack; stack.fiber = node; if (!stack.instance) { stack.instance = { SFC_fake: stack.type, props: {}, render: function render() { return hotRenderWithHooks(node, function () { return stack.type(stack.instance.props); }); } }; } } function hydrateFiberStack(node, stack) { pushStack(stack, node); if (node.child) { var child = node.child; do { var childStack = {}; hydrateFiberStack(child, childStack); stack.children.push(childStack); child = child.sibling; } while (child); } } /* eslint-disable no-underscore-dangle */ function pushState(stack, type, instance) { stack.type = type; stack.elementType = type; stack.children = []; stack.instance = instance || stack; if (typeof type === 'function' && type.isStatelessFunctionalProxy) { // In React 15 SFC is wrapped by component. We have to detect our proxies and change the way it works stack.instance = { SFC_fake: type, props: {}, render: function render() { return type(stack.instance.props); } }; } } function hydrateLegacyStack(node, stack) { if (node._currentElement) { pushState(stack, node._currentElement.type, node._instance || stack); } if (node._renderedComponent) { var childStack = {}; hydrateLegacyStack(node._renderedComponent, childStack); stack.children.push(childStack); } else if (node._renderedChildren) { Object.keys(node._renderedChildren).forEach(function (key) { var childStack = {}; hydrateLegacyStack(node._renderedChildren[key], childStack); stack.children.push(childStack); }); } } var shouldNotPatchComponent = function shouldNotPatchComponent(type) { return isTypeBlacklisted(type); }; function resolveUtility(type) { // all "utility" types are resolved to their __initial__ shapes // that enables to never change reference to them, and gives the ability to maintain React Tree on HMR // all operations could be skipped with react-hot-dom enabled if ((typeof type === 'undefined' ? 'undefined' : _typeof(type)) === 'object') { if (configuration.integratedComparator) { return type; } var element = { type: type }; if (isLazyType(element) || isMemoType(element) || isForwardType(element) || isContextType(element)) { return getProxyByType(type) || type; } } return undefined; } function resolveComponent(type) { var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; var existingProxy = getProxyByType(type); // cold API if (shouldNotPatchComponent(type)) { return existingProxy ? existingProxy.getCurrent() : type; } if (!existingProxy && configuration.onComponentCreate) { configuration.onComponentCreate(type, getComponentDisplayName(type)); if (shouldNotPatchComponent(type)) { return type; } } var proxy = internalConfiguration.disableProxyCreation ? existingProxy : createProxyForType(type, options); return proxy ? proxy.get() : undefined; } function resolveProxy(type) { if (isProxyType(type)) { return type; } return undefined; } function resolveNotComponent(type) { if (!isCompositeComponent(type)) { return type; } return undefined; } var getLatestTypeVersion = function getLatestTypeVersion(type) { var existingProxy = getProxyByType(type); return existingProxy && existingProxy.getCurrent && existingProxy.getCurrent(); }; var resolveSimpleType = function resolveSimpleType(type) { if (!type) { return type; } var simpleResult = resolveProxy(type) || resolveUtility(type) || resolveNotComponent(type); if (simpleResult) { return simpleResult; } var lastType = getLatestTypeVersion(type); // only lazy loaded components any now failing into this branch // if (lastType && lastType !== type) { // console.warn('RHL: used type', type, 'is obsolete. Something is wrong with HMR.'); // } return lastType || type; }; var resolveType = function resolveType(type) { var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; if (!type) { return type; } return resolveProxy(type) || resolveUtility(type) || resolveNotComponent(type) || resolveComponent(type, options) || type; }; /* eslint-disable no-underscore-dangle */ function getReactStack(instance) { var rootNode = getInternalInstance(instance); var stack = {}; if (rootNode) { // React stack var isFiber = typeof rootNode.tag === 'number'; if (isFiber) { hydrateFiberStack(rootNode, stack); } else { hydrateLegacyStack(rootNode, stack); } } return stack; } var markUpdate = function markUpdate(_ref) { var fiber = _ref.fiber; // do not update what we should not if (!fiber || typeof fiber.type === 'string') { return; } var mostResentType = resolveType(fiber.type) || fiber.type; fiber.type = mostResentType; // do not change fiber.elementType to keep old information for the hot-update fiber.expirationTime = 1; if (fiber.alternate) { fiber.alternate.expirationTime = 1; fiber.alternate.type = fiber.type; } if (fiber.memoizedProps && _typeof(fiber.memoizedProps) === 'object') { fiber.memoizedProps = _extends({ cacheBusterProp: true }, fiber.memoizedProps); } if (fiber.stateNode) ; }; var cleanupReact = function cleanupReact() { if (ReactDOM.hotCleanup) { ReactDOM.hotCleanup(); } }; var deepMarkUpdate = function deepMarkUpdate(stack) { markUpdate(stack); if (stack.children) { stack.children.forEach(deepMarkUpdate); } }; var renderStack = []; var stackReport = function stackReport() { var rev = renderStack.slice().reverse(); logger.warn('in', rev[0].name, rev); }; var emptyMap = new Map(); var stackContext = function stackContext() { return (renderStack[renderStack.length - 1] || {}).context || emptyMap; }; var shouldUseRenderMethod = function shouldUseRenderMethod(fn) { return fn && (isReactClassInstance(fn) || fn.SFC_fake); }; var getElementType$1 = function getElementType$$1(child) { return child.type[UNWRAP_PROXY] ? child.type[UNWRAP_PROXY]() : child.type; }; var filterNullArray = function filterNullArray(a) { if (!a) return []; return a.filter(function (x) { return !!x; }); }; var unflatten = function unflatten(a) { return a.reduce(function (acc, a) { if (Array.isArray(a)) { acc.push.apply(acc, unflatten(a)); } else { acc.push(a); } return acc; }, []); }; var isArray = function isArray(fn) { return Array.isArray(fn); }; var asArray = function asArray(a) { return isArray(a) ? a : [a]; }; var render = function render(component, stack) { if (!component) { return []; } if (component.hotComponentUpdate) { component.hotComponentUpdate(); } if (shouldUseRenderMethod(component)) { // not calling real render method to prevent call recursion. // stateless components does not have hotComponentRender return component.hotComponentRender ? component.hotComponentRender() : component.render(); } if (isForwardType(component)) { // render forward type in a sandbox return hotRenderWithHooks(stack.fiber, function () { return component.type.render(component.props, null); }); } if (isArray(component)) { return component.map(render); } if (component.children) { return component.children; } return []; }; var NO_CHILDREN = { children: [] }; var mapChildren = function mapChildren(children, instances) { return { children: children.filter(function (c) { return c; }).map(function (child, index) { if ((typeof child === 'undefined' ? 'undefined' : _typeof(child)) !== 'object' || child.isMerged) { return child; } var instanceLine = instances[index] || {}; var oldChildren = asArray(instanceLine.children || []); if (Array.isArray(child)) { return _extends({ type: null }, mapChildren(child, oldChildren)); } var newChildren = asArray(child.props && child.props.children || child.children || []); var nextChildren = child.type !== 'function' && oldChildren.length && mapChildren(newChildren, oldChildren); return _extends({ nextProps: child.props, isMerged: true }, instanceLine, nextChildren || {}, { type: child.type }); }) }; }; var mergeInject = function mergeInject(a, b, instance) { if (a && !Array.isArray(a)) { return mergeInject([a], b); } if (b && !Array.isArray(b)) { return mergeInject(a, [b]); } if (!a || !b) { return NO_CHILDREN; } if (a.length === b.length) { return mapChildren(a, b); } // in some cases (no confidence here) B could contain A except null children // in some cases - could not. // this depends on React version and the way you build component. var nonNullA = filterNullArray(a); if (nonNullA.length === b.length) { return mapChildren(nonNullA, b); } var flatA = unflatten(nonNullA); var flatB = unflatten(b); if (flatA.length === flatB.length) { return mapChildren(flatA, flatB); } if (flatB.length === 0 && flatA.length === 1 && _typeof(flatA[0]) !== 'object') ; else if (!configuration.IS_REACT_MERGE_ENABLED) { logger.warn('React-hot-loader: unable to merge ', a, 'and children of ', instance); stackReport(); } return NO_CHILDREN; }; var transformFlowNode = function transformFlowNode(flow) { return flow.reduce(function (acc, node) { if (node && isFragmentNode(node)) { if (node.props && node.props.children) { return [].concat(acc, filterNullArray(asArray(node.props.children))); } if (node.children) { return [].concat(acc, filterNullArray(asArray(node.children))); } } return [].concat(acc, [node]); }, []); }; var scheduledUpdates = []; var scheduledUpdate = 0; var flushScheduledUpdates = function flushScheduledUpdates() { var instances = scheduledUpdates; scheduledUpdates = []; scheduledUpdate = 0; instances.forEach(function (instance) { return instance[PROXY_IS_MOUNTED] && updateInstance(instance); }); }; var unscheduleUpdate = function unscheduleUpdate(instance) { scheduledUpdates = scheduledUpdates.filter(function (inst) { return inst !== instance; }); }; var scheduleInstanceUpdate = function scheduleInstanceUpdate(instance) { scheduledUpdates.push(instance); if (!scheduledUpdate) { scheduledUpdate = setTimeout(flushScheduledUpdates, 4); } }; var hotReplacementRender = function hotReplacementRender(instance, stack) { if (isReactClassInstance(instance)) { var type = getElementType$1(stack); renderStack.push({ name: getComponentDisplayName(type), type: type, props: stack.instance.props, context: stackContext() }); } try { var flow = transformFlowNode(filterNullArray(asArray(render(instance, stack)))); var children = stack.children; flow.forEach(function (child, index) { var childType = child.type; var stackChild = children[index]; var next = function next(instance) { // copy over props as long new component may be hidden inside them // child does not have all props, as long some of them can be calculated on componentMount. var realProps = instance.props; var nextProps = _extends({}, realProps, child.nextProps || {}, child.props || {}); if (isReactClassInstance(instance) && instance.componentWillUpdate) { // Force-refresh component (bypass redux renderedComponent) instance.componentWillUpdate(_extends({}, realProps), instance.state); } instance.props = nextProps; hotReplacementRender(instance, stackChild); instance.props = realProps; }; // text node if ((typeof child === 'undefined' ? 'undefined' : _typeof(child)) !== 'object' || !stackChild || !stackChild.instance) { if (stackChild && stackChild.children && stackChild.children.length) { logger.error('React-hot-loader: reconciliation failed', 'could not dive into [', child, '] while some elements are still present in the tree.'); stackReport(); } return; } // comparing rendered type to fiber.ElementType if ((typeof childType === 'undefined' ? 'undefined' : _typeof(childType)) !== _typeof(stackChild.elementType)) { // Portals could generate undefined !== null if (childType && stackChild.type) { logger.warn('React-hot-loader: got ', childType, 'instead of', stackChild.type); stackReport(); } return; } if (isMemoType(child) || isLazyType(child)) { // force update memo children if (stackChild.children && stackChild.children[0]) { scheduleInstanceUpdate(stackChild.children[0].instance); } childType = childType.type || childType; } if (isForwardType(child)) { next(stackChild.instance); } else if (isContextConsumer(child)) { try { var contextValue = stackContext().get(getContextProvider(childType)); next({ children: (child.props ? child.props.children : child.children[0])(contextValue !== undefined ? contextValue : childType[CONTEXT_CURRENT_VALUE]) }); } catch (e) { // do nothing, yet } } else if (typeof childType !== 'function') { // React var childName = childType ? getComponentDisplayName(childType) : 'empty'; var extraContext = stackContext(); if (isContextProvider(child)) { extraContext = new Map(extraContext); extraContext.set(getContextProvider(childType), _extends({}, child.nextProps || {}, child.props || {}).value); childName = 'ContextProvider'; } renderStack.push({ name: childName, type: childType, props: stack.instance.props, context: extraContext }); next( // move types from render to the instances of hydrated tree mergeInject(transformFlowNode(asArray(child.props ? child.props.children : child.children)), stackChild.instance.children, stackChild.instance)); renderStack.pop(); } else { if (childType === stackChild.type) { next(stackChild.instance); } else { // unwrap proxy var _childType = getElementType$1(child); if (isMemoType(child)) { _childType = _childType.type || _childType; } if (!stackChild.type[PROXY_KEY]) { if (!configuration.IS_REACT_MERGE_ENABLED) { if (isTypeBlacklisted(stackChild.type)) { logger.warn('React-hot-loader: cold element got updated ', stackChild.type); } } } if (isRegisteredComponent(_childType) || isRegisteredComponent(stackChild.type)) { // one of elements are registered via babel plugin, and should not be handled by hot swap if (resolveType(_childType) === resolveType(stackChild.type)) { next(stackChild.instance); } } else if (areSwappable(_childType, stackChild.type)) { // they are both registered, or have equal code/displayname/signature // update proxy using internal PROXY_KEY updateProxyById(stackChild.type[PROXY_KEY] || getIdByType(stackChild.type), _childType); next(stackChild.instance); } else { logger.warn('React-hot-loader: a ' + getComponentDisplayName(_childType) + ' was found where a ' + getComponentDisplayName(stackChild) + ' was expected.\n ' + _childType); stackReport(); } } scheduleInstanceUpdate(stackChild.instance); } }); } catch (e) { if (e.then) ; else { logger.warn('React-hot-loader: run time error during reconciliation', e); } } if (isReactClassInstance(instance)) { renderStack.pop(); } }; var hotReplacementRender$1 = (function (instance, stack) { if (configuration.disableHotRenderer) { return; } try { // disable reconciler to prevent upcoming components from proxying. internalConfiguration.disableProxyCreation = true; renderStack = []; hotReplacementRender(instance, stack); } catch (e) { logger.warn('React-hot-loader: reconcilation failed due to error', e); } finally { internalConfiguration.disableProxyCreation = false; } }); var reconcileHotReplacement = function reconcileHotReplacement(ReactInstance) { var stack = getReactStack(ReactInstance); hotReplacementRender$1(ReactInstance, stack); cleanupReact(); deepMarkUpdate(stack); }; var renderReconciler = function renderReconciler(target, force) { // we are not inside parent reconcilation var currentGeneration = get$1(); var componentGeneration = target[RENDERED_GENERATION]; target[RENDERED_GENERATION] = currentGeneration; if (!internalConfiguration.disableProxyCreation) { if ((componentGeneration || force) && componentGeneration !== currentGeneration) { enterHotUpdate(); reconcileHotReplacement(target); return true; } } return false; }; function asyncReconciledRender(target) { renderReconciler(target, false); } function proxyWrapper(element) { // post wrap on post render if (!internalConfiguration.disableProxyCreation) { unscheduleUpdate(this); } if (!element) { return element; } if (Array.isArray(element)) { return element.map(proxyWrapper); } if (typeof element.type === 'function') { var proxy = getProxyByType(element.type); if (proxy) { return _extends({}, element, { type: proxy.get() }); } } return element; } var ERROR_STATE = 'react_hot_loader_catched_error'; var ERROR_STATE_PROTO = 'react_hot_loader_catched_error-prototype'; var OLD_RENDER = 'react_hot_loader_original_render'; function componentDidCatch(error, errorInfo) { this[ERROR_STATE] = { location: 'boundary', error: error, errorInfo: errorInfo, generation: get$1() }; Object.getPrototypeOf(this)[ERROR_STATE_PROTO] = this[ERROR_STATE]; if (!configuration.errorReporter) { logException(error, errorInfo, this); } this.forceUpdate(); } function componentRender() { var _ref = this[ERROR_STATE] || {}, error = _ref.error, errorInfo = _ref.errorInfo, generation = _ref.generation; if (error && generation === get$1()) { return React__default.createElement(configuration.errorReporter || EmptyErrorPlaceholder, { error: error, errorInfo: errorInfo, component: this }); } if (this.hotComponentUpdate) { this.hotComponentUpdate(); } try { var _OLD_RENDER$render; for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } return (_OLD_RENDER$render = this[OLD_RENDER].render).call.apply(_OLD_RENDER$render, [this].concat(args)); } catch (renderError) { this[ERROR_STATE] = { location: 'render', error: renderError, generation: get$1() }; if (!configuration.errorReporter) { logException(renderError, undefined, this); } return componentRender.call(this); } } function retryHotLoaderError() { delete this[ERROR_STATE]; this.forceUpdate(); } setComparisonHooks(function () { return {}; }, function (component) { if (!hotComparisonOpen()) { return; } var prototype = component.prototype; if (!prototype[OLD_RENDER]) { var renderDescriptior = Object.getOwnPropertyDescriptor(prototype, 'render'); prototype[OLD_RENDER] = { descriptor: renderDescriptior ? renderDescriptior.value : undefined, render: prototype.render }; prototype.componentDidCatch = componentDidCatch; prototype.retryHotLoaderError = retryHotLoaderError; prototype.render = componentRender; } delete prototype[ERROR_STATE]; }, function (_ref2) { var prototype = _ref2.prototype; if (prototype[OLD_RENDER]) { var _ref3 = prototype[ERROR_STATE_PROTO] || {}, generation = _ref3.generation; if (generation === get$1()) ; else { delete prototype.componentDidCatch; delete prototype.retryHotLoaderError; // undo only what we did if (prototype.render === componentRender) { if (!prototype[OLD_RENDER].descriptor) { delete prototype.render; } else { prototype.render = prototype[OLD_RENDER].descriptor; } } else { console.error('React-Hot-Loader: something unexpectedly mutated Component', prototype); } delete prototype[ERROR_STATE_PROTO]; delete prototype[OLD_RENDER]; } } }); setStandInOptions({ componentWillRender: asyncReconciledRender, componentDidRender: proxyWrapper, componentDidUpdate: function componentDidUpdate(component) { component[RENDERED_GENERATION] = get$1(); flushScheduledUpdates(); } }); var AppContainer = function (_React$Component) { inherits(AppContainer, _React$Component); AppContainer.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) { if (prevState.generation !== get$1()) { // Hot reload is happening. return { error: null, generation: get$1() }; } return null; }; function AppContainer(props) { classCallCheck(this, AppContainer); var _this = possibleConstructorReturn(this, _React$Component.call(this, props)); if (configuration.showReactDomPatchNotification) { configuration.showReactDomPatchNotification = false; console.warn('React-Hot-Loader: react-🔥-dom patch is not detected. React 16.6+ features may not work.'); } _this.state = { error: null, errorInfo: null, // eslint-disable-next-line react/no-unused-state generation: 0 }; return _this; } AppContainer.prototype.shouldComponentUpdate = function shouldComponentUpdate(prevProps, prevState) { // Don't update the component if the state had an error and still has one. // This allows to break an infinite loop of error -> render -> error -> render // https://github.com/gaearon/react-hot-loader/issues/696 if (prevState.error && this.state.error) { return false; } return true; }; AppContainer.prototype.componentDidCatch = function componentDidCatch(error, errorInfo) { logger.error(error); if (!hotComparisonOpen()) { // do not log error outside of HMR cycle // trigger update to kick error this.setState({}); throw error; } var _props$errorReporter = this.props.errorReporter, errorReporter = _props$errorReporter === undefined ? configuration.errorReporter : _props$errorReporter; if (!errorReporter) { logException(error, errorInfo, this); } this.setState({ error: error, errorInfo: errorInfo }); }; AppContainer.prototype.retryHotLoaderError = function retryHotLoaderError$$1() { var _this2 = this; this.setState({ error: null }, function () { retryHotLoaderError.call(_this2); }); }; AppContainer.prototype.render = function render() { var _state = this.state, error = _state.error, errorInfo = _state.errorInfo; var _props$errorReporter2 = this.props.errorReporter, ErrorReporter = _props$errorReporter2 === undefined ? configuration.errorReporter || EmptyErrorPlaceholder : _props$errorReporter2; if (error && this.props.errorBoundary) { return React__default.createElement(ErrorReporter, { error: error, errorInfo: errorInfo, component: this }); } if (this.hotComponentUpdate) { this.hotComponentUpdate(); } else { throw new Error('React-Hot-Loader: AppContainer should be patched'); } return React__default.Children.only(this.props.children); }; return AppContainer; }(React__default.Component); AppContainer.reactHotLoadable = false; AppContainer.propTypes = { children: function children(props) { if (React__default.Children.count(props.children) !== 1) { return new Error('Invalid prop "children" supplied to AppContainer. ' + 'Expected a single React element with your app’s root component, e.g. .'); } return undefined; }, errorReporter: PropTypes.oneOfType([PropTypes.node, PropTypes.func]), errorBoundary: PropTypes.bool }; AppContainer.defaultProps = { errorBoundary: true }; // trying first react-lifecycles-compat.polyfill, then trying react-lifecycles-compat, which could be .default var realPolyfill = defaultPolyfill.polyfill || defaultPolyfill__default; realPolyfill(AppContainer); var lazyConstructor = '_ctor'; var patchLazyConstructor = function patchLazyConstructor(target) { if (!configuration.trackTailUpdates && !target[lazyConstructor].isPatchedByReactHotLoader) { var ctor = target[lazyConstructor]; target[lazyConstructor] = function () { return ctor().then(function (m) { var C = resolveType(m.default); // chunks has been updated - new hot loader process is taking a place enterHotUpdate(); if (!React__default.forwardRef) { return { default: function _default(props) { return React__default.createElement( AppContainer, null, React__default.createElement(C, props) ); } }; } return { default: React__default.forwardRef(function (props, ref) { return React__default.createElement( AppContainer, null, React__default.createElement(C, _extends({}, props, { ref: ref })) ); }) }; }); }; target[lazyConstructor].isPatchedByReactHotLoader = true; } }; var updateLazy = function updateLazy(target, type) { var ctor = type[lazyConstructor]; if (target[lazyConstructor] !== type[lazyConstructor]) { // just execute `import` and RHL.register will do the job ctor(); } patchLazyConstructor(target); patchLazyConstructor(type); }; var updateMemo = function updateMemo(target, _ref) { var type = _ref.type; target.type = resolveType(type); }; var updateForward = function updateForward(target, _ref2) { var render = _ref2.render; target.render = render; }; var updateContext = function updateContext() { // nil }; var getInnerComponentType = function getInnerComponentType(component) { var unwrapper = component[UNWRAP_PROXY]; return unwrapper ? unwrapper() : component; }; function haveEqualSignatures(prevType, nextType) { try { var prevSignature = getSignature(prevType); var nextSignature = getSignature(nextType); if (prevSignature === undefined && nextSignature === undefined) { return true; } if (prevSignature === undefined || nextSignature === undefined) { return false; } if (prevSignature.key !== nextSignature.key) { return false; } // TODO: we might need to calculate previous signature earlier in practice, // such as during the first time a component is resolved. We'll revisit this. var prevCustomHooks = prevSignature.getCustomHooks(); var nextCustomHooks = nextSignature.getCustomHooks(); if (prevCustomHooks.length !== nextCustomHooks.length) { return false; } for (var i = 0; i < nextCustomHooks.length; i++) { if (!haveEqualSignatures(prevCustomHooks[i], nextCustomHooks[i])) { return false; } } } catch (e) { logger.error('React-Hot-Loader: error occurred while comparing hook signature', e); return false; } return true; } var areSignaturesCompatible = function areSignaturesCompatible(a, b) { // compare signatures of two components // non-equal component have to remount and there is two options to do it // - fail the comparison, remounting all tree below // - fulfill it, but set `_debugNeedsRemount` on a fiber to drop only local state // the second way is not published yet, so going with the first one if (!haveEqualSignatures(a, b)) { logger.warn('⚛️🔥🎣 Hook order change detected: component', a, 'has been remounted'); return false; } return true; }; var compareRegistered = function compareRegistered(a, b) { return getIdByType(a) === getIdByType(b) && getProxyByType(a) === getProxyByType(b) && areSignaturesCompatible(a, b); }; var areDeepSwappable = function areDeepSwappable(oldType, newType) { var type = { type: oldType }; if (typeof oldType === 'function') { return areSwappable(oldType, newType); } if (isForwardType(type)) { return areDeepSwappable(oldType.render, newType.render); } if (isMemoType(type)) { return areDeepSwappable(oldType.type, newType.type); } // that's not safe // if (isLazyType(type)) { // return areDeepSwappable(oldType._ctor, newType._ctor) // } return false; }; var compareComponents = function compareComponents(oldType, newType, setNewType, baseType) { var defaultResult = oldType === newType; if (oldType && !newType || !oldType && newType || (typeof oldType === 'undefined' ? 'undefined' : _typeof(oldType)) !== (typeof newType === 'undefined' ? 'undefined' : _typeof(newType)) || getElementType(oldType) !== getElementType(newType) || 0) { return defaultResult; } if (getIdByType(newType) || getIdByType(oldType)) { if (!compareRegistered(oldType, newType)) { return false; } defaultResult = true; } if (isForwardType({ type: oldType }) && isForwardType({ type: newType })) { if (!compareRegistered(oldType.render, newType.render)) { return false; } if (oldType.render === newType.render || areDeepSwappable(oldType, newType)) { setNewType(newType); return true; } return defaultResult; } if (isMemoType({ type: oldType }) && isMemoType({ type: newType })) { if (!compareRegistered(oldType.type, newType.type)) { return false; } if (oldType.type === newType.type || areDeepSwappable(oldType, newType)) { if (baseType) { // memo form different fibers, why? if (baseType.$$typeof === newType.$$typeof) { setNewType(newType); } else { setNewType(newType.type); } } else { logger.warn('Please update hot-loader/react-dom'); if (isReactClass(newType.type)) { setNewType(newType); } else { setNewType(newType.type); } } return true; } return defaultResult; } if (isLazyType({ type: oldType })) { updateLazy(oldType, newType); // no need to update // setNewType(newType); return defaultResult; } if (isContextType({ type: oldType })) { // update provider setNewType(newType); return defaultResult; } if (typeof newType === 'function' && (defaultResult || newType !== oldType && areSignaturesCompatible(newType, oldType) && areSwappable(newType, oldType))) { var unwrapFactory = newType[UNWRAP_PROXY]; var oldProxy = unwrapFactory && getProxyByType(unwrapFactory()); if (oldProxy) { oldProxy.dereference(); updateProxyById(oldType[PROXY_KEY] || getIdByType(oldType), getInnerComponentType(newType)); } else { setNewType(newType); } return true; } return defaultResult; }; var knownPairs = new WeakMap(); var emptyMap$1 = new WeakMap(); var getKnownPair = function getKnownPair(oldType, newType) { var pair = knownPairs.get(oldType) || emptyMap$1; return pair.get(newType); }; var hotComponentCompare = function hotComponentCompare(oldType, preNewType, setNewType, baseType) { var hotActive = hotComparisonOpen(); var newType = configuration.integratedResolver ? resolveType(preNewType) : preNewType; // TODO: find out the root cause // we could not use "fast result" here - go a full part to update a fiber. // const knownType = getKnownPair(oldType, newType); // if (knownType !== undefined) { // return knownType; // } var result = oldType === newType; if (hotActive) { // pre fail components which could not be merged if (!isReloadableComponent(oldType) || !isReloadableComponent(newType) || isColdType(oldType) || isColdType(oldType) || !oldType || !newType || 0) { return result; } result = compareComponents(oldType, newType, setNewType, baseType); var pair = knownPairs.get(oldType) || new WeakMap(); pair.set(newType, result); knownPairs.set(oldType, pair); return result; } // result - true if components are equal, or were "equal" at any point in the past return result || getKnownPair(oldType, newType) || false; }; /* eslint-disable no-use-before-define */ var forceSimpleSFC = { proxy: { pureSFC: true } }; var hookWrapper = function hookWrapper(hook) { var wrappedHook = function wrappedHook(cb, deps) { if (configuration.reloadHooks && deps) { var inputs = [].concat(deps); // reload hooks which have changed string representation if (configuration.reloadHooksOnBodyChange) { inputs.push(String(cb)); } if ( // reload hooks with dependencies deps.length > 0 || // reload all hooks of option is set configuration.reloadLifeCycleHooks && deps.length === 0) { inputs.push(getHotGeneration()); } return hook(cb, inputs); } return hook(cb, deps); }; wrappedHook.isPatchedByReactHotLoader = true; return wrappedHook; }; var noDeps = function noDeps() { return []; }; var reactHotLoader = { signature: function signature(type, key) { var getCustomHooks = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : noDeps; addSignature(type, { key: key, getCustomHooks: getCustomHooks }); return type; }, register: function register(type, uniqueLocalName, fileName) { var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {}; var id = fileName + '#' + uniqueLocalName; if (isCompositeComponent(type) && typeof uniqueLocalName === 'string' && uniqueLocalName && typeof fileName === 'string' && fileName) { var proxy = getProxyById(id); if (proxy && proxy.getCurrent() !== type) { if (!configuration.IS_REACT_MERGE_ENABLED) { if (isTypeBlacklisted(type) || isTypeBlacklisted(proxy.getCurrent())) { logger.error('React-hot-loader: Cold component', uniqueLocalName, 'at', fileName, 'has been updated'); } } } if (configuration.onComponentRegister) { configuration.onComponentRegister(type, uniqueLocalName, fileName); } if (configuration.onComponentCreate) { configuration.onComponentCreate(type, getComponentDisplayName(type)); } registerComponent(updateProxyById(id, type, options).get(), 2); registerComponent(type); increment(); } if (isContextType({ type: type })) { // possible options - Context, Consumer, Provider. ['Provider', 'Consumer'].forEach(function (prop) { var descriptor = Object.getOwnPropertyDescriptor(type, prop); if (descriptor && descriptor.value) { updateFunctionProxyById(id + ':' + prop, descriptor.value, updateContext); } }); updateFunctionProxyById(id, type, updateContext); increment(); } if (isLazyType({ type: type })) { updateFunctionProxyById(id, type, updateLazy); increment(); } if (isForwardType({ type: type })) { reactHotLoader.register(type.render, uniqueLocalName + ':render', fileName, forceSimpleSFC); updateFunctionProxyById(id, type, updateForward); increment(); } if (isMemoType({ type: type })) { reactHotLoader.register(type.type, uniqueLocalName + ':memo', fileName, forceSimpleSFC); updateFunctionProxyById(id, type, updateMemo); increment(); } }, reset: function reset() { resetProxies(); }, preact: function preact(instance) { preactAdapter(instance, resolveType); }, resolveType: function resolveType$$1(type) { return resolveType(type); }, patch: function patch(React$$1, ReactDOM$$1) { var typeResolver = resolveType; /* eslint-disable no-console */ if (ReactDOM$$1 && !ReactDOM$$1.render) { logger.error('React-Hot-Loader: broken state detected, please import React-Hot-Loader before react-dom, see https://github.com/gaearon/react-hot-loader/issues/1315'); } if (ReactDOM$$1 && ReactDOM$$1.setHotElementComparator) { ReactDOM$$1.setHotElementComparator(hotComponentCompare); configuration.disableHotRenderer = configuration.disableHotRendererWhenInjected; configuration.ignoreSFC = configuration.ignoreSFCWhenInjected; configuration.IS_REACT_MERGE_ENABLED = true; configuration.showReactDomPatchNotification = false; configuration.integratedComparator = true; if (ReactDOM$$1.setHotTypeResolver) { configuration.integratedResolver = true; typeResolver = resolveSimpleType; ReactDOM$$1.setHotTypeResolver(resolveType); } } // PATCH REACT METHODS /* eslint-enable */ if (!React$$1.createElement.isPatchedByReactHotLoader) { var originalCreateElement = React$$1.createElement; // Trick React into rendering a proxy so that // its state is preserved when the class changes. // This will update the proxy if it's for a known type. React$$1.createElement = function (type) { for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { args[_key - 1] = arguments[_key]; } return originalCreateElement.apply(undefined, [typeResolver(type)].concat(args)); }; React$$1.createElement.isPatchedByReactHotLoader = true; } if (!React$$1.cloneElement.isPatchedByReactHotLoader) { var originalCloneElement = React$$1.cloneElement; React$$1.cloneElement = function (element) { for (var _len2 = arguments.length, args = Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) { args[_key2 - 1] = arguments[_key2]; } var newType = element.type && typeResolver(element.type); if (newType && newType !== element.type) { return originalCloneElement.apply(undefined, [_extends({}, element, { type: newType })].concat(args)); } return originalCloneElement.apply(undefined, [element].concat(args)); }; React$$1.cloneElement.isPatchedByReactHotLoader = true; } if (!React$$1.createFactory.isPatchedByReactHotLoader) { // Patch React.createFactory to use patched createElement // because the original implementation uses the internal, // unpatched ReactElement.createElement React$$1.createFactory = function (type) { var factory = React$$1.createElement.bind(null, type); factory.type = type; return factory; }; React$$1.createFactory.isPatchedByReactHotLoader = true; } if (!React$$1.Children.only.isPatchedByReactHotLoader) { var originalChildrenOnly = React$$1.Children.only; // Use the same trick as React.createElement React$$1.Children.only = function (children) { return originalChildrenOnly(_extends({}, children, { type: typeResolver(children.type) })); }; React$$1.Children.only.isPatchedByReactHotLoader = true; } // PATCH REACT HOOKS if (React$$1.useEffect && !React$$1.useEffect.isPatchedByReactHotLoader) { React$$1.useEffect = hookWrapper(React$$1.useEffect); React$$1.useLayoutEffect = hookWrapper(React$$1.useLayoutEffect); React$$1.useCallback = hookWrapper(React$$1.useCallback); React$$1.useMemo = hookWrapper(React$$1.useMemo); // transform context for useContext var useContext = React$$1.useContext; React$$1.useContext = function (context) { for (var _len3 = arguments.length, args = Array(_len3 > 1 ? _len3 - 1 : 0), _key3 = 1; _key3 < _len3; _key3++) { args[_key3 - 1] = arguments[_key3]; } return useContext.apply(undefined, [typeResolver(context)].concat(args)); }; } // reactHotLoader.reset() } }; var openedModules = {}; var lastModuleOpened = ''; var getLastModuleOpened = function getLastModuleOpened() { return lastModuleOpened; }; var hotModules = {}; var createHotModule = function createHotModule() { return { instances: [], updateTimeout: 0 }; }; var hotModule = function hotModule(moduleId) { if (!hotModules[moduleId]) { hotModules[moduleId] = createHotModule(); } return hotModules[moduleId]; }; var isOpened = function isOpened(sourceModule) { return sourceModule && !!openedModules[sourceModule.id]; }; var enter = function enter(sourceModule) { if (sourceModule && sourceModule.id) { lastModuleOpened = sourceModule.id; openedModules[sourceModule.id] = true; } else { logger.warn('React-hot-loader: no `module` variable found. Did you shadow a system variable?'); } }; var leave = function leave(sourceModule) { if (sourceModule && sourceModule.id) { delete openedModules[sourceModule.id]; } }; var createQueue = function createQueue() { var runner = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function (a) { return a(); }; var promise = void 0; var queue = []; var runAll = function runAll() { var oldQueue = queue; oldQueue.forEach(function (cb) { return cb(); }); queue = []; }; var add = function add(cb) { if (queue.length === 0) { promise = Promise.resolve().then(function () { return runner(runAll); }); } queue.push(cb); return promise; }; return add; }; /* eslint-disable camelcase, no-undef */ var requireIndirect = typeof __webpack_require__ !== 'undefined' ? __webpack_require__ : require; /* eslint-enable */ var chargeFailbackTimer = function chargeFailbackTimer(id) { return setTimeout(function () { var error = 'hot update failed for module "' + id + '". Last file processed: "' + getLastModuleOpened() + '".'; logger.error(error); logException({ toString: function toString() { return error; } }); // 100 ms more "code" tolerant that 0, and would catch error in any case }, 100); }; var clearFailbackTimer = function clearFailbackTimer(timerId) { return clearTimeout(timerId); }; var createHoc = function createHoc(SourceComponent, TargetComponent) { hoistNonReactStatic(TargetComponent, SourceComponent); TargetComponent.displayName = 'HotExported' + getComponentDisplayName(SourceComponent); return TargetComponent; }; var runInRequireQueue = createQueue(); var runInRenderQueue = createQueue(function (cb) { if (ReactDOM.unstable_batchedUpdates) { ReactDOM.unstable_batchedUpdates(cb); } else { cb(); } }); var makeHotExport = function makeHotExport(sourceModule, moduleId) { var updateInstances = function updateInstances(possibleError) { if (possibleError && possibleError instanceof Error) { console.error(possibleError); return; } var module = hotModule(moduleId); var deepUpdate = function deepUpdate() { // force flush all updates runInRenderQueue(function () { enterHotUpdate(); var gen = getHotGeneration(); module.instances.forEach(function (inst) { return inst.forceUpdate(); }); if (configuration.trackTailUpdates) { var runLimit = 0; var checkTailUpdates = function checkTailUpdates() { setTimeout(function () { if (getHotGeneration() !== gen) { // we know that some components were updated, but not tracking which ones // even if their updates might be incorporated automatically (like lazy) // we dont know which one should be tracked, and which updates are important logger.warn('React-Hot-Loader: some components were updated out-of-bound. Updating your app to reconcile the changes.'); deepUpdate(); } else if (++runLimit < 5) { checkTailUpdates(); } }, 16); }; checkTailUpdates(); } }); }; // require all modules runInRequireQueue(function () { try { // webpack will require everything by this time // but let's double check... requireIndirect(moduleId); } catch (e) { console.error('React-Hot-Loader: error detected while loading', moduleId); console.error(e); } }).then(deepUpdate); }; if (sourceModule.hot) { // Mark as self-accepted for Webpack (callback is an Error Handler) // Update instances for Parcel (callback is an Accept Handler) sourceModule.hot.accept(updateInstances); // Webpack way if (sourceModule.hot.addStatusHandler) { if (sourceModule.hot.status() === 'idle') { sourceModule.hot.addStatusHandler(function (status) { if (status === 'apply') { clearExceptions(); updateInstances(); } }); } } } else { logger.warn('React-hot-loader: Hot Module Replacement is not enabled'); } }; var hot = function hot(sourceModule) { if (!sourceModule) { // this is fatal throw new Error('React-hot-loader: `hot` was called without any argument provided'); } var moduleId = sourceModule.id || sourceModule.i || sourceModule.filename; if (!moduleId) { console.error('`module` provided', sourceModule); throw new Error('React-hot-loader: `hot` could not find the `name` of the the `module` you have provided'); } var module = hotModule(moduleId); makeHotExport(sourceModule, moduleId); clearExceptions(); var failbackTimer = chargeFailbackTimer(moduleId); var firstHotRegistered = false; // TODO: Ensure that all exports from this file are react components. return function (WrappedComponent, props) { clearFailbackTimer(failbackTimer); // register proxy for wrapped component // only one hot per file would use this registration if (!firstHotRegistered) { firstHotRegistered = true; reactHotLoader.register(WrappedComponent, getComponentDisplayName(WrappedComponent), 'RHL' + moduleId); } return createHoc(WrappedComponent, function (_Component) { inherits(ExportedComponent, _Component); function ExportedComponent() { classCallCheck(this, ExportedComponent); return possibleConstructorReturn(this, _Component.apply(this, arguments)); } ExportedComponent.prototype.componentDidMount = function componentDidMount() { module.instances.push(this); }; ExportedComponent.prototype.componentWillUnmount = function componentWillUnmount() { var _this2 = this; if (isOpened(sourceModule)) { var componentName = getComponentDisplayName(WrappedComponent); logger.error('React-hot-loader: Detected AppContainer unmount on module \'' + moduleId + '\' update.\n' + ('Did you use "hot(' + componentName + ')" and "ReactDOM.render()" in the same file?\n') + ('"hot(' + componentName + ')" shall only be used as export.\n') + 'Please refer to "Getting Started" (https://github.com/gaearon/react-hot-loader/).'); } module.instances = module.instances.filter(function (a) { return a !== _this2; }); }; ExportedComponent.prototype.render = function render() { return React__default.createElement( AppContainer, props, React__default.createElement(WrappedComponent, this.props) ); }; return ExportedComponent; }(React.Component)); }; }; var getProxyOrType = function getProxyOrType(type) { var proxy = getProxyByType(type); return proxy ? proxy.get() : type; }; var areComponentsEqual = function areComponentsEqual(a, b) { return getProxyOrType(a) === getProxyOrType(b); }; var compareOrSwap = function compareOrSwap(oldType, newType) { return hotComponentCompare(oldType, newType); }; var cold = function cold(type) { blacklistByType(type); return type; }; var configureComponent = function configureComponent(component, options) { return setComponentOptions(component, options); }; var setConfig = function setConfig(config) { return setConfiguration(config); }; reactHotLoader.patch(React__default, ReactDOM); exports.default = reactHotLoader; exports.AppContainer = AppContainer; exports.hot = hot; exports.enterModule = enter; exports.leaveModule = leave; exports.areComponentsEqual = areComponentsEqual; exports.compareOrSwap = compareOrSwap; exports.cold = cold; exports.configureComponent = configureComponent; exports.setConfig = setConfig;