Update monaco-editor version and remove manual type additions (#22443)

.prettierignore

@@ -26,7 +26,6 @@ __snapshots__
 # package specific files
 apps/vr-tests/dndSim.js
 packages/monaco-editor/esm
-packages/monaco-editor/monaco-typescript.d.ts
 packages/font-icons-mdl2/**/fabric-icons-*
 packages/fluentui/**/componentInfo
 packages/fluentui/docs/src/behaviorMenu.json

change/@fluentui-monaco-editor-ae5869c5-fc73-4710-9c00-83fd7ed914e3.json

@@ -0,0 +1,7 @@
+{
+  "type": "minor",
+  "comment": "Update monaco-editor to 0.33.0",
+  "packageName": "@fluentui/monaco-editor",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

change/@fluentui-react-monaco-editor-02fa02c0-2ae2-4e84-892a-9314e95e8961.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Update internal type usage to reflect new monaco-editor version",
+  "packageName": "@fluentui/react-monaco-editor",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

packages/monaco-editor/.eslintrc.json

@@ -1,4 +1,5 @@
 {
   "extends": ["plugin:@fluentui/eslint-plugin/react--legacy"],
-  "root": true
+  "root": true,
+  "ignorePatterns": ["esm/**"]
 }

packages/monaco-editor/README.md

@@ -1,11 +1,10 @@
 # @fluentui/monaco-editor
 
-Version of [`monaco-editor`](https://www.npmjs.com/package/monaco-editor) with the CSS files transformed to JS which can be loaded onto the page using `@microsoft/load-themed-styles`, plus some Webpack configuration helpers.
+Version of [`monaco-editor`](https://www.npmjs.com/package/monaco-editor) with the CSS files transformed to JS which can be loaded onto the page using `@microsoft/load-themed-styles`. Also includes some Webpack configuration helpers.
 
 ## Package contents
 
 - `esm/*`: Copy of `monaco-editor/esm/*` but with the CSS files transformed. (This package doesn't include the AMD variant since it has a built-in CSS loader.)
-- `monaco-typescript.d.ts`: Proper typings for various things used/returned by `monaco.typescript`, including `TypeScriptWorker` (generated by merging `monaco-typescript/release/esm/*.d.ts`)
 - `scripts/addMonacoWebpackConfig.js`: Add Monaco-related webpack configuration
 - `lib/configureEnvironment.js`: Set up `MonacoEnvironment` runtime config
 
@@ -73,11 +72,3 @@ import * as monaco from '@fluentui/monaco-editor';
 ```
 
 See the [Monaco documentation](https://microsoft.github.io/monaco-editor) for further usage instructions.
-
-If you need types from `monaco-typescript`, import as follows:
-
-```js
-import { TypeScriptWorker } from '@fluentui/monaco-editor/monaco-typescript.d';
-```
-
-Note that you may run into conflicts with these types if you're on a different TypeScript version than the one the typings were generated against.

packages/monaco-editor/just.config.ts

@@ -4,29 +4,27 @@ import { postprocessTask, defaultLibPaths } from '@fluentui/scripts/tasks/postpr
 import { eslint } from '@fluentui/scripts/tasks/eslint';
 import * as path from 'path';
 import { transformCssTask } from './tasks/transformCssTask';
-import { transformDtsTask } from './tasks/transformDtsTask';
 
 const monacoEditorPath = path.dirname(require.resolve('monaco-editor/package.json'));
 const monacoSrcPath = path.join(monacoEditorPath, 'esm');
 const monacoDestPath = path.join(__dirname, 'esm');
 
 preset.basic();
 
-task('clean', cleanTask({ paths: ['esm', 'lib', 'lib-commonjs'] }));
+task('clean', cleanTask({ paths: ['esm', 'lib', 'lib-commonjs'].map(p => path.join(process.cwd(), p)) }));
 task(
   'copy',
   copyInstructionsTask({
     copyInstructions: copyInstructions.copyFilesInDirectory(monacoSrcPath, monacoDestPath),
   }),
 );
 task('transform-css', transformCssTask);
-task('transform-dts', transformDtsTask);
 task('ts:esm', ts.esm);
 task('ts:commonjs', ts.commonjs);
 task('ts:postprocess', postprocessTask([...defaultLibPaths, 'esm/**/*.d.ts']));
 task('ts', series(parallel('ts:esm', 'ts:commonjs'), 'ts:postprocess'));
 task('eslint', eslint);
 
-task('build', series('clean', 'copy', 'transform-css', 'transform-dts', 'ts')).cached();
+task('build', series('clean', 'copy', 'transform-css', 'ts')).cached();
 
 task('lint', 'eslint');

packages/monaco-editor/package.json

@@ -18,8 +18,7 @@
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",
     "@fluentui/scripts": "^1.0.0",
-    "monaco-editor": "0.19.0",
-    "monaco-typescript": "3.6.1"
+    "monaco-editor": "0.33.0"
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.10.26",

packages/react-monaco-editor/src/components/TsxEditor.tsx

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import * as monaco from '@fluentui/monaco-editor';
-import { LanguageServiceDefaultsImpl as TypescriptDefaults } from '@fluentui/monaco-editor/monaco-typescript.d';
 import { getWindow } from '@fluentui/react/lib/Utilities';
 import { transpileAndEval } from '../transpiler/transpile';
 import { Editor } from './Editor';
@@ -11,7 +10,7 @@ import type { IMonacoTextModel, ICompilerOptions, IPackageGroup } from '../inter
 import type { IEditorProps } from './Editor.types';
 
 const typescript = monaco.languages.typescript;
-const typescriptDefaults = typescript.typescriptDefaults as TypescriptDefaults;
+const typescriptDefaults = typescript.typescriptDefaults;
 
 const filePrefix = 'file:///';
 const filename = filePrefix + 'main.tsx';

packages/react-monaco-editor/src/transpiler/transpile.ts

@@ -1,10 +1,8 @@
 import * as React from 'react';
 import * as monaco from '@fluentui/monaco-editor';
-import { TypeScriptWorker } from '@fluentui/monaco-editor/monaco-typescript.d';
 import { getWindow } from '@fluentui/react/lib/Utilities';
 import { transformExample } from './exampleTransform';
 import { _getErrorMessages } from './transpileHelpers';
-import type { EmitOutput } from '@fluentui/monaco-editor/monaco-typescript.d';
 import type { IMonacoTextModel, IBasicPackageGroup, ITransformedCode, ITransformedExample } from '../interfaces/index';
 
 const win = getWindow() as
@@ -23,9 +21,9 @@ export function transpile(model: IMonacoTextModel): Promise<ITransformedCode> {
   const filename = model.uri.toString();
   return monaco.languages.typescript
     .getTypeScriptWorker()
-    .then((getWorker: (uri: monaco.Uri) => Promise<TypeScriptWorker>) => getWorker(model.uri))
+    .then(getWorker => getWorker(model.uri))
     .then(worker => {
-      return worker.getEmitOutput(filename).then((output: EmitOutput) => {
+      return worker.getEmitOutput(filename).then(output => {
         // Get diagnostics to find out if there were any syntax errors (there's also getSemanticDiagnostics
         // for type errors etc, but it may be better to allow the user to just find and fix those
         // via intellisense rather than blocking compilation, since they may be non-fatal)

yarn.lock

@@ -18932,15 +18932,10 @@ moment-timezone@^0.5.31:
   resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.2.tgz#00910c60b20843bcba52d37d58c628b47b1f20e4"
   integrity sha512-UgzG4rvxYpN15jgCmVJwac49h9ly9NurikMWGPdVxm8GZD6XjkKPxDTjQQ43gtGgnV3X0cAyWDdP2Wexoquifg==
 
-[email protected]:
-  version "0.19.0"
-  resolved "https://registry.yarnpkg.com/monaco-editor/-/monaco-editor-0.19.0.tgz#c6e774210f3b292ff739e96f45a1cc78bf5ac2e7"
-  integrity sha512-ida++HI/s9V8ma8yYS9CAS0UJEFwW1gbt9G6oviEdv/aHhFd/kV3sXrINqC63TVdKzOZdKjPRRCOPJJ80zvLbw==
-
-[email protected]:
-  version "3.6.1"
-  resolved "https://registry.yarnpkg.com/monaco-typescript/-/monaco-typescript-3.6.1.tgz#69a545a45e2a6d036a50d78508792b856f9968d7"
-  integrity sha512-VXzS/s/YoQlolf7zRsM7PGVhY+HUTTHcLzFCx1QxuyOpoY1uFlUaMeTIV/AMYzMjSqHIiJ58kNiWjoP1YNsaAQ==
+[email protected]:
+  version "0.33.0"
+  resolved "https://registry.yarnpkg.com/monaco-editor/-/monaco-editor-0.33.0.tgz#842e244f3750a2482f8a29c676b5684e75ff34af"
+  integrity sha512-VcRWPSLIUEgQJQIE0pVT8FcGBIgFoxz7jtqctE+IiCxWugD0DwgyQBcZBhdSrdMC84eumoqMZsGl2GTreOzwqw==
 
 moo@^0.4.3:
   version "0.4.3"