{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "use-scroll-direction",
  "title": "useScrollDirection",
  "description": "A hook to track the scroll direction",
  "files": [
    {
      "path": "registry/hooks/use-scroll-direction.ts",
      "content": "'use client'\n\nimport * as React from 'react'\n\nexport type ScrollDirection = 'up' | 'down' | 'left' | 'right' | null\n\nexport function useScrollDirection(ref?: React.RefObject<HTMLElement | null>, delay = 500) {\n  const [scrollDirection, setScrollDirection] = React.useState<ScrollDirection>(null)\n  const lastScrollRef = React.useRef({ y: 0, x: 0 })\n  const timeoutRef = React.useRef<ReturnType<typeof setTimeout> | null>(null)\n\n  React.useEffect(() => {\n    const element = ref ? ref.current : window\n\n    if (!element)\n      return\n\n    function handleScroll() {\n      const currentScrollY = element === window ? window.scrollY : (element as HTMLElement).scrollTop\n      const currentScrollX = element === window ? window.scrollX : (element as HTMLElement).scrollLeft\n\n      let newDirection: ScrollDirection = null\n\n      if (currentScrollY > lastScrollRef.current.y) {\n        newDirection = 'down'\n      }\n      else if (currentScrollY < lastScrollRef.current.y) {\n        newDirection = 'up'\n      }\n      else if (currentScrollX > lastScrollRef.current.x) {\n        newDirection = 'right'\n      }\n      else if (currentScrollX < lastScrollRef.current.x) {\n        newDirection = 'left'\n      }\n\n      if (newDirection !== scrollDirection) {\n        setScrollDirection(newDirection)\n      }\n\n      lastScrollRef.current = {\n        y: currentScrollY,\n        x: currentScrollX,\n      }\n\n      if (timeoutRef.current) {\n        clearTimeout(timeoutRef.current)\n      }\n\n      timeoutRef.current = setTimeout(() => {\n        setScrollDirection(null)\n      }, delay)\n    }\n\n    element.addEventListener('scroll', handleScroll)\n\n    return () => {\n      if (timeoutRef.current) {\n        clearTimeout(timeoutRef.current)\n      }\n      element.removeEventListener('scroll', handleScroll)\n    }\n  }, [scrollDirection, ref, delay])\n\n  return scrollDirection\n}\n",
      "type": "registry:hook",
      "target": "hookas/use-scroll-direction.ts"
    }
  ],
  "type": "registry:hook"
}