import { useCallback, useEffect } from 'react';
import useIsDesktop from '../breakpoint/useIsDesktop';
const useA11yOnHover = function useA11yOnHover(hoverCallback, leaveCallback, {
  dependencies,
  mobileClickFallback
} = {}) {
  const hcb = useCallback(hoverCallback, dependencies);
  const lcb = useCallback(leaveCallback, dependencies);
  const isDesktop = useIsDesktop();
  useEffect(() => {
    lcb();
  }, [isDesktop]);
  const activate = e => {
    hcb(e);
    setTimeout(hcb(e), 100);
  };
  if (!isDesktop && mobileClickFallback) {
    return [{
      onClick: activate
    }, {
      onClickAway: () => {
        lcb();
      }
    }];
  }
  return [{
    tabIndex: 0,
    onClick: activate,
    onFocus: activate,
    onMouseEnter: hcb,
    onBlur: lcb,
    onMouseLeave: lcb
  }, {
    onClickAway: () => {
      lcb();
    }
  }];
};
export default useA11yOnHover;