neo.mjs 3.1.4 → 3.2.3

package/src/list/Component.mjs

@@ -30,11 +30,9 @@ class Component extends Base {
      * @protected
      */
     afterSetAppName(value, oldValue) {
-        let me = this;
-
         super.afterSetAppName(value, oldValue);
 
-        value && me.items?.forEach(item => {
+        value && this.items?.forEach(item => {
             item.appName = value;
         });
     }
@@ -73,13 +71,46 @@ class Component extends Base {
      * @returns {String|Number} itemId
      */
     getItemRecordId(vnodeId) {
-        let itemId = vnodeId.split('__')[1],
-            store  = this.store;
+        let itemId = vnodeId.split('__')[1];
+        return this.store.getAt(parseInt(itemId))[this.getKeyProperty()];
+    }
+
+    /**
+     * @param {Object} data
+     * @param {Object[]} data.items
+     * @param {Object[]} data.previousItems
+     * @param {Neo.data.Store} data.scope
+     */
+    onStoreSort(data) {
+        this.sortItems(data);
+        super.onStoreSort(data);
+    }
+
+    /**
+     * @param {Object} data
+     * @param {Object[]} data.items
+     * @param {Object[]} data.previousItems
+     * @param {Neo.data.Store} data.scope
+     */
+    sortItems(data) {
+        let me       = this,
+            newItems = [],
+            fromIndex, key, previousKeys;
+
+        if (me.items) {
+            key          = me.getKeyProperty();
+            previousKeys = data.previousItems.map(e => e[key]);
+
+            data.items.forEach(item => {
+                fromIndex = previousKeys.indexOf(item[key]);
+                newItems.push(me.items[fromIndex]);
+            });
 
-        return store.getAt(parseInt(itemId))[store.model.keyProperty];
+            me.items = newItems;
+        }
     }
 }
 
 Neo.applyClassConfig(Component);
 
-export {Component as default};
+export default Component;

package/src/list/plugin/Animate.mjs

@@ -27,21 +27,11 @@ class Animate extends Base {
          * @member {Number|null} columns=null
          */
         columns: null,
-        /**
-         * Value in px
-         * @member {Number} itemHeight=200
-         */
-        itemHeight: 200,
         /**
          * Value in px
          * @member {Number} itemMargin=10
          */
         itemMargin: 10,
-        /**
-         * Value in px
-         * @member {Number} itemWidth=300
-         */
-        itemWidth: 300,
         /**
          * @member {DOMRect|null} ownerRect=null
          */
@@ -78,14 +68,14 @@ class Animate extends Base {
         let me    = this,
             owner = me.owner;
 
+        if (!owner.itemHeight || !owner.itemWidth) {
+            console.error('list.plugin.Animate requires fixed itemHeight and itemWidth values', owner);
+        }
+
         me.adjustCreateItem();
 
         owner.onStoreFilter = me.onStoreFilter.bind(me);
-
-        owner.store.on({
-            sort : me.onStoreSort,
-            scope: me
-        });
+        owner.onStoreSort   = me.onStoreSort  .bind(me);
 
         this.updateTransitionDetails(false);
     }
@@ -139,6 +129,7 @@ class Animate extends Base {
      */
     createItem(me, record, index) {
         let item     = me.ownerCreateItem(record, index),
+            owner    = me.owner,
             position = me.getItemPosition(record, index),
             style    = item.style || {};
 
@@ -147,10 +138,10 @@ class Animate extends Base {
         }
 
         Object.assign(style, {
-            height   : `${me.itemHeight}px`,
+            height   : `${owner.itemHeight}px`,
             position : 'absolute',
             transform: `translate(${position.x}px, ${position.y}px)`,
-            width    : `${me.itemWidth}px`
+            width    : `${owner.itemWidth}px`
         });
 
         item.style = style;
@@ -167,9 +158,10 @@ class Animate extends Base {
         let me     = this,
             column = index % me.columns,
             margin = me.itemMargin,
+            owner  = me.owner,
             row    = Math.floor(index / me.columns),
-            x      = column * (margin + me.itemWidth)  + margin,
-            y      = row    * (margin + me.itemHeight) + margin;
+            x      = column * (margin + owner.itemWidth)  + margin,
+            y      = row    * (margin + owner.itemHeight) + margin;
 
         return {x, y};
     }
@@ -186,7 +178,7 @@ class Animate extends Base {
         }
 
         let owner = this.owner,
-            key   = owner.store.keyProperty;
+            key   = owner.getKeyProperty();
 
         return map.indexOf(owner.getItemId(obj.record[key]));
     }
@@ -195,14 +187,18 @@ class Animate extends Base {
      *
      */
     onOwnerMounted() {
-        let me = this;
+        let me    = this,
+            owner = me.owner;
 
-        me.owner.getDomRect().then(rect => {
+        owner.getDomRect().then(rect => {
             Object.assign(me, {
-                columns  : Math.floor(rect.width / me.itemWidth),
+                columns  : Math.floor(rect.width / owner.itemWidth),
                 ownerRect: rect,
-                rows     : Math.floor(rect.height / me.itemHeight)
+                rows     : Math.floor(rect.height / owner.itemHeight)
             });
+
+            // if the store got loaded before this plugin is ready, create the items now
+            owner.store.getCount() > 0 && owner.createItems();
         });
     }
 
@@ -216,7 +212,7 @@ class Animate extends Base {
     onStoreFilter(data) {
         let me                  = this,
             owner               = me.owner,
-            key                 = owner.store.keyProperty,
+            key                 = owner.getKeyProperty(),
             hasAddedItems       = false,
             addedItems          = [],
             movedItems          = [],
@@ -326,19 +322,34 @@ class Animate extends Base {
      * @param {Neo.data.Store} data.scope
      */
     onStoreSort(data) {
-        let me          = this,
-            hasChange   = false,
-            keyProperty = data.scope.keyProperty,
-            owner       = me.owner,
-            newVdomCn   = [],
-            vdom        = owner.vdom,
-            vdomMap     = vdom.cn.map(e => e.id),
-            fromIndex, itemId;
-
-        if (vdomMap.length > 0) {
+        let me = this;
+
+        if (Neo.list.Component && me.owner instanceof Neo.list.Component) {
+            me.sortComponentList(data);
+        } else {
+            me.sortBaseList(data);
+        }
+    }
+
+    /**
+     * @param {Object} data
+     * @param {Object[]} data.items
+     * @param {Object[]} data.previousItems
+     * @param {Neo.data.Store} data.scope
+     */
+    sortBaseList(data) {
+        let me            = this,
+            hasChange     = false,
+            owner         = me.owner,
+            key           = owner.getKeyProperty(),
+            newVdomCn     = [],
+            previousKeys  = data.previousItems.map(e => e[key]),
+            vdom          = owner.vdom,
+            fromIndex;
+
+        if (vdom.cn.length > 0) {
             data.items.forEach((item, index) => {
-                itemId    = owner.getItemId(item[keyProperty]);
-                fromIndex = vdomMap.indexOf(itemId);
+                fromIndex = previousKeys.indexOf(item[key]);
 
                 newVdomCn.push(vdom.cn[fromIndex]);
 
@@ -360,6 +371,37 @@ class Animate extends Base {
         }
     }
 
+    /**
+     * @param {Object} data
+     * @param {Object[]} data.items
+     * @param {Object[]} data.previousItems
+     * @param {Neo.data.Store} data.scope
+     */
+    sortComponentList(data) {
+        let me           = this,
+            owner        = me.owner,
+            key          = owner.getKeyProperty(),
+            previousKeys = data.previousItems.map(e => e[key]),
+            vdom         = owner.vdom,
+            fromIndex, item, position;
+
+        owner.sortItems(data);
+
+        previousKeys = owner.items.map(e => owner.getItemRecordId(e[key]));
+
+        if (vdom.cn.length > 0) {
+            data.items.forEach((record, index) => {
+                fromIndex = previousKeys.indexOf(record[key]);
+                item      = vdom.cn[fromIndex];
+                position  = me.getItemPosition(record, index);
+
+                item.style.transform = `translate(${position.x}px, ${position.y}px)`;
+            });
+
+            owner.vdom = vdom;
+        }
+    }
+
     /**
      *
      */
@@ -397,4 +439,4 @@ class Animate extends Base {
 
 Neo.applyClassConfig(Animate);
 
-export {Animate as default};
+export default Animate;

package/src/main/draggable/sensor/Base.mjs

@@ -75,4 +75,4 @@ class Base extends CoreBase {
 
 Neo.applyClassConfig(Base);
 
-export {Base as default};
+export default Base;

package/src/main/draggable/sensor/Mouse.mjs

@@ -213,4 +213,4 @@ function preventDefault(event) {
 
 Neo.applyClassConfig(Mouse);
 
-export {Mouse as default};
+export default Mouse;

package/src/main/draggable/sensor/Touch.mjs

@@ -242,4 +242,4 @@ function preventDefault(event) {
 
 Neo.applyClassConfig(Touch);
 
-export {Touch as default};
+export default Touch;

package/src/main/mixin/DeltaUpdates.mjs

@@ -297,4 +297,4 @@ class DeltaUpdates extends Base {
 
 Neo.applyClassConfig(DeltaUpdates);
 
-export {DeltaUpdates as default};
+export default DeltaUpdates;

package/src/main/mixin/TouchDomEvents.mjs

@@ -61,4 +61,4 @@ class TouchDomEvents extends Base {
 
 Neo.applyClassConfig(TouchDomEvents);
 
-export {TouchDomEvents as default};
+export default TouchDomEvents;

package/src/manager/Base.mjs

@@ -46,4 +46,4 @@ class Base extends CollectionBase{
 
 Neo.applyClassConfig(Base);
 
-export {Base as default};
+export default Base;

package/src/menu/List.mjs

@@ -341,4 +341,4 @@ class List extends BaseList {
 
 Neo.applyClassConfig(List);
 
-export {List as default};
+export default List;

package/src/menu/Model.mjs

@@ -36,4 +36,4 @@ class Model extends BaseModel {
 
 Neo.applyClassConfig(Model);
 
-export {Model as default};
+export default Model;

package/src/menu/Panel.mjs

@@ -89,4 +89,4 @@ class Panel extends BasePanel {
 
 Neo.applyClassConfig(Panel);
 
-export {Panel as default};
+export default Panel;

package/src/menu/Store.mjs

@@ -21,4 +21,4 @@ class Store extends BaseStore {
 
 Neo.applyClassConfig(Store);
 
-export {Store as default};
+export default Store;

package/src/model/Component.mjs

@@ -124,11 +124,9 @@ class Component extends Base {
      * @protected
      */
     beforeSetStores(value, oldValue) {
-        if (value) {
-            Object.entries(value).forEach(([key, storeValue]) => {
-                value[key] = ClassSystemUtil.beforeSetInstance(storeValue);
-            });
-        }
+        value && Object.entries(value).forEach(([key, storeValue]) => {
+            value[key] = ClassSystemUtil.beforeSetInstance(storeValue);
+        });
 
         return value;
     }
@@ -257,7 +255,7 @@ class Component extends Base {
                 if (!root[_key]) {
                     Object.defineProperty(root, _key, {
                         enumerable: false,
-                        value     : value,
+                        value,
                         writable  : true
                     });
                 } else {
@@ -542,10 +540,10 @@ class Component extends Base {
         }
 
         me.fire('dataPropertyChange', {
-            key     : key,
-            id      : me.id,
-            oldValue: oldValue,
-            value   : value
+            key,
+            id: me.id,
+            oldValue,
+            value
         });
     }
 
@@ -625,4 +623,4 @@ class Component extends Base {
 
 Neo.applyClassConfig(Component);
 
-export {Component as default};
+export default Component;

package/src/plugin/Base.mjs

@@ -50,4 +50,4 @@ class Base extends CoreBase {
 
 Neo.applyClassConfig(Base);
 
-export {Base as default};
+export default Base;

package/src/plugin/Resizable.mjs

@@ -587,4 +587,4 @@ class Resizable extends Base {
 
 Neo.applyClassConfig(Resizable);
 
-export {Resizable as default};
+export default Resizable;

package/src/selection/CircleModel.mjs

@@ -103,4 +103,4 @@ class CircleModel extends Model {
 
 Neo.applyClassConfig(CircleModel);
 
-export {CircleModel as default};
+export default CircleModel;

package/src/selection/DateSelectorModel.mjs

@@ -174,4 +174,4 @@ class DateSelectorModel extends Model {
 
 Neo.applyClassConfig(DateSelectorModel);
 
-export {DateSelectorModel as default};
+export default DateSelectorModel;

package/src/selection/GalleryModel.mjs

@@ -294,4 +294,4 @@ class GalleryModel extends Model {
 
 Neo.applyClassConfig(GalleryModel);
 
-export {GalleryModel as default};
+export default GalleryModel;

package/src/selection/HelixModel.mjs

@@ -289,4 +289,4 @@ class HelixModel extends Model {
 
 Neo.applyClassConfig(HelixModel);
 
-export {HelixModel as default};
+export default HelixModel;

package/src/selection/ListModel.mjs

@@ -170,4 +170,4 @@ class ListModel extends Model {
 
 Neo.applyClassConfig(ListModel);
 
-export {ListModel as default};
+export default ListModel;

package/src/selection/Model.mjs

@@ -269,4 +269,4 @@ class Model extends Base {
 
 Neo.applyClassConfig(Model);
 
-export {Model as default};
+export default Model;

package/src/selection/menu/ListModel.mjs

@@ -46,4 +46,4 @@ class ListModel extends BaseListModel {
 
 Neo.applyClassConfig(ListModel);
 
-export {ListModel as default};
+export default ListModel;

package/src/selection/table/CellColumnModel.mjs

@@ -119,4 +119,4 @@ class CellColumnModel extends CellModel {
 
 Neo.applyClassConfig(CellColumnModel);
 
-export {CellColumnModel as default};
+export default CellColumnModel;

package/src/selection/table/CellColumnRowModel.mjs

@@ -119,4 +119,4 @@ class CellColumnRowModel extends CellRowModel {
 
 Neo.applyClassConfig(CellColumnRowModel);
 
-export {CellColumnRowModel as default};
+export default CellColumnRowModel;

package/src/selection/table/CellModel.mjs

@@ -181,4 +181,4 @@ class CellModel extends Model {
 
 Neo.applyClassConfig(CellModel);
 
-export {CellModel as default};
+export default CellModel;

package/src/selection/table/CellRowModel.mjs

@@ -161,4 +161,4 @@ class CellRowModel extends CellModel {
 
 Neo.applyClassConfig(CellRowModel);
 
-export {CellRowModel as default};
+export default CellRowModel;

package/src/selection/table/ColumnModel.mjs

@@ -182,4 +182,4 @@ class ColumnModel extends Model {
 
 Neo.applyClassConfig(ColumnModel);
 
-export {ColumnModel as default};
+export default ColumnModel;

package/src/selection/table/RowModel.mjs

@@ -191,4 +191,4 @@ class RowModel extends Model {
 
 Neo.applyClassConfig(RowModel);
 
-export {RowModel as default};
+export default RowModel;

package/src/tab/Container.mjs

@@ -615,4 +615,4 @@ class Container extends BaseContainer {
 
 Neo.applyClassConfig(Container);
 
-export {Container as default};
+export default Container;

package/src/tab/Strip.mjs

@@ -174,4 +174,4 @@ class Strip extends Component {
 
 Neo.applyClassConfig(Strip);
 
-export {Strip as default};
+export default Strip;

package/src/tab/header/Button.mjs

@@ -60,4 +60,4 @@ class Button extends BaseButton {
 
 Neo.applyClassConfig(Button);
 
-export {Button as default};
+export default Button;

package/src/tab/header/Toolbar.mjs

@@ -141,4 +141,4 @@ class Toolbar extends BaseToolbar {
 
 Neo.applyClassConfig(Toolbar);
 
-export {Toolbar as default};
+export default Toolbar;

package/src/table/Container.mjs

@@ -479,4 +479,4 @@ class Container extends BaseContainer {
 
 Neo.applyClassConfig(Container);
 
-export {Container as default};
+export default Container;

package/src/table/View.mjs

@@ -263,4 +263,4 @@ class View extends Component {
 
 Neo.applyClassConfig(View);
 
-export {View as default};
+export default View;

package/src/table/header/Button.mjs

@@ -454,4 +454,4 @@ class Button extends BaseButton {
 
 Neo.applyClassConfig(Button);
 
-export {Button as default};
+export default Button;

package/src/table/header/Toolbar.mjs

@@ -157,4 +157,4 @@ class Toolbar extends BaseToolbar {
 
 Neo.applyClassConfig(Toolbar);
 
-export {Toolbar as default};
+export default Toolbar;

package/src/tooltip/Base.mjs

@@ -263,4 +263,4 @@ class Base extends Container {
 
 Neo.applyClassConfig(Base);
 
-export {Base as default};
+export default Base;

package/src/tree/List.mjs

@@ -414,4 +414,4 @@ class Tree extends Base {
 
 Neo.applyClassConfig(Tree);
 
-export {Tree as default};
+export default Tree;

package/src/util/KeyNavigation.mjs

@@ -78,9 +78,7 @@ class KeyNavigation extends Base {
                 scope = Neo.get(key.scope);
 
                 if (key.key.toUpperCase() === upperCaseKey) {
-                    if (scope[key.fn]) {
-                        scope[key.fn].apply(scope, [data]);
-                    }
+                    scope[key.fn]?.apply(scope, [data]);
                 }
             });
         }
@@ -188,9 +186,7 @@ class KeyNavigation extends Base {
      * @param {Array} items
      */
     removeKeys(items) {
-        if (Array.isArray(items)) {
-            items.forEach(item => this.removeKey(item));
-        }
+        Array.isArray(items) && items.forEach(item => this.removeKey(item));
     }
 
     /**

package/src/vdom/VNode.mjs

@@ -55,4 +55,4 @@ class VNode {
 const ns = Neo.ns('Neo.vdom', true);
 ns['VNode'] = VNode;
 
-export {VNode as default};
+export default VNode;

package/src/worker/App.mjs

@@ -262,24 +262,15 @@ class App extends Base {
 
     /**
      * Only needed for SharedWorkers
-     * @param {String} name
+     * @param {String} appName
      */
-    registerApp(name) {
-        let me = this;
-
-        me.ports.forEach(port => {
-            if (!port.appName) {
-                port.appName = name;
+    registerApp(appName) {
+        // register the name as fast as possible
+        this.onRegisterApp({ appName });
 
-                me.onConnect({
-                    appName: name
-                });
-
-                me.sendMessage('main', {
-                    action :'registerAppName',
-                    appName: name
-                });
-            }
+        this.sendMessage('main', {
+            action:'registerAppName',
+            appName
         });
     }