diff --git a/packages/ra-ui-materialui/src/list/filter/FilterButton.stories.tsx b/packages/ra-ui-materialui/src/list/filter/FilterButton.stories.tsx
index 72d9d8279e8..c6f3058397c 100644
--- a/packages/ra-ui-materialui/src/list/filter/FilterButton.stories.tsx
+++ b/packages/ra-ui-materialui/src/list/filter/FilterButton.stories.tsx
@@ -11,6 +11,7 @@ import {
TextField,
TextInput,
TopToolbar,
+ SearchInput,
} from 'react-admin';
import fakerestDataProvider from 'ra-data-fakerest';
@@ -23,6 +24,12 @@ export default {
options: [false, true],
},
},
+ size: {
+ control: {
+ type: 'select',
+ options: [undefined, 'small', 'medium'],
+ },
+ },
},
};
@@ -221,3 +228,34 @@ export const DisabledFilters = (args: { disableSaveQuery?: boolean }) => {
);
};
+
+export const WithSearchInput = (args: {
+ disableSaveQuery?: boolean;
+ size?: 'small' | 'medium';
+}) => {
+ const postFilters: React.ReactElement[] = [
+ ,
+ ,
+ v?.foo || ''}
+ parse={v => ({ foo: v })}
+ size={args.size}
+ />,
+ ];
+ return (
+
+ }
+ />
+
+ );
+};
diff --git a/packages/ra-ui-materialui/src/list/filter/FilterFormInput.tsx b/packages/ra-ui-materialui/src/list/filter/FilterFormInput.tsx
index 380ef69ed5a..d71ea6ad4d3 100644
--- a/packages/ra-ui-materialui/src/list/filter/FilterFormInput.tsx
+++ b/packages/ra-ui-materialui/src/list/filter/FilterFormInput.tsx
@@ -33,7 +33,7 @@ export const FilterFormInput = props => {
{React.cloneElement(filterElement, {
resource,
record: emptyRecord,
- size: 'small',
+ size: filterElement.props.size ?? 'small',
helperText: false,
// ignore defaultValue in Field because it was already set in Form (via mergedInitialValuesWithDefaultValues)
defaultValue: undefined,