@mui/material: incorrect responsiveFontSizes return type when using CssVarsTheme as input

[ijxy]

Steps to reproduce

No response

Current behavior

Expected behavior

responsiveFontSizes should return the same type of theme that it was given

Context

Switching to the CSS vars theme provider (primarily for dark mode), but still wanting to use the responsive fonts helper.

For now I am simply casting the return type back to CssVarsTheme, but the below change to packages/mui-material/src/styles/responsiveFontSizes.d.ts fixes the issue:

import { Breakpoint } from '@mui/system';
import { Typography } from './createTypography';

export interface ResponsiveFontSizesOptions {
  breakpoints?: Breakpoint[];
  disableAlign?: boolean;
  factor?: number;
  variants?: Array<keyof Typography>;
}

export default function responsiveFontSizes<T extends { typography: Typography }>(
  theme: T,
  options?: ResponsiveFontSizesOptions,
): T;

Your environment

npx @mui/envinfo

  System:
    OS: macOS 11.6.5
  Binaries:
    Node: 20.10.0 - ~/.nvm/versions/node/v20.10.0/bin/node
    npm: 10.2.3 - ~/.nvm/versions/node/v20.10.0/bin/npm
    pnpm: 8.15.4 - ~/.nvm/versions/node/v20.10.0/bin/pnpm
  Browsers:
    Chrome: 126.0.6478.116
    Edge: Not Found
    Safari: 14.1.2
  npmPackages:
    @emotion/react: ^11.11.4 => 11.11.4 
    @emotion/styled: ^11.11.5 => 11.11.5 
    @mui/base:  5.0.0-beta.40 
    @mui/core-downloads-tracker:  5.15.20 
    @mui/icons-material: ^5.15.20 => 5.15.20 
    @mui/material: ^5.15.20 => 5.15.20 
    @mui/material-nextjs: ^5.15.11 => 5.15.11 
    @mui/private-theming:  5.15.20 
    @mui/styled-engine:  5.15.14 
    @mui/system:  5.15.20 
    @mui/types:  7.2.14 
    @mui/utils:  5.15.20 
    @types/react: ^18 => 18.3.3 
    react: ^18 => 18.3.1 
    react-dom: ^18 => 18.3.1 
    typescript: ^5 => 5.5.2 

Search keywords: theme, css, responsive

[siriwatknp]

@jxdp That looks good to me, do you want to submit a PR?

[ijxy]

@jxdp That looks good to me, do you want to submit a PR?

Sure thing: #42786