Skip to content

Commit 8794250

Browse files
teodosiiteodosii
committed
Added prettier and formatted few files
1 parent 9fd328b commit 8794250

22 files changed

+552
-422
lines changed

‎.prettierrc.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
module.exports = {
2+
printWidth: 100,
3+
trailingComma: 'none',
4+
useTabs: false,
5+
tabWidth: 2,
6+
semi: true,
7+
singleQuote: true,
8+
quoteProps: 'consistent',
9+
jsxBracketSameLine: false
10+
};

‎package-lock.json‎

Lines changed: 6 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,7 @@
7171
"node-sass": "^4.11.0",
7272
"object-assign": "^4.1.1",
7373
"optimize-css-assets-webpack-plugin": "^5.0.3",
74+
"prettier": "^1.18.2",
7475
"react": "^16.0.0",
7576
"react-dom": "^16.0.0",
7677
"react-github-button": "^0.1.11",

‎samples/js/components/App.js‎

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,30 @@
1-
import React from "react";
2-
import ReactNotification from "rc-notifications/react-notification-component";
3-
import Header from "components/Header";
4-
import Content from "components/Content";
5-
import GithubCorner from "react-github-corner";
1+
import React from 'react';
2+
import ReactNotification from 'rc-notifications/react-notification-component';
3+
import Header from 'components/Header';
4+
import Content from 'components/Content';
5+
import GithubCorner from 'react-github-corner';
66

77
const App = () => {
88
return (
99
<React.Fragment>
1010
<ReactNotification
11-
types={[{
12-
htmlClasses: ["notification-awesome"],
13-
name: "awesome"
14-
}]}
11+
types={[
12+
{
13+
htmlClasses: ['notification-awesome'],
14+
name: 'awesome'
15+
}
16+
]}
1517
isMobile={true}
1618
/>
1719
<Header />
1820
<Content />
1921
<GithubCorner
2022
target="_blank"
2123
size={125}
22-
href="https://github.com/teodosii/react-notifications-component" />
24+
href="https://github.com/teodosii/react-notifications-component"
25+
/>
2326
</React.Fragment>
2427
);
25-
}
28+
};
2629

27-
export default App;
30+
export default App;

‎samples/js/components/Content.js‎

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import React from "react";
2-
import ContainerExample from "components/examples/ContainerExample";
3-
import TypeExample from "components/examples/TypeExample";
4-
import InsertExample from "components/examples/InsertExample";
5-
import AnimationWrapper from "components/examples/AnimationExample";
6-
import CustomContentExample from "components/examples/CustomContentExample";
1+
import React from 'react';
2+
import ContainerExample from 'components/examples/ContainerExample';
3+
import TypeExample from 'components/examples/TypeExample';
4+
import InsertExample from 'components/examples/InsertExample';
5+
import AnimationWrapper from 'components/examples/AnimationExample';
6+
import CustomContentExample from 'components/examples/CustomContentExample';
77

88
function ExampleHeading() {
99
return (
@@ -12,8 +12,10 @@ function ExampleHeading() {
1212
<h2 className="text-center">Examples</h2>
1313
<div className="alert alert-warning alert-small">
1414
<i className="fa fa-info-circle"></i>
15-
All notifications have been set to be automatically dismissed after <code className="white-code">5000ms</code>.
16-
Notifications can be manually dismissed by <code className="white-code">clicking</code> or by <code className="white-code">swiping</code> on mobile devices.
15+
All notifications have been set to be automatically dismissed after{' '}
16+
<code className="white-code">5000ms</code>. Notifications can be manually dismissed by{' '}
17+
<code className="white-code">clicking</code> or by{' '}
18+
<code className="white-code">swiping</code> on mobile devices.
1719
</div>
1820
</div>
1921
</div>
@@ -41,4 +43,4 @@ export default function Content() {
4143
</div>
4244
</div>
4345
);
44-
}
46+
}

‎samples/js/components/Header.js‎

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,24 @@
1-
import React from "react";
2-
import "react-github-button/assets/style.css";
3-
import GitHubButton from "react-github-button";
1+
import React from 'react';
2+
import 'react-github-button/assets/style.css';
3+
import GitHubButton from 'react-github-button';
44

55
export default function Header() {
66
return (
77
<div className="header">
88
<div className="header-content">
99
<h1 className="header-title">React-Notifications</h1>
10-
<p className="header-desc">Delightful and highly customisable React Component to notify your users</p>
10+
<p className="header-desc">
11+
Delightful and highly customisable React Component to notify your users
12+
</p>
1113
<div className="header-buttons">
12-
<GitHubButton type="stargazers" size="large" namespace="teodosii" repo="react-notifications-component" />
14+
<GitHubButton
15+
type="stargazers"
16+
size="large"
17+
namespace="teodosii"
18+
repo="react-notifications-component"
19+
/>
1320
</div>
1421
</div>
1522
</div>
1623
);
17-
}
24+
}

‎samples/js/components/examples/AnimationExample.js‎

Lines changed: 100 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,45 +1,78 @@
11
import React from 'react';
22
import notification from 'helpers/notification';
33
import { store } from 'rc-notifications/react-notification-component';
4-
import { getContainer, getType, getMessage } from "helpers/randomize";
4+
import { getContainer, getType, getMessage } from 'helpers/randomize';
55

66
function AnimationInExample() {
7-
const add = (htmlClasses) => {
7+
const add = htmlClasses => {
88
const type = getType();
99

10-
return store.addNotification(Object.assign({}, notification, {
11-
animationIn: htmlClasses,
12-
container: getContainer(),
13-
message: getMessage(type),
14-
type
15-
}));
10+
return store.addNotification(
11+
Object.assign({}, notification, {
12+
animationIn: htmlClasses,
13+
container: getContainer(),
14+
message: getMessage(type),
15+
type
16+
})
17+
);
1618
};
1719

1820
return (
1921
<div className="row">
2022
<div className="col-lg-6 offset-lg-3 column col-md-10 offset-md-1 col-sm-12">
2123
<h6>Animation Entrance</h6>
22-
<div>Entrance <code className="white-code">animation</code> can be customised by specifying CSS classes</div>
2324
<div>
24-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated bounceIn"])}>
25+
Entrance <code className="white-code">animation</code> can be customised by specifying CSS
26+
classes
27+
</div>
28+
<div>
29+
<button
30+
type="button"
31+
className="btn btn-outline-secondary"
32+
onClick={() => add(['animated bounceIn'])}
33+
>
2534
Bounce In
26-
</button>{" "}
27-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated fadeIn"])}>
35+
</button>{' '}
36+
<button
37+
type="button"
38+
className="btn btn-outline-secondary"
39+
onClick={() => add(['animated fadeIn'])}
40+
>
2841
Fade In
29-
</button>{" "}
30-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated flipInX"])}>
42+
</button>{' '}
43+
<button
44+
type="button"
45+
className="btn btn-outline-secondary"
46+
onClick={() => add(['animated flipInX'])}
47+
>
3148
Flip In X
32-
</button>{" "}
33-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated flipInY"])}>
49+
</button>{' '}
50+
<button
51+
type="button"
52+
className="btn btn-outline-secondary"
53+
onClick={() => add(['animated flipInY'])}
54+
>
3455
Flip In Y
35-
</button>{" "}
36-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated zoomIn"])}>
56+
</button>{' '}
57+
<button
58+
type="button"
59+
className="btn btn-outline-secondary"
60+
onClick={() => add(['animated zoomIn'])}
61+
>
3762
Zoom In
38-
</button>{" "}
39-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated flash"])}>
63+
</button>{' '}
64+
<button
65+
type="button"
66+
className="btn btn-outline-secondary"
67+
onClick={() => add(['animated flash'])}
68+
>
4069
Flash
41-
</button>{" "}
42-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated jackInTheBox"])}>
70+
</button>{' '}
71+
<button
72+
type="button"
73+
className="btn btn-outline-secondary"
74+
onClick={() => add(['animated jackInTheBox'])}
75+
>
4376
Jack In The Box
4477
</button>
4578
</div>
@@ -49,39 +82,64 @@ function AnimationInExample() {
4982
}
5083

5184
function AnimationOutExample() {
52-
const add = (htmlClasses) => {
85+
const add = htmlClasses => {
5386
const type = getType();
5487

55-
return store.addNotification(Object.assign({}, notification, {
56-
slidingExit: { delay: 300 },
57-
animationOut: htmlClasses,
58-
container: getContainer(),
59-
message: getMessage(type),
60-
type
61-
}));
88+
return store.addNotification(
89+
Object.assign({}, notification, {
90+
slidingExit: { delay: 300 },
91+
animationOut: htmlClasses,
92+
container: getContainer(),
93+
message: getMessage(type),
94+
type
95+
})
96+
);
6297
};
6398

6499
return (
65100
<div className="row">
66101
<div className="col-lg-6 offset-lg-3 column col-md-10 offset-md-1 col-sm-12">
67102
<h6>Animation Exit</h6>
68-
<div>Exit <code className="white-code">animation</code> can be customised by specifying CSS classes</div>
69103
<div>
70-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated bounceOut"])}>
104+
Exit <code className="white-code">animation</code> can be customised by specifying CSS
105+
classes
106+
</div>
107+
<div>
108+
<button
109+
type="button"
110+
className="btn btn-outline-secondary"
111+
onClick={() => add(['animated bounceOut'])}
112+
>
71113
Bounce Out
72-
</button>{" "}
73-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated fadeOut"])}>
114+
</button>{' '}
115+
<button
116+
type="button"
117+
className="btn btn-outline-secondary"
118+
onClick={() => add(['animated fadeOut'])}
119+
>
74120
Fade Out
75-
</button>{" "}
76-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated flipOutX"])}>
121+
</button>{' '}
122+
<button
123+
type="button"
124+
className="btn btn-outline-secondary"
125+
onClick={() => add(['animated flipOutX'])}
126+
>
77127
Flip Out X
78-
</button>{" "}
79-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated flipOutY"])}>
128+
</button>{' '}
129+
<button
130+
type="button"
131+
className="btn btn-outline-secondary"
132+
onClick={() => add(['animated flipOutY'])}
133+
>
80134
Flip Out Y
81-
</button>{" "}
82-
<button type="button" className="btn btn-outline-secondary" onClick={() => add(["animated zoomOut"])}>
135+
</button>{' '}
136+
<button
137+
type="button"
138+
className="btn btn-outline-secondary"
139+
onClick={() => add(['animated zoomOut'])}
140+
>
83141
Zoom Out
84-
</button>{" "}
142+
</button>{' '}
85143
</div>
86144
</div>
87145
</div>
@@ -95,4 +153,4 @@ export default function AnimationWrapper() {
95153
<AnimationOutExample />
96154
</div>
97155
);
98-
}
156+
}

0 commit comments

Comments
 (0)