resolvers icon indicating copy to clipboard operation
resolvers copied to clipboard

[valibot] Validation errors reported by ‘checkItems’ are not displayed properly

Open Thanaen opened this issue 1 year ago • 0 comments

Describe the bug Validation errors reported by ‘checkItems’ should be displayed in the same way as other errors

To Reproduce Steps to reproduce the behavior:

  1. Focus the first input
  2. Insert "t"
  3. Submit (to trigger a length error)
  4. Update the input value to "value"
  5. Add another input using the "Add input" button
  6. Insert "value" in the newly added input
  7. Submit

Codesandbox link (Required) https://stackblitz.com/edit/vitejs-vite-yj5g5r?file=src%2FApp.tsx

Expected behavior Validation errors reported by ‘checkItems’ should be displayed in the same way as other errors

Form schema:

const FormSchema = v.object({
  test: v.pipe(
    v.array(
      v.object({
        value: v.pipe(v.string(), v.minLength(4)),
      })
    ),
    v.checkItems(
      (item, index, values) =>
        values.map((v) => v.value).indexOf(item.value) === index,
      'Duplicate items'
    )
  ),
});

Error displayed properly: image

Error not displayed properly: image

Additional context

"dependencies": {
    "@hookform/resolvers": "^3.9.0",
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "react-hook-form": "^7.52.1",
    "valibot": "^0.36.0"
  }

Thanaen avatar Jul 29 '24 12:07 Thanaen