@vaadin/vaadin-grid 5.9.1 → 5.9.2

package/package.json

@@ -15,7 +15,7 @@
   "repository": "vaadin/vaadin-grid",
   "homepage": "https://vaadin.com/components",
   "name": "@vaadin/vaadin-grid",
-  "version": "5.9.1",
+  "version": "5.9.2",
   "main": "vaadin-grid.js",
   "author": "Vaadin Ltd",
   "license": "Apache-2.0",
@@ -45,32 +45,33 @@
   },
   "resolutions": {
 "@webcomponents/webcomponentsjs": "2.0.0",
-    "es-abstract": "1.17.6",
-    "@types/doctrine": "0.0.3",
     "inherits": "2.0.3",
     "samsam": "1.1.3",
     "supports-color": "3.1.2",
     "type-detect": "1.0.0"
   },
   "scripts": {
-  "generate-typings": "gen-typescript-declarations --outDir . --verify"
-},
-"devDependencies": {
-    "@webcomponents/webcomponentsjs": "^2.0.0",
-    "wct-browser-legacy": "^1.0.1",
+    "generate-typings": "gen-typescript-declarations --outDir . --verify",
+    "test": "wct --npm"
+  },
+  "devDependencies": {
+    "@web-padawan/gen-typescript-declarations": "^1.6.2",
+    "web-component-tester": "6.9.2",
+    "@polymer/app-localize-behavior": "^3.0.0",
+    "@polymer/iron-ajax": "^3.0.0",
+    "@polymer/iron-component-page": "^4.0.0",
+    "@polymer/iron-image": "^3.0.0",
+    "@polymer/iron-list": "^3.0.0",
+    "@polymer/iron-media-query": "^3.0.0",
     "@polymer/iron-test-helpers": "^3.0.0",
-    "@polymer/paper-input": "^3.0.0",
     "@polymer/paper-checkbox": "^3.0.0",
-    "@polymer/iron-flex-layout": "^3.0.0",
-    "@polymer/iron-image": "^3.0.0",
+    "@polymer/paper-input": "^3.0.0",
     "@polymer/paper-slider": "^3.0.0",
-    "@polymer/iron-media-query": "^3.0.0",
-    "@polymer/iron-component-page": "^4.0.0",
-    "@polymer/iron-ajax": "^3.0.0",
-    "@polymer/app-localize-behavior": "^3.0.0",
-    "@polymer/iron-list": "^3.0.0",
-    "@vaadin/vaadin-demo-helpers": "^3.1.0",
+    "@polymer/test-fixture": "^4.0.0",
     "@vaadin/vaadin-button": "^2.4.0",
-    "@vaadin/vaadin-context-menu": "^4.5.0"
+    "@vaadin/vaadin-context-menu": "^4.5.0",
+    "@vaadin/vaadin-demo-helpers": "^3.1.0",
+    "@webcomponents/webcomponentsjs": "^2.0.0",
+    "wct-browser-legacy": "^1.0.1"
   }
 }

package/src/vaadin-grid-column-reordering-mixin.js

@@ -8,7 +8,6 @@ import { GestureEventListeners } from '@polymer/polymer/lib/mixins/gesture-event
 import { GridHelper } from './vaadin-grid-helpers.js';
 import { addListener } from '@polymer/polymer/lib/utils/gestures.js';
 import { dom } from '@polymer/polymer/lib/legacy/polymer.dom.js';
-import { useShadow } from '@polymer/polymer/lib/utils/settings.js';
 
 /**
  * @polymerMixin
@@ -214,15 +213,24 @@ export const ColumnReorderingMixin = superClass => class ColumnReorderingMixin e
     if (!this._draggedColumn) {
       this._toggleAttribute('no-content-pointer-events', true, this.$.scroller);
     }
+    // Workaround a ShadyDOM bug
+    this._reorderGhost.hidden = true;
+
     let cell;
-    if (useShadow) {
+    if (this.shadowRoot.elementFromPoint) {
       cell = this.shadowRoot.elementFromPoint(x, y);
     } else {
       cell = document.elementFromPoint(x, y);
+    }
 
-      // Workaround a FF58 bug
+    this._reorderGhost.hidden = false;
+
+    // Workaround FF58/ShadyDOM bugs
+    while (!cell._column && cell.parentElement) {
       if (cell.localName === 'vaadin-grid-cell-content') {
         cell = cell.assignedSlot.parentNode;
+      } else {
+        cell = cell.parentElement;
       }
 
     }

package/src/vaadin-grid.d.ts

@@ -255,7 +255,7 @@ import {timeOut, animationFrame} from '@polymer/polymer/lib/utils/async.js';
  * `reorder-status` | Reflects the status of a cell while columns are being reordered | cell
  * `frozen` | Frozen cell | cell
  * `last-frozen` | Last frozen cell | cell
- * * `first-column` | First visible cell on a row | cell
+ * `first-column` | First visible cell on a row | cell
  * `last-column` | Last visible cell on a row | cell
  * `selected` | Selected row | row
  * `expanded` | Expanded row | row
@@ -263,6 +263,7 @@ import {timeOut, animationFrame} from '@polymer/polymer/lib/utils/async.js';
  * `loading` | Row that is waiting for data from data provider | row
  * `odd` | Odd row | row
  * `first` | The first body row | row
+ * `last` | The last body row | row
  * `dragstart` | Set for one frame when drag of a row is starting. The value is a number when multiple rows are dragged | row
  * `dragover` | Set when the row is dragged over | row
  * `drag-disabled` | Set to a row that isn't available for dragging | row

package/src/vaadin-grid.js

@@ -239,7 +239,7 @@ const TOUCH_DEVICE = (() => {
  * `reorder-status` | Reflects the status of a cell while columns are being reordered | cell
  * `frozen` | Frozen cell | cell
  * `last-frozen` | Last frozen cell | cell
-* * `first-column` | First visible cell on a row | cell
+ * `first-column` | First visible cell on a row | cell
  * `last-column` | Last visible cell on a row | cell
  * `selected` | Selected row | row
  * `expanded` | Expanded row | row
@@ -247,6 +247,7 @@ const TOUCH_DEVICE = (() => {
  * `loading` | Row that is waiting for data from data provider | row
  * `odd` | Odd row | row
  * `first` | The first body row | row
+ * `last` | The last body row | row
  * `dragstart` | Set for one frame when drag of a row is starting. The value is a number when multiple rows are dragged | row
  * `dragover` | Set when the row is dragged over | row
  * `drag-disabled` | Set to a row that isn't available for dragging | row
@@ -322,7 +323,7 @@ class GridElement extends
   }
 
   static get version() {
-    return '5.9.1';
+    return '5.9.2';
   }
 
   static get observers() {
@@ -764,6 +765,7 @@ class GridElement extends
     }
 
     this._toggleAttribute('first', index === 0, row);
+    this._toggleAttribute('last', index === this._effectiveSize - 1, row);
     this._toggleAttribute('odd', index % 2, row);
     this._a11yUpdateRowRowindex(row, index);
     this._getItem(index, row);

package/theme/lumo/vaadin-grid-styles.js

@@ -118,6 +118,10 @@ const $_documentContainer = html`<dom-module id="lumo-grid" theme-for="vaadin-gr
         margin-top: -1px;
       }
 
+      :host([all-rows-visible]) [part~="row"][last][dragover="below"] [part~="cell"]::after {
+        height: 1px;
+      }
+
       [part~="row"][dragover="above"] [part~="cell"]::after {
         top: auto;
         bottom: 100%;

package/theme/material/vaadin-grid-styles.js

@@ -161,6 +161,10 @@ const $_documentContainer = html`<dom-module id="material-grid" theme-for="vaadi
         margin-top: -1px;
       }
 
+      :host([all-rows-visible]) [part~="row"][last][dragover="below"] [part~="cell"]::after {
+        height: 1px;
+      }
+
       [part~="row"][dragover="above"] [part~="cell"]::after {
         top: auto;
         bottom: 100%;