@rtdui/datatable/cjs/DataTable/BodyCell.cjs

React DataTable component based on Rtdui components

'use client';
'use strict';

var jsxRuntime = require('react/jsx-runtime');
var clsx = require('clsx');
var reactTable = require('@tanstack/react-table');
var iconsReact = require('@tabler/icons-react');
var core = require('@rtdui/core');
var shouldElevation = require('./utils/shouldElevation.cjs');

function BodyCell(props) {
  const { cell, scrollingTrigger, enableGrouping, changesRef } = props;
  const { row, column, table } = cell.getContext();
  const hasError = changesRef.current?.errors?.[row.id]?.[column.columnDef?.accessorKey];
  const cellDataType = core.getType(row.getValue(column.id));
  const isSticky = column.getIsPinned();
  return /* @__PURE__ */ jsxRuntime.jsx(
    "td",
    {
      className: clsx({
        elevation: shouldElevation.shouldElevation(table, column, scrollingTrigger),
        "outline outline-1 outline-error outline-offset-[-2px]": hasError,
        "text-right": cellDataType === "Number",
        placeholder: cell.getIsPlaceholder()
      }),
      title: hasError || void 0,
      style: {
        // width: column.getSize(),
        position: isSticky ? "sticky" : "relative",
        left: column.getIsPinned() ? column.getStart("left") : void 0,
        zIndex: isSticky ? 1 : void 0
      },
      children: cell.getIsGrouped() ? (
        // 如果是分组单元格则添加展开按钮
        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
          /* @__PURE__ */ jsxRuntime.jsx(
            "button",
            {
              type: "button",
              onClick: row.getToggleExpandedHandler(),
              className: "btn btn-ghost btn-circle btn-xs",
              children: row.getIsExpanded() ? /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconChevronDown, { size: 16 }) : /* @__PURE__ */ jsxRuntime.jsx(iconsReact.IconChevronRight, { size: 16 })
            }
          ),
          reactTable.flexRender(column.columnDef.cell, cell.getContext()),
          " (",
          row.subRows.length,
          ")"
        ] })
      ) : enableGrouping && cell.getIsAggregated() ? (
        // 如果是聚合的单元格
        reactTable.flexRender(column.columnDef.aggregatedCell, cell.getContext())
      ) : cell.getIsPlaceholder() ? null : (
        // For cells with repeated values, render null, Otherwise just render the regular cell
        reactTable.flexRender(column.columnDef.cell, cell.getContext())
      )
    },
    cell.id
  );
}

exports.BodyCell = BodyCell;
//# sourceMappingURL=BodyCell.cjs.map