When I put custom breakpoints in Grid Components in typescript, it gives me error?

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

I create some custom breakpoint in material UI. Here I am using material UI latest version. I create my theme by this way-

Sample-

import { createTheme } from '@mui/material/styles';

declare module '@mui/material/styles' {
    interface BreakpointOverrides {
        xs: true;
        sm: true;
        msm: true;
        lsm: true;
        smd: true;
        md: true;
        lg: true;
        xxl: true;
    }
}
const theme = createTheme({
    breakpoints: {
        values: {
            xs: 0, // Extra Small Devices ---- Defualt BreakPoints
            sm: 480, // Small Devices ---- Default BreakPoints
            msm: 576, // Medium Small Medium Devices
            lsm: 640, // Large Small Medium Devices
            smd: 768, // Small Medium Devices
            md: 992, // Medium Devices ---- Default BreakPoints
            lg: 1200, // Large Devices  ---- Default BreakPoints
            xxl: 1536, // Large Devices
        },
    }
});
export default theme;

Then I am trying to add custom breakpoint in MUI Grid Components-

const Home: NextPage = () => {
  return (
    <Box>
      <Seo />
      <Siam />
      <Grid container spacing={0}>
        <Grid item smd={6}><Movies /></Grid> // In this line I am getting error for adding smd
        <Grid item smd={6}><Books /></Grid> // In this line I am getting error for adding smd
      </Grid>
    </Box>
  );
};
export default Home;

Error is-

Property 'smd' does not exist on type 'IntrinsicAttributes & SystemProps<Theme> & { children?: ReactNode; classes?: Partial<GridClasses> | undefined; ... 14 more ...; zeroMinWidth?: boolean | undefined; } & CommonProps & Omit<...>'

Here is image-

[thomas-kahn]

@oliviertassinari, I get the solutions. Then why did you reopen the issue?

@siamahnaf198 : I don’t understand? What is the solution to this problem?

[siamahnaf198]

@oliviertassinari, I get the solutions. Then why did you reopen the issue?

@siamahnaf198 : I don’t understand? What is the solution to this problem?

Try

<Grid item {...{smd: 6}></Grid>