@oscarpalmer/mora 0.32.0 → 0.33.0

package/src/models.ts

@@ -1,6 +1,6 @@
 import type {GenericCallback, Key, PlainObject} from '@oscarpalmer/atoms/models';
 import type {Subscription, Subscriptions} from '@oscarpalmer/atoms/subscription';
-import type {PROPERTY_LENGTH} from './constants';
+import {SYMBOL_EFFECT, SYMBOL_STATE, type PROPERTY_LENGTH} from './constants';
 
 // #region Types
 
@@ -28,20 +28,37 @@ export type EffectState = {
 	callback: GenericCallback;
 };
 
+export type InternalComputed = {
+	[SYMBOL_EFFECT]: ComputedEffect;
+} & InternalSignal;
+
+export type InternalProxy = {
+	[SYMBOL_STATE]: ReactiveProxyState;
+};
+
+export type InternalReadonly = {
+	frozen: boolean;
+} & InternalSignal;
+
+export type InternalSignal = {
+	[SYMBOL_STATE]: SignalState;
+};
+
 export type Reactive<Value> = {
 	/**
-	 * JSON representation of the value
+	 * _JSON_ representation of the value
 	 *
-	 * @returns JSON value
+	 * @returns _JSON_ value
 	 */
 	toJSON(): Value;
 
 	/**
 	 * String representation of the value
 	 *
+	 * @param json When `true`, returns the _JSON_ string representation of the value _(defaults to `false`)_
 	 * @returns Value as string
 	 */
-	toString(): string;
+	toString(json?: boolean): string;
 };
 
 export type ReactiveArray<Item> = {
@@ -230,25 +247,21 @@ export type ReactiveArray<Item> = {
 	/**
 	 * Subscribe to changes
 	 *
-	 * @param callback Callback for changes
+	 * @param subscriber Callback for changes
 	 * @param copy Copy the array? _(defaults to `false`)_
 	 * @returns Subscription
 	 */
-	subscribe(callback: (value: Item[]) => void, copy?: boolean): Subscription;
+	subscribe(subscriber: Subscriber<Item[]>, copy?: boolean): Subscription;
 
 	/**
 	 * Subscribe to changes at a specific index
 	 *
 	 * @param index Index of item to subscribe to
-	 * @param callback Callback for changes
+	 * @param subscriber Callback for changes
 	 * @param copy If the item is an array or record, should it be copied? _(defaults to `false`)_
 	 * @returns Subscription
 	 */
-	subscribe(
-		index: number,
-		callback: (value: Item | undefined) => void,
-		copy?: boolean,
-	): Subscription;
+	subscribe(index: number, subscriber: Subscriber<Item | undefined>, copy?: boolean): Subscription;
 
 	/**
 	 * Add items to the beginning of the array
@@ -276,14 +289,20 @@ export type ReactiveOptions<Value> = {
 	equal?: (first: Value, second: Value) => boolean;
 };
 
-export type ReactiveState<Value, Item = Value> = {
-	computeds: Set<ComputedEffect>;
-	effects: Set<EffectState>;
-	equal: (first: Item, second: Item) => boolean;
-	promise?: Promise<Value>;
+export type ReactiveProxyState = {
+	isArray: boolean;
+	length?: Signal<number>;
+	mapped?: Map<string, [Computed<unknown>, ComputedEffect]>;
+} & SignalState;
+
+export type ReactiveState = {
+	computeds?: Set<ComputedEffect>;
+	effects?: Set<EffectState>;
+	equal?: (first: unknown, second: unknown) => boolean;
+	promise?: Promise<unknown>;
 	promises?: Map<Key, Promise<never>>;
 	subscriptions?: Subscriptions<GenericCallback>;
-	value: Value;
+	value: unknown;
 };
 
 export type ReactiveStore<Store> = {
@@ -396,23 +415,23 @@ export type ReactiveStore<Store> = {
 	/**
 	 * Subscribe to changes
 	 *
-	 * @param callback Callback for changes
+	 * @param subscriber Callback for changes
 	 * @param copy Copy the store? _(defaults to `false`)_
 	 * @returns Subscription
 	 */
-	subscribe(callback: (value: Store) => void, copy?: boolean): Subscription;
+	subscribe(subscriber: Subscriber<Store>, copy?: boolean): Subscription;
 
 	/**
 	 * Subscribe to changes for a specific key
 	 *
 	 * @param key Key of the value to subscribe to
-	 * @param callback Callback for changes
+	 * @param subscriber Callback for changes
 	 * @param copy If the value is an array or record, should it be copied? _(defaults to `false`)_
 	 * @returns Subscription
 	 */
 	subscribe<Key extends keyof Store>(
 		key: Key,
-		callback: (value: Store[Key] | undefined) => void,
+		subscriber: Subscriber<Store[Key] | undefined>,
 		copy?: boolean,
 	): Subscription;
 
@@ -420,11 +439,11 @@ export type ReactiveStore<Store> = {
 	 * Subscribe to changes for a specific key
 	 *
 	 * @param key Key of the value to subscribe to
-	 * @param callback Callback for changes
+	 * @param subscriber Callback for changes
 	 * @param copy If the value is an array or record, should it be copied? _(defaults to `false`)_
 	 * @returns Subscription
 	 */
-	subscribe(key: Key, callback: (value: unknown) => void, copy?: boolean): Subscription;
+	subscribe(key: Key, subscriber: Subscriber<unknown>, copy?: boolean): Subscription;
 
 	/**
 	 * Update the value _(based on the current value)_
@@ -434,7 +453,7 @@ export type ReactiveStore<Store> = {
 	update(callback: (value: Store) => Store): void;
 } & Reactive<Store>;
 
-export type ReadonlyInstances<Value> = {
+type ReadonlyInstances<Value> = {
 	frozen?: ReadonlyFrozenSignal<Value>;
 	original?: ReadonlySignal<Value>;
 };
@@ -490,6 +509,10 @@ export type Signal<Value> = {
 } & Reactive<Value> &
 	SimpleReactive<Value>;
 
+export type SignalState = {
+	readonlies?: ReadonlyInstances<unknown>;
+} & ReactiveState;
+
 type SimpleReactive<Value> = {
 	/**
 	 * Get the value
@@ -509,20 +532,23 @@ type SimpleReactive<Value> = {
 	/**
 	 * Subscribe to changes
 	 *
-	 * @param callback Callback for changes
+	 * @param subscriber Callback for changes
 	 * @param copy If the value is an array or record, should it be copied? _(defaults to `false`)_
 	 * @returns Subscription
 	 */
-	subscribe(callback: (value: Value) => void, copy?: boolean): Subscription;
+	subscribe(subscriber: Subscriber<Value>, copy?: boolean): Subscription;
 };
 
 export type StoredSubscription = {
 	callback: GenericCallback;
 	copy: boolean;
 	frozen: boolean;
-	state: ReactiveState<unknown, never>;
+	instance: InternalSignal;
+	state: SignalState;
 };
 
+export type Subscriber<Value> = (value: Value, subscription: Subscription) => void;
+
 export type SubscriptionType = 'copy' | 'frozen' | 'original' | 'readonly';
 
 // #endregion

package/src/value/array.ts

@@ -6,7 +6,9 @@ import {
 	NAME_ARRAY,
 	NAME_MORA,
 	PROPERTY_LENGTH,
+	SYMBOL_STATE,
 } from '../constants';
+import {getState} from '../helpers/misc';
 import {
 	emitProxyValues,
 	getValueInProxy,
@@ -16,21 +18,92 @@ import {
 	updateProxyValue,
 } from '../helpers/proxy';
 import {subscribeToProxy} from '../helpers/subscription';
-import {emitValue, equalArrays} from '../helpers/value';
-import type {
-	Computed,
-	ComputedEffect,
-	ReactiveArray,
-	ReactiveOptions,
-	ReactiveState,
-	ReadonlyInstances,
-	Signal,
-} from '../models';
+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
 
 /**
@@ -66,131 +139,37 @@ 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 isArray = true;
-	const length = signal(0);
-	const mapped = new Map<number, [Computed<unknown>, ComputedEffect]>();
-	const readonlies: ReadonlyInstances<Item[]> = {};
-
-	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(isArray, state, target, property, value, length),
-	});
-
-	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): unknown {
-		return value === PROPERTY_LENGTH
-			? length.get()
-			: getValueInProxy(isArray, instance as never, state, mapped, value);
-	}
-
-	function set(first?: never, second?: never): void {
-		setProxyValue<Item[], Item>(true, state, setArrayValue, setAtIndex, first, second);
-	}
-
-	const instance = {
-		...rx,
-		asReadonly: (frozen?: never) => getReadonlyInstance(state, readonlies, frozen === true),
-		at: (index: never) => get(index),
-		clear: () => {
-			state.value.length = 0;
-		},
-		filter: (callback: never) => computed(() => filter(get(), callback)),
-		get: (value?: never) => get(value),
-		map: (callback: never) => computed(() => get().map(callback)),
-		notify: () => emitProxyValues(state, mapped),
-		peek: (first?: never, second?: never) => peekArrayValue(state, length, first, second),
-		pop: () => state.value.pop(),
-		push: (...items: Item[]) => state.value.push(...items),
-		select: (filter: never, map: never) => computed(() => select(get(), filter, map)),
-		set: (first?: never, second?: never) => set(first, second),
-		shift: () => state.value.shift(),
-		splice: (from: never, to?: never, ...items: Item[]) =>
-			state.value.splice(from, to ?? state.value.length, ...items),
-		subscribe: (first: never, second?: never, third?: never) =>
-			subscribeToProxy(isArray, instance as never, state, mapped, first, second, third),
-		unshift: (...items: Item[]) => state.value.unshift(...items),
-		update: (callback: never) => updateProxyValue(true, state, setArrayValue, setAtIndex, callback),
-	};
-
-	Object.defineProperties(instance, {
-		[NAME_MORA]: {
-			value: NAME_ARRAY,
-		},
-		length: {
-			enumerable: true,
-			get: () => length.get(),
-			set: (value: number) => setArrayLength(state, value),
-		},
-	});
-
-	set(value as never);
+export function array(value: unknown, options?: ReactiveOptions<unknown>): ReactiveArray<unknown> {
+	// @ts-expect-error All good, no worries :-)
+	return new ReactiveArray(value, options);
+}
 
-	return Object.freeze(instance) as never;
+function getArrayValues(this: InternalProxy, value?: unknown): unknown {
+	return value === PROPERTY_LENGTH
+		? this[SYMBOL_STATE].length!.get()
+		: getValueInProxy.call(this, value);
 }
 
-function peekArrayValue<Item>(
-	state: ReactiveState<Item[], Item>,
-	length: Signal<number>,
-	first?: unknown,
-	second?: boolean,
-): unknown {
-	return first === PROPERTY_LENGTH ? length.peek() : peekValueInProxy(true, state, first, second);
+function peekArrayValue(this: InternalProxy, first?: unknown, second?: boolean): unknown {
+	return first === PROPERTY_LENGTH
+		? this[SYMBOL_STATE].length!.peek()
+		: peekValueInProxy.call(this, first, second);
 }
 
-function setArrayLength<Item>(state: ReactiveState<Item[], Item>, value: number): void {
+function setArrayLength(state: ReactiveState, value: number): void {
 	if (
 		typeof value === 'number' &&
 		!Number.isNaN(value) &&
 		value >= 0 &&
-		value !== state.value.length
+		value !== (state.value as unknown[]).length
 	) {
-		state.value.length = value;
+		(state.value as unknown[]).length = value;
 	}
 }
 
-function setArrayValue<Value, Item = Value>(state: ReactiveState<Value, Item>, value: Value): void {
-	(state.value as unknown[]).splice(
-		0,
-		(state.value as unknown[]).length,
-		...((value as unknown[]) ?? []),
-	);
-}
-
-function setAtIndex<Value, Item = Value>(
-	state: ReactiveState<Value, Item>,
-	index: unknown,
-	value: Item,
-): void {
-	const actual =
-		(index as number) < 0
-			? (state.value as unknown[]).length + (index as number)
-			: (index as number);
-
-	if (actual > -1) {
-		(state.value as unknown[])[actual] = value;
-	}
-}
+function updateArray(instance: InternalProxy, type: string, array: unknown[]): unknown {
+	const state = instance[SYMBOL_STATE];
 
-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;
@@ -201,9 +180,9 @@ function updateArray<Item>(
 		if (
 			affectsLength ? array.length !== previousLength : !equalArrays(state, previousArray, array)
 		) {
-			emitValue(state);
+			emitValue(instance);
 
-			length.set(array.length);
+			state.length!.set(array.length);
 		}
 
 		return result;

package/src/value/computed.ts

@@ -1,18 +1,48 @@
+import type {GenericAsyncCallback, GenericCallback} from '@oscarpalmer/atoms/models';
 import {flushHandlers} from '../batch';
 import {
 	ACTIVE,
 	BATCH,
 	NAME_COMPUTED,
 	NAME_MORA,
-	SUBSCRIPTION_TYPES_COPY,
 	SUBSCRIPTION_TYPE_FROZEN,
 	SUBSCRIPTION_TYPES,
+	SUBSCRIPTION_TYPES_COPY,
+	SYMBOL_EFFECT,
+	SYMBOL_STATE,
 } from '../constants';
 import {internalEffect, runEffect} from '../effect';
+import {getState} from '../helpers/misc';
 import {subscribeToSignal} from '../helpers/subscription';
-import {handleSimpleValue, peekSimpleValue} from '../helpers/value';
-import type {Computed, ComputedEffect, ReactiveOptions, ReactiveState} from '../models';
-import {reactive} from './reactive';
+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
 
@@ -31,36 +61,22 @@ export function computed<Value>(
 }
 
 function getComputed<Value>(
-	callback: () => Value | Promise<Value>,
+	callback: GenericCallback,
 	options?: ReactiveOptions<Value>,
 ): [Computed<Value>, ComputedEffect] {
 	if (typeof callback !== 'function') {
 		throw new TypeError('Computed callback must be a function');
 	}
 
-	const [rx, state] = reactive<Value>(undefined as never, options);
-
-	let fx: ComputedEffect;
-
-	const instance = {
-		...rx,
-		get: () => getValue(state, fx),
-		peek: (copy?: never) => peekSimpleValue(state.value, copy === true),
-		subscribe: (callback: never, copy?: never) => subscribeToSignal(state, callback, copy === true),
-	};
+	// @ts-expect-error All good, no worries :-)
+	const instance = new Computed(callback, options);
 
-	Object.defineProperty(instance, NAME_MORA, {
-		value: NAME_COMPUTED,
-	});
-
-	fx = getComputedEffect(state, callback);
-
-	return [Object.freeze(instance) as never, 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,
@@ -73,7 +89,7 @@ function getComputedEffect<Value>(
 
 			ACTIVE.computed = fx;
 
-			handleSimpleValue(state, callback, setAndEmit, () => {
+			handleSignalValue(instance, callback, setAndEmit, () => {
 				ACTIVE.computed = previousComputed;
 			});
 
@@ -84,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);
 	}
 
@@ -100,26 +123,32 @@ 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.set(effect, effect);
+	if (state.effects != null && state.effects.size > 0) {
+		for (const effect of state.effects) {
+			BATCH.handlers.set(effect, effect);
+		}
 	}
 
 	for (const type of SUBSCRIPTION_TYPES) {
@@ -127,12 +156,13 @@ function setAndEmit<Value>(state: ReactiveState<Value, Value>, value: Value): vo
 			continue;
 		}
 
-		const copy = SUBSCRIPTION_TYPES_COPY.has(type);
 		const subscriptions = state.subscriptions?.values.to.keyed?.get(type);
 
-		if (subscriptions != null) {
+		if (subscriptions != null && subscriptions.size > 0) {
+			const copy = SUBSCRIPTION_TYPES_COPY.has(type);
+
 			for (const [, callback] of subscriptions) {
-				callback(peekSimpleValue(state.value, copy));
+				callback(peekSignalValue.call(instance, copy));
 			}
 		}
 	}