fix: make code annotations from mkdocs-material work

Fixes #3

docs/index.md

@@ -78,6 +78,56 @@ import altair as alt
 
 cars = data.cars()
 
+chart = alt.Chart(cars).mark_circle().encode(
+    x='Horsepower',
+    y='Miles_per_Gallon',
+    color='Origin',
+
+# assign a widget to page so solara knows what to render
+page = alt.JupyterChart(chart)
+```
+
+The default link text (in markdown format) can be changed in `mkdocs.yml` by changing the `link_text` option in the `format` object, or by adding the `pycafe-link-text` attribute to the code block.
+
+````
+```{.python pycafe-link pycafe-link-text="My custom link text"}
+...
+```
+````
+
+### Existing code block features
+
+Existing features such as [annotations](https://squidfunk.github.io/mkdocs-material/reference/annotations/) and [line highlighting](https://squidfunk.github.io/mkdocs-material/reference/code-blocks/#highlighting-specific-lines) should still work.
+
+````
+```{.python pycafe-link extra-requirements="vega_datasets" hl_lines="7-9"}
+from vega_datasets import data
+import altair as alt
+
+cars = data.cars()  # (1)
+
+chart = alt.Chart(cars).mark_circle().encode(
+    x='Horsepower',
+    y='Miles_per_Gallon',
+    color='Origin',
+)
+
+# assign a widget to page so solara knows what to render
+page = alt.JupyterChart(chart)
+```
+
+1.  Code annotations should still work.
+
+````
+
+Should render as:
+
+```{.python pycafe-link  hl_lines="7-9" extra-requirements="vega_datasets"}
+from vega_datasets import data
+import altair as alt
+
+cars = data.cars()  # (1)
+
 chart = alt.Chart(cars).mark_circle().encode(
     x='Horsepower',
     y='Miles_per_Gallon',
@@ -88,6 +138,8 @@ chart = alt.Chart(cars).mark_circle().encode(
 page = alt.JupyterChart(chart)
 ```
 
+1.  Code annotations should still work.
+
 
 ### Code block with an embedded app
 

mkdocs.yml

@@ -5,6 +5,8 @@ repo_name: mkdocs-pycafe
 edit_uri: edit/main/docs/
 theme:
   name: material
+  features:
+    - content.code.annotate #
 markdown_extensions:
   - pymdownx.superfences:
       custom_fences:

src/mkdocs_pycafe/__init__.py

@@ -1,6 +1,7 @@
 import base64
 import gzip
 import json
+import warnings
 from functools import partial
 from urllib.parse import quote_plus, urlencode
 
@@ -47,7 +48,17 @@ def _formatter(src="", language="", class_name=None, options=None, md="", requir
             url = pycafe_edit_url(code=src, requirements=requirements, app_type=pycafe_type)
             text = "Run and edit above code in py.cafe"
             target = "_blank"
-            el = el + f"""<a href="{url}" class="PyCafe-button PyCafe-launch-button" target={target}>{text}</a>"""
+            link = f"""<a href="{url}" class="PyCafe-button PyCafe-launch-button" target={target}>{text}</a>"""
+            el = el.rstrip()
+            if el.endswith("</div>"):
+                el = el[: -len("</div>")] + link + "</div>"
+            else:
+                warnings.warn(
+                    f"pycafe-link cannot be inserted in the code block div: {el}\nThis might break annotations, please open an issue.",
+                    UserWarning,
+                    stacklevel=1,
+                )
+                el = el + link
         if pycafe_embed:
             url = pycafe_embed_url(code=src, requirements=requirements, app_type=pycafe_type, theme=pycafe_embed_theme)
             # e.g. <iframe src="https://py.cafe/embed?apptype=streamlit&theme=light&linkToApp=false#c=..."