neo.mjs 6.18.2 → 6.19.0

package/src/layout/Fit.mjs

@@ -16,7 +16,12 @@ class Fit extends Base {
          * @member {String} ntype='layout-fit'
          * @protected
          */
-        ntype: 'layout-fit'
+        ntype: 'layout-fit',
+        /**
+         * @member {String|null} containerCls='neo-layout-fit'
+         * @protected
+         */
+        containerCls: 'neo-layout-fit'
     }
 
     /**
@@ -30,54 +35,20 @@ class Fit extends Base {
         }
     }
 
-    /**
-     * 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.Fit: applyRenderAttributes -> container not yet created', me.containerId)
-        }
-
-        NeoArray.add(wrapperCls, 'neo-layout-fit');
-
-        container.wrapperCls = wrapperCls
-    }
-
     /**
      * Removes all CSS rules from a container item this layout is bound to.
      * Gets called when switching to a different layout.
      * @param {Neo.component.Base} item
+     * @param {Number} index
      */
-    removeChildAttributes(item) {
+    removeChildAttributes(item, index) {
         if (!item.ignoreLayout) {
-            let wrapperCls = item.wrapperCls;
+            let {wrapperCls} = item;
 
             NeoArray.remove(wrapperCls, 'neo-layout-fit-item');
             item.wrapperCls = wrapperCls
         }
     }
-
-    /**
-     * Removes all CSS rules from the container this layout is bound to.
-     * Gets called when switching to a different layout.
-     */
-    removeRenderAttributes() {
-        let me         = this,
-            container  = Neo.getComponent(me.containerId),
-            wrapperCls = container?.wrapperCls || [];
-
-        if (!container) {
-            Neo.logError('layout.Fit: removeRenderAttributes -> container not yet created', me.containerId)
-        }
-
-        NeoArray.remove(wrapperCls, 'neo-layout-fit');
-
-        container.wrapperCls = wrapperCls
-    }
 }
 
 Neo.setupClass(Fit);

package/src/layout/Flexbox.mjs

@@ -107,11 +107,12 @@ class Flexbox extends Base {
     afterSetGap(value, oldValue) {
         if (!value && !oldValue) return;
 
-        let item  = Neo.getComponent(this.containerId),
-            style = item.wrapperStyle;
+        let {container}    = this,
+            {wrapperStyle} = container;
 
-        style.gap = value;
-        item.wrapperStyle = style
+        wrapperStyle.gap = value;
+
+        container.wrapperStyle = wrapperStyle
     }
 
     /**
@@ -155,10 +156,9 @@ class Flexbox extends Base {
      * Applies CSS classes to the container this layout is bound to
      */
     applyRenderAttributes() {
-        let me         = this,
-            container  = Neo.getComponent(me.containerId),
-            {prefix}   = me,
-            wrapperCls = container?.wrapperCls || [];
+        let me                  = this,
+            {container, prefix} = me,
+            {wrapperCls}        = container;
 
         if (!container) {
             Neo.logError('layout.Flexbox: applyRenderAttributes -> container not yet created', me.containerId)
@@ -222,9 +222,10 @@ class Flexbox extends Base {
      * Removes all CSS rules from a container item this layout is bound to.
      * Gets called when switching to a different layout.
      * @param {Neo.component.Base} item
+     * @param {Number} index
      * @protected
      */
-    removeChildAttributes(item) {
+    removeChildAttributes(item, index) {
         let style = item.wrapperStyle || {};
 
         style.flex = item.flex || null;
@@ -237,10 +238,9 @@ class Flexbox extends Base {
      * @protected
      */
     removeRenderAttributes() {
-        let me         = this,
-            container  = Neo.getComponent(me.containerId),
-            {prefix}   = me,
-            wrapperCls = container?.wrapperCls || [];
+        let me                  = this,
+            {container, prefix} = me,
+            {wrapperCls}        = container;
 
         if (!container) {
             Neo.logError('layout.Flexbox: removeRenderAttributes -> container not yet created', me.containerId)
@@ -292,10 +292,9 @@ class Flexbox extends Base {
      * @protected
      */
     updateInputValue(value, oldValue, propertyName) {
-        let me         = this,
-            container  = Neo.getComponent(me.containerId),
-            {prefix}   = me,
-            wrapperCls = container?.wrapperCls;
+        let me                  = this,
+            {container, prefix} = me,
+            {wrapperCls}        = container;
 
         if (container?.rendered) {
             NeoArray.remove(wrapperCls, prefix + propertyName + '-' + oldValue);

package/src/layout/Form.mjs

@@ -18,15 +18,15 @@ class Form extends Base {
          */
         ntype: 'layout-form',
         /**
-         * flex css allows gap. This adds it to the component style
-         * @member {String} gap_=null
+         * @member {String|null} containerCls='neo-layout-fit'
+         * @protected
          */
-        gap_: null,
+        containerCls: 'neo-layout-form',
         /**
-         * CSS className prefix
-         * @member {String} prefix='neo-form-'
+         * flex css allows gap. This adds it to the component style
+         * @member {String} gap_=null
          */
-        prefix: 'neo-layout-form-'
+        gap_: null
     }
 
     /**
@@ -38,11 +38,12 @@ class Form extends Base {
     afterSetGap(value, oldValue) {
         if (!value && !oldValue) return;
 
-        let item  = Neo.getComponent(this.containerId),
-            style = item.wrapperStyle;
+        let {container}    = this,
+            {wrapperStyle} = container;
 
-        style.gap = value;
-        item.wrapperStyle = style
+        wrapperStyle.gap = value;
+
+        container.wrapperStyle = wrapperStyle
     }
 
     /**
@@ -62,77 +63,19 @@ class Form extends Base {
         }
     }
 
-    /**
-     * 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.Form: applyRenderAttributes -> container not yet created', me.containerId)
-        }
-
-        NeoArray.add(wrapperCls, 'neo-layout-form');
-
-        container.wrapperCls = wrapperCls
-    }
-
     /**
      * Removes all CSS rules from an container item this layout is bound to.
      * Gets called when switching to a different layout.
      * @param {Neo.component.Base} item
+     * @param {Number} index
      * @protected
      */
-    removeChildAttributes(item) {
+    removeChildAttributes(item, index) {
         let style = item.wrapperStyle || {};
 
         style.flex = item.flex || null;
         item.wrapperStyle = style
     }
-
-    /**
-     * Removes all CSS rules from the container this layout is bound to.
-     * Gets called when switching to a different layout.
-     */
-    removeRenderAttributes() {
-        let me         = this,
-            container  = Neo.getComponent(me.containerId),
-            wrapperCls = container?.wrapperCls || [];
-
-        if (!container) {
-            Neo.logError('layout.Form: removeRenderAttributes -> container not yet created', me.containerId)
-        }
-
-        NeoArray.remove(wrapperCls, 'neo-layout-form');
-
-        container.wrapperCls = wrapperCls
-    }
-
-    /**
-     * Updates the Container CSS wrapperCls
-     * @param {String|null} value
-     * @param {String|null} oldValue
-     * @param {String} propertyName
-     * @protected
-     */
-    updateInputValue(value, oldValue, propertyName) {
-        let me         = this,
-            container  = Neo.getComponent(me.containerId),
-            {prefix}   = me,
-            wrapperCls = container?.wrapperCls;
-
-        if (container?.rendered) {
-            NeoArray.remove(wrapperCls, prefix + propertyName + '-' + oldValue);
-
-            if (value !== null) {
-                NeoArray.add(wrapperCls, prefix + propertyName + '-' + value)
-            }
-
-            container.wrapperCls = wrapperCls
-        }
-    }
 }
 
 Neo.setupClass(Form);

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/main/addon/ResizeObserver.mjs

@@ -19,6 +19,12 @@ class NeoResizeObserver extends Base {
          * @protected
          */
         instance: null,
+        /**
+         * If a target node is not found when calling register(),
+         * we can specify the amount of retries with a 100ms delay.
+         * @member {Number} registerAttempts=3
+         */
+        registerAttempts: 3,
         /**
          * Remote method access for other workers
          * @member {Object} remote
@@ -92,9 +98,19 @@ class NeoResizeObserver extends Base {
     /**
      * @param {Object} data
      * @param {String} data.id
+     * @param {Number} count=0
      */
-    register(data) {
-        this.instance.observe(DomAccess.getElement(data.id))
+    async register(data, count=0) {
+        let me   = this,
+            node = DomAccess.getElement(data.id);
+
+        if (node) {
+            me.instance.observe(node)
+        } else if (count < me.registerAttempts) {
+            await me.timeout(100);
+            count++;
+            me.register(data, count)
+        }
     }
 
     /**

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/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