[Web] Detector DOM props

[m-bert]

Description

This PR introduces missing web props to NativeDetector.

Test plan

Tested on the following code:

import React, { useState } from 'react';
import { StyleSheet, Text, Pressable } from 'react-native';
import {
  GestureDetector,
  GestureHandlerRootView,
  usePanGesture,
} from 'react-native-gesture-handler';
import Animated, {
  interpolateColor,
  useAnimatedStyle,
  useSharedValue,
  withTiming,
} from 'react-native-reanimated';

const Colors = {
  enabled: '#32a852',
  disabled: '#b02525',
};

const AnimationDuration = 250;

export default function WebStylesResetExample() {
  const [enabled, setEnabled] = useState(true);
  const colorProgress = useSharedValue(0);

  const animatedStyles = useAnimatedStyle(() => {
    const backgroundColor = interpolateColor(
      colorProgress.value,
      [0, 1],
      [Colors.enabled, Colors.disabled]
    );

    return { backgroundColor };
  });

  const g = usePanGesture({
    onUpdate: (e) => {
      console.log(e.x, e.y);
    },
    enabled: enabled,
    disableReanimated: true,
  });

  return (
    <GestureHandlerRootView style={[styles.container, styles.centered]}>
      <GestureDetector gesture={g} enableContextMenu={false} userSelect="auto">
        <Animated.View style={[styles.box, styles.centered, animatedStyles]}>
          <Text style={{ fontSize: 32 }}> Lorem Ipsum </Text>
        </Animated.View>
      </GestureDetector>

      <Pressable
        style={[styles.button, styles.centered]}
        onPress={() => {
          setEnabled((prev) => !prev);

          colorProgress.value = withTiming(enabled ? 1 : 0, {
            duration: AnimationDuration,
          });
        }}>
        <Text style={{ fontSize: 16 }}>{enabled ? 'Disable' : 'Enable'}</Text>
      </Pressable>
    </GestureHandlerRootView>
  );
}

const styles = StyleSheet.create({
  centered: {
    display: 'flex',
    justifyContent: 'center',
    alignItems: 'center',
  },

  container: {
    flex: 1,
    backgroundColor: '#F5FCFF',
  },

  button: {
    width: 250,
    height: 35,
    backgroundColor: 'plum',
    borderRadius: 10,
    margin: 25,
  },

  box: {
    width: 250,
    height: 250,
    borderRadius: 25,
  },
});

[j-piasecki]

I don't really like that we're relying on those being set before updating the enabled flag to apply changes. It would be great to handle this differently, but if that's not feasible, can there at least be a comment explaining this?

[m-bert]

Okay, I've changed it a bit, let me know what you think (e9e038b). Little simplification in ed00670.