@lemon-fe/components 0.0.0

package/es/BaseTable/VirtualBody.js

@@ -0,0 +1,165 @@
+var _excluded = ["children"];
+
+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; }
+
+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 _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; }
+
+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 React, { useContext, useEffect, useMemo, useRef, useState } from 'react';
+import { useThrottle } from '@lemon-fe/hooks';
+import { get } from 'lodash';
+import BaseTableContext from './BaseTableContext';
+import { PREFIX_CLS } from '../constants';
+export default function VirtualList(props) {
+  var children = props.children,
+      restProps = _objectWithoutProperties(props, _excluded);
+
+  var ref = useRef(null);
+
+  var _useContext = useContext(BaseTableContext),
+      scrollY = _useContext.scrollY,
+      _useContext$rowHeight = _useContext.rowHeight,
+      rowHeight = _useContext$rowHeight === void 0 ? 37 : _useContext$rowHeight;
+
+  var _useState = useState(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      range = _useState2[0],
+      setRange = _useState2[1];
+
+  var getRange = function getRange() {
+    var height = Number(scrollY);
+
+    if (isNaN(height)) {
+      return null;
+    }
+
+    var body = ref.current;
+
+    if (body === null) {
+      return null;
+    }
+
+    var scroller = body.closest('.ant-table-body');
+
+    if (scroller === null) {
+      return null;
+    }
+
+    var pageSize = Math.ceil(height / rowHeight);
+    var offset = Math.round(scroller.scrollTop / rowHeight);
+    var start = offset - Math.floor(pageSize / 2);
+
+    if (start < 0) {
+      start = 0;
+    }
+
+    var end = offset + pageSize + Math.ceil(pageSize / 2) - 1;
+    var bufferSpace = height * 0.3;
+    return {
+      start: start,
+      end: end,
+      isTop: scroller.scrollTop - body.offsetTop <= bufferSpace,
+      isBottom: body.offsetHeight + body.offsetTop - (scroller.scrollTop + height) <= bufferSpace
+    };
+  };
+
+  var handleScroll = useThrottle(function () {
+    var mRange = getRange();
+
+    if (mRange === null) {
+      return;
+    }
+
+    var isTop = mRange.isTop,
+        isBottom = mRange.isBottom;
+
+    if (!isTop && !isBottom) {
+      return;
+    }
+
+    setRange(mRange);
+  }, 300, {
+    trailing: true
+  });
+  useEffect(function () {
+    setRange(getRange());
+  }, [get(children, ['1', 'length']), rowHeight, scrollY]);
+  var render = useMemo(function () {
+    var _children = _slicedToArray(children, 2),
+        measureRow = _children[0],
+        rows = _children[1];
+
+    if (!Array.isArray(rows)) {
+      return [children, 0, 0];
+    }
+
+    if (range === null) {
+      return [measureRow, 0, 0];
+    }
+
+    var list = [];
+    var max = rows.length - 1;
+    var start = range.start,
+        end = range.end;
+
+    if (end > max) {
+      end = max;
+    }
+
+    for (var i = start; i <= end; i += 1) {
+      list.push(rows[i]);
+    }
+
+    return [[measureRow, list], start * rowHeight, (max - end) * rowHeight];
+  }, [children, range]);
+  useEffect(function () {
+    var _ref$current;
+
+    if (ref.current === null) {
+      return;
+    }
+
+    var tableBody = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.closest('.ant-table-body');
+
+    if (tableBody === null) {
+      return;
+    }
+
+    tableBody.addEventListener('scroll', handleScroll);
+    return function () {
+      tableBody.removeEventListener('scroll', handleScroll);
+    };
+  }, []);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("tbody", {
+    className: "".concat(PREFIX_CLS, "-table-append-before"),
+    style: {
+      display: 'block',
+      height: render[1]
+    }
+  }), /*#__PURE__*/React.createElement("tbody", _objectSpread(_objectSpread({}, restProps), {}, {
+    ref: ref
+  }), render[0]), /*#__PURE__*/React.createElement("tbody", {
+    className: "".concat(PREFIX_CLS, "-table-append-after"),
+    style: {
+      display: 'block',
+      height: render[2]
+    }
+  }));
+}

package/es/BaseTable/index.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import type { BaseTableProps as Props } from './typings';
+declare function BaseTable<T extends Record<string, any>>(props: Props<T>): JSX.Element;
+declare namespace BaseTable {
+    var Summary: typeof import("rc-table/lib/Footer/Summary").default;
+}
+export default BaseTable;

package/es/BaseTable/index.js

@@ -0,0 +1,371 @@
+var _excluded = ["onWidthChange", "width", "fullTableRef"],
+    _excluded2 = ["id", "columns", "defaultColumnProps", "rowKey", "children", "summaryTitle", "summaryRecord", "dataSource", "onSortChange", "sort", "scroll", "virtual", "components", "pagination", "onChange", "rowHeight", "tableLayout"];
+
+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 _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 _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; }
+
+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; }
+
+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; }
+
+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; }
+
+import React, { useMemo, useState, useEffect, useRef } from 'react';
+import { Table as AntdTable } from 'antd';
+import { get } from 'lodash';
+import { useThrottle } from '@lemon-fe/hooks';
+import { isColumnType, getColumnKey, randomStr } from './utils';
+import ResizeHeaderCell from './ResizeHeaderCell';
+import { PREFIX_CLS } from '../constants';
+import VirtualList from './VirtualBody';
+import BaseTableContext from './BaseTableContext';
+
+function formatSummary(summary) {
+  if (!summary) {
+    return summary;
+  }
+
+  var obj = _objectSpread({}, summary);
+
+  var pretty = new Intl.NumberFormat('en-US', {
+    minimumFractionDigits: 2,
+    maximumFractionDigits: 2
+  });
+  Object.keys(obj).forEach(function (key) {
+    if (obj.hasOwnProperty(key) && typeof obj[key] === 'number') {
+      obj[key] = pretty.format(obj[key]);
+    }
+  });
+  return obj;
+}
+
+function Th(props) {
+  var onWidthChange = props.onWidthChange,
+      width = props.width,
+      fullTableRef = props.fullTableRef,
+      restProps = _objectWithoutProperties(props, _excluded);
+
+  if (!width || !onWidthChange) {
+    return /*#__PURE__*/React.createElement("th", _objectSpread({}, restProps));
+  }
+
+  return /*#__PURE__*/React.createElement(ResizeHeaderCell, {
+    width: width,
+    onChange: onWidthChange,
+    fullTableRef: fullTableRef,
+    prefixCls: "".concat(PREFIX_CLS, "-table")
+  }, /*#__PURE__*/React.createElement("th", _objectSpread({}, restProps)));
+}
+
+function BaseTable(props) {
+  var id = props.id,
+      columns = props.columns,
+      defaultColumnProps = props.defaultColumnProps,
+      rowKey = props.rowKey,
+      children = props.children,
+      summaryTitle = props.summaryTitle,
+      summaryRecord = props.summaryRecord,
+      _props$dataSource = props.dataSource,
+      dataSource = _props$dataSource === void 0 ? [] : _props$dataSource,
+      onSortChange = props.onSortChange,
+      defaultSort = props.sort,
+      scroll = props.scroll,
+      virtual = props.virtual,
+      componentsProp = props.components,
+      paginationProp = props.pagination,
+      onChangeProp = props.onChange,
+      rowHeight = props.rowHeight,
+      _props$tableLayout = props.tableLayout,
+      tableLayout = _props$tableLayout === void 0 ? 'fixed' : _props$tableLayout,
+      restProps = _objectWithoutProperties(props, _excluded2);
+
+  var fullTableRef = useRef(null);
+  var tableID = useMemo(function () {
+    return id || randomStr();
+  }, [id]);
+
+  var _useState = useState(0),
+      _useState2 = _slicedToArray(_useState, 2),
+      scrollY = _useState2[0],
+      setScrollY = _useState2[1];
+
+  var _useState3 = useState(new Map()),
+      _useState4 = _slicedToArray(_useState3, 2),
+      colsState = _useState4[0],
+      setColsState = _useState4[1];
+
+  useEffect(function () {
+    fullTableRef.current = document.getElementById(tableID);
+  }, [tableID]);
+  /** auto scroll y */
+
+  var calcScrollY = function calcScrollY() {
+    var table = fullTableRef.current;
+
+    if (table === null) {
+      return null;
+    }
+
+    var wrapper = table.closest('.ant-table-wrapper');
+    var tableBody = table.querySelector('.ant-table-body');
+
+    if (tableBody === null || wrapper === null) {
+      return null;
+    }
+
+    var parent = wrapper.parentElement;
+
+    if (parent === null) {
+      return null;
+    }
+
+    var style = getComputedStyle(parent);
+    var contentHeight = parent.offsetHeight - (parseFloat(style.getPropertyValue('padding-top')) || 0) - (parseFloat(style.getPropertyValue('padding-bottom')) || 0);
+    var nodes = [];
+
+    if (tableBody.previousElementSibling !== null) {
+      nodes.push(tableBody.previousElementSibling);
+    }
+
+    if (tableBody.nextElementSibling !== null) {
+      nodes.push(tableBody.nextElementSibling);
+    }
+
+    if (table.nextElementSibling !== null) {
+      nodes.push(table.nextElementSibling);
+    }
+
+    contentHeight -= nodes.reduce(function (prev, dom) {
+      var cpStyle = window.getComputedStyle(dom);
+      var height = dom.offsetHeight + (parseFloat(cpStyle.getPropertyValue('margin-top')) || 0) + (parseFloat(cpStyle.getPropertyValue('margin-bottom')) || 0);
+      return prev + height;
+    }, 0);
+    return contentHeight;
+  };
+
+  var changeScrollY = useThrottle(function () {
+    if ((scroll === null || scroll === void 0 ? void 0 : scroll.y) === true) {
+      var y = calcScrollY();
+      setScrollY(y || undefined);
+    } else {
+      setScrollY(scroll === null || scroll === void 0 ? void 0 : scroll.y);
+    }
+  }, 80, {
+    trailing: true
+  });
+  useEffect(function () {
+    changeScrollY();
+  }, [scroll === null || scroll === void 0 ? void 0 : scroll.y, dataSource]);
+  useEffect(function () {
+    window.addEventListener('resize', changeScrollY);
+    return function () {
+      window.removeEventListener('resize', changeScrollY);
+    };
+  }, []);
+
+  var handleChange = function handleChange() {
+    changeScrollY();
+
+    if (onChangeProp) {
+      onChangeProp.apply(void 0, arguments);
+    }
+  };
+  /** resizable column */
+
+
+  var _useMemo = useMemo(function () {
+    var flattenCols = [];
+    var isFixedLayout = tableLayout === 'fixed';
+    var hasAutoWidthCol = false;
+
+    var traverse = function traverse(cols) {
+      var path = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+      return cols.map(function (col, index) {
+        var currPath = [].concat(_toConsumableArray(path), [index]);
+
+        if (isColumnType(col)) {
+          var colKey = getColumnKey(col);
+
+          var nextCol = _objectSpread(_objectSpread({}, defaultColumnProps), col);
+
+          var colState = colsState.get(colKey);
+
+          if (colState && colState.width !== undefined) {
+            nextCol.width = colState.width;
+          }
+
+          if (isFixedLayout && !!nextCol.title) {
+            if (nextCol.width === undefined) {
+              nextCol.width = 160;
+            } else if (nextCol.width === 'auto') {
+              nextCol.width = undefined;
+            }
+          }
+
+          if (!nextCol.width) {
+            hasAutoWidthCol = true;
+          }
+
+          if (nextCol.width && !nextCol.fixed) {
+            if (nextCol.ellipsis === undefined) {
+              nextCol.ellipsis = true;
+            }
+
+            nextCol.onHeaderCell = function () {
+              return {
+                width: nextCol.width,
+                fullTableRef: fullTableRef,
+                onWidthChange: function onWidthChange(size) {
+                  setColsState(function (prev) {
+                    var prevItem = prev.get(colKey);
+
+                    if (prevItem !== undefined && prevItem.width === size) {
+                      return prev;
+                    }
+
+                    prevItem = _objectSpread(_objectSpread({}, prevItem), {}, {
+                      width: size
+                    });
+                    var next = new Map(prev);
+                    next.set(colKey, prevItem);
+                    return next;
+                  });
+                }
+              };
+            };
+          }
+
+          flattenCols.push(nextCol);
+          return nextCol;
+        }
+
+        return _objectSpread(_objectSpread(_objectSpread({}, defaultColumnProps), col), {}, {
+          children: traverse(col.children, currPath)
+        });
+      });
+    };
+
+    var newColumns = traverse(columns);
+
+    if (isFixedLayout && !hasAutoWidthCol) {
+      newColumns.push({
+        title: ''
+      });
+    }
+
+    return [newColumns, flattenCols];
+  }, [columns, colsState, tableLayout]),
+      _useMemo2 = _slicedToArray(_useMemo, 2),
+      formatedColumns = _useMemo2[0],
+      flattenColumns = _useMemo2[1];
+  /** virtualize scroll */
+
+
+  var _useMemo3 = useMemo(function () {
+    return {
+      components: _objectSpread({
+        header: {
+          cell: Th
+        },
+        body: virtual ? {
+          wrapper: VirtualList
+        } : undefined
+      }, componentsProp)
+    };
+  }, [virtual]),
+      components = _useMemo3.components;
+  /** summary row */
+
+
+  var summary = useMemo(function () {
+    var Summary = AntdTable.Summary;
+
+    if (!summaryRecord) {
+      return undefined;
+    }
+
+    return function () {
+      var _props$rowSelection;
+
+      var data = formatSummary(summaryRecord);
+      var offset = 0;
+      return /*#__PURE__*/React.createElement(Summary, {
+        fixed: true
+      }, /*#__PURE__*/React.createElement(Summary.Row, null, ((_props$rowSelection = props.rowSelection) === null || _props$rowSelection === void 0 ? void 0 : _props$rowSelection.type) !== undefined && /*#__PURE__*/React.createElement(Summary.Cell, {
+        index: offset++
+      }), flattenColumns.map(function (item, index) {
+        var value;
+
+        if (index === 0) {
+          value = summaryTitle;
+        } else if (item.dataIndex) {
+          value = get(data, item.dataIndex);
+        }
+
+        return /*#__PURE__*/React.createElement(Summary.Cell, {
+          index: index + offset,
+          key: getColumnKey(item) || index,
+          align: item.align
+        }, value);
+      })));
+    };
+  }, [flattenColumns, summaryRecord, summaryTitle]);
+  var ctx = useMemo(function () {
+    return {
+      scrollY: scrollY,
+      rowHeight: rowHeight
+    };
+  }, [scrollY, rowHeight]);
+  return /*#__PURE__*/React.createElement(BaseTableContext.Provider, {
+    value: ctx
+  }, /*#__PURE__*/React.createElement(AntdTable, _objectSpread(_objectSpread({
+    size: "small",
+    id: tableID,
+    columns: formatedColumns,
+    dataSource: dataSource,
+    rowKey: rowKey,
+    summary: summary,
+    scroll: {
+      x: (scroll === null || scroll === void 0 ? void 0 : scroll.x) || '100%',
+      y: scrollY
+    },
+    components: components,
+    onChange: handleChange,
+    tableLayout: tableLayout
+  }, restProps), {}, {
+    pagination: paginationProp !== false ? _objectSpread({
+      size: 'small',
+      pageSizeOptions: ['10', '20', '50', '100'],
+      showSizeChanger: true,
+      showQuickJumper: true,
+      showTotal: function showTotal(val) {
+        return "\u5171".concat(val, "\u6761");
+      },
+      defaultPageSize: 20
+    }, paginationProp) : false
+  })));
+}
+
+BaseTable.Summary = AntdTable.Summary;
+export default BaseTable;

package/es/BaseTable/index.less

@@ -0,0 +1,103 @@
+@tablePrefixCls: lemon-table;
+@font-size-base: 14px;
+@resize-indicator-color: #333;
+
+.ant-table-thead > tr > th {
+  border-bottom: none;
+
+  &::before {
+    display: none;
+  }
+}
+
+.ant-table-body {
+  scrollbar-width: thin;
+
+  &::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: #ddd;
+  }
+
+  &::-webkit-scrollbar-track {
+    background-color: #fff;
+  }
+}
+
+.ant-table-cell {
+  .ant-checkbox-checked .ant-checkbox-inner::after {
+    transition: none !important;
+  }
+
+  .ant-checkbox-inner {
+    transition: none !important;
+  }
+
+  .ant-checkbox-checked::after {
+    animation: none !important;
+  }
+}
+
+.ant-table-pagination.ant-pagination {
+  margin-bottom: 0;
+}
+
+.@{tablePrefixCls} {
+  position: relative;
+  box-sizing: border-box;
+  color: @text-color;
+  font-size: @font-size-base;
+
+  &-resizable-handle {
+    position: absolute;
+    top: 50%;
+    right: -5px;
+    z-index: 1;
+    box-sizing: border-box;
+    width: 11px;
+    height: 12px;
+    margin-top: -6px;
+    cursor: col-resize;
+
+    & > div {
+      width: 1px;
+      height: 100%;
+      margin: 0 auto;
+      background-color: #bbb;
+    }
+  }
+
+  &-resizable-indicator {
+    position: absolute;
+    top: 0;
+    z-index: 20;
+    width: 1px;
+    background-color: @resize-indicator-color;
+  }
+
+  &-resizing-col thead th {
+    user-select: none;
+  }
+
+  &-sort {
+    display: flex;
+    align-items: center;
+    cursor: pointer;
+
+    &-title {
+      margin-right: 10px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    &-number {
+      margin-left: 4px;
+      color: #999;
+      font-weight: normal;
+      font-size: 12px;
+    }
+  }
+}

package/es/BaseTable/typings.d.ts

@@ -0,0 +1,32 @@
+import type { ReactText } from 'react';
+import { TableProps, TableColumnType, TableColumnGroupType, TableColumnsType } from 'antd';
+
+export type ColumnType<T> = TableColumnType<T>;
+
+export type ColumnGroupType<T> = TableColumnGroupType<T>;
+
+export type ColumnsType<T> = TableColumnsType<T>;
+
+export interface BaseTableProps<T> extends Omit<TableProps<T>, 'columns' | 'scroll'> {
+  defaultColumnProps?: Partial<ColumnType<T>>;
+  /**
+   * @description 当width为auto时为自适应列宽，默认为160
+   */
+  columns: ColumnsType<T>;
+  summaryRecord?: any;
+  summaryTitle?: string;
+  sort?: [ReactText, string][];
+  onSortChange?: (sort: [ReactText, string][]) => void;
+  /**
+   * @description 行高 默认为37，如果表格行有边界，需要包含边界
+   */
+  rowHeight?: number;
+  /**
+   * @description 虚拟列表 行高必须一致 并且需要指定rowHeight
+   */
+  virtual?: boolean;
+  scroll?: {
+    x?: number | string | true;
+    y?: number | string | true;
+  };
+}

package/es/BaseTable/utils.d.ts

@@ -0,0 +1,4 @@
+import { ColumnType, ColumnGroupType } from './typings';
+export declare function isColumnType<T>(col: ColumnGroupType<T> | ColumnType<T>): col is ColumnType<T>;
+export declare function getColumnKey(col: ColumnType<any>): string | number;
+export declare function randomStr(): string;