# @vuer-ai/vuer: A 3D Visualization Component Library for NeRFs, Gaussian Splatting, and More
[![Version](https://img.shields.io/npm/v/@vuer-ai/vuer?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/@vuer-ai/vuer)

This repository contains the core component library `vuer-ts`, for mixed AR and VR tooling for robotics.

**Notes on CommonJS**: This is an ESM-only module.

## Selection and Transform System

The library includes a complete selection and transform control system for interactive 3D editing:

### Features
- **Object Selection**: Click any 3D object to select it (when `editMode=true`)
- **Transform Controls**: Real-time translation, rotation, and scaling via 3D gizmos
- **Visual Feedback**: Bounding boxes and transform handles around selected objects
- **State Management**: Selection state tracked in `EditorStore`
- **WebSocket Sync**: Transform changes sync automatically via WebSocket

### Components
- `EditorStore`: Manages selection state (`selectedNodeKey`)
- `VuerTransformControl`: Custom 3D transform widget with axis arrows, plane sliders, rotation rings, and scaling spheres
- `EditorTransformControls`: Wrapper that converts transform events to scene updates
- `EditorControl`: Conditionally renders transform controls when objects are selected
- `Hydrate`: Adds click handlers to scene objects in edit mode

### Usage
Set `editMode={true}` on `SceneContainer` to enable the selection and transform system. See [vuer-web implementation](https://github.com/vuer-ai/vuer-web/pull/13) for example usage.

To build:
```shell
yarn build
```

You can preview the build via 
```shell
yarn preview
```