import { useClickOutside } from "@/hooks/use-click-outside"
import { useState } from "react"

function App() {
  const [isOpen, setIsOpen] = useState(false)

  const dropdownRef = useClickOutside<HTMLDivElement>(() => {
    setIsOpen(false)
  })

  return (
    <div ref={dropdownRef}>
      <button onClick={() => setIsOpen(!isOpen)}>
        Menu {isOpen ? "▼" : "▶"}
      </button>
      {isOpen && (
        <div>
          <p>Option 1</p>
          <p>Option 2</p>
          <p>Option 3</p>
        </div>
      )}
    </div>
  )
}