[docs] Gesture detectors

[m-bert]

Description

In this PR, page dedicated to gesture detectors is rewritten.

Test plan

Read docs 🤓

[j-piasecki]

This might be worth its own page.

[j-piasecki]

Suggested change

	To facilitate a smooth migration, the gesture property accepts both RNGH3 and RNGH2 gestures.
	To facilitate a smooth migration, the gesture property accepts both gestures created using the hooks API and gestures created using the builder pattern.

I'm not sold on using RNGH2 and RNGH3 as a way to differentiate between the two APIs, especially given that some parts stayed the same (i.e. GestureDetector).

[j-piasecki]

Can this have a console.log at least?

[j-piasecki]

Unlike in previous version, it no longer manages the lifecycle of gestures directly.

So what's the difference between the two versions?

I feel like this page should focus on what it does instead of on what it doesn't. We're going to have an entire migration guide about the differences.

[j-piasecki]

AFAIK, the established name is host component.

[j-piasecki]

Suggested change

	`InterceptingGestureDetector` functions like a standard `GestureDetector`, but adds support for `VirtualGestureDetector` within its component subtree. Because it can be used solely to establish the context for virtual detectors, the [`gesture`](#gesture) property is optional.
	`InterceptingGestureDetector` functions similarly to a standard `GestureDetector`, but it can also act as a proxy for `VirtualGestureDetector` within its component subtree. Because it can be used solely to establish the context for virtual detectors, the [`gesture`](#gesture) property is optional.

Idk, what do you think?

[j-piasecki]

Suggested change

	`VirtualGestureDetector` is similar to the `GestureDetector` from RNGH2. Because it is not a native component, it does not interfere with the native view hierarchy. This allows you to attach gestures without disrupting functionality that depends on that hierarchy.
	`VirtualGestureDetector` is similar to the `GestureDetector` from RNGH2. Because it is not a host component, it does not interfere with the host view hierarchy. This allows you to attach gestures without disrupting functionality that depends on it, like `react-native-svg` components.

[akwasniewski]

I think virtual detector deserves a known use case subsection: svg, nested text. People will search for it, and it will be easier for llm's to figure out if it is explicit.

[j-piasecki]

Suggested change

	`GestureDetector` will decide whether to use [Reanimated](https://docs.swmansion.com/react-native-reanimated/) to process provided gestures based on their configuration. If any of the callbacks is a worklet and Reanimated is not explicitly turned off, tools provided by the Reanimated will be utilized bringing ability to handle gestures synchronously.
	`GestureDetector` will decide whether to use [Reanimated](https://docs.swmansion.com/react-native-reanimated/) to process provided gestures based on their configuration. If any of the callbacks is a worklet and Reanimated is not explicitly turned off, tools provided by Reanimated will be utilized, bringing the ability to handle gestures synchronously on the main thread.

[j-piasecki]

Suggested change

	This example will throw an error, becuse we try to use the same instance of `Pan` in two different Gesture Detectors.
	This example will throw an error, because the same instance of `Pan` is being used in two different Gesture Detectors.

[akwasniewski]

How nested GestureDetectors from different GH versions interact? I'm not sure we should indicate the user can use both in one component. Especially as relations definetly don't work.

[akwasniewski]

Suggested change

	const outerTap = useTapGesture({});
	const innerTap = useTapGesture({});
	const outerTap = useTapGesture({onActivate: ()=> console.log("box tapped")});
	const innerTap = useTapGesture({onActivate: ()=> console.log("circle tapped")});

[akwasniewski]

The inner component's gesture should probably be innerTap and outer's outerTap

[akwasniewski]

I think virtual detector deserves a known use case subsection: svg, nested text. People will search for it, and it will be easier for llm's to figure out if it is explicit.

[akwasniewski]

Does it throw an error though? I haven't checked on ios or android but web does not throw. It attaches to only one detector, but it is undefined behaviour which one. I think at some point we discussed where to put the error check in the office, but we figured it is not trivial, as we might break reattaching.

missclick