@vaadin/vaadin-grid 5.9.5 → 5.9.6

package/package.json

@@ -15,7 +15,7 @@
   "repository": "vaadin/vaadin-grid",
   "homepage": "https://vaadin.com/components",
   "name": "@vaadin/vaadin-grid",
-  "version": "5.9.5",
+  "version": "5.9.6",
   "main": "vaadin-grid.js",
   "author": "Vaadin Ltd",
   "license": "Apache-2.0",

package/src/vaadin-grid-column-group.js

@@ -82,11 +82,8 @@ class GridColumnGroupElement extends ColumnBaseMixin(PolymerElement) {
 
   static get observers() {
     return [
-      '_updateVisibleChildColumns(_childColumns)',
-      '_childColumnsChanged(_childColumns)',
       '_groupFrozenChanged(frozen, _rootColumns)',
-      '_groupHiddenChanged(hidden, _rootColumns)',
-      '_visibleChildColumnsChanged(_visibleChildColumns)',
+      '_groupHiddenChanged(hidden)',
       '_colSpanChanged(_colSpan, _headerCell, _footerCell)',
       '_groupOrderChanged(_order, _rootColumns)',
       '_groupReorderStatusChanged(_reorderStatus, _rootColumns)',
@@ -114,9 +111,12 @@ class GridColumnGroupElement extends ColumnBaseMixin(PolymerElement) {
    */
   _columnPropChanged(path, value) {
     if (path === 'hidden') {
-      this._preventHiddenCascade = true;
+      // Prevent synchronization of the hidden state to child columns.
+      // If the group is currently auto-hidden, and one column is made visible,
+      // we don't want the other columns to become visible as well.
+      this._preventHiddenSynchronization = true;
       this._updateVisibleChildColumns(this._childColumns);
-      this._preventHiddenCascade = false;
+      this._preventHiddenSynchronization = false;
     }
 
     if (/flexGrow|width|hidden|_childColumns/.test(path)) {
@@ -188,15 +188,9 @@ class GridColumnGroupElement extends ColumnBaseMixin(PolymerElement) {
 
   /** @private */
   _updateVisibleChildColumns(childColumns) {
-    this._visibleChildColumns = Array.prototype.filter.call(childColumns, col => !col.hidden);
-  }
-
-  /** @private */
-  _childColumnsChanged(childColumns) {
-    if (!this._autoHidden && this.hidden) {
-      Array.prototype.forEach.call(childColumns, column => column.hidden = true);
-      this._updateVisibleChildColumns(childColumns);
-    }
+    this._visibleChildColumns = Array.prototype.filter.call(childColumns, (col) => !col.hidden);
+    this._colSpan = this._visibleChildColumns.length;
+    this._updateAutoHidden();
   }
 
   /** @protected */
@@ -230,26 +224,31 @@ class GridColumnGroupElement extends ColumnBaseMixin(PolymerElement) {
   }
 
   /** @private */
-  _groupHiddenChanged(hidden, rootColumns) {
-    if (rootColumns && !this._preventHiddenCascade) {
-      this._ignoreVisibleChildColumns = true;
-      rootColumns.forEach(column => column.hidden = hidden);
-      this._ignoreVisibleChildColumns = false;
+  _groupHiddenChanged(hidden) {
+    // When initializing the hidden property, only sync hidden state to columns
+    // if group is actually hidden. Otherwise, we could override a hidden column
+    // to be visible.
+    // We always want to run this though if the property is actually changed.
+    if (hidden || this.__groupHiddenInitialized) {
+      this._synchronizeHidden();
     }
+    this.__groupHiddenInitialized = true;
+  }
 
-    this._columnPropChanged('hidden');
+  /** @private */
+  _updateAutoHidden() {
+    const wasAutoHidden = this._autoHidden;
+    this._autoHidden = (this._visibleChildColumns || []).length === 0;
+    // Only modify hidden state if group was auto-hidden, or becomes auto-hidden
+    if (wasAutoHidden || this._autoHidden) {
+      this.hidden = this._autoHidden;
+    }
   }
 
   /** @private */
-  _visibleChildColumnsChanged(visibleChildColumns) {
-    this._colSpan = visibleChildColumns.length;
-
-    if (!this._ignoreVisibleChildColumns) {
-      if (visibleChildColumns.length === 0) {
-        this._autoHidden = this.hidden = true;
-      } else if (this.hidden && this._autoHidden) {
-        this._autoHidden = this.hidden = false;
-      }
+  _synchronizeHidden() {
+    if (this._childColumns && !this._preventHiddenSynchronization) {
+      this._childColumns.forEach((column) => (column.hidden = this.hidden));
     }
   }
 
@@ -280,10 +279,14 @@ class GridColumnGroupElement extends ColumnBaseMixin(PolymerElement) {
       if (info.addedNodes.filter(this._isColumnElement).length > 0 ||
         info.removedNodes.filter(this._isColumnElement).length > 0) {
 
-        this._preventHiddenCascade = true;
+        // Prevent synchronization of the hidden state to child columns.
+        // If the group is currently auto-hidden, and a visible column is added,
+        // we don't want the other columns to become visible as well.
+        this._preventHiddenSynchronization = true;
         this._rootColumns = this._getChildColumns(this);
         this._childColumns = this._rootColumns;
-        this._preventHiddenCascade = false;
+        this._updateVisibleChildColumns(this._childColumns);
+        this._preventHiddenSynchronization = false;
 
         // Update the column tree with microtask timing to avoid shady style scope issues
         microTask.run(() => {

package/src/vaadin-grid-column.js

@@ -310,10 +310,6 @@ export const ColumnBaseMixin = superClass => class ColumnBaseMixin extends super
 
   /** @private */
   __setColumnTemplateOrRenderer(template, renderer, cells) {
-    // no renderer or template needed in a hidden column
-    if (this.hidden) {
-      return;
-    }
     if (template && renderer) {
       throw new Error('You should only use either a renderer or a template');
     }

package/src/vaadin-grid.js

@@ -325,7 +325,7 @@ class GridElement extends
   }
 
   static get version() {
-    return '5.9.5';
+    return '5.9.6';
   }
 
   static get observers() {