useControl strange behaviour

[stimw]

Describe the bug and the expected behavior

I am using useControl in a DateInput component and mapping the value type from Date to string as "DD/MM/YYYY" to match the string type of formData. However, when I submit, it always gets converted to a ISO String. But useInputControl, on the other hand, does not have this issue in this case.

Please check the StackBlitz example:
https://stackblitz.com/edit/stackblitz-starters-hymcsl?file=app%2Fform.tsx

I console.log the value of inputControl.value and control.value both in onSubmit and in the server action.

Conform version

v1.0.2

Steps to Reproduce the Bug or Issue

1. Open the StackBlitz example
2. Select dates and Submit
3. Check the terminal logging, the control value is a ISO String while the inputControl value is not.

What browsers are you seeing the problem on?

Chrome

Screenshots or Videos

Additional context

In fact, the same thing happened in useInputControl, but I can't seem to reproduce it.

[edmundhung]

This is because you are leaving it to mantine to decide how the input is rendered when you provide a name prop to it. If you inspect the element, you will find this html:

<input type="hidden" name="control" value="2026-02-12T23:00:00.000Z">

If you wanna have full control over the value on the input, it would be better to create your own hidden input like this:

<input
  type="hidden"
  ref={control.register}
  name={fields.control.name}
  defaultValue={control.value}
/>
<DatePickerInput
  label="useControl"
  placeholder="Pick date"
  valueFormat="DD/MM/YYYY"
  name={fields.control.name}
  value={control.value ? stringToDate(control.value) : null}
  onChange={(value) => control.change(value ? dateToString(value) : '')}
  error={fields.control.errors}
/>

[stimw]

Thank you for clarifying this for me. Will there be a better way to accomplish this in the future without needing to create another hidden input? Or is there a possibility that useInputControl will be retained?