@terraware/web-components 4.2.26-rc.0 → 4.3.0

package/components/VirtualWalkthrough/ControlsInfoPane.js

@@ -1,6 +1,7 @@
-import React, { useCallback } from 'react';
-import { Box, Checkbox, Divider, Fade, Typography, useTheme } from '@mui/material';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback } from 'react';
+import { useTheme, Box, Fade, Typography, Checkbox, Divider } from '@mui/material';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
 const ControlsInfoPane = ({
   visible,
   paneRef,
@@ -29,7 +30,7 @@ const ControlsInfoPane = ({
   const dividerSx = {
     backgroundColor: theme.palette.TwClrBrdrTertiary
   };
-  return /*#__PURE__*/_jsx(Box, {
+  return /*#__PURE__*/jsx(Box, {
     sx: {
       position: 'absolute',
       top: 0,
@@ -44,10 +45,10 @@ const ControlsInfoPane = ({
       paddingTop: isFullScreen ? 8 : 2,
       zIndex: 1001
     },
-    children: /*#__PURE__*/_jsx(Fade, {
+    children: /*#__PURE__*/jsx(Fade, {
       in: visible,
       timeout: 500,
-      children: /*#__PURE__*/_jsx(Box, {
+      children: /*#__PURE__*/jsx(Box, {
         ref: paneRef,
         sx: {
           backgroundColor: theme.palette.grey[900],
@@ -58,134 +59,134 @@ const ControlsInfoPane = ({
           maxWidth: 400,
           pointerEvents: 'auto'
         },
-        children: /*#__PURE__*/_jsxs(Box, {
+        children: /*#__PURE__*/jsxs(Box, {
           sx: {
             display: 'flex',
             flexDirection: 'column',
             gap: 1
           },
-          children: [/*#__PURE__*/_jsx(Typography, {
+          children: [/*#__PURE__*/jsx(Typography, {
             sx: {
               fontWeight: 600
             },
             children: strings.controls
-          }), /*#__PURE__*/_jsxs(Box, {
+          }), /*#__PURE__*/jsxs(Box, {
             sx: controlRowSx,
-            children: [/*#__PURE__*/_jsx(Typography, {
+            children: [/*#__PURE__*/jsx(Typography, {
               children: strings.annotations
-            }), /*#__PURE__*/_jsx(Checkbox, {
+            }), /*#__PURE__*/jsx(Checkbox, {
               checked: showAnnotations ?? true,
               onChange: handleAnnotationsChange,
               sx: {
                 color: theme.palette.primary.main
               }
             })]
-          }), /*#__PURE__*/_jsx(Divider, {
+          }), /*#__PURE__*/jsx(Divider, {
             sx: dividerSx
-          }), /*#__PURE__*/_jsxs(Box, {
+          }), /*#__PURE__*/jsxs(Box, {
             sx: controlRowSx,
-            children: [/*#__PURE__*/_jsx(Typography, {
+            children: [/*#__PURE__*/jsx(Typography, {
               children: strings.autoRotate
-            }), /*#__PURE__*/_jsx(Checkbox, {
+            }), /*#__PURE__*/jsx(Checkbox, {
               checked: autoRotate ?? true,
               onChange: handleAutoRotateChange,
               sx: {
                 color: theme.palette.primary.main
               }
             })]
-          }), /*#__PURE__*/_jsx(Divider, {
+          }), /*#__PURE__*/jsx(Divider, {
             sx: dividerSx
-          }), /*#__PURE__*/_jsxs(Box, {
+          }), /*#__PURE__*/jsxs(Box, {
             sx: controlRowSx,
-            children: [/*#__PURE__*/_jsx(Typography, {
+            children: [/*#__PURE__*/jsx(Typography, {
               children: strings.orbit
-            }), /*#__PURE__*/_jsxs(Box, {
+            }), /*#__PURE__*/jsxs(Box, {
               sx: rightAlignedTextSx,
-              children: [/*#__PURE__*/_jsx(Typography, {
+              children: [/*#__PURE__*/jsx(Typography, {
                 children: strings.leftMouse
-              }), /*#__PURE__*/_jsx(Typography, {
+              }), /*#__PURE__*/jsx(Typography, {
                 children: strings.touchDrag
               })]
             })]
-          }), /*#__PURE__*/_jsx(Divider, {
+          }), /*#__PURE__*/jsx(Divider, {
             sx: dividerSx
-          }), /*#__PURE__*/_jsxs(Box, {
+          }), /*#__PURE__*/jsxs(Box, {
             sx: controlRowSx,
-            children: [/*#__PURE__*/_jsx(Typography, {
+            children: [/*#__PURE__*/jsx(Typography, {
               children: strings.pan
-            }), /*#__PURE__*/_jsxs(Box, {
+            }), /*#__PURE__*/jsxs(Box, {
               sx: rightAlignedTextSx,
-              children: [/*#__PURE__*/_jsx(Typography, {
+              children: [/*#__PURE__*/jsx(Typography, {
                 children: strings.middleMouse
-              }), /*#__PURE__*/_jsx(Typography, {
+              }), /*#__PURE__*/jsx(Typography, {
                 children: strings.swipe
               })]
             })]
-          }), /*#__PURE__*/_jsx(Divider, {
+          }), /*#__PURE__*/jsx(Divider, {
             sx: dividerSx
-          }), /*#__PURE__*/_jsxs(Box, {
+          }), /*#__PURE__*/jsxs(Box, {
             sx: controlRowSx,
-            children: [/*#__PURE__*/_jsx(Typography, {
+            children: [/*#__PURE__*/jsx(Typography, {
               children: strings.look
-            }), /*#__PURE__*/_jsx(Typography, {
+            }), /*#__PURE__*/jsx(Typography, {
               children: strings.rightMouse
             })]
-          }), /*#__PURE__*/_jsx(Divider, {
+          }), /*#__PURE__*/jsx(Divider, {
             sx: dividerSx
-          }), /*#__PURE__*/_jsxs(Box, {
+          }), /*#__PURE__*/jsxs(Box, {
             sx: controlRowSx,
-            children: [/*#__PURE__*/_jsx(Typography, {
+            children: [/*#__PURE__*/jsx(Typography, {
               children: strings.zoom
-            }), /*#__PURE__*/_jsxs(Box, {
+            }), /*#__PURE__*/jsxs(Box, {
               sx: rightAlignedTextSx,
-              children: [/*#__PURE__*/_jsx(Typography, {
+              children: [/*#__PURE__*/jsx(Typography, {
                 children: strings.mouseWheel
-              }), /*#__PURE__*/_jsx(Typography, {
+              }), /*#__PURE__*/jsx(Typography, {
                 children: strings.pinch
               })]
             })]
-          }), /*#__PURE__*/_jsx(Divider, {
+          }), /*#__PURE__*/jsx(Divider, {
             sx: dividerSx
-          }), /*#__PURE__*/_jsxs(Box, {
+          }), /*#__PURE__*/jsxs(Box, {
             sx: controlRowSx,
-            children: [/*#__PURE__*/_jsx(Typography, {
+            children: [/*#__PURE__*/jsx(Typography, {
               children: strings.fly
-            }), /*#__PURE__*/_jsxs(Box, {
+            }), /*#__PURE__*/jsxs(Box, {
               sx: rightAlignedTextSx,
-              children: [/*#__PURE__*/_jsx(Typography, {
+              children: [/*#__PURE__*/jsx(Typography, {
                 children: "WASD"
-              }), /*#__PURE__*/_jsx(Typography, {
+              }), /*#__PURE__*/jsx(Typography, {
                 children: strings.arrowKeys
               })]
             })]
-          }), /*#__PURE__*/_jsx(Divider, {
+          }), /*#__PURE__*/jsx(Divider, {
             sx: dividerSx
-          }), /*#__PURE__*/_jsxs(Box, {
+          }), /*#__PURE__*/jsxs(Box, {
             sx: controlRowSx,
-            children: [/*#__PURE__*/_jsx(Typography, {
+            children: [/*#__PURE__*/jsx(Typography, {
               children: strings.flyFaster
-            }), /*#__PURE__*/_jsx(Typography, {
+            }), /*#__PURE__*/jsx(Typography, {
               children: strings.shift
             })]
-          }), /*#__PURE__*/_jsx(Divider, {
+          }), /*#__PURE__*/jsx(Divider, {
             sx: dividerSx
-          }), /*#__PURE__*/_jsxs(Box, {
+          }), /*#__PURE__*/jsxs(Box, {
             sx: controlRowSx,
-            children: [/*#__PURE__*/_jsx(Typography, {
+            children: [/*#__PURE__*/jsx(Typography, {
               children: strings.flySlower
-            }), /*#__PURE__*/_jsx(Typography, {
+            }), /*#__PURE__*/jsx(Typography, {
               children: strings.ctrl
             })]
-          }), /*#__PURE__*/_jsx(Divider, {
+          }), /*#__PURE__*/jsx(Divider, {
             sx: dividerSx
-          }), /*#__PURE__*/_jsxs(Box, {
+          }), /*#__PURE__*/jsxs(Box, {
             sx: controlRowSx,
-            children: [/*#__PURE__*/_jsx(Typography, {
+            children: [/*#__PURE__*/jsx(Typography, {
               children: strings.resetCamera
-            }), /*#__PURE__*/_jsx(Typography, {
+            }), /*#__PURE__*/jsx(Typography, {
               children: "R"
             })]
-          }), /*#__PURE__*/_jsx(Divider, {
+          }), /*#__PURE__*/jsx(Divider, {
             sx: dividerSx
           })]
         })
@@ -193,4 +194,5 @@ const ControlsInfoPane = ({
     })
   });
 };
-export default ControlsInfoPane;
+
+export { ControlsInfoPane as default };

package/components/VirtualWalkthrough/GradientSky.js

@@ -1,9 +1,10 @@
-import React, { useEffect, useMemo } from 'react';
+import { useMemo, useEffect } from 'react';
 import { Entity } from '@playcanvas/react';
 import { Render } from '@playcanvas/react/components';
 import { useApp } from '@playcanvas/react/hooks';
-import { Color, PIXELFORMAT_RGBA8, StandardMaterial, Texture } from 'playcanvas';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { Texture, PIXELFORMAT_RGBA8, StandardMaterial, Color } from 'playcanvas';
+import { jsx } from 'react/jsx-runtime';
+
 const GradientSky = ({
   topColor = '#1e90ff',
   horizonColor = '#87ceeb',
@@ -58,11 +59,11 @@ const GradientSky = ({
   if (!material) {
     return null;
   }
-  return /*#__PURE__*/_jsx(Entity, {
+  return /*#__PURE__*/jsx(Entity, {
     name: "gradient-sky",
     position: [0, 0, 0],
     scale: [500, 500, 500],
-    children: /*#__PURE__*/_jsx(Render, {
+    children: /*#__PURE__*/jsx(Render, {
       type: "sphere",
       material: material,
       castShadows: false,
@@ -70,4 +71,5 @@ const GradientSky = ({
     })
   });
 };
-export default GradientSky;
+
+export { GradientSky as default };

package/components/VirtualWalkthrough/SplatControls.js

@@ -1,17 +1,18 @@
-import React, { useCallback, useEffect, useRef } from 'react';
-import { Fullscreen, FullscreenExit } from '@mui/icons-material';
-import { Box, IconButton, useTheme } from '@mui/material';
-import useBoolean from '../../hooks/useBoolean';
-import { useCameraPosition } from '../../hooks/useCameraPosition';
-import { useXr } from '../../hooks/useXr';
-import { getRgbaFromHex } from '../../utils/color';
-import useDeviceInfo from '../../utils/useDeviceInfo';
-import Button from '../Button/Button';
-import Icon from '../Icon/Icon';
-import AnnotationEditPane from './AnnotationEditPane';
-import CameraInfo from './CameraInfo';
-import ControlsInfoPane from './ControlsInfoPane';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef, useEffect, useCallback } from 'react';
+import { FullscreenExit, Fullscreen } from '@mui/icons-material';
+import { useTheme, Box, IconButton } from '@mui/material';
+import useBoolean from '../../hooks/useBoolean.js';
+import { useCameraPosition } from '../../hooks/useCameraPosition.js';
+import useXr from '../../hooks/useXr.js';
+import { getRgbaFromHex } from '../../utils/color.js';
+import useDeviceInfo from '../../utils/useDeviceInfo.js';
+import Button from '../Button/Button.js';
+import Icon from '../Icon/Icon.js';
+import AnnotationEditPane from './AnnotationEditPane.js';
+import CameraInfo from './CameraInfo.js';
+import ControlsInfoPane from './ControlsInfoPane.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
 const SplatControls = ({
   strings,
   defaultCameraPosition,
@@ -99,7 +100,7 @@ const SplatControls = ({
     };
   }, [isInfoVisible, setIsInfoVisible, infoButtonRef]);
   const handleEdit = useCallback(() => onToggleEdit?.(true), [onToggleEdit]);
-  return /*#__PURE__*/_jsxs(Box, {
+  return /*#__PURE__*/jsxs(Box, {
     sx: {
       position: 'absolute',
       top: 0,
@@ -108,7 +109,7 @@ const SplatControls = ({
       height: '100%',
       pointerEvents: 'none'
     },
-    children: [isEdit && /*#__PURE__*/_jsxs(Box, {
+    children: [isEdit && /*#__PURE__*/jsxs(Box, {
       sx: {
         position: 'absolute',
         top: 16,
@@ -118,17 +119,17 @@ const SplatControls = ({
         gap: 1,
         pointerEvents: 'auto'
       },
-      children: [!hasSelectedAnnotation && onAddAnnotation && /*#__PURE__*/_jsx(Button, {
+      children: [!hasSelectedAnnotation && onAddAnnotation && /*#__PURE__*/jsx(Button, {
         label: strings.addAnnotation,
         onClick: onAddAnnotation
-      }), hasSelectedAnnotation && onDeselectAnnotation && /*#__PURE__*/_jsx(Button, {
+      }), hasSelectedAnnotation && onDeselectAnnotation && /*#__PURE__*/jsx(Button, {
         label: strings.deselectAnnotation,
         onClick: onDeselectAnnotation
-      }), hasSelectedAnnotation && onDeleteAnnotation && /*#__PURE__*/_jsx(Button, {
+      }), hasSelectedAnnotation && onDeleteAnnotation && /*#__PURE__*/jsx(Button, {
         label: strings.deleteAnnotation,
         onClick: onDeleteAnnotation
       })]
-    }), /*#__PURE__*/_jsxs(Box, {
+    }), /*#__PURE__*/jsxs(Box, {
       sx: {
         position: 'absolute',
         bottom: 16,
@@ -138,27 +139,27 @@ const SplatControls = ({
         gap: 1,
         pointerEvents: 'auto'
       },
-      children: [isXrAvailable('AR') && !isEdit && /*#__PURE__*/_jsx(Button, {
+      children: [isXrAvailable('AR') && !isEdit && /*#__PURE__*/jsx(Button, {
         label: strings.ar,
         onClick: () => startXr('AR')
-      }), isXrAvailable('VR') && !isEdit && /*#__PURE__*/_jsx(Button, {
+      }), isXrAvailable('VR') && !isEdit && /*#__PURE__*/jsx(Button, {
         label: strings.vr,
         onClick: () => startXr('VR')
-      }), isDesktop && editable && !isEdit && onToggleEdit && /*#__PURE__*/_jsx(Button, {
+      }), isDesktop && editable && !isEdit && onToggleEdit && /*#__PURE__*/jsx(Button, {
         label: strings.edit,
         onClick: handleEdit
-      }), isDesktop && showFreeFly && !isEdit && onToggleFreeFly && /*#__PURE__*/_jsx(Button, {
+      }), isDesktop && showFreeFly && !isEdit && onToggleFreeFly && /*#__PURE__*/jsx(Button, {
         label: isFreeFly ? strings.boundedFly : strings.freeFly,
         onClick: onToggleFreeFly
-      }), isEdit && onCancel && /*#__PURE__*/_jsx(Button, {
+      }), isEdit && onCancel && /*#__PURE__*/jsx(Button, {
         label: strings.cancel,
         onClick: onCancel
-      }), isEdit && onSave && /*#__PURE__*/_jsx(Button, {
+      }), isEdit && onSave && /*#__PURE__*/jsx(Button, {
         label: strings.save,
         onClick: onSave,
         disabled: !canSave
       })]
-    }), onToggleFullScreen && /*#__PURE__*/_jsx(IconButton, {
+    }), onToggleFullScreen && /*#__PURE__*/jsx(IconButton, {
       sx: {
         position: 'absolute',
         bottom: 16,
@@ -171,16 +172,16 @@ const SplatControls = ({
       },
       onClick: onToggleFullScreen,
       "aria-label": isFullScreen ? 'Exit fullscreen' : 'Enter fullscreen',
-      children: isFullScreen ? /*#__PURE__*/_jsx(FullscreenExit, {
+      children: isFullScreen ? /*#__PURE__*/jsx(FullscreenExit, {
         sx: {
           color: theme.palette.TwClrIcnInfo
         }
-      }) : /*#__PURE__*/_jsx(Fullscreen, {
+      }) : /*#__PURE__*/jsx(Fullscreen, {
         sx: {
           color: theme.palette.TwClrIcnInfo
         }
       })
-    }), /*#__PURE__*/_jsx(IconButton, {
+    }), /*#__PURE__*/jsx(IconButton, {
       ref: infoButtonRef,
       sx: {
         position: 'absolute',
@@ -193,12 +194,12 @@ const SplatControls = ({
         pointerEvents: 'auto'
       },
       onClick: handleInfo,
-      children: /*#__PURE__*/_jsx(Icon, {
+      children: /*#__PURE__*/jsx(Icon, {
         name: "info",
         size: 'medium',
         fillColor: theme.palette.TwClrIcnInfo
       })
-    }), /*#__PURE__*/_jsx(ControlsInfoPane, {
+    }), /*#__PURE__*/jsx(ControlsInfoPane, {
       visible: isInfoVisible,
       paneRef: paneRef,
       strings: strings.controlsInfoPane,
@@ -207,7 +208,7 @@ const SplatControls = ({
       autoRotate: autoRotate,
       onToggleAutoRotate: onToggleAutoRotate,
       isFullScreen: isFullScreen
-    }), /*#__PURE__*/_jsx(AnnotationEditPane, {
+    }), /*#__PURE__*/jsx(AnnotationEditPane, {
       visible: isEdit === true && hasSelectedAnnotation === true,
       annotation: selectedAnnotation ?? null,
       strings: strings.annotationEditPane,
@@ -215,10 +216,11 @@ const SplatControls = ({
       onTextFieldFocus: onTextFieldFocus,
       maxImages: maxImagesPerAnnotation,
       onImagesChange: onImagesChange
-    }, selectedAnnotationIndex), isEdit && /*#__PURE__*/_jsx(CameraInfo, {
+    }, selectedAnnotationIndex), isEdit && /*#__PURE__*/jsx(CameraInfo, {
       strings: strings.cameraInfo,
       getCameraState: getCameraState
     })]
   });
 };
-export default SplatControls;
+
+export { SplatControls as default };

package/components/VirtualWalkthrough/SplatCrop.js

@@ -1,18 +1,20 @@
-import React from 'react';
+import 'react';
 import { Script } from '@playcanvas/react/components';
 import { Vec3 } from 'playcanvas';
 import { GSplatCropShaderEffect } from 'playcanvas/scripts/esm/gsplat/shader-effect-crop.mjs';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx } from 'react/jsx-runtime';
+
 const SplatCrop = ({
   aabbMin = [-1, -1, -1],
   aabbMax = [1, 1, 1],
   edgeScaleFactor = 0.5
 }) => {
-  return /*#__PURE__*/_jsx(Script, {
+  return /*#__PURE__*/jsx(Script, {
     script: GSplatCropShaderEffect,
     aabbMin: new Vec3(...aabbMin),
     aabbMax: new Vec3(...aabbMax),
     edgeScaleFactor: edgeScaleFactor
   });
 };
-export default SplatCrop;
+
+export { SplatCrop as default };

package/components/VirtualWalkthrough/SplatFadeCrop.js

@@ -1,18 +1,20 @@
-import React from 'react';
+import 'react';
 import { Script } from '@playcanvas/react/components';
 import { Vec3 } from 'playcanvas';
-import { GsplatFadeCropShaderEffect } from './gsplat-fade-crop-effect';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { GsplatFadeCropShaderEffect } from './gsplat-fade-crop-effect.js';
+import { jsx } from 'react/jsx-runtime';
+
 const SplatFadeCrop = ({
   aabbMin = [-1, -1, -1],
   aabbMax = [1, 1, 1],
   fadeDistance = 0.5
 }) => {
-  return /*#__PURE__*/_jsx(Script, {
+  return /*#__PURE__*/jsx(Script, {
     script: GsplatFadeCropShaderEffect,
     aabbMin: new Vec3(...aabbMin),
     aabbMax: new Vec3(...aabbMax),
     fadeDistance: fadeDistance
   });
 };
-export default SplatFadeCrop;
+
+export { SplatFadeCrop as default };

package/components/VirtualWalkthrough/SplatModel.js

@@ -1,13 +1,14 @@
-import React, { memo, useEffect } from 'react';
+import { memo, useEffect } from 'react';
 import { Entity } from '@playcanvas/react';
 import { GSplat } from '@playcanvas/react/components';
 import { useSplat } from '@playcanvas/react/hooks';
-import BlockingSpinner from './BlockingSpinner';
-import SplatCrop from './SplatCrop';
-import SplatFadeCrop from './SplatFadeCrop';
-import SplatRevealRain from './SplatRevealRain';
-import { detectSplatFormat, splatLoaderFilename } from './splatFormat';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import BlockingSpinner from './BlockingSpinner.js';
+import SplatCrop from './SplatCrop.js';
+import SplatFadeCrop from './SplatFadeCrop.js';
+import SplatRevealRain from './SplatRevealRain.js';
+import { splatLoaderFilename, detectSplatFormat } from './splatFormat.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
 const SplatModel = ({
   splatSrc,
   splatFormat,
@@ -38,28 +39,30 @@ const SplatModel = ({
     }
   }, [error, onError]);
   if (loading) {
-    return /*#__PURE__*/_jsx(BlockingSpinner, {});
+    return /*#__PURE__*/jsx(BlockingSpinner, {});
   }
   if (!asset) {
     return null;
   }
-  return /*#__PURE__*/_jsxs(Entity, {
+  return /*#__PURE__*/jsxs(Entity, {
     name: "splat",
     rotation: rotation,
-    children: [/*#__PURE__*/_jsx(GSplat, {
+    children: [/*#__PURE__*/jsx(GSplat, {
       asset: asset,
       unified: true
-    }), (cropAabbMin || cropAabbMax) && (cropFade ? /*#__PURE__*/_jsx(SplatFadeCrop, {
+    }), (cropAabbMin || cropAabbMax) && (cropFade ? /*#__PURE__*/jsx(SplatFadeCrop, {
       aabbMin: cropAabbMin,
       aabbMax: cropAabbMax,
       fadeDistance: cropFadeDistance
-    }) : /*#__PURE__*/_jsx(SplatCrop, {
+    }) : /*#__PURE__*/jsx(SplatCrop, {
       aabbMin: cropAabbMin,
       aabbMax: cropAabbMax,
       edgeScaleFactor: cropEdgeScaleFactor
-    })), /*#__PURE__*/_jsx(SplatRevealRain, {
+    })), /*#__PURE__*/jsx(SplatRevealRain, {
       enabled: revealRain
     })]
   });
 };
-export default /*#__PURE__*/memo(SplatModel);
+var SplatModel$1 = /*#__PURE__*/memo(SplatModel);
+
+export { SplatModel$1 as default };

package/components/VirtualWalkthrough/SplatRevealRain.js

@@ -1,8 +1,9 @@
-import React from 'react';
+import 'react';
 import { Script } from '@playcanvas/react/components';
 import { Color, Vec3 } from 'playcanvas';
 import { GSplatRevealRain } from 'playcanvas/scripts/esm/gsplat/reveal-rain.mjs';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx } from 'react/jsx-runtime';
+
 const SplatRevealRain = ({
   enabled = true,
   center = [0, 0, 0],
@@ -18,7 +19,7 @@ const SplatRevealRain = ({
   hitDuration = 0,
   endRadius = 5
 }) => {
-  return /*#__PURE__*/_jsx(Script, {
+  return /*#__PURE__*/jsx(Script, {
     script: GSplatRevealRain,
     enabled: enabled,
     center: new Vec3(...center),
@@ -35,4 +36,5 @@ const SplatRevealRain = ({
     endRadius: endRadius
   });
 };
-export default SplatRevealRain;
+
+export { SplatRevealRain as default };

package/components/VirtualWalkthrough/TfAnnotationManager.js

@@ -1,8 +1,9 @@
 import { createElement } from 'react';
 import { renderToStaticMarkup } from 'react-dom/server';
-import { FILTER_LINEAR, PIXELFORMAT_RGBA8, Texture, Vec3 } from 'playcanvas';
-import { AnnotationManager as PcAnnotationManager } from 'playcanvas/scripts/esm/annotations.mjs';
-import Icon from '../Icon/Icon';
+import { Vec3, Texture, FILTER_LINEAR, PIXELFORMAT_RGBA8 } from 'playcanvas';
+import { AnnotationManager } from 'playcanvas/scripts/esm/annotations.mjs';
+import Icon from '../Icon/Icon.js';
+
 // Maps each annotation icon type to a @terraware/web-components icon.
 const ANNOTATION_ICONS = {
   text: 'iconComment',
@@ -20,7 +21,7 @@ const HOTSPOT_HOVER_SCALE = 1.3;
  * Extended AnnotationManager that adds max size clamping for annotations
  * and fixes positioning when canvas is not at document origin.
  */
-export class TfAnnotationManager extends PcAnnotationManager {
+class TfAnnotationManager extends AnnotationManager {
   static scriptName = 'tfAnnotationManager';
   _maxWorldSize = 1.0;
   _scratchScale = new Vec3();
@@ -415,4 +416,6 @@ export class TfAnnotationManager extends PcAnnotationManager {
       levels: [new Uint8Array(data.buffer)]
     });
   }
-}
+}
+
+export { TfAnnotationManager };

package/components/VirtualWalkthrough/TfXrNavigation.js

@@ -1,7 +1,7 @@
 import { Vec3 } from 'playcanvas';
-import { XrNavigation as PcXrNavigation } from 'playcanvas/scripts/esm/xr/xr-navigation.mjs';
-import { clampToCircle } from './xr-scene-bounds';
-import { TeleportGestureLatch } from './xr-teleport-gesture';
+import { XrNavigation } from 'playcanvas/scripts/esm/xr/xr-navigation.mjs';
+import { clampToCircle } from './xr-scene-bounds.js';
+import { TeleportGestureLatch } from './xr-teleport-gesture.js';
 
 /** The base script's per-source aim state, which it exposes only as underscore-private fields. */
 
@@ -10,7 +10,7 @@ import { TeleportGestureLatch } from './xr-teleport-gesture';
  * enableTeleport flag (which the base ignores in tryTeleport) and skips sources whose ray is over
  * interactive UI.
  */
-export class TfXrNavigation extends PcXrNavigation {
+class TfXrNavigation extends XrNavigation {
   static scriptName = 'tfXrNavigation';
 
   /** Assigned by the React wrapper. True when this source's ray is over interactive UI. */
@@ -121,4 +121,6 @@ export class TfXrNavigation extends PcXrNavigation {
     rec.point.x = clamped.x;
     rec.point.z = clamped.z;
   }
-}
+}
+
+export { TfXrNavigation };