@nutui/nutui-react 1.5.2-beta.0 → 1.5.2-beta.2

package/dist/esm/Image.js

@@ -0,0 +1,170 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React__default, { useState, useEffect, useRef } from 'react';
+import { useConfig } from './ConfigProvider.js';
+import Icon from './Icon.js';
+var defaultProps = {
+  fit: 'fill',
+  position: 'center',
+  alt: '',
+  width: 'center',
+  height: '',
+  round: false,
+  showError: true,
+  showLoading: true,
+  isLazy: false
+};
+var Image = function Image(props) {
+  useConfig();
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+    children = _defaultProps$props.children,
+    className = _defaultProps$props.className,
+    style = _defaultProps$props.style,
+    src = _defaultProps$props.src,
+    fit = _defaultProps$props.fit,
+    position = _defaultProps$props.position,
+    alt = _defaultProps$props.alt,
+    width = _defaultProps$props.width,
+    height = _defaultProps$props.height,
+    round = _defaultProps$props.round,
+    radius = _defaultProps$props.radius,
+    showError = _defaultProps$props.showError,
+    showLoading = _defaultProps$props.showLoading,
+    slotError = _defaultProps$props.slotError,
+    slotLoding = _defaultProps$props.slotLoding,
+    isLazy = _defaultProps$props.isLazy,
+    loadingImg = _defaultProps$props.loadingImg,
+    errorImg = _defaultProps$props.errorImg,
+    onClick = _defaultProps$props.onClick,
+    onLoad = _defaultProps$props.onLoad,
+    onError = _defaultProps$props.onError;
+  var _useState = useState(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    loading = _useState2[0],
+    setLoading = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isError = _useState4[0],
+    setIsError = _useState4[1];
+  var _useState5 = useState(''),
+    _useState6 = _slicedToArray(_useState5, 2),
+    _src = _useState6[0],
+    setSrc = _useState6[1];
+  useEffect(function () {
+    if (src) {
+      setSrc(src);
+      setIsError(false);
+      setLoading(true);
+    }
+  }, [src]);
+  // 图片加载
+  var load = function load() {
+    setLoading(false);
+    onLoad && onLoad();
+  };
+  // 图片加载失败
+  var error = function error() {
+    setIsError(true);
+    setLoading(false);
+    onError && onError();
+  };
+  var pxCheck = function pxCheck(value) {
+    return Number.isNaN(Number(value)) ? String(value) : "".concat(value, "px");
+  };
+  var stylebox = {
+    height: height ? pxCheck(height) : '',
+    width: width ? pxCheck(width) : '',
+    overflow: radius !== undefined && radius !== null ? 'hidden' : '',
+    borderRadius: radius !== undefined && radius !== null ? pxCheck(radius) : ''
+  };
+  var styles = _objectSpread({
+    objectFit: fit,
+    objectPosition: position
+  }, style);
+  // 图片懒加载
+  var observer = useRef(null);
+  var initObserver = function initObserver() {
+    var imgs = document.querySelectorAll('.nut-img.lazyload');
+    var options = {
+      threshold: [0],
+      rootMargin: '0px' // 对视口进行收缩和扩张
+    };
+    // 监听dom是否在视口内
+    observer.current = new IntersectionObserver(function (entires, self) {
+      // entires为监听的节点数组对象
+      entires.forEach(function (item) {
+        // isIntersecting是当前监听元素交叉区域是否在可视区域指定的阈值内返回的是一个布尔值
+        if (item.isIntersecting) {
+          setTimeout(function () {
+            var img = item.target;
+            if (img.dataset.src) {
+              img.src = img.dataset.src;
+              img.removeAttribute('data-src');
+            }
+            // 资源加载后停止监听
+            observer.current.unobserve(item.target);
+          }, 300);
+        }
+      });
+    }, options);
+    imgs.forEach(function (item) {
+      observer.current.observe(item);
+    });
+  };
+  // 使用disconnect将取消的Observer实例中的所有监听
+  var resetObserver = function resetObserver() {
+    observer.current.disconnect && observer.current.disconnect();
+  };
+  useEffect(function () {
+    isLazy && initObserver();
+    return function () {
+      isLazy && resetObserver();
+    };
+  }, [isLazy]);
+  var loadingBg = {
+    backgroundImage: loadingImg ? "url('".concat(loadingImg, "')") : ''
+  };
+  var errorBg = {
+    backgroundImage: errorImg ? "url('".concat(errorImg, "')") : ''
+  };
+  var imageClick = function imageClick(event) {
+    onClick && onClick(event);
+  };
+  return React__default.createElement("div", {
+    className: "nut-image ".concat(round ? 'nut-image-round' : '', " ").concat(className || ''),
+    style: stylebox,
+    onClick: function onClick(e) {
+      imageClick(e);
+    }
+  }, isLazy ? React__default.createElement("img", {
+    className: "nut-img lazyload",
+    style: styles,
+    "data-src": _src,
+    alt: alt,
+    loading: "lazy",
+    onLoad: load,
+    onError: error
+  }) : React__default.createElement("img", {
+    className: "nut-img",
+    style: styles,
+    src: _src,
+    alt: alt,
+    onLoad: load,
+    onError: error
+  }), loading && showLoading ? React__default.createElement("div", {
+    className: "nut-img-loading",
+    style: loadingBg
+  }, !loadingImg && (slotLoding || children || React__default.createElement(Icon, {
+    name: "image"
+  }))) : null, isError && showError && !loading ? React__default.createElement("div", {
+    className: "nut-img-error",
+    style: errorBg
+  }, !errorImg && (slotError || children || React__default.createElement(Icon, {
+    name: "image-error"
+  }))) : null);
+};
+Image.defaultProps = defaultProps;
+Image.displayName = 'NutImage';
+export { Image as default };

package/dist/esm/ImagePreview/style/index.js

@@ -0,0 +1,4 @@
+import '../../Popup/style'
+import '../../Swiper/style'
+import '../../Video/style'
+import '../../../packages/imagepreview/imagepreview.scss'

package/dist/esm/ImagePreview.js

@@ -0,0 +1,226 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React__default, { useRef, useState, useEffect } from 'react';
+import Popup from './Popup.js';
+import Video from './Video.js';
+import Swiper from './Swiper.js';
+import SwiperItem from './SwiperItem.js';
+var defaultProps = {
+  images: [],
+  videos: [],
+  show: false,
+  autoplay: 3000,
+  initNo: 1,
+  contentClose: false,
+  paginationVisible: false,
+  paginationColor: '#fff',
+  onClose: function onClose() {}
+};
+var ImagePreview = function ImagePreview(props) {
+  var images = props.images,
+    videos = props.videos,
+    show = props.show,
+    initNo = props.initNo,
+    paginationColor = props.paginationColor,
+    paginationVisible = props.paginationVisible,
+    autoplay = props.autoplay,
+    contentClose = props.contentClose,
+    onClose = props.onClose;
+  var nutImagePreview = useRef(null);
+  var _useState = useState(initNo),
+    _useState2 = _slicedToArray(_useState, 2),
+    innerNo = _useState2[0],
+    setInnerNo = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    showPop = _useState4[0],
+    setShowPop = _useState4[1];
+  var _useState5 = useState(1),
+    _useState6 = _slicedToArray(_useState5, 2),
+    active = _useState6[0],
+    setActive = _useState6[1];
+  var _useState7 = useState(1),
+    _useState8 = _slicedToArray(_useState7, 2),
+    maxNo = _useState8[0],
+    setMaxNo = _useState8[1];
+  var _useState9 = useState({
+      scale: 1,
+      moveable: false
+    }),
+    _useState10 = _slicedToArray(_useState9, 2),
+    store = _useState10[0],
+    setStore = _useState10[1];
+  var _useState11 = useState(0),
+    _useState12 = _slicedToArray(_useState11, 2),
+    lastTouchEndTime = _useState12[0],
+    setLastTouchEndTime = _useState12[1]; // 用来辅助监听双击
+  var onTouchStart = function onTouchStart(event) {
+    var touches = event.touches;
+    var events = touches[0];
+    var events2 = touches[1];
+    // 如果已经放大，双击应变回原尺寸；如果是原尺寸，双击应放大
+    var curTouchTime = new Date().getTime();
+    if (curTouchTime - lastTouchEndTime < 300) {
+      var _store = store;
+      if (_store.scale > 1) {
+        _store.scale = 1;
+      } else if (_store.scale === 1) {
+        _store.scale = 2;
+      }
+      scaleNow();
+    }
+    var store1 = store;
+    store1.moveable = true;
+    if (events2) {
+      // 如果开始两指操作，记录初始时刻两指间的距离
+      store1.oriDistance = getDistance({
+        x: events.pageX,
+        y: events.pageY
+      }, {
+        x: events2.pageX,
+        y: events2.pageY
+      });
+    }
+    // 取到开始两指操作时的放大（缩小比例），store.scale 存储的是当前的放缩比（相对于标准大小 scale 为 1 的情况的放大缩小比）
+    store1.originScale = store1.scale || 1;
+  };
+  var onTouchMove = function onTouchMove(event) {
+    var touches = event.touches;
+    var events = touches[0];
+    var events2 = touches[1];
+    if (!store.moveable) {
+      return;
+    }
+    var store1 = store;
+    // 双指移动
+    if (events2) {
+      // 获得当前两点间的距离
+      var curDistance = getDistance({
+        x: events.pageX,
+        y: events.pageY
+      }, {
+        x: events2.pageX,
+        y: events2.pageY
+      });
+      /** 此处计算倍数，距离放大（缩小） k 倍则 scale 也 扩大（缩小） k 倍。距离放大（缩小）倍数 = 结束时两点距离 除以 开始时两点距离
+       * 注意此处的 scale 变化是基于 store.scale 的。
+       * store.scale 是一个暂存值，比如第一次放大 2 倍，则 store.scale 为 2。
+       * 再次两指触碰的时候，store.originScale 就为 store.scale 的值，基于此时的 store.scale 继续放大缩小。 * */
+      var curScale = curDistance / store1.oriDistance;
+      store1.scale = store1.originScale * curScale;
+      // 最大放大 3 倍，缩小后松手要弹回原比例
+      if (store1.scale > 3) {
+        store1.scale = 3;
+      }
+      scaleNow();
+    }
+  };
+  var onTouchEnd = function onTouchEnd() {
+    setLastTouchEndTime(new Date().getTime());
+    var store1 = store;
+    store1.moveable = false;
+    if (store1.scale < 1.1 && store1.scale > 1 || store1.scale < 1) {
+      store1.scale = 1;
+      scaleNow();
+    }
+  };
+  var init = function init() {
+    document.addEventListener('touchmove', onTouchMove);
+    document.addEventListener('touchend', onTouchEnd);
+    document.addEventListener('touchcancel', onTouchEnd);
+  };
+  useEffect(function () {
+    setShowPop(show);
+    setInnerNo(initNo);
+    setActive(initNo);
+    init();
+  }, [show, initNo]);
+  useEffect(function () {
+    if (innerNo !== undefined) {
+      setActive(innerNo);
+    }
+    if (show !== undefined) {
+      setShowPop(show);
+    }
+    if (images && videos) {
+      setMaxNo(images.length + videos.length);
+    }
+  }, []);
+  var scaleNow = function scaleNow() {
+    if (nutImagePreview.current) {
+      nutImagePreview.current.style.transform = "scale(".concat(store.scale, ")");
+    }
+  };
+  var onCloseInner = function onCloseInner() {
+    setShowPop(false);
+    setActive(1);
+    scaleNow();
+    onClose && onClose();
+    setStore(_objectSpread(_objectSpread({}, store), {}, {
+      scale: 1
+    }));
+  };
+  // 计算两个点的距离
+  var getDistance = function getDistance(first, second) {
+    // 计算两个点起始时刻的距离和终止时刻的距离，终止时刻距离变大了则放大，变小了则缩小
+    // 放大 k 倍则 scale 也 扩大 k 倍
+    return Math.hypot(Math.abs(second.x - first.x), Math.abs(second.y - first.y));
+  };
+  var slideChangeEnd = function slideChangeEnd(page) {
+    setActive(page + 1);
+  };
+  var closeOnImg = function closeOnImg() {
+    // 点击内容区域的图片是否可以关闭弹层（视频区域由于nut-video做了限制，无法关闭弹层）
+    if (contentClose) {
+      onCloseInner();
+    }
+  };
+  return React__default.createElement(Popup, {
+    visible: showPop,
+    popClass: "custom-pop",
+    style: {
+      width: '100%'
+    },
+    onClick: onCloseInner
+  }, React__default.createElement("div", {
+    className: "nut-imagepreview",
+    ref: nutImagePreview,
+    onClick: closeOnImg,
+    onTouchStart: onTouchStart
+  }, React__default.createElement(Swiper, {
+    autoPlay: autoplay,
+    className: "nut-imagepreview-swiper",
+    loop: true,
+    isPreventDefault: false,
+    style: {
+      display: showPop ? 'block' : 'none'
+    },
+    direction: "horizontal",
+    onChange: slideChangeEnd,
+    initPage: innerNo && (innerNo > maxNo ? maxNo - 1 : innerNo - 1),
+    paginationColor: paginationColor,
+    paginationVisible: paginationVisible
+  }, (videos && videos.length > 0 ? videos.map(function (item, index) {
+    return React__default.createElement(SwiperItem, {
+      key: index
+    }, React__default.createElement(Video, {
+      source: item.source,
+      options: item.options
+    }));
+  }) : []).concat(images && images.length > 0 ? images.map(function (item, index) {
+    return React__default.createElement(SwiperItem, {
+      key: index
+    }, React__default.createElement("img", {
+      src: item.src,
+      alt: "",
+      className: "nut-imagepreview-img"
+    }));
+  }) : []))), React__default.createElement("div", {
+    className: "nut-imagepreview-index"
+  }, active, "/", (images ? images.length : 0) + (videos ? videos.length : 0)));
+};
+ImagePreview.defaultProps = defaultProps;
+ImagePreview.displayName = 'NutImagePreview';
+export { ImagePreview as default };

package/dist/esm/Indicator/style/index.js

@@ -0,0 +1,2 @@
+
+import '../../../packages/indicator/indicator.scss'

package/dist/esm/Indicator.js

@@ -0,0 +1,52 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["size", "current", "block", "align", "fillZero", "children", "className", "vertical"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React__default, { useEffect } from 'react';
+import classNames from 'classnames';
+import { c as cn } from './bem-3b438e61.js';
+import '@bem-react/classname';
+var defaultProps = {
+  size: 3,
+  current: 1,
+  block: false,
+  align: 'center',
+  fillZero: true,
+  vertical: false
+};
+var Indicator = function Indicator(props) {
+  var _classNames;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+    size = _defaultProps$props.size,
+    current = _defaultProps$props.current,
+    block = _defaultProps$props.block,
+    align = _defaultProps$props.align,
+    fillZero = _defaultProps$props.fillZero,
+    children = _defaultProps$props.children,
+    className = _defaultProps$props.className,
+    vertical = _defaultProps$props.vertical,
+    rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var b = cn('indicator');
+  var classes = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(b('block')), block), _defineProperty(_classNames, "".concat(b('align'), "__").concat(align), block && align), _defineProperty(_classNames, "".concat(b('vertical')), vertical), _classNames), b(''));
+  var renderEles = function renderEles() {
+    var childs = [];
+    for (var item = 1; item <= size; item++) {
+      childs.push(item === current ? React__default.createElement("div", {
+        key: item,
+        className: b('number')
+      }, fillZero && item < 10 ? "0".concat(item) : item) : React__default.createElement("div", {
+        key: item,
+        className: b('dot')
+      }));
+    }
+    return childs;
+  };
+  useEffect(function () {}, []);
+  return React__default.createElement("div", _objectSpread({
+    className: classNames(classes, className)
+  }, rest), renderEles());
+};
+Indicator.defaultProps = defaultProps;
+Indicator.displayName = 'NutIndicator';
+export { Indicator as default };

package/dist/esm/Infiniteloading/style/index.js

@@ -0,0 +1,2 @@
+import '../../Icon/style'
+import '../../../packages/infiniteloading/infiniteloading.scss'

package/dist/esm/Infiniteloading.js

@@ -0,0 +1,217 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["children", "hasMore", "threshold", "containerId", "useWindow", "useCapture", "isOpenRefresh", "pullIcon", "pullTxt", "loadIcon", "loadTxt", "loadMoreTxt", "className", "onRefresh", "onLoadMore", "onScrollChange", "iconClassPrefix", "iconFontClassName"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React__default, { useState, useRef, useEffect } from 'react';
+import classNames from 'classnames';
+import { c as cn } from './bem-3b438e61.js';
+import Icon from './Icon.js';
+import { useConfig } from './ConfigProvider.js';
+import { C as ComponentDefaults } from './typings-f27b58f4.js';
+import '@bem-react/classname';
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
+  hasMore: true,
+  threshold: 200,
+  containerId: '',
+  useWindow: true,
+  useCapture: false,
+  isOpenRefresh: false,
+  pullIcon: 'https://img10.360buyimg.com/imagetools/jfs/t1/169863/6/4565/6306/60125948E7e92774e/40b3a0cf42852bcb.png',
+  pullTxt: '松开刷新',
+  loadIcon: 'https://img10.360buyimg.com/imagetools/jfs/t1/169863/6/4565/6306/60125948E7e92774e/40b3a0cf42852bcb.png',
+  loadTxt: '加载中···',
+  loadMoreTxt: '哎呀，这里是底部了啦'
+});
+var Infiniteloading = function Infiniteloading(props) {
+  var _useConfig = useConfig(),
+    locale = _useConfig.locale;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+    children = _defaultProps$props.children,
+    hasMore = _defaultProps$props.hasMore,
+    threshold = _defaultProps$props.threshold,
+    containerId = _defaultProps$props.containerId,
+    useWindow = _defaultProps$props.useWindow,
+    useCapture = _defaultProps$props.useCapture,
+    isOpenRefresh = _defaultProps$props.isOpenRefresh,
+    pullIcon = _defaultProps$props.pullIcon,
+    pullTxt = _defaultProps$props.pullTxt,
+    loadIcon = _defaultProps$props.loadIcon,
+    loadTxt = _defaultProps$props.loadTxt,
+    loadMoreTxt = _defaultProps$props.loadMoreTxt,
+    className = _defaultProps$props.className,
+    onRefresh = _defaultProps$props.onRefresh,
+    onLoadMore = _defaultProps$props.onLoadMore,
+    onScrollChange = _defaultProps$props.onScrollChange,
+    iconClassPrefix = _defaultProps$props.iconClassPrefix,
+    iconFontClassName = _defaultProps$props.iconFontClassName,
+    restProps = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isInfiniting = _useState2[0],
+    setIsInfiniting = _useState2[1];
+  var scroller = useRef(null);
+  var refreshTop = useRef(null);
+  var scrollEl = useRef(window);
+  var isTouching = useRef(false);
+  var beforeScrollTop = useRef(0);
+  var refreshMaxH = useRef(0);
+  var y = useRef(0);
+  var distance = useRef(0);
+  var b = cn('infiniteloading');
+  var classes = classNames(className, b());
+  useEffect(function () {
+    var parentElement = getParentElement(scroller.current);
+    scrollEl.current = useWindow ? window : parentElement;
+    scrollEl.current.addEventListener('scroll', handleScroll, useCapture);
+    return function () {
+      scrollEl.current.removeEventListener('scroll', handleScroll, useCapture);
+    };
+  }, [hasMore, isInfiniting]);
+  useEffect(function () {
+    var element = scroller.current;
+    element.addEventListener('touchmove', touchMove, {
+      passive: false
+    });
+    return function () {
+      element.removeEventListener('touchmove', touchMove, {
+        passive: false
+      });
+    };
+  }, []);
+  var getStyle = function getStyle() {
+    return {
+      height: distance.current < 0 ? "0px" : "".concat(distance.current, "px"),
+      transition: isTouching.current ? "height 0s cubic-bezier(0.25,0.1,0.25,1)" : "height 0.2s cubic-bezier(0.25,0.1,0.25,1)"
+    };
+  };
+  var getParentElement = function getParentElement(el) {
+    return containerId ? document.querySelector("#".concat(containerId)) : el && el.parentNode;
+  };
+  var handleScroll = function handleScroll() {
+    requestAniFrame()(function () {
+      if (!isScrollAtBottom() || !hasMore || isInfiniting) {
+        return false;
+      }
+      setIsInfiniting(true);
+      onLoadMore && onLoadMore(infiniteDone);
+      return true;
+    });
+  };
+  var infiniteDone = function infiniteDone() {
+    setIsInfiniting(false);
+  };
+  var refreshDone = function refreshDone() {
+    distance.current = 0;
+    refreshTop.current.style.height = "".concat(distance.current, "px");
+    isTouching.current = false;
+  };
+  var touchStart = function touchStart(event) {
+    if (beforeScrollTop.current === 0 && !isTouching.current && isOpenRefresh) {
+      y.current = event.touches[0].pageY;
+      isTouching.current = true;
+      var childHeight = refreshTop.current.firstElementChild.offsetHeight;
+      refreshMaxH.current = Math.floor(childHeight * 1 + 10);
+    }
+  };
+  var touchMove = function touchMove(event) {
+    distance.current = event.touches[0].pageY - y.current;
+    if (distance.current > 0 && isTouching.current) {
+      event.preventDefault();
+      if (distance.current >= refreshMaxH.current) {
+        distance.current = refreshMaxH.current;
+        refreshTop.current.style.height = "".concat(distance.current, "px");
+      } else {
+        refreshTop.current.style.height = "".concat(distance.current, "px");
+      }
+    } else {
+      distance.current = 0;
+      refreshTop.current.style.height = "".concat(distance.current, "px");
+      isTouching.current = false;
+    }
+  };
+  var touchEnd = function touchEnd() {
+    if (distance.current < refreshMaxH.current) {
+      distance.current = 0;
+      refreshTop.current.style.height = "".concat(distance.current, "px");
+    } else {
+      onRefresh && onRefresh(refreshDone);
+    }
+  };
+  var requestAniFrame = function requestAniFrame() {
+    return window.requestAnimationFrame || window.webkitRequestAnimationFrame || function fn(callback) {
+      window.setTimeout(callback, 1000 / 60);
+    };
+  };
+  var getWindowScrollTop = function getWindowScrollTop() {
+    return window.pageYOffset !== undefined ? window.pageYOffset : (document.documentElement || document.body.parentNode || document.body).scrollTop;
+  };
+  var calculateTopPosition = function calculateTopPosition(el) {
+    return !el ? 0 : el.offsetTop + calculateTopPosition(el.offsetParent);
+  };
+  var isScrollAtBottom = function isScrollAtBottom() {
+    var offsetDistance = 0;
+    var resScrollTop = 0;
+    var direction = 'down';
+    var windowScrollTop = getWindowScrollTop();
+    if (useWindow) {
+      if (scroller.current) {
+        offsetDistance = calculateTopPosition(scroller.current) + scroller.current.offsetHeight - windowScrollTop - window.innerHeight;
+      }
+      resScrollTop = windowScrollTop;
+    } else {
+      var _scrollEl$current = scrollEl.current,
+        scrollHeight = _scrollEl$current.scrollHeight,
+        clientHeight = _scrollEl$current.clientHeight,
+        scrollTop = _scrollEl$current.scrollTop;
+      offsetDistance = scrollHeight - clientHeight - scrollTop;
+      resScrollTop = scrollTop;
+    }
+    if (beforeScrollTop.current > resScrollTop) {
+      direction = 'up';
+    } else {
+      direction = 'down';
+    }
+    beforeScrollTop.current = resScrollTop;
+    onScrollChange && onScrollChange(resScrollTop);
+    return offsetDistance <= threshold && direction === 'down';
+  };
+  return React__default.createElement("div", _objectSpread({
+    className: classes,
+    ref: scroller,
+    onTouchStart: touchStart,
+    onTouchEnd: touchEnd
+  }, restProps), React__default.createElement("div", {
+    className: "nut-infinite-top",
+    ref: refreshTop,
+    style: getStyle()
+  }, React__default.createElement("div", {
+    className: "top-box"
+  }, React__default.createElement(Icon, {
+    classPrefix: iconClassPrefix,
+    fontClassName: iconFontClassName,
+    className: "top-img",
+    name: pullIcon
+  }), React__default.createElement("span", {
+    className: "top-text"
+  }, pullTxt || locale.infiniteloading.pullRefreshText))), React__default.createElement("div", {
+    className: "nut-infinite-container"
+  }, children), React__default.createElement("div", {
+    className: "nut-infinite-bottom"
+  }, isInfiniting ? React__default.createElement("div", {
+    className: "bottom-box"
+  }, React__default.createElement(Icon, {
+    classPrefix: iconClassPrefix,
+    fontClassName: iconFontClassName,
+    className: "bottom-img",
+    name: loadIcon
+  }), React__default.createElement("div", {
+    className: "bottom-text"
+  }, loadTxt || locale.infiniteloading.loadText)) : !hasMore && React__default.createElement("div", {
+    className: "tips"
+  }, loadMoreTxt || locale.infiniteloading.loadMoreText)));
+};
+Infiniteloading.defaultProps = defaultProps;
+Infiniteloading.displayName = 'NutInfiniteloading';
+export { Infiniteloading as default };

package/dist/esm/Input/style/index.js

@@ -0,0 +1,2 @@
+import '../../Icon/style'
+import '../../../packages/input/input.scss'