Weird Json Schema oneOf behavior in RJSF

Question

I have the following schema which is rendered using react-jsonschema-forms framework. Link to playground here

{
  "$schema": "http://json-schema.org/draft-07/schema#",
  "definitions": {
    "XXXType": {
      "title": "XXXX",
      "type": "object",
      "properties": {
        "sourceType": {
          "type": "string",
          "enum": [
            "Xxxxx"
          ],
          "default": "Xxxxx"
        },
        "folioInstrumentFilter": {
          "type": "array",
          "items": {
            "type": "string"
          }
        },
        "folios": {
          "type": "array",
          "items": {
            "type": "integer"
          }
        },
        "xxxxxTradeIds": {
          "type": "array",
          "items": {
            "type": "integer"
          }
        }
      },
      "additionalProperties": false,
      "required": [
        "sourceType"
      ]
    },
    "YYYYType": {
      "title": "YYYY",
      "type": "object",
      "properties": {
        "instrumentTypes": {
          "type": "array",
          "items": {
            "type": "string"
          },
          "minItems": 1
        },
        "books": {
          "type": "array",
          "items": {
            "type": "string"
          }
        },
        "tradeLegIds": {
          "type": "array",
          "items": {
            "type": "integer"
          }
        }
      },
      "required": [
        "instrumentTypes"
      ],
      "additionalProperties": false
    }
  },
  "properties": {
    "name": {
      "type": "string",
      "minLength": 1,
      "maxLength": 50
    },
    "portfolio": {
      "type": "object",
      "oneOf": [
        {
          "properties": {
            "name": {
              "type": "string",
              "enum": [
                "Name 1",
                "Name 2",
                "Name 3",
                "Name 4"
              ]
            }
          },
          "required": [
            "name"
          ]
        },
        {
          "type": "object",
          "properties": {
            "custom": {
              "oneOf": [
                {
                  "$ref": "#/definitions/XXXType"
                },
                {
                  "$ref": "#/definitions/YYYYType"
                }
              ]
            }
          },
          "required": [
            "custom"
          ]
        }
      ]
    }
  },
  "required": [
    "portfolio",
    "name"
  ],
  "additionalProperties": false
}

Change the DropDown in the form (as shown in the image between XXXX and YYYY

The form seems to fail validation in rjsf especially when I switch the inner oneOf between the XxxxxType and YyyyyType definition. It always complains that it doesn't match between one of the two schemas and must have required property 'name'. I have tried different permutations of RJSF options and nothing seems to work.

Also tried discriminating using "if" that that didn't work. I have spent a lot of time trying to figure this out and I can't figure out the issue. Your help is much appreciated.

Please see animated GIF at bottom of issue that shows how to reproduce the bug. Note that

• Selecting XXXX after selecting Option 1 creates correct Json and is valid.
• Switching to YYYY causes validation error (schema selection for oneOf).
• Switching back to XXXX completely removes the element Json and fail validation.