sean-brydonandGitHub
c68ff54e77
* Inital Setup - refactors/optimise * Escape clears focus * A11y and optimisations * A11y enter fix * Sort out flatternt list indexing * Fix spacing - fix single selected state * Solves group highlights breaking things * Fix selecting while filtering list * Remove styles and rename story * Hide labels while searching for now * Remove group item * move onclick hook to hooks * Fix typo * Use check icon on single select * scroll into view when keyboard navigating * add comment explaining dropdown close * Remove tenery and make disabled easier to read * Typo * remove log * Remove destructing of classNames props * Refactor callbacks + hooks * Style updates with ciaran * Final style changes * center icon * Add darkmode
25 lines
664 B
TypeScript
25 lines
664 B
TypeScript
import React, { useEffect } from "react";
|
|
|
|
export default function useOnClickOutside(
|
|
ref: React.RefObject<HTMLDivElement>,
|
|
handler: (e?: MouseEvent | TouchEvent) => void
|
|
) {
|
|
useEffect(() => {
|
|
const listener = (event: MouseEvent | TouchEvent) => {
|
|
if (!ref.current || ref.current.contains(event.target as Node)) {
|
|
return;
|
|
}
|
|
|
|
handler(event);
|
|
};
|
|
|
|
document.addEventListener("mousedown", listener);
|
|
document.addEventListener("touchstart", listener);
|
|
|
|
return () => {
|
|
document.removeEventListener("mousedown", listener);
|
|
document.removeEventListener("touchstart", listener);
|
|
};
|
|
}, [ref, handler]);
|
|
}
|