From 91f21b2ffc5bcacee80a0ff65188e6ea3a3f24cb Mon Sep 17 00:00:00 2001
From: Nathan Bierema <nbierema@gmail.com>
Date: Sat, 1 Mar 2025 15:09:01 -0500
Subject: [PATCH] Fix compatibility of createDevTools with React 19 types
 (#1837)

* Fix compatibility of createDevTools with React 19 types

* Create fluffy-keys-doubt.md
---
 .changeset/fluffy-keys-doubt.md               |  5 ++++
 .../redux-devtools/src/createDevTools.tsx     | 24 +++++++++++++++++--
 2 files changed, 27 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/fluffy-keys-doubt.md

diff --git a/.changeset/fluffy-keys-doubt.md b/.changeset/fluffy-keys-doubt.md
new file mode 100644
index 00000000..257296e7
--- /dev/null
+++ b/.changeset/fluffy-keys-doubt.md
@@ -0,0 +1,5 @@
+---
+'@redux-devtools/core': patch
+---
+
+Fix compatibility of createDevTools with React 19 types
diff --git a/packages/redux-devtools/src/createDevTools.tsx b/packages/redux-devtools/src/createDevTools.tsx
index ef9f288f..80e6d985 100644
--- a/packages/redux-devtools/src/createDevTools.tsx
+++ b/packages/redux-devtools/src/createDevTools.tsx
@@ -6,8 +6,9 @@ import {
   LiftedState,
   LiftedStore,
   Options,
+  InstrumentExt,
 } from '@redux-devtools/instrument';
-import { Action } from 'redux';
+import { Action, StoreEnhancer } from 'redux';
 
 function logError(type: string) {
   if (type === 'NoStore') {
@@ -46,13 +47,32 @@ export type Monitor<
   }
 >;
 
+export interface DevToolsInstance<S, A extends Action<string>, MonitorState>
+  extends Component<Props<S, A, MonitorState>> {
+  liftedStore?: LiftedStore<S, A, MonitorState>;
+}
+
+export interface DevToolsClass<
+  S,
+  A extends Action<string>,
+  MonitorState,
+  MonitorAction extends Action<string>,
+> {
+  new (props: Props<S, A, MonitorState>): DevToolsInstance<S, A, MonitorState>;
+  instrument: (
+    options?: Options<S, A, MonitorState, MonitorAction>,
+  ) => StoreEnhancer<InstrumentExt<any, any, MonitorState>>;
+}
+
 export default function createDevTools<
   S,
   A extends Action<string>,
   MonitorProps extends LiftedState<S, A, MonitorState>,
   MonitorState,
   MonitorAction extends Action<string>,
->(children: Monitor<S, A, MonitorProps, MonitorState, MonitorAction>) {
+>(
+  children: Monitor<S, A, MonitorProps, MonitorState, MonitorAction>,
+): DevToolsClass<S, A, MonitorState, MonitorAction> {
   const monitorElement = Children.only(children);
   const monitorProps = monitorElement.props;
   const Monitor = monitorElement.type;