jupyterlab-empinken-extension 0.1.2

Coloured JupyterLab / RetroLab notebook cells based on cell tags

jupyterlab-empinken-extension

Coloured JupyterLab / RetroLab notebook cells based on cell tags

Jupyterlite demo: https://innovationoutside.github.io/jupyterlab_empinken_extension/

This extension optionally enables four notebook toolbar buttons that can toggle persistent tag state on notebook markdown and code cells.

To install the prebuilt extension from a wheel:

pip3 install --upgrade jupyterlab-empinken-extension

To install the wheel from this repo:

pip3 install --upgrade https://raw.githubusercontent.com/innovationOUtside/jupyterlab_empinken_extension/main/dist/jupyterlab_empinken_extension-0.1.1-py3-none-any.whl

You may need to restart the JupyterLab server? [NOT TESTED]

I have no idea how to construct the repo so that you could pip install git+REPO and it wouldn't go through the build process. TBH, I'm surprised I made it this far...

The extension detects appropriate tags and adds corresponding classes to the notebook cell HTML DOM, which allows the backgrounds of the styles to be styled:

Extension settings can be accessed from the Settings menu (Advanced Settings) and used to define the parsed tag patterns and the corresponding background colours.

The extension also allows the display of each of the toolbar buttons to be individually controlled, as well as whether cells with parsed tags have HTML DOM classes added or not.

Building and Pushing Newly Built Wheels to PyPi

# Build
pip install build jupyter-packaging

# Install the package
pip install .

# Node MUST BE INSTALLED
python -m build
# packages built into ./dist

# Push to PyPi
pip install twine
twine upload MY_PACKAGE.whl

Related Blog Posts

• Notes on the JupyterLab Notebook HTML DOM Model, Part 1: Rendered Markdown Cells
• Notes on the JupyterLab Notebook HTML DOM Model, Part 2: Code Cells
• Notes on the JupyterLab Notebook HTML DOM Model, Part 3: Setting Classes Based on Cell Tags From a JupyterLab Extension
• Notes on the JupyterLab Notebook HTML DOM Model, Part 4: Styling Custom Classes
• Notes on the JupyterLab Notebook HTML DOM Model, Part 5: Setting DOM Classes and Cell Tags From Notebook Toolbar Buttons
• Notes on the JupyterLab Notebook HTML DOM Model, Part 6: Pulling an Extension Together
• Notes on the JupyterLab Notebook HTML DOM Model, Part 7: Extension User Settings
• Notes on the JupyterLab Notebook HTML DOM Model, Part 8: Setting CSS Variable Values from an Extension
• Notes on the JupyterLab Notebook HTML DOM Model, Part 8.5: A Reproducible Development Process
• Notes on the JupyterLab Notebook HTML DOM Model, Part 9: Building and Distributing a Pre-Built Extension
• Demoing JupyterLab Extensions from an Extension Repo Using Github Pages and JupyterLite