Is that valid to create multiple createFormHook?

export const { useAppForm: useFancyAppForm } = createFormHook({
    fieldComponents: {
        FancyTextField,
        FancySelect,
    },
});

export const { useAppForm: useDefaultAppForm } = createFormHook({
    fieldComponents: {
        TextField,
        Select,
    },
});

type TextFieldProps = ComponentProps<typeof Input> & {
    label?: string;
    description?: string;
};
export default function TextField({
    label,
    description,
    ...inputProps
}: TextFieldProps) {
    const field = useFieldContext<string>();

    const errors = useStore(field.store, (state) => state.meta.errors);
    const isInvalid = field.state.meta.isTouched && !field.state.meta.isValid;

    return (
        <Field data-invalid={isInvalid}>
            {label && <FieldLabel htmlFor={field.name}>{label}</FieldLabel>}
            <Input
                aria-invalid={isInvalid}
                id={field.name}
                name={field.name}
                onBlur={field.handleBlur}
                onChange={(e) => field.handleChange(e.target.value)}
                value={field.state.value}
                {...inputProps}
            />
            {description && <FieldDescription>{description}</FieldDescription>}
            {isInvalid && <FieldError errors={errors} />}
        </Field>
    );
}