react-cheminfo 0.32.0 → 0.33.0

package/lib/orbital/ui/AtomicOrbitalControls.js

@@ -1,30 +1,35 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
- * The two controls an orbital canvas owns: the cartesian frame, and the way
- * back to the framing the orbital opened on — a change of orbital keeps
- * whatever angle and zoom the student is on.
+ * The three controls an orbital canvas owns: the cartesian frame, the slow
+ * spin that makes a 3D shape readable on a flat screen, and the way back to the
+ * framing the orbital opened on — a change of orbital keeps whatever angle and
+ * zoom the student is on.
  */
 import { Button } from '@blueprintjs/core';
 import { HelpTooltip } from "../../help/ui/HelpTooltip.js";
 import { useChromeT } from "../../i18n/ui/useT.js";
 /**
- * The frame and reset buttons, in the canvas's top-right corner.
+ * The frame, spin and reset buttons, in the canvas's top-right corner.
  * @param props - See {@link AtomicOrbitalControlsProps}.
- * @returns The two buttons.
+ * @returns The three buttons.
  */
 export function AtomicOrbitalControls(props) {
-    const { axes, onToggleAxes, onResetView } = props;
+    const { axes, onToggleAxes, spinning, onToggleSpin, onResetView } = props;
     const t = useChromeT();
     const axesHelp = {
         title: t('orbital.axesTitle'),
         body: t('orbital.axesBody'),
         example: { code: '3d_yz', note: t('orbital.axesExample') },
     };
+    const spinHelp = {
+        title: t('orbital.spinTitle'),
+        body: t('orbital.spinBody'),
+    };
     const resetHelp = {
         title: t('orbital.resetTitle'),
         body: t('orbital.resetBody'),
     };
-    return (_jsxs("div", { style: CONTROLS_STYLE, children: [_jsx(HelpTooltip, { content: axesHelp, placement: "bottom", children: _jsx(Button, { variant: "minimal", size: "small", icon: "grid", active: axes, "aria-label": t('orbital.showAxes'), "aria-pressed": axes, onClick: onToggleAxes }) }), _jsx(HelpTooltip, { content: resetHelp, placement: "bottom", children: _jsx(Button, { variant: "minimal", size: "small", icon: "zoom-to-fit", "aria-label": t('orbital.resetTitle'), onClick: onResetView }) })] }));
+    return (_jsxs("div", { style: CONTROLS_STYLE, children: [_jsx(HelpTooltip, { content: axesHelp, placement: "bottom", children: _jsx(Button, { variant: "minimal", size: "small", icon: "grid", active: axes, "aria-label": t('orbital.showAxes'), "aria-pressed": axes, onClick: onToggleAxes }) }), _jsx(HelpTooltip, { content: spinHelp, placement: "bottom", children: _jsx(Button, { variant: "minimal", size: "small", icon: "refresh", active: spinning, "aria-label": t('orbital.spin'), "aria-pressed": spinning, onClick: onToggleSpin }) }), _jsx(HelpTooltip, { content: resetHelp, placement: "bottom", children: _jsx(Button, { variant: "minimal", size: "small", icon: "zoom-to-fit", "aria-label": t('orbital.resetTitle'), onClick: onResetView }) })] }));
 }
 const CONTROLS_STYLE = {
     position: 'absolute',

package/lib/orbital/ui/AtomicOrbitalControls.js.map

@@ -1 +1 @@
-{"version":3,"file":"AtomicOrbitalControls.js","sourceRoot":"","sources":["../../../src/orbital/ui/AtomicOrbitalControls.tsx"],"names":[],"mappings":";AAAA;;;;GAIG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAI3C,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA+B,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAYnD;;;;GAIG;AACH,MAAM,UAAU,qBAAqB,CACnC,KAAiC;IAEjC,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IAClD,MAAM,CAAC,GAAG,UAAU,EAAE,CAAC;IACvB,MAAM,QAAQ,GAAgB;QAC5B,KAAK,EAAE,CAAC,CAAC,mBAAmB,CAAC;QAC7B,IAAI,EAAE,CAAC,CAAC,kBAAkB,CAAC;QAC3B,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,qBAAqB,CAAC,EAAE;KAC3D,CAAC;IACF,MAAM,SAAS,GAAgB;QAC7B,KAAK,EAAE,CAAC,CAAC,oBAAoB,CAAC;QAC9B,IAAI,EAAE,CAAC,CAAC,mBAAmB,CAAC;KAC7B,CAAC;IACF,OAAO,CACL,eAAK,KAAK,EAAE,cAAc,aACxB,KAAC,WAAW,IAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAC,QAAQ,YAChD,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,MAAM,EACX,MAAM,EAAE,IAAI,gBACA,CAAC,CAAC,kBAAkB,CAAC,kBACnB,IAAI,EAClB,OAAO,EAAE,YAAY,GACrB,GACU,EACd,KAAC,WAAW,IAAC,OAAO,EAAE,SAAS,EAAE,SAAS,EAAC,QAAQ,YACjD,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,aAAa,gBACN,CAAC,CAAC,oBAAoB,CAAC,EACnC,OAAO,EAAE,WAAW,GACpB,GACU,IACV,CACP,CAAC;AACJ,CAAC;AAED,MAAM,cAAc,GAAkB;IACpC,QAAQ,EAAE,UAAU;IACpB,GAAG,EAAE,CAAC;IACN,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,MAAM;IACf,GAAG,EAAE,CAAC;CACP,CAAC"}
+{"version":3,"file":"AtomicOrbitalControls.js","sourceRoot":"","sources":["../../../src/orbital/ui/AtomicOrbitalControls.tsx"],"names":[],"mappings":";AAAA;;;;;GAKG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAI3C,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA+B,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAgBnD;;;;GAIG;AACH,MAAM,UAAU,qBAAqB,CACnC,KAAiC;IAEjC,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,QAAQ,EAAE,YAAY,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IAC1E,MAAM,CAAC,GAAG,UAAU,EAAE,CAAC;IACvB,MAAM,QAAQ,GAAgB;QAC5B,KAAK,EAAE,CAAC,CAAC,mBAAmB,CAAC;QAC7B,IAAI,EAAE,CAAC,CAAC,kBAAkB,CAAC;QAC3B,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,qBAAqB,CAAC,EAAE;KAC3D,CAAC;IACF,MAAM,QAAQ,GAAgB;QAC5B,KAAK,EAAE,CAAC,CAAC,mBAAmB,CAAC;QAC7B,IAAI,EAAE,CAAC,CAAC,kBAAkB,CAAC;KAC5B,CAAC;IACF,MAAM,SAAS,GAAgB;QAC7B,KAAK,EAAE,CAAC,CAAC,oBAAoB,CAAC;QAC9B,IAAI,EAAE,CAAC,CAAC,mBAAmB,CAAC;KAC7B,CAAC;IACF,OAAO,CACL,eAAK,KAAK,EAAE,cAAc,aACxB,KAAC,WAAW,IAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAC,QAAQ,YAChD,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,MAAM,EACX,MAAM,EAAE,IAAI,gBACA,CAAC,CAAC,kBAAkB,CAAC,kBACnB,IAAI,EAClB,OAAO,EAAE,YAAY,GACrB,GACU,EACd,KAAC,WAAW,IAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAC,QAAQ,YAChD,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,SAAS,EACd,MAAM,EAAE,QAAQ,gBACJ,CAAC,CAAC,cAAc,CAAC,kBACf,QAAQ,EACtB,OAAO,EAAE,YAAY,GACrB,GACU,EACd,KAAC,WAAW,IAAC,OAAO,EAAE,SAAS,EAAE,SAAS,EAAC,QAAQ,YACjD,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,aAAa,gBACN,CAAC,CAAC,oBAAoB,CAAC,EACnC,OAAO,EAAE,WAAW,GACpB,GACU,IACV,CACP,CAAC;AACJ,CAAC;AAED,MAAM,cAAc,GAAkB;IACpC,QAAQ,EAAE,UAAU;IACpB,GAAG,EAAE,CAAC;IACN,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,MAAM;IACf,GAAG,EAAE,CAAC;CACP,CAAC"}

package/lib/orbital/ui/AtomicOrbitalViewer.d.ts

@@ -52,10 +52,17 @@ export interface AtomicOrbitalViewerProps {
      */
     onAxesChange?: (axes: boolean) => void;
     /**
-     * Whether the scene turns on its own.
+     * Whether the scene turns on its own when the canvas opens. The button in the
+     * canvas's corner flips it from there.
      * @default false
      */
     spinning?: boolean;
+    /**
+     * Called when the student flips the spin, with its new state — so a site can
+     * persist the choice and pass it back as `spinning`.
+     * @default undefined
+     */
+    onSpinningChange?: (spinning: boolean) => void;
     /**
      * How fast it turns, in molstar's own spin unit. Lower is slower.
      * @default 0.3

package/lib/orbital/ui/AtomicOrbitalViewer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AtomicOrbitalViewer.d.ts","sourceRoot":"","sources":["../../../src/orbital/ui/AtomicOrbitalViewer.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAGH,OAAO,KAAK,EAAiB,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKpE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACvD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAIvD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAQxD,4CAA4C;AAC5C,MAAM,WAAW,wBAAwB;IACvC,6CAA6C;IAC7C,YAAY,EAAE,MAAM,CAAC;IACrB,0EAA0E;IAC1E,SAAS,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,gBAAgB,CAAC;IACvC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;OAIG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACxC;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,CAAC,UAAU,EAAE,gBAAgB,KAAK,SAAS,CAAC;IAChE;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,wBAAwB,GAC9B,YAAY,CAiCd"}
+{"version":3,"file":"AtomicOrbitalViewer.d.ts","sourceRoot":"","sources":["../../../src/orbital/ui/AtomicOrbitalViewer.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAGH,OAAO,KAAK,EAAiB,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKpE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACvD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAIvD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAQxD,4CAA4C;AAC5C,MAAM,WAAW,wBAAwB;IACvC,6CAA6C;IAC7C,YAAY,EAAE,MAAM,CAAC;IACrB,0EAA0E;IAC1E,SAAS,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,gBAAgB,CAAC;IACvC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;OAIG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IAC/C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACxC;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,CAAC,UAAU,EAAE,gBAAgB,KAAK,SAAS,CAAC;IAChE;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,wBAAwB,GAC9B,YAAY,CAiCd"}

package/lib/orbital/ui/AtomicOrbitalViewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"AtomicOrbitalViewer.js","sourceRoot":"","sources":["../../../src/orbital/ui/AtomicOrbitalViewer.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,mCAAmC,CAAC;AAQ1D,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAExD,MAAM,mBAAmB,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE;IAC1C,MAAM,MAAM,GAAG,MAAM,MAAM,CAAC,0BAA2B,CAAC,CAAC;IACzD,OAAO,EAAE,OAAO,EAAE,MAAM,CAAC,mBAAmB,EAAE,CAAC;AACjD,CAAC,CAAC,CAAC;AA4EH;;;;GAIG;AACH,MAAM,UAAU,mBAAmB,CACjC,KAA+B;IAE/B,MAAM,EAAE,QAAQ,EAAE,iBAAiB,EAAE,SAAS,EAAE,GAAG,MAAM,EAAE,GAAG,KAAK,CAAC;IACpE,MAAM,CAAC,GAAG,UAAU,EAAE,CAAC;IACvB,MAAM,CAAC,UAAU,CAAC,GAAG,QAAQ,CAAC,qBAAqB,CAAC,CAAC;IACrD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAE5D,IAAI,CAAC,UAAU,CAAC,SAAS,EAAE,CAAC;QAC1B,OAAO,CACL,KAAC,OAAO,IAAC,MAAM,EAAC,SAAS,EAAC,OAAO,QAAC,SAAS,EAAE,SAAS,YACnD,iBAAiB,EAAE,CAAC,UAAU,CAAC;gBAC9B,CAAC,CAAC,EAAE,CAAC,qBAAqB,UAAU,CAAC,MAAM,EAAE,EAAE,UAAU,CAAC,OAAO,CAAC,GAC5D,CACX,CAAC;IACJ,CAAC;IAED,OAAO,CACL,eAAK,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,UAAU,aAC1C,KAAC,QAAQ,IACP,QAAQ,EACN,cAAK,KAAK,EAAE,UAAU,YACnB,QAAQ,IAAI,CAAC,CAAC,0BAA0B,CAAC,GACtC,YAGR,KAAC,mBAAmB,OAAK,MAAM,EAAE,eAAe,EAAE,UAAU,GAAI,GACvD,EACV,OAAO,KAAK,IAAI,IAAI,CACnB,KAAC,OAAO,IAAC,MAAM,EAAC,QAAQ,EAAC,OAAO,QAAC,KAAK,EAAE,CAAC,CAAC,sBAAsB,CAAC,YAC9D,OAAO,GACA,CACX,IACG,CACP,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,GAAkB;IAChC,OAAO,EAAE,MAAM;IACf,aAAa,EAAE,QAAQ;IACvB,GAAG,EAAE,CAAC;IACN,QAAQ,EAAE,CAAC;CACZ,CAAC;AAEF,MAAM,UAAU,GAAkB;IAChC,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,cAAc,EAAE,QAAQ;IACxB,SAAS,EAAE,GAAG;IACd,OAAO,EAAE,EAAE;IACX,YAAY,EAAE,CAAC;IACf,UAAU,EAAE,KAAK,CAAC,aAAa;IAC/B,KAAK,EAAE,KAAK,CAAC,SAAS;IACtB,QAAQ,EAAE,EAAE;IACZ,SAAS,EAAE,QAAQ;CACpB,CAAC"}
+{"version":3,"file":"AtomicOrbitalViewer.js","sourceRoot":"","sources":["../../../src/orbital/ui/AtomicOrbitalViewer.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,mCAAmC,CAAC;AAQ1D,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAExD,MAAM,mBAAmB,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE;IAC1C,MAAM,MAAM,GAAG,MAAM,MAAM,CAAC,0BAA2B,CAAC,CAAC;IACzD,OAAO,EAAE,OAAO,EAAE,MAAM,CAAC,mBAAmB,EAAE,CAAC;AACjD,CAAC,CAAC,CAAC;AAmFH;;;;GAIG;AACH,MAAM,UAAU,mBAAmB,CACjC,KAA+B;IAE/B,MAAM,EAAE,QAAQ,EAAE,iBAAiB,EAAE,SAAS,EAAE,GAAG,MAAM,EAAE,GAAG,KAAK,CAAC;IACpE,MAAM,CAAC,GAAG,UAAU,EAAE,CAAC;IACvB,MAAM,CAAC,UAAU,CAAC,GAAG,QAAQ,CAAC,qBAAqB,CAAC,CAAC;IACrD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAE5D,IAAI,CAAC,UAAU,CAAC,SAAS,EAAE,CAAC;QAC1B,OAAO,CACL,KAAC,OAAO,IAAC,MAAM,EAAC,SAAS,EAAC,OAAO,QAAC,SAAS,EAAE,SAAS,YACnD,iBAAiB,EAAE,CAAC,UAAU,CAAC;gBAC9B,CAAC,CAAC,EAAE,CAAC,qBAAqB,UAAU,CAAC,MAAM,EAAE,EAAE,UAAU,CAAC,OAAO,CAAC,GAC5D,CACX,CAAC;IACJ,CAAC;IAED,OAAO,CACL,eAAK,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,UAAU,aAC1C,KAAC,QAAQ,IACP,QAAQ,EACN,cAAK,KAAK,EAAE,UAAU,YACnB,QAAQ,IAAI,CAAC,CAAC,0BAA0B,CAAC,GACtC,YAGR,KAAC,mBAAmB,OAAK,MAAM,EAAE,eAAe,EAAE,UAAU,GAAI,GACvD,EACV,OAAO,KAAK,IAAI,IAAI,CACnB,KAAC,OAAO,IAAC,MAAM,EAAC,QAAQ,EAAC,OAAO,QAAC,KAAK,EAAE,CAAC,CAAC,sBAAsB,CAAC,YAC9D,OAAO,GACA,CACX,IACG,CACP,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,GAAkB;IAChC,OAAO,EAAE,MAAM;IACf,aAAa,EAAE,QAAQ;IACvB,GAAG,EAAE,CAAC;IACN,QAAQ,EAAE,CAAC;CACZ,CAAC;AAEF,MAAM,UAAU,GAAkB;IAChC,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,cAAc,EAAE,QAAQ;IACxB,SAAS,EAAE,GAAG;IACd,OAAO,EAAE,EAAE;IACX,YAAY,EAAE,CAAC;IACf,UAAU,EAAE,KAAK,CAAC,aAAa;IAC/B,KAAK,EAAE,KAAK,CAAC,SAAS;IACtB,QAAQ,EAAE,EAAE;IACZ,SAAS,EAAE,QAAQ;CACpB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-cheminfo",
-  "version": "0.32.0",
+  "version": "0.33.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",

package/src/i18n/core/chromeCatalog.ts

@@ -19,7 +19,7 @@ export type ChromeKey = keyof typeof en;
 
 /**
  * The chrome's messages. English is part of the page because it is what a
- * missing message falls back to; the other three arrive as a chunk of their
+ * missing message falls back to; every other language arrives as a chunk of its
  * own, so a site read only in English downloads none of them.
  */
 export const CHROME_CATALOG = new MessageCatalog<ChromeKey>({
@@ -27,9 +27,15 @@ export const CHROME_CATALOG = new MessageCatalog<ChromeKey>({
   repository: 'cheminfo/react-cheminfo',
   directory: 'src/locales',
   source: en,
+  // No `with { type: 'json' }` on these: Vite turns a JSON file into a real
+  // JavaScript module, and the attribute makes the browser refuse the chunk it
+  // serves for being `text/javascript` — the chrome then stays in English with
+  // nothing failing at build or type-check time. The English import above is
+  // static, so the bundler resolves it before a browser ever sees it.
   translations: {
-    fr: () => import('../../locales/fr.json', { with: { type: 'json' } }),
-    de: () => import('../../locales/de.json', { with: { type: 'json' } }),
-    es: () => import('../../locales/es.json', { with: { type: 'json' } }),
+    fr: () => import('../../locales/fr.json'),
+    de: () => import('../../locales/de.json'),
+    es: () => import('../../locales/es.json'),
+    it: () => import('../../locales/it.json'),
   },
 });

package/src/i18n/core/index.ts

@@ -15,6 +15,8 @@ export type {
 } from './messageCatalog.ts';
 export { MessageCatalog } from './messageCatalog.ts';
 export type { MessageValues } from './messageValues.ts';
+export type { ProsePiece } from './prose.ts';
+export { splitProse } from './prose.ts';
 export type { MessageSession } from './session.ts';
 export {
   messageSession,

package/src/i18n/core/languages.ts

@@ -1,13 +1,13 @@
 /**
  * The languages the family speaks.
  *
- * Four, decided together rather than site by site: a visitor who switches to
- * German on one tool and follows a link to the next must land in German there
- * too, and a list that differs between two sites makes that impossible.
+ * Decided together rather than site by site: a visitor who switches to German
+ * on one tool and follows a link to the next must land in German there too, and
+ * a list that differs between two sites makes that impossible.
  */
 
 /** Every language a site of the family is written in. */
-export const LANGUAGES = ['en', 'fr', 'de', 'es'] as const;
+export const LANGUAGES = ['en', 'fr', 'de', 'es', 'it'] as const;
 
 /** One of {@link LANGUAGES}. */
 export type Language = (typeof LANGUAGES)[number];
@@ -31,6 +31,7 @@ export const LANGUAGE_LABELS: Record<Language, string> = {
   fr: 'Français',
   de: 'Deutsch',
   es: 'Español',
+  it: 'Italiano',
 };
 
 /**

package/src/i18n/core/prose.ts

@@ -0,0 +1,53 @@
+/**
+ * Cutting a paragraph at the placeholders that stand for something drawn.
+ *
+ * Pure, and its own module: where a link falls in a sentence is the
+ * translator's decision — German puts the verb last, French rewrites the
+ * possessive around it — so the paragraph is one message with a `{name}` in it
+ * rather than fragments glued around a fixed anchor. What the pieces are drawn
+ * as is `Prose` in `react-cheminfo/ui`.
+ */
+
+/** One piece of a paragraph: authored prose, or something the page draws. */
+export type ProsePiece =
+  | { kind: 'text'; at: number; text: string }
+  | { kind: 'node'; at: number; name: string };
+
+const PLACEHOLDER = /\{(?<name>\w+)\}/g;
+
+/**
+ * Split a paragraph at the placeholders the page has something to draw for.
+ *
+ * A placeholder nobody named is left inside its text piece: it is either a
+ * value the message already had filled in, or a key a translation has got
+ * wrong, and neither is worth throwing the paragraph away for.
+ * @param text - The message, already written in the language of the page.
+ * @param names - The placeholders that stand for something drawn.
+ * @returns The pieces, in order, with no empty text piece between two nodes.
+ * `at` is the offset in the message, which makes it a stable React key.
+ */
+export function splitProse(
+  text: string,
+  names: readonly string[],
+): ProsePiece[] {
+  const wanted = new Set(names);
+  const pieces: ProsePiece[] = [];
+  let cursor = 0;
+  for (const match of text.matchAll(PLACEHOLDER)) {
+    const name = match.groups?.name ?? '';
+    if (!wanted.has(name)) continue;
+    if (match.index > cursor) {
+      pieces.push({
+        kind: 'text',
+        at: cursor,
+        text: text.slice(cursor, match.index),
+      });
+    }
+    pieces.push({ kind: 'node', at: match.index, name });
+    cursor = match.index + match[0].length;
+  }
+  if (cursor < text.length) {
+    pieces.push({ kind: 'text', at: cursor, text: text.slice(cursor) });
+  }
+  return pieces;
+}

package/src/i18n/ui/Prose.tsx

@@ -0,0 +1,47 @@
+/**
+ * A paragraph of authored prose, with its inline marks drawn and its links put
+ * back where the sentence wants them.
+ *
+ * An explanation page is prose, not labels: it carries bold lead-ins, italics
+ * and a handful of links into the tool. `**strong**`, `*emphasis*` and
+ * `` `code` `` are the inline marks `InlineText` reads. A link is a `{name}`
+ * placeholder instead, cut out by `splitProse`, so a translation decides where
+ * in the sentence it falls.
+ */
+
+import type { ReactElement, ReactNode } from 'react';
+import { Fragment } from 'react';
+
+import { InlineText } from '../../pedagogy/ui/InlineText.tsx';
+import { splitProse } from '../core/prose.ts';
+
+/** Props of {@link Prose}. */
+export interface ProseProps {
+  /** The message, already written in the language of the page. */
+  text: string;
+  /**
+   * What each `{name}` placeholder of the message stands for.
+   * @default {}
+   */
+  nodes?: Readonly<Record<string, ReactNode>>;
+}
+
+/**
+ * Draw one piece of prose.
+ * @param props - See {@link ProseProps}.
+ * @returns The prose, marks drawn and placeholders replaced.
+ */
+export function Prose(props: ProseProps): ReactElement {
+  const { text, nodes = {} } = props;
+  return (
+    <>
+      {splitProse(text, Object.keys(nodes)).map((piece) =>
+        piece.kind === 'text' ? (
+          <InlineText key={piece.at} text={piece.text} />
+        ) : (
+          <Fragment key={piece.at}>{nodes[piece.name]}</Fragment>
+        ),
+      )}
+    </>
+  );
+}

package/src/i18n/ui/index.ts

@@ -1,5 +1,7 @@
 export type { LanguageSelectProps } from './LanguageSelect.tsx';
 export { LanguageSelect } from './LanguageSelect.tsx';
+export type { ProseProps } from './Prose.tsx';
+export { Prose } from './Prose.tsx';
 export {
   useIsTranslating,
   useLanguage,

package/src/locales/de.json

@@ -233,6 +233,7 @@
   "overlay.hoverAName": "Fahren Sie über einen Namen, um zu sehen, was er bewirkt.",
   "overlay.dismiss": "Schließen",
   "delimited.copyTable": "Tabelle kopieren",
+  "delimited.copyOrDownload": "Daten kopieren oder herunterladen",
   "delimited.close": "Schließen",
   "delimited.separator": "Trennzeichen",
   "delimited.save": "Speichern",
@@ -262,6 +263,9 @@
   "orbital.axesTitle": "Kartesische Achsen",
   "orbital.axesBody": "x, y und z durch den Kern zeichnen. Die Bezeichnung benennt ein Orbital danach, wo seine Keulen gegenüber ihnen liegen.",
   "orbital.axesExample": "vier Keulen zwischen der y- und der z-Achse, keine auf einer von beiden.",
+  "orbital.spin": "Das Orbital drehen",
+  "orbital.spinTitle": "Drehung",
+  "orbital.spinBody": "Das Orbital langsam um seine senkrechte Achse drehen. Ein fester Blickwinkel verbirgt, welche Keulen auf Sie zeigen; ein drehendes Orbital nicht.",
   "orbital.resetTitle": "Ansicht zurücksetzen",
   "orbital.resetBody": "Zurück zu Blickwinkel und Zoom, mit denen das Orbital geöffnet wurde. Ein Wechsel des Orbitals behält die Ansicht bei, in die Sie es gedreht haben.",
   "viewer.capability.noWindow": "Der 3D-Betrachter braucht ein Browserfenster.",

package/src/locales/en.json

@@ -233,6 +233,7 @@
   "overlay.hoverAName": "Hover a name for what it does.",
   "overlay.dismiss": "Dismiss",
   "delimited.copyTable": "Copy the table",
+  "delimited.copyOrDownload": "Copy or download data",
   "delimited.close": "Close",
   "delimited.separator": "Separator",
   "delimited.save": "Save",
@@ -435,6 +436,9 @@
   "orbital.axesTitle": "Cartesian axes",
   "orbital.axesBody": "Draw x, y and z through the nucleus. The label names an orbital by where its lobes sit against them.",
   "orbital.axesExample": "four lobes between the y and z axes, none on either.",
+  "orbital.spin": "Spin the orbital",
+  "orbital.spinTitle": "Spin",
+  "orbital.spinBody": "Turn the orbital slowly on its vertical axis. One fixed angle hides which lobes point towards you; a turning one does not.",
   "orbital.resetTitle": "Reset the view",
   "orbital.resetBody": "Back to the angle and zoom the orbital opened on. A change of orbital keeps whatever view you have turned it to.",
   "viewer.capability.noWindow": "The 3D viewer needs a browser window.",

package/src/locales/es.json

@@ -233,6 +233,7 @@
   "overlay.hoverAName": "Pase el puntero sobre un nombre para ver qué hace.",
   "overlay.dismiss": "Cerrar",
   "delimited.copyTable": "Copiar la tabla",
+  "delimited.copyOrDownload": "Copiar o descargar los datos",
   "delimited.close": "Cerrar",
   "delimited.separator": "Separador",
   "delimited.save": "Guardar",
@@ -262,6 +263,9 @@
   "orbital.axesTitle": "Ejes cartesianos",
   "orbital.axesBody": "Trazar x, y y z a través del núcleo. La etiqueta nombra un orbital por dónde quedan sus lóbulos respecto a ellos.",
   "orbital.axesExample": "cuatro lóbulos entre los ejes y y z, ninguno sobre ninguno de los dos.",
+  "orbital.spin": "Girar el orbital",
+  "orbital.spinTitle": "Giro",
+  "orbital.spinBody": "Girar lentamente el orbital sobre su eje vertical. Un ángulo fijo oculta qué lóbulos apuntan hacia usted; uno que gira, no.",
   "orbital.resetTitle": "Reiniciar la vista",
   "orbital.resetBody": "Volver al ángulo y al zoom con los que se abrió el orbital. Un cambio de orbital conserva la vista a la que usted lo haya girado.",
   "viewer.capability.noWindow": "El visor 3D necesita una ventana de navegador.",

package/src/locales/fr.json

@@ -233,6 +233,7 @@
   "overlay.hoverAName": "Survolez un nom pour savoir ce qu'il fait.",
   "overlay.dismiss": "Fermer",
   "delimited.copyTable": "Copier le tableau",
+  "delimited.copyOrDownload": "Copier ou télécharger les données",
   "delimited.close": "Fermer",
   "delimited.separator": "Séparateur",
   "delimited.save": "Enregistrer",
@@ -262,6 +263,9 @@
   "orbital.axesTitle": "Axes cartésiens",
   "orbital.axesBody": "Tracer x, y et z à travers le noyau. L'étiquette nomme une orbitale par la position de ses lobes par rapport à eux.",
   "orbital.axesExample": "quatre lobes entre les axes y et z, aucun sur l'un ou l'autre.",
+  "orbital.spin": "Faire tourner l'orbitale",
+  "orbital.spinTitle": "Rotation",
+  "orbital.spinBody": "Faire tourner lentement l'orbitale sur son axe vertical. Un angle fixe cache quels lobes pointent vers vous ; une orbitale qui tourne, non.",
   "orbital.resetTitle": "Réinitialiser la vue",
   "orbital.resetBody": "Revenir à l'angle et au zoom d'ouverture de l'orbitale. Un changement d'orbitale conserve la vue à laquelle vous l'avez tournée.",
   "viewer.capability.noWindow": "La visionneuse 3D a besoin d'une fenêtre de navigateur.",