@vaadin/grid - npm Package Compare versions

Comparing version 24.5.0-alpha9 to 24.5.0-beta1

package.json

 {
   "name": "@vaadin/grid",
-  "version": "24.5.0-alpha9",
+  "version": "24.5.0-beta1",
   "publishConfig": {
@@ -49,14 +49,14 @@ "access": "public"
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/a11y-base": "24.5.0-alpha9",
-    "@vaadin/checkbox": "24.5.0-alpha9",
-    "@vaadin/component-base": "24.5.0-alpha9",
-    "@vaadin/lit-renderer": "24.5.0-alpha9",
-    "@vaadin/text-field": "24.5.0-alpha9",
-    "@vaadin/vaadin-lumo-styles": "24.5.0-alpha9",
-    "@vaadin/vaadin-material-styles": "24.5.0-alpha9",
-    "@vaadin/vaadin-themable-mixin": "24.5.0-alpha9",
+    "@vaadin/a11y-base": "24.5.0-beta1",
+    "@vaadin/checkbox": "24.5.0-beta1",
+    "@vaadin/component-base": "24.5.0-beta1",
+    "@vaadin/lit-renderer": "24.5.0-beta1",
+    "@vaadin/text-field": "24.5.0-beta1",
+    "@vaadin/vaadin-lumo-styles": "24.5.0-beta1",
+    "@vaadin/vaadin-material-styles": "24.5.0-beta1",
+    "@vaadin/vaadin-themable-mixin": "24.5.0-beta1",
     "lit": "^3.0.0"
   },
   "devDependencies": {
-    "@vaadin/chai-plugins": "24.5.0-alpha9",
+    "@vaadin/chai-plugins": "24.5.0-beta1",
     "@vaadin/testing-helpers": "^1.0.0",
@@ -69,3 +69,3 @@ "sinon": "^18.0.0"
   ],
-  "gitHead": "804744762f3bec0a2247c4bbcbbb204dbcd78bc0"
+  "gitHead": "da4b57724d7089e3766d59d01068159322adb2b8"
 }

src/lit/column-renderer-directives.d.ts

@@ -7,3 +7,3 @@ /**
 /* eslint-disable max-classes-per-file */
-import type { DirectiveResult } from 'lit/directive';
+import type { DirectiveResult } from 'lit/directive.js';
 import type { LitRenderer, LitRendererResult } from '@vaadin/lit-renderer';
@@ -10,0 +10,0 @@ import { LitRendererDirective } from '@vaadin/lit-renderer';

src/lit/renderer-directives.d.ts

@@ -6,3 +6,3 @@ /**
  */
-import type { DirectiveResult } from 'lit/directive';
+import type { DirectiveResult } from 'lit/directive.js';
 import type { LitRendererResult } from '@vaadin/lit-renderer';
@@ -9,0 +9,0 @@ import { LitRendererDirective } from '@vaadin/lit-renderer';

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

@@ -106,2 +106,7 @@ /**
         },
+
+        /** @private  */
+        __draggedItems: {
+          value: () => [],
+        },
       };
@@ -174,2 +179,4 @@ }
 
+        this.__draggedItems = rows.map((row) => row._item);
+
         // Set the default transfer data
@@ -186,5 +193,3 @@ e.dataTransfer.setData('text', this.__formatDefaultTransferData(rows));
           this.style.setProperty('--_grid-drag-start-y', '');
-          rows.forEach((row) => {
-            updateBooleanRowStates(row, { 'drag-source': true });
-          });
+          this.requestContentUpdate();
         });
@@ -194,3 +199,3 @@
           detail: {
-            draggedItems: rows.map((row) => row._item),
+            draggedItems: [...this.__draggedItems],
             setDragData: (type, data) => e.dataTransfer.setData(type, data),
@@ -213,5 +218,4 @@ setDraggedItemsCount: (count) => row.setAttribute('dragstart', count),
 
-      iterateChildren(this.$.items, (row) => {
-        updateBooleanRowStates(row, { 'drag-source': false });
-      });
+      this.__draggedItems = [];
+      this.requestContentUpdate();
     }
@@ -347,2 +351,7 @@
     /** @private */
+    __updateDragSourceParts(row, model) {
+      updateBooleanRowStates(row, { 'drag-source': this.__draggedItems.includes(model.item) });
+    }
+
+    /** @private */
     _onDrop(e) {
@@ -349,0 +358,0 @@ if (this.dropMode) {

src/vaadin-grid-mixin.js

@@ -621,4 +621,4 @@ /**
         cell._focusButton = div;
-        cell.focus = function () {
-          cell._focusButton.focus();
+        cell.focus = function (options) {
+          cell._focusButton.focus(options);
         };
@@ -646,3 +646,3 @@
             if (!contentContainsFocusedElement && mouseUpWithinCell) {
-              cell.focus();
+              cell.focus({ preventScroll: true });
             }
@@ -657,3 +657,3 @@ document.removeEventListener('mouseup', mouseUpListener, true);
             if (!cellContent.contains(this.getRootNode().activeElement)) {
-              cell.focus();
+              cell.focus({ preventScroll: true });
             }
@@ -974,2 +974,3 @@ });
       this._filterDragAndDrop(row, model);
+      this.__updateDragSourceParts(row, model);
 
@@ -1034,3 +1035,9 @@ iterateChildren(row, (cell) => {
       if (tooltip && tooltip.isConnected) {
-        this._tooltipController.setTarget(event.target);
+        const target = event.target;
+
+        if (!this.__isCellFullyVisible(target)) {
+          return;
+        }
+
+        this._tooltipController.setTarget(target);
         this._tooltipController.setContext(this.getEventContext(event));
@@ -1046,2 +1053,29 @@
 
+    /** @private */
+    __isCellFullyVisible(cell) {
+      if (cell.hasAttribute('frozen') || cell.hasAttribute('frozen-to-end')) {
+        // Frozen cells are always fully visible
+        return true;
+      }
+
+      let { left, right } = this.getBoundingClientRect();
+
+      const frozen = [...cell.parentNode.children].find((cell) => cell.hasAttribute('last-frozen'));
+      if (frozen) {
+        const frozenRect = frozen.getBoundingClientRect();
+        left = this.__isRTL ? left : frozenRect.right;
+        right = this.__isRTL ? frozenRect.left : right;
+      }
+
+      const frozenToEnd = [...cell.parentNode.children].find((cell) => cell.hasAttribute('first-frozen-to-end'));
+      if (frozenToEnd) {
+        const frozenToEndRect = frozenToEnd.getBoundingClientRect();
+        left = this.__isRTL ? frozenToEndRect.right : left;
+        right = this.__isRTL ? right : frozenToEndRect.left;
+      }
+
+      const cellRect = cell.getBoundingClientRect();
+      return cellRect.left >= left && cellRect.right <= right;
+    }
+
     /** @protected */
@@ -1048,0 +1082,0 @@ _hideTooltip(immediate) {

src/vaadin-grid-scroll-mixin.js

@@ -129,3 +129,6 @@ /**
           // Make sure the row with the focused element is fully inside the visible viewport
-          this.__scrollIntoViewport(this._rowWithFocusedElement.index);
+          // Don't change scroll position if the user is interacting with the mouse
+          if (!this._isMousedown) {
+            this.__scrollIntoViewport(this._rowWithFocusedElement.index);
+          }
 
@@ -132,0 +135,0 @@ if (!this.$.table.contains(e.relatedTarget)) {

src/vaadin-grid.d.ts

@@ -193,3 +193,4 @@ /**
  * `details-opened-row-cell`  | Cell in an row with details open
- * `dragstart-row-cell`       | Cell in a row that user started to drag (set for one frame)
+ * `dragstart-row-cell`       | Cell in the ghost image row, but not in a source row
+ * `drag-source-row-cell`     | Cell in a source row, but not in the ghost image
  * `dragover-above-row-cell`  | Cell in a row that has another row dragged over above
@@ -196,0 +197,0 @@ * `dragover-below-row-cell`  | Cell in a row that has another row dragged over below

theme/lumo/vaadin-grid-styles.js

@@ -278,3 +278,4 @@ import '@vaadin/vaadin-lumo-styles/color.js';
     [part='resize-handle'] {
-      width: 3px;
+      --_resize-handle-width: 3px;
+      width: var(--_resize-handle-width);
       background-color: var(--lumo-primary-color-50pct);
@@ -285,2 +286,7 @@ opacity: 0;
 
+    [part='resize-handle']::before {
+      transform: translateX(calc(-50% + var(--_resize-handle-width) / 2));
+      width: var(--lumo-size-s);
+    }
+
     :host(:not([reordering])) *:not([column-resizing]) [part~='cell']:hover [part='resize-handle'],
@@ -287,0 +293,0 @@ [part='resize-handle']:active {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

677212

increased by0.27%

Lines of code

16258

increased by0.26%

Dependency changes

• + Added@vaadin/a11y-base@24.5.0-beta1(transitive)

• + Added@vaadin/checkbox@24.5.0-beta1(transitive)

• + Added@vaadin/component-base@24.5.0-beta1(transitive)

• + Added@vaadin/field-base@24.5.0-beta1(transitive)

• + Added@vaadin/icon@24.5.0-beta1(transitive)

• + Added@vaadin/input-container@24.5.0-beta1(transitive)

• + Added@vaadin/lit-renderer@24.5.0-beta1(transitive)

• + Added@vaadin/text-field@24.5.0-beta1(transitive)

• + Added@vaadin/vaadin-lumo-styles@24.5.0-beta1(transitive)

• + Added@vaadin/vaadin-material-styles@24.5.0-beta1(transitive)

• + Added@vaadin/vaadin-themable-mixin@24.5.0-beta1(transitive)

• - Removed@vaadin/a11y-base@24.5.0-alpha9(transitive)

• - Removed@vaadin/checkbox@24.5.0-alpha9(transitive)

• - Removed@vaadin/component-base@24.5.0-alpha9(transitive)

• - Removed@vaadin/field-base@24.5.0-alpha9(transitive)

• - Removed@vaadin/icon@24.5.0-alpha9(transitive)

• - Removed@vaadin/input-container@24.5.0-alpha9(transitive)

• - Removed@vaadin/lit-renderer@24.5.0-alpha9(transitive)

• - Removed@vaadin/text-field@24.5.0-alpha9(transitive)

• - Removed@vaadin/vaadin-lumo-styles@24.5.0-alpha9(transitive)

• - Removed@vaadin/vaadin-material-styles@24.5.0-alpha9(transitive)

• - Removed@vaadin/vaadin-themable-mixin@24.5.0-alpha9(transitive)

• Updated@vaadin/a11y-base@24.5.0-beta1

• Updated@vaadin/checkbox@24.5.0-beta1

• Updated@vaadin/component-base@24.5.0-beta1

• Updated@vaadin/lit-renderer@24.5.0-beta1

• Updated@vaadin/text-field@24.5.0-beta1

• Updated@vaadin/vaadin-lumo-styles@24.5.0-beta1

• Updated@vaadin/vaadin-material-styles@24.5.0-beta1

• Updated@vaadin/vaadin-themable-mixin@24.5.0-beta1