fix(striker-ui): allow OutlinedInput style override

striker-ui/components/OutlinedInput/OutlinedInput.tsx

@@ -1,12 +1,16 @@
 import {
   OutlinedInput as MUIOutlinedInput,
   outlinedInputClasses as muiOutlinedInputClasses,
-  styled,
+  OutlinedInputProps as MUIOutlinedInputProps,
 } from '@mui/material';
 
 import { GREY, TEXT, UNSELECTED } from '../../lib/consts/DEFAULT_THEME';
 
-const OutlinedInput = styled(MUIOutlinedInput)({
+const OutlinedInput = (
+  outlinedInputProps: MUIOutlinedInputProps,
+): JSX.Element => {
+  const { label, sx } = outlinedInputProps;
+  const combinedSx = {
     color: GREY,
 
     [`& .${muiOutlinedInputClasses.notchedOutline}`]: {
@@ -26,10 +30,23 @@ const OutlinedInput = styled(MUIOutlinedInput)({
         borderColor: GREY,
 
         '& legend': {
-        paddingRight: '1.2em',
+          paddingRight: label ? '1.2em' : 0,
         },
       },
     },
-});
+
+    ...sx,
+  };
+
+  return (
+    <MUIOutlinedInput
+      // eslint-disable-next-line react/jsx-props-no-spreading
+      {...{
+        ...outlinedInputProps,
+        sx: combinedSx,
+      }}
+    />
+  );
+};
 
 export default OutlinedInput;