Add option to include requireJS

README.md

@@ -214,6 +214,16 @@ plugins:
       highlight_extra_classes: "custom-css-classes
 ```
 
+### RequireJS
+
+By default RequireJS is not loaded. You can enable it with:
+
+```yml
+plugins:
+  - mkdocs-jupyter:
+      include_requirejs: true
+```
+
 ### Download notebook link
 
 You can tell the plugin to include the notebook source to make it easy to show a
@@ -283,5 +293,18 @@ Create a `main.html` file like:
 Any markdown specific features such as
 [admonitions](https://squidfunk.github.io/mkdocs-material/reference/admonitions/)
 wont work with mkdocs-jupyter because those features are not supported by
-Jupyter itseft and we use [nbconvert](https://nbconvert.readthedocs.io/) to make
+Jupyter itself and we use [nbconvert](https://nbconvert.readthedocs.io/) to make
 the conversion.
+
+To use this type of features you have to define the HTML directly in the
+markdown cells:
+
+```html
+<div class="admonition note">
+  <p class="admonition-title">Note</p>
+  <p>
+    If two distributions are similar, then their entropies are similar, implies
+    the KL divergence with respect to two distributions will be smaller...
+  </p>
+</div>
+```

js/src/styles/index.scss

@@ -477,7 +477,7 @@ We duplicated them to the root so they work in the cells
         position: absolute;
         top: -3px;
         right: 0;
-        // z-index: 1000;
+        z-index: 1;
 
         clipboard-copy {
             -webkit-appearance: button;

mkdocs_jupyter/nbconvert2.py

@@ -48,6 +48,7 @@ def nb2html(
     no_input: bool = False,
     remove_tag_config: dict = {},
     highlight_extra_classes: str = "",
+    include_requirejs: bool = False,
 ):
     """
     Convert a notebook to HTML
@@ -130,7 +131,12 @@ def custom_clean_html(element):
         nb_file = io.StringIO(jupytext.writes(nb, fmt="ipynb"))
         content, resources = exporter.from_file(
             nb_file,
-            resources={"mkdocs": {"test": "value"}},
+            resources={
+                "mkdocs": {
+                    "test": "value",
+                    "include_requirejs": include_requirejs,
+                }
+            },
         )
     else:
         try:
@@ -142,7 +148,10 @@ def custom_clean_html(element):
         content, resources = exporter.from_filename(
             nb_path,
             resources={
-                "mkdocs": {"highlight_extra_classes": highlight_extra_classes}
+                "mkdocs": {
+                    "test": "value",
+                    "include_requirejs": include_requirejs,
+                }
             },
         )
 

mkdocs_jupyter/plugin.py

@@ -48,6 +48,7 @@ class Plugin(mkdocs.plugins.BasePlugin):
         ("no_input", config_options.Type(bool, default=False)),
         ("remove_tag_config", config_options.Type(dict, default={})),
         ("highlight_extra_classes", config_options.Type(str, default="")),
+        ("include_requirejs", config_options.Type(bool, default=False)),
     )
     _supported_extensions = [".ipynb", ".py"]
 
@@ -80,14 +81,15 @@ def on_files(self, files, config):
     def on_pre_page(self, page, config, files):
         if self.should_include(page.file):
             ignore_h1_titles = self.config["ignore_h1_titles"]
-            kernel_name = self.config["kernel_name"]
 
             exec_nb = self.config["execute"]
+            kernel_name = self.config["kernel_name"]
             allow_errors = self.config["allow_errors"]
             show_input = self.config["show_input"]
             no_input = self.config["no_input"]
             remove_tag_config = self.config["remove_tag_config"]
             highlight_extra_classes = self.config["highlight_extra_classes"]
+            include_requirejs = self.config["include_requirejs"]
 
             if (
                 self.config["execute_ignore"]
@@ -113,6 +115,7 @@ def new_render(self, config, files):
                     no_input=no_input,
                     remove_tag_config=remove_tag_config,
                     highlight_extra_classes=highlight_extra_classes,
+                    include_requirejs=include_requirejs,
                 )
                 self.content = body
                 toc, title = get_nb_toc(page.file.abs_src_path)

mkdocs_jupyter/templates/mkdocs_html/notebook.html.j2

@@ -8,12 +8,10 @@
 {%- block header -%}
 
 {# CHANGE:
-1. Remove Require.JS (incompatible with the clipboard-copy)
+1. Make RequireJS optional as might conflict with some JS stuff from material
 #}
 {%- block html_head_js -%}
-{%- block html_head_js_requirejs -%}
-{# <script src="{{ resources.require_js_url }}"></script> #}
-{%- endblock html_head_js_requirejs -%}
+
 {{ resources.include_js("mkdocs_html/assets/clipboard.umd.js") }}
 <script>
       document.addEventListener('clipboard-copy', function(event) {
@@ -24,6 +22,12 @@
         }, 1000)
       })
 </script>
+
+{%- block html_head_js_requirejs -%}
+{%- if resources.mkdocs.include_requirejs -%}
+<script src="{{ resources.require_js_url }}"></script>
+{%- endif -%}
+{%- endblock html_head_js_requirejs -%}
 {%- endblock html_head_js -%}
 
 {% block jupyter_widgets %}
@@ -55,7 +59,6 @@
 {%- endblock notebook_css %}
 
 {{ mathjax() }}
-{{ resources.mkdocs }}
 {%- endblock header -%}
 
 {# CHANGE: Remove the footer - lab template outputs a full HTML page #}

mkdocs_jupyter/tests/mkdocs/material-with-nbs.yml

@@ -9,8 +9,9 @@ nav:
 
 plugins:
   - mkdocs-jupyter:
-      include_source: True
+      include_source: true
       highlight_extra_classes: "custom-css-classes"
+      include_requirejs: true
 
 markdown_extensions:
   - toc:

mkdocs_jupyter/tests/mkdocs/material-with-pys.yml

@@ -8,8 +8,8 @@ nav:
 
 plugins:
   - mkdocs-jupyter:
-      include_source: True
-      execute: True
+      include_source: true
+      execute: true
       execute_ignore:
         - "*.ipynb"