@reactvision/react-viro 2.42.0 → 2.43.1

package/dist/fabric-interop/ViroFabricContainer.js

@@ -0,0 +1,200 @@
+"use strict";
+/**
+ * ViroFabricContainer
+ *
+ * This is the main container component that Fabric manages directly.
+ * It serves as a viewport for the Viro rendering engine and delegates
+ * rendering to the existing native implementation.
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ViroFabricContainer = void 0;
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+// Check if New Architecture is enabled
+const isNewArchitectureEnabled = () => {
+    if (global.__turboModuleProxy == null) {
+        throw new Error("Viro: New Architecture is not enabled. This library requires React Native New Architecture. " +
+            "Please enable it in your app by following the instructions at: " +
+            "https://reactnative.dev/docs/new-architecture-intro");
+    }
+    // We're assuming the minimum supported version (0.76.9+) since this is a Fabric-only component
+    return true;
+};
+// Check if the component exists in UIManager
+const isFabricComponentAvailable = () => {
+    isNewArchitectureEnabled(); // This will throw if New Architecture is not enabled
+    if (!react_native_1.UIManager.getViewManagerConfig ||
+        react_native_1.UIManager.getViewManagerConfig("ViroFabricContainerView") == null) {
+        throw new Error("ViroFabricContainerView is not available. Make sure you have installed the native module properly.");
+    }
+    return true;
+};
+// Define the native component
+// @ts-ignore - TypeScript doesn't know about the props of the native component
+const NativeViroFabricContainer = (0, react_native_1.requireNativeComponent)("ViroFabricContainerView");
+/**
+ * ViroFabricContainer is the main component that hosts the Viro rendering engine.
+ * It creates a native view that the Viro renderer can draw on and manages the
+ * lifecycle of the Viro system.
+ */
+const ViroFabricContainer = ({ debug = false, arEnabled = false, worldAlignment = "Gravity", onInitialized, onTrackingUpdated, onCameraTransformUpdate, onSceneStateChanged, onMemoryWarning, children, }) => {
+    // Reference to the native component
+    const containerRef = (0, react_1.useRef)(null);
+    // Root node ID for the scene
+    const rootNodeId = (0, react_1.useRef)("viro_root_scene");
+    // Event callback registry
+    const eventCallbacks = (0, react_1.useRef)({});
+    // Set up event handling for JSI and fallback event emitter approach
+    (0, react_1.useEffect)(() => {
+        // Set up global event handler for JSI events
+        if (typeof global !== "undefined") {
+            // @ts-ignore - This property will be added by the native code
+            global.handleViroEvent = (callbackId, eventData) => {
+                // Find the callback in the registry and call it
+                const callback = eventCallbacks.current[callbackId];
+                if (callback) {
+                    callback(eventData);
+                }
+                else {
+                    console.warn(`No callback found for ID: ${callbackId}`);
+                }
+            };
+        }
+        // Set up event emitter for fallback approach
+        const eventEmitter = new react_native_1.NativeEventEmitter(react_native_1.NativeModules.ViroFabricManager);
+        // Add the ViroEvent listener
+        const subscription = eventEmitter.addListener("ViroEvent", (event) => {
+            const { callbackId, data } = event;
+            const callback = eventCallbacks.current[callbackId];
+            if (callback) {
+                callback(data);
+            }
+            else {
+                console.warn(`No callback found for ID: ${callbackId} (via event emitter)`);
+            }
+        });
+        return () => {
+            // Clean up event subscription
+            subscription.remove();
+            // Clean up global event handler
+            if (typeof global !== "undefined") {
+                // @ts-ignore - This property was added by us
+                delete global.handleViroEvent;
+            }
+        };
+    }, []);
+    // Initialize the Viro system when the component mounts
+    (0, react_1.useEffect)(() => {
+        if (containerRef.current && isFabricComponentAvailable()) {
+            const nodeHandle = (0, react_native_1.findNodeHandle)(containerRef.current);
+            if (!nodeHandle) {
+                console.error("Failed to get node handle for ViroFabricContainer");
+                return;
+            }
+            try {
+                // Use the codegenNativeCommands approach for New Architecture
+                const ViroFabricContainerCommands = react_native_1.UIManager.getViewManagerConfig("ViroFabricContainerView").Commands;
+                if (!ViroFabricContainerCommands) {
+                    console.error("ViroFabricContainerView commands not found in UIManager");
+                    return;
+                }
+                // Call the native method to initialize
+                react_native_1.UIManager.dispatchViewManagerCommand(nodeHandle, ViroFabricContainerCommands.initialize, [debug || false, arEnabled || false, worldAlignment || "Gravity"]);
+            }
+            catch (error) {
+                console.error("Failed to initialize ViroFabricContainer:", error);
+            }
+        }
+        // Cleanup when unmounting
+        return () => {
+            if (containerRef.current) {
+                const nodeHandle = (0, react_native_1.findNodeHandle)(containerRef.current);
+                if (!nodeHandle)
+                    return;
+                try {
+                    // Use the same approach as initialize for cleanup
+                    const ViroFabricContainerCommands = react_native_1.UIManager.getViewManagerConfig("ViroFabricContainerView").Commands;
+                    if (!ViroFabricContainerCommands ||
+                        !ViroFabricContainerCommands.cleanup) {
+                        console.error("ViroFabricContainerView cleanup command not found in UIManager");
+                        return;
+                    }
+                    // Call the native method to cleanup
+                    react_native_1.UIManager.dispatchViewManagerCommand(nodeHandle, ViroFabricContainerCommands.cleanup, []);
+                }
+                catch (error) {
+                    console.error("Failed to cleanup ViroFabricContainer:", error);
+                }
+            }
+        };
+    }, [debug, arEnabled, worldAlignment]);
+    // Handle initialization event
+    const handleInitialized = (event) => {
+        if (onInitialized) {
+            onInitialized(event.nativeEvent.success);
+        }
+    };
+    // Handle tracking updated event
+    const handleTrackingUpdated = (event) => {
+        if (onTrackingUpdated) {
+            onTrackingUpdated(event.nativeEvent);
+        }
+    };
+    // Handle camera transform update event
+    const handleCameraTransformUpdate = (event) => {
+        if (onCameraTransformUpdate) {
+            onCameraTransformUpdate(event.nativeEvent);
+        }
+    };
+    // Handle scene state changed event
+    const handleSceneStateChanged = (event) => {
+        if (onSceneStateChanged) {
+            onSceneStateChanged(event.nativeEvent);
+        }
+    };
+    // Handle memory warning event
+    const handleMemoryWarning = (event) => {
+        if (onMemoryWarning) {
+            onMemoryWarning(event.nativeEvent);
+        }
+    };
+    // This will throw an error if the native component is not available or New Architecture is not enabled
+    isFabricComponentAvailable();
+    return (<NativeViroFabricContainer ref={containerRef} style={{ flex: 1 }} onInitialized={handleInitialized} onTrackingUpdated={handleTrackingUpdated} onCameraTransformUpdate={handleCameraTransformUpdate} onSceneStateChanged={handleSceneStateChanged} onMemoryWarning={handleMemoryWarning}>
+      {children}
+    </NativeViroFabricContainer>);
+};
+exports.ViroFabricContainer = ViroFabricContainer;

package/dist/fabric-interop/android/src/main/js/specs/ViroFabricContainerViewNativeComponent.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ */
+import type { ViewProps } from "react-native";
+import type { HostComponent } from "react-native";
+export interface NativeProps extends ViewProps {
+    apiKey?: string;
+    debug?: boolean;
+    arEnabled?: boolean;
+    worldAlignment?: string;
+    onInitialized?: (event: {
+        nativeEvent: {
+            success: boolean;
+        };
+    }) => void;
+    onTrackingUpdated?: (event: {
+        nativeEvent: any;
+    }) => void;
+    onCameraTransformUpdate?: (event: {
+        nativeEvent: any;
+    }) => void;
+}
+export type ViroFabricContainerViewType = HostComponent<NativeProps>;
+interface NativeCommands {
+    initialize: (viewRef: React.ElementRef<ViroFabricContainerViewType>, apiKey: string, debug: boolean, arEnabled: boolean, worldAlignment: string) => void;
+    cleanup: (viewRef: React.ElementRef<ViroFabricContainerViewType>) => void;
+}
+export declare const Commands: NativeCommands;
+declare const _default: import("react-native/Libraries/Utilities/codegenNativeComponent").NativeComponentType<NativeProps>;
+export default _default;

package/dist/fabric-interop/android/src/main/js/specs/ViroFabricContainerViewNativeComponent.js

@@ -0,0 +1,20 @@
+"use strict";
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ */
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Commands = void 0;
+const codegenNativeComponent_1 = __importDefault(require("react-native/Libraries/Utilities/codegenNativeComponent"));
+const codegenNativeCommands_1 = __importDefault(require("react-native/Libraries/Utilities/codegenNativeCommands"));
+exports.Commands = (0, codegenNativeCommands_1.default)({
+    supportedCommands: ["initialize", "cleanup"],
+});
+exports.default = (0, codegenNativeComponent_1.default)("ViroFabricContainerView");

package/dist/fabric-interop/components/AR/ViroARPlane.d.ts

@@ -0,0 +1,22 @@
+/**
+ * ViroARPlane
+ *
+ * Container for Viro Components anchored to a detected plane.
+ */
+import * as React from "react";
+import { ViroCommonProps, ViroObjectProps } from "./ViroCommonProps";
+import { ViroAnchorFoundMap, ViroAnchorUpdatedMap } from "../Types/ViroEvents";
+type Props = ViroCommonProps & ViroObjectProps & {
+    anchorId?: string;
+    minHeight?: number;
+    minWidth?: number;
+    alignment?: "Horizontal" | "HorizontalUpward" | "HorizontalDownward" | "Vertical";
+    onAnchorFound?: (anchorMap: ViroAnchorFoundMap) => void;
+    onAnchorUpdated?: (anchorMap: ViroAnchorUpdatedMap) => void;
+    onAnchorRemoved?: () => void;
+};
+/**
+ * Container for Viro Components anchored to a detected plane.
+ */
+export declare function ViroARPlane(props: Props): React.ReactElement;
+export {};

package/dist/fabric-interop/components/AR/ViroARPlane.js

@@ -0,0 +1,95 @@
+"use strict";
+/**
+ * ViroARPlane
+ *
+ * Container for Viro Components anchored to a detected plane.
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ViroARPlane = ViroARPlane;
+const React = __importStar(require("react"));
+const react_1 = require("react");
+const ViroNode_1 = require("../ViroNode");
+const ViroUtils_1 = require("../ViroUtils");
+const NativeViro_1 = require("../../NativeViro");
+/**
+ * Container for Viro Components anchored to a detected plane.
+ */
+function ViroARPlane(props) {
+    const { anchorId, minHeight, minWidth, alignment, onAnchorFound, onAnchorUpdated, onAnchorRemoved, children, ...rest } = props;
+    // Create the node
+    const nodeProps = {
+        ...rest,
+        anchorId,
+        minHeight,
+        minWidth,
+        alignment,
+    };
+    const nodeId = (0, ViroUtils_1.useViroNode)("arPlane", nodeProps);
+    // Set up event listeners
+    (0, react_1.useEffect)(() => {
+        const anchorFoundCallbackId = onAnchorFound
+            ? (0, NativeViro_1.registerEventListener)(nodeId, "onAnchorFound", (event) => {
+                onAnchorFound(event.anchorFoundMap);
+            })
+            : null;
+        const anchorUpdatedCallbackId = onAnchorUpdated
+            ? (0, NativeViro_1.registerEventListener)(nodeId, "onAnchorUpdated", (event) => {
+                onAnchorUpdated(event.anchorUpdatedMap);
+            })
+            : null;
+        const anchorRemovedCallbackId = onAnchorRemoved
+            ? (0, NativeViro_1.registerEventListener)(nodeId, "onAnchorRemoved", () => {
+                onAnchorRemoved();
+            })
+            : null;
+        // Clean up event listeners
+        return () => {
+            if (anchorFoundCallbackId) {
+                (0, NativeViro_1.unregisterEventListener)(nodeId, "onAnchorFound", anchorFoundCallbackId);
+            }
+            if (anchorUpdatedCallbackId) {
+                (0, NativeViro_1.unregisterEventListener)(nodeId, "onAnchorUpdated", anchorUpdatedCallbackId);
+            }
+            if (anchorRemovedCallbackId) {
+                (0, NativeViro_1.unregisterEventListener)(nodeId, "onAnchorRemoved", anchorRemovedCallbackId);
+            }
+        };
+    }, [nodeId, onAnchorFound, onAnchorUpdated, onAnchorRemoved]);
+    // Render children within this node
+    return (<ViroNode_1.ViroNode viroTag={nodeId} position={[0, 0, 0]}>
+      {children}
+    </ViroNode_1.ViroNode>);
+}

package/dist/fabric-interop/components/AR/ViroARPlaneSelector.d.ts

@@ -0,0 +1,43 @@
+/**
+ * ViroARPlaneSelector
+ *
+ * This component wraps the logic required to enable user selection
+ * of an AR plane. This currently only allows for 1 plane to be selected,
+ * but could easily be modified to allow for more planes.
+ */
+import * as React from "react";
+import { ViroPlaneUpdatedMap, ViroARPlaneSizes, ViroClickStateEvent } from "../../components/Types/ViroEvents";
+import { ViroARPlaneType, ViroNativeRef } from "../../components/Types/ViroUtils";
+import { ViroCommonProps, ViroObjectProps } from "../../components/AR/ViroCommonProps";
+type Props = ViroCommonProps & ViroObjectProps & {
+    maxPlanes?: number;
+    minHeight?: number;
+    minWidth?: number;
+    alignment?: "Horizontal" | "HorizontalUpward" | "HorizontalDownward" | "Vertical";
+    onPlaneSelected?: (updateMap: ViroPlaneUpdatedMap) => void;
+};
+type State = {
+    selectedSurface: number;
+    foundARPlanes: ViroARPlaneType[];
+    arPlaneSizes: ViroARPlaneSizes;
+};
+/**
+ * This component wraps the logic required to enable user selection
+ * of an AR plane. This currently only allows for 1 plane to be selected,
+ * but could easily be modified to allow for more planes.
+ */
+export declare class ViroARPlaneSelector extends React.Component<Props, State> {
+    _component: ViroNativeRef;
+    state: {
+        selectedSurface: number;
+        foundARPlanes: ViroARPlaneType[];
+        arPlaneSizes: number[];
+    };
+    render(): React.JSX.Element;
+    _getARPlanes(): JSX.Element[];
+    _getOnClickSurface: (index: number, event: ViroClickStateEvent) => void;
+    _onARPlaneUpdated: (index: number) => (updateMap: ViroPlaneUpdatedMap) => void;
+    _onPlaneSelected: (updateMap: ViroPlaneUpdatedMap) => void;
+    reset: () => void;
+}
+export {};

package/dist/fabric-interop/components/AR/ViroARPlaneSelector.js

@@ -0,0 +1,152 @@
+"use strict";
+/**
+ * ViroARPlaneSelector
+ *
+ * This component wraps the logic required to enable user selection
+ * of an AR plane. This currently only allows for 1 plane to be selected,
+ * but could easily be modified to allow for more planes.
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ViroARPlaneSelector = void 0;
+const React = __importStar(require("react"));
+const ViroNode_1 = require("../ViroNode");
+const ViroQuad_1 = require("../ViroQuad");
+const ViroMaterials_1 = __importDefault(require("../Material/ViroMaterials"));
+const ViroARPlane_1 = require("../AR/ViroARPlane");
+const _maxPlanes = 15;
+const _planePrefix = "ViroARPlaneSelector_Plane_";
+/**
+ * This component wraps the logic required to enable user selection
+ * of an AR plane. This currently only allows for 1 plane to be selected,
+ * but could easily be modified to allow for more planes.
+ */
+class ViroARPlaneSelector extends React.Component {
+    _component = null;
+    state = {
+        selectedSurface: -1,
+        foundARPlanes: [],
+        arPlaneSizes: [],
+    };
+    render() {
+        return <ViroNode_1.ViroNode>{this._getARPlanes()}</ViroNode_1.ViroNode>;
+    }
+    _getARPlanes() {
+        // Always render a fixed number of planes, controlling visibility instead of conditional rendering
+        let arPlanes = [];
+        let numPlanes = this.props.maxPlanes || _maxPlanes;
+        // Create all plane slots (both detected and placeholder)
+        for (let i = 0; i < numPlanes; i++) {
+            // Determine if this is the selected plane
+            const isSelected = this.state.selectedSurface === i;
+            // Get real plane data if available, or use defaults
+            const foundARPlane = this.state.foundARPlanes[i];
+            const hasPlaneData = !!foundARPlane;
+            // Extract plane data or use defaults
+            const surfaceWidth = hasPlaneData ? foundARPlane.width || 0.5 : 0.5;
+            const surfaceHeight = hasPlaneData ? foundARPlane.height || 0.5 : 0.5;
+            const surfacePosition = hasPlaneData
+                ? foundARPlane.center || [0, 0, 0]
+                : [0, 0, 0];
+            const anchorId = hasPlaneData
+                ? foundARPlane.anchorId
+                : undefined;
+            // Determine visibility based on selection state
+            // - In selection mode (selectedSurface === -1): show all planes
+            // - In selected mode: only show the selected plane
+            const isVisible = this.state.selectedSurface === -1 || isSelected;
+            arPlanes.push(<ViroARPlane_1.ViroARPlane key={_planePrefix + i} minWidth={this.props.minWidth || 0.5} minHeight={this.props.minHeight || 0.5} alignment={this.props.alignment} anchorId={anchorId} onAnchorFound={(anchor) => {
+                    // If we find an anchor, update our plane data
+                    this._onARPlaneUpdated(i)(anchor);
+                }} onAnchorUpdated={this._onARPlaneUpdated(i)}>
+          {/* Always render both the quad and children, controlling only visibility */}
+          <ViroQuad_1.ViroQuad materials={"ViroARPlaneSelector_Translucent"} onClickState={(event) => this._getOnClickSurface(i, event)} position={surfacePosition} width={surfaceWidth} height={surfaceHeight} rotation={[-90, 0, 0]} opacity={isSelected ? 0 : isVisible ? 1 : 0}/>
+
+          {/* Wrap children in a ViroNode to control visibility if children exist */}
+          {this.props.children && (<ViroNode_1.ViroNode opacity={isSelected ? 1 : 0}>
+              {this.props.children}
+            </ViroNode_1.ViroNode>)}
+        </ViroARPlane_1.ViroARPlane>);
+        }
+        return arPlanes;
+    }
+    _getOnClickSurface = (index, event) => {
+        if (event.clickState < 3) {
+            return;
+        }
+        // Get the plane data before updating state to avoid race conditions
+        const selectedPlane = this.state.foundARPlanes[index];
+        if (!selectedPlane) {
+            console.warn("ViroARPlaneSelector: Cannot select plane - plane data not found");
+            return;
+        }
+        // Update state and call callback with the captured data
+        this.setState({ selectedSurface: index }, () => {
+            this._onPlaneSelected(selectedPlane);
+        });
+    };
+    _onARPlaneUpdated = (index) => {
+        return (updateMap) => {
+            let newPlanes = [...this.state.foundARPlanes];
+            newPlanes[index] = updateMap;
+            this.setState({
+                foundARPlanes: newPlanes,
+                arPlaneSizes: this.state.arPlaneSizes,
+            });
+        };
+    };
+    _onPlaneSelected = (updateMap) => {
+        this.props.onPlaneSelected && this.props.onPlaneSelected(updateMap);
+    };
+    /*
+    This function allows the user to reset the surface and select a new plane.
+    */
+    reset = () => {
+        this.setState({
+            selectedSurface: -1,
+        });
+    };
+}
+exports.ViroARPlaneSelector = ViroARPlaneSelector;
+// Register the translucent material for the plane selector
+ViroMaterials_1.default.registerMaterials({
+    ViroARPlaneSelector_Translucent: {
+        lightingModel: "Constant",
+        diffuseColor: "#88888888",
+    },
+});

package/dist/fabric-interop/components/AR/ViroARTrackingTargets.d.ts

@@ -0,0 +1,55 @@
+/**
+ * ViroARTrackingTargets
+ *
+ * A utility for registering AR tracking targets.
+ */
+export interface ViroARImageTarget {
+    source: {
+        uri: string;
+    } | number;
+    orientation: "Up" | "Down" | "Left" | "Right";
+    physicalWidth?: number;
+    type?: "Image";
+}
+export interface ViroARObjectTarget {
+    source: {
+        uri: string;
+    } | number;
+    scale?: [number, number, number];
+    type: "Object";
+}
+export type ViroARTrackingTarget = ViroARImageTarget | ViroARObjectTarget;
+/**
+ * Register AR tracking targets with the Viro system.
+ * @param targetMap A map of target names to target definitions.
+ */
+export declare function registerTargets(targetMap: Record<string, ViroARTrackingTarget>): void;
+/**
+ * Get a tracking target by name.
+ * @param name The name of the tracking target.
+ * @returns The tracking target definition, or undefined if not found.
+ */
+export declare function getTarget(name: string): ViroARTrackingTarget | undefined;
+/**
+ * Get all registered tracking targets.
+ * @returns A map of tracking target names to tracking target definitions.
+ */
+export declare function getAllTargets(): Record<string, ViroARTrackingTarget>;
+/**
+ * Clear all registered tracking targets.
+ */
+export declare function clearTargets(): void;
+/**
+ * Delete a specific tracking target.
+ * @param targetName The name of the tracking target to delete.
+ */
+export declare function deleteTarget(targetName: string): void;
+declare const ViroARTrackingTargets: {
+    registerTargets: typeof registerTargets;
+    getTarget: typeof getTarget;
+    getAllTargets: typeof getAllTargets;
+    clearTargets: typeof clearTargets;
+    deleteTarget: typeof deleteTarget;
+    createTargets: typeof registerTargets;
+};
+export default ViroARTrackingTargets;