mobx 3.1.17 → 3.3.0

package/CHANGELOG.md

@@ -1,3 +1,29 @@
+# 3.3.0
+
+* Undeprecated `transaction`, see [#1139](https://github.com/mobxjs/mobx/issues/1139)
+* Fixed typings of reaction [#1136](https://github.com/mobxjs/mobx/issues/1136)
+* It is now possible to re-define a computed property [#1121](https://github.com/mobxjs/mobx/issues/1121)
+* Print an helpful error message when using `@action` on a getter [#971](https://github.com/mobxjs/mobx/issues/971)
+* Improved typings of intercept [#1119](https://github.com/mobxjs/mobx/issues/1119)
+* Made code base Prettier [#1103](https://github.com/mobxjs/mobx/issues/1103)
+* react-native will now by default use the es module build as well.
+* Added support for Weex, see [#1163](https://github.com/mobxjs/mobx/pull/1163/)
+* Added workaround for Firefox issue causing MobX to crash, see [#614](https://github.com/mobxjs/mobx/issues/614)
+
+# 3.2.2
+
+* Fixes a bug (or a known limitation) described in [#1092](https://github.com/mobxjs/mobx/issue/1092/). It is now possible to have different observable administration on different levels of the prototype chain. By @guillaumeleclerc
+* Fixed a build issue when using mobx in a project that was using rollup, fixes [#1099](https://github.com/mobxjs/mobx/issue/1099/) by @rossipedia
+* Fixed typings of `useStrict`, by @rickbeerendonk
+
+# 3.2.1
+
+* Introduced customizable value comperators to reactions and computed values. `reaction` and `computed` now support an additional option, `equals`, which takes a comparision function. See [#951](https://github.com/mobxjs/mobx/pull/951/) by @jamiewinder. Fixes #802 and #943. See the updated [`computed` docs](https://mobx.js.org/refguide/computed-decorator.html) for more details.
+
+# 3.2.0
+
+* MobX will warn again when there are multiple instances of MobX loaded, as this lead to often to confusing bugs if the project setup was not properly. The signal mobx that multiple instances are loaded on purpose, use `mobx.extras.runInSandbox`. See [#1082](https://github.com/mobxjs/mobx/issues/1082) for details.
+
 # 3.1.17
 
 * Improved typings of `IObservableArray.intercept`: use more restrictive types for `change` parameter of `handler`, by @bvanreeven

package/README.md

@@ -11,6 +11,7 @@ _Simple, scalable state management_
 [![Donate](https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif)](https://mobxjs.github.io/mobx/donate.html)
 [![OpenCollective](https://opencollective.com/mobx/backers/badge.svg)](#backers)
 [![OpenCollective](https://opencollective.com/mobx/sponsors/badge.svg)](#sponsors)
+[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)
 
 ![npm install mobx](https://nodei.co/npm/mobx.png?downloadRank=true&downloads=true)
 
@@ -55,7 +56,7 @@ Both React and MobX provide very optimal and unique solutions to common problems
 
 ## Core concepts
 
-MobX has only a few core concepts. The following snippets can be tried online using [JSFiddle](https://jsfiddle.net/mweststrate/wv3yopo0/) (or [without ES6 and JSX](https://jsfiddle.net/rubyred/55oc981v/)).
+MobX has only a few core concepts. The following snippets can be tried online using [JSFiddle](https://jsfiddle.net/mweststrate/f0dptdau/2/) (or [without ES6 and JSX](https://jsfiddle.net/rubyred/55oc981v/)).
 
 ### Observable state
 

package/lib/api/autorun.d.ts

@@ -1,5 +1,6 @@
 import { Lambda } from "../utils/utils";
 import { IReactionPublic, IReactionDisposer } from "../core/reaction";
+import { IEqualsComparer } from "../types/comparer";
 /**
  * Creates a reactive view and keeps it alive, so that the view is always
  * updated if one of the dependencies changes, even when the view is not further used by something else.
@@ -45,6 +46,7 @@ export interface IReactionOptions {
     compareStructural?: boolean;
     /** alias for compareStructural */
     struct?: boolean;
+    equals?: IEqualsComparer<any>;
     name?: string;
 }
 /**

package/lib/api/computed.d.ts

@@ -1,7 +1,9 @@
+import { IEqualsComparer } from "../types/comparer";
 import { IComputedValue } from "../core/computedvalue";
 export interface IComputedValueOptions<T> {
     compareStructural?: boolean;
     struct?: boolean;
+    equals?: IEqualsComparer<T>;
     name?: string;
     setter?: (value: T) => void;
     context?: any;
@@ -11,6 +13,7 @@ export interface IComputed {
     <T>(func: () => T, options: IComputedValueOptions<T>): IComputedValue<T>;
     (target: Object, key: string | symbol, baseDescriptor?: PropertyDescriptor): void;
     struct(target: Object, key: string | symbol, baseDescriptor?: PropertyDescriptor): void;
+    equals(equals: IEqualsComparer<any>): PropertyDecorator;
 }
 /**
  * Decorator for class properties: @computed get value() { return expr; }.

package/lib/api/expr.d.ts

@@ -1,15 +1,15 @@
 /**
-    * expr can be used to create temporarily views inside views.
-    * This can be improved to improve performance if a value changes often, but usually doesn't affect the outcome of an expression.
-    *
-    * In the following example the expression prevents that a component is rerender _each time_ the selection changes;
-    * instead it will only rerenders when the current todo is (de)selected.
-    *
-    * reactiveComponent((props) => {
-    *     const todo = props.todo;
-    *     const isSelected = mobx.expr(() => props.viewState.selection === todo);
-    *     return <div className={isSelected ? "todo todo-selected" : "todo"}>{todo.title}</div>
-    * });
-    *
-    */
+ * expr can be used to create temporarily views inside views.
+ * This can be improved to improve performance if a value changes often, but usually doesn't affect the outcome of an expression.
+ *
+ * In the following example the expression prevents that a component is rerender _each time_ the selection changes;
+ * instead it will only rerenders when the current todo is (de)selected.
+ *
+ * reactiveComponent((props) => {
+ *     const todo = props.todo;
+ *     const isSelected = mobx.expr(() => props.viewState.selection === todo);
+ *     return <div className={isSelected ? "todo todo-selected" : "todo"}>{todo.title}</div>
+ * });
+ *
+ */
 export declare function expr<T>(expr: () => T, scope?: any): T;

package/lib/api/intercept-read.d.ts

@@ -1,7 +1,7 @@
-import { Lambda } from '../utils/utils';
-import { IObservableArray } from '../types/observablearray';
-import { ObservableMap } from '../types/observablemap';
-import { IObservableValue } from '../types/observablevalue';
+import { Lambda } from "../utils/utils";
+import { IObservableArray } from "../types/observablearray";
+import { ObservableMap } from "../types/observablemap";
+import { IObservableValue } from "../types/observablevalue";
 export declare type ReadInterceptor<T> = (value: any) => T;
 /** Experimental feature right now, tested indirectly via Mobx-State-Tree */
 export declare function interceptReads<T>(value: IObservableValue<T>, handler: ReadInterceptor<T>): Lambda;

package/lib/api/intercept.d.ts

@@ -9,4 +9,4 @@ export declare function intercept<T>(observableArray: IObservableArray<T>, handl
 export declare function intercept<T>(observableMap: ObservableMap<T>, handler: IInterceptor<IMapWillChange<T>>): Lambda;
 export declare function intercept<T>(observableMap: ObservableMap<T>, property: string, handler: IInterceptor<IValueWillChange<T>>): Lambda;
 export declare function intercept(object: Object, handler: IInterceptor<IObjectWillChange>): Lambda;
-export declare function intercept(object: Object, property: string, handler: IInterceptor<IValueWillChange<any>>): Lambda;
+export declare function intercept<T extends Object, K extends keyof T>(object: T, property: K, handler: IInterceptor<IValueWillChange<any>>): Lambda;

package/lib/api/isobservable.d.ts

@@ -1,6 +1,6 @@
 /**
-    * Returns true if the provided value is reactive.
-    * @param value object, function or array
-    * @param propertyName if propertyName is specified, checkes whether value.propertyName is reactive.
-    */
+ * Returns true if the provided value is reactive.
+ * @param value object, function or array
+ * @param property if property is specified, checks whether value.property is reactive.
+ */
 export declare function isObservable(value: any, property?: string): boolean;

package/lib/api/tojs.d.ts

@@ -1,6 +1,6 @@
 /**
-    * Basically, a deep clone, so that no reactive property will exist anymore.
-    */
+ * Basically, a deep clone, so that no reactive property will exist anymore.
+ */
 export declare function toJS<T>(source: T, detectCycles?: boolean): T;
 export declare function toJS(source: any, detectCycles?: boolean): any;
 export declare function toJS(source: any, detectCycles: boolean, __alreadySeen: [any, any][]): any;

package/lib/core/action.d.ts

@@ -4,7 +4,7 @@ export interface IAction {
 }
 export declare function createAction(actionName: string, fn: Function): Function & IAction;
 export declare function executeAction(actionName: string, fn: Function, scope?: any, args?: IArguments): any;
-export declare function useStrict(strict: boolean): any;
+export declare function useStrict(strict: boolean): void;
 export declare function isStrictModeEnabled(): boolean;
 export declare function allowStateChanges<T>(allowStateChanges: boolean, func: () => T): T;
 export declare function allowStateChangesStart(allowStateChanges: boolean): boolean;

package/lib/core/computedvalue.d.ts

@@ -1,6 +1,7 @@
 import { IObservable } from "./observable";
 import { IDerivation, IDerivationState, CaughtException } from "./derivation";
 import { Lambda } from "../utils/utils";
+import { IEqualsComparer } from "../types/comparer";
 import { IValueDidChange } from "../types/observablevalue";
 export interface IComputedValue<T> {
     get(): T;
@@ -10,7 +11,9 @@ export interface IComputedValue<T> {
 /**
  * A node in the state dependency root that observes other nodes, and can be observed itself.
  *
- * ComputedValue will remember result of the computation for duration of a batch, or being observed
+ * ComputedValue will remember the result of the computation for the duration of the batch, or
+ * while being observed.
+ *
  * During this time it will recompute only when one of its direct dependencies changed,
  * but only when it is being accessed with `ComputedValue.get()`.
  *
@@ -27,7 +30,7 @@ export interface IComputedValue<T> {
 export declare class ComputedValue<T> implements IObservable, IComputedValue<T>, IDerivation {
     derivation: () => T;
     scope: Object | undefined;
-    private compareStructural;
+    private equals;
     dependenciesState: IDerivationState;
     observing: never[];
     newObserving: null;
@@ -50,12 +53,14 @@ export declare class ComputedValue<T> implements IObservable, IComputedValue<T>,
      *
      * The `name` property is for debug purposes only.
      *
-     * The `compareStructural` property indicates whether the return values should be compared structurally.
-     * Normally, a computed value will not notify an upstream observer if a newly produced value is strictly equal to the previously produced value.
-     * However, enabling compareStructural can be convenient if you always produce an new aggregated object and don't want to notify observers if it is structurally the same.
+     * The `equals` property specifies the comparer function to use to determine if a newly produced
+     * value differs from the previous value. Two comparers are provided in the library; `defaultComparer`
+     * compares based on identity comparison (===), and `structualComparer` deeply compares the structure.
+     * Structural comparison can be convenient if you always produce an new aggregated object and
+     * don't want to notify observers if it is structurally the same.
      * This is useful for working with vectors, mouse coordinates etc.
      */
-    constructor(derivation: () => T, scope: Object | undefined, compareStructural: boolean, name: string, setter?: (v: T) => void);
+    constructor(derivation: () => T, scope: Object | undefined, equals: IEqualsComparer<any>, name: string, setter?: (v: T) => void);
     onBecomeStale(): void;
     onBecomeUnobserved(): void;
     /**

package/lib/core/derivation.d.ts

@@ -32,14 +32,15 @@ export declare class CaughtException {
 }
 export declare function isCaughtException(e: any): e is CaughtException;
 /**
- * Finds out wether any dependency of derivation actually changed
- * If dependenciesState is 1 it will recalculate dependencies,
+ * Finds out whether any dependency of the derivation has actually changed.
+ * If dependenciesState is 1 then it will recalculate dependencies,
  * if any dependency changed it will propagate it by changing dependenciesState to 2.
  *
- * By iterating over dependencies in the same order they were reported and stoping on first change
- * all recalculations are called only for ComputedValues that will be tracked anyway by derivation.
- * That is because we assume that if first x dependencies of derivation doesn't change
- * than derivation shuold run the same way up until accessing x-th dependency.
+ * By iterating over the dependencies in the same order that they were reported and
+ * stopping on the first change, all the recalculations are only called for ComputedValues
+ * that will be tracked by derivation. That is because we assume that if the first x
+ * dependencies of the derivation doesn't change then the derivation should run the same way
+ * up until accessing x-th dependency.
  */
 export declare function shouldCompute(derivation: IDerivation): boolean;
 export declare function isComputingDerivation(): boolean;

package/lib/core/globalstate.d.ts

@@ -69,6 +69,7 @@ export declare class MobXGlobals {
     globalReactionErrorHandlers: ((error: any, derivation: IDerivation) => void)[];
 }
 export declare let globalState: MobXGlobals;
+export declare function isolateGlobalState(): void;
 export declare function shareGlobalState(): void;
 export declare function getGlobalState(): any;
 export declare function registerGlobals(): void;

package/lib/core/observable.d.ts

@@ -6,7 +6,7 @@ export interface IDepTreeNode {
 export interface IObservable extends IDepTreeNode {
     diffValue: number;
     /**
-     * Id of the derivation *run* that last accesed this observable.
+     * Id of the derivation *run* that last accessed this observable.
      * If this id equals the *run* id of the current derivation,
      * the dependency is already established
      */

package/lib/mobx.d.ts

@@ -22,6 +22,7 @@ export { IAtom, Atom, BaseAtom } from "./core/atom";
 export { useStrict, isStrictModeEnabled, IAction } from "./core/action";
 export { spy } from "./core/spy";
 export { IComputedValue } from "./core/computedvalue";
+export { IEqualsComparer, comparer } from "./types/comparer";
 export { asReference, asFlat, asStructure, asMap } from "./types/modifiers-old";
 export { IModifierDescriptor, IEnhancer, isModifierDescriptor } from "./types/modifiers";
 export { IInterceptable, IInterceptor } from "./types/intercept-utils";
@@ -52,8 +53,8 @@ import { IDepTreeNode } from "./core/observable";
 import { IObserverTree, IDependencyTree } from "./api/extras";
 import { Lambda } from "./utils/utils";
 import { IObservableArray } from "./types/observablearray";
-import { ObservableMap } from './types/observablemap';
-import { IObservableValue } from './types/observablevalue';
+import { ObservableMap } from "./types/observablemap";
+import { IObservableValue } from "./types/observablevalue";
 export declare const extras: {
     allowStateChanges: <T>(allowStateChanges: boolean, func: () => T) => T;
     deepEqual: (a: any, b: any) => any;
@@ -74,6 +75,7 @@ export declare const extras: {
     onReactionError: (handler: (error: any, derivation: IDerivation) => void) => () => void;
     reserveArrayBuffer: (max: number) => void;
     resetGlobalState: () => void;
+    isolateGlobalState: () => void;
     shareGlobalState: () => void;
     spyReport: (event: any) => void;
     spyReportEnd: (change?: any) => void;
@@ -99,9 +101,14 @@ declare const everything: {
     untracked: <T>(action: () => T) => T;
     Atom: typeof Atom;
     BaseAtom: typeof BaseAtom;
-    useStrict: (strict: boolean) => any;
+    useStrict: (strict: boolean) => void;
     isStrictModeEnabled: () => boolean;
     spy: (listener: (change: any) => void) => Lambda;
+    comparer: {
+        identity: (a: any, b: any) => boolean;
+        structural: (a: any, b: any) => boolean;
+        default: (a: any, b: any) => boolean;
+    };
     asReference: <T>(value: T) => T;
     asFlat: <T>(value: T) => T;
     asStructure: <T>(value: T) => T;
@@ -146,7 +153,7 @@ declare const everything: {
         <T>(observableMap: ObservableMap<T>, handler: IInterceptor<IMapWillChange<T>>): Lambda;
         <T>(observableMap: ObservableMap<T>, property: string, handler: IInterceptor<IValueWillChange<T>>): Lambda;
         (object: Object, handler: IInterceptor<IObjectWillChange>): Lambda;
-        (object: Object, property: string, handler: IInterceptor<IValueWillChange<any>>): Lambda;
+        <T extends Object, K extends keyof T>(object: T, property: K, handler: IInterceptor<IValueWillChange<any>>): Lambda;
     };
     autorun: {
         (view: (r: IReactionPublic) => any, scope?: any): IReactionDisposer;
@@ -199,6 +206,7 @@ declare const everything: {
         onReactionError: (handler: (error: any, derivation: IDerivation) => void) => () => void;
         reserveArrayBuffer: (max: number) => void;
         resetGlobalState: () => void;
+        isolateGlobalState: () => void;
         shareGlobalState: () => void;
         spyReport: (event: any) => void;
         spyReportEnd: (change?: any) => void;