@helpwave/hightide/dist/hooks/useHoverState.mjs

helpwave's component and theming library

// src/hooks/useHoverState.ts
import { useEffect, useState } from "react";
var defaultUseHoverStateProps = {
  closingDelay: 200,
  isDisabled: false
};
var useHoverState = (props = void 0) => {
  const { closingDelay, isDisabled } = { ...defaultUseHoverStateProps, ...props };
  const [isHovered, setIsHovered] = useState(false);
  const [timer, setTimer] = useState();
  const onMouseEnter = () => {
    if (isDisabled) {
      return;
    }
    clearTimeout(timer);
    setIsHovered(true);
  };
  const onMouseLeave = () => {
    if (isDisabled) {
      return;
    }
    setTimer(setTimeout(() => {
      setIsHovered(false);
    }, closingDelay));
  };
  useEffect(() => {
    if (timer) {
      return () => {
        clearTimeout(timer);
      };
    }
  });
  useEffect(() => {
    if (timer) {
      clearTimeout(timer);
    }
  }, [isDisabled]);
  return {
    isHovered,
    setIsHovered,
    handlers: { onMouseEnter, onMouseLeave }
  };
};
export {
  useHoverState
};
//# sourceMappingURL=useHoverState.mjs.map