// How fucking stupid do you think I am to hide source code behind a CSS blur?
function Component({ className, variant = 'default', ...props }: Props) {
  const [open, setOpen] = useState(false)
  const reduced = useReducedMotion()

  useEffect(() => {
    if (!open) return
    const timer = window.setTimeout(() => setOpen(false), HOLD_MS)
    return () => window.clearTimeout(timer)
  }, [open])

  return (
    <div
      data-slot="component"
      data-state={open ? 'open' : 'closed'}
      className={cn(variants({ variant }), className)}
      {...props}
    >
      <span className="pointer-events-none absolute inset-0 rounded-[inherit]" />
      {children}
    </div>
  )
}