Update dependency monaco-editor to ^0.52.2

.buildkite/scripts/steps/security/third_party_packages.txt

@@ -16,3 +16,4 @@ liquidjs
 @tanstack/react-table
 @tanstack/react-virtual
 @storybook/addon-docs
+@babel/plugin-transform-class-static-block

package.json

@@ -1329,7 +1329,7 @@
     "moment": "^2.30.1",
     "moment-duration-format": "^2.3.2",
     "moment-timezone": "^0.6.0",
-    "monaco-editor": "^0.44.0",
+    "monaco-editor": "^0.52.2",
     "monaco-yaml": "^5.1.0",
     "murmurhash": "^2.0.1",
     "mustache": "^4.2.0",
@@ -1463,6 +1463,7 @@
     "@babel/plugin-proposal-optional-chaining": "^7.21.0",
     "@babel/plugin-proposal-private-methods": "^7.18.6",
     "@babel/plugin-transform-class-properties": "^7.24.7",
+    "@babel/plugin-transform-class-static-block": "^7.27.1",
     "@babel/plugin-transform-numeric-separator": "^7.24.7",
     "@babel/plugin-transform-optional-chaining": "^7.24.8",
     "@babel/plugin-transform-runtime": "^7.24.7",

packages/kbn-babel-preset/common_preset.js

@@ -16,6 +16,15 @@ module.exports = (api) => ({
       plugins: [
         require.resolve('@kbn/lazy-object/src/plugin/lazy_babel_plugin'),
         require.resolve('babel-plugin-add-module-exports'),
+
+        /**
+         * The static class features proposal https://github.com/tc39/proposal-static-class-features
+         * has been merged with the class fields proposal and is now stage 4.
+         * We include this here because Monaco needs this and
+         * this transform has to run before the transform class properties transform.
+         */
+        require.resolve('@babel/plugin-transform-class-static-block'),
+
         // The class properties proposal was merged with the private fields proposal
         // into the "class fields" proposal. Babel doesn't support this combined
         // proposal yet, which includes private field, so this transform is

src/platform/packages/private/kbn-esql-editor/src/esql_editor.test.tsx

@@ -14,7 +14,6 @@ import { dataPluginMock } from '@kbn/data-plugin/public/mocks';
 import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public';
 import { renderWithI18n } from '@kbn/test-jest-helpers';
 import { waitFor } from '@testing-library/dom';
-import { act } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import React from 'react';
 import { BehaviorSubject } from 'rxjs';
@@ -184,6 +183,7 @@ describe('ESQLEditor', () => {
   });
 
   it('should render correctly if editorIsInline prop is set to true', async () => {
+    const user = userEvent.setup();
     const onTextLangQuerySubmit = jest.fn();
     const newProps = {
       ...props,
@@ -198,7 +198,7 @@ describe('ESQLEditor', () => {
     expect(runQueryButton).toBeInTheDocument(); // Assert it exists
 
     if (runQueryButton) {
-      await userEvent.click(runQueryButton);
+      await user.click(runQueryButton);
       expect(onTextLangQuerySubmit).toHaveBeenCalledTimes(1);
     }
   });
@@ -215,6 +215,8 @@ describe('ESQLEditor', () => {
 
   describe('data errors switch', () => {
     test('shown with errors enabled', async () => {
+      const user = userEvent.setup();
+
       const newProps = {
         ...props,
         dataErrorsControl: { enabled: true, onChange: jest.fn() },
@@ -230,15 +232,17 @@ describe('ESQLEditor', () => {
       await waitFor(() => {
         expect(queryByTestId('ESQLEditor-footerPopoverButton-error')).toBeInTheDocument();
       });
-      act(() => {
-        queryByTestId('ESQLEditor-footerPopoverButton-error')?.click();
-      });
+
+      await user.click(queryByTestId('ESQLEditor-footerPopoverButton-error')!);
+
       expect(queryByTestId('ESQLEditor-footerPopover-dataErrorsSwitch')).toBeInTheDocument();
 
       expect(queryAllByText('Data error example')).toHaveLength(2);
     });
 
     test('shown with errors disabled', async () => {
+      const user = userEvent.setup();
+
       const newProps = {
         ...props,
         dataErrorsControl: { enabled: false, onChange: jest.fn() },
@@ -254,15 +258,17 @@ describe('ESQLEditor', () => {
       await waitFor(() => {
         expect(queryByTestId('ESQLEditor-footerPopoverButton-error')).toBeInTheDocument();
       });
-      act(() => {
-        queryByTestId('ESQLEditor-footerPopoverButton-error')?.click();
-      });
+
+      await user.click(queryByTestId('ESQLEditor-footerPopoverButton-error')!);
+
       expect(queryByTestId('ESQLEditor-footerPopover-dataErrorsSwitch')).toBeInTheDocument();
 
       expect(queryAllByText('Data error example')).toHaveLength(0);
     });
 
     test('not shown when prop not set', async () => {
+      const user = userEvent.setup();
+
       mockValidate.mockResolvedValue({
         errors: [{ message: 'Data error example', severity: 'error' }],
         warnings: [],
@@ -271,9 +277,9 @@ describe('ESQLEditor', () => {
       await waitFor(() => {
         expect(queryByTestId('ESQLEditor-footerPopoverButton-error')).toBeInTheDocument();
       });
-      act(() => {
-        queryByTestId('ESQLEditor-footerPopoverButton-error')?.click();
-      });
+
+      await user.click(queryByTestId('ESQLEditor-footerPopoverButton-error')!);
+
       expect(queryByTestId('ESQLEditor-footerPopover-dataErrorsSwitch')).not.toBeInTheDocument();
     });
   });

src/platform/packages/private/kbn-esql-editor/src/esql_editor.tsx

@@ -844,8 +844,8 @@ const ESQLEditorInternal = function ESQLEditor({
 
   onLayoutChangeRef.current = onLayoutChange;
 
-  const codeEditorOptions: CodeEditorProps['options'] = useMemo(
-    () => ({
+  const codeEditorOptions = useMemo(
+    (): NonNullable<CodeEditorProps['options']> => ({
       hover: {
         above: false,
       },
@@ -859,7 +859,7 @@ const ESQLEditorInternal = function ESQLEditor({
       // this becomes confusing with multiple markers, so quick fixes
       // will be proposed only within the tooltip
       lightbulb: {
-        enabled: false,
+        enabled: monaco.editor.ShowLightbulbIconMode.Off,
       },
       lineDecorationsWidth: 20,
       lineNumbers: 'on',

src/platform/packages/shared/kbn-monaco/src/monaco_imports.ts

@@ -14,13 +14,13 @@ import 'monaco-editor/esm/vs/base/common/worker/simpleWorker';
 import 'monaco-editor/esm/vs/base/browser/defaultWorkerFactory';
 
 import 'monaco-editor/esm/vs/editor/browser/coreCommands.js';
-import 'monaco-editor/esm/vs/editor/browser/widget/codeEditorWidget.js';
+import 'monaco-editor/esm/vs/editor/browser/widget/codeEditor/codeEditorWidget.js';
 
 import 'monaco-editor/esm/vs/editor/contrib/wordOperations/browser/wordOperations.js'; // Needed for word-wise char navigation
 import 'monaco-editor/esm/vs/editor/contrib/linesOperations/browser/linesOperations.js'; // Needed for enabling shortcuts of removing/joining/moving lines
 import 'monaco-editor/esm/vs/editor/contrib/folding/browser/folding.js'; // Needed for folding
 import 'monaco-editor/esm/vs/editor/contrib/suggest/browser/suggestController.js'; // Needed for suggestions
-import 'monaco-editor/esm/vs/editor/contrib/hover/browser/hover.js'; // Needed for hover
+import 'monaco-editor/esm/vs/editor/contrib/hover/browser/hoverContribution.js'; // Needed for hover
 import 'monaco-editor/esm/vs/editor/contrib/parameterHints/browser/parameterHints.js'; // Needed for signature
 import 'monaco-editor/esm/vs/editor/contrib/bracketMatching/browser/bracketMatching.js'; // Needed for brackets matching highlight
 import 'monaco-editor/esm/vs/editor/contrib/links/browser/links.js'; // Needed for clickable links with Cmd/Ctrl+Click
@@ -64,14 +64,19 @@ const languageThemeResolverDefinitions = new Map<
 >();
 
 declare module 'monaco-editor/esm/vs/editor/editor.api' {
-  // eslint-disable-next-line @typescript-eslint/no-namespace
+  // eslint-disable-next-line @typescript-eslint/no-namespace -- augmenting monaco editor types
   export namespace editor {
-    // augment monaco editor types
+    /**
+     * @description Registers language theme definition for a language
+     */
     function registerLanguageThemeResolver(
       langId: string,
       languageThemeResolver: CustomLangModuleType['languageThemeResolver'],
       forceOverride?: boolean
     ): void;
+    /**
+     * @description Returns the registered language theme definition for the provided id
+     */
     function getLanguageThemeResolver(
       langId: string
     ): CustomLangModuleType['languageThemeResolver'];
@@ -81,7 +86,7 @@ declare module 'monaco-editor/esm/vs/editor/editor.api' {
 // add custom methods to monaco editor
 Object.defineProperties(monaco.editor, {
   /**
-   * @description Registers language theme definition for a language
+   * @description Registration for implementation of {@link monaco.editor.registerLanguageThemeResolver}
    */
   registerLanguageThemeResolver: {
     value: ((langId, languageThemeDefinition, forceOverride) => {
@@ -94,7 +99,7 @@ Object.defineProperties(monaco.editor, {
     configurable: false,
   },
   /**
-   * @description Returns language theme definition for a language
+   * @description Registration for implementation of {@link monaco.editor.getLanguageThemeResolver}
    */
   getLanguageThemeResolver: {
     value: ((langId) =>

src/platform/packages/shared/kbn-monaco/webpack.config.js

@@ -90,18 +90,6 @@ const workerConfig = (languages) => ({
       },
     ],
   },
-  optimization: {
-    minimizer: [
-      (compiler) => {
-        const TerserPlugin = require('terser-webpack-plugin');
-        new TerserPlugin({
-          // exclude this file from being processed by terser,
-          // because attempts at tree shaking actually botches up the file
-          exclude: /monaco-editor[\\/]esm[\\/]vs[\\/]base[\\/]common[\\/]map.js/,
-        }).apply(compiler);
-      },
-    ],
-  },
 });
 
 module.exports = workerConfig(['default', 'json', 'xjson', 'painless', 'yaml', 'console']);

src/platform/packages/shared/kbn-test/src/jest/setup/polyfills.jsdom.js

@@ -83,3 +83,56 @@ if (!Object.hasOwn(global, 'Worker')) {
 if (!Object.hasOwn(global, 'MessagePort')) {
   global.MessagePort = {};
 }
+
+if (!Object.hasOwn(global, 'ClipboardItem')) {
+  /**
+   * @typedef {Record<string, Blob | string | Promise<Blob | string>>} ItemData
+   */
+
+  /**
+   * @implements {ClipboardItem}
+   */
+  class ClipboardItemMockImpl {
+    /**
+     * @type {ItemData}
+     */
+    #data;
+
+    /**
+     * @param {ItemData} d
+     */
+    constructor(d) {
+      this.data = d;
+    }
+
+    get types() {
+      return Array.from(Object.keys(this.data));
+    }
+
+    /**
+     * @param {string} type
+     * @returns {Promise<Blob | string>}
+     */
+    async getType(type) {
+      const value = await this.data[type];
+
+      if (!value) {
+        throw new Error(`${type} is not one of the available MIME types on this item.`);
+      }
+
+      return value instanceof window.Blob ? value : new window.Blob([value], { type });
+    }
+  }
+
+  Object.defineProperty(global, 'ClipboardItem', {
+    value: ClipboardItemMockImpl,
+  });
+}
+
+if (!Object.hasOwn(global.navigator, 'clipboard')) {
+  const {
+    attachClipboardStubToView,
+  } = require('@testing-library/user-event/dist/cjs/utils/dataTransfer/Clipboard.js');
+
+  attachClipboardStubToView(global);
+}

src/platform/packages/shared/shared-ux/code_editor/impl/code_editor.tsx

@@ -644,7 +644,7 @@ export const CodeEditor: React.FC<CodeEditorProps> = ({
                   // outer scrollbars.
                   alwaysConsumeMouseWheel: false,
                 },
-                wordBasedSuggestions: false,
+                wordBasedSuggestions: 'off',
                 wordWrap: 'on',
                 wrappingIndent: 'indent',
                 matchBrackets: 'never',

src/platform/plugins/shared/workflows_management/public/features/run_workflow/ui/workflow_execute_manual_form.tsx

@@ -210,7 +210,7 @@ export const WorkflowExecuteManualForm = ({
               formatOnType: true,
               quickSuggestions: false,
               suggestOnTriggerCharacters: false,
-              wordBasedSuggestions: false,
+              wordBasedSuggestions: 'off',
               parameterHints: {
                 enabled: false,
               },

src/platform/plugins/shared/workflows_management/public/widgets/workflow_yaml_editor/ui/workflow_yaml_editor.tsx

@@ -113,7 +113,7 @@ const editorOptions: monaco.editor.IStandaloneEditorConstructionOptions = {
     filterGraceful: true, // Better filtering
     localityBonus: true, // Prioritize matches near cursor
   },
-  wordBasedSuggestions: false,
+  wordBasedSuggestions: 'off',
   hover: {
     enabled: true,
     delay: 300,

src/platform/test/functional/apps/console/_misc_console_behavior.ts

@@ -23,7 +23,6 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
 
   describe('misc console behavior', function testMiscConsoleBehavior() {
     before(async () => {
-      await browser.setWindowSize(1200, 800);
       await PageObjects.common.navigateToApp('console');
       // Ensure that the text area can be interacted with
       await PageObjects.console.skipTourIfExists();

x-pack/platform/plugins/shared/lens/public/datasources/form_based/operations/definitions/formula/editor/formula_editor.tsx

@@ -652,7 +652,7 @@ export function FormulaEditor({
       minimap: { enabled: false },
       wordWrap: isWordWrapped ? 'on' : 'off',
       // Disable suggestions that appear when we don't provide a default suggestion
-      wordBasedSuggestions: false,
+      wordBasedSuggestions: 'off',
       autoIndent: 'brackets',
       wrappingIndent: 'none',
       dimension: { width: 320, height: 200 },

x-pack/platform/plugins/shared/streams_app/public/components/data_management/stream_detail_enrichment/doc_viewer_diff.tsx

@@ -101,7 +101,7 @@ function JsonDiffViewer({ hit, decreaseAvailableHeightBy }: DocViewRenderProps)
     }
     editorRef.current.setModel({ original: oldModel, modified: newModel });
     const commonOptions: monaco.editor.IEditorOptions = {
-      lightbulb: { enabled: false },
+      lightbulb: { enabled: monaco.editor.ShowLightbulbIconMode.Off },
       fontSize: 12,
       lineNumbers: 'off',
       minimap: { enabled: false },