3
3
This package allows you to test arbitrary values and see if they're a particular React type, e.g. React Elements.
4
4
5
5
## Installation
6
+
6
7
``` sh
7
8
# Yarn
8
9
yarn add react-is
@@ -14,67 +15,75 @@ npm install react-is --save
14
15
## Usage
15
16
16
17
### AsyncMode
17
- ``` js
18
- import React from ' react' ;
19
- import ReactIs from ' react-is' ;
20
18
21
- const AsyncMode = React .unstable_AsyncMode ;
19
+ ``` js
20
+ import React from " react" ;
21
+ import { AsyncMode , isAsyncMode , typeOf } from " react-is" ;
22
22
23
- ReactIs . isAsyncMode (< AsyncMode / > ); // true
24
- ReactIs . typeOf (< AsyncMode / > ) === ReactIs . AsyncMode ; // true
23
+ isAsyncMode (< React . unstable_AsyncMode / > ); // true
24
+ typeOf (< React . unstable_AsyncMode / > ) === AsyncMode; // true
25
25
```
26
26
27
27
### Context
28
- ``` js
29
- import React from ' react' ;
30
- ReactIs ReactIs from ' react-is' ;
31
-
32
- const ThemeContext = React .createContext (' blue' );
33
28
34
- ReactIs .isContextConsumer (< ThemeContext .Consumer / > ); // true
35
- ReactIs .isContextProvider (< ThemeContext .Provider / > ); // true
36
- ReactIs .typeOf (< ThemeContext .Provider / > ) === ReactIs .ContextProvider ; // true
37
- ReactIs .typeOf (< ThemeContext .Consumer / > ) === ReactIs .ContextConsumer ; // true
29
+ ``` js
30
+ import React from " react" ;
31
+ import {
32
+ ContextConsumer ,
33
+ ContextProvider ,
34
+ isContextConsumer ,
35
+ isContextProvider ,
36
+ typeOf
37
+ } from " react-is" ;
38
+
39
+ const ThemeContext = React .createContext (" blue" );
40
+
41
+ isContextConsumer (< ThemeContext .Consumer / > ); // true
42
+ isContextProvider (< ThemeContext .Provider / > ); // true
43
+ typeOf (< ThemeContext .Provider / > ) === ContextProvider; // true
44
+ typeOf (< ThemeContext .Consumer / > ) === ContextConsumer; // true
38
45
```
39
46
40
47
### Element
48
+
41
49
``` js
42
- import React from ' react' ;
43
- import ReactIs from ' react-is' ;
50
+ import React from " react" ;
51
+ import { Element , isElement , typeOf } from " react-is" ;
44
52
45
- ReactIs . isElement (< div / > ); // true
46
- ReactIs . typeOf (< div / > ) === ReactIs . Element ; // true
53
+ isElement (< div / > ); // true
54
+ typeOf (< div / > ) === Element ; // true
47
55
```
48
56
49
57
### Fragment
58
+
50
59
``` js
51
- import React from ' react' ;
52
- import ReactIs from ' react-is' ;
60
+ import React from " react" ;
61
+ import { Fragment , isFragment , typeOf } from " react-is" ;
53
62
54
- ReactIs . isFragment (<>< / > ); // true
55
- ReactIs . typeOf (<>< / > ) === ReactIs . Fragment ; // true
63
+ isFragment (<>< / > ); // true
64
+ typeOf (<>< / > ) === Fragment; // true
56
65
```
57
66
58
67
### Portal
68
+
59
69
``` js
60
- import React from ' react' ;
61
- import ReactDOM from ' react-dom' ;
62
- import ReactIs from ' react-is' ;
70
+ import React from " react" ;
71
+ import ReactDOM from " react-dom" ;
72
+ import { isPortal , Portal , typeOf } from " react-is" ;
63
73
64
- const div = document .createElement (' div' );
74
+ const div = document .createElement (" div" );
65
75
const portal = ReactDOM .createPortal (< div / > , div);
66
76
67
- ReactIs . isPortal (portal); // true
68
- ReactIs . typeOf (portal) === ReactIs . Portal ; // true
77
+ isPortal (portal); // true
78
+ typeOf (portal) === Portal; // true
69
79
```
70
80
71
81
### StrictMode
72
- ``` js
73
- import React from ' react' ;
74
- import ReactIs from ' react-is' ;
75
82
76
- const {StrictMode } = React;
83
+ ``` js
84
+ import React from " react" ;
85
+ import { isStrictMode , StrictMode , TypeOf } from " react-is" ;
77
86
78
- ReactIs . isStrictMode (< StrictMode / > ); // true
79
- ReactIs . typeOf (< StrictMode / > ) === ReactIs . StrictMode ; // true
80
- ```
87
+ isStrictMode (< React . StrictMode / > ); // true
88
+ typeOf (< React . StrictMode / > ) === StrictMode; // true
89
+ ```
0 commit comments