react-cheminfo 0.4.0 → 0.6.0

package/lib/seo/core/template.js

@@ -0,0 +1,53 @@
+/**
+ * Where a built page lets its head and its body be written.
+ *
+ * Every address of a site needs its own title, description, canonical and card,
+ * and a static build ships one `index.html`. Rather than look for the tags a
+ * page already carries and operate on them, the template says where they go:
+ * two comments, replaced by what the build or the server writes for the address
+ * being answered.
+ *
+ * ```html
+ * <head>
+ *   <meta charset="utf-8" />
+ *   <link rel="icon" href="%BASE_URL%favicon.svg" />
+ *   <!--cheminfo:head-->
+ * </head>
+ * <body>
+ *   <div id="root"></div>
+ *   <!--cheminfo:body-->
+ * </body>
+ * ```
+ *
+ * The template carries no title and no description of its own, so nothing can
+ * be duplicated and nothing has to be taken back out. Nothing is parsed and
+ * nothing is searched for but the marker, so what the rest of the page holds — a
+ * byte order mark, an implicit head, a `</head>` its prose displays or a script
+ * quotes, an unterminated comment — cannot reach the result.
+ */
+/** Where the head a crawler reads is written. */
+export const PAGE_HEAD_MARKER = '<!--cheminfo:head-->';
+/** Where the crawl path a visitor with no JavaScript reads is written. */
+export const PAGE_BODY_MARKER = '<!--cheminfo:body-->';
+/**
+ * Write content in the place the template kept for it.
+ *
+ * The marker is consumed, so a page is always filled from the template and
+ * never from a filled page: applying this twice throws rather than writing a
+ * second head, which is why idempotence is not something the caller has to
+ * defend.
+ * @param html - The template.
+ * @param marker - {@link PAGE_HEAD_MARKER} or {@link PAGE_BODY_MARKER}.
+ * @param content - The markup to write, taken as written: no `$&`, `$1` or
+ * `$<name>` is expanded.
+ * @returns The page.
+ * @throws {Error} When the template carries no such marker, rather than
+ * silently shipping a page with no head.
+ */
+export function fill(html, marker, content) {
+    const at = html.indexOf(marker);
+    if (at === -1)
+        throw new Error(`the page carries no ${marker}`);
+    return html.slice(0, at) + content + html.slice(at + marker.length);
+}
+//# sourceMappingURL=template.js.map

package/lib/seo/core/template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/seo/core/template.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,iDAAiD;AACjD,MAAM,CAAC,MAAM,gBAAgB,GAAG,sBAAsB,CAAC;AAEvD,0EAA0E;AAC1E,MAAM,CAAC,MAAM,gBAAgB,GAAG,sBAAsB,CAAC;AAEvD;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,IAAI,CAAC,IAAY,EAAE,MAAc,EAAE,OAAe;IAChE,MAAM,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,EAAE,KAAK,CAAC,CAAC;QAAE,MAAM,IAAI,KAAK,CAAC,uBAAuB,MAAM,EAAE,CAAC,CAAC;IAChE,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;AACtE,CAAC"}

package/lib/seo/vite/index.d.ts

@@ -0,0 +1,5 @@
+export type { OgCardOptions } from './ogCard.ts';
+export { OG_HEIGHT, OG_WIDTH, ogCardHtml } from './ogCard.ts';
+export type { PrerenderOptions } from './prerender.ts';
+export { cheminfoPrerender } from './prerender.ts';
+//# sourceMappingURL=index.d.ts.map

package/lib/seo/vite/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/seo/vite/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9D,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}

package/lib/seo/vite/index.js

@@ -0,0 +1,3 @@
+export { OG_HEIGHT, OG_WIDTH, ogCardHtml } from "./ogCard.js";
+export { cheminfoPrerender } from "./prerender.js";
+//# sourceMappingURL=index.js.map

package/lib/seo/vite/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/seo/vite/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}

package/lib/seo/vite/ogCard.d.ts

@@ -0,0 +1,41 @@
+/**
+ * The 1200×630 card a link to a site unfurls into, as a page to screenshot.
+ *
+ * The card is the site's own mark, its two colours and its name, all read from
+ * its record — so it is generated rather than hand-drawn. A mark redrawn in the
+ * card is a mark that drifts from the one the site shows.
+ *
+ * React is reached for only when a card is actually drawn, and never at module
+ * load: this module sits in the same entry point as the prerender plugin, which
+ * a site must be able to import with none of the optional peers installed.
+ */
+import type { EcosystemSite, SiteId } from '../../ecosystem/core/sites.ts';
+/** The width every card is drawn at. */
+export declare const OG_WIDTH = 1200;
+/** The height every card is drawn at. */
+export declare const OG_HEIGHT = 630;
+/** What the card says, beyond the site's own name and mark. */
+export interface OgCardOptions {
+    /** The site, named or passed. */
+    site: EcosystemSite | SiteId;
+    /**
+     * The sentence under the name.
+     * @default the site's tagline
+     */
+    description?: string;
+}
+/**
+ * The card, as a standalone page.
+ *
+ * Screenshot it at {@link OG_WIDTH} × {@link OG_HEIGHT} — a headless browser is
+ * the only thing here that can rasterise it, and every site already has one for
+ * its end-to-end tests.
+ *
+ * Drawing the mark is the one thing here that needs React, so React is loaded
+ * on the call rather than by the module. The card is drawn by a build script
+ * that already awaits a browser, so the await costs it nothing.
+ * @param options - Which site, and what it says.
+ * @returns A complete HTML document.
+ */
+export declare function ogCardHtml(options: OgCardOptions): Promise<string>;
+//# sourceMappingURL=ogCard.d.ts.map

package/lib/seo/vite/ogCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ogCard.d.ts","sourceRoot":"","sources":["../../../src/seo/vite/ogCard.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAGH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAG3E,wCAAwC;AACxC,eAAO,MAAM,QAAQ,OAAO,CAAC;AAE7B,yCAAyC;AACzC,eAAO,MAAM,SAAS,MAAM,CAAC;AAE7B,+DAA+D;AAC/D,MAAM,WAAW,aAAa;IAC5B,iCAAiC;IACjC,IAAI,EAAE,aAAa,GAAG,MAAM,CAAC;IAC7B;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAsB,UAAU,CAAC,OAAO,EAAE,aAAa,GAAG,OAAO,CAAC,MAAM,CAAC,CAuDxE"}

package/lib/seo/vite/ogCard.js

@@ -0,0 +1,82 @@
+/**
+ * The 1200×630 card a link to a site unfurls into, as a page to screenshot.
+ *
+ * The card is the site's own mark, its two colours and its name, all read from
+ * its record — so it is generated rather than hand-drawn. A mark redrawn in the
+ * card is a mark that drifts from the one the site shows.
+ *
+ * React is reached for only when a card is actually drawn, and never at module
+ * load: this module sits in the same entry point as the prerender plugin, which
+ * a site must be able to import with none of the optional peers installed.
+ */
+import { siteById } from "../../ecosystem/core/lookup.js";
+import { escapeText } from "../../share/core/escape.js";
+/** The width every card is drawn at. */
+export const OG_WIDTH = 1200;
+/** The height every card is drawn at. */
+export const OG_HEIGHT = 630;
+/**
+ * The card, as a standalone page.
+ *
+ * Screenshot it at {@link OG_WIDTH} × {@link OG_HEIGHT} — a headless browser is
+ * the only thing here that can rasterise it, and every site already has one for
+ * its end-to-end tests.
+ *
+ * Drawing the mark is the one thing here that needs React, so React is loaded
+ * on the call rather than by the module. The card is drawn by a build script
+ * that already awaits a browser, so the await costs it nothing.
+ * @param options - Which site, and what it says.
+ * @returns A complete HTML document.
+ */
+export async function ogCardHtml(options) {
+    const site = typeof options.site === 'string' ? siteById(options.site) : options.site;
+    const description = options.description ?? site.tagline;
+    const [{ createElement }, { renderToStaticMarkup }, { SiteMark }] = await Promise.all([
+        import('react'),
+        import('react-dom/server'),
+        import("../../ecosystem/ui/marks.js"),
+    ]);
+    const mark = renderToStaticMarkup(createElement(SiteMark, { site, size: 132, colors: 'literal' }));
+    const dot = site.name.dot === true ? '<span class="dot">.</span>' : '';
+    return `<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <style>
+      * { box-sizing: border-box; margin: 0; }
+      body {
+        display: flex;
+        width: ${OG_WIDTH}px;
+        height: ${OG_HEIGHT}px;
+        flex-direction: column;
+        justify-content: center;
+        padding: 88px;
+        background: #ffffff;
+        color: #16202c;
+        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+          Helvetica, Arial, sans-serif;
+        gap: 28px;
+      }
+      h1 { font-size: 76px; font-weight: 700; letter-spacing: -0.02em; }
+      .lead { color: ${site.brand}; }
+      .alt { color: ${site.brandAlt}; }
+      .dot { color: #8a96a3; }
+      p { max-width: 900px; color: #5b6875; font-size: 34px; line-height: 1.35; }
+      .rule {
+        width: 180px;
+        height: 10px;
+        border-radius: 5px;
+        background: ${site.brandAlt};
+      }
+    </style>
+  </head>
+  <body>
+    ${mark}
+    <h1><span class="lead">${escapeText(site.name.lead)}</span>${dot}<span class="alt">${escapeText(site.name.alt)}</span></h1>
+    <div class="rule"></div>
+    <p>${escapeText(description)}</p>
+  </body>
+</html>
+`;
+}
+//# sourceMappingURL=ogCard.js.map

package/lib/seo/vite/ogCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ogCard.js","sourceRoot":"","sources":["../../../src/seo/vite/ogCard.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAE1D,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAExD,wCAAwC;AACxC,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAC;AAE7B,yCAAyC;AACzC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAC;AAa7B;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,KAAK,UAAU,UAAU,CAAC,OAAsB;IACrD,MAAM,IAAI,GACR,OAAO,OAAO,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC;IAC3E,MAAM,WAAW,GAAG,OAAO,CAAC,WAAW,IAAI,IAAI,CAAC,OAAO,CAAC;IACxD,MAAM,CAAC,EAAE,aAAa,EAAE,EAAE,EAAE,oBAAoB,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,GAC/D,MAAM,OAAO,CAAC,GAAG,CAAC;QAChB,MAAM,CAAC,OAAO,CAAC;QACf,MAAM,CAAC,kBAAkB,CAAC;QAC1B,MAAM,CAAC,6BAA8B,CAAC;KACvC,CAAC,CAAC;IACL,MAAM,IAAI,GAAG,oBAAoB,CAC/B,aAAa,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAChE,CAAC;IACF,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,4BAA4B,CAAC,CAAC,CAAC,EAAE,CAAC;IAEvE,OAAO;;;;;;;;iBAQQ,QAAQ;kBACP,SAAS;;;;;;;;;;;uBAWJ,IAAI,CAAC,KAAK;sBACX,IAAI,CAAC,QAAQ;;;;;;;sBAOb,IAAI,CAAC,QAAQ;;;;;MAK7B,IAAI;6BACmB,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,GAAG,qBAAqB,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC;;SAEzG,UAAU,CAAC,WAAW,CAAC;;;CAG/B,CAAC;AACF,CAAC"}

package/lib/seo/vite/prerender.d.ts

@@ -0,0 +1,89 @@
+/**
+ * Write one real HTML file per routed address, and everything else a crawler
+ * fetches on its own.
+ *
+ * A site served by a static image has nothing to rewrite a head per request: a
+ * crawler gets whatever came off the wire. Without this every address carries
+ * the same title and a search engine folds the whole site into one result.
+ *
+ * The build's `index.html` is the template: it declares where its head and its
+ * crawl path go with `<!--cheminfo:head-->` and `<!--cheminfo:body-->`, and
+ * every file written here is filled from it. The dev server is filled the same
+ * way, from the home route, so what a developer opens is what the build ships.
+ *
+ * These files are also what makes the server's catch-all fallback unnecessary.
+ * Every address the tool answers is on disk, so an address that is *not* on
+ * disk is genuinely not a page and must 404 rather than serving the tool under
+ * a name it does not have.
+ */
+import type { Plugin } from 'vite';
+import type { EcosystemSite, SiteId } from '../../ecosystem/core/sites.ts';
+import type { NoscriptText } from '../core/noscript.ts';
+import type { RobotsDisallow } from '../core/robots.ts';
+import type { RouteMeta } from '../core/routes.ts';
+/** What the build needs to know to write the site's addresses. */
+export interface PrerenderOptions {
+    /** The site, named or passed. */
+    site: EcosystemSite | SiteId;
+    /** Every address it answers, each with its title and description. */
+    routes: readonly RouteMeta[];
+    /**
+     * Where the site is served, mount path included. Every absolute address is
+     * built on it, and `robots.txt` and the `noscript` index write their paths
+     * under its mount. The files on disk are laid out from the build's own root
+     * either way: it is the server that puts them under the mount.
+     * @default `https://<the site's host>`
+     */
+    origin?: string;
+    /**
+     * Addresses `robots.txt` keeps out of the index, e.g. `/v1/`, each optionally
+     * with the sentence saying why. Set to `false` to write no `robots.txt` at
+     * all, for a site that ships its own.
+     * @default []
+     */
+    robots?: false | ReadonlyArray<string | RobotsDisallow>;
+    /**
+     * The schema.org category of the structured-data block, or `false` to write
+     * none.
+     * @default 'EducationalApplication'
+     */
+    category?: false | string;
+    /**
+     * What the tool needs to run, named in the structured-data block.
+     * @default 'Any modern browser'
+     */
+    operatingSystem?: string;
+    /**
+     * What the tool does, in the structured-data block.
+     * @default the site's tagline
+     */
+    description?: string;
+    /**
+     * What a browser has to offer for the tool to run.
+     * @default 'Requires JavaScript'
+     */
+    browserRequirements?: string;
+    /**
+     * The currency the zero price is quoted in.
+     * @default 'EUR'
+     */
+    currency?: string;
+    /**
+     * Whether the built page carries a `noscript` index of the addresses, what it
+     * says, which pages it lists and how it writes their addresses. It is the
+     * only crawl path through a site whose body is an empty root element, so
+     * `false` leaves one without any — and is also what lets a template ship no
+     * `<!--cheminfo:body-->` at all.
+     * @default true
+     */
+    noscript?: boolean | NoscriptText;
+}
+/**
+ * Prerender every routed address of a cheminfo site.
+ * @param options - The site, its routes, and what a crawler is told.
+ * @returns The Vite plugin.
+ * @throws {Error} When the route table names an address twice or names one that
+ * is not a path, or when the origin is not an absolute address.
+ */
+export declare function cheminfoPrerender(options: PrerenderOptions): Plugin;
+//# sourceMappingURL=prerender.d.ts.map

package/lib/seo/vite/prerender.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"prerender.d.ts","sourceRoot":"","sources":["../../../src/seo/vite/prerender.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAKH,OAAO,KAAK,EAAU,MAAM,EAAE,MAAM,MAAM,CAAC;AAE3C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAC3E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAGxD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAExD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAMnD,kEAAkE;AAClE,MAAM,WAAW,gBAAgB;IAC/B,iCAAiC;IACjC,IAAI,EAAE,aAAa,GAAG,MAAM,CAAC;IAC7B,qEAAqE;IACrE,MAAM,EAAE,SAAS,SAAS,EAAE,CAAC;IAC7B;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,KAAK,GAAG,aAAa,CAAC,MAAM,GAAG,cAAc,CAAC,CAAC;IACxD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IAC1B;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,YAAY,CAAC;CACnC;AAED;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,gBAAgB,GAAG,MAAM,CA6EnE"}

package/lib/seo/vite/prerender.js

@@ -0,0 +1,114 @@
+/**
+ * Write one real HTML file per routed address, and everything else a crawler
+ * fetches on its own.
+ *
+ * A site served by a static image has nothing to rewrite a head per request: a
+ * crawler gets whatever came off the wire. Without this every address carries
+ * the same title and a search engine folds the whole site into one result.
+ *
+ * The build's `index.html` is the template: it declares where its head and its
+ * crawl path go with `<!--cheminfo:head-->` and `<!--cheminfo:body-->`, and
+ * every file written here is filled from it. The dev server is filled the same
+ * way, from the home route, so what a developer opens is what the build ships.
+ *
+ * These files are also what makes the server's catch-all fallback unnecessary.
+ * Every address the tool answers is on disk, so an address that is *not* on
+ * disk is genuinely not a page and must 404 rather than serving the tool under
+ * a name it does not have.
+ */
+import { mkdirSync, readFileSync, writeFileSync } from 'node:fs';
+import { dirname, join, resolve } from 'node:path';
+import { noscriptIndex } from "../core/noscript.js";
+import { pageHeadTags } from "../core/pageMeta.js";
+import { robotsTxt } from "../core/robots.js";
+import { assertRoutes, homeRoute, trimTrailingSlash } from "../core/routes.js";
+import { sitemapXml } from "../core/siteFiles.js";
+import { structuredDataScript } from "../core/structuredData.js";
+import { PAGE_BODY_MARKER, PAGE_HEAD_MARKER, fill } from "../core/template.js";
+/**
+ * Prerender every routed address of a cheminfo site.
+ * @param options - The site, its routes, and what a crawler is told.
+ * @returns The Vite plugin.
+ * @throws {Error} When the route table names an address twice or names one that
+ * is not a path, or when the origin is not an absolute address.
+ */
+export function cheminfoPrerender(options) {
+    const { site, routes, origin, robots = [] } = options;
+    assertRoutes(routes);
+    const structuredData = structuredDataOf(options);
+    const crawlPath = crawlPathOf(options);
+    let out = 'dist';
+    let serve = false;
+    let logger = null;
+    const page = (template, url) => {
+        const head = fill(template, PAGE_HEAD_MARKER, `${pageHeadTags({ site, routes, origin, url })}${structuredData}`);
+        return crawlPath === '' ? head : fill(head, PAGE_BODY_MARKER, crawlPath);
+    };
+    return {
+        name: 'cheminfo:prerender',
+        configResolved(config) {
+            serve = config.command === 'serve';
+            out = resolve(config.root, config.build.outDir);
+            logger = config.logger;
+        },
+        // A dev run has no build to prerender, so the page vite serves is filled
+        // from the home route rather than shipped with its markers showing.
+        transformIndexHtml: {
+            order: 'post',
+            handler: (html) => serve ? page(html, homeRoute(routes).path) : html,
+        },
+        closeBundle() {
+            if (serve)
+                return;
+            const template = readFileSync(join(out, 'index.html'), 'utf8');
+            const write = (url, file) => {
+                mkdirSync(dirname(file), { recursive: true });
+                writeFileSync(file, page(template, url));
+            };
+            let root = false;
+            for (const route of routes) {
+                const address = trimTrailingSlash(route.path);
+                if (address === '/')
+                    root = true;
+                write(route.path, address === '/'
+                    ? join(out, 'index.html')
+                    : join(out, address.slice(1), 'index.html'));
+            }
+            // The file a static server hands out for the mount itself. A table naming
+            // no root would otherwise leave the template vite built, and ship a site
+            // whose front page carries its markers instead of a head.
+            if (!root)
+                write(homeRoute(routes).path, join(out, 'index.html'));
+            writeFileSync(join(out, 'sitemap.xml'), sitemapXml({ site, routes, origin }));
+            if (robots !== false) {
+                writeFileSync(join(out, 'robots.txt'), robotsTxt({ site, routes, origin }, robots));
+            }
+            logger?.info(`${routes.length} pages prerendered, and listed in sitemap.xml`);
+        },
+    };
+}
+function structuredDataOf(options) {
+    const { category, ...rest } = options;
+    if (category === false)
+        return '';
+    const { site, routes, origin } = rest;
+    const { operatingSystem, description, browserRequirements, currency } = rest;
+    return `\n${structuredDataScript({
+        site,
+        routes,
+        origin,
+        category,
+        operatingSystem,
+        description,
+        browserRequirements,
+        currency,
+    })}`;
+}
+function crawlPathOf(options) {
+    const { site, routes, origin, noscript = true } = options;
+    if (noscript === false)
+        return '';
+    const { routes: listed, ...prose } = noscript === true ? {} : noscript;
+    return noscriptIndex({ site, origin, ...prose, routes: listed ?? routes });
+}
+//# sourceMappingURL=prerender.js.map

package/lib/seo/vite/prerender.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prerender.js","sourceRoot":"","sources":["../../../src/seo/vite/prerender.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACjE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAMnD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAEnD,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAE9C,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAC/E,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AA4D/E;;;;;;GAMG;AACH,MAAM,UAAU,iBAAiB,CAAC,OAAyB;IACzD,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,EAAE,EAAE,GAAG,OAAO,CAAC;IACtD,YAAY,CAAC,MAAM,CAAC,CAAC;IACrB,MAAM,cAAc,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACjD,MAAM,SAAS,GAAG,WAAW,CAAC,OAAO,CAAC,CAAC;IAEvC,IAAI,GAAG,GAAG,MAAM,CAAC;IACjB,IAAI,KAAK,GAAG,KAAK,CAAC;IAClB,IAAI,MAAM,GAAkB,IAAI,CAAC;IAEjC,MAAM,IAAI,GAAG,CAAC,QAAgB,EAAE,GAAW,EAAE,EAAE;QAC7C,MAAM,IAAI,GAAG,IAAI,CACf,QAAQ,EACR,gBAAgB,EAChB,GAAG,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,GAAG,cAAc,EAAE,CAClE,CAAC;QACF,OAAO,SAAS,KAAK,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,gBAAgB,EAAE,SAAS,CAAC,CAAC;IAC3E,CAAC,CAAC;IAEF,OAAO;QACL,IAAI,EAAE,oBAAoB;QAE1B,cAAc,CAAC,MAAM;YACnB,KAAK,GAAG,MAAM,CAAC,OAAO,KAAK,OAAO,CAAC;YACnC,GAAG,GAAG,OAAO,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;YAChD,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;QACzB,CAAC;QAED,yEAAyE;QACzE,oEAAoE;QACpE,kBAAkB,EAAE;YAClB,KAAK,EAAE,MAAM;YACb,OAAO,EAAE,CAAC,IAAY,EAAE,EAAE,CACxB,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI;SACpD;QAED,WAAW;YACT,IAAI,KAAK;gBAAE,OAAO;YAClB,MAAM,QAAQ,GAAG,YAAY,CAAC,IAAI,CAAC,GAAG,EAAE,YAAY,CAAC,EAAE,MAAM,CAAC,CAAC;YAE/D,MAAM,KAAK,GAAG,CAAC,GAAW,EAAE,IAAY,EAAE,EAAE;gBAC1C,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;gBAC9C,aAAa,CAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,CAAC;YAC3C,CAAC,CAAC;YAEF,IAAI,IAAI,GAAG,KAAK,CAAC;YACjB,KAAK,MAAM,KAAK,IAAI,MAAM,EAAE,CAAC;gBAC3B,MAAM,OAAO,GAAG,iBAAiB,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;gBAC9C,IAAI,OAAO,KAAK,GAAG;oBAAE,IAAI,GAAG,IAAI,CAAC;gBACjC,KAAK,CACH,KAAK,CAAC,IAAI,EACV,OAAO,KAAK,GAAG;oBACb,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,YAAY,CAAC;oBACzB,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,YAAY,CAAC,CAC9C,CAAC;YACJ,CAAC;YACD,0EAA0E;YAC1E,yEAAyE;YACzE,0DAA0D;YAC1D,IAAI,CAAC,IAAI;gBAAE,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC,CAAC;YAElE,aAAa,CACX,IAAI,CAAC,GAAG,EAAE,aAAa,CAAC,EACxB,UAAU,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,CACrC,CAAC;YACF,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;gBACrB,aAAa,CACX,IAAI,CAAC,GAAG,EAAE,YAAY,CAAC,EACvB,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,MAAM,CAAC,CAC5C,CAAC;YACJ,CAAC;YAED,MAAM,EAAE,IAAI,CACV,GAAG,MAAM,CAAC,MAAM,+CAA+C,CAChE,CAAC;QACJ,CAAC;KACF,CAAC;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,OAAyB;IACjD,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,GAAG,OAAO,CAAC;IACtC,IAAI,QAAQ,KAAK,KAAK;QAAE,OAAO,EAAE,CAAC;IAClC,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IACtC,MAAM,EAAE,eAAe,EAAE,WAAW,EAAE,mBAAmB,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;IAC7E,OAAO,KAAK,oBAAoB,CAAC;QAC/B,IAAI;QACJ,MAAM;QACN,MAAM;QACN,QAAQ;QACR,eAAe;QACf,WAAW;QACX,mBAAmB;QACnB,QAAQ;KACT,CAAC,EAAE,CAAC;AACP,CAAC;AAED,SAAS,WAAW,CAAC,OAAyB;IAC5C,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,GAAG,IAAI,EAAE,GAAG,OAAO,CAAC;IAC1D,IAAI,QAAQ,KAAK,KAAK;QAAE,OAAO,EAAE,CAAC;IAClC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,GAAG,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC;IACvE,OAAO,aAAa,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,MAAM,EAAE,MAAM,IAAI,MAAM,EAAE,CAAC,CAAC;AAC7E,CAAC"}

package/lib/vite.d.ts

@@ -0,0 +1,2 @@
+export * from './seo/vite/index.ts';
+//# sourceMappingURL=vite.d.ts.map

package/lib/vite.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vite.d.ts","sourceRoot":"","sources":["../src/vite.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC"}

package/lib/vite.js

@@ -0,0 +1,2 @@
+export * from "./seo/vite/index.js";
+//# sourceMappingURL=vite.js.map

package/lib/vite.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vite.js","sourceRoot":"","sources":["../src/vite.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-cheminfo",
-  "version": "0.4.0",
+  "version": "0.6.0",
   "license": "MIT",
   "description": "Assembled React components shared by the cheminfo sites: a Cite button and an ecosystem menu",
   "author": "Luc Patiny",
@@ -16,6 +16,7 @@
     "./orbital": "./lib/orbital.js",
     "./structure": "./lib/structure.js",
     "./ui": "./lib/ui.js",
+    "./vite": "./lib/vite.js",
     "./styles/*.css": "./styles/*.css"
   },
   "files": [
@@ -76,7 +77,8 @@
     "react": "^18.3.1 || >=19",
     "react-dom": "^18.3.1 || >=19",
     "react-ocl": "^8.7.1",
-    "react-science": "^20.6.2 || ^21.0.0 || ^22.0.0 || ^23.0.0"
+    "react-science": "^20.6.2 || ^21.0.0 || ^22.0.0 || ^23.0.0",
+    "vite": "^7.0.0 || ^8.0.0"
   },
   "repository": {
     "type": "git",
@@ -95,6 +97,9 @@
     },
     "react-ocl": {
       "optional": true
+    },
+    "vite": {
+      "optional": true
     }
   }
 }

package/src/ecosystem/core/index.ts

@@ -1,5 +1,5 @@
 export { renderEcosystemLinksHtml } from './links.ts';
-export { findSiteByHost, siteById } from './lookup.ts';
+export { findSiteByHost, siteById, siteDisplayName } from './lookup.ts';
 export type {
   EcosystemSite,
   SiteId,

package/src/ecosystem/core/lookup.ts

@@ -14,6 +14,22 @@ export function siteById(id: SiteId): EcosystemSite {
   throw new Error(`unknown ecosystem site: ${id}`);
 }
 
+/**
+ * The site's name as prose, for a page title, a card or a citation.
+ *
+ * An address-shaped name is written as the address it is — `3d` and `cheminfo`
+ * are two halves of `3d.cheminfo.org`, and joining them would read `3dcheminfo`
+ * — while a product-shaped one is its two halves run together, as its wordmark
+ * sets them.
+ * @param site - The site being named.
+ * @returns What the site is called, in one string.
+ */
+export function siteDisplayName(site: EcosystemSite): string {
+  return site.name.dot === true
+    ? site.host
+    : `${site.name.lead}${site.name.alt}`;
+}
+
 /**
  * The site a page is being served from, so a header can mark itself as the
  * current one without being told which site it belongs to.

package/src/ecosystem/core/sites.ts

@@ -5,6 +5,7 @@ export type SiteId =
   | 'smiles'
   | 'chemcalc'
   | 'nmrium'
+  | 'derepflow'
   | 'surge'
   | 'tex'
   | 'lcao'
@@ -14,7 +15,7 @@ export type SiteId =
   | 'equilibrium'
   | 'polycarp'
   | '3d'
-  | 'pt';
+  | 'periodic-table';
 
 export interface SiteName {
   /** First half of the name, set in the site's leading colour. */
@@ -119,6 +120,16 @@ export const ECOSYSTEM_SITES: readonly EcosystemSite[] = [
     brandAlt: '#2b143e',
     mark: { plate: '#2b143e', accent: '#ea580c' },
   },
+  {
+    id: 'derepflow',
+    name: { lead: 'Derep', alt: 'Flow' },
+    host: 'derepflow.cheminfo.org',
+    repository: 'https://github.com/cheminfo/derepflow',
+    tagline: 'Identify the constituents of a mixture from its ¹³C spectrum.',
+    brand: '#be185d',
+    brandAlt: '#0f766e',
+    mark: { plate: '#be185d', accent: '#0d9488' },
+  },
   {
     id: 'surge',
     name: { lead: 'surge', alt: 'cheminfo', dot: true },
@@ -210,10 +221,10 @@ export const ECOSYSTEM_SITES: readonly EcosystemSite[] = [
     mark: { plate: '#155e75', accent: '#f97316' },
   },
   {
-    id: 'pt',
-    name: { lead: 'pt', alt: 'cheminfo', dot: true },
-    host: 'pt.cheminfo.org',
-    repository: 'https://github.com/cheminfo/pt.cheminfo.org',
+    id: 'periodic-table',
+    name: { lead: 'Periodic', alt: 'Table' },
+    host: 'periodic-table.cheminfo.org',
+    repository: 'https://github.com/cheminfo/periodic-table.cheminfo.org',
     tagline: 'The periodic table, coloured, plotted and taken apart.',
     brand: '#15803d',
     brandAlt: '#a16207',

package/src/ecosystem/ui/glyphs.tsx

@@ -74,6 +74,25 @@ export const GLYPHS: Record<SiteId, (alt: string) => ReactNode> = {
       <path d="M23 24V18" stroke="#ffffff" />
     </g>
   ),
+  // Three peaks of a mixture over the funnel that narrows them to one compound,
+  // which is the dereplication this one does.
+  derepflow: (alt) => (
+    <>
+      <g stroke="#ffffff" strokeWidth="4" strokeLinecap="round" fill="none">
+        <path d="M7 15.6V9.4" />
+        <path d="M16 15.6V4.6" />
+        <path d="M25 15.6v-4.6" />
+      </g>
+      <path
+        d="M6.2 20.4 16 27 25.8 20.4"
+        stroke={alt}
+        strokeWidth="4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        fill="none"
+      />
+    </>
+  ),
   // The official NMRium symbol, from `Logo.tsx` of the NMRium sources: the
   // orange half is theirs, and the half their logo sets in plum is set in white
   // here because the plate already is that plum.
@@ -214,7 +233,7 @@ export const GLYPHS: Record<SiteId, (alt: string) => ReactNode> = {
   // The stepped corner of the table, with the one cell a visitor has picked
   // carrying the accent — which is what every tool of that site is: the table,
   // and one element read off it.
-  pt: (alt) => (
+  'periodic-table': (alt) => (
     <>
       <g fill="#ffffff" opacity="0.55">
         <rect x="5" y="6" width="5" height="5" rx="1" />

package/src/orbital/ui/AtomicOrbitalCanvas.tsx

@@ -15,6 +15,7 @@ import { PHASE_PALETTES } from '../core/palette.ts';
 import type { AtomicSampler } from '../core/sample.ts';
 import { sampleInProcess } from '../core/sample.ts';
 
+import { DEFAULT_SPIN_SPEED } from './camera.ts';
 import type { OrbitalViewer } from './viewer.ts';
 import { createOrbitalViewer } from './viewer.ts';
 
@@ -44,6 +45,11 @@ export interface AtomicOrbitalCanvasProps {
    * @default false
    */
   spinning?: boolean;
+  /**
+   * How fast it turns, in molstar's own spin unit. Lower is slower.
+   * @default 0.3
+   */
+  spinSpeed?: number;
   /**
    * How the field is produced. Supply a worker-backed sampler to keep the main
    * thread free; the default runs in process.
@@ -77,6 +83,7 @@ export function AtomicOrbitalCanvas(
     palette = PHASE_PALETTES.textbook,
     resolution = DEFAULT_RESOLUTION,
     spinning = false,
+    spinSpeed = DEFAULT_SPIN_SPEED,
     sample = sampleInProcess,
     onNodeRadii,
     onError,
@@ -144,8 +151,8 @@ export function AtomicOrbitalCanvas(
   }, [atomicNumber, orbitalId, resolution, palette, sample, wanted]);
 
   useEffect(() => {
-    void viewerRef.current?.setSpin(spinning);
-  }, [spinning]);
+    void viewerRef.current?.setSpin(spinning, spinSpeed);
+  }, [spinning, spinSpeed]);
 
   return (
     <div ref={containerRef} style={CANVAS_STYLE}>

package/src/orbital/ui/AtomicOrbitalViewer.tsx

@@ -56,6 +56,11 @@ export interface AtomicOrbitalViewerProps {
    * @default false
    */
   spinning?: boolean;
+  /**
+   * How fast it turns, in molstar's own spin unit. Lower is slower.
+   * @default 0.3
+   */
+  spinSpeed?: number;
   /**
    * How the field is produced. Supply a worker-backed sampler to keep the main
    * thread free; the default runs in process.