react-science 0.24.3 → 0.26.1

package/lib/app/explorer/MeasurementExplorer.js

@@ -29,13 +29,35 @@ const MeasurementExplorerAction = styled_1.default.div `
   display: flex;
 `;
 function MeasurementExplorer(props) {
-    const { measurement: { data }, width = '100%', height = '100%', } = props;
+    const { measurement, width = '100%', height = '100%' } = props;
+    const measurementsArray = (0, react_1.useMemo)(() => (Array.isArray(measurement) ? measurement : [measurement]), [measurement]);
+    const varNames = (0, react_1.useMemo)(() => {
+        const varNames = [];
+        for (const [i, { data }] of measurementsArray.entries()) {
+            for (const { variables } of data) {
+                const names = [];
+                for (const varName in variables) {
+                    if (i === 0) {
+                        names.push(varName);
+                    }
+                    else if (!varNames.flat().includes(varName)) {
+                        throw new Error(`Measurements selected does not have the same variables `);
+                    }
+                }
+                varNames.push(names);
+            }
+        }
+        return varNames;
+    }, [measurementsArray]);
     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],
+            xVariableName: varNames[dataIndex].includes('x')
+                ? 'x'
+                : varNames[dataIndex][0],
+            yVariableName: varNames[dataIndex].includes('y')
+                ? 'y'
+                : varNames[dataIndex][1],
         };
     }
     const [info, setInfo] = (0, react_1.useState)({
@@ -52,9 +74,9 @@ function MeasurementExplorer(props) {
             const formatVarKey = `${varKey} - `;
             return formatVarKey + label + formatUnit;
         }
-        const { variables } = data[info.dataIndex];
+        const { variables } = measurementsArray[0].data[info.dataIndex];
         const oppositeAxis = axis === 'x' ? 'yVariableName' : 'xVariableName';
-        return Object.keys(variables).map((d) => {
+        return varNames[info.dataIndex].map((d) => {
             if (d !== info[oppositeAxis]) {
                 return ((0, jsx_runtime_1.jsx)("option", { value: d, children: formatVar(d) }, d));
             }
@@ -69,7 +91,7 @@ function MeasurementExplorer(props) {
                                             ...defaultInfo(value),
                                         }));
                                     }
-                                }, children: data.map((d, i) => (
+                                }, children: measurementsArray[0].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)(MeasurementExplorerSelect, { onChange: ({ target }) => {
                                     const value = target.value;

package/lib/app/explorer/MeasurementExplorerWithState.js

@@ -2,12 +2,12 @@
 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);
+    if (!data)
+        return (0, jsx_runtime_1.jsx)("div", { children: "No selected measurement" });
     return ((0, jsx_runtime_1.jsx)(MeasurementExplorer_1.MeasurementExplorer, { measurement: data.data, measurementDisplay: data.display }));
 }
 exports.default = MeasurementExplorerWithState;

package/lib/app/helpers/MeasurementPlot.js

@@ -11,23 +11,32 @@ function MeasurementPlot(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,
-            }) }) }));
+    const { measurementDisplay, measurement, dataIndex = 0, xVariableName = 'x', yVariableName = 'y', } = props;
+    const dataXY = (0, react_1.useMemo)(() => {
+        const measurementsArray = Array.isArray(measurement)
+            ? measurement
+            : [measurement];
+        return measurementsArray.map(({ data, id }) => {
+            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, id };
+        });
+    }, [dataIndex, measurement, xVariableName, yVariableName]);
+    return ((0, jsx_runtime_1.jsx)(index_1.BasicComponent, { ...props, children: dataXY.map(({ x, y, id }, i) => {
+            const { color } = Array.isArray(measurementDisplay)
+                ? measurementDisplay[i]
+                : measurementDisplay;
+            if (color.kind !== 'fixed') {
+                throw new Error(`unimplemented stroke for kind ${color.kind}`);
+            }
+            return ((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,
+                }) }, id));
+        }) }));
 }

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

@@ -19,7 +19,7 @@ const BasicComponentRoot = styled_1.default.div `
 `;
 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 [{ info: { title }, data, },] = Array.isArray(measurement) ? measurement : [measurement];
     const { x, y } = (0, react_1.useMemo)(() => {
         const { variables } = data[dataIndex];
         const { [xVariableName]: x, [yVariableName]: y } = variables;

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

@@ -18,7 +18,7 @@ function useLoadFileCollectionFromHash(onLoad) {
             }
             const request = await fetch(filelistUrl);
             const data = await request.json();
-            let baseURL = filelistUrl.replace(/\/[^/]*$/, '/');
+            const baseURL = filelistUrl.replace(/\/[^/]*$/, '/');
             const fileCollection = await (0, filelist_utils_1.fileCollectionFromWebSource)({
                 entries: data,
                 baseURL,

package/lib/app/kinds/mass/MassPlotView.js

@@ -3,12 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.MassPlotView = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const index_1 = require("../../../app-data/index");
-const index_2 = require("../../../components/index");
 const MeasurementMassPlot_1 = require("./MeasurementMassPlot");
 function MassPlotView() {
     const appState = (0, index_1.useAppState)();
     const data = (0, index_1.getCurrentMeasurementData)(appState);
-    (0, index_2.assertNotNull)(data);
+    if (!data)
+        return (0, jsx_runtime_1.jsx)("div", { children: "No selected measurement" });
     return ((0, jsx_runtime_1.jsx)(MeasurementMassPlot_1.MeasurementMassPlot, { measurement: data.data, measurementDisplay: data.display }));
 }
 exports.MassPlotView = MassPlotView;

package/lib/app/kinds/mass/MeasurementMassPlot.js

@@ -9,49 +9,65 @@ const react_1 = require("react");
 const react_plot_1 = require("react-plot");
 const index_1 = require("../../helpers/index");
 function MeasurementMassPlot(props) {
-    const { measurement } = props;
-    if (!measurement.data) {
-        throw new Error('This is weird, the data property is not available on measurement');
-    }
-    if (measurement.data.length === 0) {
-        throw new Error('Data property is empty');
-    }
-    if (measurement.data.length > 1) {
-        throw new Error('Length of data property is larger than 1');
-    }
-    if (!measurement.data[0].variables.x) {
-        throw new Error('x variable in undefined');
-    }
-    if (!measurement.data[0].variables.y) {
-        throw new Error('y variable in undefined');
+    const { measurement: measurements } = props;
+    const measurementsArray = Array.isArray(measurements)
+        ? measurements
+        : [measurements];
+    for (const measurement of measurementsArray) {
+        if (!measurement.data) {
+            throw new Error('This is weird, the data property is not available on measurement');
+        }
+        if (measurement.data.length === 0) {
+            throw new Error('Data property is empty');
+        }
+        if (measurement.data.length > 1) {
+            throw new Error('Length of data property is larger than 1');
+        }
+        if (!measurement.data[0].variables.x) {
+            throw new Error('x variable in undefined');
+        }
+        if (!measurement.data[0].variables.y) {
+            throw new Error('y variable in undefined');
+        }
     }
     return ((0, jsx_runtime_1.jsx)(react_plot_1.PlotController, { children: (0, jsx_runtime_1.jsx)(MassComponent, { ...props }) }));
 }
 exports.MeasurementMassPlot = MeasurementMassPlot;
 function MassComponent(props) {
-    const { measurement } = props;
-    const { data } = measurement;
-    const { variables } = data[0];
-    const { x, y } = (0, react_1.useMemo)(() => {
-        return { x: variables.x, y: variables.y };
-    }, [variables]);
-    const { x: xDomain } = (0, react_plot_1.usePlotControllerAxes)();
-    const { profile, peaks } = (0, react_1.useMemo)(() => {
-        const spectrum = new ms_spectrum_1.Spectrum({
-            x: x.data,
-            y: y.data,
+    const { measurement: measurements } = props;
+    const dataXY = (0, react_1.useMemo)(() => {
+        const measurementsArray = Array.isArray(measurements)
+            ? measurements
+            : [measurements];
+        return measurementsArray.map(({ data, id }) => {
+            const { variables } = data[0];
+            const { x, y } = variables;
+            return { x, y, id };
         });
-        const isContinuous = spectrum.isContinuous();
-        const profile = isContinuous &&
-            (0, ml_spectra_processing_1.xyToXYObject)({
+    }, [measurements]);
+    const { x: xDomain } = (0, react_plot_1.usePlotControllerAxes)();
+    const { profiles, peaks } = (0, react_1.useMemo)(() => {
+        const profiles = [];
+        const peaks = [];
+        for (const { x, y, id } of dataXY) {
+            const spectrum = new ms_spectrum_1.Spectrum({
                 x: x.data,
                 y: y.data,
             });
+            const isContinuous = spectrum.isContinuous();
+            const data = isContinuous &&
+                (0, ml_spectra_processing_1.xyToXYObject)({
+                    x: x.data,
+                    y: y.data,
+                });
+            profiles.push({ data, id });
+            peaks.push(...spectrum.getPeaks(data));
+        }
         return {
-            profile,
-            peaks: spectrum.getPeaks(profile),
+            profiles,
+            peaks,
         };
-    }, [x.data, y.data]);
+    }, [dataXY]);
     const bestPeaks = (0, react_1.useMemo)(() => (0, ms_spectrum_1.getBestPeaks)(peaks, {
         from: xDomain?.min,
         to: xDomain?.max,
@@ -59,5 +75,5 @@ function MassComponent(props) {
         numberSlots: 10,
         threshold: 0.01,
     }), [peaks, xDomain?.max, xDomain?.min]);
-    return ((0, jsx_runtime_1.jsxs)(index_1.BasicComponent, { ...props, children: [profile && (0, jsx_runtime_1.jsx)(react_plot_1.LineSeries, { data: profile, lineStyle: { stroke: 'green' } }), (0, jsx_runtime_1.jsx)(react_plot_1.BarSeries, { data: peaks, lineStyle: { stroke: 'red' } }), (0, jsx_runtime_1.jsx)(react_plot_1.Annotations, { children: bestPeaks.map(({ x, y, shortLabel }) => ((0, jsx_runtime_1.jsxs)(react_plot_1.Annotation.Group, { x: x, y: y, children: [(0, jsx_runtime_1.jsx)(react_plot_1.Annotation.Line, { x1: "0", x2: "0", y1: "0", y2: "-5", style: { strokeWidth: 2, stroke: 'blue' } }), (0, jsx_runtime_1.jsx)(react_plot_1.Annotation.Text, { style: { fontSize: '13px', fontWeight: '600' }, x: "2", y: "0", children: shortLabel }), (0, jsx_runtime_1.jsx)(react_plot_1.Annotation.Text, { style: { fontSize: '13px', fontWeight: '600' }, x: "2", y: "-14", children: x.toFixed(4) })] }, x))) })] }));
+    return ((0, jsx_runtime_1.jsxs)(index_1.BasicComponent, { ...props, children: [profiles.map(({ data, id }) => data && ((0, jsx_runtime_1.jsx)(react_plot_1.LineSeries, { data: data, lineStyle: { stroke: 'green' } }, id))), (0, jsx_runtime_1.jsx)(react_plot_1.BarSeries, { data: peaks, lineStyle: { stroke: 'red' } }), (0, jsx_runtime_1.jsx)(react_plot_1.Annotations, { children: bestPeaks.map(({ x, y, shortLabel }) => ((0, jsx_runtime_1.jsxs)(react_plot_1.Annotation.Group, { x: x, y: y, children: [(0, jsx_runtime_1.jsx)(react_plot_1.Annotation.Line, { x1: "0", x2: "0", y1: "0", y2: "-5", style: { strokeWidth: 2, stroke: 'blue' } }), (0, jsx_runtime_1.jsx)(react_plot_1.Annotation.Text, { style: { fontSize: '13px', fontWeight: '600' }, x: "2", y: "0", children: shortLabel }), (0, jsx_runtime_1.jsx)(react_plot_1.Annotation.Text, { style: { fontSize: '13px', fontWeight: '600' }, x: "2", y: "-14", children: x.toFixed(4) })] }, x))) })] }));
 }

package/lib/app/panels/SignalProcessingPanel.js

@@ -67,7 +67,7 @@ function getDefaultFilter({ options, name }) {
     return { name };
 }
 function normalCase(str) {
-    const result = str.replace(/(?<upper>[A-Z])/g, ' $<upper>').trim();
+    const result = str.replaceAll(/(?<upper>[A-Z])/g, ' $<upper>').trim();
     return result.charAt(0).toUpperCase() + result.slice(1);
 }
 function optionInput([key, { description, choices }], options, onChange) {

package/lib/app/panels/measurement-info/MeasurementInfoPanel.js

@@ -2,70 +2,25 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MeasurementInfoPanel = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
 const index_1 = require("../../../app-data/index");
 const index_2 = require("../../../components/index");
 function MeasurementInfoPanel() {
     const appState = (0, index_1.useAppState)();
     const measurement = (0, index_1.getCurrentMeasurementData)(appState);
-    const [search, setSearch] = (0, react_1.useState)('');
     if (!measurement)
         return null;
-    const { meta, info } = measurement.data;
-    function viewData(data) {
-        return Object.keys(data).map((key) => {
-            const value = data[key];
-            if (!key.toLowerCase().includes(search.toLowerCase()) &&
-                !valueSearch(value, search)) {
-                return null;
-            }
-            return ((0, jsx_runtime_1.jsxs)(index_2.Table.Row, { children: [(0, jsx_runtime_1.jsx)(index_2.ValueRenderers.Text, { value: key }), valueCell(value)] }, key));
-        });
-    }
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("input", { style: {
-                    border: 'solid 1px black',
-                    width: '300px',
-                    marginBottom: '10px',
-                    padding: '3px',
-                }, value: search, placeholder: "search for a parameter ...", onChange: ({ target }) => {
-                    if (target.value !== undefined)
-                        setSearch(target.value);
-                } }), (0, jsx_runtime_1.jsxs)(index_2.Table, { children: [(0, jsx_runtime_1.jsxs)(index_2.Table.Header, { children: [(0, jsx_runtime_1.jsx)(index_2.ValueRenderers.Title, { value: "Parameter" }), (0, jsx_runtime_1.jsx)(index_2.ValueRenderers.Title, { value: "Value" })] }), viewData(info), viewData(meta)] })] }));
+    // TODO: solution for multiple measurements
+    const { meta, info } = measurement.data[0];
+    const data = [
+        {
+            description: 'Information',
+            data: info,
+        },
+        {
+            description: 'Metadata',
+            data: meta,
+        },
+    ];
+    return (0, jsx_runtime_1.jsx)(index_2.InfoPanel, { data: data, title: "" });
 }
 exports.MeasurementInfoPanel = MeasurementInfoPanel;
-/**
- * Get the value cell depending on the type of the value
- * @param value - ValueRenderers value.
- * @returns - ValueRenderers component.
- */
-function valueCell(value) {
-    switch (typeof value) {
-        case 'number':
-            return (0, jsx_runtime_1.jsx)(index_2.ValueRenderers.Number, { value: value });
-        case 'object':
-            return (0, jsx_runtime_1.jsx)(index_2.ValueRenderers.Object, { value: value });
-        case 'string':
-            return (0, jsx_runtime_1.jsx)(index_2.ValueRenderers.Text, { value: value });
-        default:
-            (0, jsx_runtime_1.jsx)(index_2.ValueRenderers.Text, { value: value });
-    }
-}
-/**
- * Search a string in different type of values
- *
- * @param value - Value to search in.
- * @param search - Value to search for.
- * @returns - If search exist in value
- */
-function valueSearch(value, search) {
-    switch (typeof value) {
-        case 'number':
-            return String(value).includes(search.toLowerCase());
-        case 'object':
-            return JSON.stringify(value).toLowerCase().includes(search.toLowerCase());
-        case 'string':
-            return value.toLowerCase().includes(search.toLowerCase());
-        default:
-            return false;
-    }
-}

package/lib/app-data/kinds/ir/irAutoPeakPickingEnhancer.js

@@ -13,11 +13,11 @@ function irAutoPeakPickingEnhancer(measurement, options = {}) {
     if (measurement.data.length === 0)
         return;
     const datum = measurement.data[0];
-    let x = datum.variables[xVariable]?.data;
-    let y = datum.variables[yVariable]?.data;
+    const x = datum.variables[xVariable]?.data;
+    const y = datum.variables[yVariable]?.data;
     if (!x || !y)
         return [];
-    let { from, to } = options;
+    const { from, to } = options;
     let peaks = (0, ml_gsd_1.gsd)({ x, y }, options);
     if (from !== undefined) {
         peaks = peaks.filter((peak) => peak.x >= from);
@@ -43,7 +43,7 @@ function getIrAutoPeakPickingEnhancer(options) {
 }
 exports.getIrAutoPeakPickingEnhancer = getIrAutoPeakPickingEnhancer;
 function getPeakKind(transmittance, minTransmittance, maxTransmittance) {
-    let position = (maxTransmittance - transmittance) / (maxTransmittance - minTransmittance);
+    const position = (maxTransmittance - transmittance) / (maxTransmittance - minTransmittance);
     if (position < 0.33) {
         return 'w';
     }

package/lib/app-data/kinds/ir/irMeasurementEnhancer.js

@@ -9,7 +9,7 @@ exports.irMeasurementEnhancer = void 0;
 function irMeasurementEnhancer(measurement) {
     for (const datum of measurement.data) {
         const variables = datum.variables;
-        let yVariable = variables.y;
+        const yVariable = variables.y;
         let absorbance = true;
         if (yVariable.label.toLowerCase().includes('trans')) {
             absorbance = false;

package/lib/app-data/loaders/cdfLoader.js

@@ -20,8 +20,7 @@ async function cdfLoader(fileCollection, logs) {
                     kind = 'gclcms';
                 }
                 else if (reader.dataVariableExists('ordinate_values') &&
-                    reader.getAttribute('detector_name') &&
-                    reader.getAttribute('detector_name').match(/dad|tic/i)) {
+                    reader.getAttribute('detector_name')?.match(/dad|tic/i)) {
                     kind = 'gclc';
                 }
                 else {
@@ -82,7 +81,7 @@ function chromatogramWithMassSpectra(reader) {
         allIntensities.push(intensities);
         allMasses.push(masses);
     }
-    let data = [];
+    const data = [];
     for (let i = 0; i < times.length; i++) {
         data.push({
             info: {
@@ -109,7 +108,7 @@ function chromatogramWithMassSpectra(reader) {
 }
 function chromatogram(reader) {
     // Taken from: https://github.com/cheminfo/netcdf-gcms
-    let data = [];
+    const data = [];
     const intensities = reader.getDataVariable('ordinate_values');
     const numberPoints = intensities.length;
     const detector = reader.getAttribute('detector_name');
@@ -137,7 +136,7 @@ function chromatogram(reader) {
     else {
         samplingInterval = (runtimeLength - delayTime) / numberPoints;
     }
-    let times = [];
+    const times = [];
     let time = delayTime;
     for (let i = 0; i < numberPoints; i++) {
         times.push(time);

package/lib/app-data/loaders/jcampLoader.js

@@ -88,7 +88,7 @@ function normalizeSpectra(spectra) {
             };
         }
         else {
-            for (let key in variables) {
+            for (const key in variables) {
                 const variable = variables[key];
                 if (variable.label)
                     continue;

package/lib/app-data/loaders/loadMeasurements.js

@@ -6,7 +6,7 @@ const index_1 = require("../index");
 const measurementLoader_1 = require("./utility/measurementLoader");
 async function loadMeasurements(fileCollection, options = {}) {
     const measurements = {};
-    let logs = [];
+    const logs = [];
     const { loaders = [], enhancers = {}, logger = true } = options;
     for (const loader of loaders) {
         const loaderData = await loader(fileCollection, logger ? logs : undefined);

package/lib/app-data/loaders/wdfLoader.js

@@ -50,7 +50,7 @@ function normalizeSpectra(blocks) {
     const results = [];
     for (let i = 0; i < yVariables.length; i++) {
         const yVariable = yVariables[i];
-        let origin = origins[i] || {};
+        const origin = origins[i] || {};
         results.push({
             variables: { x: getXVariable(blocks), y: yVariable },
             meta: { ...origin },

package/lib/app-data/state/data/data.helpers.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getExistingMeasurementKinds = exports.iterateKindMeasurementsAndView = exports.iterateMeasurementEntries = exports.getSelectedMeasurementOrFail = exports.getSelectedMeasurement = exports.getMeasurementKindAndId = exports.getFirstSelectedMeasurementData = exports.getCurrentMeasurementData = exports.getCurrentMeasurement = exports.getFirstMeasurementOrFail = exports.getFirstMeasurement = exports.getMeasurementOrFail = exports.getMeasurement = void 0;
+exports.getExistingMeasurementKinds = exports.iterateKindMeasurementsAndView = exports.iterateMeasurementEntries = exports.getSelectedMeasurementOrFail = exports.getSelectedMeasurement = exports.getMeasurementKindAndIds = exports.getMeasurementKindAndId = exports.getFirstSelectedMeasurementData = exports.getCurrentMeasurementData = exports.getCurrentMeasurement = exports.getFirstMeasurementOrFail = exports.getFirstMeasurement = exports.getMeasurementOrFail = exports.getMeasurement = void 0;
 const index_1 = require("../../../components/index");
 const kinds_1 = require("./kinds");
 function getMeasurement(measurements, kind, selected) {
@@ -31,16 +31,23 @@ function getCurrentMeasurement(state) {
     const selectedMeasurement = getSelectedMeasurement(state.view);
     if (!selectedMeasurement)
         return null;
-    return getMeasurement(state.data.measurements, selectedMeasurement.kind, selectedMeasurement.id);
+    const measurements = [];
+    for (const id of selectedMeasurement.ids) {
+        const measurement = getMeasurement(state.data.measurements, selectedMeasurement.kind, id);
+        if (!measurement)
+            return null;
+        measurements.push(measurement);
+    }
+    return measurements;
 }
 exports.getCurrentMeasurement = getCurrentMeasurement;
 function getCurrentMeasurementData(state) {
     const selectedMeasurement = getCurrentMeasurement(state);
     if (!selectedMeasurement)
         return null;
-    const kindAndId = getMeasurementKindAndId(state.data, selectedMeasurement.id);
-    const display = state.view.measurements[selectedMeasurement.id];
-    return { data: selectedMeasurement, display, kindAndId };
+    const kindAndIds = getMeasurementKindAndIds(state.data, selectedMeasurement);
+    const display = selectedMeasurement.map(({ id }) => state.view.measurements[id]);
+    return { data: selectedMeasurement, display, kindAndIds };
 }
 exports.getCurrentMeasurementData = getCurrentMeasurementData;
 function getFirstSelectedMeasurementData(state) {
@@ -57,7 +64,7 @@ function getFirstSelectedMeasurementData(state) {
 }
 exports.getFirstSelectedMeasurementData = getFirstSelectedMeasurementData;
 function getMeasurementKindAndId(data, measurementId) {
-    for (let kind of kinds_1.measurementKinds) {
+    for (const kind of kinds_1.measurementKinds) {
         const measurement = getMeasurement(data.measurements, kind, measurementId);
         if (measurement)
             return { kind, id: measurementId };
@@ -65,16 +72,33 @@ function getMeasurementKindAndId(data, measurementId) {
     throw new Error(`Measurement kind for ${measurementId} not found`);
 }
 exports.getMeasurementKindAndId = getMeasurementKindAndId;
+function getMeasurementKindAndIds(data, measurementId) {
+    let found = false;
+    for (const kind of kinds_1.measurementKinds) {
+        for (const { id } of measurementId) {
+            const measurement = getMeasurement(data.measurements, kind, id);
+            if (measurement)
+                found = true;
+            if (found && !measurement) {
+                throw new Error(`Measurement kind for ${measurementId.join(', ')} not found`);
+            }
+        }
+        if (found)
+            return { kind, ids: measurementId };
+    }
+    throw new Error(`Measurement kind for ${measurementId.join(', ')} not found`);
+}
+exports.getMeasurementKindAndIds = getMeasurementKindAndIds;
 function getSelectedMeasurement(view) {
     const { selectedKind, selectedMeasurements } = view;
     if (!selectedKind)
         return null;
     const kind = selectedKind;
     const currentMeasurements = selectedMeasurements[kind];
-    if (!currentMeasurements || currentMeasurements.length !== 1)
+    if (!currentMeasurements || currentMeasurements.length === 0)
         return null;
-    const id = currentMeasurements[0];
-    return { kind, id };
+    const ids = currentMeasurements;
+    return { kind, ids };
 }
 exports.getSelectedMeasurement = getSelectedMeasurement;
 function getSelectedMeasurementOrFail(view) {
@@ -85,7 +109,7 @@ function getSelectedMeasurementOrFail(view) {
 exports.getSelectedMeasurementOrFail = getSelectedMeasurementOrFail;
 function* iterateMeasurementEntries(measurements) {
     for (const [measurementKind, measurementData] of Object.entries(measurements)) {
-        for (let measurement of measurementData.entries) {
+        for (const measurement of measurementData.entries) {
             yield { kind: measurementKind, measurement };
         }
     }
@@ -94,7 +118,7 @@ exports.iterateMeasurementEntries = iterateMeasurementEntries;
 function* iterateKindMeasurementsAndView(state, kind) {
     const measurements = state.data.measurements[kind];
     const view = state.view.measurements;
-    for (let measurement of measurements.entries) {
+    for (const measurement of measurements.entries) {
         yield { measurement, view: view[measurement.id] };
     }
 }

package/lib/components/accordion/AccordionContext.js

@@ -71,7 +71,7 @@ function useAccordionContext(title, defaultOpened) {
         utils.create(title, defaultOpened);
         return () => utils.remove(title);
     }, [defaultOpened, title, utils]);
-    let item = getItem(title, state.items);
+    const item = getItem(title, state.items);
     return (0, react_1.useMemo)(() => ({
         item,
         utils: {

package/lib/components/color-picker/gradient-select/GradientSelect.js

@@ -29,6 +29,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.GradientSelect = exports.fixedGradientScales = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const styled_1 = __importDefault(require("@emotion/styled"));
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error
+// @ts-ignore This import fails when compiling to CJS.
 const react_1 = require("@headlessui/react");
 const scaleChromatic = __importStar(require("d3-scale-chromatic"));
 const react_2 = require("react");

package/lib/components/color-picker/react-color/common/EditableInput.js

@@ -7,7 +7,7 @@ const UP_KEY_CODE = 38;
 const DOWN_KEY_CODE = 40;
 const VALID_KEY_CODES = new Set([UP_KEY_CODE, DOWN_KEY_CODE]);
 const isValidKeyCode = (keyCode) => VALID_KEY_CODES.has(keyCode);
-const getNumberValue = (value) => Number(String(value).replace(/%/g, ''));
+const getNumberValue = (value) => Number(String(value).replaceAll('%', ''));
 let idCounter = 1;
 const styles = {
     wrap: {

package/lib/components/dropdown-menu/DropdownMenu.js

@@ -2,6 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DropdownMenu = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error
+// @ts-ignore This import fails when compiling to CJS.
 const react_1 = require("@headlessui/react");
 const react_2 = require("react");
 const useModifiedPopper_1 = require("../hooks/useModifiedPopper");

package/lib/components/dropdown-menu/MenuItems.js

@@ -6,6 +6,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.MenuItems = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const styled_1 = __importDefault(require("@emotion/styled"));
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error
+// @ts-ignore This import fails when compiling to CJS.
 const react_1 = require("@headlessui/react");
 const ItemDiv = styled_1.default.div `
   display: contents;
@@ -39,7 +41,9 @@ const ItemsDiv = styled_1.default.div `
   align-items: center;
   border-radius: 6px;
   background-color: white;
-  box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 5px 12px;
+  box-shadow:
+    rgba(0, 0, 0, 0.3) 0px 19px 38px,
+    rgba(0, 0, 0, 0.22) 0px 5px 12px;
   padding-top: 5px;
   padding-bottom: 5px;
   --cell-padding: 16px;