acud/lib/table/baseTable/Cell/index.js

acg react 组件库

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof3 = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
var React = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _shallowequal = _interopRequireDefault(require("shallowequal"));
var _ref2 = require("rc-util/lib/ref");
var _valueUtil = require("../utils/valueUtil");
var _StickyContext = _interopRequireDefault(require("../context/StickyContext"));
var _HoverContext = _interopRequireDefault(require("../context/HoverContext"));
var _warning = _interopRequireDefault(require("rc-util/lib/warning"));
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
var __rest = void 0 && (void 0).__rest || function (s, e) {
  var t = {};
  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  }
  return t;
};
/** Check if cell is in hover range */
function inHoverRange(cellStartRow, cellRowSpan, startRow, endRow) {
  var cellEndRow = cellStartRow + cellRowSpan - 1;
  return cellStartRow <= endRow && cellEndRow >= startRow;
}
function isRenderCell(data) {
  return data && (0, _typeof2["default"])(data) === 'object' && !Array.isArray(data) && ! /*#__PURE__*/React.isValidElement(data);
}
function isRefComponent(component) {
  // String tag component also support ref
  if (typeof component === 'string') {
    return true;
  }
  return (0, _ref2.supportRef)(component);
}
function Cell(_ref, ref) {
  var prefixCls = _ref.prefixCls,
    className = _ref.className,
    record = _ref.record,
    index = _ref.index,
    renderIndex = _ref.renderIndex,
    dataIndex = _ref.dataIndex,
    render = _ref.render,
    children = _ref.children,
    _ref$component = _ref.component,
    Component = _ref$component === void 0 ? 'td' : _ref$component,
    colSpan = _ref.colSpan,
    rowSpan = _ref.rowSpan,
    fixLeft = _ref.fixLeft,
    fixRight = _ref.fixRight,
    firstFixLeft = _ref.firstFixLeft,
    lastFixLeft = _ref.lastFixLeft,
    firstFixRight = _ref.firstFixRight,
    lastFixRight = _ref.lastFixRight,
    appendNode = _ref.appendNode,
    _ref$additionalProps = _ref.additionalProps,
    additionalProps = _ref$additionalProps === void 0 ? {} : _ref$additionalProps,
    ellipsis = _ref.ellipsis,
    align = _ref.align,
    rowType = _ref.rowType,
    isSticky = _ref.isSticky,
    hovering = _ref.hovering,
    onHover = _ref.onHover;
  var _a, _b;
  var cellPrefixCls = "".concat(prefixCls, "-cell");
  var supportSticky = React.useContext(_StickyContext["default"]);
  // ==================== Child Node ====================
  var cellProps;
  var childNode;
  if ((0, _valueUtil.validateValue)(children)) {
    childNode = children;
  } else {
    var value = (0, _valueUtil.getPathValue)(record, dataIndex);
    // Customize render node
    childNode = value;
    if (render) {
      var renderData = render(value, record, renderIndex);
      if (isRenderCell(renderData)) {
        if (process.env.NODE_ENV !== 'production') {
          (0, _warning["default"])(false, '`columns.render` return cell props is deprecated with perf issue, please use `onCell` instead.');
        }
        childNode = renderData.children;
        cellProps = renderData.props;
      } else {
        childNode = renderData;
      }
    }
  }
  // Not crash if final `childNode` is not validate ReactNode
  if ((0, _typeof2["default"])(childNode) === 'object' && !Array.isArray(childNode) && ! /*#__PURE__*/React.isValidElement(childNode)) {
    childNode = null;
  }
  if (ellipsis && (lastFixLeft || firstFixRight)) {
    childNode = /*#__PURE__*/React.createElement("span", {
      className: "".concat(cellPrefixCls, "-content")
    }, childNode);
  }
  var _c = cellProps || {},
    cellColSpan = _c.colSpan,
    cellRowSpan = _c.rowSpan,
    cellStyle = _c.style,
    cellClassName = _c.className,
    restCellProps = __rest(_c, ["colSpan", "rowSpan", "style", "className"]);
  var mergedColSpan = (_a = cellColSpan !== undefined ? cellColSpan : colSpan) !== null && _a !== void 0 ? _a : 1;
  var mergedRowSpan = (_b = cellRowSpan !== undefined ? cellRowSpan : rowSpan) !== null && _b !== void 0 ? _b : 1;
  if (mergedColSpan === 0 || mergedRowSpan === 0) {
    return null;
  }
  // ====================== Fixed =======================
  var fixedStyle = {};
  var isFixLeft = typeof fixLeft === 'number' && supportSticky;
  var isFixRight = typeof fixRight === 'number' && supportSticky;
  if (isFixLeft) {
    fixedStyle.position = 'sticky';
    fixedStyle.left = fixLeft;
  }
  if (isFixRight) {
    fixedStyle.position = 'sticky';
    fixedStyle.right = fixRight;
  }
  // ====================== Align =======================
  var alignStyle = {};
  if (align) {
    alignStyle.textAlign = align;
  }
  // ====================== Hover =======================
  var onMouseEnter = function onMouseEnter(event) {
    var _a;
    if (record) {
      onHover(index, index + mergedRowSpan - 1);
    }
    (_a = additionalProps === null || additionalProps === void 0 ? void 0 : additionalProps.onMouseEnter) === null || _a === void 0 ? void 0 : _a.call(additionalProps, event);
  };
  var onMouseLeave = function onMouseLeave(event) {
    var _a;
    if (record) {
      onHover(-1, -1);
    }
    (_a = additionalProps === null || additionalProps === void 0 ? void 0 : additionalProps.onMouseLeave) === null || _a === void 0 ? void 0 : _a.call(additionalProps, event);
  };
  // ====================== Render ======================
  var title;
  var ellipsisConfig = ellipsis === true ? {
    showTitle: true
  } : ellipsis;
  if (ellipsisConfig && (ellipsisConfig.showTitle || rowType === 'header')) {
    if (typeof childNode === 'string' || typeof childNode === 'number') {
      title = childNode.toString();
    } else if (/*#__PURE__*/React.isValidElement(childNode) && typeof childNode.props.children === 'string') {
      title = childNode.props.children;
    }
  }
  var componentProps = (0, _extends2["default"])((0, _extends2["default"])((0, _extends2["default"])({
    title: title
  }, restCellProps), additionalProps), {
    colSpan: mergedColSpan !== 1 ? mergedColSpan : null,
    rowSpan: mergedRowSpan !== 1 ? mergedRowSpan : null,
    className: (0, _classnames["default"])(cellPrefixCls, className, (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, "".concat(cellPrefixCls, "-fix-left"), isFixLeft && supportSticky), "".concat(cellPrefixCls, "-fix-left-first"), firstFixLeft && supportSticky), "".concat(cellPrefixCls, "-fix-left-last"), lastFixLeft && supportSticky), "".concat(cellPrefixCls, "-fix-right"), isFixRight && supportSticky), "".concat(cellPrefixCls, "-fix-right-first"), firstFixRight && supportSticky), "".concat(cellPrefixCls, "-fix-right-last"), lastFixRight && supportSticky), "".concat(cellPrefixCls, "-ellipsis"), ellipsis), "".concat(cellPrefixCls, "-with-append"), appendNode), "".concat(cellPrefixCls, "-fix-sticky"), (isFixLeft || isFixRight) && isSticky && supportSticky), "".concat(cellPrefixCls, "-row-hover"), !cellProps && hovering), additionalProps.className, cellClassName),
    style: (0, _extends2["default"])((0, _extends2["default"])((0, _extends2["default"])((0, _extends2["default"])({}, additionalProps.style), alignStyle), fixedStyle), cellStyle),
    onMouseEnter: onMouseEnter,
    onMouseLeave: onMouseLeave,
    ref: isRefComponent(Component) ? ref : null
  });
  return /*#__PURE__*/React.createElement(Component, componentProps, appendNode ? /*#__PURE__*/React.createElement("div", {
    className: "".concat(cellPrefixCls, "-with-append-inner")
  }, appendNode, childNode) : /*#__PURE__*/React.createElement(React.Fragment, null, childNode));
}
var RefCell = /*#__PURE__*/React.forwardRef(Cell);
RefCell.displayName = 'Cell';
// const comparePropList: (keyof InternalCellProps<any>)[] = ['expanded', 'className', 'hovering'];
var comparePropList = ['expanded', 'className'];
var MemoCell = /*#__PURE__*/React.memo(RefCell, function (prev, next) {
  if (next.shouldCellUpdate) {
    return (
      // Additional handle of expanded logic
      comparePropList.every(function (propName) {
        return prev[propName] === next[propName];
      }) &&
      // User control update logic
      !next.shouldCellUpdate(next.record, prev.record)
    );
  }
  return (0, _shallowequal["default"])(prev, next);
});
/** Inject hover data here, we still wish MemoCell keep simple `shouldCellUpdate` logic */
var WrappedCell = /*#__PURE__*/React.forwardRef(function (props, ref) {
  var _React$useContext = React.useContext(_HoverContext["default"]),
    onHover = _React$useContext.onHover,
    startRow = _React$useContext.startRow,
    endRow = _React$useContext.endRow;
  var index = props.index,
    _props$additionalProp = props.additionalProps,
    additionalProps = _props$additionalProp === void 0 ? {} : _props$additionalProp,
    colSpan = props.colSpan,
    rowSpan = props.rowSpan;
  var cellColSpan = additionalProps.colSpan,
    cellRowSpan = additionalProps.rowSpan;
  var mergedColSpan = colSpan !== null && colSpan !== void 0 ? colSpan : cellColSpan;
  var mergedRowSpan = rowSpan !== null && rowSpan !== void 0 ? rowSpan : cellRowSpan;
  var hovering = inHoverRange(index, mergedRowSpan || 1, startRow, endRow);
  return /*#__PURE__*/React.createElement(MemoCell, (0, _extends2["default"])({}, props, {
    colSpan: mergedColSpan,
    rowSpan: mergedRowSpan,
    hovering: hovering,
    ref: ref,
    onHover: onHover
  }));
});
WrappedCell.displayName = 'WrappedCell';
var _default = exports["default"] = WrappedCell;