react-cheminfo 0.65.0 → 0.67.0

package/src/molecule3d/ui/useImageExport.ts

@@ -5,6 +5,7 @@ import type { FigureNotice } from '../../download/core/copyFigure.ts';
 import { copyFigure } from '../../download/core/copyFigure.ts';
 import type { FigureFormat } from '../../download/core/downloadFigure.ts';
 import type { FigurePixels } from '../../download/core/figureScale.ts';
+import { DEFAULT_FRAMES_PER_SECOND } from '../core/animatedPng.ts';
 
 import type { SceneCapture } from './exportMoleculeImage.ts';
 import {
@@ -16,8 +17,15 @@ import {
 export interface ImageExport {
   /** Size of the canvas on screen, or `null` before it is laid out. */
   canvasSize: () => FigurePixels | null;
-  /** Render the scene at `scale` and download it as `format`. */
-  exportImage: (format: FigureFormat, scale: number) => Promise<void>;
+  /**
+   * Render the scene at `scale` and download it as `format` — every frame of
+   * it, as an animated PNG, when `animated` is set and the format is PNG.
+   */
+  exportImage: (
+    format: FigureFormat,
+    scale: number,
+    animated?: boolean,
+  ) => Promise<void>;
   /**
    * Render the scene at `scale` and put it on the clipboard as a PNG. Call it
    * from the click itself: Safari only allows a write the click started.
@@ -30,12 +38,15 @@ export interface ImageExport {
  * @param container - The element molstar draws into.
  * @param viewerRef - The viewer, once created.
  * @param fileName - File name without its extension.
+ * @param framesPerSecond - How fast an animated PNG plays its frames.
+ * @default 25
  * @returns See {@link ImageExport}.
  */
 export function useImageExport(
   container: HTMLDivElement | null,
   viewerRef: RefObject<SceneCapture | null>,
   fileName: string,
+  framesPerSecond = DEFAULT_FRAMES_PER_SECOND,
 ): ImageExport {
   const canvasSize = useCallback((): FigurePixels | null => {
     if (container === null) return null;
@@ -45,15 +56,21 @@ export function useImageExport(
   }, [container]);
 
   const exportImage = useCallback(
-    async (format: FigureFormat, scale: number) => {
+    async (format: FigureFormat, scale: number, animated = false) => {
       const viewer = viewerRef.current;
       const size = canvasSize();
       if (viewer === null || size === null) {
         throw new Error('There is no picture to export yet.');
       }
-      await exportMoleculeImage(viewer, { format, scale, size, fileName });
+      await exportMoleculeImage(viewer, {
+        format,
+        scale,
+        size,
+        fileName,
+        framesPerSecond: animated ? framesPerSecond : undefined,
+      });
     },
-    [canvasSize, viewerRef, fileName],
+    [canvasSize, viewerRef, fileName, framesPerSecond],
   );
 
   const copyImage = useCallback(

package/src/molecule3d/ui/useMoleculeScene.ts

@@ -12,8 +12,9 @@
 import type { RefObject } from 'react';
 import { useCallback, useEffect, useRef } from 'react';
 
+import type { Molecule3DFile } from '../core/file.ts';
 import type { Measurement } from '../core/measurement.ts';
-import type { Molecule3DFile, Molecule3DSettings } from '../core/settings.ts';
+import type { Molecule3DSettings } from '../core/settings.ts';
 
 import type { MoleculeViewer3DProps } from './moleculeViewer3DProps.ts';
 import { SceneDrawer } from './sceneDrawer.ts';

package/src/molecule3d/ui/useMoleculeViewer.ts

@@ -0,0 +1,46 @@
+/**
+ * The molstar viewer of one canvas: created once its element exists, kept to
+ * the element's size, and disposed with it.
+ */
+
+import type { RefObject } from 'react';
+import { useEffect, useRef } from 'react';
+
+import { createMolecule3DViewer } from './createViewer.ts';
+import type { Molecule3DViewer } from './viewer.ts';
+import type { Molecule3DViewerOptions } from './viewerTypes.ts';
+
+/**
+ * Mount a viewer in `container` for as long as it exists.
+ * @param container - The element molstar draws in, or `null` before it exists.
+ * @param options - Read when the viewer is created; a later change is ignored,
+ * so a callback reads what it needs from a ref of its own.
+ * @returns The viewer, holding `null` while there is none.
+ */
+export function useMoleculeViewer(
+  container: HTMLElement | null,
+  options: Molecule3DViewerOptions,
+): RefObject<Molecule3DViewer | null> {
+  const viewerRef = useRef<Molecule3DViewer | null>(null);
+  const latestOptions = useRef(options);
+  useEffect(() => {
+    latestOptions.current = options;
+  });
+
+  useEffect(() => {
+    if (container === null) return;
+    const viewer = createMolecule3DViewer(container, latestOptions.current);
+    viewerRef.current = viewer;
+    const observer = new ResizeObserver(() => {
+      viewer.handleResize();
+    });
+    observer.observe(container);
+    return () => {
+      observer.disconnect();
+      viewerRef.current = null;
+      viewer.dispose();
+    };
+  }, [container]);
+
+  return viewerRef;
+}

package/src/molecule3d/ui/usePolarSurfaceArea.ts

@@ -1,14 +1,14 @@
 import { useEffect, useState } from 'react';
 
-import type { Molecule3DFile } from '../core/settings.ts';
+import type { Molecule3DFile } from '../core/file.ts';
 
 /**
  * Ertl's topological polar surface area of the molecule, from openchemlib,
  * loaded only once a caller asks for it.
  * @param molfile - The molecule, or `null`.
  * @param enabled - Whether to compute it at all.
- * @returns The area in Ų, or `null` while unknown, disabled, or when
- * openchemlib is not installed or cannot read the molfile.
+ * @returns The area in Ų, or `null` while unknown, disabled, for an XYZ
+ * file, or when openchemlib is not installed or cannot read the molfile.
  */
 export function usePolarSurfaceArea(
   molfile: Molecule3DFile | null,
@@ -18,7 +18,9 @@ export function usePolarSurfaceArea(
     data: string;
     area: number | null;
   } | null>(null);
-  const data = enabled ? (molfile?.data ?? null) : null;
+  // An XYZ file has no bonds for openchemlib to find the polar atoms by.
+  const data =
+    enabled && molfile?.format !== 'xyz' ? (molfile?.data ?? null) : null;
 
   useEffect(() => {
     if (data === null) return;

package/src/molecule3d/ui/viewer.ts

@@ -8,7 +8,6 @@
  * is the component's.
  */
 
-import type { PluginContext } from 'molstar/lib/mol-plugin/context.js';
 import { Color } from 'molstar/lib/mol-util/color/color.js';
 
 import {
@@ -24,11 +23,12 @@ import {
 } from '../../molstar/core/index.ts';
 import type { Molecule3DCamera } from '../core/camera.ts';
 import type { ImageSize } from '../core/exportImage.ts';
+import type { Molecule3DFile } from '../core/file.ts';
 import type { Molecule3DHighlight } from '../core/highlight.ts';
 import type { Measurement, MeasurementKind } from '../core/measurement.ts';
-import type { Molecule3DFile } from '../core/settings.ts';
 
 import { applyCamera, resetCamera, watchCamera } from './camera.ts';
+import { MoleculeFrames } from './moleculeFrames.ts';
 import {
   MODEL_REPRESENTATION_REF,
   clearMolecule,
@@ -54,16 +54,24 @@ export class Molecule3DViewer {
   /** Resolves once the canvas exists; every method awaits it internally. */
   readonly ready: Promise<void>;
 
+  /** The frames of the file on screen: playing them, and their pictures. */
+  readonly frames: MoleculeFrames;
+
   /**
    * Mount the canvas and start initialising the plugin.
    * @param container - A positioned element.
    * @param options - See {@link Molecule3DViewerOptions}.
    */
   constructor(container: HTMLElement, options: Molecule3DViewerOptions = {}) {
-    const { background, onMeasure = ignore } = options;
+    const {
+      background,
+      onMeasure = ignore,
+      onFrameCountChange = ignore,
+    } = options;
     this.#plugin = new MolstarPlugin(container, { background });
     this.ready = this.#plugin.ready;
-    // Registered before any `#run`, so the picker exists by the time one runs.
+    this.frames = new MoleculeFrames(this.#plugin, onFrameCountChange);
+    // Registered before any other `run`, so the picker exists by the time one runs.
     void this.#plugin
       .run((plugin) => {
         this.#picker = new MeasurementPicker(
@@ -84,10 +92,12 @@ export class Molecule3DViewer {
    * @throws {Error} When the file parses to zero atoms.
    */
   showMolecule(molfile: Molecule3DFile, style?: MoleculeStyle): Promise<void> {
-    return this.#run(async (plugin) => {
-      await clearMeasurements(plugin);
-      await renderMolecule(plugin, molfile, style);
-    });
+    return this.#plugin.run((plugin) =>
+      this.frames.redraw(plugin, async () => {
+        await clearMeasurements(plugin);
+        return renderMolecule(plugin, molfile, style);
+      }),
+    );
   }
 
   /**
@@ -95,10 +105,13 @@ export class Molecule3DViewer {
    * @returns Nothing; resolves once the scene is empty.
    */
   hideMolecule(): Promise<void> {
-    return this.#run(async (plugin) => {
-      await clearMeasurements(plugin);
-      await clearMolecule(plugin);
-    });
+    return this.#plugin.run((plugin) =>
+      this.frames.redraw(plugin, async () => {
+        await clearMeasurements(plugin);
+        await clearMolecule(plugin);
+        return 0;
+      }),
+    );
   }
 
   /**
@@ -107,7 +120,7 @@ export class Molecule3DViewer {
    * @returns Nothing; resolves once the surface is on screen.
    */
   showSurface(style?: SurfaceStyle): Promise<void> {
-    return this.#run((plugin) => renderSurface(plugin, style));
+    return this.#plugin.run((plugin) => renderSurface(plugin, style));
   }
 
   /**
@@ -115,7 +128,7 @@ export class Molecule3DViewer {
    * @returns Nothing; resolves once the surface is gone.
    */
   hideSurface(): Promise<void> {
-    return this.#run((plugin) => clearSurface(plugin));
+    return this.#plugin.run((plugin) => clearSurface(plugin));
   }
 
   /**
@@ -124,7 +137,7 @@ export class Molecule3DViewer {
    * @returns Nothing; resolves once the labels are on screen.
    */
   showMeasurements(measurements: readonly Measurement[]): Promise<void> {
-    return this.#run((plugin) =>
+    return this.#plugin.run((plugin) =>
       renderMeasurements(plugin, measurements, moleculeStructure),
     );
   }
@@ -140,7 +153,7 @@ export class Molecule3DViewer {
     highlights: readonly Molecule3DHighlight[],
     color: string,
   ): Promise<void> {
-    return this.#run(() => {
+    return this.#plugin.run(() => {
       this.#painter?.set(highlights, Color.fromHexStyle(color));
     });
   }
@@ -151,7 +164,7 @@ export class Molecule3DViewer {
    * @returns Nothing; resolves once the plugin has switched mode.
    */
   setMeasureKind(kind: MeasurementKind | null): Promise<void> {
-    return this.#run(() => {
+    return this.#plugin.run(() => {
       this.#picker?.setKind(kind);
     });
   }
@@ -164,7 +177,7 @@ export class Molecule3DViewer {
    * @throws {Error} When the plugin has no screenshot helper.
    */
   captureImage(size: ImageSize): Promise<string | undefined> {
-    return this.#run((plugin) => captureScene(plugin, size));
+    return this.#plugin.run((plugin) => captureScene(plugin, size));
   }
 
   /**
@@ -177,7 +190,7 @@ export class Molecule3DViewer {
     durationMilliseconds = DEFAULT_CAMERA_DURATION,
     fromFront = false,
   ): Promise<void> {
-    return this.#run((plugin) => {
+    return this.#plugin.run((plugin) => {
       resetCamera(plugin, durationMilliseconds, fromFront);
     });
   }
@@ -189,7 +202,7 @@ export class Molecule3DViewer {
    * @returns Nothing; resolves once the move has been ordered.
    */
   setCamera(camera: Molecule3DCamera, durationMilliseconds = 0): Promise<void> {
-    return this.#run((plugin) => {
+    return this.#plugin.run((plugin) => {
       applyCamera(plugin, camera, durationMilliseconds);
     });
   }
@@ -211,7 +224,7 @@ export class Molecule3DViewer {
    * @returns Nothing; resolves once the trackball has been reconfigured.
    */
   setSpin(spinning: boolean, speed = DEFAULT_SPIN_SPEED): Promise<void> {
-    return this.#run((plugin) => {
+    return this.#plugin.run((plugin) => {
       setSpin(plugin, spinning, speed);
     });
   }
@@ -227,12 +240,6 @@ export class Molecule3DViewer {
     this.#painter?.dispose();
     this.#plugin.dispose();
   }
-
-  #run<Result>(
-    action: (plugin: PluginContext) => Result | Promise<Result>,
-  ): Promise<Result | undefined> {
-    return this.#plugin.run(action);
-  }
 }
 
 function ignore(): void {

package/src/molecule3d/ui/viewerTypes.ts

@@ -19,6 +19,12 @@ export interface Molecule3DViewerOptions {
    * @default undefined
    */
   onMeasure?: (measurement: Measurement) => void;
+  /**
+   * Called with how many frames the file on screen holds, each time a file is
+   * drawn, and with 0 once the scene is emptied.
+   * @default undefined
+   */
+  onFrameCountChange?: (frameCount: number) => void;
 }
 
 /** How to draw the model. */

package/src/molstar/core/captureScene.ts

@@ -1,11 +1,22 @@
 /**
- * A picture of the scene, rendered off screen at a size of its own.
+ * A picture of the scene, rendered off screen at a size of its own — one
+ * frame, or every frame of the trajectory on screen.
  */
 
 import type { PluginContext } from 'molstar/lib/mol-plugin/context.js';
+import type { ViewportScreenshotHelper } from 'molstar/lib/mol-plugin/util/viewport-screenshot.js';
+import { Task } from 'molstar/lib/mol-task/index.js';
 
 import type { ImageSize } from '../../molecule3d/core/exportImage.ts';
 
+import {
+  setTrajectoryPlayback,
+  showTrajectoryFrame,
+  shownTrajectoryFrame,
+  stopTrajectory,
+  trajectoryFrameCount,
+} from './trajectory.ts';
+
 /**
  * Render the scene without its selection highlights or its axes.
  * @param plugin - The molstar context.
@@ -17,6 +28,78 @@ export async function captureScene(
   plugin: PluginContext,
   size: ImageSize,
 ): Promise<string> {
+  return pictureHelper(plugin, size).getImageDataUri();
+}
+
+/** How a series of frames is played, so it can be resumed once captured. */
+export interface FramePlayback {
+  playing: boolean;
+  framesPerSecond: number;
+}
+
+/**
+ * Render every frame of the trajectory on screen, in order, as the scene shows
+ * it: the model, its surface and the measurements over it, each at that frame.
+ * The animation is stopped while the frames are taken and resumed afterwards,
+ * and the scene is left on the frame it showed.
+ * @param plugin - The molstar context.
+ * @param size - Pixel size of each picture.
+ * @param playback - What to resume once the frames are taken.
+ * @returns One picture per frame; a scene of one model gives one.
+ * @throws {Error} When the plugin has no screenshot helper.
+ */
+export async function captureFrames(
+  plugin: PluginContext,
+  size: ImageSize,
+  playback: FramePlayback,
+): Promise<ImageData[]> {
+  const pass = pictureHelper(plugin, size).imagePass;
+  const loop = plugin.animationLoop;
+  const shown = shownTrajectoryFrame(plugin);
+  const count = Math.max(1, trajectoryFrameCount(plugin));
+  await stopTrajectory(plugin);
+  loop.stop({ noDraw: true });
+  try {
+    await pass.updateBackground();
+    const frames: ImageData[] = [];
+    for (let index = 0; index < count; index++) {
+      // eslint-disable-next-line no-await-in-loop -- each frame is a commit of the state tree, and commits must not interleave
+      if (count > 1) await showTrajectoryFrame(plugin, index);
+      // The scene is otherwise committed on the next animation frame, after
+      // the picture has been taken of the previous one.
+      plugin.canvas3d?.commit(true);
+      // eslint-disable-next-line no-await-in-loop -- one render at a time on the one image pass
+      const image = await plugin.runTask(
+        Task.create('Render a frame', (runtime) =>
+          pass.getImageData(runtime, size.width, size.height),
+        ),
+      );
+      frames.push(image);
+    }
+    return frames;
+  } finally {
+    if (count > 1) await showTrajectoryFrame(plugin, shown);
+    loop.start({ immediate: true });
+    await setTrajectoryPlayback(
+      plugin,
+      playback.playing,
+      playback.framesPerSecond,
+    );
+  }
+}
+
+/**
+ * The screenshot helper, set to draw a picture of `size` with no axes and an
+ * opaque background.
+ * @param plugin - The molstar context.
+ * @param size - Pixel size of the picture.
+ * @returns The helper.
+ * @throws {Error} When the plugin has no screenshot helper.
+ */
+function pictureHelper(
+  plugin: PluginContext,
+  size: ImageSize,
+): ViewportScreenshotHelper {
   const helper = plugin.helpers.viewportScreenshot;
   if (helper === undefined) {
     throw new Error('This viewer cannot take a picture of its scene.');
@@ -27,5 +110,5 @@ export async function captureScene(
     axes: { name: 'off', params: {} },
     transparent: false,
   });
-  return helper.getImageDataUri();
+  return helper;
 }

package/src/molstar/core/index.ts

@@ -1,6 +1,7 @@
 /**
  * The molstar layer under the 3D views: the plugin lifecycle, the camera, the
- * hover labels, the measurements, the highlights and the picture of a scene.
+ * hover labels, the measurements, the highlights, the frames of a trajectory
+ * and the picture of a scene.
  *
  * Three of our sites mount a headless molstar canvas — the molecule viewer
  * here, lcao's orbitals and symmetry's crystals — and each of them had its own
@@ -49,7 +50,8 @@ export {
 } from './hover.ts';
 export type { MolstarPluginOptions } from './plugin.ts';
 export { MolstarPlugin } from './plugin.ts';
-export { captureScene } from './captureScene.ts';
+export type { FramePlayback } from './captureScene.ts';
+export { captureFrames, captureScene } from './captureScene.ts';
 export type { MoleculeStructureSource } from './measurements.ts';
 export {
   MeasurementPicker,
@@ -57,3 +59,12 @@ export {
   clearMeasurements,
   renderMeasurements,
 } from './measurements.ts';
+export {
+  PLAYBACK_FPS_RANGE,
+  clampFramesPerSecond,
+  setTrajectoryPlayback,
+  showTrajectoryFrame,
+  shownTrajectoryFrame,
+  stopTrajectory,
+  trajectoryFrameCount,
+} from './trajectory.ts';

package/src/molstar/core/trajectory.ts

@@ -0,0 +1,117 @@
+/**
+ * The frames of a trajectory: how many there are, which one is shown, and
+ * playing them in a loop.
+ *
+ * molstar keeps a trajectory as one data node and shows one of its frames
+ * through a `ModelFromTrajectory` node whose `modelIndex` says which. Playing
+ * is molstar's own model-index animation, which steps that index; showing one
+ * frame sets it.
+ */
+
+import type { PluginContext } from 'molstar/lib/mol-plugin/context.js';
+import { AnimateModelIndex } from 'molstar/lib/mol-plugin-state/animation/built-in/model-index.js';
+import { PluginStateObject } from 'molstar/lib/mol-plugin-state/objects.js';
+import { ModelFromTrajectory } from 'molstar/lib/mol-plugin-state/transforms/model.js';
+import { StateSelection } from 'molstar/lib/mol-state/index.js';
+
+/** How fast molstar's model-index animation can step, frames per second. */
+export const PLAYBACK_FPS_RANGE = { minimum: 5, maximum: 60 } as const;
+
+/**
+ * How many frames the trajectory on screen holds.
+ * @param plugin - The molstar context.
+ * @returns The most frames of any trajectory shown; 0 when none is.
+ */
+export function trajectoryFrameCount(plugin: PluginContext): number {
+  const state = plugin.state.data;
+  let count = 0;
+  for (const model of modelCells(plugin)) {
+    const trajectory = StateSelection.findAncestorOfType(
+      state.tree,
+      state.cells,
+      model.transform.ref,
+      PluginStateObject.Molecule.Trajectory,
+    );
+    count = Math.max(count, trajectory?.obj?.data.frameCount ?? 0);
+  }
+  return count;
+}
+
+/**
+ * Show one frame of every trajectory on screen, and everything built on it:
+ * the drawn model, its surface and the measurements over it.
+ * @param plugin - The molstar context.
+ * @param index - The frame, from 0.
+ * @returns Nothing; resolves once the state tree is updated.
+ */
+export async function showTrajectoryFrame(
+  plugin: PluginContext,
+  index: number,
+): Promise<void> {
+  const update = plugin.build();
+  for (const model of modelCells(plugin)) {
+    update.to(model).update({ modelIndex: index });
+  }
+  await update.commit();
+}
+
+/**
+ * The frame on screen.
+ * @param plugin - The molstar context.
+ * @returns The index of the frame the first trajectory shows; 0 when none is.
+ */
+export function shownTrajectoryFrame(plugin: PluginContext): number {
+  return modelCells(plugin)[0]?.transform.params?.modelIndex ?? 0;
+}
+
+/**
+ * Play the frames in a loop, or stop them where they stand.
+ * @param plugin - The molstar context.
+ * @param playing - Whether to play. A trajectory of one frame never plays.
+ * @param framesPerSecond - How fast, clamped into {@link PLAYBACK_FPS_RANGE}.
+ * @returns Nothing; resolves once the animation is started or stopped.
+ */
+export async function setTrajectoryPlayback(
+  plugin: PluginContext,
+  playing: boolean,
+  framesPerSecond: number,
+): Promise<void> {
+  if (!playing || trajectoryFrameCount(plugin) < 2) {
+    await stopTrajectory(plugin);
+    return;
+  }
+  await plugin.managers.animation.play(AnimateModelIndex, {
+    mode: { name: 'loop', params: { direction: 'forward' } },
+    duration: {
+      name: 'sequential',
+      params: { maxFps: clampFramesPerSecond(framesPerSecond) },
+    },
+  });
+}
+
+/**
+ * Stop the frames where they stand.
+ * @param plugin - The molstar context.
+ * @returns Nothing; resolves once the animation is stopped.
+ */
+export async function stopTrajectory(plugin: PluginContext): Promise<void> {
+  const animation = plugin.managers.animation;
+  if (animation.isAnimating) await animation.stop();
+}
+
+/**
+ * A frame rate molstar's model-index animation accepts.
+ * @param framesPerSecond - Any rate.
+ * @returns The rate, rounded and clamped into {@link PLAYBACK_FPS_RANGE}.
+ */
+export function clampFramesPerSecond(framesPerSecond: number): number {
+  const { minimum, maximum } = PLAYBACK_FPS_RANGE;
+  if (!Number.isFinite(framesPerSecond)) return minimum;
+  return Math.min(maximum, Math.max(minimum, Math.round(framesPerSecond)));
+}
+
+function modelCells(plugin: PluginContext) {
+  return plugin.state.data.select(
+    StateSelection.Generators.ofTransformer(ModelFromTrajectory),
+  );
+}

package/src/panel/ui/PanelRail.tsx

@@ -55,6 +55,9 @@ export function PanelRail<TId extends string>(
           id={panel.id}
           icon={panel.icon}
           tooltip={panel.title}
+          // A tooltip is not an accessible name: without this every toggle is
+          // an icon-only button with no name at all.
+          aria-label={panel.title}
           active={openIds.includes(panel.id)}
           onClick={() => onToggle(panel.id)}
         />

package/src/raman.ts

@@ -0,0 +1,20 @@
+/**
+ * Displaying Raman spectra: the infrared viewer, read for Raman.
+ *
+ * A door of its own so a page showing Raman spectra imports a Raman viewer by
+ * name. What it opens is the same code as `react-cheminfo/ir` — one shell, one
+ * set of panels — and the same spectrum model, which a host fills with an
+ * `intensity` array where an infrared spectrum carries absorbance and
+ * transmittance.
+ */
+
+export type { LoadedIrSpectrum } from './ir/core/analysisSpectra.ts';
+export type { IrEditorHandle, IrPlotClick } from './ir/core/irEditorApi.ts';
+export type { IrSpectrum } from './ir/core/irSpectrum.ts';
+export { toIrSpectra } from './ir/core/toIrSpectrum.ts';
+export type { IrHostPanel } from './ir/ui/irHostPanels.ts';
+export type {
+  RamanEditorHandle,
+  RamanEditorProps,
+} from './ir/ui/RamanEditor.tsx';
+export { RamanEditor } from './ir/ui/RamanEditor.tsx';

package/src/router/core/basePath.ts

@@ -4,8 +4,8 @@ import { trimTrailingSlash } from './address.ts';
  * Where a site is mounted, read off the page rather than off the build.
  *
  * The build is mount-agnostic — vite is given a relative base, so the same
- * `dist` serves `https://surge.cheminfo.org/` and
- * `https://www.cheminfo.org/surge/`. What tells the two apart is the `<base>`
+ * `dist` serves `https://isomers.cheminfo.org/` and
+ * `https://www.cheminfo.org/isomers/`. What tells the two apart is the `<base>`
  * the deployment stamps into the page it hands out, and `document.baseURI`
  * resolves it against the address actually opened. So this answers correctly
  * whether or not a slash closes the address, and on an address the SPA

package/src/router/core/siteAddresses.ts

@@ -16,7 +16,7 @@ import {
  *
  * The mount is read off the page, not off the build: the build carries no
  * mount, and the `<base>` a deployment stamps into its pages is what tells
- * `https://surge.cheminfo.org/` from `https://www.cheminfo.org/surge/`. Under
+ * `https://isomers.cheminfo.org/` from `https://www.cheminfo.org/isomers/`. Under
  * Node there is no page, and the mount is the root.
  * @param siteId - The site, as `ECOSYSTEM_SITES` names it.
  * @param options - A mount path to use instead of the one read off the page.

package/src/seo/core/siteFiles.ts

@@ -130,7 +130,7 @@ export function originOf(options: SiteOrigin): string {
   const origin = options.origin ?? `https://${resolveSite(options.site).host}`;
   if (!HTTP_ORIGIN.test(origin) || !URL.canParse(origin)) {
     throw new Error(
-      `an origin is an absolute address, e.g. https://surge.cheminfo.org: ${JSON.stringify(origin)}`,
+      `an origin is an absolute address, e.g. https://isomers.cheminfo.org: ${JSON.stringify(origin)}`,
     );
   }
   return trimTrailingSlash(origin);