{"version":3,"file":"use-dom-event.mjs","sources":["../../../src/events/use-dom-event.ts"],"sourcesContent":["\"use client\"\n\nimport { RefObject, useEffect } from \"react\"\nimport { addDomEvent } from \"motion-dom\"\n\n/**\n * Attaches an event listener directly to the provided DOM element.\n *\n * Bypassing React's event system can be desirable, for instance when attaching non-passive\n * event handlers.\n *\n * ```jsx\n * const ref = useRef(null)\n *\n * useDomEvent(ref, 'wheel', onWheel, { passive: false })\n *\n * return <div ref={ref} />\n * ```\n *\n * @param ref - React.RefObject that's been provided to the element you want to bind the listener to.\n * @param eventName - Name of the event you want listen for.\n * @param handler - Function to fire when receiving the event.\n * @param options - Options to pass to `Event.addEventListener`.\n *\n * @public\n */\nexport function useDomEvent(\n    ref: RefObject<EventTarget | null>,\n    eventName: string,\n    handler?: EventListener | undefined,\n    options?: AddEventListenerOptions\n) {\n    useEffect(() => {\n        const element = ref.current\n\n        if (handler && element) {\n            return addDomEvent(element, eventName, handler, options)\n        }\n    }, [ref, eventName, handler, options])\n}\n"],"names":[],"mappings":";;;;AAKA;;;;;;;;;;;;;;;;;;;;AAoBG;AACG;;AAOE;AAEA;;;;AAIR;;"}