Support markdown cell

jupyterlab-contrib · Nov 26, 2024 · cbdd5fb · cbdd5fb
1 parent 105b7ba
commit cbdd5fb
Show file tree

Hide file tree

Showing 3 changed files with 82 additions and 14 deletions.
diff --git a/packages/base/package.json b/packages/base/package.json
@@ -34,16 +34,19 @@
     "watch": "tsc -w"
   },
   "dependencies": {
+    "@jupyter/ydoc": "^3.0.0",
     "@jupyterlab/apputils": "^4.0.0",
+    "@jupyterlab/cells": "^4.0.0",
+    "@jupyterlab/codemirror": "^4.0.0",
     "@jupyterlab/docregistry": "^4.0.0",
+    "@jupyterlab/nbformat": "^4.0.0",
     "@jupyterlab/notebook": "^4.0.0",
-    "@jupyterlab/cells": "^4.0.0",
+    "@jupyterlab/rendermime": "^4.0.0",
     "@jupyterlab/ui-components": "^4.0.0",
-    "@jupyterlab/nbformat": "^4.0.0",
+    "@lumino/coreutils": "^2.0.0",
     "@lumino/disposable": "^2.0.0",
     "@lumino/signaling": "^2.0.0",
     "@lumino/widgets": "^2.0.0",
-    "@lumino/coreutils": "^2.0.0",
     "typestyle": "^2.4.0"
   },
   "devDependencies": {

diff --git a/packages/base/src/suggestionsPanel/cellWidget.ts b/packages/base/src/suggestionsPanel/cellWidget.ts
@@ -1,20 +1,53 @@
 import { Cell, CodeCell, CodeCellModel } from '@jupyterlab/cells';
-import {
-  CodeMirrorEditorFactory,
-  EditorLanguageRegistry
-} from '@jupyterlab/codemirror';
 import { ICell } from '@jupyterlab/nbformat';
 import {
   RenderMimeRegistry,
   standardRendererFactories as initialFactories
 } from '@jupyterlab/rendermime';
 import { Panel } from '@lumino/widgets';
 import { suggestionCellStyle } from './style';
+import {
+  CodeMirrorEditorFactory,
+  EditorExtensionRegistry,
+  EditorLanguageRegistry,
+  EditorThemeRegistry,
+  ybinding
+} from '@jupyterlab/codemirror';
+import { IYText } from '@jupyter/ydoc';
 
 export class CellWidget extends Panel {
   constructor(options: CellWidget.IOptions) {
     super(options);
+    const { cellModel } = options;
     this.addClass(suggestionCellStyle);
+
+    const editorExtensions = () => {
+      const themes = new EditorThemeRegistry();
+      EditorThemeRegistry.getDefaultThemes().forEach(theme => {
+        themes.addTheme(theme);
+      });
+      const registry = new EditorExtensionRegistry();
+
+      EditorExtensionRegistry.getDefaultExtensions({ themes }).forEach(
+        extensionFactory => {
+          registry.addExtension(extensionFactory);
+        }
+      );
+      registry.addExtension({
+        name: 'shared-model-binding',
+        factory: options => {
+          const sharedModel = options.model.sharedModel as IYText;
+          return EditorExtensionRegistry.createImmutableExtension(
+            ybinding({
+              ytext: sharedModel.ysource,
+              undoManager: sharedModel.undoManager ?? undefined
+            })
+          );
+        }
+      });
+      return registry;
+    };
+
     const rendermime = new RenderMimeRegistry({ initialFactories });
     const languages = new EditorLanguageRegistry();
     EditorLanguageRegistry.getDefaultLanguages()
@@ -24,18 +57,44 @@ export class CellWidget extends Panel {
       .forEach(language => {
         languages.addLanguage(language);
       });
+
+    languages.addLanguage({
+      name: 'ipythongfm',
+      mime: 'text/x-ipythongfm',
+      load: async () => {
+        const m = await import('@codemirror/lang-markdown');
+        return m.markdown({
+          codeLanguages: (info: string) => languages.findBest(info) as any
+        });
+      }
+    });
     const factoryService = new CodeMirrorEditorFactory({
+      extensions: editorExtensions(),
       languages
     });
     const model = new CodeCellModel();
+    let mimeType = 'text/plain';
+    if (cellModel.cell_type === 'code') {
+      //TODO Detect correct kernel language
+      mimeType = 'text/x-ipython';
+    } else if (cellModel.cell_type === 'markdown') {
+      mimeType = 'text/x-ipythongfm';
+    }
+    model.mimeType = mimeType;
     model.sharedModel.setSource(options.cellModel.source as string);
     const cellWidget = new CodeCell({
       contentFactory: new Cell.ContentFactory({
         editorFactory: factoryService.newInlineEditor.bind(factoryService)
       }),
       rendermime,
-      model
-    });
+      model,
+      editorConfig: {
+        lineNumbers: false,
+        lineWrap: false,
+        matchBrackets: true,
+        tabFocusable: false
+      }
+    }).initializeState();
     this.addWidget(cellWidget);
   }
 }

diff --git a/yarn.lock b/yarn.lock
@@ -490,10 +490,16 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@jupyter/jupyter-suggestions-base@workspace:packages/base"
   dependencies:
+    "@jupyter/ydoc": ^3.0.0
     "@jupyterlab/apputils": ^4.0.0
+    "@jupyterlab/cells": ^4.0.0
+    "@jupyterlab/codemirror": ^4.0.0
     "@jupyterlab/docregistry": ^4.0.0
+    "@jupyterlab/nbformat": ^4.0.0
     "@jupyterlab/notebook": ^4.0.0
+    "@jupyterlab/rendermime": ^4.0.0
     "@jupyterlab/ui-components": ^4.0.0
+    "@lumino/coreutils": ^2.0.0
     "@lumino/disposable": ^2.0.0
     "@lumino/signaling": ^2.0.0
     "@lumino/widgets": ^2.0.0
@@ -695,7 +701,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@jupyterlab/cells@npm:^4.3.1":
+"@jupyterlab/cells@npm:^4.0.0, @jupyterlab/cells@npm:^4.3.1":
   version: 4.3.1
   resolution: "@jupyterlab/cells@npm:4.3.1"
   dependencies:
@@ -755,7 +761,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@jupyterlab/codemirror@npm:^4.3.1":
+"@jupyterlab/codemirror@npm:^4.0.0, @jupyterlab/codemirror@npm:^4.3.1":
   version: 4.3.1
   resolution: "@jupyterlab/codemirror@npm:4.3.1"
   dependencies:
@@ -932,7 +938,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@jupyterlab/nbformat@npm:^3.0.0 || ^4.0.0-alpha.21 || ^4.0.0, @jupyterlab/nbformat@npm:^4.3.1":
+"@jupyterlab/nbformat@npm:^3.0.0 || ^4.0.0-alpha.21 || ^4.0.0, @jupyterlab/nbformat@npm:^4.0.0, @jupyterlab/nbformat@npm:^4.3.1":
   version: 4.3.1
   resolution: "@jupyterlab/nbformat@npm:4.3.1"
   dependencies:
@@ -1024,7 +1030,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@jupyterlab/rendermime@npm:^4.3.1":
+"@jupyterlab/rendermime@npm:^4.0.0, @jupyterlab/rendermime@npm:^4.3.1":
   version: 4.3.1
   resolution: "@jupyterlab/rendermime@npm:4.3.1"
   dependencies:
@@ -1461,7 +1467,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@lumino/coreutils@npm:^1.11.0 || ^2.0.0, @lumino/coreutils@npm:^1.11.0 || ^2.2.0, @lumino/coreutils@npm:^2.2.0":
+"@lumino/coreutils@npm:^1.11.0 || ^2.0.0, @lumino/coreutils@npm:^1.11.0 || ^2.2.0, @lumino/coreutils@npm:^2.0.0, @lumino/coreutils@npm:^2.2.0":
   version: 2.2.0
   resolution: "@lumino/coreutils@npm:2.2.0"
   dependencies: