@rjsf/semantic-ui 6.6.1 → 6.7.0

package/dist/index.cjs

@@ -46,7 +46,7 @@ module.exports = __toCommonJS(index_exports);
 var import_core4 = require("@rjsf/core");
 
 // src/Theme/Theme.ts
-var import_semantic_ui_react20 = require("semantic-ui-react");
+var import_semantic_ui_react21 = require("semantic-ui-react");
 
 // src/AddButton/AddButton.tsx
 var import_utils = require("@rjsf/utils");
@@ -89,14 +89,13 @@ function getSemanticProps({
   const formContextProps = formContext.semantic;
   const schemaProps = (0, import_utils2.getUiOptions)(uiSchema).semantic;
   const optionProps = options.semantic;
-  return Object.assign(
-    {},
-    { ...defaultSchemaProps },
-    { ...defaultContextProps },
-    schemaProps,
-    optionProps,
-    formContextProps
-  );
+  return {
+    ...defaultSchemaProps,
+    ...defaultContextProps,
+    ...schemaProps,
+    ...optionProps,
+    ...formContextProps
+  };
 }
 function getSemanticErrorProps({
   formContext = {},
@@ -104,11 +103,11 @@ function getSemanticErrorProps({
   options = {},
   defaultProps = { size: "small", pointing: "above" }
 }) {
-  const formContextProps = formContext.semantic && formContext.semantic.errorOptions;
+  const formContextProps = formContext.semantic?.errorOptions;
   const semanticOptions = (0, import_utils2.getUiOptions)(uiSchema).semantic;
-  const schemaProps = semanticOptions && semanticOptions.errorOptions;
-  const optionProps = options.semantic && options.semantic.errorOptions;
-  return Object.assign({}, { ...defaultProps }, schemaProps, optionProps, formContextProps);
+  const schemaProps = semanticOptions?.errorOptions;
+  const optionProps = options.semantic?.errorOptions;
+  return { ...defaultProps, ...schemaProps, ...optionProps, ...formContextProps };
 }
 function cleanClassNames(classNameArr, omit = []) {
   const classList = classNameArr.filter(Boolean).reduce((previous, current) => previous.concat(current.trim().split(/\s+/)), []);
@@ -278,10 +277,10 @@ function BaseInputTemplate(props) {
     formContext: registry.formContext,
     options
   });
-  const _onChange = ({ target: { value: value2 } }) => onChange(value2 === "" ? options.emptyValue : value2);
-  const _onBlur = () => onBlur && onBlur(id, value);
-  const _onFocus = () => onFocus && onFocus(id, value);
-  const _onClear = (0, import_react.useCallback)(
+  const handleChange = ({ target: { value: newValue } }) => onChange(newValue === "" ? options.emptyValue : newValue);
+  const handleBlur = () => onBlur?.(id, value);
+  const handleFocus = () => onFocus?.(id, value);
+  const handleClear = (0, import_react.useCallback)(
     (e) => {
       e.preventDefault();
       e.stopPropagation();
@@ -305,49 +304,66 @@ function BaseInputTemplate(props) {
         ...semanticProps,
         value: value || value === 0 ? value : "",
         error: rawErrors.length > 0,
-        onChange: onChangeOverride || _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
+        onChange: onChangeOverride || handleChange,
+        onBlur: handleBlur,
+        onFocus: handleFocus,
         "aria-describedby": (0, import_utils5.ariaDescribedByIds)(id, !!schema.examples)
       },
       id
     ),
-    options.allowClearTextInputs && !readonly && !disabled && value && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ClearButton2, { registry, onClick: _onClear }),
+    options.allowClearTextInputs && !readonly && !disabled && value && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ClearButton2, { registry, onClick: handleClear }),
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core.SchemaExamples, { id, schema })
   ] });
 }
 
+// src/CyclicSchemaExpandTemplate/CyclicSchemaExpandTemplate.tsx
+var import_utils6 = require("@rjsf/utils");
+var import_semantic_ui_react4 = require("semantic-ui-react");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+function CyclicSchemaExpandTemplate(props) {
+  const { name, fieldPathId, registry, onExpand } = props;
+  const { translateString } = registry;
+  const buttonId4 = `${fieldPathId[import_utils6.ID_KEY]}-button`;
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { style: { marginTop: "1rem", marginBottom: "1rem" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { style: { color: "red" }, children: translateString(import_utils6.TranslatableString.CycleDetected, [name]) }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_semantic_ui_react4.Button, { id: buttonId4, type: "button", size: "mini", onClick: () => onExpand(fieldPathId[import_utils6.ID_KEY]), children: translateString(import_utils6.TranslatableString.ExpandButton) })
+  ] });
+}
+
 // src/DescriptionField/DescriptionField.tsx
 var import_core2 = require("@rjsf/core");
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 function DescriptionField(props) {
   const { id, description, registry, uiSchema } = props;
   if (!description) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { id, className: "sui-description", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core2.RichDescription, { description, registry, uiSchema }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { id, className: "sui-description", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core2.RichDescription, { description, registry, uiSchema }) });
 }
 
 // src/ErrorList/ErrorList.tsx
-var import_utils6 = require("@rjsf/utils");
-var import_semantic_ui_react4 = require("semantic-ui-react");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_utils7 = require("@rjsf/utils");
+var import_semantic_ui_react5 = require("semantic-ui-react");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 function ErrorList({
   errors,
   registry
 }) {
   const { translateString } = registry;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_semantic_ui_react4.Message, { negative: true, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_semantic_ui_react4.Message.Header, { children: translateString(import_utils6.TranslatableString.ErrorsLabel) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_semantic_ui_react4.Message.List, { children: errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_semantic_ui_react4.Message.Item, { children: error.stack }, `error-${index}`)) })
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_semantic_ui_react5.Message, { negative: true, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_semantic_ui_react5.Message.Header, { children: translateString(import_utils7.TranslatableString.ErrorsLabel) }),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_semantic_ui_react5.Message.List, { children: errors.map((error, index) => (
+      // oxlint-disable-next-line react/no-array-index-key
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_semantic_ui_react5.Message.Item, { children: error.stack }, `error-${index}`)
+    )) })
   ] });
 }
 
 // src/FieldErrorTemplate/FieldErrorTemplate.tsx
-var import_utils7 = require("@rjsf/utils");
+var import_utils8 = require("@rjsf/utils");
 var import_uniqueId = __toESM(require("lodash/uniqueId"), 1);
-var import_semantic_ui_react5 = require("semantic-ui-react");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_semantic_ui_react6 = require("semantic-ui-react");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 var DEFAULT_OPTIONS = {
   options: {
     pointing: "above",
@@ -363,29 +379,29 @@ function FieldErrorTemplate({ errors, fieldPathId, uiSchema, registry }) {
   });
   const { pointing, size } = options;
   if (errors && errors.length > 0) {
-    const id = (0, import_utils7.errorId)(fieldPathId);
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_semantic_ui_react5.Label, { id, color: "red", pointing: pointing || "above", size: size || "small", basic: true, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_semantic_ui_react5.List, { bulleted: true, children: errors.map((error) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_semantic_ui_react5.List.Item, { children: error }, (0, import_uniqueId.default)("field-error-"))) }) });
+    const id = (0, import_utils8.errorId)(fieldPathId);
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_semantic_ui_react6.Label, { id, color: "red", pointing: pointing || "above", size: size || "small", basic: true, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_semantic_ui_react6.List, { bulleted: true, children: errors.map((error) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_semantic_ui_react6.List.Item, { children: error }, (0, import_uniqueId.default)("field-error-"))) }) });
   }
   return null;
 }
 
 // src/FieldHelpTemplate/FieldHelpTemplate.tsx
 var import_core3 = require("@rjsf/core");
-var import_utils8 = require("@rjsf/utils");
-var import_semantic_ui_react6 = require("semantic-ui-react");
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_utils9 = require("@rjsf/utils");
+var import_semantic_ui_react7 = require("semantic-ui-react");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 function FieldHelpTemplate(props) {
   const { fieldPathId, help, uiSchema, registry } = props;
   if (help) {
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_semantic_ui_react6.Message, { size: "mini", info: true, id: (0, import_utils8.helpId)(fieldPathId), children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core3.RichHelp, { help, registry, uiSchema }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_semantic_ui_react7.Message, { size: "mini", info: true, id: (0, import_utils9.helpId)(fieldPathId), children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core3.RichHelp, { help, registry, uiSchema }) });
   }
   return null;
 }
 
 // src/FieldTemplate/FieldTemplate.tsx
-var import_utils9 = require("@rjsf/utils");
-var import_semantic_ui_react7 = require("semantic-ui-react");
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_utils10 = require("@rjsf/utils");
+var import_semantic_ui_react8 = require("semantic-ui-react");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 function FieldTemplate(props) {
   const {
     id,
@@ -409,17 +425,17 @@ function FieldTemplate(props) {
     formContext: registry.formContext
   });
   const { wrapLabel, wrapContent } = semanticProps;
-  const uiOptions = (0, import_utils9.getUiOptions)(uiSchema);
-  const WrapIfAdditionalTemplate2 = (0, import_utils9.getTemplate)(
+  const uiOptions = (0, import_utils10.getUiOptions)(uiSchema);
+  const WrapIfAdditionalTemplate2 = (0, import_utils10.getTemplate)(
     "WrapIfAdditionalTemplate",
     registry,
     uiOptions
   );
   if (hidden) {
-    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { style: { display: "none" }, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { style: { display: "none" }, children });
   }
   const isCheckbox = uiOptions.widget === "checkbox";
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     WrapIfAdditionalTemplate2,
     {
       classNames,
@@ -432,9 +448,9 @@ function FieldTemplate(props) {
       schema,
       uiSchema,
       ...otherProps,
-      children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_semantic_ui_react7.Form.Group, { widths: "equal", grouped: true, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(MaybeWrap, { wrap: wrapContent, className: "sui-field-content", children: [
+      children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_semantic_ui_react8.Form.Group, { widths: "equal", grouped: true, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(MaybeWrap, { wrap: wrapContent, className: "sui-field-content", children: [
         children,
-        displayLabel && rawDescription && !isCheckbox && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MaybeWrap, { wrap: wrapLabel, className: "sui-field-label", children: description }),
+        displayLabel && rawDescription && !isCheckbox && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(MaybeWrap, { wrap: wrapLabel, className: "sui-field-label", children: description }),
         help,
         errors
       ] }) }, id)
@@ -443,24 +459,25 @@ function FieldTemplate(props) {
 }
 
 // src/GridTemplate/GridTemplate.tsx
-var import_semantic_ui_react8 = require("semantic-ui-react");
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_semantic_ui_react9 = require("semantic-ui-react");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 function GridTemplate(props) {
   const { children, column, ...rest } = props;
   if (column) {
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_semantic_ui_react8.Grid.Column, { ...rest, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_semantic_ui_react9.Grid.Column, { ...rest, children });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_semantic_ui_react8.Grid, { ...rest, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_semantic_ui_react9.Grid, { ...rest, children });
 }
 
 // src/IconButton/IconButton.tsx
-var import_utils10 = require("@rjsf/utils");
-var import_semantic_ui_react9 = require("semantic-ui-react");
-var import_jsx_runtime12 = require("react/jsx-runtime");
-function IconButton(props) {
+var import_react2 = require("react");
+var import_utils11 = require("@rjsf/utils");
+var import_semantic_ui_react10 = require("semantic-ui-react");
+var import_jsx_runtime13 = require("react/jsx-runtime");
+function IconButtonFn(props) {
   const { icon, iconType, color, className, uiSchema, registry, ...otherProps } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-    import_semantic_ui_react9.Button,
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    import_semantic_ui_react10.Button,
     {
       icon,
       size: iconType,
@@ -470,51 +487,57 @@ function IconButton(props) {
     }
   );
 }
-function CopyButton(props) {
+var IconButton = (0, import_react2.memo)(IconButtonFn);
+function CopyButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.CopyButton), ...props, icon: "copy" });
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { title: translateString(import_utils11.TranslatableString.CopyButton), ...props, icon: "copy" });
 }
-function MoveDownButton(props) {
+var CopyButton = (0, import_react2.memo)(CopyButtonFn);
+function MoveDownButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.MoveDownButton), ...props, icon: "angle down" });
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { title: translateString(import_utils11.TranslatableString.MoveDownButton), ...props, icon: "angle down" });
 }
-function MoveUpButton(props) {
+var MoveDownButton = (0, import_react2.memo)(MoveDownButtonFn);
+function MoveUpButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.MoveUpButton), ...props, icon: "angle up" });
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { title: translateString(import_utils11.TranslatableString.MoveUpButton), ...props, icon: "angle up" });
 }
-function RemoveButton(props) {
+var MoveUpButton = (0, import_react2.memo)(MoveUpButtonFn);
+function RemoveButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.RemoveButton), ...props, icon: "trash" });
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { title: translateString(import_utils11.TranslatableString.RemoveButton), ...props, icon: "trash" });
 }
-function ClearButton(props) {
+var RemoveButton = (0, import_react2.memo)(RemoveButtonFn);
+function ClearButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.ClearButton), ...props, icon: "close" });
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { title: translateString(import_utils11.TranslatableString.ClearButton), ...props, icon: "close" });
 }
+var ClearButton = (0, import_react2.memo)(ClearButtonFn);
 
 // src/MultiSchemaFieldTemplate/MultiSchemaFieldTemplate.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 function MultiSchemaFieldTemplate(props) {
   const { selector, optionSchemaField } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { children: selector }),
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { children: selector }),
     optionSchemaField
   ] });
 }
 
 // src/ObjectFieldTemplate/ObjectFieldTemplate.tsx
-var import_utils11 = require("@rjsf/utils");
-var import_semantic_ui_react10 = require("semantic-ui-react");
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_utils12 = require("@rjsf/utils");
+var import_semantic_ui_react11 = require("semantic-ui-react");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 function ObjectFieldTemplate(props) {
   const {
     description,
@@ -531,9 +554,9 @@ function ObjectFieldTemplate(props) {
     fieldPathId,
     registry
   } = props;
-  const uiOptions = (0, import_utils11.getUiOptions)(uiSchema);
-  const TitleFieldTemplate = (0, import_utils11.getTemplate)("TitleFieldTemplate", registry, uiOptions);
-  const DescriptionFieldTemplate = (0, import_utils11.getTemplate)(
+  const uiOptions = (0, import_utils12.getUiOptions)(uiSchema);
+  const TitleFieldTemplate = (0, import_utils12.getTemplate)("TitleFieldTemplate", registry, uiOptions);
+  const DescriptionFieldTemplate = (0, import_utils12.getTemplate)(
     "DescriptionFieldTemplate",
     registry,
     uiOptions
@@ -542,11 +565,11 @@ function ObjectFieldTemplate(props) {
   const {
     ButtonTemplates: { AddButton: AddButton2 }
   } = registry.templates;
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
-    title && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       TitleFieldTemplate,
       {
-        id: (0, import_utils11.titleId)(fieldPathId),
+        id: (0, import_utils12.titleId)(fieldPathId),
         title,
         required,
         schema,
@@ -555,10 +578,10 @@ function ObjectFieldTemplate(props) {
         optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : void 0
       }
     ),
-    description && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    description && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       DescriptionFieldTemplate,
       {
-        id: (0, import_utils11.descriptionId)(fieldPathId),
+        id: (0, import_utils12.descriptionId)(fieldPathId),
         description,
         schema,
         uiSchema,
@@ -567,7 +590,7 @@ function ObjectFieldTemplate(props) {
     ),
     !showOptionalDataControlInTitle ? optionalDataControl : void 0,
     properties.map((prop) => prop.content),
-    (0, import_utils11.canExpand)(schema, uiSchema, formData) && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_semantic_ui_react10.Grid.Column, { width: 16, verticalAlign: "middle", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_semantic_ui_react10.Grid.Row, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    (0, import_utils12.canExpand)(schema, uiSchema, formData) && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_semantic_ui_react11.Grid.Column, { width: 16, verticalAlign: "middle", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_semantic_ui_react11.Grid.Row, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       "div",
       {
         style: {
@@ -575,10 +598,10 @@ function ObjectFieldTemplate(props) {
           position: "relative",
           textAlign: "right"
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           AddButton2,
           {
-            id: (0, import_utils11.buttonId)(fieldPathId, "add"),
+            id: (0, import_utils12.buttonId)(fieldPathId, "add"),
             className: "rjsf-object-property-expand",
             onClick: onAddProperty,
             disabled: disabled || readonly,
@@ -592,11 +615,11 @@ function ObjectFieldTemplate(props) {
 }
 
 // src/OptionalDataControlsTemplate/OptionalDataControlsTemplate.tsx
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 function OptionalDataControlsTemplate(props) {
   const { id, registry, label, onAddClick, onRemoveClick } = props;
   if (onAddClick) {
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       AddButton,
       {
         id,
@@ -607,8 +630,9 @@ function OptionalDataControlsTemplate(props) {
         size: "mini"
       }
     );
-  } else if (onRemoveClick) {
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  }
+  if (onRemoveClick) {
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       RemoveButton,
       {
         id,
@@ -620,24 +644,24 @@ function OptionalDataControlsTemplate(props) {
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("em", { id, children: label });
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("em", { id, children: label });
 }
 
 // src/SubmitButton/SubmitButton.tsx
-var import_utils12 = require("@rjsf/utils");
-var import_semantic_ui_react11 = require("semantic-ui-react");
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_utils13 = require("@rjsf/utils");
+var import_semantic_ui_react12 = require("semantic-ui-react");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 function SubmitButton({ uiSchema }) {
-  const { submitText, norender, props: submitButtonProps = {} } = (0, import_utils12.getSubmitButtonOptions)(uiSchema);
+  const { submitText, norender, props: submitButtonProps = {} } = (0, import_utils13.getSubmitButtonOptions)(uiSchema);
   if (norender) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_semantic_ui_react11.Button, { type: "submit", primary: true, ...submitButtonProps, children: submitText });
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_semantic_ui_react12.Button, { type: "submit", primary: true, ...submitButtonProps, children: submitText });
 }
 
 // src/TitleField/TitleField.tsx
-var import_semantic_ui_react12 = require("semantic-ui-react");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_semantic_ui_react13 = require("semantic-ui-react");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var DEFAULT_OPTIONS2 = {
   inverted: false,
   dividing: true
@@ -652,20 +676,20 @@ function TitleField({
     uiSchema,
     defaultSchemaProps: DEFAULT_OPTIONS2
   });
-  let heading = title ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_semantic_ui_react12.Header, { id, ...semanticProps, as: "h5", children: title }) : null;
+  let heading = title ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_semantic_ui_react13.Header, { id, ...semanticProps, as: "h5", children: title }) : null;
   if (optionalDataControl) {
-    heading = /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_semantic_ui_react12.Grid, { colums: 2, relaxed: true, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_semantic_ui_react12.Grid.Column, { width: 14, style: { paddingRight: 0 }, children: heading }),
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_semantic_ui_react12.Grid.Column, { width: 2, children: optionalDataControl })
+    heading = /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_semantic_ui_react13.Grid, { colums: 2, relaxed: true, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_semantic_ui_react13.Grid.Column, { width: 14, style: { paddingRight: 0 }, children: heading }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_semantic_ui_react13.Grid.Column, { width: 2, children: optionalDataControl })
     ] });
   }
   return heading;
 }
 
 // src/WrapIfAdditionalTemplate/WrapIfAdditionalTemplate.tsx
-var import_utils13 = require("@rjsf/utils");
-var import_semantic_ui_react13 = require("semantic-ui-react");
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_utils14 = require("@rjsf/utils");
+var import_semantic_ui_react14 = require("semantic-ui-react");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 function WrapIfAdditionalTemplate(props) {
   const {
     children,
@@ -686,38 +710,38 @@ function WrapIfAdditionalTemplate(props) {
   } = props;
   const { templates, translateString } = registry;
   const { RemoveButton: RemoveButton2 } = templates.ButtonTemplates;
-  const keyLabel = translateString(import_utils13.TranslatableString.KeyLabel, [label]);
+  const keyLabel = translateString(import_utils14.TranslatableString.KeyLabel, [label]);
   const { readonlyAsDisabled = true, wrapperStyle } = registry.formContext;
-  const additional = import_utils13.ADDITIONAL_PROPERTY_FLAG in schema;
+  const additional = import_utils14.ADDITIONAL_PROPERTY_FLAG in schema;
   const margin = rawDescription ? 4 : 24;
   if (!additional) {
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: classNames, style, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: classNames, style, children });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: classNames, style, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_semantic_ui_react13.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_semantic_ui_react13.Grid.Row, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_semantic_ui_react13.Grid.Column, { width: 7, className: "form-additional", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_semantic_ui_react13.Form.Group, { widths: "equal", grouped: true, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-      import_semantic_ui_react13.Form.Input,
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: classNames, style, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_semantic_ui_react14.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_semantic_ui_react14.Grid.Row, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_semantic_ui_react14.Grid.Column, { width: 7, className: "form-additional", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_semantic_ui_react14.Form.Group, { widths: "equal", grouped: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+      import_semantic_ui_react14.Form.Input,
       {
         className: "form-group",
         hasFeedback: true,
         fluid: true,
-        htmlFor: `${id}`,
+        htmlFor: id,
         label: displayLabel ? keyLabel : void 0,
         required,
         defaultValue: label,
         disabled: disabled || readonlyAsDisabled && readonly,
-        id: `${id}`,
-        name: `${id}`,
+        id,
+        name: id,
         onBlur: !readonly ? onKeyRenameBlur : void 0,
         style: wrapperStyle,
         type: "text"
       },
       label
     ) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_semantic_ui_react13.Grid.Column, { width: 7, className: "form-additional", verticalAlign: "middle", children }),
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_semantic_ui_react13.Grid.Column, { verticalAlign: "middle", style: displayLabel ? { marginTop: `${margin}px` } : void 0, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_semantic_ui_react14.Grid.Column, { width: 7, className: "form-additional", verticalAlign: "middle", children }),
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_semantic_ui_react14.Grid.Column, { verticalAlign: "middle", style: displayLabel ? { marginTop: `${margin}px` } : void 0, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       RemoveButton2,
       {
-        id: (0, import_utils13.buttonId)(id, "remove"),
+        id: (0, import_utils14.buttonId)(id, "remove"),
         iconType: "mini",
         className: "rjsf-object-property-remove",
         disabled: disabled || readonly,
@@ -735,6 +759,7 @@ function generateTemplates() {
     ArrayFieldItemTemplate,
     ArrayFieldTemplate,
     BaseInputTemplate,
+    CyclicSchemaExpandTemplate,
     ButtonTemplates: {
       AddButton,
       CopyButton,
@@ -760,9 +785,9 @@ function generateTemplates() {
 var Templates_default = generateTemplates();
 
 // src/CheckboxesWidget/CheckboxesWidget.tsx
-var import_utils14 = require("@rjsf/utils");
-var import_semantic_ui_react14 = require("semantic-ui-react");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_utils15 = require("@rjsf/utils");
+var import_semantic_ui_react15 = require("semantic-ui-react");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 function CheckboxesWidget(props) {
   const {
     id,
@@ -782,7 +807,7 @@ function CheckboxesWidget(props) {
     rawErrors = [],
     registry
   } = props;
-  const TitleFieldTemplate = (0, import_utils14.getTemplate)("TitleFieldTemplate", registry, options);
+  const TitleFieldTemplate = (0, import_utils15.getTemplate)("TitleFieldTemplate", registry, options);
   const { enumOptions, enumDisabled, inline } = options;
   const checkboxesValues = Array.isArray(value) ? value : [value];
   const semanticProps = getSemanticProps({
@@ -793,25 +818,25 @@ function CheckboxesWidget(props) {
       inverted: "false"
     }
   });
-  const _onChange = (index) => ({ target: { checked } }) => {
+  const handleChange = (index) => ({ target: { checked } }) => {
     if (checked) {
-      onChange((0, import_utils14.enumOptionsSelectValue)(index, checkboxesValues, enumOptions));
+      onChange((0, import_utils15.enumOptionsSelectValue)(index, checkboxesValues, enumOptions));
     } else {
-      onChange((0, import_utils14.enumOptionsDeselectValue)(index, checkboxesValues, enumOptions));
+      onChange((0, import_utils15.enumOptionsDeselectValue)(index, checkboxesValues, enumOptions));
     }
   };
-  const _onBlur = () => onBlur(id, value);
-  const _onFocus = () => onFocus(id, value);
+  const handleBlur = () => onBlur(id, value);
+  const handleFocus = () => onFocus(id, value);
   const inlineOption = inline ? { inline: true } : { grouped: true };
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
-    !hideLabel && !!label && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(TitleFieldTemplate, { id: (0, import_utils14.titleId)(id), title: label, schema, uiSchema, registry }),
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_semantic_ui_react14.Form.Group, { id, name: htmlName || id, ...inlineOption, children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
-      const checked = (0, import_utils14.enumOptionsIsSelected)(option.value, checkboxesValues);
-      const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-      return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-        import_semantic_ui_react14.Form.Checkbox,
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
+    !hideLabel && !!label && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(TitleFieldTemplate, { id: (0, import_utils15.titleId)(id), title: label, schema, uiSchema, registry }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_semantic_ui_react15.Form.Group, { id, name: htmlName || id, ...inlineOption, children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
+      const checked = (0, import_utils15.enumOptionsIsSelected)(option.value, checkboxesValues);
+      const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.includes(option.value);
+      return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        import_semantic_ui_react15.Form.Checkbox,
         {
-          id: (0, import_utils14.optionId)(id, index),
+          id: (0, import_utils15.optionId)(id, index),
           name: htmlName || id,
           label: option.label,
           ...semanticProps,
@@ -819,21 +844,21 @@ function CheckboxesWidget(props) {
           error: rawErrors.length > 0,
           disabled: disabled || itemDisabled || readonly,
           autoFocus: autofocus && index === 0,
-          onChange: _onChange(index),
-          onBlur: _onBlur,
-          onFocus: _onFocus,
-          "aria-describedby": (0, import_utils14.ariaDescribedByIds)(id)
+          onChange: handleChange(index),
+          onBlur: handleBlur,
+          onFocus: handleFocus,
+          "aria-describedby": (0, import_utils15.ariaDescribedByIds)(id)
         },
-        index
+        String(option.value)
       );
     }) })
   ] });
 }
 
 // src/CheckboxWidget/CheckboxWidget.tsx
-var import_utils15 = require("@rjsf/utils");
-var import_semantic_ui_react15 = require("semantic-ui-react");
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_utils16 = require("@rjsf/utils");
+var import_semantic_ui_react16 = require("semantic-ui-react");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function CheckboxWidget(props) {
   const {
     id,
@@ -841,7 +866,7 @@ function CheckboxWidget(props) {
     value,
     disabled,
     readonly,
-    label = "",
+    label,
     hideLabel,
     autofocus,
     onChange,
@@ -861,30 +886,30 @@ function CheckboxWidget(props) {
       inverted: "false"
     }
   });
-  const DescriptionFieldTemplate = (0, import_utils15.getTemplate)(
+  const DescriptionFieldTemplate = (0, import_utils16.getTemplate)(
     "DescriptionFieldTemplate",
     registry,
     options
   );
-  const required = (0, import_utils15.schemaRequiresTrueValue)(schema);
-  const checked = value == "true" || value == true;
-  const _onChange = (_, data) => onChange && onChange(data.checked);
-  const _onBlur = () => onBlur && onBlur(id, value);
-  const _onFocus = () => onFocus && onFocus(id, value);
+  const required = (0, import_utils16.schemaRequiresTrueValue)(schema);
+  const checked = value === "true" || value === true;
+  const handleChange = (_, data) => onChange?.(data.checked);
+  const handleBlur = () => onBlur?.(id, value);
+  const handleFocus = () => onFocus?.(id, value);
   const description = options.description ?? schema.description;
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
-    !hideLabel && description && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
+    !hideLabel && description && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       DescriptionFieldTemplate,
       {
-        id: (0, import_utils15.descriptionId)(id),
+        id: (0, import_utils16.descriptionId)(id),
         description,
         schema,
         uiSchema,
         registry
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-      import_semantic_ui_react15.Form.Checkbox,
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      import_semantic_ui_react16.Form.Checkbox,
       {
         id,
         name: htmlName || id,
@@ -893,22 +918,22 @@ function CheckboxWidget(props) {
         ...semanticProps,
         checked: typeof value === "undefined" ? false : checked,
         error: rawErrors.length > 0,
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
+        onChange: handleChange,
+        onBlur: handleBlur,
+        onFocus: handleFocus,
         required,
-        label: (0, import_utils15.labelValue)(label, hideLabel, false),
-        "aria-describedby": (0, import_utils15.ariaDescribedByIds)(id)
+        label: (0, import_utils16.labelValue)(label, hideLabel, false),
+        "aria-describedby": (0, import_utils16.ariaDescribedByIds)(id)
       }
     )
   ] });
 }
 
 // src/RadioWidget/RadioWidget.tsx
-var import_utils16 = require("@rjsf/utils");
-var import_semantic_ui_react16 = require("semantic-ui-react");
-var import_jsx_runtime21 = require("react/jsx-runtime");
-var import_react2 = require("react");
+var import_utils17 = require("@rjsf/utils");
+var import_semantic_ui_react17 = require("semantic-ui-react");
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_react3 = require("react");
 function RadioWidget(props) {
   const {
     id,
@@ -926,48 +951,46 @@ function RadioWidget(props) {
     rawErrors = []
   } = props;
   const { enumOptions, enumDisabled, emptyValue } = options;
-  const optionValueFormat = (0, import_utils16.getOptionValueFormat)(options);
+  const optionValueFormat = (0, import_utils17.getOptionValueFormat)(options);
   const semanticProps = getSemanticProps({
     formContext: registry.formContext,
     options,
     uiSchema
   });
-  const _onChange = (_, { value: eventValue }) => {
-    return onChange((0, import_utils16.enumOptionValueDecoder)(String(eventValue), enumOptions, optionValueFormat, emptyValue));
-  };
-  const _onBlur = () => onBlur(id, value);
-  const _onFocus = () => onFocus(id, value);
+  const handleChange = (_, { value: eventValue }) => onChange((0, import_utils17.enumOptionValueDecoder)(String(eventValue), enumOptions, optionValueFormat, emptyValue));
+  const handleBlur = () => onBlur(id, value);
+  const handleFocus = () => onFocus(id, value);
   const inlineOption = options.inline ? { inline: true } : { grouped: true };
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_semantic_ui_react16.Form.Group, { ...inlineOption, children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
-    const checked = (0, import_utils16.enumOptionsIsSelected)(option.value, value);
-    const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-    return /* @__PURE__ */ (0, import_react2.createElement)(
-      import_semantic_ui_react16.Form.Field,
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_semantic_ui_react17.Form.Group, { ...inlineOption, children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
+    const checked = (0, import_utils17.enumOptionsIsSelected)(option.value, value);
+    const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.includes(option.value);
+    return /* @__PURE__ */ (0, import_react3.createElement)(
+      import_semantic_ui_react17.Form.Field,
       {
         required,
-        control: import_semantic_ui_react16.Radio,
-        id: (0, import_utils16.optionId)(id, index),
+        control: import_semantic_ui_react17.Radio,
+        id: (0, import_utils17.optionId)(id, index),
         name: htmlName || id,
         ...semanticProps,
-        onFocus: _onFocus,
-        onBlur: _onBlur,
-        onChange: _onChange,
+        onFocus: handleFocus,
+        onBlur: handleBlur,
+        onChange: handleChange,
         label: option.label,
-        value: (0, import_utils16.enumOptionValueEncoder)(option.value, index, optionValueFormat),
+        value: (0, import_utils17.enumOptionValueEncoder)(option.value, index, optionValueFormat),
         error: rawErrors.length > 0,
-        key: index,
+        key: String(option.value),
         checked,
         disabled: disabled || itemDisabled || readonly,
-        "aria-describedby": (0, import_utils16.ariaDescribedByIds)(id)
+        "aria-describedby": (0, import_utils17.ariaDescribedByIds)(id)
       }
     );
   }) });
 }
 
 // src/RangeWidget/RangeWidget.tsx
-var import_utils17 = require("@rjsf/utils");
-var import_semantic_ui_react17 = require("semantic-ui-react");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_utils18 = require("@rjsf/utils");
+var import_semantic_ui_react18 = require("semantic-ui-react");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function RangeWidget(props) {
   const {
     id,
@@ -992,45 +1015,45 @@ function RangeWidget(props) {
       fluid: true
     }
   });
-  const _onChange = ({ target: { value: value2 } }) => onChange && onChange(value2 === "" ? options.emptyValue : value2);
-  const _onBlur = () => onBlur && onBlur(id, value);
-  const _onFocus = () => onFocus && onFocus(id, value);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-      import_semantic_ui_react17.Input,
+  const handleChange = ({ target: { value: value2 } }) => onChange?.(value2 === "" ? options.emptyValue : value2);
+  const handleBlur = () => onBlur?.(id, value);
+  const handleFocus = () => onFocus?.(id, value);
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      import_semantic_ui_react18.Input,
       {
         id,
         name: id,
         type: "range",
         required,
         disabled: disabled || readonly,
-        ...(0, import_utils17.rangeSpec)(schema),
+        ...(0, import_utils18.rangeSpec)(schema),
         ...semanticProps,
         value: value || "",
         error: rawErrors.length > 0,
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
-        "aria-describedby": (0, import_utils17.ariaDescribedByIds)(id)
+        onChange: handleChange,
+        onBlur: handleBlur,
+        onFocus: handleFocus,
+        "aria-describedby": (0, import_utils18.ariaDescribedByIds)(id)
       },
       id
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: value })
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: value })
   ] });
 }
 
 // src/SelectWidget/SelectWidget.tsx
-var import_utils18 = require("@rjsf/utils");
+var import_utils19 = require("@rjsf/utils");
 var import_map = __toESM(require("lodash/map"), 1);
-var import_semantic_ui_react18 = require("semantic-ui-react");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_semantic_ui_react19 = require("semantic-ui-react");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function createDefaultValueOptionsForDropDown(enumOptions, enumDisabled, showPlaceholderOption, placeholder, format = "indexed") {
   const disabledOptions = enumDisabled || [];
   const options = (0, import_map.default)(enumOptions, ({ label, value }, index) => ({
-    disabled: disabledOptions.indexOf(value) !== -1,
+    disabled: disabledOptions.includes(value),
     key: label,
     text: label,
-    value: (0, import_utils18.enumOptionValueEncoder)(value, index, format)
+    value: (0, import_utils19.enumOptionValueEncoder)(value, index, format)
   }));
   if (showPlaceholderOption) {
     options.unshift({ value: "", text: placeholder || "" });
@@ -1073,8 +1096,9 @@ function SelectWidget(props) {
   });
   const { enumDisabled, enumOptions, emptyValue: optEmptyVal } = options;
   const emptyValue = multiple ? [] : "";
-  const optionValueFormat = (0, import_utils18.getOptionValueFormat)(options);
+  const optionValueFormat = (0, import_utils19.getOptionValueFormat)(options);
   const showPlaceholderOption = !multiple && schema.default === void 0;
+  (0, import_utils19.logUnsupportedDefaultForEnum)(id, schema, enumOptions, multiple);
   const dropdownOptions = createDefaultValueOptionsForDropDown(
     enumOptions,
     enumDisabled,
@@ -1082,38 +1106,41 @@ function SelectWidget(props) {
     placeholder,
     optionValueFormat
   );
-  const _onChange = (_, { value: value2 }) => onChange((0, import_utils18.enumOptionValueDecoder)(value2, enumOptions, optionValueFormat, optEmptyVal));
-  const _onBlur = (_, { target }) => onBlur(id, (0, import_utils18.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, optEmptyVal));
-  const _onFocus = (_, { target }) => onFocus(id, (0, import_utils18.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, optEmptyVal));
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-    import_semantic_ui_react18.Form.Dropdown,
-    {
-      id,
-      name: htmlName || id,
-      label: (0, import_utils18.labelValue)(label || void 0, hideLabel, false),
-      multiple: typeof multiple === "undefined" ? false : multiple,
-      value: (0, import_utils18.enumOptionSelectedValue)(value, enumOptions, !!multiple, optionValueFormat, emptyValue),
-      error: rawErrors.length > 0,
-      disabled,
-      placeholder,
-      ...semanticProps,
-      required,
-      autoFocus: autofocus,
-      readOnly: readonly,
-      options: dropdownOptions,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      "aria-describedby": (0, import_utils18.ariaDescribedByIds)(id)
-    },
-    id
-  );
+  const handleChange = (_, { value: enumValue }) => onChange((0, import_utils19.enumOptionValueDecoder)(enumValue, enumOptions, optionValueFormat, optEmptyVal));
+  const handleBlur = (_, { target }) => onBlur(id, (0, import_utils19.enumOptionValueDecoder)(target?.value, enumOptions, optionValueFormat, optEmptyVal));
+  const handleFocus = (_, { target }) => onFocus(id, (0, import_utils19.enumOptionValueDecoder)(target?.value, enumOptions, optionValueFormat, optEmptyVal));
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      import_semantic_ui_react19.Form.Dropdown,
+      {
+        id,
+        name: htmlName || id,
+        label: (0, import_utils19.labelValue)(label || void 0, hideLabel, false),
+        multiple: typeof multiple === "undefined" ? false : multiple,
+        value: (0, import_utils19.enumOptionSelectedValue)(value, enumOptions, !!multiple, optionValueFormat, emptyValue),
+        error: rawErrors.length > 0,
+        disabled,
+        placeholder,
+        ...semanticProps,
+        required,
+        autoFocus: autofocus,
+        readOnly: readonly,
+        options: dropdownOptions,
+        onChange: handleChange,
+        onBlur: handleBlur,
+        onFocus: handleFocus,
+        "aria-describedby": (0, import_utils19.ariaDescribedByIds)(id)
+      },
+      id
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_utils19.SelectedOptionDescription, { ...props })
+  ] });
 }
 
 // src/TextareaWidget/TextareaWidget.tsx
-var import_utils19 = require("@rjsf/utils");
-var import_semantic_ui_react19 = require("semantic-ui-react");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_utils20 = require("@rjsf/utils");
+var import_semantic_ui_react20 = require("semantic-ui-react");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function TextareaWidget(props) {
   const {
     id,
@@ -1138,15 +1165,15 @@ function TextareaWidget(props) {
     options,
     defaultSchemaProps: { inverted: "false" }
   });
-  const _onChange = ({ target: { value: value2 } }) => onChange && onChange(value2 === "" ? options.emptyValue : value2);
-  const _onBlur = () => onBlur && onBlur(id, value);
-  const _onFocus = () => onFocus && onFocus(id, value);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-    import_semantic_ui_react19.Form.TextArea,
+  const handleChange = ({ target: { value: value2 } }) => onChange?.(value2 === "" ? options.emptyValue : value2);
+  const handleBlur = () => onBlur?.(id, value);
+  const handleFocus = () => onFocus?.(id, value);
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    import_semantic_ui_react20.Form.TextArea,
     {
       id,
       name: htmlName || id,
-      label: (0, import_utils19.labelValue)(label || void 0, hideLabel, false),
+      label: (0, import_utils20.labelValue)(label || void 0, hideLabel, false),
       placeholder,
       autoFocus: autofocus,
       required,
@@ -1155,10 +1182,10 @@ function TextareaWidget(props) {
       value: value || "",
       error: rawErrors.length > 0,
       rows: options.rows || 5,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      "aria-describedby": (0, import_utils19.ariaDescribedByIds)(id)
+      onChange: handleChange,
+      onBlur: handleBlur,
+      onFocus: handleFocus,
+      "aria-describedby": (0, import_utils20.ariaDescribedByIds)(id)
     },
     id
   );
@@ -1182,7 +1209,7 @@ function generateTheme() {
   return {
     templates: generateTemplates(),
     widgets: generateWidgets(),
-    _internalFormWrapper: import_semantic_ui_react20.Form
+    _internalFormWrapper: import_semantic_ui_react21.Form
   };
 }
 var Theme_default = generateTheme();