JAVASCRIPT

check if content is overflowing react

import { MutableRefObject, useLayoutEffect, useState } from 'react'

const useIsOverflow = (ref: MutableRefObject<HTMLDivElement>) => {
  const [isOverflow, setIsOverflow] = useState(false)

  useLayoutEffect(() => {
    const { current } = ref

    if (current) setIsOverflow(current.scrollHeight > current.clientHeight)
  }, [ref])

  return isOverflow
}

export default useIsOverflow