motion-v
Version:
<p align="center"> <img width="100" height="100" alt="Motion logo" src="https://user-images.githubusercontent.com/7850794/164965523-3eced4c4-6020-467e-acde-f11b7900ad62.png" /> </p> <h1 align="center">Motion for Vue</h1>
34 lines (33 loc) • 935 B
JavaScript
import { watch, onMounted } from "vue";
import { createContext } from "../../utils/createContext.mjs";
const doneCallbacks = /* @__PURE__ */ new WeakMap();
function removeDoneCallback(element) {
const prevDoneCallback = doneCallbacks.get(element);
if (prevDoneCallback) {
element.removeEventListener("motioncomplete", prevDoneCallback);
}
doneCallbacks.delete(element);
}
const [injectAnimatePresence, provideAnimatePresence] = createContext("AnimatePresenceContext");
function useAnimatePresence(props) {
const presenceContext = {
initial: props.initial,
custom: props.custom
};
watch(() => props.custom, (v) => {
presenceContext.custom = v;
}, {
flush: "pre"
});
provideAnimatePresence(presenceContext);
onMounted(() => {
presenceContext.initial = void 0;
});
}
export {
doneCallbacks,
injectAnimatePresence,
provideAnimatePresence,
removeDoneCallback,
useAnimatePresence
};