Support Monaco Editor 0.56 public exports

airflow-core/src/airflow/ui/package.json

@@ -52,7 +52,7 @@
     "i18next-http-backend": "^4.0.1",
     "katex": "^0.17.0",
     "mermaid": "^11.16.0",
-    "monaco-editor": "^0.55.1",
+    "monaco-editor": "^0.56.0",
     "next-themes": "^0.4.6",
     "react": "^19.2.8",
     "react-chartjs-2": "^5.3.1",

airflow-core/src/airflow/ui/src/components/MonacoEditor/configureMonaco.ts

@@ -27,18 +27,13 @@ type MonacoEnvironment = {
 let configurationPromise: Promise<void> | undefined;
 
 const loadMonacoModules = async () => {
-  // `editor.api` is API-only — the contribs/styles below must be side-effect imported
-  // to register their actions and render their glyphs. The CDN bundle pulled these in
-  // transitively; the local ESM build does not.
+  // The editor entry point is API-only; register the selected features and codicon styles
+  // explicitly to keep the local bundle small.
   const monacoApi = Promise.all([
-    import("monaco-editor/esm/vs/editor/editor.api.js"),
-    import("monaco-editor/esm/vs/editor/contrib/folding/browser/folding.js"),
-    import("monaco-editor/esm/vs/editor/contrib/find/browser/findController.js"),
-    // monaco-editor 0.53 removed the `codiconStyles` side-effect module; import the two codicon
-    // stylesheets it used to pull in directly so folding/find glyphs still render. Both files
-    // ship in 0.52 and 0.55, so this resolves against the current pin and any newer bump.
-    import("monaco-editor/esm/vs/base/browser/ui/codicons/codicon/codicon.css"),
-    import("monaco-editor/esm/vs/base/browser/ui/codicons/codicon/codicon-modifiers.css"),
+    import("monaco-editor/editor"),
+    import("monaco-editor/features/folding/register"),
+    import("monaco-editor/features/find/register"),
+    import("monaco-editor/features/codicon/register"),
   ]).then(([api]) => api);
 
   // Resolve the bundled worker URLs (`?worker&url` runs the worker through Vite's worker
@@ -52,17 +47,18 @@ const loadMonacoModules = async () => {
   // sidesteps the restriction (CORS still permits the inner import). In production the
   // worker is same-origin and the shim is harmless.
   const workerUrls = Promise.all([
-    import("monaco-editor/esm/vs/editor/editor.worker.js?worker&url").then((module) => module.default),
-    import("monaco-editor/esm/vs/language/json/json.worker.js?worker&url").then((module) => module.default),
+    import("monaco-editor/editor/editor.worker.js?worker&url").then((module) => module.default),
+    import("monaco-editor/languages/features/json/json.worker.js?worker&url").then(
+      (module) => module.default,
+    ),
   ]);
 
-  // The JSON contribution registers its language as a side effect. Python is registered
-  // manually below from its grammar module instead of importing `python.contribution`,
+  // The JSON feature registers its language as a side effect. Python is registered
+  // manually below from its grammar module instead of importing its register module,
   // whose lazy tokens provider would overwrite our patched grammar on first use.
-  // The grammar module is a private monaco internal (verified against monaco-editor
-  // 0.52.2); the runtime guard below fails loudly if its export shape changes.
-  const jsonContribution = import("monaco-editor/esm/vs/language/json/monaco.contribution.js");
-  const pythonGrammar = import("monaco-editor/esm/vs/basic-languages/python/python.js");
+  // The runtime guard below fails loudly if the grammar export shape changes.
+  const jsonContribution = import("monaco-editor/languages/features/json/register");
+  const pythonGrammar = import("monaco-editor/languages/definitions/python/python");
 
   const [monaco, [editorWorkerUrl, jsonWorkerUrl], { conf: pythonConf, language: pythonLanguage }] =
     await Promise.all([monacoApi, workerUrls, pythonGrammar, jsonContribution]);

airflow-core/src/airflow/ui/src/components/MonacoEditor/pythonFStrings.test.ts

@@ -127,8 +127,8 @@ describe("patchPythonFStrings (tokenized)", () => {
   let singleLineTokens: Array<{ offset: number; type: string }> = [];
 
   beforeAll(async () => {
-    const monaco = await import("monaco-editor/esm/vs/editor/editor.api.js");
-    const { conf, language } = await import("monaco-editor/esm/vs/basic-languages/python/python.js");
+    const monaco = await import("monaco-editor/editor");
+    const { conf, language } = await import("monaco-editor/languages/definitions/python/python");
 
     monaco.languages.register({ id: "python" });
     monaco.languages.setLanguageConfiguration("python", conf);

airflow-core/src/airflow/ui/src/vite-env.d.ts

@@ -25,14 +25,9 @@ interface ImportMeta {
   readonly env: ImportMetaEnv;
 }
 
-// monaco-editor ships .d.ts only for `editor.api`; contribution side-effect imports have
-// no typings of their own.
-declare module "monaco-editor/esm/vs/editor/contrib/folding/browser/folding";
-declare module "monaco-editor/esm/vs/base/browser/ui/codicons/codiconStyles";
-
-// The Python basic-language module exports its Monarch grammar (`conf` / `language`)
+// The Python language definition exports its Monarch grammar (`conf` / `language`)
 // but ships no `.d.ts` of its own.
-declare module "monaco-editor/esm/vs/basic-languages/python/python.js" {
+declare module "monaco-editor/languages/definitions/python/python" {
   // `import(...)` type syntax is required here: a top-level `import type` would turn this
   // ambient declaration file into a module and break the `ImportMeta` augmentation above.
   /* eslint-disable @typescript-eslint/consistent-type-imports */