mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2025-10-16 12:05:41 +00:00
f0016483a4
* [react] declare experimental APIs * [react] add jsdoc to experimental APIs based on the new Concurrent Mode docs * [react-dom] add declarations for experimental APIs * [react-dom, react] Add more documentation * [react-dom] fix compatibility with older typescript * [react-dom] fix file layout for CI * [react-dom] remove feature that was removed, add missing experimental feature * [react] don't try to guard against bug that will be fixed
103 lines
3.8 KiB
TypeScript
103 lines
3.8 KiB
TypeScript
/**
|
||
* These are types for things that are present in the `experimental` builds of React but not yet
|
||
* on a stable build.
|
||
*
|
||
* Once they are promoted to stable they can just be moved to the main index file.
|
||
*
|
||
* To load the types declared here in an actual project, there are three ways. The easiest one,
|
||
* if your `tsconfig.json` already has a `"types"` array in the `"compilerOptions"` section,
|
||
* is to add `"react-dom/experimental"` to the `"types"` array.
|
||
*
|
||
* Alternatively, a specific import syntax can to be used from a typescript file.
|
||
* This module does not exist in reality, which is why the {} is important:
|
||
*
|
||
* ```ts
|
||
* import {} from 'react-dom/experimental'
|
||
* ```
|
||
*
|
||
* It is also possible to include it through a triple-slash reference:
|
||
*
|
||
* ```ts
|
||
* /// <reference types="react-dom/experimental" />
|
||
* ```
|
||
*
|
||
* Either the import or the reference only needs to appear once, anywhere in the project.
|
||
*/
|
||
|
||
// See https://github.com/facebook/react/blob/master/packages/react-dom/src/client/ReactDOM.js to see how the exports are declared,
|
||
// and https://github.com/facebook/react/blob/master/packages/shared/ReactFeatureFlags.js to verify which APIs are
|
||
// flagged experimental or not. Experimental APIs will be tagged with `__EXPERIMENTAL__`.
|
||
|
||
import React = require('react');
|
||
import ReactDOM = require('.');
|
||
|
||
export {};
|
||
|
||
declare module '.' {
|
||
// enableSuspenseServerRenderer feature
|
||
interface HydrationOptions {
|
||
onHydrated?(suspenseInstance: Comment): void;
|
||
onDeleted?(suspenseInstance: Comment): void;
|
||
}
|
||
|
||
// exposeConcurrentModeAPIs features
|
||
|
||
interface RootOptions {
|
||
hydrate?: boolean;
|
||
hydrationOptions?: HydrationOptions;
|
||
}
|
||
|
||
interface Root {
|
||
render(children: React.ReactChild | React.ReactNodeArray, callback?: () => void): void;
|
||
unmount(callback?: () => void): void;
|
||
}
|
||
|
||
/**
|
||
* Replaces `ReactDOM.render` when the `.render` method is called and enables Blocking Mode.
|
||
*
|
||
* Opting into Concurrent Mode introduces semantic changes to how React works.
|
||
* This means that you can’t use Concurrent Mode in just a few components.
|
||
* Because of this, some apps may not be able to migrate directly to Concurrent Mode.
|
||
* Blocking Mode only contains a small subset of Concurrent Mode features and is intended
|
||
* as an intermediary migration step for apps that are unable to migrate directly.
|
||
*
|
||
* @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(
|
||
container: Element | Document | DocumentFragment | Comment,
|
||
options?: RootOptions,
|
||
): Root;
|
||
|
||
/**
|
||
* Replaces `ReactDOM.render` when the `.render` method is called and enables Concurrent Mode.
|
||
*
|
||
* @see https://reactjs.org/docs/concurrent-mode-reference.html#createroot
|
||
*/
|
||
function createRoot(container: Element | Document | DocumentFragment | Comment, options?: RootOptions): Root;
|
||
|
||
function unstable_discreteUpdates<R>(callback: () => R): R;
|
||
|
||
function unstable_discreteUpdates<R, A1>(callback: (a1: A1) => R, a1: A1): R;
|
||
|
||
function unstable_discreteUpdates<R, A1, A2>(callback: (a1: A1, a2: A2) => R, a1: A1, a2: A2): R;
|
||
|
||
function unstable_discreteUpdates<R, A1, A2, A3>(
|
||
callback: (a1: A1, a2: A2, a3: A3) => R,
|
||
a1: A1,
|
||
a2: A2,
|
||
a3: A3,
|
||
): R;
|
||
|
||
function unstable_flushDiscreteUpdates(): void;
|
||
|
||
function unstable_flushControlled(callback: () => void): void;
|
||
|
||
// enableSelectiveHydration feature
|
||
|
||
/**
|
||
* @see https://github.com/facebook/react/commit/3a2b5f148d450c69aab67f055fc441d294c23518
|
||
*/
|
||
function unstable_scheduleHydration(target: Element | Document | DocumentFragment | Comment): void;
|
||
}
|