@vaadin/grid
Advanced tools
@vaadin/grid - npm Package Compare versions
Comparing version
| { | ||
| "name": "@vaadin/grid", | ||
| "version": "24.6.0-alpha4", | ||
| "version": "24.6.0-alpha5", | ||
| "publishConfig": { | ||
@@ -49,14 +49,14 @@ "access": "public" | ||
| "@polymer/polymer": "^3.0.0", | ||
| "@vaadin/a11y-base": "24.6.0-alpha4", | ||
| "@vaadin/checkbox": "24.6.0-alpha4", | ||
| "@vaadin/component-base": "24.6.0-alpha4", | ||
| "@vaadin/lit-renderer": "24.6.0-alpha4", | ||
| "@vaadin/text-field": "24.6.0-alpha4", | ||
| "@vaadin/vaadin-lumo-styles": "24.6.0-alpha4", | ||
| "@vaadin/vaadin-material-styles": "24.6.0-alpha4", | ||
| "@vaadin/vaadin-themable-mixin": "24.6.0-alpha4", | ||
| "@vaadin/a11y-base": "24.6.0-alpha5", | ||
| "@vaadin/checkbox": "24.6.0-alpha5", | ||
| "@vaadin/component-base": "24.6.0-alpha5", | ||
| "@vaadin/lit-renderer": "24.6.0-alpha5", | ||
| "@vaadin/text-field": "24.6.0-alpha5", | ||
| "@vaadin/vaadin-lumo-styles": "24.6.0-alpha5", | ||
| "@vaadin/vaadin-material-styles": "24.6.0-alpha5", | ||
| "@vaadin/vaadin-themable-mixin": "24.6.0-alpha5", | ||
| "lit": "^3.0.0" | ||
| }, | ||
| "devDependencies": { | ||
| "@vaadin/chai-plugins": "24.6.0-alpha4", | ||
| "@vaadin/chai-plugins": "24.6.0-alpha5", | ||
| "@vaadin/testing-helpers": "^1.0.0", | ||
@@ -69,3 +69,3 @@ "sinon": "^18.0.0" | ||
| ], | ||
| "gitHead": "78967d4f3bb46f58f43c2cc621802554acb2efaf" | ||
| "gitHead": "cbfa46fe276f254dcaa99a622710d56df7f0a539" | ||
| } |
@@ -118,2 +118,7 @@ /** | ||
| constructor() { | ||
| super(); | ||
| this.__onDocumentDragStart = this.__onDocumentDragStart.bind(this); | ||
| } | ||
| /** @protected */ | ||
@@ -135,2 +140,18 @@ ready() { | ||
| /** @protected */ | ||
| connectedCallback() { | ||
| super.connectedCallback(); | ||
| // Chromium based browsers cannot properly generate drag images for elements | ||
| // that have children with massive heights. This workaround prevents crashes | ||
| // and performance issues by excluding the items from the drag image. | ||
| // https://github.com/vaadin/web-components/issues/7985 | ||
| document.addEventListener('dragstart', this.__onDocumentDragStart, { capture: true }); | ||
| } | ||
| /** @protected */ | ||
| disconnectedCallback() { | ||
| super.disconnectedCallback(); | ||
| document.removeEventListener('dragstart', this.__onDocumentDragStart, { capture: true }); | ||
| } | ||
| /** @private */ | ||
@@ -297,2 +318,25 @@ _onDragStart(e) { | ||
| /** @private */ | ||
| __onDocumentDragStart(e) { | ||
| // The dragged element can be the element itself or a parent of the element | ||
| if (!e.target.contains(this)) { | ||
| return; | ||
| } | ||
| // The threshold value 20000 provides a buffer to both | ||
| // - avoid the crash and the performance issues | ||
| // - unnecessarily avoid excluding items from the drag image | ||
| if (this.$.items.offsetHeight > 20000) { | ||
| const initialItemsMaxHeight = this.$.items.style.maxHeight; | ||
| const initialTableOverflow = this.$.table.style.overflow; | ||
| // Momentarily hides the items until the browser starts generating the | ||
| // drag image. | ||
| this.$.items.style.maxHeight = '0'; | ||
| this.$.table.style.overflow = 'hidden'; | ||
| requestAnimationFrame(() => { | ||
| this.$.items.style.maxHeight = initialItemsMaxHeight; | ||
| this.$.table.style.overflow = initialTableOverflow; | ||
| }); | ||
| } | ||
| } | ||
| /** @private */ | ||
| __dndAutoScroll(clientY) { | ||
@@ -299,0 +343,0 @@ if (this.__dndAutoScrolling) { |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Improved metrics
- Total package byte prevSize
685874
0.25%- Lines of code
16421
0.24%Dependency changes
+ Added
@vaadin/a11y-base@24.6.0-alpha5(transitive)+ Added
@vaadin/checkbox@24.6.0-alpha5(transitive)+ Added
@vaadin/component-base@24.6.0-alpha5(transitive)+ Added
@vaadin/field-base@24.6.0-alpha5(transitive)+ Added
@vaadin/icon@24.6.0-alpha5(transitive)+ Added
@vaadin/input-container@24.6.0-alpha5(transitive)+ Added
@vaadin/lit-renderer@24.6.0-alpha5(transitive)+ Added
@vaadin/text-field@24.6.0-alpha5(transitive)+ Added
@vaadin/vaadin-lumo-styles@24.6.0-alpha5(transitive)+ Added
@vaadin/vaadin-material-styles@24.6.0-alpha5(transitive)+ Added
@vaadin/vaadin-themable-mixin@24.6.0-alpha5(transitive)- Removed
@vaadin/a11y-base@24.6.0-alpha4(transitive)- Removed
@vaadin/checkbox@24.6.0-alpha4(transitive)- Removed
@vaadin/component-base@24.6.0-alpha4(transitive)- Removed
@vaadin/field-base@24.6.0-alpha4(transitive)- Removed
@vaadin/icon@24.6.0-alpha4(transitive)- Removed
@vaadin/input-container@24.6.0-alpha4(transitive)- Removed
@vaadin/lit-renderer@24.6.0-alpha4(transitive)- Removed
@vaadin/text-field@24.6.0-alpha4(transitive)- Removed
@vaadin/vaadin-lumo-styles@24.6.0-alpha4(transitive)- Removed
@vaadin/vaadin-material-styles@24.6.0-alpha4(transitive)- Removed
@vaadin/vaadin-themable-mixin@24.6.0-alpha4(transitive)