Skip to content

Commit fa152f5

Browse files
ploucplouc
committedDec 31, 2021
feat(network): remove prop-types
·
v0.88.0v0.77.0
1 parent 353010f commit fa152f5

12 files changed

+112
-132
lines changed
 

‎packages/network/package.json

-1
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,6 @@
4242
},
4343
"peerDependencies": {
4444
"@nivo/core": "0.76.0",
45-
"prop-types": ">= 15.5.10 < 16.0.0",
4645
"react": ">= 16.14.0 < 18.0.0"
4746
},
4847
"publishConfig": {

‎packages/network/src/AnimatedLinks.tsx

+7-8
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { memo } from 'react'
2-
import PropTypes from 'prop-types'
32
import { TransitionMotion, spring } from 'react-motion'
43
import { useMotionConfig } from '@nivo/core'
54
import Link from './Link'
@@ -16,7 +15,13 @@ const willEnter = ({ style, data }) => {
1615
}
1716
}
1817

19-
const AnimatedLinks = ({ links, linkThickness, linkColor }) => {
18+
interface AnimatedLinksProps {
19+
// links: PropTypes.array.isRequired,
20+
// linkThickness: PropTypes.func.isRequired,
21+
// linkColor: PropTypes.func.isRequired,
22+
}
23+
24+
const AnimatedLinks = ({ links, linkThickness, linkColor }: AnimatedLinksProps) => {
2025
const { springConfig } = useMotionConfig()
2126

2227
return (
@@ -55,10 +60,4 @@ const AnimatedLinks = ({ links, linkThickness, linkColor }) => {
5560
)
5661
}
5762

58-
AnimatedLinks.propTypes = {
59-
links: PropTypes.array.isRequired,
60-
linkThickness: PropTypes.func.isRequired,
61-
linkColor: PropTypes.func.isRequired,
62-
}
63-
6463
export default memo(AnimatedLinks)

‎packages/network/src/AnimatedNodes.tsx

+15-11
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { memo } from 'react'
2-
import PropTypes from 'prop-types'
32
import { TransitionMotion, spring } from 'react-motion'
43
import { useMotionConfig } from '@nivo/core'
54
import Node from './Node'
@@ -20,7 +19,21 @@ const willLeave =
2019
scale: spring(0, springConfig),
2120
})
2221

23-
const AnimatedNodes = ({ nodes, color, borderColor, ...props }) => {
22+
interface AnimatedNodesProps {
23+
// nodes: PropTypes.array.isRequired,
24+
nodes: any[]
25+
// color: PropTypes.func.isRequired,
26+
color: Function
27+
borderWidth: number
28+
// borderColor: PropTypes.func.isRequired,
29+
borderColor: Function
30+
// handleNodeHover: PropTypes.func.isRequired,
31+
handleNodeHover: Function
32+
// handleNodeLeave: PropTypes.func.isRequired,
33+
handleNodeLeave: Function
34+
}
35+
36+
const AnimatedNodes = ({ nodes, color, borderColor, ...props }: AnimatedNodesProps) => {
2437
const { springConfig } = useMotionConfig()
2538

2639
return (
@@ -61,13 +74,4 @@ const AnimatedNodes = ({ nodes, color, borderColor, ...props }) => {
6174
)
6275
}
6376

64-
AnimatedNodes.propTypes = {
65-
nodes: PropTypes.array.isRequired,
66-
color: PropTypes.func.isRequired,
67-
borderWidth: PropTypes.number.isRequired,
68-
borderColor: PropTypes.func.isRequired,
69-
handleNodeHover: PropTypes.func.isRequired,
70-
handleNodeLeave: PropTypes.func.isRequired,
71-
}
72-
7377
export default memo(AnimatedNodes)

‎packages/network/src/Link.tsx

+11-12
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,16 @@
11
import { memo } from 'react'
2-
import PropTypes from 'prop-types'
32

4-
const Link = ({ sourceX, sourceY, targetX, targetY, thickness, color }) => {
3+
interface LinkProps {
4+
link: any
5+
sourceX: number
6+
sourceY: number
7+
targetX: number
8+
targetY: number
9+
thickness: number
10+
color: string
11+
}
12+
13+
const Link = ({ sourceX, sourceY, targetX, targetY, thickness, color }: LinkProps) => {
514
return (
615
<line
716
stroke={color}
@@ -15,14 +24,4 @@ const Link = ({ sourceX, sourceY, targetX, targetY, thickness, color }) => {
1524
)
1625
}
1726

18-
Link.propTypes = {
19-
link: PropTypes.object.isRequired,
20-
sourceX: PropTypes.number.isRequired,
21-
sourceY: PropTypes.number.isRequired,
22-
targetX: PropTypes.number.isRequired,
23-
targetY: PropTypes.number.isRequired,
24-
thickness: PropTypes.number.isRequired,
25-
color: PropTypes.string.isRequired,
26-
}
27-
2827
export default memo(Link)

‎packages/network/src/Network.tsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { createElement, Fragment, useCallback } from 'react'
22
import { withContainer, useDimensions, SvgWrapper, useTheme, useMotionConfig } from '@nivo/core'
33
import { useInheritedColor } from '@nivo/colors'
44
import { useTooltip } from '@nivo/tooltip'
5-
import { NetworkPropTypes, NetworkDefaultProps } from './props'
5+
import { NetworkDefaultProps } from './props'
66
import { useNetwork, useNodeColor, useLinkThickness } from './hooks'
77
import AnimatedNodes from './AnimatedNodes'
88
import StaticNodes from './StaticNodes'
@@ -120,7 +120,6 @@ const Network = props => {
120120
)
121121
}
122122

123-
Network.propTypes = NetworkPropTypes
124123
Network.defaultProps = NetworkDefaultProps
125124

126125
export default withContainer(Network)

‎packages/network/src/NetworkCanvas.tsx

+1-3
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
import { useCallback, useRef, useEffect } from 'react'
2-
32
import * as React from 'react'
43
import { getDistance, getRelativeCursor, withContainer, useDimensions, useTheme } from '@nivo/core'
54
import { useInheritedColor } from '@nivo/colors'
65
import { useTooltip } from '@nivo/tooltip'
7-
import { NetworkCanvasPropTypes, NetworkCanvasDefaultProps } from './props'
6+
import { NetworkCanvasDefaultProps } from './props'
87
import { useNetwork, useNodeColor, useLinkThickness } from './hooks'
98
import NetworkNodeTooltip from './NetworkNodeTooltip'
109

@@ -187,7 +186,6 @@ const NetworkCanvas = props => {
187186
)
188187
}
189188

190-
NetworkCanvas.propTypes = NetworkCanvasPropTypes
191189
NetworkCanvas.defaultProps = NetworkCanvasDefaultProps
192190

193191
export default withContainer(NetworkCanvas)

‎packages/network/src/NetworkNodeTooltip.tsx

+10-11
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,16 @@
11
import { memo } from 'react'
2-
import PropTypes from 'prop-types'
32
import { BasicTooltip } from '@nivo/tooltip'
43

5-
const NetworkNodeTooltip = ({ node, format, tooltip }) => (
4+
interface NetworkNodeTooltipProps {
5+
// node: PropTypes.shape({
6+
// id: PropTypes.string.isRequired,
7+
// color: PropTypes.string.isRequired,
8+
// }).isRequired,
9+
// format: PropTypes.func,
10+
// tooltip: PropTypes.func,
11+
}
12+
13+
const NetworkNodeTooltip = ({ node, format, tooltip }: NetworkNodeTooltipProps) => (
614
<BasicTooltip
715
id={node.id}
816
enableChip={true}
@@ -12,13 +20,4 @@ const NetworkNodeTooltip = ({ node, format, tooltip }) => (
1220
/>
1321
)
1422

15-
NetworkNodeTooltip.propTypes = {
16-
node: PropTypes.shape({
17-
id: PropTypes.string.isRequired,
18-
color: PropTypes.string.isRequired,
19-
}).isRequired,
20-
format: PropTypes.func,
21-
tooltip: PropTypes.func,
22-
}
23-
2423
export default memo(NetworkNodeTooltip)

‎packages/network/src/Node.tsx

+15-15
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,18 @@
11
import { memo } from 'react'
2-
import PropTypes from 'prop-types'
2+
3+
interface NodeProps {
4+
node: any
5+
x: number
6+
y: number
7+
radius: number
8+
color: string
9+
borderWidth: number
10+
borderColor: string
11+
scale?: number
12+
handleNodeClick: Function
13+
handleNodeHover: Function
14+
handleNodeLeave: Function
15+
}
316

417
const Node = ({
518
node,
@@ -13,7 +26,7 @@ const Node = ({
1326
handleNodeClick,
1427
handleNodeHover,
1528
handleNodeLeave,
16-
}) => {
29+
}: NodeProps) => {
1730
return (
1831
<circle
1932
transform={`translate(${x},${y}) scale(${scale})`}
@@ -29,17 +42,4 @@ const Node = ({
2942
)
3043
}
3144

32-
Node.propTypes = {
33-
node: PropTypes.object.isRequired,
34-
x: PropTypes.number.isRequired,
35-
y: PropTypes.number.isRequired,
36-
radius: PropTypes.number.isRequired,
37-
color: PropTypes.string.isRequired,
38-
borderWidth: PropTypes.number.isRequired,
39-
borderColor: PropTypes.string.isRequired,
40-
scale: PropTypes.number,
41-
handleNodeHover: PropTypes.func.isRequired,
42-
handleNodeLeave: PropTypes.func.isRequired,
43-
}
44-
4545
export default memo(Node)

‎packages/network/src/StaticLinks.tsx

+7-8
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,13 @@
11
import { memo } from 'react'
2-
import PropTypes from 'prop-types'
32
import Link from './Link'
43

5-
const StaticLinks = ({ links, linkThickness, linkColor }) => {
4+
interface StaticLinksProps {
5+
// links: PropTypes.array.isRequired,
6+
// linkThickness: PropTypes.func.isRequired,
7+
// linkColor: PropTypes.func.isRequired,
8+
}
9+
10+
const StaticLinks = ({ links, linkThickness, linkColor }: StaticLinksProps) => {
611
return links.map(link => {
712
return (
813
<Link
@@ -19,10 +24,4 @@ const StaticLinks = ({ links, linkThickness, linkColor }) => {
1924
})
2025
}
2126

22-
StaticLinks.propTypes = {
23-
links: PropTypes.array.isRequired,
24-
linkThickness: PropTypes.func.isRequired,
25-
linkColor: PropTypes.func.isRequired,
26-
}
27-
2827
export default memo(StaticLinks)

‎packages/network/src/StaticNodes.tsx

+10-11
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,16 @@
11
import { memo } from 'react'
2-
import PropTypes from 'prop-types'
32
import Node from './Node'
43

5-
const StaticNodes = ({ nodes, color, borderColor, ...props }) => {
4+
interface StaticNodesProps {
5+
nodes: any[]
6+
color: Function
7+
borderWidth: number
8+
borderColor: Function
9+
handleNodeHover: Function
10+
handleNodeLeave: Function
11+
}
12+
13+
const StaticNodes = ({ nodes, color, borderColor, ...props }: StaticNodesProps) => {
614
return nodes.map(node => {
715
return (
816
<Node
@@ -19,13 +27,4 @@ const StaticNodes = ({ nodes, color, borderColor, ...props }) => {
1927
})
2028
}
2129

22-
StaticNodes.propTypes = {
23-
nodes: PropTypes.array.isRequired,
24-
color: PropTypes.func.isRequired,
25-
borderWidth: PropTypes.number.isRequired,
26-
borderColor: PropTypes.func.isRequired,
27-
handleNodeHover: PropTypes.func.isRequired,
28-
handleNodeLeave: PropTypes.func.isRequired,
29-
}
30-
3130
export default memo(StaticNodes)

‎packages/network/src/props.ts

-50
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,3 @@
1-
import PropTypes from 'prop-types'
2-
import { motionPropTypes } from '@nivo/core'
3-
import { inheritedColorPropType } from '@nivo/colors'
4-
5-
const commonPropTypes = {
6-
nodes: PropTypes.arrayOf(
7-
PropTypes.shape({
8-
id: PropTypes.string.isRequired,
9-
})
10-
).isRequired,
11-
links: PropTypes.arrayOf(
12-
PropTypes.shape({
13-
source: PropTypes.string.isRequired,
14-
target: PropTypes.string.isRequired,
15-
})
16-
).isRequired,
17-
18-
layers: PropTypes.arrayOf(
19-
PropTypes.oneOfType([PropTypes.oneOf(['links', 'nodes']), PropTypes.func])
20-
).isRequired,
21-
22-
linkDistance: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.number])
23-
.isRequired,
24-
repulsivity: PropTypes.number.isRequired,
25-
distanceMin: PropTypes.number.isRequired,
26-
distanceMax: PropTypes.number.isRequired,
27-
iterations: PropTypes.number.isRequired,
28-
29-
nodeColor: PropTypes.oneOfType([PropTypes.string, PropTypes.func]).isRequired,
30-
nodeBorderWidth: PropTypes.oneOfType([PropTypes.number, PropTypes.func]).isRequired,
31-
nodeBorderColor: inheritedColorPropType.isRequired,
32-
33-
linkThickness: PropTypes.oneOfType([PropTypes.number, PropTypes.func]).isRequired,
34-
linkColor: inheritedColorPropType.isRequired,
35-
36-
isInteractive: PropTypes.bool.isRequired,
37-
onClick: PropTypes.func,
38-
}
39-
40-
export const NetworkPropTypes = {
41-
...commonPropTypes,
42-
role: PropTypes.string.isRequired,
43-
...motionPropTypes,
44-
}
45-
46-
export const NetworkCanvasPropTypes = {
47-
pixelRatio: PropTypes.number.isRequired,
48-
...commonPropTypes,
49-
}
50-
511
const commonDefaultProps = {
522
layers: ['links', 'nodes'],
533

‎packages/network/src/types.ts

+35
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,41 @@ export interface NetworkCustomLayerProps {
4343
}
4444
export type NetworkCustomLayer = FunctionComponent<NetworkCustomLayerProps>
4545

46+
/*
47+
nodes: PropTypes.arrayOf(
48+
PropTypes.shape({
49+
id: PropTypes.string.isRequired,
50+
})
51+
).isRequired,
52+
links: PropTypes.arrayOf(
53+
PropTypes.shape({
54+
source: PropTypes.string.isRequired,
55+
target: PropTypes.string.isRequired,
56+
})
57+
).isRequired,
58+
59+
layers: PropTypes.arrayOf(
60+
PropTypes.oneOfType([PropTypes.oneOf(['links', 'nodes']), PropTypes.func])
61+
).isRequired,
62+
63+
linkDistance: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.number])
64+
.isRequired,
65+
repulsivity: PropTypes.number.isRequired,
66+
distanceMin: PropTypes.number.isRequired,
67+
distanceMax: PropTypes.number.isRequired,
68+
iterations: PropTypes.number.isRequired,
69+
70+
nodeColor: PropTypes.oneOfType([PropTypes.string, PropTypes.func]).isRequired,
71+
nodeBorderWidth: PropTypes.oneOfType([PropTypes.number, PropTypes.func]).isRequired,
72+
nodeBorderColor: inheritedColorPropType.isRequired,
73+
74+
linkThickness: PropTypes.oneOfType([PropTypes.number, PropTypes.func]).isRequired,
75+
linkColor: inheritedColorPropType.isRequired,
76+
77+
isInteractive: PropTypes.bool.isRequired,
78+
onClick: PropTypes.func,
79+
*/
80+
4681
export interface NetworkCommonProps {
4782
margin: Box
4883

0 commit comments

Comments
 (0)
Please sign in to comment.