@oscarpalmer/mora 0.28.0 → 0.30.0

package/src/helpers/proxy.ts

@@ -1,68 +1,73 @@
 import type {ArrayOrPlainObject, Key, PlainObject} from '@oscarpalmer/atoms/models';
 import {PROPERTY_LENGTH} from '../constants';
-import type {InternalComputed, ReactiveState, SetValueInProxyParameters} from '../models';
-import type {ReactiveArray} from '../value/array';
-import {type Computed, computed} from '../value/computed';
-import type {Store} from '../value/store';
+import type {
+	Computed,
+	ComputedEffect,
+	ReactiveArray,
+	ReactiveState,
+	ReactiveStore,
+	SetValueInProxyParameters,
+} from '../models';
+import {internalComputed} from '../value/computed';
 import {emitValue} from './value';
 
 export function emityProxyValues<Value>(
 	state: ReactiveState<Value, Value>,
-	mapped: Map<Key, Computed<unknown>>,
+	mapped: Map<Key, [Computed<unknown>, ComputedEffect]>,
 ): void;
 
 export function emityProxyValues<Value>(
 	state: ReactiveState<Value[], Value>,
-	mapped: Map<Key, Computed<unknown>>,
+	mapped: Map<Key, [Computed<unknown>, ComputedEffect]>,
 ): void;
 
 export function emityProxyValues(
 	state: ReactiveState<unknown, unknown>,
-	mapped: Map<Key, Computed<unknown>>,
+	mapped: Map<Key, [Computed<unknown>, ComputedEffect]>,
 ): void {
 	const values = [...mapped.values()];
 	const {length} = values;
 
 	for (let index = 0; index < length; index += 1) {
-		(values[index] as unknown as InternalComputed).effect.dirty = true;
+		values[index][1].dirty = true;
 	}
 
 	emitValue(state);
 }
 
-export function getReactiveValueInProxy<Value>(
+export function getReactiveValueInProxy<Value, Result = Value>(
 	array: ReactiveArray<Value>,
-	mapped: Map<Key, Computed<unknown>>,
+	mapped: Map<Key, [Computed<unknown>, ComputedEffect]>,
 	index: number,
 	isArray: true,
-): Computed<unknown>;
+): Computed<Result>;
 
 export function getReactiveValueInProxy<Value extends PlainObject>(
-	store: Store<Value>,
-	mapped: Map<Key, Computed<unknown>>,
+	store: ReactiveStore<Value>,
+	mapped: Map<Key, [Computed<unknown>, ComputedEffect]>,
 	key: Key,
 	isArray: false,
 ): Computed<unknown>;
 
 export function getReactiveValueInProxy(
-	reactive: ReactiveArray<unknown> | Store<PlainObject>,
-	mapped: Map<Key, Computed<unknown>>,
+	reactive: ReactiveArray<unknown> | ReactiveStore<PlainObject>,
+	mapped: Map<Key, [Computed<unknown>, ComputedEffect]>,
 	key: Key,
 	isArray: boolean,
 ): Computed<unknown> {
 	let item = mapped.get(key);
 
 	if (item == null) {
-		item = computed(() =>
+		item = internalComputed(() =>
 			isArray
 				? (reactive.get() as unknown[]).at(key as number)
 				: (reactive.get() as PlainObject)[key],
-		) as Computed<unknown>;
+		);
 
 		mapped.set(key, item);
 	}
 
-	return item;
+	return item[0];
 }
 
 export function setProxyValue<Value, Item = Value>(

package/src/helpers/value.ts

@@ -1,10 +1,10 @@
 import {flushHandlers} from '../batch';
 import {ACTIVE, ARRAY_OFFSET, ARRAY_PEEK, ARRAY_THRESHOLD, BATCH} from '../constants';
-import type {InternalComputed, ReactiveState} from '../models';
+import type {ReactiveState} from '../models';
 
 export function emitValue<Value>(state: ReactiveState<Value, never>): void {
 	for (const computed of state.computeds) {
-		(computed as unknown as InternalComputed).effect.dirty = true;
+		computed.dirty = true;
 	}
 
 	for (const effect of state.effects) {
@@ -55,7 +55,7 @@ export function equalArrays<Value>(
 	return true;
 }
 
-export function getValue<Value>(state: ReactiveState<Value, never>): Value {
+export function getSimpleValue<Value>(state: ReactiveState<Value, never>): Value {
 	if (ACTIVE.computed != null) {
 		state.computeds.add(ACTIVE.computed);
 	}
@@ -66,3 +66,38 @@ export function getValue<Value>(state: ReactiveState<Value, never>): Value {
 
 	return state.value;
 }
+
+export function handleSimpleValue<Value>(
+	state: ReactiveState<Value, Value>,
+	origin: Value | (() => Value | Promise<Value>) | Promise<Value>,
+	setValue: (state: ReactiveState<Value, Value>, value: Value) => void,
+	onAfter?: () => void,
+): void {
+	try {
+		let actual = typeof origin === 'function' ? (origin as () => unknown)() : origin;
+
+		if (actual instanceof Promise) {
+			state.promise = actual;
+
+			void actual
+				.then(value => {
+					if (actual === state.promise) {
+						state.promise = undefined;
+
+						setValue(state, value);
+					}
+				})
+				.catch(() => {
+					if (actual === state.promise) {
+						state.promise = undefined;
+					}
+				});
+		} else {
+			setValue(state, actual as Value);
+		}
+	} catch {
+		// ?
+	} finally {
+		onAfter?.();
+	}
+}

package/src/index.ts

@@ -1,9 +1,8 @@
 export {startBatch, stopBatch} from './batch';
-export {effect, type Effect} from './effect';
+export {effect} from './effect';
 export {isArray, isComputed, isEffect, isReactive, isSignal} from './helpers/is';
-export type {Unsubscribe} from './models';
-export {array, type ReactiveArray} from './value/array';
-export {computed, type Computed} from './value/computed';
-export type {Reactive} from './value/reactive';
-export {signal, type Signal} from './value/signal';
-export {store, type Store} from './value/store';
+export type {Computed, Effect, ReactiveArray, ReactiveStore, Signal, Unsubscribe} from './models';
+export {array} from './value/array';
+export {computed} from './value/computed';
+export {signal} from './value/signal';
+export {store} from './value/store';

package/src/models.ts

@@ -1,37 +1,256 @@
 import type {GenericCallback, Key} from '@oscarpalmer/atoms/models';
-import type {Effect} from './effect';
-import type {Subscription} from './subscription';
-import type {Computed} from './value/computed';
-import type {Signal} from './value/signal';
+import type {PROPERTY_LENGTH} from './constants';
 
 export type Active = {
-	computed?: Computed<unknown>;
-	effect?: Effect;
+	computed?: ComputedEffect;
+	effect?: EffectState;
 };
 
 export type Batch = {
 	depth: number;
-	handlers: Set<Effect | Subscription>;
+	flushing: boolean;
+	handlers: Set<EffectState | Subscription>;
 };
 
+export type Computed<Value> = Reactive<Value> & SimpleReactive<Value>;
+
 export type ComputedEffect = {
 	dirty: boolean;
-	instance: Effect;
+	instance: EffectState;
 };
 
+export type Effect = {};
+
 export type EffectState = {
 	callback: GenericCallback;
 };
 
-export type InternalComputed = {
-	readonly effect: ComputedEffect;
-	readonly state: ReactiveState<unknown, unknown>;
-};
+export type Reactive<Value> = {
+	/**
+	 * JSON representation of the value
+	 *
+	 * @returns JSON value
+	 */
+	toJSON(): Value;
 
-export type InternalEffect = {
-	state: EffectState;
+	/**
+	 * String representation of the value
+	 *
+	 * @returns Value as string
+	 */
+	toString(): string;
 };
 
+export type ReactiveArray<Item> = {
+	/**
+	 * The length of the array
+	 */
+	get length(): number;
+
+	/**
+	 * Set the length of the array
+	 */
+	set length(value: number);
+
+	/**
+	 * Get the value at an index
+	 *
+	 * @param index Index of item to get _(if negative, starts from the end)_
+	 * @returns Item at index, or `undefined` if it doesn't exist
+	 */
+	at(index: number): Item | undefined;
+
+	/**
+	 * Clear the array
+	 */
+	clear(): void;
+
+	/**
+	 * Create a computed, filtered array
+	 *
+	 * @param callback Callback to evaluate each item
+	 * @returns Computed array of filtered items
+	 */
+	filter(callback: (item: Item, index: number, array: Item[]) => boolean): Computed<Item[]>;
+
+	/**
+	 * Get the array
+	 *
+	 * @returns Array of items
+	 */
+	get(): Item[];
+
+	/**
+	 * Get the value at an index
+	 *
+	 * @param index Index of item to get _(if negative, starts from the end)_
+	 * @returns Item at index, or `undefined` if it doesn't exist
+	 */
+	get(index: number): Item | undefined;
+
+	/**
+	 * Get the length of the array
+	 *
+	 * @returns Length of the array
+	 */
+	get(property: typeof PROPERTY_LENGTH): number;
+
+	/**
+	 * Create a computed, mapped array
+	 *
+	 * @param callback Callback to transform each item
+	 * @returns Computed array of mapped items
+	 */
+	map<Mapped>(callback: (item: Item, index: number, array: Item[]) => Mapped): Computed<Mapped[]>;
+
+	/**
+	 * Notify dependents of changes
+	 *
+	 * _This bypasses equality checks and will immediately notify dependents.
+	 * Use this only if you're modifying nested data that would be ignored by equality checks._
+	 */
+	notify(): void;
+
+	/**
+	 * Get the array _(without reactivity)_
+	 *
+	 * @returns Array of items
+	 */
+	peek(): Item[];
+
+	/**
+	 * Get the value at an index _(without reactivity)_
+	 *
+	 * @param index Index of item to get _(if negative, starts from the end)_
+	 * @returns Item at index, or `undefined` if it doesn't exist
+	 */
+	peek(index: number): Item | undefined;
+
+	/**
+	 * Get the length of the array _(without reactivity)_
+	 *
+	 * @returns Length of the array
+	 */
+	peek(property: typeof PROPERTY_LENGTH): number;
+
+	/**
+	 * Remove and return the last item of the array
+	 *
+	 * @returns Removed item, or `undefined` if the array is empty
+	 */
+	pop(): Item | undefined;
+
+	/**
+	 * Add items to the end of the array
+	 *
+	 * @param items Items to add
+	 * @returns New array length
+	 */
+	push(...items: Item[]): number;
+
+	/**
+	 * Create a computed, filtered, and mapped array
+	 *
+	 * @param filter Callback to evaluate each item
+	 * @param map Callback to transform each item
+	 * @returns Computed array of mapped items
+	 */
+	select<Mapped>(
+		filter: (item: Item, index: number, array: Item[]) => boolean,
+		map: (item: Item, index: number, array: Item[]) => Mapped,
+	): Computed<Mapped[]>;
+
+	/**
+	 * Set the value
+	 *
+	 * @param value New array of items _(defaults to an empty array)_
+	 */
+	set(
+		value?:
+			| Item[]
+			| (() => null | undefined | Item[] | Promise<null | undefined | Item[]>)
+			| Promise<null | undefined | Item[]>,
+	): void;
+
+	/**
+	 * Set the value at an index
+	 *
+	 * @param index Index of item to set _(if negative, starts from the end)_
+	 * @param value New item
+	 */
+	set(index: number, value: Item | (() => Item | Promise<Item>) | Promise<Item>): void;
+
+	/**
+	 * Set the length of the array
+	 *
+	 * @param value New array length
+	 */
+	set(property: typeof PROPERTY_LENGTH, value: number): void;
+
+	/**
+	 * Remove and return the first item of the array
+	 *
+	 * @returns Removed item, or `undefined` if the array is empty
+	 */
+	shift(): Item | undefined;
+
+	/**
+	 * Remove and return items from the array _(and optionally add new items)_
+	 *
+	 * @param from Index to start removing items from
+	 * @param to Index to stop removing items at _(defaults to the end of the array)_
+	 * @param items Optional items to add
+	 * @returns Removed items
+	 */
+	splice(from: number, to?: number, ...items: Item[]): Item[];
+
+	/**
+	 * Subscribe to changes
+	 *
+	 * @param callback Callback for changes
+	 * @returns Unsubscribe callback
+	 */
+	subscribe(callback: (value: Item[]) => void): Unsubscribe;
+
+	/**
+	 * Subscribe to changes at a specific index
+	 *
+	 * @param index Index of item to subscribe to
+	 * @param callback Callback for changes
+	 * @returns Unsubscribe callback
+	 */
+	subscribe(index: number, callback: (value: Item | undefined) => void): Unsubscribe;
+
+	/**
+	 * Add items to the beginning of the array
+	 * @param items Items to add
+	 * @returns New array length
+	 */
+	unshift(...items: Item[]): number;
+
+	/**
+	 * Unsubscribe from changes for a specific index
+	 *
+	 * @param index Index of the value to unsubscribe from
+	 * @param callback Callback to unsubscribe
+	 */
+	unsubscribe(index: number, callback: (item: Item | undefined) => void): void;
+
+	/**
+	 * Unsubscribe from changes
+	 *
+	 * @param callback Callback to unsubscribe
+	 */
+	unsubscribe(callback: (array: Item[]) => void): void;
+
+	/**
+	 * Update the value _(based on the current value)_
+	 *
+	 * @param callback Callback to update the value
+	 */
+	update(callback: (value: Item[]) => Item[]): void;
+} & Reactive<Item[]>;
+
 export type ReactiveOptions<Value> = {
 	/**
 	 * Method for comparing values for equality
@@ -44,8 +263,8 @@ export type ReactiveOptions<Value> = {
 };
 
 export type ReactiveState<Value, Equal> = {
-	computeds: Set<Computed<unknown>>;
-	effects: Set<Effect>;
+	computeds: Set<ComputedEffect>;
+	effects: Set<EffectState>;
 	equal: (first: Equal, second: Equal) => boolean;
 	promise?: Promise<Value>;
 	promises?: Map<Key, Promise<never>>;
@@ -53,6 +272,147 @@ export type ReactiveState<Value, Equal> = {
 	value: Value;
 };
 
+export type ReactiveStore<Value> = {
+	/**
+	 * Get the value
+	 *
+	 * @returns Current value
+	 */
+	get(): Value;
+
+	/**
+	 * Get a value by key
+	 *
+	 * @param key Key of the value to get
+	 * @returns Value for the specified key, or `undefined` if it doesn't exist
+	 */
+	get<Key extends keyof Value>(key: Key): Value[Key];
+
+	/**
+	 * Get a value by key
+	 *
+	 * @param key Key of the value to get
+	 * @returns Value for the specified key, or `undefined` if it doesn't exist
+	 */
+	get(key: Key): unknown;
+
+	/**
+	 * Notify dependents of changes
+	 *
+	 * _This bypasses equality checks and will immediately notify dependents.
+	 * Use this only if you're modifying nested data that would be ignored by equality checks._
+	 */
+	notify(): void;
+
+	/**
+	 * Get the value _(without reactivity)_
+	 *
+	 * @returns Current value
+	 */
+	peek(): Value;
+
+	/**
+	 * Get a value by key _(without reactivity)_
+	 *
+	 * @param key Key of the value to get
+	 * @returns Value for the specified key, or `undefined` if it doesn't exist
+	 */
+	peek<Key extends keyof Value>(key: Key): Value[Key];
+
+	/**
+	 * Get a value by key _(without reactivity)_
+	 *
+	 * @param key Key of the value to get
+	 * @returns Value for the specified key, or `undefined` if it doesn't exist
+	 */
+	peek(key: Key): unknown;
+
+	/**
+	 * Set the value
+	 *
+	 * @param value New value _(defaults to an empty object)_
+	 */
+	set(
+		value?:
+			| Value
+			| (() => null | undefined | Value | Promise<null | undefined | Value>)
+			| Promise<null | undefined | Value>,
+	): void;
+
+	/**
+	 * Set a value by key
+	 *
+	 * @param key Key of the value to set
+	 * @param value New value
+	 */
+	set<Key extends keyof Value>(
+		key: Key,
+		value: Value[Key] | (() => Value[Key] | Promise<Value[Key]>) | Promise<Value[Key]>,
+	): void;
+
+	/**
+	 * Set a value by key
+	 *
+	 * @param key Key of the value to set
+	 * @param value New value
+	 */
+	set(key: Key, value: unknown): void;
+
+	/**
+	 * Subscribe to changes
+	 *
+	 * @param callback Callback for changes
+	 * @returns Unsubscribe callback
+	 */
+	subscribe(callback: (value: Value) => void): Unsubscribe;
+
+	/**
+	 * Subscribe to changes for a specific key
+	 *
+	 * @param key Key of the value to subscribe to
+	 * @param callback Callback for changes
+	 * @returns Unsubscribe callback
+	 */
+	subscribe<Key extends keyof Value>(
+		key: Key,
+		callback: (value: Value[Key] | undefined) => void,
+	): Unsubscribe;
+
+	/**
+	 * Subscribe to changes for a specific key
+	 *
+	 * @param key Key of the value to subscribe to
+	 * @param callback Callback for changes
+	 * @returns Unsubscribe callback
+	 */
+	subscribe(key: Key, callback: (value: unknown) => void): Unsubscribe;
+
+	/**
+	 * Unsubscribe from changes for a specific key
+	 *
+	 * @param key Key of the value to unsubscribe from
+	 * @param callback Callback to unsubscribe
+	 */
+	unsubscribe<Key extends keyof Value>(
+		key: Key,
+		callback: (value: Value[Key] | undefined) => void,
+	): void;
+
+	/**
+	 * Unsubscribe from changes
+	 *
+	 * @param callback Callback to unsubscribe
+	 */
+	unsubscribe(callback: (value: Value) => void): void;
+
+	/**
+	 * Update the value _(based on the current value)_
+	 *
+	 * @param callback Callback to update the value
+	 */
+	update(callback: (value: Value) => Value): void;
+} & Reactive<Value>;
+
 export type SetValueInProxyParameters<Value, Equal> = {
 	target: Value;
 	property: PropertyKey;
@@ -62,6 +422,61 @@ export type SetValueInProxyParameters<Value, Equal> = {
 	length?: Signal<number>;
 };
 
+export type Signal<Value> = {
+	/**
+	 * Set the value
+	 *
+	 * @param value New value
+	 */
+	set(value: Value | (() => Value | Promise<Value>) | Promise<Value>): void;
+
+	/**
+	 * Update the value _(based on the current value)_
+	 *
+	 * @param callback Callback to update the value
+	 */
+	update(callback: (value: Value) => Value): void;
+} & Reactive<Value> &
+	SimpleReactive<Value>;
+
+type SimpleReactive<Value> = {
+	/**
+	 * Get the value
+	 *
+	 * @returns Current value
+	 */
+	get(): Value;
+
+	/**
+	 * Get the value _(without reactivity)_
+	 *
+	 * @returns Current value
+	 */
+	peek(): Value;
+
+	/**
+	 * Subscribe to changes
+	 *
+	 * @param callback Callback for changes
+	 * @returns Unsubscribe callback
+	 */
+	subscribe(callback: (value: Value) => void): Unsubscribe;
+
+	/**
+	 * Unsubscribe from changes
+	 *
+	 * @param callback Callback to unsubscribe
+	 */
+	unsubscribe(callback: (value: Value) => void): void;
+};
+
+export type Subscription = {
+	callback: GenericCallback;
+	state: ReactiveState<unknown, never>;
+
+	destroy(): void;
+};
+
 /**
  * Unsubscribe from changes
  */

package/src/subscription.ts

@@ -1,22 +1,4 @@
-import type {GenericCallback} from '@oscarpalmer/atoms/models';
-import type {ReactiveState, Unsubscribe} from './models';
-
-export class Subscription {
-	callback: GenericCallback;
-	state: ReactiveState<unknown, never>;
-
-	constructor(state: ReactiveState<unknown, never>, callback: GenericCallback) {
-		this.state = state;
-		this.callback = callback;
-
-		callback(state.value);
-	}
-
-	destroy(): void {
-		this.callback = noop;
-		this.state = undefined as never;
-	}
-}
+import type {ReactiveState, Subscription, Unsubscribe} from './models';
 
 export function noop(): void {}
 
@@ -28,13 +10,31 @@ export function subscribe<Value>(
 		return noop;
 	}
 
-	state.subscriptions.set(callback, new Subscription(state, callback));
+	state.subscriptions.set(callback, subscription(state, callback));
 
 	return () => {
 		unsubscribe(state, callback);
 	};
 }
 
+function subscription<Value>(
+	state: ReactiveState<Value, never>,
+	callback: (value: Value) => void,
+): Subscription {
+	const instance: Subscription = {
+		callback,
+		state,
+		destroy: () => {
+			instance.callback = noop;
+			instance.state = undefined as never;
+		},
+	};
+
+	callback(state.value);
+
+	return instance;
+}
+
 export function unsubscribe<Value>(
 	state: ReactiveState<Value, never>,
 	callback: (value: Value) => void,