Skip to content

Commit b4ff653

Browse files
committed
Updated README
1 parent 70bccd8 commit b4ff653

File tree

1 file changed

+45
-36
lines changed

1 file changed

+45
-36
lines changed

packages/react-is/README.md

Lines changed: 45 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
This package allows you to test arbitrary values and see if they're a particular React type, e.g. React Elements.
44

55
## Installation
6+
67
```sh
78
# Yarn
89
yarn add react-is
@@ -14,67 +15,75 @@ npm install react-is --save
1415
## Usage
1516

1617
### AsyncMode
17-
```js
18-
import React from 'react';
19-
import ReactIs from 'react-is';
2018

21-
const AsyncMode = React.unstable_AsyncMode;
19+
```js
20+
import React from "react";
21+
import { AsyncMode, isAsyncMode, typeOf } from "react-is";
2222

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
2525
```
2626

2727
### Context
28-
```js
29-
import React from 'react';
30-
ReactIs ReactIs from 'react-is';
31-
32-
const ThemeContext = React.createContext('blue');
3328

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
3845
```
3946

4047
### Element
48+
4149
```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";
4452

45-
ReactIs.isElement(<div />); // true
46-
ReactIs.typeOf(<div />) === ReactIs.Element; // true
53+
isElement(<div />); // true
54+
typeOf(<div />) === Element; // true
4755
```
4856

4957
### Fragment
58+
5059
```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";
5362

54-
ReactIs.isFragment(<></>); // true
55-
ReactIs.typeOf(<></>) === ReactIs.Fragment; // true
63+
isFragment(<></>); // true
64+
typeOf(<></>) === Fragment; // true
5665
```
5766

5867
### Portal
68+
5969
```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";
6373

64-
const div = document.createElement('div');
74+
const div = document.createElement("div");
6575
const portal = ReactDOM.createPortal(<div />, div);
6676

67-
ReactIs.isPortal(portal); // true
68-
ReactIs.typeOf(portal) === ReactIs.Portal; // true
77+
isPortal(portal); // true
78+
typeOf(portal) === Portal; // true
6979
```
7080

7181
### StrictMode
72-
```js
73-
import React from 'react';
74-
import ReactIs from 'react-is';
7582

76-
const {StrictMode} = React;
83+
```js
84+
import React from "react";
85+
import { isStrictMode, StrictMode, TypeOf } from "react-is";
7786

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

Comments
 (0)