# useDeviceSignal

> The live sound of a device's engine for its panel's signal prop: the same object for the life of the component, following the engine as it changes, listening only while the panel watches it

```bash
npx shadcn@latest add @audio-ui/use-device-signal
```

```ts
import { useDeviceSignal } from "@/hooks/use-device-signal";
```

- Files: `hooks/use-device-signal.ts`
- Depends on: `device-signal`; npm: `@audio-ui/engine`
- Used by: `block-auto-pan`, `block-bass-enhancer`, `block-binaural-panner`, `block-channel-eq`, `block-chorus`, `block-compander`, `block-compressor`, `block-deesser`, `block-delay`, `block-distortion`, `block-ducker`, `block-equalizer`, `block-exciter`, `block-expander`, `block-filter`, `block-frequency-shifter`, `block-gate`, `block-graphic-eq`, `block-limiter`, `block-lofi`, `block-mid-side`, `block-multiband`, `block-overdrive`, `block-phaser`, `block-redux`, `block-reverb`, `block-rotary`, `block-saturator`, `block-stutter`, `block-tilt-eq`, `block-transient`, `block-unlimiter`, `block-utility`, `block-vibe`, `block-wah`

| Export | Kind | What it is |
| --- | --- | --- |
| `useDeviceSignal` | function | The live signal of a device's engine, for its panel's `signal`: what goes in and comes out, and what the device declares in `signals`. |

## Usage

```tsx
import { compressorDevice } from "@/components/audio-ui/devices/compressor/device";
import { createCompressorEngine } from "@/components/audio-ui/devices/compressor/engine";
import { CompressorPanel } from "@/components/audio-ui/devices/compressor/panel";
import { useDeviceEngines } from "@/hooks/use-device-engines";
import { useDeviceSignal } from "@/hooks/use-device-signal";

const [engine = null] = useDeviceEngines({
  create: createCompressorEngine,
  destination,
  state,
});
const signal = useDeviceSignal(engine, compressorDevice);

<CompressorPanel onValueChange={setState} signal={signal} value={state} />;
```

`useDeviceSignal(engine, device)` returns the [device signal](/docs/lib/device-signal) of `engine`: the same object for the life of the component, following `engine` as it changes and silent while it is `null`, such as before the sound starts. It listens only while the panel watches one of its sources, and needs no cleanup: unmounting the panel takes its analysers off.