UISchema classNames do not work with material-ui theme

Prerequisites

• I have read the documentation;
• In the case of a bug report, I understand that providing a SSCCE example is tremendously useful to the maintainers.
• Ideally, I’m providing a sample JSFiddle or a shared playground link demonstrating the issue.

Description

UISchema classNames do not seem to work with the material-ui theme.

Steps to Reproduce

See this simple sample: JSONSchema

{
  "properties": {
    "field": {
      "type": "string"
    }
  }
}

UISchema

{
  "classNames": "extraClass"
}

See the playgrounds

• with material-ui theme
• with default theme

Expected behavior

extraClass like in the default html output:

<form class="rjsf">
 <div class="form-group field field-undefined  extraClass">
  <fieldset id="root">
   <div class="form-group field field-string">
    <label class="control-label" for="root">
     field
    </label>
    <input class="form-control" id="root" label="field" placeholder="" type="text" value="">
   </div>
  </fieldset>
 </div>
 <div>
  <button type="submit" class="btn btn-info">
   Submit
  </button>
 </div>
</form>

Actual behavior

No extraClass in the material-ui html output:

<form class="rjsf">
 <div class="MuiFormControl-root MuiFormControl-fullWidth">
  <div class="MuiGrid-root jss5 MuiGrid-container MuiGrid-spacing-xs-2">
   <div class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12" style="margin-bottom: 10px;">
    <div class="MuiFormControl-root MuiFormControl-fullWidth">
     <div class="MuiFormControl-root MuiFormControl-fullWidth">
      <div class="MuiFormControl-root MuiTextField-root">
       <label class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated" data-shrink="false" for="root" id="root-label">
        field
       </label>
       <div class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-formControl MuiInput-formControl">
        <input aria-invalid="false" id="root" name="" type="string" class="MuiInputBase-input MuiInput-input" value="">
       </div>
      </div>
     </div>
    </div>
   </div>
  </div>
 </div>
 <div>
  <button type="submit" class="btn btn-info">
   Submit
  </button>
 </div>
</form>

A simple code search shows no result for classnames in the path /packages/material-ui/src/.

Version

The current github pages version.

[hiitskiran]

If providing field level classNames is not yet supported for material UI, is there a work around until support is avaialble?

[benjaminbours]

Wow it’s crazy such an important problem is still there for that long time! I’m gonna open a PR about it, I mean, it’s the basic of such a theme library, to at least support the basic features of the form generator itself.