Update redux-devtools-app

This commit is contained in:
Nathan Bierema 2023-01-02 11:16:46 -05:00
parent 1379dd25a7
commit 6c4520a185
4 changed files with 8 additions and 8 deletions

View File

@ -1,3 +1,4 @@
export type { HierarchyPointNode } from 'd3';
export type { StyleValue } from 'd3tooltip'; export type { StyleValue } from 'd3tooltip';
export { default as tree } from './tree/tree'; export { default as tree } from './tree/tree';
export type { Node, Options } from './tree/tree'; export type { Node, Options } from './tree/tree';

View File

@ -52,7 +52,7 @@ export interface Options {
widthBetweenNodesCoeff: number; widthBetweenNodesCoeff: number;
transitionDuration: number; transitionDuration: number;
blinkDuration: number; blinkDuration: number;
onClickText: (datum: Node) => void; onClickText: (datum: HierarchyPointNode<Node>) => void;
tooltipOptions: { tooltipOptions: {
disabled?: boolean; disabled?: boolean;
left?: number | undefined; left?: number | undefined;
@ -383,7 +383,7 @@ export default function (DOMNode: HTMLElement, options: Partial<Options> = {}) {
.attr('dy', '.35em') .attr('dy', '.35em')
.style('fill-opacity', 0) .style('fill-opacity', 0)
.text((d) => d.data.name) .text((d) => d.data.name)
.on('click', (d) => onClickText(d.data)); .on('click', onClickText);
const nodeEnterAndUpdate = nodeEnter.merge(node); const nodeEnterAndUpdate = nodeEnter.merge(node);

View File

@ -1,3 +1,2 @@
export type { StyleValue } from 'd3tooltip';
export { tree } from './charts'; export { tree } from './charts';
export type { Node, Options } from './charts'; export type { HierarchyPointNode, Node, Options, StyleValue } from './charts';

View File

@ -1,14 +1,14 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { connect, ResolveThunks } from 'react-redux'; import { connect, ResolveThunks } from 'react-redux';
import { ChartMonitor } from '@redux-devtools/chart-monitor'; import { ChartMonitor } from '@redux-devtools/chart-monitor';
import { NodeWithId } from 'd3-state-visualizer'; import type { HierarchyPointNode, Node } from 'd3-state-visualizer';
import { selectMonitorWithState } from '../../actions'; import { selectMonitorWithState } from '../../actions';
export function getPath(obj: NodeWithId, inspectedStatePath: string[]) { export function getPath(obj: HierarchyPointNode<Node>, inspectedStatePath: string[]) {
const parent = obj.parent; const parent = obj.parent;
if (!parent) return; if (!parent) return;
getPath(parent, inspectedStatePath); getPath(parent, inspectedStatePath);
let name = obj.name; let name = obj.data.name;
const item = /.+\[(\d+)]/.exec(name); const item = /.+\[(\d+)]/.exec(name);
if (item) name = item[1]; if (item) name = item[1];
inspectedStatePath.push(name); inspectedStatePath.push(name);
@ -20,7 +20,7 @@ type Props = DispatchProps;
class ChartMonitorWrapper extends Component<Props> { class ChartMonitorWrapper extends Component<Props> {
static update = ChartMonitor.update; static update = ChartMonitor.update;
onClickText = (data: NodeWithId) => { onClickText = (data: HierarchyPointNode<Node>) => {
const inspectedStatePath: string[] = []; const inspectedStatePath: string[] = [];
getPath(data, inspectedStatePath); getPath(data, inspectedStatePath);
this.props.selectMonitorWithState('InspectorMonitor', { this.props.selectMonitorWithState('InspectorMonitor', {