neo.mjs 10.0.0-alpha.5 → 10.0.0-beta.2

package/apps/realworld/view/article/PreviewComponent.mjs

@@ -227,7 +227,7 @@ class PreviewComponent extends Component {
      * @protected
      */
     afterSetTitle(value, oldValue) {
-        VDomUtil.getByFlag(this.vdom, 'title').html = value;
+        VDomUtil.getByFlag(this.vdom, 'title').text = value;
         this.update();
     }
 

package/apps/realworld/view/article/TagListComponent.mjs

@@ -36,7 +36,7 @@ class TagListComponent extends Component {
         _vdom:
         {cn: [
             {cls: ['sidebar'], cn: [
-                {tag: 'p', html: 'Popular Tags'},
+                {tag: 'p', text: 'Popular Tags'},
                 {cls: ['tag-list']}
             ]}
         ]}
@@ -96,7 +96,7 @@ class TagListComponent extends Component {
                     tag : 'a',
                     cls : ['tag-pill', 'tag-default'],
                     href: '',
-                    html: item,
+                    text: item,
                     id  : me.getTagVdomId(item)
                 });
             });

package/apps/realworld/view/user/ProfileComponent.mjs

@@ -69,7 +69,7 @@ class ProfileComponent extends Component {
                             ]},
                             {tag: 'a', cls: ['btn', 'btn-sm', 'btn-outline-secondary', 'action-btn'], flag: 'edit-profile', href: '#/settings', removeDom: true, cn: [
                                 {tag: 'i', cls: ['ion-gear-a']},
-                                {vtype: 'text', html: ' Edit Profile Settings'}
+                                {vtype: 'text', text: ' Edit Profile Settings'}
                             ]}
                         ]}
                     ]}
@@ -81,10 +81,10 @@ class ProfileComponent extends Component {
                         {cls: ['articles-toggle'], cn: [
                             {tag: 'ul', cls: ['nav', 'nav-pills', 'outline-active'], flag: 'feed-header', cn: [
                                 {tag: 'li', cls: ['nav-item'], cn: [
-                                    {tag: 'a', cls: ['nav-link', 'prevent-click', 'active'], href: '', html: 'My Articles'}
+                                    {tag: 'a', cls: ['nav-link', 'prevent-click', 'active'], href: '', text: 'My Articles'}
                                 ]},
                                 {tag: 'li', cls: ['nav-item'], cn: [
-                                    {tag: 'a', cls: ['nav-link', 'prevent-click'], href: '', html: 'Favorited Articles'}
+                                    {tag: 'a', cls: ['nav-link', 'prevent-click'], href: '', text: 'Favorited Articles'}
                                 ]}
                             ]}
                         ]}
@@ -170,7 +170,7 @@ class ProfileComponent extends Component {
      */
     afterSetBio(value, oldValue) {
         if (value) {
-            VDomUtil.getByFlag(this.vdom, 'bio').html = value;
+            VDomUtil.getByFlag(this.vdom, 'bio').text = value;
             this.update();
         }
     }
@@ -190,7 +190,7 @@ class ProfileComponent extends Component {
             NeoArray.add(node.cls, value ? 'btn-secondary' : 'btn-outline-secondary');
 
             node.cn[0].cls  = [value ? 'ion-minus-round' : 'ion-plus-round'];
-            node.cn[1].html = value ? ' Unfollow ' : ' Follow ';
+            node.cn[1].text = value ? ' Unfollow ' : ' Follow ';
             this.update();
         }
     }
@@ -231,8 +231,8 @@ class ProfileComponent extends Component {
     afterSetUsername(value, oldValue) {
         let vdom = this.vdom;
 
-        VDomUtil.getByFlag(vdom, 'following').cn[2].html = value;
-        VDomUtil.getByFlag(vdom, 'username').html = value;
+        VDomUtil.getByFlag(vdom, 'following').cn[2].text = value;
+        VDomUtil.getByFlag(vdom, 'username').text = value;
         this.update();
     }
 
@@ -273,7 +273,7 @@ class ProfileComponent extends Component {
             params     = {};
 
         if (!el.vdom.cls.includes('disabled')) {
-            switch (el.vdom.html) {
+            switch (el.vdom.text) {
                 case 'Favorited Articles':
                     params = {
                         favorited: me.username

package/apps/realworld/view/user/SettingsComponent.mjs

@@ -44,7 +44,7 @@ class SettingsComponent extends Component {
             {cls: ['container', 'page'], cn: [
                 {cls: ['row'], cn: [
                     {cls: ['col-md-6', 'offset-md-3', 'col-xs-12'], cn: [
-                        {tag: 'h1', cls: ['text-xs-center'], html: 'Your Settings'},
+                        {tag: 'h1', cls: ['text-xs-center'], text: 'Your Settings'},
                         {tag: 'ul', cls: ['error-messages'], flag: 'errors', removeDom: true},
                         {tag: 'form', cn: [
                             {tag: 'fieldset', cn: [
@@ -63,11 +63,11 @@ class SettingsComponent extends Component {
                                 {tag: 'fieldset', cls: ['form-group'], cn: [
                                     {tag: 'input', cls: ['form-control', 'form-control-lg'], flag: 'password', placeholder: 'Password', type: 'password'}
                                 ]},
-                                {tag: 'button', cls: ['btn', 'btn-lg', 'btn-primary', 'pull-xs-right'], html: 'Update Settings'}
+                                {tag: 'button', cls: ['btn', 'btn-lg', 'btn-primary', 'pull-xs-right'], text: 'Update Settings'}
                             ]}
                         ]},
                         {tag: 'hr'},
-                        {tag: 'button', cls: ['btn', 'btn-outline-danger'], html: 'Or click here to logout.'}
+                        {tag: 'button', cls: ['btn', 'btn-outline-danger'], text: 'Or click here to logout.'}
                     ]}
                 ]}
             ]}
@@ -133,7 +133,7 @@ class SettingsComponent extends Component {
         Object.entries(value).forEach(([key, value]) => {
             list.cn.push({
                 tag : 'li',
-                html: key + ' ' + value.join(' and ')
+                text: key + ' ' + value.join(' and ')
             });
         });
 

package/apps/realworld/view/user/SignUpComponent.mjs

@@ -93,7 +93,7 @@ class SignUpComponent extends Component {
         Object.entries(value || {}).forEach(([key, value]) => {
             list.cn.push({
                 tag : 'li',
-                html: key + ' ' + value.join(' and ')
+                text: key + ' ' + value.join(' and ')
             });
         });
 
@@ -141,16 +141,16 @@ class SignUpComponent extends Component {
             contentDiv = me.vdom.cn[0].cn[0].cn[0];
 
         // vdom bulk update
-        contentDiv.cn[0].html = isSignup ? 'Sign up' : 'Sign in';
+        contentDiv.cn[0].text = isSignup ? 'Sign up' : 'Sign in';
 
         contentDiv.cn[1].cn[0].href = isSignup ? '#/login' : '#/register';
-        contentDiv.cn[1].cn[0].html = isSignup ? 'Have an account?' : 'Need an account?';
+        contentDiv.cn[1].cn[0].text = isSignup ? 'Have an account?' : 'Need an account?';
 
         // remove the username fieldset if needed
         contentDiv.cn[3].cn[0].cn[0].removeDom = !isSignup;
 
         // submit button text
-        contentDiv.cn[3].cn[0].cn[3].html = isSignup ? 'Sign up' : 'Sign in';
+        contentDiv.cn[3].cn[0].cn[3].text = isSignup ? 'Sign up' : 'Sign in';
 
         me.update();
     }

package/apps/realworld2/view/FooterComponent.mjs

@@ -30,7 +30,7 @@ class FooterComponent extends Component {
                     tag : 'a',
                     cls : ['logo-font'],
                     href: '#/',
-                    html: 'conduit'
+                    text: 'conduit'
                 }, {
                     tag : 'span',
                     cls : 'attribution',

package/apps/realworld2/view/HomeContainer.mjs

@@ -38,10 +38,10 @@ class HomeContainer extends Container {
                     cn : [{
                         tag : 'h1',
                         cls : ['logo-font'],
-                        html: 'conduit v2'
+                        text: 'conduit v2'
                     }, {
                         tag : 'p',
-                        html: 'A place to share your knowledge.'
+                        text: 'A place to share your knowledge.'
                     }]
                 }]
             }
@@ -60,7 +60,7 @@ class HomeContainer extends Container {
                     cls   : ['neo-examples-tab-component'],
                     header: {iconCls: 'fa fa-user-ninja', text: 'Your Feed'},
                     style : {padding: '20px'},
-                    vdom  : {html: 'todo'}
+                    vdom  : {text: 'todo'}
                 }, {
                     module: PreviewList,
                     header: {iconCls: 'fa fa-globe-europe', text: 'Global Feed'}

package/apps/realworld2/view/article/DetailsContainer.mjs

@@ -16,7 +16,7 @@ class DetailsContainer extends Container {
          */
         items: [{
             ntype: 'component',
-            html : 'article.DetailsContainer'
+            text : 'article.DetailsContainer'
         }],
         /**
          * @member {Object} style

package/apps/realworld2/view/article/PreviewComponent.mjs

@@ -85,7 +85,7 @@ class PreviewComponent extends Component {
                 cn  : [
                     {tag: 'h1',   flag: 'title'},
                     {tag: 'p',    flag: 'description'},
-                    {tag: 'span', html: 'Read more...'}
+                    {tag: 'span', text: 'Read more...'}
                 ]
             }]
         }
@@ -120,7 +120,7 @@ class PreviewComponent extends Component {
 
         // todo: disabled until the new profile view is ready
         //node.href = href;
-        node.html = value;
+        node.text = value;
 
         //VDomUtil.getByFlag(vdom, 'userImageLink').href = href;
 
@@ -134,7 +134,7 @@ class PreviewComponent extends Component {
      * @protected
      */
     afterSetCreatedAt(value, oldValue) {
-        VDomUtil.getByFlag(this.vdom, 'createdAt').html = new Intl.DateTimeFormat('en-US', {
+        VDomUtil.getByFlag(this.vdom, 'createdAt').text = new Intl.DateTimeFormat('en-US', {
             day  : 'numeric',
             month: 'long',
             year : 'numeric'
@@ -150,7 +150,7 @@ class PreviewComponent extends Component {
      * @protected
      */
     afterSetDescription(value, oldValue) {
-        VDomUtil.getByFlag(this.vdom, 'description').html = value;
+        VDomUtil.getByFlag(this.vdom, 'description').text = value;
         this.update();
     }
 
@@ -182,7 +182,7 @@ class PreviewComponent extends Component {
      * @protected
      */
     afterSetFavoritesCount(value, oldValue) {
-        VDomUtil.getByFlag(this.vdom, 'favoritesCount').html = ' ' + value;
+        VDomUtil.getByFlag(this.vdom, 'favoritesCount').text = ' ' + value;
         this.update();
     }
 
@@ -225,7 +225,7 @@ class PreviewComponent extends Component {
                 tagList.cn.push({
                     tag : 'li',
                     cls : ['tag-default', 'tag-pill', 'tag-outline'],
-                    html: item
+                    text: item
                 })
             });
 
@@ -242,7 +242,7 @@ class PreviewComponent extends Component {
      * @protected
      */
     afterSetTitle(value, oldValue) {
-        VDomUtil.getByFlag(this.vdom, 'title').html = value;
+        VDomUtil.getByFlag(this.vdom, 'title').text = value;
         this.update();
     }
 

package/apps/realworld2/view/article/TagListComponent.mjs

@@ -38,7 +38,7 @@ class TagListComponent extends Component {
                 cls: ['sidebar'],
                 cn : [{
                     tag : 'p',
-                    html: 'Popular Tags'
+                    text: 'Popular Tags'
                 }, {
                     cls: ['tag-list']
                 }]
@@ -100,7 +100,7 @@ class TagListComponent extends Component {
                     tag : 'a',
                     cls : ['tag-pill', 'tag-default'],
                     href: '',
-                    html: item,
+                    text: item,
                     id  : me.getTagVdomId(item)
                 });
             });

package/apps/realworld2/view/user/ProfileContainer.mjs

@@ -16,7 +16,7 @@ class ProfileContainer extends Container {
          */
         items: [{
             ntype: 'component',
-            html : 'ProfileContainer'
+            text : 'ProfileContainer'
         }],
         /**
          * @member {Object} style

package/apps/route/view/center/CardAdministration.mjs

@@ -18,13 +18,13 @@ class CardAdministration extends Container {
 
         vdom: {
             tag : 'h1',
-            html: 'Access Granted.'
+            text: 'Access Granted.'
         }
     }
 
 
     afterSetUsername(value, oldValue) {
-        this.vdom.html = `Access Granted to ${this.username}.`;
+        this.vdom.text = `Access Granted to ${this.username}.`;
     }
 }
 

package/apps/route/view/center/CardAdministrationDenied.mjs

@@ -16,7 +16,7 @@ class CardAdministrationDenied extends Container {
 
         vdom: {
             tag : 'h1',
-            html: 'Access Denied.'
+            text: 'Access Denied.'
         }
     }
 }

package/apps/route/view/center/CardContact.mjs

@@ -16,8 +16,8 @@ class CardContact extends Container {
 
         items: [
             { cls : ['route_card_simple_page'], vdom: { cn: [
-                {tag: 'h1', html: 'Contact' },
-                {tag: 'a',  href: 'https://github.com/neomjs/neo', target: '_blank', html: 'please visit https://github.com/neomjs/neo'}
+                {tag: 'h1', text: 'Contact' },
+                {tag: 'a',  href: 'https://github.com/neomjs/neo', target: '_blank', text: 'please visit https://github.com/neomjs/neo'}
             ] } }
         ]
     }

package/apps/route/view/center/CardHome.mjs

@@ -16,7 +16,7 @@ class CardHome extends Container {
 
         vdom: {
             tag : 'h1',
-            html: 'This is the landing page of the example.'
+            text: 'This is the landing page of the example.'
         }
     }
 }

package/apps/route/view/center/CardSection1.mjs

@@ -16,7 +16,7 @@ class CardSection1 extends Container {
 
         vdom: {
             tag : 'h1',
-            html: 'This is section 1 of the example.'
+            text: 'This is section 1 of the example.'
         }
     }
 }

package/apps/route/view/center/CardSection2.mjs

@@ -16,7 +16,7 @@ class CardSection2 extends Container {
 
         vdom: {
             tag : 'h1',
-            html: 'This is section 2 of the example.'
+            text: 'This is section 2 of the example.'
         }
 
     }

package/apps/sharedcovid/view/AttributionComponent.mjs

@@ -21,7 +21,7 @@ class AttributionComponent extends Component {
          */
         vdom:
         {style: {margin: '20px'}, cn: [
-            {tag: 'h2', html: 'Attribution'},
+            {tag: 'h2', text: 'Attribution'},
             {tag: 'ul', cn: [
                 {tag: 'li', html: 'The logos were created by <a target="_blank" href="https://www.driefmeier.com/">Sebastian Driefmeier</a>. Thank you!'},
                 {tag: 'li', html: ['The logos are based on the image from <a target="_blank" href="https://phil.cdc.gov/Details.aspx?pid=23312">CDC Public Health Image Library (PHIL)</a>,</br>',

package/apps/sharedcovid/view/HeaderContainer.mjs

@@ -56,7 +56,7 @@ class HeaderContainer extends Container {
                     cls : ['covid-numberbox'],
                     vdom: {
                         cn: [
-                            {cls: ['covid-numberbox-title',  'cases'],  html:'Cases'},
+                            {cls: ['covid-numberbox-title',  'cases'],  text:'Cases'},
                             {cls: ['covid-numberbox-number', 'cases']}
                         ]
                     }
@@ -64,7 +64,7 @@ class HeaderContainer extends Container {
                     cls : ['covid-numberbox'],
                     vdom: {
                         cn: [
-                            {cls: ['covid-numberbox-title',  'active'], html:'Active'},
+                            {cls: ['covid-numberbox-title',  'active'], text:'Active'},
                             {cls: ['covid-numberbox-number', 'active']}
                         ]
                     }
@@ -72,7 +72,7 @@ class HeaderContainer extends Container {
                     cls : ['covid-numberbox'],
                     vdom: {
                         cn: [
-                            {cls: ['covid-numberbox-title',  'recovered'], html:'Recovered'},
+                            {cls: ['covid-numberbox-title',  'recovered'], text:'Recovered'},
                             {cls: ['covid-numberbox-number', 'recovered']}
                         ]
                     }
@@ -80,7 +80,7 @@ class HeaderContainer extends Container {
                     cls : ['covid-numberbox'],
                     vdom: {
                         cn: [
-                            {cls: ['covid-numberbox-title',  'deaths'], html:'Deaths'},
+                            {cls: ['covid-numberbox-title',  'deaths'], text:'Deaths'},
                             {cls: ['covid-numberbox-number', 'deaths']}
                         ]
                     }
@@ -97,7 +97,7 @@ class HeaderContainer extends Container {
                             'data-show-count': 'true',
                             'data-size'      : 'large',
                             href             : 'https://github.com/neomjs/neo',
-                            html             : 'Star'
+                            text             : 'Star'
                         }]
                     }
                 }, {
@@ -111,7 +111,7 @@ class HeaderContainer extends Container {
                             'data-icon'      : 'octicon-heart',
                             'data-size'      : 'large',
                             href             : 'https://github.com/sponsors/tobiu',
-                            html             : 'Sponsor'
+                            text             : 'Sponsor'
                         }]
                     }
                 }]

package/apps/sharedcovid/view/MainContainerController.mjs

@@ -139,10 +139,10 @@ class MainContainerController extends ComponentController {
 
         me.summaryData = data;
 
-        container.items[0].vdom.cn[1].html = Util.formatNumber({value: data.cases});
-        container.items[1].vdom.cn[1].html = Util.formatNumber({value: data.active});
-        container.items[2].vdom.cn[1].html = Util.formatNumber({value: data.recovered});
-        container.items[3].vdom.cn[1].html = Util.formatNumber({value: data.deaths});
+        container.items[0].vdom.cn[1].text = Util.formatNumber({value: data.cases});
+        container.items[1].vdom.cn[1].text = Util.formatNumber({value: data.active});
+        container.items[2].vdom.cn[1].text = Util.formatNumber({value: data.recovered});
+        container.items[3].vdom.cn[1].text = Util.formatNumber({value: data.deaths});
 
         container.updateDepth = 2;
         container.update();
@@ -150,7 +150,7 @@ class MainContainerController extends ComponentController {
         container = me.getReference('last-update');
         vdom      = container.vdom;
 
-        vdom.html = 'Last Update: ' + new Intl.DateTimeFormat('default', {
+        vdom.text = 'Last Update: ' + new Intl.DateTimeFormat('default', {
             hour  : 'numeric',
             minute: 'numeric',
             second: 'numeric'

package/apps/sharedcovid/view/TableContainerController.mjs

@@ -225,7 +225,7 @@ class TableContainerController extends ComponentController {
         // removed optional chaining for now, see: https://github.com/neomjs/neo/issues/467
         me.loadHistoricalData(record?.countryInfo?.iso2 || 'all');
 
-        me.getReference('historical-data-label').html = 'Historical Data (' + (record?.country || 'World') + ')';
+        me.getReference('historical-data-label').text = 'Historical Data (' + (record?.country || 'World') + ')';
     }
 
     /**

package/apps/sharedcovid/view/country/Gallery.mjs

@@ -45,24 +45,24 @@ class CountryGallery extends Gallery {
                     ]},
                     {tag: 'table', cls: ['neo-content-table'], cn: [
                         {tag: 'tr', cn: [
-                            {tag: 'td', html: 'Cases'},
+                            {tag: 'td', text: 'Cases'},
                             {tag: 'td', cls: ['neo-align-right']},
                             {tag: 'td', style: {width: '100%'}},
-                            {tag: 'td', html: 'Cases today'},
+                            {tag: 'td', text: 'Cases today'},
                             {tag: 'td', cls: ['neo-align-right']}
                         ]},
                         {tag: 'tr', cn: [
-                            {tag: 'td', html: 'Deaths'},
+                            {tag: 'td', text: 'Deaths'},
                             {tag: 'td', cls: ['neo-align-right', 'neo-content-deaths']},
                             {tag: 'td', style: {width: '100%'}},
-                            {tag: 'td', html: 'Deaths today'},
+                            {tag: 'td', text: 'Deaths today'},
                             {tag: 'td', cls: ['neo-align-right', 'neo-content-deaths']}
                         ]},
                         {tag: 'tr', cn: [
-                            {tag: 'td', html: 'Recovered'},
+                            {tag: 'td', text: 'Recovered'},
                             {tag: 'td', cls: ['neo-align-right', 'neo-content-recovered']},
                             {tag: 'td', style: {width: '100%'}},
-                            {tag: 'td', html: 'Critical'},
+                            {tag: 'td', text: 'Critical'},
                             {tag: 'td', cls: ['neo-align-right', 'neo-content-critical']}
                         ]}
                     ]}
@@ -127,15 +127,15 @@ class CountryGallery extends Gallery {
         firstChild.style.width  = me.itemWidth  + 'px';
 
         firstChild.cn[0].cn[0].src  = Util.getCountryFlagUrl(record.country);
-        firstChild.cn[0].cn[1].html = record.country;
+        firstChild.cn[0].cn[1].text = record.country;
 
-        table.cn[0].cn[1].html = fN({value: record.cases});
-        table.cn[1].cn[1].html = fN({value: record.deaths});
-        table.cn[2].cn[1].html = fN({value: record.recovered});
+        table.cn[0].cn[1].text = fN({value: record.cases});
+        table.cn[1].cn[1].text = fN({value: record.deaths});
+        table.cn[2].cn[1].text = fN({value: record.recovered});
 
-        table.cn[0].cn[4].html = fN({value: record.todayCases});
-        table.cn[1].cn[4].html = fN({value: record.todayDeaths});
-        table.cn[2].cn[4].html = fN({value: record.critical});
+        table.cn[0].cn[4].text = fN({value: record.todayCases});
+        table.cn[1].cn[4].text = fN({value: record.todayDeaths});
+        table.cn[2].cn[4].text = fN({value: record.critical});
 
         return vdomItem;
     }

package/apps/sharedcovid/view/country/Helix.mjs

@@ -45,24 +45,24 @@ class CountryHelix extends Helix {
                     ]},
                     {tag: 'table', cls: ['neo-content-table'], cn: [
                         {tag: 'tr', cn: [
-                            {tag: 'td', html: 'Cases'},
+                            {tag: 'td', text: 'Cases'},
                             {tag: 'td', cls: ['neo-align-right']},
                             {tag: 'td', style: {width: '100%'}},
-                            {tag: 'td', html: 'Cases today'},
+                            {tag: 'td', text: 'Cases today'},
                             {tag: 'td', cls: ['neo-align-right']}
                         ]},
                         {tag: 'tr', cn: [
-                            {tag: 'td', html: 'Deaths'},
+                            {tag: 'td', text: 'Deaths'},
                             {tag: 'td', cls: ['neo-align-right', 'neo-content-deaths']},
                             {tag: 'td', style: {width: '100%'}},
-                            {tag: 'td', html: 'Deaths today'},
+                            {tag: 'td', text: 'Deaths today'},
                             {tag: 'td', cls: ['neo-align-right', 'neo-content-deaths']}
                         ]},
                         {tag: 'tr', cn: [
-                            {tag: 'td', html: 'Recovered'},
+                            {tag: 'td', text: 'Recovered'},
                             {tag: 'td', cls: ['neo-align-right', 'neo-content-recovered']},
                             {tag: 'td', style: {width: '100%'}},
-                            {tag: 'td', html: 'Critical'},
+                            {tag: 'td', text: 'Critical'},
                             {tag: 'td', cls: ['neo-align-right', 'neo-content-critical']}
                         ]}
                     ]}
@@ -138,15 +138,15 @@ class CountryHelix extends Helix {
         vdomItem.id = me.getItemVnodeId(record[me.keyProperty]);
 
         firstChild.cn[0].cn[0].src  = Util.getCountryFlagUrl(record.country);
-        firstChild.cn[0].cn[1].html = record.country;
+        firstChild.cn[0].cn[1].text = record.country;
 
-        table.cn[0].cn[1].html = fN({value: record.cases});
-        table.cn[1].cn[1].html = fN({value: record.deaths});
-        table.cn[2].cn[1].html = fN({value: record.recovered});
+        table.cn[0].cn[1].text = fN({value: record.cases});
+        table.cn[1].cn[1].text = fN({value: record.deaths});
+        table.cn[2].cn[1].text = fN({value: record.recovered});
 
-        table.cn[0].cn[4].html = fN({value: record.todayCases});
-        table.cn[1].cn[4].html = fN({value: record.todayDeaths});
-        table.cn[2].cn[4].html = fN({value: record.critical});
+        table.cn[0].cn[4].text = fN({value: record.todayCases});
+        table.cn[1].cn[4].text = fN({value: record.todayDeaths});
+        table.cn[2].cn[4].text = fN({value: record.critical});
 
         return vdomItem;
     }

package/apps/sharedcovid/view/country/HistoricalDataTable.mjs

@@ -38,7 +38,7 @@ class HistoricalDataTable extends Container {
             renderer : function(data) {
                 return {
                     cls : ['neo-date-column', 'neo-table-cell'],
-                    html: new Intl.DateTimeFormat('default', {
+                    text: new Intl.DateTimeFormat('default', {
                         day  : 'numeric',
                         month: 'numeric',
                         year : 'numeric'

package/apps/shareddialog/childapps/shareddialog2/view/MainContainer.mjs

@@ -35,7 +35,7 @@ class MainContainer extends Viewport {
         }, {
             ntype: 'component',
             flex : 1,
-            html : '#2',
+            text : '#2',
 
             style: {
                 alignItems    : 'center',

package/apps/shareddialog/view/MainContainer.mjs

@@ -92,7 +92,7 @@ class MainContainer extends Viewport {
         }, {
             ntype: 'component',
             flex : 1,
-            html : '#1',
+            text : '#1',
 
             style: {
                 alignItems    : 'center',

package/buildScripts/createApp.mjs

@@ -234,13 +234,13 @@ if (programOpts.info) {
             "                    iconCls: 'fa fa-home',",
             "                    text   : 'Tab 1'",
             "                },",
-            "                vdom: {html: 'Welcome to your new Neo App.'}",
+            "                text: 'Welcome to your new Neo App.'",
             "            }, {",
             "                header: {",
             "                    iconCls: 'fa fa-play-circle',",
             "                    text   : 'Tab 2'",
             "                },",
-            "                vdom: {html: 'Have fun creating something awesome!'}",
+            "                text: 'Have fun creating something awesome!'",
             "            }]",
             "        }]",
             "    }",

package/examples/table/cellEditing/MainContainer.mjs

@@ -113,7 +113,7 @@ class MainContainer extends ConfigurationViewport {
             parentId   : this.id,
             store      : MainStore,
 
-            viewConfig: {
+            bodyConfig: {
                 selectionModel: CellModel
             },