neo.mjs 4.3.9 → 4.3.10

package/src/draggable/list/DragZone.mjs

@@ -60,7 +60,6 @@ class DragZone extends BaseDragZone {
         let me    = this,
             owner = me.owner,
             store = owner.store,
-            vdom  = owner.vdom,
             node;
 
         store.items.forEach((record, index) => {
@@ -72,7 +71,7 @@ class DragZone extends BaseDragZone {
             }
         });
 
-        owner.vdom = vdom;
+        owner.update();
     }
 
     /**

package/src/draggable/tree/DragZone.mjs

@@ -42,7 +42,6 @@ class DragZone extends BaseDragZone {
         if (oldValue !== undefined) { // we only need to react to dynamic changes
             let owner = this.owner,
                 store = owner.store,
-                vdom  = owner.vdom,
                 node;
 
             store.items.forEach(record => {
@@ -53,7 +52,7 @@ class DragZone extends BaseDragZone {
                 }
             });
 
-            owner.vdom = vdom;
+            owner.update();
         }
     }
 

package/src/form/Fieldset.mjs

@@ -80,8 +80,7 @@ class Fieldset extends Container {
      * @protected
      */
     afterSetCollapsed(value, oldValue) {
-        let me   = this,
-            vdom = me.vdom;
+        let me = this;
 
         NeoArray[value ? 'add' : 'remove'](me._cls, 'neo-collapsed');
 
@@ -116,7 +115,7 @@ class Fieldset extends Container {
             }
         }
 
-        me.vdom = vdom;
+        me.update();
     }
 
     /**
@@ -206,8 +205,7 @@ class Fieldset extends Container {
     updateLegend() {
         let me      = this,
             iconCls = me.collapsed ? me.iconClsUnchecked : me.iconClsChecked,
-            title   = me.title,
-            vdom    = me.vdom;
+            title   = me.title;
 
         if (iconCls === '' && title === '') {
             if (me.legend) {
@@ -231,7 +229,7 @@ class Fieldset extends Container {
             }
         }
 
-        me.vdom = vdom;
+        me.update();
     }
 }
 

package/src/form/field/CheckBox.mjs

@@ -88,11 +88,10 @@ class CheckBox extends Base {
      * @protected
      */
     afterSetChecked(value, oldValue) {
-        let me   = this,
-            vdom = me.vdom;
+        let me = this;
 
-        vdom.cn[1].checked = value;
-        me.vdom = vdom;
+        me.vdom.cn[1].checked = value;
+        me.update();
 
         if (oldValue !== undefined) {
             me.fire('change', {
@@ -111,8 +110,7 @@ class CheckBox extends Base {
      */
     afterSetEnableLabelClicks(value, oldValue) {
         let me    = this,
-            vdom  = me.vdom,
-            label = vdom.cn[2];
+            label = me.vdom.cn[2];
 
         if (value) {
             label.for = me.getInputElId();
@@ -120,7 +118,7 @@ class CheckBox extends Base {
             delete label.for;
         }
 
-        me.vdom = vdom;
+        me.update();
     }
 
     /**
@@ -130,10 +128,8 @@ class CheckBox extends Base {
      * @protected
      */
     afterSetHideLabel(value, oldValue) {
-        let vdom = this.vdom;
-
-        vdom.cn[0].removeDom = value;
-        this.vdom = vdom;
+        this.vdom.cn[0].removeDom = value;
+        this.update();
     }
 
     /**
@@ -143,10 +139,8 @@ class CheckBox extends Base {
      * @protected
      */
     afterSetHideValueLabel(value, oldValue) {
-        let vdom = this.vdom;
-
-        vdom.cn[2].removeDom = value;
-        this.vdom = vdom;
+        this.vdom.cn[2].removeDom = value;
+        this.update();
     }
 
     /**
@@ -174,10 +168,8 @@ class CheckBox extends Base {
      * @protected
      */
     afterSetInputType(value, oldValue) {
-        let vdom = this.vdom;
-
-        vdom.cn[1].type = value;
-        this.vdom = vdom;
+        this.vdom.cn[1].type = value;
+        this.update();
     }
 
     /**
@@ -187,10 +179,8 @@ class CheckBox extends Base {
      * @protected
      */
     afterSetLabelText(value, oldValue) {
-        let vdom = this.vdom;
-
-        vdom.cn[0].innerHTML = value;
-        this.vdom = vdom;
+        this.vdom.cn[0].innerHTML = value;
+        this.update();
     }
 
     /**
@@ -200,12 +190,11 @@ class CheckBox extends Base {
      * @protected
      */
     afterSetLabelWidth(value, oldValue) {
-        let me   = this,
-            vdom = me.vdom;
+        let me = this;
 
         if (!me.hideLabel) {
-            vdom.cn[0].width = value;
-            me.vdom = vdom;
+            me.vdom.cn[0].width = value;
+            me.update();
         }
     }
 
@@ -216,10 +205,8 @@ class CheckBox extends Base {
      * @protected
      */
     afterSetName(value, oldValue) {
-        let vdom = this.vdom;
-
-        vdom.cn[1].name = value;
-        this.vdom = vdom;
+        this.vdom.cn[1].name = value;
+        this.update();
     }
 
     /**
@@ -230,10 +217,8 @@ class CheckBox extends Base {
      */
     afterSetValue(value, oldValue) {
         if (value) {
-            let vdom = this.vdom;
-
-            vdom.cn[1].value = value;
-            this.vdom = vdom;
+            this.vdom.cn[1].value = value;
+            this.update();
         }
 
         super.afterSetValue(value, oldValue);
@@ -246,12 +231,11 @@ class CheckBox extends Base {
      * @protected
      */
     afterSetValueLabelText(value, oldValue) {
-        let me   = this,
-            vdom = me.vdom;
+        let me = this;
 
         if (!me.hideValueLabel) {
-            vdom.cn[2].innerHTML = value;
-            me.vdom = vdom;
+            me.vdom.cn[2].innerHTML = value;
+            me.update();
         }
     }
 

package/src/form/field/Color.mjs

@@ -51,8 +51,7 @@ class Color extends Select {
         super.construct(config);
 
         let me           = this,
-            vdom         = me.vdom,
-            inputWrapper = VDomUtil.findVdomChild(vdom, {id: me.getInputWrapperId()});
+            inputWrapper = VDomUtil.findVdomChild(me.vdom, {id: me.getInputWrapperId()});
 
         inputWrapper.vdom.cn.unshift({
             cls  : 'neo-color',
@@ -62,7 +61,7 @@ class Color extends Select {
             }
         });
 
-        me.vdom = vdom;
+        me.update();
     }
 
     /**

package/src/form/field/Display.mjs

@@ -35,13 +35,12 @@ class Display extends Text {
         super.construct(config);
 
         let me      = this,
-            vdom    = me.vdom,
             inputEl = me.getInputEl();
 
         inputEl.readonly = 'readonly';
         inputEl.tabindex = '-1';
 
-        me.vdom = vdom;
+        me.update();
     }
 }
 

package/src/form/field/Number.mjs

@@ -79,7 +79,6 @@ class Number extends Text {
      */
     afterSetInputEditable(value, oldValue) {
         let me      = this,
-            vdom    = me.vdom,
             inputEl = me.getInputEl(),
             style   = inputEl.style || {};
 
@@ -89,7 +88,7 @@ class Number extends Text {
             style.pointerEvents = 'none';
         }
 
-        me.vdom = vdom;
+        me.update();
     }
 
     /**

package/src/form/field/Picker.mjs

@@ -183,7 +183,6 @@ class Picker extends Text {
         me.pickerIsMounted = false;
 
         if (silent) {
-            me._vdom = vdom;
             picker.mounted = false;
         } else {
             me.promiseVdomUpdate().then(data => {

package/src/form/field/Text.mjs

@@ -243,12 +243,9 @@ class Text extends Base {
      * @protected
      */
     afterSetHideLabel(value, oldValue) {
-        let me   = this,
-            vdom = me.vdom;
-
-        vdom.cn[0].removeDom = value;
-        me._vdom = vdom; // silent update
+        let me = this;
 
+        me.vdom.cn[0].removeDom = value;
         me.updateInputWidth();
     }
 
@@ -313,8 +310,6 @@ class Text extends Base {
             vdom.cn[0] = me.getLabelEl(); // remove the wrapper
 
             vdom.cn[0].width = me.labelWidth;
-
-            me._vdom = vdom; // silent update
             me.updateInputWidth();
         } else if (value === 'inline') {
             centerBorderElCls = ['neo-center-border'];
@@ -339,14 +334,11 @@ class Text extends Base {
                 }]
             };
 
-            me._vdom = vdom; // silent update
             me.updateInputWidth();
 
-            if (!isEmpty) {
-                setTimeout(() => {
-                    me.updateCenterBorderElWidth(false);
-                }, 20);
-            }
+            !isEmpty && setTimeout(() => {
+                me.updateCenterBorderElWidth(false);
+            }, 20);
         } else {
             // changes from e.g. left to top
             me.updateInputWidth();
@@ -361,24 +353,21 @@ class Text extends Base {
      */
     afterSetLabelText(value, oldValue) {
         let me      = this,
-            isEmpty = me.isEmpty(),
-            vdom    = me.vdom;
+            isEmpty = me.isEmpty();
 
         me.getLabelEl().innerHTML = value;
 
-        if (me.hideLabel) {
-            me._vdom = vdom; // silent update
-        } else {
+        if (!me.hideLabel) {
             if (me.labelPosition === 'inline') {
                 if (!isEmpty) {
                     delete me.getCenterBorderEl().width;
                 }
 
-                me.promiseVdomUpdate(vdom).then(() => {
+                me.promiseVdomUpdate().then(() => {
                     me.updateCenterBorderElWidth(isEmpty);
                 });
             } else {
-                me.vdom = vdom;
+                me.update();
             }
         }
     }
@@ -396,9 +385,6 @@ class Text extends Base {
                 label = vdom.cn[0];
 
             label.width = value;
-
-            me._vdom = vdom; // silent update
-
             !me.hideLabel && me.updateInputWidth();
         }
     }
@@ -560,9 +546,8 @@ class Text extends Base {
      * @protected
      */
     afterSetValue(value, oldValue) {
-        let me   = this,
-            cls  = me.cls,
-            vdom = me.vdom;
+        let me  = this,
+            cls = me.cls;
 
         me.getInputEl().value = value;
 
@@ -574,7 +559,7 @@ class Text extends Base {
         me.validate(); // silent
 
         me.cls  = cls;
-        me.vdom = vdom;
+        me.update();
 
         super.afterSetValue(value, oldValue); // fires the change event
     }
@@ -676,8 +661,7 @@ class Text extends Base {
      * @param {Array|Number|Object|String|null} value
      */
     changeInputElKey(key, value) {
-        let me   = this,
-            vdom = me.vdom;
+        let me = this;
 
         if (value || Neo.isBoolean(value) || value === 0) {
             me.getInputEl()[key] = value;
@@ -685,7 +669,7 @@ class Text extends Base {
             delete me.getInputEl()[key];
         }
 
-        me.vdom = vdom;
+        me.update();
     }
 
     /**
@@ -873,17 +857,15 @@ class Text extends Base {
      */
     onFocusEnter(data) {
         let me  = this,
-            cls = me.cls,
-            vdom;
+            cls = me.cls;
 
         NeoArray.add(cls, 'neo-focus');
         me.cls = cls;
 
         if (me.labelPosition === 'inline') {
             if (me.centerBorderElWidth) {
-                vdom = me.vdom;
                 me.getCenterBorderEl().width = me.centerBorderElWidth;
-                me.vdom = vdom;
+                me.update();
             } else {
                 me.updateCenterBorderElWidth(false);
             }
@@ -898,8 +880,7 @@ class Text extends Base {
     onFocusLeave(data) {
         let me             = this,
             centerBorderEl = me.getCenterBorderEl(), // labelPosition: 'inline'
-            cls            = me.cls,
-            vdom           = me.vdom;
+            cls            = me.cls;
 
         me.validate(); // silent
 
@@ -910,7 +891,7 @@ class Text extends Base {
             delete centerBorderEl.width;
         }
 
-        me.vdom = vdom;
+        me.update();
     }
 
     /**
@@ -1002,10 +983,8 @@ class Text extends Base {
             me.centerBorderElWidth = Math.round(data.width * .7) + 8;
 
             if (!silent) {
-                let vdom = me.vdom;
-
                 me.getCenterBorderEl().width = me.centerBorderElWidth;
-                me.vdom = vdom;
+                me.update();
             }
         });
     }
@@ -1015,8 +994,7 @@ class Text extends Base {
      @param {Boolean} silent=false
      */
     updateError(value, silent=false) {
-        let me   = this,
-            vdom = me.vdom,
+        let me = this,
             errorNode, isValid;
 
         if (!(me.validBeforeMount && !me.mounted)) {
@@ -1036,9 +1014,7 @@ class Text extends Base {
 
             errorNode.removeDom = isValid;
 
-            if (!silent) {
-                me.vdom = vdom;
-            }
+            !silent && me.update();
         }
     }
 
@@ -1048,16 +1024,15 @@ class Text extends Base {
      */
     updateInputWidth() {
         let me         = this,
-            inputWidth = me.getInputWidth(),
-            vdom       = me.vdom;
+            inputWidth = me.getInputWidth();
 
         if (inputWidth !== null && inputWidth !== me.width) {
-            vdom.cn[1].width = inputWidth;
+            me.vdom.cn[1].width = inputWidth;
         } else {
-            delete vdom.cn[1].width;
+            delete me.vdom.cn[1].width;
         }
 
-        me.vdom = vdom;
+        me.update();
     }
 
     /**

package/src/form/field/TextArea.mjs

@@ -97,11 +97,10 @@ class TextArea extends Text {
      */
     afterSetResizable(value, oldValue) {
         let me    = this,
-            style = this.getInputEl().style,
-            vdom  = me.vdom;
+            style = this.getInputEl().style;
 
         style.resize = value ? null : 'none';
-        me.vdom = vdom;
+        me.update();
     }
 
     /**

package/src/form/field/trigger/Base.mjs

@@ -119,11 +119,10 @@ class Base extends Component {
      * @protected
      */
     afterSetHidden(value, oldValue) {
-        let vdom  = this.vdom,
-            style = vdom.style || {};
+        let style = this.style;
 
         style.display = value ? 'none' : 'inline-block';
-        this.vdom = vdom;
+        this.style = style;
     }
 
     /**

package/src/form/field/trigger/SpinUpDown.mjs

@@ -41,15 +41,14 @@ class SpinUpDown extends Base {
      *
      */
     onConstructed() {
-        let me   = this,
-            vdom = me.vdom;
+        let me = this;
 
-        vdom.cn = [
+        me.vdom.cn = [
             {cls: ['neo-spin-button', 'neo-up',   me.spinButtonUpIconCls]},
             {cls: ['neo-spin-button', 'neo-down', me.spinButtonDownIconCls]}
         ];
 
-        me.vdom = vdom;
+        me.update();
 
         super.onConstructed();
     }

package/src/form/field/trigger/Time.mjs

@@ -53,8 +53,7 @@ class Time extends Picker {
     construct(config) {
         super.construct(config);
 
-        let me   = this,
-            vdom = me.vdom;
+        let me = this;
 
         me.clock = Neo.create({
             module  : Clock,
@@ -66,8 +65,8 @@ class Time extends Picker {
             ...me.clockConfig
         });
 
-        vdom.cn = [me.clock.vdom];
-        me.vdom = vdom;
+        me.vdom.cn = [me.clock.vdom];
+        me.update();
     }
 
     /**

package/src/grid/header/Toolbar.mjs

@@ -43,7 +43,6 @@ class Toolbar extends BaseToolbar {
             dockRightWidth = 0,
             items          = me.items,
             len            = items.length,
-            vdom           = me.vdom,
             style;
 
         items.forEach((item, index) => {
@@ -79,7 +78,7 @@ class Toolbar extends BaseToolbar {
             }
         });
 
-        me.vdom = vdom;
+        me.update();
     }
 }
 

package/src/layout/Card.mjs

@@ -135,7 +135,7 @@ class Card extends Base {
             }
 
             if (removeInactiveCards || needsUpdate) {
-                container.vdom = vdom;
+                container.update();
             }
         }
     }
@@ -159,7 +159,7 @@ class Card extends Base {
         if (!keepInDom && me.removeInactiveCards) {
             item.wrapperCls = childCls;
             vdom.removeDom  = !isActiveIndex;
-            item.vdom = vdom;
+            item.update();
         } else {
             item.wrapperCls = childCls;
         }

package/src/list/Base.mjs

@@ -374,13 +374,9 @@ class Base extends Component {
                 listItem && vdom.cn.push(listItem);
             });
 
-            if (silent) {
-                me._vdom = vdom;
-            } else {
-                me.promiseVdomUpdate().then(() => {
-                    me.fire('createItems');
-                });
-            }
+            !silent && me.promiseVdomUpdate().then(() => {
+                me.fire('createItems');
+            });
         }
     }
 
@@ -538,13 +534,12 @@ class Base extends Component {
      */
     onStoreRecordChange(data) {
         let me    = this,
-            index = data.index,
-            vdom  = me.vdom;
+            index = data.index;
 
         // ignore changes for records which have not been added to the list yet
         if (index > -1) {
-            vdom.cn[index] = me.createItem(data.record, index);
-            me.vdom = vdom;
+            me.vdom.cn[index] = me.createItem(data.record, index);
+            me.update();
         }
     }
 

package/src/list/plugin/Animate.mjs

@@ -265,15 +265,10 @@ class Animate extends Base {
             }
         });
 
-        if (hasAddedItems) {
-            owner.vdom = vdom;
-        }
+        hasAddedItems && owner.update();
 
         // ensure to get into the next animation frame
         setTimeout(() => {
-            // get the latest version of the vdom, since this is a delayed callback
-            vdom = owner.vdom;
-
             // new items are already added into the vdom, while old items are not yet removed
             // => we need a map to ensure getting the correct index
             map = vdom.cn.map(e => e.id);
@@ -309,8 +304,7 @@ class Animate extends Base {
                 }
             });
 
-            owner.vdom = vdom;
-
+            owner.update();
             me.triggerTransitionCallback();
         }, 50);
     }
@@ -359,9 +353,8 @@ class Animate extends Base {
             });
 
             if (hasChange) {
-                owner.vdom.cn = newVdomCn;
-
-                owner.vdom = vdom;
+                vdom.cn = newVdomCn;
+                owner.update();
 
                 // we need to ensure to get this call into the next animation frame
                 setTimeout(() => {
@@ -398,7 +391,7 @@ class Animate extends Base {
                 item.style.transform = `translate(${position.x}px, ${position.y}px)`;
             });
 
-            owner.vdom = vdom;
+            owner.update();
         }
     }