diff --git a/style_guides/react_style_guide.md b/style_guides/react_style_guide.md
index 149bee8a747a..8d9477a3c209 100644
--- a/style_guides/react_style_guide.md
+++ b/style_guides/react_style_guide.md
@@ -5,14 +5,14 @@ Stateless function components are more concise, and there are plans for react to
Good:
```
export function KuiButton(props) {
- return
+ return
};
```
Bad:
```
export class KuiButton extends React.Component {
render() {
- return
+ return
}
}
```
@@ -30,7 +30,7 @@ export class ClickCounter extends React.Component {
}
render() {
- return
+ return
}
}
```
@@ -48,7 +48,7 @@ Bad:
}));
},
render() {
- return
+ return
}
});
```
@@ -92,14 +92,14 @@ Good:
```
button.js:
export function KuiButton(props) {
- return
+ return
};
```
Bad:
```
button.js:
export function Button(props) {
- return
+ return
};
```
The filenames leave it off because snake casing already increases file name length.
@@ -108,8 +108,8 @@ The filenames leave it off because snake casing already increases file name leng
Name action functions in the form of a strong verb and passed properties in the form of on. E.g:
```
-
-
+
+
```
### Avoid creating a function and passing that as a property, in render functions.
@@ -124,7 +124,7 @@ export class ClickCounter extends React.Component {
}
render() {
- return
+ return
}
}
```
@@ -141,7 +141,7 @@ export class ClickCounter extends React.Component {
}
render() {
- return
+ return
}
}
```
@@ -156,7 +156,7 @@ export class ClickCounter extends React.Component {
}
render() {
- return