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); }); |