diff --git a/packages/redux-devtools-inspector-monitor/src/ActionList.tsx b/packages/redux-devtools-inspector-monitor/src/ActionList.tsx index da252bcc..964905ca 100644 --- a/packages/redux-devtools-inspector-monitor/src/ActionList.tsx +++ b/packages/redux-devtools-inspector-monitor/src/ActionList.tsx @@ -1,7 +1,6 @@ import React, { ReactNode, useCallback, useLayoutEffect, useRef } from 'react'; import { Action } from 'redux'; import { PerformAction } from '@redux-devtools/core'; -import { StylingFunction } from 'react-base16-styling'; import { closestCenter, DndContext, @@ -56,7 +55,6 @@ interface Props> { draggableActions: boolean; hideMainButtons: boolean | undefined; hideActionButtons: boolean | undefined; - styling: StylingFunction; onSearch: (value: string) => void; onSelect: (e: React.MouseEvent, actionId: number) => void; onToggleAction: (actionId: number) => void; @@ -69,7 +67,6 @@ interface Props> { } export default function ActionList>({ - styling, actions, actionIds, isWideLayout, @@ -158,7 +155,6 @@ export default function ActionList>({ css={[actionListCss, isWideLayout && actionListWideCss]} > >({ {filteredActionIds.map((actionId) => ( ); interface Props { - styling: StylingFunction; onSearch: (value: string) => void; onCommit: () => void; onSweep: () => void; @@ -27,7 +25,6 @@ interface Props { } const ActionListHeader: FunctionComponent = ({ - styling, onSearch, hasSkippedActions, hasStagedActions, @@ -45,7 +42,7 @@ const ActionListHeader: FunctionComponent = ({ /> {!hideMainButtons && (
- +
{getActiveButtons(hasSkippedActions).map((btn) => (
> { - styling: StylingFunction; actionId: number; isInitAction: boolean; isSelected: boolean; @@ -52,7 +50,6 @@ export default class ActionListRow< render() { const { - styling, isSelected, action, actionId, @@ -104,7 +101,7 @@ export default class ActionListRow< {actionType}
{hideActionButtons ? ( - +
{timeDelta === 0 ? '+00:00:00' @@ -116,7 +113,7 @@ export default class ActionListRow< ) : (
- +
{timeDelta === 0 ? '+00:00:00' @@ -126,7 +123,7 @@ export default class ActionListRow< )}
- +
{([BUTTON_JUMP, BUTTON_SKIP] as const).map( (btn) => diff --git a/packages/redux-devtools-inspector-monitor/src/ActionPreview.tsx b/packages/redux-devtools-inspector-monitor/src/ActionPreview.tsx index 4eec7d44..dc5ae92c 100644 --- a/packages/redux-devtools-inspector-monitor/src/ActionPreview.tsx +++ b/packages/redux-devtools-inspector-monitor/src/ActionPreview.tsx @@ -1,7 +1,6 @@ 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'; @@ -19,7 +18,6 @@ import { export interface TabComponentProps> { labelRenderer: LabelRenderer; - styling: StylingFunction; computedStates: { state: S; error?: string }[]; actions: { [actionId: number]: PerformAction }; selectedActionId: number | null; @@ -74,7 +72,6 @@ interface Props> { dataTypeKey: string | symbol | undefined; monitorState: DevtoolsInspectorState; updateMonitorState: (monitorState: Partial) => void; - styling: StylingFunction; onInspectPath: (path: (string | number)[]) => void; inspectedPath: (string | number)[]; onSelectTab: (tabName: string) => void; @@ -91,7 +88,6 @@ class ActionPreview> extends Component< render() { const { - styling, delta, error, nextState, @@ -130,14 +126,13 @@ class ActionPreview> extends Component<
>[]} - {...{ styling, inspectedPath, onInspectPath, tabName, onSelectTab }} + {...{ inspectedPath, onInspectPath, tabName, onSelectTab }} /> {!error && (
> extends Component< } labelRenderer: LabelRenderer = ([key, ...rest], nodeType, expanded) => { - const { styling, onInspectPath, inspectedPath } = this.props; + const { onInspectPath, inspectedPath } = this.props; return ( - {key} + {key} diff --git a/packages/redux-devtools-inspector-monitor/src/ActionPreviewHeader.tsx b/packages/redux-devtools-inspector-monitor/src/ActionPreviewHeader.tsx index 8438ea7c..6c2347fb 100644 --- a/packages/redux-devtools-inspector-monitor/src/ActionPreviewHeader.tsx +++ b/packages/redux-devtools-inspector-monitor/src/ActionPreviewHeader.tsx @@ -1,6 +1,5 @@ import React, { FunctionComponent } from 'react'; import { Action } from 'redux'; -import { StylingFunction } from 'react-base16-styling'; import { Tab } from './ActionPreview'; import { inspectedPathCss, @@ -14,7 +13,6 @@ import { interface Props> { tabs: Tab[]; - styling: StylingFunction; inspectedPath: (string | number)[]; onInspectPath: (path: (string | number)[]) => void; tabName: string; @@ -23,7 +21,7 @@ interface Props> { const ActionPreviewHeader: FunctionComponent< Props> -> = ({ styling, inspectedPath, onInspectPath, tabName, onSelectTab, tabs }) => ( +> = ({ inspectedPath, onInspectPath, tabName, onSelectTab, tabs }) => (
{tabs.map((tab) => ( diff --git a/packages/redux-devtools-inspector-monitor/src/DevtoolsInspector.tsx b/packages/redux-devtools-inspector-monitor/src/DevtoolsInspector.tsx index 1cedb9ac..336b3ed1 100644 --- a/packages/redux-devtools-inspector-monitor/src/DevtoolsInspector.tsx +++ b/packages/redux-devtools-inspector-monitor/src/DevtoolsInspector.tsx @@ -297,7 +297,7 @@ class DevtoolsInspector> extends PureComponent< tabName === 'Action' ? 'inspectedActionPath' : 'inspectedStatePath'; const { themeState, isWideLayout, action, nextState, delta, error } = this.state; - const { base16Theme, styling } = themeState; + const { base16Theme } = themeState; return ( > extends PureComponent< draggableActions, hideMainButtons, hideActionButtons, - styling, }} onSearch={this.handleSearch} onSelect={this.handleSelectAction} @@ -354,7 +353,6 @@ class DevtoolsInspector> extends PureComponent< }} monitorState={this.props.monitorState} updateMonitorState={this.updateMonitorState} - styling={styling} onInspectPath={(path: (string | number)[]) => this.handleInspectPath(inspectedPathType, path) } diff --git a/packages/redux-devtools-inspector-monitor/src/RightSlider.tsx b/packages/redux-devtools-inspector-monitor/src/RightSlider.tsx index c0c01762..64e44fac 100644 --- a/packages/redux-devtools-inspector-monitor/src/RightSlider.tsx +++ b/packages/redux-devtools-inspector-monitor/src/RightSlider.tsx @@ -1,5 +1,4 @@ import React, { FunctionComponent } from 'react'; -import { StylingFunction } from 'react-base16-styling'; import { rightSliderCss, rightSliderRotateCss, @@ -8,18 +7,12 @@ import { } from './utils/createStylingFromTheme'; interface Props { - styling: StylingFunction; shown?: boolean; children: React.ReactNode; rotate?: boolean; } -const RightSlider: FunctionComponent = ({ - styling, - shown, - children, - rotate, -}) => ( +const RightSlider: FunctionComponent = ({ shown, children, rotate }) => (
> > = ({ action, - styling, base16Theme, invertTheme, labelRenderer, @@ -21,7 +20,7 @@ const ActionTab: FunctionComponent< theme={getJsonTreeTheme(base16Theme)} data={action} getItemString={(type, data) => - getItemString(styling, type, data, dataTypeKey, isWideLayout) + getItemString(type, data, dataTypeKey, isWideLayout) } invertTheme={invertTheme} hideRoot diff --git a/packages/redux-devtools-inspector-monitor/src/tabs/DiffTab.tsx b/packages/redux-devtools-inspector-monitor/src/tabs/DiffTab.tsx index 6b148b14..25f1b95f 100644 --- a/packages/redux-devtools-inspector-monitor/src/tabs/DiffTab.tsx +++ b/packages/redux-devtools-inspector-monitor/src/tabs/DiffTab.tsx @@ -7,7 +7,6 @@ const DiffTab: FunctionComponent< TabComponentProps> > = ({ delta, - styling, base16Theme, invertTheme, labelRenderer, @@ -17,7 +16,6 @@ const DiffTab: FunctionComponent< { } render() { - const { styling, base16Theme, ...props } = this.props; + const { base16Theme, ...props } = this.props; if (!this.state.data) { return
(states are equal)
; @@ -115,7 +113,6 @@ export default class JSONDiff extends Component { getItemString = (type: string, data: any) => getItemString( - this.props.styling, type, data, this.props.dataTypeKey, @@ -124,7 +121,7 @@ export default class JSONDiff extends Component { ); valueRenderer = (raw: any, value: any) => { - const { styling, isWideLayout } = this.props; + const { isWideLayout } = this.props; if (Array.isArray(value)) { switch (value.length) { diff --git a/packages/redux-devtools-inspector-monitor/src/tabs/StateTab.tsx b/packages/redux-devtools-inspector-monitor/src/tabs/StateTab.tsx index 95d305d4..20137b59 100644 --- a/packages/redux-devtools-inspector-monitor/src/tabs/StateTab.tsx +++ b/packages/redux-devtools-inspector-monitor/src/tabs/StateTab.tsx @@ -9,7 +9,6 @@ const StateTab: React.FunctionComponent< TabComponentProps> > = ({ nextState, - styling, base16Theme, invertTheme, labelRenderer, @@ -23,7 +22,7 @@ const StateTab: React.FunctionComponent< theme={getJsonTreeTheme(base16Theme)} data={nextState} getItemString={(type, data) => - getItemString(styling, type, data, dataTypeKey, isWideLayout) + getItemString(type, data, dataTypeKey, isWideLayout) } invertTheme={invertTheme} hideRoot diff --git a/packages/redux-devtools-inspector-monitor/src/tabs/getItemString.tsx b/packages/redux-devtools-inspector-monitor/src/tabs/getItemString.tsx index e4b587f7..ec5b4d1f 100644 --- a/packages/redux-devtools-inspector-monitor/src/tabs/getItemString.tsx +++ b/packages/redux-devtools-inspector-monitor/src/tabs/getItemString.tsx @@ -1,6 +1,5 @@ import React from 'react'; import { isCollection, isIndexed, isKeyed } from 'immutable'; -import { StylingFunction } from 'react-base16-styling'; import isIterable from '../utils/isIterable'; import { treeItemHintCss } from '../utils/createStylingFromTheme'; @@ -73,7 +72,6 @@ function getText( } const getItemString = ( - styling: StylingFunction, type: string, data: any, dataTypeKey: string | symbol | undefined,