Pigment CSS overwrites the original TSX source maps with the compiled JS files

[aleksei-berezkin]

Steps to reproduce

Example project: https://github.com/aleksei-berezkin/mui-pigment-example/

1. npm run dev
2. Open localhost:3000
3. Open the developers console
4. Locate app/page.tsx file

Current behavior

The compiled JS file is displayed

Expected behavior

The original page.tsx is displayed

Context

No response

Your environment

System:
  OS: macOS 14.0
Binaries:
  Node: 20.14.0 - /opt/homebrew/opt/node@20/bin/node
  npm: 10.7.0 - /opt/homebrew/opt/node@20/bin/npm
  pnpm: 9.11.0 - /opt/homebrew/opt/node@20/bin/pnpm
Browsers:
  Chrome: 130.0.6723.117
  Edge: Not Found
  Safari: 17.0
npmPackages:
  @emotion/react: ^11.13.3 => 11.13.3 
  @emotion/styled: ^11.13.0 => 11.13.0 
  @mui/core-downloads-tracker:  6.1.6 
  @mui/material: ^6.1.6 => 6.1.6 
  @mui/material-pigment-css: ^6.1.6 => 6.1.6 
  @mui/private-theming:  6.1.6 
  @mui/styled-engine:  6.1.6 
  @mui/system:  6.1.6 
  @mui/types:  7.2.19 
  @mui/utils:  6.1.6 
  @pigment-css/nextjs-plugin: ^0.0.26 => 0.0.26 
  @pigment-css/react:  0.0.25 
  @pigment-css/unplugin:  0.0.26 
  @types/react: ^18.3.1 => 18.3.12 
  react: ^18.3.1 => 18.3.1 
  react-dom: ^18.3.1 => 18.3.1 
  typescript: ^5.6.3 => 5.6.3 

Search keywords: Pigment, source maps