@lensmap/starlight 0.2.1 → 0.4.0

package/dist/components/MapContent.astro

@@ -10,6 +10,7 @@ interface Props {
   authoredFrontmatter: Record<string, unknown>;
   executable: boolean;
   inspectorId?: string;
+  mapId?: string;
 }
 const { graph: semantic, executable, inspectorId = "default" } = Astro.props;
 const entry = Astro.props.entry ?? Astro.locals.starlightRoute?.entry;
@@ -29,7 +30,7 @@ const publicGraph = {
 };
 ---
 <div data-lensmap-document data-executable={String(executable)}>
-  <div class="not-content"><ViewerHost client:load graph={publicGraph} rendered={rendered} inspectorId={inspectorId} /></div>
+  <div class="not-content"><ViewerHost client:load mapId={Astro.props.mapId} graph={publicGraph} rendered={rendered} inspectorId={inspectorId} /></div>
   <section data-static-thoughts>
     {graph.nodes.map((node) => <section data-thought={node.key}><h2>{node.title}</h2><div set:html={rendered[node.key]} /></section>)}
   </section>

package/dist/index.js

@@ -2,12 +2,27 @@
 import { fileURLToPath } from "node:url";
 import lensmap from "@lensmap/astro-loader";
 function starlightLensmap(options = {}) {
-  return lensmap({
+  const integration = lensmap({
     ...options,
     contentComponent: fileURLToPath(
       new URL("./components/MapContent.astro", import.meta.url)
     )
   });
+  const setup = integration.hooks["astro:config:setup"];
+  integration.hooks["astro:config:setup"] = async (context) => {
+    await setup?.(context);
+    context.updateConfig({
+      vite: {
+        optimizeDeps: {
+          include: [
+            "@lensmap/starlight > @lensmap/document",
+            "@lensmap/starlight > react-markdown"
+          ]
+        }
+      }
+    });
+  };
+  return integration;
 }
 export {
   starlightLensmap as default

package/dist/layout.js

@@ -6,6 +6,15 @@ import {
   forceY
 } from "d3-force";
 
+// ../../apps/web/src/node-style.ts
+function positionAxis(node, axis) {
+  const value = node.style?.[axis];
+  return value === "auto" ? void 0 : value ?? node.position?.[axis];
+}
+function baseRadius(style) {
+  return 43 * (typeof style?.scale === "number" ? style.scale : 1);
+}
+
 // ../../apps/web/src/document/subtree.ts
 import { polygonHull } from "d3-polygon";
 function silhouette(contour, distance, padding) {
@@ -74,8 +83,9 @@ function layoutGraph(nodes, edges) {
   }
   const roots = nodes.filter((node) => !childKeys.has(node.key));
   const placed = /* @__PURE__ */ new Map();
-  const step = 180;
-  const padding = 56;
+  const maximum = Math.max(43, ...nodes.map((n) => n.baseRadius ?? 43));
+  const step = Math.max(180, maximum * 2 + 24);
+  const padding = Math.max(56, maximum + 13);
   function plan(node, isRoot) {
     const descendants = (children.get(node.key) ?? []).map(
       (child) => plan(child, false)
@@ -84,16 +94,17 @@ function layoutGraph(nodes, edges) {
   }
   const plans = roots.map((root) => plan(root, true));
   function seed(node, subtree, point, heading, isRoot) {
-    const actual = node.position ?? point;
-    const fixed = Boolean(node.position) || isRoot;
+    const pinX = positionAxis(node, "x");
+    const pinY = positionAxis(node, "y");
+    const actual = { x: pinX ?? point.x, y: pinY ?? point.y };
     placed.set(node.key, {
       key: node.key,
       x: actual.x,
       y: actual.y,
       targetX: actual.x,
       targetY: actual.y,
-      fx: fixed ? actual.x : void 0,
-      fy: fixed ? actual.y : void 0
+      fx: pinX !== void 0 || isRoot ? actual.x : void 0,
+      fy: pinY !== void 0 || isRoot ? actual.y : void 0
     });
     subtree.children.forEach((placement) => {
       const child = byKey.get(placement.subtree.key);
@@ -106,12 +117,18 @@ function layoutGraph(nodes, edges) {
         x: actual.x + Math.cos(angle) * placement.distance,
         y: actual.y + Math.sin(angle) * placement.distance
       };
-      const childPoint = child.position ?? target;
+      const childPoint = {
+        x: positionAxis(child, "x") ?? target.x,
+        y: positionAxis(child, "y") ?? target.y
+      };
       const direction = childPoint.x === actual.x && childPoint.y === actual.y ? angle : Math.atan2(childPoint.y - actual.y, childPoint.x - actual.x);
       seed(child, placement.subtree, target, direction, false);
     });
   }
-  const anchor = nodes[0].position ?? { x: 0, y: 0 };
+  const anchor = {
+    x: positionAxis(nodes[0], "x") ?? 0,
+    y: positionAxis(nodes[0], "y") ?? 0
+  };
   const rootRadius = roots.length > 1 ? step * 2 / Math.sin(Math.PI / roots.length) : 0;
   roots.forEach((root, index) => {
     const angle = -Math.PI / 2 + Math.PI * 2 * index / roots.length;
@@ -132,12 +149,13 @@ function layoutGraph(nodes, edges) {
   );
   simulation.tick(ticks);
   return {
-    nodes: nodes.map(({ position: _position, ...node }) => {
+    nodes: nodes.map(({ position, ...node }) => {
       const point = placed.get(node.key);
       if (!point)
         throw new Error(`Automatic layout could not place node "${node.key}".`);
       return {
         ...node,
+        ...position ? { position } : {},
         x: point.x,
         y: point.y
       };
@@ -149,7 +167,12 @@ function layoutGraph(nodes, edges) {
 // ../../apps/web/src/semantic-layout.ts
 var branches = ["blue", "amber", "mint", "rose"];
 var layoutKey = (graph) => JSON.stringify({
-  nodes: graph.nodes.map((node) => [node.key, node.position]),
+  nodes: graph.nodes.map((node) => [
+    node.key,
+    positionAxis(node, "x"),
+    positionAxis(node, "y"),
+    baseRadius(node.style)
+  ]),
   edges: graph.edges.map((edge) => [edge.key, edge.from, edge.to, edge.kind])
 });
 function layoutSemanticGraph(graph, previous) {
@@ -177,30 +200,44 @@ function layoutSemanticGraph(graph, previous) {
     colour(node.key, branches[i % branches.length], 0);
   });
   const drafts = graph.nodes.map(
-    ({ key, id, title, markdown, unresolved, position, destination }) => ({
+    ({
       key,
       id,
       title,
       markdown,
       unresolved,
       position,
+      destination,
+      style
+    }) => ({
+      key,
+      id,
+      title,
+      markdown,
+      unresolved,
+      position,
+      style,
+      baseRadius: baseRadius(style),
       ...destination ? { destination } : {},
       branch: colours.get(key) ?? "blue"
     })
   );
-  const edges = graph.edges.map(({ key, from, to, kind, type }) => ({
-    key,
-    from,
-    to,
-    kind,
-    ...type !== void 0 ? { type } : {}
-  }));
+  const edges = graph.edges.map(
+    ({ key, from, to, kind, type, presentation }) => ({
+      key,
+      from,
+      to,
+      kind,
+      ...type !== void 0 ? { type } : {},
+      ...presentation ? { presentation } : {}
+    })
+  );
   if (previous && layoutKey(previous.semantic) === layoutKey(graph)) {
     const points = new Map(
       previous.layout.nodes.map((node) => [node.key, node])
     );
     return {
-      nodes: drafts.map(({ position: _position, ...node }) => ({
+      nodes: drafts.map((node) => ({
         ...node,
         x: points.get(node.key)?.x ?? 0,
         y: points.get(node.key)?.y ?? 0

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.2.1",
+  "version": "0.4.0",
   "type": "module",
   "license": "MIT",
   "files": [
@@ -33,31 +33,31 @@
     "./viewer.css": "./dist/ViewerHost.css"
   },
   "dependencies": {
-    "@lensmap/astro-loader": "0.2.1",
-    "@lensmap/document": "0.2.1",
-    "react-markdown": "10.1.0",
+    "@lensmap/astro-loader": "0.4.0",
+    "@lensmap/document": "0.4.0",
     "d3-force": "3.0.1",
-    "d3-polygon": "3.0.2"
+    "d3-polygon": "3.0.2",
+    "react-markdown": "10.1.0"
   },
   "peerDependencies": {
-    "astro": "7.4.0",
-    "@astrojs/starlight": "0.42.6",
     "@astrojs/react": "6.0.6",
+    "@astrojs/starlight": "0.42.6",
+    "astro": "7.4.0",
     "react": "19.3.1",
     "react-dom": "19.3.1"
   },
   "devDependencies": {
-    "@lensmap/web": "0.0.0",
-    "astro": "7.4.0",
-    "@astrojs/starlight": "0.42.6",
     "@astrojs/react": "6.0.6",
-    "react": "19.3.1",
-    "react-dom": "19.3.1",
+    "@astrojs/starlight": "0.42.6",
+    "@lensmap/web": "0.0.0",
+    "@types/node": "24.19.2",
     "@types/react": "19.3.0",
     "@types/react-dom": "19.3.0",
+    "astro": "7.4.0",
     "esbuild": "0.28.2",
-    "typescript": "7.0.2",
-    "@types/node": "24.19.2"
+    "react": "19.3.1",
+    "react-dom": "19.3.1",
+    "typescript": "7.0.2"
   },
   "scripts": {
     "build": "node build.mjs",