# All files / src/table TableRow.tsx

100% Statements 68/68
100% Branches 1/1
100% Functions 1/1
100% Lines 68/68

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
    691x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    122x
    1x
     "use client";
    import { forwardRef, type HTMLAttributes } from "react";
    import {
      useTableConfig,
      type TableRowConfiguration,
    } from "./TableConfigurationProvider.js";
    import { tableRow } from "./tableRowStyles.js";

    export interface TableRowProps
      extends HTMLAttributes<HTMLTableRowElement>,
        TableRowConfiguration {
      /**
       * Boolean if the current row has been selected and should apply the selected
       * background-color.
       *
       * @defaultValue `false`
       */
      selected?: boolean;

      /**
       * Boolean if the row should be clickable and update the cursor while hovered
       * to be a pointer.
       *
       * @defaultValue `false`
       */
      clickable?: boolean;
    }

    /**
     * **Client Component**
     *
     * Creates a `<tr>` element with some general styles that are inherited from the
     * base table configuration.
     */
    export const TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(
      function TableRow(props, ref) {
        const {
          className,
          disableHover: propDisableHover,
          disableBorders: propDisableBorders,
          children,
          selected = false,
          clickable = false,
          ...remaining
        } = props;

        const { disableHover, disableBorders } = useTableConfig({
          disableHover: propDisableHover,
          disableBorders: propDisableBorders,
        });

        return (
          <tr
            {...remaining}
            ref={ref}
            className={tableRow({
              selected,
              clickable,
              disableHover,
              disableBorders,
              className,
            })}
          >
            {children}
          </tr>
        );
      }
    );