Create New Item
Item Type
File
Folder
Item Name
Search file in folder and subfolders...
Are you sure want to rename?
demountable
/
wp-content
/
plugins
/
extendify
/
src
/
Agent
/
components
:
ScrollIntoViewOnce.jsx
Advanced Search
Upload
New Item
Settings
Back
Back Up
Advanced Editor
Save
import { useRef, useEffect } from 'react'; export const ScrollIntoViewOnce = ({ children, ...props }) => { const ref = useRef(null); const once = useRef(false); useEffect(() => { if (!ref.current || once.current) return; const c = ref.current; // only scroll if 50% isnt visible const rect = c.getBoundingClientRect(); const windowHeight = window.innerHeight || document.documentElement.clientHeight; const elementHeight = rect.height; const visibleTop = Math.max(rect.top, 0); const visibleBottom = Math.min(rect.bottom, windowHeight); const visibleHeight = Math.max(0, visibleBottom - visibleTop); const visibleRatio = visibleHeight / elementHeight; if (visibleRatio >= 0.5) return; c.scrollIntoView({ behavior: 'smooth', block: 'end' }); once.current = true; }, [props]); return ( <div ref={ref} {...props}> {children} </div> ); };