refactor: not to matain ReactSymbols

add `react-is` to peerDependencies

Author: xyy94813

package.json

@@ -24,10 +24,7 @@
     "smoke": "node tests/smoke/run"
   },
   "lint-staged": {
-    "*.js": [
-      "prettier --write \"**/*.{js,json}\"",
-      "git add"
-    ]
+    "*.js": ["prettier --write \"**/*.{js,json}\"", "git add"]
   },
   "author": {
     "name": "Algolia, Inc.",
@@ -80,15 +77,13 @@
   },
   "peerDependencies": {
     "react": "^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1",
-    "react-dom": "^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1"
+    "react-dom": "^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1",
+    "react-is": "^16.0.0"
   },
   "dependencies": {
-    "@base2/pretty-print-object": "1.0.0",
-    "is-plain-object": "3.0.1"
+    "@base2/pretty-print-object": "1.0.0"
   },
   "jest": {
-    "setupFilesAfterEnv": [
-      "<rootDir>tests/setupTests.js"
-    ]
+    "setupFilesAfterEnv": ["<rootDir>tests/setupTests.js"]
   }
 }

src/libs/ReactSymbols.js

@@ -1,25 +1,24 @@
 /**
- * Core logic copy from https://github.com/facebook/react/blob/28625c6f45423e6edc5ca0e2932281769c0d431e/packages/shared/getComponentNameFromType.js
+ * Reference from https://github.com/facebook/react/blob/28625c6f45423e6edc5ca0e2932281769c0d431e/packages/shared/getComponentNameFromType.js
  *
  * @flow
  */
 
 import type { LazyComponent, ReactContext, ReactProviderType } from 'react';
-
+import { Fragment } from 'react';
 import {
-  REACT_CONTEXT_TYPE,
-  REACT_FORWARD_REF_TYPE,
-  REACT_FRAGMENT_TYPE,
-  REACT_PORTAL_TYPE,
-  REACT_MEMO_TYPE,
-  REACT_PROFILER_TYPE,
-  REACT_PROVIDER_TYPE,
-  REACT_STRICT_MODE_TYPE,
-  REACT_SUSPENSE_TYPE,
-  REACT_SUSPENSE_LIST_TYPE,
-  REACT_LAZY_TYPE,
-  REACT_CACHE_TYPE,
-} from './ReactSymbols';
+  ContextConsumer,
+  ContextProvider,
+  Element,
+  ForwardRef,
+  Portal,
+  Memo,
+  Profiler,
+  StrictMode,
+  Suspense,
+  SuspenseList,
+  Lazy,
+} from 'react-is';
 
 // Keep in sync with react-reconciler/getComponentNameFromFiber
 function getWrappedName(
@@ -55,47 +54,42 @@ function getComponentNameFromType(type: mixed): string | null {
   }
   // eslint-disable-next-line default-case
   switch (type) {
-    case REACT_FRAGMENT_TYPE:
+    case Fragment:
       return 'Fragment';
-    case REACT_PORTAL_TYPE:
+    case Portal:
       return 'Portal';
-    case REACT_PROFILER_TYPE:
+    case Profiler:
       return 'Profiler';
-    case REACT_STRICT_MODE_TYPE:
+    case StrictMode:
       return 'StrictMode';
-    case REACT_SUSPENSE_TYPE:
+    case Suspense:
       return 'Suspense';
-    case REACT_SUSPENSE_LIST_TYPE:
+    case SuspenseList:
       return 'SuspenseList';
-    case REACT_CACHE_TYPE:
-      return 'Cache';
+    // case REACT_CACHE_TYPE:
+    //   return 'Cache';
   }
   if (typeof type === 'object') {
     // eslint-disable-next-line default-case
     switch (type.$$typeof) {
-      case REACT_CONTEXT_TYPE:
-        // eslint-disable-next-line no-case-declarations
-        const context: ReactContext<any> = (type: any);
+      case ContextConsumer:
         /**
          * in DEV, should get context from `_context`.
          * https://github.com/facebook/react/blob/e16d61c3000e2de6217d06b9afad162e883f73c4/packages/react/src/ReactContext.js#L44-L125
          */
-        return `${getContextName(context._context ?? context)}.Consumer`;
-      case REACT_PROVIDER_TYPE:
-        // eslint-disable-next-line no-case-declarations
-        const provider: ReactProviderType<any> = (type: any);
-        return `${getContextName(provider._context)}.Provider`;
-      case REACT_FORWARD_REF_TYPE:
+        return `${getContextName(type._context ?? type)}.Consumer`;
+      case ContextProvider:
+        return `${getContextName(type._context)}.Provider`;
+      case ForwardRef:
         // eslint-disable-next-line no-case-declarations
         return getWrappedName(type, type.render, 'ForwardRef');
-      case REACT_MEMO_TYPE:
-        // eslint-disable-next-line no-case-declarations
+      case Memo:
         const outerName = (type: any).displayName || null;
         if (outerName !== null) {
           return outerName;
         }
         return getComponentNameFromType(type.type) || 'Memo';
-      case REACT_LAZY_TYPE: {
+      case Lazy: {
         const lazyComponent: LazyComponent<any, any> = (type: any);
         const payload = lazyComponent._payload;
         const init = lazyComponent._init;

src/libs/getComponentNameFromType.js

@@ -1,6 +1,18 @@
 /* @flow */
 
 import React, { type Element as ReactElement, Fragment } from 'react';
+import {
+  isElement,
+  isForwardRef,
+  isFragment,
+  isLazy,
+  isMemo,
+  isPortal,
+  isProfiler,
+  isStrictMode,
+  isSuspense,
+  isSuspenseList,
+} from 'react-is';
 import type { Options } from './../options';
 import {
   createStringTreeNode,