@expressive/mvc 0.3.0 → 0.4.2

package/lib/index.esm.js

@@ -51,7 +51,7 @@ function suspend(source, key) {
         const release = source.addListener(forKey => {
             if (forKey == key)
                 return () => {
-                    if (source.state[key] !== undefined) {
+                    if (source.state.get(key) !== undefined) {
                         release();
                         resolve();
                     }
@@ -132,240 +132,37 @@ function createValueEffect(callback) {
     };
 }
 
-const UPDATE = new WeakMap();
-function applyUpdate(subject, keys) {
-    UPDATE.set(subject, keys);
-    return () => {
-        setTimeout(() => {
-            UPDATE.delete(subject);
-        }, 0);
-    };
-}
-function getUpdate(subject) {
-    return UPDATE.get(subject);
-}
-
-const CONTROL = Symbol("CONTROL");
-const WHY = Symbol("UPDATE");
-const LOCAL = Symbol("LOCAL");
-const STATE = Symbol("STATE");
-class Model {
-    constructor() {
-        define(this, CONTROL, new Controller(this));
-        define(this, "get", this);
-        define(this, "is", this);
-        defineLazy(this, "set", () => {
-            const controller = control(this);
-            const assign = (key, value) => {
-                controller.update(key, value);
-            };
-            for (const key of getOwnPropertyNames(controller.proxy))
-                define(assign, key, controller.ref(key));
-            return assign;
-        });
-    }
-    get [STATE]() {
-        return this[CONTROL].state;
-    }
-    get [WHY]() {
-        return UPDATE.get(this);
-    }
-    on(select, handler, squash, once) {
-        return control(this, control => {
-            if (typeof select == "function")
-                return control.addListener(select);
-            const selection = typeof select == "string" ? [select] :
-                !select.length ? getOwnPropertyNames(control.state) :
-                    select;
-            ensure(control, selection);
-            const callback = squash
-                ? () => {
-                    handler.call(this, getUpdate(this));
-                }
-                : () => {
-                    getUpdate(this)
-                        .filter(k => selection.includes(k))
-                        .forEach(k => {
-                        handler.call(this, control.state[k], k);
-                    });
-                };
-            const onEvent = once
-                ? () => {
-                    remove();
-                    callback();
-                }
-                : callback;
-            const remove = control.addListener(key => {
-                if (selection.includes(key))
-                    return onEvent;
-            });
-            return remove;
-        });
-    }
-    once(select, callback, squash) {
-        if (callback)
-            return this.on(select, callback, squash, true);
-        return new Promise(resolve => {
-            this.on(select, resolve, true, true);
-        });
+function ensure(subject, cb) {
+    let control = subject[CONTROL];
+    if (!control) {
+        control = new Controller(subject);
+        define(subject, CONTROL, control);
     }
-    effect(callback, select) {
-        const effect = createEffect(callback);
-        return control(this, control => {
-            let busy = false;
-            let inject = this.is;
-            const invoke = () => {
-                if (busy)
-                    return;
-                const output = mayRetry(() => {
-                    effect.call(inject, inject);
-                });
-                if (output instanceof Promise) {
-                    output.finally(() => busy = false);
-                    busy = true;
-                }
-            };
-            if (!select) {
-                const sub = new Subscriber(control, () => invoke);
-                inject = sub.proxy;
-                invoke();
-                return sub.commit();
-            }
-            invoke();
-            if (!select.length) {
-                control.onDestroy.add(invoke);
-                return () => {
-                    control.onDestroy.delete(invoke);
-                };
-            }
-            return control.addListener(key => {
-                if (select.includes(key))
-                    return invoke;
+    if (!control.state) {
+        const { waiting } = control;
+        if (cb) {
+            let done;
+            waiting.add(() => {
+                done = cb(control);
             });
-        });
-    }
-    // TODO: account for exotic properties
-    import(source, select) {
-        const { subject } = control(this);
-        if (!select)
-            select = getOwnPropertyNames(subject);
-        for (const key of select)
-            if (key in source)
-                this[key] = source[key];
-    }
-    export(subset) {
-        const { state } = control(this);
-        const output = {};
-        if (!subset)
-            subset = getOwnPropertyNames(state);
-        for (const key of subset)
-            output[key] = state[key];
-        return output;
-    }
-    update(arg, tag) {
-        const target = control(this);
-        if (typeof arg == "string") {
-            target.update(arg);
-            if (1 in arguments && arg in this) {
-                const method = this[arg];
-                if (typeof method == "function")
-                    if (typeof tag != "boolean")
-                        method.call(this, tag);
-                    else if (tag)
-                        method.call(this);
-            }
-            arg = undefined;
+            return () => done && done();
         }
-        return target.requestUpdate(arg);
-    }
-    /**
-     * Mark this instance for garbage-collection and send `willDestroy` event to all listeners.
-     */
-    destroy() {
-        control(this).stop();
-    }
-    toString() {
-        return this.constructor.name;
-    }
-    /**
-     * Creates a new instance of this controller.
-     *
-     * Beyond `new this(...)`, method will activate managed-state.
-     *
-     * @param args - arguments sent to constructor
-     */
-    static create(...args) {
-        const instance = new this(...args);
-        control(instance);
-        return instance;
-    }
-    /**
-     * Static equivalent of `x instanceof this`.
-     *
-     * Will determine if provided class is a subtype of this one.
-     */
-    static isTypeof(maybe) {
-        return (typeof maybe == "function" &&
-            maybe.prototype instanceof this);
-    }
-}
-
-class Subscriber {
-    constructor(target, onUpdate) {
-        this.onUpdate = onUpdate;
-        this.active = false;
-        this.dependant = new Set();
-        this.watch = {};
-        const parent = target instanceof Controller
-            ? target : control(target);
-        const subject = parent.subject;
-        const proxy = create(parent.proxy);
-        let reset;
-        define(proxy, LOCAL, this);
-        defineProperty(this, "proxy", {
-            configurable: true,
-            get() {
-                if (reset)
-                    setTimeout(reset, 0);
-                return proxy;
-            }
-        });
-        const release = parent.addListener(key => {
-            const handler = this.watch[key];
-            if (!handler || !this.active)
-                return;
-            if (typeof handler == "function")
-                handler();
-            const notify = this.onUpdate(key, parent);
-            const getWhy = () => {
-                const update = getUpdate(subject);
-                const applicable = update.filter(k => k in this.watch);
-                reset = applyUpdate(proxy, applicable);
-            };
-            if (notify) {
-                parent.requestUpdate(getWhy);
-                parent.requestUpdate(notify);
-            }
-        });
-        this.commit = () => {
-            this.active = true;
-            this.dependant.forEach(x => x.commit());
-            return this.release;
-        };
-        this.release = () => {
-            this.dependant.forEach(x => x.release());
-            release();
-        };
+        control.state = new Map();
+        for (const key in subject)
+            control.add(key);
+        const callback = Array.from(waiting);
+        waiting.clear();
+        for (const cb of callback)
+            cb();
     }
+    return cb ? cb(control) : control;
 }
 
 const Oops$a = issues({
     BadSource: (model, property, got) => `Bad from-instruction provided to ${model}.${property}. Expects an arrow-function or a Model as source. Got ${got}.`,
     PeerNotAllowed: (model, property) => `Attempted to use an instruction result (probably use or tap) as computed source for ${model}.${property}. This is not possible.`,
-    Failed: (parent, property, initial) => `An exception was thrown while ${initial ? "initializing" : "refreshing"} [${parent}.${property}].`,
-    Early: (property) => `Note: Computed values don't run until accessed, except when subscribed to. '${property}' getter may have run earlier than intended.`
+    Failed: (parent, property, initial) => `An exception was thrown while ${initial ? "initializing" : "refreshing"} [${parent}.${property}].`
 });
-const INIT = new WeakSet();
 const INFO = new WeakMap();
 const USED = new WeakMap();
 const KEYS = new WeakMap();
@@ -373,8 +170,8 @@ function from(source, arg1, arg2) {
     return apply(function from(key) {
         const parent = this;
         const { subject, state } = this;
+        const required = arg2 === true || arg1 === true;
         let getSource;
-        let required = arg2 === true || arg1 === true;
         if (typeof arg1 == "boolean")
             arg1 = undefined;
         // Easy mistake, using a peer, will always be unresolved.
@@ -382,7 +179,7 @@ function from(source, arg1, arg2) {
             throw Oops$a.PeerNotAllowed(subject, key);
         // replace source controller in-case it is different
         if (typeof source == "object")
-            getSource = () => control(source);
+            getSource = () => ensure(source);
         // specifically an arrow function (getter factory)
         else if (!source.prototype) {
             arg1 = source.call(subject, key);
@@ -391,21 +188,20 @@ function from(source, arg1, arg2) {
         // Regular function is too ambiguous so not allowed.
         else
             throw Oops$a.BadSource(subject, key, source);
-        let sub;
         const setter = arg1;
         const info = { key, parent, priority: 1 };
+        let sub;
         let register = USED.get(parent);
-        if (!register) {
-            register = new Map();
-            USED.set(parent, register);
-        }
+        if (!register)
+            USED.set(parent, register = new Map());
+        state.set(key, undefined);
         register.set(key, info);
         function compute(initial) {
             try {
                 return setter.call(sub.proxy, sub.proxy);
             }
             catch (err) {
-                Oops$a.Failed(subject, key, !!initial).warn();
+                Oops$a.Failed(subject, key, initial).warn();
                 throw err;
             }
         }
@@ -418,16 +214,17 @@ function from(source, arg1, arg2) {
                 console.error(e);
             }
             finally {
-                if (state[key] !== value) {
-                    parent.update(key, value);
+                if (state.get(key) !== value) {
+                    parent.state.set(key, value);
+                    parent.update(key);
                     return value;
                 }
             }
         }
         function defer(_key, from) {
-            let pending = KEYS.get(from.frame);
+            let pending = KEYS.get(from);
             if (!pending)
-                KEYS.set(from.frame, pending = []);
+                KEYS.set(from, pending = []);
             if (info.parent !== from)
                 update();
             else {
@@ -435,179 +232,362 @@ function from(source, arg1, arg2) {
                 pending.splice(after + 1, 0, update);
             }
         }
-        function create(early) {
-            sub = new Subscriber(getSource(), defer);
-            defineProperty(state, key, {
-                value: undefined,
-                writable: true
-            });
+        function create() {
+            const control = getSource();
+            sub = control.subscribe(defer);
             try {
-                return state[key] = compute(true);
+                const value = compute(true);
+                state.set(key, value);
+                return value;
             }
             catch (e) {
-                if (early)
-                    Oops$a.Early(key).warn();
                 throw e;
             }
             finally {
                 sub.commit();
-                for (const key in sub.watch) {
+                for (const key of control.state.keys()) {
                     const peer = register.get(key);
                     if (peer && peer.priority >= info.priority)
                         info.priority = peer.priority + 1;
                 }
             }
         }
-        INIT.add(create);
         INFO.set(update, info);
-        defineProperty(state, key, {
-            get: create,
-            configurable: true,
-            enumerable: true
-        });
         return () => {
-            const value = parent.state[key];
+            const value = sub ? state.get(key) : create();
             if (value === undefined && required)
                 throw suspend(this, key);
             return value;
         };
     });
 }
-function ensure(on, keys) {
-    for (const key of keys) {
-        const desc = getOwnPropertyDescriptor(on.state, key);
-        const getter = desc && desc.get;
-        if (INIT.has(getter))
-            getter(true);
-    }
-}
-function flush(frame) {
-    const pending = KEYS.get(frame);
+function flush(control) {
+    const pending = KEYS.get(control);
     if (!pending)
         return;
     while (pending.length) {
         const compute = pending.shift();
         const { key } = INFO.get(compute);
-        if (!frame.has(key))
+        if (!control.frame.has(key))
             compute();
     }
-    KEYS.delete(frame);
+    KEYS.delete(control);
 }
 
-const Oops$9 = issues({
-    StrictUpdate: () => `Strict update() did not find pending updates.`,
-    NoChaining: () => `Then called with undefined; update promise will never catch nor supports chaining.`
-});
-const PENDING = new Map();
-const READY = new WeakSet();
+class Subscriber {
+    constructor(parent, onUpdate) {
+        this.onUpdate = onUpdate;
+        this.active = false;
+        this.dependant = new Set();
+        const proxy = create(parent.subject);
+        const using = new Map();
+        define(proxy, LOCAL, this);
+        defineProperty(this, "proxy", {
+            configurable: true,
+            get() {
+                if (UPDATE.has(proxy))
+                    setTimeout(() => UPDATE.delete(proxy), 0);
+                return proxy;
+            }
+        });
+        const release = parent.addListener(key => {
+            if (!this.active || !using.has(key))
+                return;
+            const handler = using.get(key);
+            let notify;
+            if (typeof handler == "function") {
+                const callback = handler();
+                if (typeof callback == "function")
+                    notify = callback;
+                else if (callback === true)
+                    notify = this.onUpdate(key, parent);
+            }
+            else
+                notify = this.onUpdate(key, parent);
+            const getWhy = () => {
+                const update = getUpdate(parent.subject);
+                const applicable = update.filter(k => using.has(k));
+                UPDATE.set(proxy, applicable);
+            };
+            if (notify) {
+                parent.waiting.add(getWhy);
+                parent.waiting.add(notify);
+            }
+        });
+        this.commit = () => {
+            this.active = true;
+            this.dependant.forEach(x => x.commit());
+            return this.release;
+        };
+        this.release = () => {
+            this.dependant.forEach(x => x.release());
+            release();
+        };
+        this.add = (key, value) => {
+            if (value)
+                using.set(key, value);
+            else if (!using.has(key))
+                using.set(key, true);
+        };
+    }
+}
+
+const UPDATE = new WeakMap();
+function getUpdate(subject) {
+    return UPDATE.get(subject);
+}
 class Controller {
     constructor(subject) {
         this.subject = subject;
-        this.state = {};
         this.frame = new Set();
-        this.onDestroy = new Set();
         this.waiting = new Set();
         this.followers = new Set();
-        this.proxy = Object.create(subject);
-    }
-    start() {
-        READY.add(this);
-        for (const key in this.subject) {
-            const { value } = getOwnPropertyDescriptor(this.subject, key);
-            if (typeof value == "function")
-                continue;
-            if (typeof value == "symbol") {
-                const instruction = PENDING.get(value);
-                if (instruction)
-                    instruction.call(this, key, this);
-                continue;
-            }
-            this.manage(key, value);
-        }
-        this.flush();
     }
-    stop() {
-        this.followers.clear();
-        this.onDestroy.forEach(x => x());
+    subscribe(callback) {
+        return new Subscriber(this, callback);
     }
-    manage(key, value) {
-        const { state } = this;
-        const set = this.ref(key);
-        state[key] = value;
-        defineProperty(this.subject, key, {
-            enumerable: false,
-            get: () => state[key],
-            set
-        });
-        defineProperty(this.proxy, key, {
+    add(key) {
+        const { subject, state } = this;
+        const { value } = getOwnPropertyDescriptor(subject, key);
+        if (typeof value == "function")
+            return;
+        if (typeof value == "symbol") {
+            const instruction = PENDING.get(value);
+            if (instruction)
+                instruction.call(this, key, this);
+            return;
+        }
+        state.set(key, value);
+        defineProperty(subject, key, {
             enumerable: false,
+            set: this.ref(key),
             get() {
                 const local = this[LOCAL];
-                if (local && !local.watch[key])
-                    local.watch[key] = true;
-                return state[key];
-            },
-            set
+                if (local)
+                    local.add(key);
+                return state.get(key);
+            }
         });
     }
+    addListener(listener) {
+        this.followers.add(listener);
+        return () => {
+            this.followers.delete(listener);
+        };
+    }
     ref(key, handler) {
-        const { state, subject } = this;
+        const { subject, state } = this;
         return (value) => {
-            if (state[key] == value)
+            if (state.get(key) == value)
                 return;
             if (handler)
-                switch (handler.call(subject, value, state)) {
+                switch (handler.call(subject, value)) {
                     case true:
                         this.update(key);
                     case false:
                         return;
                 }
-            this.update(key, value);
-        };
-    }
-    addListener(listener) {
-        this.followers.add(listener);
-        return () => {
-            this.followers.delete(listener);
+            state.set(key, value);
+            this.update(key);
         };
     }
-    update(key, value) {
-        const { frame } = this;
-        if (1 in arguments)
-            this.state[key] = value;
-        if (!frame.size)
+    update(key) {
+        const { followers, frame, subject, waiting } = this;
+        if (frame.has(key))
+            return;
+        else if (!frame.size)
             setTimeout(() => {
-                flush(frame);
-                this.flush();
+                flush(this);
+                const callback = Array.from(waiting);
+                const keys = Array.from(frame);
+                frame.clear();
+                waiting.clear();
+                UPDATE.set(subject, keys);
+                setTimeout(() => {
+                    UPDATE.delete(subject);
+                }, 0);
+                for (const cb of callback)
+                    try {
+                        cb();
+                    }
+                    catch (err) {
+                        console.error(err);
+                    }
             }, 0);
-        else if (frame.has(key))
-            return;
         frame.add(key);
-        for (const callback of this.followers) {
+        for (const callback of followers) {
             const event = callback(key, this);
             if (typeof event == "function")
-                this.waiting.add(event);
+                waiting.add(event);
         }
     }
-    flush() {
-        const waiting = Array.from(this.waiting);
-        const keys = Array.from(this.frame);
-        this.frame.clear();
-        this.waiting.clear();
-        applyUpdate(this.subject, keys)();
-        for (const callback of waiting)
-            try {
-                callback();
-            }
-            catch (err) {
-                console.error(err);
+    clear() {
+        const listeners = [...this.followers];
+        this.followers.clear();
+        listeners.forEach(x => x(null, this));
+    }
+}
+
+const Oops$9 = issues({
+    Timeout: (keys, timeout) => `No update for [${keys}] within ${timeout}.`,
+    StrictUpdate: () => `Strict update() did not find pending updates.`,
+    NoChaining: () => `Then called with undefined; update promise will never catch nor supports chaining.`
+});
+const CONTROL = Symbol("CONTROL");
+const WHY = Symbol("UPDATE");
+const LOCAL = Symbol("LOCAL");
+const STATE = Symbol("STATE");
+class Model {
+    constructor() {
+        define(this, CONTROL, new Controller(this));
+        define(this, "get", this);
+        define(this, "is", this);
+        defineLazy(this, "set", () => {
+            const controller = ensure(this);
+            const assign = (key, value) => {
+                controller.state.set(key, value);
+                controller.update(key);
+            };
+            for (const key of controller.state.keys())
+                define(assign, key, controller.ref(key));
+            return assign;
+        });
+    }
+    get [STATE]() {
+        return this.export();
+    }
+    get [WHY]() {
+        return UPDATE.get(this);
+    }
+    on(select, handler, squash, once) {
+        return ensure(this, control => {
+            if (typeof select == "function")
+                return control.addListener(select);
+            const keys = typeof select == "string" ? [select] :
+                select.length ? select : [...control.state.keys()];
+            for (const key of keys)
+                try {
+                    void this[key];
+                }
+                catch (e) { }
+            const callback = squash
+                ? () => {
+                    handler.call(this, getUpdate(this));
+                }
+                : () => {
+                    getUpdate(this)
+                        .filter(k => keys.includes(k))
+                        .forEach(k => {
+                        handler.call(this, control.state.get(k), k);
+                    });
+                };
+            const onEvent = once
+                ? () => {
+                    remove();
+                    callback();
+                }
+                : callback;
+            const remove = control.addListener(key => {
+                if (keys.includes(key))
+                    return onEvent;
+            });
+            return remove;
+        });
+    }
+    once(select, argument, squash) {
+        if (typeof argument == "function")
+            return this.on(select, argument, squash, true);
+        if (typeof select == "string")
+            select = [select];
+        return new Promise((resolve, reject) => {
+            const invoke = (key) => {
+                if (!key) {
+                    clear();
+                    reject(Oops$9.Timeout(select, typeof argument == "number"
+                        ? `${argument}ms`
+                        : `lifetime of ${this}`));
+                }
+                else if (select.includes(key)) {
+                    clear();
+                    return resolve;
+                }
+            };
+            const clear = ensure(this, x => {
+                for (const key of select)
+                    try {
+                        void this[key];
+                    }
+                    catch (e) { }
+                return x.addListener(invoke);
+            });
+            if (typeof argument == "number")
+                setTimeout(invoke, argument);
+        });
+    }
+    effect(callback, select) {
+        const effect = createEffect(callback);
+        return ensure(this, control => {
+            let busy = false;
+            let inject = this.is;
+            const invoke = () => {
+                if (busy)
+                    return;
+                const output = mayRetry(() => {
+                    effect.call(inject, inject);
+                });
+                if (output instanceof Promise) {
+                    output.finally(() => busy = false);
+                    busy = true;
+                }
+            };
+            if (!select) {
+                const sub = control.subscribe(() => invoke);
+                inject = sub.proxy;
+                invoke();
+                return sub.commit();
             }
+            invoke();
+            return control.addListener(key => {
+                if (key === null) {
+                    if (!select.length)
+                        invoke();
+                }
+                else if (select.includes(key))
+                    return invoke;
+            });
+        });
     }
-    requestUpdate(arg) {
-        const { frame, subject, waiting } = this;
-        if (typeof arg == "function") {
-            waiting.add(arg);
-            return;
+    // TODO: account for exotic properties
+    import(source, select) {
+        const { subject } = ensure(this);
+        if (!select)
+            select = getOwnPropertyNames(subject);
+        for (const key of select)
+            if (key in source)
+                this[key] = source[key];
+    }
+    export(subset) {
+        const { state } = ensure(this);
+        const output = {};
+        const keys = subset || state.keys();
+        for (const key of keys)
+            output[key] = state.get(key);
+        return output;
+    }
+    update(arg, tag) {
+        const target = ensure(this);
+        const { frame, waiting } = target;
+        if (typeof arg == "string") {
+            target.update(arg);
+            if (1 in arguments && arg in this) {
+                const method = this[arg];
+                if (typeof method == "function")
+                    if (typeof tag != "boolean")
+                        method.call(this, tag);
+                    else if (tag)
+                        method.call(this);
+            }
+            arg = undefined;
         }
         if (!frame.size && arg === true)
             return Promise.reject(Oops$9.StrictUpdate());
@@ -617,37 +597,51 @@ class Controller {
                     throw Oops$9.NoChaining();
                 if (frame.size || arg !== false)
                     waiting.add(() => {
-                        callback(getUpdate(subject));
+                        callback(getUpdate(this));
                     });
                 else
                     callback(false);
             }
         };
     }
-}
-function control(subject, cb) {
-    let control = subject[CONTROL];
-    if (!control) {
-        control = new Controller(subject);
-        define(subject, CONTROL, control);
+    /**
+     * Mark this instance for garbage-collection and send `willDestroy` event to all listeners.
+     */
+    destroy() {
+        ensure(this).clear();
     }
-    const ready = READY.has(control);
-    if (!ready) {
-        if (cb) {
-            let done;
-            control.requestUpdate(() => done = cb(control));
-            return () => done && done();
-        }
-        control.start();
+    toString() {
+        return this.constructor.name;
+    }
+    /**
+     * Creates a new instance of this controller.
+     *
+     * Beyond `new this(...)`, method will activate managed-state.
+     *
+     * @param args - arguments sent to constructor
+     */
+    static create(...args) {
+        const instance = new this(...args);
+        ensure(instance);
+        return instance;
+    }
+    /**
+     * Static equivalent of `x instanceof this`.
+     *
+     * Will determine if provided class is a subtype of this one.
+     */
+    static isTypeof(maybe) {
+        return (typeof maybe == "function" &&
+            maybe.prototype instanceof this);
     }
-    return cb ? cb(control) : control;
 }
 
+const PENDING = new Map();
 function apply(fn, label) {
     const name = label || fn.name || "pending";
     const placeholder = Symbol(`${name} instruction`);
     function setup(key) {
-        const { proxy, state, subject } = this;
+        const { subject, state } = this;
         const control = this;
         PENDING.delete(placeholder);
         delete subject[key];
@@ -661,67 +655,56 @@ function apply(fn, label) {
             return false;
         }
         if ("recursive" in output && output.recursive)
-            output = Object.assign(Object.assign({}, output), { get: recursive(this, key) });
+            output = Object.assign(Object.assign({}, output), { get: getRecursive(key, this) });
         const desc = output;
         if ("value" in desc)
-            state[key] = desc.value;
+            state.set(key, desc.value);
         const { get: onGet, set: onSet, enumerable, suspense } = desc;
-        let set = onSet === false
-            ? undefined
-            : this.ref(key, onSet);
+        const set = onSet !== false
+            ? this.ref(key, onSet)
+            : undefined;
         function get() {
-            if (!(key in state) && suspense)
+            if (!state.has(key) && suspense)
                 throw suspend(control, key);
             const local = this[LOCAL];
-            if (local && !(key in local.watch))
-                local.watch[key] = true;
-            const value = state[key];
-            if (!onGet)
-                return value;
-            return local
-                ? onGet(value, local)
-                : onGet(value);
+            if (local)
+                local.add(key);
+            return onGet
+                ? onGet(local)
+                : state.get(key);
         }
-        for (const x of [subject, proxy])
-            defineProperty(x, key, { enumerable, get, set });
+        defineProperty(subject, key, { enumerable, get, set });
     }
     PENDING.set(placeholder, setup);
     return placeholder;
 }
-function recursive(source, key) {
-    return forSubscriber((parent, context) => {
-        let child;
-        function init() {
-            if (child) {
-                child.release();
-                parent.dependant.delete(child);
-                context.set(parent, undefined);
-                child = undefined;
-            }
-            const value = source.state[key];
-            if (value && CONTROL in value) {
-                child = new Subscriber(value, parent.onUpdate);
-                if (parent.active)
-                    child.commit();
-                parent.dependant.add(child);
-                context.set(parent, child.proxy);
-            }
-        }
-        init();
-        parent.watch[key] = init;
-    });
-}
-function forSubscriber(fn) {
+function getRecursive(key, from) {
     const context = new WeakMap();
-    return (value, local) => {
+    const { state } = from;
+    return (local) => {
         if (!local)
-            return value;
+            return state.get(key);
         if (!context.has(local)) {
-            const output = fn(local, context);
-            if (output) {
-                context.set(local, output);
-                return output;
-            }
+            let child;
+            const init = () => {
+                if (child) {
+                    child.release();
+                    local.dependant.delete(child);
+                    context.set(local, undefined);
+                    child = undefined;
+                }
+                const value = state.get(key);
+                if (value && CONTROL in value) {
+                    child = ensure(value).subscribe(local.onUpdate);
+                    if (local.active)
+                        child.commit();
+                    local.dependant.add(child);
+                    context.set(local, child.proxy);
+                }
+                return true;
+            };
+            init();
+            local.add(key, init);
         }
         return context.get(local);
     };
@@ -746,7 +729,7 @@ function act(task) {
                 this.update(key);
             }
         });
-        this.state[key] = undefined;
+        this.state.set(key, undefined);
         defineProperty(invoke, "active", {
             get: () => pending
         });
@@ -767,7 +750,7 @@ class Managed extends Array {
         };
     }
     push(...items) {
-        const length = this.length;
+        const { length } = this;
         const end = super.push(...items);
         this.update(length, end);
         return end;
@@ -778,64 +761,65 @@ class Managed extends Array {
         return end;
     }
     splice(start, deleteCount, ...rest) {
-        this.update(start, deleteCount !== rest.length ? Infinity : deleteCount);
+        const end = deleteCount !== rest.length ? Infinity : deleteCount;
+        this.update(start, end);
         return super.splice(start, deleteCount, ...rest);
     }
 }
 function array() {
     return apply(function array(key) {
+        const context = new WeakMap();
         const array = new Managed(() => this.update(key));
-        const access = forSubscriber(context => {
-            const local = Object.create(array);
-            const update = context.onUpdate(key, this);
+        const getLocal = (context) => {
+            const proxy = Object.create(array);
             let rangeA = 0;
             let rangeB = 0;
-            function onUpdate() {
+            const onUpdate = () => {
                 const [lastA, lastB] = array.lastUpdate;
                 if (rangeA <= lastB && rangeB >= lastA)
-                    return update;
-            }
-            function listen(eventA, eventB) {
+                    return true;
+            };
+            const listen = (eventA, eventB) => {
                 if (context.active)
                     return;
-                context.watch[key] = onUpdate;
+                context.add(key, onUpdate);
                 rangeA = Math.min(rangeA, eventA);
                 rangeB = Math.max(rangeB, eventB);
-            }
-            local[Symbol.iterator] = () => {
+            };
+            proxy[Symbol.iterator] = () => {
                 listen(0, Infinity);
                 return array[Symbol.iterator]();
             };
-            return local;
-        });
+            return proxy;
+        };
         return {
-            get: access,
+            value: array,
             set: false,
-            value: array
+            get: (local) => {
+                if (!local)
+                    return this.state.get(key);
+                if (context.has(local))
+                    return context.get(local);
+                const output = getLocal(local);
+                context.set(local, output);
+                return output;
+            }
         };
     });
 }
 
-function ref(arg) {
+function ref(callback) {
     return apply(function ref(key) {
-        let value = {};
-        if (typeof arg == "object") {
-            const source = control(arg);
-            for (const key in source.state)
-                defineLazy(value, key, createRef.bind(source, key));
-        }
-        else
-            value = createRef.call(this, key, arg);
-        return { value, explicit: true };
-    });
-}
-function createRef(key, cb) {
-    const refObjectFunction = this.ref(key, cb && createValueEffect(cb));
-    defineProperty(refObjectFunction, "current", {
-        set: refObjectFunction,
-        get: () => this.state[key]
+        const value = this.ref(key, callback && createValueEffect(callback));
+        defineProperty(value, "current", {
+            set: value,
+            get: () => this.state.get(key)
+        });
+        return {
+            value,
+            explicit: true
+        };
     });
-    return refObjectFunction;
 }
 
 const Oops$7 = issues({
@@ -858,14 +842,18 @@ function put(factory, argument) {
             if (output instanceof Promise) {
                 pending = output
                     .catch(err => error = err)
-                    .then(val => state[key] = val)
+                    .then(val => {
+                    state.set(key, val);
+                    return val;
+                })
                     .finally(() => {
                     pending = undefined;
                     this.update(key);
                 });
                 return;
             }
-            return state[key] = output;
+            state.set(key, output);
+            return output;
         };
         const suspend = () => {
             if (required === false)
@@ -890,8 +878,8 @@ function put(factory, argument) {
                 return suspend();
             if (error)
                 throw error;
-            if (key in state)
-                return state[key];
+            if (state.has(key))
+                return state.get(key);
             let output = init();
             return pending
                 ? suspend()
@@ -918,7 +906,7 @@ function set(value, argument) {
     }
     return apply(function set(key) {
         if (value !== undefined)
-            this.state[key] = value;
+            this.state.set(key, value);
         return {
             suspense: true,
             set: typeof argument == "function"
@@ -948,35 +936,234 @@ function parent(Expects, required) {
     });
 }
 
+const ANY$1 = Symbol("any");
+function managedMap(control, property, initial) {
+    const lastUpdate = new Set();
+    const context = new WeakMap();
+    const assoc = new WeakMap();
+    let managed;
+    let value;
+    function reset() {
+        lastUpdate.clear();
+    }
+    function emit(key) {
+        lastUpdate.add(key);
+        control.update(property);
+        control.waiting.add(reset);
+    }
+    function setValue(next, initial) {
+        value = next;
+        managed = create(next);
+        control.state.set(property, next);
+        if (!initial)
+            emit(ANY$1);
+        const watch = (key, on) => {
+            const local = assoc.get(on);
+            if (local)
+                local(key);
+        };
+        managed.set = (k, v) => {
+            emit(k);
+            return value.set(k, v);
+        };
+        managed.delete = (k) => {
+            emit(k);
+            return value.delete(k);
+        };
+        managed.clear = () => {
+            emit(ANY$1);
+            value.clear();
+        };
+        managed.get = function (key) {
+            watch(key, this);
+            return value.get(key);
+        };
+        managed.has = function (key) {
+            watch(key, this);
+            return value.has(key);
+        };
+        managed.values = function () {
+            watch(ANY$1, this);
+            return value.values();
+        };
+        managed.keys = function () {
+            watch(ANY$1, this);
+            return value.keys();
+        };
+        managed.entries = function () {
+            watch(ANY$1, this);
+            return value.entries();
+        };
+        managed[Symbol.iterator] = function () {
+            watch(ANY$1, this);
+            return value[Symbol.iterator]();
+        };
+        defineProperty(managed, "size", {
+            get() {
+                watch(ANY$1, this);
+                return value.size;
+            }
+        });
+    }
+    function getValue(local) {
+        if (!local)
+            return managed;
+        if (context.has(local))
+            return context.get(local);
+        const refresh = local.onUpdate(property, control);
+        const proxy = Object.create(managed);
+        const using = new Set();
+        const update = () => {
+            if (using.has(ANY$1) || lastUpdate.has(ANY$1) && using.size)
+                refresh();
+            else
+                for (const key of lastUpdate)
+                    if (using.has(key)) {
+                        refresh();
+                        break;
+                    }
+        };
+        context.set(local, proxy);
+        assoc.set(proxy, (key) => {
+            if (!local.active)
+                using.add(key);
+        });
+        local.add(property, () => update);
+        return proxy;
+    }
+    setValue(initial, true);
+    return {
+        set: setValue,
+        get: getValue
+    };
+}
+
+const ANY = Symbol("any");
+function managedSet(control, property, initial) {
+    const lastUpdate = new Set();
+    const context = new WeakMap();
+    const assoc = new WeakMap();
+    let managed;
+    let value;
+    function reset() {
+        lastUpdate.clear();
+    }
+    function emit(key) {
+        lastUpdate.add(key);
+        control.update(property);
+        control.waiting.add(reset);
+    }
+    function setValue(next, initial) {
+        value = next;
+        managed = create(next);
+        control.state.set(property, next);
+        if (!initial)
+            emit(ANY);
+        const watch = (key, on) => {
+            const local = assoc.get(on);
+            if (local)
+                local(key);
+        };
+        managed.add = (k) => {
+            emit(k);
+            return value.add(k);
+        };
+        managed.delete = (k) => {
+            emit(k);
+            return value.delete(k);
+        };
+        managed.clear = () => {
+            emit(ANY);
+            value.clear();
+        };
+        managed.has = function (key) {
+            watch(key, this);
+            return value.has(key);
+        };
+        managed.values = function () {
+            watch(ANY, this);
+            return value.values();
+        };
+        managed.keys = function () {
+            watch(ANY, this);
+            return value.keys();
+        };
+        managed.entries = function () {
+            watch(ANY, this);
+            return value.entries();
+        };
+        managed[Symbol.iterator] = function () {
+            watch(ANY, this);
+            return value[Symbol.iterator]();
+        };
+        defineProperty(managed, "size", {
+            get() {
+                watch(ANY, this);
+                return value.size;
+            }
+        });
+    }
+    function getValue(local) {
+        if (!local)
+            return managed;
+        if (context.has(local))
+            return context.get(local);
+        const refresh = local.onUpdate(property, control);
+        const proxy = Object.create(managed);
+        const using = new Set();
+        const update = () => {
+            if (using.has(ANY) || lastUpdate.has(ANY) && using.size)
+                refresh();
+            else
+                for (const key of lastUpdate)
+                    if (using.has(key)) {
+                        refresh();
+                        break;
+                    }
+        };
+        context.set(local, proxy);
+        assoc.set(proxy, (key) => {
+            if (!local.active)
+                using.add(key);
+        });
+        local.add(property, () => update);
+        return proxy;
+    }
+    setValue(initial, true);
+    return {
+        set: setValue,
+        get: getValue
+    };
+}
+
 const Oops$5 = issues({
     BadArgument: (type) => `Instruction \`use\` cannot accept argument type of ${type}.`,
 });
 function use$1(input, argument) {
     return apply(function use(key) {
-        const { subject } = this;
-        const onUpdate = (next) => {
-            this.state[key] = next;
+        const { state, subject } = this;
+        if (typeof input === "function")
+            input = Model.isTypeof(input)
+                ? new input()
+                : input();
+        else if (input && typeof input !== "object")
+            throw Oops$5.BadArgument(typeof input);
+        if (input instanceof Map)
+            return managedMap(this, key, input);
+        if (input instanceof Set)
+            return managedSet(this, key, input);
+        function onUpdate(next) {
+            state.set(key, next);
             if (next) {
                 Parent.set(next, subject);
-                control(next);
+                ensure(next);
             }
             if (typeof argument == "function")
                 argument(next);
             return true;
-        };
-        if (input) {
-            const value = Model.isTypeof(input)
-                ? new input() :
-                typeof input === "object"
-                    ? input :
-                    typeof input === "function"
-                        ? input()
-                        : null;
-            if (value === null)
-                throw Oops$5.BadArgument(typeof input);
-            if (value)
-                onUpdate(value);
         }
+        if (input)
+            onUpdate(input);
         return {
             set: onUpdate,
             recursive: true
@@ -1088,7 +1275,8 @@ function tap(type, argument) {
             }
             else if (!instance && argument)
                 throw Oops$3.AmbientRequired(type.name, subject, key);
-            this.update(key, instance);
+            this.state.set(key, instance);
+            this.update(key);
         });
         return {
             recursive: true,
@@ -1133,7 +1321,7 @@ function useModel(source, arg, arg2) {
                 new source() :
                 source() :
             source;
-        control(instance);
+        ensure(instance);
         if (typeof cb == "function")
             cb(instance);
         return instance;
@@ -1151,7 +1339,7 @@ function useModel(source, arg, arg2) {
         return instance;
     }
     else {
-        const local = use(refresh => (new Subscriber(instance, () => refresh)));
+        const local = use(refresh => (ensure(instance).subscribe(() => refresh)));
         if (typeof arg == "object") {
             local.active = false;
             if (typeof arg2 !== "object")
@@ -1177,7 +1365,7 @@ function useModel(source, arg, arg2) {
 
 function useFrom(target, compute, suspend) {
     const local = use(refresh => {
-        const sub = new Subscriber(target, () => update);
+        const sub = ensure(target).subscribe(() => update);
         const spy = sub.proxy;
         let value = compute.call(spy, spy);
         let update;
@@ -1229,23 +1417,14 @@ function useTap(source, path, expect) {
     }, [])();
     if (typeof path == "function")
         return useFrom(instance, path, expect);
-    const local = use(refresh => {
-        const parent = control(instance);
-        const sub = new Subscriber(parent, () => refresh);
-        if (typeof path == "string") {
-            const source = sub.proxy;
-            defineProperty(sub, "proxy", {
-                get() {
-                    const value = source[path];
-                    if (value === undefined && expect)
-                        throw suspend(parent, path);
-                    return value;
-                }
-            });
-        }
-        return sub;
-    });
+    const local = use(refresh => (ensure(instance).subscribe(() => refresh)));
     React.useLayoutEffect(local.commit, []);
+    if (typeof path !== "undefined") {
+        const value = local.proxy[path];
+        if (value === undefined && expect)
+            throw suspend(ensure(instance), path);
+        return value;
+    }
     return local.proxy;
 }
 
@@ -1266,7 +1445,7 @@ class MVC extends Model {
     static new(arg) {
         const instance = React.useMemo(() => {
             const instance = new this();
-            control(instance);
+            ensure(instance);
             if (typeof arg == "function")
                 arg(instance);
             else if (arg)
@@ -1351,7 +1530,7 @@ function useAppliedProps(within, props) {
         const targets = within.local;
         return function integrate(props) {
             for (const [key, value] of entries(props))
-                if (["of", "for", "children"].indexOf(key) < 0)
+                if (!["of", "for", "children"].includes(key))
                     for (const into of targets)
                         if (into && key in into)
                             into[key] = value;
@@ -1363,7 +1542,7 @@ function RenderFunction(props) {
     const hook = use(refresh => {
         const targets = props.context.local;
         if (targets.length == 1)
-            return new Subscriber(targets[0], () => refresh);
+            return ensure(targets[0]).subscribe(() => refresh);
         return {};
     });
     if (hook.commit)