@esportsplus/reactivity 0.16.6 → 0.17.0

package/build/system.js

@@ -1,4 +1,4 @@
-import { isArray, isObject } from '@esportsplus/utilities';
+import { isObject } from '@esportsplus/utilities';
 import { COMPUTED, SIGNAL, STABILIZER_IDLE, STABILIZER_RESCHEDULE, STABILIZER_RUNNING, STABILIZER_SCHEDULED, STATE_CHECK, STATE_DIRTY, STATE_IN_HEAP, STATE_NONE, STATE_NOTIFY_MASK, STATE_RECOMPUTING } from './constants.js';
 let depth = 0, heap = new Array(64), heap_i = 0, heap_n = 0, microtask = queueMicrotask, notified = false, observer = null, scope = null, stabilizer = STABILIZER_IDLE, version = 0;
 function cleanup(computed) {
@@ -6,14 +6,14 @@ function cleanup(computed) {
         return;
     }
     let value = computed.cleanup;
-    if (isArray(value)) {
+    if (typeof value === 'function') {
+        value();
+    }
+    else {
         for (let i = 0, n = value.length; i < n; i++) {
             value[i]();
         }
     }
-    else {
-        value();
-    }
     computed.cleanup = null;
 }
 function deleteFromHeap(computed) {
@@ -64,20 +64,20 @@ function insertIntoHeap(computed) {
 }
 function link(dep, sub) {
     let prevDep = sub.depsTail;
-    if (prevDep !== null && prevDep.dep === dep) {
+    if (prevDep && prevDep.dep === dep) {
         return;
     }
     let nextDep = null;
     if (sub.state & STATE_RECOMPUTING) {
-        nextDep = prevDep !== null ? prevDep.nextDep : sub.deps;
-        if (nextDep !== null && nextDep.dep === dep) {
+        nextDep = prevDep ? prevDep.nextDep : sub.deps;
+        if (nextDep && nextDep.dep === dep) {
             nextDep.version = version;
             sub.depsTail = nextDep;
             return;
         }
     }
     let prevSub = dep.subsTail;
-    if (prevSub !== null &&
+    if (prevSub &&
         prevSub.version === version &&
         prevSub.sub === sub) {
         return;
@@ -91,13 +91,13 @@ function link(dep, sub) {
             nextSub: null,
             version
         };
-    if (prevDep !== null) {
+    if (prevDep) {
         prevDep.nextDep = newLink;
     }
     else {
         sub.deps = newLink;
     }
-    if (prevSub !== null) {
+    if (prevSub) {
         prevSub.nextSub = newLink;
     }
     else {
@@ -110,7 +110,7 @@ function notify(computed, newState = STATE_DIRTY) {
         return;
     }
     computed.state = state | newState;
-    for (let link = computed.subs; link !== null; link = link.nextSub) {
+    for (let link = computed.subs; link; link = link.nextSub) {
         notify(link.sub, STATE_CHECK);
     }
 }
@@ -140,12 +140,12 @@ function recompute(computed, del) {
     depth--;
     observer = o;
     computed.state = STATE_NONE;
-    let depsTail = computed.depsTail, remove = depsTail !== null ? depsTail.nextDep : computed.deps;
-    if (remove !== null) {
+    let depsTail = computed.depsTail, remove = depsTail ? depsTail.nextDep : computed.deps;
+    if (remove) {
         do {
             remove = unlink(remove);
-        } while (remove !== null);
-        if (depsTail !== null) {
+        } while (remove);
+        if (depsTail) {
             depsTail.nextDep = null;
         }
         else {
@@ -154,7 +154,7 @@ function recompute(computed, del) {
     }
     if (ok && value !== computed.value) {
         computed.value = value;
-        for (let c = computed.subs; c !== null; c = c.nextSub) {
+        for (let c = computed.subs; c; c = c.nextSub) {
             let s = c.sub, state = s.state;
             if (state & STATE_CHECK) {
                 s.state = state | STATE_DIRTY;
@@ -165,6 +165,9 @@ function recompute(computed, del) {
     }
 }
 function schedule() {
+    if (stabilizer === STABILIZER_SCHEDULED) {
+        return;
+    }
     if (stabilizer === STABILIZER_IDLE && !depth) {
         stabilizer = STABILIZER_SCHEDULED;
         microtask(stabilize);
@@ -199,13 +202,13 @@ function stabilize() {
 }
 function unlink(link) {
     let dep = link.dep, nextDep = link.nextDep, nextSub = link.nextSub, prevSub = link.prevSub;
-    if (nextSub !== null) {
+    if (nextSub) {
         nextSub.prevSub = prevSub;
     }
     else {
         dep.subsTail = prevSub;
     }
-    if (prevSub !== null) {
+    if (prevSub) {
         prevSub.nextSub = nextSub;
     }
     else if ((dep.subs = nextSub) === null && 'fn' in dep) {
@@ -271,7 +274,7 @@ const computed = (fn) => {
 const dispose = (computed) => {
     deleteFromHeap(computed);
     let dep = computed.deps;
-    while (dep !== null) {
+    while (dep) {
         dep = unlink(dep);
     }
     computed.deps = null;
@@ -300,11 +303,11 @@ const onCleanup = (fn) => {
     if (!cleanup) {
         parent.cleanup = fn;
     }
-    else if (isArray(cleanup)) {
-        cleanup.push(fn);
+    else if (typeof cleanup === 'function') {
+        parent.cleanup = [cleanup, fn];
     }
     else {
-        parent.cleanup = [cleanup, fn];
+        cleanup.push(fn);
     }
     return fn;
 };
@@ -361,7 +364,7 @@ const set = (signal, value) => {
     if (signal.subs === null) {
         return;
     }
-    for (let link = signal.subs; link !== null; link = link.nextSub) {
+    for (let link = signal.subs; link; link = link.nextSub) {
         insertIntoHeap(link.sub);
     }
     schedule();

package/package.json

@@ -12,7 +12,7 @@
   "private": false,
   "type": "module",
   "types": "build/index.d.ts",
-  "version": "0.16.6",
+  "version": "0.17.0",
   "scripts": {
     "build": "tsc && tsc-alias",
     "-": "-"

package/src/reactive/array.ts

@@ -1,19 +1,7 @@
-import { isNumber, Prettify } from '@esportsplus/utilities';
 import { REACTIVE_ARRAY } from '~/constants';
 import { isReactiveObject } from './object';
 
 
-type ReactiveArray<T> = Prettify<
-    T[] & {
-        clear: () => void;
-        dispose: () => void;
-        dispatch: <K extends keyof Events<T>, V>(event: K, value?: V) => void;
-        map: <R>(fn: (this: ReactiveArray<T>, value: T, i: number) => R) => R[];
-        on: <K extends keyof Events<T>>(event: K, listener: Listener<Events<T>[K]>) => void;
-        once: <K extends keyof Events<T>>(event: K, listener: Listener<Events<T>[K]>) => void;
-    }
->;
-
 type Events<T> = {
     clear: undefined,
     pop: {
@@ -49,243 +37,161 @@ type Listener<V> = {
 type Listeners = Record<string, (Listener<any> | null)[]>;
 
 
-function cleanup<T>(item: T) {
-    if (isReactiveObject(item)) {
-        item.dispose();
-    }
-}
+class ReactiveArray<T> extends Array<T> {
+    [REACTIVE_ARRAY] = true;
+    listeners: Listeners = {};
 
-function clear<T>(data: T[], listeners: Listeners) {
-    dispose(data);
-    dispatch(listeners, 'clear');
-}
 
-function dispatch<T, K extends keyof Events<T>, V>(listeners: Listeners, event: K, value?: V) {
-    if (listeners === null || listeners[event] === undefined) {
-        return;
+    constructor(...items: T[]) {
+        super(...items);
     }
 
-    let bucket = listeners[event];
 
-    for (let i = 0, n = bucket.length; i < n; i++) {
-        let listener = bucket[i];
+    clear() {
+        this.dispose();
+        this.dispatch('clear');
+    }
+
+    dispatch<K extends keyof Events<T>, V>(event: K, value?: V) {
+        let listeners = this.listeners[event];
 
-        if (listener === null) {
-            continue;
+        if (!listeners) {
+            return;
         }
 
-        try {
-            listener(value);
+        for (let i = 0, n = listeners.length; i < n; i++) {
+            let listener = listeners[i];
 
-            if (listener.once !== undefined) {
-                bucket[i] = null;
+            if (listener === null) {
+                continue;
+            }
+
+            try {
+                listener(value);
+
+                if (listener.once !== undefined) {
+                    listeners[i] = null;
+                }
+            }
+            catch {
+                listeners[i] = null;
             }
-        }
-        catch {
-            bucket[i] = null;
         }
     }
-}
 
-function dispose<T>(data: T[]) {
-    let item;
+    dispose() {
+        let item;
 
-    while (item = data.pop()) {
-        cleanup(item);
+        while (item = super.pop()) {
+            if (isReactiveObject(item)) {
+                item.dispose();
+            }
+        }
     }
-}
 
-function map<T, R>(
-    data: T[],
-    proxy: ReactiveArray<T>,
-    fn: (this: ReactiveArray<T>, value: T, i: number) => R
-) {
-    let n = data.length,
-        values: R[] = new Array(n);
+    on<K extends keyof Events<T>>(event: K, listener: Listener<Events<T>[K]>) {
+        let listeners = this.listeners[event];
 
-    for (let i = 0; i < n; i++) {
-        values[i] = fn.call(proxy, data[i], i);
-    }
+        if (listeners === undefined) {
+            this.listeners[event] = [listener];
+        }
+        else {
+            let hole = listeners.length;
 
-    return values;
-}
+            for (let i = 0, n = hole; i < n; i++) {
+                let l = listeners[i];
 
-function on<T, K extends keyof Events<T>>(listeners: Listeners, event: K, listener: Listener<Events<T>[K]>) {
-    let bucket = listeners[event];
+                if (l === listener) {
+                    return;
+                }
+                else if (l === null && hole === n) {
+                    hole = i;
+                }
+            }
+
+            listeners[hole] = listener;
+        }
+    }
 
-    if (bucket === undefined) {
-        listeners[event] = [listener];
+    once<K extends keyof Events<T>>(event: K, listener: Listener<Events<T>[K]>) {
+        listener.once = true;
+        this.on(event, listener);
     }
-    else {
-        let hole = bucket.length;
 
-        for (let i = 0, n = hole; i < n; i++) {
-            let l = bucket[i];
+    pop() {
+        let item = super.pop();
 
-            if (l === listener) {
-                return;
-            }
-            else if (l === null && hole === n) {
-                hole = i;
+        if (item !== undefined) {
+            if (isReactiveObject(item)) {
+                item.dispose();
             }
+            this.dispatch('pop', { item });
         }
 
-        bucket[hole] = listener;
+        return item;
     }
-}
 
-function once<T, K extends keyof Events<T>>(listeners: Listeners, event: K, listener: Listener<Events<T>[K]>) {
-    listener.once = true;
-    on(listeners, event, listener);
-}
+    push(...items: T[]) {
+        let length = super.push(...items);
 
-function pop<T>(data: T[], listeners: Listeners) {
-    let item = data.pop();
+        this.dispatch('push', { items });
 
-    if (item !== undefined) {
-        cleanup(item);
-        dispatch(listeners, 'pop', { item });
+        return length;
     }
 
-    return item;
-}
+    reverse() {
+        super.reverse();
+        this.dispatch('reverse');
 
-function push<T>(data: T[], listeners: Listeners, items: T[]) {
-    let n = data.push(...items);
+        return this;
+    }
 
-    dispatch(listeners, 'push', { items });
+    shift() {
+        let item = super.shift();
 
-    return n;
-}
+        if (item !== undefined) {
+            if (isReactiveObject(item)) {
+                item.dispose();
+            }
+            this.dispatch('shift', { item });
+        }
 
-function reverse<T>(data: T[], listeners: Listeners) {
-    data.reverse();
-    dispatch(listeners, 'reverse');
-}
+        return item;
+    }
 
-function shift<T>(data: T[], listeners: Listeners) {
-    let item = data.shift();
+    sort(fn: (a: T, b: T) => number) {
+        super.sort(fn);
+        this.dispatch('sort');
 
-    if (item !== undefined) {
-        cleanup(item);
-        dispatch(listeners, 'shift', { item });
+        return this;
     }
 
-    return item;
-}
+    splice(start: number, deleteCount: number = this.length, ...items: T[]) {
+        let removed = super.splice(start, deleteCount, ...items);
 
-function sort<T>(data: T[], listeners: Listeners, fn: (a: T, b: T) => number) {
-    data.sort((a, b) => fn(a, b));
-    dispatch(listeners, 'sort');
-}
+        if (items.length > 0 || removed.length > 0) {
+            for (let i = 0, n = removed.length; i < n; i++) {
+                let item = removed[i];
 
-function splice<T>(data: T[], listeners: Listeners, start: number, deleteCount: number = data.length, items: T[] = []) {
-    let removed = data.splice(start, deleteCount, ...items);
+                if (isReactiveObject(item)) {
+                    item.dispose();
+                }
+            }
 
-    if (items.length > 0 || removed.length > 0) {
-        for (let i = 0, n = removed.length; i < n; i++) {
-            cleanup(removed[i]);
+            this.dispatch('splice', { deleteCount, items, start });
         }
 
-        dispatch(listeners, 'splice', {
-            deleteCount,
-            items,
-            start
-        });
+        return removed;
     }
 
-    return removed;
-}
-
-function unshift<T>(data: T[], listeners: Listeners, items: T[]) {
-    let length = data.unshift(...items);
+    unshift(...items: T[]) {
+        let length = super.unshift(...items);
 
-    dispatch(listeners, 'unshift', { items });
+        this.dispatch('unshift', { items });
 
-    return length;
+        return length;
+    }
 }
 
 
-export default <T>(data: T[]) => {
-    let listeners: Listeners = {},
-        proxy = new Proxy({}, {
-            get(_, key: any) {
-                if (isNumber(key)) {
-                    return data[key];
-                }
-                else if (key in wrapper) {
-                    return wrapper[key as keyof typeof wrapper];
-                }
-                else if (key === 'length') {
-                    return data.length;
-                }
-
-                return data[key];
-            },
-            set(_, key: any, value: any) {
-                if (isNumber(key)) {
-                    splice(data, listeners, key, 1, value);
-                }
-                else if (key === 'length') {
-                    if (value >= data.length) {
-                    }
-                    else if (value === 0) {
-                        clear(data, listeners);
-                    }
-                    else {
-                        splice(data, listeners, value);
-                    }
-                }
-                else {
-                    return false;
-                }
-
-                return true;
-            }
-        }) as ReactiveArray<T>,
-        wrapper = {
-            [REACTIVE_ARRAY]: true,
-            at: (i: number) => data[i],
-            clear: () => {
-                clear(data, listeners);
-                return proxy;
-            },
-            dispatch: <K extends keyof Events<T>, V>(event: K, value?: V) => {
-                dispatch(listeners, event, value);
-                return proxy;
-            },
-            dispose: () => {
-                dispose(data);
-                return proxy;
-            },
-            map: <R>(fn: (this: ReactiveArray<T>, value: T, i: number) => R) => {
-                return map(data, proxy, fn);
-            },
-            on: <K extends keyof Events<T>>(event: K, listener: Listener<Events<T>[K]>) => {
-                on(listeners, event, listener);
-                return proxy;
-            },
-            once: <K extends keyof Events<T>>(event: K, listener: Listener<Events<T>[K]>) => {
-                once(listeners, event, listener);
-                return proxy;
-            },
-            pop: () => pop(data, listeners),
-            push: (...items: T[]) => push(data, listeners, items),
-            reverse: () => {
-                reverse(data, listeners);
-                return proxy;
-            },
-            shift: () => shift(data, listeners),
-            sort: (fn: (a: T, b: T) => number) => {
-                sort(data, listeners, fn);
-                return proxy;
-            },
-            splice: (start: number, deleteCount?: number, ...items: T[]) => {
-                return splice(data, listeners, start, deleteCount, items);
-            },
-            unshift: (...items: T[]) => unshift(data, listeners, items),
-        };
-
-    return proxy;
-};
-export type { ReactiveArray };
+export { ReactiveArray };

package/src/reactive/index.ts

@@ -1,29 +1,42 @@
-import { isArray, isObject } from '@esportsplus/utilities';
+import { isArray, isObject, Prettify } from '@esportsplus/utilities';
 import { onCleanup, root } from '~/system';
-import array, { ReactiveArray } from './array';
-import object, { ReactiveObject } from './object';
+import { ReactiveArray } from './array';
+import { ReactiveObject } from './object';
 
 
 type API<T> =
     T extends Record<PropertyKey, unknown>
-        ? ReactiveObject<T>
+        ? Prettify<{ [K in keyof T]: Infer<T[K]> } & { dispose: VoidFunction } >
         : T extends (infer U)[]
             ? ReactiveArray<U>
             : never;
 
+type Guard<T> = T extends { dispose: any } ? { never: '[ dispose ] are reserved keys' } : T;
 
-export default <T extends Record<PropertyKey, any> | unknown[]>(
-    input: T extends { dispose: any } ? { never: '[ dispose ] are reserved keys' } : T
-): API<T> => {
+type Infer<T> =
+    T extends (...args: unknown[]) => Promise<infer R>
+        ? R | undefined
+        : T extends (...args: any[]) => infer R
+            ? R
+            : T extends (infer U)[]
+                ? ReactiveArray<U>
+                : T extends ReactiveObject<any>
+                    ? T
+                    : T extends Record<PropertyKey, unknown>
+                        ? { [K in keyof T]: T[K] }
+                        : T;
+
+
+export default <T extends Record<PropertyKey, any> | unknown[]>(input: Guard<T>): API<T> => {
     let dispose = false,
         value = root(() => {
             let response: API<T> | undefined;
 
-            if (isArray(input)) {
-                response = array(input) as API<T>;
+            if (isObject(input)) {
+                response = new ReactiveObject(input) as any as API<T>;
             }
-            else if (isObject(input)) {
-                response = object(input) as API<T>;
+            else if (isArray(input)) {
+                response = new ReactiveArray(...input) as API<T>;
             }
 
             if (response) {