@esportsplus/reactivity 0.0.30 → 0.1.1

package/build/types.d.ts

@@ -1,36 +1,34 @@
-import { CHECK, CLEAN, COMPUTED, DIRTY, DISPOSED, EFFECT, SIGNAL } from './symbols';
+import { Prettify } from '@esportsplus/typescript';
+import { CHECK, CLEAN, COMPUTED, DIRTY, DISPOSED, EFFECT, SIGNAL } from './constants';
 import Signal from './signal';
 type Changed = (a: unknown, b: unknown) => boolean;
 type Computed<T> = {
-    fn: T extends Promise<unknown> ? never : ((this: Context, previous: T) => T);
+    fn: T extends Promise<unknown> ? never : ((previous: T) => T);
     value: ReturnType<Computed<T>['fn']>;
 } & Omit<Signal<T>, 'fn' | 'value'>;
-type Context = {
-    dispose(): void;
-    on(event: Event, listener: Listener): void;
-    once(event: Event, listener: Listener): void;
-    reset(): void;
-};
 type Effect<T> = {
-    fn: (this: Context, previous: T) => T;
+    fn: (node: Effect<T>) => void;
     root: NonNullable<Signal<T>['root']>;
     task: NonNullable<Signal<T>['task']>;
-} & Omit<Computed<T>, 'fn' | 'root' | 'task'>;
-type Event = symbol;
-type Listener = {
+    value: void;
+} & Omit<Signal<T>, 'fn' | 'root' | 'task' | 'value'>;
+type Event = string;
+type Listener<D> = {
     once?: boolean;
-    <T>(value: T): void;
+    <V>(event: {
+        data?: D;
+        value: V;
+    }): void;
 };
+type Object = Record<PropertyKey, unknown>;
 type Options = {
     changed?: Changed;
+    value?: unknown;
 };
 type Root = {
     scheduler: Scheduler;
 };
-type Prettify<T> = {
-    [K in keyof T]: T[K];
-} & {};
 type Scheduler = (fn: (...args: unknown[]) => Promise<unknown> | unknown) => unknown;
 type State = typeof CHECK | typeof CLEAN | typeof DIRTY | typeof DISPOSED;
 type Type = typeof COMPUTED | typeof EFFECT | typeof SIGNAL;
-export { Changed, Computed, Context, Effect, Event, Listener, Options, Prettify, Root, Scheduler, Signal, State, Type };
+export { Changed, Computed, Effect, Event, Listener, Object, Options, Prettify, Root, Scheduler, Signal, State, Type };

package/build/utilities.d.ts

@@ -0,0 +1,3 @@
+declare const isArray: (arg: any) => arg is any[];
+declare const defineProperty: <T>(o: T, p: PropertyKey, attributes: PropertyDescriptor & ThisType<any>) => T;
+export { defineProperty, isArray };

package/build/utilities.js

@@ -0,0 +1,3 @@
+const { isArray } = Array;
+const { defineProperty } = Object;
+export { defineProperty, isArray };

package/package.json

@@ -1,7 +1,10 @@
 {
     "author": "ICJR",
+    "dependencies": {
+        "@esportsplus/custom-function": "^0.0.1"
+    },
     "devDependencies": {
-        "@esportsplus/typescript": "^0.0.1"
+        "@esportsplus/typescript": "^0.0.3"
     },
     "main": "build/index.js",
     "name": "@esportsplus/reactivity",
@@ -13,5 +16,5 @@
         "prepublishOnly": "npm run build"
     },
     "types": "build/index.d.ts",
-    "version": "0.0.30"
+    "version": "0.1.1"
 }

package/src/constants.ts

@@ -0,0 +1,17 @@
+const CLEAN = 0;
+
+const CHECK = 1;
+
+const DIRTY = 2;
+
+const DISPOSED = 3;
+
+
+const COMPUTED = 0;
+
+const EFFECT = 1;
+
+const SIGNAL = 2;
+
+
+export { CHECK, CLEAN, COMPUTED, DIRTY, DISPOSED, EFFECT, SIGNAL };

package/src/index.ts

@@ -1,7 +1,5 @@
-export { default as effect } from './effect';
 export { default as macro } from './macro';
-export { default as promise } from './promise';
+export { default as resource } from './resource';
 export * as core from './signal';
-export { root } from './signal';
-export { default as reactive } from './reactive';
-export { DISPOSE, RESET, UPDATE } from './symbols';
+export { effect, root } from './signal';
+export { default as reactive } from './reactive';

package/src/macro.ts

@@ -1,15 +1,35 @@
+import CustomFunction from '@esportsplus/custom-function';
 import { computed, read } from './signal';
 import { Computed } from './types';
-import context from './context';
 
 
-export default <T extends <A, R>(...args: A[]) => R>(fn: Computed<T>['fn'], options: Parameters<typeof computed>[1] = {}) => {
-    let node = computed(fn, options);
+type Fn<A extends unknown[], R> = Parameters<typeof computed<(...args: A) => R>>[0];
 
-    return context.node(
-        (...args: Parameters<ReturnType<typeof fn>>) => {
-            return (read(node) as ReturnType<typeof fn>)(...args);
-        },
-        node
-    );
+type Options = Parameters<typeof computed>[1];
+
+
+class Macro<A extends unknown[], R> extends CustomFunction {
+    #factory: Computed< ReturnType<Fn<A,R>> >;
+
+
+    constructor(fn: Fn<A,R>, options: Options = {}) {
+        super((...args: A) => {
+            return read(this.#factory)(...args);
+        });
+        this.#factory = computed(fn, options);
+    }
+
+
+    dispose() {
+        this.#factory.dispose();
+    }
+
+    reset() {
+        this.#factory.reset();
+    }
+}
+
+
+export default <A extends unknown[], R>(fn: Fn<A,R>, options: Options = {}) => {
+    return new Macro(fn, options);
 };

package/src/reactive/array.ts

@@ -0,0 +1,219 @@
+import { dispose, read, signal, write } from '~/signal';
+import { Listener, Object, Options, Signal } from '~/types';
+import { ReactiveObject } from './object';
+
+
+type Events<T> = {
+    fill: { value: T };
+    pop: { item: T };
+    push: { items: T[] };
+    reverse: undefined;
+    shift: { item: T };
+    sort: undefined;
+    splice: { deleteCount: number, items: T[], start: number };
+    unshift: { items: T[] };
+};
+
+type Node<T extends Object> = ReactiveObject<T>;
+
+
+function factory<T extends Object>(data: T[], options: Options = {}) {
+    let signals = [];
+
+    for (let i = 0, n = data.length; i < n; i++) {
+        signals.push( new ReactiveObject(data[i], options) );
+    }
+
+    return signals;
+}
+
+function unsupported(method: string): never {
+    throw new Error(`Reactivity: '${method}' is not supported on reactive object array`);
+}
+
+
+// TODO:
+// - patch method ( diff )
+class ReactiveArray<T> extends Array<T> {
+    #signal: Signal<boolean>;
+
+
+    constructor(data: T[]) {
+        super(...data);
+        this.#signal = signal(false);
+    }
+
+
+    set length(n: number) {
+        if (n > this.length) {
+            return;
+        }
+
+        this.splice(n);
+    }
+
+
+    private trigger() {
+        write(this.#signal, !this.#signal.value);
+    }
+
+
+    dispatch<E extends keyof Events<T>>(event: E, data?: Events<T>[E]) {
+        this.#signal.dispatch(event, data);
+    }
+
+    dispose() {
+        this.#signal.dispose();
+    }
+
+    fill(value: T, start?: number, end?: number) {
+        super.fill(value, start, end);
+
+        this.dispatch('fill', { value });
+        this.trigger();
+
+        return this;
+    }
+
+    on<E extends keyof Events<T>>(event: E, listener: Listener<Events<T>[E]>) {
+        this.#signal.on(event, listener);
+    }
+
+    once<E extends keyof Events<T>>(event: E, listener: Listener<Events<T>[E]>) {
+        this.#signal.once(event, listener);
+    }
+
+    pop() {
+        let item = super.pop();
+
+        if (item !== undefined) {
+            this.dispatch('pop', { item });
+            this.trigger();
+        }
+
+        return item;
+    }
+
+    push(...items: T[]) {
+        let n = super.push(...items);
+
+        this.dispatch('push', { items });
+        this.trigger();
+
+        return n;
+    }
+
+    reset() {
+        this.#signal.reset();
+    }
+
+    reverse() {
+        super.reverse();
+
+        this.dispatch('reverse');
+        this.trigger();
+
+        return this;
+    }
+
+    shift() {
+        let item = super.shift();
+
+        if (item !== undefined) {
+            this.dispatch('shift', { item });
+            this.trigger();
+        }
+
+        return item;
+    }
+
+    sort() {
+        super.sort();
+
+        this.dispatch('sort');
+        this.trigger();
+
+        return this;
+    }
+
+    splice(start: number, deleteCount: number = super.length, ...items: T[]) {
+        let removed = super.splice(start, deleteCount, ...items);
+
+        if (items.length > 0 || removed.length > 0) {
+            this.dispatch('splice', {
+                deleteCount,
+                items,
+                start
+            });
+            this.trigger();
+        }
+
+        return removed;
+    }
+
+    track() {
+        read(this.#signal);
+    }
+
+    unshift(...items: T[]) {
+        let length = super.unshift(...items);
+
+        this.dispatch('unshift', { items });
+        this.trigger();
+
+        return length;
+    }
+}
+
+
+// REMINDER:
+// - @ts-ignore flags are supressing a type mismatch error
+// - Input values are being transformed by this class into nodes
+class ReactiveObjectArray<T extends Object>  extends ReactiveArray<Node<T>> {
+    #options: Options;
+
+
+    constructor(data: T[], options: Options = {}) {
+        super( factory(data, options) );
+        this.#options = options;
+    }
+
+
+    fill() {
+        return unsupported('fill');
+    }
+
+    reverse() {
+        return unsupported('reverse');
+    }
+
+    pop() {
+        return dispose(super.pop()) as Node<T> | undefined;
+    }
+
+    // @ts-ignore
+    push(...values: T[]) {
+        return super.push(...factory(values, this.#options));
+    }
+
+    shift() {
+        return dispose(super.shift()) as Node<T> | undefined;
+    }
+
+    sort() {
+        return unsupported('sort');
+    }
+
+    // @ts-ignore
+    splice(start: number, deleteCount: number = super.length, ...values: T[]) {
+        return dispose( super.splice(start, deleteCount, ...factory(values, this.#options)) );
+    }
+
+    // @ts-ignore
+    unshift(...values: T[]) {
+        return super.unshift(...factory(values, this.#options));
+    }
+}
+
+
+export { ReactiveArray, ReactiveObjectArray };

package/src/reactive/index.ts

@@ -0,0 +1,38 @@
+import { Computed, Object, Options, Prettify, Signal } from '~/types';
+import { ReactiveArray, ReactiveObjectArray } from './array';
+import { ReactiveObject } from './object';
+
+
+type Guard<T> =
+    T extends Object
+        ? { [K in keyof T]: Never<K, Guard<T[K]>> }
+        : T extends unknown[]
+            ? Guard<T[number]>[]
+            : T;
+
+type Infer<T> =
+    T extends (...args: unknown[]) => unknown
+        ? ReturnType<T>
+        : T extends unknown[]
+            ? Infer<T[number]>[]
+            : T extends Object
+                ? { [K in keyof T]: T[K] }
+                : T;
+
+type Never<K,V> = K extends keyof ReactiveObject<Object> ? never : V;
+
+type Node<T> =
+    T extends (...args: unknown[]) => unknown
+        ? Computed<T>
+        : T extends unknown[]
+            ? T extends Object[] ? ReactiveObjectArray<T[0]> : ReactiveArray<T>
+            : Signal<T>;
+
+type Nodes<T extends Object> = { [K in keyof T]: Node<T[K]> };
+
+
+export default <T extends Object>(data: Guard<T>, options: Options = {}) => {
+    return new ReactiveObject(data, options) as any as Prettify<
+        { [K in keyof T]: Infer<T[K]> } & Omit<ReactiveObject<T>, 'nodes'> & { nodes: Nodes<T> }
+    >;
+};

package/src/reactive/object.ts

@@ -0,0 +1,79 @@
+import { computed, read, signal, write } from '~/signal';
+import { Computed, Object, Options, Signal } from '~/types';
+import { defineProperty, isArray } from '~/utilities';
+import { ReactiveArray, ReactiveObjectArray } from './array';
+
+
+class ReactiveObject<T extends Object> {
+    nodes: Record<PropertyKey, Computed<unknown> | ReactiveObjectArray<Object> | ReactiveArray<unknown> | Signal<unknown>> = {};
+
+
+    constructor(data: T, options: Options = {}) {
+        let nodes = this.nodes;
+
+        for (let key in data) {
+            let input = data[key];
+
+            if (typeof input === 'function') {
+                let node = nodes[key] = computed(input as Computed<unknown>['fn'], options);
+
+                defineProperty(this, key, {
+                    get() {
+                        return read(node);
+                    }
+                });
+            }
+            else if (isArray(input)) {
+                let node: ReactiveArray<unknown> | ReactiveObjectArray<Object>,
+                    test = input[0];
+
+                if (typeof test === 'object' && test !== null && test.constructor.name === 'Object') {
+                    node = nodes[key] = new ReactiveObjectArray(input, options);
+                }
+                else {
+                    node = nodes[key] = new ReactiveArray(input);
+                }
+
+                defineProperty(this, key, {
+                    get() {
+                        node.track();
+
+                        return node;
+                    }
+                });
+            }
+            else {
+                let node = nodes[key] = signal(input, options);
+
+                defineProperty(this, key, {
+                    get() {
+                        return read(node);
+                    },
+                    set(value) {
+                        write(node, value);
+                    }
+                });
+            }
+        }
+    }
+
+
+    dispose() {
+        let nodes = this.nodes;
+
+        for (let key in nodes) {
+            nodes[key].dispose();
+        }
+    }
+
+    reset() {
+        let nodes = this.nodes;
+
+        for (let key in nodes) {
+            nodes[key].reset();
+        }
+    }
+}
+
+
+export { ReactiveObject };

package/src/resource.ts

@@ -0,0 +1,79 @@
+import CustomFunction from '@esportsplus/custom-function';
+import { computed, read, signal, write } from './signal';
+import { Signal } from './types';
+
+
+type Fn<A extends unknown[], R extends Promise<unknown>> = (...args: A) => R;
+
+type Options = Parameters<typeof computed>[1];
+
+
+class Resource<A extends unknown[], R extends Promise<unknown>> extends CustomFunction {
+    #data: Signal<Awaited<R>>;
+    #input: Signal<A | null>;
+    #ok: Signal<boolean | null>;
+
+    stop: boolean | null = null;
+
+
+    constructor(fn: Fn<A,R>, options: Options = {}) {
+        super((...args: A) => {
+            this.stop = null;
+
+            write(this.#input, args);
+            write(this.#ok, null);
+
+            fn(...args)
+                .then((value) => {
+                    if (this.stop === true) {
+                        return;
+                    }
+
+                    write(this.#data, value);
+                    write(this.#ok, true);
+                })
+                .catch(() => {
+                    if (this.stop === true) {
+                        return;
+                    }
+
+                    write(this.#data, undefined);
+                    write(this.#ok, false);
+                });
+        });
+        this.#data = signal(options.value as Awaited<R>, options),
+        this.#input = signal(null, options),
+        this.#ok = signal(null, options)
+    }
+
+
+    get data() {
+        return read(this.#data);
+    }
+
+    get ok() {
+        return read(this.#ok);
+    }
+
+    get input() {
+        return read(this.#input);
+    }
+
+
+    dispose() {
+        this.#data.dispose();
+        this.#input.dispose();
+        this.#ok.dispose();
+    }
+
+    reset() {
+        this.#data.reset();
+        this.#input.reset();
+        this.#ok.reset();
+    }
+}
+
+
+export default <A extends unknown[], R extends Promise<unknown>>(fn: Fn<A,R>, options: Options = {}) => {
+    return new Resource(fn, options);
+};