@legendapp/state 1.11.1 → 2.0.0-beta.0

package/index.js

@@ -54,25 +54,20 @@ let trackCount = 0;
 const trackingQueue = [];
 const tracking = {
     current: undefined,
-    inRender: false,
 };
-function beginTracking(inRender) {
+function beginTracking() {
     // Keep a copy of the previous tracking context so it can be restored
     // when this context is complete
     trackingQueue.push(tracking.current);
     trackCount++;
-    tracking.inRender = inRender;
     tracking.current = {};
 }
-function endTracking(fromRender) {
+function endTracking() {
     // Restore the previous tracking context
     trackCount--;
     if (trackCount < 0) {
         trackCount = 0;
     }
-    if (fromRender) {
-        tracking.inRender = false;
-    }
     tracking.current = trackingQueue.pop();
 }
 function updateTracking(node, track) {
@@ -99,22 +94,18 @@ const symbolGetNode = Symbol('getNode');
 const symbolDelete = /* @__PURE__ */ Symbol('delete');
 const symbolOpaque = Symbol('opaque');
 const optimized = Symbol('optimized');
-const extraPrimitiveActivators = new Map();
-const extraPrimitiveProps = new Map();
-const __devExtractFunctionsAndComputedsNodes = process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test' ? new Set() : undefined;
 const globalState = {
     isLoadingLocal: false,
     isLoadingRemote: false,
     isMerging: false,
-    noDepWarn: false,
 };
 function checkActivate(node) {
     var _a;
     const root = node.root;
     (_a = root.activate) === null || _a === void 0 ? void 0 : _a.call(root);
-    if (root.computedChildrenNeedingActivation) {
-        root.computedChildrenNeedingActivation.forEach(checkActivate);
-        delete root.computedChildrenNeedingActivation;
+    if (root.toActivate) {
+        root.toActivate.forEach(checkActivate);
+        delete root.toActivate;
     }
 }
 function getNode(obs) {
@@ -165,7 +156,7 @@ function setNodeValue(node, newValue) {
     if (parentNode.root.locked && parentNode.root.set) {
         parentNode.root.set(parentNode.root._);
     }
-    return { prevValue, newValue };
+    return { prevValue, newValue, parentValue };
 }
 const arrNodeKeys = [];
 function getNodeValue(node) {
@@ -239,37 +230,11 @@ function extractFunction(node, key, fnOrComputed, computedChildNode) {
     }
     node.functions.set(key, fnOrComputed);
     if (computedChildNode) {
-        computedChildNode.computedChildOfNode = getChildNode(node, key);
-        if (!node.root.computedChildrenNeedingActivation) {
-            node.root.computedChildrenNeedingActivation = [];
-        }
-        node.root.computedChildrenNeedingActivation.push(computedChildNode);
-    }
-}
-function extractFunctionsAndComputeds(obj, node) {
-    if ((process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') &&
-        typeof __devExtractFunctionsAndComputedsNodes !== 'undefined') {
-        if (__devExtractFunctionsAndComputedsNodes.has(obj)) {
-            console.error('[legend-state] Circular reference detected in object. You may want to use opaqueObject to stop traversing child nodes.', obj);
-            return false;
-        }
-        __devExtractFunctionsAndComputedsNodes.add(obj);
-    }
-    for (const k in obj) {
-        const v = obj[k];
-        if (typeof v === 'function') {
-            extractFunction(node, k, v);
-        }
-        else if (typeof v == 'object' && v !== null && v !== undefined) {
-            const childNode = getNode(v);
-            if (childNode === null || childNode === void 0 ? void 0 : childNode.isComputed) {
-                extractFunction(node, k, v, childNode);
-                delete obj[k];
-            }
-            else if (!v[symbolOpaque]) {
-                extractFunctionsAndComputeds(obj[k], getChildNode(node, k));
-            }
+        computedChildNode.parentOther = getChildNode(node, key);
+        if (!node.root.toActivate) {
+            node.root.toActivate = [];
         }
+        node.root.toActivate.push(computedChildNode);
     }
 }
 
@@ -278,6 +243,7 @@ let numInBatch = 0;
 let isRunningBatch = false;
 let didDelayEndBatch = false;
 let _afterBatch = [];
+let _queuedBatches = [];
 let _batchMap = new Map();
 function onActionTimeout() {
     if (_batchMap.size > 0) {
@@ -399,11 +365,7 @@ function batchNotifyChanges(changesInBatch, immediate) {
                 const listenerFn = arr[i];
                 const { track, noArgs, listener } = listenerFn;
                 if (!listenersNotified.has(listener)) {
-                    const ok = track === true || track === 'shallow'
-                        ? level <= 0
-                        : track === optimized
-                            ? whenOptimizedOnlyIf && level <= 0
-                            : true;
+                    const ok = track === true ? level <= 0 : track === optimized ? whenOptimizedOnlyIf && level <= 0 : true;
                     // Notify if listener is not shallow or if this is the first level
                     if (ok) {
                         // Create listenerParams if not already created
@@ -425,6 +387,8 @@ function batchNotifyChanges(changesInBatch, immediate) {
     });
 }
 function runBatch() {
+    // Save batch locally and reset _batchMap first because a new batch could begin while looping over callbacks.
+    // This can happen with observableComputed for example.
     const map = _batchMap;
     _batchMap = new Map();
     const changesInBatch = new Map();
@@ -439,7 +403,15 @@ function runBatch() {
 }
 function batch(fn, onComplete) {
     if (onComplete) {
-        _afterBatch.push(onComplete);
+        // If there's an onComplete we need a batch that's fully isolated from others to ensure it wraps only the given changes.
+        // So if already batching, push this batch onto a queue and run it after the current batch is fully done.
+        if (isRunningBatch) {
+            _queuedBatches.push([fn, onComplete]);
+            return;
+        }
+        else {
+            _afterBatch.push(onComplete);
+        }
     }
     beginBatch();
     try {
@@ -489,29 +461,21 @@ function endBatch(force) {
                 didDelayEndBatch = false;
                 endBatch(true);
             }
+            const queued = _queuedBatches;
+            if (queued.length) {
+                _queuedBatches = [];
+                for (let i = 0; i < queued.length; i++) {
+                    const [fn, onComplete] = queued[i];
+                    batch(fn, onComplete);
+                }
+            }
         }
     }
 }
-function afterBatch(fn) {
-    if (numInBatch > 0) {
-        _afterBatch.push(fn);
-    }
-    else {
-        fn();
-    }
-}
 
 function onChange(node, callback, options = {}) {
     const { initial, immediate, noArgs } = options;
-    let { trackingType } = options;
-    // Temporary migration of string to symbol
-    // TODOV2 remove this
-    if (trackingType === 'optimize') {
-        if (process.env.NODE_ENV === 'development' && !globalState.noDepWarn) {
-            console.warn('[legend-state]: "optimize" prop is deprecated and will be removed in version 2.0. Please import { optimize } from "@legendapp/state" and use that instead.');
-        }
-        trackingType = optimized;
-    }
+    const { trackingType } = options;
     let listeners = immediate ? node.listenersImmediate : node.listeners;
     if (!listeners) {
         listeners = new Set();
@@ -529,11 +493,6 @@ function onChange(node, callback, options = {}) {
         noArgs,
     };
     listeners.add(listener);
-    let parent = node.parent;
-    while (parent && !parent.descendantHasListener) {
-        parent.descendantHasListener = true;
-        parent = parent.parent;
-    }
     if (initial) {
         const value = getNodeValue(node);
         callback({
@@ -606,7 +565,11 @@ function collectionSetter(node, target, prop, ...args) {
     // Return the original value
     return ret;
 }
+function getKeys(obj, isArr, isMap) {
+    return isArr ? undefined : obj ? (isMap ? Array.from(obj.keys()) : Object.keys(obj)) : [];
+}
 function updateNodes(parent, obj, prevValue) {
+    var _a, _b;
     if ((process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') &&
         typeof __devUpdateNodes !== 'undefined' &&
         isObject(obj)) {
@@ -635,8 +598,10 @@ function updateNodes(parent, obj, prevValue) {
     let prevChildrenById;
     let moved;
     const isMap = obj instanceof Map;
-    const keys = obj ? (isMap ? Array.from(obj.keys()) : Object.keys(obj)) : [];
-    const keysPrev = prevValue ? (isMap ? Array.from(prevValue.keys()) : Object.keys(prevValue)) : [];
+    const keys = getKeys(obj, isArr, isMap);
+    const keysPrev = getKeys(prevValue, isArr, isMap);
+    const length = ((_a = (keys || obj)) === null || _a === void 0 ? void 0 : _a.length) || 0;
+    const lengthPrev = ((_b = (keysPrev || prevValue)) === null || _b === void 0 ? void 0 : _b.length) || 0;
     let idField;
     let isIdFieldFunction;
     let hasADiff = false;
@@ -699,79 +664,77 @@ function updateNodes(parent, obj, prevValue) {
         }
     }
     if (obj && !isPrimitive(obj)) {
-        const length = keys.length;
-        hasADiff = hasADiff || (keys === null || keys === void 0 ? void 0 : keys.length) !== (keysPrev === null || keysPrev === void 0 ? void 0 : keysPrev.length);
+        hasADiff = hasADiff || length !== lengthPrev;
         const isArrDiff = hasADiff;
         let didMove = false;
-        if (parent.descendantHasListener || !hasADiff) {
-            for (let i = 0; i < length; i++) {
-                const key = keys[i];
-                const value = isMap ? obj.get(key) : obj[key];
-                const prev = isMap ? prevValue === null || prevValue === void 0 ? void 0 : prevValue.get(key) : prevValue === null || prevValue === void 0 ? void 0 : prevValue[key];
-                let isDiff = value !== prev;
-                if (isDiff) {
-                    const id = idField && value
-                        ? isIdFieldFunction
-                            ? idField(value)
-                            : value[idField]
-                        : undefined;
-                    let child = getChildNode(parent, key);
-                    // Detect moves within an array. Need to move the original proxy to the new position to keep
-                    // the proxy stable, so that listeners to this node will be unaffected by the array shift.
-                    if (isArr && id !== undefined) {
-                        // Find the previous position of this element in the array
-                        const prevChild = id !== undefined ? prevChildrenById === null || prevChildrenById === void 0 ? void 0 : prevChildrenById.get(id) : undefined;
-                        if (!prevChild) {
-                            // This id was not in the array before so it does not need to notify children
-                            isDiff = false;
-                            hasADiff = true;
-                        }
-                        else if (prevChild !== undefined && prevChild.key !== key) {
-                            const valuePrevChild = prevValue[prevChild.key];
-                            // If array length changed then move the original node to the current position.
-                            // That should be faster than notifying every single element that
-                            // it's in a new position.
-                            if (isArrDiff) {
-                                child = prevChild;
-                                parent.children.delete(child.key);
-                                child.key = key;
-                                moved.push([key, child]);
-                            }
-                            didMove = true;
-                            // And check for diff against the previous value in the previous position
-                            isDiff = valuePrevChild !== value;
-                        }
+        for (let i = 0; i < length; i++) {
+            const key = isArr ? i + '' : keys[i];
+            const value = isMap ? obj.get(key) : obj[key];
+            const prev = isMap ? prevValue === null || prevValue === void 0 ? void 0 : prevValue.get(key) : prevValue === null || prevValue === void 0 ? void 0 : prevValue[key];
+            let isDiff = value !== prev;
+            if (isDiff) {
+                extractFunctionOrComputed(parent, obj, key, value);
+                const id = idField && value
+                    ? isIdFieldFunction
+                        ? idField(value)
+                        : value[idField]
+                    : undefined;
+                let child = getChildNode(parent, key);
+                // Detect moves within an array. Need to move the original proxy to the new position to keep
+                // the proxy stable, so that listeners to this node will be unaffected by the array shift.
+                if (isArr && id !== undefined) {
+                    // Find the previous position of this element in the array
+                    const prevChild = id !== undefined ? prevChildrenById === null || prevChildrenById === void 0 ? void 0 : prevChildrenById.get(id) : undefined;
+                    if (!prevChild) {
+                        // This id was not in the array before so it does not need to notify children
+                        isDiff = false;
+                        hasADiff = true;
                     }
-                    if (isDiff) {
-                        // Array has a new / modified element
-                        // If object iterate through its children
-                        if (isPrimitive(value)) {
-                            hasADiff = true;
-                        }
-                        else {
-                            // Always need to updateNodes so we notify through all children
-                            const updatedNodes = (!hasADiff || !!child.descendantHasListener) && updateNodes(child, value, prev);
-                            hasADiff = hasADiff || updatedNodes;
+                    else if (prevChild !== undefined && prevChild.key !== key) {
+                        const valuePrevChild = prevValue[prevChild.key];
+                        // If array length changed then move the original node to the current position.
+                        // That should be faster than notifying every single element that
+                        // it's in a new position.
+                        if (isArrDiff) {
+                            child = prevChild;
+                            parent.children.delete(child.key);
+                            child.key = key;
+                            moved.push([key, child]);
                         }
+                        didMove = true;
+                        // And check for diff against the previous value in the previous position
+                        isDiff = valuePrevChild !== value;
                     }
-                    if (isDiff || !isArrDiff) {
-                        // Notify for this child if this element is different and it has listeners
-                        // Or if the position changed in an array whose length did not change
-                        // But do not notify child if the parent is an array with changing length -
-                        // the array's listener will cover it
-                        if (child.listeners || child.listenersImmediate) {
-                            notify(child, value, prev, 0, !isArrDiff);
-                        }
+                }
+                if (isDiff) {
+                    // Array has a new / modified element
+                    // If object iterate through its children
+                    if (isPrimitive(value)) {
+                        hasADiff = true;
+                    }
+                    else {
+                        // Always need to updateNodes so we notify through all children
+                        const updatedNodes = updateNodes(child, value, prev);
+                        hasADiff = hasADiff || updatedNodes;
                     }
                 }
-            }
-            if (moved) {
-                for (let i = 0; i < moved.length; i++) {
-                    const [key, child] = moved[i];
-                    parent.children.set(key, child);
+                if (isDiff || !isArrDiff) {
+                    // Notify for this child if this element is different and it has listeners
+                    // Or if the position changed in an array whose length did not change
+                    // But do not notify child if the parent is an array with changing length -
+                    // the array's listener will cover it
+                    if (child.listeners || child.listenersImmediate) {
+                        notify(child, value, prev, 0, !isArrDiff);
+                    }
                 }
             }
         }
+        if (moved) {
+            for (let i = 0; i < moved.length; i++) {
+                const [key, child] = moved[i];
+                parent.children.set(key, child);
+            }
+        }
         // The full array does not need to re-render if the length is the same
         // So don't notify shallow listeners
         retValue = hasADiff || didMove;
@@ -849,18 +812,6 @@ const proxyHandler = {
         if (property) {
             return property.get(node);
         }
-        const isValuePrimitive = isPrimitive(value);
-        // If accessing a key that doesn't already exist, and this node has been activated with extra keys
-        // then return the values that were set. This is used by enableLegendStateReact for example.
-        if (value === undefined || value === null || isValuePrimitive) {
-            if (extraPrimitiveProps.size && (node.isActivatedPrimitive || extraPrimitiveActivators.has(p))) {
-                node.isActivatedPrimitive = true;
-                const vPrim = extraPrimitiveProps.get(p);
-                if (vPrim !== undefined) {
-                    return isFunction(vPrim) ? vPrim(getProxy(node)) : vPrim;
-                }
-            }
-        }
         const vProp = value === null || value === void 0 ? void 0 : value[p];
         if (isObject(value) && value[symbolOpaque]) {
             return vProp;
@@ -984,10 +935,7 @@ const proxyHandler = {
     },
 };
 function set(node, newValue) {
-    if (isPromise(newValue)) {
-        newValue.then((v) => set(node, v)).catch((error) => set(node, { error }));
-    }
-    else if (node.parent) {
+    if (node.parent) {
         return setKey(node.parent, node.key, newValue);
     }
     else {
@@ -1027,12 +975,13 @@ function setKey(node, key, newValue, level) {
     // Get the child node for updating and notifying
     const childNode = isRoot ? node : getChildNode(node, key);
     // Set the raw value on the parent object
-    const { newValue: savedValue, prevValue } = setNodeValue(childNode, newValue);
-    const isFunc = isFunction(newValue);
+    const { newValue: savedValue, prevValue, parentValue } = setNodeValue(childNode, newValue);
+    const isFunc = isFunction(savedValue);
     const isPrim = isPrimitive(savedValue) || savedValue instanceof Date;
     if (savedValue !== prevValue) {
         updateNodesAndNotify(node, savedValue, prevValue, childNode, isPrim, isRoot, level);
     }
+    extractFunctionOrComputed(node, parentValue, key, savedValue);
     return isFunc ? savedValue : isRoot ? getProxy(node) : getProxy(node, key);
 }
 function assign(node, value) {
@@ -1159,6 +1108,51 @@ function updateNodesAndNotify(node, newValue, prevValue, childNode, isPrim, isRo
     }
     endBatch();
 }
+function extractPromise(node, value) {
+    value.status = 'pending';
+    value
+        .then((value) => {
+        set(node, value);
+    })
+        .catch((error) => {
+        set(node, { error, status: 'rejected' });
+    });
+}
+const __devExtractFunctionsAndComputedsNodes = process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test' ? new Set() : undefined;
+function extractFunctionOrComputed(node, obj, k, v) {
+    if (isPromise(v)) {
+        extractPromise(getChildNode(node, k), v);
+    }
+    else if (typeof v === 'function') {
+        extractFunction(node, k, v);
+    }
+    else if (typeof v == 'object' && v !== null && v !== undefined) {
+        const childNode = getNode(v);
+        if (childNode === null || childNode === void 0 ? void 0 : childNode.isComputed) {
+            extractFunction(node, k, v, childNode);
+            delete obj[k];
+        }
+        else {
+            return true;
+        }
+    }
+}
+function extractFunctionsAndComputeds(node, obj) {
+    if ((process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') &&
+        typeof __devExtractFunctionsAndComputedsNodes !== 'undefined') {
+        if (__devExtractFunctionsAndComputedsNodes.has(obj)) {
+            console.error('[legend-state] Circular reference detected in object. You may want to use opaqueObject to stop traversing child nodes.', obj);
+            return false;
+        }
+        __devExtractFunctionsAndComputedsNodes.add(obj);
+    }
+    for (const k in obj) {
+        const v = obj[k];
+        if (v && extractFunctionOrComputed(node, obj, k, v) && !v[symbolOpaque]) {
+            extractFunctionsAndComputeds(getChildNode(node, k), v);
+        }
+    }
+}
 
 function isObservable(obs) {
     return obs && !!obs[symbolGetNode];
@@ -1249,53 +1243,50 @@ function setInObservableAtPath(obs, path, value, mode) {
 function mergeIntoObservable(target, ...sources) {
     beginBatch();
     globalState.isMerging = true;
-    const value = _mergeIntoObservable(target, ...sources);
+    for (let i = 0; i < sources.length; i++) {
+        target = _mergeIntoObservable(target, sources[i]);
+    }
     globalState.isMerging = false;
     endBatch();
-    return value;
+    return target;
 }
-function _mergeIntoObservable(target, ...sources) {
+function _mergeIntoObservable(target, source) {
     var _a;
-    if (!sources.length)
-        return target;
-    for (let u = 0; u < sources.length; u++) {
-        const source = sources[u];
-        const needsSet = isObservable(target);
-        const targetValue = needsSet ? target.peek() : target;
-        const isTargetArr = isArray(targetValue);
-        const isTargetObj = !isTargetArr && isObject(targetValue);
-        if ((isTargetObj && isObject(source) && !isEmpty(targetValue)) ||
-            (isTargetArr && isArray(source) && targetValue.length > 0)) {
-            for (const key in source) {
-                const sourceValue = source[key];
-                if (sourceValue === symbolDelete) {
-                    needsSet && ((_a = target[key]) === null || _a === void 0 ? void 0 : _a.delete)
-                        ? target[key].delete()
-                        : delete target[key];
-                }
-                else {
-                    const isObj = isObject(sourceValue);
-                    const isArr = !isObj && isArray(sourceValue);
-                    const targetChild = target[key];
-                    if ((isObj || isArr) && targetChild && (needsSet || !isEmpty(targetChild))) {
-                        if (!needsSet && (!targetChild || (isObj ? !isObject(targetChild) : !isArray(targetChild)))) {
-                            target[key] = sourceValue;
-                        }
-                        else {
-                            _mergeIntoObservable(targetChild, sourceValue);
-                        }
+    const needsSet = isObservable(target);
+    const targetValue = needsSet ? target.peek() : target;
+    const isTargetArr = isArray(targetValue);
+    const isTargetObj = !isTargetArr && isObject(targetValue);
+    if ((isTargetObj && isObject(source) && !isEmpty(targetValue)) ||
+        (isTargetArr && isArray(source) && targetValue.length > 0)) {
+        const keys = Object.keys(source);
+        for (let i = 0; i < keys.length; i++) {
+            const key = keys[i];
+            const sourceValue = source[key];
+            if (sourceValue === symbolDelete) {
+                needsSet && ((_a = target[key]) === null || _a === void 0 ? void 0 : _a.delete) ? target[key].delete() : delete target[key];
+            }
+            else {
+                const isObj = isObject(sourceValue);
+                const isArr = !isObj && isArray(sourceValue);
+                const targetChild = target[key];
+                if ((isObj || isArr) && targetChild && (needsSet || !isEmpty(targetChild))) {
+                    if (!needsSet && (!targetChild || (isObj ? !isObject(targetChild) : !isArray(targetChild)))) {
+                        target[key] = sourceValue;
                     }
                     else {
-                        needsSet
-                            ? targetChild.set(sourceValue)
-                            : (target[key] = sourceValue);
+                        _mergeIntoObservable(targetChild, sourceValue);
                     }
                 }
+                else {
+                    needsSet
+                        ? targetChild.set(sourceValue)
+                        : (target[key] = sourceValue);
+                }
             }
         }
-        else if (source !== undefined) {
-            needsSet ? target.set(source) : (target = source);
-        }
+    }
+    else if (source !== undefined) {
+        needsSet ? target.set(source) : (target = source);
     }
     return target;
 }
@@ -1374,7 +1365,7 @@ ObservablePrimitiveClass.prototype.delete = function () {
 function createObservable(value, makePrimitive) {
     const valueIsPromise = isPromise(value);
     const root = {
-        _: valueIsPromise ? undefined : value,
+        _: value,
     };
     const node = {
         root,
@@ -1384,19 +1375,14 @@ function createObservable(value, makePrimitive) {
         ? new ObservablePrimitiveClass(node)
         : getProxy(node);
     if (valueIsPromise) {
-        value.catch((error) => {
-            obs.set({ error });
-        });
-        value.then((value) => {
-            obs.set(value);
-        });
+        extractPromise(node, value);
     }
     else if (!prim) {
         if (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {
             __devExtractFunctionsAndComputedsNodes.clear();
         }
         if (value) {
-            extractFunctionsAndComputeds(value, node);
+            extractFunctionsAndComputeds(node, value);
         }
     }
     return obs;
@@ -1425,7 +1411,7 @@ function setupTracking(nodes, update, noArgs, immediate) {
     };
 }
 
-function trackSelector(selector, update, observeEvent, observeOptions, createResubscribe, inRender) {
+function trackSelector(selector, update, observeEvent, observeOptions, createResubscribe) {
     var _a;
     let nodes;
     let value;
@@ -1441,11 +1427,11 @@ function trackSelector(selector, update, observeEvent, observeOptions, createRes
     }
     else {
         // Compute the selector inside a tracking context
-        beginTracking(inRender);
+        beginTracking();
         value = selector ? computeSelector(selector, observeEvent, observeOptions === null || observeOptions === void 0 ? void 0 : observeOptions.retainObservable) : selector;
         tracker = tracking.current;
         nodes = tracker.nodes;
-        endTracking(inRender);
+        endTracking();
         if ((process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') && tracker && nodes) {
             (_a = tracker.traceListeners) === null || _a === void 0 ? void 0 : _a.call(tracker, nodes);
             if (tracker.traceUpdates) {
@@ -1496,6 +1482,7 @@ function observe(selectorOrRun, reactionOrOptions, options) {
             e.onCleanupReaction();
             e.onCleanupReaction = undefined;
         }
+        endBatch();
         // Call the reaction if there is one and the value changed
         if (reaction && (e.num > 0 || !isEvent(selectorOrRun)) && e.previous !== e.value) {
             reaction(e);
@@ -1504,7 +1491,6 @@ function observe(selectorOrRun, reactionOrOptions, options) {
         e.previous = e.value;
         // Increment the counter
         e.num++;
-        endBatch();
     };
     update();
     // Return function calling dispose because dispose may be changed in update()
@@ -1533,7 +1519,7 @@ function computed(compute, set$1) {
             prevNode.linkedFromNodes.delete(node);
             node.linkedToNode = undefined;
         }
-        const childNode = node.computedChildOfNode;
+        const { parentOther } = node;
         if (isObservable(val)) {
             // If the computed is a proxy to another observable
             // link it to the target observable
@@ -1543,9 +1529,9 @@ function computed(compute, set$1) {
                 linkedNode.linkedFromNodes = new Set();
             }
             linkedNode.linkedFromNodes.add(node);
-            if (node.computedChildOfNode) {
+            if (node.parentOther) {
                 onChange(linkedNode, ({ value }) => {
-                    setNodeValue(node.computedChildOfNode, value);
+                    setNodeValue(node.parentOther, value);
                 }, { initial: true });
             }
             // If the target observable is different then notify for the change
@@ -1562,22 +1548,22 @@ function computed(compute, set$1) {
             // Update the computed value
             setter(node, val);
             // If the computed is a child of an observable set the value on it
-            if (childNode) {
+            if (parentOther) {
                 let didUnlock = false;
-                if (childNode.root.locked) {
-                    childNode.root.locked = false;
+                if (parentOther.root.locked) {
+                    parentOther.root.locked = false;
                     didUnlock = true;
                 }
-                setter(childNode, val);
+                setter(parentOther, val);
                 if (didUnlock) {
-                    childNode.root.locked = true;
+                    parentOther.root.locked = true;
                 }
             }
             // Re-lock the computed node
             lockObservable(obs, true);
         }
-        else if (childNode) {
-            setNodeValue(childNode, val);
+        else if (parentOther) {
+            setNodeValue(parentOther, val);
         }
         isSetAfterActivated = true;
     };
@@ -1665,11 +1651,11 @@ function proxy(get, set) {
             target = computed(() => get(key), (set ? (value) => set(key, value) : undefined));
             mapTargets.set(key, target);
             extractFunction(node, key, target, getNode(target));
-            if (node.computedChildOfNode) {
+            if (node.parentOther) {
                 onChange(getNode(target), ({ value, getPrevious }) => {
                     const previous = getPrevious();
                     // Set the raw value on the proxy's parent
-                    setNodeValue(node.computedChildOfNode, node.root._);
+                    setNodeValue(node.parentOther, node.root._);
                     // Notify the proxy
                     notify(getChildNode(node, key), value, previous, 0);
                 });
@@ -1681,23 +1667,33 @@ function proxy(get, set) {
 }
 
 function _when(predicate, effect, checkReady) {
+    // If predicate is a regular Promise skip all the observable stuff
+    if (isPromise(predicate)) {
+        return effect ? predicate.then(effect) : predicate;
+    }
     let value;
     // Create a wrapping fn that calls the effect if predicate returns true
     function run(e) {
         const ret = computeSelector(predicate);
-        if (checkReady ? isObservableValueReady(ret) : ret) {
+        if (!isPromise(ret) && (checkReady ? isObservableValueReady(ret) : ret)) {
             value = ret;
-            // If value is truthy then run the effect
-            effect === null || effect === void 0 ? void 0 : effect(ret);
-            // Set cancel so that observe does not track
+            // Set cancel so that observe does not track anymore
             e.cancel = true;
         }
+        return value;
+    }
+    function doEffect() {
+        // If value is truthy then run the effect
+        effect === null || effect === void 0 ? void 0 : effect(value);
     }
     // Run in an observe
-    observe(run);
+    observe(run, doEffect);
     // If first run resulted in a truthy value just return it.
     // It will have set e.cancel so no need to dispose
-    if (value !== undefined) {
+    if (isPromise(value)) {
+        return effect ? value.then(effect) : value;
+    }
+    else if (value !== undefined) {
         return Promise.resolve(value);
     }
     else {
@@ -1740,7 +1736,6 @@ const internal = {
 };
 
 exports.ObservablePrimitiveClass = ObservablePrimitiveClass;
-exports.afterBatch = afterBatch;
 exports.batch = batch;
 exports.beginBatch = beginBatch;
 exports.beginTracking = beginTracking;
@@ -1753,12 +1748,11 @@ exports.deconstructObjectWithPath = deconstructObjectWithPath;
 exports.endBatch = endBatch;
 exports.endTracking = endTracking;
 exports.event = event;
-exports.extraPrimitiveActivators = extraPrimitiveActivators;
-exports.extraPrimitiveProps = extraPrimitiveProps;
 exports.findIDKey = findIDKey;
 exports.getNode = getNode;
 exports.getNodeValue = getNodeValue;
 exports.getObservableIndex = getObservableIndex;
+exports.hasOwnProperty = hasOwnProperty;
 exports.internal = internal;
 exports.isArray = isArray;
 exports.isBoolean = isBoolean;