@qsxy/element-plus-react 1.0.0-next.10 → 1.0.0-next.12

package/dist/Table/TableCell.js

@@ -1,249 +1,308 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+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); }
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
+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 _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+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 classNames from 'classnames';
+import { addClass, hasClass, removeClass } from 'dom-lib';
+import isEqual from 'lodash/isEqual';
+import last from 'lodash/last';
+import omit from 'lodash/omit';
+import some from 'lodash/some';
+import uniqWith from 'lodash/uniqWith';
+import words from 'lodash/words';
+import React, { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { createRoot } from 'react-dom/client';
+// import { SortableHandle } from 'react-sortable-hoc';
+import Checkbox from "../Checkbox/Checkbox";
+import Icon from "../Icon/Icon";
+import { isEmpty, isNotEmpty } from "../Util";
+import { useClassNames, useUpdateEffect } from "../hooks";
+import { TableBodyContext, TableContext } from "./TableContext";
+import { activeRow, onCheck } from "./hooks/useSelection";
+import { addTreeChildren, getAllChildren, mergeTreeData } from "./treeUtil";
+import { createTablePopper, getRowIdentity, getRowIndex, getStyle, insertAfter } from "./util";
+var TableCell = function TableCell(p) {
+  var row = p.row,
+    column = p.column,
+    columnIndex = p.columnIndex,
+    _p$className = p.className,
+    className = _p$className === void 0 ? '' : _p$className,
+    _p$style = p.style,
+    style = _p$style === void 0 ? {} : _p$style,
+    _p$rowSpan = p.rowSpan,
+    rowSpan = _p$rowSpan === void 0 ? 1 : _p$rowSpan,
+    _p$colSpan = p.colSpan,
+    colSpan = _p$colSpan === void 0 ? 1 : _p$colSpan;
+  var _useContext = useContext(TableContext),
+    data = _useContext.data,
+    setData = _useContext.setData,
+    props = _useContext.props,
+    tableRefs = _useContext.tableRefs,
+    flattenColumns = _useContext.flattenColumns;
+  var _useContext2 = useContext(TableBodyContext),
+    state = _useContext2.state,
+    dispatch = _useContext2.dispatch,
+    disabledRows = _useContext2.disabledRows,
+    isTreeExpandCell = _useContext2.isTreeExpandCell,
+    treeProps = _useContext2.treeProps,
+    treeNodes = _useContext2.treeNodes,
+    initialData = _useContext2.initialData,
+    sortedData = _useContext2.sortedData;
+  var cellClassName = props.cellClassName,
+    cellStyle = props.cellStyle,
+    onSelect = props.onSelect,
+    onSelectionChange = props.onSelectionChange,
+    onCellMouseEnter = props.onCellMouseEnter,
+    onCellMouseLeave = props.onCellMouseLeave,
+    onCellClick = props.onCellClick,
+    onCellDblclick = props.onCellDblclick,
+    onCellContextmenu = props.onCellContextmenu,
+    onRowClick = props.onRowClick,
+    onRowContextmenu = props.onRowContextmenu,
+    onRowDblclick = props.onRowDblclick,
+    _props$expandable = props.expandable,
+    expandable = _props$expandable === void 0 ? function () {
+      return Promise.resolve(true);
+    } : _props$expandable,
+    onExpandChange = props.onExpandChange,
+    hideIconOnNotExpand = props.hideIconOnNotExpand,
+    highlightCurrentRow = props.highlightCurrentRow,
+    onCurrentChange = props.onCurrentChange,
+    tableLayout = props.tableLayout,
+    rowHeight = props.rowHeight,
+    rowKey = props.rowKey,
+    _props$indent = props.indent,
+    indent = _props$indent === void 0 ? 16 : _props$indent,
+    lazy = props.lazy,
+    load = props.load;
+  var _useClassNames = useClassNames('table'),
+    b = _useClassNames.b,
+    bm = _useClassNames.bm,
+    e = _useClassNames.e,
+    em = _useClassNames.em,
+    is = _useClassNames.is;
+  var expand = useRef(false);
+  var trRef = useRef(null);
+  var tdRef = useRef(null);
+  var expandCell = useRef(null);
+  // 树形表格开始展开/折叠行树，为了保证递归展开/折叠行时不重复执行
+  var startRowIndex = useRef(null);
+  var nextRow = useRef(null);
+  var rootRef = useRef(null);
+  var tooltipRef = useRef(null);
+  // 懒加载
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    loading = _useState2[0],
+    setLoading = _useState2[1];
 
-// src/Table/TableCell.tsx
-var TableCell_exports = {};
-__export(TableCell_exports, {
-  default: () => TableCell_default
-});
-module.exports = __toCommonJS(TableCell_exports);
-var import_classnames = __toESM(require("classnames"));
-var import_dom_lib = require("dom-lib");
-var import_isEqual = __toESM(require("lodash/isEqual"));
-var import_last = __toESM(require("lodash/last"));
-var import_omit = __toESM(require("lodash/omit"));
-var import_some = __toESM(require("lodash/some"));
-var import_uniqWith = __toESM(require("lodash/uniqWith"));
-var import_words = __toESM(require("lodash/words"));
-var import_react = __toESM(require("react"));
-var import_react_dom = require("react-dom");
-var import_client = require("react-dom/client");
-var import_Checkbox = require("../Checkbox");
-var import_Icon = require("../Icon");
-var import_Util = require("../Util");
-var import_hooks = require("../hooks");
-var import_TableContext = require("./TableContext");
-var import_useSelection = require("./hooks/useSelection");
-var import_treeUtil = require("./treeUtil");
-var import_util = require("./util");
-var TableCell = (p) => {
-  const { row, column, columnIndex, className = "", style = {}, rowSpan = 1, colSpan = 1 } = p;
-  const { data, setData, props, tableRefs, flattenColumns } = (0, import_react.useContext)(import_TableContext.TableContext);
-  const { state, dispatch, disabledRows, isTreeExpandCell, treeProps, treeNodes, initialData, sortedData } = (0, import_react.useContext)(import_TableContext.TableBodyContext);
-  const {
-    cellClassName,
-    cellStyle,
-    onSelect,
-    onSelectionChange,
-    onCellMouseEnter,
-    onCellMouseLeave,
-    onCellClick,
-    onCellDblclick,
-    onCellContextmenu,
-    onRowClick,
-    onRowContextmenu,
-    onRowDblclick,
-    expandable = () => Promise.resolve(true),
-    onExpandChange,
-    hideIconOnNotExpand,
-    highlightCurrentRow,
-    onCurrentChange,
-    tableLayout,
-    rowHeight,
-    rowKey,
-    indent = 16,
-    lazy,
-    load
-  } = props;
-  const { b, bm, e, em, is } = (0, import_hooks.useClassNames)("table");
-  const expand = (0, import_react.useRef)(false);
-  const trRef = (0, import_react.useRef)(null);
-  const tdRef = (0, import_react.useRef)(null);
-  const expandCell = (0, import_react.useRef)(null);
-  const startRowIndex = (0, import_react.useRef)();
-  const nextRow = (0, import_react.useRef)(null);
-  const rootRef = (0, import_react.useRef)(null);
-  const tooltipRef = (0, import_react.useRef)(null);
-  const [loading, setLoading] = (0, import_react.useState)(false);
-  const handleCellMouseEnter = (0, import_react.useCallback)(
-    (_row, _column, event) => {
-      onCellMouseEnter == null ? void 0 : onCellMouseEnter(_row, _column, event.currentTarget, event);
-      if (!["index", "selection"].includes((_column == null ? void 0 : _column.type) || "") && column.showOverflowTooltip) {
-        const cell = event.currentTarget;
-        const cellChild = event.currentTarget.querySelector("." + e`cell-content`);
-        const range = document.createRange();
-        range.setStart(cellChild, 0);
-        range.setEnd(cellChild, cellChild.childNodes.length);
-        const rangeWidth = range.getBoundingClientRect().width;
-        const padding = (Number.parseInt((0, import_util.getStyle)(cellChild, "paddingLeft"), 10) || 0) + (Number.parseInt((0, import_util.getStyle)(cellChild, "paddingRight"), 10) || 0);
-        if (rangeWidth + padding > cellChild.offsetWidth || cellChild.scrollWidth > cellChild.offsetWidth) {
-          tableRefs.tableWrapper.current && (0, import_util.createTablePopper)(
-            tableRefs.tableWrapper.current,
-            // {
-            //     getBoundingClientRect: tableRefs.tableWrapper.current.getBoundingClientRect(),
-            // },
-            cell,
-            cell.innerText || cell.textContent || "",
-            tooltipRef
-          );
-        }
+  /** 鼠标悬浮单元格事件 */
+  var handleCellMouseEnter = useCallback(function (_row, _column, event) {
+    onCellMouseEnter === null || onCellMouseEnter === void 0 || onCellMouseEnter(_row, _column, event.currentTarget, event);
+    if (!['index', 'selection'].includes((_column === null || _column === void 0 ? void 0 : _column.type) || '') && column.showOverflowTooltip) {
+      var cell = event.currentTarget;
+      var cellChild = event.currentTarget.querySelector('.' + e(_templateObject || (_templateObject = _taggedTemplateLiteral(["cell-content"]))));
+      var range = document.createRange();
+      range.setStart(cellChild, 0);
+      range.setEnd(cellChild, cellChild.childNodes.length);
+      var rangeWidth = range.getBoundingClientRect().width;
+      var padding = (Number.parseInt(getStyle(cellChild, 'paddingLeft'), 10) || 0) + (Number.parseInt(getStyle(cellChild, 'paddingRight'), 10) || 0);
+      if (rangeWidth + padding > cellChild.offsetWidth || cellChild.scrollWidth > cellChild.offsetWidth) {
+        // tableRefs.tableWrapper.current && console.log(tableRefs.tableWrapper.current.getBoundingClientRect());
+        tableRefs.tableWrapper.current && createTablePopper(tableRefs.tableWrapper.current,
+        // {
+        //     getBoundingClientRect: tableRefs.tableWrapper.current.getBoundingClientRect(),
+        // },
+        cell, cell.innerText || cell.textContent || '', tooltipRef);
       }
-    },
-    [column.showOverflowTooltip, e, onCellMouseEnter, tableRefs.tableWrapper]
-  );
-  const rowIndex = (0, import_react.useMemo)(() => (0, import_util.getRowIndex)(column.index, p.rowIndex, row), [column.index, p.rowIndex, row]);
-  const disabled = (0, import_react.useMemo)(() => {
-    var _a;
-    return column.type === "selection" && ((_a = column == null ? void 0 : column.selectable) == null ? void 0 : _a.call(column, row, rowIndex)) === false;
+    }
+  }, [column.showOverflowTooltip, e, onCellMouseEnter, tableRefs.tableWrapper]);
+  var rowIndex = useMemo(function () {
+    return getRowIndex(column.index, p.rowIndex, row);
+  }, [column.index, p.rowIndex, row]);
+  var disabled = useMemo(function () {
+    var _column$selectable;
+    return column.type === 'selection' && (column === null || column === void 0 || (_column$selectable = column.selectable) === null || _column$selectable === void 0 ? void 0 : _column$selectable.call(column, row, rowIndex)) === false;
   }, [column, row, rowIndex]);
-  const handleCheck = (0, import_react.useCallback)(
-    (checked, _row) => {
-      var _a;
-      const allChildren = (0, import_treeUtil.getAllChildren)([_row], treeProps, rowKey).filter((item) => {
-        var _a2;
-        return column.type === "selection" && ((_a2 = column == null ? void 0 : column.selectable) == null ? void 0 : _a2.call(column, item, rowIndex)) !== false;
+
+  /** 选中行事件 */
+  var handleCheck = useCallback(function (checked, _row) {
+    var _selectedRows2, _selectedRows3, _disabledRows$current;
+    var allChildren = getAllChildren([_row], treeProps, rowKey).filter(function (item) {
+      var _column$selectable2;
+      return column.type === 'selection' && (column === null || column === void 0 || (_column$selectable2 = column.selectable) === null || _column$selectable2 === void 0 ? void 0 : _column$selectable2.call(column, item, rowIndex)) !== false;
+    });
+    var selectedRows = JSON.parse(JSON.stringify(state.selection));
+    allChildren.forEach(function (item) {
+      if (checked) {
+        selectedRows.push(item);
+      } else {
+        var _selectedRows;
+        selectedRows = (_selectedRows = selectedRows) === null || _selectedRows === void 0 ? void 0 : _selectedRows.filter(function (item1) {
+          return rowKey ? getRowIdentity(item, rowKey) !== getRowIdentity(item1, rowKey) : !isEqual(item, item1);
+        });
+      }
+    });
+    dispatch(onCheck({
+      isIndeterminate: ((_selectedRows2 = selectedRows) === null || _selectedRows2 === void 0 ? void 0 : _selectedRows2.length) > 0 && ((_selectedRows3 = selectedRows) === null || _selectedRows3 === void 0 ? void 0 : _selectedRows3.length) + ((_disabledRows$current = disabledRows.current) === null || _disabledRows$current === void 0 ? void 0 : _disabledRows$current.length) !== data.length,
+      selection: selectedRows
+    }));
+    onSelect === null || onSelect === void 0 || onSelect(selectedRows, _row);
+    onSelectionChange === null || onSelectionChange === void 0 || onSelectionChange(selectedRows);
+  }, [treeProps, rowKey, state.selection, dispatch, disabledRows, data.length, onSelect, onSelectionChange, column, rowIndex]);
+  var getCellStyle = useCallback(function (_column) {
+    var res = {};
+    if (rowHeight && typeof rowHeight === 'number') {
+      Object.assign(res, {
+        height: rowHeight
       });
-      let selectedRows = JSON.parse(JSON.stringify(state.selection));
-      allChildren.forEach((item) => {
-        if (checked) {
-          selectedRows.push(item);
-        } else {
-          selectedRows = selectedRows == null ? void 0 : selectedRows.filter((item1) => rowKey ? (0, import_util.getRowIdentity)(item, rowKey) !== (0, import_util.getRowIdentity)(item1, rowKey) : !(0, import_isEqual.default)(item, item1));
-        }
+    }
+    if (tableLayout === 'fixed' && _column.showOverflowTooltip) {
+      Object.assign(res, {
+        width: (column.width || column.realWidth || column.minWidth || 80) - 1
       });
-      dispatch((0, import_useSelection.onCheck)({ isIndeterminate: (selectedRows == null ? void 0 : selectedRows.length) > 0 && (selectedRows == null ? void 0 : selectedRows.length) + ((_a = disabledRows.current) == null ? void 0 : _a.length) !== data.length, selection: selectedRows }));
-      onSelect == null ? void 0 : onSelect(selectedRows, _row);
-      onSelectionChange == null ? void 0 : onSelectionChange(selectedRows);
-    },
-    [treeProps, rowKey, state.selection, dispatch, disabledRows, data.length, onSelect, onSelectionChange, column, rowIndex]
-  );
-  const getCellStyle = (0, import_react.useCallback)(
-    (_column) => {
-      const res = {};
-      if (rowHeight && typeof rowHeight === "number") {
-        Object.assign(res, { height: rowHeight });
-      }
-      if (tableLayout === "fixed" && _column.showOverflowTooltip) {
-        Object.assign(res, { width: (column.width || column.realWidth || column.minWidth || 80) - 1 });
-      }
-      return res;
-    },
-    [column.minWidth, column.realWidth, column.width, rowHeight, tableLayout]
-  );
-  const getLevel = (0, import_react.useCallback)(
-    (div) => {
-      if (div) {
-        const pattern = new RegExp(em("row", "level-"));
-        const levelClassName = Array.from(div.classList).find((item) => pattern.test(item));
-        if (levelClassName) {
-          const _level = parseFloat((0, import_last.default)((0, import_words.default)(levelClassName)));
-          if (!isNaN(_level)) {
-            return _level;
-          }
+    }
+    return res;
+  }, [column.minWidth, column.realWidth, column.width, rowHeight, tableLayout]);
+
+  /** 获取树形表格行层级 */
+  var getLevel = useCallback(function (div) {
+    if (div) {
+      var pattern = new RegExp(em('row', 'level-'));
+      var levelClassName = Array.from(div.classList).find(function (item) {
+        return pattern.test(item);
+      });
+      if (levelClassName) {
+        var _level = parseFloat(last(words(levelClassName)));
+        if (!isNaN(_level)) {
+          return _level;
         }
       }
-      return 0;
-    },
-    [em]
-  );
-  const expandOrCollapseTreeRow = (0, import_react.useCallback)(
-    (level, willExpand) => {
-      while (nextRow.current) {
-        if ((0, import_dom_lib.hasClass)(nextRow.current, em("row", "level-0"))) {
-          break;
+    }
+    return 0;
+  }, [em]);
+
+  /**
+   * 展开或折叠树形表格行
+   * @param nextRow 下一行表格tr
+   * @param level 树层级
+   * @param willExpand 展开或折叠
+   */
+  var expandOrCollapseTreeRow = useCallback(function (level, willExpand) {
+    var _loop = function _loop() {
+        if (hasClass(nextRow.current, em('row', 'level-0'))) {
+          return 0; // break
         } else {
-          const _level = getLevel(nextRow.current);
+          var _level = getLevel(nextRow.current);
           if (willExpand) {
+            // 展开时，需要保持次级行的展开/折叠情况
             if (level === _level) {
-              const nextId = (0, import_util.getRowIdentity)(data[startRowIndex.current], rowKey);
-              treeNodes.current = treeNodes.current.map((item) => item.id === nextId ? { ...item, display: true } : item);
-              const expandIcon = nextRow.current.querySelector(`.${e`expand-icon`}`);
+              // addStyle(nextRow.current, 'display', '');
+              var nextId = getRowIdentity(data[startRowIndex.current], rowKey);
+              treeNodes.current = treeNodes.current.map(function (item) {
+                return item.id === nextId ? _objectSpread(_objectSpread({}, item), {}, {
+                  display: true
+                }) : item;
+              });
+              var expandIcon = nextRow.current.querySelector(".".concat(e(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["expand-icon"])))));
               if (expandIcon) {
-                const nextLevel2 = getLevel(nextRow.current.nextSibling);
-                if (nextLevel2 === 0 || nextLevel2 < level) {
-                  break;
+                // 下一行层级为0或层级小于当前行层级时，说明子级行遍历结束，跳出循环
+                var _nextLevel = getLevel(nextRow.current.nextSibling);
+                if (_nextLevel === 0 || _nextLevel < level) {
+                  return 0; // break
                 }
-                const expanded = (0, import_dom_lib.hasClass)(expandIcon, em("expand-icon", "expanded"));
-                treeNodes.current = treeNodes.current.map((item) => item.id === nextId ? { ...item, expanded } : item);
+                var expanded = hasClass(expandIcon, em('expand-icon', 'expanded'));
+                treeNodes.current = treeNodes.current.map(function (item) {
+                  return item.id === nextId ? _objectSpread(_objectSpread({}, item), {}, {
+                    expanded: expanded
+                  }) : item;
+                });
                 startRowIndex.current++;
                 nextRow.current = nextRow.current.nextSibling;
                 expandOrCollapseTreeRow(level + 1, expanded);
               }
             }
           } else {
+            // 折叠时，所有的子行都隐藏
             if (level > 0) {
-              const nextId = (0, import_util.getRowIdentity)(data[startRowIndex.current], rowKey);
-              treeNodes.current = treeNodes.current.map((item) => item.id === nextId ? { ...item, display: false } : item);
+              // addStyle(nextRow.current.current, 'display', 'none');
+              var _nextId = getRowIdentity(data[startRowIndex.current], rowKey);
+              treeNodes.current = treeNodes.current.map(function (item) {
+                return item.id === _nextId ? _objectSpread(_objectSpread({}, item), {}, {
+                  display: false
+                }) : item;
+              });
             }
           }
-          const nextLevel = getLevel(nextRow.current.nextSibling);
+
+          // 下一行层级为0或层级小于当前行层级时，说明子级行遍历结束，跳出循环
+          var nextLevel = getLevel(nextRow.current.nextSibling);
           if (nextLevel === 0 || nextLevel < level) {
-            break;
+            return 0; // break
           }
           startRowIndex.current++;
           nextRow.current = nextRow.current.nextSibling;
         }
-      }
-    },
-    [data, e, em, getLevel, rowKey, treeNodes]
-  );
-  const handleExpandTreeCell = (0, import_react.useCallback)(() => {
-    var _a, _b;
-    if (((_a = tdRef.current) == null ? void 0 : _a.parentNode) && expandCell.current) {
-      const willExpand = !(0, import_dom_lib.hasClass)(expandCell.current, em("expand-icon", "expanded"));
+      },
+      _ret;
+    while (nextRow.current) {
+      _ret = _loop();
+      if (_ret === 0) break;
+    }
+  }, [data, e, em, getLevel, rowKey, treeNodes]);
+
+  /** 展开/折叠树 */
+  var handleExpandTreeCell = useCallback(function () {
+    var _tdRef$current;
+    if ((_tdRef$current = tdRef.current) !== null && _tdRef$current !== void 0 && _tdRef$current.parentNode && expandCell.current) {
+      var willExpand = !hasClass(expandCell.current, em('expand-icon', 'expanded'));
       if (lazy && row.noLazyChildren) {
         setLoading(true);
-        const parentId = (0, import_util.getRowIdentity)(row, rowKey);
-        new Promise((resolve) => {
-          load == null ? void 0 : load(
-            row,
-            treeNodes.current.find((item) => item.id === parentId),
-            resolve
-          );
-        }).then((result) => {
+        var parentId = getRowIdentity(row, rowKey);
+        new Promise(function (resolve) {
+          load === null || load === void 0 || load(row, treeNodes.current.find(function (item) {
+            return item.id === parentId;
+          }), resolve);
+        }).then(function (result) {
           setLoading(false);
-          result = result.map((item) => {
-            const treeNode = { parentId, display: true, level: row.level + 1, expanded: false, noLazyChildren: true };
-            treeNodes.current.push({ id: (0, import_util.getRowIdentity)(item, rowKey), ...treeNode });
-            return { ...item, ...treeNode };
+          result = result.map(function (item) {
+            var treeNode = {
+              parentId: parentId,
+              display: true,
+              level: row.level + 1,
+              expanded: false,
+              noLazyChildren: true
+            };
+            treeNodes.current.push(_objectSpread({
+              id: getRowIdentity(item, rowKey)
+            }, treeNode));
+            return _objectSpread(_objectSpread({}, item), treeNode);
           });
-          (0, import_treeUtil.addTreeChildren)(initialData.current, (0, import_util.getRowIdentity)(row, rowKey), result, treeProps, rowKey);
-          (0, import_treeUtil.addTreeChildren)(sortedData.current, (0, import_util.getRowIdentity)(row, rowKey), result, treeProps, rowKey);
-          let _data = data.map((item) => {
-            if (rowKey ? (0, import_util.getRowIdentity)(item, rowKey) === (0, import_util.getRowIdentity)(row, rowKey) : (0, import_isEqual.default)(item, row)) {
-              const treeNode = treeNodes.current.find((item1) => item1.id === (0, import_util.getRowIdentity)(item, rowKey));
-              Object.assign(treeNode, {
-                noLazyChildren: result.length === 0,
-                expanded: true,
-                [treeProps.children]: result,
-                [treeProps.hasChildren]: result.length > 0
+
+          // 添加新增的子节点
+          addTreeChildren(initialData.current, getRowIdentity(row, rowKey), result, treeProps, rowKey);
+          addTreeChildren(sortedData.current, getRowIdentity(row, rowKey), result, treeProps, rowKey);
+          var _data = data.map(function (item) {
+            if (rowKey ? getRowIdentity(item, rowKey) === getRowIdentity(row, rowKey) : isEqual(item, row)) {
+              var treeNode = treeNodes.current.find(function (item1) {
+                return item1.id === getRowIdentity(item, rowKey);
               });
-              return { ...row, ...(0, import_omit.default)(treeNode, "id") };
+              Object.assign(treeNode, _defineProperty(_defineProperty({
+                noLazyChildren: result.length === 0,
+                expanded: true
+              }, treeProps.children, result), treeProps.hasChildren, result.length > 0));
+              return _objectSpread(_objectSpread({}, row), omit(treeNode, 'id'));
             }
             return item;
           });
@@ -251,147 +310,229 @@ var TableCell = (p) => {
           _data = _data.flat();
           setData(_data);
         });
+        // .catch(() => {
+        //     setLoading(false);
+        //     setData([
+        //         ...data.slice(0, rowIndex),
+        //         { ...row, noLazyChildren: true, expanded: true, [treeProps.children]: [], [treeProps.hasChildren]: false },
+        //         ...data.slice(rowIndex + 1),
+        //     ]);
+        // });
       } else {
+        var _tdRef$current$parent;
         startRowIndex.current = rowIndex + 1;
-        nextRow.current = (_b = tdRef.current.parentNode) == null ? void 0 : _b.nextSibling;
+        nextRow.current = (_tdRef$current$parent = tdRef.current.parentNode) === null || _tdRef$current$parent === void 0 ? void 0 : _tdRef$current$parent.nextSibling;
         if (nextRow.current) {
-          const nextId = (0, import_util.getRowIdentity)(data[rowIndex], rowKey);
-          treeNodes.current = treeNodes.current.map((item) => item.id === nextId ? { ...item, expanded: willExpand } : item);
+          var nextId = getRowIdentity(data[rowIndex], rowKey);
+          treeNodes.current = treeNodes.current.map(function (item) {
+            return item.id === nextId ? _objectSpread(_objectSpread({}, item), {}, {
+              expanded: willExpand
+            }) : item;
+          });
           expandOrCollapseTreeRow(column.level + 1, willExpand);
-          setData((0, import_treeUtil.mergeTreeData)(sortedData.current, treeNodes.current, treeProps, rowKey));
+          setData(mergeTreeData(sortedData.current, treeNodes.current, treeProps, rowKey));
         }
       }
-      onExpandChange == null ? void 0 : onExpandChange(row, willExpand);
+
+      // if (willExpand) {
+      //     addClass(expandCell.current, em('expand-icon', 'expanded'));
+      // } else {
+      //     removeClass(expandCell.current, em('expand-icon', 'expanded'));
+      // }
+      onExpandChange === null || onExpandChange === void 0 || onExpandChange(row, willExpand);
     }
   }, [rowIndex, em, lazy, row, onExpandChange, rowKey, load, treeNodes, initialData, treeProps, sortedData, data, setData, expandOrCollapseTreeRow, column.level]);
-  (0, import_hooks.useUpdateEffect)(() => {
+
+  // 展开内容区域变化时进行更新
+  useUpdateEffect(function () {
     if (rootRef.current && trRef.current && expand.current === true) {
-      rootRef.current.render(
-        (0, import_react_dom.createPortal)(
-          /* @__PURE__ */ import_react.default.createElement("td", { colSpan: flattenColumns.length, className: (0, import_classnames.default)(e`cell`, e`expanded-cell`) }, (column == null ? void 0 : column.renderCell) && column.renderCell({ row, column, $index: rowIndex })),
-          trRef.current
-        )
-      );
+      rootRef.current.render( /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("td", {
+        colSpan: flattenColumns.length,
+        className: classNames(e(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["cell"]))), e(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["expanded-cell"]))))
+      }, (column === null || column === void 0 ? void 0 : column.renderCell) && column.renderCell({
+        row: row,
+        column: column,
+        $index: rowIndex
+      })), trRef.current));
     }
   });
-  (0, import_react.useEffect)(() => {
-    if (column.type === "selection") {
+  useEffect(function () {
+    if (column.type === 'selection') {
       if (disabled) {
         disabledRows.current.push(row);
       } else {
-        disabledRows.current = disabledRows.current.filter((item) => rowKey ? (0, import_util.getRowIdentity)(item, rowKey) !== (0, import_util.getRowIdentity)(row, rowKey) : !(0, import_isEqual.default)(item, row));
-        disabledRows.current = (0, import_uniqWith.default)(
-          disabledRows.current,
-          rowKey ? (item1, item2) => (0, import_util.getRowIdentity)(item1, rowKey) === (0, import_util.getRowIdentity)(item2, rowKey) : import_isEqual.default
-        );
+        disabledRows.current = disabledRows.current.filter(function (item) {
+          return rowKey ? getRowIdentity(item, rowKey) !== getRowIdentity(row, rowKey) : !isEqual(item, row);
+        });
+        // 去重
+        disabledRows.current = uniqWith(disabledRows.current, rowKey ? function (item1, item2) {
+          return getRowIdentity(item1, rowKey) === getRowIdentity(item2, rowKey);
+        } : isEqual);
       }
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [disabled, row]);
-  const handleExpand = (0, import_react.useCallback)(() => {
-    var _a, _b, _c, _d, _e;
+
+  /** 展开/折叠行 */
+  var handleExpand = useCallback(function () {
     if (expandCell.current) {
       if (expand.current === false) {
-        expandable(row).then((canExpand) => {
-          var _a2, _b2;
+        expandable(row).then(function (canExpand) {
           if (canExpand) {
-            (0, import_dom_lib.addClass)(expandCell.current, em("expand-icon", "expanded"));
+            var _tdRef$current2;
+            addClass(expandCell.current, em('expand-icon', 'expanded'));
             expand.current = true;
-            if ((_b2 = (_a2 = tdRef.current) == null ? void 0 : _a2.parentNode) == null ? void 0 : _b2.parentNode) {
-              const tr = document.createElement("tr");
-              (0, import_util.insertAfter)(tr, tdRef.current.parentNode);
+            if ((_tdRef$current2 = tdRef.current) !== null && _tdRef$current2 !== void 0 && (_tdRef$current2 = _tdRef$current2.parentNode) !== null && _tdRef$current2 !== void 0 && _tdRef$current2.parentNode) {
+              var tr = document.createElement('tr');
+              insertAfter(tr, tdRef.current.parentNode);
               trRef.current = tr;
-              rootRef.current = (0, import_client.createRoot)(tr);
-              rootRef.current.render(
-                (0, import_react_dom.createPortal)(
-                  /* @__PURE__ */ import_react.default.createElement("td", { colSpan: flattenColumns.length, className: (0, import_classnames.default)(e`cell`, e`expanded-cell`) }, (column == null ? void 0 : column.renderCell) && column.renderCell({ row, column, $index: rowIndex })),
-                  tr
-                )
-              );
-              onExpandChange == null ? void 0 : onExpandChange(row, true);
+              rootRef.current = createRoot(tr);
+              rootRef.current.render( /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("td", {
+                colSpan: flattenColumns.length,
+                className: classNames(e(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["cell"]))), e(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["expanded-cell"]))))
+              }, (column === null || column === void 0 ? void 0 : column.renderCell) && column.renderCell({
+                row: row,
+                column: column,
+                $index: rowIndex
+              })), tr));
+              onExpandChange === null || onExpandChange === void 0 || onExpandChange(row, true);
             }
           } else {
             if (hideIconOnNotExpand) {
-              expandCell.current.style.display = "none";
+              expandCell.current.style.display = 'none';
             }
           }
         });
       } else {
-        (0, import_dom_lib.removeClass)(expandCell.current, em("expand-icon", "expanded"));
+        var _tdRef$current3;
+        removeClass(expandCell.current, em('expand-icon', 'expanded'));
         expand.current = false;
-        if (((_b = (_a = tdRef.current) == null ? void 0 : _a.parentNode) == null ? void 0 : _b.parentNode) && trRef.current) {
-          (_c = rootRef.current) == null ? void 0 : _c.unmount();
-          (_e = (_d = tdRef.current) == null ? void 0 : _d.parentNode) == null ? void 0 : _e.parentNode.removeChild(trRef.current);
-          onExpandChange == null ? void 0 : onExpandChange(row, false);
+        if ((_tdRef$current3 = tdRef.current) !== null && _tdRef$current3 !== void 0 && (_tdRef$current3 = _tdRef$current3.parentNode) !== null && _tdRef$current3 !== void 0 && _tdRef$current3.parentNode && trRef.current) {
+          var _rootRef$current, _tdRef$current4;
+          (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 || _rootRef$current.unmount();
+          (_tdRef$current4 = tdRef.current) === null || _tdRef$current4 === void 0 || (_tdRef$current4 = _tdRef$current4.parentNode) === null || _tdRef$current4 === void 0 || _tdRef$current4.parentNode.removeChild(trRef.current);
+          onExpandChange === null || onExpandChange === void 0 || onExpandChange(row, false);
         }
       }
     }
   }, [column, e, em, expandable, flattenColumns.length, hideIconOnNotExpand, onExpandChange, row, rowIndex]);
-  const treeSuffix = (0, import_react.useMemo)(() => {
-    return isTreeExpandCell(column.id) && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, column.level > 0 && /* @__PURE__ */ import_react.default.createElement("span", { className: e`indent`, style: { paddingLeft: indent * column.level } }), ((0, import_Util.isNotEmpty)(row[treeProps.children]) || row[treeProps.hasChildren]) && /* @__PURE__ */ import_react.default.createElement("div", { ref: expandCell, className: (0, import_classnames.default)(e`expand-icon`, { [em("expand-icon", "expanded")]: row == null ? void 0 : row.expanded }), onClick: handleExpandTreeCell }, loading ? /* @__PURE__ */ import_react.default.createElement(import_Icon.Icon, { name: "loader", prefix: "far", spin: true }) : /* @__PURE__ */ import_react.default.createElement(import_Icon.Icon, { name: "angle-right" })), (0, import_Util.isEmpty)(row[treeProps.children]) && !row[treeProps.hasChildren] && /* @__PURE__ */ import_react.default.createElement("span", { className: e`placeholder` }));
+
+  /**  */
+  var treeSuffix = useMemo(function () {
+    return isTreeExpandCell(column.id) && /*#__PURE__*/React.createElement(React.Fragment, null, column.level > 0 && /*#__PURE__*/React.createElement("span", {
+      className: e(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["indent"]))),
+      style: {
+        paddingLeft: indent * column.level
+      }
+    }), (isNotEmpty(row[treeProps.children]) || row[treeProps.hasChildren]) && /*#__PURE__*/React.createElement("div", {
+      ref: expandCell,
+      className: classNames(e(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["expand-icon"]))), _defineProperty({}, em('expand-icon', 'expanded'), row === null || row === void 0 ? void 0 : row.expanded)),
+      onClick: handleExpandTreeCell
+    }, loading ? /*#__PURE__*/React.createElement(Icon, {
+      name: "loader",
+      prefix: "far",
+      spin: true
+    }) : /*#__PURE__*/React.createElement(Icon, {
+      name: "angle-right"
+    })), isEmpty(row[treeProps.children]) && !row[treeProps.hasChildren] && /*#__PURE__*/React.createElement("span", {
+      className: e(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["placeholder"])))
+    }));
   }, [column.id, column.level, e, em, handleExpandTreeCell, indent, isTreeExpandCell, loading, row, treeProps.children, treeProps.hasChildren]);
-  return /* @__PURE__ */ import_react.default.createElement(
-    "td",
-    {
-      ref: tdRef,
-      className: (0, import_classnames.default)(
-        column.id,
-        e`cell`,
-        { [bm("column", "selection")]: column.type === "selection" },
-        column.className,
-        is(column.align),
-        className,
-        typeof cellClassName === "function" ? cellClassName == null ? void 0 : cellClassName({ row, column, rowIndex, columnIndex }) : cellClassName
-      ),
-      style: { ...style, ...typeof cellStyle === "function" ? cellStyle == null ? void 0 : cellStyle({ row, column, rowIndex, columnIndex }) : cellStyle },
-      rowSpan,
-      colSpan,
-      onMouseEnter: (event) => handleCellMouseEnter(row, column, event),
-      onMouseLeave: (event) => onCellMouseLeave == null ? void 0 : onCellMouseLeave(row, column, event.currentTarget, event),
-      onContextMenu: (event) => {
-        onCellContextmenu == null ? void 0 : onCellContextmenu(row, column, event.currentTarget, event);
-        onRowContextmenu == null ? void 0 : onRowContextmenu(row, column, event);
-      },
-      onClick: (event) => {
-        event.stopPropagation();
-        if (highlightCurrentRow) {
-          dispatch((0, import_useSelection.activeRow)(row));
-          if (!(0, import_isEqual.default)(state.currentRow, row)) {
-            onCurrentChange == null ? void 0 : onCurrentChange(row, state.currentRow);
-          }
+
+  /** 拖拽手柄 */
+  // const DragHandle = useMemo(() => {
+  //     return SortableHandle(() => (
+  //         <div style={{ cursor: 'grab' }}>
+  //             <Icon name="grip-vertical" prefix="fas" />
+  //             {/* <Icon name="grip-dots-vertical" prefix="fas" /> */}
+  //         </div>
+  //     ));
+  // }, []);
+
+  return /*#__PURE__*/React.createElement("td", {
+    ref: tdRef,
+    className: classNames(column.id, e(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["cell"]))), _defineProperty({}, bm('column', 'selection'), column.type === 'selection'), column.className, is(column.align), className, typeof cellClassName === 'function' ? cellClassName === null || cellClassName === void 0 ? void 0 : cellClassName({
+      row: row,
+      column: column,
+      rowIndex: rowIndex,
+      columnIndex: columnIndex
+    }) : cellClassName),
+    style: _objectSpread(_objectSpread({}, style), typeof cellStyle === 'function' ? cellStyle === null || cellStyle === void 0 ? void 0 : cellStyle({
+      row: row,
+      column: column,
+      rowIndex: rowIndex,
+      columnIndex: columnIndex
+    }) : cellStyle),
+    rowSpan: rowSpan,
+    colSpan: colSpan,
+    onMouseEnter: function onMouseEnter(event) {
+      return handleCellMouseEnter(row, column, event);
+    },
+    onMouseLeave: function onMouseLeave(event) {
+      return onCellMouseLeave === null || onCellMouseLeave === void 0 ? void 0 : onCellMouseLeave(row, column, event.currentTarget, event);
+    },
+    onContextMenu: function onContextMenu(event) {
+      onCellContextmenu === null || onCellContextmenu === void 0 || onCellContextmenu(row, column, event.currentTarget, event);
+      onRowContextmenu === null || onRowContextmenu === void 0 || onRowContextmenu(row, column, event);
+    },
+    onClick: function onClick(event) {
+      event.stopPropagation();
+      if (highlightCurrentRow) {
+        dispatch(activeRow(row));
+        if (!isEqual(state.currentRow, row)) {
+          onCurrentChange === null || onCurrentChange === void 0 || onCurrentChange(row, state.currentRow);
         }
-        onCellClick == null ? void 0 : onCellClick(row, column, event.currentTarget, event);
-        onRowClick == null ? void 0 : onRowClick(row, column, event);
-      },
-      onDoubleClick: (event) => {
-        onCellDblclick == null ? void 0 : onCellDblclick(row, column, event.currentTarget, event);
-        onRowDblclick == null ? void 0 : onRowDblclick(row, column, event);
       }
+      onCellClick === null || onCellClick === void 0 || onCellClick(row, column, event.currentTarget, event);
+      onRowClick === null || onRowClick === void 0 || onRowClick(row, column, event);
     },
-    /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(e`cell-content`, { [b("tooltip", false)]: column.showOverflowTooltip }), style: getCellStyle(column) }, (() => {
-      if (column.type === "index") {
-        return /* @__PURE__ */ import_react.default.createElement("div", { className: e`cell-index` }, rowIndex);
-      } else if (column.type === "expand") {
-        return /* @__PURE__ */ import_react.default.createElement("div", { ref: expandCell, className: e`expand-icon`, onClick: handleExpand }, /* @__PURE__ */ import_react.default.createElement(import_Icon.Icon, { name: "angle-right" }));
-      } else if (column.type === "drag") {
-      } else if (column.type === "selection") {
-        return /* @__PURE__ */ import_react.default.createElement(
-          import_Checkbox.Checkbox,
-          {
-            onClick: (event) => event.stopPropagation(),
-            checked: !disabled && (0, import_some.default)(state.selection || [], (item) => rowKey ? (0, import_util.getRowIdentity)(item, rowKey) === (0, import_util.getRowIdentity)(row, rowKey) : (0, import_isEqual.default)(item, row)),
-            disabled,
-            onChange: (checked) => handleCheck(checked, row)
-          }
-        );
-      } else if (column.renderCell) {
-        return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, treeSuffix, column.renderCell({ row, column, $index: rowIndex }));
-      } else if (column.formatter) {
-        return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, treeSuffix, column.formatter(row, column, column.name || column.prop ? row[column.name || column.prop] : "", rowIndex));
-      } else {
-        return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, treeSuffix, column.name || column.prop ? row[column.name || column.prop] : "");
-      }
-    })())
-  );
+    onDoubleClick: function onDoubleClick(event) {
+      onCellDblclick === null || onCellDblclick === void 0 || onCellDblclick(row, column, event.currentTarget, event);
+      onRowDblclick === null || onRowDblclick === void 0 || onRowDblclick(row, column, event);
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames(e(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["cell-content"]))), _defineProperty({}, b('tooltip', false), column.showOverflowTooltip)),
+    style: getCellStyle(column)
+  }, function () {
+    if (column.type === 'index') {
+      return /*#__PURE__*/React.createElement("div", {
+        className: e(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["cell-index"])))
+      }, rowIndex);
+    } else if (column.type === 'expand') {
+      return /*#__PURE__*/React.createElement("div", {
+        ref: expandCell,
+        className: e(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["expand-icon"]))),
+        onClick: handleExpand
+      }, /*#__PURE__*/React.createElement(Icon, {
+        name: "angle-right"
+      }));
+    } else if (column.type === 'drag') {
+      // return <DragHandle />;
+    } else if (column.type === 'selection') {
+      return /*#__PURE__*/React.createElement(Checkbox, {
+        onClick: function onClick(event) {
+          return event.stopPropagation();
+        },
+        checked: !disabled && some(state.selection || [], function (item) {
+          return rowKey ? getRowIdentity(item, rowKey) === getRowIdentity(row, rowKey) : isEqual(item, row);
+        }),
+        disabled: disabled,
+        onChange: function onChange(checked) {
+          return handleCheck(checked, row);
+        }
+      });
+    } else if (column.renderCell) {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, treeSuffix, column.renderCell({
+        row: row,
+        column: column,
+        $index: rowIndex
+      }));
+    } else if (column.formatter) {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, treeSuffix, column.formatter(row, column, column.name || column.prop ? row[column.name || column.prop] : '', rowIndex));
+    } else {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, treeSuffix, column.name || column.prop ? row[column.name || column.prop] : '');
+    }
+  }()));
 };
-TableCell.displayName = "TableCell";
-var TableCell_default = TableCell;
+TableCell.displayName = 'TableCell';
+export default TableCell;