@cloud-app-dev/vidc 4.0.20 → 4.0.22

package/es/DomMove/utils.js

@@ -0,0 +1,32 @@
+export function getPosition(obj) {
+  //获取某元素以浏览器左上角为原点的坐标
+  var t = obj.offsetTop; //获取该元素对应父容器的上边距
+  var l = obj.offsetLeft; //对应父容器的上边距
+  //判断是否有父容器，如果存在则累加其边距
+  while (obj = obj.offsetParent) {
+    //等效 obj = obj.offsetParent;while (obj != undefined)
+    t += obj.offsetTop; //叠加父容器的上边距
+    l += obj.offsetLeft; //叠加父容器的左边距
+  }
+  return {
+    left: l,
+    top: t
+  };
+}
+// 函数用于获取鼠标的位置
+export function getMouseXY(e) {
+  var x = 0,
+    y = 0;
+  e = e || window.event;
+  if (e.pageX) {
+    x = e.pageX;
+    y = e.pageY;
+  } else {
+    x = e.clientX + document.body.scrollLeft - document.body.clientLeft;
+    y = e.clientY + document.body.scrollTop - document.body.clientTop;
+  }
+  return {
+    x: x,
+    y: y
+  };
+}

package/es/Drag/DragAndDropItem.js

@@ -0,0 +1,133 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+/* eslint-disable @typescript-eslint/no-unused-expressions */
+import React, { useCallback, useMemo, useRef, useState } from 'react';
+import uuid from "../uuid";
+function DragAndDropItem(_ref) {
+  var children = _ref.children,
+    dragData = _ref.dragData,
+    dragId = _ref.dragId,
+    style = _ref.style,
+    onDropEnd = _ref.onDropEnd,
+    _ref$disabledCopyElem = _ref.disabledCopyElement,
+    disabledCopyElement = _ref$disabledCopyElem === void 0 ? true : _ref$disabledCopyElem;
+  var id = useMemo(function () {
+    return dragId || "dragId-".concat(uuid());
+  }, [dragId]);
+  var _useState = useState(['', '']),
+    _useState2 = _slicedToArray(_useState, 2),
+    status = _useState2[0],
+    setStatus = _useState2[1];
+  var _useState3 = useState([0, 0]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    offset = _useState4[0],
+    setOffset = _useState4[1];
+  var domRef = useRef(null);
+  var dragDomTemp = useRef(null);
+  var onDrop = useCallback(function (event) {
+    event.stopPropagation();
+    setStatus(function (old) {
+      return [old[0], 'droped'];
+    });
+    var data = JSON.parse(event.dataTransfer.getData('DATA'));
+    onDropEnd && onDropEnd(data);
+  }, [onDropEnd]);
+  var onDragEnter = useCallback(function (event) {
+    event.stopPropagation();
+    setStatus(function (old) {
+      return [old[0], 'dragenter'];
+    });
+  }, []);
+  var onDragLeave = useCallback(function (event) {
+    event.stopPropagation();
+    setStatus(function (old) {
+      return [old[0], 'dragleave'];
+    });
+  }, []);
+  var allowDrop = useCallback(function (event) {
+    return event.preventDefault();
+  }, []);
+  var onDragStart = useCallback(function (event) {
+    if (!domRef.current) {
+      return;
+    }
+    if (!disabledCopyElement) {
+      var pageX = event.pageX,
+        pageY = event.pageY;
+      var _domRef$current$getBo = domRef.current.getBoundingClientRect(),
+        x = _domRef$current$getBo.x,
+        y = _domRef$current$getBo.y,
+        width = _domRef$current$getBo.width,
+        height = _domRef$current$getBo.height;
+      var offsetX = pageX - x;
+      var offsetY = pageY - y;
+      dragDomTemp.current = domRef.current.cloneNode(true);
+      domRef.current.after(dragDomTemp.current);
+      //初始化缓存dom位置
+      dragDomTemp.current.style.position = 'fixed';
+      dragDomTemp.current.style.left = "".concat(event.pageX - offsetX, "px");
+      dragDomTemp.current.style.top = "".concat(event.pageY - offsetY, "px");
+      dragDomTemp.current.style.draggable = false;
+      dragDomTemp.current.style.pointerEvents = 'none';
+      dragDomTemp.current.style.opacity = 0.5;
+      dragDomTemp.current.style.zIndex = 99;
+      dragDomTemp.current.style.width = "".concat(width, "px");
+      dragDomTemp.current.style.height = "".concat(height, "px");
+      setOffset([offsetX, offsetY]);
+      event.dataTransfer.setDragImage(new Image(), 0, 0);
+    }
+    setStatus(function (old) {
+      return ['draging', old[1]];
+    });
+    var res = {
+      data: dragData,
+      _id: id
+    };
+    event.dataTransfer.setData('DATA', JSON.stringify(res));
+  }, [disabledCopyElement, dragData, id]);
+  var onDragEnd = useCallback(function () {
+    dragDomTemp.current && dragDomTemp.current.remove();
+    setStatus(function (old) {
+      return ['dragEnd', old[1]];
+    });
+  }, []);
+  var onDrag = useCallback(function (e) {
+    if (dragDomTemp.current) {
+      if (e.pageX === 0 && e.pageY === 0) {
+        return;
+      }
+      if (e.pageX < offset[2] || e.pageY < offset[3]) {
+        return;
+      }
+      dragDomTemp.current.style.position = 'fixed';
+      dragDomTemp.current.style.left = "".concat(e.pageX - offset[0], "px");
+      dragDomTemp.current.style.top = "".concat(e.pageY - offset[1], "px");
+    }
+  }, [offset]);
+  return /*#__PURE__*/React.cloneElement(children, {
+    ref: domRef,
+    onDragStart: onDragStart,
+    onDrag: onDrag,
+    'data-dragId': id,
+    draggable: true,
+    onDragEnd: onDragEnd,
+    onDrop: onDrop,
+    onDragOver: allowDrop,
+    onDragEnter: onDragEnter,
+    onDragLeave: onDragLeave,
+    style: _objectSpread(_objectSpread({}, style), {}, {
+      opacity: status[0] === 'draging' || status[1] === 'dragenter' ? 0.5 : 1
+    })
+  });
+}
+export default DragAndDropItem;

package/es/Drag/DropItem.js

@@ -0,0 +1,50 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+/* eslint-disable @typescript-eslint/no-unused-expressions */
+import React, { useCallback, useRef, useState } from 'react';
+function DropItem(_ref) {
+  var children = _ref.children,
+    style = _ref.style,
+    onDropEnd = _ref.onDropEnd;
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    status = _useState2[0],
+    setStatus = _useState2[1];
+  var domRef = useRef(null);
+  var onDrop = useCallback(function (event) {
+    event.stopPropagation();
+    setStatus('droped');
+    var data = JSON.parse(event.dataTransfer.getData('DATA'));
+    onDropEnd && onDropEnd(data);
+  }, [onDropEnd]);
+  var onDragEnter = useCallback(function (event) {
+    event.stopPropagation();
+    setStatus('dragenter');
+  }, []);
+  var onDragLeave = useCallback(function (event) {
+    event.stopPropagation();
+    setStatus('dragleave');
+  }, []);
+  var allowDrop = useCallback(function (event) {
+    return event.preventDefault();
+  }, []);
+  return /*#__PURE__*/React.cloneElement(children, {
+    ref: domRef,
+    onDrop: onDrop,
+    onDragOver: allowDrop,
+    onDragEnter: onDragEnter,
+    onDragLeave: onDragLeave,
+    style: status === 'dragenter' ? _objectSpread({}, style) : undefined
+  });
+}
+export default DropItem;

package/es/Drag/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { IDragAndDropItemProps, IDropItemProps } from './interface';
+
+interface IDragInterface<T> {
+  DragAndDropItemProps: React.FC<IDragAndDropItemProps<T>>;
+  DropItem: React.FC<IDropItemProps<T>>;
+}
+
+export default IDragInterface;

package/es/Drag/index.js

@@ -0,0 +1,7 @@
+import DragAndDropItem from "./DragAndDropItem";
+import DropItem from "./DropItem";
+var Drag = {
+  DragAndDropItem: DragAndDropItem,
+  DropItem: DropItem
+};
+export default Drag;

package/es/Drag/interface.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+
+export interface IDragAndDropItemProps<T> {
+  children: JSX.Element;
+  dragData: T;
+  dragId?: string;
+  style?: React.CSSProperties;
+  onDropEnd: (params: { data: T; _id: string }) => void;
+  disabledCopyElement?: boolean;
+}
+
+export interface IDropItemProps<T> {
+  children: JSX.Element;
+  style?: React.CSSProperties;
+  onDropEnd: (params: { data: T; _id?: string }) => void;
+}

package/es/DynamicGridList/Demo.js

@@ -0,0 +1,77 @@
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread 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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+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; }
+/* eslint-disable @typescript-eslint/no-unused-expressions */
+import React from 'react';
+import GridList from "./index";
+function random(low, high) {
+  return Math.floor(Math.random() * high) + low;
+}
+var IMAGES = function IMAGES() {
+  return Array.from({
+    length: 20
+  }, function (_, index) {
+    var width = 300;
+    var height = random(200, 300);
+    return {
+      url: "https://picsum.photos/id/".concat(index + 1, "/").concat(width, "/").concat(height, ".jpg"),
+      width: width,
+      height: height
+    };
+  });
+};
+function loadPage(d) {
+  if (!d) {
+    // eslint-disable-next-line no-param-reassign
+    d = {};
+  }
+  var resultData = IMAGES();
+  d.page ? d.page++ : d.page = 1;
+  d.list ? d.list = [].concat(_toConsumableArray(d.list), _toConsumableArray(resultData)) : d.list = resultData;
+  return new Promise(function (resolve) {
+    console.log(d.page);
+    setTimeout(function () {
+      return resolve(d);
+    }, 10);
+  });
+}
+var App = function App() {
+  return /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: 400
+    }
+  }, /*#__PURE__*/React.createElement(GridList, {
+    itemKey: "url",
+    itemHeight: 400,
+    itemWidth: 250,
+    renderItem: function renderItem(image) {
+      return /*#__PURE__*/React.createElement("div", {
+        style: {
+          border: '1px solid gray',
+          height: '100%',
+          display: 'flex',
+          flexDirection: 'column'
+        }
+      }, /*#__PURE__*/React.createElement("div", {
+        style: {
+          flex: 1,
+          overflow: 'hidden'
+        }
+      }, /*#__PURE__*/React.createElement("img", {
+        src: image.url,
+        alt: "",
+        style: {
+          objectFit: 'cover',
+          display: 'block',
+          width: '100%',
+          height: '100%'
+        }
+      })), /*#__PURE__*/React.createElement("p", null, "\u6807\u9898"), /*#__PURE__*/React.createElement("p", null, "\u63CF\u8FF0"));
+    },
+    loadPage: loadPage
+  }));
+};
+export default App;

package/es/DynamicGridList/index.js

@@ -0,0 +1,67 @@
+var _excluded = ["renderItem", "itemHeight", "itemKey", "itemWidth", "reloadDeps", "getGridGap", "loadPage", "isNoMore", "threshold"];
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { useUpdateEffect } from 'ahooks';
+import React, { useMemo, useRef } from 'react';
+import GridList from "../GridList";
+import useInfiniteScroll from "../useInfiniteScroll";
+function DynamicGridList(_ref) {
+  var renderItem = _ref.renderItem,
+    _ref$itemHeight = _ref.itemHeight,
+    itemHeight = _ref$itemHeight === void 0 ? 300 : _ref$itemHeight,
+    itemKey = _ref.itemKey,
+    _ref$itemWidth = _ref.itemWidth,
+    itemWidth = _ref$itemWidth === void 0 ? 250 : _ref$itemWidth,
+    _ref$reloadDeps = _ref.reloadDeps,
+    reloadDeps = _ref$reloadDeps === void 0 ? [] : _ref$reloadDeps,
+    _ref$getGridGap = _ref.getGridGap,
+    getGridGap = _ref$getGridGap === void 0 ? function () {
+      return 20;
+    } : _ref$getGridGap,
+    loadPage = _ref.loadPage,
+    isNoMore = _ref.isNoMore,
+    _ref$threshold = _ref.threshold,
+    threshold = _ref$threshold === void 0 ? 50 : _ref$threshold,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var containerRef = useRef(null);
+  var _useInfiniteScroll = useInfiniteScroll(loadPage, {
+      target: containerRef,
+      threshold: threshold,
+      isNoMore: isNoMore,
+      reloadDeps: reloadDeps
+    }),
+    data = _useInfiniteScroll.data,
+    noMore = _useInfiniteScroll.noMore;
+  useUpdateEffect(function () {
+    if (noMore) {
+      console.warn('数据已全部加载完成');
+    }
+  }, [noMore]);
+  function getItemData(data) {
+    return {
+      key: data[itemKey],
+      height: itemHeight,
+      width: itemWidth
+    };
+  }
+  function getColumnCount(elementWidth, gridGap) {
+    return Math.floor((elementWidth + gridGap) / ((itemWidth !== null && itemWidth !== void 0 ? itemWidth : 0) + gridGap));
+  }
+  function getWindowMargin(windowHeight) {
+    return Math.round(windowHeight * 1.5);
+  }
+  var dataList = useMemo(function () {
+    return data ? data.list || [] : [];
+  }, [data]);
+  return /*#__PURE__*/React.createElement(GridList, {
+    className: "cloudapp-dynamic-grid-list ".concat(props.className || ''),
+    items: dataList,
+    ref: containerRef,
+    getItemData: getItemData,
+    getColumnCount: getColumnCount,
+    getWindowMargin: getWindowMargin,
+    renderItem: renderItem,
+    getGridGap: getGridGap
+  });
+}
+export default DynamicGridList;

package/es/DynamicList/demo.js

@@ -0,0 +1,44 @@
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread 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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+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; }
+/* eslint-disable @typescript-eslint/no-unused-expressions */
+import { ConfigProvider } from 'antd';
+import React from 'react';
+import DynamicList from "./index";
+var resultData = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13'];
+function loadPage(d) {
+  if (!d) {
+    // eslint-disable-next-line no-param-reassign
+    d = {};
+  }
+  d.page ? d.page++ : d.page = 1;
+  d.list ? d.list = [].concat(_toConsumableArray(d.list), resultData) : d.list = resultData;
+  return new Promise(function (resolve) {
+    setTimeout(function () {
+      resolve(d);
+    }, 2000);
+  });
+}
+export default function () {
+  return /*#__PURE__*/React.createElement(ConfigProvider, {
+    prefixCls: "cloudapp"
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex'
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: 400,
+      width: 300
+    }
+  }, /*#__PURE__*/React.createElement(DynamicList, {
+    loadPage: loadPage,
+    itemHeight: 40,
+    renderItem: function renderItem(item) {
+      return /*#__PURE__*/React.createElement("div", null, item.data);
+    }
+  }))));
+}

package/es/DynamicList/index.js

@@ -0,0 +1,86 @@
+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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { useUpdateEffect } from 'ahooks';
+import { Skeleton } from 'antd';
+import React, { useMemo, useRef } from 'react';
+import useInfiniteScroll from "../useInfiniteScroll";
+import useVirtualList from "../useVirtualList";
+import { skeletonList } from "./utils";
+
+//style
+import "./index.less";
+function DynamicList(_ref) {
+  var renderItem = _ref.renderItem,
+    _ref$itemHeight = _ref.itemHeight,
+    itemHeight = _ref$itemHeight === void 0 ? 40 : _ref$itemHeight,
+    _ref$itemClassName = _ref.itemClassName,
+    itemClassName = _ref$itemClassName === void 0 ? '' : _ref$itemClassName,
+    reloadDeps = _ref.reloadDeps,
+    loadPage = _ref.loadPage;
+  var containerRef = useRef(null);
+  var wrapperRef = useRef(null);
+  var _useInfiniteScroll = useInfiniteScroll(loadPage, {
+      target: containerRef,
+      threshold: 50,
+      isNoMore: function isNoMore(d) {
+        var _d$list$length, _d$list;
+        return ((_d$list$length = d === null || d === void 0 || (_d$list = d.list) === null || _d$list === void 0 ? void 0 : _d$list.length) !== null && _d$list$length !== void 0 ? _d$list$length : 0) >= (d === null || d === void 0 ? void 0 : d.count);
+      },
+      reloadDeps: reloadDeps
+    }),
+    data = _useInfiniteScroll.data,
+    loading = _useInfiniteScroll.loading,
+    noMore = _useInfiniteScroll.noMore;
+  var isSkeleton = useMemo(function () {
+    return !noMore && loading;
+  }, [noMore, loading]);
+  var dataList = useMemo(function () {
+    return data ? data.list || [] : [];
+  }, [data]);
+  var _useVirtualList = useVirtualList(dataList, {
+      containerTarget: containerRef,
+      wrapperTarget: wrapperRef,
+      itemHeight: itemHeight,
+      overscan: 10
+    }),
+    _useVirtualList2 = _slicedToArray(_useVirtualList, 2),
+    list = _useVirtualList2[0],
+    scrollTo = _useVirtualList2[1];
+  useUpdateEffect(function () {
+    return scrollTo(0);
+  }, reloadDeps ? reloadDeps : []);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "l-c-dynamic-list-layout"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "l-c-dynamic-box",
+    ref: containerRef
+  }, /*#__PURE__*/React.createElement("div", {
+    ref: wrapperRef
+  }, list.map(function (item) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: item.index,
+      style: {
+        height: itemHeight
+      },
+      className: itemClassName
+    }, renderItem(item));
+  })), isSkeleton && skeletonList.map(function (_, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: index,
+      style: {
+        padding: '0 10px',
+        height: itemHeight
+      },
+      className: itemClassName
+    }, /*#__PURE__*/React.createElement(Skeleton, {
+      paragraph: false,
+      loading: true,
+      active: true
+    }));
+  })));
+}
+export default DynamicList;

package/es/DynamicList/index.less

@@ -0,0 +1,17 @@
+.l-c-dynamic-list-layout {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  border: 1px solid var(--gray2);
+
+  .dynamic-list-item {
+    padding: 0 10px;
+  }
+
+  .l-c-dynamic-box {
+    flex: 1;
+    overflow: auto;
+    contain: strict;
+  }
+}

package/es/DynamicList/interface.d.ts

@@ -0,0 +1,19 @@
+import type { TData } from '../../useInfiniteScroll';
+export interface IDynamicListProps<T> {
+  itemHeight?: number;
+
+  itemClassName?: string;
+
+  /**
+   * 重载条件
+   */
+  reloadDeps?: any[];
+
+  /**
+   * render列表
+   * @param options
+   */
+  renderItem(options: { index: number; data: T }): JSX.Element;
+
+  loadPage(d: TData<T>): Promise<TData<T>>;
+}

package/es/DynamicList/utils.js

@@ -0,0 +1,6 @@
+export var LIMIT = 10;
+export var skeletonList = Array.from(new Array(LIMIT)).map(function () {
+  return {
+    skeleton: true
+  };
+});

package/es/ErrorFallback/index.js

@@ -0,0 +1,31 @@
+import { Button, Result } from 'antd';
+import React from 'react';
+function ErrorFallback(_ref) {
+  var error = _ref.error,
+    resetErrorBoundary = _ref.resetErrorBoundary;
+  return /*#__PURE__*/React.createElement(Result, {
+    status: "warning",
+    title: /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", null, "\u6E32\u67D3\u5931\u8D25\uFF0C\u8BF7\u5237\u65B0\u91CD\u8BD5!"), /*#__PURE__*/React.createElement("div", {
+      style: {
+        color: 'var(--gray9)',
+        fontStyle: 'italic'
+      }
+    }, error.message)),
+    style: {
+      width: '100%',
+      height: '100%'
+    },
+    extra: /*#__PURE__*/React.createElement(Button, {
+      type: "primary",
+      key: "refresh",
+      onClick: resetErrorBoundary
+    }, "\u70B9\u51FB\u5237\u65B0\uFF0C\u91CD\u8BD5")
+  });
+}
+export var errorBoundaryOptions = {
+  FallbackComponent: ErrorFallback,
+  onReset: function onReset() {
+    return window.location.reload();
+  }
+};
+export default ErrorFallback;

package/es/ErrorFallback/inerface.d.ts

@@ -0,0 +1,48 @@
+import * as React from 'react';
+interface FallbackProps {
+  error: Error;
+  resetErrorBoundary: (...args: Array<unknown>) => void;
+}
+interface ErrorBoundaryPropsWithComponent {
+  onResetKeysChange?: (prevResetKeys: Array<unknown> | undefined, resetKeys: Array<unknown> | undefined) => void;
+  onReset?: (...args: Array<unknown>) => void;
+  onError?: (
+    error: Error,
+    info: {
+      componentStack: string;
+    },
+  ) => void;
+  resetKeys?: Array<unknown>;
+  fallback?: never;
+  FallbackComponent: React.ComponentType<FallbackProps>;
+  fallbackRender?: never;
+}
+interface ErrorBoundaryPropsWithRender {
+  onResetKeysChange?: (prevResetKeys: Array<unknown> | undefined, resetKeys: Array<unknown> | undefined) => void;
+  onReset?: (...args: Array<unknown>) => void;
+  onError?: (
+    error: Error,
+    info: {
+      componentStack: string;
+    },
+  ) => void;
+  resetKeys?: Array<unknown>;
+  fallback?: never;
+  FallbackComponent?: never;
+  fallbackRender: typeof FallbackRender;
+}
+interface ErrorBoundaryPropsWithFallback {
+  onResetKeysChange?: (prevResetKeys: Array<unknown> | undefined, resetKeys: Array<unknown> | undefined) => void;
+  onReset?: (...args: Array<unknown>) => void;
+  onError?: (
+    error: Error,
+    info: {
+      componentStack: string;
+    },
+  ) => void;
+  resetKeys?: Array<unknown>;
+  fallback: React.ReactElement<unknown, string | React.FunctionComponent | typeof React.Component> | null;
+  FallbackComponent?: never;
+  fallbackRender?: never;
+}
+export declare type ErrorBoundaryProps = ErrorBoundaryPropsWithFallback | ErrorBoundaryPropsWithComponent | ErrorBoundaryPropsWithRender;