react-cheminfo 0.39.0 → 0.40.0

package/lib/structure/ui/ConformerTable.js

@@ -32,7 +32,7 @@ import { CONFORMER_COLUMN_LABELS, NUMERIC_CONFORMER_COLUMNS, PICKER_COLUMNS, } f
  * @returns The table, or `null` when there is nothing to show.
  */
 export function ConformerTable(props) {
-    const { conformers, columns = PICKER_COLUMNS, ranking = 'force-field', selectedId = null, onSelect, temperature = ROOM_TEMPERATURE, label = 'Conformers, most stable first', rowName = String, columnLabels, } = props;
+    const { conformers, columns = PICKER_COLUMNS, ranking = 'force-field', selectedId = null, onSelect, temperature = ROOM_TEMPERATURE, label = 'Conformers, most stable first', rowName = String, columnLabels, provisional = false, } = props;
     const bodyRef = useRef(null);
     const shares = useMemo(() => {
         if (!columns.includes('population'))
@@ -93,7 +93,7 @@ export function ConformerTable(props) {
                             return copyableHere &&
                                 COPY_LABELS[column] !== undefined &&
                                 typeof content === 'string' &&
-                                content !== '—' ? (_jsx(ClickToCopy, { as: "td", style: cellStyle(column), value: content, label: COPY_LABELS[column], testId: CELL_TEST_IDS[column], children: content }, column)) : (_jsx("td", { style: cellStyle(column), "data-testid": CELL_TEST_IDS[column], children: content }, column));
+                                content !== '—' ? (_jsx(ClickToCopy, { as: "td", style: cellStyle(column, provisional), value: content, label: COPY_LABELS[column], testId: CELL_TEST_IDS[column], children: content }, column)) : (_jsx("td", { style: cellStyle(column, provisional), "data-testid": CELL_TEST_IDS[column], children: content }, column));
                         }) }, conformer.id));
                 }) })] }));
 }
@@ -200,14 +200,34 @@ const ENERGY_RESOLUTION = 0.005;
 function headerStyle(column) {
     return NUMERIC_CONFORMER_COLUMNS.has(column) ? numericStyle : undefined;
 }
-function cellStyle(column) {
-    return NUMERIC_CONFORMER_COLUMNS.has(column) ? numericStyle : undefined;
+/**
+ * A cell's own style: numbers are right-aligned and tabular, and every cell a
+ * better method will restate is muted while it works. The rank is not one of
+ * them — it names the row rather than measuring it, and it is what a reader
+ * follows as the order changes under them.
+ * @param column - The column the cell is in.
+ * @param provisional - Whether the energies are still expected to change.
+ * @returns The cell's inline style, or `undefined` when it needs none.
+ */
+function cellStyle(column, provisional) {
+    const numeric = NUMERIC_CONFORMER_COLUMNS.has(column);
+    if (!provisional || column === 'id') {
+        return numeric ? numericStyle : undefined;
+    }
+    return numeric ? provisionalNumericStyle : provisionalStyle;
 }
 const tableStyle = { width: '100%' };
 const numericStyle = {
     textAlign: 'right',
     fontVariantNumeric: 'tabular-nums',
 };
+const provisionalStyle = {
+    color: 'var(--text-muted)',
+};
+const provisionalNumericStyle = {
+    ...numericStyle,
+    ...provisionalStyle,
+};
 /**
  * The selected row is tinted with the site's own accent, so the table belongs
  * to whichever site draws it; a row is a pointer only where a click does

package/lib/structure/ui/ConformerTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConformerTable.js","sourceRoot":"","sources":["../../../src/structure/ui/ConformerTable.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ConformerTable.js","sourceRoot":"","sources":["../../../src/structure/ui/ConformerTable.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-cheminfo",
-  "version": "0.39.0",
+  "version": "0.40.0",
   "license": "MIT",
   "description": "React components, hooks and framework-free helpers shared by the cheminfo sites: site chrome, citations, sharing, routing, pedagogy, charts, and the structure, orbital and 3D molecule viewers",
   "author": "Luc Patiny",
@@ -20,6 +20,7 @@
     "./core": "./lib/core.js",
     "./ir": "./lib/ir.js",
     "./molecule3d": "./lib/molecule3d.js",
+    "./molstar": "./lib/molstar.js",
     "./orbital": "./lib/orbital.js",
     "./slides": "./lib/slides.js",
     "./spectra": "./lib/spectra.js",

package/src/deploy/core/checkDeploy.ts

@@ -1,6 +1,11 @@
 import { readComposeFile } from './composeFile.ts';
 import { readEnvExample } from './envExample.ts';
 import { readPageCache } from './pageCache.ts';
+import {
+  DOCKER_IMAGE_WORKFLOW,
+  readInstallRetries,
+  readPublishedImage,
+} from './publishedImage.ts';
 import type { CheckDeployOptions, DeployFile, DeployProblem } from './types.ts';
 import { DEPLOY_COMPOSE_FILES } from './types.ts';
 
@@ -13,7 +18,9 @@ import { DEPLOY_COMPOSE_FILES } from './types.ts';
  * reports it healthy. So a repository has to hand it a selectable tag on every
  * image we build, an `IMAGE_NAME` that names the package our own workflow
  * publishes, a compose file that parses on a checkout with no `.env` yet, and a
- * health probe to read. It also has to hand the browser a page the browser will
+ * health probe to read. It also has to publish that image in the first place:
+ * with no `latest` to pull the script builds from source on the deploy host,
+ * and the install that follows must survive a blip in the registry. It also has to hand the browser a page the browser will
  * not keep, or the next deploy leaves returning visitors on a blank one. Each
  * of those is invisible until a deploy, which is the
  * worst moment to discover it — an `env_file` without `required: false` fails
@@ -72,7 +79,12 @@ export function findDeployProblems(
   }
 
   const dockerfile = byPath.get('Dockerfile');
-  if (dockerfile !== undefined) readPageCache(dockerfile, byPath, problems);
+  if (dockerfile !== undefined) {
+    readPageCache(dockerfile, byPath, problems);
+    readInstallRetries(dockerfile, problems);
+  }
+
+  readPublishedImage(byPath.get(DOCKER_IMAGE_WORKFLOW), problems);
 
   const gitignore = byPath.get('.gitignore');
   if (gitignore === undefined || !/^\s*\/?\.deploy\/?\s*$/m.test(gitignore)) {

package/src/deploy/core/index.ts

@@ -6,4 +6,9 @@ export type {
   DeployProblemKind,
 } from './types.ts';
 export { NGINX_CONFIG, PAGE_CACHE_CONFIG } from './pageCache.ts';
+export {
+  DOCKER_IMAGE_WORKFLOW,
+  readInstallRetries,
+  readPublishedImage,
+} from './publishedImage.ts';
 export { DEPLOY_COMPOSE_FILES } from './types.ts';

package/src/deploy/core/publishedImage.ts

@@ -0,0 +1,110 @@
+import type { DeployProblem } from './types.ts';
+
+/** The workflow that publishes this repository's image, at its fixed path. */
+export const DOCKER_IMAGE_WORKFLOW = '.github/workflows/docker-image.yml';
+
+const TAG_VERSION = /^\s*tag-version:\s*(?<value>.+?)\s*$/m;
+const INSTALL = /^\s*RUN\s+npm\s+ci\b/;
+const RETRIES = /^\s*ENV\s+.*\bNPM_CONFIG_FETCH_RETRIES=/;
+const STAGE = /^\s*FROM\s+/i;
+// Written with an escaped brace so it is not read as an interpolation here.
+const GUARDED = `\${{ github.event_name == 'push' && github.ref_name || '' }}`;
+
+/**
+ * Report a repository whose image is never published with a `latest` tag.
+ *
+ * The shared workflow derives `:<version>`, `:<major>.<minor>`, `:<major>` and
+ * `:latest` from `tag-version` alone; given nothing it publishes a single
+ * `:HEAD` and no `latest`. Compose files default to `${IMAGE_TAG:-latest}`, so
+ * the deploy then has nothing to pull and builds the image on the deploy host
+ * instead — which is how a registry blip, a build timeout or an out-of-memory
+ * kill becomes an outage, reported against npm rather than against the missing
+ * tag. The workflow, the release and the push all succeed, so nothing says so.
+ * @param workflow - The docker-image workflow, or undefined when there is none.
+ * @param problems - Where each problem found is appended.
+ */
+export function readPublishedImage(
+  workflow: string | undefined,
+  problems: DeployProblem[],
+): void {
+  if (workflow === undefined) {
+    problems.push({
+      file: DOCKER_IMAGE_WORKFLOW,
+      line: 0,
+      kind: 'unpublishable-image',
+      message:
+        'nothing publishes an image, so every deploy builds one on the server',
+      hint: 'add docker-image.yml, calling the shared workflow on a v* tag with a guarded tag-version',
+    });
+    return;
+  }
+
+  const match = TAG_VERSION.exec(workflow);
+  if (match?.groups === undefined) {
+    problems.push({
+      file: DOCKER_IMAGE_WORKFLOW,
+      line: lineOf(workflow, /docker-image\.yml@docker-image/),
+      kind: 'unpublishable-image',
+      message:
+        'no tag-version, so the package gets a single :HEAD and no :latest for a compose file to pull',
+      hint: `with: tag-version: ${GUARDED}`,
+    });
+    return;
+  }
+
+  const value = match.groups.value ?? '';
+  if (value.includes('github.ref_name') && !value.includes('event_name')) {
+    problems.push({
+      file: DOCKER_IMAGE_WORKFLOW,
+      line: lineOf(workflow, TAG_VERSION),
+      kind: 'unpublishable-image',
+      message:
+        'tag-version is the bare ref, which on a manual run is a branch name split as if it were a semver',
+      hint: `guard it: ${GUARDED}`,
+    });
+  }
+}
+
+/**
+ * Report a build stage that installs with npm's own patience.
+ *
+ * A deploy with no image to pull builds from source on the deploy host, so the
+ * whole dependency closure comes over the network at the one moment nothing may
+ * fail. npm's two default retries are capped at a minute and spent in under
+ * twenty seconds, which is short enough that an ordinary blip reads as a broken
+ * repository — so each stage that installs says how long it is willing to try.
+ * @param dockerfile - The Dockerfile.
+ * @param problems - Where each problem found is appended.
+ */
+export function readInstallRetries(
+  dockerfile: string,
+  problems: DeployProblem[],
+): void {
+  const lines = dockerfile.split('\n');
+  let patient = false;
+  for (let index = 0; index < lines.length; index++) {
+    const line = lines[index] ?? '';
+    // ENV does not cross a FROM, so each stage answers for itself.
+    if (STAGE.test(line)) {
+      patient = false;
+    } else if (RETRIES.test(line)) {
+      patient = true;
+    } else if (INSTALL.test(line) && !patient) {
+      problems.push({
+        file: 'Dockerfile',
+        line: index + 1,
+        kind: 'brittle-install',
+        message:
+          "npm ci installs with npm's two default retries, so a network blip of twenty seconds fails the deploy",
+        hint: 'ENV NPM_CONFIG_FETCH_RETRIES=5 NPM_CONFIG_FETCH_RETRY_MAXTIMEOUT=120000 above it, in this stage',
+      });
+      patient = true;
+    }
+  }
+}
+
+function lineOf(text: string, pattern: RegExp): number {
+  const match = pattern.exec(text);
+  if (match === null) return 0;
+  return text.slice(0, match.index).split('\n').length;
+}

package/src/deploy/core/types.ts

@@ -10,7 +10,9 @@ export type DeployProblemKind =
   | 'missing-healthcheck'
   | 'missing-env-example'
   | 'missing-deploy-ignore'
-  | 'cacheable-page';
+  | 'cacheable-page'
+  | 'unpublishable-image'
+  | 'brittle-install';
 
 /** One way a repository would fail, or silently mis-deploy, on the server. */
 export interface DeployProblem {

package/src/molecule3d/ui/Molecule3DToolbar.tsx

@@ -17,6 +17,7 @@ import {
   MEASUREMENT_LABELS,
 } from '../core/measurement.ts';
 import type { Molecule3DTools } from '../core/settings.ts';
+import { resolveMolecule3DTools } from '../core/settings.ts';
 
 import { Molecule3DHelp } from './Molecule3DHelp.tsx';
 import {
@@ -27,20 +28,22 @@ import {
 
 /** Props of {@link Molecule3DToolbar}. */
 export interface Molecule3DToolbarProps {
-  tools: Molecule3DTools;
+  /** Which tools to show; every one it does not name is on. */
+  tools?: Partial<Molecule3DTools>;
   measureKind: MeasurementKind | null;
   onMeasureKindChange: (kind: MeasurementKind | null) => void;
   measurementCount: number;
   onClearMeasurements: () => void;
   spinning: boolean;
   onSpinningChange: (spinning: boolean) => void;
-  showSurface: boolean;
-  onShowSurfaceChange: (showSurface: boolean) => void;
+  /** Whether the molecular surface is drawn; its tool is left out without a handler. */
+  showSurface?: boolean;
+  onShowSurfaceChange?: (showSurface: boolean) => void;
   onResetView: () => void;
-  /** Content of the options popover. */
-  options: ReactElement;
-  /** Content of the export popover. */
-  exportPanel: ReactElement;
+  /** Content of the options popover; its tool is left out without one. */
+  options?: ReactElement;
+  /** Content of the export popover; its tool is left out without one. */
+  exportPanel?: ReactElement;
 }
 
 /**
@@ -50,7 +53,7 @@ export interface Molecule3DToolbarProps {
  */
 export function Molecule3DToolbar(props: Molecule3DToolbarProps): ReactElement {
   const {
-    tools,
+    tools: toolsProp,
     measureKind,
     onMeasureKindChange,
     measurementCount,
@@ -64,16 +67,20 @@ export function Molecule3DToolbar(props: Molecule3DToolbarProps): ReactElement {
     exportPanel,
   } = props;
   const t = useChromeT();
+  const tools = resolveMolecule3DTools(toolsProp);
+  const showOptions = tools.options && options !== undefined;
+  const showSurfaceTool = tools.surface && onShowSurfaceChange !== undefined;
+  const showExport = tools.export && exportPanel !== undefined;
   const hasView =
     tools.spin ||
     tools.surface ||
     tools.reset ||
-    tools.options ||
-    tools.export ||
+    showOptions ||
+    showExport ||
     tools.help;
 
   return (
-    <div style={COLUMN_STYLE}>
+    <div className="no-print" style={COLUMN_STYLE}>
       {hasView && (
         <Card elevation={1} style={CARD_STYLE}>
           <Toolbar vertical aria-label={t('molecule3d.view')}>
@@ -98,19 +105,19 @@ export function Molecule3DToolbar(props: Molecule3DToolbarProps): ReactElement {
                 }}
               />
             )}
-            {tools.surface && (
+            {showSurfaceTool && (
               <Toolbar.Item
                 icon={<SurfaceIcon />}
-                active={showSurface}
+                active={showSurface ?? false}
                 aria-label={t('molecule3d.surface')}
                 tooltip={t('molecule3d.molecularSurface')}
                 tooltipProps={TOOLTIP_PROPS}
                 onClick={() => {
-                  onShowSurfaceChange(!showSurface);
+                  onShowSurfaceChange(showSurface !== true);
                 }}
               />
             )}
-            {tools.options && (
+            {showOptions && (
               <Toolbar.PopoverItem
                 placement="right-start"
                 content={options}
@@ -122,7 +129,7 @@ export function Molecule3DToolbar(props: Molecule3DToolbarProps): ReactElement {
                 }}
               />
             )}
-            {tools.export && (
+            {showExport && (
               <Toolbar.PopoverItem
                 placement="right-start"
                 content={exportPanel}

package/src/molecule3d/ui/MoleculeCanvas3D.tsx

@@ -8,6 +8,7 @@
 import type { CSSProperties, ReactElement } from 'react';
 import { useEffect, useRef, useState } from 'react';
 
+import { DEFAULT_SPIN_SPEED } from '../../molstar/core/index.ts';
 import type { Measurement, MeasurementKind } from '../core/measurement.ts';
 import {
   normalizeMolecule3DSettings,
@@ -17,7 +18,6 @@ import {
 import { Molecule3DExport } from './Molecule3DExport.tsx';
 import { Molecule3DOptions } from './Molecule3DOptions.tsx';
 import { Molecule3DToolbar } from './Molecule3DToolbar.tsx';
-import { DEFAULT_SPIN_SPEED } from './camera.ts';
 import { createMolecule3DViewer } from './createViewer.ts';
 import type { MoleculeViewer3DProps } from './moleculeViewer3DProps.ts';
 import { useControlledState } from './useControlledState.ts';

package/src/molecule3d/ui/camera.ts

@@ -6,53 +6,21 @@
  */
 
 import type { Camera } from 'molstar/lib/mol-canvas3d/camera.js';
-import { Quat, Vec3 } from 'molstar/lib/mol-math/linear-algebra.js';
+import { Vec3 } from 'molstar/lib/mol-math/linear-algebra.js';
 import type { PluginContext } from 'molstar/lib/mol-plugin/context.js';
 
+import {
+  DEFAULT_CAMERA_DURATION,
+  cameraToPose,
+  framedRadius,
+  poseToCamera,
+} from '../../molstar/core/index.ts';
 import type { Molecule3DCamera } from '../core/camera.ts';
-import { normalizeMolecule3DCamera } from '../core/camera.ts';
-
-/** Transition length used when the caller does not pick one, milliseconds. */
-export const DEFAULT_CAMERA_DURATION = 250;
-
-/** Turn rate used when the caller does not pick one, in molstar's spin unit. */
-export const DEFAULT_SPIN_SPEED = 1 / 3;
-
-/**
- * Fraction of the bounding sphere kept as breathing room around the model.
- *
- * `camera.reset()` frames the scene with molstar's own margin, which suits a
- * protein filling a wide viewport and leaves a small molecule a speck in the
- * middle. Framing the visible bounding sphere directly is what makes a single
- * ethanol legible.
- */
-const FRAMING_MARGIN = 0.08;
-
-/** Axis the automatic spin turns about: screen up. */
-const SPIN_AXIS = Vec3.create(0, 1, 0);
-
-/** Smallest radius framed, in ångström, so a single atom is not a close-up. */
-const MIN_FRAMING_RADIUS = 0.5;
 
 /** Screen up and viewing direction when the model is seen as its file lays it. */
 const FRONT_UP = Vec3.create(0, 1, 0);
 const FRONT_DIRECTION = Vec3.create(0, 0, -1);
 
-/** The camera's own axes, which the stored rotation turns into world ones. */
-const CAMERA_UP = Vec3.create(0, 1, 0);
-const CAMERA_BACK = Vec3.create(0, 0, 1);
-
-/**
- * The radius a reset frames, which is the length every stored camera is
- * measured against — so reading a camera and applying it are the same move in
- * opposite directions.
- * @param radius - Radius of the scene's visible bounding sphere.
- * @returns The framed radius.
- */
-function framedRadius(radius: number): number {
-  return Math.max(radius * (1 + FRAMING_MARGIN), MIN_FRAMING_RADIUS);
-}
-
 /**
  * Frame everything currently in the scene.
  *
@@ -83,26 +51,6 @@ export function resetCamera(
   });
 }
 
-/**
- * Turn the automatic spin on or off.
- * @param plugin - The molstar context.
- * @param spinning - Whether the scene should keep turning.
- * @param speed - Turn rate, in molstar's own spin unit.
- */
-export function setSpin(
-  plugin: PluginContext,
-  spinning: boolean,
-  speed = DEFAULT_SPIN_SPEED,
-): void {
-  plugin.canvas3d?.setProps({
-    trackball: {
-      animate: spinning
-        ? { name: 'spin', params: { speed, axis: SPIN_AXIS } }
-        : { name: 'off', params: {} },
-    },
-  });
-}
-
 /**
  * Where the camera stands, against the scene rather than its coordinates.
  *
@@ -121,29 +69,11 @@ export function readCamera(plugin: PluginContext): Molecule3DCamera | null {
   if (!(radius > 0)) return null;
   const framed = framedRadius(radius);
   const camera = canvas.camera;
-  const { position, target, up } = camera.getSnapshot();
-  const back = Vec3.sub(Vec3.zero(), position, target);
-  const distance = Vec3.magnitude(back);
-  if (distance <= 0) return null;
-  Vec3.scale(back, back, 1 / distance);
-  // The trackball keeps up and back close to square, never exactly so.
-  const trueUp = Vec3.scaleAndAdd(Vec3.zero(), up, back, -Vec3.dot(up, back));
-  if (Vec3.magnitude(trueUp) <= 0) return null;
-  Vec3.normalize(trueUp, trueUp);
-  const right = Vec3.cross(Vec3.zero(), trueUp, back);
-  const rotation = Quat.fromBasis(Quat.identity(), right, trueUp, back);
-  const offset = Vec3.sub(Vec3.zero(), target, center);
-  Vec3.scale(offset, offset, 1 / framed);
-  return normalizeMolecule3DCamera({
-    rotation: [
-      rotation[0] ?? 0,
-      rotation[1] ?? 0,
-      rotation[2] ?? 0,
-      rotation[3] ?? 1,
-    ],
-    zoom: camera.getTargetDistance(framed) / distance,
-    offset: [offset[0] ?? 0, offset[1] ?? 0, offset[2] ?? 0],
-  });
+  return poseToCamera(
+    camera.getSnapshot(),
+    { center, radius: framed },
+    camera.getTargetDistance(framed),
+  );
 }
 
 /**
@@ -161,23 +91,18 @@ export function applyCamera(
   camera: Molecule3DCamera,
   durationMilliseconds = 0,
 ): void {
-  const { rotation, zoom, offset } = normalizeMolecule3DCamera(camera);
-  const turn = Quat.create(rotation[0], rotation[1], rotation[2], rotation[3]);
   plugin.canvas3d?.requestCameraReset({
     durationMs: durationMilliseconds,
     snapshot: (scene, current) => {
       const { center, radius } = scene.boundingSphereVisible;
       const framed = framedRadius(radius);
-      const up = Vec3.transformQuat(Vec3.zero(), CAMERA_UP, turn);
-      const back = Vec3.transformQuat(Vec3.zero(), CAMERA_BACK, turn);
-      const target = Vec3.create(
-        (center[0] ?? 0) + offset[0] * framed,
-        (center[1] ?? 0) + offset[1] * framed,
-        (center[2] ?? 0) + offset[2] * framed,
+      const reference = { center, radius: framed };
+      const pose = cameraToPose(
+        camera,
+        reference,
+        current.getTargetDistance(framed),
       );
-      const distance = current.getTargetDistance(framed) / zoom;
-      const position = Vec3.scaleAndAdd(Vec3.zero(), target, back, distance);
-      return { target, position, up, radius: framed };
+      return { ...pose, radius: framed };
     },
   });
 }

package/src/molecule3d/ui/exportMoleculeImage.ts

@@ -7,7 +7,11 @@ import { sanitizeFileName } from '../../download/core/sanitizeFileName.ts';
 import type { ImageSize } from '../core/exportImage.ts';
 import { dataUriBytes, rasterSvgMarkup } from '../core/exportImage.ts';
 
-import type { Molecule3DViewer } from './viewer.ts';
+/** The one thing an export asks of a viewer: a picture of its scene. */
+export interface SceneCapture {
+  /** Render the scene at that pixel size, as a `data:` URI. */
+  captureImage: (size: ImageSize) => Promise<string | undefined>;
+}
 
 /** What {@link exportMoleculeImage} writes. */
 export interface MoleculeImageRequest {
@@ -27,7 +31,7 @@ export interface MoleculeImageRequest {
  * @returns Nothing; resolves once the download has been started.
  */
 export async function exportMoleculeImage(
-  viewer: Molecule3DViewer,
+  viewer: SceneCapture,
   request: MoleculeImageRequest,
 ): Promise<void> {
   const { format, scale, size, fileName } = request;

package/src/molecule3d/ui/index.ts

@@ -7,5 +7,17 @@
  * erased and so are safe.
  */
 
+export { Molecule3DExport } from './Molecule3DExport.tsx';
+export type { Molecule3DExportProps } from './Molecule3DExport.tsx';
+export { Molecule3DHelp } from './Molecule3DHelp.tsx';
+export { Molecule3DToolbar } from './Molecule3DToolbar.tsx';
+export type { Molecule3DToolbarProps } from './Molecule3DToolbar.tsx';
+export type {
+  MoleculeImageRequest,
+  SceneCapture,
+} from './exportMoleculeImage.ts';
+export { exportMoleculeImage } from './exportMoleculeImage.ts';
+export type { ImageExport } from './useImageExport.ts';
+export { useImageExport } from './useImageExport.ts';
 export { MoleculeViewer3D } from './MoleculeViewer3D.tsx';
 export type { MoleculeViewer3DProps } from './moleculeViewer3DProps.ts';