@zoompinch/core 0.0.27 → 0.0.28

package/dist/zoompinch-core.es.js

@@ -1,58 +1,63 @@
-var x = Object.defineProperty;
-var I = (o, h, t) => h in o ? x(o, h, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[h] = t;
-var f = (o, h, t) => I(o, typeof h != "symbol" ? h + "" : h, t);
-function W(o) {
+var z = Object.defineProperty;
+var F = (o, l, t) => l in o ? z(o, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[l] = t;
+var u = (o, l, t) => F(o, typeof l != "symbol" ? l + "" : l, t);
+function x(o) {
   return o * Math.PI / 180;
 }
-function C(o, h, t) {
-  return Math.min(Math.max(o, h), t);
+function C(o, l, t) {
+  return Math.min(Math.max(o, l), t);
 }
-function w(o, h, t) {
-  const [s, e] = o, [a, n] = h, r = Math.cos(t) * (s - a) - Math.sin(t) * (e - n) + a, i = Math.sin(t) * (s - a) + Math.cos(t) * (e - n) + n;
+function w(o, l, t) {
+  const [e, s] = o, [a, n] = l, r = Math.cos(t) * (e - a) - Math.sin(t) * (s - n) + a, i = Math.sin(t) * (e - a) + Math.cos(t) * (s - n) + n;
   return [r, i];
 }
-function Y(o, h) {
-  const t = Math.pow(10, h);
+function Y(o, l) {
+  const t = Math.pow(10, l);
   return Math.round(o * t) / t;
 }
-function z(o) {
-  var h = !1;
-  return o.wheelDeltaY ? o.wheelDeltaY === o.deltaY * -3 && (h = !0) : o.deltaMode === 0 && (h = !0), h;
-}
-function B(o, h) {
-  const t = h.find((s) => o % s === 0);
-  return t ? o / t : 1;
+function I(o) {
+  if (o.ctrlKey) {
+    const { deltaY: t, deltaMode: e, ctrlKey: s } = o, a = Math.abs(t), n = a === 120 || a === 100 || a === 3, r = t % 1 !== 0, i = e === 0;
+    return s ? a < 50 && i || r : !n && (r || i && a < 50);
+  } else {
+    var l = !1;
+    return o.wheelDeltaY ? o.wheelDeltaY === o.deltaY * -3 && (l = !0) : o.deltaMode === 0 && (l = !0), l;
+  }
 }
-function y(o, h, t, s, e) {
-  let a = o.left - h, n = o.top - t;
-  const r = Math.cos(-e), i = Math.sin(-e);
-  let c = a * r - n * i, l = a * i + n * r;
-  const u = o.width / s, d = o.height / s;
-  return c /= s, l /= s, { x: Y(c, 4), y: Y(l, 4), width: Y(u, 4), height: Y(d, 4) };
+function W(o, l, t, e, s) {
+  let a = o.left - l, n = o.top - t;
+  const r = Math.cos(-s), i = Math.sin(-s);
+  let c = a * r - n * i, h = a * i + n * r;
+  const d = o.width / e, p = o.height / e;
+  return c /= e, h /= e, { x: Y(c, 4), y: Y(h, 4), width: Y(d, 4), height: Y(p, 4) };
 }
-class E extends EventTarget {
-  constructor(t, s, e, a, n, r, i = 0.1, c = 10, l = !1, u = !0) {
+class D extends EventTarget {
+  constructor(t, e, s, a, n, r, i = 0.1, c = 10, h = !1, d = !0) {
     super();
-    f(this, "wrapperBounds");
-    f(this, "canvasBounds");
-    f(this, "gestureStartRotate", 0);
-    f(this, "dragStart", null);
-    f(this, "dragStartFrozenX", null);
-    f(this, "dragStartFrozenY", null);
-    f(this, "touchStarts", null);
-    f(this, "touchStartTranslateX", 0);
-    f(this, "touchStartTranslateY", 0);
-    this.element = t, this.offset = s, this.translateX = e, this.translateY = a, this.scale = n, this.rotate = r, this.minScale = i, this.maxScale = c, this.clampBounds = l, this.rotation = u;
-    const d = new ResizeObserver(() => {
+    u(this, "wrapperBounds");
+    u(this, "canvasBounds");
+    u(this, "translateSpeed", 1);
+    u(this, "zoomSpeed", 1);
+    u(this, "translateSpeedAppleTrackpad", 1);
+    u(this, "zoomSpeedAppleTrackpad", 1);
+    u(this, "gestureStartRotate", 0);
+    u(this, "dragStart", null);
+    u(this, "dragStartFrozenX", null);
+    u(this, "dragStartFrozenY", null);
+    u(this, "touchStarts", null);
+    u(this, "touchStartTranslateX", 0);
+    u(this, "touchStartTranslateY", 0);
+    this.element = t, this.offset = e, this.translateX = s, this.translateY = a, this.scale = n, this.rotate = r, this.minScale = i, this.maxScale = c, this.clampBounds = h, this.rotation = d;
+    const p = new ResizeObserver(() => {
       const { x: g, y: m, width: S, height: v } = this.element.getBoundingClientRect();
       this.wrapperBounds = { x: g, y: m, width: S, height: v }, this.update();
-    }), p = new ResizeObserver(() => {
-      const { x: g, y: m, width: S, height: v } = y(this.canvasElement.getBoundingClientRect(), this.renderingTranslateX, this.renderingTranslateY, this.renderinScale, this.renderingRotate);
+    }), f = new ResizeObserver(() => {
+      const { x: g, y: m, width: S, height: v } = W(this.canvasElement.getBoundingClientRect(), this.renderingTranslateX, this.renderingTranslateY, this.renderinScale, this.renderingRotate);
       this.canvasBounds = { x: g, y: m, width: S, height: v }, this.update();
     });
     requestAnimationFrame(() => {
       this.wrapperBounds = this.element.getBoundingClientRect(), this.canvasBounds = this.canvasElement.getBoundingClientRect(), this.update(), this.dispatchEvent(new Event("init"));
-    }), p.observe(this.canvasElement), d.observe(this.element);
+    }), f.observe(this.canvasElement), p.observe(this.element);
   }
   get canvasElement() {
     return this.element.querySelector(".canvas");
@@ -82,22 +87,22 @@ class E extends EventTarget {
   }
   // The clamping is an explicit user intention
   // The reason is that we do not want side effects when toggling the clamp
-  setTranslateFromUserGesture(t, s) {
+  setTranslateFromUserGesture(t, e) {
     if (this.clampBounds) {
-      const e = this.clampTranslate({ translateX: t, translateY: s, scale: this.scale, rotate: this.rotate });
-      this.translateX = e.translateX, this.translateY = e.translateY, this.rotate = 0;
+      const s = this.clampTranslate({ translateX: t, translateY: e, scale: this.scale, rotate: this.rotate });
+      this.translateX = s.translateX, this.translateY = s.translateY, this.rotate = 0;
     } else
-      this.translateX = t, this.translateY = s;
+      this.translateX = t, this.translateY = e;
   }
   handleGesturestart(t) {
     this.gestureStartRotate = this.rotate;
   }
   handleGesturechange(t) {
-    const { clientX: s, clientY: e } = t, a = t.rotation;
+    const { clientX: e, clientY: s } = t, a = t.rotation;
     if (a === 0 || !this.rotation)
       return;
-    const n = this.normalizeClientCoords(s, e);
-    this.rotateCanvas(n[0], n[1], this.gestureStartRotate + W(a));
+    const n = this.normalizeClientCoords(e, s);
+    this.rotateCanvas(n[0], n[1], this.gestureStartRotate + x(a));
   }
   handleGestureend(t) {
   }
@@ -109,28 +114,36 @@ class E extends EventTarget {
   }
   handleMousemove(t) {
     if (t.preventDefault(), this.dragStart && this.dragStartFrozenX !== null && this.dragStartFrozenY !== null) {
-      const s = t.clientX - this.dragStart[0], e = t.clientY - this.dragStart[1], a = this.dragStartFrozenX - -s, n = this.dragStartFrozenY - -e;
+      const e = t.clientX - this.dragStart[0], s = t.clientY - this.dragStart[1], a = this.dragStartFrozenX - -e, n = this.dragStartFrozenY - -s;
       this.setTranslateFromUserGesture(a, n), this.update();
     }
   }
   handleWheel(t) {
-    let { deltaX: s, deltaY: e, ctrlKey: a } = t;
-    const n = [120, 100], r = 2;
-    z(t) || ((Math.abs(s) === 120 || Math.abs(s) === 200) && (s = s / (100 / r * B(s, n)) * Math.sign(s)), (Math.abs(e) === 120 || Math.abs(e) === 200) && (e = e / (100 / r * B(e, n)) * Math.sign(e)));
-    const i = this.scale;
+    let { deltaX: e, deltaY: s, ctrlKey: a } = t;
+    const n = I(t);
+    n || (Math.abs(s) >= 100 && (s = Math.sign(s) * (Math.abs(s) / 120)), Math.abs(e) >= 100 && (e = Math.sign(e) * (Math.abs(e) / 120)));
+    const r = this.scale;
     if (a) {
-      const c = -e / 100 * i, l = C(i + c, this.minScale, this.maxScale), u = this.relativeWrapperCoordinatesFromClientCoords(t.clientX, t.clientY), [d, p] = this.calcProjectionTranslate(l, u, this.normalizeMatrixCoordinates(t.clientX, t.clientY));
-      this.setTranslateFromUserGesture(d, p), this.scale = l;
-    } else
-      this.setTranslateFromUserGesture(this.translateX - s, this.translateY - e);
+      const i = n ? 0.01 * this.zoomSpeedAppleTrackpad : 0.1 * this.zoomSpeed, c = 1 + -s * i;
+      let h = r * c;
+      if (h = C(h, this.minScale, this.maxScale), (h === this.minScale || h === this.maxScale) && (h === this.minScale && c < 1 || h === this.maxScale && c > 1)) {
+        t.preventDefault();
+        return;
+      }
+      const d = this.relativeWrapperCoordinatesFromClientCoords(t.clientX, t.clientY), [p, f] = this.calcProjectionTranslate(h, d, this.normalizeMatrixCoordinates(t.clientX, t.clientY));
+      this.setTranslateFromUserGesture(p, f), this.scale = h;
+    } else {
+      const i = n ? 1 * this.translateSpeedAppleTrackpad : 25 * this.translateSpeed;
+      this.setTranslateFromUserGesture(this.translateX - e * i, this.translateY - s * i);
+    }
     this.update(), t.preventDefault();
   }
   freezeTouches(t) {
-    return Array.from(t).map((s) => {
-      const e = this.clientCoordsToWrapperCoords(s.clientX, s.clientY);
+    return Array.from(t).map((e) => {
+      const s = this.clientCoordsToWrapperCoords(e.clientX, e.clientY);
       return {
-        client: [s.clientX, s.clientY],
-        canvasRel: this.getCanvasCoordsRel(e[0], e[1])
+        client: [e.clientX, e.clientY],
+        canvasRel: this.getCanvasCoordsRel(s[0], s[1])
       };
     });
   }
@@ -139,20 +152,20 @@ class E extends EventTarget {
   }
   handleTouchmove(t) {
     t.preventDefault();
-    const s = Array.from(t.touches).map((e) => this.clientCoordsToWrapperCoords(e.clientX, e.clientY));
+    const e = Array.from(t.touches).map((s) => this.clientCoordsToWrapperCoords(s.clientX, s.clientY));
     if (this.touchStarts) {
-      if (s.length >= 2 && this.touchStarts.length >= 2) {
-        const e = [this.touchStarts[0].canvasRel[0] * this.canvasBounds.width, this.touchStarts[0].canvasRel[1] * this.canvasBounds.height], a = [this.touchStarts[1].canvasRel[0] * this.canvasBounds.width, this.touchStarts[1].canvasRel[1] * this.canvasBounds.height], n = Math.sqrt(Math.pow(e[0] - a[0], 2) + Math.pow(e[1] - a[1], 2)), r = Math.sqrt(Math.pow(s[0][0] - s[1][0], 2) + Math.pow(s[0][1] - s[1][1], 2)) / this.naturalScale, i = C(r / n, this.minScale, this.maxScale), c = [s[0][0] / this.wrapperInnerWidth, s[0][1] / this.wrapperInnerHeight], l = this.touchStarts[0].canvasRel, [u, d] = this.calcProjectionTranslate(i, c, l, 0);
+      if (e.length >= 2 && this.touchStarts.length >= 2) {
+        const s = [this.touchStarts[0].canvasRel[0] * this.canvasBounds.width, this.touchStarts[0].canvasRel[1] * this.canvasBounds.height], a = [this.touchStarts[1].canvasRel[0] * this.canvasBounds.width, this.touchStarts[1].canvasRel[1] * this.canvasBounds.height], n = Math.sqrt(Math.pow(s[0] - a[0], 2) + Math.pow(s[1] - a[1], 2)), r = Math.sqrt(Math.pow(e[0][0] - e[1][0], 2) + Math.pow(e[0][1] - e[1][1], 2)) / this.naturalScale, i = C(r / n, this.minScale, this.maxScale), c = [e[0][0] / this.wrapperInnerWidth, e[0][1] / this.wrapperInnerHeight], h = this.touchStarts[0].canvasRel, [d, p] = this.calcProjectionTranslate(i, c, h, 0);
         if (this.rotation) {
-          let p = 0, g = 0, m = 0;
-          const S = Math.atan2(a[1] - e[1], a[0] - e[0]);
-          m = Math.atan2(s[1][1] - s[0][1], s[1][0] - s[0][0]) - S;
-          const T = (P, F) => [this.offset.left + this.canvasBounds.width * P * this.naturalScale * i + u, this.offset.top + this.canvasBounds.height * F * this.naturalScale * i + d], X = T(0, 0), M = T(this.touchStarts[0].canvasRel[0], this.touchStarts[0].canvasRel[1]), R = w(X, M, m);
-          p = R[0] - X[0], g = R[1] - X[1], this.scale = i, this.rotate = m, this.setTranslateFromUserGesture(u + p, d + g);
+          let f = 0, g = 0, m = 0;
+          const S = Math.atan2(a[1] - s[1], a[0] - s[0]);
+          m = Math.atan2(e[1][1] - e[0][1], e[1][0] - e[0][0]) - S;
+          const T = (B, P) => [this.offset.left + this.canvasBounds.width * B * this.naturalScale * i + d, this.offset.top + this.canvasBounds.height * P * this.naturalScale * i + p], X = T(0, 0), M = T(this.touchStarts[0].canvasRel[0], this.touchStarts[0].canvasRel[1]), R = w(X, M, m);
+          f = R[0] - X[0], g = R[1] - X[1], this.scale = i, this.rotate = m, this.setTranslateFromUserGesture(d + f, p + g);
         } else
-          this.scale = i, this.setTranslateFromUserGesture(u, d);
+          this.scale = i, this.setTranslateFromUserGesture(d, p);
       } else {
-        const e = t.touches[0].clientX - this.touchStarts[0].client[0], a = t.touches[0].clientY - this.touchStarts[0].client[1], n = this.touchStartTranslateX + e, r = this.touchStartTranslateY + a;
+        const s = t.touches[0].clientX - this.touchStarts[0].client[0], a = t.touches[0].clientY - this.touchStarts[0].client[1], n = this.touchStartTranslateX + s, r = this.touchStartTranslateY + a;
         this.setTranslateFromUserGesture(n, r);
       }
       this.update();
@@ -161,57 +174,57 @@ class E extends EventTarget {
   handleTouchend(t) {
     t.touches.length === 0 ? this.touchStarts = null : (this.touchStarts = this.freezeTouches(t.touches), this.touchStartTranslateX = this.translateX, this.touchStartTranslateY = this.translateY);
   }
-  calcProjectionTranslate(t, s, e, a) {
-    const n = this.canvasBounds.width * this.naturalScale, r = this.canvasBounds.height * this.naturalScale, i = e[0] * n * t, c = e[1] * r * t, l = w([i, c], [0, 0], a ?? this.rotate), u = s[0] * this.wrapperInnerWidth, d = s[1] * this.wrapperInnerHeight, p = u - l[0], g = d - l[1];
-    return [p, g];
+  calcProjectionTranslate(t, e, s, a) {
+    const n = this.canvasBounds.width * this.naturalScale, r = this.canvasBounds.height * this.naturalScale, i = s[0] * n * t, c = s[1] * r * t, h = w([i, c], [0, 0], a ?? this.rotate), d = e[0] * this.wrapperInnerWidth, p = e[1] * this.wrapperInnerHeight, f = d - h[0], g = p - h[1];
+    return [f, g];
   }
-  applyTransform(t, s, e) {
-    const a = this.calcProjectionTranslate(t, s, e, 0);
+  applyTransform(t, e, s) {
+    const a = this.calcProjectionTranslate(t, e, s, 0);
     this.scale = t, this.setTranslateFromUserGesture(a[0], a[1]), this.update();
   }
-  composeRelPoint(t, s, e, a, n, r) {
-    e = e ?? this.scale, a = a ?? this.translateX, n = n ?? this.translateY, r = r ?? this.rotate;
-    const i = [this.offset.left, this.offset.top], c = [this.offset.left + this.canvasBounds.width * (e * this.naturalScale) * t, this.offset.top + this.canvasBounds.height * (e * this.naturalScale) * s], l = w(c, i, r);
-    return [l[0] + a, l[1] + n];
+  composeRelPoint(t, e, s, a, n, r) {
+    s = s ?? this.scale, a = a ?? this.translateX, n = n ?? this.translateY, r = r ?? this.rotate;
+    const i = [this.offset.left, this.offset.top], c = [this.offset.left + this.canvasBounds.width * (s * this.naturalScale) * t, this.offset.top + this.canvasBounds.height * (s * this.naturalScale) * e], h = w(c, i, r);
+    return [h[0] + a, h[1] + n];
   }
-  composePoint(t, s) {
-    const e = t / this.canvasBounds.width, a = s / this.canvasBounds.height;
-    return this.composeRelPoint(e, a);
+  composePoint(t, e) {
+    const s = t / this.canvasBounds.width, a = e / this.canvasBounds.height;
+    return this.composeRelPoint(s, a);
   }
-  getAnchorOffset(t, s, e, a, n = [0.5, 0.5]) {
+  getAnchorOffset(t, e, s, a, n = [0.5, 0.5]) {
     const r = this.calcProjectionTranslate(t, n, n, 0), i = [
       this.offset.left + r[0] + this.canvasBounds.width * (t * this.naturalScale) * n[0],
       this.offset.top + r[1] + this.canvasBounds.height * (t * this.naturalScale) * n[1]
-    ], c = this.composeRelPoint(n[0], n[1], t, s, e, a), l = c[0] - i[0], u = c[1] - i[1];
-    return [l, u];
+    ], c = this.composeRelPoint(n[0], n[1], t, e, s, a), h = c[0] - i[0], d = c[1] - i[1];
+    return [h, d];
   }
   // Converts absolute inner wrapper coordinates to relative canvas coordinates (0-1, 0-1)
-  getCanvasCoordsRel(t, s) {
-    const e = [0, 0], a = [t - this.translateX, s - this.translateY], n = w(a, e, -this.rotate), r = [n[0] / this.renderinScale, n[1] / this.renderinScale];
+  getCanvasCoordsRel(t, e) {
+    const s = [0, 0], a = [t - this.translateX, e - this.translateY], n = w(a, s, -this.rotate), r = [n[0] / this.renderinScale, n[1] / this.renderinScale];
     return [r[0] / this.canvasBounds.width, r[1] / this.canvasBounds.height];
   }
   // Converts absolute client to coordinates to absolute inner-wrapper coorinates
-  clientCoordsToWrapperCoords(t, s) {
-    return [t - this.wrapperInnerX, s - this.wrapperInnerY];
+  clientCoordsToWrapperCoords(t, e) {
+    return [t - this.wrapperInnerX, e - this.wrapperInnerY];
   }
   // Converts absolute client coordinates to relative wrapper coordinates (0-1, 0-1)
-  relativeWrapperCoordinatesFromClientCoords(t, s) {
-    const [e, a] = this.clientCoordsToWrapperCoords(t, s);
-    return [e / this.wrapperInnerWidth, a / this.wrapperInnerHeight];
+  relativeWrapperCoordinatesFromClientCoords(t, e) {
+    const [s, a] = this.clientCoordsToWrapperCoords(t, e);
+    return [s / this.wrapperInnerWidth, a / this.wrapperInnerHeight];
   }
   // Converts client coordinates to relative canvas coordinates (0-1, 0-1)
-  normalizeMatrixCoordinates(t, s) {
-    const e = this.clientCoordsToWrapperCoords(t, s);
-    return this.getCanvasCoordsRel(e[0], e[1]);
+  normalizeMatrixCoordinates(t, e) {
+    const s = this.clientCoordsToWrapperCoords(t, e);
+    return this.getCanvasCoordsRel(s[0], s[1]);
   }
   // Converts client coordinates to absolute canvas coordinates
-  normalizeClientCoords(t, s) {
-    const [e, a] = this.normalizeMatrixCoordinates(t, s);
-    return [e * this.canvasBounds.width, a * this.canvasBounds.height];
+  normalizeClientCoords(t, e) {
+    const [s, a] = this.normalizeMatrixCoordinates(t, e);
+    return [s * this.canvasBounds.width, a * this.canvasBounds.height];
   }
-  rotateCanvas(t, s, e) {
-    const a = t / this.canvasBounds.width, n = s / this.canvasBounds.height, r = this.composeRelPoint(a, n, this.scale, 0, 0, e), i = this.composeRelPoint(a, n);
-    this.setTranslateFromUserGesture(i[0] - r[0], i[1] - r[1]), this.rotate = e, this.update();
+  rotateCanvas(t, e, s) {
+    const a = t / this.canvasBounds.width, n = e / this.canvasBounds.height, r = this.composeRelPoint(a, n, this.scale, 0, 0, s), i = this.composeRelPoint(a, n);
+    this.setTranslateFromUserGesture(i[0] - r[0], i[1] - r[1]), this.rotate = s, this.update();
   }
   get renderinScale() {
     return this.naturalScale * this.scale;
@@ -225,11 +238,11 @@ class E extends EventTarget {
   get renderingRotate() {
     return this.rotate;
   }
-  clampTranslate(t, s = [0.5, 0.5]) {
-    const e = this.canvasBounds.width * this.naturalScale * t.scale, a = this.canvasBounds.height * this.naturalScale * t.scale, n = e - this.wrapperInnerWidth, r = a - this.wrapperInnerHeight, i = n > 0 ? -n : 0, c = Math.min(0, Math.max(t.translateX, i)), l = r > 0 ? -r : 0, u = Math.min(0, Math.max(t.translateY, l)), d = -Math.min(0, n) * s[0], p = -Math.min(0, r) * s[1];
+  clampTranslate(t, e = [0.5, 0.5]) {
+    const s = this.canvasBounds.width * this.naturalScale * t.scale, a = this.canvasBounds.height * this.naturalScale * t.scale, n = s - this.wrapperInnerWidth, r = a - this.wrapperInnerHeight, i = n > 0 ? -n : 0, c = Math.min(0, Math.max(t.translateX, i)), h = r > 0 ? -r : 0, d = Math.min(0, Math.max(t.translateY, h)), p = -Math.min(0, n) * e[0], f = -Math.min(0, r) * e[1];
     return {
-      translateX: c + d,
-      translateY: u + p
+      translateX: c + p,
+      translateY: d + f
     };
   }
   update() {
@@ -239,5 +252,5 @@ class E extends EventTarget {
   }
 }
 export {
-  E as Zoompinch
+  D as Zoompinch
 };

package/dist/zoompinch-core.umd.js

@@ -1 +1 @@
-(function(f,d){typeof exports=="object"&&typeof module<"u"?d(exports):typeof define=="function"&&define.amd?define(["exports"],d):(f=typeof globalThis<"u"?globalThis:f||self,d(f.Zoompinch={}))})(this,(function(f){"use strict";var D=Object.defineProperty;var b=(f,d,v)=>d in f?D(f,d,{enumerable:!0,configurable:!0,writable:!0,value:v}):f[d]=v;var m=(f,d,v)=>b(f,typeof d!="symbol"?d+"":d,v);function d(o){return o*Math.PI/180}function v(o,u,t){return Math.min(Math.max(o,u),t)}function X(o,u,t){const[e,s]=o,[a,n]=u,r=Math.cos(t)*(e-a)-Math.sin(t)*(s-n)+a,i=Math.sin(t)*(e-a)+Math.cos(t)*(s-n)+n;return[r,i]}function T(o,u){const t=Math.pow(10,u);return Math.round(o*t)/t}function x(o){var u=!1;return o.wheelDeltaY?o.wheelDeltaY===o.deltaY*-3&&(u=!0):o.deltaMode===0&&(u=!0),u}function B(o,u){const t=u.find(e=>o%e===0);return t?o/t:1}function F(o,u,t,e,s){let a=o.left-u,n=o.top-t;const r=Math.cos(-s),i=Math.sin(-s);let l=a*r-n*i,h=a*i+n*r;const c=o.width/e,p=o.height/e;return l/=e,h/=e,{x:T(l,4),y:T(h,4),width:T(c,4),height:T(p,4)}}class I extends EventTarget{constructor(t,e,s,a,n,r,i=.1,l=10,h=!1,c=!0){super();m(this,"wrapperBounds");m(this,"canvasBounds");m(this,"gestureStartRotate",0);m(this,"dragStart",null);m(this,"dragStartFrozenX",null);m(this,"dragStartFrozenY",null);m(this,"touchStarts",null);m(this,"touchStartTranslateX",0);m(this,"touchStartTranslateY",0);this.element=t,this.offset=e,this.translateX=s,this.translateY=a,this.scale=n,this.rotate=r,this.minScale=i,this.maxScale=l,this.clampBounds=h,this.rotation=c;const p=new ResizeObserver(()=>{const{x:S,y:w,width:Y,height:R}=this.element.getBoundingClientRect();this.wrapperBounds={x:S,y:w,width:Y,height:R},this.update()}),g=new ResizeObserver(()=>{const{x:S,y:w,width:Y,height:R}=F(this.canvasElement.getBoundingClientRect(),this.renderingTranslateX,this.renderingTranslateY,this.renderinScale,this.renderingRotate);this.canvasBounds={x:S,y:w,width:Y,height:R},this.update()});requestAnimationFrame(()=>{this.wrapperBounds=this.element.getBoundingClientRect(),this.canvasBounds=this.canvasElement.getBoundingClientRect(),this.update(),this.dispatchEvent(new Event("init"))}),g.observe(this.canvasElement),p.observe(this.element)}get canvasElement(){return this.element.querySelector(".canvas")}get wrapperInnerX(){return this.wrapperBounds.x+this.offset.left}get wrapperInnerY(){return this.wrapperBounds.y+this.offset.top}get wrapperInnerWidth(){return this.wrapperBounds.width-this.offset.left-this.offset.right}get wrapperInnerHeight(){return this.wrapperBounds.height-this.offset.top-this.offset.bottom}get wrapperInnerRatio(){return this.wrapperInnerWidth/this.wrapperInnerHeight}get canvasNaturalRatio(){return this.canvasBounds.width/this.canvasBounds.height}get naturalScale(){return this.canvasNaturalRatio>=this.wrapperInnerRatio?this.wrapperInnerWidth/this.canvasBounds.width:this.wrapperInnerHeight/this.canvasBounds.height}setTranslateFromUserGesture(t,e){if(this.clampBounds){const s=this.clampTranslate({translateX:t,translateY:e,scale:this.scale,rotate:this.rotate});this.translateX=s.translateX,this.translateY=s.translateY,this.rotate=0}else this.translateX=t,this.translateY=e}handleGesturestart(t){this.gestureStartRotate=this.rotate}handleGesturechange(t){const{clientX:e,clientY:s}=t,a=t.rotation;if(a===0||!this.rotation)return;const n=this.normalizeClientCoords(e,s);this.rotateCanvas(n[0],n[1],this.gestureStartRotate+d(a))}handleGestureend(t){}handleMousedown(t){t.preventDefault(),this.dragStart=[t.clientX,t.clientY],this.dragStartFrozenX=this.translateX,this.dragStartFrozenY=this.translateY}handleMouseup(t){t.preventDefault(),this.dragStart=null,this.dragStartFrozenX=null,this.dragStartFrozenY=null}handleMousemove(t){if(t.preventDefault(),this.dragStart&&this.dragStartFrozenX!==null&&this.dragStartFrozenY!==null){const e=t.clientX-this.dragStart[0],s=t.clientY-this.dragStart[1],a=this.dragStartFrozenX- -e,n=this.dragStartFrozenY- -s;this.setTranslateFromUserGesture(a,n),this.update()}}handleWheel(t){let{deltaX:e,deltaY:s,ctrlKey:a}=t;const n=[120,100],r=2;x(t)||((Math.abs(e)===120||Math.abs(e)===200)&&(e=e/(100/r*B(e,n))*Math.sign(e)),(Math.abs(s)===120||Math.abs(s)===200)&&(s=s/(100/r*B(s,n))*Math.sign(s)));const i=this.scale;if(a){const l=-s/100*i,h=v(i+l,this.minScale,this.maxScale),c=this.relativeWrapperCoordinatesFromClientCoords(t.clientX,t.clientY),[p,g]=this.calcProjectionTranslate(h,c,this.normalizeMatrixCoordinates(t.clientX,t.clientY));this.setTranslateFromUserGesture(p,g),this.scale=h}else this.setTranslateFromUserGesture(this.translateX-e,this.translateY-s);this.update(),t.preventDefault()}freezeTouches(t){return Array.from(t).map(e=>{const s=this.clientCoordsToWrapperCoords(e.clientX,e.clientY);return{client:[e.clientX,e.clientY],canvasRel:this.getCanvasCoordsRel(s[0],s[1])}})}handleTouchstart(t){this.touchStarts=this.freezeTouches(t.touches),this.touchStartTranslateX=this.translateX,this.touchStartTranslateY=this.translateY,t.preventDefault()}handleTouchmove(t){t.preventDefault();const e=Array.from(t.touches).map(s=>this.clientCoordsToWrapperCoords(s.clientX,s.clientY));if(this.touchStarts){if(e.length>=2&&this.touchStarts.length>=2){const s=[this.touchStarts[0].canvasRel[0]*this.canvasBounds.width,this.touchStarts[0].canvasRel[1]*this.canvasBounds.height],a=[this.touchStarts[1].canvasRel[0]*this.canvasBounds.width,this.touchStarts[1].canvasRel[1]*this.canvasBounds.height],n=Math.sqrt(Math.pow(s[0]-a[0],2)+Math.pow(s[1]-a[1],2)),r=Math.sqrt(Math.pow(e[0][0]-e[1][0],2)+Math.pow(e[0][1]-e[1][1],2))/this.naturalScale,i=v(r/n,this.minScale,this.maxScale),l=[e[0][0]/this.wrapperInnerWidth,e[0][1]/this.wrapperInnerHeight],h=this.touchStarts[0].canvasRel,[c,p]=this.calcProjectionTranslate(i,l,h,0);if(this.rotation){let g=0,S=0,w=0;const Y=Math.atan2(a[1]-s[1],a[0]-s[0]);w=Math.atan2(e[1][1]-e[0][1],e[1][0]-e[0][0])-Y;const M=(y,z)=>[this.offset.left+this.canvasBounds.width*y*this.naturalScale*i+c,this.offset.top+this.canvasBounds.height*z*this.naturalScale*i+p],C=M(0,0),W=M(this.touchStarts[0].canvasRel[0],this.touchStarts[0].canvasRel[1]),P=X(C,W,w);g=P[0]-C[0],S=P[1]-C[1],this.scale=i,this.rotate=w,this.setTranslateFromUserGesture(c+g,p+S)}else this.scale=i,this.setTranslateFromUserGesture(c,p)}else{const s=t.touches[0].clientX-this.touchStarts[0].client[0],a=t.touches[0].clientY-this.touchStarts[0].client[1],n=this.touchStartTranslateX+s,r=this.touchStartTranslateY+a;this.setTranslateFromUserGesture(n,r)}this.update()}}handleTouchend(t){t.touches.length===0?this.touchStarts=null:(this.touchStarts=this.freezeTouches(t.touches),this.touchStartTranslateX=this.translateX,this.touchStartTranslateY=this.translateY)}calcProjectionTranslate(t,e,s,a){const n=this.canvasBounds.width*this.naturalScale,r=this.canvasBounds.height*this.naturalScale,i=s[0]*n*t,l=s[1]*r*t,h=X([i,l],[0,0],a??this.rotate),c=e[0]*this.wrapperInnerWidth,p=e[1]*this.wrapperInnerHeight,g=c-h[0],S=p-h[1];return[g,S]}applyTransform(t,e,s){const a=this.calcProjectionTranslate(t,e,s,0);this.scale=t,this.setTranslateFromUserGesture(a[0],a[1]),this.update()}composeRelPoint(t,e,s,a,n,r){s=s??this.scale,a=a??this.translateX,n=n??this.translateY,r=r??this.rotate;const i=[this.offset.left,this.offset.top],l=[this.offset.left+this.canvasBounds.width*(s*this.naturalScale)*t,this.offset.top+this.canvasBounds.height*(s*this.naturalScale)*e],h=X(l,i,r);return[h[0]+a,h[1]+n]}composePoint(t,e){const s=t/this.canvasBounds.width,a=e/this.canvasBounds.height;return this.composeRelPoint(s,a)}getAnchorOffset(t,e,s,a,n=[.5,.5]){const r=this.calcProjectionTranslate(t,n,n,0),i=[this.offset.left+r[0]+this.canvasBounds.width*(t*this.naturalScale)*n[0],this.offset.top+r[1]+this.canvasBounds.height*(t*this.naturalScale)*n[1]],l=this.composeRelPoint(n[0],n[1],t,e,s,a),h=l[0]-i[0],c=l[1]-i[1];return[h,c]}getCanvasCoordsRel(t,e){const s=[0,0],a=[t-this.translateX,e-this.translateY],n=X(a,s,-this.rotate),r=[n[0]/this.renderinScale,n[1]/this.renderinScale];return[r[0]/this.canvasBounds.width,r[1]/this.canvasBounds.height]}clientCoordsToWrapperCoords(t,e){return[t-this.wrapperInnerX,e-this.wrapperInnerY]}relativeWrapperCoordinatesFromClientCoords(t,e){const[s,a]=this.clientCoordsToWrapperCoords(t,e);return[s/this.wrapperInnerWidth,a/this.wrapperInnerHeight]}normalizeMatrixCoordinates(t,e){const s=this.clientCoordsToWrapperCoords(t,e);return this.getCanvasCoordsRel(s[0],s[1])}normalizeClientCoords(t,e){const[s,a]=this.normalizeMatrixCoordinates(t,e);return[s*this.canvasBounds.width,a*this.canvasBounds.height]}rotateCanvas(t,e,s){const a=t/this.canvasBounds.width,n=e/this.canvasBounds.height,r=this.composeRelPoint(a,n,this.scale,0,0,s),i=this.composeRelPoint(a,n);this.setTranslateFromUserGesture(i[0]-r[0],i[1]-r[1]),this.rotate=s,this.update()}get renderinScale(){return this.naturalScale*this.scale}get renderingTranslateX(){return this.offset.left+this.translateX}get renderingTranslateY(){return this.offset.top+this.translateY}get renderingRotate(){return this.rotate}clampTranslate(t,e=[.5,.5]){const s=this.canvasBounds.width*this.naturalScale*t.scale,a=this.canvasBounds.height*this.naturalScale*t.scale,n=s-this.wrapperInnerWidth,r=a-this.wrapperInnerHeight,i=n>0?-n:0,l=Math.min(0,Math.max(t.translateX,i)),h=r>0?-r:0,c=Math.min(0,Math.max(t.translateY,h)),p=-Math.min(0,n)*e[0],g=-Math.min(0,r)*e[1];return{translateX:l+p,translateY:c+g}}update(){this.canvasElement.style.transformOrigin="top left",this.canvasElement.style.transform=`translateX(${this.renderingTranslateX}px) translateY(${this.renderingTranslateY}px) scale(${this.renderinScale}) rotate(${this.renderingRotate}rad)`,this.dispatchEvent(new Event("update"))}destroy(){}}f.Zoompinch=I,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})}));
+(function(f,u){typeof exports=="object"&&typeof module<"u"?u(exports):typeof define=="function"&&define.amd?define(["exports"],u):(f=typeof globalThis<"u"?globalThis:f||self,u(f.Zoompinch={}))})(this,(function(f){"use strict";var W=Object.defineProperty;var D=(f,u,v)=>u in f?W(f,u,{enumerable:!0,configurable:!0,writable:!0,value:v}):f[u]=v;var d=(f,u,v)=>D(f,typeof u!="symbol"?u+"":u,v);function u(h){return h*Math.PI/180}function v(h,g,t){return Math.min(Math.max(h,g),t)}function T(h,g,t){const[e,s]=h,[a,n]=g,r=Math.cos(t)*(e-a)-Math.sin(t)*(s-n)+a,i=Math.sin(t)*(e-a)+Math.cos(t)*(s-n)+n;return[r,i]}function X(h,g){const t=Math.pow(10,g);return Math.round(h*t)/t}function P(h){if(h.ctrlKey){const{deltaY:t,deltaMode:e,ctrlKey:s}=h,a=Math.abs(t),n=a===120||a===100||a===3,r=t%1!==0,i=e===0;return s?a<50&&i||r:!n&&(r||i&&a<50)}else{var g=!1;return h.wheelDeltaY?h.wheelDeltaY===h.deltaY*-3&&(g=!0):h.deltaMode===0&&(g=!0),g}}function z(h,g,t,e,s){let a=h.left-g,n=h.top-t;const r=Math.cos(-s),i=Math.sin(-s);let l=a*r-n*i,o=a*i+n*r;const c=h.width/e,p=h.height/e;return l/=e,o/=e,{x:X(l,4),y:X(o,4),width:X(c,4),height:X(p,4)}}class F extends EventTarget{constructor(t,e,s,a,n,r,i=.1,l=10,o=!1,c=!0){super();d(this,"wrapperBounds");d(this,"canvasBounds");d(this,"translateSpeed",1);d(this,"zoomSpeed",1);d(this,"translateSpeedAppleTrackpad",1);d(this,"zoomSpeedAppleTrackpad",1);d(this,"gestureStartRotate",0);d(this,"dragStart",null);d(this,"dragStartFrozenX",null);d(this,"dragStartFrozenY",null);d(this,"touchStarts",null);d(this,"touchStartTranslateX",0);d(this,"touchStartTranslateY",0);this.element=t,this.offset=e,this.translateX=s,this.translateY=a,this.scale=n,this.rotate=r,this.minScale=i,this.maxScale=l,this.clampBounds=o,this.rotation=c;const p=new ResizeObserver(()=>{const{x:S,y:w,width:Y,height:R}=this.element.getBoundingClientRect();this.wrapperBounds={x:S,y:w,width:Y,height:R},this.update()}),m=new ResizeObserver(()=>{const{x:S,y:w,width:Y,height:R}=z(this.canvasElement.getBoundingClientRect(),this.renderingTranslateX,this.renderingTranslateY,this.renderinScale,this.renderingRotate);this.canvasBounds={x:S,y:w,width:Y,height:R},this.update()});requestAnimationFrame(()=>{this.wrapperBounds=this.element.getBoundingClientRect(),this.canvasBounds=this.canvasElement.getBoundingClientRect(),this.update(),this.dispatchEvent(new Event("init"))}),m.observe(this.canvasElement),p.observe(this.element)}get canvasElement(){return this.element.querySelector(".canvas")}get wrapperInnerX(){return this.wrapperBounds.x+this.offset.left}get wrapperInnerY(){return this.wrapperBounds.y+this.offset.top}get wrapperInnerWidth(){return this.wrapperBounds.width-this.offset.left-this.offset.right}get wrapperInnerHeight(){return this.wrapperBounds.height-this.offset.top-this.offset.bottom}get wrapperInnerRatio(){return this.wrapperInnerWidth/this.wrapperInnerHeight}get canvasNaturalRatio(){return this.canvasBounds.width/this.canvasBounds.height}get naturalScale(){return this.canvasNaturalRatio>=this.wrapperInnerRatio?this.wrapperInnerWidth/this.canvasBounds.width:this.wrapperInnerHeight/this.canvasBounds.height}setTranslateFromUserGesture(t,e){if(this.clampBounds){const s=this.clampTranslate({translateX:t,translateY:e,scale:this.scale,rotate:this.rotate});this.translateX=s.translateX,this.translateY=s.translateY,this.rotate=0}else this.translateX=t,this.translateY=e}handleGesturestart(t){this.gestureStartRotate=this.rotate}handleGesturechange(t){const{clientX:e,clientY:s}=t,a=t.rotation;if(a===0||!this.rotation)return;const n=this.normalizeClientCoords(e,s);this.rotateCanvas(n[0],n[1],this.gestureStartRotate+u(a))}handleGestureend(t){}handleMousedown(t){t.preventDefault(),this.dragStart=[t.clientX,t.clientY],this.dragStartFrozenX=this.translateX,this.dragStartFrozenY=this.translateY}handleMouseup(t){t.preventDefault(),this.dragStart=null,this.dragStartFrozenX=null,this.dragStartFrozenY=null}handleMousemove(t){if(t.preventDefault(),this.dragStart&&this.dragStartFrozenX!==null&&this.dragStartFrozenY!==null){const e=t.clientX-this.dragStart[0],s=t.clientY-this.dragStart[1],a=this.dragStartFrozenX- -e,n=this.dragStartFrozenY- -s;this.setTranslateFromUserGesture(a,n),this.update()}}handleWheel(t){let{deltaX:e,deltaY:s,ctrlKey:a}=t;const n=P(t);n||(Math.abs(s)>=100&&(s=Math.sign(s)*(Math.abs(s)/120)),Math.abs(e)>=100&&(e=Math.sign(e)*(Math.abs(e)/120)));const r=this.scale;if(a){const i=n?.01*this.zoomSpeedAppleTrackpad:.1*this.zoomSpeed,l=1+-s*i;let o=r*l;if(o=v(o,this.minScale,this.maxScale),(o===this.minScale||o===this.maxScale)&&(o===this.minScale&&l<1||o===this.maxScale&&l>1)){t.preventDefault();return}const c=this.relativeWrapperCoordinatesFromClientCoords(t.clientX,t.clientY),[p,m]=this.calcProjectionTranslate(o,c,this.normalizeMatrixCoordinates(t.clientX,t.clientY));this.setTranslateFromUserGesture(p,m),this.scale=o}else{const i=n?1*this.translateSpeedAppleTrackpad:25*this.translateSpeed;this.setTranslateFromUserGesture(this.translateX-e*i,this.translateY-s*i)}this.update(),t.preventDefault()}freezeTouches(t){return Array.from(t).map(e=>{const s=this.clientCoordsToWrapperCoords(e.clientX,e.clientY);return{client:[e.clientX,e.clientY],canvasRel:this.getCanvasCoordsRel(s[0],s[1])}})}handleTouchstart(t){this.touchStarts=this.freezeTouches(t.touches),this.touchStartTranslateX=this.translateX,this.touchStartTranslateY=this.translateY,t.preventDefault()}handleTouchmove(t){t.preventDefault();const e=Array.from(t.touches).map(s=>this.clientCoordsToWrapperCoords(s.clientX,s.clientY));if(this.touchStarts){if(e.length>=2&&this.touchStarts.length>=2){const s=[this.touchStarts[0].canvasRel[0]*this.canvasBounds.width,this.touchStarts[0].canvasRel[1]*this.canvasBounds.height],a=[this.touchStarts[1].canvasRel[0]*this.canvasBounds.width,this.touchStarts[1].canvasRel[1]*this.canvasBounds.height],n=Math.sqrt(Math.pow(s[0]-a[0],2)+Math.pow(s[1]-a[1],2)),r=Math.sqrt(Math.pow(e[0][0]-e[1][0],2)+Math.pow(e[0][1]-e[1][1],2))/this.naturalScale,i=v(r/n,this.minScale,this.maxScale),l=[e[0][0]/this.wrapperInnerWidth,e[0][1]/this.wrapperInnerHeight],o=this.touchStarts[0].canvasRel,[c,p]=this.calcProjectionTranslate(i,l,o,0);if(this.rotation){let m=0,S=0,w=0;const Y=Math.atan2(a[1]-s[1],a[0]-s[0]);w=Math.atan2(e[1][1]-e[0][1],e[1][0]-e[0][0])-Y;const M=(y,I)=>[this.offset.left+this.canvasBounds.width*y*this.naturalScale*i+c,this.offset.top+this.canvasBounds.height*I*this.naturalScale*i+p],C=M(0,0),x=M(this.touchStarts[0].canvasRel[0],this.touchStarts[0].canvasRel[1]),B=T(C,x,w);m=B[0]-C[0],S=B[1]-C[1],this.scale=i,this.rotate=w,this.setTranslateFromUserGesture(c+m,p+S)}else this.scale=i,this.setTranslateFromUserGesture(c,p)}else{const s=t.touches[0].clientX-this.touchStarts[0].client[0],a=t.touches[0].clientY-this.touchStarts[0].client[1],n=this.touchStartTranslateX+s,r=this.touchStartTranslateY+a;this.setTranslateFromUserGesture(n,r)}this.update()}}handleTouchend(t){t.touches.length===0?this.touchStarts=null:(this.touchStarts=this.freezeTouches(t.touches),this.touchStartTranslateX=this.translateX,this.touchStartTranslateY=this.translateY)}calcProjectionTranslate(t,e,s,a){const n=this.canvasBounds.width*this.naturalScale,r=this.canvasBounds.height*this.naturalScale,i=s[0]*n*t,l=s[1]*r*t,o=T([i,l],[0,0],a??this.rotate),c=e[0]*this.wrapperInnerWidth,p=e[1]*this.wrapperInnerHeight,m=c-o[0],S=p-o[1];return[m,S]}applyTransform(t,e,s){const a=this.calcProjectionTranslate(t,e,s,0);this.scale=t,this.setTranslateFromUserGesture(a[0],a[1]),this.update()}composeRelPoint(t,e,s,a,n,r){s=s??this.scale,a=a??this.translateX,n=n??this.translateY,r=r??this.rotate;const i=[this.offset.left,this.offset.top],l=[this.offset.left+this.canvasBounds.width*(s*this.naturalScale)*t,this.offset.top+this.canvasBounds.height*(s*this.naturalScale)*e],o=T(l,i,r);return[o[0]+a,o[1]+n]}composePoint(t,e){const s=t/this.canvasBounds.width,a=e/this.canvasBounds.height;return this.composeRelPoint(s,a)}getAnchorOffset(t,e,s,a,n=[.5,.5]){const r=this.calcProjectionTranslate(t,n,n,0),i=[this.offset.left+r[0]+this.canvasBounds.width*(t*this.naturalScale)*n[0],this.offset.top+r[1]+this.canvasBounds.height*(t*this.naturalScale)*n[1]],l=this.composeRelPoint(n[0],n[1],t,e,s,a),o=l[0]-i[0],c=l[1]-i[1];return[o,c]}getCanvasCoordsRel(t,e){const s=[0,0],a=[t-this.translateX,e-this.translateY],n=T(a,s,-this.rotate),r=[n[0]/this.renderinScale,n[1]/this.renderinScale];return[r[0]/this.canvasBounds.width,r[1]/this.canvasBounds.height]}clientCoordsToWrapperCoords(t,e){return[t-this.wrapperInnerX,e-this.wrapperInnerY]}relativeWrapperCoordinatesFromClientCoords(t,e){const[s,a]=this.clientCoordsToWrapperCoords(t,e);return[s/this.wrapperInnerWidth,a/this.wrapperInnerHeight]}normalizeMatrixCoordinates(t,e){const s=this.clientCoordsToWrapperCoords(t,e);return this.getCanvasCoordsRel(s[0],s[1])}normalizeClientCoords(t,e){const[s,a]=this.normalizeMatrixCoordinates(t,e);return[s*this.canvasBounds.width,a*this.canvasBounds.height]}rotateCanvas(t,e,s){const a=t/this.canvasBounds.width,n=e/this.canvasBounds.height,r=this.composeRelPoint(a,n,this.scale,0,0,s),i=this.composeRelPoint(a,n);this.setTranslateFromUserGesture(i[0]-r[0],i[1]-r[1]),this.rotate=s,this.update()}get renderinScale(){return this.naturalScale*this.scale}get renderingTranslateX(){return this.offset.left+this.translateX}get renderingTranslateY(){return this.offset.top+this.translateY}get renderingRotate(){return this.rotate}clampTranslate(t,e=[.5,.5]){const s=this.canvasBounds.width*this.naturalScale*t.scale,a=this.canvasBounds.height*this.naturalScale*t.scale,n=s-this.wrapperInnerWidth,r=a-this.wrapperInnerHeight,i=n>0?-n:0,l=Math.min(0,Math.max(t.translateX,i)),o=r>0?-r:0,c=Math.min(0,Math.max(t.translateY,o)),p=-Math.min(0,n)*e[0],m=-Math.min(0,r)*e[1];return{translateX:l+p,translateY:c+m}}update(){this.canvasElement.style.transformOrigin="top left",this.canvasElement.style.transform=`translateX(${this.renderingTranslateX}px) translateY(${this.renderingTranslateY}px) scale(${this.renderinScale}) rotate(${this.renderingRotate}rad)`,this.dispatchEvent(new Event("update"))}destroy(){}}f.Zoompinch=F,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})}));

package/dist/zoompinch.d.ts

@@ -29,6 +29,10 @@ export declare class Zoompinch extends EventTarget {
     rotation: boolean;
     wrapperBounds: Bounds;
     canvasBounds: Bounds;
+    translateSpeed: number;
+    zoomSpeed: number;
+    translateSpeedAppleTrackpad: number;
+    zoomSpeedAppleTrackpad: number;
     constructor(element: HTMLElement, offset: Offset, translateX: number, translateY: number, scale: number, rotate: number, minScale?: number, maxScale?: number, clampBounds?: boolean, rotation?: boolean);
     get canvasElement(): HTMLElement;
     get wrapperInnerX(): number;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@zoompinch/core",
   "description": "Pinch-and-zoom experience that's feels native and communicates the transform reactively and lets you project any layer on top of the transformed canvas",
-  "version": "0.0.27",
+  "version": "0.0.28",
   "private": false,
   "type": "module",
   "main": "./dist/zoompinch-core.umd.js",