pyobservablejs 0.0.0rc1__tar.gz

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. pyobservablejs-0.0.0rc1/.gitignore +11 -0
  2. pyobservablejs-0.0.0rc1/LICENSE +21 -0
  3. pyobservablejs-0.0.0rc1/PKG-INFO +179 -0
  4. pyobservablejs-0.0.0rc1/README.md +154 -0
  5. pyobservablejs-0.0.0rc1/js/build.mjs +22 -0
  6. pyobservablejs-0.0.0rc1/js/css.d.ts +1 -0
  7. pyobservablejs-0.0.0rc1/js/graph.test.ts +121 -0
  8. pyobservablejs-0.0.0rc1/js/highlight.test.ts +18 -0
  9. pyobservablejs-0.0.0rc1/js/model/types.ts +31 -0
  10. pyobservablejs-0.0.0rc1/js/model/values.ts +21 -0
  11. pyobservablejs-0.0.0rc1/js/observable/graph.ts +89 -0
  12. pyobservablejs-0.0.0rc1/js/observable/types.ts +28 -0
  13. pyobservablejs-0.0.0rc1/js/runtime/attachments.ts +45 -0
  14. pyobservablejs-0.0.0rc1/js/runtime/definition.ts +48 -0
  15. pyobservablejs-0.0.0rc1/js/runtime/index.ts +72 -0
  16. pyobservablejs-0.0.0rc1/js/runtime/markdown.test.ts +64 -0
  17. pyobservablejs-0.0.0rc1/js/runtime/markdown.ts +130 -0
  18. pyobservablejs-0.0.0rc1/js/runtime/module-imports.ts +49 -0
  19. pyobservablejs-0.0.0rc1/js/runtime/types.ts +31 -0
  20. pyobservablejs-0.0.0rc1/js/runtime/view.ts +122 -0
  21. pyobservablejs-0.0.0rc1/js/runtime/wire.ts +165 -0
  22. pyobservablejs-0.0.0rc1/js/widget/abort.ts +38 -0
  23. pyobservablejs-0.0.0rc1/js/widget/cell-registry.ts +168 -0
  24. pyobservablejs-0.0.0rc1/js/widget/cell-renderer.ts +120 -0
  25. pyobservablejs-0.0.0rc1/js/widget/cell-value-sync.ts +156 -0
  26. pyobservablejs-0.0.0rc1/js/widget/composed-cells.ts +76 -0
  27. pyobservablejs-0.0.0rc1/js/widget/composition-host.ts +135 -0
  28. pyobservablejs-0.0.0rc1/js/widget/dom-contract.ts +41 -0
  29. pyobservablejs-0.0.0rc1/js/widget/dom.ts +51 -0
  30. pyobservablejs-0.0.0rc1/js/widget/highlight.ts +166 -0
  31. pyobservablejs-0.0.0rc1/js/widget/index.ts +35 -0
  32. pyobservablejs-0.0.0rc1/js/widget/notebook-model.ts +51 -0
  33. pyobservablejs-0.0.0rc1/js/widget/notebook-renderer.ts +134 -0
  34. pyobservablejs-0.0.0rc1/js/widget/notebook-value-sync.ts +84 -0
  35. pyobservablejs-0.0.0rc1/js/widget/runtime-variables-sync.ts +133 -0
  36. pyobservablejs-0.0.0rc1/js/widget/standalone-cell.ts +89 -0
  37. pyobservablejs-0.0.0rc1/js/widget/standalone-dependencies.ts +174 -0
  38. pyobservablejs-0.0.0rc1/js/widget/standalone-invalidation.ts +82 -0
  39. pyobservablejs-0.0.0rc1/js/widget/standalone-resolution.ts +131 -0
  40. pyobservablejs-0.0.0rc1/js/widget/styles.css +124 -0
  41. pyobservablejs-0.0.0rc1/js/widget/types.ts +49 -0
  42. pyobservablejs-0.0.0rc1/js/widget/view-state.ts +106 -0
  43. pyobservablejs-0.0.0rc1/js/widget-composition.test.ts +229 -0
  44. pyobservablejs-0.0.0rc1/js/widget-dom-test-utils.ts +230 -0
  45. pyobservablejs-0.0.0rc1/js/widget-markdown.test.ts +318 -0
  46. pyobservablejs-0.0.0rc1/js/widget-standalone-sync.test.ts +264 -0
  47. pyobservablejs-0.0.0rc1/js/widget-standalone.test.ts +906 -0
  48. pyobservablejs-0.0.0rc1/js/widget-test-utils.ts +148 -0
  49. pyobservablejs-0.0.0rc1/js/widget-variables-sync.test.ts +567 -0
  50. pyobservablejs-0.0.0rc1/js/widget.test.ts +310 -0
  51. pyobservablejs-0.0.0rc1/js/wire.test.ts +37 -0
  52. pyobservablejs-0.0.0rc1/package.json +36 -0
  53. pyobservablejs-0.0.0rc1/pnpm-lock.yaml +2983 -0
  54. pyobservablejs-0.0.0rc1/pnpm-workspace.yaml +2 -0
  55. pyobservablejs-0.0.0rc1/pyproject.toml +61 -0
  56. pyobservablejs-0.0.0rc1/src/pyobservablejs/__init__.py +21 -0
  57. pyobservablejs-0.0.0rc1/src/pyobservablejs/_files.py +556 -0
  58. pyobservablejs-0.0.0rc1/src/pyobservablejs/_graph.py +173 -0
  59. pyobservablejs-0.0.0rc1/src/pyobservablejs/_notebook.py +910 -0
  60. pyobservablejs-0.0.0rc1/src/pyobservablejs/_observable.py +173 -0
  61. pyobservablejs-0.0.0rc1/src/pyobservablejs/_serialize.py +72 -0
  62. pyobservablejs-0.0.0rc1/src/pyobservablejs/_variables.py +194 -0
  63. pyobservablejs-0.0.0rc1/src/pyobservablejs/py.typed +1 -0
  64. pyobservablejs-0.0.0rc1/src/pyobservablejs/static/widget.css +1 -0
  65. pyobservablejs-0.0.0rc1/src/pyobservablejs/static/widget.js +665 -0
@@ -0,0 +1,11 @@
1
+ node_modules
2
+ .venv
3
+ dist
4
+ docs/_build
5
+ .DS_Store
6
+
7
+ # Python
8
+ __pycache__
9
+ .ipynb_checkpoints
10
+
11
+ src/pyobservablejs/static
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2026 Peter Ferenc Gyarmati
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
@@ -0,0 +1,179 @@
1
+ Metadata-Version: 2.4
2
+ Name: pyobservablejs
3
+ Version: 0.0.0rc1
4
+ Summary: Observable JavaScript notebooks as reusable Python widgets
5
+ Project-URL: Homepage, https://github.com/peterg-y/pyobservablejs
6
+ Project-URL: Source, https://github.com/peterg-y/pyobservablejs
7
+ Project-URL: Issues, https://github.com/peterg-y/pyobservablejs/issues
8
+ Author-email: Peter Ferenc Gyarmati <dev.petergy@gmail.com>
9
+ Maintainer-email: Peter Ferenc Gyarmati <dev.petergy@gmail.com>
10
+ License-Expression: MIT
11
+ License-File: LICENSE
12
+ Keywords: anywidget,jupyter,marimo,notebooks,observable,visualization
13
+ Classifier: License :: OSI Approved :: MIT License
14
+ Classifier: Programming Language :: Python :: 3
15
+ Classifier: Programming Language :: Python :: 3 :: Only
16
+ Classifier: Programming Language :: Python :: 3.10
17
+ Classifier: Programming Language :: Python :: 3.11
18
+ Classifier: Programming Language :: Python :: 3.12
19
+ Classifier: Programming Language :: Python :: 3.13
20
+ Classifier: Programming Language :: Python :: 3.14
21
+ Requires-Python: <3.15,>=3.10
22
+ Requires-Dist: anywidget>=0.11.0
23
+ Requires-Dist: traitlets>=5
24
+ Description-Content-Type: text/markdown
25
+
26
+ # pyobservablejs
27
+
28
+ Observable JavaScript notebooks as Python widgets.
29
+
30
+ `pyobservablejs` renders Observable JavaScript cells from Python and runs them with
31
+ Observable Notebook Kit in the browser. Python owns the notebook model, synced
32
+ OJS variables, and cell widgets. TypeScript owns Notebook Kit evaluation,
33
+ rendering, and runtime metadata.
34
+
35
+ ```python
36
+ import pyobservablejs as obs
37
+
38
+ rows = [
39
+ {"letter": "A", "frequency": 0.0812},
40
+ {"letter": "B", "frequency": 0.0149},
41
+ {"letter": "C", "frequency": 0.0271},
42
+ {"letter": "D", "frequency": 0.0432},
43
+ {"letter": "E", "frequency": 0.1202},
44
+ ]
45
+
46
+ obs.Notebook(
47
+ obs.md("# Letter frequencies"),
48
+ obs.ojs("""
49
+ Plot.plot({
50
+ height: 260,
51
+ marginLeft: 48,
52
+ y: {grid: true, label: "frequency"},
53
+ marks: [
54
+ Plot.ruleY([floor]),
55
+ Plot.barY(rows, {x: "letter", y: "frequency", tip: true})
56
+ ]
57
+ })
58
+ """),
59
+ variables={"rows": rows, "floor": 0.04},
60
+ )
61
+ ```
62
+
63
+ ## Install
64
+
65
+ ```sh
66
+ pip install pyobservablejs
67
+ ```
68
+
69
+ or:
70
+
71
+ ```sh
72
+ uv add pyobservablejs
73
+ ```
74
+
75
+ `pyobservablejs` supports Python 3.10 through 3.14.
76
+
77
+ ## Notebook Model
78
+
79
+ - `obs.Notebook(...)` builds a Notebook Kit notebook from Python-authored cells.
80
+ - `variables={...}` sets OJS variables. A matching notebook variable is overridden.
81
+ - `notebook.update_variables(...)` pushes Python-side changes into the live OJS
82
+ runtime.
83
+ - `name="..."` gives Python a stable name for a cell.
84
+ - `notebook.values` and `notebook.cell("name").value` read browser-synchronized
85
+ outputs after rendering.
86
+ - `notebook.graph` exposes Notebook Kit-derived cell definitions, references, and
87
+ dependency edges.
88
+
89
+ Cell helpers keep the source mode explicit:
90
+
91
+ | Helper | Source mode |
92
+ | --------------- | --------------------- |
93
+ | `obs.ojs(...)` | Observable JavaScript |
94
+ | `obs.js(...)` | ES module JavaScript |
95
+ | `obs.md(...)` | Markdown |
96
+ | `obs.html(...)` | HTML |
97
+
98
+ ```python
99
+ notebook = obs.Notebook(
100
+ obs.md("# Inputs"),
101
+ obs.ojs('viewof gain = Inputs.range([0, 11], {value: 5})', name="gain"),
102
+ obs.ojs("double = gain * 2", name="double"),
103
+ )
104
+
105
+ notebook.cell("gain")
106
+ ```
107
+
108
+ After the notebook or cell widget has rendered in the browser, read the synced
109
+ value from a later Python cell:
110
+
111
+ ```python
112
+ notebook.value("double")
113
+ ```
114
+
115
+ ## Source Notebooks
116
+
117
+ Load Notebook Kit HTML from a string:
118
+
119
+ ```python
120
+ from pathlib import Path
121
+
122
+ path = Path("chart.html")
123
+ notebook = obs.Notebook.from_html(
124
+ path.read_text(encoding="utf-8"),
125
+ base_path=path.parent,
126
+ )
127
+ ```
128
+
129
+ Local `FileAttachment(...)` references and relative JavaScript imports are
130
+ embedded by default so the widget can move between notebook frontends.
131
+
132
+ Load a public ObservableHQ notebook by URL, slug, or id:
133
+
134
+ ```python
135
+ notebook = obs.Notebook.from_observablehq("https://observablehq.com/@mbostock/saving-svg")
136
+ ```
137
+
138
+ Remote `FileAttachment(...)` entries are registered as URL-backed attachments,
139
+ so Plot notebooks and examples with uploaded files can render in the widget.
140
+ Pass `variables={...}` to override variables in a loaded notebook with Python values.
141
+
142
+ ## Documentation
143
+
144
+ - [Quickstart](docs/quickstart.md)
145
+ - [Examples](docs/examples.md)
146
+ - [Tutorials](docs/tutorials/index.md)
147
+ - [Concepts](docs/concepts.md)
148
+ - [Architecture](docs/architecture.md)
149
+ - [Widget composition](docs/composition.md)
150
+ - [API reference](docs/api.md)
151
+ - [Development](docs/development.md)
152
+
153
+ ## Built On
154
+
155
+ - [anywidget](https://anywidget.dev) and traitlets for widget composition and
156
+ synced state
157
+ - [Observable Notebook Kit](https://github.com/observablehq/notebook-kit) and
158
+ [@observablehq/runtime](https://github.com/observablehq/runtime) for cell
159
+ transpilation and browser execution
160
+ - [Shiki](https://shiki.style/) for pinned source highlighting
161
+
162
+ ## Contributing
163
+
164
+ See [CONTRIBUTING.md](CONTRIBUTING.md) for local setup, workbench notebooks,
165
+ and the check commands used before sending changes for review.
166
+
167
+ ## Acknowledgements
168
+
169
+ `pyobservablejs` builds on [Observable Notebook Kit](https://github.com/observablehq/notebook-kit)
170
+ and [@observablehq/runtime](https://github.com/observablehq/runtime).
171
+ [`pyobsplot`](https://github.com/juba/pyobsplot) informed the Python-to-OJS
172
+ variable API.
173
+
174
+ Thanks to [@manzt](https://github.com/manzt) (Trevor Manz) for the composable
175
+ anywidgets demo that helped shape the widget design.
176
+
177
+ ## License
178
+
179
+ MIT
@@ -0,0 +1,154 @@
1
+ # pyobservablejs
2
+
3
+ Observable JavaScript notebooks as Python widgets.
4
+
5
+ `pyobservablejs` renders Observable JavaScript cells from Python and runs them with
6
+ Observable Notebook Kit in the browser. Python owns the notebook model, synced
7
+ OJS variables, and cell widgets. TypeScript owns Notebook Kit evaluation,
8
+ rendering, and runtime metadata.
9
+
10
+ ```python
11
+ import pyobservablejs as obs
12
+
13
+ rows = [
14
+ {"letter": "A", "frequency": 0.0812},
15
+ {"letter": "B", "frequency": 0.0149},
16
+ {"letter": "C", "frequency": 0.0271},
17
+ {"letter": "D", "frequency": 0.0432},
18
+ {"letter": "E", "frequency": 0.1202},
19
+ ]
20
+
21
+ obs.Notebook(
22
+ obs.md("# Letter frequencies"),
23
+ obs.ojs("""
24
+ Plot.plot({
25
+ height: 260,
26
+ marginLeft: 48,
27
+ y: {grid: true, label: "frequency"},
28
+ marks: [
29
+ Plot.ruleY([floor]),
30
+ Plot.barY(rows, {x: "letter", y: "frequency", tip: true})
31
+ ]
32
+ })
33
+ """),
34
+ variables={"rows": rows, "floor": 0.04},
35
+ )
36
+ ```
37
+
38
+ ## Install
39
+
40
+ ```sh
41
+ pip install pyobservablejs
42
+ ```
43
+
44
+ or:
45
+
46
+ ```sh
47
+ uv add pyobservablejs
48
+ ```
49
+
50
+ `pyobservablejs` supports Python 3.10 through 3.14.
51
+
52
+ ## Notebook Model
53
+
54
+ - `obs.Notebook(...)` builds a Notebook Kit notebook from Python-authored cells.
55
+ - `variables={...}` sets OJS variables. A matching notebook variable is overridden.
56
+ - `notebook.update_variables(...)` pushes Python-side changes into the live OJS
57
+ runtime.
58
+ - `name="..."` gives Python a stable name for a cell.
59
+ - `notebook.values` and `notebook.cell("name").value` read browser-synchronized
60
+ outputs after rendering.
61
+ - `notebook.graph` exposes Notebook Kit-derived cell definitions, references, and
62
+ dependency edges.
63
+
64
+ Cell helpers keep the source mode explicit:
65
+
66
+ | Helper | Source mode |
67
+ | --------------- | --------------------- |
68
+ | `obs.ojs(...)` | Observable JavaScript |
69
+ | `obs.js(...)` | ES module JavaScript |
70
+ | `obs.md(...)` | Markdown |
71
+ | `obs.html(...)` | HTML |
72
+
73
+ ```python
74
+ notebook = obs.Notebook(
75
+ obs.md("# Inputs"),
76
+ obs.ojs('viewof gain = Inputs.range([0, 11], {value: 5})', name="gain"),
77
+ obs.ojs("double = gain * 2", name="double"),
78
+ )
79
+
80
+ notebook.cell("gain")
81
+ ```
82
+
83
+ After the notebook or cell widget has rendered in the browser, read the synced
84
+ value from a later Python cell:
85
+
86
+ ```python
87
+ notebook.value("double")
88
+ ```
89
+
90
+ ## Source Notebooks
91
+
92
+ Load Notebook Kit HTML from a string:
93
+
94
+ ```python
95
+ from pathlib import Path
96
+
97
+ path = Path("chart.html")
98
+ notebook = obs.Notebook.from_html(
99
+ path.read_text(encoding="utf-8"),
100
+ base_path=path.parent,
101
+ )
102
+ ```
103
+
104
+ Local `FileAttachment(...)` references and relative JavaScript imports are
105
+ embedded by default so the widget can move between notebook frontends.
106
+
107
+ Load a public ObservableHQ notebook by URL, slug, or id:
108
+
109
+ ```python
110
+ notebook = obs.Notebook.from_observablehq("https://observablehq.com/@mbostock/saving-svg")
111
+ ```
112
+
113
+ Remote `FileAttachment(...)` entries are registered as URL-backed attachments,
114
+ so Plot notebooks and examples with uploaded files can render in the widget.
115
+ Pass `variables={...}` to override variables in a loaded notebook with Python values.
116
+
117
+ ## Documentation
118
+
119
+ - [Quickstart](docs/quickstart.md)
120
+ - [Examples](docs/examples.md)
121
+ - [Tutorials](docs/tutorials/index.md)
122
+ - [Concepts](docs/concepts.md)
123
+ - [Architecture](docs/architecture.md)
124
+ - [Widget composition](docs/composition.md)
125
+ - [API reference](docs/api.md)
126
+ - [Development](docs/development.md)
127
+
128
+ ## Built On
129
+
130
+ - [anywidget](https://anywidget.dev) and traitlets for widget composition and
131
+ synced state
132
+ - [Observable Notebook Kit](https://github.com/observablehq/notebook-kit) and
133
+ [@observablehq/runtime](https://github.com/observablehq/runtime) for cell
134
+ transpilation and browser execution
135
+ - [Shiki](https://shiki.style/) for pinned source highlighting
136
+
137
+ ## Contributing
138
+
139
+ See [CONTRIBUTING.md](CONTRIBUTING.md) for local setup, workbench notebooks,
140
+ and the check commands used before sending changes for review.
141
+
142
+ ## Acknowledgements
143
+
144
+ `pyobservablejs` builds on [Observable Notebook Kit](https://github.com/observablehq/notebook-kit)
145
+ and [@observablehq/runtime](https://github.com/observablehq/runtime).
146
+ [`pyobsplot`](https://github.com/juba/pyobsplot) informed the Python-to-OJS
147
+ variable API.
148
+
149
+ Thanks to [@manzt](https://github.com/manzt) (Trevor Manz) for the composable
150
+ anywidgets demo that helped shape the widget design.
151
+
152
+ ## License
153
+
154
+ MIT
@@ -0,0 +1,22 @@
1
+ import * as esbuild from "esbuild";
2
+
3
+ const args = new Set(process.argv.slice(2));
4
+
5
+ const options = {
6
+ assetNames: "widget",
7
+ bundle: true,
8
+ entryNames: "widget",
9
+ entryPoints: ["js/widget/index.ts"],
10
+ format: "esm",
11
+ minify: true,
12
+ outdir: "src/pyobservablejs/static",
13
+ sourcemap: args.has("--sourcemap=inline") ? "inline" : false,
14
+ };
15
+
16
+ if (args.has("--watch")) {
17
+ const context = await esbuild.context(options);
18
+ await context.watch();
19
+ console.log("Watching widget sources...");
20
+ } else {
21
+ await esbuild.build(options);
22
+ }
@@ -0,0 +1 @@
1
+ declare module "*.css";
@@ -0,0 +1,121 @@
1
+ // @vitest-environment jsdom
2
+
3
+ import { toNotebook } from "@observablehq/notebook-kit";
4
+ import { describe, expect, test } from "vitest";
5
+ import { createNotebookGraph } from "./observable/graph";
6
+
7
+ describe("notebook graph metadata", () => {
8
+ test("uses Notebook Kit transpile metadata for references, outputs, and edges", () => {
9
+ const notebook = toNotebook({
10
+ cells: [
11
+ { id: 1, mode: "ojs", value: "a = 1" },
12
+ { id: 2, mode: "ojs", value: "b = a + rows.length" },
13
+ { id: 3, mode: "ojs", value: "viewof gain = Inputs.range([0, 10])" },
14
+ { id: 4, mode: "ojs", value: "gain * b" },
15
+ ],
16
+ });
17
+
18
+ const graph = createNotebookGraph(notebook, ["a", "b", "gain", "readout"]);
19
+
20
+ expect(graph.cells.map((cell) => cell.defines)).toEqual([["a"], ["b"], ["gain"], []]);
21
+ expectMembers(graph.cells[1]?.references, ["a", "rows"]);
22
+ expect(graph.cells[2]?.output).toBe("viewof$gain");
23
+ expect(graph.cells[2]?.runtime_outputs).toEqual(["viewof$gain"]);
24
+ expect(graph.cells[2]?.autoview).toBe(true);
25
+ expect(graph.edges).toHaveLength(3);
26
+ expect(graph.edges).toContainEqual({ from: 1, to: 2, variable: "a" });
27
+ expect(graph.edges).toContainEqual({ from: 3, to: 4, variable: "gain" });
28
+ expect(graph.edges).toContainEqual({ from: 2, to: 4, variable: "b" });
29
+ });
30
+
31
+ test("preserves raw JS declarations separately from visible variables", () => {
32
+ const notebook = toNotebook({
33
+ cells: [{ id: 1, mode: "js", value: "const x = 1;\nconst y = 2;" }],
34
+ });
35
+
36
+ const graph = createNotebookGraph(notebook);
37
+
38
+ expectMembers(graph.cells[0]?.defines, ["x", "y"]);
39
+ expectMembers(graph.cells[0]?.outputs, ["x", "y"]);
40
+ expectMembers(graph.cells[0]?.runtime_outputs, ["x", "y"]);
41
+ expect(graph.cells[0]?.output).toBe(null);
42
+ });
43
+
44
+ test("records mutable aliases used by Notebook Kit references", () => {
45
+ const notebook = toNotebook({
46
+ cells: [
47
+ { id: 1, mode: "ojs", value: "mutable count = 0" },
48
+ { id: 2, mode: "ojs", value: "count + 1" },
49
+ { id: 3, mode: "ojs", value: "mutable count" },
50
+ ],
51
+ });
52
+
53
+ const graph = createNotebookGraph(notebook);
54
+
55
+ expect(graph.cells[0]?.defines).toEqual(["count"]);
56
+ expect(graph.cells[0]?.output).toBe("mutable count");
57
+ expectMembers(graph.cells[0]?.runtime_outputs, ["mutable count", "mutable$count"]);
58
+ expect(graph.cells[0]?.automutable).toBe(true);
59
+ expect(graph.edges).toHaveLength(2);
60
+ expect(graph.edges).toContainEqual({ from: 1, to: 2, variable: "count" });
61
+ expect(graph.edges).toContainEqual({ from: 1, to: 3, variable: "mutable$count" });
62
+ });
63
+
64
+ test("uses Notebook Kit output metadata for module, template, SQL, and hidden cells", () => {
65
+ const notebook = toNotebook({
66
+ cells: [
67
+ { id: 1, mode: "js", value: "const answer = 42;", output: "answer" },
68
+ { id: 2, mode: "md", value: "# Title", output: "title" },
69
+ { id: 3, mode: "html", value: "<b>Hi</b>", output: "node" },
70
+ { id: 4, mode: "sql", value: "select 1 as x", output: "rows" },
71
+ { id: 5, mode: "ojs", value: "hidden = answer + 1", hidden: true },
72
+ ],
73
+ });
74
+
75
+ const graph = createNotebookGraph(notebook);
76
+
77
+ expect(graph.cells[0]?.defines).toEqual(["answer"]);
78
+ expect(graph.cells[0]?.outputs).toEqual(["answer"]);
79
+ expect(graph.cells[0]?.output).toBe("answer");
80
+ expect(graph.cells[1]?.defines).toEqual(["title"]);
81
+ expect(graph.cells[1]?.references).toEqual(["md"]);
82
+ expect(graph.cells[2]?.defines).toEqual(["node"]);
83
+ expect(graph.cells[2]?.references).toEqual(["html"]);
84
+ expect(graph.cells[3]?.defines).toEqual(["rows"]);
85
+ expect(graph.cells[3]?.output).toBe("viewof$rows");
86
+ expect(graph.cells[3]?.runtime_outputs).toEqual(["viewof$rows"]);
87
+ expect(graph.cells[3]?.autoview).toBe(true);
88
+ expect(graph.cells[4]?.defines).toEqual(["hidden"]);
89
+ expect(graph.cells[4]?.autodisplay).toBe(false);
90
+ expect(graph.edges).toContainEqual({ from: 1, to: 5, variable: "answer" });
91
+ });
92
+
93
+ test("keeps imported Observable variables as plural outputs", () => {
94
+ const notebook = toNotebook({
95
+ cells: [{ id: 1, mode: "ojs", value: 'import {foo} from "./foo.js"' }],
96
+ });
97
+
98
+ const graph = createNotebookGraph(notebook);
99
+
100
+ expect(graph.cells[0]?.defines).toEqual(["foo"]);
101
+ expect(graph.cells[0]?.outputs).toEqual(["foo"]);
102
+ });
103
+
104
+ test("keeps graph entries for cells with transpile errors", () => {
105
+ const notebook = toNotebook({
106
+ cells: [{ id: 1, mode: "ojs", value: "answer =" }],
107
+ });
108
+
109
+ const graph = createNotebookGraph(notebook);
110
+
111
+ expect(graph.cells[0]?.id).toBe(1);
112
+ expect(graph.cells[0]?.defines).toEqual([]);
113
+ expect(graph.cells[0]?.error).toEqual(expect.any(String));
114
+ expect(graph.cells[0]?.error).not.toBe("");
115
+ });
116
+ });
117
+
118
+ function expectMembers(actual: string[] | undefined, expected: string[]): void {
119
+ expect(actual).toHaveLength(expected.length);
120
+ expect(actual).toEqual(expect.arrayContaining(expected));
121
+ }
@@ -0,0 +1,18 @@
1
+ // @vitest-environment jsdom
2
+
3
+ import { toCell } from "@observablehq/notebook-kit";
4
+ import { describe, expect, test } from "vitest";
5
+ import { SELECTORS } from "./widget/dom-contract";
6
+ import { renderSource } from "./widget/highlight";
7
+
8
+ describe("source rendering", () => {
9
+ test("preserves source text and accessible source labeling", () => {
10
+ const controller = new AbortController();
11
+ const panel = renderSource(toCell({ id: 1, mode: "ojs", value: "answer = 42" }), controller.signal);
12
+ const source = panel.querySelector<HTMLPreElement>(SELECTORS.source);
13
+
14
+ expect(source?.textContent).toBe("answer = 42");
15
+ expect(source?.getAttribute("aria-label")).toBe("OJS source");
16
+ controller.abort();
17
+ });
18
+ });
@@ -0,0 +1,31 @@
1
+ import type { RenderProps } from "@anywidget/types";
2
+ import type { NotebookGraph } from "../observable/types";
3
+ import type { AttachmentInfo } from "../runtime/types";
4
+
5
+ // Trait names match src/pyobservablejs/_notebook.py, including underscored wire traits.
6
+
7
+ export type WidgetModel = {
8
+ role?: "notebook" | "cell";
9
+ _cell_id?: string;
10
+ name?: string;
11
+ source?: string;
12
+ spec?: Record<string, unknown>;
13
+ attachments?: Record<string, AttachmentInfo>;
14
+ base_url?: string;
15
+ _variables?: Record<string, unknown>;
16
+ _variable_update?: {
17
+ seq?: number;
18
+ kind?: "set" | "replace";
19
+ values?: Record<string, unknown>;
20
+ };
21
+ _graph?: NotebookGraph;
22
+ _values?: Record<string, unknown>;
23
+ _value_names?: string[];
24
+ options?: {
25
+ show_source?: boolean;
26
+ observable_markdown_compatibility?: boolean;
27
+ };
28
+ _cell_widgets?: string[];
29
+ };
30
+
31
+ export type WidgetAnyModel = RenderProps<WidgetModel>["model"];
@@ -0,0 +1,21 @@
1
+ import type { RenderProps } from "@anywidget/types";
2
+ import type { WidgetModel } from "./types";
3
+
4
+ export type AnyWidgetModel = RenderProps<WidgetModel>["model"];
5
+
6
+ export function readModelVariableNames(model: AnyWidgetModel): string[] {
7
+ const value = model.get("_value_names");
8
+ return Array.isArray(value) ? value.filter((name): name is string => typeof name === "string") : [];
9
+ }
10
+
11
+ export function readModelVariables(model: AnyWidgetModel): Record<string, unknown> {
12
+ const value = model.get("_values");
13
+ if (value === null || typeof value !== "object" || Array.isArray(value)) return {};
14
+ return value;
15
+ }
16
+
17
+ export function readNotebookVariables(model: AnyWidgetModel): Record<string, unknown> {
18
+ const value = model.get("_variables");
19
+ if (value === null || typeof value !== "object" || Array.isArray(value)) return {};
20
+ return value;
21
+ }
@@ -0,0 +1,89 @@
1
+ import { transpile, type Notebook } from "@observablehq/notebook-kit";
2
+ import type { CellGraph, NotebookGraph } from "./types";
3
+
4
+ type Definition = ReturnType<typeof transpile>;
5
+
6
+ export function createNotebookGraph(notebook: Notebook, names: readonly string[] = []): NotebookGraph {
7
+ const cells = notebook.cells.map((cell, index) => createCellGraph(cell, index, names[index] ?? ""));
8
+ const definitions = new Map<string, CellGraph[]>();
9
+ for (const cell of cells) {
10
+ for (const name of definedNames(cell)) {
11
+ const existing = definitions.get(name);
12
+ if (existing) existing.push(cell);
13
+ else definitions.set(name, [cell]);
14
+ }
15
+ }
16
+
17
+ const edges = cells.flatMap((target) =>
18
+ target.references.flatMap((name) =>
19
+ (definitions.get(name) ?? [])
20
+ .filter((source) => source.id !== target.id)
21
+ .map((source) => ({
22
+ from: source.id,
23
+ to: target.id,
24
+ variable: name,
25
+ })),
26
+ ),
27
+ );
28
+
29
+ return { cells, edges };
30
+ }
31
+
32
+ export function exposedVariableNames(definition: Definition): string[] {
33
+ if (definition.output) {
34
+ if (definition.autoview) return [unprefix(definition.output, "viewof$")];
35
+ if (definition.automutable) return [unprefix(definition.output, "mutable ")];
36
+ return [definition.output];
37
+ }
38
+ return definition.outputs ?? [];
39
+ }
40
+
41
+ export function unprefix(value: string, prefix: string): string {
42
+ return value.startsWith(prefix) ? value.slice(prefix.length) : value;
43
+ }
44
+
45
+ function createCellGraph(notebookCell: Notebook["cells"][number], index: number, name: string): CellGraph {
46
+ try {
47
+ const definition = transpile(notebookCell, { resolveLocalImports: true });
48
+ return {
49
+ id: notebookCell.id,
50
+ index,
51
+ name,
52
+ mode: notebookCell.mode,
53
+ defines: exposedVariableNames(definition),
54
+ references: definition.inputs ?? [],
55
+ output: definition.output ?? null,
56
+ outputs: definition.outputs ?? [],
57
+ runtime_outputs: runtimeOutputs(definition),
58
+ autodisplay: definition.autodisplay === true,
59
+ autoview: definition.autoview === true,
60
+ automutable: definition.automutable === true,
61
+ };
62
+ } catch (error) {
63
+ return {
64
+ id: notebookCell.id,
65
+ index,
66
+ name,
67
+ mode: notebookCell.mode,
68
+ defines: [],
69
+ references: [],
70
+ output: null,
71
+ outputs: [],
72
+ runtime_outputs: [],
73
+ autodisplay: false,
74
+ autoview: false,
75
+ automutable: false,
76
+ error: error instanceof Error ? `${error.name}: ${error.message}` : String(error),
77
+ };
78
+ }
79
+ }
80
+
81
+ function runtimeOutputs(definition: Definition): string[] {
82
+ if (!definition.output) return definition.outputs ?? [];
83
+ if (definition.automutable) return [definition.output, `mutable$${unprefix(definition.output, "mutable ")}`];
84
+ return [definition.output];
85
+ }
86
+
87
+ function definedNames(cell: CellGraph): string[] {
88
+ return Array.from(new Set([...cell.defines, ...cell.runtime_outputs]));
89
+ }