neo.mjs 6.18.3 → 6.19.1

package/src/layout/Grid.mjs

@@ -16,24 +16,12 @@ class Grid extends Base {
          * @member {String} ntype='layout-hbox'
          * @protected
          */
-        ntype: 'layout-grid'
-    }
-
-    /**
-     * Applies CSS classes to the container this layout is bound to
-     */
-    applyRenderAttributes() {
-        let me         = this,
-            container  = Neo.getComponent(me.containerId),
-            wrapperCls = container?.wrapperCls || [];
-
-        if (!container) {
-            Neo.logError('layout.Grid: applyRenderAttributes -> container not yet created', me.containerId)
-        }
-
-        NeoArray.add(wrapperCls, 'neo-layout-grid');
-
-        container.wrapperCls = wrapperCls
+        ntype: 'layout-grid',
+        /**
+         * @member {String|null} containerCls='neo-layout-fit'
+         * @protected
+         */
+        containerCls: 'neo-layout-grid'
     }
 }
 

package/src/list/Base.mjs

@@ -593,10 +593,10 @@ class Base extends Component {
 
     /**
      * Calls focus() on the top level DOM node of this component or on a given node via id
-     * @param {String} id
+     * @param {String} [id=this.id]
      */
-    focus(id) {
-        Neo.main.addon.Navigator.navigateTo([id, this.navigator])
+    focus(id=this.id) {
+        this.mounted && Neo.main.addon.Navigator.navigateTo([id, this.navigator])
     }
 
     /**

package/src/main/mixin/DeltaUpdates.mjs

@@ -120,7 +120,7 @@ class DeltaUpdates extends Base {
             node       = this.getElement(delta.id),
             parentNode = this.getElement(delta.parentId);
 
-        if (parentNode) {
+        if (node && parentNode) {
             if (index >= parentNode.children.length) {
                 parentNode.appendChild(node)
             } else {
@@ -132,6 +132,18 @@ class DeltaUpdates extends Base {
         }
     }
 
+    /**
+     * @param {Object} delta
+     * @param {String} delta.parentId
+     */
+    du_removeAll(delta) {
+        let node = this.getElement(delta.parentId);
+
+        if (node) {
+            node.innerHTML = ''
+        }
+    }
+
     /**
      * @param {Object} delta
      * @param {String} delta.id
@@ -225,8 +237,8 @@ class DeltaUpdates extends Base {
                         });
                         break
                     case 'cls':
-                        node.classList.add(...value.add || []);
-                        node.classList.remove(...value.remove || []);
+                        value.add    && node.classList.add(...value.add);
+                        value.remove && node.classList.remove(...value.remove);
                         break
                     case 'innerHTML':
                         node.innerHTML = value || '';
@@ -311,6 +323,7 @@ class DeltaUpdates extends Base {
             focusNode     : me.du_focusNode,
             insertNode    : me.du_insertNode,
             moveNode      : me.du_moveNode,
+            removeAll     : me.du_removeAll,
             removeNode    : me.du_removeNode,
             replaceChild  : me.du_replaceChild,
             setTextContent: me.du_setTextContent,

package/src/model/Component.mjs

@@ -3,8 +3,9 @@ import ClassSystemUtil from '../util/ClassSystem.mjs';
 import NeoArray        from '../util/Array.mjs';
 import Observable      from '../core/Observable.mjs';
 
-const dataVariableRegex = /data((?!(\.[a-z_]\w*\(\)))\.[a-z_]\w*)+/gi,
-      variableNameRegex = /^\w*/;
+const dataVariableRegex   = /data((?!(\.[a-z_]\w*\(\)))\.[a-z_]\w*)+/gi,
+      twoWayBindingSymbol = Symbol.for('twoWayBinding'),
+      variableNameRegex   = /^\w*/;
 
 /**
  * An optional component (view) model for adding bindings to configs
@@ -213,6 +214,7 @@ class Component extends Base {
      * @param {String} componentId
      * @param {String} formatter
      * @param {String} value
+     * @returns {String[]}
      */
     createBindingByFormatter(componentId, formatter, value) {
         let me            = this,
@@ -220,7 +222,9 @@ class Component extends Base {
 
         formatterVars.forEach(key => {
             me.createBinding(componentId, key, value, formatter)
-        })
+        });
+
+        return formatterVars
     }
 
     /**
@@ -228,12 +232,21 @@ class Component extends Base {
      */
     createBindings(component) {
         Object.entries(component.bind).forEach(([key, value]) => {
+            let twoWayBinding = false,
+                formatterVars;
+
             if (Neo.isObject(value)) {
-                value = value.value
+                twoWayBinding = true;
+                value         = value.value
             }
 
             if (!this.isStoreValue(value)) {
-                this.createBindingByFormatter(component.id, value, key)
+                formatterVars = this.createBindingByFormatter(component.id, value, key);
+
+                if (twoWayBinding) {
+                    component.bind[key].key = formatterVars[0];
+                    component[twoWayBindingSymbol] = true;
+                }
             }
         })
     }
@@ -279,7 +292,13 @@ class Component extends Base {
 
         Object.defineProperty(root, key, {
             get() {
-                return root['_' + key]
+                let value = root['_' + key];
+
+                if (Neo.typeOf(value) === 'Date') {
+                    value = new Date(value.valueOf())
+                }
+
+                return value
             },
 
             set(value) {

package/src/util/Array.mjs

@@ -18,6 +18,7 @@ class NeoArray extends Base {
      * Only primitive items will get found as duplicates
      * @param {Array} arr
      * @param {*} items
+     * @returns {Array}
      */
     static add(arr, items) {
         if (!Array.isArray(items)) {
@@ -52,6 +53,41 @@ class NeoArray extends Base {
         return arr.includes(item)
     }
 
+    /**
+     * Inserts an item or Array of items to an array in case it does not already exist.
+     * Duplicates will only get matched by reference.
+     * @param {Array} arr
+     * @param {Number} index
+     * @param {*} items
+     * @returns {Array}
+     */
+    static insert(arr, index, items) {
+        if (!Array.isArray(items)) {
+            items = [items]
+        }
+
+        let len = items.length -1,
+            i   = len,
+            currentIndex, item;
+
+        // Iterate backwards
+        for (; i > -1; i--) {
+            item = items[i];
+
+            currentIndex = arr.indexOf(item);
+
+            if (index !== currentIndex) {
+                if (currentIndex > -1) {
+                    this.move(arr, currentIndex, index)
+                } else {
+                    arr.splice(index, 0, item)
+                }
+            }
+        }
+
+        return arr
+    }
+
     /**
      * Returns an array of items which are present in array1 and array2
      * Only supports primitive items