neo.mjs 8.0.1 → 8.1.1

package/src/grid/header/Toolbar.mjs

@@ -21,12 +21,20 @@ class Toolbar extends BaseToolbar {
          * @member {String[]} baseCls=['neo-grid-header-toolbar','neo-toolbar']
          */
         baseCls: ['neo-grid-header-toolbar', 'neo-toolbar'],
+        /**
+         * @member {Neo.grid.Container|null} gridContainer=null
+         */
+        gridContainer: null,
         /**
          * @member {Object} itemDefaults={ntype: 'grid-header-button'}
          */
         itemDefaults: {
             ntype: 'grid-header-button'
         },
+        /**
+         * @member {String} role='row'
+         */
+        role: 'row',
         /**
          * @member {Boolean} showHeaderFilters_=false
          */
@@ -34,7 +42,23 @@ class Toolbar extends BaseToolbar {
         /**
          * @member {Boolean} sortable=true
          */
-        sortable: true
+        sortable: true,
+        /**
+         * @member {Object} _vdom
+         */
+        _vdom:
+        {'aria-rowindex': 1, cn: [{cn: []}]}
+    }
+
+    /**
+     * Triggered after the mounted config got changed
+     * @param {Boolean} value
+     * @param {Boolean} oldValue
+     * @protected
+     */
+    afterSetMounted(value, oldValue) {
+        super.afterSetMounted(value, oldValue);
+        value && this.passSizeToView()
     }
 
     /**
@@ -95,6 +119,8 @@ class Toolbar extends BaseToolbar {
             style;
 
         items.forEach((item, index) => {
+            item.vdom['aria-colindex'] = index + 1; // 1 based
+
             style = item.wrapperStyle;
 
             // todo: only add px if number
@@ -105,11 +131,12 @@ class Toolbar extends BaseToolbar {
             if (item.dock) {
                 NeoArray.add(item.vdom.cls, 'neo-locked');
 
-                if (item.dock === 'left') {
+                /*if (item.dock === 'left') {
                     style.left = dockLeftWidth + 'px'
                 }
 
                 dockLeftWidth += (item.width + 1) // todo: borders fix
+                 */
             }
 
             item.sortable = me.sortable;
@@ -118,14 +145,14 @@ class Toolbar extends BaseToolbar {
             // inverse loop direction
             item = items[len - index -1];
 
-            if (item.dock === 'right') {
+            /*if (item.dock === 'right') {
                 style = item.wrapperStyle;
                 style.right = dockRightWidth + 'px';
 
                 item.wrapperStyle = style;
 
                 dockRightWidth += (item.width + 1) // todo: borders fix
-            }
+            }*/
         });
 
         me.update()
@@ -144,6 +171,23 @@ class Toolbar extends BaseToolbar {
 
         return null
     }
+
+
+
+    /**
+     * @param {Boolean} silent=false
+     * @returns {Promise<void>}
+     */
+    async passSizeToView(silent=false) {
+        let me       = this,
+            rects    = await me.getDomRect(me.items.map(item => item.id)),
+            lastItem = rects[rects.length - 1];
+
+        me.gridContainer.view[silent ? 'setSilent' : 'set']({
+            availableWidth : lastItem.x + lastItem.width - rects[0].x,
+            columnPositions: rects.map(item => ({width: item.width, x: item.x - rects[0].x}))
+        })
+    }
 }
 
 export default Neo.setupClass(Toolbar);

package/src/layout/Base.mjs

@@ -1,4 +1,4 @@
-import CoreBase from '../core/Base.mjs';
+import Base     from '../core/Base.mjs';
 import NeoArray from '../util/Array.mjs';
 
 /**
@@ -7,7 +7,7 @@ import NeoArray from '../util/Array.mjs';
  * @class Neo.layout.Base
  * @extends Neo.core.Base
  */
-class Base extends CoreBase {
+class Layout extends Base {
     static config = {
         /**
          * @member {String} className='Neo.layout.Base'
@@ -156,4 +156,4 @@ class Base extends CoreBase {
     }
 }
 
-export default Neo.setupClass(Base);
+export default Neo.setupClass(Layout);

package/src/list/Base.mjs

@@ -8,7 +8,7 @@ import Store           from '../data/Store.mjs';
  * @class Neo.list.Base
  * @extends Neo.component.Base
  */
-class Base extends Component {
+class List extends Component {
     static config = {
         /**
          * @member {String} className='Neo.list.Base'
@@ -848,4 +848,4 @@ class Base extends Component {
     }
 }
 
-export default Neo.setupClass(Base);
+export default Neo.setupClass(List);

package/src/list/Circle.mjs

@@ -1,11 +1,11 @@
 import CircleComponent from '../component/Circle.mjs';
-import Component       from './Component.mjs';
+import ComponentList   from './Component.mjs';
 
 /**
  * @class Neo.list.Circle
  * @extends Neo.list.Component
  */
-class Circle extends Component {
+class Circle extends ComponentList {
     static config = {
         /**
          * @member {String} className='Neo.list.Circle'

package/src/list/Color.mjs

@@ -1,10 +1,10 @@
-import Base from './Base.mjs';
+import List from './Base.mjs';
 
 /**
  * @class Neo.list.Color
  * @extends Neo.list.Base
  */
-class Color extends Base {
+class Color extends List {
     static config = {
         /**
          * @member {String} className='Neo.list.Color'

package/src/list/Component.mjs

@@ -1,11 +1,11 @@
-import Base from './Base.mjs';
+import List from './Base.mjs';
 
 /**
  * A base class for lists which will use component based list items
  * @class Neo.list.Component
  * @extends Neo.list.Base
  */
-class Component extends Base {
+class Component extends List {
     static config = {
         /**
          * @member {String} className='Neo.list.Component'

package/src/manager/Base.mjs

@@ -1,11 +1,11 @@
-import CollectionBase from '../collection/Base.mjs';
+import Collection from '../collection/Base.mjs';
 
 /**
  * Abstract base class for the other manager classes
  * @class Neo.manager.Base
  * @extends Neo.collection.Base
  */
-class Base extends CollectionBase{
+class Manager extends Collection{
     static config = {
         /**
          * @member {String} className='Neo.manager.Base'
@@ -44,4 +44,4 @@ class Base extends CollectionBase{
     }
 }
 
-export default Neo.setupClass(Base);
+export default Neo.setupClass(Manager);

package/src/manager/Component.mjs

@@ -1,4 +1,4 @@
-import Base      from './Base.mjs';
+import Manager   from './Base.mjs';
 import VDomUtil  from '../util/VDom.mjs';
 import VNodeUtil from '../util/VNode.mjs';
 
@@ -7,7 +7,7 @@ import VNodeUtil from '../util/VNode.mjs';
  * @extends Neo.manager.Base
  * @singleton
  */
-class Component extends Base {
+class Component extends Manager {
     static config = {
         /**
          * @member {String} className='Neo.manager.Component'
@@ -177,6 +177,15 @@ class Component extends Base {
         return null
     }
 
+    /**
+     * Returns the object associated to the key, or null if there is none.
+     * @param key
+     * @returns {Neo.component.Base|null}
+     */
+    get(key) {
+        return this.wrapperNodes.get(key) || super.get(key)
+    }
+
     /**
      * Returns all child components which are recursively matched via their parentId
      * @param {Neo.component.Base} component
@@ -241,14 +250,14 @@ class Component extends Base {
      * @returns {Neo.component.Base|null|Neo.component.Base[]}
      *
      * @example
-            // as String: ntype[comma separated propterties]
-            Neo.first('toolbar button[text=Try me,icon=people]')
-            // as Object: Add properties. ntype is optional
-            Neo.first({
+     // as String: ntype[comma separated propterties]
+     Neo.first('toolbar button[text=Try me,icon=people]')
+     // as Object: Add properties. ntype is optional
+     Neo.first({
                 icon: 'people'
             })
-            // as Array: An Array of Objects. No Strings allowed
-            Neo.first([{
+     // as Array: An Array of Objects. No Strings allowed
+     Neo.first([{
                 ntype: 'toolbar'
             },{
                 ntype: 'button', text: 'Try me', icon: 'people
@@ -258,7 +267,7 @@ class Component extends Base {
      * not stop after the first result.
      *
      * @example
-            Neo.first('button', false) // => [Button, Button, Button]
+     Neo.first('button', false) // => [Button, Button, Button]
      */
     getFirst(componentDescription, returnFirstMatch = true) {
         let objects = [],
@@ -279,7 +288,7 @@ class Component extends Base {
 
                 if (pairs) {
                     const pairsRegex = /\[(.*?)\]/,
-                        pairsMatch = pairs.match(pairsRegex);
+                          pairsMatch = pairs.match(pairsRegex);
 
                     if (pairsMatch) {
                         const pairs = pairsMatch[1].split(',');
@@ -345,7 +354,7 @@ class Component extends Base {
             len           = path?.length || 0;
 
         for (; i < len; i++) {
-            if (me.has(path[i])) {
+            if (me.has(path[i]) || me.wrapperNodes.get(path[i])) {
                 componentPath.push(path[i])
             }
         }

package/src/manager/DomEvent.mjs

@@ -202,7 +202,7 @@ class DomEvent extends Base {
             opts     : config,
             priority : config.priority,
             scope    : config.scope   || scope,
-            vnodeId  : config.vnodeId || scope.id
+            vnodeId  : config.vnodeId || scope.vdom.id
         };
     }
 
@@ -427,15 +427,15 @@ class DomEvent extends Base {
                     if (!eventConfigKeys.includes(key)) {
                         me.register({
                             bubble        : domListener.bubble   || value.bubble,
-                            delegate      : domListener.delegate || value.delegate || '#' + component.id,
+                            delegate      : domListener.delegate || value.delegate || '#' + (component.vdom.id || component.id),
                             eventName     : key,
-                            id            : component.id,
+                            id            : component.vdom.id || component.id, // honor wrapper nodes
                             opts          : value,
                             originalConfig: domListener,
                             ownerId       : component.id,
                             priority      : domListener.priority || value.priority || 1,
                             scope         : domListener.scope    || component,
-                            vnodeId       : domListener.vnodeId  || value.vnodeId  || component.id
+                            vnodeId       : domListener.vnodeId  || value.vnodeId  || component.vdom.id
                         })
                     }
                 })
@@ -468,8 +468,7 @@ class DomEvent extends Base {
             if (j != null) {
                 targetId = path[j].id
             }
-        }
-        else {
+        } else {
             let delegationArray = delegate.split(' '),
                 len             = delegationArray.length,
                 hasMatch, i, item, isId;

package/src/manager/Instance.mjs

@@ -1,12 +1,12 @@
-import Base     from './Base.mjs';
-import CoreBase from '../core/Base.mjs';
+import Base    from '../core/Base.mjs';
+import Manager from './Base.mjs';
 
 /**
  * @class Neo.manager.Instance
  * @extends Neo.manager.Base
  * @singleton
  */
-class Instance extends Base {
+class Instance extends Manager {
     static config = {
         /**
          * @member {String} className='Neo.manager.Instance'
@@ -28,7 +28,7 @@ class Instance extends Base {
 
         let me = this;
 
-        CoreBase.instanceManagerAvailable = true;
+        Base.instanceManagerAvailable = true;
 
         me.consumeNeoIdMap();
 

package/src/manager/Task.mjs

@@ -1,4 +1,4 @@
-import Base from './Base.mjs';
+import Manager from './Base.mjs';
 
 /**
  * @class Neo.manager.Task
@@ -32,7 +32,7 @@ import Base from './Base.mjs';
  *     TaskManager.run(taskId);
  *     TaskManager.get(taskId).repeat = 20;
  */
-class Task extends Base {
+class Task extends Manager {
     static config = {
         /**
          * @member {String} className='Neo.manager.Task'

package/src/manager/Toast.mjs

@@ -1,5 +1,5 @@
-import Base     from './Base.mjs';
-import NeoArray from "../util/Array.mjs";
+import Manager  from './Base.mjs';
+import NeoArray from '../util/Array.mjs';
 
 /**
  * See Neo.dialog.Toast for examples
@@ -7,7 +7,7 @@ import NeoArray from "../util/Array.mjs";
  * @extends Neo.manager.Base
  * @singleton
  */
-class Toast extends Base {
+class Toast extends Manager {
     static config = {
         /**
          * @member {String} className='Neo.manager.Toast'

package/src/plugin/Base.mjs

@@ -1,4 +1,4 @@
-import CoreBase from '../core/Base.mjs';
+import Base from '../core/Base.mjs';
 
 /**
  * Abstract base class for plugin implementations.
@@ -7,7 +7,7 @@ import CoreBase from '../core/Base.mjs';
  * @class Neo.plugin.Base
  * @extends Neo.core.Base
  */
-class Base extends CoreBase {
+class Plugin extends Base {
     static config = {
         /**
          * @member {String} className='Neo.plugin.Base'
@@ -64,4 +64,4 @@ class Base extends CoreBase {
     }
 }
 
-export default Neo.setupClass(Base);
+export default Neo.setupClass(Plugin);

package/src/plugin/Popover.mjs

@@ -1,6 +1,6 @@
-import Base      from './Base.mjs';
 import Container from '../container/Base.mjs'
-import NeoArray  from "../util/Array.mjs";
+import NeoArray  from '../util/Array.mjs';
+import Plugin    from './Base.mjs';
 
 /**
  * Popover usable as tooltip
@@ -26,7 +26,7 @@ import NeoArray  from "../util/Array.mjs";
  *         }]
  *     }]
  */
-class Popover extends Base {
+class Popover extends Plugin {
     /**
      * Valid values for align
      * @member {String[]} alignValues=['bc-tc','tc-bc','tl-tr','tr-tl','cl-cr','cr-cl',null]

package/src/plugin/PrefixField.mjs

@@ -1,4 +1,4 @@
-import Base from './Base.mjs';
+import Plugin from './Base.mjs';
 
 /**
  * @class Neo.plugin.PrefixField
@@ -17,7 +17,7 @@ import Base from './Base.mjs';
  *         }]
  *     }
  */
-class PrefixField extends Base {
+class PrefixField extends Plugin {
     static config = {
         /**
          * @member {String} className='Neo.plugin.PrefixField'

package/src/plugin/Resizable.mjs

@@ -1,12 +1,12 @@
-import Base     from './Base.mjs';
 import DragZone from '../draggable/DragZone.mjs';
 import NeoArray from '../util/Array.mjs';
+import Plugin   from './Base.mjs';
 
 /**
  * @class Neo.plugin.Resizable
  * @extends Neo.plugin.Base
  */
-class Resizable extends Base {
+class Resizable extends Plugin {
     /**
      * Resize cursor styles use north, south based names, so we need a mapping.
      * The order has to match the static positions array.

package/src/plugin/Responsive.mjs

@@ -1,10 +1,10 @@
-import BasePlugin from './Base.mjs';
+import Plugin from './Base.mjs';
 
 /**
  * @class Neo.plugin.Responsive
  * @extends Neo.plugin.Base
  */
-class Responsive extends BasePlugin {
+class Responsive extends Plugin {
     static config = {
         /**
          * @member {String} className='Neo.plugin.Responsive'

package/src/selection/Model.mjs

@@ -110,6 +110,9 @@ class Model extends Base {
             NeoArray.remove(itemCollection, item);
 
             if (!silent) {
+                // We need a bigger depth, since grid.Container & table.Container use selection.Model as a  top-level config.
+                // In case the config would get moved to grid.View & table.View, we would not need it.
+                view.updateDepth = -1;
                 view.update();
 
                 me.fire('selectionChange', {
@@ -136,6 +139,9 @@ class Model extends Base {
             });
 
             if (!silent && items.length > 0) {
+                // We need a bigger depth, since grid.Container & table.Container use selection.Model as a  top-level config.
+                // In case the config would get moved to grid.View & table.View, we would not need it.
+                view.updateDepth = -1;
                 view.update()
             }
 
@@ -244,7 +250,12 @@ class Model extends Base {
 
             NeoArray.add(itemCollection, items);
 
-            !view.silentSelect && view.update();
+            if (!view.silentSelect) {
+                // We need a bigger depth, since grid.Container & table.Container use selection.Model as a  top-level config.
+                // In case the config would get moved to grid.View & table.View, we would not need it.
+                view.updateDepth = -1;
+                view.update()
+            }
 
             view.onSelect?.(items);
 

package/src/toolbar/Base.mjs

@@ -8,7 +8,7 @@ import NeoArray  from '../util/Array.mjs';
  * @class Neo.toolbar.Base
  * @extends Neo.container.Base
  */
-class Base extends Container {
+class Toolbar extends Container {
     /**
      * Valid values for dock
      * @member {String[]} dockPositions=['top','right','bottom','left', null]
@@ -223,4 +223,4 @@ class Base extends Container {
     }
 }
 
-export default Neo.setupClass(Base);
+export default Neo.setupClass(Toolbar);

package/src/toolbar/Breadcrumb.mjs

@@ -1,7 +1,7 @@
 import ClassSystemUtil from '../util/ClassSystem.mjs';
 import HashHistory     from '../util/HashHistory.mjs';
 import Store           from '../data/Store.mjs';
-import Toolbar         from '../toolbar/Base.mjs';
+import Toolbar         from './Base.mjs';
 
 /**
  * @class Neo.toolbar.Breadcrumb

package/src/tooltip/Base.mjs

@@ -8,7 +8,7 @@ let singletons = {};
  * @class Neo.tooltip.Base
  * @extends Neo.container.Base
  */
-class Base extends Container {
+class Tooltip extends Container {
     static config = {
         /**
          * @member {String} className='Neo.tooltip.Base'
@@ -368,4 +368,4 @@ class Base extends Container {
     }
 }
 
-export default Neo.setupClass(Base);
+export default Neo.setupClass(Tooltip);

package/src/worker/Base.mjs

@@ -1,4 +1,4 @@
-import CoreBase           from '../core/Base.mjs';
+import Base               from '../core/Base.mjs';
 import Observable         from '../core/Observable.mjs';
 import Message            from './Message.mjs';
 import RemoteMethodAccess from './mixin/RemoteMethodAccess.mjs';
@@ -9,7 +9,7 @@ import RemoteMethodAccess from './mixin/RemoteMethodAccess.mjs';
  * @extends Neo.core.Base
  * @abstract
  */
-class Base extends CoreBase {
+class Worker extends Base {
     static config = {
         /**
          * @member {String} className='Neo.worker.Base'
@@ -309,4 +309,4 @@ class Base extends CoreBase {
     }
 }
 
-export default Neo.setupClass(Base);
+export default Neo.setupClass(Worker);

package/src/grid/README.md

@@ -1,3 +0,0 @@
-The grid implementation using div tags is currently on hold in favor for the table implementation using a table tag.
-
-The BufferedGrid implementation is currently scoped for neo v9.