feat: pass down indexed title from array field

CHANGELOG.md

@@ -15,6 +15,12 @@ it according to semantic versioning. For example, if your PR adds a breaking cha
 should change the heading of the (upcoming) version to include a major version bump.
 
 -->
+# 5.16.1
+
+## @rjsf/core
+
+- Pass indexed title from array into its items, adding enhancement asked in [#3983](https://github.com/rjsf-team/react-jsonschema-form/issues/3983)
+
 # 5.15.1
 
 ## @rjsf/core

packages/core/src/components/fields/ArrayField.tsx

@@ -503,6 +503,7 @@ class ArrayField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends For
           key,
           index,
           name: name && `${name}-${index}`,
+          title: title ? `${title}-${index + 1}` : undefined,
           canAdd,
           canMoveUp: index > 0,
           canMoveDown: index < formData.length - 1,
@@ -759,6 +760,7 @@ class ArrayField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends For
           key,
           index,
           name: name && `${name}-${index}`,
+          title: title ? `${title}-${index + 1}` : undefined,
           canAdd,
           canRemove: additional,
           canMoveUp: index >= itemSchemas.length + 1,
@@ -799,6 +801,7 @@ class ArrayField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends For
     key: string;
     index: number;
     name: string;
+    title: string | undefined;
     canAdd: boolean;
     canRemove?: boolean;
     canMoveUp: boolean;
@@ -832,6 +835,7 @@ class ArrayField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends For
       onFocus,
       rawErrors,
       totalItems,
+      title,
     } = props;
     const { disabled, hideError, idPrefix, idSeparator, readonly, uiSchema, registry, formContext } = this.props;
     const {
@@ -853,6 +857,7 @@ class ArrayField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends For
       children: (
         <ItemSchemaField
           name={name}
+          title={title}
           index={index}
           schema={itemSchema}
           uiSchema={itemUiSchema}

packages/core/src/components/fields/BooleanField.tsx

@@ -31,12 +31,13 @@ function BooleanField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extend
     readonly,
     hideError,
     autofocus,
+    title,
     onChange,
     onFocus,
     onBlur,
     rawErrors,
   } = props;
-  const { title } = schema;
+  const { title: schemaTitle } = schema;
   const { widgets, formContext, translateString, globalUiOptions } = registry;
   const {
     widget = 'checkbox',
@@ -49,7 +50,7 @@ function BooleanField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extend
   const yes = translateString(TranslatableString.YesLabel);
   const no = translateString(TranslatableString.NoLabel);
   let enumOptions: EnumOptionsType<S>[] | undefined;
-  const label = uiTitle ?? title ?? name;
+  const label = uiTitle ?? schemaTitle ?? title ?? name;
   if (Array.isArray(schema.oneOf)) {
     enumOptions = optionsList<S>({
       oneOf: schema.oneOf

packages/core/src/components/fields/ObjectField.tsx

@@ -241,6 +241,7 @@ class ObjectField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends Fo
       onBlur,
       onFocus,
       registry,
+      title,
     } = this.props;
 
     const { fields, formContext, schemaUtils, translateString, globalUiOptions } = registry;
@@ -249,7 +250,7 @@ class ObjectField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends Fo
     const uiOptions = getUiOptions<T, S, F>(uiSchema, globalUiOptions);
     const { properties: schemaProperties = {} } = schema;
 
-    const title = uiOptions.title ?? schema.title ?? name;
+    const templateTitle = uiOptions.title ?? schema.title ?? title ?? name;
     const description = uiOptions.description ?? schema.description;
     let orderedProperties: string[];
     try {
@@ -272,7 +273,7 @@ class ObjectField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends Fo
 
     const templateProps = {
       // getDisplayLabel() always returns false for object types, so just check the `uiOptions.label`
-      title: uiOptions.label === false ? '' : title,
+      title: uiOptions.label === false ? '' : templateTitle,
       description: uiOptions.label === false ? undefined : description,
       properties: orderedProperties.map((name) => {
         const addedByAdditionalProperties = has(schema, [PROPERTIES_KEY, name, ADDITIONAL_PROPERTY_FLAG]);

packages/core/src/components/fields/SchemaField.tsx

@@ -193,7 +193,10 @@ function SchemaFieldRender<T = any, S extends StrictRJSFSchema = RJSFSchema, F e
   if (wasPropertyKeyModified) {
     label = name;
   } else {
-    label = ADDITIONAL_PROPERTY_FLAG in schema ? name : uiOptions.title || props.schema.title || schema.title || name;
+    label =
+      ADDITIONAL_PROPERTY_FLAG in schema
+        ? name
+        : uiOptions.title || props.schema.title || schema.title || props.title || name;
   }
 
   const description = uiOptions.description || props.schema.description || schema.description || '';