feat: add task list support to markdown (#3151)

Fixes #3149

![Screenshot 2024-12-12 at 6 20
42 PM](https://github.com/user-attachments/assets/eeaab0ce-21bd-4f6e-9cbb-e58d09ee3216)

frontend/src/css/md.css

@@ -96,3 +96,16 @@ This change includes accordions https://github.com/marimo-team/marimo/issues/221
 button .prose.prose {
   max-width: none;
 }
+
+/* Task list */
+
+.prose .task-list-item {
+  list-style-type: none !important;
+  margin-top: 0.25rem;
+  margin-bottom: 0.25rem;
+}
+
+.prose .task-list-item input[type="checkbox"] {
+  margin: 0 0.5rem 0.25rem -1.6rem;
+  vertical-align: middle;
+}

marimo/_output/md.py

@@ -63,6 +63,8 @@ def __init__(
                 "pymdownx.tilde",
                 # Better code blocks
                 "pymdownx.superfences",
+                # Task lists
+                "pymdownx.tasklist",
                 # Table of contents
                 # This adds ids to the HTML headers
                 "toc",

marimo/_smoke_tests/markdown_pymdownx.py

@@ -0,0 +1,37 @@
+import marimo
+
+__generated_with = "0.9.34"
+app = marimo.App(width="medium")
+
+
+@app.cell
+def _(mo):
+    mo.md(
+        r"""
+        Task List
+
+        - item
+        -   [X] item 1
+            *   [X] item A
+            *   [ ] item B
+                more text
+                +   [x] item a
+                +   [ ] item b
+                +   [x] item c
+            *   [X] item C
+            *   non item
+        -   [ ] item 2
+        -   [ ] item 3
+        """
+    )
+    return
+
+
+@app.cell
+def _():
+    import marimo as mo
+    return (mo,)
+
+
+if __name__ == "__main__":
+    app.run()