refactor default props to fix error message

packages/core/src/components/cartesian/markers/CartesianMarkersItem.js

@@ -171,10 +171,10 @@ const CartesianMarkersItem = ({
     lineStyle,
     textStyle,
     legend,
-    legendPosition,
-    legendOffsetX,
-    legendOffsetY,
-    legendOrientation,
+    legendPosition = 'top-right',
+    legendOffsetX = 14,
+    legendOffsetY = 14,
+    legendOrientation = 'horizontal',
 }) => {
     const theme = useTheme()
 
@@ -256,11 +256,5 @@ CartesianMarkersItem.propTypes = {
     legendOffsetY: PropTypes.number.isRequired,
     legendOrientation: PropTypes.oneOf(['horizontal', 'vertical']).isRequired,
 }
-CartesianMarkersItem.defaultProps = {
-    legendPosition: 'top-right',
-    legendOffsetX: 14,
-    legendOffsetY: 14,
-    legendOrientation: 'horizontal',
-}
 
 export default memo(CartesianMarkersItem)

packages/core/src/components/defs/patterns/PatternDots.js

@@ -1,7 +1,24 @@
 import { memo } from 'react'
 import PropTypes from 'prop-types'
 
-export const PatternDots = memo(({ id, background, color, size, padding, stagger }) => {
+export const PatternDotsDefaultProps = {
+    color: '#000000',
+    background: '#ffffff',
+    size: 4,
+    padding: 4,
+    stagger: false,
+}
+
+export const PatternDots = memo(props => {
+    const {
+        id,
+        background = PatternDotsDefaultProps.background,
+        color = PatternDotsDefaultProps.color,
+        size = PatternDotsDefaultProps.size,
+        padding = PatternDotsDefaultProps.padding,
+        stagger = PatternDotsDefaultProps.stagger,
+    } = props
+
     let fullSize = size + padding
     const radius = size / 2
     const halfPadding = padding / 2
@@ -35,14 +52,6 @@ PatternDots.propTypes = {
     stagger: PropTypes.bool.isRequired,
 }
 
-PatternDots.defaultProps = {
-    color: '#000000',
-    background: '#ffffff',
-    size: 4,
-    padding: 4,
-    stagger: false,
-}
-
 export const patternDotsDef = (id, options = {}) => ({
     id,
     type: 'patternDots',

packages/core/src/components/defs/patterns/PatternLines.js

@@ -2,8 +2,23 @@ import { memo } from 'react'
 import PropTypes from 'prop-types'
 import { degreesToRadians } from '../../../lib/polar'
 
+export const PatternLinesDefaultProps = {
+    spacing: 5,
+    rotation: 0,
+    background: '#000000',
+    color: '#ffffff',
+    lineWidth: 2,
+}
+
 export const PatternLines = memo(
-    ({ id, spacing: _spacing, rotation: _rotation, background, color, lineWidth }) => {
+    ({
+        id,
+        spacing: _spacing = PatternLinesDefaultProps.spacing,
+        rotation: _rotation = PatternLinesDefaultProps.rotation,
+        background = PatternLinesDefaultProps.background,
+        color = PatternLinesDefaultProps.color,
+        lineWidth = PatternLinesDefaultProps.lineWidth,
+    }) => {
         let rotation = Math.round(_rotation) % 360
         const spacing = Math.abs(_spacing)
 
@@ -69,13 +84,6 @@ PatternLines.propTypes = {
     color: PropTypes.string.isRequired,
     lineWidth: PropTypes.number.isRequired,
 }
-PatternLines.defaultProps = {
-    spacing: 5,
-    rotation: 0,
-    color: '#000000',
-    background: '#ffffff',
-    lineWidth: 2,
-}
 
 export const patternLinesDef = (id, options = {}) => ({
     id,

packages/core/src/components/defs/patterns/PatternSquares.js

@@ -1,7 +1,24 @@
 import { memo } from 'react'
 import PropTypes from 'prop-types'
 
-export const PatternSquares = memo(({ id, background, color, size, padding, stagger }) => {
+export const PatternSquaresDefaultProps = {
+    color: '#000000',
+    background: '#ffffff',
+    size: 4,
+    padding: 4,
+    stagger: false,
+}
+
+export const PatternSquares = memo(props => {
+    const {
+        id,
+        color = PatternSquaresDefaultProps.color,
+        background = PatternSquaresDefaultProps.background,
+        size = PatternSquaresDefaultProps.size,
+        padding = PatternSquaresDefaultProps.padding,
+        stagger = PatternSquaresDefaultProps.stagger,
+    } = props
+
     let fullSize = size + padding
     const halfPadding = padding / 2
     if (stagger === true) {
@@ -34,13 +51,6 @@ PatternSquares.propTypes = {
     padding: PropTypes.number.isRequired,
     stagger: PropTypes.bool.isRequired,
 }
-PatternSquares.defaultProps = {
-    color: '#000000',
-    background: '#ffffff',
-    size: 4,
-    padding: 4,
-    stagger: false,
-}
 
 export const patternSquaresDef = (id, options = {}) => ({
     id,

packages/core/src/motion/context.js

@@ -5,7 +5,14 @@ import { config as presets } from '@react-spring/web'
 
 export const motionConfigContext = createContext()
 
-export const MotionConfigProvider = ({ children, animate, config }) => {
+export const motionDefaultProps = {
+    animate: true,
+    config: 'default',
+}
+
+export const MotionConfigProvider = props => {
+    const { children, animate = true, config = 'default' } = props
+
     const value = useMemo(() => {
         const reactSpringConfig = isString(config) ? presets[config] : config
 
@@ -40,10 +47,3 @@ MotionConfigProvider.propTypes = {
     animate: motionPropTypes.animate,
     config: motionPropTypes.motionConfig,
 }
-
-export const motionDefaultProps = {
-    animate: true,
-    config: 'default',
-}
-
-MotionConfigProvider.defaultProps = motionDefaultProps

packages/funnel/src/props.tsx

@@ -1,5 +1,5 @@
 // @ts-ignore
-import { MotionConfigProvider } from '@nivo/core'
+import { motionDefaultProps } from '@nivo/core'
 import { FunnelLayerId } from './types'
 
 export const svgDefaultProps = {
@@ -34,6 +34,6 @@ export const svgDefaultProps = {
 
     role: 'img',
 
-    animate: MotionConfigProvider.defaultProps.animate,
-    motionConfig: MotionConfigProvider.defaultProps.config,
+    animate: motionDefaultProps.animate,
+    motionConfig: motionDefaultProps.config,
 }