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 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 | 2x 9x 2x 2x 9x 2x 2x 6x 6x 9x 2x | import { memo, ReactElement, useCallback } from "react";
import {
Control,
Controller,
ControllerFieldState,
ControllerRenderProps,
FieldValues,
Path,
} from "react-hook-form";
import { EmailInput, Props as EmailInputProps } from "../EmailInput";
interface FormEmailInputProps<T extends FieldValues> extends Omit<
EmailInputProps,
"values" | "onChange"
> {
control: Control<T>;
name: Path<T>;
rules?: object;
onChange?: (value: string[]) => void;
}
interface EmailControllerProps<T extends FieldValues> {
field: ControllerRenderProps<T, Path<T>>;
fieldState: ControllerFieldState;
props: Omit<EmailInputProps, "values" | "onChange" | "errorMessage">;
errorMessage?: string;
onPropsChange?: (value: string[]) => void;
}
const EmailControllerInstance = <T extends FieldValues>({
field: { onChange, value },
fieldState: { error },
props,
errorMessage,
onPropsChange,
}: EmailControllerProps<T>) => {
const handleChange = useCallback(
(vals: string[]) => {
onChange(vals);
onPropsChange?.(vals);
},
[onChange, onPropsChange],
);
return (
<EmailInput
{...props}
values={(value as string[]) || []}
onChange={handleChange}
errorMessage={error?.message || errorMessage}
/>
);
};
const EmailController = memo(
EmailControllerInstance,
) as typeof EmailControllerInstance;
export const FormEmailInput = <T extends FieldValues>({
control,
name,
rules,
onChange,
...props
}: FormEmailInputProps<T>): ReactElement => {
const { errorMessage, ...rest } = props;
return (
<Controller
control={control}
name={name}
rules={rules}
render={(renderProps) => (
<EmailController
{...renderProps}
props={rest}
errorMessage={errorMessage}
onPropsChange={onChange}
/>
)}
/>
);
};
FormEmailInput.displayName = "FormEmailInput";
|