@rjsf/antd 6.4.2 → 6.5.0

package/dist/antd.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@rjsf/core'), require('antd'), require('@rjsf/utils'), require('react/jsx-runtime'), require('classnames'), require('react'), require('@ant-design/icons/ExclamationCircleOutlined'), require('@ant-design/icons/ArrowDownOutlined'), require('@ant-design/icons/ArrowUpOutlined'), require('@ant-design/icons/CopyOutlined'), require('@ant-design/icons/DeleteOutlined'), require('@ant-design/icons/PlusCircleOutlined'), require('@ant-design/icons/CloseOutlined'), require('lodash/isObject'), require('lodash/isNumber'), require('lodash/isString'), require('dayjs')) :
-  typeof define === 'function' && define.amd ? define(['exports', '@rjsf/core', 'antd', '@rjsf/utils', 'react/jsx-runtime', 'classnames', 'react', '@ant-design/icons/ExclamationCircleOutlined', '@ant-design/icons/ArrowDownOutlined', '@ant-design/icons/ArrowUpOutlined', '@ant-design/icons/CopyOutlined', '@ant-design/icons/DeleteOutlined', '@ant-design/icons/PlusCircleOutlined', '@ant-design/icons/CloseOutlined', 'lodash/isObject', 'lodash/isNumber', 'lodash/isString', 'dayjs'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["@rjsf/antd"] = {}, global.core, global.antd, global.utils, global.jsxRuntime, global.classNames, global.react, global.ExclamationCircleOutlined, global.ArrowDownOutlined, global.ArrowUpOutlined, global.CopyOutlined, global.DeleteOutlined, global.PlusCircleOutlined, global.CloseOutlined, global.isObject, global.isNumber, global.isString, global.dayjs));
-})(this, (function (exports, core, antd, utils, jsxRuntime, classNames, react, ExclamationCircleOutlined, ArrowDownOutlined, ArrowUpOutlined, CopyOutlined, DeleteOutlined, PlusCircleOutlined, CloseOutlined, isObject, isNumber, isString, dayjs) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@rjsf/core'), require('antd'), require('@rjsf/utils'), require('react/jsx-runtime'), require('classnames'), require('react'), require('@ant-design/icons'), require('lodash/isObject'), require('lodash/isNumber'), require('lodash/isString'), require('dayjs')) :
+  typeof define === 'function' && define.amd ? define(['exports', '@rjsf/core', 'antd', '@rjsf/utils', 'react/jsx-runtime', 'classnames', 'react', '@ant-design/icons', 'lodash/isObject', 'lodash/isNumber', 'lodash/isString', 'dayjs'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["@rjsf/antd"] = {}, global.core, global.antd, global.utils, global.jsxRuntime, global.classNames, global.react, global.icons, global.isObject, global.isNumber, global.isString, global.dayjs));
+})(this, (function (exports, core, antd, utils, jsxRuntime, classNames, react, icons, isObject, isNumber, isString, dayjs) { 'use strict';
 
   // src/index.ts
   var BTN_GRP_STYLE = {
@@ -130,6 +130,7 @@
       },
       [onChange, options.emptyValue]
     );
+    const { min, max, ...restInputProps } = inputProps;
     const input = inputProps.type === "number" || inputProps.type === "integer" ? /* @__PURE__ */ jsxRuntime.jsx(
       antd.InputNumber,
       {
@@ -142,8 +143,12 @@
         placeholder,
         required,
         style: INPUT_STYLE,
+        changeOnWheel: false,
         list: schema.examples ? utils.examplesId(id) : void 0,
-        ...inputProps,
+        ...restInputProps,
+        min: typeof min === "number" ? min : void 0,
+        max: typeof max === "number" ? max : void 0,
+        type: void 0,
         value,
         "aria-describedby": utils.ariaDescribedByIds(id, !!schema.examples)
       }
@@ -178,24 +183,33 @@
     }
     return /* @__PURE__ */ jsxRuntime.jsx("span", { id, children: /* @__PURE__ */ jsxRuntime.jsx(core.RichDescription, { description, registry, uiSchema }) });
   }
+  var antdMajor = parseInt(antd.version.split(".")[0], 10);
   function ErrorList({
     errors,
     registry
   }) {
     const { translateString } = registry;
-    const renderErrors = () => /* @__PURE__ */ jsxRuntime.jsx(antd.List, { className: "list-group", size: "small", children: errors.map((error, index) => /* @__PURE__ */ jsxRuntime.jsx(antd.List.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs(antd.Space, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ExclamationCircleOutlined, {}),
-      error.stack
-    ] }) }, index)) });
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      antd.Alert,
+    const { token } = antd.theme.useToken();
+    const itemBorder = `${token.lineWidth}px ${token.lineType} ${token.colorSplit}`;
+    const renderErrors = () => /* @__PURE__ */ jsxRuntime.jsx("ul", { style: { margin: 0, padding: 0, listStyle: "none" }, children: errors.map((error, index) => /* @__PURE__ */ jsxRuntime.jsx(
+      "li",
       {
-        className: "panel panel-danger errors",
-        description: renderErrors(),
-        message: translateString(utils.TranslatableString.ErrorsLabel),
-        type: "error"
-      }
-    );
+        style: {
+          display: "flex",
+          alignItems: "center",
+          padding: `${token.paddingXS}px ${token.padding}px`,
+          color: token.colorText,
+          borderBlockEnd: index < errors.length - 1 ? itemBorder : "none"
+        },
+        children: /* @__PURE__ */ jsxRuntime.jsxs(antd.Space, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(icons.ExclamationCircleOutlined, {}),
+          error.stack
+        ] })
+      },
+      index
+    )) });
+    const headerProp = antdMajor >= 6 ? { title: translateString(utils.TranslatableString.ErrorsLabel) } : { message: translateString(utils.TranslatableString.ErrorsLabel) };
+    return /* @__PURE__ */ jsxRuntime.jsx(antd.Alert, { className: "panel panel-danger errors", description: renderErrors(), type: "error", ...headerProp });
   }
   function IconButton(props) {
     const { iconType = "default", icon, onClick, uiSchema, registry, color, ...otherProps } = props;
@@ -225,7 +239,7 @@
         iconType: "primary",
         block: true,
         ...props,
-        icon: /* @__PURE__ */ jsxRuntime.jsx(PlusCircleOutlined, {})
+        icon: /* @__PURE__ */ jsxRuntime.jsx(icons.PlusCircleOutlined, {})
       }
     );
   }
@@ -233,19 +247,19 @@
     const {
       registry: { translateString }
     } = props;
-    return /* @__PURE__ */ jsxRuntime.jsx(IconButton, { title: translateString(utils.TranslatableString.CopyButton), ...props, icon: /* @__PURE__ */ jsxRuntime.jsx(CopyOutlined, {}) });
+    return /* @__PURE__ */ jsxRuntime.jsx(IconButton, { title: translateString(utils.TranslatableString.CopyButton), ...props, icon: /* @__PURE__ */ jsxRuntime.jsx(icons.CopyOutlined, {}) });
   }
   function MoveDownButton(props) {
     const {
       registry: { translateString }
     } = props;
-    return /* @__PURE__ */ jsxRuntime.jsx(IconButton, { title: translateString(utils.TranslatableString.MoveDownButton), ...props, icon: /* @__PURE__ */ jsxRuntime.jsx(ArrowDownOutlined, {}) });
+    return /* @__PURE__ */ jsxRuntime.jsx(IconButton, { title: translateString(utils.TranslatableString.MoveDownButton), ...props, icon: /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownOutlined, {}) });
   }
   function MoveUpButton(props) {
     const {
       registry: { translateString }
     } = props;
-    return /* @__PURE__ */ jsxRuntime.jsx(IconButton, { title: translateString(utils.TranslatableString.MoveUpButton), ...props, icon: /* @__PURE__ */ jsxRuntime.jsx(ArrowUpOutlined, {}) });
+    return /* @__PURE__ */ jsxRuntime.jsx(IconButton, { title: translateString(utils.TranslatableString.MoveUpButton), ...props, icon: /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpOutlined, {}) });
   }
   function RemoveButton(props) {
     const options = utils.getUiOptions(props.uiSchema);
@@ -260,7 +274,7 @@
         block: !!options.block,
         iconType: "primary",
         ...props,
-        icon: /* @__PURE__ */ jsxRuntime.jsx(DeleteOutlined, {})
+        icon: /* @__PURE__ */ jsxRuntime.jsx(icons.DeleteOutlined, {})
       }
     );
   }
@@ -274,7 +288,7 @@
         title: translateString(utils.TranslatableString.ClearButton),
         ...props,
         iconType: "link",
-        icon: /* @__PURE__ */ jsxRuntime.jsx(CloseOutlined, {})
+        icon: /* @__PURE__ */ jsxRuntime.jsx(icons.CloseOutlined, {})
       }
     );
   }
@@ -615,7 +629,8 @@
               onBlur: !readonly ? onKeyRenameBlur : void 0,
               style: INPUT_STYLE2,
               type: "text"
-            }
+            },
+            label
           )
         }
       ) }) }),
@@ -715,22 +730,23 @@
     const { formContext } = registry;
     const { readonlyAsDisabled = true } = formContext;
     const { enumOptions, enumDisabled, inline, emptyValue } = options;
-    const handleChange = (nextValue) => onChange(utils.enumOptionsValueForIndex(nextValue, enumOptions, emptyValue));
-    const handleBlur = ({ target }) => onBlur(id, utils.enumOptionsValueForIndex(target.value, enumOptions, emptyValue));
-    const handleFocus = ({ target }) => onFocus(id, utils.enumOptionsValueForIndex(target.value, enumOptions, emptyValue));
+    const optionValueFormat = utils.getOptionValueFormat(options);
+    const handleChange = (nextValue) => onChange(utils.enumOptionValueDecoder(nextValue, enumOptions, optionValueFormat, emptyValue));
+    const handleBlur = ({ target }) => onBlur(id, utils.enumOptionValueDecoder(target.value, enumOptions, optionValueFormat, emptyValue));
+    const handleFocus = ({ target }) => onFocus(id, utils.enumOptionValueDecoder(target.value, enumOptions, optionValueFormat, emptyValue));
     const extraProps = {
       id,
       onBlur: !readonly ? handleBlur : void 0,
       onFocus: !readonly ? handleFocus : void 0
     };
-    const selectedIndexes = utils.enumOptionsIndexForValue(value, enumOptions, true);
+    const selectValue = utils.enumOptionSelectedValue(value, enumOptions, true, optionValueFormat, []);
     return Array.isArray(enumOptions) && enumOptions.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
       antd.Checkbox.Group,
       {
         disabled: disabled || readonlyAsDisabled && readonly,
         name: htmlName || id,
         onChange: !readonly ? handleChange : void 0,
-        value: selectedIndexes,
+        value: selectValue,
         ...extraProps,
         "aria-describedby": utils.ariaDescribedByIds(id),
         children: Array.isArray(enumOptions) && enumOptions.map((option, i) => /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
@@ -741,7 +757,7 @@
               name: htmlName || id,
               autoFocus: i === 0 ? autofocus : false,
               disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1,
-              value: String(i),
+              value: utils.enumOptionValueEncoder(option.value, i, optionValueFormat),
               children: option.label
             }
           ),
@@ -873,10 +889,11 @@
     const { formContext } = registry;
     const { readonlyAsDisabled = true } = formContext;
     const { enumOptions, enumDisabled, emptyValue } = options;
-    const handleChange = ({ target: { value: nextValue } }) => onChange(utils.enumOptionsValueForIndex(nextValue, enumOptions, emptyValue));
-    const handleBlur = ({ target }) => onBlur(id, utils.enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue));
-    const handleFocus = ({ target }) => onFocus(id, utils.enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue));
-    const selectedIndexes = utils.enumOptionsIndexForValue(value, enumOptions);
+    const optionValueFormat = utils.getOptionValueFormat(options);
+    const handleChange = ({ target: { value: nextValue } }) => onChange(utils.enumOptionValueDecoder(nextValue, enumOptions, optionValueFormat, emptyValue));
+    const handleBlur = ({ target }) => onBlur(id, utils.enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue));
+    const handleFocus = ({ target }) => onFocus(id, utils.enumOptionValueDecoder(target && target.value, enumOptions, optionValueFormat, emptyValue));
+    const selectValue = utils.enumOptionSelectedValue(value, enumOptions, false, optionValueFormat, emptyValue);
     return /* @__PURE__ */ jsxRuntime.jsx(
       antd.Radio.Group,
       {
@@ -886,7 +903,7 @@
         onChange: !readonly ? handleChange : void 0,
         onBlur: !readonly ? handleBlur : void 0,
         onFocus: !readonly ? handleFocus : void 0,
-        value: selectedIndexes,
+        value: selectValue,
         "aria-describedby": utils.ariaDescribedByIds(id),
         children: Array.isArray(enumOptions) && enumOptions.map((option, i) => /* @__PURE__ */ jsxRuntime.jsx(
           antd.Radio,
@@ -895,7 +912,7 @@
             name: htmlName || id,
             autoFocus: i === 0 ? autofocus : false,
             disabled: disabled || Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1,
-            value: String(i),
+            value: utils.enumOptionValueEncoder(option.value, i, optionValueFormat),
             children: option.label
           },
           i
@@ -970,9 +987,10 @@
     const { formContext } = registry;
     const { readonlyAsDisabled = true } = formContext;
     const { enumOptions, enumDisabled, emptyValue } = options;
-    const handleChange = (nextValue) => onChange(utils.enumOptionsValueForIndex(nextValue, enumOptions, emptyValue));
-    const handleBlur = () => onBlur(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
-    const handleFocus = () => onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
+    const optionValueFormat = utils.getOptionValueFormat(options);
+    const handleChange = (nextValue) => onChange(utils.enumOptionValueDecoder(nextValue, enumOptions, optionValueFormat, emptyValue));
+    const handleBlur = () => onBlur(id, utils.enumOptionValueDecoder(value, enumOptions, optionValueFormat, emptyValue));
+    const handleFocus = () => onFocus(id, utils.enumOptionValueDecoder(value, enumOptions, optionValueFormat, emptyValue));
     const filterOption = (input, option) => {
       if (option && isString(option.label)) {
         return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
@@ -980,7 +998,7 @@
       return false;
     };
     const getPopupContainer = SelectWidget.getPopupContainerCallback();
-    const selectedIndexes = utils.enumOptionsIndexForValue(value, enumOptions, multiple);
+    const selectValue = utils.enumOptionSelectedValue(value, enumOptions, !!multiple, optionValueFormat, emptyValue);
     const extraProps = {
       name: htmlName || id
     };
@@ -990,7 +1008,7 @@
         const options2 = enumOptions.map(({ value: optionValue, label: optionLabel }, index) => ({
           disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(optionValue) !== -1,
           key: String(index),
-          value: String(index),
+          value: utils.enumOptionValueEncoder(optionValue, index, optionValueFormat),
           label: optionLabel
         }));
         if (showPlaceholderOption) {
@@ -999,7 +1017,7 @@
         return options2;
       }
       return void 0;
-    }, [enumDisabled, enumOptions, placeholder, showPlaceholderOption]);
+    }, [enumDisabled, enumOptions, placeholder, showPlaceholderOption, optionValueFormat]);
     return /* @__PURE__ */ jsxRuntime.jsx(
       antd.Select,
       {
@@ -1014,7 +1032,7 @@
         onFocus: !readonly ? handleFocus : void 0,
         placeholder,
         style: SELECT_STYLE,
-        value: selectedIndexes,
+        value: selectValue,
         ...extraProps,
         onOpenChange: setOpen,
         filterOption,

package/dist/index.cjs

@@ -186,6 +186,7 @@ function BaseInputTemplate(props) {
     },
     [onChange, options.emptyValue]
   );
+  const { min, max, ...restInputProps } = inputProps;
   const input = inputProps.type === "number" || inputProps.type === "integer" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
     import_antd3.InputNumber,
     {
@@ -198,8 +199,12 @@ function BaseInputTemplate(props) {
       placeholder,
       required,
       style: INPUT_STYLE,
+      changeOnWheel: false,
       list: schema.examples ? (0, import_utils3.examplesId)(id) : void 0,
-      ...inputProps,
+      ...restInputProps,
+      min: typeof min === "number" ? min : void 0,
+      max: typeof max === "number" ? max : void 0,
+      type: void 0,
       value,
       "aria-describedby": (0, import_utils3.ariaDescribedByIds)(id, !!schema.examples)
     }
@@ -241,37 +246,41 @@ function DescriptionField(props) {
 
 // src/templates/ErrorList/index.tsx
 var import_antd4 = require("antd");
-var import_ExclamationCircleOutlined = __toESM(require("@ant-design/icons/ExclamationCircleOutlined"), 1);
+var import_icons = require("@ant-design/icons");
 var import_utils4 = require("@rjsf/utils");
 var import_jsx_runtime5 = require("react/jsx-runtime");
+var antdMajor = parseInt(import_antd4.version.split(".")[0], 10);
 function ErrorList({
   errors,
   registry
 }) {
   const { translateString } = registry;
-  const renderErrors = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_antd4.List, { className: "list-group", size: "small", children: errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_antd4.List.Item, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_antd4.Space, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_ExclamationCircleOutlined.default, {}),
-    error.stack
-  ] }) }, index)) });
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-    import_antd4.Alert,
+  const { token } = import_antd4.theme.useToken();
+  const itemBorder = `${token.lineWidth}px ${token.lineType} ${token.colorSplit}`;
+  const renderErrors = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("ul", { style: { margin: 0, padding: 0, listStyle: "none" }, children: errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    "li",
     {
-      className: "panel panel-danger errors",
-      description: renderErrors(),
-      message: translateString(import_utils4.TranslatableString.ErrorsLabel),
-      type: "error"
-    }
-  );
+      style: {
+        display: "flex",
+        alignItems: "center",
+        padding: `${token.paddingXS}px ${token.padding}px`,
+        color: token.colorText,
+        borderBlockEnd: index < errors.length - 1 ? itemBorder : "none"
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_antd4.Space, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_icons.ExclamationCircleOutlined, {}),
+        error.stack
+      ] })
+    },
+    index
+  )) });
+  const headerProp = antdMajor >= 6 ? { title: translateString(import_utils4.TranslatableString.ErrorsLabel) } : { message: translateString(import_utils4.TranslatableString.ErrorsLabel) };
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_antd4.Alert, { className: "panel panel-danger errors", description: renderErrors(), type: "error", ...headerProp });
 }
 
 // src/templates/IconButton/index.tsx
 var import_antd5 = require("antd");
-var import_ArrowDownOutlined = __toESM(require("@ant-design/icons/ArrowDownOutlined"), 1);
-var import_ArrowUpOutlined = __toESM(require("@ant-design/icons/ArrowUpOutlined"), 1);
-var import_CopyOutlined = __toESM(require("@ant-design/icons/CopyOutlined"), 1);
-var import_DeleteOutlined = __toESM(require("@ant-design/icons/DeleteOutlined"), 1);
-var import_PlusCircleOutlined = __toESM(require("@ant-design/icons/PlusCircleOutlined"), 1);
-var import_CloseOutlined = __toESM(require("@ant-design/icons/CloseOutlined"), 1);
+var import_icons2 = require("@ant-design/icons");
 var import_utils5 = require("@rjsf/utils");
 var import_jsx_runtime6 = require("react/jsx-runtime");
 function IconButton(props) {
@@ -302,7 +311,7 @@ function AddButton(props) {
       iconType: "primary",
       block: true,
       ...props,
-      icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_PlusCircleOutlined.default, {})
+      icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_icons2.PlusCircleOutlined, {})
     }
   );
 }
@@ -310,19 +319,19 @@ function CopyButton(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconButton, { title: translateString(import_utils5.TranslatableString.CopyButton), ...props, icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_CopyOutlined.default, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconButton, { title: translateString(import_utils5.TranslatableString.CopyButton), ...props, icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_icons2.CopyOutlined, {}) });
 }
 function MoveDownButton(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconButton, { title: translateString(import_utils5.TranslatableString.MoveDownButton), ...props, icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_ArrowDownOutlined.default, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconButton, { title: translateString(import_utils5.TranslatableString.MoveDownButton), ...props, icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_icons2.ArrowDownOutlined, {}) });
 }
 function MoveUpButton(props) {
   const {
     registry: { translateString }
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconButton, { title: translateString(import_utils5.TranslatableString.MoveUpButton), ...props, icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_ArrowUpOutlined.default, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconButton, { title: translateString(import_utils5.TranslatableString.MoveUpButton), ...props, icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_icons2.ArrowUpOutlined, {}) });
 }
 function RemoveButton(props) {
   const options = (0, import_utils5.getUiOptions)(props.uiSchema);
@@ -337,7 +346,7 @@ function RemoveButton(props) {
       block: !!options.block,
       iconType: "primary",
       ...props,
-      icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_DeleteOutlined.default, {})
+      icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_icons2.DeleteOutlined, {})
     }
   );
 }
@@ -351,7 +360,7 @@ function ClearButton(props) {
       title: translateString(import_utils5.TranslatableString.ClearButton),
       ...props,
       iconType: "link",
-      icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_CloseOutlined.default, {})
+      icon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_icons2.CloseOutlined, {})
     }
   );
 }
@@ -737,7 +746,8 @@ function WrapIfAdditionalTemplate(props) {
             onBlur: !readonly ? onKeyRenameBlur : void 0,
             style: INPUT_STYLE2,
             type: "text"
-          }
+          },
+          label
         )
       }
     ) }) }),
@@ -850,22 +860,23 @@ function CheckboxesWidget({
   const { formContext } = registry;
   const { readonlyAsDisabled = true } = formContext;
   const { enumOptions, enumDisabled, inline, emptyValue } = options;
-  const handleChange = (nextValue) => onChange((0, import_utils12.enumOptionsValueForIndex)(nextValue, enumOptions, emptyValue));
-  const handleBlur = ({ target }) => onBlur(id, (0, import_utils12.enumOptionsValueForIndex)(target.value, enumOptions, emptyValue));
-  const handleFocus = ({ target }) => onFocus(id, (0, import_utils12.enumOptionsValueForIndex)(target.value, enumOptions, emptyValue));
+  const optionValueFormat = (0, import_utils12.getOptionValueFormat)(options);
+  const handleChange = (nextValue) => onChange((0, import_utils12.enumOptionValueDecoder)(nextValue, enumOptions, optionValueFormat, emptyValue));
+  const handleBlur = ({ target }) => onBlur(id, (0, import_utils12.enumOptionValueDecoder)(target.value, enumOptions, optionValueFormat, emptyValue));
+  const handleFocus = ({ target }) => onFocus(id, (0, import_utils12.enumOptionValueDecoder)(target.value, enumOptions, optionValueFormat, emptyValue));
   const extraProps = {
     id,
     onBlur: !readonly ? handleBlur : void 0,
     onFocus: !readonly ? handleFocus : void 0
   };
-  const selectedIndexes = (0, import_utils12.enumOptionsIndexForValue)(value, enumOptions, true);
+  const selectValue = (0, import_utils12.enumOptionSelectedValue)(value, enumOptions, true, optionValueFormat, []);
   return Array.isArray(enumOptions) && enumOptions.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_jsx_runtime18.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
     import_antd13.Checkbox.Group,
     {
       disabled: disabled || readonlyAsDisabled && readonly,
       name: htmlName || id,
       onChange: !readonly ? handleChange : void 0,
-      value: selectedIndexes,
+      value: selectValue,
       ...extraProps,
       "aria-describedby": (0, import_utils12.ariaDescribedByIds)(id),
       children: Array.isArray(enumOptions) && enumOptions.map((option, i) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("span", { children: [
@@ -876,7 +887,7 @@ function CheckboxesWidget({
             name: htmlName || id,
             autoFocus: i === 0 ? autofocus : false,
             disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1,
-            value: String(i),
+            value: (0, import_utils12.enumOptionValueEncoder)(option.value, i, optionValueFormat),
             children: option.label
           }
         ),
@@ -1035,10 +1046,11 @@ function RadioWidget({
   const { formContext } = registry;
   const { readonlyAsDisabled = true } = formContext;
   const { enumOptions, enumDisabled, emptyValue } = options;
-  const handleChange = ({ target: { value: nextValue } }) => onChange((0, import_utils17.enumOptionsValueForIndex)(nextValue, enumOptions, emptyValue));
-  const handleBlur = ({ target }) => onBlur(id, (0, import_utils17.enumOptionsValueForIndex)(target && target.value, enumOptions, emptyValue));
-  const handleFocus = ({ target }) => onFocus(id, (0, import_utils17.enumOptionsValueForIndex)(target && target.value, enumOptions, emptyValue));
-  const selectedIndexes = (0, import_utils17.enumOptionsIndexForValue)(value, enumOptions);
+  const optionValueFormat = (0, import_utils17.getOptionValueFormat)(options);
+  const handleChange = ({ target: { value: nextValue } }) => onChange((0, import_utils17.enumOptionValueDecoder)(nextValue, enumOptions, optionValueFormat, emptyValue));
+  const handleBlur = ({ target }) => onBlur(id, (0, import_utils17.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, emptyValue));
+  const handleFocus = ({ target }) => onFocus(id, (0, import_utils17.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, emptyValue));
+  const selectValue = (0, import_utils17.enumOptionSelectedValue)(value, enumOptions, false, optionValueFormat, emptyValue);
   return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     import_antd18.Radio.Group,
     {
@@ -1048,7 +1060,7 @@ function RadioWidget({
       onChange: !readonly ? handleChange : void 0,
       onBlur: !readonly ? handleBlur : void 0,
       onFocus: !readonly ? handleFocus : void 0,
-      value: selectedIndexes,
+      value: selectValue,
       "aria-describedby": (0, import_utils17.ariaDescribedByIds)(id),
       children: Array.isArray(enumOptions) && enumOptions.map((option, i) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
         import_antd18.Radio,
@@ -1057,7 +1069,7 @@ function RadioWidget({
           name: htmlName || id,
           autoFocus: i === 0 ? autofocus : false,
           disabled: disabled || Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1,
-          value: String(i),
+          value: (0, import_utils17.enumOptionValueEncoder)(option.value, i, optionValueFormat),
           children: option.label
         },
         i
@@ -1144,9 +1156,10 @@ function SelectWidget({
   const { formContext } = registry;
   const { readonlyAsDisabled = true } = formContext;
   const { enumOptions, enumDisabled, emptyValue } = options;
-  const handleChange = (nextValue) => onChange((0, import_utils19.enumOptionsValueForIndex)(nextValue, enumOptions, emptyValue));
-  const handleBlur = () => onBlur(id, (0, import_utils19.enumOptionsValueForIndex)(value, enumOptions, emptyValue));
-  const handleFocus = () => onFocus(id, (0, import_utils19.enumOptionsValueForIndex)(value, enumOptions, emptyValue));
+  const optionValueFormat = (0, import_utils19.getOptionValueFormat)(options);
+  const handleChange = (nextValue) => onChange((0, import_utils19.enumOptionValueDecoder)(nextValue, enumOptions, optionValueFormat, emptyValue));
+  const handleBlur = () => onBlur(id, (0, import_utils19.enumOptionValueDecoder)(value, enumOptions, optionValueFormat, emptyValue));
+  const handleFocus = () => onFocus(id, (0, import_utils19.enumOptionValueDecoder)(value, enumOptions, optionValueFormat, emptyValue));
   const filterOption = (input, option) => {
     if (option && (0, import_isString2.default)(option.label)) {
       return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
@@ -1154,7 +1167,7 @@ function SelectWidget({
     return false;
   };
   const getPopupContainer = SelectWidget.getPopupContainerCallback();
-  const selectedIndexes = (0, import_utils19.enumOptionsIndexForValue)(value, enumOptions, multiple);
+  const selectValue = (0, import_utils19.enumOptionSelectedValue)(value, enumOptions, !!multiple, optionValueFormat, emptyValue);
   const extraProps = {
     name: htmlName || id
   };
@@ -1164,7 +1177,7 @@ function SelectWidget({
       const options2 = enumOptions.map(({ value: optionValue, label: optionLabel }, index) => ({
         disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(optionValue) !== -1,
         key: String(index),
-        value: String(index),
+        value: (0, import_utils19.enumOptionValueEncoder)(optionValue, index, optionValueFormat),
         label: optionLabel
       }));
       if (showPlaceholderOption) {
@@ -1173,7 +1186,7 @@ function SelectWidget({
       return options2;
     }
     return void 0;
-  }, [enumDisabled, enumOptions, placeholder, showPlaceholderOption]);
+  }, [enumDisabled, enumOptions, placeholder, showPlaceholderOption, optionValueFormat]);
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     import_antd20.Select,
     {
@@ -1188,7 +1201,7 @@ function SelectWidget({
       onFocus: !readonly ? handleFocus : void 0,
       placeholder,
       style: SELECT_STYLE,
-      value: selectedIndexes,
+      value: selectValue,
       ...extraProps,
       onOpenChange: setOpen,
       filterOption,