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

helpwave's component and theming library

// src/hooks/useFocusOnceVisible.ts
import React, { useEffect } from "react";
var useFocusOnceVisible = (ref, disable = false) => {
  const [hasUsedFocus, setHasUsedFocus] = React.useState(false);
  useEffect(() => {
    if (disable || hasUsedFocus) {
      return;
    }
    const observer = new IntersectionObserver(([entry]) => {
      if (entry.isIntersecting && !hasUsedFocus) {
        ref.current?.focus();
        setHasUsedFocus(hasUsedFocus);
      }
    }, {
      threshold: 0.1
    });
    if (ref.current) {
      observer.observe(ref.current);
    }
    return () => observer.disconnect();
  }, [disable, hasUsedFocus, ref]);
};
export {
  useFocusOnceVisible
};
//# sourceMappingURL=useFocusOnceVisible.mjs.map