@vaadin/grid 23.1.8 → 23.1.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/grid",
-  "version": "23.1.8",
+  "version": "23.1.10",
   "publishConfig": {
     "access": "public"
   },
@@ -43,20 +43,20 @@
   "dependencies": {
     "@open-wc/dedupe-mixin": "^1.3.0",
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/checkbox": "~23.1.8",
-    "@vaadin/component-base": "~23.1.8",
-    "@vaadin/lit-renderer": "~23.1.8",
-    "@vaadin/text-field": "~23.1.8",
-    "@vaadin/vaadin-lumo-styles": "~23.1.8",
-    "@vaadin/vaadin-material-styles": "~23.1.8",
-    "@vaadin/vaadin-themable-mixin": "~23.1.8"
+    "@vaadin/checkbox": "~23.1.10",
+    "@vaadin/component-base": "~23.1.10",
+    "@vaadin/lit-renderer": "~23.1.10",
+    "@vaadin/text-field": "~23.1.10",
+    "@vaadin/vaadin-lumo-styles": "~23.1.10",
+    "@vaadin/vaadin-material-styles": "~23.1.10",
+    "@vaadin/vaadin-themable-mixin": "~23.1.10"
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
-    "@vaadin/polymer-legacy-adapter": "~23.1.8",
+    "@vaadin/polymer-legacy-adapter": "~23.1.10",
     "@vaadin/testing-helpers": "^0.3.2",
     "lit": "^2.0.0",
     "sinon": "^13.0.2"
   },
-  "gitHead": "297e4e51743751bed97f5400e661529a7d550870"
+  "gitHead": "439dc60a019bae972f286adc0479d340dd1ffe72"
 }

package/src/vaadin-grid-drag-and-drop-mixin.js

@@ -17,6 +17,9 @@ const DropLocation = {
   EMPTY: 'empty',
 };
 
+// Detects if the browser doesn't support HTML5 Drag & Drop API (and falls back to the @vaadin/vaadin-mobile-drag-drop polyfill)
+const usesDnDPolyfill = !('draggable' in document.createElement('div'));
+
 /**
  * @polymerMixin
  */
@@ -133,9 +136,11 @@ export const DragAndDropMixin = (superClass) =>
 
         const rowRect = row.getBoundingClientRect();
 
-        if (this._ios) {
+        if (usesDnDPolyfill) {
+          // The polyfill drag image is automatically centered so there is no need to adjust the position
           e.dataTransfer.setDragImage(row);
         } else {
+          // The native drag image needs to be shifted manually to compensate for the touch position offset
           e.dataTransfer.setDragImage(row, e.clientX - rowRect.left, e.clientY - rowRect.top);
         }
 

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

@@ -170,11 +170,7 @@ registerStyles(
       border-radius: var(--lumo-border-radius-s) 0 0 var(--lumo-border-radius-s);
     }
 
-    [ios] [part~='row'][dragstart] [part~='cell'] {
-      background: var(--lumo-primary-color-50pct);
-    }
-
-    #scroller:not([ios]) [part~='row'][dragstart]:not([dragstart=''])::after {
+    #scroller [part~='row'][dragstart]:not([dragstart=''])::after {
       display: block;
       position: absolute;
       left: var(--_grid-drag-start-x);

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

@@ -10,7 +10,7 @@ registerStyles(
       --vaadin-grid-tree-toggle-level-offset: 2em;
       align-items: center;
       vertical-align: middle;
-      margin-left: calc(var(--lumo-space-s) * -1);
+      transform: translateX(calc(var(--lumo-space-s) * -1));
       -webkit-tap-highlight-color: transparent;
     }
 

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

@@ -221,11 +221,7 @@ registerStyles(
       box-shadow: none !important;
     }
 
-    [ios] [part~='row'][dragstart] [part~='cell'] {
-      background: var(--material-primary-color);
-    }
-
-    #scroller:not([ios]) [part~='row'][dragstart]:not([dragstart=''])::after {
+    #scroller [part~='row'][dragstart]:not([dragstart=''])::after {
       display: block;
       position: absolute;
       left: var(--_grid-drag-start-x);
@@ -262,7 +258,7 @@ registerStyles(
       border-left: 1px solid var(--material-divider-color);
     }
 
-    :host([dir='rtl']) #scroller:not([ios]) [part~='row'][dragstart]:not([dragstart=''])::after {
+    :host([dir='rtl']) #scroller [part~='row'][dragstart]:not([dragstart=''])::after {
       left: auto;
       right: var(--_grid-drag-start-x);
     }