@crowdin/app-project-module 1.13.2 → 1.14.0

package/out/static/ui/form.bundle.js

@@ -25847,14 +25847,14 @@ export default theme;`;
 	    return a === b ? a : `^(?=.*(?:${a}))(?=.*(?:${b})).*$`;
 	}
 
-	function* createPairCombinations(l, r, action) {
+	function createPairCombinations(l, r, action) {
 	    const ll = l.length;
 	    const rl = r.length;
 	    if (ll > 0 && rl > 0) {
 	        for (let i = 0; i < ll; i++) {
 	            const lv = l[i];
 	            for (let j = 0; j < rl; j++) {
-	                yield action(lv, r[j]);
+	                action(lv, r[j]);
 	            }
 	        }
 	    }
@@ -26131,7 +26131,7 @@ export default theme;`;
 	        let patterns = {};
 	        const matchedPatterns = new Set();
 	        if (lPatternKeys.length > 0 && rPatternKeys.length > 0) {
-	            const gen = createPairCombinations(lPatternKeys, rPatternKeys, (lKey, rKey) => {
+	            createPairCombinations(lPatternKeys, rPatternKeys, (lKey, rKey) => {
 	                if (isSubRegExp(lKey, rKey)) {
 	                    matchedPatterns.add(lKey);
 	                }
@@ -26140,9 +26140,6 @@ export default theme;`;
 	                }
 	                patterns[mergePatterns(lKey, rKey)] = mergeSchemaDefinitions(lPatterns[lKey], rPatterns[rKey]);
 	            });
-	            while (!gen.next().done) {
-	                /* empty */
-	            }
 	        }
 	        patterns = assignPatternPropertiesAndAdditionalPropertiesMerge(patterns, lPatterns, lPatternKeys, matchedPatterns, rAdditional, isRAddTruthy);
 	        patterns = assignPatternPropertiesAndAdditionalPropertiesMerge(patterns, rPatterns, rPatternKeys, matchedPatterns, lAdditional, isLAddTruthy);
@@ -26206,7 +26203,17 @@ export default theme;`;
 	        return target;
 	    };
 	    function mergeArraysOfSchemaDefinition(l, r) {
-	        return deduplicateJsonSchemaDef(Array.from(createPairCombinations(l, r, mergeSchemaDefinitions)));
+	        const definitions = [];
+	        createPairCombinations(l, r, (a, b) => {
+	            try {
+	                definitions.push(mergeSchemaDefinitions(a, b));
+	            }
+	            catch { }
+	        });
+	        if (definitions.length === 0) {
+	            throw new Error(`No valid schema combinations could be produced for "${JSON.stringify(l)}" and "${JSON.stringify(r)}"; the merged result is empty`);
+	        }
+	        return deduplicateJsonSchemaDef(definitions);
 	    }
 	    const ASSIGNERS_MAP = createMap([
 	        [PROPERTIES_ASSIGNER_KEYS, propertiesAssigner],
@@ -26295,11 +26302,12 @@ export default theme;`;
 	            else if (isAArr || isBArr) {
 	                const r = new Set();
 	                if (isAArr && isBArr) {
-	                    for (const intersection of createPairCombinations(a, b, intersectSchemaTypes)) {
-	                        if (intersection !== undefined) {
-	                            r.add(intersection);
+	                    createPairCombinations(a, b, (x, y) => {
+	                        const type = intersectSchemaTypes(x, y);
+	                        if (type !== undefined) {
+	                            r.add(type);
 	                        }
-	                    }
+	                    });
 	                }
 	                else {
 	                    const arr = (isAArr ? a : b);
@@ -31286,6 +31294,67 @@ export default theme;`;
 	    return replaceStringParameters(stringToTranslate, params);
 	}
 
+	/** Determines whether the given `value` is (one of) the `selected` value(s).
+	 *
+	 * @param value - The value being checked to see if it is selected
+	 * @param selected - The current selected value or list of values
+	 * @returns - true if the `value` is one of the `selected` ones, false otherwise
+	 */
+	function enumOptionsIsSelected(value, selected) {
+	    if (Array.isArray(selected)) {
+	        return selected.some((sel) => deepEquals(sel, value));
+	    }
+	    return deepEquals(selected, value);
+	}
+
+	/** Returns the index(es) of the options in `allEnumOptions` whose value(s) match the ones in `value`. All the
+	 * `enumOptions` are filtered based on whether they are a "selected" `value` and the index of each selected one is then
+	 * stored in an array. If `multiple` is true, that array is returned, otherwise the first element in the array is
+	 * returned.
+	 *
+	 * @param value - The single value or list of values for which indexes are desired
+	 * @param [allEnumOptions=[]] - The list of all the known enumOptions
+	 * @param [multiple=false] - Optional flag, if true will return a list of index, otherwise a single one
+	 * @returns - A single string index for the first `value` in `allEnumOptions`, if not `multiple`. Otherwise, the list
+	 *        of indexes for (each of) the value(s) in `value`.
+	 */
+	function enumOptionsIndexForValue(value, allEnumOptions = [], multiple = false) {
+	    const selectedIndexes = allEnumOptions
+	        .map((opt, index) => (enumOptionsIsSelected(opt.value, value) ? String(index) : undefined))
+	        .filter((opt) => typeof opt !== 'undefined');
+	    if (!multiple) {
+	        return selectedIndexes[0];
+	    }
+	    return selectedIndexes;
+	}
+
+	/** Computes the value to pass to a select element's `value` attribute.
+	 *
+	 * When `format` is `'realValue'`, converts form data values to strings.
+	 * When `format` is `'indexed'` (the default), resolves to index-based values via
+	 * `enumOptionsIndexForValue`. Returns `emptyValue` when the current value is empty.
+	 *
+	 * @param value - The current form data value
+	 * @param enumOptions - The available enum options
+	 * @param multiple - Whether the select allows multiple selections
+	 * @param [format='indexed'] - How option values are encoded on the DOM
+	 * @param emptyValue - The value to return when the selection is empty
+	 * @returns The value to use for the select element's `value` attribute
+	 */
+	function enumOptionSelectedValue(value, enumOptions, multiple, format = 'indexed', emptyValue) {
+	    const isEmpty = typeof value === 'undefined' ||
+	        (multiple && Array.isArray(value) && value.length < 1) ||
+	        (!multiple && value === emptyValue);
+	    if (isEmpty) {
+	        return emptyValue;
+	    }
+	    if (format === 'realValue') {
+	        return multiple ? value.map(String) : String(value);
+	    }
+	    const indexes = enumOptionsIndexForValue(value, enumOptions, multiple);
+	    return typeof indexes === 'undefined' ? emptyValue : indexes;
+	}
+
 	/** Returns the value(s) from `allEnumOptions` at the index(es) provided by `valueIndex`. If `valueIndex` is not an
 	 * array AND the index is not valid for `allEnumOptions`, `emptyValue` is returned. If `valueIndex` is an array, AND it
 	 * contains an invalid index, the returned array will have the resulting undefined values filtered out, leaving only
@@ -31310,6 +31379,84 @@ export default theme;`;
 	    return option ? option.value : emptyValue;
 	}
 
+	/** Resolves a single DOM value string back to its typed enum value in `'realValue'` mode.
+	 *
+	 * First attempts a reverse lookup by matching `String(opt.value)` against the input.
+	 * If no option matches and the input parses as a valid index, falls back to the
+	 * option at that index — this is how object/array enum values round-trip, since
+	 * they are encoded as indices by the encoder.
+	 *
+	 * @param value - A single string value from a DOM attribute
+	 * @param enumOptions - The available enum options
+	 * @param emptyValue - The value to return when the input is empty, options are missing, or no match is found
+	 * @returns The original typed enum value, or `emptyValue`
+	 */
+	function decodeSingle(value, enumOptions, emptyValue) {
+	    if (value === '' || !Array.isArray(enumOptions)) {
+	        return emptyValue;
+	    }
+	    const match = enumOptions.find((opt) => String(opt.value) === value);
+	    if (match) {
+	        return match.value;
+	    }
+	    // Fallback: value might be an index (for object/array enum values)
+	    const index = Number(value);
+	    if (!isNaN(index) && index >= 0 && index < enumOptions.length) {
+	        return enumOptions[index].value;
+	    }
+	    return emptyValue;
+	}
+	/** Decodes a string from a DOM value attribute back to a typed enum value.
+	 *
+	 * When `format` is `'realValue'`, does a reverse lookup: finds the enum option
+	 * whose `String(value)` matches the input string and returns the original typed value.
+	 * For object/array values that were encoded as indices, falls back to index resolution.
+	 *
+	 * When `format` is `'indexed'` (the default), uses index-based resolution via
+	 * `enumOptionsValueForIndex`.
+	 *
+	 * @param value - The string value(s) from the DOM
+	 * @param enumOptions - The available enum options
+	 * @param [format='indexed'] - How the values were encoded on the DOM
+	 * @param emptyValue - The value to return for empty/missing selections
+	 * @returns The original typed enum value(s)
+	 */
+	function enumOptionValueDecoder(value, enumOptions, format = 'indexed', emptyValue) {
+	    if (format !== 'realValue') {
+	        return enumOptionsValueForIndex(value, enumOptions, emptyValue);
+	    }
+	    if (Array.isArray(value)) {
+	        return value.map((v) => decodeSingle(v, enumOptions, emptyValue));
+	    }
+	    return decodeSingle(value, enumOptions, emptyValue);
+	}
+
+	/** Encodes an enum option value into a string for a DOM value attribute.
+	 *
+	 * When `format` is `'realValue'`, primitive values are converted via `String()`.
+	 * Non-primitive values (objects, arrays) fall back to the index since
+	 * `String()` would produce `"[object Object]"`.
+	 *
+	 * When `format` is `'indexed'` (the default), returns the index as a string.
+	 *
+	 * @param value - The typed enum value
+	 * @param index - The option's position in the enumOptions array
+	 * @param [format='indexed'] - How to encode the value for the DOM attribute
+	 * @returns The string to use as the DOM value attribute
+	 */
+	function enumOptionValueEncoder(value, index, format = 'indexed') {
+	    if (format !== 'realValue') {
+	        return String(index);
+	    }
+	    if (isNil(value)) {
+	        return '';
+	    }
+	    if (typeof value === 'object') {
+	        return String(index);
+	    }
+	    return String(value);
+	}
+
 	/** Removes the enum option value at the `valueIndex` from the currently `selected` (list of) value(s). If `selected` is
 	 * a list, then that list is updated to remove the enum option value with the `valueIndex` in `allEnumOptions`. If it is
 	 * a single value, then if the enum option value with the `valueIndex` in `allEnumOptions` matches `selected`, undefined
@@ -31330,40 +31477,6 @@ export default theme;`;
 	    return deepEquals(value, selected) ? undefined : selected;
 	}
 
-	/** Determines whether the given `value` is (one of) the `selected` value(s).
-	 *
-	 * @param value - The value being checked to see if it is selected
-	 * @param selected - The current selected value or list of values
-	 * @returns - true if the `value` is one of the `selected` ones, false otherwise
-	 */
-	function enumOptionsIsSelected(value, selected) {
-	    if (Array.isArray(selected)) {
-	        return selected.some((sel) => deepEquals(sel, value));
-	    }
-	    return deepEquals(selected, value);
-	}
-
-	/** Returns the index(es) of the options in `allEnumOptions` whose value(s) match the ones in `value`. All the
-	 * `enumOptions` are filtered based on whether they are a "selected" `value` and the index of each selected one is then
-	 * stored in an array. If `multiple` is true, that array is returned, otherwise the first element in the array is
-	 * returned.
-	 *
-	 * @param value - The single value or list of values for which indexes are desired
-	 * @param [allEnumOptions=[]] - The list of all the known enumOptions
-	 * @param [multiple=false] - Optional flag, if true will return a list of index, otherwise a single one
-	 * @returns - A single string index for the first `value` in `allEnumOptions`, if not `multiple`. Otherwise, the list
-	 *        of indexes for (each of) the value(s) in `value`.
-	 */
-	function enumOptionsIndexForValue(value, allEnumOptions = [], multiple = false) {
-	    const selectedIndexes = allEnumOptions
-	        .map((opt, index) => (enumOptionsIsSelected(opt.value, value) ? String(index) : undefined))
-	        .filter((opt) => typeof opt !== 'undefined');
-	    if (!multiple) {
-	        return selectedIndexes[0];
-	    }
-	    return selectedIndexes;
-	}
-
 	/** Add the enum option value at the `valueIndex` to the list of `selected` values in the proper order as defined by
 	 * `allEnumOptions`
 	 *
@@ -31774,6 +31887,15 @@ export default theme;`;
 	            }
 	        }
 	    }
+	    // For date/time input types, propagate formatMinimum/formatMaximum to min/max
+	    if (['date', 'datetime-local', 'time', 'week', 'month'].includes(inputProps.type)) {
+	        if (schema.formatMinimum !== undefined) {
+	            inputProps.min = schema.formatMinimum;
+	        }
+	        if (schema.formatMaximum !== undefined) {
+	            inputProps.max = schema.formatMaximum;
+	        }
+	    }
 	    if (options.autocomplete) {
 	        inputProps.autoComplete = options.autocomplete;
 	    }
@@ -31783,6 +31905,23 @@ export default theme;`;
 	    return inputProps;
 	}
 
+	/** Resolves the effective `optionValueFormat` for enum-backed widgets.
+	 *
+	 * Provides a single source of truth for the default DOM encoding format
+	 * (`'indexed'`) used by `SelectWidget`, `RadioWidget`, and `CheckboxesWidget`.
+	 * Widgets should call this helper once and pass the result to
+	 * `enumOptionValueEncoder`, `enumOptionValueDecoder`, and `enumOptionSelectedValue`
+	 * rather than reading `options.optionValueFormat` directly.
+	 *
+	 * @param options - The widget options (typically from the `options` prop, already
+	 *   resolved from `ui:options` and `ui:globalOptions`)
+	 * @returns The resolved `OptionValueFormat`, defaulting to `'indexed'` when not set
+	 */
+	function getOptionValueFormat(options) {
+	    var _a;
+	    return (_a = options === null || options === void 0 ? void 0 : options.optionValueFormat) !== null && _a !== void 0 ? _a : 'indexed';
+	}
+
 	/** The default submit button options, exported for testing purposes
 	 */
 	const DEFAULT_OPTIONS = {
@@ -32264,6 +32403,111 @@ export default theme;`;
 	    return get(regOrFc, [...lookupPath, toLookup], fallback);
 	}
 
+	/** Determines whether a value is considered "empty" for the purposes of optional object pruning.
+	 * A value is empty if it is `undefined`, `null`, an empty string, or an object where all own
+	 * properties are themselves empty.
+	 *
+	 * @param value - The value to check
+	 * @returns True if the value is considered empty
+	 */
+	function isValueEmpty(value) {
+	    if (isNil(value) || value === '') {
+	        return true;
+	    }
+	    if (Array.isArray(value)) {
+	        // An empty array is considered empty; a non-empty array is not
+	        return value.length === 0;
+	    }
+	    if (isObject$3(value)) {
+	        const obj = value;
+	        const keys = Object.keys(obj);
+	        return keys.every((key) => isValueEmpty(obj[key]));
+	    }
+	    return false;
+	}
+	/** Recursively removes optional objects from the `formData` that are empty (i.e., all their fields
+	 * are undefined, null, empty strings, or themselves empty optional objects). This solves the problem
+	 * where interacting with fields inside an optional object "activates" it permanently, making the
+	 * form unsubmittable when the optional object has required inner fields.
+	 *
+	 * An object property is considered "optional" when it is NOT listed in its parent schema's `required`
+	 * array.
+	 *
+	 * @param validator - An implementation of the `ValidatorType` interface that will be used when necessary
+	 * @param schema - The JSON schema describing the `formData`
+	 * @param [rootSchema] - The root schema, used primarily to look up `$ref`s
+	 * @param [formData] - The current form data to prune
+	 * @returns - A new copy of `formData` with empty optional objects removed, or `undefined` if the
+	 *           entire formData was pruned
+	 */
+	function removeOptionalEmptyObjects(validator, schema, rootSchema, formData) {
+	    if (!isObject$3(schema)) {
+	        return formData;
+	    }
+	    const resolvedSchema = retrieveSchema(validator, schema, rootSchema, formData);
+	    if (Array.isArray(formData)) {
+	        const itemsSchema = resolvedSchema.items;
+	        if (!itemsSchema) {
+	            return formData;
+	        }
+	        let hasChanges = false;
+	        const mapped = formData.map((item, index) => {
+	            let itemSchema = itemsSchema;
+	            if (Array.isArray(itemsSchema)) {
+	                itemSchema = itemsSchema[index] || resolvedSchema.additionalItems || {};
+	            }
+	            const cleaned = removeOptionalEmptyObjects(validator, itemSchema, rootSchema, item);
+	            if (cleaned !== item) {
+	                hasChanges = true;
+	            }
+	            return cleaned === undefined ? {} : cleaned;
+	        });
+	        // Although T is an array type here, we still need to cast it back to T since TS
+	        // doesn't narrow the generic T automatically
+	        return hasChanges ? mapped : formData;
+	    }
+	    const { properties, required: requiredFields = [] } = resolvedSchema;
+	    if (!isObject$3(formData) || !properties) {
+	        return formData;
+	    }
+	    const result = {};
+	    const data = formData;
+	    let hasAnyValue = false;
+	    for (const key of Object.keys(data)) {
+	        const value = data[key];
+	        const propertySchema = (properties[key] || {});
+	        const isRequired = requiredFields.includes(key);
+	        const isObj = isObject$3(value);
+	        const isArr = Array.isArray(value);
+	        if ((isObj || isArr) && properties[key]) {
+	            // Recursively process nested objects and arrays
+	            const cleaned = removeOptionalEmptyObjects(validator, propertySchema, rootSchema, value);
+	            if (!isRequired && isValueEmpty(cleaned)) {
+	                // This is an optional property and the cleaned result is empty — omit it
+	                continue;
+	            }
+	            result[key] = cleaned;
+	            hasAnyValue = true;
+	        }
+	        else if (!isRequired && isValueEmpty(value) && properties[key]) {
+	            // Optional scalar property that is empty — omit it
+	            continue;
+	        }
+	        else {
+	            result[key] = value;
+	            if (!isValueEmpty(value)) {
+	                hasAnyValue = true;
+	            }
+	        }
+	    }
+	    // If the entire object ended up empty after pruning, return undefined so that the
+	    // caller (which may itself be a recursive call) can decide whether to keep or drop it
+	    if (!hasAnyValue && Object.keys(result).length === 0) {
+	        return undefined;
+	    }
+	    return result;
+	}
+
 	/** Given a list of `properties` and an `order` list, returns a list that contains the `properties` ordered correctly.
 	 * If `order` is not an array, then the untouched `properties` list is returned. Otherwise `properties` is ordered per
 	 * the `order` list. If `order` contains a '*' then any `properties` that are not mentioned explicity in `order` will be
@@ -32334,104 +32578,18 @@ export default theme;`;
 	    };
 	}
 
-	// Keywords where child schemas map to uiSchema at the SAME key
-	const SAME_KEY_KEYWORDS = [ITEMS_KEY, ADDITIONAL_PROPERTIES_KEY];
-	// Keywords where child schemas are in an array, each mapping to uiSchema[keyword][i]
-	const ARRAY_KEYWORDS = [ONE_OF_KEY, ANY_OF_KEY, ALL_OF_KEY];
-	/** Expands `ui:definitions` into the uiSchema by walking the schema tree and finding all `$ref`s.
-	 * Called once at form initialization to pre-expand definitions into the uiSchema structure.
-	 *
-	 * For recursive schemas, expansion stops at recursion points to avoid infinite loops.
-	 * Runtime resolution via `resolveUiSchema` handles these cases using registry definitions.
-	 *
-	 * @param currentSchema - The current schema node being processed
-	 * @param uiSchema - The uiSchema at the current path
-	 * @param registry - The registry containing rootSchema and uiSchemaDefinitions
-	 * @param visited - Set of $refs already visited (to detect recursion)
-	 * @returns - The expanded uiSchema with definitions merged in
-	 */
-	function expandUiSchemaDefinitions(currentSchema, uiSchema, registry, visited = new Set()) {
-	    const { rootSchema, uiSchemaDefinitions: definitions } = registry;
-	    let result = { ...uiSchema };
-	    let resolvedSchema = currentSchema;
-	    const ref = currentSchema[REF_KEY];
-	    const isRecursive = ref && visited.has(ref);
-	    if (ref) {
-	        visited.add(ref);
-	        if (definitions && ref in definitions) {
-	            result = mergeObjects(definitions[ref], result);
-	        }
-	        if (isRecursive) {
-	            return result;
-	        }
-	        try {
-	            resolvedSchema = findSchemaDefinition(ref, rootSchema);
-	        }
-	        catch (_a) {
-	            resolvedSchema = currentSchema;
-	        }
-	    }
-	    // Process properties (each property maps to uiSchema[propName] - flattened)
-	    const properties = resolvedSchema[PROPERTIES_KEY];
-	    if (properties && isObject$3(properties)) {
-	        for (const [propName, propSchema] of Object.entries(properties)) {
-	            const propUiSchema = (result[propName] || {});
-	            const expanded = expandUiSchemaDefinitions(propSchema, propUiSchema, registry, new Set(visited));
-	            if (Object.keys(expanded).length > 0) {
-	                result[propName] = expanded;
-	            }
-	        }
-	    }
-	    // Process keywords where child maps to same key in uiSchema (items, additionalProperties)
-	    for (const keyword of SAME_KEY_KEYWORDS) {
-	        const subSchema = resolvedSchema[keyword];
-	        if (subSchema && isObject$3(subSchema) && !Array.isArray(subSchema)) {
-	            const currentUiSchema = result[keyword];
-	            if (typeof currentUiSchema !== 'function') {
-	                const subUiSchema = (currentUiSchema || {});
-	                const expanded = expandUiSchemaDefinitions(subSchema, subUiSchema, registry, new Set(visited));
-	                if (Object.keys(expanded).length > 0) {
-	                    result[keyword] = expanded;
-	                }
-	            }
-	        }
-	    }
-	    // Process array keywords (oneOf, anyOf, allOf) - each option maps to uiSchema[keyword][i]
-	    for (const keyword of ARRAY_KEYWORDS) {
-	        const schemaOptions = resolvedSchema[keyword];
-	        if (Array.isArray(schemaOptions) && schemaOptions.length > 0) {
-	            const currentUiSchemaArray = result[keyword];
-	            const uiSchemaArray = Array.isArray(currentUiSchemaArray) ? [...currentUiSchemaArray] : [];
-	            let hasExpanded = false;
-	            for (let i = 0; i < schemaOptions.length; i++) {
-	                const optionSchema = schemaOptions[i];
-	                const optionUiSchema = (uiSchemaArray[i] || {});
-	                const expanded = expandUiSchemaDefinitions(optionSchema, optionUiSchema, registry, new Set(visited));
-	                if (Object.keys(expanded).length > 0) {
-	                    uiSchemaArray[i] = expanded;
-	                    hasExpanded = true;
-	                }
-	            }
-	            if (hasExpanded) {
-	                result[keyword] = uiSchemaArray;
-	            }
-	        }
-	    }
-	    return result;
-	}
 	/** Resolves the uiSchema for a given schema, considering `ui:definitions` stored in the registry.
 	 *
-	 * This function is called at runtime for each field. It handles recursive schemas where the
-	 * pre-expansion in `expandUiSchemaDefinitions` couldn't go deeper.
-	 *
-	 * When the schema contains a `$ref`, this function looks up the corresponding uiSchema definition
-	 * from `registry.uiSchemaDefinitions` and merges it with any local uiSchema overrides.
+	 * Called at runtime for each field. When the schema contains a `$ref`, looks up the corresponding
+	 * uiSchema definition from `registry.uiSchemaDefinitions` and merges it with local overrides.
+	 * For schemas with `oneOf`/`anyOf` branches, also populates `uiSchema[keyword][i]` for branches
+	 * whose `$ref` matches a definition, so `MultiSchemaField` can read dropdown option titles.
 	 *
 	 * Resolution order (later sources override earlier):
 	 * 1. `ui:definitions[$ref]` - base definition from registry
 	 * 2. `localUiSchema` - local overrides at current path
 	 *
-	 * @param schema - The JSON schema (may still contain `$ref` for recursive schemas)
+	 * @param schema - The JSON schema (may contain `$ref` or `RJSF_REF_KEY`)
 	 * @param localUiSchema - The uiSchema at the current path (local overrides)
 	 * @param registry - The registry containing `uiSchemaDefinitions`
 	 * @returns - The resolved uiSchema with definitions merged in
@@ -32439,14 +32597,54 @@ export default theme;`;
 	function resolveUiSchema(schema, localUiSchema, registry) {
 	    var _a, _b;
 	    const ref = ((_a = schema[RJSF_REF_KEY]) !== null && _a !== void 0 ? _a : schema[REF_KEY]);
-	    const definitionUiSchema = ref ? (_b = registry.uiSchemaDefinitions) === null || _b === void 0 ? void 0 : _b[ref] : undefined;
+	    const definitions = registry.uiSchemaDefinitions;
+	    const definitionUiSchema = ref && definitions ? definitions[ref] : undefined;
+	    let result;
 	    if (!definitionUiSchema) {
-	        return localUiSchema || {};
+	        result = localUiSchema || {};
+	    }
+	    else if (!localUiSchema || isEmpty$1(localUiSchema)) {
+	        result = { ...definitionUiSchema };
 	    }
-	    if (!localUiSchema || Object.keys(localUiSchema).length === 0) {
-	        return { ...definitionUiSchema };
+	    else {
+	        result = mergeObjects(definitionUiSchema, localUiSchema);
+	    }
+	    // Walk oneOf/anyOf branches to populate uiSchema[keyword][i] so MultiSchemaField
+	    // can read dropdown option titles at the parent level.
+	    if (definitions) {
+	        let resolvedSchema = schema;
+	        if (ref && schema[REF_KEY] && !schema[RJSF_REF_KEY]) {
+	            try {
+	                resolvedSchema = findSchemaDefinition(ref, registry.rootSchema);
+	            }
+	            catch (e) {
+	                console.warn('could not resolve $ref in resolveUiSchema:\n', e);
+	                return result;
+	            }
+	        }
+	        for (const keyword of [ONE_OF_KEY, ANY_OF_KEY]) {
+	            const schemaOptions = resolvedSchema[keyword];
+	            if (!Array.isArray(schemaOptions) || schemaOptions.length === 0) {
+	                continue;
+	            }
+	            const currentUiSchemaArray = result[keyword];
+	            const uiSchemaArray = Array.isArray(currentUiSchemaArray) ? [...currentUiSchemaArray] : [];
+	            let hasExpanded = false;
+	            for (let i = 0; i < schemaOptions.length; i++) {
+	                const option = schemaOptions[i];
+	                const optionRef = ((_b = option === null || option === void 0 ? void 0 : option[RJSF_REF_KEY]) !== null && _b !== void 0 ? _b : option === null || option === void 0 ? void 0 : option[REF_KEY]);
+	                if (optionRef && optionRef in definitions) {
+	                    const optionUiSchema = (uiSchemaArray[i] || {});
+	                    uiSchemaArray[i] = mergeObjects(definitions[optionRef], optionUiSchema);
+	                    hasExpanded = true;
+	                }
+	            }
+	            if (hasExpanded) {
+	                result[keyword] = uiSchemaArray;
+	            }
+	        }
 	    }
-	    return mergeObjects(definitionUiSchema, localUiSchema);
+	    return result;
 	}
 
 	/** Check to see if a `schema` specifies that a value must be true. This happens when:
@@ -35302,11 +35500,14 @@ export default theme;`;
 	    const { schema: rawSchema, uiSchema = {}, formData, errorSchema, fieldPathId, name, required = false, disabled, readonly, hideError, onBlur, onFocus, onChange, registry, title, } = props;
 	    const { fields, schemaUtils, translateString, globalUiOptions } = registry;
 	    const { OptionalDataControlsField } = fields;
+	    const formDataRef = reactExports.useRef(formData);
+	    formDataRef.current = formData;
 	    const schema = schemaUtils.retrieveSchema(rawSchema, formData, true);
 	    const uiOptions = getUiOptions(uiSchema, globalUiOptions);
 	    const { properties: schemaProperties = {} } = schema;
 	    // All the children will use childFieldPathId if present in the props, falling back to the fieldPathId
 	    const childFieldPathId = props.childFieldPathId ?? fieldPathId;
+	    const lastRenamedProperty = reactExports.useRef({ previousKey: '', currentKey: undefined });
 	    const templateTitle = uiOptions.title ?? schema.title ?? title ?? name;
 	    const description = uiOptions.description ?? schema.description;
 	    const renderOptionalField = shouldRenderOptionalField(registry, schema, required, uiSchema);
@@ -35366,6 +35567,10 @@ export default theme;`;
 	            // Cast this to make the `set` work properly
 	            set(newFormData, newKey, newValue);
 	        }
+	        if (lastRenamedProperty.current.previousKey === newKey) {
+	            lastRenamedProperty.current.currentKey = newKey;
+	            lastRenamedProperty.current.previousKey = getAvailableKey(newKey, newFormData);
+	        }
 	        onChange(newFormData, childFieldPathId.path);
 	    }, [formData, onChange, registry, childFieldPathId, getAvailableKey, schema]);
 	    /** Returns a callback function that deals with the rename of a key for an additional property for a schema. That
@@ -35377,9 +35582,10 @@ export default theme;`;
 	     */
 	    const handleKeyRename = reactExports.useCallback((oldKey, newKey) => {
 	        if (oldKey !== newKey) {
-	            const actualNewKey = getAvailableKey(newKey, formData);
+	            const currentFormData = formDataRef.current;
+	            const actualNewKey = getAvailableKey(newKey, currentFormData);
 	            const newFormData = {
-	                ...formData,
+	                ...currentFormData,
 	            };
 	            const newKeys = { [oldKey]: actualNewKey };
 	            const keyValues = Object.keys(newFormData).map((key) => {
@@ -35387,15 +35593,31 @@ export default theme;`;
 	                return { [newKey]: newFormData[key] };
 	            });
 	            const renamedObj = Object.assign({}, ...keyValues);
+	            formDataRef.current = renamedObj;
+	            if (oldKey !== lastRenamedProperty.current.currentKey) {
+	                lastRenamedProperty.current.previousKey = oldKey;
+	            }
+	            lastRenamedProperty.current.currentKey = actualNewKey;
 	            onChange(renamedObj, childFieldPathId.path);
 	        }
-	    }, [formData, onChange, childFieldPathId, getAvailableKey]);
+	    }, [onChange, childFieldPathId, getAvailableKey]);
 	    /** Handles the remove click which calls the `onChange` callback with the special ADDITIONAL_PROPERTY_FIELD_REMOVE
 	     * value for the path plus the key to be removed
 	     */
 	    const handleRemoveProperty = reactExports.useCallback((key) => {
 	        onChange(ADDITIONAL_PROPERTY_KEY_REMOVE, [...childFieldPathId.path, key]);
 	    }, [onChange, childFieldPathId]);
+	    /** Returns the stable React key for a property. For the most recently renamed
+	     * additional property, returns the previous key so that React reuses the
+	     * existing component instance instead of unmounting/remounting it. This
+	     * preserves DOM focus naturally without manual focus management.
+	     */
+	    const getStableKey = reactExports.useCallback((property) => {
+	        if (lastRenamedProperty.current.currentKey === property) {
+	            return lastRenamedProperty.current.previousKey;
+	        }
+	        return property;
+	    }, []);
 	    if (!renderOptionalField || hasFormData) {
 	        try {
 	            const properties = Object.keys(schemaProperties);
@@ -35415,7 +35637,7 @@ export default theme;`;
 	            const addedByAdditionalProperties = has(schema, [PROPERTIES_KEY, name, ADDITIONAL_PROPERTY_FLAG]);
 	            const fieldUiSchema = addedByAdditionalProperties ? uiSchema.additionalProperties : uiSchema[name];
 	            const hidden = getUiOptions(fieldUiSchema).widget === 'hidden';
-	            const content = (jsxRuntimeExports.jsx(ObjectFieldProperty, { propertyName: name, required: isRequired(schema, name), schema: get(schema, [PROPERTIES_KEY, name], {}), uiSchema: fieldUiSchema, errorSchema: get(errorSchema, [name]), fieldPathId: childFieldPathId, formData: get(formData, [name]), handleKeyRename: handleKeyRename, handleRemoveProperty: handleRemoveProperty, addedByAdditionalProperties: addedByAdditionalProperties, onChange: onChange, onBlur: onBlur, onFocus: onFocus, registry: registry, disabled: disabled, readonly: readonly, hideError: hideError }, name));
+	            const content = (jsxRuntimeExports.jsx(ObjectFieldProperty, { propertyName: name, required: isRequired(schema, name), schema: get(schema, [PROPERTIES_KEY, name], {}), uiSchema: fieldUiSchema, errorSchema: get(errorSchema, [name]), fieldPathId: childFieldPathId, formData: get(formData, [name]), handleKeyRename: handleKeyRename, handleRemoveProperty: handleRemoveProperty, addedByAdditionalProperties: addedByAdditionalProperties, onChange: onChange, onBlur: onBlur, onFocus: onFocus, registry: registry, disabled: disabled, readonly: readonly, hideError: hideError }, getStableKey(name)));
 	            return {
 	                content,
 	                name,
@@ -36160,7 +36382,7 @@ export default theme;`;
 	        return (jsxRuntimeExports.jsx("div", { className: uiClassNames, style: style, children: children }));
 	    }
 	    const margin = hasDescription ? 46 : 26;
-	    return (jsxRuntimeExports.jsx("div", { className: uiClassNames, style: style, children: jsxRuntimeExports.jsxs("div", { className: 'row', children: [jsxRuntimeExports.jsx("div", { className: 'col-xs-5 form-additional', children: jsxRuntimeExports.jsxs("div", { className: 'form-group', children: [displayLabel && jsxRuntimeExports.jsx(Label, { label: keyLabel, required: required, id: `${id}-key` }), displayLabel && rawDescription && jsxRuntimeExports.jsx("div", { children: "\u00A0" }), jsxRuntimeExports.jsx("input", { className: 'form-control', type: 'text', id: `${id}-key`, onBlur: onKeyRenameBlur, defaultValue: label })] }) }), jsxRuntimeExports.jsx("div", { className: 'form-additional form-group col-xs-5', children: children }), jsxRuntimeExports.jsx("div", { className: 'col-xs-2', style: { marginTop: displayLabel ? `${margin}px` : undefined }, children: jsxRuntimeExports.jsx(RemoveButton, { id: buttonId(id, 'remove'), className: 'rjsf-object-property-remove btn-block', style: { border: '0' }, disabled: disabled || readonly, onClick: onRemoveProperty, uiSchema: uiSchema, registry: registry }) })] }) }));
+	    return (jsxRuntimeExports.jsx("div", { className: uiClassNames, style: style, children: jsxRuntimeExports.jsxs("div", { className: 'row', children: [jsxRuntimeExports.jsx("div", { className: 'col-xs-5 form-additional', children: jsxRuntimeExports.jsxs("div", { className: 'form-group', children: [displayLabel && jsxRuntimeExports.jsx(Label, { label: keyLabel, required: required, id: `${id}-key` }), displayLabel && rawDescription && jsxRuntimeExports.jsx("div", { children: "\u00A0" }), jsxRuntimeExports.jsx("input", { className: 'form-control', type: 'text', id: `${id}-key`, onBlur: onKeyRenameBlur, defaultValue: label }, label)] }) }), jsxRuntimeExports.jsx("div", { className: 'form-additional form-group col-xs-5', children: children }), jsxRuntimeExports.jsx("div", { className: 'col-xs-2', style: { marginTop: displayLabel ? `${margin}px` : undefined }, children: jsxRuntimeExports.jsx(RemoveButton, { id: buttonId(id, 'remove'), className: 'rjsf-object-property-remove btn-block', style: { border: '0' }, disabled: disabled || readonly, onClick: onRemoveProperty, uiSchema: uiSchema, registry: registry }) })] }) }));
 	}
 
 	function templates() {
@@ -36233,10 +36455,12 @@ export default theme;`;
 	 *
 	 * @param props - The `WidgetProps` for this component
 	 */
-	function CheckboxesWidget$1({ id, disabled, options: { inline = false, enumOptions, enumDisabled, emptyValue }, value, autofocus = false, readonly, onChange, onBlur, onFocus, htmlName, }) {
+	function CheckboxesWidget$1({ id, disabled, options, value, autofocus = false, readonly, onChange, onBlur, onFocus, htmlName, }) {
+	    const { inline = false, enumOptions, enumDisabled, emptyValue } = options;
+	    const optionValueFormat = getOptionValueFormat(options);
 	    const checkboxesValues = Array.isArray(value) ? value : [value];
-	    const handleBlur = reactExports.useCallback(({ target }) => onBlur(id, enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue)), [onBlur, id, enumOptions, emptyValue]);
-	    const handleFocus = reactExports.useCallback(({ target }) => onFocus(id, enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue)), [onFocus, id, enumOptions, emptyValue]);
+	    const handleBlur = reactExports.useCallback(({ target }) => onBlur(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue)), [onBlur, id, enumOptions, emptyValue, optionValueFormat]);
+	    const handleFocus = reactExports.useCallback(({ target }) => onFocus(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue)), [onFocus, id, enumOptions, emptyValue, optionValueFormat]);
 	    return (jsxRuntimeExports.jsx("div", { className: 'checkboxes', id: id, children: Array.isArray(enumOptions) &&
 	            enumOptions.map((option, index) => {
 	                const checked = enumOptionsIsSelected(option.value, checkboxesValues);
@@ -36250,7 +36474,7 @@ export default theme;`;
 	                        onChange(enumOptionsDeselectValue(index, checkboxesValues, enumOptions));
 	                    }
 	                };
-	                const checkbox = (jsxRuntimeExports.jsxs("span", { children: [jsxRuntimeExports.jsx("input", { type: 'checkbox', id: optionId(id, index), name: htmlName || id, checked: checked, value: String(index), disabled: disabled || itemDisabled || readonly, autoFocus: autofocus && index === 0, onChange: handleChange, onBlur: handleBlur, onFocus: handleFocus, "aria-describedby": ariaDescribedByIds(id) }), jsxRuntimeExports.jsx("span", { children: option.label })] }));
+	                const checkbox = (jsxRuntimeExports.jsxs("span", { children: [jsxRuntimeExports.jsx("input", { type: 'checkbox', id: optionId(id, index), name: htmlName || id, checked: checked, value: enumOptionValueEncoder(option.value, index, optionValueFormat), disabled: disabled || itemDisabled || readonly, autoFocus: autofocus && index === 0, onChange: handleChange, onBlur: handleBlur, onFocus: handleFocus, "aria-describedby": ariaDescribedByIds(id) }), jsxRuntimeExports.jsx("span", { children: option.label })] }));
 	                return inline ? (jsxRuntimeExports.jsx("label", { className: `checkbox-inline ${disabledCls}`, children: checkbox }, index)) : (jsxRuntimeExports.jsx("div", { className: `checkbox ${disabledCls}`, children: jsxRuntimeExports.jsx("label", { children: checkbox }) }, index));
 	            }) }));
 	}
@@ -36368,15 +36592,16 @@ export default theme;`;
 	 */
 	function RadioWidget$1({ options, value, required, disabled, readonly, autofocus = false, onBlur, onFocus, onChange, id, htmlName, }) {
 	    const { enumOptions, enumDisabled, inline, emptyValue } = options;
-	    const handleBlur = reactExports.useCallback(({ target }) => onBlur(id, enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue)), [onBlur, enumOptions, emptyValue, id]);
-	    const handleFocus = reactExports.useCallback(({ target }) => onFocus(id, enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue)), [onFocus, enumOptions, emptyValue, id]);
+	    const optionValueFormat = getOptionValueFormat(options);
+	    const handleBlur = reactExports.useCallback(({ target }) => onBlur(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue)), [onBlur, enumOptions, emptyValue, id, optionValueFormat]);
+	    const handleFocus = reactExports.useCallback(({ target }) => onFocus(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue)), [onFocus, enumOptions, emptyValue, id, optionValueFormat]);
 	    return (jsxRuntimeExports.jsx("div", { className: 'field-radio-group', id: id, role: 'radiogroup', children: Array.isArray(enumOptions) &&
 	            enumOptions.map((option, i) => {
 	                const checked = enumOptionsIsSelected(option.value, value);
 	                const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
 	                const disabledCls = disabled || itemDisabled || readonly ? 'disabled' : '';
 	                const handleChange = () => onChange(option.value);
-	                const radio = (jsxRuntimeExports.jsxs("span", { children: [jsxRuntimeExports.jsx("input", { type: 'radio', id: optionId(id, i), checked: checked, name: htmlName || id, required: required, value: String(i), disabled: disabled || itemDisabled || readonly, autoFocus: autofocus && i === 0, onChange: handleChange, onBlur: handleBlur, onFocus: handleFocus, "aria-describedby": ariaDescribedByIds(id) }), jsxRuntimeExports.jsx("span", { children: option.label })] }));
+	                const radio = (jsxRuntimeExports.jsxs("span", { children: [jsxRuntimeExports.jsx("input", { type: 'radio', id: optionId(id, i), checked: checked, name: htmlName || id, required: required, value: enumOptionValueEncoder(option.value, i, optionValueFormat), disabled: disabled || itemDisabled || readonly, autoFocus: autofocus && i === 0, onChange: handleChange, onBlur: handleBlur, onFocus: handleFocus, "aria-describedby": ariaDescribedByIds(id) }), jsxRuntimeExports.jsx("span", { children: option.label })] }));
 	                return inline ? (jsxRuntimeExports.jsx("label", { className: `radio-inline ${disabledCls}`, children: radio }, i)) : (jsxRuntimeExports.jsx("div", { className: `radio ${disabledCls}`, children: jsxRuntimeExports.jsx("label", { children: radio }) }, i));
 	            }) }));
 	}
@@ -36470,24 +36695,25 @@ export default theme;`;
 	function SelectWidget$1({ schema, id, options, value, required, disabled, readonly, multiple = false, autofocus = false, onChange, onBlur, onFocus, placeholder, htmlName, }) {
 	    const { enumOptions, enumDisabled, emptyValue: optEmptyVal } = options;
 	    const emptyValue = multiple ? [] : '';
+	    const optionValueFormat = getOptionValueFormat(options);
 	    const handleFocus = reactExports.useCallback((event) => {
 	        const newValue = getValue(event, multiple);
-	        return onFocus(id, enumOptionsValueForIndex(newValue, enumOptions, optEmptyVal));
-	    }, [onFocus, id, multiple, enumOptions, optEmptyVal]);
+	        return onFocus(id, enumOptionValueDecoder(newValue, enumOptions, optionValueFormat, optEmptyVal));
+	    }, [onFocus, id, multiple, enumOptions, optEmptyVal, optionValueFormat]);
 	    const handleBlur = reactExports.useCallback((event) => {
 	        const newValue = getValue(event, multiple);
-	        return onBlur(id, enumOptionsValueForIndex(newValue, enumOptions, optEmptyVal));
-	    }, [onBlur, id, multiple, enumOptions, optEmptyVal]);
+	        return onBlur(id, enumOptionValueDecoder(newValue, enumOptions, optionValueFormat, optEmptyVal));
+	    }, [onBlur, id, multiple, enumOptions, optEmptyVal, optionValueFormat]);
 	    const handleChange = reactExports.useCallback((event) => {
 	        const newValue = getValue(event, multiple);
-	        return onChange(enumOptionsValueForIndex(newValue, enumOptions, optEmptyVal));
-	    }, [onChange, multiple, enumOptions, optEmptyVal]);
-	    const selectedIndexes = enumOptionsIndexForValue(value, enumOptions, multiple);
+	        return onChange(enumOptionValueDecoder(newValue, enumOptions, optionValueFormat, optEmptyVal));
+	    }, [onChange, multiple, enumOptions, optEmptyVal, optionValueFormat]);
+	    const selectValue = enumOptionSelectedValue(value, enumOptions, multiple, optionValueFormat, emptyValue);
 	    const showPlaceholderOption = !multiple && schema.default === undefined;
-	    return (jsxRuntimeExports.jsxs("select", { id: id, name: htmlName || id, multiple: multiple, role: 'combobox', className: 'form-control', value: typeof selectedIndexes === 'undefined' ? emptyValue : selectedIndexes, required: required, disabled: disabled || readonly, autoFocus: autofocus, onBlur: handleBlur, onFocus: handleFocus, onChange: handleChange, "aria-describedby": ariaDescribedByIds(id), children: [showPlaceholderOption && jsxRuntimeExports.jsx("option", { value: '', children: placeholder }), Array.isArray(enumOptions) &&
+	    return (jsxRuntimeExports.jsxs("select", { id: id, name: htmlName || id, multiple: multiple, role: 'combobox', className: 'form-control', value: selectValue, required: required, disabled: disabled || readonly, autoFocus: autofocus, onBlur: handleBlur, onFocus: handleFocus, onChange: handleChange, "aria-describedby": ariaDescribedByIds(id), children: [showPlaceholderOption && jsxRuntimeExports.jsx("option", { value: '', children: placeholder }), Array.isArray(enumOptions) &&
 	                enumOptions.map(({ value, label }, i) => {
 	                    const disabled = enumDisabled && enumDisabled.indexOf(value) !== -1;
-	                    return (jsxRuntimeExports.jsx("option", { value: String(i), disabled: disabled, children: label }, i));
+	                    return (jsxRuntimeExports.jsx("option", { value: enumOptionValueEncoder(value, i, optionValueFormat), disabled: disabled, children: label }, i));
 	                })] }));
 	}
 
@@ -36825,10 +37051,6 @@ export default theme;`;
 	        // Only store a new registry when the props cause a different one to be created
 	        const newRegistry = this.getRegistry(props, rootSchema, schemaUtils);
 	        const registry = deepEquals(state.registry, newRegistry) ? state.registry : newRegistry;
-	        // Pre-expand ui:definitions into the uiSchema structure (must happen after registry is created)
-	        const expandedUiSchema = registry.uiSchemaDefinitions
-	            ? expandUiSchemaDefinitions(rootSchema, uiSchema, registry)
-	            : uiSchema;
 	        // Only compute a new `fieldPathId` when the `idPrefix` is different than the existing fieldPathId's ID_KEY
 	        const fieldPathId = state.fieldPathId && state.fieldPathId?.[ID_KEY] === registry.globalFormOptions.idPrefix
 	            ? state.fieldPathId
@@ -36836,7 +37058,7 @@ export default theme;`;
 	        const nextState = {
 	            schemaUtils,
 	            schema: rootSchema,
-	            uiSchema: expandedUiSchema,
+	            uiSchema,
 	            fieldPathId,
 	            formData,
 	            edit,
@@ -37010,7 +37232,7 @@ export default theme;`;
 	        this._isProcessingUserChange = true;
 	        const { newValue, path, id } = this.pendingChanges[0];
 	        const { newErrorSchema } = this.pendingChanges[0];
-	        const { extraErrors, omitExtraData, liveOmit, noValidate, liveValidate, onChange } = this.props;
+	        const { extraErrors, omitExtraData, liveOmit, noValidate, liveValidate, onChange, removeEmptyOptionalObjects } = this.props;
 	        const { formData: oldFormData, schemaUtils, schema, fieldPathId, schemaValidationErrorSchema, errors } = this.state;
 	        let { customErrors, errorSchema: originalErrorSchema } = this.state;
 	        const rootPathId = fieldPathId.path[0] || '';
@@ -37049,6 +37271,13 @@ export default theme;`;
 	                formData: newFormData,
 	            };
 	        }
+	        if (removeEmptyOptionalObjects) {
+	            newFormData = removeOptionalEmptyObjects(schemaUtils.getValidator(), schema, schemaUtils.getRootSchema(), newFormData);
+	            state = {
+	                ...state,
+	                formData: newFormData,
+	            };
+	        }
 	        if (newErrorSchema) {
 	            // First check to see if there is an existing validation error on this path...
 	            // @ts-expect-error TS2590, because getting from the error schema is confusing TS
@@ -37149,19 +37378,23 @@ export default theme;`;
 	     * @param data - The data associated with the field that was blurred
 	     */
 	    onBlur = (id, data) => {
-	        const { onBlur, omitExtraData, liveOmit, liveValidate } = this.props;
+	        const { onBlur, omitExtraData, liveOmit, liveValidate, removeEmptyOptionalObjects } = this.props;
 	        if (onBlur) {
 	            onBlur(id, data);
 	        }
 	        if ((omitExtraData === true && liveOmit === 'onBlur') || liveValidate === 'onBlur') {
 	            const { onChange, extraErrors } = this.props;
-	            const { formData } = this.state;
+	            const { formData, schemaUtils, schema } = this.state;
 	            let newFormData = formData;
 	            let state = { formData: newFormData };
 	            if (omitExtraData === true && liveOmit === 'onBlur') {
 	                newFormData = this.omitExtraData(formData);
 	                state = { formData: newFormData };
 	            }
+	            if (removeEmptyOptionalObjects) {
+	                newFormData = removeOptionalEmptyObjects(schemaUtils.getValidator(), schema, schemaUtils.getRootSchema(), newFormData);
+	                state = { ...state, formData: newFormData };
+	            }
 	            if (liveValidate === 'onBlur') {
 	                const { schema, schemaUtils, errorSchema, customErrors, retrievedSchema } = this.state;
 	                const liveValidation = this.liveValidate(schema, schemaUtils, errorSchema, newFormData, extraErrors, customErrors, retrievedSchema);
@@ -37208,11 +37441,15 @@ export default theme;`;
 	            return;
 	        }
 	        event.persist();
-	        const { omitExtraData, extraErrors, noValidate, onSubmit } = this.props;
+	        const { omitExtraData, extraErrors, noValidate, onSubmit, removeEmptyOptionalObjects } = this.props;
 	        let { formData: newFormData } = this.state;
 	        if (omitExtraData === true) {
 	            newFormData = this.omitExtraData(newFormData);
 	        }
+	        if (removeEmptyOptionalObjects) {
+	            const { schemaUtils, schema } = this.state;
+	            newFormData = removeOptionalEmptyObjects(schemaUtils.getValidator(), schema, schemaUtils.getRootSchema(), newFormData);
+	        }
 	        if (noValidate || this.validateFormWithFormData(newFormData)) {
 	            // There are no errors generated through schema validation.
 	            // Check for user provided errors and update state accordingly.
@@ -37305,8 +37542,9 @@ export default theme;`;
 	        const elementId = path.join(idSeparator);
 	        let field = this.formElement.current.elements[elementId];
 	        if (!field) {
-	            // if not an exact match, try finding an input starting with the element id (like radio buttons or checkboxes)
-	            field = this.formElement.current.querySelector(`input[id^="${elementId}"`);
+	            // if not an exact match, try finding a focusable element starting with the element id (like radio buttons or checkboxes)
+	            // some themes (e.g. shadcn) use button elements instead of native inputs for radio groups
+	            field = this.formElement.current.querySelector(`input[id^="${elementId}"], button[id^="${elementId}"]`);
 	        }
 	        if (field && field.length) {
 	            // If we got a list with length > 0
@@ -37380,11 +37618,15 @@ export default theme;`;
 	     * @returns - True if the form is valid, false otherwise.
 	     */
 	    validateForm() {
-	        const { omitExtraData } = this.props;
+	        const { omitExtraData, removeEmptyOptionalObjects } = this.props;
 	        let { formData: newFormData } = this.state;
 	        if (omitExtraData === true) {
 	            newFormData = this.omitExtraData(newFormData);
 	        }
+	        if (removeEmptyOptionalObjects) {
+	            const { schemaUtils, schema } = this.state;
+	            newFormData = removeOptionalEmptyObjects(schemaUtils.getValidator(), schema, schemaUtils.getRootSchema(), newFormData);
+	        }
 	        return this.validateFormWithFormData(newFormData);
 	    }
 	    /** Renders the `Form` fields inside the <form> | `tagName` or `_internalFormWrapper`, rendering any errors if
@@ -44082,13 +44324,50 @@ export default theme;`;
 	    return ajv;
 	}
 
+	/** Filters duplicate errors from `anyOf`/`oneOf` schema paths according to the `suppressDuplicateFiltering` flag.
+	 *
+	 * @param errorList - The list of `RJSFValidationError`s to filter
+	 * @param [suppressDuplicateFiltering='none'] - Controls which duplicate filtering is suppressed:
+	 *   - `'none'` (default): filters duplicates for both `anyOf` and `oneOf`
+	 *   - `'all'`: returns `errorList` unmodified
+	 *   - `'anyOf'`: suppresses filtering for `anyOf` errors; `oneOf` duplicates are still filtered
+	 *   - `'oneOf'`: suppresses filtering for `oneOf` errors; `anyOf` duplicates are still filtered
+	 */
+	function filterDuplicateErrors(errorList, suppressDuplicateFiltering = 'none') {
+	    if (suppressDuplicateFiltering === 'all') {
+	        return errorList;
+	    }
+	    return errorList.reduce((acc, err) => {
+	        const { message, schemaPath } = err;
+	        // Compute the index only when filtering for that keyword is not suppressed.
+	        // 'all' is already handled above; within the reduce, only 'none', 'anyOf', and 'oneOf' are possible.
+	        const anyOfIndex = suppressDuplicateFiltering !== 'anyOf' ? schemaPath === null || schemaPath === void 0 ? void 0 : schemaPath.indexOf(`/${ANY_OF_KEY}/`) : undefined;
+	        const oneOfIndex = suppressDuplicateFiltering !== 'oneOf' ? schemaPath === null || schemaPath === void 0 ? void 0 : schemaPath.indexOf(`/${ONE_OF_KEY}/`) : undefined;
+	        let schemaPrefix;
+	        if (anyOfIndex && anyOfIndex >= 0) {
+	            schemaPrefix = schemaPath === null || schemaPath === void 0 ? void 0 : schemaPath.substring(0, anyOfIndex);
+	        }
+	        else if (oneOfIndex && oneOfIndex >= 0) {
+	            schemaPrefix = schemaPath === null || schemaPath === void 0 ? void 0 : schemaPath.substring(0, oneOfIndex);
+	        }
+	        // If there is a schemaPrefix, then search for a duplicate message with the same prefix, otherwise undefined
+	        const dup = schemaPrefix
+	            ? acc.find((e) => { var _a; return e.message === message && ((_a = e.schemaPath) === null || _a === void 0 ? void 0 : _a.startsWith(schemaPrefix)); })
+	            : undefined;
+	        if (!dup) {
+	            acc.push(err);
+	        }
+	        return acc;
+	    }, []);
+	}
 	/** Transforming the error output from ajv to format used by @rjsf/utils.
 	 * At some point, components should be updated to support ajv.
 	 *
 	 * @param errors - The list of AJV errors to convert to `RJSFValidationErrors`
 	 * @param [uiSchema] - An optional uiSchema that is passed to `transformErrors` and `customValidate`
+	 * @param [suppressDuplicateFiltering] - Controls which duplicate filtering is suppressed; see `filterDuplicateErrors`
 	 */
-	function transformRJSFValidationErrors(errors = [], uiSchema) {
+	function transformRJSFValidationErrors(errors = [], uiSchema, suppressDuplicateFiltering) {
 	    const errorList = errors.map((e) => {
 	        var _a;
 	        const { instancePath, keyword, params, schemaPath, parentSchema, ...rest } = e;
@@ -44158,29 +44437,7 @@ export default theme;`;
 	            title: uiTitle,
 	        };
 	    });
-	    // Filter out duplicates around anyOf/oneOf messages
-	    return errorList.reduce((acc, err) => {
-	        const { message, schemaPath } = err;
-	        const anyOfIndex = schemaPath === null || schemaPath === void 0 ? void 0 : schemaPath.indexOf(`/${ANY_OF_KEY}/`);
-	        const oneOfIndex = schemaPath === null || schemaPath === void 0 ? void 0 : schemaPath.indexOf(`/${ONE_OF_KEY}/`);
-	        let schemaPrefix;
-	        // Look specifically for `/anyOr/` or `/oneOf/` within the schemaPath information
-	        if (anyOfIndex && anyOfIndex >= 0) {
-	            schemaPrefix = schemaPath === null || schemaPath === void 0 ? void 0 : schemaPath.substring(0, anyOfIndex);
-	        }
-	        else if (oneOfIndex && oneOfIndex >= 0) {
-	            schemaPrefix = schemaPath === null || schemaPath === void 0 ? void 0 : schemaPath.substring(0, oneOfIndex);
-	        }
-	        // If there is a schemaPrefix, then search for a duplicate message with the same prefix, otherwise undefined
-	        const dup = schemaPrefix
-	            ? acc.find((e) => { var _a; return e.message === message && ((_a = e.schemaPath) === null || _a === void 0 ? void 0 : _a.startsWith(schemaPrefix)); })
-	            : undefined;
-	        if (!dup) {
-	            // Only push an error that is not a duplicate
-	            acc.push(err);
-	        }
-	        return acc;
-	    }, []);
+	    return filterDuplicateErrors(errorList, suppressDuplicateFiltering);
 	}
 	/** This function processes the `formData` with an optional user contributed `customValidate` function, which receives
 	 * the form data and a `errorHandler` function that will be used to add custom validation errors for each field. Also
@@ -44194,10 +44451,11 @@ export default theme;`;
 	 * @param [customValidate] - An optional function that is used to perform custom validation
 	 * @param [transformErrors] - An optional function that is used to transform errors after AJV validation
 	 * @param [uiSchema] - An optional uiSchema that is passed to `transformErrors` and `customValidate`
+	 * @param [suppressDuplicateFiltering] - Controls which duplicate filtering is suppressed; see `filterDuplicateErrors`
 	 */
-	function processRawValidationErrors(validator, rawErrors, formData, schema, customValidate, transformErrors, uiSchema) {
+	function processRawValidationErrors(validator, rawErrors, formData, schema, customValidate, transformErrors, uiSchema, suppressDuplicateFiltering) {
 	    const { validationError: invalidSchemaError } = rawErrors;
-	    let errors = transformRJSFValidationErrors(rawErrors.errors, uiSchema);
+	    let errors = transformRJSFValidationErrors(rawErrors.errors, uiSchema, suppressDuplicateFiltering);
 	    if (invalidSchemaError) {
 	        errors = [...errors, { stack: invalidSchemaError.message }];
 	    }
@@ -44232,9 +44490,10 @@ export default theme;`;
 	     * @param [localizer] - If provided, is used to localize a list of Ajv `ErrorObject`s
 	     */
 	    constructor(options, localizer) {
-	        const { additionalMetaSchemas, customFormats, ajvOptionsOverrides, ajvFormatOptions, AjvClass, extenderFn } = options;
+	        const { additionalMetaSchemas, customFormats, ajvOptionsOverrides, ajvFormatOptions, AjvClass, extenderFn, suppressDuplicateFiltering, } = options;
 	        this.ajv = createAjvInstance(additionalMetaSchemas, customFormats, ajvOptionsOverrides, ajvFormatOptions, AjvClass, extenderFn);
 	        this.localizer = localizer;
+	        this.suppressDuplicateFiltering = suppressDuplicateFiltering;
 	    }
 	    /** Resets the internal AJV validator to clear schemas from it. Can be helpful for resetting the validator for tests.
 	     */
@@ -44327,7 +44586,7 @@ export default theme;`;
 	     */
 	    validateFormData(formData, schema, customValidate, transformErrors, uiSchema) {
 	        const rawErrors = this.rawValidation(schema, formData);
-	        return processRawValidationErrors(this, rawErrors, formData, schema, customValidate, transformErrors, uiSchema);
+	        return processRawValidationErrors(this, rawErrors, formData, schema, customValidate, transformErrors, uiSchema, this.suppressDuplicateFiltering);
 	    }
 	    /**
 	     * This function checks if a schema needs to be added and if the root schemas don't match it removes the old root schema from the ajv instance and adds the new one.
@@ -44402,11 +44661,40 @@ export default theme;`;
 	  d: "M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
 	}));
 
+	/**
+	 * Extract props meant for MUI components from the `options` field of the `uiSchema`.
+	 * @param {UIOptionsType} options - The options from the uiSchema
+	 * @param {string[]} [propsToFilter] - An optional allowlist of props to return (used by button/icon components)
+	 * @param {boolean} [rjsfSlotPropsOnly] - If true, returns only `rjsfSlotProps`, preventing root-level prop bleeding
+	 * @returns {P}
+	 */
+	function getMuiProps(options, propsToFilter, rjsfSlotPropsOnly) {
+	    const muiProps = (options === null || options === void 0 ? void 0 : options.mui) || {};
+	    if (propsToFilter) {
+	        return Object.keys(muiProps)
+	            .filter((key) => propsToFilter.includes(key))
+	            .reduce((obj, key) => {
+	            obj[key] = muiProps[key];
+	            return obj;
+	        }, {});
+	    }
+	    return muiProps;
+	}
+
 	/** The `AddButton` renders a button that represent the `Add` action on a form
 	 */
 	function AddButton({ uiSchema, registry, ...props }) {
 	    const { translateString } = registry;
-	    return (jsxRuntimeExports.jsx(IconButton$1, { title: translateString(TranslatableString.AddItemButton), ...props, color: 'primary', children: jsxRuntimeExports.jsx(AddIcon, {}) }));
+	    const uiOptions = getUiOptions(uiSchema);
+	    const muiProps = getMuiProps(uiOptions, [
+	        'color',
+	        'disableFocusRipple',
+	        'disableRipple',
+	        'edge',
+	        'size',
+	        'sx',
+	    ]);
+	    return (jsxRuntimeExports.jsx(IconButton$1, { title: translateString(TranslatableString.AddItemButton), ...props, color: 'primary', ...muiProps, children: jsxRuntimeExports.jsx(AddIcon, {}) }));
 	}
 
 	/** The `ArrayFieldItemTemplate` component is the template used to render an items of an array.
@@ -44424,7 +44712,8 @@ export default theme;`;
 	        fontWeight: 'bold',
 	        minWidth: 0,
 	    };
-	    return (jsxRuntimeExports.jsxs(Grid, { container: true, alignItems: 'center', children: [jsxRuntimeExports.jsx(Grid, { size: { xs: 8, sm: 9, md: 10, lg: 11, xl: 11.25 }, style: { overflow: 'auto' }, children: jsxRuntimeExports.jsx(Box, { mb: 2, children: jsxRuntimeExports.jsx(Paper, { elevation: 2, children: jsxRuntimeExports.jsx(Box, { p: 2, children: children }) }) }) }), hasToolbar && (jsxRuntimeExports.jsx(Grid, { sx: { mt: hasDescription ? -5 : -1.5 }, children: jsxRuntimeExports.jsx(ArrayFieldItemButtonsTemplate, { ...buttonsProps, style: btnStyle }) }))] }));
+	    const { rjsfSlotProps: muiSlotProps } = getMuiProps(uiOptions);
+	    return (jsxRuntimeExports.jsxs(Grid, { container: true, alignItems: 'center', ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.arrayItemGridContainer, children: [jsxRuntimeExports.jsx(Grid, { size: { xs: 8, sm: 9, md: 10, lg: 11, xl: 11.25 }, style: { overflow: 'auto' }, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.arrayItemGridItem, children: jsxRuntimeExports.jsx(Box, { mb: 2, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.arrayItemOuterBox, children: jsxRuntimeExports.jsx(Paper, { elevation: 2, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.arrayItemPaper, children: jsxRuntimeExports.jsx(Box, { p: 2, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.arrayItemInnerBox, children: children }) }) }) }), hasToolbar && (jsxRuntimeExports.jsx(Grid, { sx: { mt: hasDescription ? -5 : -1.5 }, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.arrayItemToolbarGrid, children: jsxRuntimeExports.jsx(ArrayFieldItemButtonsTemplate, { ...buttonsProps, style: btnStyle }) }))] }));
 	}
 
 	/** The `ArrayFieldTemplate` component is the template used to render all items in an array.
@@ -44439,7 +44728,8 @@ export default theme;`;
 	    const showOptionalDataControlInTitle = !readonly && !disabled;
 	    // Button templates are not overridden in the uiSchema
 	    const { ButtonTemplates: { AddButton }, } = registry.templates;
-	    return (jsxRuntimeExports.jsx(Paper, { elevation: 2, children: jsxRuntimeExports.jsxs(Box, { p: 2, children: [jsxRuntimeExports.jsx(ArrayFieldTitleTemplate, { fieldPathId: fieldPathId, title: uiOptions.title || title, schema: schema, uiSchema: uiSchema, required: required, registry: registry, optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : undefined }), jsxRuntimeExports.jsx(ArrayFieldDescriptionTemplate, { fieldPathId: fieldPathId, description: uiOptions.description || schema.description, schema: schema, uiSchema: uiSchema, registry: registry }), !showOptionalDataControlInTitle ? optionalDataControl : undefined, items, canAdd && (jsxRuntimeExports.jsx(Grid, { container: true, justifyContent: 'flex-end', children: jsxRuntimeExports.jsx(Grid, { children: jsxRuntimeExports.jsx(Box, { mt: 2, children: jsxRuntimeExports.jsx(AddButton, { id: buttonId(fieldPathId, 'add'), className: 'rjsf-array-item-add', onClick: onAddClick, disabled: disabled || readonly, uiSchema: uiSchema, registry: registry }) }) }) }))] }) }));
+	    const { rjsfSlotProps: muiSlotProps } = getMuiProps(uiOptions);
+	    return (jsxRuntimeExports.jsx(Paper, { elevation: 2, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.arrayPaper, children: jsxRuntimeExports.jsxs(Box, { p: 2, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.arrayBox, children: [jsxRuntimeExports.jsx(ArrayFieldTitleTemplate, { fieldPathId: fieldPathId, title: uiOptions.title || title, schema: schema, uiSchema: uiSchema, required: required, registry: registry, optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : undefined }), jsxRuntimeExports.jsx(ArrayFieldDescriptionTemplate, { fieldPathId: fieldPathId, description: uiOptions.description || schema.description, schema: schema, uiSchema: uiSchema, registry: registry }), !showOptionalDataControlInTitle ? optionalDataControl : undefined, items, canAdd && (jsxRuntimeExports.jsx(Grid, { container: true, justifyContent: 'flex-end', ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.arrayAddButtonGridContainer, children: jsxRuntimeExports.jsx(Grid, { ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.arrayAddButtonGridItem, children: jsxRuntimeExports.jsx(Box, { mt: 2, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.arrayAddButtonBox, children: jsxRuntimeExports.jsx(AddButton, { id: buttonId(fieldPathId, 'add'), className: 'rjsf-array-item-add', onClick: onAddClick, disabled: disabled || readonly, uiSchema: uiSchema, registry: registry }) }) }) }))] }) }));
 	}
 
 	const TYPES_THAT_SHRINK_LABEL = ['date', 'datetime-local', 'file', 'time'];
@@ -44455,8 +44745,11 @@ export default theme;`;
 	    const { ClearButton } = registry.templates.ButtonTemplates;
 	    // Now we need to pull out the step, min, max into an inner `inputProps` for material-ui
 	    const { step, min, max, accept, ...rest } = getInputProps(schema, type, options);
+	    const muiProps = getMuiProps(options);
+	    const { slotProps: muiSlotProps, ...otherMuiProps } = muiProps;
 	    const htmlInputProps = {
 	        ...slotProps === null || slotProps === void 0 ? void 0 : slotProps.htmlInput,
+	        ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.htmlInput,
 	        step,
 	        min,
 	        max,
@@ -44467,25 +44760,26 @@ export default theme;`;
 	    const _onBlur = ({ target }) => onBlur(id, target && target.value);
 	    const _onFocus = ({ target }) => onFocus(id, target && target.value);
 	    const DisplayInputLabelProps = TYPES_THAT_SHRINK_LABEL.includes(type)
-	        ? { ...slotProps === null || slotProps === void 0 ? void 0 : slotProps.inputLabel, ...InputLabelProps, shrink: true }
-	        : { ...slotProps === null || slotProps === void 0 ? void 0 : slotProps.inputLabel, ...InputLabelProps };
+	        ? { ...slotProps === null || slotProps === void 0 ? void 0 : slotProps.inputLabel, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.inputLabel, ...InputLabelProps, shrink: true }
+	        : { ...slotProps === null || slotProps === void 0 ? void 0 : slotProps.inputLabel, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.inputLabel, ...InputLabelProps };
 	    const _onClear = reactExports.useCallback((e) => {
 	        var _a;
 	        e.preventDefault();
 	        e.stopPropagation();
 	        onChange((_a = options.emptyValue) !== null && _a !== void 0 ? _a : '');
 	    }, [onChange, options.emptyValue]);
-	    const inputProps = { ...InputProps, ...slotProps === null || slotProps === void 0 ? void 0 : slotProps.input };
+	    const inputProps = { ...InputProps, ...slotProps === null || slotProps === void 0 ? void 0 : slotProps.input, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.input };
 	    if (options.allowClearTextInputs && value && !readonly && !disabled) {
 	        const clearAdornment = (jsxRuntimeExports.jsx(InputAdornment, { position: 'end', children: jsxRuntimeExports.jsx(ClearButton, { registry: registry, onClick: _onClear }) }));
 	        inputProps.endAdornment = !inputProps.endAdornment ? (clearAdornment) : (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [inputProps.endAdornment, clearAdornment] }));
 	    }
 	    return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(TextField, { id: id, name: htmlName || id, placeholder: placeholder, label: labelValue(label || undefined, hideLabel, undefined), autoFocus: autofocus, required: required, disabled: disabled || readonly, slotProps: {
 	                    ...slotProps,
+	                    ...muiSlotProps,
 	                    input: inputProps,
 	                    htmlInput: htmlInputProps,
 	                    inputLabel: DisplayInputLabelProps,
-	                }, ...rest, value: value || value === 0 ? value : '', error: rawErrors.length > 0, onChange: onChangeOverride || _onChange, onBlur: _onBlur, onFocus: _onFocus, ...textFieldProps, "aria-describedby": ariaDescribedByIds(id, !!schema.examples) }), jsxRuntimeExports.jsx(SchemaExamples, { id: id, schema: schema })] }));
+	                }, ...rest, value: value || value === 0 ? value : '', error: rawErrors.length > 0, onChange: onChangeOverride || _onChange, onBlur: _onBlur, onFocus: _onFocus, ...{ ...otherMuiProps, ...textFieldProps }, "aria-describedby": ariaDescribedByIds(id, !!schema.examples) }), jsxRuntimeExports.jsx(SchemaExamples, { id: id, schema: schema })] }));
 	}
 
 	/** The `DescriptionField` is the template to use to render the description of a field
@@ -44494,8 +44788,11 @@ export default theme;`;
 	 */
 	function DescriptionField(props) {
 	    const { id, description, registry, uiSchema } = props;
+	    const uiOptions = getUiOptions(uiSchema);
+	    const muiProps = getMuiProps(uiOptions);
+	    const { rjsfSlotProps: muiSlotProps } = muiProps;
 	    if (description) {
-	        return (jsxRuntimeExports.jsx(Typography, { id: id, variant: 'subtitle2', style: { marginTop: '5px' }, children: jsxRuntimeExports.jsx(RichDescription, { description: description, registry: registry, uiSchema: uiSchema }) }));
+	        return (jsxRuntimeExports.jsx(Typography, { id: id, variant: 'subtitle2', style: { marginTop: '5px' }, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.descTypography, children: jsxRuntimeExports.jsx(RichDescription, { description: description, registry: registry, uiSchema: uiSchema }) }));
 	    }
 	    return null;
 	}
@@ -44508,10 +44805,12 @@ export default theme;`;
 	 *
 	 * @param props - The `ErrorListProps` for this component
 	 */
-	function ErrorList({ errors, registry, }) {
+	function ErrorList({ errors, registry, uiSchema, }) {
 	    const { translateString } = registry;
-	    return (jsxRuntimeExports.jsx(Paper, { elevation: 2, children: jsxRuntimeExports.jsxs(Box, { mb: 2, p: 2, children: [jsxRuntimeExports.jsx(Typography, { variant: 'h6', children: translateString(TranslatableString.ErrorsLabel) }), jsxRuntimeExports.jsx(List, { dense: true, children: errors.map((error, i) => {
-	                        return (jsxRuntimeExports.jsxs(ListItem, { children: [jsxRuntimeExports.jsx(ListItemIcon, { children: jsxRuntimeExports.jsx(ErrorIcon, { color: 'error' }) }), jsxRuntimeExports.jsx(ListItemText, { primary: error.stack })] }, i));
+	    const uiOptions = getUiOptions(uiSchema);
+	    const { rjsfSlotProps: muiSlotProps } = getMuiProps(uiOptions);
+	    return (jsxRuntimeExports.jsx(Paper, { elevation: 2, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.errorPaper, children: jsxRuntimeExports.jsxs(Box, { mb: 2, p: 2, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.errorBox, children: [jsxRuntimeExports.jsx(Typography, { variant: 'h6', ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.errorTypography, children: translateString(TranslatableString.ErrorsLabel) }), jsxRuntimeExports.jsx(List, { dense: true, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.errorList, children: errors.map((error, i) => {
+	                        return (jsxRuntimeExports.jsxs(ListItem, { ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.errorListItem, children: [jsxRuntimeExports.jsx(ListItemIcon, { ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.errorListItemIcon, children: jsxRuntimeExports.jsx(ErrorIcon, { color: 'error' }) }), jsxRuntimeExports.jsx(ListItemText, { primary: error.stack, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.errorListItemText })] }, i));
 	                    }) })] }) }));
 	}
 
@@ -44537,7 +44836,16 @@ export default theme;`;
 
 	function MuiIconButton(props) {
 	    const { icon, color, uiSchema, registry, ...otherProps } = props;
-	    return (jsxRuntimeExports.jsx(IconButton$1, { ...otherProps, size: 'small', color: color, children: icon }));
+	    const uiOptions = getUiOptions(uiSchema);
+	    const muiProps = getMuiProps(uiOptions, [
+	        'color',
+	        'disableFocusRipple',
+	        'disableRipple',
+	        'edge',
+	        'size',
+	        'sx',
+	    ]);
+	    return (jsxRuntimeExports.jsx(IconButton$1, { ...muiProps, ...otherProps, size: 'small', color: color, children: icon }));
 	}
 	function CopyButton(props) {
 	    const { registry: { translateString }, } = props;
@@ -44567,13 +44875,16 @@ export default theme;`;
 	 * @param props - The `FieldErrorProps` for the errors being rendered
 	 */
 	function FieldErrorTemplate(props) {
-	    const { errors = [], fieldPathId } = props;
+	    const { errors = [], fieldPathId, uiSchema } = props;
 	    if (errors.length === 0) {
 	        return null;
 	    }
 	    const id = errorId(fieldPathId);
-	    return (jsxRuntimeExports.jsx(List, { id: id, dense: true, disablePadding: true, children: errors.map((error, i) => {
-	            return (jsxRuntimeExports.jsx(ListItem, { disableGutters: true, children: jsxRuntimeExports.jsx(FormHelperText, { component: 'div', id: `${id}-${i}`, children: error }) }, i));
+	    const uiOptions = getUiOptions(uiSchema);
+	    const muiProps = getMuiProps(uiOptions);
+	    const { rjsfSlotProps: muiSlotProps } = muiProps;
+	    return (jsxRuntimeExports.jsx(List, { id: id, dense: true, disablePadding: true, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.fieldErrorList, children: errors.map((error, i) => {
+	            return (jsxRuntimeExports.jsx(ListItem, { disableGutters: true, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.fieldErrorListItem, children: jsxRuntimeExports.jsx(FormHelperText, { component: 'div', id: `${id}-${i}`, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.fieldErrorFormHelperText, children: error }) }, i));
 	        }) }));
 	}
 
@@ -44586,7 +44897,10 @@ export default theme;`;
 	    if (!help) {
 	        return null;
 	    }
-	    return (jsxRuntimeExports.jsx(FormHelperText, { component: 'div', id: helpId(fieldPathId), style: { marginTop: '5px' }, children: jsxRuntimeExports.jsx(RichHelp, { help: help, registry: registry, uiSchema: uiSchema }) }));
+	    const uiOptions = getUiOptions(uiSchema);
+	    const muiProps = getMuiProps(uiOptions);
+	    const { rjsfSlotProps: muiSlotProps } = muiProps;
+	    return (jsxRuntimeExports.jsx(FormHelperText, { component: 'div', id: helpId(fieldPathId), style: { marginTop: '5px' }, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.helpFormHelperText, children: jsxRuntimeExports.jsx(RichHelp, { help: help, registry: registry, uiSchema: uiSchema }) }));
 	}
 
 	/** The `FieldTemplate` component is the template used by `SchemaField` to render any field. It renders the field
@@ -44602,7 +44916,8 @@ export default theme;`;
 	        return jsxRuntimeExports.jsx("div", { style: { display: 'none' }, children: children });
 	    }
 	    const isCheckbox = uiOptions.widget === 'checkbox';
-	    return (jsxRuntimeExports.jsx(WrapIfAdditionalTemplate, { classNames: classNames, style: style, disabled: disabled, id: id, label: label, displayLabel: displayLabel, rawDescription: rawDescription, onKeyRename: onKeyRename, onKeyRenameBlur: onKeyRenameBlur, onRemoveProperty: onRemoveProperty, readonly: readonly, required: required, schema: schema, uiSchema: uiSchema, registry: registry, children: jsxRuntimeExports.jsxs(FormControl, { fullWidth: true, error: rawErrors.length ? true : false, required: required, children: [children, displayLabel && !isCheckbox && rawDescription ? (jsxRuntimeExports.jsx(Typography, { variant: 'caption', color: 'textSecondary', children: description })) : null, errors, help] }) }));
+	    const { rjsfSlotProps: muiSlotProps, ...otherMuiProps } = getMuiProps(uiOptions);
+	    return (jsxRuntimeExports.jsx(WrapIfAdditionalTemplate, { classNames: classNames, style: style, disabled: disabled, id: id, label: label, displayLabel: displayLabel, rawDescription: rawDescription, onKeyRename: onKeyRename, onKeyRenameBlur: onKeyRenameBlur, onRemoveProperty: onRemoveProperty, readonly: readonly, required: required, schema: schema, uiSchema: uiSchema, registry: registry, children: jsxRuntimeExports.jsxs(FormControl, { fullWidth: true, error: rawErrors.length ? true : false, required: required, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.fieldFormControl, sx: otherMuiProps.sx, className: otherMuiProps.className, children: [children, displayLabel && !isCheckbox && rawDescription ? (jsxRuntimeExports.jsx(Typography, { variant: 'caption', color: 'textSecondary', ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.fieldTypography, children: description })) : null, errors, help] }) }));
 	}
 
 	/** Renders a `GridTemplate` for mui, which is expecting the column sizing information coming in via the
@@ -44616,8 +44931,10 @@ export default theme;`;
 	}
 
 	function MultiSchemaFieldTemplate(props) {
-	    const { optionSchemaField, selector } = props;
-	    return (jsxRuntimeExports.jsxs(Box, { sx: { mb: 2 }, children: [jsxRuntimeExports.jsx(FormControl, { fullWidth: true, sx: { mb: 2 }, children: selector }), optionSchemaField] }));
+	    const { optionSchemaField, selector, uiSchema } = props;
+	    const uiOptions = getUiOptions(uiSchema);
+	    const { rjsfSlotProps: muiSlotProps } = getMuiProps(uiOptions);
+	    return (jsxRuntimeExports.jsxs(Box, { sx: { mb: 2 }, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.multiBox, children: [jsxRuntimeExports.jsx(FormControl, { fullWidth: true, sx: { mb: 2 }, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.multiFormControl, children: selector }), optionSchemaField] }));
 	}
 
 	/** The `ObjectFieldTemplate` is the template to use to render all the inner properties of an object along with the
@@ -44634,10 +44951,11 @@ export default theme;`;
 	    const showOptionalDataControlInTitle = !readonly && !disabled;
 	    // Button templates are not overridden in the uiSchema
 	    const { ButtonTemplates: { AddButton }, } = registry.templates;
-	    return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [title && (jsxRuntimeExports.jsx(TitleFieldTemplate, { id: titleId(fieldPathId), title: title, required: required, schema: schema, uiSchema: uiSchema, registry: registry, optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : undefined })), description && (jsxRuntimeExports.jsx(DescriptionFieldTemplate, { id: descriptionId(fieldPathId), description: description, schema: schema, uiSchema: uiSchema, registry: registry })), jsxRuntimeExports.jsxs(Grid, { container: true, spacing: 2, style: { marginTop: '10px' }, children: [!showOptionalDataControlInTitle ? optionalDataControl : undefined, properties.map((element, index) => 
+	    const { rjsfSlotProps: muiSlotProps } = getMuiProps(uiOptions);
+	    return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [title && (jsxRuntimeExports.jsx(TitleFieldTemplate, { id: titleId(fieldPathId), title: title, required: required, schema: schema, uiSchema: uiSchema, registry: registry, optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : undefined })), description && (jsxRuntimeExports.jsx(DescriptionFieldTemplate, { id: descriptionId(fieldPathId), description: description, schema: schema, uiSchema: uiSchema, registry: registry })), jsxRuntimeExports.jsxs(Grid, { container: true, spacing: 2, style: { marginTop: '10px' }, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.objectGridContainer, children: [!showOptionalDataControlInTitle ? optionalDataControl : undefined, properties.map((element, index) => 
 	                    // Remove the <Grid> if the inner element is hidden as the <Grid>
 	                    // itself would otherwise still take up space.
-	                    element.hidden ? (element.content) : (jsxRuntimeExports.jsx(Grid, { size: { xs: 12 }, style: { marginBottom: '10px' }, children: element.content }, index)))] }), canExpand(schema, uiSchema, formData) && (jsxRuntimeExports.jsx(Grid, { container: true, justifyContent: 'flex-end', children: jsxRuntimeExports.jsx(Grid, { children: jsxRuntimeExports.jsx(AddButton, { id: buttonId(fieldPathId, 'add'), className: 'rjsf-object-property-expand', onClick: onAddProperty, disabled: disabled || readonly, uiSchema: uiSchema, registry: registry }) }) }))] }));
+	                    element.hidden ? (element.content) : (jsxRuntimeExports.jsx(Grid, { size: { xs: 12 }, style: { marginBottom: '10px' }, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.objectGridItem, children: element.content }, index)))] }), canExpand(schema, uiSchema, formData) && (jsxRuntimeExports.jsx(Grid, { container: true, justifyContent: 'flex-end', ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.objectAddButtonGridContainer, children: jsxRuntimeExports.jsx(Grid, { ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.objectAddButtonGridItem, children: jsxRuntimeExports.jsx(AddButton, { id: buttonId(fieldPathId, 'add'), className: 'rjsf-object-property-expand', onClick: onAddProperty, disabled: disabled || readonly, uiSchema: uiSchema, registry: registry }) }) }))] }));
 	}
 
 	/** The OptionalDataControlsTemplate renders one of three different states. If
@@ -44649,12 +44967,12 @@ export default theme;`;
 	 * @param props - The `OptionalDataControlsTemplateProps` for the template
 	 */
 	function OptionalDataControlsTemplate(props) {
-	    const { id, registry, label, onAddClick, onRemoveClick } = props;
+	    const { id, registry, label, onAddClick, onRemoveClick, uiSchema } = props;
 	    if (onAddClick) {
-	        return (jsxRuntimeExports.jsx(MuiIconButton, { id: id, registry: registry, className: 'rjsf-add-optional-data', onClick: onAddClick, title: label, icon: jsxRuntimeExports.jsx(AddIcon, { fontSize: 'small' }) }));
+	        return (jsxRuntimeExports.jsx(MuiIconButton, { id: id, registry: registry, uiSchema: uiSchema, className: 'rjsf-add-optional-data', onClick: onAddClick, title: label, icon: jsxRuntimeExports.jsx(AddIcon, { fontSize: 'small' }) }));
 	    }
 	    else if (onRemoveClick) {
-	        return (jsxRuntimeExports.jsx(RemoveButton, { id: id, registry: registry, className: 'rjsf-remove-optional-data', onClick: onRemoveClick, title: label }));
+	        return (jsxRuntimeExports.jsx(RemoveButton, { id: id, registry: registry, uiSchema: uiSchema, className: 'rjsf-remove-optional-data', onClick: onRemoveClick, title: label }));
 	    }
 	    return jsxRuntimeExports.jsx("em", { id: id, children: label });
 	}
@@ -44666,19 +44984,24 @@ export default theme;`;
 	    if (norender) {
 	        return null;
 	    }
-	    return (jsxRuntimeExports.jsx(Box, { marginTop: 3, children: jsxRuntimeExports.jsx(Button, { type: 'submit', variant: 'contained', color: 'primary', ...submitButtonProps, children: submitText }) }));
+	    const uiOptions = getUiOptions(uiSchema);
+	    const { rjsfSlotProps: muiSlotProps, ...otherMuiProps } = getMuiProps(uiOptions);
+	    return (jsxRuntimeExports.jsx(Box, { marginTop: 3, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.submitBox, children: jsxRuntimeExports.jsx(Button, { type: 'submit', variant: 'contained', color: 'primary', ...submitButtonProps, ...otherMuiProps, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.submitButton, children: submitText }) }));
 	}
 
 	/** The `TitleField` is the template to use to render the title of a field
 	 *
 	 * @param props - The `TitleFieldProps` for this component
 	 */
-	function TitleField({ id, title, optionalDataControl, }) {
-	    let heading = jsxRuntimeExports.jsx(Typography, { variant: 'h5', children: title });
+	function TitleField(props) {
+	    const { id, title, optionalDataControl, uiSchema } = props;
+	    const uiOptions = getUiOptions(uiSchema);
+	    const { rjsfSlotProps: muiSlotProps } = getMuiProps(uiOptions);
+	    let heading = (jsxRuntimeExports.jsx(Typography, { variant: 'h5', ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.titleTypography, children: title }));
 	    if (optionalDataControl) {
-	        heading = (jsxRuntimeExports.jsxs(Grid, { container: true, spacing: 0, children: [jsxRuntimeExports.jsx(Grid, { size: 'grow', children: heading }), jsxRuntimeExports.jsx(Grid, { justifyContent: 'flex-end', children: optionalDataControl })] }));
+	        heading = (jsxRuntimeExports.jsxs(Grid, { container: true, spacing: 0, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.titleGridContainer, children: [jsxRuntimeExports.jsx(Grid, { size: 'grow', ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.titleGridItem, children: heading }), jsxRuntimeExports.jsx(Grid, { justifyContent: 'flex-end', ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.titleOptionalDataGridItem, children: optionalDataControl })] }));
 	    }
-	    return (jsxRuntimeExports.jsxs(Box, { id: id, mb: 1, mt: 1, children: [heading, jsxRuntimeExports.jsx(Divider, {})] }));
+	    return (jsxRuntimeExports.jsxs(Box, { id: id, mb: 1, mt: 1, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.titleBox, children: [heading, jsxRuntimeExports.jsx(Divider, { ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.titleDivider })] }));
 	}
 
 	/** The `WrapIfAdditional` component is used by the `FieldTemplate` to rename, or remove properties that are
@@ -44699,10 +45022,14 @@ export default theme;`;
 	        paddingRight: 6,
 	        fontWeight: 'bold',
 	    };
+	    const uiOptions = getUiOptions(uiSchema);
+	    const { rjsfSlotProps } = getMuiProps(uiOptions);
+	    const muiSlotProps = rjsfSlotProps;
 	    if (!additional) {
 	        return (jsxRuntimeExports.jsx("div", { className: classNames, style: style, children: children }));
 	    }
-	    return (jsxRuntimeExports.jsxs(Grid, { container: true, alignItems: 'flex-start', spacing: 2, className: classNames, style: style, children: [jsxRuntimeExports.jsx(Grid, { size: 5.5, children: jsxRuntimeExports.jsx(TextField, { fullWidth: true, required: required, label: displayLabel ? keyLabel : undefined, defaultValue: label, disabled: disabled || readonly, id: `${id}-key`, name: `${id}-key`, onBlur: !readonly ? onKeyRenameBlur : undefined, type: 'text' }) }), jsxRuntimeExports.jsx(Grid, { size: 5.5, children: children }), jsxRuntimeExports.jsx(Grid, { sx: { mt: 1.5 }, children: jsxRuntimeExports.jsx(RemoveButton, { id: buttonId(id, 'remove'), className: 'rjsf-object-property-remove', iconType: 'default', style: btnStyle, disabled: disabled || readonly, onClick: onRemoveProperty, uiSchema: uiSchema, registry: registry }) })] }, `${id}-key`));
+	    const { wrapGridContainer, wrapKeyGridItem, wrapChildrenGridItem, wrapRemoveButtonGridItem } = muiSlotProps || {};
+	    return (jsxRuntimeExports.jsxs(Grid, { container: true, alignItems: 'flex-start', spacing: 2, className: classNames, style: style, ...wrapGridContainer, children: [jsxRuntimeExports.jsx(Grid, { size: 5.5, ...wrapKeyGridItem, children: jsxRuntimeExports.jsx(TextField, { fullWidth: true, required: required, label: displayLabel ? keyLabel : undefined, defaultValue: label, disabled: disabled || readonly, id: `${id}-key`, name: `${id}-key`, onBlur: !readonly ? onKeyRenameBlur : undefined, type: 'text' }, label) }), jsxRuntimeExports.jsx(Grid, { size: 5.5, ...wrapChildrenGridItem, children: children }), jsxRuntimeExports.jsx(Grid, { sx: { mt: 1.5 }, ...wrapRemoveButtonGridItem, children: jsxRuntimeExports.jsx(RemoveButton, { id: buttonId(id, 'remove'), className: 'rjsf-object-property-remove', iconType: 'default', style: btnStyle, disabled: disabled || readonly, onClick: onRemoveProperty, uiSchema: uiSchema, registry: registry }) })] }, `${id}-key`));
 	}
 
 	function generateTemplates() {
@@ -44750,7 +45077,8 @@ export default theme;`;
 	    const _onBlur = () => onBlur(id, value);
 	    const _onFocus = () => onFocus(id, value);
 	    const description = (_a = options.description) !== null && _a !== void 0 ? _a : schema.description;
-	    return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [!hideLabel && description && (jsxRuntimeExports.jsx(DescriptionFieldTemplate, { id: descriptionId(id), description: description, schema: schema, uiSchema: uiSchema, registry: registry })), jsxRuntimeExports.jsx(FormControlLabel, { control: jsxRuntimeExports.jsx(Checkbox, { id: id, name: htmlName || id, checked: typeof value === 'undefined' ? false : Boolean(value), required: required, disabled: disabled || readonly, autoFocus: autofocus, onChange: _onChange, onBlur: _onBlur, onFocus: _onFocus, "aria-describedby": ariaDescribedByIds(id) }), label: labelValue(label, hideLabel, false) })] }));
+	    const { rjsfSlotProps: muiSlotProps, ...otherMuiProps } = getMuiProps(options);
+	    return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [!hideLabel && description && (jsxRuntimeExports.jsx(DescriptionFieldTemplate, { id: descriptionId(id), description: description, schema: schema, uiSchema: uiSchema, registry: registry })), jsxRuntimeExports.jsx(FormControlLabel, { ...otherMuiProps, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.formControlLabel, control: jsxRuntimeExports.jsx(Checkbox, { id: id, name: htmlName || id, checked: typeof value === 'undefined' ? false : Boolean(value), required: required, disabled: disabled || readonly, autoFocus: autofocus, onChange: _onChange, onBlur: _onBlur, onFocus: _onFocus, "aria-describedby": ariaDescribedByIds(id), ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.checkbox }), label: labelValue(label, hideLabel, false) })] }));
 	}
 
 	/** The `CheckboxesWidget` is a widget for rendering checkbox groups.
@@ -44758,8 +45086,10 @@ export default theme;`;
 	 *
 	 * @param props - The `WidgetProps` for this component
 	 */
-	function CheckboxesWidget({ label, hideLabel, id, htmlName, disabled, options, value, autofocus, readonly, required, onChange, onBlur, onFocus, }) {
+	function CheckboxesWidget(props) {
+	    const { label, hideLabel, id, htmlName, disabled, options, value, autofocus, readonly, required, onChange, onBlur, onFocus, } = props;
 	    const { enumOptions, enumDisabled, inline, emptyValue } = options;
+	    const optionValueFormat = getOptionValueFormat(options);
 	    const checkboxesValues = Array.isArray(value) ? value : [value];
 	    const _onChange = (index) => ({ target: { checked } }) => {
 	        if (checked) {
@@ -44769,14 +45099,15 @@ export default theme;`;
 	            onChange(enumOptionsDeselectValue(index, checkboxesValues, enumOptions));
 	        }
 	    };
-	    const _onBlur = ({ target }) => onBlur(id, enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue));
-	    const _onFocus = ({ target }) => onFocus(id, enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue));
-	    return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [labelValue(jsxRuntimeExports.jsx(FormLabel, { required: required, htmlFor: id, children: label || undefined }), hideLabel), jsxRuntimeExports.jsx(FormGroup, { id: id, row: !!inline, children: Array.isArray(enumOptions) &&
+	    const _onBlur = ({ target }) => onBlur(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue));
+	    const _onFocus = ({ target }) => onFocus(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue));
+	    const { rjsfSlotProps: muiSlotProps, ...otherMuiProps } = getMuiProps(options);
+	    return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [labelValue(jsxRuntimeExports.jsx(FormLabel, { required: required, htmlFor: id, children: label || undefined }), hideLabel), jsxRuntimeExports.jsx(FormGroup, { ...otherMuiProps, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.formGroup, id: id, row: !!inline, children: Array.isArray(enumOptions) &&
 	                    enumOptions.map((option, index) => {
 	                        const checked = enumOptionsIsSelected(option.value, checkboxesValues);
 	                        const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-	                        const checkbox = (jsxRuntimeExports.jsx(Checkbox, { id: optionId(id, index), name: htmlName || id, checked: checked, disabled: disabled || itemDisabled || readonly, autoFocus: autofocus && index === 0, onChange: _onChange(index), onBlur: _onBlur, onFocus: _onFocus, "aria-describedby": ariaDescribedByIds(id) }));
-	                        return jsxRuntimeExports.jsx(FormControlLabel, { control: checkbox, label: option.label }, index);
+	                        const checkbox = (jsxRuntimeExports.jsx(Checkbox, { ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.checkbox, id: optionId(id, index), name: htmlName || id, checked: checked, disabled: disabled || itemDisabled || readonly, autoFocus: autofocus && index === 0, onChange: _onChange(index), onBlur: _onBlur, onFocus: _onFocus, "aria-describedby": ariaDescribedByIds(id) }));
+	                        return (reactExports.createElement(FormControlLabel, { ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.formControlLabel, control: checkbox, key: index, label: option.label }));
 	                    }) })] }));
 	}
 
@@ -44785,18 +45116,20 @@ export default theme;`;
 	 *
 	 * @param props - The `WidgetProps` for this component
 	 */
-	function RadioWidget({ id, htmlName, options, value, required, disabled, readonly, label, hideLabel, onChange, onBlur, onFocus, }) {
-	    var _a;
+	function RadioWidget(props) {
+	    const { id, htmlName, options, value, required, disabled, readonly, label, hideLabel, onChange, onBlur, onFocus } = props;
 	    const { enumOptions, enumDisabled, emptyValue } = options;
-	    const _onChange = (_, value) => onChange(enumOptionsValueForIndex(value, enumOptions, emptyValue));
-	    const _onBlur = ({ target }) => onBlur(id, enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue));
-	    const _onFocus = ({ target }) => onFocus(id, enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue));
+	    const optionValueFormat = getOptionValueFormat(options);
+	    const _onChange = (_, value) => onChange(enumOptionValueDecoder(value, enumOptions, optionValueFormat, emptyValue));
+	    const _onBlur = ({ target }) => onBlur(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue));
+	    const _onFocus = ({ target }) => onFocus(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue));
 	    const row = options ? options.inline : false;
-	    const selectedIndex = (_a = enumOptionsIndexForValue(value, enumOptions)) !== null && _a !== void 0 ? _a : null;
-	    return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [labelValue(jsxRuntimeExports.jsx(FormLabel, { required: required, htmlFor: id, children: label || undefined }), hideLabel), jsxRuntimeExports.jsx(RadioGroup, { id: id, name: htmlName || id, value: selectedIndex, row: row, onChange: _onChange, onBlur: _onBlur, onFocus: _onFocus, "aria-describedby": ariaDescribedByIds(id), children: Array.isArray(enumOptions) &&
+	    const selectValue = enumOptionSelectedValue(value, enumOptions, false, optionValueFormat, '');
+	    const { rjsfSlotProps: muiSlotProps, ...otherMuiProps } = getMuiProps(options);
+	    return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [labelValue(jsxRuntimeExports.jsx(FormLabel, { required: required, htmlFor: id, children: label || undefined }), hideLabel), jsxRuntimeExports.jsx(RadioGroup, { ...otherMuiProps, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.radioGroup, id: id, name: htmlName || id, value: selectValue, row: row, onChange: _onChange, onBlur: _onBlur, onFocus: _onFocus, "aria-describedby": ariaDescribedByIds(id), children: Array.isArray(enumOptions) &&
 	                    enumOptions.map((option, index) => {
 	                        const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-	                        const radio = (jsxRuntimeExports.jsx(FormControlLabel, { control: jsxRuntimeExports.jsx(Radio, { name: htmlName || id, id: optionId(id, index), color: 'primary' }), label: option.label, value: String(index), disabled: disabled || itemDisabled || readonly }, index));
+	                        const radio = (reactExports.createElement(FormControlLabel, { ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.formControlLabel, control: jsxRuntimeExports.jsx(Radio, { ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.radio, name: htmlName || id, id: optionId(id, index), color: 'primary' }), label: option.label, value: enumOptionValueEncoder(option.value, index, optionValueFormat), key: index, disabled: disabled || itemDisabled || readonly }));
 	                        return radio;
 	                    }) })] }));
 	}
@@ -44814,7 +45147,8 @@ export default theme;`;
 	    };
 	    const _onBlur = ({ target }) => onBlur(id, target && target.value);
 	    const _onFocus = ({ target }) => onFocus(id, target && target.value);
-	    return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [labelValue(jsxRuntimeExports.jsx(FormLabel, { required: required, htmlFor: id, children: label || undefined }), hideLabel), jsxRuntimeExports.jsx(Slider, { disabled: disabled || readonly, onChange: _onChange, onBlur: _onBlur, onFocus: _onFocus, valueLabelDisplay: 'auto', ...sliderProps, "aria-describedby": ariaDescribedByIds(id) })] }));
+	    const { rjsfSlotProps: muiSlotProps, ...otherMuiProps } = getMuiProps(options);
+	    return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [labelValue(jsxRuntimeExports.jsx(FormLabel, { required: required, htmlFor: id, children: label || undefined }), hideLabel), jsxRuntimeExports.jsx(Slider, { disabled: disabled || readonly, onChange: _onChange, onBlur: _onBlur, onFocus: _onFocus, valueLabelDisplay: 'auto', ...otherMuiProps, ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.slider, ...sliderProps, "aria-describedby": ariaDescribedByIds(id) })] }));
 	}
 
 	/** The `SelectWidget` is a widget for rendering dropdowns.
@@ -44822,29 +45156,35 @@ export default theme;`;
 	 *
 	 * @param props - The `WidgetProps` for this component
 	 */
-	function SelectWidget({ schema, id, name, // remove this from textFieldProps
-	htmlName, options, label, hideLabel, required, disabled, placeholder, readonly, value, multiple, autofocus, onChange, onBlur, onFocus, errorSchema, rawErrors = [], registry, uiSchema, hideError, ...textFieldProps }) {
+	function SelectWidget(props) {
+	    const { schema, id, name, // remove this from textFieldProps
+	    htmlName, options, label, hideLabel, required, disabled, placeholder, readonly, value, multiple, autofocus, onChange, onBlur, onFocus, errorSchema, rawErrors = [], registry, uiSchema, hideError, ...textFieldProps } = props;
 	    const { enumOptions, enumDisabled, emptyValue: optEmptyVal } = options;
-	    multiple = typeof multiple === 'undefined' ? false : !!multiple;
-	    const emptyValue = multiple ? [] : '';
-	    const isEmpty = typeof value === 'undefined' || (multiple && value.length < 1) || (!multiple && value === emptyValue);
-	    const _onChange = ({ target: { value } }) => onChange(enumOptionsValueForIndex(value, enumOptions, optEmptyVal));
-	    const _onBlur = ({ target }) => onBlur(id, enumOptionsValueForIndex(target && target.value, enumOptions, optEmptyVal));
-	    const _onFocus = ({ target }) => onFocus(id, enumOptionsValueForIndex(target && target.value, enumOptions, optEmptyVal));
-	    const selectedIndexes = enumOptionsIndexForValue(value, enumOptions, multiple);
+	    const optionValueFormat = getOptionValueFormat(options);
+	    const isMultiple = typeof multiple === 'undefined' ? false : !!multiple;
+	    const emptyValue = isMultiple ? [] : '';
+	    const isEmpty = typeof value === 'undefined' || (isMultiple && value.length < 1) || (!isMultiple && value === emptyValue);
+	    const _onChange = ({ target: { value } }) => onChange(enumOptionValueDecoder(value, enumOptions, optionValueFormat, optEmptyVal));
+	    const _onBlur = ({ target }) => onBlur(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, optEmptyVal));
+	    const _onFocus = ({ target }) => onFocus(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, optEmptyVal));
+	    const { rjsfSlotProps: muiSlotProps, ...otherMuiProps } = getMuiProps(options);
 	    const { InputLabelProps, SelectProps, autocomplete, ...textFieldRemainingProps } = textFieldProps;
-	    const showPlaceholderOption = !multiple && schema.default === undefined;
-	    return (jsxRuntimeExports.jsxs(TextField, { id: id, name: htmlName || id, label: labelValue(label || undefined, hideLabel, undefined), value: !isEmpty && typeof selectedIndexes !== 'undefined' ? selectedIndexes : emptyValue, required: required, disabled: disabled || readonly, autoFocus: autofocus, autoComplete: autocomplete, placeholder: placeholder, error: rawErrors.length > 0, onChange: _onChange, onBlur: _onBlur, onFocus: _onFocus, ...textFieldRemainingProps, select // Apply this and the following props after the potential overrides defined in textFieldProps
-	        : true, InputLabelProps: {
-	            ...InputLabelProps,
-	            shrink: !isEmpty,
-	        }, SelectProps: {
-	            ...SelectProps,
-	            multiple,
+	    const showPlaceholderOption = !isMultiple && schema.default === undefined;
+	    return (jsxRuntimeExports.jsxs(TextField, { id: id, name: htmlName || id, label: labelValue(label || undefined, hideLabel, undefined), value: enumOptionSelectedValue(value, enumOptions, isMultiple, optionValueFormat, emptyValue), required: required, disabled: disabled || readonly, autoFocus: autofocus, autoComplete: autocomplete, placeholder: placeholder, error: rawErrors.length > 0, onChange: _onChange, onBlur: _onBlur, onFocus: _onFocus, ...{ ...otherMuiProps, ...textFieldRemainingProps }, select // Apply this and the following props after the potential overrides defined in textFieldProps
+	        : true, slotProps: {
+	            ...muiSlotProps,
+	            inputLabel: {
+	                ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.inputLabel,
+	                shrink: !isEmpty,
+	            },
+	            select: {
+	                ...muiSlotProps === null || muiSlotProps === void 0 ? void 0 : muiSlotProps.select,
+	                multiple,
+	            },
 	        }, "aria-describedby": ariaDescribedByIds(id), children: [showPlaceholderOption && jsxRuntimeExports.jsx(MenuItem, { value: '', children: placeholder }), Array.isArray(enumOptions) &&
 	                enumOptions.map(({ value, label }, i) => {
 	                    const disabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(value) !== -1;
-	                    return (jsxRuntimeExports.jsx(MenuItem, { value: String(i), disabled: disabled, children: label }, i));
+	                    return (jsxRuntimeExports.jsx(MenuItem, { value: enumOptionValueEncoder(value, i, optionValueFormat), disabled: disabled, children: label }, i));
 	                })] }));
 	}