@pixodesk/svg-animator-web 1.0.28 → 1.0.30

package/dist/index.prerendered.umd.js

@@ -2440,8 +2440,11 @@ var PixodeskAnimator = (() => {
     driver.refresh();
     return driver;
   }
+  function pinScrollportHeight(svgRoot) {
+    const scroller = findNearestScroller(svgRoot, "y");
+    return scroller ? scroller.clientHeight : document.documentElement.clientHeight;
+  }
   function applyScrollPin(svgRoot, scroll) {
-    var _a;
     const styled = svgRoot;
     if (!(scroll == null ? void 0 : scroll.pin) || !styled.style) return () => {
     };
@@ -2449,7 +2452,28 @@ var PixodeskAnimator = (() => {
     const prevPosition = style.position;
     const prevTop = style.top;
     style.position = "sticky";
-    style.top = ((_a = scroll.pinTop) != null ? _a : 0) + "px";
+    const alignFactor = scroll.pinAlign === "center" ? 0.5 : scroll.pinAlign === "bottom" ? 1 : 0;
+    const applyTop = () => {
+      var _a;
+      const extra = (_a = scroll.pinTop) != null ? _a : 0;
+      if (!alignFactor) {
+        style.top = extra + "px";
+        return;
+      }
+      const portSize = pinScrollportHeight(svgRoot);
+      const ownSize = svgRoot.getBoundingClientRect().height;
+      style.top = Math.round((portSize - ownSize) * alignFactor + extra) + "px";
+    };
+    applyTop();
+    let resizeObserver = null;
+    const onWindowResize = alignFactor ? applyTop : null;
+    if (alignFactor) {
+      if (onWindowResize) window.addEventListener("resize", onWindowResize);
+      if (typeof ResizeObserver !== "undefined") {
+        resizeObserver = new ResizeObserver(applyTop);
+        resizeObserver.observe(svgRoot);
+      }
+    }
     let wrapper = null;
     const parent = svgRoot.parentElement;
     if (scroll.pinDistance && scroll.pinDistance > 0 && parent) {
@@ -2460,6 +2484,8 @@ var PixodeskAnimator = (() => {
       wrapper.appendChild(svgRoot);
     }
     return () => {
+      if (onWindowResize) window.removeEventListener("resize", onWindowResize);
+      resizeObserver == null ? void 0 : resizeObserver.disconnect();
       style.position = prevPosition;
       style.top = prevTop;
       if (wrapper == null ? void 0 : wrapper.parentElement) {