Skip to content

Commit f9db72c

Browse files
usulprousulpro
committed
lintfix
1 parent 3716ec5 commit f9db72c

File tree

4 files changed

+79
-85
lines changed

4 files changed

+79
-85
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "react-material-color-picker",
3-
"version": "0.9.3",
3+
"version": "1.0.0",
44
"description": "React Material Color Picker Component",
55
"repository": {
66
"type": "git",

‎src/MaterialColorPicker.jsx

Lines changed: 24 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ export default class MaterialColorPicker extends React.Component {
7676
},
7777
persist() {
7878
e.persist();
79-
}
79+
},
8080
};
8181
this.props.onSubmit(event);
8282
};
@@ -101,12 +101,10 @@ export default class MaterialColorPicker extends React.Component {
101101
},
102102
persist() {
103103
e.persist();
104-
}
104+
},
105105
};
106-
this.props.onReset(event)
106+
this.props.onReset(event);
107107
});
108-
109-
110108
};
111109
}
112110

@@ -142,8 +140,8 @@ export default class MaterialColorPicker extends React.Component {
142140

143141
submitHover(flag) {
144142
return () => {
145-
this.setState({hoveredSubmit: flag})
146-
}
143+
this.setState({ hoveredSubmit: flag });
144+
};
147145
}
148146

149147
colorNameList(colObj) {
@@ -481,10 +479,12 @@ export default class MaterialColorPicker extends React.Component {
481479
>
482480
{this.state.hoveredSubmit ?
483481
<img
484-
src={
485-
this.bwColorByName(this.fullNameString()) === 'black' ? imageDoneBlk : imageDoneWht}
486-
style={{opacity: 0.4}}
487-
/> : null
482+
src={
483+
this.bwColorByName(this.fullNameString()) === 'black' ?
484+
imageDoneBlk : imageDoneWht}
485+
style={{ opacity: 0.4 }}
486+
alt="submit"
487+
/> : null
488488
}
489489

490490
</div>
@@ -518,26 +518,27 @@ export default class MaterialColorPicker extends React.Component {
518518
}}
519519
>
520520
<div style={{
521-
width: 'auto',
521+
width: 'auto',
522522
// display: 'flex',
523523
// flexWrap: 'wrap',
524-
}}>
524+
}}
525+
>
525526
<b><nobr>{ _colors[this.fullNameString()] }</nobr></b>
526527
</div>
527528
<div
528-
style={{
529-
display: 'flex',
530-
flexWrap: 'wrap',
531-
justifyContent: 'flex-end',
532-
fontSize: 'larger',
533-
}}
529+
style={{
530+
display: 'flex',
531+
flexWrap: 'wrap',
532+
justifyContent: 'flex-end',
533+
fontSize: 'larger',
534+
}}
534535
>
535536
<div
536537
className="material-color-picker-reset"
537538
title={`reset to ${this.props.initColor}`}
538539
style={{
539-
cursor: 'pointer',
540-
paddingLeft: 16,
540+
cursor: 'pointer',
541+
paddingLeft: 16,
541542
}}
542543
onClick={this.onReset()}
543544
onMouseOver={this.resetHover}
@@ -549,8 +550,8 @@ export default class MaterialColorPicker extends React.Component {
549550
className="material-color-picker-submit"
550551
title={`submit ${this.fullNameString()} color`}
551552
style={{
552-
cursor: 'pointer',
553-
paddingLeft: 16,
553+
cursor: 'pointer',
554+
paddingLeft: 16,
554555
}}
555556
onClick={this.onSubmit()}
556557
onMouseOver={this.submitHover(true)}

‎src/stories/index.js

Lines changed: 46 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react';
2-
import { storiesOf, action, setAddon, addDecorator } from '@kadira/storybook';
2+
import { storiesOf, action, setAddon } from '@kadira/storybook';
33
import infoAddon from '@kadira/react-storybook-addon-info';
4-
import { withKnobs, text, boolean, number, object } from '@kadira/storybook-addon-knobs';
4+
import { withKnobs, text, object } from '@kadira/storybook-addon-knobs';
55

66
// import MaterialColorPicker from 'react-material-color-picker';
77
import MaterialColorPicker from '../MaterialColorPicker.jsx';
@@ -10,8 +10,16 @@ import MaterialColorPicker from '../MaterialColorPicker.jsx';
1010
setAddon(infoAddon);
1111

1212

13-
storiesOf('Material Color Picker', module)
13+
function actionLog(title) {
14+
return (event) => {
15+
const data = { ...event };
16+
data.target.node = 'console.log(event.target.node)';
1417

18+
action(`${title || ''}${data.type}: ${data.target.value}`.trim())(data);
19+
};
20+
}
21+
22+
storiesOf('Material Color Picker', module)
1523
.addDecorator((story) => (
1624
<div
1725
style={{
@@ -29,29 +37,29 @@ storiesOf('Material Color Picker', module)
2937
.addDecorator(withKnobs)
3038
.add('default view', () => (
3139

32-
<div style={{width: 400, backgroundColor: '#c7c7c7'}} >
40+
<div style={{ width: 400, backgroundColor: '#c7c7c7' }} >
3341
<MaterialColorPicker
34-
initColor="#3f51b5"
35-
onSubmit={actionLog()}
36-
onReset={actionLog()}
42+
initColor="#3f51b5"
43+
onSubmit={actionLog()}
44+
onReset={actionLog()}
3745
/>
3846
</div>
3947

4048
))
4149
.add('fullwidth view', () => (
4250

43-
<div style={{width: '70%'}} >
51+
<div style={{ width: '70%' }} >
4452
<MaterialColorPicker
45-
initColor="#9ccc65"
46-
onSubmit={actionLog()}
47-
onReset={actionLog()}
48-
style={{backgroundColor: '#c7c7c7'}}
53+
initColor="#9ccc65"
54+
onSubmit={actionLog()}
55+
onReset={actionLog()}
56+
style={{ backgroundColor: '#c7c7c7' }}
4957
/>
5058
</div>
5159

5260
))
5361
// storiesOf('Material Color Picker', module)
54-
.addWithInfo('API',`
62+
.addWithInfo('API', `
5563
[![GitHub version](https://badge.fury.io/gh/sm-react%2Freact-material-color-picker.svg)](https://badge.fury.io/gh/sm-react%2Freact-material-color-picker)
5664
[![npm version](https://badge.fury.io/js/react-material-color-picker.svg)](https://badge.fury.io/js/react-material-color-picker)
5765
@@ -62,7 +70,8 @@ storiesOf('Material Color Picker', module)
6270
6371
**submitLabel** and **resetLabel** are titles of the appropriate buttons
6472
65-
**onSubmit** and **onReset** are callbacks wich will be invoked by clicking the appropriate buttons. It will recieve an argument with the following structure:
73+
**onSubmit** and **onReset** are callbacks wich will be invoked by clicking the
74+
appropriate buttons. It will recieve an argument with the following structure:
6675
~~~js
6776
event = {
6877
type, // 'submit' || 'reset',
@@ -79,18 +88,18 @@ event = {
7988
8089
[![@UsulPro](https://img.shields.io/badge/github-UsulPro-blue.svg)](https://github.com/UsulPro)
8190
[![@sm-react](https://img.shields.io/badge/github-smARTLight-red.svg)](https://github.com/sm-react)
82-
` , () => (
83-
<div style={{width: 600}} >
91+
`, () => (
92+
<div style={{ width: 600 }} >
8493
<MaterialColorPicker
85-
initColor="rgba(0, 0, 0, 0.26)"
86-
onSubmit={actionLog()}
87-
onReset={actionLog()}
88-
style={{width: 400, backgroundColor: '#c7c7c7'}}
89-
submitLabel='Apply'
90-
resetLabel='Undo'
91-
/>
94+
initColor="rgba(0, 0, 0, 0.26)"
95+
onSubmit={actionLog()}
96+
onReset={actionLog()}
97+
style={{ width: 400, backgroundColor: '#c7c7c7' }}
98+
submitLabel="Apply"
99+
resetLabel="Undo"
100+
/>
92101
</div>
93-
), {inline: true, source: false})
102+
), { inline: true, source: false })
94103
.addWithInfo('try props',
95104
`
96105
->
@@ -99,29 +108,18 @@ event = {
99108
#### select the \`KNOBS\` tab to get access for props
100109
`,
101110
() => {
102-
const style={
103-
width: 400,
104-
backgroundColor: '#c7c7c7',
105-
}
106-
return (<div >
111+
const style = {
112+
width: 400,
113+
backgroundColor: '#c7c7c7',
114+
};
115+
return (<div >
107116
<MaterialColorPicker
108-
initColor={text('initColor', '#ec407a')}
109-
onSubmit={actionLog()}
110-
onReset={actionLog()}
111-
submitLabel={text('submitLabel', 'OK')}
112-
resetLabel={text('resetLabel', 'Cansel')}
113-
style={object('style', style)}
117+
initColor={text('initColor', '#ec407a')}
118+
onSubmit={actionLog()}
119+
onReset={actionLog()}
120+
submitLabel={text('submitLabel', 'OK')}
121+
resetLabel={text('resetLabel', 'Cansel')}
122+
style={object('style', style)}
114123
/>
115-
</div>)
116-
117-
}, {inline: true, source: false, header: false});
118-
119-
120-
function actionLog(title) {
121-
return (event) => {
122-
const data = {...event};
123-
data.target.node = 'console.log(event.target.node)';
124-
125-
action(`${title || ''}${data.type}: ${data.target.value}`.trim())(data);
126-
}
127-
}
124+
</div>);
125+
}, { inline: true, source: false, header: false });

‎src/tests/index.js

Lines changed: 8 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,29 +7,26 @@ const { describe, it } = global;
77

88
describe('### <MaterialColorPicker /> ###\n\n', () => {
99
it('should show 20 tone swatches', () => {
10-
const text = 'The Text';
1110
const wrapper = shallow(<MaterialColorPicker />);
1211
const tonewrap = wrapper.find('.material-color-picker-tone-swatches');
1312
expect(tonewrap.children()).to.have.length(20);
1413
});
1514

1615
it('should show right color name /* deepOrange800 */', () => {
17-
const text = 'The Text';
18-
const wrapper = shallow(<MaterialColorPicker initColor="#d84315"/>);
16+
const wrapper = shallow(<MaterialColorPicker initColor="#d84315" />);
1917
const titlewrap = wrapper.find('.material-color-picker-title');
2018
expect(titlewrap.childAt(0).text()).to.be.equal('deepOrange800');
2119
});
2220

2321
it('should show right color name /* darkBlack */', () => {
24-
const text = 'The Text';
25-
const wrapper = shallow(<MaterialColorPicker initColor="rgba(0, 0, 0, 0.87)"/>);
22+
const wrapper = shallow(<MaterialColorPicker initColor="rgba(0, 0, 0, 0.87)" />);
2623
const titlewrap = wrapper.find('.material-color-picker-title');
2724
expect(titlewrap.childAt(0).text()).to.be.equal('darkBlack');
2825
});
2926

3027
it('should show right color in preview', () => {
31-
const initColor='rgba(255, 255, 255, 0.87)';
32-
const wrapper = shallow(<MaterialColorPicker initColor={initColor}/>);
28+
const initColor = 'rgba(255, 255, 255, 0.87)';
29+
const wrapper = shallow(<MaterialColorPicker initColor={initColor} />);
3330
const previewwrap = wrapper.find('.material-color-picker-preview');
3431
expect(previewwrap.props().style.backgroundColor)
3532
.to.be.equal(initColor);
@@ -42,8 +39,8 @@ describe('### <MaterialColorPicker /> ###\n\n', () => {
4239
const wrapper = mount(
4340
<div>
4441
<MaterialColorPicker
45-
initColor="#40c4ff"
46-
onSubmit={ clickMe }
42+
initColor="#40c4ff"
43+
onSubmit={ clickMe }
4744
/>
4845
</div>
4946
);
@@ -56,8 +53,8 @@ describe('### <MaterialColorPicker /> ###\n\n', () => {
5653
const wrapper = mount(
5754
<div>
5855
<MaterialColorPicker
59-
initColor="#f3e5f5"
60-
onSubmit={ clickMe }
56+
initColor="#f3e5f5"
57+
onSubmit={ clickMe }
6158
/>
6259
</div>
6360
);
@@ -98,5 +95,3 @@ describe('### <MaterialColorPicker /> ###\n\n', () => {
9895
});
9996
});
10097

101-
102-

0 commit comments

Comments
 (0)