Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Run pure-component Codemod #965

Merged
merged 3 commits into from
Oct 15, 2018
Merged

Run pure-component Codemod #965

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
9027fea
Run pure-component Codemod
benshope Sep 19, 2018
e995d10
fix lint errors
benshope Sep 19, 2018
f7a6584
fix merge conflict
benshope Oct 15, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 8 additions & 10 deletions showcase/app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,23 +19,21 @@
// THE SOFTWARE.

import ReactDOM from 'react-dom';
import React, {Component} from 'react';
import React from 'react';
import document from 'global/document';

import {BrowserRouter, Route} from 'react-router-dom';

import ShowcaseApp from './showcase-app';
import '../src/styles/examples.scss';

export default class App extends Component {
render() {
// using react-router to trigger react updates on url change
return (
<BrowserRouter>
<Route path="/" component={ShowcaseApp} />
</BrowserRouter>
);
}
export default function App(props) {
// using react-router to trigger react updates on url change
return (
<BrowserRouter>
<Route path="/" component={ShowcaseApp} />
</BrowserRouter>
);
}

const el = document.createElement('div');
Expand Down
62 changes: 30 additions & 32 deletions showcase/axes/custom-axes-orientation.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,36 +29,34 @@ import {
LineSeries
} from 'index';

export default class Example extends React.Component {
render() {
return (
<XYPlot
margin={{top: 40, right: 40, left: 10, bottom: 10}}
width={300}
height={300}
>
<HorizontalGridLines />
<VerticalGridLines />
<XAxis orientation="top" title="X Axis" />
<YAxis orientation="right" title="Y Axis" />
<LineSeries
data={[
{x: 1, y: 3, z: 10},
{x: 2, y: 4, z: 10},
{x: 3, y: 8, z: 10},
{x: 4, y: 11, z: 10}
]}
/>
<LineSeries data={null} />
<LineSeries
data={[
{x: 1, y: 3, z: 10},
{x: 2, y: 9, z: 10},
{x: 3, y: 2, z: 10},
{x: 4, y: 11, z: 10}
]}
/>
</XYPlot>
);
}
export default function Example(props) {
return (
<XYPlot
margin={{top: 40, right: 40, left: 10, bottom: 10}}
width={300}
height={300}
>
<HorizontalGridLines />
<VerticalGridLines />
<XAxis orientation="top" title="X Axis" />
<YAxis orientation="right" title="Y Axis" />
<LineSeries
data={[
{x: 1, y: 3, z: 10},
{x: 2, y: 4, z: 10},
{x: 3, y: 8, z: 10},
{x: 4, y: 11, z: 10}
]}
/>
<LineSeries data={null} />
<LineSeries
data={[
{x: 1, y: 3, z: 10},
{x: 2, y: 9, z: 10},
{x: 3, y: 2, z: 10},
{x: 4, y: 11, z: 10}
]}
/>
</XYPlot>
);
}
34 changes: 16 additions & 18 deletions showcase/axes/custom-axes.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
// THE SOFTWARE.

import React, {Component} from 'react';
import React from 'react';

import {XYPlot, XAxis, YAxis, MarkSeries} from 'index';

Expand All @@ -44,21 +44,19 @@ const WORDS = [
</tspan>
</tspan>
];
export default class Example extends Component {
render() {
return (
<XYPlot margin={MARGIN} width={300} height={300}>
<XAxis top={0} hideLine tickValues={[0, 1, 3, 4, 5]} title="X" />
<XAxis tickFormat={v => `Value is ${v}`} tickLabelAngle={-90} />
<YAxis hideTicks />
<YAxis left={50} tickFormat={v => v * v} />
<YAxis hideLine left={150} tickFormat={v => WORDS[v]} />
<MarkSeries
data={[{x: 0, y: 0}, {x: 5, y: 5}]}
opacity={0}
opacityType="linear"
/>
</XYPlot>
);
}
export default function Example(props) {
return (
<XYPlot margin={MARGIN} width={300} height={300}>
<XAxis top={0} hideLine tickValues={[0, 1, 3, 4, 5]} title="X" />
<XAxis tickFormat={v => `Value is ${v}`} tickLabelAngle={-90} />
<YAxis hideTicks />
<YAxis left={50} tickFormat={v => v * v} />
<YAxis hideLine left={150} tickFormat={v => WORDS[v]} />
<MarkSeries
data={[{x: 0, y: 0}, {x: 5, y: 5}]}
opacity={0}
opacityType="linear"
/>
</XYPlot>
);
}
56 changes: 27 additions & 29 deletions showcase/axes/custom-axis.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,34 +29,32 @@ import {
LineSeries
} from 'index';

export default class Example extends React.Component {
render() {
const axisStyle = {
ticks: {
fontSize: '14px',
color: '#333'
},
title: {
fontSize: '16px',
color: '#333'
}
};
export default function Example(props) {
const axisStyle = {
ticks: {
fontSize: '14px',
color: '#333'
},
title: {
fontSize: '16px',
color: '#333'
}
};

return (
<XYPlot width={300} height={300}>
<VerticalGridLines />
<HorizontalGridLines />
<XAxis
hideLine
title="X"
labelFormat={v => `Value is ${v}`}
labelValues={[2]}
tickValues={[1, 1.5, 2, 3]}
style={axisStyle}
/>
<YAxis hideTicks />
<LineSeries data={[{x: 1, y: 10}, {x: 2, y: 5}, {x: 3, y: 15}]} />
</XYPlot>
);
}
return (
<XYPlot width={300} height={300}>
<VerticalGridLines />
<HorizontalGridLines />
<XAxis
hideLine
title="X"
labelFormat={v => `Value is ${v}`}
labelValues={[2]}
tickValues={[1, 1.5, 2, 3]}
style={axisStyle}
/>
<YAxis hideTicks />
<LineSeries data={[{x: 1, y: 10}, {x: 2, y: 5}, {x: 3, y: 15}]} />
</XYPlot>
);
}
52 changes: 25 additions & 27 deletions showcase/axes/decorative-axes-criss-cross.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
// THE SOFTWARE.

import React, {Component} from 'react';
import React from 'react';

import {XYPlot, DecorativeAxis} from 'index';

Expand All @@ -29,30 +29,28 @@ const MARGIN = {
bottom: 30
};

export default class Example extends Component {
render() {
return (
<XYPlot
dontCheckIfEmpty
margin={MARGIN}
xDomain={[0, 1]}
yDomain={[0, 1]}
width={300}
height={300}
>
<DecorativeAxis
axisStart={{x: 0, y: 0}}
axisEnd={{x: 1, y: 1}}
axisDomain={[-10, 100]}
/>
<DecorativeAxis
axisStart={{x: 1, y: 0}}
axisEnd={{x: 0, y: 1}}
axisDomain={[1000, 900]}
tickSize={-10}
tickValue={t => `¡${t}!`}
/>
</XYPlot>
);
}
export default function Example(props) {
return (
<XYPlot
dontCheckIfEmpty
margin={MARGIN}
xDomain={[0, 1]}
yDomain={[0, 1]}
width={300}
height={300}
>
<DecorativeAxis
axisStart={{x: 0, y: 0}}
axisEnd={{x: 1, y: 1}}
axisDomain={[-10, 100]}
/>
<DecorativeAxis
axisStart={{x: 1, y: 0}}
axisEnd={{x: 0, y: 1}}
axisDomain={[1000, 900]}
tickSize={-10}
tickValue={t => `¡${t}!`}
/>
</XYPlot>
);
}
51 changes: 24 additions & 27 deletions showcase/axes/parallel-coordinates-example.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,33 +65,30 @@ const MARGIN = {
bottom: 10
};

// build a custom color scale
class ParallelCoordinatesExample extends React.Component {
render() {
return (
<XYPlot
width={500}
height={300}
xType="ordinal"
margin={MARGIN}
className="parallel-coordinates-example"
>
{mappedData.map((series, index) => {
return <LineSeries data={series} key={`series-${index}`} />;
})}
{mappedData[0].map((cell, index) => {
return (
<DecorativeAxis
key={`${index}-axis`}
axisStart={{x: cell.x, y: 0}}
axisEnd={{x: cell.x, y: 1}}
axisDomain={[domains[cell.x].min, domains[cell.x].max]}
/>
);
})}
</XYPlot>
);
}
function ParallelCoordinatesExample(props) {
return (
<XYPlot
width={500}
height={300}
xType="ordinal"
margin={MARGIN}
className="parallel-coordinates-example"
>
{mappedData.map((series, index) => {
return <LineSeries data={series} key={`series-${index}`} />;
})}
{mappedData[0].map((cell, index) => {
return (
<DecorativeAxis
key={`${index}-axis`}
axisStart={{x: cell.x, y: 0}}
axisEnd={{x: cell.x, y: 1}}
axisDomain={[domains[cell.x].min, domains[cell.x].max]}
/>
);
})}
</XYPlot>
);
}

export default ParallelCoordinatesExample;
26 changes: 12 additions & 14 deletions showcase/axes/static-crosshair.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,18 +30,16 @@ import {
Crosshair
} from 'index';

export default class Example extends React.Component {
render() {
return (
<XYPlot width={300} height={300}>
<VerticalGridLines />
<HorizontalGridLines />
<XAxis />
<YAxis />
<LineSeries data={[{x: 1, y: 10}, {x: 2, y: 7}, {x: 3, y: 15}]} />
<LineSeries data={[{x: 1, y: 20}, {x: 2, y: 5}, {x: 3, y: 15}]} />
<Crosshair values={[{x: 2, y: 5}, {x: 2, y: 7}]} />
</XYPlot>
);
}
export default function Example(props) {
return (
<XYPlot width={300} height={300}>
<VerticalGridLines />
<HorizontalGridLines />
<XAxis />
<YAxis />
<LineSeries data={[{x: 1, y: 10}, {x: 2, y: 7}, {x: 3, y: 15}]} />
<LineSeries data={[{x: 1, y: 20}, {x: 2, y: 5}, {x: 3, y: 15}]} />
<Crosshair values={[{x: 2, y: 5}, {x: 2, y: 7}]} />
</XYPlot>
);
}
Loading