Skip to content

Commit ac7ba4f

Browse files
bkrembkrem
committed
fix(ts): fixes incorrect typing for onUpdate callback
1 parent c02bc51 commit ac7ba4f

File tree

2 files changed

+9
-10
lines changed

2 files changed

+9
-10
lines changed

‎README.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -97,10 +97,10 @@ class MyComponent extends React.Component {
9797
| `onClick` | `func` | | | `undefined` | Callback function to be called when a node is clicked. <br /><br />Has the function signature `(nodeData, evt)`. The clicked node's data object is passed as first parameter, event object as second. |
9898
| `onMouseOver` | `func` | | | `undefined` | Callback function to be called when mouse enters the space belonging to a node. <br /><br />Has the function signature `(nodeData, evt)`. The clicked node's data object is passed as first parameter, event object as second. |
9999
| `onMouseOut` | `func` | | | `undefined` | Callback function to be called when mouse leaves the space belonging to a node. <br /><br />Has the function signature `(nodeData, evt)`. The clicked node's data object is passed as first parameter, event object as second. |
100-
| `onLinkClick` | `func` | | | `undefined` | Callback function to be called when a link is clicked. <br /><br />Has the function signature `(linkSource, linkTarget, evt)`. The clicked link's parent data object is passed as first parameter, the child's as second, the event object as third. |
101-
| `onLinkMouseOver` | `func` | | | `undefined` | Callback function to be called when mouse enters the space belonging to a link. <br /><br />Has the function signature `(linkSource, linkTarget, evt)`. The clicked link's parent data object is passed as first parameter, the child's as second, the event object as third. |
102-
| `onLinkMouseOut` | `func` | | | `undefined` | Callback function to be called when mouse leaves the space belonging to a link. <br /><br />Has the function signature `(linkSource, linkTarget, evt)`. The clicked link's parent data object is passed as first parameter, the child's as second, the event object as third. |
103-
| `onUpdate` | `func` | | | `undefined` | Callback function to be called when the inner D3 component updates. That is - on every zoom or translate event, or when tree branches are toggled. The node's data object, as well as zoom level and coordinates are passed to the callback. |
100+
| `onLinkClick` | `func` | | | `undefined` | Callback function to be called when a link is clicked. <br /><br />Has the function signature `(linkSource, linkTarget, evt)`. The clicked link's parent data object is passed as first parameter, the child's as second, the event object as third. |
101+
| `onLinkMouseOver` | `func` | | | `undefined` | Callback function to be called when mouse enters the space belonging to a link. <br /><br />Has the function signature `(linkSource, linkTarget, evt)`. The clicked link's parent data object is passed as first parameter, the child's as second, the event object as third. |
102+
| `onLinkMouseOut` | `func` | | | `undefined` | Callback function to be called when mouse leaves the space belonging to a link. <br /><br />Has the function signature `(linkSource, linkTarget, evt)`. The clicked link's parent data object is passed as first parameter, the child's as second, the event object as third. |
103+
| `onUpdate` | `func` | | | `undefined` | Callback function to be called when the inner D3 component updates. That is - on every zoom or translate event, or when tree branches are toggled. <br /><br />Has the function signature `(updateTarget: {targetNode, currentTranslate, currentZoom})`. |
104104
| `orientation` | `string` (enum) | `horizontal` `vertical` | | `horizontal` | `horizontal` - Tree expands left-to-right. <br /><br /> `vertical` - Tree expands top-to-bottom. |
105105
| `translate` | `object` | | | `{x: 0, y: 0}` | Translates the graph along the x/y axis by the specified amount of pixels (avoids the graph being stuck in the top left canvas corner). |
106106
| `pathFunc` | `string (enum)`/`func` | `diagonal`<br/>`elbow`<br/>`straight`<br/>`customFunc(linkData, orientation)` | | `diagonal` | `diagonal` - Smooth, curved edges between parent-child nodes. <br /><br /> `elbow` - Sharp edges at right angles between parent-child nodes. <br /><br /> `straight` - Straight lines between parent-child nodes. <br /><br /> `customFunc` - Custom draw function that accepts `linkData` as its first param and `orientation` as its second. |

‎react-d3-tree.d.ts

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@ declare module "react-d3-tree" {
1414
nodeSvgShape?: NodeSvgShape
1515
};
1616

17+
type ReactD3TreeTranslate = {x: number, y: number}
18+
1719
type ReactD3TreeProps = {
1820
data: ReactD3TreeItem[] | ReactD3TreeItem,
1921
nodeSvgShape?: NodeSvgShape,
@@ -24,12 +26,9 @@ declare module "react-d3-tree" {
2426
onLinkClick?: (linkSource: ReactD3TreeItem, linkTarget: ReactD3TreeItem, event: Event) => any,
2527
onLinkMouseOver?: (linkSource: ReactD3TreeItem, linkTarget: ReactD3TreeItem, event: Event) => any,
2628
onLinkMouseOut?: (linkSource: ReactD3TreeItem, linkTarget: ReactD3TreeItem, event: Event) => any,
27-
onUpdate?: (targetNode: ReactD3TreeItem, event: Event) => any,
29+
onUpdate?: (updateTarget: { targetNode: ReactD3TreeItem | null, currentTranslate: ReactD3TreeTranslate, currentZoom: number}) => any,
2830
orientation?: "horizontal" | "vertical",
29-
translate?: {
30-
x?: number,
31-
y?: number
32-
},
31+
translate?: Partial<ReactD3TreeTranslate>,
3332
pathFunc?: ("diagonal" | "elbow" | "straight") | ((...args: any[]) => any),
3433
transitionDuration?: number,
3534
depthFactor?: number,
@@ -62,6 +61,6 @@ declare module "react-d3-tree" {
6261

6362
var Tree: React.ComponentClass<ReactD3TreeProps>;
6463

65-
export {Tree, ReactD3TreeProps, ReactD3TreeItem, NodeSvgShape};
64+
export {Tree, ReactD3TreeProps, ReactD3TreeItem, ReactD3TreeTranslate, NodeSvgShape};
6665
export default Tree;
6766
}

0 commit comments

Comments
 (0)