@legendapp/state 2.2.0-next.8 → 2.2.0-next.80

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';
@@ -26,6 +29,13 @@ function isBoolean(obj) {
 function isPromise(obj) {
     return obj instanceof Promise;
 }
+function isMap(obj) {
+    return obj instanceof Map;
+}
+function isNumber(obj) {
+    const n = obj;
+    return n - n < 1;
+}
 function isEmpty(obj) {
     // Looping and returning false on the first property is faster than Object.keys(obj).length === 0
     // https://jsbench.me/qfkqv692c8
@@ -40,6 +50,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,72 +68,122 @@ const symbolGetNode = Symbol('getNode');
 const symbolDelete = /* @__PURE__ */ Symbol('delete');
 const symbolOpaque = Symbol('opaque');
 const optimized = Symbol('optimized');
-// TODOV3 Remove these
-const extraPrimitiveActivators = new Map();
-const extraPrimitiveProps = new Map();
+const symbolLinked = Symbol('linked');
 const globalState = {
     isLoadingLocal: false,
     isMerging: false,
-    isLoadingRemote$: undefined,
-    activateNode: undefined,
+    isLoadingRemote: false,
+    activateSyncedNode: undefined,
+    pendingNodes: new Map(),
+    dirtyNodes: new Set(),
+    replacer: undefined,
+    reviver: undefined,
 };
-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 getPathType(value) {
+    return isArray(value) ? 'array' : isMap(value) ? 'map' : value instanceof Set ? 'set' : 'object';
+}
+function replacer(key, value) {
+    if (isMap(value)) {
+        return {
+            __LSType: 'Map',
+            value: Array.from(value.entries()), // or with spread: value: [...value]
+        };
+    }
+    else if (value instanceof Set) {
+        return {
+            __LSType: 'Set',
+            value: Array.from(value), // or with spread: value: [...value]
+        };
+    }
+    else if (globalState.replacer) {
+        value = globalState.replacer(key, value);
+    }
+    return value;
 }
-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;
+const ISO8601 = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}.\d{3}Z$/;
+function reviver(key, value) {
+    if (value) {
+        if (typeof value === 'string' && ISO8601.test(value)) {
+            return new Date(value);
+        }
+        if (typeof value === 'object') {
+            if (value.__LSType === 'Map') {
+                return new Map(value.value);
+            }
+            else if (value.__LSType === 'Set') {
+                return new Set(value.value);
+            }
+        }
+        if (globalState.reviver) {
+            value = globalState.reviver(key, value);
+        }
     }
+    return value;
+}
+function safeStringify(value) {
+    return JSON.stringify(value, replacer);
+}
+function safeParse(value) {
+    return JSON.parse(value, reviver);
+}
+function clone(value) {
+    return safeParse(safeStringify(value));
+}
+function isObservable(obs) {
+    return !!obs && !!obs[symbolGetNode];
 }
 function getNode(obs) {
     return obs && obs[symbolGetNode];
 }
-function setNodeValue(node, newValue) {
+function isEvent(obs) {
     var _a;
+    return obs && ((_a = obs[symbolGetNode]) === null || _a === void 0 ? void 0 : _a.isEvent);
+}
+function setNodeValue(node, newValue) {
+    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;
     if (isDelete)
         newValue = undefined;
     // Get the value of the parent
-    // const parentValue = isRoot ? node.root : ensureNodeValue(node);
     const parentValue = node.parent ? ensureNodeValue(parentNode) : parentNode.root;
     // Save the previous value first
     const prevValue = parentValue[key];
     const isFunc = isFunction(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)) {
-        const val = newValue;
-        node.lazy = () => val;
-        newValue = undefined;
-    }
-    try {
-        parentNode.isSetting = (parentNode.isSetting || 0) + 1;
-        // Save the new value
-        if (isDelete) {
-            delete parentValue[key];
+    newValue = !parentNode.isAssigning && isFunc && !isFunction(prevValue) ? newValue(prevValue) : newValue;
+    if (!globalState.isMerging ||
+        isNullOrUndefined(prevValue) ||
+        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;
+            const useMapFn = isMap(parentValue);
+            // Save the new value
+            if (isDelete) {
+                if (useMapFn) {
+                    parentValue.delete(key);
+                }
+                else {
+                    delete parentValue[key];
+                }
+            }
+            else {
+                const useMapFn = isMap(parentValue);
+                if (useMapFn) {
+                    parentValue.set(key, newValue);
+                }
+                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 };
+    return { prevValue, newValue };
 }
 const arrNodeKeys = [];
 function getNodeValue(node) {
@@ -133,18 +196,12 @@ function getNodeValue(node) {
     let child = node.root._;
     for (let i = count - 1; child && i >= 0; i--) {
         const key = arrNodeKeys[i];
-        child = key !== 'size' && (child instanceof Map || child instanceof WeakMap) ? child.get(key) : child[key];
+        child = key !== 'size' && (isMap(child) || child instanceof WeakMap) ? child.get(key) : child[key];
     }
     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;
+    var _a, _b;
     // Get the child by key
     let child = (_a = node.children) === null || _a === void 0 ? void 0 : _a.get(key);
     // Create the child node if it doesn't already exist
@@ -155,11 +212,13 @@ function getChildNode(node, key, asFunction) {
             key,
             lazy: true,
         };
-        if (asFunction) {
-            child = Object.assign(cloneFunction(asFunction), child);
+        // Lookup functions are bound with the child key
+        if (((_b = node.lazyFn) === null || _b === void 0 ? void 0 : _b.length) === 1) {
+            asFunction = node.lazyFn.bind(node, key);
         }
-        else if (node.proxyFn2) {
-            child = Object.assign(node.proxyFn2.bind(node, key), child);
+        if (isFunction(asFunction)) {
+            child = Object.assign(() => { }, child);
+            child.lazyFn = asFunction;
         }
         if (!node.children) {
             node.children = new Map();
@@ -170,7 +229,7 @@ function getChildNode(node, key, asFunction) {
 }
 function ensureNodeValue(node) {
     let value = getNodeValue(node);
-    if (!value) {
+    if (!value || isFunction(value)) {
         if (isChildNodeValue(node)) {
             const parent = ensureNodeValue(node.parent);
             value = parent[node.key] = {};
@@ -183,17 +242,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,26 +264,20 @@ 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 equals(a, b) {
+    return a === b || (isDate(a) && isDate(b) && +a === +b);
 }
 
 let timeout;
 let numInBatch = 0;
 let isRunningBatch = false;
 let didDelayEndBatch = false;
-let _afterBatch = [];
-let _queuedBatches = [];
 let _batchMap = new Map();
 function onActionTimeout() {
     if (_batchMap.size > 0) {
@@ -241,23 +296,36 @@ 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
+        // TODO: Is this behavior similar to setAtPath or mergeIntoObservable so one
+        // of those could be used here?
+        let cloned = value ? clone(value) : {};
+        for (let i = 0; i < changes.length; i++) {
+            const { path, prevAtPath } = changes[i];
+            let o = cloned;
+            if (path.length > 0) {
+                let i;
+                for (i = 0; i < path.length - 1; i++) {
+                    o = o[path[i]];
+                }
+                const key = path[i];
+                if (isMap(o)) {
+                    o.set(key, prevAtPath);
+                }
+                else {
+                    o[key] = prevAtPath;
+                }
+            }
+            else {
+                cloned = prevAtPath;
             }
-            o[path[i]] = prevAtPath;
-        }
-        else {
-            clone = prevAtPath;
         }
+        return cloned;
+    }
+    catch (_a) {
+        return undefined;
     }
-    return clone;
 }
 function createPreviousHandler(value, changes) {
     // Create a function that generates the previous state
@@ -270,9 +338,13 @@ function createPreviousHandler(value, changes) {
 function notify(node, value, prev, level, whenOptimizedOnlyIf) {
     // Run immediate listeners if there are any
     const changesInBatch = new Map();
-    computeChangesRecursive(changesInBatch, node, value, [], [], value, prev, 
+    computeChangesRecursive(changesInBatch, node, 
+    /*loading*/ globalState.isLoadingLocal, 
+    /*remote*/ globalState.isLoadingRemote, value, [], [], value, prev, 
     /*immediate*/ true, level, whenOptimizedOnlyIf);
-    batchNotifyChanges(changesInBatch, /*immediate*/ true);
+    if (changesInBatch.size) {
+        batchNotifyChanges(changesInBatch, /*immediate*/ true);
+    }
     // Update the current batch
     const existing = _batchMap.get(node);
     if (existing) {
@@ -280,14 +352,21 @@ function notify(node, value, prev, level, whenOptimizedOnlyIf) {
         // TODO: level, whenOptimizedOnlyIf
     }
     else {
-        _batchMap.set(node, { value, prev, level, whenOptimizedOnlyIf });
+        _batchMap.set(node, {
+            value,
+            prev,
+            level,
+            whenOptimizedOnlyIf,
+            remote: globalState.isLoadingRemote,
+            loading: globalState.isLoadingLocal,
+        });
     }
     // If not in a batch run it immediately
     if (numInBatch <= 0) {
         runBatch();
     }
 }
-function computeChangesAtNode(changesInBatch, node, value, path, pathTypes, valueAtPath, prevAtPath, immediate, level, whenOptimizedOnlyIf) {
+function computeChangesAtNode(changesInBatch, node, loading, remote, value, path, pathTypes, valueAtPath, prevAtPath, immediate, level, whenOptimizedOnlyIf) {
     // If there are listeners at this node compute the changes that need to be run
     if (immediate ? node.listenersImmediate : node.listeners) {
         const change = {
@@ -308,18 +387,21 @@ function computeChangesAtNode(changesInBatch, node, value, path, pathTypes, valu
             changesInBatch.set(node, {
                 level,
                 value,
+                remote,
+                loading,
                 whenOptimizedOnlyIf,
                 changes: [change],
             });
         }
     }
 }
-function computeChangesRecursive(changesInBatch, node, value, path, pathTypes, valueAtPath, prevAtPath, immediate, level, whenOptimizedOnlyIf) {
+function computeChangesRecursive(changesInBatch, node, loading, remote, value, path, pathTypes, valueAtPath, prevAtPath, immediate, level, whenOptimizedOnlyIf) {
     // Do the compute at this node
-    computeChangesAtNode(changesInBatch, node, value, path, pathTypes, valueAtPath, prevAtPath, immediate, level, whenOptimizedOnlyIf);
+    computeChangesAtNode(changesInBatch, node, loading, remote, value, path, pathTypes, valueAtPath, prevAtPath, immediate, level, whenOptimizedOnlyIf);
     if (node.linkedFromNodes) {
         for (const linkedFromNode of node.linkedFromNodes) {
-            computeChangesAtNode(changesInBatch, linkedFromNode, value, path, pathTypes, valueAtPath, prevAtPath, immediate, level, whenOptimizedOnlyIf);
+            const childNode = getNodeAtPath(linkedFromNode, path);
+            computeChangesRecursive(changesInBatch, childNode, loading, remote, valueAtPath, [], [], valueAtPath, prevAtPath, immediate, 0, whenOptimizedOnlyIf);
         }
     }
     // If not root notify up through parents
@@ -327,14 +409,14 @@ function computeChangesRecursive(changesInBatch, node, value, path, pathTypes, v
         const parent = node.parent;
         if (parent) {
             const parentValue = getNodeValue(parent);
-            computeChangesRecursive(changesInBatch, parent, parentValue, [node.key].concat(path), [(isArray(value) ? 'array' : 'object')].concat(pathTypes), valueAtPath, prevAtPath, immediate, level + 1, whenOptimizedOnlyIf);
+            computeChangesRecursive(changesInBatch, parent, loading, remote, parentValue, [node.key].concat(path), [getPathType(value)].concat(pathTypes), valueAtPath, prevAtPath, immediate, level + 1, whenOptimizedOnlyIf);
         }
     }
 }
 function batchNotifyChanges(changesInBatch, immediate) {
     const listenersNotified = new Set();
     // For each change in the batch, notify all of the listeners
-    changesInBatch.forEach(({ changes, level, value, whenOptimizedOnlyIf }, node) => {
+    changesInBatch.forEach(({ changes, level, value, loading, remote, whenOptimizedOnlyIf }, node) => {
         const listeners = immediate ? node.listenersImmediate : node.listeners;
         if (listeners) {
             let listenerParams;
@@ -351,6 +433,8 @@ function batchNotifyChanges(changesInBatch, immediate) {
                         if (!noArgs && !listenerParams) {
                             listenerParams = {
                                 value,
+                                loading,
+                                remote,
                                 getPrevious: createPreviousHandler(value, changes),
                                 changes,
                             };
@@ -366,32 +450,32 @@ function batchNotifyChanges(changesInBatch, immediate) {
     });
 }
 function runBatch() {
+    const dirtyNodes = Array.from(globalState.dirtyNodes);
+    globalState.dirtyNodes.clear();
+    dirtyNodes.forEach((node) => {
+        const dirtyFn = node.dirtyFn;
+        if (dirtyFn) {
+            node.dirtyFn = undefined;
+            dirtyFn();
+        }
+    });
     // 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();
     // First compute all of the changes at each node. It's important to do this first before
     // running all the notifications because createPreviousHandler depends on knowing
     // all of the changes happening at the node.
-    map.forEach(({ value, prev, level, whenOptimizedOnlyIf }, node) => {
-        computeChangesRecursive(changesInBatch, node, value, [], [], value, prev, false, level, whenOptimizedOnlyIf);
+    map.forEach(({ value, prev, level, loading, remote, whenOptimizedOnlyIf }, node) => {
+        computeChangesRecursive(changesInBatch, node, loading, remote, value, [], [], value, prev, false, level, whenOptimizedOnlyIf);
     });
     // Once all changes are computed, notify all listeners for each node with the computed changes.
-    batchNotifyChanges(changesInBatch, false);
-}
-function batch(fn, onComplete) {
-    if (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);
-        }
+    if (changesInBatch.size) {
+        batchNotifyChanges(changesInBatch, false);
     }
+}
+function batch(fn) {
     beginBatch();
     try {
         fn();
@@ -420,45 +504,61 @@ function endBatch(force) {
                 timeout = undefined;
             }
             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.
-            const after = _afterBatch;
-            if (after.length) {
-                _afterBatch = [];
-            }
             isRunningBatch = true;
             runBatch();
             isRunningBatch = false;
-            // Run after functions at the end of this batch before running the next batch.
-            // This needs to run before the delayed endBatch because the after functions need
-            // to run before any side effects of the batch
-            for (let i = 0; i < after.length; i++) {
-                after[i]();
-            }
             // If an endBatch was delayed run it now
             if (didDelayEndBatch) {
                 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 getNodeAtPath(obj, path) {
+    let o = obj;
+    for (let i = 0; i < path.length; i++) {
+        const p = path[i];
+        o = getChildNode(o, p);
+    }
+    return o;
+}
 
-function isEvent(obs) {
-    var _a;
-    return obs && ((_a = obs[symbolGetNode]) === null || _a === void 0 ? void 0 : _a.isEvent);
+function linked(params) {
+    return (() => ({ [symbolLinked]: params }));
+}
+
+function createObservable(value, makePrimitive, extractPromise, createObject, createPrimitive) {
+    if (isObservable(value)) {
+        return value;
+    }
+    const valueIsPromise = isPromise(value);
+    const valueIsFunction = isFunction(value);
+    const root = {
+        _: value,
+    };
+    let node = {
+        root,
+        lazy: true,
+    };
+    if (valueIsFunction) {
+        node = Object.assign(() => { }, node);
+        node.lazyFn = value;
+    }
+    const prim = makePrimitive || isActualPrimitive(value);
+    const obs = prim
+        ? new createPrimitive(node)
+        : createObject(node);
+    if (valueIsPromise) {
+        setNodeValue(node, undefined);
+        extractPromise(node, value);
+    }
+    return 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;
@@ -466,7 +566,7 @@ function computeSelector(selector, e, retainObservable) {
 function getObservableIndex(obs) {
     const node = getNode(obs);
     const n = +node.key;
-    return n - n < 1 ? +n : -1;
+    return isNumber(n) ? n : -1;
 }
 function opaqueObject(value) {
     if (value) {
@@ -474,45 +574,61 @@ 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 getValueAtPath$1(obj, path) {
+    let o = obj;
+    for (let i = 0; o && i < path.length; i++) {
+        const p = path[i];
+        o = o[p];
     }
+    return o;
 }
-function setAtPath(obj, path, pathTypes, value, fullObj, restore) {
+function setAtPath(obj, path, pathTypes, value, mode, fullObj, restore) {
     let o = obj;
     let oFull = fullObj;
+    let p = undefined;
     if (path.length > 0) {
         for (let i = 0; i < path.length; i++) {
-            const p = path[i];
-            if (i === path.length - 1) {
-                // Don't set if the value is the same. This prevents creating a new key
-                // when setting undefined on an object without this key
-                if (o[p] !== value) {
-                    o[p] = value;
-                }
-            }
-            else if (o[p] === symbolDelete) {
+            p = path[i];
+            if (o[p] === symbolDelete) {
                 // If this was previously deleted, restore it
                 if (oFull) {
                     o[p] = oFull[p];
                     restore === null || restore === void 0 ? void 0 : restore(path.slice(0, i + 1), o[p]);
                 }
-                break;
+                return obj;
+            }
+            else if (o[p] === undefined && value === undefined && i === path.length - 1) {
+                // If setting undefined and the key is undefined, no need to initialize or set it
+                return obj;
             }
             else if (o[p] === undefined || o[p] === null) {
-                o[p] = pathTypes[i] === 'array' ? [] : {};
+                o[p] = initializePathType(pathTypes[i]);
             }
-            o = o[p];
-            if (oFull) {
-                oFull = oFull[p];
+            if (i < path.length - 1) {
+                o = o[p];
+                if (oFull) {
+                    oFull = oFull[p];
+                }
             }
         }
     }
+    // Don't set if the value is the same. This prevents creating a new key
+    // when setting undefined on an object without this key
+    if (p === undefined) {
+        if (mode === 'merge') {
+            obj = _mergeIntoObservable(obj, value);
+        }
+        else {
+            obj = value;
+        }
+    }
     else {
-        obj = value;
+        if (mode === 'merge') {
+            o[p] = _mergeIntoObservable(o[p], value);
+        }
+        else {
+            o[p] = value;
+        }
     }
     return obj;
 }
@@ -521,8 +637,8 @@ function setInObservableAtPath(obs, path, pathTypes, value, mode) {
     let v = value;
     for (let i = 0; i < path.length; i++) {
         const p = path[i];
-        if (!o.peek()[p] && pathTypes[i] === 'array') {
-            o[p].set([]);
+        if (!o.peek()[p]) {
+            o[p].set(initializePathType(pathTypes[i]));
         }
         o = o[p];
         v = v[p];
@@ -534,6 +650,9 @@ function setInObservableAtPath(obs, path, pathTypes, value, mode) {
     else if (mode === 'assign' && o.assign && isObject(o.peek())) {
         o.assign(v);
     }
+    else if (mode === 'merge') {
+        mergeIntoObservable(o, v);
+    }
     else {
         o.set(v);
     }
@@ -563,7 +682,9 @@ function _mergeIntoObservable(target, source) {
             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);
@@ -596,7 +717,7 @@ function constructObjectWithPath(path, pathTypes, value) {
         let o = (out = {});
         for (let i = 0; i < path.length; i++) {
             const p = path[i];
-            o[p] = i === path.length - 1 ? value : pathTypes[i] === 'array' ? [] : {};
+            o[p] = i === path.length - 1 ? value : initializePathType(pathTypes[i]);
             o = o[p];
         }
     }
@@ -609,7 +730,7 @@ function deconstructObjectWithPath(path, pathTypes, value) {
     let o = value;
     for (let i = 0; i < path.length; i++) {
         const p = path[i];
-        o = o ? o[p] : pathTypes[i] === 'array' ? [] : {};
+        o = o ? o[p] : initializePathType(pathTypes[i]);
     }
     return o;
 }
@@ -620,8 +741,21 @@ function setSilently(obs, newValue) {
     const node = getNode(obs);
     return setNodeValue(node, newValue).newValue;
 }
+function initializePathType(pathType) {
+    switch (pathType) {
+        case 'array':
+            return [];
+        case 'object':
+            return {};
+        case 'map':
+            return new Map();
+        case 'set':
+            return new Set();
+    }
+}
 
-function onChange(node, callback, options = {}) {
+function onChange(node, callback, options = {}, fromLinks) {
+    var _a;
     const { initial, immediate, noArgs } = options;
     const { trackingType } = options;
     let listeners = immediate ? node.listenersImmediate : node.listeners;
@@ -634,7 +768,6 @@ function onChange(node, callback, options = {}) {
             node.listeners = listeners;
         }
     }
-    checkActivate(node);
     const listener = {
         listener: callback,
         track: trackingType,
@@ -645,6 +778,8 @@ function onChange(node, callback, options = {}) {
         const value = getNodeValue(node);
         callback({
             value,
+            loading: true,
+            remote: false,
             changes: [
                 {
                     path: [],
@@ -656,7 +791,80 @@ function onChange(node, callback, options = {}) {
             getPrevious: () => undefined,
         });
     }
-    return () => listeners.delete(listener);
+    let extraDisposes;
+    function addLinkedNodeListeners(childNode, cb = callback, from) {
+        // Don't add listeners for the same node more than once
+        if (!(fromLinks === null || fromLinks === void 0 ? void 0 : fromLinks.has(childNode))) {
+            fromLinks || (fromLinks = new Set());
+            fromLinks.add(from || node);
+            cb || (cb = callback);
+            const childOptions = {
+                trackingType: true,
+                ...options,
+            };
+            // onChange for the linked node
+            extraDisposes = [...(extraDisposes || []), onChange(childNode, cb, childOptions, fromLinks)];
+        }
+    }
+    // Add listeners for linked to nodes
+    if (node.linkedToNode) {
+        addLinkedNodeListeners(node.linkedToNode);
+    }
+    // Add listeners for linked from nodes
+    (_a = node.linkedFromNodes) === null || _a === void 0 ? void 0 : _a.forEach((linkedFromNode) => addLinkedNodeListeners(linkedFromNode));
+    // Go up through the parents and add listeners for linked from nodes
+    let parent = node.parent;
+    let pathParent = [node.key];
+    while (parent) {
+        if (parent.linkedFromNodes) {
+            for (const linkedFromNode of parent.linkedFromNodes) {
+                if (!(fromLinks === null || fromLinks === void 0 ? void 0 : fromLinks.has(linkedFromNode))) {
+                    const cb = createCb(linkedFromNode, pathParent, callback);
+                    addLinkedNodeListeners(linkedFromNode, cb, parent);
+                }
+            }
+        }
+        pathParent = [parent.key, ...pathParent];
+        parent = parent.parent;
+    }
+    return () => {
+        listeners.delete(listener);
+        extraDisposes === null || extraDisposes === void 0 ? void 0 : extraDisposes.forEach((fn) => fn());
+    };
+}
+function createCb(linkedFromNode, path, callback) {
+    // Create a callback for a path that calls it with the current value at the path
+    let { valueAtPath: prevAtPath } = getValueAtPath(getNodeValue(linkedFromNode), path);
+    return function ({ value: valueA, loading, remote }) {
+        const { valueAtPath, pathTypes } = getValueAtPath(valueA, path);
+        if (valueAtPath !== prevAtPath) {
+            callback({
+                value: valueAtPath,
+                loading,
+                remote,
+                changes: [
+                    {
+                        path,
+                        pathTypes,
+                        prevAtPath,
+                        valueAtPath,
+                    },
+                ],
+                getPrevious: () => prevAtPath,
+            });
+        }
+        prevAtPath = valueAtPath;
+    };
+}
+function getValueAtPath(obj, path) {
+    let o = obj;
+    const pathTypes = [];
+    for (let i = 0; o && i < path.length; i++) {
+        pathTypes.push(isArray(o) ? 'array' : 'object');
+        const p = path[i];
+        o = o[p];
+    }
+    return { valueAtPath: o, pathTypes };
 }
 
 function setupTracking(nodes, update, noArgs, immediate) {
@@ -717,42 +925,39 @@ function updateTracking(node, track) {
 
 function trackSelector(selector, update, observeEvent, observeOptions, createResubscribe) {
     var _a;
-    let nodes;
-    let value;
     let dispose;
-    let tracker;
     let resubscribe;
     let updateFn = update;
-    if (isObservable(selector)) {
-        value = selector.peek();
-        dispose = selector.onChange(update);
-        resubscribe = createResubscribe ? selector.onChange(update) : undefined;
-    }
-    else {
-        // Compute the selector inside a tracking context
-        beginTracking();
-        value = selector ? computeSelector(selector, observeEvent, observeOptions === null || observeOptions === void 0 ? void 0 : observeOptions.fromComputed) : selector;
-        tracker = tracking.current;
-        nodes = tracker.nodes;
-        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) {
-                updateFn = tracker.traceUpdates(update);
-            }
-            // Clear tracing so it doesn't leak to other components
-            tracker.traceListeners = undefined;
-            tracker.traceUpdates = undefined;
-        }
+    beginTracking();
+    const value = selector ? computeSelector(selector, observeEvent, observeOptions === null || observeOptions === void 0 ? void 0 : observeOptions.fromComputed) : selector;
+    const tracker = tracking.current;
+    const nodes = tracker.nodes;
+    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) {
+            updateFn = tracker.traceUpdates(update);
+        }
+        // Clear tracing so it doesn't leak to other components
+        tracker.traceListeners = undefined;
+        tracker.traceUpdates = undefined;
     }
     if (!(observeEvent === null || observeEvent === void 0 ? void 0 : observeEvent.cancel)) {
         // Do tracing if it was requested
         // useSyncExternalStore doesn't subscribe until after the component mount.
         // We want to subscribe immediately so we don't miss any updates
         dispose = setupTracking(nodes, updateFn, false, observeOptions === null || observeOptions === void 0 ? void 0 : observeOptions.immediate);
-        resubscribe = createResubscribe ? () => setupTracking(nodes, updateFn) : undefined;
+        if (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {
+            resubscribe = createResubscribe
+                ? () => {
+                    dispose === null || dispose === void 0 ? void 0 : dispose();
+                    dispose = setupTracking(nodes, updateFn);
+                    return dispose;
+                }
+                : undefined;
+        }
     }
-    return { value, dispose, resubscribe };
+    return { nodes, value, dispose, resubscribe };
 }
 
 function observe(selectorOrRun, reactionOrOptions, options) {
@@ -777,9 +982,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;
@@ -787,7 +994,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
@@ -813,10 +1022,17 @@ function _when(predicate, effect, checkReady) {
         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)) {
+        if (isPromise(ret)) {
+            value = ret;
+            // We want value to be the Promise but return undefined
+            // so it doesn't run the effect with the Promise as the value
+            return undefined;
+        }
+        else if (!isPromise(ret) && (checkReady ? isObservableValueReady(ret) : ret)) {
             value = ret;
             // Set cancel so that observe does not track anymore
             e.cancel = true;
@@ -825,7 +1041,7 @@ function _when(predicate, effect, checkReady) {
     }
     function doEffect() {
         // If value is truthy then run the effect
-        effect === null || effect === void 0 ? void 0 : effect(value);
+        effectValue = effect === null || effect === void 0 ? void 0 : effect(value);
     }
     // Run in an observe
     observe(run, doEffect);
@@ -835,17 +1051,17 @@ function _when(predicate, effect, checkReady) {
         return effect ? value.then(effect) : value;
     }
     else if (value !== undefined) {
-        return Promise.resolve(value);
+        return effect ? effectValue : Promise.resolve(value);
     }
     else {
         // Wrap it in a promise
         const promise = new Promise((resolve) => {
             if (effect) {
                 const originalEffect = effect;
-                effect = (value) => {
+                effect = ((value) => {
                     const effectValue = originalEffect(value);
-                    resolve(effectValue);
-                };
+                    resolve(isPromise(effectValue) ? effectValue.then((value) => value) : effectValue);
+                });
             }
             else {
                 effect = resolve;
@@ -861,64 +1077,6 @@ function whenReady(predicate, effect) {
     return _when(predicate, effect, true);
 }
 
-function createObservable(value, makePrimitive, extractPromise, createObject, createPrimitive) {
-    const valueIsPromise = isPromise(value);
-    const valueIsFunction = isFunction(value);
-    const root = {
-        _: value,
-    };
-    let node = {
-        root,
-        lazy: true,
-    };
-    if (valueIsFunction) {
-        node = Object.assign(cloneFunction(value), node);
-    }
-    const prim = makePrimitive || isActualPrimitive(value);
-    const obs = prim
-        ? new createPrimitive(node)
-        : createObject(node);
-    if (valueIsPromise) {
-        setNodeValue(node, undefined);
-        extractPromise(node, value);
-    }
-    return obs;
-}
-
-function setupRetry(retryOptions, refresh, attemptNum) {
-    const timeout = {};
-    let didGiveUp = false;
-    const { backoff, delay = 1000, infinite, times = 3, maxDelay = 30000 } = retryOptions;
-    let handleError;
-    attemptNum.current++;
-    if (infinite || attemptNum.current < times) {
-        const delayTime = Math.min(delay * (backoff === 'constant' ? 1 : 2 ** attemptNum.current), maxDelay);
-        handleError = () => {
-            timeout.current = setTimeout(refresh, delayTime);
-        };
-    }
-    else {
-        handleError = () => {
-            didGiveUp = true;
-        };
-    }
-    if (typeof window !== 'undefined') {
-        window.addEventListener('online', () => {
-            if (didGiveUp || timeout) {
-                if (timeout) {
-                    clearTimeout(timeout.current);
-                    timeout.current = undefined;
-                }
-                // Restart the backoff when coming back online
-                attemptNum.current = 0;
-                didGiveUp = false;
-                refresh();
-            }
-        });
-    }
-    return { handleError, timeout };
-}
-
 const ArrayModifiers = new Set([
     'copyWithin',
     'fill',
@@ -937,9 +1095,9 @@ const ArrayLoopers = new Set([
     'find',
     'findIndex',
     'forEach',
-    'includes',
     'join',
     'map',
+    'reduce',
     'some',
 ]);
 const ArrayLoopersReturn = new Set(['filter', 'find']);
@@ -959,7 +1117,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 {
@@ -982,7 +1141,7 @@ 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;
+    var _a, _b, _c;
     if ((process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') &&
         typeof __devUpdateNodes !== 'undefined' &&
         isObject(obj)) {
@@ -1010,9 +1169,10 @@ function updateNodes(parent, obj, prevValue) {
     const isArr = isArray(obj);
     let prevChildrenById;
     let moved;
-    const isMap = obj instanceof Map;
-    const keys = getKeys(obj, isArr, isMap);
-    const keysPrev = getKeys(prevValue, isArr, isMap);
+    const isCurMap = isMap(obj);
+    const isPrevMap = isMap(prevValue);
+    const keys = getKeys(obj, isArr, isCurMap);
+    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;
@@ -1029,15 +1189,22 @@ function updateNodes(parent, obj, prevValue) {
                     isIdFieldFunction = isFunction(idField);
                     prevChildrenById = new Map();
                     moved = [];
-                    const keysSeen = process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test'
-                        ? new Set()
-                        : undefined;
-                    if (parent.children) {
-                        for (let i = 0; i < prevValue.length; i++) {
-                            const p = prevValue[i];
-                            if (p) {
-                                const child = parent.children.get(i + '');
-                                if (child) {
+                }
+                const keysSeen = process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test'
+                    ? new Set()
+                    : undefined;
+                if (parent.children) {
+                    for (let i = 0; i < prevValue.length; i++) {
+                        const p = prevValue[i];
+                        if (p) {
+                            const child = parent.children.get(i + '');
+                            if (child) {
+                                if (!obj[i]) {
+                                    // If the previous value is not in the new array and it
+                                    // is an activated, disable its listeners
+                                    handleDeletedChild(child, p);
+                                }
+                                if (idField) {
                                     const key = isIdFieldFunction
                                         ? idField(p)
                                         : p[idField];
@@ -1064,14 +1231,9 @@ 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);
-                    }
-                    if (child.listeners || child.listenersImmediate) {
-                        notify(child, undefined, prev, 0);
-                    }
+                    handleDeletedChild(child, prev);
                 }
             }
         }
@@ -1082,16 +1244,31 @@ 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 = isCurMap ? 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 = !equals(value, prev);
             if (isDiff) {
                 const id = idField && value
                     ? isIdFieldFunction
                         ? idField(value)
                         : value[idField]
                     : undefined;
-                let child = getChildNode(parent, key);
+                const existingChild = (_c = parent.children) === null || _c === void 0 ? void 0 : _c.get(key);
+                if (isObservable(value)) {
+                    const valueNode = getNode(value);
+                    if ((existingChild === null || existingChild === void 0 ? void 0 : existingChild.linkedToNode) === valueNode) {
+                        const targetValue = getNodeValue(valueNode);
+                        isCurMap ? obj.set(key, targetValue) : (obj[key] = targetValue);
+                        continue;
+                    }
+                    const obs = value;
+                    value = () => obs;
+                }
+                let child = getChildNode(parent, key, value);
+                if (!child.lazy && (isFunction(value) || isObservable(value))) {
+                    reactivateNode(child, value);
+                    peekInternal(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) {
@@ -1099,7 +1276,7 @@ function updateNodes(parent, obj, prevValue) {
                     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;
+                        // It does need to notify itself so isDiff should remain.
                         hasADiff = true;
                     }
                     else if (prevChild !== undefined && prevChild.key !== key) {
@@ -1121,7 +1298,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, key, value);
+                    }
+                    else if (isPrimitive(value)) {
                         hasADiff = true;
                     }
                     else {
@@ -1162,6 +1342,19 @@ function updateNodes(parent, obj, prevValue) {
     }
     return retValue !== null && retValue !== void 0 ? retValue : false;
 }
+function handleDeletedChild(child, p) {
+    var _a, _b;
+    // If the previous value is not in the new array and it
+    // is an activated, disable its listeners
+    (_a = child.linkedToNodeDispose) === null || _a === void 0 ? void 0 : _a.call(child);
+    (_b = child.activatedObserveDispose) === null || _b === void 0 ? void 0 : _b.call(child);
+    if (!isPrimitive(p)) {
+        updateNodes(child, undefined, p);
+    }
+    if (child.listeners || child.listenersImmediate) {
+        notify(child, undefined, p, 0);
+    }
+}
 function getProxy(node, p, asFunction) {
     // Get the child node if p prop
     if (p !== undefined)
@@ -1169,6 +1362,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;
@@ -1180,14 +1382,21 @@ const proxyHandler = {
         if (p === symbolGetNode) {
             return node;
         }
-        const value = peek(node);
+        if (p === 'apply') {
+            const nodeValue = getNodeValue(node);
+            if (isFunction(nodeValue)) {
+                return nodeValue.apply;
+            }
+        }
+        let value = peekInternal(node, /*activateRecursive*/ p === 'get');
         // 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') {
-            return proxyHandler.get(node.linkedToNode, p, receiver);
+        const targetNode = node.linkedToNode || (value === null || value === void 0 ? void 0 : value[symbolGetNode]);
+        if (targetNode && p !== 'onChange') {
+            return proxyHandler.get(targetNode, p, receiver);
         }
-        if (value instanceof Map || value instanceof WeakMap || value instanceof Set || value instanceof WeakSet) {
+        if (isMap(value) || value instanceof WeakMap || value instanceof Set || value instanceof WeakSet) {
             const ret = handlerMapSet(node, p, value);
             if (ret !== undefined) {
                 return ret;
@@ -1196,6 +1405,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.
@@ -1213,33 +1425,11 @@ 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);
         }
-        // TODOV3 Remove this
-        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;
-                }
-            }
-        }
-        // /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;
         }
@@ -1252,6 +1442,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)) {
@@ -1263,30 +1458,31 @@ const proxyHandler = {
                     // Update that this node was accessed for observers
                     updateTracking(node);
                     return function (cbOrig, thisArg) {
-                        // If callback needs to run on the observable proxies, use a wrapped callback
-                        function cbWrapped(_, index, array) {
-                            return cbOrig(getProxy(node, index + ''), index, array);
+                        const isReduce = p === 'reduce';
+                        // Callbacks are given the Proxy rather than the underlying data
+                        const cbWrapped = isReduce
+                            ? (previousValue, currentValue, currentIndex, array) => {
+                                return cbOrig(previousValue, getProxy(node, currentIndex + '', currentValue), currentIndex, array);
+                            }
+                            : (val, index, array) => {
+                                return cbOrig(getProxy(node, index + '', val), index, array);
+                            };
+                        if (isReduce || !ArrayLoopersReturn.has(p)) {
+                            return value[p](cbWrapped, thisArg);
                         }
-                        // If return value needs to be observable proxies, use our own looping logic and return the proxy when found
-                        if (ArrayLoopersReturn.has(p)) {
-                            const isFind = p === 'find';
-                            const out = [];
-                            for (let i = 0; i < value.length; i++) {
-                                if (cbWrapped(value[i], i, value)) {
-                                    const proxy = getProxy(node, i + '');
-                                    if (isFind) {
-                                        return proxy;
-                                    }
-                                    else {
-                                        out.push(proxy);
-                                    }
+                        const isFind = p === 'find';
+                        const out = [];
+                        for (let i = 0; i < value.length; i++) {
+                            if (cbWrapped(value[i], i, value)) {
+                                const proxy = getProxy(node, i + '');
+                                // find returns the first match, otherwise it returns an array
+                                if (isFind) {
+                                    return proxy;
                                 }
+                                out.push(proxy);
                             }
-                            return isFind ? undefined : out;
-                        }
-                        else {
-                            return value[p](cbWrapped, thisArg);
                         }
+                        return isFind ? undefined : out;
                     };
                 }
             }
@@ -1301,10 +1497,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);
     },
@@ -1314,12 +1506,13 @@ const proxyHandler = {
         return value !== null && typeof value === 'object' ? Reflect.getPrototypeOf(value) : null;
     },
     ownKeys(node) {
-        const value = getNodeValue(node);
+        // TODO: Temporary workaround to fix a bug - the first peek may not return the correct value
+        // if the value is a cached. This fixes the test "cache with initial ownKeys"
+        peekInternal(node);
+        const value = get(node, true);
         if (isPrimitive(value))
             return [];
         const keys = value ? Reflect.ownKeys(value) : [];
-        // Update that this node was accessed for observers
-        updateTracking(node, true);
         // This is required to fix this error:
         // TypeError: 'getOwnPropertyDescriptor' on proxy: trap reported non-configurability for
         // property 'length' which is either non-existent or configurable in the proxy node
@@ -1369,22 +1562,21 @@ 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) {
     if (node.parent) {
-        return setKey(node.parent, node.key, newValue);
+        setKey(node.parent, node.key, newValue);
     }
     else {
-        return setKey(node, '_', newValue);
+        setKey(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;
     }
     else if (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {
         throw new Error('[legend-state] Cannot toggle a non-boolean value');
@@ -1396,31 +1588,27 @@ 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) && !isFunction(newValue)) {
+        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);
+    const childNode = isRoot ? node : getChildNode(node, key, newValue);
+    if (isObservable(newValue)) {
+        setToObservable(childNode, newValue);
+    }
+    else {
+        // Set the raw value on the parent object
+        const { newValue: savedValue, prevValue } = setNodeValue(childNode, newValue);
+        const isPrim = isPrimitive(savedValue) || savedValue instanceof Date;
+        if (!equals(savedValue, prevValue)) {
+            updateNodesAndNotify(node, savedValue, prevValue, childNode, isPrim, isRoot, level);
+        }
+        if (!isPrim) {
+            childNode.needsExtract = true;
+        }
+        extractFunctionOrComputed(node, key, savedValue);
     }
-    extractFunctionOrComputed(node, parentValue, key, savedValue);
-    return isFunc ? savedValue : isRoot ? getProxy(node) : getProxy(node, key);
 }
 function assign(node, value) {
     const proxy = getProxy(node);
@@ -1428,13 +1616,22 @@ function assign(node, value) {
     if (isPrimitive(node.root._)) {
         node.root._ = {};
     }
-    // Set inAssign to allow setting on safe observables
-    node.isAssigning = (node.isAssigning || 0) + 1;
-    try {
-        Object.assign(proxy, value);
+    if (isMap(value)) {
+        const currentValue = getNodeValue(node);
+        if (isMap(currentValue)) {
+            value.forEach((value, key) => currentValue.set(key, value));
+        }
     }
-    finally {
-        node.isAssigning--;
+    else {
+        // Set inAssign to allow setting on safe observables
+        node.isAssigning = (node.isAssigning || 0) + 1;
+        try {
+            // TODO: If current value is a Map how to assign into the Map?
+            Object.assign(proxy, value);
+        }
+        finally {
+            node.isAssigning--;
+        }
     }
     endBatch();
     return proxy;
@@ -1445,7 +1642,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];
@@ -1470,6 +1673,9 @@ function handlerMapSet(node, p, value) {
                     }
                     return ret;
                 }
+                else if (l === 1 && isMap(value)) {
+                    set(node, a);
+                }
             }
             else if (p === 'delete') {
                 if (l > 0) {
@@ -1525,8 +1731,11 @@ 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();
+    if (isPrim === undefined) {
+        isPrim = isPrimitive(newValue);
+    }
     let hasADiff = isPrim;
     let whenOptimizedOnlyIf = false;
     // If new value is an object or array update notify down the tree
@@ -1546,7 +1755,7 @@ function updateNodesAndNotify(node, newValue, prevValue, childNode, isPrim, isRo
     }
     endBatch();
 }
-function extractPromise(node, value, setter, handleError) {
+function extractPromise(node, value, setter) {
     if (!node.state) {
         node.state = createObservable({
             isLoaded: false,
@@ -1562,30 +1771,29 @@ function extractPromise(node, value, setter, handleError) {
     })
         .catch((error) => {
         node.state.error.set(error);
-        if (handleError) {
-            handleError(error);
-        }
     });
 }
-function extractFunctionOrComputed(node, obj, k, v) {
+function extractFunctionOrComputed(node, k, v, activateRecursive) {
     if (isPromise(v)) {
         const childNode = getChildNode(node, k);
         extractPromise(childNode, v);
         setNodeValue(childNode, undefined);
     }
+    else if (isObservable(v)) {
+        const fn = () => v;
+        extractFunction(node, k, fn);
+        const childNode = getChildNode(node, k, fn);
+        const targetNode = getNode(v);
+        // Set node to target's value if activating or it's already activated
+        const initialValue = activateRecursive || !targetNode.lazy ? peekInternal(targetNode) : undefined;
+        setNodeValue(childNode, initialValue);
+    }
     else if (typeof v === 'function') {
         extractFunction(node, k, v);
-        delete obj[k];
     }
-    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;
-        }
+    else if (activateRecursive && typeof v == 'object' && v !== null && v !== undefined) {
+        const childNode = getChildNode(node, k);
+        checkLazy(childNode, v, activateRecursive);
     }
 }
 function get(node, options) {
@@ -1595,210 +1803,303 @@ function get(node, options) {
     return peek(node);
 }
 function peek(node) {
-    const value = getNodeValue(node);
+    const value = peekInternal(node, true);
+    return value;
+}
+function peekInternal(node, activateRecursive) {
+    if (node.dirtyFn) {
+        const dirtyFn = node.dirtyFn;
+        node.dirtyFn = undefined;
+        globalState.dirtyNodes.delete(node);
+        dirtyFn();
+    }
+    let value = getNodeValue(node);
+    value = checkLazy(node, value, !!activateRecursive);
+    return value;
+}
+function checkLazy(node, value, activateRecursive) {
     // 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(lazyFn)) {
+            if (lazyFn.length === 1) {
+                // This is a lookup function, so return a record object
+                value = {};
+            }
+            else {
+                if (node.parent) {
+                    const parentValue = getNodeValue(node.parent);
+                    if (parentValue) {
+                        delete parentValue[node.key];
+                    }
+                    else {
+                        node.root._ = undefined;
+                    }
+                }
+                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 || activateRecursive) {
+        for (const key in value) {
+            if (hasOwnProperty.call(value, key)) {
+                const property = Object.getOwnPropertyDescriptor(value, key);
+                if (property === null || property === void 0 ? void 0 : property.get) {
+                    delete value[key];
+                    value[key] = property.set
+                        ? linked({
+                            get: property.get,
+                            set: ({ value }) => property.set(value),
+                        })
+                        : property.get;
                 }
+                extractFunctionOrComputed(node, key, value[key], activateRecursive);
             }
         }
     }
-    // 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;
-        }
-        return new Promise((resolve) => {
-            const wait = () => {
-                if (node.state) {
-                    when(node.state.isLoadedLocal, () => {
-                        const dateModified = node.state.dateModified.get();
-                        resolve({ dateModified, value: peek(node) });
-                    });
-                }
-                else {
-                    queueMicrotask(wait);
-                }
-            };
-            wait();
-        });
-    };
-    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);
+    (_b = node.linkedToNodeDispose) === null || _b === void 0 ? void 0 : _b.call(node);
+    node.activatedObserveDispose = node.linkedToNodeDispose = 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;
     let wasPromise;
-    let timeoutRetry;
-    const attemptNum = { current: 0 };
-    const activator = (isFunction(node) ? node : lazyFn);
-    const refresh = () => node.state.refreshNum.set((v) => v + 1);
-    observe(() => {
-        const params = createNodeActivationParams(node);
+    let ignoreThisUpdate;
+    let isFirst = true;
+    const activateFn = lazyFn;
+    let activatedValue;
+    let disposes = [];
+    let refreshFn;
+    function markDirty() {
+        node.dirtyFn = refreshFn;
+        globalState.dirtyNodes.add(node);
+    }
+    node.activatedObserveDispose = observe(() => {
+        var _a, _b, _c, _d;
+        // Set it to undefined so that the activation function gets undefined
+        // if it peeks itself
+        if (isFirst) {
+            isFirst = false;
+            setNodeValue(node, undefined);
+        }
         // 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 = !isObservable(value)
+            ? value === null || value === void 0 ? void 0 : value[symbolLinked]
+            : undefined;
+        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 activateNodeFn = wasPromise ? globalState.activateNode : activateNodeBase;
-            update = activateNodeFn(node, refresh, !!wasPromise, value).update;
+            let activateNodeFn = activateNodeBase;
+            // If this is a Synced then run it through persistence instead of base
+            if (activated === null || activated === void 0 ? void 0 : activated.synced) {
+                activateNodeFn = globalState.activateSyncedNode;
+                ignoreThisUpdate = true;
+            }
+            const { update: newUpdate, value: newValue } = activateNodeFn(node, value);
+            update = newUpdate;
+            value = newValue !== null && newValue !== void 0 ? newValue : activated === null || activated === void 0 ? void 0 : activated.initial;
+        }
+        else if (node.activationState) {
+            const activated = node.activationState;
+            if ((_b = (_a = node.state) === null || _a === void 0 ? void 0 : _a.peek()) === null || _b === void 0 ? void 0 : _b.sync) {
+                node.state.sync();
+                ignoreThisUpdate = true;
+            }
+            else {
+                value = (_d = (_c = activated.get) === null || _c === void 0 ? void 0 : _c.call(activated)) !== null && _d !== void 0 ? _d : activated.initial;
+            }
         }
-        node.state.refreshNum.get();
+        // value is undefined if it's in a persisted retry
+        wasPromise = wasPromise || isPromise(value);
         return value;
-    }, ({ value }) => {
-        if (!globalState.isLoadingRemote$.peek()) {
-            if (wasPromise) {
-                const { retryOptions } = node.activationState;
-                let onError;
-                if (retryOptions) {
-                    if (timeoutRetry) {
-                        clearTimeout(timeoutRetry.current);
+    }, (e) => {
+        if (!ignoreThisUpdate) {
+            const { value, nodes, refresh } = e;
+            refreshFn = refresh;
+            if (!wasPromise || !globalState.isLoadingRemote) {
+                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);
+                        }
                     }
-                    const { handleError, timeout } = setupRetry(retryOptions, refresh, attemptNum);
-                    onError = handleError;
-                    timeoutRetry = timeout;
                 }
-                // Extract the promise to make it set the value/error when it comes in
-                extractPromise(node, value, update, onError);
-                // 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()) {
+                        node.isComputing = true;
+                        set(node, value);
+                        node.isComputing = false;
+                    }
+                    else {
+                        setNodeValue(node, value);
+                        node.state.assign({
+                            isLoaded: true,
+                            error: undefined,
+                        });
+                    }
                 }
             }
-            else {
-                set(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;
+function activateNodeBase(node, 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, refresh }), () => {
-                        isSetting = false;
-                    });
+    if (node.activationState) {
+        const { set: setFn, get: getFn, initial } = node.activationState;
+        value = getFn === null || getFn === void 0 ? void 0 : getFn();
+        if (value == undefined || value === null) {
+            value = initial;
+        }
+        if (setFn) {
+            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 loading = false;
+                    let remote = false;
+                    let getPrevious;
+                    if (listenerParams) {
+                        changes = listenerParams.changes;
+                        value = listenerParams.value;
+                        loading = listenerParams.loading;
+                        remote = listenerParams.remote;
+                        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;
+                        }
+                        node.isComputing = true;
+                        setFn({
+                            value,
+                            changes,
+                            loading,
+                            remote,
+                            getPrevious,
+                        });
+                        node.isComputing = false;
+                    };
+                    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 (!node.isComputing) {
+                    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);
+        }
     }
     const update = ({ value }) => {
-        // 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) {
+        if (!node.isComputing) {
+            node.isComputing = true;
             set(node, value);
+            node.isComputing = false;
         }
     };
-    if (subscriber) {
-        subscriber({ update, refresh });
+    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) {
+        node.linkedToNode = linkedNode;
+        linkedNode.linkedFromNodes || (linkedNode.linkedFromNodes = new Set());
+        linkedNode.linkedFromNodes.add(node);
+        (_a = node.linkedToNodeDispose) === null || _a === void 0 ? void 0 : _a.call(node);
+        node.linkedToNodeDispose = onChange(linkedNode, () => {
+            value = peek(linkedNode);
+            set(node, value);
+        }, { initial: true }, new Set([node]));
     }
-    return { update };
-});
+    return value;
+}
 
 const fns = ['get', 'set', 'peek', 'onChange', 'toggle'];
 function ObservablePrimitiveClass(node) {
@@ -1815,8 +2116,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
@@ -1828,13 +2135,12 @@ 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') {
         throw new Error('[legend-state] Cannot toggle a non-boolean value');
     }
-    return !value;
 };
 ObservablePrimitiveClass.prototype.delete = function () {
     this.set(undefined);
@@ -1847,92 +2153,22 @@ 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) {
+        peekInternal(node);
     }
-    return obs;
+    if (!node.state) {
+        node.state = observable({});
+    }
+    return node.state;
 }
 
-function configureLegendState({ observableFunctions, observableProperties: observableProperties$1, }) {
+function computed(get, set) {
+    return observable(set ? linked({ get: get, set: ({ value }) => set(value) }) : get);
+}
+
+function configureLegendState({ observableFunctions, observableProperties: observableProperties$1, jsonReplacer, jsonReviver, }) {
     if (observableFunctions) {
         for (const key in observableFunctions) {
             const fn = observableFunctions[key];
@@ -1957,6 +2193,12 @@ function configureLegendState({ observableFunctions, observableProperties: obser
             });
         }
     }
+    if (jsonReplacer) {
+        globalState.replacer = jsonReplacer;
+    }
+    if (jsonReviver) {
+        globalState.reviver = jsonReviver;
+    }
 }
 
 function event() {
@@ -1983,56 +2225,104 @@ 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 observable((key) => set
+        ? linked({
+            get: () => get(key),
+            set: ({ value }) => set(key, value),
+        })
+        : get(key));
+}
+
+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 { waitFor } = node.activationState;
+    const { retry } = state;
+    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;
                 });
-            }
-        }
-        return target;
-    };
-    return obs;
+            };
+            run();
+        });
+    }
+    return value;
 }
 
 const internal = {
+    createPreviousHandler,
+    clone,
     ensureNodeValue,
     findIDKey,
     get,
     getNode,
+    getNodeValue,
+    getPathType,
     getProxy,
+    getValueAtPath: getValueAtPath$1,
     globalState,
+    initializePathType,
     observableFns,
     optimized,
     peek,
+    runWithRetry,
+    safeParse,
+    safeStringify,
     set,
     setAtPath,
     setNodeValue,
-    setupRetry,
+    symbolLinked,
     symbolDelete,
+    tracking,
 };
 
 exports.ObservablePrimitiveClass = ObservablePrimitiveClass;
 exports.batch = batch;
 exports.beginBatch = beginBatch;
 exports.beginTracking = beginTracking;
-exports.checkActivate = checkActivate;
 exports.computeSelector = computeSelector;
 exports.computed = computed;
 exports.configureLegendState = configureLegendState;
@@ -2041,8 +2331,6 @@ 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;
@@ -2051,8 +2339,12 @@ exports.hasOwnProperty = hasOwnProperty;
 exports.internal = internal;
 exports.isArray = isArray;
 exports.isBoolean = isBoolean;
+exports.isDate = isDate;
 exports.isEmpty = isEmpty;
 exports.isFunction = isFunction;
+exports.isMap = isMap;
+exports.isNullOrUndefined = isNullOrUndefined;
+exports.isNumber = isNumber;
 exports.isObject = isObject;
 exports.isObservable = isObservable;
 exports.isObservableValueReady = isObservableValueReady;
@@ -2060,7 +2352,7 @@ exports.isPrimitive = isPrimitive;
 exports.isPromise = isPromise;
 exports.isString = isString;
 exports.isSymbol = isSymbol;
-exports.lockObservable = lockObservable;
+exports.linked = linked;
 exports.mergeIntoObservable = mergeIntoObservable;
 exports.observable = observable;
 exports.observablePrimitive = observablePrimitive;
@@ -2073,6 +2365,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;