Skip to content

Commit 17ef194

Browse files
committed
Rewrite the description for useElementShouldClose
The previous description was largely about how `useElementShouldClose` was implemented rather than about how it was intended to be used. Rewrite it to explain the what/when rather than how and use fewer words.
1 parent f7706eb commit 17ef194

File tree

1 file changed

+11
-13
lines changed

1 file changed

+11
-13
lines changed

src/sidebar/components/hooks/use-element-should-close.js

Lines changed: 11 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -9,20 +9,18 @@ import { listen } from '../../util/dom';
99
*/
1010

1111
/**
12-
* This hook adds appropriate `eventListener`s to the document when a target
13-
* element (`closeableEl`) is open. Events such as `click` and `focus` on
14-
* elements that fall outside of `closeableEl` in the document, or keydown
15-
* events for the `esc` key, will invoke the provided `handleClose` function
16-
* to indicate that `closeableEl` should be closed. This hook also performs
17-
* cleanup to remove `eventListener`s when appropriate.
12+
* This hook provides a way to close or hide an element when a user interacts
13+
* with elements outside of it or presses the Esc key. It can be used to
14+
* create non-modal popups (eg. for menus, autocomplete lists and non-modal dialogs)
15+
* that automatically close when appropriate.
1816
*
19-
* @param {Ref<HTMLElement>} closeableEl -
20-
* Reference to a DOM element that should be closed when DOM elements external
21-
* to it are interacted with or `Esc` is pressed
22-
* @param {boolean} isOpen - Whether the element is currently open. This hook does
23-
* not attach event listeners/do anything if it's not.
24-
* @param {() => void} handleClose - A function that will do the actual closing
25-
* of `closeableEl`
17+
* When the element is visible/open, this hook monitors for document interactions
18+
* that should close it - such as clicks outside the element or Esc key presses.
19+
* When such an interaction happens, the `handleClose` callback is invoked.
20+
*
21+
* @param {Ref<HTMLElement>} closeableEl - Outer DOM element for the popup
22+
* @param {boolean} isOpen - Whether the popup is currently visible/open
23+
* @param {() => void} handleClose - Callback invoked to close the popup
2624
*/
2725
export default function useElementShouldClose(
2826
closeableEl,

0 commit comments

Comments
 (0)