fix: keep React 18 support

.ncurc.yml

@@ -7,3 +7,6 @@ reject:
   - 'fifo-logger'
   - 'react'
   - 'react-dom'
+  # https://github.com/zakodium-oss/react-science/issues/1008
+  - '@types/react'
+  - '@types/react-dom'

package.json

@@ -52,8 +52,8 @@
     "@blueprintjs/icons": "^6.11.0",
     "@blueprintjs/select": "^6.3.0",
     "fifo-logger": "^2.0.1",
-    "react": "^19.2.7",
-    "react-dom": "^19.2.7"
+    "react": "^18.3.1 || ^19.2.7",
+    "react-dom": "^18.3.1 || ^19.2.7"
   },
   "dependencies": {
     "@atlaskit/pragmatic-drag-and-drop": "^1.8.1",
@@ -89,8 +89,8 @@
     "@types/babel__core": "^7.20.5",
     "@types/d3-scale-chromatic": "^3.1.0",
     "@types/node": "^24.13.1",
-    "@types/react": "^19.2.17",
-    "@types/react-dom": "^19.2.3",
+    "@types/react": "^18.3.31",
+    "@types/react-dom": "^18.3.7",
     "@types/tinycolor2": "^1.4.6",
     "@vitejs/plugin-react": "^6.0.2",
     "@vitest/coverage-v8": "^4.1.8",
@@ -114,8 +114,8 @@
     "netcdfjs": "^4.0.0",
     "postcss-styled-syntax": "^0.7.1",
     "prettier": "^3.8.4",
-    "react": "19.2.7",
-    "react-dom": "19.2.7",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
     "react-error-boundary": "^6.1.2",
     "react-kbs": "^3.1.0",
     "react-ocl": "^8.7.1",

src/components/fullscreen/fullscreen_context.provider.tsx

@@ -1,9 +1,12 @@
-import type { ReactNode, RefObject } from 'react';
+import type { MutableRefObject, ReactNode } from 'react';
 import { useMemo } from 'react';
 import { useFullScreenHandle } from 'react-full-screen';
 
 import { fullscreenContext } from './fullscreen_context.js';
 
+// Remove for React 19.
+type RefObject<T> = MutableRefObject<T>;
+
 export interface FullscreenProviderProps {
   /**
    * Callback providing the ref which should be passed to the element that can be displayed fullscreen.

src/components/split_pane/split_pane.tsx

@@ -3,9 +3,9 @@ import styled from '@emotion/styled';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import type {
   CSSProperties,
+  MutableRefObject,
   PointerEvent as ReactPointerEvent,
   ReactNode,
-  RefObject,
 } from 'react';
 import { useEffect, useReducer, useRef } from 'react';
 import { useResizeObserver } from 'react-d3-utils';
@@ -15,6 +15,9 @@ import type { SplitPaneSize, SplitPaneType } from './split_pane_helpers.js';
 import { parseSize, serializeSize } from './split_pane_helpers.js';
 import { useSplitPaneSize } from './use_split_pane_size.js';
 
+// Remove for React 19.
+type RefObject<T> = MutableRefObject<T>;
+
 export type SplitPaneDirection = 'vertical' | 'horizontal';
 export type SplitPaneSide = 'start' | 'end';
 

src/components/table/reorder_rows/draggable_row_context.ts

@@ -1,8 +1,11 @@
-import type { RefObject } from 'react';
+import type { MutableRefObject } from 'react';
 import { createContext, useContext } from 'react';
 
 import type { DraggableItemState } from './item_data.js';
 
+// Remove for React 19.
+type RefObject<T> = MutableRefObject<T>;
+
 export interface DraggableRowContext {
   state: DraggableItemState;
   dragHandleRef: RefObject<HTMLButtonElement | null>;

stories/components/accordion_story_helpers.tsx

@@ -16,7 +16,7 @@ type AccordionStoryAction<T extends string> =
 function accordionStoryReducer<T extends string>(
   state: AccordionStoryState<T>,
   action: AccordionStoryAction<T>,
-) {
+): AccordionStoryState<T> {
   return match(action)
     .with({ type: 'add' }, ({ id }) => {
       return {

stories/components/form/form.stories.tsx

@@ -1,11 +1,14 @@
 import { Dialog, DialogBody, DialogFooter } from '@blueprintjs/core';
 import { revalidateLogic } from '@tanstack/react-form';
-import type { SubmitEvent } from 'react';
+import type { FormEvent } from 'react';
 import { useState } from 'react';
 import { z } from 'zod';
 
 import { Button, useForm } from '../../../src/components/index.js';
 
+// Remove for React 19.
+type SubmitEvent<T> = FormEvent<T>;
+
 export default {
   title: 'Forms / Form',
 };

stories/components/form/tanstack/input.stories.tsx

@@ -2,14 +2,17 @@ import type { OptionProps } from '@blueprintjs/core';
 import { Radio } from '@blueprintjs/core';
 import type { Meta } from '@storybook/react-vite';
 import { revalidateLogic } from '@tanstack/react-form';
-import type { SubmitEvent } from 'react';
+import type { FormEvent } from 'react';
 import { action } from 'storybook/actions';
 import { z } from 'zod';
 
 import type { Layout } from '../../../../src/components/form/components/input_groups/form_context.js';
 import { Section } from '../../../../src/components/form/components/layout/Section.js';
 import { useForm } from '../../../../src/components/index.js';
 
+// Remove for React 19.
+type SubmitEvent<T> = FormEvent<T>;
+
 export default {
   title: 'Forms / Form / Tanstack / Inputs',
   args: {