Skip to content

Commit

Permalink
[Docs] make example descriptions consistent
Browse files Browse the repository at this point in the history
  • Loading branch information
ljharb committed Oct 20, 2020
1 parent 8867490 commit fd94b95
Show file tree
Hide file tree
Showing 87 changed files with 367 additions and 379 deletions.
4 changes: 2 additions & 2 deletions docs/rules/boolean-prop-naming.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ regardless of how you define them.

## Rule Details

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
var Hello = createReactClass({
Expand All @@ -26,7 +26,7 @@ type Props = {
const Hello = (props: Props) => <div />;
```

The following patterns are **not** considered warnings:
Examples of **correct** code for this rule:

```jsx
var Hello = createReactClass({
Expand Down
8 changes: 4 additions & 4 deletions docs/rules/button-has-type.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ This rules enforces an explicit `type` attribute for all the `button` elements a

## Rule Details

The following patterns are considered errors:
Examples of **incorrect** code for this rule:

```jsx
var Hello = <button>Hello</button>
Expand All @@ -16,7 +16,7 @@ var Hello = React.createElement('button', {}, 'Hello')
var Hello = React.createElement('button', {type: 'foo'}, 'Hello')
```

The following patterns are **not** considered errors:
Examples of **correct** code for this rule:

```jsx
var Hello = <span>Hello</span>
Expand Down Expand Up @@ -48,7 +48,7 @@ var Hello = React.createElement('button', {type: condition ? 'button' : 'submit'

You can forbid particular type attribute values by passing `false` as corresponding option (by default all of them are `true`).

The following patterns are considered errors when using `"react/button-has-type": ["error", {reset: false}]`:
Examples of **incorrect** code for this rule, when configured with `{ "reset": false }`:

```jsx
var Hello = <button type="reset">Hello</button>
Expand All @@ -60,4 +60,4 @@ var Hello = React.createElement('button', {type: condition ? "button" : "reset"}

## When Not To Use It

If you use only `"submit"` buttons, you can disable this rule
If you use only `"submit"` buttons, you can disable this rule
6 changes: 3 additions & 3 deletions docs/rules/default-props-match-prop-types.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ required property similarly indicates a possible refactoring problem.

## Rule Details

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
function MyStatelessComponent({ foo, bar }) {
Expand Down Expand Up @@ -103,7 +103,7 @@ MyStatelessComponent.defaultProps = {
}
```

The following patterns are **not** considered warnings:
Examples of **correct** code for this rule:

```jsx
function MyStatelessComponent({ foo, bar }) {
Expand Down Expand Up @@ -167,7 +167,7 @@ NotAComponent.propTypes = {

When `true` the rule will ignore `defaultProps` for required prop types.

The following patterns are considered okay and do not cause warnings:
Examples of **correct** code for this rule, when configured with `{ "allowRequiredDefaults": true }`:

```jsx
function MyStatelessComponent({ foo, bar }) {
Expand Down
10 changes: 4 additions & 6 deletions docs/rules/destructuring-assignment.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ Rule can be set to either of `always` or `never`;

## Rule Details

By default rule is set to `always` enforce destructuring assignment. The following patterns are considered warnings:
By default rule is set to `always` enforce destructuring assignment. Examples of **incorrect** code for this rule:

```js
const MyComponent = (props) => {
Expand Down Expand Up @@ -47,7 +47,7 @@ const Foo = class extends React.PureComponent {
};
```

If rule is set to `never`, the following patterns are considered warning:
Examples of **incorrect** code for this rule, when configured with `"never"`:

```js
const MyComponent = ({id}) => {
Expand Down Expand Up @@ -97,12 +97,10 @@ const Foo = class extends React.PureComponent {

### `ignoreClassFields`

When `true` the rule will ignore class field declarations.

The following patterns are then considered okay and do not cause warnings:
When configured with `true`, the rule will ignore class field declarations. Examples of **correct** code for this rule:

```jsx
class Foo extends React.PureComponent {
bar = this.props.bar
}
```
```
10 changes: 5 additions & 5 deletions docs/rules/display-name.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ DisplayName allows you to name your component. This name is used by React in deb

## Rule Details

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
var Hello = createReactClass({
Expand All @@ -14,7 +14,7 @@ var Hello = createReactClass({
});
```

The following patterns are **not** considered warnings:
Examples of **correct** code for this rule:

```jsx
var Hello = createReactClass({
Expand All @@ -37,7 +37,7 @@ var Hello = createReactClass({

When `true` the rule will ignore the name set by the transpiler and require a `displayName` property in this case.

The following patterns are considered okay and do **not** cause warnings:
Examples of **correct** code for this rule:

```jsx
var Hello = createReactClass({
Expand Down Expand Up @@ -66,7 +66,7 @@ export default function Hello({ name }) {
Hello.displayName = 'Hello';
```

The following patterns will cause warnings:
Examples of **incorrect** code for this rule:

```jsx
var Hello = createReactClass({
Expand Down Expand Up @@ -120,4 +120,4 @@ For now we should detect components created with:

* `createReactClass()`
* an ES6 class that inherit from `React.Component` or `Component`
* a stateless function that return JSX or the result of a `React.createElement` call.
* a stateless function that return JSX or the result of a `React.createElement` call.
4 changes: 2 additions & 2 deletions docs/rules/forbid-component-props.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ By default this rule prevents passing of [props that add lots of complexity](htt
This rule checks all JSX elements and verifies that no forbidden props are used
on Components. This rule is off by default.

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
<Hello className='foo' />
Expand All @@ -17,7 +17,7 @@ The following patterns are considered warnings:
<Hello style={{color: 'red'}} />
```

The following patterns are **not** considered warnings:
Examples of **correct** code for this rule:

```jsx
<Hello name='Joe' />
Expand Down
4 changes: 2 additions & 2 deletions docs/rules/forbid-dom-props.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ The list of forbidden props can be customized with the `forbid` option.
This rule checks all JSX elements and verifies that no forbidden props are used
on DOM Nodes. This rule is off by default.

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
// [1, { "forbid": ["id"] }]
Expand All @@ -20,7 +20,7 @@ The following patterns are considered warnings:
<div style={{color: 'red'}} />
```

The following patterns are **not** considered warnings:
Examples of **correct** code for this rule:

```jsx
// [1, { "forbid": ["id"] }]
Expand Down
4 changes: 2 additions & 2 deletions docs/rules/forbid-elements.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ An array of strings and/or objects. An object in this array may have the followi

A string item in the array is a shorthand for `{ element: string }`.

The following patterns are **not** considered warnings:
Examples of **correct** code for this rule:

```jsx
// [1, { "forbid": ["button"] }]
Expand All @@ -33,7 +33,7 @@ The following patterns are **not** considered warnings:
<Button />
```

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
// [1, { "forbid": ["button"] }]
Expand Down
4 changes: 2 additions & 2 deletions docs/rules/forbid-foreign-prop-types.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ In order to ensure that imports are explicitly exported it is recommended to use

This rule checks all objects and ensures that the `propTypes` property is not used.

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```js
import SomeComponent from './SomeComponent';
Expand All @@ -19,7 +19,7 @@ var { propTypes } = SomeComponent;
SomeComponent['propTypes'];
```

The following patterns are **not** considered warnings:
Examples of **correct** code for this rule:

```js
import SomeComponent, {propTypes as someComponentPropTypes} from './SomeComponent';
Expand Down
6 changes: 3 additions & 3 deletions docs/rules/forbid-prop-types.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ By default this rule prevents vague prop types with more specific alternatives a
This rule checks all JSX components and verifies that no forbidden propsTypes are used.
This rule is off by default.

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
var Component = createReactClass({
Expand Down Expand Up @@ -54,11 +54,11 @@ An array of strings, with the names of `PropTypes` keys that are forbidden. The

### `checkContextTypes`

Whether or not to check `contextTypes` for forbidden prop types. The default value is false.
Whether or not to check `contextTypes` for forbidden prop types. The default value is `false`.

### `checkChildContextTypes`

Whether or not to check `childContextTypes` for forbidden prop types. The default value is false.
Whether or not to check `childContextTypes` for forbidden prop types. The default value is `false`.

## When not to use

Expand Down
6 changes: 3 additions & 3 deletions docs/rules/function-component-definition.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ This option enforces a specific function type for function components.

This rule is aimed to enforce consistent function types for function components. By default it prefers function declarations for named components and function expressions for unnamed components.

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
// function expression for named component
Expand Down Expand Up @@ -42,7 +42,7 @@ This rule takes an options object as a second parameter where the preferred func
...
```

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
// only function declarations for named components
Expand Down Expand Up @@ -93,7 +93,7 @@ function getComponent () {

```

The following patterns are **not** warnings:
Examples of **correct** code for this rule:

```jsx

Expand Down
10 changes: 5 additions & 5 deletions docs/rules/jsx-boolean-value.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,30 +10,30 @@ This rule takes two arguments. If the first argument is `"always"` then it warns

The second argument is optional: if provided, it must be an object with a `"never"` property (if the first argument is `"always"`), or an `"always"` property (if the first argument is `"never"`). This property’s value must be an array of strings representing prop names.

The following patterns are considered warnings when configured `"never"`, or with `"always", { "never": ["personal"] }`:
Examples of **incorrect** code for this rule, when configured with `"never"`, or with `"always", { "never": ["personal"] }`:

```jsx
var Hello = <Hello personal={true} />;
```

The following patterns are **not** considered warnings when configured `"never"`, or with `"always", { "never": ["personal"] }`:
Examples of **correct** code for this rule, when configured with `"never"`, or with `"always", { "never": ["personal"] }`:

```jsx
var Hello = <Hello personal />;
```

The following patterns are considered warnings when configured `"always"`, or with `"never", { "always": ["personal"] }`:
Examples of **incorrect** code for this rule, when configured with `"always"`, or with `"never", { "always": ["personal"] }`:

```jsx
var Hello = <Hello personal />;
```

The following patterns are **not** considered warnings when configured `"always"`, or with `"never", { "always": ["personal"] }`:
Examples of **correct** code for this rule, when configured with `"always"`, or with `"never", { "always": ["personal"] }`:

```jsx
var Hello = <Hello personal={true} />;
```

## When Not To Use It

If you do not want to enforce any style for boolean attributes, then you can disable this rule.
If you do not want to enforce any style for boolean attributes, then you can disable this rule.
4 changes: 2 additions & 2 deletions docs/rules/jsx-child-element-spacing.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ Since React removes extraneous new lines between elements when possible,
it is possible to end up with inline elements that are not rendered with spaces between them and adjacent text.
This is often indicative of an error, so this rule attempts to detect

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
<div>
Expand All @@ -22,7 +22,7 @@ The following patterns are considered warnings:
</div>
```

The following patterns are **not** considered warnings:
Examples of **correct** code for this rule:

```jsx
<div>
Expand Down
8 changes: 4 additions & 4 deletions docs/rules/jsx-closing-bracket-location.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ Enforce the closing bracket location for JSX multiline elements.

This rule checks all JSX multiline elements and verifies the location of the closing bracket. By default this one must be aligned with the opening tag.

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
<Hello
Expand All @@ -21,7 +21,7 @@ The following patterns are considered warnings:
/>;
```

The following patterns are **not** considered warnings:
Examples of **correct** code for this rule:

```jsx
<Hello firstName="John" lastName="Smith" />;
Expand Down Expand Up @@ -65,7 +65,7 @@ Defaults to `tag-aligned`.

For backward compatibility, you may pass an object `{ "location": <location> }` that is equivalent to the first string shortcut form.

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
// 'jsx-closing-bracket-location': 1
Expand Down Expand Up @@ -138,7 +138,7 @@ var x = function() {
</Say>;
```

The following patterns are **not** considered warnings:
Examples of **correct** code for this rule:

```jsx
// 'jsx-closing-bracket-location': 1
Expand Down
6 changes: 3 additions & 3 deletions docs/rules/jsx-closing-tag-location.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ Enforce the closing tag location for multiline JSX elements.

This rule checks all JSX multiline elements with children (non-self-closing) and verifies the location of the closing tag. The expectation is that the closing tag is aligned with the opening tag on its own line.

The following patterns are considered warnings:
Examples of **incorrect** code for this rule:

```jsx
<Hello>
Expand All @@ -21,7 +21,7 @@ The following patterns are considered warnings:
marklar</Hello>
```

The following are **not** considered warnings:
Examples of **correct** code for this rule:

```jsx
<Hello>
Expand All @@ -35,4 +35,4 @@ The following are **not** considered warnings:

## When not to use

If you do not care about closing tag JSX alignment then you can disable this rule.
If you do not care about closing tag JSX alignment then you can disable this rule.
Loading

0 comments on commit fd94b95

Please sign in to comment.