Open
Description
Steps to reproduce
Steps:
- Open this link to live example: (required)
Current behavior
I'm trying to pass tabIndex: -1 to Autocomplete TextField but slotProps types not contain inputProps
This is my code
type CustomAutocompleteProps<
TData,
Multiple extends boolean | undefined,
DisableClearable extends boolean | undefined,
FreeSolo extends boolean | undefined
> = Omit<AutocompleteProps<TData, Multiple, DisableClearable, FreeSolo>, 'renderInput'> & {
textFieldProps?: Omit<TextFieldProps, 'label' | 'placeholder' | 'error'>;
}
const CustomAutocomplete = <
>(
props: CustomAutocompleteProps<TData, Multiple, DisableClearable, FreeSolo>
) => {
const { textFieldProps, ..rest } = props;
return (
<Autocomplete
{...rest}
renderInput={(params) => (
<TextField
{...textFieldProps}
{...params}
slotProps={{
...textFieldProps?.slotProps,
input: {
...params.InputProps,
endAdornment: (
<>
{props.loading ? (
<CircularProgress
color="inherit"
size={20}
/>
) : null}
{params.InputProps.endAdornment}
</>
),
inputProps: {
...params.inputProps,
...textFieldProps?.slotProps?.input?.inputProps // here not working
},
},
}}
/>
)}
/>
)
}
Expected behavior
No response
Context
No response
Your environment
npx @mui/envinfo
Don't forget to mention which browser you used.
Output from `npx @mui/envinfo` goes here.
Search keywords: TextField SlotProps