docs: Create pinch-to-zoom example for docs

docs/docs/guides/ZOOMING.mdx

@@ -58,53 +58,58 @@ While you can use any animation library to animate the `zoom` property (or use n
 
 ### Code
 
-The following example implements a button which smoothly zooms to a random value using [react-native-reanimated](https://github.com/software-mansion/react-native-reanimated):
+The following example implements a pinch-to-zoom gesture using [react-native-gesture-handler](https://github.com/software-mansion/react-native-gesture-handler/) and [react-native-reanimated](https://github.com/software-mansion/react-native-reanimated):
 
 ```tsx
-import Reanimated, {
+import { Camera, useCameraDevice, CameraProps } from "react-native-vision-camera"
-  useAnimatedProps,
+import Reanimated, { useAnimatedProps, useSharedValue } from "react-native-reanimated"
-  useSharedValue,
+import { Gesture, GestureDetector } from 'react-native-gesture-handler'
-  withSpring,
-  addWhitelistedNativeProps
-} from "react-native-reanimated"
 
-const ReanimatedCamera = Reanimated.createAnimatedComponent(Camera)
+Reanimated.addWhitelistedNativeProps({
-addWhitelistedNativeProps({
   zoom: true,
 })
+const ReanimatedCamera = Reanimated.createAnimatedComponent(Camera)
 
 export function App() {
   const device = useCameraDevice('back')
-  const zoom = useSharedValue(0)
+  const zoom = useSharedValue(device.neutralZoom)
 
-  const onRandomZoomPress = useCallback(() => {
+  const zoomOffset = useSharedValue(0);
-    zoom.value = withSpring(Math.random())
+  const gesture = Gesture.Pinch()
-  }, [zoom])
+    .onBegin(() => {
+      zoomOffset.value = zoom.value
+    })
+    .onUpdate(event => {
+      const z = zoomOffset.value * event.scale
+      zoom.value = interpolate(
+        z,
+        [1, 10],
+        [device.minZoom, device.maxZoom],
+        Extrapolation.CLAMP,
+      )
+    })
 
-  const animatedProps = useAnimatedProps<Partial<CameraProps>>(
+  const animatedProps = useAnimatedProps<CameraProps>(
     () => ({ zoom: zoom.value }),
     [zoom]
   )
 
   if (device == null) return <NoCameraDeviceError />
   return (
-    <>
+    <GestureDetector gesture={gesture}>
       <ReanimatedCamera
         style={StyleSheet.absoluteFill}
         device={device}
         isActive={true}
         animatedProps={animatedProps}
       />
-      <TouchableOpacity
+    </GestureDetector>
-        style={styles.zoomButton}
-        onPress={onRandomZoomPress}>
-        <Text>Zoom randomly!</Text>
-      </TouchableOpacity>
-    </>
   )
 }
 ```
 
+You can also use Gesture Handler to implement different zoom gestures, such as the slide-up-to-zoom as seen in Instagram or Snapchat, or a slider as seen in the stock iOS Camera app.
+
 <br />
 
 #### 🚀 Next section: [Focusing](focusing)