kea-react/src/async.d.ts

Componentes comunes de react

/// <reference types="react" />
import React = require('react');
export interface AsyncProps<T> {
    /**Promesa que al ser resuelta devuelve el valor que se utilizará para dibujar el control */
    value: PromiseLike<T> | T;
    /**Dibuja el componente dado el resultado de la promesa */
    map: (value: T) => JSX.Element | null;
    /**Componente que se va a mostrar cuando se este cargando, si no se define se usara el spinner */
    cargando?: JSX.Element | null;
    /**Componente que se va a mostrar cuando se este en estado de error, si no se define se usara un label rojo */
    error?: (error: string | number) => JSX.Element | null;
    /**Tiempo que se debe de esperar antes de poner el cargando en milisegundos. Por default son 500 ms */
    delay?: number;
}
export interface AsyncState<T> {
    /**Resultado del query*/
    Model?: T | null;
    /**True si se estan cargando los elementos */
    Cargando?: boolean;
    /**Si hubo un error al cargar se mostrará aqui */
    Error?: string | number | null;
}
/**Muestra un componente que depende del valor de una promesa */
export declare class Async extends React.PureComponent<AsyncProps<any>, AsyncState<any>> {
    constructor(props: any);
    componentWillMount(): void;
    updateValue(nextValue: PromiseLike<any> | any): void;
    componentWillReceiveProps(nextProps: AsyncProps<any>): void;
    _isMounted: boolean;
    componentWillUnmount(): void;
    private currentVersion;
    refreshPromise: (promise: PromiseLike<any>) => Promise<void>;
    readonly CargandoComponent: JSX.Element | null;
    readonly ErrorComponent: JSX.Element | null;
    render(): JSX.Element | null;
}
/**Muestra un componente basado en el resultado de una promesa
 * @param value Promesa que se va a resolver para mostrar el componente
 * @param map Función que toma el resultado de la promesa y devuelve el componente que se desea dibujar
 */
export declare function async<T>(value: T | PromiseLike<T>, map: (value: T) => JSX.Element | null, options?: {
    /**Componente que se va a mostrar cuando se este cargando, si no se define se usara el spinner */
    cargando?: JSX.Element | null;
    /**Componente que se va a mostrar cuando se este en estado de error, si no se define se usara un label rojo */
    error?: (error: string | number) => JSX.Element | null;
    /**Tiempo que se debe de esperar antes de poner el cargando en milisegundos. Por default son 500 ms */
    delay?: number;
}): JSX.Element;
export declare type PromiseValue<T> = {
    value: T;
    status: "done";
} | {
    status: "pending";
} | {
    status: "error";
    error: any;
};
/**
 * Muestra un componente basado en el resultado ya sea resuelto, pendiente o erroneo de una promesa
 * @param value Promesa
 * @param map Funcion que mapea el estado de la promesa a un componente de real
 */
export declare function asyncProps<T>(value: T | PromiseLike<T>, map: (value: PromiseValue<T>) => JSX.Element | null): JSX.Element;
/**Crea una nueva promesa y devuelve por separado la promesa y las funciones que resuelven y rechazan a la promesa */
export declare function splitPromise<T>(): {
    promise: Promise<T>;
    resolve: (value?: T | PromiseLike<T> | undefined) => void;
    reject: (reason?: any) => void;
};
/**Crea una promesa que se resuelve en cierto tiempo */
export declare function delay<T>(milliseconds: number): Promise<void>;