How do I create a simple pinch inwards/outwards check?

[dvlden]

Hello,

Thank you for making this library! 🎉
I have spent quite some time digging through the docs and examples, trying to whip something up myself. But I failed.

import { PinchGesture } from "@use-gesture/vanilla";

const pinchElement = document.querySelector('#app')!
let timeout: number | undefined = undefined

new PinchGesture(
  pinchElement,
  (ctx) => {
    clearTimeout(timeout)

    if (ctx.last) {
      timeout = setTimeout(() => {
        pinchElement.innerHTML = `Pinch me!`;
      }, 500)

      pinchElement.innerHTML = `Pinched ${ctx.direction[0] === -1 ? 'in' : ctx.direction[0] === 1 ? 'out' : ''}!`;
    }
  },
  {
    threshold: 0.25
  }
);

I want to support trackpad and real touch devices to know when user has pinched (zoom in/zoom out) sort of thing. I believe the threshold is too low, but if I increase it, then pinch-in never works on my iOS.

I am sure I must use something from the context, instead of threshold, and to do the calculations, but I don't understand what. Any help is greatly appreciated.