Improving Nullable Field Handling for Better Developer Experience

[aress31]

Prerequisites

• I have searched the existing issues
• I understand that providing a SSCCE example is tremendously useful to the maintainers.
• I have read the documentation
• Ideally, I'm providing a sample JSFiddle, Codesandbox.io or preferably a shared playground link demonstrating the issue.

What theme are you using?

mui

Version

5.x

Current Behavior

Currently, to allow properties to accept null values, it is necessary to explicitly add null to the type. However, the required option already ensures that a non-null value is provided.

In my case, I pass null values through my form because the data is pulled directly from the database, and some columns are nullable.

At the moment, the process forces me to manually add null to the type for every field, which creates a poor developer experience (DX).

I suggest reversing the logic: make all fields nullable by default, and only fields that should not accept null values would need a not-null option.

Additionally, based on my tests, the required option still enforces a value even if the field allows null.

I would like to see a rework of the nullable logic to improve the developer experience.

Expected Behavior

No response

Steps To Reproduce

https://rjsf-team.github.io/react-jsonschema-form/#eyJmb3JtRGF0YSI6eyJpZCI6IjRlZTk4ZjI2LTg3MDItNGU2MC1iNjA1LTJlNTFhMTFlOWEwZCIsInN0YXR1cyI6bnVsbCwic3RhcnQiOm51bGwsImVuZCI6bnVsbH0sInNjaGVtYSI6eyJ0eXBlIjoib2JqZWN0IiwiZGVmaW5pdGlvbnMiOnsic3RhdHVzIjp7ImVudW0iOlsiYWN0aXZlIiwiY2FuY2VsbGVkIiwiY29tcGxldGVkIiwiaW5hY3RpdmUiLCJwZW5kaW5nIl19fSwicHJvcGVydGllcyI6eyJpZCI6eyJ0eXBlIjoic3RyaW5nIn0sInN0YXR1cyI6eyJ0eXBlIjpbInN0cmluZyIsbnVsbF0sIiRyZWYiOiIjL2RlZmluaXRpb25zL3N0YXR1cyJ9LCJzdGFydCI6eyJ0eXBlIjoic3RyaW5nIiwiZm9ybWF0IjoiZGF0ZSJ9LCJlbmQiOnsidHlwZSI6InN0cmluZyIsImZvcm1hdCI6ImRhdGUtdGltZSJ9fX0sInVpU2NoZW1hIjp7fSwidGhlbWUiOiJkZWZhdWx0IiwibGl2ZVNldHRpbmdzIjp7InNob3dFcnJvckxpc3QiOiJ0b3AiLCJ2YWxpZGF0ZSI6ZmFsc2UsImRpc2FibGVkIjpmYWxzZSwibm9IdG1sNVZhbGlkYXRlIjpmYWxzZSwicmVhZG9ubHkiOmZhbHNlLCJvbWl0RXh0cmFEYXRhIjpmYWxzZSwibGl2ZU9taXQiOmZhbHNlLCJleHBlcmltZW50YWxfZGVmYXVsdEZvcm1TdGF0ZUJlaGF2aW9yIjp7ImFycmF5TWluSXRlbXMiOiJwb3B1bGF0ZSIsImFsbE9mIjoic2tpcERlZmF1bHRzIiwiY29uc3RBc0RlZmF1bHRzIjoiYWx3YXlzIiwiZW1wdHlPYmplY3RGaWVsZHMiOiJwb3B1bGF0ZUFsbERlZmF1bHRzIiwibWVyZ2VEZWZhdWx0c0ludG9Gb3JtRGF0YSI6InVzZUZvcm1EYXRhSWZQcmVzZW50In0sImxpdmVWYWxpZGF0ZSI6dHJ1ZX19

Environment

Latest everything.

Anything else?

No response

[kuhlaid]

@aress31, your schema should probably look like (note the null enum for status and the quoted "null" types):

{
  "type": "object",
  "definitions": {
    "status": {
      "enum": [
        null,
        "active",
        "cancelled",
        "completed",
        "inactive",
        "pending"
      ]
    }
  },
  "properties": {
    "id": {
      "type": "string"
    },
    "status": {
      "type": [
        "string",
        "null"
      ],
      "$ref": "#/definitions/status"
    },
    "start": {
      "type": [
        "string",
        "null"
      ],
      "format": "date"
    },
    "end": {
      "type": [
        "string",
        "null"
      ],
      "format": "date-time"
    }
  }
}

[nickgros]

@aress31 To get the exact behavior you want, the easiest option might be to override the SelectWidget by using your own custom widget. You could copy the base implementation and make minor modifications as needed.

In the core SelectWidget, we add the placeholder option if there is no default value, and the field doesn't allow selecting more than one option.

You could add null to your schema and remove the placeholder option, or add some custom logic to replace null with the empty option if the suggestions in #4422 are not satisfactory.

I don't know that we can change the default behavior for null values in RJSF v5 (and it's a big ask for v6, we try to avoid breaking changes that could affect so many JSON schemas unless absolutely necessary). But we could definitely consider a proposal, followed by a PR, to add a new opt-in feature to Form props if you really need the ability to change functionality there.