Fix inspector-monitor types

This commit is contained in:
Nathan Bierema 2023-01-04 21:58:39 -05:00
parent 8472c0aacc
commit ff49e9e380
4 changed files with 20 additions and 22 deletions

View File

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

View File

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

View File

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

View File

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