@reactvision/react-viro 2.43.1 → 2.43.4

package/fabric-interop/dist/index.js

@@ -1,118 +0,0 @@
-"use strict";
-/**
- * Viro Fabric Interop Layer
- *
- * This module provides compatibility between React Native's New Architecture (Fabric)
- * and the existing Viro implementation without requiring codegen.
- */
-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 __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.generateNodeId = exports.ViroARTrackingTargets = exports.ViroMaterials = exports.ViroAnimations = exports.ViroARObjectMarker = exports.ViroARImageMarker = exports.ViroARPlaneSelector = exports.ViroARPlane = exports.ViroARCamera = exports.Viro3DSceneNavigator = exports.ViroARSceneNavigator = exports.ViroVRSceneNavigator = exports.ViroSceneNavigator = exports.ViroMaterialVideo = exports.ViroAnimatedComponent = exports.ViroParticleEmitter = exports.ViroSpinner = exports.ViroController = exports.ViroButton = exports.ViroSpatialSound = exports.ViroSoundField = exports.ViroSound = exports.ViroOrbitCamera = exports.ViroCamera = exports.ViroLightingEnvironment = exports.ViroOmniLight = exports.ViroSpotLight = exports.ViroDirectionalLight = exports.ViroAmbientLight = exports.ViroPortalScene = exports.ViroPortal = exports.ViroSkyBox = exports.Viro360Video = exports.Viro360Image = exports.ViroAnimatedImage = exports.ViroVideo = exports.ViroImage = exports.ViroText = exports.ViroSurface = exports.ViroPolyline = exports.ViroPolygon = exports.ViroQuad = exports.ViroGeometry = exports.Viro3DObject = exports.ViroSphere = exports.ViroBox = exports.ViroFlexView = exports.ViroARScene = exports.ViroScene = exports.ViroNode = void 0;
-exports.ViroEventsManager = exports.updateMaterial = exports.executeAnimation = exports.updateNativeMaterial = exports.executeNativeAnimation = exports.isViroJSIAvailable = exports.setARImageTargets = exports.setARPlaneDetection = exports.createAnimation = exports.createMaterial = exports.removeChild = exports.addChild = exports.deleteNode = exports.updateNode = exports.createNode = exports.performMemoryCleanup = exports.getMemoryStats = exports.getSceneState = exports.destroyScene = exports.deactivateScene = exports.activateScene = exports.createScene = exports.initializeViro = exports.unregisterEventListener = exports.registerEventListener = exports.handleViroEvent = exports.generateCallbackId = void 0;
-__exportStar(require("./ViroFabricContainer"), exports);
-// Export components explicitly to ensure they're found by validation
-var components_1 = require("./components");
-Object.defineProperty(exports, "ViroNode", { enumerable: true, get: function () { return components_1.ViroNode; } });
-Object.defineProperty(exports, "ViroScene", { enumerable: true, get: function () { return components_1.ViroScene; } });
-Object.defineProperty(exports, "ViroARScene", { enumerable: true, get: function () { return components_1.ViroARScene; } });
-Object.defineProperty(exports, "ViroFlexView", { enumerable: true, get: function () { return components_1.ViroFlexView; } });
-Object.defineProperty(exports, "ViroBox", { enumerable: true, get: function () { return components_1.ViroBox; } });
-Object.defineProperty(exports, "ViroSphere", { enumerable: true, get: function () { return components_1.ViroSphere; } });
-Object.defineProperty(exports, "Viro3DObject", { enumerable: true, get: function () { return components_1.Viro3DObject; } });
-Object.defineProperty(exports, "ViroGeometry", { enumerable: true, get: function () { return components_1.ViroGeometry; } });
-Object.defineProperty(exports, "ViroQuad", { enumerable: true, get: function () { return components_1.ViroQuad; } });
-Object.defineProperty(exports, "ViroPolygon", { enumerable: true, get: function () { return components_1.ViroPolygon; } });
-Object.defineProperty(exports, "ViroPolyline", { enumerable: true, get: function () { return components_1.ViroPolyline; } });
-Object.defineProperty(exports, "ViroSurface", { enumerable: true, get: function () { return components_1.ViroSurface; } });
-Object.defineProperty(exports, "ViroText", { enumerable: true, get: function () { return components_1.ViroText; } });
-Object.defineProperty(exports, "ViroImage", { enumerable: true, get: function () { return components_1.ViroImage; } });
-Object.defineProperty(exports, "ViroVideo", { enumerable: true, get: function () { return components_1.ViroVideo; } });
-Object.defineProperty(exports, "ViroAnimatedImage", { enumerable: true, get: function () { return components_1.ViroAnimatedImage; } });
-Object.defineProperty(exports, "Viro360Image", { enumerable: true, get: function () { return components_1.Viro360Image; } });
-Object.defineProperty(exports, "Viro360Video", { enumerable: true, get: function () { return components_1.Viro360Video; } });
-Object.defineProperty(exports, "ViroSkyBox", { enumerable: true, get: function () { return components_1.ViroSkyBox; } });
-Object.defineProperty(exports, "ViroPortal", { enumerable: true, get: function () { return components_1.ViroPortal; } });
-Object.defineProperty(exports, "ViroPortalScene", { enumerable: true, get: function () { return components_1.ViroPortalScene; } });
-Object.defineProperty(exports, "ViroAmbientLight", { enumerable: true, get: function () { return components_1.ViroAmbientLight; } });
-Object.defineProperty(exports, "ViroDirectionalLight", { enumerable: true, get: function () { return components_1.ViroDirectionalLight; } });
-Object.defineProperty(exports, "ViroSpotLight", { enumerable: true, get: function () { return components_1.ViroSpotLight; } });
-Object.defineProperty(exports, "ViroOmniLight", { enumerable: true, get: function () { return components_1.ViroOmniLight; } });
-Object.defineProperty(exports, "ViroLightingEnvironment", { enumerable: true, get: function () { return components_1.ViroLightingEnvironment; } });
-Object.defineProperty(exports, "ViroCamera", { enumerable: true, get: function () { return components_1.ViroCamera; } });
-Object.defineProperty(exports, "ViroOrbitCamera", { enumerable: true, get: function () { return components_1.ViroOrbitCamera; } });
-Object.defineProperty(exports, "ViroSound", { enumerable: true, get: function () { return components_1.ViroSound; } });
-Object.defineProperty(exports, "ViroSoundField", { enumerable: true, get: function () { return components_1.ViroSoundField; } });
-Object.defineProperty(exports, "ViroSpatialSound", { enumerable: true, get: function () { return components_1.ViroSpatialSound; } });
-Object.defineProperty(exports, "ViroButton", { enumerable: true, get: function () { return components_1.ViroButton; } });
-Object.defineProperty(exports, "ViroController", { enumerable: true, get: function () { return components_1.ViroController; } });
-Object.defineProperty(exports, "ViroSpinner", { enumerable: true, get: function () { return components_1.ViroSpinner; } });
-Object.defineProperty(exports, "ViroParticleEmitter", { enumerable: true, get: function () { return components_1.ViroParticleEmitter; } });
-Object.defineProperty(exports, "ViroAnimatedComponent", { enumerable: true, get: function () { return components_1.ViroAnimatedComponent; } });
-Object.defineProperty(exports, "ViroMaterialVideo", { enumerable: true, get: function () { return components_1.ViroMaterialVideo; } });
-Object.defineProperty(exports, "ViroSceneNavigator", { enumerable: true, get: function () { return components_1.ViroSceneNavigator; } });
-Object.defineProperty(exports, "ViroVRSceneNavigator", { enumerable: true, get: function () { return components_1.ViroVRSceneNavigator; } });
-Object.defineProperty(exports, "ViroARSceneNavigator", { enumerable: true, get: function () { return components_1.ViroARSceneNavigator; } });
-Object.defineProperty(exports, "Viro3DSceneNavigator", { enumerable: true, get: function () { return components_1.Viro3DSceneNavigator; } });
-Object.defineProperty(exports, "ViroARCamera", { enumerable: true, get: function () { return components_1.ViroARCamera; } });
-Object.defineProperty(exports, "ViroARPlane", { enumerable: true, get: function () { return components_1.ViroARPlane; } });
-Object.defineProperty(exports, "ViroARPlaneSelector", { enumerable: true, get: function () { return components_1.ViroARPlaneSelector; } });
-Object.defineProperty(exports, "ViroARImageMarker", { enumerable: true, get: function () { return components_1.ViroARImageMarker; } });
-Object.defineProperty(exports, "ViroARObjectMarker", { enumerable: true, get: function () { return components_1.ViroARObjectMarker; } });
-Object.defineProperty(exports, "ViroAnimations", { enumerable: true, get: function () { return components_1.ViroAnimations; } });
-Object.defineProperty(exports, "ViroMaterials", { enumerable: true, get: function () { return components_1.ViroMaterials; } });
-Object.defineProperty(exports, "ViroARTrackingTargets", { enumerable: true, get: function () { return components_1.ViroARTrackingTargets; } });
-// Export utilities
-__exportStar(require("./components/ViroUtils"), exports);
-// Export specific functions from NativeViro to avoid conflicts
-var NativeViro_1 = require("./NativeViro");
-Object.defineProperty(exports, "generateNodeId", { enumerable: true, get: function () { return NativeViro_1.generateNodeId; } });
-Object.defineProperty(exports, "generateCallbackId", { enumerable: true, get: function () { return NativeViro_1.generateCallbackId; } });
-Object.defineProperty(exports, "handleViroEvent", { enumerable: true, get: function () { return NativeViro_1.handleViroEvent; } });
-Object.defineProperty(exports, "registerEventListener", { enumerable: true, get: function () { return NativeViro_1.registerEventListener; } });
-Object.defineProperty(exports, "unregisterEventListener", { enumerable: true, get: function () { return NativeViro_1.unregisterEventListener; } });
-Object.defineProperty(exports, "initializeViro", { enumerable: true, get: function () { return NativeViro_1.initializeViro; } });
-Object.defineProperty(exports, "createScene", { enumerable: true, get: function () { return NativeViro_1.createScene; } });
-Object.defineProperty(exports, "activateScene", { enumerable: true, get: function () { return NativeViro_1.activateScene; } });
-Object.defineProperty(exports, "deactivateScene", { enumerable: true, get: function () { return NativeViro_1.deactivateScene; } });
-Object.defineProperty(exports, "destroyScene", { enumerable: true, get: function () { return NativeViro_1.destroyScene; } });
-Object.defineProperty(exports, "getSceneState", { enumerable: true, get: function () { return NativeViro_1.getSceneState; } });
-Object.defineProperty(exports, "getMemoryStats", { enumerable: true, get: function () { return NativeViro_1.getMemoryStats; } });
-Object.defineProperty(exports, "performMemoryCleanup", { enumerable: true, get: function () { return NativeViro_1.performMemoryCleanup; } });
-Object.defineProperty(exports, "createNode", { enumerable: true, get: function () { return NativeViro_1.createNode; } });
-Object.defineProperty(exports, "updateNode", { enumerable: true, get: function () { return NativeViro_1.updateNode; } });
-Object.defineProperty(exports, "deleteNode", { enumerable: true, get: function () { return NativeViro_1.deleteNode; } });
-Object.defineProperty(exports, "addChild", { enumerable: true, get: function () { return NativeViro_1.addChild; } });
-Object.defineProperty(exports, "removeChild", { enumerable: true, get: function () { return NativeViro_1.removeChild; } });
-Object.defineProperty(exports, "createMaterial", { enumerable: true, get: function () { return NativeViro_1.createMaterial; } });
-Object.defineProperty(exports, "createAnimation", { enumerable: true, get: function () { return NativeViro_1.createAnimation; } });
-Object.defineProperty(exports, "setARPlaneDetection", { enumerable: true, get: function () { return NativeViro_1.setARPlaneDetection; } });
-Object.defineProperty(exports, "setARImageTargets", { enumerable: true, get: function () { return NativeViro_1.setARImageTargets; } });
-Object.defineProperty(exports, "isViroJSIAvailable", { enumerable: true, get: function () { return NativeViro_1.isViroJSIAvailable; } });
-// Re-export executeAnimation and updateMaterial with different names to avoid conflicts
-var NativeViro_2 = require("./NativeViro");
-Object.defineProperty(exports, "executeNativeAnimation", { enumerable: true, get: function () { return NativeViro_2.executeAnimation; } });
-Object.defineProperty(exports, "updateNativeMaterial", { enumerable: true, get: function () { return NativeViro_2.updateMaterial; } });
-// Also export the original names for backward compatibility
-var NativeViro_3 = require("./NativeViro");
-Object.defineProperty(exports, "executeAnimation", { enumerable: true, get: function () { return NativeViro_3.executeAnimation; } });
-Object.defineProperty(exports, "updateMaterial", { enumerable: true, get: function () { return NativeViro_3.updateMaterial; } });
-// Export event management utilities
-var ViroEventsManager_1 = require("./ViroEventsManager");
-Object.defineProperty(exports, "ViroEventsManager", { enumerable: true, get: function () { return __importDefault(ViroEventsManager_1).default; } });
-//# sourceMappingURL=index.js.map

package/fabric-interop/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":";AAAA;;;;;GAKG;;;;;;;;;;;;;;;;;;;;;AAEH,wDAAsC;AAEtC,qEAAqE;AACrE,2CAkDsB;AAjDpB,sGAAA,QAAQ,OAAA;AACR,uGAAA,SAAS,OAAA;AACT,yGAAA,WAAW,OAAA;AACX,0GAAA,YAAY,OAAA;AACZ,qGAAA,OAAO,OAAA;AACP,wGAAA,UAAU,OAAA;AACV,0GAAA,YAAY,OAAA;AACZ,0GAAA,YAAY,OAAA;AACZ,sGAAA,QAAQ,OAAA;AACR,yGAAA,WAAW,OAAA;AACX,0GAAA,YAAY,OAAA;AACZ,yGAAA,WAAW,OAAA;AACX,sGAAA,QAAQ,OAAA;AACR,uGAAA,SAAS,OAAA;AACT,uGAAA,SAAS,OAAA;AACT,+GAAA,iBAAiB,OAAA;AACjB,0GAAA,YAAY,OAAA;AACZ,0GAAA,YAAY,OAAA;AACZ,wGAAA,UAAU,OAAA;AACV,wGAAA,UAAU,OAAA;AACV,6GAAA,eAAe,OAAA;AACf,8GAAA,gBAAgB,OAAA;AAChB,kHAAA,oBAAoB,OAAA;AACpB,2GAAA,aAAa,OAAA;AACb,2GAAA,aAAa,OAAA;AACb,qHAAA,uBAAuB,OAAA;AACvB,wGAAA,UAAU,OAAA;AACV,6GAAA,eAAe,OAAA;AACf,uGAAA,SAAS,OAAA;AACT,4GAAA,cAAc,OAAA;AACd,8GAAA,gBAAgB,OAAA;AAChB,wGAAA,UAAU,OAAA;AACV,4GAAA,cAAc,OAAA;AACd,yGAAA,WAAW,OAAA;AACX,iHAAA,mBAAmB,OAAA;AACnB,mHAAA,qBAAqB,OAAA;AACrB,+GAAA,iBAAiB,OAAA;AACjB,gHAAA,kBAAkB,OAAA;AAClB,kHAAA,oBAAoB,OAAA;AACpB,kHAAA,oBAAoB,OAAA;AACpB,kHAAA,oBAAoB,OAAA;AACpB,0GAAA,YAAY,OAAA;AACZ,yGAAA,WAAW,OAAA;AACX,iHAAA,mBAAmB,OAAA;AACnB,+GAAA,iBAAiB,OAAA;AACjB,gHAAA,kBAAkB,OAAA;AAClB,4GAAA,cAAc,OAAA;AACd,2GAAA,aAAa,OAAA;AACb,mHAAA,qBAAqB,OAAA;AAGvB,mBAAmB;AACnB,yDAAuC;AAEvC,+DAA+D;AAC/D,2CA2BsB;AA1BpB,4GAAA,cAAc,OAAA;AACd,gHAAA,kBAAkB,OAAA;AAClB,6GAAA,eAAe,OAAA;AACf,mHAAA,qBAAqB,OAAA;AACrB,qHAAA,uBAAuB,OAAA;AACvB,4GAAA,cAAc,OAAA;AACd,yGAAA,WAAW,OAAA;AACX,2GAAA,aAAa,OAAA;AACb,6GAAA,eAAe,OAAA;AACf,0GAAA,YAAY,OAAA;AACZ,2GAAA,aAAa,OAAA;AACb,4GAAA,cAAc,OAAA;AACd,kHAAA,oBAAoB,OAAA;AACpB,wGAAA,UAAU,OAAA;AACV,wGAAA,UAAU,OAAA;AACV,wGAAA,UAAU,OAAA;AACV,sGAAA,QAAQ,OAAA;AACR,yGAAA,WAAW,OAAA;AACX,4GAAA,cAAc,OAAA;AACd,6GAAA,eAAe,OAAA;AACf,iHAAA,mBAAmB,OAAA;AACnB,+GAAA,iBAAiB,OAAA;AACjB,gHAAA,kBAAkB,OAAA;AAMpB,wFAAwF;AACxF,2CAGsB;AAFpB,oHAAA,gBAAgB,OAA0B;AAC1C,kHAAA,cAAc,OAAwB;AAGxC,4DAA4D;AAC5D,2CAAgE;AAAvD,8GAAA,gBAAgB,OAAA;AAAE,4GAAA,cAAc,OAAA;AAEzC,oCAAoC;AACpC,yDAAmE;AAA1D,uIAAA,OAAO,OAAqB"}

package/fabric-interop/dist/specs/ViroEventsTurboModule.d.ts

@@ -1,20 +0,0 @@
-/**
- * ViroEventsTurboModule.ts
- * TurboModule specification for Viro event emission
- *
- * This module provides proper event emission for JSI callbacks
- * in React Native's New Architecture (Fabric + TurboModules)
- */
-import type { TurboModule } from "react-native";
-export interface Spec extends TurboModule {
-    addListener(eventName: string): void;
-    removeListeners(count: number): void;
-    emitJSICallback(callbackId: string, eventData: Object): void;
-    emitNodeEvent(nodeId: string, eventName: string, eventData: Object): void;
-    emitSceneEvent(sceneId: string, eventName: string, eventData: Object): void;
-    isEventSystemReady(): boolean;
-    getActiveListenerCount(): number;
-}
-declare const _default: Spec;
-export default _default;
-//# sourceMappingURL=ViroEventsTurboModule.d.ts.map

package/fabric-interop/dist/specs/ViroEventsTurboModule.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ViroEventsTurboModule.d.ts","sourceRoot":"","sources":["../../specs/ViroEventsTurboModule.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAGhD,MAAM,WAAW,IAAK,SAAQ,WAAW;IAEvC,WAAW,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAGrC,eAAe,CAAC,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7D,aAAa,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1E,cAAc,CAAC,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAG5E,kBAAkB,IAAI,OAAO,CAAC;IAC9B,sBAAsB,IAAI,MAAM,CAAC;CAClC;;AAED,wBAAoE"}

package/fabric-interop/dist/specs/ViroEventsTurboModule.js

@@ -1,12 +0,0 @@
-"use strict";
-/**
- * ViroEventsTurboModule.ts
- * TurboModule specification for Viro event emission
- *
- * This module provides proper event emission for JSI callbacks
- * in React Native's New Architecture (Fabric + TurboModules)
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_native_1 = require("react-native");
-exports.default = react_native_1.TurboModuleRegistry.getEnforcing("ViroEvents");
-//# sourceMappingURL=ViroEventsTurboModule.js.map

package/fabric-interop/dist/specs/ViroEventsTurboModule.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ViroEventsTurboModule.js","sourceRoot":"","sources":["../../specs/ViroEventsTurboModule.ts"],"names":[],"mappings":";AAAA;;;;;;GAMG;;AAGH,+CAAmD;AAiBnD,kBAAe,kCAAmB,CAAC,YAAY,CAAO,YAAY,CAAC,CAAC"}

package/fabric-interop/examples/BasicSceneExample.tsx

@@ -1,287 +0,0 @@
-/**
- * BasicSceneExample
- *
- * A simple example demonstrating the new fabric-interop system with:
- * - Scene management and lifecycle
- * - Property system with individual setters
- * - Event system with JSI + fallback
- * - Memory management integration
- */
-
-import React, { useState, useEffect } from "react";
-import { View, Text, Button, StyleSheet, Alert } from "react-native";
-import {
-  ViroFabricContainer,
-  ViroScene,
-  ViroBox,
-  createMaterial,
-  createAnimation,
-  executeAnimation,
-  getMemoryStats,
-  performMemoryCleanup,
-} from "../index";
-
-export const BasicSceneExample: React.FC = () => {
-  const [sceneActive, setSceneActive] = useState(false);
-  const [memoryStats, setMemoryStats] = useState<Record<string, any> | null>(
-    null
-  );
-
-  // Initialize materials and animations when component mounts
-  useEffect(() => {
-    // Create a red material for the box
-    createMaterial("redMaterial", {
-      diffuseColor: "#FF0000",
-      shininess: 2.0,
-      lightingModel: "Lambert",
-    });
-
-    // Create a blue material for the box
-    createMaterial("blueMaterial", {
-      diffuseColor: "#0000FF",
-      shininess: 2.0,
-      lightingModel: "Lambert",
-    });
-
-    // Create a rotation animation
-    createAnimation("spinAnimation", {
-      properties: {
-        rotateY: "+=360",
-      },
-      duration: 2000,
-      easing: "Linear",
-    });
-
-    // Create a scale animation
-    createAnimation("pulseAnimation", {
-      properties: {
-        scaleX: 1.5,
-        scaleY: 1.5,
-        scaleZ: 1.5,
-      },
-      duration: 1000,
-      easing: "EaseInEaseOut",
-    });
-  }, []);
-
-  // Handle scene initialization
-  const handleSceneInitialized = (success: boolean) => {
-    console.log("Scene initialized:", success);
-    setSceneActive(success);
-
-    if (success) {
-      Alert.alert("Success", "Viro scene initialized successfully!");
-    } else {
-      Alert.alert("Error", "Failed to initialize Viro scene");
-    }
-  };
-
-  // Handle scene state changes
-  const handleSceneStateChanged = (event: {
-    sceneId: string;
-    state: string;
-  }) => {
-    console.log("Scene state changed:", event);
-  };
-
-  // Handle memory warnings
-  const handleMemoryWarning = (event: { memoryStats: Record<string, any> }) => {
-    console.log("Memory warning received:", event.memoryStats);
-    setMemoryStats(event.memoryStats);
-    Alert.alert(
-      "Memory Warning",
-      `Memory usage: ${event.memoryStats.usedMemoryMB?.toFixed(1) || "N/A"} MB`
-    );
-  };
-
-  // Handle box click
-  const handleBoxClick = () => {
-    Alert.alert("Box Clicked", "The red box was clicked!");
-
-    // Execute spin animation
-    executeAnimation("box1", "spinAnimation", {
-      run: true,
-      loop: false,
-    });
-  };
-
-  // Handle box hover
-  const handleBoxHover = (isHovering: boolean) => {
-    console.log("Box hover:", isHovering);
-
-    if (isHovering) {
-      // Execute pulse animation on hover
-      executeAnimation("box1", "pulseAnimation", {
-        run: true,
-        loop: false,
-      });
-    }
-  };
-
-  // Get current memory stats
-  const checkMemoryStats = () => {
-    const stats = getMemoryStats();
-    setMemoryStats(stats);
-
-    if (stats) {
-      Alert.alert(
-        "Memory Stats",
-        `Total Scenes: ${stats.totalScenes || 0}\n` +
-          `Active Scenes: ${stats.activeScenes || 0}\n` +
-          `Managed Nodes: ${stats.managedNodes || 0}\n` +
-          `Memory Usage: ${stats.usedMemoryMB?.toFixed(1) || "N/A"} MB`
-      );
-    } else {
-      Alert.alert("Memory Stats", "Memory statistics not available");
-    }
-  };
-
-  // Perform manual memory cleanup
-  const cleanupMemory = () => {
-    performMemoryCleanup();
-    Alert.alert("Memory Cleanup", "Memory cleanup performed");
-  };
-
-  return (
-    <View style={styles.container}>
-      <Text style={styles.title}>Viro Fabric Interop Example</Text>
-      <Text style={styles.subtitle}>
-        Demonstrating New Architecture compatibility
-      </Text>
-
-      <View style={styles.controls}>
-        <Button
-          title="Check Memory Stats"
-          onPress={checkMemoryStats}
-          disabled={!sceneActive}
-        />
-        <Button
-          title="Cleanup Memory"
-          onPress={cleanupMemory}
-          disabled={!sceneActive}
-        />
-      </View>
-
-      {memoryStats && (
-        <View style={styles.stats}>
-          <Text style={styles.statsTitle}>Memory Stats:</Text>
-          <Text>Total Scenes: {memoryStats.totalScenes || 0}</Text>
-          <Text>Active Scenes: {memoryStats.activeScenes || 0}</Text>
-          <Text>Managed Nodes: {memoryStats.managedNodes || 0}</Text>
-          <Text>
-            Memory Usage: {memoryStats.usedMemoryMB?.toFixed(1) || "N/A"} MB
-          </Text>
-        </View>
-      )}
-
-      <ViroFabricContainer
-        style={styles.viroContainer}
-        debug={true}
-        arEnabled={false}
-        worldAlignment="Gravity"
-        onInitialized={handleSceneInitialized}
-        onSceneStateChanged={handleSceneStateChanged}
-        onMemoryWarning={handleMemoryWarning}
-      >
-        <ViroScene
-          onSceneLoadStart={() => console.log("Scene load started")}
-          onSceneLoadEnd={() => console.log("Scene load ended")}
-          onSceneError={(error) => console.error("Scene error:", error)}
-        >
-          {/* Red box with click and hover events */}
-          <ViroBox
-            position={[-1, 0, -3]}
-            scale={[0.5, 0.5, 0.5]}
-            materials={["redMaterial"]}
-            onClick={handleBoxClick}
-            onHover={(isHovering) => handleBoxHover(isHovering)}
-            canClick={true}
-            canHover={true}
-          />
-
-          {/* Blue box with different position */}
-          <ViroBox
-            position={[1, 0, -3]}
-            scale={[0.5, 0.5, 0.5]}
-            materials={["blueMaterial"]}
-            onClick={() => Alert.alert("Blue Box", "Blue box clicked!")}
-            canClick={true}
-          />
-
-          {/* Center box with animation */}
-          <ViroBox
-            position={[0, 1, -3]}
-            scale={[0.3, 0.3, 0.3]}
-            materials={["redMaterial"]}
-            animation={{
-              name: "spinAnimation",
-              run: true,
-              loop: true,
-            }}
-          />
-        </ViroScene>
-      </ViroFabricContainer>
-
-      <View style={styles.footer}>
-        <Text style={styles.footerText}>
-          Status: {sceneActive ? "Active" : "Initializing..."}
-        </Text>
-        <Text style={styles.footerText}>
-          Features: Scene Management • Property System • Event System • Memory
-          Management
-        </Text>
-      </View>
-    </View>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: "#f0f0f0",
-  },
-  title: {
-    fontSize: 20,
-    fontWeight: "bold",
-    textAlign: "center",
-    marginTop: 20,
-    marginBottom: 5,
-  },
-  subtitle: {
-    fontSize: 14,
-    textAlign: "center",
-    color: "#666",
-    marginBottom: 15,
-  },
-  controls: {
-    flexDirection: "row",
-    justifyContent: "space-around",
-    paddingHorizontal: 20,
-    marginBottom: 10,
-  },
-  stats: {
-    backgroundColor: "#fff",
-    margin: 10,
-    padding: 10,
-    borderRadius: 5,
-    borderWidth: 1,
-    borderColor: "#ddd",
-  },
-  statsTitle: {
-    fontWeight: "bold",
-    marginBottom: 5,
-  },
-  viroContainer: {
-    flex: 1,
-    backgroundColor: "#000",
-  },
-  footer: {
-    backgroundColor: "#333",
-    padding: 10,
-  },
-  footerText: {
-    color: "#fff",
-    textAlign: "center",
-    fontSize: 12,
-  },
-});