invalid, errors and dirty readable stores from formup do not show correct values

[kimskovhusandersen]

Hi Sascha,

I'm displaying a form with a single field.

When selecting the field, the $dirty store does not update. It remains an empty object.
When I enter a text and delete it again, the $errors and $invalid store do not update either. Both remain empty objects.

{ "values": { "bpm_comment": "" }, "invalid": {}, "errors": {}, "dirty": {} }

I'm using

• svelte-formup version 0.6.2,
• svelte version 3.32.0, and
• yup version 0.30.0

Here is my code:

<script lang="ts">
  import { object, string } from 'yup'
  import { formup } from 'svelte-formup'

  const schema = object().shape({
    bpm_comment: string().required(),
  })

  const { values, validate, invalid, errors, dirty, validity } = formup({
    getInitialValues: () => ({
      bpm_comment: undefined,
    }),
    validateOn: ['input', 'change'],
    schema,
    validateInitialValues: true,
    async onSubmit(data, _) {
      console.log({ data })
    },
  })

</script>

<form use:validate role="form">
  <div use:validity>
    <textarea
      id={'bpm_comment'}
      name="bpm_comment"
      label="Comment (optional)"
      rows={3}
      bind:value={$values.bpm_comment} />
  </div>
  <p>
    <button type="submit">Submit</button>  
    <button type="reset">reset</button></p>
</form>

{JSON.stringify({ values: $values, invalid: $invalid, errors: $errors, dirty: $dirty }, null, 4)}