neo.mjs 4.0.88 → 4.0.91

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "neo.mjs",
-    "version": "4.0.88",
+    "version": "4.0.91",
     "description": "The webworkers driven UI framework",
     "type": "module",
     "repository": {

package/resources/scss/src/component/Iframe.scss

@@ -0,0 +1,3 @@
+.neo-iframe {
+    border: none;
+}

package/resources/scss/src/sitemap/Container.scss

@@ -5,7 +5,7 @@
     .neo-action {
         color          : inherit;
         display        : block;
-        margin         : 1em 0;
+        margin         : 1.1em 0;
         text-decoration: none;
     }
 

package/src/component/Base.mjs

@@ -163,9 +163,9 @@ class Base extends CoreBase {
         /**
          * Used for hide and show and defines if the component
          * should use css visibility:'hidden' or vdom:removeDom
-         * @member {String} hideMode_='visibility'
+         * @member {String} hideMode_='removeDom'
          */
-        hideMode_: 'visibility',
+        hideMode_: 'removeDom',
         /**
          * The top level innerHTML of the component
          * @member {String|null} html_=null
@@ -1121,10 +1121,9 @@ class Base extends CoreBase {
      * @param {Number} timeout
      */
     hide(timeout) {
-        let me       = this,
-            doRemove = me.hideMode !== 'visibility';
+        let me = this;
 
-        if (doRemove) {
+        if (me.hideMode !== 'visibility') {
             let removeFn = function() {
                 let vdom = me.vdom;
                 vdom.removeDom = true;
@@ -1142,7 +1141,7 @@ class Base extends CoreBase {
             me.style = style;
         }
 
-        this._hidden = true;
+        me._hidden = true;
     }
 
     /**
@@ -1505,10 +1504,9 @@ class Base extends CoreBase {
      * hideMode: 'visibility' uses css visibility.
      */
     show() {
-        let me    = this,
-            doAdd = me.hideMode !== 'visibility';
+        let me = this;
 
-        if (doAdd) {
+        if (me.hideMode !== 'visibility') {
             let vdom = me.vdom;
             vdom.removeDom = false;
             me.vdom = vdom;
@@ -1518,7 +1516,7 @@ class Base extends CoreBase {
             me.style = style;
         }
 
-        this._hidden = false;
+        me._hidden = false;
     }
 
     /**

package/src/component/Iframe.mjs

@@ -0,0 +1,42 @@
+import Base from '../component/Base.mjs';
+
+/**
+ * @class Neo.component.Iframe
+ * @extends Neo.component.Base
+ */
+class Iframe extends Base {
+    static getConfig() {return {
+        /*
+         * @member {String} className='Neo.component.Iframe'
+         * @protected
+         */
+        className: 'Neo.component.Iframe',
+        /*
+         * @member {String[]} cls=['neo-iframe']
+         */
+        cls: ['neo-iframe'],
+        /*
+         * @member {String|null} src_=null
+         */
+        src_: null,
+        /*
+         * @member {Object} _vdom
+         */
+        _vdom:
+        {tag: 'iframe'}
+    }}
+
+    /**
+     * Triggered after the src config got changed
+     * @param {String|null} value
+     * @param {String|null} oldValue
+     * @protected
+     */
+    afterSetSrc(value, oldValue) {
+        this.changeVdomRootKey('src', value);
+    }
+}
+
+Neo.applyClassConfig(Iframe);
+
+export default Iframe;

package/src/data/RecordFactory.mjs

@@ -278,6 +278,10 @@ class RecordFactory extends Base {
             return new Date(value);
         }
 
+        if (type === 'html' && value) {
+            value = value + '';
+        }
+
         if (type === 'string' && value) {
             value = value + '';
             value =  value.replace(/(<([^>]+)>)/ig, '');

package/src/list/Base.mjs

@@ -405,9 +405,10 @@ class Base extends Component {
     getItemRecordId(vnodeId) {
         let itemId   = vnodeId.split('__')[1],
             model    = this.store.model,
-            keyField = model?.getField(model.keyProperty);
+            keyField = model?.getField(model.keyProperty),
+            keyType  = keyField?.type.toLowerCase();
 
-        if (keyField?.type.toLowerCase() === 'integer' || keyField?.type.toLowerCase() === 'number') {
+        if (keyType === 'integer' || keyType === 'number') {
             itemId = parseInt(itemId);
         }
 

package/src/sitemap/Container.mjs

@@ -55,6 +55,20 @@ class Container extends Base {
         layout: {ntype: 'hbox', align: 'stretch'}
     }}
 
+    /**
+     * @param {Object} config
+     */
+    construct(config) {
+        super.construct(config);
+
+        let me           = this,
+            domListeners = me.domListeners;
+
+        domListeners.push({click: me.onItemClick, delegate: '.neo-action', scope: me});
+
+        me.domListeners = domListeners;
+    }
+
     /**
      * Triggered after the itemStore config got changed
      * @param {Neo.sitemap.store.Items|null} value
@@ -163,6 +177,29 @@ class Container extends Base {
         return `${this.id}__${recordId}`;
     }
 
+    /**
+     * @param {String} vnodeId
+     * @returns {String|Number} itemId
+     */
+    getItemRecordId(vnodeId) {
+        let itemId   = vnodeId.split('__')[1],
+            model    = this.itemStore.model,
+            keyField = model?.getField(model.keyProperty),
+            keyType  = keyField?.type.toLowerCase();
+
+        if (keyType === 'integer' || keyType === 'number') {
+            itemId = parseInt(itemId);
+        }
+
+        return itemId;
+    }
+
+    /**
+     * Override as needed
+     * @param {Object} data
+     */
+    onItemClick(data) {}
+
     /**
      *
      */

package/src/sitemap/model/Item.mjs

@@ -41,7 +41,7 @@ class Item extends Model {
             type        : 'Number'
         }, {
             name: 'name',
-            type: 'String'
+            type: 'Html'
         }]
     }}
 }