Skip to content

Commit 6b5dbe0

Browse files
committed
Update PropTypes usage to reflect changes in React 15.5.0
1 parent f651b8f commit 6b5dbe0

16 files changed

+479
-479
lines changed

docs/rules/forbid-prop-types.md

+10-10
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,9 @@ The following patterns are considered warnings:
1212
```jsx
1313
var Component = createReactClass({
1414
propTypes: {
15-
a: React.PropTypes.any,
16-
r: React.PropTypes.array,
17-
o: React.PropTypes.object
15+
a: PropTypes.any,
16+
r: PropTypes.array,
17+
o: PropTypes.object
1818
},
1919
...
2020
});
@@ -23,16 +23,16 @@ class Component extends React.Component {
2323
...
2424
}
2525
Component.propTypes = {
26-
a: React.PropTypes.any,
27-
r: React.PropTypes.array,
28-
o: React.PropTypes.object
26+
a: PropTypes.any,
27+
r: PropTypes.array,
28+
o: PropTypes.object
2929
};
3030

3131
class Component extends React.Component {
3232
static propTypes = {
33-
a: React.PropTypes.any,
34-
r: React.PropTypes.array,
35-
o: React.PropTypes.object
33+
a: PropTypes.any,
34+
r: PropTypes.array,
35+
o: PropTypes.object
3636
}
3737
render() {
3838
return <div />;
@@ -50,7 +50,7 @@ class Component extends React.Component {
5050

5151
### `forbid`
5252

53-
An array of strings, with the names of `React.PropTypes` keys that are forbidden. The default value for this option is `['any', 'array', 'object']`.
53+
An array of strings, with the names of `PropTypes` keys that are forbidden. The default value for this option is `['any', 'array', 'object']`.
5454

5555
## When not to use
5656

docs/rules/no-deprecated.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ React.renderToStaticMarkup(<MyComponent />);
2020
React.createClass({ /* Class object */ });
2121

2222
const propTypes = {
23-
foo: React.PropTypes.bar,
23+
foo: PropTypes.bar,
2424
};
2525
```
2626

docs/rules/no-unused-prop-types.md

+6-6
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ The following patterns are considered warnings:
99
```jsx
1010
var Hello = createReactClass({
1111
propTypes: {
12-
name: React.PropTypes.string
12+
name: PropTypes.string
1313
},
1414
render: function() {
1515
return <div>Hello Bob</div>;
@@ -18,9 +18,9 @@ var Hello = createReactClass({
1818

1919
var Hello = createReactClass({
2020
propTypes: {
21-
firstname: React.PropTypes.string.isRequired,
22-
middlename: React.PropTypes.string.isRequired, // middlename is never used below
23-
lastname: React.PropTypes.string.isRequired
21+
firstname: PropTypes.string.isRequired,
22+
middlename: PropTypes.string.isRequired, // middlename is never used below
23+
lastname: PropTypes.string.isRequired
2424
},
2525
render: function() {
2626
return <div>Hello {this.props.firstname} {this.props.lastname}</div>;
@@ -33,7 +33,7 @@ The following patterns are not considered warnings:
3333
```jsx
3434
var Hello = createReactClass({
3535
propTypes: {
36-
name: React.PropTypes.string
36+
name: PropTypes.string
3737
},
3838
render: function() {
3939
return <div>Hello {this.props.name}</div>;
@@ -53,7 +53,7 @@ This rule can take one argument to ignore some specific props during validation.
5353

5454
* `enabled`: for enabling the rule. 0=off, 1=warn, 2=error. Defaults to 0.
5555
* `customValidators`: optional array of validators used for propTypes validation.
56-
* `skipShapeProps`: In some cases it is impossible to accurately detect whether or not a `React.PropTypes.shape`'s values are being used. Setting this option to `true` will skip validation of `PropTypes.shape` (`true` by default).
56+
* `skipShapeProps`: In some cases it is impossible to accurately detect whether or not a `PropTypes.shape`'s values are being used. Setting this option to `true` will skip validation of `PropTypes.shape` (`true` by default).
5757

5858
## Caveats
5959

docs/rules/prop-types.md

+7-7
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ var Hello = createReactClass({
1717

1818
var Hello = createReactClass({
1919
propTypes: {
20-
firstname: React.PropTypes.string.isRequired
20+
firstname: PropTypes.string.isRequired
2121
},
2222
render: function() {
2323
return <div>Hello {this.props.firstname} {this.props.lastname}</div>; // lastname type is not defined in propTypes
@@ -34,7 +34,7 @@ Examples of correct usage without warnings:
3434
```jsx
3535
var Hello = createReactClass({
3636
propTypes: {
37-
name: React.PropTypes.string.isRequired,
37+
name: PropTypes.string.isRequired,
3838
},
3939
render: function() {
4040
return <div>Hello {this.props.name}</div>;
@@ -48,13 +48,13 @@ class HelloEs6 extends React.Component {
4848
}
4949
}
5050
HelloEs6.propTypes = {
51-
name: React.PropTypes.string.isRequired,
51+
name: PropTypes.string.isRequired,
5252
};
5353

5454
// ES6 + Public Class Fields (draft: https://tc39.github.io/proposal-class-public-fields/)
5555
class HelloEs6WithPublicClassField extends React.Component {
5656
static propTypes = {
57-
name: React.PropTypes.string.isRequired,
57+
name: PropTypes.string.isRequired,
5858
}
5959
render() {
6060
return <div>Hello {this.props.name}</div>;
@@ -73,7 +73,7 @@ var Hello = createReactClass({
7373

7474
var Hello = createReactClass({
7575
propTypes: {
76-
name: React.PropTypes.string.isRequired
76+
name: PropTypes.string.isRequired
7777
},
7878
render: function() {
7979
return <div>Hello {this.props.name}</div>;
@@ -92,7 +92,7 @@ function Hello({ name }) {
9292
return <div>Hello {name}</div>;
9393
}
9494
Hello.propTypes = {
95-
name: React.PropTypes.string.isRequired,
95+
name: PropTypes.string.isRequired,
9696
};
9797
```
9898

@@ -123,7 +123,7 @@ As it aptly noticed in
123123
> Most components don't need `this.props.children`, so that makes it extra important
124124
to document `children` in the propTypes.
125125

126-
Generally, you should use `React.PropTypes.node` for `children`. It accepts
126+
Generally, you should use `PropTypes.node` for `children`. It accepts
127127
anything that can be rendered: numbers, strings, elements or an array containing
128128
these types.
129129

docs/rules/require-default-props.md

+20-20
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,9 @@ const HelloWorld = ({ name }) => (
1515
);
1616

1717
HelloWorld.propTypes = {
18-
name: React.PropTypes.shape({
19-
first: React.PropTypes.string,
20-
last: React.PropTypes.string,
18+
name: PropTypes.shape({
19+
first: PropTypes.string,
20+
last: PropTypes.string,
2121
})
2222
};
2323

@@ -38,9 +38,9 @@ const HelloWorld = ({ name = 'John Doe' }) => (
3838
);
3939

4040
HelloWorld.propTypes = {
41-
name: React.PropTypes.shape({
42-
first: React.PropTypes.string,
43-
last: React.PropTypes.string,
41+
name: PropTypes.shape({
42+
first: PropTypes.string,
43+
last: PropTypes.string,
4444
})
4545
};
4646

@@ -59,8 +59,8 @@ function MyStatelessComponent({ foo, bar }) {
5959
}
6060

6161
MyStatelessComponent.propTypes = {
62-
foo: React.PropTypes.string.isRequired,
63-
bar: React.PropTypes.string
62+
foo: PropTypes.string.isRequired,
63+
bar: PropTypes.string
6464
};
6565
```
6666

@@ -71,8 +71,8 @@ var Greeting = createReactClass({
7171
},
7272

7373
propTypes: {
74-
foo: React.PropTypes.string,
75-
bar: React.PropTypes.string
74+
foo: PropTypes.string,
75+
bar: PropTypes.string
7676
},
7777

7878
getDefaultProps: function() {
@@ -93,8 +93,8 @@ class Greeting extends React.Component {
9393
}
9494

9595
Greeting.propTypes = {
96-
foo: React.PropTypes.string,
97-
bar: React.PropTypes.string
96+
foo: PropTypes.string,
97+
bar: PropTypes.string
9898
};
9999

100100
Greeting.defaultProps = {
@@ -111,8 +111,8 @@ class Greeting extends React.Component {
111111
}
112112

113113
static propTypes = {
114-
foo: React.PropTypes.string,
115-
bar: React.PropTypes.string.isRequired
114+
foo: PropTypes.string,
115+
bar: PropTypes.string.isRequired
116116
};
117117

118118
static defaultProps = {
@@ -140,8 +140,8 @@ function MyStatelessComponent({ foo, bar }) {
140140
}
141141

142142
MyStatelessComponent.propTypes = {
143-
foo: React.PropTypes.string.isRequired,
144-
bar: React.PropTypes.string.isRequired
143+
foo: PropTypes.string.isRequired,
144+
bar: PropTypes.string.isRequired
145145
};
146146
```
147147

@@ -151,8 +151,8 @@ function MyStatelessComponent({ foo, bar }) {
151151
}
152152

153153
MyStatelessComponent.propTypes = {
154-
foo: React.PropTypes.string.isRequired,
155-
bar: React.PropTypes.string
154+
foo: PropTypes.string.isRequired,
155+
bar: PropTypes.string
156156
};
157157

158158
MyStatelessComponent.defaultProps = {
@@ -179,8 +179,8 @@ MyStatelessComponent.defaultProps = {
179179
function NotAComponent({ foo, bar }) {}
180180

181181
NotAComponent.propTypes = {
182-
foo: React.PropTypes.string,
183-
bar: React.PropTypes.string.isRequired
182+
foo: PropTypes.string,
183+
bar: PropTypes.string.isRequired
184184
};
185185
```
186186

docs/rules/sort-prop-types.md

+26-26
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,9 @@ The following patterns are considered warnings:
1111
```jsx
1212
var Component = createReactClass({
1313
propTypes: {
14-
z: React.PropTypes.number,
15-
a: React.PropTypes.any,
16-
b: React.PropTypes.string
14+
z: PropTypes.number,
15+
a: PropTypes.any,
16+
b: PropTypes.string
1717
},
1818
...
1919
});
@@ -22,16 +22,16 @@ class Component extends React.Component {
2222
...
2323
}
2424
Component.propTypes = {
25-
z: React.PropTypes.number,
26-
a: React.PropTypes.any,
27-
b: React.PropTypes.string
25+
z: PropTypes.number,
26+
a: PropTypes.any,
27+
b: PropTypes.string
2828
};
2929

3030
class Component extends React.Component {
3131
static propTypes = {
32-
z: React.PropTypes.any,
33-
y: React.PropTypes.any,
34-
a: React.PropTypes.any
32+
z: PropTypes.any,
33+
y: PropTypes.any,
34+
a: PropTypes.any
3535
}
3636
render() {
3737
return <div />;
@@ -44,9 +44,9 @@ The following patterns are considered okay and do not cause warnings:
4444
```jsx
4545
var Component = createReactClass({
4646
propTypes: {
47-
a: React.PropTypes.number,
48-
b: React.PropTypes.any,
49-
c: React.PropTypes.string
47+
a: PropTypes.number,
48+
b: PropTypes.any,
49+
c: PropTypes.string
5050
},
5151
...
5252
});
@@ -55,16 +55,16 @@ class Component extends React.Component {
5555
...
5656
}
5757
Component.propTypes = {
58-
a: React.PropTypes.string,
59-
b: React.PropTypes.any,
60-
c: React.PropTypes.string
58+
a: PropTypes.string,
59+
b: PropTypes.any,
60+
c: PropTypes.string
6161
};
6262

6363
class Component extends React.Component {
6464
static propTypes = {
65-
a: React.PropTypes.any,
66-
b: React.PropTypes.any,
67-
c: React.PropTypes.any
65+
a: PropTypes.any,
66+
b: PropTypes.any,
67+
c: PropTypes.any
6868
}
6969
render() {
7070
return <div />;
@@ -95,10 +95,10 @@ When `true`, propTypes for props beginning with "on" must be listed after all ot
9595
```js
9696
var Component = createReactClass({
9797
propTypes: {
98-
a: React.PropTypes.number,
99-
z: React.PropTypes.string,
100-
onBar: React.PropTypes.func,
101-
onFoo: React.PropTypes.func,
98+
a: PropTypes.number,
99+
z: PropTypes.string,
100+
onBar: PropTypes.func,
101+
onFoo: PropTypes.func,
102102
},
103103
...
104104
});
@@ -111,10 +111,10 @@ When `true`, prop types for required props must be listed before all other props
111111
```js
112112
var Component = createReactClass({
113113
propTypes: {
114-
barRequired: React.PropTypes.any.isRequired,
115-
fooRequired: React.PropTypes.any.isRequired,
116-
a: React.PropTypes.number,
117-
z: React.PropTypes.string,
114+
barRequired: PropTypes.any.isRequired,
115+
fooRequired: PropTypes.any.isRequired,
116+
a: PropTypes.number,
117+
z: PropTypes.string,
118118
},
119119
...
120120
});

lib/rules/no-unused-prop-types.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -293,7 +293,7 @@ module.exports = {
293293
/**
294294
* Creates the representation of the React propTypes for the component.
295295
* The representation is used to verify nested used properties.
296-
* @param {ASTNode} value Node of the React.PropTypes for the desired property
296+
* @param {ASTNode} value Node of the PropTypes for the desired property
297297
* @param {String} parentName Name of the parent prop node.
298298
* @return {Object|Boolean} The representation of the declaration, true means
299299
* the property is declared without the need for further analysis.
@@ -318,7 +318,7 @@ module.exports = {
318318
value = value.object;
319319
}
320320

321-
// Verify React.PropTypes that are functions
321+
// Verify PropTypes that are functions
322322
if (
323323
value &&
324324
value.type === 'CallExpression' &&

lib/rules/prop-types.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -338,7 +338,7 @@ module.exports = {
338338
/**
339339
* Creates the representation of the React propTypes for the component.
340340
* The representation is used to verify nested used properties.
341-
* @param {ASTNode} value Node of the React.PropTypes for the desired property
341+
* @param {ASTNode} value Node of the PropTypes for the desired property
342342
* @return {Object|Boolean} The representation of the declaration, true means
343343
* the property is declared without the need for further analysis.
344344
*/
@@ -362,7 +362,7 @@ module.exports = {
362362
value = value.object;
363363
}
364364

365-
// Verify React.PropTypes that are functions
365+
// Verify PropTypes that are functions
366366
if (
367367
value &&
368368
value.type === 'CallExpression' &&

0 commit comments

Comments
 (0)