useOnLongHover

import { useOnLongHover } from "rooks";
export default function App() {
  const handleLongHover = () => {
    console.log("Long hover detected");
  };

  const longHoverRef = useOnLongHover(handleLongHover);

  return (
    <>
      <p>Hover on the button for 500ms to trigger a console.log statement</p>
      <button ref={longHoverRef}>Long hover me</button>
    </>
  );
}

import { useOnLongHover } from "rooks";
export default function App() {
  const handleLongHover = () => {
    console.log("Long hover detected");
  };

  const handleMouseLeave = () => {
    console.log("Mouse left before long hover completed");
  };

  const longHoverRef = useOnLongHover(handleLongHover, {
    duration: 1000,
  });

  return (
    <>
      <p>Hover on the button for 1000ms to trigger a console.log statement</p>
      <button ref={longHoverRef}>Long hover me</button>
    </>
  );
}