@wix/design-system
Version:
@wix/design-system
51 lines (50 loc) • 1.37 kB
JavaScript
;
exports.__esModule = true;
exports.useStackShift = void 0;
var _react = require("react");
var useStackShift = _ref => {
var itemKeys = _ref.itemKeys,
itemRefs = _ref.itemRefs,
enabled = _ref.enabled,
duration = _ref.duration,
easing = _ref.easing;
var offsets = (0, _react.useRef)(new Map());
(0, _react.useLayoutEffect)(() => {
var shifts = [];
itemRefs.current.forEach((ref, key) => {
var node = ref.current;
if (!node) {
itemRefs.current.delete(key);
offsets.current.delete(key);
return;
}
var previous = offsets.current.get(key);
var current = node.offsetTop;
offsets.current.set(key, current);
if (previous === undefined || !enabled || typeof node.animate !== 'function') {
return;
}
var deltaY = previous - current;
if (deltaY) {
shifts.push({
node,
deltaY
});
}
});
shifts.forEach(_ref2 => {
var node = _ref2.node,
deltaY = _ref2.deltaY;
node.animate([{
transform: "translateY(".concat(deltaY, "px)")
}, {
transform: 'translateY(0)'
}], {
duration,
easing
});
});
}, [itemKeys, itemRefs, enabled, duration, easing]);
};
exports.useStackShift = useStackShift;
//# sourceMappingURL=useStackShift.js.map