3b5ed813f5
* Use a `<button>` for search * Fix search button styles to match preexisting styling * Remove additional native button properties. * Invoke search button on click or keyboard. * Reorganize search button DOM hierarchy * Restore focus to the search button when exiting the search overlay * Run prettier on Search.tsx
27 lines
802 B
TypeScript
27 lines
802 B
TypeScript
export function registerEscapeHandler(outsideContainer: HTMLElement | null, cb: () => void) {
|
|
if (!outsideContainer) return
|
|
function click(this: HTMLElement, e: HTMLElementEventMap["click"]) {
|
|
if (e.target !== this) return
|
|
e.preventDefault()
|
|
e.stopPropagation()
|
|
cb()
|
|
}
|
|
|
|
function esc(e: HTMLElementEventMap["keydown"]) {
|
|
if (!e.key.startsWith("Esc")) return
|
|
e.preventDefault()
|
|
cb()
|
|
}
|
|
|
|
outsideContainer?.addEventListener("click", click)
|
|
window.addCleanup(() => outsideContainer?.removeEventListener("click", click))
|
|
document.addEventListener("keydown", esc)
|
|
window.addCleanup(() => document.removeEventListener("keydown", esc))
|
|
}
|
|
|
|
export function removeAllChildren(node: HTMLElement) {
|
|
while (node.firstChild) {
|
|
node.removeChild(node.firstChild)
|
|
}
|
|
}
|