@nutui/nutui-react-taro 2.0.0-alpha.7 → 2.0.0-alpha.9

package/dist/esm/swiper.taro-74cf9306.js

@@ -1,430 +0,0 @@
-import React, { useRef, useState, useMemo, useEffect } from "react";
-import classNames from "classnames";
-import { nextTick, useReady, createSelectorQuery } from "@tarojs/taro";
-import { D as DataContext } from "./UserContext-735db09f.js";
-import { c as cn } from "./bem-cdccae08.js";
-const defaultProps = {
-  width: typeof window === "object" ? window.innerWidth : 375,
-  height: 0,
-  duration: 500,
-  initPage: 0,
-  autoPlay: 0,
-  direction: "horizontal",
-  paginationColor: "#fff",
-  paginationBgColor: "#ddd",
-  paginationVisible: false,
-  loop: true,
-  touchable: true,
-  isPreventDefault: true,
-  isStopPropagation: true,
-  isCenter: false,
-  className: ""
-};
-const DISTANCE = 5;
-const Swiper = React.forwardRef((props, ref) => {
-  const propSwiper = { ...defaultProps, ...props };
-  const { children, direction, className, pageContent, onChange, initPage, paginationColor, paginationVisible, touchable, isPreventDefault, isStopPropagation, autoPlay, isCenter, ...rest } = propSwiper;
-  const container = useRef(null);
-  const innerRef = useRef(null);
-  const _swiper = useRef({
-    moving: false,
-    autoplayTimer: null,
-    width: 0,
-    height: 0,
-    offset: 0,
-    size: 0
-  });
-  const [refRandomId] = useState(Math.random().toString(36).slice(-8));
-  const isVertical = direction === "vertical";
-  const [rect, setRect] = useState(null);
-  let [active, setActive] = useState(0);
-  const [width, setWidth] = useState(0);
-  const [height, setHeight] = useState(0);
-  const [offset, setOffset] = useState(0);
-  const [childOffset, setChildOffset] = useState([]);
-  const [ready, setReady] = useState(false);
-  let size = isVertical ? height : width;
-  const [touch, setTouch] = useState({
-    startX: 0,
-    startY: 0,
-    deltaX: 0,
-    deltaY: 0,
-    offsetX: 0,
-    offsetY: 0,
-    stateDirection: "",
-    delta: 0,
-    touchTime: 0
-  });
-  const { childs, childCount } = useMemo(() => {
-    let childCount2 = 0;
-    const childs2 = React.Children.map(props.children, (child) => {
-      if (!React.isValidElement(child))
-        return null;
-      childCount2++;
-      return child;
-    });
-    return {
-      childs: childs2,
-      childCount: childCount2
-    };
-  }, [props.children]);
-  let trackSize = childCount * Number(size);
-  const parent = {
-    propSwiper,
-    size
-  };
-  const minOffset = (() => {
-    if (rect) {
-      const base = isVertical ? rect == null ? void 0 : rect.height : rect == null ? void 0 : rect.width;
-      return base - Number(size) * childCount;
-    }
-    return 0;
-  })();
-  const stopAutoPlay = () => {
-    clearTimeout(_swiper.current.autoplayTimer);
-    _swiper.current.autoplayTimer = null;
-  };
-  const autoplay = () => {
-    if (propSwiper.autoPlay <= 0 || childCount <= 1)
-      return;
-    stopAutoPlay();
-    _swiper.current.autoplayTimer = setTimeout(() => {
-      next();
-      autoplay();
-    }, Number(propSwiper.autoPlay));
-  };
-  const resettPosition = () => {
-    _swiper.current.moving = true;
-    if (active <= -1) {
-      move({ pace: childCount });
-    }
-    if (active >= childCount) {
-      move({ pace: -childCount });
-    }
-  };
-  const prev = () => {
-    resettPosition();
-    touchReset();
-    requestFrame(() => {
-      requestFrame(() => {
-        _swiper.current.moving = false;
-        move({
-          pace: -1,
-          isEmit: true
-        });
-      });
-    });
-  };
-  const next = () => {
-    resettPosition();
-    touchReset();
-    requestFrame(() => {
-      requestFrame(() => {
-        _swiper.current.moving = false;
-        move({
-          pace: 1,
-          isEmit: true
-        });
-      });
-    });
-  };
-  const to = (index) => {
-    resettPosition();
-    touchReset();
-    requestFrame(() => {
-      requestFrame(() => {
-        _swiper.current.moving = false;
-        let targetIndex;
-        if (props.loop && childCount === index) {
-          targetIndex = active === 0 ? 0 : index;
-        } else {
-          targetIndex = index % childCount;
-        }
-        move({
-          pace: targetIndex - active,
-          isEmit: true
-        });
-      });
-    });
-  };
-  const resize = () => {
-    init(active);
-  };
-  const move = ({ pace = 0, offset: offset2 = 0, isEmit = false, movingStatus = false }) => {
-    if (childCount <= 1)
-      return;
-    const targetActive = getActive(pace);
-    const targetOffset = getOffset(targetActive, offset2);
-    if (props.loop) {
-      if (Array.isArray(children) && children[0] && targetOffset !== minOffset) {
-        const rightBound = targetOffset < minOffset;
-        childOffset[0] = rightBound ? trackSize : 0;
-      }
-      if (Array.isArray(children) && children[childCount - 1] && targetOffset !== 0) {
-        const leftBound = targetOffset > 0;
-        childOffset[childCount - 1] = leftBound ? -trackSize : 0;
-      }
-      setChildOffset(childOffset);
-    }
-    if (isEmit && active !== targetActive) {
-      props.onChange && props.onChange((targetActive + childCount) % childCount);
-    }
-    active = targetActive;
-    setActive(targetActive);
-    setOffset(targetOffset);
-    getStyle(targetOffset);
-  };
-  const getActive = (pace) => {
-    if (pace) {
-      const _active = active + pace;
-      if (props.loop) {
-        return range(_active, -1, childCount);
-      }
-      return range(_active, 0, childCount - 1);
-    }
-    return active;
-  };
-  const getOffset = (active2, offset2 = 0) => {
-    let currentPosition = active2 * Number(size);
-    if (!props.loop) {
-      currentPosition = Math.min(currentPosition, -minOffset);
-    }
-    let targetOffset = offset2 - currentPosition;
-    if (!props.loop) {
-      targetOffset = range(targetOffset, minOffset, 0);
-    }
-    return targetOffset;
-  };
-  const requestFrame = (fn) => {
-    window.requestAnimationFrame.call(window, fn);
-  };
-  const range = (num, min, max) => {
-    return Math.min(Math.max(num, min), max);
-  };
-  const getDirection = (x, y) => {
-    if (x > y && x > DISTANCE)
-      return "horizontal";
-    if (y > x && y > DISTANCE)
-      return "vertical";
-    return "";
-  };
-  const touchReset = () => {
-    touch.startX = 0;
-    touch.startY = 0;
-    touch.deltaX = 0;
-    touch.deltaY = 0;
-    touch.offsetX = 0;
-    touch.offsetY = 0;
-    touch.delta = 0;
-    touch.stateDirection = "";
-    touch.touchTime = 0;
-  };
-  const touchStart = (e) => {
-    touchReset();
-    touch.startX = e.touches[0].clientX;
-    touch.startY = e.touches[0].clientY;
-  };
-  const touchMove = (e) => {
-    touch.deltaX = e.touches[0].clientX - touch.startX;
-    touch.deltaY = e.touches[0].clientY - touch.startY;
-    touch.offsetX = Math.abs(touch.deltaX);
-    touch.offsetY = Math.abs(touch.deltaY);
-    touch.delta = isVertical ? touch.deltaY : touch.deltaX;
-    if (!touch.stateDirection) {
-      touch.stateDirection = getDirection(touch.offsetX, touch.offsetY);
-    }
-  };
-  const b = cn("swiper");
-  const classes = classNames(b(""));
-  const contentClass = classNames({
-    [`${b("inner")}`]: true,
-    [`${b("vertical")}`]: isVertical
-  });
-  const getStyle = (moveOffset = offset) => {
-    const target = innerRef.current;
-    let _offset = 0;
-    if (!isCenter) {
-      _offset = moveOffset;
-    } else {
-      const _size = isVertical ? height : width;
-      const val = isVertical ? (rect == null ? void 0 : rect.height) - _size : (rect == null ? void 0 : rect.width) - _size;
-      _offset = moveOffset + (active === childCount - 1 && !props.loop ? -val / 2 : val / 2);
-    }
-    target.style.transitionDuration = `${_swiper.current.moving ? 0 : props.duration}ms`;
-    target.style[isVertical ? "height" : "width"] = `${Number(size) * childCount}px`;
-    target.style[isVertical ? "width" : "height"] = `${isVertical ? width : height}px`;
-    target.style.transform = `translate3D${!isVertical ? `(${_offset}px,0,0)` : `(0,${_offset}px,0)`}`;
-  };
-  const onTouchStart = (e) => {
-    if (props.isPreventDefault)
-      e.preventDefault();
-    if (props.isStopPropagation)
-      e.stopPropagation();
-    if (!props.touchable)
-      return;
-    touchStart(e);
-    touch.touchTime = Date.now();
-    stopAutoPlay();
-    resettPosition();
-  };
-  const onTouchMove = (e) => {
-    if (props.touchable && _swiper.current.moving) {
-      touchMove(e);
-      if (touch.stateDirection === props.direction) {
-        move({
-          offset: touch.delta
-        });
-      }
-    }
-  };
-  const onTouchEnd = (e) => {
-    if (!props.touchable || !_swiper.current.moving)
-      return;
-    const speed = touch.delta / (Date.now() - touch.touchTime);
-    const isShouldMove = Math.abs(speed) > 0.3 || Math.abs(touch.delta) > +(size / 2).toFixed(2);
-    let pace = 0;
-    _swiper.current.moving = false;
-    if (isShouldMove && touch.stateDirection === props.direction) {
-      const offset2 = isVertical ? touch.offsetY : touch.offsetX;
-      if (props.loop) {
-        if (offset2 > 0) {
-          pace = touch.delta > 0 ? -1 : 1;
-        } else {
-          pace = 0;
-        }
-      } else {
-        pace = -Math[touch.delta > 0 ? "ceil" : "floor"](touch.delta / size);
-      }
-      move({
-        pace,
-        isEmit: true
-      });
-    } else if (touch.delta) {
-      move({ pace: 0 });
-    } else {
-      getStyle();
-    }
-    autoplay();
-  };
-  useEffect(() => {
-    _swiper.current.activePagination = (active + childCount) % childCount;
-  }, [active]);
-  const queryRect = (element) => {
-    return new Promise((resolve) => {
-      const query = createSelectorQuery();
-      query.select(`#${element.id}`) && query.select(`#${element.id}`).boundingClientRect();
-      query.exec((res) => {
-        resolve(res[0]);
-      });
-    });
-  };
-  const init = async (active2 = +propSwiper.initPage) => {
-    const rect2 = await queryRect(container.current);
-    const _active = Math.max(Math.min(childCount - 1, active2), 0);
-    const _width = propSwiper.width ? +propSwiper.width : rect2 == null ? void 0 : rect2.width;
-    const _height = propSwiper.height ? +propSwiper.height : rect2 == null ? void 0 : rect2.height;
-    size = isVertical ? _height : _width;
-    trackSize = childCount * Number(size);
-    const targetOffset = getOffset(_active);
-    _swiper.current.moving = true;
-    if (ready) {
-      _swiper.current.moving = false;
-    }
-    setRect(rect2);
-    setActive(_active);
-    setWidth(_width);
-    setHeight(_height);
-    setOffset(targetOffset);
-    setReady(true);
-  };
-  useEffect(() => {
-    if (ready) {
-      getStyle();
-    }
-  }, [isVertical, width, height, offset, ready]);
-  useEffect(() => {
-    if (ready) {
-      stopAutoPlay();
-      autoplay();
-    }
-    return () => {
-      setReady(false);
-    };
-  }, [ready]);
-  useEffect(() => {
-    stopAutoPlay();
-    autoplay();
-  }, [children]);
-  useEffect(() => {
-    nextTick(() => {
-      init();
-    });
-  }, [propSwiper.initPage]);
-  useEffect(() => {
-    return () => {
-      stopAutoPlay();
-    };
-  }, []);
-  useReady(() => {
-    nextTick(() => {
-      init();
-    });
-  });
-  const itemStyle = (index) => {
-    const style = {};
-    const _direction = propSwiper.direction || direction;
-    const _size = size;
-    if (_size) {
-      style[_direction === "horizontal" ? "width" : "height"] = `${_size}px`;
-    }
-    const offset2 = childOffset[index];
-    if (offset2) {
-      style.transform = `translate3D${_direction === "horizontal" ? `(${offset2}px,0,0)` : `(0,${offset2}px,0)`}`;
-    }
-    return style;
-  };
-  React.useImperativeHandle(ref, () => ({
-    to,
-    next,
-    prev,
-    resize
-  }));
-  return React.createElement(
-    DataContext.Provider,
-    { value: parent },
-    React.createElement(
-      "div",
-      {
-        className: `${classes} ${className}`,
-        ref: container,
-        ...rest,
-        id: `container-${refRandomId}`,
-        onTouchStart,
-        onTouchMove,
-        onTouchEnd,
-        // @ts-ignore
-        catchMove: isVertical
-      },
-      React.createElement("div", { className: contentClass, ref: innerRef }, React.Children.map(childs, (child, index) => {
-        return React.createElement("div", { className: b("item-wrapper"), style: itemStyle(index), key: index }, child);
-      })),
-      propSwiper.paginationVisible && !("pageContent" in propSwiper) ? React.createElement("div", { className: classNames({
-        [`${b("pagination")}`]: true,
-        [`${b("pagination-vertical")}`]: isVertical
-      }) }, React.Children.map(childs, (item, index) => {
-        return React.createElement("i", { style: (active + childCount) % childCount === index ? {
-          backgroundColor: propSwiper.paginationColor
-        } : {
-          backgroundColor: propSwiper.paginationBgColor
-        }, className: classNames({
-          active: (active + childCount) % childCount === index
-        }), key: index });
-      })) : React.createElement("div", null, pageContent)
-    )
-  );
-});
-Swiper.defaultProps = defaultProps;
-Swiper.displayName = "NutSwiper";
-export {
-  Swiper as S
-};

package/dist/esm/swiperitem-80df464a.js

@@ -1,29 +0,0 @@
-import React, { useContext } from "react";
-import classNames from "classnames";
-import { D as DataContext } from "./UserContext-735db09f.js";
-import { c as cn } from "./bem-cdccae08.js";
-const defaultProps = {
-  direction: "horizontal"
-};
-const SwiperItem = React.forwardRef((props, ref) => {
-  const _props = { ...defaultProps, ...props };
-  const { className, style, children, direction, size } = _props;
-  const parent = useContext(DataContext);
-  const b = cn("swiper-item");
-  const classes = classNames(b(""), className);
-  const getStyle = () => {
-    const style2 = {};
-    const _direction = (parent == null ? void 0 : parent.propSwiper.direction) || direction;
-    const _size = (parent == null ? void 0 : parent.size) || size;
-    if (_size) {
-      style2[_direction === "horizontal" ? "width" : "height"] = `${_size}px`;
-    }
-    return style2;
-  };
-  return React.createElement("div", { className: classes, style: { ...style, ...getStyle() } }, children);
-});
-SwiperItem.defaultProps = defaultProps;
-SwiperItem.displayName = "NutSwiperItem";
-export {
-  SwiperItem as S
-};