Line data    Source code

       1              : /*
       2              :  * Copyright (C) 2023 Red Hat, Inc.
       3              :  * SPDX-License-Identifier: LGPL-2.1-or-later
       4              :  */
       5              : 
       6          636 : import React from "react";
       7              : 
       8              : import { FormHelperText } from "@patternfly/react-core/dist/esm/components/Form/index.js";
       9              : import {
      10              :     HelperText, HelperTextItem, type HelperTextItemProps
      11              : } from "@patternfly/react-core/dist/esm/components/HelperText";
      12              : 
      13          134 : export const FormHelper = ({ helperText, helperTextInvalid, variant, icon, fieldId } :
      14              :   {
      15              :       helperText?: React.ReactNode,
      16              :       helperTextInvalid?: React.ReactNode,
      17              :       variant?: HelperTextItemProps["variant"],
      18              :       icon?: HelperTextItemProps["icon"],
      19              :       fieldId?: string,
      20              :   }
      21          134 : ) => {
      22           32 :     const formHelperVariant = variant || (helperTextInvalid ? "error" : "default");
      23              : 
      24          120 :     if (!(helperText || helperTextInvalid))
      25          120 :         return null;
      26              : 
      27           98 :     return (
      28           98 :         <FormHelperText>
      29           98 :             <HelperText>
      30           98 :                 <HelperTextItem
      31              :                     // TODO @Venefilyn: Handle screenreader for this and add translation
      32           16 :                     {...fieldId && { id: fieldId + '-helper' }}
      33          134 :                     variant={formHelperVariant}
      34          134 :                     icon={icon}>
      35           24 :                     {formHelperVariant === "error" ? helperTextInvalid : helperText}
      36          134 :                 </HelperTextItem>
      37          134 :             </HelperText>
      38          134 :         </FormHelperText>
      39              :     );
      40          134 : };