rjsf-team/react-jsonschema-form

Use `enum` to populate dropdown list for object key

Open

#4682 opened on Jul 1, 2025

View on GitHub
 (2 comments) (2 reactions) (0 assignees)TypeScript (13,175 stars) (2,136 forks)batch import
featurehelp wanted

Description

Prerequisites

What theme are you using?

N/A

Is your feature request related to a problem? Please describe.

We have the following JSON schema structure:

{
  "additionalProperties": {
    "type": "string"
  },
  "propertyNames": {
    "enum": [
      "a",
      "b",
      "c",
      "d"
    ]
  },
  "type": "object"
}

The object keys have an enumerated list of allowed values.

react-jsonschema-form picks this enum correctly up in the validation: Image

However, as an end user it is difficult to understand from the generated user interface what is wrong, and what the allowed values are.

Describe the solution you'd like

When key is an enum with a defined list of allowed values, show it as a dropdown instead of a text input field, in order to support the user in filling in valid values.

Describe alternatives you've considered

Add the allowed values in the enum to the field description, such that the user have it documented. However, this has the risk of the description and the JSON schema enum field getting out of sync, and in addition it is quicker for the user to select a valid value from dropdown instead of parsing the description, and writing in a valid string.

Contributor guide

Tech stack
reacttypescript
Domain
frontend
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
fresh
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
ReactTypeScriptJSON Schema
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
60
Research direction
Start by examining the ObjectField component to see how object keys are currently rendered. The propertyNames enum is used in validation but ignored in the UI. Look for existing dropdown implementations for properties with enum values (e.g., in ArrayField). The goal is to add a dropdown select for the key input when propertyNames contains an enum. Consider edge cases like dynamic property addition and backward compatibility. There are 2 comments but no maintainer response yet, so the issue may need further clarification.