@oscarpalmer/mora 0.12.0 → 0.13.0

package/dist/array.cjs

@@ -0,0 +1,130 @@
+"use strict";
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value2) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value2);
+var _size;
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const reactive = require("./reactive.cjs");
+const signal = require("./signal.cjs");
+const value = require("./value.cjs");
+class ReactiveArray extends reactive.Reactive {
+  constructor(value2) {
+    super(
+      "array",
+      new Proxy(value2, {
+        get: (target, property) => updateMethods.has(property) ? updateArray(property, target, this.state, __privateGet(this, _size)) : Reflect.get(target, property),
+        set: (target, property, value22) => setValue(target, property, value22, this.state, __privateGet(this, _size))
+      })
+    );
+    __privateAdd(this, _size, signal.signal(0));
+    __privateGet(this, _size).set(value2.length);
+  }
+  /**
+   * The length of the array
+   */
+  get length() {
+    return __privateGet(this, _size).get();
+  }
+  /**
+   * Set the length of the array
+   */
+  set length(value2) {
+    if (typeof value2 === "number" && value2 >= 0 && value2 !== this.state.value.length) {
+      this.get().length = value2;
+    }
+  }
+  /**
+   * @inheritdoc
+   */
+  get() {
+    return value.getValue(this.state);
+  }
+  peek(length) {
+    return length === true ? __privateGet(this, _size).peek() : [...this.state.value];
+  }
+  set(first, second) {
+    if (Array.isArray(first)) {
+      this.state.value.splice(0, this.state.value.length, ...first);
+    } else if (first === "length") {
+      this.length = second;
+    } else if (typeof first === "number") {
+      this.state.value[first] = second;
+    }
+  }
+}
+_size = new WeakMap();
+function array(value2) {
+  return new ReactiveArray(Array.isArray(value2) ? value2 : []);
+}
+function emit(first, second) {
+  let { length } = first;
+  if (length !== second.length) {
+    return true;
+  }
+  let offset = 0;
+  if (length >= 100) {
+    offset = Math.round(length / 10);
+    offset = offset > 25 ? 25 : offset;
+    for (let index = 0; index < offset; index += 1) {
+      if (!Object.is(first[index], second[index])) {
+        return true;
+      }
+    }
+  }
+  length -= offset;
+  for (let index = offset; index < length; index += 1) {
+    if (!Object.is(first[index], second[index])) {
+      return true;
+    }
+  }
+  return false;
+}
+function setValue(target, property, value$1, state, length) {
+  const isIndex = !Number.isNaN(Number(property));
+  const isLength = property === "length";
+  if (!isIndex && !isLength) {
+    return Reflect.set(target, property, value$1);
+  }
+  const previous = Reflect.get(target, property);
+  if (Object.is(previous, value$1)) {
+    return true;
+  }
+  Reflect.set(target, property, value$1);
+  value.emitValue(state);
+  length.set(target.length);
+  return true;
+}
+function updateArray(type, array2, state, length) {
+  const affectsLength = lengthAffectingMethods.has(type);
+  const previousArray = affectsLength ? [] : [...array2];
+  const previousLength = array2.length;
+  return (...args) => {
+    const result = array2[type](
+      ...args
+    );
+    if (affectsLength ? array2.length !== previousLength : emit(previousArray, array2)) {
+      value.emitValue(state);
+      length.set(array2.length);
+    }
+    return result;
+  };
+}
+const lengthAffectingMethods = /* @__PURE__ */ new Set([
+  "pop",
+  "push",
+  "shift",
+  "unshift"
+]);
+const updateMethods = /* @__PURE__ */ new Set([
+  ...lengthAffectingMethods,
+  "copyWithin",
+  "fill",
+  "reverse",
+  "sort",
+  "splice"
+]);
+exports.ReactiveArray = ReactiveArray;
+exports.array = array;

package/dist/array.js

@@ -0,0 +1,130 @@
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var _size;
+import { Reactive } from "./reactive.js";
+import { signal } from "./signal.js";
+import { getValue, emitValue } from "./value.js";
+class ReactiveArray extends Reactive {
+  constructor(value) {
+    super(
+      "array",
+      new Proxy(value, {
+        get: (target, property) => updateMethods.has(property) ? updateArray(property, target, this.state, __privateGet(this, _size)) : Reflect.get(target, property),
+        set: (target, property, value2) => setValue(target, property, value2, this.state, __privateGet(this, _size))
+      })
+    );
+    __privateAdd(this, _size, signal(0));
+    __privateGet(this, _size).set(value.length);
+  }
+  /**
+   * The length of the array
+   */
+  get length() {
+    return __privateGet(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;
+    }
+  }
+  /**
+   * @inheritdoc
+   */
+  get() {
+    return getValue(this.state);
+  }
+  peek(length) {
+    return length === true ? __privateGet(this, _size).peek() : [...this.state.value];
+  }
+  set(first, second) {
+    if (Array.isArray(first)) {
+      this.state.value.splice(0, this.state.value.length, ...first);
+    } else if (first === "length") {
+      this.length = second;
+    } else if (typeof first === "number") {
+      this.state.value[first] = second;
+    }
+  }
+}
+_size = new WeakMap();
+function array(value) {
+  return new ReactiveArray(Array.isArray(value) ? value : []);
+}
+function emit(first, second) {
+  let { length } = first;
+  if (length !== second.length) {
+    return true;
+  }
+  let offset = 0;
+  if (length >= 100) {
+    offset = Math.round(length / 10);
+    offset = offset > 25 ? 25 : offset;
+    for (let index = 0; index < offset; index += 1) {
+      if (!Object.is(first[index], second[index])) {
+        return true;
+      }
+    }
+  }
+  length -= offset;
+  for (let index = offset; index < length; index += 1) {
+    if (!Object.is(first[index], second[index])) {
+      return true;
+    }
+  }
+  return false;
+}
+function setValue(target, property, value, state, length) {
+  const isIndex = !Number.isNaN(Number(property));
+  const isLength = property === "length";
+  if (!isIndex && !isLength) {
+    return Reflect.set(target, property, value);
+  }
+  const previous = Reflect.get(target, property);
+  if (Object.is(previous, value)) {
+    return true;
+  }
+  Reflect.set(target, property, value);
+  emitValue(state);
+  length.set(target.length);
+  return true;
+}
+function updateArray(type, array2, state, length) {
+  const affectsLength = lengthAffectingMethods.has(type);
+  const previousArray = affectsLength ? [] : [...array2];
+  const previousLength = array2.length;
+  return (...args) => {
+    const result = array2[type](
+      ...args
+    );
+    if (affectsLength ? array2.length !== previousLength : emit(previousArray, array2)) {
+      emitValue(state);
+      length.set(array2.length);
+    }
+    return result;
+  };
+}
+const lengthAffectingMethods = /* @__PURE__ */ new Set([
+  "pop",
+  "push",
+  "shift",
+  "unshift"
+]);
+const updateMethods = /* @__PURE__ */ new Set([
+  ...lengthAffectingMethods,
+  "copyWithin",
+  "fill",
+  "reverse",
+  "sort",
+  "splice"
+]);
+export {
+  ReactiveArray,
+  array
+};

package/dist/index.cjs

@@ -1,10 +1,12 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const array = require("./array.cjs");
 const batch = require("./batch.cjs");
 const computed = require("./computed.cjs");
 const effect = require("./effect.cjs");
 const is = require("./is.cjs");
 const signal = require("./signal.cjs");
+exports.array = array.array;
 exports.startBatch = batch.startBatch;
 exports.stopBatch = batch.stopBatch;
 exports.computed = computed.computed;

package/dist/index.js

@@ -1,9 +1,11 @@
+import { array } from "./array.js";
 import { startBatch, stopBatch } from "./batch.js";
 import { computed } from "./computed.js";
 import { effect } from "./effect.js";
 import { isComputed, isEffect, isReactive, isSignal } from "./is.js";
 import { signal } from "./signal.js";
 export {
+  array,
   computed,
   effect,
   isComputed,

package/dist/mora.full.js

@@ -1,3 +1,76 @@
+class Subscription {
+    state;
+    callback;
+    constructor(state, callback) {
+        this.state = state;
+        this.callback = callback;
+        callback(state.value);
+    }
+}
+function noop() { }
+function subscribe(state, callback) {
+    if (typeof callback !== 'function' || state.subscriptions.has(callback)) {
+        return noop;
+    }
+    state.subscriptions.set(callback, new Subscription(state, callback));
+    return () => {
+        unsubscribe(state, callback);
+    };
+}
+function unsubscribe(state, callback) {
+    const subscription = state.subscriptions.get(callback);
+    state.subscriptions.delete(callback);
+    if (subscription != null) {
+        subscription.callback = noop;
+        subscription.state = undefined;
+    }
+}
+
+class Reactive {
+    state = {
+        computeds: new Set(),
+        effects: new Set(),
+        subscriptions: new Map(),
+        value: undefined,
+    };
+    constructor(name, value) {
+        this.state.value = value;
+        Object.defineProperty(this, '$mora', {
+            value: name,
+        });
+    }
+    /**
+     * Get the value _(without reactivity)_
+     */
+    peek() {
+        return this.state.value;
+    }
+    /**
+     * Subscribe to changes
+     */
+    subscribe(callback) {
+        return subscribe(this.state, callback);
+    }
+    /**
+     * JSON representation of the value
+     */
+    toJSON() {
+        return this.get();
+    }
+    /**
+     * String representation of the value
+     */
+    toString() {
+        return String(this.get());
+    }
+    /**
+     * Unsubscribe from changes
+     */
+    unsubscribe(callback) {
+        unsubscribe(this.state, callback);
+    }
+}
+
 class Effect {
     constructor(callback) {
         Object.defineProperty(this, '$mora', {
@@ -87,67 +160,6 @@ function stopBatch() {
 const batchedHandlers = new Set();
 let batchDepth = 0;
 
-class Subscription {
-    state;
-    callback;
-    constructor(state, callback) {
-        this.state = state;
-        this.callback = callback;
-        callback(state.value);
-    }
-}
-function noop() { }
-function subscribe(state, callback) {
-    if (typeof callback !== 'function' || state.subscriptions.has(callback)) {
-        return noop;
-    }
-    state.subscriptions.set(callback, new Subscription(state, callback));
-    return () => {
-        unsubscribe(state, callback);
-    };
-}
-function unsubscribe(state, callback) {
-    const subscription = state.subscriptions.get(callback);
-    state.subscriptions.delete(callback);
-    if (subscription != null) {
-        subscription.callback = noop;
-        subscription.state = undefined;
-    }
-}
-
-class Reactive {
-    state = {
-        computeds: new Set(),
-        effects: new Set(),
-        subscriptions: new Map(),
-        value: undefined,
-    };
-    constructor(name, value) {
-        this.state.value = value;
-        Object.defineProperty(this, '$mora', {
-            value: name,
-        });
-    }
-    /**
-     * Get the value _(without reactivity)_
-     */
-    peek() {
-        return this.state.value;
-    }
-    /**
-     * Subscribe to changes
-     */
-    subscribe(callback) {
-        return subscribe(this.state, callback);
-    }
-    /**
-     * Unsubscribe from changes
-     */
-    unsubscribe(callback) {
-        unsubscribe(this.state, callback);
-    }
-}
-
 let activeComputed;
 class Computed extends Reactive {
     effect = {
@@ -201,6 +213,37 @@ function computed(callback) {
     return new Computed(callback);
 }
 
+function emitValue(state) {
+    for (const computed of state.computeds) {
+        computed.effect.dirty = true;
+    }
+    for (const effect of state.effects) {
+        batchedHandlers.add(effect);
+    }
+    for (const [, subscription] of state.subscriptions) {
+        batchedHandlers.add(subscription);
+    }
+    if (batchDepth === 0) {
+        flushEffects();
+    }
+}
+function getValue(state) {
+    if (activeComputed != null) {
+        state.computeds.add(activeComputed);
+    }
+    if (activeEffect != null) {
+        state.effects.add(activeEffect);
+    }
+    return state.value;
+}
+function setValue$1(state, value) {
+    if (Object.is(state.value, value)) {
+        return;
+    }
+    state.value = value;
+    emitValue(state);
+}
+
 class Signal extends Reactive {
     constructor(value) {
         super('signal', value);
@@ -209,34 +252,13 @@ class Signal extends Reactive {
      * @inheritdoc
      */
     get() {
-        if (activeComputed != null) {
-            this.state.computeds.add(activeComputed);
-        }
-        if (activeEffect != null) {
-            this.state.effects.add(activeEffect);
-        }
-        return this.state.value;
+        return getValue(this.state);
     }
     /**
      * Set the value
      */
     set(value) {
-        if (Object.is(this.state.value, value)) {
-            return;
-        }
-        this.state.value = value;
-        for (const computed of this.state.computeds) {
-            computed.effect.dirty = true;
-        }
-        for (const effect of this.state.effects) {
-            batchedHandlers.add(effect);
-        }
-        for (const [, subscription] of this.state.subscriptions) {
-            batchedHandlers.add(subscription);
-        }
-        if (batchDepth === 0) {
-            flushEffects();
-        }
+        setValue$1(this.state, value);
     }
     /**
      * Update the value
@@ -245,8 +267,133 @@ class Signal extends Reactive {
         this.set(callback(this.state.value));
     }
 }
+/**
+ * Create a reactive value
+ */
 function signal(value) {
     return new Signal(value);
 }
 
-export { computed, effect, isComputed, isEffect, isReactive, isSignal, signal, startBatch, stopBatch };
+class ReactiveArray extends Reactive {
+    #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) {
+        super('array', new Proxy(value, {
+            get: (target, property) => updateMethods.has(property)
+                ? updateArray(property, target, this.state, this.#size)
+                : Reflect.get(target, property),
+            set: (target, property, value) => setValue(target, property, value, this.state, this.#size),
+        }));
+        this.#size.set(value.length);
+    }
+    /**
+     * @inheritdoc
+     */
+    get() {
+        return getValue(this.state);
+    }
+    peek(length) {
+        return length === true ? this.#size.peek() : [...this.state.value];
+    }
+    set(first, second) {
+        if (Array.isArray(first)) {
+            this.state.value.splice(0, this.state.value.length, ...first);
+        }
+        else if (first === 'length') {
+            this.length = second;
+        }
+        else if (typeof first === 'number') {
+            this.state.value[first] = second;
+        }
+    }
+}
+/**
+ * Create a reactive array
+ */
+function array(value) {
+    return new ReactiveArray(Array.isArray(value) ? value : []);
+}
+function emit(first, second) {
+    let { length } = first;
+    if (length !== second.length) {
+        return true;
+    }
+    let offset = 0;
+    if (length >= 100) {
+        offset = Math.round(length / 10);
+        offset = offset > 25 ? 25 : offset;
+        for (let index = 0; index < offset; index += 1) {
+            if (!Object.is(first[index], second[index])) {
+                return true;
+            }
+        }
+    }
+    length -= offset;
+    for (let index = offset; index < length; index += 1) {
+        if (!Object.is(first[index], second[index])) {
+            return true;
+        }
+    }
+    return false;
+}
+function setValue(target, property, value, state, length) {
+    const isIndex = !Number.isNaN(Number(property));
+    const isLength = property === 'length';
+    if (!isIndex && !isLength) {
+        return Reflect.set(target, property, value);
+    }
+    const previous = Reflect.get(target, property);
+    if (Object.is(previous, value)) {
+        return true;
+    }
+    Reflect.set(target, property, value);
+    emitValue(state);
+    length.set(target.length);
+    return true;
+}
+function updateArray(type, array, state, length) {
+    const affectsLength = lengthAffectingMethods.has(type);
+    const previousArray = affectsLength ? [] : [...array];
+    const previousLength = array.length;
+    return (...args) => {
+        const result = array[type](...args);
+        if (affectsLength
+            ? array.length !== previousLength
+            : emit(previousArray, array)) {
+            emitValue(state);
+            length.set(array.length);
+        }
+        return result;
+    };
+}
+const lengthAffectingMethods = new Set([
+    'pop',
+    'push',
+    'shift',
+    'unshift',
+]);
+const updateMethods = new Set([
+    ...lengthAffectingMethods,
+    'copyWithin',
+    'fill',
+    'reverse',
+    'sort',
+    'splice',
+]);
+
+export { array, computed, effect, isComputed, isEffect, isReactive, isSignal, signal, startBatch, stopBatch };

package/dist/reactive.cjs

@@ -29,6 +29,18 @@ class Reactive {
   subscribe(callback) {
     return subscription.subscribe(this.state, callback);
   }
+  /**
+   * JSON representation of the value
+   */
+  toJSON() {
+    return this.get();
+  }
+  /**
+   * String representation of the value
+   */
+  toString() {
+    return String(this.get());
+  }
   /**
    * Unsubscribe from changes
    */

package/dist/reactive.js

@@ -27,6 +27,18 @@ class Reactive {
   subscribe(callback) {
     return subscribe(this.state, callback);
   }
+  /**
+   * JSON representation of the value
+   */
+  toJSON() {
+    return this.get();
+  }
+  /**
+   * String representation of the value
+   */
+  toString() {
+    return String(this.get());
+  }
   /**
    * Unsubscribe from changes
    */