choerodon-ui/pro/lib/table/TableRow.js

An enterprise-class UI design language and React-based implementation

"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 _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));

var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));

var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _tslib = require("tslib");

var _react = _interopRequireWildcard(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _mobxReact = require("mobx-react");

var _mobx = require("mobx");

var _classnames = _interopRequireDefault(require("classnames"));

var _defer = _interopRequireDefault(require("lodash/defer"));

var _reactIntersectionObserver = _interopRequireDefault(require("react-intersection-observer"));

var _enum = require("../../../lib/_util/enum");

var _UnitConvertor = require("../../../lib/_util/UnitConvertor");

var _measureScrollbar = _interopRequireDefault(require("../../../lib/_util/measureScrollbar"));

var _Column = require("./Column");

var _TableCell = _interopRequireDefault(require("./TableCell"));

var _Record = _interopRequireDefault(require("../data-set/Record"));

var _TableContext = _interopRequireDefault(require("./TableContext"));

var _ExpandIcon = _interopRequireDefault(require("./ExpandIcon"));

var _enum2 = require("./enum");

var _utils = require("./utils");

var _TableStore = require("./TableStore");

var _autobind = _interopRequireDefault(require("../_util/autobind"));

var _enum3 = require("../data-set/enum");

var _ResizeObservedRow = _interopRequireDefault(require("./ResizeObservedRow"));

var _spin = _interopRequireDefault(require("../spin"));

function _createSuper(Derived) {
  function isNativeReflectConstruct() {
    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
    if (Reflect.construct.sham) return false;
    if (typeof Proxy === "function") return true;

    try {
      Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
      return true;
    } catch (e) {
      return false;
    }
  }

  return function () {
    var Super = (0, _getPrototypeOf2["default"])(Derived),
        result;

    if (isNativeReflectConstruct()) {
      var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor;
      result = Reflect.construct(Super, arguments, NewTarget);
    } else {
      result = Super.apply(this, arguments);
    }

    return (0, _possibleConstructorReturn2["default"])(this, result);
  };
}

var TableRow =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2["default"])(TableRow, _Component);

  var _super = _createSuper(TableRow);

  function TableRow() {
    var _this;

    (0, _classCallCheck2["default"])(this, TableRow);
    _this = _super.apply(this, arguments);
    _this.rowExternalProps = {};
    _this.childrenRendered = false;
    _this.isCurrent = false;
    return _this;
  }

  (0, _createClass2["default"])(TableRow, [{
    key: "saveRef",
    value: function saveRef(node) {
      if (node) {
        this.node = node;
        var _this$props = this.props,
            lock = _this$props.lock,
            record = _this$props.record;
        var _this$context$tableSt = this.context.tableStore,
            rowHeight = _this$context$tableSt.rowHeight,
            lockColumnsBodyRowsHeight = _this$context$tableSt.lockColumnsBodyRowsHeight;

        if (rowHeight === 'auto' && !lock) {
          (0, _mobx.set)(lockColumnsBodyRowsHeight, this.rowKey = record.key, node.offsetHeight);
        }
      }
    }
  }, {
    key: "handleMouseEnter",
    value: function handleMouseEnter() {
      this.isHover = true;
    }
  }, {
    key: "handleMouseLeave",
    value: function handleMouseLeave() {
      this.isHover = false;
    }
  }, {
    key: "handleSelectionByClick",
    value: function () {
      var _handleSelectionByClick = (0, _asyncToGenerator2["default"])(
      /*#__PURE__*/
      _regenerator["default"].mark(function _callee(e) {
        return _regenerator["default"].wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                _context.next = 2;
                return this.handleClick(e);

              case 2:
                _context.t0 = _context.sent;

                if (!(_context.t0 !== false)) {
                  _context.next = 5;
                  break;
                }

                this.handleSelection();

              case 5:
              case "end":
                return _context.stop();
            }
          }
        }, _callee, this);
      }));

      function handleSelectionByClick(_x) {
        return _handleSelectionByClick.apply(this, arguments);
      }

      return handleSelectionByClick;
    }()
  }, {
    key: "handleSelectionByMouseDown",
    value: function handleSelectionByMouseDown(e) {
      this.handleSelection();
      var onMouseDown = this.rowExternalProps.onMouseDown;

      if (typeof onMouseDown === 'function') {
        onMouseDown(e);
      }
    }
  }, {
    key: "handleSelectionByDblClick",
    value: function handleSelectionByDblClick(e) {
      this.handleSelection();
      var onDoubleClick = this.rowExternalProps.onDoubleClick;

      if (typeof onDoubleClick === 'function') {
        onDoubleClick(e);
      }
    }
  }, {
    key: "handleExpandChange",
    value: function handleExpandChange() {
      if (this.expandable) {
        this.isExpanded = !this.isExpanded;
      }
    }
  }, {
    key: "handleClickCapture",
    value: function handleClickCapture(e) {
      var _this$props2 = this.props,
          record = _this$props2.record,
          dataSet = _this$props2.record.dataSet;

      if (dataSet && !(0, _utils.isDisabledRow)(record) && e.target.dataset.selectionKey !== _TableStore.SELECTION_KEY) {
        dataSet.current = record;
      }

      var onClickCapture = this.rowExternalProps.onClickCapture;

      if (typeof onClickCapture === 'function') {
        onClickCapture(e);
      }
    }
  }, {
    key: "handleClick",
    value: function handleClick(e) {
      var onClick = this.rowExternalProps.onClick;
      var _this$context = this.context,
          highLightRow = _this$context.tableStore.highLightRow,
          tableStore = _this$context.tableStore;

      if (highLightRow !== true) {
        this.isClicked = true;
        tableStore.setRowHighLight(true);
      }

      if (typeof onClick === 'function') {
        return onClick(e);
      }
    }
  }, {
    key: "handleResize",
    value: function handleResize(key, height) {
      this.setRowHeight(key, height);
    }
  }, {
    key: "setRowHeight",
    value: function setRowHeight(key, height) {
      var tableStore = this.context.tableStore;
      (0, _mobx.set)(tableStore.lockColumnsBodyRowsHeight, key, height);
    }
  }, {
    key: "getCell",
    value: function getCell(column, index, props) {
      var _this$props3 = this.props,
          record = _this$props3.record,
          lock = _this$props3.lock,
          provided = _this$props3.provided,
          snapshot = _this$props3.snapshot,
          rowIndex = _this$props3.index;
      var _this$context$tableSt2 = this.context.tableStore,
          leafColumns = _this$context$tableSt2.leafColumns,
          rightLeafColumns = _this$context$tableSt2.rightLeafColumns,
          node = _this$context$tableSt2.node,
          virtualCell = _this$context$tableSt2.props.virtualCell;
      var columnIndex = lock === _enum2.ColumnLock.right ? index + leafColumns.length - rightLeafColumns.length : index;
      var isDragging = snapshot ? snapshot.isDragging : false;

      var cell = _react["default"].createElement(_TableCell["default"], (0, _extends2["default"])({
        inView: true,
        column: column,
        record: record,
        isDragging: isDragging,
        lock: lock,
        provided: props.key === _TableStore.DRAG_KEY ? provided : undefined
      }, props), this.hasExpandIcon(columnIndex) && this.renderExpandIcon());

      return virtualCell ? _react["default"].createElement(_reactIntersectionObserver["default"], {
        key: props.key,
        root: node.tableBodyWrap || node.element,
        rootMargin: "100px",
        initialInView: rowIndex <= 10
      }, function (_ref) {
        var ref = _ref.ref,
            inView = _ref.inView;
        return (0, _react.cloneElement)(cell, {
          inView: inView,
          intersectionRef: ref
        });
      }) : cell;
    }
  }, {
    key: "focusRow",
    value: function focusRow() {
      var row = this.node;

      if (row) {
        var _this$context$tableSt3 = this.context.tableStore,
            node = _this$context$tableSt3.node,
            overflowY = _this$context$tableSt3.overflowY,
            editing = _this$context$tableSt3.editing;
        var _this$props4 = this.props,
            lock = _this$props4.lock,
            record = _this$props4.record;

        if (!lock && !editing) {
          var element = node.element;

          if (element && element.contains(document.activeElement) && ((0, _utils.isStickySupport)() ? !row.contains(document.activeElement) : Array.from(element.querySelectorAll("tr[data-index=\"".concat(record.id, "\"]"))).every(function (tr) {
            return !tr.contains(document.activeElement);
          }))) {
            row.focus();
          } // table 包含目前被focus的element
          // 找到当前组件对应record生成的组件对象 然后遍历 每个 tr里面不是focus的目标那么这个函数触发row.focus

        }

        if (!(0, _utils.isStickySupport)() && overflowY) {
          var offsetParent = row.offsetParent;

          if (offsetParent) {
            var tableBodyWrap = offsetParent.parentNode;

            if (tableBodyWrap) {
              var offsetTop = row.offsetTop,
                  offsetHeight = row.offsetHeight;
              var scrollTop = tableBodyWrap.scrollTop,
                  height = tableBodyWrap.offsetHeight;
              var bottomSide = offsetTop + offsetHeight - height + (0, _measureScrollbar["default"])();
              var st = scrollTop;

              if (st < bottomSide) {
                st = bottomSide;
              }

              if (st > offsetTop) {
                st = offsetTop + 1;
              }

              if (st !== scrollTop) {
                tableBodyWrap.scrollTop = st;
                node.handleBodyScrollTop({
                  target: tableBodyWrap,
                  currentTarget: tableBodyWrap
                });
              }
            }
          }
        }
      }
    }
  }, {
    key: "componentDidMount",
    value: function componentDidMount() {
      var _this$props5 = this.props,
          lock = _this$props5.lock,
          record = _this$props5.record;
      var tableStore = this.context.tableStore;

      if (record.status === _enum3.RecordStatus.add && tableStore.autoFocus) {
        var editor = (0, _toConsumableArray2["default"])(tableStore.editors.values())[0];

        if (editor && ((0, _utils.isStickySupport)() || (0, _utils.getColumnLock)(editor.props.column.lock) === (0, _utils.getColumnLock)(lock))) {
          var cell = (0, _utils.findCell)(tableStore, (0, _utils.getColumnKey)(editor.props.column), lock);

          if (cell) {
            (0, _defer["default"])(function () {
              return cell.focus();
            });
          }
        }
      }

      this.syncLoadData();
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate() {
      var record = this.props.record;

      if (record.isCurrent && !this.isCurrent) {
        this.focusRow();
      }

      this.isCurrent = record.isCurrent;
      this.syncLoadData();
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      var record = this.props.record;
      var tableStore = this.context.tableStore;
      /**
       * Fixed the when row resize has scrollbar the expanded row would be collapsed
       */

      if (!tableStore.isRowExpanded(record)) {
        tableStore.setRowExpanded(record, false, true);
      }

      if (!(0, _utils.isStickySupport)()) {
        (0, _mobx.remove)(tableStore.lockColumnsBodyRowsHeight, this.rowKey);
      }
    }
  }, {
    key: "handleSelection",
    value: function handleSelection() {
      var record = this.props.record;
      var dataSet = record.dataSet;

      if (dataSet) {
        dataSet[record.isSelected ? 'unSelect' : 'select'](record);
      }
    }
  }, {
    key: "hasExpandIcon",
    value: function hasExpandIcon(columnIndex) {
      var tableStore = this.context.tableStore;
      var _tableStore$props = tableStore.props,
          expandRowByClick = _tableStore$props.expandRowByClick,
          expandedRowRenderer = _tableStore$props.expandedRowRenderer,
          expandIconColumnIndex = tableStore.expandIconColumnIndex,
          isTree = tableStore.isTree;
      return !expandRowByClick && (expandedRowRenderer || isTree) && columnIndex === expandIconColumnIndex;
    }
  }, {
    key: "syncLoadData",
    value: function syncLoadData() {
      if (this.isLoading) return;
      var record = this.props.record;
      var tableStore = this.context.tableStore;
      var isExpanded = this.isExpanded,
          isLoaded = this.isLoaded,
          expandable = this.expandable;
      var canTreeLoadData = tableStore.canTreeLoadData;

      if (canTreeLoadData && isExpanded && expandable) {
        if (!record.children && !isLoaded) {
          tableStore.onTreeNodeLoad({
            record: record
          });
        }
      }
    }
  }, {
    key: "renderExpandIcon",
    value: function renderExpandIcon() {
      var record = this.props.record;
      var _this$context2 = this.context,
          tableStore = _this$context2.tableStore,
          _this$context2$tableS = _this$context2.tableStore,
          prefixCls = _this$context2$tableS.prefixCls,
          expandIcon = _this$context2$tableS.expandIcon;
      var expanded = this.isExpanded,
          expandable = this.expandable,
          handleExpandChange = this.handleExpandChange;

      if (typeof expandIcon === 'function') {
        return expandIcon({
          prefixCls: prefixCls,
          expanded: expanded,
          expandable: expandable,
          needIndentSpaced: !expandable,
          record: record,
          onExpand: handleExpandChange
        });
      }

      if (tableStore.isRowPending(record)) {
        return _react["default"].createElement(_spin["default"], {
          size: _enum.Size.small
        });
      }

      return _react["default"].createElement(_ExpandIcon["default"], {
        prefixCls: prefixCls,
        expandable: expandable,
        onChange: handleExpandChange,
        expanded: expanded
      });
    }
  }, {
    key: "renderExpandRow",
    value: function renderExpandRow() {
      var isExpanded = this.isExpanded,
          _this$props6 = this.props,
          children = _this$props6.children,
          columns = _this$props6.columns,
          record = _this$props6.record,
          index = _this$props6.index;
      var tableStore = this.context.tableStore;
      var _tableStore$props2 = tableStore.props,
          expandedRowRenderer = _tableStore$props2.expandedRowRenderer,
          onRow = _tableStore$props2.onRow,
          prefixCls = tableStore.prefixCls,
          expandIconAsCell = tableStore.expandIconAsCell,
          overflowX = tableStore.overflowX;
      var expandRows = [];

      if (isExpanded || this.childrenRendered) {
        this.childrenRendered = true;

        if (expandedRowRenderer) {
          var rowExternalProps = typeof onRow === 'function' ? onRow({
            dataSet: record.dataSet,
            record: record,
            expandedRow: true,
            index: index
          }) : {};
          var classString = (0, _classnames["default"])("".concat(prefixCls, "-expanded-row"), rowExternalProps.className);
          var rowProps = {
            key: "".concat(record.key, "-expanded-row"),
            className: classString,
            style: (0, _objectSpread2["default"])({}, rowExternalProps.style)
          };

          if (overflowX || !record.isCurrent) {
            rowProps.onMouseEnter = this.handleMouseEnter;
            rowProps.onMouseLeave = this.handleMouseLeave;
          }

          if (!isExpanded) {
            rowProps.style.display = 'none';
          }

          expandRows.push(_react["default"].createElement("tr", (0, _extends2["default"])({}, rowExternalProps, rowProps), expandIconAsCell && _react["default"].createElement("td", {
            key: _TableStore.EXPAND_KEY
          }), _react["default"].createElement("td", {
            key: "".concat(_TableStore.EXPAND_KEY, "-rest"),
            className: "".concat(prefixCls, "-cell"),
            colSpan: columns.length - (expandIconAsCell ? 1 : 0)
          }, _react["default"].createElement("div", {
            className: "".concat(prefixCls, "-cell-inner")
          }, expandedRowRenderer({
            dataSet: record.dataSet,
            record: record
          })))));
        }

        if ((0, _react.isValidElement)(children)) {
          expandRows.push((0, _react.cloneElement)(children, {
            isExpanded: isExpanded,
            key: "".concat(record.key, "-expanded-rows")
          }));
        }
      }

      return expandRows;
    }
  }, {
    key: "getColumns",
    value: function getColumns() {
      var _this2 = this;

      var _this$props7 = this.props,
          columns = _this$props7.columns,
          lock = _this$props7.lock;
      var tableStore = this.context.tableStore;
      var prefixCls = tableStore.prefixCls,
          customizable = tableStore.customizable,
          rowDraggable = tableStore.rowDraggable,
          dragColumnAlign = tableStore.dragColumnAlign;
      var leftWidth = 0;
      var rightWidth = (0, _utils.isStickySupport)() && tableStore.overflowX ? tableStore.rightLeafColumnsWidth : 0;
      var columnLength = columns.length;
      return columns.map(function (column, index, cols) {
        var key = (0, _utils.getColumnKey)(column);

        if (key !== _TableStore.CUSTOMIZED_KEY) {
          var colSpan = customizable && lock !== _enum2.ColumnLock.left && (!rowDraggable || dragColumnAlign !== _enum2.DragColumnAlign.right) && index === columnLength - 2 ? 2 : 1;
          var props = {
            key: key
          };

          if (colSpan > 1) {
            props.colSpan = colSpan;
          }

          if ((0, _utils.isStickySupport)() && tableStore.overflowX) {
            var columnLock = (0, _utils.getColumnLock)(column.lock);

            if (columnLock === _enum2.ColumnLock.left) {
              props.style = {
                left: (0, _UnitConvertor.pxToRem)(leftWidth)
              };
              var next = cols[index + 1];

              if (!next || (0, _utils.getColumnLock)(next.lock) !== _enum2.ColumnLock.left) {
                props.className = "".concat(prefixCls, "-cell-fix-left-last");
              }

              leftWidth += (0, _Column.columnWidth)(column);
            } else if (columnLock === _enum2.ColumnLock.right) {
              rightWidth -= (0, _Column.columnWidth)(column);
              var prev = cols[index - 1];

              if (!prev || prev.lock !== _enum2.ColumnLock.right) {
                props.className = "".concat(prefixCls, "-cell-fix-right-first");
              }

              if (colSpan > 1) {
                for (var i = 1; i < colSpan; i++) {
                  var _next = cols[index + i];

                  if (_next) {
                    rightWidth -= (0, _Column.columnWidth)(_next);
                  }
                }
              }

              props.style = {
                right: (0, _UnitConvertor.pxToRem)(rightWidth)
              };
            }
          }

          return _this2.getCell(column, index, props);
        }

        return undefined;
      });
    }
  }, {
    key: "render",
    value: function render() {
      var _classNames,
          _this3 = this;

      var _this$props8 = this.props,
          record = _this$props8.record,
          lock = _this$props8.lock,
          hidden = _this$props8.hidden,
          index = _this$props8.index,
          provided = _this$props8.provided,
          className = _this$props8.className;
      var tableStore = this.context.tableStore;
      var prefixCls = tableStore.prefixCls,
          rowHeight = tableStore.rowHeight,
          overflowX = tableStore.overflowX,
          highLightRow = tableStore.highLightRow,
          selectedHighLightRow = tableStore.selectedHighLightRow,
          mouseBatchChooseIdList = tableStore.mouseBatchChooseIdList,
          mouseBatchChooseState = tableStore.mouseBatchChooseState,
          dragColumnAlign = tableStore.dragColumnAlign,
          rowDraggable = tableStore.rowDraggable,
          totalLeafColumnsWidth = tableStore.totalLeafColumnsWidth,
          width = tableStore.width,
          _tableStore$props3 = tableStore.props,
          onRow = _tableStore$props3.onRow,
          rowRenderer = _tableStore$props3.rowRenderer,
          selectionMode = _tableStore$props3.selectionMode;
      var key = record.key,
          id = record.id;
      var rowExternalProps = (0, _objectSpread2["default"])({}, typeof rowRenderer === 'function' ? rowRenderer(record, index) : {}, {}, typeof onRow === 'function' ? onRow({
        dataSet: record.dataSet,
        record: record,
        expandedRow: false,
        index: index
      }) : {});
      this.rowExternalProps = rowExternalProps;
      var disabled = (0, _utils.isDisabledRow)(record);
      var rowPrefixCls = "".concat(prefixCls, "-row");
      var classString = (0, _classnames["default"])(rowPrefixCls, (_classNames = {}, (0, _defineProperty2["default"])(_classNames, "".concat(rowPrefixCls, "-current"), highLightRow && record.isCurrent), (0, _defineProperty2["default"])(_classNames, "".concat(rowPrefixCls, "-hover"), highLightRow && this.isHover), (0, _defineProperty2["default"])(_classNames, "".concat(rowPrefixCls, "-clicked"), highLightRow === _enum2.HighLightRowType.click && this.isClicked), (0, _defineProperty2["default"])(_classNames, "".concat(rowPrefixCls, "-highlight"), this.isHighLightRow), (0, _defineProperty2["default"])(_classNames, "".concat(rowPrefixCls, "-selected"), selectedHighLightRow && (0, _utils.isSelectedRow)(record)), (0, _defineProperty2["default"])(_classNames, "".concat(rowPrefixCls, "-disabled"), disabled), (0, _defineProperty2["default"])(_classNames, "".concat(rowPrefixCls, "-mouse-batch-choose"), mouseBatchChooseState && (mouseBatchChooseIdList || []).includes(id)), (0, _defineProperty2["default"])(_classNames, "".concat(rowPrefixCls, "-expanded"), this.isExpanded), _classNames), className, // 增加可以自定义类名满足拖拽功能
      rowExternalProps.className);
      var rowProps = {
        ref: function ref(_ref2) {
          _this3.saveRef(_ref2);

          if (provided) {
            provided.innerRef(_ref2);
          }
        },
        className: classString,
        style: (0, _objectSpread2["default"])({}, rowExternalProps.style),
        onClick: this.handleClick,
        onClickCapture: this.handleClickCapture,
        tabIndex: -1,
        disabled: disabled,
        'data-index': id
      };

      if (!(0, _utils.isStickySupport)() && overflowX) {
        rowProps.onMouseEnter = this.handleMouseEnter;
        rowProps.onMouseLeave = this.handleMouseLeave;
      }

      if (hidden) {
        rowProps.style.display = 'none';
      }

      if (!(0, _utils.isStickySupport)() && lock && rowHeight === 'auto') {
        rowProps.style.height = (0, _UnitConvertor.pxToRem)((0, _mobx.get)(tableStore.lockColumnsBodyRowsHeight, key));
      }

      if (selectionMode === _enum2.SelectionMode.click) {
        rowProps.onClick = this.handleSelectionByClick;
      } else if (selectionMode === _enum2.SelectionMode.dblclick) {
        rowProps.onDoubleClick = this.handleSelectionByDblClick;
      } else if (selectionMode === _enum2.SelectionMode.mousedown) {
        rowProps.onMouseDown = this.handleSelectionByMouseDown;
      }

      if (rowDraggable && provided) {
        (0, _extends2["default"])(rowProps, provided.draggableProps);
        rowProps.style = (0, _objectSpread2["default"])({}, provided.draggableProps.style, {}, rowExternalProps.style, {
          width: Math.max(totalLeafColumnsWidth, width)
        });

        if (!dragColumnAlign) {
          rowProps.style.cursor = 'move';
          (0, _extends2["default"])(rowProps, provided.dragHandleProps);
        }
      }

      var tr = _react["default"].createElement("tr", (0, _extends2["default"])({
        key: key
      }, rowExternalProps, rowProps), this.getColumns());

      return [!(0, _utils.isStickySupport)() && !lock && rowHeight === 'auto' ? _react["default"].createElement(_ResizeObservedRow["default"], {
        onResize: this.handleResize,
        rowIndex: key
      }, tr) : tr].concat((0, _toConsumableArray2["default"])(this.renderExpandRow()));
    }
  }, {
    key: "expandable",
    get: function get() {
      var tableStore = this.context.tableStore;
      var record = this.props.record;
      var isLeaf = this.rowExternalProps.isLeaf;
      var expandedRowRenderer = tableStore.props.expandedRowRenderer,
          isTree = tableStore.isTree,
          canTreeLoadData = tableStore.canTreeLoadData;

      if (isLeaf === true) {
        return false;
      }

      return !!expandedRowRenderer || isTree && (!!record.children || canTreeLoadData && !this.isLoaded);
    }
  }, {
    key: "isLoading",
    get: function get() {
      var tableStore = this.context.tableStore;
      var record = this.props.record;
      return tableStore.isRowPending(record);
    }
  }, {
    key: "isLoaded",
    get: function get() {
      var tableStore = this.context.tableStore;
      var record = this.props.record;
      return tableStore.isRowLoaded(record);
    }
  }, {
    key: "isExpanded",
    get: function get() {
      var tableStore = this.context.tableStore;
      var record = this.props.record;
      return tableStore.isRowExpanded(record);
    },
    set: function set(expanded) {
      var tableStore = this.context.tableStore;
      var record = this.props.record;
      tableStore.setRowExpanded(record, expanded);
    }
  }, {
    key: "isHover",
    get: function get() {
      var tableStore = this.context.tableStore;
      var record = this.props.record;
      return tableStore.isRowHover(record);
    },
    set: function set(hover) {
      var tableStore = this.context.tableStore;

      if (tableStore.highLightRow) {
        var record = this.props.record;
        tableStore.setRowHover(record, hover);
      }
    }
  }, {
    key: "isClicked",
    get: function get() {
      var tableStore = this.context.tableStore;
      var record = this.props.record;
      return tableStore.isRowClick(record);
    },
    set: function set(click) {
      var tableStore = this.context.tableStore;

      if (tableStore.highLightRow) {
        var record = this.props.record;
        tableStore.setRowClicked(record, click);
      }
    }
  }, {
    key: "isHighLightRow",
    get: function get() {
      var _this$context3 = this.context,
          highLightRow = _this$context3.tableStore.highLightRow,
          tableStore = _this$context3.tableStore;

      if (highLightRow === false) {
        return false;
      }

      if (highLightRow === _enum2.HighLightRowType.click) {
        return highLightRow && tableStore.isRowHighLight && this.isClicked;
      }

      return highLightRow && tableStore.isRowHighLight;
    }
  }]);
  return TableRow;
}(_react.Component);

TableRow.displayName = 'TableRow';
TableRow.propTypes = {
  lock: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf([_enum2.ColumnLock.right, _enum2.ColumnLock.left])]),
  columns: _propTypes["default"].array.isRequired,
  record: _propTypes["default"].instanceOf(_Record["default"]).isRequired
};
TableRow.contextType = _TableContext["default"];
(0, _tslib.__decorate)([_mobx.computed], TableRow.prototype, "expandable", null);
(0, _tslib.__decorate)([_mobx.computed], TableRow.prototype, "isLoading", null);
(0, _tslib.__decorate)([_mobx.computed], TableRow.prototype, "isLoaded", null);
(0, _tslib.__decorate)([_mobx.computed], TableRow.prototype, "isExpanded", null);
(0, _tslib.__decorate)([_mobx.computed], TableRow.prototype, "isHover", null);
(0, _tslib.__decorate)([_mobx.computed], TableRow.prototype, "isClicked", null);
(0, _tslib.__decorate)([_mobx.computed], TableRow.prototype, "isHighLightRow", null);
(0, _tslib.__decorate)([_autobind["default"], _mobx.action], TableRow.prototype, "saveRef", null);
(0, _tslib.__decorate)([_autobind["default"]], TableRow.prototype, "handleMouseEnter", null);
(0, _tslib.__decorate)([_autobind["default"]], TableRow.prototype, "handleMouseLeave", null);
(0, _tslib.__decorate)([_autobind["default"]], TableRow.prototype, "handleSelectionByClick", null);
(0, _tslib.__decorate)([_autobind["default"]], TableRow.prototype, "handleSelectionByMouseDown", null);
(0, _tslib.__decorate)([_autobind["default"]], TableRow.prototype, "handleSelectionByDblClick", null);
(0, _tslib.__decorate)([_autobind["default"]], TableRow.prototype, "handleExpandChange", null);
(0, _tslib.__decorate)([_autobind["default"]], TableRow.prototype, "handleClickCapture", null);
(0, _tslib.__decorate)([_autobind["default"]], TableRow.prototype, "handleClick", null);
(0, _tslib.__decorate)([_autobind["default"]], TableRow.prototype, "handleResize", null);
(0, _tslib.__decorate)([_mobx.action], TableRow.prototype, "setRowHeight", null);
(0, _tslib.__decorate)([_autobind["default"]], TableRow.prototype, "getCell", null);
(0, _tslib.__decorate)([_mobx.action], TableRow.prototype, "componentWillUnmount", null);
TableRow = (0, _tslib.__decorate)([_mobxReact.observer], TableRow);
var _default = TableRow;
exports["default"] = _default;
//# sourceMappingURL=TableRow.js.map