@lingxia/elements 0.10.0 → 0.11.1

package/dist/video.d.ts

@@ -67,6 +67,8 @@ export declare class LxVideoElement extends HTMLElement {
     private attrObserver?;
     private resizeEventListener;
     private iOSScrollEventListener;
+    private scrollSettleFrame;
+    private containerScrollListener;
     private rawHandlers;
     private _pageBindings;
     private parseRotateValue;

package/dist/video.js

@@ -25,6 +25,21 @@ export class LxVideoElement extends HTMLElement {
         this.iOSScrollEventListener = {
             handleEvent: () => this.boundUpdatePosition(),
         };
+        this.scrollSettleFrame = null;
+        // Scroll events do not bubble, so a plain window listener misses inner
+        // scroll containers; the capture phase sees them all. Any ancestor
+        // scrolling moves the element's document rect, so re-measure (coalesced
+        // to one update per frame; decide() dedups unchanged rects).
+        this.containerScrollListener = {
+            handleEvent: () => {
+                if (this.scrollSettleFrame !== null)
+                    return;
+                this.scrollSettleFrame = requestAnimationFrame(() => {
+                    this.scrollSettleFrame = null;
+                    this.updatePosition();
+                });
+            },
+        };
         this.rawHandlers = {};
         this._pageBindings = {};
     }
@@ -538,6 +553,12 @@ export class LxVideoElement extends HTMLElement {
         if (isIOS()) {
             window.addEventListener("scroll", this.iOSScrollEventListener, { passive: true });
         }
+        else if (isWindows()) {
+            window.addEventListener("scroll", this.containerScrollListener, {
+                capture: true,
+                passive: true,
+            });
+        }
         if (isAndroid()) {
             this.removeLayoutInvalidationListener = addNativeComponentLayoutInvalidationListener(this.resizeEventListener);
         }
@@ -550,9 +571,16 @@ export class LxVideoElement extends HTMLElement {
         if (isIOS()) {
             window.removeEventListener("scroll", this.iOSScrollEventListener);
         }
+        else if (isWindows()) {
+            window.removeEventListener("scroll", this.containerScrollListener, { capture: true });
+        }
         (_a = this.removeLayoutInvalidationListener) === null || _a === void 0 ? void 0 : _a.call(this);
         this.removeLayoutInvalidationListener = undefined;
         this.stopSizeObserver();
+        if (this.scrollSettleFrame !== null) {
+            cancelAnimationFrame(this.scrollSettleFrame);
+            this.scrollSettleFrame = null;
+        }
         if (this.winSettleFrame !== null) {
             cancelAnimationFrame(this.winSettleFrame);
             this.winSettleFrame = null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lingxia/elements",
-  "version": "0.10.0",
+  "version": "0.11.1",
   "private": false,
   "description": "LingXia custom elements — native-backed web components for LxApp pages",
   "type": "module",

package/src/video.ts

@@ -106,6 +106,20 @@ export class LxVideoElement extends HTMLElement {
   private iOSScrollEventListener: EventListenerObject = {
     handleEvent: () => this.boundUpdatePosition(),
   };
+  private scrollSettleFrame: number | null = null;
+  // Scroll events do not bubble, so a plain window listener misses inner
+  // scroll containers; the capture phase sees them all. Any ancestor
+  // scrolling moves the element's document rect, so re-measure (coalesced
+  // to one update per frame; decide() dedups unchanged rects).
+  private containerScrollListener: EventListenerObject = {
+    handleEvent: () => {
+      if (this.scrollSettleFrame !== null) return;
+      this.scrollSettleFrame = requestAnimationFrame(() => {
+        this.scrollSettleFrame = null;
+        this.updatePosition();
+      });
+    },
+  };
   private rawHandlers: Record<string, EventListenerOrEventListenerObject> = {};
   private _pageBindings: Record<string, string> = {};
 
@@ -641,6 +655,11 @@ export class LxVideoElement extends HTMLElement {
     window.addEventListener("resize", this.resizeEventListener);
     if (isIOS()) {
       window.addEventListener("scroll", this.iOSScrollEventListener, { passive: true });
+    } else if (isWindows()) {
+      window.addEventListener("scroll", this.containerScrollListener, {
+        capture: true,
+        passive: true,
+      });
     }
     if (isAndroid()) {
       this.removeLayoutInvalidationListener = addNativeComponentLayoutInvalidationListener(this.resizeEventListener);
@@ -653,10 +672,16 @@ export class LxVideoElement extends HTMLElement {
     window.removeEventListener("resize", this.resizeEventListener);
     if (isIOS()) {
       window.removeEventListener("scroll", this.iOSScrollEventListener);
+    } else if (isWindows()) {
+      window.removeEventListener("scroll", this.containerScrollListener, { capture: true });
     }
     this.removeLayoutInvalidationListener?.();
     this.removeLayoutInvalidationListener = undefined;
     this.stopSizeObserver();
+    if (this.scrollSettleFrame !== null) {
+      cancelAnimationFrame(this.scrollSettleFrame);
+      this.scrollSettleFrame = null;
+    }
     if (this.winSettleFrame !== null) {
       cancelAnimationFrame(this.winSettleFrame);
       this.winSettleFrame = null;