@nutui/nutui-react
Version:
京东风格的轻量级移动端 React 组件库，支持一套代码生成 H5 和小程序
89 lines (88 loc) • 3.88 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
focusEffect: function() {
return focusEffect;
},
updateTransform: function() {
return updateTransform;
},
useList: function() {
return useList;
}
});
var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
var _define_property = require("@swc/helpers/_/_define_property");
var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
var _web = require("@react-spring/web");
var _userefstate = require("../../../hooks/use-ref-state");
var _configprovider = require("../../configprovider");
var getPerSlidePosition = function getPerSlidePosition(index, position, loop, count) {
var currentPosition = index * 100 + position;
if (loop) {
var cycle = count * 100;
var shift = cycle / 2;
var nextPosition = (currentPosition + shift) % cycle;
var shiftedPosition = (nextPosition < 0 ? nextPosition + cycle : nextPosition) - shift;
return "".concat(shiftedPosition, "%");
}
return "".concat(currentPosition, "%");
};
var focusEffect = function focusEffect(args) {
return _react.default.Children.map(args.children, function(child, index) {
var rtl = (0, _configprovider.useRtl)();
var position = rtl ? 'right' : 'left';
var isVertical = args.isVertical, springs = args.springs, transforms = args.transforms, loop = args.loop, count = args.count, swiperDirection = args.swiperDirection, dragging = args.dragging, current = args.current, effect = args.effect;
var _obj;
return /*#__PURE__*/ _react.default.createElement(_web.animated.div, {
className: "nut-swiper-slide",
style: (_obj = {}, (0, _define_property._)(_obj, isVertical ? 'y' : 'x', springs[isVertical ? 'y' : 'x'].to(function(position) {
return getPerSlidePosition(index, position, loop, count);
})), (0, _define_property._)(_obj, isVertical ? 'top' : position, "-".concat(index * 100, "%")), (0, _define_property._)(_obj, "scale", springs.s.to(function(ss) {
var scales = (0, _userefstate.getRefValue)(transforms);
if (!scales) return 1;
var scale = scales[index];
var currentRefValue = (0, _userefstate.getRefValue)(current);
if (dragging === false) ss = 0;
var ps = ss * scale;
if (index === currentRefValue) {
return Math.max(scale - ps, effect.scale);
}
if (index === currentRefValue + swiperDirection.current) {
return Math.min(scale + ps, 1);
}
return scale;
})), _obj)
}, child);
});
};
var useList = function useList(effect, count, current) {
var _useRefState = (0, _sliced_to_array._)((0, _userefstate.useRefState)([]), 2), transforms = _useRefState[0], setTransforms = _useRefState[1];
(0, _react.useEffect)(function() {
setTransforms(Array.from({
length: count
}).fill(1).map(function(scale, index) {
return index !== (0, _userefstate.getRefValue)(current) ? scale * (effect ? effect.scale : 1) : scale;
}));
}, [
count
]);
return [
transforms,
setTransforms
];
};
var updateTransform = function updateTransform(transforms, setTransforms, effect, page) {
setTransforms((0, _userefstate.getRefValue)(transforms).map(function(s, index) {
return page === index ? 1 : effect ? effect.scale : 1;
}));
};