mirror of
https://github.com/denoland/deno.git
synced 2024-12-29 02:29:06 -05:00
3841 lines
126 KiB
TypeScript
3841 lines
126 KiB
TypeScript
// These types are adapted from
|
||
// https://github.com/DefinitelyTyped/DefinitelyTyped to work under Deno.
|
||
//
|
||
// Type definitions for React 16.9
|
||
// Project: http://facebook.github.io/react/
|
||
// Definitions by: Asana <https://asana.com>
|
||
// AssureSign <http://www.assuresign.com>
|
||
// Microsoft <https://microsoft.com>
|
||
// John Reilly <https://github.com/johnnyreilly>
|
||
// Benoit Benezech <https://github.com/bbenezech>
|
||
// Patricio Zavolinsky <https://github.com/pzavolinsky>
|
||
// Digiguru <https://github.com/digiguru>
|
||
// Eric Anderson <https://github.com/ericanderson>
|
||
// Dovydas Navickas <https://github.com/DovydasNavickas>
|
||
// Josh Rutherford <https://github.com/theruther4d>
|
||
// Guilherme Hübner <https://github.com/guilhermehubner>
|
||
// Ferdy Budhidharma <https://github.com/ferdaber>
|
||
// Johann Rakotoharisoa <https://github.com/jrakotoharisoa>
|
||
// Olivier Pascal <https://github.com/pascaloliv>
|
||
// Martin Hochel <https://github.com/hotell>
|
||
// Frank Li <https://github.com/franklixuefei>
|
||
// Jessica Franco <https://github.com/Jessidhia>
|
||
// Saransh Kataria <https://github.com/saranshkataria>
|
||
// Kanitkorn Sujautra <https://github.com/lukyth>
|
||
// Sebastian Silbermann <https://github.com/eps1lon>
|
||
// Kyle Scully <https://github.com/zieka>
|
||
// Cong Zhang <https://github.com/dancerphil>
|
||
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
||
|
||
/* eslint-disable */
|
||
|
||
import "./react/react_global.d.ts";
|
||
|
||
import * as CSS from "./react/csstype.d.ts";
|
||
import * as PropTypes from "./react/prop-types.d.ts";
|
||
|
||
type NativeAnimationEvent = AnimationEvent;
|
||
type NativeClipboardEvent = ClipboardEvent;
|
||
type NativeCompositionEvent = CompositionEvent;
|
||
type NativeDragEvent = DragEvent;
|
||
type NativeFocusEvent = FocusEvent;
|
||
type NativeKeyboardEvent = KeyboardEvent;
|
||
type NativeMouseEvent = MouseEvent;
|
||
type NativeTouchEvent = TouchEvent;
|
||
type NativePointerEvent = PointerEvent;
|
||
type NativeTransitionEvent = TransitionEvent;
|
||
type NativeUIEvent = UIEvent;
|
||
type NativeWheelEvent = WheelEvent;
|
||
type Booleanish = boolean | "true" | "false";
|
||
|
||
/**
|
||
* defined in scheduler/tracing
|
||
*/
|
||
interface SchedulerInteraction {
|
||
id: number;
|
||
name: string;
|
||
timestamp: number;
|
||
}
|
||
|
||
// tslint:disable-next-line:export-just-namespace
|
||
export = React;
|
||
export as namespace React;
|
||
|
||
declare namespace React {
|
||
//
|
||
// React Elements
|
||
// ----------------------------------------------------------------------
|
||
|
||
type ElementType<P = any> =
|
||
| {
|
||
[K in keyof JSX.IntrinsicElements]: P extends JSX.IntrinsicElements[K]
|
||
? K
|
||
: never;
|
||
}[keyof JSX.IntrinsicElements]
|
||
| ComponentType<P>;
|
||
/**
|
||
* @deprecated Please use `ElementType`
|
||
*/
|
||
type ReactType<P = any> = ElementType<P>;
|
||
type ComponentType<P = {}> = ComponentClass<P> | FunctionComponent<P>;
|
||
|
||
type JSXElementConstructor<P> =
|
||
| ((props: P) => ReactElement | null)
|
||
| (new (props: P) => Component<P, any>);
|
||
|
||
type Key = string | number;
|
||
|
||
interface RefObject<T> {
|
||
readonly current: T | null;
|
||
}
|
||
|
||
type Ref<T> =
|
||
| { bivarianceHack(instance: T | null): void }["bivarianceHack"]
|
||
| RefObject<T>
|
||
| null;
|
||
type LegacyRef<T> = string | Ref<T>;
|
||
|
||
type ComponentState = any;
|
||
|
||
/**
|
||
* @internal You shouldn't need to use this type since you never see these attributes
|
||
* inside your component or have to validate them.
|
||
*/
|
||
interface Attributes {
|
||
key?: Key;
|
||
}
|
||
interface RefAttributes<T> extends Attributes {
|
||
ref?: Ref<T>;
|
||
}
|
||
interface ClassAttributes<T> extends Attributes {
|
||
ref?: LegacyRef<T>;
|
||
}
|
||
|
||
interface ReactElement<
|
||
P = any,
|
||
T extends string | JSXElementConstructor<any> =
|
||
| string
|
||
| JSXElementConstructor<any>
|
||
> {
|
||
type: T;
|
||
props: P;
|
||
key: Key | null;
|
||
}
|
||
|
||
interface ReactComponentElement<
|
||
T extends keyof JSX.IntrinsicElements | JSXElementConstructor<any>,
|
||
P = Pick<ComponentProps<T>, Exclude<keyof ComponentProps<T>, "key" | "ref">>
|
||
> extends ReactElement<P, T> {}
|
||
|
||
/**
|
||
* @deprecated Please use `FunctionComponentElement`
|
||
*/
|
||
type SFCElement<P> = FunctionComponentElement<P>;
|
||
|
||
interface FunctionComponentElement<P>
|
||
extends ReactElement<P, FunctionComponent<P>> {
|
||
ref?: "ref" extends keyof P
|
||
? P extends { ref?: infer R }
|
||
? R
|
||
: never
|
||
: never;
|
||
}
|
||
|
||
type CElement<P, T extends Component<P, ComponentState>> = ComponentElement<
|
||
P,
|
||
T
|
||
>;
|
||
interface ComponentElement<P, T extends Component<P, ComponentState>>
|
||
extends ReactElement<P, ComponentClass<P>> {
|
||
ref?: LegacyRef<T>;
|
||
}
|
||
|
||
type ClassicElement<P> = CElement<P, ClassicComponent<P, ComponentState>>;
|
||
|
||
// string fallback for custom web-components
|
||
interface DOMElement<
|
||
P extends HTMLAttributes<T> | SVGAttributes<T>,
|
||
T extends Element
|
||
> extends ReactElement<P, string> {
|
||
ref: LegacyRef<T>;
|
||
}
|
||
|
||
// ReactHTML for ReactHTMLElement
|
||
// tslint:disable-next-line:no-empty-interface
|
||
interface ReactHTMLElement<T extends HTMLElement>
|
||
extends DetailedReactHTMLElement<AllHTMLAttributes<T>, T> {}
|
||
|
||
interface DetailedReactHTMLElement<
|
||
P extends HTMLAttributes<T>,
|
||
T extends HTMLElement
|
||
> extends DOMElement<P, T> {
|
||
type: keyof ReactHTML;
|
||
}
|
||
|
||
// ReactSVG for ReactSVGElement
|
||
interface ReactSVGElement
|
||
extends DOMElement<SVGAttributes<SVGElement>, SVGElement> {
|
||
type: keyof ReactSVG;
|
||
}
|
||
|
||
interface ReactPortal extends ReactElement {
|
||
key: Key | null;
|
||
children: ReactNode;
|
||
}
|
||
|
||
//
|
||
// Factories
|
||
// ----------------------------------------------------------------------
|
||
|
||
type Factory<P> = (
|
||
props?: Attributes & P,
|
||
...children: ReactNode[]
|
||
) => ReactElement<P>;
|
||
|
||
/**
|
||
* @deprecated Please use `FunctionComponentFactory`
|
||
*/
|
||
type SFCFactory<P> = FunctionComponentFactory<P>;
|
||
|
||
type FunctionComponentFactory<P> = (
|
||
props?: Attributes & P,
|
||
...children: ReactNode[]
|
||
) => FunctionComponentElement<P>;
|
||
|
||
type ComponentFactory<P, T extends Component<P, ComponentState>> = (
|
||
props?: ClassAttributes<T> & P,
|
||
...children: ReactNode[]
|
||
) => CElement<P, T>;
|
||
|
||
type CFactory<P, T extends Component<P, ComponentState>> = ComponentFactory<
|
||
P,
|
||
T
|
||
>;
|
||
type ClassicFactory<P> = CFactory<P, ClassicComponent<P, ComponentState>>;
|
||
|
||
type DOMFactory<P extends DOMAttributes<T>, T extends Element> = (
|
||
props?: (ClassAttributes<T> & P) | null,
|
||
...children: ReactNode[]
|
||
) => DOMElement<P, T>;
|
||
|
||
// tslint:disable-next-line:no-empty-interface
|
||
interface HTMLFactory<T extends HTMLElement>
|
||
extends DetailedHTMLFactory<AllHTMLAttributes<T>, T> {}
|
||
|
||
interface DetailedHTMLFactory<
|
||
P extends HTMLAttributes<T>,
|
||
T extends HTMLElement
|
||
> extends DOMFactory<P, T> {
|
||
(
|
||
props?: (ClassAttributes<T> & P) | null,
|
||
...children: ReactNode[]
|
||
): DetailedReactHTMLElement<P, T>;
|
||
}
|
||
|
||
interface SVGFactory
|
||
extends DOMFactory<SVGAttributes<SVGElement>, SVGElement> {
|
||
(
|
||
props?: (ClassAttributes<SVGElement> & SVGAttributes<SVGElement>) | null,
|
||
...children: ReactNode[]
|
||
): ReactSVGElement;
|
||
}
|
||
|
||
//
|
||
// React Nodes
|
||
// http://facebook.github.io/react/docs/glossary.html
|
||
// ----------------------------------------------------------------------
|
||
|
||
type ReactText = string | number;
|
||
type ReactChild = ReactElement | ReactText;
|
||
|
||
interface ReactNodeArray extends Array<ReactNode> {}
|
||
type ReactFragment = {} | ReactNodeArray;
|
||
type ReactNode =
|
||
| ReactChild
|
||
| ReactFragment
|
||
| ReactPortal
|
||
| boolean
|
||
| null
|
||
| undefined;
|
||
|
||
//
|
||
// Top Level API
|
||
// ----------------------------------------------------------------------
|
||
|
||
// DOM Elements
|
||
function createFactory<T extends HTMLElement>(
|
||
type: keyof ReactHTML
|
||
): HTMLFactory<T>;
|
||
function createFactory(type: keyof ReactSVG): SVGFactory;
|
||
function createFactory<P extends DOMAttributes<T>, T extends Element>(
|
||
type: string
|
||
): DOMFactory<P, T>;
|
||
|
||
// Custom components
|
||
function createFactory<P>(
|
||
type: FunctionComponent<P>
|
||
): FunctionComponentFactory<P>;
|
||
function createFactory<P>(
|
||
type: ClassType<
|
||
P,
|
||
ClassicComponent<P, ComponentState>,
|
||
ClassicComponentClass<P>
|
||
>
|
||
): CFactory<P, ClassicComponent<P, ComponentState>>;
|
||
function createFactory<
|
||
P,
|
||
T extends Component<P, ComponentState>,
|
||
C extends ComponentClass<P>
|
||
>(type: ClassType<P, T, C>): CFactory<P, T>;
|
||
function createFactory<P>(type: ComponentClass<P>): Factory<P>;
|
||
|
||
// DOM Elements
|
||
// TODO: generalize this to everything in `keyof ReactHTML`, not just "input"
|
||
function createElement(
|
||
type: "input",
|
||
props?:
|
||
| (InputHTMLAttributes<HTMLInputElement> &
|
||
ClassAttributes<HTMLInputElement>)
|
||
| null,
|
||
...children: ReactNode[]
|
||
): DetailedReactHTMLElement<
|
||
InputHTMLAttributes<HTMLInputElement>,
|
||
HTMLInputElement
|
||
>;
|
||
function createElement<P extends HTMLAttributes<T>, T extends HTMLElement>(
|
||
type: keyof ReactHTML,
|
||
props?: (ClassAttributes<T> & P) | null,
|
||
...children: ReactNode[]
|
||
): DetailedReactHTMLElement<P, T>;
|
||
function createElement<P extends SVGAttributes<T>, T extends SVGElement>(
|
||
type: keyof ReactSVG,
|
||
props?: (ClassAttributes<T> & P) | null,
|
||
...children: ReactNode[]
|
||
): ReactSVGElement;
|
||
function createElement<P extends DOMAttributes<T>, T extends Element>(
|
||
type: string,
|
||
props?: (ClassAttributes<T> & P) | null,
|
||
...children: ReactNode[]
|
||
): DOMElement<P, T>;
|
||
|
||
// Custom components
|
||
|
||
function createElement<P extends {}>(
|
||
type: FunctionComponent<P>,
|
||
props?: (Attributes & P) | null,
|
||
...children: ReactNode[]
|
||
): FunctionComponentElement<P>;
|
||
function createElement<P extends {}>(
|
||
type: ClassType<
|
||
P,
|
||
ClassicComponent<P, ComponentState>,
|
||
ClassicComponentClass<P>
|
||
>,
|
||
props?: (ClassAttributes<ClassicComponent<P, ComponentState>> & P) | null,
|
||
...children: ReactNode[]
|
||
): CElement<P, ClassicComponent<P, ComponentState>>;
|
||
function createElement<
|
||
P extends {},
|
||
T extends Component<P, ComponentState>,
|
||
C extends ComponentClass<P>
|
||
>(
|
||
type: ClassType<P, T, C>,
|
||
props?: (ClassAttributes<T> & P) | null,
|
||
...children: ReactNode[]
|
||
): CElement<P, T>;
|
||
function createElement<P extends {}>(
|
||
type: FunctionComponent<P> | ComponentClass<P> | string,
|
||
props?: (Attributes & P) | null,
|
||
...children: ReactNode[]
|
||
): ReactElement<P>;
|
||
|
||
// DOM Elements
|
||
// ReactHTMLElement
|
||
function cloneElement<P extends HTMLAttributes<T>, T extends HTMLElement>(
|
||
element: DetailedReactHTMLElement<P, T>,
|
||
props?: P,
|
||
...children: ReactNode[]
|
||
): DetailedReactHTMLElement<P, T>;
|
||
// ReactHTMLElement, less specific
|
||
function cloneElement<P extends HTMLAttributes<T>, T extends HTMLElement>(
|
||
element: ReactHTMLElement<T>,
|
||
props?: P,
|
||
...children: ReactNode[]
|
||
): ReactHTMLElement<T>;
|
||
// SVGElement
|
||
function cloneElement<P extends SVGAttributes<T>, T extends SVGElement>(
|
||
element: ReactSVGElement,
|
||
props?: P,
|
||
...children: ReactNode[]
|
||
): ReactSVGElement;
|
||
// DOM Element (has to be the last, because type checking stops at first overload that fits)
|
||
function cloneElement<P extends DOMAttributes<T>, T extends Element>(
|
||
element: DOMElement<P, T>,
|
||
props?: DOMAttributes<T> & P,
|
||
...children: ReactNode[]
|
||
): DOMElement<P, T>;
|
||
|
||
// Custom components
|
||
function cloneElement<P>(
|
||
element: FunctionComponentElement<P>,
|
||
props?: Partial<P> & Attributes,
|
||
...children: ReactNode[]
|
||
): FunctionComponentElement<P>;
|
||
function cloneElement<P, T extends Component<P, ComponentState>>(
|
||
element: CElement<P, T>,
|
||
props?: Partial<P> & ClassAttributes<T>,
|
||
...children: ReactNode[]
|
||
): CElement<P, T>;
|
||
function cloneElement<P>(
|
||
element: ReactElement<P>,
|
||
props?: Partial<P> & Attributes,
|
||
...children: ReactNode[]
|
||
): ReactElement<P>;
|
||
|
||
// Context via RenderProps
|
||
interface ProviderProps<T> {
|
||
value: T;
|
||
children?: ReactNode;
|
||
}
|
||
|
||
interface ConsumerProps<T> {
|
||
children: (value: T) => ReactNode;
|
||
unstable_observedBits?: number;
|
||
}
|
||
|
||
// TODO: similar to how Fragment is actually a symbol, the values returned from createContext,
|
||
// forwardRef and memo are actually objects that are treated specially by the renderer; see:
|
||
// https://github.com/facebook/react/blob/v16.6.0/packages/react/src/ReactContext.js#L35-L48
|
||
// https://github.com/facebook/react/blob/v16.6.0/packages/react/src/forwardRef.js#L42-L45
|
||
// https://github.com/facebook/react/blob/v16.6.0/packages/react/src/memo.js#L27-L31
|
||
// However, we have no way of telling the JSX parser that it's a JSX element type or its props other than
|
||
// by pretending to be a normal component.
|
||
//
|
||
// We don't just use ComponentType or SFC types because you are not supposed to attach statics to this
|
||
// object, but rather to the original function.
|
||
interface ExoticComponent<P = {}> {
|
||
/**
|
||
* **NOTE**: Exotic components are not callable.
|
||
*/
|
||
(props: P): ReactElement | null;
|
||
readonly $$typeof: symbol;
|
||
}
|
||
|
||
interface NamedExoticComponent<P = {}> extends ExoticComponent<P> {
|
||
displayName?: string;
|
||
}
|
||
|
||
interface ProviderExoticComponent<P> extends ExoticComponent<P> {
|
||
propTypes?: WeakValidationMap<P>;
|
||
}
|
||
|
||
type ContextType<C extends Context<any>> = C extends Context<infer T>
|
||
? T
|
||
: never;
|
||
|
||
// NOTE: only the Context object itself can get a displayName
|
||
// https://github.com/facebook/react-devtools/blob/e0b854e4c/backend/attachRendererFiber.js#L310-L325
|
||
type Provider<T> = ProviderExoticComponent<ProviderProps<T>>;
|
||
type Consumer<T> = ExoticComponent<ConsumerProps<T>>;
|
||
interface Context<T> {
|
||
Provider: Provider<T>;
|
||
Consumer: Consumer<T>;
|
||
displayName?: string;
|
||
}
|
||
function createContext<T>(
|
||
// If you thought this should be optional, see
|
||
// https://github.com/DefinitelyTyped/DefinitelyTyped/pull/24509#issuecomment-382213106
|
||
defaultValue: T,
|
||
calculateChangedBits?: (prev: T, next: T) => number
|
||
): Context<T>;
|
||
|
||
function isValidElement<P>(
|
||
object: {} | null | undefined
|
||
): object is ReactElement<P>;
|
||
|
||
const Children: ReactChildren;
|
||
const Fragment: ExoticComponent<{ children?: ReactNode }>;
|
||
const StrictMode: ExoticComponent<{ children?: ReactNode }>;
|
||
|
||
interface SuspenseProps {
|
||
children?: ReactNode;
|
||
|
||
/** A fallback react tree to show when a Suspense child (like React.lazy) suspends */
|
||
fallback: NonNullable<ReactNode> | null;
|
||
/**
|
||
* Tells React whether to “skip” revealing this boundary during the initial load.
|
||
* This API will likely be removed in a future release.
|
||
*/
|
||
// NOTE: this is unflagged and is respected even in stable builds
|
||
unstable_avoidThisFallback?: boolean;
|
||
}
|
||
/**
|
||
* This feature is not yet available for server-side rendering.
|
||
* Suspense support will be added in a later release.
|
||
*/
|
||
const Suspense: ExoticComponent<SuspenseProps>;
|
||
const version: string;
|
||
|
||
/**
|
||
* {@link https://github.com/bvaughn/rfcs/blob/profiler/text/0000-profiler.md#detailed-design | API}
|
||
*/
|
||
type ProfilerOnRenderCallback = (
|
||
id: string,
|
||
phase: "mount" | "update",
|
||
actualDuration: number,
|
||
baseDuration: number,
|
||
startTime: number,
|
||
commitTime: number,
|
||
interactions: Set<SchedulerInteraction>
|
||
) => void;
|
||
interface ProfilerProps {
|
||
children?: ReactNode;
|
||
id: string;
|
||
onRender: ProfilerOnRenderCallback;
|
||
}
|
||
|
||
const Profiler: ExoticComponent<ProfilerProps>;
|
||
|
||
//
|
||
// Component API
|
||
// ----------------------------------------------------------------------
|
||
|
||
type ReactInstance = Component<any> | Element;
|
||
|
||
// Base component for plain JS classes
|
||
// tslint:disable-next-line:no-empty-interface
|
||
interface Component<P = {}, S = {}, SS = any>
|
||
extends ComponentLifecycle<P, S, SS> {}
|
||
class Component<P, S> {
|
||
// tslint won't let me format the sample code in a way that vscode likes it :(
|
||
/**
|
||
* If set, `this.context` will be set at runtime to the current value of the given Context.
|
||
*
|
||
* Usage:
|
||
*
|
||
* ```ts
|
||
* type MyContext = number
|
||
* const Ctx = React.createContext<MyContext>(0)
|
||
*
|
||
* class Foo extends React.Component {
|
||
* static contextType = Ctx
|
||
* context!: React.ContextType<typeof Ctx>
|
||
* render () {
|
||
* return <>My context's value: {this.context}</>;
|
||
* }
|
||
* }
|
||
* ```
|
||
*
|
||
* @see https://reactjs.org/docs/context.html#classcontexttype
|
||
*/
|
||
static contextType?: Context<any>;
|
||
|
||
/**
|
||
* If using the new style context, re-declare this in your class to be the
|
||
* `React.ContextType` of your `static contextType`.
|
||
* Should be used with type annotation or static contextType.
|
||
*
|
||
* ```ts
|
||
* static contextType = MyContext
|
||
* // For TS pre-3.7:
|
||
* context!: React.ContextType<typeof MyContext>
|
||
* // For TS 3.7 and above:
|
||
* declare context: React.ContextType<typeof MyContext>
|
||
* ```
|
||
*
|
||
* @see https://reactjs.org/docs/context.html
|
||
*/
|
||
// TODO (TypeScript 3.0): unknown
|
||
context: any;
|
||
|
||
constructor(props: Readonly<P>);
|
||
/**
|
||
* @deprecated
|
||
* @see https://reactjs.org/docs/legacy-context.html
|
||
*/
|
||
constructor(props: P, context?: any);
|
||
|
||
// We MUST keep setState() as a unified signature because it allows proper checking of the method return type.
|
||
// See: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/18365#issuecomment-351013257
|
||
// Also, the ` | S` allows intellisense to not be dumbisense
|
||
setState<K extends keyof S>(
|
||
state:
|
||
| ((
|
||
prevState: Readonly<S>,
|
||
props: Readonly<P>
|
||
) => Pick<S, K> | S | null)
|
||
| (Pick<S, K> | S | null),
|
||
callback?: () => void
|
||
): void;
|
||
|
||
forceUpdate(callback?: () => void): void;
|
||
render(): ReactNode;
|
||
|
||
// React.Props<T> is now deprecated, which means that the `children`
|
||
// property is not available on `P` by default, even though you can
|
||
// always pass children as variadic arguments to `createElement`.
|
||
// In the future, if we can define its call signature conditionally
|
||
// on the existence of `children` in `P`, then we should remove this.
|
||
readonly props: Readonly<P> & Readonly<{ children?: ReactNode }>;
|
||
state: Readonly<S>;
|
||
/**
|
||
* @deprecated
|
||
* https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs
|
||
*/
|
||
refs: {
|
||
[key: string]: ReactInstance;
|
||
};
|
||
}
|
||
|
||
class PureComponent<P = {}, S = {}, SS = any> extends Component<P, S, SS> {}
|
||
|
||
interface ClassicComponent<P = {}, S = {}> extends Component<P, S> {
|
||
replaceState(nextState: S, callback?: () => void): void;
|
||
isMounted(): boolean;
|
||
getInitialState?(): S;
|
||
}
|
||
|
||
interface ChildContextProvider<CC> {
|
||
getChildContext(): CC;
|
||
}
|
||
|
||
//
|
||
// Class Interfaces
|
||
// ----------------------------------------------------------------------
|
||
|
||
/**
|
||
* @deprecated as of recent React versions, function components can no
|
||
* longer be considered 'stateless'. Please use `FunctionComponent` instead.
|
||
*
|
||
* @see [React Hooks](https://reactjs.org/docs/hooks-intro.html)
|
||
*/
|
||
type SFC<P = {}> = FunctionComponent<P>;
|
||
|
||
/**
|
||
* @deprecated as of recent React versions, function components can no
|
||
* longer be considered 'stateless'. Please use `FunctionComponent` instead.
|
||
*
|
||
* @see [React Hooks](https://reactjs.org/docs/hooks-intro.html)
|
||
*/
|
||
type StatelessComponent<P = {}> = FunctionComponent<P>;
|
||
|
||
type FC<P = {}> = FunctionComponent<P>;
|
||
|
||
interface FunctionComponent<P = {}> {
|
||
(props: PropsWithChildren<P>, context?: any): ReactElement | null;
|
||
propTypes?: WeakValidationMap<P>;
|
||
contextTypes?: ValidationMap<any>;
|
||
defaultProps?: Partial<P>;
|
||
displayName?: string;
|
||
}
|
||
|
||
interface RefForwardingComponent<T, P = {}> {
|
||
(props: PropsWithChildren<P>, ref: Ref<T>): ReactElement | null;
|
||
propTypes?: WeakValidationMap<P>;
|
||
contextTypes?: ValidationMap<any>;
|
||
defaultProps?: Partial<P>;
|
||
displayName?: string;
|
||
}
|
||
|
||
interface ComponentClass<P = {}, S = ComponentState>
|
||
extends StaticLifecycle<P, S> {
|
||
new (props: P, context?: any): Component<P, S>;
|
||
propTypes?: WeakValidationMap<P>;
|
||
contextType?: Context<any>;
|
||
contextTypes?: ValidationMap<any>;
|
||
childContextTypes?: ValidationMap<any>;
|
||
defaultProps?: Partial<P>;
|
||
displayName?: string;
|
||
}
|
||
|
||
interface ClassicComponentClass<P = {}> extends ComponentClass<P> {
|
||
new (props: P, context?: any): ClassicComponent<P, ComponentState>;
|
||
getDefaultProps?(): P;
|
||
}
|
||
|
||
/**
|
||
* We use an intersection type to infer multiple type parameters from
|
||
* a single argument, which is useful for many top-level API defs.
|
||
* See https://github.com/Microsoft/TypeScript/issues/7234 for more info.
|
||
*/
|
||
type ClassType<
|
||
P,
|
||
T extends Component<P, ComponentState>,
|
||
C extends ComponentClass<P>
|
||
> = C & (new (props: P, context?: any) => T);
|
||
|
||
//
|
||
// Component Specs and Lifecycle
|
||
// ----------------------------------------------------------------------
|
||
|
||
// This should actually be something like `Lifecycle<P, S> | DeprecatedLifecycle<P, S>`,
|
||
// as React will _not_ call the deprecated lifecycle methods if any of the new lifecycle
|
||
// methods are present.
|
||
interface ComponentLifecycle<P, S, SS = any>
|
||
extends NewLifecycle<P, S, SS>,
|
||
DeprecatedLifecycle<P, S> {
|
||
/**
|
||
* Called immediately after a component is mounted. Setting state here will trigger re-rendering.
|
||
*/
|
||
componentDidMount?(): void;
|
||
/**
|
||
* Called to determine whether the change in props and state should trigger a re-render.
|
||
*
|
||
* `Component` always returns true.
|
||
* `PureComponent` implements a shallow comparison on props and state and returns true if any
|
||
* props or states have changed.
|
||
*
|
||
* If false is returned, `Component#render`, `componentWillUpdate`
|
||
* and `componentDidUpdate` will not be called.
|
||
*/
|
||
shouldComponentUpdate?(
|
||
nextProps: Readonly<P>,
|
||
nextState: Readonly<S>,
|
||
nextContext: any
|
||
): boolean;
|
||
/**
|
||
* Called immediately before a component is destroyed. Perform any necessary cleanup in this method, such as
|
||
* cancelled network requests, or cleaning up any DOM elements created in `componentDidMount`.
|
||
*/
|
||
componentWillUnmount?(): void;
|
||
/**
|
||
* Catches exceptions generated in descendant components. Unhandled exceptions will cause
|
||
* the entire component tree to unmount.
|
||
*/
|
||
componentDidCatch?(error: Error, errorInfo: ErrorInfo): void;
|
||
}
|
||
|
||
// Unfortunately, we have no way of declaring that the component constructor must implement this
|
||
interface StaticLifecycle<P, S> {
|
||
getDerivedStateFromProps?: GetDerivedStateFromProps<P, S>;
|
||
getDerivedStateFromError?: GetDerivedStateFromError<P, S>;
|
||
}
|
||
|
||
type GetDerivedStateFromProps<P, S> =
|
||
/**
|
||
* Returns an update to a component's state based on its new props and old state.
|
||
*
|
||
* Note: its presence prevents any of the deprecated lifecycle methods from being invoked
|
||
*/
|
||
(nextProps: Readonly<P>, prevState: S) => Partial<S> | null;
|
||
|
||
type GetDerivedStateFromError<P, S> =
|
||
/**
|
||
* This lifecycle is invoked after an error has been thrown by a descendant component.
|
||
* It receives the error that was thrown as a parameter and should return a value to update state.
|
||
*
|
||
* Note: its presence prevents any of the deprecated lifecycle methods from being invoked
|
||
*/
|
||
(error: any) => Partial<S> | null;
|
||
|
||
// This should be "infer SS" but can't use it yet
|
||
interface NewLifecycle<P, S, SS> {
|
||
/**
|
||
* Runs before React applies the result of `render` to the document, and
|
||
* returns an object to be given to componentDidUpdate. Useful for saving
|
||
* things such as scroll position before `render` causes changes to it.
|
||
*
|
||
* Note: the presence of getSnapshotBeforeUpdate prevents any of the deprecated
|
||
* lifecycle events from running.
|
||
*/
|
||
getSnapshotBeforeUpdate?(
|
||
prevProps: Readonly<P>,
|
||
prevState: Readonly<S>
|
||
): SS | null;
|
||
/**
|
||
* Called immediately after updating occurs. Not called for the initial render.
|
||
*
|
||
* The snapshot is only present if getSnapshotBeforeUpdate is present and returns non-null.
|
||
*/
|
||
componentDidUpdate?(
|
||
prevProps: Readonly<P>,
|
||
prevState: Readonly<S>,
|
||
snapshot?: SS
|
||
): void;
|
||
}
|
||
|
||
interface DeprecatedLifecycle<P, S> {
|
||
/**
|
||
* Called immediately before mounting occurs, and before `Component#render`.
|
||
* Avoid introducing any side-effects or subscriptions in this method.
|
||
*
|
||
* Note: the presence of getSnapshotBeforeUpdate or getDerivedStateFromProps
|
||
* prevents this from being invoked.
|
||
*
|
||
* @deprecated 16.3, use componentDidMount or the constructor instead; will stop working in React 17
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#initializing-state
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path
|
||
*/
|
||
componentWillMount?(): void;
|
||
/**
|
||
* Called immediately before mounting occurs, and before `Component#render`.
|
||
* Avoid introducing any side-effects or subscriptions in this method.
|
||
*
|
||
* This method will not stop working in React 17.
|
||
*
|
||
* Note: the presence of getSnapshotBeforeUpdate or getDerivedStateFromProps
|
||
* prevents this from being invoked.
|
||
*
|
||
* @deprecated 16.3, use componentDidMount or the constructor instead
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#initializing-state
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path
|
||
*/
|
||
UNSAFE_componentWillMount?(): void;
|
||
/**
|
||
* Called when the component may be receiving new props.
|
||
* React may call this even if props have not changed, so be sure to compare new and existing
|
||
* props if you only want to handle changes.
|
||
*
|
||
* Calling `Component#setState` generally does not trigger this method.
|
||
*
|
||
* Note: the presence of getSnapshotBeforeUpdate or getDerivedStateFromProps
|
||
* prevents this from being invoked.
|
||
*
|
||
* @deprecated 16.3, use static getDerivedStateFromProps instead; will stop working in React 17
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#updating-state-based-on-props
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path
|
||
*/
|
||
componentWillReceiveProps?(nextProps: Readonly<P>, nextContext: any): void;
|
||
/**
|
||
* Called when the component may be receiving new props.
|
||
* React may call this even if props have not changed, so be sure to compare new and existing
|
||
* props if you only want to handle changes.
|
||
*
|
||
* Calling `Component#setState` generally does not trigger this method.
|
||
*
|
||
* This method will not stop working in React 17.
|
||
*
|
||
* Note: the presence of getSnapshotBeforeUpdate or getDerivedStateFromProps
|
||
* prevents this from being invoked.
|
||
*
|
||
* @deprecated 16.3, use static getDerivedStateFromProps instead
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#updating-state-based-on-props
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path
|
||
*/
|
||
UNSAFE_componentWillReceiveProps?(
|
||
nextProps: Readonly<P>,
|
||
nextContext: any
|
||
): void;
|
||
/**
|
||
* Called immediately before rendering when new props or state is received. Not called for the initial render.
|
||
*
|
||
* Note: You cannot call `Component#setState` here.
|
||
*
|
||
* Note: the presence of getSnapshotBeforeUpdate or getDerivedStateFromProps
|
||
* prevents this from being invoked.
|
||
*
|
||
* @deprecated 16.3, use getSnapshotBeforeUpdate instead; will stop working in React 17
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#reading-dom-properties-before-an-update
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path
|
||
*/
|
||
componentWillUpdate?(
|
||
nextProps: Readonly<P>,
|
||
nextState: Readonly<S>,
|
||
nextContext: any
|
||
): void;
|
||
/**
|
||
* Called immediately before rendering when new props or state is received. Not called for the initial render.
|
||
*
|
||
* Note: You cannot call `Component#setState` here.
|
||
*
|
||
* This method will not stop working in React 17.
|
||
*
|
||
* Note: the presence of getSnapshotBeforeUpdate or getDerivedStateFromProps
|
||
* prevents this from being invoked.
|
||
*
|
||
* @deprecated 16.3, use getSnapshotBeforeUpdate instead
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#reading-dom-properties-before-an-update
|
||
* @see https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path
|
||
*/
|
||
UNSAFE_componentWillUpdate?(
|
||
nextProps: Readonly<P>,
|
||
nextState: Readonly<S>,
|
||
nextContext: any
|
||
): void;
|
||
}
|
||
|
||
interface Mixin<P, S> extends ComponentLifecycle<P, S> {
|
||
mixins?: Array<Mixin<P, S>>;
|
||
statics?: {
|
||
[key: string]: any;
|
||
};
|
||
|
||
displayName?: string;
|
||
propTypes?: ValidationMap<any>;
|
||
contextTypes?: ValidationMap<any>;
|
||
childContextTypes?: ValidationMap<any>;
|
||
|
||
getDefaultProps?(): P;
|
||
getInitialState?(): S;
|
||
}
|
||
|
||
interface ComponentSpec<P, S> extends Mixin<P, S> {
|
||
render(): ReactNode;
|
||
|
||
[propertyName: string]: any;
|
||
}
|
||
|
||
function createRef<T>(): RefObject<T>;
|
||
|
||
// will show `ForwardRef(${Component.displayName || Component.name})` in devtools by default,
|
||
// but can be given its own specific name
|
||
interface ForwardRefExoticComponent<P> extends NamedExoticComponent<P> {
|
||
defaultProps?: Partial<P>;
|
||
propTypes?: WeakValidationMap<P>;
|
||
}
|
||
|
||
function forwardRef<T, P = {}>(
|
||
Component: RefForwardingComponent<T, P>
|
||
): ForwardRefExoticComponent<PropsWithoutRef<P> & RefAttributes<T>>;
|
||
|
||
/** Ensures that the props do not include ref at all */
|
||
type PropsWithoutRef<P> =
|
||
// Just Pick would be sufficient for this, but I'm trying to avoid unnecessary mapping over union types
|
||
// https://github.com/Microsoft/TypeScript/issues/28339
|
||
"ref" extends keyof P ? Pick<P, Exclude<keyof P, "ref">> : P;
|
||
/** Ensures that the props do not include string ref, which cannot be forwarded */
|
||
type PropsWithRef<P> =
|
||
// Just "P extends { ref?: infer R }" looks sufficient, but R will infer as {} if P is {}.
|
||
"ref" extends keyof P
|
||
? P extends { ref?: infer R }
|
||
? string extends R
|
||
? PropsWithoutRef<P> & { ref?: Exclude<R, string> }
|
||
: P
|
||
: P
|
||
: P;
|
||
|
||
type PropsWithChildren<P> = P & { children?: ReactNode };
|
||
|
||
/**
|
||
* NOTE: prefer ComponentPropsWithRef, if the ref is forwarded,
|
||
* or ComponentPropsWithoutRef when refs are not supported.
|
||
*/
|
||
type ComponentProps<
|
||
T extends keyof JSX.IntrinsicElements | JSXElementConstructor<any>
|
||
> = T extends JSXElementConstructor<infer P>
|
||
? P
|
||
: T extends keyof JSX.IntrinsicElements
|
||
? JSX.IntrinsicElements[T]
|
||
: {};
|
||
type ComponentPropsWithRef<T extends ElementType> = T extends ComponentClass<
|
||
infer P
|
||
>
|
||
? PropsWithoutRef<P> & RefAttributes<InstanceType<T>>
|
||
: PropsWithRef<ComponentProps<T>>;
|
||
type ComponentPropsWithoutRef<T extends ElementType> = PropsWithoutRef<
|
||
ComponentProps<T>
|
||
>;
|
||
|
||
// will show `Memo(${Component.displayName || Component.name})` in devtools by default,
|
||
// but can be given its own specific name
|
||
type MemoExoticComponent<T extends ComponentType<any>> = NamedExoticComponent<
|
||
ComponentPropsWithRef<T>
|
||
> & {
|
||
readonly type: T;
|
||
};
|
||
|
||
function memo<P extends object>(
|
||
Component: SFC<P>,
|
||
propsAreEqual?: (
|
||
prevProps: Readonly<PropsWithChildren<P>>,
|
||
nextProps: Readonly<PropsWithChildren<P>>
|
||
) => boolean
|
||
): NamedExoticComponent<P>;
|
||
function memo<T extends ComponentType<any>>(
|
||
Component: T,
|
||
propsAreEqual?: (
|
||
prevProps: Readonly<ComponentProps<T>>,
|
||
nextProps: Readonly<ComponentProps<T>>
|
||
) => boolean
|
||
): MemoExoticComponent<T>;
|
||
|
||
type LazyExoticComponent<T extends ComponentType<any>> = ExoticComponent<
|
||
ComponentPropsWithRef<T>
|
||
> & {
|
||
readonly _result: T;
|
||
};
|
||
|
||
function lazy<T extends ComponentType<any>>(
|
||
factory: () => Promise<{ default: T }>
|
||
): LazyExoticComponent<T>;
|
||
|
||
//
|
||
// React Hooks
|
||
// ----------------------------------------------------------------------
|
||
|
||
// based on the code in https://github.com/facebook/react/pull/13968
|
||
|
||
// Unlike the class component setState, the updates are not allowed to be partial
|
||
type SetStateAction<S> = S | ((prevState: S) => S);
|
||
// this technically does accept a second argument, but it's already under a deprecation warning
|
||
// and it's not even released so probably better to not define it.
|
||
type Dispatch<A> = (value: A) => void;
|
||
// Since action _can_ be undefined, dispatch may be called without any parameters.
|
||
type DispatchWithoutAction = () => void;
|
||
// Unlike redux, the actions _can_ be anything
|
||
type Reducer<S, A> = (prevState: S, action: A) => S;
|
||
// If useReducer accepts a reducer without action, dispatch may be called without any parameters.
|
||
type ReducerWithoutAction<S> = (prevState: S) => S;
|
||
// types used to try and prevent the compiler from reducing S
|
||
// to a supertype common with the second argument to useReducer()
|
||
type ReducerState<R extends Reducer<any, any>> = R extends Reducer<
|
||
infer S,
|
||
any
|
||
>
|
||
? S
|
||
: never;
|
||
type ReducerAction<R extends Reducer<any, any>> = R extends Reducer<
|
||
any,
|
||
infer A
|
||
>
|
||
? A
|
||
: never;
|
||
// The identity check is done with the SameValue algorithm (Object.is), which is stricter than ===
|
||
type ReducerStateWithoutAction<
|
||
R extends ReducerWithoutAction<any>
|
||
> = R extends ReducerWithoutAction<infer S> ? S : never;
|
||
// TODO (TypeScript 3.0): ReadonlyArray<unknown>
|
||
type DependencyList = ReadonlyArray<any>;
|
||
|
||
// NOTE: callbacks are _only_ allowed to return either void, or a destructor.
|
||
// The destructor is itself only allowed to return void.
|
||
type EffectCallback = () => void | (() => void | undefined);
|
||
|
||
interface MutableRefObject<T> {
|
||
current: T;
|
||
}
|
||
|
||
// This will technically work if you give a Consumer<T> or Provider<T> but it's deprecated and warns
|
||
/**
|
||
* Accepts a context object (the value returned from `React.createContext`) and returns the current
|
||
* context value, as given by the nearest context provider for the given context.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#usecontext
|
||
*/
|
||
function useContext<T>(
|
||
context: Context<T> /*, (not public API) observedBits?: number|boolean */
|
||
): T;
|
||
/**
|
||
* Returns a stateful value, and a function to update it.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#usestate
|
||
*/
|
||
function useState<S>(
|
||
initialState: S | (() => S)
|
||
): [S, Dispatch<SetStateAction<S>>];
|
||
// convenience overload when first argument is ommitted
|
||
/**
|
||
* Returns a stateful value, and a function to update it.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#usestate
|
||
*/
|
||
function useState<S = undefined>(): [
|
||
S | undefined,
|
||
Dispatch<SetStateAction<S | undefined>>
|
||
];
|
||
/**
|
||
* An alternative to `useState`.
|
||
*
|
||
* `useReducer` is usually preferable to `useState` when you have complex state logic that involves
|
||
* multiple sub-values. It also lets you optimize performance for components that trigger deep
|
||
* updates because you can pass `dispatch` down instead of callbacks.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#usereducer
|
||
*/
|
||
// overload where dispatch could accept 0 arguments.
|
||
function useReducer<R extends ReducerWithoutAction<any>, I>(
|
||
reducer: R,
|
||
initializerArg: I,
|
||
initializer: (arg: I) => ReducerStateWithoutAction<R>
|
||
): [ReducerStateWithoutAction<R>, DispatchWithoutAction];
|
||
/**
|
||
* An alternative to `useState`.
|
||
*
|
||
* `useReducer` is usually preferable to `useState` when you have complex state logic that involves
|
||
* multiple sub-values. It also lets you optimize performance for components that trigger deep
|
||
* updates because you can pass `dispatch` down instead of callbacks.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#usereducer
|
||
*/
|
||
// overload where dispatch could accept 0 arguments.
|
||
function useReducer<R extends ReducerWithoutAction<any>>(
|
||
reducer: R,
|
||
initializerArg: ReducerStateWithoutAction<R>,
|
||
initializer?: undefined
|
||
): [ReducerStateWithoutAction<R>, DispatchWithoutAction];
|
||
/**
|
||
* An alternative to `useState`.
|
||
*
|
||
* `useReducer` is usually preferable to `useState` when you have complex state logic that involves
|
||
* multiple sub-values. It also lets you optimize performance for components that trigger deep
|
||
* updates because you can pass `dispatch` down instead of callbacks.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#usereducer
|
||
*/
|
||
// overload where "I" may be a subset of ReducerState<R>; used to provide autocompletion.
|
||
// If "I" matches ReducerState<R> exactly then the last overload will allow initializer to be ommitted.
|
||
// the last overload effectively behaves as if the identity function (x => x) is the initializer.
|
||
function useReducer<R extends Reducer<any, any>, I>(
|
||
reducer: R,
|
||
initializerArg: I & ReducerState<R>,
|
||
initializer: (arg: I & ReducerState<R>) => ReducerState<R>
|
||
): [ReducerState<R>, Dispatch<ReducerAction<R>>];
|
||
/**
|
||
* An alternative to `useState`.
|
||
*
|
||
* `useReducer` is usually preferable to `useState` when you have complex state logic that involves
|
||
* multiple sub-values. It also lets you optimize performance for components that trigger deep
|
||
* updates because you can pass `dispatch` down instead of callbacks.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#usereducer
|
||
*/
|
||
// overload for free "I"; all goes as long as initializer converts it into "ReducerState<R>".
|
||
function useReducer<R extends Reducer<any, any>, I>(
|
||
reducer: R,
|
||
initializerArg: I,
|
||
initializer: (arg: I) => ReducerState<R>
|
||
): [ReducerState<R>, Dispatch<ReducerAction<R>>];
|
||
/**
|
||
* An alternative to `useState`.
|
||
*
|
||
* `useReducer` is usually preferable to `useState` when you have complex state logic that involves
|
||
* multiple sub-values. It also lets you optimize performance for components that trigger deep
|
||
* updates because you can pass `dispatch` down instead of callbacks.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#usereducer
|
||
*/
|
||
|
||
// I'm not sure if I keep this 2-ary or if I make it (2,3)-ary; it's currently (2,3)-ary.
|
||
// The Flow types do have an overload for 3-ary invocation with undefined initializer.
|
||
|
||
// NOTE: without the ReducerState indirection, TypeScript would reduce S to be the most common
|
||
// supertype between the reducer's return type and the initialState (or the initializer's return type),
|
||
// which would prevent autocompletion from ever working.
|
||
|
||
// TODO: double-check if this weird overload logic is necessary. It is possible it's either a bug
|
||
// in older versions, or a regression in newer versions of the typescript completion service.
|
||
function useReducer<R extends Reducer<any, any>>(
|
||
reducer: R,
|
||
initialState: ReducerState<R>,
|
||
initializer?: undefined
|
||
): [ReducerState<R>, Dispatch<ReducerAction<R>>];
|
||
/**
|
||
* `useRef` returns a mutable ref object whose `.current` property is initialized to the passed argument
|
||
* (`initialValue`). The returned object will persist for the full lifetime of the component.
|
||
*
|
||
* Note that `useRef()` is useful for more than the `ref` attribute. It’s handy for keeping any mutable
|
||
* value around similar to how you’d use instance fields in classes.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#useref
|
||
*/
|
||
// TODO (TypeScript 3.0): <T extends unknown>
|
||
function useRef<T>(initialValue: T): MutableRefObject<T>;
|
||
// convenience overload for refs given as a ref prop as they typically start with a null value
|
||
/**
|
||
* `useRef` returns a mutable ref object whose `.current` property is initialized to the passed argument
|
||
* (`initialValue`). The returned object will persist for the full lifetime of the component.
|
||
*
|
||
* Note that `useRef()` is useful for more than the `ref` attribute. It’s handy for keeping any mutable
|
||
* value around similar to how you’d use instance fields in classes.
|
||
*
|
||
* Usage note: if you need the result of useRef to be directly mutable, include `| null` in the type
|
||
* of the generic argument.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#useref
|
||
*/
|
||
// TODO (TypeScript 3.0): <T extends unknown>
|
||
function useRef<T>(initialValue: T | null): RefObject<T>;
|
||
// convenience overload for potentially undefined initialValue / call with 0 arguments
|
||
// has a default to stop it from defaulting to {} instead
|
||
/**
|
||
* `useRef` returns a mutable ref object whose `.current` property is initialized to the passed argument
|
||
* (`initialValue`). The returned object will persist for the full lifetime of the component.
|
||
*
|
||
* Note that `useRef()` is useful for more than the `ref` attribute. It’s handy for keeping any mutable
|
||
* value around similar to how you’d use instance fields in classes.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#useref
|
||
*/
|
||
// TODO (TypeScript 3.0): <T extends unknown>
|
||
function useRef<T = undefined>(): MutableRefObject<T | undefined>;
|
||
/**
|
||
* The signature is identical to `useEffect`, but it fires synchronously after all DOM mutations.
|
||
* Use this to read layout from the DOM and synchronously re-render. Updates scheduled inside
|
||
* `useLayoutEffect` will be flushed synchronously, before the browser has a chance to paint.
|
||
*
|
||
* Prefer the standard `useEffect` when possible to avoid blocking visual updates.
|
||
*
|
||
* If you’re migrating code from a class component, `useLayoutEffect` fires in the same phase as
|
||
* `componentDidMount` and `componentDidUpdate`.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#uselayouteffect
|
||
*/
|
||
function useLayoutEffect(effect: EffectCallback, deps?: DependencyList): void;
|
||
/**
|
||
* Accepts a function that contains imperative, possibly effectful code.
|
||
*
|
||
* @param effect Imperative function that can return a cleanup function
|
||
* @param deps If present, effect will only activate if the values in the list change.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#useeffect
|
||
*/
|
||
function useEffect(effect: EffectCallback, deps?: DependencyList): void;
|
||
// NOTE: this does not accept strings, but this will have to be fixed by removing strings from type Ref<T>
|
||
/**
|
||
* `useImperativeHandle` customizes the instance value that is exposed to parent components when using
|
||
* `ref`. As always, imperative code using refs should be avoided in most cases.
|
||
*
|
||
* `useImperativeHandle` should be used with `React.forwardRef`.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#useimperativehandle
|
||
*/
|
||
function useImperativeHandle<T, R extends T>(
|
||
ref: Ref<T> | undefined,
|
||
init: () => R,
|
||
deps?: DependencyList
|
||
): void;
|
||
// I made 'inputs' required here and in useMemo as there's no point to memoizing without the memoization key
|
||
// useCallback(X) is identical to just using X, useMemo(() => Y) is identical to just using Y.
|
||
/**
|
||
* `useCallback` will return a memoized version of the callback that only changes if one of the `inputs`
|
||
* has changed.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#usecallback
|
||
*/
|
||
// TODO (TypeScript 3.0): <T extends (...args: never[]) => unknown>
|
||
function useCallback<T extends (...args: any[]) => any>(
|
||
callback: T,
|
||
deps: DependencyList
|
||
): T;
|
||
/**
|
||
* `useMemo` will only recompute the memoized value when one of the `deps` has changed.
|
||
*
|
||
* Usage note: if calling `useMemo` with a referentially stable function, also give it as the input in
|
||
* the second argument.
|
||
*
|
||
* ```ts
|
||
* function expensive () { ... }
|
||
*
|
||
* function Component () {
|
||
* const expensiveResult = useMemo(expensive, [expensive])
|
||
* return ...
|
||
* }
|
||
* ```
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#usememo
|
||
*/
|
||
// allow undefined, but don't make it optional as that is very likely a mistake
|
||
function useMemo<T>(factory: () => T, deps: DependencyList | undefined): T;
|
||
/**
|
||
* `useDebugValue` can be used to display a label for custom hooks in React DevTools.
|
||
*
|
||
* NOTE: We don’t recommend adding debug values to every custom hook.
|
||
* It’s most valuable for custom hooks that are part of shared libraries.
|
||
*
|
||
* @version 16.8.0
|
||
* @see https://reactjs.org/docs/hooks-reference.html#usedebugvalue
|
||
*/
|
||
// the name of the custom hook is itself derived from the function name at runtime:
|
||
// it's just the function name without the "use" prefix.
|
||
function useDebugValue<T>(value: T, format?: (value: T) => any): void;
|
||
|
||
//
|
||
// Event System
|
||
// ----------------------------------------------------------------------
|
||
// TODO: change any to unknown when moving to TS v3
|
||
interface BaseSyntheticEvent<E = object, C = any, T = any> {
|
||
nativeEvent: E;
|
||
currentTarget: C;
|
||
target: T;
|
||
bubbles: boolean;
|
||
cancelable: boolean;
|
||
defaultPrevented: boolean;
|
||
eventPhase: number;
|
||
isTrusted: boolean;
|
||
preventDefault(): void;
|
||
isDefaultPrevented(): boolean;
|
||
stopPropagation(): void;
|
||
isPropagationStopped(): boolean;
|
||
persist(): void;
|
||
timeStamp: number;
|
||
type: string;
|
||
}
|
||
|
||
/**
|
||
* currentTarget - a reference to the element on which the event listener is registered.
|
||
*
|
||
* target - a reference to the element from which the event was originally dispatched.
|
||
* This might be a child element to the element on which the event listener is registered.
|
||
* If you thought this should be `EventTarget & T`, see https://github.com/DefinitelyTyped/DefinitelyTyped/pull/12239
|
||
*/
|
||
interface SyntheticEvent<T = Element, E = Event>
|
||
extends BaseSyntheticEvent<E, EventTarget & T, EventTarget> {}
|
||
|
||
interface ClipboardEvent<T = Element>
|
||
extends SyntheticEvent<T, NativeClipboardEvent> {
|
||
clipboardData: DataTransfer;
|
||
}
|
||
|
||
interface CompositionEvent<T = Element>
|
||
extends SyntheticEvent<T, NativeCompositionEvent> {
|
||
data: string;
|
||
}
|
||
|
||
interface DragEvent<T = Element> extends MouseEvent<T, NativeDragEvent> {
|
||
dataTransfer: DataTransfer;
|
||
}
|
||
|
||
interface PointerEvent<T = Element>
|
||
extends MouseEvent<T, NativePointerEvent> {
|
||
pointerId: number;
|
||
pressure: number;
|
||
tiltX: number;
|
||
tiltY: number;
|
||
width: number;
|
||
height: number;
|
||
pointerType: "mouse" | "pen" | "touch";
|
||
isPrimary: boolean;
|
||
}
|
||
|
||
interface FocusEvent<T = Element>
|
||
extends SyntheticEvent<T, NativeFocusEvent> {
|
||
relatedTarget: EventTarget | null;
|
||
target: EventTarget & T;
|
||
}
|
||
|
||
// tslint:disable-next-line:no-empty-interface
|
||
interface FormEvent<T = Element> extends SyntheticEvent<T> {}
|
||
|
||
interface InvalidEvent<T = Element> extends SyntheticEvent<T> {
|
||
target: EventTarget & T;
|
||
}
|
||
|
||
interface ChangeEvent<T = Element> extends SyntheticEvent<T> {
|
||
target: EventTarget & T;
|
||
}
|
||
|
||
interface KeyboardEvent<T = Element>
|
||
extends SyntheticEvent<T, NativeKeyboardEvent> {
|
||
altKey: boolean;
|
||
charCode: number;
|
||
ctrlKey: boolean;
|
||
/**
|
||
* See [DOM Level 3 Events spec](https://www.w3.org/TR/uievents-key/#keys-modifier). for a list of valid (case-sensitive) arguments to this method.
|
||
*/
|
||
getModifierState(key: string): boolean;
|
||
/**
|
||
* See the [DOM Level 3 Events spec](https://www.w3.org/TR/uievents-key/#named-key-attribute-values). for possible values
|
||
*/
|
||
key: string;
|
||
keyCode: number;
|
||
locale: string;
|
||
location: number;
|
||
metaKey: boolean;
|
||
repeat: boolean;
|
||
shiftKey: boolean;
|
||
which: number;
|
||
}
|
||
|
||
interface MouseEvent<T = Element, E = NativeMouseEvent>
|
||
extends SyntheticEvent<T, E> {
|
||
altKey: boolean;
|
||
button: number;
|
||
buttons: number;
|
||
clientX: number;
|
||
clientY: number;
|
||
ctrlKey: boolean;
|
||
/**
|
||
* See [DOM Level 3 Events spec](https://www.w3.org/TR/uievents-key/#keys-modifier). for a list of valid (case-sensitive) arguments to this method.
|
||
*/
|
||
getModifierState(key: string): boolean;
|
||
metaKey: boolean;
|
||
movementX: number;
|
||
movementY: number;
|
||
pageX: number;
|
||
pageY: number;
|
||
relatedTarget: EventTarget | null;
|
||
screenX: number;
|
||
screenY: number;
|
||
shiftKey: boolean;
|
||
}
|
||
|
||
interface TouchEvent<T = Element>
|
||
extends SyntheticEvent<T, NativeTouchEvent> {
|
||
altKey: boolean;
|
||
changedTouches: TouchList;
|
||
ctrlKey: boolean;
|
||
/**
|
||
* See [DOM Level 3 Events spec](https://www.w3.org/TR/uievents-key/#keys-modifier). for a list of valid (case-sensitive) arguments to this method.
|
||
*/
|
||
getModifierState(key: string): boolean;
|
||
metaKey: boolean;
|
||
shiftKey: boolean;
|
||
targetTouches: TouchList;
|
||
touches: TouchList;
|
||
}
|
||
|
||
interface UIEvent<T = Element> extends SyntheticEvent<T, NativeUIEvent> {
|
||
detail: number;
|
||
view: AbstractView;
|
||
}
|
||
|
||
interface WheelEvent<T = Element> extends MouseEvent<T, NativeWheelEvent> {
|
||
deltaMode: number;
|
||
deltaX: number;
|
||
deltaY: number;
|
||
deltaZ: number;
|
||
}
|
||
|
||
interface AnimationEvent<T = Element>
|
||
extends SyntheticEvent<T, NativeAnimationEvent> {
|
||
animationName: string;
|
||
elapsedTime: number;
|
||
pseudoElement: string;
|
||
}
|
||
|
||
interface TransitionEvent<T = Element>
|
||
extends SyntheticEvent<T, NativeTransitionEvent> {
|
||
elapsedTime: number;
|
||
propertyName: string;
|
||
pseudoElement: string;
|
||
}
|
||
|
||
//
|
||
// Event Handler Types
|
||
// ----------------------------------------------------------------------
|
||
|
||
type EventHandler<E extends SyntheticEvent<any>> = {
|
||
bivarianceHack(event: E): void;
|
||
}["bivarianceHack"];
|
||
|
||
type ReactEventHandler<T = Element> = EventHandler<SyntheticEvent<T>>;
|
||
|
||
type ClipboardEventHandler<T = Element> = EventHandler<ClipboardEvent<T>>;
|
||
type CompositionEventHandler<T = Element> = EventHandler<CompositionEvent<T>>;
|
||
type DragEventHandler<T = Element> = EventHandler<DragEvent<T>>;
|
||
type FocusEventHandler<T = Element> = EventHandler<FocusEvent<T>>;
|
||
type FormEventHandler<T = Element> = EventHandler<FormEvent<T>>;
|
||
type ChangeEventHandler<T = Element> = EventHandler<ChangeEvent<T>>;
|
||
type KeyboardEventHandler<T = Element> = EventHandler<KeyboardEvent<T>>;
|
||
type MouseEventHandler<T = Element> = EventHandler<MouseEvent<T>>;
|
||
type TouchEventHandler<T = Element> = EventHandler<TouchEvent<T>>;
|
||
type PointerEventHandler<T = Element> = EventHandler<PointerEvent<T>>;
|
||
type UIEventHandler<T = Element> = EventHandler<UIEvent<T>>;
|
||
type WheelEventHandler<T = Element> = EventHandler<WheelEvent<T>>;
|
||
type AnimationEventHandler<T = Element> = EventHandler<AnimationEvent<T>>;
|
||
type TransitionEventHandler<T = Element> = EventHandler<TransitionEvent<T>>;
|
||
|
||
//
|
||
// Props / DOM Attributes
|
||
// ----------------------------------------------------------------------
|
||
|
||
/**
|
||
* @deprecated. This was used to allow clients to pass `ref` and `key`
|
||
* to `createElement`, which is no longer necessary due to intersection
|
||
* types. If you need to declare a props object before passing it to
|
||
* `createElement` or a factory, use `ClassAttributes<T>`:
|
||
*
|
||
* ```ts
|
||
* var b: Button | null;
|
||
* var props: ButtonProps & ClassAttributes<Button> = {
|
||
* ref: b => button = b, // ok!
|
||
* label: "I'm a Button"
|
||
* };
|
||
* ```
|
||
*/
|
||
interface Props<T> {
|
||
children?: ReactNode;
|
||
key?: Key;
|
||
ref?: LegacyRef<T>;
|
||
}
|
||
|
||
interface HTMLProps<T> extends AllHTMLAttributes<T>, ClassAttributes<T> {}
|
||
|
||
type DetailedHTMLProps<E extends HTMLAttributes<T>, T> = ClassAttributes<T> &
|
||
E;
|
||
|
||
interface SVGProps<T> extends SVGAttributes<T>, ClassAttributes<T> {}
|
||
|
||
interface DOMAttributes<T> {
|
||
children?: ReactNode;
|
||
dangerouslySetInnerHTML?: {
|
||
__html: string;
|
||
};
|
||
|
||
// Clipboard Events
|
||
onCopy?: ClipboardEventHandler<T>;
|
||
onCopyCapture?: ClipboardEventHandler<T>;
|
||
onCut?: ClipboardEventHandler<T>;
|
||
onCutCapture?: ClipboardEventHandler<T>;
|
||
onPaste?: ClipboardEventHandler<T>;
|
||
onPasteCapture?: ClipboardEventHandler<T>;
|
||
|
||
// Composition Events
|
||
onCompositionEnd?: CompositionEventHandler<T>;
|
||
onCompositionEndCapture?: CompositionEventHandler<T>;
|
||
onCompositionStart?: CompositionEventHandler<T>;
|
||
onCompositionStartCapture?: CompositionEventHandler<T>;
|
||
onCompositionUpdate?: CompositionEventHandler<T>;
|
||
onCompositionUpdateCapture?: CompositionEventHandler<T>;
|
||
|
||
// Focus Events
|
||
onFocus?: FocusEventHandler<T>;
|
||
onFocusCapture?: FocusEventHandler<T>;
|
||
onBlur?: FocusEventHandler<T>;
|
||
onBlurCapture?: FocusEventHandler<T>;
|
||
|
||
// Form Events
|
||
onChange?: FormEventHandler<T>;
|
||
onChangeCapture?: FormEventHandler<T>;
|
||
onBeforeInput?: FormEventHandler<T>;
|
||
onBeforeInputCapture?: FormEventHandler<T>;
|
||
onInput?: FormEventHandler<T>;
|
||
onInputCapture?: FormEventHandler<T>;
|
||
onReset?: FormEventHandler<T>;
|
||
onResetCapture?: FormEventHandler<T>;
|
||
onSubmit?: FormEventHandler<T>;
|
||
onSubmitCapture?: FormEventHandler<T>;
|
||
onInvalid?: FormEventHandler<T>;
|
||
onInvalidCapture?: FormEventHandler<T>;
|
||
|
||
// Image Events
|
||
onLoad?: ReactEventHandler<T>;
|
||
onLoadCapture?: ReactEventHandler<T>;
|
||
onError?: ReactEventHandler<T>; // also a Media Event
|
||
onErrorCapture?: ReactEventHandler<T>; // also a Media Event
|
||
|
||
// Keyboard Events
|
||
onKeyDown?: KeyboardEventHandler<T>;
|
||
onKeyDownCapture?: KeyboardEventHandler<T>;
|
||
onKeyPress?: KeyboardEventHandler<T>;
|
||
onKeyPressCapture?: KeyboardEventHandler<T>;
|
||
onKeyUp?: KeyboardEventHandler<T>;
|
||
onKeyUpCapture?: KeyboardEventHandler<T>;
|
||
|
||
// Media Events
|
||
onAbort?: ReactEventHandler<T>;
|
||
onAbortCapture?: ReactEventHandler<T>;
|
||
onCanPlay?: ReactEventHandler<T>;
|
||
onCanPlayCapture?: ReactEventHandler<T>;
|
||
onCanPlayThrough?: ReactEventHandler<T>;
|
||
onCanPlayThroughCapture?: ReactEventHandler<T>;
|
||
onDurationChange?: ReactEventHandler<T>;
|
||
onDurationChangeCapture?: ReactEventHandler<T>;
|
||
onEmptied?: ReactEventHandler<T>;
|
||
onEmptiedCapture?: ReactEventHandler<T>;
|
||
onEncrypted?: ReactEventHandler<T>;
|
||
onEncryptedCapture?: ReactEventHandler<T>;
|
||
onEnded?: ReactEventHandler<T>;
|
||
onEndedCapture?: ReactEventHandler<T>;
|
||
onLoadedData?: ReactEventHandler<T>;
|
||
onLoadedDataCapture?: ReactEventHandler<T>;
|
||
onLoadedMetadata?: ReactEventHandler<T>;
|
||
onLoadedMetadataCapture?: ReactEventHandler<T>;
|
||
onLoadStart?: ReactEventHandler<T>;
|
||
onLoadStartCapture?: ReactEventHandler<T>;
|
||
onPause?: ReactEventHandler<T>;
|
||
onPauseCapture?: ReactEventHandler<T>;
|
||
onPlay?: ReactEventHandler<T>;
|
||
onPlayCapture?: ReactEventHandler<T>;
|
||
onPlaying?: ReactEventHandler<T>;
|
||
onPlayingCapture?: ReactEventHandler<T>;
|
||
onProgress?: ReactEventHandler<T>;
|
||
onProgressCapture?: ReactEventHandler<T>;
|
||
onRateChange?: ReactEventHandler<T>;
|
||
onRateChangeCapture?: ReactEventHandler<T>;
|
||
onSeeked?: ReactEventHandler<T>;
|
||
onSeekedCapture?: ReactEventHandler<T>;
|
||
onSeeking?: ReactEventHandler<T>;
|
||
onSeekingCapture?: ReactEventHandler<T>;
|
||
onStalled?: ReactEventHandler<T>;
|
||
onStalledCapture?: ReactEventHandler<T>;
|
||
onSuspend?: ReactEventHandler<T>;
|
||
onSuspendCapture?: ReactEventHandler<T>;
|
||
onTimeUpdate?: ReactEventHandler<T>;
|
||
onTimeUpdateCapture?: ReactEventHandler<T>;
|
||
onVolumeChange?: ReactEventHandler<T>;
|
||
onVolumeChangeCapture?: ReactEventHandler<T>;
|
||
onWaiting?: ReactEventHandler<T>;
|
||
onWaitingCapture?: ReactEventHandler<T>;
|
||
|
||
// MouseEvents
|
||
onAuxClick?: MouseEventHandler<T>;
|
||
onAuxClickCapture?: MouseEventHandler<T>;
|
||
onClick?: MouseEventHandler<T>;
|
||
onClickCapture?: MouseEventHandler<T>;
|
||
onContextMenu?: MouseEventHandler<T>;
|
||
onContextMenuCapture?: MouseEventHandler<T>;
|
||
onDoubleClick?: MouseEventHandler<T>;
|
||
onDoubleClickCapture?: MouseEventHandler<T>;
|
||
onDrag?: DragEventHandler<T>;
|
||
onDragCapture?: DragEventHandler<T>;
|
||
onDragEnd?: DragEventHandler<T>;
|
||
onDragEndCapture?: DragEventHandler<T>;
|
||
onDragEnter?: DragEventHandler<T>;
|
||
onDragEnterCapture?: DragEventHandler<T>;
|
||
onDragExit?: DragEventHandler<T>;
|
||
onDragExitCapture?: DragEventHandler<T>;
|
||
onDragLeave?: DragEventHandler<T>;
|
||
onDragLeaveCapture?: DragEventHandler<T>;
|
||
onDragOver?: DragEventHandler<T>;
|
||
onDragOverCapture?: DragEventHandler<T>;
|
||
onDragStart?: DragEventHandler<T>;
|
||
onDragStartCapture?: DragEventHandler<T>;
|
||
onDrop?: DragEventHandler<T>;
|
||
onDropCapture?: DragEventHandler<T>;
|
||
onMouseDown?: MouseEventHandler<T>;
|
||
onMouseDownCapture?: MouseEventHandler<T>;
|
||
onMouseEnter?: MouseEventHandler<T>;
|
||
onMouseLeave?: MouseEventHandler<T>;
|
||
onMouseMove?: MouseEventHandler<T>;
|
||
onMouseMoveCapture?: MouseEventHandler<T>;
|
||
onMouseOut?: MouseEventHandler<T>;
|
||
onMouseOutCapture?: MouseEventHandler<T>;
|
||
onMouseOver?: MouseEventHandler<T>;
|
||
onMouseOverCapture?: MouseEventHandler<T>;
|
||
onMouseUp?: MouseEventHandler<T>;
|
||
onMouseUpCapture?: MouseEventHandler<T>;
|
||
|
||
// Selection Events
|
||
onSelect?: ReactEventHandler<T>;
|
||
onSelectCapture?: ReactEventHandler<T>;
|
||
|
||
// Touch Events
|
||
onTouchCancel?: TouchEventHandler<T>;
|
||
onTouchCancelCapture?: TouchEventHandler<T>;
|
||
onTouchEnd?: TouchEventHandler<T>;
|
||
onTouchEndCapture?: TouchEventHandler<T>;
|
||
onTouchMove?: TouchEventHandler<T>;
|
||
onTouchMoveCapture?: TouchEventHandler<T>;
|
||
onTouchStart?: TouchEventHandler<T>;
|
||
onTouchStartCapture?: TouchEventHandler<T>;
|
||
|
||
// Pointer Events
|
||
onPointerDown?: PointerEventHandler<T>;
|
||
onPointerDownCapture?: PointerEventHandler<T>;
|
||
onPointerMove?: PointerEventHandler<T>;
|
||
onPointerMoveCapture?: PointerEventHandler<T>;
|
||
onPointerUp?: PointerEventHandler<T>;
|
||
onPointerUpCapture?: PointerEventHandler<T>;
|
||
onPointerCancel?: PointerEventHandler<T>;
|
||
onPointerCancelCapture?: PointerEventHandler<T>;
|
||
onPointerEnter?: PointerEventHandler<T>;
|
||
onPointerEnterCapture?: PointerEventHandler<T>;
|
||
onPointerLeave?: PointerEventHandler<T>;
|
||
onPointerLeaveCapture?: PointerEventHandler<T>;
|
||
onPointerOver?: PointerEventHandler<T>;
|
||
onPointerOverCapture?: PointerEventHandler<T>;
|
||
onPointerOut?: PointerEventHandler<T>;
|
||
onPointerOutCapture?: PointerEventHandler<T>;
|
||
onGotPointerCapture?: PointerEventHandler<T>;
|
||
onGotPointerCaptureCapture?: PointerEventHandler<T>;
|
||
onLostPointerCapture?: PointerEventHandler<T>;
|
||
onLostPointerCaptureCapture?: PointerEventHandler<T>;
|
||
|
||
// UI Events
|
||
onScroll?: UIEventHandler<T>;
|
||
onScrollCapture?: UIEventHandler<T>;
|
||
|
||
// Wheel Events
|
||
onWheel?: WheelEventHandler<T>;
|
||
onWheelCapture?: WheelEventHandler<T>;
|
||
|
||
// Animation Events
|
||
onAnimationStart?: AnimationEventHandler<T>;
|
||
onAnimationStartCapture?: AnimationEventHandler<T>;
|
||
onAnimationEnd?: AnimationEventHandler<T>;
|
||
onAnimationEndCapture?: AnimationEventHandler<T>;
|
||
onAnimationIteration?: AnimationEventHandler<T>;
|
||
onAnimationIterationCapture?: AnimationEventHandler<T>;
|
||
|
||
// Transition Events
|
||
onTransitionEnd?: TransitionEventHandler<T>;
|
||
onTransitionEndCapture?: TransitionEventHandler<T>;
|
||
}
|
||
|
||
export interface CSSProperties extends CSS.Properties<string | number> {
|
||
/**
|
||
* The index signature was removed to enable closed typing for style
|
||
* using CSSType. You're able to use type assertion or module augmentation
|
||
* to add properties or an index signature of your own.
|
||
*
|
||
* For examples and more information, visit:
|
||
* https://github.com/frenic/csstype#what-should-i-do-when-i-get-type-errors
|
||
*/
|
||
}
|
||
|
||
// All the WAI-ARIA 1.1 attributes from https://www.w3.org/TR/wai-aria-1.1/
|
||
interface AriaAttributes {
|
||
/** Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application. */
|
||
"aria-activedescendant"?: string;
|
||
/** Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute. */
|
||
"aria-atomic"?: boolean | "false" | "true";
|
||
/**
|
||
* Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be
|
||
* presented if they are made.
|
||
*/
|
||
"aria-autocomplete"?: "none" | "inline" | "list" | "both";
|
||
/** Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user. */
|
||
"aria-busy"?: boolean | "false" | "true";
|
||
/**
|
||
* Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.
|
||
* @see aria-pressed @see aria-selected.
|
||
*/
|
||
"aria-checked"?: boolean | "false" | "mixed" | "true";
|
||
/**
|
||
* Defines the total number of columns in a table, grid, or treegrid.
|
||
* @see aria-colindex.
|
||
*/
|
||
"aria-colcount"?: number;
|
||
/**
|
||
* Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.
|
||
* @see aria-colcount @see aria-colspan.
|
||
*/
|
||
"aria-colindex"?: number;
|
||
/**
|
||
* Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.
|
||
* @see aria-colindex @see aria-rowspan.
|
||
*/
|
||
"aria-colspan"?: number;
|
||
/**
|
||
* Identifies the element (or elements) whose contents or presence are controlled by the current element.
|
||
* @see aria-owns.
|
||
*/
|
||
"aria-controls"?: string;
|
||
/** Indicates the element that represents the current item within a container or set of related elements. */
|
||
"aria-current"?:
|
||
| boolean
|
||
| "false"
|
||
| "true"
|
||
| "page"
|
||
| "step"
|
||
| "location"
|
||
| "date"
|
||
| "time";
|
||
/**
|
||
* Identifies the element (or elements) that describes the object.
|
||
* @see aria-labelledby
|
||
*/
|
||
"aria-describedby"?: string;
|
||
/**
|
||
* Identifies the element that provides a detailed, extended description for the object.
|
||
* @see aria-describedby.
|
||
*/
|
||
"aria-details"?: string;
|
||
/**
|
||
* Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.
|
||
* @see aria-hidden @see aria-readonly.
|
||
*/
|
||
"aria-disabled"?: boolean | "false" | "true";
|
||
/**
|
||
* Indicates what functions can be performed when a dragged object is released on the drop target.
|
||
* @deprecated in ARIA 1.1
|
||
*/
|
||
"aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup";
|
||
/**
|
||
* Identifies the element that provides an error message for the object.
|
||
* @see aria-invalid @see aria-describedby.
|
||
*/
|
||
"aria-errormessage"?: string;
|
||
/** Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. */
|
||
"aria-expanded"?: boolean | "false" | "true";
|
||
/**
|
||
* Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,
|
||
* allows assistive technology to override the general default of reading in document source order.
|
||
*/
|
||
"aria-flowto"?: string;
|
||
/**
|
||
* Indicates an element's "grabbed" state in a drag-and-drop operation.
|
||
* @deprecated in ARIA 1.1
|
||
*/
|
||
"aria-grabbed"?: boolean | "false" | "true";
|
||
/** Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element. */
|
||
"aria-haspopup"?:
|
||
| boolean
|
||
| "false"
|
||
| "true"
|
||
| "menu"
|
||
| "listbox"
|
||
| "tree"
|
||
| "grid"
|
||
| "dialog";
|
||
/**
|
||
* Indicates whether the element is exposed to an accessibility API.
|
||
* @see aria-disabled.
|
||
*/
|
||
"aria-hidden"?: boolean | "false" | "true";
|
||
/**
|
||
* Indicates the entered value does not conform to the format expected by the application.
|
||
* @see aria-errormessage.
|
||
*/
|
||
"aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling";
|
||
/** Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element. */
|
||
"aria-keyshortcuts"?: string;
|
||
/**
|
||
* Defines a string value that labels the current element.
|
||
* @see aria-labelledby.
|
||
*/
|
||
"aria-label"?: string;
|
||
/**
|
||
* Identifies the element (or elements) that labels the current element.
|
||
* @see aria-describedby.
|
||
*/
|
||
"aria-labelledby"?: string;
|
||
/** Defines the hierarchical level of an element within a structure. */
|
||
"aria-level"?: number;
|
||
/** Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region. */
|
||
"aria-live"?: "off" | "assertive" | "polite";
|
||
/** Indicates whether an element is modal when displayed. */
|
||
"aria-modal"?: boolean | "false" | "true";
|
||
/** Indicates whether a text box accepts multiple lines of input or only a single line. */
|
||
"aria-multiline"?: boolean | "false" | "true";
|
||
/** Indicates that the user may select more than one item from the current selectable descendants. */
|
||
"aria-multiselectable"?: boolean | "false" | "true";
|
||
/** Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous. */
|
||
"aria-orientation"?: "horizontal" | "vertical";
|
||
/**
|
||
* Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship
|
||
* between DOM elements where the DOM hierarchy cannot be used to represent the relationship.
|
||
* @see aria-controls.
|
||
*/
|
||
"aria-owns"?: string;
|
||
/**
|
||
* Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.
|
||
* A hint could be a sample value or a brief description of the expected format.
|
||
*/
|
||
"aria-placeholder"?: string;
|
||
/**
|
||
* Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.
|
||
* @see aria-setsize.
|
||
*/
|
||
"aria-posinset"?: number;
|
||
/**
|
||
* Indicates the current "pressed" state of toggle buttons.
|
||
* @see aria-checked @see aria-selected.
|
||
*/
|
||
"aria-pressed"?: boolean | "false" | "mixed" | "true";
|
||
/**
|
||
* Indicates that the element is not editable, but is otherwise operable.
|
||
* @see aria-disabled.
|
||
*/
|
||
"aria-readonly"?: boolean | "false" | "true";
|
||
/**
|
||
* Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.
|
||
* @see aria-atomic.
|
||
*/
|
||
"aria-relevant"?:
|
||
| "additions"
|
||
| "additions text"
|
||
| "all"
|
||
| "removals"
|
||
| "text";
|
||
/** Indicates that user input is required on the element before a form may be submitted. */
|
||
"aria-required"?: boolean | "false" | "true";
|
||
/** Defines a human-readable, author-localized description for the role of an element. */
|
||
"aria-roledescription"?: string;
|
||
/**
|
||
* Defines the total number of rows in a table, grid, or treegrid.
|
||
* @see aria-rowindex.
|
||
*/
|
||
"aria-rowcount"?: number;
|
||
/**
|
||
* Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.
|
||
* @see aria-rowcount @see aria-rowspan.
|
||
*/
|
||
"aria-rowindex"?: number;
|
||
/**
|
||
* Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.
|
||
* @see aria-rowindex @see aria-colspan.
|
||
*/
|
||
"aria-rowspan"?: number;
|
||
/**
|
||
* Indicates the current "selected" state of various widgets.
|
||
* @see aria-checked @see aria-pressed.
|
||
*/
|
||
"aria-selected"?: boolean | "false" | "true";
|
||
/**
|
||
* Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.
|
||
* @see aria-posinset.
|
||
*/
|
||
"aria-setsize"?: number;
|
||
/** Indicates if items in a table or grid are sorted in ascending or descending order. */
|
||
"aria-sort"?: "none" | "ascending" | "descending" | "other";
|
||
/** Defines the maximum allowed value for a range widget. */
|
||
"aria-valuemax"?: number;
|
||
/** Defines the minimum allowed value for a range widget. */
|
||
"aria-valuemin"?: number;
|
||
/**
|
||
* Defines the current value for a range widget.
|
||
* @see aria-valuetext.
|
||
*/
|
||
"aria-valuenow"?: number;
|
||
/** Defines the human readable text alternative of aria-valuenow for a range widget. */
|
||
"aria-valuetext"?: string;
|
||
}
|
||
|
||
interface HTMLAttributes<T> extends AriaAttributes, DOMAttributes<T> {
|
||
// React-specific Attributes
|
||
defaultChecked?: boolean;
|
||
defaultValue?: string | number | string[];
|
||
suppressContentEditableWarning?: boolean;
|
||
suppressHydrationWarning?: boolean;
|
||
|
||
// Standard HTML Attributes
|
||
accessKey?: string;
|
||
className?: string;
|
||
contentEditable?: Booleanish | "inherit";
|
||
contextMenu?: string;
|
||
dir?: string;
|
||
draggable?: Booleanish;
|
||
hidden?: boolean;
|
||
id?: string;
|
||
lang?: string;
|
||
placeholder?: string;
|
||
slot?: string;
|
||
spellCheck?: Booleanish;
|
||
style?: CSSProperties;
|
||
tabIndex?: number;
|
||
title?: string;
|
||
translate?: "yes" | "no";
|
||
|
||
// Unknown
|
||
radioGroup?: string; // <command>, <menuitem>
|
||
|
||
// WAI-ARIA
|
||
role?: string;
|
||
|
||
// RDFa Attributes
|
||
about?: string;
|
||
datatype?: string;
|
||
inlist?: any;
|
||
prefix?: string;
|
||
property?: string;
|
||
resource?: string;
|
||
typeof?: string;
|
||
vocab?: string;
|
||
|
||
// Non-standard Attributes
|
||
autoCapitalize?: string;
|
||
autoCorrect?: string;
|
||
autoSave?: string;
|
||
color?: string;
|
||
itemProp?: string;
|
||
itemScope?: boolean;
|
||
itemType?: string;
|
||
itemID?: string;
|
||
itemRef?: string;
|
||
results?: number;
|
||
security?: string;
|
||
unselectable?: "on" | "off";
|
||
|
||
// Living Standard
|
||
/**
|
||
* Hints at the type of data that might be entered by the user while editing the element or its contents
|
||
* @see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute
|
||
*/
|
||
inputMode?:
|
||
| "none"
|
||
| "text"
|
||
| "tel"
|
||
| "url"
|
||
| "email"
|
||
| "numeric"
|
||
| "decimal"
|
||
| "search";
|
||
/**
|
||
* Specify that a standard HTML element should behave like a defined custom built-in element
|
||
* @see https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is
|
||
*/
|
||
is?: string;
|
||
}
|
||
|
||
interface AllHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
// Standard HTML Attributes
|
||
accept?: string;
|
||
acceptCharset?: string;
|
||
action?: string;
|
||
allowFullScreen?: boolean;
|
||
allowTransparency?: boolean;
|
||
alt?: string;
|
||
as?: string;
|
||
async?: boolean;
|
||
autoComplete?: string;
|
||
autoFocus?: boolean;
|
||
autoPlay?: boolean;
|
||
capture?: boolean | string;
|
||
cellPadding?: number | string;
|
||
cellSpacing?: number | string;
|
||
charSet?: string;
|
||
challenge?: string;
|
||
checked?: boolean;
|
||
cite?: string;
|
||
classID?: string;
|
||
cols?: number;
|
||
colSpan?: number;
|
||
content?: string;
|
||
controls?: boolean;
|
||
coords?: string;
|
||
crossOrigin?: string;
|
||
data?: string;
|
||
dateTime?: string;
|
||
default?: boolean;
|
||
defer?: boolean;
|
||
disabled?: boolean;
|
||
download?: any;
|
||
encType?: string;
|
||
form?: string;
|
||
formAction?: string;
|
||
formEncType?: string;
|
||
formMethod?: string;
|
||
formNoValidate?: boolean;
|
||
formTarget?: string;
|
||
frameBorder?: number | string;
|
||
headers?: string;
|
||
height?: number | string;
|
||
high?: number;
|
||
href?: string;
|
||
hrefLang?: string;
|
||
htmlFor?: string;
|
||
httpEquiv?: string;
|
||
integrity?: string;
|
||
keyParams?: string;
|
||
keyType?: string;
|
||
kind?: string;
|
||
label?: string;
|
||
list?: string;
|
||
loop?: boolean;
|
||
low?: number;
|
||
manifest?: string;
|
||
marginHeight?: number;
|
||
marginWidth?: number;
|
||
max?: number | string;
|
||
maxLength?: number;
|
||
media?: string;
|
||
mediaGroup?: string;
|
||
method?: string;
|
||
min?: number | string;
|
||
minLength?: number;
|
||
multiple?: boolean;
|
||
muted?: boolean;
|
||
name?: string;
|
||
nonce?: string;
|
||
noValidate?: boolean;
|
||
open?: boolean;
|
||
optimum?: number;
|
||
pattern?: string;
|
||
placeholder?: string;
|
||
playsInline?: boolean;
|
||
poster?: string;
|
||
preload?: string;
|
||
readOnly?: boolean;
|
||
rel?: string;
|
||
required?: boolean;
|
||
reversed?: boolean;
|
||
rows?: number;
|
||
rowSpan?: number;
|
||
sandbox?: string;
|
||
scope?: string;
|
||
scoped?: boolean;
|
||
scrolling?: string;
|
||
seamless?: boolean;
|
||
selected?: boolean;
|
||
shape?: string;
|
||
size?: number;
|
||
sizes?: string;
|
||
span?: number;
|
||
src?: string;
|
||
srcDoc?: string;
|
||
srcLang?: string;
|
||
srcSet?: string;
|
||
start?: number;
|
||
step?: number | string;
|
||
summary?: string;
|
||
target?: string;
|
||
type?: string;
|
||
useMap?: string;
|
||
value?: string | string[] | number;
|
||
width?: number | string;
|
||
wmode?: string;
|
||
wrap?: string;
|
||
}
|
||
|
||
interface AnchorHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
download?: any;
|
||
href?: string;
|
||
hrefLang?: string;
|
||
media?: string;
|
||
ping?: string;
|
||
rel?: string;
|
||
target?: string;
|
||
type?: string;
|
||
referrerPolicy?: string;
|
||
}
|
||
|
||
// tslint:disable-next-line:no-empty-interface
|
||
interface AudioHTMLAttributes<T> extends MediaHTMLAttributes<T> {}
|
||
|
||
interface AreaHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
alt?: string;
|
||
coords?: string;
|
||
download?: any;
|
||
href?: string;
|
||
hrefLang?: string;
|
||
media?: string;
|
||
rel?: string;
|
||
shape?: string;
|
||
target?: string;
|
||
}
|
||
|
||
interface BaseHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
href?: string;
|
||
target?: string;
|
||
}
|
||
|
||
interface BlockquoteHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
cite?: string;
|
||
}
|
||
|
||
interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
autoFocus?: boolean;
|
||
disabled?: boolean;
|
||
form?: string;
|
||
formAction?: string;
|
||
formEncType?: string;
|
||
formMethod?: string;
|
||
formNoValidate?: boolean;
|
||
formTarget?: string;
|
||
name?: string;
|
||
type?: "submit" | "reset" | "button";
|
||
value?: string | string[] | number;
|
||
}
|
||
|
||
interface CanvasHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
height?: number | string;
|
||
width?: number | string;
|
||
}
|
||
|
||
interface ColHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
span?: number;
|
||
width?: number | string;
|
||
}
|
||
|
||
interface ColgroupHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
span?: number;
|
||
}
|
||
|
||
interface DataHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
value?: string | string[] | number;
|
||
}
|
||
|
||
interface DetailsHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
open?: boolean;
|
||
}
|
||
|
||
interface DelHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
cite?: string;
|
||
dateTime?: string;
|
||
}
|
||
|
||
interface DialogHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
open?: boolean;
|
||
}
|
||
|
||
interface EmbedHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
height?: number | string;
|
||
src?: string;
|
||
type?: string;
|
||
width?: number | string;
|
||
}
|
||
|
||
interface FieldsetHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
disabled?: boolean;
|
||
form?: string;
|
||
name?: string;
|
||
}
|
||
|
||
interface FormHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
acceptCharset?: string;
|
||
action?: string;
|
||
autoComplete?: string;
|
||
encType?: string;
|
||
method?: string;
|
||
name?: string;
|
||
noValidate?: boolean;
|
||
target?: string;
|
||
}
|
||
|
||
interface HtmlHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
manifest?: string;
|
||
}
|
||
|
||
interface IframeHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
allow?: string;
|
||
allowFullScreen?: boolean;
|
||
allowTransparency?: boolean;
|
||
frameBorder?: number | string;
|
||
height?: number | string;
|
||
marginHeight?: number;
|
||
marginWidth?: number;
|
||
name?: string;
|
||
referrerPolicy?: string;
|
||
sandbox?: string;
|
||
scrolling?: string;
|
||
seamless?: boolean;
|
||
src?: string;
|
||
srcDoc?: string;
|
||
width?: number | string;
|
||
}
|
||
|
||
interface ImgHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
alt?: string;
|
||
crossOrigin?: "anonymous" | "use-credentials" | "";
|
||
decoding?: "async" | "auto" | "sync";
|
||
height?: number | string;
|
||
sizes?: string;
|
||
src?: string;
|
||
srcSet?: string;
|
||
useMap?: string;
|
||
width?: number | string;
|
||
}
|
||
|
||
interface InsHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
cite?: string;
|
||
dateTime?: string;
|
||
}
|
||
|
||
interface InputHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
accept?: string;
|
||
alt?: string;
|
||
autoComplete?: string;
|
||
autoFocus?: boolean;
|
||
capture?: boolean | string; // https://www.w3.org/TR/html-media-capture/#the-capture-attribute
|
||
checked?: boolean;
|
||
crossOrigin?: string;
|
||
disabled?: boolean;
|
||
form?: string;
|
||
formAction?: string;
|
||
formEncType?: string;
|
||
formMethod?: string;
|
||
formNoValidate?: boolean;
|
||
formTarget?: string;
|
||
height?: number | string;
|
||
list?: string;
|
||
max?: number | string;
|
||
maxLength?: number;
|
||
min?: number | string;
|
||
minLength?: number;
|
||
multiple?: boolean;
|
||
name?: string;
|
||
pattern?: string;
|
||
placeholder?: string;
|
||
readOnly?: boolean;
|
||
required?: boolean;
|
||
size?: number;
|
||
src?: string;
|
||
step?: number | string;
|
||
type?: string;
|
||
value?: string | string[] | number;
|
||
width?: number | string;
|
||
|
||
onChange?: ChangeEventHandler<T>;
|
||
}
|
||
|
||
interface KeygenHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
autoFocus?: boolean;
|
||
challenge?: string;
|
||
disabled?: boolean;
|
||
form?: string;
|
||
keyType?: string;
|
||
keyParams?: string;
|
||
name?: string;
|
||
}
|
||
|
||
interface LabelHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
form?: string;
|
||
htmlFor?: string;
|
||
}
|
||
|
||
interface LiHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
value?: string | string[] | number;
|
||
}
|
||
|
||
interface LinkHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
as?: string;
|
||
crossOrigin?: string;
|
||
href?: string;
|
||
hrefLang?: string;
|
||
integrity?: string;
|
||
media?: string;
|
||
rel?: string;
|
||
sizes?: string;
|
||
type?: string;
|
||
}
|
||
|
||
interface MapHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
name?: string;
|
||
}
|
||
|
||
interface MenuHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
type?: string;
|
||
}
|
||
|
||
interface MediaHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
autoPlay?: boolean;
|
||
controls?: boolean;
|
||
controlsList?: string;
|
||
crossOrigin?: string;
|
||
loop?: boolean;
|
||
mediaGroup?: string;
|
||
muted?: boolean;
|
||
playsinline?: boolean;
|
||
preload?: string;
|
||
src?: string;
|
||
}
|
||
|
||
interface MetaHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
charSet?: string;
|
||
content?: string;
|
||
httpEquiv?: string;
|
||
name?: string;
|
||
}
|
||
|
||
interface MeterHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
form?: string;
|
||
high?: number;
|
||
low?: number;
|
||
max?: number | string;
|
||
min?: number | string;
|
||
optimum?: number;
|
||
value?: string | string[] | number;
|
||
}
|
||
|
||
interface QuoteHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
cite?: string;
|
||
}
|
||
|
||
interface ObjectHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
classID?: string;
|
||
data?: string;
|
||
form?: string;
|
||
height?: number | string;
|
||
name?: string;
|
||
type?: string;
|
||
useMap?: string;
|
||
width?: number | string;
|
||
wmode?: string;
|
||
}
|
||
|
||
interface OlHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
reversed?: boolean;
|
||
start?: number;
|
||
type?: "1" | "a" | "A" | "i" | "I";
|
||
}
|
||
|
||
interface OptgroupHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
disabled?: boolean;
|
||
label?: string;
|
||
}
|
||
|
||
interface OptionHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
disabled?: boolean;
|
||
label?: string;
|
||
selected?: boolean;
|
||
value?: string | string[] | number;
|
||
}
|
||
|
||
interface OutputHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
form?: string;
|
||
htmlFor?: string;
|
||
name?: string;
|
||
}
|
||
|
||
interface ParamHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
name?: string;
|
||
value?: string | string[] | number;
|
||
}
|
||
|
||
interface ProgressHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
max?: number | string;
|
||
value?: string | string[] | number;
|
||
}
|
||
|
||
interface ScriptHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
async?: boolean;
|
||
charSet?: string;
|
||
crossOrigin?: string;
|
||
defer?: boolean;
|
||
integrity?: string;
|
||
noModule?: boolean;
|
||
nonce?: string;
|
||
src?: string;
|
||
type?: string;
|
||
}
|
||
|
||
interface SelectHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
autoComplete?: string;
|
||
autoFocus?: boolean;
|
||
disabled?: boolean;
|
||
form?: string;
|
||
multiple?: boolean;
|
||
name?: string;
|
||
required?: boolean;
|
||
size?: number;
|
||
value?: string | string[] | number;
|
||
onChange?: ChangeEventHandler<T>;
|
||
}
|
||
|
||
interface SourceHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
media?: string;
|
||
sizes?: string;
|
||
src?: string;
|
||
srcSet?: string;
|
||
type?: string;
|
||
}
|
||
|
||
interface StyleHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
media?: string;
|
||
nonce?: string;
|
||
scoped?: boolean;
|
||
type?: string;
|
||
}
|
||
|
||
interface TableHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
cellPadding?: number | string;
|
||
cellSpacing?: number | string;
|
||
summary?: string;
|
||
}
|
||
|
||
interface TextareaHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
autoComplete?: string;
|
||
autoFocus?: boolean;
|
||
cols?: number;
|
||
dirName?: string;
|
||
disabled?: boolean;
|
||
form?: string;
|
||
maxLength?: number;
|
||
minLength?: number;
|
||
name?: string;
|
||
placeholder?: string;
|
||
readOnly?: boolean;
|
||
required?: boolean;
|
||
rows?: number;
|
||
value?: string | string[] | number;
|
||
wrap?: string;
|
||
|
||
onChange?: ChangeEventHandler<T>;
|
||
}
|
||
|
||
interface TdHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
align?: "left" | "center" | "right" | "justify" | "char";
|
||
colSpan?: number;
|
||
headers?: string;
|
||
rowSpan?: number;
|
||
scope?: string;
|
||
abbr?: string;
|
||
valign?: "top" | "middle" | "bottom" | "baseline";
|
||
}
|
||
|
||
interface ThHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
align?: "left" | "center" | "right" | "justify" | "char";
|
||
colSpan?: number;
|
||
headers?: string;
|
||
rowSpan?: number;
|
||
scope?: string;
|
||
abbr?: string;
|
||
}
|
||
|
||
interface TimeHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
dateTime?: string;
|
||
}
|
||
|
||
interface TrackHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
default?: boolean;
|
||
kind?: string;
|
||
label?: string;
|
||
src?: string;
|
||
srcLang?: string;
|
||
}
|
||
|
||
interface VideoHTMLAttributes<T> extends MediaHTMLAttributes<T> {
|
||
height?: number | string;
|
||
playsInline?: boolean;
|
||
poster?: string;
|
||
width?: number | string;
|
||
disablePictureInPicture?: boolean;
|
||
}
|
||
|
||
// this list is "complete" in that it contains every SVG attribute
|
||
// that React supports, but the types can be improved.
|
||
// Full list here: https://facebook.github.io/react/docs/dom-elements.html
|
||
//
|
||
// The three broad type categories are (in order of restrictiveness):
|
||
// - "number | string"
|
||
// - "string"
|
||
// - union of string literals
|
||
interface SVGAttributes<T> extends AriaAttributes, DOMAttributes<T> {
|
||
// Attributes which also defined in HTMLAttributes
|
||
// See comment in SVGDOMPropertyConfig.js
|
||
className?: string;
|
||
color?: string;
|
||
height?: number | string;
|
||
id?: string;
|
||
lang?: string;
|
||
max?: number | string;
|
||
media?: string;
|
||
method?: string;
|
||
min?: number | string;
|
||
name?: string;
|
||
style?: CSSProperties;
|
||
target?: string;
|
||
type?: string;
|
||
width?: number | string;
|
||
|
||
// Other HTML properties supported by SVG elements in browsers
|
||
role?: string;
|
||
tabIndex?: number;
|
||
crossOrigin?: "anonymous" | "use-credentials" | "";
|
||
|
||
// SVG Specific attributes
|
||
accentHeight?: number | string;
|
||
accumulate?: "none" | "sum";
|
||
additive?: "replace" | "sum";
|
||
alignmentBaseline?:
|
||
| "auto"
|
||
| "baseline"
|
||
| "before-edge"
|
||
| "text-before-edge"
|
||
| "middle"
|
||
| "central"
|
||
| "after-edge"
|
||
| "text-after-edge"
|
||
| "ideographic"
|
||
| "alphabetic"
|
||
| "hanging"
|
||
| "mathematical"
|
||
| "inherit";
|
||
allowReorder?: "no" | "yes";
|
||
alphabetic?: number | string;
|
||
amplitude?: number | string;
|
||
arabicForm?: "initial" | "medial" | "terminal" | "isolated";
|
||
ascent?: number | string;
|
||
attributeName?: string;
|
||
attributeType?: string;
|
||
autoReverse?: Booleanish;
|
||
azimuth?: number | string;
|
||
baseFrequency?: number | string;
|
||
baselineShift?: number | string;
|
||
baseProfile?: number | string;
|
||
bbox?: number | string;
|
||
begin?: number | string;
|
||
bias?: number | string;
|
||
by?: number | string;
|
||
calcMode?: number | string;
|
||
capHeight?: number | string;
|
||
clip?: number | string;
|
||
clipPath?: string;
|
||
clipPathUnits?: number | string;
|
||
clipRule?: number | string;
|
||
colorInterpolation?: number | string;
|
||
colorInterpolationFilters?: "auto" | "sRGB" | "linearRGB" | "inherit";
|
||
colorProfile?: number | string;
|
||
colorRendering?: number | string;
|
||
contentScriptType?: number | string;
|
||
contentStyleType?: number | string;
|
||
cursor?: number | string;
|
||
cx?: number | string;
|
||
cy?: number | string;
|
||
d?: string;
|
||
decelerate?: number | string;
|
||
descent?: number | string;
|
||
diffuseConstant?: number | string;
|
||
direction?: number | string;
|
||
display?: number | string;
|
||
divisor?: number | string;
|
||
dominantBaseline?: number | string;
|
||
dur?: number | string;
|
||
dx?: number | string;
|
||
dy?: number | string;
|
||
edgeMode?: number | string;
|
||
elevation?: number | string;
|
||
enableBackground?: number | string;
|
||
end?: number | string;
|
||
exponent?: number | string;
|
||
externalResourcesRequired?: Booleanish;
|
||
fill?: string;
|
||
fillOpacity?: number | string;
|
||
fillRule?: "nonzero" | "evenodd" | "inherit";
|
||
filter?: string;
|
||
filterRes?: number | string;
|
||
filterUnits?: number | string;
|
||
floodColor?: number | string;
|
||
floodOpacity?: number | string;
|
||
focusable?: Booleanish | "auto";
|
||
fontFamily?: string;
|
||
fontSize?: number | string;
|
||
fontSizeAdjust?: number | string;
|
||
fontStretch?: number | string;
|
||
fontStyle?: number | string;
|
||
fontVariant?: number | string;
|
||
fontWeight?: number | string;
|
||
format?: number | string;
|
||
from?: number | string;
|
||
fx?: number | string;
|
||
fy?: number | string;
|
||
g1?: number | string;
|
||
g2?: number | string;
|
||
glyphName?: number | string;
|
||
glyphOrientationHorizontal?: number | string;
|
||
glyphOrientationVertical?: number | string;
|
||
glyphRef?: number | string;
|
||
gradientTransform?: string;
|
||
gradientUnits?: string;
|
||
hanging?: number | string;
|
||
horizAdvX?: number | string;
|
||
horizOriginX?: number | string;
|
||
href?: string;
|
||
ideographic?: number | string;
|
||
imageRendering?: number | string;
|
||
in2?: number | string;
|
||
in?: string;
|
||
intercept?: number | string;
|
||
k1?: number | string;
|
||
k2?: number | string;
|
||
k3?: number | string;
|
||
k4?: number | string;
|
||
k?: number | string;
|
||
kernelMatrix?: number | string;
|
||
kernelUnitLength?: number | string;
|
||
kerning?: number | string;
|
||
keyPoints?: number | string;
|
||
keySplines?: number | string;
|
||
keyTimes?: number | string;
|
||
lengthAdjust?: number | string;
|
||
letterSpacing?: number | string;
|
||
lightingColor?: number | string;
|
||
limitingConeAngle?: number | string;
|
||
local?: number | string;
|
||
markerEnd?: string;
|
||
markerHeight?: number | string;
|
||
markerMid?: string;
|
||
markerStart?: string;
|
||
markerUnits?: number | string;
|
||
markerWidth?: number | string;
|
||
mask?: string;
|
||
maskContentUnits?: number | string;
|
||
maskUnits?: number | string;
|
||
mathematical?: number | string;
|
||
mode?: number | string;
|
||
numOctaves?: number | string;
|
||
offset?: number | string;
|
||
opacity?: number | string;
|
||
operator?: number | string;
|
||
order?: number | string;
|
||
orient?: number | string;
|
||
orientation?: number | string;
|
||
origin?: number | string;
|
||
overflow?: number | string;
|
||
overlinePosition?: number | string;
|
||
overlineThickness?: number | string;
|
||
paintOrder?: number | string;
|
||
panose1?: number | string;
|
||
pathLength?: number | string;
|
||
patternContentUnits?: string;
|
||
patternTransform?: number | string;
|
||
patternUnits?: string;
|
||
pointerEvents?: number | string;
|
||
points?: string;
|
||
pointsAtX?: number | string;
|
||
pointsAtY?: number | string;
|
||
pointsAtZ?: number | string;
|
||
preserveAlpha?: Booleanish;
|
||
preserveAspectRatio?: string;
|
||
primitiveUnits?: number | string;
|
||
r?: number | string;
|
||
radius?: number | string;
|
||
refX?: number | string;
|
||
refY?: number | string;
|
||
renderingIntent?: number | string;
|
||
repeatCount?: number | string;
|
||
repeatDur?: number | string;
|
||
requiredExtensions?: number | string;
|
||
requiredFeatures?: number | string;
|
||
restart?: number | string;
|
||
result?: string;
|
||
rotate?: number | string;
|
||
rx?: number | string;
|
||
ry?: number | string;
|
||
scale?: number | string;
|
||
seed?: number | string;
|
||
shapeRendering?: number | string;
|
||
slope?: number | string;
|
||
spacing?: number | string;
|
||
specularConstant?: number | string;
|
||
specularExponent?: number | string;
|
||
speed?: number | string;
|
||
spreadMethod?: string;
|
||
startOffset?: number | string;
|
||
stdDeviation?: number | string;
|
||
stemh?: number | string;
|
||
stemv?: number | string;
|
||
stitchTiles?: number | string;
|
||
stopColor?: string;
|
||
stopOpacity?: number | string;
|
||
strikethroughPosition?: number | string;
|
||
strikethroughThickness?: number | string;
|
||
string?: number | string;
|
||
stroke?: string;
|
||
strokeDasharray?: string | number;
|
||
strokeDashoffset?: string | number;
|
||
strokeLinecap?: "butt" | "round" | "square" | "inherit";
|
||
strokeLinejoin?: "miter" | "round" | "bevel" | "inherit";
|
||
strokeMiterlimit?: number | string;
|
||
strokeOpacity?: number | string;
|
||
strokeWidth?: number | string;
|
||
surfaceScale?: number | string;
|
||
systemLanguage?: number | string;
|
||
tableValues?: number | string;
|
||
targetX?: number | string;
|
||
targetY?: number | string;
|
||
textAnchor?: string;
|
||
textDecoration?: number | string;
|
||
textLength?: number | string;
|
||
textRendering?: number | string;
|
||
to?: number | string;
|
||
transform?: string;
|
||
u1?: number | string;
|
||
u2?: number | string;
|
||
underlinePosition?: number | string;
|
||
underlineThickness?: number | string;
|
||
unicode?: number | string;
|
||
unicodeBidi?: number | string;
|
||
unicodeRange?: number | string;
|
||
unitsPerEm?: number | string;
|
||
vAlphabetic?: number | string;
|
||
values?: string;
|
||
vectorEffect?: number | string;
|
||
version?: string;
|
||
vertAdvY?: number | string;
|
||
vertOriginX?: number | string;
|
||
vertOriginY?: number | string;
|
||
vHanging?: number | string;
|
||
vIdeographic?: number | string;
|
||
viewBox?: string;
|
||
viewTarget?: number | string;
|
||
visibility?: number | string;
|
||
vMathematical?: number | string;
|
||
widths?: number | string;
|
||
wordSpacing?: number | string;
|
||
writingMode?: number | string;
|
||
x1?: number | string;
|
||
x2?: number | string;
|
||
x?: number | string;
|
||
xChannelSelector?: string;
|
||
xHeight?: number | string;
|
||
xlinkActuate?: string;
|
||
xlinkArcrole?: string;
|
||
xlinkHref?: string;
|
||
xlinkRole?: string;
|
||
xlinkShow?: string;
|
||
xlinkTitle?: string;
|
||
xlinkType?: string;
|
||
xmlBase?: string;
|
||
xmlLang?: string;
|
||
xmlns?: string;
|
||
xmlnsXlink?: string;
|
||
xmlSpace?: string;
|
||
y1?: number | string;
|
||
y2?: number | string;
|
||
y?: number | string;
|
||
yChannelSelector?: string;
|
||
z?: number | string;
|
||
zoomAndPan?: string;
|
||
}
|
||
|
||
interface WebViewHTMLAttributes<T> extends HTMLAttributes<T> {
|
||
allowFullScreen?: boolean;
|
||
allowpopups?: boolean;
|
||
autoFocus?: boolean;
|
||
autosize?: boolean;
|
||
blinkfeatures?: string;
|
||
disableblinkfeatures?: string;
|
||
disableguestresize?: boolean;
|
||
disablewebsecurity?: boolean;
|
||
guestinstance?: string;
|
||
httpreferrer?: string;
|
||
nodeintegration?: boolean;
|
||
partition?: string;
|
||
plugins?: boolean;
|
||
preload?: string;
|
||
src?: string;
|
||
useragent?: string;
|
||
webpreferences?: string;
|
||
}
|
||
|
||
//
|
||
// React.DOM
|
||
// ----------------------------------------------------------------------
|
||
|
||
interface ReactHTML {
|
||
a: DetailedHTMLFactory<
|
||
AnchorHTMLAttributes<HTMLAnchorElement>,
|
||
HTMLAnchorElement
|
||
>;
|
||
abbr: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
address: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
area: DetailedHTMLFactory<
|
||
AreaHTMLAttributes<HTMLAreaElement>,
|
||
HTMLAreaElement
|
||
>;
|
||
article: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
aside: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
audio: DetailedHTMLFactory<
|
||
AudioHTMLAttributes<HTMLAudioElement>,
|
||
HTMLAudioElement
|
||
>;
|
||
b: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
base: DetailedHTMLFactory<
|
||
BaseHTMLAttributes<HTMLBaseElement>,
|
||
HTMLBaseElement
|
||
>;
|
||
bdi: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
bdo: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
big: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
blockquote: DetailedHTMLFactory<
|
||
BlockquoteHTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
body: DetailedHTMLFactory<HTMLAttributes<HTMLBodyElement>, HTMLBodyElement>;
|
||
br: DetailedHTMLFactory<HTMLAttributes<HTMLBRElement>, HTMLBRElement>;
|
||
button: DetailedHTMLFactory<
|
||
ButtonHTMLAttributes<HTMLButtonElement>,
|
||
HTMLButtonElement
|
||
>;
|
||
canvas: DetailedHTMLFactory<
|
||
CanvasHTMLAttributes<HTMLCanvasElement>,
|
||
HTMLCanvasElement
|
||
>;
|
||
caption: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
cite: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
code: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
col: DetailedHTMLFactory<
|
||
ColHTMLAttributes<HTMLTableColElement>,
|
||
HTMLTableColElement
|
||
>;
|
||
colgroup: DetailedHTMLFactory<
|
||
ColgroupHTMLAttributes<HTMLTableColElement>,
|
||
HTMLTableColElement
|
||
>;
|
||
data: DetailedHTMLFactory<
|
||
DataHTMLAttributes<HTMLDataElement>,
|
||
HTMLDataElement
|
||
>;
|
||
datalist: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLDataListElement>,
|
||
HTMLDataListElement
|
||
>;
|
||
dd: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
del: DetailedHTMLFactory<DelHTMLAttributes<HTMLElement>, HTMLElement>;
|
||
details: DetailedHTMLFactory<
|
||
DetailsHTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
dfn: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
dialog: DetailedHTMLFactory<
|
||
DialogHTMLAttributes<HTMLDialogElement>,
|
||
HTMLDialogElement
|
||
>;
|
||
div: DetailedHTMLFactory<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
|
||
dl: DetailedHTMLFactory<HTMLAttributes<HTMLDListElement>, HTMLDListElement>;
|
||
dt: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
em: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
embed: DetailedHTMLFactory<
|
||
EmbedHTMLAttributes<HTMLEmbedElement>,
|
||
HTMLEmbedElement
|
||
>;
|
||
fieldset: DetailedHTMLFactory<
|
||
FieldsetHTMLAttributes<HTMLFieldSetElement>,
|
||
HTMLFieldSetElement
|
||
>;
|
||
figcaption: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
figure: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
footer: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
form: DetailedHTMLFactory<
|
||
FormHTMLAttributes<HTMLFormElement>,
|
||
HTMLFormElement
|
||
>;
|
||
h1: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
h2: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
h3: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
h4: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
h5: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
h6: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
head: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLHeadElement>;
|
||
header: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
hgroup: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
hr: DetailedHTMLFactory<HTMLAttributes<HTMLHRElement>, HTMLHRElement>;
|
||
html: DetailedHTMLFactory<
|
||
HtmlHTMLAttributes<HTMLHtmlElement>,
|
||
HTMLHtmlElement
|
||
>;
|
||
i: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
iframe: DetailedHTMLFactory<
|
||
IframeHTMLAttributes<HTMLIFrameElement>,
|
||
HTMLIFrameElement
|
||
>;
|
||
img: DetailedHTMLFactory<
|
||
ImgHTMLAttributes<HTMLImageElement>,
|
||
HTMLImageElement
|
||
>;
|
||
input: DetailedHTMLFactory<
|
||
InputHTMLAttributes<HTMLInputElement>,
|
||
HTMLInputElement
|
||
>;
|
||
ins: DetailedHTMLFactory<InsHTMLAttributes<HTMLModElement>, HTMLModElement>;
|
||
kbd: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
keygen: DetailedHTMLFactory<KeygenHTMLAttributes<HTMLElement>, HTMLElement>;
|
||
label: DetailedHTMLFactory<
|
||
LabelHTMLAttributes<HTMLLabelElement>,
|
||
HTMLLabelElement
|
||
>;
|
||
legend: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLLegendElement>,
|
||
HTMLLegendElement
|
||
>;
|
||
li: DetailedHTMLFactory<LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>;
|
||
link: DetailedHTMLFactory<
|
||
LinkHTMLAttributes<HTMLLinkElement>,
|
||
HTMLLinkElement
|
||
>;
|
||
main: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
map: DetailedHTMLFactory<MapHTMLAttributes<HTMLMapElement>, HTMLMapElement>;
|
||
mark: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
menu: DetailedHTMLFactory<MenuHTMLAttributes<HTMLElement>, HTMLElement>;
|
||
menuitem: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
meta: DetailedHTMLFactory<
|
||
MetaHTMLAttributes<HTMLMetaElement>,
|
||
HTMLMetaElement
|
||
>;
|
||
meter: DetailedHTMLFactory<MeterHTMLAttributes<HTMLElement>, HTMLElement>;
|
||
nav: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
noscript: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
object: DetailedHTMLFactory<
|
||
ObjectHTMLAttributes<HTMLObjectElement>,
|
||
HTMLObjectElement
|
||
>;
|
||
ol: DetailedHTMLFactory<
|
||
OlHTMLAttributes<HTMLOListElement>,
|
||
HTMLOListElement
|
||
>;
|
||
optgroup: DetailedHTMLFactory<
|
||
OptgroupHTMLAttributes<HTMLOptGroupElement>,
|
||
HTMLOptGroupElement
|
||
>;
|
||
option: DetailedHTMLFactory<
|
||
OptionHTMLAttributes<HTMLOptionElement>,
|
||
HTMLOptionElement
|
||
>;
|
||
output: DetailedHTMLFactory<OutputHTMLAttributes<HTMLElement>, HTMLElement>;
|
||
p: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLParagraphElement>,
|
||
HTMLParagraphElement
|
||
>;
|
||
param: DetailedHTMLFactory<
|
||
ParamHTMLAttributes<HTMLParamElement>,
|
||
HTMLParamElement
|
||
>;
|
||
picture: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
pre: DetailedHTMLFactory<HTMLAttributes<HTMLPreElement>, HTMLPreElement>;
|
||
progress: DetailedHTMLFactory<
|
||
ProgressHTMLAttributes<HTMLProgressElement>,
|
||
HTMLProgressElement
|
||
>;
|
||
q: DetailedHTMLFactory<
|
||
QuoteHTMLAttributes<HTMLQuoteElement>,
|
||
HTMLQuoteElement
|
||
>;
|
||
rp: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
rt: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
ruby: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
s: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
samp: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
script: DetailedHTMLFactory<
|
||
ScriptHTMLAttributes<HTMLScriptElement>,
|
||
HTMLScriptElement
|
||
>;
|
||
section: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
select: DetailedHTMLFactory<
|
||
SelectHTMLAttributes<HTMLSelectElement>,
|
||
HTMLSelectElement
|
||
>;
|
||
small: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
source: DetailedHTMLFactory<
|
||
SourceHTMLAttributes<HTMLSourceElement>,
|
||
HTMLSourceElement
|
||
>;
|
||
span: DetailedHTMLFactory<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;
|
||
strong: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
style: DetailedHTMLFactory<
|
||
StyleHTMLAttributes<HTMLStyleElement>,
|
||
HTMLStyleElement
|
||
>;
|
||
sub: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
summary: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
sup: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
table: DetailedHTMLFactory<
|
||
TableHTMLAttributes<HTMLTableElement>,
|
||
HTMLTableElement
|
||
>;
|
||
template: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLTemplateElement>,
|
||
HTMLTemplateElement
|
||
>;
|
||
tbody: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLTableSectionElement>,
|
||
HTMLTableSectionElement
|
||
>;
|
||
td: DetailedHTMLFactory<
|
||
TdHTMLAttributes<HTMLTableDataCellElement>,
|
||
HTMLTableDataCellElement
|
||
>;
|
||
textarea: DetailedHTMLFactory<
|
||
TextareaHTMLAttributes<HTMLTextAreaElement>,
|
||
HTMLTextAreaElement
|
||
>;
|
||
tfoot: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLTableSectionElement>,
|
||
HTMLTableSectionElement
|
||
>;
|
||
th: DetailedHTMLFactory<
|
||
ThHTMLAttributes<HTMLTableHeaderCellElement>,
|
||
HTMLTableHeaderCellElement
|
||
>;
|
||
thead: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLTableSectionElement>,
|
||
HTMLTableSectionElement
|
||
>;
|
||
time: DetailedHTMLFactory<TimeHTMLAttributes<HTMLElement>, HTMLElement>;
|
||
title: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLTitleElement>,
|
||
HTMLTitleElement
|
||
>;
|
||
tr: DetailedHTMLFactory<
|
||
HTMLAttributes<HTMLTableRowElement>,
|
||
HTMLTableRowElement
|
||
>;
|
||
track: DetailedHTMLFactory<
|
||
TrackHTMLAttributes<HTMLTrackElement>,
|
||
HTMLTrackElement
|
||
>;
|
||
u: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
ul: DetailedHTMLFactory<HTMLAttributes<HTMLUListElement>, HTMLUListElement>;
|
||
var: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
video: DetailedHTMLFactory<
|
||
VideoHTMLAttributes<HTMLVideoElement>,
|
||
HTMLVideoElement
|
||
>;
|
||
wbr: DetailedHTMLFactory<HTMLAttributes<HTMLElement>, HTMLElement>;
|
||
webview: DetailedHTMLFactory<
|
||
WebViewHTMLAttributes<HTMLWebViewElement>,
|
||
HTMLWebViewElement
|
||
>;
|
||
}
|
||
|
||
interface ReactSVG {
|
||
animate: SVGFactory;
|
||
circle: SVGFactory;
|
||
clipPath: SVGFactory;
|
||
defs: SVGFactory;
|
||
desc: SVGFactory;
|
||
ellipse: SVGFactory;
|
||
feBlend: SVGFactory;
|
||
feColorMatrix: SVGFactory;
|
||
feComponentTransfer: SVGFactory;
|
||
feComposite: SVGFactory;
|
||
feConvolveMatrix: SVGFactory;
|
||
feDiffuseLighting: SVGFactory;
|
||
feDisplacementMap: SVGFactory;
|
||
feDistantLight: SVGFactory;
|
||
feDropShadow: SVGFactory;
|
||
feFlood: SVGFactory;
|
||
feFuncA: SVGFactory;
|
||
feFuncB: SVGFactory;
|
||
feFuncG: SVGFactory;
|
||
feFuncR: SVGFactory;
|
||
feGaussianBlur: SVGFactory;
|
||
feImage: SVGFactory;
|
||
feMerge: SVGFactory;
|
||
feMergeNode: SVGFactory;
|
||
feMorphology: SVGFactory;
|
||
feOffset: SVGFactory;
|
||
fePointLight: SVGFactory;
|
||
feSpecularLighting: SVGFactory;
|
||
feSpotLight: SVGFactory;
|
||
feTile: SVGFactory;
|
||
feTurbulence: SVGFactory;
|
||
filter: SVGFactory;
|
||
foreignObject: SVGFactory;
|
||
g: SVGFactory;
|
||
image: SVGFactory;
|
||
line: SVGFactory;
|
||
linearGradient: SVGFactory;
|
||
marker: SVGFactory;
|
||
mask: SVGFactory;
|
||
metadata: SVGFactory;
|
||
path: SVGFactory;
|
||
pattern: SVGFactory;
|
||
polygon: SVGFactory;
|
||
polyline: SVGFactory;
|
||
radialGradient: SVGFactory;
|
||
rect: SVGFactory;
|
||
stop: SVGFactory;
|
||
svg: SVGFactory;
|
||
switch: SVGFactory;
|
||
symbol: SVGFactory;
|
||
text: SVGFactory;
|
||
textPath: SVGFactory;
|
||
tspan: SVGFactory;
|
||
use: SVGFactory;
|
||
view: SVGFactory;
|
||
}
|
||
|
||
interface ReactDOM extends ReactHTML, ReactSVG {}
|
||
|
||
//
|
||
// React.PropTypes
|
||
// ----------------------------------------------------------------------
|
||
|
||
type Validator<T> = PropTypes.Validator<T>;
|
||
|
||
type Requireable<T> = PropTypes.Requireable<T>;
|
||
|
||
type ValidationMap<T> = PropTypes.ValidationMap<T>;
|
||
|
||
type WeakValidationMap<T> = {
|
||
[K in keyof T]?: null extends T[K]
|
||
? Validator<T[K] | null | undefined>
|
||
: undefined extends T[K]
|
||
? Validator<T[K] | null | undefined>
|
||
: Validator<T[K]>;
|
||
};
|
||
|
||
interface ReactPropTypes {
|
||
any: typeof PropTypes.any;
|
||
array: typeof PropTypes.array;
|
||
bool: typeof PropTypes.bool;
|
||
func: typeof PropTypes.func;
|
||
number: typeof PropTypes.number;
|
||
object: typeof PropTypes.object;
|
||
string: typeof PropTypes.string;
|
||
node: typeof PropTypes.node;
|
||
element: typeof PropTypes.element;
|
||
instanceOf: typeof PropTypes.instanceOf;
|
||
oneOf: typeof PropTypes.oneOf;
|
||
oneOfType: typeof PropTypes.oneOfType;
|
||
arrayOf: typeof PropTypes.arrayOf;
|
||
objectOf: typeof PropTypes.objectOf;
|
||
shape: typeof PropTypes.shape;
|
||
exact: typeof PropTypes.exact;
|
||
}
|
||
|
||
//
|
||
// React.Children
|
||
// ----------------------------------------------------------------------
|
||
|
||
interface ReactChildren {
|
||
map<T, C>(
|
||
children: C | C[],
|
||
fn: (child: C, index: number) => T
|
||
): C extends null | undefined
|
||
? C
|
||
: Array<Exclude<T, boolean | null | undefined>>;
|
||
forEach<C>(children: C | C[], fn: (child: C, index: number) => void): void;
|
||
count(children: any): number;
|
||
only<C>(children: C): C extends any[] ? never : C;
|
||
toArray(
|
||
children: ReactNode | ReactNode[]
|
||
): Array<Exclude<ReactNode, boolean | null | undefined>>;
|
||
}
|
||
|
||
//
|
||
// Browser Interfaces
|
||
// https://github.com/nikeee/2048-typescript/blob/master/2048/js/touch.d.ts
|
||
// ----------------------------------------------------------------------
|
||
|
||
interface AbstractView {
|
||
styleMedia: StyleMedia;
|
||
document: Document;
|
||
}
|
||
|
||
interface Touch {
|
||
identifier: number;
|
||
target: EventTarget;
|
||
screenX: number;
|
||
screenY: number;
|
||
clientX: number;
|
||
clientY: number;
|
||
pageX: number;
|
||
pageY: number;
|
||
}
|
||
|
||
interface TouchList {
|
||
[index: number]: Touch;
|
||
length: number;
|
||
item(index: number): Touch;
|
||
identifiedTouch(identifier: number): Touch;
|
||
}
|
||
|
||
//
|
||
// Error Interfaces
|
||
// ----------------------------------------------------------------------
|
||
interface ErrorInfo {
|
||
/**
|
||
* Captures which component contained the exception, and its ancestors.
|
||
*/
|
||
componentStack: string;
|
||
}
|
||
}
|
||
|
||
// naked 'any' type in a conditional type will short circuit and union both the then/else branches
|
||
// so boolean is only resolved for T = any
|
||
type IsExactlyAny<T> = boolean extends (T extends never ? true : false)
|
||
? true
|
||
: false;
|
||
|
||
type ExactlyAnyPropertyKeys<T> = {
|
||
[K in keyof T]: IsExactlyAny<T[K]> extends true ? K : never;
|
||
}[keyof T];
|
||
type NotExactlyAnyPropertyKeys<T> = Exclude<keyof T, ExactlyAnyPropertyKeys<T>>;
|
||
|
||
// Try to resolve ill-defined props like for JS users: props can be any, or sometimes objects with properties of type any
|
||
type MergePropTypes<P, T> =
|
||
// Distribute over P in case it is a union type
|
||
P extends any // If props is type any, use propTypes definitions
|
||
? IsExactlyAny<P> extends true
|
||
? T // If declared props have indexed properties, ignore inferred props entirely as keyof gets widened
|
||
: string extends keyof P
|
||
? P // Prefer declared types which are not exactly any
|
||
: Pick<P, NotExactlyAnyPropertyKeys<P>> &
|
||
// For props which are exactly any, use the type inferred from propTypes if present
|
||
Pick<T, Exclude<keyof T, NotExactlyAnyPropertyKeys<P>>> &
|
||
// Keep leftover props not specified in propTypes
|
||
Pick<P, Exclude<keyof P, keyof T>>
|
||
: never;
|
||
|
||
// Any prop that has a default prop becomes optional, but its type is unchanged
|
||
// Undeclared default props are augmented into the resulting allowable attributes
|
||
// If declared props have indexed properties, ignore default props entirely as keyof gets widened
|
||
// Wrap in an outer-level conditional type to allow distribution over props that are unions
|
||
type Defaultize<P, D> = P extends any
|
||
? string extends keyof P
|
||
? P
|
||
: Pick<P, Exclude<keyof P, keyof D>> &
|
||
Partial<Pick<P, Extract<keyof P, keyof D>>> &
|
||
Partial<Pick<D, Exclude<keyof D, keyof P>>>
|
||
: never;
|
||
|
||
type ReactManagedAttributes<C, P> = C extends {
|
||
propTypes: infer T;
|
||
defaultProps: infer D;
|
||
}
|
||
? Defaultize<MergePropTypes<P, PropTypes.InferProps<T>>, D>
|
||
: C extends { propTypes: infer T }
|
||
? MergePropTypes<P, PropTypes.InferProps<T>>
|
||
: C extends { defaultProps: infer D }
|
||
? Defaultize<P, D>
|
||
: P;
|
||
|
||
declare global {
|
||
namespace JSX {
|
||
// tslint:disable-next-line:no-empty-interface
|
||
interface Element extends React.ReactElement<any, any> {}
|
||
interface ElementClass extends React.Component<any> {
|
||
render(): React.ReactNode;
|
||
}
|
||
interface ElementAttributesProperty {
|
||
props: {};
|
||
}
|
||
interface ElementChildrenAttribute {
|
||
children: {};
|
||
}
|
||
|
||
// We can't recurse forever because `type` can't be self-referential;
|
||
// let's assume it's reasonable to do a single React.lazy() around a single React.memo() / vice-versa
|
||
type LibraryManagedAttributes<C, P> = C extends
|
||
| React.MemoExoticComponent<infer T>
|
||
| React.LazyExoticComponent<infer T>
|
||
? T extends
|
||
| React.MemoExoticComponent<infer U>
|
||
| React.LazyExoticComponent<infer U>
|
||
? ReactManagedAttributes<U, P>
|
||
: ReactManagedAttributes<T, P>
|
||
: ReactManagedAttributes<C, P>;
|
||
|
||
// tslint:disable-next-line:no-empty-interface
|
||
interface IntrinsicAttributes extends React.Attributes {}
|
||
// tslint:disable-next-line:no-empty-interface
|
||
interface IntrinsicClassAttributes<T> extends React.ClassAttributes<T> {}
|
||
|
||
interface IntrinsicElements {
|
||
// HTML
|
||
a: React.DetailedHTMLProps<
|
||
React.AnchorHTMLAttributes<HTMLAnchorElement>,
|
||
HTMLAnchorElement
|
||
>;
|
||
abbr: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
address: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
area: React.DetailedHTMLProps<
|
||
React.AreaHTMLAttributes<HTMLAreaElement>,
|
||
HTMLAreaElement
|
||
>;
|
||
article: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
aside: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
audio: React.DetailedHTMLProps<
|
||
React.AudioHTMLAttributes<HTMLAudioElement>,
|
||
HTMLAudioElement
|
||
>;
|
||
b: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
base: React.DetailedHTMLProps<
|
||
React.BaseHTMLAttributes<HTMLBaseElement>,
|
||
HTMLBaseElement
|
||
>;
|
||
bdi: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
bdo: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
big: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
blockquote: React.DetailedHTMLProps<
|
||
React.BlockquoteHTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
body: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLBodyElement>,
|
||
HTMLBodyElement
|
||
>;
|
||
br: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLBRElement>,
|
||
HTMLBRElement
|
||
>;
|
||
button: React.DetailedHTMLProps<
|
||
React.ButtonHTMLAttributes<HTMLButtonElement>,
|
||
HTMLButtonElement
|
||
>;
|
||
canvas: React.DetailedHTMLProps<
|
||
React.CanvasHTMLAttributes<HTMLCanvasElement>,
|
||
HTMLCanvasElement
|
||
>;
|
||
caption: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
cite: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
code: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
col: React.DetailedHTMLProps<
|
||
React.ColHTMLAttributes<HTMLTableColElement>,
|
||
HTMLTableColElement
|
||
>;
|
||
colgroup: React.DetailedHTMLProps<
|
||
React.ColgroupHTMLAttributes<HTMLTableColElement>,
|
||
HTMLTableColElement
|
||
>;
|
||
data: React.DetailedHTMLProps<
|
||
React.DataHTMLAttributes<HTMLDataElement>,
|
||
HTMLDataElement
|
||
>;
|
||
datalist: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLDataListElement>,
|
||
HTMLDataListElement
|
||
>;
|
||
dd: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
del: React.DetailedHTMLProps<
|
||
React.DelHTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
details: React.DetailedHTMLProps<
|
||
React.DetailsHTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
dfn: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
dialog: React.DetailedHTMLProps<
|
||
React.DialogHTMLAttributes<HTMLDialogElement>,
|
||
HTMLDialogElement
|
||
>;
|
||
div: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLDivElement>,
|
||
HTMLDivElement
|
||
>;
|
||
dl: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLDListElement>,
|
||
HTMLDListElement
|
||
>;
|
||
dt: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
em: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
embed: React.DetailedHTMLProps<
|
||
React.EmbedHTMLAttributes<HTMLEmbedElement>,
|
||
HTMLEmbedElement
|
||
>;
|
||
fieldset: React.DetailedHTMLProps<
|
||
React.FieldsetHTMLAttributes<HTMLFieldSetElement>,
|
||
HTMLFieldSetElement
|
||
>;
|
||
figcaption: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
figure: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
footer: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
form: React.DetailedHTMLProps<
|
||
React.FormHTMLAttributes<HTMLFormElement>,
|
||
HTMLFormElement
|
||
>;
|
||
h1: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
h2: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
h3: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
h4: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
h5: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
h6: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLHeadingElement>,
|
||
HTMLHeadingElement
|
||
>;
|
||
head: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLHeadElement>,
|
||
HTMLHeadElement
|
||
>;
|
||
header: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
hgroup: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
hr: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLHRElement>,
|
||
HTMLHRElement
|
||
>;
|
||
html: React.DetailedHTMLProps<
|
||
React.HtmlHTMLAttributes<HTMLHtmlElement>,
|
||
HTMLHtmlElement
|
||
>;
|
||
i: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
iframe: React.DetailedHTMLProps<
|
||
React.IframeHTMLAttributes<HTMLIFrameElement>,
|
||
HTMLIFrameElement
|
||
>;
|
||
img: React.DetailedHTMLProps<
|
||
React.ImgHTMLAttributes<HTMLImageElement>,
|
||
HTMLImageElement
|
||
>;
|
||
input: React.DetailedHTMLProps<
|
||
React.InputHTMLAttributes<HTMLInputElement>,
|
||
HTMLInputElement
|
||
>;
|
||
ins: React.DetailedHTMLProps<
|
||
React.InsHTMLAttributes<HTMLModElement>,
|
||
HTMLModElement
|
||
>;
|
||
kbd: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
keygen: React.DetailedHTMLProps<
|
||
React.KeygenHTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
label: React.DetailedHTMLProps<
|
||
React.LabelHTMLAttributes<HTMLLabelElement>,
|
||
HTMLLabelElement
|
||
>;
|
||
legend: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLLegendElement>,
|
||
HTMLLegendElement
|
||
>;
|
||
li: React.DetailedHTMLProps<
|
||
React.LiHTMLAttributes<HTMLLIElement>,
|
||
HTMLLIElement
|
||
>;
|
||
link: React.DetailedHTMLProps<
|
||
React.LinkHTMLAttributes<HTMLLinkElement>,
|
||
HTMLLinkElement
|
||
>;
|
||
main: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
map: React.DetailedHTMLProps<
|
||
React.MapHTMLAttributes<HTMLMapElement>,
|
||
HTMLMapElement
|
||
>;
|
||
mark: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
menu: React.DetailedHTMLProps<
|
||
React.MenuHTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
menuitem: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
meta: React.DetailedHTMLProps<
|
||
React.MetaHTMLAttributes<HTMLMetaElement>,
|
||
HTMLMetaElement
|
||
>;
|
||
meter: React.DetailedHTMLProps<
|
||
React.MeterHTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
nav: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
noindex: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
noscript: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
object: React.DetailedHTMLProps<
|
||
React.ObjectHTMLAttributes<HTMLObjectElement>,
|
||
HTMLObjectElement
|
||
>;
|
||
ol: React.DetailedHTMLProps<
|
||
React.OlHTMLAttributes<HTMLOListElement>,
|
||
HTMLOListElement
|
||
>;
|
||
optgroup: React.DetailedHTMLProps<
|
||
React.OptgroupHTMLAttributes<HTMLOptGroupElement>,
|
||
HTMLOptGroupElement
|
||
>;
|
||
option: React.DetailedHTMLProps<
|
||
React.OptionHTMLAttributes<HTMLOptionElement>,
|
||
HTMLOptionElement
|
||
>;
|
||
output: React.DetailedHTMLProps<
|
||
React.OutputHTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
p: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLParagraphElement>,
|
||
HTMLParagraphElement
|
||
>;
|
||
param: React.DetailedHTMLProps<
|
||
React.ParamHTMLAttributes<HTMLParamElement>,
|
||
HTMLParamElement
|
||
>;
|
||
picture: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
pre: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLPreElement>,
|
||
HTMLPreElement
|
||
>;
|
||
progress: React.DetailedHTMLProps<
|
||
React.ProgressHTMLAttributes<HTMLProgressElement>,
|
||
HTMLProgressElement
|
||
>;
|
||
q: React.DetailedHTMLProps<
|
||
React.QuoteHTMLAttributes<HTMLQuoteElement>,
|
||
HTMLQuoteElement
|
||
>;
|
||
rp: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
rt: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
ruby: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
s: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
samp: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
script: React.DetailedHTMLProps<
|
||
React.ScriptHTMLAttributes<HTMLScriptElement>,
|
||
HTMLScriptElement
|
||
>;
|
||
section: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
select: React.DetailedHTMLProps<
|
||
React.SelectHTMLAttributes<HTMLSelectElement>,
|
||
HTMLSelectElement
|
||
>;
|
||
small: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
source: React.DetailedHTMLProps<
|
||
React.SourceHTMLAttributes<HTMLSourceElement>,
|
||
HTMLSourceElement
|
||
>;
|
||
span: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLSpanElement>,
|
||
HTMLSpanElement
|
||
>;
|
||
strong: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
style: React.DetailedHTMLProps<
|
||
React.StyleHTMLAttributes<HTMLStyleElement>,
|
||
HTMLStyleElement
|
||
>;
|
||
sub: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
summary: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
sup: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
table: React.DetailedHTMLProps<
|
||
React.TableHTMLAttributes<HTMLTableElement>,
|
||
HTMLTableElement
|
||
>;
|
||
template: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLTemplateElement>,
|
||
HTMLTemplateElement
|
||
>;
|
||
tbody: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLTableSectionElement>,
|
||
HTMLTableSectionElement
|
||
>;
|
||
td: React.DetailedHTMLProps<
|
||
React.TdHTMLAttributes<HTMLTableDataCellElement>,
|
||
HTMLTableDataCellElement
|
||
>;
|
||
textarea: React.DetailedHTMLProps<
|
||
React.TextareaHTMLAttributes<HTMLTextAreaElement>,
|
||
HTMLTextAreaElement
|
||
>;
|
||
tfoot: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLTableSectionElement>,
|
||
HTMLTableSectionElement
|
||
>;
|
||
th: React.DetailedHTMLProps<
|
||
React.ThHTMLAttributes<HTMLTableHeaderCellElement>,
|
||
HTMLTableHeaderCellElement
|
||
>;
|
||
thead: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLTableSectionElement>,
|
||
HTMLTableSectionElement
|
||
>;
|
||
time: React.DetailedHTMLProps<
|
||
React.TimeHTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
title: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLTitleElement>,
|
||
HTMLTitleElement
|
||
>;
|
||
tr: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLTableRowElement>,
|
||
HTMLTableRowElement
|
||
>;
|
||
track: React.DetailedHTMLProps<
|
||
React.TrackHTMLAttributes<HTMLTrackElement>,
|
||
HTMLTrackElement
|
||
>;
|
||
u: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
ul: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLUListElement>,
|
||
HTMLUListElement
|
||
>;
|
||
var: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
video: React.DetailedHTMLProps<
|
||
React.VideoHTMLAttributes<HTMLVideoElement>,
|
||
HTMLVideoElement
|
||
>;
|
||
wbr: React.DetailedHTMLProps<
|
||
React.HTMLAttributes<HTMLElement>,
|
||
HTMLElement
|
||
>;
|
||
webview: React.DetailedHTMLProps<
|
||
React.WebViewHTMLAttributes<HTMLWebViewElement>,
|
||
HTMLWebViewElement
|
||
>;
|
||
|
||
// SVG
|
||
svg: React.SVGProps<SVGSVGElement>;
|
||
|
||
animate: React.SVGProps<SVGElement>; // TODO: It is SVGAnimateElement but is not in TypeScript's lib.dom.d.ts for now.
|
||
animateMotion: React.SVGProps<SVGElement>;
|
||
animateTransform: React.SVGProps<SVGElement>; // TODO: It is SVGAnimateTransformElement but is not in TypeScript's lib.dom.d.ts for now.
|
||
circle: React.SVGProps<SVGCircleElement>;
|
||
clipPath: React.SVGProps<SVGClipPathElement>;
|
||
defs: React.SVGProps<SVGDefsElement>;
|
||
desc: React.SVGProps<SVGDescElement>;
|
||
ellipse: React.SVGProps<SVGEllipseElement>;
|
||
feBlend: React.SVGProps<SVGFEBlendElement>;
|
||
feColorMatrix: React.SVGProps<SVGFEColorMatrixElement>;
|
||
feComponentTransfer: React.SVGProps<SVGFEComponentTransferElement>;
|
||
feComposite: React.SVGProps<SVGFECompositeElement>;
|
||
feConvolveMatrix: React.SVGProps<SVGFEConvolveMatrixElement>;
|
||
feDiffuseLighting: React.SVGProps<SVGFEDiffuseLightingElement>;
|
||
feDisplacementMap: React.SVGProps<SVGFEDisplacementMapElement>;
|
||
feDistantLight: React.SVGProps<SVGFEDistantLightElement>;
|
||
feDropShadow: React.SVGProps<SVGFEDropShadowElement>;
|
||
feFlood: React.SVGProps<SVGFEFloodElement>;
|
||
feFuncA: React.SVGProps<SVGFEFuncAElement>;
|
||
feFuncB: React.SVGProps<SVGFEFuncBElement>;
|
||
feFuncG: React.SVGProps<SVGFEFuncGElement>;
|
||
feFuncR: React.SVGProps<SVGFEFuncRElement>;
|
||
feGaussianBlur: React.SVGProps<SVGFEGaussianBlurElement>;
|
||
feImage: React.SVGProps<SVGFEImageElement>;
|
||
feMerge: React.SVGProps<SVGFEMergeElement>;
|
||
feMergeNode: React.SVGProps<SVGFEMergeNodeElement>;
|
||
feMorphology: React.SVGProps<SVGFEMorphologyElement>;
|
||
feOffset: React.SVGProps<SVGFEOffsetElement>;
|
||
fePointLight: React.SVGProps<SVGFEPointLightElement>;
|
||
feSpecularLighting: React.SVGProps<SVGFESpecularLightingElement>;
|
||
feSpotLight: React.SVGProps<SVGFESpotLightElement>;
|
||
feTile: React.SVGProps<SVGFETileElement>;
|
||
feTurbulence: React.SVGProps<SVGFETurbulenceElement>;
|
||
filter: React.SVGProps<SVGFilterElement>;
|
||
foreignObject: React.SVGProps<SVGForeignObjectElement>;
|
||
g: React.SVGProps<SVGGElement>;
|
||
image: React.SVGProps<SVGImageElement>;
|
||
line: React.SVGProps<SVGLineElement>;
|
||
linearGradient: React.SVGProps<SVGLinearGradientElement>;
|
||
marker: React.SVGProps<SVGMarkerElement>;
|
||
mask: React.SVGProps<SVGMaskElement>;
|
||
metadata: React.SVGProps<SVGMetadataElement>;
|
||
mpath: React.SVGProps<SVGElement>;
|
||
path: React.SVGProps<SVGPathElement>;
|
||
pattern: React.SVGProps<SVGPatternElement>;
|
||
polygon: React.SVGProps<SVGPolygonElement>;
|
||
polyline: React.SVGProps<SVGPolylineElement>;
|
||
radialGradient: React.SVGProps<SVGRadialGradientElement>;
|
||
rect: React.SVGProps<SVGRectElement>;
|
||
stop: React.SVGProps<SVGStopElement>;
|
||
switch: React.SVGProps<SVGSwitchElement>;
|
||
symbol: React.SVGProps<SVGSymbolElement>;
|
||
text: React.SVGProps<SVGTextElement>;
|
||
textPath: React.SVGProps<SVGTextPathElement>;
|
||
tspan: React.SVGProps<SVGTSpanElement>;
|
||
use: React.SVGProps<SVGUseElement>;
|
||
view: React.SVGProps<SVGViewElement>;
|
||
}
|
||
}
|
||
}
|