phosphor-boxpanel - npm Package Compare versions

Comparing version 0.9.1 to 0.9.2

lib/index.d.ts

@@ -223,9 +223,9 @@ import { Message } from 'phosphor-messaging';
     /**
-     * Update the box items and size constraints of the panel.
+     * Update the size constraints of the panel.
      */
     private _setupGeometry();
     /**
-     * Layout the items using the given offset width and height.
+     * Layout the children using the given offset width and height.
      */
-    private _layoutItems(offsetWidth, offsetHeight);
+    private _layoutChildren(offsetWidth, offsetHeight);
     /**
@@ -242,3 +242,2 @@ * The change handler for the [[orientationProperty]].
     private _sizers;
-    private _items;
 }

lib/index.js

@@ -76,3 +76,2 @@ /*-----------------------------------------------------------------------------
         this._sizers = [];
-        this._items = [];
         this.addClass(exports.BOX_PANEL_CLASS);
@@ -137,3 +136,2 @@ this.addClass(exports.TTB_CLASS);
     BoxPanel.prototype.dispose = function () {
-        this._items.length = 0;
         this._sizers.length = 0;
@@ -191,3 +189,2 @@ _super.prototype.dispose.call(this);
         phosphor_properties_1.Property.getChanged(msg.child).connect(this._onPropertyChanged, this);
-        arrays.insert(this._items, msg.currentIndex, new BoxItem(msg.child));
         arrays.insert(this._sizers, msg.currentIndex, new phosphor_boxengine_1.BoxSizer());
@@ -204,3 +201,2 @@ this.node.appendChild(msg.child.node);
         phosphor_properties_1.Property.getChanged(msg.child).disconnect(this._onPropertyChanged, this);
-        arrays.removeAt(this._items, msg.previousIndex);
         arrays.removeAt(this._sizers, msg.previousIndex);
@@ -211,2 +207,3 @@ if (this.isAttached)
         phosphor_messaging_1.postMessage(this, phosphor_widget_1.MSG_LAYOUT_REQUEST);
+        phosphor_widget_1.clearLayoutGeometry(msg.child);
     };
@@ -217,3 +214,2 @@ /**
     BoxPanel.prototype.onChildMoved = function (msg) {
-        arrays.move(this._items, msg.previousIndex, msg.currentIndex);
         arrays.move(this._sizers, msg.previousIndex, msg.currentIndex);
@@ -251,5 +247,12 @@ this.update();
         if (this.isVisible) {
-            var width = msg.width < 0 ? this.node.offsetWidth : msg.width;
-            var height = msg.height < 0 ? this.node.offsetHeight : msg.height;
-            this._layoutItems(width, height);
+            var width = msg.width;
+            var height = msg.height;
+            if (width < 0 || height < 0) {
+                var geo = phosphor_widget_1.getLayoutGeometry(this);
+                if (width < 0)
+                    width = geo ? geo.width : this.node.offsetWidth;
+                if (height < 0)
+                    height = geo ? geo.height : this.node.offsetHeight;
+            }
+            this._layoutChildren(width, height);
         }
@@ -262,3 +265,6 @@ };
         if (this.isVisible) {
-            this._layoutItems(this.node.offsetWidth, this.node.offsetHeight);
+            var geo = phosphor_widget_1.getLayoutGeometry(this);
+            var width = geo ? geo.width : this.node.offsetWidth;
+            var height = geo ? geo.height : this.node.offsetHeight;
+            this._layoutChildren(width, height);
         }
@@ -275,3 +281,3 @@ };
     /**
-     * Update the box items and size constraints of the panel.
+     * Update the size constraints of the panel.
      */
@@ -281,4 +287,4 @@ BoxPanel.prototype._setupGeometry = function () {
         var visibleCount = 0;
-        for (var i = 0, n = this._items.length; i < n; ++i) {
-            if (!this._items[i].widget.hidden)
+        for (var i = 0, n = this.childCount; i < n; ++i) {
+            if (!this.childAt(i).hidden)
                 visibleCount++;
@@ -297,6 +303,6 @@ }
             maxW = visibleCount > 0 ? minW : maxW;
-            for (var i = 0, n = this._items.length; i < n; ++i) {
-                var item = this._items[i];
+            for (var i = 0, n = this.childCount; i < n; ++i) {
+                var widget = this.childAt(i);
                 var sizer = this._sizers[i];
-                if (item.widget.hidden) {
+                if (widget.hidden) {
                     sizer.minSize = 0;
@@ -306,5 +312,5 @@ sizer.maxSize = 0;
                 }
-                var limits = phosphor_domutil_1.sizeLimits(item.widget.node);
-                sizer.sizeHint = BoxPanel.getSizeBasis(item.widget);
-                sizer.stretch = BoxPanel.getStretch(item.widget);
+                var limits = phosphor_domutil_1.sizeLimits(widget.node);
+                sizer.sizeHint = BoxPanel.getSizeBasis(widget);
+                sizer.stretch = BoxPanel.getStretch(widget);
                 sizer.minSize = limits.minWidth;
@@ -321,6 +327,6 @@ sizer.maxSize = limits.maxWidth;
             maxH = visibleCount > 0 ? minH : maxH;
-            for (var i = 0, n = this._items.length; i < n; ++i) {
-                var item = this._items[i];
+            for (var i = 0, n = this.childCount; i < n; ++i) {
+                var widget = this.childAt(i);
                 var sizer = this._sizers[i];
-                if (item.widget.hidden) {
+                if (widget.hidden) {
                     sizer.minSize = 0;
@@ -330,5 +336,5 @@ sizer.maxSize = 0;
                 }
-                var limits = phosphor_domutil_1.sizeLimits(item.widget.node);
-                sizer.sizeHint = BoxPanel.getSizeBasis(item.widget);
-                sizer.stretch = BoxPanel.getStretch(item.widget);
+                var limits = phosphor_domutil_1.sizeLimits(widget.node);
+                sizer.sizeHint = BoxPanel.getSizeBasis(widget);
+                sizer.stretch = BoxPanel.getStretch(widget);
                 sizer.minSize = limits.minHeight;
@@ -361,7 +367,7 @@ sizer.maxSize = limits.maxHeight;
     /**
-     * Layout the items using the given offset width and height.
+     * Layout the children using the given offset width and height.
      */
-    BoxPanel.prototype._layoutItems = function (offsetWidth, offsetHeight) {
-        // Bail early if their are no items to arrange.
-        if (this._items.length === 0) {
+    BoxPanel.prototype._layoutChildren = function (offsetWidth, offsetHeight) {
+        // Bail early if their are no children to arrange.
+        if (this.childCount === 0) {
             return;
@@ -381,9 +387,9 @@ }
             phosphor_boxengine_1.boxCalc(this._sizers, Math.max(0, width - this._fixedSpace));
-            for (var i = 0, n = this._items.length; i < n; ++i) {
-                var item = this._items[i];
-                if (item.widget.hidden) {
+            for (var i = 0, n = this.childCount; i < n; ++i) {
+                var widget = this.childAt(i);
+                if (widget.hidden) {
                     continue;
                 }
                 var size = this._sizers[i].size;
-                item.layoutWidget(left, top, size, height);
+                phosphor_widget_1.setLayoutGeometry(widget, left, top, size, height);
                 left += size + spacing;
@@ -394,9 +400,9 @@ }
             phosphor_boxengine_1.boxCalc(this._sizers, Math.max(0, height - this._fixedSpace));
-            for (var i = 0, n = this._items.length; i < n; ++i) {
-                var item = this._items[i];
-                if (item.widget.hidden) {
+            for (var i = 0, n = this.childCount; i < n; ++i) {
+                var widget = this.childAt(i);
+                if (widget.hidden) {
                     continue;
                 }
                 var size = this._sizers[i].size;
-                item.layoutWidget(left, top, width, size);
+                phosphor_widget_1.setLayoutGeometry(widget, left, top, width, size);
                 top += size + spacing;
@@ -408,9 +414,9 @@ }
             phosphor_boxengine_1.boxCalc(this._sizers, Math.max(0, width - this._fixedSpace));
-            for (var i = 0, n = this._items.length; i < n; ++i) {
-                var item = this._items[i];
-                if (item.widget.hidden) {
+            for (var i = 0, n = this.childCount; i < n; ++i) {
+                var widget = this.childAt(i);
+                if (widget.hidden) {
                     continue;
                 }
                 var size = this._sizers[i].size;
-                item.layoutWidget(left - size, top, size, height);
+                phosphor_widget_1.setLayoutGeometry(widget, left - size, top, size, height);
                 left -= size + spacing;
@@ -422,9 +428,9 @@ }
             phosphor_boxengine_1.boxCalc(this._sizers, Math.max(0, height - this._fixedSpace));
-            for (var i = 0, n = this._items.length; i < n; ++i) {
-                var item = this._items[i];
-                if (item.widget.hidden) {
+            for (var i = 0, n = this.childCount; i < n; ++i) {
+                var widget = this.childAt(i);
+                if (widget.hidden) {
                     continue;
                 }
                 var size = this._sizers[i].size;
-                item.layoutWidget(left, top - size, width, size);
+                phosphor_widget_1.setLayoutGeometry(widget, left, top - size, width, size);
                 top -= size + spacing;
@@ -525,55 +531,2 @@ }
 exports.BoxPanel = BoxPanel;
-/**
- * A class which assists with the layout of a widget.
- */
-var BoxItem = (function () {
-    /**
-     * Construct a new box item.
-     */
-    function BoxItem(widget) {
-        this._top = NaN;
-        this._left = NaN;
-        this._width = NaN;
-        this._height = NaN;
-        this._widget = widget;
-    }
-    Object.defineProperty(BoxItem.prototype, "widget", {
-        /**
-         * Get the widget for the item.
-         */
-        get: function () {
-            return this._widget;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    /**
-     * Update the layout geometry for the widget.
-     */
-    BoxItem.prototype.layoutWidget = function (left, top, width, height) {
-        var resized = false;
-        var style = this._widget.node.style;
-        if (left !== this._left) {
-            this._left = left;
-            style.left = left + 'px';
-        }
-        if (top !== this._top) {
-            this._top = top;
-            style.top = top + 'px';
-        }
-        if (width !== this._width) {
-            resized = true;
-            this._width = width;
-            style.width = width + 'px';
-        }
-        if (height !== this._height) {
-            resized = true;
-            this._height = height;
-            style.height = height + 'px';
-        }
-        if (resized)
-            phosphor_messaging_1.sendMessage(this._widget, new phosphor_widget_1.ResizeMessage(width, height));
-    };
-    return BoxItem;
-})();
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "phosphor-boxpanel",
-  "version": "0.9.1",
+  "version": "0.9.2",
   "description": "A Phosphor layout widget which arranges its children into a single row or column.",
@@ -13,3 +13,3 @@ "main": "lib/index.js",
     "phosphor-properties": "^1.1.0",
-    "phosphor-widget": "^0.9.5"
+    "phosphor-widget": "^0.9.6"
   },
@@ -16,0 +16,0 @@ "devDependencies": {

No alert changes

Worsened metrics

Total package byte prevSize

33411

decreased by-3.63%

Lines of code

765

decreased by-5.9%

Dependency changes

• Updatedphosphor-widget@^0.9.6