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

package/apps/portal/resources/data/examples_dist_esm.json

@@ -1,137 +1,136 @@
 [{
     "id"          : 23,
     "environments": ["Desktop", "Mobile"],
-    "image"       : "devmode/liquid-glass.png",
-    "name"        : "Liquid Glass effect",
-    "sourceUrl"   : "https://github.com/neomjs/liquid-glass-demo/blob/main/apps/myapp/view/GlassComponent.mjs",
-    "url"         : "https://neomjs.github.io/pages2/workspace/neo-liquid-glass-demo/dist/esm/apps/myapp/index.html"
-}, {
-    "id"          : 22,
-    "environments": ["Desktop", "Mobile"],
     "image"       : "devmode/bigData.png",
     "name"        : "Buffered Data Grid with 5M cells",
     "sourceUrl"   : "examples/grid/bigData",
     "url"         : "dist/esm/examples/grid/bigData/index.html"
 }, {
-    "id"           : 21,
+    "id"           : 22,
     "image"        : "devmode/sharedcovid.png",
     "name"         : "Multi Window Covid App",
     "sharedWorkers": true,
     "sourceUrl"    : "apps/sharedcovid",
     "url"          : "dist/esm/apps/sharedcovid/index.html#mainview=table"
 }, {
-    "id"       : 20,
+    "id"       : 21,
     "image"    : "devmode/calendar-preview.png",
     "name"     : "Calendar",
     "sourceUrl": "src/calendar",
     "url"      : "dist/esm/examples/calendar/basic/index.html"
 }, {
-    "id"       : 19,
+    "id"       : 20,
     "image"    : "devmode/helix.png",
     "name"     : "component.Helix",
     "sourceUrl": "examples/component/helix",
     "url"      : "dist/esm/examples/component/helix/index.html"
 }, {
-    "id"       : 18,
+    "id"       : 19,
     "image"    : "devmode/offscreenCanvas.png",
     "name"     : "OffscreenCanvas",
     "sourceUrl": "https://github.com/neomjs/offscreen-canvas/tree/main/apps/myapp",
     "url"      : "https://neomjs.github.io/pages2/workspace/neo-offscreen-canvas-demo/dist/esm/apps/myapp/index.html"
 }, {
-    "id"           : 17,
+    "id"           : 18,
     "image"        : "devmode/mwCoronaGallery.png",
     "name"         : "Multi Window Covid Gallery",
     "sharedWorkers": true,
     "sourceUrl"    : "examples/component/multiWindowCoronaGallery",
     "url"          : "dist/esm/examples/component/multiWindowCoronaGallery/index.html"
 }, {
-    "id"           : 16,
+    "id"           : 17,
     "image"        : "devmode/multi_window_dd.png",
     "name"         : "Multi-Window Drag&Drop",
     "sharedWorkers": true,
     "sourceUrl"    : "apps/shareddialog",
     "url"          : "dist/esm/apps/shareddialog/index.html"
 }, {
-    "id"       : 15,
+    "id"       : 16,
     "image"    : "devmode/tabContainer.png",
     "name"     : "tab.Container",
     "sourceUrl": "examples/tab/container",
     "url"      : "dist/esm/examples/tab/container/index.html"
 }, {
-    "id"       : 14,
+    "id"       : 15,
     "image"    : "devmode/model-component-example.png",
     "name"     : "State Provider Example",
     "sourceUrl": "examples/stateProvider/advanced",
     "url"      : "dist/esm/examples/stateProvider/advanced/index.html"
 }, {
-    "id"       : 13,
+    "id"       : 14,
     "image"    : "devmode/dragdrop.png",
     "name"     : "Dialog drag&drop",
     "sourceUrl": "examples/dialog",
     "url"      : "dist/esm/examples/dialog/"
 }, {
-    "id"           : 12,
+    "id"           : 13,
     "image"        : "dist_prod/colorsApp.png",
     "name"         : "Colors Dashboard",
     "sharedWorkers": true,
     "sourceUrl"    : "apps/colors",
     "url"          : "dist/esm/apps/colors/index.html"
 }, {
-    "id"       : 11,
+    "id"       : 12,
     "image"    : "devmode/covidDashboard.png",
     "name"     : "Covid Dashboard",
     "sourceUrl": "apps/covid",
     "url"      : "dist/esm/apps/covid/index.html#mainview=table"
 }, {
-    "id"       : 10,
+    "id"       : 11,
     "image"    : "devmode/coronaHelix.png",
     "name"     : "COVID-19 Helix",
     "sourceUrl": "examples/component/coronaHelix",
     "url"      : "dist/esm/examples/component/coronaHelix/index.html"
 }, {
-    "id"       : 9,
+    "id"       : 10,
     "image"    : "devmode/coronaGallery.png",
     "name"     : "COVID-19 Gallery",
     "sourceUrl": "examples/component/coronaGallery",
     "url"      : "dist/esm/examples/component/coronaGallery/index.html"
 }, {
-    "id"       : 8,
+    "id"       : 9,
     "image"    : "devmode/gallery.png",
     "name"     : "component.Gallery",
     "sourceUrl": "examples/component/gallery",
     "url"      : "dist/esm/examples/component/gallery/index.html"
 }, {
-    "id"       : 7,
+    "id"       : 8,
     "image"    : "devmode/tableFiltering.png",
     "name"     : "Table Filtering",
     "sourceUrl": "examples/tableFiltering",
     "url"      : "dist/esm/examples/tableFiltering/"
 }, {
-    "id"       : 6,
+    "id"       : 7,
     "image"    : "devmode/dateSelector.png",
     "name"     : "component.DateSelector",
     "sourceUrl": "examples/component/dateSelector",
     "url"      : "dist/esm/examples/component/dateSelector/index.html"
 }, {
-    "id"       : 5,
+    "id"       : 6,
     "image"    : "devmode/dateField.png",
     "name"     : "form.field.Date",
     "sourceUrl": "examples/form/field/date",
     "url"      : "dist/esm/examples/form/field/date/index.html"
 }, {
-    "id"       : 4,
+    "id"       : 5,
     "image"    : "devmode/selectField.png",
     "name"     : "form.field.ComboBox",
     "sourceUrl": "examples/form/field/combobox",
     "url"      : "dist/esm/examples/form/field/combobox/index.html"
 }, {
-    "id"           : 3,
+    "id"           : 4,
     "environments" : ["Desktop", "Mobile"],
     "image"        : "dist_prod/portalApp.png",
     "name"         : "Portal App",
     "sharedWorkers": true,
     "sourceUrl"    : "apps/portal",
     "url"          : "dist/esm/apps/portal/index.html"
+},{
+    "id"       : 3,
+    "image"    : "devmode/liquid-glass.png",
+    "name"     : "Liquid Glass effect",
+    "sourceUrl": "https://github.com/neomjs/liquid-glass-demo/blob/main/apps/myapp/view/GlassComponent.mjs",
+    "url"      : "https://neomjs.github.io/pages2/workspace/neo-liquid-glass-demo/dist/esm/apps/myapp/index.html"
 }, {
     "hidden"   : true,
     "id"       : 2,

package/apps/portal/resources/data/examples_dist_prod.json

@@ -1,144 +1,143 @@
 [{
     "id"          : 24,
     "environments": ["Desktop", "Mobile"],
-    "image"       : "devmode/liquid-glass.png",
-    "name"        : "Liquid Glass effect",
-    "sourceUrl"   : "https://github.com/neomjs/liquid-glass-demo/blob/main/apps/myapp/view/GlassComponent.mjs",
-    "url"         : "https://neomjs.github.io/pages2/workspace/neo-liquid-glass-demo/dist/production/apps/myapp/index.html"
-}, {
-    "id"          : 23,
-    "environments": ["Desktop", "Mobile"],
     "image"       : "devmode/bigData.png",
     "name"        : "Buffered Data Grid with 5M cells",
     "sourceUrl"   : "examples/grid/bigData",
     "url"         : "dist/production/examples/grid/bigData/index.html"
 }, {
-    "id"           : 22,
+    "id"           : 23,
     "image"        : "devmode/sharedcovid.png",
     "name"         : "Multi Window Covid App",
     "sharedWorkers": true,
     "sourceUrl"    : "apps/sharedcovid",
     "url"          : "dist/production/apps/sharedcovid/index.html#mainview=table"
 }, {
-    "id"       : 21,
+    "id"       : 22,
     "image"    : "devmode/calendar-preview.png",
     "name"     : "Calendar",
     "sourceUrl": "src/calendar",
     "url"      : "dist/production/examples/calendar/basic/index.html"
 }, {
-    "id"       : 20,
+    "id"       : 21,
     "image"    : "devmode/helix.png",
     "name"     : "component.Helix",
     "sourceUrl": "examples/component/helix",
     "url"      : "dist/production/examples/component/helix/index.html"
 }, {
-    "id"           : 19,
+    "id"           : 20,
     "image"        : "devmode/mwCoronaGallery.png",
     "name"         : "Multi Window Covid Gallery",
     "sharedWorkers": true,
     "sourceUrl"    : "examples/component/multiWindowCoronaGallery",
     "url"          : "dist/production/examples/component/multiWindowCoronaGallery/index.html"
 }, {
-    "id"       : 18,
+    "id"       : 19,
     "image"    : "devmode/offscreenCanvas.png",
     "name"     : "OffscreenCanvas",
     "sourceUrl": "https://github.com/neomjs/offscreen-canvas/tree/main/apps/myapp",
     "url"      : "https://neomjs.github.io/pages2/workspace/neo-offscreen-canvas-demo/dist/production/apps/myapp/index.html"
 }, {
-    "id"           : 17,
+    "id"           : 18,
     "image"        : "devmode/sharedOffscreenCanvas.png",
     "name"         : "Multi-Window OffscreenCanvas",
     "sharedWorkers": true,
     "sourceUrl"    : "https://github.com/neomjs/shared-offscreen",
     "url"          : "https://neomjs.github.io/pages2/workspace/neo-shared-offscreen-canvas-demo/dist/production/apps/mainapp/index.html"
 }, {
-    "id"           : 16,
+    "id"           : 17,
     "image"        : "devmode/multi_window_dd.png",
     "name"         : "Multi-Window Drag&Drop",
     "sharedWorkers": true,
     "sourceUrl"    : "apps/shareddialog",
     "url"          : "dist/production/apps/shareddialog/index.html"
 }, {
-    "id"       : 15,
+    "id"       : 16,
     "image"    : "devmode/tabContainer.png",
     "name"     : "tab.Container",
     "sourceUrl": "examples/tab/container",
     "url"      : "dist/production/examples/tab/container/index.html"
 }, {
-    "id"       : 14,
+    "id"       : 15,
     "image"    : "devmode/model-component-example.png",
     "name"     : "State Provider Example",
     "sourceUrl": "examples/stateProvider/advanced",
     "url"      : "dist/production/examples/stateProvider/advanced/index.html"
 }, {
-    "id"       : 13,
+    "id"       : 14,
     "image"    : "devmode/dragdrop.png",
     "name"     : "Dialog drag&drop",
     "sourceUrl": "examples/dialog",
     "url"      : "dist/production/examples/dialog/"
 }, {
-    "id"           : 12,
+    "id"           : 13,
     "image"        : "dist_prod/colorsApp.png",
     "name"         : "Colors Dashboard",
     "sharedWorkers": true,
     "sourceUrl"    : "apps/colors",
     "url"          : "dist/production/apps/colors/index.html"
 }, {
-    "id"       : 11,
+    "id"       : 12,
     "image"    : "devmode/covidDashboard.png",
     "name"     : "Covid Dashboard",
     "sourceUrl": "apps/covid",
     "url"      : "dist/production/apps/covid/index.html#mainview=table"
 }, {
-    "id"       : 10,
+    "id"       : 11,
     "image"    : "devmode/coronaHelix.png",
     "name"     : "COVID-19 Helix",
     "sourceUrl": "examples/component/coronaHelix",
     "url"      : "dist/production/examples/component/coronaHelix/index.html"
 }, {
-    "id"       : 9,
+    "id"       : 10,
     "image"    : "devmode/coronaGallery.png",
     "name"     : "COVID-19 Gallery",
     "sourceUrl": "examples/component/coronaGallery",
     "url"      : "dist/production/examples/component/coronaGallery/index.html"
 }, {
-    "id"       : 8,
+    "id"       : 9,
     "image"    : "devmode/gallery.png",
     "name"     : "component.Gallery",
     "sourceUrl": "examples/component/gallery",
     "url"      : "dist/production/examples/component/gallery/index.html"
 }, {
-    "id"       : 7,
+    "id"       : 8,
     "image"    : "devmode/tableFiltering.png",
     "name"     : "Table Filtering",
     "sourceUrl": "examples/tableFiltering",
     "url"      : "dist/production/examples/tableFiltering/"
 }, {
-    "id"       : 6,
+    "id"       : 7,
     "image"    : "devmode/dateSelector.png",
     "name"     : "component.DateSelector",
     "sourceUrl": "examples/component/dateSelector",
     "url"      : "dist/production/examples/component/dateSelector/index.html"
 }, {
-    "id"       : 5,
+    "id"       : 6,
     "image"    : "devmode/dateField.png",
     "name"     : "form.field.Date",
     "sourceUrl": "examples/form/field/date",
     "url"      : "dist/production/examples/form/field/date/index.html"
 }, {
-    "id"       : 4,
+    "id"       : 5,
     "image"    : "devmode/selectField.png",
     "name"     : "form.field.ComboBox",
     "sourceUrl": "examples/form/field/combobox",
     "url"      : "dist/production/examples/form/field/combobox/index.html"
 }, {
-    "id"           : 3,
+    "id"           : 4,
     "environments" : ["Desktop", "Mobile"],
     "image"        : "dist_prod/portalApp.png",
     "name"         : "Portal App",
     "sharedWorkers": true,
     "sourceUrl"    : "apps/portal",
     "url"          : "dist/production/apps/portal/index.html"
+}, {
+    "id"       : 3,
+    "image"    : "devmode/liquid-glass.png",
+    "name"     : "Liquid Glass effect",
+    "sourceUrl": "https://github.com/neomjs/liquid-glass-demo/blob/main/apps/myapp/view/GlassComponent.mjs",
+    "url"      : "https://neomjs.github.io/pages2/workspace/neo-liquid-glass-demo/dist/production/apps/myapp/index.html"
 }, {
     "hidden"   : true,
     "id"       : 2,

package/apps/portal/view/HeaderToolbar.mjs

@@ -58,7 +58,7 @@ class HeaderToolbar extends Base {
                 iconCls: 'fa-brands fa-github',
                 url    : 'https://github.com/neomjs/neo',
                 tooltip: {
-                    html     : 'GitHub',
+                    text     : 'GitHub',
                     showDelay: 0,
                     hideDelay: 0
                 }
@@ -66,7 +66,7 @@ class HeaderToolbar extends Base {
                 iconCls: 'fa-brands fa-slack',
                 url    : 'https://join.slack.com/t/neomjs/shared_invite/zt-6c50ueeu-3E1~M4T9xkNnb~M_prEEOA',
                 tooltip: {
-                    html     : 'Join Slack',
+                    text     : 'Join Slack',
                     showDelay: 0,
                     hideDelay: 0
                 }
@@ -74,7 +74,7 @@ class HeaderToolbar extends Base {
                 iconCls: 'fa-brands fa-discord',
                 url    : 'https://discord.gg/6p8paPq',
                 tooltip: {
-                    html     : 'Join Discord',
+                    text     : 'Join Discord',
                     showDelay: 0,
                     hideDelay: 0
                 }

package/apps/portal/view/about/Container.mjs

@@ -20,8 +20,8 @@ class Container extends Base {
          * @member {Object[]} items
          */
         items: [{
-            html: 'Meet the Team',
-            tag : 'h1'
+            tag : 'h1',
+            text: 'Meet the Team'
         }, {
             module         : MemberContainer,
             location       : 'Germany',

package/apps/portal/view/about/MemberContainer.mjs

@@ -80,7 +80,7 @@ class MemberContainer extends Container {
         if (value) {
             let item = this.items[1];
 
-            item.vdom.cn[1].cn[2].cn[1].html = value;
+            item.vdom.cn[1].cn[2].cn[1].text = value;
             item.update?.()
         }
     }
@@ -95,7 +95,7 @@ class MemberContainer extends Container {
         if (value) {
             let item = this.items[1];
 
-            item.vdom.cn[1].cn[0].html = value;
+            item.vdom.cn[1].cn[0].text = value;
             item.update?.()
         }
     }
@@ -145,7 +145,7 @@ class MemberContainer extends Container {
         if (value) {
             let item = this.items[1];
 
-            item.vdom.cn[1].cn[1].html = value;
+            item.vdom.cn[1].cn[1].text = value;
             item.update?.()
         }
     }

package/apps/portal/view/blog/List.mjs

@@ -122,15 +122,15 @@ class List extends BaseList {
                     {cls: ['neo-full-size', 'preview-image'], flag: `image-${record.id}`},
                     {cls: ['neo-absolute', 'neo-item-bottom-position'], cn: [
                         {tag: 'a', cls: ['neo-title'], href: record.url, target: '_blank', cn: [
-                            {flag: 'name', html: record.name.replace(List.nameRegEx, "$1")}
+                            {flag: 'name', html: record.name.replace(List.nameRegEx, '$1')}
                         ]},
                         {cls: ['neo-top-20'], cn: [
                             {tag: 'img', cls: ['neo-user-image'], src: `${imageBasePath}/blogAuthor/${record.authorImage}`},
                             {cls: ['neo-inner-content'], cn: [
                                 {cls: ['neo-inner-details'], flag: 'author', cn: [
-                                    {tag: 'span', cls: ['neo-bold'], html: record.author}
+                                    {tag: 'span', cls: ['neo-bold'], text: record.author}
                                 ]},
-                                {cls: ['neo-inner-details'], html: record.date}
+                                {cls: ['neo-inner-details'], text: record.date}
                             ]}
                         ]}
                     ]}
@@ -140,16 +140,16 @@ class List extends BaseList {
 
         if (record.publisher.length > 0) {
             VDomUtil.getByFlag(vdomCn[0], 'author').cn.push(
-                {vtype: 'text', html : ' in '},
-                {tag: 'span', cls: ['neo-bold'], html: record.publisher}
+                {vtype: 'text', text : ' in '},
+                {tag: 'span', cls: ['neo-bold'], text: record.publisher}
             )
         }
 
         if (record.selectedInto.length > 0) {
             vdomCn[0].cn[0].cn.splice(1, 0,
                 {cls: ['neo-absolute', 'neo-item-top-position'], cn: [
-                    {html: `Officially selected by ${record.provider} into`},
-                    {cls: ['neo-bold'], html: record.selectedInto.join('</br>')}
+                    {text: `Officially selected by ${record.provider} into`},
+                    {cls: ['neo-bold'], text: record.selectedInto.join('</br>')}
                 ]}
             )
         }

package/apps/portal/view/examples/List.mjs

@@ -117,8 +117,8 @@ class List extends BaseList {
                     {cls: ['neo-top-20'], cn: [
                         {...me.createSourceLink(record)},
                         {cls: ['neo-inner-content'], cn: [
-                            {cls: ['neo-inner-details'], html: record.browsers.join(', ')},
-                            {cls: ['neo-inner-details'], html: record.environments.join(', ')}
+                            {cls: ['neo-inner-details'], text: record.browsers.join(', ')},
+                            {cls: ['neo-inner-details'], text: record.environments.join(', ')}
                         ]}
                     ]}
                 ]}
@@ -137,8 +137,8 @@ class List extends BaseList {
         vdom = {
             tag : 'a',
             cls : ['neo-title'],
-            cn  : [{html: record.name.replace(List.nameRegEx, "$1")}],
-            href: record.url
+            href: record.url,
+            text: record.name.replace(List.nameRegEx, '$1')
         };
 
         // We can use a shorter syntax for pointing examples to neomjs.com, but not all examples have to be there.

package/apps/portal/view/home/ContentBox.mjs

@@ -46,7 +46,7 @@ class ContentBox extends Base {
      */
     afterSetContent(value, oldValue) {
         value?.forEach(item => {
-            this.vdom.cn[1].cn.push({tag: 'li', html: item})
+            this.vdom.cn[1].cn.push({tag: 'li', text: item})
         })
 
         this.update()
@@ -59,7 +59,7 @@ class ContentBox extends Base {
      * @protected
      */
     afterSetHeader(value, oldValue) {
-        this.vdom.cn[0].html = value;
+        this.vdom.cn[0].text = value;
         this.update()
     }
 

package/apps/portal/view/home/FeatureSection.mjs

@@ -148,7 +148,7 @@ class FeatureSection extends Container {
      * @protected
      */
     afterSetHeadline(value, oldValue) {
-        this.getItem('headline').html = value
+        this.getItem('headline').text = value
     }
 
     /**
@@ -171,7 +171,7 @@ class FeatureSection extends Container {
      * @protected
      */
     afterSetParagraph(value, oldValue) {
-        this.getItem('paragraph').html = value
+        this.getItem('paragraph').text = value
     }
 
     /**
@@ -181,7 +181,7 @@ class FeatureSection extends Container {
      * @protected
      */
     afterSetSubHeadline(value, oldValue) {
-        this.getItem('sub-headline').html = value
+        this.getItem('sub-headline').text = value
     }
 
     /**

package/apps/portal/view/home/FooterContainer.mjs

@@ -37,8 +37,8 @@ class FooterContainer extends Container {
             items: [{
                 module: Component,
                 cls   : ['neo-h2'],
-                html  : 'Content',
-                tag   : 'h2'
+                tag   : 'h2',
+                text  : 'Content'
             }, {
                 iconCls: 'fas fa-people-group',
                 route  : '/about-us',
@@ -64,8 +64,8 @@ class FooterContainer extends Container {
             items: [{
                 module: Component,
                 cls   : ['neo-h2'],
-                html  : 'Community',
-                tag   : 'h2'
+                tag   : 'h2',
+                text  : 'Community'
             }, {
                 iconCls: 'fa-brands fa-github',
                 text   : 'Contribute',
@@ -91,8 +91,8 @@ class FooterContainer extends Container {
             items: [{
                 module: Component,
                 cls   : ['neo-h2'],
-                html  : 'Social Media',
-                tag   : 'h2'
+                tag   : 'h2',
+                text  : 'Social Media'
             }, {
                 iconCls: 'fa-brands fa-linkedin',
                 text   : 'LinkedIn',
@@ -107,7 +107,7 @@ class FooterContainer extends Container {
             }, {
                 module: Component,
                 cls   : ['neo-version'],
-                html  : 'v10.0.0-alpha.5'
+                text  : 'v10.0.0-beta.2'
             }]
         }],
         /**

package/apps/portal/view/home/parts/AfterMath.mjs

@@ -28,8 +28,8 @@ class AfterMath extends BaseContainer {
         }, {
             cls : ['neo-h1'],
             flex: 'none',
-            html: 'Next Steps',
-            tag : 'h1'
+            tag : 'h1',
+            text: 'Next Steps'
         }, {
             cls : ['neo-content'],
             flex: 'none',
@@ -37,7 +37,7 @@ class AfterMath extends BaseContainer {
 
             html: `
                 <li>To learn more about Neo.mjs please dive into the <a href="#/learn">Learning Section</a> or browse the <a href="#/blog">Blog</a></li>
-                <li>To arrange a demo or to talk to an engineer email <a href="mailto:info@neomjs.com">info@neomjs.com</a></li>
+                <li>To arrange a demo or to talk to an engineer, email <a href="mailto:info@neomjs.com">info@neomjs.com</a></li>
                 <li>For help starting a project email <a href="mailto:services@neomjs.com">services@neomjs.com</a></li>
                 <li>For questions about private training email <a href="mailto:training@neomjs.com">training@neomjs.com</a></li>
             `

package/apps/portal/view/home/parts/MainNeo.mjs

@@ -30,8 +30,8 @@ class MainNeo extends BaseContainer {
                 cls  : ['vector']
             }, {
                 cls : ['neo-h1'],
-                html: 'Neo.mjs',
-                tag : 'h1'
+                tag : 'h1',
+                text: 'Neo.mjs'
             }]
         }, {
             module   : MagicMoveText,
@@ -59,7 +59,7 @@ class MainNeo extends BaseContainer {
             flex: 'none',
             tag : 'h3',
 
-            html: [
+            text: [
                 'Neo.mjs provides a new approach for building feature-rich web applications. Increase productivity by leveraging ',
                 'a vast component library and harness the power of multi-threading for extreme real-time performance.'
             ].join('')

package/apps/portal/view/home/parts/References.mjs

@@ -29,13 +29,13 @@ class References extends BaseContainer {
         }, {
             cls : 'neo-h1',
             flex: 'none',
-            html: 'References',
-            tag : 'h1'
+            tag : 'h1',
+            text: 'References'
         }, {
             cls : 'neo-h2',
             flex: 'none',
-            html: 'What people think about Neo',
-            tag : 'h2'
+            tag : 'h2',
+            text: 'What people think about Neo'
         }, {
             module: Carousel,
             // will automatically change to the next extry every 5500 ms
@@ -74,10 +74,10 @@ class References extends BaseContainer {
             // each item will be created like the itemTpl structure
             itemTpl: data => [{
                 cls : 'neo-quote',
-                html: data.quote
+                text: data.quote
             }, {
                 cls : 'neo-details',
-                html: `${data.publisher} - ${data.date}`
+                text: `${data.publisher} - ${data.date}`
             }]
         }]
     }