issue: Setting nested values with dot notation via useForm defaultValues works differently than setting nested values with dot notation via useController

[phinch]

Version Number

7.43.3

Codesandbox/Expo snack

https://codesandbox.io/s/focused-microservice-cjinms?file=/src/App.tsx

Steps to reproduce

1. There are 2 forms on the page, the top one sets defaultValues in useForm and the bottom one uses useController to set a defaultValue. Both forms log values to the console when submitted
2. Submit the first form; observe that the submit payload contains an "info.firstName" key as well as an info: { firstName } key
3. Submit the second form; observe that the submit payload contains only an info: { firstName } key

Expected behaviour

It seems like in most cases, like useController, providing an input name with dot notation sets up the form values state as a nested object. But when using useForm and providing dot notation in defaultValues, the form values that get set up are a flat object, not a nested object.

Is it intentional that useForm works differently for setting up form values compared to useController? It seems like possibly a bug to me, but perhaps there are reasons why this is set up this way, or maybe I am misunderstanding the intended usage of dot notation in react-hook-form?

What browsers are you seeing the problem on?

Chrome

Relevant log output

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

[bluebill1049]

• defaultValues is what you supplied for your form default values

const { register, handleSubmit } = useForm<FormValues>({
  defaultValues: {
    "info.firstName": "bill"
  }
});

• name prop is the field path.

We don't convert your default values into nested object path.

[stychu]

• defaultValues is what you supplied for your form default values

const { register, handleSubmit } = useForm<FormValues>({
  defaultValues: {
    "info.firstName": "bill"
  }
});

• name prop is the field path.

We don't convert your default values into nested object path.

We don't convert your default values into nested object path.

So how do you explain that when setting "info.firstName": "bill" will setup the value for that field and after that when the field changes and form is submitted the data will be converted to nested object alongside default value on top of it ?

//submission of the form results in both data. And clearly RHF converts props to nested object
{
	info.firstName": "bill",
	info: {
		firstName: "new value"	
	}
}

To me clearly RHF does the conversion from flat object paths to nested object. Why tho it keeps flat object paths???

Its seems definetly like a bug.