@yandex/ui
Version:
Yandex UI components
44 lines (43 loc) • 1.7 kB
JavaScript
import { __read } from "tslib";
import { useCallback, useEffect, useMemo, useState } from 'react';
import { SpringSystem } from 'rebound';
export var useSpring = function (targetValue, tension, friction, immediate) {
if (targetValue === void 0) { targetValue = 0; }
if (tension === void 0) { tension = 50; }
if (friction === void 0) { friction = 3; }
if (immediate === void 0) { immediate = false; }
var _a = __read(useState(null), 2), spring = _a[0], setSpring = _a[1];
var _b = __read(useState(targetValue), 2), value = _b[0], setValue = _b[1];
var listener = useMemo(function () { return ({
onSpringUpdate: function (currentSpring) {
var newValue = currentSpring.getCurrentValue();
setValue(newValue);
},
}); }, []);
var destroySpring = useCallback(function () {
if (spring) {
spring.removeListener(listener);
setSpring(null);
}
}, [spring, listener]);
useEffect(function () {
if (immediate) {
destroySpring();
}
else if (!spring) {
var newSpring = new SpringSystem().createSpring(tension, friction);
newSpring.setCurrentValue(targetValue);
setSpring(newSpring);
setValue(targetValue);
newSpring.addListener(listener);
}
return destroySpring;
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [tension, friction, immediate, spring, listener, destroySpring]);
useEffect(function () {
if (spring) {
spring.setEndValue(targetValue);
}
}, [spring, targetValue]);
return immediate ? targetValue : value;
};