DefinitelyTyped · eps1lon · Aug 12, 2020 · Aug 12, 2020
@@ -1 +1 @@
-experimental.d.ts
+experimental.d.ts
@@ -0,0 +1 @@
+experimental.d.ts
@@ -0,0 +1,166 @@
+/**
+ * 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/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/experimental'
+ * ```
+ *
+ * It is also possible to include it through a triple-slash reference:
+ *
+ * ```ts
+ * /// <reference types="react/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/src/React.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__`.
+//
+// For the inputs of types exported as simply a fiber tag, the `beginWork` function of ReactFiberBeginWork.js
+// is a good place to start looking for details; it generally calls prop validation functions or delegates
+// all tasks done as part of the render phase (the concurrent part of the React update cycle).
+//
+// Suspense-related handling can be found in ReactFiberThrow.js.
+
+import React = require('.');
+
+export {};
+
+declare module '.' {
+    export type SuspenseListRevealOrder = 'forwards' | 'backwards' | 'together';
+    export type SuspenseListTailMode = 'collapsed' | 'hidden';
+
+    export interface SuspenseListCommonProps {
+        /**
+         * Note that SuspenseList require more than one child;
+         * it is a runtime warning to provide only a single child.
+         *
+         * It does, however, allow those children to be wrapped inside a single
+         * level of `<React.Fragment>`.
+         */
+        children: ReactElement | Iterable<ReactElement>;
+    }
+
+    interface DirectionalSuspenseListProps extends SuspenseListCommonProps {
+        /**
+         * Defines the order in which the `SuspenseList` children should be revealed.
+         */
+        revealOrder: 'forwards' | 'backwards';
+        /**
+         * Dictates how unloaded items in a SuspenseList is shown.
+         *
+         * - By default, `SuspenseList` will show all fallbacks in the list.
+         * - `collapsed` shows only the next fallback in the list.
+         * - `hidden` doesn’t show any unloaded items.
+         */
+        tail?: SuspenseListTailMode;
+    }
+
+    interface NonDirectionalSuspenseListProps extends SuspenseListCommonProps {
+        /**
+         * Defines the order in which the `SuspenseList` children should be revealed.
+         */
+        revealOrder?: Exclude<SuspenseListRevealOrder, DirectionalSuspenseListProps['revealOrder']>;
+        /**
+         * The tail property is invalid when not using the `forwards` or `backwards` reveal orders.
+         */
+        tail?: never;
+    }
+
+    export type SuspenseListProps = DirectionalSuspenseListProps | NonDirectionalSuspenseListProps;
+
+    /**
+     * `SuspenseList` helps coordinate many components that can suspend by orchestrating the order
+     * in which these components are revealed to the user.
+     *
+     * When multiple components need to fetch data, this data may arrive in an unpredictable order.
+     * However, if you wrap these items in a `SuspenseList`, React will not show an item in the list
+     * until previous items have been displayed (this behavior is adjustable).
+     *
+     * @see https://reactjs.org/docs/concurrent-mode-reference.html#suspenselist
+     * @see https://reactjs.org/docs/concurrent-mode-patterns.html#suspenselist
+     */
+    export const unstable_SuspenseList: ExoticComponent<SuspenseListProps>;
+
+    export interface SuspenseConfig extends TimeoutConfig {
+        busyDelayMs?: number;
+        busyMinDurationMs?: number;
+    }
+
+    // undocumented, considered for removal
+    export function unstable_withSuspenseConfig(
+        scope: () => void | undefined,
+        config: SuspenseConfig | null | undefined,
+    ): void;
+
+    export interface TimeoutConfig {
+        /**
+         * This timeout (in milliseconds) tells React how long to wait before showing the next state.
+         *
+         * React will always try to use a shorter lag when network and device allows it.
+         *
+         * **NOTE: We recommend that you share Suspense Config between different modules.**
+         */
+        timeoutMs: number;
+    }
+
+    // must be synchronous
+    export type TransitionFunction = () => void | undefined;
+    // strange definition to allow vscode to show documentation on the invocation
+    export interface TransitionStartFunction {
+        /**
+         * State updates caused inside the callback are allowed to be deferred.
+         *
+         * **If some state update causes a component to suspend, that state update should be wrapped in a transition.**
+         *
+         * @param callback A _synchronous_ function which causes state updates that can be deferred.
+         */
+        (callback: TransitionFunction): void;
+    }
+
+    /**
+     * Returns a deferred version of the value that may “lag behind” it for at most `timeoutMs`.
+     *
+     * This is commonly used to keep the interface responsive when you have something that renders immediately
+     * based on user input and something that needs to wait for a data fetch.
+     *
+     * A good example of this is a text input.
+     *
+     * @param value The value that is going to be deferred
+     * @param config An optional object with `timeoutMs`
+     *
+     * @see https://reactjs.org/docs/concurrent-mode-reference.html#usedeferredvalue
+     */
+    export function unstable_useDeferredValue<T>(value: T, config?: TimeoutConfig | null): T;
+
+    /**
+     * Allows components to avoid undesirable loading states by waiting for content to load
+     * before transitioning to the next screen. It also allows components to defer slower,
+     * data fetching updates until subsequent renders so that more crucial updates can be
+     * rendered immediately.
+     *
+     * The `useTransition` hook returns two values in an array.
+     *
+     * The first is a function that takes a callback. We can use it to tell React which state we want to defer.
+     * The seconda boolean. It’s React’s way of informing us whether we’re waiting for the transition to finish.
+     *
+     * **If some state update causes a component to suspend, that state update should be wrapped in a transition.**
+     *
+     * @param config An optional object with `timeoutMs`
+     *
+     * @see https://reactjs.org/docs/concurrent-mode-reference.html#usetransition
+     */
+    export function unstable_useTransition(config?: SuspenseConfig | null): [TransitionStartFunction, boolean];
+}
@@ -0,0 +1,151 @@
+/*
+React projects that don't include the DOM library need these interfaces to compile.
+React Native applications use React, but there is no DOM available. The JavaScript runtime
+is ES6/ES2015 only. These definitions allow such projects to compile with only `--lib ES6`.
+
+Warning: all of these interfaces are empty. If you want type definitions for various properties
+(such as HTMLInputElement.prototype.value), you need to add `--lib DOM` (via command line or tsconfig.json).
+*/
+
+interface Event { }
+interface AnimationEvent extends Event { }
+interface ClipboardEvent extends Event { }
+interface CompositionEvent extends Event { }
+interface DragEvent extends Event { }
+interface FocusEvent extends Event { }
+interface KeyboardEvent extends Event { }
+interface MouseEvent extends Event { }
+interface TouchEvent extends Event { }
+interface PointerEvent extends Event { }
+interface TransitionEvent extends Event { }
+interface UIEvent extends Event { }
+interface WheelEvent extends Event { }
+
+interface EventTarget { }
+interface Document { }
+interface DataTransfer { }
+interface StyleMedia { }
+
+interface Element { }
+interface DocumentFragment { }
+
+interface HTMLElement extends Element { }
+interface HTMLAnchorElement extends HTMLElement { }
+interface HTMLAreaElement extends HTMLElement { }
+interface HTMLAudioElement extends HTMLElement { }
+interface HTMLBaseElement extends HTMLElement { }
+interface HTMLBodyElement extends HTMLElement { }
+interface HTMLBRElement extends HTMLElement { }
+interface HTMLButtonElement extends HTMLElement { }
+interface HTMLCanvasElement extends HTMLElement { }
+interface HTMLDataElement extends HTMLElement { }
+interface HTMLDataListElement extends HTMLElement { }
+interface HTMLDialogElement extends HTMLElement { }
+interface HTMLDivElement extends HTMLElement { }
+interface HTMLDListElement extends HTMLElement { }
+interface HTMLEmbedElement extends HTMLElement { }
+interface HTMLFieldSetElement extends HTMLElement { }
+interface HTMLFormElement extends HTMLElement { }
+interface HTMLHeadingElement extends HTMLElement { }
+interface HTMLHeadElement extends HTMLElement { }
+interface HTMLHRElement extends HTMLElement { }
+interface HTMLHtmlElement extends HTMLElement { }
+interface HTMLIFrameElement extends HTMLElement { }
+interface HTMLImageElement extends HTMLElement { }
+interface HTMLInputElement extends HTMLElement { }
+interface HTMLModElement extends HTMLElement { }
+interface HTMLLabelElement extends HTMLElement { }
+interface HTMLLegendElement extends HTMLElement { }
+interface HTMLLIElement extends HTMLElement { }
+interface HTMLLinkElement extends HTMLElement { }
+interface HTMLMapElement extends HTMLElement { }
+interface HTMLMetaElement extends HTMLElement { }
+interface HTMLObjectElement extends HTMLElement { }
+interface HTMLOListElement extends HTMLElement { }
+interface HTMLOptGroupElement extends HTMLElement { }
+interface HTMLOptionElement extends HTMLElement { }
+interface HTMLParagraphElement extends HTMLElement { }
+interface HTMLParamElement extends HTMLElement { }
+interface HTMLPreElement extends HTMLElement { }
+interface HTMLProgressElement extends HTMLElement { }
+interface HTMLQuoteElement extends HTMLElement { }
+interface HTMLSlotElement extends HTMLElement { }
+interface HTMLScriptElement extends HTMLElement { }
+interface HTMLSelectElement extends HTMLElement { }
+interface HTMLSourceElement extends HTMLElement { }
+interface HTMLSpanElement extends HTMLElement { }
+interface HTMLStyleElement extends HTMLElement { }
+interface HTMLTableElement extends HTMLElement { }
+interface HTMLTableColElement extends HTMLElement { }
+interface HTMLTableDataCellElement extends HTMLElement { }
+interface HTMLTableHeaderCellElement extends HTMLElement { }
+interface HTMLTableRowElement extends HTMLElement { }
+interface HTMLTableSectionElement extends HTMLElement { }
+interface HTMLTemplateElement extends HTMLElement { }
+interface HTMLTextAreaElement extends HTMLElement { }
+interface HTMLTitleElement extends HTMLElement { }
+interface HTMLTrackElement extends HTMLElement { }
+interface HTMLUListElement extends HTMLElement { }
+interface HTMLVideoElement extends HTMLElement { }
+interface HTMLWebViewElement extends HTMLElement { }
+
+interface SVGElement extends Element { }
+interface SVGSVGElement extends SVGElement { }
+interface SVGCircleElement extends SVGElement { }
+interface SVGClipPathElement extends SVGElement { }
+interface SVGDefsElement extends SVGElement { }
+interface SVGDescElement extends SVGElement { }
+interface SVGEllipseElement extends SVGElement { }
+interface SVGFEBlendElement extends SVGElement { }
+interface SVGFEColorMatrixElement extends SVGElement { }
+interface SVGFEComponentTransferElement extends SVGElement { }
+interface SVGFECompositeElement extends SVGElement { }
+interface SVGFEConvolveMatrixElement extends SVGElement { }
+interface SVGFEDiffuseLightingElement extends SVGElement { }
+interface SVGFEDisplacementMapElement extends SVGElement { }
+interface SVGFEDistantLightElement extends SVGElement { }
+interface SVGFEDropShadowElement extends SVGElement { }
+interface SVGFEFloodElement extends SVGElement { }
+interface SVGFEFuncAElement extends SVGElement { }
+interface SVGFEFuncBElement extends SVGElement { }
+interface SVGFEFuncGElement extends SVGElement { }
+interface SVGFEFuncRElement extends SVGElement { }
+interface SVGFEGaussianBlurElement extends SVGElement { }
+interface SVGFEImageElement extends SVGElement { }
+interface SVGFEMergeElement extends SVGElement { }
+interface SVGFEMergeNodeElement extends SVGElement { }
+interface SVGFEMorphologyElement extends SVGElement { }
+interface SVGFEOffsetElement extends SVGElement { }
+interface SVGFEPointLightElement extends SVGElement { }
+interface SVGFESpecularLightingElement extends SVGElement { }
+interface SVGFESpotLightElement extends SVGElement { }
+interface SVGFETileElement extends SVGElement { }
+interface SVGFETurbulenceElement extends SVGElement { }
+interface SVGFilterElement extends SVGElement { }
+interface SVGForeignObjectElement extends SVGElement { }
+interface SVGGElement extends SVGElement { }
+interface SVGImageElement extends SVGElement { }
+interface SVGLineElement extends SVGElement { }
+interface SVGLinearGradientElement extends SVGElement { }
+interface SVGMarkerElement extends SVGElement { }
+interface SVGMaskElement extends SVGElement { }
+interface SVGMetadataElement extends SVGElement { }
+interface SVGPathElement extends SVGElement { }
+interface SVGPatternElement extends SVGElement { }
+interface SVGPolygonElement extends SVGElement { }
+interface SVGPolylineElement extends SVGElement { }
+interface SVGRadialGradientElement extends SVGElement { }
+interface SVGRectElement extends SVGElement { }
+interface SVGStopElement extends SVGElement { }
+interface SVGSwitchElement extends SVGElement { }
+interface SVGSymbolElement extends SVGElement { }
+interface SVGTextElement extends SVGElement { }
+interface SVGTextPathElement extends SVGElement { }
+interface SVGTSpanElement extends SVGElement { }
+interface SVGUseElement extends SVGElement { }
+interface SVGViewElement extends SVGElement { }
+
+interface Text { }
+interface TouchList { }
+interface WebGLRenderingContext { }
+interface WebGL2RenderingContext { }