# All files / form FormMessageContainer.tsx

75% Statements 36/48
50% Branches 1/2
100% Functions 1/1
75% Lines 36/48

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
    491x
    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
    418x
    418x
    418x
    418x

     "use client";
    import { cnb } from "cnbuilder";
    import type { HTMLAttributes } from "react";
    import { forwardRef } from "react";
    import { PropsWithRef } from "../types.js";
    import { FormMessage } from "./FormMessage.js";
    import type { FormMessageProps } from "./types.js";

    /**
     * @remarks \@since 2.5.0
     */
    export interface FormMessageContainerProps
      extends HTMLAttributes<HTMLDivElement> {
      /**
       * If the extension doesn't actually want to render the `FormMessage`
       * component, these props are optional. It kind of eliminates the whole
       * purpose of this component though.
       */
      messageProps?: PropsWithRef<FormMessageProps, HTMLDivElement>;
    }

    /**
     * **Client Component**
     * This might be able to become a server component if FormMessage removes the useFormTheme hook
     *
     * @internal
     * @remarks \@since 2.5.0
     */
    export const FormMessageContainer = forwardRef<
      HTMLDivElement,
      FormMessageContainerProps
    >(function FormMessageContainer(props, ref) {
      const { className, children, messageProps, ...remaining } = props;
      if (!messageProps) {
        return <>{children}</>;
      }

      return (
        <div
          {...remaining}
          ref={ref}
          className={cnb("rmd-form-message-container", className)}
        >
          {children}
          <FormMessage {...messageProps} />
        </div>
      );
    });