Skip to content
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

Jump to bottom

[react] [react-dom] Add unstable prefix to experimental APIs #44564

Merged
merged 2 commits into from May 11, 2020
Merged

[react] [react-dom] Add unstable prefix to experimental APIs #44564

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
2eb40fb
[react] Add unstable prefix to experimental APIs
leonardodino May 8, 2020
dce5b2b
[react-dom] Add unstable prefix to experimental APIs
leonardodino May 8, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 2 additions & 2 deletions types/react-dom/experimental.d.ts
View file
Open in desktop
Expand Up @@ -64,7 +64,7 @@ declare module '.' {
* @see https://reactjs.org/docs/concurrent-mode-adoption.html#migration-step-blocking-mode
* @see https://reactjs.org/docs/concurrent-mode-reference.html#createblockingroot
*/
function createBlockingRoot(
function unstable_createBlockingRoot(
container: Element | Document | DocumentFragment | Comment,
options?: RootOptions,
): Root;
Expand All @@ -74,7 +74,7 @@ declare module '.' {
*
* @see https://reactjs.org/docs/concurrent-mode-reference.html#createroot
*/
function createRoot(container: Element | Document | DocumentFragment | Comment, options?: RootOptions): Root;
function unstable_createRoot(container: Element | Document | DocumentFragment | Comment, options?: RootOptions): Root;

function unstable_discreteUpdates<R>(callback: () => R): R;

Expand Down
4 changes: 2 additions & 2 deletions types/react-dom/test/experimental-tests.tsx
View file
Open in desktop
Expand Up @@ -3,7 +3,7 @@ import ReactDOM = require('react-dom');
import 'react-dom/experimental';

function createRoot() {
const root = ReactDOM.createRoot(document);
const root = ReactDOM.unstable_createRoot(document);

// NOTE: I don't know yet how to use this; this is just the type it expects
// in reality it will do nothing because the root isn't hydrate: true
Expand All @@ -15,7 +15,7 @@ function createRoot() {
}

function createBlockingRoot() {
const root = ReactDOM.createBlockingRoot(document, {
const root = ReactDOM.unstable_createBlockingRoot(document, {
hydrate: true,
});

Expand Down
6 changes: 3 additions & 3 deletions types/react/experimental.d.ts
View file
Open in desktop
Expand Up @@ -92,7 +92,7 @@ declare module '.' {
* @see https://reactjs.org/docs/concurrent-mode-reference.html#suspenselist
* @see https://reactjs.org/docs/concurrent-mode-patterns.html#suspenselist
*/
export const SuspenseList: ExoticComponent<SuspenseListProps>;
export const unstable_SuspenseList: ExoticComponent<SuspenseListProps>;

export interface SuspenseConfig extends TimeoutConfig {
busyDelayMs?: number;
Expand Down Expand Up @@ -143,7 +143,7 @@ declare module '.' {
*
* @see https://reactjs.org/docs/concurrent-mode-reference.html#usedeferredvalue
*/
export function useDeferredValue<T>(value: T, config?: TimeoutConfig | null): T;
export function unstable_useDeferredValue<T>(value: T, config?: TimeoutConfig | null): T;

/**
* Allows components to avoid undesirable loading states by waiting for content to load
Expand All @@ -162,5 +162,5 @@ declare module '.' {
*
* @see https://reactjs.org/docs/concurrent-mode-reference.html#usetransition
*/
export function useTransition(config?: SuspenseConfig | null): [TransitionStartFunction, boolean];
export function unstable_useTransition(config?: SuspenseConfig | null): [TransitionStartFunction, boolean];
}
10 changes: 5 additions & 5 deletions types/react/test/experimental.tsx
View file
Open in desktop
Expand Up @@ -5,26 +5,26 @@ import React = require('react');
function useExperimentalHooks() {
const [toggle, setToggle] = React.useState(false);

const [startTransition, done] = React.useTransition({ busyMinDurationMs: 100, busyDelayMs: 200, timeoutMs: 300 });
const [startTransition, done] = React.unstable_useTransition({ busyMinDurationMs: 100, busyDelayMs: 200, timeoutMs: 300 });
// $ExpectType boolean
done;

// $ExpectType boolean
const deferredToggle = React.useDeferredValue(toggle, { timeoutMs: 500 });
const deferredToggle = React.unstable_useDeferredValue(toggle, { timeoutMs: 500 });

const [func] = React.useState(() => () => 0);

// $ExpectType () => number
func;
// $ExpectType () => number
const deferredFunc = React.useDeferredValue(func);
const deferredFunc = React.unstable_useDeferredValue(func);

class Constructor {}
// $ExpectType typeof Constructor
const deferredConstructor = React.useDeferredValue(Constructor);
const deferredConstructor = React.unstable_useDeferredValue(Constructor);

// $ExpectType () => string
const deferredConstructible = React.useDeferredValue(Constructible);
const deferredConstructible = React.unstable_useDeferredValue(Constructible);

return () => {
startTransition(() => {
Expand Down