From 95419c5dde80c477f9559224b6938d924d225135 Mon Sep 17 00:00:00 2001 From: Sebastian Markbage Date: Thu, 19 Oct 2017 00:40:16 -0700 Subject: [PATCH] Authoritative brand checking library Can be used without any dependency on React. Plausible replacement for React.isValidElement. --- packages/react-is/README.md | 33 +++++++++++++++++ packages/react-is/index.js | 67 ++++++++++++++++++++++++++++++++++ packages/react-is/package.json | 12 ++++++ 3 files changed, 112 insertions(+) create mode 100644 packages/react-is/README.md create mode 100644 packages/react-is/index.js create mode 100644 packages/react-is/package.json diff --git a/packages/react-is/README.md b/packages/react-is/README.md new file mode 100644 index 0000000000000..05dca2624be01 --- /dev/null +++ b/packages/react-is/README.md @@ -0,0 +1,33 @@ +# `react-is` + +This package allows you to test arbitrary values and see if they're a particular React type, e.g. React Elements. + +## Usage + +```js +import React from 'react'; +import {isElement} from 'react-is'; +isElement(
); // true +``` + +```js +import React from 'react'; +import {isFragment} from 'react-is'; +isFragment(<>); // true +``` + +```js +import React from 'react'; +import {createPortal} from 'react-dom'; +import {isPortal} from 'react-is'; +isPortal(createPortal(
, document.body)); // true +``` + +```js +import React from 'react'; +import {createPortal} from 'react-dom'; +import {typeOf} from 'react-is'; +typeOf(
); // "ReactElement" +typeOf(<>); // "ReactFragment" +typeOf(createPortal(
, document.body)); // "ReactPortal" +``` diff --git a/packages/react-is/index.js b/packages/react-is/index.js new file mode 100644 index 0000000000000..670df04aa913a --- /dev/null +++ b/packages/react-is/index.js @@ -0,0 +1,67 @@ +/** + * Copyright (c) 2014-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ + +'use strict'; + +var REACT_ELEMENT_TYPE; +var REACT_COROUTINE_TYPE; +var REACT_YIELD_TYPE; +var REACT_PORTAL_TYPE; +var REACT_FRAGMENT_TYPE; +if (typeof Symbol === 'function' && Symbol.for) { + REACT_ELEMENT_TYPE = Symbol.for('react.element'); + REACT_COROUTINE_TYPE = Symbol.for('react.coroutine'); + REACT_YIELD_TYPE = Symbol.for('react.yield'); + REACT_PORTAL_TYPE = Symbol.for('react.portal'); + REACT_FRAGMENT_TYPE = Symbol.for('react.fragment'); +} else { + REACT_ELEMENT_TYPE = 0xeac7; + REACT_COROUTINE_TYPE = 0xeac8; + REACT_YIELD_TYPE = 0xeac9; + REACT_PORTAL_TYPE = 0xeaca; + REACT_FRAGMENT_TYPE = 0xeacb; +} + +function is(object, type) { + return ( + typeof object === 'object' && object !== null && object.$$typeof === type + ); +} + +module.exports = { + typeOf(object) { + switch (typeof object === 'object' && object !== null && object.$$typeof) { + case REACT_ELEMENT_TYPE: + return 'ReactElement'; + case REACT_COROUTINE_TYPE: + return 'ReactCoroutine'; + case REACT_YIELD_TYPE: + return 'ReactYield'; + case REACT_PORTAL_TYPE: + return 'ReactPortal'; + case REACT_FRAGMENT_TYPE: + return 'ReactFragment'; + default: + return undefined; + } + }, + isElement(object) { + return is(object, REACT_ELEMENT_TYPE); + }, + isCoroutine(object) { + return is(object, REACT_COROUTINE_TYPE); + }, + isYield(object) { + return is(object, REACT_YIELD_TYPE); + }, + isPortal(object) { + return is(object, REACT_PORTAL_TYPE); + }, + isFragment(object) { + return is(object, REACT_FRAGMENT_TYPE); + }, +}; diff --git a/packages/react-is/package.json b/packages/react-is/package.json new file mode 100644 index 0000000000000..b705d03941257 --- /dev/null +++ b/packages/react-is/package.json @@ -0,0 +1,12 @@ +{ + "name": "react-is", + "description": "Brand checking of React Elements.", + "keywords": ["react"], + "version": "1.0.0", + "homepage": "https://reactjs.org/", + "bugs": "https://github.com/facebook/react/issues", + "license": "MIT", + "files": ["index.js"], + "main": "index.js", + "repository": "facebook/react" +}