@rjsf/chakra-ui 6.0.0-beta.21 → 6.0.0-beta.22

package/dist/chakra-ui.esm.js

@@ -67,11 +67,6 @@ function ArrayFieldTemplate(props) {
     registry,
     uiOptions
   );
-  const ArrayFieldItemTemplate2 = getTemplate2(
-    "ArrayFieldItemTemplate",
-    registry,
-    uiOptions
-  );
   const ArrayFieldTitleTemplate = getTemplate2(
     "ArrayFieldTitleTemplate",
     registry,
@@ -107,7 +102,7 @@ function ArrayFieldTemplate(props) {
     /* @__PURE__ */ jsxs3(Grid, { children: [
       /* @__PURE__ */ jsxs3(GridItem, { children: [
         !showOptionalDataControlInTitle ? optionalDataControl : void 0,
-        items.map(({ key, ...itemProps }) => /* @__PURE__ */ jsx3(ArrayFieldItemTemplate2, { ...itemProps }, key))
+        items
       ] }),
       canAdd && /* @__PURE__ */ jsx3(GridItem, { justifySelf: "flex-end", children: /* @__PURE__ */ jsx3(Box2, { mt: 2, children: /* @__PURE__ */ jsx3(
         AddButton2,
@@ -169,6 +164,7 @@ import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function BaseInputTemplate(props) {
   const {
     id,
+    htmlName,
     type,
     value,
     label,
@@ -207,7 +203,7 @@ function BaseInputTemplate(props) {
           Input,
           {
             id,
-            name: id,
+            name: htmlName || id,
             value: value || value === 0 ? value : "",
             onChange: onChangeOverride || _onChange,
             onBlur: _onBlur,
@@ -386,8 +382,9 @@ function FieldTemplate(props) {
     displayLabel,
     hidden,
     label,
-    onDropPropertyClick,
-    onKeyChange,
+    onKeyRename,
+    onKeyRenameBlur,
+    onRemoveProperty,
     readonly,
     registry,
     required,
@@ -416,8 +413,9 @@ function FieldTemplate(props) {
       disabled,
       id,
       label,
-      onDropPropertyClick,
-      onKeyChange,
+      onKeyRename,
+      onKeyRenameBlur,
+      onRemoveProperty,
       readonly,
       required,
       schema,
@@ -479,7 +477,7 @@ function ObjectFieldTemplate(props) {
     schema,
     formData,
     optionalDataControl,
-    onAddClick,
+    onAddProperty,
     registry
   } = props;
   const uiOptions = getUiOptions4(uiSchema);
@@ -526,7 +524,7 @@ function ObjectFieldTemplate(props) {
         {
           id: buttonId2(fieldPathId, "add"),
           className: "rjsf-object-property-expand",
-          onClick: onAddClick(schema),
+          onClick: onAddProperty,
           disabled: disabled || readonly,
           uiSchema,
           registry
@@ -622,8 +620,8 @@ function WrapIfAdditionalTemplate(props) {
     disabled,
     id,
     label,
-    onDropPropertyClick,
-    onKeyChange,
+    onRemoveProperty,
+    onKeyRenameBlur,
     readonly,
     registry,
     required,
@@ -637,7 +635,6 @@ function WrapIfAdditionalTemplate(props) {
   if (!additional) {
     return /* @__PURE__ */ jsx21("div", { className: classNames, style, children });
   }
-  const handleBlur = ({ target }) => onKeyChange(target.value);
   return /* @__PURE__ */ jsxs11(Grid4, { className: classNames, style, alignItems: "center", gap: 2, children: [
     /* @__PURE__ */ jsx21(GridItem4, { children: /* @__PURE__ */ jsx21(Field, { required, label: keyLabel, children: /* @__PURE__ */ jsx21(
       Input2,
@@ -646,7 +643,7 @@ function WrapIfAdditionalTemplate(props) {
         disabled: disabled || readonly,
         id: `${id}-key`,
         name: `${id}-key`,
-        onBlur: !readonly ? handleBlur : void 0,
+        onBlur: !readonly ? onKeyRenameBlur : void 0,
         type: "text",
         mb: 1
       }
@@ -658,7 +655,7 @@ function WrapIfAdditionalTemplate(props) {
         id: buttonId3(id, "remove"),
         className: "rjsf-object-property-remove",
         disabled: disabled || readonly,
-        onClick: onDropPropertyClick(label),
+        onClick: onRemoveProperty,
         uiSchema,
         registry
       }
@@ -847,6 +844,7 @@ import { jsx as jsx25, jsxs as jsxs14 } from "react/jsx-runtime";
 function CheckboxWidget(props) {
   const {
     id,
+    htmlName,
     value,
     disabled,
     readonly,
@@ -886,7 +884,7 @@ function CheckboxWidget(props) {
       Checkbox,
       {
         id,
-        name: id,
+        name: htmlName || id,
         checked: typeof value === "undefined" ? false : value,
         disabled: disabled || readonly,
         onCheckedChange: _onChange,
@@ -912,6 +910,7 @@ import { jsx as jsx26 } from "react/jsx-runtime";
 function CheckboxesWidget(props) {
   const {
     id,
+    htmlName,
     disabled,
     options,
     value,
@@ -953,7 +952,7 @@ function CheckboxesWidget(props) {
               Checkbox,
               {
                 id: optionId(id, index),
-                name: id,
+                name: htmlName || id,
                 value: String(index),
                 disabled: disabled || itemDisabled || readonly,
                 onBlur: _onBlur,
@@ -997,6 +996,7 @@ var RadioGroup = ChakraRadioGroup.Root;
 import { jsx as jsx28 } from "react/jsx-runtime";
 function RadioWidget({
   id,
+  htmlName,
   options,
   value,
   required,
@@ -1032,7 +1032,7 @@ function RadioWidget({
           onBlur: _onBlur,
           onFocus: _onFocus,
           value: selectedIndex,
-          name: id,
+          name: htmlName || id,
           "aria-describedby": ariaDescribedByIds5(id),
           children: /* @__PURE__ */ jsx28(Stack2, { direction: row ? "row" : "column", children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
             const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
@@ -1215,6 +1215,7 @@ import { jsx as jsx32, jsxs as jsxs18 } from "react/jsx-runtime";
 function SelectWidget(props) {
   const {
     id,
+    htmlName,
     options,
     label,
     hideLabel,
@@ -1299,7 +1300,7 @@ function SelectWidget(props) {
         {
           collection: selectOptions,
           id,
-          name: id,
+          name: htmlName || id,
           multiple: isMultiple,
           closeOnSelect: !isMultiple,
           onBlur: _onBlur,
@@ -1429,6 +1430,7 @@ import {
 import { jsx as jsx34 } from "react/jsx-runtime";
 function TextareaWidget({
   id,
+  htmlName,
   placeholder,
   value,
   label,
@@ -1462,7 +1464,7 @@ function TextareaWidget({
         Textarea,
         {
           id,
-          name: id,
+          name: htmlName || id,
           value: value ?? "",
           placeholder,
           autoFocus: autofocus,