# pointer-events
> Applies `pointer-events`.
```ts
import { pointerEvents } from "@sdxc/u/general";
```
Applies `pointer-events`. Defaults to `"none"`, the common case of an
overlay, icon, or decorative element that should let clicks and hovers pass
through to whatever's underneath it.
## Quick reference
Every documented call, beside the CSS it emits.
| Call | CSS |
| --- | --- |
| `u.pointerEvents()` | `css({ pointerEvents: "none" })` |
| `u.pointerEvents("auto")` | `css({ pointerEvents: "auto" })` |
## Examples
### Basic example
Use `pointerEvents()` on something laid over a control, like an icon, so clicks pass through to whatever is underneath. Click the magnifying glass:
```tsx
```
### Restoring pointer events
Use `pointerEvents("auto")` inside a layer set to `pointerEvents()` to make one part of it clickable again. Both the links and the Undo button respond:
```tsx
```
## Applying on a state
Wrap the call in a state utility to scope it to one selector.
```ts
u.hover(u.pointerEvents())
```
## Responsive design
Wrap the call in a container query to scope it to one width.
```ts
u.at("md", u.pointerEvents())
```
## Signature
```ts
u.pointerEvents(value?: PointerEventsValue)
```