diff --git a/packages/react-vis/jest.setup.js b/packages/react-vis/jest.setup.js index 8bcb667b9..8a54230ce 100644 --- a/packages/react-vis/jest.setup.js +++ b/packages/react-vis/jest.setup.js @@ -1,8 +1,8 @@ /*eslint-env node*/ import jsdom from 'jsdom'; import Enzyme from 'enzyme'; - import Adapter from 'enzyme-adapter-react-16'; + Enzyme.configure({adapter: new Adapter()}); global.document = jsdom.jsdom(''); @@ -16,3 +16,8 @@ Object.keys(document.defaultView).forEach(function mapProperties(property) { global.navigator = { userAgent: 'node.js' }; + +/* + * Canvas mocks + */ +HTMLCanvasElement.prototype.getContext = () => {}; diff --git a/packages/react-vis/src/animation.js b/packages/react-vis/src/animation.js index b556c0c62..5012b09d0 100644 --- a/packages/react-vis/src/animation.js +++ b/packages/react-vis/src/animation.js @@ -59,8 +59,7 @@ class Animation extends PureComponent { this._updateInterpolator(props); } - // eslint-disable-next-line react/no-deprecated - componentWillUpdate(props) { + UNSAFE_componentWillUpdate(props) { this._updateInterpolator(this.props, props); if (props.onStart) { props.onStart(); diff --git a/packages/react-vis/src/make-vis-flexible.js b/packages/react-vis/src/make-vis-flexible.js index 9c875abe7..c0d49f522 100644 --- a/packages/react-vis/src/make-vis-flexible.js +++ b/packages/react-vis/src/make-vis-flexible.js @@ -140,8 +140,7 @@ function makeFlexible(Component, isWidthFlexible, isHeightFlexible) { this.cancelSubscription = subscribeToDebouncedResize(this._onResize); } - // eslint-disable-next-line react/no-deprecated - componentWillReceiveProps() { + UNSAFE_componentWillReceiveProps() { this._onResize(); } diff --git a/packages/react-vis/src/plot/crosshair.js b/packages/react-vis/src/plot/crosshair.js index 3e5941a86..3f9c1e468 100644 --- a/packages/react-vis/src/plot/crosshair.js +++ b/packages/react-vis/src/plot/crosshair.js @@ -82,7 +82,8 @@ class Crosshair extends PureComponent { PropTypes.oneOfType([ PropTypes.number, PropTypes.string, - PropTypes.object + PropTypes.object, + PropTypes.bool ]) ), series: PropTypes.object, diff --git a/packages/react-vis/src/plot/series/arc-series.js b/packages/react-vis/src/plot/series/arc-series.js index 2b90c63ae..73be50d5b 100644 --- a/packages/react-vis/src/plot/series/arc-series.js +++ b/packages/react-vis/src/plot/series/arc-series.js @@ -74,7 +74,7 @@ class ArcSeries extends AbstractSeries { this.state = {scaleProps}; } - componentWillReceiveProps(nextProps) { + UNSAFE_componentWillReceiveProps(nextProps) { this.setState({scaleProps: this._getAllScaleProps(nextProps)}); } diff --git a/packages/react-vis/src/plot/xy-plot.js b/packages/react-vis/src/plot/xy-plot.js index ccb503c5a..06a668956 100644 --- a/packages/react-vis/src/plot/xy-plot.js +++ b/packages/react-vis/src/plot/xy-plot.js @@ -144,8 +144,7 @@ class XYPlot extends React.Component { }; } - // eslint-disable-next-line react/no-deprecated - componentWillReceiveProps(nextProps) { + UNSAFE_componentWillReceiveProps(nextProps) { const children = getSeriesChildren(nextProps.children); const nextData = getStackedData(children, nextProps.stackBy); const {scaleMixins} = this.state; diff --git a/packages/react-vis/src/treemap/index.js b/packages/react-vis/src/treemap/index.js index 2badb12d4..b38f9e7e4 100644 --- a/packages/react-vis/src/treemap/index.js +++ b/packages/react-vis/src/treemap/index.js @@ -100,8 +100,7 @@ class Treemap extends React.Component { }; } - // eslint-disable-next-line react/no-deprecated - componentWillReceiveProps(props) { + UNSAFE_componentWillReceiveProps(props) { this.setState({ scales: _getScaleFns(props), ...getInnerDimensions(props, props.margin) diff --git a/packages/react-vis/tests/components/arc-series.test.js b/packages/react-vis/tests/components/arc-series.test.js index 26cbc3c0b..bd179d73e 100644 --- a/packages/react-vis/tests/components/arc-series.test.js +++ b/packages/react-vis/tests/components/arc-series.test.js @@ -4,11 +4,15 @@ import ArcSeries from 'plot/series/arc-series'; import {testRenderWithProps, GENERIC_XYPLOT_SERIES_PROPS} from '../test-utils'; import ArcSeriesExample from '../../../showcase/radial-chart/arc-series-example'; -testRenderWithProps(ArcSeries, GENERIC_XYPLOT_SERIES_PROPS); +testRenderWithProps(ArcSeries, GENERIC_XYPLOT_SERIES_PROPS, true); describe('ArcSeries', () => { test('Showcase Example - ArcSeriesExample', () => { - const $ = mount(); + const $ = mount( + + + + ); expect($.text()).toBe('UPDATE-4-2024-4-2024'); // multiplied by two to account for shadow listeners expect($.find('.rv-xy-plot__series--arc').length).toBe(4); diff --git a/packages/react-vis/tests/components/area-series.test.js b/packages/react-vis/tests/components/area-series.test.js index 993d488e3..db268db8e 100644 --- a/packages/react-vis/tests/components/area-series.test.js +++ b/packages/react-vis/tests/components/area-series.test.js @@ -7,7 +7,7 @@ import {testRenderWithProps, GENERIC_XYPLOT_SERIES_PROPS} from '../test-utils'; import AreaChartElevated from '../../../showcase/plot/area-chart-elevated'; import AreaChart from '../../../showcase/plot/area-chart'; -testRenderWithProps(AreaSeries, GENERIC_XYPLOT_SERIES_PROPS); +testRenderWithProps(AreaSeries, GENERIC_XYPLOT_SERIES_PROPS, true); const AREA_PROPS = { className: 'area-chart-example', diff --git a/packages/react-vis/tests/components/axis-title.test.js b/packages/react-vis/tests/components/axis-title.test.js index 6b83119ec..9a107e8b3 100644 --- a/packages/react-vis/tests/components/axis-title.test.js +++ b/packages/react-vis/tests/components/axis-title.test.js @@ -16,7 +16,11 @@ describe('AxisTitle', () => { const props = Object.assign({}, baseProps, { orientation: BOTTOM }); - const $ = mount(); + const $ = mount( + + + + ); const innerGroupHtml = $.find('g > g').html(); expect(innerGroupHtml.includes('text-anchor: end')).toBeTruthy(); expect($.find('text').text()).toBe(baseProps.title); @@ -27,7 +31,11 @@ describe('AxisTitle', () => { orientation: TOP, position: 'start' }); - const $ = mount(); + const $ = mount( + + + + ); const innerGroupHtml = $.find('g > g').html(); expect(innerGroupHtml.includes('text-anchor: start')).toBeTruthy(); expect($.find('text').text()).toBe(baseProps.title); @@ -37,7 +45,11 @@ describe('AxisTitle', () => { const props = Object.assign({}, baseProps, { orientation: LEFT }); - const $ = mount(); + const $ = mount( + + + + ); const innerGroupHtml = $.find('g > g').html(); expect(innerGroupHtml.includes('text-anchor: end')).toBeTruthy(); expect($.find('text').text()).toBe(baseProps.title); @@ -48,7 +60,11 @@ describe('AxisTitle', () => { orientation: RIGHT, position: 'start' }); - const $ = mount(); + const $ = mount( + + + + ); const innerGroupHtml = $.find('g > g').html(); expect(innerGroupHtml.includes('text-anchor: start')).toBeTruthy(); expect($.find('text').text()).toBe(baseProps.title); diff --git a/packages/react-vis/tests/components/bar-series.test.js b/packages/react-vis/tests/components/bar-series.test.js index 319a51ce8..adecc0137 100644 --- a/packages/react-vis/tests/components/bar-series.test.js +++ b/packages/react-vis/tests/components/bar-series.test.js @@ -12,9 +12,9 @@ import ClusteredStackedVerticalBarChart from '../../../showcase/plot/clustered-s import DifferenceChart from '../../../showcase/plot/difference-chart'; describe('BarSeries', () => { - testRenderWithProps(HorizontalBarSeries, GENERIC_XYPLOT_SERIES_PROPS); + testRenderWithProps(HorizontalBarSeries, GENERIC_XYPLOT_SERIES_PROPS, true); - testRenderWithProps(VerticalBarSeries, GENERIC_XYPLOT_SERIES_PROPS); + testRenderWithProps(VerticalBarSeries, GENERIC_XYPLOT_SERIES_PROPS, true); test('Showcase Example - BarChart', () => { const $ = mount(); diff --git a/packages/react-vis/tests/components/borders.test.js b/packages/react-vis/tests/components/borders.test.js index 5572886af..5a2e9dc66 100644 --- a/packages/react-vis/tests/components/borders.test.js +++ b/packages/react-vis/tests/components/borders.test.js @@ -4,7 +4,19 @@ import Borders from 'plot/borders'; import {testRenderWithProps, GENERIC_XYPLOT_SERIES_PROPS} from '../test-utils'; import GradientExample from '../../../showcase/misc/gradient-example'; -testRenderWithProps(Borders, GENERIC_XYPLOT_SERIES_PROPS); +testRenderWithProps( + Borders, + { + ...GENERIC_XYPLOT_SERIES_PROPS, + marginLeft: 0, + marginRight: 0, + innerWidth: 100, + marginTop: 0, + marginBottom: 0, + innerHeight: 100 + }, + true +); describe('Borders', () => { test('GradientExample', () => { diff --git a/packages/react-vis/tests/components/circular-grid-lines.test.js b/packages/react-vis/tests/components/circular-grid-lines.test.js index 7af6c1af2..2b304619d 100644 --- a/packages/react-vis/tests/components/circular-grid-lines.test.js +++ b/packages/react-vis/tests/components/circular-grid-lines.test.js @@ -5,7 +5,7 @@ import {testRenderWithProps, GENERIC_XYPLOT_SERIES_PROPS} from '../test-utils'; import FauxRadialScatterplot from '../../../showcase/plot/faux-radial-scatterplot'; describe('CircularGridLines', () => { - testRenderWithProps(CircularGridLines, GENERIC_XYPLOT_SERIES_PROPS); + testRenderWithProps(CircularGridLines, GENERIC_XYPLOT_SERIES_PROPS, true); test('Showcase Example - FauxRadialScatterplot', () => { const $ = mount(); diff --git a/packages/react-vis/tests/components/custom-svg-series.test.js b/packages/react-vis/tests/components/custom-svg-series.test.js index 92cb61edc..d163ca696 100644 --- a/packages/react-vis/tests/components/custom-svg-series.test.js +++ b/packages/react-vis/tests/components/custom-svg-series.test.js @@ -6,9 +6,9 @@ import CustomSVGExample from '../../../showcase/plot/custom-svg-example'; import CustomSVGAllTheMarks from '../../../showcase/plot/custom-svg-all-the-marks'; import CustomSVGRootLevelComponent from '../../../showcase/plot/custom-svg-root-level'; -testRenderWithProps(CustomSVGSeries, GENERIC_XYPLOT_SERIES_PROPS); - describe('CustomSVGSeries', () => { + testRenderWithProps(CustomSVGSeries, GENERIC_XYPLOT_SERIES_PROPS); + test('Showcase Example - CustomSVGExample', () => { const $ = mount(); expect($.text()).toBe('1.01.52.02.53.068101214x: 187.5y: 200'); diff --git a/packages/react-vis/tests/components/decorative-axis.test.js b/packages/react-vis/tests/components/decorative-axis.test.js index 6ae3d2f89..8898cdd02 100644 --- a/packages/react-vis/tests/components/decorative-axis.test.js +++ b/packages/react-vis/tests/components/decorative-axis.test.js @@ -5,12 +5,16 @@ import {testRenderWithProps, GENERIC_XYPLOT_SERIES_PROPS} from '../test-utils'; import DecorativeAxisCrissCross from '../../../showcase/axes/decorative-axes-criss-cross'; import ParallelCoordinatesExample from '../../../showcase/axes/parallel-coordinates-example'; -testRenderWithProps(DecorativeAxis, { - ...GENERIC_XYPLOT_SERIES_PROPS, - axisStart: {x: 0, y: 1}, - axisEnd: {x: 0, y: 1}, - axisDomain: [0, 1] -}); +testRenderWithProps( + DecorativeAxis, + { + ...GENERIC_XYPLOT_SERIES_PROPS, + axisStart: {x: 0, y: 1}, + axisEnd: {x: 0, y: 1}, + axisDomain: [0, 1] + }, + true +); describe('DecorativeAxis', () => { test('Showcase Example - DecorativeAxisCrissCross', () => { diff --git a/packages/react-vis/tests/components/gradient.test.js b/packages/react-vis/tests/components/gradient.test.js index ed31778ef..be3c3ab8f 100644 --- a/packages/react-vis/tests/components/gradient.test.js +++ b/packages/react-vis/tests/components/gradient.test.js @@ -6,7 +6,7 @@ import TriangleExample from '../../../showcase/misc/triangle-example'; import GradientExample from '../../../showcase/misc/gradient-example'; describe('GradientDefs', () => { - testRenderWithProps(GradientDefs, GENERIC_XYPLOT_SERIES_PROPS); + testRenderWithProps(GradientDefs, GENERIC_XYPLOT_SERIES_PROPS, true); test('TriangleExample', () => { const $ = mount(); diff --git a/packages/react-vis/tests/components/heatmap.test.js b/packages/react-vis/tests/components/heatmap.test.js index 72109a0af..d1018b131 100644 --- a/packages/react-vis/tests/components/heatmap.test.js +++ b/packages/react-vis/tests/components/heatmap.test.js @@ -25,7 +25,7 @@ const HEATMAP_PROPS = { }; describe('Heatmap', () => { - testRenderWithProps(HeatmapSeries, GENERIC_XYPLOT_SERIES_PROPS); + testRenderWithProps(HeatmapSeries, GENERIC_XYPLOT_SERIES_PROPS, true); test('basic rendering', () => { const $ = mount( diff --git a/packages/react-vis/tests/components/hexbin-series.test.js b/packages/react-vis/tests/components/hexbin-series.test.js index 61f855a01..2cfe47e0d 100644 --- a/packages/react-vis/tests/components/hexbin-series.test.js +++ b/packages/react-vis/tests/components/hexbin-series.test.js @@ -6,7 +6,7 @@ import HexHeatmap from '../../../showcase/plot/hex-heatmap'; import HexbinSizeExample from '../../../showcase/plot/hexbin-size-example'; describe('HexbinSeries', () => { - testRenderWithProps(HexbinSeries, GENERIC_XYPLOT_SERIES_PROPS); + testRenderWithProps(HexbinSeries, GENERIC_XYPLOT_SERIES_PROPS, true); test('Showcase Example - HexHeatmap', () => { const $ = mount(); diff --git a/packages/react-vis/tests/components/highlight.test.js b/packages/react-vis/tests/components/highlight.test.js index a9f589203..766af02e0 100644 --- a/packages/react-vis/tests/components/highlight.test.js +++ b/packages/react-vis/tests/components/highlight.test.js @@ -9,7 +9,19 @@ import BidirectionDragChart from '../../../showcase/misc/2d-dragable-plot'; import {testRenderWithProps, GENERIC_XYPLOT_SERIES_PROPS} from '../test-utils'; describe('Highlight', () => { - testRenderWithProps(Highlight, GENERIC_XYPLOT_SERIES_PROPS); + testRenderWithProps( + Highlight, + { + ...GENERIC_XYPLOT_SERIES_PROPS, + marginLeft: 0, + marginRight: 0, + innerWidth: 100, + marginTop: 0, + marginBottom: 0, + innerHeight: 100 + }, + true + ); test('DragableExample', () => { const $ = mount(); diff --git a/packages/react-vis/tests/components/label-series.test.js b/packages/react-vis/tests/components/label-series.test.js index 055190965..b9b7e150c 100644 --- a/packages/react-vis/tests/components/label-series.test.js +++ b/packages/react-vis/tests/components/label-series.test.js @@ -5,11 +5,15 @@ import {testRenderWithProps, GENERIC_XYPLOT_SERIES_PROPS} from '../test-utils'; import LabelSeriesExample from '../../../showcase/misc/label-series-example'; import LabeledStackedVerticalBarChart from '../../../showcase/plot/labeled-stacked-vertical-bar-chart'; -testRenderWithProps(LabelSeries, GENERIC_XYPLOT_SERIES_PROPS); +testRenderWithProps(LabelSeries, GENERIC_XYPLOT_SERIES_PROPS, true); describe('LabelSeries', () => { test('Showcase Example - LabelSeriesExample', () => { - const $ = mount(); + const $ = mount( + + + + ); expect($.text()).toBe( 'UPDATE-101234505101520WigglytuffPsyduckGeodudeDittoSnorlax' ); @@ -26,7 +30,11 @@ describe('LabelSeries', () => { }); test('Showcase Example - LabeledStackedVerticalBarChart', () => { - const $ = mount(); + const $ = mount( + + + + ); expect($.find('.rv-xy-plot__series--label text').length).toBe(9); }); }); diff --git a/packages/react-vis/tests/components/line-series-canvas.test.js b/packages/react-vis/tests/components/line-series-canvas.test.js index feef794e3..a05fafbc9 100644 --- a/packages/react-vis/tests/components/line-series-canvas.test.js +++ b/packages/react-vis/tests/components/line-series-canvas.test.js @@ -11,8 +11,9 @@ describe('LineSeriesCanvas', () => { {Array(k) .fill(0) - .map(() => ( + .map((_, index) => ( { {[...Array(k).keys()].map(v => ( { - testRenderWithProps(MarkSeries, GENERIC_XYPLOT_SERIES_PROPS); + testRenderWithProps(MarkSeries, GENERIC_XYPLOT_SERIES_PROPS, true); test('MShowcase Example - Scatterplot', () => { const $ = mount(); diff --git a/packages/react-vis/tests/components/polygon-series.test.js b/packages/react-vis/tests/components/polygon-series.test.js index c751b9352..ba4d07d71 100644 --- a/packages/react-vis/tests/components/polygon-series.test.js +++ b/packages/react-vis/tests/components/polygon-series.test.js @@ -5,7 +5,7 @@ import {testRenderWithProps, GENERIC_XYPLOT_SERIES_PROPS} from '../test-utils'; import TriangleExample from '../../../showcase/misc/triangle-example'; describe('PolygonSeries', () => { - testRenderWithProps(PolygonSeries, GENERIC_XYPLOT_SERIES_PROPS); + testRenderWithProps(PolygonSeries, GENERIC_XYPLOT_SERIES_PROPS, true); test('Showcase Example - Triangle Example', () => { const $ = mount(); diff --git a/packages/react-vis/tests/components/rect-series.test.js b/packages/react-vis/tests/components/rect-series.test.js index e105d9a1f..43b534545 100644 --- a/packages/react-vis/tests/components/rect-series.test.js +++ b/packages/react-vis/tests/components/rect-series.test.js @@ -7,9 +7,9 @@ import Histogram from '../../../showcase/plot/histogram'; import StackedHistogram from '../../../showcase/plot/stacked-histogram'; describe('RectSeries', () => { - testRenderWithProps(HorizontalRectSeries, GENERIC_XYPLOT_SERIES_PROPS); + testRenderWithProps(HorizontalRectSeries, GENERIC_XYPLOT_SERIES_PROPS, true); - testRenderWithProps(VerticalRectSeries, GENERIC_XYPLOT_SERIES_PROPS); + testRenderWithProps(VerticalRectSeries, GENERIC_XYPLOT_SERIES_PROPS, true); test('Showcase Example - StackedHistogram', () => { const $ = mount(); diff --git a/packages/react-vis/tests/components/sankey.test.js b/packages/react-vis/tests/components/sankey.test.js index a5ee1055f..8084b4105 100644 --- a/packages/react-vis/tests/components/sankey.test.js +++ b/packages/react-vis/tests/components/sankey.test.js @@ -13,7 +13,8 @@ const SANKEY_PROPS = { nodes: [], links: [], width: 200, - height: 200 + height: 200, + strokeWidth: 1 }; import {testRenderWithProps} from '../test-utils'; @@ -27,8 +28,8 @@ describe('Sankey', () => { ); @@ -42,8 +43,8 @@ describe('Sankey', () => { diff --git a/packages/react-vis/tests/components/whisker-series.test.js b/packages/react-vis/tests/components/whisker-series.test.js index 0a15564b8..cec326f5d 100644 --- a/packages/react-vis/tests/components/whisker-series.test.js +++ b/packages/react-vis/tests/components/whisker-series.test.js @@ -4,11 +4,15 @@ import WhiskerSeries from 'plot/series/whisker-series'; import {testRenderWithProps, GENERIC_XYPLOT_SERIES_PROPS} from '../test-utils'; import WhiskerChart from '../../../showcase/plot/whisker-chart'; -testRenderWithProps(WhiskerSeries, GENERIC_XYPLOT_SERIES_PROPS); +testRenderWithProps(WhiskerSeries, GENERIC_XYPLOT_SERIES_PROPS, true); describe('WhiskerSeries', () => { test('Showcase Example - Whisker Scatterplot', () => { - const $ = mount(); + const $ = mount( + + + + ); expect($.text()).toBe('1.01.52.02.53.068101214'); expect($.find('g.whisker-series-example').length).toBe(1); // 8 lines each per 5 (double) whiskers diff --git a/packages/react-vis/tests/components/xy-plot.test.js b/packages/react-vis/tests/components/xy-plot.test.js index 5e6ee3c83..f045016fe 100644 --- a/packages/react-vis/tests/components/xy-plot.test.js +++ b/packages/react-vis/tests/components/xy-plot.test.js @@ -36,7 +36,7 @@ import {testRenderWithProps} from '../test-utils'; const XYPLOT_PROPS = {width: 10, height: 10}; -testRenderWithProps(XYPlot, XYPLOT_PROPS); +testRenderWithProps(XYPlot, XYPLOT_PROPS, false); describe('XYPlot', () => { test('Render a stacked bar chart', () => { diff --git a/packages/react-vis/tests/test-utils.js b/packages/react-vis/tests/test-utils.js index 79076bf9e..ac589a26e 100644 --- a/packages/react-vis/tests/test-utils.js +++ b/packages/react-vis/tests/test-utils.js @@ -33,14 +33,24 @@ export const GENERIC_XYPLOT_SERIES_PROPS = { onValueRightClick: NOOP }; -export const testRenderWithProps = (Component, props) => +export const testRenderWithProps = (Component, props, wrapWithSvg = false) => // eslint-disable-next-line jest/require-top-level-describe test(`Rendering ${Component.displayName}`, () => { - const wrapper = mount(); - const wrapperProps = wrapper.props(); - expect(wrapper.find(Component).length).toBeTruthy(); + const wrapper = mount( + wrapWithSvg ? ( + + + + ) : ( + + ) + ); + const component = wrapper.find(Component); + expect(component).toHaveLength(1); + + const componentProps = component.props(); Object.keys(props).forEach(propName => { - expect(wrapperProps[propName] === props[propName]).toBeTruthy(); + expect(componentProps[propName]).toEqual(props[propName]); }); }); diff --git a/packages/react-vis/tests/utils/series-utils.test.js b/packages/react-vis/tests/utils/series-utils.test.js index ede450c40..3977e90f5 100644 --- a/packages/react-vis/tests/utils/series-utils.test.js +++ b/packages/react-vis/tests/utils/series-utils.test.js @@ -53,14 +53,14 @@ describe('series-utils', () => { test('getSeriesChildren', () => { const children = [ - This squid is heavy , - , + This squid is heavy , + , ]; const $ = mount( -
+ {children} -
+ ); const expectedChildren = [{...children[2], key: '.$woah'}]; expect(getSeriesChildren($.props().children)).toEqual(expectedChildren); diff --git a/packages/showcase/plot/custom-svg-example.js b/packages/showcase/plot/custom-svg-example.js index 575c7c8bd..3ba92a565 100644 --- a/packages/showcase/plot/custom-svg-example.js +++ b/packages/showcase/plot/custom-svg-example.js @@ -31,7 +31,7 @@ import { export default function Example() { return ( - d.value}> + @@ -40,12 +40,19 @@ export default function Example() { className="custom-marking" customComponent="square" data={[ - {x: 1, value: 10, customComponent: 'circle', size: 10}, - {x: 1.7, value: 12, size: 20, style: {stroke: 'red', fill: 'orange'}}, - {x: 2, value: 5}, - {x: 3, value: 15}, + {x: 1, y: 10, value: 10, customComponent: 'circle', size: 10}, + { + x: 1.7, + y: 12, + value: 12, + size: 20, + style: {stroke: 'red', fill: 'orange'} + }, + {x: 2, y: 5, value: 5}, + {x: 3, y: 15, value: 15}, { x: 2.5, + y: 7, value: 7, // eslint-disable-next-line react/display-name customComponent: (_, positionInPixels) => { diff --git a/packages/showcase/showcase-components/showcase-button.js b/packages/showcase/showcase-components/showcase-button.js index 957ca7979..4142567e2 100644 --- a/packages/showcase/showcase-components/showcase-button.js +++ b/packages/showcase/showcase-components/showcase-button.js @@ -30,7 +30,7 @@ function ShowcaseButton(props) { ); } -ShowcaseButton.PropTypes = { +ShowcaseButton.propTypes = { buttonContent: PropTypes.string.isRequired, onClick: PropTypes.func.isRequired }; diff --git a/packages/showcase/showcase-components/showcase-dropdown.js b/packages/showcase/showcase-components/showcase-dropdown.js index 4af144e0d..e0de439b0 100644 --- a/packages/showcase/showcase-components/showcase-dropdown.js +++ b/packages/showcase/showcase-components/showcase-dropdown.js @@ -50,7 +50,7 @@ class ShowcaseDropdown extends React.Component { } } -ShowcaseDropdown.PropTypes = { +ShowcaseDropdown.propTypes = { items: PropTypes.arrayOf(PropTypes.component) };