2024-02-13 12:53:38 +00:00
|
|
|
import {
|
|
|
|
FormGroup,
|
|
|
|
FormGroupProps,
|
|
|
|
ValidatedOptions,
|
|
|
|
} from "@patternfly/react-core";
|
2023-03-24 15:53:43 +00:00
|
|
|
import { PropsWithChildren } from "react";
|
|
|
|
import { FieldError, FieldValues, Merge } from "react-hook-form";
|
|
|
|
import { HelpItem } from "./HelpItem";
|
|
|
|
|
2024-02-13 12:53:38 +00:00
|
|
|
export type FieldProps<T extends FieldValues = FieldValues> = {
|
2023-03-24 15:53:43 +00:00
|
|
|
label?: string;
|
|
|
|
name: string;
|
|
|
|
labelIcon?: string;
|
|
|
|
error?: FieldError | Merge<FieldError, T>;
|
|
|
|
isRequired: boolean;
|
|
|
|
};
|
|
|
|
|
2024-02-13 12:53:38 +00:00
|
|
|
type FormLabelProps = FieldProps & Omit<FormGroupProps, "label" | "labelIcon">;
|
|
|
|
|
2023-03-24 15:53:43 +00:00
|
|
|
export const FormLabel = ({
|
|
|
|
name,
|
|
|
|
label,
|
|
|
|
labelIcon,
|
|
|
|
error,
|
|
|
|
children,
|
|
|
|
...rest
|
|
|
|
}: PropsWithChildren<FormLabelProps>) => (
|
|
|
|
<FormGroup
|
|
|
|
label={label || name}
|
|
|
|
fieldId={name}
|
|
|
|
labelIcon={
|
|
|
|
labelIcon ? (
|
|
|
|
<HelpItem helpText={labelIcon} fieldLabelId={name} />
|
|
|
|
) : undefined
|
|
|
|
}
|
|
|
|
helperTextInvalid={error?.message}
|
|
|
|
validated={error ? ValidatedOptions.error : ValidatedOptions.default}
|
|
|
|
{...rest}
|
|
|
|
>
|
|
|
|
{children}
|
|
|
|
</FormGroup>
|
|
|
|
);
|