mobx 6.16.1 → 7.0.0

package/src/mobx.ts

@@ -16,13 +16,14 @@
  *
  */
 import { die } from "./errors"
-import { getGlobal } from "./utils/global"
-;["Symbol", "Map", "Set"].forEach(m => {
-    let g = getGlobal()
-    if (typeof g[m] === "undefined") {
-        die(`MobX requires global '${m}' to be available or polyfilled`)
-    }
-})
+if (__DEV__) {
+    const g = globalThis as any
+    ;["Symbol", "Map", "Set", "Proxy"].forEach(m => {
+        if (typeof g[m] === "undefined") {
+            die(`MobX requires global '${m}' to be available or polyfilled`)
+        }
+    })
+}
 
 import { spy, getDebugName, $mobx } from "./internal"
 
@@ -38,7 +39,10 @@ export {
     spy,
     IComputedValue,
     IEqualsComparer,
-    comparer,
+    compareDefault,
+    compareIdentity,
+    compareStructural,
+    compareShallow,
     IEnhancer,
     IInterceptable,
     IInterceptor,
@@ -72,9 +76,14 @@ export {
     IObservableSetInitialValues,
     transaction,
     observable,
+    observableRef,
+    observableShallow,
+    observableDeep,
+    observableStruct,
     IObservableFactory,
     CreateObservableOptions,
     computed,
+    computedStruct,
     IComputedFactory,
     isObservable,
     isObservableProp,
@@ -90,6 +99,7 @@ export {
     when,
     IWhenOptions,
     action,
+    actionBound,
     isAction,
     runInAction,
     IActionFactory,
@@ -106,13 +116,13 @@ export {
     onBecomeObserved,
     onBecomeUnobserved,
     flow,
+    flowBound,
     isFlow,
     flowResult,
     CancellablePromise,
     FlowCancellationError,
     isFlowCancellationError,
     toJS,
-    trace,
     IObserverTree,
     IDependencyTree,
     getDependencyTree,
@@ -138,6 +148,7 @@ export {
     makeObservable,
     makeAutoObservable,
     autoAction as _autoAction,
+    autoActionBound as _autoActionBound,
     AnnotationsMap,
     AnnotationMapEntry,
     override
@@ -145,7 +156,7 @@ export {
 
 // Devtools support
 declare const __MOBX_DEVTOOLS_GLOBAL_HOOK__: { injectMobx: (any) => void }
-if (typeof __MOBX_DEVTOOLS_GLOBAL_HOOK__ === "object") {
+if (__DEV__ && typeof __MOBX_DEVTOOLS_GLOBAL_HOOK__ === "object") {
     // See: https://github.com/andykog/mobx-devtools/
     __MOBX_DEVTOOLS_GLOBAL_HOOK__.injectMobx({
         spy,

package/src/types/actionannotation.ts

@@ -16,8 +16,7 @@ export function createActionAnnotation(name: string, options?: object): Annotati
         annotationType_: name,
         options_: options,
         make_,
-        extend_,
-        decorate_20223_
+        extend_
     }
 }
 
@@ -62,12 +61,12 @@ function extend_(
     return adm.defineProperty_(key, actionDescriptor, proxyTrap)
 }
 
-function decorate_20223_(this: Annotation, mthd, context: DecoratorContext) {
+export function decorateAction20223_(annotation: Annotation, mthd, context: DecoratorContext) {
     if (__DEV__) {
         assert20223DecoratorType(context, ["method", "field"])
     }
     const { kind, name, addInitializer } = context
-    const ann = this
+    const ann = annotation
 
     const _createAction = m =>
         createAction(ann.options_?.name ?? name!.toString(), m, ann.options_?.autoAction ?? false)
@@ -91,7 +90,7 @@ function decorate_20223_(this: Annotation, mthd, context: DecoratorContext) {
             mthd = _createAction(mthd)
         }
 
-        if (this.options_?.bound) {
+        if (ann.options_?.bound) {
             addInitializer(function () {
                 const self = this as any
                 const bound = self[name].bind(self)
@@ -103,10 +102,7 @@ function decorate_20223_(this: Annotation, mthd, context: DecoratorContext) {
         return mthd
     }
 
-    die(
-        `Cannot apply '${ann.annotationType_}' to '${String(name)}' (kind: ${kind}):` +
-            `\n'${ann.annotationType_}' can only be used on properties with a function value.`
-    )
+    die(43, ann.annotationType_, String(name), kind)
 }
 
 function assertActionDescriptor(

package/src/types/autoannotation.ts

@@ -1,16 +1,18 @@
 import {
     ObservableObjectAdministration,
     observable,
+    observableRef,
     Annotation,
     defineProperty,
     createAction,
     globalState,
     flow,
+    flowBound,
     computed,
     autoAction,
+    autoActionBound,
     isGenerator,
     MakeResult,
-    die,
     isAction
 } from "../internal"
 
@@ -23,8 +25,7 @@ export function createAutoAnnotation(options?: object): Annotation {
         annotationType_: AUTO,
         options_: options,
         make_,
-        extend_,
-        decorate_20223_
+        extend_
     }
 }
 
@@ -63,16 +64,16 @@ function make_(
     // function on proto -> autoAction/flow
     if (source !== adm.target_ && typeof descriptor.value === "function") {
         if (isGenerator(descriptor.value)) {
-            const flowAnnotation = this.options_?.autoBind ? flow.bound : flow
+            const flowAnnotation = this.options_?.autoBind ? flowBound : flow
             return flowAnnotation.make_(adm, key, descriptor, source)
         }
-        const actionAnnotation = this.options_?.autoBind ? autoAction.bound : autoAction
+        const actionAnnotation = this.options_?.autoBind ? autoActionBound : autoAction
         return actionAnnotation.make_(adm, key, descriptor, source)
     }
     // other -> observable
     // Copy props from proto as well, see test:
     // "decorate should work with Object.create"
-    let observableAnnotation = this.options_?.deep === false ? observable.ref : observable
+    let observableAnnotation = this.options_?.deep === false ? observableRef : observable
     // if function respect autoBind option
     if (typeof descriptor.value === "function" && this.options_?.autoBind) {
         descriptor.value = descriptor.value.bind(adm.proxy_ ?? adm.target_)
@@ -107,10 +108,6 @@ function extend_(
     if (typeof descriptor.value === "function" && this.options_?.autoBind) {
         descriptor.value = descriptor.value.bind(adm.proxy_ ?? adm.target_)
     }
-    let observableAnnotation = this.options_?.deep === false ? observable.ref : observable
+    let observableAnnotation = this.options_?.deep === false ? observableRef : observable
     return observableAnnotation.extend_(adm, key, descriptor, proxyTrap)
 }
-
-function decorate_20223_(this: Annotation, desc, context: ClassGetterDecoratorContext) {
-    die(`'${this.annotationType_}' cannot be used as a decorator`)
-}

package/src/types/computedannotation.ts

@@ -6,7 +6,8 @@ import {
     assert20223DecoratorType,
     $mobx,
     asObservableObject,
-    ComputedValue
+    ComputedValue,
+    assign
 } from "../internal"
 
 export function createComputedAnnotation(name: string, options?: object): Annotation {
@@ -14,8 +15,7 @@ export function createComputedAnnotation(name: string, options?: object): Annota
         annotationType_: name,
         options_: options,
         make_,
-        extend_,
-        decorate_20223_
+        extend_
     }
 }
 
@@ -38,20 +38,23 @@ function extend_(
     assertComputedDescriptor(adm, this, key, descriptor)
     return adm.defineComputedProperty_(
         key,
-        {
-            ...this.options_,
+        assign({}, this.options_, {
             get: descriptor.get,
             set: descriptor.set
-        },
+        }),
         proxyTrap
     )
 }
 
-function decorate_20223_(this: Annotation, get, context: ClassGetterDecoratorContext) {
+export function decorateComputed20223_(
+    annotation: Annotation,
+    get,
+    context: ClassGetterDecoratorContext
+) {
     if (__DEV__) {
         assert20223DecoratorType(context, ["getter"])
     }
-    const ann = this
+    const ann = annotation
     const { name: key, addInitializer } = context
     let computedValues: WeakMap<object, ComputedValue<any>> | undefined
 
@@ -59,11 +62,10 @@ function decorate_20223_(this: Annotation, get, context: ClassGetterDecoratorCon
     // ComputedValues for getters that are never read on a given instance.
     // The factory is materialised by ObservableObjectAdministration on demand.
     function createComputedValue(target: object, adm: ObservableObjectAdministration) {
-        const options = {
-            ...ann.options_,
+        const options = assign({}, ann.options_, {
             get,
             context: target
-        }
+        })
         options.name ||= __DEV__
             ? `${adm.name_}.${key.toString()}`
             : `ObservableObject.${key.toString()}`

package/src/types/decorator_fills.ts

@@ -25,6 +25,10 @@ export type ClassFieldDecorator<This = any, Value extends (...p: any[]) => any =
     context: ClassFieldDecoratorContext<This, Value>
 ) => Value | void
 
+export type ClassMethodAndFieldDecorator = ClassMethodDecorator & ClassFieldDecorator
+
+export type ClassAccessorAndFieldDecorator = ClassAccessorDecorator & ClassFieldDecorator
+
 export type Decorator =
     | ClassAccessorDecorator
     | ClassGetterDecorator

package/src/types/dynamicobject.ts

@@ -2,11 +2,8 @@ import {
     $mobx,
     IIsObservableObject,
     ObservableObjectAdministration,
-    warnAboutProxyRequirement,
-    assertProxies,
     die,
     isStringish,
-    globalState,
     CreateObservableOptions,
     asObservableObject
 } from "../internal"
@@ -19,11 +16,6 @@ function getAdm(target): ObservableObjectAdministration {
 // and skip either the internal values map, or the base object with its property descriptors!
 const objectProxyTraps: ProxyHandler<any> = {
     has(target: IIsObservableObject, name: PropertyKey): boolean {
-        if (__DEV__ && globalState.trackingDerivation) {
-            warnAboutProxyRequirement(
-                "detect new properties using the 'in' operator. Use 'has' from 'mobx' instead."
-            )
-        }
         return getAdm(target).has_(name)
     },
     get(target: IIsObservableObject, name: PropertyKey): any {
@@ -33,20 +25,10 @@ const objectProxyTraps: ProxyHandler<any> = {
         if (!isStringish(name)) {
             return false
         }
-        if (__DEV__ && !getAdm(target).values_.has(name)) {
-            warnAboutProxyRequirement(
-                "add a new observable property through direct assignment. Use 'set' from 'mobx' instead."
-            )
-        }
         // null (intercepted) -> true (success)
         return getAdm(target).set_(name, value, true) ?? true
     },
     deleteProperty(target: IIsObservableObject, name: PropertyKey): boolean {
-        if (__DEV__) {
-            warnAboutProxyRequirement(
-                "delete properties from an observable object. Use 'remove' from 'mobx' instead."
-            )
-        }
         if (!isStringish(name)) {
             return false
         }
@@ -58,20 +40,10 @@ const objectProxyTraps: ProxyHandler<any> = {
         name: PropertyKey,
         descriptor: PropertyDescriptor
     ): boolean {
-        if (__DEV__) {
-            warnAboutProxyRequirement(
-                "define property on an observable object. Use 'defineProperty' from 'mobx' instead."
-            )
-        }
         // null (intercepted) -> true (success)
         return getAdm(target).defineProperty_(name, descriptor) ?? true
     },
     ownKeys(target: IIsObservableObject): ArrayLike<string | symbol> {
-        if (__DEV__ && globalState.trackingDerivation) {
-            warnAboutProxyRequirement(
-                "iterate keys to detect added / removed properties. Use 'keys' from 'mobx' instead."
-            )
-        }
         return getAdm(target).ownKeys_()
     },
     preventExtensions(target) {
@@ -83,7 +55,6 @@ export function asDynamicObservableObject(
     target: any,
     options?: CreateObservableOptions
 ): IIsObservableObject {
-    assertProxies()
     target = asObservableObject(target, options)
     return (target[$mobx].proxy_ ??= new Proxy(target, objectProxyTraps))
 }

package/src/types/flowannotation.ts

@@ -17,8 +17,7 @@ export function createFlowAnnotation(name: string, options?: object): Annotation
         annotationType_: name,
         options_: options,
         make_,
-        extend_,
-        decorate_20223_
+        extend_
     }
 }
 
@@ -63,7 +62,11 @@ function extend_(
     return adm.defineProperty_(key, flowDescriptor, proxyTrap)
 }
 
-function decorate_20223_(this: Annotation, mthd, context: ClassMethodDecoratorContext) {
+export function decorateFlow20223_(
+    annotation: Annotation,
+    mthd,
+    context: ClassMethodDecoratorContext
+) {
     if (__DEV__) {
         assert20223DecoratorType(context, ["method"])
     }
@@ -73,7 +76,7 @@ function decorate_20223_(this: Annotation, mthd, context: ClassMethodDecoratorCo
         mthd = flow(mthd)
     }
 
-    if (this.options_?.bound) {
+    if (annotation.options_?.bound) {
         addInitializer(function () {
             const self = this as any
             const bound = self[name].bind(self)

package/src/types/observableannotation.ts

@@ -15,8 +15,7 @@ export function createObservableAnnotation(name: string, options?: object): Anno
         annotationType_: name,
         options_: options,
         make_,
-        extend_,
-        decorate_20223_
+        extend_
     }
 }
 
@@ -40,13 +39,13 @@ function extend_(
     return adm.defineObservableProperty_(
         key,
         descriptor.value,
-        this.options_?.enhancer ?? deepEnhancer,
+        this.options_?.enhancer_ ?? deepEnhancer,
         proxyTrap
     )
 }
 
-function decorate_20223_(
-    this: Annotation,
+export function decorateObservable20223_(
+    annotation: Annotation,
     desc,
     context: ClassAccessorDecoratorContext | ClassFieldDecoratorContext
 ) {
@@ -61,7 +60,7 @@ function decorate_20223_(
         assert20223DecoratorType(context, ["accessor"])
     }
 
-    const ann = this
+    const ann = annotation
     const { kind, name } = context
 
     if (kind !== "accessor") {
@@ -78,7 +77,7 @@ function decorate_20223_(
             () =>
                 new ObservableValue(
                     value,
-                    ann.options_?.enhancer ?? deepEnhancer,
+                    ann.options_?.enhancer_ ?? deepEnhancer,
                     __DEV__
                         ? `${adm.name_}.${name.toString()}`
                         : `ObservableObject.${name.toString()}`,

package/src/types/observablearray.ts

@@ -5,9 +5,7 @@ import {
     IAtom,
     IEnhancer,
     IInterceptable,
-    IInterceptor,
     IListenable,
-    Lambda,
     addHiddenFinalProp,
     checkIfStateModificationsAreAllowed,
     createInstanceofPredicate,
@@ -18,12 +16,8 @@ import {
     isObject,
     isSpyEnabled,
     notifyListeners,
-    registerInterceptor,
-    registerListener,
     spyReportEnd,
     spyReportStart,
-    assertProxies,
-    reserveArrayBuffer,
     hasProp,
     die,
     globalState,
@@ -130,8 +124,7 @@ export class ObservableArrayAdministration
     constructor(
         name = __DEV__ ? "ObservableArray@" + getNextId() : "ObservableArray",
         enhancer: IEnhancer<any>,
-        public owned_: boolean,
-        public legacyMode_: boolean
+        public owned_: boolean
     ) {
         this.atom_ = new Atom(name)
         this.enhancer_ = (newV, oldV) =>
@@ -152,30 +145,6 @@ export class ObservableArrayAdministration
         return values
     }
 
-    intercept_(handler: IInterceptor<IArrayWillChange<any> | IArrayWillSplice<any>>): Lambda {
-        return registerInterceptor<IArrayWillChange<any> | IArrayWillSplice<any>>(this, handler)
-    }
-
-    observe_(
-        listener: (changeData: IArrayDidChange<any>) => void,
-        fireImmediately = false
-    ): Lambda {
-        if (fireImmediately) {
-            listener(<IArraySplice<any>>{
-                observableKind: "array",
-                object: this.proxy_ as any,
-                debugObjectName: this.atom_.name_,
-                type: "splice",
-                index: 0,
-                added: this.values_.slice(),
-                addedCount: this.values_.length,
-                removed: [],
-                removedCount: 0
-            })
-        }
-        return registerListener(this, listener)
-    }
-
     getArrayLength_(): number {
         this.atom_.reportObserved()
         return this.values_.length
@@ -183,16 +152,13 @@ export class ObservableArrayAdministration
 
     setArrayLength_(newLength: number) {
         if (typeof newLength !== "number" || isNaN(newLength) || newLength < 0) {
-            die("Out of range: " + newLength)
+            die(40, newLength)
         }
         let currentLength = this.values_.length
         if (newLength === currentLength) {
             return
         } else if (newLength > currentLength) {
-            const newItems = new Array(newLength - currentLength)
-            for (let i = 0; i < newLength - currentLength; i++) {
-                newItems[i] = undefined
-            } // No Array.fill everywhere...
+            const newItems = Array.from({ length: newLength - currentLength })
             this.spliceWithArray_(currentLength, 0, newItems)
         } else {
             this.spliceWithArray_(newLength, currentLength - newLength)
@@ -204,9 +170,6 @@ export class ObservableArrayAdministration
             die(16)
         }
         this.lastKnownLength_ += delta
-        if (this.legacyMode_ && delta > 0) {
-            reserveArrayBuffer(oldLength + delta + 1)
-        }
     }
 
     spliceWithArray_(index: number, deleteCount?: number, newItems?: any[]): any[] {
@@ -250,7 +213,7 @@ export class ObservableArrayAdministration
 
         newItems =
             newItems.length === 0 ? newItems : newItems.map(v => this.enhancer_(v, undefined))
-        if (this.legacyMode_ || __DEV__) {
+        if (__DEV__) {
             const lengthDelta = newItems.length - deleteCount
             this.updateArrayLength_(length, lengthDelta) // checks if internal array wasn't modified
         }
@@ -283,7 +246,7 @@ export class ObservableArrayAdministration
     }
 
     notifyArrayChildUpdate_(index: number, newValue: any, oldValue: any) {
-        const notifySpy = !this.owned_ && isSpyEnabled()
+        const notifySpy = __DEV__ && !this.owned_ && isSpyEnabled()
         const notify = hasListeners(this)
         const change: IArrayDidChange | null =
             notify || notifySpy
@@ -313,7 +276,7 @@ export class ObservableArrayAdministration
     }
 
     notifyArraySplice_(index: number, added: any[], removed: any[]) {
-        const notifySpy = !this.owned_ && isSpyEnabled()
+        const notifySpy = __DEV__ && !this.owned_ && isSpyEnabled()
         const notify = hasListeners(this)
         const change: IArraySplice | null =
             notify || notifySpy
@@ -344,24 +307,12 @@ export class ObservableArrayAdministration
     }
 
     get_(index: number): any | undefined {
-        if (this.legacyMode_ && index >= this.values_.length) {
-            console.warn(
-                __DEV__
-                    ? `[mobx.array] Attempt to read an array index (${index}) that is out of bounds (${this.values_.length}). Please check length first. Out of bound indices will not be tracked by MobX`
-                    : `[mobx] Out of bounds read: ${index}`
-            )
-            return undefined
-        }
         this.atom_.reportObserved()
         return this.dehanceValue_(this.values_[index])
     }
 
     set_(index: number, newValue: any) {
         const values = this.values_
-        if (this.legacyMode_ && index > values.length) {
-            // out of bounds
-            die(17, index, values.length)
-        }
         if (index < values.length) {
             // update at index in range
             checkIfStateModificationsAreAllowed(this.atom_)
@@ -388,10 +339,7 @@ export class ObservableArrayAdministration
             // For out of bound index, we don't create an actual sparse array,
             // but rather fill the holes with undefined (same as setArrayLength_).
             // This could be considered a bug.
-            const newItems = new Array(index + 1 - values.length)
-            for (let i = 0; i < newItems.length - 1; i++) {
-                newItems[i] = undefined
-            } // No Array.fill everywhere...
+            const newItems = Array.from({ length: index + 1 - values.length })
             newItems[newItems.length - 1] = newValue
             this.spliceWithArray_(values.length, 0, newItems)
         }
@@ -404,9 +352,8 @@ export function createObservableArray<T>(
     name = __DEV__ ? "ObservableArray@" + getNextId() : "ObservableArray",
     owned = false
 ): IObservableArray<T> {
-    assertProxies()
     return initObservable(() => {
-        const adm = new ObservableArrayAdministration(name, enhancer, owned, false)
+        const adm = new ObservableArrayAdministration(name, enhancer, owned)
         addHiddenFinalProp(adm.values_, $mobx, adm)
         const proxy = new Proxy(adm.values_, arrayTraps) as any
         adm.proxy_ = proxy

package/src/types/observablemap.ts

@@ -2,9 +2,7 @@ import {
     $mobx,
     IEnhancer,
     IInterceptable,
-    IInterceptor,
     IListenable,
-    Lambda,
     ObservableValue,
     checkIfStateModificationsAreAllowed,
     createAtom,
@@ -22,17 +20,13 @@ import {
     isSpyEnabled,
     notifyListeners,
     referenceEnhancer,
-    registerInterceptor,
-    registerListener,
     spyReportEnd,
     spyReportStart,
     stringifyKey,
     transaction,
     untracked,
-    onBecomeUnobserved,
     globalState,
     die,
-    isFunction,
     UPDATE,
     IAtom,
     PureSpyEvent,
@@ -106,9 +100,6 @@ export class ObservableMap<K = any, V = any>
         public enhancer_: IEnhancer<V> = deepEnhancer,
         public name_ = __DEV__ ? "ObservableMap@" + getNextId() : "ObservableMap"
     ) {
-        if (!isFunction(Map)) {
-            die(18)
-        }
         initObservable(() => {
             this.keysAtom_ = createAtom(__DEV__ ? `${this.name_}.keys()` : "ObservableMap.keys()")
             this.data_ = new Map()
@@ -137,7 +128,7 @@ export class ObservableMap<K = any, V = any>
                 false
             ))
             this.hasMap_.set(key, newEntry)
-            onBecomeUnobserved(newEntry, () => this.hasMap_.delete(key))
+            newEntry.onBUOL = new Set([() => this.hasMap_.delete(key)])
         }
 
         return entry.get()
@@ -178,7 +169,7 @@ export class ObservableMap<K = any, V = any>
             }
         }
         if (this.has_(key)) {
-            const notifySpy = isSpyEnabled()
+            const notifySpy = __DEV__ && isSpyEnabled()
             const notify = hasListeners(this)
             const change: IMapDidChange<K, V> | null =
                 notify || notifySpy
@@ -217,7 +208,7 @@ export class ObservableMap<K = any, V = any>
         const observable = this.data_.get(key)!
         newValue = (observable as any).prepareNewValue_(newValue) as V
         if (newValue !== globalState.UNCHANGED) {
-            const notifySpy = isSpyEnabled()
+            const notifySpy = __DEV__ && isSpyEnabled()
             const notify = hasListeners(this)
             const change: IMapDidChange<K, V> | null =
                 notify || notifySpy
@@ -258,7 +249,7 @@ export class ObservableMap<K = any, V = any>
             this.hasMap_.get(key)?.setNewValue_(true)
             this.keysAtom_.reportChanged()
         })
-        const notifySpy = isSpyEnabled()
+        const notifySpy = __DEV__ && isSpyEnabled()
         const notify = hasListeners(this)
         const change: IMapDidChange<K, V> | null =
             notify || notifySpy
@@ -481,22 +472,6 @@ export class ObservableMap<K = any, V = any>
     get [Symbol.toStringTag]() {
         return "Map"
     }
-
-    /**
-     * Observes this object. Triggers for the events 'add', 'update' and 'delete'.
-     * See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/observe
-     * for callback details
-     */
-    observe_(listener: (changes: IMapDidChange<K, V>) => void, fireImmediately?: boolean): Lambda {
-        if (__DEV__ && fireImmediately === true) {
-            die("`observe` doesn't support fireImmediately=true in combination with maps.")
-        }
-        return registerListener(this, listener)
-    }
-
-    intercept_(handler: IInterceptor<IMapWillChange<K, V>>): Lambda {
-        return registerInterceptor(this, handler)
-    }
 }
 
 // eslint-disable-next-line