Pondering — Admonition Tags for JupyterLab Markdown Cells?

In Fragments – Previewing Richly Formatted Jupyter Book Style Content Authored Using MyST-md I noted the JupyterLab-MyST extension which can render MyST admonition blocks included in a Markdown cell.

At the time, I wondered how easy it would be to used a cell tag on a markdown block instead of cluttering the markdown with the MyST admonition block code fences.

However, in rediscovering the agoose77/jupyterlab-imarkdown extension, which replicates the classic notebook Python Markdown extension that lets you embed and render Python variables within a markdown cell, I wonder how easy it would be to crib that extension to create a custom markdown cell renderer that could either:

  • parse the cell tags;
  • wrap the markdown cell content in an admonition block code fence;
  • continue with the JupyterLab-MyST rendering;

Or:

  • parse the cell tags;
  • wrap the markdown cell content in some admonition block HTML (resembling the output from the MyST extension, for example);
  • parse the HTML wrapped markdown content in the normal way;

Or:

  • parse the cell tags;
  • wrap the rendered cell output in appropriate admonition block HTML;
  • update the rendered cell output with the updated output.

In terms of getting a feel for working with the notebooks, it might be instructive to see how each of these appproaches could actually be implemented.

Poking around the JupyterLab-MyST extension, it seems as if it makes use of the @agoose77/jupyterlab-markup extension (import { simpleMarkdownItPlugin } from '@agoose77/jupyterlab-markup';) by extending the markdown-it pipeline it uses? One question that remains is how we get access to the cell metadata so that we can use that as the basis for wrapping the original cell markdown content appropriately? However, it seems that this isn’t possible in the jupyterlab-markup extension, which only has access to the original markdown cell content. Instead, we’d need a custom cell renderer such as the one provided by the jupyterlab-imarkdown extension (for a related query on how to reate custom markdown cell renderers, see Creating a Custom JupyterLab Notebook Markdown Cell Renderer).

For a discussion of the jupyterlab-markup plugin mechanism, see How do you add plugins?.

PS Ooh.. looking in https://github.com/agoose77/jupyterlab-markup/blob/main/src/builtins I notice that there are some other neat integrations… like mermaid diagram rendering in markdown cells:

The extension also looks to use some WASM powered support for rendering svgbob ascii diagrams to SVG:

Author: Tony Hirst

I'm a Senior Lecturer at The Open University, with an interest in #opendata policy and practice, as well as general web tinkering...

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: