Skip to content

[react] Revert "Allow React context in ReactNode" #69347

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
eps1lon merged 2 commits into from
Apr 15, 2024
Merged

[react] Revert "Allow React context in ReactNode" #69347

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
cfbe5e0
[react] Revert "Allow React context in ReactNode"
eps1lon Apr 13, 2024
7c3e9a7
Work around TS 5.0 limitations
eps1lon Apr 13, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 0 additions & 6 deletions types/react/canary.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,11 +30,6 @@ export {};
declare const UNDEFINED_VOID_ONLY: unique symbol;
type VoidOrUndefinedOnly = void | { [UNDEFINED_VOID_ONLY]: never };

/**
* @internal
*/
interface ReactContextAsReactNode extends React.Context<React.ReactNode> {}

declare module "." {
interface ThenableImpl<T> {
then(onFulfill: (value: T) => unknown, onReject: (error: unknown) => unknown): void | PromiseLike<unknown>;
Expand Down Expand Up @@ -162,7 +157,6 @@ declare module "." {
| null
| undefined;
interface DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_REACT_NODES {
contexts: ReactContextAsReactNode;
promises: Promise<AwaitedReactNode>;
bigints: bigint;
}
Expand Down
1 change: 1 addition & 0 deletions types/react/test/canary.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -379,6 +379,7 @@ function formTest() {

const RenderableContext = React.createContext<React.ReactNode>("HAL");
const NestedContext = React.createContext(RenderableContext);
// @ts-expect-error TODO Is supported in Canary release channel
let node: React.ReactNode = RenderableContext;
// @ts-expect-error TODO context values are recursively unwrapped so this should be allowed by types.
node = NestedContext;
Expand Down
18 changes: 18 additions & 0 deletions types/react/test/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -740,6 +740,24 @@ class RenderChildren extends React.Component<{ children?: React.ReactNode }> {
// Will not type-check in a real project but accepted in DT tests since experimental.d.ts is part of compilation.
const node: Awaited<React.ReactNode> = await Promise.resolve("React");
};

class RenderProps extends React.Component<{ children: React.ReactNode | ((data: string) => React.ReactNode) }> {
render() {
const { children } = this.props;
if (typeof children === "function") {
return children("data");
} else {
return children;
}
}
}
React.createElement(RenderProps, {
children: data => {
// $ExpectType string
data;
return null;
},
});
}

const Memoized1 = React.memo(function Foo(props: { foo: string }) {
Expand Down
6 changes: 0 additions & 6 deletions types/react/ts5.0/canary.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,11 +30,6 @@ export {};
declare const UNDEFINED_VOID_ONLY: unique symbol;
type VoidOrUndefinedOnly = void | { [UNDEFINED_VOID_ONLY]: never };

/**
* @internal
*/
interface ReactContextAsReactNode extends React.Context<React.ReactNode> {}

declare module "." {
interface ThenableImpl<T> {
then(onFulfill: (value: T) => unknown, onReject: (error: unknown) => unknown): void | PromiseLike<unknown>;
Expand Down Expand Up @@ -162,7 +157,6 @@ declare module "." {
| null
| undefined;
interface DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_REACT_NODES {
contexts: ReactContextAsReactNode;
promises: Promise<AwaitedReactNode>;
bigints: bigint;
}
Expand Down
1 change: 1 addition & 0 deletions types/react/ts5.0/test/canary.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -379,6 +379,7 @@ function formTest() {

const RenderableContext = React.createContext<React.ReactNode>("HAL");
const NestedContext = React.createContext(RenderableContext);
// @ts-expect-error TODO Is supported in Canary release channel
let node: React.ReactNode = RenderableContext;
// @ts-expect-error TODO context values are recursively unwrapped so this should be allowed by types.
node = NestedContext;
Expand Down
18 changes: 18 additions & 0 deletions types/react/ts5.0/test/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -743,6 +743,24 @@ class RenderChildren extends React.Component<{ children?: React.ReactNode }> {
// Will not type-check in a real project but accepted in DT tests since experimental.d.ts is part of compilation.
const node: Awaited<React.ReactNode> = await Promise.resolve("React");
};

class RenderProps extends React.Component<{ children: React.ReactNode | ((data: string) => React.ReactNode) }> {
render() {
const { children } = this.props;
if (typeof children === "function") {
return children("data");
} else {
return children;
}
}
}
React.createElement(RenderProps, {
children: data => {
// $ExpectType string
data;
return null;
},
});
}

const Memoized1 = React.memo(function Foo(props: { foo: string }) {
Expand Down