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';

Name	Type	Default	Description
children*	element		The wrapped element. This needs to be able to hold a ref.
onClickAway*	func		Callback fired when a "click away" event is detected.
disableReactTree	bool	false	If `true`, the React tree is ignored and only the DOM tree is considered. This prop changes how portaled elements are handled.
mouseEvent	'onClick' \| 'onMouseDown' \| 'onMouseUp' \| 'onPointerDown' \| 'onPointerUp' \| false	'onClick'	The mouse event to listen to. You can disable the listener by providing `false`.
touchEvent	'onTouchEnd' \| 'onTouchStart' \| false	'onTouchEnd'	The touch event to listen to. You can disable the listener by providing `false`.

The component cannot hold a ref.