36 lines
1.1 KiB
JavaScript
36 lines
1.1 KiB
JavaScript
|
import * as React from 'react';
|
||
|
|
import { useRef } from 'react';
|
||
|
|
import { animationEndName, transitionEndName } from "../util/motion";
|
||
|
|
export default (function (onInternalMotionEnd) {
|
||
|
|
var cacheElementRef = useRef();
|
||
|
|
|
||
|
|
// Remove events
|
||
|
|
function removeMotionEvents(element) {
|
||
|
|
if (element) {
|
||
|
|
element.removeEventListener(transitionEndName, onInternalMotionEnd);
|
||
|
|
element.removeEventListener(animationEndName, onInternalMotionEnd);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// Patch events
|
||
|
|
function patchMotionEvents(element) {
|
||
|
|
if (cacheElementRef.current && cacheElementRef.current !== element) {
|
||
|
|
removeMotionEvents(cacheElementRef.current);
|
||
|
|
}
|
||
|
|
if (element && element !== cacheElementRef.current) {
|
||
|
|
element.addEventListener(transitionEndName, onInternalMotionEnd);
|
||
|
|
element.addEventListener(animationEndName, onInternalMotionEnd);
|
||
|
|
|
||
|
|
// Save as cache in case dom removed trigger by `motionDeadline`
|
||
|
|
cacheElementRef.current = element;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// Clean up when removed
|
||
|
|
React.useEffect(function () {
|
||
|
|
return function () {
|
||
|
|
removeMotionEvents(cacheElementRef.current);
|
||
|
|
};
|
||
|
|
}, []);
|
||
|
|
return [patchMotionEvents, removeMotionEvents];
|
||
|
|
});
|