first commit
This commit is contained in:
6
node_modules/framer-motion/dist/es/events/add-dom-event.mjs
generated
vendored
Normal file
6
node_modules/framer-motion/dist/es/events/add-dom-event.mjs
generated
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
function addDomEvent(target, eventName, handler, options = { passive: true }) {
|
||||
target.addEventListener(eventName, handler, options);
|
||||
return () => target.removeEventListener(eventName, handler);
|
||||
}
|
||||
|
||||
export { addDomEvent };
|
||||
8
node_modules/framer-motion/dist/es/events/add-pointer-event.mjs
generated
vendored
Normal file
8
node_modules/framer-motion/dist/es/events/add-pointer-event.mjs
generated
vendored
Normal file
@@ -0,0 +1,8 @@
|
||||
import { addDomEvent } from './add-dom-event.mjs';
|
||||
import { addPointerInfo } from './event-info.mjs';
|
||||
|
||||
function addPointerEvent(target, eventName, handler, options) {
|
||||
return addDomEvent(target, eventName, addPointerInfo(handler), options);
|
||||
}
|
||||
|
||||
export { addPointerEvent };
|
||||
15
node_modules/framer-motion/dist/es/events/event-info.mjs
generated
vendored
Normal file
15
node_modules/framer-motion/dist/es/events/event-info.mjs
generated
vendored
Normal file
@@ -0,0 +1,15 @@
|
||||
import { isPrimaryPointer } from 'motion-dom';
|
||||
|
||||
function extractEventInfo(event) {
|
||||
return {
|
||||
point: {
|
||||
x: event.pageX,
|
||||
y: event.pageY,
|
||||
},
|
||||
};
|
||||
}
|
||||
const addPointerInfo = (handler) => {
|
||||
return (event) => isPrimaryPointer(event) && handler(event, extractEventInfo(event));
|
||||
};
|
||||
|
||||
export { addPointerInfo, extractEventInfo };
|
||||
35
node_modules/framer-motion/dist/es/events/use-dom-event.mjs
generated
vendored
Normal file
35
node_modules/framer-motion/dist/es/events/use-dom-event.mjs
generated
vendored
Normal file
@@ -0,0 +1,35 @@
|
||||
"use client";
|
||||
import { useEffect } from 'react';
|
||||
import { addDomEvent } from './add-dom-event.mjs';
|
||||
|
||||
/**
|
||||
* Attaches an event listener directly to the provided DOM element.
|
||||
*
|
||||
* Bypassing React's event system can be desirable, for instance when attaching non-passive
|
||||
* event handlers.
|
||||
*
|
||||
* ```jsx
|
||||
* const ref = useRef(null)
|
||||
*
|
||||
* useDomEvent(ref, 'wheel', onWheel, { passive: false })
|
||||
*
|
||||
* return <div ref={ref} />
|
||||
* ```
|
||||
*
|
||||
* @param ref - React.RefObject that's been provided to the element you want to bind the listener to.
|
||||
* @param eventName - Name of the event you want listen for.
|
||||
* @param handler - Function to fire when receiving the event.
|
||||
* @param options - Options to pass to `Event.addEventListener`.
|
||||
*
|
||||
* @public
|
||||
*/
|
||||
function useDomEvent(ref, eventName, handler, options) {
|
||||
useEffect(() => {
|
||||
const element = ref.current;
|
||||
if (handler && element) {
|
||||
return addDomEvent(element, eventName, handler, options);
|
||||
}
|
||||
}, [ref, eventName, handler, options]);
|
||||
}
|
||||
|
||||
export { useDomEvent };
|
||||
Reference in New Issue
Block a user