mobx-react - npm Package Compare versions

Comparing version 6.1.5 to 6.1.6

CHANGELOG.md

 # MobX-React Changelog
 
+### 6.1.6
+
+- Fix an issue with class components & observableRequiresReaction. [#806](https://github.com/mobxjs/mobx-react/issues/806) through [#829](https://github.com/mobxjs/mobx-react/pull/829)
+- Use TSDX for building to mitigate issues with accessing `process.env` [#821](https://github.com/mobxjs/mobx-react/pull/821)
+
 ### 6.1.5
@@ -4,0 +9,0 @@

dist/mobx-react.rn.module.js

@@ -0,8 +1,8 @@
+import { Reaction, _allowStateChanges, _allowStateReadsStart, _allowStateReadsEnd, $mobx, createAtom, untracked, isObservableMap, isObservableObject, isObservableArray, observable, configure } from 'mobx';
+import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
 import { unstable_batchedUpdates } from 'react-native';
-import { isUsingStaticRendering, observer, Observer } from 'mobx-react-lite';
-export { Observer, useObserver, useAsObservableSource, useLocalStore, isUsingStaticRendering, useStaticRendering } from 'mobx-react-lite';
-import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-import { createAtom, _allowStateChanges, Reaction, $mobx, isObservableArray, isObservableObject, isObservableMap, untracked, observable, configure } from 'mobx';
+import { isUsingStaticRendering, Observer, observer as observer$1 } from 'mobx-react-lite';
+export { Observer, isUsingStaticRendering, useAsObservableSource, useLocalStore, useObserver, useStaticRendering } from 'mobx-react-lite';
 
-var symbolId = 0;
+let symbolId = 0;
 
@@ -14,3 +14,3 @@ function createSymbol(name) {
 
-  var symbol = "__$mobx-react " + name + " (" + symbolId + ")";
+  const symbol = `__$mobx-react ${name} (${symbolId})`;
   symbolId++;
@@ -20,3 +20,3 @@ return symbol;
 
-var createdSymbols = {};
+const createdSymbols = {};
 function newSymbol(name) {
@@ -31,3 +31,3 @@ if (!createdSymbols[name]) {
   //From: https://github.com/facebook/fbjs/blob/c69904a511b900266935168223063dd8772dfc40/packages/fbjs/src/core/shallowEqual.js
-  if (is(objA, objB)) { return true; }
+  if (is(objA, objB)) return true;
 
@@ -38,8 +38,8 @@ if (typeof objA !== "object" || objA === null || typeof objB !== "object" || objB === null) {
 
-  var keysA = Object.keys(objA);
-  var keysB = Object.keys(objB);
-  if (keysA.length !== keysB.length) { return false; }
+  const keysA = Object.keys(objA);
+  const keysB = Object.keys(objB);
+  if (keysA.length !== keysB.length) return false;
 
-  for (var i = 0; i < keysA.length; i++) {
-    if (!hasOwnProperty.call(objB, keysA[i]) || !is(objA[keysA[i]], objB[keysA[i]])) {
+  for (let i = 0; i < keysA.length; i++) {
+    if (!Object.hasOwnProperty.call(objB, keysA[i]) || !is(objA[keysA[i]], objB[keysA[i]])) {
       return false;
@@ -62,3 +62,3 @@ }
 
-var hoistBlackList = {
+const hoistBlackList = {
   $$typeof: 1,
@@ -79,4 +79,4 @@ render: 1,
 function copyStaticProperties(base, target) {
-  var protoProps = Object.getOwnPropertyNames(Object.getPrototypeOf(base));
-  Object.getOwnPropertyNames(base).forEach(function (key) {
+  const protoProps = Object.getOwnPropertyNames(Object.getPrototypeOf(base));
+  Object.getOwnPropertyNames(base).forEach(key => {
     if (!hoistBlackList[key] && protoProps.indexOf(key) === -1) {
@@ -100,3 +100,3 @@ Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(base, key));
       writable: true,
-      value: value
+      value
     });
@@ -112,8 +112,12 @@ } else {
 
-var mobxMixins = newSymbol("patchMixins");
-var mobxPatchedDefinition = newSymbol("patchedDefinition");
+const mobxMixins =
+/*#__PURE__*/
+newSymbol("patchMixins");
+const mobxPatchedDefinition =
+/*#__PURE__*/
+newSymbol("patchedDefinition");
 
 function getMixins(target, methodName) {
-  var mixins = target[mobxMixins] = target[mobxMixins] || {};
-  var methodMixins = mixins[methodName] = mixins[methodName] || {};
+  const mixins = target[mobxMixins] = target[mobxMixins] || {};
+  const methodMixins = mixins[methodName] = mixins[methodName] || {};
   methodMixins.locks = methodMixins.locks || 0;
@@ -124,7 +128,3 @@ methodMixins.methods = methodMixins.methods || [];
 
-function wrapper(realMethod, mixins) {
-  var this$1 = this;
-  var args = [], len = arguments.length - 2;
-  while ( len-- > 0 ) args[ len ] = arguments[ len + 2 ];
-
+function wrapper(realMethod, mixins, ...args) {
   // locks are used to ensure that mixins are invoked only once per invocation, even on recursive calls
@@ -134,3 +134,3 @@ mixins.locks++;
   try {
-    var retVal;
+    let retVal;
 
@@ -146,4 +146,4 @@ if (realMethod !== undefined && realMethod !== null) {
     if (mixins.locks === 0) {
-      mixins.methods.forEach(function (mx) {
-        mx.apply(this$1, args);
+      mixins.methods.forEach(mx => {
+        mx.apply(this, args);
       });
@@ -155,7 +155,4 @@ }
 function wrapFunction(realMethod, mixins) {
-  var fn = function () {
-    var args = [], len = arguments.length;
-    while ( len-- ) args[ len ] = arguments[ len ];
-
-    wrapper.call.apply(wrapper, [ this, realMethod, mixins ].concat( args ));
+  const fn = function (...args) {
+    wrapper.call(this, realMethod, mixins, ...args);
   };
@@ -167,3 +164,3 @@
 function patch(target, methodName, mixinMethod) {
-  var mixins = getMixins(target, methodName);
+  const mixins = getMixins(target, methodName);
 
@@ -174,3 +171,3 @@ if (mixins.methods.indexOf(mixinMethod) < 0) {
 
-  var oldDefinition = Object.getOwnPropertyDescriptor(target, methodName);
+  const oldDefinition = Object.getOwnPropertyDescriptor(target, methodName);
 
@@ -182,4 +179,4 @@ if (oldDefinition && oldDefinition[mobxPatchedDefinition]) {
 
-  var originalMethod = target[methodName];
-  var newDefinition = createDefinition(target, methodName, oldDefinition ? oldDefinition.enumerable : undefined, mixins, originalMethod);
+  const originalMethod = target[methodName];
+  const newDefinition = createDefinition(target, methodName, oldDefinition ? oldDefinition.enumerable : undefined, mixins, originalMethod);
   Object.defineProperty(target, methodName, newDefinition);
@@ -189,8 +186,9 @@ }
 function createDefinition(target, methodName, enumerable, mixins, originalMethod) {
-  var obj;
-
-  var wrappedFunc = wrapFunction(originalMethod, mixins);
-  return ( obj = {}, obj[mobxPatchedDefinition] = true, obj.get = function () {
+  let wrappedFunc = wrapFunction(originalMethod, mixins);
+  return {
+    [mobxPatchedDefinition]: true,
+    get: function () {
       return wrappedFunc;
-    }, obj.set = function (value) {
+    },
+    set: function (value) {
       if (this === target) {
@@ -203,19 +201,28 @@ wrappedFunc = wrapFunction(value, mixins);
         // as the method for the instance
-        var newDefinition = createDefinition(this, methodName, enumerable, mixins, value);
+        const newDefinition = createDefinition(this, methodName, enumerable, mixins, value);
         Object.defineProperty(this, methodName, newDefinition);
       }
-    }, obj.configurable = true, obj.enumerable = enumerable, obj );
+    },
+    configurable: true,
+    enumerable: enumerable
+  };
 }
 
-var mobxAdminProperty = $mobx || "$mobx";
-var mobxIsUnmounted = newSymbol("isUnmounted");
-var skipRenderKey = newSymbol("skipRender");
-var isForcingUpdateKey = newSymbol("isForcingUpdate");
+const mobxAdminProperty = $mobx || "$mobx";
+const mobxIsUnmounted =
+/*#__PURE__*/
+newSymbol("isUnmounted");
+const skipRenderKey =
+/*#__PURE__*/
+newSymbol("skipRender");
+const isForcingUpdateKey =
+/*#__PURE__*/
+newSymbol("isForcingUpdate");
 function makeClassComponentObserver(componentClass) {
-  var target = componentClass.prototype;
-  if (target.componentWillReact) { throw new Error("The componentWillReact life-cycle event is no longer supported"); }
+  const target = componentClass.prototype;
+  if (target.componentWillReact) throw new Error("The componentWillReact life-cycle event is no longer supported");
 
-  if (componentClass.__proto__ !== PureComponent) {
-    if (!target.shouldComponentUpdate) { target.shouldComponentUpdate = observerSCU; }else if (target.shouldComponentUpdate !== observerSCU) // n.b. unequal check, instead of existence check, as @observer might be on superclass as well
-      { throw new Error("It is not allowed to use shouldComponentUpdate in observer based components."); }
+  if (componentClass["__proto__"] !== PureComponent) {
+    if (!target.shouldComponentUpdate) target.shouldComponentUpdate = observerSCU;else if (target.shouldComponentUpdate !== observerSCU) // n.b. unequal check, instead of existence check, as @observer might be on superclass as well
+      throw new Error("It is not allowed to use shouldComponentUpdate in observer based components.");
   } // this.props and this.state are made observable, just to make sure @computed fields that
@@ -229,3 +236,3 @@ // are defined inside the component, and which rely on state or props, re-compute if state or props change
   makeObservableProp(target, "state");
-  var baseRender = target.render;
+  const baseRender = target.render;
 
@@ -237,3 +244,3 @@ target.render = function () {
   patch(target, "componentWillUnmount", function () {
-    if (isUsingStaticRendering() === true) { return; }
+    if (isUsingStaticRendering() === true) return;
 
@@ -243,4 +250,4 @@ if (this.render[mobxAdminProperty]) {
     } else if (process.env.NODE_ENV !== "production") {
-      var displayName = getDisplayName(this);
-      console.warn(("The render function for an observer component (" + displayName + ") was modified after MobX attached. This is not supported, since the new function can't be triggered by MobX."));
+      const displayName = getDisplayName(this);
+      console.warn(`The render function for an observer component (${displayName}) was modified after MobX attached. This is not supported, since the new function can't be triggered by MobX.`);
     }
@@ -258,5 +265,3 @@
 function makeComponentReactive(render) {
-  var this$1 = this;
-
-  if (isUsingStaticRendering() === true) { return render.call(this); }
+  if (isUsingStaticRendering() === true) return render.call(this);
   /**
@@ -274,6 +279,6 @@ * If props are shallowly modified, react will render anyway,
   setHiddenProp(this, isForcingUpdateKey, false);
-  var initialName = getDisplayName(this);
-  var baseRender = render.bind(this);
-  var isRenderingPending = false;
-  var reaction = new Reaction((initialName + ".render()"), function () {
+  const initialName = getDisplayName(this);
+  const baseRender = render.bind(this);
+  let isRenderingPending = false;
+  const reaction = new Reaction(`${initialName}.render()`, () => {
     if (!isRenderingPending) {
@@ -285,12 +290,12 @@ // N.B. Getting here *before mounting* means that a component constructor has side effects (see the relevant test in misc.js)
 
-      if (this$1[mobxIsUnmounted] !== true) {
-        var hasError = true;
+      if (this[mobxIsUnmounted] !== true) {
+        let hasError = true;
 
         try {
-          setHiddenProp(this$1, isForcingUpdateKey, true);
-          if (!this$1[skipRenderKey]) { Component.prototype.forceUpdate.call(this$1); }
+          setHiddenProp(this, isForcingUpdateKey, true);
+          if (!this[skipRenderKey]) Component.prototype.forceUpdate.call(this);
           hasError = false;
         } finally {
-          setHiddenProp(this$1, isForcingUpdateKey, false);
-          if (hasError) { reaction.dispose(); }
+          setHiddenProp(this, isForcingUpdateKey, false);
+          if (hasError) reaction.dispose();
         }
@@ -300,3 +305,3 @@ }
   });
-  reaction.reactComponent = this;
+  reaction["reactComponent"] = this;
   reactiveRender[mobxAdminProperty] = reaction;
@@ -307,5 +312,5 @@ this.render = reactiveRender;
     isRenderingPending = false;
-    var exception = undefined;
-    var rendering = undefined;
-    reaction.track(function () {
+    let exception = undefined;
+    let rendering = undefined;
+    reaction.track(() => {
       try {
@@ -346,4 +351,4 @@ rendering = _allowStateChanges(false, baseRender);
 function makeObservableProp(target, propName) {
-  var valueHolderKey = newSymbol(("reactProp_" + propName + "_valueHolder"));
-  var atomHolderKey = newSymbol(("reactProp_" + propName + "_atomHolder"));
+  const valueHolderKey = newSymbol(`reactProp_${propName}_valueHolder`);
+  const atomHolderKey = newSymbol(`reactProp_${propName}_atomHolder`);
 
@@ -362,3 +367,14 @@ function getAtom() {
     get: function () {
+      let prevReadState = false;
+
+      if (_allowStateReadsStart && _allowStateReadsEnd) {
+        prevReadState = _allowStateReadsStart(true);
+      }
+
       getAtom.call(this).reportObserved();
+
+      if (_allowStateReadsStart && _allowStateReadsEnd) {
+        _allowStateReadsEnd(prevReadState);
+      }
+
       return this[valueHolderKey];
@@ -379,7 +395,14 @@ },
 
-/* eslint-disable react/display-name */
-var hasSymbol = typeof Symbol === "function" && Symbol.for; // Using react-is had some issues (and operates on elements, not on types), see #608 / #609
+const hasSymbol = typeof Symbol === "function" && Symbol.for; // Using react-is had some issues (and operates on elements, not on types), see #608 / #609
 
-var ReactForwardRefSymbol = hasSymbol ? Symbol.for("react.forward_ref") : typeof forwardRef === "function" && forwardRef(function () {})["$$typeof"];
-var ReactMemoSymbol = hasSymbol ? Symbol.for("react.memo") : typeof memo === "function" && memo(function () {})["$$typeof"];
+const ReactForwardRefSymbol = hasSymbol ?
+/*#__PURE__*/
+Symbol.for("react.forward_ref") : typeof forwardRef === "function" &&
+/*#__PURE__*/
+forwardRef(props => null)["$$typeof"];
+const ReactMemoSymbol = hasSymbol ?
+/*#__PURE__*/
+Symbol.for("react.memo") : typeof memo === "function" &&
+/*#__PURE__*/
+memo(props => null)["$$typeof"];
 /**
@@ -389,8 +412,8 @@ * Observer function / decorator
 
-function observer$1(componentClass) {
-  if (componentClass.isMobxInjector === true) {
+function observer(component) {
+  if (component["isMobxInjector"] === true) {
     console.warn("Mobx observer: You are trying to use 'observer' on a component that already has 'inject'. Please apply 'observer' before applying 'inject'");
   }
 
-  if (ReactMemoSymbol && componentClass["$$typeof"] === ReactMemoSymbol) {
+  if (ReactMemoSymbol && component["$$typeof"] === ReactMemoSymbol) {
     throw new Error("Mobx observer: You are trying to use 'observer' on function component wrapped to either another observer or 'React.memo'. The observer already applies 'React.memo' for you.");
@@ -402,9 +425,7 @@ } // Unwrap forward refs into `<Observer>` component
 
-  if (ReactForwardRefSymbol && componentClass["$$typeof"] === ReactForwardRefSymbol) {
-    var baseRender = componentClass.render;
-    if (typeof baseRender !== "function") { throw new Error("render property of ForwardRef was not a function"); }
+  if (ReactForwardRefSymbol && component["$$typeof"] === ReactForwardRefSymbol) {
+    const baseRender = component["render"];
+    if (typeof baseRender !== "function") throw new Error("render property of ForwardRef was not a function");
     return forwardRef(function ObserverForwardRef() {
-      var arguments$1 = arguments;
-
-      return React__default.createElement( Observer, null, function () { return baseRender.apply(undefined, arguments$1); } );
+      return createElement(Observer, null, () => baseRender.apply(undefined, arguments));
     });
@@ -414,25 +435,28 @@ } // Function component
 
-  if (typeof componentClass === "function" && (!componentClass.prototype || !componentClass.prototype.render) && !componentClass.isReactClass && !Object.prototype.isPrototypeOf.call(Component, componentClass)) {
-    return observer(componentClass);
+  if (typeof component === "function" && (!component.prototype || !component.prototype.render) && !component["isReactClass"] && !Object.prototype.isPrototypeOf.call(Component, component)) {
+    return observer$1(component);
   }
 
-  return makeClassComponentObserver(componentClass);
+  return makeClassComponentObserver(component);
 }
 
-/* eslint-disable react/prop-types */
-function objectWithoutProperties (obj, exclude) { var target = {}; for (var k in obj) if (Object.prototype.hasOwnProperty.call(obj, k) && exclude.indexOf(k) === -1) target[k] = obj[k]; return target; }
-var MobXProviderContext = React__default.createContext({});
-function Provider(ref) {
-  var children = ref.children;
-  var rest = objectWithoutProperties( ref, ["children"] );
-  var stores = rest;
+const MobXProviderContext =
+/*#__PURE__*/
+React__default.createContext({});
+function Provider(props) {
+  const {
+    children,
+    ...stores
+  } = props;
+  const parentValue = React__default.useContext(MobXProviderContext);
+  const mutableProviderRef = React__default.useRef({ ...parentValue,
+    ...stores
+  });
+  const value = mutableProviderRef.current;
 
-  var parentValue = React__default.useContext(MobXProviderContext);
-  var value = React__default.useRef(Object.assign({}, parentValue,
-    stores)).current;
+  if (process.env.NODE_ENV !== "production") {
+    const newValue = { ...value,
+      ...stores
+    }; // spread in previous state for the context based stores
 
-  if (process && typeof process.env !== "undefined" && process.env.NODE_ENV !== "production") {
-    var newValue = Object.assign({}, value,
-      stores); // spread in previous state for the context based stores
-
     if (!shallowEqual(value, newValue)) {
@@ -443,3 +467,5 @@ throw new Error("MobX Provider: The set of provided stores has changed. See: https://github.com/mobxjs/mobx-react#the-set-of-provided-stores-has-changed-error.");
 
-  return React__default.createElement( MobXProviderContext.Provider, { value: value }, children);
+  return React__default.createElement(MobXProviderContext.Provider, {
+    value: value
+  }, children);
 }
@@ -454,5 +480,6 @@ Provider.displayName = "MobXProvider";
   // Support forward refs
-  var Injector = React__default.forwardRef(function (props, ref) {
-    var newProps = Object.assign({}, props);
-    var context = React__default.useContext(MobXProviderContext);
+  let Injector = React__default.forwardRef((props, ref) => {
+    const newProps = { ...props
+    };
+    const context = React__default.useContext(MobXProviderContext);
     Object.assign(newProps, grabStoresFn(context || {}, newProps) || {});
@@ -464,10 +491,10 @@
 
-    return createElement(component, newProps);
+    return React__default.createElement(component, newProps);
   });
-  if (makeReactive) { Injector = observer$1(Injector); }
-  Injector.isMobxInjector = true; // assigned late to suppress observer warning
+  if (makeReactive) Injector = observer(Injector);
+  Injector["isMobxInjector"] = true; // assigned late to suppress observer warning
   // Static fields from component should be visible on the generated Injector
 
   copyStaticProperties(component, Injector);
-  Injector.wrappedComponent = component;
+  Injector["wrappedComponent"] = component;
   Injector.displayName = getInjectName(component, injectNames);
@@ -478,5 +505,5 @@ return Injector;
 function getInjectName(component, injectNames) {
-  var displayName;
-  var componentName = component.displayName || component.name || component.constructor && component.constructor.name || "Component";
-  if (injectNames) { displayName = "inject-with-" + injectNames + "(" + componentName + ")"; }else { displayName = "inject(" + componentName + ")"; }
+  let displayName;
+  const componentName = component.displayName || component.name || component.constructor && component.constructor.name || "Component";
+  if (injectNames) displayName = "inject-with-" + injectNames + "(" + componentName + ")";else displayName = "inject(" + componentName + ")";
   return displayName;
@@ -489,4 +516,4 @@ }
       if (storeName in nextProps // prefer props over stores
-      ) { return; }
-      if (!(storeName in baseStores)) { throw new Error("MobX injector: Store '" + storeName + "' is not available! Make sure it is provided by some Provider"); }
+      ) return;
+      if (!(storeName in baseStores)) throw new Error("MobX injector: Store '" + storeName + "' is not available! Make sure it is provided by some Provider");
       nextProps[storeName] = baseStores[storeName];
@@ -506,26 +533,25 @@ });
 function inject(
-/* fn(stores, nextProps) or ...storeNames */) {
-  var storeNames = [], len = arguments.length;
-  while ( len-- ) storeNames[ len ] = arguments[ len ];
-
-  var grabStoresFn;
-
+/* fn(stores, nextProps) or ...storeNames */
+...storeNames) {
   if (typeof arguments[0] === "function") {
-    grabStoresFn = arguments[0];
-    return function (componentClass) { return createStoreInjector(grabStoresFn, componentClass, grabStoresFn.name, true); };
+    let grabStoresFn = arguments[0];
+    return componentClass => createStoreInjector(grabStoresFn, componentClass, grabStoresFn.name, true);
   } else {
-    return function (componentClass) { return createStoreInjector(grabStoresByName(storeNames), componentClass, storeNames.join("-"), false); };
+    return componentClass => createStoreInjector(grabStoresByName(storeNames), componentClass, storeNames.join("-"), false);
   }
 }
 
-var protoStoreKey = newSymbol("disposeOnUnmountProto");
-var instStoreKey = newSymbol("disposeOnUnmountInst");
+const protoStoreKey =
+/*#__PURE__*/
+newSymbol("disposeOnUnmountProto");
+const instStoreKey =
+/*#__PURE__*/
+newSymbol("disposeOnUnmountInst");
 
 function runDisposersOnWillUnmount() {
-  var this$1 = this;
-  (this[protoStoreKey] || []).concat( (this[instStoreKey] || [])).forEach(function (propKeyOrFunction) {
-    var prop = typeof propKeyOrFunction === "string" ? this$1[propKeyOrFunction] : propKeyOrFunction;
+  [...(this[protoStoreKey] || []), ...(this[instStoreKey] || [])].forEach(propKeyOrFunction => {
+    const prop = typeof propKeyOrFunction === "string" ? this[propKeyOrFunction] : propKeyOrFunction;
 
     if (prop !== undefined && prop !== null) {
-      if (Array.isArray(prop)) { prop.map(function (f) { return f(); }); }else { prop(); }
+      if (Array.isArray(prop)) prop.map(f => f());else prop();
     }
@@ -537,9 +563,9 @@ });
   if (Array.isArray(propertyKeyOrFunction)) {
-    return propertyKeyOrFunction.map(function (fn) { return disposeOnUnmount(target, fn); });
+    return propertyKeyOrFunction.map(fn => disposeOnUnmount(target, fn));
   }
 
-  var c = Object.getPrototypeOf(target).constructor || Object.getPrototypeOf(target.constructor);
-  var c2 = Object.getPrototypeOf(target.constructor);
+  const c = Object.getPrototypeOf(target).constructor || Object.getPrototypeOf(target.constructor);
+  const c2 = Object.getPrototypeOf(target.constructor);
 
-  if (!(c === Component || c === PureComponent || c2 === Component || c2 === PureComponent)) {
+  if (!(c === React__default.Component || c === React__default.PureComponent || c2 === React__default.Component || c2 === React__default.PureComponent)) {
     throw new Error("[mobx-react] disposeOnUnmount only supports direct subclasses of React.Component or React.PureComponent.");
@@ -553,6 +579,6 @@ }
 
-  var isDecorator = typeof propertyKeyOrFunction === "string"; // add property key / function we want run (disposed) to the store
+  const isDecorator = typeof propertyKeyOrFunction === "string"; // add property key / function we want run (disposed) to the store
 
-  var componentWasAlreadyModified = !!target[protoStoreKey] || !!target[instStoreKey];
-  var store = isDecorator ? // decorators are added to the prototype store
+  const componentWasAlreadyModified = !!target[protoStoreKey] || !!target[instStoreKey];
+  const store = isDecorator ? // decorators are added to the prototype store
   target[protoStoreKey] || (target[protoStoreKey] = []) : // functions are added to the instance store
@@ -572,8 +598,5 @@ target[instStoreKey] || (target[instStoreKey] = []);
 
-function createChainableTypeChecker(validate) {
-  function checkType(isRequired, props, propName, componentName, location, propFullName) {
-    var rest = [], len = arguments.length - 6;
-    while ( len-- > 0 ) rest[ len ] = arguments[ len + 6 ];
-
-    return untracked(function () {
+function createChainableTypeChecker(validator) {
+  function checkType(isRequired, props, propName, componentName, location, propFullName, ...rest) {
+    return untracked(() => {
       componentName = componentName || "<<anonymous>>";
@@ -584,3 +607,3 @@ propFullName = propFullName || propName;
         if (isRequired) {
-          var actual = props[propName] === null ? "null" : "undefined";
+          const actual = props[propName] === null ? "null" : "undefined";
           return new Error("The " + location + " `" + propFullName + "` is marked as required " + "in `" + componentName + "`, but its value is `" + actual + "`.");
@@ -591,3 +614,4 @@ }
       } else {
-        return validate.apply(void 0, [ props, propName, componentName, location, propFullName ].concat( rest ));
+        // @ts-ignore rest arg is necessary for some React internals - fails tests otherwise
+        return validator(props, propName, componentName, location, propFullName, ...rest);
       }
@@ -597,3 +621,4 @@ });
 
-  var chainedCheckType = checkType.bind(null, false);
+  const chainedCheckType = checkType.bind(null, false); // Add isRequired to satisfy Requirable
+
   chainedCheckType.isRequired = checkType.bind(null, true);
@@ -625,3 +650,3 @@ return chainedCheckType;
 function getPropType(propValue) {
-  var propType = typeof propValue;
+  const propType = typeof propValue;
 
@@ -649,3 +674,3 @@ if (Array.isArray(propValue)) {
 function getPreciseType(propValue) {
-  var propType = getPropType(propValue);
+  const propType = getPropType(propValue);
 
@@ -664,9 +689,9 @@ if (propType === "object") {
 function createObservableTypeCheckerCreator(allowNativeType, mobxType) {
-  return createChainableTypeChecker(function (props, propName, componentName, location, propFullName) {
-    return untracked(function () {
+  return createChainableTypeChecker((props, propName, componentName, location, propFullName) => {
+    return untracked(() => {
       if (allowNativeType) {
-        if (getPropType(props[propName]) === mobxType.toLowerCase()) { return null; }
+        if (getPropType(props[propName]) === mobxType.toLowerCase()) return null;
       }
 
-      var mobxChecker;
+      let mobxChecker;
 
@@ -687,10 +712,10 @@ switch (mobxType) {
         default:
-          throw new Error(("Unexpected mobxType: " + mobxType));
+          throw new Error(`Unexpected mobxType: ${mobxType}`);
       }
 
-      var propValue = props[propName];
+      const propValue = props[propName];
 
       if (!mobxChecker(propValue)) {
-        var preciseType = getPreciseType(propValue);
-        var nativeTypeExpectationMessage = allowNativeType ? " or javascript `" + mobxType.toLowerCase() + "`" : "";
+        const preciseType = getPreciseType(propValue);
+        const nativeTypeExpectationMessage = allowNativeType ? " or javascript `" + mobxType.toLowerCase() + "`" : "";
         return new Error("Invalid prop `" + propFullName + "` of type `" + preciseType + "` supplied to" + " `" + componentName + "`, expected `mobx.Observable" + mobxType + "`" + nativeTypeExpectationMessage + ".");
@@ -705,21 +730,18 @@ }
 function createObservableArrayOfTypeChecker(allowNativeType, typeChecker) {
-  return createChainableTypeChecker(function (props, propName, componentName, location, propFullName) {
-    var rest = [], len = arguments.length - 5;
-    while ( len-- > 0 ) rest[ len ] = arguments[ len + 5 ];
-
-    return untracked(function () {
+  return createChainableTypeChecker((props, propName, componentName, location, propFullName, ...rest) => {
+    return untracked(() => {
       if (typeof typeChecker !== "function") {
         return new Error("Property `" + propFullName + "` of component `" + componentName + "` has " + "invalid PropType notation.");
-      }
+      } else {
+        let error = createObservableTypeCheckerCreator(allowNativeType, "Array")(props, propName, componentName, location, propFullName);
+        if (error instanceof Error) return error;
+        const propValue = props[propName];
 
-      var error = createObservableTypeCheckerCreator(allowNativeType, "Array")(props, propName, componentName);
-      if (error instanceof Error) { return error; }
-      var propValue = props[propName];
+        for (let i = 0; i < propValue.length; i++) {
+          error = typeChecker(propValue, i, componentName, location, propFullName + "[" + i + "]", ...rest);
+          if (error instanceof Error) return error;
+        }
 
-      for (var i = 0; i < propValue.length; i++) {
-        error = typeChecker.apply(void 0, [ propValue, i, componentName, location, propFullName + "[" + i + "]" ].concat( rest ));
-        if (error instanceof Error) { return error; }
+        return null;
       }
-
-      return null;
     });
@@ -729,26 +751,40 @@ });
 
-var observableArray = createObservableTypeCheckerCreator(false, "Array");
-var observableArrayOf = createObservableArrayOfTypeChecker.bind(null, false);
-var observableMap = createObservableTypeCheckerCreator(false, "Map");
-var observableObject = createObservableTypeCheckerCreator(false, "Object");
-var arrayOrObservableArray = createObservableTypeCheckerCreator(true, "Array");
-var arrayOrObservableArrayOf = createObservableArrayOfTypeChecker.bind(null, true);
-var objectOrObservableObject = createObservableTypeCheckerCreator(true, "Object");
-var PropTypes = {
-  observableArray: observableArray,
-  observableArrayOf: observableArrayOf,
-  observableMap: observableMap,
-  observableObject: observableObject,
-  arrayOrObservableArray: arrayOrObservableArray,
-  arrayOrObservableArrayOf: arrayOrObservableArrayOf,
-  objectOrObservableObject: objectOrObservableObject
+const observableArray =
+/*#__PURE__*/
+createObservableTypeCheckerCreator(false, "Array");
+const observableArrayOf =
+/*#__PURE__*/
+createObservableArrayOfTypeChecker.bind(null, false);
+const observableMap =
+/*#__PURE__*/
+createObservableTypeCheckerCreator(false, "Map");
+const observableObject =
+/*#__PURE__*/
+createObservableTypeCheckerCreator(false, "Object");
+const arrayOrObservableArray =
+/*#__PURE__*/
+createObservableTypeCheckerCreator(true, "Array");
+const arrayOrObservableArrayOf =
+/*#__PURE__*/
+createObservableArrayOfTypeChecker.bind(null, true);
+const objectOrObservableObject =
+/*#__PURE__*/
+createObservableTypeCheckerCreator(true, "Object");
+const PropTypes = {
+  observableArray,
+  observableArrayOf,
+  observableMap,
+  observableObject,
+  arrayOrObservableArray,
+  arrayOrObservableArrayOf,
+  objectOrObservableObject
 };
 
-if (!Component) { throw new Error("mobx-react requires React to be available"); }
-if (!observable) { throw new Error("mobx-react requires mobx to be available"); }
-if (typeof unstable_batchedUpdates === "function") { configure({
+if (!Component) throw new Error("mobx-react requires React to be available");
+if (!observable) throw new Error("mobx-react requires mobx to be available");
+if (typeof unstable_batchedUpdates === "function") configure({
   reactionScheduler: unstable_batchedUpdates
-}); }
+});
 
-export { observer$1 as observer, Provider, MobXProviderContext, inject, disposeOnUnmount, PropTypes };
-//# sourceMappingURL=mobx-react.module.js.map
+export { MobXProviderContext, PropTypes, Provider, disposeOnUnmount, inject, observer };
+//# sourceMappingURL=mobxreact.esm.js.map

dist/mobx-react.umd.js

@@ -1,2 +0,2 @@
-!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react-dom"),require("mobx-react-lite"),require("react"),require("mobx")):"function"==typeof define&&define.amd?define(["exports","react-dom","mobx-react-lite","react","mobx"],r):r(e.mobxReact={},e.ReactDOM,e.mobxReactLite,e.React,e.mobx)}(this,function(e,r,t,n,o){var i="default"in n?n.default:n,a=0,c={};function s(e){return c[e]||(c[e]=function(e){if("function"==typeof Symbol)return Symbol(e);var r="__$mobx-react "+e+" ("+a+")";return a++,r}(e)),c[e]}function u(e,r){if(f(e,r))return!0;if("object"!=typeof e||null===e||"object"!=typeof r||null===r)return!1;var t=Object.keys(e),n=Object.keys(r);if(t.length!==n.length)return!1;for(var o=0;o<t.length;o++)if(!hasOwnProperty.call(r,t[o])||!f(e[t[o]],r[t[o]]))return!1;return!0}function f(e,r){return e===r?0!==e||1/e==1/r:e!=e&&r!=r}var p={$$typeof:1,render:1,compare:1,type:1,childContextTypes:1,contextType:1,contextTypes:1,defaultProps:1,getDefaultProps:1,getDerivedStateFromError:1,getDerivedStateFromProps:1,mixins:1,propTypes:1};function l(e,r,t){Object.hasOwnProperty.call(e,r)?e[r]=t:Object.defineProperty(e,r,{enumerable:!1,configurable:!0,writable:!0,value:t})}var b=s("patchMixins"),d=s("patchedDefinition");function y(e,r){for(var t=this,n=[],o=arguments.length-2;o-- >0;)n[o]=arguments[o+2];r.locks++;try{var i;return null!=e&&(i=e.apply(this,n)),i}finally{r.locks--,0===r.locks&&r.methods.forEach(function(e){e.apply(t,n)})}}function m(e,r){return function(){for(var t=[],n=arguments.length;n--;)t[n]=arguments[n];y.call.apply(y,[this,e,r].concat(t))}}function v(e,r,t){var n=function(e,r){var t=e[b]=e[b]||{},n=t[r]=t[r]||{};return n.locks=n.locks||0,n.methods=n.methods||[],n}(e,r);n.methods.indexOf(t)<0&&n.methods.push(t);var o=Object.getOwnPropertyDescriptor(e,r);if(!o||!o[d]){var i=function e(r,t,n,o,i){var a,c=m(i,o);return(a={})[d]=!0,a.get=function(){return c},a.set=function(i){if(this===r)c=m(i,o);else{var a=e(this,t,n,o,i);Object.defineProperty(this,t,a)}},a.configurable=!0,a.enumerable=n,a}(e,r,o?o.enumerable:void 0,n,e[r]);Object.defineProperty(e,r,i)}}var h=o.$mobx||"$mobx",O=s("isUnmounted"),g=s("skipRender"),w=s("isForcingUpdate");function j(e){return e.displayName||e.name||e.constructor&&(e.constructor.displayName||e.constructor.name)||"<component>"}function x(e,r){return t.isUsingStaticRendering()&&console.warn("[mobx-react] It seems that a re-rendering of a React component is triggered while in static (server-side) mode. Please make sure components are rendered only once server-side."),this.state!==r||!u(this.props,e)}function P(e,r){var t=s("reactProp_"+r+"_valueHolder"),n=s("reactProp_"+r+"_atomHolder");function i(){return this[n]||l(this,n,o.createAtom("reactive "+r)),this[n]}Object.defineProperty(e,r,{configurable:!0,enumerable:!0,get:function(){return i.call(this).reportObserved(),this[t]},set:function(e){this[w]||u(this[t],e)?l(this,t,e):(l(this,t,e),l(this,g,!0),i.call(this).reportChanged(),l(this,g,!1))}})}var R="function"==typeof Symbol&&Symbol.for,E=R?Symbol.for("react.forward_ref"):"function"==typeof n.forwardRef&&n.forwardRef(function(){}).$$typeof,C=R?Symbol.for("react.memo"):"function"==typeof n.memo&&n.memo(function(){}).$$typeof;function S(e){if(!0===e.isMobxInjector&&console.warn("Mobx observer: You are trying to use 'observer' on a component that already has 'inject'. Please apply 'observer' before applying 'inject'"),C&&e.$$typeof===C)throw new Error("Mobx observer: You are trying to use 'observer' on function component wrapped to either another observer or 'React.memo'. The observer already applies 'React.memo' for you.");if(E&&e.$$typeof===E){var r=e.render;if("function"!=typeof r)throw new Error("render property of ForwardRef was not a function");return n.forwardRef(function(){var e=arguments;return i.createElement(t.Observer,null,function(){return r.apply(void 0,e)})})}return"function"!=typeof e||e.prototype&&e.prototype.render||e.isReactClass||Object.prototype.isPrototypeOf.call(n.Component,e)?function(e){var r=e.prototype;if(r.componentWillReact)throw new Error("The componentWillReact life-cycle event is no longer supported");if(e.__proto__!==n.PureComponent)if(r.shouldComponentUpdate){if(r.shouldComponentUpdate!==x)throw new Error("It is not allowed to use shouldComponentUpdate in observer based components.")}else r.shouldComponentUpdate=x;P(r,"props"),P(r,"state");var i=r.render;return r.render=function(){return function(e){var r=this;if(!0===t.isUsingStaticRendering())return e.call(this);l(this,g,!1),l(this,w,!1);var i=j(this),a=e.bind(this),c=!1,s=new o.Reaction(i+".render()",function(){if(!c&&(c=!0,!0!==r[O])){var e=!0;try{l(r,w,!0),r[g]||n.Component.prototype.forceUpdate.call(r),e=!1}finally{l(r,w,!1),e&&s.dispose()}}});function u(){c=!1;var e=void 0,r=void 0;if(s.track(function(){try{r=o._allowStateChanges(!1,a)}catch(r){e=r}}),e)throw e;return r}return s.reactComponent=this,u[h]=s,this.render=u,u.call(this)}.call(this,i)},v(r,"componentWillUnmount",function(){if(!0!==t.isUsingStaticRendering()){if(this.render[h])this.render[h].dispose();else if("production"!==process.env.NODE_ENV){var e=j(this);console.warn("The render function for an observer component ("+e+") was modified after MobX attached. This is not supported, since the new function can't be triggered by MobX.")}this[O]=!0}}),e}(e):t.observer(e)}var U=i.createContext({});function k(e){var r=e.children,t=function(e,r){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&-1===r.indexOf(n)&&(t[n]=e[n]);return t}(e,["children"]),n=i.useContext(U),o=i.useRef(Object.assign({},n,t)).current;if(process&&void 0!==process.env&&"production"!==process.env.NODE_ENV&&!u(o,Object.assign({},o,t)))throw new Error("MobX Provider: The set of provided stores has changed. See: https://github.com/mobxjs/mobx-react#the-set-of-provided-stores-has-changed-error.");return i.createElement(U.Provider,{value:o},r)}function A(e,r,t,o){var a,c,s,u=i.forwardRef(function(t,o){var a=Object.assign({},t),c=i.useContext(U);return Object.assign(a,e(c||{},a)||{}),o&&(a.ref=o),n.createElement(r,a)});return o&&(u=S(u)),u.isMobxInjector=!0,a=r,c=u,s=Object.getOwnPropertyNames(Object.getPrototypeOf(a)),Object.getOwnPropertyNames(a).forEach(function(e){p[e]||-1!==s.indexOf(e)||Object.defineProperty(c,e,Object.getOwnPropertyDescriptor(a,e))}),u.wrappedComponent=r,u.displayName=function(e,r){var t=e.displayName||e.name||e.constructor&&e.constructor.name||"Component";return r?"inject-with-"+r+"("+t+")":"inject("+t+")"}(r,t),u}k.displayName="MobXProvider";var M=s("disposeOnUnmountProto"),_=s("disposeOnUnmountInst");function T(){var e=this;(this[M]||[]).concat(this[_]||[]).forEach(function(r){var t="string"==typeof r?e[r]:r;null!=t&&(Array.isArray(t)?t.map(function(e){return e()}):t())})}function $(e){function r(r,t,n,i,a,c){for(var s=[],u=arguments.length-6;u-- >0;)s[u]=arguments[u+6];return o.untracked(function(){return i=i||"<<anonymous>>",c=c||n,null==t[n]?r?new Error("The "+a+" `"+c+"` is marked as required in `"+i+"`, but its value is `"+(null===t[n]?"null":"undefined")+"`."):null:e.apply(void 0,[t,n,i,a,c].concat(s))})}var t=r.bind(null,!1);return t.isRequired=r.bind(null,!0),t}function N(e){var r=typeof e;return Array.isArray(e)?"array":e instanceof RegExp?"object":function(e,r){return"symbol"===e||"Symbol"===r["@@toStringTag"]||"function"==typeof Symbol&&r instanceof Symbol}(r,e)?"symbol":r}function D(e,r){return $(function(t,n,i,a,c){return o.untracked(function(){if(e&&N(t[n])===r.toLowerCase())return null;var a;switch(r){case"Array":a=o.isObservableArray;break;case"Object":a=o.isObservableObject;break;case"Map":a=o.isObservableMap;break;default:throw new Error("Unexpected mobxType: "+r)}var s=t[n];if(!a(s)){var u=function(e){var r=N(e);if("object"===r){if(e instanceof Date)return"date";if(e instanceof RegExp)return"regexp"}return r}(s),f=e?" or javascript `"+r.toLowerCase()+"`":"";return new Error("Invalid prop `"+c+"` of type `"+u+"` supplied to `"+i+"`, expected `mobx.Observable"+r+"`"+f+".")}return null})})}function q(e,r){return $(function(t,n,i,a,c){for(var s=[],u=arguments.length-5;u-- >0;)s[u]=arguments[u+5];return o.untracked(function(){if("function"!=typeof r)return new Error("Property `"+c+"` of component `"+i+"` has invalid PropType notation.");var o=D(e,"Array")(t,n,i);if(o instanceof Error)return o;for(var u=t[n],f=0;f<u.length;f++)if((o=r.apply(void 0,[u,f,i,a,c+"["+f+"]"].concat(s)))instanceof Error)return o;return null})})}var I={observableArray:D(!1,"Array"),observableArrayOf:q.bind(null,!1),observableMap:D(!1,"Map"),observableObject:D(!1,"Object"),arrayOrObservableArray:D(!0,"Array"),arrayOrObservableArrayOf:q.bind(null,!0),objectOrObservableObject:D(!0,"Object")};if(!n.Component)throw new Error("mobx-react requires React to be available");if(!o.observable)throw new Error("mobx-react requires mobx to be available");"function"==typeof r.unstable_batchedUpdates&&o.configure({reactionScheduler:r.unstable_batchedUpdates}),e.Observer=t.Observer,e.useObserver=t.useObserver,e.useAsObservableSource=t.useAsObservableSource,e.useLocalStore=t.useLocalStore,e.isUsingStaticRendering=t.isUsingStaticRendering,e.useStaticRendering=t.useStaticRendering,e.observer=S,e.Provider=k,e.MobXProviderContext=U,e.inject=function(){for(var e,r=[],t=arguments.length;t--;)r[t]=arguments[t];return"function"==typeof arguments[0]?(e=arguments[0],function(r){return A(e,r,e.name,!0)}):function(e){return A(function(e){return function(r,t){return e.forEach(function(e){if(!(e in t)){if(!(e in r))throw new Error("MobX injector: Store '"+e+"' is not available! Make sure it is provided by some Provider");t[e]=r[e]}}),t}}(r),e,r.join("-"),!1)}},e.disposeOnUnmount=function e(r,t){if(Array.isArray(t))return t.map(function(t){return e(r,t)});var o=Object.getPrototypeOf(r).constructor||Object.getPrototypeOf(r.constructor),i=Object.getPrototypeOf(r.constructor);if(o!==n.Component&&o!==n.PureComponent&&i!==n.Component&&i!==n.PureComponent)throw new Error("[mobx-react] disposeOnUnmount only supports direct subclasses of React.Component or React.PureComponent.");if("string"!=typeof t&&"function"!=typeof t&&!Array.isArray(t))throw new Error("[mobx-react] disposeOnUnmount only works if the parameter is either a property key or a function.");var a=!!r[M]||!!r[_];return("string"==typeof t?r[M]||(r[M]=[]):r[_]||(r[_]=[])).push(t),a||v(r,"componentWillUnmount",T),"string"!=typeof t?t:void 0},e.PropTypes=I});
-//# sourceMappingURL=mobx-react.umd.js.map
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("mobx"),require("react"),require("react-dom"),require("mobx-react-lite")):"function"==typeof define&&define.amd?define(["exports","mobx","react","react-dom","mobx-react-lite"],t):t((e=e||self).mobxReact={},e.mobx,e.React,e.ReactDOM,e.mobxReactLite)}(this,(function(e,t,r,n,o){"use strict";var i="default"in r?r.default:r;let s=0;const c={};function a(e){return c[e]||(c[e]=function(e){if("function"==typeof Symbol)return Symbol(e);const t=`__$mobx-react ${e} (${s})`;return s++,t}(e)),c[e]}function u(e,t){if(l(e,t))return!0;if("object"!=typeof e||null===e||"object"!=typeof t||null===t)return!1;const r=Object.keys(e),n=Object.keys(t);if(r.length!==n.length)return!1;for(let n=0;n<r.length;n++)if(!Object.hasOwnProperty.call(t,r[n])||!l(e[r[n]],t[r[n]]))return!1;return!0}function l(e,t){return e===t?0!==e||1/e==1/t:e!=e&&t!=t}const f={$$typeof:1,render:1,compare:1,type:1,childContextTypes:1,contextType:1,contextTypes:1,defaultProps:1,getDefaultProps:1,getDerivedStateFromError:1,getDerivedStateFromProps:1,mixins:1,propTypes:1};function p(e,t,r){Object.hasOwnProperty.call(e,t)?e[t]=r:Object.defineProperty(e,t,{enumerable:!1,configurable:!0,writable:!0,value:r})}const b=a("patchMixins"),d=a("patchedDefinition");function y(e,t,...r){t.locks++;try{let n;return null!=e&&(n=e.apply(this,r)),n}finally{t.locks--,0===t.locks&&t.methods.forEach(e=>{e.apply(this,r)})}}function m(e,t){return function(...r){y.call(this,e,t,...r)}}function h(e,t,r){const n=function(e,t){const r=e[b]=e[b]||{},n=r[t]=r[t]||{};return n.locks=n.locks||0,n.methods=n.methods||[],n}(e,t);n.methods.indexOf(r)<0&&n.methods.push(r);const o=Object.getOwnPropertyDescriptor(e,t);if(o&&o[d])return;const i=function e(t,r,n,o,i){let s=m(i,o);return{[d]:!0,get:function(){return s},set:function(i){if(this===t)s=m(i,o);else{const t=e(this,r,n,o,i);Object.defineProperty(this,r,t)}},configurable:!0,enumerable:n}}(e,t,o?o.enumerable:void 0,n,e[t]);Object.defineProperty(e,t,i)}const O=t.$mobx||"$mobx",g=a("isUnmounted"),v=a("skipRender"),w=a("isForcingUpdate");function j(e){const t=e.prototype;if(t.componentWillReact)throw new Error("The componentWillReact life-cycle event is no longer supported");if(e.__proto__!==r.PureComponent)if(t.shouldComponentUpdate){if(t.shouldComponentUpdate!==x)throw new Error("It is not allowed to use shouldComponentUpdate in observer based components.")}else t.shouldComponentUpdate=x;R(t,"props"),R(t,"state");const n=t.render;return t.render=function(){return P.call(this,n)},h(t,"componentWillUnmount",(function(){!0!==o.isUsingStaticRendering()&&(this.render[O]&&this.render[O].dispose(),this[g]=!0)})),e}function P(e){if(!0===o.isUsingStaticRendering())return e.call(this);p(this,v,!1),p(this,w,!1);const n=this.displayName||this.name||this.constructor&&(this.constructor.displayName||this.constructor.name)||"<component>",i=e.bind(this);let s=!1;const c=new t.Reaction(`${n}.render()`,()=>{if(!s&&(s=!0,!0!==this[g])){let e=!0;try{p(this,w,!0),this[v]||r.Component.prototype.forceUpdate.call(this),e=!1}finally{p(this,w,!1),e&&c.dispose()}}});function a(){s=!1;let e=void 0,r=void 0;if(c.track(()=>{try{r=t._allowStateChanges(!1,i)}catch(t){e=t}}),e)throw e;return r}return c.reactComponent=this,a[O]=c,this.render=a,a.call(this)}function x(e,t){return o.isUsingStaticRendering()&&console.warn("[mobx-react] It seems that a re-rendering of a React component is triggered while in static (server-side) mode. Please make sure components are rendered only once server-side."),this.state!==t||!u(this.props,e)}function R(e,r){const n=a(`reactProp_${r}_valueHolder`),o=a(`reactProp_${r}_atomHolder`);function i(){return this[o]||p(this,o,t.createAtom("reactive "+r)),this[o]}Object.defineProperty(e,r,{configurable:!0,enumerable:!0,get:function(){let e=!1;return t._allowStateReadsStart&&t._allowStateReadsEnd&&(e=t._allowStateReadsStart(!0)),i.call(this).reportObserved(),t._allowStateReadsStart&&t._allowStateReadsEnd&&t._allowStateReadsEnd(e),this[n]},set:function(e){this[w]||u(this[n],e)?p(this,n,e):(p(this,n,e),p(this,v,!0),i.call(this).reportChanged(),p(this,v,!1))}})}const S="function"==typeof Symbol&&Symbol.for,E=S?Symbol.for("react.forward_ref"):"function"==typeof r.forwardRef&&r.forwardRef(e=>null).$$typeof,C=S?Symbol.for("react.memo"):"function"==typeof r.memo&&r.memo(e=>null).$$typeof;function U(e){if(!0===e.isMobxInjector&&console.warn("Mobx observer: You are trying to use 'observer' on a component that already has 'inject'. Please apply 'observer' before applying 'inject'"),C&&e.$$typeof===C)throw new Error("Mobx observer: You are trying to use 'observer' on function component wrapped to either another observer or 'React.memo'. The observer already applies 'React.memo' for you.");if(E&&e.$$typeof===E){const t=e.render;if("function"!=typeof t)throw new Error("render property of ForwardRef was not a function");return r.forwardRef((function(){return r.createElement(o.Observer,null,()=>t.apply(void 0,arguments))}))}return"function"!=typeof e||e.prototype&&e.prototype.render||e.isReactClass||Object.prototype.isPrototypeOf.call(r.Component,e)?j(e):o.observer(e)}const _=i.createContext({});function k(e){const{children:t,...r}=e,n=i.useContext(_),o=i.useRef({...n,...r});return i.createElement(_.Provider,{value:o.current},t)}function A(e,t,r,n){let o=i.forwardRef((r,n)=>{const o={...r},s=i.useContext(_);return Object.assign(o,e(s||{},o)||{}),n&&(o.ref=n),i.createElement(t,o)});return n&&(o=U(o)),o.isMobxInjector=!0,function(e,t){const r=Object.getOwnPropertyNames(Object.getPrototypeOf(e));Object.getOwnPropertyNames(e).forEach(n=>{f[n]||-1!==r.indexOf(n)||Object.defineProperty(t,n,Object.getOwnPropertyDescriptor(e,n))})}(t,o),o.wrappedComponent=t,o.displayName=function(e,t){let r;const n=e.displayName||e.name||e.constructor&&e.constructor.name||"Component";return r=t?"inject-with-"+t+"("+n+")":"inject("+n+")",r}(t,r),o}function $(e){return function(t,r){return e.forEach((function(e){if(!(e in r)){if(!(e in t))throw new Error("MobX injector: Store '"+e+"' is not available! Make sure it is provided by some Provider");r[e]=t[e]}})),r}}k.displayName="MobXProvider";const M=a("disposeOnUnmountProto"),T=a("disposeOnUnmountInst");function q(){[...this[M]||[],...this[T]||[]].forEach(e=>{const t="string"==typeof e?this[e]:e;null!=t&&(Array.isArray(t)?t.map(e=>e()):t())})}function D(e){function r(r,n,o,i,s,c,...a){return t.untracked(()=>(i=i||"<<anonymous>>",c=c||o,null==n[o]?r?new Error("The "+s+" `"+c+"` is marked as required in `"+i+"`, but its value is `"+(null===n[o]?"null":"undefined")+"`."):null:e(n,o,i,s,c,...a)))}const n=r.bind(null,!1);return n.isRequired=r.bind(null,!0),n}function N(e){const t=typeof e;return Array.isArray(e)?"array":e instanceof RegExp?"object":function(e,t){return"symbol"===e||"Symbol"===t["@@toStringTag"]||"function"==typeof Symbol&&t instanceof Symbol}(t,e)?"symbol":t}function I(e,r){return D((n,o,i,s,c)=>t.untracked(()=>{if(e&&N(n[o])===r.toLowerCase())return null;let s;switch(r){case"Array":s=t.isObservableArray;break;case"Object":s=t.isObservableObject;break;case"Map":s=t.isObservableMap;break;default:throw new Error(`Unexpected mobxType: ${r}`)}const a=n[o];if(!s(a)){const t=function(e){const t=N(e);if("object"===t){if(e instanceof Date)return"date";if(e instanceof RegExp)return"regexp"}return t}(a),n=e?" or javascript `"+r.toLowerCase()+"`":"";return new Error("Invalid prop `"+c+"` of type `"+t+"` supplied to `"+i+"`, expected `mobx.Observable"+r+"`"+n+".")}return null}))}function L(e,r){return D((n,o,i,s,c,...a)=>t.untracked(()=>{if("function"!=typeof r)return new Error("Property `"+c+"` of component `"+i+"` has invalid PropType notation.");{let t=I(e,"Array")(n,o,i,s,c);if(t instanceof Error)return t;const u=n[o];for(let e=0;e<u.length;e++)if(t=r(u,e,i,s,c+"["+e+"]",...a),t instanceof Error)return t;return null}}))}const F={observableArray:I(!1,"Array"),observableArrayOf:L.bind(null,!1),observableMap:I(!1,"Map"),observableObject:I(!1,"Object"),arrayOrObservableArray:I(!0,"Array"),arrayOrObservableArrayOf:L.bind(null,!0),objectOrObservableObject:I(!0,"Object")};if(!r.Component)throw new Error("mobx-react requires React to be available");if(!t.observable)throw new Error("mobx-react requires mobx to be available");"function"==typeof n.unstable_batchedUpdates&&t.configure({reactionScheduler:n.unstable_batchedUpdates}),Object.defineProperty(e,"Observer",{enumerable:!0,get:function(){return o.Observer}}),Object.defineProperty(e,"isUsingStaticRendering",{enumerable:!0,get:function(){return o.isUsingStaticRendering}}),Object.defineProperty(e,"useAsObservableSource",{enumerable:!0,get:function(){return o.useAsObservableSource}}),Object.defineProperty(e,"useLocalStore",{enumerable:!0,get:function(){return o.useLocalStore}}),Object.defineProperty(e,"useObserver",{enumerable:!0,get:function(){return o.useObserver}}),Object.defineProperty(e,"useStaticRendering",{enumerable:!0,get:function(){return o.useStaticRendering}}),e.MobXProviderContext=_,e.PropTypes=F,e.Provider=k,e.disposeOnUnmount=function e(t,r){if(Array.isArray(r))return r.map(r=>e(t,r));const n=Object.getPrototypeOf(t).constructor||Object.getPrototypeOf(t.constructor),o=Object.getPrototypeOf(t.constructor);if(n!==i.Component&&n!==i.PureComponent&&o!==i.Component&&o!==i.PureComponent)throw new Error("[mobx-react] disposeOnUnmount only supports direct subclasses of React.Component or React.PureComponent.");if("string"!=typeof r&&"function"!=typeof r&&!Array.isArray(r))throw new Error("[mobx-react] disposeOnUnmount only works if the parameter is either a property key or a function.");const s=!!t[M]||!!t[T];return("string"==typeof r?t[M]||(t[M]=[]):t[T]||(t[T]=[])).push(r),s||h(t,"componentWillUnmount",q),"string"!=typeof r?r:void 0},e.inject=function(...e){if("function"==typeof arguments[0]){let e=arguments[0];return t=>A(e,t,e.name,!0)}return t=>A($(e),t,e.join("-"),!1)},e.observer=U,Object.defineProperty(e,"__esModule",{value:!0})}));
+//# sourceMappingURL=mobxreact.umd.production.min.js.map

package.json

 {
   "name": "mobx-react",
-  "version": "6.1.5",
+  "version": "6.1.6",
   "description": "React bindings for MobX. Create fully reactive components.",
-  "source": "src/index.js",
-  "main": "dist/mobx-react.js",
-  "jsnext:main": "dist/mobx-react.module.js",
-  "umd:main": "dist/mobx-react.umd.js",
-  "unpkg": "dist/mobx-react.umd.js",
-  "module": "dist/mobx-react.module.js",
-  "react-native": "dist/mobx-react.rn.module.js",
-  "types": "dist/mobx-react.d.ts",
+  "source": "src/index.ts",
+  "main": "dist/mobxreact.js",
+  "umd:main": "dist/mobxreact.umd.production.min.js",
+  "unpkg": "dist/mobxreact.umd.production.min.js",
+  "jsnext:main": "dist/mobxreact.esm.js",
+  "module": "dist/mobxreact.esm.js",
+  "react-native": "dist/mobxreact.rn.module.js",
+  "types": "dist/index.d.ts",
   "repository": {
@@ -18,16 +18,16 @@ "type": "git",
   "scripts": {
-    "prettier": "prettier --write \"**/*.js\" \"**/*.ts\"",
-    "lint": "eslint .",
-    "test": "jest && yarn test:ts",
+    "test": "jest",
+    "watch": "jest --watch",
+    "lint": "eslint src/**/*.ts",
+    "test:types": "yarn tsc --noEmit",
+    "test:check": "yarn test:types && yarn lint",
     "test:ts": "tsc -p test/ts",
-    "test:ci": "jest -i --coverage && yarn test:ts && yarn lint",
-    "size": "size-limit",
-    "build": "yarn bundle && yarn copytypes && yarn makern",
-    "copytypes": "shx cp src/index.d.ts dist/mobx-react.d.ts",
-    "makern": "shx cp dist/mobx-react.module.js dist/mobx-react.rn.module.js && yarn replace \"react-dom\" \"react-native\" dist/mobx-react.rn.module.js --silent",
-    "bundle": "yarn bundle-cjs-and-es && yarn bundle-umd",
-    "bundle-cjs-and-es": "yarn bundle-via-microbundle --format cjs,es --no-compress",
-    "bundle-umd": "yarn bundle-via-microbundle --format umd --globals react-dom=ReactDOM,react=React,mobx-react-lite=mobxReactLite --name mobxReact",
-    "bundle-via-microbundle": "microbundle --jsx React.createElement --external mobx,react,react-dom,mobx-react-lite",
-    "watch": "jest --watch"
+    "test:coverage": "jest -i --coverage",
+    "test:size": "size-limit",
+    "prettier": "prettier --write \"**/*.js\" \"**/*.ts\" \"**/*.tsx\"",
+    "release": "node publish.js",
+    "build": "tsdx build --name mobxReact --format cjs,esm,umd",
+    "postbuild": "yarn makern && yarn v6compat",
+    "makern": "shx cp dist/mobxreact.esm.js dist/mobx-react.rn.module.js && yarn replace \"react-dom\" \"react-native\" dist/mobx-react.rn.module.js --silent",
+    "v6compat": "shx cp dist/mobxreact.umd.production.min.js dist/mobx-react.umd.js"
   },
@@ -44,3 +44,3 @@ "author": "Michel Weststrate",
   "peerDependencies": {
-    "mobx": "^4.0.0 || ^5.0.0",
+    "mobx": "^5.15.4 || ^4.15.4",
     "react": "^16.8.0 || 16.9.0-alpha.0"
@@ -57,2 +57,3 @@ },
     "@types/create-react-class": "^15.6.0",
+    "@types/jest": "^24.9.1",
     "@types/node": "^10.0.0",
@@ -62,2 +63,4 @@ "@types/prop-types": "^15.5.2",
     "@types/react-dom": "^16.0.1",
+    "@typescript-eslint/eslint-plugin": "^2.12.0",
+    "@typescript-eslint/parser": "^2.12.0",
     "babel-eslint": "^10.0.2",
@@ -76,6 +79,5 @@ "babel-jest": "^24.1.0",
     "lodash": "^4.17.4",
-    "microbundle": "^0.11.0",
-    "mobx": "^5.0.0",
+    "mobx": "^5.15.4",
     "prettier": "^1.7.2",
-    "prop-types": "^15.6.0",
+    "prop-types": "^15.7.2",
     "react": "^16.9.0",
@@ -88,3 +90,6 @@ "react-dom": "^16.9.0",
     "size-limit": "^1.3.2",
-    "typescript": "^2.6.0"
+    "ts-jest": "^24.0.0",
+    "tsdx": "0.12.3",
+    "tslib": "1.10.0",
+    "typescript": "^3.7.0"
   },
@@ -106,3 +111,3 @@ "dependencies": {
   "lint-staged": {
-    "*.{ts,js}": [
+    "*.{ts,tsx,js}": [
       "prettier --write",
@@ -114,13 +119,30 @@ "eslint --fix",
   "jest": {
+    "globals": {
+      "ts-jest": {
+        "tsConfig": "tsconfig.test.json"
+      }
+    },
+    "transform": {
+      "^.+\\.tsx?$": "ts-jest",
+      "^.+\\.jsx?$": "babel-jest"
+    },
+    "moduleFileExtensions": [
+      "ts",
+      "tsx",
+      "js",
+      "jsx",
+      "json"
+    ],
+    "testPathIgnorePatterns": [
+      "/node_modules/",
+      "/\\./"
+    ],
+    "watchPathIgnorePatterns": [
+      "<rootDir>/node_modules/"
+    ],
     "setupFilesAfterEnv": [
-      "@testing-library/jest-dom/extend-expect",
-      "<rootDir>/jest.setup.js"
+      "<rootDir>/jest.setup.ts"
     ],
     "testURL": "http://127.0.0.1/"
-  },
-  "husky": {
-    "hooks": {
-      "pre-commit": "lint-staged"
-    }
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Improved metrics

Number of package files

30

increased by150%

Lines of code

2720

increased by47.99%

Number of low supply chain risk alerts

5

decreased by-58.33%

Worsened metrics

Total package byte prevSize

199042

decreased by-31%

Dev dependency count

42

increased by13.51%

Number of low quality alerts

3

increased by200%

No dependency changes