es-grid-template/lib/table-component/header/TableHeadGroupCell.js

es-grid-template

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _reactTable = require("@tanstack/react-table");
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _rcMasterUi = require("rc-master-ui");
var _utils = require("../hook/utils");
var _useContext = require("../useContext");
var _server = _interopRequireDefault(require("react-dom/server"));
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
const TableHeadGroupCell = props => {
  const {
    column,
    header,
    table,
    depth,
    colSpan,
    rowSpan
  } = props;
  const {
    prefix,
    wrapSettings,
    selectionSettings,
    setIsSelectionChange,
    id
  } = (0, _react.useContext)(_useContext.TableContext);
  const isPinned = column.getIsPinned();
  const isLastLeftPinnedColumn = isPinned === 'left' && column.getIsLastColumn('left');
  const isFirstRightPinnedColumn = isPinned === 'right' && column.getIsFirstColumn('right');
  const originalColumn = column.columnDef.meta ?? {};
  const cellStyles = typeof originalColumn.onCellHeaderStyles === 'function' ? originalColumn.onCellHeaderStyles(header) : originalColumn.onCellHeaderStyles;
  const cellContent = (0, _reactTable.flexRender)(column.columnDef.header, header.getContext());
  const html = _server.default.renderToStaticMarkup( /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, cellContent));
  const hasValue = html.trim().length > 0;
  const style = {
    transition: 'width transform 0.2s ease-in-out',
    whiteSpace: 'nowrap',
    ...cellStyles
  };
  return /*#__PURE__*/_react.default.createElement("div", {
    // ref={setNodeRef}
    className: (0, _classnames.default)(`${prefix}-grid-cell`, {
      [`${prefix}-grid-cell-ellipsis`]: !wrapSettings || !(wrapSettings && (wrapSettings.wrapMode === 'Both' || wrapSettings.wrapMode === 'Header')),
      [`${prefix}-grid-cell-wrap`]: wrapSettings && (wrapSettings.wrapMode === 'Both' || wrapSettings.wrapMode === 'Header'),
      [`${prefix}-grid-cell-fix-left-last`]: isLastLeftPinnedColumn,
      [`${prefix}-grid-cell-fix-right-first`]: isFirstRightPinnedColumn,
      [`${prefix}-grid-cell-text-center`]: (originalColumn?.headerTextAlign ?? originalColumn?.textAlign) === 'center',
      [`${prefix}-grid-cell-text-right`]: (originalColumn?.headerTextAlign ?? originalColumn.textAlign) === 'right'
    }),
    "data-col-span": colSpan,
    key: header.id,
    style: {
      minWidth: column.getSize(),
      flex: 1,
      gridRow: `${depth + 1} / span ${rowSpan}`,
      gridColumn: `span ${colSpan}`,
      ...(0, _utils.getCommonPinningStyles2)(header),
      width: 'auto',
      ...style
    },
    "data-tooltip-id": `${id}-tooltip-content`,
    "data-tooltip-html": !hasValue ? '' : _server.default.renderToStaticMarkup( /*#__PURE__*/_react.default.createElement("div", null, cellContent))
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)('', {
      [`${prefix}-grid-filter-column`]: column.id !== 'selection_column',
      [`${prefix}-grid-selection-column`]: column.id === 'selection_column'
    })
  }, column.id === 'selection_column' && selectionSettings && selectionSettings.hideSelectAll !== false && selectionSettings.type !== 'single' && selectionSettings.mode !== 'radio' && /*#__PURE__*/_react.default.createElement(_rcMasterUi.Checkbox, {
    checked: table.getIsAllRowsSelected(),
    indeterminate: table.getIsSomeRowsSelected(),
    onChange: e => {
      setIsSelectionChange({
        isChange: true,
        type: 'all',
        rowData: {},
        rowsData: []
      });
      table.getToggleAllRowsSelectedHandler()(e);
    }
  }), column.id !== 'selection_column' && /*#__PURE__*/_react.default.createElement("span", {
    className: "ui-rc-table-column-title",
    style: {
      flex: 1
    }
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)('', {
      [`${prefix}-grid-cell-ellipsis`]: !wrapSettings || !(wrapSettings && (wrapSettings.wrapMode === 'Both' || wrapSettings.wrapMode === 'Header')),
      [`${prefix}-grid-cell-text-wrap`]: wrapSettings && (wrapSettings.wrapMode === 'Both' || wrapSettings.wrapMode === 'Header')
    })
  }, cellContent))), column.getCanResize() && /*#__PURE__*/_react.default.createElement("div", {
    onDoubleClick: () => column.resetSize(),
    onMouseDown: header.getResizeHandler(),
    onTouchStart: header.getResizeHandler(),
    className: `resizer ${column.getIsResizing() ? 'isResizing' : ''}`
  }));
};
var _default = exports.default = TableHeadGroupCell;