@jupyterlab/mermaid-extension 4.1.0-alpha.1

package/README.md

@@ -0,0 +1,3 @@
+# @jupyterlab/mermaid-extension
+
+A mime-renderer extension for JupyterLab that provides support for rendering Mermaid text-based diagrams and mime bundles.

package/lib/index.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @packageDocumentation
+ * @module mermaid-extension
+ */
+import { JupyterFrontEndPlugin } from '@jupyterlab/application';
+import { IMermaidManager, IMermaidMarkdown } from '@jupyterlab/mermaid';
+/**
+ * A namespace for mermaid text-based diagram commands.
+ */
+export declare namespace CommandIDs {
+    const copySource = "mermaid:copy-source";
+}
+declare const _default: (JupyterFrontEndPlugin<void> | JupyterFrontEndPlugin<IMermaidManager> | JupyterFrontEndPlugin<IMermaidMarkdown>)[];
+export default _default;

package/lib/index.js

@@ -0,0 +1,70 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+import { IThemeManager } from '@jupyterlab/apputils';
+import { IMermaidManager, IMermaidMarkdown, MERMAID_CLASS, MERMAID_CODE_CLASS, MermaidManager, MermaidMarkdown, RenderedMermaid } from '@jupyterlab/mermaid';
+/**
+ * A namespace for mermaid text-based diagram commands.
+ */
+export var CommandIDs;
+(function (CommandIDs) {
+    CommandIDs.copySource = 'mermaid:copy-source';
+})(CommandIDs || (CommandIDs = {}));
+/**
+ * A plugin for the core rendering/cachine of mermaid text-based diagrams
+ */
+const core = {
+    id: '@jupyterlab/mermaid-extension:core',
+    description: 'Provides the Mermaid manager.',
+    autoStart: true,
+    optional: [IThemeManager],
+    provides: IMermaidManager,
+    activate: (app, themes) => {
+        const manager = new MermaidManager({ themes });
+        RenderedMermaid.manager = manager;
+        return manager;
+    }
+};
+/**
+ * A plugin for rendering mermaid text-based diagrams in markdown fenced code blocks
+ */
+const markdown = {
+    id: '@jupyterlab/mermaid-extension:markdown',
+    description: 'Provides the Mermaid markdown renderer.',
+    autoStart: true,
+    requires: [IMermaidManager],
+    provides: IMermaidMarkdown,
+    activate: (app, mermaid) => {
+        return new MermaidMarkdown({ mermaid });
+    }
+};
+/**
+ * Contextual commands for mermaid text-based diagrams.
+ */
+const contextCommands = {
+    id: '@jupyterlab/mermaid-extension:context-commands',
+    description: 'Provides context menu commands for mermaid diagrams.',
+    autoStart: true,
+    requires: [IMermaidManager],
+    activate: (app, mermaid) => {
+        const isMermaid = (node) => node.classList.contains(MERMAID_CLASS);
+        app.commands.addCommand(CommandIDs.copySource, {
+            label: 'Mermaid Copy Diagram Source',
+            execute: async (args) => {
+                const node = app.contextMenuHitTest(isMermaid);
+                if (!node) {
+                    return;
+                }
+                const code = node.querySelector(`.${MERMAID_CODE_CLASS}`);
+                if (!code || !code.textContent) {
+                    return;
+                }
+                await navigator.clipboard.writeText(code.textContent);
+            }
+        });
+        const options = { selector: `.${MERMAID_CLASS}`, rank: 13 };
+        app.contextMenu.addItem({ command: CommandIDs.copySource, ...options });
+        app.contextMenu.addItem({ type: 'separator', ...options });
+    }
+};
+export default [core, markdown, contextCommands];
+//# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,0CAA0C;AAC1C,2DAA2D;AAW3D,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EACL,eAAe,EACf,gBAAgB,EAChB,aAAa,EACb,kBAAkB,EAClB,cAAc,EACd,eAAe,EACf,eAAe,EAChB,MAAM,qBAAqB,CAAC;AAE7B;;GAEG;AACH,MAAM,KAAW,UAAU,CAE1B;AAFD,WAAiB,UAAU;IACZ,qBAAU,GAAG,qBAAqB,CAAC;AAClD,CAAC,EAFgB,UAAU,KAAV,UAAU,QAE1B;AAED;;GAEG;AACH,MAAM,IAAI,GAA2C;IACnD,EAAE,EAAE,oCAAoC;IACxC,WAAW,EAAE,+BAA+B;IAC5C,SAAS,EAAE,IAAI;IACf,QAAQ,EAAE,CAAC,aAAa,CAAC;IACzB,QAAQ,EAAE,eAAe;IACzB,QAAQ,EAAE,CAAC,GAAoB,EAAE,MAAqB,EAAE,EAAE;QACxD,MAAM,OAAO,GAAG,IAAI,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC;QAC/C,eAAe,CAAC,OAAO,GAAG,OAAO,CAAC;QAClC,OAAO,OAAO,CAAC;IACjB,CAAC;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,QAAQ,GAA4C;IACxD,EAAE,EAAE,wCAAwC;IAC5C,WAAW,EAAE,yCAAyC;IACtD,SAAS,EAAE,IAAI;IACf,QAAQ,EAAE,CAAC,eAAe,CAAC;IAC3B,QAAQ,EAAE,gBAAgB;IAC1B,QAAQ,EAAE,CAAC,GAAoB,EAAE,OAAwB,EAAE,EAAE;QAC3D,OAAO,IAAI,eAAe,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC;IAC1C,CAAC;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,eAAe,GAAgC;IACnD,EAAE,EAAE,gDAAgD;IACpD,WAAW,EAAE,sDAAsD;IACnE,SAAS,EAAE,IAAI;IACf,QAAQ,EAAE,CAAC,eAAe,CAAC;IAC3B,QAAQ,EAAE,CAAC,GAAoB,EAAE,OAAwB,EAAE,EAAE;QAC3D,MAAM,SAAS,GAAG,CAAC,IAAiB,EAAE,EAAE,CACtC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;QAEzC,GAAG,CAAC,QAAQ,CAAC,UAAU,CAAC,UAAU,CAAC,UAAU,EAAE;YAC7C,KAAK,EAAE,6BAA6B;YACpC,OAAO,EAAE,KAAK,EAAE,IAAU,EAAE,EAAE;gBAC5B,MAAM,IAAI,GAAG,GAAG,CAAC,kBAAkB,CAAC,SAAS,CAAC,CAAC;gBAC/C,IAAI,CAAC,IAAI,EAAE;oBACT,OAAO;iBACR;gBACD,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,kBAAkB,EAAE,CAAC,CAAC;gBAC1D,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;oBAC9B,OAAO;iBACR;gBACD,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;YACxD,CAAC;SACF,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,EAAE,QAAQ,EAAE,IAAI,aAAa,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC;QAC5D,GAAG,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,OAAO,EAAE,UAAU,CAAC,UAAU,EAAE,GAAG,OAAO,EAAE,CAAC,CAAC;QACxE,GAAG,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,OAAO,EAAE,CAAC,CAAC;IAC7D,CAAC;CACF,CAAC;AAEF,eAAe,CAAC,IAAI,EAAE,QAAQ,EAAE,eAAe,CAAC,CAAC"}

package/lib/mime.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @packageDocumentation
+ * @module mermaid-extension
+ */
+import { IRenderMime } from '@jupyterlab/rendermime-interfaces';
+declare const extension: IRenderMime.IExtension;
+export default extension;

package/lib/mime.js

@@ -0,0 +1,35 @@
+/* -----------------------------------------------------------------------------
+| Copyright (c) Jupyter Development Team.
+| Distributed under the terms of the Modified BSD License.
+|----------------------------------------------------------------------------*/
+/**
+ * @packageDocumentation
+ * @module mermaid-extension
+ */
+import { MERMAID_FILE_EXTENSIONS, MERMAID_MIME_TYPE, rendererFactory } from '@jupyterlab/mermaid';
+const extension = {
+    id: '@jupyterlab/mermaid-extension:factory',
+    description: 'Provides a renderer for mermaid text-based diagrams.',
+    rendererFactory,
+    // one more than markdown
+    rank: 61,
+    dataType: 'string',
+    documentWidgetFactoryOptions: [
+        {
+            name: 'Mermaid',
+            primaryFileType: 'mermaid',
+            fileTypes: ['mermaid'],
+            defaultFor: ['mermaid']
+        }
+    ],
+    fileTypes: [
+        {
+            mimeTypes: [MERMAID_MIME_TYPE],
+            name: 'mermaid',
+            extensions: MERMAID_FILE_EXTENSIONS,
+            icon: 'ui-components:mermaid'
+        }
+    ]
+};
+export default extension;
+//# sourceMappingURL=mime.js.map

package/lib/mime.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mime.js","sourceRoot":"","sources":["../src/mime.ts"],"names":[],"mappings":"AAAA;;;+EAG+E;AAC/E;;;GAGG;AAEH,OAAO,EACL,uBAAuB,EACvB,iBAAiB,EACjB,eAAe,EAChB,MAAM,qBAAqB,CAAC;AAG7B,MAAM,SAAS,GAA2B;IACxC,EAAE,EAAE,uCAAuC;IAC3C,WAAW,EAAE,sDAAsD;IACnE,eAAe;IACf,yBAAyB;IACzB,IAAI,EAAE,EAAE;IACR,QAAQ,EAAE,QAAQ;IAClB,4BAA4B,EAAE;QAC5B;YACE,IAAI,EAAE,SAAS;YACf,eAAe,EAAE,SAAS;YAC1B,SAAS,EAAE,CAAC,SAAS,CAAC;YACtB,UAAU,EAAE,CAAC,SAAS,CAAC;SACxB;KACF;IACD,SAAS,EAAE;QACT;YACE,SAAS,EAAE,CAAC,iBAAiB,CAAC;YAC9B,IAAI,EAAE,SAAS;YACf,UAAU,EAAE,uBAAuB;YACnC,IAAI,EAAE,uBAAuB;SAC9B;KACF;CACF,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "@jupyterlab/mermaid-extension",
+  "version": "4.1.0-alpha.1",
+  "description": "JupyterLab - Mermaid Viewer",
+  "homepage": "https://github.com/jupyterlab/jupyterlab",
+  "bugs": {
+    "url": "https://github.com/jupyterlab/jupyterlab/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/jupyterlab/jupyterlab.git"
+  },
+  "license": "BSD-3-Clause",
+  "author": "Project Jupyter",
+  "sideEffects": [
+    "style/*.css",
+    "style/index.js"
+  ],
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "style": "style/index.css",
+  "directories": {
+    "lib": "lib/"
+  },
+  "files": [
+    "lib/*.d.ts",
+    "lib/*.js.map",
+    "lib/*.js",
+    "style/*.css",
+    "style/index.js",
+    "src/**/*.{ts,tsx}"
+  ],
+  "scripts": {
+    "build": "tsc -b",
+    "clean": "rimraf lib && rimraf tsconfig.tsbuildinfo",
+    "docs": "typedoc src",
+    "watch": "tsc -b --watch"
+  },
+  "dependencies": {
+    "@jupyterlab/application": "^4.1.0-alpha.1",
+    "@jupyterlab/apputils": "^4.2.0-alpha.1",
+    "@jupyterlab/mermaid": "^4.1.0-alpha.1",
+    "@jupyterlab/rendermime-interfaces": "^3.8.3-alpha.0"
+  },
+  "devDependencies": {
+    "rimraf": "~3.0.0",
+    "typedoc": "~0.24.7",
+    "typescript": "~5.0.4"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "jupyterlab": {
+    "extension": true,
+    "mimeExtension": "lib/mime.js"
+  },
+  "styleModule": "style/index.js"
+}

package/src/index.ts

@@ -0,0 +1,94 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+
+/**
+ * @packageDocumentation
+ * @module mermaid-extension
+ */
+
+import {
+  JupyterFrontEnd,
+  JupyterFrontEndPlugin
+} from '@jupyterlab/application';
+import { IThemeManager } from '@jupyterlab/apputils';
+import {
+  IMermaidManager,
+  IMermaidMarkdown,
+  MERMAID_CLASS,
+  MERMAID_CODE_CLASS,
+  MermaidManager,
+  MermaidMarkdown,
+  RenderedMermaid
+} from '@jupyterlab/mermaid';
+
+/**
+ * A namespace for mermaid text-based diagram commands.
+ */
+export namespace CommandIDs {
+  export const copySource = 'mermaid:copy-source';
+}
+
+/**
+ * A plugin for the core rendering/cachine of mermaid text-based diagrams
+ */
+const core: JupyterFrontEndPlugin<IMermaidManager> = {
+  id: '@jupyterlab/mermaid-extension:core',
+  description: 'Provides the Mermaid manager.',
+  autoStart: true,
+  optional: [IThemeManager],
+  provides: IMermaidManager,
+  activate: (app: JupyterFrontEnd, themes: IThemeManager) => {
+    const manager = new MermaidManager({ themes });
+    RenderedMermaid.manager = manager;
+    return manager;
+  }
+};
+
+/**
+ * A plugin for rendering mermaid text-based diagrams in markdown fenced code blocks
+ */
+const markdown: JupyterFrontEndPlugin<IMermaidMarkdown> = {
+  id: '@jupyterlab/mermaid-extension:markdown',
+  description: 'Provides the Mermaid markdown renderer.',
+  autoStart: true,
+  requires: [IMermaidManager],
+  provides: IMermaidMarkdown,
+  activate: (app: JupyterFrontEnd, mermaid: IMermaidManager) => {
+    return new MermaidMarkdown({ mermaid });
+  }
+};
+
+/**
+ * Contextual commands for mermaid text-based diagrams.
+ */
+const contextCommands: JupyterFrontEndPlugin<void> = {
+  id: '@jupyterlab/mermaid-extension:context-commands',
+  description: 'Provides context menu commands for mermaid diagrams.',
+  autoStart: true,
+  requires: [IMermaidManager],
+  activate: (app: JupyterFrontEnd, mermaid: IMermaidManager) => {
+    const isMermaid = (node: HTMLElement) =>
+      node.classList.contains(MERMAID_CLASS);
+
+    app.commands.addCommand(CommandIDs.copySource, {
+      label: 'Mermaid Copy Diagram Source',
+      execute: async (args?: any) => {
+        const node = app.contextMenuHitTest(isMermaid);
+        if (!node) {
+          return;
+        }
+        const code = node.querySelector(`.${MERMAID_CODE_CLASS}`);
+        if (!code || !code.textContent) {
+          return;
+        }
+        await navigator.clipboard.writeText(code.textContent);
+      }
+    });
+
+    const options = { selector: `.${MERMAID_CLASS}`, rank: 13 };
+    app.contextMenu.addItem({ command: CommandIDs.copySource, ...options });
+    app.contextMenu.addItem({ type: 'separator', ...options });
+  }
+};
+
+export default [core, markdown, contextCommands];

package/src/mime.ts

@@ -0,0 +1,42 @@
+/* -----------------------------------------------------------------------------
+| Copyright (c) Jupyter Development Team.
+| Distributed under the terms of the Modified BSD License.
+|----------------------------------------------------------------------------*/
+/**
+ * @packageDocumentation
+ * @module mermaid-extension
+ */
+
+import {
+  MERMAID_FILE_EXTENSIONS,
+  MERMAID_MIME_TYPE,
+  rendererFactory
+} from '@jupyterlab/mermaid';
+import { IRenderMime } from '@jupyterlab/rendermime-interfaces';
+
+const extension: IRenderMime.IExtension = {
+  id: '@jupyterlab/mermaid-extension:factory',
+  description: 'Provides a renderer for mermaid text-based diagrams.',
+  rendererFactory,
+  // one more than markdown
+  rank: 61,
+  dataType: 'string',
+  documentWidgetFactoryOptions: [
+    {
+      name: 'Mermaid',
+      primaryFileType: 'mermaid',
+      fileTypes: ['mermaid'],
+      defaultFor: ['mermaid']
+    }
+  ],
+  fileTypes: [
+    {
+      mimeTypes: [MERMAID_MIME_TYPE],
+      name: 'mermaid',
+      extensions: MERMAID_FILE_EXTENSIONS,
+      icon: 'ui-components:mermaid'
+    }
+  ]
+};
+
+export default extension;

package/style/base.css

@@ -0,0 +1,4 @@
+/*-----------------------------------------------------------------------------
+| Copyright (c) Jupyter Development Team.
+| Distributed under the terms of the Modified BSD License.
+|----------------------------------------------------------------------------*/

package/style/index.css

@@ -0,0 +1,10 @@
+/*-----------------------------------------------------------------------------
+| Copyright (c) Jupyter Development Team.
+| Distributed under the terms of the Modified BSD License.
+|----------------------------------------------------------------------------*/
+
+/* This file was auto-generated by ensurePackage() in @jupyterlab/buildutils */
+@import url('~@jupyterlab/apputils/style/index.css');
+@import url('~@jupyterlab/application/style/index.css');
+@import url('~@jupyterlab/mermaid/style/index.css');
+@import url('./base.css');

package/style/index.js

@@ -0,0 +1,11 @@
+/*-----------------------------------------------------------------------------
+| Copyright (c) Jupyter Development Team.
+| Distributed under the terms of the Modified BSD License.
+|----------------------------------------------------------------------------*/
+
+/* This file was auto-generated by ensurePackage() in @jupyterlab/buildutils */
+import '@jupyterlab/apputils/style/index.js';
+import '@jupyterlab/application/style/index.js';
+import '@jupyterlab/mermaid/style/index.js';
+
+import './base.css';