Skip to main content

TranslatableFormFieldWrapper

This is the equivalent of the FormFieldWrapper component, but for translatable fields.

Example

Tsx
<PageBlock column="main" blockId="main-form">    <DetailFormGrid>        <TranslatableFormFieldWrapper            control={form.control}            name="name"            label={<Trans>Product name</Trans>}            render={({ field }) => <Input {...field} />}        />        <TranslatableFormFieldWrapper            control={form.control}            name="slug"            label={<Trans>Slug</Trans>}            render={({ field }) => <Input {...field} />}        />    </DetailFormGrid>    <TranslatableFormFieldWrapper        control={form.control}        name="description"        label={<Trans>Description</Trans>}        render={({ field }) => <RichTextInput {...field} />}    /></PageBlock>

The props for the TranslatableFormField component.

Signature
type TranslatableFormFieldProps<TFieldValues extends TranslatableEntity | TranslatableEntity[]> = Omit<    ControllerProps<TFieldValues>,    'name'> & {    /**     * @description     * The label for the form field.     */    label?: React.ReactNode;    /**     * @description     * The name of the form field.     */    name: TFieldValues extends TranslatableEntity        ? keyof Omit<NonNullable<TFieldValues['translations']>[number], 'languageCode'>        : TFieldValues extends TranslatableEntity[]            ? keyof Omit<NonNullable<TFieldValues[number]['translations']>[number], 'languageCode'>            : never;}
Was this chapter helpful?
Report Issue
Edited Feb 2, 2026·Edit this page