Added option to specify initial number of lines in pyodide fence editors

Author: Jayant

src/markdown_exec/_internal/formatters/pyodide.py

@@ -2,6 +2,7 @@
 
 from __future__ import annotations
 
+import json
 from typing import TYPE_CHECKING, Any
 
 if TYPE_CHECKING:
@@ -37,17 +38,64 @@
 
 <script>
 document.addEventListener('DOMContentLoaded', (event) => {
-    setupPyodide('%(id_prefix)s', install=%(install)s, themeLight='%(theme_light)s', themeDark='%(theme_dark)s', session='%(session)s');
+    setupPyodide('%(id_prefix)s', install=%(install)s, themeLight='%(theme_light)s', themeDark='%(theme_dark)s', session='%(session)s', heightConfig=%(height_config)s);
 });
 </script>
 """
 
 _counter = 0
 
 
+def _calculate_height_config(code: str, extra: dict) -> dict:
+    """Calculate height configuration for the Pyodide editor."""
+    # Get per-block options with defaults
+    height = extra.pop("height", "auto")
+    min_height = extra.pop("min_height", 5)
+    max_height = extra.pop("max_height", 30)
+    resize = extra.pop("resize", True)
+
+    # Validate and convert types
+    if isinstance(height, str) and height != "auto":
+        try:
+            height = int(height)
+        except ValueError:
+            height = "auto"
+
+    if height != "auto" and isinstance(height, int) and height <= 0:
+        height = "auto"
+
+    try:
+        min_height = max(1, int(min_height))
+        max_height = max(min_height, int(max_height))
+    except ValueError:
+        min_height, max_height = 5, 30
+
+    try:
+        resize = str(resize).lower() in ("true", "1", "yes", "on")
+    except (ValueError, AttributeError):
+        resize = True
+
+    # Calculate actual height if "auto"
+    if height == "auto":
+        # Count lines in the code, with a reasonable default
+        lines = len(code.strip().split("\n")) if code.strip() else 5
+        height = max(min_height, min(lines, max_height))
+
+    return {
+        "height": height,
+        "minLines": min_height,
+        "maxLines": max_height,
+        "resize": resize,
+    }
+
+
 def _format_pyodide(code: str, md: Markdown, session: str, extra: dict, **options: Any) -> str:  # noqa: ARG001
     global _counter  # noqa: PLW0603
     _counter += 1
+
+    # Calculate height configuration for this specific code block
+    height_config = _calculate_height_config(code, extra)
+
     version = extra.pop("version", "0.26.4").lstrip("v")
     install = extra.pop("install", "")
     install = install.split(",") if install else []
@@ -57,6 +105,9 @@ def _format_pyodide(code: str, md: Markdown, session: str, extra: dict, **option
         theme = f"{theme},{theme}"
     theme_light, theme_dark = theme.split(",")
 
+    # Convert height_config to JSON string for JavaScript
+    height_config_json = json.dumps(height_config)
+
     data = {
         "id_prefix": f"exec-{_counter}--",
         "initial_code": code,
@@ -66,6 +117,7 @@ def _format_pyodide(code: str, md: Markdown, session: str, extra: dict, **option
         "session": session or "default",
         "play_emoji": _play_emoji,
         "clear_emoji": _clear_emoji,
+        "height_config": height_config_json,
     }
     rendered = _template % data
     if exclude_assets:

src/markdown_exec/assets/pyodide.css

@@ -13,8 +13,6 @@ html[data-theme="dark"] {
 
 .pyodide-editor {
     width: 100%;
-    min-height: 200px;
-    max-height: 400px;
     font-size: .85em;
 }
 

src/markdown_exec/assets/pyodide.js

@@ -77,7 +77,7 @@ function updateTheme(editor, light, dark) {
     });
 }
 
-async function setupPyodide(idPrefix, install = null, themeLight = 'tomorrow', themeDark = 'tomorrow_night', session = null) {
+async function setupPyodide(idPrefix, install = null, themeLight = 'tomorrow', themeDark = 'tomorrow_night', session = null, heightConfig = null) {
     const editor = ace.edit(idPrefix + "editor");
     const run = document.getElementById(idPrefix + "run");
     const clear = document.getElementById(idPrefix + "clear");
@@ -88,6 +88,44 @@ async function setupPyodide(idPrefix, install = null, themeLight = 'tomorrow', t
     editor.session.setMode("ace/mode/python");
     setTheme(editor, getTheme(), themeLight, themeDark);
 
+    // Apply height configuration using Ace editor options
+    if (heightConfig) {
+        // Set initial height/lines
+        if (heightConfig.height && typeof heightConfig.height === 'number') {
+            editor.setOption("minLines", heightConfig.height);
+            if (!heightConfig.resize) {
+                editor.setOption("maxLines", heightConfig.height);
+            }
+        }
+        
+        // Set min/max lines
+        if (heightConfig.minLines) {
+            editor.setOption("minLines", Math.max(editor.getOption("minLines") || 1, heightConfig.minLines));
+        }
+        if (heightConfig.maxLines) {
+            editor.setOption("maxLines", heightConfig.maxLines);
+        }
+        
+        // Configure resize behavior
+        if (heightConfig.resize === false) {
+            // Fixed height - set both min and max to the same value
+            const fixedLines = heightConfig.height || heightConfig.minLines || 5;
+            editor.setOption("minLines", fixedLines);
+            editor.setOption("maxLines", fixedLines);
+        } else {
+            // Allow resizing within bounds
+            editor.setOption("minLines", heightConfig.minLines || 5);
+            editor.setOption("maxLines", heightConfig.maxLines || 30);
+        }
+    } else {
+        // Default behavior - keep existing fallback
+        editor.setOption("minLines", 5);
+        editor.setOption("maxLines", 30);
+    }
+
+    // Force editor to resize after setting options
+    editor.resize();
+
     writeOutput(output, "Initializing...");
     let pyodide = await pyodidePromise;
     if (install && install.length) {