linkmore-design/lib/table/rc-table/Body/BodyRow.js

🌈 🚀lm组件库。🚀

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _classnames = _interopRequireDefault(require("classnames"));
var React = _interopRequireWildcard(require("react"));
var _Cell = _interopRequireDefault(require("../Cell"));
var _BodyContext = _interopRequireDefault(require("../context/BodyContext"));
var _TableContext = _interopRequireDefault(require("../context/TableContext"));
var _ContextSelector = require("../ContextSelector");
var _valueUtil = require("../utils/valueUtil");
var _ExpandedRow = _interopRequireDefault(require("./ExpandedRow"));
function BodyRow(props) {
  const {
    className,
    style,
    record,
    index,
    renderIndex,
    rowKey,
    rowExpandable,
    expandedKeys,
    onRow,
    indent = 0,
    rowComponent: RowComponent,
    cellComponent,
    childrenColumnName
  } = props;
  const {
    prefixCls,
    fixedInfoList
  } = (0, _ContextSelector.useContextSelector)(_TableContext.default, ['prefixCls', 'fixedInfoList']);
  const {
    flattenColumns,
    expandableType,
    expandRowByClick,
    onTriggerExpand,
    rowClassName,
    expandedRowClassName,
    indentSize,
    expandIcon,
    expandedRowRender,
    expandIconColumnIndex
  } = (0, _ContextSelector.useContextSelector)(_BodyContext.default, ['flattenColumns', 'expandableType', 'expandRowByClick', 'onTriggerExpand', 'rowClassName', 'expandedRowClassName', 'indentSize', 'expandIcon', 'expandedRowRender', 'expandIconColumnIndex']);
  const [expandRended, setExpandRended] = React.useState(false);
  const expanded = expandedKeys && expandedKeys.has(props.recordKey);
  React.useEffect(() => {
    if (expanded) {
      setExpandRended(true);
    }
  }, [expanded]);
  const rowSupportExpand = expandableType === 'row' && (!rowExpandable || rowExpandable(record));
  // Only when row is not expandable and `children` exist in record
  const nestExpandable = expandableType === 'nest';
  const hasNestChildren = childrenColumnName && record && record[childrenColumnName];
  const mergedExpandable = rowSupportExpand || nestExpandable;

  // ======================== Expandable =========================
  const onExpandRef = React.useRef(onTriggerExpand);
  onExpandRef.current = onTriggerExpand;
  const onInternalTriggerExpand = (...args) => {
    onExpandRef.current(...args);
  };

  // =========================== onRow ===========================
  const additionalProps = onRow?.(record, index);
  const onClick = (event, ...args) => {
    if (expandRowByClick && mergedExpandable) {
      onInternalTriggerExpand(record, event);
    }
    additionalProps?.onClick?.(event, ...args);
  };

  // ======================== Base tr row ========================
  let computeRowClassName;
  if (typeof rowClassName === 'string') {
    computeRowClassName = rowClassName;
  } else if (typeof rowClassName === 'function') {
    computeRowClassName = rowClassName(record, index, indent);
  }
  const columnsKey = (0, _valueUtil.getColumnsKey)(flattenColumns);
  const baseRowNode = /*#__PURE__*/React.createElement(RowComponent, (0, _extends2.default)({}, additionalProps, {
    "data-row-key": rowKey,
    className: (0, _classnames.default)(className, `${prefixCls}-row`, `${prefixCls}-row-level-${indent}`, computeRowClassName, additionalProps && additionalProps.className),
    style: {
      ...style,
      ...(additionalProps ? additionalProps.style : null)
    },
    onClick: onClick
  }), flattenColumns.map((column, colIndex) => {
    const {
      render,
      dataIndex,
      className: columnClassName
    } = column;
    const key = columnsKey[colIndex];
    const fixedInfo = fixedInfoList[colIndex];

    // ============= Used for nest expandable =============
    let appendCellNode;
    if (colIndex === (expandIconColumnIndex || 0) && nestExpandable) {
      appendCellNode = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
        style: {
          paddingLeft: `${indentSize * indent}px`
        },
        className: `${prefixCls}-row-indent indent-level-${indent}`
      }), expandIcon({
        prefixCls,
        expanded,
        expandable: hasNestChildren,
        record,
        onExpand: onInternalTriggerExpand
      }));
    }
    let additionalCellProps;
    if (column.onCell) {
      additionalCellProps = column.onCell(record, index);
    }
    return /*#__PURE__*/React.createElement(_Cell.default, (0, _extends2.default)({
      className: columnClassName,
      ellipsis: column.ellipsis,
      align: column.align,
      component: cellComponent,
      prefixCls: prefixCls,
      key: key,
      record: record,
      index: index,
      renderIndex: renderIndex,
      dataIndex: dataIndex,
      render: render,
      shouldCellUpdate: column.shouldCellUpdate,
      expanded: appendCellNode && expanded
    }, fixedInfo, {
      appendNode: appendCellNode,
      additionalProps: additionalCellProps
    }));
  }));

  // ======================== Expand Row =========================
  let expandRowNode;
  if (rowSupportExpand && (expandRended || expanded)) {
    const expandContent = expandedRowRender(record, index, indent + 1, expanded);
    const computedExpandedRowClassName = expandedRowClassName && expandedRowClassName(record, index, indent);
    expandRowNode = /*#__PURE__*/React.createElement(_ExpandedRow.default, {
      expanded: expanded,
      className: (0, _classnames.default)(`${prefixCls}-expanded-row`, `${prefixCls}-expanded-row-level-${indent + 1}`, computedExpandedRowClassName),
      prefixCls: prefixCls,
      component: RowComponent,
      cellComponent: cellComponent,
      colSpan: flattenColumns.length,
      isEmpty: false
    }, expandContent);
  }
  return /*#__PURE__*/React.createElement(React.Fragment, null, baseRowNode, expandRowNode);
}
BodyRow.displayName = 'BodyRow';
var _default = BodyRow;
exports.default = _default;