json-schema minItems maxItems throws React warnings about minCount/maxCount

[RainerAtSpirit]

Using a schema like

const schema = {
  $schema: "http://json-schema.org/draft-07/schema#",
  $ref: "#/definitions/ApprovalRequest",
  definitions: {
    ApprovalRequest: {
      type: "object",
      properties: {
        approvers: {
          type: "array",
          minItems: 1,
          maxItems: 3,
          items: {
            type: "string"
          }
        }
      },
      required: ["approvers"]
    }
  }
};

throws in a react app.

Warning: React does not recognize the `minCount` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `mincount` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in div (created by List)
    in List (created by ListField)
    in ListField (created by AutoField)
    in AutoField (created by AutoValidatedQuickSemanticForm)
    in form (created by AutoValidatedQuickSemanticForm)
    in AutoValidatedQuickSemanticForm (created by App)
    in App

Link to reproduction app: https://codesandbox.io/s/dazzling-field-2lz6h?file=/App.tsx

[wadamek65]

Hi @RainerAtSpirit , thanks for the issue report.

Certainly, in this case, it does not really make sense for minCount and maxCount to be added to a div element. Thanks for reproduction, this is clearly something that should be adjusted.

[radekmie]

Adding a register.ts file with appropriate filterDOMProps.register call will be enough, just like in Simple Schema packages (example). @RainerAtSpirit: you can add it in your project as a workaround.

[RainerAtSpirit]

@radekmie: Thanks for the suggestion that did it.
I've updated the example accordingly: https://codesandbox.io/s/loving-tharp-mei4n?file=/schema/json-schema.tsx:182-196