# All files / list ListItemText.tsx

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

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
    661x
    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
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    903x
    1x
     import type { HTMLAttributes, ReactNode } from "react";
    import { forwardRef } from "react";
    import { PropsWithRef } from "../types.js";
    import { listItemText } from "./listItemStyles.js";

    /**
     * @internal
     */
    export interface ListItemTextProps extends HTMLAttributes<HTMLSpanElement> {
      secondaryText?: ReactNode;
      secondaryTextProps?: PropsWithRef<
        HTMLAttributes<HTMLSpanElement>,
        HTMLSpanElement
      >;

      /** @defaultValue `false` */
      secondaryTextClamped?: boolean;
      secondaryTextClassName?: string;
    }

    /**
     * **Server Component**
     *
     * This is mostly an internal component that can conditionally render secondary
     * text within list items.
     *
     * @internal
     */
    export const ListItemText = forwardRef<HTMLSpanElement, ListItemTextProps>(
      function ListItemText(props, ref) {
        const {
          className,
          secondaryText,
          secondaryTextProps,
          secondaryTextClamped = false,
          secondaryTextClassName,
          children,
          ...remaining
        } = props;

        return (
          <span
            {...remaining}
            ref={ref}
            className={listItemText({
              className,
            })}
          >
            {children}
            {secondaryText && (
              <span
                {...secondaryTextProps}
                className={listItemText({
                  clamped: secondaryTextClamped,
                  className: secondaryTextClassName,
                  secondary: true,
                })}
              >
                {secondaryText}
              </span>
            )}
          </span>
        );
      }
    );