> ## Documentation Index
> Fetch the complete documentation index at: https://dadd.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# useSelectionHighlight

> Hook for applying emissive highlights to body meshes

Applies an emissive glow to the meshes of a selected body. This is a convenience hook built on top of [`useBodyMeshes`](/hooks/use-body-meshes) -- if you need more control over how meshes are styled, use `useBodyMeshes` directly.

## Signature

```tsx theme={null}
useSelectionHighlight(
  bodyId: number | null,
  options?: {
    color?: string;
    emissiveIntensity?: number;
  }
): void
```

## Usage

```tsx theme={null}
import { useSelectionHighlight } from "mujoco-react";

function MyInteractiveScene() {
  const [selectedBody, setSelectedBody] = useState<number | null>(null);

  useSelectionHighlight(selectedBody, {
    color: "#00ff00",
    emissiveIntensity: 0.5,
  });

  // ... your click handling logic to set selectedBody
  return <mesh />;
}
```

### Composing with Other Logic

The hook is useful when you want to combine highlighting with other behavior in a single component:

```tsx theme={null}
function BodyInspector({ bodyId }: { bodyId: number }) {
  useSelectionHighlight(bodyId);
  const { position, quaternion } = useBodyState(bodyName);

  useFrame(() => {
    // Log position of highlighted body
    console.log(position.current);
  });

  return null;
}
```

## Parameters

| Parameter                   | Type             | Default     | Description                                        |
| --------------------------- | ---------------- | ----------- | -------------------------------------------------- |
| `bodyId`                    | `number \| null` | --          | ID of the body to highlight. Pass `null` to clear. |
| `options.color`             | `string`         | `'#ff4444'` | Emissive highlight color.                          |
| `options.emissiveIntensity` | `number`         | `0.3`       | Intensity of the emissive glow.                    |

## How It Works

1. Uses [`useBodyMeshes`](/hooks/use-body-meshes) to get the meshes for the given body ID
2. Sets the mesh material's `emissive` color and `emissiveIntensity`
3. Restores original emissive values when `bodyId` changes or the component unmounts

## Related

* [`useBodyMeshes`](/hooks/use-body-meshes) -- the low-level primitive this hook is built on, for custom visuals and postprocessing