mobx 6.16.1 → 7.0.1

package/src/api/flow.ts

@@ -4,13 +4,11 @@ import {
     die,
     isFunction,
     Annotation,
-    isStringish,
-    storeAnnotation,
     createFlowAnnotation,
-    createDecoratorAnnotation,
-    is20223Decorator
+    decorateFlow20223_,
+    assign
 } from "../internal"
-
+import { createDecoratorAnnotation, type DecoratorAnnotation } from "./decoratorannotation"
 import type { ClassMethodDecorator } from "../types/decorator_fills"
 
 export const FLOW = "flow"
@@ -35,46 +33,44 @@ export function isFlowCancellationError(error: Error) {
 
 export type CancellablePromise<T> = Promise<T> & { cancel(): void }
 
-type FlowGenerator = (...args: any[]) => Generator<any, any, any> | AsyncGenerator<any, any, any>
+function createFlowDecoratorAnnotation(
+    annotation: Annotation
+): DecoratorAnnotation<ClassMethodDecorator> {
+    return createDecoratorAnnotation(annotation, decorateFlow20223_)
+}
 
-// PropertyDecorator is only for legacy decorators
-interface Flow extends Annotation, PropertyDecorator {
-    <This, Value extends FlowGenerator>(
-        value: Value,
-        context: ClassMethodDecoratorContext<This, Value>
-    ): Value | void
+interface Flow extends Annotation, ClassMethodDecorator {
     <R, Args extends any[]>(
-        generator: (...args: Args) => Generator<any, R, any> | AsyncGenerator<any, R, any>
+        generator: (...args: Args) => Generator<any, R, any> | AsyncGenerator<any, R, any>,
+        context?: never
     ): (...args: Args) => CancellablePromise<R>
-    bound: Annotation & PropertyDecorator & ClassMethodDecorator
 }
 
 const flowAnnotation = createFlowAnnotation("flow")
 const flowBoundAnnotation = createFlowAnnotation("flow.bound", { bound: true })
 
-export const flow: Flow = Object.assign(
+export const flow: Flow = assign(
     function flow(arg1, arg2?) {
-        // @flow (2022.3 Decorators)
-        if (is20223Decorator(arg2)) {
-            return flowAnnotation.decorate_20223_(arg1, arg2)
-        }
-        // @flow
-        if (isStringish(arg2)) {
-            return storeAnnotation(arg1, arg2, flowAnnotation)
+        if (arg2 && typeof arg2.kind === "string") {
+            return decorateFlow20223_(flowAnnotation, arg1, arg2)
         }
+
         // flow(fn)
         if (__DEV__ && arguments.length !== 1) {
             die(`Flow expects single argument with generator function`)
         }
         const generator = arg1
-        const name = generator.name || "<unnamed flow>"
+        const name = generator.name || (__DEV__ ? "<unnamed flow>" : "flow")
 
         // Implementation based on https://github.com/tj/co/blob/master/index.js
         const res = function () {
             const ctx = this
             const args = arguments
-            const runId = ++generatorId
-            const gen = action(`${name} - runid: ${runId} - init`, generator).apply(ctx, args)
+            const runId = __DEV__ ? ++generatorId : 0
+            const gen = action(
+                __DEV__ ? `${name} - runid: ${runId} - init` : name,
+                generator
+            ).apply(ctx, args)
             let rejector: (error: any) => void
             let pendingPromise: CancellablePromise<any> | undefined = undefined
 
@@ -87,7 +83,7 @@ export const flow: Flow = Object.assign(
                     let ret
                     try {
                         ret = action(
-                            `${name} - runid: ${runId} - yield ${stepId++}`,
+                            __DEV__ ? `${name} - runid: ${runId} - yield ${stepId++}` : name,
                             gen.next
                         ).call(gen, res)
                     } catch (e) {
@@ -102,7 +98,7 @@ export const flow: Flow = Object.assign(
                     let ret
                     try {
                         ret = action(
-                            `${name} - runid: ${runId} - yield ${stepId++}`,
+                            __DEV__ ? `${name} - runid: ${runId} - yield ${stepId++}` : name,
                             gen.throw!
                         ).call(gen, err)
                     } catch (e) {
@@ -127,7 +123,8 @@ export const flow: Flow = Object.assign(
                 onFulfilled(undefined) // kick off the process
             }) as any
 
-            promise.cancel = action(`${name} - runid: ${runId} - cancel`, function () {
+            const cancelActionName = __DEV__ ? `${name} - runid: ${runId} - cancel` : name
+            promise.cancel = action(cancelActionName, function () {
                 try {
                     if (pendingPromise) {
                         cancelPromise(pendingPromise)
@@ -152,7 +149,7 @@ export const flow: Flow = Object.assign(
     flowAnnotation
 )
 
-flow.bound = createDecoratorAnnotation(flowBoundAnnotation)
+export const flowBound = createFlowDecoratorAnnotation(flowBoundAnnotation)
 
 function cancelPromise(promise) {
     if (isFunction(promise.cancel)) {

package/src/api/intercept.ts

@@ -12,7 +12,8 @@ import {
     getAdministration,
     ObservableSet,
     ISetWillChange,
-    isFunction
+    isFunction,
+    registerInterceptor
 } from "../internal"
 
 export function intercept<T>(
@@ -51,9 +52,9 @@ export function intercept(thing, propOrHandler?, handler?): Lambda {
 }
 
 function interceptInterceptable(thing, handler) {
-    return getAdministration(thing).intercept_(handler)
+    return registerInterceptor(getAdministration(thing), handler)
 }
 
 function interceptProperty(thing, property, handler) {
-    return getAdministration(thing, property).intercept_(handler)
+    return registerInterceptor(getAdministration(thing, property), handler)
 }

package/src/api/makeObservable.ts

@@ -4,15 +4,19 @@ import {
     AnnotationsMap,
     CreateObservableOptions,
     ObservableObjectAdministration,
-    collectStoredAnnotations,
     isPlainObject,
     isObservableObject,
     die,
     ownKeys,
     extendObservable,
     addHiddenProp,
-    storedAnnotationsSymbol,
-    initObservable
+    initObservable,
+    Annotation,
+    assertAnnotable,
+    getDescriptor,
+    MakeResult,
+    objectPrototype,
+    recordAnnotationApplied
 } from "../internal"
 
 // Hack based on https://github.com/Microsoft/TypeScript/issues/14829#issuecomment-322267089
@@ -22,25 +26,16 @@ import {
 // Fixes: https://github.com/mobxjs/mobx/issues/2325#issuecomment-691070022
 type NoInfer<T> = [T][T extends any ? 0 : never]
 
-type MakeObservableOptions = Omit<CreateObservableOptions, "proxy">
-
 export function makeObservable<T extends object, AdditionalKeys extends PropertyKey = never>(
     target: T,
-    annotations?: AnnotationsMap<T, NoInfer<AdditionalKeys>>,
-    options?: MakeObservableOptions
+    annotations: AnnotationsMap<T, NoInfer<AdditionalKeys>>,
+    options?: CreateObservableOptions
 ): T {
     initObservable(() => {
         const adm: ObservableObjectAdministration = asObservableObject(target, options)[$mobx]
-        if (__DEV__ && annotations && target[storedAnnotationsSymbol]) {
-            die(
-                `makeObservable second arg must be nullish when using decorators. Mixing @decorator syntax with annotations is not supported.`
-            )
-        }
-        // Default to decorators
-        annotations ??= collectStoredAnnotations(target)
 
         // Annotate
-        ownKeys(annotations).forEach(key => adm.make_(key, annotations![key]))
+        ownKeys(annotations).forEach(key => make_(adm, key, annotations[key]))
     })
     return target
 }
@@ -51,7 +46,7 @@ const keysSymbol = Symbol("mobx-keys")
 export function makeAutoObservable<T extends object, AdditionalKeys extends PropertyKey = never>(
     target: T,
     overrides?: AnnotationsMap<T, NoInfer<AdditionalKeys>>,
-    options?: MakeObservableOptions
+    options?: CreateObservableOptions
 ): T {
     if (__DEV__) {
         if (!isPlainObject(target) && !isPlainObject(Object.getPrototypeOf(target))) {
@@ -82,7 +77,8 @@ export function makeAutoObservable<T extends object, AdditionalKeys extends Prop
         }
 
         target[keysSymbol].forEach(key =>
-            adm.make_(
+            make_(
+                adm,
                 key,
                 // must pass "undefined" for { key: undefined }
                 !overrides ? true : key in overrides ? overrides[key] : true
@@ -92,3 +88,35 @@ export function makeAutoObservable<T extends object, AdditionalKeys extends Prop
 
     return target
 }
+
+function make_(
+    adm: ObservableObjectAdministration,
+    key: PropertyKey,
+    annotation: Annotation | boolean
+) {
+    if (annotation === true) {
+        annotation = adm.defaultAnnotation_
+    }
+    if (annotation === false) {
+        return
+    }
+    assertAnnotable(adm, annotation, key)
+    if (!(key in adm.target_)) {
+        die(1, annotation.annotationType_, `${adm.name_}.${key.toString()}`)
+    }
+    let source = adm.target_
+    while (source && source !== objectPrototype) {
+        const descriptor = getDescriptor(source, key)
+        if (descriptor) {
+            const outcome = annotation.make_(adm, key, descriptor, source)
+            if (outcome === MakeResult.Cancel) {
+                return
+            }
+            if (outcome === MakeResult.Break) {
+                break
+            }
+        }
+        source = Object.getPrototypeOf(source)
+    }
+    recordAnnotationApplied(adm, annotation, key)
+}

package/src/api/object-api.ts

@@ -105,7 +105,7 @@ export function set(obj: any, key: any, value?: any): void {
             key = parseInt(key, 10)
         }
         if (key < 0) {
-            die(`Invalid index: '${key}'`)
+            die(42, key)
         }
         startBatch()
         if (key >= obj.length) {

package/src/api/observable.ts

@@ -24,20 +24,14 @@ import {
     shallowEnhancer,
     refStructEnhancer,
     AnnotationsMap,
-    asObservableObject,
-    storeAnnotation,
-    createDecoratorAnnotation,
-    createLegacyArray,
-    globalState,
     assign,
-    isStringish,
     createObservableAnnotation,
     createAutoAnnotation,
-    is20223Decorator,
-    initObservable
+    initObservable,
+    decorateObservable20223_
 } from "../internal"
-
-import type { ClassAccessorDecorator, ClassFieldDecorator } from "../types/decorator_fills"
+import { createDecoratorAnnotation, type DecoratorAnnotation } from "./decoratorannotation"
+import type { ClassAccessorAndFieldDecorator } from "../types/decorator_fills"
 
 export const OBSERVABLE = "observable"
 export const OBSERVABLE_REF = "observable.ref"
@@ -49,7 +43,6 @@ export type CreateObservableOptions = {
     equals?: IEqualsComparer<any>
     deep?: boolean
     defaultDecorator?: Annotation
-    proxy?: boolean
     autoBind?: boolean
 }
 
@@ -58,8 +51,7 @@ export type CreateObservableOptions = {
 export const defaultCreateObservableOptions: CreateObservableOptions = {
     deep: true,
     name: undefined,
-    defaultDecorator: undefined,
-    proxy: true
+    defaultDecorator: undefined
 }
 Object.freeze(defaultCreateObservableOptions)
 
@@ -69,16 +61,20 @@ export function asCreateObservableOptions(thing: any): CreateObservableOptions {
 
 const observableAnnotation = createObservableAnnotation(OBSERVABLE)
 const observableRefAnnotation = createObservableAnnotation(OBSERVABLE_REF, {
-    enhancer: referenceEnhancer
+    enhancer_: referenceEnhancer
 })
 const observableShallowAnnotation = createObservableAnnotation(OBSERVABLE_SHALLOW, {
-    enhancer: shallowEnhancer
+    enhancer_: shallowEnhancer
 })
 const observableStructAnnotation = createObservableAnnotation(OBSERVABLE_STRUCT, {
-    enhancer: refStructEnhancer
+    enhancer_: refStructEnhancer
 })
-const observableDecoratorAnnotation =
-    createDecoratorAnnotation<ClassAccessorDecorator>(observableAnnotation)
+
+function createObservableDecoratorAnnotation(
+    annotation: Annotation
+): DecoratorAnnotation<ClassAccessorAndFieldDecorator> {
+    return createDecoratorAnnotation(annotation, decorateObservable20223_)
+}
 
 export function getEnhancerFromOptions(options: CreateObservableOptions): IEnhancer<any> {
     return options.deep === true
@@ -95,7 +91,7 @@ export function getAnnotationFromOptions(
 }
 
 export function getEnhancerFromAnnotation(annotation?: Annotation): IEnhancer<any> {
-    return !annotation ? deepEnhancer : annotation.options_?.enhancer ?? deepEnhancer
+    return !annotation ? deepEnhancer : annotation.options_?.enhancer_ ?? deepEnhancer
 }
 
 /**
@@ -103,15 +99,8 @@ export function getEnhancerFromAnnotation(annotation?: Annotation): IEnhancer<an
  * @param v the value which should become observable.
  */
 function createObservable(v: any, arg2?: any, arg3?: any) {
-    // @observable someProp; (2022.3 Decorators)
-    if (is20223Decorator(arg2)) {
-        return observableAnnotation.decorate_20223_(v, arg2)
-    }
-
-    // @observable someProp;
-    if (isStringish(arg2)) {
-        storeAnnotation(v, arg2, observableAnnotation)
-        return
+    if (arg2 && typeof arg2.kind === "string") {
+        return decorateObservable20223_(observableAnnotation, v, arg2)
     }
 
     // already observable - ignore
@@ -147,7 +136,6 @@ function createObservable(v: any, arg2?: any, arg3?: any) {
     // anything else
     return observable.box(v, arg2)
 }
-assign(createObservable, observableDecoratorAnnotation)
 
 export interface IObservableValueFactory {
     <T>(value: T, options?: CreateObservableOptions): IObservableValue<T>
@@ -172,18 +160,13 @@ export interface IObservableMapFactory {
     >
 }
 
-export interface IObservableFactory
-    extends Annotation,
-        PropertyDecorator,
-        ClassAccessorDecorator,
-        ClassFieldDecorator {
-    // TODO: remove ClassFieldDecorator, this is only temporarily support for legacy decorators
+export interface IObservableFactory extends Annotation, ClassAccessorAndFieldDecorator {
     <T = any>(value: T[], options?: CreateObservableOptions): IObservableArray<T>
     <T = any>(value: Set<T>, options?: CreateObservableOptions): ObservableSet<T>
     <K = any, V = any>(value: Map<K, V>, options?: CreateObservableOptions): ObservableMap<K, V>
     <T extends object>(
         value: T,
-        decorators?: AnnotationsMap<T, never>,
+        annotations?: AnnotationsMap<T, never>,
         options?: CreateObservableOptions
     ): T
 
@@ -196,20 +179,9 @@ export interface IObservableFactory
     map: IObservableMapFactory
     object: <T = any>(
         props: T,
-        decorators?: AnnotationsMap<T, never>,
+        annotations?: AnnotationsMap<T, never>,
         options?: CreateObservableOptions
     ) => T
-
-    /**
-     * Decorator that creates an observable that only observes the references, but doesn't try to turn the assigned value into an observable.ts.
-     */
-    ref: Annotation & PropertyDecorator & ClassAccessorDecorator & ClassFieldDecorator
-    /**
-     * Decorator that creates an observable converts its value (objects, maps or arrays) into a shallow observable structure
-     */
-    shallow: Annotation & PropertyDecorator & ClassAccessorDecorator & ClassFieldDecorator
-    deep: Annotation & PropertyDecorator & ClassAccessorDecorator & ClassFieldDecorator
-    struct: Annotation & PropertyDecorator & ClassAccessorDecorator & ClassFieldDecorator
 }
 
 const observableFactories: IObservableFactory = {
@@ -219,11 +191,7 @@ const observableFactories: IObservableFactory = {
     },
     array<T = any>(initialValues?: T[], options?: CreateObservableOptions): IObservableArray<T> {
         const o = asCreateObservableOptions(options)
-        return (
-            globalState.useProxies === false || o.proxy === false
-                ? createLegacyArray
-                : createObservableArray
-        )(initialValues, getEnhancerFromOptions(o), o.name)
+        return createObservableArray(initialValues, getEnhancerFromOptions(o), o.name)
     },
     map<K = any, V = any>(
         initialValues?: IObservableMapInitialValues<K, V>,
@@ -241,24 +209,23 @@ const observableFactories: IObservableFactory = {
     },
     object<T extends object = any>(
         props: T,
-        decorators?: AnnotationsMap<T, never>,
+        annotations?: AnnotationsMap<T, never>,
         options?: CreateObservableOptions
     ): T {
         return initObservable(() =>
-            extendObservable(
-                globalState.useProxies === false || options?.proxy === false
-                    ? asObservableObject({}, options)
-                    : asDynamicObservableObject({}, options),
-                props,
-                decorators
-            )
+            extendObservable(asDynamicObservableObject({}, options), props, annotations)
         )
-    },
-    ref: createDecoratorAnnotation(observableRefAnnotation),
-    shallow: createDecoratorAnnotation(observableShallowAnnotation),
-    deep: observableDecoratorAnnotation,
-    struct: createDecoratorAnnotation(observableStructAnnotation)
+    }
 } as any
 
+export const observableRef = createObservableDecoratorAnnotation(observableRefAnnotation)
+export const observableShallow = createObservableDecoratorAnnotation(observableShallowAnnotation)
+export const observableDeep = createObservableDecoratorAnnotation(observableAnnotation)
+export const observableStruct = createObservableDecoratorAnnotation(observableStructAnnotation)
+
 // eslint-disable-next-line
-export var observable: IObservableFactory = assign(createObservable, observableFactories)
+export var observable: IObservableFactory = assign(
+    createObservable,
+    observableAnnotation,
+    observableFactories
+)

package/src/api/observe.ts

@@ -11,7 +11,18 @@ import {
     getAdministration,
     ObservableSet,
     ISetDidChange,
-    isFunction
+    isFunction,
+    isComputedValue,
+    isObservableArray,
+    isObservableMap,
+    isObservableObject,
+    isObservableSet,
+    autorun,
+    registerListener,
+    untrackedEnd,
+    untrackedStart,
+    UPDATE,
+    die
 } from "../internal"
 
 export function observe<T>(
@@ -61,9 +72,77 @@ export function observe(thing, propOrCb?, cbOrFire?, fireImmediately?): Lambda {
 }
 
 function observeObservable(thing, listener, fireImmediately: boolean) {
-    return getAdministration(thing).observe_(listener, fireImmediately)
+    const adm = getAdministration(thing)
+
+    if (isObservableArray(thing)) {
+        if (fireImmediately) {
+            listener({
+                observableKind: "array",
+                object: adm.proxy_,
+                debugObjectName: adm.atom_.name_,
+                type: "splice",
+                index: 0,
+                added: adm.values_.slice(),
+                addedCount: adm.values_.length,
+                removed: [],
+                removedCount: 0
+            })
+        }
+    } else if (isObservableMap(thing)) {
+        if (__DEV__ && fireImmediately === true) {
+            die("`observe` doesn't support fireImmediately=true in combination with maps.")
+        }
+    } else if (isObservableSet(thing)) {
+        if (__DEV__ && fireImmediately === true) {
+            die("`observe` doesn't support fireImmediately=true in combination with sets.")
+        }
+    } else if (isObservableObject(thing)) {
+        if (__DEV__ && fireImmediately === true) {
+            die("`observe` doesn't support the fire immediately property for observable objects.")
+        }
+    } else {
+        return observeValue(adm, listener, fireImmediately)
+    }
+
+    return registerListener(adm, listener)
 }
 
 function observeObservableProperty(thing, property, listener, fireImmediately: boolean) {
-    return getAdministration(thing, property).observe_(listener, fireImmediately)
+    return observeValue(getAdministration(thing, property), listener, fireImmediately)
+}
+
+function observeValue(adm, listener, fireImmediately: boolean) {
+    if (isComputedValue(adm)) {
+        let firstTime = true
+        let prevValue: any = undefined
+        return autorun(() => {
+            const newValue = adm.get()
+            if (!firstTime || fireImmediately) {
+                const prevU = untrackedStart()
+                listener({
+                    observableKind: "computed",
+                    debugObjectName: adm.name_,
+                    type: UPDATE,
+                    object: adm,
+                    newValue,
+                    oldValue: prevValue
+                })
+                untrackedEnd(prevU)
+            }
+            firstTime = false
+            prevValue = newValue
+        })
+    }
+
+    if (fireImmediately) {
+        listener({
+            observableKind: "value",
+            debugObjectName: adm.name_,
+            object: adm,
+            type: UPDATE,
+            newValue: adm.value_,
+            oldValue: undefined
+        })
+    }
+    return registerListener(adm, listener)
 }

package/src/api/when.ts

@@ -7,7 +7,8 @@ import {
     getNextId,
     die,
     allowStateChanges,
-    GenericAbortSignal
+    GenericAbortSignal,
+    assign
 } from "../internal"
 
 export interface IWhenOptions {
@@ -77,12 +78,12 @@ function whenPromise(
         return die(`the options 'onError' and 'promise' cannot be combined`)
     }
     if (opts?.signal?.aborted) {
-        return Object.assign(Promise.reject(new Error("WHEN_ABORTED")), { cancel: () => null })
+        return assign(Promise.reject(new Error("WHEN_ABORTED")), { cancel: () => null })
     }
     let cancel
     let abort
     const res = new Promise((resolve, reject) => {
-        let disposer = _when(predicate, resolve as Lambda, { ...opts, onError: reject })
+        let disposer = _when(predicate, resolve as Lambda, assign({}, opts, { onError: reject }))
         cancel = () => {
             disposer()
             reject(new Error("WHEN_CANCELLED"))

package/src/core/action.ts

@@ -96,7 +96,7 @@ export function _startAction(
 ): IActionRunInfo {
     const notifySpy_ = __DEV__ && isSpyEnabled() && !!actionName
     let startTime_: number = 0
-    if (__DEV__ && notifySpy_) {
+    if (notifySpy_) {
         startTime_ = Date.now()
         const flattenedArgs = args ? Array.from(args) : EMPTY_ARRAY
         spyReportStart({
@@ -112,9 +112,14 @@ export function _startAction(
     let prevAllowStateChanges_ = globalState.allowStateChanges // by default preserve previous allow
     if (runAsAction) {
         untrackedStart()
-        prevAllowStateChanges_ = allowStateChangesStart(true)
+        if (__DEV__) {
+            prevAllowStateChanges_ = allowStateChangesStart(true)
+        }
+    }
+    const prevAllowStateReads_ = globalState.allowStateReads
+    if (__DEV__) {
+        allowStateReadsStart(true)
     }
-    const prevAllowStateReads_ = allowStateReadsStart(true)
     const runInfo = {
         runAsAction_: runAsAction,
         prevDerivation_,
@@ -138,8 +143,10 @@ export function _endAction(runInfo: IActionRunInfo) {
     if (runInfo.error_ !== undefined) {
         globalState.suppressReactionErrors = true
     }
-    allowStateChangesEnd(runInfo.prevAllowStateChanges_)
-    allowStateReadsEnd(runInfo.prevAllowStateReads_)
+    if (__DEV__) {
+        allowStateChangesEnd(runInfo.prevAllowStateChanges_)
+        allowStateReadsEnd(runInfo.prevAllowStateReads_)
+    }
     endBatch()
     if (runInfo.runAsAction_) {
         untrackedEnd(runInfo.prevDerivation_)