# All files / src/card CardTitle.tsx

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

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
    551x
    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
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    3x
    1x
     import { forwardRef } from "react";
    import {
      Typography,
      type TypographyHTMLElement,
      type TypographyProps,
    } from "../typography/Typography.js";
    import { cardTitle } from "./styles.js";

    /**
     * @remarks \@since 6,0.0 Extends the {@link TypographyProps} and removed the
     * `small`/`noWrap` props.
     */
    export interface CardTitleProps extends TypographyProps {
      /** @defaultValue `"h5"` */
      as?: TypographyProps["as"];

      /** @defaultValue `"headline-5"` */
      type?: TypographyProps["type"];

      /** @defaultValue "none" */
      margin?: TypographyProps["margin"];
    }

    /**
     * **Server Component**
     *
     * @remarks \@since 6.0.0 Extends the {@Link Typography} component and removed
     * the `small`/`noWrap` props.
     */
    export const CardTitle = forwardRef<TypographyHTMLElement, CardTitleProps>(
      function CardTitle(props, ref) {
        const {
          children,
          as = "h5",
          type = "headline-5",
          margin = "none",
          className,
          ...remaining
        } = props;

        return (
          <Typography
            {...remaining}
            ref={ref}
            as={as}
            type={type}
            margin={margin}
            className={cardTitle({ className })}
          >
            {children}
          </Typography>
        );
      }
    );