Hero Hook Form API / FileFieldProps

Type Alias: FileFieldProps<TFieldValues>

FileFieldProps<TFieldValues> = FieldBaseProps<TFieldValues, FileList | null> & WithControl<TFieldValues> & object

Defined in: fields/FileField.tsx:36

Props for the FileField component.

Type Declaration

fileProps?

optional fileProps: Omit<React.ComponentProps<typeof Input>, "value" | "onValueChange" | "label" | "isInvalid" | "errorMessage" | "isDisabled" | "type">

Additional props to pass to the underlying Input component

transform()?

optional transform: (value) => FileList | null

Transform function to modify the file list before it’s set

Parameters

value

FileList | null

Returns

FileList | null

multiple?

optional multiple: boolean

Whether multiple files can be selected

accept?

optional accept: string

Accepted file types (e.g., “image/*”, “.pdf,.doc”)

Type Parameters

TFieldValues

TFieldValues extends FieldValues

The form data type

Example


import { FileField } from "@rachelallyson/hero-hook-form";
import { useForm } from "react-hook-form";
 
const form = useForm({
  defaultValues: { avatar: null as FileList | null },
});
 
<FileField
  control={form.control}
  name="avatar"
  label="Upload Avatar"
  accept="image/*"
  description="Select an image file"
/>