How to use the @rooks/use-keys function in @rooks/use-keys

function Basic() {
  const containerRef = React.useRef(document);
  const inputRef = React.useRef(null);
  const [isEventActive, setIsEventActive] = React.useState(true);
  const [firstCallbackCallCount, setFirstCallbackCallCount] = React.useState(0);
  useKeys(
    ["ControlLeft", "KeyS"],
    () => {
      console.log("you presses ctrlLeft + s");
      setFirstCallbackCallCount(firstCallbackCallCount + 1);
    },
    {
      target: containerRef,
      when: isEventActive
    }
  );

  return (
    <div data-testid="container">
      <p data-testid="first-callback">
        Callback Run Count:
        {firstCallbackCallCount}</p></div>

function PressAndHoldSingle() {
  const [left, setLeft] = useState(0);
  useKeys(
    ["KeyD"],
    () => {
      setLeft(left + 5);
    },
    {
      continuous: true
    }
  );

  return (
    <div data-testid="container">
      <p>Press and hold d to move the div to the right</p>
      </div>

{
      continuous: true
    }
  );

  useKeys(
    ["ControlLeft", "KeyW"],
    () => {
      setTop(top - 5);
    },
    {
      continuous: true
    }
  );

  useKeys(
    ["ControlLeft", "KeyA"],
    () => {
      setLeft(left - 5);
    },
    {
      continuous: true
    }
  );
  useKeys(
    ["ControlLeft", "KeyS"],
    () => {
      setTop(top + 5);
    },
    {
      continuous: true
    }