PigmentCSS `createTheme`. Invalid typings in `styleOverrides`

[o-alexandrov]

Steps to reproduce

Link to live example

Steps:

1. Clone
2. Refer to vite.config.ts

Current behavior

components[string].styleOverrides has invalid typings.
No typings errors are presented to the user.

Expected behavior

There should be an error for styleOverrides.extended usage in vite.config.ts file from the repro.

Context

• [bug] invalid typings for createTheme pigment-css#170 (comment)

Your environment

npx @mui/envinfo

  System:
    OS: macOS 15.0.1
  Binaries:
    Node: 22.9.0 - /opt/homebrew/bin/node
    npm: 10.8.3 - /opt/homebrew/bin/npm
    pnpm: 9.9.0 - /opt/homebrew/bin/pnpm
  Browsers:
    Chrome: 129.0.6668.91
    Edge: 112.0.1722.39
    Safari: 18.0.1
  npmPackages:
    @emotion/react:  11.13.3 
    @emotion/styled:  11.13.0 
    @mui/core-downloads-tracker:  6.1.3 
    @mui/material: latest => 6.1.3 
    @mui/material-pigment-css: latest => 6.1.3 
    @mui/private-theming:  6.1.3 
    @mui/styled-engine:  6.1.3 
    @mui/system:  6.1.3 
    @mui/types:  7.2.18 
    @mui/utils:  6.1.3 
    @pigment-css/react:  0.0.24 
    @pigment-css/vite-plugin: latest => 0.0.24 
    @types/react: latest => 18.3.11 
    react: latest => 18.3.1 
    react-dom: latest => 18.3.1 
    typescript: latest => 5.6.3 

Search keywords: pigment, styleOverrides, typings, invalid, createTheme

[sai6855]

@o-alexandrov I don't think typing is invalid, as whatever styles applied in extended in styleOverides get's applied to Fab here:

material-ui/packages/mui-material/src/Fab/Fab.js

Line 45 in 9b9f562

styles[ownerState.variant],

In below sandbox, i passed bgcolor as red in extended and same got applied.

https://stackblitz.com/edit/react-or6bk2?file=Demo.tsx

[o-alexandrov]

@sai6855 you misunderstood the highlighted problem. In your repro, you are not using PigmentCSS. Please refer to breaking changes when migrating to PigmentCSS, the variants part of the migration guide.

You could also consider to review the linked issue. That’ll give more details

[brijeshb42]

I just cloned and tried to repro the typing error from your repo but all the typechecks passed. Could you post a screenshot or cli command or something else that shows the error ?
I might be missing something in the repro.

[o-alexandrov]

@brijeshb42 type check shouldn't be passing.
Please refer to the description of this issue:

There should be an error for styleOverrides.extended usage in vite.config.ts file from the repro.

[brijeshb42]

I ran typecheck through cli -

tsc -p tsconfig.node.json

and

tsc -p tsconfig.app.json

Both passed without any error. 2nd one logged unused React error but that seems unrelated.