@vaadin/form-layout 24.6.3 → 24.6.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/form-layout",
-  "version": "24.6.3",
+  "version": "24.6.4",
   "publishConfig": {
     "access": "public"
   },
@@ -36,22 +36,23 @@
   ],
   "dependencies": {
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/a11y-base": "~24.6.3",
-    "@vaadin/component-base": "~24.6.3",
-    "@vaadin/vaadin-lumo-styles": "~24.6.3",
-    "@vaadin/vaadin-material-styles": "~24.6.3",
-    "@vaadin/vaadin-themable-mixin": "~24.6.3"
+    "@vaadin/a11y-base": "~24.6.4",
+    "@vaadin/component-base": "~24.6.4",
+    "@vaadin/vaadin-lumo-styles": "~24.6.4",
+    "@vaadin/vaadin-material-styles": "~24.6.4",
+    "@vaadin/vaadin-themable-mixin": "~24.6.4"
   },
   "devDependencies": {
-    "@vaadin/chai-plugins": "~24.6.3",
-    "@vaadin/custom-field": "~24.6.3",
+    "@vaadin/chai-plugins": "~24.6.4",
+    "@vaadin/custom-field": "~24.6.4",
+    "@vaadin/test-runner-commands": "~24.6.4",
     "@vaadin/testing-helpers": "^1.1.0",
-    "@vaadin/text-field": "~24.6.3",
+    "@vaadin/text-field": "~24.6.4",
     "sinon": "^18.0.0"
   },
   "web-types": [
     "web-types.json",
     "web-types.lit.json"
   ],
-  "gitHead": "26a1f4cd0fd9de4543862015feda3d35c78bd3b8"
+  "gitHead": "02d8ac2c39bc2d27fe60acec7d7bac6bdb73d8a1"
 }

package/src/vaadin-form-layout.js

@@ -240,11 +240,6 @@ class FormLayout extends ResizeMixin(ElementMixin(ThemableMixin(PolymerElement))
       _labelsOnTop: {
         type: Boolean,
       },
-
-      /** @private */
-      __isVisible: {
-        type: Boolean,
-      },
     };
   }
 
@@ -269,22 +264,6 @@ class FormLayout extends ResizeMixin(ElementMixin(ThemableMixin(PolymerElement))
     this.addEventListener('animationend', this.__onAnimationEnd);
   }
 
-  constructor() {
-    super();
-
-    this.__intersectionObserver = new IntersectionObserver(([entry]) => {
-      if (!entry.isIntersecting) {
-        // Prevent possible jump when layout becomes visible
-        this.$.layout.style.opacity = 0;
-      }
-      if (!this.__isVisible && entry.isIntersecting) {
-        this._updateLayout();
-        this.$.layout.style.opacity = '';
-      }
-      this.__isVisible = entry.isIntersecting;
-    });
-  }
-
   /** @protected */
   connectedCallback() {
     super.connectedCallback();
@@ -293,7 +272,6 @@ class FormLayout extends ResizeMixin(ElementMixin(ThemableMixin(PolymerElement))
     requestAnimationFrame(() => this._updateLayout());
 
     this._observeChildrenColspanChange();
-    this.__intersectionObserver.observe(this.$.layout);
   }
 
   /** @protected */
@@ -302,7 +280,6 @@ class FormLayout extends ResizeMixin(ElementMixin(ThemableMixin(PolymerElement))
 
     this.__mutationObserver.disconnect();
     this.__childObserver.disconnect();
-    this.__intersectionObserver.disconnect();
   }
 
   /** @private */
@@ -575,8 +552,16 @@ class FormLayout extends ResizeMixin(ElementMixin(ThemableMixin(PolymerElement))
    * @protected
    * @override
    */
-  _onResize() {
+  _onResize(contentRect) {
+    if (contentRect.width === 0 && contentRect.height === 0) {
+      this.$.layout.style.opacity = '0';
+      return;
+    }
+
     this._selectResponsiveStep();
+    this._updateLayout();
+
+    this.$.layout.style.opacity = '';
   }
 }
 

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/form-layout",
-  "version": "24.6.3",
+  "version": "24.6.4",
   "description-markup": "markdown",
   "contributions": {
     "html": {

package/web-types.lit.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/form-layout",
-  "version": "24.6.3",
+  "version": "24.6.4",
   "description-markup": "markdown",
   "framework": "lit",
   "framework-config": {