All files / src/table TableHead.tsx

85% Statements 17/20
66.67% Branches 8/12
100% Functions 4/4
85% Lines 17/20

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73                3x           7x 7x   7x   33x 33x     33x         33x         33x 30x                 33x             7x 33x 33x     33x             7x 7x                  
import React, { forwardRef } from "react";
import { Text } from "../text";
import { TableBox } from "./TableBox";
import { TableProps } from "./TableProps";
import { useMiddleware } from "./util/use-middleware";
import { isCallable } from "../_util/is-callable";
import { useConfig } from "../_util/config-context";
 
export const TableHead = forwardRef(function TableHead(
  props: TableProps & {
    boxStyle?: React.CSSProperties;
  },
  ref: React.Ref<HTMLDivElement>
) {
  const { classPrefix } = useConfig();
  const { columns, addons, boxStyle, disableTextOverflow } = props;
 
  const renderColumn = useMiddleware(addons, "onInjectColumn")(
    (record, rowKey, recordIndex, column, columnIndex) => {
      const { key, header } = column;
      let children: React.ReactNode = header;
 
      // pass a render function
      Iif (isCallable(header)) {
        children = header(column);
      }
 
      // forgot to pass, use a key as a reminder
      Iif (header === undefined) {
        children = key;
      }
 
      // plain values
      if (typeof header === "string" || typeof header === "number") {
        children = (
          <Text
            overflow={!disableTextOverflow}
            title={disableTextOverflow ? undefined : String(header)}
          >
            {header}
          </Text>
        );
      }
      return {
        props: {},
        children,
      };
    }
  );
 
  const tableHeaders = columns.map((column, index) => {
    const { props, children } = renderColumn(null, null, -1, column, index);
    Iif (props.colSpan === 0) {
      return null;
    }
    return (
      <Text key={column.key} parent="th" {...props} align={column.align}>
        <div>{children}</div>
      </Text>
    );
  });
 
  return useMiddleware(addons, "onInjectHead")(props => (
    <div className={`${classPrefix}-table__header`} ref={ref}>
      <TableBox columns={columns} style={boxStyle} classPrefix={classPrefix}>
        <thead>
          <tr>{tableHeaders}</tr>
        </thead>
      </TableBox>
    </div>
  ))(props);
});