All files / src/table Table.tsx

81.82% Statements 9/11
42.86% Branches 3/7
66.67% Functions 2/3
81.82% Lines 9/11

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                      3x   7x 7x   7x 7x                     7x   7x 7x                         7x                    
import React, { useRef } from "react";
import classNames from "classnames";
import { TableProps } from "./TableProps";
import { TableHead } from "./TableHead";
import { TableBody } from "./TableBody";
import { useMiddleware } from "./util/use-middleware";
import { createRocket } from "../_util/create-rocket";
import * as addons from "./addons";
import { withStatics } from "../_util/with-statics";
import { useConfig } from "../_util/config-context";
 
export const Table = withStatics(
  function Table<T>(props: TableProps<T>) {
    const { classPrefix } = useConfig();
    const { addons = [], bordered, compact, verticalTop, hideHeader } = props;
 
    const headRef = useRef<HTMLDivElement>(null);
    const bodyRef = useRef<HTMLDivElement>(null);
 
    // 同步 body 和 header 滚动位置
    function handleScroll() {
      if (headRef.current && bodyRef.current) {
        headRef.current.scrollLeft = bodyRef.current.scrollLeft;
      }
    }
 
    // 执行 addon props middleware
    // eslint-disable-next-line no-param-reassign
    props = useMiddleware(addons, "onInjectProps")(props);
 
    const renderTable = useMiddleware(addons, "onInjectTable")(props => (
      <div
        className={classNames(`${classPrefix}-table`, {
          [`${classPrefix}-table--compact`]: compact,
          [`${classPrefix}-table--bordered`]: bordered,
          [`${classPrefix}-table--allbordered`]: bordered === "all",
          [`${classPrefix}-table--verticaltop`]: verticalTop,
        })}
      >
        {!hideHeader && <TableHead ref={headRef} {...props} />}
        <TableBody ref={bodyRef} onScrollCapture={handleScroll} {...props} />
      </div>
    ));
 
    return renderTable(props);
  },
  {
    addons,
    ActionPanel: createRocket(
      "ActionPanel",
      "div.@{prefix}-table__action-panel"
    ),
  }
);