# usePointerDownOutside
> Detects pointer-down events outside a component tree.

Detects pointer-down events that occur outside a component's DOM tree. Returns a capture handler to attach to the component's root element.

## Import

```js
import { usePointerDownOutside } from '@volue/wave-react';
```

## Example

```jsx
() => {
  const [count, setCount] = React.useState(0);

  const { onPointerDownCapture } = usePointerDownOutside(() => {
    setCount(c => c + 1);
  });

  return (
    <Flex
      flow="column"
      gap="spacingS"
      onPointerDownCapture={onPointerDownCapture}
      padding="spacingM"
      css={{ background: '$backgroundNeutralModerate' }}
    >
      <Text>{'Pointer-down outside count: ' + count}</Text>
      <Text>{'Click outside this box to increment.'}</Text>
    </Box>
  );
};
```

---

## API reference

### Arguments

| Name                   | Type                                       | Default | Description                                                              | Required |
| ---------------------- | ------------------------------------------ | ------- | ------------------------------------------------------------------------ | -------- |
| `onPointerDownOutside` | `(event: PointerDownOutsideEvent) => void` | `—`     | Callback invoked when a pointer-down event occurs outside the component. |          |

### Returns

`{ onPointerDownCapture: () => void }` — An object with a capture handler to attach to the root element.