using the react pacakge: unbind the key when the component is unmounted

[ofirgeller]

I think the react API should maybe look like this:

import { useEffect } from "react";
import {
bindKey,
bindKeyCombo,
unbindKey,
unbindKeyCombo,
} from "@rwh/keystrokes";

export const useBindKey = (targetKey: string, handler: () => void) => {
useEffect(() => {
bindKey(targetKey, handler);

return () => {
  unbindKey(targetKey, handler);
};

}, [targetKey, handler]);
};

export const useBindKeyCombo = (targetKey: string, handler: () => void) => {
useEffect(() => {
bindKeyCombo(targetKey, handler);

return () => {
  unbindKeyCombo(targetKey, handler);
};

}, [targetKey, handler]);
};

just getting a Boolean is not as helpful and it makes sense that the binding goes away when the component dismounts.

thoughts?

[ofirgeller]

would be even better if children would shadow the bindings of their parents. so that when a menu appears it binds the escape key but when it is gone the main view captures it and does something else.