@oscarpalmer/mora 0.27.0 → 0.28.0

package/src/value/computed.ts

@@ -1,6 +1,7 @@
+import {flushHandlers} from '../batch';
 import {ACTIVE, BATCH, NAME_COMPUTED} from '../constants';
 import {effect, runEffect} from '../effect';
-import type {ComputedEffect, ReactiveOptions} from '../models';
+import type {ComputedEffect, InternalComputed, ReactiveOptions, ReactiveState} from '../models';
 import {Reactive} from './reactive';
 
 export class Computed<Value> extends Reactive<Value> {
@@ -9,39 +10,15 @@ export class Computed<Value> extends Reactive<Value> {
 		instance: undefined as never,
 	};
 
-	constructor(callback: () => Value, options?: ReactiveOptions<Value>) {
+	constructor(callback: () => Value | Promise<Value>, options?: ReactiveOptions<Value>) {
 		super(NAME_COMPUTED, undefined as never, options);
 
 		this.effect.instance = effect(() => {
-			if (!this.effect.dirty) {
-				return;
-			}
-
-			const previousComputed = ACTIVE.computed;
-
-			ACTIVE.computed = this as never;
-
-			const value = callback();
-
-			ACTIVE.computed = previousComputed;
-
-			if (!this.state.equal(this.state.value, value)) {
-				this.state.value = value;
+			if (this.effect.dirty) {
+				setValue(this, this.state, callback);
 
-				for (const computed of this.state.computeds) {
-					computed.effect.dirty = true;
-				}
-
-				for (const effect of this.state.effects) {
-					BATCH.handlers.add(effect);
-				}
-
-				for (const [, subscription] of this.state.subscriptions) {
-					subscription.callback(value);
-				}
+				this.effect.dirty = false;
 			}
-
-			this.effect.dirty = false;
 		});
 	}
 
@@ -72,8 +49,66 @@ export class Computed<Value> extends Reactive<Value> {
  * @returns Computed value
  */
 export function computed<Value>(
-	callback: () => Value,
+	callback: () => Value | Promise<Value>,
 	options?: ReactiveOptions<Value>,
 ): Computed<Value> {
 	return new Computed(callback, options);
 }
+
+function setAndEmit<Value>(state: ReactiveState<Value, Value>, value: Value): void {
+	if (state.equal(state.value, value)) {
+		return;
+	}
+
+	state.value = value;
+
+	for (const computed of state.computeds) {
+		(computed as unknown as InternalComputed).effect.dirty = true;
+	}
+
+	for (const effect of state.effects) {
+		BATCH.handlers.add(effect);
+	}
+
+	for (const [, subscription] of state.subscriptions) {
+		subscription.callback(value);
+	}
+
+	flushHandlers();
+}
+
+function setValue<Value>(
+	instance: Computed<Value>,
+	state: ReactiveState<Value, Value>,
+	callback: () => Value | Promise<Value>,
+): void {
+	const previousComputed = ACTIVE.computed;
+
+	ACTIVE.computed = instance as never;
+
+	try {
+		const value = callback();
+
+		if (value instanceof Promise) {
+			state.promise = value;
+
+			value
+				.then(resolvedValue => {
+					if (state.promise === value) {
+						state.promise = undefined;
+
+						setAndEmit(state, resolvedValue);
+					}
+				})
+				.catch(() => {
+					if (state.promise === value) {
+						state.promise = undefined;
+					}
+				});
+		} else {
+			setAndEmit(state, value);
+		}
+	} finally {
+		ACTIVE.computed = previousComputed;
+	}
+}

package/src/value/signal.ts

@@ -1,6 +1,6 @@
 import {NAME_SIGNAL} from '../constants';
 import {emitValue, getValue} from '../helpers/value';
-import type {ReactiveOptions} from '../models';
+import type {ReactiveOptions, ReactiveState} from '../models';
 import {Reactive} from './reactive';
 
 export class Signal<Value> extends Reactive<Value> {
@@ -19,12 +19,8 @@ export class Signal<Value> extends Reactive<Value> {
 	 * Set the value
 	 * @param value New value
 	 */
-	set(value: Value): void {
-		if (!this.state.equal(this.state.value, value)) {
-			this.state.value = value;
-
-			emitValue(this.state);
-		}
+	set(value: Value | (() => Value | Promise<Value>) | Promise<Value>): void {
+		setValue<Value>(this.state, value);
 	}
 
 	/**
@@ -36,12 +32,84 @@ export class Signal<Value> extends Reactive<Value> {
 	}
 }
 
+function setAndEmit<Value>(state: ReactiveState<Value, Value>, value: Value): void {
+	if (!state.equal(state.value, value)) {
+		state.value = value;
+
+		emitValue(state);
+	}
+}
+
+function setValue<Value>(
+	state: ReactiveState<Value, Value>,
+	value: Value | (() => Value | Promise<Value>) | Promise<Value>,
+): void {
+	try {
+		let actual = value;
+
+		if (typeof value === 'function') {
+			actual = (value as () => Value | Promise<Value>)() as Value | Promise<Value>;
+		}
+
+		if (actual instanceof Promise) {
+			state.promise = actual;
+
+			void actual
+				.then(value => {
+					if (actual === state.promise) {
+						state.promise = undefined;
+
+						setAndEmit(state, value);
+					}
+				})
+				.catch(() => {
+					if (actual === state.promise) {
+						state.promise = undefined;
+					}
+				});
+		} else {
+			setAndEmit(state, actual as Value);
+		}
+	} catch {}
+}
+
+/**
+ * Create a reactive value from a function result
+ * @param value Initial value
+ * @param options Reactivity options
+ * @returns Reactive value
+ */
+export function signal<Value>(
+	value: () => Value | Promise<Value>,
+	options?: ReactiveOptions<Value>,
+): Signal<Value>;
+
+/**
+ * Create a reactive value from a promise
+ * @param value Initial value
+ * @param options Reactivity options
+ * @returns Reactive value
+ */
+export function signal<Value>(
+	value: Promise<Value>,
+	options?: ReactiveOptions<Value>,
+): Signal<Value>;
+
 /**
  * Create a reactive value
  * @param value Initial value
  * @param options Reactivity options
  * @returns Reactive value
  */
-export function signal<Value>(value: Value, options?: ReactiveOptions<Value>): Signal<Value> {
-	return new Signal<Value>(value, options);
+export function signal<Value>(value: Value, options?: ReactiveOptions<Value>): Signal<Value>;
+
+export function signal<Value>(
+	value: Value | (() => Value | Promise<Value>) | Promise<Value>,
+	options?: ReactiveOptions<Value>,
+): Signal<Value> {
+	const instance = new Signal<Value>(undefined as unknown as Value, options);
+
+	instance.set(value);
+
+	return instance;
 }

package/src/value/store.ts

@@ -1,5 +1,6 @@
 import {isKey, isPlainObject} from '@oscarpalmer/atoms/is';
 import type {GenericCallback, Key, PlainObject} from '@oscarpalmer/atoms/models';
+import {startBatch, stopBatch} from '../batch';
 import {NAME_STORE} from '../constants';
 import {
 	emityProxyValues,
@@ -8,7 +9,7 @@ import {
 	setValueInProxy,
 } from '../helpers/proxy';
 import {getValue} from '../helpers/value';
-import type {ReactiveOptions, Unsubscribe} from '../models';
+import type {ReactiveOptions, ReactiveState, Unsubscribe} from '../models';
 import {noop, subscribe} from '../subscription';
 import type {Computed} from './computed';
 import {Reactive} from './reactive';
@@ -96,14 +97,22 @@ export class Store<Value extends PlainObject> extends Reactive<Value, Value> {
 	 * Set the value
 	 * @param value New value _(defaults to an empty object)_
 	 */
-	set(value?: Value): void;
+	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]): void;
+	set<Key extends keyof Value>(
+		key: Key,
+		value: Value[Key] | (() => Value[Key] | Promise<Value[Key]>) | Promise<Value[Key]>,
+	): void;
 
 	/**
 	 * Set a value by key
@@ -113,11 +122,16 @@ export class Store<Value extends PlainObject> extends Reactive<Value, Value> {
 	set(key: Key, value: unknown): void;
 
 	set(first?: unknown, second?: unknown): void {
-		if (isKey(first)) {
-			(this.state.value as PlainObject)[first] = second;
-		} else if (first == null || isPlainObject(first)) {
-			setProxyValue(this.state.value, first ?? {});
-		}
+		setProxyValue<Value>(
+			false,
+			this.state,
+			isStoreObject,
+			isKey,
+			setObject,
+			setProperty,
+			first,
+			second,
+		);
 	}
 
 	/**
@@ -157,14 +171,80 @@ export class Store<Value extends PlainObject> extends Reactive<Value, Value> {
 	 * @param callback Callback to update the value
 	 */
 	update(callback: (value: Value) => Value): void {
-		const updated = callback({...this.state.value});
+		const updated = callback(this.state.value);
 
 		if (updated == null || isPlainObject(updated)) {
-			setProxyValue(this.state.value, updated ?? {});
+			setObject(this.state, updated);
+		}
+	}
+}
+
+function isStoreObject<Value extends PlainObject>(value: unknown): value is Value | undefined {
+	return value == null || isPlainObject(value);
+}
+
+function setObject(state: ReactiveState<PlainObject, never>, value: PlainObject | undefined): void {
+	startBatch();
+
+	const actual = value ?? {};
+	const proxy = state.value as PlainObject;
+
+	const proxyKeys = Object.keys(proxy);
+	const actualKeys = Object.keys(actual);
+
+	let {length} = proxyKeys;
+
+	for (let index = 0; index < length; index += 1) {
+		const key = proxyKeys[index];
+
+		proxy[key] = actualKeys.includes(key) ? actual[key] : undefined;
+	}
+
+	length = actualKeys.length;
+
+	for (let index = 0; index < length; index += 1) {
+		const key = actualKeys[index];
+
+		if (!proxyKeys.includes(key)) {
+			const keyedValue = actual[key];
+
+			proxy[key] = keyedValue;
 		}
 	}
+
+	stopBatch();
+}
+
+function setProperty<Value extends PlainObject>(
+	state: ReactiveState<Value, Value>,
+	key: unknown,
+	value: unknown,
+): void {
+	(state.value as PlainObject)[key as Key] = value;
 }
 
+/**
+ * Create a reactive store from a function result
+ * @param value Initial object value
+ * @param options Reactivity options
+ * @returns Reactive store
+ */
+export function store<Value extends PlainObject>(
+	value: () => Value | Promise<Value>,
+	options?: ReactiveOptions<Value>,
+): Store<Value>;
+
+/**
+ * Create a reactive store from a promise
+ * @param value Initial object value
+ * @param options Reactivity options
+ * @returns Reactive store
+ */
+export function store<Value extends PlainObject>(
+	value: Promise<Value>,
+	options?: ReactiveOptions<Value>,
+): Store<Value>;
+
 /**
  * Create a reactive store
  * @param value Initial object value
@@ -174,6 +254,15 @@ export class Store<Value extends PlainObject> extends Reactive<Value, Value> {
 export function store<Value extends PlainObject>(
 	value: Value,
 	options?: ReactiveOptions<Value>,
+): Store<Value>;
+
+export function store<Value extends PlainObject>(
+	value: Value | (() => Value | Promise<Value>) | Promise<Value>,
+	options?: ReactiveOptions<Value>,
 ): Store<Value> {
-	return new Store((isPlainObject(value) ? value : {}) as Value, options);
+	const instance = new Store({} as unknown as Value, options);
+
+	instance.set(value);
+
+	return instance;
 }

package/dist/constants-Cy6_M9Vk.d.mts

@@ -1,20 +0,0 @@
-import { n as Batch, t as Active } from "./models-QwNga87R.mjs";
-
-//#region src/constants.d.ts
-declare const ACTIVE: Active;
-declare const ARRAY_THRESHOLD = 100;
-declare const ARRAY_OFFSET = 25;
-declare const ARRAY_PEEK = 10;
-declare const BATCH: Batch;
-declare const METHODS_AFFECTING_LENGTH: Set<string>;
-declare const METHODS_UPDATE: Set<string>;
-declare const NAME_ARRAY = "array";
-declare const NAME_COMPUTED = "computed";
-declare const NAME_EFFECT = "effect";
-declare const NAME_MORA = "$mora";
-declare const NAME_SIGNAL = "signal";
-declare const NAME_STORE = "store";
-declare const NAME_ALL: Set<string>;
-declare const PROPERTY_LENGTH = "length";
-//#endregion
-export { BATCH as a, NAME_ALL as c, NAME_EFFECT as d, NAME_MORA as f, PROPERTY_LENGTH as h, ARRAY_THRESHOLD as i, NAME_ARRAY as l, NAME_STORE as m, ARRAY_OFFSET as n, METHODS_AFFECTING_LENGTH as o, NAME_SIGNAL as p, ARRAY_PEEK as r, METHODS_UPDATE as s, ACTIVE as t, NAME_COMPUTED as u };

package/dist/effect-BkupB1p9.d.mts

@@ -1,17 +0,0 @@
-import { GenericCallback } from "@oscarpalmer/atoms/models";
-
-//#region src/effect.d.ts
-declare class Effect {
-  private readonly $mora;
-  private readonly state;
-  constructor(callback: GenericCallback);
-}
-declare function runEffect(effect: Effect): void;
-/**
- * Create an effect
- * @param callback Callback for handling signal effects
- * @returns Effect
- */
-declare function effect(callback: GenericCallback): Effect;
-//#endregion
-export { effect as n, runEffect as r, Effect as t };

package/dist/models-QwNga87R.d.mts

@@ -1,148 +0,0 @@
-import { t as Effect } from "./effect-BkupB1p9.mjs";
-import { GenericCallback } from "@oscarpalmer/atoms/models";
-
-//#region src/subscription.d.ts
-declare class Subscription {
-  callback: GenericCallback;
-  state: ReactiveState<unknown, never>;
-  constructor(state: ReactiveState<unknown, never>, callback: GenericCallback);
-  destroy(): void;
-}
-declare function noop(): void;
-declare function subscribe<Value>(state: ReactiveState<Value, never>, callback: (value: Value) => void): Unsubscribe;
-declare function unsubscribe<Value>(state: ReactiveState<Value, never>, callback: (value: Value) => void): void;
-//#endregion
-//#region src/value/reactive.d.ts
-declare abstract class Reactive<Value, Equal = Value> {
-  protected readonly state: ReactiveState<Value, Equal>;
-  constructor(name: string, value: Value, options?: ReactiveOptions<Equal>);
-  /**
-   * Get the value
-   * @return Current value
-   */
-  abstract get(): Value;
-  /**
-   * Get the value _(without reactivity)_
-   * @return Current value
-   */
-  peek(): Value;
-  /**
-   * Subscribe to changes
-   * @param callback Callback for changes
-   * @return Unsubscribe callback
-   */
-  subscribe(callback: (value: Value) => void): Unsubscribe;
-  /**
-   * JSON representation of the value
-   * @return JSON value
-   */
-  toJSON(): Value;
-  /**
-   * String representation of the value
-   * @return Value as string
-   */
-  toString(): string;
-  /**
-   * Unsubscribe from changes
-   * @param callback Callback to unsubscribe
-   */
-  unsubscribe(callback: (value: Value) => void): void;
-}
-//#endregion
-//#region src/value/computed.d.ts
-declare class Computed<Value> extends Reactive<Value> {
-  private readonly effect;
-  constructor(callback: () => Value, options?: ReactiveOptions<Value>);
-  /**
-   * @inheritdoc
-   */
-  get(): Value;
-}
-/**
- * Create a computed value
- * @param callback Callback to compute the value
- * @param options Reactivity options
- * @returns Computed value
- */
-declare function computed<Value>(callback: () => Value, options?: ReactiveOptions<Value>): Computed<Value>;
-//#endregion
-//#region src/value/signal.d.ts
-declare class Signal<Value> extends Reactive<Value> {
-  constructor(value: Value, options?: ReactiveOptions<Value>);
-  /**
-   * @inheritdoc
-   */
-  get(): Value;
-  /**
-   * Set the value
-   * @param value New value
-   */
-  set(value: Value): void;
-  /**
-   * Update the value _(based on the current value)_
-   * @param callback Callback to update the value
-   */
-  update(callback: (value: Value) => Value): void;
-}
-/**
- * Create a reactive value
- * @param value Initial value
- * @param options Reactivity options
- * @returns Reactive value
- */
-declare function signal<Value>(value: Value, options?: ReactiveOptions<Value>): Signal<Value>;
-//#endregion
-//#region src/models.d.ts
-type Active = {
-  computed?: Computed<unknown>;
-  effect?: Effect;
-};
-type Batch = {
-  depth: number;
-  handlers: Set<Effect | Subscription>;
-};
-type ComputedEffect = {
-  dirty: boolean;
-  instance: Effect;
-};
-type EffectState = {
-  callback: GenericCallback;
-};
-type InternalComputed = {
-  readonly effect: ComputedEffect;
-  readonly state: ReactiveState<unknown, unknown>;
-};
-type InternalEffect = {
-  state: EffectState;
-};
-type ReactiveOptions<Value> = {
-  /**
-   * Method for comparing values for equality
-   * @param first First value
-   * @param second Second value
-   * @returns Are the values equal?
-   * @default Object.is
-   */
-  equal?: (first: Value, second: Value) => boolean;
-};
-type ReactiveState<Value, Equal> = {
-  computeds: Set<Computed<unknown>>;
-  effects: Set<Effect>;
-  equal: (first: Equal, second: Equal) => boolean;
-  subscriptions: Map<GenericCallback, Subscription>;
-  value: Value;
-};
-type SetValueInProxyParameters<Value, Equal> = {
-  target: Value;
-  property: PropertyKey;
-  value: unknown;
-  state: ReactiveState<Value, Equal>;
-  isArray: boolean;
-  length?: Signal<number>;
-};
-/**
- * Unsubscribe from changes
- */
-type Unsubscribe = () => void;
-//#endregion
-export { noop as _, InternalComputed as a, ReactiveState as c, Signal as d, signal as f, Subscription as g, Reactive as h, EffectState as i, SetValueInProxyParameters as l, computed as m, Batch as n, InternalEffect as o, Computed as p, ComputedEffect as r, ReactiveOptions as s, Active as t, Unsubscribe as u, subscribe as v, unsubscribe as y };