@oscarpalmer/mora 0.28.0 → 0.30.0

package/dist/subscription.d.mts

@@ -1,15 +1,7 @@
 import { ReactiveState, Unsubscribe } from "./models.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
-export { Subscription, noop, subscribe, unsubscribe };
+export { noop, subscribe, unsubscribe };

package/dist/subscription.mjs

@@ -1,28 +1,27 @@
 //#region src/subscription.ts
-var Subscription = class {
-	callback;
-	state;
-	constructor(state, callback) {
-		this.state = state;
-		this.callback = callback;
-		callback(state.value);
-	}
-	destroy() {
-		this.callback = noop;
-		this.state = void 0;
-	}
-};
 function noop() {}
 function subscribe(state, callback) {
 	if (typeof callback !== "function" || state.subscriptions.has(callback)) return noop;
-	state.subscriptions.set(callback, new Subscription(state, callback));
+	state.subscriptions.set(callback, subscription(state, callback));
 	return () => {
 		unsubscribe(state, callback);
 	};
 }
+function subscription(state, callback) {
+	const instance = {
+		callback,
+		state,
+		destroy: () => {
+			instance.callback = noop;
+			instance.state = void 0;
+		}
+	};
+	callback(state.value);
+	return instance;
+}
 function unsubscribe(state, callback) {
 	state.subscriptions.get(callback)?.destroy();
 	state.subscriptions.delete(callback);
 }
 //#endregion
-export { Subscription, noop, subscribe, unsubscribe };
+export { noop, subscribe, unsubscribe };

package/dist/value/array.d.mts

@@ -1,138 +1,8 @@
-import { Reactive } from "./reactive.mjs";
-import { Computed } from "./computed.mjs";
-import { ReactiveOptions, Unsubscribe } from "../models.mjs";
-import { PROPERTY_LENGTH } from "../constants.mjs";
-
+import { ReactiveArray, ReactiveOptions } from "../models.mjs";
 //#region src/value/array.d.ts
-declare class ReactiveArray<Item> extends Reactive<Item[], Item> {
-  #private;
-  /**
-   * The length of the array
-   */
-  get length(): number;
-  /**
-   * Set the length of the array
-   */
-  set length(value: number);
-  constructor(value: Item[], options?: ReactiveOptions<Item>);
-  /**
-   * Clear the array
-   */
-  clear(): void;
-  /**
-   * Create a computed, filtered array
-   * @param callback Callback to evaluate each item
-   * @return Computed array of filtered items
-   */
-  filter(callback: (item: Item, index: number, array: Item[]) => boolean): Computed<Item[]>;
-  /**
-   * @inheritdoc
-   */
-  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
-   * @return 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;
-  /**
-   * @inheritdoc
-   */
-  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;
-  /**
-   * 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[];
-  /**
-   * @inheritdoc
-   */
-  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;
-  /**
-   * Update the value _(based on the current value)_
-   * @param callback Callback to update the value
-   */
-  update(callback: (value: Item[]) => Item[]): void;
-}
 /**
  * Create a reactive array from a function result
+ *
  * @param value Initial array of items
  * @param options Reactivity options
  * @returns Reactive array
@@ -140,6 +10,7 @@ declare class ReactiveArray<Item> extends Reactive<Item[], Item> {
 declare function array<Item>(value: () => Item[] | Promise<Item[]>, options?: ReactiveOptions<Item>): ReactiveArray<Item>;
 /**
  * Create a reactive array from a promise
+ *
  * @param value Initial array of items
  * @param options Reactivity options
  * @returns Reactive array
@@ -147,10 +18,11 @@ declare function array<Item>(value: () => Item[] | Promise<Item[]>, options?: Re
 declare function array<Item>(value: Promise<Item[]>, options?: ReactiveOptions<Item>): ReactiveArray<Item>;
 /**
  * Create a reactive array
+ *
  * @param value Initial array of items
  * @param options Reactivity options
  * @returns Reactive array
  */
 declare function array<Item>(value: Item[], options?: ReactiveOptions<Item>): ReactiveArray<Item>;
 //#endregion
-export { ReactiveArray, array };
+export { array };

package/dist/value/array.mjs

@@ -1,139 +1,82 @@
-import { METHODS_AFFECTING_LENGTH, METHODS_UPDATE, NAME_ARRAY } from "../constants.mjs";
-import { noop, subscribe } from "../subscription.mjs";
-import { Reactive } from "./reactive.mjs";
+import { METHODS_AFFECTING_LENGTH, METHODS_UPDATE, NAME_ARRAY, NAME_MORA } from "../constants.mjs";
+import { emitValue, equalArrays, getSimpleValue } from "../helpers/value.mjs";
+import { subscribe, unsubscribe } from "../subscription.mjs";
+import { reactive } from "./reactive.mjs";
 import { computed } from "./computed.mjs";
-import { emitValue, equalArrays, getValue } from "../helpers/value.mjs";
 import { emityProxyValues, getReactiveValueInProxy, setProxyValue, setValueInProxy } from "../helpers/proxy.mjs";
 import { signal } from "./signal.mjs";
+import { select } from "@oscarpalmer/atoms/array";
+import { filter } from "@oscarpalmer/atoms/array/filter";
+import { noop } from "@oscarpalmer/atoms/function";
 //#region src/value/array.ts
-var ReactiveArray = class extends Reactive {
-	#indiced = /* @__PURE__ */ new Map();
-	#size = signal(0);
-	/**
-	* The length of the array
-	*/
-	get length() {
-		return this.#size.get();
-	}
-	/**
-	* Set the length of the array
-	*/
-	set length(value) {
-		if (typeof value === "number" && value >= 0 && value !== this.state.value.length) this.get().length = value;
-	}
-	constructor(value, options) {
-		super(NAME_ARRAY, new Proxy(value, {
-			get: (target, property) => METHODS_UPDATE.has(property) ? updateArray(property, target, this.state, this.#size) : Reflect.get(target, property),
-			set: (target, property, value) => setValueInProxy({
-				property,
-				target,
-				value,
-				isArray: true,
-				state: this.state,
-				length: this.#size
-			})
-		}), options);
-		this.#size.set(value.length);
-	}
-	/**
-	* Clear the array
-	*/
-	clear() {
-		this.length = 0;
-	}
-	/**
-	* Create a computed, filtered array
-	* @param callback Callback to evaluate each item
-	* @return Computed array of filtered items
-	*/
-	filter(callback) {
-		return computed(() => this.get().filter(callback));
-	}
-	get(first) {
-		if (typeof first === "number") return getReactiveValueInProxy(this, this.#indiced, first, true).get();
-		return first === "length" ? this.length : getValue(this.state);
-	}
-	/**
-	* Create a computed, mapped array
-	* @param callback Callback to transform each item
-	* @return Computed array of mapped items
-	*/
-	map(callback) {
-		return computed(() => this.get().map(callback));
-	}
-	/**
-	* 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() {
-		emityProxyValues(this.state, this.#indiced);
-	}
-	peek(value) {
-		if (value === "length") return this.#size.peek();
-		return typeof value === "number" ? this.state.value.at(value) : this.state.value.slice();
-	}
-	/**
-	* Remove and return the last item of the array
-	* @returns Removed item, or `undefined` if the array is empty
-	*/
-	pop() {
-		return this.state.value.pop();
-	}
-	/**
-	* Add items to the end of the array
-	* @param items Items to add
-	* @returns New array length
-	*/
-	push(...items) {
-		return this.state.value.push(...items);
-	}
-	set(first, second) {
-		setProxyValue(true, this.state, isArrayValue, isArrayIndex, setArray, setAtIndex, first, second);
-	}
-	/**
-	* Remove and return the first item of the array
-	* @returns Removed item, or `undefined` if the array is empty
-	*/
-	shift() {
-		return this.state.value.shift();
-	}
-	/**
-	* 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, to, ...items) {
-		return this.state.value.splice(from, to ?? this.state.value.length, ...items);
-	}
-	subscribe(first, second) {
-		if (typeof first === "number" && typeof second === "function") return getReactiveValueInProxy(this, this.#indiced, first, true).subscribe(second);
-		return typeof first === "function" ? subscribe(this.state, first) : noop;
-	}
-	/**
-	* Add items to the beginning of the array
-	* @param items Items to add
-	* @returns New array length
-	*/
-	unshift(...items) {
-		return this.state.value.unshift(...items);
-	}
-	/**
-	* Update the value _(based on the current value)_
-	* @param callback Callback to update the value
-	*/
-	update(callback) {
-		const updated = callback(this.state.value);
-		if (updated == null || Array.isArray(updated)) this.set(updated);
-	}
-};
 function array(value, options) {
-	const instance = new ReactiveArray([], options);
+	const [rx, state] = reactive([], options);
+	const indiced = /* @__PURE__ */ new Map();
+	const length = signal(0);
+	state.value = new Proxy([], {
+		get: (target, property) => METHODS_UPDATE.has(property) ? updateArray(property, target, state, length) : Reflect.get(target, property),
+		set: (target, property, value) => setValueInProxy({
+			length,
+			property,
+			state,
+			target,
+			value,
+			isArray: true
+		})
+	});
+	function get(value) {
+		return getArrayValue(instance, indiced, state, length, value);
+	}
+	const instance = {
+		...rx,
+		length: state.value.length,
+		at: (index) => get(index),
+		clear: () => {
+			state.value.length = 0;
+		},
+		filter: (callback) => computed(() => filter(get(), callback)),
+		get: (value) => get(value),
+		map: (callback) => computed(() => get().map(callback)),
+		notify: () => {
+			emityProxyValues(state, indiced);
+		},
+		peek: (value) => peekArrayValue(state, length, value),
+		pop: () => state.value.pop(),
+		push: (...items) => state.value.push(...items),
+		select: (filter, map) => computed(() => select(get(), filter, map)),
+		set: (first, second) => {
+			setProxyValue(true, state, isArrayValue, isArrayIndex, setArray, setAtIndex, first, second);
+		},
+		shift: () => state.value.shift(),
+		splice: (from, to, ...items) => state.value.splice(from, to ?? state.value.length, ...items),
+		subscribe: (first, second) => {
+			if (typeof first === "number" && typeof second === "function") return getReactiveValueInProxy(instance, indiced, first, true).subscribe(second);
+			return typeof first === "function" ? subscribe(state, first) : noop;
+		},
+		unshift: (...items) => state.value.unshift(...items),
+		unsubscribe: (first, second) => {
+			if (typeof first === "number" && typeof second === "function") getReactiveValueInProxy(instance, indiced, first, true)?.unsubscribe(second);
+			else if (typeof first === "function") unsubscribe(state, first);
+		},
+		update: (callback) => updateArrayValue(instance, state, callback)
+	};
+	Object.defineProperties(instance, {
+		[NAME_MORA]: {
+			enumerable: false,
+			value: NAME_ARRAY
+		},
+		length: {
+			enumerable: true,
+			get: () => length.get(),
+			set: (value) => setArrayLength(state, value)
+		}
+	});
 	instance.set(value);
-	return instance;
+	return Object.freeze(instance);
+}
+function getArrayValue(instance, indiced, state, length, first) {
+	if (typeof first === "number") return getReactiveValueInProxy(instance, indiced, first, true).get();
+	return first === "length" ? length.get() : getSimpleValue(state);
 }
 function isArrayIndex(value) {
 	return typeof value === "number";
@@ -141,6 +84,20 @@ function isArrayIndex(value) {
 function isArrayValue(value) {
 	return value == null || Array.isArray(value);
 }
+function peekArrayValue(state, length, value) {
+	if (value === "length") return length.peek();
+	return typeof value === "number" ? state.value.at(value) : state.value.slice();
+}
+function setArray(state, value) {
+	state.value.splice(0, state.value.length, ...value ?? []);
+}
+function setArrayLength(state, value) {
+	if (typeof value === "number" && value >= 0 && value !== state.value.length) state.value.length = value;
+}
+function setAtIndex(state, index, value) {
+	const actual = index < 0 ? state.value.length + index : index;
+	if (actual > -1) state.value[actual] = value;
+}
 function updateArray(type, array, state, length) {
 	const affectsLength = METHODS_AFFECTING_LENGTH.has(type);
 	const previousArray = affectsLength ? [] : array.slice();
@@ -154,12 +111,9 @@ function updateArray(type, array, state, length) {
 		return result;
 	};
 }
-function setArray(state, value) {
-	state.value.splice(0, state.value.length, ...value ?? []);
-}
-function setAtIndex(state, index, value) {
-	const actual = index < 0 ? state.value.length + index : index;
-	if (actual > -1) state.value[actual] = value;
+function updateArrayValue(instance, state, callback) {
+	const updated = callback(state.value);
+	if (updated == null || Array.isArray(updated)) instance.set(updated);
 }
 //#endregion
-export { ReactiveArray, array };
+export { array };

package/dist/value/computed.d.mts

@@ -1,21 +1,13 @@
-import { Reactive } from "./reactive.mjs";
-import { ReactiveOptions } from "../models.mjs";
-
+import { Computed, ComputedEffect, ReactiveOptions } from "../models.mjs";
 //#region src/value/computed.d.ts
-declare class Computed<Value> extends Reactive<Value> {
-  private readonly effect;
-  constructor(callback: () => Value | Promise<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 | Promise<Value>, options?: ReactiveOptions<Value>): Computed<Value>;
+declare function internalComputed<Value>(callback: () => Value | Promise<Value>, options?: ReactiveOptions<Value>): [Computed<Value>, ComputedEffect];
 //#endregion
-export { Computed, computed };
+export { computed, internalComputed };

package/dist/value/computed.mjs

@@ -1,68 +1,72 @@
-import { ACTIVE, BATCH, NAME_COMPUTED } from "../constants.mjs";
-import { effect, runEffect } from "../effect.mjs";
+import { ACTIVE, BATCH, NAME_COMPUTED, NAME_MORA } from "../constants.mjs";
+import { internalEffect, runEffect } from "../effect.mjs";
 import { flushHandlers } from "../batch.mjs";
-import { Reactive } from "./reactive.mjs";
+import { handleSimpleValue } from "../helpers/value.mjs";
+import { subscribe } from "../subscription.mjs";
+import { reactive } from "./reactive.mjs";
 //#region src/value/computed.ts
-var Computed = class extends Reactive {
-	effect = {
-		dirty: true,
-		instance: void 0
-	};
-	constructor(callback, options) {
-		super(NAME_COMPUTED, void 0, options);
-		this.effect.instance = effect(() => {
-			if (this.effect.dirty) {
-				setValue(this, this.state, callback);
-				this.effect.dirty = false;
-			}
-		});
-	}
-	/**
-	* @inheritdoc
-	*/
-	get() {
-		if (ACTIVE.computed != null && this !== ACTIVE.computed) this.state.computeds.add(ACTIVE.computed);
-		if (ACTIVE.effect != null && ACTIVE.effect !== this.effect.instance) this.state.effects.add(ACTIVE.effect);
-		if (this.effect.dirty && BATCH.depth === 0) runEffect(this.effect.instance);
-		return this.state.value;
-	}
-};
 /**
 * Create a computed value
+*
 * @param callback Callback to compute the value
 * @param options Reactivity options
 * @returns Computed value
 */
 function computed(callback, options) {
-	return new Computed(callback, options);
+	return getComputed(callback, options)[0];
+}
+function getComputed(callback, options) {
+	const [rx, state] = reactive(void 0, options);
+	let fx;
+	const instance = {
+		...rx,
+		get: () => getValue(state, fx),
+		peek: () => state.value,
+		subscribe: (callback) => subscribe(state, callback),
+		unsubscribe: (callback) => {
+			state.subscriptions.delete(callback);
+		}
+	};
+	Object.defineProperty(instance, NAME_MORA, {
+		enumerable: false,
+		value: NAME_COMPUTED
+	});
+	fx = getComputedEffect(state, callback);
+	return [Object.freeze(instance), fx];
+}
+function getComputedEffect(state, callback) {
+	const fx = {
+		dirty: true,
+		instance: void 0
+	};
+	fx.instance = internalEffect(() => {
+		if (fx.dirty) {
+			const previousComputed = ACTIVE.computed;
+			ACTIVE.computed = fx;
+			handleSimpleValue(state, callback, setAndEmit, () => {
+				ACTIVE.computed = previousComputed;
+			});
+			fx.dirty = false;
+		}
+	});
+	return fx;
+}
+function getValue(state, fx) {
+	if (ACTIVE.computed != null && fx !== ACTIVE.computed) state.computeds.add(ACTIVE.computed);
+	if (ACTIVE.effect != null && ACTIVE.effect !== fx.instance) state.effects.add(ACTIVE.effect);
+	if (fx.dirty && BATCH.depth === 0) runEffect(fx.instance);
+	return state.value;
+}
+function internalComputed(callback, options) {
+	return getComputed(callback, options);
 }
 function setAndEmit(state, value) {
 	if (state.equal(state.value, value)) return;
 	state.value = value;
-	for (const computed of state.computeds) computed.effect.dirty = true;
+	for (const computed of state.computeds) computed.dirty = true;
 	for (const effect of state.effects) BATCH.handlers.add(effect);
 	for (const [, subscription] of state.subscriptions) subscription.callback(value);
 	flushHandlers();
 }
-function setValue(instance, state, callback) {
-	const previousComputed = ACTIVE.computed;
-	ACTIVE.computed = instance;
-	try {
-		const value = callback();
-		if (value instanceof Promise) {
-			state.promise = value;
-			value.then((resolvedValue) => {
-				if (state.promise === value) {
-					state.promise = void 0;
-					setAndEmit(state, resolvedValue);
-				}
-			}).catch(() => {
-				if (state.promise === value) state.promise = void 0;
-			});
-		} else setAndEmit(state, value);
-	} finally {
-		ACTIVE.computed = previousComputed;
-	}
-}
 //#endregion
-export { Computed, computed };
+export { computed, internalComputed };

package/dist/value/reactive.d.mts

@@ -1,40 +1,5 @@
-import { ReactiveOptions, ReactiveState, Unsubscribe } from "../models.mjs";
-
+import { Reactive, ReactiveOptions, ReactiveState } from "../models.mjs";
 //#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;
-}
+declare function reactive<Value, Equal = Value>(value: Value, options?: ReactiveOptions<Equal>): [Reactive<Value>, ReactiveState<Value, Equal>];
 //#endregion
-export { Reactive };
+export { reactive };