Call and Return components should use ReactElement

packages/react-call-return/src/ReactCallReturn.js

@@ -7,25 +7,33 @@
  * @flow
  */
 
-import {REACT_CALL_TYPE, REACT_RETURN_TYPE} from 'shared/ReactSymbols';
+import {
+  REACT_CALL_TYPE,
+  REACT_RETURN_TYPE,
+  REACT_ELEMENT_TYPE,
+} from 'shared/ReactSymbols';
 
 import type {ReactCall, ReactNodeList, ReactReturn} from 'shared/ReactTypes';
 
-type CallHandler<T> = (props: T, returns: Array<mixed>) => ReactNodeList;
+type CallHandler<T, V> = (props: T, returns: Array<V>) => ReactNodeList;
 
-export function unstable_createCall<T>(
-  children: mixed,
-  handler: CallHandler<T>,
+export function unstable_createCall<T, V>(
+  children: ReactNodeList,
+  handler: CallHandler<T, V>,
   props: T,
   key: ?string = null,
-): ReactCall {
+): ReactCall<V> {
   const call = {
     // This tag allow us to uniquely identify this as a React Call
-    $$typeof: REACT_CALL_TYPE,
+    $$typeof: REACT_ELEMENT_TYPE,
+    type: REACT_CALL_TYPE,
     key: key == null ? null : '' + key,
-    children: children,
-    handler: handler,
-    props: props,
+    ref: null,
+    props: {
+      props,
+      handler,
+      children: children,
+    },
   };
 
   if (__DEV__) {
@@ -39,11 +47,16 @@ export function unstable_createCall<T>(
   return call;
 }
 
-export function unstable_createReturn(value: mixed): ReactReturn {
+export function unstable_createReturn<V>(value: V): ReactReturn<V> {
   const returnNode = {
-    // This tag allow us to uniquely identify this as a React Return
-    $$typeof: REACT_RETURN_TYPE,
-    value: value,
+    // This tag allow us to uniquely identify this as a React Call
+    $$typeof: REACT_ELEMENT_TYPE,
+    type: REACT_RETURN_TYPE,
+    key: null,
+    ref: null,
+    props: {
+      value,
+    },
   };
 
   if (__DEV__) {
@@ -63,7 +76,7 @@ export function unstable_isCall(object: mixed): boolean {
   return (
     typeof object === 'object' &&
     object !== null &&
-    object.$$typeof === REACT_CALL_TYPE
+    object.type === REACT_CALL_TYPE
   );
 }
 
@@ -74,7 +87,7 @@ export function unstable_isReturn(object: mixed): boolean {
   return (
     typeof object === 'object' &&
     object !== null &&
-    object.$$typeof === REACT_RETURN_TYPE
+    object.type === REACT_RETURN_TYPE
   );
 }
 

packages/react-dom/src/server/ReactPartialRenderer.js

@@ -621,11 +621,6 @@ class ReactDOMServerRenderer {
             'Portals are not currently supported by the server renderer. ' +
               'Render them conditionally so that they only appear on the client render.',
           );
-          invariant(
-            $$typeof !== REACT_CALL_TYPE && $$typeof !== REACT_RETURN_TYPE,
-            'The experimental Call and Return types are not currently ' +
-              'supported by the server renderer.',
-          );
           // Catch-all to prevent an infinite loop if React.Children.toArray() supports some new type.
           invariant(
             false,
@@ -678,6 +673,12 @@ class ReactDOMServerRenderer {
     context: Object,
     parentNamespace: string,
   ): string {
+    invariant(
+      element.type !== REACT_CALL_TYPE && element.type !== REACT_RETURN_TYPE,
+      'The experimental Call and Return types are not currently ' +
+        'supported by the server renderer.',
+    );
+
     const tag = element.type.toLowerCase();
 
     let namespace = parentNamespace;