1 line
1.3 KiB
Plaintext
1 line
1.3 KiB
Plaintext
{"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;;"} |