mrmd-editor 0.6.0 → 0.7.1

package/src/index.js

@@ -304,55 +304,55 @@ function parseProgress(output) {
 function createJavaScriptRuntime(options = {}) {
   const rt = createMrmdJsRuntime(options);
 
-  // Track named sessions - each can have different isolation
-  // Session naming:
-  //   null/undefined/'default'/'main'/'none' → main context (no isolation)
+  // Track named execution contexts - each can have different isolation
+  // Context naming:
+  //   null/undefined/'default'/'main'/'none' → configured default isolation
   //   'sandbox'/'iframe' → sandboxed iframe
   //   other names → sandboxed iframe with separate scope
-  const sessions = new Map();
+  const contexts = new Map();
   const defaultIsolation = options.defaultIsolation || 'iframe';
 
   /**
-   * Get or create a session by name
-   * @param {string|null} sessionName
+   * Get or create a context by name
+   * @param {string|null} contextName
    * @returns {Session}
    */
-  function getOrCreateSession(sessionName) {
-    // Normalize session name
-    const name = sessionName || 'default';
+  function getOrCreateContext(contextName) {
+    // Normalize context name
+    const name = contextName || 'default';
 
-    // Return existing session
-    if (sessions.has(name)) {
-      return sessions.get(name);
+    // Return existing context
+    if (contexts.has(name)) {
+      return contexts.get(name);
     }
 
-    // Determine isolation mode based on session name
+    // Determine isolation mode based on context name
     let isolation;
-    if (!sessionName || sessionName === 'default' || sessionName === 'main' || sessionName === 'none') {
-      // Default session uses the configured default isolation
+    if (!contextName || contextName === 'default' || contextName === 'main' || contextName === 'none') {
+      // Default context uses the configured default isolation
       isolation = defaultIsolation;
-    } else if (sessionName === 'sandbox' || sessionName === 'iframe') {
+    } else if (contextName === 'sandbox' || contextName === 'iframe') {
       // Explicit sandbox request
       isolation = 'iframe';
     } else {
-      // Named sessions are sandboxed by default (separate scope)
+      // Named contexts are sandboxed by default (separate scope)
       isolation = 'iframe';
     }
 
-    // Create new session with appropriate isolation
-    const session = rt.createSession({
+    // Create new execution context with appropriate isolation
+    const context = rt.createSession({
       language: 'javascript',
       isolation,
       id: name,
     });
 
-    sessions.set(name, session);
-    console.log(`[JS Runtime] Created session '${name}' with isolation: ${isolation}`);
-    return session;
+    contexts.set(name, context);
+    console.log(`[JS Runtime] Created context '${name}' with isolation: ${isolation}`);
+    return context;
   }
 
-  // Create default session eagerly
-  const defaultSession = getOrCreateSession('default');
+  // Create default context eagerly
+  const defaultContext = getOrCreateContext('default');
 
   // Languages supported by mrmd-js
   const supportedLanguages = {
@@ -379,8 +379,9 @@ function createJavaScriptRuntime(options = {}) {
     /** Execute code (non-streaming) */
     async execute(code, language, execOptions = {}) {
       const lang = supportedLanguages[language.toLowerCase()] || 'javascript';
-      const session = getOrCreateSession(execOptions.session);
-      const result = await session.execute(code, { language: lang });
+      const contextName = execOptions.context ?? execOptions.session;
+      const context = getOrCreateContext(contextName);
+      const result = await context.execute(code, { language: lang });
       return {
         success: result.success,
         stdout: result.stdout || '',
@@ -394,8 +395,9 @@ function createJavaScriptRuntime(options = {}) {
     /** Execute code with streaming output */
     async executeStreaming(code, language, onChunk, onStdinRequest, execOptions = {}) {
       const lang = supportedLanguages[language.toLowerCase()] || 'javascript';
-      const session = getOrCreateSession(execOptions.session);
-      const result = await session.execute(code, { language: lang });
+      const contextName = execOptions.context ?? execOptions.session;
+      const context = getOrCreateContext(contextName);
+      const result = await context.execute(code, { language: lang });
 
       // Handle different output types
       let output = result.stdout || '';
@@ -434,18 +436,18 @@ function createJavaScriptRuntime(options = {}) {
       };
     },
 
-    /** Reset a session (clear all variables) */
-    reset(sessionName) {
-      const session = sessions.get(sessionName || 'default');
-      if (session) {
-        session.reset();
+    /** Reset a context (clear all variables) */
+    reset(contextName) {
+      const context = contexts.get(contextName || 'default');
+      if (context) {
+        context.reset();
       }
     },
 
-    /** Reset all sessions */
+    /** Reset all contexts */
     resetAll() {
-      for (const session of sessions.values()) {
-        session.reset();
+      for (const context of contexts.values()) {
+        context.reset();
       }
     },
 
@@ -454,23 +456,32 @@ function createJavaScriptRuntime(options = {}) {
       return rt;
     },
 
-    /** Get a session by name (default if not specified) */
-    getSession(sessionName) {
-      return getOrCreateSession(sessionName);
+    /** Get a context by name (default if not specified) */
+    getContext(contextName) {
+      return getOrCreateContext(contextName);
+    },
+
+    /** List all context names */
+    listContexts() {
+      return Array.from(contexts.keys());
+    },
+
+    // Legacy aliases (kept for compatibility inside monorepo)
+    getSession(contextName) {
+      return getOrCreateContext(contextName);
     },
 
-    /** List all session names */
     listSessions() {
-      return Array.from(sessions.keys());
+      return Array.from(contexts.keys());
     },
 
-    /** Destroy the runtime and all sessions */
+    /** Destroy the runtime and all contexts */
     destroy() {
       rt.destroy();
     },
 
     // =========================================================================
-    // LSP Features (powered by mrmd-js session)
+    // LSP Features (powered by mrmd-js default context)
     // =========================================================================
 
     /**
@@ -482,7 +493,7 @@ function createJavaScriptRuntime(options = {}) {
      * @returns {{found: boolean, name?: string, type?: string, value?: string, signature?: string}|null}
      */
     hover(code, cursor) {
-      return defaultSession.hover(code, cursor);
+      return defaultContext.hover(code, cursor);
     },
 
     /**
@@ -494,7 +505,7 @@ function createJavaScriptRuntime(options = {}) {
      * @returns {{matches: Array, cursorStart: number, cursorEnd: number}}
      */
     complete(code, cursor) {
-      return defaultSession.complete(code, cursor);
+      return defaultContext.complete(code, cursor);
     },
 
     /**
@@ -506,18 +517,18 @@ function createJavaScriptRuntime(options = {}) {
      * @returns {Object|null}
      */
     inspect(code, cursor, options = {}) {
-      return defaultSession.inspect(code, cursor, options);
+      return defaultContext.inspect(code, cursor, options);
     },
 
     /**
-     * List all variables in a session namespace.
+     * List all variables in a context namespace.
      *
      * @param {Object} [filter]
-     * @param {string} [sessionName='default']
+     * @param {string} [contextName='default']
      * @returns {Array<{name: string, type: string, value: string, expandable?: boolean}>}
      */
-    listVariables(filter = {}, sessionName = 'default') {
-      return getOrCreateSession(sessionName).listVariables(filter);
+    listVariables(filter = {}, contextName = 'default') {
+      return getOrCreateContext(contextName).listVariables(filter);
     },
 
     /**
@@ -528,7 +539,7 @@ function createJavaScriptRuntime(options = {}) {
      * @returns {Object}
      */
     getVariable(name, options = {}) {
-      return defaultSession.getVariable(name, options);
+      return defaultContext.getVariable(name, options);
     },
 
     /**
@@ -538,7 +549,7 @@ function createJavaScriptRuntime(options = {}) {
      * @returns {{status: 'complete'|'incomplete'|'invalid'|'unknown', indent?: string}}
      */
     isComplete(code) {
-      return defaultSession.isComplete(code);
+      return defaultContext.isComplete(code);
     },
 
     /**
@@ -548,7 +559,7 @@ function createJavaScriptRuntime(options = {}) {
      * @returns {Promise<{formatted: string, changed: boolean}>}
      */
     format(code) {
-      return defaultSession.format(code);
+      return defaultContext.format(code);
     },
 
     /**
@@ -556,7 +567,7 @@ function createJavaScriptRuntime(options = {}) {
      * @returns {import('./runtime-lsp.js').RuntimeLSPProvider}
      */
     getLSPProvider() {
-      return adaptMrmdJsSession(defaultSession);
+      return adaptMrmdJsSession(defaultContext);
     },
   };
 }
@@ -731,6 +742,15 @@ const codeBlockStyles = EditorView.theme({
   '.cm-codeblock-fence::selection, .cm-codeblock-fence *::selection': {
     backgroundColor: 'var(--editor-selection, #264f78) !important',
   },
+  // Mobile: code blocks need to be larger and scroll horizontally
+  '@media (max-width: 768px)': {
+    '.cm-codeblock-line': {
+      fontSize: 'max(var(--code-font-size, 0.8em), 13px)',
+    },
+    '.cm-codeblock-fence': {
+      fontSize: '0.6em', // Slightly larger than desktop's 0.5em for visibility
+    },
+  },
 });
 // #endregion CODE_BLOCK_BACKGROUND
 
@@ -771,6 +791,50 @@ class Writer {
 }
 // #endregion WRITER
 
+// #region INITIAL_CURSOR
+/**
+ * Find the ideal initial cursor position for a markdown document.
+ *
+ * When opening a file, placing the cursor at position 0 shows raw frontmatter
+ * YAML which looks ugly. Instead, we find the first empty line after any
+ * frontmatter block — this causes the frontmatter to render as a nice widget
+ * and gives a clean first impression.
+ *
+ * @param {string} content - Document content
+ * @returns {number} Character position for the cursor
+ */
+function findInitialCursorPosition(content) {
+  if (!content) return 0;
+
+  const lines = content.split('\n');
+  let i = 0;
+
+  // Skip YAML frontmatter if present (--- ... ---)
+  if (lines[0]?.trim() === '---') {
+    i = 1;
+    while (i < lines.length && lines[i]?.trim() !== '---') {
+      i++;
+    }
+    if (i < lines.length) i++; // skip closing ---
+  }
+
+  // Find first empty line from current position
+  while (i < lines.length) {
+    if (lines[i]?.trim() === '') {
+      // Calculate character position (start of this empty line)
+      let pos = 0;
+      for (let j = 0; j < i; j++) {
+        pos += lines[j].length + 1; // +1 for \n
+      }
+      return pos;
+    }
+    i++;
+  }
+
+  return 0; // fallback to start
+}
+// #endregion INITIAL_CURSOR
+
 // #region CREATE
 /**
  * Create a standalone markdown editor
@@ -896,6 +960,11 @@ function create(target, options = {}) {
     '.cm-gutters': { display: 'none' },
     '.cm-activeLineGutter': { backgroundColor: 'transparent' },
     '&.cm-focused': { outline: 'none' },
+    // Mobile: slightly larger text, comfortable line-height
+    '@media (max-width: 768px)': {
+      '&': { fontSize: '17px' },
+      '.cm-scroller': { lineHeight: '1.7' },
+    },
   });
 
   // Inject CSS styles
@@ -2046,17 +2115,16 @@ function create(target, options = {}) {
      * Refresh variables from all MRP runtimes
      * Fetches current variable state and updates state.variables
      *
-     * @param {string} [sessionId] - Specific session to refresh (optional)
      * @returns {Promise<void>}
      */
-    async refreshVariables(sessionId) {
+    async refreshVariables() {
       for (const [name, runtime] of registry.runtimes) {
         // Check if runtime is an MRP client (has getVariables method)
         if (typeof runtime.getVariables === 'function') {
           try {
-            const result = await runtime.getVariables(sessionId);
+            const result = await runtime.getVariables();
             if (result && result.variables) {
-              const session = sessionId || 'default';
+              const session = 'default';
               const variables = {};
               for (const v of result.variables) {
                 variables[v.name] = {
@@ -2546,12 +2614,12 @@ function create(target, options = {}) {
 }
 // #endregion CREATE
 
-// #region SESSION
+// #region RUNTIME
 /**
- * Create an editor session via orchestrator.
+ * Create an editor runtime attachment via orchestrator.
  *
  * This is the simplest way to use mrmd with full features:
- * - Automatically creates session with orchestrator
+ * - Automatically creates/attaches runtime with orchestrator
  * - Connects to sync server
  * - Sets up Python runtime (shared or dedicated)
  * - Enables monitor mode for long-running executions
@@ -2562,28 +2630,28 @@ function create(target, options = {}) {
  * @param {string} options.doc - Document name (required)
  * @param {string} [options.python='shared'] - 'shared' or 'dedicated'
  * @param {Object} [options.editor] - Additional editor options
- * @returns {Promise<Object>} Editor instance with destroySession() method
+ * @returns {Promise<Object>} Editor instance with destroyRuntime() method
  *
  * @example
  * // Basic usage
- * const editor = await mrmd.session('http://localhost:8080', '#editor', {
+ * const editor = await mrmd.runtime('http://localhost:8080', '#editor', {
  *   doc: 'my-notebook',
  * });
  *
  * // With dedicated Python runtime
- * const editor = await mrmd.session('http://localhost:8080', '#editor', {
+ * const editor = await mrmd.runtime('http://localhost:8080', '#editor', {
  *   doc: 'my-notebook',
  *   python: 'dedicated',
  * });
  *
  * // Clean up when done
- * await editor.destroySession();
+ * await editor.destroyRuntime();
  */
-async function session(orchestratorUrl, target, options = {}) {
+async function runtime(orchestratorUrl, target, options = {}) {
   const { doc, python = 'shared', editor: editorOptions = {} } = options;
 
   if (!doc) {
-    throw new Error('mrmd.session: doc option is required');
+    throw new Error('mrmd.runtime: doc option is required');
   }
 
   // Normalize orchestrator URL
@@ -2592,24 +2660,33 @@ async function session(orchestratorUrl, target, options = {}) {
     baseUrl = baseUrl.slice(0, -1);
   }
 
-  // Create session with orchestrator
-  console.log(`[mrmd.session] Creating session for '${doc}' (python=${python})`);
+  // Create runtime attachment with orchestrator
+  console.log(`[mrmd.runtime] Creating runtime for '${doc}' (python=${python})`);
 
-  const response = await fetch(`${baseUrl}/api/sessions`, {
+  // Prefer /api/runtimes, fall back to /api/sessions for legacy orchestrators
+  let response = await fetch(`${baseUrl}/api/runtimes`, {
     method: 'POST',
     headers: { 'Content-Type': 'application/json' },
     body: JSON.stringify({ doc, python }),
   });
 
+  if (!response.ok && response.status === 404) {
+    response = await fetch(`${baseUrl}/api/sessions`, {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ doc, python }),
+    });
+  }
+
   if (!response.ok) {
     const error = await response.text();
-    throw new Error(`Failed to create session: ${error}`);
+    throw new Error(`Failed to create runtime attachment: ${error}`);
   }
 
   const sessionInfo = await response.json();
-  console.log('[mrmd.session] Session created:', sessionInfo);
+  console.log('[mrmd.runtime] Runtime created:', sessionInfo);
 
-  // Extract URLs from session info
+  // Extract URLs from response
   const syncUrl = sessionInfo.sync;
   const runtimeUrl = sessionInfo.runtimes?.python?.url;
 
@@ -2634,17 +2711,16 @@ async function session(orchestratorUrl, target, options = {}) {
       ydoc: editor.ydoc,
       runtimeUrl,
       awareness: editor.awareness,
-      session: doc,
     });
   }
 
-  // Store session info on editor
+  // Store runtime info on editor
   editor._sessionInfo = sessionInfo;
   editor._orchestratorUrl = baseUrl;
 
-  // Add destroySession method
-  editor.destroySession = async function() {
-    console.log(`[mrmd.session] Destroying session for '${doc}'`);
+  // Add destroyRuntime method
+  editor.destroyRuntime = async function() {
+    console.log(`[mrmd.runtime] Destroying runtime for '${doc}'`);
 
     // Disconnect from sync
     if (editor.disconnect) {
@@ -2653,28 +2729,33 @@ async function session(orchestratorUrl, target, options = {}) {
 
     // Call orchestrator to clean up
     try {
-      const resp = await fetch(`${baseUrl}/api/sessions/${encodeURIComponent(doc)}`, {
+      let resp = await fetch(`${baseUrl}/api/runtimes/${encodeURIComponent(doc)}`, {
         method: 'DELETE',
       });
+      if (!resp.ok && resp.status === 404) {
+        resp = await fetch(`${baseUrl}/api/sessions/${encodeURIComponent(doc)}`, {
+          method: 'DELETE',
+        });
+      }
       if (!resp.ok) {
-        console.warn(`[mrmd.session] Failed to destroy session: ${resp.statusText}`);
+        console.warn(`[mrmd.runtime] Failed to destroy runtime: ${resp.statusText}`);
       }
     } catch (err) {
-      console.warn(`[mrmd.session] Failed to destroy session:`, err);
+      console.warn(`[mrmd.runtime] Failed to destroy runtime:`, err);
     }
 
     // Destroy editor
     editor.destroy();
   };
 
-  // Add method to get session info
-  editor.getSessionInfo = function() {
+  // Add method to get runtime info
+  editor.getRuntimeInfo = function() {
     return this._sessionInfo;
   };
 
   return editor;
 }
-// #endregion SESSION
+// #endregion RUNTIME
 
 // #region DRIVE
 /**
@@ -3038,7 +3119,8 @@ const mrmd = {
   version: VERSION,
   create,
   drive,
-  session,
+  runtime,
+  findInitialCursorPosition,
   yjs,
   codemirror,
   terminal,
@@ -3096,7 +3178,8 @@ export default mrmd;
 export {
   create,
   drive,
-  session,
+  runtime,
+  findInitialCursorPosition,
   yjs,
   codemirror,
   terminal,
@@ -3232,4 +3315,8 @@ export {
 
 // Re-export shell components for direct imports
 export const { createStudio, OrchestratorClient, Drive, createDrive, ShellStateManager, injectShellStyles } = shellModule;
+
+// Document language detection and frontmatter updater
+export { getDocumentLanguages, getLanguageDisplay, isExecutableLanguage } from './document-languages.js';
+export { parseFrontmatter, updateFrontmatterSession, readFrontmatterSession, getEffectiveSessionConfig } from './frontmatter-updater.js';
 // #endregion EXPORTS

package/src/markdown/renderer.js

@@ -121,6 +121,33 @@ function extractWikiLinks(text) {
   return results;
 }
 
+/**
+ * Find YAML frontmatter at the top of the document (--- ... ---).
+ *
+ * We use this to suppress markdown rendering inside frontmatter since the
+ * opening/closing `---` lines are parsed as HorizontalRule nodes by markdown.
+ */
+function findFrontmatterRange(doc) {
+  if (doc.lines < 2) return null;
+
+  const firstLine = doc.line(1);
+  if (firstLine.text.trim() !== '---') return null;
+
+  for (let i = 2; i <= doc.lines; i++) {
+    const line = doc.line(i);
+    if (line.text.trim() === '---') {
+      return {
+        from: firstLine.from,
+        to: line.to,
+        startLine: 1,
+        endLine: i,
+      };
+    }
+  }
+
+  return null;
+}
+
 /**
  * BlockImageWidget wrapper that caches its rendered height for stable layout.
  */
@@ -223,6 +250,7 @@ function buildDecorations(view) {
   const doc = view.state.doc;
   const cursorPos = view.state.selection.main.head;
   const cursorLine = doc.lineAt(cursorPos).number;
+  const frontmatterRange = findFrontmatterRange(doc);
 
   // Get asset resolver from facet (may be null)
   const assetResolver = view.state.facet(assetResolverFacet);
@@ -249,6 +277,21 @@ function buildDecorations(view) {
     to: view.viewport.to,
     enter: (node) => {
       const lineNum = doc.lineAt(node.from).number;
+
+      // Never apply markdown rendering/styling inside YAML frontmatter.
+      // Frontmatter is rendered separately by block-decorations.
+      // Use line-based start detection so we still skip nodes that may extend
+      // past the line boundary (e.g., HorizontalRule tokens including newline).
+      if (frontmatterRange && node.name !== 'Document') {
+        const nodeStartLine = doc.lineAt(node.from).number;
+        if (
+          nodeStartLine >= frontmatterRange.startLine &&
+          nodeStartLine <= frontmatterRange.endLine
+        ) {
+          return false;
+        }
+      }
+
       const isActiveLine = lineNum === cursorLine;
 
       // Marker class: hidden on blur, muted on focus
@@ -735,6 +778,9 @@ function buildDecorations(view) {
     const line = doc.line(i);
     const isActiveLine = i === cursorLine;
 
+    // Skip frontmatter lines
+    if (frontmatterRange && i >= frontmatterRange.startLine && i <= frontmatterRange.endLine) continue;
+
     // Skip lines inside code blocks
     if (codeBlockLines.has(i)) continue;
 
@@ -770,6 +816,9 @@ function buildDecorations(view) {
     const line = doc.line(i);
     const isActiveLine = i === cursorLine;
 
+    // Skip frontmatter lines
+    if (frontmatterRange && i >= frontmatterRange.startLine && i <= frontmatterRange.endLine) continue;
+
     // Skip lines inside code blocks (using syntax tree detection)
     if (codeBlockLines.has(i)) continue;
 
@@ -810,12 +859,12 @@ function buildDecorations(view) {
     const line = doc.line(i);
     const isActiveLine = i === cursorLine;
 
+    // Skip frontmatter lines
+    if (frontmatterRange && i >= frontmatterRange.startLine && i <= frontmatterRange.endLine) continue;
+
     // Skip lines inside code blocks (using syntax tree detection)
     if (codeBlockLines.has(i)) continue;
 
-    // Skip frontmatter (YAML between ---)
-    // This is a simple check - a full solution would track state
-
     const htmlElements = extractHtmlElements(line.text);
 
     for (const el of htmlElements) {