@xh/hoist 79.0.0-SNAPSHOT.1765846193322 → 79.0.0-SNAPSHOT.1765846827962

package/desktop/cmp/input/CodeInput.ts

@@ -11,9 +11,11 @@ import {
     foldGutter,
     foldKeymap,
     indentOnInput,
+    LanguageDescription,
     LanguageSupport,
     syntaxHighlighting
 } from '@codemirror/language';
+import {languages} from '@codemirror/language-data';
 import {linter, lintGutter} from '@codemirror/lint';
 import {highlightSelectionMatches, search} from '@codemirror/search';
 import {
@@ -50,7 +52,7 @@ import {action, bindable, makeObservable, observable} from '@xh/hoist/mobx';
 import {withDefault} from '@xh/hoist/utils/js';
 import {getLayoutProps} from '@xh/hoist/utils/react';
 import classNames from 'classnames';
-import {compact, isEmpty, isFunction, isObject} from 'lodash';
+import {compact, find, includes, isEmpty, isFunction, isObject} from 'lodash';
 import {ReactElement} from 'react';
 import './CodeInput.scss';
 import {javascript} from '@codemirror/lang-javascript';
@@ -477,9 +479,9 @@ class CodeInputModel extends HoistInputModel {
             extensions.push(highlightActiveLine(), highlightActiveLineGutter());
         if (autoFocus) extensions.push(this.autofocusExtension);
         if (language) {
-            const langExt = this.getLanguageExtension(language);
+            const langExt = this.getLanguageExtensionAsync(language);
             if (langExt) {
-                extensions.push(langExt);
+                extensions.push(await langExt);
             } else {
                 console.warn('Failed to load language:', language);
             }
@@ -501,15 +503,14 @@ class CodeInputModel extends HoistInputModel {
         sql: sql
     };
 
-    private getLanguageExtension(lang: string): LanguageSupport {
-        if (!lang) return null;
-        const extFactory = this.LANGUAGE_EXTENSIONS[lang.toLowerCase()];
-        if (!extFactory) {
-            console.warn(`Language not found: ${lang}`);
-            return null;
-        }
+    private async getLanguageExtensionAsync(lang: string): Promise<LanguageSupport> {
         try {
-            return extFactory(); // returns a LanguageSupport instance
+            const langDesc: LanguageDescription | undefined = find(
+                languages,
+                it => includes(it.alias, lang) || it.name.toLowerCase() === lang.toLowerCase()
+            );
+            if (!langDesc) return null;
+            return await langDesc.load();
         } catch (err) {
             console.error(`Failed to load language: ${lang}`, err);
             return null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xh/hoist",
-  "version": "79.0.0-SNAPSHOT.1765846193322",
+  "version": "79.0.0-SNAPSHOT.1765846827962",
   "description": "Hoist add-on for building and deploying React Applications.",
   "repository": "github:xh/hoist-react",
   "homepage": "https://xh.io",
@@ -34,12 +34,8 @@
     "@blueprintjs/datetime": "^5.3.7",
     "@blueprintjs/datetime2": "^2.3.7",
     "@codemirror/commands": "6.10.0",
-    "@codemirror/lang-css": "6.3.1",
-    "@codemirror/lang-html": "6.4.11",
-    "@codemirror/lang-javascript": "6.2.4",
-    "@codemirror/lang-json": "6.0.2",
-    "@codemirror/lang-sql": "6.10.0",
     "@codemirror/language": "6.11.3",
+    "@codemirror/language-data": "6.5.2",
     "@codemirror/lint": "6.9.2",
     "@codemirror/search": "6.5.11",
     "@codemirror/view": "6.39.4",