update disable-clear

Author: JinParc

docs/SimpleFormIterator.md

@@ -70,10 +70,10 @@ const OrderEdit = () => (
 | Prop     | Required | Type           | Default               | Description                         |
 |----------|----------|----------------|-----------------------|-------------------------------------|
 | `addButton` | Optional | `ReactElement` | - | Component to render for the add button |
-| `clearButton` | Optional | `boolean` | `true` | When `false`, the user cannot clear the array |
 | `children` | Optional | `ReactElement` | - | List of inputs to display for each row |
 | `className` | Optional | `string` | - | Applied to the root element (`<ul>`) |
 | `disableAdd` | Optional | `boolean` | `false` | When true, the user cannot add new rows |
+| `disableClear` | Optional | `boolean` | `false` | When true, the user cannot clear the array |
 | `disableRemove` | Optional | `boolean` | `false` | When true, the user cannot remove rows |
 | `disableReordering` | Optional | `boolean` | `false` | When true, the user cannot reorder rows |
 | `fullWidth` | Optional | `boolean` | `false` | Set to true to push the actions to the right |
@@ -95,10 +95,6 @@ This prop lets you pass a custom element to replace the default Add button.
 </SimpleFormIterator>
 ```
 
-## `clearButton`
-
-This prop lets you pass a custom element to replace the default "Clear the list" button
-
 ## `children`
 
 A list of Input elements, that will be rendered on each row. 
@@ -202,6 +198,19 @@ When true, the Add button isn't rendered, so users cannot add new rows.
 </SimpleFormIterator>
 ```
 
+## `disableClear`
+
+When true, the array clear button isn't rendered, so the user cannot clear the array.
+
+```jsx
+<SimpleFormIterator disableClear>
+    <TextInput source="name" />
+    <NumberInput source="price" />
+    <NumberInput source="quantity" />
+</SimpleFormIterator>
+```
+
+
 ## `disableRemove`
 
 When true, the Remove buttons aren't rendered, so users cannot remove existing rows.

packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.stories.tsx

@@ -122,6 +122,21 @@ export const DisableAdd = () => (
     </AdminContext>
 );
 
+export const DisableClear = () => (
+    <AdminContext dataProvider={dataProvider}>
+        <Edit resource="books" id="1">
+            <SimpleForm>
+                <ArrayInput source="authors">
+                    <SimpleFormIterator disableClear>
+                        <TextInput source="name" />
+                        <TextInput source="role" />
+                    </SimpleFormIterator>
+                </ArrayInput>
+            </SimpleForm>
+        </Edit>
+    </AdminContext>
+);
+
 export const DisableRemove = () => (
     <AdminContext dataProvider={dataProvider}>
         <Edit resource="books" id="1">
@@ -177,18 +192,3 @@ export const Sx = () => (
         </Edit>
     </AdminContext>
 );
-
-export const DisableClearButton = () => (
-    <AdminContext dataProvider={dataProvider}>
-        <Edit resource="books" id="1">
-            <SimpleForm>
-                <ArrayInput source="authors">
-                    <SimpleFormIterator clearButton={false}>
-                        <TextInput source="name" />
-                        <TextInput source="role" />
-                    </SimpleFormIterator>
-                </ArrayInput>
-            </SimpleForm>
-        </Edit>
-    </AdminContext>
-);

packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.tsx

@@ -44,13 +44,13 @@ export const SimpleFormIterator = (props: SimpleFormIteratorProps) => {
         addButton = <DefaultAddItemButton />,
         removeButton = <DefaultRemoveItemButton />,
         reOrderButtons = <DefaultReOrderButtons />,
-        clearButton = true,
         children,
         className,
         resource,
         source,
         disabled,
         disableAdd,
+        disableClear,
         disableRemove,
         disableReordering,
         inline,
@@ -195,7 +195,7 @@ export const SimpleFormIterator = (props: SimpleFormIteratorProps) => {
                                 ),
                             })}
                             {fields.length > 0 &&
-                                clearButton &&
+                                !disableClear &&
                                 !disableRemove && (
                                     <>
                                         <Confirm
@@ -259,11 +259,11 @@ type GetItemLabelFunc = (index: number) => string | ReactElement;
 
 export interface SimpleFormIteratorProps extends Partial<UseFieldArrayReturn> {
     addButton?: ReactElement;
-    clearButton?: boolean;
     children?: ReactNode;
     className?: string;
     disabled?: boolean;
     disableAdd?: boolean;
+    disableClear?: boolean;
     disableRemove?: boolean | DisableRemoveFunction;
     disableReordering?: boolean;
     fullWidth?: boolean;