@typstream/mindmap 0.0.0-stage → 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Ikram Hasan
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,46 @@
-# Temporary Holding Version
+# @typstream/mindmap
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Mind maps for typstream: written as a list, drawn in plain Typst for print, PDF and every renderer,
+and interactive in `<Typstream>` (pan, zoom, open and close branches). The first render island.
+
+```typst
+#mindmap[
+  Photosynthesis
+  - Inputs
+    - Sunlight
+    - Water ($H_2 O$)
+  - #topic(color: "#16a34a", collapsed: true)[Outputs]
+    - Glucose
+    - Oxygen
+]
+```
+
+```tsx
+import { mindmap } from "@typstream/mindmap";
+import { mindmapIslands } from "@typstream/mindmap/react";
+
+<Typstream source={text} plugins={[mindmap]} islands={mindmapIslands} />;
+buildSystemPrompt([edu, mindmap]); // the model learns `#mindmap`
+```
+
+- **Typst** (`typst/`): `mindmap(style:, layout:, text-size:)[centre, then a list]` and `topic(color:, size:, weight:,
+  image:, collapsed:)[label]`, which cover the fields of Monsha's mind map format. Drawn with `measure`, `place` and
+  `curve`, not CeTZ: 9–11 ms per compile while streaming in engine-wasm. Every parameter takes what a stream cut leaves.
+  The drawing sits in an island marker (`island.typ`) carrying the resolved tree as data.
+- **Plugin** (`.`): the files as a local package `@typstream/mindmap:0.1.0`, the preamble, the prompt kit (catalogue
+  from the `///` doc comments, rules, `examples/`), and the `mindmap` island with `parseMindMap`, which checks the
+  marker's untrusted data.
+- **Interactive map** (`./react`): React Flow, loaded with the first map (about 65 KB gzipped with its CSS), laid out like
+  the drawing (`src/react/layout.ts`) on labels measured in the page's font, read-only. CSS is adopted as constructable
+  stylesheets (strict CSP). On pages, the map is mounted over the page's canvas,
+  which keeps the drawing for print and exports.
+- `pnpm embed` after editing `typst/` or `examples/` (a test checks `src/assets.generated.ts` and React Flow's CSS).
+  `pnpm test` compiles through engine-wasm and native `typst` (every healed stream prefix of the examples);
+  `pnpm test:browser` mounts the island on the real engine worker in Chromium, Firefox and WebKit; `pnpm size`.
+
+Docs: [reference](https://typstream.vercel.app/docs/reference/mindmap),
+[Writing an island](https://typstream.vercel.app/docs/guides/islands).
+
+## License
+
+MIT. The React Flow stylesheet the interactive map embeds is MIT too; its license is in `THIRD-PARTY-NOTICES.txt`.

package/THIRD-PARTY-NOTICES.txt

@@ -0,0 +1,31 @@
+Third-party notices for @typstream/mindmap
+
+The chunk the interactive map (./react) loads, dist/flow-*.js, embeds the stylesheet (dist/style.css) of
+@xyflow/react 12.12.0 (React Flow, https://github.com/xyflow/xyflow). React Flow's code is a dependency, not bundled.
+Its license follows.
+
+================================================================================
+@xyflow/react 12.12.0
+================================================================================
+
+MIT License
+
+Copyright (c) 2019-2025 webkid GmbH
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/flow-D3CKRG3R.js

@@ -0,0 +1,461 @@
+"use client";
+
+// src/react/flow.tsx
+import {
+  BaseEdge,
+  Controls,
+  Handle,
+  Position,
+  ReactFlow,
+  ReactFlowProvider,
+  useReactFlow,
+  useStore
+} from "@xyflow/react";
+import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
+
+// src/react/css.ts
+var adopted = /* @__PURE__ */ new WeakMap();
+var adoptCss = (node, css) => {
+  const root = node.getRootNode();
+  const done = adopted.get(root) ?? /* @__PURE__ */ new Set();
+  adopted.set(root, done);
+  if (done.has(css)) return;
+  done.add(css);
+  const Sheet = node.ownerDocument?.defaultView?.CSSStyleSheet ?? CSSStyleSheet;
+  const sheet = new Sheet();
+  sheet.replaceSync(css);
+  root.adoptedStyleSheets = [...root.adoptedStyleSheets, sheet];
+};
+
+// src/react/layout.ts
+var PX = 4 / 3;
+var GAP_X = 22 * PX;
+var GAP_Y = 6 * PX;
+var GAP_BRANCH = 12 * PX;
+var descendants = (n) => (n.children ?? []).reduce((sum, c) => sum + 1 + descendants(c), 0);
+var layoutMindMap = (data, closed, size) => {
+  const open = (id, n) => n.children?.length && !closed(id, n) ? n.children.map((c, i) => [`${id}.${i}`, c]) : [];
+  const box = (id, n, depth) => {
+    const hidden = n.children?.length && closed(id, n) ? descendants(n) : 0;
+    return { hidden, ...size(n, depth, hidden) };
+  };
+  const place = (id, n, depth, side) => {
+    const { w, h, hidden } = box(id, n, depth);
+    const me = { id, node: n, depth, side, hidden, x: 0, y: 0, w, h };
+    const kids = open(id, n);
+    if (kids.length === 0) return { nodes: [me], edges: [], height: h, cy: h / 2 };
+    const nodes2 = [];
+    const edges2 = [];
+    const centres = [];
+    let y = 0;
+    for (const [cid, c] of kids) {
+      const sub = place(cid, c, depth + 1, side);
+      for (const m of sub.nodes) nodes2.push({ ...m, x: m.x + w + GAP_X, y: m.y + y });
+      edges2.push(...sub.edges, {
+        id: `${id}-${cid}`,
+        source: id,
+        target: cid,
+        side,
+        color: n.color,
+        points: [0, 0, 0, 0]
+      });
+      centres.push(y + sub.cy);
+      y += sub.height + GAP_Y;
+    }
+    const height2 = y - GAP_Y;
+    let cy = (centres[0] + centres[centres.length - 1]) / 2;
+    const shift = Math.max(0, h / 2 - cy);
+    for (const m of nodes2) m.y += shift;
+    cy += shift;
+    nodes2.push({ ...me, y: cy - h / 2 });
+    return { nodes: nodes2, edges: edges2, height: Math.max(height2 + shift, cy + h / 2), cy };
+  };
+  const stack = (branches2, side) => {
+    const nodes2 = [];
+    const edges2 = [];
+    let y = 0;
+    for (const [id, b] of branches2) {
+      const sub = place(id, b, 1, side);
+      for (const m of sub.nodes) nodes2.push({ ...m, y: m.y + y });
+      edges2.push(...sub.edges, { id: `0-${id}`, source: "0", target: id, side, color: b.color, points: [0, 0, 0, 0] });
+      y += sub.height + GAP_BRANCH;
+    }
+    return {
+      nodes: nodes2,
+      edges: edges2,
+      width: Math.max(0, ...nodes2.map((m) => m.x + m.w)),
+      height: Math.max(0, y - GAP_BRANCH)
+    };
+  };
+  const root = data.root;
+  const centre = box("0", root, 0);
+  const branches = open("0", root);
+  const right = stack(
+    branches.filter(([, b]) => b.side !== "left"),
+    "right"
+  );
+  const left = stack(
+    branches.filter(([, b]) => b.side === "left"),
+    "left"
+  );
+  const gap = 2 * GAP_X;
+  const height = Math.max(right.height, left.height, centre.h);
+  const cx = left.nodes.length ? left.width + gap : 0;
+  const ry = (height - right.height) / 2;
+  const ly = (height - left.height) / 2;
+  const nodes = [
+    { id: "0", node: root, depth: 0, side: null, x: cx, y: (height - centre.h) / 2, ...centre }
+  ];
+  const ox = cx + centre.w + gap;
+  for (const m of right.nodes) nodes.push({ ...m, x: ox + m.x, y: ry + m.y });
+  for (const m of left.nodes) nodes.push({ ...m, x: cx - gap - m.x - m.w, y: ly + m.y });
+  const byId = new Map(nodes.map((m) => [m.id, m]));
+  const edges = [...right.edges, ...left.edges];
+  for (const e of edges) {
+    const [from, to] = [byId.get(e.source), byId.get(e.target)];
+    const right2 = e.side === "right";
+    e.points = [right2 ? from.x + from.w : from.x, from.y + from.h / 2, right2 ? to.x : to.x + to.w, to.y + to.h / 2];
+  }
+  return { nodes, edges };
+};
+
+// src/react/measure.ts
+var context = null;
+var canvas = () => {
+  context ??= typeof OffscreenCanvas === "function" ? new OffscreenCanvas(1, 1).getContext("2d") : document.createElement("canvas").getContext("2d");
+  return context;
+};
+var weightOf = (n) => n.weight === "bold" ? 700 : n.weight === "regular" ? 400 : n.weight;
+var wrap = (label, max, width) => {
+  const lines = [];
+  let line = "";
+  for (const word of label.split(/\s+/).filter(Boolean)) {
+    const next = line ? `${line} ${word}` : word;
+    if (line && width(next) > max) {
+      lines.push(line);
+      line = word;
+    } else line = next;
+  }
+  lines.push(line);
+  return lines;
+};
+var measureNode = (n, depth, hidden, data, family) => {
+  const ctx = canvas();
+  const size = n.size * PX;
+  const base = data.size * PX;
+  const width = (s) => ctx ? ctx.measureText(s).width : s.length * size * 0.55;
+  if (ctx) ctx.font = `${weightOf(n)} ${size}px ${family}`;
+  const lines = wrap(n.label, base * (data.style === "text-focused" ? 14 : 10), width);
+  let w = Math.max(...lines.map(width));
+  if (hidden > 0) {
+    if (ctx) ctx.font = `700 ${0.7 * size}px ${family}`;
+    w += 4 * PX + width(`+${hidden}`) + 8;
+  }
+  let h = lines.length * size * 1.25;
+  let image = null;
+  if (n.image && data.style === "visual") {
+    image = { h: base * 3.2 };
+    w = Math.max(w, base * 4.5);
+    h += image.h + 4;
+  }
+  const border = depth === 0 ? 0 : depth === 1 ? 1.6 : 1.0667;
+  return { w: Math.ceil(w + size + 2 * border) + 1, h: Math.ceil(h + 0.6 * size + 2 * border), lines, image };
+};
+
+// src/react/styles.ts
+var MINDMAP_CSS = `.ts-mindmap {
+  margin: 0;
+  width: 100%;
+  height: 100%;
+  background: var(--typstream-island-background, Canvas);
+}
+.ts-mindmap .react-flow {
+  --xy-background-color: transparent;
+  font: inherit;
+}
+.ts-mindmap :is(svg, img) {
+  max-width: none;
+}
+.ts-mindmap-node {
+  box-sizing: border-box;
+  border: 0 solid;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  line-height: 1.25;
+  text-align: center;
+  white-space: nowrap;
+}
+.ts-mindmap-node[data-depth="1"] {
+  border-width: 1.6px;
+}
+.ts-mindmap-node[data-depth="2"] {
+  border-width: 1.0667px;
+}
+.ts-mindmap-label {
+  display: flex;
+  align-items: center;
+  gap: 5.333px;
+}
+.ts-mindmap-label > span[dir] {
+  display: flex;
+  flex-direction: column;
+}
+.ts-mindmap-badge {
+  border-radius: 1em;
+  padding: 2px 4px;
+  font-weight: 700;
+  line-height: 1.2;
+  background: var(--ts-mindmap-color);
+  color: #fff;
+}
+.ts-mindmap-node[data-depth="0"] .ts-mindmap-badge {
+  background: #fff;
+  color: var(--ts-mindmap-color);
+}
+.ts-mindmap-image {
+  align-self: stretch;
+  margin-bottom: 4px;
+  overflow: hidden;
+  border-radius: 2.667px;
+  background: #e5e7eb;
+  color: #4b5563;
+  font-size: 0.7em;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.ts-mindmap-image img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+.ts-mindmap .react-flow__handle {
+  opacity: 0;
+  pointer-events: none;
+  width: 1px;
+  height: 1px;
+  min-width: 0;
+  min-height: 0;
+  border: 0;
+}
+.ts-mindmap .react-flow__node[aria-label*="("] {
+  cursor: pointer;
+}
+.ts-mindmap .react-flow__node:focus-visible {
+  outline: 2px solid #2563eb;
+  outline-offset: 2px;
+  border-radius: 4px;
+}`;
+
+// src/react/xyflow-css.generated.ts
+var XYFLOW_CSS = "/* this gets exported as style.css and can be used for the default theming */\n/* these are the necessary styles for React/Svelte Flow, they get used by base.css and style.css */\n.react-flow {\n  direction: ltr;\n\n  --xy-edge-stroke-default: #b1b1b7;\n  --xy-edge-stroke-width-default: 1;\n  --xy-edge-stroke-selected-default: #555;\n\n  --xy-connectionline-stroke-default: #b1b1b7;\n  --xy-connectionline-stroke-width-default: 1;\n\n  --xy-attribution-background-color-default: rgba(255, 255, 255, 0.5);\n\n  --xy-minimap-background-color-default: #fff;\n  --xy-minimap-mask-background-color-default: rgba(240, 240, 240, 0.6);\n  --xy-minimap-mask-stroke-color-default: transparent;\n  --xy-minimap-mask-stroke-width-default: 1;\n  --xy-minimap-node-background-color-default: #e2e2e2;\n  --xy-minimap-node-stroke-color-default: transparent;\n  --xy-minimap-node-stroke-width-default: 2;\n\n  --xy-background-color-default: transparent;\n  --xy-background-pattern-dots-color-default: #91919a;\n  --xy-background-pattern-lines-color-default: #eee;\n  --xy-background-pattern-cross-color-default: #e2e2e2;\n  background-color: var(--xy-background-color, var(--xy-background-color-default));\n  --xy-node-color-default: inherit;\n  --xy-node-border-default: 1px solid #1a192b;\n  --xy-node-background-color-default: #fff;\n  --xy-node-group-background-color-default: rgba(240, 240, 240, 0.25);\n  --xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(0, 0, 0, 0.08);\n  --xy-node-boxshadow-selected-default: 0 0 0 0.5px #1a192b;\n  --xy-node-border-radius-default: 3px;\n\n  --xy-handle-background-color-default: #1a192b;\n  --xy-handle-border-color-default: #fff;\n\n  --xy-selection-background-color-default: rgba(0, 89, 220, 0.08);\n  --xy-selection-border-default: 1px dotted rgba(0, 89, 220, 0.8);\n\n  --xy-controls-button-background-color-default: #fefefe;\n  --xy-controls-button-background-color-hover-default: #f4f4f4;\n  --xy-controls-button-color-default: inherit;\n  --xy-controls-button-color-hover-default: inherit;\n  --xy-controls-button-border-color-default: #eee;\n  --xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, 0.08);\n\n  --xy-edge-label-background-color-default: #ffffff;\n  --xy-edge-label-color-default: inherit;\n  --xy-resize-background-color-default: #3367d9;\n}\n.react-flow.dark {\n  --xy-edge-stroke-default: #3e3e3e;\n  --xy-edge-stroke-width-default: 1;\n  --xy-edge-stroke-selected-default: #727272;\n\n  --xy-connectionline-stroke-default: #b1b1b7;\n  --xy-connectionline-stroke-width-default: 1;\n\n  --xy-attribution-background-color-default: rgba(150, 150, 150, 0.25);\n\n  --xy-minimap-background-color-default: #141414;\n  --xy-minimap-mask-background-color-default: rgba(60, 60, 60, 0.6);\n  --xy-minimap-mask-stroke-color-default: transparent;\n  --xy-minimap-mask-stroke-width-default: 1;\n  --xy-minimap-node-background-color-default: #2b2b2b;\n  --xy-minimap-node-stroke-color-default: transparent;\n  --xy-minimap-node-stroke-width-default: 2;\n\n  --xy-background-color-default: #141414;\n  --xy-background-pattern-dots-color-default: #555;\n  --xy-background-pattern-lines-color-default: #333;\n  --xy-background-pattern-cross-color-default: #333;\n  --xy-node-color-default: #f8f8f8;\n  --xy-node-border-default: 1px solid #3c3c3c;\n  --xy-node-background-color-default: #1e1e1e;\n  --xy-node-group-background-color-default: rgba(240, 240, 240, 0.25);\n  --xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(255, 255, 255, 0.08);\n  --xy-node-boxshadow-selected-default: 0 0 0 0.5px #999;\n\n  --xy-handle-background-color-default: #bebebe;\n  --xy-handle-border-color-default: #1e1e1e;\n\n  --xy-selection-background-color-default: rgba(200, 200, 220, 0.08);\n  --xy-selection-border-default: 1px dotted rgba(200, 200, 220, 0.8);\n\n  --xy-controls-button-background-color-default: #2b2b2b;\n  --xy-controls-button-background-color-hover-default: #3e3e3e;\n  --xy-controls-button-color-default: #f8f8f8;\n  --xy-controls-button-color-hover-default: #fff;\n  --xy-controls-button-border-color-default: #5b5b5b;\n  --xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, 0.08);\n\n  --xy-edge-label-background-color-default: #141414;\n  --xy-edge-label-color-default: #f8f8f8;\n}\n.react-flow__background {\n  background-color: var(--xy-background-color-props, var(--xy-background-color, var(--xy-background-color-default)));\n  pointer-events: none;\n  z-index: -1;\n}\n.react-flow__container {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n}\n.react-flow__pane {\n  z-index: 1;\n  touch-action: none;\n}\n.react-flow__pane.draggable {\n    cursor: grab;\n  }\n.react-flow__pane.dragging {\n    cursor: grabbing;\n  }\n.react-flow__pane.selection {\n    cursor: pointer;\n  }\n.react-flow__viewport {\n  transform-origin: 0 0;\n  z-index: 2;\n  pointer-events: none;\n}\n.react-flow__renderer {\n  z-index: 4;\n}\n.react-flow__selection {\n  z-index: 6;\n}\n.react-flow__nodesselection-rect:focus,\n.react-flow__nodesselection-rect:focus-visible {\n  outline: none;\n}\n.react-flow__edge-path {\n  stroke: var(--xy-edge-stroke, var(--xy-edge-stroke-default));\n  stroke-width: var(--xy-edge-stroke-width, var(--xy-edge-stroke-width-default));\n  fill: none;\n}\n.react-flow__connection-path {\n  stroke: var(--xy-connectionline-stroke, var(--xy-connectionline-stroke-default));\n  stroke-width: var(--xy-connectionline-stroke-width, var(--xy-connectionline-stroke-width-default));\n  fill: none;\n}\n.react-flow .react-flow__edges {\n  position: absolute;\n}\n.react-flow .react-flow__edges svg {\n    overflow: visible;\n    position: absolute;\n    pointer-events: none;\n  }\n.react-flow__edge {\n  pointer-events: visibleStroke;\n}\n.react-flow__edge.selectable {\n    cursor: pointer;\n  }\n.react-flow__edge.animated path {\n    stroke-dasharray: 5;\n    animation: dashdraw 0.5s linear infinite;\n  }\n.react-flow__edge.animated path.react-flow__edge-interaction {\n    stroke-dasharray: none;\n    animation: none;\n  }\n.react-flow__edge.inactive {\n    pointer-events: none;\n  }\n.react-flow__edge.selected,\n  .react-flow__edge:focus,\n  .react-flow__edge:focus-visible {\n    outline: none;\n  }\n.react-flow__edge.selected .react-flow__edge-path,\n  .react-flow__edge.selectable:focus .react-flow__edge-path,\n  .react-flow__edge.selectable:focus-visible .react-flow__edge-path {\n    stroke: var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default));\n  }\n.react-flow__edge-textwrapper {\n    pointer-events: all;\n  }\n.react-flow__edge .react-flow__edge-text {\n    pointer-events: none;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n            user-select: none;\n  }\n/* Arrowhead marker styles - use CSS custom properties as default */\n.react-flow__arrowhead polyline {\n  stroke: var(--xy-edge-stroke, var(--xy-edge-stroke-default));\n}\n.react-flow__arrowhead polyline.arrowclosed {\n  fill: var(--xy-edge-stroke, var(--xy-edge-stroke-default));\n}\n.react-flow__connection {\n  pointer-events: none;\n}\n.react-flow__connection .animated {\n    stroke-dasharray: 5;\n    animation: dashdraw 0.5s linear infinite;\n  }\nsvg.react-flow__connectionline {\n  z-index: 1001;\n  overflow: visible;\n  position: absolute;\n}\n.react-flow__nodes {\n  pointer-events: none;\n  transform-origin: 0 0;\n}\n.react-flow__node {\n  position: absolute;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n          user-select: none;\n  pointer-events: all;\n  transform-origin: 0 0;\n  box-sizing: border-box;\n  cursor: default;\n}\n.react-flow__node.selectable {\n    cursor: pointer;\n  }\n.react-flow__node.draggable {\n    cursor: grab;\n    pointer-events: all;\n  }\n.react-flow__node.draggable.dragging {\n      cursor: grabbing;\n    }\n.react-flow__nodesselection {\n  z-index: 3;\n  transform-origin: left top;\n  pointer-events: none;\n}\n.react-flow__nodesselection-rect {\n    position: absolute;\n    pointer-events: all;\n    cursor: grab;\n  }\n.react-flow__handle {\n  position: absolute;\n  pointer-events: none;\n  min-width: 5px;\n  min-height: 5px;\n  width: 6px;\n  height: 6px;\n  background-color: var(--xy-handle-background-color, var(--xy-handle-background-color-default));\n  border: 1px solid var(--xy-handle-border-color, var(--xy-handle-border-color-default));\n  border-radius: 100%;\n}\n.react-flow__handle.connectingfrom {\n    pointer-events: all;\n  }\n.react-flow__handle.connectionindicator {\n    pointer-events: all;\n    cursor: crosshair;\n  }\n.react-flow__handle-bottom {\n    top: auto;\n    left: 50%;\n    bottom: 0;\n    transform: translate(-50%, 50%);\n  }\n.react-flow__handle-top {\n    top: 0;\n    left: 50%;\n    transform: translate(-50%, -50%);\n  }\n.react-flow__handle-left {\n    top: 50%;\n    left: 0;\n    transform: translate(-50%, -50%);\n  }\n.react-flow__handle-right {\n    top: 50%;\n    right: 0;\n    transform: translate(50%, -50%);\n  }\n.react-flow__edgeupdater {\n  cursor: move;\n  pointer-events: all;\n}\n.react-flow__pane.selection .react-flow__panel {\n  pointer-events: none;\n}\n.react-flow__panel {\n  position: absolute;\n  z-index: 5;\n  margin: 15px;\n}\n.react-flow__panel.top {\n    top: 0;\n  }\n.react-flow__panel.bottom {\n    bottom: 0;\n  }\n.react-flow__panel.top.center, .react-flow__panel.bottom.center {\n      left: 50%;\n      transform: translateX(-15px) translateX(-50%);\n    }\n.react-flow__panel.left {\n    left: 0;\n  }\n.react-flow__panel.right {\n    right: 0;\n  }\n.react-flow__panel.left.center, .react-flow__panel.right.center {\n      top: 50%;\n      transform: translateY(-15px) translateY(-50%);\n    }\n.react-flow__attribution {\n  font-size: 10px;\n  background: var(--xy-attribution-background-color, var(--xy-attribution-background-color-default));\n  padding: 2px 3px;\n  margin: 0;\n}\n.react-flow__attribution a {\n    text-decoration: none;\n    color: #999;\n  }\n@keyframes dashdraw {\n  from {\n    stroke-dashoffset: 10;\n  }\n}\n.react-flow__edgelabel-renderer {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n          user-select: none;\n  left: 0;\n  top: 0;\n}\n.react-flow__viewport-portal {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n          user-select: none;\n}\n.react-flow__minimap {\n  background: var(\n    --xy-minimap-background-color-props,\n    var(--xy-minimap-background-color, var(--xy-minimap-background-color-default))\n  );\n}\n.react-flow__minimap-svg {\n    display: block;\n  }\n.react-flow__minimap-mask {\n    fill: var(\n      --xy-minimap-mask-background-color-props,\n      var(--xy-minimap-mask-background-color, var(--xy-minimap-mask-background-color-default))\n    );\n    stroke: var(\n      --xy-minimap-mask-stroke-color-props,\n      var(--xy-minimap-mask-stroke-color, var(--xy-minimap-mask-stroke-color-default))\n    );\n    stroke-width: var(\n      --xy-minimap-mask-stroke-width-props,\n      var(--xy-minimap-mask-stroke-width, var(--xy-minimap-mask-stroke-width-default))\n    );\n  }\n.react-flow__minimap-node {\n    fill: var(\n      --xy-minimap-node-background-color-props,\n      var(--xy-minimap-node-background-color, var(--xy-minimap-node-background-color-default))\n    );\n    stroke: var(\n      --xy-minimap-node-stroke-color-props,\n      var(--xy-minimap-node-stroke-color, var(--xy-minimap-node-stroke-color-default))\n    );\n    stroke-width: var(\n      --xy-minimap-node-stroke-width-props,\n      var(--xy-minimap-node-stroke-width, var(--xy-minimap-node-stroke-width-default))\n    );\n  }\n.react-flow__background-pattern.dots {\n    fill: var(\n      --xy-background-pattern-color-props,\n      var(--xy-background-pattern-color, var(--xy-background-pattern-dots-color-default))\n    );\n  }\n.react-flow__background-pattern.lines {\n    stroke: var(\n      --xy-background-pattern-color-props,\n      var(--xy-background-pattern-color, var(--xy-background-pattern-lines-color-default))\n    );\n  }\n.react-flow__background-pattern.cross {\n    stroke: var(\n      --xy-background-pattern-color-props,\n      var(--xy-background-pattern-color, var(--xy-background-pattern-cross-color-default))\n    );\n  }\n.react-flow__controls {\n  display: flex;\n  flex-direction: column;\n  box-shadow: var(--xy-controls-box-shadow, var(--xy-controls-box-shadow-default));\n}\n.react-flow__controls.horizontal {\n    flex-direction: row;\n  }\n.react-flow__controls-button {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 26px;\n    width: 26px;\n    padding: 4px;\n    border: none;\n    background: var(--xy-controls-button-background-color, var(--xy-controls-button-background-color-default));\n    border-bottom: 1px solid\n      var(\n        --xy-controls-button-border-color-props,\n        var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default))\n      );\n    color: var(\n      --xy-controls-button-color-props,\n      var(--xy-controls-button-color, var(--xy-controls-button-color-default))\n    );\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n            user-select: none;\n  }\n.react-flow__controls-button svg {\n      width: 100%;\n      max-width: 12px;\n      max-height: 12px;\n      fill: currentColor;\n    }\n.react-flow__edge.updating .react-flow__edge-path {\n      stroke: #777;\n    }\n.react-flow__edge-text {\n    font-size: 10px;\n  }\n.react-flow__node.selectable:focus,\n  .react-flow__node.selectable:focus-visible {\n    outline: none;\n  }\n.react-flow__node-input,\n.react-flow__node-default,\n.react-flow__node-output,\n.react-flow__node-group {\n  padding: 10px;\n  border-radius: var(--xy-node-border-radius, var(--xy-node-border-radius-default));\n  width: 150px;\n  font-size: 12px;\n  color: var(--xy-node-color, var(--xy-node-color-default));\n  text-align: center;\n  border: var(--xy-node-border, var(--xy-node-border-default));\n  background-color: var(--xy-node-background-color, var(--xy-node-background-color-default));\n}\n.react-flow__node-input.selectable:hover, .react-flow__node-default.selectable:hover, .react-flow__node-output.selectable:hover, .react-flow__node-group.selectable:hover {\n      box-shadow: var(--xy-node-boxshadow-hover, var(--xy-node-boxshadow-hover-default));\n    }\n.react-flow__node-input.selectable.selected,\n    .react-flow__node-input.selectable:focus,\n    .react-flow__node-input.selectable:focus-visible,\n    .react-flow__node-default.selectable.selected,\n    .react-flow__node-default.selectable:focus,\n    .react-flow__node-default.selectable:focus-visible,\n    .react-flow__node-output.selectable.selected,\n    .react-flow__node-output.selectable:focus,\n    .react-flow__node-output.selectable:focus-visible,\n    .react-flow__node-group.selectable.selected,\n    .react-flow__node-group.selectable:focus,\n    .react-flow__node-group.selectable:focus-visible {\n      box-shadow: var(--xy-node-boxshadow-selected, var(--xy-node-boxshadow-selected-default));\n    }\n.react-flow__node-group {\n  background-color: var(--xy-node-group-background-color, var(--xy-node-group-background-color-default));\n}\n.react-flow__nodesselection-rect,\n.react-flow__selection {\n  background: var(--xy-selection-background-color, var(--xy-selection-background-color-default));\n  border: var(--xy-selection-border, var(--xy-selection-border-default));\n}\n.react-flow__nodesselection-rect:focus,\n  .react-flow__nodesselection-rect:focus-visible,\n  .react-flow__selection:focus,\n  .react-flow__selection:focus-visible {\n    outline: none;\n  }\n.react-flow__controls-button:hover {\n      background: var(\n        --xy-controls-button-background-color-hover-props,\n        var(--xy-controls-button-background-color-hover, var(--xy-controls-button-background-color-hover-default))\n      );\n      color: var(\n        --xy-controls-button-color-hover-props,\n        var(--xy-controls-button-color-hover, var(--xy-controls-button-color-hover-default))\n      );\n    }\n.react-flow__controls-button:disabled {\n      pointer-events: none;\n    }\n.react-flow__controls-button:disabled svg {\n        fill-opacity: 0.4;\n      }\n.react-flow__controls-button:last-child {\n    border-bottom: none;\n  }\n.react-flow__controls.horizontal .react-flow__controls-button {\n    border-bottom: none;\n    border-right: 1px solid\n      var(\n        --xy-controls-button-border-color-props,\n        var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default))\n      );\n  }\n.react-flow__controls.horizontal .react-flow__controls-button:last-child {\n    border-right: none;\n  }\n.react-flow__resize-control {\n  position: absolute;\n}\n.react-flow__resize-control.left,\n.react-flow__resize-control.right {\n  cursor: ew-resize;\n}\n.react-flow__resize-control.top,\n.react-flow__resize-control.bottom {\n  cursor: ns-resize;\n}\n.react-flow__resize-control.top.left,\n.react-flow__resize-control.bottom.right {\n  cursor: nwse-resize;\n}\n.react-flow__resize-control.bottom.left,\n.react-flow__resize-control.top.right {\n  cursor: nesw-resize;\n}\n/* handle styles */\n.react-flow__resize-control.handle {\n  width: 5px;\n  height: 5px;\n  border: 1px solid #fff;\n  border-radius: 1px;\n  background-color: var(--xy-resize-background-color, var(--xy-resize-background-color-default));\n  translate: -50% -50%;\n}\n.react-flow__resize-control.handle.left {\n  left: 0;\n  top: 50%;\n}\n.react-flow__resize-control.handle.right {\n  left: 100%;\n  top: 50%;\n}\n.react-flow__resize-control.handle.top {\n  left: 50%;\n  top: 0;\n}\n.react-flow__resize-control.handle.bottom {\n  left: 50%;\n  top: 100%;\n}\n.react-flow__resize-control.handle.top.left {\n  left: 0;\n}\n.react-flow__resize-control.handle.bottom.left {\n  left: 0;\n}\n.react-flow__resize-control.handle.top.right {\n  left: 100%;\n}\n.react-flow__resize-control.handle.bottom.right {\n  left: 100%;\n}\n/* line styles */\n.react-flow__resize-control.line {\n  border-color: var(--xy-resize-background-color, var(--xy-resize-background-color-default));\n  border-width: 0;\n  border-style: solid;\n}\n.react-flow__resize-control.line.left,\n.react-flow__resize-control.line.right {\n  width: 1px;\n  transform: translate(-50%, 0);\n  top: 0;\n  height: 100%;\n}\n.react-flow__resize-control.line.left {\n  left: 0;\n  border-left-width: 1px;\n}\n.react-flow__resize-control.line.right {\n  left: 100%;\n  border-right-width: 1px;\n}\n.react-flow__resize-control.line.top,\n.react-flow__resize-control.line.bottom {\n  height: 1px;\n  transform: translate(0, -50%);\n  left: 0;\n  width: 100%;\n}\n.react-flow__resize-control.line.top {\n  top: 0;\n  border-top-width: 1px;\n}\n.react-flow__resize-control.line.bottom {\n  border-bottom-width: 1px;\n  top: 100%;\n}\n.react-flow__edge-textbg {\n  fill: var(--xy-edge-label-background-color, var(--xy-edge-label-background-color-default));\n}\n.react-flow__edge-text {\n  fill: var(--xy-edge-label-color, var(--xy-edge-label-color-default));\n}\n";
+
+// src/react/flow.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var lighten = (color, amount) => {
+  const c = [1, 3, 5].map((i) => Number.parseInt(color.slice(i, i + 2), 16));
+  return `rgb(${c.map((v) => Math.round(v + (255 - v) * amount)).join(" ")})`;
+};
+var light = (color) => {
+  const [r, g, b] = [1, 3, 5].map((i) => Number.parseInt(color.slice(i, i + 2), 16) / 255);
+  return 0.299 * r + 0.587 * g + 0.114 * b > 0.6;
+};
+var Topic = ({ data }) => {
+  const { laid, metrics, image } = data;
+  const { node, depth, side } = laid;
+  const size = node.size * PX;
+  const fill = depth === 0 ? node.color : depth === 1 ? lighten(node.color, 0.85) : "#fff";
+  const ink = depth === 0 && !light(node.color) ? "#fff" : "#000";
+  const outer = side === "left" ? Position.Left : Position.Right;
+  const inner = side === "left" ? Position.Right : Position.Left;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "ts-mindmap-node",
+      "data-depth": Math.min(depth, 2),
+      style: {
+        ["--ts-mindmap-color"]: node.color,
+        width: laid.w,
+        height: laid.h,
+        padding: `${0.3 * size}px ${0.5 * size}px`,
+        background: fill,
+        color: ink,
+        borderColor: node.color,
+        borderRadius: depth === 0 ? 0.4 * size + 0.3 * size : 4 * PX,
+        fontSize: size,
+        fontWeight: node.weight === "regular" ? 400 : node.weight === "bold" ? 700 : node.weight
+      },
+      children: [
+        metrics.image && /* @__PURE__ */ jsx("div", { className: "ts-mindmap-image", style: { height: metrics.image.h }, children: image ? /* @__PURE__ */ jsx("img", { src: image, alt: node.image?.alt ?? "" }) : /* @__PURE__ */ jsx("span", { children: node.image?.alt }) }),
+        /* @__PURE__ */ jsxs("div", { className: "ts-mindmap-label", children: [
+          /* @__PURE__ */ jsx("span", { dir: "auto", children: metrics.lines.map((line, i) => (
+            // Lines are the measured wrap, so the box fits them exactly; the same line can repeat.
+            // biome-ignore lint/suspicious/noArrayIndexKey: lines have no identity of their own.
+            /* @__PURE__ */ jsx("span", { children: line }, i)
+          )) }),
+          laid.hidden > 0 && /* @__PURE__ */ jsxs("span", { className: "ts-mindmap-badge", style: { fontSize: size * 0.7 }, children: [
+            "+",
+            laid.hidden
+          ] })
+        ] }),
+        depth > 0 && /* @__PURE__ */ jsx(Handle, { type: "target", position: inner, isConnectable: false }),
+        depth === 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Handle, { id: "right", type: "source", position: Position.Right, isConnectable: false }),
+          /* @__PURE__ */ jsx(Handle, { id: "left", type: "source", position: Position.Left, isConnectable: false })
+        ] }) : /* @__PURE__ */ jsx(Handle, { type: "source", position: outer, isConnectable: false })
+      ]
+    }
+  );
+};
+var Branch = ({ data, style }) => {
+  const [x1, y1, x2, y2] = data?.points ?? [0, 0, 0, 0];
+  const mx = (x1 + x2) / 2;
+  return /* @__PURE__ */ jsx(BaseEdge, { path: `M${x1},${y1} C${mx},${y1} ${mx},${y2} ${x2},${y2}`, ...style ? { style } : {} });
+};
+var nodeTypes = { topic: Topic };
+var edgeTypes = { branch: Branch };
+var useImages = (file) => {
+  const urls = useRef(/* @__PURE__ */ new Map());
+  useEffect(() => {
+    const map = urls.current;
+    return () => {
+      for (const url of map.values()) if (url) URL.revokeObjectURL(url);
+      map.clear();
+    };
+  }, []);
+  return useCallback(
+    (src) => {
+      const map = urls.current;
+      if (!map.has(src)) {
+        const content = file(src);
+        map.set(src, content instanceof Uint8Array ? URL.createObjectURL(new Blob([content])) : null);
+      }
+      return map.get(src) ?? null;
+    },
+    [file]
+  );
+};
+var MindMapView = ({ data, isIncomplete, file }) => {
+  const wrapper = useRef(null);
+  const [font, setFont] = useState(null);
+  const [toggled, setToggled] = useState(/* @__PURE__ */ new Map());
+  const image = useImages(file);
+  const flow = useReactFlow();
+  const width = useStore((s) => s.width);
+  const height = useStore((s) => s.height);
+  const moved = useRef(false);
+  useLayoutEffect(() => {
+    const el = wrapper.current;
+    if (!el) return;
+    adoptCss(el, XYFLOW_CSS);
+    adoptCss(el, MINDMAP_CSS);
+    setFont(getComputedStyle(el).fontFamily);
+  }, []);
+  const closed = useCallback((id, n) => toggled.get(id) ?? n.collapsed === true, [toggled]);
+  const { nodes, edges } = useMemo(() => {
+    if (font === null) return { nodes: [], edges: [] };
+    const metrics = /* @__PURE__ */ new WeakMap();
+    const layout = layoutMindMap(data, closed, (n, depth, hidden) => {
+      const m = measureNode(n, depth, hidden, data, font);
+      metrics.set(n, m);
+      return m;
+    });
+    const nodes2 = layout.nodes.map((laid) => {
+      const kids = laid.node.children?.length ?? 0;
+      const open = kids > 0 && !closed(laid.id, laid.node);
+      return {
+        id: laid.id,
+        type: "topic",
+        position: { x: laid.x, y: laid.y },
+        width: laid.w,
+        height: laid.h,
+        data: {
+          laid,
+          metrics: metrics.get(laid.node),
+          image: laid.node.image && data.style === "visual" ? image(laid.node.image.src) : null,
+          open
+        },
+        draggable: false,
+        selectable: false,
+        connectable: false,
+        ariaLabel: kids > 0 ? `${laid.node.label} (${open ? "expanded" : `collapsed, ${laid.hidden} hidden`})` : laid.node.label || " "
+      };
+    });
+    const edges2 = layout.edges.map((e) => ({
+      id: e.id,
+      type: "branch",
+      data: { points: e.points },
+      source: e.source,
+      target: e.target,
+      ...e.source === "0" ? { sourceHandle: e.side } : {},
+      focusable: false,
+      selectable: false,
+      style: { stroke: e.color, strokeWidth: 1.2 * PX }
+    }));
+    return { nodes: nodes2, edges: edges2 };
+  }, [data, font, closed, image]);
+  const ids = nodes.map((n) => n.id).join(" ");
+  useEffect(() => {
+    if (!moved.current && ids && width && height) void flow.fitView({ padding: 0.05 });
+  }, [flow, ids, width, height]);
+  const toggle = (id) => {
+    const n = nodes.find((m) => m.id === id);
+    if (!n?.data.laid.node.children?.length) return;
+    setToggled((t) => new Map(t).set(id, n.data.open));
+  };
+  const onKeyDown = (event) => {
+    if (event.key !== "Enter" && event.key !== " ") return;
+    const id = event.target.closest?.(".react-flow__node")?.getAttribute("data-id");
+    if (!id) return;
+    event.preventDefault();
+    toggle(id);
+  };
+  return (
+    // A figure, as the drawing it covers; keys from its nodes bubble up to open and close them.
+    /* @__PURE__ */ jsx(
+      "figure",
+      {
+        ref: wrapper,
+        className: "ts-mindmap",
+        "aria-label": data.root.label,
+        "aria-busy": isIncomplete,
+        onKeyDown,
+        children: font !== null && /* @__PURE__ */ jsx(
+          ReactFlow,
+          {
+            nodes,
+            edges,
+            nodeTypes,
+            edgeTypes,
+            colorMode: "light",
+            proOptions: { hideAttribution: true },
+            fitView: true,
+            fitViewOptions: { padding: 0.05 },
+            minZoom: 0.1,
+            maxZoom: 4,
+            nodesDraggable: false,
+            nodesConnectable: false,
+            elementsSelectable: false,
+            edgesFocusable: false,
+            zoomOnScroll: false,
+            panOnScroll: false,
+            preventScrolling: false,
+            zoomOnDoubleClick: false,
+            onNodeClick: (_, n) => toggle(n.id),
+            onMoveStart: (event) => {
+              if (event) moved.current = true;
+            },
+            children: height >= 140 && /* @__PURE__ */ jsx(Controls, { showInteractive: false, position: "bottom-left" })
+          }
+        )
+      }
+    )
+  );
+};
+var MindMapFlow = (props) => /* @__PURE__ */ jsx(ReactFlowProvider, { children: /* @__PURE__ */ jsx(MindMapView, { ...props }) });
+var flow_default = MindMapFlow;
+export {
+  flow_default as default
+};

package/dist/index.d.ts

@@ -0,0 +1,78 @@
+import { TypstreamPlugin, FunctionDoc, PromptExample, IslandSpec } from '@typstream/core';
+
+/** The Typst package's version, as in its `typst.toml`. */
+declare const MINDMAP_VERSION = "0.1.0";
+/**
+ * The package spec the mind map's files are mounted under: `${MINDMAP_ROOT}/lib.typ` and so on,
+ * a local package the engine reads from the files the plugin mounts (as `@typstream/edu`'s).
+ */
+declare const MINDMAP_ROOT = "@typstream/mindmap:0.1.0";
+/** The Typst sources and `typst.toml`, keyed by their path in the engine (under {@link MINDMAP_ROOT}). */
+declare const mindmapFiles: Readonly<Record<string, string>>;
+/** Typst to put before a document: imports `mindmap` and `topic`. */
+declare const mindmapPreamble: string;
+/** One entry per public function, from the doc comments in `typst/`. */
+declare const mindmapCatalogue: FunctionDoc[];
+/** Whole documents with mind maps, for few-shot prompts. */
+declare const mindmapExamples: PromptExample[];
+/**
+ * How to write mind maps, for the system prompt. They follow what models get wrong about lists
+ * in Typst, and the content rules of teachers' mind maps: short labels, a logical order,
+ * colours and images only where they mean something.
+ */
+declare const mindmapPromptRules: string[];
+/** A node of a mind map, as the marker carries it: every value resolved by the Typst side. */
+interface MindMapNode {
+    /** Its label as plain text (math's sub- and superscripts as Unicode). */
+    label: string;
+    /** Its colour, `#rrggbb` or `#rrggbbaa`: border, tint, and the lines to its children. */
+    color: string;
+    /** Text size, in points. */
+    size: number;
+    /** Font weight: `bold`, `regular`, or a number from 100 to 900. */
+    weight: "bold" | "regular" | number;
+    /** On a main branch: the side of the centre it is drawn on. */
+    side?: "left" | "right";
+    /** An image above the label: the path the document named (a URL, a file) and its caption. */
+    image?: {
+        src: string;
+        alt: string;
+    };
+    /** Its branches start hidden. */
+    collapsed?: boolean;
+    /** Its branches, in order; a collapsed node's too, which the interactive map can open. */
+    children?: MindMapNode[];
+}
+/** A mind map island's data. */
+interface MindMapData {
+    /** The format's version. */
+    v: 1;
+    /** `visual` (colours, images) or `text-focused` (neutral, no images, wider labels). */
+    style: "visual" | "text-focused";
+    /** Branches on both sides of the centre, or all on one. */
+    layout: "both" | "right";
+    /** The text direction; a one-sided map grows in it. */
+    dir: "ltr" | "rtl";
+    /** The text size of the main branches, in points; other sizes are relative to it. */
+    size: number;
+    /** The centre topic. */
+    root: MindMapNode;
+}
+/** The most nodes a map may have; a larger one keeps its fallback drawing. */
+declare const MAX_NODES = 2000;
+/**
+ * Checks a mind map marker's data, which the document wrote and is untrusted: the shape the Typst
+ * side writes, with sizes, colours and lengths in range. `undefined` for anything else, which
+ * keeps the fallback drawing.
+ */
+declare const parseMindMap: (data: unknown) => MindMapData | undefined;
+/** The island's spec: what the plugin declares under `islands.mindmap`. @beta */
+declare const mindmapIsland: IslandSpec<MindMapData>;
+/**
+ * Mind maps as a typstream plugin: the Typst package and its preamble for the engine, the prompt
+ * kit, and the `mindmap` island. Pair it with `@typstream/mindmap/react`'s `MindMapIsland` for
+ * the interactive map; without it, documents show the drawing.
+ */
+declare const mindmap: TypstreamPlugin;
+
+export { MAX_NODES, MINDMAP_ROOT, MINDMAP_VERSION, type MindMapData, type MindMapNode, mindmap, mindmapCatalogue, mindmapExamples, mindmapFiles, mindmapIsland, mindmapPreamble, mindmapPromptRules, parseMindMap };