MUI 6 TextField sx does not exit in slotProps.input

[andreievg]

Steps to reproduce

Steps:

1. Run yarn && yarn tsc -b with this commit: andreievg/mui-6-typescript@c280b19 (no typescript errors)
2. Run yarn && yarn tsc -b with this commit: andreievg/mui-6-typescript@1372caf (see typescript error)

Current behavior

After upgrading to MUI 6 from MUI 5 typescript is confused about sx missing on slotProps.input, previously it was in InputProps, and typescript didn't complaint

before, in MUI 5 (https://github.com/andreievg/mui-6-typescript/blob/c280b19a3ceac5451b4d93a496b6e219f9c9e1d7/src/App.tsx#L4-L12)

const Wrapper: typeof TextField = ({ InputProps, ...props }) => (
  <TextField
    InputProps={{
      ...InputProps,
      sx: { borderRadius: '10px', ...InputProps?.sx },
    }}
    {...props}
  />
);

after, in MUI 6 (https://github.com/andreievg/mui-6-typescript/blob/1372caf7ac510e95046289c1df75a9fe62ed1b5c/src/App.tsx#L4-L14)

const Wrapper: typeof TextField = ({ slotProps, ...props }) => (
  <TextField
    slotProps={{
      input: {
        ...slotProps?.input,
        sx: { borderRadius: '10px', ...slotProps?.input?.sx },
      },
    }}
    {...props}
  />
);

getting this error

src/App.tsx:9:58 - error TS2339: Property 'sx' does not exist on type 'SlotProps<ElementType<FilledInputProps, keyof IntrinsicElements>, {}, BaseTextFieldProps> | SlotProps<...> | SlotProps<...>'.
  Property 'sx' does not exist on type '(ownerState: BaseTextFieldProps) => Partial<FilledInputProps | (Omit<FilledInputProps, "ref"> & RefAttributes<Component<FilledInputProps, any, any>>)> & SlotCommonProps'.

9         sx: { borderRadius: '10px', ...slotProps?.input?.sx },

Expected behavior

upgrade form MUI 5 to MUI 6 doesn't break type safety (when upgrading deprecated api)

Context

upgrade form MUI 5 to MUI 6

Your environment

npx @mui/envinfo

All details provided in repository created for replication

Search keywords: sx slotProps.input MUI6

[DiegoAndai]

Hey @andreievg! Thanks for reaching out.

To merge slotProps with custom values, please use mergeSlotProps, described in this section of the docs: https://mui.com/material-ui/guides/composition/#forwarding-slot-props.

Let me know if that works! 😊