python cells

Author: mbostock

package.json

@@ -51,6 +51,7 @@
     "@lezer/html": "^1.3.10",
     "@lezer/javascript": "^1.5.1",
     "@lezer/markdown": "^1.4.3",
+    "@lezer/python": "^1.1.18",
     "@observablehq/inspector": "^5.0.1",
     "@observablehq/parser": "^6.1.0",
     "@observablehq/runtime": "^6.0.0",

src/interpreters/index.ts

@@ -13,3 +13,14 @@ export async function getInterpreterCachePath(
   const cacheName = `${await nameHash(interpreter)}-${await stringHash(input)}${getInterpreterExtension(format)}`; // TODO avoid conflict with database cache?
   return join(sourceDir, ".observable", "cache", cacheName);
 }
+
+export function getInterpreterCommand(interpreter: string): [command: string, args: string[]] {
+  switch (interpreter) {
+    case "node":
+      return ["node", ["--input-type=module", "--permission", "--allow-fs-read=."]];
+    case "python":
+      return ["python3", []];
+    default:
+      throw new Error(`unknown interpreter: ${interpreter}`);
+  }
+}

src/javascript/template.ts

@@ -90,7 +90,7 @@ export function transpileTemplate(input: string | Cell, tag = "", raw = false):
   if (!input) return input;
   const source = new Sourcemap(input);
   let node: Node;
-  if (cell && isInterpreter(cell)) {
+  if (cell && isInterpreter(cell.mode)) {
     node = {type: "Literal", start: 0, end: input.length};
     escapeBacktick(source, node);
     escapeBackslash(source, node);
@@ -115,7 +115,7 @@ function getTag(cell: Cell): string {
     ? "tex.block"
     : cell.mode === "sql"
       ? getSqlTag(cell)
-      : isInterpreter(cell)
+      : isInterpreter(cell.mode)
         ? getInterpreterTag(cell)
         : cell.mode;
 }
@@ -135,7 +135,7 @@ function getInterpreterTag(cell: Cell): string {
 function getSuffix(cell: Cell): string {
   return cell.mode === "sql" && !cell.hidden
     ? ".then(Inputs.table)"
-    : isInterpreter(cell)
+    : isInterpreter(cell.mode)
       ? getInterpreterSuffix(cell)
       : "";
 }

src/lib/interpreters.ts

@@ -1,7 +1,7 @@
 import type {Cell} from "./notebook.js";
 
-export function isInterpreter(cell: Cell): boolean {
-  return cell.mode === "node";
+export function isInterpreter(mode: Cell["mode"]): boolean {
+  return mode === "node" || mode === "python";
 }
 
 export function getInterpreterExtension(format: Cell["format"]): string {

src/lib/notebook.ts

@@ -1,3 +1,5 @@
+import {isInterpreter} from "./interpreters.js";
+
 export type NotebookTheme =
   | "air"
   | "coffee"
@@ -37,7 +39,7 @@ export interface CellSpec {
   /** the committed cell value; defaults to empty */
   value?: string;
   /** the mode; affects how the value is evaluated; defaults to js */
-  mode?: "js" | "ojs" | "md" | "html" | "tex" | "dot" | "sql" | "node";
+  mode?: "js" | "ojs" | "md" | "html" | "tex" | "dot" | "sql" | "node" | "python";
   /** if true, the editor will stay open when not focused; defaults to false */
   pinned?: boolean;
   /** if true, implicit display will be suppressed; defaults to false */
@@ -94,7 +96,7 @@ export function toCell({
   pinned = defaultPinned(mode),
   hidden = false,
   output,
-  format = mode === "node" ? "buffer" : undefined,
+  format = isInterpreter(mode) ? "buffer" : undefined,
   database = mode === "sql" ? "var:db" : undefined,
   since
 }: CellSpec): Cell {
@@ -105,7 +107,7 @@ export function toCell({
     pinned,
     hidden,
     output,
-    format: mode === "node" ? format : undefined,
+    format: isInterpreter(mode) ? format : undefined,
     database: mode === "sql" ? database : undefined,
     since: since !== undefined ? asDate(since) : undefined
   };
@@ -116,5 +118,5 @@ function asDate(date: Date | string | number): Date {
 }
 
 export function defaultPinned(mode: Cell["mode"]): boolean {
-  return mode === "js" || mode === "sql" || mode === "node" || mode === "ojs";
+  return mode === "js" || mode === "sql" || isInterpreter(mode) || mode === "ojs";
 }

src/lib/serialize.ts

@@ -69,6 +69,8 @@ function serializeMode(mode: Cell["mode"]): string {
       return "text/vnd.graphviz";
     case "node":
       return "application/vnd.node.javascript";
+    case "python":
+      return "text/x-python";
     case "ojs":
       return "application/vnd.observable.javascript";
     default:
@@ -90,6 +92,8 @@ function deserializeMode(mode: string | null): Cell["mode"] {
       return "dot";
     case "application/vnd.node.javascript":
       return "node";
+    case "text/x-python":
+      return "python";
     case "application/vnd.observable.javascript":
       return "ojs";
     default:

src/runtime/stdlib/highlight.ts

@@ -57,14 +57,14 @@ async function getParser(language: string): Promise<Parser | undefined> {
     case "js":
     case "ts":
     case "jsx":
-    case "node":
       return (await import("@lezer/javascript")).parser.configure({dialect: language});
+    case "py":
+      return (await import("@lezer/python")).parser;
     case "html":
       return (await import("@lezer/html")).parser;
     case "css":
       return (await import("@lezer/css")).parser;
     case "md":
-    case "markdown":
       return (await import("@lezer/markdown")).parser;
   }
 }
@@ -75,10 +75,15 @@ function getLanguage(code: HTMLElement): string | undefined {
     ?.slice("language-".length)
     ?.toLowerCase();
   switch (language) {
+    case "node":
     case "javascript":
       return "js";
     case "typescript":
       return "ts";
+    case "python":
+      return "py";
+    case "markdown":
+      return "md";
   }
   return language;
 }

src/vite/observable.ts

@@ -8,8 +8,8 @@ import type {TemplateLiteral} from "acorn";
 import {JSDOM} from "jsdom";
 import type {PluginOption, IndexHtmlTransformContext} from "vite";
 import {getQueryCachePath} from "../databases/index.js";
-import {getInterpreterCachePath} from "../interpreters/index.js";
-import {getInterpreterMethod} from "../lib/interpreters.js";
+import {getInterpreterCachePath, getInterpreterCommand} from "../interpreters/index.js";
+import {getInterpreterMethod, isInterpreter} from "../lib/interpreters.js";
 import type {Cell, Notebook} from "../lib/notebook.js";
 import {deserialize} from "../lib/serialize.js";
 import {Sourcemap} from "../javascript/sourcemap.js";
@@ -130,14 +130,14 @@ export function observable({
               cell.mode = "js";
               cell.value = `FileAttachment(${JSON.stringify(relative(dir, cachePath))}).json().then(DatabaseClient.revive)${hidden ? "" : `.then(Inputs.table)${cell.output ? ".then(view)" : ""}`}`;
             }
-          } else if (mode === "node") {
+          } else if (isInterpreter(mode)) {
             const {filename: sourcePath} = context;
             const sourceDir = dirname(sourcePath);
             const cachePath = await getInterpreterCachePath(sourcePath, mode, format, value);
             if (!existsSync(cachePath)) {
               await mkdir(dirname(cachePath), {recursive: true});
-              const args = ["--input-type=module", "--permission", "--allow-fs-read=."];
-              const child = spawn("node", args, {cwd: sourceDir});
+              const [command, args] = getInterpreterCommand(mode);
+              const child = spawn(command, args, {cwd: sourceDir});
               child.stdin.end(value);
               child.stderr.pipe(process.stderr);
               child.stdout.pipe(createWriteStream(cachePath));

yarn.lock

@@ -1303,6 +1303,15 @@
     "@lezer/common" "^1.0.0"
     "@lezer/highlight" "^1.0.0"
 
+"@lezer/python@^1.1.18":
+  version "1.1.18"
+  resolved "https://registry.yarnpkg.com/@lezer/python/-/python-1.1.18.tgz#fa02fbf492741c82dc2dc98a0a042bd0d4d7f1d3"
+  integrity sha512-31FiUrU7z9+d/ElGQLJFXl+dKOdx0jALlP3KEOsGTex8mvj+SoE1FgItcHWK/axkxCHGUSpqIHt6JAWfWu9Rhg==
+  dependencies:
+    "@lezer/common" "^1.2.0"
+    "@lezer/highlight" "^1.0.0"
+    "@lezer/lr" "^1.0.0"
+
 "@nodelib/[email protected]":
   version "2.1.5"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5"