mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
2a2992b04d
* Grafana-UI: Add docs and story for ClickOutsideWrapper * Grafana-UI: Update comments * Grafana-UI: expand usage * Grafana-UI: Tweak docs
19 lines
679 B
Plaintext
19 lines
679 B
Plaintext
import { Meta, Props } from '@storybook/addon-docs/blocks';
|
|
import { ClickOutsideWrapper } from './ClickOutsideWrapper';
|
|
|
|
<Meta title="MDX|ClickOutsideWrapper" component={ClickOutsideWrapper} />
|
|
|
|
# ClickOutsideWrapper
|
|
|
|
A wrapper component that detects clicks outside of the elements by attaching event listener to `window` or `document` objects.
|
|
Useful for components that require an action being triggered when a click outside has occurred, for example closing an overlay or popup.
|
|
|
|
# Usage
|
|
|
|
```jsx
|
|
<ClickOutsideWrapper onClick={() => console.log('Clicked outside')}>
|
|
<div style={{width: '300px'}}>Container</div>
|
|
</ClickOutsideWrapper>
|
|
````
|
|
<Props of={ClickOutsideWrapper}/>
|