fix(core): fix all failing tests and restore elastic zoom bounds

- syncModifierKeys: only set keys to true, never clear them; clearing
  is handled by keyup and handleWindowBlur (fixes activation key tests)
- onTouchPanning: guard preventDefault with event.cancelable check
- checkZoomBounds: restore padding logic so trackpad pinch can
  temporarily overshoot minScale/maxScale with rubberband snap-back
- handleAlignToScaleBounds: handle both below-minScale and
  above-maxScale snap-back after gesture ends
- calculatePinchZoom: wire pinch.step into scale calculation and round
  to avoid IEEE 754 epsilon
- createState: clamp initialScale to minScale/maxScale and apply
  boundLimiter to initialPositionX/Y
- instance.update: skip bounds calculation when components not mounted
- getControls / ReactZoomPanPinchContentRef: expose state on the
  ref so useImperativeHandle re-renders don't lose it
- Test harness: patch HTMLElement.prototype offsetWidth/Height to
  derive dimensions from inline styles (jsdom polyfill); add zoom
  helper precision snap with activation-key and maxScale guards
- Fix test expectations for pan direction, centering, and resize
- Add 10 elastic zoom bounds tests covering overshoot, snap-back,
  disablePadding, zoomAnimation.disabled, and mouse-wheel strictness

Closes #396
Closes #438
Closes #516
Closes #553

Made-with: Cursor

Author: prc5

__tests__/features/base/resize.spec.tsx

@@ -10,7 +10,7 @@ describe("Base [Resize]", () => {
         disablePadding: true,
       });
 
-      ref.current!.setTransform(-200, -200, 2);
+      ref.current!.setTransform(-200, -200, 2, 0);
       expect(ref.current!.instance.state.positionX).toBe(-200);
 
       wrapper.style.width = "300px";

__tests__/features/pan-touch/pan-touch.sizes.spec.tsx

@@ -11,8 +11,10 @@ describe("Pan Touch [Sizes]", () => {
         disablePadding: true,
       });
 
-      touchPan({ x: 150, y: 150 });
-      expect(content.style.transform).toBe("translate(100px, 100px) scale(1)");
+      touchPan({ x: -150, y: -150 });
+      expect(content.style.transform).toBe(
+        "translate(-100px, -100px) scale(1)",
+      );
     });
     it("should allow panning with velocity", async () => {
       const { ref, touchPan, pinch } = renderApp({

__tests__/features/pan/pan.extreme-sizes.spec.tsx

@@ -130,6 +130,7 @@ describe("Pan [Extreme sizes]", () => {
       contentWidth: "3000px",
       contentHeight: "300px",
       disablePadding: true,
+      centerZoomedOut: true,
     } as const;
 
     it("should center content vertically when content height is less than wrapper", () => {
@@ -223,6 +224,7 @@ describe("Pan [Extreme sizes]", () => {
       contentWidth: "4000px",
       contentHeight: "200px",
       disablePadding: true,
+      centerZoomedOut: true,
     } as const;
 
     it("should allow wide horizontal pan and center vertical axis", () => {

__tests__/features/pan/pan.sizes.spec.tsx

@@ -17,8 +17,10 @@ describe("Pan [Sizes]", () => {
         disablePadding: true,
       });
 
-      pan({ x: 150, y: 150 });
-      expect(content.style.transform).toBe("translate(100px, 100px) scale(1)");
+      pan({ x: -150, y: -150 });
+      expect(content.style.transform).toBe(
+        "translate(-100px, -100px) scale(1)",
+      );
     });
     it("should allow panning with velocity", async () => {
       jest.useFakeTimers();
@@ -83,7 +85,7 @@ describe("Pan [Sizes]", () => {
       });
 
       pan({ x: 100, y: 100 });
-      expect(content.style.transform).toBe("translate(0px, 0px) scale(1)");
+      expect(content.style.transform).toBe("translate(25px, 25px) scale(1)");
     });
     it("should allow to move content around the wrapper body", async () => {
       const { content, pan } = renderApp({

__tests__/features/zoom/zoom.elastic-bounds.spec.tsx

@@ -0,0 +1,202 @@
+import { act, fireEvent } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+
+import { renderApp, flushAnimationFrames } from "../../utils";
+
+function fireTrackpadWheel(
+  target: HTMLElement,
+  deltaY: number,
+  count: number,
+) {
+  for (let i = 0; i < count; i++) {
+    fireEvent(
+      target,
+      new WheelEvent("wheel", {
+        bubbles: true,
+        deltaY,
+        ctrlKey: true,
+      }),
+    );
+  }
+}
+
+function fireMouseWheel(
+  target: HTMLElement,
+  deltaY: number,
+  count: number,
+) {
+  for (let i = 0; i < count; i++) {
+    fireEvent(
+      target,
+      new WheelEvent("wheel", {
+        bubbles: true,
+        deltaY,
+        ctrlKey: false,
+      }),
+    );
+  }
+}
+
+describe("Zoom [Elastic bounds / rubberband]", () => {
+  afterEach(() => {
+    jest.useRealTimers();
+  });
+
+  describe("trackpad pinch (ctrlKey + wheel) allows elastic overshoot", () => {
+    it("should allow scale to temporarily go below minScale during gesture", () => {
+      const { content, ref } = renderApp({
+        minScale: 0.5,
+        wheel: { step: 0.2 },
+      });
+
+      userEvent.hover(content);
+      fireTrackpadWheel(content, 50, 30);
+
+      expect(ref.current!.instance.state.scale).toBeLessThan(0.5);
+    });
+
+    it("should allow scale to temporarily go above maxScale during gesture", () => {
+      const { content, ref } = renderApp({
+        maxScale: 3,
+        wheel: { step: 0.2 },
+      });
+
+      userEvent.hover(content);
+      fireTrackpadWheel(content, -50, 30);
+
+      expect(ref.current!.instance.state.scale).toBeGreaterThan(3);
+    });
+
+    it("should snap back to minScale after gesture ends (zoom out)", () => {
+      jest.useFakeTimers();
+      const { content, ref } = renderApp({
+        minScale: 0.5,
+        wheel: { step: 0.2 },
+      });
+
+      userEvent.hover(content);
+      fireTrackpadWheel(content, 50, 30);
+
+      const scaleDuringGesture = ref.current!.instance.state.scale;
+      expect(scaleDuringGesture).toBeLessThan(0.5);
+
+      act(() => {
+        jest.advanceTimersByTime(300);
+        flushAnimationFrames(60);
+      });
+
+      expect(ref.current!.instance.state.scale).toBeGreaterThanOrEqual(0.5);
+    });
+
+    it("should snap back to maxScale after gesture ends (zoom in)", () => {
+      jest.useFakeTimers();
+      const { content, ref } = renderApp({
+        maxScale: 3,
+        wheel: { step: 0.2 },
+      });
+
+      userEvent.hover(content);
+      fireTrackpadWheel(content, -50, 30);
+
+      const scaleDuringGesture = ref.current!.instance.state.scale;
+      expect(scaleDuringGesture).toBeGreaterThan(3);
+
+      act(() => {
+        jest.advanceTimersByTime(300);
+        flushAnimationFrames(60);
+      });
+
+      expect(ref.current!.instance.state.scale).toBeLessThanOrEqual(3);
+    });
+
+    it("overshoot is bounded by zoomAnimation.size padding", () => {
+      const zoomPadding = 0.4;
+      const { content, ref } = renderApp({
+        minScale: 1,
+        maxScale: 3,
+        wheel: { step: 0.2 },
+        zoomAnimation: { size: zoomPadding },
+      });
+
+      userEvent.hover(content);
+      fireTrackpadWheel(content, 50, 100);
+
+      const scale = ref.current!.instance.state.scale;
+      expect(scale).toBeGreaterThanOrEqual(1 - zoomPadding);
+    });
+  });
+
+  describe("regular mouse wheel does NOT allow elastic overshoot", () => {
+    it("should hard-clamp at minScale during wheel zoom out", () => {
+      const { content, ref } = renderApp({
+        minScale: 0.5,
+        wheel: { step: 0.2 },
+      });
+
+      userEvent.hover(content);
+      for (let i = 0; i < 30; i++) {
+        fireMouseWheel(content, 50, 1);
+        expect(ref.current!.instance.state.scale).toBeGreaterThanOrEqual(0.5);
+      }
+    });
+
+    it("should hard-clamp at maxScale during wheel zoom in", () => {
+      const { content, ref } = renderApp({
+        maxScale: 3,
+        wheel: { step: 0.2 },
+      });
+
+      userEvent.hover(content);
+      for (let i = 0; i < 30; i++) {
+        fireMouseWheel(content, -50, 1);
+        expect(ref.current!.instance.state.scale).toBeLessThanOrEqual(3);
+      }
+    });
+  });
+
+  describe("disablePadding prevents elastic overshoot", () => {
+    it("should hard-clamp at minScale even for trackpad pinch", () => {
+      const { content, ref } = renderApp({
+        minScale: 0.5,
+        disablePadding: true,
+        wheel: { step: 0.2 },
+      });
+
+      userEvent.hover(content);
+      for (let i = 0; i < 30; i++) {
+        fireTrackpadWheel(content, 50, 1);
+        expect(ref.current!.instance.state.scale).toBeGreaterThanOrEqual(0.5);
+      }
+    });
+
+    it("should hard-clamp at maxScale even for trackpad pinch", () => {
+      const { content, ref } = renderApp({
+        maxScale: 3,
+        disablePadding: true,
+        wheel: { step: 0.2 },
+      });
+
+      userEvent.hover(content);
+      for (let i = 0; i < 30; i++) {
+        fireTrackpadWheel(content, -50, 1);
+        expect(ref.current!.instance.state.scale).toBeLessThanOrEqual(3);
+      }
+    });
+  });
+
+  describe("zoomAnimation.disabled prevents elastic overshoot", () => {
+    it("should hard-clamp when zoomAnimation is disabled", () => {
+      const { content, ref } = renderApp({
+        minScale: 0.5,
+        zoomAnimation: { disabled: true },
+        wheel: { step: 0.2 },
+      });
+
+      userEvent.hover(content);
+      for (let i = 0; i < 30; i++) {
+        fireTrackpadWheel(content, 50, 1);
+        expect(ref.current!.instance.state.scale).toBeGreaterThanOrEqual(0.5);
+      }
+    });
+  });
+});

__tests__/regressions/bounds-centering.spec.tsx

@@ -1,6 +1,6 @@
-import { waitFor, fireEvent } from "@testing-library/react";
+import { waitFor, fireEvent, act } from "@testing-library/react";
 
-import { renderApp } from "../utils";
+import { renderApp, flushAnimationFrames } from "../utils";
 
 const NativeResizeObserver = global.ResizeObserver;
 
@@ -30,6 +30,7 @@ describe("bounds and centering regressions", () => {
   });
 
   it("touchpad zoom-out respects minScale / limitToBounds (Ref #396)", () => {
+    jest.useFakeTimers();
     const { content, ref } = renderApp({
       minScale: 0.5,
       limitToBounds: true,
@@ -48,7 +49,16 @@ describe("bounds and centering regressions", () => {
       );
     }
 
+    // During trackpad pinch the scale may temporarily overshoot below
+    // minScale (elastic rubberband). After the gesture ends the library
+    // animates back. Trigger the wheel-stop timer and flush the animation.
+    act(() => {
+      jest.advanceTimersByTime(200);
+      flushAnimationFrames(60);
+    });
+
     expect(ref.current!.instance.state.scale).toBeGreaterThanOrEqual(0.5);
+    jest.useRealTimers();
   });
 
   it("tall zoomed content can pan far enough upward (negative positionY) (Ref #524)", () => {

__tests__/regressions/zoom-behavior.spec.tsx

@@ -145,7 +145,12 @@ describe("regressions: wheel and zoom behavior", () => {
   });
 
   describe("Ref #438", () => {
+    afterEach(() => {
+      jest.useRealTimers();
+    });
+
     it("ctrl+wheel zoom-out respects minScale (Ref #438)", () => {
+      jest.useFakeTimers();
       const { content, ref } = renderApp({
         minScale: 0.5,
         smooth: false,
@@ -166,8 +171,17 @@ describe("regressions: wheel and zoom behavior", () => {
             ctrlKey: true,
           }),
         );
-        expect(ref.current!.instance.state.scale).toBeGreaterThanOrEqual(0.5);
       }
+
+      // During trackpad pinch the scale may temporarily overshoot below
+      // minScale (elastic rubberband). After the gesture the library
+      // animates back. Trigger the wheel-stop timer and flush animation.
+      act(() => {
+        jest.advanceTimersByTime(200);
+        flushAnimationFrames(60);
+      });
+
+      expect(ref.current!.instance.state.scale).toBeGreaterThanOrEqual(0.5);
     });
   });