@rjsf/antd 6.0.2 → 6.1.0

package/dist/antd.umd.js

@@ -6,23 +6,25 @@
 
   // src/index.ts
   var BTN_GRP_STYLE = {
-    width: "100%"
+    width: "100%",
+    justifyContent: "flex-end"
   };
   var BTN_STYLE = {
     width: "calc(100% / 4)"
   };
   function ArrayFieldItemTemplate(props) {
-    const { children, buttonsProps, hasToolbar, index, registry, uiSchema } = props;
+    const { children, buttonsProps, displayLabel, hasDescription, hasToolbar, index, registry, uiSchema } = props;
     const uiOptions = utils.getUiOptions(uiSchema);
     const ArrayFieldItemButtonsTemplate = utils.getTemplate(
       "ArrayFieldItemButtonsTemplate",
       registry,
       uiOptions
     );
-    const { rowGutter = 24, toolbarAlign = "top" } = registry.formContext;
+    const { rowGutter = 24, toolbarAlign = displayLabel ? "middle" : "top" } = registry.formContext;
+    const margin = hasDescription ? -8 : 16;
     return /* @__PURE__ */ jsxRuntime.jsxs(antd.Row, { align: toolbarAlign, gutter: rowGutter, children: [
       /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { flex: "1", children }),
-      hasToolbar && /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { flex: "192px", children: /* @__PURE__ */ jsxRuntime.jsx(antd.Space.Compact, { style: BTN_GRP_STYLE, children: /* @__PURE__ */ jsxRuntime.jsx(ArrayFieldItemButtonsTemplate, { ...buttonsProps, style: BTN_STYLE }) }) })
+      hasToolbar && /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { flex: "120px", style: { marginTop: displayLabel ? `${margin}px` : void 0 }, children: /* @__PURE__ */ jsxRuntime.jsx(antd.Space.Compact, { style: BTN_GRP_STYLE, children: /* @__PURE__ */ jsxRuntime.jsx(ArrayFieldItemButtonsTemplate, { ...buttonsProps, style: BTN_STYLE }) }) })
     ] }, `rjsf-array-item-${index}`);
   }
   function ArrayFieldTemplate(props) {
@@ -78,7 +80,7 @@
         !showOptionalDataControlInTitle ? optionalDataControl : void 0,
         items
       ] }),
-      canAdd && /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { span: 24, children: /* @__PURE__ */ jsxRuntime.jsx(antd.Row, { gutter: rowGutter, justify: "end", children: /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { flex: "192px", children: /* @__PURE__ */ jsxRuntime.jsx(
+      canAdd && /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { span: 24, children: /* @__PURE__ */ jsxRuntime.jsx(antd.Row, { gutter: rowGutter, justify: "end", children: /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { flex: "120px", children: /* @__PURE__ */ jsxRuntime.jsx(
         AddButton2,
         {
           id: utils.buttonId(fieldPathId, "add"),
@@ -264,23 +266,16 @@
   function FieldTemplate(props) {
     const {
       children,
-      classNames: classNames4,
-      style,
       description,
-      disabled,
       displayLabel,
       errors,
       help,
+      rawHelp,
       hidden,
       id,
       label,
-      onKeyRename,
-      onKeyRenameBlur,
-      onRemoveProperty,
       rawErrors,
       rawDescription,
-      rawHelp,
-      readonly,
       registry,
       required,
       schema,
@@ -315,41 +310,23 @@
         break;
     }
     const isCheckbox = uiOptions.widget === "checkbox";
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      WrapIfAdditionalTemplate2,
+    return /* @__PURE__ */ jsxRuntime.jsx(WrapIfAdditionalTemplate2, { ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+      antd.Form.Item,
       {
-        classNames: classNames4,
-        style,
-        disabled,
-        id,
-        label,
-        onKeyRename,
-        onKeyRenameBlur,
-        onRemoveProperty,
-        readonly,
+        colon,
+        hasFeedback: schema.type !== "array" && schema.type !== "object",
+        help: !!rawHelp && help || (rawErrors?.length ? errors : void 0),
+        htmlFor: id,
+        label: displayLabel && !isCheckbox && label,
+        labelCol,
         required,
-        schema,
-        uiSchema,
-        registry,
-        children: /* @__PURE__ */ jsxRuntime.jsx(
-          antd.Form.Item,
-          {
-            colon,
-            hasFeedback: schema.type !== "array" && schema.type !== "object",
-            help: !!rawHelp && help || (rawErrors?.length ? errors : void 0),
-            htmlFor: id,
-            label: displayLabel && !isCheckbox && label,
-            labelCol,
-            required,
-            style: wrapperStyle,
-            validateStatus: rawErrors?.length ? "error" : void 0,
-            wrapperCol,
-            ...descriptionProps,
-            children
-          }
-        )
+        style: wrapperStyle,
+        validateStatus: rawErrors?.length ? "error" : void 0,
+        wrapperCol,
+        ...descriptionProps,
+        children
       }
-    );
+    ) });
   }
   function GridTemplate(props) {
     const { children, column, ...rest } = props;
@@ -441,7 +418,7 @@
         !showOptionalDataControlInTitle ? /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { span: 24, children: optionalDataControl }) : void 0,
         properties.filter((e) => !e.hidden).map((element) => /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { span: calculateColSpan(element), children: element.content }, element.name))
       ] }),
-      utils.canExpand(schema, uiSchema, formData) && /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { span: 24, children: /* @__PURE__ */ jsxRuntime.jsx(antd.Row, { gutter: rowGutter, justify: "end", children: /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { flex: "192px", children: /* @__PURE__ */ jsxRuntime.jsx(
+      utils.canExpand(schema, uiSchema, formData) && /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { span: 24, children: /* @__PURE__ */ jsxRuntime.jsx(antd.Row, { gutter: rowGutter, justify: "end", children: /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { flex: "120px", children: /* @__PURE__ */ jsxRuntime.jsx(
         AddButton2,
         {
           id: utils.buttonId(fieldPathId, "add"),
@@ -557,6 +534,7 @@
       classNames: classNames4,
       style,
       disabled,
+      displayLabel,
       id,
       label,
       onRemoveProperty,
@@ -596,7 +574,7 @@
           className: "form-group",
           hasFeedback: true,
           htmlFor: `${id}-key`,
-          label: keyLabel,
+          label: displayLabel ? keyLabel : void 0,
           labelCol,
           required,
           style: wrapperStyle,
@@ -617,7 +595,7 @@
         }
       ) }) }),
       /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { className: "form-additional", flex: "1", children }),
-      /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { flex: "192px", children: /* @__PURE__ */ jsxRuntime.jsx(
+      /* @__PURE__ */ jsxRuntime.jsx(antd.Col, { flex: "120px", style: { marginTop: displayLabel ? "40px" : void 0 }, children: /* @__PURE__ */ jsxRuntime.jsx(
         RemoveButton2,
         {
           id: utils.buttonId(id, "remove"),

package/dist/index.cjs

@@ -48,23 +48,25 @@ var import_antd = require("antd");
 var import_utils = require("@rjsf/utils");
 var import_jsx_runtime = require("react/jsx-runtime");
 var BTN_GRP_STYLE = {
-  width: "100%"
+  width: "100%",
+  justifyContent: "flex-end"
 };
 var BTN_STYLE = {
   width: "calc(100% / 4)"
 };
 function ArrayFieldItemTemplate(props) {
-  const { children, buttonsProps, hasToolbar, index, registry, uiSchema } = props;
+  const { children, buttonsProps, displayLabel, hasDescription, hasToolbar, index, registry, uiSchema } = props;
   const uiOptions = (0, import_utils.getUiOptions)(uiSchema);
   const ArrayFieldItemButtonsTemplate = (0, import_utils.getTemplate)(
     "ArrayFieldItemButtonsTemplate",
     registry,
     uiOptions
   );
-  const { rowGutter = 24, toolbarAlign = "top" } = registry.formContext;
+  const { rowGutter = 24, toolbarAlign = displayLabel ? "middle" : "top" } = registry.formContext;
+  const margin = hasDescription ? -8 : 16;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_antd.Row, { align: toolbarAlign, gutter: rowGutter, children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Col, { flex: "1", children }),
-    hasToolbar && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Col, { flex: "192px", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Space.Compact, { style: BTN_GRP_STYLE, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrayFieldItemButtonsTemplate, { ...buttonsProps, style: BTN_STYLE }) }) })
+    hasToolbar && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Col, { flex: "120px", style: { marginTop: displayLabel ? `${margin}px` : void 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Space.Compact, { style: BTN_GRP_STYLE, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrayFieldItemButtonsTemplate, { ...buttonsProps, style: BTN_STYLE }) }) })
   ] }, `rjsf-array-item-${index}`);
 }
 
@@ -127,7 +129,7 @@ function ArrayFieldTemplate(props) {
       !showOptionalDataControlInTitle ? optionalDataControl : void 0,
       items
     ] }),
-    canAdd && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_antd2.Col, { span: 24, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_antd2.Row, { gutter: rowGutter, justify: "end", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_antd2.Col, { flex: "192px", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    canAdd && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_antd2.Col, { span: 24, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_antd2.Row, { gutter: rowGutter, justify: "end", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_antd2.Col, { flex: "120px", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
       AddButton2,
       {
         id: (0, import_utils2.buttonId)(fieldPathId, "add"),
@@ -213,7 +215,7 @@ function BaseInputTemplate(props) {
   ] });
 }
 
-// src/templates/DescriptionField/index.tsx
+// src/templates/FieldDescriptionTemplate/index.tsx
 var import_core = require("@rjsf/core");
 var import_jsx_runtime4 = require("react/jsx-runtime");
 function DescriptionField(props) {
@@ -347,23 +349,16 @@ var VERTICAL_WRAPPER_COL = { span: 24 };
 function FieldTemplate(props) {
   const {
     children,
-    classNames: classNames4,
-    style,
     description,
-    disabled,
     displayLabel,
     errors,
     help,
+    rawHelp,
     hidden,
     id,
     label,
-    onKeyRename,
-    onKeyRenameBlur,
-    onRemoveProperty,
     rawErrors,
     rawDescription,
-    rawHelp,
-    readonly,
     registry,
     required,
     schema,
@@ -398,41 +393,23 @@ function FieldTemplate(props) {
       break;
   }
   const isCheckbox = uiOptions.widget === "checkbox";
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    WrapIfAdditionalTemplate2,
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(WrapIfAdditionalTemplate2, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    import_antd6.Form.Item,
     {
-      classNames: classNames4,
-      style,
-      disabled,
-      id,
-      label,
-      onKeyRename,
-      onKeyRenameBlur,
-      onRemoveProperty,
-      readonly,
+      colon,
+      hasFeedback: schema.type !== "array" && schema.type !== "object",
+      help: !!rawHelp && help || (rawErrors?.length ? errors : void 0),
+      htmlFor: id,
+      label: displayLabel && !isCheckbox && label,
+      labelCol,
       required,
-      schema,
-      uiSchema,
-      registry,
-      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-        import_antd6.Form.Item,
-        {
-          colon,
-          hasFeedback: schema.type !== "array" && schema.type !== "object",
-          help: !!rawHelp && help || (rawErrors?.length ? errors : void 0),
-          htmlFor: id,
-          label: displayLabel && !isCheckbox && label,
-          labelCol,
-          required,
-          style: wrapperStyle,
-          validateStatus: rawErrors?.length ? "error" : void 0,
-          wrapperCol,
-          ...descriptionProps,
-          children
-        }
-      )
+      style: wrapperStyle,
+      validateStatus: rawErrors?.length ? "error" : void 0,
+      wrapperCol,
+      ...descriptionProps,
+      children
     }
-  );
+  ) });
 }
 
 // src/templates/GridTemplate/index.tsx
@@ -541,7 +518,7 @@ function ObjectFieldTemplate(props) {
       !showOptionalDataControlInTitle ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_antd8.Col, { span: 24, children: optionalDataControl }) : void 0,
       properties.filter((e) => !e.hidden).map((element) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_antd8.Col, { span: calculateColSpan(element), children: element.content }, element.name))
     ] }),
-    (0, import_utils8.canExpand)(schema, uiSchema, formData) && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_antd8.Col, { span: 24, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_antd8.Row, { gutter: rowGutter, justify: "end", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_antd8.Col, { flex: "192px", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    (0, import_utils8.canExpand)(schema, uiSchema, formData) && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_antd8.Col, { span: 24, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_antd8.Row, { gutter: rowGutter, justify: "end", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_antd8.Col, { flex: "120px", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
       AddButton2,
       {
         id: (0, import_utils8.buttonId)(fieldPathId, "add"),
@@ -676,6 +653,7 @@ function WrapIfAdditionalTemplate(props) {
     classNames: classNames4,
     style,
     disabled,
+    displayLabel,
     id,
     label,
     onRemoveProperty,
@@ -715,7 +693,7 @@ function WrapIfAdditionalTemplate(props) {
         className: "form-group",
         hasFeedback: true,
         htmlFor: `${id}-key`,
-        label: keyLabel,
+        label: displayLabel ? keyLabel : void 0,
         labelCol,
         required,
         style: wrapperStyle,
@@ -736,7 +714,7 @@ function WrapIfAdditionalTemplate(props) {
       }
     ) }) }),
     /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_antd11.Col, { className: "form-additional", flex: "1", children }),
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_antd11.Col, { flex: "192px", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_antd11.Col, { flex: "120px", style: { marginTop: displayLabel ? "40px" : void 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       RemoveButton2,
       {
         id: (0, import_utils10.buttonId)(id, "remove"),