neo.mjs 4.2.7 → 4.3.0

package/src/component/Splitter.mjs

@@ -74,15 +74,12 @@ class Splitter extends Component {
     construct(config) {
         super.construct(config);
 
-        let me           = this,
-            domListeners = me.domListeners;
+        let me = this;
 
-        domListeners.push(
+        me.addDomListeners([
             {'drag:end'  : me.onDragEnd,   scope: me},
             {'drag:start': me.onDragStart, scope: me}
-        );
-
-        me.domListeners = domListeners;
+        ]);
     }
 
     /**

package/src/component/mwc/Button.mjs

@@ -99,13 +99,10 @@ class Button extends Component {
      * @protected
      */
     afterSetHandler(value, oldValue) {
-        if (value) {
-            let me           = this,
-                domListeners = me.domListeners;
-
-            domListeners.push({click: value, scope: me});
-            me.domListeners = domListeners;
-        }
+        value && this.addDomListeners({
+            click: value,
+            scope: this
+        });
     }
 
     /**

package/src/component/mwc/TextField.mjs

@@ -77,14 +77,11 @@ class TextField extends Component {
             Neo.main.addon.Mwc.loadTextFieldModule();
         }
 
-        let me           = this,
-            domListeners = me.domListeners;
+        let me = this;
 
-        domListeners.push(
+        me.addDomListeners(
             {input: me.onInputValueChange, scope: me}
         );
-
-        me.domListeners = domListeners;
     }
 
     /**

package/src/draggable/DropZone.mjs

@@ -28,17 +28,13 @@ class DropZone extends Base {
     construct(config) {
         super.construct(config);
 
-        let me           = this,
-            owner        = me.owner,
-            domListeners = owner.domListeners;
+        let me = this;
 
-        domListeners.push(
+        me.owner.addDomListeners([
             {'drop'      : me.onDrop,      scope: me},
             {'drop:enter': me.onDropEnter, scope: me},
             {'drop:leave': me.onDropLeave, scope: me}
-        );
-
-        owner.domListeners = domListeners;
+        ]);
     }
 
     /**

package/src/draggable/list/DragZone.mjs

@@ -32,18 +32,15 @@ class DragZone extends BaseDragZone {
     construct(config) {
         super.construct(config);
 
-        let me           = this,
-            owner        = me.owner,
-            domListeners = owner.domListeners,
-            opts         = {delegate: '.neo-draggable', scope: me},
-            store        = owner.store;
+        let me    = this,
+            owner = me.owner,
+            opts  = {delegate: '.neo-draggable', scope: me},
+            store = owner.store;
 
-        domListeners.push(
+        owner.addDomListeners([
             {'drag:end'  : me.onDragEnd,   ...opts},
             {'drag:start': me.onDragStart, ...opts}
-        );
-
-        owner.domListeners = domListeners;
+        ]);
 
         store.on({
             load : me.onStoreLoad,

package/src/draggable/toolbar/DragZone.mjs

@@ -26,18 +26,15 @@ class DragZone extends BaseDragZone {
     construct(config) {
         super.construct(config);
 
-        let me           = this,
-            owner        = me.owner,
-            domListeners = owner.domListeners,
-            opts         = {delegate: '.neo-draggable', scope: me};
+        let me    = this,
+            owner = me.owner,
+            opts  = {delegate: '.neo-draggable', scope: me};
 
-        domListeners.push(
+        owner.addDomListeners([
             {'drag:end'  : me.onDragEnd,   ...opts},
             {'drag:move' : me.onDragMove,  ...opts},
             {'drag:start': me.onDragStart, ...opts}
-        );
-
-        owner.domListeners = domListeners;
+        ]);
 
         owner.on('insert', me.onItemInsert, me);
 

package/src/form/Fieldset.mjs

@@ -126,9 +126,8 @@ class Fieldset extends Container {
      * @protected
      */
     afterSetCollapsible(value, oldValue) {
-        let me           = this,
-            cls          = me.cls,
-            domListeners = me.domListeners || [];
+        let me  = this,
+            cls = me.cls;
 
         NeoArray[value ? 'add' : 'remove'](cls, 'neo-collapsible');
         me.cls = cls;
@@ -140,12 +139,10 @@ class Fieldset extends Container {
         if (value && !me.hasLabelClickListener) {
             me.hasLabelClickListener = true;
 
-            domListeners.push({
+            me.addDomListeners({
                 click   : me.onLegendClick,
                 delegate: 'neo-legend'
             });
-
-            me.domListeners = domListeners;
         }
     }
 

package/src/form/field/CheckBox.mjs

@@ -75,14 +75,11 @@ class CheckBox extends Base {
     construct(config) {
         super.construct(config);
 
-        let me           = this,
-            domListeners = me.domListeners;
+        let me = this;
 
-        domListeners.push(
+        me.addDomListeners(
             {change: me.onInputValueChange, scope: me}
         );
-
-        me.domListeners = domListeners;
     }
 
     /**

package/src/form/field/Range.mjs

@@ -51,20 +51,17 @@ class Range extends Number {
     construct(config) {
         super.construct(config);
 
-        let me           = this,
-            domListeners = me.domListeners,
-            inputEl      = me.vdom.cn[1];
+        let me      = this,
+            inputEl = me.vdom.cn[1];
 
         if (me.useInputEvent) {
-            domListeners.push({
+            me.addDomListeners({
                 input: {
                     fn    : me.onInputValueChange,
                     id    : me.vdom.cn[1].id,
                     scope : me
                 }
             });
-
-            me.domListeners = domListeners;
         }
 
         inputEl.cls = ['neo-rangefield-input']; // replace neo-textfield-input

package/src/form/field/Text.mjs

@@ -151,14 +151,11 @@ class Text extends Base {
     construct(config) {
         super.construct(config);
 
-        let me           = this,
-            domListeners = me.domListeners;
+        let me = this;
 
-        domListeners.push(
+        me.addDomListeners(
             {input: me.onInputValueChange, scope: me}
         );
-
-        me.domListeners = domListeners;
     }
 
     /**

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

@@ -81,28 +81,20 @@ class Base extends Component {
     construct(config) {
         super.construct(config);
 
-        let me             = this,
-            domListeners   = me.domListeners || [],
-            fieldListeners;
+        let me = this;
 
-        domListeners.push(
+        me.addDomListeners(
             {click: me.onTriggerClick, scope: me}
         );
 
-        me.domListeners = domListeners;
-
         if (me.showOnHover) {
             me.hidden = true;
 
             me.field.on('constructed', () => {
-                fieldListeners = me.field.domListeners || [];
-
-                fieldListeners.push(
+                me.field.addDomListeners([
                     {mouseenter: me.onMouseEnter, scope: me},
                     {mouseleave: me.onMouseLeave, scope: me}
-                );
-
-                me.field.domListeners = fieldListeners;
+                ]);
             }, me);
         }
     }

package/src/grid/header/Button.mjs

@@ -68,15 +68,12 @@ class Button extends BaseButton {
     construct(config) {
         super.construct(config);
 
-        let me           = this,
-            domListeners = me.domListeners;
+        let me = this;
 
-        domListeners.push({
+        me.addDomListeners({
             click: me.onButtonClick,
             scope: me
-        })
-
-        me.domListeners = domListeners;
+        });
     }
 
     /**

package/src/list/Base.mjs

@@ -118,14 +118,12 @@ class Base extends Component {
     construct(config) {
         super.construct(config);
 
-        let me           = this,
-            domListeners = me.domListeners;
+        let me = this;
 
-        domListeners.push({
-            click: {fn: me.onClick, scope: me}
+        me.addDomListeners({
+            click: me.onClick,
+            scope: me
         });
-
-        me.domListeners = domListeners;
     }
 
     /**

package/src/plugin/Resizable.mjs

@@ -175,10 +175,9 @@ class Resizable extends Base {
     construct(config) {
         super.construct(config);
 
-        let me           = this,
-            domListeners = me.owner.domListeners;
+        let me = this;
 
-        domListeners.push(
+        me.owner.addDomListeners([
             {'drag:end'  : me.onDragEnd,    scope: me, delegate: '.neo-resizable'},
             {'drag:move' : me.onDragMove,   scope: me, delegate: '.neo-resizable'},
             {'drag:start': me.onDragStart,  scope: me, delegate: '.neo-resizable'},
@@ -186,9 +185,7 @@ class Resizable extends Base {
             {mousemove   : me.onMouseMove,  scope: me, local   : true},
             {mouseleave  : me.onMouseLeave, scope: me, delegate: `.${me.delegationCls}`},
             {mouseup     : me.onMouseUp,    scope: me, delegate: '.neo-resizable'}
-        );
-
-        me.owner.domListeners = domListeners;
+        ]);
     }
 
     /**

package/src/selection/grid/CellModel.mjs

@@ -27,17 +27,14 @@ class CellModel extends Model {
      *
      */
     addDomListener() {
-        let me           = this,
-            view         = me.view,
-            domListeners = view.domListeners;
+        let me   = this,
+            view = me.view;
 
-        domListeners.push({
+        view.addDomListeners({
             click   : me.onCellClick,
             delegate: '.neo-grid-cell',
             scope   : me
         });
-
-        view.domListeners = domListeners;
     }
 
     /**

package/src/selection/grid/ColumnModel.mjs

@@ -28,17 +28,14 @@ class ColumnModel extends Model {
      *
      */
     addDomListener() {
-        let me           = this,
-            view         = me.view,
-            domListeners = view.domListeners;
+        let me   = this,
+            view = me.view;
 
-        domListeners.push({
+        view.addDomListeners({
             click   : me.onCellClick,
             delegate: '.neo-grid-cell',
             scope   : me
         });
-
-        view.domListeners = domListeners;
     }
 
     /**

package/src/selection/grid/RowModel.mjs

@@ -28,17 +28,14 @@ class RowModel extends Model {
      *
      */
     addDomListener() {
-        let me           = this,
-            view         = me.view,
-            domListeners = view.domListeners;
+        let me   = this,
+            view = me.view;
 
-        domListeners.push({
+        view.addDomListeners({
             click   : me.onRowClick,
             delegate: '.neo-grid-row',
             scope   : me
         });
-
-        view.domListeners = domListeners;
     }
 
     /**

package/src/selection/table/CellModel.mjs

@@ -27,17 +27,14 @@ class CellModel extends Model {
      *
      */
     addDomListener() {
-        let me           = this,
-            view         = me.view,
-            domListeners = view.domListeners;
+        let me   = this,
+            view = me.view;
 
-        domListeners.push({
+        view.addDomListeners({
             click   : me.onCellClick,
             delegate: '.neo-table-cell',
             scope   : me
         });
-
-        view.domListeners = domListeners;
     }
 
     /**

package/src/selection/table/ColumnModel.mjs

@@ -28,17 +28,14 @@ class ColumnModel extends Model {
      *
      */
     addDomListener() {
-        let me           = this,
-            view         = me.view,
-            domListeners = view.domListeners;
+        let me   = this,
+            view = me.view;
 
-        domListeners.push({
+        view.addDomListeners({
             click   : me.onCellClick,
             delegate: '.neo-table-cell',
             scope   : me
         });
-
-        view.domListeners = domListeners;
     }
 
     /**

package/src/selection/table/RowModel.mjs

@@ -28,17 +28,14 @@ class RowModel extends Model {
      *
      */
     addDomListener() {
-        let me           = this,
-            view         = me.view,
-            domListeners = view.domListeners;
+        let me   = this,
+            view = me.view;
 
-        domListeners.push({
+        view.addDomListeners({
             click   : me.onRowClick,
             delegate: '.neo-table-row',
             scope   : me
         });
-
-        view.domListeners = domListeners;
     }
 
     /**

package/src/sitemap/Component.mjs

@@ -50,15 +50,12 @@ class Component extends Base {
     construct(config) {
         super.construct(config);
 
-        let me           = this,
-            domListeners = me.domListeners;
+        let me = this;
 
-        domListeners.push(
+        me.addDomListeners([
             {click: me.onItemHandlerClick, delegate: '.neo-action-handler', scope: me},
             {click: me.onItemClick,        delegate: '.neo-action',         scope: me}
-        );
-
-        me.domListeners = domListeners;
+        ]);
     }
 
     /**

package/src/tab/header/Button.mjs

@@ -28,9 +28,13 @@ class Button extends BaseButton {
          * @member {Object} _vdom
          */
         _vdom:
-        {tag: 'button', cn: [
+        {tag: 'button', type: 'button', cn: [
             {tag: 'span', cls: ['neo-button-glyph']},
             {tag: 'span', cls: ['neo-button-text']},
+            {cls: ['neo-button-badge']},
+            {cls: ['neo-button-ripple-wrapper'], cn: [
+                    {cls: ['neo-button-ripple']}
+                ]},
             {cls: ['neo-tab-button-indicator']}
         ]}
     }}
@@ -45,6 +49,13 @@ class Button extends BaseButton {
         this.updateUseActiveTabIndicator();
     }
 
+    /**
+     * @param {Object} data
+     */
+    showRipple(data) {
+        !this.pressed && super.showRipple(data);
+    }
+
     /**
      * @param {Boolean} [silent=false]
      */
@@ -52,7 +63,7 @@ class Button extends BaseButton {
         let me   = this,
             vdom = me.vdom;
 
-        vdom.cn[2].removeDom = !me.useActiveTabIndicator;
+        vdom.cn[4].removeDom = !me.useActiveTabIndicator;
 
         me[silent ? '_vdom' : 'vdom'] = vdom;
     }

package/src/table/header/Button.mjs

@@ -88,13 +88,17 @@ class Button extends BaseButton {
          */
         showHeaderFilter_: false,
         /**
-         * @member {String} _vdom
+         * @member {Object} _vdom
          */
         _vdom:
         {tag: 'th', cn: [
             {tag: 'button', cn: [
                 {tag: 'span', cls: ['neo-button-glyph']},
-                {tag: 'span', cls: ['neo-button-text']}
+                {tag: 'span', cls: ['neo-button-text']},
+                {tag: 'span', cls: ['neo-button-badge']},
+                {tag: 'span', cls: ['neo-button-ripple-wrapper'], cn: [
+                    {tag: 'span', cls: ['neo-button-ripple']}
+                ]}
             ]}
         ]}
     }}
@@ -122,7 +126,7 @@ class Button extends BaseButton {
             });
         }
 
-        me.domListeners = listeners;
+        me.addDomListeners(listeners);
     }
 
     /**
@@ -146,8 +150,8 @@ class Button extends BaseButton {
 
     /**
      * Triggered after the isSorted config got changed
-     * @param {Boolean} value
-     * @param {Boolean} oldValue
+     * @param {String|null} value
+     * @param {String|null} oldValue
      * @protected
      */
     afterSetIsSorted(value, oldValue) {

package/src/tooltip/Base.mjs

@@ -90,21 +90,14 @@ class Base extends Container {
         }
 
         if (value) {
-            let me           = this,
-                component    = Neo.getComponent(value),
-                domListeners = component.domListeners || [];
+            let me = this;
 
-            domListeners.push({
+            Neo.getComponent(value).addDomListeners({
                 mouseenter: me.showDelayed,
-                delegate  : me.delegate,
-                scope     : me
-            }, {
                 mouseleave: me.hideDelayed,
                 delegate  : me.delegate,
                 scope     : me
             });
-
-            component.domListeners = domListeners;
         }
     }
 
@@ -120,15 +113,12 @@ class Base extends Container {
         }
 
         if (value) {
-            let me           = this,
-                domListeners = me.domListeners || [];
+            let me = this;
 
-            domListeners.push(
+            me.addDomListeners([
                 {mouseenter: me.onMouseEnter, scope: me},
                 {mouseleave: me.onMouseLeave, scope: me}
-            );
-
-            me.domListeners = domListeners;
+            ]);
         }
     }
 

package/src/util/KeyNavigation.mjs

@@ -141,23 +141,18 @@ class KeyNavigation extends Base {
      * @param {Neo.component.Base} component
      */
     register(component) {
-        let me           = this,
-            domListeners = component.domListeners;
+        let me = this;
 
         me.component = component;
         me.keys      = me.parseKeys(me.keys);
 
-        if (domListeners) {
-            domListeners.push({
-                keydown: {
-                    fn    : me.onKeyDown,
-                    bubble: me.keyDownEventBubble,
-                    scope : me
-                }
-            });
-
-            component.domListeners = domListeners;
-        }
+        component.addDomListeners({
+            keydown: {
+                bubble: me.keyDownEventBubble,
+                fn    : me.onKeyDown,
+                scope : me
+            }
+        });
     }
 
     /**