@react-three/xr/dist/origin.js

VR/AR for react-three-fiber

import { jsx as _jsx } from "react/jsx-runtime";
import { useThree } from '@react-three/fiber';
import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';
import { xrSpaceContext } from './contexts.js';
import { useXR } from './xr.js';
/**
 * Component for setting the origin of the player (their feet)
 *
 * @param props
 * Accepts the same props as a ThreeJs [Group](https://threejs.org/docs/#api/en/objects/Group)
 * @function
 */
export const XROrigin = forwardRef(({ children, disabled, ...props }, ref) => {
    const xrCamera = useThree((s) => s.gl.xr.getCamera());
    const internalRef = useRef(null);
    const referenceSpace = useXR((xr) => xr.originReferenceSpace);
    useImperativeHandle(ref, () => internalRef.current, []);
    useEffect(() => {
        const group = internalRef.current;
        if (group == null || disabled) {
            return;
        }
        group.add(xrCamera);
        return () => void group.remove(xrCamera);
    }, [disabled, xrCamera]);
    return (_jsx("group", { ref: internalRef, ...props, children: _jsx(xrSpaceContext.Provider, { value: referenceSpace, children: children }) }));
});