react-cheminfo 0.40.0 → 0.41.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bin/check-deploy.mjs +3 -1
- package/lib/deploy/core/buildGate.d.ts +18 -0
- package/lib/deploy/core/buildGate.d.ts.map +1 -0
- package/lib/deploy/core/buildGate.js +115 -0
- package/lib/deploy/core/buildGate.js.map +1 -0
- package/lib/deploy/core/checkDeploy.d.ts +2 -1
- package/lib/deploy/core/checkDeploy.d.ts.map +1 -1
- package/lib/deploy/core/checkDeploy.js +4 -1
- package/lib/deploy/core/checkDeploy.js.map +1 -1
- package/lib/deploy/core/index.d.ts +1 -0
- package/lib/deploy/core/index.d.ts.map +1 -1
- package/lib/deploy/core/index.js +1 -0
- package/lib/deploy/core/index.js.map +1 -1
- package/lib/deploy/core/publishedImage.d.ts.map +1 -1
- package/lib/deploy/core/publishedImage.js +5 -1
- package/lib/deploy/core/publishedImage.js.map +1 -1
- package/lib/deploy/core/types.d.ts +1 -1
- package/lib/deploy/core/types.d.ts.map +1 -1
- package/lib/deploy/core/types.js.map +1 -1
- package/lib/molecule3d/ui/viewer.d.ts.map +1 -1
- package/lib/molecule3d/ui/viewer.js +4 -6
- package/lib/molecule3d/ui/viewer.js.map +1 -1
- package/lib/{molecule3d/ui → molstar/core}/captureScene.d.ts +1 -1
- package/lib/molstar/core/captureScene.d.ts.map +1 -0
- package/lib/molstar/core/captureScene.js.map +1 -0
- package/lib/molstar/core/hover.js +2 -1
- package/lib/molstar/core/hover.js.map +1 -1
- package/lib/molstar/core/index.d.ts +19 -0
- package/lib/molstar/core/index.d.ts.map +1 -1
- package/lib/molstar/core/index.js +18 -0
- package/lib/molstar/core/index.js.map +1 -1
- package/lib/{molecule3d/ui → molstar/core}/measurements.d.ts +6 -6
- package/lib/molstar/core/measurements.d.ts.map +1 -0
- package/lib/{molecule3d/ui → molstar/core}/measurements.js +7 -5
- package/lib/molstar/core/measurements.js.map +1 -0
- package/lib/molstar/core/plugin.d.ts +4 -1
- package/lib/molstar/core/plugin.d.ts.map +1 -1
- package/lib/molstar/core/plugin.js +4 -1
- package/lib/molstar/core/plugin.js.map +1 -1
- package/lib/periodic/ui/ElementCell.d.ts +1 -1
- package/lib/periodic/ui/ElementCell.d.ts.map +1 -1
- package/lib/periodic/ui/ElementCell.js +12 -11
- package/lib/periodic/ui/ElementCell.js.map +1 -1
- package/lib/periodic/ui/PeriodicTable.d.ts.map +1 -1
- package/lib/periodic/ui/PeriodicTable.js +25 -8
- package/lib/periodic/ui/PeriodicTable.js.map +1 -1
- package/lib/periodic/ui/PeriodicTableChrome.d.ts.map +1 -1
- package/lib/periodic/ui/PeriodicTableChrome.js +3 -2
- package/lib/periodic/ui/PeriodicTableChrome.js.map +1 -1
- package/lib/periodic/ui/unit.d.ts +41 -0
- package/lib/periodic/ui/unit.d.ts.map +1 -0
- package/lib/periodic/ui/unit.js +45 -0
- package/lib/periodic/ui/unit.js.map +1 -0
- package/lib/share/ui/SharePartRow.d.ts.map +1 -1
- package/lib/share/ui/SharePartRow.js +2 -1
- package/lib/share/ui/SharePartRow.js.map +1 -1
- package/package.json +2 -2
- package/src/deploy/core/buildGate.ts +122 -0
- package/src/deploy/core/checkDeploy.ts +5 -1
- package/src/deploy/core/index.ts +1 -0
- package/src/deploy/core/publishedImage.ts +5 -1
- package/src/deploy/core/types.ts +5 -1
- package/src/molecule3d/ui/viewer.ts +16 -8
- package/src/{molecule3d/ui → molstar/core}/captureScene.ts +1 -1
- package/src/molstar/core/hover.ts +2 -1
- package/src/molstar/core/index.ts +25 -0
- package/src/{molecule3d/ui → molstar/core}/measurements.ts +10 -9
- package/src/molstar/core/plugin.ts +4 -1
- package/src/periodic/ui/ElementCell.tsx +14 -12
- package/src/periodic/ui/PeriodicTable.tsx +25 -8
- package/src/periodic/ui/PeriodicTableChrome.tsx +4 -2
- package/src/periodic/ui/unit.ts +48 -0
- package/src/share/ui/SharePartRow.tsx +6 -1
- package/styles/chrome.css +15 -6
- package/lib/molecule3d/ui/captureScene.d.ts.map +0 -1
- package/lib/molecule3d/ui/captureScene.js.map +0 -1
- package/lib/molecule3d/ui/measurements.d.ts.map +0 -1
- package/lib/molecule3d/ui/measurements.js.map +0 -1
- package/lib/molstar.d.ts +0 -18
- package/lib/molstar.d.ts.map +0 -1
- package/lib/molstar.js +0 -17
- package/lib/molstar.js.map +0 -1
- package/src/molstar.ts +0 -22
- /package/lib/{molecule3d/ui → molstar/core}/captureScene.js +0 -0
|
@@ -53,7 +53,11 @@ export function readPublishedImage(
|
|
|
53
53
|
}
|
|
54
54
|
|
|
55
55
|
const value = match.groups.value ?? '';
|
|
56
|
-
|
|
56
|
+
// Either guard keeps a branch name out: `event_name == 'push'` fires only for
|
|
57
|
+
// the tag push, and `ref_type == 'tag'` only when the ref is one. What is
|
|
58
|
+
// refused is the bare ref, which a manual run hands over as a branch.
|
|
59
|
+
const guarded = value.includes('event_name') || value.includes('ref_type');
|
|
60
|
+
if (value.includes('github.ref_name') && !guarded) {
|
|
57
61
|
problems.push({
|
|
58
62
|
file: DOCKER_IMAGE_WORKFLOW,
|
|
59
63
|
line: lineOf(workflow, TAG_VERSION),
|
package/src/deploy/core/types.ts
CHANGED
|
@@ -12,7 +12,11 @@ export type DeployProblemKind =
|
|
|
12
12
|
| 'missing-deploy-ignore'
|
|
13
13
|
| 'cacheable-page'
|
|
14
14
|
| 'unpublishable-image'
|
|
15
|
-
| 'brittle-install'
|
|
15
|
+
| 'brittle-install'
|
|
16
|
+
| 'ungated-build'
|
|
17
|
+
| 'missing-build-only'
|
|
18
|
+
| 'test-runs-e2e'
|
|
19
|
+
| 'gated-image-build';
|
|
16
20
|
|
|
17
21
|
/** One way a repository would fail, or silently mis-deploy, on the server. */
|
|
18
22
|
export interface DeployProblem {
|
|
@@ -13,7 +13,11 @@ import type { PluginContext } from 'molstar/lib/mol-plugin/context.js';
|
|
|
13
13
|
import {
|
|
14
14
|
DEFAULT_CAMERA_DURATION,
|
|
15
15
|
DEFAULT_SPIN_SPEED,
|
|
16
|
+
MeasurementPicker,
|
|
16
17
|
MolstarPlugin,
|
|
18
|
+
captureScene,
|
|
19
|
+
clearMeasurements,
|
|
20
|
+
renderMeasurements,
|
|
17
21
|
setSpin,
|
|
18
22
|
} from '../../molstar/core/index.ts';
|
|
19
23
|
import type { Molecule3DCamera } from '../core/camera.ts';
|
|
@@ -22,13 +26,11 @@ import type { Measurement, MeasurementKind } from '../core/measurement.ts';
|
|
|
22
26
|
import type { Molecule3DFile } from '../core/settings.ts';
|
|
23
27
|
|
|
24
28
|
import { applyCamera, resetCamera, watchCamera } from './camera.ts';
|
|
25
|
-
import { captureScene } from './captureScene.ts';
|
|
26
29
|
import {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
} from './
|
|
31
|
-
import { clearMolecule, renderMolecule } from './renderMolecule.ts';
|
|
30
|
+
clearMolecule,
|
|
31
|
+
moleculeStructure,
|
|
32
|
+
renderMolecule,
|
|
33
|
+
} from './renderMolecule.ts';
|
|
32
34
|
import { clearSurface, renderSurface } from './renderSurface.ts';
|
|
33
35
|
import type {
|
|
34
36
|
Molecule3DViewerOptions,
|
|
@@ -59,7 +61,11 @@ export class Molecule3DViewer {
|
|
|
59
61
|
// Registered before any `#run`, so the picker exists by the time one runs.
|
|
60
62
|
void this.#plugin
|
|
61
63
|
.run((plugin) => {
|
|
62
|
-
this.#picker = new MeasurementPicker(
|
|
64
|
+
this.#picker = new MeasurementPicker(
|
|
65
|
+
plugin,
|
|
66
|
+
onMeasure,
|
|
67
|
+
moleculeStructure,
|
|
68
|
+
);
|
|
63
69
|
})
|
|
64
70
|
.catch(ignore);
|
|
65
71
|
}
|
|
@@ -112,7 +118,9 @@ export class Molecule3DViewer {
|
|
|
112
118
|
* @returns Nothing; resolves once the labels are on screen.
|
|
113
119
|
*/
|
|
114
120
|
showMeasurements(measurements: readonly Measurement[]): Promise<void> {
|
|
115
|
-
return this.#run((plugin) =>
|
|
121
|
+
return this.#run((plugin) =>
|
|
122
|
+
renderMeasurements(plugin, measurements, moleculeStructure),
|
|
123
|
+
);
|
|
116
124
|
}
|
|
117
125
|
|
|
118
126
|
/**
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
import type { PluginContext } from 'molstar/lib/mol-plugin/context.js';
|
|
6
6
|
|
|
7
|
-
import type { ImageSize } from '
|
|
7
|
+
import type { ImageSize } from '../../molecule3d/core/exportImage.ts';
|
|
8
8
|
|
|
9
9
|
/**
|
|
10
10
|
* Render the scene without its selection highlights or its axes.
|
|
@@ -97,7 +97,8 @@ export function atomName(element: string, index: number): string {
|
|
|
97
97
|
|
|
98
98
|
/**
|
|
99
99
|
* Molstar's label providers return HTML, and a readout is plain text.
|
|
100
|
-
* @param label
|
|
100
|
+
* @param label - The provider's label.
|
|
101
|
+
* @returns The same label with its tags and entities resolved.
|
|
101
102
|
*/
|
|
102
103
|
function stripMarkup(label: string): string {
|
|
103
104
|
return label
|
|
@@ -1,3 +1,20 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* The molstar layer under the 3D views: the plugin lifecycle, the camera, the
|
|
3
|
+
* hover labels, the measurements and the picture of a scene.
|
|
4
|
+
*
|
|
5
|
+
* Three of our sites mount a headless molstar canvas — the molecule viewer
|
|
6
|
+
* here, lcao's orbitals and symmetry's crystals — and each of them had its own
|
|
7
|
+
* copy of the lifecycle, the spec and the spin. This is that one copy; what
|
|
8
|
+
* stays in a site is the scene it draws.
|
|
9
|
+
*
|
|
10
|
+
* **Importing this pulls molstar in statically**, which is why it is reached
|
|
11
|
+
* through the `./molstar/*` pattern rather than a plain subpath: molstar is an
|
|
12
|
+
* optional peer, so a plain subpath would be one the package test imports —
|
|
13
|
+
* in a project that installs no optional peer — and it cannot succeed there.
|
|
14
|
+
* A site that only wants `<MoleculeViewer3D>` imports `react-cheminfo/molecule3d`,
|
|
15
|
+
* whose canvas is lazy and whose barrel stays molstar-free.
|
|
16
|
+
*/
|
|
17
|
+
|
|
1
18
|
export type { CameraPose, CameraReference, PoseOptions } from './cameraPose.ts';
|
|
2
19
|
export { cameraToPose, poseToCamera } from './cameraPose.ts';
|
|
3
20
|
export {
|
|
@@ -11,3 +28,11 @@ export {
|
|
|
11
28
|
export { atomName, atomText, lociText, subscribeHover } from './hover.ts';
|
|
12
29
|
export type { MolstarPluginOptions } from './plugin.ts';
|
|
13
30
|
export { MolstarPlugin } from './plugin.ts';
|
|
31
|
+
export { captureScene } from './captureScene.ts';
|
|
32
|
+
export type { MoleculeStructureSource } from './measurements.ts';
|
|
33
|
+
export {
|
|
34
|
+
MeasurementPicker,
|
|
35
|
+
atomReferenceOf,
|
|
36
|
+
clearMeasurements,
|
|
37
|
+
renderMeasurements,
|
|
38
|
+
} from './measurements.ts';
|
|
@@ -26,10 +26,8 @@ import type {
|
|
|
26
26
|
AtomReference,
|
|
27
27
|
Measurement,
|
|
28
28
|
MeasurementKind,
|
|
29
|
-
} from '
|
|
30
|
-
import { MEASUREMENT_ATOM_COUNTS } from '
|
|
31
|
-
|
|
32
|
-
import { moleculeStructure } from './renderMolecule.ts';
|
|
29
|
+
} from '../../molecule3d/core/measurement.ts';
|
|
30
|
+
import { MEASUREMENT_ATOM_COUNTS } from '../../molecule3d/core/measurement.ts';
|
|
33
31
|
|
|
34
32
|
// Lowercased: it is a factory, not a constructor.
|
|
35
33
|
const elementLoci = StructureElement.Loci;
|
|
@@ -37,9 +35,8 @@ const elementLoci = StructureElement.Loci;
|
|
|
37
35
|
/**
|
|
38
36
|
* Where the atoms a measurement addresses are found in the plugin's state.
|
|
39
37
|
*
|
|
40
|
-
*
|
|
41
|
-
*
|
|
42
|
-
* default is the one `<MoleculeViewer3D>` draws.
|
|
38
|
+
* Every site builds its scene under refs of its own, so it says here which
|
|
39
|
+
* structure the clicks and the labels are read against.
|
|
43
40
|
*/
|
|
44
41
|
export type MoleculeStructureSource = (
|
|
45
42
|
plugin: PluginContext,
|
|
@@ -56,7 +53,7 @@ export type MoleculeStructureSource = (
|
|
|
56
53
|
export async function renderMeasurements(
|
|
57
54
|
plugin: PluginContext,
|
|
58
55
|
measurements: readonly Measurement[],
|
|
59
|
-
structureOf: MoleculeStructureSource
|
|
56
|
+
structureOf: MoleculeStructureSource,
|
|
60
57
|
): Promise<void> {
|
|
61
58
|
await clearMeasurements(plugin);
|
|
62
59
|
const structure = structureOf(plugin);
|
|
@@ -96,19 +93,23 @@ export class MeasurementPicker {
|
|
|
96
93
|
readonly #plugin: PluginContext;
|
|
97
94
|
readonly #onMeasure: (measurement: Measurement) => void;
|
|
98
95
|
readonly #unsubscribe: () => void;
|
|
96
|
+
readonly #structureOf: MoleculeStructureSource;
|
|
99
97
|
#kind: MeasurementKind | null = null;
|
|
100
98
|
|
|
101
99
|
/**
|
|
102
100
|
* Start listening to the selection history of `plugin`.
|
|
103
101
|
* @param plugin - The molstar context.
|
|
104
102
|
* @param onMeasure - Called with each measurement once its atoms are picked.
|
|
103
|
+
* @param structureOf - See {@link MoleculeStructureSource}.
|
|
105
104
|
*/
|
|
106
105
|
constructor(
|
|
107
106
|
plugin: PluginContext,
|
|
108
107
|
onMeasure: (measurement: Measurement) => void,
|
|
108
|
+
structureOf: MoleculeStructureSource,
|
|
109
109
|
) {
|
|
110
110
|
this.#plugin = plugin;
|
|
111
111
|
this.#onMeasure = onMeasure;
|
|
112
|
+
this.#structureOf = structureOf;
|
|
112
113
|
// A molfile is one residue: at molstar's default granularity a click
|
|
113
114
|
// would pick the whole molecule.
|
|
114
115
|
plugin.managers.interactivity.setProps({ granularity: 'element' });
|
|
@@ -142,7 +143,7 @@ export class MeasurementPicker {
|
|
|
142
143
|
|
|
143
144
|
#collect(): void {
|
|
144
145
|
const kind = this.#kind;
|
|
145
|
-
const structure =
|
|
146
|
+
const structure = this.#structureOf(this.#plugin);
|
|
146
147
|
if (kind === null || structure === undefined) return;
|
|
147
148
|
const needed = MEASUREMENT_ATOM_COUNTS[kind];
|
|
148
149
|
// The history is newest first.
|
|
@@ -86,7 +86,10 @@ export class MolstarPlugin {
|
|
|
86
86
|
this.ready = this.#model.initialized;
|
|
87
87
|
}
|
|
88
88
|
|
|
89
|
-
/**
|
|
89
|
+
/**
|
|
90
|
+
* Whether {@link dispose} has been called.
|
|
91
|
+
* @returns True once the canvas has been torn down.
|
|
92
|
+
*/
|
|
90
93
|
get disposed(): boolean {
|
|
91
94
|
return this.#disposed;
|
|
92
95
|
}
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* A cell is a real `<button>`, so Tab reaches it, Enter and Space activate it,
|
|
6
6
|
* and a screen reader reads the element's name rather than its symbol.
|
|
7
7
|
*
|
|
8
|
-
* Everything written in it is
|
|
8
|
+
* Everything written in it is a share of the table's width, so a cell shows
|
|
9
9
|
* the same proportions at 280px beside a chart and across a lecture-hall
|
|
10
10
|
* screen — the table a class reads is the same drawing, larger.
|
|
11
11
|
*/
|
|
@@ -16,6 +16,8 @@ import { useState } from 'react';
|
|
|
16
16
|
import type { Swatch } from '../../color/core/interpolate.ts';
|
|
17
17
|
import { useChromeT } from '../../i18n/ui/useT.ts';
|
|
18
18
|
|
|
19
|
+
import { UNIT, ofWidth } from './unit.ts';
|
|
20
|
+
|
|
19
21
|
/** What {@link ElementCell} needs to draw one element. */
|
|
20
22
|
export interface ElementCellProps {
|
|
21
23
|
/** Atomic number, written small in the corner. */
|
|
@@ -120,8 +122,8 @@ export function ElementCell(props: ElementCellProps): ReactElement {
|
|
|
120
122
|
outlineColor: swatch.foreground,
|
|
121
123
|
// Thick enough to be seen from the back of a room, and drawn inside
|
|
122
124
|
// the cell so a neighbour never covers it.
|
|
123
|
-
outlineWidth:
|
|
124
|
-
outlineOffset:
|
|
125
|
+
outlineWidth: `max(2px, ${ofWidth(0.3)})`,
|
|
126
|
+
outlineOffset: `max(-3px, ${ofWidth(-0.4)})`,
|
|
125
127
|
// The cell the pointer is on, for a class following a demonstration.
|
|
126
128
|
filter: isHovered ? 'brightness(1.08)' : undefined,
|
|
127
129
|
}}
|
|
@@ -154,7 +156,7 @@ export function ElementCell(props: ElementCellProps): ReactElement {
|
|
|
154
156
|
* @returns A CSS length.
|
|
155
157
|
*/
|
|
156
158
|
function symbolFontSize(symbol: string): string {
|
|
157
|
-
return fitted(symbolWidthInEm(symbol),
|
|
159
|
+
return fitted(symbolWidthInEm(symbol), SYMBOL_CAP, '0.5rem');
|
|
158
160
|
}
|
|
159
161
|
|
|
160
162
|
/**
|
|
@@ -167,7 +169,7 @@ function symbolFontSize(symbol: string): string {
|
|
|
167
169
|
* @returns A CSS length.
|
|
168
170
|
*/
|
|
169
171
|
function detailFontSize(detail: string): string {
|
|
170
|
-
return fitted(detailWidthInEm(detail),
|
|
172
|
+
return fitted(detailWidthInEm(detail), DETAIL_CAP, '0.25rem');
|
|
171
173
|
}
|
|
172
174
|
|
|
173
175
|
/**
|
|
@@ -182,7 +184,7 @@ function detailFontSize(detail: string): string {
|
|
|
182
184
|
* @returns A CSS length.
|
|
183
185
|
*/
|
|
184
186
|
function fitted(widthInEm: number, cap: string, floor: string): string {
|
|
185
|
-
const room = `calc((${
|
|
187
|
+
const room = `calc((${UNIT} * ${String(CELL_SHARE)} - ${CELL_CHROME}) / ${widthInEm.toFixed(2)})`;
|
|
186
188
|
return `max(${floor}, min(${cap}, ${room}))`;
|
|
187
189
|
}
|
|
188
190
|
|
|
@@ -222,7 +224,7 @@ function detailWidthInEm(detail: string): number {
|
|
|
222
224
|
const TABULAR_EM = 0.6;
|
|
223
225
|
|
|
224
226
|
/** The size the symbol is written at wherever it fits, as a share of the table. */
|
|
225
|
-
const
|
|
227
|
+
const SYMBOL_CAP = ofWidth(2.4);
|
|
226
228
|
|
|
227
229
|
/**
|
|
228
230
|
* The tallest the third line is ever written, as a share of the table.
|
|
@@ -231,7 +233,7 @@ const SYMBOL_CQW = '2.4cqw';
|
|
|
231
233
|
* the value is what the table is being read for, and a value half the size of
|
|
232
234
|
* the symbol is the one thing on the cell a class cannot make out.
|
|
233
235
|
*/
|
|
234
|
-
const
|
|
236
|
+
const DETAIL_CAP = ofWidth(1.6);
|
|
235
237
|
|
|
236
238
|
/**
|
|
237
239
|
* The band at each end of a cell: the atomic number at the top, whatever the
|
|
@@ -241,10 +243,10 @@ const DETAIL_CQW = '1.6cqw';
|
|
|
241
243
|
* sit at the centre of the cell rather than near it — a bottom band wider than
|
|
242
244
|
* the top one by a third lifted every symbol in the table two pixels.
|
|
243
245
|
*/
|
|
244
|
-
const EDGE_BAND =
|
|
246
|
+
const EDGE_BAND = ofWidth(1.8);
|
|
245
247
|
|
|
246
|
-
/** How wide one column is,
|
|
247
|
-
const
|
|
248
|
+
/** How wide one column is, in per cent of the table's width. */
|
|
249
|
+
const CELL_SHARE = 4.85;
|
|
248
250
|
|
|
249
251
|
/** What the border and the padding of a cell take off that width. */
|
|
250
252
|
const CELL_CHROME = '4px';
|
|
@@ -275,7 +277,7 @@ const cellStyle = {
|
|
|
275
277
|
|
|
276
278
|
const numberStyle = {
|
|
277
279
|
alignSelf: 'start',
|
|
278
|
-
fontSize:
|
|
280
|
+
fontSize: `max(0.33rem, ${ofWidth(1.1)})`,
|
|
279
281
|
fontVariantNumeric: 'tabular-nums',
|
|
280
282
|
justifySelf: 'start',
|
|
281
283
|
lineHeight: 1,
|
|
@@ -19,6 +19,7 @@ import type {
|
|
|
19
19
|
import { useEffect, useRef } from 'react';
|
|
20
20
|
|
|
21
21
|
import type { Swatch } from '../../color/core/interpolate.ts';
|
|
22
|
+
import { useResizeObserver } from '../../hooks/ui/useResizeObserver.ts';
|
|
22
23
|
import { useChromeT } from '../../i18n/ui/useT.ts';
|
|
23
24
|
import { categorySwatch } from '../core/categories.ts';
|
|
24
25
|
import type { PeriodicElement } from '../core/elements.ts';
|
|
@@ -36,6 +37,7 @@ import {
|
|
|
36
37
|
HeaderStrips,
|
|
37
38
|
InnerTransitionMarkers,
|
|
38
39
|
} from './PeriodicTableChrome.tsx';
|
|
40
|
+
import { UNIT_PROPERTY, ofWidth, unitValue } from './unit.ts';
|
|
39
41
|
|
|
40
42
|
/** What {@link PeriodicTable} needs. */
|
|
41
43
|
export interface PeriodicTableProps {
|
|
@@ -147,10 +149,22 @@ export function PeriodicTable(props: PeriodicTableProps): ReactElement {
|
|
|
147
149
|
} = props;
|
|
148
150
|
|
|
149
151
|
const t = useChromeT();
|
|
152
|
+
const rootRef = useRef<HTMLDivElement>(null);
|
|
150
153
|
const gridRef = useRef<HTMLDivElement>(null);
|
|
151
154
|
const cameFromKeyRef = useRef(false);
|
|
152
155
|
const offset = headers ? 1 : 0;
|
|
153
156
|
|
|
157
|
+
// The drawing is read off this one number, so it is written straight onto
|
|
158
|
+
// the element rather than held as state: a window being dragged would
|
|
159
|
+
// otherwise re-render all 118 cells per frame, and the engine recomputes
|
|
160
|
+
// every length from the custom property on its own. A width of zero is a
|
|
161
|
+
// table in a tab nobody has opened; the last measurement stands until it is
|
|
162
|
+
// shown, and the observer fires again then.
|
|
163
|
+
useResizeObserver(rootRef, ({ width }) => {
|
|
164
|
+
if (width === 0) return;
|
|
165
|
+
rootRef.current?.style.setProperty(UNIT_PROPERTY, unitValue(width));
|
|
166
|
+
});
|
|
167
|
+
|
|
154
168
|
useEffect(() => {
|
|
155
169
|
if (!cameFromKeyRef.current) return;
|
|
156
170
|
cameFromKeyRef.current = false;
|
|
@@ -171,7 +185,7 @@ export function PeriodicTable(props: PeriodicTableProps): ReactElement {
|
|
|
171
185
|
}
|
|
172
186
|
|
|
173
187
|
return (
|
|
174
|
-
<div className={className} style={rootStyle}>
|
|
188
|
+
<div ref={rootRef} className={className} style={rootStyle}>
|
|
175
189
|
<div
|
|
176
190
|
ref={gridRef}
|
|
177
191
|
role="grid"
|
|
@@ -218,13 +232,13 @@ function insetStyle(offset: number): CSSProperties {
|
|
|
218
232
|
display: 'flex',
|
|
219
233
|
// A column of air on each side, so the writing reads as sitting in the
|
|
220
234
|
// block rather than as running into the cells beside it.
|
|
221
|
-
padding:
|
|
235
|
+
padding: `0 ${ofWidth(2.4)}`,
|
|
222
236
|
gridColumn: `${String(EMPTY_BLOCK.column + offset)} / span ${String(EMPTY_BLOCK.columnSpan)}`,
|
|
223
237
|
gridRow: `${String(EMPTY_BLOCK.row + offset)} / span ${String(EMPTY_BLOCK.rowSpan)}`,
|
|
224
238
|
// A share of the table, with a floor, exactly as a cell sizes its symbol:
|
|
225
239
|
// the block holds the same three rows at every width, so what is written
|
|
226
240
|
// in it has to shrink with them.
|
|
227
|
-
fontSize:
|
|
241
|
+
fontSize: `max(0.6rem, ${ofWidth(1.8)})`,
|
|
228
242
|
lineHeight: 1.35,
|
|
229
243
|
minWidth: 0,
|
|
230
244
|
overflow: 'hidden',
|
|
@@ -256,10 +270,10 @@ const MIN_WIDTH = 280;
|
|
|
256
270
|
* table: a cell keeps the band it writes a value in whether or not that table
|
|
257
271
|
* writes one.
|
|
258
272
|
*/
|
|
259
|
-
const ROW_HEIGHT =
|
|
273
|
+
const ROW_HEIGHT = ofWidth(6.8);
|
|
260
274
|
|
|
261
275
|
/** The band the two inner-transition series were lifted out across. */
|
|
262
|
-
const SERIES_GAP =
|
|
276
|
+
const SERIES_GAP = `max(6px, ${ofWidth(1.1)})`;
|
|
263
277
|
|
|
264
278
|
const rootStyle = {
|
|
265
279
|
display: 'flex',
|
|
@@ -268,7 +282,10 @@ const rootStyle = {
|
|
|
268
282
|
minWidth: MIN_WIDTH,
|
|
269
283
|
// Everything inside — the height of a row as much as the type in a cell — is
|
|
270
284
|
// a share of this box rather than of the page, so the same table reads at
|
|
271
|
-
// 280px beside a chart and fills a lecture-hall screen at twice that.
|
|
285
|
+
// 280px beside a chart and fills a lecture-hall screen at twice that. The
|
|
286
|
+
// share is measured (see `unit.ts`); the container is what the `1cqw`
|
|
287
|
+
// fallback and a site's own `@container` rules are answered by, and it keeps
|
|
288
|
+
// this box's width independent of what is written inside it.
|
|
272
289
|
containerType: 'inline-size',
|
|
273
290
|
} as const satisfies CSSProperties;
|
|
274
291
|
|
|
@@ -297,7 +314,7 @@ function gridStyle(headers: boolean): CSSProperties {
|
|
|
297
314
|
}
|
|
298
315
|
return {
|
|
299
316
|
...baseGridStyle,
|
|
300
|
-
gridTemplateColumns: `max(14px, 2.
|
|
301
|
-
gridTemplateRows: `max(12px,
|
|
317
|
+
gridTemplateColumns: `max(14px, ${ofWidth(2.4)}) repeat(${String(COLUMN_COUNT)}, minmax(0, 1fr))`,
|
|
318
|
+
gridTemplateRows: `max(12px, ${ofWidth(2)}) ${rows}`,
|
|
302
319
|
};
|
|
303
320
|
}
|
|
@@ -14,6 +14,8 @@ import {
|
|
|
14
14
|
INNER_TRANSITION_ROWS,
|
|
15
15
|
} from '../core/layout.ts';
|
|
16
16
|
|
|
17
|
+
import { ofWidth } from './unit.ts';
|
|
18
|
+
|
|
17
19
|
/** What {@link HeaderStrips} needs. */
|
|
18
20
|
interface HeaderStripsProps {
|
|
19
21
|
/**
|
|
@@ -150,7 +152,7 @@ const headerStyle = {
|
|
|
150
152
|
alignItems: 'center',
|
|
151
153
|
color: TOKEN.textMuted,
|
|
152
154
|
display: 'flex',
|
|
153
|
-
fontSize:
|
|
155
|
+
fontSize: `max(0.45rem, ${ofWidth(1.35)})`,
|
|
154
156
|
justifyContent: 'center',
|
|
155
157
|
padding: 0,
|
|
156
158
|
} as const satisfies CSSProperties;
|
|
@@ -168,6 +170,6 @@ const markerStyle = {
|
|
|
168
170
|
borderRadius: 3,
|
|
169
171
|
color: TOKEN.textMuted,
|
|
170
172
|
display: 'flex',
|
|
171
|
-
fontSize:
|
|
173
|
+
fontSize: `max(0.4rem, ${ofWidth(1.15)})`,
|
|
172
174
|
justifyContent: 'center',
|
|
173
175
|
} as const satisfies CSSProperties;
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* The length the whole table is drawn in multiples of.
|
|
3
|
+
*
|
|
4
|
+
* Every part of the drawing — the height of a row, the type in a cell, the
|
|
5
|
+
* band the inner-transition series were lifted out across — is a share of the
|
|
6
|
+
* table's own width, so the same table reads at 280px beside a chart and fills
|
|
7
|
+
* a lecture-hall screen at twice that.
|
|
8
|
+
*
|
|
9
|
+
* The share is a measured length rather than a container-query unit, because
|
|
10
|
+
* WebKit resolves `cqw` against the container's *zoomed* width and then applies
|
|
11
|
+
* the zoom to the result a second time: inside a host that zooms the page — a
|
|
12
|
+
* PowerPoint add-in frame runs at 1.34 — every cq length came out 34% too
|
|
13
|
+
* large, which fits none of the floors the type is held above and overran the
|
|
14
|
+
* cells. `ResizeObserver` reports the content box in the element's own CSS
|
|
15
|
+
* pixels, which is the space `font-size` is resolved in, so one hundredth of
|
|
16
|
+
* that number is the share, on every engine and at any zoom.
|
|
17
|
+
* `getBoundingClientRect` is not: it reports the zoomed width, which would
|
|
18
|
+
* reproduce the defect.
|
|
19
|
+
*
|
|
20
|
+
* `1cqw` stays as the fallback, so a render that never measures — a server
|
|
21
|
+
* render, a prerendered page before its script runs — is the drawing it has
|
|
22
|
+
* always been.
|
|
23
|
+
*/
|
|
24
|
+
|
|
25
|
+
/** The custom property the measured share is published as. */
|
|
26
|
+
export const UNIT_PROPERTY = '--periodic-unit';
|
|
27
|
+
|
|
28
|
+
/** One per cent of the table's width, as a CSS length. */
|
|
29
|
+
export const UNIT = `var(${UNIT_PROPERTY}, 1cqw)`;
|
|
30
|
+
|
|
31
|
+
/**
|
|
32
|
+
* A share of the table's width, as a CSS length.
|
|
33
|
+
* @param share - The share, in per cent of the width.
|
|
34
|
+
* @returns A CSS length, usable wherever a length is.
|
|
35
|
+
*/
|
|
36
|
+
export function ofWidth(share: number): string {
|
|
37
|
+
return `calc(${UNIT} * ${String(share)})`;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
/**
|
|
41
|
+
* The value the custom property takes for a table of the given width.
|
|
42
|
+
* @param width - The content-box width, in CSS pixels, as `ResizeObserver`
|
|
43
|
+
* reports it.
|
|
44
|
+
* @returns The length one per cent of that width is.
|
|
45
|
+
*/
|
|
46
|
+
export function unitValue(width: number): string {
|
|
47
|
+
return `${(width / 100).toFixed(3)}px`;
|
|
48
|
+
}
|
|
@@ -45,6 +45,7 @@ export function SharePartRow(props: SharePartRowProps): ReactElement {
|
|
|
45
45
|
const { label, description, on, descriptions, onChange, onPointed } = props;
|
|
46
46
|
const t = useChromeT();
|
|
47
47
|
const id = useId();
|
|
48
|
+
const labelId = `${id}-label`;
|
|
48
49
|
|
|
49
50
|
return (
|
|
50
51
|
<div
|
|
@@ -54,7 +55,7 @@ export function SharePartRow(props: SharePartRowProps): ReactElement {
|
|
|
54
55
|
onFocus={() => onPointed?.(true)}
|
|
55
56
|
onBlur={() => onPointed?.(false)}
|
|
56
57
|
>
|
|
57
|
-
<label className="share-part__label" htmlFor={id}>
|
|
58
|
+
<label className="share-part__label" htmlFor={id} id={labelId}>
|
|
58
59
|
{label}
|
|
59
60
|
</label>
|
|
60
61
|
{descriptions === 'help' ? (
|
|
@@ -63,6 +64,10 @@ export function SharePartRow(props: SharePartRowProps): ReactElement {
|
|
|
63
64
|
<Switch
|
|
64
65
|
id={id}
|
|
65
66
|
className="share-part__switch"
|
|
67
|
+
// Blueprint wraps the input in a label of its own carrying the On/Off
|
|
68
|
+
// text, and a wrapping label beats an `htmlFor` one: without this the
|
|
69
|
+
// switch is named "OnOff" and a screen reader never says what is on.
|
|
70
|
+
aria-labelledby={labelId}
|
|
66
71
|
checked={on}
|
|
67
72
|
innerLabel={t('share.off')}
|
|
68
73
|
innerLabelChecked={t('share.on')}
|
package/styles/chrome.css
CHANGED
|
@@ -341,33 +341,42 @@ button {
|
|
|
341
341
|
min-height: 0;
|
|
342
342
|
flex: 1 1 auto;
|
|
343
343
|
flex-direction: column;
|
|
344
|
-
padding:
|
|
344
|
+
padding: 0 16px;
|
|
345
345
|
gap: 12px;
|
|
346
346
|
}
|
|
347
347
|
|
|
348
348
|
/* The ready-made links and the three things one does with the link they write,
|
|
349
349
|
on one row: the tabs say which link, the buttons act on it. A dialog too
|
|
350
|
-
narrow for both wraps the buttons under the tabs rather than cutting them.
|
|
350
|
+
narrow for both wraps the buttons under the tabs rather than cutting them.
|
|
351
|
+
|
|
352
|
+
The band owns the space between the dialog's header and its rule — the body
|
|
353
|
+
does not pad above it — so the buttons centre in that whole band whether or
|
|
354
|
+
not the site has tabs to put beside them. */
|
|
351
355
|
.share-dialog__top {
|
|
352
356
|
display: flex;
|
|
353
357
|
flex-wrap: wrap;
|
|
354
|
-
align-items:
|
|
355
|
-
|
|
358
|
+
align-items: center;
|
|
359
|
+
padding: 12px 0;
|
|
356
360
|
border-bottom: 1px solid var(--border);
|
|
357
361
|
gap: 8px 16px;
|
|
358
362
|
}
|
|
359
363
|
|
|
364
|
+
/* The tabs end on the rule, where a tab strip's underline has to be, so they
|
|
365
|
+
are pulled through the band's lower half. */
|
|
360
366
|
.share-dialog__top > .share-presets {
|
|
361
367
|
flex: 1 1 auto;
|
|
362
368
|
min-width: 0;
|
|
369
|
+
align-self: flex-end;
|
|
370
|
+
margin-bottom: -12px;
|
|
363
371
|
}
|
|
364
372
|
|
|
365
|
-
/* The buttons
|
|
366
|
-
|
|
373
|
+
/* The buttons keep the right edge on every site: a dialog with no tabs has
|
|
374
|
+
nothing to push them there. */
|
|
367
375
|
.share-linkbar {
|
|
368
376
|
display: flex;
|
|
369
377
|
align-items: center;
|
|
370
378
|
flex: 0 0 auto;
|
|
379
|
+
margin-left: auto;
|
|
371
380
|
gap: 8px;
|
|
372
381
|
}
|
|
373
382
|
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"captureScene.d.ts","sourceRoot":"","sources":["../../../src/molecule3d/ui/captureScene.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAEvE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAExD;;;;;;GAMG;AACH,wBAAsB,YAAY,CAChC,MAAM,EAAE,aAAa,EACrB,IAAI,EAAE,SAAS,GACd,OAAO,CAAC,MAAM,CAAC,CAYjB"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"captureScene.js","sourceRoot":"","sources":["../../../src/molecule3d/ui/captureScene.ts"],"names":[],"mappings":"AAAA;;GAEG;AAMH;;;;;;GAMG;AACH,MAAM,CAAC,KAAK,UAAU,YAAY,CAChC,MAAqB,EACrB,IAAe;IAEf,MAAM,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,kBAAkB,CAAC;IACjD,IAAI,MAAM,KAAK,SAAS,EAAE,CAAC;QACzB,MAAM,IAAI,KAAK,CAAC,iDAAiD,CAAC,CAAC;IACrE,CAAC;IACD,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC;QAC3B,GAAG,MAAM,CAAC,MAAM;QAChB,UAAU,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE;QAC5C,IAAI,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE;QACjC,WAAW,EAAE,KAAK;KACnB,CAAC,CAAC;IACH,OAAO,MAAM,CAAC,eAAe,EAAE,CAAC;AAClC,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"measurements.d.ts","sourceRoot":"","sources":["../../../src/molecule3d/ui/measurements.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAKH,OAAO,KAAK,EACV,YAAY,EACZ,SAAS,EACV,MAAM,oCAAoC,CAAC;AAE5C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAIvE,OAAO,KAAK,EACV,aAAa,EACb,WAAW,EACX,eAAe,EAChB,MAAM,wBAAwB,CAAC;AAQhC;;;;;;GAMG;AACH,MAAM,MAAM,uBAAuB,GAAG,CACpC,MAAM,EAAE,aAAa,KAClB,SAAS,GAAG,SAAS,CAAC;AAE3B;;;;;;;GAOG;AACH,wBAAsB,kBAAkB,CACtC,MAAM,EAAE,aAAa,EACrB,YAAY,EAAE,SAAS,WAAW,EAAE,EACpC,WAAW,GAAE,uBAA2C,GACvD,OAAO,CAAC,IAAI,CAAC,CAiBf;AAED;;;;GAIG;AACH,wBAAsB,iBAAiB,CAAC,MAAM,EAAE,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,CAQ5E;AAED,2EAA2E;AAC3E,qBAAa,iBAAiB;;IAM5B;;;;OAIG;gBAED,MAAM,EAAE,aAAa,EACrB,SAAS,EAAE,CAAC,WAAW,EAAE,WAAW,KAAK,IAAI;IAkB/C;;;;OAIG;IACH,OAAO,CAAC,IAAI,EAAE,eAAe,GAAG,IAAI,GAAG,IAAI;IAO3C,oCAAoC;IACpC,OAAO,IAAI,IAAI;CAqBhB;AAED;;;;;;;;GAQG;AACH,wBAAgB,eAAe,CAC7B,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,YAAY,GACpB,aAAa,GAAG,SAAS,CAS3B"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"measurements.js","sourceRoot":"","sources":["../../../src/molecule3d/ui/measurements.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAOtE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AAEtE,OAAO,EAAE,mBAAmB,EAAE,MAAM,+DAA+D,CAAC;AACpG,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAOhF,OAAO,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAEjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,kDAAkD;AAClD,MAAM,WAAW,GAAG,gBAAgB,CAAC,IAAI,CAAC;AAa1C;;;;;;;GAOG;AACH,MAAM,CAAC,KAAK,UAAU,kBAAkB,CACtC,MAAqB,EACrB,YAAoC,EACpC,cAAuC,iBAAiB;IAExD,MAAM,iBAAiB,CAAC,MAAM,CAAC,CAAC;IAChC,MAAM,SAAS,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IACtC,IAAI,SAAS,KAAK,SAAS;QAAE,OAAO;IACpC,MAAM,OAAO,GAAG,MAAM,CAAC,QAAQ,CAAC,SAAS,CAAC,WAAW,CAAC;IACtD,KAAK,MAAM,WAAW,IAAI,YAAY,EAAE,CAAC;QACvC,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,QAAQ,CAAC,SAAS,EAAE,WAAW,CAAC,KAAK,CAAC,CAAC;QAC5D,4GAA4G;QAC5G,IAAI,WAAW,CAAC,IAAI,KAAK,UAAU,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;YAC9C,MAAM,OAAO,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QAClC,CAAC;aAAM,IAAI,WAAW,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;YACvD,MAAM,OAAO,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;QAClC,CAAC;aAAM,IAAI,WAAW,CAAC,IAAI,KAAK,UAAU,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;YAC/D,MAAM,OAAO,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;QACxC,CAAC;QACD,oCAAoC;IACtC,CAAC;AACH,CAAC;AAED;;;;GAIG;AACH,MAAM,CAAC,KAAK,UAAU,iBAAiB,CAAC,MAAqB;IAC3D,MAAM,GAAG,GAAG,cAAc,CAAC,gBAAgB,CACzC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,EACtB,cAAc,CAAC,OAAO,EACtB,mBAAmB,CACpB,CAAC;IACF,IAAI,GAAG,KAAK,SAAS;QAAE,OAAO;IAC9B,MAAM,MAAM,CAAC,KAAK,EAAE,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC;AAC5C,CAAC;AAED,2EAA2E;AAC3E,MAAM,OAAO,iBAAiB;IACnB,OAAO,CAAgB;IACvB,UAAU,CAAqC;IAC/C,YAAY,CAAa;IAClC,KAAK,GAA2B,IAAI,CAAC;IAErC;;;;OAIG;IACH,YACE,MAAqB,EACrB,SAA6C;QAE7C,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;QACtB,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;QAC5B,qEAAqE;QACrE,iCAAiC;QACjC,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,CAAC,CAAC;QACnE,MAAM,YAAY,GAChB,MAAM,CAAC,QAAQ,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,CAAC,uBAAuB,CAAC,SAAS,CAC1E,GAAG,EAAE;YACH,IAAI,CAAC,QAAQ,EAAE,CAAC;QAClB,CAAC,CACF,CAAC;QACJ,IAAI,CAAC,YAAY,GAAG,GAAG,EAAE;YACvB,YAAY,CAAC,WAAW,EAAE,CAAC;QAC7B,CAAC,CAAC;IACJ,CAAC;IAED;;;;OAIG;IACH,OAAO,CAAC,IAA4B;QAClC,IAAI,IAAI,KAAK,IAAI,CAAC,KAAK;YAAE,OAAO;QAChC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAClB,IAAI,CAAC,OAAO,CAAC,aAAa,GAAG,IAAI,KAAK,IAAI,CAAC;QAC3C,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC;IAChE,CAAC;IAED,oCAAoC;IACpC,OAAO;QACL,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAED,QAAQ;QACN,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC;QACxB,MAAM,SAAS,GAAG,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAClD,IAAI,IAAI,KAAK,IAAI,IAAI,SAAS,KAAK,SAAS;YAAE,OAAO;QACrD,MAAM,MAAM,GAAG,uBAAuB,CAAC,IAAI,CAAC,CAAC;QAC7C,+BAA+B;QAC/B,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAC,SAAS,CAAC,gBAAgB,CAAC;QAC3E,MAAM,KAAK,GAAoB,EAAE,CAAC;QAClC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC,MAAM,IAAI,KAAK,CAAC,MAAM,GAAG,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;YACjE,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;YACzB,MAAM,IAAI,GAAG,KAAK,IAAI,aAAa,CAAC,SAAS,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;YAC3D,IAAI,IAAI,KAAK,SAAS;gBAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC3C,CAAC;QACD,IAAI,KAAK,CAAC,MAAM,GAAG,MAAM;YAAE,OAAO;QAClC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC;QAC9D,IAAI,CAAC,UAAU,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;IACvD,CAAC;CACF;AAED;;;;;;;;GAQG;AACH,MAAM,UAAU,eAAe,CAC7B,SAAoB,EACpB,OAAqB;IAErB,MAAM,KAAK,GAAG,SAAS,CAAC,KAAK,CAAC;IAC9B,KAAK,IAAI,IAAI,GAAG,CAAC,EAAE,IAAI,GAAG,KAAK,CAAC,MAAM,EAAE,IAAI,EAAE,EAAE,CAAC;QAC/C,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC;QACvC,IAAI,QAAQ,KAAK,SAAS;YAAE,SAAS;QACrC,MAAM,KAAK,GAAG,WAAW,CAAC,OAAO,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;QACrD,IAAI,KAAK,KAAK,CAAC,CAAC;YAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;IACpD,CAAC;IACD,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,SAAS,aAAa,CACpB,SAAoB,EACpB,IAAU;IAEV,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC;QAAE,OAAO,SAAS,CAAC;IACtD,IAAI,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;QAAE,OAAO,SAAS,CAAC;IAC7D,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAC/B,IAAI,KAAK,KAAK,SAAS;QAAE,OAAO,SAAS,CAAC;IAC1C,MAAM,KAAK,GAAG,SAAS,CAAC,KAAK,CAAC;IAC9B,KAAK,IAAI,IAAI,GAAG,CAAC,EAAE,IAAI,GAAG,KAAK,CAAC,MAAM,EAAE,IAAI,EAAE,EAAE,CAAC;QAC/C,IAAI,KAAK,CAAC,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC;YACtC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,UAAU,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC;QAC/D,CAAC;IACH,CAAC;IACD,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,SAAS,QAAQ,CACf,SAAoB,EACpB,KAA+B;IAE/B,MAAM,IAAI,GAA4B,EAAE,CAAC;IACzC,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE,CAAC;QACzB,MAAM,IAAI,GAAG,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACxC,IAAI,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM;YAAE,OAAO,EAAE,CAAC;QAC1E,IAAI,CAAC,IAAI,CACP,WAAW,CAAC,SAAS,EAAE;YACrB,EAAE,IAAI,EAAE,OAAO,EAAE,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,OAAoB,CAAC,EAAE;SACrE,CAAC,CACH,CAAC;IACJ,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC"}
|
package/lib/molstar.d.ts
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* The molstar layer under the 3D views: the plugin lifecycle, the camera, the
|
|
3
|
-
* hover labels, the measurements and the picture of a scene.
|
|
4
|
-
*
|
|
5
|
-
* Three of our sites mount a headless molstar canvas — the molecule viewer
|
|
6
|
-
* here, lcao's orbitals and symmetry's crystals — and each of them had its own
|
|
7
|
-
* copy of the lifecycle, the spec and the spin. This is that one copy; what
|
|
8
|
-
* stays in a site is the scene it draws.
|
|
9
|
-
*
|
|
10
|
-
* **Importing this pulls molstar in statically.** A site that only wants
|
|
11
|
-
* `<MoleculeViewer3D>` imports `react-cheminfo/molecule3d`, whose canvas is
|
|
12
|
-
* lazy.
|
|
13
|
-
*/
|
|
14
|
-
export * from './molstar/core/index.ts';
|
|
15
|
-
export { captureScene } from './molecule3d/ui/captureScene.ts';
|
|
16
|
-
export type { MoleculeStructureSource } from './molecule3d/ui/measurements.ts';
|
|
17
|
-
export { atomReferenceOf, clearMeasurements, renderMeasurements, } from './molecule3d/ui/measurements.ts';
|
|
18
|
-
//# sourceMappingURL=molstar.d.ts.map
|
package/lib/molstar.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"molstar.d.ts","sourceRoot":"","sources":["../src/molstar.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,cAAc,yBAAyB,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,YAAY,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;AAC/E,OAAO,EACL,eAAe,EACf,iBAAiB,EACjB,kBAAkB,GACnB,MAAM,iCAAiC,CAAC"}
|
package/lib/molstar.js
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* The molstar layer under the 3D views: the plugin lifecycle, the camera, the
|
|
3
|
-
* hover labels, the measurements and the picture of a scene.
|
|
4
|
-
*
|
|
5
|
-
* Three of our sites mount a headless molstar canvas — the molecule viewer
|
|
6
|
-
* here, lcao's orbitals and symmetry's crystals — and each of them had its own
|
|
7
|
-
* copy of the lifecycle, the spec and the spin. This is that one copy; what
|
|
8
|
-
* stays in a site is the scene it draws.
|
|
9
|
-
*
|
|
10
|
-
* **Importing this pulls molstar in statically.** A site that only wants
|
|
11
|
-
* `<MoleculeViewer3D>` imports `react-cheminfo/molecule3d`, whose canvas is
|
|
12
|
-
* lazy.
|
|
13
|
-
*/
|
|
14
|
-
export * from "./molstar/core/index.js";
|
|
15
|
-
export { captureScene } from "./molecule3d/ui/captureScene.js";
|
|
16
|
-
export { atomReferenceOf, clearMeasurements, renderMeasurements, } from "./molecule3d/ui/measurements.js";
|
|
17
|
-
//# sourceMappingURL=molstar.js.map
|
package/lib/molstar.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"molstar.js","sourceRoot":"","sources":["../src/molstar.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,cAAc,yBAAyB,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAE/D,OAAO,EACL,eAAe,EACf,iBAAiB,EACjB,kBAAkB,GACnB,MAAM,iCAAiC,CAAC"}
|