react-science 0.19.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2021 Zakodium
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,56 @@
+# react-science
+
+React components to build analysis UI.
+
+<h3 align="center">
+
+  <a href="https://www.zakodium.com">
+    <img src="https://www.zakodium.com/brand/zakodium-logo-white.svg" width="50" alt="Zakodium logo" />
+  </a>
+
+  <p>
+    Maintained by <a href="https://www.zakodium.com">Zakodium</a>
+  </p>
+</h3>
+
+## Installation
+
+```console
+> npm i react-science
+```
+
+## Introduction
+
+Science has specific requirements to display and process data. This is especially true in chemistry where a large number of techniques are used to extract important information (or characterize) samples.
+
+This project simplifies the process of creating web applications for visualizing, processing and extracting information from measurements.
+
+This project is composed of 2 parts:
+
+- src/components: a set of reusable components that are published in the npm package and can be developed locally using `npm run dev-stories`
+- src/pages: playgrounds in which we combine the components and many other project to test ideas and limitation of the design. It can be tested locally using `npm run dev-app`
+
+## Principle of the application
+
+The application has a state containing 3 properties:
+
+- data: containing information related to data
+- view: containing the information related to what is displayed in which module
+- settings: that will contain user defined preferences for the application
+
+### Loading new data in the application
+
+New data can be added by drag/drop or by adding in the URL a link to a webservice that returns a list of files. This later will use [FileCollectionFromWebservice](https://cheminfo.github.io/filelist-utils/modules.html#fileCollectionFromWebservice). You can find an example of the webservice [here](https://zakodium-oss.github.io/analysis-dataset/jdx.json)
+
+Both approach will generate internally a `FileCollection` (see https://cheminfo.github.io/filelist-utils/classes/FileCollection.html and https://github.com/cheminfo/filelist-utils).
+
+To convert the various proprietary formats and add the parsed result to the application `data state` we will use `loaders`. A loader will receive a `FileCollection` and will try to parse what it can, often based on the file extension. An example of the `JCAMP-DX` loader can be found [here](https://github.com/zakodium-oss/react-science/blob/6f36ab05af11f848d4ed98eb10c99184a713ae97/src/app/data/loaders/jcampLoader.ts)
+
+When create a new loader you also need to specify that it should be used when processing files by adding it in the following [array](https://github.com/zakodium-oss/react-science/blob/6f36ab05af11f848d4ed98eb10c99184a713ae97/src/app/context/load.ts#L15-L16) of the application.
+
+## Testing the demo application
+
+- [From some JCAMP-DX files](https://react-science.pages.dev/pages/demo.html#?filelist=https%3A%2F%2Fzakodium-oss.github.io%2Fanalysis-dataset%2Fjdx.json)
+- [From Biologic file format](https://react-science.pages.dev/pages/demo.html#?filelist=https%3A%2F%2Fzakodium-oss.github.io%2Fanalysis-dataset%2Fbiologic.json)
+- [From a UV-vis file format](https://react-science.pages.dev/pages/demo.html#?filelist=https%3A%2F%2Fzakodium-oss.github.io%2Fanalysis-dataset%2Fuvvis.json)
+- [All the examples we have](https://react-science.pages.dev/pages/demo.html#?filelist=https%3A%2F%2Fzakodium-oss.github.io%2Fanalysis-dataset%2Ffull.json)

package/lib/app/about/AboutDialogToolbarButton.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AboutDialogToolbarButton = void 0;
+const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+/** @jsxImportSource @emotion/react */
+const react_1 = require("@emotion/react");
+const index_1 = require("../../components/index");
+const aboutDialogToolbarButtonCss = {
+    root: (0, react_1.css) `
+    max-width: 600px;
+    padding: 10px;
+  `,
+};
+function AboutDialogToolbarButton(props) {
+    const { name, icon, body } = props;
+    const [isOpenDialog, openDialog, closeDialog] = (0, index_1.useOnOff)(false);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_1.Toolbar.Item, { titleOrientation: "horizontal", title: `About ${name}`, onClick: openDialog, children: icon }), (0, jsx_runtime_1.jsxs)(index_1.Modal, { isOpen: isOpenDialog, onRequestClose: closeDialog, children: [(0, jsx_runtime_1.jsx)(index_1.Modal.Header, { children: name }), (0, jsx_runtime_1.jsx)(index_1.Modal.Body, { children: (0, jsx_runtime_1.jsx)("div", { css: aboutDialogToolbarButtonCss.root, children: body }) })] })] }));
+}
+exports.AboutDialogToolbarButton = AboutDialogToolbarButton;

package/lib/app/about/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./AboutDialogToolbarButton"), exports);

package/lib/app/explorer/ExplorerPlotView.js

@@ -0,0 +1,26 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ExplorerPlotView = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const index_1 = require("../../app-data/index");
+const index_2 = require("../../components/index");
+const index_3 = require("../index");
+const MeasurementExplorerWithState_1 = __importDefault(require("./MeasurementExplorerWithState"));
+function ExplorerPlotView() {
+    const appView = (0, index_1.useAppView)();
+    const selectedKind = appView.selectedKind;
+    (0, index_2.assertNotNull)(selectedKind);
+    switch (selectedKind) {
+        case 'mass':
+            return (0, jsx_runtime_1.jsx)(index_3.MassPlotView, {});
+        case 'iv':
+            return (0, jsx_runtime_1.jsx)(index_3.IvPlotView, {});
+        default: {
+            return (0, jsx_runtime_1.jsx)(MeasurementExplorerWithState_1.default, {});
+        }
+    }
+}
+exports.ExplorerPlotView = ExplorerPlotView;

package/lib/app/explorer/MeasurementExplorer.js

@@ -0,0 +1,105 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MeasurementExplorer = void 0;
+const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+/** @jsxImportSource @emotion/react */
+const react_1 = require("@emotion/react");
+const react_2 = require("react");
+const fa_1 = require("react-icons/fa");
+const index_1 = require("../helpers/index");
+function MeasurementExplorer(props) {
+    const { measurement: { data }, width = '100%', height = '100%', } = props;
+    function defaultInfo(dataIndex) {
+        const varNames = Object.keys(data[dataIndex].variables);
+        return {
+            dataIndex,
+            xVariableName: varNames.includes('x') ? 'x' : varNames[0],
+            yVariableName: varNames.includes('y') ? 'y' : varNames[1],
+        };
+    }
+    const [info, setInfo] = (0, react_2.useState)({
+        flipHorizontalAxis: false,
+        ...defaultInfo(0),
+    });
+    /* variables for this measurement are mapped into `id - label (units)`
+      `id` necessary bc files may have repeated labels
+    */
+    function dropdownVariables(axis) {
+        function formatVar(varKey) {
+            const { label, units } = variables[varKey];
+            const formatUnit = units ? ` (${units})` : '';
+            const formatVarKey = `${varKey} - `;
+            return formatVarKey + label + formatUnit;
+        }
+        const { variables } = data[info.dataIndex];
+        const oppositeAxis = axis === 'x' ? 'yVariableName' : 'xVariableName';
+        return Object.keys(variables).map((d) => {
+            if (d !== info[oppositeAxis]) {
+                return ((0, jsx_runtime_1.jsx)("option", { value: d, children: formatVar(d) }, d));
+            }
+            return null;
+        });
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { style: { width, height }, css: (0, react_1.css) `
+        display: flex;
+        flex-direction: column;
+      `, children: [(0, jsx_runtime_1.jsxs)("div", { css: (0, react_1.css) `
+          display: flex;
+          justify-content: space-around;
+          margin-bottom: 20px;
+        `, children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { children: "dataIndex: " }), (0, jsx_runtime_1.jsx)("select", { css: (0, react_1.css) `
+              cursor: pointer;
+              border: 1px solid black;
+              padding: 1px;
+              margin-left: 2px;
+            `, onChange: ({ target }) => {
+                                    const value = Number(target.value);
+                                    if (value !== undefined && !Number.isNaN(value)) {
+                                        setInfo(({ flipHorizontalAxis }) => ({
+                                            flipHorizontalAxis,
+                                            ...defaultInfo(value),
+                                        }));
+                                    }
+                                }, children: data.map((d, i) => (
+                                // eslint-disable-next-line react/no-array-index-key
+                                (0, jsx_runtime_1.jsx)("option", { value: i, children: i }, i))) })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { children: "xVariable: " }), (0, jsx_runtime_1.jsx)("select", { css: (0, react_1.css) `
+              cursor: pointer;
+              border: 1px solid black;
+              padding: 1px;
+              margin-left: 2px;
+            `, onChange: ({ target }) => {
+                                    const value = target.value;
+                                    if (value) {
+                                        setInfo((info) => ({ ...info, xVariableName: value }));
+                                    }
+                                }, value: info.xVariableName, children: dropdownVariables('x') })] }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(fa_1.FaExchangeAlt, { css: (0, react_1.css) `
+              margin-top: 2px;
+              cursor: pointer;
+            `, size: "20", onClick: () => setInfo(({ xVariableName, yVariableName, ...info }) => ({
+                                ...info,
+                                xVariableName: yVariableName,
+                                yVariableName: xVariableName,
+                            })) }) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { children: "yVariable :" }), (0, jsx_runtime_1.jsx)("select", { css: (0, react_1.css) `
+              cursor: pointer;
+              border: 1px solid black;
+              padding: 1px;
+              margin-left: 2px;
+            `, onChange: ({ target }) => {
+                                    const value = target.value;
+                                    if (value) {
+                                        setInfo((info) => ({ ...info, yVariableName: value }));
+                                    }
+                                }, value: info.yVariableName, children: dropdownVariables('y') })] }), (0, jsx_runtime_1.jsxs)("div", { css: (0, react_1.css) `
+            padding: 1px;
+            display: flex;
+          `, children: ["Flip horizontal axis:", (0, jsx_runtime_1.jsx)(fa_1.FaArrowsAltH, { css: (0, react_1.css) `
+              cursor: pointer;
+              border: 1px solid black;
+              padding: 1px;
+              margin-left: 2px;
+            `, size: "28", onClick: () => setInfo(({ flipHorizontalAxis, ...other }) => ({
+                                    flipHorizontalAxis: !flipHorizontalAxis,
+                                    ...other,
+                                })) })] })] }), (0, jsx_runtime_1.jsx)(index_1.MeasurementPlot, { ...props, ...info })] }));
+}
+exports.MeasurementExplorer = MeasurementExplorer;

package/lib/app/explorer/MeasurementExplorerWithState.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const index_1 = require("../../app-data/index");
+const index_2 = require("../../components/index");
+const MeasurementExplorer_1 = require("./MeasurementExplorer");
+function MeasurementExplorerWithState() {
+    const appState = (0, index_1.useAppState)();
+    const data = (0, index_1.getCurrentMeasurementData)(appState);
+    (0, index_2.assertNotNull)(data);
+    return ((0, jsx_runtime_1.jsx)(MeasurementExplorer_1.MeasurementExplorer, { measurement: data.data, measurementDisplay: data.display }));
+}
+exports.default = MeasurementExplorerWithState;

package/lib/app/explorer/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./ExplorerPlotView"), exports);
+__exportStar(require("./MeasurementExplorer"), exports);

package/lib/app/helpers/MeasurementPlot.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MeasurementPlot = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ml_spectra_processing_1 = require("ml-spectra-processing");
+const react_1 = require("react");
+const react_plot_1 = require("react-plot");
+const index_1 = require("./index");
+function MeasurementPlot(props) {
+    return ((0, jsx_runtime_1.jsx)(react_plot_1.PlotController, { children: (0, jsx_runtime_1.jsx)(MeasurementComponent, { ...props }) }));
+}
+exports.MeasurementPlot = MeasurementPlot;
+function MeasurementComponent(props) {
+    const { measurementDisplay, measurement: { data }, dataIndex = 0, xVariableName = 'x', yVariableName = 'y', } = props;
+    const { x, y } = (0, react_1.useMemo)(() => {
+        const { variables } = data[dataIndex];
+        const { [xVariableName]: x, [yVariableName]: y } = variables;
+        if (x === undefined || y === undefined) {
+            throw new Error(`Variable "${x === undefined ? xVariableName : yVariableName}" is not available in data. Only ${Object.keys(data[dataIndex].variables).join(', ')} are available`);
+        }
+        return { x, y };
+    }, [data, dataIndex, xVariableName, yVariableName]);
+    const { color } = measurementDisplay;
+    if (color.kind !== 'fixed') {
+        throw new Error(`unimplemented stroke for kind ${color.kind}`);
+    }
+    return ((0, jsx_runtime_1.jsx)(index_1.BasicComponent, { ...props, children: (0, jsx_runtime_1.jsx)(react_plot_1.LineSeries, { lineStyle: {
+                stroke: color.color,
+            }, data: (0, ml_spectra_processing_1.xyToXYObject)({
+                x: x.data,
+                y: y.data,
+            }) }) }));
+}

package/lib/app/helpers/MeasurementVariableSelect.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MeasurementVariableSelect = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+function MeasurementVariableSelect(props) {
+    const { label, value, options, onSelect } = props;
+    return ((0, jsx_runtime_1.jsxs)("label", { children: [`${label}: `, (0, jsx_runtime_1.jsxs)("select", { value: value, onChange: (event) => {
+                    const value = event.target.value;
+                    if (value) {
+                        onSelect(value);
+                    }
+                }, children: [(0, jsx_runtime_1.jsx)("option", { value: "", children: `<select a variable>` }), options.map((option) => ((0, jsx_runtime_1.jsx)("option", { value: option, children: option }, option)))] })] }));
+}
+exports.MeasurementVariableSelect = MeasurementVariableSelect;

package/lib/app/helpers/getColorFromConfig.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getColorFromConfig = void 0;
+// import { fixedGradientScales } from '../../components/index';
+function getColorFromConfig(config) {
+    if (config.kind === 'fixed') {
+        return config.color;
+    }
+    else {
+        throw new Error(`Unsupported color config: ${config.kind}`);
+        // const scale = fixedGradientScales[config.gradient];
+    }
+}
+exports.getColorFromConfig = getColorFromConfig;

package/lib/app/helpers/index.js

@@ -0,0 +1,21 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./getColorFromConfig"), exports);
+__exportStar(require("./MeasurementPlot"), exports);
+__exportStar(require("./react-plot"), exports);
+__exportStar(require("./splitEntries"), exports);
+__exportStar(require("./MeasurementVariableSelect"), exports);

package/lib/app/helpers/react-plot.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BasicComponent = void 0;
+const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+/** @jsxImportSource @emotion/react */
+const react_1 = require("@emotion/react");
+const react_2 = require("react");
+const react_d3_utils_1 = require("react-d3-utils");
+const react_plot_1 = require("react-plot");
+function BasicComponent(props) {
+    const { children, measurement, dataIndex = 0, xVariableName = 'x', yVariableName = 'y', width = '100%', height = '100%', zoom = 'horizontal', wheelZoom = 'vertical', crossHair = true, showHorizontalAxis = true, showVerticalAxis = true, showHorizontalGrid = true, showVerticalGrid = true, flipHorizontalAxis = false, } = props;
+    const { info: { title }, data, } = measurement;
+    const { x, y } = (0, react_2.useMemo)(() => {
+        const { variables } = data[dataIndex];
+        const { [xVariableName]: x, [yVariableName]: y } = variables;
+        if (x === undefined || y === undefined) {
+            throw new Error(`Variable "${x === undefined ? xVariableName : yVariableName}" is not available in data. Only ${Object.keys(data[dataIndex].variables).join(', ')} are available`);
+        }
+        return { x, y };
+    }, [data, dataIndex, xVariableName, yVariableName]);
+    const direction = new Set(['vertical', 'horizontal']);
+    const rectZoom = (0, react_plot_1.useRectangularZoom)({
+        disabled: zoom !== 'rectangular',
+    });
+    const axisZoom = (0, react_plot_1.useAxisZoom)({
+        direction: zoom === 'vertical' ? 'vertical' : 'horizontal',
+        disabled: !direction.has(zoom),
+    });
+    (0, react_plot_1.useAxisWheelZoom)({
+        direction: wheelZoom === 'vertical' ? 'vertical' : 'horizontal',
+        axisId: wheelZoom === 'vertical' ? 'y' : 'x',
+        disabled: !direction.has(wheelZoom),
+    });
+    const crossHairAnnot = (0, react_plot_1.useCrossHair)({
+        disabled: !crossHair,
+    });
+    (0, react_plot_1.usePan)();
+    return ((0, jsx_runtime_1.jsx)("div", { style: { width, height }, css: (0, react_1.css) `
+        user-drag: none;
+        -webkit-user-drag: none;
+        user-select: none;
+        -moz-user-select: none;
+        -webkit-user-select: none;
+        -ms-user-select: none;
+      `, children: (0, jsx_runtime_1.jsx)(react_d3_utils_1.ResponsiveChart, { width: width, height: height, children: ({ width, height }) => ((0, jsx_runtime_1.jsxs)(react_plot_1.Plot, { width: width, height: height, children: [(0, jsx_runtime_1.jsx)(react_plot_1.Heading, { title: title }), children, (0, jsx_runtime_1.jsxs)(react_plot_1.Annotations, { children: [rectZoom.annotations, axisZoom.annotations, crossHairAnnot.annotations] }), (0, jsx_runtime_1.jsx)(react_plot_1.Axis, { hidden: !showHorizontalAxis, displayPrimaryGridLines: showVerticalGrid, flip: flipHorizontalAxis, position: "bottom", label: `${x.label}${x.units ? `(${x.units})` : ''}` }), (0, jsx_runtime_1.jsx)(react_plot_1.Axis, { hidden: !showVerticalAxis, displayPrimaryGridLines: showHorizontalGrid, position: "left", label: `${y.label}${y.units ? `(${y.units})` : ''}`, paddingStart: "10", paddingEnd: "10" })] })) }) }));
+}
+exports.BasicComponent = BasicComponent;

package/lib/app/helpers/splitEntries.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.splitEntries = void 0;
+const index_1 = require("../../app-data/index");
+function splitEntries(appState, kind) {
+    const selectedEntries = [];
+    const unselectedEntries = [];
+    const selectedMeasurements = appState.view.selectedMeasurements[kind] ?? [];
+    for (const entry of (0, index_1.iterateKindMeasurementsAndView)(appState, kind)) {
+        if (selectedMeasurements.includes(entry.measurement.id)) {
+            selectedEntries.push(entry);
+        }
+        else {
+            unselectedEntries.push(entry);
+        }
+    }
+    return { selectedEntries, unselectedEntries };
+}
+exports.splitEntries = splitEntries;

package/lib/app/hooks/file-loading.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDropFiles = exports.useLoadFileCollectionFromHash = void 0;
+const react_query_1 = require("@tanstack/react-query");
+const filelist_utils_1 = require("filelist-utils");
+const react_1 = require("react");
+const index_1 = require("../../app-data/index");
+const index_2 = require("../../components/index");
+function useLoadFileCollectionFromHash(onLoad) {
+    const appDispatch = (0, index_1.useAppDispatch)();
+    const hashParams = (0, index_2.useHashSearchParams)();
+    const filelistUrl = hashParams.get('filelist');
+    const query = (0, react_query_1.useQuery)({
+        queryKey: ['filelist', filelistUrl],
+        queryFn: async () => {
+            if (!filelistUrl) {
+                return null;
+            }
+            const fileCollection = await (0, filelist_utils_1.fileCollectionFromWebservice)(filelistUrl);
+            void onLoad(fileCollection, appDispatch);
+            return true;
+        },
+    });
+    return query;
+}
+exports.useLoadFileCollectionFromHash = useLoadFileCollectionFromHash;
+function useDropFiles(onLoad) {
+    const dispatch = (0, index_1.useAppDispatch)();
+    const onDrop = (0, react_1.useCallback)((files) => {
+        void onLoad(files, dispatch);
+    }, [dispatch, onLoad]);
+    return onDrop;
+}
+exports.useDropFiles = useDropFiles;

package/lib/app/hooks/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./file-loading"), exports);

package/lib/app/index.js

@@ -0,0 +1,21 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./explorer/index"), exports);
+__exportStar(require("./hooks/index"), exports);
+__exportStar(require("./kinds/index"), exports);
+__exportStar(require("./panels/index"), exports);
+__exportStar(require("./about/index"), exports);

package/lib/app/kinds/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./ir/index"), exports);
+__exportStar(require("./iv/index"), exports);
+__exportStar(require("./mass/index"), exports);

package/lib/app/kinds/ir/IrPeaksPanel.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IrPeaksPanel = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_table_1 = require("@tanstack/react-table");
+const react_1 = require("react");
+const index_1 = require("../../../components/index");
+function IrPeaksPanel(props) {
+    const { peaks, preferences = {} } = props;
+    const { columns = [] } = preferences;
+    const defaultColumns = columns.map(({ accessorKey, label = accessorKey, format = (x) => x }) => ({
+        header: label,
+        accessorKey,
+        cell: ({ getValue }) => format(getValue()),
+    }));
+    function getColumnVisibility() {
+        const columnVisibility = {};
+        for (const { accessorKey, visible = true } of columns) {
+            columnVisibility[accessorKey] = visible;
+        }
+        return columnVisibility;
+    }
+    const [sorting, setSorting] = (0, react_1.useState)([]);
+    const table = (0, react_table_1.useReactTable)({
+        data: peaks,
+        columns: defaultColumns,
+        state: {
+            sorting,
+            columnVisibility: getColumnVisibility(),
+        },
+        onSortingChange: setSorting,
+        getCoreRowModel: (0, react_table_1.getCoreRowModel)(),
+        getSortedRowModel: (0, react_table_1.getSortedRowModel)(),
+    });
+    return ((0, jsx_runtime_1.jsxs)(index_1.Table, { children: [(0, jsx_runtime_1.jsx)(index_1.Table.Header, { children: table
+                    .getHeaderGroups()
+                    .map(({ headers }) => headers.map((header) => ((0, jsx_runtime_1.jsx)(index_1.ValueRenderers.Header, { style: { cursor: 'pointer' }, onClick: header.column.getToggleSortingHandler(), value: header.column.columnDef.header?.toString(), sorted: header.column.getIsSorted() }, header.id)))) }), table.getRowModel().rows.map((row) => ((0, jsx_runtime_1.jsx)(index_1.Table.Row, { children: row.getVisibleCells().map((cell) => {
+                    const value = cell.column.columnDef.cell(cell.getContext());
+                    return ((0, jsx_runtime_1.jsx)(index_1.ValueRenderers.Text, { value: value !== undefined ? value : cell.getValue() }, cell.id));
+                }) }, row.id)))] }));
+}
+exports.IrPeaksPanel = IrPeaksPanel;

package/lib/app/kinds/ir/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./IrPeaksPanel"), exports);

package/lib/app/kinds/iv/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./plot-view/IvPlotView"), exports);