@cloud-app-dev/vidc 2.0.0-alpha.1 → 2.0.0-alpha.2

package/es/Picture/utils.js

@@ -0,0 +1,90 @@
+import { cloneDeep } from 'lodash';
+export function customContextMenu(e) {
+  e.preventDefault();
+  return false;
+}
+export function cloneImageNode(image) {
+  if (!image) {
+    return Promise.resolve();
+  }
+
+  var newImage = image.cloneNode();
+  return new Promise(function (resolve, reject) {
+    newImage.addEventListener('load', function () {
+      resolve(newImage);
+    }, false);
+    newImage.addEventListener('error', function (e) {
+      reject(e);
+    }, false);
+  });
+}
+export function computedRectScale(_ref) {
+  var imageSource = _ref.imageSource,
+      domImg = _ref.domImg,
+      rects = _ref.rects;
+
+  if (!imageSource || !domImg) {
+    return [];
+  }
+
+  var width = domImg.width;
+  var height = domImg.height;
+  var scaleOptions = {
+    scaleX: width / imageSource.width,
+    scaleY: height / imageSource.height
+  };
+  return rects.map(function (item) {
+    var rect = item.needExpand ? getCaptureRect(cloneDeep(item.rect), item.type) : cloneDeep(item.rect);
+    rect[0] = Math.round(rect[0] * scaleOptions.scaleX);
+    rect[0] < 0 && (rect[0] = 0);
+    rect[2] = Math.round(rect[2] * scaleOptions.scaleX);
+    rect[2] < 0 && (rect[2] = 0);
+    rect[1] = Math.round(rect[1] * scaleOptions.scaleY);
+    rect[1] < 0 && (rect[1] = 0);
+    rect[3] = Math.round(rect[3] * scaleOptions.scaleY);
+    rect[3] < 0 && (rect[3] = 0);
+    rect[2] > width - rect[0] && (rect[2] = width - rect[0]);
+    rect[3] > height - rect[1] && (rect[3] = height - rect[1]);
+    return Object.assign(Object.assign({}, item), {
+      rect: rect
+    });
+  });
+}
+export function getCaptureRect(rect, type) {
+  var rectArea = rect;
+
+  if (rectArea.length !== 4) {
+    console.error('区域有误 实例：string = "x,y,w,h"! ', rect);
+    return [0, 0, 0, 0];
+  }
+
+  var x, y, w, h;
+
+  switch (type) {
+    case 'body':
+      x = rectArea[0] - rectArea[2] * 0.2;
+      y = rectArea[1] - rectArea[3] * 0.2;
+      w = rectArea[2] * 1.4;
+      h = rectArea[3] * 1.4;
+      break;
+
+    case 'nonVehicle':
+    case 'vehicle':
+    case 'thing':
+      x = rectArea[0];
+      y = rectArea[1];
+      w = rectArea[2];
+      h = rectArea[3];
+      break;
+
+    default:
+      // face
+      x = rectArea[0] - rectArea[2] * 0.8;
+      y = rectArea[1] - rectArea[3] * 1.5;
+      w = rectArea[2] * 2.6;
+      h = rectArea[3] * 3.2;
+      break;
+  }
+
+  return [x, y, w, h];
+}

package/es/Progress/index.css

@@ -0,0 +1,20 @@
+.cloudapp-progress.lm-c-loading-progress {
+  height: 2px;
+  overflow: hidden;
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 99;
+  transition: opacity 1s linear;
+  opacity: 1;
+}
+.cloudapp-progress.lm-c-loading-progress.lm-c-loading-progress-over {
+  opacity: 0;
+}
+.cloudapp-progress.lm-c-loading-progress .cloudapp-progress-outer {
+  display: block;
+}
+.cloudapp-progress.lm-c-loading-progress .cloudapp-progress-outer .cloudapp-progress-inner {
+  display: block;
+  background-color: transparent;
+}

package/es/Progress/index.d.ts

@@ -0,0 +1,11 @@
+import './index.less';
+interface IProgressComponentProps {
+    status: 'over' | 'error' | 'loading';
+}
+declare function ProgressComponent({ status }: IProgressComponentProps): JSX.Element;
+declare namespace ProgressComponent {
+    var defaultProps: {
+        status: string;
+    };
+}
+export default ProgressComponent;

package/es/Progress/index.js

@@ -0,0 +1,68 @@
+import "antd/lib/progress/style";
+import _Progress from "antd/lib/progress";
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import React, { useState, useEffect, useMemo, useRef } from 'react';
+import "./index.css";
+
+function ProgressComponent(_ref) {
+  var status = _ref.status;
+  var timer = useRef(null);
+  var currentStatus = useRef('loading');
+
+  var _useState = useState(0),
+      _useState2 = _slicedToArray(_useState, 2),
+      percent = _useState2[0],
+      setPersent = _useState2[1];
+
+  var isHide = useMemo(function () {
+    return percent === 100;
+  }, [percent]);
+  useEffect(function () {
+    if ((status === 'over' || status === 'error') && percent === 0) {
+      return;
+    }
+
+    if (percent <= 90 && currentStatus.current === 'loading') {
+      var num = percent + 20;
+      timer.current = setTimeout(function () {
+        return setPersent(num);
+      }, 10);
+    } else {
+      clearTimeout(timer.current);
+      setPersent(100);
+      timer.current = setTimeout(function () {
+        return setPersent(0);
+      }, 1000);
+    }
+  }, [percent, status]);
+  useEffect(function () {
+    return function () {
+      return clearTimeout(timer.current);
+    };
+  });
+  return /*#__PURE__*/React.createElement(_Progress, {
+    status: status === 'error' ? 'exception' : 'active',
+    percent: percent,
+    showInfo: false,
+    strokeWidth: 2,
+    strokeColor: status !== 'error' ? 'var(--primary)' : ' var(--danger)',
+    className: "lm-c-loading-progress ".concat(isHide ? 'lm-c-loading-progress-over' : '')
+  });
+}
+
+ProgressComponent.defaultProps = {
+  status: 'loading'
+};
+export default ProgressComponent;

package/es/RefDrawer/index.js

@@ -1,6 +1,3 @@
-import _Drawer from "@cloud-app-dev/basic-components/es/Drawer";
-import _ConfigContext from "@cloud-app-dev/basic-components/es/ConfigContext";
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -14,9 +11,11 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 import React, { useContext, useImperativeHandle, useMemo, useState } from 'react';
+import Drawer from '../Drawer';
+import ConfigContext from '../ConfigContext';
 
 function RefDrawer(_, ref) {
-  var context = useContext(_ConfigContext);
+  var context = useContext(ConfigContext);
   var root = useMemo(function () {
     return (context === null || context === void 0 ? void 0 : context.root) || document.body;
   }, [context === null || context === void 0 ? void 0 : context.root]);
@@ -55,7 +54,7 @@ function RefDrawer(_, ref) {
       close: close
     };
   }, [state]);
-  return /*#__PURE__*/React.createElement(_Drawer, {
+  return /*#__PURE__*/React.createElement(Drawer, {
     visible: state.visible,
     onOk: state.onOk,
     onClose: close,

package/es/RefModal/index.js

@@ -1,6 +1,3 @@
-import _Modal from "@cloud-app-dev/basic-components/es/Modal";
-import _ConfigContext from "@cloud-app-dev/basic-components/es/ConfigContext";
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -14,9 +11,11 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 import React, { useContext, useImperativeHandle, useMemo, useState } from 'react';
+import Modal from '../Modal';
+import ConfigContext from '../ConfigContext';
 
 function RefModal(_, ref) {
-  var context = useContext(_ConfigContext);
+  var context = useContext(ConfigContext);
   var root = useMemo(function () {
     return (context === null || context === void 0 ? void 0 : context.root) || document.body;
   }, [context === null || context === void 0 ? void 0 : context.root]);
@@ -55,7 +54,7 @@ function RefModal(_, ref) {
       close: close
     };
   }, [state]);
-  return /*#__PURE__*/React.createElement(_Modal, {
+  return /*#__PURE__*/React.createElement(Modal, {
     okText: "\u786E\u5B9A",
     cancelText: "\u53D6\u6D88",
     visible: state.visible,

package/es/ScrollList/index.css

@@ -0,0 +1,73 @@
+.lm-c-normol-box.lm-c-infinite-scroll-layout {
+  position: relative;
+  background-color: transparent;
+}
+.lm-c-normol-box.lm-c-infinite-scroll-layout .row-group-part {
+  display: flex;
+  justify-content: center;
+}
+.lm-c-normol-box.lm-c-infinite-scroll-layout .row-group-part .row-item-part {
+  overflow: hidden;
+}
+.lm-c-normol-box.lm-c-infinite-scroll-layout .row-group-part .row-item-part:last-child {
+  margin-right: 0 !important;
+}
+.lm-c-normol-box.lm-c-infinite-scroll-layout .scoll-back-top {
+  position: absolute;
+  right: 20px;
+  bottom: 20px;
+  height: 40px;
+  width: 40px;
+  border-radius: 50%;
+  background-color: var(--primary);
+  color: #fff;
+  cursor: pointer;
+  text-align: center;
+  line-height: 40px;
+  font-size: 18px;
+}
+.lm-c-normol-box.lm-c-infinite-scroll-layout .scoll-back-top:hover {
+  background-color: var(--primary);
+}
+.lm-c-normol-box.lm-c-infinite-scroll-layout.infinite-scroll-empty {
+  background-repeat: no-repeat;
+  background-position: center 30%;
+  background-size: 200px;
+}
+.lm-c-normol-box.lm-c-infinite-scroll-layout .listcard-title {
+  font-size: 14px;
+  font-weight: 700;
+  margin-bottom: 5px;
+  justify-content: left;
+}
+.lm-c-normol-box.lm-c-infinite-scroll-layout .listcard-title.row-group-part:before {
+  content: '';
+  border-radius: 10px;
+  border: 4px solid var(--primary);
+  position: relative;
+  margin-right: 10px;
+  top: 6px;
+  height: 8px;
+  display: inline-block;
+}
+.lm-c-normol-box.lm-c-infinite-scroll-layout .listcard-title.row-group-part.show-line:before {
+  content: '';
+  border-radius: 10px;
+  border: 4px solid var(--primary);
+  position: relative;
+  margin-right: 10px;
+  margin-left: -4px;
+  top: 6px;
+  height: 8px;
+  display: inline-block;
+}
+.lm-c-normol-box.lm-c-infinite-scroll-layout .row-group-part.show-line:before {
+  content: '';
+  border: 0.5px solid #d8d8d8;
+  margin-right: 15px;
+}
+.lm-c-normol-box.lm-c-infinite-scroll-layout .row-group-part.hide-line:before {
+  content: '';
+  border: none;
+  margin-right: 15px;
+}

package/es/ScrollList/index.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+
+export declare interface ScrollListProps<T> {
+  itemHeight?: number; // 用于计算滚动条的高度
+  data?: Array<T>;
+  loadMore?: () => Promise<null>; //加载更多的方法，次方法应该修改props.data
+  renderItem?: (item: T, index: number) => React.ReactNode;
+  rowClass?: string;
+  threshold?: number;
+  itemClass?: string;
+  itemGrid?: object;
+  gutter?: number;
+  hasLoadPrev?: boolean;
+  hasLoadMore?: boolean;
+  loadPrev?: func;
+  prethreshold?: number;
+  isNoData?: boolean;
+  className?: string;
+  noDataUrl?: string;
+}
+
+declare const ScrollList: React.StatelessComponent<ScrollListProps<T>>;
+
+export default ScrollList;

package/es/ScrollList/index.js

@@ -0,0 +1,261 @@
+import "antd/lib/tooltip/style";
+import _Tooltip from "antd/lib/tooltip";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import React, { useState, useEffect, useMemo, useRef, useImperativeHandle, forwardRef } from 'react';
+import AutoSizer from 'react-virtualized/dist/es/AutoSizer';
+import InfiniteLoader from 'react-virtualized/dist/es/InfiniteLoader';
+import List from 'react-virtualized/dist/es/List';
+import IconFont from '../IconFont';
+import { debounce, cloneDeep } from 'lodash';
+import { computedCuurentGrid, arraySliceForX, simpleGrid } from './utils';
+import "./index.css";
+var ScrollList = /*#__PURE__*/forwardRef(function InfiniteScrollLayout(props, ref) {
+  var data = props.data,
+      itemGrid = props.itemGrid,
+      itemHeight = props.itemHeight,
+      threshold = props.threshold,
+      isNoData = props.isNoData,
+      _props$className = props.className,
+      className = _props$className === void 0 ? '' : _props$className,
+      hasLoadPrev = props.hasLoadPrev,
+      loadPrev = props.loadPrev,
+      prethreshold = props.prethreshold,
+      noDataUrl = props.noDataUrl;
+  var infiniteRef = useRef(null);
+  var loadingRef = useRef(false);
+  var scrollRef = useRef(false);
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      showBackTop = _useState2[0],
+      setShowBackUp = _useState2[1];
+
+  var _useState3 = useState(computedCuurentGrid()),
+      _useState4 = _slicedToArray(_useState3, 2),
+      currentGrid = _useState4[0],
+      setContentGrid = _useState4[1];
+
+  var debounced = null;
+  useEffect(function () {
+    var bindResizeEvent = function bindResizeEvent() {
+      setContentGrid(computedCuurentGrid());
+    };
+
+    window.addEventListener('resize', bindResizeEvent, false);
+    return function () {
+      debounced && debounced.cancel();
+      window.removeEventListener('resize', bindResizeEvent, false);
+    }; // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var rowCount = useMemo(function () {
+    return Math.floor(24 / itemGrid[currentGrid]);
+  }, [itemGrid, currentGrid]);
+  var renderData = useMemo(function () {
+    return arraySliceForX(data, rowCount);
+  }, [data, rowCount]);
+
+  function forceUpdateGrid() {
+    infiniteRef.current && infiniteRef.current._registeredChild.forceUpdateGrid();
+  }
+
+  function scrollToPosition() {
+    var _infiniteRef$current$;
+
+    infiniteRef.current && (_infiniteRef$current$ = infiniteRef.current._registeredChild).scrollToPosition.apply(_infiniteRef$current$, arguments);
+  }
+
+  function scrollToRow() {
+    var _infiniteRef$current$2;
+
+    infiniteRef.current && (_infiniteRef$current$2 = infiniteRef.current._registeredChild).scrollToRow.apply(_infiniteRef$current$2, arguments);
+  }
+
+  useImperativeHandle(ref, function () {
+    return {
+      forceUpdateGrid: forceUpdateGrid,
+      scrollToRow: scrollToRow,
+      scrollToPosition: scrollToPosition
+    };
+  });
+
+  var loadMore = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+      return regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (!(props.hasLoadMore && props.loadMore && !loadingRef.current)) {
+                _context.next = 5;
+                break;
+              }
+
+              loadingRef.current = true;
+              _context.next = 4;
+              return props.loadMore();
+
+            case 4:
+              loadingRef.current = false;
+
+            case 5:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+
+    return function loadMore() {
+      return _ref.apply(this, arguments);
+    };
+  }();
+
+  function onListScroll(options) {
+    if (hasLoadPrev && !loadingRef.current && loadPrev && options.scrollTop === 0 && scrollRef.current) {
+      loadingRef.current = true;
+      loadPrev().then(function (dataLength) {
+        if (dataLength) {
+          var row = Math.ceil(dataLength / rowCount);
+
+          if (row > 0) {
+            scrollToPosition(row * itemHeight);
+          }
+        }
+
+        loadingRef.current = false;
+      });
+    }
+
+    if (!scrollRef.current && options.scrollTop >= prethreshold) {
+      scrollRef.current = true;
+    }
+
+    debounced && debounced.cancel();
+    debounced = debounce(function () {
+      var flag = options.scrollTop > 200;
+
+      if (showBackTop !== flag) {
+        setShowBackUp(flag);
+      }
+
+      props.onScroll && props.onScroll(options);
+    }, 500);
+    debounced();
+  }
+
+  function rowRender(_ref2) {
+    var key = _ref2.key,
+        index = _ref2.index,
+        style = _ref2.style;
+    var gutter = props.gutter,
+        paddingRow = props.paddingRow,
+        rowClass = props.rowClass,
+        hasLoadMore = props.hasLoadMore,
+        itemClass = props.itemClass;
+    var rowData = renderData[index] || [];
+    var len = rowCount - rowData.length;
+
+    if (rowData.length < rowCount) {
+      for (var i = 0; i < len; i++) {
+        rowData.push(null);
+      }
+    }
+
+    return /*#__PURE__*/React.createElement("div", {
+      key: key,
+      style: _objectSpread(_objectSpread({}, style), {}, {
+        padding: "0 ".concat(paddingRow)
+      }),
+      className: "row-group-part  ".concat(rowClass)
+    }, rowData.map(function (v, i) {
+      return /*#__PURE__*/React.createElement("div", {
+        key: "".concat(key, "-").concat(i),
+        className: "row-item-part ".concat(v === null && hasLoadMore ? 'row-item-placeholder' : '', " ").concat(v !== null ? itemClass : ''),
+        style: {
+          width: "".concat(100 / 24 * itemGrid[currentGrid], "%"),
+          height: itemHeight,
+          marginRight: gutter,
+          paddingBottom: gutter
+        }
+      }, v && props.renderItem(v, i));
+    }));
+  }
+
+  function _isRowLoaded(_ref3) {
+    var index = _ref3.index;
+    return !!renderData[index];
+  }
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: "lm-c-infinite-scroll-layout ".concat(isNoData ? 'infinite-scroll-empty' : '', " ").concat(className),
+    style: isNoData ? {
+      backgroundImage: "url(".concat(noDataUrl, ")")
+    } : undefined
+  }, /*#__PURE__*/React.createElement(InfiniteLoader, {
+    isRowLoaded: _isRowLoaded,
+    loadMoreRows: loadMore,
+    rowCount: renderData.length + 1,
+    ref: infiniteRef,
+    threshold: threshold
+  }, function (_ref4) {
+    var onRowsRendered = _ref4.onRowsRendered,
+        registerChild = _ref4.registerChild;
+    return /*#__PURE__*/React.createElement(AutoSizer, null, function (_ref5) {
+      var width = _ref5.width,
+          height = _ref5.height;
+      return /*#__PURE__*/React.createElement(List, {
+        width: width,
+        onRowsRendered: onRowsRendered,
+        ref: registerChild,
+        height: height,
+        rowCount: renderData.length,
+        rowHeight: itemHeight,
+        rowRenderer: rowRender,
+        onScroll: onListScroll
+      });
+    });
+  }), props.hasBackTop && showBackTop && /*#__PURE__*/React.createElement(_Tooltip, {
+    title: "\u8FD4\u56DE\u9876\u90E8",
+    placement: "top"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "scoll-back-top",
+    onClick: function onClick() {
+      return scrollToPosition(0);
+    }
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    type: "icon-S_Arrow_MoveUp"
+  }))));
+});
+ScrollList.defaultProps = {
+  itemHeight: 200,
+  gutter: 20,
+  itemGrid: cloneDeep(simpleGrid),
+  hasLoadMore: true,
+  hasLoadPrev: true,
+  threshold: 5,
+  prethreshold: 200,
+  hasBackTop: false,
+  data: []
+};
+export default ScrollList;

package/es/ScrollList/utils.js

@@ -0,0 +1,84 @@
+export function computedCuurentGrid() {
+  var width = document.body.clientWidth;
+
+  if (width >= 1600) {
+    return 'xxl';
+  }
+
+  if (width >= 1200 && width < 1600) {
+    return 'xl';
+  }
+
+  if (width >= 992 && width < 1200) {
+    return 'lg';
+  }
+
+  if (width >= 768 && width < 992) {
+    return 'md';
+  }
+
+  if (width >= 576 && width < 768) {
+    return 'sm';
+  }
+
+  if (width < 576) {
+    return 'xs';
+  }
+} // 切割数组 1维变2维
+
+export function arraySliceForX(arr) {
+  var x = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 3;
+  var newArr = [];
+
+  for (var i = 0, l = arr.length; i < l; i++) {
+    if (newArr.length === 0) {
+      newArr.push([]);
+    }
+
+    if (newArr[newArr.length - 1].length > x - 1) {
+      newArr.push([]);
+    }
+
+    newArr[newArr.length - 1].push(arr[i]);
+  }
+
+  return newArr;
+} // 切割数组 1维变2维，分组聚合展示
+
+export function arraySliceForXG(arr) {
+  var x = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 3;
+  var isGroupTitle = arguments.length > 2 ? arguments[2] : undefined;
+  var newArr = [];
+
+  for (var i = 0, l = arr.length; i < l; i++) {
+    if (newArr.length === 0) {
+      newArr.push([]);
+    }
+
+    if (isGroupTitle(arr[i])) {
+      if (newArr[newArr.length - 1].length === 0) {
+        newArr[newArr.length - 1].push(arr[i]);
+      } else {
+        newArr.push([arr[i]]);
+      }
+
+      newArr.push([]);
+    } else {
+      if (newArr[newArr.length - 1].length > x - 1) {
+        newArr.push([]);
+      }
+
+      newArr[newArr.length - 1].push(arr[i]);
+    }
+  }
+
+  return newArr;
+}
+export var simpleGrid = {
+  xxl: 4,
+  xl: 6,
+  lg: 6,
+  md: 7,
+  sm: 24,
+  xs: 24
+};