@legendapp/state 2.2.0-next.4 → 2.2.0-next.41

package/index.js

@@ -8,14 +8,17 @@ function isString(obj) {
     return typeof obj === 'string';
 }
 function isObject(obj) {
-    return !!obj && typeof obj === 'object' && !isArray(obj);
+    return !!obj && typeof obj === 'object' && !(obj instanceof Date) && !isArray(obj);
 }
 function isFunction(obj) {
     return typeof obj === 'function';
 }
 function isPrimitive(arg) {
     const type = typeof arg;
-    return arg !== undefined && type !== 'object' && type !== 'function';
+    return arg !== undefined && (isDate(arg) || (type !== 'object' && type !== 'function'));
+}
+function isDate(obj) {
+    return obj instanceof Date;
 }
 function isSymbol(obj) {
     return typeof obj === 'symbol';
@@ -40,6 +43,9 @@ function isEmpty(obj) {
     }
     return true;
 }
+function isNullOrUndefined(value) {
+    return value === undefined || value === null;
+}
 const setPrimitives = new Set(['boolean', 'string', 'number']);
 /** @internal */
 function isActualPrimitive(arg) {
@@ -55,6 +61,7 @@ const symbolGetNode = Symbol('getNode');
 const symbolDelete = /* @__PURE__ */ Symbol('delete');
 const symbolOpaque = Symbol('opaque');
 const optimized = Symbol('optimized');
+const symbolActivated = Symbol('activated');
 // TODOV3 Remove these
 const extraPrimitiveActivators = new Map();
 const extraPrimitiveProps = new Map();
@@ -63,28 +70,17 @@ const globalState = {
     isMerging: false,
     isLoadingRemote$: undefined,
     activateNode: undefined,
+    pendingNodes: new Map(),
+    dirtyNodes: new Set(),
 };
 function isObservable(obs) {
     return !!obs && !!obs[symbolGetNode];
 }
-function isComputed(obs) {
-    var _a;
-    return obs && ((_a = obs[symbolGetNode]) === null || _a === void 0 ? void 0 : _a.isComputed);
-}
-function checkActivate(node) {
-    var _a;
-    const root = node.root;
-    (_a = root.activate) === null || _a === void 0 ? void 0 : _a.call(root);
-    if (root.toActivate) {
-        root.toActivate.forEach(checkActivate);
-        delete root.toActivate;
-    }
-}
 function getNode(obs) {
     return obs && obs[symbolGetNode];
 }
 function setNodeValue(node, newValue) {
-    var _a;
+    var _a, _b, _c;
     const parentNode = (_a = node.parent) !== null && _a !== void 0 ? _a : node;
     const key = node.parent ? node.key : '_';
     const isDelete = newValue === symbolDelete;
@@ -99,27 +95,30 @@ function setNodeValue(node, newValue) {
     // Compute newValue if newValue is a function or an observable
     newValue = !parentNode.isAssigning && isFunc ? newValue(prevValue) : newValue;
     // If setting an observable, set a link to the observable instead
-    if (isObservable(newValue) && !isComputed(newValue)) {
+    if (isObservable(newValue)) {
         const val = newValue;
-        node.lazy = () => val;
+        node.lazy = true;
+        node.lazyFn = () => val;
         newValue = undefined;
     }
-    try {
-        parentNode.isSetting = (parentNode.isSetting || 0) + 1;
-        // Save the new value
-        if (isDelete) {
-            delete parentValue[key];
+    if (!globalState.isMerging ||
+        prevValue === undefined ||
+        isFunction(prevValue) ||
+        !((_c = (_b = node.parent) === null || _b === void 0 ? void 0 : _b.functions) === null || _c === void 0 ? void 0 : _c.get(key))) {
+        try {
+            parentNode.isSetting = (parentNode.isSetting || 0) + 1;
+            // Save the new value
+            if (isDelete) {
+                delete parentValue[key];
+            }
+            else {
+                parentValue[key] = newValue;
+            }
         }
-        else {
-            parentValue[key] = newValue;
+        finally {
+            parentNode.isSetting--;
         }
     }
-    finally {
-        parentNode.isSetting--;
-    }
-    if (parentNode.root.locked && parentNode.root.set) {
-        parentNode.root.set(parentNode.root._);
-    }
     return { prevValue, newValue, parentValue };
 }
 const arrNodeKeys = [];
@@ -137,12 +136,6 @@ function getNodeValue(node) {
     }
     return child;
 }
-const cloneFunction = (originalFunction) => {
-    const length = originalFunction.length;
-    return length > 1
-        ? (arg1, arg2) => originalFunction(arg1, arg2)
-        : (...args) => originalFunction(...args);
-};
 function getChildNode(node, key, asFunction) {
     var _a;
     // Get the child by key
@@ -155,11 +148,15 @@ function getChildNode(node, key, asFunction) {
             key,
             lazy: true,
         };
-        if (asFunction) {
-            child = Object.assign(cloneFunction(asFunction), child);
+        if (node.activationState) {
+            const { lookup } = node.activationState;
+            if (lookup) {
+                asFunction = lookup.bind(node, key);
+            }
         }
-        else if (node.proxyFn2) {
-            child = Object.assign(node.proxyFn2.bind(node, key), child);
+        if (asFunction) {
+            child = Object.assign(() => { }, child);
+            child.lazyFn = asFunction;
         }
         if (!node.children) {
             node.children = new Map();
@@ -183,17 +180,19 @@ function ensureNodeValue(node) {
 }
 function findIDKey(obj, node) {
     var _a, _b;
-    let idKey = isObject(obj)
-        ? 'id' in obj
-            ? 'id'
-            : 'key' in obj
-                ? 'key'
-                : '_id' in obj
-                    ? '_id'
-                    : '__id' in obj
-                        ? '__id'
-                        : undefined
-        : undefined;
+    let idKey = isObservable(obj)
+        ? undefined
+        : isObject(obj)
+            ? 'id' in obj
+                ? 'id'
+                : 'key' in obj
+                    ? 'key'
+                    : '_id' in obj
+                        ? '_id'
+                        : '__id' in obj
+                            ? '__id'
+                            : undefined
+            : undefined;
     if (!idKey && node.parent) {
         const k = node.key + '_keyExtractor';
         const keyExtractor = (_b = (_a = node.functions) === null || _a === void 0 ? void 0 : _a.get(k)) !== null && _b !== void 0 ? _b : getNodeValue(node.parent)[node.key + '_keyExtractor'];
@@ -203,18 +202,17 @@ function findIDKey(obj, node) {
     }
     return idKey;
 }
-function extractFunction(node, key, fnOrComputed, computedChildNode) {
+function extractFunction(node, key, fnOrComputed) {
     if (!node.functions) {
         node.functions = new Map();
     }
     node.functions.set(key, fnOrComputed);
-    if (computedChildNode) {
-        computedChildNode.parentOther = getChildNode(node, key);
-        if (!node.root.toActivate) {
-            node.root.toActivate = [];
-        }
-        node.root.toActivate.push(computedChildNode);
-    }
+}
+
+function activated(params) {
+    return (() => ({
+        [symbolActivated]: params,
+    }));
 }
 
 let timeout;
@@ -241,23 +239,28 @@ function isArraySubset(mainArr, subsetArr) {
     return true;
 }
 function createPreviousHandlerInner(value, changes) {
-    // Clones the current state and inject the previous data at the changed path
-    let clone = value ? JSON.parse(JSON.stringify(value)) : {};
-    for (let i = 0; i < changes.length; i++) {
-        const { path, prevAtPath } = changes[i];
-        let o = clone;
-        if (path.length > 0) {
-            let i;
-            for (i = 0; i < path.length - 1; i++) {
-                o = o[path[i]];
+    try {
+        // Clones the current state and inject the previous data at the changed path
+        let clone = value ? JSON.parse(JSON.stringify(value)) : {};
+        for (let i = 0; i < changes.length; i++) {
+            const { path, prevAtPath } = changes[i];
+            let o = clone;
+            if (path.length > 0) {
+                let i;
+                for (i = 0; i < path.length - 1; i++) {
+                    o = o[path[i]];
+                }
+                o[path[i]] = prevAtPath;
+            }
+            else {
+                clone = prevAtPath;
             }
-            o[path[i]] = prevAtPath;
-        }
-        else {
-            clone = prevAtPath;
         }
+        return clone;
+    }
+    catch (_a) {
+        return undefined;
     }
-    return clone;
 }
 function createPreviousHandler(value, changes) {
     // Create a function that generates the previous state
@@ -366,8 +369,15 @@ function batchNotifyChanges(changesInBatch, immediate) {
     });
 }
 function runBatch() {
+    const dirtyNodes = Array.from(globalState.dirtyNodes);
+    globalState.dirtyNodes.clear();
+    dirtyNodes.forEach((node) => {
+        var _a;
+        (_a = node.dirtyFn) === null || _a === void 0 ? void 0 : _a.call(node);
+        node.dirtyFn = undefined;
+    });
     // Save batch locally and reset _batchMap first because a new batch could begin while looping over callbacks.
-    // This can happen with observableComputed for example.
+    // This can happen with computeds for example.
     const map = _batchMap;
     _batchMap = new Map();
     const changesInBatch = new Map();
@@ -421,7 +431,7 @@ function endBatch(force) {
             }
             numInBatch = 0;
             // Save batch locally and reset _batch first because a new batch could begin while looping over callbacks.
-            // This can happen with observableComputed for example.
+            // This can happen with computeds for example.
             const after = _afterBatch;
             if (after.length) {
                 _afterBatch = [];
@@ -463,7 +473,8 @@ function createObservable(value, makePrimitive, extractPromise, createObject, cr
         lazy: true,
     };
     if (valueIsFunction) {
-        node = Object.assign(cloneFunction(value), node);
+        node = Object.assign(() => { }, node);
+        node.lazyFn = value;
     }
     const prim = makePrimitive || isActualPrimitive(value);
     const obs = prim
@@ -482,7 +493,7 @@ function isEvent(obs) {
 }
 function computeSelector(selector, e, retainObservable) {
     let c = selector;
-    if (isFunction(c)) {
+    if (!isObservable(c) && isFunction(c)) {
         c = e ? c(e) : c();
     }
     return isObservable(c) && !retainObservable ? c.get() : c;
@@ -498,13 +509,6 @@ function opaqueObject(value) {
     }
     return value;
 }
-function lockObservable(obs, value) {
-    var _a;
-    const root = (_a = getNode(obs)) === null || _a === void 0 ? void 0 : _a.root;
-    if (root) {
-        root.locked = value;
-    }
-}
 function setAtPath(obj, path, pathTypes, value, fullObj, restore) {
     let o = obj;
     let oFull = fullObj;
@@ -581,14 +585,15 @@ function _mergeIntoObservable(target, source) {
     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)) {
+    if ((isTargetObj && isObject(source) && !isEmpty(targetValue)) || (isTargetArr && 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];
+                needsSet && ((_a = target[key]) === null || _a === void 0 ? void 0 : _a.delete)
+                    ? target[key].delete()
+                    : delete target[key];
             }
             else {
                 const isObj = isObject(sourceValue);
@@ -659,7 +664,6 @@ function onChange(node, callback, options = {}) {
             node.listeners = listeners;
         }
     }
-    checkActivate(node);
     const listener = {
         listener: callback,
         track: trackingType,
@@ -681,7 +685,14 @@ function onChange(node, callback, options = {}) {
             getPrevious: () => undefined,
         });
     }
-    return () => listeners.delete(listener);
+    let extraDispose;
+    if (node.linkedToNode) {
+        extraDispose = onChange(node.linkedToNode, callback, options);
+    }
+    return () => {
+        listeners.delete(listener);
+        extraDispose === null || extraDispose === void 0 ? void 0 : extraDispose();
+    };
 }
 
 function setupTracking(nodes, update, noArgs, immediate) {
@@ -777,7 +788,7 @@ function trackSelector(selector, update, observeEvent, observeOptions, createRes
         dispose = setupTracking(nodes, updateFn, false, observeOptions === null || observeOptions === void 0 ? void 0 : observeOptions.immediate);
         resubscribe = createResubscribe ? () => setupTracking(nodes, updateFn) : undefined;
     }
-    return { value, dispose, resubscribe };
+    return { value, nodes, dispose, resubscribe };
 }
 
 function observe(selectorOrRun, reactionOrOptions, options) {
@@ -802,9 +813,11 @@ function observe(selectorOrRun, reactionOrOptions, options) {
         delete e.value;
         // Dispose listeners from previous run
         dispose === null || dispose === void 0 ? void 0 : dispose();
-        const { dispose: _dispose, value } = trackSelector(selectorOrRun, update, e, options);
+        const { dispose: _dispose, value, nodes } = trackSelector(selectorOrRun, update, e, options);
         dispose = _dispose;
         e.value = value;
+        e.nodes = nodes;
+        e.refresh = update;
         if (e.onCleanupReaction) {
             e.onCleanupReaction();
             e.onCleanupReaction = undefined;
@@ -812,7 +825,9 @@ function observe(selectorOrRun, reactionOrOptions, options) {
         endBatch();
         // Call the reaction if there is one and the value changed
         if (reaction &&
-            ((options === null || options === void 0 ? void 0 : options.fromComputed) || ((e.num > 0 || !isEvent(selectorOrRun)) && e.previous !== e.value))) {
+            ((options === null || options === void 0 ? void 0 : options.fromComputed) ||
+                ((e.num > 0 || !isEvent(selectorOrRun)) &&
+                    (e.previous !== e.value || typeof e.value === 'object')))) {
             reaction(e);
         }
         // Update the previous value
@@ -832,6 +847,120 @@ function observe(selectorOrRun, reactionOrOptions, options) {
     };
 }
 
+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;
+    let effectValue;
+    // Create a wrapping fn that calls the effect if predicate returns true
+    function run(e) {
+        const ret = computeSelector(predicate);
+        if (!isPromise(ret) && (checkReady ? isObservableValueReady(ret) : ret)) {
+            value = ret;
+            // Set cancel so that observe does not track anymore
+            e.cancel = true;
+        }
+        return value;
+    }
+    function doEffect() {
+        // If value is truthy then run the effect
+        effectValue = effect === null || effect === void 0 ? void 0 : effect(value);
+    }
+    // Run in an observe
+    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 (isPromise(value)) {
+        return effect ? value.then(effect) : value;
+    }
+    else if (value !== undefined) {
+        return effect ? effectValue : Promise.resolve(value);
+    }
+    else {
+        // Wrap it in a promise
+        const promise = new Promise((resolve) => {
+            if (effect) {
+                const originalEffect = effect;
+                effect = ((value) => {
+                    const effectValue = originalEffect(value);
+                    resolve(isPromise(effectValue) ? effectValue.then((value) => value) : effectValue);
+                });
+            }
+            else {
+                effect = resolve;
+            }
+        });
+        return promise;
+    }
+}
+function when(predicate, effect) {
+    return _when(predicate, effect, false);
+}
+function whenReady(predicate, effect) {
+    return _when(predicate, effect, true);
+}
+
+function calculateRetryDelay(retryOptions, attemptNum) {
+    const { backoff, delay = 1000, infinite, times = 3, maxDelay = 30000 } = retryOptions;
+    if (infinite || attemptNum < times) {
+        const delayTime = Math.min(delay * (backoff === 'constant' ? 1 : 2 ** attemptNum), maxDelay);
+        return delayTime;
+    }
+    return null;
+}
+function createRetryTimeout(retryOptions, attemptNum, fn) {
+    const delayTime = calculateRetryDelay(retryOptions, attemptNum);
+    if (delayTime) {
+        return setTimeout(fn, delayTime);
+    }
+}
+function runWithRetry(node, state, fn) {
+    const { retry, waitFor } = node.activationState;
+    const e = { cancel: false };
+    let value = undefined;
+    if (waitFor) {
+        value = whenReady(waitFor, () => {
+            node.activationState.waitFor = undefined;
+            return fn(e);
+        });
+    }
+    else {
+        value = fn(e);
+    }
+    if (isPromise(value) && retry) {
+        let timeoutRetry;
+        return new Promise((resolve) => {
+            const run = () => {
+                value
+                    .then((val) => {
+                    node.activationState.persistedRetry = false;
+                    resolve(val);
+                })
+                    .catch(() => {
+                    state.attemptNum++;
+                    if (timeoutRetry) {
+                        clearTimeout(timeoutRetry);
+                    }
+                    if (!e.cancel) {
+                        timeoutRetry = createRetryTimeout(retry, state.attemptNum, () => {
+                            value = fn(e);
+                            run();
+                        });
+                    }
+                })
+                    .finally(() => {
+                    node.activationState.persistedRetry = false;
+                });
+            };
+            run();
+        });
+    }
+    return value;
+}
+
+const noop = () => { };
 const ArrayModifiers = new Set([
     'copyWithin',
     'fill',
@@ -872,7 +1001,8 @@ if (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {
 }
 function collectionSetter(node, target, prop, ...args) {
     var _a;
-    if (prop === 'push') {
+    if (prop === 'push' && args.length === 1) {
+        // Fast path for push to just append to the end
         setKey(node, target.length + '', args[0]);
     }
     else {
@@ -924,8 +1054,9 @@ function updateNodes(parent, obj, prevValue) {
     let prevChildrenById;
     let moved;
     const isMap = obj instanceof Map;
+    const isPrevMap = prevValue instanceof Map;
     const keys = getKeys(obj, isArr, isMap);
-    const keysPrev = getKeys(prevValue, isArr, isMap);
+    const keysPrev = getKeys(prevValue, isArr, isPrevMap);
     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;
@@ -977,7 +1108,7 @@ function updateNodes(parent, obj, prevValue) {
             if (!keys.includes(key)) {
                 hasADiff = true;
                 const child = getChildNode(parent, key);
-                const prev = isMap ? prevValue.get(key) : prevValue[key];
+                const prev = isPrevMap ? prevValue.get(key) : prevValue[key];
                 if (prev !== undefined) {
                     if (!isPrimitive(prev)) {
                         updateNodes(child, undefined, prev);
@@ -995,16 +1126,24 @@ function updateNodes(parent, obj, prevValue) {
         let didMove = false;
         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;
+            let value = isMap ? obj.get(key) : obj[key];
+            const prev = isPrevMap ? prevValue === null || prevValue === void 0 ? void 0 : prevValue.get(key) : prevValue === null || prevValue === void 0 ? void 0 : prevValue[key];
+            let isDiff = isDate(value) ? +value !== +prev : value !== prev;
             if (isDiff) {
                 const id = idField && value
                     ? isIdFieldFunction
                         ? idField(value)
                         : value[idField]
                     : undefined;
-                let child = getChildNode(parent, key);
+                if (isObservable(value)) {
+                    const obs = value;
+                    value = () => obs;
+                }
+                let child = getChildNode(parent, key, isFunction(value) ? value : undefined);
+                if (!child.lazy && (isFunction(value) || isObservable(value))) {
+                    reactivateNode(child, value);
+                    peek(child);
+                }
                 // 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) {
@@ -1034,7 +1173,10 @@ function updateNodes(parent, obj, prevValue) {
                 if (isDiff) {
                     // Array has a new / modified element
                     // If object iterate through its children
-                    if (isPrimitive(value)) {
+                    if (isFunction(value) || isObservable(value)) {
+                        extractFunctionOrComputed(parent, obj, key, value);
+                    }
+                    else if (isPrimitive(value)) {
                         hasADiff = true;
                     }
                     else {
@@ -1082,6 +1224,15 @@ function getProxy(node, p, asFunction) {
     // Create a proxy if not already cached and return it
     return (node.proxy || (node.proxy = new Proxy(node, proxyHandler)));
 }
+function flushPending() {
+    // Need to short circuit the computed batching because the user called get() or peek()
+    // in which case the set needs to run immediately so that the values are up to date.
+    if (globalState.pendingNodes.size > 0) {
+        const nodes = Array.from(globalState.pendingNodes.values());
+        globalState.pendingNodes.clear();
+        nodes.forEach((fn) => fn());
+    }
+}
 const proxyHandler = {
     get(node, p, receiver) {
         var _a;
@@ -1093,11 +1244,12 @@ const proxyHandler = {
         if (p === symbolGetNode) {
             return node;
         }
-        const value = peek(node);
+        let value = peek(node);
         // If this node is linked to another observable then forward to the target's handler.
         // The exception is onChange because it needs to listen to this node for changes.
         // This needs to be below peek because it activates there.
         if (node.linkedToNode && p !== 'onChange') {
+            updateTracking(node);
             return proxyHandler.get(node.linkedToNode, p, receiver);
         }
         if (value instanceof Map || value instanceof WeakMap || value instanceof Set || value instanceof WeakSet) {
@@ -1109,6 +1261,9 @@ const proxyHandler = {
         const fn = observableFns.get(p);
         // If this is an observable function, call it
         if (fn) {
+            if (p === 'get' || p === 'peek') {
+                flushPending();
+            }
             return function (a, b, c) {
                 const l = arguments.length;
                 // Array call and apply are slow so micro-optimize this hot path.
@@ -1126,14 +1281,6 @@ const proxyHandler = {
                 }
             };
         }
-        if (node.isComputed) {
-            if (node.proxyFn && !fn) {
-                return node.proxyFn(p);
-            }
-            else {
-                checkActivate(node);
-            }
-        }
         const property = observableProperties.get(p);
         if (property) {
             return property.get(node);
@@ -1152,7 +1299,7 @@ const proxyHandler = {
             }
         }
         // /TODOV3 Remove this
-        const vProp = value === null || value === void 0 ? void 0 : value[p];
+        let vProp = value === null || value === void 0 ? void 0 : value[p];
         if (isObject(value) && value[symbolOpaque]) {
             return vProp;
         }
@@ -1165,6 +1312,11 @@ const proxyHandler = {
                 return getProxy(node, p, fnOrComputed);
             }
         }
+        if (isNullOrUndefined(value) && vProp === undefined && (ArrayModifiers.has(p) || ArrayLoopers.has(p))) {
+            value = [];
+            setNodeValue(node, value);
+            vProp = value[p];
+        }
         // Handle function calls
         if (isFunction(vProp)) {
             if (isArray(value)) {
@@ -1214,10 +1366,6 @@ const proxyHandler = {
                 return vProp;
             }
         }
-        // TODOV3: Remove "state"
-        if (vProp === undefined && (p === 'state' || p === '_state') && node.state) {
-            return node.state;
-        }
         // Return an observable proxy to the property
         return getProxy(node, p);
     },
@@ -1282,7 +1430,7 @@ const proxyHandler = {
     },
     apply(target, thisArg, argArray) {
         // If it's a function call it as a function
-        return Reflect.apply(target, thisArg, argArray);
+        return Reflect.apply(target.lazyFn || target, thisArg, argArray);
     },
 };
 function set(node, newValue) {
@@ -1295,7 +1443,7 @@ function set(node, newValue) {
 }
 function toggle(node) {
     const value = getNodeValue(node);
-    if (value === undefined || isBoolean(value)) {
+    if (value === undefined || value === null || isBoolean(value)) {
         set(node, !value);
         return !value;
     }
@@ -1309,31 +1457,32 @@ function setKey(node, key, newValue, level) {
             console.warn(`[legend-state] Set an HTMLElement into state. You probably don't want to do that.`);
         }
     }
-    if (node.root.locked && !node.root.set) {
-        // This happens when modifying a locked observable such as a computed.
-        // If merging this could be happening deep in a hierarchy so we don't want to throw errors so we'll just do nothing.
-        // This could happen during persistence local load for example.
-        if (globalState.isMerging) {
-            return;
-        }
-        else {
-            throw new Error(process.env.NODE_ENV === 'development'
-                ? '[legend-state] Cannot modify an observable while it is locked. Please make sure that you unlock the observable before making changes.'
-                : '[legend-state] Modified locked observable');
-        }
-    }
     const isRoot = !node.parent && key === '_';
+    if (node.parent && !getNodeValue(node)) {
+        return set(node, { [key]: newValue });
+    }
     // Get the child node for updating and notifying
     const childNode = isRoot ? node : getChildNode(node, key, isFunction(newValue) ? newValue : undefined);
-    // Set the raw value on the parent object
-    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);
+    if (isObservable(newValue)) {
+        setToObservable(childNode, newValue);
+    }
+    else {
+        // Set the raw value on the parent object
+        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);
+        }
+        if (!isPrim) {
+            childNode.needsExtract = true;
+        }
+        extractFunctionOrComputed(node, parentValue, key, savedValue);
+        if (isFunc) {
+            return savedValue;
+        }
     }
-    extractFunctionOrComputed(node, parentValue, key, savedValue);
-    return isFunc ? savedValue : isRoot ? getProxy(node) : getProxy(node, key);
+    return isRoot ? getProxy(node) : getProxy(node, key);
 }
 function assign(node, value) {
     const proxy = getProxy(node);
@@ -1358,7 +1507,13 @@ function deleteFn(node, key) {
         key = node.key;
         node = node.parent;
     }
-    setKey(node, key !== null && key !== void 0 ? key : '_', symbolDelete, /*level*/ -1);
+    const value = getNodeValue(node);
+    if (isArray(value)) {
+        collectionSetter(node, value, 'splice', key, 1);
+    }
+    else {
+        setKey(node, key !== null && key !== void 0 ? key : '_', symbolDelete, /*level*/ -1);
+    }
 }
 function handlerMapSet(node, p, value) {
     const vProp = value === null || value === void 0 ? void 0 : value[p];
@@ -1438,7 +1593,7 @@ function handlerMapSet(node, p, value) {
 function updateNodesAndNotify(node, newValue, prevValue, childNode, isPrim, isRoot, level) {
     if (!childNode)
         childNode = node;
-    // Make sure we don't call too many listeners for ever property set
+    // Make sure we don't call too many listeners for every property set
     beginBatch();
     let hasADiff = isPrim;
     let whenOptimizedOnlyIf = false;
@@ -1468,30 +1623,41 @@ function extractPromise(node, value, setter) {
     value
         .then((value) => {
         setter ? setter({ value }) : set(node, value);
-        node.state.isLoaded.set(true);
+        node.state.assign({
+            isLoaded: true,
+            error: undefined,
+        });
     })
         .catch((error) => {
         node.state.error.set(error);
     });
 }
 function extractFunctionOrComputed(node, obj, k, v) {
+    var _a;
     if (isPromise(v)) {
         const childNode = getChildNode(node, k);
         extractPromise(childNode, v);
         setNodeValue(childNode, undefined);
     }
+    else if (isObservable(v)) {
+        const value = getNodeValue(node);
+        value[k] = () => v;
+        extractFunction(node, k, value[k]);
+    }
     else if (typeof v === 'function') {
+        const childNode = (_a = node.children) === null || _a === void 0 ? void 0 : _a.get(k);
         extractFunction(node, k, v);
-        delete obj[k];
+        // If child was previously activated, then peek the new linked observable to make sure it's activated
+        if (childNode && !childNode.lazy) {
+            if (isObservable(v)) {
+                const vNode = getNode(v);
+                peek(vNode);
+            }
+        }
     }
     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;
+        if (isObservable(v)) {
+            extractFunction(node, k, v);
         }
     }
 }
@@ -1502,181 +1668,348 @@ function get(node, options) {
     return peek(node);
 }
 function peek(node) {
-    const value = getNodeValue(node);
+    if (node.dirtyFn) {
+        node.dirtyFn();
+        globalState.dirtyNodes.delete(node);
+        node.dirtyFn = undefined;
+    }
+    let value = getNodeValue(node);
     // If node is not yet lazily computed go do that
     const lazy = node.lazy;
     if (lazy) {
+        const lazyFn = node.lazyFn;
         delete node.lazy;
-        if (isFunction(node) || isFunction(lazy)) {
-            activateNodeFunction(node, lazy);
+        if (isFunction(node) || isFunction(lazyFn)) {
+            value = activateNodeFunction(node, lazyFn);
         }
-        else {
-            for (const key in value) {
-                if (hasOwnProperty.call(value, key)) {
-                    extractFunctionOrComputed(node, value, key, value[key]);
-                }
+    }
+    if (lazy || node.needsExtract) {
+        for (const key in value) {
+            if (hasOwnProperty.call(value, key)) {
+                extractFunctionOrComputed(node, value, key, value[key]);
             }
         }
     }
-    // Check if computed needs to activate
-    checkActivate(node);
     return value;
 }
-function createNodeActivationParams(node) {
-    node.activationState = {
-        lastSync: {},
-    };
-    const state = node.activationState;
-    // The onSet function handles the observable being set
-    // and forwards the set elsewhere
-    const onSet = (onSetFnParam) => {
-        state.onSetFn = onSetFnParam;
-    };
-    // The onSet function handles the observable being set
-    // and forwards the set elsewhere
-    const updateLastSync = (fn) => {
-        state.lastSync.value = fn;
-    };
-    // The subscribe function runs a function that listens to
-    // a data source and sends updates into the observable
-    const subscribe = (fn) => {
-        if (!state.subscriber) {
-            state.subscriber = fn;
-        }
-    };
-    const cache = (fn) => {
-        if (!state.cacheOptions) {
-            state.cacheOptions = isFunction(fn) ? fn() : fn;
-        }
-    };
-    const retry = (params) => {
-        if (!state.retryOptions) {
-            state.retryOptions = params;
-        }
-    };
-    // The proxy function simply marks the node as a proxy with this function
-    // so that child nodes will be created with this function, and then simply
-    // activated as a function
-    const proxy = (fn) => {
-        node.proxyFn2 = fn;
-    };
-    return {
-        onSet,
-        proxy,
-        cache,
-        retry,
-        subscribe,
-        updateLastSync,
-        obs$: getProxy(node),
-    };
+function reactivateNode(node, lazyFn) {
+    var _a, _b;
+    (_a = node.activatedObserveDispose) === null || _a === void 0 ? void 0 : _a.call(node);
+    node.activatedObserveDispose = undefined;
+    (_b = node.linkedToNodeDispose) === null || _b === void 0 ? void 0 : _b.call(node);
+    node.linkedToNodeDispose = undefined;
+    node.linkedToNode = undefined;
+    node.lazyFn = lazyFn;
+    node.lazy = true;
 }
 function activateNodeFunction(node, lazyFn) {
-    let prevTarget$;
-    let curTarget$;
+    // let prevTarget$: Observable<any>;
+    // let curTarget$: Observable<any>;
     let update;
-    const activator = (isFunction(node) ? node : lazyFn);
     let wasPromise;
-    const refresh = () => node.state.refreshNum.set((v) => v + 1);
-    observe(() => {
-        const params = createNodeActivationParams(node);
+    let ignoreThisUpdate;
+    const activateFn = lazyFn;
+    const doRetry = () => { var _a; return (_a = node.state) === null || _a === void 0 ? void 0 : _a.refreshNum.set((v) => v + 1); };
+    let activatedValue;
+    let disposes = [];
+    let refreshFn;
+    function markDirty() {
+        node.dirtyFn = refreshFn;
+        globalState.dirtyNodes.add(node);
+    }
+    node.activatedObserveDispose = observe(() => {
+        var _a, _b, _c, _d, _e, _f;
+        // const params = createNodeActivationParams(node);
         // Run the function at this node
-        let value = activator(params);
-        // If target is an observable, get() it to make sure we listen to its changes
-        // and set up an onSet to write changes back to it
+        let value = activateFn();
+        // If target is an observable, make this node a link to it
         if (isObservable(value)) {
-            prevTarget$ = curTarget$;
-            curTarget$ = value;
-            params.onSet(({ value: newValue, getPrevious }) => {
-                // Don't set the target observable if the target has changed since the last run
-                if (!prevTarget$ || curTarget$ === prevTarget$) {
-                    // Set the node value back to what it was before before setting it.
-                    // This is a workaround for linked objects because it might not notify
-                    // if setting a property of an object
-                    // TODO: Is there a way to not do this? Or at least only do it in a
-                    // small subset of cases?
-                    setNodeValue(getNode(curTarget$), getPrevious());
-                    // Set the value on the curTarget
-                    curTarget$.set(newValue);
-                }
-            });
-            // Get the value from the observable because we still want the raw value
-            // for the effect.
-            value = value.get();
+            value = setToObservable(node, value);
         }
-        else {
-            wasPromise = isPromise(value) ? value : undefined;
+        if (isFunction(value)) {
+            value = value();
+        }
+        const activated = value === null || value === void 0 ? void 0 : value[symbolActivated];
+        if (activated) {
+            node.activationState = activated;
+            value = undefined;
         }
+        ignoreThisUpdate = false;
+        wasPromise = isPromise(value);
         // Activate this node if not activated already (may be called recursively)
         // TODO: Is calling recursively bad? If so can it be fixed?
         if (!node.activated) {
             node.activated = true;
+            const isCached = !!((_a = node.activationState) === null || _a === void 0 ? void 0 : _a.cache);
+            wasPromise = wasPromise || !!isCached;
             const activateNodeFn = wasPromise ? globalState.activateNode : activateNodeBase;
-            update = activateNodeFn(node, refresh, !!wasPromise, value).update;
-        }
-        node.state.refreshNum.get();
-        return value;
-    }, ({ value }) => {
-        if (!globalState.isLoadingRemote$.peek()) {
-            if (wasPromise) {
-                // Extract the promise to make it set the value/error when it comes in
-                extractPromise(node, value, update);
-                // Set this to undefined only if it's replacing the activation function,
-                // so we don't overwrite it if it already has real data from either local
-                // cache or a previous run
-                if (isFunction(getNodeValue(node))) {
-                    setNodeValue(node, undefined);
+            const { update: newUpdate, value: newValue } = activateNodeFn(node, doRetry, !!wasPromise, value);
+            update = newUpdate;
+            value = newValue !== null && newValue !== void 0 ? newValue : activated === null || activated === void 0 ? void 0 : activated.initial;
+        }
+        else if (node.activationState) {
+            if (!node.activationState.persistedRetry && !node.activationState.waitFor) {
+                const activated = node.activationState;
+                if ((_c = (_b = node.state) === null || _b === void 0 ? void 0 : _b.peek()) === null || _c === void 0 ? void 0 : _c.sync) {
+                    node.state.sync();
+                    ignoreThisUpdate = true;
+                }
+                else {
+                    value =
+                        (_e = (_d = activated.get) === null || _d === void 0 ? void 0 : _d.call(activated, {
+                            updateLastSync: noop,
+                            setMode: noop,
+                            lastSync: undefined,
+                            value: undefined,
+                            refresh: doRetry,
+                        })) !== null && _e !== void 0 ? _e : activated.initial;
                 }
             }
             else {
-                set(node, value);
-                node.state.isLoaded.set(true);
+                ignoreThisUpdate = true;
+            }
+        }
+        // value is undefined if it's in a persisted retry
+        wasPromise = wasPromise || isPromise(value);
+        get(getNode((_f = node.state) === null || _f === void 0 ? void 0 : _f.refreshNum));
+        return value;
+    }, (e) => {
+        if (!ignoreThisUpdate) {
+            const { value, nodes, refresh } = e;
+            refreshFn = refresh;
+            if (!wasPromise || !globalState.isLoadingRemote$.peek()) {
+                if (wasPromise) {
+                    if (node.activationState) {
+                        const { initial } = node.activationState;
+                        if (value && isPromise(value)) {
+                            // Extract the promise to make it set the value/error when it comes in
+                            extractPromise(node, value, update);
+                        }
+                        // Set this to undefined only if it's replacing the activation function,
+                        // so we don't overwrite it if it already has real data from either local
+                        // cache or a previous run
+                        if (isFunction(getNodeValue(node))) {
+                            setNodeValue(node, initial !== null && initial !== void 0 ? initial : undefined);
+                        }
+                    }
+                    else if (node.activated) {
+                        // Extract the promise to make it set the value/error when it comes in
+                        extractPromise(node, value, update);
+                        // Set this to undefined only if it's replacing the activation function,
+                        // so we don't overwrite it if it already has real data from either local
+                        // cache or a previous run
+                        if (isFunction(getNodeValue(node))) {
+                            setNodeValue(node, undefined);
+                        }
+                    }
+                }
+                else {
+                    activatedValue = value;
+                    if (node.state.isLoaded.peek()) {
+                        set(node, value);
+                    }
+                    else {
+                        setNodeValue(node, value);
+                        node.state.assign({
+                            isLoaded: true,
+                            error: undefined,
+                        });
+                    }
+                }
             }
+            disposes.forEach((fn) => fn());
+            disposes = [];
+            nodes === null || nodes === void 0 ? void 0 : nodes.forEach(({ node }) => {
+                disposes.push(onChange(node, markDirty, { immediate: true }));
+            });
         }
-    }, { immediate: true, fromComputed: true });
+        e.cancel = true;
+    }, { fromComputed: true });
+    return activatedValue;
 }
-const activateNodeBase = (globalState.activateNode = function activateNodeBase(node, refresh, wasPromise) {
-    const { onSetFn, subscriber } = node.activationState;
-    let isSetting = false;
+const activateNodeBase = (globalState.activateNode = function activateNodeBase(node, refresh, wasPromise, value) {
     if (!node.state) {
         node.state = createObservable({
             isLoaded: false,
         }, false, extractPromise, getProxy);
     }
-    if (onSetFn) {
-        const doSet = (params) => {
-            // Don't call the set if this is the first value coming in
-            if (!isSetting) {
-                if ((!wasPromise || node.state.isLoaded.get()) &&
-                    (params.changes.length > 1 || !isFunction(params.changes[0].prevAtPath))) {
-                    isSetting = true;
-                    batch(() => onSetFn(params, { update }), () => {
-                        isSetting = false;
-                    });
+    let isSetting = false;
+    let isSettingFromSubscribe = false;
+    let _mode = 'set';
+    if (node.activationState) {
+        const { onSet, subscribe, get: getFn, initial } = node.activationState;
+        value = getFn
+            ? runWithRetry(node, { attemptNum: 0 }, () => {
+                return getFn({
+                    updateLastSync: noop,
+                    setMode: (mode) => (_mode = mode),
+                    lastSync: undefined,
+                    value: undefined,
+                    refresh,
+                });
+            })
+            : undefined;
+        // TODO Should this have lastSync and value somehow?
+        if (value == undefined || value === null) {
+            value = initial;
+        }
+        if (onSet) {
+            let allChanges = [];
+            let latestValue = undefined;
+            let runNumber = 0;
+            const runChanges = (listenerParams) => {
+                // Don't call the set if this is the first value coming in
+                if (allChanges.length > 0) {
+                    let changes;
+                    let value;
+                    let getPrevious;
+                    if (listenerParams) {
+                        changes = listenerParams.changes;
+                        value = listenerParams.value;
+                        getPrevious = listenerParams.getPrevious;
+                    }
+                    else {
+                        // If this is called by flushPending then get the change array
+                        // that we've been building up.
+                        changes = allChanges;
+                        value = latestValue;
+                        getPrevious = createPreviousHandler(value, changes);
+                    }
+                    allChanges = [];
+                    latestValue = undefined;
+                    globalState.pendingNodes.delete(node);
+                    runNumber++;
+                    const thisRunNumber = runNumber;
+                    const run = () => {
+                        if (thisRunNumber !== runNumber) {
+                            // set may get called multiple times before it loads so ignore any previous runs
+                            return;
+                        }
+                        const retryAttempts = { attemptNum: 0 };
+                        return runWithRetry(node, retryAttempts, (eventRetry) => {
+                            const cancelRetry = () => {
+                                eventRetry.cancel = true;
+                            };
+                            return new Promise((resolve, reject) => {
+                                isSetting = true;
+                                let isProm = false;
+                                batch(() => {
+                                    try {
+                                        const val = onSet({
+                                            value,
+                                            changes,
+                                            getPrevious,
+                                            node,
+                                            update,
+                                            refresh,
+                                            retryNum: retryAttempts.attemptNum,
+                                            cancelRetry,
+                                            fromSubscribe: isSettingFromSubscribe,
+                                        });
+                                        isProm = isPromise(val);
+                                        if (isProm) {
+                                            val.then(resolve).catch(reject);
+                                        }
+                                    }
+                                    catch (e) {
+                                        reject(e);
+                                    }
+                                }, () => {
+                                    if (!isProm) {
+                                        isSetting = false;
+                                        resolve();
+                                    }
+                                });
+                            });
+                        });
+                    };
+                    whenReady(node.state.isLoaded, run);
                 }
-            }
-        };
-        onChange(node, doSet, wasPromise ? undefined : { immediate: true });
-    }
-    if (process.env.NODE_ENV === 'development' && node.activationState.cacheOptions) {
-        // TODO Better message
-        console.log('[legend-state] Using cacheOptions without setting up persistence first');
-    }
-    if (process.env.NODE_ENV === 'development' && node.activationState.retryOptions) {
-        // TODO Better message
-        console.log('[legend-state] Using retryOptions without setting up persistence first');
+            };
+            const onChangeImmediate = ({ value, changes }) => {
+                if (!isSetting || isSettingFromSubscribe) {
+                    if (changes.length > 1 || !isFunction(changes[0].prevAtPath)) {
+                        latestValue = value;
+                        if (allChanges.length > 0) {
+                            changes = changes.filter((change) => !isArraySubset(allChanges[0].path, change.path));
+                        }
+                        allChanges.push(...changes);
+                        globalState.pendingNodes.set(node, runChanges);
+                    }
+                }
+            };
+            // Create an immediate listener to mark this node as pending. Then actually run
+            // the changes at the end of the batch so everything is properly batched.
+            // However, this can be short circuited if the user calls get() or peek()
+            // in which case the set needs to run immediately so that the values are up to date.
+            onChange(node, onChangeImmediate, { immediate: true });
+            onChange(node, runChanges);
+        }
+        if (process.env.NODE_ENV === 'development' && node.activationState.cache) {
+            // TODO Better message
+            console.log('[legend-state] Using cache without setting up persistence first');
+        }
+        if (process.env.NODE_ENV === 'development' && node.activationState.retry) {
+            // TODO Better message
+            console.log('[legend-state] Using retry without setting up persistence first');
+        }
+        if (subscribe) {
+            const updateFromSubscribe = (params) => {
+                whenReady(node.state.isLoaded, () => {
+                    isSettingFromSubscribe = true;
+                    update(params);
+                    isSettingFromSubscribe = false;
+                });
+            };
+            subscribe({ node, update: updateFromSubscribe, refresh });
+        }
     }
-    const update = ({ value }) => {
+    const update = ({ value, mode }) => {
         // TODO: This isSetting might not be necessary? Tests still work if removing it.
         // Write tests that would break it if removed? I'd guess a combination of subscribe and
         if (!isSetting) {
-            set(node, value);
+            isSetting = true;
+            if (_mode === 'assign' || mode === 'assign') {
+                assign(node, value);
+            }
+            else if (_mode === 'merge' || mode === 'merge') {
+                mergeIntoObservable(getProxy(node), value);
+            }
+            else {
+                set(node, value);
+            }
+            isSetting = false;
         }
     };
-    if (subscriber) {
-        subscriber({ update, refresh });
-    }
-    return { update };
+    return { update, value };
 });
+function setToObservable(node, value) {
+    var _a;
+    // If the computed is a proxy to another observable
+    // link it to the target observable
+    const linkedNode = getNode(value);
+    if (linkedNode !== node && (linkedNode === null || linkedNode === void 0 ? void 0 : linkedNode.linkedToNode) !== node) {
+        const prevNode = node.linkedToNode;
+        node.linkedToNode = linkedNode;
+        if (!linkedNode.linkedFromNodes) {
+            linkedNode.linkedFromNodes = new Set();
+        }
+        linkedNode.linkedFromNodes.add(node);
+        peek(linkedNode);
+        (_a = node.linkedToNodeDispose) === null || _a === void 0 ? void 0 : _a.call(node);
+        node.linkedToNodeDispose = onChange(linkedNode, () => {
+            value = peek(linkedNode);
+            set(node, value);
+        }, { initial: true });
+        // If the target observable is different then notify for the change
+        if (prevNode) {
+            const value = getNodeValue(linkedNode);
+            const prevValue = getNodeValue(prevNode);
+            notify(node, value, prevValue, 0);
+        }
+    }
+    return value;
+}
 
 const fns = ['get', 'set', 'peek', 'onChange', 'toggle'];
 function ObservablePrimitiveClass(node) {
@@ -1693,8 +2026,14 @@ function proto(key, fn) {
         return fn.call(this, this._node, ...args);
     };
 }
-proto('peek', peek);
-proto('get', get);
+proto('peek', (node) => {
+    flushPending();
+    return peek(node);
+});
+proto('get', (node, options) => {
+    flushPending();
+    return get(node, options);
+});
 proto('set', set);
 proto('onChange', onChange);
 // Getters
@@ -1706,7 +2045,7 @@ Object.defineProperty(ObservablePrimitiveClass.prototype, symbolGetNode, {
 });
 ObservablePrimitiveClass.prototype.toggle = function () {
     const value = this.peek();
-    if (value === undefined || isBoolean(value)) {
+    if (value === undefined || value === null || isBoolean(value)) {
         this.set(!value);
     }
     else if (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {
@@ -1725,89 +2064,25 @@ function observable(value) {
 function observablePrimitive(value) {
     return createObservable(value, true, extractPromise, getProxy, ObservablePrimitiveClass);
 }
-globalState.isLoadingRemote$ = observable(false);
-
-function computed(compute, set$1) {
-    // Create an observable for this computed variable
-    const obs = observable();
-    lockObservable(obs, true);
+function syncState(obs) {
     const node = getNode(obs);
-    node.isComputed = true;
-    let isSetAfterActivated = false;
-    const setInner = function (val) {
-        const prevNode = node.linkedToNode;
-        // If it was previously linked to a node remove self
-        // from its linkedFromNodes
-        if (prevNode) {
-            prevNode.linkedFromNodes.delete(node);
-            node.linkedToNode = undefined;
-        }
-        const { parentOther } = node;
-        if (isObservable(val)) {
-            // If the computed is a proxy to another observable
-            // link it to the target observable
-            const linkedNode = getNode(val);
-            node.linkedToNode = linkedNode;
-            if (!linkedNode.linkedFromNodes) {
-                linkedNode.linkedFromNodes = new Set();
-            }
-            linkedNode.linkedFromNodes.add(node);
-            if (node.parentOther) {
-                onChange(linkedNode, ({ value }) => {
-                    setNodeValue(node.parentOther, value);
-                }, { initial: true });
-            }
-            // If the target observable is different then notify for the change
-            if (prevNode) {
-                const value = getNodeValue(linkedNode);
-                const prevValue = getNodeValue(prevNode);
-                notify(node, value, prevValue, 0);
-            }
-        }
-        else if (val !== obs.peek()) {
-            // Unlock computed node before setting the value
-            lockObservable(obs, false);
-            const setter = isSetAfterActivated ? set : setNodeValue;
-            // Update the computed value
-            setter(node, val);
-            // If the computed is a child of an observable set the value on it
-            if (parentOther) {
-                let didUnlock = false;
-                if (parentOther.root.locked) {
-                    parentOther.root.locked = false;
-                    didUnlock = true;
-                }
-                setter(parentOther, val);
-                if (didUnlock) {
-                    parentOther.root.locked = true;
-                }
-            }
-            // Re-lock the computed node
-            lockObservable(obs, true);
-        }
-        else if (parentOther) {
-            setNodeValue(parentOther, val);
-        }
-        isSetAfterActivated = true;
-    };
-    // Lazily activate the observable when get is called
-    node.root.activate = () => {
-        node.root.activate = undefined;
-        observe(compute, ({ value }) => {
-            if (isPromise(value)) {
-                value.then((v) => setInner(v));
-            }
-            else {
-                setInner(value);
-            }
-        }, { immediate: true, fromComputed: true });
-    };
-    if (set$1) {
-        node.root.set = (value) => {
-            batch(() => set$1(value));
-        };
+    if (!node.state) {
+        peek(node);
     }
-    return obs;
+    if (!node.state) {
+        node.state = observable({});
+    }
+    return node.state;
+}
+globalState.isLoadingRemote$ = observable(false);
+
+function computed(compute, set) {
+    return observable(set
+        ? activated({
+            get: compute,
+            onSet: ({ value }) => set(value),
+        })
+        : compute);
 }
 
 function configureLegendState({ observableFunctions, observableProperties: observableProperties$1, }) {
@@ -1861,86 +2136,14 @@ function event() {
 }
 
 function proxy(get, set) {
-    // Create an observable for this computed variable
-    const obs = observable({});
-    lockObservable(obs, true);
-    const mapTargets = new Map();
-    const node = getNode(obs);
-    node.isComputed = true;
-    node.proxyFn = (key) => {
-        let target = mapTargets.get(key);
-        if (!target) {
-            // Note: Coercing typescript to allow undefined for set in computed because we don't want the public interface to allow undefined
-            target = computed(() => get(key), (set ? (value) => set(key, value) : undefined));
-            mapTargets.set(key, target);
-            extractFunction(node, key, target, getNode(target));
-            if (node.parentOther) {
-                onChange(getNode(target), ({ value, getPrevious }) => {
-                    const previous = getPrevious();
-                    // Set the raw value on the proxy's parent
-                    setNodeValue(node.parentOther, node.root._);
-                    // Notify the proxy
-                    notify(getChildNode(node, key), value, previous, 0);
-                });
-            }
-        }
-        return target;
-    };
-    return obs;
-}
-
-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 (!isPromise(ret) && (checkReady ? isObservableValueReady(ret) : ret)) {
-            value = ret;
-            // 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, doEffect);
-    // If first run resulted in a truthy value just return it.
-    // It will have set e.cancel so no need to dispose
-    if (isPromise(value)) {
-        return effect ? value.then(effect) : value;
-    }
-    else if (value !== undefined) {
-        return Promise.resolve(value);
-    }
-    else {
-        // Wrap it in a promise
-        const promise = new Promise((resolve) => {
-            if (effect) {
-                const originalEffect = effect;
-                effect = (value) => {
-                    const effectValue = originalEffect(value);
-                    resolve(effectValue);
-                };
-            }
-            else {
-                effect = resolve;
-            }
-        });
-        return promise;
-    }
-}
-function when(predicate, effect) {
-    return _when(predicate, effect, false);
-}
-function whenReady(predicate, effect) {
-    return _when(predicate, effect, true);
+    return observable(activated({
+        lookup: (key) => set
+            ? activated({
+                get: () => get(key),
+                onSet: ({ value }) => set(key, value),
+            })
+            : get(key),
+    }));
 }
 
 const internal = {
@@ -1953,17 +2156,19 @@ const internal = {
     observableFns,
     optimized,
     peek,
+    runWithRetry,
     set,
     setAtPath,
     setNodeValue,
+    symbolActivated,
     symbolDelete,
 };
 
 exports.ObservablePrimitiveClass = ObservablePrimitiveClass;
+exports.activated = activated;
 exports.batch = batch;
 exports.beginBatch = beginBatch;
 exports.beginTracking = beginTracking;
-exports.checkActivate = checkActivate;
 exports.computeSelector = computeSelector;
 exports.computed = computed;
 exports.configureLegendState = configureLegendState;
@@ -1982,8 +2187,10 @@ exports.hasOwnProperty = hasOwnProperty;
 exports.internal = internal;
 exports.isArray = isArray;
 exports.isBoolean = isBoolean;
+exports.isDate = isDate;
 exports.isEmpty = isEmpty;
 exports.isFunction = isFunction;
+exports.isNullOrUndefined = isNullOrUndefined;
 exports.isObject = isObject;
 exports.isObservable = isObservable;
 exports.isObservableValueReady = isObservableValueReady;
@@ -1991,7 +2198,6 @@ exports.isPrimitive = isPrimitive;
 exports.isPromise = isPromise;
 exports.isString = isString;
 exports.isSymbol = isSymbol;
-exports.lockObservable = lockObservable;
 exports.mergeIntoObservable = mergeIntoObservable;
 exports.observable = observable;
 exports.observablePrimitive = observablePrimitive;
@@ -2004,6 +2210,7 @@ exports.setInObservableAtPath = setInObservableAtPath;
 exports.setSilently = setSilently;
 exports.setupTracking = setupTracking;
 exports.symbolDelete = symbolDelete;
+exports.syncState = syncState;
 exports.trackSelector = trackSelector;
 exports.tracking = tracking;
 exports.updateTracking = updateTracking;