react-is
Advanced tools
- Version published
- Maintainers
- 7
- Weekly downloads
- 78,918,649
- increased by9.67%
Weekly downloads
Changelog
18.2.0 (June 14, 2022)
React DOM
- Provide a component stack as a second argument to
onRecoverableError. (@gnoff in #24591) - Fix hydrating into
documentcausing a blank page on mismatch. (@gnoff in #24523) - Fix false positive hydration errors with Suspense. (@gnoff in #24480 and @acdlite in #24532)
- Fix ignored
setStatein Safari when adding an iframe. (@gaearon in #24459)
React DOM Server
- Pass information about server errors to the client. (@salazarm and @gnoff in #24551 and #24591)
- Allow to provide a reason when aborting the HTML stream. (@gnoff in #24680)
- Eliminate extraneous text separators in the HTML where possible. (@gnoff in #24630)
- Disallow complex children inside
<title>elements to match the browser constraints. (@gnoff in #24679) - Fix buffering in some worker environments by explicitly setting
highWaterMarkto0. (@jplhomer in #24641)
Server Components (Experimental)
Readme
react-is
This package allows you to test arbitrary values and see if they're a particular React element type.
Installation
# Yarn
yarn add react-is
# NPM
npm install react-is
Usage
Determining if a Component is Valid
import React from "react";
import * as ReactIs from "react-is";
class ClassComponent extends React.Component {
render() {
return React.createElement("div");
}
}
const FunctionComponent = () => React.createElement("div");
const ForwardRefComponent = React.forwardRef((props, ref) =>
React.createElement(Component, { forwardedRef: ref, ...props })
);
const Context = React.createContext(false);
ReactIs.isValidElementType("div"); // true
ReactIs.isValidElementType(ClassComponent); // true
ReactIs.isValidElementType(FunctionComponent); // true
ReactIs.isValidElementType(ForwardRefComponent); // true
ReactIs.isValidElementType(Context.Provider); // true
ReactIs.isValidElementType(Context.Consumer); // true
ReactIs.isValidElementType(React.createFactory("div")); // true
Determining an Element's Type
Context
import React from "react";
import * as ReactIs from 'react-is';
const ThemeContext = React.createContext("blue");
ReactIs.isContextConsumer(<ThemeContext.Consumer />); // true
ReactIs.isContextProvider(<ThemeContext.Provider />); // true
ReactIs.typeOf(<ThemeContext.Provider />) === ReactIs.ContextProvider; // true
ReactIs.typeOf(<ThemeContext.Consumer />) === ReactIs.ContextConsumer; // true
Element
import React from "react";
import * as ReactIs from 'react-is';
ReactIs.isElement(<div />); // true
ReactIs.typeOf(<div />) === ReactIs.Element; // true
Fragment
import React from "react";
import * as ReactIs from 'react-is';
ReactIs.isFragment(<></>); // true
ReactIs.typeOf(<></>) === ReactIs.Fragment; // true
Portal
import React from "react";
import ReactDOM from "react-dom";
import * as ReactIs from 'react-is';
const div = document.createElement("div");
const portal = ReactDOM.createPortal(<div />, div);
ReactIs.isPortal(portal); // true
ReactIs.typeOf(portal) === ReactIs.Portal; // true
StrictMode
import React from "react";
import * as ReactIs from 'react-is';
ReactIs.isStrictMode(<React.StrictMode />); // true
ReactIs.typeOf(<React.StrictMode />) === ReactIs.StrictMode; // true
Keywords
FAQs
Brand checking of React Elements.
The npm package react-is receives a total of 63,956,549 weekly downloads. As such, react-is popularity was classified as popular.
We found that react-is demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 7 open source maintainers collaborating on the project.
Did you know?
Socket installs a Github app to automatically flag issues on every pull request and report the health of your dependencies. Find out what is inside your node modules and prevent malicious activity before you update the dependencies.