[Bug] Monaco editor used inline styling that violates Content Security Policy for a web application

Reproducible in vscode.dev or in VS Code Desktop?

• Not reproducible in vscode.dev or VS Code Desktop

Reproducible in the monaco editor playground?

• Not reproducible in the monaco editor playground

Monaco Editor Playground Link

No response

Monaco Editor Playground Code

Reproduction Steps

Prerequisites:
Node.js LTS should be available

Unzip the attached monaco-editor-demo.zip, navigate to the 'monaco-editor-demo' folder using command prompt

cd monaco-editor-demo
npm install
npm install monaco-editor
npm run preview

Access browser link generated to see the violation in browser console(png image attached)

Browser snapshot

Sample code
monaco-editor-demo.zip

Actual (Problematic) Behavior

The CSP configuration is done in dist\index.html file, in line 5

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; script-src-elem 'self'; script-src-attr 'self'; font-src 'self'; connect-src 'self'; img-src 'self'; style-src 'self'; form-action '*'; frame-src 'self'; worker-src 'self'; frame-ancestors 'self' "/>

We are using Monaco editor in our enterprise application. To support EU-CRA, we are trying to turn on Content Security Policy(CSP) in our application. However, we are getting many inline styling CSP violations coming from monaco editor code. The sample application attached is demonstrating the issue in a standalone web application.

Expected Behavior

No response

Additional Context

No response

Start by running the attached monaco-editor-demo.zip with Node.js LTS using the commands in the issue, then inspect the browser console and dist\index.html line 5. Trace the reported inline-style violations to the Monaco integration; done should mean a maintainer-approved resolution for the stated CSP, though the issue does not define expected behavior or name a source file.