Typescript: Initial Values PartialDeep not working as expected

[robinpilz]

What happened?

Typescript Error is thrown for initial values when a property in the schema is required. This should not be the case as the input values should always be able to be initialized as undefined (empty).

I found that for regular objects the PartialDeep seems to work (so all the properties are optional), but when having an array of objects typescript complains that all the required values must be present when initializing

Reproduction steps

Example which shows error for undefined values (more complex schema):

<script lang="ts" setup>
import { toTypedSchema } from '@vee-validate/yup';
import { useForm } from 'vee-validate';
import { array, number, object, string } from 'yup';

const getInitialData = () => {
  return {
    array: [
      {
        someText: 'String',
      },
    ],
  };
};

const schema = toTypedSchema(
  object({
    array: array()
      .of(
        object({
          someText: string().required(),
          someId: number().required(),
        }),
      )
      .min(1),
  }),
);

const { resetForm } = useForm({
  validationSchema: schema,
  initialValues: getInitialData(),
});

const reset = () => {
  resetForm(
    {
      values: getInitialData(),
    },
    { force: true },
  );
};
</script>

<template>
  <div></div>
</template>

Example of working version (simple object schema):

<script lang="ts" setup>
import { toTypedSchema } from '@vee-validate/yup';
import { useForm } from 'vee-validate';
import { number, object, string } from 'yup';

const getInitialData = () => {
  return {
    someText: 'String',
  };
};

const schema = toTypedSchema(
  object({
    someText: string().required(),
    someId: number().required(),
  }),
);

const { resetForm } = useForm({
  validationSchema: schema,
  initialValues: getInitialData(),
});

const reset = () => {
  resetForm(
    {
      values: getInitialData(),
    },
    { force: true },
  );
};
</script>

<template>
  <div></div>
</template>

Version

Vue.js 3.x and vee-validate 4.x

What browsers are you seeing the problem on?

• Firefox
• Chrome
• Safari
• Microsoft Edge

Relevant log output

No response

Demo link

• Could not get typescript to show errors in sandboxes -

Code of Conduct

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