Click-Away Listener

The Click-Away Listener component detects when a click event happens outside of its child element.

ClickAwayListener API

import { ClickAwayListener } from '@mui/base/ClickAwayListener';
// or
import { ClickAwayListener } from '@mui/base';

childrenRequired

The wrapped element.

Type:element

onClickAwayRequired

Callback fired when a "click away" event is detected.

Type:func

disableReactTree

If true, the React tree is ignored and only the DOM tree is considered. This prop changes how portaled elements are handled.

Type:bool

Default:false

mouseEvent

The mouse event to listen to. You can disable the listener by providing false.

Default:'onClick'

touchEvent

The touch event to listen to. You can disable the listener by providing false.

Type:'onTouchEnd' | 'onTouchStart' | false

Default:'onTouchEnd'

The component cannot hold a ref.