@oscarpalmer/mora 0.31.0 → 0.33.0

package/src/value/array.ts

@@ -1,37 +1,111 @@
 import {select} from '@oscarpalmer/atoms/array';
 import {filter} from '@oscarpalmer/atoms/array/filter';
-import {noop} from '@oscarpalmer/atoms/function';
-import {isPlainObject} from '@oscarpalmer/atoms/is';
-import type {GenericCallback} from '@oscarpalmer/atoms/models';
 import {
 	METHODS_AFFECTING_LENGTH,
 	METHODS_UPDATE,
 	NAME_ARRAY,
 	NAME_MORA,
 	PROPERTY_LENGTH,
+	SYMBOL_STATE,
 } from '../constants';
+import {getState} from '../helpers/misc';
 import {
-	emityProxyValues,
-	getReactiveValueInProxy,
+	emitProxyValues,
+	getValueInProxy,
+	peekValueInProxy,
 	setProxyValue,
 	setValueInProxy,
+	updateProxyValue,
 } from '../helpers/proxy';
-import {emitValue, equalArrays, getSimpleValue} from '../helpers/value';
-import type {
-	Computed,
-	ComputedEffect,
-	ReactiveArray,
-	ReactiveOptions,
-	ReactiveState,
-	ReadonlyInstances,
-	Signal,
-} from '../models';
-import {subscribe, unsubscribe} from '../subscription';
+import {subscribeToProxy} from '../helpers/subscription';
+import {emitValue, equalArrays, getStringValue} from '../helpers/value';
+import type {InternalProxy, ReactiveArray, ReactiveOptions, ReactiveState} from '../models';
 import {computed} from './computed';
-import {reactive} from './reactive';
 import {getReadonlyInstance} from './readonly';
 import {signal} from './signal';
 
+// #region Instance
+
+function ReactiveArray(this: any, value: unknown, options?: ReactiveOptions<unknown>) {
+	this[SYMBOL_STATE] = {
+		...getState(undefined, options),
+		isArray: true,
+		length: signal(0),
+	};
+
+	this[SYMBOL_STATE].value = new Proxy([], {
+		get: (target, property) =>
+			METHODS_UPDATE.has(property as string)
+				? updateArray(this, property as string, target)
+				: Reflect.get(target, property),
+		set: (target, property, value) => setValueInProxy(this, target, property, value),
+	});
+
+	Object.defineProperty(this, PROPERTY_LENGTH, {
+		enumerable: true,
+		get: () => this[SYMBOL_STATE].length.get(),
+		set: (value: number) => setArrayLength(this[SYMBOL_STATE], value),
+	});
+
+	setProxyValue.call(this, value);
+}
+
+ReactiveArray.prototype[NAME_MORA] = NAME_ARRAY;
+
+ReactiveArray.prototype.asReadonly = getReadonlyInstance;
+ReactiveArray.prototype.at = getArrayValues;
+ReactiveArray.prototype.get = getArrayValues;
+ReactiveArray.prototype.notify = emitProxyValues;
+ReactiveArray.prototype.peek = peekArrayValue;
+ReactiveArray.prototype.set = setProxyValue;
+ReactiveArray.prototype.subscribe = subscribeToProxy;
+ReactiveArray.prototype.toString = getStringValue;
+ReactiveArray.prototype.update = updateProxyValue;
+
+ReactiveArray.prototype.clear = function () {
+	this[SYMBOL_STATE].value.length = 0;
+};
+
+ReactiveArray.prototype.filter = function (callback: never) {
+	return computed(() => filter(getArrayValues.call(this) as never, callback) as never);
+};
+
+ReactiveArray.prototype.map = function (callback: never) {
+	return computed(() => (getArrayValues.call(this) as unknown[]).map(callback));
+};
+
+ReactiveArray.prototype.pop = function () {
+	return this[SYMBOL_STATE].value.pop();
+};
+
+ReactiveArray.prototype.push = function (...items: unknown[]) {
+	return this[SYMBOL_STATE].value.push(...items);
+};
+
+ReactiveArray.prototype.select = function (filter: never, map: never) {
+	return computed(() => select(getArrayValues.call(this) as unknown[], filter, map));
+};
+
+ReactiveArray.prototype.shift = function () {
+	return this[SYMBOL_STATE].value.shift();
+};
+
+ReactiveArray.prototype.splice = function (from: never, to?: never, ...items: unknown[]) {
+	return this[SYMBOL_STATE].value.splice(from, to ?? this[SYMBOL_STATE].value.length, ...items);
+};
+
+ReactiveArray.prototype.toJSON = function () {
+	return this[SYMBOL_STATE].value;
+};
+
+ReactiveArray.prototype.unshift = function (...items: unknown[]) {
+	return this[SYMBOL_STATE].value.unshift(...items);
+};
+
+// #endregion
+
+// #region Functions
+
 /**
  * Create a reactive array from a function result
  *
@@ -65,238 +139,54 @@ export function array<Item>(
  */
 export function array<Item>(value: Item[], options?: ReactiveOptions<Item>): ReactiveArray<Item>;
 
-export function array<Item>(
-	value: Item[] | (() => Item[] | Promise<Item[]>) | Promise<Item[]>,
-	options?: ReactiveOptions<Item>,
-): ReactiveArray<Item> {
-	const [rx, state] = reactive<Item[], Item>([], options);
-
-	const indiced = new Map<number, [Computed<unknown>, ComputedEffect]>();
-	const length = signal(0);
-	const readonlies: ReadonlyInstances<Item[]> = {};
-
-	let instance: Record<string, unknown> = {};
-
-	state.value = new Proxy([], {
-		get: (target: Item[], property: PropertyKey) =>
-			METHODS_UPDATE.has(property as string)
-				? updateArray(property as string, target, state, length)
-				: Reflect.get(target, property),
-		set: (target: Item[], property: PropertyKey, value: Item) =>
-			setValueInProxy({
-				length,
-				property,
-				state,
-				target,
-				value,
-				isArray: true,
-			}),
-	});
-
-	function get(): Item[];
-	function get(index: number): Item | undefined;
-	function get(property: typeof PROPERTY_LENGTH): number;
-	function get(value?: unknown): number | Item | Item[] | undefined;
-
-	function get(value?: unknown): number | Item | Item[] | undefined {
-		return getArrayValue(instance as ReactiveArray<Item>, indiced, state, length, value);
-	}
-
-	function set(first?: unknown, second?: unknown): void {
-		setProxyValue<Item[], Item>(
-			true,
-			state,
-			isArrayValue,
-			isArrayIndex,
-			setArray,
-			setAtIndex,
-			first,
-			second,
-		);
-	}
-
-	const handlers = {
-		...rx,
-		get: (value?: number | typeof PROPERTY_LENGTH) => get(value),
-		peek: (first?: unknown, second?: boolean) => peekArrayValue(state, length, first, second),
-		subscribe: (first: number | GenericCallback, second?: GenericCallback) => {
-			if (typeof first === 'number' && typeof second === 'function') {
-				return getReactiveValueInProxy(
-					instance as ReactiveArray<Item>,
-					indiced,
-					first,
-					true,
-				).subscribe(second);
-			}
-
-			return typeof first === 'function' ? subscribe(state, first) : noop;
-		},
-		unsubscribe: (first: number | GenericCallback, second?: GenericCallback) => {
-			if (typeof first === 'number' && typeof second === 'function') {
-				getReactiveValueInProxy(instance as ReactiveArray<Item>, indiced, first, true)?.unsubscribe(
-					second,
-				);
-			} else if (typeof first === 'function') {
-				unsubscribe(state, first);
-			}
-		},
-	};
-
-	instance = {
-		...handlers,
-		asReadonly: (frozen?: unknown) =>
-			getReadonlyInstance(state, readonlies, handlers, frozen === true),
-		at: (index: number): Item | undefined => get(index),
-		clear: () => {
-			state.value.length = 0;
-		},
-		filter: (callback: (item: Item, index: number, array: Item[]) => boolean) =>
-			computed(() => filter(get(), callback)),
-		map: <Mapped>(callback: (item: Item, index: number, array: Item[]) => Mapped) =>
-			computed(() => get().map(callback)),
-		notify: () => {
-			emityProxyValues(state, indiced);
-		},
-		pop: () => state.value.pop(),
-		push: (...items: Item[]) => state.value.push(...items),
-		select: <Mapped>(
-			filter: (item: Item, index: number, array: Item[]) => boolean,
-			map: (item: Item, index: number, array: Item[]) => Mapped,
-		) => computed(() => select(get() as Item[], filter, map)),
-		set: (first?: unknown, second?: unknown) => {
-			set(first, second);
-		},
-		shift: () => state.value.shift(),
-		splice: (from: number, to?: number, ...items: Item[]) =>
-			state.value.splice(from, to ?? state.value.length, ...items),
-		unshift: (...items: Item[]) => state.value.unshift(...items),
-		update: (callback: (value: Item[]) => Item[]) =>
-			updateArrayValue(instance as ReactiveArray<Item>, state, callback),
-	};
-
-	Object.defineProperties(instance, {
-		[NAME_MORA]: {
-			enumerable: false,
-			value: NAME_ARRAY,
-		},
-		length: {
-			enumerable: true,
-			get: () => length.get(),
-			set: (value: number) => setArrayLength(state, value),
-		},
-	});
-
-	set(value);
-
-	return Object.freeze(instance) as ReactiveArray<Item>;
-}
-
-function getArrayValue<Item>(
-	instance: ReactiveArray<Item>,
-	indiced: Map<number, [Computed<unknown>, ComputedEffect]>,
-	state: ReactiveState<Item[], Item>,
-	length: Signal<number>,
-	first?: unknown,
-): number | Item | Item[] | undefined {
-	if (typeof first === 'number') {
-		return getReactiveValueInProxy(instance, indiced, first, true).get();
-	}
-
-	return first === PROPERTY_LENGTH ? length.get() : getSimpleValue(state);
+export function array(value: unknown, options?: ReactiveOptions<unknown>): ReactiveArray<unknown> {
+	// @ts-expect-error All good, no worries :-)
+	return new ReactiveArray(value, options);
 }
 
-function isArrayIndex(value: unknown): boolean {
-	return typeof value === 'number';
+function getArrayValues(this: InternalProxy, value?: unknown): unknown {
+	return value === PROPERTY_LENGTH
+		? this[SYMBOL_STATE].length!.get()
+		: getValueInProxy.call(this, value);
 }
 
-function isArrayValue<Item>(value: unknown): value is Item[] | undefined {
-	return value == null || Array.isArray(value);
+function peekArrayValue(this: InternalProxy, first?: unknown, second?: boolean): unknown {
+	return first === PROPERTY_LENGTH
+		? this[SYMBOL_STATE].length!.peek()
+		: peekValueInProxy.call(this, first, second);
 }
 
-function peekArrayValue<Item>(
-	state: ReactiveState<Item[], Item>,
-	length: Signal<number>,
-	first?: unknown,
-	second?: boolean,
-): number | Item | Item[] | undefined {
-	if (first === PROPERTY_LENGTH) {
-		return length.peek();
+function setArrayLength(state: ReactiveState, value: number): void {
+	if (
+		typeof value === 'number' &&
+		!Number.isNaN(value) &&
+		value >= 0 &&
+		value !== (state.value as unknown[]).length
+	) {
+		(state.value as unknown[]).length = value;
 	}
-
-	let value: Item | Item[] | undefined;
-
-	if (typeof first === 'number') {
-		value = state.value.at(first);
-	} else {
-		value = state.value;
-	}
-
-	if (!(first === true || second === true)) {
-		return value;
-	}
-
-	if (Array.isArray(value)) {
-		return value.slice();
-	}
-
-	if (isPlainObject(value)) {
-		return {...value};
-	}
-
-	return value;
 }
 
-function setArray<Item>(state: ReactiveState<Item[], Item>, value: Item[] | undefined): void {
-	state.value.splice(0, state.value.length, ...(value ?? []));
-}
+function updateArray(instance: InternalProxy, type: string, array: unknown[]): unknown {
+	const state = instance[SYMBOL_STATE];
 
-function setArrayLength<Item>(state: ReactiveState<Item[], Item>, value: number): void {
-	if (typeof value === 'number' && value >= 0 && value !== state.value.length) {
-		state.value.length = value;
-	}
-}
-
-function setAtIndex<Item>(state: ReactiveState<Item[], Item>, index: unknown, value: Item): void {
-	const actual = (index as number) < 0 ? state.value.length + (index as number) : (index as number);
-
-	if (actual > -1) {
-		state.value[actual] = value;
-	}
-}
-
-function updateArray<Item>(
-	type: string,
-	array: Item[],
-	state: ReactiveState<Item[], Item>,
-	length: Signal<number>,
-): unknown {
 	const affectsLength = METHODS_AFFECTING_LENGTH.has(type);
 	const previousArray = affectsLength ? [] : array.slice();
 	const previousLength = array.length;
 
-	return (...args: unknown[]): unknown => {
+	return (...args: unknown[]) => {
 		const result = (array[type as never] as (...args: unknown[]) => unknown)(...args);
 
 		if (
 			affectsLength ? array.length !== previousLength : !equalArrays(state, previousArray, array)
 		) {
-			emitValue(state);
+			emitValue(instance);
 
-			length.set(array.length);
+			state.length!.set(array.length);
 		}
 
 		return result;
 	};
 }
 
-function updateArrayValue<Item>(
-	instance: ReactiveArray<Item>,
-	state: ReactiveState<Item[], Item>,
-	callback: (value: Item[]) => Item[],
-): void {
-	const updated = callback(state.value);
-
-	if (updated == null || Array.isArray(updated)) {
-		instance.set(updated);
-	}
-}
+// #endregion

package/src/value/computed.ts

@@ -1,10 +1,50 @@
+import type {GenericAsyncCallback, GenericCallback} from '@oscarpalmer/atoms/models';
 import {flushHandlers} from '../batch';
-import {ACTIVE, BATCH, NAME_COMPUTED, NAME_MORA} from '../constants';
+import {
+	ACTIVE,
+	BATCH,
+	NAME_COMPUTED,
+	NAME_MORA,
+	SUBSCRIPTION_TYPE_FROZEN,
+	SUBSCRIPTION_TYPES,
+	SUBSCRIPTION_TYPES_COPY,
+	SYMBOL_EFFECT,
+	SYMBOL_STATE,
+} from '../constants';
 import {internalEffect, runEffect} from '../effect';
-import {handleSimpleValue} from '../helpers/value';
-import type {Computed, ComputedEffect, ReactiveOptions, ReactiveState} from '../models';
-import {subscribe} from '../subscription';
-import {reactive} from './reactive';
+import {getState} from '../helpers/misc';
+import {subscribeToSignal} from '../helpers/subscription';
+import {getStringValue, handleSignalValue, peekSignalValue} from '../helpers/value';
+import type {
+	Computed,
+	ComputedEffect,
+	ReactiveOptions,
+	InternalComputed,
+	InternalSignal,
+} from '../models';
+
+// #region Instance
+
+function Computed(this: any, callback: GenericCallback, options?: ReactiveOptions<unknown>) {
+	this[SYMBOL_STATE] = getState(undefined, options);
+
+	this[SYMBOL_EFFECT] = getComputedEffect(this, callback);
+}
+
+Computed.prototype[NAME_MORA] = NAME_COMPUTED;
+
+Computed.prototype.get = getComputedValue;
+Computed.prototype.peek = peekSignalValue;
+Computed.prototype.subscribe = subscribeToSignal;
+Computed.prototype.toString = getStringValue;
+
+Computed.prototype.toJSON = function () {
+	return this[SYMBOL_STATE].value;
+};
+
+// #endregion
+
+// #region Functions
 
 /**
  * Create a computed value
@@ -21,36 +61,22 @@ export function computed<Value>(
 }
 
 function getComputed<Value>(
-	callback: () => Value | Promise<Value>,
+	callback: GenericCallback,
 	options?: ReactiveOptions<Value>,
 ): [Computed<Value>, ComputedEffect] {
-	const [rx, state] = reactive<Value>(undefined as never, options);
-
-	let fx: ComputedEffect;
-
-	const instance = {
-		...rx,
-		get: () => getValue(state, fx),
-		peek: () => state.value,
-		subscribe: (callback: (value: Value) => void) => subscribe(state, callback),
-		unsubscribe: (callback: (value: Value) => void) => {
-			state.subscriptions.delete(callback);
-		},
-	};
-
-	Object.defineProperty(instance, NAME_MORA, {
-		enumerable: false,
-		value: NAME_COMPUTED,
-	});
+	if (typeof callback !== 'function') {
+		throw new TypeError('Computed callback must be a function');
+	}
 
-	fx = getComputedEffect(state, callback);
+	// @ts-expect-error All good, no worries :-)
+	const instance = new Computed(callback, options);
 
-	return [Object.freeze(instance), fx];
+	return [instance as never, instance[SYMBOL_EFFECT]];
 }
 
-function getComputedEffect<Value>(
-	state: ReactiveState<Value, Value>,
-	callback: () => Value | Promise<Value>,
+function getComputedEffect(
+	instance: InternalSignal,
+	callback: GenericAsyncCallback,
 ): ComputedEffect {
 	const fx: ComputedEffect = {
 		dirty: true,
@@ -63,7 +89,7 @@ function getComputedEffect<Value>(
 
 			ACTIVE.computed = fx;
 
-			handleSimpleValue(state, callback, setAndEmit, () => {
+			handleSignalValue(instance, callback, setAndEmit, () => {
 				ACTIVE.computed = previousComputed;
 			});
 
@@ -74,12 +100,19 @@ function getComputedEffect<Value>(
 	return fx;
 }
 
-function getValue<Value>(state: ReactiveState<Value, Value>, fx: ComputedEffect): Value {
+function getComputedValue(this: InternalComputed): unknown {
+	const fx = this[SYMBOL_EFFECT];
+	const state = this[SYMBOL_STATE];
+
 	if (ACTIVE.computed != null && fx !== ACTIVE.computed) {
+		state.computeds ??= new Set();
+
 		state.computeds.add(ACTIVE.computed);
 	}
 
 	if (ACTIVE.effect != null && ACTIVE.effect !== fx.instance) {
+		state.effects ??= new Set();
+
 		state.effects.add(ACTIVE.effect);
 	}
 
@@ -90,31 +123,51 @@ function getValue<Value>(state: ReactiveState<Value, Value>, fx: ComputedEffect)
 	return state.value;
 }
 
-export function internalComputed<Value>(
-	callback: () => Value | Promise<Value>,
-	options?: ReactiveOptions<Value>,
-): [Computed<Value>, ComputedEffect] {
+export function internalComputed(
+	callback: GenericCallback,
+	options?: ReactiveOptions<unknown>,
+): [Computed<unknown>, ComputedEffect] {
 	return getComputed(callback, options);
 }
 
-function setAndEmit<Value>(state: ReactiveState<Value, Value>, value: Value): void {
-	if (state.equal(state.value, value)) {
+function setAndEmit(instance: InternalSignal, value: unknown): void {
+	const state = instance[SYMBOL_STATE];
+
+	if ((state.equal ?? Object.is)(state.value as never, value as never)) {
 		return;
 	}
 
 	state.value = value;
 
-	for (const computed of state.computeds) {
-		computed.dirty = true;
+	if (state.computeds != null && state.computeds.size > 0) {
+		for (const computed of state.computeds) {
+			computed.dirty = true;
+		}
 	}
 
-	for (const effect of state.effects) {
-		BATCH.handlers.add(effect);
+	if (state.effects != null && state.effects.size > 0) {
+		for (const effect of state.effects) {
+			BATCH.handlers.set(effect, effect);
+		}
 	}
 
-	for (const [, subscription] of state.subscriptions) {
-		subscription.callback(value);
+	for (const type of SUBSCRIPTION_TYPES) {
+		if (type === SUBSCRIPTION_TYPE_FROZEN) {
+			continue;
+		}
+
+		const subscriptions = state.subscriptions?.values.to.keyed?.get(type);
+
+		if (subscriptions != null && subscriptions.size > 0) {
+			const copy = SUBSCRIPTION_TYPES_COPY.has(type);
+
+			for (const [, callback] of subscriptions) {
+				callback(peekSignalValue.call(instance, copy));
+			}
+		}
 	}
 
 	flushHandlers();
 }
+
+// #endregion