<Select /> input value is not changing outside of the Select (Formik resetForm)

[VladMarkus]

What package has an issue

@mantine/core

Describe the bug

Hello!

First of all I really enjoy using Mantine along with Next.js 13 App Directory! Provided features and components are amazingly thought out, designed, and developed. Thanks you for all your efforts.

We're currently building the app with alpha version. And yesterday I found out an issue in @mantince/core@^v7.0.0-alpha.17.

I'm using Formik with Mantine Select component. This form contains 'Reset' button, which calls Formik.resetForm() function. The value inside the dropdown is changing back to the initial, but the value in the Select Input is not changing. Here is my implementation for the context:

<Formik<PropertyFormData>
  innerRef={handleFormRef}
  initialValues={mapPropertyFromResponse(property)}
  onSubmit={handleFormSubmit}
>
  {(formProps) => {
    return (
      <Form>
        <Select
          label='Value Type'
          name='valueType'
          data={VALUE_TYPE_OPTIONS}
          value={formProps.values.valueType}
          onChange={(value) => {
            formProps.handleChange({ target: { name: 'valueType', value } });
            if (value === ValueType.BOOLEAN) {
              formProps.handleChange({ target: { name: 'unit', value: '' } });
            }
           }}
          />
        <Button onClick={formProps.resetForm()} type='button'>Reset</Button>
      </Form>
    );
  }}
</Formik>

What version of @mantine/hooks page do you have in package.json?

v7.0.0-alpha.17

If possible, please include a link to a codesandbox with the reproduced problem

No response

Do you know how to fix the issue

No

Are you willing to participate in fixing this issue and create a pull request with the fix

None

Possible fix

No response

[rtivital]

value: '' is not a valid value unless you have option with an empty string in the data array. To make input empty set value to null.