tab.Container: switching tabBarPosition does not correctly update the UI #7166

Author: tobiu

src/component/Circle.mjs

@@ -248,7 +248,7 @@ class Circle extends Component {
      * @protected
      */
     afterSetMaxItems(value, oldValue) {
-        if (oldValue && this.rendered) {
+        if (oldValue && this.vnodeInitialized) {
             let me      = this,
                 frontEl = me.getFrontEl();
 
@@ -289,7 +289,7 @@ class Circle extends Component {
     afterSetItemSize(value, oldValue) {
         let me = this;
 
-        if (oldValue && me.rendered) {
+        if (oldValue && me.vnodeInitialized) {
             !me.collapsed && me.updateOuterCircle(true);
             me.updateItemPositions()
         }
@@ -302,7 +302,7 @@ class Circle extends Component {
      * @protected
      */
     afterSetRotateX(value, oldValue) {
-        oldValue && this.rendered && this.rotate()
+        oldValue && this.vnodeInitialized && this.rotate()
     }
 
     /**
@@ -312,7 +312,7 @@ class Circle extends Component {
      * @protected
      */
     afterSetRotateY(value, oldValue) {
-        oldValue && this.rendered && this.rotate()
+        oldValue && this.vnodeInitialized && this.rotate()
     }
 
     /**
@@ -322,7 +322,7 @@ class Circle extends Component {
      * @protected
      */
     afterSetRotateZ(value, oldValue) {
-        oldValue && this.rendered && this.rotate()
+        oldValue && this.vnodeInitialized && this.rotate()
     }
 
     /**
@@ -344,7 +344,7 @@ class Circle extends Component {
      * @protected
      */
     afterSetSelectionModel(value, oldValue) {
-        this.rendered && value.register(this);
+        this.vnodeInitialized && value.register(this);
     }
 
     /**

src/component/Gallery.mjs

@@ -245,7 +245,7 @@ class Gallery extends Component {
     afterSetMaxItems(value, oldValue) {
         let me = this;
 
-        if (value && me.rendered) {
+        if (value && me.vnodeInitialized) {
             if (oldValue > value) {
                 me.destroyItems(value, oldValue - value)
             } else {
@@ -310,7 +310,7 @@ class Gallery extends Component {
                 len  = Math.min(me.maxItems, me.store.items.length),
                 view = me.getItemsRoot();
 
-            if (me.rendered) {
+            if (me.vnodeInitialized) {
                 me.refreshImageReflection();
 
                 me.timeout(50).then(() => {
@@ -338,7 +338,7 @@ class Gallery extends Component {
      */
     afterSetSelectionModel(value, oldValue) {
         oldValue?.destroy();
-        this.rendered && value.register(this)
+        this.vnodeInitialized && value.register(this)
     }
 
     afterSetTranslateX() {this.moveOrigin()}

src/component/Helix.mjs

@@ -348,7 +348,7 @@ class Helix extends Component {
     afterSetMaxItems(value, oldValue) {
         let me = this;
 
-        if (value && me.rendered) {
+        if (value && me.vnodeInitialized) {
             if (oldValue > value) {
                 me.destroyItems(value, oldValue - value)
             } else {
@@ -399,7 +399,7 @@ class Helix extends Component {
      * @protected
      */
     afterSetSelectionModel(value, oldValue) {
-        this.rendered && value.register(this)
+        this.vnodeInitialized && value.register(this)
     }
 
     /**
@@ -411,7 +411,7 @@ class Helix extends Component {
     afterSetUrl(value, oldValue) {
         let me = this;
 
-        if (me.rendered) {
+        if (me.vnodeInitialized) {
             me.destroyItems();
             me.loadData()
         }

src/dialog/Base.mjs

@@ -269,7 +269,7 @@ class Dialog extends Panel {
         NeoArray.toggle(me.vdom.cls, 'neo-modal', value);
         me.update();
 
-        me.rendered && me.syncModalMask()
+        me.vnodeInitialized && me.syncModalMask()
     }
 
     /**
@@ -432,7 +432,7 @@ class Dialog extends Panel {
         }
 
         // rendered outside the visible area
-        await me.render(true);
+        await me.initVnode(true);
 
         let [dialogRect, bodyRect] = await me.waitForDomRect({id: [me.id, 'document.body']});
 

src/form/field/Text.mjs

@@ -1579,8 +1579,7 @@ class Text extends Field {
     }
 
     /**
-     * Since triggers do not get rendered, assign the relevant props
-     * todo: this could be handled by component.Base
+     * Since triggers do not get vnodeInitialized, assign the relevant props
      */
     updateTriggerVnodes() {
         let me          = this,
@@ -1593,8 +1592,8 @@ class Text extends Field {
 
             trigger && Object.assign(trigger, {
                 vnode,
-                _rendered: true,
-                _mounted : true
+                _mounted         : true,
+                _vnodeInitialized: true
             })
         })
     }

src/grid/Body.mjs

@@ -397,7 +397,7 @@ class GridBody extends Component {
      * @protected
      */
     afterSetSelectionModel(value, oldValue) {
-        this.rendered && value.register(this)
+        this.vnodeInitialized && value.register(this)
     }
 
     /**

src/layout/Flexbox.mjs

@@ -295,7 +295,7 @@ class Flexbox extends Base {
             {container, prefix} = me,
             {wrapperCls}        = container;
 
-        if (container?.rendered) {
+        if (container?.vnodeInitialized) {
             NeoArray.remove(wrapperCls, prefix + propertyName + '-' + oldValue);
 
             if (value !== null) {

src/list/Base.mjs

@@ -351,7 +351,7 @@ class List extends Component {
      * @protected
      */
     afterSetSelectionModel(value, oldValue) {
-        this.rendered && value.register(this)
+        this.vnodeInitialized && value.register(this)
     }
 
     /**

src/tab/BodyContainer.mjs

@@ -12,10 +12,10 @@ class BodyContainer extends Container {
          */
         className: 'Neo.tab.BodyContainer',
         /**
-         * @member {String[]} baseCls=['neo-container', 'neo-tab-body-container']
+         * @member {String[]} baseCls=['neo-tab-body-container','neo-container']
          * @protected
          */
-        baseCls: ['neo-container', 'neo-tab-body-container']
+        baseCls: ['neo-tab-body-container', 'neo-container']
     }
 
     /**

src/table/Body.mjs

@@ -112,7 +112,7 @@ class TableBody extends Component {
      * @protected
      */
     afterSetSelectionModel(value, oldValue) {
-        this.rendered && value.register(this)
+        this.vnodeInitialized && value.register(this)
     }
 
     /**