@rjsf/core 6.6.2 → 6.7.1

package/dist/index.esm.js

@@ -1,16 +1,16 @@
 // src/components/Form.tsx
-import { Component as Component3, createRef } from "react";
+import { Component, createRef } from "react";
 import {
   createSchemaUtils,
-  deepEquals as deepEquals2,
+  deepEquals as deepEquals3,
   ErrorSchemaBuilder,
   getChangedFields,
-  getTemplate as getTemplate28,
-  getUiOptions as getUiOptions21,
-  hashObject as hashObject5,
+  getTemplate as getTemplate29,
+  getUiOptions as getUiOptions23,
+  hashObject as hashObject6,
   isObject as isObject6,
   mergeObjects,
-  shouldRender as shouldRender2,
+  shouldRender,
   SUBMIT_BTN_OPTIONS_KEY,
   toErrorList,
   toFieldPathId as toFieldPathId6,
@@ -21,7 +21,7 @@ import {
   DEFAULT_ID_SEPARATOR as DEFAULT_ID_SEPARATOR2,
   DEFAULT_ID_PREFIX as DEFAULT_ID_PREFIX2,
   ERRORS_KEY as ERRORS_KEY3,
-  ID_KEY as ID_KEY5,
+  ID_KEY as ID_KEY6,
   getUsedFormData,
   getFieldNames,
   ANY_OF_KEY as ANY_OF_KEY6,
@@ -962,17 +962,49 @@ function BooleanField(props) {
 }
 var BooleanField_default = BooleanField;
 
+// src/components/fields/CyclicSchemaField.tsx
+import { useState as useState2 } from "react";
+import { getTemplate as getTemplate2, getUiOptions as getUiOptions3, RJSF_REF_CYCLE_KEY } from "@rjsf/utils";
+import { jsx as jsx3 } from "react/jsx-runtime";
+function CyclicSchemaField(props) {
+  const [expanded, setExpanded] = useState2(false);
+  const { name, registry, schema, uiSchema, fieldPathId } = props;
+  const { globalUiOptions } = registry;
+  const uiOptions = getUiOptions3(uiSchema, globalUiOptions);
+  const CyclicSchemaExpandTemplate2 = getTemplate2(
+    "CyclicSchemaExpandTemplate",
+    registry,
+    uiOptions
+  );
+  if (!expanded) {
+    return /* @__PURE__ */ jsx3(
+      CyclicSchemaExpandTemplate2,
+      {
+        registry,
+        schema,
+        uiSchema,
+        name,
+        fieldPathId,
+        onExpand: () => setExpanded(true)
+      }
+    );
+  }
+  const { fields: fields2 } = registry;
+  const { SchemaField: SchemaField2 } = fields2;
+  return /* @__PURE__ */ jsx3(SchemaField2, { ...props, schema: { ...schema, [RJSF_REF_CYCLE_KEY]: false } });
+}
+
 // src/components/fields/FallbackField.tsx
-import { useMemo as useMemo2, useState as useState2 } from "react";
+import { useMemo as useMemo2, useState as useState3 } from "react";
 import {
-  getTemplate as getTemplate2,
-  getUiOptions as getUiOptions3,
+  getTemplate as getTemplate3,
+  getUiOptions as getUiOptions4,
   hashObject as hashObject2,
   toFieldPathId as toFieldPathId2,
   TranslatableString as TranslatableString3,
   useDeepCompareMemo as useDeepCompareMemo2
 } from "@rjsf/utils";
-import { jsx as jsx3 } from "react/jsx-runtime";
+import { jsx as jsx4 } from "react/jsx-runtime";
 function getFallbackTypeSelectionSchema(title) {
   return {
     type: "string",
@@ -1024,8 +1056,8 @@ function FallbackField(props) {
     errorSchema
   } = props;
   const { translateString, fields: fields2, globalFormOptions } = registry;
-  const [type, setType] = useState2(getTypeOfFormData(formData));
-  const uiOptions = getUiOptions3(uiSchema);
+  const [type, setType] = useState3(getTypeOfFormData(formData));
+  const uiOptions = getUiOptions4(uiSchema);
   const typeSelectorInnerFieldPathId = useDeepCompareMemo2(
     toFieldPathId2("__internal_type_selector", globalFormOptions, fieldPathId)
   );
@@ -1039,25 +1071,25 @@ function FallbackField(props) {
   };
   if (!globalFormOptions.useFallbackUiForUnsupportedType) {
     const { reason = translateString(TranslatableString3.UnknownFieldType, [String(schema.type)]) } = props;
-    const UnsupportedFieldTemplate = getTemplate2(
+    const UnsupportedFieldTemplate = getTemplate3(
       "UnsupportedFieldTemplate",
       registry,
       uiOptions
     );
-    return /* @__PURE__ */ jsx3(UnsupportedFieldTemplate, { schema, fieldPathId, reason, registry });
+    return /* @__PURE__ */ jsx4(UnsupportedFieldTemplate, { schema, fieldPathId, reason, registry });
   }
-  const FallbackFieldTemplate2 = getTemplate2(
+  const FallbackFieldTemplate2 = getTemplate3(
     "FallbackFieldTemplate",
     registry,
     uiOptions
   );
   const { SchemaField: SchemaField2 } = fields2;
-  return /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsx4(
     FallbackFieldTemplate2,
     {
       schema,
       registry,
-      typeSelector: /* @__PURE__ */ jsx3(
+      typeSelector: /* @__PURE__ */ jsx4(
         SchemaField2,
         {
           fieldPathId: typeSelectorInnerFieldPathId,
@@ -1075,7 +1107,7 @@ function FallbackField(props) {
         },
         formData ? hashObject2(formData) : "__empty__"
       ),
-      schemaField: /* @__PURE__ */ jsx3(
+      schemaField: /* @__PURE__ */ jsx4(
         SchemaField2,
         {
           ...props,
@@ -1094,9 +1126,9 @@ function FallbackField(props) {
 import {
   ANY_OF_KEY,
   getDiscriminatorFieldFromSchema,
-  getTemplate as getTemplate3,
+  getTemplate as getTemplate4,
   getTestIds,
-  getUiOptions as getUiOptions4,
+  getUiOptions as getUiOptions5,
   hashObject as hashObject3,
   ID_KEY as ID_KEY2,
   lookupFromFormContext,
@@ -1124,7 +1156,7 @@ import isString from "lodash/isString";
 import isUndefined from "lodash/isUndefined";
 import last from "lodash/last";
 import set2 from "lodash/set";
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { jsx as jsx5 } from "react/jsx-runtime";
 import { createElement } from "react";
 var LOOKUP_REGEX = /^\$lookup=(.+)/;
 var LAYOUT_GRID_UI_OPTION = "layoutGrid";
@@ -1147,7 +1179,7 @@ function computeFieldUiSchema(field, uiProps, uiSchema, schemaReadonly, forceRea
   if (!isEmpty(globalUiOptions)) {
     set2(fieldUiSchema, [UI_GLOBAL_OPTIONS_KEY], globalUiOptions);
   }
-  let { readonly: uiReadonly } = getUiOptions4(fieldUiSchema);
+  let { readonly: uiReadonly } = getUiOptions5(fieldUiSchema);
   if (forceReadonly === true || isUndefined(uiReadonly) && schemaReadonly === true) {
     uiReadonly = true;
     if (has(localUiOptions, READONLY_KEY)) {
@@ -1302,7 +1334,7 @@ function computeUIComponentPropsFromGridSchema(registry, gridSchema) {
     }
     UIComponent = getCustomRenderComponent(render, registry);
     if (!innerName && UIComponent) {
-      rendered = /* @__PURE__ */ jsx4(UIComponent, { ...innerProps, "data-testid": LAYOUT_GRID_FIELD_TEST_IDS.uiComponent });
+      rendered = /* @__PURE__ */ jsx5(UIComponent, { ...innerProps, "data-testid": LAYOUT_GRID_FIELD_TEST_IDS.uiComponent });
     }
   }
   return { name, UIComponent, uiProps, rendered };
@@ -1329,7 +1361,7 @@ function LayoutGridCondition(props) {
   const { operator, field = "", value } = gridProps;
   const fieldData = get(formData, field, null);
   if (conditionMatches(operator, fieldData, value)) {
-    return /* @__PURE__ */ jsx4(LayoutGridFieldChildren, { ...layoutGridFieldProps, childrenLayoutGridSchemaId: children });
+    return /* @__PURE__ */ jsx5(LayoutGridFieldChildren, { ...layoutGridFieldProps, childrenLayoutGridSchemaId: children });
   }
   return null;
 }
@@ -1337,23 +1369,23 @@ function LayoutGridCol(props) {
   const { layoutGridSchema, ...layoutGridFieldProps } = props;
   const { registry, uiSchema } = layoutGridFieldProps;
   const { children, gridProps } = findChildrenAndProps(layoutGridSchema, "ui:col" /* COLUMN */, registry);
-  const uiOptions = getUiOptions4(uiSchema);
-  const GridTemplate2 = getTemplate3("GridTemplate", registry, uiOptions);
-  return /* @__PURE__ */ jsx4(GridTemplate2, { column: true, "data-testid": LAYOUT_GRID_FIELD_TEST_IDS.col, ...gridProps, children: /* @__PURE__ */ jsx4(LayoutGridFieldChildren, { ...layoutGridFieldProps, childrenLayoutGridSchemaId: children }) });
+  const uiOptions = getUiOptions5(uiSchema);
+  const GridTemplate2 = getTemplate4("GridTemplate", registry, uiOptions);
+  return /* @__PURE__ */ jsx5(GridTemplate2, { column: true, "data-testid": LAYOUT_GRID_FIELD_TEST_IDS.col, ...gridProps, children: /* @__PURE__ */ jsx5(LayoutGridFieldChildren, { ...layoutGridFieldProps, childrenLayoutGridSchemaId: children }) });
 }
 function LayoutGridColumns(props) {
   const { layoutGridSchema, ...layoutGridFieldProps } = props;
   const { registry, uiSchema } = layoutGridFieldProps;
   const { children, gridProps } = findChildrenAndProps(layoutGridSchema, "ui:columns" /* COLUMNS */, registry);
-  const uiOptions = getUiOptions4(uiSchema);
-  const GridTemplate2 = getTemplate3("GridTemplate", registry, uiOptions);
-  return children.map((child) => /* @__PURE__ */ jsx4(
+  const uiOptions = getUiOptions5(uiSchema);
+  const GridTemplate2 = getTemplate4("GridTemplate", registry, uiOptions);
+  return children.map((child) => /* @__PURE__ */ jsx5(
     GridTemplate2,
     {
       column: true,
       "data-testid": LAYOUT_GRID_FIELD_TEST_IDS.col,
       ...gridProps,
-      children: /* @__PURE__ */ jsx4(LayoutGridFieldChildren, { ...layoutGridFieldProps, childrenLayoutGridSchemaId: [child] })
+      children: /* @__PURE__ */ jsx5(LayoutGridFieldChildren, { ...layoutGridFieldProps, childrenLayoutGridSchemaId: [child] })
     },
     `column-${hashObject3(child)}`
   ));
@@ -1362,9 +1394,9 @@ function LayoutGridRow(props) {
   const { layoutGridSchema, ...layoutGridFieldProps } = props;
   const { registry, uiSchema } = layoutGridFieldProps;
   const { children, gridProps } = findChildrenAndProps(layoutGridSchema, "ui:row" /* ROW */, registry);
-  const uiOptions = getUiOptions4(uiSchema);
-  const GridTemplate2 = getTemplate3("GridTemplate", registry, uiOptions);
-  return /* @__PURE__ */ jsx4(GridTemplate2, { ...gridProps, "data-testid": LAYOUT_GRID_FIELD_TEST_IDS.row, children: /* @__PURE__ */ jsx4(LayoutGridFieldChildren, { ...layoutGridFieldProps, childrenLayoutGridSchemaId: children }) });
+  const uiOptions = getUiOptions5(uiSchema);
+  const GridTemplate2 = getTemplate4("GridTemplate", registry, uiOptions);
+  return /* @__PURE__ */ jsx5(GridTemplate2, { ...gridProps, "data-testid": LAYOUT_GRID_FIELD_TEST_IDS.row, children: /* @__PURE__ */ jsx5(LayoutGridFieldChildren, { ...layoutGridFieldProps, childrenLayoutGridSchemaId: children }) });
 }
 function LayoutGridFieldComponent(props) {
   const {
@@ -1401,7 +1433,7 @@ function LayoutGridFieldComponent(props) {
   if (schema) {
     const Field = optionsInfo?.hasDiscriminator ? LayoutMultiSchemaField2 : SchemaField2;
     const { fieldUiSchema, uiReadonly } = computeFieldUiSchema(name, uiProps, uiSchema, isReadonly, readonly);
-    return /* @__PURE__ */ jsx4(
+    return /* @__PURE__ */ jsx5(
       Field,
       {
         "data-testid": optionsInfo?.hasDiscriminator ? LAYOUT_GRID_FIELD_TEST_IDS.layoutMultiSchemaField : LAYOUT_GRID_FIELD_TEST_IDS.field,
@@ -1423,7 +1455,7 @@ function LayoutGridFieldComponent(props) {
     );
   }
   if (UIComponent) {
-    return /* @__PURE__ */ jsx4(
+    return /* @__PURE__ */ jsx5(
       UIComponent,
       {
         "data-testid": LAYOUT_GRID_FIELD_TEST_IDS.uiComponent,
@@ -1448,46 +1480,46 @@ function LayoutGridFieldComponent(props) {
 function LayoutGridField(props) {
   const { uiSchema } = props;
   let { layoutGridSchema } = props;
-  const uiOptions = getUiOptions4(uiSchema);
+  const uiOptions = getUiOptions5(uiSchema);
   if (!layoutGridSchema && LAYOUT_GRID_UI_OPTION in uiOptions && isObject3(uiOptions[LAYOUT_GRID_UI_OPTION])) {
     layoutGridSchema = uiOptions[LAYOUT_GRID_UI_OPTION];
   }
   if (isObject3(layoutGridSchema)) {
     if ("ui:row" /* ROW */ in layoutGridSchema) {
-      return /* @__PURE__ */ jsx4(LayoutGridRow, { ...props, layoutGridSchema });
+      return /* @__PURE__ */ jsx5(LayoutGridRow, { ...props, layoutGridSchema });
     }
     if ("ui:col" /* COLUMN */ in layoutGridSchema) {
-      return /* @__PURE__ */ jsx4(LayoutGridCol, { ...props, layoutGridSchema });
+      return /* @__PURE__ */ jsx5(LayoutGridCol, { ...props, layoutGridSchema });
     }
     if ("ui:columns" /* COLUMNS */ in layoutGridSchema) {
-      return /* @__PURE__ */ jsx4(LayoutGridColumns, { ...props, layoutGridSchema });
+      return /* @__PURE__ */ jsx5(LayoutGridColumns, { ...props, layoutGridSchema });
     }
     if ("ui:condition" /* CONDITION */ in layoutGridSchema) {
-      return /* @__PURE__ */ jsx4(LayoutGridCondition, { ...props, layoutGridSchema });
+      return /* @__PURE__ */ jsx5(LayoutGridCondition, { ...props, layoutGridSchema });
     }
   }
-  return /* @__PURE__ */ jsx4(LayoutGridFieldComponent, { ...props, gridSchema: layoutGridSchema });
+  return /* @__PURE__ */ jsx5(LayoutGridFieldComponent, { ...props, gridSchema: layoutGridSchema });
 }
 LayoutGridField.TEST_IDS = LAYOUT_GRID_FIELD_TEST_IDS;
 
 // src/components/fields/LayoutHeaderField.tsx
-import { getTemplate as getTemplate4, getUiOptions as getUiOptions5, titleId } from "@rjsf/utils";
-import { jsx as jsx5 } from "react/jsx-runtime";
+import { getTemplate as getTemplate5, getUiOptions as getUiOptions6, titleId } from "@rjsf/utils";
+import { jsx as jsx6 } from "react/jsx-runtime";
 function LayoutHeaderField(props) {
   const { fieldPathId, title, schema, uiSchema, required, registry, name } = props;
-  const options = getUiOptions5(uiSchema, registry.globalUiOptions);
+  const options = getUiOptions6(uiSchema, registry.globalUiOptions);
   const { title: uiTitle } = options;
   const { title: schemaTitle } = schema;
   const fieldTitle = uiTitle || title || schemaTitle || name;
   if (!fieldTitle) {
     return null;
   }
-  const TitleFieldTemplate = getTemplate4(
+  const TitleFieldTemplate = getTemplate5(
     "TitleFieldTemplate",
     registry,
     options
   );
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx6(
     TitleFieldTemplate,
     {
       id: titleId(fieldPathId),
@@ -1501,7 +1533,7 @@ function LayoutHeaderField(props) {
 }
 
 // src/components/fields/LayoutMultiSchemaField.tsx
-import { useState as useState3, useEffect } from "react";
+import { useState as useState4, useEffect } from "react";
 import {
   ANY_OF_KEY as ANY_OF_KEY2,
   CONST_KEY,
@@ -1513,8 +1545,8 @@ import {
   ONE_OF_KEY as ONE_OF_KEY2,
   optionsList as optionsList3,
   PROPERTIES_KEY as PROPERTIES_KEY2,
-  getTemplate as getTemplate5,
-  getUiOptions as getUiOptions6,
+  getTemplate as getTemplate6,
+  getUiOptions as getUiOptions7,
   getWidget as getWidget3
 } from "@rjsf/utils";
 import get2 from "lodash/get";
@@ -1523,7 +1555,7 @@ import isEmpty2 from "lodash/isEmpty";
 import noop from "lodash/noop";
 import omit from "lodash/omit";
 import set3 from "lodash/set";
-import { jsx as jsx6 } from "react/jsx-runtime";
+import { jsx as jsx7 } from "react/jsx-runtime";
 function getSelectedOption(options, selectorField, value) {
   const defaultValue = "!@#!@$@#$!@$#";
   const schemaOptions = options.map(({ schema }) => schema);
@@ -1568,11 +1600,11 @@ function LayoutMultiSchemaField(props) {
     hideError = false
   } = props;
   const { widgets: widgets2, schemaUtils, globalUiOptions } = registry;
-  const [enumOptions, setEnumOptions] = useState3(computeEnumOptions(schema, options, schemaUtils, uiSchema, formData));
+  const [enumOptions, setEnumOptions] = useState4(computeEnumOptions(schema, options, schemaUtils, uiSchema, formData));
   const id = get2(fieldPathId, ID_KEY3);
   const discriminator = getDiscriminatorFieldFromSchema2(schema);
-  const FieldErrorTemplate2 = getTemplate5("FieldErrorTemplate", registry, options);
-  const FieldTemplate2 = getTemplate5("FieldTemplate", registry, options);
+  const FieldErrorTemplate2 = getTemplate6("FieldErrorTemplate", registry, options);
+  const FieldTemplate2 = getTemplate6("FieldTemplate", registry, options);
   const schemaHash = hashObject4(schema);
   const optionsHash = hashObject4(options);
   const uiSchemaHash = uiSchema ? hashObject4(uiSchema) : "";
@@ -1587,7 +1619,7 @@ function LayoutMultiSchemaField(props) {
     optionsSchemaSelector: selectorField = discriminator,
     hideError: uiSchemaHideError,
     ...uiOptions
-  } = getUiOptions6(uiSchema);
+  } = getUiOptions7(uiSchema);
   if (!selectorField) {
     throw new Error("No selector field provided for the LayoutMultiSchemaField");
   }
@@ -1616,8 +1648,8 @@ function LayoutMultiSchemaField(props) {
     onChange(newFormData, fieldPathId.path, void 0, id);
   };
   const widgetOptions = { enumOptions, ...uiOptions };
-  const errors = !hideFieldError && rawErrors.length > 0 ? /* @__PURE__ */ jsx6(FieldErrorTemplate2, { fieldPathId, schema, errors: rawErrors, registry }) : void 0;
-  return /* @__PURE__ */ jsx6(
+  const errors = !hideFieldError && rawErrors.length > 0 ? /* @__PURE__ */ jsx7(FieldErrorTemplate2, { fieldPathId, schema, errors: rawErrors, registry }) : void 0;
+  return /* @__PURE__ */ jsx7(
     FieldTemplate2,
     {
       fieldPathId,
@@ -1635,7 +1667,7 @@ function LayoutMultiSchemaField(props) {
       onKeyRename: noop,
       onKeyRenameBlur: noop,
       onRemoveProperty: noop,
-      children: /* @__PURE__ */ jsx6(
+      children: /* @__PURE__ */ jsx7(
         Widget,
         {
           id,
@@ -1667,15 +1699,16 @@ function LayoutMultiSchemaField(props) {
 }
 
 // src/components/fields/MultiSchemaField.tsx
-import { Component } from "react";
+import { useCallback as useCallback3, useEffect as useEffect2, useMemo as useMemo3, useRef as useRef2, useState as useState5 } from "react";
 import {
   ANY_OF_KEY as ANY_OF_KEY3,
   deepEquals,
   ERRORS_KEY as ERRORS_KEY2,
   getDiscriminatorFieldFromSchema as getDiscriminatorFieldFromSchema3,
-  getTemplate as getTemplate6,
-  getUiOptions as getUiOptions7,
+  getTemplate as getTemplate7,
+  getUiOptions as getUiOptions8,
   getWidget as getWidget4,
+  hashObject as hashObject5,
   isFormDataAvailable as isFormDataAvailable2,
   mergeSchemas,
   ONE_OF_KEY as ONE_OF_KEY3,
@@ -1685,225 +1718,187 @@ import {
 import get3 from "lodash/get";
 import isEmpty3 from "lodash/isEmpty";
 import omit2 from "lodash/omit";
-import { jsx as jsx7 } from "react/jsx-runtime";
-var AnyOfField = class extends Component {
-  /** Flag to skip the formData-change-driven option recalculation when the user just selected an option.
-   * Set to true in the setState callback of onOptionChange (after onChange is called), consumed and reset in
-   * componentDidUpdate. This prevents the matching-option recalculation from overriding a user's explicit choice
-   * when getDefaultFormState populates undefined properties that make deepEquals see a false formData change.
-   */
-  skipNextOptionRecalculation = false;
-  /** Constructs an `AnyOfField` with the given `props` to initialize the initially selected option in state
-   *
-   * @param props - The `FieldProps` for this template
-   */
-  constructor(props) {
-    super(props);
-    const {
-      formData,
-      options,
-      registry: { schemaUtils }
-    } = this.props;
-    const retrievedOptions = options.map((opt) => schemaUtils.retrieveSchema(opt, formData));
-    this.state = {
-      retrievedOptions,
-      selectedOption: this.getMatchingOption(0, formData, retrievedOptions)
-    };
-  }
-  /** React lifecycle method that is called when the props and/or state for this component is updated. It recomputes the
-   * currently selected option based on the overall `formData`
-   *
-   * @param prevProps - The previous `FieldProps` for this template
-   * @param prevState - The previous `AnyOfFieldState` for this template
-   */
-  componentDidUpdate(prevProps, prevState) {
-    const { formData, options, fieldPathId } = this.props;
-    const { selectedOption } = this.state;
-    let newState = this.state;
-    if (!deepEquals(prevProps.options, options)) {
-      const {
-        registry: { schemaUtils }
-      } = this.props;
-      const retrievedOptions = options.map((opt) => schemaUtils.retrieveSchema(opt, formData));
-      newState = { selectedOption, retrievedOptions };
+import { jsx as jsx8 } from "react/jsx-runtime";
+function AnyOfField(props) {
+  const {
+    name,
+    disabled = false,
+    errorSchema = {},
+    formData,
+    fieldPathId,
+    onBlur,
+    onChange,
+    onFocus,
+    options,
+    readonly,
+    registry,
+    required = false,
+    schema,
+    uiSchema
+  } = props;
+  const { schemaUtils } = registry;
+  const formDataHash = hashObject5(formData ?? null);
+  const retrievedOptions = useMemo3(
+    () => options.map((opt) => schemaUtils.retrieveSchema(opt, formData)),
+    // oxlint-disable-next-line react-hooks/exhaustive-deps -- formDataHash is the value-stable proxy for formData
+    [options, schemaUtils, formDataHash]
+  );
+  const [selectedOption, setSelectedOption] = useState5(() => {
+    const discriminator = getDiscriminatorFieldFromSchema3(schema);
+    return schemaUtils.getClosestMatchingOption(formData, retrievedOptions, 0, discriminator);
+  });
+  const skipNextOptionRecalculation = useRef2(false);
+  const prevFormDataRef = useRef2(formData);
+  const prevFieldIdRef = useRef2(fieldPathId.$id);
+  useEffect2(() => {
+    const prevFormData = prevFormDataRef.current;
+    const prevFieldId = prevFieldIdRef.current;
+    prevFormDataRef.current = formData;
+    prevFieldIdRef.current = fieldPathId.$id;
+    if (!deepEquals(formData, prevFormData) && fieldPathId.$id === prevFieldId) {
+      if (skipNextOptionRecalculation.current) {
+        skipNextOptionRecalculation.current = false;
+        return;
+      }
+      const discriminator = getDiscriminatorFieldFromSchema3(schema);
+      const matchingOption = schemaUtils.getClosestMatchingOption(
+        formData,
+        retrievedOptions,
+        selectedOption,
+        discriminator
+      );
+      if (matchingOption !== selectedOption) {
+        setSelectedOption(matchingOption);
+      }
     }
-    if (!deepEquals(formData, prevProps.formData) && fieldPathId.$id === prevProps.fieldPathId.$id) {
-      if (this.skipNextOptionRecalculation) {
-        this.skipNextOptionRecalculation = false;
-      } else {
-        const { retrievedOptions } = newState;
-        const matchingOption = this.getMatchingOption(selectedOption, formData, retrievedOptions);
-        if (prevState && matchingOption !== selectedOption) {
-          newState = { selectedOption: matchingOption, retrievedOptions };
-        }
+  });
+  const fieldId = `${fieldPathId.$id}${schema.oneOf ? "__oneof_select" : "__anyof_select"}`;
+  const onOptionChange = useCallback3(
+    (option2) => {
+      if (disabled || readonly) {
+        return;
       }
+      const intOption = option2 !== void 0 ? parseInt(option2, 10) : -1;
+      if (intOption === selectedOption) {
+        return;
+      }
+      const newOption = intOption >= 0 ? retrievedOptions[intOption] : void 0;
+      const oldOption = selectedOption >= 0 ? retrievedOptions[selectedOption] : void 0;
+      let newFormData = schemaUtils.sanitizeDataForNewSchema(newOption, oldOption, formData);
+      if (newOption) {
+        newFormData = schemaUtils.getDefaultFormState(newOption, newFormData, "excludeObjectChildren");
+      }
+      setSelectedOption(intOption);
+      skipNextOptionRecalculation.current = true;
+      onChange(newFormData, fieldPathId.path, void 0, fieldId);
+    },
+    // setSelectedOption is stable (guaranteed by useState); skipNextOptionRecalculation is a ref
+    [selectedOption, retrievedOptions, disabled, readonly, schemaUtils, formData, fieldPathId, onChange, fieldId]
+  );
+  const { widgets: widgets2, fields: fields2, translateString, globalUiOptions } = registry;
+  const { SchemaField: SchemaFieldComponent } = fields2;
+  const MultiSchemaFieldTemplate2 = getTemplate7(
+    "MultiSchemaFieldTemplate",
+    registry,
+    globalUiOptions
+  );
+  const isOptionalRender = shouldRenderOptionalField2(registry, schema, required, uiSchema);
+  const hasFormData = isFormDataAvailable2(formData);
+  const {
+    widget = "select",
+    placeholder,
+    autofocus,
+    autocomplete,
+    title = schema.title,
+    ...uiOptions
+  } = getUiOptions8(uiSchema, globalUiOptions);
+  const Widget = getWidget4({ type: "number" }, widget, widgets2);
+  const rawErrors = get3(errorSchema, ERRORS_KEY2, []);
+  const fieldErrorSchema = omit2(errorSchema, [ERRORS_KEY2]);
+  const displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema, globalUiOptions);
+  const option = selectedOption >= 0 ? retrievedOptions[selectedOption] || null : null;
+  let optionSchema;
+  if (option) {
+    const { required: schemaRequired, type: schemaType } = schema;
+    const parentProps = {};
+    if (schemaRequired) {
+      parentProps.required = schemaRequired;
     }
-    if (newState !== this.state) {
-      this.setState(newState);
+    if (schemaType !== void 0 && !("type" in option)) {
+      parentProps.type = schemaType;
     }
+    optionSchema = Object.keys(parentProps).length > 0 ? mergeSchemas(parentProps, option) : option;
   }
-  /** Determines the best matching option for the given `formData` and `options`.
-   *
-   * @param formData - The new formData
-   * @param options - The list of options to choose from
-   * @return - The index of the `option` that best matches the `formData`
-   */
-  getMatchingOption(selectedOption, formData, options) {
-    const {
-      schema,
-      registry: { schemaUtils }
-    } = this.props;
-    const discriminator = getDiscriminatorFieldFromSchema3(schema);
-    const option = schemaUtils.getClosestMatchingOption(formData, options, selectedOption, discriminator);
-    return option;
-  }
-  /** Callback handler to remember what the currently selected option is. In addition to that the `formData` is updated
-   * to remove properties that are not part of the newly selected option schema, and then the updated data is passed to
-   * the `onChange` handler.
-   *
-   * @param option - The new option value being selected
-   */
-  onOptionChange = (option) => {
-    const { selectedOption, retrievedOptions } = this.state;
-    const { disabled = false, formData, onChange, readonly = false, registry, fieldPathId } = this.props;
-    if (disabled || readonly) {
-      return;
-    }
-    const { schemaUtils } = registry;
-    const intOption = option !== void 0 ? parseInt(option, 10) : -1;
-    if (intOption === selectedOption) {
-      return;
+  let optionsUiSchema = [];
+  if (ONE_OF_KEY3 in schema && uiSchema && ONE_OF_KEY3 in uiSchema) {
+    if (Array.isArray(uiSchema[ONE_OF_KEY3])) {
+      optionsUiSchema = uiSchema[ONE_OF_KEY3];
+    } else {
+      console.warn(`uiSchema.oneOf is not an array for "${title || name}"`);
     }
-    const newOption = intOption >= 0 ? retrievedOptions[intOption] : void 0;
-    const oldOption = selectedOption >= 0 ? retrievedOptions[selectedOption] : void 0;
-    let newFormData = schemaUtils.sanitizeDataForNewSchema(newOption, oldOption, formData);
-    if (newOption) {
-      newFormData = schemaUtils.getDefaultFormState(newOption, newFormData, "excludeObjectChildren");
+  } else if (ANY_OF_KEY3 in schema && uiSchema && ANY_OF_KEY3 in uiSchema) {
+    if (Array.isArray(uiSchema[ANY_OF_KEY3])) {
+      optionsUiSchema = uiSchema[ANY_OF_KEY3];
+    } else {
+      console.warn(`uiSchema.anyOf is not an array for "${title || name}"`);
     }
-    this.setState({ selectedOption: intOption }, () => {
-      this.skipNextOptionRecalculation = true;
-      onChange(newFormData, fieldPathId.path, void 0, this.getFieldId());
-    });
-  };
-  getFieldId() {
-    const { fieldPathId, schema } = this.props;
-    return `${fieldPathId.$id}${schema.oneOf ? "__oneof_select" : "__anyof_select"}`;
   }
-  /** Renders the `AnyOfField` selector along with a `SchemaField` for the value of the `formData`
-   */
-  render() {
-    const {
-      name,
-      disabled = false,
-      errorSchema = {},
-      formData,
+  let optionUiSchema = uiSchema;
+  if (selectedOption >= 0 && optionsUiSchema.length > selectedOption) {
+    optionUiSchema = optionsUiSchema[selectedOption];
+  }
+  const translateEnum = title ? TranslatableString4.TitleOptionPrefix : TranslatableString4.OptionPrefix;
+  const translateParams = title ? [title] : [];
+  const enumOptions = retrievedOptions.map((opt, index) => {
+    const { title: uiTitle = opt.title } = getUiOptions8(optionsUiSchema[index]);
+    return {
+      label: uiTitle || translateString(translateEnum, translateParams.concat(String(index + 1))),
+      value: index
+    };
+  });
+  const selector = !isOptionalRender || hasFormData ? /* @__PURE__ */ jsx8(
+    Widget,
+    {
+      id: fieldId,
+      name: `${name}${schema.oneOf ? "__oneof_select" : "__anyof_select"}`,
+      schema: { type: "number", default: 0 },
+      onChange: onOptionChange,
       onBlur,
       onFocus,
-      readonly,
-      required = false,
-      registry,
-      schema,
-      uiSchema
-    } = this.props;
-    const { widgets: widgets2, fields: fields2, translateString, globalUiOptions, schemaUtils } = registry;
-    const { SchemaField: SchemaFieldComponent } = fields2;
-    const MultiSchemaFieldTemplate2 = getTemplate6(
-      "MultiSchemaFieldTemplate",
+      disabled: disabled || isEmpty3(enumOptions),
+      multiple: false,
+      rawErrors,
+      errorSchema: fieldErrorSchema,
+      value: selectedOption >= 0 ? selectedOption : void 0,
+      options: { enumOptions, ...uiOptions },
       registry,
-      globalUiOptions
-    );
-    const isOptionalRender = shouldRenderOptionalField2(registry, schema, required, uiSchema);
-    const hasFormData = isFormDataAvailable2(formData);
-    const { selectedOption, retrievedOptions } = this.state;
-    const {
-      widget = "select",
       placeholder,
-      autofocus,
       autocomplete,
-      title = schema.title,
-      ...uiOptions
-    } = getUiOptions7(uiSchema, globalUiOptions);
-    const Widget = getWidget4({ type: "number" }, widget, widgets2);
-    const rawErrors = get3(errorSchema, ERRORS_KEY2, []);
-    const fieldErrorSchema = omit2(errorSchema, [ERRORS_KEY2]);
-    const displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema, globalUiOptions);
-    const option = selectedOption >= 0 ? retrievedOptions[selectedOption] || null : null;
-    let optionSchema;
-    if (option) {
-      const { required: schemaRequired } = schema;
-      optionSchema = schemaRequired ? mergeSchemas({ required: schemaRequired }, option) : option;
-    }
-    let optionsUiSchema = [];
-    if (ONE_OF_KEY3 in schema && uiSchema && ONE_OF_KEY3 in uiSchema) {
-      if (Array.isArray(uiSchema[ONE_OF_KEY3])) {
-        optionsUiSchema = uiSchema[ONE_OF_KEY3];
-      } else {
-        console.warn(`uiSchema.oneOf is not an array for "${title || name}"`);
-      }
-    } else if (ANY_OF_KEY3 in schema && uiSchema && ANY_OF_KEY3 in uiSchema) {
-      if (Array.isArray(uiSchema[ANY_OF_KEY3])) {
-        optionsUiSchema = uiSchema[ANY_OF_KEY3];
-      } else {
-        console.warn(`uiSchema.anyOf is not an array for "${title || name}"`);
-      }
+      autofocus,
+      label: title ?? name,
+      hideLabel: !displayLabel,
+      readonly
     }
-    let optionUiSchema = uiSchema;
-    if (selectedOption >= 0 && optionsUiSchema.length > selectedOption) {
-      optionUiSchema = optionsUiSchema[selectedOption];
+  ) : void 0;
+  const optionsSchemaField = optionSchema && optionSchema.type !== "null" && /* @__PURE__ */ jsx8(SchemaFieldComponent, { ...props, schema: optionSchema, uiSchema: optionUiSchema }) || null;
+  return /* @__PURE__ */ jsx8(
+    MultiSchemaFieldTemplate2,
+    {
+      schema,
+      registry,
+      uiSchema,
+      selector,
+      optionSchemaField: optionsSchemaField
     }
-    const translateEnum = title ? TranslatableString4.TitleOptionPrefix : TranslatableString4.OptionPrefix;
-    const translateParams = title ? [title] : [];
-    const enumOptions = retrievedOptions.map((opt, index) => {
-      const { title: uiTitle = opt.title } = getUiOptions7(optionsUiSchema[index]);
-      return {
-        label: uiTitle || translateString(translateEnum, translateParams.concat(String(index + 1))),
-        value: index
-      };
-    });
-    const selector = !isOptionalRender || hasFormData ? /* @__PURE__ */ jsx7(
-      Widget,
-      {
-        id: this.getFieldId(),
-        name: `${name}${schema.oneOf ? "__oneof_select" : "__anyof_select"}`,
-        schema: { type: "number", default: 0 },
-        onChange: this.onOptionChange,
-        onBlur,
-        onFocus,
-        disabled: disabled || isEmpty3(enumOptions),
-        multiple: false,
-        rawErrors,
-        errorSchema: fieldErrorSchema,
-        value: selectedOption >= 0 ? selectedOption : void 0,
-        options: { enumOptions, ...uiOptions },
-        registry,
-        placeholder,
-        autocomplete,
-        autofocus,
-        label: title ?? name,
-        hideLabel: !displayLabel,
-        readonly
-      }
-    ) : void 0;
-    const optionsSchemaField = optionSchema && optionSchema.type !== "null" && /* @__PURE__ */ jsx7(SchemaFieldComponent, { ...this.props, schema: optionSchema, uiSchema: optionUiSchema }) || null;
-    return /* @__PURE__ */ jsx7(
-      MultiSchemaFieldTemplate2,
-      {
-        schema,
-        registry,
-        uiSchema,
-        selector,
-        optionSchemaField: optionsSchemaField
-      }
-    );
-  }
-};
+  );
+}
 var MultiSchemaField_default = AnyOfField;
 
 // src/components/fields/NullField.tsx
-import { useEffect as useEffect2 } from "react";
+import { useEffect as useEffect3 } from "react";
 function NullField(props) {
   const { formData, onChange, fieldPathId } = props;
-  useEffect2(() => {
+  useEffect3(() => {
     if (formData === void 0) {
       onChange(null, fieldPathId.path);
     }
@@ -1913,42 +1908,56 @@ function NullField(props) {
 var NullField_default = NullField;
 
 // src/components/fields/NumberField.tsx
-import { useState as useState4, useCallback as useCallback3 } from "react";
-import { asNumber } from "@rjsf/utils";
-import { jsx as jsx8 } from "react/jsx-runtime";
+import { useState as useState6, useCallback as useCallback4 } from "react";
+import { asNumber, getDecimalSeparator, getUiOptions as getUiOptions9, optionsList as optionsList4 } from "@rjsf/utils";
+import { jsx as jsx9 } from "react/jsx-runtime";
 var trailingCharMatcherWithPrefix = /\.([0-9]*0)*$/;
 var trailingCharMatcher = /[0.]0*$/;
 function NumberField(props) {
   const { registry, onChange, formData, value: initialValue } = props;
-  const [lastValue, setLastValue] = useState4(initialValue);
+  const [lastValue, setLastValue] = useState6(initialValue);
   const { StringField: StringField2 } = registry.fields;
+  const separator = getDecimalSeparator();
+  const escapedSeparator = separator === "." ? "\\." : separator;
   let value = formData;
-  const handleChange = useCallback3(
+  const handleChange = useCallback4(
     (newValue, path, errorSchema, id) => {
       setLastValue(newValue);
-      const normalizedValue = `${newValue}`.startsWith(".") ? `0${newValue}` : newValue;
-      const processed = typeof normalizedValue === "string" && normalizedValue.match(trailingCharMatcherWithPrefix) ? asNumber(normalizedValue.replace(trailingCharMatcher, "")) : asNumber(normalizedValue);
+      const standardValue = typeof newValue === "string" ? newValue.replace(separator, ".") : newValue;
+      const normalizedValue = `${standardValue}`.startsWith(".") ? `0${standardValue}` : standardValue;
+      const processed = typeof normalizedValue === "string" && trailingCharMatcherWithPrefix.exec(normalizedValue) ? asNumber(normalizedValue.replace(trailingCharMatcher, "")) : asNumber(normalizedValue);
       onChange(processed, path, errorSchema, id);
     },
-    [onChange]
+    [onChange, separator]
   );
   if (typeof lastValue === "string" && typeof value === "number") {
-    const re = new RegExp(`^(${String(value).replace(".", "\\.")})?\\.?0*$`);
+    const re = new RegExp(`^(${String(value).replace(".", escapedSeparator)})?${escapedSeparator}?0*$`);
     if (lastValue.match(re)) {
       value = lastValue;
     }
   }
-  return /* @__PURE__ */ jsx8(StringField2, { ...props, formData: value, onChange: handleChange });
+  let displayValue = value;
+  if (typeof value === "number" && separator !== ".") {
+    const { schema, uiSchema } = props;
+    const { schemaUtils } = registry;
+    const enumOptions = schemaUtils.isSelect(schema) ? optionsList4(schema, uiSchema) : void 0;
+    const defaultWidget = enumOptions ? "select" : "text";
+    const { widget = defaultWidget } = getUiOptions9(uiSchema);
+    if (widget !== "radio" && widget !== "select" && widget !== "hidden") {
+      displayValue = String(value).replace(".", separator);
+    }
+  }
+  return /* @__PURE__ */ jsx9(StringField2, { ...props, formData: displayValue, onChange: handleChange });
 }
 var NumberField_default = NumberField;
 
 // src/components/fields/ObjectField.tsx
-import { memo as memo2, useCallback as useCallback4, useMemo as useMemo3, useRef as useRef2, useState as useState5 } from "react";
+import { memo as memo2, useCallback as useCallback5, useMemo as useMemo4, useRef as useRef3, useState as useState7 } from "react";
 import {
   ADDITIONAL_PROPERTY_FLAG,
   ANY_OF_KEY as ANY_OF_KEY4,
-  getTemplate as getTemplate7,
-  getUiOptions as getUiOptions8,
+  getTemplate as getTemplate8,
+  getUiOptions as getUiOptions10,
   isFormDataAvailable as isFormDataAvailable3,
   orderProperties,
   shouldRenderOptionalField as shouldRenderOptionalField3,
@@ -1970,7 +1979,7 @@ var ADDITIONAL_PROPERTY_KEY_REMOVE = /* @__PURE__ */ Symbol("remove-this-key");
 var IS_RESET = /* @__PURE__ */ Symbol("reset");
 
 // src/components/fields/ObjectField.tsx
-import { jsx as jsx9, jsxs } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs } from "react/jsx-runtime";
 function isRequired(schema, name) {
   return Array.isArray(schema.required) && schema.required.includes(name);
 }
@@ -1991,6 +2000,12 @@ function getDefaultValue(translateString, type) {
       return translateString(TranslatableString5.NewStringDefault);
   }
 }
+function isAdditionalPropertySchema(schema) {
+  return Boolean(schema?.[ADDITIONAL_PROPERTY_FLAG]);
+}
+function getAdditionalPropertyOrder(schemaProperties) {
+  return Object.keys(schemaProperties).filter((property) => isAdditionalPropertySchema(schemaProperties[property]));
+}
 function ObjectFieldPropertyFn(props) {
   const {
     fieldPathId,
@@ -2011,13 +2026,13 @@ function ObjectFieldPropertyFn(props) {
     handleRemoveProperty,
     addedByAdditionalProperties
   } = props;
-  const [wasPropertyKeyModified, setWasPropertyKeyModified] = useState5(false);
+  const [wasPropertyKeyModified, setWasPropertyKeyModified] = useState7(false);
   const { globalFormOptions, fields: fields2 } = registry;
   const { SchemaField: SchemaField2 } = fields2;
   const innerFieldIdPathId = useDeepCompareMemo4(
     toFieldPathId4(propertyName, globalFormOptions, fieldPathId.path)
   );
-  const onPropertyChange = useCallback4(
+  const onPropertyChange = useCallback5(
     (value, path, newErrorSchema, id) => {
       let normalizedValue = value;
       if (value === void 0 && addedByAdditionalProperties) {
@@ -2027,7 +2042,7 @@ function ObjectFieldPropertyFn(props) {
     },
     [onChange, addedByAdditionalProperties]
   );
-  const onKeyRename = useCallback4(
+  const onKeyRename = useCallback5(
     (value) => {
       if (propertyName !== value) {
         setWasPropertyKeyModified(true);
@@ -2036,7 +2051,7 @@ function ObjectFieldPropertyFn(props) {
     },
     [propertyName, handleKeyRename]
   );
-  const onKeyRenameBlur = useCallback4(
+  const onKeyRenameBlur = useCallback5(
     (event) => {
       const {
         target: { value }
@@ -2045,10 +2060,10 @@ function ObjectFieldPropertyFn(props) {
     },
     [onKeyRename]
   );
-  const onRemoveProperty = useCallback4(() => {
+  const onRemoveProperty = useCallback5(() => {
     handleRemoveProperty(propertyName);
   }, [propertyName, handleRemoveProperty]);
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     SchemaField2,
     {
       name: propertyName,
@@ -2093,24 +2108,31 @@ function ObjectField(props) {
   } = props;
   const { fields: fields2, schemaUtils, translateString, globalUiOptions } = registry;
   const { OptionalDataControlsField: OptionalDataControlsField2 } = fields2;
-  const formDataRef = useRef2(formData);
+  const formDataRef = useRef3(formData);
   formDataRef.current = formData;
-  const schema = useMemo3(
+  const schema = useMemo4(
     () => schemaUtils.retrieveSchema(rawSchema, formData, true),
     [schemaUtils, rawSchema, formData]
   );
-  const uiOptions = useMemo3(() => getUiOptions8(uiSchema, globalUiOptions), [uiSchema, globalUiOptions]);
-  const { properties: schemaProperties = {} } = schema;
+  const uiOptions = useMemo4(() => getUiOptions10(uiSchema, globalUiOptions), [uiSchema, globalUiOptions]);
+  const schemaProperties = useMemo4(() => schema.properties ?? {}, [schema.properties]);
   const childFieldPathId = props.childFieldPathId ?? fieldPathId;
-  const lastRenamedProperty = useRef2({ previousKey: "", currentKey: void 0 });
+  const lastRenamedProperty = useRef3({ previousKey: "", currentKey: void 0 });
+  const [additionalPropertyOrder, setAdditionalPropertyOrder] = useState7(
+    () => getAdditionalPropertyOrder(schemaProperties)
+  );
+  const definedPropertyOrder = useMemo4(() => {
+    const additionalPropertySet = new Set(getAdditionalPropertyOrder(schemaProperties));
+    return Object.keys(schemaProperties).filter((property) => !additionalPropertySet.has(property));
+  }, [schemaProperties]);
   const templateTitle = uiOptions.title ?? schema.title ?? title ?? name;
   const description = uiOptions.description ?? schema.description;
   const renderOptionalField = shouldRenderOptionalField3(registry, schema, required, uiSchema);
   const hasFormData = isFormDataAvailable3(formData);
   let orderedProperties = [];
-  const getAvailableKey = useCallback4(
+  const getAvailableKey = useCallback5(
     (preferredKey, existingFormData) => {
-      const { duplicateKeySuffixSeparator = "-" } = getUiOptions8(uiSchema, globalUiOptions);
+      const { duplicateKeySuffixSeparator = "-" } = getUiOptions10(uiSchema, globalUiOptions);
       let index = 0;
       let newKey = preferredKey;
       while (has3(existingFormData, newKey)) {
@@ -2121,7 +2143,7 @@ function ObjectField(props) {
     },
     [uiSchema, globalUiOptions]
   );
-  const onAddProperty = useCallback4(() => {
+  const onAddProperty = useCallback5(() => {
     if (!(schema.additionalProperties || schema.patternProperties)) {
       return;
     }
@@ -2142,7 +2164,7 @@ function ObjectField(props) {
           apSchema = schemaUtils.retrieveSchema({ [REF_KEY]: apSchema[REF_KEY] }, formData);
           type = apSchema.type;
           constValue = apSchema.const;
-          defaultValue = apSchema.default;
+          defaultValue = schemaUtils.getDefaultFormState(apSchema, defaultValue);
         }
         if (!type && (ANY_OF_KEY4 in apSchema || ONE_OF_KEY4 in apSchema)) {
           type = "object";
@@ -2155,9 +2177,10 @@ function ObjectField(props) {
       lastRenamedProperty.current.currentKey = newKey;
       lastRenamedProperty.current.previousKey = getAvailableKey(newKey, newFormData);
     }
+    setAdditionalPropertyOrder((order) => [...order, newKey]);
     onChange(newFormData, childFieldPathId.path);
   }, [formData, onChange, translateString, schemaUtils, childFieldPathId, getAvailableKey, schema]);
-  const handleKeyRename = useCallback4(
+  const handleKeyRename = useCallback5(
     (oldKey, newKey) => {
       if (oldKey !== newKey) {
         const currentFormData = formDataRef.current;
@@ -2176,18 +2199,20 @@ function ObjectField(props) {
           lastRenamedProperty.current.previousKey = oldKey;
         }
         lastRenamedProperty.current.currentKey = actualNewKey;
+        setAdditionalPropertyOrder((order) => order.map((property) => property === oldKey ? actualNewKey : property));
         onChange(renamedObj, childFieldPathId.path);
       }
     },
     [onChange, childFieldPathId, getAvailableKey]
   );
-  const handleRemoveProperty = useCallback4(
+  const handleRemoveProperty = useCallback5(
     (key) => {
+      setAdditionalPropertyOrder((order) => order.filter((property) => property !== key));
       onChange(ADDITIONAL_PROPERTY_KEY_REMOVE, [...childFieldPathId.path, key]);
     },
     [onChange, childFieldPathId]
   );
-  const getStableKey = useCallback4((property) => {
+  const getStableKey = useCallback5((property) => {
     if (lastRenamedProperty.current.currentKey === property) {
       return lastRenamedProperty.current.previousKey;
     }
@@ -2195,26 +2220,29 @@ function ObjectField(props) {
   }, []);
   if (!renderOptionalField || hasFormData) {
     try {
-      const properties = Object.keys(schemaProperties);
-      orderedProperties = orderProperties(properties, uiOptions.order);
+      const definedPropertySet = new Set(definedPropertyOrder);
+      const currentAdditionalProperties = additionalPropertyOrder.filter(
+        (property) => Object.hasOwn(schemaProperties, property) && !definedPropertySet.has(property)
+      );
+      orderedProperties = orderProperties([...definedPropertyOrder, ...currentAdditionalProperties], uiOptions.order);
     } catch (err) {
       return /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx9("p", { className: "rjsf-config-error", style: { color: "red" }, children: /* @__PURE__ */ jsx9(Markdown, { options: { disableParsingRawHTML: true }, children: translateString(TranslatableString5.InvalidObjectField, [name || "root", err.message]) }) }),
-        /* @__PURE__ */ jsx9("pre", { children: JSON.stringify(schema) })
+        /* @__PURE__ */ jsx10("p", { className: "rjsf-config-error", style: { color: "red" }, children: /* @__PURE__ */ jsx10(Markdown, { options: { disableParsingRawHTML: true }, children: translateString(TranslatableString5.InvalidObjectField, [name || "root", err.message]) }) }),
+        /* @__PURE__ */ jsx10("pre", { children: JSON.stringify(schema) })
       ] });
     }
   }
-  const Template = getTemplate7("ObjectFieldTemplate", registry, uiOptions);
-  const optionalDataControl = renderOptionalField ? /* @__PURE__ */ jsx9(OptionalDataControlsField2, { ...props, fieldPathId: childFieldPathId, schema }) : void 0;
+  const Template = getTemplate8("ObjectFieldTemplate", registry, uiOptions);
+  const optionalDataControl = renderOptionalField ? /* @__PURE__ */ jsx10(OptionalDataControlsField2, { ...props, fieldPathId: childFieldPathId, schema }) : void 0;
   const templateProps = {
     // getDisplayLabel() always returns false for object types, so just check the `uiOptions.label`
     title: uiOptions.label === false ? "" : templateTitle,
     description: uiOptions.label === false ? void 0 : description,
     properties: orderedProperties.map((propertyName) => {
-      const addedByAdditionalProperties = has3(schema, [PROPERTIES_KEY3, propertyName, ADDITIONAL_PROPERTY_FLAG]);
+      const addedByAdditionalProperties = isAdditionalPropertySchema(schema.properties?.[propertyName]);
       const fieldUiSchema = addedByAdditionalProperties ? uiSchema.additionalProperties : uiSchema[propertyName];
-      const hidden = getUiOptions8(fieldUiSchema).widget === "hidden";
-      const content = /* @__PURE__ */ jsx9(
+      const hidden = getUiOptions10(fieldUiSchema).widget === "hidden";
+      const content = /* @__PURE__ */ jsx10(
         ObjectFieldProperty,
         {
           propertyName,
@@ -2258,19 +2286,19 @@ function ObjectField(props) {
     optionalDataControl,
     className: renderOptionalField ? "rjsf-optional-object-field" : void 0
   };
-  return /* @__PURE__ */ jsx9(Template, { ...templateProps, onAddProperty });
+  return /* @__PURE__ */ jsx10(Template, { ...templateProps, onAddProperty });
 }
 
 // src/components/fields/OptionalDataControlsField.tsx
 import {
   getSchemaType,
-  getTemplate as getTemplate8,
-  getUiOptions as getUiOptions9,
+  getTemplate as getTemplate9,
+  getUiOptions as getUiOptions11,
   isFormDataAvailable as isFormDataAvailable4,
   optionalControlsId,
   TranslatableString as TranslatableString6
 } from "@rjsf/utils";
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 function OptionalDataControlsField(props) {
   const {
     schema,
@@ -2284,8 +2312,8 @@ function OptionalDataControlsField(props) {
     registry
   } = props;
   const { globalUiOptions = {}, schemaUtils, translateString } = registry;
-  const uiOptions = getUiOptions9(uiSchema, globalUiOptions);
-  const OptionalDataControlsTemplate2 = getTemplate8(
+  const uiOptions = getUiOptions11(uiSchema, globalUiOptions);
+  const OptionalDataControlsTemplate2 = getTemplate9(
     "OptionalDataControlsTemplate",
     registry,
     uiOptions
@@ -2315,7 +2343,7 @@ function OptionalDataControlsField(props) {
       };
     }
   }
-  return label && /* @__PURE__ */ jsx10(
+  return label && /* @__PURE__ */ jsx11(
     OptionalDataControlsTemplate2,
     {
       id,
@@ -2330,19 +2358,21 @@ function OptionalDataControlsField(props) {
 }
 
 // src/components/fields/SchemaField.tsx
-import { useCallback as useCallback5, Component as Component2 } from "react";
+import { useCallback as useCallback6, memo as memo3 } from "react";
 import {
   ADDITIONAL_PROPERTY_FLAG as ADDITIONAL_PROPERTY_FLAG2,
   ANY_OF_KEY as ANY_OF_KEY5,
+  deepEquals as deepEquals2,
   descriptionId,
   getSchemaType as getSchemaType2,
-  getTemplate as getTemplate9,
-  getUiOptions as getUiOptions10,
+  getTemplate as getTemplate10,
+  getUiOptions as getUiOptions12,
   ID_KEY as ID_KEY4,
   isFormDataAvailable as isFormDataAvailable5,
   ONE_OF_KEY as ONE_OF_KEY5,
   resolveUiSchema,
-  shouldRender,
+  RJSF_REF_CYCLE_KEY as RJSF_REF_CYCLE_KEY2,
+  shallowEquals,
   shouldRenderOptionalField as shouldRenderOptionalField4,
   toFieldPathId as toFieldPathId5,
   TranslatableString as TranslatableString7,
@@ -2350,7 +2380,7 @@ import {
 } from "@rjsf/utils";
 import isObject5 from "lodash/isObject";
 import omit3 from "lodash/omit";
-import { Fragment, jsx as jsx11, jsxs as jsxs2 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx12, jsxs as jsxs2 } from "react/jsx-runtime";
 var COMPONENT_TYPES = {
   array: "ArrayField",
   boolean: "BooleanField",
@@ -2362,7 +2392,7 @@ var COMPONENT_TYPES = {
 };
 function getFieldComponent(schema, uiOptions, registry) {
   const { field } = uiOptions;
-  const { fields: fields2 } = registry;
+  const { fields: fields2, schemaUtils } = registry;
   if (typeof field === "function") {
     return field;
   }
@@ -2376,7 +2406,7 @@ function getFieldComponent(schema, uiOptions, registry) {
   if (schemaId && schemaId in fields2) {
     componentName = schemaId;
   }
-  if (!componentName && (schema.anyOf || schema.oneOf)) {
+  if ((schema.anyOf || schema.oneOf) && !schemaUtils.isSelect(schema) && componentName !== "ObjectField") {
     return () => null;
   }
   return componentName in fields2 ? fields2[componentName] : fields2.FallbackField;
@@ -2398,26 +2428,29 @@ function SchemaFieldRender(props) {
     wasPropertyKeyModified = false
   } = props;
   const { schemaUtils, globalFormOptions, globalUiOptions, fields: fields2 } = registry;
-  const { AnyOfField: _AnyOfField, OneOfField: _OneOfField } = fields2;
-  const uiSchema = resolveUiSchema(_schema, _uiSchema, registry);
-  const uiOptions = getUiOptions10(uiSchema, globalUiOptions);
-  const FieldTemplate2 = getTemplate9("FieldTemplate", registry, uiOptions);
-  const DescriptionFieldTemplate = getTemplate9(
-    "DescriptionFieldTemplate",
-    registry,
-    uiOptions
-  );
-  const FieldHelpTemplate2 = getTemplate9("FieldHelpTemplate", registry, uiOptions);
-  const FieldErrorTemplate2 = getTemplate9("FieldErrorTemplate", registry, uiOptions);
-  const schema = schemaUtils.retrieveSchema(_schema, formData);
+  const { AnyOfField: _AnyOfField, OneOfField: _OneOfField, CyclicSchemaField: CyclicSchemaField2 } = fields2;
   const fieldId = fieldPathId[ID_KEY4];
-  const handleFieldComponentChange = useCallback5(
+  const handleFieldComponentChange = useCallback6(
     (newFormData, path, newErrorSchema, id2) => {
       const theId = id2 || fieldId;
       return onChange(newFormData, path, newErrorSchema, theId);
     },
     [fieldId, onChange]
   );
+  if (_schema[RJSF_REF_CYCLE_KEY2]) {
+    return /* @__PURE__ */ jsx12(CyclicSchemaField2, { ...props });
+  }
+  const uiSchema = resolveUiSchema(_schema, _uiSchema, registry);
+  const uiOptions = getUiOptions12(uiSchema, globalUiOptions);
+  const FieldTemplate2 = getTemplate10("FieldTemplate", registry, uiOptions);
+  const DescriptionFieldTemplate = getTemplate10(
+    "DescriptionFieldTemplate",
+    registry,
+    uiOptions
+  );
+  const FieldHelpTemplate2 = getTemplate10("FieldHelpTemplate", registry, uiOptions);
+  const FieldErrorTemplate2 = getTemplate10("FieldErrorTemplate", registry, uiOptions);
+  const schema = schemaUtils.retrieveSchema(_schema, formData);
   const FieldComponent = getFieldComponent(schema, uiOptions, registry);
   const isDeprecated = Boolean(schema.deprecated);
   const deprecatedHandling = isDeprecated ? uiOptions.deprecatedHandling ?? "label" : void 0;
@@ -2461,7 +2494,7 @@ function SchemaFieldRender(props) {
   if (UI_OPTIONS_KEY2 in fieldUiSchema) {
     fieldUiSchema[UI_OPTIONS_KEY2] = omit3(fieldUiSchema[UI_OPTIONS_KEY2], ["classNames", "style"]);
   }
-  const field = /* @__PURE__ */ jsx11(
+  const field = /* @__PURE__ */ jsx12(
     FieldComponent,
     {
       ...props,
@@ -2497,7 +2530,7 @@ function SchemaFieldRender(props) {
   if (uiOptions.classNames) {
     classNames.push(uiOptions.classNames);
   }
-  const helpComponent = /* @__PURE__ */ jsx11(
+  const helpComponent = /* @__PURE__ */ jsx12(
     FieldHelpTemplate2,
     {
       help,
@@ -2508,7 +2541,7 @@ function SchemaFieldRender(props) {
       registry
     }
   );
-  const errorsComponent = hideError || XxxOfField && !schemaUtils.isSelect(schema) ? void 0 : /* @__PURE__ */ jsx11(
+  const errorsComponent = hideError || XxxOfField && !schemaUtils.isSelect(schema) ? void 0 : /* @__PURE__ */ jsx12(
     FieldErrorTemplate2,
     {
       errors: __errors,
@@ -2520,7 +2553,7 @@ function SchemaFieldRender(props) {
     }
   );
   const fieldProps = {
-    description: /* @__PURE__ */ jsx11(
+    description: /* @__PURE__ */ jsx12(
       DescriptionFieldTemplate,
       {
         id: descriptionId(id),
@@ -2555,9 +2588,9 @@ function SchemaFieldRender(props) {
     uiSchema,
     registry
   };
-  return /* @__PURE__ */ jsx11(FieldTemplate2, { ...fieldProps, children: /* @__PURE__ */ jsxs2(Fragment, { children: [
+  return /* @__PURE__ */ jsx12(FieldTemplate2, { ...fieldProps, children: /* @__PURE__ */ jsxs2(Fragment, { children: [
     field,
-    XxxOfField && /* @__PURE__ */ jsx11(
+    XxxOfField && /* @__PURE__ */ jsx12(
       XxxOfField,
       {
         name,
@@ -2579,24 +2612,22 @@ function SchemaFieldRender(props) {
     )
   ] }) });
 }
-var SchemaField = class extends Component2 {
-  shouldComponentUpdate(nextProps) {
-    const {
-      registry: { globalFormOptions }
-    } = this.props;
-    const { experimental_componentUpdateStrategy = "customDeep" } = globalFormOptions;
-    return shouldRender(this, nextProps, this.state, experimental_componentUpdateStrategy);
+var SchemaField = memo3(SchemaFieldRender, (prevProps, nextProps) => {
+  const { experimental_componentUpdateStrategy = "customDeep" } = nextProps.registry.globalFormOptions;
+  if (experimental_componentUpdateStrategy === "always") {
+    return false;
   }
-  render() {
-    return /* @__PURE__ */ jsx11(SchemaFieldRender, { ...this.props });
+  if (experimental_componentUpdateStrategy === "shallow") {
+    return shallowEquals(prevProps, nextProps);
   }
-};
+  return deepEquals2(prevProps, nextProps);
+});
 var SchemaField_default = SchemaField;
 
 // src/components/fields/StringField.tsx
-import { useCallback as useCallback6 } from "react";
-import { getWidget as getWidget5, getUiOptions as getUiOptions11, optionsList as optionsList4, hasWidget } from "@rjsf/utils";
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { useCallback as useCallback7 } from "react";
+import { getWidget as getWidget5, getUiOptions as getUiOptions13, optionsList as optionsList5, hasWidget } from "@rjsf/utils";
+import { jsx as jsx13 } from "react/jsx-runtime";
 function StringField(props) {
   const {
     schema,
@@ -2618,20 +2649,20 @@ function StringField(props) {
   } = props;
   const { title: schemaTitle, format } = schema;
   const { widgets: widgets2, schemaUtils, globalUiOptions } = registry;
-  const enumOptions = schemaUtils.isSelect(schema) ? optionsList4(schema, uiSchema) : void 0;
+  const enumOptions = schemaUtils.isSelect(schema) ? optionsList5(schema, uiSchema) : void 0;
   let defaultWidget = enumOptions ? "select" : "text";
   if (format && hasWidget(schema, format, widgets2)) {
     defaultWidget = format;
   }
-  const { widget = defaultWidget, placeholder = "", title: uiTitle, ...options } = getUiOptions11(uiSchema);
+  const { widget = defaultWidget, placeholder = "", title: uiTitle, ...options } = getUiOptions13(uiSchema);
   const displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema, globalUiOptions);
   const label = uiTitle ?? title ?? schemaTitle ?? name;
   const Widget = getWidget5(schema, widget, widgets2);
-  const onWidgetChange = useCallback6(
+  const onWidgetChange = useCallback7(
     (value, errorSchema, id) => onChange(value, fieldPathId.path, errorSchema, id),
     [onChange, fieldPathId]
   );
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx13(
     Widget,
     {
       options: { ...options, enumOptions },
@@ -2666,6 +2697,7 @@ function fields() {
     ArrayField,
     // ArrayField falls back to SchemaField if ArraySchemaField is not defined, which it isn't by default
     BooleanField: BooleanField_default,
+    CyclicSchemaField,
     FallbackField,
     LayoutGridField,
     LayoutHeaderField,
@@ -2682,21 +2714,21 @@ function fields() {
 var fields_default = fields;
 
 // src/components/templates/ArrayFieldDescriptionTemplate.tsx
-import { descriptionId as descriptionId2, getTemplate as getTemplate10, getUiOptions as getUiOptions12 } from "@rjsf/utils";
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { descriptionId as descriptionId2, getTemplate as getTemplate11, getUiOptions as getUiOptions14 } from "@rjsf/utils";
+import { jsx as jsx14 } from "react/jsx-runtime";
 function ArrayFieldDescriptionTemplate(props) {
   const { fieldPathId, description, registry, schema, uiSchema } = props;
-  const options = getUiOptions12(uiSchema, registry.globalUiOptions);
+  const options = getUiOptions14(uiSchema, registry.globalUiOptions);
   const { label: displayLabel = true } = options;
   if (!description || !displayLabel) {
     return null;
   }
-  const DescriptionFieldTemplate = getTemplate10(
+  const DescriptionFieldTemplate = getTemplate11(
     "DescriptionFieldTemplate",
     registry,
     options
   );
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14(
     DescriptionFieldTemplate,
     {
       id: descriptionId2(fieldPathId),
@@ -2710,7 +2742,7 @@ function ArrayFieldDescriptionTemplate(props) {
 
 // src/components/templates/ArrayFieldItemButtonsTemplate.tsx
 import { buttonId } from "@rjsf/utils";
-import { Fragment as Fragment2, jsx as jsx14, jsxs as jsxs3 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs3 } from "react/jsx-runtime";
 function ArrayFieldItemButtonsTemplate(props) {
   const {
     disabled,
@@ -2729,7 +2761,7 @@ function ArrayFieldItemButtonsTemplate(props) {
   } = props;
   const { CopyButton: CopyButton2, MoveDownButton: MoveDownButton2, MoveUpButton: MoveUpButton2, RemoveButton: RemoveButton2 } = registry.templates.ButtonTemplates;
   return /* @__PURE__ */ jsxs3(Fragment2, { children: [
-    (hasMoveUp || hasMoveDown) && /* @__PURE__ */ jsx14(
+    (hasMoveUp || hasMoveDown) && /* @__PURE__ */ jsx15(
       MoveUpButton2,
       {
         id: buttonId(fieldPathId, "moveUp"),
@@ -2740,7 +2772,7 @@ function ArrayFieldItemButtonsTemplate(props) {
         registry
       }
     ),
-    (hasMoveUp || hasMoveDown) && /* @__PURE__ */ jsx14(
+    (hasMoveUp || hasMoveDown) && /* @__PURE__ */ jsx15(
       MoveDownButton2,
       {
         id: buttonId(fieldPathId, "moveDown"),
@@ -2751,7 +2783,7 @@ function ArrayFieldItemButtonsTemplate(props) {
         registry
       }
     ),
-    hasCopy && /* @__PURE__ */ jsx14(
+    hasCopy && /* @__PURE__ */ jsx15(
       CopyButton2,
       {
         id: buttonId(fieldPathId, "copy"),
@@ -2762,7 +2794,7 @@ function ArrayFieldItemButtonsTemplate(props) {
         registry
       }
     ),
-    hasRemove && /* @__PURE__ */ jsx14(
+    hasRemove && /* @__PURE__ */ jsx15(
       RemoveButton2,
       {
         id: buttonId(fieldPathId, "remove"),
@@ -2777,12 +2809,12 @@ function ArrayFieldItemButtonsTemplate(props) {
 }
 
 // src/components/templates/ArrayFieldItemTemplate.tsx
-import { getTemplate as getTemplate11, getUiOptions as getUiOptions13 } from "@rjsf/utils";
-import { jsx as jsx15, jsxs as jsxs4 } from "react/jsx-runtime";
+import { getTemplate as getTemplate12, getUiOptions as getUiOptions15 } from "@rjsf/utils";
+import { jsx as jsx16, jsxs as jsxs4 } from "react/jsx-runtime";
 function ArrayFieldItemTemplate(props) {
   const { children, className, buttonsProps, displayLabel, hasDescription, hasToolbar, registry, uiSchema } = props;
-  const uiOptions = getUiOptions13(uiSchema);
-  const ArrayFieldItemButtonsTemplate2 = getTemplate11(
+  const uiOptions = getUiOptions15(uiSchema);
+  const ArrayFieldItemButtonsTemplate2 = getTemplate12(
     "ArrayFieldItemButtonsTemplate",
     registry,
     uiOptions
@@ -2797,14 +2829,14 @@ function ArrayFieldItemTemplate(props) {
   const containerStyle = { display: "flex", alignItems: displayLabel ? "center" : "baseline" };
   const toolbarStyle = { display: "flex", justifyContent: "flex-end", marginTop: displayLabel ? `${margin}px` : 0 };
   return /* @__PURE__ */ jsxs4("div", { className, style: containerStyle, children: [
-    /* @__PURE__ */ jsx15("div", { className: hasToolbar ? "col-xs-9 col-md-10 col-xl-11" : "col-xs-12", children }),
-    hasToolbar && /* @__PURE__ */ jsx15("div", { className: "col-xs-3 col-md-2 col-xl-1 array-item-toolbox", children: /* @__PURE__ */ jsx15("div", { className: "btn-group", style: toolbarStyle, children: /* @__PURE__ */ jsx15(ArrayFieldItemButtonsTemplate2, { ...buttonsProps, style: btnStyle }) }) })
+    /* @__PURE__ */ jsx16("div", { className: hasToolbar ? "col-xs-9 col-md-10 col-xl-11" : "col-xs-12", children }),
+    hasToolbar && /* @__PURE__ */ jsx16("div", { className: "col-xs-3 col-md-2 col-xl-1 array-item-toolbox", children: /* @__PURE__ */ jsx16("div", { className: "btn-group", style: toolbarStyle, children: /* @__PURE__ */ jsx16(ArrayFieldItemButtonsTemplate2, { ...buttonsProps, style: btnStyle }) }) })
   ] });
 }
 
 // src/components/templates/ArrayFieldTemplate.tsx
-import { getTemplate as getTemplate12, getUiOptions as getUiOptions14, buttonId as buttonId2 } from "@rjsf/utils";
-import { jsx as jsx16, jsxs as jsxs5 } from "react/jsx-runtime";
+import { getTemplate as getTemplate13, getUiOptions as getUiOptions16, buttonId as buttonId2 } from "@rjsf/utils";
+import { jsx as jsx17, jsxs as jsxs5 } from "react/jsx-runtime";
 function ArrayFieldTemplate(props) {
   const {
     canAdd,
@@ -2821,13 +2853,13 @@ function ArrayFieldTemplate(props) {
     schema,
     title
   } = props;
-  const uiOptions = getUiOptions14(uiSchema);
-  const ArrayFieldDescriptionTemplate2 = getTemplate12(
+  const uiOptions = getUiOptions16(uiSchema);
+  const ArrayFieldDescriptionTemplate2 = getTemplate13(
     "ArrayFieldDescriptionTemplate",
     registry,
     uiOptions
   );
-  const ArrayFieldTitleTemplate2 = getTemplate12(
+  const ArrayFieldTitleTemplate2 = getTemplate13(
     "ArrayFieldTitleTemplate",
     registry,
     uiOptions
@@ -2837,7 +2869,7 @@ function ArrayFieldTemplate(props) {
     ButtonTemplates: { AddButton: AddButton2 }
   } = registry.templates;
   return /* @__PURE__ */ jsxs5("fieldset", { className, id: fieldPathId.$id, children: [
-    /* @__PURE__ */ jsx16(
+    /* @__PURE__ */ jsx17(
       ArrayFieldTitleTemplate2,
       {
         fieldPathId,
@@ -2849,7 +2881,7 @@ function ArrayFieldTemplate(props) {
         optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : void 0
       }
     ),
-    /* @__PURE__ */ jsx16(
+    /* @__PURE__ */ jsx17(
       ArrayFieldDescriptionTemplate2,
       {
         fieldPathId,
@@ -2860,8 +2892,8 @@ function ArrayFieldTemplate(props) {
       }
     ),
     !showOptionalDataControlInTitle ? optionalDataControl : void 0,
-    /* @__PURE__ */ jsx16("div", { className: "row array-item-list", children: items }),
-    canAdd && /* @__PURE__ */ jsx16(
+    /* @__PURE__ */ jsx17("div", { className: "row array-item-list", children: items }),
+    canAdd && /* @__PURE__ */ jsx17(
       AddButton2,
       {
         id: buttonId2(fieldPathId, "add"),
@@ -2876,21 +2908,21 @@ function ArrayFieldTemplate(props) {
 }
 
 // src/components/templates/ArrayFieldTitleTemplate.tsx
-import { getTemplate as getTemplate13, getUiOptions as getUiOptions15, titleId as titleId2 } from "@rjsf/utils";
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { getTemplate as getTemplate14, getUiOptions as getUiOptions17, titleId as titleId2 } from "@rjsf/utils";
+import { jsx as jsx18 } from "react/jsx-runtime";
 function ArrayFieldTitleTemplate(props) {
   const { fieldPathId, title, schema, uiSchema, required, registry, optionalDataControl } = props;
-  const options = getUiOptions15(uiSchema, registry.globalUiOptions);
+  const options = getUiOptions17(uiSchema, registry.globalUiOptions);
   const { label: displayLabel = true } = options;
   if (!title || !displayLabel) {
     return null;
   }
-  const TitleFieldTemplate = getTemplate13(
+  const TitleFieldTemplate = getTemplate14(
     "TitleFieldTemplate",
     registry,
     options
   );
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx18(
     TitleFieldTemplate,
     {
       id: titleId2(fieldPathId),
@@ -2905,28 +2937,28 @@ function ArrayFieldTitleTemplate(props) {
 }
 
 // src/components/templates/BaseInputTemplate.tsx
-import { useCallback as useCallback7 } from "react";
+import { useCallback as useCallback8 } from "react";
 import { ariaDescribedByIds, examplesId as examplesId2, getInputProps } from "@rjsf/utils";
 
 // src/components/SchemaExamples.tsx
 import { examplesId } from "@rjsf/utils";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 function SchemaExamples(props) {
   const { id, schema } = props;
   const { examples, default: schemaDefault } = schema;
   if (!Array.isArray(examples)) {
     return null;
   }
-  return /* @__PURE__ */ jsx18("datalist", { id: examplesId(id), children: examples.concat(
+  return /* @__PURE__ */ jsx19("datalist", { id: examplesId(id), children: examples.concat(
     schemaDefault !== void 0 && !examples.map(String).includes(String(schemaDefault)) ? [schemaDefault] : []
   ).map((example) => (
     // oxlint-disable-next-line jsx-a11y/control-has-associated-label
-    /* @__PURE__ */ jsx18("option", { value: example }, String(example))
+    /* @__PURE__ */ jsx19("option", { value: example }, String(example))
   )) }, `datalist_${id}`);
 }
 
 // src/components/templates/BaseInputTemplate.tsx
-import { Fragment as Fragment3, jsx as jsx19, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx20, jsxs as jsxs6 } from "react/jsx-runtime";
 function BaseInputTemplate(props) {
   const {
     id,
@@ -2968,19 +3000,16 @@ function BaseInputTemplate(props) {
   } else {
     inputValue = value == null ? "" : value;
   }
-  const handleChange = useCallback7(
+  const handleChange = useCallback8(
     ({ target: { value: newValue } }) => onChange(newValue === "" ? options.emptyValue : newValue),
     [onChange, options]
   );
-  const handleBlur = useCallback7(
-    ({ target }) => onBlur(id, target && target.value),
-    [onBlur, id]
-  );
-  const handleFocus = useCallback7(
-    ({ target }) => onFocus(id, target && target.value),
+  const handleBlur = useCallback8(({ target }) => onBlur(id, target?.value), [onBlur, id]);
+  const handleFocus = useCallback8(
+    ({ target }) => onFocus(id, target?.value),
     [onFocus, id]
   );
-  const handleClear = useCallback7(
+  const handleClear = useCallback8(
     (e) => {
       e.preventDefault();
       e.stopPropagation();
@@ -2989,7 +3018,7 @@ function BaseInputTemplate(props) {
     [onChange, options.emptyValue]
   );
   return /* @__PURE__ */ jsxs6(Fragment3, { children: [
-    /* @__PURE__ */ jsx19(
+    /* @__PURE__ */ jsx20(
       "input",
       {
         id,
@@ -3007,8 +3036,8 @@ function BaseInputTemplate(props) {
         "aria-describedby": ariaDescribedByIds(id, !!schema.examples)
       }
     ),
-    options.allowClearTextInputs && !readonly && !disabled && inputValue && /* @__PURE__ */ jsx19(ClearButton2, { registry, onClick: handleClear }),
-    /* @__PURE__ */ jsx19(SchemaExamples, { id, schema })
+    options.allowClearTextInputs && !readonly && !disabled && inputValue && /* @__PURE__ */ jsx20(ClearButton2, { registry, onClick: handleClear }),
+    /* @__PURE__ */ jsx20(SchemaExamples, { id, schema })
   ] });
 }
 
@@ -3016,43 +3045,43 @@ function BaseInputTemplate(props) {
 import { TranslatableString as TranslatableString9 } from "@rjsf/utils";
 
 // src/components/templates/ButtonTemplates/IconButton.tsx
-import { memo as memo3 } from "react";
+import { memo as memo4 } from "react";
 import { TranslatableString as TranslatableString8 } from "@rjsf/utils";
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx21 } from "react/jsx-runtime";
 function IconButtonFn(props) {
   const { iconType = "default", icon, className, uiSchema, registry, ...otherProps } = props;
-  return /* @__PURE__ */ jsx20("button", { type: "button", className: `btn btn-${iconType} ${className}`, ...otherProps, children: /* @__PURE__ */ jsx20("i", { className: `glyphicon glyphicon-${icon}` }) });
+  return /* @__PURE__ */ jsx21("button", { type: "button", className: `btn btn-${iconType} ${className}`, ...otherProps, children: /* @__PURE__ */ jsx21("i", { className: `glyphicon glyphicon-${icon}` }) });
 }
-var IconButton = memo3(IconButtonFn);
+var IconButton = memo4(IconButtonFn);
 var IconButton_default = IconButton;
 function CopyButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ jsx20(IconButton, { title: translateString(TranslatableString8.CopyButton), ...props, icon: "copy" });
+  return /* @__PURE__ */ jsx21(IconButton, { title: translateString(TranslatableString8.CopyButton), ...props, icon: "copy" });
 }
-var CopyButton = memo3(CopyButtonFn);
+var CopyButton = memo4(CopyButtonFn);
 function MoveDownButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ jsx20(IconButton, { title: translateString(TranslatableString8.MoveDownButton), ...props, icon: "arrow-down" });
+  return /* @__PURE__ */ jsx21(IconButton, { title: translateString(TranslatableString8.MoveDownButton), ...props, icon: "arrow-down" });
 }
-var MoveDownButton = memo3(MoveDownButtonFn);
+var MoveDownButton = memo4(MoveDownButtonFn);
 function MoveUpButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ jsx20(IconButton, { title: translateString(TranslatableString8.MoveUpButton), ...props, icon: "arrow-up" });
+  return /* @__PURE__ */ jsx21(IconButton, { title: translateString(TranslatableString8.MoveUpButton), ...props, icon: "arrow-up" });
 }
-var MoveUpButton = memo3(MoveUpButtonFn);
+var MoveUpButton = memo4(MoveUpButtonFn);
 function RemoveButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ jsx20(IconButton, { title: translateString(TranslatableString8.RemoveButton), ...props, iconType: "danger", icon: "remove" });
+  return /* @__PURE__ */ jsx21(IconButton, { title: translateString(TranslatableString8.RemoveButton), ...props, iconType: "danger", icon: "remove" });
 }
-var RemoveButton = memo3(RemoveButtonFn);
+var RemoveButton = memo4(RemoveButtonFn);
 function ClearButtonFn({
   id,
   className,
@@ -3062,7 +3091,7 @@ function ClearButtonFn({
   ...props
 }) {
   const { translateString } = registry;
-  return /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx21(
     IconButton,
     {
       id,
@@ -3077,10 +3106,10 @@ function ClearButtonFn({
     }
   );
 }
-var ClearButton = memo3(ClearButtonFn);
+var ClearButton = memo4(ClearButtonFn);
 
 // src/components/templates/ButtonTemplates/AddButton.tsx
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 function AddButton({
   id,
   className,
@@ -3089,11 +3118,11 @@ function AddButton({
   registry
 }) {
   const { translateString } = registry;
-  return /* @__PURE__ */ jsx21("div", { className: "row", children: /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx22("div", { className: "row", children: /* @__PURE__ */ jsx22(
     "p",
     {
       className: `col-xs-4 col-sm-2 col-lg-1 col-xs-offset-8 col-sm-offset-10 col-lg-offset-11 text-right ${className}`,
-      children: /* @__PURE__ */ jsx21(
+      children: /* @__PURE__ */ jsx22(
         IconButton_default,
         {
           id,
@@ -3112,13 +3141,13 @@ function AddButton({
 
 // src/components/templates/ButtonTemplates/SubmitButton.tsx
 import { getSubmitButtonOptions } from "@rjsf/utils";
-import { jsx as jsx22 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 function SubmitButton({ uiSchema }) {
   const { submitText, norender, props: submitButtonProps = {} } = getSubmitButtonOptions(uiSchema);
   if (norender) {
     return null;
   }
-  return /* @__PURE__ */ jsx22("div", { children: /* @__PURE__ */ jsx22("button", { type: "submit", ...submitButtonProps, className: `btn btn-info ${submitButtonProps.className || ""}`, children: submitText }) });
+  return /* @__PURE__ */ jsx23("div", { children: /* @__PURE__ */ jsx23("button", { type: "submit", ...submitButtonProps, className: `btn btn-info ${submitButtonProps.className || ""}`, children: submitText }) });
 }
 
 // src/components/templates/ButtonTemplates/index.ts
@@ -3135,58 +3164,83 @@ function buttonTemplates() {
 }
 var ButtonTemplates_default = buttonTemplates;
 
+// src/components/templates/CyclicSchemaExpandTemplate.tsx
+import { ID_KEY as ID_KEY5, TranslatableString as TranslatableString10 } from "@rjsf/utils";
+import { jsx as jsx24, jsxs as jsxs7 } from "react/jsx-runtime";
+function CyclicSchemaExpandTemplate(props) {
+  const { name, fieldPathId, registry, onExpand } = props;
+  const { translateString } = registry;
+  const buttonId5 = `${fieldPathId[ID_KEY5]}-button`;
+  return /* @__PURE__ */ jsxs7("div", { style: { marginTop: "1rem" }, children: [
+    /* @__PURE__ */ jsx24("div", { className: "text-danger", children: translateString(TranslatableString10.CycleDetected, [name]) }),
+    /* @__PURE__ */ jsxs7("div", { children: [
+      /* @__PURE__ */ jsx24(
+        "button",
+        {
+          id: buttonId5,
+          type: "button",
+          className: "btn btn-sm btn-warning",
+          onClick: () => onExpand(fieldPathId[ID_KEY5]),
+          children: translateString(TranslatableString10.ExpandButton)
+        }
+      ),
+      " "
+    ] })
+  ] });
+}
+
 // src/components/RichDescription.tsx
-import { getTestIds as getTestIds2, getUiOptions as getUiOptions16 } from "@rjsf/utils";
+import { getTestIds as getTestIds2, getUiOptions as getUiOptions18 } from "@rjsf/utils";
 import { Markdown as Markdown2 } from "markdown-to-jsx/react";
-import { jsx as jsx23 } from "react/jsx-runtime";
+import { jsx as jsx25 } from "react/jsx-runtime";
 var TEST_IDS = getTestIds2();
 function RichDescription({ description, registry, uiSchema = {} }) {
   const { globalUiOptions } = registry;
-  const uiOptions = getUiOptions16(uiSchema, globalUiOptions);
+  const uiOptions = getUiOptions18(uiSchema, globalUiOptions);
   if (uiOptions.enableMarkdownInDescription && typeof description === "string") {
-    return /* @__PURE__ */ jsx23(Markdown2, { options: { disableParsingRawHTML: true }, "data-testid": TEST_IDS.markdown, children: description });
+    return /* @__PURE__ */ jsx25(Markdown2, { options: { disableParsingRawHTML: true }, "data-testid": TEST_IDS.markdown, children: description });
   }
   return description;
 }
 RichDescription.TEST_IDS = TEST_IDS;
 
 // src/components/templates/DescriptionField.tsx
-import { jsx as jsx24 } from "react/jsx-runtime";
+import { jsx as jsx26 } from "react/jsx-runtime";
 function DescriptionField(props) {
   const { id, description, registry, uiSchema } = props;
   if (!description) {
     return null;
   }
-  return /* @__PURE__ */ jsx24("div", { id, className: "field-description", children: /* @__PURE__ */ jsx24(RichDescription, { description, registry, uiSchema }) });
+  return /* @__PURE__ */ jsx26("div", { id, className: "field-description", children: /* @__PURE__ */ jsx26(RichDescription, { description, registry, uiSchema }) });
 }
 
 // src/components/templates/ErrorList.tsx
-import { TranslatableString as TranslatableString10 } from "@rjsf/utils";
-import { jsx as jsx25, jsxs as jsxs7 } from "react/jsx-runtime";
+import { TranslatableString as TranslatableString11 } from "@rjsf/utils";
+import { jsx as jsx27, jsxs as jsxs8 } from "react/jsx-runtime";
 function ErrorList({
   errors,
   registry
 }) {
   const { translateString } = registry;
-  return /* @__PURE__ */ jsxs7("div", { className: "panel panel-danger errors", children: [
-    /* @__PURE__ */ jsx25("div", { className: "panel-heading", children: /* @__PURE__ */ jsx25("h3", { className: "panel-title", children: translateString(TranslatableString10.ErrorsLabel) }) }),
-    /* @__PURE__ */ jsx25("ul", { className: "list-group", children: errors.map((error, i) => (
+  return /* @__PURE__ */ jsxs8("div", { className: "panel panel-danger errors", children: [
+    /* @__PURE__ */ jsx27("div", { className: "panel-heading", children: /* @__PURE__ */ jsx27("h3", { className: "panel-title", children: translateString(TranslatableString11.ErrorsLabel) }) }),
+    /* @__PURE__ */ jsx27("ul", { className: "list-group", children: errors.map((error, i) => (
       // oxlint-disable-next-line react/no-array-index-key
-      /* @__PURE__ */ jsx25("li", { className: "list-group-item text-danger", children: error.stack }, i)
+      /* @__PURE__ */ jsx27("li", { className: "list-group-item text-danger", children: error.stack }, i)
     )) })
   ] });
 }
 
 // src/components/templates/FallbackFieldTemplate.tsx
-import { getTemplate as getTemplate14 } from "@rjsf/utils";
-import { jsx as jsx26 } from "react/jsx-runtime";
+import { getTemplate as getTemplate15 } from "@rjsf/utils";
+import { jsx as jsx28 } from "react/jsx-runtime";
 function FallbackFieldTemplate(props) {
   const { schema, registry, typeSelector, schemaField } = props;
-  const MultiSchemaFieldTemplate2 = getTemplate14(
+  const MultiSchemaFieldTemplate2 = getTemplate15(
     "MultiSchemaFieldTemplate",
     registry
   );
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx28(
     MultiSchemaFieldTemplate2,
     {
       selector: typeSelector,
@@ -3199,16 +3253,16 @@ function FallbackFieldTemplate(props) {
 
 // src/components/templates/FieldErrorTemplate.tsx
 import { errorId } from "@rjsf/utils";
-import { jsx as jsx27 } from "react/jsx-runtime";
+import { jsx as jsx29 } from "react/jsx-runtime";
 function FieldErrorTemplate(props) {
   const { errors = [], fieldPathId } = props;
   if (errors.length === 0) {
     return null;
   }
   const id = errorId(fieldPathId);
-  return /* @__PURE__ */ jsx27("div", { children: /* @__PURE__ */ jsx27("ul", { id, className: "error-detail bs-callout bs-callout-info", children: errors.filter((elem) => !!elem).map((error, index) => (
+  return /* @__PURE__ */ jsx29("div", { children: /* @__PURE__ */ jsx29("ul", { id, className: "error-detail bs-callout bs-callout-info", children: errors.filter((elem) => !!elem).map((error, index) => (
     // oxlint-disable-next-line react/no-array-index-key
-    /* @__PURE__ */ jsx27("li", { className: "text-danger", children: error }, index)
+    /* @__PURE__ */ jsx29("li", { className: "text-danger", children: error }, index)
   )) }) });
 }
 
@@ -3216,9 +3270,9 @@ function FieldErrorTemplate(props) {
 import { helpId } from "@rjsf/utils";
 
 // src/components/RichHelp.tsx
-import { getTestIds as getTestIds3, getUiOptions as getUiOptions17 } from "@rjsf/utils";
+import { getTestIds as getTestIds3, getUiOptions as getUiOptions19 } from "@rjsf/utils";
 import { Markdown as Markdown3 } from "markdown-to-jsx/react";
-import { jsx as jsx28 } from "react/jsx-runtime";
+import { jsx as jsx30 } from "react/jsx-runtime";
 var TEST_IDS2 = getTestIds3();
 function RichHelp({
   help,
@@ -3226,57 +3280,57 @@ function RichHelp({
   uiSchema = {}
 }) {
   const { globalUiOptions } = registry;
-  const uiOptions = getUiOptions17(uiSchema, globalUiOptions);
+  const uiOptions = getUiOptions19(uiSchema, globalUiOptions);
   if (uiOptions.enableMarkdownInHelp && typeof help === "string") {
-    return /* @__PURE__ */ jsx28(Markdown3, { options: { disableParsingRawHTML: true }, "data-testid": TEST_IDS2.markdown, children: help });
+    return /* @__PURE__ */ jsx30(Markdown3, { options: { disableParsingRawHTML: true }, "data-testid": TEST_IDS2.markdown, children: help });
   }
   return help;
 }
 RichHelp.TEST_IDS = TEST_IDS2;
 
 // src/components/templates/FieldHelpTemplate.tsx
-import { jsx as jsx29 } from "react/jsx-runtime";
+import { jsx as jsx31 } from "react/jsx-runtime";
 function FieldHelpTemplate(props) {
   const { fieldPathId, help, uiSchema, registry } = props;
   if (!help) {
     return null;
   }
-  return /* @__PURE__ */ jsx29("div", { id: helpId(fieldPathId), className: "help-block", children: /* @__PURE__ */ jsx29(RichHelp, { help, registry, uiSchema }) });
+  return /* @__PURE__ */ jsx31("div", { id: helpId(fieldPathId), className: "help-block", children: /* @__PURE__ */ jsx31(RichHelp, { help, registry, uiSchema }) });
 }
 
 // src/components/templates/FieldTemplate/FieldTemplate.tsx
-import { getTemplate as getTemplate15, getUiOptions as getUiOptions18 } from "@rjsf/utils";
+import { getTemplate as getTemplate16, getUiOptions as getUiOptions20 } from "@rjsf/utils";
 
 // src/components/templates/FieldTemplate/Label.tsx
-import { jsx as jsx30, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx32, jsxs as jsxs9 } from "react/jsx-runtime";
 var REQUIRED_FIELD_SYMBOL = "*";
 function Label(props) {
   const { label, required, id } = props;
   if (!label) {
     return null;
   }
-  return /* @__PURE__ */ jsxs8("label", { className: "control-label", htmlFor: id, children: [
+  return /* @__PURE__ */ jsxs9("label", { className: "control-label", htmlFor: id, children: [
     label,
-    required && /* @__PURE__ */ jsx30("span", { className: "required", children: REQUIRED_FIELD_SYMBOL })
+    required && /* @__PURE__ */ jsx32("span", { className: "required", children: REQUIRED_FIELD_SYMBOL })
   ] });
 }
 
 // src/components/templates/FieldTemplate/FieldTemplate.tsx
-import { jsx as jsx31, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx33, jsxs as jsxs10 } from "react/jsx-runtime";
 function FieldTemplate(props) {
   const { id, label, children, errors, help, description, hidden, required, displayLabel, registry, uiSchema } = props;
-  const uiOptions = getUiOptions18(uiSchema);
-  const WrapIfAdditionalTemplate2 = getTemplate15(
+  const uiOptions = getUiOptions20(uiSchema);
+  const WrapIfAdditionalTemplate2 = getTemplate16(
     "WrapIfAdditionalTemplate",
     registry,
     uiOptions
   );
   if (hidden) {
-    return /* @__PURE__ */ jsx31("div", { className: "hidden", children });
+    return /* @__PURE__ */ jsx33("div", { className: "hidden", children });
   }
   const isCheckbox = uiOptions.widget === "checkbox";
-  return /* @__PURE__ */ jsxs9(WrapIfAdditionalTemplate2, { ...props, children: [
-    displayLabel && !isCheckbox && /* @__PURE__ */ jsx31(Label, { label, required, id }),
+  return /* @__PURE__ */ jsxs10(WrapIfAdditionalTemplate2, { ...props, children: [
+    displayLabel && !isCheckbox && /* @__PURE__ */ jsx33(Label, { label, required, id }),
     displayLabel && description ? description : null,
     children,
     errors,
@@ -3288,25 +3342,25 @@ function FieldTemplate(props) {
 var FieldTemplate_default = FieldTemplate;
 
 // src/components/templates/GridTemplate.tsx
-import { jsx as jsx32 } from "react/jsx-runtime";
+import { jsx as jsx34 } from "react/jsx-runtime";
 function GridTemplate(props) {
   const { children, column, className, ...rest } = props;
-  return /* @__PURE__ */ jsx32("div", { className, ...rest, children });
+  return /* @__PURE__ */ jsx34("div", { className, ...rest, children });
 }
 
 // src/components/templates/MultiSchemaFieldTemplate.tsx
-import { jsx as jsx33, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs11 } from "react/jsx-runtime";
 function MultiSchemaFieldTemplate(props) {
   const { selector, optionSchemaField } = props;
-  return /* @__PURE__ */ jsxs10("div", { className: "panel panel-default panel-body", children: [
-    /* @__PURE__ */ jsx33("div", { className: "form-group", children: selector }),
+  return /* @__PURE__ */ jsxs11("div", { className: "panel panel-default panel-body", children: [
+    /* @__PURE__ */ jsx35("div", { className: "form-group", children: selector }),
     optionSchemaField
   ] });
 }
 
 // src/components/templates/ObjectFieldTemplate.tsx
-import { canExpand, descriptionId as descriptionId3, getTemplate as getTemplate16, getUiOptions as getUiOptions19, titleId as titleId3, buttonId as buttonId3 } from "@rjsf/utils";
-import { jsx as jsx34, jsxs as jsxs11 } from "react/jsx-runtime";
+import { canExpand, descriptionId as descriptionId3, getTemplate as getTemplate17, getUiOptions as getUiOptions21, titleId as titleId3, buttonId as buttonId3 } from "@rjsf/utils";
+import { jsx as jsx36, jsxs as jsxs12 } from "react/jsx-runtime";
 function ObjectFieldTemplate(props) {
   const {
     className,
@@ -3324,9 +3378,9 @@ function ObjectFieldTemplate(props) {
     title,
     uiSchema
   } = props;
-  const options = getUiOptions19(uiSchema);
-  const TitleFieldTemplate = getTemplate16("TitleFieldTemplate", registry, options);
-  const DescriptionFieldTemplate = getTemplate16(
+  const options = getUiOptions21(uiSchema);
+  const TitleFieldTemplate = getTemplate17("TitleFieldTemplate", registry, options);
+  const DescriptionFieldTemplate = getTemplate17(
     "DescriptionFieldTemplate",
     registry,
     options
@@ -3339,8 +3393,8 @@ function ObjectFieldTemplate(props) {
   const {
     ButtonTemplates: { AddButton: AddButton2 }
   } = registry.templates;
-  return /* @__PURE__ */ jsxs11("fieldset", { className, id: fieldPathId.$id, children: [
-    title && /* @__PURE__ */ jsx34(
+  return /* @__PURE__ */ jsxs12("fieldset", { className, id: fieldPathId.$id, children: [
+    title && /* @__PURE__ */ jsx36(
       TitleFieldTemplate,
       {
         id: titleId3(fieldPathId),
@@ -3352,7 +3406,7 @@ function ObjectFieldTemplate(props) {
         optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : void 0
       }
     ),
-    description && /* @__PURE__ */ jsx34(
+    description && /* @__PURE__ */ jsx36(
       DescriptionFieldTemplate,
       {
         id: descriptionId3(fieldPathId),
@@ -3364,7 +3418,7 @@ function ObjectFieldTemplate(props) {
     ),
     !showOptionalDataControlInTitle ? optionalDataControl : void 0,
     properties.map((prop) => prop.content),
-    canExpand(schema, uiSchema, formData) && /* @__PURE__ */ jsx34(
+    canExpand(schema, uiSchema, formData) && /* @__PURE__ */ jsx36(
       AddButton2,
       {
         id: buttonId3(fieldPathId, "add"),
@@ -3379,11 +3433,11 @@ function ObjectFieldTemplate(props) {
 }
 
 // src/components/templates/OptionalDataControlsTemplate.tsx
-import { jsx as jsx35 } from "react/jsx-runtime";
+import { jsx as jsx37 } from "react/jsx-runtime";
 function OptionalDataControlsTemplate(props) {
   const { id, registry, label, onAddClick, onRemoveClick } = props;
   if (onAddClick) {
-    return /* @__PURE__ */ jsx35(
+    return /* @__PURE__ */ jsx37(
       IconButton_default,
       {
         id,
@@ -3396,7 +3450,7 @@ function OptionalDataControlsTemplate(props) {
     );
   }
   if (onRemoveClick) {
-    return /* @__PURE__ */ jsx35(
+    return /* @__PURE__ */ jsx37(
       IconButton_default,
       {
         id,
@@ -3408,48 +3462,48 @@ function OptionalDataControlsTemplate(props) {
       }
     );
   }
-  return /* @__PURE__ */ jsx35("em", { id, children: label });
+  return /* @__PURE__ */ jsx37("em", { id, children: label });
 }
 
 // src/components/templates/TitleField.tsx
-import { jsx as jsx36, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx38, jsxs as jsxs13 } from "react/jsx-runtime";
 var REQUIRED_FIELD_SYMBOL2 = "*";
 function TitleField(props) {
   const { id, title, required, optionalDataControl } = props;
-  return /* @__PURE__ */ jsxs12("legend", { id, children: [
+  return /* @__PURE__ */ jsxs13("legend", { id, children: [
     title,
-    required && /* @__PURE__ */ jsx36("span", { className: "required", children: REQUIRED_FIELD_SYMBOL2 }),
-    optionalDataControl && /* @__PURE__ */ jsx36("span", { className: "pull-right", style: { marginBottom: "2px" }, children: optionalDataControl })
+    required && /* @__PURE__ */ jsx38("span", { className: "required", children: REQUIRED_FIELD_SYMBOL2 }),
+    optionalDataControl && /* @__PURE__ */ jsx38("span", { className: "pull-right", style: { marginBottom: "2px" }, children: optionalDataControl })
   ] });
 }
 
 // src/components/templates/UnsupportedField.tsx
-import { TranslatableString as TranslatableString11 } from "@rjsf/utils";
+import { TranslatableString as TranslatableString12 } from "@rjsf/utils";
 import { Markdown as Markdown4 } from "markdown-to-jsx/react";
-import { jsx as jsx37, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs14 } from "react/jsx-runtime";
 function UnsupportedField(props) {
   const { schema, fieldPathId, reason, registry } = props;
   const { translateString } = registry;
-  let translateEnum = TranslatableString11.UnsupportedField;
+  let translateEnum = TranslatableString12.UnsupportedField;
   const translateParams = [];
-  if (fieldPathId && fieldPathId.$id) {
-    translateEnum = TranslatableString11.UnsupportedFieldWithId;
+  if (fieldPathId?.$id) {
+    translateEnum = TranslatableString12.UnsupportedFieldWithId;
     translateParams.push(fieldPathId.$id);
   }
   if (reason) {
-    translateEnum = translateEnum === TranslatableString11.UnsupportedField ? TranslatableString11.UnsupportedFieldWithReason : TranslatableString11.UnsupportedFieldWithIdAndReason;
+    translateEnum = translateEnum === TranslatableString12.UnsupportedField ? TranslatableString12.UnsupportedFieldWithReason : TranslatableString12.UnsupportedFieldWithIdAndReason;
     translateParams.push(reason);
   }
-  return /* @__PURE__ */ jsxs13("div", { className: "unsupported-field", children: [
-    /* @__PURE__ */ jsx37("p", { children: /* @__PURE__ */ jsx37(Markdown4, { options: { disableParsingRawHTML: true }, children: translateString(translateEnum, translateParams) }) }),
-    schema && /* @__PURE__ */ jsx37("pre", { children: JSON.stringify(schema, null, 2) })
+  return /* @__PURE__ */ jsxs14("div", { className: "unsupported-field", children: [
+    /* @__PURE__ */ jsx39("p", { children: /* @__PURE__ */ jsx39(Markdown4, { options: { disableParsingRawHTML: true }, children: translateString(translateEnum, translateParams) }) }),
+    schema && /* @__PURE__ */ jsx39("pre", { children: JSON.stringify(schema, null, 2) })
   ] });
 }
 var UnsupportedField_default = UnsupportedField;
 
 // src/components/templates/WrapIfAdditionalTemplate.tsx
-import { ADDITIONAL_PROPERTY_FLAG as ADDITIONAL_PROPERTY_FLAG3, buttonId as buttonId4, TranslatableString as TranslatableString12 } from "@rjsf/utils";
-import { jsx as jsx38, jsxs as jsxs14 } from "react/jsx-runtime";
+import { ADDITIONAL_PROPERTY_FLAG as ADDITIONAL_PROPERTY_FLAG3, buttonId as buttonId4, TranslatableString as TranslatableString13 } from "@rjsf/utils";
+import { jsx as jsx40, jsxs as jsxs15 } from "react/jsx-runtime";
 function WrapIfAdditionalTemplate(props) {
   const {
     id,
@@ -3472,7 +3526,7 @@ function WrapIfAdditionalTemplate(props) {
   } = props;
   const { templates: templates2, translateString } = registry;
   const { RemoveButton: RemoveButton2 } = templates2.ButtonTemplates;
-  const keyLabel = translateString(TranslatableString12.KeyLabel, [label]);
+  const keyLabel = translateString(TranslatableString13.KeyLabel, [label]);
   const additional = ADDITIONAL_PROPERTY_FLAG3 in schema;
   const hasDescription = !!rawDescription;
   const classNamesList = ["form-group", classNames];
@@ -3481,14 +3535,14 @@ function WrapIfAdditionalTemplate(props) {
   }
   const uiClassNames = classNamesList.join(" ").trim();
   if (!additional) {
-    return /* @__PURE__ */ jsx38("div", { className: uiClassNames, style, children });
+    return /* @__PURE__ */ jsx40("div", { className: uiClassNames, style, children });
   }
   const margin = hasDescription ? 46 : 26;
-  return /* @__PURE__ */ jsx38("div", { className: uiClassNames, style, children: /* @__PURE__ */ jsxs14("div", { className: "row", children: [
-    /* @__PURE__ */ jsx38("div", { className: "col-xs-5 form-additional", children: /* @__PURE__ */ jsxs14("div", { className: "form-group", children: [
-      displayLabel && /* @__PURE__ */ jsx38(Label, { label: keyLabel, required, id: `${id}-key` }),
-      displayLabel && rawDescription && /* @__PURE__ */ jsx38("div", { children: "\xA0" }),
-      /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx40("div", { className: uiClassNames, style, children: /* @__PURE__ */ jsxs15("div", { className: "row", children: [
+    /* @__PURE__ */ jsx40("div", { className: "col-xs-5 form-additional", children: /* @__PURE__ */ jsxs15("div", { className: "form-group", children: [
+      displayLabel && /* @__PURE__ */ jsx40(Label, { label: keyLabel, required, id: `${id}-key` }),
+      displayLabel && rawDescription && /* @__PURE__ */ jsx40("div", { children: "\xA0" }),
+      /* @__PURE__ */ jsx40(
         "input",
         {
           className: "form-control",
@@ -3500,8 +3554,8 @@ function WrapIfAdditionalTemplate(props) {
         label
       )
     ] }) }),
-    /* @__PURE__ */ jsx38("div", { className: "form-additional form-group col-xs-5", children }),
-    /* @__PURE__ */ jsx38("div", { className: "col-xs-2", style: { marginTop: displayLabel ? `${margin}px` : void 0 }, children: /* @__PURE__ */ jsx38(
+    /* @__PURE__ */ jsx40("div", { className: "form-additional form-group col-xs-5", children }),
+    /* @__PURE__ */ jsx40("div", { className: "col-xs-2", style: { marginTop: displayLabel ? `${margin}px` : void 0 }, children: /* @__PURE__ */ jsx40(
       RemoveButton2,
       {
         id: buttonId4(id, "remove"),
@@ -3526,6 +3580,7 @@ function templates() {
     ArrayFieldTitleTemplate,
     ButtonTemplates: ButtonTemplates_default(),
     BaseInputTemplate,
+    CyclicSchemaExpandTemplate,
     DescriptionFieldTemplate: DescriptionField,
     ErrorListTemplate: ErrorList,
     FallbackFieldTemplate,
@@ -3544,27 +3599,27 @@ function templates() {
 var templates_default = templates;
 
 // src/components/widgets/AltDateTimeWidget.tsx
-import { jsx as jsx39 } from "react/jsx-runtime";
+import { jsx as jsx41 } from "react/jsx-runtime";
 function AltDateTimeWidget({
   time = true,
   ...props
 }) {
   const { AltDateWidget: AltDateWidget2 } = props.registry.widgets;
-  return /* @__PURE__ */ jsx39(AltDateWidget2, { time, ...props });
+  return /* @__PURE__ */ jsx41(AltDateWidget2, { time, ...props });
 }
 var AltDateTimeWidget_default = AltDateTimeWidget;
 
 // src/components/widgets/AltDateWidget.tsx
-import { DateElement, TranslatableString as TranslatableString13, useAltDateWidgetProps } from "@rjsf/utils";
-import { jsx as jsx40, jsxs as jsxs15 } from "react/jsx-runtime";
+import { DateElement, TranslatableString as TranslatableString14, useAltDateWidgetProps } from "@rjsf/utils";
+import { jsx as jsx42, jsxs as jsxs16 } from "react/jsx-runtime";
 function AltDateWidget(props) {
   const { disabled = false, readonly = false, autofocus = false, options, id, name, registry, onBlur, onFocus } = props;
   const { translateString } = registry;
   const { elements, handleChange, handleClear, handleSetNow } = useAltDateWidgetProps(props);
-  return /* @__PURE__ */ jsxs15("ul", { className: "list-inline", children: [
+  return /* @__PURE__ */ jsxs16("ul", { className: "list-inline", children: [
     elements.map((elemProps, i) => (
       // oxlint-disable-next-line react/no-array-index-key
-      /* @__PURE__ */ jsx40("li", { className: "list-inline-item", children: /* @__PURE__ */ jsx40(
+      /* @__PURE__ */ jsx42("li", { className: "list-inline-item", children: /* @__PURE__ */ jsx42(
         DateElement,
         {
           rootId: id,
@@ -3580,14 +3635,14 @@ function AltDateWidget(props) {
         }
       ) }, i)
     )),
-    (options.hideNowButton !== "undefined" ? !options.hideNowButton : true) && /* @__PURE__ */ jsx40("li", { className: "list-inline-item", children: /* @__PURE__ */ jsx40("button", { type: "button", className: "btn btn-info btn-now", onClick: handleSetNow, children: translateString(TranslatableString13.NowLabel) }) }),
-    (options.hideClearButton !== "undefined" ? !options.hideClearButton : true) && /* @__PURE__ */ jsx40("li", { className: "list-inline-item", children: /* @__PURE__ */ jsx40("button", { type: "button", className: "btn btn-warning btn-clear", onClick: handleClear, children: translateString(TranslatableString13.ClearLabel) }) })
+    (options.hideNowButton !== "undefined" ? !options.hideNowButton : true) && /* @__PURE__ */ jsx42("li", { className: "list-inline-item", children: /* @__PURE__ */ jsx42("button", { type: "button", className: "btn btn-info btn-now", onClick: handleSetNow, children: translateString(TranslatableString14.NowLabel) }) }),
+    (options.hideClearButton !== "undefined" ? !options.hideClearButton : true) && /* @__PURE__ */ jsx42("li", { className: "list-inline-item", children: /* @__PURE__ */ jsx42("button", { type: "button", className: "btn btn-warning btn-clear", onClick: handleClear, children: translateString(TranslatableString14.ClearLabel) }) })
   ] });
 }
 var AltDateWidget_default = AltDateWidget;
 
 // src/components/widgets/CheckboxesWidget.tsx
-import { useCallback as useCallback8 } from "react";
+import { useCallback as useCallback9 } from "react";
 import {
   ariaDescribedByIds as ariaDescribedByIds2,
   enumOptionValueDecoder,
@@ -3598,7 +3653,7 @@ import {
   getOptionValueFormat,
   optionId
 } from "@rjsf/utils";
-import { jsx as jsx41, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx43, jsxs as jsxs17 } from "react/jsx-runtime";
 function CheckboxesWidget({
   id,
   disabled,
@@ -3614,15 +3669,15 @@ function CheckboxesWidget({
   const { inline = false, enumOptions, enumDisabled, emptyValue } = options;
   const optionValueFormat = getOptionValueFormat(options);
   const checkboxesValues = Array.isArray(value) ? value : [value];
-  const handleBlur = useCallback8(
-    ({ target }) => onBlur(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue)),
+  const handleBlur = useCallback9(
+    ({ target }) => onBlur(id, enumOptionValueDecoder(target?.value, enumOptions, optionValueFormat, emptyValue)),
     [onBlur, id, enumOptions, emptyValue, optionValueFormat]
   );
-  const handleFocus = useCallback8(
-    ({ target }) => onFocus(id, enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue)),
+  const handleFocus = useCallback9(
+    ({ target }) => onFocus(id, enumOptionValueDecoder(target?.value, enumOptions, optionValueFormat, emptyValue)),
     [onFocus, id, enumOptions, emptyValue, optionValueFormat]
   );
-  return /* @__PURE__ */ jsx41("div", { className: "checkboxes", id, children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
+  return /* @__PURE__ */ jsx43("div", { className: "checkboxes", id, children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
     const checked = enumOptionsIsSelected(option.value, checkboxesValues);
     const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.includes(option.value);
     const disabledCls = disabled || itemDisabled || readonly ? "disabled" : "";
@@ -3633,8 +3688,8 @@ function CheckboxesWidget({
         onChange(enumOptionsDeselectValue(index, checkboxesValues, enumOptions));
       }
     };
-    const checkbox = /* @__PURE__ */ jsxs16("span", { children: [
-      /* @__PURE__ */ jsx41(
+    const checkbox = /* @__PURE__ */ jsxs17("span", { children: [
+      /* @__PURE__ */ jsx43(
         "input",
         {
           type: "checkbox",
@@ -3650,24 +3705,24 @@ function CheckboxesWidget({
           "aria-describedby": ariaDescribedByIds2(id)
         }
       ),
-      /* @__PURE__ */ jsx41("span", { children: option.label })
+      /* @__PURE__ */ jsx43("span", { children: option.label })
     ] });
-    return inline ? /* @__PURE__ */ jsx41("label", { className: `checkbox-inline ${disabledCls}`, children: checkbox }, String(option.value)) : /* @__PURE__ */ jsx41("div", { className: `checkbox ${disabledCls}`, children: /* @__PURE__ */ jsx41("label", { children: checkbox }) }, String(option.value));
+    return inline ? /* @__PURE__ */ jsx43("label", { className: `checkbox-inline ${disabledCls}`, children: checkbox }, String(option.value)) : /* @__PURE__ */ jsx43("div", { className: `checkbox ${disabledCls}`, children: /* @__PURE__ */ jsx43("label", { children: checkbox }) }, String(option.value));
   }) });
 }
 var CheckboxesWidget_default = CheckboxesWidget;
 
 // src/components/widgets/CheckboxWidget.tsx
-import { useCallback as useCallback9 } from "react";
+import { useCallback as useCallback10 } from "react";
 import {
   ariaDescribedByIds as ariaDescribedByIds3,
   descriptionId as descriptionId4,
-  getTemplate as getTemplate17,
+  getTemplate as getTemplate18,
   labelValue,
   schemaRequiresTrueValue,
-  getUiOptions as getUiOptions20
+  getUiOptions as getUiOptions22
 } from "@rjsf/utils";
-import { jsx as jsx42, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs18 } from "react/jsx-runtime";
 function CheckboxWidget({
   schema,
   uiSchema,
@@ -3685,29 +3740,29 @@ function CheckboxWidget({
   registry,
   htmlName
 }) {
-  const DescriptionFieldTemplate = getTemplate17(
+  const DescriptionFieldTemplate = getTemplate18(
     "DescriptionFieldTemplate",
     registry,
     options
   );
   const required = schemaRequiresTrueValue(schema);
-  const handleChange = useCallback9(
+  const handleChange = useCallback10(
     (event) => onChange(event.target.checked),
     [onChange]
   );
-  const handleBlur = useCallback9(
+  const handleBlur = useCallback10(
     (event) => onBlur(id, event.target.checked),
     [onBlur, id]
   );
-  const handleFocus = useCallback9(
+  const handleFocus = useCallback10(
     (event) => onFocus(id, event.target.checked),
     [onFocus, id]
   );
-  const uiOptions = getUiOptions20(uiSchema);
+  const uiOptions = getUiOptions22(uiSchema);
   const isCheckboxWidget = uiOptions.widget === "checkbox";
   const description = isCheckboxWidget ? void 0 : options.description ?? schema.description;
-  return /* @__PURE__ */ jsxs17("div", { className: `checkbox ${disabled || readonly ? "disabled" : ""}`, children: [
-    !hideLabel && description && /* @__PURE__ */ jsx42(
+  return /* @__PURE__ */ jsxs18("div", { className: `checkbox ${disabled || readonly ? "disabled" : ""}`, children: [
+    !hideLabel && description && /* @__PURE__ */ jsx44(
       DescriptionFieldTemplate,
       {
         id: descriptionId4(id),
@@ -3717,8 +3772,8 @@ function CheckboxWidget({
         registry
       }
     ),
-    /* @__PURE__ */ jsxs17("label", { children: [
-      /* @__PURE__ */ jsx42(
+    /* @__PURE__ */ jsxs18("label", { children: [
+      /* @__PURE__ */ jsx44(
         "input",
         {
           type: "checkbox",
@@ -3734,28 +3789,28 @@ function CheckboxWidget({
           "aria-describedby": ariaDescribedByIds3(id)
         }
       ),
-      labelValue(/* @__PURE__ */ jsx42("span", { children: label }), hideLabel)
+      labelValue(/* @__PURE__ */ jsx44("span", { children: label }), hideLabel)
     ] })
   ] });
 }
 var CheckboxWidget_default = CheckboxWidget;
 
 // src/components/widgets/ColorWidget.tsx
-import { getTemplate as getTemplate18 } from "@rjsf/utils";
-import { jsx as jsx43 } from "react/jsx-runtime";
+import { getTemplate as getTemplate19 } from "@rjsf/utils";
+import { jsx as jsx45 } from "react/jsx-runtime";
 function ColorWidget(props) {
   const { disabled, readonly, options, registry } = props;
-  const BaseInputTemplate2 = getTemplate18("BaseInputTemplate", registry, options);
-  return /* @__PURE__ */ jsx43(BaseInputTemplate2, { type: "color", ...props, disabled: disabled || readonly });
+  const BaseInputTemplate2 = getTemplate19("BaseInputTemplate", registry, options);
+  return /* @__PURE__ */ jsx45(BaseInputTemplate2, { type: "color", ...props, disabled: disabled || readonly });
 }
 
 // src/components/widgets/DateTimeWidget.tsx
-import { getTemplate as getTemplate19, localToUTC, utcToLocal } from "@rjsf/utils";
-import { jsx as jsx44 } from "react/jsx-runtime";
+import { getTemplate as getTemplate20, localToUTC, utcToLocal } from "@rjsf/utils";
+import { jsx as jsx46 } from "react/jsx-runtime";
 function DateTimeWidget(props) {
   const { onChange, value, options, registry } = props;
-  const BaseInputTemplate2 = getTemplate19("BaseInputTemplate", registry, options);
-  return /* @__PURE__ */ jsx44(
+  const BaseInputTemplate2 = getTemplate20("BaseInputTemplate", registry, options);
+  return /* @__PURE__ */ jsx46(
     BaseInputTemplate2,
     {
       type: "datetime-local",
@@ -3767,29 +3822,29 @@ function DateTimeWidget(props) {
 }
 
 // src/components/widgets/DateWidget.tsx
-import { useCallback as useCallback10 } from "react";
-import { getTemplate as getTemplate20 } from "@rjsf/utils";
-import { jsx as jsx45 } from "react/jsx-runtime";
+import { useCallback as useCallback11 } from "react";
+import { getTemplate as getTemplate21 } from "@rjsf/utils";
+import { jsx as jsx47 } from "react/jsx-runtime";
 function DateWidget(props) {
   const { onChange, options, registry } = props;
-  const BaseInputTemplate2 = getTemplate20("BaseInputTemplate", registry, options);
-  const handleChange = useCallback10((value) => onChange(value || void 0), [onChange]);
-  return /* @__PURE__ */ jsx45(BaseInputTemplate2, { type: "date", ...props, onChange: handleChange });
+  const BaseInputTemplate2 = getTemplate21("BaseInputTemplate", registry, options);
+  const handleChange = useCallback11((value) => onChange(value || void 0), [onChange]);
+  return /* @__PURE__ */ jsx47(BaseInputTemplate2, { type: "date", ...props, onChange: handleChange });
 }
 
 // src/components/widgets/EmailWidget.tsx
-import { getTemplate as getTemplate21 } from "@rjsf/utils";
-import { jsx as jsx46 } from "react/jsx-runtime";
+import { getTemplate as getTemplate22 } from "@rjsf/utils";
+import { jsx as jsx48 } from "react/jsx-runtime";
 function EmailWidget(props) {
   const { options, registry } = props;
-  const BaseInputTemplate2 = getTemplate21("BaseInputTemplate", registry, options);
-  return /* @__PURE__ */ jsx46(BaseInputTemplate2, { type: "email", ...props });
+  const BaseInputTemplate2 = getTemplate22("BaseInputTemplate", registry, options);
+  return /* @__PURE__ */ jsx48(BaseInputTemplate2, { type: "email", ...props });
 }
 
 // src/components/widgets/FileWidget.tsx
-import { getTemplate as getTemplate22, TranslatableString as TranslatableString14, useFileWidgetProps } from "@rjsf/utils";
+import { getTemplate as getTemplate23, TranslatableString as TranslatableString15, useFileWidgetProps } from "@rjsf/utils";
 import { Markdown as Markdown5 } from "markdown-to-jsx/react";
-import { Fragment as Fragment4, jsx as jsx47, jsxs as jsxs18 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx49, jsxs as jsxs19 } from "react/jsx-runtime";
 function FileInfoPreview({
   fileInfo,
   registry
@@ -3799,13 +3854,13 @@ function FileInfoPreview({
   if (!dataURL) {
     return null;
   }
-  const previewLabel = translateString(TranslatableString14.PreviewLabel);
+  const previewLabel = translateString(TranslatableString15.PreviewLabel);
   if (["image/jpeg", "image/png"].includes(type)) {
-    return /* @__PURE__ */ jsx47("img", { src: dataURL, alt: previewLabel, style: { maxWidth: "100%" }, className: "file-preview" });
+    return /* @__PURE__ */ jsx49("img", { src: dataURL, alt: previewLabel, style: { maxWidth: "100%" }, className: "file-preview" });
   }
-  return /* @__PURE__ */ jsxs18(Fragment4, { children: [
+  return /* @__PURE__ */ jsxs19(Fragment4, { children: [
     " ",
-    /* @__PURE__ */ jsx47("a", { download: `preview-${name}`, href: dataURL, className: "file-download", children: previewLabel })
+    /* @__PURE__ */ jsx49("a", { download: `preview-${name}`, href: dataURL, className: "file-download", children: previewLabel })
   ] });
 }
 function FilesInfo({
@@ -3819,16 +3874,16 @@ function FilesInfo({
     return null;
   }
   const { translateString } = registry;
-  const { RemoveButton: RemoveButton2 } = getTemplate22("ButtonTemplates", registry, options);
-  return /* @__PURE__ */ jsx47("ul", { className: "file-info", children: filesInfo.map((fileInfo, key) => {
+  const { RemoveButton: RemoveButton2 } = getTemplate23("ButtonTemplates", registry, options);
+  return /* @__PURE__ */ jsx49("ul", { className: "file-info", children: filesInfo.map((fileInfo, key) => {
     const { name, size, type } = fileInfo;
     const handleRemove = () => onRemove(key);
     return (
       // oxlint-disable-next-line react/no-array-index-key
-      /* @__PURE__ */ jsxs18("li", { children: [
-        /* @__PURE__ */ jsx47(Markdown5, { children: translateString(TranslatableString14.FilesInfo, [name, type, String(size)]) }),
-        preview && /* @__PURE__ */ jsx47(FileInfoPreview, { fileInfo, registry }),
-        /* @__PURE__ */ jsx47(RemoveButton2, { onClick: handleRemove, registry })
+      /* @__PURE__ */ jsxs19("li", { children: [
+        /* @__PURE__ */ jsx49(Markdown5, { children: translateString(TranslatableString15.FilesInfo, [name, type, String(size)]) }),
+        preview && /* @__PURE__ */ jsx49(FileInfoPreview, { fileInfo, registry }),
+        /* @__PURE__ */ jsx49(RemoveButton2, { onClick: handleRemove, registry })
       ] }, key)
     );
   }) });
@@ -3836,14 +3891,14 @@ function FilesInfo({
 function FileWidget(props) {
   const { disabled, readonly, required, multiple, onChange, value, options, registry } = props;
   const { filesInfo, handleChange, handleRemove } = useFileWidgetProps(value, onChange, multiple);
-  const BaseInputTemplate2 = getTemplate22("BaseInputTemplate", registry, options);
+  const BaseInputTemplate2 = getTemplate23("BaseInputTemplate", registry, options);
   const handleOnChangeEvent = (event) => {
     if (event.target.files) {
       void handleChange(event.target.files);
     }
   };
-  return /* @__PURE__ */ jsxs18("div", { children: [
-    /* @__PURE__ */ jsx47(
+  return /* @__PURE__ */ jsxs19("div", { children: [
+    /* @__PURE__ */ jsx49(
       BaseInputTemplate2,
       {
         ...props,
@@ -3855,7 +3910,7 @@ function FileWidget(props) {
         accept: options.accept ? String(options.accept) : void 0
       }
     ),
-    /* @__PURE__ */ jsx47(
+    /* @__PURE__ */ jsx49(
       FilesInfo,
       {
         filesInfo,
@@ -3870,27 +3925,27 @@ function FileWidget(props) {
 var FileWidget_default = FileWidget;
 
 // src/components/widgets/HiddenWidget.tsx
-import { jsx as jsx48 } from "react/jsx-runtime";
+import { jsx as jsx50 } from "react/jsx-runtime";
 function HiddenWidget({
   id,
   value,
   htmlName
 }) {
-  return /* @__PURE__ */ jsx48("input", { type: "hidden", id, name: htmlName || id, value: typeof value === "undefined" ? "" : value });
+  return /* @__PURE__ */ jsx50("input", { type: "hidden", id, name: htmlName || id, value: typeof value === "undefined" ? "" : value });
 }
 var HiddenWidget_default = HiddenWidget;
 
 // src/components/widgets/PasswordWidget.tsx
-import { getTemplate as getTemplate23 } from "@rjsf/utils";
-import { jsx as jsx49 } from "react/jsx-runtime";
+import { getTemplate as getTemplate24 } from "@rjsf/utils";
+import { jsx as jsx51 } from "react/jsx-runtime";
 function PasswordWidget(props) {
   const { options, registry } = props;
-  const BaseInputTemplate2 = getTemplate23("BaseInputTemplate", registry, options);
-  return /* @__PURE__ */ jsx49(BaseInputTemplate2, { type: "password", ...props });
+  const BaseInputTemplate2 = getTemplate24("BaseInputTemplate", registry, options);
+  return /* @__PURE__ */ jsx51(BaseInputTemplate2, { type: "password", ...props });
 }
 
 // src/components/widgets/RadioWidget.tsx
-import { useCallback as useCallback11 } from "react";
+import { useCallback as useCallback12 } from "react";
 import {
   ariaDescribedByIds as ariaDescribedByIds4,
   enumOptionValueDecoder as enumOptionValueDecoder2,
@@ -3899,7 +3954,7 @@ import {
   getOptionValueFormat as getOptionValueFormat2,
   optionId as optionId2
 } from "@rjsf/utils";
-import { jsx as jsx50, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs20 } from "react/jsx-runtime";
 function RadioWidget({
   options,
   value,
@@ -3915,21 +3970,21 @@ function RadioWidget({
 }) {
   const { enumOptions, enumDisabled, inline, emptyValue } = options;
   const optionValueFormat = getOptionValueFormat2(options);
-  const handleBlur = useCallback11(
-    ({ target }) => onBlur(id, enumOptionValueDecoder2(target && target.value, enumOptions, optionValueFormat, emptyValue)),
+  const handleBlur = useCallback12(
+    ({ target }) => onBlur(id, enumOptionValueDecoder2(target?.value, enumOptions, optionValueFormat, emptyValue)),
     [onBlur, enumOptions, emptyValue, id, optionValueFormat]
   );
-  const handleFocus = useCallback11(
-    ({ target }) => onFocus(id, enumOptionValueDecoder2(target && target.value, enumOptions, optionValueFormat, emptyValue)),
+  const handleFocus = useCallback12(
+    ({ target }) => onFocus(id, enumOptionValueDecoder2(target?.value, enumOptions, optionValueFormat, emptyValue)),
     [onFocus, enumOptions, emptyValue, id, optionValueFormat]
   );
-  return /* @__PURE__ */ jsx50("div", { className: "field-radio-group", id, role: "radiogroup", children: Array.isArray(enumOptions) && enumOptions.map((option, i) => {
+  return /* @__PURE__ */ jsx52("div", { className: "field-radio-group", id, role: "radiogroup", children: Array.isArray(enumOptions) && enumOptions.map((option, i) => {
     const checked = enumOptionsIsSelected2(option.value, value);
     const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.includes(option.value);
     const disabledCls = disabled || itemDisabled || readonly ? "disabled" : "";
     const handleChange = () => onChange(option.value);
-    const radio = /* @__PURE__ */ jsxs19("span", { children: [
-      /* @__PURE__ */ jsx50(
+    const radio = /* @__PURE__ */ jsxs20("span", { children: [
+      /* @__PURE__ */ jsx52(
         "input",
         {
           type: "radio",
@@ -3946,15 +4001,15 @@ function RadioWidget({
           "aria-describedby": ariaDescribedByIds4(id)
         }
       ),
-      /* @__PURE__ */ jsx50("span", { children: option.label })
+      /* @__PURE__ */ jsx52("span", { children: option.label })
     ] });
-    return inline ? /* @__PURE__ */ jsx50("label", { className: `radio-inline ${disabledCls}`, children: radio }, String(option.value)) : /* @__PURE__ */ jsx50("div", { className: `radio ${disabledCls}`, children: /* @__PURE__ */ jsx50("label", { children: radio }) }, String(option.value));
+    return inline ? /* @__PURE__ */ jsx52("label", { className: `radio-inline ${disabledCls}`, children: radio }, String(option.value)) : /* @__PURE__ */ jsx52("div", { className: `radio ${disabledCls}`, children: /* @__PURE__ */ jsx52("label", { children: radio }) }, String(option.value));
   }) });
 }
 var RadioWidget_default = RadioWidget;
 
 // src/components/widgets/RangeWidget.tsx
-import { jsx as jsx51, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx53, jsxs as jsxs21 } from "react/jsx-runtime";
 function RangeWidget(props) {
   const {
     value,
@@ -3962,15 +4017,15 @@ function RangeWidget(props) {
       templates: { BaseInputTemplate: BaseInputTemplate2 }
     }
   } = props;
-  return /* @__PURE__ */ jsxs20("div", { className: "field-range-wrapper", children: [
-    /* @__PURE__ */ jsx51(BaseInputTemplate2, { type: "range", ...props }),
-    /* @__PURE__ */ jsx51("span", { className: "range-view", children: value })
+  return /* @__PURE__ */ jsxs21("div", { className: "field-range-wrapper", children: [
+    /* @__PURE__ */ jsx53(BaseInputTemplate2, { type: "range", ...props }),
+    /* @__PURE__ */ jsx53("span", { className: "range-view", children: value })
   ] });
 }
 
 // src/components/widgets/RatingWidget.tsx
-import { useCallback as useCallback12 } from "react";
-import { jsx as jsx52, jsxs as jsxs21 } from "react/jsx-runtime";
+import { useCallback as useCallback13 } from "react";
+import { jsx as jsx54, jsxs as jsxs22 } from "react/jsx-runtime";
 function RatingWidget({
   id,
   value,
@@ -3988,7 +4043,7 @@ function RatingWidget({
   const { stars = 5, shape = "star" } = options;
   const numStars = schema.maximum ? Math.min(schema.maximum, 5) : Math.min(Math.max(stars, 1), 5);
   const min = schema.minimum || 0;
-  const handleStarClick = useCallback12(
+  const handleStarClick = useCallback13(
     (starValue) => {
       if (!disabled && !readonly) {
         onChange(starValue);
@@ -3996,7 +4051,7 @@ function RatingWidget({
     },
     [onChange, disabled, readonly]
   );
-  const handleFocus = useCallback12(
+  const handleFocus = useCallback13(
     (event) => {
       if (onFocus) {
         const starValue = Number(event.target.dataset.value);
@@ -4005,7 +4060,7 @@ function RatingWidget({
     },
     [onFocus, id]
   );
-  const handleBlur = useCallback12(
+  const handleBlur = useCallback13(
     (event) => {
       if (onBlur) {
         const starValue = Number(event.target.dataset.value);
@@ -4020,7 +4075,7 @@ function RatingWidget({
     }
     return isFilled ? "\u2605" : "\u2606";
   };
-  return /* @__PURE__ */ jsxs21(
+  return /* @__PURE__ */ jsxs22(
     "div",
     {
       className: "rating-widget",
@@ -4033,7 +4088,7 @@ function RatingWidget({
         [...Array(numStars)].map((_, index) => {
           const starValue = min + index;
           const isFilled = starValue <= value;
-          return /* @__PURE__ */ jsx52(
+          return /* @__PURE__ */ jsx54(
             "span",
             {
               onClick: () => handleStarClick(starValue),
@@ -4056,7 +4111,7 @@ function RatingWidget({
             index
           );
         }),
-        /* @__PURE__ */ jsx52(
+        /* @__PURE__ */ jsx54(
           "input",
           {
             type: "hidden",
@@ -4074,15 +4129,17 @@ function RatingWidget({
 }
 
 // src/components/widgets/SelectWidget.tsx
-import { useCallback as useCallback13 } from "react";
+import { useCallback as useCallback14 } from "react";
 import {
   ariaDescribedByIds as ariaDescribedByIds5,
   enumOptionSelectedValue,
   enumOptionValueDecoder as enumOptionValueDecoder3,
   enumOptionValueEncoder as enumOptionValueEncoder3,
-  getOptionValueFormat as getOptionValueFormat3
+  getOptionValueFormat as getOptionValueFormat3,
+  logUnsupportedDefaultForEnum,
+  SelectedOptionDescription
 } from "@rjsf/utils";
-import { jsx as jsx53, jsxs as jsxs22 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx55, jsxs as jsxs23 } from "react/jsx-runtime";
 function getValue(event, multiple) {
   if (multiple) {
     return Array.from(event.target.options).slice().filter((o) => o.selected).map((o) => o.value);
@@ -4103,26 +4160,28 @@ function SelectWidget({
   onBlur,
   onFocus,
   placeholder,
-  htmlName
+  htmlName,
+  registry,
+  uiSchema
 }) {
   const { enumOptions, enumDisabled, emptyValue: optEmptyVal } = options;
   const emptyValue = multiple ? [] : "";
   const optionValueFormat = getOptionValueFormat3(options);
-  const handleFocus = useCallback13(
+  const handleFocus = useCallback14(
     (event) => {
       const newValue = getValue(event, multiple);
       return onFocus(id, enumOptionValueDecoder3(newValue, enumOptions, optionValueFormat, optEmptyVal));
     },
     [onFocus, id, multiple, enumOptions, optEmptyVal, optionValueFormat]
   );
-  const handleBlur = useCallback13(
+  const handleBlur = useCallback14(
     (event) => {
       const newValue = getValue(event, multiple);
       return onBlur(id, enumOptionValueDecoder3(newValue, enumOptions, optionValueFormat, optEmptyVal));
     },
     [onBlur, id, multiple, enumOptions, optEmptyVal, optionValueFormat]
   );
-  const handleChange = useCallback13(
+  const handleChange = useCallback14(
     (event) => {
       const newValue = getValue(event, multiple);
       return onChange(enumOptionValueDecoder3(newValue, enumOptions, optionValueFormat, optEmptyVal));
@@ -4131,9 +4190,20 @@ function SelectWidget({
   );
   const selectValue = enumOptionSelectedValue(value, enumOptions, multiple, optionValueFormat, emptyValue);
   const showPlaceholderOption = !multiple && schema.default === void 0;
-  return (
-    // oxlint-disable-next-line jsx-a11y/no-autofocus
-    /* @__PURE__ */ jsxs22(
+  logUnsupportedDefaultForEnum(id, schema, enumOptions, multiple);
+  return /* @__PURE__ */ jsxs23(Fragment5, { children: [
+    /* @__PURE__ */ jsx55(
+      SelectedOptionDescription,
+      {
+        id,
+        multiple,
+        options,
+        registry,
+        uiSchema,
+        value
+      }
+    ),
+    /* @__PURE__ */ jsxs23(
       "select",
       {
         id,
@@ -4149,10 +4219,10 @@ function SelectWidget({
         onChange: handleChange,
         "aria-describedby": ariaDescribedByIds5(id),
         children: [
-          showPlaceholderOption && /* @__PURE__ */ jsx53("option", { value: "", children: placeholder }),
+          showPlaceholderOption && /* @__PURE__ */ jsx55("option", { value: "", children: placeholder }),
           Array.isArray(enumOptions) && enumOptions.map(({ value: enumValue, label: enumLabel }, i) => {
             const isDisabled = enumDisabled && enumDisabled.includes(enumValue);
-            return /* @__PURE__ */ jsx53(
+            return /* @__PURE__ */ jsx55(
               "option",
               {
                 value: enumOptionValueEncoder3(enumValue, i, optionValueFormat),
@@ -4165,17 +4235,17 @@ function SelectWidget({
         ]
       }
     )
-  );
+  ] });
 }
 var SelectWidget_default = SelectWidget;
 
 // src/components/widgets/TextareaWidget.tsx
-import { useCallback as useCallback14 } from "react";
+import { useCallback as useCallback15 } from "react";
 import { ariaDescribedByIds as ariaDescribedByIds6 } from "@rjsf/utils";
-import { jsx as jsx54 } from "react/jsx-runtime";
+import { jsx as jsx56 } from "react/jsx-runtime";
 function TextareaWidget({
   id,
-  options = {},
+  options,
   placeholder,
   value,
   required,
@@ -4187,19 +4257,19 @@ function TextareaWidget({
   onFocus,
   htmlName
 }) {
-  const handleChange = useCallback14(
+  const handleChange = useCallback15(
     ({ target: { value: newValue } }) => onChange(newValue === "" ? options.emptyValue : newValue),
     [onChange, options.emptyValue]
   );
-  const handleBlur = useCallback14(
-    ({ target }) => onBlur(id, target && target.value),
+  const handleBlur = useCallback15(
+    ({ target }) => onBlur(id, target?.value),
     [onBlur, id]
   );
-  const handleFocus = useCallback14(
-    ({ target }) => onFocus(id, target && target.value),
+  const handleFocus = useCallback15(
+    ({ target }) => onFocus(id, target?.value),
     [id, onFocus]
   );
-  return /* @__PURE__ */ jsx54(
+  return /* @__PURE__ */ jsx56(
     "textarea",
     {
       id,
@@ -4222,41 +4292,41 @@ function TextareaWidget({
 var TextareaWidget_default = TextareaWidget;
 
 // src/components/widgets/TextWidget.tsx
-import { getTemplate as getTemplate24 } from "@rjsf/utils";
-import { jsx as jsx55 } from "react/jsx-runtime";
+import { getTemplate as getTemplate25 } from "@rjsf/utils";
+import { jsx as jsx57 } from "react/jsx-runtime";
 function TextWidget(props) {
   const { options, registry } = props;
-  const BaseInputTemplate2 = getTemplate24("BaseInputTemplate", registry, options);
-  return /* @__PURE__ */ jsx55(BaseInputTemplate2, { ...props });
+  const BaseInputTemplate2 = getTemplate25("BaseInputTemplate", registry, options);
+  return /* @__PURE__ */ jsx57(BaseInputTemplate2, { ...props });
 }
 
 // src/components/widgets/TimeWidget.tsx
-import { useCallback as useCallback15 } from "react";
-import { getTemplate as getTemplate25 } from "@rjsf/utils";
-import { jsx as jsx56 } from "react/jsx-runtime";
+import { useCallback as useCallback16 } from "react";
+import { getTemplate as getTemplate26 } from "@rjsf/utils";
+import { jsx as jsx58 } from "react/jsx-runtime";
 function TimeWidget(props) {
   const { onChange, options, registry } = props;
-  const BaseInputTemplate2 = getTemplate25("BaseInputTemplate", registry, options);
-  const handleChange = useCallback15((value) => onChange(value ? `${value}:00` : void 0), [onChange]);
-  return /* @__PURE__ */ jsx56(BaseInputTemplate2, { type: "time", ...props, onChange: handleChange });
+  const BaseInputTemplate2 = getTemplate26("BaseInputTemplate", registry, options);
+  const handleChange = useCallback16((value) => onChange(value ? `${value}:00` : void 0), [onChange]);
+  return /* @__PURE__ */ jsx58(BaseInputTemplate2, { type: "time", ...props, onChange: handleChange });
 }
 
 // src/components/widgets/UpDownWidget.tsx
-import { getTemplate as getTemplate26 } from "@rjsf/utils";
-import { jsx as jsx57 } from "react/jsx-runtime";
+import { getTemplate as getTemplate27 } from "@rjsf/utils";
+import { jsx as jsx59 } from "react/jsx-runtime";
 function UpDownWidget(props) {
   const { options, registry } = props;
-  const BaseInputTemplate2 = getTemplate26("BaseInputTemplate", registry, options);
-  return /* @__PURE__ */ jsx57(BaseInputTemplate2, { type: "number", ...props });
+  const BaseInputTemplate2 = getTemplate27("BaseInputTemplate", registry, options);
+  return /* @__PURE__ */ jsx59(BaseInputTemplate2, { type: "number", ...props });
 }
 
 // src/components/widgets/URLWidget.tsx
-import { getTemplate as getTemplate27 } from "@rjsf/utils";
-import { jsx as jsx58 } from "react/jsx-runtime";
+import { getTemplate as getTemplate28 } from "@rjsf/utils";
+import { jsx as jsx60 } from "react/jsx-runtime";
 function URLWidget(props) {
   const { options, registry } = props;
-  const BaseInputTemplate2 = getTemplate27("BaseInputTemplate", registry, options);
-  return /* @__PURE__ */ jsx58(BaseInputTemplate2, { type: "url", ...props });
+  const BaseInputTemplate2 = getTemplate28("BaseInputTemplate", registry, options);
+  return /* @__PURE__ */ jsx60(BaseInputTemplate2, { type: "url", ...props });
 }
 
 // src/components/widgets/index.ts
@@ -4304,14 +4374,14 @@ function getDefaultRegistry() {
 }
 
 // src/components/Form.tsx
-import { jsx as jsx59, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx61, jsxs as jsxs24 } from "react/jsx-runtime";
 function toIChangeEvent(state, status) {
   return {
     ..._pick(state, ["schema", "uiSchema", "fieldPathId", "schemaUtils", "formData", "edit", "errors", "errorSchema"]),
     ...status !== void 0 && { status }
   };
 }
-var Form = class _Form extends Component3 {
+var Form = class _Form extends Component {
   /** The ref used to hold the `form` element, this needs to be `any` because `tagName` or `_internalFormWrapper` can
    * provide any possible type here
    */
@@ -4368,7 +4438,7 @@ var Form = class _Form extends Component3 {
       ...this.getStateFromProps(props, formData, void 0, void 0, void 0, true),
       prevExtraErrors: props.extraErrors
     };
-    if (onChange && !deepEquals2(this.state.formData, formData)) {
+    if (onChange && !deepEquals3(this.state.formData, formData)) {
       onChange(toIChangeEvent(this.state));
     }
     this.formElement = createRef();
@@ -4392,12 +4462,12 @@ var Form = class _Form extends Component3 {
    *        with a flag indicating that an update is not necessary.
    */
   getSnapshotBeforeUpdate(prevProps, prevState) {
-    if (!deepEquals2(this.props, prevProps)) {
+    if (!deepEquals3(this.props, prevProps)) {
       const formDataChangedFields = getChangedFields(this.props.formData, prevProps.formData);
       const stateDataChangedFields = getChangedFields(this.props.formData, this.state.formData);
-      const isSchemaChanged = !deepEquals2(prevProps.schema, this.props.schema);
-      const isFormDataChanged = formDataChangedFields.length > 0 || !deepEquals2(prevProps.formData, this.props.formData);
-      const isStateDataChanged = stateDataChangedFields.length > 0 || !deepEquals2(this.state.formData, this.props.formData);
+      const isSchemaChanged = !deepEquals3(prevProps.schema, this.props.schema);
+      const isFormDataChanged = formDataChangedFields.length > 0 || !deepEquals3(prevProps.formData, this.props.formData);
+      const isStateDataChanged = stateDataChangedFields.length > 0 || !deepEquals3(this.state.formData, this.props.formData);
       const nextState = this.getStateFromProps(
         this.props,
         this.props.formData,
@@ -4410,7 +4480,7 @@ var Form = class _Form extends Component3 {
         // Skip live validation for this request if no form data has changed from the last state
         !isStateDataChanged
       );
-      const shouldUpdate = !deepEquals2(nextState, prevState);
+      const shouldUpdate = !deepEquals3(nextState, prevState);
       return { nextState, shouldUpdate };
     }
     return { shouldUpdate: false };
@@ -4430,13 +4500,13 @@ var Form = class _Form extends Component3 {
   componentDidUpdate(_, prevState, snapshot) {
     if (snapshot.shouldUpdate) {
       const { nextState } = snapshot;
-      const nextStateDiffersFromProps = !deepEquals2(nextState.formData, this.props.formData);
+      const nextStateDiffersFromProps = !deepEquals3(nextState.formData, this.props.formData);
       const wasProcessingUserChange = this.isProcessingUserChange;
       this.isProcessingUserChange = false;
       if (wasProcessingUserChange && nextStateDiffersFromProps) {
         return;
       }
-      if (nextStateDiffersFromProps && !deepEquals2(nextState.formData, prevState.formData) && this.props.onChange) {
+      if (nextStateDiffersFromProps && !deepEquals3(nextState.formData, prevState.formData) && this.props.onChange) {
         this.props.onChange(toIChangeEvent(nextState));
       }
       this.setState(nextState);
@@ -4498,21 +4568,21 @@ var Form = class _Form extends Component3 {
         false,
         state.initialDefaultsGenerated
       );
-      const formHash = shouldSanitize ? hashObject5({ formData }) : "";
+      const formHash = shouldSanitize ? hashObject6({ formData }) : "";
       computedRetrievedSchema = this.updateRetrievedSchema(
         retrievedSchema ?? schemaUtils.retrieveSchema(rootSchema, formData)
       );
-      if (shouldSanitize && !preventInfiniteSanitize.includes(formHash) && !deepEquals2(computedRetrievedSchema, state.retrievedSchema)) {
+      if (shouldSanitize && !preventInfiniteSanitize.includes(formHash) && !deepEquals3(computedRetrievedSchema, state.retrievedSchema)) {
         const sanitizedFormData = schemaUtils.sanitizeDataForNewSchema(
           computedRetrievedSchema,
           state.retrievedSchema,
           formData
         );
-        wasSanitized = !deepEquals2(sanitizedFormData, formData);
+        wasSanitized = !deepEquals3(sanitizedFormData, formData);
         if (wasSanitized) {
           formData = sanitizedFormData;
           defaultsFormData = sanitizedFormData;
-          const sanitizedFormHash = hashObject5({ formData: sanitizedFormData });
+          const sanitizedFormHash = hashObject6({ formData: sanitizedFormData });
           wasSanitized = !preventInfiniteSanitize.includes(sanitizedFormHash);
           preventInfiniteSanitize.push(sanitizedFormHash);
         }
@@ -4577,8 +4647,8 @@ var Form = class _Form extends Component3 {
       errorSchema = mergedErrors.errorSchema;
     }
     const newRegistry = _Form.getRegistry(props, rootSchema, schemaUtils);
-    const registry = deepEquals2(state.registry, newRegistry) ? state.registry : newRegistry;
-    const fieldPathId = state.fieldPathId && state.fieldPathId?.[ID_KEY5] === registry.globalFormOptions.idPrefix ? state.fieldPathId : toFieldPathId6("", registry.globalFormOptions);
+    const registry = deepEquals3(state.registry, newRegistry) ? state.registry : newRegistry;
+    const fieldPathId = state.fieldPathId && state.fieldPathId?.[ID_KEY6] === registry.globalFormOptions.idPrefix ? state.fieldPathId : toFieldPathId6("", registry.globalFormOptions);
     const nextState = {
       schemaUtils,
       schema: rootSchema,
@@ -4604,7 +4674,7 @@ var Form = class _Form extends Component3 {
    */
   shouldComponentUpdate(nextProps, nextState) {
     const { experimental_componentUpdateStrategy = "customDeep" } = this.props;
-    return shouldRender2(this, nextProps, nextState, experimental_componentUpdateStrategy);
+    return shouldRender(this, nextProps, nextState, experimental_componentUpdateStrategy);
   }
   /** Validates the `formData` against the `schema` using the `altSchemaUtils` (if provided otherwise it uses the
    * `schemaUtils` in the state), returning the results.
@@ -4618,15 +4688,16 @@ var Form = class _Form extends Component3 {
     const schemaUtils = altSchemaUtils || this.state.schemaUtils;
     const { customValidate, transformErrors, uiSchema } = this.props;
     const validationSchema = retrievedSchema ?? schema;
-    return schemaUtils.getValidator().validateFormData(formData, validationSchema, customValidate, transformErrors, uiSchema);
+    const validationFormData = formData ? JSON.parse(JSON.stringify(formData)) : void 0;
+    return schemaUtils.getValidator().validateFormData(validationFormData, validationSchema, customValidate, transformErrors, uiSchema);
   }
   /** Renders any errors contained in the `state` in using the `ErrorList`, if not disabled by `showErrorList`. */
   renderErrors(registry) {
     const { errors, errorSchema, schema, uiSchema } = this.state;
-    const options = getUiOptions21(uiSchema);
-    const ErrorListTemplate = getTemplate28("ErrorListTemplate", registry, options);
-    if (errors && errors.length) {
-      return /* @__PURE__ */ jsx59(
+    const options = getUiOptions23(uiSchema);
+    const ErrorListTemplate = getTemplate29("ErrorListTemplate", registry, options);
+    if (errors?.length) {
+      return /* @__PURE__ */ jsx61(
         ErrorListTemplate,
         {
           errors,
@@ -4729,7 +4800,7 @@ var Form = class _Form extends Component3 {
     const { registry } = this.state;
     const path = Array.isArray(fieldPath) ? fieldPath : fieldPath.split(".");
     const fieldPathId = toFieldPathId6("", registry.globalFormOptions, path);
-    this.onChange(newValue, path, void 0, fieldPathId[ID_KEY5]);
+    this.onChange(newValue, path, void 0, fieldPathId[ID_KEY6]);
   };
   /** Pushes the given change information into the `pendingChanges` array and then calls `processPendingChanges()` if
    * the array only contains a single pending change.
@@ -4772,10 +4843,10 @@ var Form = class _Form extends Component3 {
     const wasPreviouslyNull = oldFormData === null || oldFormData === void 0;
     const inputForDefaults = hasOnlyUndefinedValues && wasPreviouslyNull ? void 0 : formData;
     if (isObject6(formData) || Array.isArray(formData)) {
+      let plainLeafWasCleared = false;
       if (newValue === ADDITIONAL_PROPERTY_KEY_REMOVE) {
         _unset(formData, path);
       } else if (!isRootPath) {
-        let unsetPath = false;
         let valueForPath = newValue;
         if (newValue === void 0) {
           const lastSegment = path[path.length - 1];
@@ -4786,12 +4857,12 @@ var Form = class _Form extends Component3 {
             const leaf = field;
             const isOneOfOrAnyOfLeaf = leaf && (ONE_OF_KEY6 in leaf || ANY_OF_KEY6 in leaf);
             if (!isOneOfOrAnyOfLeaf && leaf !== void 0) {
-              unsetPath = true;
+              plainLeafWasCleared = true;
             }
           }
         }
-        if (unsetPath) {
-          _unset(formData, path);
+        if (plainLeafWasCleared) {
+          _set(formData, path, void 0);
         } else {
           _set(formData, path, valueForPath);
         }
@@ -4808,6 +4879,9 @@ var Form = class _Form extends Component3 {
       );
       formData = newState.formData;
       retrievedSchema = newState.retrievedSchema;
+      if (plainLeafWasCleared && formData) {
+        _set(formData, path, void 0);
+      }
     }
     const mustValidate = !noValidate && (liveValidate === true || liveValidate === "onChange");
     let state = { formData, retrievedSchema };
@@ -4878,7 +4952,7 @@ var Form = class _Form extends Component3 {
    * @returns The new retrieved schema if it has changed, else the old retrieved schema.
    */
   updateRetrievedSchema(retrievedSchema) {
-    const isTheSame = deepEquals2(retrievedSchema, this.state?.retrievedSchema);
+    const isTheSame = deepEquals3(retrievedSchema, this.state?.retrievedSchema);
     return isTheSame ? this.state.retrievedSchema : retrievedSchema;
   }
   /**
@@ -4907,7 +4981,7 @@ var Form = class _Form extends Component3 {
       initialDefaultsGenerated: false,
       customErrors: void 0
     };
-    this.setState(state, () => onChange && onChange(toIChangeEvent({ ...this.state, ...state })));
+    this.setState(state, () => onChange?.(toIChangeEvent({ ...this.state, ...state })));
   };
   /** Callback function to handle when a field on the form is blurred. Calls the `onBlur` callback for the `Form` if it
    * was provided. Also runs any live validation and/or live omit operations if the flags indicate they should happen
@@ -4946,7 +5020,7 @@ var Form = class _Form extends Component3 {
       const hasChanges = Object.keys(state).filter((key) => !key.startsWith("schemaValidation")).some((key) => {
         const oldData = _get(this.state, key);
         const newData = _get(state, key);
-        return !deepEquals2(oldData, newData);
+        return !deepEquals3(oldData, newData);
       });
       this.setState(state, () => {
         if (onChange && hasChanges) {
@@ -5084,7 +5158,7 @@ var Form = class _Form extends Component3 {
     if (!field) {
       field = this.formElement.current.querySelector(`input[id^="${elementId}"], button[id^="${elementId}"]`);
     }
-    if (field && field.length) {
+    if (field?.length) {
       field = field[0];
     }
     if (field) {
@@ -5184,12 +5258,12 @@ var Form = class _Form extends Component3 {
     const { SubmitButton: SubmitButton2 } = registry.templates.ButtonTemplates;
     const as = _internalFormWrapper ? tagName : void 0;
     const FormTag = _internalFormWrapper || tagName || "form";
-    let { [SUBMIT_BTN_OPTIONS_KEY]: submitOptions = {} } = getUiOptions21(uiSchema);
+    let { [SUBMIT_BTN_OPTIONS_KEY]: submitOptions = {} } = getUiOptions23(uiSchema);
     if (disabled) {
       submitOptions = { ...submitOptions, props: { ...submitOptions.props, disabled: true } };
     }
     const submitUiSchema = { [UI_OPTIONS_KEY3]: { [SUBMIT_BTN_OPTIONS_KEY]: submitOptions } };
-    return /* @__PURE__ */ jsxs23(
+    return /* @__PURE__ */ jsxs24(
       FormTag,
       {
         className: className || "rjsf",
@@ -5207,7 +5281,7 @@ var Form = class _Form extends Component3 {
         ref: this.formElement,
         children: [
           showErrorList === "top" && this.renderErrors(registry),
-          /* @__PURE__ */ jsx59(
+          /* @__PURE__ */ jsx61(
             SchemaFieldComponent,
             {
               name: "",
@@ -5224,7 +5298,7 @@ var Form = class _Form extends Component3 {
               readonly
             }
           ),
-          children || /* @__PURE__ */ jsx59(SubmitButton2, { uiSchema: submitUiSchema, registry }),
+          children || /* @__PURE__ */ jsx61(SubmitButton2, { uiSchema: submitUiSchema, registry }),
           showErrorList === "bottom" && this.renderErrors(registry)
         ]
       }
@@ -5256,7 +5330,7 @@ function getTestRegistry(rootSchema, fields2 = {}, templates2 = {}, widgets2 = {
 
 // src/withTheme.tsx
 import { forwardRef } from "react";
-import { jsx as jsx60 } from "react/jsx-runtime";
+import { jsx as jsx62 } from "react/jsx-runtime";
 function withTheme(themeProps) {
   return forwardRef(
     ({ fields: propFields, widgets: propWidgets, templates: propTemplates, ...directProps }, ref) => {
@@ -5270,7 +5344,7 @@ function withTheme(themeProps) {
           ...propTemplates?.ButtonTemplates
         }
       };
-      return /* @__PURE__ */ jsx60(
+      return /* @__PURE__ */ jsx62(
         Form,
         {
           ...themeProps,