Fix inspector-monitor types

packages/react-json-tree/src/index.tsx

@@ -74,4 +74,16 @@ export function JSONTree({
   );
 }
 
+export type {
+  Key,
+  KeyPath,
+  GetItemString,
+  LabelRenderer,
+  ValueRenderer,
+  ShouldExpandNodeInitially,
+  PostprocessValue,
+  IsCustomNode,
+  SortObjectKeys,
+  Styling,
+} from './types';
 export type { StylingValue };

packages/redux-devtools-inspector-monitor/src/ActionPreview.tsx

@@ -2,6 +2,7 @@ import React, { Component } from 'react';
 import { Base16Theme } from 'redux-devtools-themes';
 import { Action } from 'redux';
 import type { StylingFunction } from 'react-base16-styling';
+import type { LabelRenderer } from 'react-json-tree';
 import { PerformAction } from '@redux-devtools/core';
 import { Delta } from 'jsondiffpatch';
 import { DEFAULT_STATE, DevtoolsInspectorState } from './redux';
@@ -11,12 +12,7 @@ import StateTab from './tabs/StateTab';
 import ActionTab from './tabs/ActionTab';
 
 export interface TabComponentProps<S, A extends Action<unknown>> {
-  labelRenderer: (
-    keyPath: (string | number)[],
-    nodeType: string,
-    expanded: boolean,
-    expandable: boolean
-  ) => React.ReactNode;
+  labelRenderer: LabelRenderer;
   styling: StylingFunction;
   computedStates: { state: S; error?: string }[];
   actions: { [actionId: number]: PerformAction<A> };
@@ -152,11 +148,7 @@ class ActionPreview<S, A extends Action<unknown>> extends Component<
     );
   }
 
-  labelRenderer = (
-    [key, ...rest]: (string | number)[],
-    nodeType: string,
-    expanded: boolean
-  ) => {
+  labelRenderer: LabelRenderer = ([key, ...rest], nodeType, expanded) => {
     const { styling, onInspectPath, inspectedPath } = this.props;
 
     return (

packages/redux-devtools-inspector-monitor/src/index.ts

@@ -1,4 +1,5 @@
 export type { StylingFunction } from 'react-base16-styling';
+export type { LabelRenderer } from 'react-json-tree';
 export { default as InspectorMonitor } from './DevtoolsInspector';
 export type { Tab, TabComponentProps } from './ActionPreview';
 export type { DevtoolsInspectorState } from './redux';

packages/redux-devtools-inspector-monitor/src/tabs/JSONDiff.tsx

@@ -1,5 +1,6 @@
 import React, { Component } from 'react';
 import { JSONTree } from 'react-json-tree';
+import type { LabelRenderer, ShouldExpandNodeInitially } from 'react-json-tree';
 import { stringify } from 'javascript-stringify';
 import { Delta } from 'jsondiffpatch';
 import { StylingFunction } from 'react-base16-styling';
@@ -22,11 +23,8 @@ function stringifyAndShrink(val: any, isWideLayout?: boolean) {
   return str.length > 22 ? `${str.substr(0, 15)}…${str.substr(-5)}` : str;
 }
 
-const expandFirstLevel = (
-  keyName: (string | number)[],
-  data: any,
-  level: number
-) => level <= 1;
+const expandFirstLevel: ShouldExpandNodeInitially = (keyName, data, level) =>
+  level <= 1;
 
 function prepareDelta(value: any) {
   if (value && value._t === 'a') {
@@ -53,12 +51,7 @@ interface Props {
   styling: StylingFunction;
   base16Theme: Base16Theme;
   invertTheme: boolean;
-  labelRenderer: (
-    keyPath: (string | number)[],
-    nodeType: string,
-    expanded: boolean,
-    expandable: boolean
-  ) => React.ReactNode;
+  labelRenderer: LabelRenderer;
   isWideLayout: boolean;
   dataTypeKey: string | symbol | undefined;
 }