@rjsf/primereact 6.0.0-beta.20 → 6.0.0-beta.21

package/dist/primereact.esm.js

@@ -63,6 +63,7 @@ function ArrayFieldTemplate(props) {
     className,
     disabled,
     items,
+    optionalDataControl,
     onAddClick,
     readonly,
     schema,
@@ -87,6 +88,7 @@ function ArrayFieldTemplate(props) {
     registry,
     uiOptions
   );
+  const showOptionalDataControlInTitle = !readonly && !disabled;
   return /* @__PURE__ */ jsxs2(Fragment, { children: [
     /* @__PURE__ */ jsx3(
       ArrayFieldTitleTemplate2,
@@ -96,7 +98,8 @@ function ArrayFieldTemplate(props) {
         schema,
         uiSchema,
         required,
-        registry
+        registry,
+        optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : void 0
       }
     ),
     /* @__PURE__ */ jsxs2(
@@ -117,15 +120,18 @@ function ArrayFieldTemplate(props) {
             }
           ),
           /* @__PURE__ */ jsxs2("div", { children: [
-            /* @__PURE__ */ jsx3("div", { children: items && items.map(({ key, uiSchema: itemUiSchema = {}, ...props2 }) => {
-              const mergedUiSchema = {
-                ...itemUiSchema,
-                [UI_OPTIONS_KEY]: {
-                  ...itemUiSchema[UI_OPTIONS_KEY]
-                }
-              };
-              return /* @__PURE__ */ jsx3(ArrayFieldItemTemplate2, { ...props2, uiSchema: mergedUiSchema }, key);
-            }) }),
+            /* @__PURE__ */ jsxs2("div", { children: [
+              !showOptionalDataControlInTitle ? optionalDataControl : void 0,
+              items.map(({ key, uiSchema: itemUiSchema = {}, ...props2 }) => {
+                const mergedUiSchema = {
+                  ...itemUiSchema,
+                  [UI_OPTIONS_KEY]: {
+                    ...itemUiSchema[UI_OPTIONS_KEY]
+                  }
+                };
+                return /* @__PURE__ */ jsx3(ArrayFieldItemTemplate2, { ...props2, uiSchema: mergedUiSchema }, key);
+              })
+            ] }),
             canAdd && /* @__PURE__ */ jsx3(
               "div",
               {
@@ -392,6 +398,7 @@ import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs7 } from "react/jsx-ru
 function ObjectFieldTemplate(props) {
   const {
     description,
+    optionalDataControl,
     onAddClick,
     title,
     properties,
@@ -411,6 +418,7 @@ function ObjectFieldTemplate(props) {
     registry,
     uiOptions
   );
+  const showOptionalDataControlInTitle = !readonly && !disabled;
   const {
     ButtonTemplates: { AddButton: AddButton2 }
   } = registry.templates;
@@ -423,7 +431,8 @@ function ObjectFieldTemplate(props) {
         required,
         schema,
         uiSchema,
-        registry
+        registry,
+        optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : void 0
       }
     ),
     description && /* @__PURE__ */ jsx12("div", { style: { marginBottom: "1rem" }, children: /* @__PURE__ */ jsx12(
@@ -436,6 +445,7 @@ function ObjectFieldTemplate(props) {
         registry
       }
     ) }),
+    !showOptionalDataControlInTitle ? optionalDataControl : void 0,
     properties.map((prop) => prop.content),
     canExpand(schema, uiSchema, formData) && /* @__PURE__ */ jsx12("div", { style: { marginTop: "1rem", textAlign: "right" }, children: /* @__PURE__ */ jsx12(
       AddButton2,
@@ -451,36 +461,77 @@ function ObjectFieldTemplate(props) {
   ] });
 }
 
+// src/OptionalDataControlsTemplate/OptionalDataControlsTemplate.tsx
+import { jsx as jsx13 } from "react/jsx-runtime";
+function OptionalDataControlsTemplate(props) {
+  const { id, registry, label, onAddClick, onRemoveClick } = props;
+  if (onAddClick) {
+    return /* @__PURE__ */ jsx13(
+      IconButton,
+      {
+        id,
+        registry,
+        className: "rjsf-add-optional-data",
+        onClick: onAddClick,
+        title: label,
+        icon: "pi pi-plus",
+        style: { height: "1.5rem", width: "1.5rem" }
+      }
+    );
+  } else if (onRemoveClick) {
+    return /* @__PURE__ */ jsx13(
+      RemoveButton,
+      {
+        id,
+        registry,
+        className: "rjsf-remove-optional-data",
+        onClick: onRemoveClick,
+        title: label,
+        style: { height: "1.5rem", width: "1.5rem" }
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx13("em", { id, children: label });
+}
+
 // src/SubmitButton/SubmitButton.tsx
 import { Button as Button3 } from "primereact/button";
 import { getSubmitButtonOptions } from "@rjsf/utils";
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 function SubmitButton({ uiSchema }) {
   const { submitText, norender, props: submitButtonProps = {} } = getSubmitButtonOptions(uiSchema);
   if (norender) {
     return null;
   }
-  return /* @__PURE__ */ jsx13(Button3, { type: "submit", label: submitText, ...submitButtonProps });
+  return /* @__PURE__ */ jsx14(Button3, { type: "submit", label: submitText, ...submitButtonProps });
 }
 
 // src/TitleField/TitleField.tsx
 import { Divider } from "primereact/divider";
 import { getUiOptions as getUiOptions5, titleId as titleId2 } from "@rjsf/utils";
-import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
 function TitleField({
   id,
   title,
   uiSchema,
-  required
+  required,
+  optionalDataControl
 }) {
   const uiOptions = getUiOptions5(uiSchema);
+  let heading = /* @__PURE__ */ jsxs8("h5", { style: { margin: 0, fontSize: id === titleId2("root") ? "1.5rem" : "1.2rem" }, children: [
+    uiOptions.title || title,
+    " ",
+    required ? "*" : ""
+  ] });
+  if (optionalDataControl) {
+    heading = /* @__PURE__ */ jsxs8("div", { style: { display: "flex" }, children: [
+      /* @__PURE__ */ jsx15("div", { style: { flexGrow: 1 }, children: heading }),
+      /* @__PURE__ */ jsx15("div", { style: { marginLeft: "-5px" }, children: optionalDataControl })
+    ] });
+  }
   return /* @__PURE__ */ jsxs8("div", { id, children: [
-    /* @__PURE__ */ jsxs8("h5", { style: { margin: 0, fontSize: id === titleId2("root") ? "1.5rem" : "1.2rem" }, children: [
-      uiOptions.title || title,
-      " ",
-      required ? "*" : ""
-    ] }),
-    /* @__PURE__ */ jsx14(Divider, { pt: { root: { style: { marginTop: "0.5rem" } } } })
+    heading,
+    /* @__PURE__ */ jsx15(Divider, { pt: { root: { style: { marginTop: "0.5rem" } } } })
   ] });
 }
 
@@ -491,7 +542,7 @@ import {
   TranslatableString as TranslatableString4
 } from "@rjsf/utils";
 import { InputText as InputText2 } from "primereact/inputtext";
-import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
 function WrapIfAdditionalTemplate({
   classNames,
   style,
@@ -511,7 +562,7 @@ function WrapIfAdditionalTemplate({
   const keyLabel = translateString(TranslatableString4.KeyLabel, [label]);
   const additional = ADDITIONAL_PROPERTY_FLAG in schema;
   if (!additional) {
-    return /* @__PURE__ */ jsx15("div", { className: classNames, style, children });
+    return /* @__PURE__ */ jsx16("div", { className: classNames, style, children });
   }
   const handleBlur = ({ target }) => onKeyChange(target.value);
   return /* @__PURE__ */ jsxs9(
@@ -521,8 +572,8 @@ function WrapIfAdditionalTemplate({
       style: { ...style, display: "flex", alignItems: "center", gap: "1rem" },
       children: [
         /* @__PURE__ */ jsxs9("div", { style: { flex: 1 }, children: [
-          /* @__PURE__ */ jsx15("label", { htmlFor: `${id}-key`, style: { display: "block", marginBottom: "0.5rem" }, children: keyLabel }),
-          /* @__PURE__ */ jsx15(
+          /* @__PURE__ */ jsx16("label", { htmlFor: `${id}-key`, style: { display: "block", marginBottom: "0.5rem" }, children: keyLabel }),
+          /* @__PURE__ */ jsx16(
             InputText2,
             {
               id: `${id}-key`,
@@ -535,8 +586,8 @@ function WrapIfAdditionalTemplate({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx15("div", { style: { flex: 1 }, children }),
-        /* @__PURE__ */ jsx15("div", { children: /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsx16("div", { style: { flex: 1 }, children }),
+        /* @__PURE__ */ jsx16("div", { children: /* @__PURE__ */ jsx16(
           RemoveButton2,
           {
             id: buttonId3(id, "remove"),
@@ -557,19 +608,26 @@ import {
   getUiOptions as getUiOptions6,
   titleId as titleId3
 } from "@rjsf/utils";
-import { jsxs as jsxs10 } from "react/jsx-runtime";
-function ArrayFieldTitleTemplate({ title, uiSchema, required, fieldPathId }) {
+import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
+function ArrayFieldTitleTemplate({ title, uiSchema, required, fieldPathId, optionalDataControl }) {
   const uiOptions = getUiOptions6(uiSchema);
-  return /* @__PURE__ */ jsxs10("h5", { id: titleId3(fieldPathId), style: { margin: 0, fontSize: "1.5rem", marginBottom: "0.2rem" }, children: [
+  let heading = /* @__PURE__ */ jsxs10("h5", { id: titleId3(fieldPathId), style: { margin: 0, fontSize: "1.5rem", marginBottom: "0.2rem" }, children: [
     uiOptions.title || title,
     " ",
     required ? "*" : ""
   ] });
+  if (optionalDataControl) {
+    heading = /* @__PURE__ */ jsxs10("div", { style: { display: "flex" }, children: [
+      /* @__PURE__ */ jsx17("div", { style: { flexGrow: 1 }, children: heading }),
+      /* @__PURE__ */ jsx17("div", { children: optionalDataControl })
+    ] });
+  }
+  return heading;
 }
 
 // src/GridTemplate/GridTemplate.tsx
 import { useEffect, useState } from "react";
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 var breakpoints = {
   xs: 0,
   sm: 576,
@@ -606,7 +664,7 @@ function GridTemplateRow(props) {
   const layoutGrid = uiSchema?.["ui:layoutGrid"] ?? {};
   const totalColumns = layoutGrid.columns ?? 12;
   const gap = layoutGrid.gap ?? "16px";
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx18(
     "div",
     {
       style: {
@@ -633,7 +691,7 @@ function GridTemplateColumn(props) {
     return () => window.removeEventListener("resize", handleResize);
   }, []);
   const span = getResponsiveSpan(props, breakpoint);
-  return /* @__PURE__ */ jsx16("div", { style: { gridColumn: `span ${span} / span ${span}`, ...style ?? {} }, ...rest, children });
+  return /* @__PURE__ */ jsx18("div", { style: { gridColumn: `span ${span} / span ${span}`, ...style ?? {} }, ...rest, children });
 }
 
 // src/Templates/Templates.ts
@@ -658,6 +716,7 @@ function generateTemplates() {
     FieldTemplate,
     MultiSchemaFieldTemplate,
     ObjectFieldTemplate,
+    OptionalDataControlsTemplate,
     TitleFieldTemplate: TitleField,
     WrapIfAdditionalTemplate,
     GridTemplate
@@ -672,7 +731,7 @@ import {
   getInputProps as getInputProps2
 } from "@rjsf/utils";
 import { AutoComplete } from "primereact/autocomplete";
-import { Fragment as Fragment3, jsx as jsx17 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx19 } from "react/jsx-runtime";
 function AutoCompleteWidget(props) {
   const {
     id,
@@ -703,7 +762,7 @@ function AutoCompleteWidget(props) {
   const search = (event) => {
     setItems(examples.filter((example) => example.toString().toLowerCase().includes(event.query.toLowerCase())));
   };
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx19(
     AutoComplete,
     {
       id,
@@ -711,7 +770,7 @@ function AutoCompleteWidget(props) {
       placeholder,
       ...primeProps,
       ...inputProps,
-      loadingIcon: /* @__PURE__ */ jsx17(Fragment3, {}),
+      loadingIcon: /* @__PURE__ */ jsx19(Fragment3, {}),
       required,
       autoFocus: autofocus,
       disabled: disabled || readonly,
@@ -752,7 +811,7 @@ import {
   schemaRequiresTrueValue
 } from "@rjsf/utils";
 import { Checkbox } from "primereact/checkbox";
-import { Fragment as Fragment4, jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
 function CheckboxWidget(props) {
   const {
     id,
@@ -783,7 +842,7 @@ function CheckboxWidget(props) {
   const description = options.description ?? schema.description;
   const primeProps = options.prime || {};
   return /* @__PURE__ */ jsxs11(Fragment4, { children: [
-    !hideLabel && !!description && /* @__PURE__ */ jsx18(
+    !hideLabel && !!description && /* @__PURE__ */ jsx20(
       DescriptionFieldTemplate,
       {
         id: descriptionId2(id),
@@ -794,7 +853,7 @@ function CheckboxWidget(props) {
       }
     ),
     /* @__PURE__ */ jsxs11("div", { style: { display: "flex", flexDirection: "row", gap: "0.5rem", alignItems: "center" }, children: [
-      /* @__PURE__ */ jsx18(
+      /* @__PURE__ */ jsx20(
         Checkbox,
         {
           inputId: id,
@@ -810,7 +869,7 @@ function CheckboxWidget(props) {
           "aria-describedby": ariaDescribedByIds3(id)
         }
       ),
-      labelValue(/* @__PURE__ */ jsx18(Label, { id, text: label }), hideLabel, false)
+      labelValue(/* @__PURE__ */ jsx20(Label, { id, text: label }), hideLabel, false)
     ] })
   ] });
 }
@@ -826,7 +885,7 @@ import {
   descriptionId as descriptionId3,
   getTemplate as getTemplate6
 } from "@rjsf/utils";
-import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
 function CheckboxesWidget(props) {
   const {
     id,
@@ -867,7 +926,7 @@ function CheckboxesWidget(props) {
       id,
       style: { display: "flex", flexDirection: "column", gap: "1rem", marginTop: "0.5rem", marginBottom: "0.5rem" },
       children: [
-        !hideLabel && !!description && /* @__PURE__ */ jsx19(
+        !hideLabel && !!description && /* @__PURE__ */ jsx21(
           DescriptionFieldTemplate,
           {
             id: descriptionId3(id),
@@ -881,7 +940,7 @@ function CheckboxesWidget(props) {
           const checked = enumOptionsIsSelected(option.value, checkboxesValues);
           const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
           return /* @__PURE__ */ jsxs12("div", { style: { display: "flex", flexDirection: "row", gap: "0.5rem", alignItems: "center" }, children: [
-            /* @__PURE__ */ jsx19(
+            /* @__PURE__ */ jsx21(
               Checkbox2,
               {
                 inputId: optionId(id, index),
@@ -897,7 +956,7 @@ function CheckboxesWidget(props) {
                 "aria-describedby": ariaDescribedByIds4(id)
               }
             ),
-            /* @__PURE__ */ jsx19(Label, { id: optionId(id, index), text: option.label })
+            /* @__PURE__ */ jsx21(Label, { id: optionId(id, index), text: option.label })
           ] }, index);
         })
       ]
@@ -911,7 +970,7 @@ import {
   getInputProps as getInputProps3
 } from "@rjsf/utils";
 import { ColorPicker } from "primereact/colorpicker";
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 function ColorWidget(props) {
   const {
     id,
@@ -935,7 +994,7 @@ function ColorWidget(props) {
   const _onChange = ({ target: { value: value2 } }) => onChange(value2 === "" ? options.emptyValue : value2);
   const _onBlur = () => onBlur && onBlur(id, value);
   const _onFocus = () => onFocus && onFocus(id, value);
-  return /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx22(
     ColorPicker,
     {
       id,
@@ -962,7 +1021,7 @@ import {
   getInputProps as getInputProps4
 } from "@rjsf/utils";
 import { Password } from "primereact/password";
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 function PasswordWidget(props) {
   const {
     id,
@@ -986,7 +1045,7 @@ function PasswordWidget(props) {
   const _onChange = ({ target: { value: value2 } }) => onChange(value2 === "" ? options.emptyValue : value2);
   const _onBlur = () => onBlur && onBlur(id, value);
   const _onFocus = () => onFocus && onFocus(id, value);
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx23(
     Password,
     {
       id,
@@ -1016,7 +1075,7 @@ import {
   optionId as optionId2
 } from "@rjsf/utils";
 import { RadioButton } from "primereact/radiobutton";
-import { jsx as jsx22, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs13 } from "react/jsx-runtime";
 function RadioWidget(props) {
   const { id, value, disabled, readonly, onChange, onBlur, onFocus, options } = props;
   const primeProps = options.prime || {};
@@ -1026,11 +1085,11 @@ function RadioWidget(props) {
   };
   const _onBlur = () => onBlur(id, value);
   const _onFocus = () => onFocus(id, value);
-  return /* @__PURE__ */ jsx22("div", { style: { display: "flex", flexDirection: "row", gap: "1rem" }, children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
+  return /* @__PURE__ */ jsx24("div", { style: { display: "flex", flexDirection: "row", gap: "1rem" }, children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
     const checked = enumOptionsIsSelected2(option.value, value);
     const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
     return /* @__PURE__ */ jsxs13("div", { style: { display: "flex", alignItems: "center" }, children: [
-      /* @__PURE__ */ jsx22(
+      /* @__PURE__ */ jsx24(
         RadioButton,
         {
           inputId: optionId2(id, index),
@@ -1045,7 +1104,7 @@ function RadioWidget(props) {
           "aria-describedby": ariaDescribedByIds7(id)
         }
       ),
-      /* @__PURE__ */ jsx22("label", { htmlFor: optionId2(id, index), style: { marginLeft: "8px" }, children: option.label })
+      /* @__PURE__ */ jsx24("label", { htmlFor: optionId2(id, index), style: { marginLeft: "8px" }, children: option.label })
     ] }, index);
   }) });
 }
@@ -1053,7 +1112,7 @@ function RadioWidget(props) {
 // src/RangeWidget/RangeWidget.tsx
 import { Slider } from "primereact/slider";
 import { ariaDescribedByIds as ariaDescribedByIds8, rangeSpec } from "@rjsf/utils";
-import { Fragment as Fragment5, jsx as jsx23 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx25 } from "react/jsx-runtime";
 function RangeWidget(props) {
   const { value, readonly, disabled, onBlur, onFocus, options, schema, onChange, id } = props;
   const primeProps = options.prime || {};
@@ -1063,7 +1122,7 @@ function RangeWidget(props) {
   };
   const _onBlur = ({ target }) => onBlur(id, target && target.value);
   const _onFocus = ({ target }) => onFocus(id, target && target.value);
-  return /* @__PURE__ */ jsx23(Fragment5, { children: /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsx25(Fragment5, { children: /* @__PURE__ */ jsx25(
     Slider,
     {
       ...primeProps,
@@ -1086,10 +1145,10 @@ import {
   enumOptionsValueForIndex as enumOptionsValueForIndex2
 } from "@rjsf/utils";
 import { MultiSelect } from "primereact/multiselect";
-import { jsx as jsx24 } from "react/jsx-runtime";
+import { jsx as jsx26 } from "react/jsx-runtime";
 function SelectWidget(props) {
   const { multiple = false } = props;
-  return multiple ? /* @__PURE__ */ jsx24(MultiSelectWidget, { ...props }) : /* @__PURE__ */ jsx24(SingleSelectWidget, { ...props });
+  return multiple ? /* @__PURE__ */ jsx26(MultiSelectWidget, { ...props }) : /* @__PURE__ */ jsx26(SingleSelectWidget, { ...props });
 }
 function SingleSelectWidget({
   schema,
@@ -1127,7 +1186,7 @@ function SingleSelectWidget({
   const _onFocus = ({ target }) => onFocus(id, enumOptionsValueForIndex2(target && target.value, enumOptions, optEmptyVal));
   const selectedIndexes = enumOptionsIndexForValue(value, enumOptions, multiple);
   const { ...dropdownRemainingProps } = dropdownProps;
-  return /* @__PURE__ */ jsx24(
+  return /* @__PURE__ */ jsx26(
     Dropdown,
     {
       id,
@@ -1171,7 +1230,7 @@ function MultiSelectWidget({
   const _onBlur = ({ target }) => onBlur(id, enumOptionsValueForIndex2(target && target.value, enumOptions, optEmptyVal));
   const _onFocus = ({ target }) => onFocus(id, enumOptionsValueForIndex2(target && target.value, enumOptions, optEmptyVal));
   const selectedIndexes = enumOptionsIndexForValue(value, enumOptions, multiple);
-  return /* @__PURE__ */ jsx24(
+  return /* @__PURE__ */ jsx26(
     MultiSelect,
     {
       id,
@@ -1198,7 +1257,7 @@ function MultiSelectWidget({
 
 // src/TextareaWidget/TextareaWidget.tsx
 import { InputTextarea } from "primereact/inputtextarea";
-import { jsx as jsx25 } from "react/jsx-runtime";
+import { jsx as jsx27 } from "react/jsx-runtime";
 function TextareaWidget(props) {
   const { id, value, required, disabled, readonly, autofocus, onChange, onBlur, onFocus, options } = props;
   const primeProps = options.prime || {};
@@ -1209,7 +1268,7 @@ function TextareaWidget(props) {
   const handleChange = (event) => {
     onChange(event.target.value === "" ? options.emptyValue : event.target.value);
   };
-  return /* @__PURE__ */ jsx25(
+  return /* @__PURE__ */ jsx27(
     InputTextarea,
     {
       id,
@@ -1232,7 +1291,7 @@ import {
   getInputProps as getInputProps5
 } from "@rjsf/utils";
 import { InputNumber } from "primereact/inputnumber";
-import { jsx as jsx26 } from "react/jsx-runtime";
+import { jsx as jsx28 } from "react/jsx-runtime";
 function UpDownWidget(props) {
   const {
     id,
@@ -1257,7 +1316,7 @@ function UpDownWidget(props) {
   const _onChange = (event) => onChange(event.value === null ? options.emptyValue : value);
   const _onBlur = () => onBlur && onBlur(id, value);
   const _onFocus = () => onFocus && onFocus(id, value);
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx28(
     InputNumber,
     {
       id,