fix(striker-ui): allow extend renderInput in Autocomplete

striker-ui/components/Autocomplete.tsx

@@ -2,6 +2,7 @@ import {
   Autocomplete as MUIAutocomplete,
   autocompleteClasses as muiAutocompleteClasses,
   AutocompleteProps as MUIAutocompleteProps,
+  AutocompleteRenderInputParams as MUIAutocompleteRenderInputParams,
   Grow as MUIGrow,
   outlinedInputClasses as muiOutlinedInputClasses,
   Paper as MUIPaper,
@@ -11,17 +12,26 @@ import {
 
 import { GREY, TEXT } from '../lib/consts/DEFAULT_THEME';
 
-import OutlinedInputWithLabel from './OutlinedInputWithLabel';
+import OutlinedInputWithLabel, {
+  OutlinedInputWithLabelProps,
+} from './OutlinedInputWithLabel';
+
+type AutocompleteOptionalProps = {
+  extendRenderInput?: (
+    inputWithLabelProps: OutlinedInputWithLabelProps,
+    renderInputParams?: MUIAutocompleteRenderInputParams,
+  ) => void;
+};
 
 type AutocompleteProps<
   T,
   Multiple extends boolean | undefined,
   DisableClearable extends boolean | undefined,
   FreeSolo extends boolean | undefined,
-> = { label: string } & Omit<
+> = AutocompleteOptionalProps & { label: string } & Omit<
     MUIAutocompleteProps<T, Multiple, DisableClearable, FreeSolo>,
     'renderInput'
-> &
+  > &
   Partial<
     Pick<
       MUIAutocompleteProps<T, Multiple, DisableClearable, FreeSolo>,
@@ -44,7 +54,8 @@ const Autocomplete = <
 >(
   autocompleteProps: AutocompleteProps<T, Multiple, DisableClearable, FreeSolo>,
 ): JSX.Element => {
-  const { componentsProps, label, renderInput, sx } = autocompleteProps;
+  const { componentsProps, extendRenderInput, label, renderInput, sx } =
+    autocompleteProps;
   const combinedComponentsProps: AutocompleteProps<
     T,
     Multiple,
@@ -61,9 +72,10 @@ const Autocomplete = <
   };
   const combinedRenderInput =
     renderInput ??
-    (({ fullWidth, InputProps, InputLabelProps, inputProps }) => (
-      <OutlinedInputWithLabel
-        {...{
+    ((renderInputParams) => {
+      const { fullWidth, InputProps, InputLabelProps, inputProps } =
+        renderInputParams;
+      const inputWithLabelProps: OutlinedInputWithLabelProps = {
         formControlProps: {
           fullWidth,
           ref: InputProps.ref,
@@ -76,9 +88,13 @@ const Autocomplete = <
           startAdornment: InputProps.startAdornment,
         },
         label,
-        }}
-      />
-    ));
+      };
+
+      extendRenderInput?.call(null, inputWithLabelProps, renderInputParams);
+
+      // eslint-disable-next-line react/jsx-props-no-spreading
+      return <OutlinedInputWithLabel {...inputWithLabelProps} />;
+    });
   const combinedSx = {
     [`& .${muiOutlinedInputClasses.root} .${muiAutocompleteClasses.endAdornment}`]:
       {