native-document 1.0.253 → 1.0.255

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "native-document",
-  "version": "1.0.253",
+  "version": "1.0.255",
   "description": "A reactive JavaScript framework that preserves native DOM simplicity without sacrificing modern features",
   "author": "AfroCodeur <https://github.com/afrocodeur>",
   "license": "MIT",

package/src/components/form/field/FieldCollection.js

@@ -49,9 +49,6 @@ export default function FieldCollection(name, props = {}) {
         props,
     };
 
-    this.$description.value.interceptMutations((items) =>
-        items.map(item => Validator.isObservable(item) ? item : $.object(item)),
-    );
 }
 
 BaseComponent.extends(FieldCollection);
@@ -149,9 +146,6 @@ FieldCollection.prototype.transition = function(transitionName) {
 FieldCollection.prototype.model = function(observable) {
     if(Validator.isObservable(observable)) {
         this.$description.value = observable;
-        this.$description.value.interceptMutations((items) => {
-            return items.map(item => Validator.isObservable(item) ? item : $.object(item));
-        });
         return this;
     }
     this.$description.value.set(observable);

package/src/core/data/Observable.js

@@ -196,6 +196,7 @@ Observable.auto = (value, options = null) => {
     return new ObservableItem(value, options);
 };
 ObservableItem.auto = Observable.auto;
+ObservableArray.auto = Observable.auto;
 
 
 Observable.init = function(initialValue, configs = null) {

package/src/core/data/ObservableArray.js

@@ -8,6 +8,8 @@ import {nextTick} from '../utils/helpers';
 export const mutationMethods = ['push', 'pop', 'shift', 'unshift', 'reverse', 'sort', 'splice'];
 export const noMutationMethods = ['map', 'forEach', 'filter', 'reduce', 'some', 'every', 'find', 'findIndex', 'concat', 'includes', 'indexOf'];
 
+const toObservable = (item) => item?.__$Observable ? item : ObservableArray.auto(item);
+
 /**
  * Reactive array container extending ObservableItem.
  * Wraps a native array and triggers reactivity on mutations (push, pop, splice, etc.).
@@ -22,11 +24,31 @@ export const noMutationMethods = ['map', 'forEach', 'filter', 'reduce', 'some',
  * const items = Observable.array([1, 2, 3]);
  * items.push(4); // triggers reactivity
  */
-const ObservableArray = function (target, configs = null) {
+const ObservableArray = function (target, configs = { propagation: false, deep: true, reset: false }) {
     if(!Array.isArray(target)) {
         throw new NativeDocumentError('Observable.array : target must be an array');
     }
 
+
+    if(configs?.deep) {
+        target = target.map(toObservable);
+        this.interceptMutations((data, operations) => {
+            if(!operations.action || ['push', 'unshift', 'set', 'splice'].includes(operations.action)) {
+                if(operations.action === 'splice') {
+                    for(let i = 2, length = data.length; i < length; ++i) {
+                        data[i] = toObservable(data[i]);
+                    }
+                    return data;
+                }
+                if(operations.action === 'set') {
+                    data[0] = data[0].map(toObservable);
+                    return data;
+                }
+                return data.map(toObservable);
+            }
+        });
+    }
+
     ObservableItem.call(this, target, configs);
     if(process.env.NODE_ENV === 'development') {
         PluginsManager.emit('CreateObservableArray', this);
@@ -36,7 +58,7 @@ const ObservableArray = function (target, configs = null) {
 ObservableArray.prototype = Object.create(ObservableItem.prototype);
 ObservableArray.prototype.constructor = ObservableArray;
 ObservableArray.prototype.__$isObservableArray = true;
-
+ObservableArray.auto = () => {};
 
 Object.defineProperty(ObservableArray.prototype, 'length', {
     get() {
@@ -48,13 +70,21 @@ Object.defineProperty(ObservableArray.prototype, 'length', {
 ObservableArray.prototype.$mutate = function(action, args, mutateFn) {
     if(this.$mutationInterceptor) {
         const value = this.$mutationInterceptor(args, { action });
-        if(args !== undefined) {
+        if(value != null) {
             args = value;
         }
     }
     mutateFn(args);
 };
 
+const $originalSet = ObservableArray.prototype.set;
+ObservableArray.prototype.set = function(...values) {
+    return this.$mutate('set', values, (argsToUse) => {
+        $originalSet.call(this, ...argsToUse);
+        return argsToUse[0];
+    });
+};
+
 mutationMethods.forEach((method) => {
     ObservableArray.prototype[method] = function(...values) {
         return this.$mutate(method, values, (argsToUse) => {
@@ -525,31 +555,27 @@ ObservableArray.prototype.isNotEmpty = function () {
 };
 
 ObservableArray.prototype.fnPush = function (item) {
-    const self = this;
-    return () => self.push(item);
+    return () => this.push(item);
 };
 
 ObservableArray.prototype.fnRemove = function (item) {
-    const self = this;
-    return () => self.removeItem(item);
+    return () => this.removeItem(item);
 };
 
 ObservableArray.prototype.fnRemoveAt = function (index) {
-    const self = this;
-    return () => self.remove(index);
+    return () => this.remove(index);
 };
 
 ObservableArray.prototype.fnClear = function () {
-    const self = this;
-    return () => self.clear();
+    return () => this.clear();
 };
 
-ObservableArray.prototype.rawValue = function () {
-    const result = [];
-    for(const element of this.$currentValue) {
-        result.push(element?.__$Observable ? element.val() : element);
-    }
-    return result;
-};
+// ObservableArray.prototype.resolve = function () {
+//     const result = [];
+//     for(const element of this.$currentValue) {
+//         result.push(element?.__$Observable ? element.val() : element);
+//     }
+//     return result;
+// };
 
 export default ObservableArray;

package/src/core/data/ObservableItem.js

@@ -734,26 +734,21 @@ ObservableItem.prototype.watch = function(fn, autoCall = true) {
 
 
 ObservableItem.prototype.fnSet = function(value) {
-    const self = this;
-    return () => self.set(value);
+    return () => this.set(value);
 };
 
 ObservableItem.prototype.fnToggle = function() {
-    const self = this;
-    return () => self.toggle();
+    return () => this.toggle();
 };
 
 ObservableItem.prototype.fnSetTrue = function() {
-    const self = this;
-    return () => self.set(true);
+    return () => this.set(true);
 };
 
 ObservableItem.prototype.fnSetFalse = function() {
-    const self = this;
-    return () => self.set(false);
+    return () => this.set(false);
 };
 
 ObservableItem.prototype.fnReset = function() {
-    const self = this;
-    return () => self.reset();
+    return () => this.reset();
 };