feat: implement `XR` API

[okwasniewski]

Summary:

This PR introduces the XR API.

Example:

const {XR} = require('@callstack/react-native-visionos');
//...
const OpenXRSession = () => {
  const [isOpen, setIsOpen] = React.useState(false);

  const openXRSession = async () => {
    try {
      if (!XR.supportsMultipleScenes) {
        Alert.alert('Error', 'Multiple scenes are not supported');
        return;
      }
      await XR.requestSession('TestImmersiveSpace');
      setIsOpen(true);
    } catch (e) {
      Alert.alert('Error', e.message);
      setIsOpen(false);
    }
  };

  const closeXRSession = async () => {
    if (isOpen) {
      await XR.endSession();
    }
  };

  return (
    <View style={styles.container}>
      <Text style={styles.title}>Is XR session open: {isOpen}</Text>
      <Button title="Open XR Session" onPress={openXRSession} />
      <Button title="Close XR Session" onPress={closeXRSession} />
    </View>
  );
};

To-Do

• [x] Rename the API
• [x] Polish error handling
• [x] Return info if immersive space is open
• [x] Test out Old Architecture
• [x] Write docs

Opening immersive space might fail in two scenarios: 1. App doesn't support multi window, user cancels the operation.

Demo

https://github.com/callstack/react-native-visionos/assets/52801365/9c985e79-5079-48e9-bbfa-e24fdc67fe67

[matthargett]

Try to cross-reference the WebXR/OpenXR API to see if we can find a middle ground between them and visionOS specifics. It would be nice to be able to use this API across XR devices.

[okwasniewski]

@matthargett Looks like equivalent for WebXR is navigator.xr.requestSession() we can rename the API to XR and methods to:

• Spatial.openImmersiveSpace(ID) -> XR.requestSession(ID)
• Spatial.dismissImersiveSpace() -> XR.endSession()

WebXR returns session object and it ends the session by calling .end() on this object. I think the closest we can get is XR.endSession()