react-science 9.0.0 → 10.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-science",
-  "version": "9.0.0",
+  "version": "10.0.0",
   "description": "React components to build scientific applications UI",
   "type": "module",
   "exports": {
@@ -39,7 +39,7 @@
     "test-only": "vitest run --coverage "
   },
   "volta": {
-    "node": "22.9.0"
+    "node": "22.11.0"
   },
   "overrides": {
     "react": "^18.3.1",
@@ -53,76 +53,77 @@
     "react-dom": ">=18.0.0"
   },
   "dependencies": {
-    "@blueprintjs/select": "^5.2.5",
-    "@emotion/react": "^11.13.3",
-    "@emotion/styled": "^11.13.0",
+    "@blueprintjs/select": "^5.3.4",
+    "@emotion/react": "^11.13.5",
+    "@emotion/styled": "^11.13.5",
     "@lukeed/uuid": "^2.0.1",
     "@popperjs/core": "^2.11.8",
     "@radix-ui/react-collapsible": "^1.1.1",
     "@radix-ui/react-radio-group": "^1.2.1",
     "@radix-ui/react-select": "^2.1.2",
-    "@tanstack/react-query": "^5.59.13",
+    "@tanstack/react-query": "^5.61.0",
     "@tanstack/react-table": "^8.20.5",
     "biologic-converter": "^0.6.0",
-    "cheminfo-types": "^1.8.0",
+    "cheminfo-types": "^1.8.1",
     "d3-scale-chromatic": "^3.1.0",
     "filelist-utils": "^1.11.2",
     "immer": "^10.1.1",
-    "jcampconverter": "^9.6.4",
+    "jcampconverter": "^10.0.1",
     "lodash": "^4.17.21",
     "ml-gsd": "^12.1.8",
     "ml-peak-shape-generator": "^4.1.4",
-    "ml-signal-processing": "^1.1.1",
-    "ml-spectra-processing": "^14.6.0",
-    "ms-spectrum": "^3.6.8",
+    "ml-signal-processing": "^1.2.0",
+    "ml-spectra-processing": "^14.6.2",
+    "ms-spectrum": "^3.6.10",
     "netcdfjs": "^3.0.0",
-    "react-d3-utils": "^2.0.0",
-    "react-dropzone": "14.2.3",
+    "react-d3-utils": "^3.0.0",
+    "react-dropzone": "14.3.5",
     "react-icons": "^5.3.0",
     "react-inspector": "^6.0.2",
     "react-plot": "^3.0.0",
     "react-popper": "^2.3.0",
     "spc-parser": "^1.0.0",
     "tinycolor2": "^1.6.0",
+    "ts-pattern": "^5.5.0",
     "use-resize-observer": "^9.1.0",
     "wdf-parser": "^0.3.0"
   },
   "devDependencies": {
-    "@blueprintjs/core": "^5.13.1",
-    "@blueprintjs/icons": "^5.13.0",
-    "@playwright/experimental-ct-react": "^1.48.0",
-    "@playwright/test": "^1.48.0",
-    "@storybook/addon-essentials": "^8.3.5",
-    "@storybook/addon-storysource": "^8.3.5",
-    "@storybook/blocks": "^8.3.5",
-    "@storybook/react": "^8.3.5",
-    "@storybook/react-vite": "^8.3.5",
+    "@blueprintjs/core": "^5.15.0",
+    "@blueprintjs/icons": "^5.14.0",
+    "@playwright/experimental-ct-react": "^1.49.0",
+    "@playwright/test": "^1.49.0",
+    "@storybook/addon-essentials": "^8.4.5",
+    "@storybook/addon-storysource": "^8.4.5",
+    "@storybook/blocks": "^8.4.5",
+    "@storybook/react": "^8.4.5",
+    "@storybook/react-vite": "^8.4.5",
     "@types/babel__core": "^7.20.5",
     "@types/d3-scale-chromatic": "^3.0.3",
-    "@types/lodash": "^4.17.10",
-    "@types/react": "^18.3.11",
+    "@types/lodash": "^4.17.13",
+    "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",
     "@types/react-inspector": "^4.0.6",
     "@types/tinycolor2": "^1.4.6",
-    "@vitejs/plugin-react": "^4.3.2",
-    "@vitest/coverage-v8": "^2.1.3",
-    "cheminfo-font": "^1.13.0",
+    "@vitejs/plugin-react": "^4.3.3",
+    "@vitest/coverage-v8": "^2.1.5",
+    "cheminfo-font": "^1.13.1",
     "cross-env": "^7.0.3",
-    "eslint": "^9.12.0",
-    "eslint-config-zakodium": "^13.0.0",
-    "eslint-plugin-storybook": "^0.9.0",
+    "eslint": "^9.15.0",
+    "eslint-config-zakodium": "^14.0.0",
+    "eslint-plugin-storybook": "^0.11.1",
     "fifo-logger": "^1.0.0",
     "prettier": "^3.3.3",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-error-boundary": "^4.0.13",
+    "react-error-boundary": "^4.1.2",
     "react-kbs": "^2.1.1",
-    "react-ocl": "^7.0.1",
+    "react-ocl": "^7.0.2",
     "rimraf": "^6.0.1",
-    "storybook": "^8.3.5",
+    "storybook": "^8.4.5",
     "typescript": "^5.6.3",
-    "vite": "^5.4.9",
-    "vitest": "^2.1.3"
+    "vite": "^5.4.11",
+    "vitest": "^2.1.5"
   },
   "repository": {
     "type": "git",

package/src/app/about/AboutDialogToolbarButton.tsx

@@ -1,6 +1,6 @@
 import { Dialog, DialogBody } from '@blueprintjs/core';
 import type { IconName } from '@blueprintjs/icons';
-import { type ReactElement, type ReactNode } from 'react';
+import type { ReactElement, ReactNode } from 'react';
 
 import { Toolbar, useOnOff } from '../../components/index.js';
 

package/src/app/explorer/ExplorerPlotView.tsx

@@ -1,3 +1,5 @@
+import { match } from 'ts-pattern';
+
 import { useAppView } from '../../app-data/index.js';
 import { assertNotNull } from '../../components/index.js';
 import { IvPlotView, MassPlotView } from '../index.js';
@@ -8,13 +10,8 @@ export function ExplorerPlotView() {
   const appView = useAppView();
   const selectedKind = appView.selectedKind;
   assertNotNull(selectedKind);
-  switch (selectedKind) {
-    case 'mass':
-      return <MassPlotView />;
-    case 'iv':
-      return <IvPlotView />;
-    default: {
-      return <MeasurementExplorerWithState />;
-    }
-  }
+  return match(selectedKind)
+    .with('mass', () => <MassPlotView />)
+    .with('iv', () => <IvPlotView />)
+    .otherwise(() => <MeasurementExplorerWithState />);
 }

package/src/app/explorer/MeasurementExplorer.tsx

@@ -2,10 +2,8 @@ import styled from '@emotion/styled';
 import { useMemo, useState } from 'react';
 import { FaArrowsAltH, FaExchangeAlt } from 'react-icons/fa';
 
-import {
-  MeasurementPlot,
-  type MeasurementPlotProps,
-} from '../helpers/index.js';
+import type { MeasurementPlotProps } from '../helpers/index.js';
+import { MeasurementPlot } from '../helpers/index.js';
 
 export type MeasurementExplorerProps = Omit<
   MeasurementPlotProps,

package/src/app/helpers/react-plot.tsx

@@ -1,5 +1,6 @@
 import styled from '@emotion/styled';
-import { type ReactNode, useMemo } from 'react';
+import type { ReactNode } from 'react';
+import { useMemo } from 'react';
 import { ResponsiveChart } from 'react-d3-utils';
 import {
   Annotations,

package/src/app/helpers/splitEntries.ts

@@ -1,9 +1,9 @@
-import {
-  type AppState,
-  iterateKindMeasurementsAndView,
-  type MeasurementAndView,
-  type MeasurementKind,
+import type {
+  AppState,
+  MeasurementAndView,
+  MeasurementKind,
 } from '../../app-data/index.js';
+import { iterateKindMeasurementsAndView } from '../../app-data/index.js';
 
 export function splitEntries<Kind extends MeasurementKind>(
   appState: AppState,

package/src/app/hooks/file-loading.ts

@@ -1,9 +1,12 @@
-import { useQuery, type UseQueryResult } from '@tanstack/react-query';
+import type { UseQueryResult } from '@tanstack/react-query';
+import { useQuery } from '@tanstack/react-query';
 import type { FifoLogger } from 'fifo-logger';
-import { FileCollection, fileCollectionFromWebSource } from 'filelist-utils';
+import type { FileCollection } from 'filelist-utils';
+import { fileCollectionFromWebSource } from 'filelist-utils';
 import { useCallback } from 'react';
 
-import { type AppDispatch, useAppDispatch } from '../../app-data/index.js';
+import type { AppDispatch } from '../../app-data/index.js';
+import { useAppDispatch } from '../../app-data/index.js';
 import { useFifoLogger, useHashSearchParams } from '../../components/index.js';
 
 type LoadFn = (

package/src/app/kinds/iv/plot-view/IvSeries.tsx

@@ -2,11 +2,8 @@ import { xyToXYObject } from 'ml-spectra-processing';
 import { useMemo } from 'react';
 import { LineSeries } from 'react-plot';
 
-import {
-  type ColorConfig,
-  getVariableByLabel,
-  type IvMeasurement,
-} from '../../../../app-data/index.js';
+import type { ColorConfig, IvMeasurement } from '../../../../app-data/index.js';
+import { getVariableByLabel } from '../../../../app-data/index.js';
 import { getColorFromConfig } from '../../../helpers/index.js';
 
 interface IvSeriesProps {

package/src/app/kinds/mass/MeasurementMassPlot.tsx

@@ -10,10 +10,8 @@ import {
   usePlotControllerAxes,
 } from 'react-plot';
 
-import {
-  BasicComponent,
-  type MeasurementPlotProps,
-} from '../../helpers/index.js';
+import type { MeasurementPlotProps } from '../../helpers/index.js';
+import { BasicComponent } from '../../helpers/index.js';
 
 interface Peak {
   label: string;

package/src/app/panels/measurement-config/MeasurementConfigPanel.tsx

@@ -1,5 +1,5 @@
+import type { ColorConfig } from '../../../app-data/index.js';
 import {
-  type ColorConfig,
   getFirstSelectedMeasurementData,
   useAppDispatch,
   useAppState,

package/src/app/panels/measurement-info/MeasurementInfoPanel.tsx

@@ -2,7 +2,8 @@ import {
   getCurrentMeasurementData,
   useAppState,
 } from '../../../app-data/index.js';
-import { InfoPanel, type InfoPanelData } from '../../../components/index.js';
+import type { InfoPanelData } from '../../../components/index.js';
+import { InfoPanel } from '../../../components/index.js';
 
 export function MeasurementInfoPanel() {
   const appState = useAppState();

package/src/app/panels/measurements/MeasurementColorPreview.tsx

@@ -1,11 +1,8 @@
 import styled from '@emotion/styled';
 import { useRef } from 'react';
 
-import {
-  type ColorConfig,
-  type MeasurementKind,
-  useAppDispatch,
-} from '../../../app-data/index.js';
+import type { ColorConfig, MeasurementKind } from '../../../app-data/index.js';
+import { useAppDispatch } from '../../../app-data/index.js';
 import {
   ColorPicker,
   ColorPreview,

package/src/app/panels/measurements/MeasurementsPanel.tsx

@@ -1,11 +1,12 @@
 /** @jsxImportSource @emotion/react */
-import { type PanelProps, Tab, Tabs } from '@blueprintjs/core';
+import type { PanelProps } from '@blueprintjs/core';
+import { Tab, Tabs } from '@blueprintjs/core';
 import { css } from '@emotion/react';
 import { useMemo } from 'react';
 
+import type { MeasurementKind } from '../../../app-data/index.js';
 import {
   kindLabels,
-  type MeasurementKind,
   measurementKinds,
   useAppDispatch,
   useAppState,

package/src/app/panels/measurements/MeasurementsTable.tsx

@@ -2,18 +2,20 @@ import { Menu, MenuItem, Popover } from '@blueprintjs/core';
 import styled from '@emotion/styled';
 import { useMemo } from 'react';
 
+import type {
+  MeasurementBase,
+  MeasurementKind,
+} from '../../../app-data/index.js';
 import {
   getMeasurement,
-  type MeasurementBase,
-  type MeasurementKind,
   useAppDispatch,
   useAppState,
 } from '../../../app-data/index.js';
+import type { InfoPanelData } from '../../../components/index.js';
 import {
   Button,
   ConfirmDialog,
   InfoPanel,
-  type InfoPanelData,
   PanelPreferencesToolbar,
   useOnOff,
 } from '../../../components/index.js';

package/src/app/panels/measurements/measurement_panel_context.provider.tsx

@@ -1,9 +1,7 @@
 import type { ReactNode } from 'react';
 
-import {
-  measurementPanelContext,
-  type MeasurementState,
-} from './measurement_panel_context.js';
+import type { MeasurementState } from './measurement_panel_context.js';
+import { measurementPanelContext } from './measurement_panel_context.js';
 
 export function MeasurementPanelProvider({
   children,

package/src/app/panels/measurements/measurement_panel_context.ts

@@ -1,4 +1,4 @@
-import { type Panel } from '@blueprintjs/core';
+import type { Panel } from '@blueprintjs/core';
 import { createContext, useContext } from 'react';
 
 export interface MeasurementState {

package/src/app-data/kinds/ir/irAutoPeakPickingEnhancer.ts

@@ -1,4 +1,5 @@
-import { gsd, type GSDOptions } from 'ml-gsd';
+import type { GSDOptions } from 'ml-gsd';
+import { gsd } from 'ml-gsd';
 import type { Shape1D } from 'ml-peak-shape-generator';
 import { xMinMaxValues } from 'ml-spectra-processing';
 

package/src/app-data/loaders/loadMeasurements.ts

@@ -2,18 +2,11 @@ import type { FifoLogger } from 'fifo-logger';
 import type { FileCollection } from 'filelist-utils';
 import { xMinMaxValues } from 'ml-spectra-processing';
 
-import {
-  enhance,
-  type Enhancers,
-  type MeasurementBase,
-  type Measurements,
-} from '../index.js';
+import type { Enhancers, MeasurementBase, Measurements } from '../index.js';
+import { enhance } from '../index.js';
 
-import {
-  type MeasurementsLoader,
-  mergeMeasurements,
-  type ParserLog,
-} from './utility/index.js';
+import type { MeasurementsLoader, ParserLog } from './utility/index.js';
+import { mergeMeasurements } from './utility/index.js';
 
 export interface LoadOptions {
   loaders?: MeasurementsLoader[];

package/src/app-data/loaders/proprietary/agilent/cary500Loader.ts

@@ -1,11 +1,8 @@
 import type { FifoLogger } from 'fifo-logger';
 import type { FileCollection, FileCollectionItem } from 'filelist-utils';
 
-import {
-  getMeasurementInfoFromFile,
-  type MeasurementBase,
-  type Measurements,
-} from '../../../index.js';
+import type { MeasurementBase, Measurements } from '../../../index.js';
+import { getMeasurementInfoFromFile } from '../../../index.js';
 
 export async function cary500Loader(
   fileCollection: FileCollection,

package/src/app-data/loaders/wdfLoader.ts

@@ -1,7 +1,8 @@
 import type { MeasurementVariable } from 'cheminfo-types';
 import type { FifoLogger } from 'fifo-logger';
 import type { FileCollection } from 'filelist-utils';
-import { parse, type Wdf } from 'wdf-parser';
+import type { Wdf } from 'wdf-parser';
+import { parse } from 'wdf-parser';
 
 import type { MeasurementBase, Measurements } from '../index.js';
 

package/src/app-data/state/app_state.actions.ts

@@ -1,8 +1,8 @@
-import { type AppState } from './app_state.js';
-import {
-  type MeasurementKind,
-  type MeasurementKindAndId,
-  type Measurements,
+import type { AppState } from './app_state.js';
+import type {
+  MeasurementKind,
+  MeasurementKindAndId,
+  Measurements,
 } from './data/index.js';
 import type { MeasurementAppView, Plot2DZoom } from './view/index.js';
 

package/src/app-data/state/app_state.provider.tsx

@@ -1,4 +1,5 @@
-import { type ReactNode, useReducer } from 'react';
+import type { ReactNode } from 'react';
+import { useReducer } from 'react';
 
 import {
   appDispatchContext,

package/src/app-data/state/app_state.ts

@@ -1,11 +1,15 @@
 import { produce } from 'immer';
-import { createContext, type Dispatch, useContext } from 'react';
+import type { Dispatch } from 'react';
+import { createContext, useContext } from 'react';
 
-import { type AppStateAction } from './app_state.actions.js';
-import { type AppData, getEmptyAppData } from './data/index.js';
+import type { AppStateAction } from './app_state.actions.js';
+import type { AppData } from './data/index.js';
+import { getEmptyAppData } from './data/index.js';
 import { appStateProducer } from './producers/index.js';
-import { type AppSettings, getEmptyAppSettings } from './settings/index.js';
-import { type AppView, getEmptyAppView } from './view/index.js';
+import type { AppSettings } from './settings/index.js';
+import { getEmptyAppSettings } from './settings/index.js';
+import type { AppView } from './view/index.js';
+import { getEmptyAppView } from './view/index.js';
 
 export interface AppState {
   load: AppLoad;

package/src/app-data/state/producers/app_state_producer.ts

@@ -1,7 +1,7 @@
-import { type Draft } from 'immer';
+import type { Draft } from 'immer';
 
-import { type AppStateAction } from '../app_state.actions.js';
-import { type AppState } from '../app_state.js';
+import type { AppStateAction } from '../app_state.actions.js';
+import type { AppState } from '../app_state.js';
 
 import { addMeasurements } from './measurements/addMeasurements.js';
 import {

package/src/app-data/state/producers/measurements/addMeasurements.ts

@@ -1,10 +1,10 @@
 import { assert, defaultColorPalette } from '../../../../components/index.js';
 import { getPreferredVariable, mergeMeasurements } from '../../../index.js';
+import type { MeasurementKind } from '../../index.js';
 import {
   getFirstMeasurementOrFail,
   iterateMeasurementEntries,
   kindLabels,
-  type MeasurementKind,
 } from '../../index.js';
 import { resetZoom, updateZoom } from '../plot-view/helpers/zoom.js';
 import type { AppStateProducer } from '../types.js';

package/src/app-data/state/producers/plot-view/helpers/zoom.ts

@@ -3,13 +3,13 @@ import {
   getPreferredVariable,
   getVariableByLabel,
 } from '../../../../helpers/index.js';
-import {
-  type AppState,
-  iterateKindMeasurementsAndView,
-  type MeasurementBase,
-  type MeasurementKind,
-  type Plot2DZoom,
+import type {
+  AppState,
+  MeasurementBase,
+  MeasurementKind,
+  Plot2DZoom,
 } from '../../../index.js';
+import { iterateKindMeasurementsAndView } from '../../../index.js';
 
 export function getInitialZoom(): Plot2DZoom {
   return {

package/src/app-data/state/settings/get_empty_app_settings.ts

@@ -1,4 +1,4 @@
-import { type AppSettings } from './app_settings.js';
+import type { AppSettings } from './app_settings.js';
 
 export function getEmptyAppSettings(): AppSettings {
   return {

package/src/app-data/state/view/app_view.ts

@@ -1,4 +1,4 @@
-import { type GradientScaleName } from '../../../components/index.js';
+import type { GradientScaleName } from '../../../components/index.js';
 import type { MeasurementKind } from '../index.js';
 
 export interface AppView {

package/src/app-data/state/view/get_empty_app_view.ts

@@ -1,4 +1,4 @@
-import { type AppView } from './app_view.js';
+import type { AppView } from './app_view.js';
 
 export function getEmptyAppView(): AppView {
   return {

package/src/components/accordion/accordion_context.provider.tsx

@@ -1,6 +1,8 @@
-import { type ReactNode, useMemo, useReducer } from 'react';
+import type { ReactNode } from 'react';
+import { useMemo, useReducer } from 'react';
 
-import { accordionContext, type ContextType } from './accordion_context.js';
+import type { ContextType } from './accordion_context.js';
+import { accordionContext } from './accordion_context.js';
 import { reducer } from './accordion_context.state.js';
 
 export function AccordionProvider(props: { children: ReactNode }) {

package/src/components/accordion/accordion_context.state.ts

@@ -1,4 +1,5 @@
-import { type Draft, produce } from 'immer';
+import type { Draft } from 'immer';
+import { produce } from 'immer';
 import type { Reducer } from 'react';
 
 type ActionType<Action, Payload = void> = Payload extends void

package/src/components/accordion/accordion_context.ts

@@ -1,10 +1,10 @@
 import { createContext, useContext, useEffect, useMemo } from 'react';
 
-import {
-  type AccordionItemState,
-  type AccordionState,
-  getItem,
+import type {
+  AccordionItemState,
+  AccordionState,
 } from './accordion_context.state.js';
+import { getItem } from './accordion_context.state.js';
 
 export type ContextType = [
   AccordionContext,