linkmore-design 1.1.28 → 1.1.30

package/lib/LmEditTable/virtual/VirtualRow.js

@@ -0,0 +1,164 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _context = require("./context");
+
+var _useForkRef = _interopRequireDefault(require("../hooks/useForkRef"));
+
+var _lodash = require("lodash");
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var useOptions = function useOptions(_ref) {
+  var children = _ref.children,
+      ref = _ref.ref,
+      trRef = _ref.trRef;
+
+  var _a;
+
+  var _useStore = (0, _context.useStore)(),
+      state = _useStore.state,
+      dispatch = _useStore.dispatch,
+      instance = _useStore.instance;
+
+  var virtualItems = instance.columnVirtual.virtualItems;
+  var rowHeight = state.rowHeight,
+      totalLen = state.totalLen;
+  var sliceColumns = (0, _react.useMemo)(function () {
+    var _a;
+
+    return (_a = children === null || children === void 0 ? void 0 : children.reduce) === null || _a === void 0 ? void 0 : _a.call(children, function (pre, cur) {
+      var _a, _b;
+
+      if (typeof ((_a = cur.props) === null || _a === void 0 ? void 0 : _a.fixLeft) === 'number') {
+        pre.leftColumns.push(cur);
+        return pre;
+      }
+
+      if (typeof ((_b = cur.props) === null || _b === void 0 ? void 0 : _b.fixRight) === 'number') {
+        pre.rightColumns.push(cur);
+        return pre;
+      }
+
+      pre.centerColumns.push(cur);
+      return pre;
+    }, {
+      leftColumns: [],
+      rightColumns: [],
+      centerColumns: []
+    });
+  }, [children]);
+  (0, _react.useEffect)(function () {
+    dispatch({
+      type: 'changeSliceColumns',
+      sliceColumns: sliceColumns
+    });
+  }, [sliceColumns]); // 非固定列长度
+
+  var centerColumnsLen = (0, _react.useMemo)(function () {
+    var _a, _b;
+
+    return (_b = (_a = sliceColumns === null || sliceColumns === void 0 ? void 0 : sliceColumns.centerColumns) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0;
+  }, [sliceColumns]);
+  (0, _react.useEffect)(function () {
+    if (state.columnsLen !== centerColumnsLen) {
+      dispatch({
+        type: 'changeColumnsLen',
+        columnsLen: centerColumnsLen !== null && centerColumnsLen !== void 0 ? centerColumnsLen : 0
+      });
+    }
+  }, [centerColumnsLen, dispatch, state.columnsLen]); // 获取行的高度
+
+  (0, _react.useEffect)(function () {
+    var initHeight = function initHeight(tempRef) {
+      var _a, _b, _c;
+
+      if (((_a = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight) && !rowHeight && totalLen) {
+        var tempRowHeight = (_c = (_b = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight) !== null && _c !== void 0 ? _c : 0;
+        dispatch({
+          type: 'initHeight',
+          rowHeight: tempRowHeight + 1
+        });
+      }
+    };
+
+    initHeight(Object.prototype.hasOwnProperty.call(ref, 'current') ? ref : trRef);
+  }, [trRef, dispatch, rowHeight, totalLen, ref]); // 横向单元格合并
+
+  var leftColSpan = (0, _react.useMemo)(function () {
+    var _a;
+
+    return (_a = virtualItems[0]) === null || _a === void 0 ? void 0 : _a.index;
+  }, [virtualItems]); // 右侧隐藏数量
+
+  var rightColSpan = (0, _react.useMemo)(function () {
+    var _a;
+
+    return ((_a = sliceColumns === null || sliceColumns === void 0 ? void 0 : sliceColumns.centerColumns) === null || _a === void 0 ? void 0 : _a.length) - (virtualItems === null || virtualItems === void 0 ? void 0 : virtualItems.length) - leftColSpan || 0;
+  }, [(_a = sliceColumns === null || sliceColumns === void 0 ? void 0 : sliceColumns.centerColumns) === null || _a === void 0 ? void 0 : _a.length, virtualItems.length, leftColSpan]);
+  return Object.assign(Object.assign({
+    virtualItems: virtualItems
+  }, sliceColumns), {
+    leftColSpan: leftColSpan,
+    rightColSpan: rightColSpan
+  });
+};
+
+var VirtualRow = /*#__PURE__*/_react.default.memo(function (_a, ref) {
+  var children = _a.children,
+      pref = _a.pref,
+      resetProps = __rest(_a, ["children", "pref"]);
+
+  var trRef = (0, _react.useRef)(null);
+  var clearProps = (0, _lodash.omit)(resetProps, ['dataKey', 'pushAllForm']);
+
+  var _useOptions = useOptions({
+    children: children,
+    ref: ref,
+    trRef: trRef
+  }),
+      virtualItems = _useOptions.virtualItems,
+      leftColumns = _useOptions.leftColumns,
+      centerColumns = _useOptions.centerColumns,
+      rightColumns = _useOptions.rightColumns,
+      leftColSpan = _useOptions.leftColSpan,
+      rightColSpan = _useOptions.rightColSpan;
+
+  return /*#__PURE__*/_react.default.createElement("tr", Object.assign({}, clearProps, {
+    ref: (0, _useForkRef.default)(pref, trRef)
+  }), leftColumns, !!leftColSpan && /*#__PURE__*/_react.default.createElement("td", {
+    key: "leftColSpan",
+    colSpan: leftColSpan
+  }), virtualItems.map(function (virtualCol) {
+    return /*#__PURE__*/_react.default.cloneElement(centerColumns[virtualCol.index], {
+      ref: virtualCol.measureRef
+    });
+  }), !!rightColSpan && /*#__PURE__*/_react.default.createElement("td", {
+    key: "rightColSpan",
+    colSpan: rightColSpan
+  }), rightColumns);
+});
+
+var _default = VirtualRow;
+exports.default = _default;

package/lib/LmEditTable/virtual/VirtualRow2.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface rowProps {
+    children?: any;
+    pref?: any;
+}
+declare const VirtualRow: React.NamedExoticComponent<rowProps>;
+export default VirtualRow;

package/lib/LmEditTable/virtual/VirtualRow2.js

@@ -0,0 +1,78 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _context = require("./context");
+
+var _useForkRef = _interopRequireDefault(require("../hooks/useForkRef"));
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var VirtualRow = /*#__PURE__*/_react.default.memo(function (_a, ref) {
+  var children = _a.children,
+      pref = _a.pref,
+      resetProps = __rest(_a, ["children", "pref"]);
+
+  var _useStore = (0, _context.useStore)(),
+      state = _useStore.state,
+      dispatch = _useStore.dispatch;
+
+  var rowHeight = state.rowHeight,
+      totalLen = state.totalLen;
+  var trRef = (0, _react.useRef)(null); // 列长度
+
+  var columnsLen = (0, _react.useMemo)(function () {
+    var _a;
+
+    return (_a = children === null || children === void 0 ? void 0 : children.length) !== null && _a !== void 0 ? _a : 0;
+  }, [children]);
+  (0, _react.useEffect)(function () {
+    if (state.columnsLen !== columnsLen) {
+      dispatch({
+        type: 'changeColumnsLen',
+        columnsLen: columnsLen !== null && columnsLen !== void 0 ? columnsLen : 0
+      });
+    }
+  }, [columnsLen, dispatch, state.columnsLen]);
+  (0, _react.useEffect)(function () {
+    var initHeight = function initHeight(tempRef) {
+      var _a, _b, _c;
+
+      if (((_a = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight) && !rowHeight && totalLen) {
+        var tempRowHeight = (_c = (_b = tempRef === null || tempRef === void 0 ? void 0 : tempRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight) !== null && _c !== void 0 ? _c : 0;
+        dispatch({
+          type: 'initHeight',
+          rowHeight: tempRowHeight
+        });
+      }
+    };
+
+    initHeight(trRef);
+  }, [trRef, dispatch, rowHeight, totalLen, ref]);
+  return /*#__PURE__*/_react.default.createElement("tr", Object.assign({}, resetProps, {
+    ref: (0, _useForkRef.default)(pref, trRef)
+  }), children);
+});
+
+var _default = VirtualRow;
+exports.default = _default;

package/lib/LmEditTable/virtual/VirtualTable.d.ts

@@ -0,0 +1,3 @@
+import React, { PropsWithChildren } from 'react';
+declare const VirtualTable: React.MemoExoticComponent<(tableProps: PropsWithChildren<any>) => JSX.Element>;
+export default VirtualTable;

package/lib/LmEditTable/virtual/VirtualTable.js

@@ -0,0 +1,81 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactVirtual = require("react-virtual");
+
+var _context = require("./context");
+
+var VirtualTable = /*#__PURE__*/_react.default.memo(function (tableProps) {
+  var _a, _b, _c, _d;
+
+  var fn = tableProps.fn;
+  var bodyRef = (0, _react.useRef)(null);
+
+  var _useRealive = (0, _context.useRealive)(),
+      _useRealive2 = (0, _slicedToArray2.default)(_useRealive, 2),
+      state = _useRealive2[0],
+      dispatch = _useRealive2[1]; // 行虚拟化 { totalSize, virtualItems }
+
+
+  var rowVirtual = (0, _reactVirtual.useVirtual)({
+    size: state.totalLen,
+    // 绑定父节点
+    parentRef: {
+      current: (_a = bodyRef === null || bodyRef === void 0 ? void 0 : bodyRef.current) === null || _a === void 0 ? void 0 : _a.parentNode
+    },
+    estimateSize: _react.default.useCallback(function () {
+      return state.rowHeight;
+    }, [state.rowHeight]),
+    overscan: 5
+  });
+  fn.current = rowVirtual.scrollToIndex; // 列动态宽度
+
+  var columnEstimateSize = (0, _react.useCallback)(function (i) {
+    var _a, _b;
+
+    var colWidths = (_b = (_a = tableProps === null || tableProps === void 0 ? void 0 : tableProps.children[0]) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.colWidths;
+    var leftColumnsLen = state.sliceColumns.leftColumns.length;
+    var centerColumnsLen = state.sliceColumns.centerColumns.length; // 获取非固定列
+
+    var virList = colWidths.slice(leftColumnsLen, leftColumnsLen + centerColumnsLen);
+    return virList[i] || 0;
+  }, [(_c = (_b = tableProps.children[0]) === null || _b === void 0 ? void 0 : _b.props) === null || _c === void 0 ? void 0 : _c.colWidths, state.sliceColumns.leftColumns.length, state.sliceColumns.centerColumns.length]); // 列虚拟化
+
+  var columnVirtual = (0, _reactVirtual.useVirtual)({
+    horizontal: true,
+    size: state.columnsLen,
+    parentRef: {
+      current: (_d = bodyRef === null || bodyRef === void 0 ? void 0 : bodyRef.current) === null || _d === void 0 ? void 0 : _d.parentNode
+    },
+    estimateSize: columnEstimateSize,
+    overscan: 5
+  });
+  var instance = {
+    rowVirtual: rowVirtual,
+    columnVirtual: columnVirtual
+  };
+  return /*#__PURE__*/_react.default.createElement(_context.TableContext.Provider, {
+    value: {
+      state: state,
+      dispatch: dispatch,
+      instance: instance
+    }
+  }, /*#__PURE__*/_react.default.createElement("table", Object.assign({
+    ref: bodyRef
+  }, tableProps)));
+});
+
+var _default = VirtualTable;
+exports.default = _default;

package/lib/LmEditTable/virtual/VirtualWrapper.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const VirtualWrapper: React.MemoExoticComponent<(wrapperProps: React.PropsWithChildren<any>) => JSX.Element>;
+export default VirtualWrapper;

package/lib/LmEditTable/virtual/VirtualWrapper.js

@@ -0,0 +1,73 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _context = require("./context");
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var VirtualWrapper = /*#__PURE__*/_react.default.memo(function (wrapperProps) {
+  var _a, _b;
+
+  var children = wrapperProps.children,
+      resetProps = __rest(wrapperProps, ["children"]);
+
+  var _useStore = (0, _context.useStore)(),
+      state = _useStore.state,
+      dispatch = _useStore.dispatch,
+      instance = _useStore.instance;
+
+  var _instance$rowVirtual = instance.rowVirtual,
+      virtualItems = _instance$rowVirtual.virtualItems,
+      totalSize = _instance$rowVirtual.totalSize;
+  var contents = (0, _react.useMemo)(function () {
+    return children[1];
+  }, [children]);
+  var contentsLen = (0, _react.useMemo)(function () {
+    var _a;
+
+    return (_a = contents === null || contents === void 0 ? void 0 : contents.length) !== null && _a !== void 0 ? _a : 0;
+  }, [contents]);
+  (0, _react.useEffect)(function () {
+    if (state.totalLen !== contentsLen) {
+      dispatch({
+        type: 'changeTotalLen',
+        totalLen: contentsLen !== null && contentsLen !== void 0 ? contentsLen : 0
+      });
+    }
+  }, [contentsLen, dispatch, state.totalLen]);
+  var paddingTop = virtualItems.length > 0 ? ((_a = virtualItems === null || virtualItems === void 0 ? void 0 : virtualItems[0]) === null || _a === void 0 ? void 0 : _a.start) || 0 : 0;
+  var paddingBottom = virtualItems.length > 0 ? totalSize - (((_b = virtualItems === null || virtualItems === void 0 ? void 0 : virtualItems[virtualItems.length - 1]) === null || _b === void 0 ? void 0 : _b.end) || 0) : 0;
+  return /*#__PURE__*/_react.default.createElement("tbody", Object.assign({}, resetProps), paddingTop > 0 && /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", {
+    style: {
+      height: "".concat(paddingTop, "px")
+    }
+  })), children[0], virtualItems.map(function (virtualRow) {
+    return contents[virtualRow.index];
+  }), paddingBottom > 0 && /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", {
+    style: {
+      height: "".concat(paddingBottom, "px")
+    }
+  })));
+});
+
+var _default = VirtualWrapper;
+exports.default = _default;

package/lib/LmEditTable/virtual/context.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+declare const TableContext: import("react").Context<{
+    state: any;
+    dispatch: any;
+    instance: any;
+}>;
+declare const useStore: () => {
+    state: any;
+    dispatch: any;
+    instance: any;
+};
+declare const useRealive: () => [any, import("react").Dispatch<any>];
+export { TableContext, useStore, useRealive };

package/lib/LmEditTable/virtual/context.js

@@ -0,0 +1,76 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useStore = exports.useRealive = exports.TableContext = void 0;
+
+var _react = require("react");
+
+// =============== context ============== //
+var TableContext = /*#__PURE__*/(0, _react.createContext)({
+  state: null,
+  dispatch: null,
+  instance: {}
+});
+exports.TableContext = TableContext;
+
+var useStore = function useStore() {
+  return (0, _react.useContext)(TableContext);
+};
+
+exports.useStore = useStore;
+var initialState = {
+  // 行高度
+  rowHeight: 0,
+  columnsLen: 0,
+  // 总行数
+  totalLen: 0,
+  // 分割后的列数组
+  sliceColumns: {
+    leftColumns: [],
+    centerColumns: [],
+    rightColumns: []
+  }
+};
+
+var reducer = function reducer(state, action) {
+  var totalLen = action.totalLen,
+      columnsLen = action.columnsLen,
+      rowHeight = action.rowHeight,
+      sliceColumns = action.sliceColumns;
+
+  switch (action.type) {
+    // 数据数量
+    case 'changeTotalLen':
+      return Object.assign(Object.assign({}, state), {
+        totalLen: totalLen
+      });
+    // 列数量
+
+    case 'changeColumnsLen':
+      return Object.assign(Object.assign({}, state), {
+        columnsLen: columnsLen
+      });
+    // 初始化行高度
+
+    case 'initHeight':
+      return Object.assign(Object.assign({}, state), {
+        rowHeight: rowHeight
+      });
+
+    case 'changeSliceColumns':
+      return Object.assign(Object.assign({}, state), {
+        sliceColumns: sliceColumns
+      });
+
+    default:
+      throw new Error();
+  }
+};
+
+var useRealive = function useRealive() {
+  return (0, _react.useReducer)(reducer, initialState);
+};
+
+exports.useRealive = useRealive;

package/lib/LmEditTable/virtual/index.d.ts

@@ -0,0 +1,4 @@
+import VirtualTable from './VirtualTable';
+import VirtualWrapper from './VirtualWrapper';
+import VirtualRow from './VirtualRow';
+export { VirtualTable, VirtualWrapper, VirtualRow };

package/lib/LmEditTable/virtual/index.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "VirtualRow", {
+  enumerable: true,
+  get: function get() {
+    return _VirtualRow.default;
+  }
+});
+Object.defineProperty(exports, "VirtualTable", {
+  enumerable: true,
+  get: function get() {
+    return _VirtualTable.default;
+  }
+});
+Object.defineProperty(exports, "VirtualWrapper", {
+  enumerable: true,
+  get: function get() {
+    return _VirtualWrapper.default;
+  }
+});
+
+var _VirtualTable = _interopRequireDefault(require("./VirtualTable"));
+
+var _VirtualWrapper = _interopRequireDefault(require("./VirtualWrapper"));
+
+var _VirtualRow = _interopRequireDefault(require("./VirtualRow"));