Skip to content

Commit

Permalink
set default props inside components
Browse files Browse the repository at this point in the history
  • Loading branch information
@andre19980 @plouc
andre19980 authored and plouc committed Jan 7, 2024
1 parent 0bc2fe8 commit d87af09
Show file tree
Hide file tree
Showing 9 changed files with 197 additions and 154 deletions.
12 changes: 8 additions & 4 deletions packages/core/src/components/defs/patterns/PatternDots.js
View file
Expand Up @@ -10,10 +10,14 @@ export const PatternDotsDefaultProps = {
}

export const PatternDots = memo(props => {
const { id, background, color, size, padding, stagger } = {
...PatternDotsDefaultProps,
...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
Expand Down
12 changes: 8 additions & 4 deletions packages/core/src/components/defs/patterns/PatternSquares.js
View file
Expand Up @@ -10,10 +10,14 @@ export const PatternSquaresDefaultProps = {
}

export const PatternSquares = memo(props => {
const { id, color, background, size, padding, stagger } = {
...PatternSquaresDefaultProps,
...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
Expand Down
2 changes: 1 addition & 1 deletion packages/core/src/motion/context.js
View file
Expand Up @@ -11,7 +11,7 @@ export const motionDefaultProps = {
}

export const MotionConfigProvider = props => {
const { children, animate, config } = { ...motionDefaultProps, ...props }
const { children, animate = true, config = 'default' } = props

const value = useMemo(() => {
const reactSpringConfig = isString(config) ? presets[config] : config
Expand Down
49 changes: 25 additions & 24 deletions packages/geo/src/Choropleth.js
View file
Expand Up @@ -10,10 +10,11 @@ import { memo, Fragment, useCallback } from 'react'
import { SvgWrapper, withContainer, useDimensions, useTheme, bindDefs } from '@nivo/core'
import { BoxLegendSvg } from '@nivo/legends'
import { useTooltip } from '@nivo/tooltip'
import { ChoroplethPropTypes, ChoroplethDefaultProps } from './props'
import { ChoroplethPropTypes } from './props'
import GeoGraticule from './GeoGraticule'
import GeoMapFeature from './GeoMapFeature'
import { useGeoMap, useChoropleth } from './hooks'
import ChoroplethTooltip from './ChoroplethTooltip'

const Choropleth = memo(props => {
const {
Expand All @@ -22,31 +23,31 @@ const Choropleth = memo(props => {
margin: partialMargin,
features,
data,
match,
label,
value,
match = 'id',
label = 'id',
value = 'value',
valueFormat,
projectionType,
projectionScale,
projectionTranslation,
projectionRotation,
colors,
projectionType = 'mercator',
projectionScale = 100,
projectionTranslation = [0.5, 0.5],
projectionRotation = [0, 0, 0],
colors = 'PuBuGn',
domain,
unknownColor,
borderWidth,
borderColor,
enableGraticule,
graticuleLineWidth,
graticuleLineColor,
layers,
legends,
isInteractive,
onClick,
tooltip: Tooltip,
role,
defs,
fill,
} = { ...ChoroplethDefaultProps, ...props }
unknownColor = '#999',
borderWidth = 0,
borderColor = '#000000',
enableGraticule = false,
graticuleLineWidth = 0.5,
graticuleLineColor = '#999999',
layers = ['graticule', 'features', 'legends'],
legends = [],
isInteractive = true,
onClick = () => {},
tooltip: Tooltip = ChoroplethTooltip,
role = 'img',
defs = [],
fill = [],
} = props

const { margin, outerWidth, outerHeight } = useDimensions(width, height, partialMargin)
const { graticule, path, getBorderWidth, getBorderColor } = useGeoMap({
Expand Down
47 changes: 24 additions & 23 deletions packages/geo/src/ChoroplethCanvas.js
View file
Expand Up @@ -11,8 +11,9 @@ import { geoContains } from 'd3-geo'
import { getRelativeCursor, withContainer, useDimensions, useTheme } from '@nivo/core'
import { renderLegendToCanvas } from '@nivo/legends'
import { useTooltip } from '@nivo/tooltip'
import { ChoroplethCanvasDefaultProps, ChoroplethCanvasPropTypes } from './props'
import { ChoroplethCanvasPropTypes } from './props'
import { useGeoMap, useChoropleth } from './hooks'
import ChoroplethTooltip from './ChoroplethTooltip'

const getFeatureFromMouseEvent = (event, el, features, projection) => {
const [x, y] = getRelativeCursor(el, event)
Expand All @@ -25,32 +26,32 @@ const ChoroplethCanvas = memo(props => {
width,
height,
margin: partialMargin,
pixelRatio,
pixelRatio = typeof window !== 'undefined' ? window.devicePixelRatio || 1 : 1,
features,
data,
match,
label,
value,
match = 'id',
label = 'id',
value = 'value',
valueFormat,
projectionType,
projectionScale,
projectionTranslation,
projectionRotation,
colors,
projectionType = 'mercator',
projectionScale = 100,
projectionTranslation = [0.5, 0.5],
projectionRotation = [0, 0, 0],
colors = 'PuBuGn',
domain,
unknownColor,
borderWidth,
borderColor,
enableGraticule,
graticuleLineWidth,
graticuleLineColor,
layers,
legends,
isInteractive,
onClick,
onMouseMove,
tooltip: Tooltip,
} = { ...ChoroplethCanvasDefaultProps, ...props }
unknownColor = '#999',
borderWidth = 0,
borderColor = '#000000',
enableGraticule = false,
graticuleLineWidth = 0.5,
graticuleLineColor = '#999999',
layers = ['graticule', 'features', 'legends'],
legends = [],
isInteractive = true,
onClick = () => {},
onMouseMove = () => {},
tooltip: Tooltip = ChoroplethTooltip,
} = props
const canvasEl = useRef(null)
const theme = useTheme()
const { margin, outerWidth, outerHeight } = useDimensions(width, height, partialMargin)
Expand Down
32 changes: 16 additions & 16 deletions packages/geo/src/GeoMap.js
View file
Expand Up @@ -9,7 +9,7 @@
import { Fragment, useCallback, memo } from 'react'
import { SvgWrapper, withContainer, useDimensions, useTheme } from '@nivo/core'
import { useTooltip } from '@nivo/tooltip'
import { GeoMapPropTypes, GeoMapDefaultProps } from './props'
import { GeoMapPropTypes } from './props'
import GeoGraticule from './GeoGraticule'
import GeoMapFeature from './GeoMapFeature'
import { useGeoMap } from './hooks'
Expand All @@ -20,22 +20,22 @@ const GeoMap = memo(props => {
height,
margin: partialMargin,
features,
layers,
projectionType,
projectionScale,
projectionTranslation,
projectionRotation,
fillColor,
borderWidth,
borderColor,
enableGraticule,
graticuleLineWidth,
graticuleLineColor,
isInteractive,
onClick,
layers = ['graticule', 'features'],
projectionType = 'mercator',
projectionScale = 100,
projectionTranslation = [0.5, 0.5],
projectionRotation = [0, 0, 0],
fillColor = '#dddddd',
borderWidth = 0,
borderColor = '#000000',
enableGraticule = false,
graticuleLineWidth = 0.5,
graticuleLineColor = '#999999',
isInteractive = true,
onClick = () => {},
tooltip: Tooltip,
role,
} = { ...GeoMapDefaultProps, ...props }
role = 'img',
} = props
const { margin, outerWidth, outerHeight } = useDimensions(width, height, partialMargin)
const { graticule, path, getFillColor, getBorderWidth, getBorderColor } = useGeoMap({
width,
Expand Down
32 changes: 16 additions & 16 deletions packages/geo/src/GeoMapCanvas.js
View file
Expand Up @@ -10,7 +10,7 @@ import { memo, useRef, useEffect, useCallback } from 'react'
import { geoContains } from 'd3-geo'
import { getRelativeCursor, withContainer, useDimensions, useTheme } from '@nivo/core'
import { useTooltip } from '@nivo/tooltip'
import { GeoMapCanvasDefaultProps, GeoMapCanvasPropTypes } from './props'
import { GeoMapCanvasPropTypes } from './props'
import { useGeoMap } from './hooks'

const getFeatureFromMouseEvent = (event, el, features, projection) => {
Expand All @@ -24,28 +24,28 @@ const GeoMapCanvas = memo(props => {
width,
height,
margin: partialMargin,
pixelRatio,
pixelRatio = typeof window !== 'undefined' ? window.devicePixelRatio || 1 : 1,
features,
layers,

projectionType,
projectionScale,
projectionTranslation,
projectionRotation,
projectionType = 'mercator',
projectionScale = 100,
projectionTranslation = [0.5, 0.5],
projectionRotation = [0, 0, 0],

fillColor,
borderWidth,
borderColor,
fillColor = '#dddddd',
borderWidth = 0,
borderColor = '#000000',

enableGraticule,
graticuleLineWidth,
graticuleLineColor,
enableGraticule = false,
graticuleLineWidth = 0.5,
graticuleLineColor = '#999999',

isInteractive,
onClick,
onMouseMove,
isInteractive = true,
onClick = () => {},
onMouseMove = () => {},
tooltip: Tooltip,
} = { ...GeoMapCanvasDefaultProps, ...props }
} = props

const canvasEl = useRef(null)
const theme = useTheme()
Expand Down

1 comment on commit d87af09

@vercel
Copy link

@vercel vercel bot commented on d87af09 Jan 7, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

nivo – ./

www.nivo.rocks
nivo.vercel.app
nivo-git-master-plouc.vercel.app
nivo-plouc.vercel.app
nivo.rocks

Please sign in to comment.